@pathscale/ui 0.0.114 → 0.0.116

package/dist/components/dropdown/Dropdown.d.ts

@@ -9,6 +9,7 @@ export type DropdownProps = JSX.HTMLAttributes<HTMLDivElement> & IComponentBaseP
     hover?: boolean;
     open?: boolean;
     fullWidth?: boolean;
+    role?: string;
     "aria-label"?: string;
     "aria-describedby"?: string;
     "aria-expanded"?: boolean;

package/dist/components/immersive-landing/ImmersiveLanding.d.ts

@@ -0,0 +1,8 @@
+import { type Component } from "solid-js";
+import type { ImmersiveLandingProps } from "./types";
+declare const _default: Component<ImmersiveLandingProps> & {
+    Page: (props: import("./types").ImmersiveLandingPageProps) => import("solid-js").JSX.Element;
+    Arrows: (props: import("./types").ImmersiveLandingArrowsProps) => import("solid-js").JSX.Element;
+    Navigation: (props: import("./types").ImmersiveLandingNavigationProps) => import("solid-js").JSX.Element;
+};
+export default _default;

package/dist/components/immersive-landing/ImmersiveLandingArrows.d.ts

@@ -0,0 +1,4 @@
+import { type JSX } from "solid-js";
+import type { ImmersiveLandingArrowsProps } from "./types";
+declare const ImmersiveLandingArrows: (props: ImmersiveLandingArrowsProps) => JSX.Element;
+export default ImmersiveLandingArrows;

package/dist/components/immersive-landing/ImmersiveLandingContext.d.ts

@@ -0,0 +1,3 @@
+import type { ImmersiveLandingContextValue } from "./types";
+export declare const ImmersiveLandingContext: import("solid-js").Context<ImmersiveLandingContextValue | undefined>;
+export declare function useImmersiveLandingContext(): ImmersiveLandingContextValue;

package/dist/components/immersive-landing/ImmersiveLandingNavigation.d.ts

@@ -0,0 +1,4 @@
+import { type JSX } from "solid-js";
+import type { ImmersiveLandingNavigationProps } from "./types";
+declare const ImmersiveLandingNavigation: (props: ImmersiveLandingNavigationProps) => JSX.Element;
+export default ImmersiveLandingNavigation;

package/dist/components/immersive-landing/ImmersiveLandingPage.d.ts

@@ -0,0 +1,4 @@
+import { type JSX } from "solid-js";
+import type { ImmersiveLandingPageProps } from "./types";
+declare const ImmersiveLandingPage: (props: ImmersiveLandingPageProps) => JSX.Element;
+export default ImmersiveLandingPage;

package/dist/components/immersive-landing/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./ImmersiveLanding";
+export { useImmersiveLanding } from "./useImmersiveLanding";
+export { ImmersiveLandingContext, useImmersiveLandingContext } from "./ImmersiveLandingContext";
+export type { ImmersiveLandingProps, ImmersiveLandingPageProps, ImmersiveLandingArrowsProps, ImmersiveLandingNavigationProps, ImmersiveLandingContextValue, UseImmersiveLandingOptions, UseImmersiveLandingReturn, } from "./types";

package/dist/components/immersive-landing/types.d.ts

@@ -0,0 +1,65 @@
+import type { JSX, Accessor } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export interface UseImmersiveLandingOptions {
+    pages: readonly string[];
+    initialPage?: string;
+    transitionDuration?: number;
+    onNavigate?: (fromPage: string, toPage: string) => void;
+    onNavigationComplete?: (page: string) => void;
+    enableScrollNavigation?: boolean;
+}
+export interface UseImmersiveLandingReturn {
+    activePage: Accessor<string>;
+    isTransitioning: Accessor<boolean>;
+    navigateTo: (pageId: string) => void;
+    goNext: () => void;
+    goPrev: () => void;
+    currentIndex: Accessor<number>;
+    isFirstPage: Accessor<boolean>;
+    isLastPage: Accessor<boolean>;
+    direction: Accessor<"next" | "prev" | null>;
+    transitionDuration: number;
+}
+export interface ImmersiveLandingContextValue {
+    activePage: Accessor<string>;
+    navigateTo: (pageId: string) => void;
+    goNext: () => void;
+    goPrev: () => void;
+    currentIndex: Accessor<number>;
+    totalPages: number;
+    isFirstPage: Accessor<boolean>;
+    isLastPage: Accessor<boolean>;
+    direction: Accessor<"next" | "prev" | null>;
+    transitionDuration: number;
+    pages: readonly string[];
+}
+export interface ImmersiveLandingProps extends IComponentBaseProps {
+    pages: readonly string[];
+    initialPage?: string;
+    transitionDuration?: number;
+    onNavigate?: (fromPage: string, toPage: string) => void;
+    onNavigationComplete?: (page: string) => void;
+    enableScrollNavigation?: boolean;
+    showNavigation?: boolean;
+    showArrows?: boolean;
+    children: JSX.Element | ((context: ImmersiveLandingContextValue) => JSX.Element);
+}
+export interface ImmersiveLandingPageProps extends IComponentBaseProps {
+    id: string;
+    children: JSX.Element;
+}
+export interface ImmersiveLandingArrowsProps extends IComponentBaseProps {
+    onPrev: () => void;
+    onNext: () => void;
+    isFirstPage: boolean;
+    isLastPage: boolean;
+}
+export interface ImmersiveLandingNavigationProps extends IComponentBaseProps {
+    pages: readonly string[];
+    currentPageIndex: number;
+    onPageDotClick: (pageId: string) => void;
+    onPrev: () => void;
+    onNext: () => void;
+    isFirstPage: boolean;
+    isLastPage: boolean;
+}

package/dist/components/immersive-landing/useImmersiveLanding.d.ts

@@ -0,0 +1,2 @@
+import type { UseImmersiveLandingOptions, UseImmersiveLandingReturn } from "./types";
+export declare function useImmersiveLanding(options: UseImmersiveLandingOptions): UseImmersiveLandingReturn;

package/dist/index.d.ts

@@ -40,6 +40,8 @@ export { default as Grid } from "./components/grid";
 export { default as Hero } from "./components/hero";
 export type { HeroContentProps, HeroOverlayProps, HeroProps, } from "./components/hero";
 export { default as Icon } from "./components/icon";
+export { default as ImmersiveLanding, useImmersiveLanding, useImmersiveLandingContext, ImmersiveLandingContext, } from "./components/immersive-landing";
+export type { ImmersiveLandingProps, ImmersiveLandingPageProps, ImmersiveLandingArrowsProps, ImmersiveLandingNavigationProps, ImmersiveLandingContextValue, UseImmersiveLandingOptions, UseImmersiveLandingReturn, } from "./components/immersive-landing";
 export { default as Indicator } from "./components/indicator";
 export { default as Input } from "./components/input";
 export { default as Join } from "./components/join";

package/dist/index.js

@@ -9397,7 +9397,7 @@ const DropdownDetails = Object.assign(Details, {
     Toggle: DropdownToggle_Summary
 });
 var DropdownItem_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<li role=menuitem>"), DropdownItem_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<a>"), DropdownItem_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button>");
-const DropdownItem_DropdownItem = (props)=>{
+const DropdownItem = (props)=>{
     const dropdownContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(DropdownContext);
     const defaultProps = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.mergeProps)({
         closeOnClick: true
@@ -9439,7 +9439,7 @@ const DropdownItem_DropdownItem = (props)=>{
         return _el$;
     })();
 };
-const DropdownItem = DropdownItem_DropdownItem;
+const dropdown_DropdownItem = DropdownItem;
 var DropdownMenu_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<ul>");
 const DropdownMenu = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
@@ -9545,6 +9545,7 @@ const Dropdown = (props)=>{
         "fullWidth",
         "dataTheme",
         "style",
+        "role",
         "aria-label",
         "aria-describedby",
         "aria-expanded",
@@ -9573,7 +9574,7 @@ const Dropdown = (props)=>{
             "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$) : dropdownCtx.ref = _el$;
             (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
                 get role () {
-                    return local.item ? "combobox" : "listbox";
+                    return void 0 !== local.role ? local.role : local.item ? "combobox" : "listbox";
                 }
             }, others, {
                 get ["data-theme"] () {
@@ -9640,7 +9641,7 @@ const dropdown_Dropdown = Object.assign(Dropdown, {
     Details: DropdownDetails,
     Toggle: dropdown_DropdownToggle,
     Menu: dropdown_DropdownMenu,
-    Item: DropdownItem
+    Item: dropdown_DropdownItem
 });
 const dropdown = dropdown_Dropdown;
 var FileInput_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<input>");
@@ -10621,6 +10622,427 @@ const HeroNamespaces = Object.assign(Hero, {
     Overlay: HeroOverlay
 });
 const hero_Hero = HeroNamespaces;
+function useImmersiveLanding(options) {
+    const { pages, initialPage = pages[0], transitionDuration = 400, onNavigate, onNavigationComplete, enableScrollNavigation = true } = options;
+    const [activePage, setActivePage] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(initialPage);
+    const [isTransitioning, setIsTransitioning] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const [direction, setDirection] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(null);
+    const currentIndex = ()=>pages.indexOf(activePage());
+    const isFirstPage = ()=>0 === currentIndex();
+    const isLastPage = ()=>currentIndex() === pages.length - 1;
+    const navigateToInternal = (pageId)=>{
+        if (isTransitioning() || !pages.includes(pageId)) return;
+        if (pageId === activePage()) return;
+        const fromPage = activePage();
+        const fromIndex = pages.indexOf(fromPage);
+        const toIndex = pages.indexOf(pageId);
+        setDirection(toIndex > fromIndex ? "next" : "prev");
+        setIsTransitioning(true);
+        setActivePage(pageId);
+        if (onNavigate) onNavigate(fromPage, pageId);
+        setTimeout(()=>{
+            setIsTransitioning(false);
+            setDirection(null);
+            const pageElement = document.getElementById(pageId);
+            if (pageElement) pageElement.focus({
+                preventScroll: true
+            });
+            if (onNavigationComplete) onNavigationComplete(pageId);
+        }, transitionDuration);
+    };
+    const navigateTo = (pageId)=>navigateToInternal(pageId);
+    const goNext = ()=>{
+        const idx = currentIndex();
+        if (idx < pages.length - 1) navigateToInternal(pages[idx + 1]);
+    };
+    const goPrev = ()=>{
+        const idx = currentIndex();
+        if (idx > 0) navigateToInternal(pages[idx - 1]);
+    };
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onMount)(()=>{
+        if ("undefined" == typeof window) return;
+        if (!enableScrollNavigation) return;
+        let scrollLocked = false;
+        const SCROLL_COOLDOWN = 1000;
+        let touchStartY = 0;
+        const handleWheel = (e)=>{
+            if (scrollLocked || isTransitioning()) return;
+            if (e.deltaY > 0) goNext();
+            else if (e.deltaY < 0) goPrev();
+            scrollLocked = true;
+            setTimeout(()=>{
+                scrollLocked = false;
+            }, SCROLL_COOLDOWN);
+        };
+        const handleTouchStart = (e)=>{
+            touchStartY = e.touches[0].clientY;
+        };
+        const handleTouchEnd = (e)=>{
+            if (scrollLocked || isTransitioning()) return;
+            const touchEndY = e.changedTouches[0].clientY;
+            const deltaY = touchStartY - touchEndY;
+            if (Math.abs(deltaY) < 50) return;
+            if (deltaY > 0) goNext();
+            else goPrev();
+            scrollLocked = true;
+            setTimeout(()=>{
+                scrollLocked = false;
+            }, SCROLL_COOLDOWN);
+        };
+        const handleKeyDown = (e)=>{
+            if (isTransitioning()) return;
+            const target = e.target;
+            if ("INPUT" === target.tagName || "TEXTAREA" === target.tagName || target.isContentEditable) return;
+            switch(e.key){
+                case "ArrowDown":
+                case "PageDown":
+                    e.preventDefault();
+                    goNext();
+                    break;
+                case "ArrowUp":
+                case "PageUp":
+                    e.preventDefault();
+                    goPrev();
+                    break;
+                case " ":
+                    if ("BUTTON" !== target.tagName && "A" !== target.tagName) {
+                        e.preventDefault();
+                        goNext();
+                    }
+                    break;
+                case "Home":
+                    e.preventDefault();
+                    navigateToInternal(pages[0]);
+                    break;
+                case "End":
+                    e.preventDefault();
+                    navigateToInternal(pages[pages.length - 1]);
+                    break;
+            }
+        };
+        window.addEventListener("wheel", handleWheel, {
+            passive: true
+        });
+        window.addEventListener("touchstart", handleTouchStart, {
+            passive: true
+        });
+        window.addEventListener("touchend", handleTouchEnd, {
+            passive: true
+        });
+        window.addEventListener("keydown", handleKeyDown);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onCleanup)(()=>{
+            window.removeEventListener("wheel", handleWheel);
+            window.removeEventListener("touchstart", handleTouchStart);
+            window.removeEventListener("touchend", handleTouchEnd);
+            window.removeEventListener("keydown", handleKeyDown);
+        });
+    });
+    return {
+        activePage,
+        isTransitioning,
+        navigateTo,
+        goNext,
+        goPrev,
+        currentIndex,
+        isFirstPage,
+        isLastPage,
+        direction,
+        transitionDuration
+    };
+}
+const ImmersiveLandingContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createContext)();
+function useImmersiveLandingContext() {
+    const context = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(ImmersiveLandingContext);
+    if (!context) throw new Error("useImmersiveLandingContext must be used within an ImmersiveLanding component");
+    return context;
+}
+var ImmersiveLandingPage_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<section role=region><div class="relative z-10 h-full">');
+const ImmersiveLandingPage = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "id",
+        "children",
+        "class",
+        "className",
+        "style"
+    ]);
+    const context = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(ImmersiveLandingContext);
+    const isActive = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>context?.activePage() === local.id);
+    const fadeDurationMs = 200;
+    const classes = ()=>twMerge("absolute inset-0 h-full w-full overflow-hidden bg-transparent transition-opacity ease-in-out", isActive() ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none", local.class, local.className);
+    return (()=>{
+        var _el$ = ImmersiveLandingPage_tmpl$(), _el$2 = _el$.firstChild;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get id () {
+                return local.id;
+            },
+            get ["aria-label"] () {
+                return `${local.id} section`;
+            },
+            get ["class"] () {
+                return classes();
+            },
+            get style () {
+                return {
+                    "transition-duration": `${fadeDurationMs}ms`,
+                    "transition-delay": isActive() ? `${fadeDurationMs}ms` : "0ms",
+                    ...local.style
+                };
+            },
+            get ["aria-hidden"] () {
+                return !isActive();
+            }
+        }, others), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
+        return _el$;
+    })();
+};
+const immersive_landing_ImmersiveLandingPage = ImmersiveLandingPage;
+var ImmersiveLandingArrows_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button aria-label="Previous page"><svg class="w-6 h-6 text-base-content/70"fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7">'), ImmersiveLandingArrows_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button aria-label="Next page"><svg class="w-6 h-6 text-base-content/70"fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">');
+const ImmersiveLandingArrows = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "onPrev",
+        "onNext",
+        "isFirstPage",
+        "isLastPage",
+        "class",
+        "className"
+    ]);
+    const handleNext = ()=>{
+        console.log("ImmersiveLandingArrows: handleNext called, onNext is:", typeof local.onNext);
+        if (local.onNext) local.onNext();
+    };
+    const handlePrev = ()=>{
+        console.log("ImmersiveLandingArrows: handlePrev called, onPrev is:", typeof local.onPrev);
+        if (local.onPrev) local.onPrev();
+    };
+    const buttonClasses = "fixed top-1/2 -translate-y-1/2 z-40 hidden md:flex items-center justify-center min-w-[48px] min-h-[48px] rounded-full bg-base-content/10 hover:bg-base-content/20 transition-colors cursor-pointer";
+    return [
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return !local.isFirstPage;
+            },
+            get children () {
+                var _el$ = ImmersiveLandingArrows_tmpl$();
+                _el$.$$click = handlePrev;
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+                    get ["class"] () {
+                        return twMerge(buttonClasses, "left-4", local.class, local.className);
+                    }
+                }, others), false, true);
+                return _el$;
+            }
+        }),
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return !local.isLastPage;
+            },
+            get children () {
+                var _el$2 = ImmersiveLandingArrows_tmpl$2();
+                _el$2.$$click = handleNext;
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+                    get ["class"] () {
+                        return twMerge(buttonClasses, "right-4", local.class, local.className);
+                    }
+                }, others), false, true);
+                return _el$2;
+            }
+        })
+    ];
+};
+const immersive_landing_ImmersiveLandingArrows = ImmersiveLandingArrows;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
+var ImmersiveLandingNavigation_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<nav aria-label="Page navigation"><div class="bg-base-100/90 backdrop-blur border border-base-content/10 rounded-full px-2 sm:px-3 py-1.5 sm:py-2 shadow-lg"><div class="flex items-center justify-center gap-2 md:gap-3"><button type=button aria-label="Previous page"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7"></path></svg></button><button type=button aria-label="Next page"><svg class="w-5 h-5"fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">'), ImmersiveLandingNavigation_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="hidden md:flex items-center gap-1.5 px-2">'), ImmersiveLandingNavigation_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button type=button>"), ImmersiveLandingNavigation_tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="text-sm text-base-content/60 tabular-nums font-medium min-w-[3ch] text-center">/');
+const ImmersiveLandingNavigation = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "pages",
+        "currentPageIndex",
+        "onPageDotClick",
+        "onPrev",
+        "onNext",
+        "isFirstPage",
+        "isLastPage",
+        "class",
+        "className",
+        "style"
+    ]);
+    const mobileArrowClasses = (disabled)=>`md:hidden flex items-center justify-center min-w-[44px] min-h-[44px] rounded-full transition-colors cursor-pointer ${disabled ? "text-base-content/20 cursor-not-allowed" : "text-base-content/70 hover:bg-base-content/10 active:bg-base-content/20"}`;
+    return (()=>{
+        var _el$ = ImmersiveLandingNavigation_tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.nextSibling;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get ["class"] () {
+                return twMerge("fixed left-1/2 -translate-x-1/2 z-50 w-auto px-2", local.class, local.className);
+            },
+            get style () {
+                return {
+                    bottom: "calc(0.75rem + env(safe-area-inset-bottom))",
+                    ...local.style
+                };
+            }
+        }, others), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.addEventListener)(_el$4, "click", local.onPrev, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!(local.pages && local.pages.length > 0));
+            return ()=>_c$() && (()=>{
+                    var _el$6 = ImmersiveLandingNavigation_tmpl$2();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
+                        get each () {
+                            return local.pages;
+                        },
+                        children: (pageId, index)=>(()=>{
+                                var _el$7 = ImmersiveLandingNavigation_tmpl$3();
+                                _el$7.$$click = ()=>local.onPageDotClick(pageId);
+                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+                                    var _v$5 = `w-2 h-2 rounded-full transition-all cursor-pointer ${index() === local.currentPageIndex ? "bg-primary scale-125" : "bg-base-content/30 hover:bg-base-content/50"}`, _v$6 = `Go to page ${index() + 1} of ${local.pages.length}`, _v$7 = index() === local.currentPageIndex ? "step" : void 0;
+                                    _v$5 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$7, _p$.e = _v$5);
+                                    _v$6 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$7, "aria-label", _p$.t = _v$6);
+                                    _v$7 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$7, "aria-current", _p$.a = _v$7);
+                                    return _p$;
+                                }, {
+                                    e: void 0,
+                                    t: void 0,
+                                    a: void 0
+                                });
+                                return _el$7;
+                            })()
+                    }));
+                    return _el$6;
+                })();
+        })(), _el$5);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, (()=>{
+            var _c$2 = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!(local.pages && local.pages.length > 0));
+            return ()=>_c$2() && (()=>{
+                    var _el$8 = ImmersiveLandingNavigation_tmpl$4(), _el$9 = _el$8.firstChild;
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$8, ()=>(local.currentPageIndex ?? 0) + 1, _el$9);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$8, ()=>local.pages.length, null);
+                    return _el$8;
+                })();
+        })(), _el$5);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.addEventListener)(_el$5, "click", local.onNext, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+            var _v$ = local.isFirstPage, _v$2 = mobileArrowClasses(local.isFirstPage), _v$3 = local.isLastPage, _v$4 = mobileArrowClasses(local.isLastPage);
+            _v$ !== _p$.e && (_el$4.disabled = _p$.e = _v$);
+            _v$2 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$4, _p$.t = _v$2);
+            _v$3 !== _p$.a && (_el$5.disabled = _p$.a = _v$3);
+            _v$4 !== _p$.o && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$5, _p$.o = _v$4);
+            return _p$;
+        }, {
+            e: void 0,
+            t: void 0,
+            a: void 0,
+            o: void 0
+        });
+        return _el$;
+    })();
+};
+const immersive_landing_ImmersiveLandingNavigation = ImmersiveLandingNavigation;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
+var ImmersiveLanding_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class="relative z-10 h-full w-full">');
+const ImmersiveLanding = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "pages",
+        "initialPage",
+        "transitionDuration",
+        "onNavigate",
+        "onNavigationComplete",
+        "enableScrollNavigation",
+        "showNavigation",
+        "showArrows",
+        "class",
+        "className",
+        "style"
+    ]);
+    const navigation = useImmersiveLanding({
+        pages: local.pages,
+        initialPage: local.initialPage,
+        transitionDuration: local.transitionDuration,
+        onNavigate: local.onNavigate,
+        onNavigationComplete: local.onNavigationComplete,
+        enableScrollNavigation: local.enableScrollNavigation
+    });
+    const contextValue = {
+        activePage: navigation.activePage,
+        navigateTo: navigation.navigateTo,
+        goNext: navigation.goNext,
+        goPrev: navigation.goPrev,
+        currentIndex: navigation.currentIndex,
+        totalPages: local.pages.length,
+        isFirstPage: navigation.isFirstPage,
+        isLastPage: navigation.isLastPage,
+        direction: navigation.direction,
+        transitionDuration: navigation.transitionDuration,
+        pages: local.pages
+    };
+    const showNav = ()=>false !== local.showNavigation;
+    const showArrowNav = ()=>false !== local.showArrows;
+    const classes = ()=>twMerge("fixed inset-0 overflow-hidden bg-transparent", local.class, local.className);
+    const renderChildren = ()=>"function" == typeof props.children ? props.children(contextValue) : props.children;
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ImmersiveLandingContext.Provider, {
+        value: contextValue,
+        get children () {
+            return [
+                (()=>{
+                    var _el$ = ImmersiveLanding_tmpl$(), _el$2 = _el$.firstChild;
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+                        get ["class"] () {
+                            return classes();
+                        },
+                        get style () {
+                            return local.style;
+                        }
+                    }, others), false, true);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, renderChildren);
+                    return _el$;
+                })(),
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!showArrowNav())() && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(immersive_landing_ImmersiveLandingArrows, {
+                        get onPrev () {
+                            return navigation.goPrev;
+                        },
+                        get onNext () {
+                            return navigation.goNext;
+                        },
+                        get isFirstPage () {
+                            return navigation.isFirstPage();
+                        },
+                        get isLastPage () {
+                            return navigation.isLastPage();
+                        }
+                    })),
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!showNav())() && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(immersive_landing_ImmersiveLandingNavigation, {
+                        get pages () {
+                            return local.pages;
+                        },
+                        get currentPageIndex () {
+                            return navigation.currentIndex();
+                        },
+                        get onPageDotClick () {
+                            return navigation.navigateTo;
+                        },
+                        get onPrev () {
+                            return navigation.goPrev;
+                        },
+                        get onNext () {
+                            return navigation.goNext;
+                        },
+                        get isFirstPage () {
+                            return navigation.isFirstPage();
+                        },
+                        get isLastPage () {
+                            return navigation.isLastPage();
+                        }
+                    }))
+            ];
+        }
+    });
+};
+const immersive_landing_ImmersiveLanding = Object.assign(ImmersiveLanding, {
+    Page: immersive_landing_ImmersiveLandingPage,
+    Arrows: immersive_landing_ImmersiveLandingArrows,
+    Navigation: immersive_landing_ImmersiveLandingNavigation
+});
 const Indicator = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
         "children",
@@ -15206,4 +15628,4 @@ const createRouteTransitionResolver = (options)=>{
         return fallback ?? noMotion;
     };
 };
-export { accordion_Accordion as Accordion, alert_Alert as Alert, AlphaSlider, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, Badge, bottom_sheet_BottomSheet as BottomSheet, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, colorpicker_ColorInput as ColorInput, colorpicker_ColorPicker as ColorPicker, ColorPickerContext, ColorPickerFlowerSelector, colorpicker_ColorPickerGradientSelector as ColorPickerGradientSelector, ColorPickerWheelSelector, colorpicker_ColorPreview as ColorPreview, colorpicker_ColorSwatches as ColorSwatches, ColorWheel, colorpicker_ColorWheelFlower as ColorWheelFlower, connectionstatus_ConnectionStatus as ConnectionStatus, CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, EnhancedTable, FileInput, flex_Flex as Flex, footer_Footer as Footer, form_Form as Form, Grid, hero_Hero as Hero, colorpicker_HueSlider as HueSlider, icon_Icon as Icon, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, LightnessSlider, link_Link as Link, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, MotionDiv, navbar_Navbar as Navbar, pagination_Pagination as Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, range_Range as Range, Rating, colorpicker_SaturationBrightness as SaturationBrightness, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, skeleton_Skeleton as Skeleton, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, streaming_table_StreamingTable as StreamingTable, Summary, SvgBackground, Swap, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, ToastStack_ToastStack as ToastStack, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, windowmockup_WindowMockup as WindowMockup, createMotionPresets, createMotionSystem, createPopmotionDriver, createRouteTransitionResolver, createStreamingTableStore, connectionstatus_ConnectionStatus as default, defaultMotionTokens, enablePopmotion, getMotionDriver, presets_getPreset as getPreset, immediateDriver, mergeMotionTokens, motionDistances, motionDurations, motionEasings, motionPresets, noMotion, prefersReducedMotion, presets_registerPreset as registerPreset, resolveEase, presets_resolvePreset as resolvePreset, routeTransition, runMotion, setMotionDriver, toastStore, useColorPickerContext, useDesktop, useFormValidation };
+export { accordion_Accordion as Accordion, alert_Alert as Alert, AlphaSlider, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, Badge, bottom_sheet_BottomSheet as BottomSheet, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, colorpicker_ColorInput as ColorInput, colorpicker_ColorPicker as ColorPicker, ColorPickerContext, ColorPickerFlowerSelector, colorpicker_ColorPickerGradientSelector as ColorPickerGradientSelector, ColorPickerWheelSelector, colorpicker_ColorPreview as ColorPreview, colorpicker_ColorSwatches as ColorSwatches, ColorWheel, colorpicker_ColorWheelFlower as ColorWheelFlower, connectionstatus_ConnectionStatus as ConnectionStatus, CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, EnhancedTable, FileInput, flex_Flex as Flex, footer_Footer as Footer, form_Form as Form, Grid, hero_Hero as Hero, colorpicker_HueSlider as HueSlider, icon_Icon as Icon, immersive_landing_ImmersiveLanding as ImmersiveLanding, ImmersiveLandingContext, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, LightnessSlider, link_Link as Link, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, MotionDiv, navbar_Navbar as Navbar, pagination_Pagination as Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, range_Range as Range, Rating, colorpicker_SaturationBrightness as SaturationBrightness, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, skeleton_Skeleton as Skeleton, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, streaming_table_StreamingTable as StreamingTable, Summary, SvgBackground, Swap, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, ToastStack_ToastStack as ToastStack, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, windowmockup_WindowMockup as WindowMockup, createMotionPresets, createMotionSystem, createPopmotionDriver, createRouteTransitionResolver, createStreamingTableStore, connectionstatus_ConnectionStatus as default, defaultMotionTokens, enablePopmotion, getMotionDriver, presets_getPreset as getPreset, immediateDriver, mergeMotionTokens, motionDistances, motionDurations, motionEasings, motionPresets, noMotion, prefersReducedMotion, presets_registerPreset as registerPreset, resolveEase, presets_resolvePreset as resolvePreset, routeTransition, runMotion, setMotionDriver, toastStore, useColorPickerContext, useDesktop, useFormValidation, useImmersiveLanding, useImmersiveLandingContext };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "0.0.114",
+  "version": "0.0.116",
   "author": "pathscale",
   "repository": {
     "type": "git",
@@ -31,6 +31,16 @@
     "@rsbuild/core": "^1.3.20",
     "@rsbuild/plugin-solid": "^1.0.5",
     "@rslib/core": "^0.9.0",
+    "@solid-primitives/event-listener": "^2.3.0",
+    "@solid-primitives/intersection-observer": "^2.1.3",
+    "@solid-primitives/keyboard": "^1.2.5",
+    "@solid-primitives/media": "^2.2.5",
+    "@solid-primitives/props": "^3.1.8",
+    "@solid-primitives/resize-observer": "^2.0.22",
+    "@solid-primitives/scheduled": "^1.4.1",
+    "@solid-primitives/scroll": "^2.0.20",
+    "@solid-primitives/storage": "^2.1.1",
+    "@solid-primitives/utils": "^6.2.1",
     "@tanstack/solid-table": "^8.21.3",
     "@types/bun": "^1.2.12",
     "babel-preset-solid": "^1.9.6",
@@ -38,6 +48,7 @@
     "cssnano": "^7.0.7",
     "postcss": "^8.5.4",
     "postcss-cli": "^11.0.1",
+    "solid-js": "^1.9.7",
     "svgo": "^3.3.2",
     "tailwind-merge": "^3.3.0",
     "typescript": "^5.8.3",
@@ -46,6 +57,11 @@
   },
   "dependencies": {
     "@iconify/tailwind4": "^1.0.6",
+    "rsbuild-plugin-iconify": "^1.0.3"
+  },
+  "peerDependencies": {
+    "@felte/solid": "^1.2.0",
+    "@felte/validator-zod": "^1.0.0",
     "@solid-primitives/event-listener": "^2.3.0",
     "@solid-primitives/intersection-observer": "^2.1.3",
     "@solid-primitives/keyboard": "^1.2.5",
@@ -56,12 +72,6 @@
     "@solid-primitives/scroll": "^2.0.20",
     "@solid-primitives/storage": "^2.1.1",
     "@solid-primitives/utils": "^6.2.1",
-    "rsbuild-plugin-iconify": "^1.0.3",
-    "solid-js": "^1.9.7"
-  },
-  "peerDependencies": {
-    "@felte/solid": "^1.2.0",
-    "@felte/validator-zod": "^1.0.0",
     "@tanstack/solid-table": "^8.0.0",
     "solid-js": "^1.9",
     "popmotion": "^11.0.5",