creacion de componente loading con animación

janis-commerce · Jul 26, 2023 · dfcb1ba · dfcb1ba
1 parent 99ec0d5
commit dfcb1ba
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 0 deletions.
diff --git a/.ondevice/storybook.requires.js b/.ondevice/storybook.requires.js
@@ -41,6 +41,7 @@ const getStories = () => {
     "./storybook/stories/Avatar/Avatar.stories.js": require("../storybook/stories/Avatar/Avatar.stories.js"),
     "./storybook/stories/CheckBox/CheckBox.stories.js": require("../storybook/stories/CheckBox/CheckBox.stories.js"),
     "./storybook/stories/Image/Image.stories.js": require("../storybook/stories/Image/Image.stories.js"),
+    "./storybook/stories/Loading/Loading.stories.js": require("../storybook/stories/Loading/Loading.stories.js"),
     "./storybook/stories/Text/Text.stories.js": require("../storybook/stories/Text/Text.stories.js"),
   };
 };

diff --git a/storybook/stories/Loading/Loading.stories.js b/storybook/stories/Loading/Loading.stories.js
@@ -0,0 +1,30 @@
+import React from 'react';
+import {Text} from 'react-native';
+import Loading from '../../../src/components/Loading';
+
+export default {
+	title: 'Loading',
+	argTypes: {
+		isLoading: {
+			options: [true, false],
+		},
+		onValueChange: {
+			action: 'Value changed!',
+		},
+		disabled: {
+			options: [true, false],
+			control: {type: 'radio'},
+		},
+	},
+};
+
+export const DefaultProps = (props) => <Loading {...props} />;
+
+DefaultProps.storyName = 'default props';
+
+DefaultProps.args = {
+	isLoading: true,
+	color: '#2979FF',
+	duration: 1000,
+	children: <Text>Loading</Text>,
+};