5.2.0 • Published 6 months ago

nextjs-components v5.2.0

Weekly downloads
-
License
ISC
Repository
github
Last release
6 months ago

nextjs-components

A collection of React components, transcribed from https://vercel.com/design. ^1

^1: This is not affiliated with Vercel

npm latest package npm next package

npm.io npm.io

npm.io npm.io

nextjs-components

Motivation

Blog post from 01/09/2022

Installation

# with npm
npm i nextjs-components
# with yarn
yarn add nextjs-components

This project needs to be transpiled to work with your Next.js application. It is recommended to use Next.js 13.1.0’s built-in module tranpilation. (Up until Next.js 13.1.0, next-transpile-modules handled this use case.)

// next.config.js

/**
 * @type {import('next').NextConfig}
 */
const nextConfig = {
  reactStrictMode: true,
  pageExtensions: ["tsx", "ts"],
  swcMinify: true,
  transpilePackages: ["nextjs-components"],
};

module.exports = nextConfig;

Usage

Using Next 13's app directory

"use client";

// ./app/layout.tsx
import { ThemeContextProvider } from "nextjs-components/src/contexts/ThemeContext";
import "nextjs-components/src/styles/globals.css";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        <ThemeContextProvider>{children}</ThemeContextProvider>
      </body>
    </html>
  );
}

Using the traditional custom _app.tsx

// ./pages/_app.tsx
import {
  ThemeContextProvider,
  ToastArea,
  ToastsProvider,
} from "nextjs-components";
import "nextjs-components/src/styles/globals.css";

function App({ Component, pageProps }) {
  return (
    <ThemeContextProvider>
      <ToastsProvider>
        <Component {...pageProps} />
        <ToastArea />
      </ToastsProvider>
    </ThemeContextProvider>
  );
}

export default App;

Check out the documentation site for more examples!

Warning: Dropped create-react-app support.

In older versions, usage with create-react-app was supported. However, from >=v1.0.0, the pre-built /dist folder was dropped.

5.1.1

7 months ago

5.2.0

6 months ago

4.0.0

8 months ago

5.0.1

8 months ago

5.0.0

8 months ago

3.1.0

8 months ago

5.1.0

8 months ago

4.1.0

8 months ago

4.1.2

8 months ago

4.1.1

8 months ago

2.11.0

11 months ago

2.10.1

12 months ago

3.0.1

10 months ago

3.0.0

10 months ago

2.12.0

11 months ago

2.12.1

11 months ago

2.12.2

11 months ago

2.11.0-rc.1

11 months ago

2.10.0-rc.1

1 year ago

2.7.0-rc.1

1 year ago

2.7.0-rc.2

1 year ago

2.4.0

1 year ago

2.8.1

1 year ago

2.8.0

1 year ago

2.0.0

1 year ago

1.1.0-rc.1

1 year ago

2.3.0

1 year ago

2.3.1

1 year ago

2.7.0

1 year ago

2.7.1

1 year ago

2.8.3

1 year ago

2.8.2

1 year ago

2.9.0-rc.1

1 year ago

2.9.0-rc.2

1 year ago

2.1.0-rc.1

1 year ago

2.9.0-rc.5

1 year ago

2.9.0-rc.3

1 year ago

2.2.0

1 year ago

2.6.1

1 year ago

2.6.0

1 year ago

2.2.0-rc.2

1 year ago

2.0.0-rc.2

1 year ago

2.0.0-rc.3

1 year ago

2.0.0-rc.4

1 year ago

2.2.0-rc.1

1 year ago

2.0.0-rc.5

1 year ago

2.0.0-rc.11

1 year ago

2.0.0-rc.12

1 year ago

2.0.0-rc.10

1 year ago

2.5.0

1 year ago

2.5.1

1 year ago

2.0.0-rc.7

1 year ago

2.1.0

1 year ago

2.0.0-rc.8

1 year ago

2.0.0-rc.9

1 year ago

1.0.0

2 years ago

1.0.0-rc.1

2 years ago

0.10.1

2 years ago

0.10.2

2 years ago

0.10.0

2 years ago

0.11.0

2 years ago

0.9.1

2 years ago

0.9.0

2 years ago

0.7.2

2 years ago

0.7.1

2 years ago

0.7.0

2 years ago

0.8.1

2 years ago

0.6.2

2 years ago

0.8.2

2 years ago

0.3.0

2 years ago

0.5.0

2 years ago

0.5.2

2 years ago

0.5.1

2 years ago

0.4.0

2 years ago

0.6.0

2 years ago

0.2.0-rc.1

2 years ago

0.1.2

2 years ago

0.1.1

2 years ago

0.2.1

2 years ago

0.2.3

2 years ago

0.2.2

2 years ago

0.2.4

2 years ago

0.1.0-rc.71

2 years ago

0.1.0-rc.70

2 years ago

0.1.0

2 years ago

0.1.0-rc69

2 years ago

0.1.0-rc68

2 years ago

0.1.0-rc67

2 years ago

0.1.0-rc66

2 years ago

0.1.0-rc65

2 years ago

0.1.0-rc64

2 years ago

0.1.0-rc63

2 years ago

0.1.0-rc62

2 years ago

0.1.0-rc61

2 years ago

0.1.0-rc60

2 years ago

0.1.0-rc59

2 years ago

0.1.0-rc58

2 years ago

0.1.0-rc57

2 years ago

0.1.0-rc56

2 years ago

0.1.0-rc55

2 years ago

0.1.0-rc54

2 years ago

0.1.0-rc53

2 years ago

0.1.0-rc52

2 years ago

0.1.0-rc51

2 years ago

0.1.0-rc50

2 years ago

0.1.0-rc49

2 years ago

0.1.0-rc48

2 years ago

0.1.0-rc47

2 years ago

0.1.0-rc46

2 years ago

0.1.0-rc45

2 years ago

0.1.0-rc44

2 years ago

0.1.0-rc43

2 years ago

0.1.0-rc42

2 years ago

0.1.0-rc41

2 years ago

0.1.0-rc40

2 years ago

0.1.0-rc39

2 years ago

0.1.0-rc38

2 years ago

0.1.0-rc37

2 years ago

0.1.0-rc36

2 years ago

0.1.0-rc35

2 years ago

0.1.0-rc34

2 years ago

0.1.0-rc33

2 years ago

0.1.0-rc32

2 years ago

0.1.0-rc31

2 years ago

0.1.0-rc30

2 years ago

0.1.0-rc28

2 years ago

0.1.0-rc27

2 years ago

0.1.0-rc26

2 years ago

0.1.0-rc25

2 years ago

0.1.0-rc24

2 years ago

0.1.0-rc23

2 years ago

0.1.0-rc22

2 years ago

0.1.0-rc21

2 years ago

0.1.0-rc20

2 years ago

0.1.0-rc19

2 years ago

0.1.0-rc18

2 years ago

0.1.0-rc17

2 years ago

0.1.0-rc16

2 years ago

0.1.0-rc15

2 years ago

0.1.0-rc14

2 years ago

0.1.0-rc13

2 years ago

0.1.0-rc12

2 years ago

0.1.0-rc11

2 years ago

0.1.0-rc10

2 years ago

0.1.0-rc9

2 years ago

0.1.0-rc8

2 years ago

0.1.0-rc7

2 years ago

0.1.0-rc6

2 years ago

0.1.0-rc5

2 years ago

0.1.0-rc4

2 years ago

0.1.0-rc3

2 years ago

0.1.0-rc2

2 years ago

0.1.0-rc1

2 years ago