@payglocal_ui/flux-ui 0.2.5 → 0.3.0

package/src/date-picker.tsx

@@ -38,12 +38,21 @@ interface DatePickerProps {
   onChange:     (v: string) => void;
   placeholder?: string;
   className?:   string;
+  /** Earliest selectable date, `YYYY-MM-DD`. Days before it are struck out. */
   min?:         string;
+  /**
+   * Latest selectable date, `YYYY-MM-DD`.
+   *
+   * Its absence is why a feature ended up hand-rolling a whole date chip to
+   * enforce an upper bound on Apply instead — an error after the fact, where
+   * the calendar could have said so before the click.
+   */
+  max?:         string;
   label?:       string;
 }
 
 /* ─── DatePicker ─────────────────────────────────────────────────────────── */
-export function DatePicker({ value, onChange, placeholder = "Select date", className, min, label }: DatePickerProps) {
+export function DatePicker({ value, onChange, placeholder = "Select date", className, min, max, label }: DatePickerProps) {
   const today   = new Date();
   const parsed  = parseYMD(value);
 
@@ -123,10 +132,13 @@ export function DatePicker({ value, onChange, placeholder = "Select date", class
   const firstDay  = firstDayOf(viewYear, viewMonth);
   const prevTotal = daysInMonth(viewYear, viewMonth === 0 ? 11 : viewMonth - 1);
   const minParsed = parseYMD(min ?? "");
+  const maxParsed = parseYMD(max ?? "");
 
   function isDisabled(y: number, m: number, d: number) {
-    if (!minParsed) return false;
-    return new Date(y, m, d) < new Date(minParsed.y, minParsed.m, minParsed.d);
+    const day = new Date(y, m, d);
+    if (minParsed && day < new Date(minParsed.y, minParsed.m, minParsed.d)) return true;
+    if (maxParsed && day > new Date(maxParsed.y, maxParsed.m, maxParsed.d)) return true;
+    return false;
   }
 
   type Cell = { d: number; m: number; y: number; current: boolean };

package/src/dropdown-menu.tsx

@@ -19,7 +19,9 @@ const DropdownMenuSubTrigger = React.forwardRef<
   <DropdownMenuPrimitive.SubTrigger
     ref={ref}
     className={cn(
-      "flex cursor-default select-none items-center gap-2 rounded-lg px-3 py-2.5 text-[15px] outline-none",
+      // Matches DropdownMenuItem: a submenu row sits in the same list as the
+      // plain rows, so it cannot be a different size from them.
+      "flex cursor-default select-none items-center gap-2 rounded-lg px-2.5 py-1.5 text-[13px] outline-none",
       "focus:bg-muted data-[state=open]:bg-muted",
       inset && "pl-8",
       className
@@ -94,7 +96,9 @@ const DropdownMenuCheckboxItem = React.forwardRef<
   <DropdownMenuPrimitive.CheckboxItem
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-lg py-2 pl-8 pr-2 text-sm outline-none transition-colors",
+      // Matches DropdownMenuItem. `pl-8` stays: that gutter is the check /
+      // dot indicator's, not padding.
+      "relative flex cursor-default select-none items-center rounded-lg py-1.5 pl-8 pr-2.5 text-[13px] outline-none transition-colors",
       "focus:bg-muted focus:text-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       className
     )}
@@ -118,7 +122,9 @@ const DropdownMenuRadioItem = React.forwardRef<
   <DropdownMenuPrimitive.RadioItem
     ref={ref}
     className={cn(
-      "relative flex cursor-default select-none items-center rounded-lg py-2 pl-8 pr-2 text-sm outline-none transition-colors",
+      // Matches DropdownMenuItem. `pl-8` stays: that gutter is the check /
+      // dot indicator's, not padding.
+      "relative flex cursor-default select-none items-center rounded-lg py-1.5 pl-8 pr-2.5 text-[13px] outline-none transition-colors",
       "focus:bg-muted focus:text-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       className
     )}