@uipath/apollo-react 4.59.3 → 4.61.0

package/dist/material/components/ap-model-picker/primitives/PickerTrigger.js

@@ -0,0 +1,148 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown";
+import Box from "@mui/material/Box";
+import ButtonBase from "@mui/material/ButtonBase";
+import Typography from "@mui/material/Typography";
+import { Colors } from "@uipath/apollo-core";
+import { useSafeLingui } from "../../../../i18n/index.js";
+import { ModelTagChip } from "../ModelTagChip.js";
+import { deriveModelTags } from "../utils.js";
+const PickerTrigger = ({ id, selected, unknownValue, placeholder = 'Select a model', disabled, open, invalid, tagContext, tagVariants, extra, onClick, triggerRef, hideTagKinds, controlsId, describedById, required, className, 'data-testid': dataTestId })=>{
+    const { _ } = useSafeLingui();
+    const effectiveCtx = tagContext ?? {
+        i18n: {
+            _
+        }
+    };
+    const inlineTags = selected ? deriveModelTags(selected, effectiveCtx).filter((t)=>!hideTagKinds?.includes(t.kind)) : [];
+    const primary = selected ? selected.displayName ?? selected.modelName : null;
+    return /*#__PURE__*/ jsx(Box, {
+        sx: {
+            display: 'flex',
+            flexDirection: 'column',
+            width: '100%'
+        },
+        children: /*#__PURE__*/ jsxs(ButtonBase, {
+            id: id,
+            ref: triggerRef,
+            type: "button",
+            disabled: disabled,
+            onClick: onClick,
+            className: className,
+            "data-testid": dataTestId,
+            "aria-haspopup": "listbox",
+            "aria-expanded": open,
+            "aria-controls": open && controlsId ? controlsId : void 0,
+            "aria-invalid": invalid ? true : void 0,
+            "aria-required": required ? true : void 0,
+            "aria-describedby": describedById,
+            focusRipple: true,
+            sx: {
+                width: '100%',
+                minHeight: 44,
+                px: 1.5,
+                py: 1,
+                display: 'flex',
+                alignItems: 'center',
+                gap: 1.25,
+                justifyContent: 'flex-start',
+                textAlign: 'left',
+                backgroundColor: `var(--color-background-raised, ${Colors.ColorWhite})`,
+                borderRadius: '9px',
+                border: `1.5px solid ${invalid ? `var(--color-error-text, ${Colors.ColorRed700})` : `var(--color-primary, ${Colors.ColorBlue500})`}`,
+                boxShadow: open ? "0 0 0 3px var(--color-primary-focused, rgba(0, 103, 223, 0.15))" : 'none',
+                transition: 'border-color 120ms, box-shadow 120ms',
+                color: `var(--color-foreground, ${Colors.ColorGray850})`,
+                '&:hover': {
+                    borderColor: invalid ? `var(--color-error-text, ${Colors.ColorRed700})` : `var(--color-primary-hover, ${Colors.ColorBlue600})`
+                },
+                '&.Mui-disabled': {
+                    opacity: 0.5
+                }
+            },
+            children: [
+                /*#__PURE__*/ jsx(Box, {
+                    sx: {
+                        flex: 1,
+                        minWidth: 0,
+                        display: 'flex',
+                        alignItems: 'center',
+                        gap: 0.75,
+                        flexWrap: 'nowrap'
+                    },
+                    children: selected ? /*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ jsx(Typography, {
+                                variant: "body1",
+                                sx: {
+                                    fontWeight: 600,
+                                    fontSize: 14,
+                                    whiteSpace: 'nowrap',
+                                    overflow: 'hidden',
+                                    textOverflow: 'ellipsis',
+                                    maxWidth: '100%',
+                                    color: `var(--color-foreground, ${Colors.ColorGray850})`
+                                },
+                                children: primary
+                            }),
+                            inlineTags.map((t)=>/*#__PURE__*/ jsx(Box, {
+                                    sx: {
+                                        flexShrink: 0
+                                    },
+                                    children: /*#__PURE__*/ jsx(ModelTagChip, {
+                                        tag: t,
+                                        variants: tagVariants
+                                    })
+                                }, `${t.kind}-${t.label}`))
+                        ]
+                    }) : unknownValue ? /*#__PURE__*/ jsx(Typography, {
+                        variant: "body1",
+                        sx: {
+                            fontWeight: 600,
+                            fontSize: 14,
+                            whiteSpace: 'nowrap',
+                            overflow: 'hidden',
+                            textOverflow: 'ellipsis',
+                            maxWidth: '100%',
+                            color: `var(--color-error-text, ${Colors.ColorRed700})`
+                        },
+                        title: _({
+                            id: 'modelPicker.trigger.unknownValueTooltip',
+                            message: '"{value}" is no longer available in this catalog. Pick a replacement to ensure your workflow continues to run.',
+                            values: {
+                                value: unknownValue
+                            }
+                        }),
+                        children: unknownValue
+                    }) : /*#__PURE__*/ jsx(Typography, {
+                        variant: "body1",
+                        sx: {
+                            color: `var(--color-foreground-disable, ${Colors.ColorGray500})`,
+                            fontSize: 14
+                        },
+                        children: placeholder
+                    })
+                }),
+                extra && /*#__PURE__*/ jsx(Box, {
+                    sx: {
+                        flexShrink: 0,
+                        display: 'flex',
+                        alignItems: 'center'
+                    },
+                    onClick: (e)=>e.stopPropagation(),
+                    children: extra
+                }),
+                /*#__PURE__*/ jsx(KeyboardArrowDown, {
+                    sx: {
+                        color: `var(--color-foreground-de-emp, ${Colors.ColorGray550})`,
+                        transition: 'transform 150ms',
+                        transform: open ? 'rotate(180deg)' : 'rotate(0)',
+                        flexShrink: 0,
+                        fontSize: 18
+                    }
+                })
+            ]
+        })
+    });
+};
+export { PickerTrigger };

package/dist/material/components/ap-model-picker/types.cjs

@@ -0,0 +1,18 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/material/components/ap-model-picker/types.d.ts

@@ -0,0 +1,77 @@
+export type ModelVendor = 'OpenAi' | 'AzureOpenAi' | 'AnthropicClaude' | 'AwsBedrock' | 'VertexAi' | 'Custom' | string;
+export type ModelSubscriptionType = 'UiPathOwned' | 'BYOMReplacedLikeForLike' | 'BYOMReplacedAlternative' | 'BYOMAdded' | string;
+export type ModelGeography = 'EU' | 'CA' | 'US' | 'SI' | 'JA' | 'AU' | 'IN' | 'UK' | 'CH' | 'UAE' | 'SK' | 'GLOBAL' | string;
+export interface DeprecationDetails {
+    usageEndDate?: string;
+    replacedBy?: string;
+}
+export interface ByomDetails {
+    availableOperationCodes?: string[];
+    integrationServiceConnectionId?: string;
+    defaultModel?: string;
+    customFieldMappings?: Record<string, string> | null;
+    productLlmConfigurationId?: string;
+}
+export interface ModelCostDetails {
+    inputTokenCost?: number;
+    outputTokenCost?: number;
+    currency?: string;
+}
+export interface ModelDetails {
+    maxOutputTokens?: number;
+    contextWindowTokens?: number;
+    costDetails?: ModelCostDetails;
+    shouldUseMaxCompletionTokens?: boolean;
+    shouldSkipParallelToolCalls?: boolean;
+    shouldSkipTemperature?: boolean;
+    shouldSkipTopP?: boolean;
+    shouldUseResponseApi?: boolean;
+}
+export interface RoutingDetails {
+    geography?: ModelGeography;
+    model?: string;
+}
+export interface DiscoveryModel {
+    modelId: string;
+    modelName: string;
+    displayName?: string;
+    effectiveModel?: string | null;
+    vendor: ModelVendor;
+    modelFamily?: string;
+    apiFlavor?: string;
+    modelSubscriptionType?: ModelSubscriptionType;
+    isRecommended?: boolean;
+    isPreview?: boolean;
+    deprecationDetails?: DeprecationDetails | null;
+    byomDetails?: ByomDetails | null;
+    modelDetails?: ModelDetails;
+    routingDetails?: RoutingDetails | null;
+    byoConnectionLabel?: string;
+}
+export type ModelTagKind = 'recommended' | 'preview' | 'deprecating' | 'substituted' | 'custom' | 'out-of-region' | 'thinking' | 'cost-basic' | 'cost-standard' | 'cost-premium' | string;
+export type CostTier = 'basic' | 'standard' | 'premium';
+export interface ModelTag {
+    kind: ModelTagKind;
+    label: string;
+    tooltip?: string;
+    variant?: string;
+}
+export interface ModelGroup {
+    key: string;
+    label: string;
+    hint?: string;
+    models: DiscoveryModel[];
+}
+export interface DiscoveryRequestContext {
+    token: string;
+    baseUrl?: string;
+    accountId: string;
+    tenantId: string;
+    requestingProduct: string;
+    requestingFeature: string;
+    operationCode?: string;
+    folderKey?: string;
+    fromDedicatedCloud?: boolean;
+    onlyAvailableModels?: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/material/components/ap-model-picker/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/material/components/ap-model-picker/types.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,WAAW,GACnB,QAAQ,GACR,aAAa,GACb,iBAAiB,GACjB,YAAY,GACZ,UAAU,GACV,QAAQ,GACR,MAAM,CAAC;AAEX,MAAM,MAAM,qBAAqB,GAC7B,aAAa,GACb,yBAAyB,GACzB,yBAAyB,GACzB,WAAW,GACX,MAAM,CAAC;AAEX,MAAM,MAAM,cAAc,GACtB,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,KAAK,GACL,IAAI,GACJ,QAAQ,GACR,MAAM,CAAC;AAEX,MAAM,WAAW,kBAAkB;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,uBAAuB,CAAC,EAAE,MAAM,EAAE,CAAC;IACnC,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC;IAQpD,yBAAyB,CAAC,EAAE,MAAM,CAAC;CACpC;AAED,MAAM,WAAW,gBAAgB;IAC/B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAY;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,MAAM,WAAW,cAAc;IAC7B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IASlB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,MAAM,EAAE,WAAW,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;IAS9C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kBAAkB,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACjC,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,cAAc,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAKvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAYD,MAAM,MAAM,YAAY,GACpB,aAAa,GACb,SAAS,GACT,aAAa,GACb,aAAa,GACb,QAAQ,GACR,eAAe,GACf,UAAU,GACV,YAAY,GACZ,eAAe,GACf,cAAc,GACd,MAAM,CAAC;AASX,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;AAExD,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO,CAAC,EAAE,MAAM,CAAC;IAQjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAMD,MAAM,WAAW,UAAU;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,cAAc,EAAE,CAAC;CAC1B;AAOD,MAAM,WAAW,uBAAuB;IAEtC,KAAK,EAAE,MAAM,CAAC;IAEd,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,SAAS,EAAE,MAAM,CAAC;IAElB,QAAQ,EAAE,MAAM,CAAC;IAEjB,iBAAiB,EAAE,MAAM,CAAC;IAE1B,iBAAiB,EAAE,MAAM,CAAC;IAE1B,aAAa,CAAC,EAAE,MAAM,CAAC;IAKvB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B"}

package/dist/material/components/ap-model-picker/useDiscoveryModels.cjs

@@ -0,0 +1,113 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useDiscoveryModels: ()=>useDiscoveryModels
+});
+const external_react_namespaceObject = require("react");
+function useDiscoveryModels(ctx) {
+    const [models, setModels] = (0, external_react_namespaceObject.useState)([]);
+    const [loading, setLoading] = (0, external_react_namespaceObject.useState)(false);
+    const [error, setError] = (0, external_react_namespaceObject.useState)(null);
+    const abortRef = (0, external_react_namespaceObject.useRef)(null);
+    const fetchModels = (0, external_react_namespaceObject.useCallback)(async ()=>{
+        if (!ctx) return;
+        abortRef.current?.abort();
+        const ctrl = new AbortController();
+        abortRef.current = ctrl;
+        setLoading(true);
+        setError(null);
+        const base = (ctx.baseUrl ?? '').replace(/\/$/, '');
+        const params = new URLSearchParams();
+        if (false === ctx.onlyAvailableModels) params.set('onlyAvailableModels', 'false');
+        const qs = params.toString();
+        const url = `${base}/api/discovery${qs ? `?${qs}` : ''}`;
+        const headers = {
+            Authorization: `Bearer ${ctx.token}`,
+            Accept: 'application/json',
+            'X-UiPath-Internal-AccountId': ctx.accountId,
+            'X-UiPath-Internal-TenantId': ctx.tenantId,
+            'X-UiPath-LlmGateway-RequestingProduct': ctx.requestingProduct,
+            'X-UiPath-LlmGateway-RequestingFeature': ctx.requestingFeature
+        };
+        if (ctx.operationCode) headers['X-UiPath-LlmGateway-OperationCode'] = ctx.operationCode;
+        if (ctx.folderKey) headers['X-UiPath-FolderKey'] = ctx.folderKey;
+        if (ctx.fromDedicatedCloud) headers['X-UiPath-LlmGateway-FromDedicatedCloud'] = 'true';
+        try {
+            const res = await fetch(url, {
+                headers,
+                signal: ctrl.signal
+            });
+            if (!res.ok) throw new Error(`Discovery API ${res.status} ${res.statusText}`);
+            const data = await res.json();
+            const list = Array.isArray(data) ? data : data.models ?? [];
+            if (!ctrl.signal.aborted) setModels(normalizeKeys(list));
+        } catch (err) {
+            if (err?.name === 'AbortError') return;
+            if (!ctrl.signal.aborted) setError(err instanceof Error ? err : new Error(String(err)));
+        } finally{
+            if (!ctrl.signal.aborted) setLoading(false);
+        }
+    }, [
+        ctx
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!ctx) {
+            abortRef.current?.abort();
+            setModels([]);
+            setLoading(false);
+            setError(null);
+            return;
+        }
+        fetchModels();
+        return ()=>abortRef.current?.abort();
+    }, [
+        ctx,
+        fetchModels
+    ]);
+    return {
+        models,
+        loading,
+        error,
+        refetch: fetchModels
+    };
+}
+function camelizeDeep(value) {
+    if (Array.isArray(value)) return value.map(camelizeDeep);
+    if (!value || 'object' != typeof value) return value;
+    const camel = Object.create(null);
+    for (const [k, v] of Object.entries(value))camel[k.charAt(0).toLowerCase() + k.slice(1)] = camelizeDeep(v);
+    return camel;
+}
+function normalizeKeys(list) {
+    return list.map((raw)=>camelizeDeep(raw));
+}
+exports.useDiscoveryModels = __webpack_exports__.useDiscoveryModels;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useDiscoveryModels"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/material/components/ap-model-picker/useDiscoveryModels.d.ts

@@ -0,0 +1,9 @@
+import type { DiscoveryModel, DiscoveryRequestContext } from './types';
+export interface UseDiscoveryModelsResult {
+    models: DiscoveryModel[];
+    loading: boolean;
+    error: Error | null;
+    refetch: () => void;
+}
+export declare function useDiscoveryModels(ctx: DiscoveryRequestContext | null): UseDiscoveryModelsResult;
+//# sourceMappingURL=useDiscoveryModels.d.ts.map

package/dist/material/components/ap-model-picker/useDiscoveryModels.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDiscoveryModels.d.ts","sourceRoot":"","sources":["../../../../src/material/components/ap-model-picker/useDiscoveryModels.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAEvE,MAAM,WAAW,wBAAwB;IACvC,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAWD,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,uBAAuB,GAAG,IAAI,GAAG,wBAAwB,CA4EhG"}

package/dist/material/components/ap-model-picker/useDiscoveryModels.js

@@ -0,0 +1,79 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+function useDiscoveryModels(ctx) {
+    const [models, setModels] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(null);
+    const abortRef = useRef(null);
+    const fetchModels = useCallback(async ()=>{
+        if (!ctx) return;
+        abortRef.current?.abort();
+        const ctrl = new AbortController();
+        abortRef.current = ctrl;
+        setLoading(true);
+        setError(null);
+        const base = (ctx.baseUrl ?? '').replace(/\/$/, '');
+        const params = new URLSearchParams();
+        if (false === ctx.onlyAvailableModels) params.set('onlyAvailableModels', 'false');
+        const qs = params.toString();
+        const url = `${base}/api/discovery${qs ? `?${qs}` : ''}`;
+        const headers = {
+            Authorization: `Bearer ${ctx.token}`,
+            Accept: 'application/json',
+            'X-UiPath-Internal-AccountId': ctx.accountId,
+            'X-UiPath-Internal-TenantId': ctx.tenantId,
+            'X-UiPath-LlmGateway-RequestingProduct': ctx.requestingProduct,
+            'X-UiPath-LlmGateway-RequestingFeature': ctx.requestingFeature
+        };
+        if (ctx.operationCode) headers['X-UiPath-LlmGateway-OperationCode'] = ctx.operationCode;
+        if (ctx.folderKey) headers['X-UiPath-FolderKey'] = ctx.folderKey;
+        if (ctx.fromDedicatedCloud) headers['X-UiPath-LlmGateway-FromDedicatedCloud'] = 'true';
+        try {
+            const res = await fetch(url, {
+                headers,
+                signal: ctrl.signal
+            });
+            if (!res.ok) throw new Error(`Discovery API ${res.status} ${res.statusText}`);
+            const data = await res.json();
+            const list = Array.isArray(data) ? data : data.models ?? [];
+            if (!ctrl.signal.aborted) setModels(normalizeKeys(list));
+        } catch (err) {
+            if (err?.name === 'AbortError') return;
+            if (!ctrl.signal.aborted) setError(err instanceof Error ? err : new Error(String(err)));
+        } finally{
+            if (!ctrl.signal.aborted) setLoading(false);
+        }
+    }, [
+        ctx
+    ]);
+    useEffect(()=>{
+        if (!ctx) {
+            abortRef.current?.abort();
+            setModels([]);
+            setLoading(false);
+            setError(null);
+            return;
+        }
+        fetchModels();
+        return ()=>abortRef.current?.abort();
+    }, [
+        ctx,
+        fetchModels
+    ]);
+    return {
+        models,
+        loading,
+        error,
+        refetch: fetchModels
+    };
+}
+function camelizeDeep(value) {
+    if (Array.isArray(value)) return value.map(camelizeDeep);
+    if (!value || 'object' != typeof value) return value;
+    const camel = Object.create(null);
+    for (const [k, v] of Object.entries(value))camel[k.charAt(0).toLowerCase() + k.slice(1)] = camelizeDeep(v);
+    return camel;
+}
+function normalizeKeys(list) {
+    return list.map((raw)=>camelizeDeep(raw));
+}
+export { useDiscoveryModels };

package/dist/material/components/ap-model-picker/useModelPickerState.cjs

@@ -0,0 +1,175 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useModelPickerState: ()=>useModelPickerState
+});
+const external_react_namespaceObject = require("react");
+const external_utils_cjs_namespaceObject = require("./utils.cjs");
+function useModelPickerState(opts) {
+    const { models, value, onChange, groupBy: initialGroupBy = "subscription", recommendedModelIds, previewModelIds, filter, initiallyCollapsedGroups, i18n } = opts;
+    const reactId = (0, external_react_namespaceObject.useId)();
+    const id = `apollo-model-picker-${reactId}`;
+    const triggerRef = (0, external_react_namespaceObject.useRef)(null);
+    const searchRef = (0, external_react_namespaceObject.useRef)(null);
+    const [open, setOpen] = (0, external_react_namespaceObject.useState)(false);
+    const [query, setQuery] = (0, external_react_namespaceObject.useState)('');
+    const [activeIndex, setActiveIndex] = (0, external_react_namespaceObject.useState)(0);
+    const [groupBy, setGroupBy] = (0, external_react_namespaceObject.useState)(initialGroupBy);
+    const [collapsedSet, setCollapsedSet] = (0, external_react_namespaceObject.useState)(()=>new Set(initiallyCollapsedGroups ?? []));
+    const visibleModels = (0, external_react_namespaceObject.useMemo)(()=>filter ? models.filter(filter) : models, [
+        models,
+        filter
+    ]);
+    const annotated = (0, external_react_namespaceObject.useMemo)(()=>{
+        const groups = (0, external_utils_cjs_namespaceObject.groupModels)(visibleModels, groupBy, {
+            recommendedModelIds,
+            previewModelIds,
+            i18n
+        });
+        return groups.flatMap((g)=>g.models.map((m)=>({
+                    ...m,
+                    groupKey: g.key,
+                    groupLabel: g.label
+                })));
+    }, [
+        visibleModels,
+        groupBy,
+        recommendedModelIds,
+        previewModelIds,
+        i18n
+    ]);
+    const filtered = (0, external_react_namespaceObject.useMemo)(()=>(0, external_utils_cjs_namespaceObject.filterModels)(annotated, query), [
+        annotated,
+        query
+    ]);
+    const groupCounts = (0, external_react_namespaceObject.useMemo)(()=>{
+        const out = {};
+        for (const m of annotated)out[m.groupKey] = (out[m.groupKey] ?? 0) + 1;
+        return out;
+    }, [
+        annotated
+    ]);
+    const selected = (0, external_react_namespaceObject.useMemo)(()=>annotated.find((m)=>m.modelId === value) ?? models.find((m)=>m.modelId === value) ?? null, [
+        annotated,
+        models,
+        value
+    ]);
+    const unknownValue = (0, external_react_namespaceObject.useMemo)(()=>{
+        if (!value) return null;
+        if (selected) return null;
+        if (0 === models.length) return null;
+        return value;
+    }, [
+        models,
+        selected,
+        value
+    ]);
+    const collapsedGroups = (0, external_react_namespaceObject.useMemo)(()=>query.trim() ? new Set() : collapsedSet, [
+        query,
+        collapsedSet
+    ]);
+    const toggleGroup = (0, external_react_namespaceObject.useCallback)((groupKey)=>{
+        setCollapsedSet((prev)=>{
+            const next = new Set(prev);
+            if (next.has(groupKey)) next.delete(groupKey);
+            else next.add(groupKey);
+            return next;
+        });
+    }, []);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (open) {
+            const sel = filtered.findIndex((m)=>m.modelId === value);
+            setActiveIndex(sel >= 0 ? sel : 0);
+            requestAnimationFrame(()=>searchRef.current?.focus());
+        } else setQuery('');
+    }, [
+        open
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (activeIndex >= filtered.length) setActiveIndex(0);
+    }, [
+        filtered.length,
+        activeIndex
+    ]);
+    const choose = (0, external_react_namespaceObject.useCallback)((m)=>{
+        onChange?.(m);
+        setOpen(false);
+        triggerRef.current?.focus();
+    }, [
+        onChange
+    ]);
+    const onSearchKeyDown = (0, external_react_namespaceObject.useCallback)((e)=>{
+        if ('ArrowDown' === e.key) {
+            e.preventDefault();
+            setActiveIndex((i)=>Math.min(i + 1, Math.max(filtered.length - 1, 0)));
+        } else if ('ArrowUp' === e.key) {
+            e.preventDefault();
+            setActiveIndex((i)=>Math.max(i - 1, 0));
+        } else if ('Enter' === e.key) {
+            e.preventDefault();
+            const m = filtered[activeIndex];
+            if (m) choose(m);
+        } else if ('Escape' === e.key) {
+            e.preventDefault();
+            setOpen(false);
+            triggerRef.current?.focus();
+        }
+    }, [
+        filtered,
+        activeIndex,
+        choose
+    ]);
+    return {
+        open,
+        setOpen,
+        query,
+        setQuery,
+        groupBy,
+        setGroupBy,
+        visibleModels,
+        annotated,
+        filtered,
+        groupCounts,
+        collapsedGroups,
+        toggleGroup,
+        selected,
+        unknownValue,
+        activeIndex,
+        setActiveIndex,
+        onSearchKeyDown,
+        choose,
+        id,
+        triggerRef,
+        searchRef
+    };
+}
+exports.useModelPickerState = __webpack_exports__.useModelPickerState;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useModelPickerState"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/material/components/ap-model-picker/useModelPickerState.d.ts

@@ -0,0 +1,40 @@
+import type { PickerTranslator } from './i18n';
+import type { AnnotatedModel } from './primitives/OptionList';
+import type { DiscoveryModel } from './types';
+import { type GroupStrategy } from './utils';
+export interface UseModelPickerStateOptions {
+    models: DiscoveryModel[];
+    value?: string | null;
+    onChange?: (model: DiscoveryModel) => void;
+    groupBy?: GroupStrategy;
+    recommendedModelIds?: readonly string[];
+    previewModelIds?: readonly string[];
+    filter?: (model: DiscoveryModel) => boolean;
+    initiallyCollapsedGroups?: readonly string[];
+    i18n?: PickerTranslator;
+}
+export interface UseModelPickerStateResult {
+    open: boolean;
+    setOpen: (next: boolean) => void;
+    query: string;
+    setQuery: (next: string) => void;
+    groupBy: GroupStrategy;
+    setGroupBy: (next: GroupStrategy) => void;
+    visibleModels: DiscoveryModel[];
+    annotated: AnnotatedModel[];
+    filtered: AnnotatedModel[];
+    groupCounts: Record<string, number>;
+    collapsedGroups: ReadonlySet<string>;
+    toggleGroup: (groupKey: string) => void;
+    selected: DiscoveryModel | null;
+    unknownValue: string | null;
+    activeIndex: number;
+    setActiveIndex: (i: number) => void;
+    onSearchKeyDown: (e: React.KeyboardEvent) => void;
+    choose: (m: DiscoveryModel) => void;
+    id: string;
+    triggerRef: React.RefObject<HTMLButtonElement | null>;
+    searchRef: React.RefObject<HTMLInputElement | null>;
+}
+export declare function useModelPickerState(opts: UseModelPickerStateOptions): UseModelPickerStateResult;
+//# sourceMappingURL=useModelPickerState.d.ts.map