Skip to content

Commit

Permalink
feat: added gluestack-ui
Browse files Browse the repository at this point in the history
  • Loading branch information
Suraj authored and Suraj committed Dec 6, 2023
1 parent 30bc9f1 commit cd45273
Show file tree
Hide file tree
Showing 10 changed files with 3,485 additions and 128 deletions.
8 changes: 8 additions & 0 deletions babel.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,14 @@
module.exports = {
presets: ["@expo/next-adapter/babel"],
plugins: [
[
"module-resolver",
{
alias: {
"native-base": "@gluestack-ui/themed-native-base",
},
},
],
["@babel/plugin-proposal-private-methods", { loose: true }],
["@babel/plugin-proposal-private-property-in-object", { loose: true }],
],
Expand Down
6 changes: 0 additions & 6 deletions layouts/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -328,11 +328,6 @@ function Layout({
<Sidebar sidebar={sidebar} />
</Box>
<Box flex={1}>
{/* <a
target="_blank"
rel="noopener noreferrer"
href={`https://ui.gluestack.io//?utm_source=nativebase-docs&utm_medium=banner+&utm_campaign=nativebase-banner-cta&utm_id=nativebase-campaign-banner`}
> */}
<Stack
alignItems={{ md: "center" }}
justifyContent={{ md: "center" }}
Expand Down Expand Up @@ -448,7 +443,6 @@ function Layout({
</Text>
</HStack>
</Stack>
{/* </a> */}
<Box flexDirection="row" flex={1}>
<MainContent
pages={pages}
Expand Down
128 changes: 87 additions & 41 deletions next.config.js
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,81 @@
const withFonts = require('next-fonts');
const withMDX = require('@next/mdx')({
const withFonts = require("next-fonts");
const withMDX = require("@next/mdx")({
extension: /\.mdx?$/,
});
const { withExpo } = require('@expo/next-adapter');
const redirectsJSON = require('./redirects.json');
const withPlugins = require('next-compose-plugins');
const withTM = require('next-transpile-modules')([
'native-base',
'react-native-web',
'react-native-svg',
// "react-native-safe-area-context",
// "@react-aria/visually-hidden",
// "@react-native-aria/button",
// "@react-native-aria/checkbox",
// "@react-native-aria/combobox",
// "@react-native-aria/focus",
// "@react-native-aria/interactions",
// "@react-native-aria/listbox",
// "@react-native-aria/overlays",
// "@react-native-aria/radio",
// "@react-native-aria/slider",
// "@react-native-aria/tabs",
// "@react-native-aria/utils",
// "@react-stately/combobox",
// "@react-stately/radio",
const { withExpo } = require("@expo/next-adapter");
const redirectsJSON = require("./redirects.json");
const withPlugins = require("next-compose-plugins");
const { withGluestackUI } = require("@gluestack/ui-next-adapter");

const withTM = require("next-transpile-modules")([
"react-native-web",
"react-native",

"@expo/vector-icons",

"@gluestack-style/react",
"@gluestack-style/legend-motion-animation-driver",
"@gluestack-style/animation-plugin",
"@gluestack-style/animation-resolver",
"@gluestack-style/legend-motion-animation-driver",
"@legendapp/motion",

"@expo/html-elements",
"expo-linear-gradient",

"react-native-svg",
"@react-native-aria/interactions",
"@react-native-aria/checkbox",
"@react-native-aria/focus",
"@react-native-aria/overlays",
"@react-native-aria/radio",
"@react-native-aria/slider",
"@react-stately/slider",
"@react-native-aria/toggle",
"@react-native-aria/utils",
"@react-native-aria/menu",
"@gluestack-ui/actionsheet",
"@gluestack-ui/form-control",
"@gluestack-ui/avatar",
"@gluestack-ui/modal",
"@gluestack-ui/button",
"@gluestack-ui/checkbox",
"@gluestack-ui/divider",
"@gluestack-ui/fab",
"@gluestack-ui/hooks",
"@gluestack-ui/hstack",
"@gluestack-ui/icon",
"@gluestack-ui/input",
"@gluestack-ui/link",
"@gluestack-ui/menu",
"@gluestack-ui/modal",
"@gluestack-ui/overlay",
"@gluestack-ui/popover",
"@gluestack-ui/progress",
"@gluestack-ui/provider",
"@gluestack-ui/radio",
"@gluestack-ui/select",
"@gluestack-ui/slider",
"@gluestack-ui/spinner",

"@gluestack-ui/switch",
"@gluestack-ui/textarea",
"@gluestack-ui/toast",
"@gluestack-ui/tooltip",
"@gluestack-ui/vstack",
"@gluestack-ui/transitions",
"@gluestack-ui/utils",
"@gluestack-ui/tabs",
"@gluestack-ui/react-native-aria",
"@gluestack-ui/alert-dialog",
"@gluestack-ui/pressable",
"@gluestack-ui/themed-native-base",
]);

module.exports = withPlugins(
[[withTM], [withFonts], [withMDX], [withExpo, { projectRoot: __dirname }]],
{
pageExtensions: ['ts', 'tsx', 'js', 'jsx', 'md', 'mdx'],
pageExtensions: ["ts", "tsx", "js", "jsx", "md", "mdx"],
// webpack: (config) => {
// config.resolve.alias = {
// ...(config.resolve.alias || {}),
Expand All @@ -47,26 +93,26 @@ module.exports = withPlugins(
async redirects() {
return [
{
source: '/discord',
destination: 'https://discord.com/invite/TSgCw2UPmb',
source: "/discord",
destination: "https://discord.com/invite/TSgCw2UPmb",
permanent: true,
},
{
source: '/blogs',
destination: 'https://nativebase.io/blogs',
source: "/blogs",
destination: "https://nativebase.io/blogs",
permanent: true,
},
...redirectsJSON,
];
},
images: {
domains: [
'docs.nativebase.io',
'media-exp1.licdn.com',
'mir-s3-cdn-cf.behance.net',
'avatars.githubusercontent.com',
'images.opencollective.com',
'pbs.twimg.com',
"docs.nativebase.io",
"media-exp1.licdn.com",
"mir-s3-cdn-cf.behance.net",
"avatars.githubusercontent.com",
"images.opencollective.com",
"pbs.twimg.com",
],
},
env: {
Expand All @@ -76,12 +122,12 @@ module.exports = withPlugins(
config.resolve.alias = {
...(config.resolve.alias || {}),
// Transform all direct `react-native` imports to `react-native-web`
'react-native$': 'react-native-web',
"react-native$": "react-native-web",
};
config.resolve.extensions = [
'.web.js',
'.web.ts',
'.web.tsx',
".web.js",
".web.ts",
".web.tsx",
...config.resolve.extensions,
];
return config;
Expand All @@ -90,8 +136,8 @@ module.exports = withPlugins(
ignoreBuildErrors: true,
},
i18n: {
locales: ['en'],
defaultLocale: 'en',
locales: ["en"],
defaultLocale: "en",
},
}
);
14 changes: 9 additions & 5 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"private": true,
"scripts": {
"create-version": "node ./lib/scripts/build-version.js",
"dev": "node ./build-init.js && next dev",
"dev": "node ./build-init.js && NODE_OPTIONS=--openssl-legacy-provider next dev",
"build": "node ./build-init.js && NODE_OPTIONS=--openssl-legacy-provider next build ",
"start": "next start",
"lint": "next lint",
Expand All @@ -17,8 +17,11 @@
"@babel/traverse": "^7.16.3",
"@docsearch/react": "^3.0.0-alpha.42",
"@expo/vector-icons": "^12.0.5",
"@gluestack-ui/themed-native-base": "^0.1.39",
"@gluestack/ui-next-adapter": "^2.1.10",
"@mdx-js/loader": "^1.6.22",
"@next/mdx": "^12.0.4",
"@react-aria/overlays": "^3.19.0",
"@react-native-community/masked-view": "0.1.10",
"@react-navigation/drawer": "^6.1.8",
"@react-navigation/native": "5.0.8",
Expand All @@ -27,7 +30,7 @@
"codesandbox": "^2.2.3",
"expo-font": "^10.0.3",
"expo-linear-gradient": "^11.3.0",
"expo-modules-core": "^0.9.1",
"expo-modules-core": "^1.5.12",
"formik": "2.2.9",
"gray-matter": "^4.0.3",
"native-base": "^3.4.19",
Expand All @@ -36,9 +39,9 @@
"next-mdx-remote": "^3.0.8",
"prettier": "^2.5.1",
"prism-react-renderer": "^1.2.1",
"react": "17.0.2",
"react": "18",
"react-docgen-typescript": "^2.2.1",
"react-dom": "17.0.2",
"react-dom": "18",
"react-live": "^2.3.0",
"react-native": "^0.66.3",
"react-native-gesture-handler": "1.10.2",
Expand All @@ -52,10 +55,11 @@
"react-native-swipe-list-view": "^3.2.9",
"react-native-tab-view": "^3.1.1",
"react-native-vector-icons": "^9.0.0",
"react-native-web": "^0.17.5",
"react-native-web": "0.19",
"react-navigation": "^4.4.4"
},
"devDependencies": {
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@expo/next-adapter": "3.1.12",
"@next/bundle-analyzer": "^12.0.4",
"@types/mdx-js__react": "^1.5.5",
Expand Down
1 change: 0 additions & 1 deletion pages/_app.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import "../styles/globals.css";
import type { AppProps } from "next/app";
import colors from "native-base/src/theme/base/colors";
import { ColorMode, NativeBaseProvider, StorageManager } from "native-base";
import { AppContext } from "../src/AppContext";
import { useEffect, useState } from "react";
Expand Down
2 changes: 1 addition & 1 deletion src/components/TileLink/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export default function TileLink({
_title,
...props
}: any) {
const Image = Factory(NextImage);
const Image = Factory(NextImage, { baseStyle: {} });
return (
<Link passHref href={url}>
<Box
Expand Down
4 changes: 3 additions & 1 deletion src/new-components/Sidebar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ const SidebarItem = (props: any) => {

return sidebarItems.map((item: any, index: any) => {
if (item?.notVisibleInSidebar === true) return null;

return (
<Box key={index} w="100%">
{item.pages === undefined ? (
Expand Down Expand Up @@ -112,8 +113,9 @@ const SidebarItem = (props: any) => {
collapsed={item.isCollapsed || false}
setIsOpenSidebar={setIsOpenSidebar}
>
{console.log(item.pages, ">>>>>>")}
<SidebarItem
sidebarItems={item.pages}
sidebarItems={[]}
level={level + 1}
setIsOpenSidebar={setIsOpenSidebar}
isMobile={isMobile}
Expand Down
Loading

0 comments on commit cd45273

Please sign in to comment.