@pathscale/ui 0.0.87 → 0.0.89

package/dist/components/bottom-sheet/BottomSheet.d.ts

@@ -0,0 +1,11 @@
+import { Component } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export interface BottomSheetProps extends IComponentBaseProps {
+    isOpen: boolean;
+    onClose: () => void;
+    children?: any;
+    closeOnOverlayClick?: boolean;
+    closeOnSwipeDown?: boolean;
+}
+declare const BottomSheet: Component<BottomSheetProps>;
+export default BottomSheet;

package/dist/components/bottom-sheet/index.d.ts

@@ -0,0 +1,2 @@
+export type { BottomSheetProps } from "./BottomSheet";
+export { default } from "./BottomSheet";

package/dist/components/form/Form.d.ts

@@ -5,6 +5,7 @@ export { type ValidatedFormProps } from "./ValidatedForm";
 export { type FormFieldProps } from "./FormField";
 export { type PasswordFieldProps } from "./PasswordField";
 export { type NumberFieldProps } from "./NumberField";
+export { type FormDropdownProps, type DropdownOption } from "./FormDropdown";
 export type FormProps = Omit<JSX.HTMLAttributes<HTMLFormElement>, "ref"> & IComponentBaseProps & {
     autoFocus?: boolean;
     cycleOnEnter?: boolean;
@@ -16,5 +17,6 @@ declare const _default: ParentComponent<FormProps> & {
     Field: import("solid-js").Component<import("./FormField").FormFieldProps>;
     Password: import("solid-js").Component<import("./PasswordField").PasswordFieldProps>;
     Number: import("solid-js").Component<import("./NumberField").NumberFieldProps>;
+    Dropdown: import("solid-js").Component<import("./FormDropdown").FormDropdownProps>;
 };
 export default _default;

package/dist/components/form/FormDropdown.d.ts

@@ -0,0 +1,25 @@
+import { Component, JSX } from "solid-js";
+export interface DropdownOption {
+    value: string;
+    label: string;
+}
+export interface FormDropdownProps {
+    label: string;
+    name: string;
+    options: DropdownOption[];
+    value?: string;
+    placeholder?: string;
+    required?: boolean;
+    labelClass?: string;
+    errorClass?: string;
+    containerClass?: string;
+    description?: string;
+    descriptionClass?: string;
+    class?: string;
+    className?: string;
+    icon?: JSX.Element;
+    onChange?: (value: string) => void;
+    disabled?: boolean;
+}
+export declare const FormDropdown: Component<FormDropdownProps>;
+export default FormDropdown;

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

@@ -1,3 +1,4 @@
 export { default } from "./Form";
 export { type FormProps, type ValidatedFormProps, type FormFieldProps, type PasswordFieldProps, type NumberFieldProps, useFormValidation, } from "./Form";
 export { type LabelProps } from "./Label";
+export { default as FormDropdown, type FormDropdownProps, type DropdownOption, } from "./FormDropdown";

package/dist/index.d.ts

@@ -6,6 +6,8 @@ export { default as Background } from "./components/background";
 export { default as Badge } from "./components/badge";
 export { Breadcrumbs, BreadcrumbsItem } from "./components/breadcrumbs";
 export { default as BrowserMockup, type BrowserMockupProps, } from "./components/browsermockup";
+export { default as BottomSheet } from "./components/bottom-sheet/BottomSheet";
+export type { BottomSheetProps } from "./components/bottom-sheet/BottomSheet";
 export { default as Button } from "./components/button";
 export { default as Calendar, type CalendarProps } from "./components/calendar";
 export { default as Card } from "./components/card";

package/dist/index.js

@@ -4119,6 +4119,110 @@ const BrowserMockup = (props)=>{
     })();
 };
 const browsermockup_BrowserMockup = BrowserMockup;
+var BottomSheet_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), BottomSheet_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class=p-4><div class="w-12 h-1 bg-base-content/30 rounded-full mx-auto mb-4">');
+const BottomSheet = (props)=>{
+    const merged = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.mergeProps)({
+        closeOnOverlayClick: true,
+        closeOnSwipeDown: true
+    }, props);
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(merged, [
+        "isOpen",
+        "onClose",
+        "children",
+        "dataTheme",
+        "class",
+        "className",
+        "style",
+        "closeOnOverlayClick",
+        "closeOnSwipeDown"
+    ]);
+    const [isDragging, setIsDragging] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const [startY, setStartY] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(0);
+    const [currentY, setCurrentY] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(0);
+    let sheetRef;
+    let overlayRef;
+    const handleTouchStart = (e)=>{
+        if (!local.closeOnSwipeDown) return;
+        const touchY = e.touches[0].clientY;
+        const sheetTop = sheetRef?.getBoundingClientRect().top || 0;
+        if (touchY - sheetTop < 50) {
+            setIsDragging(true);
+            setStartY(touchY);
+            setCurrentY(touchY);
+        }
+    };
+    const handleTouchMove = (e)=>{
+        if (!isDragging()) return;
+        const deltaY = e.touches[0].clientY - startY();
+        const newY = Math.max(0, deltaY);
+        setCurrentY(e.touches[0].clientY);
+        if (sheetRef) sheetRef.style.transform = `translateY(${newY}px)`;
+        e.preventDefault();
+    };
+    const handleTouchEnd = ()=>{
+        if (!isDragging()) return;
+        setIsDragging(false);
+        const deltaY = currentY() - startY();
+        if (deltaY > 100) local.onClose();
+        else if (sheetRef) sheetRef.style.transform = "translateY(0)";
+    };
+    const handleOverlayClick = (e)=>{
+        if (local.closeOnOverlayClick && e.target === overlayRef) local.onClose();
+    };
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onMount)(()=>{
+        if (sheetRef && local.closeOnSwipeDown) {
+            sheetRef.addEventListener("touchstart", handleTouchStart, {
+                passive: true
+            });
+            sheetRef.addEventListener("touchmove", handleTouchMove, {
+                passive: false
+            });
+            sheetRef.addEventListener("touchend", handleTouchEnd, {
+                passive: true
+            });
+        }
+    });
+    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onCleanup)(()=>{
+        if (sheetRef) {
+            sheetRef.removeEventListener("touchstart", handleTouchStart);
+            sheetRef.removeEventListener("touchmove", handleTouchMove);
+            sheetRef.removeEventListener("touchend", handleTouchEnd);
+        }
+    });
+    return [
+        (()=>{
+            var _el$ = BottomSheet_tmpl$();
+            _el$.$$click = handleOverlayClick;
+            var _ref$ = overlayRef;
+            "function" == typeof _ref$ ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$, _el$) : overlayRef = _el$;
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, clsx("fixed inset-0 bg-base-100 bg-opacity-60 z-40 transition-opacity duration-200", local.isOpen ? "opacity-100" : "opacity-0 pointer-events-none")));
+            return _el$;
+        })(),
+        (()=>{
+            var _el$2 = BottomSheet_tmpl$2(), _el$3 = _el$2.firstChild;
+            _el$3.firstChild;
+            var _ref$2 = sheetRef;
+            "function" == typeof _ref$2 ? (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)(_ref$2, _el$2) : sheetRef = _el$2;
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+                get ["class"] () {
+                    return clsx("bg-base-300 text-base-content fixed bottom-0 left-0 right-0 rounded-t-2xl shadow-lg z-50 transition-transform duration-300 ease-out", local.isOpen ? "translate-y-0" : "translate-y-full");
+                },
+                get style () {
+                    return {
+                        transform: isDragging() ? `translateY(${Math.max(0, currentY() - startY())}px)` : void 0,
+                        ...local.style
+                    };
+                }
+            }, others), false, true);
+            (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>local.children, null);
+            return _el$2;
+        })()
+    ];
+};
+const bottom_sheet_BottomSheet = BottomSheet;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
 var Loading_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>");
 const Loading = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
@@ -4263,7 +4367,8 @@ const Button = (props)=>{
             "btn-xs sm:btn-sm md:btn-md lg:btn-lg": local.responsive,
             "no-animation": !local.animation,
             "btn-active": local.active,
-            "btn-disabled": local.disabled
+            "btn-disabled": local.disabled,
+            "cursor-not-allowed": local.disabled
         }), local.class, local.className);
     const Tag = local.as || "button";
     if (Button_VoidElementList.includes(Tag)) 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)({
@@ -7243,7 +7348,7 @@ const DropdownDetails = Object.assign(Details, {
     Toggle: DropdownToggle_Summary
 });
 var DropdownItem_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<li role=menuitem>"), DropdownItem_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<a>"), DropdownItem_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<button>");
-const DropdownItem = (props)=>{
+const DropdownItem_DropdownItem = (props)=>{
     const dropdownContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(DropdownContext);
     const defaultProps = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.mergeProps)({
         closeOnClick: true
@@ -7285,7 +7390,7 @@ const DropdownItem = (props)=>{
         return _el$;
     })();
 };
-const dropdown_DropdownItem = DropdownItem;
+const DropdownItem = DropdownItem_DropdownItem;
 var DropdownMenu_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<ul>");
 const DropdownMenu = (props)=>{
     const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
@@ -7486,7 +7591,7 @@ const dropdown_Dropdown = Object.assign(Dropdown, {
     Details: DropdownDetails,
     Toggle: dropdown_DropdownToggle,
     Menu: dropdown_DropdownMenu,
-    Item: dropdown_DropdownItem
+    Item: DropdownItem
 });
 const dropdown = dropdown_Dropdown;
 var FileInput_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<input>");
@@ -8076,6 +8181,136 @@ const NumberField = (props)=>{
     })();
 };
 const form_NumberField = NumberField;
+var FormDropdown_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span>"), FormDropdown_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<p>"), FormDropdown_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), FormDropdown_tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="text-error ml-1">*'), _tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span class=ml-2>");
+const FormDropdown_FormDropdown = (props)=>{
+    const { errors, touched, setData } = useFormValidation();
+    const [local, _] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "label",
+        "name",
+        "options",
+        "value",
+        "placeholder",
+        "required",
+        "labelClass",
+        "errorClass",
+        "containerClass",
+        "description",
+        "descriptionClass",
+        "class",
+        "className",
+        "icon",
+        "onChange",
+        "disabled"
+    ]);
+    const containerClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>twMerge("flex flex-col gap-2", local.containerClass));
+    const descriptionClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>twMerge("text-sm text-base-content/70", local.descriptionClass));
+    const errorClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>twMerge("text-error text-sm", local.errorClass));
+    const dropdownClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>twMerge("border border-base-300 rounded px-4 py-2 w-full flex justify-between items-center", local.disabled ? "opacity-70 cursor-not-allowed" : "", local.class, local.className));
+    const hasError = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>touched(local.name) && !!errors(local.name));
+    const selectedOption = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.options.find((opt)=>opt.value === local.value));
+    const handleSelect = (value)=>{
+        setData(local.name, value);
+        if (local.onChange) local.onChange(value);
+    };
+    return (()=>{
+        var _el$ = FormDropdown_tmpl$3();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(form_Form.Label, {
+            get title () {
+                return local.label;
+            },
+            get ["class"] () {
+                return local.labelClass;
+            },
+            get children () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.required)() && FormDropdown_tmpl$4();
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.description);
+            return ()=>_c$() && (()=>{
+                    var _el$5 = FormDropdown_tmpl$2();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$5, ()=>local.description);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$5, descriptionClasses()));
+                    return _el$5;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(dropdown, {
+            fullWidth: true,
+            get children () {
+                return [
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(dropdown.Toggle, {
+                        get ["class"] () {
+                            return dropdownClasses();
+                        },
+                        get ["aria-invalid"] () {
+                            return hasError();
+                        },
+                        get ["aria-required"] () {
+                            return local.required;
+                        },
+                        get id () {
+                            return local.name;
+                        },
+                        get disabled () {
+                            return local.disabled;
+                        },
+                        get children () {
+                            return [
+                                (()=>{
+                                    var _el$2 = FormDropdown_tmpl$();
+                                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>selectedOption()?.label || local.placeholder || "Select an option");
+                                    return _el$2;
+                                })(),
+                                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>local.icon || (()=>{
+                                        var _el$6 = _tmpl$5();
+                                        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$6, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(icon_Icon, {
+                                            name: "icon-[mdi-light--chevron-down]",
+                                            width: 20,
+                                            height: 20
+                                        }));
+                                        return _el$6;
+                                    })())
+                            ];
+                        }
+                    }),
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(dropdown.Menu, {
+                        class: "w-full",
+                        get children () {
+                            return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.For, {
+                                get each () {
+                                    return local.options;
+                                },
+                                children: (option)=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(dropdown.Item, {
+                                        onClick: ()=>handleSelect(option.value),
+                                        get ["class"] () {
+                                            return local.value === option.value ? "bg-base-200" : "";
+                                        },
+                                        get children () {
+                                            return option.label;
+                                        }
+                                    })
+                            });
+                        }
+                    })
+                ];
+            }
+        }), null);
+        (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 hasError();
+            },
+            get children () {
+                var _el$3 = FormDropdown_tmpl$2();
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>errors(local.name));
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$3, errorClasses()));
+                return _el$3;
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, containerClasses()));
+        return _el$;
+    })();
+};
+const FormDropdown = FormDropdown_FormDropdown;
 var Form_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<form role=form>");
 const Form = (props)=>{
     const merged = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.mergeProps)({
@@ -8150,7 +8385,8 @@ const form_Form = Object.assign(Form, {
     Validated: form_ValidatedForm,
     Field: form_FormField,
     Password: form_PasswordField,
-    Number: form_NumberField
+    Number: form_NumberField,
+    Dropdown: FormDropdown
 });
 const colsMap = {
     1: "grid-cols-1",
@@ -10374,7 +10610,7 @@ const steps_Steps = Object.assign(Steps, {
     Step: steps_Step
 });
 const steps = steps_Steps;
-var SvgBackground_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><ellipse></svg>", false, true, false), SvgBackground_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle></svg>", false, true, false), SvgBackground_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=0 r=100 opacity=0.7></svg>", false, true, false), SvgBackground_tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=0 r=120></svg>", false, true, false), _tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=400 r=100 opacity=0.7></svg>", false, true, false), _tmpl$6 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=400 r=120></svg>", false, true, false), _tmpl$7 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=200 r=70 opacity=0.6></svg>", false, true, false), _tmpl$8 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=200 cy=0 r=100></svg>", false, true, false), _tmpl$9 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=200 r=100></svg>", false, true, false), _tmpl$0 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=200 cy=400 r=100></svg>", false, true, false), _tmpl$1 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div><svg viewBox="0 0 400 400"xmlns=http://www.w3.org/2000/svg><rect width=400 height=400></rect></svg></div><canvas></canvas><div class="relative z-10 h-full w-full">'), _tmpl$10 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="absolute inset-0 z-5">');
+var SvgBackground_tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><ellipse></svg>", false, true, false), SvgBackground_tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle></svg>", false, true, false), SvgBackground_tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=0 r=100 opacity=0.7></svg>", false, true, false), SvgBackground_tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=0 r=120></svg>", false, true, false), SvgBackground_tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=400 r=100 opacity=0.7></svg>", false, true, false), _tmpl$6 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=400 r=120></svg>", false, true, false), _tmpl$7 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=0 cy=200 r=70 opacity=0.6></svg>", false, true, false), _tmpl$8 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=200 cy=0 r=100></svg>", false, true, false), _tmpl$9 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=400 cy=200 r=100></svg>", false, true, false), _tmpl$0 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<svg><circle cx=200 cy=400 r=100></svg>", false, true, false), _tmpl$1 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div><svg viewBox="0 0 400 400"xmlns=http://www.w3.org/2000/svg><rect width=400 height=400></rect></svg></div><canvas></canvas><div class="relative z-10 h-full w-full">'), _tmpl$10 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="absolute inset-0 z-5">');
 function hexToRgb(hex) {
     hex = hex.replace(/^#/, '');
     const bigint = parseInt(hex, 16);
@@ -10529,7 +10765,7 @@ function SvgBackground(props) {
                 return _el$5;
             })(),
             (()=>{
-                var _el$6 = _tmpl$5();
+                var _el$6 = SvgBackground_tmpl$5();
                 (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$6, "fill", getIntermediateColor(0.75)));
                 return _el$6;
             })(),
@@ -11784,4 +12020,4 @@ const WindowMockup = (props)=>{
     })();
 };
 const windowmockup_WindowMockup = WindowMockup;
-export { accordion_Accordion as Accordion, alert_Alert as Alert, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, Badge, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, connectionstatus_ConnectionStatus as ConnectionStatus, CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, FileInput, flex_Flex as Flex, footer_Footer as Footer, form_Form as Form, Grid, hero_Hero as Hero, icon_Icon as Icon, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, link_Link as Link, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, navbar_Navbar as Navbar, pagination_Pagination as Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, range_Range as Range, Rating, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, showcase_section_ShowcaseSection as ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, skeleton_Skeleton as Skeleton, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, Summary, SvgBackground, Swap, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, windowmockup_WindowMockup as WindowMockup, connectionstatus_ConnectionStatus as default, toastStore, useDesktop, useFormValidation };
+export { accordion_Accordion as Accordion, alert_Alert as Alert, artboard_Artboard as Artboard, avatar as Avatar, background_Background as Background, Badge, bottom_sheet_BottomSheet as BottomSheet, Breadcrumbs, breadcrumbs_BreadcrumbsItem as BreadcrumbsItem, browsermockup_BrowserMockup as BrowserMockup, button_Button as Button, Calendar, card_Card as Card, carousel_Carousel as Carousel, chatbubble_ChatBubble as ChatBubble, checkbox_Checkbox as Checkbox, codemockup_CodeMockup as CodeMockup, CodeMockupLine, collapse_Collapse as Collapse, CollapseContent, CollapseDetails, CollapseTitle, connectionstatus_ConnectionStatus as ConnectionStatus, CopyButton, countdown_Countdown as Countdown, diff_Diff as Diff, divider as Divider, dock as Dock, Drawer, dropdown as Dropdown, FileInput, flex_Flex as Flex, footer_Footer as Footer, form_Form as Form, Grid, hero_Hero as Hero, icon_Icon as Icon, indicator_Indicator as Indicator, input as Input, join_Join as Join, kbd_Kbd as Kbd, link_Link as Link, loading_Loading as Loading, mask as Mask, menu_Menu as Menu, modal_Modal as Modal, navbar_Navbar as Navbar, pagination_Pagination as Pagination, phonemockup_PhoneMockup as PhoneMockup, Progress, props_table_PropsTable as PropsTable, radialprogress_RadialProgress as RadialProgress, radio_Radio as Radio, range_Range as Range, Rating, select_Select as Select, showcase_ShowcaseBlock as ShowcaseBlock, showcase_section_ShowcaseSection as ShowcaseSection, sidenav_Sidenav as Sidenav, sidenav_SidenavButton as SidenavButton, sidenav_SidenavGroup as SidenavGroup, sidenav_SidenavItem as SidenavItem, sidenav_SidenavLink as SidenavLink, sidenav_SidenavMenu as SidenavMenu, skeleton_Skeleton as Skeleton, Stack, stat_card_StatCard as StatCard, stats_Stats as Stats, status_Status as Status, steps as Steps, Summary, SvgBackground, Swap, table_Table as Table, tabs_Tabs as Tabs, textarea_Textarea as Textarea, Timeline, timeline_TimelineEnd as TimelineEnd, timeline_TimelineItem as TimelineItem, timeline_TimelineMiddle as TimelineMiddle, timeline_TimelineStart as TimelineStart, toast_Toast as Toast, ToastContainer, toggle_Toggle as Toggle, tooltip_Tooltip as Tooltip, windowmockup_WindowMockup as WindowMockup, connectionstatus_ConnectionStatus as default, toastStore, useDesktop, useFormValidation };

package/dist/styles/icons/generated-icons.css

@@ -1 +1 @@
-.iconify{background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.iconify,.iconify-color{display:inline-block;height:1em;width:1em}.iconify-color{background-repeat:no-repeat;background-size:100% 100%}.icon-[mdi-light--chevron-left]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14.41 18.16 8.75 12.5l5.66-5.66.7.71-4.95 4.95 4.95 4.95z'/%3E%3C/svg%3E")}.icon-[mdi-light--chevron-left].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--chevron-left].iconify-color{background-image:var(--svg)}.icon-[mdi-light--chevron-right]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m8.59 18.16 5.66-5.66-5.66-5.66-.7.71 4.95 4.95-4.95 4.95z'/%3E%3C/svg%3E")}.icon-[mdi-light--chevron-right].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--chevron-right].iconify-color{background-image:var(--svg)}.icon-[mdi-light--eye]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M11.5 18c4 0 7.46-2.22 9.24-5.5C18.96 9.22 15.5 7 11.5 7s-7.46 2.22-9.24 5.5C4.04 15.78 7.5 18 11.5 18m0-12c4.56 0 8.5 2.65 10.36 6.5C20 16.35 16.06 19 11.5 19S3 16.35 1.14 12.5C3 8.65 6.94 6 11.5 6m0 2C14 8 16 10 16 12.5S14 17 11.5 17 7 15 7 12.5 9 8 11.5 8m0 1A3.5 3.5 0 0 0 8 12.5a3.5 3.5 0 0 0 3.5 3.5 3.5 3.5 0 0 0 3.5-3.5A3.5 3.5 0 0 0 11.5 9'/%3E%3C/svg%3E")}.icon-[mdi-light--eye].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--eye].iconify-color{background-image:var(--svg)}.icon-[mdi-light--eye-off]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M2.54 4.71 3.25 4 20 20.75l-.71.71-3.34-3.35c-1.37.57-2.87.89-4.45.89-4.56 0-8.5-2.65-10.36-6.5.97-2 2.49-3.67 4.36-4.82zM11.5 18c1.29 0 2.53-.23 3.67-.66l-1.12-1.13c-.73.5-1.6.79-2.55.79C9 17 7 15 7 12.5c0-.95.29-1.82.79-2.55L6.24 8.41a10.64 10.64 0 0 0-3.98 4.09C4.04 15.78 7.5 18 11.5 18m9.24-5.5C18.96 9.22 15.5 7 11.5 7c-1.15 0-2.27.19-3.31.53l-.78-.78C8.68 6.26 10.06 6 11.5 6c4.56 0 8.5 2.65 10.36 6.5a11.47 11.47 0 0 1-4.07 4.63l-.72-.73c1.53-.96 2.8-2.3 3.67-3.9M11.5 8C14 8 16 10 16 12.5c0 .82-.22 1.58-.6 2.24l-.74-.74c.22-.46.34-.96.34-1.5A3.5 3.5 0 0 0 11.5 9c-.54 0-1.04.12-1.5.34l-.74-.74c.66-.38 1.42-.6 2.24-.6M8 12.5a3.5 3.5 0 0 0 3.5 3.5c.67 0 1.29-.19 1.82-.5L8.5 10.68c-.31.53-.5 1.15-.5 1.82'/%3E%3C/svg%3E")}.icon-[mdi-light--eye-off].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--eye-off].iconify-color{background-image:var(--svg)}
+.iconify{background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.iconify,.iconify-color{display:inline-block;height:1em;width:1em}.iconify-color{background-repeat:no-repeat;background-size:100% 100%}.icon-[mdi-light--chevron-down]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m5.84 9.59 5.66 5.66 5.66-5.66-.71-.7-4.95 4.95-4.95-4.95z'/%3E%3C/svg%3E")}.icon-[mdi-light--chevron-down].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--chevron-down].iconify-color{background-image:var(--svg)}.icon-[mdi-light--chevron-left]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M14.41 18.16 8.75 12.5l5.66-5.66.7.71-4.95 4.95 4.95 4.95z'/%3E%3C/svg%3E")}.icon-[mdi-light--chevron-left].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--chevron-left].iconify-color{background-image:var(--svg)}.icon-[mdi-light--chevron-right]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='m8.59 18.16 5.66-5.66-5.66-5.66-.7.71 4.95 4.95-4.95 4.95z'/%3E%3C/svg%3E")}.icon-[mdi-light--chevron-right].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--chevron-right].iconify-color{background-image:var(--svg)}.icon-[mdi-light--eye]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M11.5 18c4 0 7.46-2.22 9.24-5.5C18.96 9.22 15.5 7 11.5 7s-7.46 2.22-9.24 5.5C4.04 15.78 7.5 18 11.5 18m0-12c4.56 0 8.5 2.65 10.36 6.5C20 16.35 16.06 19 11.5 19S3 16.35 1.14 12.5C3 8.65 6.94 6 11.5 6m0 2C14 8 16 10 16 12.5S14 17 11.5 17 7 15 7 12.5 9 8 11.5 8m0 1A3.5 3.5 0 0 0 8 12.5a3.5 3.5 0 0 0 3.5 3.5 3.5 3.5 0 0 0 3.5-3.5A3.5 3.5 0 0 0 11.5 9'/%3E%3C/svg%3E")}.icon-[mdi-light--eye].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--eye].iconify-color{background-image:var(--svg)}.icon-[mdi-light--eye-off]{--svg:url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M2.54 4.71 3.25 4 20 20.75l-.71.71-3.34-3.35c-1.37.57-2.87.89-4.45.89-4.56 0-8.5-2.65-10.36-6.5.97-2 2.49-3.67 4.36-4.82zM11.5 18c1.29 0 2.53-.23 3.67-.66l-1.12-1.13c-.73.5-1.6.79-2.55.79C9 17 7 15 7 12.5c0-.95.29-1.82.79-2.55L6.24 8.41a10.64 10.64 0 0 0-3.98 4.09C4.04 15.78 7.5 18 11.5 18m9.24-5.5C18.96 9.22 15.5 7 11.5 7c-1.15 0-2.27.19-3.31.53l-.78-.78C8.68 6.26 10.06 6 11.5 6c4.56 0 8.5 2.65 10.36 6.5a11.47 11.47 0 0 1-4.07 4.63l-.72-.73c1.53-.96 2.8-2.3 3.67-3.9M11.5 8C14 8 16 10 16 12.5c0 .82-.22 1.58-.6 2.24l-.74-.74c.22-.46.34-.96.34-1.5A3.5 3.5 0 0 0 11.5 9c-.54 0-1.04.12-1.5.34l-.74-.74c.66-.38 1.42-.6 2.24-.6M8 12.5a3.5 3.5 0 0 0 3.5 3.5c.67 0 1.29-.19 1.82-.5L8.5 10.68c-.31.53-.5 1.15-.5 1.82'/%3E%3C/svg%3E")}.icon-[mdi-light--eye-off].iconify{-webkit-mask-image:var(--svg);mask-image:var(--svg)}.icon-[mdi-light--eye-off].iconify-color{background-image:var(--svg)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "0.0.87",
+  "version": "0.0.89",
   "author": "pathscale",
   "repository": {
     "type": "git",