@workos-inc/widgets 1.7.2 → 1.8.1

package/dist/cjs/lib/copy-button.cjs

@@ -37,6 +37,7 @@ var React = __toESM(require("react"), 1);
 var import_elements = require("./elements.js");
 var import_react_icons = require("@radix-ui/react-icons");
 var import_themes = require("@radix-ui/themes");
+var import_use_translation = require("./i18n/use-translation.js");
 const CopyButton = React.forwardRef(
   function CopyButton2({ value, asChild, children, style, withIcon = false, ...props }, ref) {
     const Comp = asChild ? import_themes.Slot : import_elements.Button;
@@ -49,14 +50,25 @@ const CopyButton = React.forwardRef(
 );
 const CopyIconButton = React.forwardRef(function CopyIconButton2({ value, style, ...props }, ref) {
   const [hasCopied, copy] = useCopy(value);
+  const translate = (0, import_use_translation.useTranslation)();
+  const copiedText = translate({
+    defaultMessage: "Copied",
+    id: "xgUx3Z",
+    description: "Text shown after content has been copied"
+  });
+  const copyToClipboardText = translate({
+    defaultMessage: "Copy to clipboard",
+    id: "h9d9dv",
+    description: "Button text to copy content to clipboard"
+  });
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_elements.IconButton,
     {
       type: "button",
       onPointerUp: copy,
       ref,
-      title: hasCopied ? "Copied" : "Copy to clipboard",
-      "aria-label": "Copy to clipboard",
+      title: hasCopied ? copiedText : copyToClipboardText,
+      "aria-label": copyToClipboardText,
       ...props,
       children: hasCopied ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.CheckIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.CopyIcon, {})
     }

package/dist/cjs/lib/copy-button.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/copy-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { IconButton, Button } from \"./elements.js\";\nimport { CheckIcon, CopyIcon } from \"@radix-ui/react-icons\";\nimport { Slot, Slottable } from \"@radix-ui/themes\";\n\ninterface CopyButtonOwnProps {\n  value: string;\n  withIcon?: boolean;\n}\n\ninterface CopyButtonProps\n  extends CopyButtonOwnProps,\n    Omit<React.ComponentProps<typeof Button>, keyof CopyButtonOwnProps> {}\n\nexport const CopyButton = React.forwardRef<HTMLButtonElement, CopyButtonProps>(\n  function CopyButton(\n    { value, asChild, children, style, withIcon = false, ...props },\n    ref,\n  ) {\n    const Comp = asChild ? Slot : Button;\n    const [hasCopied, copy] = useCopy(value);\n    return (\n      <Comp type=\"button\" onPointerUp={copy} ref={ref} {...props}>\n        {withIcon &&\n          (hasCopied ? <CheckIcon aria-hidden /> : <CopyIcon aria-hidden />)}\n        <Slottable>{children}</Slottable>\n      </Comp>\n    );\n  },\n);\n\ninterface CopyIconButtonOwnProps {\n  value: string;\n}\n\ninterface CopyIconButtonProps\n  extends CopyIconButtonOwnProps,\n    Omit<\n      React.ComponentProps<typeof IconButton>,\n      \"asChild\" | \"children\" | keyof CopyIconButtonOwnProps\n    > {}\n\nexport const CopyIconButton = React.forwardRef<\n  HTMLButtonElement,\n  CopyIconButtonProps\n>(function CopyIconButton({ value, style, ...props }, ref) {\n  const [hasCopied, copy] = useCopy(value);\n  return (\n    <IconButton\n      type=\"button\"\n      onPointerUp={copy}\n      ref={ref}\n      title={hasCopied ? \"Copied\" : \"Copy to clipboard\"}\n      aria-label=\"Copy to clipboard\"\n      {...props}\n    >\n      {hasCopied ? <CheckIcon /> : <CopyIcon />}\n    </IconButton>\n  );\n});\n\nfunction useCopy(value: string) {\n  const [hasCopied, setHasCopied] = React.useState(false);\n  const timeoutRef = React.useRef<number | undefined>(undefined);\n\n  const copy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setHasCopied(true);\n\n      // Clear any existing timeout\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n\n      // Set new timeout\n      timeoutRef.current = window.setTimeout(() => {\n        setHasCopied(false);\n      }, 3000);\n    } catch (err) {\n      console.error(\"Failed to copy text:\", err);\n    }\n  };\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  return [hasCopied, copy] as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBM;AAtBN,YAAuB;AACvB,sBAAmC;AACnC,yBAAoC;AACpC,oBAAgC;AAWzB,MAAM,aAAa,MAAM;AAAA,EAC9B,SAASA,YACP,EAAE,OAAO,SAAS,UAAU,OAAO,WAAW,OAAO,GAAG,MAAM,GAC9D,KACA;AACA,UAAM,OAAO,UAAU,qBAAO;AAC9B,UAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,WACE,6CAAC,QAAK,MAAK,UAAS,aAAa,MAAM,KAAW,GAAG,OAClD;AAAA,mBACE,YAAY,4CAAC,gCAAU,eAAW,MAAC,IAAK,4CAAC,+BAAS,eAAW,MAAC;AAAA,MACjE,4CAAC,2BAAW,UAAS;AAAA,OACvB;AAAA,EAEJ;AACF;AAaO,MAAM,iBAAiB,MAAM,WAGlC,SAASC,gBAAe,EAAE,OAAO,OAAO,GAAG,MAAM,GAAG,KAAK;AACzD,QAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,OAAO,YAAY,WAAW;AAAA,MAC9B,cAAW;AAAA,MACV,GAAG;AAAA,MAEH,sBAAY,4CAAC,gCAAU,IAAK,4CAAC,+BAAS;AAAA;AAAA,EACzC;AAEJ,CAAC;AAED,SAAS,QAAQ,OAAe;AAC9B,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,QAAM,aAAa,MAAM,OAA2B,MAAS;AAE7D,QAAM,OAAO,YAAY;AACvB,QAAI;AACF,YAAM,UAAU,UAAU,UAAU,KAAK;AACzC,mBAAa,IAAI;AAGjB,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAGA,iBAAW,UAAU,OAAO,WAAW,MAAM;AAC3C,qBAAa,KAAK;AAAA,MACpB,GAAG,GAAI;AAAA,IACT,SAAS,KAAK;AACZ,cAAQ,MAAM,wBAAwB,GAAG;AAAA,IAC3C;AAAA,EACF;AAGA,QAAM,UAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,WAAW,IAAI;AACzB;","names":["CopyButton","CopyIconButton"]}
+{"version":3,"sources":["../../../src/lib/copy-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { IconButton, Button } from \"./elements.js\";\nimport { CheckIcon, CopyIcon } from \"@radix-ui/react-icons\";\nimport { Slot, Slottable } from \"@radix-ui/themes\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface CopyButtonOwnProps {\n  value: string;\n  withIcon?: boolean;\n}\n\ninterface CopyButtonProps\n  extends\n    CopyButtonOwnProps,\n    Omit<React.ComponentProps<typeof Button>, keyof CopyButtonOwnProps> {}\n\nexport const CopyButton = React.forwardRef<HTMLButtonElement, CopyButtonProps>(\n  function CopyButton(\n    { value, asChild, children, style, withIcon = false, ...props },\n    ref,\n  ) {\n    const Comp = asChild ? Slot : Button;\n    const [hasCopied, copy] = useCopy(value);\n    return (\n      <Comp type=\"button\" onPointerUp={copy} ref={ref} {...props}>\n        {withIcon &&\n          (hasCopied ? <CheckIcon aria-hidden /> : <CopyIcon aria-hidden />)}\n        <Slottable>{children}</Slottable>\n      </Comp>\n    );\n  },\n);\n\ninterface CopyIconButtonOwnProps {\n  value: string;\n}\n\ninterface CopyIconButtonProps\n  extends\n    CopyIconButtonOwnProps,\n    Omit<\n      React.ComponentProps<typeof IconButton>,\n      \"asChild\" | \"children\" | \"title\" | keyof CopyIconButtonOwnProps\n    > {\n  title?: string;\n}\n\nexport const CopyIconButton = React.forwardRef<\n  HTMLButtonElement,\n  CopyIconButtonProps\n>(function CopyIconButton({ value, style, ...props }, ref) {\n  const [hasCopied, copy] = useCopy(value);\n  const translate = useTranslation();\n  const copiedText = translate({\n    defaultMessage: \"Copied\",\n    id: \"xgUx3Z\",\n    description: \"Text shown after content has been copied\",\n  });\n  const copyToClipboardText = translate({\n    defaultMessage: \"Copy to clipboard\",\n    id: \"h9d9dv\",\n    description: \"Button text to copy content to clipboard\",\n  });\n  return (\n    <IconButton\n      type=\"button\"\n      onPointerUp={copy}\n      ref={ref}\n      title={hasCopied ? copiedText : copyToClipboardText}\n      aria-label={copyToClipboardText}\n      {...props}\n    >\n      {hasCopied ? <CheckIcon /> : <CopyIcon />}\n    </IconButton>\n  );\n});\n\nfunction useCopy(value: string) {\n  const [hasCopied, setHasCopied] = React.useState(false);\n  const timeoutRef = React.useRef<number | undefined>(undefined);\n\n  const copy = async () => {\n    try {\n      await navigator.clipboard.writeText(value);\n      setHasCopied(true);\n\n      // Clear any existing timeout\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n\n      // Set new timeout\n      timeoutRef.current = window.setTimeout(() => {\n        setHasCopied(false);\n      }, 3000);\n    } catch (err) {\n      console.error(\"Failed to copy text:\", err);\n    }\n  };\n\n  // Cleanup timeout on unmount\n  React.useEffect(() => {\n    return () => {\n      if (timeoutRef.current) {\n        window.clearTimeout(timeoutRef.current);\n      }\n    };\n  }, []);\n\n  return [hasCopied, copy] as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBM;AAxBN,YAAuB;AACvB,sBAAmC;AACnC,yBAAoC;AACpC,oBAAgC;AAChC,6BAA+B;AAYxB,MAAM,aAAa,MAAM;AAAA,EAC9B,SAASA,YACP,EAAE,OAAO,SAAS,UAAU,OAAO,WAAW,OAAO,GAAG,MAAM,GAC9D,KACA;AACA,UAAM,OAAO,UAAU,qBAAO;AAC9B,UAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,WACE,6CAAC,QAAK,MAAK,UAAS,aAAa,MAAM,KAAW,GAAG,OAClD;AAAA,mBACE,YAAY,4CAAC,gCAAU,eAAW,MAAC,IAAK,4CAAC,+BAAS,eAAW,MAAC;AAAA,MACjE,4CAAC,2BAAW,UAAS;AAAA,OACvB;AAAA,EAEJ;AACF;AAgBO,MAAM,iBAAiB,MAAM,WAGlC,SAASC,gBAAe,EAAE,OAAO,OAAO,GAAG,MAAM,GAAG,KAAK;AACzD,QAAM,CAAC,WAAW,IAAI,IAAI,QAAQ,KAAK;AACvC,QAAM,gBAAY,uCAAe;AACjC,QAAM,aAAa,UAAU;AAAA,IAC3B,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,QAAM,sBAAsB,UAAU;AAAA,IACpC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAa;AAAA,MACb;AAAA,MACA,OAAO,YAAY,aAAa;AAAA,MAChC,cAAY;AAAA,MACX,GAAG;AAAA,MAEH,sBAAY,4CAAC,gCAAU,IAAK,4CAAC,+BAAS;AAAA;AAAA,EACzC;AAEJ,CAAC;AAED,SAAS,QAAQ,OAAe;AAC9B,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,QAAM,aAAa,MAAM,OAA2B,MAAS;AAE7D,QAAM,OAAO,YAAY;AACvB,QAAI;AACF,YAAM,UAAU,UAAU,UAAU,KAAK;AACzC,mBAAa,IAAI;AAGjB,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAGA,iBAAW,UAAU,OAAO,WAAW,MAAM;AAC3C,qBAAa,KAAK;AAAA,MACpB,GAAG,GAAI;AAAA,IACT,SAAS,KAAK;AACZ,cAAQ,MAAM,wBAAwB,GAAG;AAAA,IAC3C;AAAA,EACF;AAGA,QAAM,UAAU,MAAM;AACpB,WAAO,MAAM;AACX,UAAI,WAAW,SAAS;AACtB,eAAO,aAAa,WAAW,OAAO;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO,CAAC,WAAW,IAAI;AACzB;","names":["CopyButton","CopyIconButton"]}

package/dist/cjs/lib/copy-button.d.cts

@@ -21,7 +21,8 @@ declare const CopyButton: React.ForwardRefExoticComponent<Omit<CopyButtonProps,
 interface CopyIconButtonOwnProps {
     value: string;
 }
-interface CopyIconButtonProps extends CopyIconButtonOwnProps, Omit<React.ComponentProps<typeof IconButton>, "asChild" | "children" | keyof CopyIconButtonOwnProps> {
+interface CopyIconButtonProps extends CopyIconButtonOwnProps, Omit<React.ComponentProps<typeof IconButton>, "asChild" | "children" | "title" | keyof CopyIconButtonOwnProps> {
+    title?: string;
 }
 declare const CopyIconButton: React.ForwardRefExoticComponent<Omit<CopyIconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 

package/dist/cjs/lib/delete-domain-dialog.cjs

@@ -25,29 +25,41 @@ module.exports = __toCommonJS(delete_domain_dialog_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_themes = require("@radix-ui/themes");
 var import_elements = require("./elements.js");
+var import_translation = require("./i18n/translation.js");
 const DeleteDomainDialog = (props) => {
   const message = (() => {
     switch (props.domain.state) {
       case "Verified":
       case "LegacyVerified":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Text, { size: "2", children: [
-          "Users with the email domain ",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }),
-          " will no longer be considered verified. This action is immediate and cannot be undone."
-        ] }) });
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Users with the email domain {domain} will no longer be considered verified. This action is immediate and cannot be undone.",
+            id: "HPEjJe",
+            description: "Warning message for removing a verified domain",
+            values: { domain: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }) }
+          }
+        ) }) });
       case "Failed":
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Text, { children: [
-          "Are you sure you want to remove the domain",
-          " ",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }),
-          "? This action is immediate and cannot be undone."
-        ] }) });
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Are you sure you want to remove the domain {domain}? This action is immediate and cannot be undone.",
+            id: "ig3G/s",
+            description: "Warning message for removing a failed domain",
+            values: { domain: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }) }
+          }
+        ) }) });
       default:
-        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Text, { children: [
-          "Removing ",
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }),
-          " will cancel the DNS record verification process. This action is immediate and cannot be undone."
-        ] }) });
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Removing {domain} will cancel the DNS record verification process. This action is immediate and cannot be undone.",
+            id: "zx2oPb",
+            description: "Warning message for removing a domain in verification",
+            values: { domain: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("b", { children: props.domain.domain }) }
+          }
+        ) }) });
     }
   })();
   const handleDeleteDomain = () => {
@@ -57,11 +69,32 @@ const DeleteDomainDialog = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_elements.AlertDialog.Root, { open: props.open, onOpenChange: props.onOpenChange, children: [
     props.children && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Trigger, { children: props.children }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_elements.AlertDialog.Content, { style: { maxWidth: "488px" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Title, { mb: "2", children: "Remove domain" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Title, { mb: "2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_translation.Translation,
+        {
+          defaultMessage: "Remove domain",
+          id: "0stiTP",
+          description: "Dialog title for removing a domain"
+        }
+      ) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Description, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", highContrast: true, children: message }) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { justify: "end", gap: "2", mt: "5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Cancel, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "secondary", children: "Cancel" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "destructive", onClick: handleDeleteDomain, children: "Remove domain" })
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Cancel, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "secondary", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Cancel",
+            id: "hHNj31",
+            description: "Cancel button text"
+          }
+        ) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "destructive", onClick: handleDeleteDomain, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Remove domain",
+            id: "OkjVyP",
+            description: "Confirm button text to remove domain"
+          }
+        ) })
       ] })
     ] })
   ] });

package/dist/cjs/lib/delete-domain-dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/delete-domain-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Flex, Text } from \"@radix-ui/themes\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { AlertDialog, Button } from \"./elements.js\";\n\ninterface DeleteDomainDialogProps {\n  children?: React.ReactNode;\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n}\n\nexport const DeleteDomainDialog = (props: DeleteDomainDialogProps) => {\n  const message = (() => {\n    switch (props.domain.state) {\n      case \"Verified\":\n      case \"LegacyVerified\":\n        return (\n          <>\n            <Text size=\"2\">\n              Users with the email domain <b>{props.domain.domain}</b> will no\n              longer be considered verified. This action is immediate and cannot\n              be undone.\n            </Text>\n          </>\n        );\n      case \"Failed\":\n        return (\n          <>\n            <Text>\n              Are you sure you want to remove the domain{\" \"}\n              <b>{props.domain.domain}</b>? This action is immediate and cannot\n              be undone.\n            </Text>\n          </>\n        );\n      default:\n        return (\n          <>\n            <Text>\n              Removing <b>{props.domain.domain}</b> will cancel the DNS record\n              verification process. This action is immediate and cannot be\n              undone.\n            </Text>\n          </>\n        );\n    }\n  })();\n\n  const handleDeleteDomain = () => {\n    props.onDeleteDomain(props.domain.id);\n    props.onOpenChange(false);\n  };\n\n  return (\n    <AlertDialog.Root open={props.open} onOpenChange={props.onOpenChange}>\n      {props.children && (\n        <AlertDialog.Trigger>{props.children}</AlertDialog.Trigger>\n      )}\n\n      <AlertDialog.Content style={{ maxWidth: \"488px\" }}>\n        <AlertDialog.Title mb=\"2\">Remove domain</AlertDialog.Title>\n        <AlertDialog.Description>\n          <Text size=\"2\" highContrast>\n            {message}\n          </Text>\n        </AlertDialog.Description>\n        <Flex justify=\"end\" gap=\"2\" mt=\"5\">\n          <AlertDialog.Cancel>\n            <Button variant=\"secondary\">Cancel</Button>\n          </AlertDialog.Cancel>\n          <Button variant=\"destructive\" onClick={handleDeleteDomain}>\n            Remove domain\n          </Button>\n        </Flex>\n      </AlertDialog.Content>\n    </AlertDialog.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBU;AAlBV,oBAA2B;AAE3B,sBAAoC;AAU7B,MAAM,qBAAqB,CAAC,UAAmC;AACpE,QAAM,WAAW,MAAM;AACrB,YAAQ,MAAM,OAAO,OAAO;AAAA,MAC1B,KAAK;AAAA,MACL,KAAK;AACH,eACE,2EACE,uDAAC,sBAAK,MAAK,KAAI;AAAA;AAAA,UACe,4CAAC,OAAG,gBAAM,OAAO,QAAO;AAAA,UAAI;AAAA,WAG1D,GACF;AAAA,MAEJ,KAAK;AACH,eACE,2EACE,uDAAC,sBAAK;AAAA;AAAA,UACuC;AAAA,UAC3C,4CAAC,OAAG,gBAAM,OAAO,QAAO;AAAA,UAAI;AAAA,WAE9B,GACF;AAAA,MAEJ;AACE,eACE,2EACE,uDAAC,sBAAK;AAAA;AAAA,UACK,4CAAC,OAAG,gBAAM,OAAO,QAAO;AAAA,UAAI;AAAA,WAGvC,GACF;AAAA,IAEN;AAAA,EACF,GAAG;AAEH,QAAM,qBAAqB,MAAM;AAC/B,UAAM,eAAe,MAAM,OAAO,EAAE;AACpC,UAAM,aAAa,KAAK;AAAA,EAC1B;AAEA,SACE,6CAAC,4BAAY,MAAZ,EAAiB,MAAM,MAAM,MAAM,cAAc,MAAM,cACrD;AAAA,UAAM,YACL,4CAAC,4BAAY,SAAZ,EAAqB,gBAAM,UAAS;AAAA,IAGvC,6CAAC,4BAAY,SAAZ,EAAoB,OAAO,EAAE,UAAU,QAAQ,GAC9C;AAAA,kDAAC,4BAAY,OAAZ,EAAkB,IAAG,KAAI,2BAAa;AAAA,MACvC,4CAAC,4BAAY,aAAZ,EACC,sDAAC,sBAAK,MAAK,KAAI,cAAY,MACxB,mBACH,GACF;AAAA,MACA,6CAAC,sBAAK,SAAQ,OAAM,KAAI,KAAI,IAAG,KAC7B;AAAA,oDAAC,4BAAY,QAAZ,EACC,sDAAC,0BAAO,SAAQ,aAAY,oBAAM,GACpC;AAAA,QACA,4CAAC,0BAAO,SAAQ,eAAc,SAAS,oBAAoB,2BAE3D;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/lib/delete-domain-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Flex, Text } from \"@radix-ui/themes\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { AlertDialog, Button } from \"./elements.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface DeleteDomainDialogProps {\n  children?: React.ReactNode;\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n}\n\nexport const DeleteDomainDialog = (props: DeleteDomainDialogProps) => {\n  const message = (() => {\n    switch (props.domain.state) {\n      case \"Verified\":\n      case \"LegacyVerified\":\n        return (\n          <>\n            <Text size=\"2\">\n              <Translation\n                defaultMessage=\"Users with the email domain {domain} will no longer be considered verified. This action is immediate and cannot be undone.\"\n                id=\"HPEjJe\"\n                description=\"Warning message for removing a verified domain\"\n                values={{ domain: <b>{props.domain.domain}</b> }}\n              />\n            </Text>\n          </>\n        );\n      case \"Failed\":\n        return (\n          <>\n            <Text>\n              <Translation\n                defaultMessage=\"Are you sure you want to remove the domain {domain}? This action is immediate and cannot be undone.\"\n                id=\"ig3G/s\"\n                description=\"Warning message for removing a failed domain\"\n                values={{ domain: <b>{props.domain.domain}</b> }}\n              />\n            </Text>\n          </>\n        );\n      default:\n        return (\n          <>\n            <Text>\n              <Translation\n                defaultMessage=\"Removing {domain} will cancel the DNS record verification process. This action is immediate and cannot be undone.\"\n                id=\"zx2oPb\"\n                description=\"Warning message for removing a domain in verification\"\n                values={{ domain: <b>{props.domain.domain}</b> }}\n              />\n            </Text>\n          </>\n        );\n    }\n  })();\n\n  const handleDeleteDomain = () => {\n    props.onDeleteDomain(props.domain.id);\n    props.onOpenChange(false);\n  };\n\n  return (\n    <AlertDialog.Root open={props.open} onOpenChange={props.onOpenChange}>\n      {props.children && (\n        <AlertDialog.Trigger>{props.children}</AlertDialog.Trigger>\n      )}\n\n      <AlertDialog.Content style={{ maxWidth: \"488px\" }}>\n        <AlertDialog.Title mb=\"2\">\n          <Translation\n            defaultMessage=\"Remove domain\"\n            id=\"0stiTP\"\n            description=\"Dialog title for removing a domain\"\n          />\n        </AlertDialog.Title>\n        <AlertDialog.Description>\n          <Text size=\"2\" highContrast>\n            {message}\n          </Text>\n        </AlertDialog.Description>\n        <Flex justify=\"end\" gap=\"2\" mt=\"5\">\n          <AlertDialog.Cancel>\n            <Button variant=\"secondary\">\n              <Translation\n                defaultMessage=\"Cancel\"\n                id=\"hHNj31\"\n                description=\"Cancel button text\"\n              />\n            </Button>\n          </AlertDialog.Cancel>\n          <Button variant=\"destructive\" onClick={handleDeleteDomain}>\n            <Translation\n              defaultMessage=\"Remove domain\"\n              id=\"OkjVyP\"\n              description=\"Confirm button text to remove domain\"\n            />\n          </Button>\n        </Flex>\n      </AlertDialog.Content>\n    </AlertDialog.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBU;AAnBV,oBAA2B;AAE3B,sBAAoC;AACpC,yBAA4B;AAUrB,MAAM,qBAAqB,CAAC,UAAmC;AACpE,QAAM,WAAW,MAAM;AACrB,YAAQ,MAAM,OAAO,OAAO;AAAA,MAC1B,KAAK;AAAA,MACL,KAAK;AACH,eACE,2EACE,sDAAC,sBAAK,MAAK,KACT;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA,YACZ,QAAQ,EAAE,QAAQ,4CAAC,OAAG,gBAAM,OAAO,QAAO,EAAK;AAAA;AAAA,QACjD,GACF,GACF;AAAA,MAEJ,KAAK;AACH,eACE,2EACE,sDAAC,sBACC;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA,YACZ,QAAQ,EAAE,QAAQ,4CAAC,OAAG,gBAAM,OAAO,QAAO,EAAK;AAAA;AAAA,QACjD,GACF,GACF;AAAA,MAEJ;AACE,eACE,2EACE,sDAAC,sBACC;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA,YACZ,QAAQ,EAAE,QAAQ,4CAAC,OAAG,gBAAM,OAAO,QAAO,EAAK;AAAA;AAAA,QACjD,GACF,GACF;AAAA,IAEN;AAAA,EACF,GAAG;AAEH,QAAM,qBAAqB,MAAM;AAC/B,UAAM,eAAe,MAAM,OAAO,EAAE;AACpC,UAAM,aAAa,KAAK;AAAA,EAC1B;AAEA,SACE,6CAAC,4BAAY,MAAZ,EAAiB,MAAM,MAAM,MAAM,cAAc,MAAM,cACrD;AAAA,UAAM,YACL,4CAAC,4BAAY,SAAZ,EAAqB,gBAAM,UAAS;AAAA,IAGvC,6CAAC,4BAAY,SAAZ,EAAoB,OAAO,EAAE,UAAU,QAAQ,GAC9C;AAAA,kDAAC,4BAAY,OAAZ,EAAkB,IAAG,KACpB;AAAA,QAAC;AAAA;AAAA,UACC,gBAAe;AAAA,UACf,IAAG;AAAA,UACH,aAAY;AAAA;AAAA,MACd,GACF;AAAA,MACA,4CAAC,4BAAY,aAAZ,EACC,sDAAC,sBAAK,MAAK,KAAI,cAAY,MACxB,mBACH,GACF;AAAA,MACA,6CAAC,sBAAK,SAAQ,OAAM,KAAI,KAAI,IAAG,KAC7B;AAAA,oDAAC,4BAAY,QAAZ,EACC,sDAAC,0BAAO,SAAQ,aACd;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA;AAAA,QACd,GACF,GACF;AAAA,QACA,4CAAC,0BAAO,SAAQ,eAAc,SAAS,oBACrC;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA;AAAA,QACd,GACF;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/cjs/lib/delete-user-dialog.cjs

@@ -1,8 +1,10 @@
 "use strict";
 "use client";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -16,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var delete_user_dialog_exports = {};
 __export(delete_user_dialog_exports, {
@@ -23,17 +33,18 @@ __export(delete_user_dialog_exports, {
 });
 module.exports = __toCommonJS(delete_user_dialog_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"), 1);
 var import_themes = require("@radix-ui/themes");
-var import_react = require("react");
 var import_user = require("./api/user.js");
 var import_elements = require("./elements.js");
+var import_translation = require("./i18n/translation.js");
 function DeleteUserDialog({
   children,
   user,
   ...props
 }) {
   const deleteUser = (0, import_user.useDeleteUser)();
-  const inputRef = (0, import_react.useRef)(null);
+  const inputRef = React.useRef(null);
   const onSubmitForm = () => {
     deleteUser.mutate(
       { userId: user.id },
@@ -56,13 +67,23 @@ function DeleteUserDialog({
           });
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Title, { children: "Remove user" }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Flex, { direction: "column", gap: "3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_elements.AlertDialog.Description, { children: [
-            "Are you sure you want to remove",
-            " ",
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { weight: "bold", children: user.email }),
-            "? This action is immediate and cannot be undone."
-          ] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Title, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_translation.Translation,
+            {
+              defaultMessage: "Remove user",
+              id: "N8aD60",
+              description: "Dialog title for removing a user"
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Flex, { direction: "column", gap: "3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Description, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            import_translation.Translation,
+            {
+              defaultMessage: "Are you sure you want to remove {email}? This action is immediate and cannot be undone.",
+              id: "4zDwGl",
+              description: "Warning message for removing a user",
+              values: { email: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { weight: "bold", children: user.email }) }
+            }
+          ) }) }),
           deleteUser.error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Callout.Root, { color: "red", mt: "4", mb: "-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Callout.Text, { children: getMutationErrorMessage(deleteUser.error) }) }) : null,
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Flex, { gap: "3", justify: "end", mt: "5", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
             "form",
@@ -72,14 +93,28 @@ function DeleteUserDialog({
                 onSubmitForm();
               },
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Cancel, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "secondary", disabled: deleteUser.isPending, children: "Cancel" }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.AlertDialog.Cancel, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.Button, { variant: "secondary", disabled: deleteUser.isPending, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  import_translation.Translation,
+                  {
+                    defaultMessage: "Cancel",
+                    id: "hHNj31",
+                    description: "Cancel button text"
+                  }
+                ) }) }),
                 /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
                   import_elements.Button,
                   {
                     variant: "destructive",
                     type: "submit",
                     loading: deleteUser.isPending,
-                    children: "Remove"
+                    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                      import_translation.Translation,
+                      {
+                        defaultMessage: "Remove",
+                        id: "DJXWAJ",
+                        description: "Confirm button text to remove user"
+                      }
+                    )
                   }
                 )
               ]

package/dist/cjs/lib/delete-user-dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/delete-user-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport { type ReactNode, useRef } from \"react\";\nimport { useDeleteUser } from \"./api/user.js\";\nimport { AlertDialog, Button } from \"./elements.js\";\nimport { Member } from \"../api/endpoint.js\";\n\ninterface DeleteUserDialogProps extends AlertDialog.RootProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  user: Member;\n  children?: ReactNode;\n}\n\nexport function DeleteUserDialog({\n  children,\n  user,\n  ...props\n}: DeleteUserDialogProps) {\n  const deleteUser = useDeleteUser();\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const onSubmitForm = () => {\n    deleteUser.mutate(\n      { userId: user.id },\n      {\n        onSuccess: () => {\n          props.onOpenChange(false);\n        },\n      },\n    );\n  };\n\n  return (\n    <AlertDialog.Root {...props}>\n      {children && <AlertDialog.Trigger>{children}</AlertDialog.Trigger>}\n\n      <AlertDialog.Content\n        maxWidth=\"480px\"\n        onOpenAutoFocus={() => {\n          requestAnimationFrame(() => {\n            inputRef.current?.focus();\n          });\n        }}\n      >\n        <AlertDialog.Title>Remove user</AlertDialog.Title>\n        <Flex direction=\"column\" gap=\"3\">\n          <AlertDialog.Description>\n            Are you sure you want to remove{\" \"}\n            <Text weight=\"bold\">{user.email}</Text>? This action is immediate\n            and cannot be undone.\n          </AlertDialog.Description>\n        </Flex>\n\n        {deleteUser.error ? (\n          <Callout.Root color=\"red\" mt=\"4\" mb=\"-2\">\n            <Callout.Text>\n              {getMutationErrorMessage(deleteUser.error)}\n            </Callout.Text>\n          </Callout.Root>\n        ) : null}\n\n        <Flex gap=\"3\" justify=\"end\" mt=\"5\" asChild>\n          <form\n            onSubmit={(event) => {\n              event.preventDefault();\n              onSubmitForm();\n            }}\n          >\n            <AlertDialog.Cancel>\n              <Button variant=\"secondary\" disabled={deleteUser.isPending}>\n                Cancel\n              </Button>\n            </AlertDialog.Cancel>\n\n            <Button\n              variant=\"destructive\"\n              type=\"submit\"\n              loading={deleteUser.isPending}\n            >\n              Remove\n            </Button>\n          </form>\n        </Flex>\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(deleteUser.error)}\n          </section>\n        </VisuallyHidden>\n      </AlertDialog.Content>\n    </AlertDialog.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (!error) {\n    return null;\n  }\n  // TODO Handle server errors\n  return \"There was an error removing the user. Please try again.\";\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCmB;AAlCnB,oBAAoD;AACpD,mBAAuC;AACvC,kBAA8B;AAC9B,sBAAoC;AAU7B,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,iBAAa,2BAAc;AACjC,QAAM,eAAW,qBAAyB,IAAI;AAE9C,QAAM,eAAe,MAAM;AACzB,eAAW;AAAA,MACT,EAAE,QAAQ,KAAK,GAAG;AAAA,MAClB;AAAA,QACE,WAAW,MAAM;AACf,gBAAM,aAAa,KAAK;AAAA,QAC1B;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,SACE,6CAAC,4BAAY,MAAZ,EAAkB,GAAG,OACnB;AAAA,gBAAY,4CAAC,4BAAY,SAAZ,EAAqB,UAAS;AAAA,IAE5C;AAAA,MAAC,4BAAY;AAAA,MAAZ;AAAA,QACC,UAAS;AAAA,QACT,iBAAiB,MAAM;AACrB,gCAAsB,MAAM;AAC1B,qBAAS,SAAS,MAAM;AAAA,UAC1B,CAAC;AAAA,QACH;AAAA,QAEA;AAAA,sDAAC,4BAAY,OAAZ,EAAkB,yBAAW;AAAA,UAC9B,4CAAC,sBAAK,WAAU,UAAS,KAAI,KAC3B,uDAAC,4BAAY,aAAZ,EAAwB;AAAA;AAAA,YACS;AAAA,YAChC,4CAAC,sBAAK,QAAO,QAAQ,eAAK,OAAM;AAAA,YAAO;AAAA,aAEzC,GACF;AAAA,UAEC,WAAW,QACV,4CAAC,sBAAQ,MAAR,EAAa,OAAM,OAAM,IAAG,KAAI,IAAG,MAClC,sDAAC,sBAAQ,MAAR,EACE,kCAAwB,WAAW,KAAK,GAC3C,GACF,IACE;AAAA,UAEJ,4CAAC,sBAAK,KAAI,KAAI,SAAQ,OAAM,IAAG,KAAI,SAAO,MACxC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU,CAAC,UAAU;AACnB,sBAAM,eAAe;AACrB,6BAAa;AAAA,cACf;AAAA,cAEA;AAAA,4DAAC,4BAAY,QAAZ,EACC,sDAAC,0BAAO,SAAQ,aAAY,UAAU,WAAW,WAAW,oBAE5D,GACF;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAQ;AAAA,oBACR,MAAK;AAAA,oBACL,SAAS,WAAW;AAAA,oBACrB;AAAA;AAAA,gBAED;AAAA;AAAA;AAAA,UACF,GACF;AAAA,UAEA,4CAAC,gCAAe,SAAO,MACrB,sDAAC,aAAQ,aAAU,UAChB,kCAAwB,WAAW,KAAK,GAC3C,GACF;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,SAAS,wBAAwB,OAAgB;AAC/C,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../../src/lib/delete-user-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Callout, Flex, Text, VisuallyHidden } from \"@radix-ui/themes\";\nimport { useDeleteUser } from \"./api/user.js\";\nimport { AlertDialog, Button } from \"./elements.js\";\nimport { Member } from \"../api/endpoint.js\";\nimport { Translation } from \"./i18n/translation.js\";\n\ninterface DeleteUserDialogProps extends AlertDialog.RootProps {\n  open: boolean;\n  onOpenChange: (open: boolean) => void;\n  user: Member;\n  children?: React.ReactNode;\n}\n\nexport function DeleteUserDialog({\n  children,\n  user,\n  ...props\n}: DeleteUserDialogProps) {\n  const deleteUser = useDeleteUser();\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const onSubmitForm = () => {\n    deleteUser.mutate(\n      { userId: user.id },\n      {\n        onSuccess: () => {\n          props.onOpenChange(false);\n        },\n      },\n    );\n  };\n\n  return (\n    <AlertDialog.Root {...props}>\n      {children && <AlertDialog.Trigger>{children}</AlertDialog.Trigger>}\n\n      <AlertDialog.Content\n        maxWidth=\"480px\"\n        onOpenAutoFocus={() => {\n          requestAnimationFrame(() => {\n            inputRef.current?.focus();\n          });\n        }}\n      >\n        <AlertDialog.Title>\n          <Translation\n            defaultMessage=\"Remove user\"\n            id=\"N8aD60\"\n            description=\"Dialog title for removing a user\"\n          />\n        </AlertDialog.Title>\n        <Flex direction=\"column\" gap=\"3\">\n          <AlertDialog.Description>\n            <Translation\n              defaultMessage=\"Are you sure you want to remove {email}? This action is immediate and cannot be undone.\"\n              id=\"4zDwGl\"\n              description=\"Warning message for removing a user\"\n              values={{ email: <Text weight=\"bold\">{user.email}</Text> }}\n            />\n          </AlertDialog.Description>\n        </Flex>\n\n        {deleteUser.error ? (\n          <Callout.Root color=\"red\" mt=\"4\" mb=\"-2\">\n            <Callout.Text>\n              {getMutationErrorMessage(deleteUser.error)}\n            </Callout.Text>\n          </Callout.Root>\n        ) : null}\n\n        <Flex gap=\"3\" justify=\"end\" mt=\"5\" asChild>\n          <form\n            onSubmit={(event) => {\n              event.preventDefault();\n              onSubmitForm();\n            }}\n          >\n            <AlertDialog.Cancel>\n              <Button variant=\"secondary\" disabled={deleteUser.isPending}>\n                <Translation\n                  defaultMessage=\"Cancel\"\n                  id=\"hHNj31\"\n                  description=\"Cancel button text\"\n                />\n              </Button>\n            </AlertDialog.Cancel>\n\n            <Button\n              variant=\"destructive\"\n              type=\"submit\"\n              loading={deleteUser.isPending}\n            >\n              <Translation\n                defaultMessage=\"Remove\"\n                id=\"DJXWAJ\"\n                description=\"Confirm button text to remove user\"\n              />\n            </Button>\n          </form>\n        </Flex>\n        {/* mirror errors in a live region */}\n        <VisuallyHidden asChild>\n          <section aria-live=\"polite\">\n            {getMutationErrorMessage(deleteUser.error)}\n          </section>\n        </VisuallyHidden>\n      </AlertDialog.Content>\n    </AlertDialog.Root>\n  );\n}\n\nfunction getMutationErrorMessage(error: unknown) {\n  if (!error) {\n    return null;\n  }\n  // TODO Handle server errors\n  return \"There was an error removing the user. Please try again.\";\n}\n\n// Note: Error messages in getMutationErrorMessage are kept as plain strings\n// since they are displayed dynamically\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCmB;AAnCnB,YAAuB;AACvB,oBAAoD;AACpD,kBAA8B;AAC9B,sBAAoC;AAEpC,yBAA4B;AASrB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA0B;AACxB,QAAM,iBAAa,2BAAc;AACjC,QAAM,WAAW,MAAM,OAAyB,IAAI;AAEpD,QAAM,eAAe,MAAM;AACzB,eAAW;AAAA,MACT,EAAE,QAAQ,KAAK,GAAG;AAAA,MAClB;AAAA,QACE,WAAW,MAAM;AACf,gBAAM,aAAa,KAAK;AAAA,QAC1B;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,SACE,6CAAC,4BAAY,MAAZ,EAAkB,GAAG,OACnB;AAAA,gBAAY,4CAAC,4BAAY,SAAZ,EAAqB,UAAS;AAAA,IAE5C;AAAA,MAAC,4BAAY;AAAA,MAAZ;AAAA,QACC,UAAS;AAAA,QACT,iBAAiB,MAAM;AACrB,gCAAsB,MAAM;AAC1B,qBAAS,SAAS,MAAM;AAAA,UAC1B,CAAC;AAAA,QACH;AAAA,QAEA;AAAA,sDAAC,4BAAY,OAAZ,EACC;AAAA,YAAC;AAAA;AAAA,cACC,gBAAe;AAAA,cACf,IAAG;AAAA,cACH,aAAY;AAAA;AAAA,UACd,GACF;AAAA,UACA,4CAAC,sBAAK,WAAU,UAAS,KAAI,KAC3B,sDAAC,4BAAY,aAAZ,EACC;AAAA,YAAC;AAAA;AAAA,cACC,gBAAe;AAAA,cACf,IAAG;AAAA,cACH,aAAY;AAAA,cACZ,QAAQ,EAAE,OAAO,4CAAC,sBAAK,QAAO,QAAQ,eAAK,OAAM,EAAQ;AAAA;AAAA,UAC3D,GACF,GACF;AAAA,UAEC,WAAW,QACV,4CAAC,sBAAQ,MAAR,EAAa,OAAM,OAAM,IAAG,KAAI,IAAG,MAClC,sDAAC,sBAAQ,MAAR,EACE,kCAAwB,WAAW,KAAK,GAC3C,GACF,IACE;AAAA,UAEJ,4CAAC,sBAAK,KAAI,KAAI,SAAQ,OAAM,IAAG,KAAI,SAAO,MACxC;AAAA,YAAC;AAAA;AAAA,cACC,UAAU,CAAC,UAAU;AACnB,sBAAM,eAAe;AACrB,6BAAa;AAAA,cACf;AAAA,cAEA;AAAA,4DAAC,4BAAY,QAAZ,EACC,sDAAC,0BAAO,SAAQ,aAAY,UAAU,WAAW,WAC/C;AAAA,kBAAC;AAAA;AAAA,oBACC,gBAAe;AAAA,oBACf,IAAG;AAAA,oBACH,aAAY;AAAA;AAAA,gBACd,GACF,GACF;AAAA,gBAEA;AAAA,kBAAC;AAAA;AAAA,oBACC,SAAQ;AAAA,oBACR,MAAK;AAAA,oBACL,SAAS,WAAW;AAAA,oBAEpB;AAAA,sBAAC;AAAA;AAAA,wBACC,gBAAe;AAAA,wBACf,IAAG;AAAA,wBACH,aAAY;AAAA;AAAA,oBACd;AAAA;AAAA,gBACF;AAAA;AAAA;AAAA,UACF,GACF;AAAA,UAEA,4CAAC,gCAAe,SAAO,MACrB,sDAAC,aAAQ,aAAU,UAChB,kCAAwB,WAAW,KAAK,GAC3C,GACF;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,SAAS,wBAAwB,OAAgB;AAC/C,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SAAO;AACT;","names":[]}

package/dist/cjs/lib/delete-user-dialog.d.cts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode } from 'react';
+import * as React from 'react';
 import { RootProps } from '@radix-ui/themes/components/alert-dialog';
 import { Member } from '../api/endpoint.cjs';
 import '@tanstack/react-query';
@@ -9,7 +9,7 @@ interface DeleteUserDialogProps extends RootProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
     user: Member;
-    children?: ReactNode;
+    children?: React.ReactNode;
 }
 declare function DeleteUserDialog({ children, user, ...props }: DeleteUserDialogProps): react_jsx_runtime.JSX.Element;
 

package/dist/cjs/lib/domain-actions.cjs

@@ -1,8 +1,10 @@
 "use strict";
 "use client";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -16,6 +18,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var domain_actions_exports = {};
 __export(domain_actions_exports, {
@@ -23,18 +33,31 @@ __export(domain_actions_exports, {
 });
 module.exports = __toCommonJS(domain_actions_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
+var React = __toESM(require("react"), 1);
 var import_react_icons = require("@radix-ui/react-icons");
 var import_view_dns_record_dialog = require("./view-dns-record-dialog.js");
 var import_delete_domain_dialog = require("./delete-domain-dialog.js");
 var import_elements = require("./elements.js");
+var import_translation = require("./i18n/translation.js");
+var import_use_translation = require("./i18n/use-translation.js");
 const DomainActions = ({
   domain,
   onDeleteDomain,
   onReverifyDomain
 }) => {
-  const [viewDnsDialogOpen, setViewDnsDialogOpen] = (0, import_react.useState)(false);
-  const [deleteDialogOpen, setDeleteDialogOpen] = (0, import_react.useState)(false);
+  const [viewDnsDialogOpen, setViewDnsDialogOpen] = React.useState(false);
+  const [deleteDialogOpen, setDeleteDialogOpen] = React.useState(false);
+  const translate = (0, import_use_translation.useTranslation)();
+  const removeDomainTitle = translate({
+    defaultMessage: "Remove domain",
+    id: "Cf+uSR",
+    description: "Title for remove domain button"
+  });
+  const domainActionsTitle = translate({
+    defaultMessage: "Domain actions",
+    id: "l1mz5q",
+    description: "Title for domain actions dropdown button"
+  });
   if (domain.state === "Verified") {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_delete_domain_dialog.DeleteDomainDialog,
@@ -43,21 +66,42 @@ const DomainActions = ({
         onDeleteDomain,
         open: deleteDialogOpen,
         onOpenChange: setDeleteDialogOpen,
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.IconButton, { "aria-label": "Remove domain", title: "Remove domain", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.TrashIcon, {}) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.IconButton, { title: removeDomainTitle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.TrashIcon, {}) })
       }
     ) });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_elements.DropdownMenu.Root, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.DropdownMenu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.IconButton, { "aria-label": "Domain actions", title: "Domain actions", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.DotsHorizontalIcon, {}) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.DropdownMenu.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.IconButton, { title: domainActionsTitle, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_icons.DotsHorizontalIcon, {}) }) }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_elements.DropdownMenu.Content, { side: "bottom", align: "end", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.DropdownMenu.Item, { onClick: () => setViewDnsDialogOpen(true), children: domain.state === "Failed" ? "Restart verification" : "View DNS record" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_elements.DropdownMenu.Item, { onClick: () => setViewDnsDialogOpen(true), children: domain.state === "Failed" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "Restart verification",
+            id: "ZJYAji",
+            description: "Menu option to restart domain verification"
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_translation.Translation,
+          {
+            defaultMessage: "View DNS record",
+            id: "74JScV",
+            description: "Menu option to view DNS record"
+          }
+        ) }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_elements.DropdownMenu.Item,
           {
             variant: "destructive",
             onClick: () => setDeleteDialogOpen(true),
-            children: "Remove domain"
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              import_translation.Translation,
+              {
+                defaultMessage: "Remove domain",
+                id: "cO5+D2",
+                description: "Menu option to remove a domain"
+              }
+            )
           }
         )
       ] })

package/dist/cjs/lib/domain-actions.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/domain-actions.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { useState } from \"react\";\nimport { DotsHorizontalIcon, TrashIcon } from \"@radix-ui/react-icons\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { ViewDnsRecordDialog } from \"./view-dns-record-dialog.js\";\nimport { DeleteDomainDialog } from \"./delete-domain-dialog.js\";\nimport { DropdownMenu, IconButton } from \"./elements.js\";\n\ninterface DomainActionsProps {\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n}\n\nexport const DomainActions = ({\n  domain,\n  onDeleteDomain,\n  onReverifyDomain,\n}: DomainActionsProps) => {\n  const [viewDnsDialogOpen, setViewDnsDialogOpen] = useState(false);\n  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);\n\n  if (domain.state === \"Verified\") {\n    return (\n      <>\n        <DeleteDomainDialog\n          domain={domain}\n          onDeleteDomain={onDeleteDomain}\n          open={deleteDialogOpen}\n          onOpenChange={setDeleteDialogOpen}\n        >\n          <IconButton aria-label=\"Remove domain\" title=\"Remove domain\">\n            <TrashIcon />\n          </IconButton>\n        </DeleteDomainDialog>\n      </>\n    );\n  }\n\n  return (\n    <>\n      <DropdownMenu.Root>\n        <DropdownMenu.Trigger>\n          <IconButton aria-label=\"Domain actions\" title=\"Domain actions\">\n            <DotsHorizontalIcon />\n          </IconButton>\n        </DropdownMenu.Trigger>\n        <DropdownMenu.Content side=\"bottom\" align=\"end\">\n          <DropdownMenu.Item onClick={() => setViewDnsDialogOpen(true)}>\n            {domain.state === \"Failed\"\n              ? \"Restart verification\"\n              : \"View DNS record\"}\n          </DropdownMenu.Item>\n          <DropdownMenu.Item\n            variant=\"destructive\"\n            onClick={() => setDeleteDialogOpen(true)}\n          >\n            Remove domain\n          </DropdownMenu.Item>\n        </DropdownMenu.Content>\n      </DropdownMenu.Root>\n\n      <ViewDnsRecordDialog\n        domain={domain}\n        onReverifyDomain={onReverifyDomain}\n        open={viewDnsDialogOpen}\n        onOpenChange={setViewDnsDialogOpen}\n      />\n\n      <DeleteDomainDialog\n        domain={domain}\n        onDeleteDomain={onDeleteDomain}\n        open={deleteDialogOpen}\n        onOpenChange={setDeleteDialogOpen}\n      />\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BM;AAvBN,mBAAyB;AACzB,yBAA8C;AAE9C,oCAAoC;AACpC,kCAAmC;AACnC,sBAAyC;AAQlC,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,MAA0B;AACxB,QAAM,CAAC,mBAAmB,oBAAoB,QAAI,uBAAS,KAAK;AAChE,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAS,KAAK;AAE9D,MAAI,OAAO,UAAU,YAAY;AAC/B,WACE,2EACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA,QAEd,sDAAC,8BAAW,cAAW,iBAAgB,OAAM,iBAC3C,sDAAC,gCAAU,GACb;AAAA;AAAA,IACF,GACF;AAAA,EAEJ;AAEA,SACE,4EACE;AAAA,iDAAC,6BAAa,MAAb,EACC;AAAA,kDAAC,6BAAa,SAAb,EACC,sDAAC,8BAAW,cAAW,kBAAiB,OAAM,kBAC5C,sDAAC,yCAAmB,GACtB,GACF;AAAA,MACA,6CAAC,6BAAa,SAAb,EAAqB,MAAK,UAAS,OAAM,OACxC;AAAA,oDAAC,6BAAa,MAAb,EAAkB,SAAS,MAAM,qBAAqB,IAAI,GACxD,iBAAO,UAAU,WACd,yBACA,mBACN;AAAA,QACA;AAAA,UAAC,6BAAa;AAAA,UAAb;AAAA,YACC,SAAQ;AAAA,YACR,SAAS,MAAM,oBAAoB,IAAI;AAAA,YACxC;AAAA;AAAA,QAED;AAAA,SACF;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA;AAAA,IAChB;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA;AAAA,IAChB;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/lib/domain-actions.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { DotsHorizontalIcon, TrashIcon } from \"@radix-ui/react-icons\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { ViewDnsRecordDialog } from \"./view-dns-record-dialog.js\";\nimport { DeleteDomainDialog } from \"./delete-domain-dialog.js\";\nimport { DropdownMenu, IconButton } from \"./elements.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useTranslation } from \"./i18n/use-translation.js\";\n\ninterface DomainActionsProps {\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n}\n\nexport const DomainActions = ({\n  domain,\n  onDeleteDomain,\n  onReverifyDomain,\n}: DomainActionsProps) => {\n  const [viewDnsDialogOpen, setViewDnsDialogOpen] = React.useState(false);\n  const [deleteDialogOpen, setDeleteDialogOpen] = React.useState(false);\n  const translate = useTranslation();\n\n  const removeDomainTitle = translate({\n    defaultMessage: \"Remove domain\",\n    id: \"Cf+uSR\",\n    description: \"Title for remove domain button\",\n  });\n\n  const domainActionsTitle = translate({\n    defaultMessage: \"Domain actions\",\n    id: \"l1mz5q\",\n    description: \"Title for domain actions dropdown button\",\n  });\n\n  if (domain.state === \"Verified\") {\n    return (\n      <>\n        <DeleteDomainDialog\n          domain={domain}\n          onDeleteDomain={onDeleteDomain}\n          open={deleteDialogOpen}\n          onOpenChange={setDeleteDialogOpen}\n        >\n          <IconButton title={removeDomainTitle}>\n            <TrashIcon />\n          </IconButton>\n        </DeleteDomainDialog>\n      </>\n    );\n  }\n\n  return (\n    <>\n      <DropdownMenu.Root>\n        <DropdownMenu.Trigger>\n          <IconButton title={domainActionsTitle}>\n            <DotsHorizontalIcon />\n          </IconButton>\n        </DropdownMenu.Trigger>\n        <DropdownMenu.Content side=\"bottom\" align=\"end\">\n          <DropdownMenu.Item onClick={() => setViewDnsDialogOpen(true)}>\n            {domain.state === \"Failed\" ? (\n              <Translation\n                defaultMessage=\"Restart verification\"\n                id=\"ZJYAji\"\n                description=\"Menu option to restart domain verification\"\n              />\n            ) : (\n              <Translation\n                defaultMessage=\"View DNS record\"\n                id=\"74JScV\"\n                description=\"Menu option to view DNS record\"\n              />\n            )}\n          </DropdownMenu.Item>\n          <DropdownMenu.Item\n            variant=\"destructive\"\n            onClick={() => setDeleteDialogOpen(true)}\n          >\n            <Translation\n              defaultMessage=\"Remove domain\"\n              id=\"cO5+D2\"\n              description=\"Menu option to remove a domain\"\n            />\n          </DropdownMenu.Item>\n        </DropdownMenu.Content>\n      </DropdownMenu.Root>\n\n      <ViewDnsRecordDialog\n        domain={domain}\n        onReverifyDomain={onReverifyDomain}\n        open={viewDnsDialogOpen}\n        onOpenChange={setViewDnsDialogOpen}\n      />\n\n      <DeleteDomainDialog\n        domain={domain}\n        onDeleteDomain={onDeleteDomain}\n        open={deleteDialogOpen}\n        onOpenChange={setDeleteDialogOpen}\n      />\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwCM;AAtCN,YAAuB;AACvB,yBAA8C;AAE9C,oCAAoC;AACpC,kCAAmC;AACnC,sBAAyC;AACzC,yBAA4B;AAC5B,6BAA+B;AAQxB,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,MAA0B;AACxB,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,MAAM,SAAS,KAAK;AACtE,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,MAAM,SAAS,KAAK;AACpE,QAAM,gBAAY,uCAAe;AAEjC,QAAM,oBAAoB,UAAU;AAAA,IAClC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,QAAM,qBAAqB,UAAU;AAAA,IACnC,gBAAgB;AAAA,IAChB,IAAI;AAAA,IACJ,aAAa;AAAA,EACf,CAAC;AAED,MAAI,OAAO,UAAU,YAAY;AAC/B,WACE,2EACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA,QAEd,sDAAC,8BAAW,OAAO,mBACjB,sDAAC,gCAAU,GACb;AAAA;AAAA,IACF,GACF;AAAA,EAEJ;AAEA,SACE,4EACE;AAAA,iDAAC,6BAAa,MAAb,EACC;AAAA,kDAAC,6BAAa,SAAb,EACC,sDAAC,8BAAW,OAAO,oBACjB,sDAAC,yCAAmB,GACtB,GACF;AAAA,MACA,6CAAC,6BAAa,SAAb,EAAqB,MAAK,UAAS,OAAM,OACxC;AAAA,oDAAC,6BAAa,MAAb,EAAkB,SAAS,MAAM,qBAAqB,IAAI,GACxD,iBAAO,UAAU,WAChB;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA;AAAA,QACd,IAEA;AAAA,UAAC;AAAA;AAAA,YACC,gBAAe;AAAA,YACf,IAAG;AAAA,YACH,aAAY;AAAA;AAAA,QACd,GAEJ;AAAA,QACA;AAAA,UAAC,6BAAa;AAAA,UAAb;AAAA,YACC,SAAQ;AAAA,YACR,SAAS,MAAM,oBAAoB,IAAI;AAAA,YAEvC;AAAA,cAAC;AAAA;AAAA,gBACC,gBAAe;AAAA,gBACf,IAAG;AAAA,gBACH,aAAY;AAAA;AAAA,YACd;AAAA;AAAA,QACF;AAAA,SACF;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA;AAAA,IAChB;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,MAAM;AAAA,QACN,cAAc;AAAA;AAAA,IAChB;AAAA,KACF;AAEJ;","names":[]}

package/dist/cjs/lib/domain-item.cjs

@@ -29,20 +29,33 @@ var import_utils = require("./utils.js");
 var import_status = require("./status.js");
 var import_name_server_icon = require("./name-server-icon.js");
 var import_domain_actions = require("./domain-actions.js");
+var import_translation = require("./i18n/translation.js");
+var import_use_locale = require("./i18n/use-locale.js");
 const DomainItem = ({
   domain,
   onDeleteDomain,
   onReverifyDomain
 }) => {
+  const locale = (0, import_use_locale.useLocale)();
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { gap: "4", align: "center", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon_panel.IconPanel, { color: domain.nameServer === "Other" ? "gray" : "panel", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_name_server_icon.NameServerIcon, { provider: domain.nameServer }) }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { direction: "column", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", highContrast: true, weight: "bold", as: "p", children: domain.domain }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Text, { size: "2", color: "gray", as: "p", children: [
-        "Added",
-        " ",
-        (0, import_utils.getComparativeReadableDate)(/* @__PURE__ */ new Date(), new Date(domain.createdAt))
-      ] })
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Text, { size: "2", color: "gray", as: "p", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_translation.Translation,
+        {
+          defaultMessage: "Added {timeAgo}",
+          id: "DtZ2fb",
+          description: "Label showing when the domain was added",
+          values: {
+            timeAgo: (0, import_utils.getComparativeReadableDate)(
+              /* @__PURE__ */ new Date(),
+              new Date(domain.createdAt),
+              { locale }
+            )
+          }
+        }
+      ) })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_themes.Flex, { ml: "auto", mr: "2", gap: "4", align: "center", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes.Flex, { gap: "1", align: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_status.Status, { state: getDomainStatus(domain), children: domainStateToLabel(domain) }) }),
@@ -61,11 +74,32 @@ const domainStateToLabel = (domain) => {
   switch (domain.state) {
     case "Verified":
     case "LegacyVerified":
-      return "Verified";
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_translation.Translation,
+        {
+          defaultMessage: "Verified",
+          id: "T7rpHw",
+          description: "Domain verification status indicating the domain is verified"
+        }
+      );
     case "Pending":
-      return "Verification pending";
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_translation.Translation,
+        {
+          defaultMessage: "Verification pending",
+          id: "gc1yge",
+          description: "Domain verification status indicating verification is in progress"
+        }
+      );
     case "Failed":
-      return "Verification failed";
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_translation.Translation,
+        {
+          defaultMessage: "Verification failed",
+          id: "cbbwqK",
+          description: "Domain verification status indicating verification has failed"
+        }
+      );
   }
 };
 const getDomainStatus = (domain) => {

package/dist/cjs/lib/domain-item.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/domain-item.tsx"],"sourcesContent":["\"use client\";\n\nimport { Flex, Text } from \"@radix-ui/themes\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { IconPanel } from \"./icon-panel.js\";\nimport { getComparativeReadableDate } from \"./utils.js\";\nimport { Status } from \"./status.js\";\nimport { NameServerIcon } from \"./name-server-icon.js\";\nimport { DomainActions } from \"./domain-actions.js\";\n\ninterface DomainItemProps {\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n}\n\nexport const DomainItem = ({\n  domain,\n  onDeleteDomain,\n  onReverifyDomain,\n}: DomainItemProps) => {\n  return (\n    <Flex gap=\"4\" align=\"center\">\n      <IconPanel color={domain.nameServer === \"Other\" ? \"gray\" : \"panel\"}>\n        <NameServerIcon provider={domain.nameServer} />\n      </IconPanel>\n\n      <Flex direction=\"column\">\n        <Text size=\"2\" highContrast weight=\"bold\" as=\"p\">\n          {domain.domain}\n        </Text>\n\n        <Text size=\"2\" color=\"gray\" as=\"p\">\n          Added{\" \"}\n          {getComparativeReadableDate(new Date(), new Date(domain.createdAt))}\n        </Text>\n      </Flex>\n\n      <Flex ml=\"auto\" mr=\"2\" gap=\"4\" align=\"center\">\n        <Flex gap=\"1\" align=\"center\">\n          <Status state={getDomainStatus(domain)}>\n            {domainStateToLabel(domain)}\n          </Status>\n        </Flex>\n\n        <DomainActions\n          domain={domain}\n          onDeleteDomain={onDeleteDomain}\n          onReverifyDomain={onReverifyDomain}\n        />\n      </Flex>\n    </Flex>\n  );\n};\n\nconst domainStateToLabel = (domain: OrganizationDomain) => {\n  switch (domain.state) {\n    case \"Verified\":\n    case \"LegacyVerified\":\n      return \"Verified\";\n    case \"Pending\":\n      return \"Verification pending\";\n    case \"Failed\":\n      return \"Verification failed\";\n  }\n};\n\nconst getDomainStatus = (domain: OrganizationDomain) => {\n  switch (domain.state) {\n    case \"Verified\":\n    case \"LegacyVerified\":\n      return \"success\";\n    case \"Pending\":\n      return \"waiting\";\n    case \"Failed\":\n      return \"error\";\n  }\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBQ;AAtBR,oBAA2B;AAE3B,wBAA0B;AAC1B,mBAA2C;AAC3C,oBAAuB;AACvB,8BAA+B;AAC/B,4BAA8B;AAQvB,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACrB,SACE,6CAAC,sBAAK,KAAI,KAAI,OAAM,UAClB;AAAA,gDAAC,+BAAU,OAAO,OAAO,eAAe,UAAU,SAAS,SACzD,sDAAC,0CAAe,UAAU,OAAO,YAAY,GAC/C;AAAA,IAEA,6CAAC,sBAAK,WAAU,UACd;AAAA,kDAAC,sBAAK,MAAK,KAAI,cAAY,MAAC,QAAO,QAAO,IAAG,KAC1C,iBAAO,QACV;AAAA,MAEA,6CAAC,sBAAK,MAAK,KAAI,OAAM,QAAO,IAAG,KAAI;AAAA;AAAA,QAC3B;AAAA,YACL,yCAA2B,oBAAI,KAAK,GAAG,IAAI,KAAK,OAAO,SAAS,CAAC;AAAA,SACpE;AAAA,OACF;AAAA,IAEA,6CAAC,sBAAK,IAAG,QAAO,IAAG,KAAI,KAAI,KAAI,OAAM,UACnC;AAAA,kDAAC,sBAAK,KAAI,KAAI,OAAM,UAClB,sDAAC,wBAAO,OAAO,gBAAgB,MAAM,GAClC,6BAAmB,MAAM,GAC5B,GACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,MAAM,qBAAqB,CAAC,WAA+B;AACzD,UAAQ,OAAO,OAAO;AAAA,IACpB,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EACX;AACF;AAEA,MAAM,kBAAkB,CAAC,WAA+B;AACtD,UAAQ,OAAO,OAAO;AAAA,IACpB,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EACX;AACF;","names":[]}
+{"version":3,"sources":["../../../src/lib/domain-item.tsx"],"sourcesContent":["\"use client\";\n\nimport { Flex, Text } from \"@radix-ui/themes\";\nimport { OrganizationDomain } from \"../api/endpoint.js\";\nimport { IconPanel } from \"./icon-panel.js\";\nimport { getComparativeReadableDate } from \"./utils.js\";\nimport { Status } from \"./status.js\";\nimport { NameServerIcon } from \"./name-server-icon.js\";\nimport { DomainActions } from \"./domain-actions.js\";\nimport { Translation } from \"./i18n/translation.js\";\nimport { useLocale } from \"./i18n/use-locale.js\";\n\ninterface DomainItemProps {\n  domain: OrganizationDomain;\n  onDeleteDomain: (domainId: string) => void;\n  onReverifyDomain: (domainId: string) => void;\n}\n\nexport const DomainItem = ({\n  domain,\n  onDeleteDomain,\n  onReverifyDomain,\n}: DomainItemProps) => {\n  const locale = useLocale();\n\n  return (\n    <Flex gap=\"4\" align=\"center\">\n      <IconPanel color={domain.nameServer === \"Other\" ? \"gray\" : \"panel\"}>\n        <NameServerIcon provider={domain.nameServer} />\n      </IconPanel>\n\n      <Flex direction=\"column\">\n        <Text size=\"2\" highContrast weight=\"bold\" as=\"p\">\n          {domain.domain}\n        </Text>\n\n        <Text size=\"2\" color=\"gray\" as=\"p\">\n          <Translation\n            defaultMessage=\"Added {timeAgo}\"\n            id=\"DtZ2fb\"\n            description=\"Label showing when the domain was added\"\n            values={{\n              timeAgo: getComparativeReadableDate(\n                new Date(),\n                new Date(domain.createdAt),\n                { locale },\n              ),\n            }}\n          />\n        </Text>\n      </Flex>\n\n      <Flex ml=\"auto\" mr=\"2\" gap=\"4\" align=\"center\">\n        <Flex gap=\"1\" align=\"center\">\n          <Status state={getDomainStatus(domain)}>\n            {domainStateToLabel(domain)}\n          </Status>\n        </Flex>\n\n        <DomainActions\n          domain={domain}\n          onDeleteDomain={onDeleteDomain}\n          onReverifyDomain={onReverifyDomain}\n        />\n      </Flex>\n    </Flex>\n  );\n};\n\nconst domainStateToLabel = (domain: OrganizationDomain) => {\n  switch (domain.state) {\n    case \"Verified\":\n    case \"LegacyVerified\":\n      return (\n        <Translation\n          defaultMessage=\"Verified\"\n          id=\"T7rpHw\"\n          description=\"Domain verification status indicating the domain is verified\"\n        />\n      );\n    case \"Pending\":\n      return (\n        <Translation\n          defaultMessage=\"Verification pending\"\n          id=\"gc1yge\"\n          description=\"Domain verification status indicating verification is in progress\"\n        />\n      );\n    case \"Failed\":\n      return (\n        <Translation\n          defaultMessage=\"Verification failed\"\n          id=\"cbbwqK\"\n          description=\"Domain verification status indicating verification has failed\"\n        />\n      );\n  }\n};\n\nconst getDomainStatus = (domain: OrganizationDomain) => {\n  switch (domain.state) {\n    case \"Verified\":\n    case \"LegacyVerified\":\n      return \"success\";\n    case \"Pending\":\n      return \"waiting\";\n    case \"Failed\":\n      return \"error\";\n  }\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BQ;AA1BR,oBAA2B;AAE3B,wBAA0B;AAC1B,mBAA2C;AAC3C,oBAAuB;AACvB,8BAA+B;AAC/B,4BAA8B;AAC9B,yBAA4B;AAC5B,wBAA0B;AAQnB,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACrB,QAAM,aAAS,6BAAU;AAEzB,SACE,6CAAC,sBAAK,KAAI,KAAI,OAAM,UAClB;AAAA,gDAAC,+BAAU,OAAO,OAAO,eAAe,UAAU,SAAS,SACzD,sDAAC,0CAAe,UAAU,OAAO,YAAY,GAC/C;AAAA,IAEA,6CAAC,sBAAK,WAAU,UACd;AAAA,kDAAC,sBAAK,MAAK,KAAI,cAAY,MAAC,QAAO,QAAO,IAAG,KAC1C,iBAAO,QACV;AAAA,MAEA,4CAAC,sBAAK,MAAK,KAAI,OAAM,QAAO,IAAG,KAC7B;AAAA,QAAC;AAAA;AAAA,UACC,gBAAe;AAAA,UACf,IAAG;AAAA,UACH,aAAY;AAAA,UACZ,QAAQ;AAAA,YACN,aAAS;AAAA,cACP,oBAAI,KAAK;AAAA,cACT,IAAI,KAAK,OAAO,SAAS;AAAA,cACzB,EAAE,OAAO;AAAA,YACX;AAAA,UACF;AAAA;AAAA,MACF,GACF;AAAA,OACF;AAAA,IAEA,6CAAC,sBAAK,IAAG,QAAO,IAAG,KAAI,KAAI,KAAI,OAAM,UACnC;AAAA,kDAAC,sBAAK,KAAI,KAAI,OAAM,UAClB,sDAAC,wBAAO,OAAO,gBAAgB,MAAM,GAClC,6BAAmB,MAAM,GAC5B,GACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,MAAM,qBAAqB,CAAC,WAA+B;AACzD,UAAQ,OAAO,OAAO;AAAA,IACpB,KAAK;AAAA,IACL,KAAK;AACH,aACE;AAAA,QAAC;AAAA;AAAA,UACC,gBAAe;AAAA,UACf,IAAG;AAAA,UACH,aAAY;AAAA;AAAA,MACd;AAAA,IAEJ,KAAK;AACH,aACE;AAAA,QAAC;AAAA;AAAA,UACC,gBAAe;AAAA,UACf,IAAG;AAAA,UACH,aAAY;AAAA;AAAA,MACd;AAAA,IAEJ,KAAK;AACH,aACE;AAAA,QAAC;AAAA;AAAA,UACC,gBAAe;AAAA,UACf,IAAG;AAAA,UACH,aAAY;AAAA;AAAA,MACd;AAAA,EAEN;AACF;AAEA,MAAM,kBAAkB,CAAC,WAA+B;AACtD,UAAQ,OAAO,OAAO;AAAA,IACpB,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,EACX;AACF;","names":[]}