@draftbit/core 46.8.2-088bf8.2 → 46.8.2-0a0db3.2

package/src/mappings/TabView.js

@@ -0,0 +1,76 @@
+import { COMPONENT_TYPES, createTextEnumProp, createColorProp, StylesPanelSections, Triggers, createActionProp, createStaticBoolProp, GROUPS, } from "@draftbit/types";
+export const SEED_DATA = {
+    name: "Tab View",
+    tag: "TabView",
+    description: "Tab view container",
+    category: COMPONENT_TYPES.swiper,
+    stylesPanelSections: [
+        StylesPanelSections.Size,
+        StylesPanelSections.MarginsAndPaddings,
+        StylesPanelSections.Position,
+        StylesPanelSections.Effects,
+        StylesPanelSections.LayoutSelectedItem,
+        StylesPanelSections.Background,
+        StylesPanelSections.Typography,
+    ],
+    layout: { flex: 1 },
+    triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
+    props: {
+        onIndexChanged: createActionProp({
+            label: "On index changed",
+            description: "Action to execute when swipe to new index",
+        }),
+        onEndReached: createActionProp({
+            label: "On end reached",
+            description: "Action to execute when end of swiping reached",
+        }),
+        tabBarPosition: createTextEnumProp({
+            label: "Tab Bar Position",
+            description: "Position of tab bar",
+            options: ["top", "bottom"],
+            defaultValue: "top",
+        }),
+        keyboardDismissMode: createTextEnumProp({
+            label: "Keyboard Dismiss Mode",
+            description: "Keyboard Dismiss Mode",
+            options: ["auto", "on-drag", "none"],
+            defaultValue: "auto",
+        }),
+        swipeEnabled: createStaticBoolProp({
+            label: "Swipe Enabled",
+            description: "Whether swiping is enabled or not",
+            defaultValue: true,
+        }),
+        scrollEnabled: createStaticBoolProp({
+            label: "Tab Scroll Enabled",
+            description: "Whether scrolling of tabs is enabled or not",
+            defaultValue: false,
+        }),
+        activeColor: createColorProp({
+            label: "Active Color",
+            description: "Color of icon and text of active tab",
+            defaultValue: "primary",
+        }),
+        inactiveColor: createColorProp({
+            label: "Inactive Color",
+            description: "Color of icon and text of inactive tab(s)",
+            defaultValue: null,
+        }),
+        pressColor: createColorProp({
+            label: "Press Color",
+            description: "Color of ripple when pressed",
+            defaultValue: "primary",
+            group: GROUPS.android,
+        }),
+        indicatorColor: createColorProp({
+            label: "Indicator Color",
+            description: "Color of indicator",
+            defaultValue: "primary",
+        }),
+        tabsBackgroundColor: createColorProp({
+            label: "Tabs Background Color",
+            description: "Background color of tabs container",
+            defaultValue: "background",
+        }),
+    },
+};

package/src/mappings/TabView.ts

@@ -0,0 +1,86 @@
+import {
+  COMPONENT_TYPES,
+  createTextEnumProp,
+  createColorProp,
+  StylesPanelSections,
+  Triggers,
+  createActionProp,
+  createStaticBoolProp,
+  GROUPS,
+} from "@draftbit/types";
+
+export const SEED_DATA = {
+  name: "Tab View",
+  tag: "TabView",
+  description: "Tab view container",
+  category: COMPONENT_TYPES.swiper,
+  stylesPanelSections: [
+    StylesPanelSections.Size,
+    StylesPanelSections.MarginsAndPaddings,
+    StylesPanelSections.Position,
+    StylesPanelSections.Effects,
+    StylesPanelSections.LayoutSelectedItem,
+    StylesPanelSections.Background,
+    StylesPanelSections.Typography,
+  ],
+  layout: { flex: 1 },
+  triggers: [Triggers.OnIndexChanged, Triggers.OnEndReached],
+  props: {
+    onIndexChanged: createActionProp({
+      label: "On index changed",
+      description: "Action to execute when swipe to new index",
+    }),
+    onEndReached: createActionProp({
+      label: "On end reached",
+      description: "Action to execute when end of swiping reached",
+    }),
+    tabBarPosition: createTextEnumProp({
+      label: "Tab Bar Position",
+      description: "Position of tab bar",
+      options: ["top", "bottom"],
+      defaultValue: "top",
+    }),
+    keyboardDismissMode: createTextEnumProp({
+      label: "Keyboard Dismiss Mode",
+      description: "Keyboard Dismiss Mode",
+      options: ["auto", "on-drag", "none"],
+      defaultValue: "auto",
+    }),
+    swipeEnabled: createStaticBoolProp({
+      label: "Swipe Enabled",
+      description: "Whether swiping is enabled or not",
+      defaultValue: true,
+    }),
+    scrollEnabled: createStaticBoolProp({
+      label: "Tab Scroll Enabled",
+      description: "Whether scrolling of tabs is enabled or not",
+      defaultValue: false,
+    }),
+    activeColor: createColorProp({
+      label: "Active Color",
+      description: "Color of icon and text of active tab",
+      defaultValue: "primary",
+    }),
+    inactiveColor: createColorProp({
+      label: "Inactive Color",
+      description: "Color of icon and text of inactive tab(s)",
+      defaultValue: null,
+    }),
+    pressColor: createColorProp({
+      label: "Press Color",
+      description: "Color of ripple when pressed",
+      defaultValue: "primary",
+      group: GROUPS.android,
+    }),
+    indicatorColor: createColorProp({
+      label: "Indicator Color",
+      description: "Color of indicator",
+      defaultValue: "primary",
+    }),
+    tabsBackgroundColor: createColorProp({
+      label: "Tabs Background Color",
+      description: "Background color of tabs container",
+      defaultValue: "background",
+    }),
+  },
+};

package/src/mappings/TabViewItem.js

@@ -0,0 +1,30 @@
+import { COMPONENT_TYPES, createTextProp, createIconProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS, } from "@draftbit/types";
+export const SEED_DATA = {
+    name: "Tab View Item",
+    tag: "TabViewItem",
+    description: "Single Tab View item to be used in TabView. Each item represents a single tab and its content",
+    category: COMPONENT_TYPES.swiper,
+    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+    layout: {
+        flex: 1,
+    },
+    props: {
+        title: createTextProp({
+            label: "Title",
+            description: "Title of tab item",
+            defaultValue: "Title",
+            required: true,
+            group: GROUPS.basic,
+        }),
+        icon: createIconProp({
+            defaultValue: null,
+            required: false,
+        }),
+        accessibilityLabel: createTextProp({
+            label: "Accessibility Label",
+            description: "Accessibility Label",
+            defaultValue: null,
+            group: GROUPS.accessibility,
+        }),
+    },
+};

package/src/mappings/TabViewItem.ts

@@ -0,0 +1,38 @@
+import {
+  COMPONENT_TYPES,
+  createTextProp,
+  createIconProp,
+  CONTAINER_COMPONENT_STYLES_SECTIONS,
+  GROUPS,
+} from "@draftbit/types";
+
+export const SEED_DATA = {
+  name: "Tab View Item",
+  tag: "TabViewItem",
+  description:
+    "Single Tab View item to be used in TabView. Each item represents a single tab and its content",
+  category: COMPONENT_TYPES.swiper,
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+  layout: {
+    flex: 1,
+  },
+  props: {
+    title: createTextProp({
+      label: "Title",
+      description: "Title of tab item",
+      defaultValue: "Title",
+      required: true,
+      group: GROUPS.basic,
+    }),
+    icon: createIconProp({
+      defaultValue: null,
+      required: false,
+    }),
+    accessibilityLabel: createTextProp({
+      label: "Accessibility Label",
+      description: "Accessibility Label",
+      defaultValue: null,
+      group: GROUPS.accessibility,
+    }),
+  },
+};

package/lib/commonjs/mappings/HtmlElements.js

@@ -1,177 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SEED_DATA = void 0;
-var _types = require("@draftbit/types");
-const SEED_DATA_TRIGGERS = [_types.Triggers.OnValueChange];
-const ELEMENT_SEED_DATA = {
-  doc_link: "https://www.npmjs.com/package/@expo/html-elements",
-  code_link: "https://github.com/expo/expo/tree/master/packages/html-elements",
-  packageName: "@expo/html-elements",
-  stylesPanelSections: [_types.StylesPanelSections.Typography, _types.StylesPanelSections.LayoutSelectedItem, _types.StylesPanelSections.MarginsAndPaddings, _types.StylesPanelSections.Effects],
-  layout: {
-    margin: 0
-  },
-  triggers: SEED_DATA_TRIGGERS,
-  category: _types.COMPONENT_TYPES.webelement
-};
-const HEADING_SEED_DATA = {
-  ...ELEMENT_SEED_DATA,
-  category: _types.COMPONENT_TYPES.text,
-  props: {
-    accessibilityLabel: {
-      group: _types.GROUPS.accessibility,
-      name: "accessibilityLabel",
-      label: "accessibilityLabel",
-      description: "Overrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space.",
-      editable: true,
-      required: false,
-      formType: _types.FORM_TYPES.string,
-      propType: _types.PROP_TYPES.STRING,
-      defaultValue: null
-    },
-    selectable: {
-      group: _types.GROUPS.advanced,
-      name: "selectable",
-      label: "selectable",
-      description: "Lets the user select text, to use the native copy and paste functionality.",
-      editable: true,
-      required: false,
-      formType: _types.FORM_TYPES.boolean,
-      propType: _types.PROP_TYPES.BOOLEAN,
-      defaultValue: null
-    },
-    children: {
-      group: _types.GROUPS.data,
-      label: "Text",
-      description: "Text",
-      editable: true,
-      required: true,
-      formType: _types.FORM_TYPES.string,
-      propType: _types.PROP_TYPES.STRING,
-      defaultValue: "Your Headline Here"
-    }
-  }
-};
-const TEXT_SEED_DATA = {
-  ...ELEMENT_SEED_DATA,
-  category: _types.COMPONENT_TYPES.text,
-  props: {
-    children: {
-      group: _types.GROUPS.data,
-      label: "Text",
-      description: "Text",
-      defaultValue: "Your Text Here",
-      editable: true,
-      required: true,
-      formType: _types.FORM_TYPES.string,
-      propType: _types.PROP_TYPES.STRING
-    }
-  }
-};
-const SEED_DATA = [{
-  name: "H1",
-  tag: "H1",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H2",
-  tag: "H2",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H3",
-  tag: "H3",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H4",
-  tag: "H4",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H5",
-  tag: "H5",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H6",
-  tag: "H6",
-  ...HEADING_SEED_DATA
-}, {
-  name: "Anchor",
-  tag: "A",
-  ...TEXT_SEED_DATA,
-  props: {
-    href: (0, _types.createTextProp)({
-      label: "href",
-      description: "Specify the URL",
-      defaultValue: ""
-    }),
-    target: {
-      group: _types.GROUPS.basic,
-      label: "target",
-      description: "decide where link should open",
-      formType: _types.FORM_TYPES.flatArray,
-      defaultValue: "_blank",
-      options: ["_blank", "_self", "_parent", "_top"]
-    }
-  }
-}, {
-  name: "Paragraph",
-  tag: "P",
-  ...TEXT_SEED_DATA,
-  props: {
-    // NOTE - Keeping the props commented until we figure out a way to use this props from draftbit side.
-    // strong: createBoolProp({
-    //     label: "Strong",
-    //     description: "Strong",
-    // }),
-    // strike: createBoolProp({
-    //     label: "Strike",
-    //     description: "Strike through",
-    // }),
-    // italic: createBoolProp({
-    //     label: "Italic",
-    //     description: "Italic Fonts",
-    // }),
-    // bold: createBoolProp({
-    //     label: "Bold",
-    //     description: "Bold",
-    // }),
-  }
-}, {
-  name: "Code",
-  tag: "Code",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Pre",
-  tag: "Pre",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Mark",
-  tag: "Mark",
-  ...TEXT_SEED_DATA
-}, {
-  name: "BR",
-  tag: "BR",
-  ...TEXT_SEED_DATA
-}, {
-  name: "BlockQuote",
-  tag: "BlockQuote",
-  ...TEXT_SEED_DATA
-}, {
-  name: "HR",
-  tag: "HR",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Time",
-  tag: "Time",
-  ...ELEMENT_SEED_DATA
-}, {
-  name: "UL",
-  tag: "UL",
-  ...ELEMENT_SEED_DATA
-}, {
-  name: "LI",
-  tag: "LI",
-  ...ELEMENT_SEED_DATA
-}];
-exports.SEED_DATA = SEED_DATA;

package/lib/module/mappings/HtmlElements.js

@@ -1,170 +0,0 @@
-import { COMPONENT_TYPES, createTextProp, FORM_TYPES, PROP_TYPES, GROUPS, StylesPanelSections, Triggers } from "@draftbit/types";
-const SEED_DATA_TRIGGERS = [Triggers.OnValueChange];
-const ELEMENT_SEED_DATA = {
-  doc_link: "https://www.npmjs.com/package/@expo/html-elements",
-  code_link: "https://github.com/expo/expo/tree/master/packages/html-elements",
-  packageName: "@expo/html-elements",
-  stylesPanelSections: [StylesPanelSections.Typography, StylesPanelSections.LayoutSelectedItem, StylesPanelSections.MarginsAndPaddings, StylesPanelSections.Effects],
-  layout: {
-    margin: 0
-  },
-  triggers: SEED_DATA_TRIGGERS,
-  category: COMPONENT_TYPES.webelement
-};
-const HEADING_SEED_DATA = {
-  ...ELEMENT_SEED_DATA,
-  category: COMPONENT_TYPES.text,
-  props: {
-    accessibilityLabel: {
-      group: GROUPS.accessibility,
-      name: "accessibilityLabel",
-      label: "accessibilityLabel",
-      description: "Overrides the text that's read by the screen reader when the user interacts with the element. By default, the label is constructed by traversing all the children and accumulating all the Text nodes separated by space.",
-      editable: true,
-      required: false,
-      formType: FORM_TYPES.string,
-      propType: PROP_TYPES.STRING,
-      defaultValue: null
-    },
-    selectable: {
-      group: GROUPS.advanced,
-      name: "selectable",
-      label: "selectable",
-      description: "Lets the user select text, to use the native copy and paste functionality.",
-      editable: true,
-      required: false,
-      formType: FORM_TYPES.boolean,
-      propType: PROP_TYPES.BOOLEAN,
-      defaultValue: null
-    },
-    children: {
-      group: GROUPS.data,
-      label: "Text",
-      description: "Text",
-      editable: true,
-      required: true,
-      formType: FORM_TYPES.string,
-      propType: PROP_TYPES.STRING,
-      defaultValue: "Your Headline Here"
-    }
-  }
-};
-const TEXT_SEED_DATA = {
-  ...ELEMENT_SEED_DATA,
-  category: COMPONENT_TYPES.text,
-  props: {
-    children: {
-      group: GROUPS.data,
-      label: "Text",
-      description: "Text",
-      defaultValue: "Your Text Here",
-      editable: true,
-      required: true,
-      formType: FORM_TYPES.string,
-      propType: PROP_TYPES.STRING
-    }
-  }
-};
-export const SEED_DATA = [{
-  name: "H1",
-  tag: "H1",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H2",
-  tag: "H2",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H3",
-  tag: "H3",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H4",
-  tag: "H4",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H5",
-  tag: "H5",
-  ...HEADING_SEED_DATA
-}, {
-  name: "H6",
-  tag: "H6",
-  ...HEADING_SEED_DATA
-}, {
-  name: "Anchor",
-  tag: "A",
-  ...TEXT_SEED_DATA,
-  props: {
-    href: createTextProp({
-      label: "href",
-      description: "Specify the URL",
-      defaultValue: ""
-    }),
-    target: {
-      group: GROUPS.basic,
-      label: "target",
-      description: "decide where link should open",
-      formType: FORM_TYPES.flatArray,
-      defaultValue: "_blank",
-      options: ["_blank", "_self", "_parent", "_top"]
-    }
-  }
-}, {
-  name: "Paragraph",
-  tag: "P",
-  ...TEXT_SEED_DATA,
-  props: {
-    // NOTE - Keeping the props commented until we figure out a way to use this props from draftbit side.
-    // strong: createBoolProp({
-    //     label: "Strong",
-    //     description: "Strong",
-    // }),
-    // strike: createBoolProp({
-    //     label: "Strike",
-    //     description: "Strike through",
-    // }),
-    // italic: createBoolProp({
-    //     label: "Italic",
-    //     description: "Italic Fonts",
-    // }),
-    // bold: createBoolProp({
-    //     label: "Bold",
-    //     description: "Bold",
-    // }),
-  }
-}, {
-  name: "Code",
-  tag: "Code",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Pre",
-  tag: "Pre",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Mark",
-  tag: "Mark",
-  ...TEXT_SEED_DATA
-}, {
-  name: "BR",
-  tag: "BR",
-  ...TEXT_SEED_DATA
-}, {
-  name: "BlockQuote",
-  tag: "BlockQuote",
-  ...TEXT_SEED_DATA
-}, {
-  name: "HR",
-  tag: "HR",
-  ...TEXT_SEED_DATA
-}, {
-  name: "Time",
-  tag: "Time",
-  ...ELEMENT_SEED_DATA
-}, {
-  name: "UL",
-  tag: "UL",
-  ...ELEMENT_SEED_DATA
-}, {
-  name: "LI",
-  tag: "LI",
-  ...ELEMENT_SEED_DATA
-}];

package/lib/typescript/src/mappings/HtmlElements.d.ts

@@ -1,77 +0,0 @@
-export declare const SEED_DATA: ({
-    props: {
-        href: any;
-        target: {
-            group: string;
-            label: string;
-            description: string;
-            formType: string;
-            defaultValue: string;
-            options: string[];
-        };
-    };
-    category: string;
-    doc_link: string;
-    code_link: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    layout: {
-        margin: number;
-    };
-    triggers: string[];
-    name: string;
-    tag: string;
-} | {
-    props: {
-        href?: undefined;
-        target?: undefined;
-    };
-    category: string;
-    doc_link: string;
-    code_link: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    layout: {
-        margin: number;
-    };
-    triggers: string[];
-    name: string;
-    tag: string;
-} | {
-    category: string;
-    props: {
-        children: {
-            group: string;
-            label: string;
-            description: string;
-            defaultValue: string;
-            editable: boolean;
-            required: boolean;
-            formType: string;
-            propType: string;
-        };
-    };
-    doc_link: string;
-    code_link: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    layout: {
-        margin: number;
-    };
-    triggers: string[];
-    name: string;
-    tag: string;
-} | {
-    doc_link: string;
-    code_link: string;
-    packageName: string;
-    stylesPanelSections: string[];
-    layout: {
-        margin: number;
-    };
-    triggers: string[];
-    category: string;
-    name: string;
-    tag: string;
-})[];
-//# sourceMappingURL=HtmlElements.d.ts.map

package/lib/typescript/src/mappings/HtmlElements.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"HtmlElements.d.ts","sourceRoot":"","sources":["../../../../src/mappings/HtmlElements.ts"],"names":[],"mappings":"AAsFA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAwHrB,CAAC"}