myoperator-mcp 0.2.390 → 0.2.392

package/dist/index.js

@@ -3595,7 +3595,8 @@ const dateTimePickerTriggerVariants = cva(
       },
       state: {
         default: "",
-        error: "border-[var(--semantic-error-primary,#F04438)] hover:border-[var(--semantic-error-primary,#F04438)]",
+        error:
+          "border-[var(--semantic-error-primary,#F04438)] hover:border-[var(--semantic-error-primary,#F04438)]",
       },
     },
     defaultVariants: {
@@ -3650,6 +3651,16 @@ export interface DateTimePickerProps
   defaultOpen?: boolean;
   onOpenChange?: (open: boolean) => void;
   portalContainer?: HTMLElement | null;
+  /** Shows a footer with Cancel and OK actions */
+  showActions?: boolean;
+  /** Label for the OK action */
+  okLabel?: string;
+  /** Label for the Cancel action */
+  cancelLabel?: string;
+  /** Called when OK is pressed, with the confirmed value */
+  onOk?: (value: DateTimePickerValue) => void;
+  /** Called when Cancel is pressed, after the value is restored */
+  onCancel?: () => void;
 }
 
 type DateTimePickerVariant = NonNullable<
@@ -4958,6 +4969,11 @@ const DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(
       defaultOpen = false,
       onOpenChange,
       portalContainer,
+      showActions = false,
+      okLabel = "OK",
+      cancelLabel = "Cancel",
+      onOk,
+      onCancel,
       id,
       ...props
     },
@@ -5081,8 +5097,8 @@ const DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(
     );
     const hasValue = Boolean(
       currentValue.date ||
-        currentValue.startTime ||
-        (resolvedShowEndTime && currentValue.endTime)
+      currentValue.startTime ||
+      (resolvedShowEndTime && currentValue.endTime)
     );
     const effectiveMinDate = React.useMemo(() => {
       if (!disablePastDates) return minDate;
@@ -5182,6 +5198,26 @@ const DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(
       [isValueControlled, onValueChange]
     );
 
+    // Value at the moment the popover opened, so Cancel can restore it.
+    const openSnapshotRef = React.useRef<DateTimePickerValue | null>(null);
+    React.useEffect(() => {
+      openSnapshotRef.current = open ? currentValue : null;
+      // Only re-snapshot when the popover opens, not on every value change.
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [open]);
+
+    const handleCancel = () => {
+      const snapshot = openSnapshotRef.current;
+      if (snapshot) updateValue(snapshot);
+      setOpen(false);
+      onCancel?.();
+    };
+
+    const handleOk = () => {
+      setOpen(false);
+      onOk?.(currentValue);
+    };
+
     const clearValue = (event: React.MouseEvent<HTMLElement>) => {
       event.stopPropagation();
       if (readOnly) return;
@@ -5661,6 +5697,26 @@ const DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(
             </div>
           )}
 
+          {showActions && (
+            <div className="flex items-center justify-end gap-2 border-t border-solid border-[var(--semantic-border-layout,#E9EAEB)] px-3 py-2">
+              <div className="flex items-center gap-2">
+                <button
+                  type="button"
+                  className="rounded px-2 py-1.5 text-sm font-semibold text-[var(--semantic-text-link,#4275D6)] transition-colors hover:bg-[var(--semantic-bg-ui,#F5F5F5)]"
+                  onClick={handleCancel}
+                >
+                  {cancelLabel}
+                </button>
+                <button
+                  type="button"
+                  className="rounded px-2 py-1.5 text-sm font-semibold text-[var(--semantic-text-link,#4275D6)] transition-colors hover:bg-[var(--semantic-bg-ui,#F5F5F5)]"
+                  onClick={handleOk}
+                >
+                  {okLabel}
+                </button>
+              </div>
+            </div>
+          )}
         </div>,
         portalMount
       );
@@ -5701,7 +5757,9 @@ const DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(
           >
             {label}
             {required && (
-              <span className="text-[var(--semantic-error-primary,#F04438)] ml-0.5">*</span>
+              <span className="text-[var(--semantic-error-primary,#F04438)] ml-0.5">
+                *
+              </span>
             )}
           </label>
         )}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "myoperator-mcp",
-  "version": "0.2.390",
+  "version": "0.2.392",
   "description": "MCP server for myOperator UI components - enables AI assistants to access component metadata, examples, and design tokens",
   "type": "module",
   "bin": "./dist/index.js",