@workos-inc/widgets 1.0.1 → 1.1.1

package/dist/esm/user-sessions.client.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-sessions.client.js","sourceRoot":"","sources":["../../src/user-sessions.client.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,YAAY,IAAI,0BAA0B,GAC3C,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAejD,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,KAAK,EAAE,EAAE;IACjE,MAAM,OAAO,GAAG,eAAe,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,WAAW,IAAC,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,EAAE,OAAO,YACvD,KAAC,mBAAmB,IAClB,gBAAgB,EACd,kBAAkB,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,GAElE,GACU,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,EAC3B,gBAAgB,GAGjB,EAAE,EAAE;IACH,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IACnC,MAAM,aAAa,GAAG,WAAW,EAAE,CAAC;IACpC,MAAM,qBAAqB,GAAG,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;IAEzE,IACE,CAAC,UAAU;QACX,aAAa,CAAC,SAAS;QACvB,qBAAqB,CAAC,SAAS,EAC/B,CAAC;QACD,OAAO,KAAC,mBAAmB,KAAG,CAAC;IACjC,CAAC;IAED,IAAI,aAAa,CAAC,OAAO,IAAI,qBAAqB,CAAC,OAAO,EAAE,CAAC;QAC3D,OAAO,CACL,KAAC,iBAAiB,IAChB,KAAK,EAAE,aAAa,CAAC,KAAK,IAAI,qBAAqB,CAAC,KAAK,GACzD,CACH,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,aAAa,IAAC,iBAAiB,EAAE,iBAAiB,YACjD,KAAC,0BAA0B,IACzB,YAAY,EAAE,aAAa,CAAC,IAAI,EAAE,IAAI,IAAI,EAAE,EAC5C,gBAAgB,EAAE,qBAAqB,CAAC,IAAI,IAAI,EAAE,GAClD,GACY,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,wBAAwB,CAAC,gBAAyB;IACzD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,EAAE,CAAC;IAE/B,OAAO,QAAQ,CAAC;QACd,QAAQ,EAAE,CAAC,WAAW,CAAC;QACvB,OAAO,EAAE,KAAK,IAAI,EAAE;YAClB,IAAI,gBAAgB,EAAE,CAAC;gBACrB,OAAO,gBAAgB,CAAC;YAC1B,CAAC;YAED,MAAM,GAAG,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;YAC7C,MAAM,MAAM,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;YAC9B,OAAO,MAAM,CAAC,GAAG,CAAC;QACpB,CAAC;KACF,CAAC,CAAC;AACL,CAAC;AAED,SAAS,SAAS,CAAC,WAAmB;IACpC,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAoB,CAAC;AACxE,CAAC"}

package/dist/esm/users-management.client.d.ts

@@ -1,6 +1,7 @@
+import { AuthToken } from "./api";
 import * as React from "react";
 export interface UsersManagementProps {
-    authToken: string | (() => Promise<string>) | null | undefined;
+    authToken: AuthToken;
 }
 export declare const UsersManagement: React.FC<UsersManagementProps>;
 //# sourceMappingURL=users-management.client.d.ts.map

package/dist/esm/users-management.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"users-management.client.d.ts","sourceRoot":"","sources":["../../src/users-management.client.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,MAAM,GAAG,CAAC,MAAM,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;CAChE;AAQD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgD1D,CAAC"}
+{"version":3,"file":"users-management.client.d.ts","sourceRoot":"","sources":["../../src/users-management.client.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAe,SAAS,EAAY,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAc1D,CAAC"}

package/dist/esm/users-management.client.js

@@ -1,30 +1,22 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { useRoles } from "./lib/api/role";
+import { ApiProvider, useRoles } from "./api";
 import { useUsers } from "./lib/api/user";
 import { useIsHydrated } from "./lib/use-is-hydrated";
 import { UsersManagementError, UsersManagementLoading, UsersManagement as UsersManagementPresentational, } from "./lib/users-management";
-import { UsersManagementContextProvider, } from "./lib/users-management-context";
-import { useUsersManagementState, } from "./lib/users-management-state";
+import { UsersManagementContextProvider } from "./lib/users-management-context";
 import { ErrorBoundary } from "./lib/error-boundary";
-const initialState = {
-    pagination: null,
-    role: null,
-    searchQuery: null,
+import { useWorkOsApiUrl } from "./lib/widgets-context";
+export const UsersManagement = ({ authToken, }) => {
+    const baseUrl = useWorkOsApiUrl();
+    return (_jsx(ErrorBoundary, { FallbackComponent: UsersManagementError, children: _jsx(ApiProvider, { authToken: authToken, baseUrl: baseUrl, children: _jsx(UsersManagementContextProvider, { children: _jsx(UsersManagementContent, {}) }) }) }));
 };
-export const UsersManagement = ({ authToken = null, }) => {
+const UsersManagementContent = () => {
     const isHydrated = useIsHydrated();
-    const [state, dispatch] = useUsersManagementState(initialState);
-    const context = React.useMemo(() => ({
-        authToken: typeof authToken === "string"
-            ? () => Promise.resolve(authToken)
-            : authToken,
-        state,
-        dispatch,
-    }), [authToken, state, dispatch]);
-    const rolesQuery = useRoles(context);
-    const usersQuery = useUsers(context);
+    const rolesQuery = useRoles({
+        query: { initialData: [] },
+    });
+    const usersQuery = useUsers();
     if (usersQuery.isLoading ||
         rolesQuery.isLoading ||
         usersQuery.isPending ||
@@ -35,6 +27,6 @@ export const UsersManagement = ({ authToken = null, }) => {
     if (usersQuery.isError || rolesQuery.isError) {
         return (_jsx(UsersManagementError, { error: usersQuery.error || rolesQuery.isError }));
     }
-    return (_jsx(ErrorBoundary, { FallbackComponent: UsersManagementError, children: _jsx(UsersManagementContextProvider, { value: context, children: _jsx(UsersManagementPresentational, { userData: usersQuery.data, rolesData: rolesQuery.data, isPending: usersQuery.isFetching, disableRolesFilter: rolesQuery.isPending || rolesQuery.isFetching }) }) }));
+    return (_jsx(ErrorBoundary, { FallbackComponent: UsersManagementError, children: _jsx(UsersManagementPresentational, { userData: usersQuery.data, rolesData: rolesQuery.data, isPending: usersQuery.isFetching, disableRolesFilter: rolesQuery.isPending || rolesQuery.isFetching }) }));
 };
 //# sourceMappingURL=users-management.client.js.map

package/dist/esm/users-management.client.js.map

@@ -1 +1 @@
-{"version":3,"file":"users-management.client.js","sourceRoot":"","sources":["../../src/users-management.client.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,eAAe,IAAI,6BAA6B,GACjD,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,8BAA8B,GAE/B,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAEL,uBAAuB,GACxB,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAMrD,MAAM,YAAY,GAAyB;IACzC,UAAU,EAAE,IAAI;IAChB,IAAI,EAAE,IAAI;IACV,WAAW,EAAE,IAAI;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,EAC9D,SAAS,GAAG,IAAI,GACjB,EAAE,EAAE;IACH,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IACnC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,uBAAuB,CAAC,YAAY,CAAC,CAAC;IAChE,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,CAC3B,GAAG,EAAE,CAAC,CAAC;QACL,SAAS,EACP,OAAO,SAAS,KAAK,QAAQ;YAC3B,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC;YAClC,CAAC,CAAC,SAAS;QACf,KAAK;QACL,QAAQ;KACT,CAAC,EACF,CAAC,SAAS,EAAE,KAAK,EAAE,QAAQ,CAAC,CAC7B,CAAC;IAEF,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IACrC,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;IAErC,IACE,UAAU,CAAC,SAAS;QACpB,UAAU,CAAC,SAAS;QACpB,UAAU,CAAC,SAAS;QACpB,2EAA2E;QAC3E,CAAC,UAAU,EACX,CAAC;QACD,OAAO,KAAC,sBAAsB,KAAG,CAAC;IACpC,CAAC;IAED,IAAI,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;QAC7C,OAAO,CACL,KAAC,oBAAoB,IAAC,KAAK,EAAE,UAAU,CAAC,KAAK,IAAI,UAAU,CAAC,OAAO,GAAI,CACxE,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,aAAa,IAAC,iBAAiB,EAAE,oBAAoB,YACpD,KAAC,8BAA8B,IAAC,KAAK,EAAE,OAAO,YAC5C,KAAC,6BAA6B,IAC5B,QAAQ,EAAE,UAAU,CAAC,IAAI,EACzB,SAAS,EAAE,UAAU,CAAC,IAAI,EAC1B,SAAS,EAAE,UAAU,CAAC,UAAU,EAChC,kBAAkB,EAAE,UAAU,CAAC,SAAS,IAAI,UAAU,CAAC,UAAU,GACjE,GAC6B,GACnB,CACjB,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"users-management.client.js","sourceRoot":"","sources":["../../src/users-management.client.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,WAAW,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,eAAe,IAAI,6BAA6B,GACjD,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,8BAA8B,EAAE,MAAM,gCAAgC,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAMxD,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,EAC9D,SAAS,GACV,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,eAAe,EAAE,CAAC;IAElC,OAAO,CACL,KAAC,aAAa,IAAC,iBAAiB,EAAE,oBAAoB,YACpD,KAAC,WAAW,IAAC,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,YACjD,KAAC,8BAA8B,cAC7B,KAAC,sBAAsB,KAAG,GACK,GACrB,GACA,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,sBAAsB,GAAG,GAAG,EAAE;IAClC,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;IACnC,MAAM,UAAU,GAAG,QAAQ,CAAC;QAC1B,KAAK,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE;KAC3B,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,QAAQ,EAAE,CAAC;IAE9B,IACE,UAAU,CAAC,SAAS;QACpB,UAAU,CAAC,SAAS;QACpB,UAAU,CAAC,SAAS;QACpB,2EAA2E;QAC3E,CAAC,UAAU,EACX,CAAC;QACD,OAAO,KAAC,sBAAsB,KAAG,CAAC;IACpC,CAAC;IAED,IAAI,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;QAC7C,OAAO,CACL,KAAC,oBAAoB,IAAC,KAAK,EAAE,UAAU,CAAC,KAAK,IAAI,UAAU,CAAC,OAAO,GAAI,CACxE,CAAC;IACJ,CAAC;IAED,OAAO,CACL,KAAC,aAAa,IAAC,iBAAiB,EAAE,oBAAoB,YACpD,KAAC,6BAA6B,IAC5B,QAAQ,EAAE,UAAU,CAAC,IAAI,EACzB,SAAS,EAAE,UAAU,CAAC,IAAI,EAC1B,SAAS,EAAE,UAAU,CAAC,UAAU,EAChC,kBAAkB,EAAE,UAAU,CAAC,SAAS,IAAI,UAAU,CAAC,UAAU,GACjE,GACY,CACjB,CAAC;AACJ,CAAC,CAAC"}

package/dist/tsconfig.cjs.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/users-management.client.tsx","../src/workos-widgets.client.tsx","../src/lib/constants.ts","../src/lib/delete-user-dialog.tsx","../src/lib/edit-user-details-dialog.tsx","../src/lib/elements.tsx","../src/lib/error-boundary.tsx","../src/lib/errors.ts","../src/lib/invite-user-dialog.tsx","../src/lib/resend-invite-dialog.tsx","../src/lib/revoke-invite-dialog.tsx","../src/lib/search-provider.tsx","../src/lib/use-is-hydrated.ts","../src/lib/use-layout-effect.ts","../src/lib/user-actions-dropdown.tsx","../src/lib/users-filter.tsx","../src/lib/users-management-context.tsx","../src/lib/users-management-state.ts","../src/lib/users-management.tsx","../src/lib/users-search.tsx","../src/lib/utils.ts","../src/lib/widgets-context.ts","../src/lib/api/config.ts","../src/lib/api/role.ts","../src/lib/api/user.ts"],"version":"5.6.2"}
+{"root":["../src/card-list.tsx","../src/index.ts","../src/organization-switcher.client.tsx","../src/user-profile.client.tsx","../src/user-security.client.tsx","../src/user-sessions.client.tsx","../src/users-management.client.tsx","../src/workos-widgets.client.tsx","../src/api/api-provider.tsx","../src/api/constants.ts","../src/api/endpoint.ts","../src/api/errors.ts","../src/api/index.ts","../src/api/utils.ts","../src/api/widgets-api-client.ts","../src/lib/add-mfa-dialog.tsx","../src/lib/change-password-dialog.tsx","../src/lib/constants.ts","../src/lib/copy-button.tsx","../src/lib/delete-user-dialog.tsx","../src/lib/edit-user-profile-dialog.tsx","../src/lib/edit-user-role-dialog.tsx","../src/lib/elements.tsx","../src/lib/elevated-access.tsx","../src/lib/error-boundary.tsx","../src/lib/errors.ts","../src/lib/generic-error.tsx","../src/lib/icon-panel.tsx","../src/lib/icons.tsx","../src/lib/invite-user-dialog.tsx","../src/lib/logout-all-sessions-dialog.tsx","../src/lib/logout-dialog.tsx","../src/lib/marker.tsx","../src/lib/oauth-icons.tsx","../src/lib/organization-switcher.tsx","../src/lib/otp-input.tsx","../src/lib/resend-invite-dialog.tsx","../src/lib/reset-mfa-dialog.tsx","../src/lib/revoke-invite-dialog.tsx","../src/lib/save-button.tsx","../src/lib/search-provider.tsx","../src/lib/set-password-dialog.tsx","../src/lib/use-dialog-close.tsx","../src/lib/use-is-hydrated.ts","../src/lib/use-layout-effect.ts","../src/lib/use-security-settings.tsx","../src/lib/user-actions-dropdown.tsx","../src/lib/user-profile.tsx","../src/lib/user-security.tsx","../src/lib/user-sessions.tsx","../src/lib/users-filter.tsx","../src/lib/users-management-context.tsx","../src/lib/users-management-state.ts","../src/lib/users-management.tsx","../src/lib/users-search.tsx","../src/lib/utils.ts","../src/lib/widgets-context.ts","../src/lib/api/config.ts","../src/lib/api/user.ts","../global.d.ts"],"version":"5.6.3"}

package/dist/tsconfig.esm.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/users-management.client.tsx","../src/workos-widgets.client.tsx","../src/lib/constants.ts","../src/lib/delete-user-dialog.tsx","../src/lib/edit-user-details-dialog.tsx","../src/lib/elements.tsx","../src/lib/error-boundary.tsx","../src/lib/errors.ts","../src/lib/invite-user-dialog.tsx","../src/lib/resend-invite-dialog.tsx","../src/lib/revoke-invite-dialog.tsx","../src/lib/search-provider.tsx","../src/lib/use-is-hydrated.ts","../src/lib/use-layout-effect.ts","../src/lib/user-actions-dropdown.tsx","../src/lib/users-filter.tsx","../src/lib/users-management-context.tsx","../src/lib/users-management-state.ts","../src/lib/users-management.tsx","../src/lib/users-search.tsx","../src/lib/utils.ts","../src/lib/widgets-context.ts","../src/lib/api/config.ts","../src/lib/api/role.ts","../src/lib/api/user.ts"],"version":"5.6.2"}
+{"root":["../src/card-list.tsx","../src/index.ts","../src/organization-switcher.client.tsx","../src/user-profile.client.tsx","../src/user-security.client.tsx","../src/user-sessions.client.tsx","../src/users-management.client.tsx","../src/workos-widgets.client.tsx","../src/api/api-provider.tsx","../src/api/constants.ts","../src/api/endpoint.ts","../src/api/errors.ts","../src/api/index.ts","../src/api/utils.ts","../src/api/widgets-api-client.ts","../src/lib/add-mfa-dialog.tsx","../src/lib/change-password-dialog.tsx","../src/lib/constants.ts","../src/lib/copy-button.tsx","../src/lib/delete-user-dialog.tsx","../src/lib/edit-user-profile-dialog.tsx","../src/lib/edit-user-role-dialog.tsx","../src/lib/elements.tsx","../src/lib/elevated-access.tsx","../src/lib/error-boundary.tsx","../src/lib/errors.ts","../src/lib/generic-error.tsx","../src/lib/icon-panel.tsx","../src/lib/icons.tsx","../src/lib/invite-user-dialog.tsx","../src/lib/logout-all-sessions-dialog.tsx","../src/lib/logout-dialog.tsx","../src/lib/marker.tsx","../src/lib/oauth-icons.tsx","../src/lib/organization-switcher.tsx","../src/lib/otp-input.tsx","../src/lib/resend-invite-dialog.tsx","../src/lib/reset-mfa-dialog.tsx","../src/lib/revoke-invite-dialog.tsx","../src/lib/save-button.tsx","../src/lib/search-provider.tsx","../src/lib/set-password-dialog.tsx","../src/lib/use-dialog-close.tsx","../src/lib/use-is-hydrated.ts","../src/lib/use-layout-effect.ts","../src/lib/use-security-settings.tsx","../src/lib/user-actions-dropdown.tsx","../src/lib/user-profile.tsx","../src/lib/user-security.tsx","../src/lib/user-sessions.tsx","../src/lib/users-filter.tsx","../src/lib/users-management-context.tsx","../src/lib/users-management-state.ts","../src/lib/users-management.tsx","../src/lib/users-search.tsx","../src/lib/utils.ts","../src/lib/widgets-context.ts","../src/lib/api/config.ts","../src/lib/api/user.ts","../global.d.ts"],"version":"5.6.3"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workos-inc/widgets",
-  "version": "1.0.1",
+  "version": "1.1.1",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -42,8 +42,12 @@
   "sideEffects": false,
   "dependencies": {
     "@radix-ui/react-compose-refs": "^1.0.0",
-    "@radix-ui/react-icons": "^1.0.0",
+    "@radix-ui/react-form": "^0.1.2",
+    "@radix-ui/react-icons": "^1.3.1",
+    "@radix-ui/react-popover": "^1.1.6",
+    "@radix-ui/react-use-controllable-state": "^1.1.0",
     "clsx": "^2.0.0",
+    "ua-parser-js": "^2.0.2",
     "use-debounce": "^10.0.4"
   },
   "peerDependencies": {
@@ -53,20 +57,30 @@
     "react-dom": ">=18"
   },
   "devDependencies": {
-    "@radix-ui/themes": "^3.1.6",
+    "@radix-ui/themes": "^3.2.1",
     "@tanstack/react-query": "^5.59.20",
     "@types/node": "^20.16.6",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
+    "orval": "^7.5.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "typescript": "^5.6.2",
     "@repo/typescript-config": "0.0.0"
   },
+  "typesVersions": {
+    "*": {
+      "*": [
+        "./src/api/*"
+      ]
+    }
+  },
   "scripts": {
     "build": "npm run clean:dist && tsc -b ./tsconfig.cjs.json ./tsconfig.esm.json",
+    "build:ci": "tsc --noEmit",
     "clean": "rm -rf .turbo && rm -rf node_modules && npm run clean:dist",
-    "clean:dist": "rm -rf dist"
+    "clean:dist": "rm -rf dist",
+    "generate-api": "orval --config ./orval.config.ts"
   },
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",

package/src/api/api-provider.tsx

@@ -0,0 +1,141 @@
+import * as React from "react";
+
+export type AuthToken = string | (() => Promise<string>);
+
+interface ElevatedAccess {
+  token: string;
+  expiresAt: string;
+}
+
+interface ApiConfig {
+  authToken: Promise<string> | string;
+  authTokenQueryKey: string;
+  baseUrl: string;
+  elevatedAccess?: ElevatedAccess;
+  setElevatedAccess: (elevatedAccess?: ElevatedAccess) => void;
+}
+
+const ApiContext = React.createContext<ApiConfig | undefined>(undefined);
+
+interface ApiProviderProps {
+  authToken: AuthToken;
+  baseUrl: string;
+  children: React.ReactNode;
+}
+
+export const ApiProvider = ({
+  authToken,
+  baseUrl,
+  children,
+}: ApiProviderProps) => {
+  const authTokenPromiseOrString =
+    typeof authToken === "string" ? authToken : authToken();
+  const [elevatedAccess, setElevatedAccess] = React.useState<ElevatedAccess>();
+  const elevatedAccessTimeout = React.useRef<NodeJS.Timeout>();
+
+  // This effect manages the expiration of elevated access tokens
+  // When an elevated access token is present, it checks every 30 seconds if the token has expired
+  // If the token has expired (current time > expiration time), it clears the elevated access
+  React.useEffect(() => {
+    if (elevatedAccessTimeout.current) {
+      clearInterval(elevatedAccessTimeout.current);
+    }
+
+    if (elevatedAccess) {
+      elevatedAccessTimeout.current = setInterval(() => {
+        const now = new Date();
+        const expiresAtDate = new Date(elevatedAccess.expiresAt);
+
+        //  Reset the elevated access if it has expired
+        if (now > expiresAtDate) {
+          setElevatedAccess(undefined);
+        }
+      }, 30_000); // every 30 seconds
+    }
+
+    return () => {
+      if (elevatedAccessTimeout.current) {
+        clearInterval(elevatedAccessTimeout.current);
+      }
+    };
+  }, [elevatedAccess]);
+
+  const value = React.useMemo(
+    () => ({
+      authToken: authTokenPromiseOrString,
+      authTokenQueryKey: getAuthTokenQueryKey(authTokenPromiseOrString),
+      baseUrl,
+      elevatedAccess,
+      setElevatedAccess,
+    }),
+    [authTokenPromiseOrString, baseUrl, elevatedAccess, setElevatedAccess],
+  );
+
+  return <ApiContext.Provider value={value}>{children}</ApiContext.Provider>;
+};
+
+export const useApi = () => {
+  const context = React.useContext(ApiContext);
+
+  if (context === undefined) {
+    throw new Error("useApi must be used within an ApiProvider");
+  }
+
+  return context;
+};
+
+export const useElevatedAccessToken = () => {
+  const { elevatedAccess, setElevatedAccess } = useApi();
+
+  return { elevatedAccess, setElevatedAccess };
+};
+
+// Map promises to a UUID that they can be identified by
+const PromiseKey = new WeakMap<Promise<string>, string>();
+/*
+ *
+ * @param getAccessToken - Async function that returns a promise that resolves to a string
+ * @returns a resolved string or null from the access token promise
+ */
+function getAuthTokenQueryKey(
+  authTokenPromiseOrString: Promise<string> | string,
+): string {
+  // Need to go by equality of the promise to avoid scenarios where
+  // 1. The promise is the same, but the function changes
+  // 2. The function is the same, but the promise is different ⚠️
+  //
+  // This does have the unfortunate side effect where if the function result
+  // isn't memoized somehow, then it will invalidate the query on every render.
+  // This doesn't occur with the current use case of getAccessToken from
+  // useAuth, but could in a custom implementation.
+  //
+  // Other things I explored:
+  // 1. Removing promise api, and force user to resolve the promise
+  //    themselves. The user can already do this with the string API, so
+  //    it's not necessary, and they could run into issues 1, or 2 if
+  //    implemented wrong.
+  // 2. Memoizing the function - this results in issue 2, where the function
+  //    is static, but the promise changes. I believe this actually is the
+  //    case with useAuth since it only sets the client once on initialization,
+  //    and binds the function to the client after that promise resolves.
+
+  if (typeof authTokenPromiseOrString === "string") {
+    return authTokenPromiseOrString;
+  }
+
+  const authTokenPromise = authTokenPromiseOrString;
+
+  // Cannot memoize on the function because it could remain the same while
+  // returning a different promise (and useAuth behaves this way).
+
+  const promiseKey = PromiseKey.get(authTokenPromise);
+
+  // Side effect, but we we're using a weak map, so it should be pretty safe
+  if (!promiseKey) {
+    const newPromiseKey = `${Math.random()}`;
+    PromiseKey.set(authTokenPromise, newPromiseKey);
+    return newPromiseKey;
+  } else {
+    return promiseKey;
+  }
+}

package/src/api/constants.ts

@@ -0,0 +1 @@
+export const WIDGETS_API_VERSION = "1";