@pathscale/ui 2.5.0 → 2.6.0

package/dist/components/input/Input.generated.js

@@ -1,28 +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 "./Input.css";
-import { Show, createContext, createUniqueId, splitProps, useContext } from "solid-js";
-import { twMerge } from "tailwind-merge";
+import { Show, createContext, createUniqueId, omit, useContext } from "solid-js";
+import { twMerge } from "../../lib/twMerge.js";
 import { CLASSES, componentRecipe } from "./Input.recipe.js";
 import { resolveState } from "../vocabulary.js";
-var _tmpl$ = /*#__PURE__*/ template("<div>"), _tmpl$2 = /*#__PURE__*/ template("<span>"), _tmpl$3 = /*#__PURE__*/ template("<div><input>"), _tmpl$4 = /*#__PURE__*/ template("<label>"), _tmpl$5 = /*#__PURE__*/ template("<p>");
+var _tmpl$ = /*#__PURE__*/ template("<div>"), _tmpl$2 = /*#__PURE__*/ template("<span>"), _tmpl$3 = /*#__PURE__*/ template("<div><input><!>"), _tmpl$4 = /*#__PURE__*/ template("<label>"), _tmpl$5 = /*#__PURE__*/ template("<p>");
 const InputContext = createContext();
 const __solidLayoutInputRoot = (_stable, p)=>{
-    const [local, others] = splitProps(p, [
-        "children",
-        "class",
-        "size",
-        "fullWidth",
-        "state",
-        "issues",
-        "dataTheme"
-    ]);
+    const others = omit(p, "children", "class", "size", "fullWidth", "state", "issues", "dataTheme");
     const baseId = createUniqueId();
-    const size = ()=>local.size ?? "md";
-    const isDisabled = ()=>Boolean("disabled" === local.state);
-    const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues));
-    const fullWidth = ()=>Boolean(local.fullWidth);
-    return createComponent(InputContext.Provider, {
+    const size = ()=>p.size ?? "md";
+    const isDisabled = ()=>Boolean("disabled" === p.state);
+    const isInvalid = ()=>Boolean("invalid" === resolveState(p.state, p.issues));
+    const fullWidth = ()=>Boolean(p.fullWidth);
+    return createComponent(InputContext, {
         value: {
             fieldId: ()=>`${baseId}-field`,
             helperId: ()=>`${baseId}-helper`,
@@ -34,14 +26,14 @@ const __solidLayoutInputRoot = (_stable, p)=>{
         get children () {
             var _el$ = _tmpl$();
             spread(_el$, mergeProps(others, ()=>({
-                    class: twMerge(CLASSES.base, fullWidth() && CLASSES.flag.fullWidthRoot, local.class)
+                    class: twMerge(CLASSES.base, fullWidth() && CLASSES.flag.fullWidthRoot, p.class)
                 }), {
                 get ["data-theme"] () {
-                    return local.dataTheme;
+                    return p.dataTheme;
                 },
                 "data-slot": "input-root"
-            }), false, true);
-            insert(_el$, ()=>local.children);
+            }), true);
+            insert(_el$, ()=>p.children);
             return _el$;
         }
     });
@@ -53,92 +45,78 @@ const InputRoot = defineComponent({
 });
 const __solidLayoutInputField = (_stable, p)=>{
     const ctx = useContext(InputContext);
-    const [local, others] = splitProps(p, [
-        "class",
-        "size",
-        "state",
-        "disabled",
-        "issues",
-        "fullWidth",
-        "startIcon",
-        "endIcon",
-        "dataTheme",
-        "id",
-        "aria-invalid"
-    ]);
-    const size = ()=>local.size ?? ctx?.size() ?? "md";
-    const isDisabled = ()=>Boolean("disabled" === local.state) || Boolean(local.disabled) || Boolean(ctx?.isDisabled());
-    const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues)) || Boolean(local["aria-invalid"]) || Boolean(ctx?.isInvalid());
-    const fullWidth = ()=>Boolean(local.fullWidth) || Boolean(ctx?.fullWidth());
-    const inputId = ()=>local.id ?? ctx?.fieldId();
-    const ariaInvalid = ()=>local["aria-invalid"] ?? (isInvalid() ? true : void 0);
-    const controlClasses = ()=>twMerge(CLASSES.slot.control, CLASSES.size[size()], fullWidth() && CLASSES.flag.fullWidthControl, isDisabled() && CLASSES.flag.disabled, isInvalid() && CLASSES.flag.invalid, local.class);
-    return (()=>{
-        var _el$2 = _tmpl$3(), _el$4 = _el$2.firstChild;
-        spread(_el$2, mergeProps(()=>({
-                class: controlClasses()
-            }), {
-            get ["data-theme"] () {
-                return local.dataTheme;
-            },
-            "data-slot": "input-control",
-            get ["data-disabled"] () {
-                return isDisabled() ? "true" : "false";
-            },
-            get ["data-invalid"] () {
-                return isInvalid() ? "true" : "false";
-            }
-        }), false, true);
-        insert(_el$2, createComponent(Show, {
-            get when () {
-                return local.startIcon;
-            },
-            get children () {
-                var _el$3 = _tmpl$2();
-                spread(_el$3, mergeProps(()=>({
-                        class: twMerge(CLASSES.slot.icon, CLASSES.slot.iconStart)
-                    }), {
-                    "data-slot": "input-start-icon"
-                }), false, true);
-                insert(_el$3, ()=>local.startIcon);
-                return _el$3;
-            }
-        }), _el$4);
-        spread(_el$4, mergeProps(others, {
-            get id () {
-                return inputId();
-            }
-        }, ()=>({
-                class: CLASSES.slot.field
-            }), {
-            get disabled () {
-                return isDisabled();
-            },
-            get ["aria-disabled"] () {
-                return isDisabled() ? "true" : "false";
-            },
-            get ["aria-invalid"] () {
-                return ariaInvalid();
-            },
-            "data-slot": "input-field"
-        }), false, false);
-        insert(_el$2, createComponent(Show, {
-            get when () {
-                return local.endIcon;
-            },
-            get children () {
-                var _el$5 = _tmpl$2();
-                spread(_el$5, mergeProps(()=>({
-                        class: twMerge(CLASSES.slot.icon, CLASSES.slot.iconEnd)
-                    }), {
-                    "data-slot": "input-end-icon"
-                }), false, true);
-                insert(_el$5, ()=>local.endIcon);
-                return _el$5;
-            }
-        }), null);
-        return _el$2;
-    })();
+    const others = omit(p, "class", "size", "state", "disabled", "issues", "fullWidth", "startIcon", "endIcon", "dataTheme", "id", "aria-invalid");
+    const size = ()=>p.size ?? ctx?.size() ?? "md";
+    const isDisabled = ()=>Boolean("disabled" === p.state) || Boolean(p.disabled) || Boolean(ctx?.isDisabled());
+    const isInvalid = ()=>Boolean("invalid" === resolveState(p.state, p.issues)) || Boolean(p["aria-invalid"]) || Boolean(ctx?.isInvalid());
+    const fullWidth = ()=>Boolean(p.fullWidth) || Boolean(ctx?.fullWidth());
+    const inputId = ()=>p.id ?? ctx?.fieldId();
+    const ariaInvalid = ()=>p["aria-invalid"] ?? (isInvalid() ? true : void 0);
+    const controlClasses = ()=>twMerge(CLASSES.slot.control, CLASSES.size[size()], fullWidth() && CLASSES.flag.fullWidthControl, isDisabled() && CLASSES.flag.disabled, isInvalid() && CLASSES.flag.invalid, p.class);
+    var _el$2 = _tmpl$3(), _el$4 = _el$2.firstChild, _el$6 = _el$4.nextSibling;
+    spread(_el$2, mergeProps(()=>({
+            class: controlClasses()
+        }), {
+        get ["data-theme"] () {
+            return p.dataTheme;
+        },
+        "data-slot": "input-control",
+        get ["data-disabled"] () {
+            return isDisabled() ? "true" : "false";
+        },
+        get ["data-invalid"] () {
+            return isInvalid() ? "true" : "false";
+        }
+    }), true);
+    insert(_el$2, createComponent(Show, {
+        get when () {
+            return p.startIcon;
+        },
+        get children () {
+            var _el$3 = _tmpl$2();
+            spread(_el$3, mergeProps(()=>({
+                    class: twMerge(CLASSES.slot.icon, CLASSES.slot.iconStart)
+                }), {
+                "data-slot": "input-start-icon"
+            }), true);
+            insert(_el$3, ()=>p.startIcon);
+            return _el$3;
+        }
+    }), _el$4);
+    spread(_el$4, mergeProps(others, {
+        get id () {
+            return inputId();
+        }
+    }, ()=>({
+            class: CLASSES.slot.field
+        }), {
+        get disabled () {
+            return isDisabled();
+        },
+        get ["aria-disabled"] () {
+            return isDisabled() ? "true" : "false";
+        },
+        get ["aria-invalid"] () {
+            return ariaInvalid() ? "true" : "false";
+        },
+        "data-slot": "input-field"
+    }), false);
+    insert(_el$2, createComponent(Show, {
+        get when () {
+            return p.endIcon;
+        },
+        get children () {
+            var _el$5 = _tmpl$2();
+            spread(_el$5, mergeProps(()=>({
+                    class: twMerge(CLASSES.slot.icon, CLASSES.slot.iconEnd)
+                }), {
+                "data-slot": "input-end-icon"
+            }), true);
+            insert(_el$5, ()=>p.endIcon);
+            return _el$5;
+        }
+    }), _el$6);
+    return _el$2;
 };
 const InputField = defineComponent({
     recipe: componentRecipe,
@@ -147,25 +125,19 @@ const InputField = defineComponent({
 });
 const __solidLayoutInputLabel = (_stable, p)=>{
     const ctx = useContext(InputContext);
-    const [local, others] = splitProps(p, [
-        "class",
-        "for",
-        "children"
-    ]);
-    return (()=>{
-        var _el$6 = _tmpl$4();
-        spread(_el$6, mergeProps(others, {
-            get ["for"] () {
-                return local.for ?? ctx?.fieldId();
-            }
-        }, ()=>({
-                class: twMerge(CLASSES.slot.label, local.class)
-            }), {
-            "data-slot": "input-label"
-        }), false, true);
-        insert(_el$6, ()=>local.children);
-        return _el$6;
-    })();
+    const others = omit(p, "class", "for", "children");
+    var _el$7 = _tmpl$4();
+    spread(_el$7, mergeProps(others, {
+        get ["for"] () {
+            return p.for ?? ctx?.fieldId();
+        }
+    }, ()=>({
+            class: twMerge(CLASSES.slot.label, p.class)
+        }), {
+        "data-slot": "input-label"
+    }), true);
+    insert(_el$7, ()=>p.children);
+    return _el$7;
 };
 const InputLabel = defineComponent({
     recipe: componentRecipe,
@@ -174,27 +146,20 @@ const InputLabel = defineComponent({
 });
 const __solidLayoutInputHelper = (_stable, p)=>{
     const ctx = useContext(InputContext);
-    const [local, others] = splitProps(p, [
-        "class",
-        "invalid",
-        "id",
-        "children"
-    ]);
-    const invalid = ()=>Boolean(local.invalid) || Boolean(ctx?.isInvalid());
-    return (()=>{
-        var _el$7 = _tmpl$5();
-        spread(_el$7, mergeProps(others, {
-            get id () {
-                return local.id ?? ctx?.helperId();
-            }
-        }, ()=>({
-                class: twMerge(CLASSES.slot.helper, invalid() && CLASSES.flag.helperInvalid, local.class)
-            }), {
-            "data-slot": "input-helper"
-        }), false, true);
-        insert(_el$7, ()=>local.children);
-        return _el$7;
-    })();
+    const others = omit(p, "class", "invalid", "id", "children");
+    const invalid = ()=>Boolean(p.invalid) || Boolean(ctx?.isInvalid());
+    var _el$8 = _tmpl$5();
+    spread(_el$8, mergeProps(others, {
+        get id () {
+            return p.id ?? ctx?.helperId();
+        }
+    }, ()=>({
+            class: twMerge(CLASSES.slot.helper, invalid() && CLASSES.flag.helperInvalid, p.class)
+        }), {
+        "data-slot": "input-helper"
+    }), true);
+    insert(_el$8, ()=>p.children);
+    return _el$8;
 };
 const InputHelper = defineComponent({
     recipe: componentRecipe,
@@ -203,52 +168,39 @@ const InputHelper = defineComponent({
 });
 const __solidLayoutInputBase = (_stable, p)=>{
     const generatedId = createUniqueId();
-    const [local, fieldProps] = splitProps(p, [
-        "id",
-        "size",
-        "fullWidth",
-        "state",
-        "disabled",
-        "issues",
-        "label",
-        "helperText",
-        "errorMessage",
-        "class",
-        "aria-invalid",
-        "dataTheme"
-    ]);
-    const inputId = ()=>local.id ?? `${generatedId}-input`;
-    const isDisabled = ()=>Boolean("disabled" === local.state) || Boolean(local.disabled);
-    const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues)) || Boolean(local["aria-invalid"]) || null != local.errorMessage;
-    const helperContent = ()=>local.errorMessage ?? local.helperText;
+    const fieldProps = omit(p, "id", "size", "fullWidth", "state", "disabled", "issues", "label", "helperText", "errorMessage", "class", "aria-invalid", "dataTheme");
+    const inputId = ()=>p.id ?? `${generatedId}-input`;
+    const isDisabled = ()=>Boolean("disabled" === p.state) || Boolean(p.disabled);
+    const isInvalid = ()=>Boolean("invalid" === resolveState(p.state, p.issues)) || Boolean(p["aria-invalid"]) || null != p.errorMessage;
+    const helperContent = ()=>p.errorMessage ?? p.helperText;
     const hasHelper = ()=>null != helperContent();
     const helperId = ()=>`${inputId()}-helper`;
     return createComponent(InputRoot, {
         get size () {
-            return local.size;
+            return p.size;
         },
         get fullWidth () {
-            return local.fullWidth ?? true;
+            return p.fullWidth ?? true;
         },
         get state () {
             return isDisabled() ? "disabled" : void 0;
         },
         get issues () {
-            return local.issues;
+            return p.issues;
         },
         get dataTheme () {
-            return local.dataTheme;
+            return p.dataTheme;
         },
         get children () {
             return [
                 createComponent(Show, {
                     get when () {
-                        return local.label;
+                        return p.label;
                     },
                     get children () {
                         return createComponent(InputLabel, {
                             get children () {
-                                return local.label;
+                                return p.label;
                             }
                         });
                     }
@@ -258,22 +210,22 @@ const __solidLayoutInputBase = (_stable, p)=>{
                         return inputId();
                     },
                     get size () {
-                        return local.size;
+                        return p.size;
                     },
                     get state () {
                         return isDisabled() ? "disabled" : void 0;
                     },
                     get issues () {
-                        return local.issues;
+                        return p.issues;
                     },
                     get ["aria-describedby"] () {
                         return memo(()=>!!hasHelper())() ? helperId() : void 0;
                     }
                 }, ()=>({
-                        class: local.class
+                        class: p.class
                     }), {
                     get dataTheme () {
-                        return local.dataTheme;
+                        return p.dataTheme;
                     }
                 })),
                 createComponent(Show, {

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

@@ -22,7 +22,7 @@ export declare const CLASSES: {
         readonly helperInvalid: "input-helper--invalid";
     };
 };
-export declare const componentRecipe: import("solid-layouts").Recipe<{
+export declare const componentRecipe: import("solid-layouts/solid-2").Recipe<{
     readonly component: "input";
     readonly slots: {
         readonly "input-control": {};

package/dist/components/input-otp/InputOTP.generated.d.ts

@@ -1,6 +1,6 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./InputOTP.css";
-import { type JSX } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import type { UIBaseProps, State, Issue } from "../vocabulary";
 export type InputOTPVariant = "primary" | "secondary";
 export declare const REGEXP_ONLY_DIGITS = "^\\d+$";
@@ -21,7 +21,7 @@ export type InputOTPRootProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "childr
     disabled?: boolean;
     issues?: Issue[];
     inputClassName?: string;
-    inputMode?: JSX.InputHTMLAttributes<HTMLInputElement>["inputMode"];
+    inputmode?: JSX.InputHTMLAttributes<HTMLInputElement>["inputmode"];
 };
 export type InputOTPGroupProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & UIBaseProps & {
     children?: JSX.Element;