@uipath/apollo-react 6.45.3 → 6.47.0

package/dist/canvas/components/Guardrails/guardrail-builder.js

@@ -0,0 +1,335 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Alert, AlertDescription, FormField, FormFieldLabel, InfoTooltip, Input, Label, Separator, Switch, Textarea, cn } from "@uipath/apollo-wind";
+import { Info } from "lucide-react";
+import { useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { GUARDRAIL_BYO_VALIDATOR_TYPE } from "./builder-types.js";
+import { getGuardrailActionErrorFields, getGuardrailSelectorErrorFields, initGuardrailBuilderFormData } from "./builder-utils.js";
+import { GuardrailActionSection } from "./components/guardrail-action-section.js";
+import { GuardrailScopeSelector } from "./components/guardrail-scope-selector.js";
+import { GuardrailStatusBanner } from "./components/guardrail-status-banner.js";
+import { MixedScopesBanner } from "./components/mixed-scopes-banner.js";
+import { GuardrailFormLayout } from "./guardrail-form-layout.js";
+import { GuardrailValidatorForm } from "./guardrail-validator-form.js";
+import { formatGuardrailFormMessage, useGuardrailBuilderLabels } from "./i18n.js";
+import { dropEmptyOptionalParameters, getOutOfRangeParameterIds, getRequiredEmptyParameterIds, syncMapEnumParameters } from "./utils.js";
+const EMPTY_PARAM_IDS = new Set();
+function GuardrailBuilder({ open, definition, scope, guardrail, defaultName, existingNames, toolName, availableToolNames, onSave, onCancel, onSaveAsNew, otherAppliedScopes = null, inline = false, hideHeader = false, dialogMaxWidth, title, evalsTogglePlacement = 'form', renderRecipientSearch, renderStaticRecipient, renderAppPicker, escalateHelp, errors: hostErrors, renderParameter, overrideParameterIds, saveDisabled: hostSaveDisabled = false, labels: labelOverrides, className }) {
+    const labels = useGuardrailBuilderLabels(labelOverrides);
+    const uid = useId();
+    const [formData, setFormData] = useState(()=>{
+        const data = initGuardrailBuilderFormData(definition, scope, guardrail, toolName);
+        if (!guardrail && defaultName) data.name = defaultName;
+        return data;
+    });
+    const [showErrors, setShowErrors] = useState(false);
+    const [editedParamIds, setEditedParamIds] = useState(EMPTY_PARAM_IDS);
+    useEffect(()=>{
+        setEditedParamIds(EMPTY_PARAM_IDS);
+    }, [
+        hostErrors
+    ]);
+    const rootRef = useRef(null);
+    useEffect(()=>{
+        const node = rootRef.current;
+        if (!node) return;
+        const swallowEnter = (event)=>{
+            if ('Enter' !== event.key || event.defaultPrevented) return;
+            const target = event.target;
+            if (target instanceof HTMLInputElement && 'button' !== target.type) event.preventDefault();
+        };
+        node.addEventListener('keydown', swallowEnter);
+        return ()=>node.removeEventListener('keydown', swallowEnter);
+    }, []);
+    const showScopeSelector = 'Agent' === scope;
+    const updateField = useCallback((field, value)=>{
+        setFormData((prev)=>({
+                ...prev,
+                [field]: value
+            }));
+    }, []);
+    const handleSelectorChange = useCallback((selector)=>updateField('selector', selector), [
+        updateField
+    ]);
+    const guardrailResult = useMemo(()=>{
+        const textListIds = new Set(definition.parameters.filter((p)=>'text-list' === p.type).map((p)=>p.id));
+        const trimmed = syncMapEnumParameters(formData.validatorParameters, definition.parameters).map((param)=>'text-list' === param.$parameterType && textListIds.has(param.id) && Array.isArray(param.value) ? {
+                ...param,
+                value: param.value.filter((entry)=>'string' == typeof entry && entry.trim().length > 0)
+            } : param);
+        const validatorParameters = dropEmptyOptionalParameters(trimmed, definition.parameters);
+        const isByo = void 0 !== definition.byoValidatorName;
+        return {
+            id: formData.id,
+            $guardrailType: 'builtInValidator',
+            name: formData.name,
+            description: formData.description || void 0,
+            selector: formData.selector,
+            action: formData.action,
+            enabledForEvals: formData.enabledForEvals,
+            validatorType: isByo ? GUARDRAIL_BYO_VALIDATOR_TYPE : definition.validator,
+            validatorParameters,
+            ...isByo ? {
+                byoValidatorName: definition.byoValidatorName
+            } : {}
+        };
+    }, [
+        formData,
+        definition
+    ]);
+    const internalErrors = useMemo(()=>{
+        const e = {};
+        if (formData.name.trim()) {
+            if (existingNames?.some((n)=>n.toLowerCase() === formData.name.trim().toLowerCase())) e.name = labels.nameDuplicateError;
+        } else e.name = labels.nameRequiredError;
+        if (showScopeSelector) for (const field of getGuardrailSelectorErrorFields(formData.selector))e[field] = 'scopes' === field ? labels.scopesRequiredError : labels.toolsRequiredError;
+        const reconciledParameters = syncMapEnumParameters(formData.validatorParameters, definition.parameters);
+        const parameterErrors = {};
+        for (const id of getRequiredEmptyParameterIds(definition.parameters, reconciledParameters))parameterErrors[id] = labels.parameterRequiredError;
+        for (const id of getOutOfRangeParameterIds(definition.parameters, reconciledParameters))parameterErrors[id] ??= labels.parameterOutOfRangeError;
+        if (Object.keys(parameterErrors).length > 0) e.parameters = parameterErrors;
+        for (const field of getGuardrailActionErrorFields(formData.action))e[field] = ({
+            blockReason: labels.blockReasonRequiredError,
+            filterFields: labels.filterFieldsRequiredError,
+            recipient: labels.recipientRequiredError,
+            actionApp: labels.actionAppRequiredError
+        })[field];
+        return e;
+    }, [
+        formData,
+        showScopeSelector,
+        definition.parameters,
+        existingNames,
+        labels
+    ]);
+    const liveHostParameterErrors = useMemo(()=>{
+        const fromHost = hostErrors?.parameters;
+        if (!fromHost) return {};
+        return Object.fromEntries(Object.entries(fromHost).filter(([id])=>!editedParamIds.has(id)));
+    }, [
+        hostErrors,
+        editedParamIds
+    ]);
+    const displayErrors = useMemo(()=>{
+        const base = showErrors ? {
+            ...internalErrors
+        } : {};
+        if (hostErrors) {
+            for (const [key, value] of Object.entries(hostErrors))if (void 0 !== value) base[key] = 'parameters' === key ? {
+                ...base.parameters,
+                ...liveHostParameterErrors
+            } : value;
+        }
+        return base;
+    }, [
+        showErrors,
+        internalErrors,
+        hostErrors,
+        liveHostParameterErrors
+    ]);
+    const hasHostErrors = Boolean(hostErrors && Object.entries(hostErrors).some(([key, v])=>{
+        if (void 0 === v) return false;
+        if ('parameters' === key) return Object.keys(liveHostParameterErrors).length > 0;
+        return 'object' != typeof v || Object.keys(v).length > 0;
+    }));
+    const isValid = 0 === Object.keys(internalErrors).length && !hasHostErrors;
+    const isDefinitionAvailable = 'Available' === definition.status;
+    const handleSave = useCallback(()=>{
+        if (!isDefinitionAvailable) return;
+        if (!isValid) return void setShowErrors(true);
+        onSave(guardrailResult);
+    }, [
+        guardrailResult,
+        onSave,
+        isValid,
+        isDefinitionAvailable
+    ]);
+    const handleSaveAsNew = useCallback(()=>{
+        if (!onSaveAsNew) return;
+        if (!isDefinitionAvailable) return;
+        if (!isValid) return void setShowErrors(true);
+        onSaveAsNew(guardrailResult);
+    }, [
+        guardrailResult,
+        onSaveAsNew,
+        isValid,
+        isDefinitionAvailable
+    ]);
+    const isByoConfigurationDisabled = void 0 !== definition.byoValidatorName && 'Disabled' === definition.status;
+    const computedTitle = guardrail ? formatGuardrailFormMessage(labels.editTitle, {
+        name: definition.displayName
+    }) : formatGuardrailFormMessage(labels.addTitle, {
+        name: definition.displayName
+    });
+    const statusBanner = isByoConfigurationDisabled ? /*#__PURE__*/ jsx(GuardrailStatusBanner, {
+        tone: "error",
+        message: labels.byoDisabledMessage
+    }) : 'Unauthorised' === definition.status ? /*#__PURE__*/ jsx(GuardrailStatusBanner, {
+        tone: "warning",
+        message: labels.unauthorizedMessage
+    }) : 'FeatureDisabled' === definition.status ? /*#__PURE__*/ jsx(GuardrailStatusBanner, {
+        tone: "warning",
+        message: labels.featureDisabledMessage
+    }) : null;
+    const usageNote = definition.usageNote ? /*#__PURE__*/ jsxs(Alert, {
+        variant: "info",
+        "data-slot": "guardrail-usage-note",
+        children: [
+            /*#__PURE__*/ jsx(Info, {}),
+            /*#__PURE__*/ jsx(AlertDescription, {
+                children: definition.usageNote
+            })
+        ]
+    }) : null;
+    const evalsToggle = /*#__PURE__*/ jsxs("div", {
+        className: "flex items-center gap-2",
+        children: [
+            /*#__PURE__*/ jsx(Switch, {
+                id: `${uid}-ootb-enable-evals`,
+                checked: formData.enabledForEvals,
+                onCheckedChange: (checked)=>updateField('enabledForEvals', checked)
+            }),
+            /*#__PURE__*/ jsx(Label, {
+                variant: "muted",
+                htmlFor: `${uid}-ootb-enable-evals`,
+                className: "cursor-pointer",
+                children: labels.evalsLabel
+            }),
+            /*#__PURE__*/ jsx(InfoTooltip, {
+                content: labels.evalsTooltip,
+                "aria-label": labels.evalsInfoAriaLabel
+            })
+        ]
+    });
+    const validatorFormErrors = displayErrors.parameters;
+    const formBody = /*#__PURE__*/ jsxs("div", {
+        ref: rootRef,
+        "data-slot": "guardrail-builder",
+        className: cn('space-y-4 py-4', className),
+        children: [
+            statusBanner,
+            usageNote,
+            guardrail && /*#__PURE__*/ jsxs(FormField, {
+                children: [
+                    /*#__PURE__*/ jsx(Label, {
+                        htmlFor: `${uid}-ootb-type`,
+                        children: labels.typeLabel
+                    }),
+                    /*#__PURE__*/ jsx(Input, {
+                        id: `${uid}-ootb-type`,
+                        value: definition.displayName,
+                        disabled: true,
+                        readOnly: true
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsxs(FormField, {
+                children: [
+                    /*#__PURE__*/ jsx(FormFieldLabel, {
+                        htmlFor: `${uid}-ootb-name`,
+                        required: true,
+                        children: labels.nameLabel
+                    }),
+                    /*#__PURE__*/ jsx(Input, {
+                        id: `${uid}-ootb-name`,
+                        value: formData.name,
+                        onChange: (e)=>updateField('name', e.target.value),
+                        placeholder: labels.namePlaceholder,
+                        error: displayErrors.name
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsxs(FormField, {
+                children: [
+                    /*#__PURE__*/ jsx(Label, {
+                        htmlFor: `${uid}-ootb-description`,
+                        children: labels.descriptionLabel
+                    }),
+                    /*#__PURE__*/ jsx(Textarea, {
+                        id: `${uid}-ootb-description`,
+                        minRows: 1,
+                        value: formData.description,
+                        onChange: (e)=>updateField("description", e.target.value),
+                        placeholder: labels.descriptionPlaceholder
+                    })
+                ]
+            }),
+            definition.parameters.length > 0 && /*#__PURE__*/ jsx("div", {
+                className: "space-y-3",
+                children: /*#__PURE__*/ jsx(GuardrailValidatorForm, {
+                    parameterDefinitions: definition.parameters,
+                    parameters: formData.validatorParameters,
+                    onChange: (params)=>updateField('validatorParameters', params),
+                    errors: validatorFormErrors,
+                    validateLive: showErrors,
+                    onClearError: (paramId)=>setEditedParamIds((prev)=>{
+                            if (prev.has(paramId)) return prev;
+                            const next = new Set(prev);
+                            next.add(paramId);
+                            return next;
+                        }),
+                    renderParameter: renderParameter,
+                    overrideParameterIds: overrideParameterIds
+                })
+            }),
+            showScopeSelector && /*#__PURE__*/ jsx(GuardrailScopeSelector, {
+                selector: formData.selector,
+                onChange: handleSelectorChange,
+                availableToolNames: availableToolNames,
+                allowedScopes: definition.allowedScopes,
+                errors: {
+                    scopes: displayErrors.scopes,
+                    toolNames: displayErrors.toolNames
+                },
+                labels: labels
+            }),
+            /*#__PURE__*/ jsx(Separator, {}),
+            /*#__PURE__*/ jsx("div", {
+                className: "space-y-3",
+                children: /*#__PURE__*/ jsx(GuardrailActionSection, {
+                    action: formData.action,
+                    onActionChange: (action)=>updateField('action', action),
+                    errors: {
+                        blockReason: displayErrors.blockReason,
+                        filterFields: displayErrors.filterFields,
+                        recipient: displayErrors.recipient,
+                        actionApp: displayErrors.actionApp
+                    },
+                    labels: labels,
+                    renderRecipientSearch: renderRecipientSearch,
+                    renderStaticRecipient: renderStaticRecipient,
+                    renderAppPicker: renderAppPicker,
+                    escalateHelp: escalateHelp
+                })
+            }),
+            'form' === evalsTogglePlacement && evalsToggle,
+            /*#__PURE__*/ jsx(MixedScopesBanner, {
+                otherAppliedScopes: otherAppliedScopes,
+                labels: labels
+            })
+        ]
+    });
+    const secondaryAction = onSaveAsNew ? {
+        label: labels.saveAsNew,
+        onClick: handleSaveAsNew,
+        disabled: !isDefinitionAvailable || hostSaveDisabled
+    } : void 0;
+    return /*#__PURE__*/ jsx(GuardrailFormLayout, {
+        open: open,
+        title: title ?? computedTitle,
+        onSave: handleSave,
+        onCancel: onCancel,
+        inline: inline,
+        hideHeader: hideHeader,
+        dialogMaxWidth: dialogMaxWidth,
+        secondaryAction: secondaryAction,
+        saveDisabled: !isDefinitionAvailable || hostSaveDisabled,
+        footerStart: 'footer' === evalsTogglePlacement ? evalsToggle : void 0,
+        labels: {
+            cancel: labels.cancel,
+            save: labels.save
+        },
+        children: formBody
+    });
+}
+GuardrailBuilder.displayName = 'GuardrailBuilder';
+export { GuardrailBuilder };

package/dist/canvas/components/Guardrails/guardrail-form-layout.cjs

@@ -0,0 +1,138 @@
+"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__, {
+    GuardrailFormLayout: ()=>GuardrailFormLayout
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_i18n_cjs_namespaceObject = require("./i18n.cjs");
+function GuardrailFormLayout({ open, title, children, onSave, onCancel, inline = false, hideHeader = false, dialogMaxWidth = 700, secondaryAction, saveDisabled = false, footerStart, labels }) {
+    const builderLabels = (0, external_i18n_cjs_namespaceObject.useGuardrailBuilderLabels)();
+    const cancelLabel = labels?.cancel ?? builderLabels.cancel;
+    const saveLabel = labels?.save ?? builderLabels.save;
+    const footerButtons = (size)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                    variant: "outline",
+                    size: size,
+                    onClick: onCancel,
+                    children: cancelLabel
+                }),
+                secondaryAction && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                    variant: "outline",
+                    size: size,
+                    onClick: secondaryAction.onClick,
+                    disabled: secondaryAction.disabled,
+                    children: secondaryAction.label
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                    size: size,
+                    onClick: onSave,
+                    disabled: saveDisabled,
+                    children: saveLabel
+                })
+            ]
+        });
+    if (inline) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        "data-slot": "guardrail-form-layout",
+        className: "flex flex-col h-full",
+        children: [
+            !hideHeader && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                "data-slot": "guardrail-form-layout-header",
+                className: "flex items-center gap-2 px-3 py-2 border-b shrink-0",
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                        variant: "ghost",
+                        size: "2xs",
+                        icon: true,
+                        "aria-label": cancelLabel,
+                        onClick: onCancel,
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ArrowLeft, {})
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                        className: "text-sm font-medium",
+                        children: title
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                "data-slot": "guardrail-form-layout-body",
+                className: "flex-1 min-h-0 overflow-y-auto px-4",
+                children: children
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                "data-slot": "guardrail-form-layout-footer",
+                className: "flex items-center gap-2 px-4 py-3 border-t shrink-0",
+                children: [
+                    footerStart && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex items-center gap-2 mr-auto",
+                        children: footerStart
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex justify-end gap-2 ml-auto",
+                        children: footerButtons('sm')
+                    })
+                ]
+            })
+        ]
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Dialog, {
+        open: open,
+        onOpenChange: (isOpen)=>!isOpen && onCancel(),
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.DialogContent, {
+            className: "max-h-[90vh] overflow-y-auto",
+            style: {
+                maxWidth: `${dialogMaxWidth}px`
+            },
+            "aria-describedby": void 0,
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DialogHeader, {
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DialogTitle, {
+                        children: title
+                    })
+                }),
+                children,
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.DialogFooter, {
+                    children: [
+                        footerStart && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                            className: "flex items-center gap-2 mr-auto",
+                            children: footerStart
+                        }),
+                        footerButtons()
+                    ]
+                })
+            ]
+        })
+    });
+}
+exports.GuardrailFormLayout = __webpack_exports__.GuardrailFormLayout;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "GuardrailFormLayout"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Guardrails/guardrail-form-layout.d.ts

@@ -0,0 +1,24 @@
+import type { ReactNode } from 'react';
+export interface GuardrailFormLayoutProps {
+    open: boolean;
+    title: ReactNode;
+    children: ReactNode;
+    onSave: () => void;
+    onCancel: () => void;
+    inline?: boolean;
+    hideHeader?: boolean;
+    dialogMaxWidth?: number;
+    secondaryAction?: {
+        label: ReactNode;
+        onClick: () => void;
+        disabled?: boolean;
+    };
+    saveDisabled?: boolean;
+    footerStart?: ReactNode;
+    labels?: {
+        cancel?: string;
+        save?: string;
+    };
+}
+export declare function GuardrailFormLayout({ open, title, children, onSave, onCancel, inline, hideHeader, dialogMaxWidth, secondaryAction, saveDisabled, footerStart, labels, }: GuardrailFormLayoutProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=guardrail-form-layout.d.ts.map

package/dist/canvas/components/Guardrails/guardrail-form-layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"guardrail-form-layout.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Guardrails/guardrail-form-layout.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,WAAW,wBAAwB;IAEvC,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,eAAe,CAAC,EAAE;QAAE,KAAK,EAAE,SAAS,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IAEhF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,MAAM,CAAC,EAAE;QAAE,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC7C;AAQD,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,MAAc,EACd,UAAkB,EAClB,cAAoB,EACpB,eAAe,EACf,YAAoB,EACpB,WAAW,EACX,MAAM,GACP,EAAE,wBAAwB,2CA0E1B"}

package/dist/canvas/components/Guardrails/guardrail-form-layout.js

@@ -0,0 +1,104 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from "@uipath/apollo-wind";
+import { ArrowLeft } from "lucide-react";
+import { useGuardrailBuilderLabels } from "./i18n.js";
+function GuardrailFormLayout({ open, title, children, onSave, onCancel, inline = false, hideHeader = false, dialogMaxWidth = 700, secondaryAction, saveDisabled = false, footerStart, labels }) {
+    const builderLabels = useGuardrailBuilderLabels();
+    const cancelLabel = labels?.cancel ?? builderLabels.cancel;
+    const saveLabel = labels?.save ?? builderLabels.save;
+    const footerButtons = (size)=>/*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                /*#__PURE__*/ jsx(Button, {
+                    variant: "outline",
+                    size: size,
+                    onClick: onCancel,
+                    children: cancelLabel
+                }),
+                secondaryAction && /*#__PURE__*/ jsx(Button, {
+                    variant: "outline",
+                    size: size,
+                    onClick: secondaryAction.onClick,
+                    disabled: secondaryAction.disabled,
+                    children: secondaryAction.label
+                }),
+                /*#__PURE__*/ jsx(Button, {
+                    size: size,
+                    onClick: onSave,
+                    disabled: saveDisabled,
+                    children: saveLabel
+                })
+            ]
+        });
+    if (inline) return /*#__PURE__*/ jsxs("div", {
+        "data-slot": "guardrail-form-layout",
+        className: "flex flex-col h-full",
+        children: [
+            !hideHeader && /*#__PURE__*/ jsxs("div", {
+                "data-slot": "guardrail-form-layout-header",
+                className: "flex items-center gap-2 px-3 py-2 border-b shrink-0",
+                children: [
+                    /*#__PURE__*/ jsx(Button, {
+                        variant: "ghost",
+                        size: "2xs",
+                        icon: true,
+                        "aria-label": cancelLabel,
+                        onClick: onCancel,
+                        children: /*#__PURE__*/ jsx(ArrowLeft, {})
+                    }),
+                    /*#__PURE__*/ jsx("span", {
+                        className: "text-sm font-medium",
+                        children: title
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx("div", {
+                "data-slot": "guardrail-form-layout-body",
+                className: "flex-1 min-h-0 overflow-y-auto px-4",
+                children: children
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                "data-slot": "guardrail-form-layout-footer",
+                className: "flex items-center gap-2 px-4 py-3 border-t shrink-0",
+                children: [
+                    footerStart && /*#__PURE__*/ jsx("div", {
+                        className: "flex items-center gap-2 mr-auto",
+                        children: footerStart
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        className: "flex justify-end gap-2 ml-auto",
+                        children: footerButtons('sm')
+                    })
+                ]
+            })
+        ]
+    });
+    return /*#__PURE__*/ jsx(Dialog, {
+        open: open,
+        onOpenChange: (isOpen)=>!isOpen && onCancel(),
+        children: /*#__PURE__*/ jsxs(DialogContent, {
+            className: "max-h-[90vh] overflow-y-auto",
+            style: {
+                maxWidth: `${dialogMaxWidth}px`
+            },
+            "aria-describedby": void 0,
+            children: [
+                /*#__PURE__*/ jsx(DialogHeader, {
+                    children: /*#__PURE__*/ jsx(DialogTitle, {
+                        children: title
+                    })
+                }),
+                children,
+                /*#__PURE__*/ jsxs(DialogFooter, {
+                    children: [
+                        footerStart && /*#__PURE__*/ jsx("div", {
+                            className: "flex items-center gap-2 mr-auto",
+                            children: footerStart
+                        }),
+                        footerButtons()
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { GuardrailFormLayout };