You're Invited: Meet the Socket team at BSidesSF and RSAC - April 27 - May 1.RSVP

@workos-inc/widgets

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@workos-inc/widgets - npm Package Compare versions

Comparing version

to
0.0.0-pre.6

@@ -52,3 +52,3 @@ "use strict";

const isHydrated = (0, use_is_hydrated_1.useIsHydrated)();
const pagination = userData?.pagination;
const { pagination } = userData;
const { dispatch } = (0, users_management_context_1.useUsersManagementContext)();

@@ -72,2 +72,3 @@ // we only want to show the loading indicator for some buttons if the request

}, [isPending]);
const showPagination = !!(pagination.before || pagination.after);
return ((0, jsx_runtime_1.jsx)(search_provider_1.SearchProvider, { children: (0, jsx_runtime_1.jsxs)(UsersManagementRoot, { children: [(0, jsx_runtime_1.jsxs)(themes_1.Grid, { columns: "1fr auto", gap: "2", children: [(0, jsx_runtime_1.jsxs)(themes_1.Flex, { gap: "2", align: "center", children: [(0, jsx_runtime_1.jsx)(themes_1.Box, { flexBasis: "380px", flexGrow: "0", flexShrink: "1", children: (0, jsx_runtime_1.jsx)(users_search_1.UsersSearch, {}) }), (0, jsx_runtime_1.jsx)(themes_1.Box, { flexGrow: "0", flexShrink: "0", children: (0, jsx_runtime_1.jsx)(users_filter_1.UsersFilter, { roles: rolesData, disabled: disableRolesFilter }) })] }), (0, jsx_runtime_1.jsx)(themes_1.Box, { flexGrow: "0", flexShrink: "0", style: { placeSelf: "flex-end" }, children: (0, jsx_runtime_1.jsx)(invite_user_dialog_1.InviteUserDialog, { children: (0, jsx_runtime_1.jsx)(elements_1.PrimaryButton, { children: "Invite user" }) }) })] }), (0, jsx_runtime_1.jsxs)(themes_1.Table.Root, { variant: "ghost", size: "1", children: [(0, jsx_runtime_1.jsx)(themes_1.Table.Header, { children: (0, jsx_runtime_1.jsxs)(themes_1.Table.Row, { children: [(0, jsx_runtime_1.jsx)(themes_1.Table.ColumnHeaderCell, { width: "260px", children: "User" }), (0, jsx_runtime_1.jsx)(themes_1.Table.ColumnHeaderCell, { width: "100px", children: "Role" }), (0, jsx_runtime_1.jsx)(themes_1.Table.ColumnHeaderCell, { width: "140px", children: "Last active" }), (0, jsx_runtime_1.jsx)(themes_1.Table.ColumnHeaderCell, { width: "28px" })] }) }), (0, jsx_runtime_1.jsx)(themes_1.Table.Body, { style: {

@@ -83,4 +84,4 @@ transition: `opacity 0.2s ease-out ${isPending ? "0.2s" : "0s"}`,

return ((0, jsx_runtime_1.jsxs)(themes_1.Table.Row, { align: "center", children: [(0, jsx_runtime_1.jsx)(themes_1.Table.RowHeaderCell, { children: (0, jsx_runtime_1.jsxs)(themes_1.Flex, { align: "center", gap: "3", overflow: "hidden", height: "var(--space-7)", children: [(0, jsx_runtime_1.jsx)(elements_1.Avatar, { size: "2", fallback: (0, jsx_runtime_1.jsx)(FallbackUserIcon, {}), src: user.profilePictureUrl ?? undefined, dim: dimText }), userDisplayName ? ((0, jsx_runtime_1.jsxs)(themes_1.Flex, { direction: "column", align: "start", height: "var(--space-7)", justify: "center", overflow: "hidden", children: [(0, jsx_runtime_1.jsxs)(themes_1.Flex, { gap: "2", align: "center", minWidth: "0", children: [(0, jsx_runtime_1.jsx)(TableCellText, { dim: dimText, children: userDisplayName }), (0, jsx_runtime_1.jsx)(UserBadge, { user: user })] }), (0, jsx_runtime_1.jsx)(TableCellText, { level: "secondary", title: user.email, dim: dimText, children: user.email })] })) : ((0, jsx_runtime_1.jsxs)(themes_1.Flex, { gap: "2", align: "center", minWidth: "0", children: [(0, jsx_runtime_1.jsx)(TableCellText, { dim: dimText, title: user.email, children: user.email }), (0, jsx_runtime_1.jsx)(UserBadge, { user: user })] }))] }) }), (0, jsx_runtime_1.jsx)(themes_1.Table.Cell, { children: (0, jsx_runtime_1.jsx)(TableCellText, { dim: dimText, children: userRole || ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(themes_1.VisuallyHidden, { children: "No roles assigned" }), (0, jsx_runtime_1.jsx)("span", { "aria-hidden": true, style: { userSelect: "none" }, children: "\u2013" })] })) }) }), (0, jsx_runtime_1.jsx)(themes_1.Table.Cell, { children: (0, jsx_runtime_1.jsx)(LastActive, { user: user, isHydrated: isHydrated, dim: dimText }) }), (0, jsx_runtime_1.jsx)(themes_1.Table.Cell, { justify: "end", children: (0, jsx_runtime_1.jsx)(user_actions_dropdown_1.UserActionsDropdown, { user: user, children: (0, jsx_runtime_1.jsxs)(elements_1.IconButton, { title: "User actions", children: [(0, jsx_runtime_1.jsx)(themes_1.VisuallyHidden, { children: "User actions" }), (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: "16", height: "16", strokeWidth: 1.5, stroke: "currentColor", "aria-hidden": true, children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM18.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" }) })] }) }) })] }, user.id));
})) : ((0, jsx_runtime_1.jsx)(themes_1.Table.Row, { align: "center", children: (0, jsx_runtime_1.jsx)(themes_1.Table.Cell, { colSpan: 4, children: (0, jsx_runtime_1.jsx)(UsersManagementEmptyState, {}) }) })) })] }), (0, jsx_runtime_1.jsxs)(themes_1.Flex, { gap: "2", justify: "end", children: [(0, jsx_runtime_1.jsx)(elements_1.SecondaryButton, { size: "1", disabled: !pagination?.after || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination?.after) {
})) : ((0, jsx_runtime_1.jsx)(themes_1.Table.Row, { align: "center", children: (0, jsx_runtime_1.jsx)(themes_1.Table.Cell, { colSpan: 4, children: (0, jsx_runtime_1.jsx)(UsersManagementEmptyState, {}) }) })) })] }), showPagination ? ((0, jsx_runtime_1.jsxs)(themes_1.Flex, { gap: "2", justify: "end", children: [(0, jsx_runtime_1.jsx)(elements_1.SecondaryButton, { size: "1", disabled: !pagination.after || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination.after) {
dispatch({

@@ -91,4 +92,4 @@ type: "SET_PAGINATION",

}
}, children: "Previous" }), (0, jsx_runtime_1.jsx)(elements_1.SecondaryButton, { size: "1", disabled: !pagination?.before || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination?.before) {
}, children: "Previous" }), (0, jsx_runtime_1.jsx)(elements_1.SecondaryButton, { size: "1", disabled: !pagination.before || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination.before) {
dispatch({

@@ -99,3 +100,3 @@ type: "SET_PAGINATION",

}
}, children: "Next" })] })] }) }));
}, children: "Next" })] })) : null] }) }));
};

@@ -102,0 +103,0 @@ exports.UsersManagement = UsersManagement;

@@ -21,3 +21,3 @@ "use client";

const isHydrated = useIsHydrated();
const pagination = userData?.pagination;
const { pagination } = userData;
const { dispatch } = useUsersManagementContext();

@@ -41,2 +41,3 @@ // we only want to show the loading indicator for some buttons if the request

}, [isPending]);
const showPagination = !!(pagination.before || pagination.after);
return (_jsx(SearchProvider, { children: _jsxs(UsersManagementRoot, { children: [_jsxs(Grid, { columns: "1fr auto", gap: "2", children: [_jsxs(Flex, { gap: "2", align: "center", children: [_jsx(Box, { flexBasis: "380px", flexGrow: "0", flexShrink: "1", children: _jsx(UsersSearch, {}) }), _jsx(Box, { flexGrow: "0", flexShrink: "0", children: _jsx(UsersFilter, { roles: rolesData, disabled: disableRolesFilter }) })] }), _jsx(Box, { flexGrow: "0", flexShrink: "0", style: { placeSelf: "flex-end" }, children: _jsx(InviteUserDialog, { children: _jsx(PrimaryButton, { children: "Invite user" }) }) })] }), _jsxs(Table.Root, { variant: "ghost", size: "1", children: [_jsx(Table.Header, { children: _jsxs(Table.Row, { children: [_jsx(Table.ColumnHeaderCell, { width: "260px", children: "User" }), _jsx(Table.ColumnHeaderCell, { width: "100px", children: "Role" }), _jsx(Table.ColumnHeaderCell, { width: "140px", children: "Last active" }), _jsx(Table.ColumnHeaderCell, { width: "28px" })] }) }), _jsx(Table.Body, { style: {

@@ -52,4 +53,4 @@ transition: `opacity 0.2s ease-out ${isPending ? "0.2s" : "0s"}`,

return (_jsxs(Table.Row, { align: "center", children: [_jsx(Table.RowHeaderCell, { children: _jsxs(Flex, { align: "center", gap: "3", overflow: "hidden", height: "var(--space-7)", children: [_jsx(Avatar, { size: "2", fallback: _jsx(FallbackUserIcon, {}), src: user.profilePictureUrl ?? undefined, dim: dimText }), userDisplayName ? (_jsxs(Flex, { direction: "column", align: "start", height: "var(--space-7)", justify: "center", overflow: "hidden", children: [_jsxs(Flex, { gap: "2", align: "center", minWidth: "0", children: [_jsx(TableCellText, { dim: dimText, children: userDisplayName }), _jsx(UserBadge, { user: user })] }), _jsx(TableCellText, { level: "secondary", title: user.email, dim: dimText, children: user.email })] })) : (_jsxs(Flex, { gap: "2", align: "center", minWidth: "0", children: [_jsx(TableCellText, { dim: dimText, title: user.email, children: user.email }), _jsx(UserBadge, { user: user })] }))] }) }), _jsx(Table.Cell, { children: _jsx(TableCellText, { dim: dimText, children: userRole || (_jsxs(_Fragment, { children: [_jsx(VisuallyHidden, { children: "No roles assigned" }), _jsx("span", { "aria-hidden": true, style: { userSelect: "none" }, children: "\u2013" })] })) }) }), _jsx(Table.Cell, { children: _jsx(LastActive, { user: user, isHydrated: isHydrated, dim: dimText }) }), _jsx(Table.Cell, { justify: "end", children: _jsx(UserActionsDropdown, { user: user, children: _jsxs(IconButton, { title: "User actions", children: [_jsx(VisuallyHidden, { children: "User actions" }), _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", width: "16", height: "16", strokeWidth: 1.5, stroke: "currentColor", "aria-hidden": true, children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM12.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0ZM18.75 12a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0Z" }) })] }) }) })] }, user.id));
})) : (_jsx(Table.Row, { align: "center", children: _jsx(Table.Cell, { colSpan: 4, children: _jsx(UsersManagementEmptyState, {}) }) })) })] }), _jsxs(Flex, { gap: "2", justify: "end", children: [_jsx(SecondaryButton, { size: "1", disabled: !pagination?.after || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination?.after) {
})) : (_jsx(Table.Row, { align: "center", children: _jsx(Table.Cell, { colSpan: 4, children: _jsx(UsersManagementEmptyState, {}) }) })) })] }), showPagination ? (_jsxs(Flex, { gap: "2", justify: "end", children: [_jsx(SecondaryButton, { size: "1", disabled: !pagination.after || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination.after) {
dispatch({

@@ -60,4 +61,4 @@ type: "SET_PAGINATION",

}
}, children: "Previous" }), _jsx(SecondaryButton, { size: "1", disabled: !pagination?.before || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination?.before) {
}, children: "Previous" }), _jsx(SecondaryButton, { size: "1", disabled: !pagination.before || isPending || undefined, loading: deferredLoading, onClick: () => {
if (pagination.before) {
dispatch({

@@ -68,3 +69,3 @@ type: "SET_PAGINATION",

}
}, children: "Next" })] })] }) }));
}, children: "Next" })] })) : null] }) }));
};

@@ -71,0 +72,0 @@ export function UsersManagementLoading() {

{
"name": "@workos-inc/widgets",
"version": "0.0.0-pre.5",
"version": "0.0.0-pre.6",
"license": "MIT",

@@ -5,0 +5,0 @@ "type": "module",

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet