@thunderid/react 1.5.0 → 1.7.0

package/dist/cjs/components/admin/shared/AdminParts.styles.cjs

@@ -0,0 +1,89 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_emotion = require('../../../styles/emotion.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/admin/shared/AdminParts.styles.ts
+/**
+* Creates the styles for the detail list, chip list and inline confirmation used by the admin
+* components.
+*
+* @param theme - The theme object containing design tokens.
+* @param colorScheme - The current color scheme, used for memoization.
+* @returns The CSS class names for each part.
+*/
+const useStyles = (theme, colorScheme) => (0, react.useMemo)(() => {
+	const unit = theme.vars.spacing.unit;
+	return {
+		chip: require_emotion.css`
+        display: inline-flex;
+        align-items: center;
+        gap: calc(${unit} / 2);
+        padding: calc(${unit} / 2) ${unit};
+        border-radius: 999px;
+        border: 1px solid ${theme.vars.colors.border};
+        background: ${theme.vars.colors.background.surface};
+        font-size: ${theme.vars.typography.fontSizes.sm};
+        color: ${theme.vars.colors.text.primary};
+      `,
+		chipList: require_emotion.css`
+        display: flex;
+        flex-wrap: wrap;
+        gap: ${unit};
+        margin: 0;
+        padding: 0;
+        list-style: none;
+      `,
+		confirm: require_emotion.css`
+        display: inline-flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: ${unit};
+        font-size: ${theme.vars.typography.fontSizes.sm};
+      `,
+		detail: require_emotion.css`
+        display: grid;
+        grid-template-columns: fit-content(200px) minmax(0, 1fr);
+        gap: ${unit} calc(${unit} * 2);
+        margin: 0;
+        font-size: ${theme.vars.typography.fontSizes.sm};
+      `,
+		detailLabel: require_emotion.css`
+        color: ${theme.vars.colors.text.secondary};
+      `,
+		detailValue: require_emotion.css`
+        margin: 0;
+        color: ${theme.vars.colors.text.primary};
+        overflow-wrap: anywhere;
+      `,
+		muted: require_emotion.css`
+        color: ${theme.vars.colors.text.secondary};
+        font-size: ${theme.vars.typography.fontSizes.sm};
+      `,
+		panel: require_emotion.css`
+        display: flex;
+        flex-direction: column;
+        gap: calc(${unit} * 1.5);
+        padding: calc(${unit} * 2);
+        border: 1px solid ${theme.vars.colors.border};
+        border-radius: ${theme.vars.borderRadius.large};
+        background: ${theme.vars.colors.background.surface};
+      `,
+		panelTitle: require_emotion.css`
+        margin: 0;
+        font-size: ${theme.vars.typography.fontSizes.md};
+        font-weight: ${theme.vars.typography.fontWeights.semibold};
+      `,
+		row: require_emotion.css`
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: calc(${unit} * 1.5);
+      `
+	};
+}, [theme, colorScheme]);
+var AdminParts_styles_default = useStyles;
+
+//#endregion
+exports.default = AdminParts_styles_default;
+//# sourceMappingURL=AdminParts.styles.cjs.map

package/dist/cjs/components/admin/shared/AdminParts.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminParts.styles.cjs","names":["unit: string"],"sources":["../../../../../src/components/admin/shared/AdminParts.styles.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme} from '@thunderid/browser';\nimport {useMemo} from 'react';\nimport {css} from '../../../styles/emotion';\n\n/**\n * Creates the styles for the detail list, chip list and inline confirmation used by the admin\n * components.\n *\n * @param theme - The theme object containing design tokens.\n * @param colorScheme - The current color scheme, used for memoization.\n * @returns The CSS class names for each part.\n */\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>\n  useMemo(() => {\n    const unit: string = theme.vars.spacing.unit;\n\n    return {\n      chip: css`\n        display: inline-flex;\n        align-items: center;\n        gap: calc(${unit} / 2);\n        padding: calc(${unit} / 2) ${unit};\n        border-radius: 999px;\n        border: 1px solid ${theme.vars.colors.border};\n        background: ${theme.vars.colors.background.surface};\n        font-size: ${theme.vars.typography.fontSizes.sm};\n        color: ${theme.vars.colors.text.primary};\n      `,\n      chipList: css`\n        display: flex;\n        flex-wrap: wrap;\n        gap: ${unit};\n        margin: 0;\n        padding: 0;\n        list-style: none;\n      `,\n      confirm: css`\n        display: inline-flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: ${unit};\n        font-size: ${theme.vars.typography.fontSizes.sm};\n      `,\n      detail: css`\n        display: grid;\n        grid-template-columns: fit-content(200px) minmax(0, 1fr);\n        gap: ${unit} calc(${unit} * 2);\n        margin: 0;\n        font-size: ${theme.vars.typography.fontSizes.sm};\n      `,\n      detailLabel: css`\n        color: ${theme.vars.colors.text.secondary};\n      `,\n      detailValue: css`\n        margin: 0;\n        color: ${theme.vars.colors.text.primary};\n        overflow-wrap: anywhere;\n      `,\n      muted: css`\n        color: ${theme.vars.colors.text.secondary};\n        font-size: ${theme.vars.typography.fontSizes.sm};\n      `,\n      panel: css`\n        display: flex;\n        flex-direction: column;\n        gap: calc(${unit} * 1.5);\n        padding: calc(${unit} * 2);\n        border: 1px solid ${theme.vars.colors.border};\n        border-radius: ${theme.vars.borderRadius.large};\n        background: ${theme.vars.colors.background.surface};\n      `,\n      panelTitle: css`\n        margin: 0;\n        font-size: ${theme.vars.typography.fontSizes.md};\n        font-weight: ${theme.vars.typography.fontWeights.semibold};\n      `,\n      row: css`\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        gap: calc(${unit} * 1.5);\n      `,\n    };\n  }, [theme, colorScheme]);\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;;;;;AAeA,MAAM,aAAa,OAAc,yCACjB;CACZ,MAAMA,OAAe,MAAM,KAAK,QAAQ;AAExC,QAAO;EACL,MAAM,mBAAG;;;oBAGK,KAAK;wBACD,KAAK,QAAQ,KAAK;;4BAEd,MAAM,KAAK,OAAO,OAAO;sBAC/B,MAAM,KAAK,OAAO,WAAW,QAAQ;qBACtC,MAAM,KAAK,WAAW,UAAU,GAAG;iBACvC,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAE1C,UAAU,mBAAG;;;eAGJ,KAAK;;;;;EAKd,SAAS,mBAAG;;;;eAIH,KAAK;qBACC,MAAM,KAAK,WAAW,UAAU,GAAG;;EAElD,QAAQ,mBAAG;;;eAGF,KAAK,QAAQ,KAAK;;qBAEZ,MAAM,KAAK,WAAW,UAAU,GAAG;;EAElD,aAAa,mBAAG;iBACL,MAAM,KAAK,OAAO,KAAK,UAAU;;EAE5C,aAAa,mBAAG;;iBAEL,MAAM,KAAK,OAAO,KAAK,QAAQ;;;EAG1C,OAAO,mBAAG;iBACC,MAAM,KAAK,OAAO,KAAK,UAAU;qBAC7B,MAAM,KAAK,WAAW,UAAU,GAAG;;EAElD,OAAO,mBAAG;;;oBAGI,KAAK;wBACD,KAAK;4BACD,MAAM,KAAK,OAAO,OAAO;yBAC5B,MAAM,KAAK,aAAa,MAAM;sBACjC,MAAM,KAAK,OAAO,WAAW,QAAQ;;EAErD,YAAY,mBAAG;;qBAEA,MAAM,KAAK,WAAW,UAAU,GAAG;uBACjC,MAAM,KAAK,WAAW,YAAY,SAAS;;EAE5D,KAAK,mBAAG;;;;oBAIM,KAAK;;EAEpB;GACA,CAAC,OAAO,YAAY,CAAC;AAE1B,gCAAe"}

package/dist/cjs/components/admin/shared/AdminSearch.cjs

@@ -0,0 +1,73 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_useTranslation = require('../../../hooks/useTranslation.cjs');
+const require_Button = require('../../primitives/Button/Button.cjs');
+const require_TextField = require('../../primitives/TextField/TextField.cjs');
+const require_Select = require('../../primitives/Select/Select.cjs');
+const require_useAdminPartStyles = require('./useAdminPartStyles.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/admin/shared/AdminSearch.tsx
+/**
+* Searches an admin list by one attribute. The server matches the whole value, so the search runs when
+* submitted rather than on every keystroke.
+*/
+const AdminSearch = ({ attributes, onSearch, search = null }) => {
+	const styles = require_useAdminPartStyles.default();
+	const { t } = require_useTranslation.default();
+	const [attribute, setAttribute] = (0, react.useState)(search?.attribute ?? attributes[0]?.value ?? "");
+	const [value, setValue] = (0, react.useState)(search?.value ?? "");
+	const label = attributes.find((option) => option.value === attribute)?.label ?? attribute;
+	const handleSubmit = (event) => {
+		event.preventDefault();
+		onSearch(value.trim() ? {
+			attribute,
+			value: value.trim()
+		} : null);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+		className: styles["row"],
+		onSubmit: handleSubmit,
+		role: "search",
+		style: { alignItems: "flex-end" },
+		children: [
+			attributes.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Select.default, {
+				label: t("admin.common.search.attribute"),
+				name: "searchAttribute",
+				value: attribute,
+				options: attributes,
+				onChange: (event) => setAttribute(event.target.value)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_TextField.default, {
+				name: "search",
+				type: "search",
+				label: attributes.length > 1 ? void 0 : label,
+				"aria-label": label,
+				placeholder: t("admin.common.search.placeholder", { attribute: label.toLowerCase() }),
+				value,
+				onChange: (event) => setValue(event.target.value)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
+				type: "submit",
+				variant: "outline",
+				children: t("admin.common.search.submit")
+			}),
+			search && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
+				type: "button",
+				variant: "text",
+				onClick: () => {
+					setValue("");
+					onSearch(null);
+				},
+				children: t("admin.common.search.clear")
+			})
+		]
+	});
+};
+var AdminSearch_default = AdminSearch;
+
+//#endregion
+exports.default = AdminSearch_default;
+//# sourceMappingURL=AdminSearch.cjs.map

package/dist/cjs/components/admin/shared/AdminSearch.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminSearch.cjs","names":["styles: Record<string, string>","useAdminPartStyles","useTranslation","label: string","Select","TextField","Button"],"sources":["../../../../../src/components/admin/shared/AdminSearch.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {SelectOption} from '@thunderid/browser';\nimport {ChangeEvent, FormEvent, ReactElement, useState} from 'react';\nimport useAdminPartStyles from './useAdminPartStyles';\nimport useTranslation from '../../../hooks/useTranslation';\nimport Button from '../../primitives/Button/Button';\nimport Select from '../../primitives/Select/Select';\nimport TextField from '../../primitives/TextField/TextField';\n\n/**\n * A search an admin list applies on the server: the attribute to match and the value it must equal.\n */\nexport interface AdminSearchValue {\n  attribute: string;\n  value: string;\n}\n\nexport interface AdminSearchProps {\n  /**\n   * The attributes that can be searched, with translated labels. The attribute select is hidden when\n   * there is only one.\n   */\n  attributes: SelectOption[];\n  /**\n   * Called with the search to apply when the form is submitted, or `null` when it is cleared.\n   */\n  onSearch: (search: AdminSearchValue | null) => void;\n  /**\n   * The search currently applied.\n   */\n  search?: AdminSearchValue | null;\n}\n\n/**\n * Searches an admin list by one attribute. The server matches the whole value, so the search runs when\n * submitted rather than on every keystroke.\n */\nconst AdminSearch = ({attributes, onSearch, search = null}: AdminSearchProps): ReactElement => {\n  const styles: Record<string, string> = useAdminPartStyles();\n  const {t} = useTranslation();\n  const [attribute, setAttribute] = useState<string>(search?.attribute ?? attributes[0]?.value ?? '');\n  const [value, setValue] = useState<string>(search?.value ?? '');\n  const label: string = attributes.find((option: SelectOption) => option.value === attribute)?.label ?? attribute;\n\n  const handleSubmit = (event: FormEvent<HTMLFormElement>): void => {\n    event.preventDefault();\n    onSearch(value.trim() ? {attribute, value: value.trim()} : null);\n  };\n\n  return (\n    <form className={styles['row']} onSubmit={handleSubmit} role=\"search\" style={{alignItems: 'flex-end'}}>\n      {attributes.length > 1 && (\n        <Select\n          label={t('admin.common.search.attribute')}\n          name=\"searchAttribute\"\n          value={attribute}\n          options={attributes}\n          onChange={(event: ChangeEvent<HTMLSelectElement>): void => setAttribute(event.target.value)}\n        />\n      )}\n      <TextField\n        name=\"search\"\n        type=\"search\"\n        label={attributes.length > 1 ? undefined : label}\n        aria-label={label}\n        placeholder={t('admin.common.search.placeholder', {attribute: label.toLowerCase()})}\n        value={value}\n        onChange={(event: ChangeEvent<HTMLInputElement>): void => setValue(event.target.value)}\n      />\n      <Button type=\"submit\" variant=\"outline\">\n        {t('admin.common.search.submit')}\n      </Button>\n      {search && (\n        <Button\n          type=\"button\"\n          variant=\"text\"\n          onClick={(): void => {\n            setValue('');\n            onSearch(null);\n          }}\n        >\n          {t('admin.common.search.clear')}\n        </Button>\n      )}\n    </form>\n  );\n};\n\nexport default AdminSearch;\n"],"mappings":";;;;;;;;;;;;;;;;AAuCA,MAAM,eAAe,EAAC,YAAY,UAAU,SAAS,WAA0C;CAC7F,MAAMA,SAAiCC,oCAAoB;CAC3D,MAAM,EAAC,MAAKC,gCAAgB;CAC5B,MAAM,CAAC,WAAW,oCAAiC,QAAQ,aAAa,WAAW,IAAI,SAAS,GAAG;CACnG,MAAM,CAAC,OAAO,gCAA6B,QAAQ,SAAS,GAAG;CAC/D,MAAMC,QAAgB,WAAW,MAAM,WAAyB,OAAO,UAAU,UAAU,EAAE,SAAS;CAEtG,MAAM,gBAAgB,UAA4C;AAChE,QAAM,gBAAgB;AACtB,WAAS,MAAM,MAAM,GAAG;GAAC;GAAW,OAAO,MAAM,MAAM;GAAC,GAAG,KAAK;;AAGlE,QACE,4CAAC;EAAK,WAAW,OAAO;EAAQ,UAAU;EAAc,MAAK;EAAS,OAAO,EAAC,YAAY,YAAW;;GAClG,WAAW,SAAS,KACnB,2CAACC;IACC,OAAO,EAAE,gCAAgC;IACzC,MAAK;IACL,OAAO;IACP,SAAS;IACT,WAAW,UAAgD,aAAa,MAAM,OAAO,MAAM;KAC3F;GAEJ,2CAACC;IACC,MAAK;IACL,MAAK;IACL,OAAO,WAAW,SAAS,IAAI,SAAY;IAC3C,cAAY;IACZ,aAAa,EAAE,mCAAmC,EAAC,WAAW,MAAM,aAAa,EAAC,CAAC;IAC5E;IACP,WAAW,UAA+C,SAAS,MAAM,OAAO,MAAM;KACtF;GACF,2CAACC;IAAO,MAAK;IAAS,SAAQ;cAC3B,EAAE,6BAA6B;KACzB;GACR,UACC,2CAACA;IACC,MAAK;IACL,SAAQ;IACR,eAAqB;AACnB,cAAS,GAAG;AACZ,cAAS,KAAK;;cAGf,EAAE,4BAA4B;KACxB;;GAEN;;AAIX,0BAAe"}

package/dist/cjs/components/admin/shared/AdminSection.cjs

@@ -0,0 +1,44 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_emotion = require('../../../styles/emotion.cjs');
+const require_useTheme = require('../../../contexts/Theme/useTheme.cjs');
+const require_ComponentPreferencesContext = require('../../../contexts/I18n/ComponentPreferencesContext.cjs');
+const require_AdminSection_styles = require('./AdminSection.styles.cjs');
+let __thunderid_browser = require("@thunderid/browser");
+__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/admin/shared/AdminSection.tsx
+/**
+* Frames an admin component with a title, a description and actions.
+*/
+const AdminSection = ({ actions, block, children, className, description, headingLevel = 2, preferences, title }) => {
+	const { theme, colorScheme } = require_useTheme.default();
+	const styles = require_AdminSection_styles.default(theme, colorScheme);
+	const Heading = `h${headingLevel}`;
+	const content = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: require_emotion.cx((0, __thunderid_browser.withVendorCSSClassPrefix)((0, __thunderid_browser.bem)(block)), styles["root"], className),
+		children: [(Boolean(title) || Boolean(actions)) && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: require_emotion.cx((0, __thunderid_browser.withVendorCSSClassPrefix)((0, __thunderid_browser.bem)(block, "header")), styles["header"]),
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Heading, {
+				className: styles["title"],
+				children: title
+			}), description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: styles["description"],
+				children: description
+			})] }), actions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: styles["actions"],
+				children: actions
+			})]
+		}), children]
+	});
+	return preferences ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ComponentPreferencesContext.default.Provider, {
+		value: preferences,
+		children: content
+	}) : content;
+};
+var AdminSection_default = AdminSection;
+
+//#endregion
+exports.default = AdminSection_default;
+//# sourceMappingURL=AdminSection.cjs.map

package/dist/cjs/components/admin/shared/AdminSection.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminSection.cjs","names":["AdminSection: FC<AdminSectionProps>","useTheme","styles: Record<string, string>","useStyles","Heading: `h${typeof headingLevel}`","content: ReactElement","cx","ComponentPreferencesContext"],"sources":["../../../../../src/components/admin/shared/AdminSection.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Preferences, bem, withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode} from 'react';\nimport useStyles from './AdminSection.styles';\nimport ComponentPreferencesContext from '../../../contexts/I18n/ComponentPreferencesContext';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {cx} from '../../../styles/emotion';\n\nexport interface AdminSectionProps {\n  /**\n   * Controls rendered next to the title, such as a create button.\n   */\n  actions?: ReactNode;\n  /**\n   * BEM block name of the component that renders the section, used for its CSS class.\n   */\n  block: string;\n  children?: ReactNode;\n  className?: string;\n  description?: string;\n  /**\n   * Heading level of the title.\n   * @default 2\n   */\n  headingLevel?: 2 | 3 | 4;\n  /**\n   * Component-level preferences, applied to this section and everything rendered inside it.\n   */\n  preferences?: Preferences;\n  title?: string;\n}\n\n/**\n * Frames an admin component with a title, a description and actions.\n */\nconst AdminSection: FC<AdminSectionProps> = ({\n  actions,\n  block,\n  children,\n  className,\n  description,\n  headingLevel = 2,\n  preferences,\n  title,\n}: AdminSectionProps): ReactElement => {\n  const {theme, colorScheme} = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme);\n  const Heading: `h${typeof headingLevel}` = `h${headingLevel}`;\n\n  const content: ReactElement = (\n    <section className={cx(withVendorCSSClassPrefix(bem(block)), styles['root'], className)}>\n      {(Boolean(title) || Boolean(actions)) && (\n        <div className={cx(withVendorCSSClassPrefix(bem(block, 'header')), styles['header'])}>\n          <div>\n            {title && <Heading className={styles['title']}>{title}</Heading>}\n            {description && <p className={styles['description']}>{description}</p>}\n          </div>\n          {actions && <div className={styles['actions']}>{actions}</div>}\n        </div>\n      )}\n      {children}\n    </section>\n  );\n\n  return preferences ? (\n    <ComponentPreferencesContext.Provider value={preferences}>{content}</ComponentPreferencesContext.Provider>\n  ) : (\n    content\n  );\n};\n\nexport default AdminSection;\n"],"mappings":";;;;;;;;;;;;;;AAqCA,MAAMA,gBAAuC,EAC3C,SACA,OACA,UACA,WACA,aACA,eAAe,GACf,aACA,YACqC;CACrC,MAAM,EAAC,OAAO,gBAAeC,0BAAU;CACvC,MAAMC,SAAiCC,oCAAU,OAAO,YAAY;CACpE,MAAMC,UAAqC,IAAI;CAE/C,MAAMC,UACJ,4CAAC;EAAQ,WAAWC,kGAAgC,MAAM,CAAC,EAAE,OAAO,SAAS,UAAU;cACnF,QAAQ,MAAM,IAAI,QAAQ,QAAQ,KAClC,4CAAC;GAAI,WAAWA,kGAAgC,OAAO,SAAS,CAAC,EAAE,OAAO,UAAU;cAClF,4CAAC,oBACE,SAAS,2CAAC;IAAQ,WAAW,OAAO;cAAW;KAAgB,EAC/D,eAAe,2CAAC;IAAE,WAAW,OAAO;cAAiB;KAAgB,IAClE,EACL,WAAW,2CAAC;IAAI,WAAW,OAAO;cAAa;KAAc;IAC1D,EAEP;GACO;AAGZ,QAAO,cACL,2CAACC,4CAA4B;EAAS,OAAO;YAAc;GAA+C,GAE1G;;AAIJ,2BAAe"}

package/dist/cjs/components/admin/shared/AdminSection.styles.cjs

@@ -0,0 +1,63 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_emotion = require('../../../styles/emotion.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+
+//#region src/components/admin/shared/AdminSection.styles.ts
+/**
+* Creates the styles shared by the admin components: the section frame and the create forms.
+*
+* @param theme - The theme object containing design tokens.
+* @param colorScheme - The current color scheme, used for memoization.
+* @returns The CSS class names for each part.
+*/
+const useStyles = (theme, colorScheme) => (0, react.useMemo)(() => {
+	const unit = theme.vars.spacing.unit;
+	return {
+		actions: require_emotion.css`
+        display: flex;
+        flex-wrap: wrap;
+        gap: ${unit};
+      `,
+		description: require_emotion.css`
+        margin: calc(${unit} / 2) 0 0;
+        color: ${theme.vars.colors.text.secondary};
+        font-size: ${theme.vars.typography.fontSizes.sm};
+      `,
+		form: require_emotion.css`
+        display: flex;
+        flex-direction: column;
+        gap: calc(${unit} * 2);
+        max-width: 560px;
+      `,
+		formActions: require_emotion.css`
+        display: flex;
+        gap: ${unit};
+        justify-content: flex-end;
+      `,
+		header: require_emotion.css`
+        display: flex;
+        flex-wrap: wrap;
+        align-items: flex-end;
+        justify-content: space-between;
+        gap: calc(${unit} * 1.5);
+      `,
+		root: require_emotion.css`
+        display: flex;
+        flex-direction: column;
+        gap: calc(${unit} * 2);
+        font-family: ${theme.vars.typography.fontFamily};
+        color: ${theme.vars.colors.text.primary};
+      `,
+		title: require_emotion.css`
+        margin: 0;
+        font-size: ${theme.vars.typography.fontSizes.xl};
+        font-weight: ${theme.vars.typography.fontWeights.normal};
+      `
+	};
+}, [theme, colorScheme]);
+var AdminSection_styles_default = useStyles;
+
+//#endregion
+exports.default = AdminSection_styles_default;
+//# sourceMappingURL=AdminSection.styles.cjs.map

package/dist/cjs/components/admin/shared/AdminSection.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminSection.styles.cjs","names":["unit: string"],"sources":["../../../../../src/components/admin/shared/AdminSection.styles.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme} from '@thunderid/browser';\nimport {useMemo} from 'react';\nimport {css} from '../../../styles/emotion';\n\n/**\n * Creates the styles shared by the admin components: the section frame and the create forms.\n *\n * @param theme - The theme object containing design tokens.\n * @param colorScheme - The current color scheme, used for memoization.\n * @returns The CSS class names for each part.\n */\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>\n  useMemo(() => {\n    const unit: string = theme.vars.spacing.unit;\n\n    return {\n      actions: css`\n        display: flex;\n        flex-wrap: wrap;\n        gap: ${unit};\n      `,\n      description: css`\n        margin: calc(${unit} / 2) 0 0;\n        color: ${theme.vars.colors.text.secondary};\n        font-size: ${theme.vars.typography.fontSizes.sm};\n      `,\n      form: css`\n        display: flex;\n        flex-direction: column;\n        gap: calc(${unit} * 2);\n        max-width: 560px;\n      `,\n      formActions: css`\n        display: flex;\n        gap: ${unit};\n        justify-content: flex-end;\n      `,\n      header: css`\n        display: flex;\n        flex-wrap: wrap;\n        align-items: flex-end;\n        justify-content: space-between;\n        gap: calc(${unit} * 1.5);\n      `,\n      root: css`\n        display: flex;\n        flex-direction: column;\n        gap: calc(${unit} * 2);\n        font-family: ${theme.vars.typography.fontFamily};\n        color: ${theme.vars.colors.text.primary};\n      `,\n      title: css`\n        margin: 0;\n        font-size: ${theme.vars.typography.fontSizes.xl};\n        font-weight: ${theme.vars.typography.fontWeights.normal};\n      `,\n    };\n  }, [theme, colorScheme]);\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,aAAa,OAAc,yCACjB;CACZ,MAAMA,OAAe,MAAM,KAAK,QAAQ;AAExC,QAAO;EACL,SAAS,mBAAG;;;eAGH,KAAK;;EAEd,aAAa,mBAAG;uBACC,KAAK;iBACX,MAAM,KAAK,OAAO,KAAK,UAAU;qBAC7B,MAAM,KAAK,WAAW,UAAU,GAAG;;EAElD,MAAM,mBAAG;;;oBAGK,KAAK;;;EAGnB,aAAa,mBAAG;;eAEP,KAAK;;;EAGd,QAAQ,mBAAG;;;;;oBAKG,KAAK;;EAEnB,MAAM,mBAAG;;;oBAGK,KAAK;uBACF,MAAM,KAAK,WAAW,WAAW;iBACvC,MAAM,KAAK,OAAO,KAAK,QAAQ;;EAE1C,OAAO,mBAAG;;qBAEK,MAAM,KAAK,WAAW,UAAU,GAAG;uBACjC,MAAM,KAAK,WAAW,YAAY,OAAO;;EAE3D;GACA,CAAC,OAAO,YAAY,CAAC;AAE1B,kCAAe"}

package/dist/cjs/components/admin/shared/IdentityPicker.cjs

@@ -0,0 +1,71 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_useTranslation = require('../../../hooks/useTranslation.cjs');
+const require_Button = require('../../primitives/Button/Button.cjs');
+const require_Select = require('../../primitives/Select/Select.cjs');
+const require_useAdminPartStyles = require('./useAdminPartStyles.cjs');
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/admin/shared/IdentityPicker.tsx
+/**
+* Picks one identity of a chosen type and adds it, for example as a group member or a role assignee.
+*/
+const IdentityPicker = ({ addLabel, candidates, excludedIds = [], isSubmitting = false, onAdd, types }) => {
+	const styles = require_useAdminPartStyles.default();
+	const { t } = require_useTranslation.default();
+	const [type, setType] = (0, react.useState)(types[0]?.value);
+	const [identityId, setIdentityId] = (0, react.useState)("");
+	const options = (candidates[type] ?? []).filter((candidate) => !excludedIds.includes(candidate.id)).map((candidate) => ({
+		label: candidate.label,
+		value: candidate.id
+	}));
+	const handleSubmit = (event) => {
+		event.preventDefault();
+		if (identityId) {
+			onAdd({
+				id: identityId,
+				type
+			});
+			setIdentityId("");
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+		className: styles["row"],
+		onSubmit: handleSubmit,
+		style: { alignItems: "flex-end" },
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Select.default, {
+				label: t("admin.common.fields.identity_type"),
+				name: "identityType",
+				value: type,
+				options: types,
+				onChange: (event) => {
+					setType(event.target.value);
+					setIdentityId("");
+				}
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Select.default, {
+				label: t("admin.common.fields.identity"),
+				name: "identity",
+				value: identityId,
+				placeholder: t("admin.common.fields.identity_placeholder"),
+				emptyText: t("admin.common.fields.identity_empty"),
+				options,
+				onChange: (event) => setIdentityId(event.target.value)
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
+				type: "submit",
+				loading: isSubmitting,
+				disabled: !identityId || isSubmitting,
+				children: addLabel
+			})
+		]
+	});
+};
+var IdentityPicker_default = IdentityPicker;
+
+//#endregion
+exports.default = IdentityPicker_default;
+//# sourceMappingURL=IdentityPicker.cjs.map

package/dist/cjs/components/admin/shared/IdentityPicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"IdentityPicker.cjs","names":["styles: Record<string, string>","useAdminPartStyles","useTranslation","options: SelectOption[]","Select","Button"],"sources":["../../../../../src/components/admin/shared/IdentityPicker.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {SelectOption} from '@thunderid/browser';\nimport {ChangeEvent, FormEvent, ReactElement, useState} from 'react';\nimport useAdminPartStyles from './useAdminPartStyles';\nimport useTranslation from '../../../hooks/useTranslation';\nimport Button from '../../primitives/Button/Button';\nimport Select from '../../primitives/Select/Select';\n\n/**\n * An identity that can be picked, such as a user, agent or group.\n */\nexport interface IdentityCandidate {\n  id: string;\n  label: string;\n}\n\nexport interface IdentityPickerProps<TType extends string> {\n  /**\n   * Label of the add button, already translated.\n   */\n  addLabel: string;\n  /**\n   * The identities to choose from, keyed by identity type.\n   */\n  candidates: Partial<Record<TType, IdentityCandidate[]>>;\n  /**\n   * Identifiers to leave out, such as current members.\n   */\n  excludedIds?: string[];\n  isSubmitting?: boolean;\n  onAdd: (identity: {id: string; type: TType}) => void;\n  /**\n   * The identity types to choose from, with translated labels.\n   */\n  types: {label: string; value: TType}[];\n}\n\n/**\n * Picks one identity of a chosen type and adds it, for example as a group member or a role assignee.\n */\nconst IdentityPicker = <TType extends string>({\n  addLabel,\n  candidates,\n  excludedIds = [],\n  isSubmitting = false,\n  onAdd,\n  types,\n}: IdentityPickerProps<TType>): ReactElement => {\n  const styles: Record<string, string> = useAdminPartStyles();\n  const {t} = useTranslation();\n  const [type, setType] = useState<TType>(types[0]?.value);\n  const [identityId, setIdentityId] = useState<string>('');\n\n  const options: SelectOption[] = (candidates[type] ?? [])\n    .filter((candidate: IdentityCandidate) => !excludedIds.includes(candidate.id))\n    .map((candidate: IdentityCandidate) => ({label: candidate.label, value: candidate.id}));\n\n  const handleSubmit = (event: FormEvent<HTMLFormElement>): void => {\n    event.preventDefault();\n\n    if (identityId) {\n      onAdd({id: identityId, type});\n      setIdentityId('');\n    }\n  };\n\n  return (\n    <form className={styles['row']} onSubmit={handleSubmit} style={{alignItems: 'flex-end'}}>\n      <Select\n        label={t('admin.common.fields.identity_type')}\n        name=\"identityType\"\n        value={type}\n        options={types}\n        onChange={(event: ChangeEvent<HTMLSelectElement>): void => {\n          setType(event.target.value as TType);\n          setIdentityId('');\n        }}\n      />\n      <Select\n        label={t('admin.common.fields.identity')}\n        name=\"identity\"\n        value={identityId}\n        placeholder={t('admin.common.fields.identity_placeholder')}\n        emptyText={t('admin.common.fields.identity_empty')}\n        options={options}\n        onChange={(event: ChangeEvent<HTMLSelectElement>): void => setIdentityId(event.target.value)}\n      />\n      <Button type=\"submit\" loading={isSubmitting} disabled={!identityId || isSubmitting}>\n        {addLabel}\n      </Button>\n    </form>\n  );\n};\n\nexport default IdentityPicker;\n"],"mappings":";;;;;;;;;;;;;;AA0CA,MAAM,kBAAwC,EAC5C,UACA,YACA,cAAc,EAAE,EAChB,eAAe,OACf,OACA,YAC8C;CAC9C,MAAMA,SAAiCC,oCAAoB;CAC3D,MAAM,EAAC,MAAKC,gCAAgB;CAC5B,MAAM,CAAC,MAAM,+BAA2B,MAAM,IAAI,MAAM;CACxD,MAAM,CAAC,YAAY,qCAAkC,GAAG;CAExD,MAAMC,WAA2B,WAAW,SAAS,EAAE,EACpD,QAAQ,cAAiC,CAAC,YAAY,SAAS,UAAU,GAAG,CAAC,CAC7E,KAAK,eAAkC;EAAC,OAAO,UAAU;EAAO,OAAO,UAAU;EAAG,EAAE;CAEzF,MAAM,gBAAgB,UAA4C;AAChE,QAAM,gBAAgB;AAEtB,MAAI,YAAY;AACd,SAAM;IAAC,IAAI;IAAY;IAAK,CAAC;AAC7B,iBAAc,GAAG;;;AAIrB,QACE,4CAAC;EAAK,WAAW,OAAO;EAAQ,UAAU;EAAc,OAAO,EAAC,YAAY,YAAW;;GACrF,2CAACC;IACC,OAAO,EAAE,oCAAoC;IAC7C,MAAK;IACL,OAAO;IACP,SAAS;IACT,WAAW,UAAgD;AACzD,aAAQ,MAAM,OAAO,MAAe;AACpC,mBAAc,GAAG;;KAEnB;GACF,2CAACA;IACC,OAAO,EAAE,+BAA+B;IACxC,MAAK;IACL,OAAO;IACP,aAAa,EAAE,2CAA2C;IAC1D,WAAW,EAAE,qCAAqC;IACzC;IACT,WAAW,UAAgD,cAAc,MAAM,OAAO,MAAM;KAC5F;GACF,2CAACC;IAAO,MAAK;IAAS,SAAS;IAAc,UAAU,CAAC,cAAc;cACnE;KACM;;GACJ;;AAIX,6BAAe"}

package/dist/cjs/components/admin/shared/useAdminPartStyles.cjs

@@ -0,0 +1,18 @@
+const require_useTheme = require('../../../contexts/Theme/useTheme.cjs');
+const require_AdminParts_styles = require('./AdminParts.styles.cjs');
+
+//#region src/components/admin/shared/useAdminPartStyles.ts
+/**
+* Returns the shared admin part styles for the active theme.
+*
+* @returns The CSS class names of the admin parts.
+*/
+const useAdminPartStyles = () => {
+	const { theme, colorScheme } = require_useTheme.default();
+	return require_AdminParts_styles.default(theme, colorScheme);
+};
+var useAdminPartStyles_default = useAdminPartStyles;
+
+//#endregion
+exports.default = useAdminPartStyles_default;
+//# sourceMappingURL=useAdminPartStyles.cjs.map

package/dist/cjs/components/admin/shared/useAdminPartStyles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAdminPartStyles.cjs","names":["useTheme","useStyles"],"sources":["../../../../../src/components/admin/shared/useAdminPartStyles.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport useStyles from './AdminParts.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\n\n/**\n * Returns the shared admin part styles for the active theme.\n *\n * @returns The CSS class names of the admin parts.\n */\nconst useAdminPartStyles = (): Record<string, string> => {\n  const {theme, colorScheme} = useTheme();\n\n  return useStyles(theme, colorScheme);\n};\n\nexport default useAdminPartStyles;\n"],"mappings":";;;;;;;;;AAWA,MAAM,2BAAmD;CACvD,MAAM,EAAC,OAAO,gBAAeA,0BAAU;AAEvC,QAAOC,kCAAU,OAAO,YAAY;;AAGtC,iCAAe"}

package/dist/cjs/components/admin/shared/useDefaultOuId.cjs

@@ -0,0 +1,20 @@
+const require_useUser = require('../../../contexts/User/useUser.cjs');
+
+//#region src/components/admin/shared/useDefaultOuId.ts
+/**
+* Resolves the organization unit a new resource is created in: the one passed in, otherwise the
+* signed-in user's own organization unit.
+*
+* @param ouId - The organization unit chosen by the caller.
+* @returns The organization unit identifier, or `undefined` when neither is known.
+*/
+const useDefaultOuId = (ouId) => {
+	const { profile, flattenedProfile } = require_useUser.default();
+	const fromProfile = (flattenedProfile ?? profile ?? {})["ouId"];
+	return ouId ?? (typeof fromProfile === "string" ? fromProfile : void 0);
+};
+var useDefaultOuId_default = useDefaultOuId;
+
+//#endregion
+exports.default = useDefaultOuId_default;
+//# sourceMappingURL=useDefaultOuId.cjs.map

package/dist/cjs/components/admin/shared/useDefaultOuId.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDefaultOuId.cjs","names":["useUser","fromProfile: unknown"],"sources":["../../../../../src/components/admin/shared/useDefaultOuId.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport useUser from '../../../contexts/User/useUser';\n\n/**\n * Resolves the organization unit a new resource is created in: the one passed in, otherwise the\n * signed-in user's own organization unit.\n *\n * @param ouId - The organization unit chosen by the caller.\n * @returns The organization unit identifier, or `undefined` when neither is known.\n */\nconst useDefaultOuId = (ouId?: string): string | undefined => {\n  const {profile, flattenedProfile} = useUser();\n  const source: Record<string, unknown> = (flattenedProfile ?? profile ?? {}) as Record<string, unknown>;\n  const fromProfile: unknown = source['ouId'];\n\n  return ouId ?? (typeof fromProfile === 'string' ? fromProfile : undefined);\n};\n\nexport default useDefaultOuId;\n"],"mappings":";;;;;;;;;;AAYA,MAAM,kBAAkB,SAAsC;CAC5D,MAAM,EAAC,SAAS,qBAAoBA,yBAAS;CAE7C,MAAMC,eADmC,oBAAoB,WAAW,EAAE,EACtC;AAEpC,QAAO,SAAS,OAAO,gBAAgB,WAAW,cAAc;;AAGlE,6BAAe"}

package/dist/cjs/components/auth/AcceptInvite/AcceptInvite.cjs

@@ -0,0 +1,108 @@
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_BaseAcceptInvite = require('./BaseAcceptInvite.cjs');
+let __thunderid_browser = require("@thunderid/browser");
+__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/components/auth/AcceptInvite/AcceptInvite.tsx
+/**
+* Helper to extract query parameters from URL.
+*/
+const getUrlParams = () => {
+	if (typeof window === "undefined") return {};
+	const params = new URLSearchParams(window.location.search);
+	return {
+		executionId: params.get("executionId") || void 0,
+		inviteToken: params.get("inviteToken") || void 0
+	};
+};
+/**
+* AcceptInvite component for end-users to accept an invite and set their password.
+*
+* This component is designed for end users accessing the thunder-gate app via an invite link.
+* It automatically:
+* 1. Extracts executionId and inviteToken from URL query parameters
+* 2. Validates the invite token with the backend
+* 3. Displays the password form if token is valid
+* 4. Completes the accept invite when password is set
+*
+* @example
+* ```tsx
+* import { AcceptInvite } from '@thunderid/react';
+*
+* // URL: /invite?executionId=xxx&inviteToken=yyy
+*
+* const AcceptInvitePage = () => {
+*   return (
+*     <AcceptInvite
+*       baseUrl="https://api.thunder.io"
+*       onComplete={() => navigate('/signin')}
+*       onError={(error) => console.error(error)}
+*     >
+*       {({ values, components, isLoading, isComplete, isValidatingToken, isTokenInvalid, error, handleInputChange, handleSubmit }) => (
+*         <div>
+*           {isValidatingToken && <p>Validating your invite...</p>}
+*           {isTokenInvalid && <p>Invalid or expired invite link</p>}
+*           {isComplete && <p>Registration complete! You can now sign in.</p>}
+*           {!isComplete && !isValidatingToken && !isTokenInvalid && (
+*             // Render password form based on components
+*           )}
+*         </div>
+*       )}
+*     </AcceptInvite>
+*   );
+* };
+* ```
+*/
+const AcceptInvite = ({ baseUrl, executionId: executionIdProp, inviteToken: inviteTokenProp, onComplete, onError, onFlowChange, onGoToSignIn, className, children, size = "medium", variant = "outlined", showTitle = true, showSubtitle = true }) => {
+	const { executionId: urlExecutionId, inviteToken: urlInviteToken } = (0, react.useMemo)(() => getUrlParams(), []);
+	const executionId = executionIdProp || urlExecutionId;
+	const inviteToken = inviteTokenProp || urlInviteToken;
+	const apiBaseUrl = (0, react.useMemo)(() => {
+		if (baseUrl) return baseUrl;
+		if (typeof window !== "undefined") return window.location.origin;
+		return "";
+	}, [baseUrl]);
+	/**
+	* Submit flow step data.
+	* Makes an unauthenticated request to /flow/execute endpoint.
+	*/
+	const handleSubmit = async (payload) => {
+		const response = await fetch(`${apiBaseUrl}/flow/execute`, {
+			body: JSON.stringify({
+				...payload,
+				verbose: true
+			}),
+			headers: {
+				Accept: "application/json",
+				"Content-Type": "application/json"
+			},
+			method: "POST"
+		});
+		if (!response.ok) throw new __thunderid_browser.ThunderIDAPIError(await response.text(), "AcceptInvite-ResponseError-001", "react", response.status, response.statusText);
+		return response.json();
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseAcceptInvite.default, {
+		executionId,
+		inviteToken,
+		onSubmit: handleSubmit,
+		onComplete,
+		onError,
+		onFlowChange,
+		onGoToSignIn,
+		className,
+		size,
+		variant,
+		showTitle,
+		showSubtitle,
+		children
+	});
+};
+var AcceptInvite_default = AcceptInvite;
+
+//#endregion
+exports.default = AcceptInvite_default;
+//# sourceMappingURL=AcceptInvite.cjs.map

package/dist/cjs/components/auth/AcceptInvite/AcceptInvite.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AcceptInvite.cjs","names":["params: any","AcceptInvite: FC<AcceptInviteProps>","executionId: any","inviteToken: any","apiBaseUrl: any","response: Response","ThunderIDAPIError","BaseAcceptInvite"],"sources":["../../../../../src/components/auth/AcceptInvite/AcceptInvite.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {ThunderIDAPIError} from '@thunderid/browser';\nimport {FC, ReactElement, ReactNode, useMemo} from 'react';\nimport BaseAcceptInvite, {BaseAcceptInviteRenderProps, AcceptInviteFlowResponse} from './BaseAcceptInvite';\n\n/**\n * Render props for AcceptInvite (re-exported for convenience).\n */\nexport type AcceptInviteRenderProps = BaseAcceptInviteRenderProps;\n\n/**\n * Props for the AcceptInvite component.\n */\nexport interface AcceptInviteProps {\n  /**\n   * Base URL for the Thunder API server.\n   * If not provided, will try to read from window location.\n   */\n  baseUrl?: string;\n\n  /**\n   * Render props function for custom UI.\n   * If not provided, default UI will be rendered by the SDK.\n   */\n  children?: (props: AcceptInviteRenderProps) => ReactNode;\n\n  /**\n   * Custom CSS class name.\n   */\n  className?: string;\n\n  /**\n   * Flow ID from the invite link.\n   * If not provided, will be extracted from URL query parameters.\n   */\n  executionId?: string;\n\n  /**\n   * Invite token from the invite link.\n   * If not provided, will be extracted from URL query parameters.\n   */\n  inviteToken?: string;\n\n  /**\n   * Callback when the flow completes successfully.\n   */\n  onComplete?: () => void;\n\n  /**\n   * Callback when an error occurs.\n   */\n  onError?: (error: Error) => void;\n\n  /**\n   * Callback when the flow state changes.\n   */\n  onFlowChange?: (response: AcceptInviteFlowResponse) => void;\n\n  /**\n   * Callback to navigate to sign in page.\n   */\n  onGoToSignIn?: () => void;\n\n  /**\n   * Whether to show the subtitle.\n   */\n  showSubtitle?: boolean;\n\n  /**\n   * Whether to show the title.\n   */\n  showTitle?: boolean;\n\n  /**\n   * Size variant for the component.\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Theme variant for the component card.\n   */\n  variant?: 'outlined' | 'elevated';\n}\n\n/**\n * Helper to extract query parameters from URL.\n */\nconst getUrlParams = (): {executionId?: string; inviteToken?: string} => {\n  if (typeof window === 'undefined') {\n    return {};\n  }\n\n  const params: any = new URLSearchParams(window.location.search);\n  return {\n    executionId: params.get('executionId') || undefined,\n    inviteToken: params.get('inviteToken') || undefined,\n  };\n};\n\n/**\n * AcceptInvite component for end-users to accept an invite and set their password.\n *\n * This component is designed for end users accessing the thunder-gate app via an invite link.\n * It automatically:\n * 1. Extracts executionId and inviteToken from URL query parameters\n * 2. Validates the invite token with the backend\n * 3. Displays the password form if token is valid\n * 4. Completes the accept invite when password is set\n *\n * @example\n * ```tsx\n * import { AcceptInvite } from '@thunderid/react';\n *\n * // URL: /invite?executionId=xxx&inviteToken=yyy\n *\n * const AcceptInvitePage = () => {\n *   return (\n *     <AcceptInvite\n *       baseUrl=\"https://api.thunder.io\"\n *       onComplete={() => navigate('/signin')}\n *       onError={(error) => console.error(error)}\n *     >\n *       {({ values, components, isLoading, isComplete, isValidatingToken, isTokenInvalid, error, handleInputChange, handleSubmit }) => (\n *         <div>\n *           {isValidatingToken && <p>Validating your invite...</p>}\n *           {isTokenInvalid && <p>Invalid or expired invite link</p>}\n *           {isComplete && <p>Registration complete! You can now sign in.</p>}\n *           {!isComplete && !isValidatingToken && !isTokenInvalid && (\n *             // Render password form based on components\n *           )}\n *         </div>\n *       )}\n *     </AcceptInvite>\n *   );\n * };\n * ```\n */\nconst AcceptInvite: FC<AcceptInviteProps> = ({\n  baseUrl,\n  executionId: executionIdProp,\n  inviteToken: inviteTokenProp,\n  onComplete,\n  onError,\n  onFlowChange,\n  onGoToSignIn,\n  className,\n  children,\n  size = 'medium',\n  variant = 'outlined',\n  showTitle = true,\n  showSubtitle = true,\n}: AcceptInviteProps): ReactElement => {\n  // Extract from URL if not provided as props\n  const {executionId: urlExecutionId, inviteToken: urlInviteToken} = useMemo(() => getUrlParams(), []);\n\n  const executionId: any = executionIdProp || urlExecutionId;\n  const inviteToken: any = inviteTokenProp || urlInviteToken;\n\n  // Determine base URL\n  const apiBaseUrl: any = useMemo(() => {\n    if (baseUrl) {\n      return baseUrl;\n    }\n    // Try to construct from current location (assuming same origin)\n    if (typeof window !== 'undefined') {\n      return window.location.origin;\n    }\n    return '';\n  }, [baseUrl]);\n\n  /**\n   * Submit flow step data.\n   * Makes an unauthenticated request to /flow/execute endpoint.\n   */\n  const handleSubmit = async (payload: Record<string, any>): Promise<AcceptInviteFlowResponse> => {\n    const response: Response = await fetch(`${apiBaseUrl}/flow/execute`, {\n      body: JSON.stringify({\n        ...payload,\n        verbose: true,\n      }),\n      headers: {\n        Accept: 'application/json',\n        'Content-Type': 'application/json',\n      },\n      method: 'POST',\n    });\n\n    if (!response.ok) {\n      const errorText: string = await response.text();\n      // ThunderIDAPIError resolves the raw API body into a readable message instead of leaking it.\n      throw new ThunderIDAPIError(\n        errorText,\n        'AcceptInvite-ResponseError-001',\n        'react',\n        response.status,\n        response.statusText,\n      );\n    }\n\n    return response.json();\n  };\n\n  return (\n    <BaseAcceptInvite\n      executionId={executionId}\n      inviteToken={inviteToken}\n      onSubmit={handleSubmit}\n      onComplete={onComplete}\n      onError={onError}\n      onFlowChange={onFlowChange}\n      onGoToSignIn={onGoToSignIn}\n      className={className}\n      size={size}\n      variant={variant}\n      showTitle={showTitle}\n      showSubtitle={showSubtitle}\n    >\n      {children}\n    </BaseAcceptInvite>\n  );\n};\n\nexport default AcceptInvite;\n"],"mappings":";;;;;;;;;;;;;AAyFA,MAAM,qBAAmE;AACvE,KAAI,OAAO,WAAW,YACpB,QAAO,EAAE;CAGX,MAAMA,SAAc,IAAI,gBAAgB,OAAO,SAAS,OAAO;AAC/D,QAAO;EACL,aAAa,OAAO,IAAI,cAAc,IAAI;EAC1C,aAAa,OAAO,IAAI,cAAc,IAAI;EAC3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCH,MAAMC,gBAAuC,EAC3C,SACA,aAAa,iBACb,aAAa,iBACb,YACA,SACA,cACA,cACA,WACA,UACA,OAAO,UACP,UAAU,YACV,YAAY,MACZ,eAAe,WACsB;CAErC,MAAM,EAAC,aAAa,gBAAgB,aAAa,4CAAgC,cAAc,EAAE,EAAE,CAAC;CAEpG,MAAMC,cAAmB,mBAAmB;CAC5C,MAAMC,cAAmB,mBAAmB;CAG5C,MAAMC,sCAAgC;AACpC,MAAI,QACF,QAAO;AAGT,MAAI,OAAO,WAAW,YACpB,QAAO,OAAO,SAAS;AAEzB,SAAO;IACN,CAAC,QAAQ,CAAC;;;;;CAMb,MAAM,eAAe,OAAO,YAAoE;EAC9F,MAAMC,WAAqB,MAAM,MAAM,GAAG,WAAW,gBAAgB;GACnE,MAAM,KAAK,UAAU;IACnB,GAAG;IACH,SAAS;IACV,CAAC;GACF,SAAS;IACP,QAAQ;IACR,gBAAgB;IACjB;GACD,QAAQ;GACT,CAAC;AAEF,MAAI,CAAC,SAAS,GAGZ,OAAM,IAAIC,sCAFgB,MAAM,SAAS,MAAM,EAI7C,kCACA,SACA,SAAS,QACT,SAAS,WACV;AAGH,SAAO,SAAS,MAAM;;AAGxB,QACE,2CAACC;EACc;EACA;EACb,UAAU;EACE;EACH;EACK;EACA;EACH;EACL;EACG;EACE;EACG;EAEb;GACgB;;AAIvB,2BAAe"}