@tactics/toddle-styleguide 5.0.1 → 5.0.2

package/App.tsx

@@ -1,655 +0,0 @@
-import React from 'react';
-import {Button as ReactBtn, ScrollView} from 'react-native';
-import {NavigationContainer} from '@react-navigation/native';
-import {createNativeStackNavigator} from '@react-navigation/native-stack';
-
-// To make luxon work for Android
-import 'intl';
-import 'intl/locale-data/jsonp/en';
-
-// Components
-import {ThemeCtx} from './src/context/theme.context';
-import {StaffMemberTheme} from './src/theme/provider';
-import {LoadFonts} from './src/theme/font';
-import {AvatarPreview} from './src/components/molecules/avatar/avatar.preview';
-import {ButtonPreview} from './src/components/molecules/button/button.preview';
-import {PillPreview} from './src/components/molecules/pill/pill.preview';
-import {SnackbarPreview} from './src/components/molecules/snackbar/snackbar.preview';
-import {TextBubblePreview} from './src/components/organisms/text-bubble/text-bubble.preview';
-import {ImageBubblePreview} from './src/components/atoms/image-bubble/image-bubble.preview';
-import {TimeTrackerPreview} from './src/components/molecules/time-tracker/time-tracker.preview';
-import {CancelLinkPreview} from './src/components/molecules/cancel-link/cancel-link.preview';
-import {InfoPreview} from './src/components/molecules/info/info.preview';
-import {IconSolidPreview} from './src/icons/solid/solid.preview';
-import {IconOutlineWhitePreview} from './src/icons/outline/outline-white.preview';
-import {IconOutlineDefaultPreview} from './src/icons/outline/outline-default.preview';
-import {IconOutlineGreyPreview} from './src/icons/outline/outline-grey.preview';
-import {TagPreview} from './src/components/molecules/tag/tag.preview';
-import {PopoverPreview} from './src/components/templates/popover/popover.preview';
-import {FilterTabPreview} from './src/components/molecules/filter-tab/filter-tab.preview';
-import {ContactItemPreview} from './src/components/organisms/contact-item/contact-item.preview';
-import {SelectListItemPreview} from './src/components/molecules/select-list-item/select-list-item-preview';
-import {CheckboxPreview} from './src/components/molecules/checkbox/checkbox.preview';
-import {CheckPreview} from './src/components/atoms/check-switch/check-switch.preview';
-import {WideButtonPreview} from './src/components/molecules/wide-button/wide-button.preview';
-import {PressableIconPreview} from './src/components/molecules/pressable-icon/pressable-icon.preview';
-import {SplitContainerPreview} from './src/components/atoms/split-container/split-container.preview';
-import {CalendarPreview} from './src/components/atoms/calendar/calendar.preview';
-import {QuickFilterPreview} from './src/components/molecules/quick-filter/quick-filter.preview';
-import {DateInputPreview} from './src/components/molecules/date-input/date-input.preview';
-import {TextInputPreview} from './src/components/atoms/text-input/text-input.preview';
-import {ChildListItemPreview} from './src/components/organisms/child-list-item/child-list-item.preview';
-import {TimeLinePreview} from './src/components/molecules/timeline/timeline.preview';
-import {SelectPickerPreview} from './src/components/molecules/select-picker/select-picker.preview';
-import {FilterRangePreview} from './src/components/molecules/filter-range/filter-range.preview';
-import {IncrementInputPreview} from './src/components/atoms/increment-input/increment-input.preview';
-import {SwipePreview} from './src/components/molecules/swipe/swipe.preview';
-import {LogoPreview} from './src/components/atoms/logo/logo.preview';
-import {ContactRolePreview} from './src/components/molecules/contact-role/contact-role.preview';
-import {SearchPreview} from './src/components/molecules/search-input/search.preview';
-import {BlockedMessagePreview} from './src/components/molecules/blocked-message/blocked-message.preview';
-import {DepartmentLogoPreview} from './src/components/molecules/department_logo/department-logo.preview';
-import {CalendarSelectPreview} from './src/components/molecules/calendar-select/calendar-select.preview';
-import {FooterPreview} from './src/components/atoms/footer/footer.preview';
-import {DefaultSelectPreview} from './src/components/molecules/default-select/default-select.preview';
-import {PasswordInputPreview} from './src/components/molecules/password-input/password-input.preview';
-import {MessageInputPreview} from './src/components/molecules/message-input/message-input.preview';
-import {HeadingsPreview} from './src/components/atoms/heading-components/headings.preview';
-import {ParagraphComponentsPreview} from './src/components/atoms/paragraph-components/paragraph-components.preview';
-import {MyChildListItemPreview} from './src/components/organisms/my-child-list-item/my-child-list-item.preview';
-import {SelectLinkPreview} from './src/components/molecules/select-link/select-link.preview';
-import {MoreInfoButtonPreview} from './src/components/molecules/more-info-button/more-info-button.preview';
-import {LanguageButtonPreview} from './src/components/molecules/language-button/language-button.preview';
-import {ModalPreview} from './src/components/templates/modal/modal.preview';
-import {LoadingIndicatorPreview} from './src/components/organisms/loading-indicator/loading-indicator.preview';
-import {WaveBackgroundPreview} from './src/components/molecules/wave-background/wave.preview';
-import {ToddleDateTimePreview} from './src/utilities/toddle-datetime/toddle-datetime.preview';
-import {BackgroundGradientPreview} from './src/components/atoms/background-gradient/background-gradient.preview';
-import {PersonInfoCardPreview} from './src/components/organisms/person-info-card/person-info-card.preview';
-import {TimePickerPreview} from './src/components/molecules/time-picker/time-picker.preview';
-import {QuickMessagePreview} from './src/components/atoms/quick-message/quick-message.preview';
-import {LinePreview} from './src/components/atoms/line/line.preview';
-import {JournalEntryPreview} from './src/components/organisms/journal-entry/journal-entry.preview';
-import { ContextLabelPreview } from './src/components/molecules/context-label/context-label.preview';
-import { CountPreview } from './src/components/atoms/count/count.preview';
-import { AmountPreview } from './src/components/molecules/amount/amount.preview';
-import { BareTimePickerPreview } from './src/components/molecules/bare-time-picker/bare-time-picker.preview';
-import { TimetableEditorPreview } from './src/components/organisms/timetable-editor/timetable-editor.preview';
-import { InlineErrorPreview } from './src/components/molecules/inline-error/inline-error.preview';
-import { SelectableListItemPreview } from './src/components/molecules/selectable-list-item/selectable-list-item-preview';
-
-import {
-  SafeAreaProvider,
-} from 'react-native-safe-area-context';
-
-const Stack = createNativeStackNavigator();
-
-const HomeScreen = ({navigation}: {navigation: any}) => {
-  return (
-    <ScrollView
-      style={{
-        flex: 1,
-      }}
-      contentContainerStyle={{
-        alignItems: 'center',
-        justifyContent: 'center',
-      }}
-    >
-      <ReactBtn title="Avatar" onPress={() => navigation.push('avatar')} />
-      <ReactBtn title="Amount" onPress={() => navigation.push('amount')} />
-      <ReactBtn
-        title="Blocked message"
-        onPress={() => navigation.push('blocked-message')}
-      />
-      <ReactBtn title="Button" onPress={() => navigation.push('button')} />
-      <ReactBtn title="Calendar" onPress={() => navigation.push('calendar')} />
-      <ReactBtn
-        title="Calendar Select"
-        onPress={() => navigation.push('calendar-select')}
-      />
-      <ReactBtn
-        title="Cancel Link"
-        onPress={() => navigation.push('cancel-link')}
-      />
-      <ReactBtn title="Checkbox" onPress={() => navigation.push('checkbox')} />
-      <ReactBtn
-        title="Check Switch"
-        onPress={() => navigation.push('check-switch')}
-      />
-      <ReactBtn
-        title="Child List Item"
-        onPress={() => navigation.push('child-list-item')}
-      />
-      <ReactBtn
-        title="Contact Info Card"
-        onPress={() => navigation.push('person-info-card')}
-      />
-      <ReactBtn
-        title="Contact Item"
-        onPress={() => navigation.push('contact-item')}
-      />
-      <ReactBtn
-        title="Contact Role"
-        onPress={() => navigation.push('contact-role')}
-      />
-      <ReactBtn
-        title="Context Label"
-        onPress={() => navigation.push('context-label')}
-      />
-      <ReactBtn
-        title="Count"
-        onPress={() => navigation.push('count')}
-      />
-      <ReactBtn
-        title="Date Input"
-        onPress={() => navigation.push('date-input')}
-      />
-      <ReactBtn
-        title="Day Select"
-        onPress={() => navigation.push('day-select')}
-      />
-      <ReactBtn
-        title="Default Select"
-        onPress={() => navigation.push('default-select')}
-      />
-      <ReactBtn
-        title="Department Logo"
-        onPress={() => navigation.push('department-logo')}
-      />
-      <ReactBtn
-        title="Filter Range"
-        onPress={() => navigation.push('filter-range')}
-      />
-      <ReactBtn
-        title="Filter Tab"
-        onPress={() => navigation.push('filter-tab')}
-      />
-      <ReactBtn title="Footer" onPress={() => navigation.push('footer')} />
-      <ReactBtn
-        title="Gradient Background"
-        onPress={() => navigation.push('background-gradient')}
-      />
-      <ReactBtn title="Headings" onPress={() => navigation.push('headings')} />
-      <ReactBtn
-        title="Icons Default"
-        onPress={() => navigation.push('icons default')}
-      />
-      <ReactBtn
-        title="Icons Grey"
-        onPress={() => navigation.push('icons grey')}
-      />
-      <ReactBtn
-        title="Icons Solid"
-        onPress={() => navigation.push('icons solid')}
-      />
-      <ReactBtn
-        title="Icons White"
-        onPress={() => navigation.push('icons white')}
-      />
-      <ReactBtn
-        title="Image Bubble"
-        onPress={() => navigation.push('image-bubble')}
-      />
-      <ReactBtn
-        title="Increment input"
-        onPress={() => navigation.push('increment-input')}
-      />
-      <ReactBtn
-        title="Info Component"
-        onPress={() => navigation.push('info')}
-      />
-      <ReactBtn
-        title="Inline Error"
-        onPress={() => navigation.push('inline-error')}
-      />
-      <ReactBtn
-        title="Journal Entry"
-        onPress={() => navigation.push('journal-entry')}
-      />
-      <ReactBtn
-        title="Language Button"
-        onPress={() => navigation.push('language-button')}
-      />
-      <ReactBtn title="Line" onPress={() => navigation.push('line')} />
-      <ReactBtn
-        title="Loading Indicator"
-        onPress={() => navigation.push('loading-indicator')}
-      />
-      <ReactBtn title="Logo" onPress={() => navigation.push('logo')} />
-      <ReactBtn
-        title="Message Input"
-        onPress={() => navigation.push('message-input')}
-      />
-      <ReactBtn title="Modal" onPress={() => navigation.push('modal')} />
-      <ReactBtn
-        title="More Info Button"
-        onPress={() => navigation.push('more-info-button')}
-      />
-      <ReactBtn
-        title="My Child List Item"
-        onPress={() => navigation.push('my-child-list-item')}
-      />
-      <ReactBtn
-        title="Paragraphs"
-        onPress={() => navigation.push('paragraphs')}
-      />
-      <ReactBtn
-        title="Password Input"
-        onPress={() => navigation.push('password-input')}
-      />
-      <ReactBtn title="Pill" onPress={() => navigation.push('pill')} />
-      <ReactBtn title="Popover" onPress={() => navigation.push('popover')} />
-      <ReactBtn
-        title="Popover Action"
-        onPress={() => navigation.push('popover-action')}
-      />
-      <ReactBtn
-        title="Pressable Icon"
-        onPress={() => navigation.push('pressable-icon')}
-      />
-      <ReactBtn
-        title="Quick Filter"
-        onPress={() => navigation.push('quick-filter')}
-      />
-      <ReactBtn
-        title="Quick Message"
-        onPress={() => navigation.push('quick-message')}
-      />
-      <ReactBtn
-        title="Search Input"
-        onPress={() => navigation.push('search')}
-      />
-      <ReactBtn
-        title="Select Link"
-        onPress={() => navigation.push('select-link')}
-      />
-      <ReactBtn
-        title="Select List Item"
-        onPress={() => navigation.push('select-list-item')}
-      />
-      <ReactBtn
-        title="Selectable List Item"
-        onPress={() => navigation.push('selectable-list-item')}
-      />
-      <ReactBtn
-        title="Select Picker"
-        onPress={() => navigation.push('select-picker')}
-      />
-      <ReactBtn title="Snackbar" onPress={() => navigation.push('snackbar')} />
-      <ReactBtn
-        title="Split Container"
-        onPress={() => navigation.push('split-container')}
-      />
-      <ReactBtn title="Swiper" onPress={() => navigation.push('swiper')} />
-      <ReactBtn title="Tab View" onPress={() => navigation.push('tab-view')} />
-      <ReactBtn title="Tag" onPress={() => navigation.push('tag')} />
-      <ReactBtn
-        title="Text Bubble"
-        onPress={() => navigation.push('textBubble')}
-      />
-      <ReactBtn
-        title="Text Inputs"
-        onPress={() => navigation.push('textInputs')}
-      />
-      <ReactBtn
-        title="Time Picker"
-        onPress={() => navigation.push('time-picker')}
-      />
-      <ReactBtn
-        title="Bare Time Picker"
-        onPress={() => navigation.push('bare-time-picker')}
-      />
-      <ReactBtn
-        title="Time Tracker"
-        onPress={() => navigation.push('time-tracker')}
-      />
-      <ReactBtn
-        title="Timetable Editor"
-        onPress={() => navigation.push('timetable-editor')}
-      />
-      <ReactBtn title="Timeline" onPress={() => navigation.push('timeline')} />
-      <ReactBtn
-        title="Toddle DateTime"
-        onPress={() => navigation.push('toddle-datetime')}
-      />
-      <ReactBtn
-        title="Wave Background"
-        onPress={() => navigation.push('wave')}
-      />
-      <ReactBtn
-        title="Wide Button"
-        onPress={() => navigation.push('wide-button')}
-      />
-    </ScrollView>
-  );
-};
-
-function App() {
-  const [fontsLoaded] = LoadFonts();
-
-  if (!fontsLoaded) {
-    return null;
-  }
-
-  return (
-    <SafeAreaProvider>
-    <ThemeCtx.Provider value={StaffMemberTheme}>
-      <NavigationContainer>
-        <Stack.Navigator>
-          <Stack.Screen name="home" options={{
-    freezeOnBlur: false,
-  }}>
-            {(props) => <HomeScreen {...props} />}
-          </Stack.Screen>
-          <Stack.Screen name="avatar"options={{
-    freezeOnBlur: false,
-  }}>{() => <AvatarPreview />}</Stack.Screen>
-          <Stack.Screen name="amount"options={{
-    freezeOnBlur: false,
-  }}>{() => <AmountPreview />}</Stack.Screen>
-          <Stack.Screen name="background-gradient" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <BackgroundGradientPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="blocked-message" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <BlockedMessagePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="button" options={{
-    freezeOnBlur: false,
-  }}>{() => <ButtonPreview />}</Stack.Screen>
-          <Stack.Screen name="calendar" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CalendarPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="calendar-select" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CalendarSelectPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="cancel-link" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CancelLinkPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="checkbox" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CheckboxPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="check-switch" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CheckPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="child-list-item" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ChildListItemPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="contact-item" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ContactItemPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="contact-role" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ContactRolePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="context-label" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ContextLabelPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="count" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <CountPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="date-input" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <DateInputPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="default-select" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <DefaultSelectPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="department-logo" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <DepartmentLogoPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="filter-tab" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <FilterTabPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="filter-range" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <FilterRangePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="footer" options={{
-    freezeOnBlur: false,
-  }}>{() => <FooterPreview />}</Stack.Screen>
-          <Stack.Screen name="headings" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <HeadingsPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="icons default" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <IconOutlineDefaultPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="icons grey" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <IconOutlineGreyPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="icons solid" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <IconSolidPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="icons white" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <IconOutlineWhitePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="image-bubble" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ImageBubblePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="increment-input" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <IncrementInputPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="info" options={{
-    freezeOnBlur: false,
-  }}>{() => <InfoPreview />}</Stack.Screen>
-          <Stack.Screen name="journal-entry" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <JournalEntryPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="language-button" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <LanguageButtonPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="line" options={{
-    freezeOnBlur: false,
-  }}>{() => <LinePreview />}</Stack.Screen>
-          <Stack.Screen name="loading-indicator" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <LoadingIndicatorPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="logo" options={{
-    freezeOnBlur: false,
-  }}>{() => <LogoPreview />}</Stack.Screen>
-          <Stack.Screen name="message-input" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <MessageInputPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="modal" options={{headerShown: false, freezeOnBlur: false}}>
-            {() => <ModalPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="more-info-button" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <MoreInfoButtonPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="my-child-list-item" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <MyChildListItemPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="paragraphs" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ParagraphComponentsPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="password-input" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <PasswordInputPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="person-info-card" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <PersonInfoCardPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="pill" options={{
-    freezeOnBlur: false,
-  }}>{() => <PillPreview />}</Stack.Screen>
-          <Stack.Screen name="popover" options={{headerShown: false, freezeOnBlur:false}}>
-            {() => <PopoverPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="pressable-icon" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <PressableIconPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="quick-filter" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <QuickFilterPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="quick-message" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <QuickMessagePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="search" options={{
-    freezeOnBlur: false,
-  }}>{() => <SearchPreview />}</Stack.Screen>
-          <Stack.Screen name="select-link" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SelectLinkPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="select-list-item" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SelectListItemPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="select-picker" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SelectPickerPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="snackbar" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SnackbarPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="split-container" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SplitContainerPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="swiper" options={{
-    freezeOnBlur: false,
-  }}>{() => <SwipePreview />}</Stack.Screen>
-          <Stack.Screen name="tag" options={{
-    freezeOnBlur: false,
-  }}>{() => <TagPreview />}</Stack.Screen>
-          <Stack.Screen name="textBubble" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TextBubblePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="textInputs" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TextInputPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="time-picker" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TimePickerPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="bare-time-picker" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <BareTimePickerPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="time-tracker" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TimeTrackerPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="timetable-editor" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TimetableEditorPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="timeline" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <TimeLinePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="toddle-datetime" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <ToddleDateTimePreview />}
-          </Stack.Screen>
-          <Stack.Screen name="wave" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <WaveBackgroundPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="wide-button" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <WideButtonPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="inline-error" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <InlineErrorPreview />}
-          </Stack.Screen>
-          <Stack.Screen name="selectable-list-item" options={{
-    freezeOnBlur: false,
-  }}>
-            {() => <SelectableListItemPreview />}
-          </Stack.Screen>
-        </Stack.Navigator>
-      </NavigationContainer>
-    </ThemeCtx.Provider>
-    </SafeAreaProvider>
-  );
-}
-
-export default App;

package/app.json

@@ -1,37 +0,0 @@
-{
-  "expo": {
-    "name": "Styleguide",
-    "slug": "Styleguide",
-    "version": "1.0.0",
-    "orientation": "portrait",
-    "icon": "./assets/icon.png",
-    "userInterfaceStyle": "light",
-    "splash": {
-      "image": "./assets/splash.png",
-      "resizeMode": "contain",
-      "backgroundColor": "#ffffff"
-    },
-    "updates": {
-      "fallbackToCacheTimeout": 0
-    },
-    "assetBundlePatterns": [
-      "**/*"
-    ],
-    "ios": {
-      "supportsTablet": true
-    },
-    "android": {
-      "adaptiveIcon": {
-        "foregroundImage": "./assets/adaptive-icon.png",
-        "backgroundColor": "#FFFFFF"
-      }
-    },
-    "web": {
-      "bundler": "metro",
-      "favicon": "./assets/favicon.png"
-    },
-    "plugins": [
-      "expo-font"
-    ]
-  }
-}