@descope/vue-sdk - npm Package Compare versions

Comparing version 0.0.0-next-18b2d29d-20240311 to 0.0.0-next-1e8d2e3c-20240429

package.json

		{
		"name": "@descope/vue-sdk",
		"version": "0.0.0-next-18b2d29d-20240311",
		"version": "0.0.0-next-1e8d2e3c-20240429",
		"main": "dist/index.cjs",
		@@ -40,4 +40,8 @@ "module": "dist/index.mjs",
		"dependencies": {
		"@descope/user-management-widget": "0.0.9",
		"@descope/web-component": "3.8.2"
		"@descope/access-key-management-widget": "0.1.47",
		"@descope/audit-management-widget": "0.1.10",
		"@descope/role-management-widget": "0.1.45",
		"@descope/user-management-widget": "0.4.47",
		"@descope/user-profile-widget": "0.0.11",
		"@descope/web-component": "3.11.5"
		},
		@@ -48,3 +52,3 @@ "peerDependencies": {
		"optionalDependencies": {
		"@descope/web-js-sdk": "1.0.11"
		"@descope/web-js-sdk": ">=1.10.24"
		},
		@@ -51,0 +55,0 @@ "devDependencies": {

172

README.md

		@@ -215,2 +215,4 @@ # Descope Vue SDK
		`refresh(token = getRefreshToken())` - Force a refresh on current session token using an existing valid refresh token.
		`isSessionTokenExpired(token = getSessionToken())` - Check whether the current session token is expired. Provide a session token if is not persisted.
		`isRefreshTokenExpired(token = getRefreshToken())` - Check whether the current refresh token is expired. Provide a refresh token if is not persisted.
		`getJwtRoles(token = getSessionToken(), tenant = '')` - Get current roles from an existing session token. Provide tenant id for specific tenant roles.
		@@ -226,2 +228,172 @@ `getJwtPermissions(token = getSessionToken(), tenant = '')` - Fet current permissions from an existing session token. Provide tenant id for specific tenant permissions.

		### Token Persistence

		Descope stores two tokens: the session token and the refresh token.

		- The refresh token is either stored in local storage or an `httpOnly` cookie. This is configurable in the Descope console.
		- The session token is stored in either local storage or a JS cookie. This behavior is configurable via the `sessionTokenViaCookie` prop in the Descope plugin.

		However, for security reasons, you may choose not to store tokens in the browser. In this case, you can pass `persistTokens: false` to the Descope plugin. This prevents the SDK from storing the tokens in the browser.

		Notes:

		- You must configure the refresh token to be stored in an `httpOnly` cookie in the Descope console. Otherwise, the refresh token will not be stored, and when the page is refreshed, the user will be logged out.
		- You can still retrieve the session token using the `useSession` hook.

		### Last User Persistence

		Descope stores the last user information in local storage. If you wish to disable this feature, you can pass `storeLastAuthenticatedUser: false` to the Descope plugin. Please note that some features related to the last authenticated user may not function as expected if this behavior is disabled.

		### Widgets

		Widgets are components that allow you to expose management features for tenant-based implementation. In certain scenarios, your customers may require the capability to perform managerial actions independently, alleviating the necessity to contact you. Widgets serve as a feature enabling you to delegate these capabilities to your customers in a modular manner.

		Important Note:

		- For the user to be able to use the widget, they need to be assigned the `Tenant Admin` Role.

		#### User Management

		The `UserManagement` widget lets you embed a user table in your site to view and take action.

		The widget lets you:

		- Create a new user
		- Edit an existing user
		- Activate / disable an existing user
		- Reset an existing user's password
		- Remove an existing user's passkey
		- Delete an existing user

		Note:

		- Custom fields also appear in the table.

		###### Usage

		```vue
		<template>
		<UserManagement tenant="tenant-id" widget-id="user-management-widget" />
		</template>

		<script setup>
		import { UserManagement } from '@descope/vue-sdk';
		</script>
		```

		Example:
		[Manage Users](./example/components/ManageUsers.vue)

		#### Role Management

		The `RoleManagement` widget lets you embed a role table in your site to view and take action.

		The widget lets you:

		- Create a new role
		- Change an existing role's fields
		- Delete an existing role

		Note:

		- The `Editable` field is determined by the user's access to the role - meaning that project-level roles are not editable by tenant level users.
		- You need to pre-define the permissions that the user can use, which are not editable in the widget.

		###### Usage

		```vue
		<template>
		<RoleManagement tenant="tenant-id" widget-id="role-management-widget" />
		</template>

		<script setup>
		import { RoleManagement } from '@descope/vue-sdk';
		</script>
		```

		Example:
		[Manage Roles](./example/components/ManageRoles.vue)

		#### Access Key Management

		The `AccessKeyManagement` widget lets you embed an access key table in your site to view and take action.

		The widget lets you:

		- Create a new access key
		- Activate / deactivate an existing access key
		- Delete an exising access key

		###### Usage

		```vue
		<template>
		<!-- admin view: manage all tenant users' access keys -->
		<AccessKeyManagement
		tenant="tenant-id"
		widget-id="access-key-management-widget"
		/>

		<!-- user view: mange access key for the logged-in tenant's user -->
		<AccessKeyManagement
		tenant="tenant-id"
		widget-id="user-access-key-management-widget"
		/>
		</template>

		<script setup>
		import { AccessKeyManagement } from '@descope/vue-sdk';
		</script>
		```

		Example:
		[Manage Access Keys](./example/components/ManageAccessKeys.vue)

		#### Audit Management

		The `AuditManagement` widget lets you embed an audit table in your site.

		###### Usage

		```vue
		<template>
		<AuditManagement tenant="tenant-id" widget-id="audit-management-widget" />
		</template>

		<script setup>
		import { AuditManagement } from '@descope/vue-sdk';
		</script>
		```

		Example:
		[Manage Audit](./example/components/ManageAudit.vue)

		#### User Profile

		The `UserProfile` widget lets you embed a user profile component in your app and let the logged in user update his profile.

		The widget lets you:

		- Update user profile picture
		- Update user personal information
		- Update authentication methods
		- Logout

		###### Usage

		```vue
		<template>
		<UserProfile widget-id="user-profile-widget" @logout="onLogout" />
		</template>

		<script setup>
		import { UserProfile } from '@descope/vue-sdk';

		const onLogout = () => (window.location.href = '/login');
		</script>
		```

		Example:
		[User Profile](./example/components/MyUserProfile.vue)

		## Code Example
		@@ -228,0 +400,0 @@

dist/index.cjs

Sorry, the diff of this file is not supported yet

dist/index.d.ts

Sorry, the diff of this file is too big to display

dist/index.mjs

Sorry, the diff of this file is not supported yet

@descope/vue-sdk - npm Package Compare versions

Improved metrics

Worsened metrics

Dependency changes