@pathscale/ui 1.1.55 → 1.1.56

package/dist/components/hero/hero.css

@@ -0,0 +1,38 @@
+@layer components {
+  .hero-content {
+      isolation: isolate;
+      display: flex;
+      max-width: 80rem;
+      align-items: center;
+      justify-content: center;
+      gap: calc(0.25rem * 4);
+      padding: calc(0.25rem * 4);
+    }
+
+  .hero {
+      display: grid;
+      width: 100%;
+      place-items: center;
+      background-size: cover;
+      background-position: center;
+    }
+
+  .hero > * {
+      grid-column-start: 1;
+      grid-row-start: 1;
+    }
+
+  .hero-overlay {
+      grid-column-start: 1;
+      grid-row-start: 1;
+      height: 100%;
+      width: 100%;
+      background-color: var(--color-neutral);
+    }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .hero-overlay {
+      background-color: color-mix(in oklab, var(--color-neutral) 50%, transparent);
+    }
+    }
+}

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

@@ -0,0 +1,4 @@
+export { default } from "./Hero";
+export type { HeroProps } from "./Hero";
+export type { HeroContentProps } from "./HeroContent";
+export type { HeroOverlayProps } from "./HeroOverlay";

package/dist/components/hero/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Hero_js_b4a7e63e__ from "./Hero.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Hero_js_b4a7e63e__["default"];
+export { __webpack_exports__default as default };

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

@@ -1,4 +1,3 @@
-import "./Icon.css";
 import { type JSX } from "solid-js";
 import type { IComponentBaseProps } from "../types";
 import type { ComponentColor } from "../types";

package/dist/components/icon/Icon.js

@@ -1,8 +1,7 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
-import "./Icon.css";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
-import * as __WEBPACK_EXTERNAL_MODULE__Icon_classes_js_7218ccd2__ from "./Icon.classes.js";
 var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>");
 const Icon = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
@@ -16,18 +15,17 @@ const Icon = (props)=>{
     ]);
     const width = local.width ?? 24;
     const height = local.height ?? 24;
-    const classes = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__Icon_classes_js_7218ccd2__.CLASSES.base, local.name, local.class, local.className));
+    const name = local.name;
+    const sizeClass = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>`${name} w-${width / 4} h-${height / 4}`);
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)((0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])(sizeClass(), local.className ?? local.class)));
     return (()=>{
         var _el$ = _tmpl$();
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, ()=>({
-                class: classes()
-            }), {
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            get ["class"] () {
+                return classes();
+            },
             get style () {
-                return {
-                    width: `${width}px`,
-                    height: `${height}px`,
-                    ..."object" == typeof local.style ? local.style : {}
-                };
+                return local.style;
             },
             get ["data-theme"] () {
                 return local.dataTheme;

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

@@ -1,4 +1,3 @@
-import "./ImmersiveLanding.css";
 import { type Component } from "solid-js";
 import type { ImmersiveLandingProps } from "./types";
 declare const _default: Component<ImmersiveLandingProps> & {

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

@@ -1,8 +1,6 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
-import "./ImmersiveLanding.css";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
-import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__ from "./ImmersiveLanding.classes.js";
 import * as __WEBPACK_EXTERNAL_MODULE__useImmersiveLanding_js_66194376__ from "./useImmersiveLanding.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__ from "./ImmersiveLandingContext.js";
 import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingPage_js_df221ed4__ from "./ImmersiveLandingPage.js";
@@ -11,7 +9,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingNavigation_js_3c874fb2__
 import * as __WEBPACK_EXTERNAL_MODULE__components_PWAInstallPrompt_js_a5e100bf__ from "./components/PWAInstallPrompt.js";
 import * as __WEBPACK_EXTERNAL_MODULE__components_FirefoxPWABanner_js_46fc5861__ from "./components/FirefoxPWABanner.js";
 import * as __WEBPACK_EXTERNAL_MODULE__components_CookieConsent_js_dd55e062__ from "./components/CookieConsent.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><div><div>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><span>v"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class="relative h-full w-full"><div class="relative z-10 h-full w-full">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="absolute bottom-20 right-6"aria-hidden=true><span class="font-mono text-base-content/20 text-[clamp(0.75rem,2vw,1.25rem)] tracking-[0.4em]">v'), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="pointer-events-none fixed inset-0 z-30">');
 const ImmersiveLanding = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
         "pages",
@@ -61,7 +59,7 @@ const ImmersiveLanding = (props)=>{
     };
     const showNav = ()=>false !== local.showNavigation;
     const showArrowNav = ()=>false !== local.showArrows;
-    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.base, local.class, local.className);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("fixed inset-0 h-screen w-screen overflow-hidden bg-transparent relative isolate", local.class, local.className);
     const renderChildren = ()=>"function" == typeof local.children ? local.children(contextValue) : local.children;
     const renderOverlay = ()=>"function" == typeof local.overlay ? local.overlay(contextValue) : local.overlay;
     return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__.ImmersiveLandingContext.Provider, {
@@ -70,19 +68,14 @@ const ImmersiveLanding = (props)=>{
             return [
                 (()=>{
                     var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild;
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: classes()
-                        }), {
+                    (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__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.viewport
-                        })), false, true);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.pageLayer
-                        })), false, true);
                     (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, renderChildren);
                     return _el$;
                 })(),
@@ -92,9 +85,6 @@ const ImmersiveLanding = (props)=>{
                     },
                     get children () {
                         var _el$4 = _tmpl$3();
-                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.overlay
-                            })), false, true);
                         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, renderOverlay, null);
                         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
                             get when () {
@@ -103,14 +93,6 @@ const ImmersiveLanding = (props)=>{
                             get children () {
                                 var _el$5 = _tmpl$2(), _el$6 = _el$5.firstChild;
                                 _el$6.firstChild;
-                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                        class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.versionWrap
-                                    }), {
-                                    "aria-hidden": "true"
-                                }), false, true);
-                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                        class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.landing.versionLabel
-                                    })), false, true);
                                 (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, ()=>local.appVersion, null);
                                 return _el$5;
                             }

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

@@ -1,8 +1,7 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
-import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__ from "./ImmersiveLanding.classes.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M15 19l-7-7 7-7">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<button type=button><svg><path stroke-linecap=round stroke-linejoin=round d="M9 5l7 7-7 7">');
+var _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">'), _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",
@@ -13,32 +12,27 @@ const ImmersiveLandingArrows = (props)=>{
         "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$ = _tmpl$(), _el$2 = _el$.firstChild;
+                var _el$ = _tmpl$();
                 _el$.$$click = handlePrev;
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                        class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.button, __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.prev, local.class, local.className)
-                    }), {
-                    "aria-label": "Previous page"
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+                    get ["class"] () {
+                        return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(buttonClasses, "left-4", local.class, local.className);
+                    }
                 }, others), false, true);
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                        class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.icon
-                    }), {
-                    fill: "none",
-                    viewBox: "0 0 24 24",
-                    stroke: "currentColor",
-                    "stroke-width": "2"
-                }), true, true);
                 return _el$;
             }
         }),
@@ -47,22 +41,14 @@ const ImmersiveLandingArrows = (props)=>{
                 return !local.isLastPage;
             },
             get children () {
-                var _el$3 = _tmpl$2(), _el$4 = _el$3.firstChild;
-                _el$3.$$click = handleNext;
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                        class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.button, __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.next, local.class, local.className)
-                    }), {
-                    "aria-label": "Next page"
+                var _el$2 = _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 (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(buttonClasses, "right-4", local.class, local.className);
+                    }
                 }, others), false, true);
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                        class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.arrows.icon
-                    }), {
-                    fill: "none",
-                    viewBox: "0 0 24 24",
-                    stroke: "currentColor",
-                    "stroke-width": "2"
-                }), true, true);
-                return _el$3;
+                return _el$2;
             }
         })
     ];

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

@@ -1,8 +1,7 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
-import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__ from "./ImmersiveLanding.classes.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.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__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button type=button>"), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>/");
+var _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">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="hidden md:flex items-center gap-1.5 px-2">'), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button type=button>"), _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",
@@ -16,13 +15,13 @@ const ImmersiveLandingNavigation = (props)=>{
         "className",
         "style"
     ]);
-    const mobileArrowClasses = (disabled)=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.mobileArrow, disabled && __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.mobileArrowDisabled);
+    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$ = _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;
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.base, local.class, local.className)
-            }), {
-            "aria-label": "Page navigation",
+        var _el$ = _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 (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.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))",
@@ -30,94 +29,58 @@ const ImmersiveLandingNavigation = (props)=>{
                 };
             }
         }, others), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.shell
-            })), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.row
-            })), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
-            get onClick () {
-                return local.onPrev;
-            },
-            get disabled () {
-                return local.isFirstPage;
-            }
-        }, ()=>({
-                class: mobileArrowClasses(local.isFirstPage)
-            }), {
-            "aria-label": "Previous page"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$5, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.icon
-            }), {
-            fill: "none",
-            viewBox: "0 0 24 24",
-            stroke: "currentColor",
-            "stroke-width": "2"
-        }), true, 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$8 = _tmpl$2();
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$8, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.dots
-                        })), false, true);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$8, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
+                    var _el$6 = _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$9 = _tmpl$3();
-                                _el$9.$$click = ()=>local.onPageDotClick(pageId);
-                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$9, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                                        class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.dot, index() === local.currentPageIndex && __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.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;
+                                var _el$7 = _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$8;
+                    return _el$6;
                 })();
-        })(), _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$0 = _tmpl$4(), _el$1 = _el$0.firstChild;
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$0, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                            class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.counter
-                        })), false, true);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$0, ()=>(local.currentPageIndex ?? 0) + 1, _el$1);
-                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$0, ()=>local.pages.length, null);
-                    return _el$0;
+                    var _el$8 = _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$6);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
-            get onClick () {
-                return local.onNext;
-            },
-            get disabled () {
-                return local.isLastPage;
-            }
-        }, ()=>({
-                class: mobileArrowClasses(local.isLastPage)
-            }), {
-            "aria-label": "Next page"
-        }), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$7, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.navigation.icon
-            }), {
-            fill: "none",
-            viewBox: "0 0 24 24",
-            stroke: "currentColor",
-            "stroke-width": "2"
-        }), true, true);
+        })(), _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$;
     })();
 };

package/dist/components/immersive-landing/ImmersiveLandingPage.js

@@ -2,8 +2,7 @@ import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
 import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
 import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__ from "./ImmersiveLandingContext.js";
-import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__ from "./ImmersiveLanding.classes.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<section role=region><div>");
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<section role=region><div class="relative z-10 h-full overflow-hidden">');
 const ImmersiveLandingPage = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
         "id",
@@ -15,7 +14,7 @@ const ImmersiveLandingPage = (props)=>{
     const context = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__.ImmersiveLandingContext);
     const isActive = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>context?.activePage() === local.id);
     const fadeDurationMs = 200;
-    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(__WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.page.base, isActive() ? __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.page.active : __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.page.inactive, local.class, local.className);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.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$ = _tmpl$(), _el$2 = _el$.firstChild;
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
@@ -24,10 +23,10 @@ const ImmersiveLandingPage = (props)=>{
             },
             get ["aria-label"] () {
                 return `${local.id} section`;
-            }
-        }, ()=>({
-                class: classes()
-            }), {
+            },
+            get ["class"] () {
+                return classes();
+            },
             get style () {
                 return {
                     "transition-duration": `${fadeDurationMs}ms`,
@@ -39,9 +38,6 @@ const ImmersiveLandingPage = (props)=>{
                 return !isActive();
             }
         }, others), false, true);
-        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                class: __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_classes_js_ecd495a7__.CLASSES.page.content
-            })), false, true);
         (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
         return _el$;
     })();