4
4
[ ![ Minzip Package] [ bundlePhobiaBadge ]] [ bundlePhobiaUrl ]
5
5
[ ![ NPM Download] [ npmDtBadge ]] [ npmDtUrl ]
6
6
7
- [ npmBadge ] : https://img.shields.io/npm/v/@nuxtbase /auth-ui-vue.svg?maxAge=2592000
8
- [ npmUrl ] : https://www.npmjs.com/package/@nuxtbase /auth-ui-vue
9
- [ npmDtBadge ] : https://img.shields.io/npm/dt/@nuxtbase /auth-ui-vue.svg
10
- [ npmDtUrl ] : https://www.npmjs.com/package/@nuxtbase /auth-ui-vue
11
- [ bundlePhobiaBadge ] : https://img.shields.io/bundlephobia/minzip/@nuxtbase /auth-ui-vue
12
- [ bundlePhobiaUrl ] : https://bundlephobia.com/package/@nuxtbase /auth-ui-vue@latest
7
+ [ npmBadge ] : https://img.shields.io/npm/v/@supa-kit /auth-ui-vue.svg?maxAge=2592000
8
+ [ npmUrl ] : https://www.npmjs.com/package/@supa-kit /auth-ui-vue
9
+ [ npmDtBadge ] : https://img.shields.io/npm/dt/@supa-kit /auth-ui-vue.svg
10
+ [ npmDtUrl ] : https://www.npmjs.com/package/@supa-kit /auth-ui-vue
11
+ [ bundlePhobiaBadge ] : https://img.shields.io/bundlephobia/minzip/@supa-kit /auth-ui-vue
12
+ [ bundlePhobiaUrl ] : https://bundlephobia.com/package/@supa-kit /auth-ui-vue@latest
13
13
14
14
> Pre-built auth widgets to get started in minutes.
15
15
@@ -58,9 +58,9 @@ Customizable authentication UI component with custom themes and extensible style
58
58
To start using the library in Vue 3, install these in your project:
59
59
60
60
``` bash
61
- pnpm install @supabase/supabase-js @supabase/auth-ui-shared @nuxtbase /auth-ui-vue -D
61
+ pnpm install @supabase/supabase-js @supabase/auth-ui-shared @supa-kit /auth-ui-vue -D
62
62
or
63
- yarn add @supabase/supabase-js @supabase/auth-ui-shared @nuxtbase /auth-ui-vue -D
63
+ yarn add @supabase/supabase-js @supabase/auth-ui-shared @supa-kit /auth-ui-vue -D
64
64
```
65
65
66
66
``` html
@@ -81,7 +81,7 @@ yarn add @supabase/supabase-js @supabase/auth-ui-shared @nuxtbase/auth-ui-vue -D
81
81
import { ThemeSupa } from ' @supabase/auth-ui-shared'
82
82
import { createClient } from ' @supabase/supabase-js'
83
83
84
- import { Auth } from ' @nuxtbase /auth-ui-vue'
84
+ import { Auth } from ' @supa-kit /auth-ui-vue'
85
85
86
86
const supabaseClient = createClient (
87
87
' <INSERT PROJECT URL>' ,
@@ -101,9 +101,9 @@ Here's a example work with `@nuxtjs/supabase`:
101
101
First install these in your project:
102
102
103
103
``` bash
104
- pnpm install @nuxtjs/supabase @supabase/auth-ui-shared @nuxtbase /auth-ui-vue -D
104
+ pnpm install @nuxtjs/supabase @supabase/auth-ui-shared @supa-kit /auth-ui-vue -D
105
105
or
106
- yarn add @nuxtjs/supabase @supabase/auth-ui-shared @nuxtbase /auth-ui-vue -D
106
+ yarn add @nuxtjs/supabase @supabase/auth-ui-shared @supa-kit /auth-ui-vue -D
107
107
```
108
108
109
109
Add ` @nuxtjs/supabase ` to the modules section of ` nuxt.config.ts ` :
@@ -140,7 +140,7 @@ Now, you can access the [supabase client](https://supabase.com/docs/reference/ja
140
140
<script setup lang =" ts" >
141
141
// Import predefined theme
142
142
import { ThemeSupa } from ' @supabase/auth-ui-shared'
143
- import { Auth } from ' @nuxtbase /auth-ui-vue'
143
+ import { Auth } from ' @supa-kit /auth-ui-vue'
144
144
145
145
const supabaseClient = useSupabaseClient ()
146
146
</script >
@@ -171,7 +171,7 @@ The Auth component also supports login with [official social providers](https://
171
171
import { ThemeSupa } from ' @supabase/auth-ui-shared'
172
172
import { createClient } from ' @supabase/supabase-js'
173
173
174
- import { Auth } from ' @nuxtbase /auth-ui-vue'
174
+ import { Auth } from ' @supa-kit /auth-ui-vue'
175
175
176
176
const supabaseClient = createClient (
177
177
' <INSERT PROJECT URL>' ,
@@ -282,7 +282,7 @@ Auth UI comes with several themes to customize the appearance. Each predefined t
282
282
import { ThemeSupa } from ' @supabase/auth-ui-shared'
283
283
import { createClient } from ' @supabase/supabase-js'
284
284
285
- import { Auth } from ' @nuxtbase /auth-ui-vue'
285
+ import { Auth } from ' @supa-kit /auth-ui-vue'
286
286
287
287
const supabaseClient = createClient (
288
288
' <INSERT PROJECT URL>' ,
@@ -317,7 +317,7 @@ Auth UI comes with two theme variations: `default` and `dark`. You can switch be
317
317
import { ThemeSupa } from ' @supabase/auth-ui-shared'
318
318
import { createClient } from ' @supabase/supabase-js'
319
319
320
- import { Auth } from ' @nuxtbase /auth-ui-vue'
320
+ import { Auth } from ' @supa-kit /auth-ui-vue'
321
321
322
322
const supabaseClient = createClient (
323
323
' <INSERT PROJECT URL>' ,
@@ -358,7 +358,7 @@ Auth UI themes can be overridden using variable tokens. See the [list of variabl
358
358
import { ThemeSupa } from ' @supabase/auth-ui-shared'
359
359
import { createClient } from ' @supabase/supabase-js'
360
360
361
- import { Auth } from ' @nuxtbase /auth-ui-vue'
361
+ import { Auth } from ' @supa-kit /auth-ui-vue'
362
362
363
363
const supabaseClient = createClient (
364
364
' <INSERT PROJECT URL>' ,
@@ -390,7 +390,7 @@ See the list of [tokens within a theme](https://github.com/supabase/auth-ui/blob
390
390
391
391
<script setup lang =" ts" >
392
392
import { createClient } from ' @supabase/supabase-js'
393
- import { Auth } from ' @nuxtbase /auth-ui-vue'
393
+ import { Auth } from ' @supa-kit /auth-ui-vue'
394
394
395
395
const customTheme = {
396
396
default: {
@@ -455,7 +455,7 @@ You can use custom CSS classes for the following elements:
455
455
456
456
<script setup lang =" ts" >
457
457
import { createClient } from ' @supabase/supabase-js'
458
- import { Auth } from ' @nuxtbase /auth-ui-vue'
458
+ import { Auth } from ' @supa-kit /auth-ui-vue'
459
459
460
460
const supabaseClient = createClient (
461
461
' <INSERT PROJECT URL>' ,
@@ -488,7 +488,7 @@ You can use custom CSS inline styles for the following elements:
488
488
489
489
<script setup lang =" ts" >
490
490
import { createClient } from ' @supabase/supabase-js'
491
- import { Auth } from ' @nuxtbase /auth-ui-vue'
491
+ import { Auth } from ' @supa-kit /auth-ui-vue'
492
492
493
493
const supabaseClient = createClient (
494
494
' <INSERT PROJECT URL>' ,
@@ -521,7 +521,7 @@ You can use custom labels with localization.variables. See the [list of labels](
521
521
522
522
<script setup lang =" ts" >
523
523
import { createClient } from ' @supabase/supabase-js'
524
- import { Auth } from ' @nuxtbase /auth-ui-vue'
524
+ import { Auth } from ' @supa-kit /auth-ui-vue'
525
525
526
526
const supabaseClient = createClient (
527
527
' <INSERT PROJECT URL>' ,
@@ -548,7 +548,7 @@ This will be useful when the sub-components need to access the `user` data at an
548
548
549
549
<script setup lang =" ts" >
550
550
import { createClient } from ' @supabase/supabase-js'
551
- import { UserContextProvider } from ' @nuxtbase /auth-ui-vue'
551
+ import { UserContextProvider } from ' @supa-kit /auth-ui-vue'
552
552
553
553
import Profile from ' @/components/Profile.vue'
554
554
@@ -571,7 +571,7 @@ This will be useful when the sub-components need to access the `user` data at an
571
571
injectStrict ,
572
572
UserContextProviderInjection ,
573
573
UserContextProviderKey
574
- } from ' @nuxtbase /auth-ui-vue'
574
+ } from ' @supa-kit /auth-ui-vue'
575
575
576
576
const { user } = injectStrict< UserContextProviderInjection> (
577
577
UserContextProviderKey
0 commit comments