@manta-eu/react 0.1.0

package/dist/routes/data-explorer/turtle.js

@@ -0,0 +1,79 @@
+import { compactUri, namespaces } from "@manta-eu/client/shared/rdf-namespaces";
+import { isPresent } from "@manta-eu/lib/present";
+const prefixIris = new Map(Object.entries(namespaces));
+const rdfTypeIri = `${namespaces.rdf}type`;
+const xsdIntegerIri = `${namespaces.xsd}integer`;
+const xsdBooleanIri = `${namespaces.xsd}boolean`;
+const xsdStringIri = `${namespaces.xsd}string`;
+const validLocalName = /^(?:[A-Za-z0-9_][A-Za-z0-9_-]*)?$/;
+function turtleIri(iri, usedPrefixes) {
+    const compacted = compactUri(iri);
+    if (compacted === iri)
+        return `<${iri}>`;
+    const colonIndex = compacted.indexOf(":");
+    const prefix = compacted.slice(0, colonIndex);
+    const local = compacted.slice(colonIndex + 1);
+    if (!validLocalName.test(local))
+        return `<${iri}>`;
+    usedPrefixes.add(prefix);
+    return compacted;
+}
+function turtleLiteral(value, datatype, usedPrefixes) {
+    if (datatype === xsdIntegerIri && /^[+-]?\d+$/.test(value))
+        return value;
+    if (datatype === xsdBooleanIri && (value === "true" || value === "false"))
+        return value;
+    const quoted = JSON.stringify(value);
+    if (!datatype || datatype === xsdStringIri)
+        return quoted;
+    return `${quoted}^^${turtleIri(datatype, usedPrefixes)}`;
+}
+function turtleTerm(term, usedPrefixes) {
+    if (term.isBlank)
+        return `_:${term.value}`;
+    return term.isIri ? turtleIri(term.value, usedPrefixes) : turtleLiteral(term.value, term.datatype, usedPrefixes);
+}
+function prefixHeader(usedPrefixes) {
+    return [...usedPrefixes]
+        .sort()
+        .flatMap((prefix) => {
+        const iri = prefixIris.get(prefix);
+        return iri ? [`@prefix ${prefix}: <${iri}> .`] : [];
+    })
+        .join("\n");
+}
+function withHeader(body, usedPrefixes) {
+    const header = prefixHeader(usedPrefixes);
+    return isPresent(header) ? `${header}\n\n${body}` : body;
+}
+export function turtleForSubject(subjectIri, rows) {
+    const usedPrefixes = new Set();
+    const subject = turtleIri(subjectIri, usedPrefixes);
+    const lines = rows.map((row) => {
+        const predicate = row.predicate === rdfTypeIri ? "a" : turtleIri(row.predicate, usedPrefixes);
+        const object = turtleTerm({ value: row.object, isIri: row.objectIsIri, isBlank: row.objectIsBlank, datatype: row.datatype }, usedPrefixes);
+        return `${predicate} ${object}`;
+    });
+    return withHeader(`${subject} ${lines.join(" ;\n    ")} .`, usedPrefixes);
+}
+function turtleConstraint(constraint, usedPrefixes) {
+    const predicate = turtleIri(constraint.predicate, usedPrefixes);
+    if (constraint.listValues) {
+        return `${predicate} (${constraint.listValues.map((term) => turtleTerm(term, usedPrefixes)).join(" ")})`;
+    }
+    return `${predicate} ${turtleTerm(constraint.value, usedPrefixes)}`;
+}
+export function turtleForShape(shape, targetClassIri) {
+    const usedPrefixes = new Set(["sh"]);
+    const shapeIri = turtleIri(shape.iri, usedPrefixes);
+    const targetClass = turtleIri(targetClassIri, usedPrefixes);
+    const propertyBlocks = shape.properties.map((property) => {
+        const constraintLines = [
+            `sh:path ${turtleIri(property.path, usedPrefixes)}`,
+            ...property.constraints.map((constraint) => turtleConstraint(constraint, usedPrefixes)),
+        ];
+        return `sh:property [\n        ${constraintLines.join(" ;\n        ")}\n    ]`;
+    });
+    const statements = [`sh:targetClass ${targetClass}`, ...propertyBlocks];
+    return withHeader(`${shapeIri} ${statements.join(" ;\n    ")} .`, usedPrefixes);
+}

package/dist/routes/data-explorer/values.d.ts

@@ -0,0 +1,14 @@
+import { type MeasureKind } from "#ldo-ui";
+export type FieldGroup<Row extends {
+    predicate: string;
+}> = {
+    predicate: string;
+    rows: Row[];
+};
+export declare function groupFieldRows<Row extends {
+    predicate: string;
+}>(rows: Row[]): Array<FieldGroup<Row>>;
+export declare function isNumericDatatype(datatype: string | undefined): boolean;
+export declare function isBooleanDatatype(datatype: string | undefined): boolean;
+export declare function formatLiteralValue(value: string, datatype: string | undefined, measure?: MeasureKind): string;
+//# sourceMappingURL=values.d.ts.map

package/dist/routes/data-explorer/values.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"values.d.ts","sourceRoot":"","sources":["../../../src/routes/data-explorer/values.ts"],"names":[],"mappings":"AAIA,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,SAAS,CAAC;AAE/D,MAAM,MAAM,UAAU,CAAC,GAAG,SAAS;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,IAAI;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,GAAG,EAAE,CAAA;CAAE,CAAC;AAE/F,wBAAgB,cAAc,CAAC,GAAG,SAAS;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAUrG;AAED,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAEvE;AAED,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAEvE;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,SAAS,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAQ7G"}

package/dist/routes/data-explorer/values.js

@@ -0,0 +1,28 @@
+import { parseISO } from "date-fns";
+import { xsd } from "ldkit/namespaces";
+import { collectBy, partition, prop } from "ramda";
+import { datatypeToConditionKind } from "./filter-query.js";
+import { formatMeasureValue } from "#ldo-ui";
+export function groupFieldRows(rows) {
+    const groups = collectBy(prop("predicate"), rows).flatMap((entries) => {
+        const [first] = entries;
+        return first ? [{ predicate: first.predicate, rows: entries }] : [];
+    });
+    const [multis, singles] = partition((group) => group.rows.length > 1, groups);
+    return [...singles, ...multis.sort((a, b) => a.rows.length - b.rows.length)];
+}
+export function isNumericDatatype(datatype) {
+    return datatypeToConditionKind(datatype) === "number";
+}
+export function isBooleanDatatype(datatype) {
+    return datatypeToConditionKind(datatype) === "boolean";
+}
+export function formatLiteralValue(value, datatype, measure) {
+    if (datatype === xsd.dateTime)
+        return new Date(value).toLocaleString();
+    if (datatype === xsd.date)
+        return parseISO(value.slice(0, 10)).toLocaleDateString();
+    if (isNumericDatatype(datatype))
+        return formatMeasureValue(value, measure);
+    return value;
+}

package/dist/routes/integrations/catalog-shape.d.ts

@@ -0,0 +1,50 @@
+import type { GQLIntegration } from "@manta-eu/client";
+import type { KeycloakRealm } from "@manta-eu/client/shared/constants";
+import type { HexColor } from "@manta-eu/lib/color";
+import type { ComponentType } from "react";
+import type { ConnectFormProps, InferalConnectFormConfig } from "./components/connect-forms/types.js";
+import type { ConnectionSource, ProviderId, ProviderLogoComponent } from "./types.js";
+export type ConnectionCapability = "provisions-stream";
+export type ConnectionMethodBase = {
+    capabilities: readonly ConnectionCapability[];
+    connectForm?: ComponentType<ConnectFormProps>;
+};
+export type InferalConnectionMethod = ConnectionMethodBase & InferalConnectFormConfig & {
+    source: "inferal";
+};
+export type OAuthConnectionMethod = ConnectionMethodBase & {
+    source: "oauth";
+    integration: GQLIntegration;
+    callbackProvider?: string;
+    resumesSetupAfterOAuth?: boolean;
+    connectedAction?: ComponentType;
+};
+export type GmailConnectionMethod = ConnectionMethodBase & {
+    source: "gmail";
+};
+export type ProviderConnectionMethod = InferalConnectionMethod | OAuthConnectionMethod | GmailConnectionMethod;
+export type ConnectableConnectionMethod = ProviderConnectionMethod & {
+    connectForm: ComponentType<ConnectFormProps>;
+};
+export type ConnectionMethodFilter = {
+    source?: ConnectionSource;
+    capability?: ConnectionCapability;
+};
+export type ProviderCatalogEntry = {
+    name: string;
+    category: string;
+    description: string;
+    brandColor: HexColor;
+    logo: ProviderLogoComponent;
+    connectionMethods: readonly ProviderConnectionMethod[];
+    realms?: KeycloakRealm[];
+};
+export type ProviderCatalogEntryWithId<Id extends string = ProviderId> = {
+    id: Id;
+} & ProviderCatalogEntry;
+export type ProviderConnectionSelection<Id extends string = ProviderId> = {
+    providerId: Id;
+    method: ConnectableConnectionMethod;
+};
+export declare function findConnectableConnectionMethod(entry: ProviderCatalogEntry, filter?: ConnectionMethodFilter): ConnectableConnectionMethod | undefined;
+//# sourceMappingURL=catalog-shape.d.ts.map

package/dist/routes/integrations/catalog-shape.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog-shape.d.ts","sourceRoot":"","sources":["../../../src/routes/integrations/catalog-shape.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,kCAAkC,CAAC;AACnG,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAEnF,MAAM,MAAM,oBAAoB,GAAG,mBAAmB,CAAC;AAEvD,MAAM,MAAM,oBAAoB,GAAG;IACjC,YAAY,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAC9C,WAAW,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CAC/C,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,oBAAoB,GACxD,wBAAwB,GAAG;IACzB,MAAM,EAAE,SAAS,CAAC;CACnB,CAAC;AAEJ,MAAM,MAAM,qBAAqB,GAAG,oBAAoB,GAAG;IACzD,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,cAAc,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,eAAe,CAAC,EAAE,aAAa,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,oBAAoB,GAAG;IACzD,MAAM,EAAE,OAAO,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAE/G,MAAM,MAAM,2BAA2B,GAAG,wBAAwB,GAAG;IACnE,WAAW,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CAC9C,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,MAAM,CAAC,EAAE,gBAAgB,CAAC;IAC1B,UAAU,CAAC,EAAE,oBAAoB,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,QAAQ,CAAC;IACrB,IAAI,EAAE,qBAAqB,CAAC;IAC5B,iBAAiB,EAAE,SAAS,wBAAwB,EAAE,CAAC;IACvD,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,0BAA0B,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,IAAI;IAAE,EAAE,EAAE,EAAE,CAAA;CAAE,GAAG,oBAAoB,CAAC;AAE3G,MAAM,MAAM,2BAA2B,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,IAAI;IACxE,UAAU,EAAE,EAAE,CAAC;IACf,MAAM,EAAE,2BAA2B,CAAC;CACrC,CAAC;AAEF,wBAAgB,+BAA+B,CAC7C,KAAK,EAAE,oBAAoB,EAC3B,MAAM,GAAE,sBAA2B,GAClC,2BAA2B,GAAG,SAAS,CAOzC"}

package/dist/routes/integrations/catalog-shape.js

@@ -0,0 +1,5 @@
+export function findConnectableConnectionMethod(entry, filter = {}) {
+    return entry.connectionMethods.find((method) => (!filter.source || method.source === filter.source) &&
+        (!filter.capability || method.capabilities.includes(filter.capability)) &&
+        method.connectForm !== undefined);
+}

package/dist/routes/integrations/components/AddIntegrationModal.d.ts

@@ -0,0 +1,17 @@
+import { type ReactNode } from "react";
+import { type ConnectionCapability, type ProviderCatalogEntryWithId } from "../catalog-shape.js";
+import type { ConnectionSource, ProviderId } from "../types.js";
+export type AddIntegrationModalProps<Id extends string = ProviderId> = {
+    entries: readonly ProviderCatalogEntryWithId<Id>[];
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    onConnected?: () => void;
+    initialProviderId?: NoInfer<Id>;
+    initialConnectionSource?: ConnectionSource;
+    resumedFromOAuth?: boolean;
+    requiredCapability?: ConnectionCapability;
+    title?: string;
+    description?: ReactNode;
+};
+export declare function AddIntegrationModal<Id extends string = ProviderId>(props: AddIntegrationModalProps<Id>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AddIntegrationModal.d.ts.map

package/dist/routes/integrations/components/AddIntegrationModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddIntegrationModal.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/AddIntegrationModal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,0BAA0B,EAEhC,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAK7D,MAAM,MAAM,wBAAwB,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,IAAI;IACrE,OAAO,EAAE,SAAS,0BAA0B,CAAC,EAAE,CAAC,EAAE,CAAC;IACnD,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC,CAAC;IAChC,uBAAuB,CAAC,EAAE,gBAAgB,CAAC;IAC3C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,kBAAkB,CAAC,EAAE,oBAAoB,CAAC;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,EAAE,KAAK,EAAE,wBAAwB,CAAC,EAAE,CAAC,2CAiFtG"}

package/dist/routes/integrations/components/AddIntegrationModal.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useRef, useState } from "react";
+import { findConnectableConnectionMethod, } from "../catalog-shape.js";
+import { IntegrationCatalog } from "./IntegrationCatalog.js";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "#components/modal/index";
+import { cn } from "#lib/utils";
+export function AddIntegrationModal(props) {
+    const { entries, open, onOpenChange, onConnected, initialProviderId, initialConnectionSource, resumedFromOAuth, requiredCapability, title = "Add an integration", description = "Browse the tools Manta can connect to and plug in a new one.", } = props;
+    const [selection, setSelection] = useState(null);
+    const [resumeSpent, setResumeSpent] = useState(false);
+    const entriesRef = useRef(entries);
+    entriesRef.current = entries;
+    useLayoutEffect(() => {
+        if (!open)
+            return;
+        setResumeSpent(false);
+        const initialProvider = initialProviderId
+            ? entriesRef.current.find((entry) => entry.id === initialProviderId)
+            : undefined;
+        const method = initialProvider
+            ? findConnectableConnectionMethod(initialProvider, {
+                source: initialConnectionSource,
+                capability: requiredCapability,
+            })
+            : undefined;
+        setSelection(initialProviderId && method ? { providerId: initialProviderId, method } : null);
+    }, [open, initialProviderId, initialConnectionSource, requiredCapability]);
+    const ConnectForm = selection?.method.connectForm;
+    const selectedProvider = selection ? entries.find((entry) => entry.id === selection.providerId) : undefined;
+    const selectedProviderResumedFromOAuth = Boolean(resumedFromOAuth) &&
+        !resumeSpent &&
+        Boolean(selection && selection.providerId === initialProviderId && selection.method.source === initialConnectionSource);
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsx(DialogContent, { className: cn(ConnectForm ? "max-w-xl" : "max-w-4xl"), children: ConnectForm && selection && selectedProvider ? (_jsx(ConnectForm, { provider: {
+                    id: selection.providerId,
+                    name: selectedProvider.name,
+                    brandColor: selectedProvider.brandColor,
+                    logo: selectedProvider.logo,
+                }, inferalConfig: selection.method.source === "inferal" ? selection.method : undefined, onBack: () => {
+                    setResumeSpent(true);
+                    setSelection(null);
+                }, onChanged: () => onConnected?.(), onDismiss: () => onOpenChange(false), resumedFromOAuth: selectedProviderResumedFromOAuth })) : (_jsx(IntegrationCatalog, { entries: entries, onSelect: setSelection, scrollable: true, requiredCapability: requiredCapability, header: _jsxs(DialogHeader, { children: [_jsx(DialogTitle, { text: title }), _jsx(DialogDescription, { children: description })] }) })) }) }));
+}

package/dist/routes/integrations/components/ConnectionAccountLabel.d.ts

@@ -0,0 +1,6 @@
+import type { NamedAccount } from "../connection-view.js";
+export type ConnectionAccountLabelProps = {
+    account: NamedAccount;
+};
+export declare function ConnectionAccountLabel(props: ConnectionAccountLabelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ConnectionAccountLabel.d.ts.map

package/dist/routes/integrations/components/ConnectionAccountLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionAccountLabel.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/ConnectionAccountLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAKvD,MAAM,MAAM,2BAA2B,GAAG;IACxC,OAAO,EAAE,YAAY,CAAC;CACvB,CAAC;AAEF,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,2BAA2B,2CA8DxE"}

package/dist/routes/integrations/components/ConnectionAccountLabel.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { getInitials } from "@manta-eu/lib/string";
+import { Link } from "react-router";
+import { CopyIdBadge } from "./CopyIdBadge.js";
+import { getEntityView, useOntologyTerm } from "#ldo-ui";
+import { entityPath } from "#routes/data-explorer/namespaces";
+export function ConnectionAccountLabel(props) {
+    const { account } = props;
+    const { name, noun, externalId, entityIri, typeIri, graphConnections } = account;
+    const typeLabel = useOntologyTerm(typeIri)?.label;
+    // Rich path: dispatch the KG resource to a type-specific entity view (meta:AdAccount,
+    // google:Customer, …). entityIri is only populated for operators with the data-explorer flag,
+    // so non-operators keep the static label below.
+    const EntityView = isPresent(typeIri) ? getEntityView(typeIri) : undefined;
+    if (EntityView && isPresent(entityIri)) {
+        const nodeData = {
+            label: name,
+            type: typeIri,
+            connectionCount: 0,
+            isHub: false,
+            jsonLd: { "@id": entityIri },
+            properties: [],
+            childIds: [],
+            isCollapsed: false,
+            hasChildren: false,
+            depth: 0,
+        };
+        return (_jsxs("div", { className: "flex flex-1 min-w-0 items-center gap-3", children: [_jsx(EntityView, { data: nodeData }), isPresent(graphConnections) && _jsx(GraphConnectionsBadge, { graphConnections: graphConnections }), _jsx(CopyIdBadge, { externalId: externalId, copyLabel: `Copy ${(noun ?? name).toLowerCase()} ID` })] }));
+    }
+    // Fallback: static label (no registered view, or non-operator without an entity IRI).
+    const displayName = isPresent(noun) ? name : (typeLabel ?? name);
+    const displayNoun = isPresent(noun) ? (typeLabel ?? noun) : undefined;
+    return (_jsxs("div", { className: "flex flex-1 min-w-0 items-center gap-3", children: [_jsx("div", { className: "flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted typography-caption-medium text-default-foreground", children: getInitials({ name: displayName, maxCount: 1 }) }), isPresent(entityIri) ? (_jsx(Link, { to: entityPath(entityIri), onClick: (event) => event.stopPropagation(), className: "truncate typography-caption-medium text-default-foreground hover:underline", children: displayName })) : (_jsx("p", { className: "truncate typography-caption-medium text-default-foreground", children: displayName })), isPresent(displayNoun) && _jsx("span", { className: "shrink-0 typography-tiny text-muted-foreground", children: displayNoun }), isPresent(graphConnections) && _jsx(GraphConnectionsBadge, { graphConnections: graphConnections }), _jsx(CopyIdBadge, { externalId: externalId, copyLabel: `Copy ${(displayNoun ?? displayName).toLowerCase()} ID` })] }));
+}
+function GraphConnectionsBadge(props) {
+    const { count, href } = props.graphConnections;
+    return (_jsxs(Link, { to: href, onClick: (event) => event.stopPropagation(), className: "shrink-0 rounded-full bg-muted px-2 py-0.5 typography-tiny text-muted-foreground hover:underline", children: [count === 1 ? "1 connection" : `${count} connections`, " in the graph"] }));
+}

package/dist/routes/integrations/components/ConnectionRow.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from "react";
+import type { ConnectionView } from "../connection-view.js";
+export type ConnectionRowProps = {
+    connection: ConnectionView;
+    onClick?: () => void;
+    onRemove?: () => void;
+    isRemoving?: boolean;
+    onSync?: () => void;
+    isSyncing?: boolean;
+    action?: ReactNode;
+};
+export declare function ConnectionRow(props: ConnectionRowProps): import("react/jsx-runtime").JSX.Element;
+export declare function ConnectionRowSkeleton(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ConnectionRow.d.ts.map

package/dist/routes/integrations/components/ConnectionRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectionRow.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/ConnectionRow.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAOzD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,UAAU,EAAE,cAAc,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,2CAsFtD;AAED,wBAAgB,qBAAqB,4CAcpC"}

package/dist/routes/integrations/components/ConnectionRow.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { ChevronRight, RefreshCw, Trash2 } from "lucide-react";
+import { ConnectionAccountLabel } from "./ConnectionAccountLabel.js";
+import { StatusChip } from "./StatusChip.js";
+import { Button } from "#components/button/index";
+import { Skeleton } from "#components/skeleton/index";
+import { cn } from "#lib/utils";
+export function ConnectionRow(props) {
+    const { connection, onClick, onRemove, isRemoving, onSync, isSyncing, action } = props;
+    const { primaryLabel, secondaryLabel, status, syncedLabel, namedAccount } = connection;
+    const interactive = isPresent(onClick);
+    const content = (_jsxs(_Fragment, { children: [namedAccount ? (_jsx(ConnectionAccountLabel, { account: namedAccount })) : (_jsxs("div", { className: "flex-1 min-w-0 grid gap-0.5", children: [_jsx("p", { className: "typography-caption-medium text-default-foreground truncate", children: primaryLabel }), isPresent(secondaryLabel) && (_jsx("p", { className: "typography-small text-muted-foreground truncate", children: secondaryLabel }))] })), _jsxs("div", { className: cn("flex flex-wrap items-center justify-end gap-x-4 gap-y-3 shrink-0", isPresent(action) && "max-sm:basis-full"), children: [isPresent(syncedLabel) && (_jsx("span", { className: "typography-tiny text-muted-foreground hidden sm:inline", children: syncedLabel })), _jsx(StatusChip, { status: status }), action, onSync && (_jsx(Button, { variant: "ghost", size: "sm", iconOnly: true, icon: RefreshCw, isLoading: isSyncing, onClick: (event) => {
+                            event.stopPropagation();
+                            onSync();
+                        }, "aria-label": `Sync ${primaryLabel}`, className: "text-muted-foreground hover:text-default-foreground" })), onRemove && (_jsx(Button, { variant: "ghost", size: "sm", iconOnly: true, icon: Trash2, disabled: isRemoving, onClick: (event) => {
+                            event.stopPropagation();
+                            onRemove();
+                        }, "aria-label": `Remove ${primaryLabel}`, className: "text-muted-foreground hover:text-error-foreground" })), interactive && _jsx(ChevronRight, { className: "size-4 text-muted-foreground" })] })] }));
+    return (_jsx("div", { className: "rounded-xl border border-muted-border bg-card overflow-hidden", children: interactive ? (_jsx("div", { role: "button", tabIndex: 0, onClick: onClick, onKeyDown: (event) => {
+                if (event.key === "Enter" || event.key === " ") {
+                    event.preventDefault();
+                    onClick?.();
+                }
+            }, className: "flex flex-wrap items-center justify-between gap-4 px-5 py-4 text-left hover:bg-faint transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-active-border/50 rounded-md w-full cursor-pointer", children: content })) : (_jsx("div", { className: "flex flex-wrap items-center justify-between gap-4 px-5 py-4 w-full", children: content })) }));
+}
+export function ConnectionRowSkeleton() {
+    return (_jsx("div", { className: "rounded-xl border border-muted-border bg-card overflow-hidden", children: _jsxs("div", { className: "flex items-center justify-between gap-4 px-5 py-4", children: [_jsxs("div", { className: "min-w-0 grid gap-1.5", children: [_jsx(Skeleton, { className: "h-4 w-48" }), _jsx(Skeleton, { className: "h-3 w-32" })] }), _jsx("div", { className: "flex items-center gap-4 shrink-0", children: _jsx(Skeleton, { className: "h-5 w-20 rounded-full" }) })] }) }));
+}

package/dist/routes/integrations/components/CopyIdBadge.d.ts

@@ -0,0 +1,6 @@
+export type CopyIdBadgeProps = {
+    externalId: string;
+    copyLabel: string;
+};
+export declare function CopyIdBadge(props: CopyIdBadgeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=CopyIdBadge.d.ts.map

package/dist/routes/integrations/components/CopyIdBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyIdBadge.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/CopyIdBadge.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAIF,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAmClD"}

package/dist/routes/integrations/components/CopyIdBadge.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Check, Copy } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+import { Button } from "#components/button/index";
+import { useCopyToClipboard } from "#lib/use-copy-clipboard";
+const copiedFeedbackMs = 1_500;
+export function CopyIdBadge(props) {
+    const { externalId, copyLabel } = props;
+    const { copyToClipboard } = useCopyToClipboard();
+    const [copied, setCopied] = useState(false);
+    const resetTimerRef = useRef(undefined);
+    useEffect(() => () => clearTimeout(resetTimerRef.current), []);
+    async function onCopy(event) {
+        event.stopPropagation();
+        const success = await copyToClipboard(externalId);
+        if (!success)
+            return;
+        setCopied(true);
+        clearTimeout(resetTimerRef.current);
+        resetTimerRef.current = setTimeout(() => setCopied(false), copiedFeedbackMs);
+    }
+    return (_jsx(Button, { variant: "ghost", size: "xs", onClick: onCopy, title: copyLabel, "aria-label": copyLabel, icon: copied ? Check : Copy, label: externalId, showLeftIcon: false, showRightIcon: true, className: "shrink-0 border border-muted-border bg-faint font-mono typography-tiny text-muted-foreground hover:border-default-border hover:text-default-foreground [&>svg]:size-3" }));
+}

package/dist/routes/integrations/components/IntegrationCatalog.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+import { type ConnectionCapability, type ProviderCatalogEntryWithId, type ProviderConnectionSelection } from "../catalog-shape.js";
+import type { ProviderId } from "../types.js";
+export type IntegrationCatalogProps<Id extends string = ProviderId> = {
+    entries: readonly ProviderCatalogEntryWithId<Id>[];
+    onSelect: (selection: ProviderConnectionSelection<Id>) => void;
+    header?: ReactNode;
+    scrollable?: boolean;
+    requiredCapability?: ConnectionCapability;
+    externalSearch?: string;
+};
+export declare function IntegrationCatalog<Id extends string = ProviderId>(props: IntegrationCatalogProps<Id>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=IntegrationCatalog.d.ts.map

package/dist/routes/integrations/components/IntegrationCatalog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IntegrationCatalog.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/IntegrationCatalog.tsx"],"names":[],"mappings":"AACA,OAAO,EAA4B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,0BAA0B,EAC/B,KAAK,2BAA2B,EACjC,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAQ3C,MAAM,MAAM,uBAAuB,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,IAAI;IACpE,OAAO,EAAE,SAAS,0BAA0B,CAAC,EAAE,CAAC,EAAE,CAAC;IACnD,QAAQ,EAAE,CAAC,SAAS,EAAE,2BAA2B,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,oBAAoB,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,EAAE,KAAK,EAAE,uBAAuB,CAAC,EAAE,CAAC,2CAgEpG"}

package/dist/routes/integrations/components/IntegrationCatalog.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { useId, useMemo, useState } from "react";
+import { findConnectableConnectionMethod, } from "../catalog-shape.js";
+import { filterProviderCatalogEntries } from "./filter-provider-catalog-entries.js";
+import { ProviderLogo } from "./ProviderLogo.js";
+import { Button } from "#components/button/index";
+import { SearchInput } from "#components/input/index";
+import { useCanScroll } from "#lib/use-can-scroll";
+import { cn } from "#lib/utils";
+export function IntegrationCatalog(props) {
+    const { entries, onSelect, header, scrollable, requiredCapability, externalSearch } = props;
+    const [ownSearchValue, setOwnSearchValue] = useState("");
+    const ownsSearch = externalSearch === undefined;
+    const searchValue = ownsSearch ? ownSearchValue : externalSearch;
+    const { ref: scrollRef, canScrollDown } = useCanScroll({ axis: "y" });
+    const filtered = useMemo(() => filterProviderCatalogEntries(entries, searchValue, requiredCapability), [entries, searchValue, requiredCapability]);
+    const results = !isPresent(filtered) ? (_jsx("p", { className: "text-center typography-caption text-muted-foreground py-8", children: "No integrations match your search." })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3", children: filtered.map((entry) => {
+            const method = findConnectableConnectionMethod(entry, { capability: requiredCapability });
+            return (_jsx(IntegrationCard, { entry: entry, onConnect: method ? () => onSelect({ providerId: entry.id, method }) : undefined }, entry.id));
+        }) }));
+    const searchInputId = useId();
+    return (_jsxs("div", { className: "grid gap-6", children: [header, ownsSearch && (_jsx("div", { className: "max-w-sm", children: _jsx(SearchInput, { id: searchInputId, name: searchInputId, placeholder: "Search for integration", value: searchValue, onChange: (event) => setOwnSearchValue(event.target.value), autoComplete: "off" }) })), scrollable ? (_jsxs("div", { className: "relative", children: [_jsx("div", { ref: scrollRef, className: "h-[min(70vh,640px)] overflow-y-auto pr-1", children: results }), _jsx("div", { className: cn("pointer-events-none absolute inset-x-0 bottom-0 h-10 bg-linear-to-t from-background to-transparent transition-opacity", canScrollDown ? "opacity-100" : "opacity-0") })] })) : (results)] }));
+}
+function IntegrationCard(props) {
+    const { entry, onConnect } = props;
+    return (_jsxs("article", { className: "rounded-xl border border-muted-border bg-card p-4 grid gap-5", children: [_jsxs("header", { className: "flex items-center gap-3 min-w-0", children: [_jsx(ProviderLogo, { logo: entry.logo, size: "sm" }), _jsxs("div", { className: "min-w-0 grid", children: [_jsx("p", { className: "typography-caption-medium text-default-foreground truncate", children: entry.name }), _jsx("p", { className: "typography-tiny text-muted-foreground truncate", children: entry.category })] })] }), _jsx("p", { className: "typography-caption line-clamp-2 min-h-10", children: entry.description }), _jsx("div", { className: "flex justify-end", children: onConnect ? (_jsx(Button, { variant: "primary", size: "sm", onClick: onConnect, children: "Connect" })) : (_jsx(Button, { variant: "secondary", size: "sm", disabled: true, children: "Coming soon" })) })] }));
+}

package/dist/routes/integrations/components/ProviderGroup.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from "react";
+import type { ConnectionView } from "../connection-view.js";
+import type { ConnectedProvider, ProviderId } from "../types.js";
+export type ProviderGroupProps<Id extends string = ProviderId> = {
+    provider: ConnectedProvider<Id>;
+    logo?: ReactNode;
+    onAddMore?: () => void;
+    getConnectionActions?: (connection: ConnectionView) => ConnectionActions;
+};
+export type ConnectionActions = {
+    onClick?: () => void;
+    onRemove?: () => void;
+    isRemoving?: boolean;
+    onSync?: () => void;
+    isSyncing?: boolean;
+    action?: ReactNode;
+};
+export declare function ProviderGroup<Id extends string = ProviderId>(props: ProviderGroupProps<Id>): import("react/jsx-runtime").JSX.Element;
+export declare function ProviderGroupSkeleton(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ProviderGroup.d.ts.map

package/dist/routes/integrations/components/ProviderGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProviderGroup.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/ProviderGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAM9D,MAAM,MAAM,kBAAkB,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,IAAI;IAC/D,QAAQ,EAAE,iBAAiB,CAAC,EAAE,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,cAAc,KAAK,iBAAiB,CAAC;CAC1E,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAIF,wBAAgB,aAAa,CAAC,EAAE,SAAS,MAAM,GAAG,UAAU,EAAE,KAAK,EAAE,kBAAkB,CAAC,EAAE,CAAC,2CAiD1F;AAED,wBAAgB,qBAAqB,4CAmBpC"}

package/dist/routes/integrations/components/ProviderGroup.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Plus } from "lucide-react";
+import { useState } from "react";
+import { ConnectionRow, ConnectionRowSkeleton } from "./ConnectionRow.js";
+import { Button } from "#components/button/index";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "#components/collapsible/index";
+import { Skeleton } from "#components/skeleton/index";
+const visibleConnectionLimit = 3;
+export function ProviderGroup(props) {
+    const { provider, logo, onAddMore, getConnectionActions } = props;
+    const [showAll, setShowAll] = useState(false);
+    const hasOverflow = provider.connections.length > visibleConnectionLimit;
+    const alwaysVisible = hasOverflow ? provider.connections.slice(0, visibleConnectionLimit) : provider.connections;
+    const overflow = hasOverflow ? provider.connections.slice(visibleConnectionLimit) : [];
+    function renderConnection(connection) {
+        const actions = getConnectionActions?.(connection);
+        return _jsx(ConnectionRow, { connection: connection, ...actions }, `${connection.source}:${connection.id}`);
+    }
+    return (_jsxs("section", { className: "grid gap-2 min-w-0", children: [_jsxs("header", { className: "flex items-center justify-between gap-4 px-1", children: [_jsxs("div", { className: "flex items-center gap-4 min-w-0", children: [logo, _jsxs("div", { className: "min-w-0 grid", children: [_jsx("p", { className: "typography-body-medium text-default-foreground truncate", children: provider.name }), _jsx("p", { className: "typography-tiny text-muted-foreground truncate", children: provider.category })] })] }), onAddMore && (_jsx(Button, { variant: "secondary", size: "sm", icon: Plus, onClick: onAddMore, children: "Add more" }))] }), _jsxs("div", { className: "flex flex-col gap-2 min-w-0 bg-card py-4 border-b border-muted-border", children: [alwaysVisible.map(renderConnection), hasOverflow && (_jsxs(Collapsible, { open: showAll, onOpenChange: setShowAll, className: "flex flex-col", children: [_jsx(CollapsibleContent, { children: _jsx("div", { className: "flex flex-col gap-2", children: overflow.map(renderConnection) }) }), _jsx(CollapsibleTrigger, { asChild: true, children: _jsx(Button, { variant: "secondary", type: "button", className: "self-end mt-2", children: showAll ? "Show less" : "Show more" }) })] }))] })] }));
+}
+export function ProviderGroupSkeleton() {
+    return (_jsxs("section", { className: "grid gap-2", children: [_jsxs("header", { className: "flex items-center justify-between gap-4 px-1", children: [_jsxs("div", { className: "flex items-center gap-4 min-w-0", children: [_jsx(Skeleton, { className: "size-10 rounded-lg" }), _jsxs("div", { className: "min-w-0 grid gap-1.5", children: [_jsx(Skeleton, { className: "h-4 w-40" }), _jsx(Skeleton, { className: "h-3 w-24" })] })] }), _jsx(Skeleton, { className: "h-8 w-24 rounded-md" })] }), _jsxs("div", { className: "flex flex-col gap-2 bg-card py-4 border-b border-muted-border", children: [_jsx(ConnectionRowSkeleton, {}), _jsx(ConnectionRowSkeleton, {})] })] }));
+}

package/dist/routes/integrations/components/ProviderLogo.d.ts

@@ -0,0 +1,12 @@
+import type { ProviderLogoComponent } from "../types.js";
+export declare const sizeClasses: {
+    readonly sm: "size-8";
+    readonly md: "size-10";
+};
+export type ProviderLogoProps = {
+    logo: ProviderLogoComponent;
+    size?: keyof typeof sizeClasses;
+    className?: string;
+};
+export declare function ProviderLogo(props: ProviderLogoProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ProviderLogo.d.ts.map

package/dist/routes/integrations/components/ProviderLogo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProviderLogo.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/ProviderLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAGtD,eAAO,MAAM,WAAW;;;CAGd,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,qBAAqB,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,OAAO,WAAW,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CAIpD"}

package/dist/routes/integrations/components/ProviderLogo.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "#lib/utils";
+export const sizeClasses = {
+    sm: "size-8",
+    md: "size-10",
+};
+export function ProviderLogo(props) {
+    const { logo: Logo, size = "md", className } = props;
+    return _jsx(Logo, { className: cn("shrink-0", sizeClasses[size], className), "aria-hidden": true });
+}

package/dist/routes/integrations/components/StatusChip.d.ts

@@ -0,0 +1,10 @@
+export type StatusTone = "info" | "success" | "warning" | "error" | "neutral";
+export type Status = {
+    label: string;
+    tone: StatusTone;
+};
+export type StatusChipProps = {
+    status: Status;
+};
+export declare function StatusChip(props: StatusChipProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StatusChip.d.ts.map

package/dist/routes/integrations/components/StatusChip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusChip.d.ts","sourceRoot":"","sources":["../../../../src/routes/integrations/components/StatusChip.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE9E,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,UAAU,CAAC;CAClB,CAAC;AAUF,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAShD"}

package/dist/routes/integrations/components/StatusChip.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "#lib/utils";
+const toneDotClass = {
+    info: "bg-info-foreground",
+    success: "bg-success-foreground",
+    warning: "bg-warning-foreground",
+    error: "bg-error-foreground",
+    neutral: "bg-muted-foreground",
+};
+export function StatusChip(props) {
+    const { status } = props;
+    return (_jsxs("span", { className: "inline-flex items-center gap-1.5 typography-caption text-default-foreground", children: [_jsx("span", { className: cn("size-2 rounded-full", toneDotClass[status.tone]) }), status.label] }));
+}

package/dist/routes/integrations/components/connect-forms/ConnectFormHeader.d.ts

@@ -0,0 +1,7 @@
+import type { ProviderPresentation } from "#routes/integrations/types";
+export type ConnectFormHeaderProps = {
+    provider: ProviderPresentation<string>;
+    status: string;
+};
+export declare function ConnectFormHeader(props: ConnectFormHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ConnectFormHeader.d.ts.map

package/dist/routes/integrations/components/connect-forms/ConnectFormHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectFormHeader.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/ConnectFormHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAEvE,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,EAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,2CAkB9D"}

package/dist/routes/integrations/components/connect-forms/ConnectFormHeader.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function ConnectFormHeader(props) {
+    const { provider, status } = props;
+    const Logo = provider.logo;
+    return (_jsxs("header", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex items-center justify-center rounded-lg size-10", style: { backgroundColor: `color-mix(in srgb, ${provider.brandColor} 10%, transparent)` }, children: _jsx(Logo, { className: "size-8 shrink-0", "aria-hidden": true }) }), _jsxs("div", { className: "grid", children: [_jsxs("p", { className: "typography-body-medium text-default-foreground", children: ["Connect ", provider.name] }), _jsx("p", { className: "typography-tiny text-muted-foreground", children: status })] })] }));
+}

package/dist/routes/integrations/components/connect-forms/ConnectWizardShell.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from "react";
+import type { ProviderPresentation } from "#routes/integrations/types";
+export type ConnectWizardShellProps = {
+    provider: ProviderPresentation<string>;
+    status?: string;
+    totalSteps: number;
+    currentStep: number;
+    stepTitle: string;
+    stepDescription?: string;
+    supportingInfo?: ReactNode;
+    onBack?: () => void;
+    onContinue?: () => void;
+    continueLabel?: string;
+    continueDisabled?: boolean;
+    isSubmitting?: boolean;
+    primaryAction?: ReactNode;
+    children: ReactNode;
+};
+export declare function ConnectWizardShell(props: ConnectWizardShellProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ConnectWizardShell.d.ts.map

package/dist/routes/integrations/components/connect-forms/ConnectWizardShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConnectWizardShell.d.ts","sourceRoot":"","sources":["../../../../../src/routes/integrations/components/connect-forms/ConnectWizardShell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAEvE,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,oBAAoB,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA8DhE"}