@pathscale/ui 2.4.0 → 2.6.0

package/dist/components/checkbox/Checkbox.generated.js

@@ -1,12 +1,12 @@
-import { createComponent, insert, mergeProps, spread, template, use } from "solid-js/web";
-import { defineComponent } from "solid-layouts/application-boundary";
+import { createComponent, insert, mergeProps, ref, spread, template } from "@solidjs/web";
+import { defineComponent } from "solid-layouts/solid-2/application-boundary";
 import "./Checkbox.css";
-import { Show, createEffect, createSignal, splitProps, useContext } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { Show, createEffect, createSignal, omit, useContext } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CheckboxGroupContext } from "../checkbox-group/context.js";
 import { CLASSES, componentRecipe } from "./Checkbox.recipe.js";
 import { resolveState } from "../vocabulary.js";
-var _tmpl$ = /*#__PURE__*/ template('<svg aria-hidden=true data-slot=checkbox-default-indicator--indeterminate fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-width=3 viewBox="0 0 24 24"><line x1=21 x2=3 y1=12 y2=12>'), _tmpl$2 = /*#__PURE__*/ template("<span data-slot=label>"), _tmpl$3 = /*#__PURE__*/ template("<span>"), _tmpl$4 = /*#__PURE__*/ template("<label><input><span><span>"), _tmpl$5 = /*#__PURE__*/ template('<svg aria-hidden=true data-slot=checkbox-default-indicator--checkmark fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox="0 0 17 18"><polyline points="1 9 7 14 15 4">');
+var _tmpl$ = /*#__PURE__*/ template('<svg aria-hidden=true data-slot=checkbox-default-indicator--indeterminate fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-width=3 viewBox="0 0 24 24"><line x1=21 x2=3 y1=12 y2=12>'), _tmpl$2 = /*#__PURE__*/ template("<span data-slot=label>"), _tmpl$3 = /*#__PURE__*/ template("<span>"), _tmpl$4 = /*#__PURE__*/ template("<span><!><!>"), _tmpl$5 = /*#__PURE__*/ template("<label><input><span><span>"), _tmpl$6 = /*#__PURE__*/ template('<svg aria-hidden=true data-slot=checkbox-default-indicator--checkmark fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox="0 0 17 18"><polyline points="1 9 7 14 15 4">');
 const invokeEventHandler = (handler, event)=>{
     if ("function" == typeof handler) return void handler(event);
     if (Array.isArray(handler) && "function" == typeof handler[0]) handler[0](handler[1], event);
@@ -14,166 +14,147 @@ const invokeEventHandler = (handler, event)=>{
 const __solidLayoutCheckbox = (_stable, p)=>{
     let inputRef;
     const group = useContext(CheckboxGroupContext);
-    const [local, others] = splitProps(p, [
-        "class",
-        "children",
-        "description",
-        "state",
-        "issues",
-        "isIndeterminate",
-        "indeterminate",
-        "variant",
-        "checked",
-        "defaultChecked",
-        "value",
-        "name",
-        "disabled",
-        "onChange",
-        "dataTheme",
-        "aria-invalid"
-    ]);
-    const [internalSelected, setInternalSelected] = createSignal(Boolean(local.defaultChecked));
-    const isControlled = ()=>void 0 !== local.checked;
-    const optionValue = ()=>null != local.value ? String(local.value) : void 0;
+    const others = omit(p, "class", "children", "description", "state", "issues", "isIndeterminate", "indeterminate", "variant", "checked", "defaultChecked", "value", "name", "disabled", "onChange", "dataTheme", "aria-invalid");
+    const [internalSelected, setInternalSelected] = createSignal(Boolean(p.defaultChecked));
+    const isControlled = ()=>void 0 !== p.checked;
+    const optionValue = ()=>null != p.value ? String(p.value) : void 0;
     const isGrouped = ()=>Boolean(group && void 0 !== optionValue());
-    const isSelected = ()=>isGrouped() ? Boolean(group?.value().includes(optionValue())) : isControlled() ? Boolean(local.checked) : internalSelected();
-    const isDisabled = ()=>Boolean("disabled" === local.state) || Boolean(local.disabled) || Boolean(group?.isDisabled());
-    const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues)) || Boolean(local["aria-invalid"]) || Boolean(group?.isInvalid());
-    const isIndeterminate = ()=>Boolean(local.isIndeterminate) || Boolean(local.indeterminate);
-    const variant = ()=>local.variant ?? group?.variant() ?? "primary";
-    const name = ()=>local.name ?? group?.name();
-    const hasContent = ()=>null != local.children || null != local.description;
+    const isSelected = ()=>isGrouped() ? Boolean(group?.value().includes(optionValue())) : isControlled() ? Boolean(p.checked) : internalSelected();
+    const isDisabled = ()=>Boolean("disabled" === p.state) || Boolean(p.disabled) || Boolean(group?.isDisabled());
+    const isInvalid = ()=>Boolean("invalid" === resolveState(p.state, p.issues)) || Boolean(p["aria-invalid"]) || Boolean(group?.isInvalid());
+    const isIndeterminate = ()=>Boolean(p.isIndeterminate) || Boolean(p.indeterminate);
+    const variant = ()=>p.variant ?? group?.variant() ?? "primary";
+    const name = ()=>p.name ?? group?.name();
+    const hasContent = ()=>null != p.children || null != p.description;
     createEffect(()=>{
         if (!inputRef) return;
         inputRef.indeterminate = isIndeterminate();
     });
     const handleChange = (event)=>{
-        invokeEventHandler(local.onChange, event);
+        invokeEventHandler(p.onChange, event);
         if (event.defaultPrevented) return;
         if (isDisabled()) return;
         if (group && void 0 !== optionValue()) return void group.toggleValue(optionValue(), event.currentTarget.checked, event);
         if (!isControlled()) setInternalSelected(event.currentTarget.checked);
     };
-    return (()=>{
-        var _el$ = _tmpl$4(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild;
-        spread(_el$, mergeProps(()=>({
-                class: twMerge(CLASSES.base, CLASSES.variant[variant()], isDisabled() && CLASSES.flag.disabled, local.class)
-            }), {
-            get ["data-theme"] () {
-                return local.dataTheme;
-            },
-            "data-slot": "checkbox",
-            get ["data-selected"] () {
-                return isSelected() ? "true" : "false";
-            },
-            get ["data-indeterminate"] () {
-                return isIndeterminate() ? "true" : "false";
-            },
-            get ["data-disabled"] () {
-                return isDisabled() ? "true" : "false";
-            },
-            get ["data-invalid"] () {
-                return isInvalid() ? "true" : "false";
-            },
-            get ["data-has-description"] () {
-                return null != local.description ? "true" : "false";
-            },
-            get ["aria-disabled"] () {
-                return isDisabled() ? "true" : "false";
-            }
-        }), false, true);
-        use((el)=>{
+    var _el$ = _tmpl$5(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.firstChild;
+    spread(_el$, mergeProps(()=>({
+            class: twMerge(CLASSES.base, CLASSES.variant[variant()], isDisabled() && CLASSES.flag.disabled, p.class)
+        }), {
+        get ["data-theme"] () {
+            return p.dataTheme;
+        },
+        "data-slot": "checkbox",
+        get ["data-selected"] () {
+            return isSelected() ? "true" : "false";
+        },
+        get ["data-indeterminate"] () {
+            return isIndeterminate() ? "true" : "false";
+        },
+        get ["data-disabled"] () {
+            return isDisabled() ? "true" : "false";
+        },
+        get ["data-invalid"] () {
+            return isInvalid() ? "true" : "false";
+        },
+        get ["data-has-description"] () {
+            return null != p.description ? "true" : "false";
+        },
+        get ["aria-disabled"] () {
+            return isDisabled() ? "true" : "false";
+        }
+    }), true);
+    ref(()=>(el)=>{
             inputRef = el;
         }, _el$2);
-        spread(_el$2, mergeProps(others, {
-            type: "checkbox"
-        }, ()=>({
-                class: CLASSES.slot.input
-            }), {
-            "data-slot": "checkbox-input",
-            get value () {
-                return local.value;
-            },
-            get name () {
-                return name();
-            },
-            get checked () {
-                return isSelected();
-            },
-            get disabled () {
-                return isDisabled();
-            },
-            get ["aria-invalid"] () {
-                return local["aria-invalid"] ?? (isInvalid() ? true : void 0);
-            },
-            get ["aria-checked"] () {
-                return isIndeterminate() ? "mixed" : void 0;
-            },
-            onChange: handleChange
-        }), false, false);
-        spread(_el$3, mergeProps(()=>({
-                class: CLASSES.slot.control
-            }), {
-            "data-slot": "checkbox-control",
-            "aria-hidden": "true"
-        }), false, true);
-        spread(_el$4, mergeProps(()=>({
-                class: CLASSES.slot.indicator
-            }), {
-            "data-slot": "checkbox-indicator"
-        }), false, true);
-        insert(_el$4, createComponent(Show, {
-            get when () {
-                return isIndeterminate();
-            },
-            get fallback () {
-                return _tmpl$5();
-            },
-            get children () {
-                return _tmpl$();
-            }
-        }));
-        insert(_el$, createComponent(Show, {
-            get when () {
-                return hasContent();
-            },
-            get children () {
-                var _el$6 = _tmpl$3();
-                spread(_el$6, mergeProps(()=>({
-                        class: CLASSES.slot.content
-                    }), {
-                    "data-slot": "checkbox-content"
-                }), false, true);
-                insert(_el$6, createComponent(Show, {
-                    get when () {
-                        return local.children;
-                    },
-                    get children () {
-                        var _el$7 = _tmpl$2();
-                        insert(_el$7, ()=>local.children);
-                        return _el$7;
-                    }
-                }), null);
-                insert(_el$6, createComponent(Show, {
-                    get when () {
-                        return local.description;
-                    },
-                    get children () {
-                        var _el$8 = _tmpl$3();
-                        spread(_el$8, mergeProps(()=>({
-                                class: CLASSES.slot.description
-                            }), {
-                            "data-slot": "description"
-                        }), false, true);
-                        insert(_el$8, ()=>local.description);
-                        return _el$8;
-                    }
-                }), null);
-                return _el$6;
-            }
-        }), null);
-        return _el$;
-    })();
+    spread(_el$2, mergeProps(others, {
+        type: "checkbox"
+    }, ()=>({
+            class: CLASSES.slot.input
+        }), {
+        "data-slot": "checkbox-input",
+        get value () {
+            return p.value;
+        },
+        get name () {
+            return name();
+        },
+        get checked () {
+            return isSelected();
+        },
+        get disabled () {
+            return isDisabled();
+        },
+        get ["aria-invalid"] () {
+            return p["aria-invalid"] ?? (isInvalid() ? "true" : void 0);
+        },
+        get ["aria-checked"] () {
+            return isIndeterminate() ? "mixed" : void 0;
+        },
+        onChange: handleChange
+    }), false);
+    spread(_el$3, mergeProps(()=>({
+            class: CLASSES.slot.control
+        }), {
+        "data-slot": "checkbox-control",
+        "aria-hidden": "true"
+    }), true);
+    spread(_el$4, mergeProps(()=>({
+            class: CLASSES.slot.indicator
+        }), {
+        "data-slot": "checkbox-indicator"
+    }), true);
+    insert(_el$4, createComponent(Show, {
+        get when () {
+            return isIndeterminate();
+        },
+        get fallback () {
+            return _tmpl$6();
+        },
+        get children () {
+            return _tmpl$();
+        }
+    }));
+    insert(_el$, createComponent(Show, {
+        get when () {
+            return hasContent();
+        },
+        get children () {
+            var _el$6 = _tmpl$4(), _el$9 = _el$6.firstChild, _el$0 = _el$9.nextSibling;
+            spread(_el$6, mergeProps(()=>({
+                    class: CLASSES.slot.content
+                }), {
+                "data-slot": "checkbox-content"
+            }), true);
+            insert(_el$6, createComponent(Show, {
+                get when () {
+                    return p.children;
+                },
+                get children () {
+                    var _el$7 = _tmpl$2();
+                    insert(_el$7, ()=>p.children);
+                    return _el$7;
+                }
+            }), _el$9);
+            insert(_el$6, createComponent(Show, {
+                get when () {
+                    return p.description;
+                },
+                get children () {
+                    var _el$8 = _tmpl$3();
+                    spread(_el$8, mergeProps(()=>({
+                            class: CLASSES.slot.description
+                        }), {
+                        "data-slot": "description"
+                    }), true);
+                    insert(_el$8, ()=>p.description);
+                    return _el$8;
+                }
+            }), _el$0);
+            return _el$6;
+        }
+    }), null);
+    return _el$;
 };
 const Checkbox = defineComponent({
     recipe: componentRecipe,

package/dist/components/checkbox/Checkbox.recipe.d.ts

@@ -15,7 +15,7 @@ export declare const CLASSES: {
         readonly disabled: "checkbox--disabled";
     };
 };
-export declare const componentRecipe: import("solid-layouts").Recipe<{
+export declare const componentRecipe: import("solid-layouts/solid-2").Recipe<{
     readonly component: "checkbox";
     readonly slots: {
         readonly checkbox: {};

package/dist/components/checkbox-group/CheckboxGroup.generated.d.ts

@@ -1,6 +1,6 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./CheckboxGroup.css";
-import { type JSX } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import type { CheckboxVariant } from "../checkbox";
 import type { UIBaseProps, State, Issue } from "../vocabulary";
 export type CheckboxGroupVariant = CheckboxVariant;

package/dist/components/checkbox-group/CheckboxGroup.generated.js

@@ -1,34 +1,20 @@
-import { createComponent, insert, memo, mergeProps, spread, template } from "solid-js/web";
-import { defineComponent } from "solid-layouts/application-boundary";
+import { createComponent, insert, memo, mergeProps, spread, template } from "@solidjs/web";
+import { defineComponent } from "solid-layouts/solid-2/application-boundary";
 import "./CheckboxGroup.css";
-import { createSignal, splitProps } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { createSignal, omit } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CLASSES, componentRecipe } from "./CheckboxGroup.recipe.js";
 import { CheckboxGroupContext } from "./context.js";
 import { resolveState } from "../vocabulary.js";
 var _tmpl$ = /*#__PURE__*/ template("<div>");
 const __solidLayoutCheckboxGroup = (_stable, p)=>{
-    const [local, others] = splitProps(p, [
-        "children",
-        "class",
-        "dataTheme",
-        "style",
-        "value",
-        "defaultValue",
-        "onChange",
-        "name",
-        "state",
-        "disabled",
-        "issues",
-        "variant",
-        "role"
-    ]);
-    const [internalValue, setInternalValue] = createSignal(local.defaultValue ?? []);
-    const isControlled = ()=>void 0 !== local.value;
-    const selectedValues = ()=>isControlled() ? local.value ?? [] : internalValue();
-    const variant = ()=>local.variant ?? "primary";
-    const isDisabled = ()=>Boolean("disabled" === local.state) || Boolean(local.disabled);
-    const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues));
+    const others = omit(p, "children", "class", "dataTheme", "style", "value", "defaultValue", "onChange", "name", "state", "disabled", "issues", "variant", "role");
+    const [internalValue, setInternalValue] = createSignal(p.defaultValue ?? []);
+    const isControlled = ()=>void 0 !== p.value;
+    const selectedValues = ()=>isControlled() ? p.value ?? [] : internalValue();
+    const variant = ()=>p.variant ?? "primary";
+    const isDisabled = ()=>Boolean("disabled" === p.state) || Boolean(p.disabled);
+    const isInvalid = ()=>Boolean("invalid" === resolveState(p.state, p.issues));
     const handleToggle = (optionValue, checked)=>{
         const currentValues = selectedValues();
         const nextValues = checked ? currentValues.includes(optionValue) ? currentValues : [
@@ -36,11 +22,11 @@ const __solidLayoutCheckboxGroup = (_stable, p)=>{
             optionValue
         ] : currentValues.filter((value)=>value !== optionValue);
         if (!isControlled()) setInternalValue(nextValues);
-        local.onChange?.(nextValues);
+        p.onChange?.(nextValues);
     };
     const contextValue = {
         value: selectedValues,
-        name: ()=>local.name,
+        name: ()=>p.name,
         variant,
         isDisabled,
         isInvalid,
@@ -49,13 +35,13 @@ const __solidLayoutCheckboxGroup = (_stable, p)=>{
             handleToggle(optionValue, checked);
         }
     };
-    return createComponent(CheckboxGroupContext.Provider, {
+    return createComponent(CheckboxGroupContext, {
         value: contextValue,
         get children () {
             var _el$ = _tmpl$();
             spread(_el$, mergeProps(others, {
                 get role () {
-                    return local.role ?? "group";
+                    return p.role ?? "group";
                 },
                 get ["aria-disabled"] () {
                     return isDisabled() ? "true" : void 0;
@@ -74,18 +60,18 @@ const __solidLayoutCheckboxGroup = (_stable, p)=>{
                     return isInvalid() ? "true" : "false";
                 },
                 get ["class"] () {
-                    return twMerge(CLASSES.base, CLASSES.variant[variant()], isDisabled() && CLASSES.flag.disabled, isInvalid() && CLASSES.flag.invalid, local.class);
+                    return twMerge(CLASSES.base, CLASSES.variant[variant()], isDisabled() && CLASSES.flag.disabled, isInvalid() && CLASSES.flag.invalid, p.class);
                 },
                 get ["data-theme"] () {
-                    return local.dataTheme;
+                    return p.dataTheme;
                 },
                 get style () {
-                    return local.style;
+                    return p.style;
                 }
-            }), false, true);
+            }), true);
             insert(_el$, (()=>{
-                var _c$ = memo(()=>"function" == typeof local.children);
-                return ()=>_c$() ? local.children(selectedValues()) : local.children;
+                var _c$ = memo(()=>"function" == typeof p.children);
+                return ()=>_c$() ? p.children(selectedValues()) : p.children;
             })());
             return _el$;
         }

package/dist/components/checkbox-group/CheckboxGroup.recipe.d.ts

@@ -9,7 +9,7 @@ export declare const CLASSES: {
         readonly invalid: "checkbox-group--invalid";
     };
 };
-export declare const componentRecipe: import("solid-layouts").Recipe<{
+export declare const componentRecipe: import("solid-layouts/solid-2").Recipe<{
     readonly component: "checkbox-group";
     readonly slots: {
         readonly "checkbox-group": {};

package/dist/components/checkbox-group/context.d.ts

@@ -8,4 +8,4 @@ export type CheckboxGroupContextValue = {
     isInvalid: Accessor<boolean>;
     toggleValue: (optionValue: string, checked: boolean, event: Event) => void;
 };
-export declare const CheckboxGroupContext: import("solid-js").Context<CheckboxGroupContextValue | undefined>;
+export declare const CheckboxGroupContext: import("solid-js").Context<CheckboxGroupContextValue>;

package/dist/components/chip/Chip.generated.d.ts

@@ -1,5 +1,5 @@
 import type { Component as __LayoutComponent } from "solid-js";
-import { type JSX } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import "./Chip.css";
 import type { Flavor, State } from "../vocabulary";
 type ChipVariant = "solid" | "flat" | "bordered";