@workos-inc/widgets 0.0.0-pre.1 → 0.0.0-pre.2

package/dist/esm/lib/users-search.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"users-search.d.ts","sourceRoot":"","sources":["../../../src/lib/users-search.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,eAAO,MAAM,WAAW,2PAyDvB,CAAC"}
+{"version":3,"file":"users-search.d.ts","sourceRoot":"","sources":["../../../src/lib/users-search.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,eAAO,MAAM,WAAW,2PAyDvB,CAAC"}

package/dist/esm/lib/users-search.js

@@ -2,13 +2,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useComposedRefs } from "@radix-ui/react-compose-refs";
 import { Cross2Icon, MagnifyingGlassIcon } from "@radix-ui/react-icons";
-import { Checkbox, DropdownMenu, Flex, IconButton } from "@radix-ui/themes";
+import { IconButton } from "@radix-ui/themes";
 import * as React from "react";
 import { useDebouncedCallback } from "use-debounce";
-import { PrimaryMenuItem, TextField, TextFieldSlot } from "./elements";
+import { TextField, TextFieldSlot } from "./elements";
 import { useSearchContext } from "./search-provider";
 import { useUsersManagementContext } from "./users-management-context";
-export const UsersSearch = React.forwardRef((props, ref) => {
+import { cx } from "./utils";
+export const UsersSearch = React.forwardRef(({ className, ...props }, ref) => {
     const { inputRef, clearSearch, searchValue, setSearchValue } = useSearchContext();
     const { dispatch } = useUsersManagementContext();
     const filter = useDebouncedCallback((value) => {
@@ -18,7 +19,7 @@ export const UsersSearch = React.forwardRef((props, ref) => {
         clearSearch();
         filter.cancel();
     };
-    return (_jsxs(TextField, { ref: useComposedRefs(inputRef, ref), autoComplete: "off", placeholder: "Search by name or e-mail", value: searchValue, onChange: (event) => {
+    return (_jsxs(TextField, { ref: useComposedRefs(inputRef, ref), className: cx(["users-search"], className), autoComplete: "off", placeholder: "Search by name or e-mail", value: searchValue, onChange: (event) => {
             const value = event.target.value;
             setSearchValue(value);
             filter(value);
@@ -29,11 +30,4 @@ export const UsersSearch = React.forwardRef((props, ref) => {
             }
         }, ...props, children: [_jsx(TextFieldSlot, { side: "left", children: _jsx(MagnifyingGlassIcon, { "aria-hidden": "true", height: "16", width: "16" }) }), _jsx(TextFieldSlot, { side: "right", children: searchValue && (_jsx(IconButton, { size: "1", color: "gray", variant: "ghost", radius: "full", onClick: resetSearch, "aria-label": "Clear search", title: "Clear search", children: _jsx(Cross2Icon, { "aria-hidden": "true" }) })) })] }));
 });
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-function FilterMenu() {
-    return (_jsxs(DropdownMenu.Root, { children: [_jsx(DropdownMenu.Trigger, { children: _jsx(IconButton, { size: "1", color: "gray", variant: "ghost", radius: "full", "aria-label": "Filter users", title: "Filter users", children: _jsx(FilterIcon, { "aria-hidden": "true" }) }) }), _jsxs(DropdownMenu.Content, { size: "2", align: "end", children: [_jsx(PrimaryMenuItem, { children: _jsxs(Flex, { gap: "2", align: "center", children: [_jsx(Checkbox, { variant: "surface" }), "One"] }) }), _jsx(PrimaryMenuItem, { children: _jsxs(Flex, { gap: "2", align: "center", children: [_jsx(Checkbox, {}), "Two"] }) })] })] }));
-}
-const FilterIcon = React.forwardRef(function FilterIcon({ children, ...props }, forwardedRef) {
-    return (_jsxs("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", ref: forwardedRef, ...props, children: [children, _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.5 1C1.22386 1 1 1.22386 1 1.5V4.5C1 4.66316 1.07961 4.81605 1.21327 4.90962L6 8.26033V13.5C6 13.6733 6.08973 13.8342 6.23713 13.9253C6.38454 14.0164 6.56861 14.0247 6.72361 13.9472L8.72361 12.9472C8.893 12.8625 9 12.6894 9 12.5V8.26033L13.7867 4.90962C13.9204 4.81605 14 4.66316 14 4.5V1.5C14 1.22386 13.7761 1 13.5 1H1.5ZM2 4.23967V2H13V4.23967L8.21327 7.59038C8.07961 7.68395 8 7.83684 8 8V12.191L7 12.691V8C7 7.83684 6.92039 7.68395 6.78673 7.59038L2 4.23967ZM12 3H3V4H12V3Z", fill: "black" })] }));
-});
 //# sourceMappingURL=users-search.js.map

package/dist/esm/lib/users-search.js.map

@@ -1 +1 @@
-{"version":3,"file":"users-search.js","sourceRoot":"","sources":["../../../src/lib/users-search.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"users-search.js","sourceRoot":"","sources":["../../../src/lib/users-search.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AACvE,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAC;AAI7B,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CACzC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC/B,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,cAAc,EAAE,GAC1D,gBAAgB,EAAE,CAAC;IACrB,MAAM,EAAE,QAAQ,EAAE,GAAG,yBAAyB,EAAE,CAAC;IAEjD,MAAM,MAAM,GAAG,oBAAoB,CAAC,CAAC,KAAK,EAAE,EAAE;QAC5C,QAAQ,CAAC,EAAE,IAAI,EAAE,kBAAkB,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAC;IAC7D,CAAC,EAAE,GAAG,CAAC,CAAC;IAER,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,WAAW,EAAE,CAAC;QACd,MAAM,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,SAAS,IACR,GAAG,EAAE,eAAe,CAAC,QAAQ,EAAE,GAAG,CAAC,EACnC,SAAS,EAAE,EAAE,CAAC,CAAC,cAAc,CAAC,EAAE,SAAS,CAAC,EAC1C,YAAY,EAAC,KAAK,EAClB,WAAW,EAAC,0BAA0B,EACtC,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YAClB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;YACjC,cAAc,CAAC,KAAK,CAAC,CAAC;YACtB,MAAM,CAAC,KAAK,CAAC,CAAC;QAChB,CAAC,EACD,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE;YACnB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBAC3B,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,WAAW,EAAE,CAAC;YAChB,CAAC;QACH,CAAC,KACG,KAAK,aAET,KAAC,aAAa,IAAC,IAAI,EAAC,MAAM,YACxB,KAAC,mBAAmB,mBAAa,MAAM,EAAC,MAAM,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,GAAG,GACnD,EAEhB,KAAC,aAAa,IAAC,IAAI,EAAC,OAAO,YACxB,WAAW,IAAI,CACd,KAAC,UAAU,IACT,IAAI,EAAC,GAAG,EACR,KAAK,EAAC,MAAM,EACZ,OAAO,EAAC,OAAO,EACf,MAAM,EAAC,MAAM,EACb,OAAO,EAAE,WAAW,gBACT,cAAc,EACzB,KAAK,EAAC,cAAc,YAEpB,KAAC,UAAU,mBAAa,MAAM,GAAG,GACtB,CACd,GACa,IACN,CACb,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/esm/lib/utils.d.ts

@@ -12,4 +12,6 @@ export declare function parseErrorResponse(response: Response): Promise<{
     message: string;
     status: number;
 }>;
+export declare function namespaceClassName(className: string): string;
+export declare function cx(baseClass: string | null | string[], ...classes: (string | false | null | undefined)[]): string;
 //# sourceMappingURL=utils.d.ts.map

package/dist/esm/lib/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAEvC,eAAO,MAAM,SAAS,SAIrB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,QAAQ,GACT,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,GAAG,UAAU,CAAC,iBAEtC;AAED,wBAAgB,0BAA0B,CACxC,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,IAAI,EACV,OAAO,CAAC,EAAE;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,GAC9B,MAAM,CAwCR;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAE7E;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,OAAO,GACb,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAExD;AAED,wBAAsB,kBAAkB,CACtC,QAAQ,EAAE,QAAQ,GACjB,OAAO,CAAC;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC,CAoB9C"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/lib/utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAGvC,eAAO,MAAM,SAAS,SAIrB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,QAAQ,GACT,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,GAAG,UAAU,CAAC,iBAEtC;AAED,wBAAgB,0BAA0B,CACxC,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,IAAI,EACV,OAAO,CAAC,EAAE;IAAE,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,GAC9B,MAAM,CAwCR;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAE7E;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,OAAO,GACb,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAExD;AAED,wBAAsB,kBAAkB,CACtC,QAAQ,EAAE,QAAQ,GACjB,OAAO,CAAC;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC,CAoB9C;AAED,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,MAAM,UAEnD;AAED,wBAAgB,EAAE,CAChB,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,EAAE,EACnC,GAAG,OAAO,EAAE,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,EAAE,GAChD,MAAM,CAUR"}

package/dist/esm/lib/utils.js

@@ -1,3 +1,5 @@
+import clsx from "clsx";
+import { WIDGETS_CLASS_NAMESPACE } from "./constants";
 export const canUseDOM = !!(typeof window !== "undefined" &&
     window.document &&
     window.document.createElement);
@@ -67,4 +69,15 @@ export async function parseErrorResponse(response) {
         };
     }
 }
+export function namespaceClassName(className) {
+    return `${WIDGETS_CLASS_NAMESPACE}-${className}`;
+}
+export function cx(baseClass, ...classes) {
+    if (baseClass) {
+        return clsx(typeof baseClass === "string"
+            ? namespaceClassName(baseClass)
+            : baseClass.map(namespaceClassName), ...classes);
+    }
+    return clsx(...classes);
+}
 //# sourceMappingURL=utils.js.map

package/dist/esm/lib/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/lib/utils.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/lib/utils.ts"],"names":[],"mappings":"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"}

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

@@ -1,6 +1,6 @@
 import * as React from "react";
 export interface UsersManagementProps {
-    authToken: string | null | undefined;
+    authToken: string | (() => Promise<string>) | null | undefined;
 }
 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;AAc/B,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CACtC;AAQD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAgC1D,CAAC"}
+{"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,CAkD1D,CAAC"}

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

@@ -4,9 +4,10 @@ import * as React from "react";
 import { useRoles } from "./lib/api/role";
 import { useUsers } from "./lib/api/user";
 import { useIsHydrated } from "./lib/use-is-hydrated";
-import { UsersManagement as UsersManagementPresentational } from "./lib/users-management";
+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 { ErrorBoundary } from "./lib/error-boundary";
 const initialState = {
     pagination: null,
     role: null,
@@ -16,15 +17,24 @@ export const UsersManagement = ({ authToken = null, }) => {
     const isHydrated = useIsHydrated();
     const [state, dispatch] = useUsersManagementState(initialState);
     const context = React.useMemo(() => ({
-        authToken,
+        authToken: typeof authToken === "string"
+            ? () => Promise.resolve(authToken)
+            : authToken,
         state,
         dispatch,
     }), [authToken, state, dispatch]);
     const rolesQuery = useRoles(context);
     const usersQuery = useUsers(context);
-    const isFetching = usersQuery.isFetching || rolesQuery.isFetching;
-    const isLoading = usersQuery.isLoading || rolesQuery.isLoading;
-    const isPending = usersQuery.isPlaceholderData || rolesQuery.isPlaceholderData;
-    return (_jsx(UsersManagementContextProvider, { value: context, children: _jsx(UsersManagementPresentational, { userData: usersQuery.data, rolesData: rolesQuery.data, isInitialLoading: (isFetching && isLoading) || !isHydrated, isPending: isPending }) }));
+    if (usersQuery.isLoading ||
+        rolesQuery.isLoading ||
+        usersQuery.isPending ||
+        // render loading state on the server to prevent FOUC or hydration mismatch
+        !isHydrated) {
+        return _jsx(UsersManagementLoading, {});
+    }
+    if (usersQuery.isError || rolesQuery.isError) {
+        return (_jsx(UsersManagementError, { error: usersQuery.error || rolesQuery.isError }));
+    }
+    return (_jsx(ErrorBoundary, { fallbackRender: ({ error }) => _jsx(UsersManagementError, { error: error }), children: _jsx(UsersManagementContextProvider, { value: context, 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,EAAE,eAAe,IAAI,6BAA6B,EAAE,MAAM,wBAAwB,CAAC;AAC1F,OAAO,EACL,8BAA8B,GAE/B,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAEL,uBAAuB,GACxB,MAAM,8BAA8B,CAAC;AAMtC,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;IAEnC,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;QACT,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;IACrC,MAAM,UAAU,GAAG,UAAU,CAAC,UAAU,IAAI,UAAU,CAAC,UAAU,CAAC;IAClE,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,IAAI,UAAU,CAAC,SAAS,CAAC;IAC/D,MAAM,SAAS,GACb,UAAU,CAAC,iBAAiB,IAAI,UAAU,CAAC,iBAAiB,CAAC;IAE/D,OAAO,CACL,KAAC,8BAA8B,IAAC,KAAK,EAAE,OAAO,YAC5C,KAAC,6BAA6B,IAC5B,QAAQ,EAAE,UAAU,CAAC,IAAI,EACzB,SAAS,EAAE,UAAU,CAAC,IAAI,EAC1B,gBAAgB,EAAE,CAAC,UAAU,IAAI,SAAS,CAAC,IAAI,CAAC,UAAU,EAC1D,SAAS,EAAE,SAAS,GACpB,GAC6B,CAClC,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,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,IACZ,cAAc,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAC,oBAAoB,IAAC,KAAK,EAAE,KAAK,GAAI,YAErE,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"}

package/dist/esm/workos-widgets.client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"workos-widgets.client.d.ts","sourceRoot":"","sources":["../../src/workos-widgets.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAE7E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAK/C,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,KAAK,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC,OAAO,aAAa,CAAC,EAAE,SAAS,CAAC,GAAG;QAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA+CtD,CAAC"}
+{"version":3,"file":"workos-widgets.client.d.ts","sourceRoot":"","sources":["../../src/workos-widgets.client.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAE7E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAK/C,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,KAAK,CAAC,EAAE,IAAI,CAAC,eAAe,CAAC,OAAO,aAAa,CAAC,EAAE,SAAS,CAAC,GAAG;QAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA+CtD,CAAC"}

package/dist/esm/workos-widgets.client.js

@@ -3,6 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Theme as RadixThemes } from "@radix-ui/themes";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import * as React from "react";
+import { cx } from "./lib/utils";
 import { DEFAULT_API_HOSTNAME } from "./lib/api/config";
 import { WidgetsContext } from "./lib/widgets-context";
 const queryClient = new QueryClient();
@@ -23,6 +24,6 @@ export const WorkOsWidgets = ({ elements = {}, className, theme: { fontFamily, .
             return `https://${DEFAULT_API_HOSTNAME}`;
         }
     }, [apiHostname, https, port]);
-    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(RadixThemes, { ...radixThemesProps, style: customStyle, className: className, children: _jsx(WidgetsContext.Provider, { value: { elements, apiBaseUrl }, children: children }) }) }));
+    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(RadixThemes, { ...radixThemesProps, style: customStyle, className: cx("root", className), children: _jsx(WidgetsContext.Provider, { value: { elements, apiBaseUrl }, children: children }) }) }));
 };
 //# sourceMappingURL=workos-widgets.client.js.map

package/dist/esm/workos-widgets.client.js.map

@@ -1 +1 @@
-{"version":3,"file":"workos-widgets.client.js","sourceRoot":"","sources":["../../src/workos-widgets.client.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,MAAM,WAAW,GAAG,IAAI,WAAW,EAAE,CAAC;AAetC,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,GAAG,EAAE,EACb,SAAS,EACT,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,gBAAgB,EAAE,GAAG,EAAE,EAC/C,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,WAAW,GAAG,oBAAoB,EAClC,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,IAAI,GACb,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,CAClB,UAAU;QACR,CAAC,CAAC;YACE,uBAAuB,EAAE,UAAU;YACnC,GAAG,KAAK;SACT;QACH,CAAC,CAAC,KAAK,CACa,CAAC;IAEzB,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC;YACH,MAAM,GAAG,GAAG,IAAI,GAAG,CACjB,GAAG,EACH,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CACxE,CAAC;YACF,OAAO,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QACrC,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,CAAC,KAAK,CACX,8HAA8H,CAC/H,CAAC;YACF,OAAO,WAAW,oBAAoB,EAAE,CAAC;QAC3C,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;IAE/B,OAAO,CACL,KAAC,mBAAmB,IAAC,MAAM,EAAE,WAAW,YACtC,KAAC,WAAW,OACN,gBAAgB,EACpB,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,SAAS,YAEpB,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,YACrD,QAAQ,GACe,GACd,GACM,CACvB,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"workos-widgets.client.js","sourceRoot":"","sources":["../../src/workos-widgets.client.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,MAAM,WAAW,GAAG,IAAI,WAAW,EAAE,CAAC;AAetC,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,GAAG,EAAE,EACb,SAAS,EACT,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,gBAAgB,EAAE,GAAG,EAAE,EAC/C,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,WAAW,GAAG,oBAAoB,EAClC,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,IAAI,GACb,EAAE,EAAE;IACH,MAAM,WAAW,GAAG,CAClB,UAAU;QACR,CAAC,CAAC;YACE,uBAAuB,EAAE,UAAU;YACnC,GAAG,KAAK;SACT;QACH,CAAC,CAAC,KAAK,CACa,CAAC;IAEzB,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC;YACH,MAAM,GAAG,GAAG,IAAI,GAAG,CACjB,GAAG,EACH,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CACxE,CAAC;YACF,OAAO,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QACrC,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,CAAC,KAAK,CACX,8HAA8H,CAC/H,CAAC;YACF,OAAO,WAAW,oBAAoB,EAAE,CAAC;QAC3C,CAAC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;IAE/B,OAAO,CACL,KAAC,mBAAmB,IAAC,MAAM,EAAE,WAAW,YACtC,KAAC,WAAW,OACN,gBAAgB,EACpB,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,YAEhC,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,YACrD,QAAQ,GACe,GACd,GACM,CACvB,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/invite-user-dialog.tsx","../src/lib/label.tsx","../src/lib/pagination.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/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.3"}
+{"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/label.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"}

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/invite-user-dialog.tsx","../src/lib/label.tsx","../src/lib/pagination.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/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.3"}
+{"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/label.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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workos-inc/widgets",
-  "version": "0.0.0-pre.1",
+  "version": "0.0.0-pre.2",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -23,6 +23,10 @@
         "types": "./dist/cjs/*.client.d.ts",
         "default": "./dist/cjs/*.client.js"
       }
+    },
+    "./*.css": {
+      "import": "./src/*.css",
+      "require": "./src/*.css"
     }
   },
   "files": [
@@ -40,6 +44,7 @@
     "@radix-ui/react-compose-refs": "^1.1.0",
     "@radix-ui/react-icons": "^1.3.1",
     "@radix-ui/themes": "^3.1.6",
+    "clsx": "^2.1.1",
     "suspend-react": "^0.1.3",
     "use-debounce": "^10.0.3"
   },
@@ -51,8 +56,8 @@
   "devDependencies": {
     "@tanstack/react-query": "^5.59.20",
     "@types/node": "^20.16.6",
-    "@types/react": "^18.3.9",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "^18.3.12",
+    "@types/react-dom": "^18.3.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "typescript": "^5.6.2",

package/src/base.css

@@ -0,0 +1,111 @@
+:root {
+  --woswidgets-accent-color: hsl(212 100% 50% / 1);
+  --woswidgets-border-color: hsl(0 0% 46%);
+  --woswidgets-border-color: light-dark(hsl(0 0% 46%), hsl(0 0% 52%));
+  --woswidgets-background-color: hsl(0 0% 100%);
+  --woswidgets-background-color: light-dark(hsl(0 0% 100%), hsl(0 0% 0%));
+  --woswidgets-foreground-color: hsl(0 0% 0%);
+  --woswidgets-foreground-color: light-dark(hsl(0 0% 0%), hsl(0 0% 100%));
+}
+
+.woswidgets-root {
+  inline-size: 100%;
+  block-size: 100%;
+}
+
+.woswidgets-text-field {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  border: solid 1px var(--woswidgets-border-color);
+  background-color: field;
+  color: fieldtext;
+}
+
+.woswidgets-text-field:has(input:focus-visible) {
+  outline: -webkit-focus-ring-color auto 1px;
+}
+
+:where(.woswidgets-text-field) input {
+  flex: 1 1 100%;
+  border: 0;
+  border: 0;
+  background: 0;
+  box-shadow: none;
+  color: inherit;
+  inline-size: 100%;
+  block-size: 100%;
+  outline: none;
+}
+
+.woswidgets-text-field-slot:where([data-side="left"], [data-side="right"]) {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  block-size: 100%;
+}
+
+.woswidgets-text-field-slot:where([data-side="left"]) {
+  order: -1;
+}
+
+.woswidgets-text-field-slot:where([data-side="right"]) {
+  order: 0;
+}
+
+:where(.woswidgets-text-field) svg {
+  color: inherit;
+  fill: currentColor;
+}
+
+.woswidgets-select {
+  appearance: button;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+}
+
+.woswidgets-menu-item {
+  display: flex;
+  align-items: center;
+  gap: 0.25em;
+  user-select: none;
+
+  &:where([data-disabled]) {
+    opacity: 0.6;
+    pointer-events: none;
+  }
+
+  &:where([data-highlighted]) {
+    outline: none;
+    background-color: var(--woswidgets-accent-color);
+    color: hsl(0 0% 100%);
+  }
+}
+
+.woswidgets-dropdown {
+  overflow: hidden;
+  background-color: var(--woswidgets-background-color);
+  color: var(--woswidgets-foreground-color);
+  border: 1px solid var(--woswidgets-border-color);
+}
+
+.woswidgets-dialog-overlay {
+  position: fixed;
+  inset: 0;
+  background-color: hsl(0 0% 0% / 0.4);
+}
+
+.woswidgets-dialog {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  padding: 1rem;
+  background-color: var(--woswidgets-background-color);
+  color: var(--woswidgets-foreground-color);
+  border: 1px solid var(--woswidgets-border-color);
+}

package/src/lib/api/role.ts

@@ -6,6 +6,8 @@ import {
 import { useWorkOsApiUrl } from "../widgets-context";
 import { API_ENDPOINTS } from "./config";
 import { WIDGETS_API_VERSION } from "../constants";
+import { parseErrorResponse } from "../utils";
+import { ApiError, FetchError, NoAuthTokenError } from "../errors";
 
 export interface Role {
   name: string;
@@ -13,6 +15,8 @@ export interface Role {
   default: boolean;
 }
 
+type AuthToken = () => Promise<string>;
+
 export const useRoles = (initialContext?: UsersManagementContextType) => {
   const { authToken } = useUsersManagementContext(initialContext);
   const baseUrl = useWorkOsApiUrl();
@@ -36,7 +40,7 @@ export const useRole = (
     queryKey: ["role", slug],
     queryFn: () => {
       if (!authToken) {
-        throw new Error("No auth token provided");
+        throw new NoAuthTokenError();
       }
       const getRoleOrFetch = async (attempts = 0): Promise<Role> => {
         if (attempts >= 3) {
@@ -65,25 +69,33 @@ const fetchRoles = async ({
   authToken,
   baseUrl,
 }: {
-  authToken: string | null;
+  authToken: AuthToken | null;
   baseUrl: string;
 }) => {
   if (!authToken) {
-    throw new Error("No auth token provided");
+    throw new NoAuthTokenError();
   }
   const url = new URL(`${baseUrl}/${API_ENDPOINTS.USER_ROLES}`);
   const response = await fetch(url, {
     cache: "no-store",
-    headers: getAuthHeaders(authToken),
+    headers: getAuthHeaders(await authToken()),
   }).catch((error) => {
-    console.error(error);
-    // TODO: handle fetch errors
-    throw new Error("Failed to fetch roles");
+    throw new FetchError({
+      message: "Failed to fetch roles",
+      queryType: "query",
+      recordType: "users",
+      context: { error },
+    });
   });
 
   if (!response.ok) {
-    // TODO: handle this case
-    throw new Error("Failed to fetch roles");
+    const { message, status } = await parseErrorResponse(response);
+    throw new ApiError({
+      message,
+      status,
+      queryType: "query",
+      recordType: "users",
+    });
   }
   const data = await response.json();
   return data as Promise<Role[]>;
@@ -95,23 +107,34 @@ const fetchRole = async (
     authToken,
     baseUrl,
   }: {
-    authToken: string;
+    authToken: AuthToken | null;
     baseUrl: string;
   },
 ) => {
+  if (!authToken) {
+    throw new NoAuthTokenError();
+  }
   const url = new URL(`${baseUrl}/${API_ENDPOINTS.USER_ROLES}/${slug}`);
   const response = await fetch(url, {
     cache: "no-store",
-    headers: getAuthHeaders(authToken),
+    headers: getAuthHeaders(await authToken()),
   }).catch((error) => {
-    console.error(error);
-    // TODO: handle fetch errors
-    throw new Error("Failed to fetch role");
+    throw new FetchError({
+      message: "Failed to fetch roles",
+      queryType: "query",
+      recordType: "users",
+      context: { error },
+    });
   });
 
   if (!response.ok) {
-    // TODO: handle this case
-    throw new Error("Failed to fetch role");
+    const { message, status } = await parseErrorResponse(response);
+    throw new ApiError({
+      message,
+      status,
+      queryType: "query",
+      recordType: "users",
+    });
   }
   return response.json() as Promise<Role>;
 };