@workos-inc/widgets 1.8.2 → 1.9.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/users-management.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Box,\n  Flex,\n  Grid,\n  Separator,\n  Table,\n  Tooltip,\n  Text,\n  type TextProps,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport {\n  Avatar,\n  Badge,\n  IconButton,\n  Button,\n  Select,\n  Skeleton,\n  TextField,\n} from \"./elements.js\";\nimport { InviteUserDialog } from \"./invite-user-dialog.js\";\nimport { SearchProvider, useSearchContext } from \"./search-provider.js\";\nimport { useIsHydrated } from \"./use-is-hydrated.js\";\nimport { UserActionsDropdown } from \"./user-actions-dropdown.js\";\nimport { UsersFilter } from \"./users-filter.js\";\nimport { UsersSearch } from \"./users-search.js\";\nimport {\n  getBestName,\n  getComparativeReadableDate,\n  getDomProps,\n  WidgetRootState,\n  type WidgetRootDomProps,\n} from \"./utils.js\";\nimport { USER_ROW_LIMIT } from \"./constants.js\";\nimport { useUsersManagementContext } from \"./users-management-context.js\";\nimport { Member, MemberRole, MembersQueryResult } from \"../api/endpoint.js\";\nimport { GenericError } from \"./generic-error.js\";\nimport { DotsHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\nimport { useLocale } from \"./i18n/use-locale.js\";\n\ninterface UsersManagementProps extends WidgetRootDomProps {\n  rolesData: { roles: MemberRole[]; multipleRolesEnabled: boolean };\n  userData: MembersQueryResult;\n  disableRolesFilter?: boolean;\n  // When the users list is loading new users\n  isPending: boolean;\n}\n\nconst UsersManagement: React.FC<UsersManagementProps> = ({\n  userData,\n  rolesData,\n  isPending,\n  disableRolesFilter,\n  ...domProps\n}) => {\n  const users = userData?.data ?? [];\n  const usersCount = users?.length ?? 0;\n  const isHydrated = useIsHydrated();\n  const { listMetadata: pagination = {} } = userData;\n  const { dispatch } = useUsersManagementContext();\n  const isMultipleRolesEnabled = rolesData.multipleRolesEnabled;\n  const translate = useTranslation();\n\n  // we only want to show the loading indicator for some buttons if the request\n  // is still pending after 500ms. If the request is fast enough the indicator\n  // is a bit jarring.\n  const [deferredLoading, setDeferredLoading] = React.useState(false);\n  React.useEffect(() => {\n    if (isPending) {\n      const timeoutId = window.setTimeout(() => {\n        setDeferredLoading(true);\n      }, 500);\n      return () => {\n        window.clearTimeout(timeoutId);\n      };\n    } else {\n      setDeferredLoading(false);\n    }\n  }, [isPending]);\n\n  const showPagination = !!(pagination.before || pagination.after);\n\n  return (\n    <SearchProvider>\n      <Flex\n        direction=\"column\"\n        gap=\"3\"\n        {...getWidgetRootDomProps(\"resolved\", domProps)}\n      >\n        <Grid columns=\"1fr auto\" gap=\"2\">\n          <Flex gap=\"2\" align=\"center\">\n            <Box flexBasis=\"380px\" flexGrow=\"0\" flexShrink=\"1\">\n              <UsersSearch />\n            </Box>\n            <Box flexGrow=\"0\" flexShrink=\"0\">\n              <UsersFilter\n                roles={rolesData.roles}\n                disabled={disableRolesFilter}\n              />\n            </Box>\n          </Flex>\n          <Box flexGrow=\"0\" flexShrink=\"0\" style={{ placeSelf: \"flex-end\" }}>\n            <InviteUserDialog>\n              <Button>\n                <Translation\n                  defaultMessage=\"Invite user\"\n                  id=\"NBXpRj\"\n                  description=\"Button text to invite a new user to the organization\"\n                />\n              </Button>\n            </InviteUserDialog>\n          </Box>\n        </Grid>\n        <Table.Root variant=\"ghost\" size=\"1\">\n          <Table.Header>\n            <Table.Row>\n              <Table.ColumnHeaderCell width=\"260px\">\n                <Translation\n                  defaultMessage=\"User\"\n                  id=\"BBh86k\"\n                  description=\"Column header for user information in the users table\"\n                />\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"100px\">\n                {isMultipleRolesEnabled ? (\n                  <Translation\n                    defaultMessage=\"Roles\"\n                    id=\"A1DuWM\"\n                    description=\"Column header for user roles when multiple roles are enabled\"\n                  />\n                ) : (\n                  <Translation\n                    defaultMessage=\"Role\"\n                    id=\"nQbe+Y\"\n                    description=\"Column header for user role when only single role is allowed\"\n                  />\n                )}\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"140px\">\n                <Translation\n                  defaultMessage=\"Last active\"\n                  id=\"oOwLGt\"\n                  description=\"Column header showing when users were last active\"\n                />\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"28px\" />\n            </Table.Row>\n          </Table.Header>\n\n          <Table.Body\n            style={{\n              transition: `opacity 0.2s ease-out ${isPending ? \"0.2s\" : \"0s\"}`,\n              opacity: isPending && usersCount > 0 ? 0.5 : 1,\n            }}\n          >\n            {users.length > 0 ? (\n              users.map((user) => {\n                const userDisplayName = getBestName(user);\n                const dimText =\n                  user.status === \"InviteRevoked\" ||\n                  user.status === \"InviteExpired\";\n                return (\n                  <Table.Row key={user.id} align=\"center\">\n                    <Table.RowHeaderCell>\n                      <Flex\n                        align=\"center\"\n                        gap=\"3\"\n                        overflow=\"hidden\"\n                        height=\"var(--space-7)\"\n                      >\n                        <Avatar\n                          size=\"2\"\n                          fallback={<FallbackUserIcon />}\n                          src={user.profilePictureUrl ?? undefined}\n                          dim={dimText}\n                        />\n\n                        {userDisplayName ? (\n                          <Flex\n                            direction=\"column\"\n                            align=\"start\"\n                            height=\"var(--space-7)\"\n                            justify=\"center\"\n                            overflow=\"hidden\"\n                          >\n                            <Flex gap=\"2\" align=\"center\" minWidth=\"0\">\n                              <TableCellText dim={dimText}>\n                                {userDisplayName}\n                              </TableCellText>\n                              <UserBadge user={user} />\n                            </Flex>\n                            <TableCellText\n                              level=\"secondary\"\n                              title={user.email}\n                              dim={dimText}\n                            >\n                              {user.email}\n                            </TableCellText>\n                          </Flex>\n                        ) : (\n                          <Flex gap=\"2\" align=\"center\" minWidth=\"0\">\n                            <TableCellText dim={dimText} title={user.email}>\n                              {user.email}\n                            </TableCellText>\n                            <UserBadge user={user} />\n                          </Flex>\n                        )}\n                      </Flex>\n                    </Table.RowHeaderCell>\n                    <Table.Cell>\n                      <UserRolesCellContent\n                        user={user}\n                        isMultipleRolesEnabled={isMultipleRolesEnabled}\n                        dimText={dimText}\n                      />\n                    </Table.Cell>\n                    <Table.Cell>\n                      <LastActive user={user} isHydrated={isHydrated} />\n                    </Table.Cell>\n                    <Table.Cell justify=\"end\">\n                      <UserActionsDropdown user={user}>\n                        <IconButton\n                          title={translate({\n                            defaultMessage: \"User actions\",\n                            id: \"1nsmNS\",\n                            description:\n                              \"Button tooltip for opening user actions menu\",\n                          })}\n                        >\n                          <DotsHorizontalIcon />\n                        </IconButton>\n                      </UserActionsDropdown>\n                    </Table.Cell>\n                  </Table.Row>\n                );\n              })\n            ) : (\n              <Table.Row align=\"center\">\n                <Table.Cell colSpan={4}>\n                  <UsersManagementEmptyState isPending={isPending} />\n                </Table.Cell>\n              </Table.Row>\n            )}\n          </Table.Body>\n        </Table.Root>\n\n        {showPagination ? (\n          <Flex gap=\"2\" justify=\"end\">\n            <Button\n              variant=\"secondary\"\n              size=\"1\"\n              disabled={!pagination.after || isPending || undefined}\n              loading={deferredLoading}\n              onClick={() => {\n                if (pagination.after) {\n                  dispatch({\n                    type: \"SET_PAGINATION\",\n                    pagination: { after: pagination.after },\n                  });\n                }\n              }}\n            >\n              <Translation\n                defaultMessage=\"Previous\"\n                id=\"910Q6b\"\n                description=\"Button text to navigate to the previous page of users\"\n              />\n            </Button>\n            <Button\n              variant=\"secondary\"\n              size=\"1\"\n              disabled={!pagination.before || isPending || undefined}\n              loading={deferredLoading}\n              onClick={() => {\n                if (pagination.before) {\n                  dispatch({\n                    type: \"SET_PAGINATION\",\n                    pagination: { before: pagination.before },\n                  });\n                }\n              }}\n            >\n              <Translation\n                defaultMessage=\"Next\"\n                id=\"UlAY08\"\n                description=\"Button text to navigate to the next page of users\"\n              />\n            </Button>\n          </Flex>\n        ) : null}\n      </Flex>\n    </SearchProvider>\n  );\n};\n\ninterface UsersManagementLoadingProps extends WidgetRootDomProps {}\n\nconst UsersManagementLoading: React.FC<UsersManagementLoadingProps> = (\n  props,\n) => {\n  const translate = useTranslation();\n  const placeholderText = (\n    <Translation\n      defaultMessage=\"All\"\n      id=\"l/Do9/\"\n      description=\"Filter option to show all users\"\n    />\n  );\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"3\"\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Grid columns=\"1fr auto\" gap=\"2\">\n        <Flex gap=\"2\" align=\"center\">\n          <Skeleton loading>\n            <Box flexBasis=\"380px\" flexGrow=\"0\" flexShrink=\"1\">\n              <TextField\n                disabled\n                aria-label={translate({\n                  defaultMessage: \"User search\",\n                  id: \"lzPOKv\",\n                  description: \"Label for the user search input field\",\n                })}\n              />\n            </Box>\n          </Skeleton>\n          <Skeleton loading>\n            <Box flexGrow=\"0\" flexShrink=\"0\">\n              <Select.Root disabled value=\"all\" onValueChange={() => void 0}>\n                <Select.Trigger>{placeholderText}</Select.Trigger>\n                <Select.Content>\n                  <Select.Item value=\"all\">{placeholderText}</Select.Item>\n                </Select.Content>\n              </Select.Root>\n            </Box>\n          </Skeleton>\n        </Flex>\n        <Skeleton loading>\n          <Box flexGrow=\"0\" flexShrink=\"0\" style={{ placeSelf: \"flex-end\" }}>\n            <Button disabled>\n              <Translation\n                defaultMessage=\"Invite user\"\n                id=\"NBXpRj\"\n                description=\"Button text to invite a new user to the organization\"\n              />\n            </Button>\n          </Box>\n        </Skeleton>\n      </Grid>\n      <Table.Root variant=\"ghost\" size=\"1\">\n        <Table.Header>\n          <Table.Row>\n            <Table.ColumnHeaderCell width=\"260px\">\n              <Skeleton loading>\n                <Translation\n                  defaultMessage=\"User\"\n                  id=\"BBh86k\"\n                  description=\"Column header for user information in the users table\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"100px\">\n              <Skeleton>\n                <Translation\n                  defaultMessage=\"Role\"\n                  id=\"FK7mP4\"\n                  description=\"Column header for user role\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"140px\">\n              <Skeleton>\n                <Translation\n                  defaultMessage=\"Last active\"\n                  id=\"oOwLGt\"\n                  description=\"Column header showing when users were last active\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"28px\" />\n          </Table.Row>\n        </Table.Header>\n\n        <Table.Body>\n          {Array.from({ length: USER_ROW_LIMIT }, (_, index) => (\n            <Table.Row key={index} align=\"center\">\n              <Table.RowHeaderCell>\n                <Flex align=\"center\" gap=\"3\">\n                  <Skeleton>\n                    <Avatar size=\"2\" fallback=\"F\" />\n                  </Skeleton>\n\n                  <Flex\n                    direction=\"column\"\n                    height=\"var(--space-7)\"\n                    justify=\"center\"\n                  >\n                    <Skeleton width=\"180px\" height=\"var(--space-4)\" />\n                    <Skeleton width=\"90px\" height=\"var(--space-3)\" mt=\"1\" />\n                  </Flex>\n                </Flex>\n              </Table.RowHeaderCell>\n              <Table.Cell>\n                <Flex wrap=\"wrap\" gap=\"1\">\n                  <Skeleton width=\"75px\" height=\"var(--space-4)\" />\n                </Flex>\n              </Table.Cell>\n              <Table.Cell>\n                <Skeleton width=\"120px\" height=\"var(--space-4)\" />\n              </Table.Cell>\n              <Table.Cell justify=\"end\" />\n            </Table.Row>\n          ))}\n        </Table.Body>\n      </Table.Root>\n\n      <Flex gap=\"2\" justify=\"end\">\n        <Skeleton loading>\n          <Button disabled variant=\"secondary\" size=\"1\">\n            <Translation\n              defaultMessage=\"Previous\"\n              id=\"910Q6b\"\n              description=\"Button text to navigate to the previous page of users\"\n            />\n          </Button>\n        </Skeleton>\n        <Skeleton loading>\n          <Button disabled variant=\"secondary\" size=\"1\">\n            <Translation\n              defaultMessage=\"Next\"\n              id=\"UlAY08\"\n              description=\"Button text to navigate to the next page of users\"\n            />\n          </Button>\n        </Skeleton>\n      </Flex>\n    </Flex>\n  );\n};\n\ninterface UsersManagementErrorProps extends WidgetRootDomProps {\n  error: unknown;\n}\n\nconst UsersManagementError: React.FC<UsersManagementErrorProps> = ({\n  error,\n  ...domProps\n}) => {\n  return (\n    <GenericError\n      error={error}\n      minHeight=\"676px\"\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    />\n  );\n};\n\nfunction UserBadge({ user }: { user: Member }) {\n  // TODO: This is not yet available in the data. Update here after API is updated.\n  if (user.isLoggedInUser) {\n    return (\n      <Badge color=\"gray\" style={{ userSelect: \"none\" }}>\n        <Translation\n          defaultMessage=\"You\"\n          id=\"ER1Vmv\"\n          description=\"Badge indicating the current logged-in user\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"Invited\") {\n    return (\n      <Badge color=\"amber\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: \"\n            id=\"E2o/+H\"\n            description=\"Prefix for status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Invited\"\n          id=\"byIkUu\"\n          description=\"Badge status indicating user has been invited but not yet accepted\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"InviteExpired\") {\n    return (\n      <Badge color=\"red\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: Invite \"\n            id=\"BWvbwY\"\n            description=\"Prefix for invite status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Expired\"\n          id=\"+0sQaN\"\n          description=\"Badge status indicating user invitation has expired\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"InviteRevoked\") {\n    return (\n      <Badge color=\"red\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: Invite \"\n            id=\"BWvbwY\"\n            description=\"Prefix for invite status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Revoked\"\n          id=\"NNBv+r\"\n          description=\"Badge status indicating user invitation has been revoked\"\n        />\n      </Badge>\n    );\n  }\n  return null;\n}\n\ninterface LastActiveProps {\n  user: Member;\n  isHydrated: boolean;\n  dim?: boolean;\n}\n\nfunction LastActive(props: LastActiveProps) {\n  if (!props.user.lastActivityAt) {\n    return (\n      <>\n        <VisuallyHidden>\n          {props.user.status === \"Active\" ? (\n            <Translation\n              defaultMessage=\"Never\"\n              id=\"0duvF4\"\n              description=\"Screen reader text indicating user has never been active\"\n            />\n          ) : (\n            <Translation\n              defaultMessage=\"Not active\"\n              id=\"hd2+kk\"\n              description=\"Screen reader text indicating user is not active\"\n            />\n          )}\n        </VisuallyHidden>\n        <Separator />\n      </>\n    );\n  }\n  return <LastActiveImpl {...props} date={props.user.lastActivityAt} />;\n}\n\nfunction LastActiveImpl({\n  date,\n  isHydrated,\n  dim,\n}: LastActiveProps & { date: string }) {\n  const locale = useLocale();\n  const { lastActiveDateTime, lastActiveDisplay } = React.useMemo(() => {\n    const defaultTimeZone = \"America/Los_Angeles\";\n    const lastActiveDate = new Date(date);\n    const lastActiveDateTime = lastActiveDate.toLocaleTimeString(locale, {\n      // hard-coded timezone before hydration to prevent server/client mismatch\n      timeZone: isHydrated ? undefined : defaultTimeZone,\n      month: \"long\",\n      day: \"numeric\",\n      year: \"numeric\",\n      hour: \"numeric\",\n      minute: \"numeric\",\n    });\n\n    // Server and client may produce a different 'now' date, so only\n    // show comparative date if the component is hydrated to prevent a\n    // server/client mismatch\n    const lastActiveDisplay = isHydrated\n      ? getComparativeReadableDate(new Date(), lastActiveDate, { locale })\n      : lastActiveDate.toLocaleDateString(locale, {\n          // hard-coded timezone to prevent server/client mismatch\n          timeZone: defaultTimeZone,\n          month: \"long\",\n          day: \"numeric\",\n          year: \"numeric\",\n        });\n\n    return {\n      lastActiveDateTime,\n      lastActiveDisplay,\n    };\n  }, [isHydrated, date, locale]);\n\n  // handle cases where the DB might return an invalid date string\n  if (lastActiveDisplay === \"Invalid Date\") {\n    return (\n      <>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Unknown\"\n            id=\"UUigrK\"\n            description=\"Screen reader text indicating last active date is unknown\"\n          />\n        </VisuallyHidden>\n        <Separator />\n      </>\n    );\n  }\n\n  return (\n    <TableCellText asChild dim={dim}>\n      <time dateTime={date} title={lastActiveDateTime}>\n        {lastActiveDisplay}\n      </time>\n    </TableCellText>\n  );\n}\n\nconst TableCellText = React.forwardRef<HTMLSpanElement, TableCellTextProps>(\n  function TableCellText(\n    { children, dim, level = \"primary\", ...props },\n    forwardedRef,\n  ) {\n    return (\n      <Text\n        ref={forwardedRef}\n        color={level === \"secondary\" ? \"gray\" : undefined}\n        weight={level === \"secondary\" ? \"regular\" : \"medium\"}\n        size={level === \"secondary\" ? \"1\" : \"2\"}\n        truncate\n        {...props}\n        style={\n          dim\n            ? {\n                // TODO: use CSS var instead of hard-coded value for opacity\n                opacity: 0.6,\n                ...props.style,\n              }\n            : props.style\n        }\n      >\n        {children}\n      </Text>\n    );\n  },\n);\n\ntype TableCellTextProps = TextProps & {\n  level?: \"primary\" | \"secondary\";\n  dim?: boolean;\n};\n\nconst FallbackUserIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    fill=\"currentColor\"\n    viewBox=\"0 0 256 256\"\n  >\n    {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n    <title>User icon</title>\n    <path d=\"M229.19,213c-15.81-27.32-40.63-46.49-69.47-54.62a70,70,0,1,0-63.44,0C67.44,166.5,42.62,185.67,26.81,213a6,6,0,1,0,10.38,6C56.4,185.81,90.34,166,128,166s71.6,19.81,90.81,53a6,6,0,1,0,10.38-6ZM70,96a58,58,0,1,1,58,58A58.07,58.07,0,0,1,70,96Z\" />\n  </svg>\n);\n\nconst UsersManagementEmptyState = ({ isPending }: { isPending: boolean }) => {\n  const { clearSearch } = useSearchContext();\n  const {\n    state: { searchQuery },\n  } = useUsersManagementContext();\n\n  // When the search query is cleared, the users query is re-fetched which sends\n  // us into a pending state. When this happens we want to keep a snapshot of\n  // the previous search query while the query is revalidated. We can use this\n  // to keep the 'No users found for query' UI in place until re-fetching is\n  // complete, otherwise the view flips to 'No users found' very quickly before\n  // the full table is shown again.\n  const [{ isClearing, lastSearchQuery }, setClearing] = React.useState({\n    isClearing: false,\n    lastSearchQuery: null as null | string,\n  });\n  const [wasPending, setWasPending] = React.useState(isPending);\n  if (wasPending !== isPending) {\n    setWasPending(isPending);\n    if (!isPending) {\n      setClearing((prev) =>\n        prev.isClearing ? { isClearing: false, lastSearchQuery: null } : prev,\n      );\n    }\n  }\n\n  if (searchQuery || isClearing) {\n    return (\n      <Flex align=\"center\" justify=\"center\" py=\"8\" direction=\"column\" gap=\"2\">\n        <Text size=\"2\">\n          <Translation\n            defaultMessage=\"No users found for query '{query}'\"\n            id=\"wrEZ8+\"\n            description=\"Message shown when no users match the search query\"\n            values={{\n              query: isClearing ? lastSearchQuery : searchQuery,\n            }}\n          />\n        </Text>\n\n        <Button\n          variant=\"secondary\"\n          size=\"1\"\n          onClick={() => {\n            setClearing({ isClearing: true, lastSearchQuery: searchQuery });\n            clearSearch();\n          }}\n          loading={isPending}\n        >\n          <Translation\n            defaultMessage=\"Clear search\"\n            id=\"Xv3fVI\"\n            description=\"Button text to clear the current search query\"\n          />\n        </Button>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex align=\"center\" justify=\"center\" py=\"8\" gap=\"2\">\n      <Text size=\"2\">\n        <Translation\n          defaultMessage=\"No users found\"\n          id=\"MQ+LoA\"\n          description=\"Message shown when there are no users in the system\"\n        />\n      </Text>\n    </Flex>\n  );\n};\n\ninterface UserRolesCellContentProps {\n  user: Member;\n  isMultipleRolesEnabled: boolean;\n  dimText: boolean;\n}\n\nfunction UserRolesCellContent({\n  user,\n  isMultipleRolesEnabled,\n  dimText,\n}: UserRolesCellContentProps) {\n  if (!user.roles || user.roles.length === 0) {\n    return (\n      <>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"No roles assigned\"\n            id=\"CVOVB0\"\n            description=\"Screen reader text indicating user has no roles assigned\"\n          />\n        </VisuallyHidden>\n        {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n        <span aria-hidden style={{ userSelect: \"none\" }}>\n          –\n        </span>\n      </>\n    );\n  }\n\n  if (isMultipleRolesEnabled && user.roles.length > 1) {\n    const roleNames = user.roles?.map((role) => role.name).join(\", \");\n    return (\n      <Tooltip content={roleNames} maxWidth=\"250px\">\n        <TableCellText dim={dimText}>\n          <Translation\n            defaultMessage=\"{count} roles\"\n            id=\"lWAmRC\"\n            description=\"Shows the number of roles assigned to a user (plural)\"\n            values={{ count: user.roles.length }}\n          />\n        </TableCellText>\n      </Tooltip>\n    );\n  }\n\n  return <TableCellText dim={dimText}>{user.roles?.[0]?.name}</TableCellText>;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"users-management\",\n    widgetState: state,\n  });\n}\n\nexport type { UsersManagementLoadingProps, UsersManagementErrorProps };\nexport { UsersManagement, UsersManagementLoading, UsersManagementError };\n"],"mappings":"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","names":["lastActiveDateTime","lastActiveDisplay","TableCellText"]}
+{"version":3,"sources":["../../../src/lib/users-management.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n  Box,\n  Flex,\n  Grid,\n  Separator,\n  Table,\n  Tooltip,\n  Text,\n  type TextProps,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport {\n  Avatar,\n  Badge,\n  IconButton,\n  Button,\n  Select,\n  Skeleton,\n  TextField,\n} from \"./elements.js\";\nimport { InviteUserDialog } from \"./invite-user-dialog.js\";\nimport { SearchProvider, useSearchContext } from \"./search-provider.js\";\nimport { useIsHydrated } from \"./use-is-hydrated.js\";\nimport { UserActionsDropdown } from \"./user-actions-dropdown.js\";\nimport { UsersFilter } from \"./users-filter.js\";\nimport { UsersSearch } from \"./users-search.js\";\nimport {\n  getBestName,\n  getComparativeReadableDate,\n  getDomProps,\n  getListMetadata,\n  WidgetRootState,\n  type WidgetRootDomProps,\n} from \"./utils.js\";\nimport { USER_ROW_LIMIT } from \"./constants.js\";\nimport { useUsersManagementContext } from \"./users-management-context.js\";\nimport { Member, MemberRole, MembersQueryResult } from \"../api/endpoint.js\";\nimport { GenericError } from \"./generic-error.js\";\nimport { DotsHorizontalIcon } from \"@radix-ui/react-icons\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\nimport { useLocale } from \"./i18n/use-locale.js\";\n\ninterface UsersManagementProps extends WidgetRootDomProps {\n  rolesData: { roles: MemberRole[]; multipleRolesEnabled: boolean };\n  userData: MembersQueryResult;\n  disableRolesFilter?: boolean;\n  // When the users list is loading new users\n  isPending: boolean;\n}\n\nconst UsersManagement: React.FC<UsersManagementProps> = ({\n  userData,\n  rolesData,\n  isPending,\n  disableRolesFilter,\n  ...domProps\n}) => {\n  const users = userData?.data ?? [];\n  const usersCount = users?.length ?? 0;\n  const isHydrated = useIsHydrated();\n  const pagination = getListMetadata(userData);\n\n  const { dispatch } = useUsersManagementContext();\n  const isMultipleRolesEnabled = rolesData.multipleRolesEnabled;\n  const translate = useTranslation();\n\n  // we only want to show the loading indicator for some buttons if the request\n  // is still pending after 500ms. If the request is fast enough the indicator\n  // is a bit jarring.\n  const [deferredLoading, setDeferredLoading] = React.useState(false);\n  React.useEffect(() => {\n    if (isPending) {\n      const timeoutId = window.setTimeout(() => {\n        setDeferredLoading(true);\n      }, 500);\n      return () => {\n        window.clearTimeout(timeoutId);\n      };\n    } else {\n      setDeferredLoading(false);\n    }\n  }, [isPending]);\n\n  const showPagination = !!(pagination.before || pagination.after);\n\n  return (\n    <SearchProvider>\n      <Flex\n        direction=\"column\"\n        gap=\"3\"\n        {...getWidgetRootDomProps(\"resolved\", domProps)}\n      >\n        <Grid columns=\"1fr auto\" gap=\"2\">\n          <Flex gap=\"2\" align=\"center\">\n            <Box flexBasis=\"380px\" flexGrow=\"0\" flexShrink=\"1\">\n              <UsersSearch />\n            </Box>\n            <Box flexGrow=\"0\" flexShrink=\"0\">\n              <UsersFilter\n                roles={rolesData.roles}\n                disabled={disableRolesFilter}\n              />\n            </Box>\n          </Flex>\n          <Box flexGrow=\"0\" flexShrink=\"0\" style={{ placeSelf: \"flex-end\" }}>\n            <InviteUserDialog>\n              <Button>\n                <Translation\n                  defaultMessage=\"Invite user\"\n                  id=\"NBXpRj\"\n                  description=\"Button text to invite a new user to the organization\"\n                />\n              </Button>\n            </InviteUserDialog>\n          </Box>\n        </Grid>\n        <Table.Root variant=\"ghost\" size=\"1\">\n          <Table.Header>\n            <Table.Row>\n              <Table.ColumnHeaderCell width=\"260px\">\n                <Translation\n                  defaultMessage=\"User\"\n                  id=\"BBh86k\"\n                  description=\"Column header for user information in the users table\"\n                />\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"100px\">\n                {isMultipleRolesEnabled ? (\n                  <Translation\n                    defaultMessage=\"Roles\"\n                    id=\"A1DuWM\"\n                    description=\"Column header for user roles when multiple roles are enabled\"\n                  />\n                ) : (\n                  <Translation\n                    defaultMessage=\"Role\"\n                    id=\"nQbe+Y\"\n                    description=\"Column header for user role when only single role is allowed\"\n                  />\n                )}\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"140px\">\n                <Translation\n                  defaultMessage=\"Last active\"\n                  id=\"oOwLGt\"\n                  description=\"Column header showing when users were last active\"\n                />\n              </Table.ColumnHeaderCell>\n              <Table.ColumnHeaderCell width=\"28px\" />\n            </Table.Row>\n          </Table.Header>\n\n          <Table.Body\n            style={{\n              transition: `opacity 0.2s ease-out ${isPending ? \"0.2s\" : \"0s\"}`,\n              opacity: isPending && usersCount > 0 ? 0.5 : 1,\n            }}\n          >\n            {users.length > 0 ? (\n              users.map((user) => {\n                const userDisplayName = getBestName(user);\n                const dimText =\n                  user.status === \"InviteRevoked\" ||\n                  user.status === \"InviteExpired\";\n                return (\n                  <Table.Row key={user.id} align=\"center\">\n                    <Table.RowHeaderCell>\n                      <Flex\n                        align=\"center\"\n                        gap=\"3\"\n                        overflow=\"hidden\"\n                        height=\"var(--space-7)\"\n                      >\n                        <Avatar\n                          size=\"2\"\n                          fallback={<FallbackUserIcon />}\n                          src={user.profilePictureUrl ?? undefined}\n                          dim={dimText}\n                        />\n\n                        {userDisplayName ? (\n                          <Flex\n                            direction=\"column\"\n                            align=\"start\"\n                            height=\"var(--space-7)\"\n                            justify=\"center\"\n                            overflow=\"hidden\"\n                          >\n                            <Flex gap=\"2\" align=\"center\" minWidth=\"0\">\n                              <TableCellText dim={dimText}>\n                                {userDisplayName}\n                              </TableCellText>\n                              <UserBadge user={user} />\n                            </Flex>\n                            <TableCellText\n                              level=\"secondary\"\n                              title={user.email}\n                              dim={dimText}\n                            >\n                              {user.email}\n                            </TableCellText>\n                          </Flex>\n                        ) : (\n                          <Flex gap=\"2\" align=\"center\" minWidth=\"0\">\n                            <TableCellText dim={dimText} title={user.email}>\n                              {user.email}\n                            </TableCellText>\n                            <UserBadge user={user} />\n                          </Flex>\n                        )}\n                      </Flex>\n                    </Table.RowHeaderCell>\n                    <Table.Cell>\n                      <UserRolesCellContent\n                        user={user}\n                        isMultipleRolesEnabled={isMultipleRolesEnabled}\n                        dimText={dimText}\n                      />\n                    </Table.Cell>\n                    <Table.Cell>\n                      <LastActive user={user} isHydrated={isHydrated} />\n                    </Table.Cell>\n                    <Table.Cell justify=\"end\">\n                      <UserActionsDropdown user={user}>\n                        <IconButton\n                          title={translate({\n                            defaultMessage: \"User actions\",\n                            id: \"1nsmNS\",\n                            description:\n                              \"Button tooltip for opening user actions menu\",\n                          })}\n                        >\n                          <DotsHorizontalIcon />\n                        </IconButton>\n                      </UserActionsDropdown>\n                    </Table.Cell>\n                  </Table.Row>\n                );\n              })\n            ) : (\n              <Table.Row align=\"center\">\n                <Table.Cell colSpan={4}>\n                  <UsersManagementEmptyState isPending={isPending} />\n                </Table.Cell>\n              </Table.Row>\n            )}\n          </Table.Body>\n        </Table.Root>\n\n        {showPagination ? (\n          <Flex gap=\"2\" justify=\"end\">\n            <Button\n              variant=\"secondary\"\n              size=\"1\"\n              disabled={!pagination.after || isPending || undefined}\n              loading={deferredLoading}\n              onClick={() => {\n                if (pagination.after) {\n                  dispatch({\n                    type: \"SET_PAGINATION\",\n                    pagination: { after: pagination.after, before: null },\n                  });\n                }\n              }}\n            >\n              <Translation\n                defaultMessage=\"Previous\"\n                id=\"910Q6b\"\n                description=\"Button text to navigate to the previous page of users\"\n              />\n            </Button>\n            <Button\n              variant=\"secondary\"\n              size=\"1\"\n              disabled={!pagination.before || isPending || undefined}\n              loading={deferredLoading}\n              onClick={() => {\n                if (pagination.before) {\n                  dispatch({\n                    type: \"SET_PAGINATION\",\n                    pagination: { before: pagination.before, after: null },\n                  });\n                }\n              }}\n            >\n              <Translation\n                defaultMessage=\"Next\"\n                id=\"UlAY08\"\n                description=\"Button text to navigate to the next page of users\"\n              />\n            </Button>\n          </Flex>\n        ) : null}\n      </Flex>\n    </SearchProvider>\n  );\n};\n\ninterface UsersManagementLoadingProps extends WidgetRootDomProps {}\n\nconst UsersManagementLoading: React.FC<UsersManagementLoadingProps> = (\n  props,\n) => {\n  const translate = useTranslation();\n  const placeholderText = (\n    <Translation\n      defaultMessage=\"All\"\n      id=\"l/Do9/\"\n      description=\"Filter option to show all users\"\n    />\n  );\n  return (\n    <Flex\n      direction=\"column\"\n      gap=\"3\"\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Grid columns=\"1fr auto\" gap=\"2\">\n        <Flex gap=\"2\" align=\"center\">\n          <Skeleton loading>\n            <Box flexBasis=\"380px\" flexGrow=\"0\" flexShrink=\"1\">\n              <TextField\n                disabled\n                aria-label={translate({\n                  defaultMessage: \"User search\",\n                  id: \"lzPOKv\",\n                  description: \"Label for the user search input field\",\n                })}\n              />\n            </Box>\n          </Skeleton>\n          <Skeleton loading>\n            <Box flexGrow=\"0\" flexShrink=\"0\">\n              <Select.Root disabled value=\"all\" onValueChange={() => void 0}>\n                <Select.Trigger>{placeholderText}</Select.Trigger>\n                <Select.Content>\n                  <Select.Item value=\"all\">{placeholderText}</Select.Item>\n                </Select.Content>\n              </Select.Root>\n            </Box>\n          </Skeleton>\n        </Flex>\n        <Skeleton loading>\n          <Box flexGrow=\"0\" flexShrink=\"0\" style={{ placeSelf: \"flex-end\" }}>\n            <Button disabled>\n              <Translation\n                defaultMessage=\"Invite user\"\n                id=\"NBXpRj\"\n                description=\"Button text to invite a new user to the organization\"\n              />\n            </Button>\n          </Box>\n        </Skeleton>\n      </Grid>\n      <Table.Root variant=\"ghost\" size=\"1\">\n        <Table.Header>\n          <Table.Row>\n            <Table.ColumnHeaderCell width=\"260px\">\n              <Skeleton loading>\n                <Translation\n                  defaultMessage=\"User\"\n                  id=\"BBh86k\"\n                  description=\"Column header for user information in the users table\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"100px\">\n              <Skeleton>\n                <Translation\n                  defaultMessage=\"Role\"\n                  id=\"FK7mP4\"\n                  description=\"Column header for user role\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"140px\">\n              <Skeleton>\n                <Translation\n                  defaultMessage=\"Last active\"\n                  id=\"oOwLGt\"\n                  description=\"Column header showing when users were last active\"\n                />\n              </Skeleton>\n            </Table.ColumnHeaderCell>\n            <Table.ColumnHeaderCell width=\"28px\" />\n          </Table.Row>\n        </Table.Header>\n\n        <Table.Body>\n          {Array.from({ length: USER_ROW_LIMIT }, (_, index) => (\n            <Table.Row key={index} align=\"center\">\n              <Table.RowHeaderCell>\n                <Flex align=\"center\" gap=\"3\">\n                  <Skeleton>\n                    <Avatar size=\"2\" fallback=\"F\" />\n                  </Skeleton>\n\n                  <Flex\n                    direction=\"column\"\n                    height=\"var(--space-7)\"\n                    justify=\"center\"\n                  >\n                    <Skeleton width=\"180px\" height=\"var(--space-4)\" />\n                    <Skeleton width=\"90px\" height=\"var(--space-3)\" mt=\"1\" />\n                  </Flex>\n                </Flex>\n              </Table.RowHeaderCell>\n              <Table.Cell>\n                <Flex wrap=\"wrap\" gap=\"1\">\n                  <Skeleton width=\"75px\" height=\"var(--space-4)\" />\n                </Flex>\n              </Table.Cell>\n              <Table.Cell>\n                <Skeleton width=\"120px\" height=\"var(--space-4)\" />\n              </Table.Cell>\n              <Table.Cell justify=\"end\" />\n            </Table.Row>\n          ))}\n        </Table.Body>\n      </Table.Root>\n\n      <Flex gap=\"2\" justify=\"end\">\n        <Skeleton loading>\n          <Button disabled variant=\"secondary\" size=\"1\">\n            <Translation\n              defaultMessage=\"Previous\"\n              id=\"910Q6b\"\n              description=\"Button text to navigate to the previous page of users\"\n            />\n          </Button>\n        </Skeleton>\n        <Skeleton loading>\n          <Button disabled variant=\"secondary\" size=\"1\">\n            <Translation\n              defaultMessage=\"Next\"\n              id=\"UlAY08\"\n              description=\"Button text to navigate to the next page of users\"\n            />\n          </Button>\n        </Skeleton>\n      </Flex>\n    </Flex>\n  );\n};\n\ninterface UsersManagementErrorProps extends WidgetRootDomProps {\n  error: unknown;\n}\n\nconst UsersManagementError: React.FC<UsersManagementErrorProps> = ({\n  error,\n  ...domProps\n}) => {\n  return (\n    <GenericError\n      error={error}\n      minHeight=\"676px\"\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    />\n  );\n};\n\nfunction UserBadge({ user }: { user: Member }) {\n  // TODO: This is not yet available in the data. Update here after API is updated.\n  if (user.isLoggedInUser) {\n    return (\n      <Badge color=\"gray\" style={{ userSelect: \"none\" }}>\n        <Translation\n          defaultMessage=\"You\"\n          id=\"ER1Vmv\"\n          description=\"Badge indicating the current logged-in user\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"Invited\") {\n    return (\n      <Badge color=\"amber\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: \"\n            id=\"E2o/+H\"\n            description=\"Prefix for status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Invited\"\n          id=\"byIkUu\"\n          description=\"Badge status indicating user has been invited but not yet accepted\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"InviteExpired\") {\n    return (\n      <Badge color=\"red\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: Invite \"\n            id=\"BWvbwY\"\n            description=\"Prefix for invite status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Expired\"\n          id=\"+0sQaN\"\n          description=\"Badge status indicating user invitation has expired\"\n        />\n      </Badge>\n    );\n  }\n  if (user.status === \"InviteRevoked\") {\n    return (\n      <Badge color=\"red\" style={{ userSelect: \"none\" }}>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Status: Invite \"\n            id=\"BWvbwY\"\n            description=\"Prefix for invite status indicator in screen reader\"\n          />\n        </VisuallyHidden>\n        <Translation\n          defaultMessage=\"Revoked\"\n          id=\"NNBv+r\"\n          description=\"Badge status indicating user invitation has been revoked\"\n        />\n      </Badge>\n    );\n  }\n  return null;\n}\n\ninterface LastActiveProps {\n  user: Member;\n  isHydrated: boolean;\n  dim?: boolean;\n}\n\nfunction LastActive(props: LastActiveProps) {\n  if (!props.user.lastActivityAt) {\n    return (\n      <>\n        <VisuallyHidden>\n          {props.user.status === \"Active\" ? (\n            <Translation\n              defaultMessage=\"Never\"\n              id=\"0duvF4\"\n              description=\"Screen reader text indicating user has never been active\"\n            />\n          ) : (\n            <Translation\n              defaultMessage=\"Not active\"\n              id=\"hd2+kk\"\n              description=\"Screen reader text indicating user is not active\"\n            />\n          )}\n        </VisuallyHidden>\n        <Separator />\n      </>\n    );\n  }\n  return <LastActiveImpl {...props} date={props.user.lastActivityAt} />;\n}\n\nfunction LastActiveImpl({\n  date,\n  isHydrated,\n  dim,\n}: LastActiveProps & { date: string }) {\n  const locale = useLocale();\n  const { lastActiveDateTime, lastActiveDisplay } = React.useMemo(() => {\n    const defaultTimeZone = \"America/Los_Angeles\";\n    const lastActiveDate = new Date(date);\n    const lastActiveDateTime = lastActiveDate.toLocaleTimeString(locale, {\n      // hard-coded timezone before hydration to prevent server/client mismatch\n      timeZone: isHydrated ? undefined : defaultTimeZone,\n      month: \"long\",\n      day: \"numeric\",\n      year: \"numeric\",\n      hour: \"numeric\",\n      minute: \"numeric\",\n    });\n\n    // Server and client may produce a different 'now' date, so only\n    // show comparative date if the component is hydrated to prevent a\n    // server/client mismatch\n    const lastActiveDisplay = isHydrated\n      ? getComparativeReadableDate(new Date(), lastActiveDate, { locale })\n      : lastActiveDate.toLocaleDateString(locale, {\n          // hard-coded timezone to prevent server/client mismatch\n          timeZone: defaultTimeZone,\n          month: \"long\",\n          day: \"numeric\",\n          year: \"numeric\",\n        });\n\n    return {\n      lastActiveDateTime,\n      lastActiveDisplay,\n    };\n  }, [isHydrated, date, locale]);\n\n  // handle cases where the DB might return an invalid date string\n  if (lastActiveDisplay === \"Invalid Date\") {\n    return (\n      <>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"Unknown\"\n            id=\"UUigrK\"\n            description=\"Screen reader text indicating last active date is unknown\"\n          />\n        </VisuallyHidden>\n        <Separator />\n      </>\n    );\n  }\n\n  return (\n    <TableCellText asChild dim={dim}>\n      <time dateTime={date} title={lastActiveDateTime}>\n        {lastActiveDisplay}\n      </time>\n    </TableCellText>\n  );\n}\n\nconst TableCellText = React.forwardRef<HTMLSpanElement, TableCellTextProps>(\n  function TableCellText(\n    { children, dim, level = \"primary\", ...props },\n    forwardedRef,\n  ) {\n    return (\n      <Text\n        ref={forwardedRef}\n        color={level === \"secondary\" ? \"gray\" : undefined}\n        weight={level === \"secondary\" ? \"regular\" : \"medium\"}\n        size={level === \"secondary\" ? \"1\" : \"2\"}\n        truncate\n        {...props}\n        style={\n          dim\n            ? {\n                // TODO: use CSS var instead of hard-coded value for opacity\n                opacity: 0.6,\n                ...props.style,\n              }\n            : props.style\n        }\n      >\n        {children}\n      </Text>\n    );\n  },\n);\n\ntype TableCellTextProps = TextProps & {\n  level?: \"primary\" | \"secondary\";\n  dim?: boolean;\n};\n\nconst FallbackUserIcon = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"20\"\n    height=\"20\"\n    fill=\"currentColor\"\n    viewBox=\"0 0 256 256\"\n  >\n    {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n    <title>User icon</title>\n    <path d=\"M229.19,213c-15.81-27.32-40.63-46.49-69.47-54.62a70,70,0,1,0-63.44,0C67.44,166.5,42.62,185.67,26.81,213a6,6,0,1,0,10.38,6C56.4,185.81,90.34,166,128,166s71.6,19.81,90.81,53a6,6,0,1,0,10.38-6ZM70,96a58,58,0,1,1,58,58A58.07,58.07,0,0,1,70,96Z\" />\n  </svg>\n);\n\nconst UsersManagementEmptyState = ({ isPending }: { isPending: boolean }) => {\n  const { clearSearch } = useSearchContext();\n  const {\n    state: { searchQuery },\n  } = useUsersManagementContext();\n\n  // When the search query is cleared, the users query is re-fetched which sends\n  // us into a pending state. When this happens we want to keep a snapshot of\n  // the previous search query while the query is revalidated. We can use this\n  // to keep the 'No users found for query' UI in place until re-fetching is\n  // complete, otherwise the view flips to 'No users found' very quickly before\n  // the full table is shown again.\n  const [{ isClearing, lastSearchQuery }, setClearing] = React.useState({\n    isClearing: false,\n    lastSearchQuery: null as null | string,\n  });\n  const [wasPending, setWasPending] = React.useState(isPending);\n  if (wasPending !== isPending) {\n    setWasPending(isPending);\n    if (!isPending) {\n      setClearing((prev) =>\n        prev.isClearing ? { isClearing: false, lastSearchQuery: null } : prev,\n      );\n    }\n  }\n\n  if (searchQuery || isClearing) {\n    return (\n      <Flex align=\"center\" justify=\"center\" py=\"8\" direction=\"column\" gap=\"2\">\n        <Text size=\"2\">\n          <Translation\n            defaultMessage=\"No users found for query '{query}'\"\n            id=\"wrEZ8+\"\n            description=\"Message shown when no users match the search query\"\n            values={{\n              query: isClearing ? lastSearchQuery : searchQuery,\n            }}\n          />\n        </Text>\n\n        <Button\n          variant=\"secondary\"\n          size=\"1\"\n          onClick={() => {\n            setClearing({ isClearing: true, lastSearchQuery: searchQuery });\n            clearSearch();\n          }}\n          loading={isPending}\n        >\n          <Translation\n            defaultMessage=\"Clear search\"\n            id=\"Xv3fVI\"\n            description=\"Button text to clear the current search query\"\n          />\n        </Button>\n      </Flex>\n    );\n  }\n\n  return (\n    <Flex align=\"center\" justify=\"center\" py=\"8\" gap=\"2\">\n      <Text size=\"2\">\n        <Translation\n          defaultMessage=\"No users found\"\n          id=\"MQ+LoA\"\n          description=\"Message shown when there are no users in the system\"\n        />\n      </Text>\n    </Flex>\n  );\n};\n\ninterface UserRolesCellContentProps {\n  user: Member;\n  isMultipleRolesEnabled: boolean;\n  dimText: boolean;\n}\n\nfunction UserRolesCellContent({\n  user,\n  isMultipleRolesEnabled,\n  dimText,\n}: UserRolesCellContentProps) {\n  if (!user.roles || user.roles.length === 0) {\n    return (\n      <>\n        <VisuallyHidden>\n          <Translation\n            defaultMessage=\"No roles assigned\"\n            id=\"CVOVB0\"\n            description=\"Screen reader text indicating user has no roles assigned\"\n          />\n        </VisuallyHidden>\n        {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n        <span aria-hidden style={{ userSelect: \"none\" }}>\n          –\n        </span>\n      </>\n    );\n  }\n\n  if (isMultipleRolesEnabled && user.roles.length > 1) {\n    const roleNames = user.roles?.map((role) => role.name).join(\", \");\n    return (\n      <Tooltip content={roleNames} maxWidth=\"250px\">\n        <TableCellText dim={dimText}>\n          <Translation\n            defaultMessage=\"{count} roles\"\n            id=\"lWAmRC\"\n            description=\"Shows the number of roles assigned to a user (plural)\"\n            values={{ count: user.roles.length }}\n          />\n        </TableCellText>\n      </Tooltip>\n    );\n  }\n\n  return <TableCellText dim={dimText}>{user.roles?.[0]?.name}</TableCellText>;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"users-management\",\n    widgetState: state,\n  });\n}\n\nexport type { UsersManagementLoadingProps, UsersManagementErrorProps };\nexport { UsersManagement, UsersManagementLoading, UsersManagementError };\n"],"mappings":"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","names":["lastActiveDateTime","lastActiveDisplay","TableCellText"]}

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

@@ -1,4 +1,4 @@
-import { Member } from '../api/endpoint.js';
+import { Member, ListMetadata } from '../api/endpoint.js';
 import { Elements } from './elements.js';
 import '@tanstack/react-query';
 import '../api/widgets-api-client.js';
@@ -69,5 +69,19 @@ interface WidgetRootDomProps {
     className?: string;
 }
 type WidgetRootState = "loading" | "error" | "resolved";
+type Pagination = Nullable<{
+    before: string;
+    after: string;
+}>;
+type DeprecatedListMetadataResponse = {
+    listMetadata: Pagination;
+};
+type NewListMetadataResponse = {
+    list_metadata: Pagination;
+};
+declare function getListMetadata<T extends DeprecatedListMetadataResponse | NewListMetadataResponse>(responseObject: T | undefined | null): ListMetadata;
+type Nullable<T> = {
+    [K in keyof T]?: T[K] | null;
+};
 
-export { type WidgetRootDomProps, type WidgetRootState, canUseDOM, getBestName, getComparativeReadableDate, getDomProps, getUserLocation, isErrorLike, isObjectLike, isPromiseLike, namespaceClassNames, parseErrorResponse, parseUserAgent, pluralize, unreachable };
+export { type Nullable, type WidgetRootDomProps, type WidgetRootState, canUseDOM, getBestName, getComparativeReadableDate, getDomProps, getListMetadata, getUserLocation, isErrorLike, isObjectLike, isPromiseLike, namespaceClassNames, parseErrorResponse, parseUserAgent, pluralize, unreachable };

package/dist/esm/lib/utils.js

@@ -156,11 +156,19 @@ function unreachable(value) {
 function pluralize(word = "", amount = 0, showAmount = true) {
   return `${showAmount ? `${amount} ` : ""}${word}${amount === 1 ? "" : "s"}`;
 }
+function getListMetadata(responseObject) {
+  const listMetadata = responseObject && "listMetadata" in responseObject ? responseObject.listMetadata : responseObject?.list_metadata;
+  return {
+    before: listMetadata?.before ?? null,
+    after: listMetadata?.after ?? null
+  };
+}
 export {
   canUseDOM,
   getBestName,
   getComparativeReadableDate,
   getDomProps,
+  getListMetadata,
   getUserLocation,
   isErrorLike,
   isObjectLike,

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/utils.ts"],"sourcesContent":["import { Member } from \"../api/endpoint.js\";\nimport Bowser from \"bowser\";\nimport cx from \"clsx\";\nimport {\n  WIDGETS_CLASS_NAMESPACE,\n  WIDGETS_DATA_ATTRIBUTE_NAMESPACE,\n} from \"./constants.js\";\nimport type { Elements } from \"./elements.js\";\n\nexport const canUseDOM = !!(\n  typeof window !== \"undefined\" &&\n  window.document &&\n  window.document.createElement\n);\n\nexport function getBestName({\n  firstName,\n  lastName,\n}: Pick<Member, \"firstName\" | \"lastName\">) {\n  return [firstName, lastName].filter(Boolean).join(\" \") || null;\n}\n\nexport function getComparativeReadableDate(\n  now: Date,\n  then: Date,\n  options: { locale: string; timeZone?: string },\n): string {\n  const locale = options.locale ?? \"en-US\";\n  const timeSince = now.getTime() - then.getTime();\n  const formatter = new Intl.RelativeTimeFormat(locale, { numeric: \"auto\" });\n\n  // Has it been less than a minute?\n  if (timeSince < 60_000) {\n    return formatter.format(0, \"second\"); // Returns \"now\" / \"maintenant\" / \"jetzt\" etc.\n  }\n\n  // Has it been less than an hour?\n  if (timeSince < 3_600_000) {\n    const timePassed = Math.floor(timeSince / 60_000);\n    return formatter.format(-timePassed, \"minute\");\n  }\n\n  // Has it been less than a day?\n  if (timeSince < 86_400_000) {\n    const timePassed = Math.floor(timeSince / 3_600_000);\n    return formatter.format(-timePassed, \"hour\");\n  }\n\n  // Has it been less than a week?\n  if (timeSince < 604_800_000) {\n    const timePassed = Math.floor(timeSince / 86_400_000);\n    return formatter.format(-timePassed, \"day\");\n  }\n\n  // Has it been less than a month?\n  if (timeSince < 2_592_000_000) {\n    const timePassed = Math.floor(timeSince / 604_800_000);\n    return formatter.format(-timePassed, \"week\");\n  }\n\n  // Any later?\n  return then.toLocaleDateString(locale, {\n    timeZone: options.timeZone,\n    month: \"long\",\n    day: \"numeric\",\n    // omit year if it's the same as the current year\n    year: now.getFullYear() !== then.getFullYear() ? \"numeric\" : undefined,\n  });\n}\n\nexport function isObjectLike(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null;\n}\n\nexport function isErrorLike(\n  value: unknown,\n): value is Record<string, unknown> & { message: string } {\n  return isObjectLike(value) && typeof value.message === \"string\";\n}\n\nexport function isPromiseLike(value: unknown): value is PromiseLike<unknown> {\n  return (\n    typeof value === \"object\" &&\n    value !== null &&\n    \"then\" in value &&\n    typeof value.then === \"function\"\n  );\n}\n\nexport async function parseErrorResponse(\n  response: Response,\n): Promise<{ message: string; status: number }> {\n  try {\n    const json = await response.json();\n    if (!isObjectLike(json) || typeof json.message !== \"string\") {\n      return {\n        status: response.status,\n        message: response.statusText,\n      };\n    }\n    return {\n      ...json,\n      status: response.status,\n      message: json.message || response.statusText,\n    };\n  } catch {\n    return {\n      status: response.status,\n      message: response.statusText,\n    };\n  }\n}\n\nexport function namespaceClassNames(\n  ...classNames: (string | undefined | null | boolean)[]\n): string {\n  return classNames\n    .filter(Boolean)\n    .map((className) => `${WIDGETS_CLASS_NAMESPACE}-${className}`)\n    .join(\" \");\n}\n\ninterface CommonDomArgs {\n  className?: string | undefined | null;\n  dataAttributes?: Record<string, string | boolean | undefined | null>;\n}\n\ninterface WidgetRootDomArgs {\n  isWidgetRoot: true;\n  widgetId: string;\n  elementId?: never;\n  widgetState: WidgetRootState;\n}\n\ninterface WidgetElementDomArgs {\n  isWidgetRoot?: false;\n  widgetId?: string;\n  elementId?: keyof Elements;\n  widgetState?: never;\n  className: string | undefined | null;\n}\n\ntype DomArgs = CommonDomArgs & (WidgetRootDomArgs | WidgetElementDomArgs);\n\ntype DataAttributeProps = {\n  [K in `data-${string}`]?: string | boolean;\n};\n\ntype DomProps = {\n  className: string | undefined;\n} & DataAttributeProps;\n\nexport function getDomProps(args: DomArgs) {\n  let {\n    className,\n    dataAttributes,\n    isWidgetRoot = false,\n    widgetId,\n    elementId,\n    widgetState,\n    ...passthroughProps\n  } = args;\n\n  const elementClassName = elementId\n    ? (() => {\n        // TODO: Overrides for specific elements are mostly here for backwards\n        // compatibility. They should be removed in the next major version.\n        if (\n          elementId === \"primaryButton\" ||\n          elementId === \"secondaryButton\" ||\n          elementId === \"destructiveButton\"\n        ) {\n          return namespaceClassNames(\"button\");\n        }\n\n        if (elementId === \"iconButton\") {\n          return namespaceClassNames(\"button\", \"icon-button\");\n        }\n\n        if (\n          elementId === \"primaryMenuItem\" ||\n          elementId === \"destructiveMenuItem\"\n        ) {\n          return namespaceClassNames(\"menu-item\");\n        }\n\n        if (elementId === \"textfield\") {\n          return namespaceClassNames(elementId, \"text-field\");\n        }\n\n        return namespaceClassNames(fastKebabCase(elementId));\n      })()\n    : undefined;\n\n  const props: DomProps = {\n    ...passthroughProps,\n    className: cx(\n      className,\n      isWidgetRoot && namespaceClassNames(\"widget\"),\n      elementClassName,\n    ),\n  };\n\n  if (widgetId) {\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget-id`] = widgetId;\n  }\n\n  if (isWidgetRoot) {\n    widgetState ??= \"resolved\";\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget`] = true;\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget-state`] =\n      widgetState;\n  }\n\n  if (dataAttributes) {\n    for (const [key, value] of Object.entries(dataAttributes)) {\n      if (value != null) {\n        const parts = [widgetId, elementId, key]\n          .filter((v) => v != null)\n          .map(fastKebabCase)\n          .join(\"-\");\n        if (parts) {\n          props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-${parts}`] = value;\n        }\n      }\n    }\n  }\n\n  if (elementId) {\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-element`] =\n      fastKebabCase(elementId);\n  }\n\n  return props;\n}\n\n/**\n * Opt for simplicity and performance over capturing edge cases. Input strings\n * are expected to only be alphabetic.\n */\nfunction fastKebabCase(alphaString: string) {\n  return alphaString.replace(/([A-Z])/g, \"-$1\").toLowerCase();\n}\n\nexport function parseUserAgent(userAgent?: string | null) {\n  const browser = Bowser.getParser(userAgent ?? \"\");\n  const browserName = browser.getBrowserName().replace(/^Mobile\\s*/i, \"\");\n  const osName = browser.getOSName();\n  const pretty = [browserName, osName].filter(Boolean).join(\" on \");\n\n  return { pretty, isMobile: browser.getPlatformType() === \"mobile\" };\n}\n\nexport function getUserLocation(\n  location?: {\n    cityName: string;\n    countryISOCode: string;\n  } | null,\n  ipAddress?: string | null,\n) {\n  if (location) {\n    return (\n      [location.cityName, location.countryISOCode].filter(Boolean).join(\", \") ||\n      \"Unknown location\"\n    );\n  }\n\n  if (ipAddress) {\n    return ipAddress;\n  }\n\n  return \"Unknown location\";\n}\n\nexport function unreachable(value: never): never {\n  throw new TypeError(`Unreachable code: ${value}`);\n}\n\nexport function pluralize(word = \"\", amount = 0, showAmount = true): string {\n  return `${showAmount ? `${amount} ` : \"\"}${word}${amount === 1 ? \"\" : \"s\"}`;\n}\n\n// Props that all widgets should accept.\nexport interface WidgetRootDomProps {\n  className?: string;\n}\n\nexport type WidgetRootState = \"loading\" | \"error\" | \"resolved\";\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/utils.ts"],"sourcesContent":["import { ListMetadata, Member } from \"../api/endpoint.js\";\nimport Bowser from \"bowser\";\nimport cx from \"clsx\";\nimport {\n  WIDGETS_CLASS_NAMESPACE,\n  WIDGETS_DATA_ATTRIBUTE_NAMESPACE,\n} from \"./constants.js\";\nimport type { Elements } from \"./elements.js\";\n\nexport const canUseDOM = !!(\n  typeof window !== \"undefined\" &&\n  window.document &&\n  window.document.createElement\n);\n\nexport function getBestName({\n  firstName,\n  lastName,\n}: Pick<Member, \"firstName\" | \"lastName\">) {\n  return [firstName, lastName].filter(Boolean).join(\" \") || null;\n}\n\nexport function getComparativeReadableDate(\n  now: Date,\n  then: Date,\n  options: { locale: string; timeZone?: string },\n): string {\n  const locale = options.locale ?? \"en-US\";\n  const timeSince = now.getTime() - then.getTime();\n  const formatter = new Intl.RelativeTimeFormat(locale, { numeric: \"auto\" });\n\n  // Has it been less than a minute?\n  if (timeSince < 60_000) {\n    return formatter.format(0, \"second\"); // Returns \"now\" / \"maintenant\" / \"jetzt\" etc.\n  }\n\n  // Has it been less than an hour?\n  if (timeSince < 3_600_000) {\n    const timePassed = Math.floor(timeSince / 60_000);\n    return formatter.format(-timePassed, \"minute\");\n  }\n\n  // Has it been less than a day?\n  if (timeSince < 86_400_000) {\n    const timePassed = Math.floor(timeSince / 3_600_000);\n    return formatter.format(-timePassed, \"hour\");\n  }\n\n  // Has it been less than a week?\n  if (timeSince < 604_800_000) {\n    const timePassed = Math.floor(timeSince / 86_400_000);\n    return formatter.format(-timePassed, \"day\");\n  }\n\n  // Has it been less than a month?\n  if (timeSince < 2_592_000_000) {\n    const timePassed = Math.floor(timeSince / 604_800_000);\n    return formatter.format(-timePassed, \"week\");\n  }\n\n  // Any later?\n  return then.toLocaleDateString(locale, {\n    timeZone: options.timeZone,\n    month: \"long\",\n    day: \"numeric\",\n    // omit year if it's the same as the current year\n    year: now.getFullYear() !== then.getFullYear() ? \"numeric\" : undefined,\n  });\n}\n\nexport function isObjectLike(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null;\n}\n\nexport function isErrorLike(\n  value: unknown,\n): value is Record<string, unknown> & { message: string } {\n  return isObjectLike(value) && typeof value.message === \"string\";\n}\n\nexport function isPromiseLike(value: unknown): value is PromiseLike<unknown> {\n  return (\n    typeof value === \"object\" &&\n    value !== null &&\n    \"then\" in value &&\n    typeof value.then === \"function\"\n  );\n}\n\nexport async function parseErrorResponse(\n  response: Response,\n): Promise<{ message: string; status: number }> {\n  try {\n    const json = await response.json();\n    if (!isObjectLike(json) || typeof json.message !== \"string\") {\n      return {\n        status: response.status,\n        message: response.statusText,\n      };\n    }\n    return {\n      ...json,\n      status: response.status,\n      message: json.message || response.statusText,\n    };\n  } catch {\n    return {\n      status: response.status,\n      message: response.statusText,\n    };\n  }\n}\n\nexport function namespaceClassNames(\n  ...classNames: (string | undefined | null | boolean)[]\n): string {\n  return classNames\n    .filter(Boolean)\n    .map((className) => `${WIDGETS_CLASS_NAMESPACE}-${className}`)\n    .join(\" \");\n}\n\ninterface CommonDomArgs {\n  className?: string | undefined | null;\n  dataAttributes?: Record<string, string | boolean | undefined | null>;\n}\n\ninterface WidgetRootDomArgs {\n  isWidgetRoot: true;\n  widgetId: string;\n  elementId?: never;\n  widgetState: WidgetRootState;\n}\n\ninterface WidgetElementDomArgs {\n  isWidgetRoot?: false;\n  widgetId?: string;\n  elementId?: keyof Elements;\n  widgetState?: never;\n  className: string | undefined | null;\n}\n\ntype DomArgs = CommonDomArgs & (WidgetRootDomArgs | WidgetElementDomArgs);\n\ntype DataAttributeProps = {\n  [K in `data-${string}`]?: string | boolean;\n};\n\ntype DomProps = {\n  className: string | undefined;\n} & DataAttributeProps;\n\nexport function getDomProps(args: DomArgs) {\n  let {\n    className,\n    dataAttributes,\n    isWidgetRoot = false,\n    widgetId,\n    elementId,\n    widgetState,\n    ...passthroughProps\n  } = args;\n\n  const elementClassName = elementId\n    ? (() => {\n        // TODO: Overrides for specific elements are mostly here for backwards\n        // compatibility. They should be removed in the next major version.\n        if (\n          elementId === \"primaryButton\" ||\n          elementId === \"secondaryButton\" ||\n          elementId === \"destructiveButton\"\n        ) {\n          return namespaceClassNames(\"button\");\n        }\n\n        if (elementId === \"iconButton\") {\n          return namespaceClassNames(\"button\", \"icon-button\");\n        }\n\n        if (\n          elementId === \"primaryMenuItem\" ||\n          elementId === \"destructiveMenuItem\"\n        ) {\n          return namespaceClassNames(\"menu-item\");\n        }\n\n        if (elementId === \"textfield\") {\n          return namespaceClassNames(elementId, \"text-field\");\n        }\n\n        return namespaceClassNames(fastKebabCase(elementId));\n      })()\n    : undefined;\n\n  const props: DomProps = {\n    ...passthroughProps,\n    className: cx(\n      className,\n      isWidgetRoot && namespaceClassNames(\"widget\"),\n      elementClassName,\n    ),\n  };\n\n  if (widgetId) {\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget-id`] = widgetId;\n  }\n\n  if (isWidgetRoot) {\n    widgetState ??= \"resolved\";\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget`] = true;\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-widget-state`] =\n      widgetState;\n  }\n\n  if (dataAttributes) {\n    for (const [key, value] of Object.entries(dataAttributes)) {\n      if (value != null) {\n        const parts = [widgetId, elementId, key]\n          .filter((v) => v != null)\n          .map(fastKebabCase)\n          .join(\"-\");\n        if (parts) {\n          props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-${parts}`] = value;\n        }\n      }\n    }\n  }\n\n  if (elementId) {\n    props[`data-${WIDGETS_DATA_ATTRIBUTE_NAMESPACE}-element`] =\n      fastKebabCase(elementId);\n  }\n\n  return props;\n}\n\n/**\n * Opt for simplicity and performance over capturing edge cases. Input strings\n * are expected to only be alphabetic.\n */\nfunction fastKebabCase(alphaString: string) {\n  return alphaString.replace(/([A-Z])/g, \"-$1\").toLowerCase();\n}\n\nexport function parseUserAgent(userAgent?: string | null) {\n  const browser = Bowser.getParser(userAgent ?? \"\");\n  const browserName = browser.getBrowserName().replace(/^Mobile\\s*/i, \"\");\n  const osName = browser.getOSName();\n  const pretty = [browserName, osName].filter(Boolean).join(\" on \");\n\n  return { pretty, isMobile: browser.getPlatformType() === \"mobile\" };\n}\n\nexport function getUserLocation(\n  location?: {\n    cityName: string;\n    countryISOCode: string;\n  } | null,\n  ipAddress?: string | null,\n) {\n  if (location) {\n    return (\n      [location.cityName, location.countryISOCode].filter(Boolean).join(\", \") ||\n      \"Unknown location\"\n    );\n  }\n\n  if (ipAddress) {\n    return ipAddress;\n  }\n\n  return \"Unknown location\";\n}\n\nexport function unreachable(value: never): never {\n  throw new TypeError(`Unreachable code: ${value}`);\n}\n\nexport function pluralize(word = \"\", amount = 0, showAmount = true): string {\n  return `${showAmount ? `${amount} ` : \"\"}${word}${amount === 1 ? \"\" : \"s\"}`;\n}\n\n// Props that all widgets should accept.\nexport interface WidgetRootDomProps {\n  className?: string;\n}\n\nexport type WidgetRootState = \"loading\" | \"error\" | \"resolved\";\n\n// The API response previously returned an object with the `listMetadata`\n// property where `before` and `after` fields were not strictly required.\ntype Pagination = Nullable<{ before: string; after: string }>;\ntype DeprecatedListMetadataResponse = {\n  listMetadata: Pagination;\n};\ntype NewListMetadataResponse = {\n  list_metadata: Pagination;\n};\n\nexport function getListMetadata<\n  T extends DeprecatedListMetadataResponse | NewListMetadataResponse,\n>(responseObject: T | undefined | null): ListMetadata {\n  const listMetadata =\n    responseObject && \"listMetadata\" in responseObject\n      ? responseObject.listMetadata\n      : responseObject?.list_metadata;\n\n  return {\n    before: listMetadata?.before ?? null,\n    after: listMetadata?.after ?? null,\n  };\n}\n\nexport type Nullable<T> = {\n  [K in keyof T]?: T[K] | null;\n};\n"],"mappings":"AACA,OAAO,YAAY;AACnB,OAAO,QAAQ;AACf;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAGA,MAAM,YAAY,CAAC,EACxB,OAAO,WAAW,eAClB,OAAO,YACP,OAAO,SAAS;AAGX,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AACF,GAA2C;AACzC,SAAO,CAAC,WAAW,QAAQ,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,KAAK;AAC5D;AAEO,SAAS,2BACd,KACA,MACA,SACQ;AACR,QAAM,SAAS,QAAQ,UAAU;AACjC,QAAM,YAAY,IAAI,QAAQ,IAAI,KAAK,QAAQ;AAC/C,QAAM,YAAY,IAAI,KAAK,mBAAmB,QAAQ,EAAE,SAAS,OAAO,CAAC;AAGzE,MAAI,YAAY,KAAQ;AACtB,WAAO,UAAU,OAAO,GAAG,QAAQ;AAAA,EACrC;AAGA,MAAI,YAAY,MAAW;AACzB,UAAM,aAAa,KAAK,MAAM,YAAY,GAAM;AAChD,WAAO,UAAU,OAAO,CAAC,YAAY,QAAQ;AAAA,EAC/C;AAGA,MAAI,YAAY,OAAY;AAC1B,UAAM,aAAa,KAAK,MAAM,YAAY,IAAS;AACnD,WAAO,UAAU,OAAO,CAAC,YAAY,MAAM;AAAA,EAC7C;AAGA,MAAI,YAAY,QAAa;AAC3B,UAAM,aAAa,KAAK,MAAM,YAAY,KAAU;AACpD,WAAO,UAAU,OAAO,CAAC,YAAY,KAAK;AAAA,EAC5C;AAGA,MAAI,YAAY,QAAe;AAC7B,UAAM,aAAa,KAAK,MAAM,YAAY,MAAW;AACrD,WAAO,UAAU,OAAO,CAAC,YAAY,MAAM;AAAA,EAC7C;AAGA,SAAO,KAAK,mBAAmB,QAAQ;AAAA,IACrC,UAAU,QAAQ;AAAA,IAClB,OAAO;AAAA,IACP,KAAK;AAAA;AAAA,IAEL,MAAM,IAAI,YAAY,MAAM,KAAK,YAAY,IAAI,YAAY;AAAA,EAC/D,CAAC;AACH;AAEO,SAAS,aAAa,OAAkD;AAC7E,SAAO,OAAO,UAAU,YAAY,UAAU;AAChD;AAEO,SAAS,YACd,OACwD;AACxD,SAAO,aAAa,KAAK,KAAK,OAAO,MAAM,YAAY;AACzD;AAEO,SAAS,cAAc,OAA+C;AAC3E,SACE,OAAO,UAAU,YACjB,UAAU,QACV,UAAU,SACV,OAAO,MAAM,SAAS;AAE1B;AAEA,eAAsB,mBACpB,UAC8C;AAC9C,MAAI;AACF,UAAM,OAAO,MAAM,SAAS,KAAK;AACjC,QAAI,CAAC,aAAa,IAAI,KAAK,OAAO,KAAK,YAAY,UAAU;AAC3D,aAAO;AAAA,QACL,QAAQ,SAAS;AAAA,QACjB,SAAS,SAAS;AAAA,MACpB;AAAA,IACF;AACA,WAAO;AAAA,MACL,GAAG;AAAA,MACH,QAAQ,SAAS;AAAA,MACjB,SAAS,KAAK,WAAW,SAAS;AAAA,IACpC;AAAA,EACF,QAAQ;AACN,WAAO;AAAA,MACL,QAAQ,SAAS;AAAA,MACjB,SAAS,SAAS;AAAA,IACpB;AAAA,EACF;AACF;AAEO,SAAS,uBACX,YACK;AACR,SAAO,WACJ,OAAO,OAAO,EACd,IAAI,CAAC,cAAc,GAAG,uBAAuB,IAAI,SAAS,EAAE,EAC5D,KAAK,GAAG;AACb;AAgCO,SAAS,YAAY,MAAe;AACzC,MAAI;AAAA,IACF;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,mBAAmB,aACpB,MAAM;AAGL,QACE,cAAc,mBACd,cAAc,qBACd,cAAc,qBACd;AACA,aAAO,oBAAoB,QAAQ;AAAA,IACrC;AAEA,QAAI,cAAc,cAAc;AAC9B,aAAO,oBAAoB,UAAU,aAAa;AAAA,IACpD;AAEA,QACE,cAAc,qBACd,cAAc,uBACd;AACA,aAAO,oBAAoB,WAAW;AAAA,IACxC;AAEA,QAAI,cAAc,aAAa;AAC7B,aAAO,oBAAoB,WAAW,YAAY;AAAA,IACpD;AAEA,WAAO,oBAAoB,cAAc,SAAS,CAAC;AAAA,EACrD,GAAG,IACH;AAEJ,QAAM,QAAkB;AAAA,IACtB,GAAG;AAAA,IACH,WAAW;AAAA,MACT;AAAA,MACA,gBAAgB,oBAAoB,QAAQ;AAAA,MAC5C;AAAA,IACF;AAAA,EACF;AAEA,MAAI,UAAU;AACZ,UAAM,QAAQ,gCAAgC,YAAY,IAAI;AAAA,EAChE;AAEA,MAAI,cAAc;AAChB,oBAAgB;AAChB,UAAM,QAAQ,gCAAgC,SAAS,IAAI;AAC3D,UAAM,QAAQ,gCAAgC,eAAe,IAC3D;AAAA,EACJ;AAEA,MAAI,gBAAgB;AAClB,eAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,cAAc,GAAG;AACzD,UAAI,SAAS,MAAM;AACjB,cAAM,QAAQ,CAAC,UAAU,WAAW,GAAG,EACpC,OAAO,CAAC,MAAM,KAAK,IAAI,EACvB,IAAI,aAAa,EACjB,KAAK,GAAG;AACX,YAAI,OAAO;AACT,gBAAM,QAAQ,gCAAgC,IAAI,KAAK,EAAE,IAAI;AAAA,QAC/D;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,MAAI,WAAW;AACb,UAAM,QAAQ,gCAAgC,UAAU,IACtD,cAAc,SAAS;AAAA,EAC3B;AAEA,SAAO;AACT;AAMA,SAAS,cAAc,aAAqB;AAC1C,SAAO,YAAY,QAAQ,YAAY,KAAK,EAAE,YAAY;AAC5D;AAEO,SAAS,eAAe,WAA2B;AACxD,QAAM,UAAU,OAAO,UAAU,aAAa,EAAE;AAChD,QAAM,cAAc,QAAQ,eAAe,EAAE,QAAQ,eAAe,EAAE;AACtE,QAAM,SAAS,QAAQ,UAAU;AACjC,QAAM,SAAS,CAAC,aAAa,MAAM,EAAE,OAAO,OAAO,EAAE,KAAK,MAAM;AAEhE,SAAO,EAAE,QAAQ,UAAU,QAAQ,gBAAgB,MAAM,SAAS;AACpE;AAEO,SAAS,gBACd,UAIA,WACA;AACA,MAAI,UAAU;AACZ,WACE,CAAC,SAAS,UAAU,SAAS,cAAc,EAAE,OAAO,OAAO,EAAE,KAAK,IAAI,KACtE;AAAA,EAEJ;AAEA,MAAI,WAAW;AACb,WAAO;AAAA,EACT;AAEA,SAAO;AACT;AAEO,SAAS,YAAY,OAAqB;AAC/C,QAAM,IAAI,UAAU,qBAAqB,KAAK,EAAE;AAClD;AAEO,SAAS,UAAU,OAAO,IAAI,SAAS,GAAG,aAAa,MAAc;AAC1E,SAAO,GAAG,aAAa,GAAG,MAAM,MAAM,EAAE,GAAG,IAAI,GAAG,WAAW,IAAI,KAAK,GAAG;AAC3E;AAmBO,SAAS,gBAEd,gBAAoD;AACpD,QAAM,eACJ,kBAAkB,kBAAkB,iBAChC,eAAe,eACf,gBAAgB;AAEtB,SAAO;AAAA,IACL,QAAQ,cAAc,UAAU;AAAA,IAChC,OAAO,cAAc,SAAS;AAAA,EAChC;AACF;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workos-inc/widgets",
-  "version": "1.8.2",
+  "version": "1.9.0",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -95,8 +95,8 @@
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
     "use-debounce": "^10.1.0",
-    "@repo/eslint-config": "0.0.0",
-    "@repo/typescript-config": "0.0.0"
+    "@repo/typescript-config": "0.0.0",
+    "@repo/eslint-config": "0.0.0"
   },
   "peerDependenciesMeta": {
     "swr": {