@draftbit/core 42.4.1-3e3daf.0 → 42.4.2

package/src/components/Checkbox/Checkbox.js

@@ -10,10 +10,12 @@ export var CheckboxStatus;
     CheckboxStatus["Unchecked"] = "unchecked";
     CheckboxStatus["Indeterminate"] = "indeterminate";
 })(CheckboxStatus || (CheckboxStatus = {}));
-const Checkbox = ({ Icon, status = CheckboxStatus.Unchecked, disabled = false, onPress = () => { }, color, uncheckedColor, indeterminateColor, initialValue, defaultValue, checkedIcon = "MaterialCommunityIcons/checkbox-marked", uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline", indeterminateIcon = "AntDesign/minussquareo", size = 24, style, ...rest }) => {
-    const [internalValue, setInternalValue] = React.useState(status || defaultValue);
+const Checkbox = ({ Icon, status, disabled = false, onPress = () => { }, color, uncheckedColor, indeterminateColor, initialValue, defaultValue, checkedIcon = "MaterialCommunityIcons/checkbox-marked", uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline", indeterminateIcon = "AntDesign/minussquareo", size = 24, style, ...rest }) => {
+    const [internalValue, setInternalValue] = React.useState(status || defaultValue || CheckboxStatus.Unchecked);
     React.useEffect(() => {
-        setInternalValue(status);
+        if (status != null) {
+            setInternalValue(status);
+        }
     }, [status]);
     const previousInitialValue = usePrevious(initialValue);
     React.useEffect(() => {
@@ -32,7 +34,7 @@ const Checkbox = ({ Icon, status = CheckboxStatus.Unchecked, disabled = false, o
         [CheckboxStatus.Unchecked]: uncheckedIcon,
         [CheckboxStatus.Indeterminate]: indeterminateIcon,
     };
-    const checkboxColor = colorsMap[status];
+    const checkboxColor = colorsMap[internalValue];
     const handlePress = () => {
         setInternalValue(internalValue === CheckboxStatus.Unchecked
             ? CheckboxStatus.Checked

package/src/components/Checkbox/Checkbox.tsx

@@ -47,7 +47,7 @@ export interface CheckboxProps {
 const Checkbox: React.FC<CheckboxProps & TouchableHighlightProps & IconSlot> =
   ({
     Icon,
-    status = CheckboxStatus.Unchecked,
+    status,
     disabled = false,
     onPress = () => {},
     color,
@@ -63,11 +63,13 @@ const Checkbox: React.FC<CheckboxProps & TouchableHighlightProps & IconSlot> =
     ...rest
   }) => {
     const [internalValue, setInternalValue] = React.useState<CheckboxStatus>(
-      status || defaultValue
+      status || defaultValue || CheckboxStatus.Unchecked
     );
 
     React.useEffect(() => {
-      setInternalValue(status);
+      if (status != null) {
+        setInternalValue(status);
+      }
     }, [status]);
 
     const previousInitialValue = usePrevious(initialValue);
@@ -90,7 +92,7 @@ const Checkbox: React.FC<CheckboxProps & TouchableHighlightProps & IconSlot> =
       [CheckboxStatus.Indeterminate]: indeterminateIcon,
     };
 
-    const checkboxColor = colorsMap[status];
+    const checkboxColor = colorsMap[internalValue];
 
     const handlePress = () => {
       setInternalValue(

package/src/components/RadioButton/RadioButtonGroup.js

@@ -7,7 +7,9 @@ const { Provider } = radioButtonGroupContext;
 const RadioButtonGroup = ({ direction = Direction.Vertical, value, onValueChange = () => { }, initialValue, defaultValue, style, children, ...rest }) => {
     const [internalValue, setIntervalValue] = React.useState(value || defaultValue);
     React.useEffect(() => {
-        setIntervalValue(value);
+        if (value != null) {
+            setIntervalValue(value);
+        }
     }, [value]);
     const previousInitialValue = usePrevious(initialValue);
     React.useEffect(() => {

package/src/components/RadioButton/RadioButtonGroup.tsx

@@ -37,7 +37,9 @@ const RadioButtonGroup: React.FC<RadioButtonGroupProps> = ({
   );
 
   React.useEffect(() => {
-    setIntervalValue(value);
+    if (value != null) {
+      setIntervalValue(value);
+    }
   }, [value]);
 
   const previousInitialValue = usePrevious(initialValue);

package/src/components/Slider.js

@@ -33,7 +33,9 @@ function Slider({ Icon, leftIcon, rightIcon, leftIconColor, rightIconColor, valu
     }, [initialValue, previousInitialValue, onValueChange]);
     const [internalValue, setIntervalValue] = React.useState(value || defaultValue);
     React.useEffect(() => {
-        setIntervalValue(value);
+        if (value != null) {
+            setIntervalValue(value);
+        }
     }, [value]);
     const minTrackColor = minimumTrackTintColor || theme.colors.primary;
     const maxTrackColor = maximumTrackTintColor || theme.colors.light;

package/src/components/Slider.tsx

@@ -92,7 +92,9 @@ function Slider({
   );
 
   React.useEffect(() => {
-    setIntervalValue(value);
+    if (value != null) {
+      setIntervalValue(value);
+    }
   }, [value]);
 
   const minTrackColor = minimumTrackTintColor || theme.colors.primary;

package/src/components/StarRating.js

@@ -5,7 +5,9 @@ import { COMPONENT_TYPES, createStaticNumberProp, createFieldNameProp, createSta
 const StarRating = ({ Icon, starSize = 16, maxStars = 5, rating = 0, defaultValue, isEditable = false, activeColor, inactiveColor, style, onPress, ...rest }) => {
     const [localRating, setLocalRating] = React.useState(rating || defaultValue || 0);
     React.useEffect(() => {
-        setLocalRating(rating);
+        if (rating != null) {
+            setLocalRating(rating);
+        }
     }, [rating]);
     const ratingHandler = React.useCallback((r) => {
         setLocalRating(r);

package/src/components/StarRating.tsx

@@ -51,7 +51,9 @@ const StarRating: React.FC<Props> = ({
   );
 
   React.useEffect(() => {
-    setLocalRating(rating);
+    if (rating != null) {
+      setLocalRating(rating);
+    }
   }, [rating]);
 
   const ratingHandler = React.useCallback(

package/src/components/Stepper.js

@@ -4,10 +4,12 @@ import { withTheme } from "../theming";
 import { COMPONENT_TYPES, createIconSizeProp, createColorProp, createFieldNameProp, Triggers, } from "@draftbit/types";
 import IconButton from "./IconButton";
 import { usePrevious } from "../hooks";
-const Stepper = ({ Icon, value = 0, style, onChange, initialValue, defaultValue, theme: { colors, typography, roundness }, iconSize = 24, iconColor = colors.strong, borderRadius = roundness, typeStyle, }) => {
+const Stepper = ({ Icon, value, style, onChange, initialValue, defaultValue, theme: { colors, typography, roundness }, iconSize = 24, iconColor = colors.strong, borderRadius = roundness, typeStyle, }) => {
     const [stateValue, setStateValue] = React.useState(value || defaultValue || 0);
     React.useEffect(() => {
-        setStateValue(value);
+        if (value != null) {
+            setStateValue(value);
+        }
     }, [value]);
     const previousInitialValue = usePrevious(initialValue);
     React.useEffect(() => {

package/src/components/Stepper.tsx

@@ -29,7 +29,7 @@ type Props = {
 
 const Stepper: React.FC<Props> = ({
   Icon,
-  value = 0,
+  value,
   style,
   onChange,
   initialValue,
@@ -45,7 +45,9 @@ const Stepper: React.FC<Props> = ({
   );
 
   React.useEffect(() => {
-    setStateValue(value);
+    if (value != null) {
+      setStateValue(value);
+    }
   }, [value]);
 
   const previousInitialValue = usePrevious(initialValue);

package/src/components/Switch.js

@@ -10,9 +10,6 @@ function Switch({ value, initialValue, defaultValue, disabled, onValueChange, ac
     const activeThumbThemeColor = activeThumbColor || "#FFF";
     const inactiveThumbThemeColor = inactiveThumbColor || "#FFF";
     const [checked, setChecked] = React.useState(value || defaultValue);
-    React.useEffect(() => {
-        setChecked(value);
-    }, [value]);
     React.useEffect(() => {
         if (value != null && value !== checked) {
             setChecked(value);
@@ -42,7 +39,7 @@ function Switch({ value, initialValue, defaultValue, disabled, onValueChange, ac
             onValueChange && onValueChange(bool);
         }, ...rest }));
 }
-function Row({ label = "Label", direction = RowDirection.Row, style, value = false, disabled, onValueChange, activeTrackColor, inactiveTrackColor, activeThumbColor, inactiveThumbColor, theme, ...rest }) {
+function Row({ label = "Label", direction = RowDirection.Row, style, value, disabled, onValueChange, activeTrackColor, inactiveTrackColor, activeThumbColor, inactiveThumbColor, theme, ...rest }) {
     const [checked, setChecked] = React.useState(value);
     React.useEffect(() => {
         if (value !== checked) {

package/src/components/Switch.tsx

@@ -46,10 +46,6 @@ function Switch({
 
   const [checked, setChecked] = React.useState(value || defaultValue);
 
-  React.useEffect(() => {
-    setChecked(value);
-  }, [value]);
-
   React.useEffect(() => {
     if (value != null && value !== checked) {
       setChecked(value);
@@ -104,7 +100,7 @@ function Row({
   label = "Label",
   direction = RowDirection.Row,
   style,
-  value = false,
+  value,
   disabled,
   onValueChange,
   activeTrackColor,

package/src/components/ToggleButton.js

@@ -8,7 +8,9 @@ import { usePrevious } from "../hooks";
 const ToggleButton = ({ Icon, icon, toggled = false, onPress = () => { }, initialValue, defaultValue, disabled = false, color = "primary", colorSecondary = "surface", borderColor = "divider", iconSize = 25, width = 50, height = 50, theme: { colors }, style, ...rest }) => {
     const [internalValue, setIntervalValue] = React.useState(toggled || defaultValue || false);
     React.useEffect(() => {
-        setIntervalValue(toggled);
+        if (toggled != null) {
+            setIntervalValue(toggled);
+        }
     }, [toggled]);
     const previousInitialValue = usePrevious(initialValue);
     React.useEffect(() => {

package/src/components/ToggleButton.tsx

@@ -58,7 +58,9 @@ const ToggleButton: React.FC<Props> = ({
   );
 
   React.useEffect(() => {
-    setIntervalValue(toggled);
+    if (toggled != null) {
+      setIntervalValue(toggled);
+    }
   }, [toggled]);
 
   const previousInitialValue = usePrevious(initialValue);

package/src/index.js

@@ -49,4 +49,3 @@ export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIc
 export { default as Slider } from "./components/Slider";
 export { default as Stepper } from "./components/Stepper";
 export { useAuthState } from "./components/useAuthState";
-export { default as Youtube } from "./components/Youtube";

package/src/index.tsx

@@ -69,4 +69,3 @@ export { default as RowHeadlineImageIcon } from "./components/RowHeadlineImageIc
 export { default as Slider } from "./components/Slider";
 export { default as Stepper } from "./components/Stepper";
 export { useAuthState } from "./components/useAuthState";
-export { default as Youtube } from "./components/Youtube";

package/lib/commonjs/components/Youtube.js

@@ -1,73 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SEED_DATA = exports.default = void 0;
-
-var _types = require("@draftbit/types");
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactNativeYoutubeIframe = _interopRequireDefault(require("react-native-youtube-iframe"));
-
-var _utilities = require("../utilities");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const Youtube = ({
-  videoId,
-  playlist,
-  style,
-  mute,
-  autoplay
-}) => {
-  const {
-    viewStyles: {
-      height,
-      width
-    }
-  } = (0, _utilities.extractStyles)(style);
-  return /*#__PURE__*/_react.default.createElement(_reactNativeYoutubeIframe.default, {
-    height: height,
-    width: width,
-    play: autoplay,
-    videoId: videoId,
-    playList: playlist,
-    mute: mute
-  });
-};
-
-var _default = Youtube;
-exports.default = _default;
-const SEED_DATA = {
-  name: "Youtube",
-  tag: "Youtube",
-  description: "Youtube Component",
-  category: _types.COMPONENT_TYPES.media,
-  layout: {
-    width: "100%"
-  },
-  props: {
-    videoId: (0, _types.createTextProp)({
-      label: "VideoId",
-      description: "Youtube Video ID"
-    }),
-    playlist: (0, _types.createTextProp)({
-      label: "PlayList",
-      description: "Playlist ID"
-    }),
-    mute: (0, _types.createBoolProp)({
-      label: "Mute",
-      description: "Whether to mute video",
-      defaultValue: false
-    }),
-    autoplay: (0, _types.createBoolProp)({
-      label: "Autoplay",
-      description: "Whether to Autoplay video",
-      defaultValue: false
-    })
-  }
-};
-exports.SEED_DATA = SEED_DATA;
-//# sourceMappingURL=Youtube.js.map

package/lib/commonjs/components/Youtube.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Youtube.tsx"],"names":["Youtube","videoId","playlist","style","mute","autoplay","viewStyles","height","width","SEED_DATA","name","tag","description","category","COMPONENT_TYPES","media","layout","props","label","defaultValue"],"mappings":";;;;;;;AAAA;;AAKA;;AAEA;;AACA;;;;AAUA,MAAMA,OAAO,GAAG,CAAC;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,QAAX;AAAqBC,EAAAA,KAArB;AAA4BC,EAAAA,IAA5B;AAAkCC,EAAAA;AAAlC,CAAD,KAAyD;AACvE,QAAM;AACJC,IAAAA,UAAU,EAAE;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV;AADR,MAEF,8BAAcL,KAAd,CAFJ;AAIA,sBACE,6BAAC,iCAAD;AACE,IAAA,MAAM,EAAEI,MADV;AAEE,IAAA,KAAK,EAAEC,KAFT;AAGE,IAAA,IAAI,EAAEH,QAHR;AAIE,IAAA,OAAO,EAAEJ,OAJX;AAKE,IAAA,QAAQ,EAAEC,QALZ;AAME,IAAA,IAAI,EAAEE;AANR,IADF;AAUD,CAfD;;eAiBeJ,O;;AAER,MAAMS,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,SADiB;AAEvBC,EAAAA,GAAG,EAAE,SAFkB;AAGvBC,EAAAA,WAAW,EAAE,mBAHU;AAIvBC,EAAAA,QAAQ,EAAEC,uBAAgBC,KAJH;AAKvBC,EAAAA,MAAM,EAAE;AACNR,IAAAA,KAAK,EAAE;AADD,GALe;AAQvBS,EAAAA,KAAK,EAAE;AACLhB,IAAAA,OAAO,EAAE,2BAAe;AACtBiB,MAAAA,KAAK,EAAE,SADe;AAEtBN,MAAAA,WAAW,EAAE;AAFS,KAAf,CADJ;AAKLV,IAAAA,QAAQ,EAAE,2BAAe;AACvBgB,MAAAA,KAAK,EAAE,UADgB;AAEvBN,MAAAA,WAAW,EAAE;AAFU,KAAf,CALL;AASLR,IAAAA,IAAI,EAAE,2BAAe;AACnBc,MAAAA,KAAK,EAAE,MADY;AAEnBN,MAAAA,WAAW,EAAE,uBAFM;AAGnBO,MAAAA,YAAY,EAAE;AAHK,KAAf,CATD;AAcLd,IAAAA,QAAQ,EAAE,2BAAe;AACvBa,MAAAA,KAAK,EAAE,UADgB;AAEvBN,MAAAA,WAAW,EAAE,2BAFU;AAGvBO,MAAAA,YAAY,EAAE;AAHS,KAAf;AAdL;AARgB,CAAlB","sourcesContent":["import {\n  COMPONENT_TYPES,\n  createBoolProp,\n  createTextProp,\n} from \"@draftbit/types\";\nimport React from \"react\";\nimport { StyleProp, ViewStyle } from \"react-native\";\nimport YoutubePlayer from \"react-native-youtube-iframe\";\nimport { extractStyles } from \"../utilities\";\n\ntype Props = {\n  videoId: string;\n  playlist: string;\n  style: StyleProp<ViewStyle>;\n  mute: boolean;\n  autoplay: boolean;\n};\n\nconst Youtube = ({ videoId, playlist, style, mute, autoplay }: Props) => {\n  const {\n    viewStyles: { height, width },\n  } = extractStyles(style);\n\n  return (\n    <YoutubePlayer\n      height={height}\n      width={width}\n      play={autoplay}\n      videoId={videoId}\n      playList={playlist}\n      mute={mute}\n    />\n  );\n};\n\nexport default Youtube;\n\nexport const SEED_DATA = {\n  name: \"Youtube\",\n  tag: \"Youtube\",\n  description: \"Youtube Component\",\n  category: COMPONENT_TYPES.media,\n  layout: {\n    width: \"100%\",\n  },\n  props: {\n    videoId: createTextProp({\n      label: \"VideoId\",\n      description: \"Youtube Video ID\",\n    }),\n    playlist: createTextProp({\n      label: \"PlayList\",\n      description: \"Playlist ID\",\n    }),\n    mute: createBoolProp({\n      label: \"Mute\",\n      description: \"Whether to mute video\",\n      defaultValue: false,\n    }),\n    autoplay: createBoolProp({\n      label: \"Autoplay\",\n      description: \"Whether to Autoplay video\",\n      defaultValue: false,\n    }),\n  },\n};\n"]}

package/lib/module/components/Youtube.js

@@ -1,59 +0,0 @@
-import { COMPONENT_TYPES, createBoolProp, createTextProp } from "@draftbit/types";
-import React from "react";
-import YoutubePlayer from "react-native-youtube-iframe";
-import { extractStyles } from "../utilities";
-
-const Youtube = ({
-  videoId,
-  playlist,
-  style,
-  mute,
-  autoplay
-}) => {
-  const {
-    viewStyles: {
-      height,
-      width
-    }
-  } = extractStyles(style);
-  return /*#__PURE__*/React.createElement(YoutubePlayer, {
-    height: height,
-    width: width,
-    play: autoplay,
-    videoId: videoId,
-    playList: playlist,
-    mute: mute
-  });
-};
-
-export default Youtube;
-export const SEED_DATA = {
-  name: "Youtube",
-  tag: "Youtube",
-  description: "Youtube Component",
-  category: COMPONENT_TYPES.media,
-  layout: {
-    width: "100%"
-  },
-  props: {
-    videoId: createTextProp({
-      label: "VideoId",
-      description: "Youtube Video ID"
-    }),
-    playlist: createTextProp({
-      label: "PlayList",
-      description: "Playlist ID"
-    }),
-    mute: createBoolProp({
-      label: "Mute",
-      description: "Whether to mute video",
-      defaultValue: false
-    }),
-    autoplay: createBoolProp({
-      label: "Autoplay",
-      description: "Whether to Autoplay video",
-      defaultValue: false
-    })
-  }
-};
-//# sourceMappingURL=Youtube.js.map

package/lib/module/components/Youtube.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Youtube.tsx"],"names":["COMPONENT_TYPES","createBoolProp","createTextProp","React","YoutubePlayer","extractStyles","Youtube","videoId","playlist","style","mute","autoplay","viewStyles","height","width","SEED_DATA","name","tag","description","category","media","layout","props","label","defaultValue"],"mappings":"AAAA,SACEA,eADF,EAEEC,cAFF,EAGEC,cAHF,QAIO,iBAJP;AAKA,OAAOC,KAAP,MAAkB,OAAlB;AAEA,OAAOC,aAAP,MAA0B,6BAA1B;AACA,SAASC,aAAT,QAA8B,cAA9B;;AAUA,MAAMC,OAAO,GAAG,CAAC;AAAEC,EAAAA,OAAF;AAAWC,EAAAA,QAAX;AAAqBC,EAAAA,KAArB;AAA4BC,EAAAA,IAA5B;AAAkCC,EAAAA;AAAlC,CAAD,KAAyD;AACvE,QAAM;AACJC,IAAAA,UAAU,EAAE;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV;AADR,MAEFT,aAAa,CAACI,KAAD,CAFjB;AAIA,sBACE,oBAAC,aAAD;AACE,IAAA,MAAM,EAAEI,MADV;AAEE,IAAA,KAAK,EAAEC,KAFT;AAGE,IAAA,IAAI,EAAEH,QAHR;AAIE,IAAA,OAAO,EAAEJ,OAJX;AAKE,IAAA,QAAQ,EAAEC,QALZ;AAME,IAAA,IAAI,EAAEE;AANR,IADF;AAUD,CAfD;;AAiBA,eAAeJ,OAAf;AAEA,OAAO,MAAMS,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,SADiB;AAEvBC,EAAAA,GAAG,EAAE,SAFkB;AAGvBC,EAAAA,WAAW,EAAE,mBAHU;AAIvBC,EAAAA,QAAQ,EAAEnB,eAAe,CAACoB,KAJH;AAKvBC,EAAAA,MAAM,EAAE;AACNP,IAAAA,KAAK,EAAE;AADD,GALe;AAQvBQ,EAAAA,KAAK,EAAE;AACLf,IAAAA,OAAO,EAAEL,cAAc,CAAC;AACtBqB,MAAAA,KAAK,EAAE,SADe;AAEtBL,MAAAA,WAAW,EAAE;AAFS,KAAD,CADlB;AAKLV,IAAAA,QAAQ,EAAEN,cAAc,CAAC;AACvBqB,MAAAA,KAAK,EAAE,UADgB;AAEvBL,MAAAA,WAAW,EAAE;AAFU,KAAD,CALnB;AASLR,IAAAA,IAAI,EAAET,cAAc,CAAC;AACnBsB,MAAAA,KAAK,EAAE,MADY;AAEnBL,MAAAA,WAAW,EAAE,uBAFM;AAGnBM,MAAAA,YAAY,EAAE;AAHK,KAAD,CATf;AAcLb,IAAAA,QAAQ,EAAEV,cAAc,CAAC;AACvBsB,MAAAA,KAAK,EAAE,UADgB;AAEvBL,MAAAA,WAAW,EAAE,2BAFU;AAGvBM,MAAAA,YAAY,EAAE;AAHS,KAAD;AAdnB;AARgB,CAAlB","sourcesContent":["import {\n  COMPONENT_TYPES,\n  createBoolProp,\n  createTextProp,\n} from \"@draftbit/types\";\nimport React from \"react\";\nimport { StyleProp, ViewStyle } from \"react-native\";\nimport YoutubePlayer from \"react-native-youtube-iframe\";\nimport { extractStyles } from \"../utilities\";\n\ntype Props = {\n  videoId: string;\n  playlist: string;\n  style: StyleProp<ViewStyle>;\n  mute: boolean;\n  autoplay: boolean;\n};\n\nconst Youtube = ({ videoId, playlist, style, mute, autoplay }: Props) => {\n  const {\n    viewStyles: { height, width },\n  } = extractStyles(style);\n\n  return (\n    <YoutubePlayer\n      height={height}\n      width={width}\n      play={autoplay}\n      videoId={videoId}\n      playList={playlist}\n      mute={mute}\n    />\n  );\n};\n\nexport default Youtube;\n\nexport const SEED_DATA = {\n  name: \"Youtube\",\n  tag: \"Youtube\",\n  description: \"Youtube Component\",\n  category: COMPONENT_TYPES.media,\n  layout: {\n    width: \"100%\",\n  },\n  props: {\n    videoId: createTextProp({\n      label: \"VideoId\",\n      description: \"Youtube Video ID\",\n    }),\n    playlist: createTextProp({\n      label: \"PlayList\",\n      description: \"Playlist ID\",\n    }),\n    mute: createBoolProp({\n      label: \"Mute\",\n      description: \"Whether to mute video\",\n      defaultValue: false,\n    }),\n    autoplay: createBoolProp({\n      label: \"Autoplay\",\n      description: \"Whether to Autoplay video\",\n      defaultValue: false,\n    }),\n  },\n};\n"]}

package/lib/typescript/src/components/Youtube.d.ts

@@ -1,43 +0,0 @@
-import { StyleProp, ViewStyle } from "react-native";
-declare type Props = {
-    videoId: string;
-    playlist: string;
-    style: StyleProp<ViewStyle>;
-    mute: boolean;
-    autoplay: boolean;
-};
-declare const Youtube: ({ videoId, playlist, style, mute, autoplay }: Props) => JSX.Element;
-export default Youtube;
-export declare const SEED_DATA: {
-    name: string;
-    tag: string;
-    description: string;
-    category: string;
-    layout: {
-        width: string;
-    };
-    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;
-            formType: string;
-            propType: string;
-            defaultValue: boolean;
-            editable: boolean;
-            required: boolean;
-            group: string;
-        };
-    };
-};

package/src/components/Youtube.js

@@ -1,38 +0,0 @@
-import { COMPONENT_TYPES, createBoolProp, createTextProp, } from "@draftbit/types";
-import React from "react";
-import YoutubePlayer from "react-native-youtube-iframe";
-import { extractStyles } from "../utilities";
-const Youtube = ({ videoId, playlist, style, mute, autoplay }) => {
-    const { viewStyles: { height, width }, } = extractStyles(style);
-    return (React.createElement(YoutubePlayer, { height: height, width: width, play: autoplay, videoId: videoId, playList: playlist, mute: mute }));
-};
-export default Youtube;
-export const SEED_DATA = {
-    name: "Youtube",
-    tag: "Youtube",
-    description: "Youtube Component",
-    category: COMPONENT_TYPES.media,
-    layout: {
-        width: "100%",
-    },
-    props: {
-        videoId: createTextProp({
-            label: "VideoId",
-            description: "Youtube Video ID",
-        }),
-        playlist: createTextProp({
-            label: "PlayList",
-            description: "Playlist ID",
-        }),
-        mute: createBoolProp({
-            label: "Mute",
-            description: "Whether to mute video",
-            defaultValue: false,
-        }),
-        autoplay: createBoolProp({
-            label: "Autoplay",
-            description: "Whether to Autoplay video",
-            defaultValue: false,
-        }),
-    },
-};

package/src/components/Youtube.tsx

@@ -1,66 +0,0 @@
-import {
-  COMPONENT_TYPES,
-  createBoolProp,
-  createTextProp,
-} from "@draftbit/types";
-import React from "react";
-import { StyleProp, ViewStyle } from "react-native";
-import YoutubePlayer from "react-native-youtube-iframe";
-import { extractStyles } from "../utilities";
-
-type Props = {
-  videoId: string;
-  playlist: string;
-  style: StyleProp<ViewStyle>;
-  mute: boolean;
-  autoplay: boolean;
-};
-
-const Youtube = ({ videoId, playlist, style, mute, autoplay }: Props) => {
-  const {
-    viewStyles: { height, width },
-  } = extractStyles(style);
-
-  return (
-    <YoutubePlayer
-      height={height}
-      width={width}
-      play={autoplay}
-      videoId={videoId}
-      playList={playlist}
-      mute={mute}
-    />
-  );
-};
-
-export default Youtube;
-
-export const SEED_DATA = {
-  name: "Youtube",
-  tag: "Youtube",
-  description: "Youtube Component",
-  category: COMPONENT_TYPES.media,
-  layout: {
-    width: "100%",
-  },
-  props: {
-    videoId: createTextProp({
-      label: "VideoId",
-      description: "Youtube Video ID",
-    }),
-    playlist: createTextProp({
-      label: "PlayList",
-      description: "Playlist ID",
-    }),
-    mute: createBoolProp({
-      label: "Mute",
-      description: "Whether to mute video",
-      defaultValue: false,
-    }),
-    autoplay: createBoolProp({
-      label: "Autoplay",
-      description: "Whether to Autoplay video",
-      defaultValue: false,
-    }),
-  },
-};