@kortix/ui 0.0.0-stage → 0.14.4

package/dist/customize/sections/connector-connection-modal.js

@@ -0,0 +1,70 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useTranslations as useI18nTranslations } from '../../i18n/index.js';
+import { useEffect, useState } from 'react';
+import { Button } from '../../primitives/button.js';
+import { Disclosure, DisclosureContent, DisclosureTrigger } from '../../primitives/disclosure.js';
+import { Field, FieldDescription, FieldGroup, FieldLabel } from '../../primitives/field.js';
+import { Input } from '../../primitives/input.js';
+import Loading from '../../primitives/loading.js';
+import { Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, ModalTitle, } from '../../primitives/modal.js';
+import { cn } from '../../internal/lib/utils.js';
+import { CaretDownIcon, PlusIcon } from '@phosphor-icons/react';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+import { connectorConnectionSlugAfterNameChange, isConnectorConnectionSlugAvailable, normalizeConnectorConnectionSlug, proposeConnectorConnectionName, } from './connector-connection-form.js';
+import { ConnectorConnectionHeader } from './connector-connection-header.js';
+/**
+ * The "Add connector" dialog: connection header + one primary button.
+ *
+ * Defaults (app name, proposed slug) are always valid, so a non-technical user
+ * reads the header and presses "+ Add connector" without meeting "slug". That
+ * field stays behind a collapsed disclosure for the rare rename case. The
+ * disclosure force-opens when the slug inside it becomes invalid, so a submit
+ * that would silently refuse never hides its reason.
+ *
+ * There is no owner choice here any more. A connector is a capability with no
+ * identity; WHO it runs as is a property of each account on its Accounts tab,
+ * where both a shared and a private account can exist at the same time.
+ */
+export function ConnectorConnectionModal({ open, idPrefix, title, initialName, initialSlug, existingSlugs, pending, icon, byline, summary, submitLabel, onOpenChange, onSubmit, }) {
+    const tI18nComplete = useI18nTranslations('hardcodedUi.i18nComplete');
+    // The proposed name counts the project's existing connections to this app,
+    // so the second Sentry is "Sentry 2" — see `proposeConnectorConnectionName`.
+    const proposedName = proposeConnectorConnectionName(initialName, existingSlugs);
+    const [name, setName] = useState(proposedName);
+    const [slug, setSlug] = useState(initialSlug);
+    const [slugEdited, setSlugEdited] = useState(false);
+    const [optionsOpen, setOptionsOpen] = useState(false);
+    useEffect(() => {
+        if (!open)
+            return;
+        setName(proposedName);
+        setSlug(initialSlug);
+        setSlugEdited(false);
+        setOptionsOpen(false);
+    }, [proposedName, initialSlug, open]);
+    const slugAvailable = isConnectorConnectionSlugAvailable(slug, existingSlugs);
+    const slugInvalid = slug.length > 0 && !slugAvailable;
+    const slugDescriptionId = `${idPrefix}-slug-description`;
+    const displayName = name.trim() || initialName;
+    return (_jsx(Modal, { open: open, onOpenChange: (next) => !pending && onOpenChange(next), children: _jsxs(ModalContent, { className: "lg:max-w-lg", "aria-describedby": undefined, children: [_jsx(VisuallyHidden, { asChild: true, children: _jsx(ModalTitle, { children: title }) }), _jsx(ModalHeader, { children: _jsx(ConnectorConnectionHeader, { icon: icon, name: displayName, byline: byline, description: summary }) }), _jsxs("form", { onSubmit: (event) => {
+                        event.preventDefault();
+                        if (!name.trim() || !slugAvailable || pending)
+                            return;
+                        onSubmit({ name, slug });
+                    }, children: [_jsxs(ModalBody, { className: "max-h-[60vh] space-y-4 overflow-y-auto", children: [_jsxs("p", { className: "text-muted-foreground text-sm text-pretty", children: [tI18nComplete.raw('text17e9f72b9ba8'), " ", displayName, ' ', tI18nComplete.raw('texte99baf469ca8')] }), _jsxs(Disclosure, { variant: "outline", className: "overflow-hidden", open: optionsOpen || slugInvalid, onOpenChange: setOptionsOpen, children: [_jsx(DisclosureTrigger, { variant: "outline", children: _jsxs(Button, { type: "button", variant: "popover", className: "flex w-full items-center justify-between rounded-none", children: [_jsx("span", { className: "text-muted-foreground truncate text-sm font-medium", children: tI18nComplete.raw('text9443ff69463e') }), _jsx(CaretDownIcon, { className: "text-muted-foreground size-4 shrink-0 transition-transform group-data-[state=open]:rotate-180" })] }) }), _jsx(DisclosureContent, { variant: "outline", contentClassName: "border-border border-t", children: _jsx("div", { className: "px-4 py-5", children: _jsxs(FieldGroup, { className: "gap-4", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: `${idPrefix}-name`, children: tI18nComplete.raw('text2b7f6a84de91') }), _jsx(Input, { id: `${idPrefix}-name`, value: name, onChange: (event) => {
+                                                                        const nextName = event.target.value;
+                                                                        setName(nextName);
+                                                                        setSlug((currentSlug) => connectorConnectionSlugAfterNameChange({
+                                                                            displayName: nextName,
+                                                                            currentSlug,
+                                                                            existingSlugs,
+                                                                            slugEdited,
+                                                                        }));
+                                                                    }, placeholder: initialName, variant: "popover", maxLength: 255, disabled: pending, required: true })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: `${idPrefix}-slug`, children: tI18nComplete.raw('textd15387ecc6c5') }), _jsx(Input, { id: `${idPrefix}-slug`, value: slug, onChange: (event) => {
+                                                                        setSlugEdited(true);
+                                                                        setSlug(normalizeConnectorConnectionSlug(event.target.value));
+                                                                    }, placeholder: initialSlug, variant: "popover", className: "font-mono text-xs", maxLength: 128, "aria-invalid": slug.length > 0 && !slugAvailable, "aria-describedby": slugDescriptionId, disabled: pending, required: true }), _jsx(FieldDescription, { id: slugDescriptionId, role: slug.length > 0 && !slugAvailable ? 'alert' : undefined, className: cn(slug.length > 0 && !slugAvailable && 'text-destructive'), children: slug.length > 0 && !slugAvailable
+                                                                        ? tI18nComplete.raw('text1b07037029d3')
+                                                                        : tI18nComplete.raw('text48026cbaf423') })] })] }) }) })] })] }), _jsxs(ModalFooter, { className: "sm:justify-between", children: [_jsx(Button, { type: "button", variant: "outline-ghost", onClick: () => onOpenChange(false), disabled: pending, children: tI18nComplete.raw('text19766ed6ccb2') }), _jsxs(Button, { type: "submit", className: "gap-1.5 active:scale-[0.96]", disabled: pending || !name.trim() || !slugAvailable, children: [pending ? (_jsx(Loading, { className: "size-4 shrink-0" })) : (_jsx(PlusIcon, { className: "size-4 shrink-0", weight: "bold" })), submitLabel ?? tI18nComplete.raw('texta6ef2483d6fb')] })] })] })] }) }));
+}

package/dist/customize/sections/connector-credential-target.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Where `SetCredentialModal` writes a credential, and how it keys the OAuth2
+ * discovery it runs. The modal is mounted once and retargeted per account
+ * (`connectionId` + `owner`), so both answers must follow the selected account.
+ */
+type CredentialWriteTarget = 
+/** `PUT /projects/:id/connections/:connectionId/credential`. */
+{
+    kind: 'connection';
+    connectionId: string;
+}
+/** A personal account not created yet: reconcile it, then write through it. */
+ | {
+    kind: 'resolve-connection';
+}
+/** `PUT /connectors/projects/:id/connectors/:slug/credential` — the connector's default shared slot. */
+ | {
+    kind: 'connector-default';
+};
+export declare function credentialWriteTarget(owner: 'project' | 'me', connectionId: string | null): CredentialWriteTarget;
+/**
+ * The per-connection part of the discovery query key. The cached result
+ * carries the connection id one-click OAuth then starts on, so it must never
+ * be served for a different account. An account not created yet is keyed by
+ * its owner: the shared default and a new personal account resolve to
+ * different connections.
+ */
+export declare function oauth2DiscoveryConnectionKey(owner: 'project' | 'me', connectionId: string | null): string;
+export {};

package/dist/customize/sections/connector-credential-target.js

@@ -0,0 +1,23 @@
+/**
+ * Where `SetCredentialModal` writes a credential, and how it keys the OAuth2
+ * discovery it runs. The modal is mounted once and retargeted per account
+ * (`connectionId` + `owner`), so both answers must follow the selected account.
+ */
+export function credentialWriteTarget(owner, connectionId) {
+    // A selected account — shared or personal — is written through its own
+    // connection. The per-connector route writes the default shared slot, which
+    // is a different account whenever a connector has more than one.
+    if (connectionId)
+        return { kind: 'connection', connectionId };
+    return owner === 'me' ? { kind: 'resolve-connection' } : { kind: 'connector-default' };
+}
+/**
+ * The per-connection part of the discovery query key. The cached result
+ * carries the connection id one-click OAuth then starts on, so it must never
+ * be served for a different account. An account not created yet is keyed by
+ * its owner: the shared default and a new personal account resolve to
+ * different connections.
+ */
+export function oauth2DiscoveryConnectionKey(owner, connectionId) {
+    return connectionId ?? `new:${owner}`;
+}

package/dist/customize/sections/connector-oauth2-application-fields.d.ts

@@ -0,0 +1,6 @@
+import type { OAuth2ApplicationForm } from './connector-oauth2.js';
+export declare function OAuth2ApplicationFields({ value, onChange, idPrefix, }: {
+    value: OAuth2ApplicationForm;
+    onChange: (value: OAuth2ApplicationForm) => void;
+    idPrefix: string;
+}): import("react").JSX.Element;

package/dist/customize/sections/connector-oauth2-application-fields.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Field, FieldDescription, FieldGroup, FieldLabel } from '../../primitives/field.js';
+import { Input } from '../../primitives/input.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../primitives/select.js';
+import { Textarea } from '../../primitives/textarea.js';
+import { useTranslations } from '../../i18n/index.js';
+import { OAuth2ScopeFields } from './connector-oauth2-scope-fields.js';
+export function OAuth2ApplicationFields({ value, onChange, idPrefix, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const set = (key, next) => onChange({ ...value, [key]: next });
+    const id = (name) => `${idPrefix}-${name}`;
+    return (_jsxs(FieldGroup, { className: "grid gap-3 sm:grid-cols-2", children: [_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('discovery-url'), children: tI18nComplete.raw('texte62bef86ebd4') }), _jsx(Input, { id: id('discovery-url'), type: "url", value: value.discoveryUrl, onChange: (event) => set('discoveryUrl', event.target.value), placeholder: "https://identity.example.com/.well-known/openid-configuration", variant: "popover" }), _jsx(FieldDescription, { children: tI18nComplete.raw('text2fe1b45a5654') })] }), value.grant === 'authorization_code' && (_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('authorization-url'), children: tI18nComplete.raw('textc70b5f2b670e') }), _jsx(Input, { id: id('authorization-url'), type: "url", value: value.authorizationUrl, onChange: (event) => set('authorizationUrl', event.target.value), placeholder: "https://identity.example.com/oauth2/authorize", variant: "popover" })] })), _jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('token-url'), children: tI18nComplete.raw('text431e0036cba3') }), _jsx(Input, { id: id('token-url'), type: "url", value: value.tokenUrl, onChange: (event) => set('tokenUrl', event.target.value), placeholder: "https://identity.example.com/oauth2/token", variant: "popover" })] }), value.grant === 'device_authorization' && (_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('device-url'), children: tI18nComplete.raw('text1ffa9ae5b248') }), _jsx(Input, { id: id('device-url'), type: "url", value: value.deviceAuthorizationUrl, onChange: (event) => set('deviceAuthorizationUrl', event.target.value), placeholder: "https://identity.example.com/oauth2/device", variant: "popover" })] })), _jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('revocation-url'), children: tI18nComplete.raw('texta6cc6ed3f841') }), _jsx(Input, { id: id('revocation-url'), type: "url", value: value.revocationUrl, onChange: (event) => set('revocationUrl', event.target.value), placeholder: "https://identity.example.com/oauth2/revoke", variant: "popover" }), _jsx(FieldDescription, { children: tI18nComplete.raw('text1458e20a1642') })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('client-id'), children: tI18nComplete.raw('text8726db013948') }), _jsx(Input, { id: id('client-id'), value: value.clientId, onChange: (event) => set('clientId', event.target.value), variant: "popover", required: true })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('auth-method'), children: tI18nComplete.raw('textb5037fbea489') }), _jsxs(Select, { value: value.authMethod, onValueChange: (next) => set('authMethod', next), children: [_jsx(SelectTrigger, { id: id('auth-method'), children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "none", children: tI18nComplete.raw('text3a9be266e664') }), _jsx(SelectItem, { value: "client_secret_basic", children: tI18nComplete.raw('textedb912f176d8') }), _jsx(SelectItem, { value: "client_secret_post", children: tI18nComplete.raw('textfd4daecd5ecf') }), _jsx(SelectItem, { value: "client_secret_jwt", children: tI18nComplete.raw('text7d06167236bd') }), _jsx(SelectItem, { value: "private_key_jwt", children: tI18nComplete.raw('text6ac8fd822515') })] })] })] }), value.authMethod === 'private_key_jwt' ? (_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('private-key'), children: tI18nComplete.raw('text7251cfc3ceab') }), _jsx(Textarea, { id: id('private-key'), value: value.privateKey, onChange: (event) => set('privateKey', event.target.value), className: "min-h-32 font-mono text-xs", required: true })] })) : value.authMethod === 'none' ? null : (_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('client-secret'), children: tI18nComplete.raw('text4aded5faf156') }), _jsx(Input, { id: id('client-secret'), type: "password", value: value.clientSecret, onChange: (event) => set('clientSecret', event.target.value), variant: "popover", required: true })] })), _jsx(OAuth2ScopeFields, { value: value, onChange: set, idPrefix: idPrefix, scopePlaceholder: tI18nComplete.raw('text0b9de98b65ef') })] }));
+}

package/dist/customize/sections/connector-oauth2-auto.d.ts

@@ -0,0 +1,45 @@
+/**
+ * One-click OAuth for a connector whose server publishes its own authorization
+ * metadata (the MCP authorization chain, RFC 9728 + RFC 8414 + RFC 7591).
+ *
+ * The user's job shrinks to pressing one button: Kortix discovers the
+ * authorization server, registers itself as a client, and starts the
+ * Authorization Code + PKCE flow. These helpers are the pure decisions behind
+ * that button, kept out of the component so they are testable on their own.
+ */
+import type { OAuth2ClientRegistrationInput, OAuth2ResourceDiscovery } from '@kortix/sdk';
+import type { OAuth2ApplicationForm } from './connector-oauth2.js';
+type AutoConnectPlan = 
+/** Discovery has not run yet. */
+{
+    kind: 'unknown';
+}
+/** The server answered without credentials — it needs no OAuth connection. */
+ | {
+    kind: 'no_authorization';
+}
+/** Everything is discoverable: register dynamically (or take Kortix's own
+ *  client, `kortix_client`), then authorize. */
+ | {
+    kind: 'register';
+    label: string;
+    /** Absent when Kortix signs in with its own OAuth client. */
+    registrationEndpoint?: string;
+    scopes: string[];
+}
+/** Endpoints are known but the server has no dynamic registration. */
+ | {
+    kind: 'client_id_required';
+    label: string;
+    scopes: string[];
+}
+/** Nothing usable was discovered — the fields must be filled in by hand. */
+ | {
+    kind: 'manual';
+    reason: string;
+};
+export declare function autoConnectPlan(discovery: OAuth2ResourceDiscovery | null | undefined): AutoConnectPlan;
+export declare function buildClientRegistrationInput(discovery: OAuth2ResourceDiscovery): OAuth2ClientRegistrationInput;
+/** Prefill the manual form from discovery. Anything the user typed wins. */
+export declare function mergeResourceDiscoveryIntoForm(form: OAuth2ApplicationForm, discovery: OAuth2ResourceDiscovery): OAuth2ApplicationForm;
+export {};

package/dist/customize/sections/connector-oauth2-auto.js

@@ -0,0 +1,78 @@
+function resourceLabel(discovery) {
+    if (discovery.resource_name)
+        return `Connect ${discovery.resource_name}`;
+    try {
+        return `Connect ${new URL(discovery.resource ?? discovery.resource_url).host}`;
+    }
+    catch {
+        return 'Connect';
+    }
+}
+export function autoConnectPlan(discovery) {
+    if (!discovery)
+        return { kind: 'unknown' };
+    if (!discovery.requires_authorization)
+        return { kind: 'no_authorization' };
+    if (!discovery.metadata?.token_url && !discovery.metadata?.authorization_url) {
+        return {
+            kind: 'manual',
+            reason: discovery.warnings.at(-1) ??
+                'This server does not publish OAuth 2.0 metadata. Enter its endpoints manually.',
+        };
+    }
+    const label = resourceLabel(discovery);
+    if (discovery.kortix_client)
+        return { kind: 'register', label, scopes: discovery.scopes };
+    if (!discovery.registration_endpoint) {
+        return { kind: 'client_id_required', label, scopes: discovery.scopes };
+    }
+    return {
+        kind: 'register',
+        label,
+        registrationEndpoint: discovery.registration_endpoint,
+        scopes: discovery.scopes,
+    };
+}
+export function buildClientRegistrationInput(discovery) {
+    if (!discovery.registration_endpoint && !discovery.kortix_client) {
+        throw new Error('This authorization server does not support dynamic client registration');
+    }
+    const metadata = discovery.metadata ?? {};
+    return {
+        // Without it the API signs in with Kortix's own client for this server.
+        ...(discovery.registration_endpoint
+            ? { registration_endpoint: discovery.registration_endpoint }
+            : {}),
+        // Bind the issued client to the server that issued it, so the callback can
+        // validate RFC 9207 `iss` (MCP SEP-2468 / SEP-2352).
+        ...(discovery.authorization_server ? { issuer: discovery.authorization_server } : {}),
+        ...(metadata.discovery_url ? { discovery_url: metadata.discovery_url } : {}),
+        ...(metadata.authorization_url ? { authorization_url: metadata.authorization_url } : {}),
+        ...(metadata.token_url ? { token_url: metadata.token_url } : {}),
+        ...(metadata.device_authorization_url
+            ? { device_authorization_url: metadata.device_authorization_url }
+            : {}),
+        ...(metadata.revocation_url ? { revocation_url: metadata.revocation_url } : {}),
+        ...(discovery.token_endpoint_auth_methods_supported?.length
+            ? {
+                token_endpoint_auth_methods_supported: discovery.token_endpoint_auth_methods_supported,
+            }
+            : {}),
+        ...(discovery.scopes.length ? { scopes: discovery.scopes } : {}),
+        ...(discovery.resource ? { resource: discovery.resource } : {}),
+    };
+}
+/** Prefill the manual form from discovery. Anything the user typed wins. */
+export function mergeResourceDiscoveryIntoForm(form, discovery) {
+    const metadata = discovery.metadata ?? {};
+    return {
+        ...form,
+        discoveryUrl: form.discoveryUrl || metadata.discovery_url || '',
+        authorizationUrl: form.authorizationUrl || metadata.authorization_url || '',
+        tokenUrl: form.tokenUrl || metadata.token_url || '',
+        deviceAuthorizationUrl: form.deviceAuthorizationUrl || metadata.device_authorization_url || '',
+        revocationUrl: form.revocationUrl || metadata.revocation_url || '',
+        scopes: form.scopes || discovery.scopes.join(' '),
+        resource: form.resource || discovery.resource || '',
+    };
+}

package/dist/customize/sections/connector-oauth2-fields.d.ts

@@ -0,0 +1,7 @@
+import type { OAuth2CredentialForm } from './connector-oauth2.js';
+export declare function OAuth2CredentialFields({ value, onChange, idPrefix, autoFocus, }: {
+    value: OAuth2CredentialForm;
+    onChange: (value: OAuth2CredentialForm) => void;
+    idPrefix: string;
+    autoFocus?: boolean;
+}): import("react").JSX.Element;

package/dist/customize/sections/connector-oauth2-fields.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Field, FieldDescription, FieldGroup, FieldLabel } from '../../primitives/field.js';
+import { Input } from '../../primitives/input.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../primitives/select.js';
+import { Textarea } from '../../primitives/textarea.js';
+import { useTranslations } from '../../i18n/index.js';
+import { OAuth2ScopeFields } from './connector-oauth2-scope-fields.js';
+export function OAuth2CredentialFields({ value, onChange, idPrefix, autoFocus = false, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const set = (key, next) => onChange({ ...value, [key]: next });
+    const id = (name) => `${idPrefix}-${name}`;
+    return (_jsxs(FieldGroup, { className: "grid gap-3 sm:grid-cols-2", children: [_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('token-url'), children: tI18nComplete.raw('text431e0036cba3') }), _jsx(Input, { id: id('token-url'), type: "url", value: value.tokenUrl, onChange: (event) => set('tokenUrl', event.target.value), placeholder: "https://identity.example.com/oauth2/token", variant: "popover", autoFocus: autoFocus, required: true })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('client-id'), children: tI18nComplete.raw('text8726db013948') }), _jsx(Input, { id: id('client-id'), value: value.clientId, onChange: (event) => set('clientId', event.target.value), variant: "popover", required: true })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('auth-method'), children: tI18nComplete.raw('textb5037fbea489') }), _jsxs(Select, { value: value.authMethod, onValueChange: (next) => set('authMethod', next), children: [_jsx(SelectTrigger, { id: id('auth-method'), children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "none", children: tI18nComplete.raw('text3a9be266e664') }), _jsx(SelectItem, { value: "client_secret_post", children: tI18nComplete.raw('textfd4daecd5ecf') }), _jsx(SelectItem, { value: "client_secret_basic", children: tI18nComplete.raw('textedb912f176d8') }), _jsx(SelectItem, { value: "client_secret_jwt", children: tI18nComplete.raw('text7d06167236bd') }), _jsx(SelectItem, { value: "private_key_jwt", children: tI18nComplete.raw('text6ac8fd822515') })] })] })] }), value.authMethod === 'private_key_jwt' ? (_jsxs(_Fragment, { children: [_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('private-key'), children: tI18nComplete.raw('text7251cfc3ceab') }), _jsx(Textarea, { id: id('private-key'), value: value.privateKey, onChange: (event) => set('privateKey', event.target.value), className: "min-h-32 font-mono text-xs", required: true })] }), _jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('thumbprint'), children: tI18nComplete.raw('text680d59689583') }), _jsx(Input, { id: id('thumbprint'), type: "password", value: value.certificateThumbprint, onChange: (event) => set('certificateThumbprint', event.target.value), placeholder: tI18nComplete.raw('textd647e7a1a79d'), variant: "popover" }), _jsx(FieldDescription, { children: tI18nComplete.raw('text12b9961bc6a4') })] })] })) : value.authMethod === 'none' ? (_jsx(Field, { className: "sm:col-span-2", children: _jsx(FieldDescription, { children: tI18nComplete.raw('text2e958b6de022') }) })) : (_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('client-secret'), children: tI18nComplete.raw('text4aded5faf156') }), _jsx(Input, { id: id('client-secret'), type: "password", value: value.clientSecret, onChange: (event) => set('clientSecret', event.target.value), variant: "popover", required: true })] })), _jsx(OAuth2ScopeFields, { value: value, onChange: set, idPrefix: idPrefix, scopePlaceholder: tI18nComplete.raw('textd39d2a43676f') })] }));
+}

package/dist/customize/sections/connector-oauth2-scope-fields.d.ts

@@ -0,0 +1,7 @@
+import type { OAuth2CredentialForm } from './connector-oauth2.js';
+export declare function OAuth2ScopeFields({ value, onChange, idPrefix, scopePlaceholder, }: {
+    value: Pick<OAuth2CredentialForm, 'scopes' | 'resource' | 'audience'>;
+    onChange: (key: 'scopes' | 'resource' | 'audience', value: string) => void;
+    idPrefix: string;
+    scopePlaceholder: string;
+}): import("react").JSX.Element;

package/dist/customize/sections/connector-oauth2-scope-fields.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Field, FieldDescription, FieldLabel } from '../../primitives/field.js';
+import { Input } from '../../primitives/input.js';
+import { useTranslations } from '../../i18n/index.js';
+export function OAuth2ScopeFields({ value, onChange, idPrefix, scopePlaceholder, }) {
+    const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
+    const id = (name) => `${idPrefix}-${name}`;
+    return (_jsxs(_Fragment, { children: [_jsxs(Field, { className: "sm:col-span-2", children: [_jsx(FieldLabel, { htmlFor: id('scopes'), children: tI18nComplete.raw('text0d5644ff52ce') }), _jsx(Input, { id: id('scopes'), value: value.scopes, onChange: (event) => onChange('scopes', event.target.value), placeholder: scopePlaceholder, variant: "popover" }), _jsx(FieldDescription, { children: tI18nComplete.raw('textda4365b5d2bf') })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('resource'), children: tI18nComplete.raw('texteb7a842ff958') }), _jsx(Input, { id: id('resource'), value: value.resource, onChange: (event) => onChange('resource', event.target.value), placeholder: tI18nComplete.raw('text59be71333c96'), variant: "popover" })] }), _jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: id('audience'), children: tI18nComplete.raw('text545c02357695') }), _jsx(Input, { id: id('audience'), value: value.audience, onChange: (event) => onChange('audience', event.target.value), placeholder: tI18nComplete.raw('text59be71333c96'), variant: "popover" })] })] }));
+}

package/dist/customize/sections/connector-oauth2-start.d.ts

@@ -0,0 +1,22 @@
+import { type OAuth2ResourceDiscovery } from '@kortix/sdk';
+/**
+ * One-click OAuth: register Kortix as a client of the server's authorization
+ * server, then start Authorization Code + PKCE. Returns the provider URL to
+ * send the browser to. The provider sends the user back to `returnUrl`.
+ */
+export declare function startOAuth2SignIn(projectId: string, connectionId: string, discovery: OAuth2ResourceDiscovery, returnUrl: string): Promise<string>;
+/**
+ * Install's sign-in: discover the server's authorization chain and, when it
+ * supports one-click OAuth, start it. `null` when it does not, so the caller
+ * falls back to credential entry.
+ */
+export declare function startDiscoveredSignIn(projectId: string, connectionId: string, returnUrl: string): Promise<string | null>;
+/**
+ * A sign-in start for a flow that falls back to credential entry: the consent
+ * URL, or why there is none. A failed start keeps the server's reason, so the
+ * fallback can say why it asks for a credential.
+ */
+export declare function signInOrReason(start: () => Promise<string | null>): Promise<{
+    url: string | null;
+    error: string | null;
+}>;

package/dist/customize/sections/connector-oauth2-start.js

@@ -0,0 +1,40 @@
+import { discoverConnectionOAuth2Resource, registerConnectionOAuth2Client, startConnectionOAuth2Authorization, } from '@kortix/sdk';
+import { autoConnectPlan, buildClientRegistrationInput } from './connector-oauth2-auto.js';
+/**
+ * One-click OAuth: register Kortix as a client of the server's authorization
+ * server, then start Authorization Code + PKCE. Returns the provider URL to
+ * send the browser to. The provider sends the user back to `returnUrl`.
+ */
+export async function startOAuth2SignIn(projectId, connectionId, discovery, returnUrl) {
+    await registerConnectionOAuth2Client(projectId, connectionId, buildClientRegistrationInput(discovery));
+    const result = await startConnectionOAuth2Authorization(projectId, connectionId, {
+        ...(discovery.scopes.length ? { scopes: discovery.scopes } : {}),
+        success_redirect_uri: returnUrl,
+        error_redirect_uri: returnUrl,
+    });
+    return result.authorization_url;
+}
+/**
+ * Install's sign-in: discover the server's authorization chain and, when it
+ * supports one-click OAuth, start it. `null` when it does not, so the caller
+ * falls back to credential entry.
+ */
+export async function startDiscoveredSignIn(projectId, connectionId, returnUrl) {
+    const { discovery } = await discoverConnectionOAuth2Resource(projectId, connectionId);
+    if (autoConnectPlan(discovery).kind !== 'register')
+        return null;
+    return startOAuth2SignIn(projectId, connectionId, discovery, returnUrl);
+}
+/**
+ * A sign-in start for a flow that falls back to credential entry: the consent
+ * URL, or why there is none. A failed start keeps the server's reason, so the
+ * fallback can say why it asks for a credential.
+ */
+export async function signInOrReason(start) {
+    try {
+        return { url: await start(), error: null };
+    }
+    catch (error) {
+        return { url: null, error: error instanceof Error ? error.message : String(error) };
+    }
+}

package/dist/customize/sections/connector-oauth2.d.ts

@@ -0,0 +1,50 @@
+import type { ConnectionCredentialInput, ConnectorDraftInput, ConnectorSyncResult, OAuth2ApplicationInput, OAuth2ClientCredentials, OAuth2TokenEndpointAuthMethod } from '@kortix/sdk';
+export interface OAuth2CredentialForm {
+    tokenUrl: string;
+    clientId: string;
+    authMethod: OAuth2ClientCredentials['token_endpoint_auth_method'];
+    clientSecret: string;
+    privateKey: string;
+    certificateThumbprint: string;
+    scopes: string;
+    resource: string;
+    audience: string;
+}
+export declare const EMPTY_OAUTH2_CREDENTIAL_FORM: OAuth2CredentialForm;
+export declare function oauth2CredentialFormValid(form: OAuth2CredentialForm): boolean;
+export declare function buildOAuth2CredentialInput(form: OAuth2CredentialForm): ConnectionCredentialInput;
+type OAuth2Grant = 'client_credentials' | 'authorization_code' | 'device_authorization';
+export interface OAuth2ApplicationForm {
+    grant: OAuth2Grant;
+    discoveryUrl: string;
+    authorizationUrl: string;
+    tokenUrl: string;
+    deviceAuthorizationUrl: string;
+    revocationUrl: string;
+    clientId: string;
+    authMethod: OAuth2TokenEndpointAuthMethod;
+    clientSecret: string;
+    privateKey: string;
+    scopes: string;
+    resource: string;
+    audience: string;
+}
+export declare const EMPTY_OAUTH2_APPLICATION_FORM: OAuth2ApplicationForm;
+export declare function oauth2ApplicationFormValid(form: OAuth2ApplicationForm): boolean;
+export declare function buildOAuth2ApplicationInput(form: OAuth2ApplicationForm): OAuth2ApplicationInput;
+export declare function mergeOAuth2DiscoveryMetadata(form: OAuth2ApplicationForm, metadata: Partial<OAuth2ApplicationInput>): OAuth2ApplicationForm;
+export declare function createConnectorWithOptionalOAuth2(projectId: string, draft: ConnectorDraftInput, oauth2: OAuth2CredentialForm | null, deps: {
+    createConnector: (projectId: string, draft: ConnectorDraftInput) => Promise<Awaited<ReturnType<typeof import('@kortix/sdk').createConnector>>>;
+    deleteConnector: (projectId: string, slug: string) => Promise<unknown>;
+    /** Resolves to the re-sync that storing the credential ran (MCP only). */
+    setConnectorCredential: (projectId: string, slug: string, credential: ConnectionCredentialInput) => Promise<{
+        ok: boolean;
+        sync?: ConnectorSyncResult;
+    } | void>;
+}): Promise<{
+    syncError: string | null;
+    credentialStored: boolean;
+    /** An MCP connector with an auth scheme got 401/403, and no credential was given. */
+    signInPending: boolean;
+}>;
+export {};

package/dist/customize/sections/connector-oauth2.js

@@ -0,0 +1,165 @@
+import { connectorSyncErrorForSlug, createOnlyConnectorDraft, isAuthChallenge, } from './connector-connection-form.js';
+export const EMPTY_OAUTH2_CREDENTIAL_FORM = {
+    tokenUrl: '',
+    clientId: '',
+    authMethod: 'client_secret_post',
+    clientSecret: '',
+    privateKey: '',
+    certificateThumbprint: '',
+    scopes: '',
+    resource: '',
+    audience: '',
+};
+export function oauth2CredentialFormValid(form) {
+    if (!form.tokenUrl.trim() || !form.clientId.trim())
+        return false;
+    if (form.authMethod === 'none')
+        return true;
+    if (form.authMethod === 'private_key_jwt')
+        return Boolean(form.privateKey.trim());
+    return Boolean(form.clientSecret.trim());
+}
+export function buildOAuth2CredentialInput(form) {
+    const oauth2 = {
+        type: 'oauth2_client_credentials',
+        token_url: form.tokenUrl.trim(),
+        client_id: form.clientId.trim(),
+        token_endpoint_auth_method: form.authMethod,
+    };
+    if (form.authMethod === 'private_key_jwt') {
+        oauth2.private_key = form.privateKey;
+        if (form.certificateThumbprint.trim()) {
+            oauth2.certificate_thumbprint = form.certificateThumbprint.trim();
+        }
+    }
+    else if (form.authMethod !== 'none') {
+        oauth2.client_secret = form.clientSecret;
+    }
+    const scopes = form.scopes.split(/\s+/).filter(Boolean);
+    if (scopes.length)
+        oauth2.scopes = scopes;
+    if (form.resource.trim())
+        oauth2.resource = form.resource.trim();
+    if (form.audience.trim())
+        oauth2.audience = form.audience.trim();
+    return { oauth2 };
+}
+export const EMPTY_OAUTH2_APPLICATION_FORM = {
+    grant: 'client_credentials',
+    discoveryUrl: '',
+    authorizationUrl: '',
+    tokenUrl: '',
+    deviceAuthorizationUrl: '',
+    revocationUrl: '',
+    clientId: '',
+    authMethod: 'client_secret_post',
+    clientSecret: '',
+    privateKey: '',
+    scopes: '',
+    resource: '',
+    audience: '',
+};
+function splitScopes(scopes) {
+    return scopes.split(/\s+/).filter(Boolean);
+}
+export function oauth2ApplicationFormValid(form) {
+    if (!form.clientId.trim())
+        return false;
+    if (!form.discoveryUrl.trim() && !form.tokenUrl.trim())
+        return false;
+    if (form.grant === 'authorization_code' &&
+        !form.discoveryUrl.trim() &&
+        !form.authorizationUrl.trim()) {
+        return false;
+    }
+    if (form.grant === 'device_authorization' &&
+        !form.discoveryUrl.trim() &&
+        !form.deviceAuthorizationUrl.trim()) {
+        return false;
+    }
+    if (form.authMethod === 'none')
+        return true;
+    if (form.authMethod === 'private_key_jwt')
+        return Boolean(form.privateKey.trim());
+    return Boolean(form.clientSecret.trim());
+}
+export function buildOAuth2ApplicationInput(form) {
+    const input = {
+        client_id: form.clientId.trim(),
+        token_endpoint_auth_method: form.authMethod,
+    };
+    if (form.discoveryUrl.trim())
+        input.discovery_url = form.discoveryUrl.trim();
+    if (form.authorizationUrl.trim())
+        input.authorization_url = form.authorizationUrl.trim();
+    if (form.tokenUrl.trim())
+        input.token_url = form.tokenUrl.trim();
+    if (form.deviceAuthorizationUrl.trim()) {
+        input.device_authorization_url = form.deviceAuthorizationUrl.trim();
+    }
+    if (form.revocationUrl.trim())
+        input.revocation_url = form.revocationUrl.trim();
+    if (form.authMethod === 'private_key_jwt')
+        input.private_key = form.privateKey;
+    else if (form.authMethod !== 'none')
+        input.client_secret = form.clientSecret;
+    const scopes = splitScopes(form.scopes);
+    if (scopes.length)
+        input.scopes = scopes;
+    if (form.resource.trim())
+        input.resource = form.resource.trim();
+    if (form.audience.trim())
+        input.audience = form.audience.trim();
+    return input;
+}
+export function mergeOAuth2DiscoveryMetadata(form, metadata) {
+    return {
+        ...form,
+        authorizationUrl: form.authorizationUrl || metadata.authorization_url || '',
+        tokenUrl: form.tokenUrl || metadata.token_url || '',
+        deviceAuthorizationUrl: form.deviceAuthorizationUrl || metadata.device_authorization_url || '',
+        revocationUrl: form.revocationUrl || metadata.revocation_url || '',
+        scopes: form.scopes || metadata.scopes?.join(' ') || '',
+    };
+}
+export async function createConnectorWithOptionalOAuth2(projectId, draft, oauth2, deps) {
+    const created = await deps.createConnector(projectId, createOnlyConnectorDraft(draft));
+    const firstError = connectorSyncErrorForSlug(created, draft.slug);
+    if (!oauth2) {
+        // An MCP server answers its first tools/list with 401 or 403 until someone
+        // signs in: the sign-in still to do, not a failure. Only a connector with
+        // an auth scheme (picked in the form, or discovered from the server's
+        // challenge) sends a sign-in. Without one the 401 stays the error.
+        const auth = draft.auth ?? created.authDiscovery?.recommended;
+        const signInPending = firstError !== null &&
+            draft.provider === 'mcp' &&
+            Boolean(auth?.type && auth.type !== 'none') &&
+            isAuthChallenge(firstError);
+        return {
+            syncError: signInPending ? null : firstError,
+            credentialStored: false,
+            signInPending,
+        };
+    }
+    // The connector exists even when its first sync failed, and its page opens
+    // next: store the app credential either way, so Retry runs with it.
+    let stored;
+    try {
+        stored = await deps.setConnectorCredential(projectId, draft.slug, buildOAuth2CredentialInput(oauth2));
+    }
+    catch (credentialError) {
+        try {
+            await deps.deleteConnector(projectId, draft.slug);
+        }
+        catch (rollbackError) {
+            const credentialMessage = credentialError instanceof Error ? credentialError.message : String(credentialError);
+            const rollbackMessage = rollbackError instanceof Error ? rollbackError.message : String(rollbackError);
+            throw new Error(`OAuth2 credential validation failed: ${credentialMessage}. Connector rollback failed: ${rollbackMessage}`);
+        }
+        throw credentialError;
+    }
+    // Storing it re-syncs an MCP connector: that sync is the current state. A
+    // connector of any other provider keeps its first result.
+    const syncError = stored?.sync ? connectorSyncErrorForSlug(stored, draft.slug) : firstError;
+    return { syncError, credentialStored: true, signInPending: false };
+}