@draftbit/core 46.10.2-f194c1.2 → 46.10.3-0bad1e.2

package/lib/typescript/src/mappings/NativeBase/Layout.d.ts

@@ -0,0 +1,107 @@
+export declare const SEED_DATA: ({
+    props: {
+        ratio: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        direction?: undefined;
+        reversed?: undefined;
+        isDisabled?: undefined;
+        isInvalid?: undefined;
+    };
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    props: {
+        direction: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            options: never[];
+        };
+        reversed: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        isDisabled: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        isInvalid: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        ratio?: undefined;
+    };
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+} | {
+    props: {
+        reversed: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        ratio?: undefined;
+        direction?: undefined;
+        isDisabled?: undefined;
+        isInvalid?: undefined;
+    };
+    category: string;
+    packageName: string;
+    stylesPanelSections: string[];
+    name: string;
+    tag: string;
+    description: string;
+})[];
+//# sourceMappingURL=Layout.d.ts.map

package/lib/typescript/src/mappings/NativeBase/Layout.d.ts.map

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

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

@@ -12,16 +12,6 @@ export declare const SEED_DATA: {
     props: {
         videoId: any;
         playlist: any;
-        mute: {
-            label: string;
-            description: string;
-            formType: string;
-            propType: string;
-            defaultValue: boolean;
-            editable: boolean;
-            required: boolean;
-            group: string;
-        };
         autoplay: {
             label: string;
             description: string;

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

@@ -1 +1 @@
-{"version":3,"file":"YoutubePlayer.d.ts","sourceRoot":"","sources":["../../../../src/mappings/YoutubePlayer.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCrB,CAAC"}
+{"version":3,"file":"YoutubePlayer.d.ts","sourceRoot":"","sources":["../../../../src/mappings/YoutubePlayer.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;CA6BrB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "46.10.2-f194c1.2+f194c16",
+  "version": "46.10.3-0bad1e.2+0bad1e7",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/types": "^46.10.2-f194c1.2+f194c16",
+    "@draftbit/types": "^46.10.3-0bad1e.2+0bad1e7",
     "@material-ui/core": "^4.11.0",
     "@material-ui/pickers": "^3.2.10",
     "@react-native-community/slider": "4.2.3",
@@ -64,8 +64,8 @@
     "react-native-tab-view": "^3.4.0",
     "react-native-typography": "^1.4.1",
     "react-native-web-swiper": "^2.2.3",
-    "react-native-web-webview": "^1.0.2",
-    "react-native-youtube-iframe": "^2.2.2"
+    "react-native-youtube-iframe": "^2.2.2",
+    "react-youtube": "^10.1.0"
   },
   "devDependencies": {
     "@types/color": "^3.0.1",
@@ -100,5 +100,5 @@
       ]
     ]
   },
-  "gitHead": "f194c16dea96d8bb44c344af38b9bf75f1da664f"
+  "gitHead": "0bad1e7880e3d41548dddba76cb7c463466b70bf"
 }

package/src/components/YoutubePlayer/YoutubePlayer.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { View } from "react-native";
+import { extractStyles } from "../../utilities";
+import YouTube from "react-youtube";
+const YoutubePlayer = ({ videoId, playlist, autoplay = false, style, }) => {
+    const { viewStyles } = extractStyles(style);
+    const defaultVideoId = "nwMUpDESXrI";
+    const options = {
+        width: viewStyles.width,
+        height: viewStyles.height,
+        playerVars: {
+            autoplay: autoplay ? 1 : 0,
+            list: playlist,
+            listType: "playlist",
+        },
+    };
+    return (React.createElement(View, { style: viewStyles },
+        React.createElement(YouTube, { videoId: !videoId && !playlist ? defaultVideoId : videoId, opts: options })));
+};
+export default YoutubePlayer;

package/src/components/YoutubePlayer/YoutubePlayer.native.js

@@ -0,0 +1,9 @@
+import React from "react";
+import YoutubePlayerIFrame from "react-native-youtube-iframe";
+import { extractStyles } from "../../utilities";
+const YoutubePlayer = ({ videoId, playlist, autoplay = false, style, }) => {
+    const { viewStyles } = extractStyles(style);
+    const defaultVideoId = "nwMUpDESXrI";
+    return (React.createElement(YoutubePlayerIFrame, { width: viewStyles.width, height: viewStyles.height, play: autoplay, videoId: !videoId && !playlist ? defaultVideoId : videoId, playList: playlist, webViewStyle: viewStyles }));
+};
+export default YoutubePlayer;

package/src/components/YoutubePlayer/YoutubePlayer.native.tsx

@@ -0,0 +1,27 @@
+import React from "react";
+import YoutubePlayerIFrame from "react-native-youtube-iframe";
+import { extractStyles } from "../../utilities";
+import { YoutubePlayerProps } from "./YoutubePlayerProps";
+
+const YoutubePlayer: React.FC<YoutubePlayerProps> = ({
+  videoId,
+  playlist,
+  autoplay = false,
+  style,
+}) => {
+  const { viewStyles } = extractStyles(style);
+  const defaultVideoId = "nwMUpDESXrI";
+
+  return (
+    <YoutubePlayerIFrame
+      width={viewStyles.width}
+      height={viewStyles.height}
+      play={autoplay}
+      videoId={!videoId && !playlist ? defaultVideoId : videoId}
+      playList={playlist}
+      webViewStyle={viewStyles}
+    />
+  );
+};
+
+export default YoutubePlayer;

package/src/components/YoutubePlayer/YoutubePlayer.tsx

@@ -0,0 +1,36 @@
+import React from "react";
+import { View } from "react-native";
+import { extractStyles } from "../../utilities";
+import { YoutubePlayerProps } from "./YoutubePlayerProps";
+import YouTube, { YouTubeProps } from "react-youtube";
+
+const YoutubePlayer: React.FC<YoutubePlayerProps> = ({
+  videoId,
+  playlist,
+  autoplay = false,
+  style,
+}) => {
+  const { viewStyles } = extractStyles(style);
+  const defaultVideoId = "nwMUpDESXrI";
+
+  const options: YouTubeProps["opts"] = {
+    width: viewStyles.width,
+    height: viewStyles.height,
+    playerVars: {
+      autoplay: autoplay ? 1 : 0,
+      list: playlist,
+      listType: "playlist",
+    },
+  };
+
+  return (
+    <View style={viewStyles}>
+      <YouTube
+        videoId={!videoId && !playlist ? defaultVideoId : videoId}
+        opts={options}
+      />
+    </View>
+  );
+};
+
+export default YoutubePlayer;

package/src/components/YoutubePlayer/YoutubePlayerProps.js

@@ -0,0 +1 @@
+export {};

package/src/components/YoutubePlayer/YoutubePlayerProps.ts

@@ -0,0 +1,8 @@
+import { StyleProp, ViewStyle } from "react-native";
+
+export interface YoutubePlayerProps {
+  videoId?: string;
+  playlist?: string;
+  autoplay?: boolean;
+  style?: StyleProp<ViewStyle>;
+}

package/src/components/YoutubePlayer/index.js

@@ -0,0 +1 @@
+export { default as YoutubePlayer } from "./YoutubePlayer";

package/src/components/YoutubePlayer/index.ts

@@ -0,0 +1 @@
+export { default as YoutubePlayer } from "./YoutubePlayer";

package/src/index.js

@@ -36,15 +36,12 @@ export { DeckSwiper, DeckSwiperCard } from "./components/DeckSwiper";
 export { TabView, TabViewItem } from "./components/TabView";
 export { default as Markdown } from "./components/Markdown";
 export { BottomSheet } from "./components/BottomSheet";
-export { default as YoutubePlayer } from "./components/YotubePlayer";
+export { YoutubePlayer } from "./components/YoutubePlayer";
 /* Deprecated: Fix or Delete!  */
 export { default as DatePicker } from "./components/DatePicker/DatePicker";
 export { default as Picker } from "./components/Picker/Picker";
 export { default as ProgressBar } from "./components/ProgressBar";
 export { default as ProgressCircle } from "./components/ProgressCircle";
-export { default as RowBodyIcon } from "./components/RowBodyIcon";
-export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImageCaption";
-export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
 export { default as Slider } from "./components/Slider";
 export { default as Stepper } from "./components/Stepper";
 export { useAuthState } from "./components/useAuthState";

package/src/index.tsx

@@ -60,16 +60,13 @@ export { default as Markdown } from "./components/Markdown";
 
 export { BottomSheet } from "./components/BottomSheet";
 
-export { default as YoutubePlayer } from "./components/YotubePlayer";
+export { YoutubePlayer } from "./components/YoutubePlayer";
 
 /* Deprecated: Fix or Delete!  */
 export { default as DatePicker } from "./components/DatePicker/DatePicker";
 export { default as Picker } from "./components/Picker/Picker";
 export { default as ProgressBar } from "./components/ProgressBar";
 export { default as ProgressCircle } from "./components/ProgressCircle";
-export { default as RowBodyIcon } from "./components/RowBodyIcon";
-export { default as RowHeadlineImageCaption } from "./components/RowHeadlineImageCaption";
-export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIcon";
 export { default as Slider } from "./components/Slider";
 export { default as Stepper } from "./components/Stepper";
 export { useAuthState } from "./components/useAuthState";

package/src/mappings/NativeBase/Layout.js

@@ -0,0 +1,101 @@
+import { COMPONENT_TYPES, createTextEnumProp, createBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, createStaticNumberProp, } from "@draftbit/types";
+const SHARED_SEED_DATA = {
+    category: COMPONENT_TYPES.layout,
+    packageName: "native-base",
+    stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+};
+export const SEED_DATA = [
+    {
+        name: "Aspect Ratio",
+        tag: "AspectRatio",
+        description: "Controls the size of the undefined dimension of a node or child component using an aspect ratio",
+        ...SHARED_SEED_DATA,
+        props: {
+            ratio: createStaticNumberProp({
+                label: "Ratio",
+                description: "The aspect ratio of the container in decimal format (ex: 3/4 -> 1.33)",
+                defaultValue: 1.33,
+            }),
+        },
+    },
+    {
+        name: "Box",
+        tag: "Box",
+        description: "This is a generic component for low level layout needs. It is similar to a div in HTML",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Center",
+        tag: "Center",
+        description: "Center aligns its contents to the center within itself",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Circle",
+        tag: "Circle",
+        description: "Center aligns its contents to the center within itself with a round border radius",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Container",
+        tag: "Container",
+        description: "The Container restricts a content's width according to current breakpoint, while keeping the size fluid",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Column",
+        tag: "Column",
+        description: "Column aligns items vertically",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Row",
+        tag: "Row",
+        description: "Column aligns items horizontally",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Spacer",
+        tag: "Spacer",
+        description: "An adjustable, empty space that can be used to tune the spacing between child elements within Flex",
+        ...SHARED_SEED_DATA,
+    },
+    {
+        name: "Stack",
+        tag: "Stack",
+        description: "Stack aligns items vertically or horizontally based on the direction prop",
+        ...SHARED_SEED_DATA,
+        props: {
+            direction: createTextEnumProp({
+                label: "Direction",
+                description: "The direction of the Stack",
+                options: ["row", "column"],
+                defaultValue: "column",
+            }),
+            reversed: createBoolProp({
+                label: "Reversed",
+                description: "Determines whether to reverse the direction of items",
+            }),
+            isDisabled: createBoolProp({
+                label: "Disabled",
+                description: "If true, the Stack will be disabled",
+            }),
+            isInvalid: createBoolProp({
+                label: "Invalid",
+                description: "If true, the Stack will be invalid",
+            }),
+        },
+    },
+    {
+        name: "ZStack",
+        tag: "ZStack",
+        description: "ZStack aligns items to the z-axis",
+        ...SHARED_SEED_DATA,
+        props: {
+            reversed: createBoolProp({
+                label: "Reversed",
+                description: "Determines whether to reverse the direction of items",
+            }),
+        },
+    },
+];

package/src/mappings/NativeBase/Layout.ts

@@ -0,0 +1,116 @@
+import {
+  COMPONENT_TYPES,
+  createTextEnumProp,
+  createBoolProp,
+  CONTAINER_COMPONENT_STYLES_SECTIONS,
+  createStaticNumberProp,
+} from "@draftbit/types";
+
+const SHARED_SEED_DATA = {
+  category: COMPONENT_TYPES.layout,
+  packageName: "native-base",
+  stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
+};
+
+export const SEED_DATA = [
+  {
+    name: "Aspect Ratio",
+    tag: "AspectRatio",
+    description:
+      "Controls the size of the undefined dimension of a node or child component using an aspect ratio",
+    ...SHARED_SEED_DATA,
+    props: {
+      ratio: createStaticNumberProp({
+        label: "Ratio",
+        description:
+          "The aspect ratio of the container in decimal format (ex: 3/4 -> 1.33)",
+        defaultValue: 1.33,
+      }),
+    },
+  },
+  {
+    name: "Box",
+    tag: "Box",
+    description:
+      "This is a generic component for low level layout needs. It is similar to a div in HTML",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Center",
+    tag: "Center",
+    description: "Center aligns its contents to the center within itself",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Circle",
+    tag: "Circle",
+    description:
+      "Center aligns its contents to the center within itself with a round border radius",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Container",
+    tag: "Container",
+    description:
+      "The Container restricts a content's width according to current breakpoint, while keeping the size fluid",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Column",
+    tag: "Column",
+    description: "Column aligns items vertically",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Row",
+    tag: "Row",
+    description: "Column aligns items horizontally",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Spacer",
+    tag: "Spacer",
+    description:
+      "An adjustable, empty space that can be used to tune the spacing between child elements within Flex",
+    ...SHARED_SEED_DATA,
+  },
+  {
+    name: "Stack",
+    tag: "Stack",
+    description:
+      "Stack aligns items vertically or horizontally based on the direction prop",
+    ...SHARED_SEED_DATA,
+    props: {
+      direction: createTextEnumProp({
+        label: "Direction",
+        description: "The direction of the Stack",
+        options: ["row", "column"],
+        defaultValue: "column",
+      }),
+      reversed: createBoolProp({
+        label: "Reversed",
+        description: "Determines whether to reverse the direction of items",
+      }),
+      isDisabled: createBoolProp({
+        label: "Disabled",
+        description: "If true, the Stack will be disabled",
+      }),
+      isInvalid: createBoolProp({
+        label: "Invalid",
+        description: "If true, the Stack will be invalid",
+      }),
+    },
+  },
+  {
+    name: "ZStack",
+    tag: "ZStack",
+    description: "ZStack aligns items to the z-axis",
+    ...SHARED_SEED_DATA,
+    props: {
+      reversed: createBoolProp({
+        label: "Reversed",
+        description: "Determines whether to reverse the direction of items",
+      }),
+    },
+  },
+];

package/src/mappings/YoutubePlayer.js

@@ -21,12 +21,6 @@ export const SEED_DATA = {
             description: "Playlist of the Youtube videos.",
             defaultValue: null,
         }),
-        mute: createStaticBoolProp({
-            label: "Mute Audio",
-            description: "Mute the audio of the video.",
-            defaultValue: false,
-            required: false,
-        }),
         autoplay: createStaticBoolProp({
             label: "Auto Play",
             description: "Autoplay the video on load.",

package/src/mappings/YoutubePlayer.ts

@@ -27,12 +27,6 @@ export const SEED_DATA = {
       description: "Playlist of the Youtube videos.",
       defaultValue: null,
     }),
-    mute: createStaticBoolProp({
-      label: "Mute Audio",
-      description: "Mute the audio of the video.",
-      defaultValue: false,
-      required: false,
-    }),
     autoplay: createStaticBoolProp({
       label: "Auto Play",
       description: "Autoplay the video on load.",

package/lib/commonjs/components/Row.js

@@ -1,73 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _theming = require("../theming");
-var _Config = _interopRequireDefault(require("./Config"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
-const Row = _ref => {
-  let {
-    titleTypeStyle,
-    titleColor,
-    subtitleTypeStyle,
-    subtitleColor,
-    title,
-    subtitle,
-    multilineSubtitle,
-    image,
-    right,
-    style
-  } = _ref;
-  return /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: [styles.container, {
-      padding: 16
-    }, style]
-  }, /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: styles.leftContainer
-  }, image && /*#__PURE__*/React.createElement(_reactNative.Image, {
-    source: typeof image === "string" ? {
-      uri: image
-    } : image,
-    style: {
-      marginRight: 12,
-      width: subtitle ? _Config.default.rowMultiLineImageSize : _Config.default.rowSingleLineImageSize,
-      height: subtitle ? _Config.default.rowMultiLineImageSize : _Config.default.rowSingleLineImageSize
-    }
-  }), /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: styles.textContainer
-  }, /*#__PURE__*/React.createElement(_reactNative.Text, {
-    style: [titleTypeStyle, {
-      color: titleColor
-    }],
-    numberOfLines: 1
-  }, title), subtitle ? /*#__PURE__*/React.createElement(_reactNative.Text, {
-    style: [subtitleTypeStyle, {
-      color: subtitleColor,
-      marginTop: 4
-    }],
-    numberOfLines: multilineSubtitle ? undefined : 1
-  }, subtitle) : null)), right && right());
-};
-const styles = _reactNative.StyleSheet.create({
-  leftContainer: {
-    flexDirection: "row",
-    flex: 1
-  },
-  container: {
-    flexDirection: "row",
-    justifyContent: "space-between",
-    alignItems: "center"
-  },
-  textContainer: {
-    flex: 1,
-    justifyContent: "center"
-  }
-});
-var _default = (0, _theming.withTheme)(Row);
-exports.default = _default;