@uipath/apollo-wind 2.60.1 → 2.61.0

package/dist/components/forms/mode-aware-field.js

@@ -0,0 +1,555 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, useCallback, useMemo, useRef, useState } from "react";
+import { Controller, useFormContext } from "react-hook-form";
+import { Badge } from "../ui/badge.js";
+import { FieldMenu } from "../ui/field-addons/field-menu.js";
+import { ValueModeIndicator } from "../ui/field-addons/value-mode-indicator.js";
+import { ValueModeSwitchDialog } from "../ui/field-addons/value-mode-switch-dialog.js";
+import { FormField, FormFieldDescription, FormFieldHeader } from "../ui/form-field.js";
+import { Input } from "../ui/input.js";
+import { InputGroup, InputGroupAddon } from "../ui/input-group.js";
+import { PromptValueControl } from "../ui/prompt-value-control.js";
+import { VariableValueControl } from "../ui/variable-value-control.js";
+import { DEFAULT_FIELD_ACTION_REGISTRY, resolveFieldActions, resolveVariables } from "./field-actions.js";
+import { FIELD_CONTROL_GEOMETRY, FieldControl } from "./field-control.js";
+import { DEFAULT_METADATA_FORM_STRINGS } from "./form-strings.js";
+import { isEmptyFieldValue } from "./validation-converter.js";
+import { DEFAULT_VALUE_MODE_REGISTRY, codecContext, convertValue, isDecodedEmpty, isFieldControlRegistration, resolveCodec, resolveModeOptions } from "./value-modes.js";
+function ModeAwareField(props) {
+    const { control } = useFormContext();
+    return /*#__PURE__*/ jsx(Controller, {
+        name: props.field.name,
+        control: control,
+        defaultValue: props.field.defaultValue,
+        render: ({ field: formField, fieldState: { error } })=>/*#__PURE__*/ jsx(FieldAnatomy, {
+                ...props,
+                formField: formField,
+                error: error?.message
+            })
+    });
+}
+const BUILT_IN_MODE_CONTROLS = {
+    variable: {
+        component: VariableValueControl
+    },
+    prompt: {
+        component: PromptValueControl,
+        layout: 'grow',
+        variant: 'agent',
+        insertable: true
+    }
+};
+function unfittedGeometry(field) {
+    const labelledBy = [
+        'radio',
+        'slider',
+        'datetime',
+        'string-list'
+    ].includes(field.type);
+    return {
+        layout: 'row',
+        variant: 'outline',
+        labelTarget: labelledBy ? 'labelledby' : 'control',
+        insertable: false
+    };
+}
+function registrationGeometry(registration) {
+    return {
+        layout: registration.layout ?? 'row',
+        variant: registration.variant ?? 'default',
+        labelTarget: registration.labelTarget ?? 'control',
+        insertable: registration.insertable ?? false
+    };
+}
+const TEXT_GEOMETRY = {
+    layout: 'row',
+    variant: 'default',
+    labelTarget: 'control',
+    insertable: true
+};
+function FieldAnatomy({ field, context, customComponents, disabled, required, options, formField, error }) {
+    const form = useFormContext();
+    const registry = context.valueModes ?? DEFAULT_VALUE_MODE_REGISTRY;
+    const actionRegistry = context.fieldActions ?? DEFAULT_FIELD_ACTION_REGISTRY;
+    const strings = context.strings ?? DEFAULT_METADATA_FORM_STRINGS;
+    const config = field.valueModes;
+    const { name } = field;
+    const errorId = `${name}-error`;
+    const labelId = `${name}-label`;
+    const formVariables = context.variables;
+    const variables = useCallback(()=>resolveVariables(formVariables, field), [
+        formVariables,
+        field
+    ]);
+    const { value } = formField;
+    const codec = config ? resolveCodec(registry.codecs, config) : void 0;
+    const codecCtx = useMemo(()=>config && codecContext(field, config), [
+        field,
+        config
+    ]);
+    const decoded = codec && codecCtx ? codec.decode(value, codecCtx) : void 0;
+    const empty = codec && codecCtx && decoded ? isDecodedEmpty(codec, decoded, codecCtx) : isEmptyFieldValue(value);
+    const [held, setHeld] = useState();
+    const heldMode = held && empty && Object.is(held.stored, value) ? held.mode : void 0;
+    const activeMode = config && decoded ? activeModeOf(config, decoded.mode, empty && isEmptyFieldValue(value), heldMode) : 'literal';
+    const inner = decoded ? decoded.mode === activeMode ? decoded.value : void 0 : value;
+    const [pending, setPending] = useState();
+    const groupRef = useRef(null);
+    const controlRef = useRef(null);
+    const latest = useRef({
+        value,
+        inner,
+        empty,
+        activeMode,
+        decoded,
+        disabled,
+        formField,
+        insertable: false
+    });
+    latest.current = {
+        ...latest.current,
+        value,
+        inner,
+        empty,
+        activeMode,
+        decoded,
+        disabled,
+        formField
+    };
+    const encode = (mode, value)=>codec && codecCtx ? codec.encode(mode, value, codecCtx, latest.current.value) : value;
+    const write = (next, via)=>{
+        if ('change' === via) latest.current.formField.onChange(next);
+        else {
+            const liveMode = 'onChange' === context.schema.mode || 'all' === context.schema.mode;
+            form.setValue(name, next, {
+                shouldDirty: true,
+                shouldValidate: liveMode || form.formState.isSubmitted
+            });
+        }
+        return next;
+    };
+    const commit = (mode, value, via)=>{
+        const stored = write(value, via);
+        if (codec && codecCtx) {
+            const written = codec.decode(stored, codecCtx);
+            setHeld(isDecodedEmpty(codec, written, codecCtx) ? {
+                mode,
+                stored
+            } : void 0);
+        }
+    };
+    const writeInner = (next, via = 'change')=>{
+        const mode = latest.current.activeMode;
+        if (config) commit(mode, encode(mode, next), via);
+        else write(next, via);
+    };
+    const setModeValue = (mode, value, options)=>{
+        if (options?.confirm && !latest.current.empty) setPending({
+            ...options.confirm,
+            to: mode,
+            value
+        });
+        else commit(mode, encode(mode, value), 'set');
+    };
+    const handleSelect = (to)=>{
+        const current = latest.current;
+        if (!codec || !codecCtx || !current.decoded || to === current.activeMode) return;
+        const result = convertValue(codec, {
+            ...current.decoded,
+            mode: current.activeMode
+        }, to, codecCtx);
+        if ('ok' === result.kind) commit(to, encode(to, result.value), 'set');
+        else setPending({
+            to,
+            value: result.value,
+            title: result.title,
+            description: result.description
+        });
+    };
+    const writeInnerRef = useRef(writeInner);
+    writeInnerRef.current = writeInner;
+    const domHandle = useMemo(()=>({
+            focus: ()=>controlElement(groupRef.current, name)?.focus(),
+            insertText: (text)=>{
+                const element = controlElement(groupRef.current, name);
+                if (!(element instanceof HTMLInputElement || element instanceof HTMLTextAreaElement)) {
+                    const current = latest.current.inner;
+                    writeInnerRef.current(`${'string' == typeof current ? current : ''}${text}`, 'set');
+                    return;
+                }
+                const selectable = null !== element.selectionStart;
+                const start = element.selectionStart ?? element.value.length;
+                const end = element.selectionEnd ?? start;
+                writeInnerRef.current(element.value.slice(0, start) + text + element.value.slice(end), 'set');
+                const caret = start + text.length;
+                setTimeout(()=>{
+                    element.focus();
+                    if (selectable) element.setSelectionRange(caret, caret);
+                });
+            }
+        }), [
+        name
+    ]);
+    const ctx = useActionContext({
+        field,
+        name,
+        form,
+        modeAware: !!config,
+        latest,
+        strings,
+        variables,
+        control: ()=>{
+            const own = controlRef.current;
+            if (!own) return domHandle;
+            return own.insertText ? own : {
+                ...own,
+                insertText: domHandle.insertText
+            };
+        },
+        commit,
+        write,
+        encode,
+        setModeValue,
+        codec,
+        codecCtx
+    });
+    const binding = {
+        value: controlValue(field, inner),
+        onChange: (next)=>writeInner(next),
+        onBlur: formField.onBlur,
+        name: formField.name,
+        ref: formField.ref
+    };
+    const resolved = resolveControl({
+        field,
+        config,
+        mode: activeMode,
+        registry,
+        strings,
+        customComponents,
+        binding,
+        controlRef,
+        labelId,
+        options,
+        disabled,
+        required,
+        error,
+        errorId,
+        valueModeProps: ()=>({
+                value: inner,
+                onChange: (next)=>writeInner(next),
+                onBlur: formField.onBlur,
+                name,
+                field,
+                disabled,
+                required,
+                error,
+                mode: activeMode,
+                onModeValueChange: setModeValue,
+                requestModeSwitch: handleSelect,
+                controlRef,
+                inputRef: formField.ref,
+                id: name,
+                labelId,
+                invalid: !!error,
+                placeholder: field.placeholder,
+                variables,
+                strings: strings.valueModes,
+                controlProps: {
+                    'data-slot': 'input-group-control',
+                    'aria-invalid': error ? true : void 0,
+                    'aria-describedby': error ? errorId : void 0,
+                    'aria-errormessage': error ? errorId : void 0
+                }
+            })
+    });
+    latest.current.insertable = resolved.geometry.insertable;
+    const { header, menu } = resolveFieldActions(field, actionRegistry);
+    const modeOptions = config ? resolveModeOptions(field, config, registry, strings.valueModes) : [];
+    const switchable = !!config && (config.switchable ?? config.modes.length > 1);
+    const menuItems = menu.map((action)=>({
+            id: action.id,
+            label: 'function' == typeof action.label ? action.label(ctx) : action.label,
+            icon: action.icon,
+            destructive: action.destructive,
+            disabled: action.disabled?.(ctx) ?? false,
+            onSelect: ()=>action.onSelect(ctx)
+        }));
+    const indicator = config && false !== config.indicator && 'literal' !== activeMode ? registry.definitions[activeMode]?.indicator ?? ('expression' === activeMode ? /*#__PURE__*/ jsx(ValueModeIndicator, {
+        mode: "expression",
+        disabled: disabled,
+        strings: strings.valueModes
+    }) : null) : null;
+    const headerActions = header.map((action)=>/*#__PURE__*/ jsx(Fragment, {
+            children: action.render(ctx)
+        }, action.id));
+    return /*#__PURE__*/ jsxs(FormField, {
+        children: [
+            /*#__PURE__*/ jsx(FormFieldHeader, {
+                label: field.label,
+                labelId: labelId,
+                htmlFor: 'control' === resolved.geometry.labelTarget ? name : void 0,
+                required: required,
+                tooltip: field.tooltip,
+                tooltipAriaLabel: field.tooltipAriaLabel,
+                badge: field.badge ? /*#__PURE__*/ jsx(Badge, {
+                    variant: "secondary",
+                    children: field.badge
+                }) : void 0,
+                actions: headerActions.length > 0 ? headerActions : void 0
+            }),
+            /*#__PURE__*/ jsxs(InputGroup, {
+                ref: groupRef,
+                layout: resolved.geometry.layout,
+                variant: resolved.geometry.variant,
+                disabled: disabled,
+                error: error,
+                errorId: errorId,
+                "data-value-mode-control": 'production' === process.env.NODE_ENV ? void 0 : resolved.source,
+                children: [
+                    indicator && /*#__PURE__*/ jsx(InputGroupAddon, {
+                        align: "inline-start",
+                        children: indicator
+                    }),
+                    resolved.node,
+                    (switchable || menuItems.length > 0) && /*#__PURE__*/ jsx(InputGroupAddon, {
+                        align: "inline-end",
+                        children: /*#__PURE__*/ jsx(FieldMenu, {
+                            mode: activeMode,
+                            onSelect: handleSelect,
+                            modes: modeOptions,
+                            actions: menuItems,
+                            modesDisabled: !switchable,
+                            disabled: disabled,
+                            strings: strings.valueModes
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx(FormFieldDescription, {
+                children: field.description
+            }),
+            /*#__PURE__*/ jsx(ValueModeSwitchDialog, {
+                open: !!pending,
+                title: pending?.title,
+                description: pending?.description,
+                confirmLabel: pending?.confirmLabel,
+                strings: strings.valueModes,
+                onCancel: ()=>setPending(void 0),
+                onConfirm: ()=>{
+                    if (pending && !latest.current.disabled) commit(pending.to, encode(pending.to, pending.value), 'set');
+                    setPending(void 0);
+                }
+            })
+        ]
+    });
+}
+function controlValue(field, value) {
+    if (null != value) return value;
+    switch(field.type){
+        case 'text':
+        case 'email':
+        case 'textarea':
+        case 'number':
+        case 'select':
+        case 'radio':
+            return '';
+        case 'multiselect':
+        case 'string-list':
+            return [];
+        default:
+            return;
+    }
+}
+function activeModeOf(config, decodedMode, unset, heldMode) {
+    if (heldMode) return heldMode;
+    if (unset) return config.defaultMode ?? config.modes[0] ?? 'literal';
+    return decodedMode;
+}
+function controlElement(group, id) {
+    if (!group) return null;
+    for (const element of group.querySelectorAll('[id]'))if (element.id === id) return element;
+    return null;
+}
+function useActionContext(input) {
+    const inputRef = useRef(input);
+    inputRef.current = input;
+    const { field, name, form, modeAware } = input;
+    return useMemo(()=>{
+        const current = ()=>inputRef.current;
+        const setStored = (stored)=>{
+            const { codec, codecCtx, commit, write } = current();
+            if (codec && codecCtx) commit(codec.decode(stored, codecCtx).mode, stored, 'set');
+            else write(stored, 'set');
+        };
+        const ctx = {
+            field,
+            name,
+            form,
+            get value () {
+                return current().latest.current.value;
+            },
+            setValue: setStored,
+            clear: ()=>{
+                const { latest, encode, commit, write } = current();
+                const mode = latest.current.activeMode;
+                if (modeAware) commit(mode, encode(mode, null), 'set');
+                else write(null, 'set');
+            },
+            get empty () {
+                return current().latest.current.empty;
+            },
+            get disabled () {
+                return current().latest.current.disabled;
+            },
+            get strings () {
+                return current().strings;
+            },
+            get control () {
+                return current().control();
+            },
+            get insertable () {
+                return current().latest.current.insertable;
+            },
+            variables: ()=>current().variables()
+        };
+        if (modeAware) {
+            Object.defineProperty(ctx, 'mode', {
+                enumerable: true,
+                get: ()=>{
+                    const { decoded, activeMode } = current().latest.current;
+                    return decoded && {
+                        ...decoded,
+                        mode: activeMode
+                    };
+                }
+            });
+            ctx.setModeValue = (mode, value, options)=>current().setModeValue(mode, value, options);
+        }
+        return ctx;
+    }, [
+        field,
+        name,
+        form,
+        modeAware
+    ]);
+}
+function resolveControl(input) {
+    const { field, config, mode, registry } = input;
+    const named = config?.controls?.[mode];
+    let registration;
+    let source;
+    let componentProps;
+    if (named) {
+        const controlName = 'string' == typeof named ? named : named.component;
+        registration = registry.controlRegistry[controlName];
+        source = 'field';
+        componentProps = 'string' == typeof named ? void 0 : named.componentProps;
+    }
+    if (!registration && 'literal' === mode && registry.literalControls[field.type]) {
+        registration = registry.literalControls[field.type];
+        source = 'literal-controls';
+    }
+    if (!registration && registry.definitions[mode]?.control) {
+        registration = registry.definitions[mode]?.control;
+        source = 'definition';
+    }
+    if (registration && source) {
+        const Control = registration.component;
+        return {
+            node: /*#__PURE__*/ jsx(Control, {
+                ...componentProps,
+                ...input.valueModeProps()
+            }),
+            geometry: registrationGeometry(registration),
+            source
+        };
+    }
+    if ('literal' === mode) return builtInLiteral(input);
+    const builtIn = BUILT_IN_MODE_CONTROLS[mode];
+    if (builtIn) {
+        const Control = builtIn.component;
+        return {
+            node: /*#__PURE__*/ jsx(Control, {
+                ...input.valueModeProps()
+            }),
+            geometry: registrationGeometry(builtIn),
+            source: 'built-in'
+        };
+    }
+    if ('expression' === mode) return {
+        node: /*#__PURE__*/ jsx(FallbackControl, {
+            ...input
+        }),
+        geometry: TEXT_GEOMETRY,
+        source: 'built-in'
+    };
+    return {
+        node: /*#__PURE__*/ jsx(FallbackControl, {
+            ...input
+        }),
+        geometry: TEXT_GEOMETRY,
+        source: 'fallback'
+    };
+}
+function FallbackControl({ field, binding, disabled, error, errorId }) {
+    const { value } = binding;
+    return /*#__PURE__*/ jsx(Input, {
+        id: field.name,
+        name: binding.name,
+        ref: binding.ref,
+        value: 'string' == typeof value ? value : null == value ? '' : String(value),
+        onChange: (event)=>binding.onChange(event.target.value),
+        onBlur: binding.onBlur,
+        placeholder: field.placeholder,
+        disabled: disabled,
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": error ? errorId : void 0,
+        "aria-errormessage": error ? errorId : void 0
+    });
+}
+function builtInLiteral(input) {
+    const { field, binding, options, disabled, required, error, strings, customComponents } = input;
+    if ('custom' === field.type) {
+        const entry = customComponents[field.component];
+        if (!entry) return {
+            node: /*#__PURE__*/ jsx(FallbackControl, {
+                ...input
+            }),
+            geometry: TEXT_GEOMETRY,
+            source: 'fallback'
+        };
+        const registration = isFieldControlRegistration(entry) ? entry : {
+            component: entry
+        };
+        const Component = registration.component;
+        const { ref: _ref, ...bindingProps } = binding;
+        return {
+            node: /*#__PURE__*/ jsx(Component, {
+                ...bindingProps,
+                ...field.componentProps,
+                field: field,
+                disabled: disabled,
+                required: required,
+                error: error,
+                controlRef: input.controlRef,
+                labelId: input.labelId
+            }),
+            geometry: registrationGeometry(registration),
+            source: 'custom'
+        };
+    }
+    return {
+        node: /*#__PURE__*/ jsx(FieldControl, {
+            field: field,
+            formField: binding,
+            options: options,
+            disabled: disabled,
+            invalid: !!error,
+            strings: strings.boolean
+        }),
+        geometry: FIELD_CONTROL_GEOMETRY[field.type] ?? unfittedGeometry(field),
+        source: 'field-type'
+    };
+}
+export { ModeAwareField };

package/dist/components/forms/opaque-value.cjs

@@ -0,0 +1,44 @@
+"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__, {
+    VALUE_MODE_OPAQUE: ()=>VALUE_MODE_OPAQUE,
+    isValueModeOpaque: ()=>isValueModeOpaque
+});
+const VALUE_MODE_OPAQUE = Object.freeze({
+    [Symbol.toStringTag]: 'ValueModeOpaque'
+});
+function isValueModeOpaque(value) {
+    return value === VALUE_MODE_OPAQUE;
+}
+exports.VALUE_MODE_OPAQUE = __webpack_exports__.VALUE_MODE_OPAQUE;
+exports.isValueModeOpaque = __webpack_exports__.isValueModeOpaque;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "VALUE_MODE_OPAQUE",
+    "isValueModeOpaque"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/forms/opaque-value.d.ts

@@ -0,0 +1,7 @@
+/**
+ * What rules, conditions and data sources read for a value in a mode other than `literal`: set,
+ * but equal to nothing, whatever shape the codec stores it in. Apart from `value-modes.ts` so the
+ * rules engine can recognize it without importing the codec layer.
+ */
+export declare const VALUE_MODE_OPAQUE: Readonly<object>;
+export declare function isValueModeOpaque(value: unknown): boolean;

package/dist/components/forms/opaque-value.js

@@ -0,0 +1,7 @@
+const VALUE_MODE_OPAQUE = Object.freeze({
+    [Symbol.toStringTag]: 'ValueModeOpaque'
+});
+function isValueModeOpaque(value) {
+    return value === VALUE_MODE_OPAQUE;
+}
+export { VALUE_MODE_OPAQUE, isValueModeOpaque };

package/dist/components/forms/rules-engine.cjs

@@ -40,6 +40,7 @@ __webpack_require__.d(__webpack_exports__, {
 const external_jsep_namespaceObject = require("jsep");
 var external_jsep_default = /*#__PURE__*/ __webpack_require__.n(external_jsep_namespaceObject);
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
+const external_opaque_value_cjs_namespaceObject = require("./opaque-value.cjs");
 class RulesEngine {
     static evaluateConditions(conditions, values, operator = 'AND') {
         if (0 === conditions.length) return true;
@@ -57,6 +58,7 @@ class RulesEngine {
         if (void 0 !== condition.in) return condition.in.includes(fieldValue);
         if (void 0 !== condition.notIn) return !condition.notIn.includes(fieldValue);
         if (void 0 !== condition.matches) {
+            if ((0, external_opaque_value_cjs_namespaceObject.isValueModeOpaque)(fieldValue)) return false;
             const regex = new RegExp(condition.matches);
             return regex.test(String(fieldValue));
         }
@@ -106,6 +108,17 @@ class RulesEngine {
                     const binary = node;
                     const left = RulesEngine.evaluateNode(binary.left, values);
                     const right = RulesEngine.evaluateNode(binary.right, values);
+                    if ((0, external_opaque_value_cjs_namespaceObject.isValueModeOpaque)(left) || (0, external_opaque_value_cjs_namespaceObject.isValueModeOpaque)(right)) {
+                        if ('!=' === binary.operator || '!==' === binary.operator) return true;
+                        if ([
+                            '==',
+                            '===',
+                            '<',
+                            '>',
+                            '<=',
+                            '>='
+                        ].includes(binary.operator)) return false;
+                    }
                     switch(binary.operator){
                         case '==':
                             return left == right;

package/dist/components/forms/rules-engine.js

@@ -1,5 +1,6 @@
 import jsep from "jsep";
 import { get } from "../../lib/index.js";
+import { isValueModeOpaque } from "./opaque-value.js";
 class RulesEngine {
     static evaluateConditions(conditions, values, operator = 'AND') {
         if (0 === conditions.length) return true;
@@ -17,6 +18,7 @@ class RulesEngine {
         if (void 0 !== condition.in) return condition.in.includes(fieldValue);
         if (void 0 !== condition.notIn) return !condition.notIn.includes(fieldValue);
         if (void 0 !== condition.matches) {
+            if (isValueModeOpaque(fieldValue)) return false;
             const regex = new RegExp(condition.matches);
             return regex.test(String(fieldValue));
         }
@@ -66,6 +68,17 @@ class RulesEngine {
                     const binary = node;
                     const left = RulesEngine.evaluateNode(binary.left, values);
                     const right = RulesEngine.evaluateNode(binary.right, values);
+                    if (isValueModeOpaque(left) || isValueModeOpaque(right)) {
+                        if ('!=' === binary.operator || '!==' === binary.operator) return true;
+                        if ([
+                            '==',
+                            '===',
+                            '<',
+                            '>',
+                            '<=',
+                            '>='
+                        ].includes(binary.operator)) return false;
+                    }
                     switch(binary.operator){
                         case '==':
                             return left == right;