@bizapps/design-system-testing 1.8.1 → 1.9.0

package/dist/main.js

@@ -4,7 +4,7 @@ import { cva } from 'class-variance-authority';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
-import { createContext, memo, useRef, useState, useMemo, useCallback, useEffect, forwardRef, Fragment, useId, useContext, useLayoutEffect, isValidElement, cloneElement } from 'react';
+import { createContext, memo, useRef, useState, useMemo, useCallback, useEffect, forwardRef, Fragment, useId, useContext, useLayoutEffect } from 'react';
 import { Avatar as Avatar$1, Checkbox as Checkbox$1, Slot, Select as Select$1, Label as Label$1, Popover as Popover$1, Toggle as Toggle$1, ToggleGroup, Separator as Separator$1, Progress as Progress$1, Slider as Slider$1, Switch as Switch$1, Tabs as Tabs$1, Tooltip as Tooltip$1, Dialog as Dialog$1, AlertDialog as AlertDialog$1, Accordion as Accordion$1, DropdownMenu as DropdownMenu$1, RadioGroup as RadioGroup$1, NavigationMenu as NavigationMenu$1 } from 'radix-ui';
 import { isSameDay, isToday, format, addDays } from 'date-fns';
 import useEmblaCarousel from 'embla-carousel-react';
@@ -1676,37 +1676,31 @@ function SelectContent({
   className,
   children,
   position = "popper",
-  maxHeight,
-  style,
   ...props
 }) {
-  const resolvedMaxHeight = typeof maxHeight === "number" ? `${maxHeight}px` : maxHeight;
   return /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsxs(
     Select$1.Content,
     {
       "data-slot": "select-content",
       className: cn(
-        "border-border bg-popover text-popover-foreground relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-hidden rounded-md border shadow-md",
+        "border-border bg-popover text-popover-foreground relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
         "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
         "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
         "data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1",
-        position === "popper" && "w-(--radix-select-trigger-width)",
+        position === "popper" && "w-[--radix-select-trigger-width]",
         className
       ),
       position,
-      style: {
-        ...resolvedMaxHeight ? {
-          maxHeight: `min(${resolvedMaxHeight}, var(--radix-select-content-available-height))`
-        } : null,
-        ...style
-      },
       ...props,
       children: [
         /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
         /* @__PURE__ */ jsx(
           Select$1.Viewport,
           {
-            className: cn("scroll-my-1 p-1", position === "popper" && "w-full"),
+            className: cn(
+              "p-1",
+              position === "popper" && "h-[--radix-select-trigger-height]"
+            ),
             children
           }
         ),
@@ -4368,7 +4362,6 @@ ColorPickerPresets.displayName = "ColorPickerPresets";
 function Calendar({
   className,
   classNames,
-  modifiersClassNames,
   showOutsideDays = true,
   captionLayout = "dropdown",
   buttonVariant = "ghost",
@@ -4380,36 +4373,6 @@ function Calendar({
   ...props
 }) {
   const defaultClassNames = getDefaultClassNames();
-  const resolvedComponents = useMemo(
-    () => ({
-      Root: ({ className: className2, rootRef, ...rootProps }) => {
-        return /* @__PURE__ */ jsx(
-          "div",
-          {
-            "data-slot": "calendar",
-            ref: rootRef,
-            className: cn(className2),
-            ...rootProps
-          }
-        );
-      },
-      Chevron: ({ className: className2, orientation, ...chevronProps }) => {
-        if (orientation === "left") {
-          return /* @__PURE__ */ jsx(ChevronLeftIcon, { className: cn("size-4", className2), ...chevronProps });
-        }
-        if (orientation === "right") {
-          return /* @__PURE__ */ jsx(ChevronRightIcon, { className: cn("size-4", className2), ...chevronProps });
-        }
-        return /* @__PURE__ */ jsx(ChevronDownIcon, { className: cn("size-4", className2), ...chevronProps });
-      },
-      DayButton: (dayButtonProps) => /* @__PURE__ */ jsx(CalendarDayButton, { locale, ...dayButtonProps }),
-      WeekNumber: ({ children, ...weekNumberProps }) => {
-        return /* @__PURE__ */ jsx("td", { ...weekNumberProps, children: /* @__PURE__ */ jsx("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
-      },
-      ...components
-    }),
-    [locale, components]
-  );
   return /* @__PURE__ */ jsx(
     DayPicker,
     {
@@ -4501,13 +4464,33 @@ function Calendar({
         hidden: cn("invisible", defaultClassNames.hidden),
         ...classNames
       },
-      modifiersClassNames: {
-        preview_start: "relative isolate z-0 rounded-l-md bg-primary/8 after:absolute after:inset-y-0 after:right-0 after:w-3 after:bg-primary/8",
-        preview_middle: "rounded-none bg-primary/8",
-        preview_end: "relative isolate z-0 rounded-r-md bg-primary/8 after:absolute after:inset-y-0 after:left-0 after:w-3 after:bg-primary/8",
-        ...modifiersClassNames
+      components: {
+        Root: ({ className: className2, rootRef, ...props2 }) => {
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              "data-slot": "calendar",
+              ref: rootRef,
+              className: cn(className2),
+              ...props2
+            }
+          );
+        },
+        Chevron: ({ className: className2, orientation, ...props2 }) => {
+          if (orientation === "left") {
+            return /* @__PURE__ */ jsx(ChevronLeftIcon, { className: cn("size-4", className2), ...props2 });
+          }
+          if (orientation === "right") {
+            return /* @__PURE__ */ jsx(ChevronRightIcon, { className: cn("size-4", className2), ...props2 });
+          }
+          return /* @__PURE__ */ jsx(ChevronDownIcon, { className: cn("size-4", className2), ...props2 });
+        },
+        DayButton: ({ ...props2 }) => /* @__PURE__ */ jsx(CalendarDayButton, { locale, ...props2 }),
+        WeekNumber: ({ children, ...props2 }) => {
+          return /* @__PURE__ */ jsx("td", { ...props2, children: /* @__PURE__ */ jsx("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) });
+        },
+        ...components
       },
-      components: resolvedComponents,
       ...props
     }
   );
@@ -4524,9 +4507,6 @@ function CalendarDayButton({
   useEffect(() => {
     if (modifiers.focused) ref.current?.focus();
   }, [modifiers.focused]);
-  const isPreviewEdge = Boolean(
-    (modifiers.preview_start || modifiers.preview_end) && !modifiers.selected
-  );
   return /* @__PURE__ */ jsx(
     Button,
     {
@@ -4538,10 +4518,8 @@ function CalendarDayButton({
       "data-range-start": modifiers.range_start,
       "data-range-end": modifiers.range_end,
       "data-range-middle": modifiers.range_middle,
-      "data-preview-middle": Boolean(modifiers.preview_middle),
-      "data-preview-edge": isPreviewEdge,
       className: cn(
-        "group-data-[focused=true]/day:ring-primary/40 data-[preview-edge=true]:ring-primary/50 data-[preview-edge=true]:text-primary data-[preview-middle=true]:text-primary data-[range-end=true]:!bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:!bg-primary/8 data-[range-middle=true]:text-foreground data-[range-start=true]:!bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:!bg-primary data-[selected-single=true]:text-primary-foreground relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 !rounded-md border-0 !bg-transparent leading-none font-normal transition-colors duration-150 group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:rounded-md group-data-[focused=true]/day:ring-[2px] hover:!bg-transparent data-[preview-edge=true]:rounded-md data-[preview-edge=true]:font-medium data-[preview-edge=true]:ring-[2px] data-[preview-middle=true]:font-medium data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[selected-single=true]:rounded-md [&>span]:text-xs [&>span]:font-medium [&>span]:opacity-75",
+        "group-data-[focused=true]/day:ring-primary/40 data-[range-end=true]:!bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:!bg-primary/8 data-[range-middle=true]:text-foreground data-[range-start=true]:!bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:!bg-primary data-[selected-single=true]:text-primary-foreground relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 !rounded-md border-0 !bg-transparent leading-none font-normal transition-colors duration-150 group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:rounded-md group-data-[focused=true]/day:ring-[2px] hover:!bg-transparent data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md data-[selected-single=true]:rounded-md [&>span]:text-xs [&>span]:font-medium [&>span]:opacity-75",
         defaultClassNames.day,
         className
       ),
@@ -4549,79 +4527,30 @@ function CalendarDayButton({
     }
   );
 }
-function DatePicker(props) {
-  const {
-    placeholder = "Pick a date",
-    disabled = false,
-    className,
-    fromDate,
-    toDate,
-    numberOfMonths = 1
-  } = props;
+function DatePicker({
+  mode = "single",
+  selected,
+  onSelect,
+  placeholder = "Pick a date",
+  disabled = false,
+  className,
+  fromDate,
+  toDate
+}) {
   const [open, setOpen] = useState(false);
-  const [awaitingRangeEnd, setAwaitingRangeEnd] = useState(false);
-  const [previewDate, setPreviewDate] = useState(void 0);
   const label = useMemo(() => {
-    if (props.mode === "range") {
-      const range = props.selected;
-      if (!range?.from) return placeholder;
-      if (!range.to) return `${format(range.from, "MMM d, yyyy")} \u2013 \u2026`;
-      return `${format(range.from, "MMM d, yyyy")} \u2013 ${format(range.to, "MMM d, yyyy")}`;
-    }
-    return props.selected ? format(props.selected, "MMM d, yyyy") : placeholder;
-  }, [props.mode, props.selected, placeholder]);
-  const handleOpenChange = (nextOpen) => {
-    setOpen(nextOpen);
-    if (!nextOpen) {
-      setAwaitingRangeEnd(false);
-      setPreviewDate(void 0);
-    }
-  };
-  const handleRangeSelect = (range, triggerDate) => {
-    if (props.mode !== "range") return;
-    const emit = props.onSelect;
-    if (!awaitingRangeEnd) {
-      setAwaitingRangeEnd(true);
-      emit?.({ from: triggerDate, to: void 0 });
-      return;
-    }
-    emit?.(range);
-    if (!range?.from || !range.to) {
-      setAwaitingRangeEnd(!!range?.from);
-      return;
-    }
-    setAwaitingRangeEnd(false);
-    setPreviewDate(void 0);
-    setOpen(false);
-  };
-  const rangeFrom = props.mode === "range" ? props.selected?.from : void 0;
-  const previewModifiers = useMemo(() => {
-    if (!awaitingRangeEnd || !rangeFrom || !previewDate) return void 0;
-    if (isSameDay(rangeFrom, previewDate)) return void 0;
-    const [start, end] = previewDate < rangeFrom ? [previewDate, rangeFrom] : [rangeFrom, previewDate];
-    return {
-      preview_start: start,
-      preview_middle: { after: start, before: end },
-      preview_end: end
-    };
-  }, [awaitingRangeEnd, rangeFrom, previewDate]);
-  const handleDayPreview = (day, dayModifiers) => {
-    if (!awaitingRangeEnd) return;
-    if (dayModifiers.disabled || dayModifiers.hidden) return;
-    setPreviewDate((current) => current && isSameDay(current, day) ? current : day);
-  };
-  const dateConstraints = useMemo(() => {
-    const disabledMatchers = [];
-    if (fromDate) disabledMatchers.push({ before: fromDate });
-    if (toDate) disabledMatchers.push({ after: toDate });
-    return {
-      ...disabledMatchers.length > 0 && { disabled: disabledMatchers },
-      ...fromDate && { startMonth: fromDate },
-      ...toDate && { endMonth: toDate }
-    };
-  }, [fromDate, toDate]);
-  const hasValue = props.mode === "range" ? !!props.selected?.from : !!props.selected;
-  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+    if (mode === "range") {
+      const range = selected;
+      if (range?.from && range?.to)
+        return `${format(range.from, "MMM d, yyyy")} \u2013 ${format(range.to, "MMM d, yyyy")}`;
+      if (range?.from) return `${format(range.from, "MMM d, yyyy")} \u2013 \u2026`;
+      return placeholder;
+    }
+    const date = selected;
+    return date ? format(date, "MMM d, yyyy") : placeholder;
+  }, [mode, selected, placeholder]);
+  const hasValue = mode === "range" ? !!selected?.from : !!selected;
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
       Button,
       {
@@ -4639,36 +4568,36 @@ function DatePicker(props) {
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx(PopoverContent, { "data-slot": "date-picker-content", className: "w-auto p-0", align: "start", children: props.mode === "range" ? (
-      // Clearing the preview on the wrapper instead of per day
-      // avoids the blank frame `onDayMouseLeave` would cause when
-      // the pointer travels from one day to the next.
-      /* @__PURE__ */ jsx("div", { onMouseLeave: () => setPreviewDate(void 0), children: /* @__PURE__ */ jsx(
-        Calendar,
-        {
+    /* @__PURE__ */ jsx(PopoverContent, { "data-slot": "date-picker-content", className: "w-auto p-0", align: "start", children: mode === "range" ? /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        ...{
           mode: "range",
-          selected: props.selected,
-          onSelect: handleRangeSelect,
-          modifiers: previewModifiers,
-          onDayMouseEnter: handleDayPreview,
-          onDayFocus: handleDayPreview,
-          numberOfMonths,
-          autoFocus: true,
-          ...dateConstraints
+          selected,
+          onSelect: (range) => {
+            onSelect?.(range);
+            if (range?.to) setOpen(false);
+          },
+          fromDate,
+          toDate,
+          numberOfMonths: 2,
+          initialFocus: true
         }
-      ) })
+      }
     ) : /* @__PURE__ */ jsx(
       Calendar,
       {
-        mode: "single",
-        selected: props.selected,
-        onSelect: (date) => {
-          props.onSelect?.(date);
-          setOpen(false);
-        },
-        numberOfMonths,
-        autoFocus: true,
-        ...dateConstraints
+        ...{
+          mode: "single",
+          selected,
+          onSelect: (date) => {
+            onSelect?.(date);
+            setOpen(false);
+          },
+          fromDate,
+          toDate,
+          initialFocus: true
+        }
       }
     ) })
   ] });
@@ -5110,8 +5039,6 @@ function NavigationMenuIndicator({
     }
   );
 }
-
-// src/components/authorization/policy.ts
 function matchPermission(pattern, permission) {
   if (pattern === "*") return true;
   if (pattern === permission) return true;
@@ -5127,46 +5054,41 @@ function matchesAny(permissionSet, permission) {
   }
   return false;
 }
-function can(permissionSet, perms, mode = "any") {
-  const list = Array.isArray(perms) ? perms : [perms];
-  if (list.length === 0) return false;
-  if (permissionSet.has("*")) return true;
-  if (mode === "all") {
-    return list.every((p) => matchesAny(permissionSet, p));
-  }
-  return list.some((p) => matchesAny(permissionSet, p));
-}
 var AbilityContext = createContext(void 0);
 AbilityContext.displayName = "AbilityContext";
 function AbilityProvider({ children, permissions }) {
   const [permissionSet, setPermissionSet] = useState(
     () => new Set(permissions ?? [])
   );
-  const [imperativelyResolved, setImperativelyResolved] = useState(false);
-  const status = permissions !== void 0 || imperativelyResolved ? "ready" : "loading";
-  const can2 = useCallback(
-    (perms, mode = "any") => can(permissionSet, perms, mode),
+  const can = useCallback(
+    (perms, mode = "any") => {
+      const list = Array.isArray(perms) ? perms : [perms];
+      if (list.length === 0) return false;
+      if (permissionSet.has("*")) return true;
+      if (mode === "all") {
+        return list.every((p) => matchesAny(permissionSet, p));
+      }
+      return list.some((p) => matchesAny(permissionSet, p));
+    },
     [permissionSet]
   );
   const setAbilities = useCallback((perms) => {
     setPermissionSet(new Set(perms));
-    setImperativelyResolved(true);
   }, []);
   const clearAbilities = useCallback(() => {
     setPermissionSet(/* @__PURE__ */ new Set());
-    setImperativelyResolved(true);
   }, []);
-  const permissionKey = permissions === void 0 ? null : [...permissions].sort().join("|");
-  const syncedKey = useRef(permissionKey);
+  const syncedKey = useRef(permissions ? permissions.join("|") : null);
   useEffect(() => {
-    if (permissionKey === null) return;
-    if (permissionKey === syncedKey.current) return;
-    syncedKey.current = permissionKey;
+    if (permissions === void 0) return;
+    const key = permissions.join("|");
+    if (key === syncedKey.current) return;
+    syncedKey.current = key;
     setPermissionSet(new Set(permissions));
-  }, [permissionKey, permissions]);
+  }, [permissions]);
   const value = useMemo(
-    () => ({ can: can2, setAbilities, clearAbilities, status }),
-    [can2, setAbilities, clearAbilities, status]
+    () => ({ can, setAbilities, clearAbilities }),
+    [can, setAbilities, clearAbilities]
   );
   return /* @__PURE__ */ jsx(AbilityContext.Provider, { value, children });
 }
@@ -5178,176 +5100,21 @@ function useAbility() {
   return context;
 }
 function useCan(permissions, mode = "any") {
-  const { can: can2 } = useAbility();
-  return can2(permissions, mode);
+  const { can } = useAbility();
+  return can(permissions, mode);
 }
-function useAbilityStatus() {
-  return useAbility().status;
-}
-
-// src/components/authorization/permissions.generated.ts
-var KNOWN_PERMISSIONS = [];
-
-// src/components/authorization/permission-catalog.ts
-var CATALOG = new Set(KNOWN_PERMISSIONS);
-var warned = /* @__PURE__ */ new Set();
-function warnUnknownPermission(permission) {
-  if (process.env.NODE_ENV === "production") return;
-  if (CATALOG.size === 0) return;
-  const requested = Array.isArray(permission) ? permission : [permission];
-  for (const entry of requested) {
-    if (entry.includes("*")) continue;
-    if (CATALOG.has(entry) || warned.has(entry)) continue;
-    warned.add(entry);
-    console.warn(
-      `[Can] Unknown permission "${entry}". It is not in the generated permission catalog. Check for a typo, or regenerate the catalog with \`pnpm generate-permissions\`.`
-    );
-  }
-}
-var FOCUS_TRAVERSAL_KEYS = /* @__PURE__ */ new Set(["Tab", "Escape"]);
-function blockInteraction(event) {
-  event.preventDefault();
-  event.stopPropagation();
-}
-function blockNonTraversalKey(event) {
-  if (!FOCUS_TRAVERSAL_KEYS.has(event.key)) blockInteraction(event);
-}
-var warnedRenderPropMisuse = /* @__PURE__ */ new Set();
-function warnRenderPropVoidsProps(voided) {
-  if (process.env.NODE_ENV === "production") return;
-  if (voided.length === 0) return;
-  const key = voided.join(",");
-  if (warnedRenderPropMisuse.has(key)) return;
-  warnedRenderPropMisuse.add(key);
-  console.warn(
-    `[Can] \`children\` is a function, so ${voided.map((prop) => `\`${prop}\``).join(", ")} ${voided.length === 1 ? "is" : "are"} ignored. A render prop owns every state: read \`allowed\` and \`status\` and render the disabled, loading and denied cases yourself, or pass an element instead of a function.`
-  );
-}
-function disableElement(child) {
-  return cloneElement(child, {
-    "aria-disabled": "true",
-    className: cn(child.props.className, "cursor-not-allowed opacity-50"),
-    onClickCapture: blockInteraction,
-    onKeyDownCapture: blockNonTraversalKey,
-    onKeyUpCapture: blockNonTraversalKey,
-    onPointerDownCapture: blockInteraction,
-    onMouseDownCapture: blockInteraction
-  });
-}
-function InteractionFirewall({ children }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "data-slot": "can-blocked",
-      className: "contents",
-      onClickCapture: blockInteraction,
-      onPointerDownCapture: blockInteraction,
-      onMouseDownCapture: blockInteraction,
-      onKeyDownCapture: blockNonTraversalKey,
-      onKeyUpCapture: blockNonTraversalKey,
-      children
-    }
-  );
-}
-function DisabledSubtree({
-  children,
-  className,
-  ...props
-}) {
-  const { "data-slot": _incomingDataSlot, ...restProps } = props;
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      "data-slot": "can-disabled",
-      "aria-disabled": "true",
-      className: cn(
-        "inline-flex cursor-not-allowed opacity-50",
-        "*:pointer-events-none",
-        className
-      ),
-      onClickCapture: blockInteraction,
-      onPointerDownCapture: blockInteraction,
-      onMouseDownCapture: blockInteraction,
-      onKeyDownCapture: blockNonTraversalKey,
-      onKeyUpCapture: blockNonTraversalKey,
-      ...restProps,
-      children
-    }
-  );
-}
-function Can({
-  permission,
-  mode = "any",
-  negate = false,
-  behavior = "hide",
-  reason = null,
-  fallback = null,
-  loading,
-  children
-}) {
-  warnUnknownPermission(permission);
-  const { can: can2, status } = useAbility();
-  const hasPermission = status === "ready" && can2(permission, mode);
+function Can({ permission, mode = "any", negate = false, fallback = null, children }) {
+  const { can } = useAbility();
+  const hasPermission = can(permission, mode);
   const show = negate ? !hasPermission : hasPermission;
   if (typeof children === "function") {
-    warnRenderPropVoidsProps([
-      ...behavior === "disable" ? ["behavior='disable'"] : [],
-      ...reason !== null ? ["reason"] : [],
-      ...fallback !== null ? ["fallback"] : [],
-      ...loading !== void 0 ? ["loading"] : []
-    ]);
-    return /* @__PURE__ */ jsx(Fragment$1, { children: children({ allowed: show, status }) });
-  }
-  if (status === "loading" && loading !== void 0) {
-    return /* @__PURE__ */ jsx(Fragment$1, { children: loading });
-  }
-  if (show) {
-    return /* @__PURE__ */ jsx(Fragment$1, { children });
+    return /* @__PURE__ */ jsx(Fragment$1, { children: children(show) });
   }
-  if (behavior === "disable") {
-    if (isValidElement(children) && children.type !== Fragment) {
-      const disabledChild = disableElement(children);
-      if (reason === null) {
-        return /* @__PURE__ */ jsx(InteractionFirewall, { children: disabledChild });
-      }
-      return /* @__PURE__ */ jsxs(Tooltip, { children: [
-        /* @__PURE__ */ jsx(InteractionFirewall, { children: /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: disabledChild }) }),
-        /* @__PURE__ */ jsx(TooltipContent, { children: reason })
-      ] });
-    }
-    if (reason === null) {
-      return /* @__PURE__ */ jsx(DisabledSubtree, { children });
-    }
-    return /* @__PURE__ */ jsxs(Tooltip, { children: [
-      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(DisabledSubtree, { children }) }),
-      /* @__PURE__ */ jsx(TooltipContent, { children: reason })
-    ] });
-  }
-  return /* @__PURE__ */ jsx(Fragment$1, { children: fallback });
+  return show ? /* @__PURE__ */ jsx(Fragment$1, { children }) : /* @__PURE__ */ jsx(Fragment$1, { children: fallback });
 }
 Can.displayName = "Can";
-function CanNot({
-  permission,
-  mode = "any",
-  behavior = "hide",
-  reason = null,
-  fallback = null,
-  loading,
-  children
-}) {
-  return /* @__PURE__ */ jsx(
-    Can,
-    {
-      permission,
-      mode,
-      negate: true,
-      behavior,
-      reason,
-      fallback,
-      loading,
-      children
-    }
-  );
+function CanNot({ permission, mode = "any", fallback = null, children }) {
+  return /* @__PURE__ */ jsx(Can, { permission, mode, negate: true, fallback, children });
 }
 CanNot.displayName = "CanNot";
 function useMediaQuery(query) {
@@ -7079,6 +6846,7 @@ function useAppForm(schema, options) {
 // src/lib/cdn.ts
 var CDN_BASE = "https://dibt9vplwriap.cloudfront.net";
 var logos = {
+  // Total Civil
   color: `${CDN_BASE}/logos/Logo_Total_Color.webp`,
   colorAna: `${CDN_BASE}/logos/Logo_Total_Color-ANA.webp`,
   colorAnaa: `${CDN_BASE}/logos/Logo_Total_Color-ANAA.webp`,
@@ -7086,7 +6854,11 @@ var logos = {
   positive: `${CDN_BASE}/logos/Logo_Total_Positive.webp`,
   grayScale: `${CDN_BASE}/logos/Logo_Total_gray_scale.webp`,
   monochBlack: `${CDN_BASE}/logos/Logo_Total_monochB.webp`,
-  monochOrange: `${CDN_BASE}/logos/Logo_Total_monochO.webp`
+  monochOrange: `${CDN_BASE}/logos/Logo_Total_monochO.webp`,
+  isotype: `${CDN_BASE}/logos/Isotipo_Total_Color.webp`,
+  // Total Millwork
+  millworkColor: `${CDN_BASE}/logos/Logo_Millwork_Color.webp`,
+  millworkNegative: `${CDN_BASE}/logos/Logo_Millwork_Negative.webp`
 };
 function Table({
   className,
@@ -7144,7 +6916,7 @@ function TableHead({ className, ...props }) {
     {
       "data-slot": "table-head",
       className: cn(
-        "text-foreground has-[[role=checkbox]]:pr-0 h-12 px-3 text-left align-middle font-medium whitespace-nowrap",
+        "text-foreground has([role=checkbox])]:pr-0 h-12 px-3 text-left align-middle font-medium whitespace-nowrap",
         className
       ),
       ...props
@@ -7157,7 +6929,7 @@ function TableCell({ className, ...props }) {
     {
       "data-slot": "table-cell",
       className: cn(
-        "has-[[role=checkbox]]:pr-0 p-3 align-middle whitespace-nowrap",
+        "has([role=checkbox])]:pr-0 p-3 align-middle whitespace-nowrap",
         className
       ),
       ...props
@@ -7418,13 +7190,6 @@ function useTableContext() {
 function useTableContextSafe() {
   return useContext(TableContext);
 }
-
-// src/components/compounds/Table/cell-size-class.ts
-var cellSizeClass = {
-  sm: "px-3 py-1.5 text-xs",
-  md: "px-5 py-2.5 text-sm",
-  lg: "px-6 py-3 text-sm"
-};
 var cardPadding = {
   sm: "p-3",
   md: "p-4",
@@ -7762,9 +7527,6 @@ function DataTableHeaderCell({ header }) {
       },
       className: cn(
         "bg-primary text-primary-foreground",
-        // Same density padding as the body cells: without it the header
-        // label and the cell value below it sit at different offsets.
-        cellSizeClass[meta.size ?? tableSize],
         canResize && "relative",
         meta.align === "center" && "text-center",
         meta.align === "right" && "text-right",
@@ -8154,6 +7916,11 @@ function useTablePersistence({
     persistDensity
   };
 }
+var cellSizeClass = {
+  sm: "px-1 py-0 text-xs",
+  md: "px-5 py-2.5 text-sm",
+  lg: "px-6 py-3 text-sm"
+};
 function resolveClassName(value, row) {
   return typeof value === "function" ? value(row) : value;
 }
@@ -8194,13 +7961,6 @@ function DataTableCell({
     }
   );
 }
-var INTERACTIVE_CELL_CONTENT = 'button, a, input, select, textarea, [role="button"], [role="checkbox"], [role="menuitem"], [role="link"]';
-function isInteractiveCellEvent(event) {
-  const target = event.target;
-  if (!(target instanceof Element)) return false;
-  const match = target.closest(INTERACTIVE_CELL_CONTENT);
-  return match !== null && match !== event.currentTarget;
-}
 function DataTableRow({ row, classNames }) {
   const { onRowClick, variant } = useTableContext();
   const clickable = Boolean(onRowClick);
@@ -8213,15 +7973,12 @@ function DataTableRow({ row, classNames }) {
       "data-clickable": clickable || void 0,
       role: clickable ? "button" : void 0,
       tabIndex: clickable ? 0 : void 0,
-      onClick: clickable ? (e) => {
-        if (isInteractiveCellEvent(e)) return;
-        onRowClick?.(row.original);
-      } : void 0,
+      onClick: clickable ? () => onRowClick?.(row.original) : void 0,
       onKeyDown: clickable ? (e) => {
-        if (e.key !== "Enter" && e.key !== " ") return;
-        if (isInteractiveCellEvent(e)) return;
-        e.preventDefault();
-        onRowClick?.(row.original);
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onRowClick?.(row.original);
+        }
       } : void 0,
       className: cn("hover:bg-muted", clickable && "cursor-pointer", rowClassName),
       children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx(DataTableCell, { cell, cellClassName }, cell.id))
@@ -8822,7 +8579,7 @@ function DataTableFooter({ pagination, selectedCount, className }) {
       className: cn("flex items-center justify-between border-t px-4 py-2", className),
       children: [
         selectedCount != null && selectedCount > 0 && /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "text-muted-foreground text-xs", children: `${selectedCount} row${selectedCount > 1 ? "s" : ""} selected` }),
-        /* @__PURE__ */ jsx("div", { className: "ml-auto", children: /* @__PURE__ */ jsx(TablePagination, { ...pagination }) })
+        /* @__PURE__ */ jsx(TablePagination, { ...pagination })
       ]
     }
   );
@@ -8931,21 +8688,18 @@ function DataTableSearch({
   debounce = 300
 }) {
   const ctx = useTableContextSafe();
+  const [inputValue, setInputValue] = useState("");
   const globalFilter = ctx?.globalFilter;
   const setGlobalFilter = ctx?.setGlobalFilter;
-  const committedValue = globalFilter ?? "";
-  const [inputValue, setInputValue] = useState(committedValue);
   useEffect(() => {
-    if (globalFilter === void 0) return;
-    setInputValue(globalFilter);
+    if (globalFilter === "") setInputValue("");
   }, [globalFilter]);
   useEffect(() => {
-    if (inputValue === committedValue) return;
     const timer = setTimeout(() => {
       setGlobalFilter?.(inputValue);
     }, debounce);
     return () => clearTimeout(timer);
-  }, [inputValue, committedValue, debounce, setGlobalFilter]);
+  }, [inputValue, debounce, setGlobalFilter]);
   const handleClear = () => {
     setInputValue("");
     setGlobalFilter?.("");
@@ -8966,13 +8720,7 @@ function DataTableSearch({
         onChange: (e) => setInputValue(e.target.value),
         placeholder,
         "aria-label": placeholder,
-        className: cn(
-          "h-8 w-48 pr-9 pl-9 text-sm",
-          "[&::-webkit-search-cancel-button]:appearance-none",
-          "[&::-webkit-search-decoration]:appearance-none",
-          "[&::-webkit-search-results-button]:appearance-none",
-          "[&::-webkit-search-results-decoration]:appearance-none"
-        )
+        className: "h-8 w-48 pr-8 pl-8 text-sm"
       }
     ),
     inputValue && /* @__PURE__ */ jsx(
@@ -8982,7 +8730,7 @@ function DataTableSearch({
         size: "icon-sm",
         onClick: handleClear,
         "aria-label": "Clear search",
-        className: "text-muted-foreground hover:text-foreground absolute top-1/2 right-1.5 size-6 -translate-y-1/2",
+        className: "text-muted-foreground hover:text-foreground absolute right-0.5 size-6",
         children: /* @__PURE__ */ jsx(X, { className: "size-3.5", "aria-hidden": "true" })
       }
     )
@@ -9367,6 +9115,6 @@ function TCCEProvider({
   return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: tooltipDelayDuration, children: /* @__PURE__ */ jsx(AbilityProvider, { permissions, children: /* @__PURE__ */ jsx(Toaster, { position: toasterPosition, children }) }) });
 }
 
-export { AbilityProvider, Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge2 as Badge, BottomNav, BottomNavTabs, BottomNavTabsContent, BottomNavTabsList, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Can, CanNot, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHue, ColorPickerOutput, ColorPickerPresets, ColorPickerSelection, Combobox, DataTable, DataTableCardView, DataTableColumnFilter, DataTableFooter, DataTableHeaderCell, DataTableRowActions, DataTableSearch, DataTableSkeleton, DataTableToolbar, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Dropzone, DropzoneContent, DropzoneEmptyState, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EventCalendar, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, FilterOption, Input, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, KNOWN_PERMISSIONS, Label, Link, Logo, MiniCalendar, MiniCalendarDay, MiniCalendarDays, MiniCalendarNavigation, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PhoneField, PinInput, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SegmentedControl, SegmentedControlItem, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, SpinnerDots, SpinnerLoader, Status, StatusIndicator, StatusLabel, Switch, TCCEProvider, TEXT_SIZES, TEXT_WEIGHTS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TablePagination, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, Textarea, Toaster, Toggle, ToggleGroup2 as ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, animation, avatarVariants, badgeVariants2 as badgeVariants, buttonVariants, columnFiltersToArrayQueryParams, columnFiltersToJsonString, columnFiltersToQueryParams, columnFiltersToRecord, createBackendParams, createBackendParamsWithFilters, duration, ease, fadeIn, getActiveFilterCount, getActiveFilterValues, getColumnValueCounts, getUniqueColumnValues, hasActiveFilters, linkVariants, logos, matchPermission, mergeFilters, multiSelectFilter, navigationMenuTriggerStyle, parseJsonToFilters, parseQueryParamsToFilters, progressIndicatorVariants, progressVariants, scaleIn, searchInArray, skeletonVariants, slideRight, slideUp, sortRecordToSortingState, sortingStateToJsonString, sortingStateToRecord, spinnerDotsVariants, spinnerLoaderVariants, spinnerVariants, spring, stagger, toggleVariants, tooltipContentVariants, transition, useAbility, useAbilityStatus, useAppForm, useCan, useCarousel, useColorPicker, useColumnFilter, useSidebar, useTableContext, useTableData, useTableFiltering, useTableGlobalFilter, useTableSizing, useTableSorting, useTableVisibility, useToast, validatePhone };
+export { AbilityProvider, Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge2 as Badge, BottomNav, BottomNavTabs, BottomNavTabsContent, BottomNavTabsList, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Can, CanNot, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHue, ColorPickerOutput, ColorPickerPresets, ColorPickerSelection, Combobox, DataTable, DataTableCardView, DataTableColumnFilter, DataTableFooter, DataTableHeaderCell, DataTableRowActions, DataTableSearch, DataTableSkeleton, DataTableToolbar, DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Dropzone, DropzoneContent, DropzoneEmptyState, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, EventCalendar, Field, FieldDescription, FieldError, FieldGroup, FieldLabel, FilterOption, Input, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Label, Link, Logo, MiniCalendar, MiniCalendarDay, MiniCalendarDays, MiniCalendarNavigation, Navbar, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PhoneField, PinInput, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SegmentedControl, SegmentedControlItem, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, SpinnerDots, SpinnerLoader, Status, StatusIndicator, StatusLabel, Switch, TCCEProvider, TEXT_SIZES, TEXT_WEIGHTS, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TablePagination, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, Textarea, Toaster, Toggle, ToggleGroup2 as ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, animation, avatarVariants, badgeVariants2 as badgeVariants, buttonVariants, columnFiltersToArrayQueryParams, columnFiltersToJsonString, columnFiltersToQueryParams, columnFiltersToRecord, createBackendParams, createBackendParamsWithFilters, duration, ease, fadeIn, getActiveFilterCount, getActiveFilterValues, getColumnValueCounts, getUniqueColumnValues, hasActiveFilters, linkVariants, logos, matchPermission, mergeFilters, multiSelectFilter, navigationMenuTriggerStyle, parseJsonToFilters, parseQueryParamsToFilters, progressIndicatorVariants, progressVariants, scaleIn, searchInArray, skeletonVariants, slideRight, slideUp, sortRecordToSortingState, sortingStateToJsonString, sortingStateToRecord, spinnerDotsVariants, spinnerLoaderVariants, spinnerVariants, spring, stagger, toggleVariants, tooltipContentVariants, transition, useAbility, useAppForm, useCan, useCarousel, useColorPicker, useColumnFilter, useSidebar, useTableContext, useTableData, useTableFiltering, useTableGlobalFilter, useTableSizing, useTableSorting, useTableVisibility, useToast, validatePhone };
 //# sourceMappingURL=main.js.map
 //# sourceMappingURL=main.js.map