@workos-inc/widgets 1.8.0 → 1.8.2

package/dist/esm/lib/organization-switcher.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/organization-switcher.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon } from \"@radix-ui/react-icons\";\nimport {\n  Box,\n  ChevronDownIcon,\n  Flex,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport type { OrganizationInfo } from \"../api/endpoint.js\";\nimport cx from \"clsx\";\nimport {\n  getDomProps,\n  isPromiseLike,\n  type WidgetRootDomProps,\n  type WidgetRootState,\n} from \"./utils.js\";\nimport { getErrorMessage } from \"./generic-error.js\";\nimport {\n  Button,\n  type ButtonProps,\n  Skeleton,\n  DropdownMenu,\n} from \"./elements.js\";\nimport { unstable_useWidgetsInvalidator as useWidgetsInvalidator } from \"../utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype OrganizationSwitcherVariant = \"ghost\" | \"outline\";\n\n// Rename all uses of `org` to `organization`\ninterface OrganizationSwitcherPassthroughProps extends WidgetRootDomProps {\n  switchToOrganization: ({\n    organizationId,\n  }: {\n    organizationId: string;\n  }) => void | Promise<void>;\n  // Simple props to affect the overall style\n  variant?: OrganizationSwitcherVariant;\n  organizationLabel?: string | null;\n  children?: React.ReactNode;\n  /**\n   * Choose where to truncate organization name in the trigger and dropdown\n   * items.\n   *\n   * - `right`: Truncate the right side of the organization name\n   * - `middle`: Truncate the middle of the organization name, trying to keep\n   *  words whole\n   */\n  truncateBehavior?: \"right\" | \"middle\";\n}\n\ninterface OrganizationSwitcherProps\n  extends OrganizationSwitcherPassthroughProps {\n  organizations: OrganizationInfo[];\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  organizations,\n  switchToOrganization,\n  variant,\n  organizationLabel = \"Organizations\",\n  truncateBehavior = \"right\",\n  children,\n  ...domProps\n}) => {\n  const currentOrganization = organizations.find(\n    (organization) => organization.current,\n  );\n  const invalidateAllWidgets = useWidgetsInvalidator();\n\n  // TODO: Possible if the user has no organizations - we should figure out what\n  // to do in this case\n  if (!currentOrganization) {\n    return null;\n  }\n\n  return (\n    <DropdownMenu.Root>\n      <DropdownMenu.Trigger>\n        <Button\n          variant=\"secondary\"\n          {...mapVariantProps(variant)}\n          {...getWidgetRootDomProps(\"resolved\", {\n            ...domProps,\n            // TODO: Remove `OrganizationSwitcherTrigger` in the next major\n            // version. This should follow conventions of all other widgets\n            // using classnames in getWidgetRootDomProps.\n            className: cx(domProps.className, \"OrganizationSwitcherTrigger\"),\n          })}\n        >\n          <Flex\n            align=\"center\"\n            justify=\"between\"\n            gap=\"2\"\n            flexGrow=\"1\"\n            overflow=\"hidden\"\n            minWidth=\"0\"\n          >\n            <TruncatedOrganizationName\n              organizationName={currentOrganization.name}\n              truncateBehavior={truncateBehavior}\n            />\n            <Flex asChild flexShrink=\"0\">\n              <DropdownMenu.TriggerIcon />\n            </Flex>\n          </Flex>\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content>\n        <DropdownMenu.Group>\n          {organizationLabel ? (\n            <DropdownMenu.Label>\n              <Text>{organizationLabel}</Text>\n            </DropdownMenu.Label>\n          ) : null}\n          {organizations.map((organization) => (\n            <Flex\n              key={organization.id}\n              asChild\n              pr=\"2\"\n              maxWidth=\"280px\"\n              minWidth=\"180px\"\n            >\n              <DropdownMenu.Item\n                onClick={() => {\n                  if (organization.id !== currentOrganization.id) {\n                    const result = switchToOrganization({\n                      organizationId: organization.id,\n                    });\n                    if (isPromiseLike(result)) {\n                      result.then(invalidateAllWidgets);\n                    } else {\n                      invalidateAllWidgets();\n                    }\n                  }\n                }}\n              >\n                <Flex\n                  justify=\"between\"\n                  align=\"center\"\n                  gap=\"4\"\n                  flexGrow=\"1\"\n                  overflow=\"hidden\"\n                >\n                  <TruncatedOrganizationName\n                    organizationName={organization.name}\n                    truncateBehavior={truncateBehavior}\n                  />\n                  {organization.current && (\n                    <VisuallyHidden>\n                      <Translation\n                        defaultMessage=\"(current)\"\n                        id=\"daFXTP\"\n                        description=\"Label for screen readers indicating current organization\"\n                      />\n                    </VisuallyHidden>\n                  )}\n                  <Flex\n                    aria-hidden\n                    align=\"center\"\n                    justify=\"center\"\n                    flexShrink=\"0\"\n                  >\n                    {organization.current ? (\n                      <CheckIcon width=\"18px\" height=\"18px\" />\n                    ) : (\n                      // make the extra space for\n                      <Box width=\"18px\" height=\"18px\" />\n                    )}\n                  </Flex>\n                </Flex>\n              </DropdownMenu.Item>\n            </Flex>\n          ))}\n        </DropdownMenu.Group>\n        {children}\n      </DropdownMenu.Content>\n    </DropdownMenu.Root>\n  );\n};\n\ninterface OrganizationSwitcherLoadingProps extends WidgetRootDomProps {\n  variant?: OrganizationSwitcherVariant;\n}\n\nconst OrganizationSwitcherLoading: React.FC<\n  OrganizationSwitcherLoadingProps\n> = ({ variant, ...props }: OrganizationSwitcherLoadingProps) => {\n  return (\n    // Always need DropdownMenu.Root to wrap children than may include\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Skeleton>\n          {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n          <Text>Loading...</Text>\n        </Skeleton>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n};\n\ninterface OrganizationSwitcherErrorProps extends WidgetRootDomProps {\n  error: unknown;\n  variant?: OrganizationSwitcherVariant;\n}\n\nfunction OrganizationSwitcherError({\n  error,\n  variant,\n  ...domProps\n}: OrganizationSwitcherErrorProps) {\n  const translate = useTranslation();\n  const { heading } = getErrorMessage(error, translate);\n\n  return (\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Text>{heading}</Text>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n}\n\nconst MAX_TRUNCATED_SUFFIX_LENGTH = 10;\nconst MIN_TRUNCATED_SUFFIX_LENGTH = 3;\n\nconst WHITE_SPACE_REGEX = /\\s/;\n\nconst getSplitPosition = (organizationName: string) => {\n  if (organizationName.length <= MAX_TRUNCATED_SUFFIX_LENGTH) {\n    return organizationName.length;\n  }\n\n  for (\n    let i = organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n    i < organizationName.length - MIN_TRUNCATED_SUFFIX_LENGTH;\n    i++\n  ) {\n    if (WHITE_SPACE_REGEX.test(organizationName[i - 1])) {\n      return i;\n    }\n  }\n\n  return organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n};\n\nconst splitOrganizationName = (organizationName: string) => {\n  const splitPosition = getSplitPosition(organizationName);\n  return [\n    organizationName.slice(0, splitPosition),\n    organizationName.slice(splitPosition),\n  ];\n};\n\nconst TruncatedOrganizationName = ({\n  organizationName,\n  truncateBehavior,\n}: {\n  organizationName: string;\n  truncateBehavior: \"right\" | \"middle\";\n}) => {\n  if (truncateBehavior === \"right\") {\n    return <Text truncate>{organizationName}</Text>;\n  }\n\n  const [organizationNameLeft, organizationNameRight] =\n    splitOrganizationName(organizationName);\n\n  return (\n    <Flex overflow=\"hidden\">\n      <VisuallyHidden>\n        <Text>{organizationName}</Text>\n      </VisuallyHidden>\n      <Text aria-hidden truncate style={{ whiteSpace: \"pre\" }}>\n        {organizationNameLeft}\n      </Text>\n      <Text aria-hidden>{organizationNameRight}</Text>\n    </Flex>\n  );\n};\n\nfunction mapVariantProps(variant?: OrganizationSwitcherVariant): ButtonProps {\n  const variantProps: ButtonProps = {};\n  // Passing `undefined` to the variant prop will result in overrides to props we\n  // set internally. This should be addressed in Radix Themes, but we can\n  // explicitly set it only when it's provided and _not_ undefined.\n  if (variant) {\n    variantProps.unsafe_radixVariant = variant;\n  }\n  return variantProps;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"organization-switcher\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n  /** @internal */\n  OrganizationSwitcherPassthroughProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/organization-switcher.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon } from \"@radix-ui/react-icons\";\nimport {\n  Box,\n  ChevronDownIcon,\n  Flex,\n  Text,\n  VisuallyHidden,\n} from \"@radix-ui/themes\";\nimport type { OrganizationInfo } from \"../api/endpoint.js\";\nimport cx from \"clsx\";\nimport {\n  getDomProps,\n  isPromiseLike,\n  type WidgetRootDomProps,\n  type WidgetRootState,\n} from \"./utils.js\";\nimport { getErrorMessage } from \"./generic-error.js\";\nimport {\n  Button,\n  type ButtonProps,\n  Skeleton,\n  DropdownMenu,\n} from \"./elements.js\";\nimport { unstable_useWidgetsInvalidator as useWidgetsInvalidator } from \"../utils.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype OrganizationSwitcherVariant = \"ghost\" | \"outline\";\n\n// Rename all uses of `org` to `organization`\ninterface OrganizationSwitcherPassthroughProps extends WidgetRootDomProps {\n  switchToOrganization: ({\n    organizationId,\n  }: {\n    organizationId: string;\n  }) => void | Promise<void>;\n  // Simple props to affect the overall style\n  variant?: OrganizationSwitcherVariant;\n  organizationLabel?: string | null;\n  children?: React.ReactNode;\n  /**\n   * Choose where to truncate organization name in the trigger and dropdown\n   * items.\n   *\n   * - `right`: Truncate the right side of the organization name\n   * - `middle`: Truncate the middle of the organization name, trying to keep\n   *  words whole\n   */\n  truncateBehavior?: \"right\" | \"middle\";\n}\n\ninterface OrganizationSwitcherProps extends OrganizationSwitcherPassthroughProps {\n  organizations: OrganizationInfo[];\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  organizations,\n  switchToOrganization,\n  variant,\n  organizationLabel = \"Organizations\",\n  truncateBehavior = \"right\",\n  children,\n  ...domProps\n}) => {\n  const currentOrganization = organizations.find(\n    (organization) => organization.current,\n  );\n  const invalidateAllWidgets = useWidgetsInvalidator();\n\n  // TODO: Possible if the user has no organizations - we should figure out what\n  // to do in this case\n  if (!currentOrganization) {\n    return null;\n  }\n\n  return (\n    <DropdownMenu.Root>\n      <DropdownMenu.Trigger>\n        <Button\n          variant=\"secondary\"\n          {...mapVariantProps(variant)}\n          {...getWidgetRootDomProps(\"resolved\", {\n            ...domProps,\n            // TODO: Remove `OrganizationSwitcherTrigger` in the next major\n            // version. This should follow conventions of all other widgets\n            // using classnames in getWidgetRootDomProps.\n            className: cx(domProps.className, \"OrganizationSwitcherTrigger\"),\n          })}\n        >\n          <Flex\n            align=\"center\"\n            justify=\"between\"\n            gap=\"2\"\n            flexGrow=\"1\"\n            overflow=\"hidden\"\n            minWidth=\"0\"\n          >\n            <TruncatedOrganizationName\n              organizationName={currentOrganization.name}\n              truncateBehavior={truncateBehavior}\n            />\n            <Flex asChild flexShrink=\"0\">\n              <DropdownMenu.TriggerIcon />\n            </Flex>\n          </Flex>\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content>\n        <DropdownMenu.Group>\n          {organizationLabel ? (\n            <DropdownMenu.Label>\n              <Text>{organizationLabel}</Text>\n            </DropdownMenu.Label>\n          ) : null}\n          {organizations.map((organization) => (\n            <Flex\n              key={organization.id}\n              asChild\n              pr=\"2\"\n              maxWidth=\"280px\"\n              minWidth=\"180px\"\n            >\n              <DropdownMenu.Item\n                onClick={() => {\n                  if (organization.id !== currentOrganization.id) {\n                    const result = switchToOrganization({\n                      organizationId: organization.id,\n                    });\n                    if (isPromiseLike(result)) {\n                      result.then(invalidateAllWidgets);\n                    } else {\n                      invalidateAllWidgets();\n                    }\n                  }\n                }}\n              >\n                <Flex\n                  justify=\"between\"\n                  align=\"center\"\n                  gap=\"4\"\n                  flexGrow=\"1\"\n                  overflow=\"hidden\"\n                >\n                  <TruncatedOrganizationName\n                    organizationName={organization.name}\n                    truncateBehavior={truncateBehavior}\n                  />\n                  {organization.current && (\n                    <VisuallyHidden>\n                      <Translation\n                        defaultMessage=\"(current)\"\n                        id=\"daFXTP\"\n                        description=\"Label for screen readers indicating current organization\"\n                      />\n                    </VisuallyHidden>\n                  )}\n                  <Flex\n                    aria-hidden\n                    align=\"center\"\n                    justify=\"center\"\n                    flexShrink=\"0\"\n                  >\n                    {organization.current ? (\n                      <CheckIcon width=\"18px\" height=\"18px\" />\n                    ) : (\n                      // make the extra space for\n                      <Box width=\"18px\" height=\"18px\" />\n                    )}\n                  </Flex>\n                </Flex>\n              </DropdownMenu.Item>\n            </Flex>\n          ))}\n        </DropdownMenu.Group>\n        {children}\n      </DropdownMenu.Content>\n    </DropdownMenu.Root>\n  );\n};\n\ninterface OrganizationSwitcherLoadingProps extends WidgetRootDomProps {\n  variant?: OrganizationSwitcherVariant;\n}\n\nconst OrganizationSwitcherLoading: React.FC<\n  OrganizationSwitcherLoadingProps\n> = ({ variant, ...props }: OrganizationSwitcherLoadingProps) => {\n  return (\n    // Always need DropdownMenu.Root to wrap children than may include\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"loading\", props)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Skeleton>\n          {/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}\n          <Text>Loading...</Text>\n        </Skeleton>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n};\n\ninterface OrganizationSwitcherErrorProps extends WidgetRootDomProps {\n  error: unknown;\n  variant?: OrganizationSwitcherVariant;\n}\n\nfunction OrganizationSwitcherError({\n  error,\n  variant,\n  ...domProps\n}: OrganizationSwitcherErrorProps) {\n  const translate = useTranslation();\n  const { heading } = getErrorMessage(error, translate);\n\n  return (\n    <Button\n      variant=\"secondary\"\n      disabled\n      {...mapVariantProps(variant)}\n      {...getWidgetRootDomProps(\"error\", domProps)}\n    >\n      <Flex align=\"center\" gap=\"2\">\n        <Text>{heading}</Text>\n        <ChevronDownIcon />\n      </Flex>\n    </Button>\n  );\n}\n\nconst MAX_TRUNCATED_SUFFIX_LENGTH = 10;\nconst MIN_TRUNCATED_SUFFIX_LENGTH = 3;\n\nconst WHITE_SPACE_REGEX = /\\s/;\n\nconst getSplitPosition = (organizationName: string) => {\n  if (organizationName.length <= MAX_TRUNCATED_SUFFIX_LENGTH) {\n    return organizationName.length;\n  }\n\n  for (\n    let i = organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n    i < organizationName.length - MIN_TRUNCATED_SUFFIX_LENGTH;\n    i++\n  ) {\n    if (WHITE_SPACE_REGEX.test(organizationName[i - 1])) {\n      return i;\n    }\n  }\n\n  return organizationName.length - MAX_TRUNCATED_SUFFIX_LENGTH;\n};\n\nconst splitOrganizationName = (organizationName: string) => {\n  const splitPosition = getSplitPosition(organizationName);\n  return [\n    organizationName.slice(0, splitPosition),\n    organizationName.slice(splitPosition),\n  ];\n};\n\nconst TruncatedOrganizationName = ({\n  organizationName,\n  truncateBehavior,\n}: {\n  organizationName: string;\n  truncateBehavior: \"right\" | \"middle\";\n}) => {\n  if (truncateBehavior === \"right\") {\n    return <Text truncate>{organizationName}</Text>;\n  }\n\n  const [organizationNameLeft, organizationNameRight] =\n    splitOrganizationName(organizationName);\n\n  return (\n    <Flex overflow=\"hidden\">\n      <VisuallyHidden>\n        <Text>{organizationName}</Text>\n      </VisuallyHidden>\n      <Text aria-hidden truncate style={{ whiteSpace: \"pre\" }}>\n        {organizationNameLeft}\n      </Text>\n      <Text aria-hidden>{organizationNameRight}</Text>\n    </Flex>\n  );\n};\n\nfunction mapVariantProps(variant?: OrganizationSwitcherVariant): ButtonProps {\n  const variantProps: ButtonProps = {};\n  // Passing `undefined` to the variant prop will result in overrides to props we\n  // set internally. This should be addressed in Radix Themes, but we can\n  // explicitly set it only when it's provided and _not_ undefined.\n  if (variant) {\n    variantProps.unsafe_radixVariant = variant;\n  }\n  return variantProps;\n}\n\nfunction getWidgetRootDomProps(\n  state: WidgetRootState,\n  domProps: WidgetRootDomProps,\n) {\n  return getDomProps({\n    ...domProps,\n    isWidgetRoot: true,\n    widgetId: \"organization-switcher\",\n    widgetState: state,\n  });\n}\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n  /** @internal */\n  OrganizationSwitcherPassthroughProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":"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","names":[]}

package/dist/esm/lib/otp-input.js

@@ -1,8 +1,11 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { composeRefs, useComposedRefs } from "@radix-ui/react-compose-refs";
-import { useControllableState } from "@radix-ui/react-use-controllable-state";
-import * as Form from "@radix-ui/react-form";
+import {
+  composeRefs,
+  useComposedRefs,
+  useControllableState
+} from "radix-ui/internal";
+import { Form } from "radix-ui";
 import { Grid } from "@radix-ui/themes";
 import * as React from "react";
 import { TextField } from "./elements.js";

package/dist/esm/lib/otp-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/otp-input.tsx"],"sourcesContent":["\"use client\";\n\nimport { composeRefs, useComposedRefs } from \"@radix-ui/react-compose-refs\";\nimport { useControllableState } from \"@radix-ui/react-use-controllable-state\";\nimport * as Form from \"@radix-ui/react-form\";\nimport { Grid } from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { TextField } from \"./elements.js\";\n\ninterface OptContextType {\n  value: string[];\n  readOnly?: boolean;\n  state?: \"valid\" | \"invalid\";\n  onEnterPressed: () => void;\n  onChildAdd: (input: HTMLInputElement) => void;\n  onCharChange: (char: string, index: number) => void;\n  allChildrenAdded: boolean;\n}\n\nconst OtpContext = React.createContext<OptContextType | undefined>(undefined);\n\ntype OtpRootProps = React.ComponentPropsWithoutRef<typeof Grid> & {\n  onValueChange?: (value: string) => void;\n  id?: string;\n  name?: string;\n  readOnly?: boolean;\n  state?: \"valid\" | \"invalid\";\n  value?: string;\n  defaultValue?: string;\n  autoSubmit?: boolean;\n};\n\nexport const Root = React.forwardRef<HTMLInputElement, OtpRootProps>(\n  function Root(\n    {\n      name,\n      id,\n      defaultValue,\n      value: valueProp,\n      onValueChange,\n      autoSubmit,\n      children,\n      readOnly,\n      state,\n      ...gridProps\n    },\n    forwardedRef,\n  ) {\n    const [lastCharIndex, setLastCharIndex] = React.useState<number>(0);\n    const [allChildrenAdded, setAllChildrenAdded] =\n      React.useState<boolean>(false);\n    const childCount = React.Children.count(children);\n\n    const [value, setValue] = useControllableState({\n      prop: getValueAsArray(valueProp, childCount),\n      defaultProp: getValueAsArray(defaultValue, childCount) ?? [],\n      onChange: (value) => onValueChange?.(value.join(\"\")),\n    });\n\n    const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n    const childrenRefs = React.useRef<HTMLInputElement[]>([]);\n\n    const attemptAutoSubmit = React.useCallback(\n      (enterPressed = false) => {\n        if (\n          autoSubmit &&\n          value &&\n          value.every((char) => char !== \"\") &&\n          (enterPressed || lastCharIndex + 1 === childCount)\n        ) {\n          hiddenInputRef.current?.form?.requestSubmit();\n        }\n      },\n      [value, childCount, lastCharIndex, autoSubmit],\n    );\n\n    const handleEnterPressed = React.useCallback(\n      () => attemptAutoSubmit(true),\n      [attemptAutoSubmit],\n    );\n\n    const handleChildAdd = React.useCallback(\n      (input: HTMLInputElement) => {\n        if (input) {\n          input.dataset.index = `${childrenRefs.current.length}`;\n          childrenRefs.current.push(input);\n        } else {\n          childrenRefs.current.pop();\n        }\n\n        if (childrenRefs.current.length === childCount) {\n          setAllChildrenAdded(true);\n        }\n      },\n      [childCount],\n    );\n\n    const handleCharChange = React.useCallback(\n      (char: string, index: number) => {\n        setValue((previousValue) => {\n          const arrayToCopy = previousValue ?? createEmptyArray(childCount);\n          const newValue = [...arrayToCopy];\n          newValue[index] = char;\n          return newValue;\n        });\n        setLastCharIndex(index);\n      },\n      [childCount, setValue],\n    );\n\n    const otpContext = React.useMemo(\n      () => ({\n        value: value ?? createEmptyArray(childCount),\n        readOnly,\n        state,\n        allChildrenAdded,\n        onEnterPressed: handleEnterPressed,\n        onChildAdd: handleChildAdd,\n        onCharChange: handleCharChange,\n      }),\n      [\n        value,\n        allChildrenAdded,\n        readOnly,\n        state,\n        childCount,\n        handleEnterPressed,\n        handleChildAdd,\n        handleCharChange,\n      ],\n    );\n\n    React.useEffect(attemptAutoSubmit, [attemptAutoSubmit]);\n\n    return (\n      <OtpContext.Provider value={otpContext}>\n        <Grid\n          columns={`repeat(${childCount}, 1fr)`}\n          {...gridProps}\n          onPaste={(event: React.ClipboardEvent<HTMLDivElement>) => {\n            event.preventDefault();\n            const pastedValue = event.clipboardData.getData(\"Text\");\n            const sanitizedValue = pastedValue\n              .replace(/[^\\d]/g, \"\")\n              .slice(0, childCount);\n            const value = sanitizedValue\n              .padEnd(childCount, \"#\")\n              .split(\"\")\n              .map((char) => (char === \"#\" ? \"\" : char));\n\n            setValue(value);\n            setLastCharIndex(sanitizedValue.length - 1);\n\n            const index = Math.min(sanitizedValue.length, childCount - 1);\n            childrenRefs.current?.[index]?.focus();\n          }}\n        >\n          {children}\n          <input\n            ref={composeRefs(forwardedRef, hiddenInputRef)}\n            defaultValue={value?.join(\"\")}\n            minLength={childCount}\n            name={name}\n            type=\"hidden\"\n          />\n        </Grid>\n      </OtpContext.Provider>\n    );\n  },\n);\n\ninterface InputProps extends React.ComponentProps<typeof TextField> {\n  autoComplete?: \"one-time-code\" | \"off\";\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  function Input(\n    { style, readOnly, autoComplete = \"off\", ...props },\n    forwardedRef,\n  ) {\n    const otpContext = useOptContext();\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const composedInputRef = useComposedRefs(\n      forwardedRef,\n      inputRef,\n      otpContext.onChildAdd,\n    );\n\n    // FIXME: This should be refactored\n    // eslint-disable-next-line react-hooks/refs\n    const index = Number(inputRef.current?.dataset.index ?? -1);\n    const char = otpContext.value[index] ?? \"\";\n\n    return (\n      <Form.Field name={`otp-${index}`} asChild>\n        <Form.Control asChild>\n          <TextField\n            ref={composedInputRef}\n            autoComplete={index === 0 ? autoComplete : \"off\"}\n            color={otpContext.state === \"invalid\" ? \"red\" : undefined}\n            inputMode=\"numeric\"\n            maxLength={1}\n            pattern=\"\\d{1}\"\n            readOnly={readOnly ?? otpContext.readOnly}\n            size=\"3\"\n            value={char}\n            variant={otpContext.state === \"invalid\" ? \"soft\" : undefined}\n            style={{\n              ...style,\n              height: \"auto\",\n              \"--text-field-padding\": 0,\n              textAlign: \"center\",\n            }}\n            onChange={(event) => {\n              // Only update the value if it matches the input pattern (number only)\n              if (event.target.validity.valid) {\n                const char = event.target.value;\n                const index = Number(event.target.dataset.index ?? -1);\n                otpContext.onCharChange(char, index);\n                if (char !== \"\") {\n                  focusSibling(event.currentTarget, { back: char === \"\" });\n                }\n              }\n            }}\n            onKeyDown={(event) => {\n              if (event.key === \"ArrowLeft\") {\n                focusSibling(event.currentTarget, { back: true });\n                event.preventDefault();\n              } else if (event.key === \"ArrowRight\") {\n                focusSibling(event.currentTarget);\n                event.preventDefault();\n              } else if (event.key === \"Backspace\" && char === \"\") {\n                focusSibling(event.currentTarget, { back: true });\n              } else if (event.key === \"Enter\" && char !== \"\") {\n                otpContext.onEnterPressed();\n              }\n            }}\n            {...props}\n          />\n        </Form.Control>\n      </Form.Field>\n    );\n  },\n);\n\nconst useOptContext = () => {\n  const optContext = React.useContext(OtpContext);\n\n  if (!optContext) {\n    throw new Error(\n      \"OtpInput compound components cannot be rendered outside the OtpRoot component\",\n    );\n  }\n\n  return optContext;\n};\n\nfunction focusSibling(input: HTMLInputElement, { back = false } = {}) {\n  const sibling = back\n    ? input.parentElement?.previousSibling\n    : input.parentElement?.nextSibling;\n  const siblingInput = sibling?.firstChild;\n  if (siblingInput && siblingInput instanceof HTMLInputElement) {\n    siblingInput?.focus();\n    siblingInput?.select();\n  }\n}\n\nconst getValueAsArray = (value: string | undefined, length: number) => {\n  if (!value) {\n    return undefined;\n  }\n\n  return createEmptyArray(length).map((_, index) => value?.[index] ?? \"\");\n};\n\nconst createEmptyArray = (length: number): string[] =>\n  Array.from<string>({ length }).fill(\"\");\n"],"mappings":"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","names":["Root","value","Input","char","index"]}
+{"version":3,"sources":["../../../src/lib/otp-input.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  composeRefs,\n  useComposedRefs,\n  useControllableState,\n} from \"radix-ui/internal\";\nimport { Form } from \"radix-ui\";\nimport { Grid } from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { TextField } from \"./elements.js\";\n\ninterface OptContextType {\n  value: string[];\n  readOnly?: boolean;\n  state?: \"valid\" | \"invalid\";\n  onEnterPressed: () => void;\n  onChildAdd: (input: HTMLInputElement) => void;\n  onCharChange: (char: string, index: number) => void;\n  allChildrenAdded: boolean;\n}\n\nconst OtpContext = React.createContext<OptContextType | undefined>(undefined);\n\ntype OtpRootProps = React.ComponentPropsWithoutRef<typeof Grid> & {\n  onValueChange?: (value: string) => void;\n  id?: string;\n  name?: string;\n  readOnly?: boolean;\n  state?: \"valid\" | \"invalid\";\n  value?: string;\n  defaultValue?: string;\n  autoSubmit?: boolean;\n};\n\nexport const Root = React.forwardRef<HTMLInputElement, OtpRootProps>(\n  function Root(\n    {\n      name,\n      id,\n      defaultValue,\n      value: valueProp,\n      onValueChange,\n      autoSubmit,\n      children,\n      readOnly,\n      state,\n      ...gridProps\n    },\n    forwardedRef,\n  ) {\n    const [lastCharIndex, setLastCharIndex] = React.useState<number>(0);\n    const [allChildrenAdded, setAllChildrenAdded] =\n      React.useState<boolean>(false);\n    const childCount = React.Children.count(children);\n\n    const [value, setValue] = useControllableState({\n      prop: getValueAsArray(valueProp, childCount),\n      defaultProp: getValueAsArray(defaultValue, childCount) ?? [],\n      onChange: (value) => onValueChange?.(value.join(\"\")),\n    });\n\n    const hiddenInputRef = React.useRef<HTMLInputElement>(null);\n    const childrenRefs = React.useRef<HTMLInputElement[]>([]);\n\n    const attemptAutoSubmit = React.useCallback(\n      (enterPressed = false) => {\n        if (\n          autoSubmit &&\n          value &&\n          value.every((char) => char !== \"\") &&\n          (enterPressed || lastCharIndex + 1 === childCount)\n        ) {\n          hiddenInputRef.current?.form?.requestSubmit();\n        }\n      },\n      [value, childCount, lastCharIndex, autoSubmit],\n    );\n\n    const handleEnterPressed = React.useCallback(\n      () => attemptAutoSubmit(true),\n      [attemptAutoSubmit],\n    );\n\n    const handleChildAdd = React.useCallback(\n      (input: HTMLInputElement) => {\n        if (input) {\n          input.dataset.index = `${childrenRefs.current.length}`;\n          childrenRefs.current.push(input);\n        } else {\n          childrenRefs.current.pop();\n        }\n\n        if (childrenRefs.current.length === childCount) {\n          setAllChildrenAdded(true);\n        }\n      },\n      [childCount],\n    );\n\n    const handleCharChange = React.useCallback(\n      (char: string, index: number) => {\n        setValue((previousValue) => {\n          const arrayToCopy = previousValue ?? createEmptyArray(childCount);\n          const newValue = [...arrayToCopy];\n          newValue[index] = char;\n          return newValue;\n        });\n        setLastCharIndex(index);\n      },\n      [childCount, setValue],\n    );\n\n    const otpContext = React.useMemo(\n      () => ({\n        value: value ?? createEmptyArray(childCount),\n        readOnly,\n        state,\n        allChildrenAdded,\n        onEnterPressed: handleEnterPressed,\n        onChildAdd: handleChildAdd,\n        onCharChange: handleCharChange,\n      }),\n      [\n        value,\n        allChildrenAdded,\n        readOnly,\n        state,\n        childCount,\n        handleEnterPressed,\n        handleChildAdd,\n        handleCharChange,\n      ],\n    );\n\n    React.useEffect(attemptAutoSubmit, [attemptAutoSubmit]);\n\n    return (\n      <OtpContext.Provider value={otpContext}>\n        <Grid\n          columns={`repeat(${childCount}, 1fr)`}\n          {...gridProps}\n          onPaste={(event: React.ClipboardEvent<HTMLDivElement>) => {\n            event.preventDefault();\n            const pastedValue = event.clipboardData.getData(\"Text\");\n            const sanitizedValue = pastedValue\n              .replace(/[^\\d]/g, \"\")\n              .slice(0, childCount);\n            const value = sanitizedValue\n              .padEnd(childCount, \"#\")\n              .split(\"\")\n              .map((char) => (char === \"#\" ? \"\" : char));\n\n            setValue(value);\n            setLastCharIndex(sanitizedValue.length - 1);\n\n            const index = Math.min(sanitizedValue.length, childCount - 1);\n            childrenRefs.current?.[index]?.focus();\n          }}\n        >\n          {children}\n          <input\n            ref={composeRefs(forwardedRef, hiddenInputRef)}\n            defaultValue={value?.join(\"\")}\n            minLength={childCount}\n            name={name}\n            type=\"hidden\"\n          />\n        </Grid>\n      </OtpContext.Provider>\n    );\n  },\n);\n\ninterface InputProps extends React.ComponentProps<typeof TextField> {\n  autoComplete?: \"one-time-code\" | \"off\";\n}\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n  function Input(\n    { style, readOnly, autoComplete = \"off\", ...props },\n    forwardedRef,\n  ) {\n    const otpContext = useOptContext();\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const composedInputRef = useComposedRefs(\n      forwardedRef,\n      inputRef,\n      otpContext.onChildAdd,\n    );\n\n    // FIXME: This should be refactored\n    // eslint-disable-next-line react-hooks/refs\n    const index = Number(inputRef.current?.dataset.index ?? -1);\n    const char = otpContext.value[index] ?? \"\";\n\n    return (\n      <Form.Field name={`otp-${index}`} asChild>\n        <Form.Control asChild>\n          <TextField\n            ref={composedInputRef}\n            autoComplete={index === 0 ? autoComplete : \"off\"}\n            color={otpContext.state === \"invalid\" ? \"red\" : undefined}\n            inputMode=\"numeric\"\n            maxLength={1}\n            pattern=\"\\d{1}\"\n            readOnly={readOnly ?? otpContext.readOnly}\n            size=\"3\"\n            value={char}\n            variant={otpContext.state === \"invalid\" ? \"soft\" : undefined}\n            style={{\n              ...style,\n              height: \"auto\",\n              \"--text-field-padding\": 0,\n              textAlign: \"center\",\n            }}\n            onChange={(event) => {\n              // Only update the value if it matches the input pattern (number only)\n              if (event.target.validity.valid) {\n                const char = event.target.value;\n                const index = Number(event.target.dataset.index ?? -1);\n                otpContext.onCharChange(char, index);\n                if (char !== \"\") {\n                  focusSibling(event.currentTarget, { back: char === \"\" });\n                }\n              }\n            }}\n            onKeyDown={(event) => {\n              if (event.key === \"ArrowLeft\") {\n                focusSibling(event.currentTarget, { back: true });\n                event.preventDefault();\n              } else if (event.key === \"ArrowRight\") {\n                focusSibling(event.currentTarget);\n                event.preventDefault();\n              } else if (event.key === \"Backspace\" && char === \"\") {\n                focusSibling(event.currentTarget, { back: true });\n              } else if (event.key === \"Enter\" && char !== \"\") {\n                otpContext.onEnterPressed();\n              }\n            }}\n            {...props}\n          />\n        </Form.Control>\n      </Form.Field>\n    );\n  },\n);\n\nconst useOptContext = () => {\n  const optContext = React.useContext(OtpContext);\n\n  if (!optContext) {\n    throw new Error(\n      \"OtpInput compound components cannot be rendered outside the OtpRoot component\",\n    );\n  }\n\n  return optContext;\n};\n\nfunction focusSibling(input: HTMLInputElement, { back = false } = {}) {\n  const sibling = back\n    ? input.parentElement?.previousSibling\n    : input.parentElement?.nextSibling;\n  const siblingInput = sibling?.firstChild;\n  if (siblingInput && siblingInput instanceof HTMLInputElement) {\n    siblingInput?.focus();\n    siblingInput?.select();\n  }\n}\n\nconst getValueAsArray = (value: string | undefined, length: number) => {\n  if (!value) {\n    return undefined;\n  }\n\n  return createEmptyArray(length).map((_, index) => value?.[index] ?? \"\");\n};\n\nconst createEmptyArray = (length: number): string[] =>\n  Array.from<string>({ length }).fill(\"\");\n"],"mappings":"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","names":["Root","value","Input","char","index"]}

package/dist/esm/lib/provider-icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/provider-icon.tsx"],"sourcesContent":["import { extractProps } from \"@radix-ui/themes/helpers\";\nimport { marginPropDefs, type MarginProps } from \"@radix-ui/themes/props\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport type { IdentityProvider } from \"./identity-providers.js\";\nimport type { DataIntegrationIntegrationType } from \"../api/endpoint.js\";\n\ninterface ProviderIconProps\n  extends React.ComponentPropsWithRef<\"div\">,\n    MarginProps {\n  provider: IdentityProvider | keyof typeof DataIntegrationIntegrationType;\n  size?: \"1\" | \"2\" | \"3\" | \"4\";\n}\n\nconst ProviderIcon = React.forwardRef<HTMLDivElement, ProviderIconProps>(\n  (props, forwardedRef) => {\n    const {\n      provider,\n      size = \"4\",\n      className,\n      ...providerIconProps\n    } = extractProps(props, marginPropDefs);\n\n    return (\n      <div\n        {...providerIconProps}\n        ref={forwardedRef}\n        className={clsx(\"woswidgets-provider-icon\", `size-${size}`, className)}\n        data-provider={provider}\n      />\n    );\n  },\n);\n\nProviderIcon.displayName = \"ProviderIcon\";\n\nexport { ProviderIcon };\n"],"mappings":"AAwBM;AAxBN,SAAS,oBAAoB;AAC7B,SAAS,sBAAwC;AACjD,OAAO,UAAU;AACjB,YAAY,WAAW;AAWvB,MAAM,eAAe,MAAM;AAAA,EACzB,CAAC,OAAO,iBAAiB;AACvB,UAAM;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,GAAG;AAAA,IACL,IAAI,aAAa,OAAO,cAAc;AAEtC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,KAAK,4BAA4B,QAAQ,IAAI,IAAI,SAAS;AAAA,QACrE,iBAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/lib/provider-icon.tsx"],"sourcesContent":["import { extractProps } from \"@radix-ui/themes/helpers\";\nimport { marginPropDefs, type MarginProps } from \"@radix-ui/themes/props\";\nimport clsx from \"clsx\";\nimport * as React from \"react\";\nimport type { IdentityProvider } from \"./identity-providers.js\";\nimport type { DataIntegrationIntegrationType } from \"../api/endpoint.js\";\n\ninterface ProviderIconProps\n  extends React.ComponentPropsWithRef<\"div\">, MarginProps {\n  provider: IdentityProvider | keyof typeof DataIntegrationIntegrationType;\n  size?: \"1\" | \"2\" | \"3\" | \"4\";\n}\n\nconst ProviderIcon = React.forwardRef<HTMLDivElement, ProviderIconProps>(\n  (props, forwardedRef) => {\n    const {\n      provider,\n      size = \"4\",\n      className,\n      ...providerIconProps\n    } = extractProps(props, marginPropDefs);\n\n    return (\n      <div\n        {...providerIconProps}\n        ref={forwardedRef}\n        className={clsx(\"woswidgets-provider-icon\", `size-${size}`, className)}\n        data-provider={provider}\n      />\n    );\n  },\n);\n\nProviderIcon.displayName = \"ProviderIcon\";\n\nexport { ProviderIcon };\n"],"mappings":"AAuBM;AAvBN,SAAS,oBAAoB;AAC7B,SAAS,sBAAwC;AACjD,OAAO,UAAU;AACjB,YAAY,WAAW;AAUvB,MAAM,eAAe,MAAM;AAAA,EACzB,CAAC,OAAO,iBAAiB;AACvB,UAAM;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA,GAAG;AAAA,IACL,IAAI,aAAa,OAAO,cAAc;AAEtC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,KAAK,4BAA4B,QAAQ,IAAI,IAAI,SAAS;AAAA,QACrE,iBAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;","names":[]}

package/dist/esm/lib/set-password-dialog.js

@@ -3,7 +3,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Callout, Flex, Text, VisuallyHidden } from "@radix-ui/themes";
 import * as React from "react";
 import { Dialog, Label, PasswordField, Button } from "./elements.js";
-import * as Form from "@radix-ui/react-form";
+import { Form } from "radix-ui";
 import { useCreatePassword } from "../api/endpoint.js";
 import { useSecuritySettings } from "./use-security-settings.js";
 import { ElevatedAccess } from "./elevated-access.js";

package/dist/esm/lib/set-password-dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/set-password-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport { Dialog, Label, PasswordField, Button } from \"./elements.js\";\nimport * as Form from \"@radix-ui/react-form\";\nimport { useCreatePassword } from \"../api/endpoint.js\";\nimport { useSecuritySettings } from \"./use-security-settings.js\";\nimport { ElevatedAccess } from \"./elevated-access.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { useDialogClose } from \"./use-dialog-close.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface SetPasswordDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n}\n\nexport function SetPasswordDialog({\n  children,\n  ...props\n}: SetPasswordDialogProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const handleClose = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  return (\n    <Dialog.Root {...props} open={open} onOpenChange={setOpen}>\n      <Dialog.Trigger>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <ElevatedAccess>\n          <Content onClose={handleClose} />\n        </ElevatedAccess>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  onClose: () => void;\n}\n\nfunction Content({ onClose }: ContentProps) {\n  const translate = useTranslation();\n  const setPassword = useCreatePassword();\n  const securitySettings = useSecuritySettings();\n  const [disableSubmit, setDisableSubmit] = React.useState(true);\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const password = formData.get(\"password\")?.toString();\n\n    if (!password) {\n      return;\n    }\n\n    setPassword.mutate({ data: { password } });\n  };\n\n  useDialogClose(setPassword.isSuccess, () => {\n    securitySettings.update(\"Password\", true);\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Set New Password\"\n          id=\"4ymFUc\"\n          description=\"Dialog title for setting a new password\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Set a new password for your account\"\n            id=\"KYv5vS\"\n            description=\"Screen reader description for set password dialog\"\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {setPassword.error ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>\n            {getMutationErrorMessage(setPassword.error)}\n          </Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={handleSubmit}\n        onChange={(event) => {\n          const formData = new FormData(event.currentTarget);\n          const password = formData.get(\"password\")?.toString();\n          const confirmPassword = formData.get(\"confirmPassword\")?.toString();\n          setDisableSubmit(password === \"\" || confirmPassword === \"\");\n        }}\n      >\n        <Flex mt=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field name=\"password\" asChild>\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter a new password\"\n                    id=\"OHDxyL\"\n                    description=\"Label for password input field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <PasswordField\n                  autoFocus\n                  required\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"New password\",\n                    id: \"ABfT4E\",\n                    description: \"Placeholder for password input\",\n                  })}\n                  disabled={setPassword.isPending || setPassword.isSuccess}\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter a new password\"\n                    id=\"+2kQs5\"\n                    description=\"Error message when password field is empty\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message match={(value) => value.length < 8} asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Password must be at least 8 characters\"\n                    id=\"WRjyrh\"\n                    description=\"Error message when password is too short\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field name=\"confirmPassword\" asChild>\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Confirm your new password\"\n                    id=\"K83lBn\"\n                    description=\"Label for password confirmation field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <PasswordField\n                  required\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Confirm new password\",\n                    id: \"O79vjp\",\n                    description: \"Placeholder for password confirmation input\",\n                  })}\n                  disabled={setPassword.isPending || setPassword.isSuccess}\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please confirm your new password\"\n                    id=\"vfwqWf\"\n                    description=\"Error message when password confirmation is empty\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) => value !== formData.get(\"password\")}\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"The passwords you entered don't match.\"\n                    id=\"ayYwQx\"\n                    description=\"Error message when passwords don't match\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={setPassword.isPending || setPassword.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"VJVs4m\"\n                description=\"Button to cancel setting password\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            loading={setPassword.isPending}\n            done={setPassword.isSuccess}\n            onDone={onClose}\n            type=\"submit\"\n            disabled={disableSubmit || undefined}\n          >\n            <Translation\n              defaultMessage=\"Set password\"\n              id=\"jSfqX/\"\n              description=\"Button to confirm setting new password\"\n            />\n          </SaveButton>\n        </Flex>\n\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(setPassword.error)}\n          </section>\n        </VisuallyHidden>\n      </Form.Root>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  return (\n    <Translation\n      defaultMessage=\"Something went wrong. Please try again.\"\n      id=\"jLzoYu\"\n      description=\"Generic error message for password setting failure\"\n    />\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/lib/set-password-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport * as React from \"react\";\nimport { type ReactNode } from \"react\";\nimport { Dialog, Label, PasswordField, Button } from \"./elements.js\";\nimport { Form } from \"radix-ui\";\nimport { useCreatePassword } from \"../api/endpoint.js\";\nimport { useSecuritySettings } from \"./use-security-settings.js\";\nimport { ElevatedAccess } from \"./elevated-access.js\";\nimport { SaveButton } from \"./save-button.js\";\nimport { useDialogClose } from \"./use-dialog-close.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface SetPasswordDialogProps extends Dialog.RootProps {\n  children?: ReactNode;\n}\n\nexport function SetPasswordDialog({\n  children,\n  ...props\n}: SetPasswordDialogProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const handleClose = React.useCallback(() => {\n    setOpen(false);\n  }, []);\n\n  return (\n    <Dialog.Root {...props} open={open} onOpenChange={setOpen}>\n      <Dialog.Trigger>{children}</Dialog.Trigger>\n\n      <Dialog.Content maxWidth=\"480px\">\n        <ElevatedAccess>\n          <Content onClose={handleClose} />\n        </ElevatedAccess>\n      </Dialog.Content>\n    </Dialog.Root>\n  );\n}\n\ninterface ContentProps {\n  onClose: () => void;\n}\n\nfunction Content({ onClose }: ContentProps) {\n  const translate = useTranslation();\n  const setPassword = useCreatePassword();\n  const securitySettings = useSecuritySettings();\n  const [disableSubmit, setDisableSubmit] = React.useState(true);\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n\n    const formData = new FormData(event.currentTarget);\n    const password = formData.get(\"password\")?.toString();\n\n    if (!password) {\n      return;\n    }\n\n    setPassword.mutate({ data: { password } });\n  };\n\n  useDialogClose(setPassword.isSuccess, () => {\n    securitySettings.update(\"Password\", true);\n  });\n\n  return (\n    <>\n      <Dialog.Title mb=\"5\">\n        <Translation\n          defaultMessage=\"Set New Password\"\n          id=\"4ymFUc\"\n          description=\"Dialog title for setting a new password\"\n        />\n      </Dialog.Title>\n      <VisuallyHidden>\n        <Dialog.Description>\n          <Translation\n            defaultMessage=\"Set a new password for your account\"\n            id=\"KYv5vS\"\n            description=\"Screen reader description for set password dialog\"\n          />\n        </Dialog.Description>\n      </VisuallyHidden>\n\n      {setPassword.error ? (\n        <Callout.Root color=\"red\" my=\"-2\">\n          <Callout.Text>\n            {getMutationErrorMessage(setPassword.error)}\n          </Callout.Text>\n        </Callout.Root>\n      ) : null}\n\n      <Form.Root\n        onSubmit={handleSubmit}\n        onChange={(event) => {\n          const formData = new FormData(event.currentTarget);\n          const password = formData.get(\"password\")?.toString();\n          const confirmPassword = formData.get(\"confirmPassword\")?.toString();\n          setDisableSubmit(password === \"\" || confirmPassword === \"\");\n        }}\n      >\n        <Flex mt=\"5\" direction=\"column\" gap=\"4\">\n          <Form.Field name=\"password\" asChild>\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Enter a new password\"\n                    id=\"OHDxyL\"\n                    description=\"Label for password input field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <PasswordField\n                  autoFocus\n                  required\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"New password\",\n                    id: \"ABfT4E\",\n                    description: \"Placeholder for password input\",\n                  })}\n                  disabled={setPassword.isPending || setPassword.isSuccess}\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please enter a new password\"\n                    id=\"+2kQs5\"\n                    description=\"Error message when password field is empty\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message match={(value) => value.length < 8} asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Password must be at least 8 characters\"\n                    id=\"WRjyrh\"\n                    description=\"Error message when password is too short\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n\n          <Form.Field name=\"confirmPassword\" asChild>\n            <Flex direction=\"column\" gap=\"2\">\n              <Form.Label asChild>\n                <Label>\n                  <Translation\n                    defaultMessage=\"Confirm your new password\"\n                    id=\"K83lBn\"\n                    description=\"Label for password confirmation field\"\n                  />\n                </Label>\n              </Form.Label>\n              <Form.Control asChild>\n                <PasswordField\n                  required\n                  autoComplete=\"new-password\"\n                  placeholder={translate({\n                    defaultMessage: \"Confirm new password\",\n                    id: \"O79vjp\",\n                    description: \"Placeholder for password confirmation input\",\n                  })}\n                  disabled={setPassword.isPending || setPassword.isSuccess}\n                />\n              </Form.Control>\n              <Form.Message match=\"valueMissing\" asChild>\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"Please confirm your new password\"\n                    id=\"vfwqWf\"\n                    description=\"Error message when password confirmation is empty\"\n                  />\n                </Text>\n              </Form.Message>\n              <Form.Message\n                match={(value, formData) => value !== formData.get(\"password\")}\n                asChild\n              >\n                <Text size=\"2\" color=\"red\">\n                  <Translation\n                    defaultMessage=\"The passwords you entered don't match.\"\n                    id=\"ayYwQx\"\n                    description=\"Error message when passwords don't match\"\n                  />\n                </Text>\n              </Form.Message>\n            </Flex>\n          </Form.Field>\n        </Flex>\n\n        <Flex mt=\"5\" gap=\"3\" justify=\"end\">\n          <Dialog.Close>\n            <Button\n              variant=\"secondary\"\n              disabled={setPassword.isPending || setPassword.isSuccess}\n            >\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"VJVs4m\"\n                description=\"Button to cancel setting password\"\n              />\n            </Button>\n          </Dialog.Close>\n\n          <SaveButton\n            loading={setPassword.isPending}\n            done={setPassword.isSuccess}\n            onDone={onClose}\n            type=\"submit\"\n            disabled={disableSubmit || undefined}\n          >\n            <Translation\n              defaultMessage=\"Set password\"\n              id=\"jSfqX/\"\n              description=\"Button to confirm setting new password\"\n            />\n          </SaveButton>\n        </Flex>\n\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(setPassword.error)}\n          </section>\n        </VisuallyHidden>\n      </Form.Root>\n    </>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (error instanceof Error) {\n    return error.message;\n  }\n\n  if (\n    typeof error === \"object\" &&\n    error !== null &&\n    \"message\" in error &&\n    typeof error.message === \"string\"\n  ) {\n    return error.message;\n  }\n\n  return (\n    <Translation\n      defaultMessage=\"Something went wrong. Please try again.\"\n      id=\"jLzoYu\"\n      description=\"Generic error message for password setting failure\"\n    />\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/status.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport * as React from \"react\";\nimport { MarginProps } from \"@radix-ui/themes/props\";\nimport { Spinner, Text } from \"@radix-ui/themes\";\n\nexport const getStatusColor = (\n  state: \"success\" | \"waiting\" | \"error\",\n): \"green\" | \"gray\" | \"red\" => {\n  switch (state) {\n    case \"success\":\n      return \"green\";\n    case \"waiting\":\n      return \"gray\";\n    case \"error\":\n      return \"red\";\n  }\n};\n\nexport interface StatusProps\n  extends Omit<React.ComponentPropsWithoutRef<\"span\">, \"color\">,\n    MarginProps {\n  children?: React.ReactNode;\n  state: \"success\" | \"waiting\" | \"error\";\n}\n\nconst Status = React.forwardRef<HTMLSpanElement, StatusProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <Text\n      ref={forwardedRef}\n      className={clsx(className, \"woswidgets-status\")}\n      data-state={props.state}\n      {...props}\n      size=\"2\"\n      color={getStatusColor(props.state)}\n    >\n      {props.state === \"waiting\" && <Spinner />}\n      {props.children}\n    </Text>\n  ),\n);\n\nStatus.displayName = \"Status\";\n\nexport { Status };\n"],"mappings":"AA2BI,SAQgC,KARhC;AA3BJ,OAAO,UAAU;AACjB,YAAY,WAAW;AAEvB,SAAS,SAAS,YAAY;AAEvB,MAAM,iBAAiB,CAC5B,UAC6B;AAC7B,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EACX;AACF;AASA,MAAM,SAAS,MAAM;AAAA,EACnB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,iBACxB;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,KAAK,WAAW,mBAAmB;AAAA,MAC9C,cAAY,MAAM;AAAA,MACjB,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,OAAO,eAAe,MAAM,KAAK;AAAA,MAEhC;AAAA,cAAM,UAAU,aAAa,oBAAC,WAAQ;AAAA,QACtC,MAAM;AAAA;AAAA;AAAA,EACT;AAEJ;AAEA,OAAO,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/lib/status.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport * as React from \"react\";\nimport { MarginProps } from \"@radix-ui/themes/props\";\nimport { Spinner, Text } from \"@radix-ui/themes\";\n\nexport const getStatusColor = (\n  state: \"success\" | \"waiting\" | \"error\",\n): \"green\" | \"gray\" | \"red\" => {\n  switch (state) {\n    case \"success\":\n      return \"green\";\n    case \"waiting\":\n      return \"gray\";\n    case \"error\":\n      return \"red\";\n  }\n};\n\nexport interface StatusProps\n  extends Omit<React.ComponentPropsWithoutRef<\"span\">, \"color\">, MarginProps {\n  children?: React.ReactNode;\n  state: \"success\" | \"waiting\" | \"error\";\n}\n\nconst Status = React.forwardRef<HTMLSpanElement, StatusProps>(\n  ({ className, ...props }, forwardedRef) => (\n    <Text\n      ref={forwardedRef}\n      className={clsx(className, \"woswidgets-status\")}\n      data-state={props.state}\n      {...props}\n      size=\"2\"\n      color={getStatusColor(props.state)}\n    >\n      {props.state === \"waiting\" && <Spinner />}\n      {props.children}\n    </Text>\n  ),\n);\n\nStatus.displayName = \"Status\";\n\nexport { Status };\n"],"mappings":"AA0BI,SAQgC,KARhC;AA1BJ,OAAO,UAAU;AACjB,YAAY,WAAW;AAEvB,SAAS,SAAS,YAAY;AAEvB,MAAM,iBAAiB,CAC5B,UAC6B;AAC7B,UAAQ,OAAO;AAAA,IACb,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EACX;AACF;AAQA,MAAM,SAAS,MAAM;AAAA,EACnB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,iBACxB;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,KAAK,WAAW,mBAAmB;AAAA,MAC9C,cAAY,MAAM;AAAA,MACjB,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,OAAO,eAAe,MAAM,KAAK;AAAA,MAEhC;AAAA,cAAM,UAAU,aAAa,oBAAC,WAAQ;AAAA,QACtC,MAAM;AAAA;AAAA;AAAA,EACT;AAEJ;AAEA,OAAO,cAAc;","names":[]}

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

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useComposedRefs } from "@radix-ui/react-compose-refs";
+import { useComposedRefs } from "radix-ui/internal";
 import { Cross2Icon, MagnifyingGlassIcon } from "@radix-ui/react-icons";
 import cx from "clsx";
 import * as React from "react";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/users-search.tsx"],"sourcesContent":["\"use client\";\n\nimport { useComposedRefs } from \"@radix-ui/react-compose-refs\";\nimport { Cross2Icon, MagnifyingGlassIcon } from \"@radix-ui/react-icons\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { IconButton, TextField, TextFieldSlot } from \"./elements.js\";\nimport { useSearchContext } from \"./search-provider.js\";\nimport { useUsersManagementContext } from \"./users-management-context.js\";\nimport { namespaceClassNames } from \"./utils.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype UsersSearchProps = React.ComponentPropsWithoutRef<typeof TextField>;\n\nexport const UsersSearch = React.forwardRef<HTMLInputElement, UsersSearchProps>(\n  ({ className, ...props }, ref) => {\n    const { inputRef, clearSearch, searchValue, setSearchValue } =\n      useSearchContext();\n    const { dispatch } = useUsersManagementContext();\n    const translate = useTranslation();\n\n    const filter = useDebouncedCallback((value) => {\n      dispatch({ type: \"FILTER_BY_SEARCH\", searchQuery: value });\n    }, 200);\n\n    const resetSearch = () => {\n      clearSearch();\n      filter.cancel();\n    };\n\n    return (\n      <TextField\n        ref={useComposedRefs(inputRef, ref)}\n        className={cx(namespaceClassNames(\"users-search\"), className)}\n        autoComplete=\"off\"\n        aria-label={translate({\n          defaultMessage: \"User search\",\n          id: \"lzPOKv\",\n          description: \"Label for the user search input field\",\n        })}\n        placeholder={translate({\n          defaultMessage: \"Search by name or e-mail\",\n          id: \"VH4IKy\",\n          description: \"Placeholder text for the user search input field\",\n        })}\n        value={searchValue}\n        onChange={(event) => {\n          const value = event.target.value;\n          setSearchValue(value);\n          filter(value);\n        }}\n        onKeyDown={(event) => {\n          if (event.key === \"Escape\") {\n            event.preventDefault();\n            resetSearch();\n          }\n        }}\n        {...props}\n      >\n        <TextFieldSlot side=\"left\">\n          <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n        </TextFieldSlot>\n\n        <TextFieldSlot side=\"right\">\n          {!!searchValue && (\n            <IconButton\n              size=\"1\"\n              onClick={resetSearch}\n              title={translate({\n                defaultMessage: \"Clear search\",\n                id: \"IBozK6\",\n                description: \"Tooltip text for the clear search button\",\n              })}\n            >\n              <Cross2Icon aria-hidden=\"true\" />\n            </IconButton>\n          )}\n        </TextFieldSlot>\n      </TextField>\n    );\n  },\n);\n"],"mappings":";AAgCM,SA6BI,KA7BJ;AA9BN,SAAS,uBAAuB;AAChC,SAAS,YAAY,2BAA2B;AAChD,OAAO,QAAQ;AACf,YAAY,WAAW;AACvB,SAAS,4BAA4B;AACrC,SAAS,YAAY,WAAW,qBAAqB;AACrD,SAAS,wBAAwB;AACjC,SAAS,iCAAiC;AAC1C,SAAS,2BAA2B;AACpC,SAAS,sBAAsB;AAIxB,MAAM,cAAc,MAAM;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ;AAChC,UAAM,EAAE,UAAU,aAAa,aAAa,eAAe,IACzD,iBAAiB;AACnB,UAAM,EAAE,SAAS,IAAI,0BAA0B;AAC/C,UAAM,YAAY,eAAe;AAEjC,UAAM,SAAS,qBAAqB,CAAC,UAAU;AAC7C,eAAS,EAAE,MAAM,oBAAoB,aAAa,MAAM,CAAC;AAAA,IAC3D,GAAG,GAAG;AAEN,UAAM,cAAc,MAAM;AACxB,kBAAY;AACZ,aAAO,OAAO;AAAA,IAChB;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,gBAAgB,UAAU,GAAG;AAAA,QAClC,WAAW,GAAG,oBAAoB,cAAc,GAAG,SAAS;AAAA,QAC5D,cAAa;AAAA,QACb,cAAY,UAAU;AAAA,UACpB,gBAAgB;AAAA,UAChB,IAAI;AAAA,UACJ,aAAa;AAAA,QACf,CAAC;AAAA,QACD,aAAa,UAAU;AAAA,UACrB,gBAAgB;AAAA,UAChB,IAAI;AAAA,UACJ,aAAa;AAAA,QACf,CAAC;AAAA,QACD,OAAO;AAAA,QACP,UAAU,CAAC,UAAU;AACnB,gBAAM,QAAQ,MAAM,OAAO;AAC3B,yBAAe,KAAK;AACpB,iBAAO,KAAK;AAAA,QACd;AAAA,QACA,WAAW,CAAC,UAAU;AACpB,cAAI,MAAM,QAAQ,UAAU;AAC1B,kBAAM,eAAe;AACrB,wBAAY;AAAA,UACd;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ;AAAA,8BAAC,iBAAc,MAAK,QAClB,8BAAC,uBAAoB,eAAY,QAAO,QAAO,MAAK,OAAM,MAAK,GACjE;AAAA,UAEA,oBAAC,iBAAc,MAAK,SACjB,WAAC,CAAC,eACD;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS;AAAA,cACT,OAAO,UAAU;AAAA,gBACf,gBAAgB;AAAA,gBAChB,IAAI;AAAA,gBACJ,aAAa;AAAA,cACf,CAAC;AAAA,cAED,8BAAC,cAAW,eAAY,QAAO;AAAA;AAAA,UACjC,GAEJ;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;","names":[]}
+{"version":3,"sources":["../../../src/lib/users-search.tsx"],"sourcesContent":["\"use client\";\n\nimport { useComposedRefs } from \"radix-ui/internal\";\nimport { Cross2Icon, MagnifyingGlassIcon } from \"@radix-ui/react-icons\";\nimport cx from \"clsx\";\nimport * as React from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { IconButton, TextField, TextFieldSlot } from \"./elements.js\";\nimport { useSearchContext } from \"./search-provider.js\";\nimport { useUsersManagementContext } from \"./users-management-context.js\";\nimport { namespaceClassNames } from \"./utils.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ntype UsersSearchProps = React.ComponentPropsWithoutRef<typeof TextField>;\n\nexport const UsersSearch = React.forwardRef<HTMLInputElement, UsersSearchProps>(\n  ({ className, ...props }, ref) => {\n    const { inputRef, clearSearch, searchValue, setSearchValue } =\n      useSearchContext();\n    const { dispatch } = useUsersManagementContext();\n    const translate = useTranslation();\n\n    const filter = useDebouncedCallback((value) => {\n      dispatch({ type: \"FILTER_BY_SEARCH\", searchQuery: value });\n    }, 200);\n\n    const resetSearch = () => {\n      clearSearch();\n      filter.cancel();\n    };\n\n    return (\n      <TextField\n        ref={useComposedRefs(inputRef, ref)}\n        className={cx(namespaceClassNames(\"users-search\"), className)}\n        autoComplete=\"off\"\n        aria-label={translate({\n          defaultMessage: \"User search\",\n          id: \"lzPOKv\",\n          description: \"Label for the user search input field\",\n        })}\n        placeholder={translate({\n          defaultMessage: \"Search by name or e-mail\",\n          id: \"VH4IKy\",\n          description: \"Placeholder text for the user search input field\",\n        })}\n        value={searchValue}\n        onChange={(event) => {\n          const value = event.target.value;\n          setSearchValue(value);\n          filter(value);\n        }}\n        onKeyDown={(event) => {\n          if (event.key === \"Escape\") {\n            event.preventDefault();\n            resetSearch();\n          }\n        }}\n        {...props}\n      >\n        <TextFieldSlot side=\"left\">\n          <MagnifyingGlassIcon aria-hidden=\"true\" height=\"16\" width=\"16\" />\n        </TextFieldSlot>\n\n        <TextFieldSlot side=\"right\">\n          {!!searchValue && (\n            <IconButton\n              size=\"1\"\n              onClick={resetSearch}\n              title={translate({\n                defaultMessage: \"Clear search\",\n                id: \"IBozK6\",\n                description: \"Tooltip text for the clear search button\",\n              })}\n            >\n              <Cross2Icon aria-hidden=\"true\" />\n            </IconButton>\n          )}\n        </TextFieldSlot>\n      </TextField>\n    );\n  },\n);\n"],"mappings":";AAgCM,SA6BI,KA7BJ;AA9BN,SAAS,uBAAuB;AAChC,SAAS,YAAY,2BAA2B;AAChD,OAAO,QAAQ;AACf,YAAY,WAAW;AACvB,SAAS,4BAA4B;AACrC,SAAS,YAAY,WAAW,qBAAqB;AACrD,SAAS,wBAAwB;AACjC,SAAS,iCAAiC;AAC1C,SAAS,2BAA2B;AACpC,SAAS,sBAAsB;AAIxB,MAAM,cAAc,MAAM;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAAQ;AAChC,UAAM,EAAE,UAAU,aAAa,aAAa,eAAe,IACzD,iBAAiB;AACnB,UAAM,EAAE,SAAS,IAAI,0BAA0B;AAC/C,UAAM,YAAY,eAAe;AAEjC,UAAM,SAAS,qBAAqB,CAAC,UAAU;AAC7C,eAAS,EAAE,MAAM,oBAAoB,aAAa,MAAM,CAAC;AAAA,IAC3D,GAAG,GAAG;AAEN,UAAM,cAAc,MAAM;AACxB,kBAAY;AACZ,aAAO,OAAO;AAAA,IAChB;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,gBAAgB,UAAU,GAAG;AAAA,QAClC,WAAW,GAAG,oBAAoB,cAAc,GAAG,SAAS;AAAA,QAC5D,cAAa;AAAA,QACb,cAAY,UAAU;AAAA,UACpB,gBAAgB;AAAA,UAChB,IAAI;AAAA,UACJ,aAAa;AAAA,QACf,CAAC;AAAA,QACD,aAAa,UAAU;AAAA,UACrB,gBAAgB;AAAA,UAChB,IAAI;AAAA,UACJ,aAAa;AAAA,QACf,CAAC;AAAA,QACD,OAAO;AAAA,QACP,UAAU,CAAC,UAAU;AACnB,gBAAM,QAAQ,MAAM,OAAO;AAC3B,yBAAe,KAAK;AACpB,iBAAO,KAAK;AAAA,QACd;AAAA,QACA,WAAW,CAAC,UAAU;AACpB,cAAI,MAAM,QAAQ,UAAU;AAC1B,kBAAM,eAAe;AACrB,wBAAY;AAAA,UACd;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ;AAAA,8BAAC,iBAAc,MAAK,QAClB,8BAAC,uBAAoB,eAAY,QAAO,QAAO,MAAK,OAAM,MAAK,GACjE;AAAA,UAEA,oBAAC,iBAAc,MAAK,SACjB,WAAC,CAAC,eACD;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS;AAAA,cACT,OAAO,UAAU;AAAA,gBACf,gBAAgB;AAAA,gBAChB,IAAI;AAAA,gBACJ,aAAa;AAAA,cACf,CAAC;AAAA,cAED,8BAAC,cAAW,eAAY,QAAO;AAAA;AAAA,UACjC,GAEJ;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;","names":[]}

package/dist/esm/organization-switcher.client.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/organization-switcher.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { ApiProvider, AuthToken, useApiReady } from \"./api/api-provider.js\";\nimport { OrganizationInfo, useOrganizations } from \"./api/endpoint.js\";\nimport * as React from \"react\";\nimport { ErrorBoundary } from \"./lib/error-boundary.js\";\nimport {\n  OrganizationSwitcherError,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcher as OrganizationSwitcherPresentational,\n} from \"./lib/organization-switcher.js\";\nimport type {\n  OrganizationSwitcherErrorProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherPassthroughProps,\n} from \"./lib/organization-switcher.js\";\nimport { useWorkOsApiUrl } from \"./lib/widgets-context.js\";\nimport { keepPreviousData } from \"@tanstack/react-query\";\n\ninterface OrganizationSwitcherProps\n  extends OrganizationSwitcherPassthroughProps {\n  authToken: AuthToken;\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  authToken,\n  organizationLabel,\n  switchToOrganization,\n  truncateBehavior,\n  variant,\n  ...domProps\n}) => {\n  const baseUrl = useWorkOsApiUrl();\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <OrganizationSwitcherError\n          error={error}\n          variant={variant}\n          {...domProps}\n        />\n      )}\n    >\n      <ApiProvider\n        widgetType=\"organization-switcher\"\n        authToken={authToken}\n        baseUrl={baseUrl}\n      >\n        <OrganizationSwitcherImpl\n          switchToOrganization={switchToOrganization}\n          organizationLabel={organizationLabel}\n          truncateBehavior={truncateBehavior}\n          variant={variant}\n          {...domProps}\n        />\n      </ApiProvider>\n    </ErrorBoundary>\n  );\n};\n\n// Constant reference to avoid unnecessary prop changes\nconst emptyOrganizations: OrganizationInfo[] = [];\n\nconst OrganizationSwitcherImpl = ({\n  variant,\n  switchToOrganization,\n  organizationLabel,\n  truncateBehavior,\n  children,\n  ...domProps\n}: OrganizationSwitcherPassthroughProps) => {\n  const isApiReady = useApiReady();\n  const organizationsQuery = useOrganizations({\n    query: {\n      placeholderData: keepPreviousData,\n    },\n  });\n\n  const organizations = organizationsQuery.data?.data ?? emptyOrganizations;\n\n  if (organizationsQuery.isLoading || !isApiReady) {\n    return <OrganizationSwitcherLoading variant={variant} {...domProps} />;\n  }\n\n  if (organizationsQuery.isError) {\n    return (\n      <OrganizationSwitcherError\n        error={organizationsQuery.error}\n        variant={variant}\n        {...domProps}\n      />\n    );\n  }\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <OrganizationSwitcherError\n          error={error}\n          variant={variant}\n          {...domProps}\n        />\n      )}\n    >\n      <OrganizationSwitcherPresentational\n        organizations={organizations}\n        switchToOrganization={switchToOrganization}\n        variant={variant}\n        organizationLabel={organizationLabel}\n        truncateBehavior={truncateBehavior}\n        {...domProps}\n      >\n        {children}\n      </OrganizationSwitcherPresentational>\n    </ErrorBoundary>\n  );\n};\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":";AAqCQ;AAnCR,SAAS,aAAwB,mBAAmB;AACpD,SAA2B,wBAAwB;AAEnD,SAAS,qBAAqB;AAC9B;AAAA,EACE;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,OACnB;AAMP,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AAOjC,MAAM,uBAA4D,CAAC;AAAA,EACjE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UAAU,gBAAgB;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,MAAM,MACvB;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX;AAAA,UACA;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACC,GAAG;AAAA;AAAA,UACN;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAGA,MAAM,qBAAyC,CAAC;AAEhD,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4C;AAC1C,QAAM,aAAa,YAAY;AAC/B,QAAM,qBAAqB,iBAAiB;AAAA,IAC1C,OAAO;AAAA,MACL,iBAAiB;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,mBAAmB,MAAM,QAAQ;AAEvD,MAAI,mBAAmB,aAAa,CAAC,YAAY;AAC/C,WAAO,oBAAC,+BAA4B,SAAmB,GAAG,UAAU;AAAA,EACtE;AAEA,MAAI,mBAAmB,SAAS;AAC9B,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,mBAAmB;AAAA,QAC1B;AAAA,QACC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,MAAM,MACvB;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACC,GAAG;AAAA,UAEH;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/organization-switcher.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { ApiProvider, AuthToken, useApiReady } from \"./api/api-provider.js\";\nimport { OrganizationInfo, useOrganizations } from \"./api/endpoint.js\";\nimport * as React from \"react\";\nimport { ErrorBoundary } from \"./lib/error-boundary.js\";\nimport {\n  OrganizationSwitcherError,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcher as OrganizationSwitcherPresentational,\n} from \"./lib/organization-switcher.js\";\nimport type {\n  OrganizationSwitcherErrorProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherPassthroughProps,\n} from \"./lib/organization-switcher.js\";\nimport { useWorkOsApiUrl } from \"./lib/widgets-context.js\";\nimport { keepPreviousData } from \"@tanstack/react-query\";\n\ninterface OrganizationSwitcherProps extends OrganizationSwitcherPassthroughProps {\n  authToken: AuthToken;\n}\n\nconst OrganizationSwitcher: React.FC<OrganizationSwitcherProps> = ({\n  authToken,\n  organizationLabel,\n  switchToOrganization,\n  truncateBehavior,\n  variant,\n  ...domProps\n}) => {\n  const baseUrl = useWorkOsApiUrl();\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <OrganizationSwitcherError\n          error={error}\n          variant={variant}\n          {...domProps}\n        />\n      )}\n    >\n      <ApiProvider\n        widgetType=\"organization-switcher\"\n        authToken={authToken}\n        baseUrl={baseUrl}\n      >\n        <OrganizationSwitcherImpl\n          switchToOrganization={switchToOrganization}\n          organizationLabel={organizationLabel}\n          truncateBehavior={truncateBehavior}\n          variant={variant}\n          {...domProps}\n        />\n      </ApiProvider>\n    </ErrorBoundary>\n  );\n};\n\n// Constant reference to avoid unnecessary prop changes\nconst emptyOrganizations: OrganizationInfo[] = [];\n\nconst OrganizationSwitcherImpl = ({\n  variant,\n  switchToOrganization,\n  organizationLabel,\n  truncateBehavior,\n  children,\n  ...domProps\n}: OrganizationSwitcherPassthroughProps) => {\n  const isApiReady = useApiReady();\n  const organizationsQuery = useOrganizations({\n    query: {\n      placeholderData: keepPreviousData,\n    },\n  });\n\n  const organizations = organizationsQuery.data?.data ?? emptyOrganizations;\n\n  if (organizationsQuery.isLoading || !isApiReady) {\n    return <OrganizationSwitcherLoading variant={variant} {...domProps} />;\n  }\n\n  if (organizationsQuery.isError) {\n    return (\n      <OrganizationSwitcherError\n        error={organizationsQuery.error}\n        variant={variant}\n        {...domProps}\n      />\n    );\n  }\n\n  return (\n    <ErrorBoundary\n      fallbackRender={({ error }) => (\n        <OrganizationSwitcherError\n          error={error}\n          variant={variant}\n          {...domProps}\n        />\n      )}\n    >\n      <OrganizationSwitcherPresentational\n        organizations={organizations}\n        switchToOrganization={switchToOrganization}\n        variant={variant}\n        organizationLabel={organizationLabel}\n        truncateBehavior={truncateBehavior}\n        {...domProps}\n      >\n        {children}\n      </OrganizationSwitcherPresentational>\n    </ErrorBoundary>\n  );\n};\n\nexport type {\n  OrganizationSwitcherProps,\n  OrganizationSwitcherLoadingProps,\n  OrganizationSwitcherErrorProps,\n};\nexport {\n  OrganizationSwitcher,\n  OrganizationSwitcherLoading,\n  OrganizationSwitcherError,\n};\n"],"mappings":";AAoCQ;AAlCR,SAAS,aAAwB,mBAAmB;AACpD,SAA2B,wBAAwB;AAEnD,SAAS,qBAAqB;AAC9B;AAAA,EACE;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,OACnB;AAMP,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AAMjC,MAAM,uBAA4D,CAAC;AAAA,EACjE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UAAU,gBAAgB;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,MAAM,MACvB;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX;AAAA,UACA;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA;AAAA,cACA;AAAA,cACC,GAAG;AAAA;AAAA,UACN;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAGA,MAAM,qBAAyC,CAAC;AAEhD,MAAM,2BAA2B,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4C;AAC1C,QAAM,aAAa,YAAY;AAC/B,QAAM,qBAAqB,iBAAiB;AAAA,IAC1C,OAAO;AAAA,MACL,iBAAiB;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,mBAAmB,MAAM,QAAQ;AAEvD,MAAI,mBAAmB,aAAa,CAAC,YAAY;AAC/C,WAAO,oBAAC,+BAA4B,SAAmB,GAAG,UAAU;AAAA,EACtE;AAEA,MAAI,mBAAmB,SAAS;AAC9B,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,mBAAmB;AAAA,QAC1B;AAAA,QACC,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB,CAAC,EAAE,MAAM,MACvB;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACC,GAAG;AAAA;AAAA,MACN;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACC,GAAG;AAAA,UAEH;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workos-inc/widgets",
-  "version": "1.8.0",
+  "version": "1.8.2",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -34,6 +34,16 @@
         "default": "./dist/cjs/*.client.cjs"
       }
     },
+    "./experimental/api/*": {
+      "import": {
+        "types": "./dist/esm/experimental/api/*.ts",
+        "default": "./dist/esm/experimental/api/*.js"
+      },
+      "require": {
+        "types": "./dist/cjs/experimental/api/*.cts",
+        "default": "./dist/cjs/experimental/api/*.cjs"
+      }
+    },
     "./*.css": "./dist/css/*.css"
   },
   "files": [
@@ -52,47 +62,47 @@
   },
   "sideEffects": false,
   "dependencies": {
-    "@radix-ui/react-compose-refs": "^1.0.0",
-    "@radix-ui/react-form": "^0.1.2",
-    "@radix-ui/react-icons": "^1.3.1",
-    "@radix-ui/react-popover": "^1.1.6",
-    "@radix-ui/react-use-controllable-state": "^1.1.0",
+    "@radix-ui/react-icons": "^1.3.2",
     "bowser": "2.12.1",
     "clsx": "^2.0.0",
+    "radix-ui": "^1.4.3",
     "use-debounce": "^10.0.4"
   },
   "peerDependencies": {
-    "@radix-ui/themes": "^3.1.0",
+    "@radix-ui/themes": "^3.3.0",
     "@tanstack/react-query": "^5.0.0",
     "react": ">=18",
-    "react-dom": ">=18"
+    "react-dom": ">=18",
+    "swr": "^2.0.0"
   },
   "devDependencies": {
-    "@formatjs/cli": "^6.7.4",
-    "@radix-ui/react-compose-refs": "^1.1.2",
-    "@radix-ui/react-form": "^0.1.8",
+    "@formatjs/cli": "^6.12.0",
     "@radix-ui/react-icons": "^1.3.2",
-    "@radix-ui/react-popover": "^1.1.15",
-    "@radix-ui/react-use-controllable-state": "^1.2.2",
-    "@radix-ui/themes": "^3.2.1",
-    "@tanstack/react-query": "^5.90.10",
+    "@tanstack/react-query": "^5.90.20",
     "@types/node": "^24",
-    "@types/react": "^19.2.6",
+    "@types/react": "^19.2.10",
     "@types/react-dom": "^19.2.3",
     "clsx": "^2.1.1",
-    "eslint-plugin-formatjs": "^5.4.2",
-    "execa": "^9.6.0",
+    "eslint-plugin-formatjs": "^6.1.1",
+    "execa": "^9.6.1",
     "fast-glob": "^3.3.3",
-    "orval": "^7.16.1",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
+    "orval": "^7.21.0",
+    "radix-ui": "^1.4.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "swr": "^2.4.0",
     "tsup": "^8.5.1",
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
-    "use-debounce": "^10.0.6",
+    "use-debounce": "^10.1.0",
     "@repo/eslint-config": "0.0.0",
     "@repo/typescript-config": "0.0.0"
   },
+  "peerDependenciesMeta": {
+    "swr": {
+      "optional": true
+    }
+  },
   "typesVersions": {
     "*": {
       "*": [
@@ -110,7 +120,7 @@
     "clean:dist": "rm -rf dist",
     "lint": "eslint --max-warnings 0 .",
     "lint:fix": "eslint --max-warnings 0 --fix .",
-    "generate-api": "orval --config ./orval.config.ts",
+    "generate-api": "orval --config ./orval.config.ts --prettier",
     "i18n:extract": "tsx ../../../workos/packages/i18n/scripts/extract.ts widgets"
   },
   "main": "./dist/cjs/index.cjs",

package/dist/cjs/lib/use-layout-effect.cjs

@@ -1,31 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var use_layout_effect_exports = {};
-__export(use_layout_effect_exports, {
-  useLayoutEffect: () => useIsoLayoutEffect
-});
-module.exports = __toCommonJS(use_layout_effect_exports);
-var import_react = require("react");
-var import_utils = require("./utils.js");
-const useIsoLayoutEffect = import_utils.canUseDOM ? import_react.useLayoutEffect : () => void 0;
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  useLayoutEffect
-});
-//# sourceMappingURL=use-layout-effect.cjs.map

package/dist/cjs/lib/use-layout-effect.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/lib/use-layout-effect.ts"],"sourcesContent":["import { useLayoutEffect } from \"react\";\nimport { canUseDOM } from \"./utils.js\";\n\nconst useIsoLayoutEffect = canUseDOM ? useLayoutEffect : () => void 0;\n\nexport { useIsoLayoutEffect as useLayoutEffect };\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAChC,mBAA0B;AAE1B,MAAM,qBAAqB,yBAAY,+BAAkB,MAAM;","names":[]}

package/dist/cjs/lib/use-layout-effect.d.cts

@@ -1,5 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-declare const useIsoLayoutEffect: typeof useLayoutEffect;
-
-export { useIsoLayoutEffect as useLayoutEffect };

package/dist/esm/lib/use-layout-effect.d.ts

@@ -1,5 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-declare const useIsoLayoutEffect: typeof useLayoutEffect;
-
-export { useIsoLayoutEffect as useLayoutEffect };

package/dist/esm/lib/use-layout-effect.js

@@ -1,7 +0,0 @@
-import { useLayoutEffect } from "react";
-import { canUseDOM } from "./utils.js";
-const useIsoLayoutEffect = canUseDOM ? useLayoutEffect : () => void 0;
-export {
-  useIsoLayoutEffect as useLayoutEffect
-};
-//# sourceMappingURL=use-layout-effect.js.map

package/dist/esm/lib/use-layout-effect.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/lib/use-layout-effect.ts"],"sourcesContent":["import { useLayoutEffect } from \"react\";\nimport { canUseDOM } from \"./utils.js\";\n\nconst useIsoLayoutEffect = canUseDOM ? useLayoutEffect : () => void 0;\n\nexport { useIsoLayoutEffect as useLayoutEffect };\n"],"mappings":"AAAA,SAAS,uBAAuB;AAChC,SAAS,iBAAiB;AAE1B,MAAM,qBAAqB,YAAY,kBAAkB,MAAM;","names":[]}