fix: added todo app example

Author: Suraj

example/storybook-nativewind/.storybook/preview.js

@@ -89,7 +89,7 @@ export const parameters = {
         'Hooks',
         ['useBreakPointValue', 'useMediaQuery'],
         'Apps',
-        ['Dashboard App', 'Starter Kit', 'Storybook App'],
+        ['Dashboard App', 'Todo App', 'Starter Kit', 'Storybook App'],
         'Guides',
         [
           'Recipes',

example/storybook-nativewind/src/apps/todo-app/Expand.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+export const Expand = () => {
+  return (
+    <svg
+      width="40"
+      height="40"
+      viewBox="0 0 40 40"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <rect x="0.5" y="0.5" width="39" height="39" rx="19.5" fill="black" />
+      <path
+        d="M27.235 21.234H12.765V24.728L8 19.964L12.765 15.199V18.693H27.235V15.199L32 19.964L27.235 24.729V21.234Z"
+        fill="#FAFAFA"
+      />
+      <rect x="0.5" y="0.5" width="39" height="39" rx="19.5" stroke="#525252" />
+    </svg>
+  );
+};

example/storybook-nativewind/src/apps/todo-app/index.stories.mdx

@@ -0,0 +1,19 @@
+---
+title: Todo App | gluestack-ui
+description: A todo app created using all the components of gluestack-ui v2
+toc: false
+---
+
+import { Canvas, Meta, Story } from '@storybook/addon-docs';
+import Responsiveness from '../../extra-components/nativewind/Responsive';
+import { todoapp } from '../../extra-components/nativewind/appConfig';
+
+<Meta title="with-nativewind/Apps/Todo App" />
+
+# Todo App
+
+This [Todo App](https://gluestack-ui-todo-example-app.vercel.app/) is built using `gluestack-ui v2`.
+
+<Responsiveness {...todoapp} showMenuItems={true} />
+
+GitHub link for this [Todo App](https://github.com/gluestack/gluestack-ui-todo-example-app).

example/storybook-nativewind/src/extra-components/nativewind/appConfig.tsx

@@ -7,6 +7,15 @@ export const kitchensink = {
   qrCodeUri:
     'https://qr.expo.dev/eas-update?slug=exp&projectId=42cce9b5-9fbe-4572-92ba-fc43b2437a85&groupId=432e8802-2a73-4498-8301-5ac41664678e',
 };
+export const todoapp = {
+  updateIds: {
+    android: 'd2aa812c-739b-4200-8455-a8ca6da22310',
+    ios: '742e1120-7c9a-4bba-bfe0-1dd4b812934b',
+  },
+  iframeUri: 'https://gluestack-ui-todo-example-app.vercel.app/',
+  qrCodeUri:
+    'https://qr.expo.dev/eas-update?slug=exp&projectId=42cce9b5-9fbe-4572-92ba-fc43b2437a85&groupId=432e8802-2a73-4498-8301-5ac41664678e',
+};
 
 export const appStoryConfig = {
   updateIds: {