@pathscale/ui 2.1.1 → 2.2.0

package/dist/components/{empty-state/EmptyState.generated.js → empty/Empty.generated.js}

@@ -1,15 +1,14 @@
 import { insert, mergeProps, spread, template } from "solid-js/web";
 import { defineComponent } from "solid-layouts/application-boundary";
-import "./EmptyState.css";
+import "./Empty.css";
 import { splitProps } from "solid-js";
 import { twMerge } from "tailwind-merge";
-import { CLASSES, componentRecipe } from "./EmptyState.recipe.js";
+import { CLASSES, componentRecipe } from "./Empty.recipe.js";
 var _tmpl$ = /*#__PURE__*/ template("<div>"), _tmpl$2 = /*#__PURE__*/ template("<h3>"), _tmpl$3 = /*#__PURE__*/ template("<p>");
-const __solidLayoutEmptyStateRoot = (_stable, p)=>{
+const __solidLayoutEmptyRoot = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
@@ -18,9 +17,9 @@ const __solidLayoutEmptyStateRoot = (_stable, p)=>{
         spread(_el$, mergeProps(others, {
             role: "status"
         }, ()=>({
-                class: twMerge(CLASSES.base, local.class, local.className)
+                class: twMerge(CLASSES.base, local.class)
             }), {
-            "data-slot": "empty-state",
+            "data-slot": "empty",
             get ["data-theme"] () {
                 return local.dataTheme;
             },
@@ -32,25 +31,24 @@ const __solidLayoutEmptyStateRoot = (_stable, p)=>{
         return _el$;
     })();
 };
-const EmptyStateRoot = defineComponent({
+const EmptyRoot = defineComponent({
     recipe: componentRecipe,
-    layout: __solidLayoutEmptyStateRoot,
+    layout: __solidLayoutEmptyRoot,
     embedded: true
 });
-const __solidLayoutEmptyStateIcon = (_stable, p)=>{
+const __solidLayoutEmptyIcon = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$2 = _tmpl$();
         spread(_el$2, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.slot.icon, local.class, local.className)
+                class: twMerge(CLASSES.slot.icon, local.class)
             }), {
-            "data-slot": "empty-state-icon",
+            "data-slot": "empty-icon",
             get ["data-theme"] () {
                 return local.dataTheme;
             },
@@ -63,25 +61,24 @@ const __solidLayoutEmptyStateIcon = (_stable, p)=>{
         return _el$2;
     })();
 };
-const EmptyStateIcon = defineComponent({
+const EmptyIcon = defineComponent({
     recipe: componentRecipe,
-    layout: __solidLayoutEmptyStateIcon,
+    layout: __solidLayoutEmptyIcon,
     embedded: true
 });
-const __solidLayoutEmptyStateTitle = (_stable, p)=>{
+const __solidLayoutEmptyTitle = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$3 = _tmpl$2();
         spread(_el$3, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.slot.title, local.class, local.className)
+                class: twMerge(CLASSES.slot.title, local.class)
             }), {
-            "data-slot": "empty-state-title",
+            "data-slot": "empty-title",
             get ["data-theme"] () {
                 return local.dataTheme;
             },
@@ -93,25 +90,24 @@ const __solidLayoutEmptyStateTitle = (_stable, p)=>{
         return _el$3;
     })();
 };
-const EmptyStateTitle = defineComponent({
+const EmptyTitle = defineComponent({
     recipe: componentRecipe,
-    layout: __solidLayoutEmptyStateTitle,
+    layout: __solidLayoutEmptyTitle,
     embedded: true
 });
-const __solidLayoutEmptyStateDescription = (_stable, p)=>{
+const __solidLayoutEmptyDescription = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$4 = _tmpl$3();
         spread(_el$4, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.slot.description, local.class, local.className)
+                class: twMerge(CLASSES.slot.description, local.class)
             }), {
-            "data-slot": "empty-state-description",
+            "data-slot": "empty-description",
             get ["data-theme"] () {
                 return local.dataTheme;
             },
@@ -123,25 +119,24 @@ const __solidLayoutEmptyStateDescription = (_stable, p)=>{
         return _el$4;
     })();
 };
-const EmptyStateDescription = defineComponent({
+const EmptyDescription = defineComponent({
     recipe: componentRecipe,
-    layout: __solidLayoutEmptyStateDescription,
+    layout: __solidLayoutEmptyDescription,
     embedded: true
 });
-const __solidLayoutEmptyStateActions = (_stable, p)=>{
+const __solidLayoutEmptyActions = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$5 = _tmpl$();
         spread(_el$5, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.slot.actions, local.class, local.className)
+                class: twMerge(CLASSES.slot.actions, local.class)
             }), {
-            "data-slot": "empty-state-actions",
+            "data-slot": "empty-actions",
             get ["data-theme"] () {
                 return local.dataTheme;
             },
@@ -153,18 +148,18 @@ const __solidLayoutEmptyStateActions = (_stable, p)=>{
         return _el$5;
     })();
 };
-const EmptyStateActions = defineComponent({
+const EmptyActions = defineComponent({
     recipe: componentRecipe,
-    layout: __solidLayoutEmptyStateActions,
+    layout: __solidLayoutEmptyActions,
     embedded: true
 });
-const EmptyState = Object.assign(EmptyStateRoot, {
-    Root: EmptyStateRoot,
-    Icon: EmptyStateIcon,
-    Title: EmptyStateTitle,
-    Description: EmptyStateDescription,
-    Actions: EmptyStateActions
+const Empty = Object.assign(EmptyRoot, {
+    Root: EmptyRoot,
+    Icon: EmptyIcon,
+    Title: EmptyTitle,
+    Description: EmptyDescription,
+    Actions: EmptyActions
 });
-const EmptyState_generated = EmptyState;
-export default EmptyState_generated;
-export { EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateRoot, EmptyStateTitle };
+const Empty_generated = Empty;
+export default Empty_generated;
+export { EmptyActions, EmptyDescription, EmptyIcon, EmptyRoot, EmptyTitle };

package/dist/components/empty/Empty.recipe.d.ts

@@ -0,0 +1,20 @@
+export declare const CLASSES: {
+    readonly base: "empty";
+    readonly slot: {
+        readonly icon: "empty__icon";
+        readonly title: "empty__title";
+        readonly description: "empty__description";
+        readonly actions: "empty__actions";
+    };
+};
+export declare const componentRecipe: import("solid-layouts").Recipe<{
+    readonly component: "empty";
+    readonly slots: {
+        readonly empty: {};
+        readonly "empty-actions": {};
+        readonly "empty-description": {};
+        readonly "empty-icon": {};
+        readonly "empty-title": {};
+        readonly root: {};
+    };
+}>;

package/dist/components/{empty-state/EmptyState.recipe.js → empty/Empty.recipe.js}

@@ -1,42 +1,42 @@
 import { recipe } from "../../lib/layouts/index.js";
 const CLASSES = {
-    base: "empty-state",
+    base: "empty",
     slot: {
-        icon: "empty-state__icon",
-        title: "empty-state__title",
-        description: "empty-state__description",
-        actions: "empty-state__actions"
+        icon: "empty__icon",
+        title: "empty__title",
+        description: "empty__description",
+        actions: "empty__actions"
     }
 };
 const componentRecipe = recipe({
-    component: "empty-state",
+    component: "empty",
     slots: {
-        "empty-state": {},
-        "empty-state-actions": {},
-        "empty-state-description": {},
-        "empty-state-icon": {},
-        "empty-state-title": {},
+        empty: {},
+        "empty-actions": {},
+        "empty-description": {},
+        "empty-icon": {},
+        "empty-title": {},
         root: {}
     },
     _layouts: {
         slots: {
-            "empty-state": {
+            empty: {
                 base: "",
                 axes: {}
             },
-            "empty-state-actions": {
+            "empty-actions": {
                 base: "",
                 axes: {}
             },
-            "empty-state-description": {
+            "empty-description": {
                 base: "",
                 axes: {}
             },
-            "empty-state-icon": {
+            "empty-icon": {
                 base: "",
                 axes: {}
             },
-            "empty-state-title": {
+            "empty-title": {
                 base: "",
                 axes: {}
             },
@@ -47,11 +47,11 @@ const componentRecipe = recipe({
         },
         stateKeys: [],
         slotIds: {
-            "empty-state": 0,
-            "empty-state-actions": 1,
-            "empty-state-description": 2,
-            "empty-state-icon": 3,
-            "empty-state-title": 4,
+            empty: 0,
+            "empty-actions": 1,
+            "empty-description": 2,
+            "empty-icon": 3,
+            "empty-title": 4,
             root: 5
         }
     }

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

@@ -0,0 +1,3 @@
+export { default as Empty, EmptyRoot, EmptyIcon, EmptyTitle, EmptyDescription, EmptyActions, type EmptyRootProps, type EmptyIconProps, type EmptyTitleProps, type EmptyDescriptionProps, type EmptyActionsProps, } from "./Empty.generated";
+/** @deprecated Use EmptyRootProps instead */
+export type { EmptyRootProps as EmptyProps } from "./Empty.generated";

package/dist/components/empty/index.js

@@ -0,0 +1 @@
+export { EmptyActions, EmptyDescription, EmptyIcon, EmptyRoot, EmptyTitle, default as Empty } from "./Empty.generated.js";

package/dist/components/fieldset/Fieldset.generated.d.ts

@@ -1,13 +1,13 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./Fieldset.css";
 import { type JSX } from "solid-js";
-import type { IComponentBaseProps } from "../types";
-export type FieldsetRootProps = JSX.FieldsetHTMLAttributes<HTMLFieldSetElement> & IComponentBaseProps;
-export type FieldsetLegendProps = JSX.HTMLAttributes<HTMLLegendElement> & IComponentBaseProps;
-export type FieldGroupProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & IComponentBaseProps & {
+import type { UIBaseProps } from "../vocabulary";
+export type FieldsetRootProps = JSX.FieldsetHTMLAttributes<HTMLFieldSetElement> & UIBaseProps;
+export type FieldsetLegendProps = JSX.HTMLAttributes<HTMLLegendElement> & UIBaseProps;
+export type FieldGroupProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & UIBaseProps & {
     children?: JSX.Element;
 };
-export type FieldsetActionsProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & IComponentBaseProps & {
+export type FieldsetActionsProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children"> & UIBaseProps & {
     children?: JSX.Element;
 };
 declare const FieldsetRoot: __LayoutComponent<FieldsetRootProps>;

package/dist/components/fieldset/Fieldset.generated.js

@@ -9,14 +9,13 @@ const __solidLayoutFieldsetRoot = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$ = _tmpl$();
         spread(_el$, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.Root.base, local.class, local.className)
+                class: twMerge(CLASSES.Root.base, local.class)
             }), {
             "data-slot": "fieldset",
             get ["data-theme"] () {
@@ -39,14 +38,13 @@ const __solidLayoutFieldsetLegend = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$2 = _tmpl$2();
         spread(_el$2, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.Legend.base, local.class, local.className)
+                class: twMerge(CLASSES.Legend.base, local.class)
             }), {
             "data-slot": "fieldset-legend",
             get ["data-theme"] () {
@@ -69,14 +67,13 @@ const __solidLayoutFieldGroup = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$3 = _tmpl$3();
         spread(_el$3, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.Group.base, local.class, local.className)
+                class: twMerge(CLASSES.Group.base, local.class)
             }), {
             "data-slot": "fieldset-field-group",
             get ["data-theme"] () {
@@ -99,14 +96,13 @@ const __solidLayoutFieldsetActions = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$4 = _tmpl$3();
         spread(_el$4, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.Actions.base, local.class, local.className)
+                class: twMerge(CLASSES.Actions.base, local.class)
             }), {
             "data-slot": "fieldset-actions",
             get ["data-theme"] () {

package/dist/components/flex/Flex.generated.d.ts

@@ -1,9 +1,9 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./Flex.css";
 import { type JSX } from "solid-js";
-import type { IComponentBaseProps } from "../types";
+import type { UIBaseProps } from "../vocabulary";
 import type { ResponsiveProp } from "../types";
-export type FlexProps = IComponentBaseProps & Omit<JSX.HTMLAttributes<HTMLElement>, "ref"> & {
+export type FlexProps = UIBaseProps & Omit<JSX.HTMLAttributes<HTMLElement>, "ref"> & {
     as?: keyof JSX.IntrinsicElements;
     direction?: ResponsiveProp<"row" | "col" | "row-reverse" | "col-reverse">;
     justify?: ResponsiveProp<"start" | "center" | "end" | "between" | "around" | "evenly">;

package/dist/components/flex/Flex.generated.js

@@ -10,7 +10,6 @@ const __solidLayoutFlex = (_stable, p)=>{
     const [local, rest] = splitProps(p, [
         "as",
         "class",
-        "className",
         "children",
         "direction",
         "justify",
@@ -31,7 +30,7 @@ const __solidLayoutFlex = (_stable, p)=>{
     ]);
     const tag = createMemo(()=>local.as || "div");
     const resolvedChildren = children(()=>local.children);
-    const classes = createMemo(()=>twMerge(clsx(CLASSES.base, mapResponsiveProp(local.direction, CLASSES.direction), mapResponsiveProp(local.justify, CLASSES.justify), mapResponsiveProp(local.align, CLASSES.align), mapResponsiveProp(local.wrap, CLASSES.wrap), mapResponsiveProp(local.gap, CLASSES.gap), mapResponsiveProp(local.gapX, CLASSES.gapX), mapResponsiveProp(local.gapY, CLASSES.gapY), mapResponsiveProp(local.paddingInline, CLASSES.paddingInline), mapResponsiveProp(local.paddingBlock, CLASSES.paddingBlock), mapResponsiveProp(local.width, CLASSES.width), mapResponsiveProp(local.height, CLASSES.height), mapResponsiveProp(local.minWidth, CLASSES.minWidth), mapResponsiveProp(local.minHeight, CLASSES.minHeight), mapResponsiveProp(local.grow, CLASSES.grow), mapResponsiveProp(local.shrink, CLASSES.shrink), mapResponsiveProp(local.basis, CLASSES.basis), local.class, local.className)));
+    const classes = createMemo(()=>twMerge(clsx(CLASSES.base, mapResponsiveProp(local.direction, CLASSES.direction), mapResponsiveProp(local.justify, CLASSES.justify), mapResponsiveProp(local.align, CLASSES.align), mapResponsiveProp(local.wrap, CLASSES.wrap), mapResponsiveProp(local.gap, CLASSES.gap), mapResponsiveProp(local.gapX, CLASSES.gapX), mapResponsiveProp(local.gapY, CLASSES.gapY), mapResponsiveProp(local.paddingInline, CLASSES.paddingInline), mapResponsiveProp(local.paddingBlock, CLASSES.paddingBlock), mapResponsiveProp(local.width, CLASSES.width), mapResponsiveProp(local.height, CLASSES.height), mapResponsiveProp(local.minWidth, CLASSES.minWidth), mapResponsiveProp(local.minHeight, CLASSES.minHeight), mapResponsiveProp(local.grow, CLASSES.grow), mapResponsiveProp(local.shrink, CLASSES.shrink), mapResponsiveProp(local.basis, CLASSES.basis), local.class)));
     return createComponent(Dynamic, mergeProps({
         get component () {
             return tag();

package/dist/components/footer/Footer.generated.d.ts

@@ -1,8 +1,8 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./footer.css";
 import { type JSX } from "solid-js";
-import type { IComponentBaseProps } from "../types";
-export type FooterProps = IComponentBaseProps & {
+import type { UIBaseProps } from "../vocabulary";
+export type FooterProps = UIBaseProps & {
     children?: JSX.Element;
     center?: boolean;
     horizontal?: boolean;

package/dist/components/footer/Footer.generated.js

@@ -10,13 +10,12 @@ const __solidLayoutFooter = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "center",
         "horizontal",
         "vertical"
     ]);
-    const classes = ()=>twMerge(CLASSES.base, local.center && CLASSES.flag.center, local.horizontal && CLASSES.flag.horizontal, local.vertical && CLASSES.flag.vertical, local.class, local.className);
+    const classes = ()=>twMerge(CLASSES.base, local.center && CLASSES.flag.center, local.horizontal && CLASSES.flag.horizontal, local.vertical && CLASSES.flag.vertical, local.class);
     return (()=>{
         var _el$ = _tmpl$();
         spread(_el$, mergeProps(others, {

package/dist/components/footer/FooterTitle.generated.d.ts

@@ -1,7 +1,7 @@
 import type { Component as __LayoutComponent } from "solid-js";
-import type { IComponentBaseProps } from "../types";
+import type { UIBaseProps } from "../vocabulary";
 import { type JSX } from "solid-js";
-export type FooterTitleProps = IComponentBaseProps & {
+export type FooterTitleProps = UIBaseProps & {
     children?: JSX.Element;
 };
 export declare const FooterTitle: __LayoutComponent<FooterTitleProps>;

package/dist/components/footer/FooterTitle.generated.js

@@ -8,10 +8,9 @@ const __solidLayoutFooterTitle = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme"
     ]);
-    const classes = ()=>twMerge(CLASSES.title, local.class, local.className);
+    const classes = ()=>twMerge(CLASSES.title, local.class);
     return (()=>{
         var _el$ = _tmpl$();
         spread(_el$, mergeProps(others, {

package/dist/components/form/FieldErrorMessage.generated.d.ts

@@ -3,7 +3,6 @@ import { type JSX } from "solid-js";
 export type FieldErrorMessageProps = JSX.HTMLAttributes<HTMLParagraphElement> & {
     /** Pre-normalized error string. Renders nothing when undefined or empty. */
     message?: string;
-    className?: string;
 };
 declare const FieldErrorMessage: __LayoutComponent<FieldErrorMessageProps>;
 export default FieldErrorMessage;

package/dist/components/form/FieldErrorMessage.generated.js

@@ -11,7 +11,7 @@ const __solidLayoutFieldErrorMessage = (_stable, p)=>createComponent(Show, {
         get children () {
             var _el$ = _tmpl$();
             spread(_el$, mergeProps(p, ()=>({
-                    class: twMerge("text-xs text-error mt-0.5", p.class, p.className)
+                    class: twMerge("text-xs text-error mt-0.5", p.class)
                 }), {
                 "data-slot": "field-error-message",
                 role: "alert",

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

@@ -1,11 +1,11 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./Form.css";
 import { type JSX } from "solid-js";
-import type { IComponentBaseProps } from "../types";
+import type { UIBaseProps } from "../vocabulary";
 import { type AnyFormApi } from "../../hooks/form/FormContext";
-export type FormRootProps = JSX.FormHTMLAttributes<HTMLFormElement> & IComponentBaseProps;
+export type FormRootProps = JSX.FormHTMLAttributes<HTMLFormElement> & UIBaseProps;
 declare const FormRoot: __LayoutComponent<FormRootProps>;
-export type FormWithContextProps = Omit<JSX.FormHTMLAttributes<HTMLFormElement>, "onSubmit"> & IComponentBaseProps & {
+export type FormWithContextProps = Omit<JSX.FormHTMLAttributes<HTMLFormElement>, "onSubmit"> & UIBaseProps & {
     /**
      * The form API returned by `createForm()`.
      * Providing this prop switches the component into context-providing mode:

package/dist/components/form/Form.generated.js

@@ -9,14 +9,13 @@ var _tmpl$ = /*#__PURE__*/ template("<form>");
 const __solidLayoutFormRoot = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "class",
-        "className",
         "dataTheme",
         "style"
     ]);
     return (()=>{
         var _el$ = _tmpl$();
         spread(_el$, mergeProps(others, ()=>({
-                class: twMerge(CLASSES.base, local.class, local.className)
+                class: twMerge(CLASSES.base, local.class)
             }), {
             "data-slot": "form",
             get ["data-theme"] () {
@@ -38,7 +37,6 @@ const __solidLayoutFormWithContext = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "form",
         "class",
-        "className",
         "dataTheme",
         "style",
         "onSubmit",
@@ -59,7 +57,7 @@ const __solidLayoutFormWithContext = (_stable, p)=>{
             spread(_el$2, mergeProps(others, {
                 onSubmit: handleSubmit
             }, ()=>({
-                    class: twMerge(CLASSES.base, local.class, local.className)
+                    class: twMerge(CLASSES.base, local.class)
                 }), {
                 "data-slot": "form",
                 get ["data-theme"] () {

package/dist/components/form/FormField.generated.d.ts

@@ -21,7 +21,6 @@ export type FormFieldProps = {
     inputProps?: Omit<InputFieldProps, "name" | "value" | "onInput" | "onBlur" | "aria-invalid" | "isInvalid">;
     /** Container class override. */
     class?: string;
-    className?: string;
     /**
      * Escape hatch: explicit form override for Portal / out-of-tree usage.
      * When provided, the component does NOT read from context.

package/dist/components/form/FormField.generated.js

@@ -1,4 +1,4 @@
-import { createComponent, insert, mergeProps, spread, template } from "solid-js/web";
+import { createComponent, insert, memo, mergeProps, spread, template } from "solid-js/web";
 import { defineComponent } from "solid-layouts/application-boundary";
 import { Show, splitProps } from "solid-js";
 import { twMerge } from "tailwind-merge";
@@ -15,7 +15,6 @@ const __solidLayoutFormField = (_stable, p)=>{
         "label",
         "inputProps",
         "class",
-        "className",
         "form"
     ]);
     const resolveForm = ()=>{
@@ -33,7 +32,7 @@ const __solidLayoutFormField = (_stable, p)=>{
             return (()=>{
                 var _el$ = _tmpl$();
                 spread(_el$, mergeProps(()=>({
-                        class: twMerge("flex flex-col gap-1", local.class, local.className)
+                        class: twMerge("flex flex-col gap-1", local.class)
                     }), {
                     "data-slot": "form-field"
                 }), false, true);
@@ -72,8 +71,13 @@ const __solidLayoutFormField = (_stable, p)=>{
                     get ["aria-invalid"] () {
                         return Boolean(errorMessage()) ? true : void 0;
                     },
-                    get isInvalid () {
-                        return Boolean(errorMessage());
+                    get issues () {
+                        return memo(()=>!!errorMessage())() ? [
+                            {
+                                code: "invalid",
+                                message: String(errorMessage())
+                            }
+                        ] : void 0;
                     }
                 })), null);
                 insert(_el$, createComponent(FieldErrorMessage, {

package/dist/components/form/FormSubmitButton.generated.d.ts

@@ -1,7 +1,7 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import type { ButtonProps } from "../button";
 import type { AnyFormApi } from "../../hooks/form/FormContext";
-export type FormSubmitButtonProps = Omit<ButtonProps, "type" | "isDisabled" | "isPending"> & {
+export type FormSubmitButtonProps = Omit<ButtonProps, "type" | "isDisabled" | "isLoading"> & {
     /**
      * Escape hatch: explicit form override for Portal / out-of-tree usage.
      * When provided, the component does NOT read from context.

package/dist/components/form/FormSubmitButton.generated.js

@@ -1,4 +1,4 @@
-import { createComponent, mergeProps } from "solid-js/web";
+import { createComponent, memo, mergeProps } from "solid-js/web";
 import { defineComponent } from "solid-layouts/application-boundary";
 import { splitProps } from "solid-js";
 import button_0 from "../button/index.js";
@@ -22,11 +22,8 @@ const __solidLayoutFormSubmitButton = (_stable, p)=>{
             }),
         children: (state)=>createComponent(button_0, mergeProps(others, {
                 type: "submit",
-                get isDisabled () {
-                    return !state().canSubmit;
-                },
-                get isPending () {
-                    return state().isSubmitting;
+                get state () {
+                    return memo(()=>!!state().isSubmitting)() ? "loading" : state().canSubmit ? "default" : "disabled";
                 },
                 get children () {
                     return local.children;

package/dist/components/glow-card/GlowCard.css

@@ -20,7 +20,7 @@
       var(--glass-background-color, white) var(--glass-background-opacity, 38%),
       transparent
     );
-    border: 1px solid
+    border: var(--border, 1px) solid
       color-mix(
         in oklab,
         var(--glass-border-color, white) var(--glass-border-opacity, 30%),

package/dist/components/glow-card/GlowCard.generated.d.ts

@@ -1,7 +1,7 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import { type JSX } from "solid-js";
-import type { IComponentBaseProps } from "../types";
+import type { UIBaseProps } from "../vocabulary";
 import "./GlowCard.css";
-export type GlowCardProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLDivElement>;
+export type GlowCardProps = UIBaseProps & JSX.HTMLAttributes<HTMLDivElement>;
 declare const GlowCard: __LayoutComponent<GlowCardProps>;
 export default GlowCard;

package/dist/components/glow-card/GlowCard.generated.js

@@ -10,7 +10,6 @@ const __solidLayoutGlowCard = (_stable, p)=>{
     const [local, others] = splitProps(p, [
         "children",
         "class",
-        "className",
         "dataTheme",
         "onMouseMove",
         "style"
@@ -31,7 +30,7 @@ const __solidLayoutGlowCard = (_stable, p)=>{
                 return local.dataTheme;
             },
             get ["class"] () {
-                return twMerge(clsx(CLASSES.base, CLASSES.isolate, local.class, local.className));
+                return twMerge(clsx(CLASSES.base, CLASSES.isolate, local.class));
             },
             get style () {
                 return local.style;