@uipath/apollo-wind 2.59.0 → 2.60.1

package/README.md

@@ -31,6 +31,19 @@ import "@uipath/apollo-wind/fonts/font.css";
 Classic themes keep Tailwind's default `--font-sans` and need no font import.
 Apps that already import `@uipath/apollo-react/core/fonts/font.css` are covered.
 
+**Angular Material hosts:** pages that carry `.mat-typography` inject unlayered
+typography rules, so overlays ship with a Material-scoped shield. Inside such
+hosts the shield outranks plain utilities, so these overrides need the `!`
+modifier (`text-xl!`, `font-bold!`, `mb-4!`):
+
+- on `DialogTitle`, `SheetTitle`, `AlertDialogTitle`, `DrawerTitle` and
+  `AlertTitle`: font family, size, line-height, weight, letter-spacing and margin;
+- on any other `h1` to `h6` inside an overlay: the same set, plus font style;
+- on any `p` inside an overlay: margin.
+
+Spacing between a title and its description should come from the header's
+`gap`, not from margins on the title.
+
 **Option 1: Zero Config** (Recommended for quick starts)
 
 ```tsx

package/dist/components/ui/accordion.cjs

@@ -49,6 +49,7 @@ const AccordionItem = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({
     }));
 AccordionItem.displayName = 'AccordionItem';
 const AccordionTrigger = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_accordion_namespaceObject.Header, {
+        "data-slot": "accordion-header",
         className: "flex",
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_accordion_namespaceObject.Trigger, {
             ref: ref,

package/dist/components/ui/accordion.js

@@ -18,6 +18,7 @@ const AccordionItem = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/
     }));
 AccordionItem.displayName = 'AccordionItem';
 const AccordionTrigger = /*#__PURE__*/ forwardRef(({ className, children, ...props }, ref)=>/*#__PURE__*/ jsx(Header, {
+        "data-slot": "accordion-header",
         className: "flex",
         children: /*#__PURE__*/ jsxs(Trigger, {
             ref: ref,

package/dist/components/ui/datetime-picker.cjs

@@ -39,12 +39,28 @@ const external_popover_cjs_namespaceObject = require("./popover.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const external_form_field_cjs_namespaceObject = require("./form-field.cjs");
 const external_input_group_context_cjs_namespaceObject = require("./input-group-context.cjs");
-const datetime_picker_DateTimePicker = /*#__PURE__*/ external_react_namespaceObject.forwardRef(function({ value, onValueChange, disabled, placeholder = 'Pick a date and time', className, use12Hour = false, id, error, errorId, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage }, ref) {
-    const [open, setOpen] = external_react_namespaceObject.useState(false);
+const datetime_picker_DateTimePicker = /*#__PURE__*/ external_react_namespaceObject.forwardRef(function({ value, onValueChange, onOpenChange, disabled, placeholder = 'Pick a date and time', className, use12Hour = false, id, error, errorId, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage }, ref) {
+    const [open, setOpenState] = external_react_namespaceObject.useState(false);
+    const setOpen = (next)=>{
+        setOpenState(next);
+        onOpenChange?.(next);
+    };
     const generatedId = external_react_namespaceObject.useId();
     const validationId = errorId ?? `${id ?? `datetime-picker-${generatedId.replace(/:/g, '')}`}-error`;
     const [selectedDate, setSelectedDate] = external_react_namespaceObject.useState(value);
-    const [timeValue, setTimeValue] = external_react_namespaceObject.useState(value ? (0, external_date_fns_namespaceObject.format)(value, use12Hour ? 'hh:mm a' : 'HH:mm') : '');
+    const [timeValue, setTimeValue] = external_react_namespaceObject.useState(value ? (0, external_date_fns_namespaceObject.format)(value, 'HH:mm') : '');
+    const valueTime = value?.getTime();
+    const [seededTime, setSeededTime] = external_react_namespaceObject.useState(valueTime);
+    if (!Object.is(valueTime, seededTime)) {
+        setSeededTime(valueTime);
+        if (void 0 === value) {
+            setSelectedDate(void 0);
+            setTimeValue('');
+        } else if (!Number.isNaN(valueTime)) {
+            setSelectedDate(value);
+            setTimeValue((0, external_date_fns_namespaceObject.format)(value, 'HH:mm'));
+        }
+    }
     const handleDateSelect = (date)=>{
         if (!date) return;
         if (selectedDate) {

package/dist/components/ui/datetime-picker.d.ts

@@ -4,6 +4,8 @@ export interface DateTimePickerProps {
     id?: string;
     value?: Date;
     onValueChange?: (date: Date | undefined) => void;
+    /** Called when the picker opens or closes, e.g. to commit the value on close. */
+    onOpenChange?: (open: boolean) => void;
     disabled?: boolean;
     placeholder?: string;
     className?: string;

package/dist/components/ui/datetime-picker.js

@@ -11,12 +11,28 @@ import { Popover, PopoverContent, PopoverTrigger } from "./popover.js";
 import { cn } from "../../lib/index.js";
 import { FormFieldError } from "./form-field.js";
 import { useControlValidation, useInputGroup } from "./input-group-context.js";
-const datetime_picker_DateTimePicker = /*#__PURE__*/ forwardRef(function({ value, onValueChange, disabled, placeholder = 'Pick a date and time', className, use12Hour = false, id, error, errorId, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage }, ref) {
-    const [open, setOpen] = useState(false);
+const datetime_picker_DateTimePicker = /*#__PURE__*/ forwardRef(function({ value, onValueChange, onOpenChange, disabled, placeholder = 'Pick a date and time', className, use12Hour = false, id, error, errorId, 'aria-labelledby': ariaLabelledBy, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, 'aria-errormessage': ariaErrorMessage }, ref) {
+    const [open, setOpenState] = useState(false);
+    const setOpen = (next)=>{
+        setOpenState(next);
+        onOpenChange?.(next);
+    };
     const generatedId = useId();
     const validationId = errorId ?? `${id ?? `datetime-picker-${generatedId.replace(/:/g, '')}`}-error`;
     const [selectedDate, setSelectedDate] = useState(value);
-    const [timeValue, setTimeValue] = useState(value ? format(value, use12Hour ? 'hh:mm a' : 'HH:mm') : '');
+    const [timeValue, setTimeValue] = useState(value ? format(value, 'HH:mm') : '');
+    const valueTime = value?.getTime();
+    const [seededTime, setSeededTime] = useState(valueTime);
+    if (!Object.is(valueTime, seededTime)) {
+        setSeededTime(valueTime);
+        if (void 0 === value) {
+            setSelectedDate(void 0);
+            setTimeValue('');
+        } else if (!Number.isNaN(valueTime)) {
+            setSelectedDate(value);
+            setTimeValue(format(value, 'HH:mm'));
+        }
+    }
     const handleDateSelect = (date)=>{
         if (!date) return;
         if (selectedDate) {

package/dist/components/ui/dialog.cjs

@@ -158,6 +158,7 @@ const dialog_DialogContent = /*#__PURE__*/ external_react_namespaceObject.forwar
                         className: "flex h-12 shrink-0 items-center gap-3 border-b border-border-subtle px-4",
                         children: [
                             null != headerTitle ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dialog_namespaceObject.Title, {
+                                "data-slot": "dialog-takeover-title",
                                 className: "min-w-0 flex-1 truncate text-sm font-semibold",
                                 children: headerTitle
                             }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/ui/dialog.js

@@ -111,6 +111,7 @@ const dialog_DialogContent = /*#__PURE__*/ forwardRef(function({ className, chil
                         className: "flex h-12 shrink-0 items-center gap-3 border-b border-border-subtle px-4",
                         children: [
                             null != headerTitle ? /*#__PURE__*/ jsx(Title, {
+                                "data-slot": "dialog-takeover-title",
                                 className: "min-w-0 flex-1 truncate text-sm font-semibold",
                                 children: headerTitle
                             }) : /*#__PURE__*/ jsx("div", {

package/dist/components/ui/drawer.cjs

@@ -79,7 +79,7 @@ const DrawerContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_vaul_namespaceObject.Drawer.Content, {
                 ref: ref,
                 "data-slot": "drawer-content",
-                className: (0, index_cjs_namespaceObject.cn)('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background', className),
+                className: (0, index_cjs_namespaceObject.cn)('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background text-foreground', className),
                 ...props,
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/ui/drawer.js

@@ -42,7 +42,7 @@ const DrawerContent = /*#__PURE__*/ forwardRef(({ className, children, container
             /*#__PURE__*/ jsxs(Drawer.Content, {
                 ref: ref,
                 "data-slot": "drawer-content",
-                className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background', className),
+                className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background text-foreground', className),
                 ...props,
                 children: [
                     /*#__PURE__*/ jsx("div", {

package/dist/components/ui/field-actions/insert-variable-action.cjs

@@ -60,7 +60,7 @@ function InsertVariableAction({ variables, onInsert, disabled, compact, strings
             if (open && lazy) setOpenedItems(variables());
         },
         onSelect: (variable)=>{
-            if (variable.value) onInsert?.(variable.value);
+            if (variable.value) onInsert?.(variable.value, variable);
         },
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("button", {
             type: "button",

package/dist/components/ui/field-actions/insert-variable-action.d.ts

@@ -21,8 +21,11 @@ export interface InsertVariableActionProps {
      * source without re-rendering the field whenever it changes.
      */
     variables: VariablePickerItem[] | (() => VariablePickerItem[]);
-    /** Called with the picked variable's value. Omitted, the action is disabled. */
-    onInsert?: (value: string) => void;
+    /**
+     * Called with the picked variable's value, and the picked entry itself so a host can recover
+     * whatever it attached to it. Omitted, the action is disabled.
+     */
+    onInsert?: (value: string, item: VariablePickerItem) => void;
     disabled?: boolean;
     /** Icon only. Below a 260px `@container` the action also collapses to its icon by itself. */
     compact?: boolean;

package/dist/components/ui/field-actions/insert-variable-action.js

@@ -31,7 +31,7 @@ function InsertVariableAction({ variables, onInsert, disabled, compact, strings
             if (open && lazy) setOpenedItems(variables());
         },
         onSelect: (variable)=>{
-            if (variable.value) onInsert?.(variable.value);
+            if (variable.value) onInsert?.(variable.value, variable);
         },
         children: /*#__PURE__*/ jsxs("button", {
             type: "button",

package/dist/components/ui/field-addons/field-menu.cjs

@@ -67,7 +67,7 @@ function ValueModeMenuItem({ icon: Icon, label, description, active, disabled, o
         ]
     });
 }
-function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, strings }) {
+function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, triggerLabel: triggerLabelOverride, strings }) {
     const text = {
         ...external_value_mode_strings_cjs_namespaceObject.DEFAULT_VALUE_MODE_STRINGS,
         ...strings
@@ -85,7 +85,7 @@ function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesD
     ] : baseModes;
     const activeMode = resolvedModes.find((item)=>item.id === mode);
     const TriggerIcon = modesDisabled ? external_lucide_react_namespaceObject.MoreHorizontal : activeMode?.icon ?? external_lucide_react_namespaceObject.Type;
-    const triggerLabel = modesDisabled ? text.fieldActions : activeMode?.title ?? text.literalTitle;
+    const triggerLabel = modesDisabled ? text.fieldActions : triggerLabelOverride ?? activeMode?.title ?? text.literalTitle;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_dropdown_menu_cjs_namespaceObject.DropdownMenu, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuTrigger, {

package/dist/components/ui/field-addons/field-menu.d.ts

@@ -29,6 +29,8 @@ interface FieldMenuBaseProps<Id extends string> {
     expectedType?: string;
     /** Overrides the built-in Fixed value description. */
     literalDescription?: string;
+    /** Names the trigger while it offers modes. Defaults to the active mode's title. */
+    triggerLabel?: string;
     /** Overrides for any subset of the English strings. */
     strings?: Partial<ValueModeStrings>;
 }
@@ -49,7 +51,7 @@ type OwnModes<Id extends string> = {
 };
 /**
  * One selectable mode in a value-mode dropdown: icon and label, with an optional description.
- * Shared with LockableValueField's mode dropdown, and not exported from the package.
+ * Shared with QuickFormField's mode dropdown, and not exported from the package.
  */
 export declare function ValueModeMenuItem({ icon: Icon, label, description, active, disabled, onClick, }: {
     icon: LucideIcon;
@@ -64,5 +66,5 @@ export declare function ValueModeMenuItem({ icon: Icon, label, description, acti
  * shows the current mode's icon and is named by its title; with the modes hidden it is the field's
  * overflow menu.
  */
-export declare function FieldMenu<Id extends string = ValueMode>({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, strings, }: FieldMenuProps<Id>): import("react/jsx-runtime").JSX.Element;
+export declare function FieldMenu<Id extends string = ValueMode>({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, triggerLabel: triggerLabelOverride, strings, }: FieldMenuProps<Id>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ui/field-addons/field-menu.js

@@ -38,7 +38,7 @@ function ValueModeMenuItem({ icon: Icon, label, description, active, disabled, o
         ]
     });
 }
-function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, strings }) {
+function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesDisabled, disabled, expectedType, literalDescription, triggerLabel: triggerLabelOverride, strings }) {
     const text = {
         ...DEFAULT_VALUE_MODE_STRINGS,
         ...strings
@@ -56,7 +56,7 @@ function FieldMenu({ mode, onSelect, modes, extraModes, actions, checked, modesD
     ] : baseModes;
     const activeMode = resolvedModes.find((item)=>item.id === mode);
     const TriggerIcon = modesDisabled ? MoreHorizontal : activeMode?.icon ?? Type;
-    const triggerLabel = modesDisabled ? text.fieldActions : activeMode?.title ?? text.literalTitle;
+    const triggerLabel = modesDisabled ? text.fieldActions : triggerLabelOverride ?? activeMode?.title ?? text.literalTitle;
     return /*#__PURE__*/ jsxs(DropdownMenu, {
         children: [
             /*#__PURE__*/ jsx(DropdownMenuTrigger, {