Skip to content

Commit dcbc7e9

Browse files
committed
fix: docs installation page
1 parent 30281e3 commit dcbc7e9

9 files changed

+217
-163
lines changed

docs/3.4.x/installation-old.mdx

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
---
2+
id: installation
3+
title: Installation
4+
---
5+
6+
import { InstallationTiles } from "../src/components";
7+
8+
**NativeBase** is supported in [Expo](https://docs.expo.dev/get-started/installation/) or React Native CLI initiated apps. Web support is made possible by [react-native-web](https://necolas.github.io/react-native-web/).
9+
(Note: If you are starting a new project, please try [gluestack-ui](https://gluestack.io/ui/docs/home/getting-started/installation/?utm_source=nativebase&utm_medium=docs+install&utm_campaign=installation) for better performance, new design).
10+
11+
Refer the guides shown below to setup NativeBase in your React app.
12+
13+
<Box>
14+
<Box mt="4" mb="8">
15+
<InstallationTiles />
16+
</Box>
17+
</Box>
18+
19+
<br />
20+
21+
### NativeBase VS Code Extensions
22+
23+
[NativeBase VS Code Extensions](https://marketplace.visualstudio.com/items?itemName=NativeBase.nativebase-v3-vscode-extension) are specifically designed to quicken your development process using **NativeBase 3.0**.
24+
NativeBase snippets are shorthand for commonly used NativeBase components.
25+
26+
All snippets start with the prefix `nb-` and are followed by the name of the desired component.
27+
28+
<AspectRatio ratio={1.7} w="100%" maxW="1056">
29+
<Image
30+
resizeMode="contain"
31+
source={{ uri: "https://cdn.nativebase.io/NativeBaseSnippet.gif" }}
32+
alt="aang transitioning to avatar state"
33+
/>
34+
</AspectRatio>

docs/3.4.x/installation.mdx

+1-29
Original file line numberDiff line numberDiff line change
@@ -3,32 +3,4 @@ id: installation
33
title: Installation
44
---
55

6-
import { InstallationTiles } from "../src/components";
7-
8-
**NativeBase** is supported in [Expo](https://docs.expo.dev/get-started/installation/) or React Native CLI initiated apps. Web support is made possible by [react-native-web](https://necolas.github.io/react-native-web/).
9-
(Note: If you are starting a new project, please try [gluestack-ui](https://gluestack.io/ui/docs/home/getting-started/installation/?utm_source=nativebase&utm_medium=docs+install&utm_campaign=installation) for better performance, new design).
10-
11-
Refer the guides shown below to setup NativeBase in your React app.
12-
13-
<Box>
14-
<Box mt="4" mb="8">
15-
<InstallationTiles />
16-
</Box>
17-
</Box>
18-
19-
<br />
20-
21-
### NativeBase VS Code Extensions
22-
23-
[NativeBase VS Code Extensions](https://marketplace.visualstudio.com/items?itemName=NativeBase.nativebase-v3-vscode-extension) are specifically designed to quicken your development process using **NativeBase 3.0**.
24-
NativeBase snippets are shorthand for commonly used NativeBase components.
25-
26-
All snippets start with the prefix `nb-` and are followed by the name of the desired component.
27-
28-
<AspectRatio ratio={1.7} w="100%" maxW="1056">
29-
<Image
30-
resizeMode="contain"
31-
source={{ uri: "https://cdn.nativebase.io/NativeBaseSnippet.gif" }}
32-
alt="aang transitioning to avatar state"
33-
/>
34-
</AspectRatio>
6+
Refer to the gluestack-ui [installation](https://gluestack.io/ui/docs/home/getting-started/installation) page as NativeBase docs are not maintained anymore.

docs/3.4.x/sidebar.json

+124-132
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,127 @@
5555
}
5656
]
5757
},
58+
{
59+
"type": "heading",
60+
"title": "Migration",
61+
"pages": [
62+
{
63+
"id": "migration/v3",
64+
"title": "Upgrading to v3"
65+
},
66+
{
67+
"id": "migration/v3xtov32",
68+
"title": "Upgrading to 3.2.0 from 3.x"
69+
},
70+
{
71+
"id": "migration/v33xtov34x",
72+
"title": "Upgrading to 3.4.0 from 3.3.x"
73+
},
74+
{
75+
"type": "heading",
76+
"title": "Components Migration",
77+
"isCollapsed": true,
78+
"pages": [
79+
{
80+
"id": "migration/action-sheet",
81+
"title": "ActionSheet"
82+
},
83+
{
84+
"id": "migration/badge",
85+
"title": "Badge"
86+
},
87+
{
88+
"id": "migration/button",
89+
"title": "Button"
90+
},
91+
{
92+
"id": "migration/card",
93+
"title": "Card"
94+
},
95+
{
96+
"id": "migration/checkbox",
97+
"title": "Checkbox"
98+
},
99+
{
100+
"id": "migration/date-picker",
101+
"title": "DatePicker"
102+
},
103+
{
104+
"id": "migration/deck-swiper",
105+
"title": "DeckSwiper"
106+
},
107+
{
108+
"id": "migration/drawer",
109+
"title": "Drawer"
110+
},
111+
{
112+
"id": "migration/fab",
113+
"title": "FABs"
114+
},
115+
{
116+
"id": "migration/footer-tab",
117+
"title": "FooterTab"
118+
},
119+
{
120+
"id": "migration/form",
121+
"title": "Form"
122+
},
123+
{
124+
"id": "migration/header",
125+
"title": "Header"
126+
},
127+
{
128+
"id": "migration/icon",
129+
"title": "Icon"
130+
},
131+
{
132+
"id": "migration/layout",
133+
"title": "Layout"
134+
},
135+
{
136+
"id": "migration/picker",
137+
"title": "Picker"
138+
},
139+
{
140+
"id": "migration/radio-button",
141+
"title": "Radio Button"
142+
},
143+
{
144+
"id": "migration/search-bar",
145+
"title": "Searchbar"
146+
},
147+
{
148+
"id": "migration/segment",
149+
"title": "Segment"
150+
},
151+
{
152+
"id": "migration/spinner",
153+
"title": "Spinner"
154+
},
155+
{
156+
"id": "migration/swipe-list",
157+
"title": "SwipeList"
158+
},
159+
{
160+
"id": "migration/tabs",
161+
"title": "Tabs"
162+
},
163+
{
164+
"id": "migration/thumbnail",
165+
"title": "Thumbnail"
166+
},
167+
{
168+
"id": "migration/toast",
169+
"title": "Toast"
170+
},
171+
{
172+
"id": "migration/typography",
173+
"title": "Typography"
174+
}
175+
]
176+
}
177+
]
178+
},
58179
{
59180
"type": "heading",
60181
"title": "Resources",
@@ -65,8 +186,7 @@
65186
},
66187
{
67188
"id": "solito",
68-
"title": "Creating a Universal App with NativeBase and Solito",
69-
"status": "new"
189+
"title": "Creating a Universal App with NativeBase and Solito"
70190
}
71191
]
72192
},
@@ -96,8 +216,7 @@
96216
},
97217
{
98218
"id": "internal-pseudo-props",
99-
"title": "Internal Pseudo Props",
100-
"status": "new"
219+
"title": "Internal Pseudo Props"
101220
},
102221
{
103222
"id": "responsive",
@@ -307,8 +426,7 @@
307426
},
308427
{
309428
"id": "toast",
310-
"title": "Toast",
311-
"status": "update"
429+
"title": "Toast"
312430
}
313431
]
314432
},
@@ -569,132 +687,6 @@
569687
}
570688
]
571689
},
572-
{
573-
"type": "heading",
574-
"title": "Migration",
575-
"pages": [
576-
{
577-
"id": "migration/v3",
578-
"title": "Upgrading to v3"
579-
},
580-
{
581-
"id": "migration/v3xtov32",
582-
"title": "Upgrading to 3.2.0 from 3.x"
583-
},
584-
{
585-
"id": "migration/v33xtov34x",
586-
"title": "Upgrading to 3.4.0 from 3.3.x"
587-
},
588-
{
589-
"type": "heading",
590-
"title": "Components Migration",
591-
"isCollapsed": true,
592-
"pages": [
593-
{
594-
"id": "migration/action-sheet",
595-
"title": "ActionSheet"
596-
},
597-
{
598-
"id": "migration/badge",
599-
"title": "Badge"
600-
},
601-
{
602-
"id": "migration/button",
603-
"title": "Button"
604-
},
605-
{
606-
"id": "migration/card",
607-
"title": "Card"
608-
},
609-
{
610-
"id": "migration/checkbox",
611-
"title": "Checkbox"
612-
},
613-
{
614-
"id": "migration/date-picker",
615-
"title": "DatePicker"
616-
},
617-
{
618-
"id": "migration/deck-swiper",
619-
"title": "DeckSwiper"
620-
},
621-
{
622-
"id": "migration/drawer",
623-
"title": "Drawer"
624-
},
625-
{
626-
"id": "migration/fab",
627-
"title": "FABs"
628-
},
629-
{
630-
"id": "migration/footer-tab",
631-
"title": "FooterTab"
632-
},
633-
{
634-
"id": "migration/form",
635-
"title": "Form"
636-
},
637-
{
638-
"id": "migration/header",
639-
"title": "Header"
640-
},
641-
{
642-
"id": "migration/icon",
643-
"title": "Icon"
644-
},
645-
{
646-
"id": "migration/layout",
647-
"title": "Layout"
648-
},
649-
{
650-
"id": "migration/picker",
651-
"title": "Picker"
652-
},
653-
{
654-
"id": "migration/radio-button",
655-
"title": "Radio Button"
656-
},
657-
{
658-
"id": "migration/search-bar",
659-
"title": "Searchbar"
660-
},
661-
{
662-
"id": "migration/segment",
663-
"title": "Segment"
664-
},
665-
{
666-
"id": "migration/spinner",
667-
"title": "Spinner"
668-
},
669-
{
670-
"id": "migration/swipe-list",
671-
"title": "SwipeList"
672-
},
673-
{
674-
"id": "migration/tabs",
675-
"title": "Tabs"
676-
},
677-
{
678-
"id": "migration/thumbnail",
679-
"title": "Thumbnail"
680-
},
681-
{
682-
"id": "migration/toast",
683-
"title": "Toast"
684-
},
685-
{
686-
"id": "migration/typography",
687-
"title": "Typography"
688-
}
689-
]
690-
},
691-
{
692-
"id": "migration-guide-gluestack-ui",
693-
"title": "Migrating to gluestack-ui",
694-
"status": "experimental"
695-
}
696-
]
697-
},
698690
{
699691
"type": "heading",
700692
"title": "More",

0 commit comments

Comments
 (0)