@draftbit/core 47.0.1-17098e.2 → 47.0.1-2aab54.2

package/src/mappings/NativeBase/Other.js

@@ -0,0 +1,123 @@
+import { COMPONENT_TYPES, StylesPanelSections, createTextEnumProp, createTextProp, createIconProp, createBoolProp, createDisabledProp, createStaticNumberProp, createStaticBoolProp, Triggers, createActionProp, } from "@draftbit/types";
+export const SEED_DATA = [
+    {
+        name: "FAB",
+        tag: "Fab",
+        description: "A floating action button (FAB) is a circular icon button that hovers over content to execute a primary action in the application.",
+        category: COMPONENT_TYPES.NBForms,
+        packageName: "native-base",
+        doc_link: "https://www.npmjs.com/package/@expo/html-elements",
+        code_link: "https://github.com/expo/expo/tree/master/packages/html-elements",
+        stylesPanelSections: [
+            StylesPanelSections.LayoutFlexItems,
+            StylesPanelSections.LayoutSelectedItem,
+            StylesPanelSections.LayoutContent,
+            StylesPanelSections.Background,
+            StylesPanelSections.Size,
+            StylesPanelSections.MarginsAndPaddings,
+            StylesPanelSections.Position,
+            StylesPanelSections.Borders,
+            StylesPanelSections.Effects,
+        ],
+        layout: {},
+        triggers: {},
+        props: {
+            placement: createTextEnumProp({
+                label: "Placement",
+                description: "The placement of the Fab relative to the device.",
+                options: ["bottom-right", "top-right", "top-left", "bottom-left"],
+                defaultValue: "bottom-right",
+            }),
+            label: createTextProp({
+                label: "Label",
+                description: "The Text to be displayed in Fab.",
+            }),
+            icon: createIconProp({
+                label: "Icon",
+                description: "Icon to be displayed in Fab.  ",
+            }),
+        },
+    },
+    {
+        name: "Tooltip",
+        tag: "Tooltip",
+        description: "A tooltip provides a brief, informative message when a user interacts with an element. Methods of tooltip initiation include: through a mouse-hover gesture or a keyboard-hover gesture.",
+        category: COMPONENT_TYPES.NBOther,
+        packageName: "native-base",
+        allowChildren: true,
+        stylesPanelSections: [
+            StylesPanelSections.LayoutFlexItems,
+            StylesPanelSections.LayoutSelectedItem,
+            StylesPanelSections.LayoutContent,
+            StylesPanelSections.Background,
+            StylesPanelSections.Size,
+            StylesPanelSections.MarginsAndPaddings,
+            StylesPanelSections.Position,
+            StylesPanelSections.Borders,
+            StylesPanelSections.Effects,
+        ],
+        layout: {},
+        triggers: [Triggers.OnOpen, Triggers.OnClose],
+        props: {
+            label: createTextProp({
+                label: "Label",
+                description: "The Text to be displayed in Tooltip.",
+            }),
+            isOpen: createBoolProp({
+                label: "Is Open",
+                description: "Whether the tooltip is open or not.",
+            }),
+            isDisabled: createDisabledProp(),
+            defaultIsOpen: createStaticBoolProp({
+                label: "Default Is Open",
+                description: "Whether the tooltip is open by default",
+                defaultValue: false,
+            }),
+            onOpen: createActionProp(),
+            onClose: createActionProp(),
+            openDelay: createStaticNumberProp({
+                label: "Open Delay",
+                description: "Delay in ms before tooltip opens",
+                defaultValue: 0,
+            }),
+            closeDelay: createStaticNumberProp({
+                label: "Close Delay",
+                description: "Delay in ms before tooltip closes",
+                defaultValue: 0,
+            }),
+            placement: createTextEnumProp({
+                label: "Placement",
+                description: "The placement of the menu",
+                options: [
+                    "bottom",
+                    "top",
+                    "left",
+                    "right",
+                    "top left",
+                    "top right",
+                    "bottom left",
+                    "bottom right",
+                    "right bottom",
+                    "right top",
+                    "left bottom",
+                    "left top",
+                ],
+                defaultValue: "bottom",
+            }),
+            arrowSize: createStaticNumberProp({
+                label: "Arrow Size",
+                description: "The size of the arrow",
+                defaultValue: 12,
+            }),
+            hasArrow: createStaticBoolProp({
+                label: "Has Arrow",
+                description: "Whether the tooltip has an arrow",
+                defaultValue: false,
+            }),
+            offset: createStaticNumberProp({
+                label: "Offset",
+                description: "The distance between the triggere and the tooltip.",
+            }),
+        },
+    },
+];

package/src/mappings/NativeBase/Other.ts

@@ -0,0 +1,139 @@
+import {
+  COMPONENT_TYPES,
+  StylesPanelSections,
+  createTextEnumProp,
+  createTextProp,
+  createIconProp,
+  createBoolProp,
+  createDisabledProp,
+  createStaticNumberProp,
+  createStaticBoolProp,
+  Triggers,
+  createActionProp,
+} from "@draftbit/types";
+
+export const SEED_DATA = [
+  {
+    name: "FAB",
+    tag: "Fab",
+    description:
+      "A floating action button (FAB) is a circular icon button that hovers over content to execute a primary action in the application.",
+    category: COMPONENT_TYPES.NBForms,
+    packageName: "native-base",
+    doc_link: "https://www.npmjs.com/package/@expo/html-elements",
+    code_link:
+      "https://github.com/expo/expo/tree/master/packages/html-elements",
+    stylesPanelSections: [
+      StylesPanelSections.LayoutFlexItems,
+      StylesPanelSections.LayoutSelectedItem,
+      StylesPanelSections.LayoutContent,
+      StylesPanelSections.Background,
+      StylesPanelSections.Size,
+      StylesPanelSections.MarginsAndPaddings,
+      StylesPanelSections.Position,
+      StylesPanelSections.Borders,
+      StylesPanelSections.Effects,
+    ],
+    layout: {},
+    triggers: {},
+    props: {
+      placement: createTextEnumProp({
+        label: "Placement",
+        description: "The placement of the Fab relative to the device.",
+        options: ["bottom-right", "top-right", "top-left", "bottom-left"],
+        defaultValue: "bottom-right",
+      }),
+      label: createTextProp({
+        label: "Label",
+        description: "The Text to be displayed in Fab.",
+      }),
+      icon: createIconProp({
+        label: "Icon",
+        description: "Icon to be displayed in Fab.  ",
+      }),
+    },
+  },
+  {
+    name: "Tooltip",
+    tag: "Tooltip",
+    description:
+      "A tooltip provides a brief, informative message when a user interacts with an element. Methods of tooltip initiation include: through a mouse-hover gesture or a keyboard-hover gesture.",
+    category: COMPONENT_TYPES.NBOther,
+    packageName: "native-base",
+    allowChildren: true,
+    stylesPanelSections: [
+      StylesPanelSections.LayoutFlexItems,
+      StylesPanelSections.LayoutSelectedItem,
+      StylesPanelSections.LayoutContent,
+      StylesPanelSections.Background,
+      StylesPanelSections.Size,
+      StylesPanelSections.MarginsAndPaddings,
+      StylesPanelSections.Position,
+      StylesPanelSections.Borders,
+      StylesPanelSections.Effects,
+    ],
+    layout: {},
+    triggers: [Triggers.OnOpen, Triggers.OnClose],
+    props: {
+      label: createTextProp({
+        label: "Label",
+        description: "The Text to be displayed in Tooltip.",
+      }),
+      isOpen: createBoolProp({
+        label: "Is Open",
+        description: "Whether the tooltip is open or not.",
+      }),
+      isDisabled: createDisabledProp(),
+      defaultIsOpen: createStaticBoolProp({
+        label: "Default Is Open",
+        description: "Whether the tooltip is open by default",
+        defaultValue: false,
+      }),
+      onOpen: createActionProp(),
+      onClose: createActionProp(),
+      openDelay: createStaticNumberProp({
+        label: "Open Delay",
+        description: "Delay in ms before tooltip opens",
+        defaultValue: 0,
+      }),
+      closeDelay: createStaticNumberProp({
+        label: "Close Delay",
+        description: "Delay in ms before tooltip closes",
+        defaultValue: 0,
+      }),
+      placement: createTextEnumProp({
+        label: "Placement",
+        description: "The placement of the menu",
+        options: [
+          "bottom",
+          "top",
+          "left",
+          "right",
+          "top left",
+          "top right",
+          "bottom left",
+          "bottom right",
+          "right bottom",
+          "right top",
+          "left bottom",
+          "left top",
+        ],
+        defaultValue: "bottom",
+      }),
+      arrowSize: createStaticNumberProp({
+        label: "Arrow Size",
+        description: "The size of the arrow",
+        defaultValue: 12,
+      }),
+      hasArrow: createStaticBoolProp({
+        label: "Has Arrow",
+        description: "Whether the tooltip has an arrow",
+        defaultValue: false,
+      }),
+      offset: createStaticNumberProp({
+        label: "Offset",
+        description: "The distance between the triggere and the tooltip.",
+      }),
+    },
+  },
+];

package/src/mappings/NativeBase/Popover.js

@@ -0,0 +1,123 @@
+import { COMPONENT_TYPES, createActionProp, createBoolProp, createStaticBoolProp, createTextEnumProp, StylesPanelSections, } from "@draftbit/types";
+const SHARED_SEED_DATA = {
+    category: COMPONENT_TYPES.NBPopover,
+    packageName: "native-base",
+    stylesPanelSections: [
+        StylesPanelSections.LayoutFlexItems,
+        StylesPanelSections.LayoutSelectedItem,
+        StylesPanelSections.LayoutContent,
+        StylesPanelSections.Background,
+        StylesPanelSections.Size,
+        StylesPanelSections.MarginsAndPaddings,
+        StylesPanelSections.Position,
+        StylesPanelSections.Borders,
+        StylesPanelSections.Effects,
+    ],
+    layout: {},
+    triggers: {},
+};
+export const SEED_DATA = [
+    {
+        name: "Popover",
+        tag: "Popover",
+        description: "Popover floats around a trigger. It is a non-modal dialog used to provide contextual information to the user. It should be paired with a pressable trigger element.",
+        ...SHARED_SEED_DATA,
+        allowChildren: true,
+        props: {
+            isOpen: createBoolProp({
+                label: "Is Open",
+                description: "If true, the popover is open. Useful for controlling the open state.",
+            }),
+            defaultIsOpen: createStaticBoolProp({
+                label: "Default Is Open",
+                description: "If true, the popover will be opened by default.",
+            }),
+            trapFocus: createStaticBoolProp({
+                label: "Trap Focus",
+                description: "Whether popover should trap focus.",
+            }),
+            shouldFlip: createStaticBoolProp({
+                label: "Should Flip",
+                description: "Whether popover should flip when it reaches the edge of the screen.",
+                defaultValue: true,
+            }),
+            shouldOverlapWithTrigger: createStaticBoolProp({
+                label: "Should Overlap With Trigger",
+                description: "Whether popover should overlap with trigger.",
+                defaultValue: false,
+            }),
+            isKeyboardDismissable: createStaticBoolProp({
+                label: "Is Keyboard Dismissable",
+                description: "If true, the popover will close when the keyboard is dismissed.",
+                defaultValue: true,
+            }),
+            placement: createTextEnumProp({
+                label: "Placement",
+                description: "The placement of the popover",
+                options: [
+                    "bottom",
+                    "top",
+                    "left",
+                    "right",
+                    "top left",
+                    "top right",
+                    "bottom left",
+                    "bottom right",
+                    "right bottom",
+                    "right top",
+                    "left bottom",
+                    "left top",
+                ],
+                defaultValue: "bottom left",
+            }),
+            useRNModal: createStaticBoolProp({
+                label: "Use RN Modal",
+                description: "If true, the popover will use the RN Modal component.",
+            }),
+            onOpen: createActionProp(),
+            onClose: createActionProp(),
+        },
+    },
+    {
+        name: "Popover Arrow",
+        tag: "Popover.Arrow",
+        description: "The popover arrow.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+    {
+        name: "Popover Body",
+        tag: "Popover.Body",
+        description: "The body of the popover.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+    {
+        name: "Popover Content",
+        tag: "Popover.Content",
+        description: "The popover itself.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+    {
+        name: "Popover Close Button",
+        tag: "Popover.CloseButton",
+        description: "The button that closes the popover.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+    {
+        name: "Popover Header",
+        tag: "Popover.Header",
+        description: "The header of the popover.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+    {
+        name: "Popover Trigger",
+        tag: "Popover.Trigger",
+        description: "Used to wrap the reference (or trigger) element.",
+        ...SHARED_SEED_DATA,
+        props: {},
+    },
+];

package/src/mappings/NativeBase/Popover.ts

@@ -0,0 +1,136 @@
+import {
+  COMPONENT_TYPES,
+  createActionProp,
+  createBoolProp,
+  createStaticBoolProp,
+  createTextEnumProp,
+  StylesPanelSections,
+} from "@draftbit/types";
+
+const SHARED_SEED_DATA = {
+  category: COMPONENT_TYPES.NBPopover,
+  packageName: "native-base",
+  stylesPanelSections: [
+    StylesPanelSections.LayoutFlexItems,
+    StylesPanelSections.LayoutSelectedItem,
+    StylesPanelSections.LayoutContent,
+    StylesPanelSections.Background,
+    StylesPanelSections.Size,
+    StylesPanelSections.MarginsAndPaddings,
+    StylesPanelSections.Position,
+    StylesPanelSections.Borders,
+    StylesPanelSections.Effects,
+  ],
+  layout: {},
+  triggers: {},
+};
+
+export const SEED_DATA = [
+  {
+    name: "Popover",
+    tag: "Popover",
+    description:
+      "Popover floats around a trigger. It is a non-modal dialog used to provide contextual information to the user. It should be paired with a pressable trigger element.",
+    ...SHARED_SEED_DATA,
+    allowChildren: true,
+    props: {
+      isOpen: createBoolProp({
+        label: "Is Open",
+        description:
+          "If true, the popover is open. Useful for controlling the open state.",
+      }),
+      defaultIsOpen: createStaticBoolProp({
+        label: "Default Is Open",
+        description: "If true, the popover will be opened by default.",
+      }),
+      trapFocus: createStaticBoolProp({
+        label: "Trap Focus",
+        description: "Whether popover should trap focus.",
+      }),
+      shouldFlip: createStaticBoolProp({
+        label: "Should Flip",
+        description:
+          "Whether popover should flip when it reaches the edge of the screen.",
+        defaultValue: true,
+      }),
+      shouldOverlapWithTrigger: createStaticBoolProp({
+        label: "Should Overlap With Trigger",
+        description: "Whether popover should overlap with trigger.",
+        defaultValue: false,
+      }),
+      isKeyboardDismissable: createStaticBoolProp({
+        label: "Is Keyboard Dismissable",
+        description:
+          "If true, the popover will close when the keyboard is dismissed.",
+        defaultValue: true,
+      }),
+      placement: createTextEnumProp({
+        label: "Placement",
+        description: "The placement of the popover",
+        options: [
+          "bottom",
+          "top",
+          "left",
+          "right",
+          "top left",
+          "top right",
+          "bottom left",
+          "bottom right",
+          "right bottom",
+          "right top",
+          "left bottom",
+          "left top",
+        ],
+        defaultValue: "bottom left",
+      }),
+      useRNModal: createStaticBoolProp({
+        label: "Use RN Modal",
+        description: "If true, the popover will use the RN Modal component.",
+      }),
+      onOpen: createActionProp(),
+      onClose: createActionProp(),
+    },
+  },
+  {
+    name: "Popover Arrow",
+    tag: "Popover.Arrow",
+    description: "The popover arrow.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+  {
+    name: "Popover Body",
+    tag: "Popover.Body",
+    description: "The body of the popover.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+  {
+    name: "Popover Content",
+    tag: "Popover.Content",
+    description: "The popover itself.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+  {
+    name: "Popover Close Button",
+    tag: "Popover.CloseButton",
+    description: "The button that closes the popover.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+  {
+    name: "Popover Header",
+    tag: "Popover.Header",
+    description: "The header of the popover.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+  {
+    name: "Popover Trigger",
+    tag: "Popover.Trigger",
+    description: "Used to wrap the reference (or trigger) element.",
+    ...SHARED_SEED_DATA,
+    props: {},
+  },
+];

package/src/mappings/Touchable.js

@@ -0,0 +1,17 @@
+import { COMPONENT_TYPES, createActionProp, Triggers, StylesPanelSections, } from "@draftbit/types";
+export const SEED_DATA = {
+    name: "Touchable",
+    tag: "Touchable",
+    description: "Simple button with no styles",
+    category: COMPONENT_TYPES.button,
+    stylesPanelSections: [
+        StylesPanelSections.Size,
+        StylesPanelSections.Margins,
+        StylesPanelSections.Borders,
+    ],
+    layout: {},
+    triggers: [Triggers.OnPress],
+    props: {
+        onPress: createActionProp(),
+    },
+};

package/src/mappings/Touchable.ts

@@ -0,0 +1,23 @@
+import {
+  COMPONENT_TYPES,
+  createActionProp,
+  Triggers,
+  StylesPanelSections,
+} from "@draftbit/types";
+
+export const SEED_DATA = {
+  name: "Touchable",
+  tag: "Touchable",
+  description: "Simple button with no styles",
+  category: COMPONENT_TYPES.button,
+  stylesPanelSections: [
+    StylesPanelSections.Size,
+    StylesPanelSections.Margins,
+    StylesPanelSections.Borders,
+  ],
+  layout: {},
+  triggers: [Triggers.OnPress],
+  props: {
+    onPress: createActionProp(),
+  },
+};

package/lib/commonjs/components/Pressable.js

@@ -1,48 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Pressable;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function Pressable(_ref) {
-  let {
-    children,
-    disabled,
-    onPress,
-    onLongPress,
-    hitSlop,
-    delayLongPress,
-    activeOpacity,
-    disabledOpacity,
-    style,
-    ...props
-  } = _ref;
-  const getOpacity = (0, _react.useCallback)(pressed => {
-    if (disabled) {
-      return disabledOpacity;
-    } else {
-      if (pressed) return activeOpacity;else return 1;
-    }
-  }, [activeOpacity, disabled, disabledOpacity]);
-  const _style = (0, _react.useCallback)(_ref2 => {
-    let {
-      pressed
-    } = _ref2;
-    return [style, {
-      opacity: getOpacity(pressed)
-    }];
-  }, [getOpacity, style]);
-  return /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, _extends({
-    onPress: onPress,
-    onLongPress: onLongPress,
-    disabled: disabled,
-    delayLongPress: delayLongPress ? delayLongPress : 500,
-    hitSlop: hitSlop ? hitSlop : 8,
-    style: _style
-  }, props), children);
-}

package/lib/commonjs/mappings/Pressable.js

@@ -1,52 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SEED_DATA = void 0;
-var _types = require("@draftbit/types");
-const SEED_DATA_PROPS = {
-  stylesPanelSections: [_types.StylesPanelSections.Size, _types.StylesPanelSections.Margins, _types.StylesPanelSections.Borders],
-  layout: {},
-  triggers: [_types.Triggers.OnPress, _types.Triggers.OnLongPress],
-  props: {
-    onPress: (0, _types.createActionProp)(),
-    onLongPress: (0, _types.createActionProp)(),
-    activeOpacity: (0, _types.createNumberProp)({
-      label: "Active Opacity",
-      description: "The opacity when the button is pressed.",
-      defaultValue: 0.8,
-      group: _types.GROUPS.basic
-    }),
-    disabledOpacity: (0, _types.createNumberProp)({
-      label: "Disabled Opacity",
-      description: "The opacity when the button is disabled.",
-      defaultValue: 0.8,
-      group: _types.GROUPS.basic
-    }),
-    delayLongPress: (0, _types.createNumberProp)({
-      label: "Delay Long Press",
-      description: "Duration (in milliseconds) from onPressIn before onLongPress is called.",
-      group: _types.GROUPS.basic
-    }),
-    hitSlop: (0, _types.createNumberProp)({
-      label: "Hit Slop",
-      description: "Sets additional distance outside of element in which a press can be detected.",
-      group: _types.GROUPS.basic
-    })
-  }
-};
-const SEED_DATA = [{
-  name: "Touchable",
-  tag: "Touchable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.button,
-  ...SEED_DATA_PROPS
-}, {
-  name: "Pressable",
-  tag: "Pressable",
-  description: "An interactive view with no styles",
-  category: _types.COMPONENT_TYPES.deprecated,
-  ...SEED_DATA_PROPS
-}];
-exports.SEED_DATA = SEED_DATA;