@exxatdesignux/ui 0.5.5 → 0.5.7

package/dist/components/ui/badge.d.ts

@@ -4,7 +4,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
     asChild?: boolean;

package/dist/components/ui/banner.d.ts

@@ -4,9 +4,9 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const systemBannerVariants: (props?: ({
-    variant?: "success" | "warning" | "error" | "info" | "promo" | null | undefined;
+    variant?: "error" | "success" | "warning" | "info" | "promo" | null | undefined;
     emphasis?: "prominent" | "subtle" | null | undefined;
-    actionPosition?: "inline" | "bottom" | null | undefined;
+    actionPosition?: "bottom" | "inline" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface SystemBannerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof systemBannerVariants> {
     /** Banner title (optional — adds a bold heading) */
@@ -32,7 +32,7 @@ interface SystemBannerProps extends React.HTMLAttributes<HTMLDivElement>, Varian
 }
 declare function SystemBanner({ children, title, variant, emphasis, dismissible, onDismiss, action, actionPosition, icon, decorativeOverlay, className, style, ...props }: SystemBannerProps): react_jsx_runtime.JSX.Element | null;
 declare const localBannerVariants: (props?: ({
-    variant?: "success" | "warning" | "error" | "info" | "promo" | null | undefined;
+    variant?: "error" | "success" | "warning" | "info" | "promo" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface LocalBannerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof localBannerVariants> {
     /** Banner title (optional) */

package/dist/components/ui/button.d.ts

@@ -3,11 +3,11 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare const Button: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<(props?: ({
-    variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
+    variant?: "link" | "default" | "outline" | "secondary" | "ghost" | "destructive" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string> & {
     asChild?: boolean;

package/dist/components/ui/tabs.d.ts

@@ -6,7 +6,7 @@ import { Tabs as Tabs$1 } from 'radix-ui';
 
 declare function Tabs({ className, orientation, ...props }: React.ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
 declare const tabsListVariants: (props?: ({
-    variant?: "default" | "line" | null | undefined;
+    variant?: "line" | "default" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function TabsList({ className, variant, ...props }: React.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
 declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof Tabs$1.Trigger>): react_jsx_runtime.JSX.Element;

package/dist/hooks/use-app-theme.d.ts

@@ -10,7 +10,7 @@ declare function useAppTheme(): {
     brand: Brand;
     setBrand: (b: Brand) => void;
     /** The user's preference: "system" | "normal" | "high" | "windows" */
-    contrastPref: "system" | "normal" | "high" | "windows";
+    contrastPref: "normal" | "high" | "system" | "windows";
     /** The resolved contrast mode actually applied to the DOM. */
     contrast: ContrastMode;
     /** Set the contrast preference. */

package/dist/index.js

@@ -1905,15 +1905,6 @@ function useTableState(data, columns, defaultSort, paginationOverride, syncedSea
     });
     return [...groups.entries()].sort(([a], [b]) => a.localeCompare(b)).map(([key, groupRows]) => ({ groupKey: key, groupLabel: key, rows: groupRows }));
   }, [rows, groupBy]);
-  const LOCKED_KEYS = React10.useMemo(() => new Set(Object.keys(lockedPins)), [lockedPins]);
-  const effectivePins = React10.useMemo(() => {
-    if (isReflowViewport || !isOverflowing) return {};
-    const result = {};
-    for (const [key, pin] of Object.entries(colPins)) {
-      result[key] = pin;
-    }
-    return result;
-  }, [colPins, isOverflowing, isReflowViewport]);
   const displayCols = React10.useMemo(() => {
     const leftPinned = [];
     const free = [];
@@ -1933,6 +1924,19 @@ function useTableState(data, columns, defaultSort, paginationOverride, syncedSea
     }
     return out;
   }, [colOrder, colPins, hiddenCols, columnsByKey]);
+  const totalWidth = React10.useMemo(
+    () => displayCols.reduce((s, c) => s + (colWidths[c.key] ?? c.width ?? 100), 0),
+    [displayCols, colWidths]
+  );
+  const LOCKED_KEYS = React10.useMemo(() => new Set(Object.keys(lockedPins)), [lockedPins]);
+  const effectivePins = React10.useMemo(() => {
+    if (isReflowViewport || !isOverflowing) return {};
+    const result = {};
+    for (const [key, pin] of Object.entries(colPins)) {
+      result[key] = pin;
+    }
+    return result;
+  }, [colPins, isOverflowing, isReflowViewport]);
   function startResize(key, e) {
     e.preventDefault();
     e.stopPropagation();
@@ -1993,18 +1997,21 @@ function useTableState(data, columns, defaultSort, paginationOverride, syncedSea
   function toggleWrap(key) {
     setColWrap((p) => ({ ...p, [key]: !p[key] }));
   }
-  function checkOverflow() {
+  const checkOverflow = React10.useCallback(() => {
     const el = scrollRef.current;
     if (!el) return;
-    setIsOverflowing(el.scrollWidth > el.clientWidth + 1);
-  }
+    setIsOverflowing(totalWidth > el.clientWidth + 1);
+  }, [totalWidth]);
   function handleScroll() {
     const el = scrollRef.current;
     if (!el) return;
     setScrolled(el.scrollLeft > 1);
     setScrollEnd(el.scrollLeft >= el.scrollWidth - el.clientWidth - 1);
-    setIsOverflowing(el.scrollWidth > el.clientWidth + 1);
+    setIsOverflowing(totalWidth > el.clientWidth + 1);
   }
+  React10.useLayoutEffect(() => {
+    checkOverflow();
+  }, [checkOverflow]);
   function getRowId(row, index, getIdFn) {
     return getIdFn ? getIdFn(row, index) : row.id ?? index;
   }
@@ -2057,10 +2064,6 @@ function useTableState(data, columns, defaultSort, paginationOverride, syncedSea
     },
     [effectivePins, isReflowViewport, stickyOffsets]
   );
-  const totalWidth = React10.useMemo(
-    () => displayCols.reduce((s, c) => s + (colWidths[c.key] ?? c.width ?? 100), 0),
-    [displayCols, colWidths]
-  );
   return {
     // Sort
     sortRules,
@@ -2800,7 +2803,7 @@ function DataTableInner({
     setSheetOpen,
     setSheetInitialPanel
   } = state;
-  React10.useEffect(() => {
+  React10.useLayoutEffect(() => {
     const syncScrollport = () => {
       const el2 = scrollRef.current;
       if (el2) {
@@ -2813,8 +2816,10 @@ function DataTableInner({
     if (!el) return;
     const ro = new ResizeObserver(syncScrollport);
     ro.observe(el);
+    const table = el.querySelector("table");
+    if (table) ro.observe(table);
     return () => ro.disconnect();
-  }, []);
+  }, [totalWidth, displayCols.length, checkOverflow, scrollRef]);
   const columnMenuPendingActionRef = React10.useRef(null);
   const pinnedScrollHintDoneRef = React10.useRef(false);
   React10.useEffect(() => {
@@ -3051,11 +3056,12 @@ function DataTableInner({
         children: /* @__PURE__ */ jsxs(
           "table",
           {
-            className: "w-full text-sm border-separate border-spacing-0",
+            className: "text-sm border-separate border-spacing-0",
             style: {
               tableLayout: "fixed",
-              minWidth: totalWidth,
-              width: headerIsStuck ? floatingHeaderTableWidth : void 0
+              // Explicit column-sum width — `w-full` made the grid stretch to the scrollport
+              // so scrollWidth === clientWidth and the overflow-gated pin rule never fired.
+              width: totalWidth
             },
             children: [
               /* @__PURE__ */ jsx("colgroup", { children: displayCols.map((col) => /* @__PURE__ */ jsx("col", { style: { width: colWidths[col.key] ?? col.width ?? 100 } }, col.key)) }),