@pathscale/ui 2.4.0 → 2.6.0

package/dist/components/icon/Icon.recipe.d.ts

@@ -8,7 +8,7 @@
  * handed in. Nothing here bakes a glyph into the package, which is why there is
  * no icon set in this recipe and no icon data in the shipped CSS.
  */
-export declare const icon: import("solid-layouts").Recipe<{
+export declare const icon: import("solid-layouts/solid-2").Recipe<{
     readonly component: "icon";
     readonly element: "span";
     readonly slots: {

package/dist/components/immersive-landing/ImmersiveLanding.generated.js

@@ -1,8 +1,8 @@
-import { createComponent, insert, memo, mergeProps, spread, template } from "solid-js/web";
-import { defineComponent } from "solid-layouts/application-boundary";
+import { createComponent, insert, memo, mergeProps, spread, template } from "@solidjs/web";
+import { defineComponent } from "solid-layouts/solid-2/application-boundary";
 import "./ImmersiveLanding.css";
-import { Show, splitProps } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { Show, omit } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CLASSES, componentRecipe } from "./ImmersiveLanding.recipe.js";
 import { useImmersiveLanding } from "./useImmersiveLanding.js";
 import { ImmersiveLandingContext } from "./ImmersiveLandingContext.js";
@@ -12,38 +12,17 @@ import ImmersiveLandingNavigation_generated from "./ImmersiveLandingNavigation.g
 import { PWAInstallPrompt } from "./components/PWAInstallPrompt.js";
 import { FirefoxPWABanner } from "./components/FirefoxPWABanner.js";
 import { CookieConsent } from "./components/CookieConsent.js";
-var _tmpl$ = /*#__PURE__*/ template("<div><div><div>"), _tmpl$2 = /*#__PURE__*/ template("<div><span>v"), _tmpl$3 = /*#__PURE__*/ template("<div>");
+var _tmpl$ = /*#__PURE__*/ template("<div><div><div>"), _tmpl$2 = /*#__PURE__*/ template("<div><span>v"), _tmpl$3 = /*#__PURE__*/ template("<div><!><!>");
 const __solidLayoutImmersiveLanding = (_stable, p)=>{
-    const [local, others] = splitProps(p, [
-        "pages",
-        "initialPage",
-        "currentPage",
-        "transitionDuration",
-        "onNavigate",
-        "onNavigationComplete",
-        "enableScrollNavigation",
-        "showNavigation",
-        "showArrows",
-        "appVersion",
-        "overlay",
-        "children",
-        "class",
-        "style",
-        "pwaConfig",
-        "cookieConfig",
-        "firefoxPWAConfig",
-        "showPWAPrompt",
-        "showCookieConsent",
-        "showFirefoxBanner"
-    ]);
+    const others = omit(p, "pages", "initialPage", "currentPage", "transitionDuration", "onNavigate", "onNavigationComplete", "enableScrollNavigation", "showNavigation", "showArrows", "appVersion", "overlay", "children", "class", "style", "pwaConfig", "cookieConfig", "firefoxPWAConfig", "showPWAPrompt", "showCookieConsent", "showFirefoxBanner");
     const navigation = useImmersiveLanding({
-        pages: local.pages,
-        initialPage: local.initialPage,
-        currentPage: local.currentPage,
-        transitionDuration: local.transitionDuration,
-        onNavigate: local.onNavigate,
-        onNavigationComplete: local.onNavigationComplete,
-        enableScrollNavigation: local.enableScrollNavigation
+        pages: p.pages,
+        initialPage: p.initialPage,
+        currentPage: p.currentPage,
+        transitionDuration: p.transitionDuration,
+        onNavigate: p.onNavigate,
+        onNavigationComplete: p.onNavigationComplete,
+        enableScrollNavigation: p.enableScrollNavigation
     });
     const contextValue = {
         activePage: navigation.activePage,
@@ -51,20 +30,20 @@ const __solidLayoutImmersiveLanding = (_stable, p)=>{
         goNext: navigation.goNext,
         goPrev: navigation.goPrev,
         currentIndex: navigation.currentIndex,
-        totalPages: local.pages.length,
+        totalPages: p.pages.length,
         isFirstPage: navigation.isFirstPage,
         isLastPage: navigation.isLastPage,
         direction: navigation.direction,
         transitionDuration: navigation.transitionDuration,
-        pages: local.pages,
-        appVersion: local.appVersion
+        pages: p.pages,
+        appVersion: p.appVersion
     };
-    const showNav = ()=>false !== local.showNavigation;
-    const showArrowNav = ()=>false !== local.showArrows;
-    const classes = ()=>twMerge(CLASSES.landing.base, local.class);
-    const renderChildren = ()=>"function" == typeof local.children ? local.children(contextValue) : local.children;
-    const renderOverlay = ()=>"function" == typeof local.overlay ? local.overlay(contextValue) : local.overlay;
-    return createComponent(ImmersiveLandingContext.Provider, {
+    const showNav = ()=>false !== p.showNavigation;
+    const showArrowNav = ()=>false !== p.showArrows;
+    const classes = ()=>twMerge(CLASSES.landing.base, p.class);
+    const renderChildren = ()=>"function" == typeof p.children ? p.children(contextValue) : p.children;
+    const renderOverlay = ()=>"function" == typeof p.overlay ? p.overlay(contextValue) : p.overlay;
+    return createComponent(ImmersiveLandingContext, {
         value: contextValue,
         get children () {
             return [
@@ -74,31 +53,31 @@ const __solidLayoutImmersiveLanding = (_stable, p)=>{
                             class: classes()
                         }), {
                         get style () {
-                            return local.style;
+                            return p.style;
                         }
-                    }, others), false, true);
+                    }, others), true);
                     spread(_el$2, mergeProps(()=>({
                             class: CLASSES.landing.viewport
-                        })), false, true);
+                        })), true);
                     spread(_el$3, mergeProps(()=>({
                             class: CLASSES.landing.pageLayer
-                        })), false, true);
+                        })), true);
                     insert(_el$3, renderChildren);
                     return _el$;
                 })(),
                 createComponent(Show, {
                     get when () {
-                        return local.overlay || local.appVersion;
+                        return p.overlay || p.appVersion;
                     },
                     get children () {
-                        var _el$4 = _tmpl$3();
+                        var _el$4 = _tmpl$3(), _el$8 = _el$4.firstChild, _el$9 = _el$8.nextSibling;
                         spread(_el$4, mergeProps(()=>({
                                 class: CLASSES.landing.overlay
-                            })), false, true);
-                        insert(_el$4, renderOverlay, null);
+                            })), true);
+                        insert(_el$4, renderOverlay, _el$8);
                         insert(_el$4, createComponent(Show, {
                             get when () {
-                                return local.appVersion;
+                                return p.appVersion;
                             },
                             get children () {
                                 var _el$5 = _tmpl$2(), _el$6 = _el$5.firstChild;
@@ -107,18 +86,18 @@ const __solidLayoutImmersiveLanding = (_stable, p)=>{
                                         class: CLASSES.landing.versionWrap
                                     }), {
                                     "aria-hidden": "true"
-                                }), false, true);
+                                }), true);
                                 spread(_el$6, mergeProps(()=>({
                                         class: CLASSES.landing.versionLabel
-                                    })), false, true);
-                                insert(_el$6, ()=>local.appVersion, null);
+                                    })), true);
+                                insert(_el$6, ()=>p.appVersion, null);
                                 return _el$5;
                             }
-                        }), null);
+                        }), _el$9);
                         return _el$4;
                     }
                 }),
-                memo(()=>memo(()=>!!showArrowNav())() && createComponent(ImmersiveLandingArrows_generated, {
+                memo(()=>memo(()=>!!showArrowNav())() ? createComponent(ImmersiveLandingArrows_generated, {
                         get onPrev () {
                             return navigation.goPrev;
                         },
@@ -131,10 +110,10 @@ const __solidLayoutImmersiveLanding = (_stable, p)=>{
                         get isLastPage () {
                             return navigation.isLastPage();
                         }
-                    })),
-                memo(()=>memo(()=>!!showNav())() && createComponent(ImmersiveLandingNavigation_generated, {
+                    }) : showArrowNav()),
+                memo(()=>memo(()=>!!showNav())() ? createComponent(ImmersiveLandingNavigation_generated, {
                         get pages () {
-                            return local.pages;
+                            return p.pages;
                         },
                         get currentPageIndex () {
                             return navigation.currentIndex();
@@ -154,72 +133,72 @@ const __solidLayoutImmersiveLanding = (_stable, p)=>{
                         get isLastPage () {
                             return navigation.isLastPage();
                         }
-                    })),
+                    }) : showNav()),
                 createComponent(Show, {
                     get when () {
-                        return local.showPWAPrompt;
+                        return p.showPWAPrompt;
                     },
                     get children () {
                         return createComponent(PWAInstallPrompt, {
                             get appName () {
-                                return local.pwaConfig?.appName;
+                                return p.pwaConfig?.appName;
                             },
                             get appIcon () {
-                                return local.pwaConfig?.appIcon;
+                                return p.pwaConfig?.appIcon;
                             },
                             get storageKey () {
-                                return local.pwaConfig?.storageKey ?? "app_pwa_dismissed";
+                                return p.pwaConfig?.storageKey ?? "app_pwa_dismissed";
                             },
                             get texts () {
-                                return local.pwaConfig?.texts;
+                                return p.pwaConfig?.texts;
                             },
                             get onInstall () {
-                                return local.pwaConfig?.onInstall;
+                                return p.pwaConfig?.onInstall;
                             },
                             get onDismiss () {
-                                return local.pwaConfig?.onDismiss;
+                                return p.pwaConfig?.onDismiss;
                             }
                         });
                     }
                 }),
                 createComponent(Show, {
                     get when () {
-                        return local.showFirefoxBanner;
+                        return p.showFirefoxBanner;
                     },
                     get children () {
                         return createComponent(FirefoxPWABanner, {
                             get extensionUrl () {
-                                return local.firefoxPWAConfig?.extensionUrl;
+                                return p.firefoxPWAConfig?.extensionUrl;
                             },
                             get storageKey () {
-                                return local.firefoxPWAConfig?.storageKey ?? "app_firefox_pwa_dismissed";
+                                return p.firefoxPWAConfig?.storageKey ?? "app_firefox_pwa_dismissed";
                             },
                             get texts () {
-                                return local.firefoxPWAConfig?.texts;
+                                return p.firefoxPWAConfig?.texts;
                             },
                             get onInstall () {
-                                return local.firefoxPWAConfig?.onInstall;
+                                return p.firefoxPWAConfig?.onInstall;
                             },
                             get onDismiss () {
-                                return local.firefoxPWAConfig?.onDismiss;
+                                return p.firefoxPWAConfig?.onDismiss;
                             }
                         });
                     }
                 }),
                 createComponent(Show, {
                     get when () {
-                        return local.showCookieConsent;
+                        return p.showCookieConsent;
                     },
                     get children () {
                         return createComponent(CookieConsent, {
                             get storageKeys () {
-                                return local.cookieConfig?.storageKeys;
+                                return p.cookieConfig?.storageKeys;
                             },
                             get texts () {
-                                return local.cookieConfig?.texts;
+                                return p.cookieConfig?.texts;
                             },
                             get onConsentChange () {
-                                return local.cookieConfig?.onConsentChange;
+                                return p.cookieConfig?.onConsentChange;
                             }
                         });
                     }

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

@@ -81,7 +81,7 @@ export declare const CLASSES: {
         readonly saveButton: "immersive-landing-cookie__save-button";
     };
 };
-export declare const componentRecipe: import("solid-layouts").Recipe<{
+export declare const componentRecipe: import("solid-layouts/solid-2").Recipe<{
     readonly component: "immersive-landing";
     readonly slots: {
         readonly root: {};

package/dist/components/immersive-landing/ImmersiveLandingArrows.generated.js

@@ -1,36 +1,32 @@
-import { createComponent, delegateEvents, mergeProps, spread, template } from "solid-js/web";
-import { defineComponent } from "solid-layouts/application-boundary";
-import { Show, splitProps } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { createComponent, mergeProps, spread, template } from "@solidjs/web";
+import { defineComponent } from "solid-layouts/solid-2/application-boundary";
+import { Show, omit } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CLASSES, componentRecipe } from "./ImmersiveLanding.recipe.js";
-var _tmpl$ = /*#__PURE__*/ template('<button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7">'), _tmpl$2 = /*#__PURE__*/ template('<button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">');
+var _tmpl$ = /*#__PURE__*/ template('<button><svg><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7">'), _tmpl$2 = /*#__PURE__*/ template('<button><svg><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">');
 const __solidLayoutImmersiveLandingArrows = (_stable, p)=>{
-    const [local, others] = splitProps(p, [
-        "onPrev",
-        "onNext",
-        "isFirstPage",
-        "isLastPage",
-        "class"
-    ]);
+    const others = omit(p, "onPrev", "onNext", "isFirstPage", "isLastPage", "class");
     const handleNext = ()=>{
-        if (local.onNext) local.onNext();
+        if (p.onNext) p.onNext();
     };
     const handlePrev = ()=>{
-        if (local.onPrev) local.onPrev();
+        if (p.onPrev) p.onPrev();
     };
     return [
         createComponent(Show, {
             get when () {
-                return !local.isFirstPage;
+                return !p.isFirstPage;
             },
             get children () {
                 var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
-                _el$.$$click = handlePrev;
-                spread(_el$, mergeProps(()=>({
-                        class: twMerge(CLASSES.arrows.button, CLASSES.arrows.prev, local.class)
+                spread(_el$, mergeProps({
+                    type: "button",
+                    onClick: handlePrev
+                }, ()=>({
+                        class: twMerge(CLASSES.arrows.button, CLASSES.arrows.prev, p.class)
                     }), {
                     "aria-label": "Previous page"
-                }, others), false, true);
+                }, others), true);
                 spread(_el$2, mergeProps(()=>({
                         class: CLASSES.arrows.icon
                     }), {
@@ -38,22 +34,24 @@ const __solidLayoutImmersiveLandingArrows = (_stable, p)=>{
                     viewBox: "0 0 24 24",
                     stroke: "currentColor",
                     "stroke-width": "2"
-                }), true, true);
+                }), true);
                 return _el$;
             }
         }),
         createComponent(Show, {
             get when () {
-                return !local.isLastPage;
+                return !p.isLastPage;
             },
             get children () {
                 var _el$3 = _tmpl$2(), _el$4 = _el$3.firstChild;
-                _el$3.$$click = handleNext;
-                spread(_el$3, mergeProps(()=>({
-                        class: twMerge(CLASSES.arrows.button, CLASSES.arrows.next, local.class)
+                spread(_el$3, mergeProps({
+                    type: "button",
+                    onClick: handleNext
+                }, ()=>({
+                        class: twMerge(CLASSES.arrows.button, CLASSES.arrows.next, p.class)
                     }), {
                     "aria-label": "Next page"
-                }, others), false, true);
+                }, others), true);
                 spread(_el$4, mergeProps(()=>({
                         class: CLASSES.arrows.icon
                     }), {
@@ -61,7 +59,7 @@ const __solidLayoutImmersiveLandingArrows = (_stable, p)=>{
                     viewBox: "0 0 24 24",
                     stroke: "currentColor",
                     "stroke-width": "2"
-                }), true, true);
+                }), true);
                 return _el$3;
             }
         })
@@ -73,7 +71,4 @@ const ImmersiveLandingArrows = defineComponent({
     embedded: true
 });
 const ImmersiveLandingArrows_generated = ImmersiveLandingArrows;
-delegateEvents([
-    "click"
-]);
 export default ImmersiveLandingArrows_generated;

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

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

package/dist/components/immersive-landing/ImmersiveLandingNavigation.generated.js

@@ -1,125 +1,117 @@
-import { createComponent, delegateEvents, insert, memo, mergeProps, spread, template } from "solid-js/web";
-import { defineComponent } from "solid-layouts/application-boundary";
-import { For, splitProps } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { createComponent, insert, memo, mergeProps, spread, template } from "@solidjs/web";
+import { defineComponent } from "solid-layouts/solid-2/application-boundary";
+import { For, omit } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CLASSES, componentRecipe } from "./ImmersiveLanding.recipe.js";
-var _tmpl$ = /*#__PURE__*/ template('<nav><div><div><button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7"></path></svg></button><button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">'), _tmpl$2 = /*#__PURE__*/ template("<div>"), _tmpl$3 = /*#__PURE__*/ template("<button type=button>"), _tmpl$4 = /*#__PURE__*/ template("<span>/");
+var _tmpl$ = /*#__PURE__*/ template('<nav><div><div><button><svg><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7"></path></svg></button><!><button><svg><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">'), _tmpl$2 = /*#__PURE__*/ template("<div>"), _tmpl$3 = /*#__PURE__*/ template("<button>"), _tmpl$4 = /*#__PURE__*/ template("<span>/<!>");
 const __solidLayoutImmersiveLandingNavigation = (_stable, p)=>{
-    const [local, others] = splitProps(p, [
-        "pages",
-        "currentPageIndex",
-        "onPageDotClick",
-        "onPrev",
-        "onNext",
-        "isFirstPage",
-        "isLastPage",
-        "class",
-        "style"
-    ]);
+    const others = omit(p, "pages", "currentPageIndex", "onPageDotClick", "onPrev", "onNext", "isFirstPage", "isLastPage", "class", "style");
     const mobileArrowClasses = (disabled)=>twMerge(CLASSES.navigation.mobileArrow, disabled && CLASSES.navigation.mobileArrowDisabled);
-    return (()=>{
-        var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$6 = _el$4.nextSibling, _el$7 = _el$6.firstChild;
-        spread(_el$, mergeProps(()=>({
-                class: twMerge(CLASSES.navigation.base, local.class)
-            }), {
-            "aria-label": "Page navigation",
-            get style () {
-                return {
-                    bottom: "calc(0.75rem + env(safe-area-inset-bottom))",
-                    ...local.style
-                };
-            }
-        }, others), false, true);
-        spread(_el$2, mergeProps(()=>({
-                class: CLASSES.navigation.shell
-            })), false, true);
-        spread(_el$3, mergeProps(()=>({
-                class: CLASSES.navigation.row
-            })), false, true);
-        spread(_el$4, mergeProps({
-            get onClick () {
-                return local.onPrev;
-            },
-            get disabled () {
-                return local.isFirstPage;
-            }
-        }, ()=>({
-                class: mobileArrowClasses(local.isFirstPage)
-            }), {
-            "aria-label": "Previous page"
-        }), false, true);
-        spread(_el$5, mergeProps(()=>({
-                class: CLASSES.navigation.icon
-            }), {
-            fill: "none",
-            viewBox: "0 0 24 24",
-            stroke: "currentColor",
-            "stroke-width": "2"
-        }), true, true);
-        insert(_el$3, (()=>{
-            var _c$ = memo(()=>!!(local.pages && local.pages.length > 0));
-            return ()=>_c$() && (()=>{
-                    var _el$8 = _tmpl$2();
-                    spread(_el$8, mergeProps(()=>({
-                            class: CLASSES.navigation.dots
-                        })), false, true);
-                    insert(_el$8, createComponent(For, {
-                        get each () {
-                            return local.pages;
-                        },
-                        children: (pageId, index)=>(()=>{
-                                var _el$9 = _tmpl$3();
-                                _el$9.$$click = ()=>local.onPageDotClick(pageId);
-                                spread(_el$9, mergeProps(()=>({
-                                        class: twMerge(CLASSES.navigation.dot, index() === local.currentPageIndex && CLASSES.navigation.dotActive)
-                                    }), {
-                                    get ["aria-label"] () {
-                                        return `Go to page ${index() + 1} of ${local.pages.length}`;
-                                    },
-                                    get ["aria-current"] () {
-                                        return index() === local.currentPageIndex ? "step" : void 0;
-                                    }
-                                }), false, false);
-                                return _el$9;
-                            })()
-                    }));
-                    return _el$8;
-                })();
-        })(), _el$6);
-        insert(_el$3, (()=>{
-            var _c$2 = memo(()=>!!(local.pages && local.pages.length > 0));
-            return ()=>_c$2() && (()=>{
-                    var _el$0 = _tmpl$4(), _el$1 = _el$0.firstChild;
-                    spread(_el$0, mergeProps(()=>({
-                            class: CLASSES.navigation.counter
-                        })), false, true);
-                    insert(_el$0, ()=>(local.currentPageIndex ?? 0) + 1, _el$1);
-                    insert(_el$0, ()=>local.pages.length, null);
-                    return _el$0;
-                })();
-        })(), _el$6);
-        spread(_el$6, mergeProps({
-            get onClick () {
-                return local.onNext;
-            },
-            get disabled () {
-                return local.isLastPage;
-            }
-        }, ()=>({
-                class: mobileArrowClasses(local.isLastPage)
-            }), {
-            "aria-label": "Next page"
-        }), false, true);
-        spread(_el$7, mergeProps(()=>({
-                class: CLASSES.navigation.icon
-            }), {
-            fill: "none",
-            viewBox: "0 0 24 24",
-            stroke: "currentColor",
-            "stroke-width": "2"
-        }), true, true);
-        return _el$;
-    })();
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$4.firstChild, _el$8 = _el$4.nextSibling, _el$6 = _el$8.nextSibling, _el$7 = _el$6.firstChild;
+    spread(_el$, mergeProps(()=>({
+            class: twMerge(CLASSES.navigation.base, p.class)
+        }), {
+        "aria-label": "Page navigation",
+        get style () {
+            return {
+                bottom: "calc(0.75rem + env(safe-area-inset-bottom))",
+                ...p.style
+            };
+        }
+    }, others), true);
+    spread(_el$2, mergeProps(()=>({
+            class: CLASSES.navigation.shell
+        })), true);
+    spread(_el$3, mergeProps(()=>({
+            class: CLASSES.navigation.row
+        })), true);
+    spread(_el$4, mergeProps({
+        type: "button",
+        get onClick () {
+            return p.onPrev;
+        },
+        get disabled () {
+            return p.isFirstPage;
+        }
+    }, ()=>({
+            class: mobileArrowClasses(p.isFirstPage)
+        }), {
+        "aria-label": "Previous page"
+    }), true);
+    spread(_el$5, mergeProps(()=>({
+            class: CLASSES.navigation.icon
+        }), {
+        fill: "none",
+        viewBox: "0 0 24 24",
+        stroke: "currentColor",
+        "stroke-width": "2"
+    }), true);
+    insert(_el$3, (()=>{
+        var _c$ = memo(()=>!!(p.pages && p.pages.length > 0));
+        return ()=>_c$() ? (()=>{
+                var _el$9 = _tmpl$2();
+                spread(_el$9, mergeProps(()=>({
+                        class: CLASSES.navigation.dots
+                    })), true);
+                insert(_el$9, createComponent(For, {
+                    get each () {
+                        return p.pages;
+                    },
+                    children: (pageId, index)=>(()=>{
+                            var _el$0 = _tmpl$3();
+                            spread(_el$0, mergeProps({
+                                type: "button",
+                                onClick: ()=>p.onPageDotClick(pageId)
+                            }, ()=>({
+                                    class: twMerge(CLASSES.navigation.dot, index() === p.currentPageIndex && CLASSES.navigation.dotActive)
+                                }), {
+                                get ["aria-label"] () {
+                                    return `Go to page ${index() + 1} of ${p.pages.length}`;
+                                },
+                                get ["aria-current"] () {
+                                    return index() === p.currentPageIndex ? "step" : void 0;
+                                }
+                            }), false);
+                            return _el$0;
+                        })()
+                }));
+                return _el$9;
+            })() : p.pages && p.pages.length > 0;
+    })(), _el$8);
+    insert(_el$3, (()=>{
+        var _c$2 = memo(()=>!!(p.pages && p.pages.length > 0));
+        return ()=>_c$2() ? (()=>{
+                var _el$1 = _tmpl$4(), _el$10 = _el$1.firstChild, _el$11 = _el$10.nextSibling;
+                spread(_el$1, mergeProps(()=>({
+                        class: CLASSES.navigation.counter
+                    })), true);
+                insert(_el$1, ()=>(p.currentPageIndex ?? 0) + 1, _el$10);
+                insert(_el$1, ()=>p.pages.length, _el$11);
+                return _el$1;
+            })() : p.pages && p.pages.length > 0;
+    })(), _el$6);
+    spread(_el$6, mergeProps({
+        type: "button",
+        get onClick () {
+            return p.onNext;
+        },
+        get disabled () {
+            return p.isLastPage;
+        }
+    }, ()=>({
+            class: mobileArrowClasses(p.isLastPage)
+        }), {
+        "aria-label": "Next page"
+    }), true);
+    spread(_el$7, mergeProps(()=>({
+            class: CLASSES.navigation.icon
+        }), {
+        fill: "none",
+        viewBox: "0 0 24 24",
+        stroke: "currentColor",
+        "stroke-width": "2"
+    }), true);
+    return _el$;
 };
 const ImmersiveLandingNavigation = defineComponent({
     recipe: componentRecipe,
@@ -127,7 +119,4 @@ const ImmersiveLandingNavigation = defineComponent({
     embedded: true
 });
 const ImmersiveLandingNavigation_generated = ImmersiveLandingNavigation;
-delegateEvents([
-    "click"
-]);
 export default ImmersiveLandingNavigation_generated;