@pathscale/ui 0.0.161 → 0.0.163

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

@@ -0,0 +1,178 @@
+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__button_index_js_573defba__ from "../../button/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__card_index_js_ff5173c9__ from "../../card/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__flex_index_js_42888a32__ from "../../flex/index.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="w-14 h-14 flex-shrink-0 rounded-xl bg-base-200 p-2"><img class="w-full h-full">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<p class="text-sm text-base-content/70">'), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div role=dialog aria-modal=false aria-labelledby=pwa-install-title class="fixed bottom-4 left-4 right-4 md:left-auto md:right-4 md:max-w-sm z-51 animate-slide-up">');
+const DISMISS_DURATION = 604800000;
+const defaultTexts = {
+    title: "Install App",
+    description: "Add this app to your home screen for a better experience.",
+    installButton: "Install",
+    notNowButton: "Not now",
+    closeLabel: "Close"
+};
+const PWAInstallPrompt = (props)=>{
+    const STORAGE_KEY = ()=>props.storageKey ?? "app_pwa_dismissed";
+    const appName = ()=>props.appName ?? "My App";
+    const appIcon = ()=>props.appIcon ?? "/icon-192.png";
+    const texts = ()=>({
+            title: props.texts?.title ?? defaultTexts.title,
+            description: props.texts?.description ?? defaultTexts.description,
+            installButton: props.texts?.installButton ?? defaultTexts.installButton,
+            notNowButton: props.texts?.notNowButton ?? defaultTexts.notNowButton,
+            closeLabel: props.texts?.closeLabel ?? defaultTexts.closeLabel
+        });
+    const [deferredPrompt, setDeferredPrompt] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(null);
+    const [showPrompt, setShowPrompt] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const checkDismissalStatus = ()=>{
+        const dismissed = localStorage.getItem(STORAGE_KEY());
+        if (!dismissed) return true;
+        const dismissedTime = Number.parseInt(dismissed, 10);
+        const now = Date.now();
+        if (now - dismissedTime > DISMISS_DURATION) {
+            localStorage.removeItem(STORAGE_KEY());
+            return true;
+        }
+        return false;
+    };
+    const handleBeforeInstallPrompt = (e)=>{
+        e.preventDefault();
+        setDeferredPrompt(e);
+        if (checkDismissalStatus()) setShowPrompt(true);
+    };
+    const handleInstall = async ()=>{
+        const prompt = deferredPrompt();
+        if (!prompt) return;
+        try {
+            prompt.prompt();
+            const result = await prompt.userChoice;
+            if ("accepted" === result.outcome) {
+                setShowPrompt(false);
+                setDeferredPrompt(null);
+                props.onInstall?.();
+            }
+        } catch (error) {
+            console.debug("PWA install prompt failed:", error);
+        }
+    };
+    const handleDismiss = ()=>{
+        setShowPrompt(false);
+        localStorage.setItem(STORAGE_KEY(), Date.now().toString());
+        props.onDismiss?.();
+    };
+    const handleAppInstalled = ()=>{
+        setShowPrompt(false);
+        setDeferredPrompt(null);
+    };
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onMount)(()=>{
+        window.addEventListener("beforeinstallprompt", handleBeforeInstallPrompt);
+        window.addEventListener("appinstalled", handleAppInstalled);
+    });
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onCleanup)(()=>{
+        window.removeEventListener("beforeinstallprompt", handleBeforeInstallPrompt);
+        window.removeEventListener("appinstalled", handleAppInstalled);
+    });
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+        get when () {
+            return showPrompt();
+        },
+        get children () {
+            var _el$ = _tmpl$3();
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__card_index_js_ff5173c9__["default"], {
+                shadow: "lg",
+                background: "base-100",
+                class: "relative border border-base-300",
+                get children () {
+                    return [
+                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_index_js_573defba__["default"], {
+                            size: "sm",
+                            color: "ghost",
+                            shape: "circle",
+                            class: "absolute top-2 right-2",
+                            onClick: handleDismiss,
+                            get ["aria-label"] () {
+                                return texts().closeLabel;
+                            },
+                            children: "X"
+                        }),
+                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__card_index_js_ff5173c9__["default"].Body, {
+                            get children () {
+                                return [
+                                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__flex_index_js_42888a32__["default"], {
+                                        align: "start",
+                                        gap: "md",
+                                        get children () {
+                                            return [
+                                                (()=>{
+                                                    var _el$2 = _tmpl$(), _el$3 = _el$2.firstChild;
+                                                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+                                                        var _v$ = appIcon(), _v$2 = appName();
+                                                        _v$ !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$3, "src", _p$.e = _v$);
+                                                        _v$2 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$3, "alt", _p$.t = _v$2);
+                                                        return _p$;
+                                                    }, {
+                                                        e: void 0,
+                                                        t: void 0
+                                                    });
+                                                    return _el$2;
+                                                })(),
+                                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__flex_index_js_42888a32__["default"], {
+                                                    direction: "col",
+                                                    gap: "sm",
+                                                    class: "flex-1 min-w-0 pr-6",
+                                                    get children () {
+                                                        return [
+                                                            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__card_index_js_ff5173c9__["default"].Title, {
+                                                                id: "pwa-install-title",
+                                                                tag: "h3",
+                                                                class: "text-base",
+                                                                get children () {
+                                                                    return texts().title;
+                                                                }
+                                                            }),
+                                                            (()=>{
+                                                                var _el$4 = _tmpl$2();
+                                                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, ()=>texts().description);
+                                                                return _el$4;
+                                                            })()
+                                                        ];
+                                                    }
+                                                })
+                                            ];
+                                        }
+                                    }),
+                                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__card_index_js_ff5173c9__["default"].Actions, {
+                                        class: "mt-4",
+                                        get children () {
+                                            return [
+                                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_index_js_573defba__["default"], {
+                                                    color: "primary",
+                                                    class: "flex-1",
+                                                    onClick: handleInstall,
+                                                    get children () {
+                                                        return texts().installButton;
+                                                    }
+                                                }),
+                                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_index_js_573defba__["default"], {
+                                                    color: "ghost",
+                                                    class: "flex-1",
+                                                    onClick: handleDismiss,
+                                                    get children () {
+                                                        return texts().notNowButton;
+                                                    }
+                                                })
+                                            ];
+                                        }
+                                    })
+                                ];
+                            }
+                        })
+                    ];
+                }
+            }));
+            return _el$;
+        }
+    });
+};
+export { PWAInstallPrompt };

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

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_js_2b17ea6a__ from "./ImmersiveLanding.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__components_CookieConsent_js_dd55e062__ from "./components/CookieConsent.js";
+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";
+var __webpack_exports__CookieConsent = __WEBPACK_EXTERNAL_MODULE__components_CookieConsent_js_dd55e062__.CookieConsent;
+var __webpack_exports__FirefoxPWABanner = __WEBPACK_EXTERNAL_MODULE__components_FirefoxPWABanner_js_46fc5861__.FirefoxPWABanner;
+var __webpack_exports__ImmersiveLandingContext = __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__.ImmersiveLandingContext;
+var __webpack_exports__PWAInstallPrompt = __WEBPACK_EXTERNAL_MODULE__components_PWAInstallPrompt_js_a5e100bf__.PWAInstallPrompt;
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__ImmersiveLanding_js_2b17ea6a__["default"];
+var __webpack_exports__useImmersiveLanding = __WEBPACK_EXTERNAL_MODULE__useImmersiveLanding_js_66194376__.useImmersiveLanding;
+var __webpack_exports__useImmersiveLandingContext = __WEBPACK_EXTERNAL_MODULE__ImmersiveLandingContext_js_0e3f38c0__.useImmersiveLandingContext;
+export { __webpack_exports__CookieConsent as CookieConsent, __webpack_exports__FirefoxPWABanner as FirefoxPWABanner, __webpack_exports__ImmersiveLandingContext as ImmersiveLandingContext, __webpack_exports__PWAInstallPrompt as PWAInstallPrompt, __webpack_exports__default as default, __webpack_exports__useImmersiveLanding as useImmersiveLanding, __webpack_exports__useImmersiveLandingContext as useImmersiveLandingContext };

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

@@ -0,0 +1,151 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+function useImmersiveLanding(options) {
+    const { pages, initialPage = pages[0], currentPage: controlledPage, transitionDuration = 400, onNavigate, onNavigationComplete, enableScrollNavigation = true } = options;
+    const isControlled = !!controlledPage;
+    const [internalPage, setInternalPage] = (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 activePage = isControlled ? controlledPage : internalPage;
+    const currentIndex = ()=>pages.indexOf(activePage());
+    const isFirstPage = ()=>0 === currentIndex();
+    const isLastPage = ()=>currentIndex() === pages.length - 1;
+    if (isControlled) {
+        let prevPage = controlledPage();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
+            const next = controlledPage();
+            if (next !== prevPage && !isTransitioning()) {
+                const fromIndex = pages.indexOf(prevPage);
+                const toIndex = pages.indexOf(next);
+                if (toIndex >= 0) {
+                    setDirection(toIndex > fromIndex ? "next" : "prev");
+                    setIsTransitioning(true);
+                    setTimeout(()=>{
+                        setIsTransitioning(false);
+                        setDirection(null);
+                    }, transitionDuration);
+                }
+                prevPage = next;
+            }
+        });
+    }
+    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);
+        if (!isControlled) setInternalPage(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
+    };
+}
+export { useImmersiveLanding };

package/dist/components/indicator/Indicator.d.ts

@@ -1,3 +1,4 @@
+import "./indicator.css";
 import { type JSX } from "solid-js";
 import type { IComponentBaseProps } from "../types";
 type ElementType = keyof JSX.IntrinsicElements;

package/dist/components/indicator/Indicator.js

@@ -0,0 +1,76 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./indicator.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";
+const Indicator = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "horizontal",
+        "vertical",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "as"
+    ]);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("indicator", local.class, local.className);
+    const Tag = local.as || "div";
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.Dynamic, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+        component: Tag
+    }, others, {
+        get ["data-theme"] () {
+            return local.dataTheme;
+        },
+        get ["class"] () {
+            return classes();
+        },
+        get style () {
+            return local.style;
+        },
+        get children () {
+            return local.children;
+        }
+    }));
+};
+const IndicatorItem = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "horizontal",
+        "vertical",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "as"
+    ]);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("indicator-item", local.class, local.className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "indicator-start": "start" === local.horizontal,
+            "indicator-center": "center" === local.horizontal,
+            "indicator-end": "end" === local.horizontal,
+            "indicator-top": "top" === local.vertical,
+            "indicator-middle": "middle" === local.vertical,
+            "indicator-bottom": "bottom" === local.vertical
+        }));
+    const Tag = local.as || "span";
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.Dynamic, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+        component: Tag
+    }, others, {
+        get ["data-theme"] () {
+            return local.dataTheme;
+        },
+        get ["class"] () {
+            return classes();
+        },
+        get style () {
+            return local.style;
+        },
+        get children () {
+            return local.children;
+        }
+    }));
+};
+const indicator_Indicator = Object.assign(Indicator, {
+    Item: IndicatorItem
+});
+export { indicator_Indicator as default };

package/dist/components/indicator/index.js

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

package/dist/components/indicator/indicator.css

@@ -0,0 +1,70 @@
+@layer components {
+  .indicator {
+      position: relative;
+      display: inline-flex;
+      width: max-content;
+    }
+
+  .indicator :where(.indicator-item) {
+      z-index: 1;
+      position: absolute;
+      white-space: nowrap;
+      top: var(--indicator-t, 0);
+      bottom: var(--indicator-b, auto);
+      left: var(--indicator-s, auto);
+      right: var(--indicator-e, 0);
+      translate: var(--indicator-x, 50%) var(--indicator-y, -50%);
+    }
+
+  .indicator-end {
+      --indicator-s: auto;
+      --indicator-e: 0;
+      --indicator-x: 50%;
+    }
+
+  [dir="rtl"] .indicator-end {
+      --indicator-s: 0;
+      --indicator-e: auto;
+      --indicator-x: -50%;
+    }
+
+  .indicator-start {
+      --indicator-s: 0;
+      --indicator-e: auto;
+      --indicator-x: -50%;
+    }
+
+  [dir="rtl"] .indicator-start {
+      --indicator-s: auto;
+      --indicator-e: 0;
+      --indicator-x: 50%;
+    }
+
+  .indicator-center {
+      --indicator-s: 50%;
+      --indicator-e: 50%;
+      --indicator-x: -50%;
+    }
+
+  [dir="rtl"] .indicator-center {
+      --indicator-x: 50%;
+    }
+
+  .indicator-bottom {
+      --indicator-t: auto;
+      --indicator-b: 0;
+      --indicator-y: 50%;
+    }
+
+  .indicator-middle {
+      --indicator-t: 50%;
+      --indicator-b: 50%;
+      --indicator-y: -50%;
+    }
+
+  .indicator-top {
+      --indicator-t: 0;
+      --indicator-b: auto;
+      --indicator-y: -50%;
+    }
+}

package/dist/components/input/Input.d.ts

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

package/dist/components/input/Input.js

@@ -0,0 +1,136 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./input.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_clsx__ from "clsx";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<label><input>");
+const Input = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "size",
+        "color",
+        "variant",
+        "fullWidth",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "leftIcon",
+        "rightIcon",
+        "placeholder",
+        "type",
+        "ref",
+        "aria-label",
+        "aria-describedby",
+        "aria-invalid",
+        "aria-required"
+    ]);
+    const [passwordVisible, setPasswordVisible] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const inputType = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>{
+        if ("password" === local.type) return passwordVisible() ? "text" : "password";
+        return local.type;
+    });
+    const colorFocusMap = {
+        primary: "focus-within:border-primary",
+        success: "focus-within:border-success",
+        warning: "focus-within:border-warning",
+        error: "focus-within:border-error",
+        info: "focus-within:border-info",
+        default: "focus-within:border-base-content"
+    };
+    const labelClasses = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("input", "items-center gap-2 focus-within:outline-none", local.class, local.className, colorFocusMap[local.color || "default"], (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+            "input-bordered": "bordered" === local.variant || !local.variant,
+            "input-ghost": "ghost" === local.variant || "ghost" === local.color,
+            "w-full": false !== local.fullWidth,
+            "input-xl": "xl" === local.size,
+            "input-lg": "lg" === local.size,
+            "input-md": "md" === local.size,
+            "input-sm": "sm" === local.size,
+            "input-xs": "xs" === local.size,
+            "input-primary": "primary" === local.color,
+            "input-secondary": "secondary" === local.color,
+            "input-accent": "accent" === local.color,
+            "input-info": "info" === local.color,
+            "input-success": "success" === local.color,
+            "input-warning": "warning" === local.color,
+            "input-error": "error" === local.color
+        }));
+    const inputClasses = ()=>"grow bg-transparent focus:outline-none";
+    return (()=>{
+        var _el$ = _tmpl$2(), _el$2 = _el$.firstChild;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return local.leftIcon;
+            },
+            get children () {
+                return local.leftIcon;
+            }
+        }), _el$2);
+        var _ref$ = local.ref;
+        "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$2) : local.ref = _el$2;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            get type () {
+                return inputType();
+            },
+            get ["aria-label"] () {
+                return local["aria-label"];
+            },
+            get ["aria-describedby"] () {
+                return local["aria-describedby"];
+            },
+            get ["aria-invalid"] () {
+                return local["aria-invalid"];
+            },
+            get ["aria-required"] () {
+                return local["aria-required"];
+            },
+            get placeholder () {
+                return local["placeholder"];
+            },
+            get style () {
+                return local.style;
+            },
+            get ["class"] () {
+                return inputClasses();
+            }
+        }), false, false);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return local.rightIcon;
+            },
+            get children () {
+                var _el$3 = _tmpl$();
+                _el$3.$$click = ()=>setPasswordVisible(!passwordVisible());
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>local.rightIcon);
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+                    var _v$ = "password" === local.type ? "cursor-pointer" : "", _v$2 = "password" === local.type ? "button" : void 0, _v$3 = "password" === local.type ? passwordVisible() ? "Hide password" : "Show password" : void 0, _v$4 = "password" === local.type ? 0 : void 0;
+                    _v$ !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$3, _p$.e = _v$);
+                    _v$2 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$3, "role", _p$.t = _v$2);
+                    _v$3 !== _p$.a && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$3, "aria-label", _p$.a = _v$3);
+                    _v$4 !== _p$.o && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$3, "tabindex", _p$.o = _v$4);
+                    return _p$;
+                }, {
+                    e: void 0,
+                    t: void 0,
+                    a: void 0,
+                    o: void 0
+                });
+                return _el$3;
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+            var _v$5 = labelClasses(), _v$6 = local.dataTheme;
+            _v$5 !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, _p$.e = _v$5);
+            _v$6 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$, "data-theme", _p$.t = _v$6);
+            return _p$;
+        }, {
+            e: void 0,
+            t: void 0
+        });
+        return _el$;
+    })();
+};
+const input_Input = Input;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
+export { input_Input as default };

package/dist/components/input/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Input_js_5d6e4288__ from "./Input.js";
+const input = __WEBPACK_EXTERNAL_MODULE__Input_js_5d6e4288__["default"];
+export { input as default };