@worldcoin/idkit 0.5.0 → 1.0.0-alpha.0

package/build/index.js

@@ -0,0 +1,2094 @@
+import {
+  QRCode_default,
+  __,
+  idkit_default
+} from "./chunk-EXZRURG3.js";
+
+// src/hooks/useIDKit.ts
+import { useEffect } from "react";
+var getStore = ({ open, onOpenChange, addSuccessCallback, addVerificationCallback }) => ({
+  open,
+  onOpenChange,
+  addSuccessCallback,
+  addVerificationCallback
+});
+var useIDKit = ({ handleVerify, onSuccess } = {}) => {
+  const { open, onOpenChange, addSuccessCallback, addVerificationCallback } = idkit_default(getStore);
+  useEffect(() => {
+    if (onSuccess)
+      addSuccessCallback(onSuccess, "hook" /* HOOK */);
+    if (handleVerify)
+      addVerificationCallback(handleVerify, "hook" /* HOOK */);
+  }, [handleVerify, onSuccess]);
+  return { open, setOpen: onOpenChange };
+};
+var useIDKit_default = useIDKit;
+
+// src/components/SignInButton.tsx
+import { motion } from "framer-motion";
+
+// src/components/Icons/WorldcoinIcon.tsx
+import { jsx } from "react/jsx-runtime";
+var WorldcoinIcon = (props) => /* @__PURE__ */ jsx("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 33 32", children: /* @__PURE__ */ jsx(
+  "path",
+  {
+    fill: "currentColor",
+    d: "M30.7195 9.77312C29.9097 7.87434 28.7647 6.17103 27.2845 4.6911C25.8044 3.21117 24.1288 2.06632 22.2298 1.25654C20.247 0.418848 18.1525 0 16.0021 0C13.8238 0 11.7293 0.418848 9.7744 1.25654C7.87537 2.06632 6.17184 3.21117 4.69171 4.6911C3.21159 6.17103 2.06659 7.87434 1.25671 9.77312C0.418903 11.7277 0 13.822 0 16C0 18.1501 0.418903 20.2443 1.25671 22.2269C2.06659 24.1257 3.21159 25.829 4.69171 27.3089C6.17184 28.7888 7.87537 29.9337 9.7744 30.7155C11.7572 31.5532 13.8517 31.9721 16.0021 31.9721C18.1525 31.9721 20.247 31.5532 22.2298 30.7155C24.1288 29.9058 25.8323 28.7609 27.3125 27.281C28.7926 25.801 29.9376 24.0977 30.7475 22.1989C31.5853 20.2164 32.0042 18.1222 32.0042 15.9721C32.0042 13.822 31.5574 11.7277 30.7195 9.77312ZM10.696 14.4921C11.3383 11.9232 13.6842 10.0524 16.4489 10.0524H27.5638C28.2899 11.4206 28.7367 12.9284 28.9043 14.4921H10.696ZM28.9043 17.5079C28.7367 19.0716 28.262 20.5794 27.5638 21.9476H16.4489C13.6842 21.9476 11.3662 20.0489 10.696 17.5079H28.9043ZM6.81415 6.81326C9.27172 4.35602 12.5392 3.01571 16.0021 3.01571C19.465 3.01571 22.7325 4.35602 25.19 6.81326C25.2738 6.89703 25.3297 6.95288 25.4134 7.03665H16.4489C14.0472 7.03665 11.8131 7.95811 10.1095 9.66143C8.76903 11.0017 7.9033 12.6771 7.62403 14.4921H3.09988C3.435 11.5881 4.71964 8.9075 6.81415 6.81326ZM16.0021 28.9843C12.5392 28.9843 9.27172 27.644 6.81415 25.1867C4.71964 23.0925 3.435 20.3839 3.09988 17.5079H7.62403C7.93123 19.3229 8.79696 20.9983 10.1095 22.3386C11.8131 24.0419 14.0472 24.9633 16.4489 24.9633H25.4134C25.3297 25.0471 25.2738 25.103 25.19 25.1867C22.7325 27.644 19.465 28.9843 16.0021 28.9843Z"
+  }
+) });
+var WorldcoinIcon_default = WorldcoinIcon;
+
+// src/components/SignInButton.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var SignInButton = ({ style, theme = "light", ...props }) => /* @__PURE__ */ jsx2(
+  motion.button,
+  {
+    whileTap: { scale: 0.98 },
+    whileHover: { scale: 1.02 },
+    style: {
+      overflow: "hidden",
+      borderStyle: "none",
+      display: "relative",
+      padding: "1.5rem 6rem",
+      borderRadius: "0.75rem",
+      borderColor: "rgba(255, 255, 255, 0.1)",
+      borderWidth: theme == "dark" ? "1px" : "0px",
+      ...style
+    },
+    ...props,
+    children: /* @__PURE__ */ jsx2(
+      "div",
+      {
+        style: {
+          zIndex: 10,
+          inset: "1px",
+          display: "grid",
+          cursor: "pointer",
+          placeItems: "center",
+          position: "absolute",
+          borderRadius: "0.75rem",
+          backgroundColor: theme == "dark" ? "#000" : "#f2f5f9"
+        },
+        children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [
+          /* @__PURE__ */ jsx2(WorldcoinIcon_default, { style: { height: "1rem", width: "1rem" } }),
+          /* @__PURE__ */ jsx2(
+            "span",
+            {
+              style: {
+                marginLeft: "1rem",
+                fontSize: "0.875rem",
+                lineHeight: "1.25rem",
+                fontFamily: "Rubik, ui-sans-serif, system-ui, -apple-system, sans-serif"
+              },
+              children: __("Sign in with World ID")
+            }
+          )
+        ] })
+      }
+    )
+  }
+);
+var SignInButton_default = SignInButton;
+
+// src/index.ts
+import { CredentialType } from "@worldcoin/idkit-core";
+
+// src/components/IDKitWidget/index.tsx
+import { memo as memo2 } from "react";
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import root from "react-shadow";
+
+// src/hooks/useMedia.ts
+import { useEffect as useEffect2, useState } from "react";
+var useMedia = () => {
+  const [media, setMedia] = useState("desktop");
+  useEffect2(() => {
+    const mql = window.matchMedia("(max-width: 768px)");
+    const handleChange = (mql2) => setMedia(mql2.matches ? "mobile" : "desktop");
+    handleChange(mql);
+    mql.addEventListener("change", handleChange);
+    return () => {
+      mql.removeEventListener("change", handleChange);
+    };
+  }, []);
+  return media;
+};
+var useMedia_default = useMedia;
+
+// src/lib/utils.ts
+var classNames = (...classes) => {
+  return classes.filter(Boolean).join(" ");
+};
+
+// src/styles/styles.css
+var styles_default = `/* TODO: Use an alternative to avoid the extra request to Google (e.g. hosting ourselves, or local file)  */
+@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;600;700&family=Sora:wght@600&display=swap');
+/* ! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com  */
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+*/
+*,
+::before,
+::after {
+  box-sizing: border-box; /* 1 */
+  border-width: 0; /* 2 */
+  border-style: solid; /* 2 */
+  border-color: #e5e7eb; /* 2 */
+}
+::before,
+::after {
+  --tw-content: '';
+}
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured \`sans\` font-family by default.
+5. Use the user's configured \`sans\` font-feature-settings by default.
+6. Use the user's configured \`sans\` font-variation-settings by default.
+*/
+html {
+  line-height: 1.5; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+  -moz-tab-size: 4; /* 3 */
+  -o-tab-size: 4;
+     tab-size: 4; /* 3 */
+  font-family: Rubik, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
+  font-feature-settings: normal; /* 5 */
+  font-variation-settings: normal; /* 6 */
+}
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from \`html\` so users can set them as a class directly on the \`html\` element.
+*/
+body {
+  margin: 0; /* 1 */
+  line-height: inherit; /* 2 */
+}
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+hr {
+  height: 0; /* 1 */
+  color: inherit; /* 2 */
+  border-top-width: 1px; /* 3 */
+}
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+/*
+Remove the default font size and weight for headings.
+*/
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+/*
+Add the correct font weight in Edge and Safari.
+*/
+b,
+strong {
+  font-weight: bolder;
+}
+/*
+1. Use the user's configured \`mono\` font family by default.
+2. Correct the odd \`em\` font sizing in all browsers.
+*/
+code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+/*
+Add the correct font size in all browsers.
+*/
+small {
+  font-size: 80%;
+}
+/*
+Prevent \`sub\` and \`sup\` elements from affecting the line height in all browsers.
+*/
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+sub {
+  bottom: -0.25em;
+}
+sup {
+  top: -0.5em;
+}
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+table {
+  text-indent: 0; /* 1 */
+  border-color: inherit; /* 2 */
+  border-collapse: collapse; /* 3 */
+}
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-feature-settings: inherit; /* 1 */
+  font-variation-settings: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  font-weight: inherit; /* 1 */
+  line-height: inherit; /* 1 */
+  color: inherit; /* 1 */
+  margin: 0; /* 2 */
+  padding: 0; /* 3 */
+}
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+button,
+select {
+  text-transform: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  -webkit-appearance: button; /* 1 */
+  background-color: transparent; /* 2 */
+  background-image: none; /* 2 */
+}
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+:-moz-focusring {
+  outline: auto;
+}
+/*
+Remove the additional \`:invalid\` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+progress {
+  vertical-align: baseline;
+}
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+[type='search'] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to \`inherit\` in Safari.
+*/
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+/*
+Add the correct display in Chrome and Safari.
+*/
+summary {
+  display: list-item;
+}
+/*
+Removes the default spacing and border for appropriate elements.
+*/
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+  margin: 0;
+}
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+legend {
+  padding: 0;
+}
+ol,
+ul,
+menu {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+/*
+Reset default styling for dialogs.
+*/
+dialog {
+  padding: 0;
+}
+/*
+Prevent resizing textareas horizontally by default.
+*/
+textarea {
+  resize: vertical;
+}
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+input::-moz-placeholder, textarea::-moz-placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+input::placeholder,
+textarea::placeholder {
+  opacity: 1; /* 1 */
+  color: #9ca3af; /* 2 */
+}
+/*
+Set the default cursor for buttons.
+*/
+button,
+[role="button"] {
+  cursor: pointer;
+}
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+:disabled {
+  cursor: default;
+}
+/*
+1. Make replaced elements \`display: block\` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add \`vertical-align: middle\` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block; /* 1 */
+  vertical-align: middle; /* 2 */
+}
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+/* Make elements with the HTML hidden attribute stay hidden by default */
+[hidden] {
+  display: none;
+}
+[type='text'],input:where(:not([type])),[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select{
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background-color: #fff;
+  border-color: #6b7280;
+  border-width: 1px;
+  border-radius: 0px;
+  padding-top: 0.5rem;
+  padding-right: 0.75rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.75rem;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  --tw-shadow: 0 0 #0000;
+}
+[type='text']:focus, input:where(:not([type])):focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus{
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: #2563eb;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  border-color: #2563eb;
+}
+input::-moz-placeholder, textarea::-moz-placeholder{
+  color: #6b7280;
+  opacity: 1;
+}
+input::placeholder,textarea::placeholder{
+  color: #6b7280;
+  opacity: 1;
+}
+::-webkit-datetime-edit-fields-wrapper{
+  padding: 0;
+}
+::-webkit-date-and-time-value{
+  min-height: 1.5em;
+  text-align: inherit;
+}
+::-webkit-datetime-edit{
+  display: inline-flex;
+}
+::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{
+  padding-top: 0;
+  padding-bottom: 0;
+}
+select{
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
+  background-position: right 0.5rem center;
+  background-repeat: no-repeat;
+  background-size: 1.5em 1.5em;
+  padding-right: 2.5rem;
+  -webkit-print-color-adjust: exact;
+          print-color-adjust: exact;
+}
+[multiple],[size]:where(select:not([size="1"])){
+  background-image: initial;
+  background-position: initial;
+  background-repeat: unset;
+  background-size: initial;
+  padding-right: 0.75rem;
+  -webkit-print-color-adjust: unset;
+          print-color-adjust: unset;
+}
+[type='checkbox'],[type='radio']{
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  padding: 0;
+  -webkit-print-color-adjust: exact;
+          print-color-adjust: exact;
+  display: inline-block;
+  vertical-align: middle;
+  background-origin: border-box;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  flex-shrink: 0;
+  height: 1rem;
+  width: 1rem;
+  color: #2563eb;
+  background-color: #fff;
+  border-color: #6b7280;
+  border-width: 1px;
+  --tw-shadow: 0 0 #0000;
+}
+[type='checkbox']{
+  border-radius: 0px;
+}
+[type='radio']{
+  border-radius: 100%;
+}
+[type='checkbox']:focus,[type='radio']:focus{
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
+  --tw-ring-offset-width: 2px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: #2563eb;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+}
+[type='checkbox']:checked,[type='radio']:checked{
+  border-color: transparent;
+  background-color: currentColor;
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+[type='checkbox']:checked{
+  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
+}
+[type='radio']:checked{
+  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
+}
+[type='checkbox']:checked:hover,[type='checkbox']:checked:focus,[type='radio']:checked:hover,[type='radio']:checked:focus{
+  border-color: transparent;
+  background-color: currentColor;
+}
+[type='checkbox']:indeterminate{
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");
+  border-color: transparent;
+  background-color: currentColor;
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus{
+  border-color: transparent;
+  background-color: currentColor;
+}
+[type='file']{
+  background: unset;
+  border-color: inherit;
+  border-width: 0;
+  border-radius: 0;
+  padding: 0;
+  font-size: unset;
+  line-height: inherit;
+}
+[type='file']:focus{
+  outline: 1px solid ButtonText;
+  outline: 1px auto -webkit-focus-ring-color;
+}
+*, ::before, ::after{
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+::backdrop{
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(59 130 246 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+.container{
+  width: 100%;
+}
+@media (min-width: 414px){
+  .container{
+    max-width: 414px;
+  }
+}
+@media (min-width: 640px){
+  .container{
+    max-width: 640px;
+  }
+}
+@media (min-width: 768px){
+  .container{
+    max-width: 768px;
+  }
+}
+@media (min-width: 1024px){
+  .container{
+    max-width: 1024px;
+  }
+}
+@media (min-width: 1280px){
+  .container{
+    max-width: 1280px;
+  }
+}
+@media (min-width: 1536px){
+  .container{
+    max-width: 1536px;
+  }
+}
+.pointer-events-none{
+  pointer-events: none;
+}
+.visible{
+  visibility: visible;
+}
+.invisible{
+  visibility: hidden;
+}
+.fixed{
+  position: fixed;
+}
+.\\!absolute{
+  position: absolute !important;
+}
+.absolute{
+  position: absolute;
+}
+.relative{
+  position: relative;
+}
+.inset-0{
+  inset: 0px;
+}
+.left-1\\/2{
+  left: 50%;
+}
+.top-1\\/2{
+  top: 50%;
+}
+.z-10{
+  z-index: 10;
+}
+.z-50{
+  z-index: 50;
+}
+.\\!-m-px{
+  margin: -1px !important;
+}
+.mx-6{
+  margin-left: 1.5rem;
+  margin-right: 1.5rem;
+}
+.-ml-4{
+  margin-left: -1rem;
+}
+.-mt-5{
+  margin-top: -1.25rem;
+}
+.-mt-6{
+  margin-top: -1.5rem;
+}
+.-mt-\\[2px\\]{
+  margin-top: -2px;
+}
+.mb-12{
+  margin-bottom: 3rem;
+}
+.mb-2{
+  margin-bottom: 0.5rem;
+}
+.mb-6{
+  margin-bottom: 1.5rem;
+}
+.mt-2{
+  margin-top: 0.5rem;
+}
+.mt-3{
+  margin-top: 0.75rem;
+}
+.mt-4{
+  margin-top: 1rem;
+}
+.mt-\\[2px\\]{
+  margin-top: 2px;
+}
+.inline-block{
+  display: inline-block;
+}
+.flex{
+  display: flex;
+}
+.inline-flex{
+  display: inline-flex;
+}
+.grid{
+  display: grid;
+}
+.hidden{
+  display: none;
+}
+.aspect-square{
+  aspect-ratio: 1 / 1;
+}
+.\\!h-px{
+  height: 1px !important;
+}
+.h-12{
+  height: 3rem;
+}
+.h-20{
+  height: 5rem;
+}
+.h-24{
+  height: 6rem;
+}
+.h-3{
+  height: 0.75rem;
+}
+.h-4{
+  height: 1rem;
+}
+.h-5{
+  height: 1.25rem;
+}
+.h-8{
+  height: 2rem;
+}
+.h-\\[244px\\]{
+  height: 244px;
+}
+.h-\\[72px\\]{
+  height: 72px;
+}
+.min-h-full{
+  min-height: 100%;
+}
+.\\!w-px{
+  width: 1px !important;
+}
+.w-12{
+  width: 3rem;
+}
+.w-20{
+  width: 5rem;
+}
+.w-24{
+  width: 6rem;
+}
+.w-3{
+  width: 0.75rem;
+}
+.w-4{
+  width: 1rem;
+}
+.w-5{
+  width: 1.25rem;
+}
+.w-8{
+  width: 2rem;
+}
+.w-\\[244px\\]{
+  width: 244px;
+}
+.w-\\[34px\\]{
+  width: 34px;
+}
+.w-\\[72px\\]{
+  width: 72px;
+}
+.w-full{
+  width: 100%;
+}
+.flex-1{
+  flex: 1 1 0%;
+}
+.-translate-x-1\\/2{
+  --tw-translate-x: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.-translate-y-1\\/2{
+  --tw-translate-y: -50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.transform{
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+@keyframes spin{
+  to{
+    transform: rotate(360deg);
+  }
+}
+.animate-spin{
+  animation: spin 1s linear infinite;
+}
+.cursor-pointer{
+  cursor: pointer;
+}
+.list-disc{
+  list-style-type: disc;
+}
+.flex-col{
+  flex-direction: column;
+}
+.items-end{
+  align-items: flex-end;
+}
+.items-center{
+  align-items: center;
+}
+.justify-center{
+  justify-content: center;
+}
+.justify-between{
+  justify-content: space-between;
+}
+.gap-1{
+  gap: 0.25rem;
+}
+.space-x-2 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+.space-x-3 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.75rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
+}
+.space-x-6 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-x-reverse: 0;
+  margin-right: calc(1.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+.space-y-3 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-y-reverse: 0;
+  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
+}
+.space-y-4 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1rem * var(--tw-space-y-reverse));
+}
+.space-y-6 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-y-reverse: 0;
+  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
+}
+.space-y-8 > :not([hidden]) ~ :not([hidden]){
+  --tw-space-y-reverse: 0;
+  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
+}
+.\\!overflow-hidden{
+  overflow: hidden !important;
+}
+.overflow-y-hidden{
+  overflow-y: hidden;
+}
+.\\!whitespace-nowrap{
+  white-space: nowrap !important;
+}
+.whitespace-nowrap{
+  white-space: nowrap;
+}
+.rounded-2xl{
+  border-radius: 1rem;
+}
+.rounded-full{
+  border-radius: 9999px;
+}
+.rounded-lg{
+  border-radius: 0.5rem;
+}
+.rounded-md{
+  border-radius: 0.375rem;
+}
+.rounded-t-2xl{
+  border-top-left-radius: 1rem;
+  border-top-right-radius: 1rem;
+}
+.\\!border-0{
+  border-width: 0px !important;
+}
+.border{
+  border-width: 1px;
+}
+.border-4{
+  border-width: 4px;
+}
+.border-solid{
+  border-style: solid;
+}
+.border-current{
+  border-color: currentColor;
+}
+.border-f1f5f8{
+  --tw-border-opacity: 1;
+  border-color: rgb(241 245 248 / var(--tw-border-opacity));
+}
+.border-transparent{
+  border-color: transparent;
+}
+.border-r-transparent{
+  border-right-color: transparent;
+}
+.bg-0d151d{
+  --tw-bg-opacity: 1;
+  background-color: rgb(13 21 29 / var(--tw-bg-opacity));
+}
+.bg-black\\/50{
+  background-color: rgb(0 0 0 / 0.5);
+}
+.bg-d3dfea\\/30{
+  background-color: rgb(211 223 234 / 0.3);
+}
+.bg-gray-100{
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+}
+.bg-green-100{
+  --tw-bg-opacity: 1;
+  background-color: rgb(220 252 231 / var(--tw-bg-opacity));
+}
+.bg-green-500{
+  --tw-bg-opacity: 1;
+  background-color: rgb(34 197 94 / var(--tw-bg-opacity));
+}
+.bg-indigo-600{
+  --tw-bg-opacity: 1;
+  background-color: rgb(79 70 229 / var(--tw-bg-opacity));
+}
+.bg-red-100{
+  --tw-bg-opacity: 1;
+  background-color: rgb(254 226 226 / var(--tw-bg-opacity));
+}
+.bg-red-500{
+  --tw-bg-opacity: 1;
+  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
+}
+.bg-white{
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+.\\!p-0{
+  padding: 0px !important;
+}
+.p-2{
+  padding: 0.5rem;
+}
+.p-5{
+  padding: 1.25rem;
+}
+.px-12{
+  padding-left: 3rem;
+  padding-right: 3rem;
+}
+.px-2{
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+.px-4{
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+.px-5{
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
+}
+.px-8{
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+.py-1{
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+.py-2{
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+.py-3{
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+}
+.py-4{
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+.pb-10{
+  padding-bottom: 2.5rem;
+}
+.pt-6{
+  padding-top: 1.5rem;
+}
+.text-left{
+  text-align: left;
+}
+.text-center{
+  text-align: center;
+}
+.align-\\[-0\\.125em\\]{
+  vertical-align: -0.125em;
+}
+.font-sans{
+  font-family: Rubik, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+.font-sora{
+  font-family: Sora, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+.text-2xl{
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
+.text-lg{
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+.text-sm{
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+.text-xs{
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+.font-medium{
+  font-weight: 500;
+}
+.font-normal{
+  font-weight: 400;
+}
+.font-semibold{
+  font-weight: 600;
+}
+.uppercase{
+  text-transform: uppercase;
+}
+.text-0d151d{
+  --tw-text-opacity: 1;
+  color: rgb(13 21 29 / var(--tw-text-opacity));
+}
+.text-29343f{
+  --tw-text-opacity: 1;
+  color: rgb(41 52 63 / var(--tw-text-opacity));
+}
+.text-4940e0{
+  --tw-text-opacity: 1;
+  color: rgb(73 64 224 / var(--tw-text-opacity));
+}
+.text-70868f{
+  --tw-text-opacity: 1;
+  color: rgb(112 134 143 / var(--tw-text-opacity));
+}
+.text-9eafc0{
+  --tw-text-opacity: 1;
+  color: rgb(158 175 192 / var(--tw-text-opacity));
+}
+.text-black{
+  --tw-text-opacity: 1;
+  color: rgb(0 0 0 / var(--tw-text-opacity));
+}
+.text-gray-400{
+  --tw-text-opacity: 1;
+  color: rgb(156 163 175 / var(--tw-text-opacity));
+}
+.text-gray-900{
+  --tw-text-opacity: 1;
+  color: rgb(17 24 39 / var(--tw-text-opacity));
+}
+.text-white{
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+.shadow{
+  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.shadow-sm{
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.filter{
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+.backdrop-blur-lg{
+  --tw-backdrop-blur: blur(16px);
+  -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+          backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+}
+.transition{
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+input[type='number']::-webkit-inner-spin-button,
+	input[type='number']::-webkit-outer-spin-button{
+  -webkit-appearance: none;
+          appearance: none;
+}
+.\\!\\[clip\\:rect\\(0\\2c 0\\2c 0\\2c 0\\)\\]{
+  clip: rect(0,0,0,0) !important;
+}
+.hover\\:bg-indigo-700:hover{
+  --tw-bg-opacity: 1;
+  background-color: rgb(67 56 202 / var(--tw-bg-opacity));
+}
+.hover\\:underline:hover{
+  text-decoration-line: underline;
+}
+.focus\\:outline-none:focus{
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+.focus\\:ring-2:focus{
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.focus\\:ring-indigo-500:focus{
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
+}
+.focus\\:ring-offset-2:focus{
+  --tw-ring-offset-width: 2px;
+}
+.focus-visible\\:ring:focus-visible{
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.focus-visible\\:ring-purple-500\\/75:focus-visible{
+  --tw-ring-color: rgb(168 85 247 / 0.75);
+}
+.disabled\\:cursor-not-allowed:disabled{
+  cursor: not-allowed;
+}
+.disabled\\:opacity-40:disabled{
+  opacity: 0.4;
+}
+.disabled\\:hover\\:bg-indigo-600:hover:disabled{
+  --tw-bg-opacity: 1;
+  background-color: rgb(79 70 229 / var(--tw-bg-opacity));
+}
+@media (prefers-reduced-motion: reduce){
+  @keyframes spin{
+    to{
+      transform: rotate(360deg);
+    }
+  }
+  .motion-reduce\\:animate-\\[spin_1\\.5s_linear_infinite\\]{
+    animation: spin 1.5s linear infinite;
+  }
+}
+:is(.dark .dark\\:border-f1f5f8\\/10){
+  border-color: rgb(241 245 248 / 0.1);
+}
+:is(.dark .dark\\:bg-0d151d){
+  --tw-bg-opacity: 1;
+  background-color: rgb(13 21 29 / var(--tw-bg-opacity));
+}
+:is(.dark .dark\\:bg-29343f){
+  --tw-bg-opacity: 1;
+  background-color: rgb(41 52 63 / var(--tw-bg-opacity));
+}
+:is(.dark .dark\\:bg-d3dfea\\/15){
+  background-color: rgb(211 223 234 / .15);
+}
+:is(.dark .dark\\:bg-white){
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+:is(.dark .dark\\:text-0d151d){
+  --tw-text-opacity: 1;
+  color: rgb(13 21 29 / var(--tw-text-opacity));
+}
+:is(.dark .dark\\:text-9eafc0){
+  --tw-text-opacity: 1;
+  color: rgb(158 175 192 / var(--tw-text-opacity));
+}
+:is(.dark .dark\\:text-white){
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+@media (min-width: 768px){
+  .md\\:mt-2{
+    margin-top: 0.5rem;
+  }
+  .md\\:hidden{
+    display: none;
+  }
+  .md\\:max-w-md{
+    max-width: 28rem;
+  }
+  .md\\:items-center{
+    align-items: center;
+  }
+  .md\\:overflow-y-auto{
+    overflow-y: auto;
+  }
+  .md\\:rounded-b-2xl{
+    border-bottom-right-radius: 1rem;
+    border-bottom-left-radius: 1rem;
+  }
+  .md\\:p-4{
+    padding: 1rem;
+  }
+}
+`;
+
+// src/components/Styles.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Styles = () => /* @__PURE__ */ jsx3("style", { children: styles_default });
+var Styles_default = Styles;
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import { shallow as shallow2 } from "zustand/shallow";
+
+// src/components/Icons/XMarkIcon.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var XMarkIcon = (props) => /* @__PURE__ */ jsx4("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx4(
+  "path",
+  {
+    strokeWidth: "1.5",
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    d: "m16.243 7.758-8.485 8.485m8.485 0L7.758 7.758"
+  }
+) });
+var XMarkIcon_default = XMarkIcon;
+
+// src/components/IDKitWidget/States/ErrorState.tsx
+import { AppErrorCodes } from "@worldcoin/idkit-core";
+import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+var getParams = ({ retryFlow, errorState }) => ({ retryFlow, errorState });
+var ERROR_TITLES = {
+  [AppErrorCodes.FailedByHostApp]: __("Verification Declined"),
+  [AppErrorCodes.GenericError]: __("Verification Failed")
+};
+var ERROR_MESSAGES = {
+  [AppErrorCodes.ConnectionFailed]: __("Connection to the World App or identity wallet failed. Please try again."),
+  [AppErrorCodes.VerificationRejected]: __("Verification request rejected in the World App."),
+  [AppErrorCodes.MaxVerificationsReached]: __(
+    "You have already verified the maximum number of times for this action."
+  ),
+  [AppErrorCodes.AlreadySigned]: __("You have already verified for this action."),
+  [AppErrorCodes.CredentialUnavailable]: __("It seems you do not have the credential required by this app."),
+  [AppErrorCodes.MalformedRequest]: __(
+    "There was a problem with this request. Please try again or contact the app owner."
+  ),
+  [AppErrorCodes.InvalidNetwork]: __(
+    "This app is not available on the network you are connected to. Visit docs.worldcoin.org/test for details."
+  ),
+  [AppErrorCodes.InclusionProofFailed]: __("There was an issue fetching your credential. Please try again."),
+  [AppErrorCodes.InclusionProofPending]: __(
+    "Your credential is still being registered. Please wait a few minutes and try again."
+  ),
+  [AppErrorCodes.FailedByHostApp]: __("Verification failed by the app. Please contact the app owner for details."),
+  [AppErrorCodes.UnexpectedResponse]: __(
+    "Unexpected response from the World App or identity wallet. Please try again."
+  ),
+  [AppErrorCodes.GenericError]: __("Something unexpected went wrong. Please try again.")
+};
+var ErrorState = () => {
+  const { retryFlow, errorState } = idkit_default(getParams);
+  return /* @__PURE__ */ jsxs2("div", { className: "space-y-8", children: [
+    /* @__PURE__ */ jsx5("div", { className: "-mt-5 flex items-center justify-center", children: /* @__PURE__ */ jsx5("div", { className: "inline-flex aspect-square items-center justify-center rounded-full bg-red-100 p-5", children: /* @__PURE__ */ jsx5("div", { className: "flex aspect-square items-center justify-center rounded-full bg-red-500 p-5", children: /* @__PURE__ */ jsx5(XMarkIcon_default, { className: "w-8 text-white" }) }) }) }),
+    /* @__PURE__ */ jsxs2("div", { children: [
+      /* @__PURE__ */ jsx5("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: errorState?.code && ERROR_TITLES[errorState.code] || ERROR_TITLES[AppErrorCodes.GenericError] }),
+      /* @__PURE__ */ jsx5("p", { className: "mt-2 text-center text-lg text-gray-400", children: errorState?.message || ERROR_MESSAGES[errorState?.code ?? AppErrorCodes.GenericError] })
+    ] }),
+    /* @__PURE__ */ jsx5("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx5(
+      "button",
+      {
+        type: "button",
+        onClick: retryFlow,
+        className: "inline-flex items-center rounded-full border border-transparent bg-indigo-600 px-8 py-3 font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-indigo-600",
+        children: __("Try Again")
+      }
+    ) }),
+    /* @__PURE__ */ jsx5("div", { children: /* @__PURE__ */ jsx5("p", { className: "mt-4 text-xs text-gray-400", children: __("If you are the app owner, check the console for further details.") }) })
+  ] });
+};
+var ErrorState_default = ErrorState;
+
+// src/components/Icons/LoadingIcon.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var LoadingIcon = ({ className = "" }) => /* @__PURE__ */ jsx6("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx6(
+  "div",
+  {
+    className: `inline-block h-8 w-8 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite] ${className}`,
+    role: "status",
+    children: /* @__PURE__ */ jsx6("span", { className: "!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]", children: __("Loading...") })
+  }
+) });
+var LoadingIcon_default = LoadingIcon;
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import * as Toast from "@radix-ui/react-toast";
+
+// public/images/verified.webp
+var verified_default = "./verified-O6D4JQCX.webp";
+
+// src/components/WorldIDIcon.tsx
+import { Fragment, jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
+var WorldIDIcon = ({ border, size = "sm", ...props }) => {
+  const heightWidth = size === "md" ? 36 : 24;
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    border && /* @__PURE__ */ jsx7(
+      "svg",
+      {
+        className: classNames(
+          border,
+          "absolute left-1/2 top-1/2 w-[34px] -mt-[2px] transform -translate-x-1/2 -translate-y-1/2"
+        ),
+        xmlns: "http://www.w3.org/2000/svg",
+        fill: "currentColor",
+        viewBox: "0 0 26 26",
+        children: /* @__PURE__ */ jsx7("path", { d: "M8.382 2.244a6.938 6.938 0 0 1 9.236 0l1.626 1.451c.346.308.722.581 1.122.815l1.882 1.098a6.937 6.937 0 0 1 2.854 8.784l-.877 1.995c-.187.424-.33.866-.428 1.319l-.463 2.129a6.938 6.938 0 0 1-7.473 5.429l-2.168-.218a6.934 6.934 0 0 0-1.386 0l-2.168.218a6.938 6.938 0 0 1-7.473-5.429l-.463-2.13a6.937 6.937 0 0 0-.428-1.318l-.877-1.995a6.938 6.938 0 0 1 2.854-8.784L5.634 4.51c.4-.234.776-.507 1.122-.815l1.626-1.45Z" })
+      }
+    ),
+    /* @__PURE__ */ jsx7("img", { src: verified_default, ...props, alt: "Verified", width: heightWidth, height: heightWidth })
+  ] });
+};
+var WorldIDIcon_default = WorldIDIcon;
+
+// src/components/Icons/InfoIcon.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var InfoIcon = (props) => /* @__PURE__ */ jsx8("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 16 16", children: /* @__PURE__ */ jsx8(
+  "path",
+  {
+    fill: "currentColor",
+    fillRule: "evenodd",
+    d: "M14.665 7.999a6.667 6.667 0 1 1-13.333 0 6.667 6.667 0 0 1 13.333 0Zm-6-3.334a.667.667 0 1 1-1.333 0 .667.667 0 0 1 1.333 0Zm-1.333 1.5a.5.5 0 0 0 0 1h.167v4.167a.5.5 0 1 0 1 0V6.665a.5.5 0 0 0-.5-.5h-.667Z",
+    clipRule: "evenodd"
+  }
+) });
+var InfoIcon_default = InfoIcon;
+
+// src/components/IDKitWidget/States/PrivacyState.tsx
+import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
+var PrivacyState = () => {
+  return /* @__PURE__ */ jsxs4("div", { className: "-mt-6 flex flex-col items-center justify-center space-y-6 font-sans text-sm", children: [
+    /* @__PURE__ */ jsx9(WorldIDIcon_default, { className: "h-12 w-12" }),
+    /* @__PURE__ */ jsx9("p", { className: "text-center text-2xl font-semibold dark:text-white", children: __("Privacy preserving to the core.") }),
+    /* @__PURE__ */ jsxs4("ul", { className: "text-9eafc0 mb-6 list-disc space-y-3 px-12 dark:text-white", children: [
+      /* @__PURE__ */ jsx9("li", { className: "text-left", children: __(
+        "World ID uses Zero-Knowledge Proofs to make it cryptographically impossible to track persons across applications."
+      ) }),
+      /* @__PURE__ */ jsx9("li", { className: "text-left", children: __("Orb biometrics analyzed by the Orb are not stored.") }),
+      /* @__PURE__ */ jsxs4("li", { className: "text-left ", children: [
+        __("Code and hardware are open source or source available on"),
+        " ",
+        /* @__PURE__ */ jsx9(
+          "a",
+          {
+            href: "https://github.com/worldcoin/idkit-js",
+            target: "_blank",
+            className: "text-4940e0",
+            rel: "noreferrer",
+            children: "GitHub"
+          }
+        ),
+        "."
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs4("div", { className: "text-9eafc0 dark:text-9eafc0 -ml-4 flex items-center space-x-3", children: [
+      /* @__PURE__ */ jsx9(InfoIcon_default, { className: "h-4 w-4 " }),
+      /* @__PURE__ */ jsx9("p", { className: "whitespace-nowrap text-sm font-medium", children: __("Biometrics are never shared.") })
+    ] })
+  ] });
+};
+var PrivacyState_default = PrivacyState;
+
+// src/components/Icons/CheckIcon.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var CheckIcon = (props) => /* @__PURE__ */ jsx10("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 11 8", children: /* @__PURE__ */ jsx10(
+  "path",
+  {
+    stroke: "currentColor",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: "1.6",
+    d: "M9.868 1 3.771 7 1 4.273"
+  }
+) });
+var CheckIcon_default = CheckIcon;
+
+// src/components/IDKitWidget/States/SuccessState.tsx
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+var SuccessState = () => {
+  return /* @__PURE__ */ jsxs5("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx11("div", { className: "-mt-5 flex items-center justify-center", children: /* @__PURE__ */ jsx11("div", { className: "inline-flex aspect-square items-center justify-center rounded-full bg-green-100 p-5", children: /* @__PURE__ */ jsx11("div", { className: "flex aspect-square items-center justify-center rounded-full bg-green-500 p-5", children: /* @__PURE__ */ jsx11(CheckIcon_default, { className: "w-8 text-white" }) }) }) }),
+    /* @__PURE__ */ jsxs5("div", { children: [
+      /* @__PURE__ */ jsx11("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: __("Success! \u{1F389}") }),
+      /* @__PURE__ */ jsx11("p", { className: "text-70868f mt-2 text-center text-lg", children: __("World ID verification was successful") })
+    ] })
+  ] });
+};
+var SuccessState_default = SuccessState;
+
+// src/components/IDKitWidget/States/WorldID/QRState.tsx
+import copy from "copy-to-clipboard";
+import { useCallback, useState as useState2 } from "react";
+import { AnimatePresence, motion as motion2 } from "framer-motion";
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+var QRState = ({ qrData, showQR, setShowQR }) => {
+  const media = useMedia_default();
+  const [copiedLink, setCopiedLink] = useState2(false);
+  const copyLink = useCallback(() => {
+    copy(qrData ?? "");
+    setCopiedLink(true);
+    setTimeout(() => setCopiedLink(false), 2e3);
+  }, [qrData]);
+  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
+    (media == "desktop" || showQR) && /* @__PURE__ */ jsxs6(Fragment2, { children: [
+      /* @__PURE__ */ jsx12(AnimatePresence, { children: copiedLink && /* @__PURE__ */ jsx12(
+        motion2.div,
+        {
+          className: "text-sm text-9eafc0",
+          initial: "hidden",
+          animate: "visible",
+          exit: "exit",
+          variants: {
+            hidden: { opacity: 0, height: 0, marginTop: 0, y: 0 },
+            visible: {
+              opacity: 1,
+              height: "auto",
+              marginTop: 8,
+              y: 6,
+              transition: {
+                duration: 0.25,
+                opacity: { delay: 0.05, duration: 0.2 },
+                ease: "easeInOut"
+              }
+            },
+            exit: {
+              opacity: 0,
+              height: 0,
+              marginTop: 0,
+              y: 0,
+              transition: {
+                duration: 0.4,
+                delay: 0.1,
+                opacity: { duration: 0.25, delay: 0 },
+                ease: "easeInOut"
+              }
+            }
+          },
+          children: /* @__PURE__ */ jsx12("span", { className: "rounded-lg border border-f1f5f8 px-2 py-1 text-sm", children: __("QR Code copied") })
+        },
+        "copied"
+      ) }),
+      /* @__PURE__ */ jsx12("div", { className: "relative inline-flex items-center justify-center rounded-2xl border border-f1f5f8 p-2 dark:border-f1f5f8/10", children: /* @__PURE__ */ jsx12("div", { className: "text-29343f dark:text-white", children: qrData ? (
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+        /* @__PURE__ */ jsx12("div", { onClick: copyLink, className: "cursor-pointer", children: /* @__PURE__ */ jsx12(QRCode_default, { data: qrData, size: 244 }) })
+      ) : /* @__PURE__ */ jsx12("div", { className: "flex h-[244px] w-[244px] items-center justify-center", children: /* @__PURE__ */ jsx12(LoadingIcon_default, { className: "h-[72px] w-[72px]" }) }) }) })
+    ] }),
+    /* @__PURE__ */ jsxs6("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs6(
+        motion2.a,
+        {
+          href: qrData ?? "",
+          whileTap: { scale: 0.95 },
+          whileHover: { scale: 1.05 },
+          transition: { layout: { duration: 0.15 } },
+          layoutId: media == "desktop" ? void 0 : "worldid-button",
+          className: classNames(
+            "flex w-full space-x-2 items-center px-4 py-4 border border-transparent font-medium rounded-2xl shadow-sm",
+            "bg-0d151d dark:bg-white text-white dark:text-0d151d md:hidden"
+          ),
+          children: [
+            /* @__PURE__ */ jsx12(WorldcoinIcon_default, { className: "h-5 w-5" }),
+            /* @__PURE__ */ jsx12(
+              motion2.span,
+              {
+                className: "flex-1 text-center",
+                transition: { layout: { duration: 0.15 } },
+                layoutId: media == "desktop" ? void 0 : "worldid-text",
+                children: __("Open Worldcoin App")
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs6("div", { className: "space-x-2 md:hidden", children: [
+        /* @__PURE__ */ jsx12(motion2.button, { className: "text-sm text-9eafc0", onClick: () => setShowQR((state) => !state), children: showQR ? __("Hide QR Code") : __("Show QR Code instead") }),
+        showQR && /* @__PURE__ */ jsxs6(Fragment2, { children: [
+          /* @__PURE__ */ jsx12("span", { className: "text-9eafc0", children: "\xB7" }),
+          /* @__PURE__ */ jsx12("button", { className: "text-sm dark:text-white", onClick: copyLink, children: copiedLink ? __("Copied!") : __("Copy QR Code") })
+        ] })
+      ] })
+    ] })
+  ] });
+};
+var QRState_default = QRState;
+
+// src/components/IDKitWidget/States/WorldIDState.tsx
+import { shallow } from "zustand/shallow";
+import { useEffect as useEffect4, useState as useState3 } from "react";
+
+// src/components/Icons/LockIcon.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+var LockIcon = (props) => /* @__PURE__ */ jsx13("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 12 14", children: /* @__PURE__ */ jsx13(
+  "path",
+  {
+    fill: "currentColor",
+    fillRule: "evenodd",
+    d: "M6 0a3.555 3.555 0 0 0-3.563 3.547v.052A3.001 3.001 0 0 0 0 6.547V11a3 3 0 0 0 3 3h6a3 3 0 0 0 3-3V6.547a3.001 3.001 0 0 0-2.438-2.948v-.052A3.555 3.555 0 0 0 5.999 0Zm2.437 3.547A2.432 2.432 0 0 0 5.999 1.12a2.432 2.432 0 0 0-2.437 2.427h4.875ZM7.5 8.773c0 .825-.671 1.494-1.5 1.494-.828 0-1.5-.669-1.5-1.494 0-.824.672-1.493 1.5-1.493.829 0 1.5.669 1.5 1.493Z",
+    clipRule: "evenodd"
+  }
+) });
+var LockIcon_default = LockIcon;
+
+// src/components/Icons/HumanIcon.tsx
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+var HumanIcon = (props) => /* @__PURE__ */ jsxs7("svg", { ...props, xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 10 14", children: [
+  /* @__PURE__ */ jsx14(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M9.98 3.6c-.08-.345-.392-.553-.732-.477-.093.021-2.59.754-4.236.768C3.36 3.877.87 3.144.776 3.123a.629.629 0 0 0-.76.477.64.64 0 0 0 .467.767c.433.111 1.139.318 2.83.72 0 0-.02 2.28-.093 3.663-.1 1.99-.672 4.424-.672 4.424-.1.463.126.74.406.801.573.125.76-.276.826-.56l1.092-4.16A.128.128 0 0 1 5 9.164c.053 0 .106.027.126.09l1.093 4.16c.066.284.253.685.825.56.28-.062.507-.338.407-.801 0 0-.566-2.433-.673-4.424-.073-1.383-.093-3.664-.093-3.664 1.698-.4 2.398-.608 2.83-.719a.637.637 0 0 0 .467-.767Z"
+    }
+  ),
+  /* @__PURE__ */ jsx14(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M5.007 3.11a1.55 1.55 0 0 0 1.539-1.555C6.546.698 5.86 0 5.007 0A1.55 1.55 0 0 0 3.47 1.555c0 .857.686 1.555 1.538 1.555Z"
+    }
+  )
+] });
+var HumanIcon_default = HumanIcon;
+
+// src/components/AboutWorldID.tsx
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+var AboutWorldID = ({ className }) => {
+  return /* @__PURE__ */ jsxs8("div", { className: classNames(className, "space-y-4 text-left"), children: [
+    /* @__PURE__ */ jsx15("p", { className: "text-0d151d text-sm font-medium uppercase dark:text-white", children: __("What is World ID?") }),
+    /* @__PURE__ */ jsxs8("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx15(FeatureHighlight, { title: "Your global digital ID", icon: HumanIcon_default, children: /* @__PURE__ */ jsx15("p", { children: __("With Worldcoin and World ID sign in seamlessly and prove you are a unique human.") }) }),
+      /* @__PURE__ */ jsx15(FeatureHighlight, { title: "Privacy-preserving", icon: LockIcon_default, children: /* @__PURE__ */ jsx15("p", { children: __("Maximum privacy. Prevents cross-tracking and can be used fully anonymously.") }) })
+    ] })
+  ] });
+};
+var FeatureHighlight = ({ icon: Icon, title, children }) => /* @__PURE__ */ jsxs8("div", { className: "flex space-x-6", children: [
+  /* @__PURE__ */ jsx15("div", { className: "bg-d3dfea/30 dark:bg-29343f flex aspect-square h-8 w-8 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx15(Icon, { className: "text-0d151d h-3 w-3 dark:text-white" }) }),
+  /* @__PURE__ */ jsxs8("div", { children: [
+    /* @__PURE__ */ jsx15("p", { className: "text-0d151d font-medium dark:text-white", children: title }),
+    /* @__PURE__ */ jsx15("div", { className: "text-9eafc0 dark:text-9eafc0 mt-[2px] text-sm font-normal", children })
+  ] })
+] });
+var AboutWorldID_default = AboutWorldID;
+
+// src/services/wld-bridge.ts
+import { useEffect as useEffect3, useRef } from "react";
+import { useWorldBridgeStore } from "@worldcoin/idkit-core";
+var useWorldBridge = (app_id, action, signal, bridge_url, credential_types, action_description) => {
+  const ref_credential_types = useRef(credential_types);
+  const { reset, result, connectorURI, createClient, pollForUpdates, verificationState, errorCode } = useWorldBridgeStore();
+  useEffect3(() => {
+    if (!app_id)
+      return;
+    if (!connectorURI) {
+      void createClient(app_id, action, signal, bridge_url, ref_credential_types.current, action_description);
+    }
+  }, [app_id, action, signal, action_description, createClient, ref_credential_types, bridge_url, connectorURI]);
+  useEffect3(() => {
+    if (!connectorURI || result || errorCode)
+      return;
+    const interval = setInterval(() => void pollForUpdates(), 3e3);
+    return () => clearInterval(interval);
+  }, [connectorURI, pollForUpdates, errorCode, result]);
+  return { connectorURI, reset, result, verificationState, errorCode };
+};
+
+// src/components/IDKitWidget/States/WorldIDState.tsx
+import { AppErrorCodes as AppErrorCodes2, VerificationState } from "@worldcoin/idkit-core";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+var getOptions = (store) => ({
+  signal: store.signal,
+  app_id: store.app_id,
+  action: store.action,
+  setStage: store.setStage,
+  bridge_url: store.bridge_url,
+  handleVerify: store.handleVerify,
+  setErrorState: store.setErrorState,
+  credential_types: store.credential_types,
+  action_description: store.action_description
+});
+var WorldIDState = () => {
+  const media = useMedia_default();
+  const [showQR, setShowQR] = useState3(false);
+  const {
+    app_id,
+    action,
+    signal,
+    setStage,
+    handleVerify,
+    bridge_url,
+    action_description,
+    credential_types,
+    setErrorState
+  } = idkit_default(getOptions, shallow);
+  const { connectorURI, reset, errorCode, result, verificationState } = useWorldBridge(
+    app_id,
+    action,
+    signal,
+    bridge_url,
+    credential_types,
+    action_description
+  );
+  useEffect4(() => reset, [reset]);
+  useEffect4(() => {
+    if (verificationState === VerificationState.Failed) {
+      setStage("ERROR" /* ERROR */);
+      setErrorState({ code: errorCode ?? AppErrorCodes2.GenericError });
+    }
+    if (result) {
+      return handleVerify(result);
+    }
+  }, [result, reset, handleVerify, verificationState, setStage, errorCode, setErrorState]);
+  return /* @__PURE__ */ jsxs9("div", { className: "-mt-6 space-y-6", children: [
+    /* @__PURE__ */ jsxs9("div", { children: [
+      /* @__PURE__ */ jsx16("div", { className: "mb-2 flex items-center justify-center", children: /* @__PURE__ */ jsx16(WorldcoinIcon_default, { className: "h-8 text-0d151d dark:text-white" }) }),
+      /* @__PURE__ */ jsx16("p", { className: "text-center font-sora text-2xl font-semibold text-gray-900 dark:text-white", children: verificationState === VerificationState.WaitingForApp ? __("Confirm in World App") : __("Continue with Worldcoin") }),
+      verificationState === VerificationState.WaitingForApp && /* @__PURE__ */ jsx16("p", { className: "mt-3 text-center text-70868f dark:text-9eafc0 md:mt-2", children: "Please confirm the request in your app to continue." })
+    ] }),
+    verificationState === VerificationState.WaitingForApp ? /* @__PURE__ */ jsx16("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx16(LoadingIcon_default, { className: "h-20 w-20" }) }) : /* @__PURE__ */ jsx16(QRState_default, { showQR, setShowQR, qrData: connectorURI }),
+    (media == "desktop" || !showQR) && /* @__PURE__ */ jsx16(AboutWorldID_default, {})
+  ] });
+};
+var WorldIDState_default = WorldIDState;
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import * as Dialog from "@radix-ui/react-dialog";
+import { Fragment as Fragment3, useEffect as useEffect5, useMemo } from "react";
+
+// src/components/Icons/WorldIDWordmark.tsx
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var WorldIDWordmark = (props) => /* @__PURE__ */ jsxs10(
+  "svg",
+  {
+    ...props,
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "currentColor",
+    viewBox: "0 0 188 32",
+    clipRule: "evenodd",
+    fillRule: "evenodd",
+    children: [
+      /* @__PURE__ */ jsxs10("g", { clipPath: "url(#clip0_17_787)", children: [
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M68.7294 9.91241C72.0806 9.91241 74.8174 12.6489 74.8174 15.9997C74.8174 19.3504 72.0806 22.0869 68.7294 22.0869C65.3781 22.0869 62.6413 19.3504 62.6413 15.9997C62.6413 12.6489 65.3502 9.91241 68.7294 9.91241ZM68.7294 6.98047C63.7584 6.98047 59.709 11.0293 59.709 15.9997C59.709 20.97 63.7584 25.0189 68.7294 25.0189C73.7003 25.0189 77.7497 20.97 77.7497 15.9997C77.7497 11.0014 73.7003 6.98047 68.7294 6.98047Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M156.112 9.91241C159.463 9.91241 162.2 12.6489 162.2 15.9997C162.2 19.3504 159.463 22.0869 156.112 22.0869C152.761 22.0869 150.024 19.3504 150.024 15.9997C150.024 12.6489 152.761 9.91241 156.112 9.91241ZM156.112 6.98047C151.141 6.98047 147.092 11.0293 147.092 15.9997C147.092 20.97 151.141 25.0189 156.112 25.0189C161.083 25.0189 165.133 20.97 165.133 15.9997C165.133 11.0014 161.111 6.98047 156.112 6.98047Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M142.511 18.0939C141.645 20.4395 139.411 22.0869 136.786 22.0869C133.435 22.0869 130.698 19.3504 130.698 15.9997C130.698 12.6489 133.435 9.91241 136.786 9.91241C139.411 9.91241 141.645 11.5878 142.511 13.9054H145.555C144.633 9.94033 141.059 6.98047 136.786 6.98047C131.815 6.98047 127.766 11.0293 127.766 15.9997C127.766 20.97 131.815 25.0189 136.786 25.0189C141.059 25.0189 144.633 22.059 145.555 18.0939H142.511Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M117.209 10.1937C120.477 10.1937 123.13 12.9301 123.018 16.2251C122.906 19.3804 120.225 21.8097 117.07 21.8097H113.858V10.1937H117.209ZM117.209 7.26172H110.926V24.7416H117.209C122.041 24.7416 125.95 20.8324 125.95 16.0017C125.95 11.171 122.041 7.26172 117.209 7.26172Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17("path", { d: "M170.216 7.28906H167.283V24.7131H170.216V7.28906Z", fill: "black" }),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M44.0696 24.7947L47.3929 11.978L50.7162 24.7947H54.7377L59.2898 7.20312H56.2737L52.727 20.8576L49.1803 7.20312H45.6056L42.0589 20.8576L38.5122 7.20312H35.4961L40.0482 24.7947H44.0696Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M176.079 12.3158L184.96 24.7137H185.295H187.892V7.28964H184.96V19.6875L176.079 7.26172H175.855L175.827 7.28964H173.146V24.7137H176.079V12.3158Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17("path", { d: "M99.4753 7.28906H96.543V24.7131H108.775V21.7812H99.4753V7.28906Z", fill: "black" }),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M90.9038 17.5363C92.6911 16.6428 93.9199 14.8277 93.9199 12.7056C93.9199 9.7178 91.4902 7.31641 88.53 7.31641H83.0005H79.9844V18.1227V24.7405H83.0005V18.0948H84.6761C88.2507 18.2065 91.0993 21.1105 91.0993 24.7126H94.1154C94.1433 21.8644 92.8866 19.2955 90.9038 17.5363ZM83.0005 15.0791V10.3042H88.53C89.8426 10.3042 90.9038 11.3653 90.9038 12.6777C90.9038 13.9901 89.8426 15.0791 88.53 15.0791H83.0005Z",
+            fill: "black"
+          }
+        ),
+        /* @__PURE__ */ jsx17(
+          "path",
+          {
+            d: "M30.7195 9.77312C29.9097 7.87434 28.7647 6.17103 27.2845 4.6911C25.8044 3.21117 24.1288 2.06632 22.2298 1.25654C20.247 0.418848 18.1525 0 16.0021 0C13.8238 0 11.7293 0.418848 9.7744 1.25654C7.87537 2.06632 6.17184 3.21117 4.69171 4.6911C3.21159 6.17103 2.06659 7.87434 1.25671 9.77312C0.418903 11.7277 0 13.822 0 16C0 18.1501 0.418903 20.2443 1.25671 22.2269C2.06659 24.1257 3.21159 25.829 4.69171 27.3089C6.17184 28.7888 7.87537 29.9337 9.7744 30.7155C11.7572 31.5532 13.8517 31.9721 16.0021 31.9721C18.1525 31.9721 20.247 31.5532 22.2298 30.7155C24.1288 29.9058 25.8323 28.7609 27.3125 27.281C28.7926 25.801 29.9376 24.0977 30.7475 22.1989C31.5853 20.2164 32.0042 18.1222 32.0042 15.9721C32.0042 13.822 31.5574 11.7277 30.7195 9.77312ZM10.696 14.4921C11.3383 11.9232 13.6842 10.0524 16.4489 10.0524H27.5638C28.2899 11.4206 28.7367 12.9284 28.9043 14.4921H10.696ZM28.9043 17.5079C28.7367 19.0716 28.262 20.5794 27.5638 21.9476H16.4489C13.6842 21.9476 11.3662 20.0489 10.696 17.5079H28.9043ZM6.81415 6.81326C9.27172 4.35602 12.5392 3.01571 16.0021 3.01571C19.465 3.01571 22.7325 4.35602 25.19 6.81326C25.2738 6.89703 25.3297 6.95288 25.4134 7.03665H16.4489C14.0472 7.03665 11.8131 7.95811 10.1095 9.66143C8.76903 11.0017 7.9033 12.6771 7.62403 14.4921H3.09988C3.435 11.5881 4.71964 8.9075 6.81415 6.81326ZM16.0021 28.9843C12.5392 28.9843 9.27172 27.644 6.81415 25.1867C4.71964 23.0925 3.435 20.3839 3.09988 17.5079H7.62403C7.93123 19.3229 8.79696 20.9983 10.1095 22.3386C11.8131 24.0419 14.0472 24.9633 16.4489 24.9633H25.4134C25.3297 25.0471 25.2738 25.103 25.19 25.1867C22.7325 27.644 19.465 28.9843 16.0021 28.9843Z",
+            fill: "black"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx17("defs", { children: /* @__PURE__ */ jsx17("clipPath", { id: "clip0_17_787", children: /* @__PURE__ */ jsx17("rect", { width: "187.892", height: "32", fill: "white" }) }) })
+    ]
+  }
+);
+var WorldIDWordmark_default = WorldIDWordmark;
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import { AnimatePresence as AnimatePresence2, motion as motion3 } from "framer-motion";
+
+// src/components/Icons/ArrowLongLeftIcon.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+var ArrowLongLeftIcon = (props) => /* @__PURE__ */ jsx18(
+  "svg",
+  {
+    ...props,
+    fill: "none",
+    strokeWidth: 1.5,
+    viewBox: "0 0 24 24",
+    stroke: "currentColor",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /* @__PURE__ */ jsx18("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6.75 15.75L3 12m0 0l3.75-3.75M3 12h18" })
+  }
+);
+var ArrowLongLeftIcon_default = ArrowLongLeftIcon;
+
+// src/components/IDKitWidget/States/HostAppVerificationState.tsx
+import { memo } from "react";
+import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+var HostAppVerificationState = () => {
+  return /* @__PURE__ */ jsxs11("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsx19("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx19(LoadingIcon_default, { className: "h-24 w-24" }) }),
+    /* @__PURE__ */ jsx19("div", { className: "text-70868f mt-4", children: __("Transmitting verification to host app. Please wait...") })
+  ] });
+};
+var HostAppVerificationState_default = memo(HostAppVerificationState);
+
+// src/components/IDKitWidget/BaseWidget.tsx
+import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
+var getParams2 = ({ open, processing, onOpenChange, stage, setStage, theme, computed, setOptions }) => ({
+  stage,
+  theme,
+  setStage,
+  processing,
+  setOptions,
+  isOpen: open,
+  onOpenChange,
+  canGoBack: computed.canGoBack(stage)
+});
+var IDKitWidget = ({ children, ...config }) => {
+  const {
+    isOpen,
+    onOpenChange,
+    processing,
+    stage,
+    setStage,
+    canGoBack,
+    setOptions,
+    theme: _theme
+  } = idkit_default(getParams2, shallow2);
+  const media = useMedia_default();
+  useEffect5(() => {
+    setOptions(config, "props" /* PROPS */);
+  }, [config, setOptions]);
+  const StageContent = useMemo(() => {
+    switch (stage) {
+      case "WORLD_ID" /* WORLD_ID */:
+        return WorldIDState_default;
+      case "SUCCESS" /* SUCCESS */:
+        return SuccessState_default;
+      case "ERROR" /* ERROR */:
+        return ErrorState_default;
+      case "PRIVACY" /* PRIVACY */:
+        return PrivacyState_default;
+      case "HOST_APP_VERIFICATION" /* HOST_APP_VERIFICATION */:
+        return HostAppVerificationState_default;
+      default:
+        throw new Error(__("Invalid IDKitStage :stage.", { stage }));
+    }
+  }, [stage]);
+  return /* @__PURE__ */ jsxs12(Dialog.Root, { open: isOpen, onOpenChange, children: [
+    children?.({ open: () => onOpenChange(true) }),
+    /* @__PURE__ */ jsx20(Dialog.Portal, { forceMount: true, children: /* @__PURE__ */ jsx20(Fragment3, { children: /* @__PURE__ */ jsx20(AnimatePresence2, { children: isOpen && /* @__PURE__ */ jsxs12(root.div, { mode: "open", id: "idkit-widget", children: [
+      /* @__PURE__ */ jsx20(Styles_default, {}),
+      /* @__PURE__ */ jsxs12(
+        "div",
+        {
+          id: "modal",
+          className: classNames(_theme == "dark" && "dark", "fixed z-10 font-sans"),
+          children: [
+            /* @__PURE__ */ jsx20(Dialog.Overlay, { asChild: true, children: /* @__PURE__ */ jsx20(
+              motion3.div,
+              {
+                initial: { opacity: 0 },
+                animate: { opacity: 1 },
+                exit: { opacity: 0 },
+                className: "fixed inset-0 bg-black/50 backdrop-blur-lg"
+              }
+            ) }),
+            /* @__PURE__ */ jsx20("div", { className: "fixed inset-0 z-10 overflow-y-hidden md:overflow-y-auto", children: /* @__PURE__ */ jsx20("div", { className: "flex min-h-full items-end justify-center text-center md:items-center md:p-4", children: /* @__PURE__ */ jsx20(Dialog.Content, { asChild: true, children: /* @__PURE__ */ jsx20(
+              motion3.div,
+              {
+                layout: media == "mobile" ? "position" : true,
+                exit: media == "mobile" ? "initMob" : "init",
+                initial: media == "mobile" ? "initMob" : "init",
+                animate: media == "mobile" ? "animateMob" : "animate",
+                variants: {
+                  init: { opacity: 0, scale: 0.9 },
+                  initMob: { translateY: "100%" },
+                  animate: { opacity: 1, scale: 1 },
+                  animateMob: { translateY: 0 }
+                },
+                transition: { layout: { duration: 0.15 } },
+                className: "relative z-50 w-full rounded-t-2xl bg-white pt-6 shadow focus:outline-none focus-visible:ring focus-visible:ring-purple-500/75 dark:bg-0d151d md:max-w-md md:rounded-b-2xl",
+                children: /* @__PURE__ */ jsxs12(Toast.Provider, { children: [
+                  /* @__PURE__ */ jsx20(Toast.Viewport, { className: "flex justify-center" }),
+                  /* @__PURE__ */ jsxs12("div", { className: "mx-6 mb-12 flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsx20(
+                      "button",
+                      {
+                        onClick: () => setStage("WORLD_ID" /* WORLD_ID */),
+                        disabled: !canGoBack,
+                        className: classNames(
+                          !canGoBack && "invisible pointer-events-none",
+                          "dark:bg-d3dfea/15 flex h-8 w-8 items-center justify-center rounded-full bg-gray-100 dark:text-white"
+                        ),
+                        children: /* @__PURE__ */ jsx20(ArrowLongLeftIcon_default, { className: "w-4" })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx20(Dialog.Close, { className: "flex h-8 w-8 items-center justify-center rounded-full bg-gray-100 dark:bg-d3dfea/15 dark:text-white", children: /* @__PURE__ */ jsx20(XMarkIcon_default, { className: "h-5 w-5" }) })
+                  ] }),
+                  /* @__PURE__ */ jsxs12("div", { className: "relative", children: [
+                    /* @__PURE__ */ jsx20(
+                      motion3.div,
+                      {
+                        className: "mx-6 mb-6",
+                        layout: "position",
+                        animate: {
+                          visibility: processing ? "hidden" : "visible"
+                        },
+                        transition: { layout: { duration: 0.15 } },
+                        children: /* @__PURE__ */ jsx20(StageContent, {})
+                      }
+                    ),
+                    /* @__PURE__ */ jsx20(AnimatePresence2, { children: processing && /* @__PURE__ */ jsx20(
+                      motion3.div,
+                      {
+                        className: "absolute inset-0 flex items-center justify-center pb-10",
+                        initial: { opacity: 0 },
+                        animate: { opacity: 1 },
+                        exit: { opacity: 0 },
+                        children: /* @__PURE__ */ jsx20(LoadingIcon_default, { className: "h-24 w-24" })
+                      }
+                    ) })
+                  ] }),
+                  /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between px-5 py-3 md:rounded-b-2xl", children: [
+                    /* @__PURE__ */ jsxs12("p", { className: "flex items-center gap-1 text-sm text-9eafc0", children: [
+                      /* @__PURE__ */ jsx20("span", { children: __("Verified with") }),
+                      /* @__PURE__ */ jsx20(
+                        "a",
+                        {
+                          href: "https://worldcoin.org/world-id",
+                          target: "_blank",
+                          rel: "noreferrer",
+                          children: /* @__PURE__ */ jsx20(WorldIDWordmark_default, { className: "h-4 text-0d151d dark:text-white" })
+                        }
+                      )
+                    ] }),
+                    stage != "PRIVACY" /* PRIVACY */ ? /* @__PURE__ */ jsx20(
+                      "button",
+                      {
+                        onClick: () => setStage("PRIVACY" /* PRIVACY */),
+                        className: "text-sm text-9eafc0 hover:underline",
+                        children: __("Privacy")
+                      }
+                    ) : /* @__PURE__ */ jsxs12(
+                      "a",
+                      {
+                        target: "_blank",
+                        href: "https://docs.worldcoin.org/privacy",
+                        className: "text-sm text-9eafc0 hover:underline dark:text-9eafc0",
+                        rel: "noreferrer",
+                        children: [
+                          __("Learn More"),
+                          " \u2192"
+                        ]
+                      }
+                    )
+                  ] })
+                ] })
+              }
+            ) }) }) })
+          ]
+        }
+      )
+    ] }) }) }) })
+  ] });
+};
+var BaseWidget_default = IDKitWidget;
+
+// src/components/IDKitWidget/index.tsx
+var IDKitWidget_default = memo2(BaseWidget_default);
+
+// src/index.ts
+import { solidityEncode } from "@worldcoin/idkit-core/hashing";
+
+// src/components/SignInWithWorldID.tsx
+import { useMemo as useMemo2 } from "react";
+import { useState as useState4 } from "react";
+import { useCallback as useCallback2 } from "react";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var SignInWithWorldID = ({ onSuccess, app_id, nonce, theme, children, ...props }) => {
+  const [token, setToken] = useState4("");
+  const signal = useMemo2(() => {
+    if (nonce)
+      return nonce;
+    return Date.now().toString();
+  }, [nonce]);
+  const handleVerify = useCallback2(
+    async (proof) => {
+      const response = await fetch("https://developer.worldcoin.org/api/v1/oidc/authorize", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({ ...proof, app_id, nonce: signal, response_type: "id_token" })
+      });
+      if (!response.ok) {
+        if (response.status != 400) {
+          throw new Error("Something went wrong when verifying your identity. Please try again.");
+        }
+        const error = await response.json();
+        throw new Error(error.message);
+      }
+      const { jwt } = await response.json();
+      setToken(jwt);
+    },
+    [app_id, signal]
+  );
+  const onIDKitSuccess = useCallback2(() => void onSuccess(token), [onSuccess, token]);
+  return /* @__PURE__ */ jsx21(
+    IDKitWidget_default,
+    {
+      ...props,
+      action: "",
+      autoClose: true,
+      theme,
+      app_id,
+      signal,
+      onSuccess: onIDKitSuccess,
+      handleVerify,
+      children: children ?? (({ open }) => /* @__PURE__ */ jsx21(SignInButton_default, { onClick: open, theme }))
+    }
+  );
+};
+var SignInWithWorldID_default = SignInWithWorldID;
+export {
+  CredentialType,
+  IDKitWidget_default as IDKitWidget,
+  SignInButton_default as SignInButton,
+  SignInWithWorldID_default as SignInWithWorldID,
+  solidityEncode,
+  useIDKit_default as useIDKit
+};