@timmbr/ui 1.11.0 → 1.13.0

package/dist/components/ZoneProgress/ZoneProgress.js

@@ -0,0 +1,96 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { usePathname } from 'next/navigation';
+import { PageProgress } from '../PageProgress/PageProgress.js';
+
+function trickle(p) {
+  if (p < 20) return p + 5;
+  if (p < 50) return p + 3;
+  if (p < 70) return p + 2;
+  if (p < 85) return p + 1;
+  return p;
+}
+function ZoneProgress() {
+  const pathname = usePathname();
+  const [loading, setLoading] = React.useState(false);
+  const [progress, setProgress] = React.useState(void 0);
+  const tickRef = React.useRef(null);
+  const committedPathnameRef = React.useRef(pathname);
+  React.useLayoutEffect(() => {
+    committedPathnameRef.current = pathname;
+  });
+  const startProgress = React.useCallback(() => {
+    if (tickRef.current) clearInterval(tickRef.current);
+    setLoading(true);
+    setProgress(5);
+    tickRef.current = setInterval(() => {
+      setProgress((p) => p !== void 0 ? trickle(p) : p);
+    }, 200);
+  }, []);
+  const finishProgress = React.useCallback(() => {
+    if (tickRef.current) {
+      clearInterval(tickRef.current);
+      tickRef.current = null;
+    }
+    setProgress(100);
+    setTimeout(() => {
+      setLoading(false);
+      setProgress(void 0);
+    }, 400);
+  }, []);
+  React.useEffect(() => {
+    const handleClick = (e) => {
+      const anchor = e.target.closest("a");
+      if (!(anchor instanceof HTMLAnchorElement)) return;
+      if (e.defaultPrevented || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
+      if (anchor.target === "_blank") return;
+      const href = anchor.getAttribute("href");
+      if (!href || href.startsWith("#") || href.startsWith("javascript:")) return;
+      try {
+        const url = new URL(href, location.origin);
+        if (url.origin !== location.origin) return;
+        if (url.pathname + url.search === location.pathname + location.search) return;
+      } catch {
+        return;
+      }
+      startProgress();
+    };
+    const handlePopState = () => {
+      if (location.pathname !== committedPathnameRef.current) {
+        startProgress();
+      }
+    };
+    document.addEventListener("click", handleClick);
+    window.addEventListener("popstate", handlePopState);
+    return () => {
+      document.removeEventListener("click", handleClick);
+      window.removeEventListener("popstate", handlePopState);
+      if (tickRef.current) clearInterval(tickRef.current);
+    };
+  }, [startProgress]);
+  React.useEffect(() => {
+    if (loading) finishProgress();
+  }, [pathname, finishProgress]);
+  React.useEffect(() => {
+    const onHover = (e) => {
+      const a = e.target.closest('a[data-cross-zone="true"]');
+      if (!(a instanceof HTMLAnchorElement)) return;
+      const { href } = a;
+      if (!href) return;
+      const escaped = href.replace(/"/g, '\\"');
+      if (!document.querySelector(`link[rel="prefetch"][href="${escaped}"]`)) {
+        const el = document.createElement("link");
+        el.rel = "prefetch";
+        el.href = href;
+        document.head.appendChild(el);
+      }
+    };
+    document.addEventListener("mouseover", onHover);
+    return () => document.removeEventListener("mouseover", onHover);
+  }, []);
+  return /* @__PURE__ */ jsx(PageProgress, { loading, progress });
+}
+ZoneProgress.displayName = "ZoneProgress";
+
+export { ZoneProgress };

package/dist/components/ZoneProgress/index.d.ts

@@ -0,0 +1,2 @@
+export { ZoneProgress } from './ZoneProgress';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ZoneProgress/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ZoneProgress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/index.d.ts

@@ -6,6 +6,7 @@ export * from './components/Grid';
 export * from './components/Center';
 export * from './components/Stack';
 export * from './components/Inline';
+export * from './components/ScrollRail';
 export * from './components/Input';
 export * from './components/Textarea';
 export * from './components/Select';
@@ -48,6 +49,8 @@ export * from './components/Icon';
 export * from './components/Text';
 export * from './components/Alert';
 export * from './components/Progress';
+export * from './components/PageProgress';
+export * from './components/ZoneProgress';
 export * from './components/Spinner';
 export * from './components/Skeleton';
 export * from './components/EmptyState';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,gBAAgB,CAAC;AAC/B,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAG3D,cAAc,aAAa,CAAC;AAG5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AAGxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,gBAAgB,CAAC;AAC/B,YAAY,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAG3D,cAAc,aAAa,CAAC;AAG5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AAGxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AAGvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AAGxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC"}

package/dist/index.js

@@ -68,6 +68,7 @@ export { OptionPicker } from './components/OptionPicker/OptionPicker.js';
 export { OtpInput } from './components/OtpInput/OtpInput.js';
 export { PRICE_GROUP_KEY } from './components/FilterPanel/FilterPanel.types.js';
 export { PageHeader } from './components/PageHeader/PageHeader.js';
+export { PageProgress } from './components/PageProgress/PageProgress.js';
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PaginationSummary } from './components/Pagination/Pagination.js';
 export { Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger } from './components/Popover/Popover.js';
 export { Price, discountPercent } from './components/Price/Price.js';
@@ -80,6 +81,7 @@ export { RadioCard } from './components/RadioCard/RadioCard.js';
 export { RangeSlider } from './components/RangeSlider/RangeSlider.js';
 export { Rating } from './components/Rating/Rating.js';
 export { SNACKBAR_EXIT_MS, snackbar, snackbarStore } from './components/Snackbar/snackbarStore.js';
+export { ScrollRail } from './components/ScrollRail/ScrollRail.js';
 export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectSeparator, SelectTrigger, SelectValue } from './components/Select/Select.js';
 export { SideBarNavigation } from './components/SideBarNavigation/SideBarNavigation.js';
 export { SidebarBranding } from './components/SideBarNavigation/subcomponents/SidebarBranding.js';
@@ -112,6 +114,7 @@ export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastT
 export { ToastContainer } from './components/Toast/ToastContainer.js';
 export { Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipRoot, TooltipTrigger } from './components/Tooltip/Tooltip.js';
 export { VisuallyHidden } from './components/VisuallyHidden/VisuallyHidden.js';
+export { ZoneProgress } from './components/ZoneProgress/ZoneProgress.js';
 export { accordionContentVariants, accordionItemVariants, accordionTriggerVariants } from './components/Accordion/Accordion.styles.js';
 export { alertDialogBodyVariants, alertDialogContentVariants, alertDialogDescriptionVariants, alertDialogFooterVariants, alertDialogHeaderVariants, alertDialogMediaVariants, alertDialogOverlayVariants, alertDialogTitleVariants } from './components/AlertDialog/AlertDialog.styles.js';
 export { alertIconVariants, alertVariants } from './components/Alert/Alert.styles.js';
@@ -162,6 +165,7 @@ export { radioCardDotClass, radioCardMarkerClass, radioCardVariants } from './co
 export { radioIndicatorVariants, radioItemVariants } from './components/Radio/Radio.styles.js';
 export { rangeSliderRangeVariants, rangeSliderRootVariants, rangeSliderThumbVariants, rangeSliderTrackVariants } from './components/RangeSlider/RangeSlider.styles.js';
 export { ratingVariants } from './components/Rating/Rating.styles.js';
+export { scrollRailChevronVariants, scrollRailVariants, scrollRailWrapperVariants } from './components/ScrollRail/ScrollRail.styles.js';
 export { selectContentVariants, selectItemVariants, selectTriggerVariants } from './components/Select/Select.styles.js';
 export { skeletonVariants } from './components/Skeleton/Skeleton.styles.js';
 export { snackbarActionVariants, snackbarCloseVariants, snackbarHostVariants, snackbarIconVariants, snackbarVariants } from './components/Snackbar/Snackbar.styles.js';

package/dist/providers/AnimationProvider.d.ts

@@ -4,7 +4,11 @@ export interface AnimationProviderProps {
     disableAnimations?: boolean;
 }
 /**
- * Dual-layer animation provider satisfying the requirement for global toggle + component-level overrides.
+ * Dual-layer animation provider.
+ * Animations are disabled when:
+ *   - disableAnimations={true} is passed explicitly, OR
+ *   - the OS/browser has prefers-reduced-motion: reduce set.
+ * This is the single place that translates both signals into the DS motion system.
  */
 export declare const AnimationProvider: React.FC<AnimationProviderProps>;
 /**

package/dist/providers/AnimationProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimationProvider.d.ts","sourceRoot":"","sources":["../../src/providers/AnimationProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;GAEG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAuB9D,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,OASrC,CAAC"}
+{"version":3,"file":"AnimationProvider.d.ts","sourceRoot":"","sources":["../../src/providers/AnimationProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA0B9D,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,kBAAkB,QAAO,OASrC,CAAC"}

package/dist/providers/AnimationProvider.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import * as React from 'react';
+import { usePrefersReducedMotion } from '@timmbr/hooks';
 import { useTimmbrConfig } from './TimmbrConfigProvider.js';
 
 const AnimationContext = React.createContext(null);
@@ -8,11 +9,13 @@ const AnimationProvider = ({
   children,
   disableAnimations = false
 }) => {
+  const prefersReduced = usePrefersReducedMotion();
+  const animationsDisabled = disableAnimations || prefersReduced;
   React.useEffect(() => {
     if (typeof document !== "undefined") {
       document.documentElement.setAttribute(
         "data-animations-disabled",
-        disableAnimations ? "true" : "false"
+        animationsDisabled ? "true" : "false"
       );
     }
     return () => {
@@ -20,8 +23,8 @@ const AnimationProvider = ({
         document.documentElement.removeAttribute("data-animations-disabled");
       }
     };
-  }, [disableAnimations]);
-  return /* @__PURE__ */ jsx(AnimationContext.Provider, { value: { globalMotion: !disableAnimations }, children });
+  }, [animationsDisabled]);
+  return /* @__PURE__ */ jsx(AnimationContext.Provider, { value: { globalMotion: !animationsDisabled }, children });
 };
 const useGlobalAnimation = () => {
   const directContext = React.useContext(AnimationContext);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@timmbr/ui",
-  "version": "1.11.0",
+  "version": "1.13.0",
   "description": "High-performance, Next.js App Router-compatible UI design system components for Timmbr",
   "type": "module",
   "main": "./dist/index.js",
@@ -42,11 +42,11 @@
     "@radix-ui/react-tooltip": "^1.2.16",
     "class-variance-authority": "^0.7.1",
     "input-otp": "^1.5.0",
-    "@timmbr/hooks": "1.1.0",
     "@timmbr/icons": "1.6.0",
+    "@timmbr/hooks": "1.1.0",
     "@timmbr/theme": "1.3.0",
     "@timmbr/utils": "1.6.0",
-    "@timmbr/motion": "1.2.4"
+    "@timmbr/motion": "1.2.5"
   },
   "peerDependencies": {
     "next": ">=13.0.0 || >=14.0.0 || >=15.0.0 || >=16.0.0",