@uipath/apollo-wind 2.46.0 → 2.47.1

package/dist/components/forms/metadata-form.js

@@ -1,11 +1,12 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { standardSchemaResolver } from "@hookform/resolvers/standard-schema";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { FormProvider, useForm, useFormState } from "react-hook-form";
+import react, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { FormProvider, useForm, useFormState, useWatch } from "react-hook-form";
 import { z } from "zod/v4";
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../ui/accordion.js";
 import { Button } from "../ui/button.js";
 import { ScrollableTabsList, Tabs, TabsContent, TabsTrigger } from "../ui/tabs.js";
+import { deepEqual, get } from "../../lib/index.js";
 import { DataFetcher } from "./data-fetcher.js";
 import { FormFieldRenderer } from "./field-renderer.js";
 import { RulesEngine } from "./rules-engine.js";
@@ -15,20 +16,31 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
     const [currentStep, setCurrentStep] = useState(0);
     const [customComponents, setCustomComponents] = useState({});
     const [isInitialized, setIsInitialized] = useState(false);
-    const zodSchema = useMemo(()=>buildZodSchema(schema), [
+    const schemaRef = useRef(schema);
+    const stableSchema = useMemo(()=>{
+        if (deepEqual(schemaRef.current, schema)) return schemaRef.current;
+        schemaRef.current = schema;
+        return schema;
+    }, [
         schema
     ]);
+    const zodSchema = useMemo(()=>buildZodSchema(stableSchema), [
+        stableSchema
+    ]);
     const form = useForm({
         resolver: standardSchemaResolver(zodSchema),
-        mode: schema.mode || 'onSubmit',
-        reValidateMode: schema.reValidateMode || 'onChange'
+        defaultValues: stableSchema.initialData || {},
+        mode: stableSchema.mode || 'onSubmit',
+        reValidateMode: stableSchema.reValidateMode || 'onChange'
     });
     const { watch, handleSubmit, reset } = form;
-    const valuesRef = useRef({});
-    const watchedValues = watch();
-    valuesRef.current = watchedValues;
+    const valuesRef = useRef(form.getValues());
+    const pluginsRef = useRef(plugins);
+    pluginsRef.current = plugins;
+    const onSubmitRef = useRef(onSubmit);
+    onSubmitRef.current = onSubmit;
     const context = useMemo(()=>({
-            schema,
+            schema: stableSchema,
             form,
             get values () {
                 return valuesRef.current;
@@ -42,7 +54,7 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
             get isDirty () {
                 return form.formState.isDirty;
             },
-            currentStep: schema.steps ? currentStep : void 0,
+            currentStep: stableSchema.steps ? currentStep : void 0,
             evaluateConditions: (conditions)=>RulesEngine.evaluateConditions(conditions, valuesRef.current, 'AND'),
             fetchData: async (source)=>{
                 const result = await DataFetcher.fetch(source, valuesRef.current);
@@ -55,17 +67,31 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
                     }));
             }
         }), [
-        schema,
+        stableSchema,
         form,
         currentStep
     ]);
     const contextRef = useRef(context);
     contextRef.current = context;
+    const isInitializedRef = useRef(isInitialized);
+    isInitializedRef.current = isInitialized;
+    useEffect(()=>{
+        const subscription = watch((value, { name })=>{
+            valuesRef.current = value;
+            if (!name || !isInitializedRef.current) return;
+            pluginsRef.current.forEach((plugin)=>{
+                plugin.onValueChange?.(name, get(value, name), contextRef.current);
+            });
+        });
+        return ()=>subscription.unsubscribe();
+    }, [
+        watch
+    ]);
     useEffect(()=>{
         if (isInitialized) return;
         const initializeForm = async ()=>{
-            if (schema.initialData) {
-                const data = await loadInitialData(schema.initialData, contextRef.current);
+            if (stableSchema.initialData) {
+                const data = await loadInitialData(stableSchema.initialData, contextRef.current);
                 reset(data);
             }
             for (const plugin of plugins)await plugin.onFormInit?.(contextRef.current);
@@ -75,41 +101,30 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
     }, [
         isInitialized
     ]);
-    useEffect(()=>{
-        if (!isInitialized) return;
-        const subscription = watch((value, { name })=>{
-            if (name) {
-                valuesRef.current = value;
-                plugins.forEach((plugin)=>{
-                    plugin.onValueChange?.(name, value[name], contextRef.current);
-                });
-            }
-        });
-        return ()=>subscription.unsubscribe();
-    }, [
-        watch,
-        isInitialized,
-        plugins
+    const handleFormSubmit = useMemo(()=>handleSubmit(async (data)=>{
+            let finalData = data;
+            for (const plugin of pluginsRef.current)if (plugin.onSubmit) finalData = await plugin.onSubmit(finalData, contextRef.current) || finalData;
+            if (onSubmitRef.current) await onSubmitRef.current(finalData);
+        }), [
+        handleSubmit
+    ]);
+    const handleReset = useCallback(()=>reset(), [
+        reset
     ]);
-    const handleFormSubmit = handleSubmit(async (data)=>{
-        let finalData = data;
-        for (const plugin of plugins)if (plugin.onSubmit) finalData = await plugin.onSubmit(finalData, context) || finalData;
-        if (onSubmit) await onSubmit(finalData);
-    });
     const renderContent = ()=>{
-        if (schema.steps) {
+        if (stableSchema.steps) {
             if ('tabs' === stepVariant) return /*#__PURE__*/ jsx(TabbedStepForm, {
-                schema: schema,
+                schema: stableSchema,
                 context: context,
                 customComponents: customComponents,
                 disabled: disabled,
                 sectionVariant: sectionVariant,
                 activeStepId: activeStepId,
                 onActiveStepChange: onActiveStepChange,
-                onReset: ()=>reset()
+                onReset: handleReset
             });
-            return /*#__PURE__*/ jsx(MultiStepForm, {
-                schema: schema,
+            return /*#__PURE__*/ jsx(metadata_form_MultiStepForm, {
+                schema: stableSchema,
                 context: context,
                 currentStep: currentStep,
                 setCurrentStep: setCurrentStep,
@@ -118,8 +133,8 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
                 sectionVariant: sectionVariant
             });
         }
-        return /*#__PURE__*/ jsx(SinglePageForm, {
-            schema: schema,
+        return /*#__PURE__*/ jsx(metadata_form_SinglePageForm, {
+            schema: stableSchema,
             context: context,
             customComponents: customComponents,
             disabled: disabled,
@@ -134,21 +149,36 @@ function MetadataForm({ schema, plugins = DEFAULT_PLUGINS, onSubmit, className,
             autoComplete: autoComplete,
             children: [
                 renderContent(),
-                !schema.steps && /*#__PURE__*/ jsx(FormActions, {
-                    schema: schema,
+                !stableSchema.steps && /*#__PURE__*/ jsx(metadata_form_FormActions, {
+                    schema: stableSchema,
                     context: context,
-                    onReset: ()=>reset()
+                    onReset: handleReset
                 })
             ]
         })
     });
 }
-function SinglePageForm({ schema, context, customComponents, disabled, sectionVariant }) {
+function conditionDependencies(conditionGroups) {
+    const fields = new Set();
+    for (const conditions of conditionGroups)for (const condition of conditions || [])if (condition.when) fields.add(condition.when);
+    return Array.from(fields);
+}
+function useConditionDependencies(context, conditionFields) {
+    useWatch({
+        control: context.form.control,
+        name: conditionFields
+    });
+}
+const metadata_form_SinglePageForm = /*#__PURE__*/ react.memo(function({ schema, context, customComponents, disabled, sectionVariant }) {
     const sections = schema.sections || [];
+    const conditionFields = useMemo(()=>conditionDependencies(schema.sections?.map((section)=>section.conditions) ?? []), [
+        schema
+    ]);
+    useConditionDependencies(context, conditionFields);
     const visibleSections = sections.filter((section)=>!section.conditions || context.evaluateConditions(section.conditions));
     return /*#__PURE__*/ jsx("div", {
         className: 'plain' === sectionVariant ? void 0 : 'space-y-2',
-        children: visibleSections.map((section)=>/*#__PURE__*/ jsx(FormSection, {
+        children: visibleSections.map((section)=>/*#__PURE__*/ jsx(metadata_form_FormSection, {
                 section: section,
                 context: context,
                 customComponents: customComponents,
@@ -156,15 +186,30 @@ function SinglePageForm({ schema, context, customComponents, disabled, sectionVa
                 sectionVariant: sectionVariant
             }, section.id))
     });
-}
-function MultiStepForm({ schema, context, currentStep, setCurrentStep, customComponents, disabled, sectionVariant }) {
+});
+const metadata_form_MultiStepForm = /*#__PURE__*/ react.memo(function({ schema, context, currentStep, setCurrentStep, customComponents, disabled, sectionVariant }) {
     const steps = schema.steps || [];
-    const step = steps[currentStep];
-    if (!step) return null;
-    if (step.conditions && !context.evaluateConditions(step.conditions)) {
-        if (currentStep < steps.length - 1) setCurrentStep(currentStep + 1);
-        return null;
+    const conditionFields = useMemo(()=>conditionDependencies(schema.steps?.map((step)=>step.conditions) ?? []), [
+        schema
+    ]);
+    useConditionDependencies(context, conditionFields);
+    let visibleStepIndex = -1;
+    for(let i = currentStep; i < steps.length; i++){
+        const candidate = steps[i];
+        if (!candidate.conditions || context.evaluateConditions(candidate.conditions)) {
+            visibleStepIndex = i;
+            break;
+        }
     }
+    useEffect(()=>{
+        if (-1 !== visibleStepIndex && visibleStepIndex !== currentStep) setCurrentStep(visibleStepIndex);
+    }, [
+        visibleStepIndex,
+        currentStep,
+        setCurrentStep
+    ]);
+    const step = -1 !== visibleStepIndex ? steps[visibleStepIndex] : void 0;
+    if (!step || visibleStepIndex !== currentStep) return null;
     return /*#__PURE__*/ jsxs("div", {
         className: "space-y-6",
         children: [
@@ -196,7 +241,7 @@ function MultiStepForm({ schema, context, currentStep, setCurrentStep, customCom
             }),
             /*#__PURE__*/ jsx("div", {
                 className: 'plain' === sectionVariant ? void 0 : 'space-y-2',
-                children: step.sections.map((section)=>/*#__PURE__*/ jsx(FormSection, {
+                children: step.sections.map((section)=>/*#__PURE__*/ jsx(metadata_form_FormSection, {
                         section: section,
                         context: context,
                         customComponents: customComponents,
@@ -228,9 +273,16 @@ function MultiStepForm({ schema, context, currentStep, setCurrentStep, customCom
             })
         ]
     });
-}
+});
 function TabbedStepForm({ schema, context, customComponents, disabled, sectionVariant, onReset, activeStepId, onActiveStepChange }) {
     const steps = schema.steps || [];
+    const conditionFields = useMemo(()=>conditionDependencies(schema.steps?.flatMap((step)=>[
+                step.conditions,
+                ...step.sections.map((section)=>section.conditions)
+            ]) ?? []), [
+        schema
+    ]);
+    useConditionDependencies(context, conditionFields);
     const visibleSteps = steps.filter((step)=>{
         if (step.conditions && !context.evaluateConditions(step.conditions)) return false;
         const hasVisibleSection = step.sections.some((section)=>!section.conditions || context.evaluateConditions(section.conditions));
@@ -306,7 +358,7 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
                                 children: step.emptyState
                             }) : /*#__PURE__*/ jsx("div", {
                                 className: 'plain' === sectionVariant ? 'pb-6 [padding-inline:var(--mf-content-inset,0px)]' : 'space-y-2 pb-6 pt-4 [padding-inline:var(--mf-content-inset,0px)]',
-                                children: stepSections.map((section)=>/*#__PURE__*/ jsx(FormSection, {
+                                children: stepSections.map((section)=>/*#__PURE__*/ jsx(metadata_form_FormSection, {
                                         section: section,
                                         context: context,
                                         customComponents: customComponents,
@@ -318,7 +370,7 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
                     })
                 ]
             }),
-            /*#__PURE__*/ jsx(FormActions, {
+            /*#__PURE__*/ jsx(metadata_form_FormActions, {
                 schema: schema,
                 context: context,
                 onReset: onReset
@@ -326,7 +378,7 @@ function TabbedStepForm({ schema, context, customComponents, disabled, sectionVa
         ]
     });
 }
-function FormSection({ section, context, customComponents, disabled, sectionVariant = 'card' }) {
+const metadata_form_FormSection = /*#__PURE__*/ react.memo(function({ section, context, customComponents, disabled, sectionVariant = 'card' }) {
     const gridColumns = context.schema.layout?.columns || 1;
     const gap = context.schema.layout?.gap || 4;
     const isPlain = 'plain' === sectionVariant;
@@ -402,8 +454,15 @@ function FormSection({ section, context, customComponents, disabled, sectionVari
             })
         ]
     });
-}
-function FormActions({ schema, context, onReset }) {
+});
+const metadata_form_FormActions = /*#__PURE__*/ react.memo(function({ schema, context, onReset }) {
+    const { isSubmitting } = useFormState({
+        control: context.form.control
+    });
+    const conditionFields = useMemo(()=>conditionDependencies(schema.actions?.map((action)=>action.conditions) ?? []), [
+        schema
+    ]);
+    useConditionDependencies(context, conditionFields);
     const actions = schema.actions || [
         {
             id: 'submit',
@@ -427,12 +486,12 @@ function FormActions({ schema, context, onReset }) {
             return /*#__PURE__*/ jsx(Button, {
                 type: 'submit' === action.type ? 'submit' : 'button',
                 variant: action.variant || 'default',
-                disabled: action.disabled || 'submit' === action.type && context.isSubmitting,
-                children: action.loading && context.isSubmitting ? 'Loading...' : action.label
+                disabled: action.disabled || 'submit' === action.type && isSubmitting,
+                children: action.loading && isSubmitting ? 'Loading...' : action.label
             }, action.id);
         })
     });
-}
+});
 function buildZodSchema(schema) {
     const shape = {};
     const fields = schema.steps ? schema.steps.flatMap((step)=>step.sections.flatMap((s)=>s.fields)) : schema.sections?.flatMap((s)=>s.fields) || [];

package/dist/components/ui/avatar.d.ts

@@ -2,7 +2,7 @@ import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const avatarVariants: (props?: ({
-    size?: "default" | "lg" | "sm" | null | undefined;
+    size?: "sm" | "lg" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface AvatarProps extends React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>, VariantProps<typeof avatarVariants> {
 }

package/dist/components/ui/badge.d.ts

@@ -1,7 +1,7 @@
 import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "error" | "warning" | "info" | "success" | null | undefined;
+    variant?: "default" | "secondary" | "destructive" | "outline" | "error" | "warning" | "info" | "success" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }

package/dist/components/ui/button.d.ts

@@ -1,8 +1,8 @@
 import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "text" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
-    size?: "default" | "icon" | "lg" | "sm" | "xs" | "2xs" | "3xs" | "4xs" | null | undefined;
+    variant?: "text" | "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
+    size?: "sm" | "lg" | "default" | "xs" | "2xs" | "3xs" | "4xs" | "icon" | null | undefined;
     icon?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/ui/command.d.ts

@@ -2,11 +2,11 @@ import { type DialogProps } from '@radix-ui/react-dialog';
 import * as React from 'react';
 declare const Command: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     label?: string;
     shouldFilter?: boolean;
     filter?: (value: string, search: string, keywords?: string[]) => number;
@@ -22,51 +22,51 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "asChild" | "key" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "type" | "onChange" | "value"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
 declare const CommandList: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     label?: string;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandEmpty: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+} & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandGroup: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "heading" | "value"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "heading"> & {
     heading?: React.ReactNode;
     value?: string;
     forceMount?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+declare const CommandSeparator: React.ForwardRefExoticComponent<Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     alwaysRender?: boolean;
 } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const CommandItem: React.ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
-} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | "key"> & {
+} & Omit<Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
 } & {
     asChild?: boolean;
-}, keyof React.HTMLAttributes<HTMLDivElement> | "asChild" | "key">, "onSelect" | "disabled" | "value"> & {
+}, "key" | "asChild" | keyof React.HTMLAttributes<HTMLDivElement>>, "value" | "disabled" | "onSelect"> & {
     disabled?: boolean;
     onSelect?: (value: string) => void;
     value?: string;