@pathscale/ui 2.11.9 → 2.11.11

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

@@ -69,7 +69,10 @@ const __solidLayoutFieldGroup = (_stable, p)=>{
 const FieldGroup = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFieldGroup,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 const __solidLayoutFieldsetActions = (_stable, p)=>{
     const others = omit(p, "children", "class", "dataTheme", "style");
@@ -91,7 +94,10 @@ const __solidLayoutFieldsetActions = (_stable, p)=>{
 const FieldsetActions = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFieldsetActions,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 const Fieldset = Object.assign(FieldsetRoot, {
     Root: FieldsetRoot,

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

@@ -26,7 +26,26 @@ const __solidLayoutFlex = (_stable, p)=>{
 const Flex = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFlex,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "as",
+        "direction",
+        "justify",
+        "align",
+        "wrap",
+        "gap",
+        "gapX",
+        "gapY",
+        "paddingInline",
+        "paddingBlock",
+        "width",
+        "height",
+        "minWidth",
+        "minHeight",
+        "grow",
+        "shrink",
+        "basis"
+    ]
 });
 const Flex_generated = Flex;
 export default Flex_generated;

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

@@ -23,7 +23,13 @@ const __solidLayoutFooter = (_stable, p)=>{
 const Footer = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFooter,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children",
+        "center",
+        "horizontal",
+        "vertical"
+    ]
 });
 const FooterNamespaces = Object.assign(Footer, {
     Title: FooterTitle

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

@@ -21,6 +21,9 @@ const __solidLayoutFooterTitle = (_stable, p)=>{
 const FooterTitle = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFooterTitle,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 export { FooterTitle };

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

@@ -24,7 +24,10 @@ const __solidLayoutFieldErrorMessage = (_stable, p)=>createComponent(Show, {
 const FieldErrorMessage = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFieldErrorMessage,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "message"
+    ]
 });
 const FieldErrorMessage_generated = FieldErrorMessage;
 export default FieldErrorMessage_generated;

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

@@ -64,7 +64,11 @@ const __solidLayoutFormWithContext = (_stable, p)=>{
 const FormWithContext = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFormWithContext,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "form",
+        "onSubmit"
+    ]
 });
 const __solidLayoutForm = (_stable, p)=>{
     if ("form" in p && null != p.form) return createComponent(FormWithContext, p);

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

@@ -78,7 +78,14 @@ const __solidLayoutFormField = (_stable, p)=>{
 const FormField = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFormField,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "name",
+        "label",
+        "inputProps",
+        "class",
+        "form"
+    ]
 });
 const FormField_generated = FormField;
 export default FormField_generated;

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

@@ -24,7 +24,10 @@ const __solidLayoutFormSubmitButton = (_stable, p)=>{
 const FormSubmitButton = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutFormSubmitButton,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "form"
+    ]
 });
 const FormSubmitButton_generated = FormSubmitButton;
 export default FormSubmitButton_generated;

package/dist/components/grid/Grid.generated.js

@@ -28,7 +28,16 @@ const __solidLayoutGrid = (_stable, p)=>{
 const Grid = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutGrid,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "as",
+        "cols",
+        "rows",
+        "flow",
+        "gap",
+        "autoCols",
+        "autoRows"
+    ]
 });
 const Grid_generated = Grid;
 export default Grid_generated;

package/dist/components/icon/Icon.generated.js

@@ -48,6 +48,12 @@ const __solidLayoutIconLayout = (_stable, p)=>(()=>{
 const IconLayout = defineComponent({
     recipe: icon,
     layout: __solidLayoutIconLayout,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "src",
+        "width",
+        "height",
+        "flavor"
+    ]
 });
 export { IconLayout };

package/dist/components/inline-edit/InlineEdit.generated.js

@@ -77,7 +77,17 @@ const __solidLayoutInlineEdit = (_stable, p)=>{
 const InlineEdit = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInlineEdit,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "value",
+        "onCommit",
+        "label",
+        "trigger",
+        "children",
+        "fullWidth",
+        "disabled",
+        "fieldClass"
+    ]
 });
 const InlineEdit_generated = InlineEdit;
 delegateEvents([

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

@@ -41,7 +41,15 @@ const __solidLayoutInputRoot = (_stable, p)=>{
 const InputRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children",
+        "size",
+        "fullWidth",
+        "state",
+        "issues",
+        "dataTheme"
+    ]
 });
 const __solidLayoutInputField = (_stable, p)=>{
     const ctx = useContext(InputContext);
@@ -121,7 +129,17 @@ const __solidLayoutInputField = (_stable, p)=>{
 const InputField = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputField,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "size",
+        "state",
+        "disabled",
+        "issues",
+        "fullWidth",
+        "startIcon",
+        "endIcon",
+        "dataTheme"
+    ]
 });
 const __solidLayoutInputLabel = (_stable, p)=>{
     const ctx = useContext(InputContext);
@@ -164,7 +182,10 @@ const __solidLayoutInputHelper = (_stable, p)=>{
 const InputHelper = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputHelper,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "invalid"
+    ]
 });
 const __solidLayoutInputBase = (_stable, p)=>{
     const generatedId = createUniqueId();
@@ -253,7 +274,13 @@ const __solidLayoutInputBase = (_stable, p)=>{
 const InputBase = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputBase,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "id",
+        "label",
+        "helperText",
+        "errorMessage"
+    ]
 });
 const Input = Object.assign(InputBase, {
     Root: InputRoot,

package/dist/components/input-otp/InputOTP.generated.js

@@ -238,7 +238,24 @@ const __solidLayoutInputOTPRoot = (_stable, p)=>{
 const InputOTPRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputOTPRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children",
+        "value",
+        "defaultValue",
+        "onChange",
+        "onComplete",
+        "maxLength",
+        "variant",
+        "pattern",
+        "name",
+        "autoFocus",
+        "state",
+        "disabled",
+        "issues",
+        "inputClassName",
+        "inputmode"
+    ]
 });
 const __solidLayoutInputOTPGroup = (_stable, p)=>{
     const others = omit(p, "children", "class", "dataTheme", "style");
@@ -260,7 +277,10 @@ const __solidLayoutInputOTPGroup = (_stable, p)=>{
 const InputOTPGroup = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputOTPGroup,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 const __solidLayoutInputOTPSlot = (_stable, p)=>{
     const context = useContext(InputOTPContext);
@@ -333,7 +353,10 @@ const __solidLayoutInputOTPSlot = (_stable, p)=>{
 const InputOTPSlot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputOTPSlot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "index"
+    ]
 });
 const __solidLayoutInputOTPSeparator = (_stable, p)=>{
     const others = omit(p, "children", "class", "dataTheme", "style");
@@ -355,7 +378,10 @@ const __solidLayoutInputOTPSeparator = (_stable, p)=>{
 const InputOTPSeparator = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutInputOTPSeparator,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 const InputOTP = Object.assign(InputOTPRoot, {
     Root: InputOTPRoot,

package/dist/components/join/Join.generated.js

@@ -30,7 +30,12 @@ const __solidLayoutJoin = (_stable, p)=>{
 const Join = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutJoin,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "responsive",
+        "vertical",
+        "horizontal"
+    ]
 });
 const Join_generated = Join;
 export default Join_generated;

package/dist/components/kbd/Kbd.generated.js

@@ -77,7 +77,11 @@ const __solidLayoutKbdRoot = (_stable, p)=>{
 const KbdRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutKbdRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children",
+        "variant"
+    ]
 });
 const __solidLayoutKbdAbbr = (_stable, p)=>{
     const others = omit(p, "class", "dataTheme", "style", "keyValue", "title");
@@ -105,7 +109,10 @@ const __solidLayoutKbdAbbr = (_stable, p)=>{
 const KbdAbbr = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutKbdAbbr,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "keyValue"
+    ]
 });
 const __solidLayoutKbdContent = (_stable, p)=>{
     const others = omit(p, "class", "dataTheme", "style", "children");
@@ -127,7 +134,10 @@ const __solidLayoutKbdContent = (_stable, p)=>{
 const KbdContent = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutKbdContent,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children"
+    ]
 });
 const Kbd = Object.assign(KbdRoot, {
     Root: KbdRoot,

package/dist/components/label/Label.generated.js

@@ -45,7 +45,14 @@ const __solidLayoutLabelRoot = (_stable, p)=>{
 const LabelRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutLabelRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "for",
+        "htmlFor",
+        "required",
+        "state",
+        "issues"
+    ]
 });
 const Label = Object.assign(LabelRoot, {
     Root: LabelRoot

package/dist/components/language-switcher/LanguageSwitcher.generated.d.ts

@@ -1,10 +1,10 @@
 import type { Component as __LayoutComponent } from "solid-js";
 import "./LanguageSwitcher.css";
-import type { DropdownAlign } from "../dropdown";
+import { type DropdownAlign } from "../dropdown";
 import type { UIBaseProps } from "../vocabulary";
 import type { I18nStore } from "./createI18n";
 export interface LanguageSwitcherProps extends UIBaseProps {
-    /** Stable identity for the native language control. */
+    /** Stable identity for the language control. */
     id?: string;
     /**
      * The i18n store to use for language state

package/dist/components/language-switcher/LanguageSwitcher.generated.js

@@ -1,72 +1,120 @@
-import { createComponent, effect, insert, mergeProps, spread, template } from "@solidjs/web";
+import { createComponent, insert, memo, mergeProps, spread, template } from "@solidjs/web";
 import { defineComponent } from "solid-layouts/solid-2/application-boundary";
 import "./LanguageSwitcher.css";
-import { For, omit } from "solid-js";
+import { For, Show, createSignal, omit } from "solid-js";
 import { twMerge } from "../../lib/twMerge.js";
+import dropdown from "../dropdown/index.js";
+import icon from "../icon/index.js";
 import { CLASSES, componentRecipe } from "./LanguageSwitcher.recipe.js";
-var _tmpl$ = /*#__PURE__*/ template("<select>"), _tmpl$2 = /*#__PURE__*/ template("<option>");
+var _tmpl$ = /*#__PURE__*/ template("<span>");
 const __solidLayoutLanguageSwitcher = (_stable, p)=>{
     const others = omit(p, "i18n", "class", "style", "aria-label", "currentLanguageLabel", "optionsLabel", "loadingLabel", "align", "onLanguageChange");
     const currentLanguageName = ()=>p.i18n.languageNames[p.i18n.locale];
+    const isSelected = (lang)=>p.i18n.locale === lang;
+    const [open, setOpen] = createSignal(false);
     const handleSelect = async (lang)=>{
         await p.i18n.setLocale(lang);
         p.onLanguageChange?.(lang);
     };
-    const classes = ()=>twMerge(CLASSES.base, CLASSES.trigger, p.class);
-    const move = (direction)=>{
-        const languages = p.i18n.languages;
-        const current = languages.findIndex((language)=>language.code === p.i18n.locale);
-        const next = (Math.max(0, current) + direction + languages.length) % languages.length;
-        const language = languages[next];
-        if (language) handleSelect(language.code);
-    };
-    var _el$ = _tmpl$();
-    spread(_el$, mergeProps(others, ()=>({
+    const classes = ()=>twMerge(CLASSES.base, p.class);
+    return createComponent(dropdown.Root, mergeProps(others, ()=>({
             class: classes()
         }), {
-        get style () {
-            return p.style;
-        },
-        get value () {
-            return p.i18n.locale;
+        get open () {
+            return open();
         },
+        onOpenChange: setOpen,
         get disabled () {
             return p.i18n.isLoading;
         },
-        get ["aria-busy"] () {
-            return p.i18n.isLoading ? "true" : void 0;
-        },
-        get ["aria-label"] () {
-            return `${p.currentLanguageLabel ?? "Current language"}: ${currentLanguageName()}`;
-        },
-        get title () {
-            return p.optionsLabel ?? p["aria-label"] ?? "Language selector";
+        get style () {
+            return p.style;
         },
-        onChange: (event)=>void handleSelect(event.currentTarget.value),
-        onKeyDown: (event)=>{
-            if ("ArrowDown" === event.key) {
-                event.preventDefault();
-                move(1);
-            } else if ("ArrowUp" === event.key) {
-                event.preventDefault();
-                move(-1);
-            }
+        get children () {
+            return [
+                createComponent(dropdown.Trigger, mergeProps(()=>({
+                        class: CLASSES.trigger
+                    }), {
+                    get ["aria-busy"] () {
+                        return p.i18n.isLoading ? "true" : void 0;
+                    },
+                    get ["aria-label"] () {
+                        return `${p.currentLanguageLabel ?? "Current language"}: ${currentLanguageName()}`;
+                    },
+                    get title () {
+                        return p.optionsLabel ?? p["aria-label"] ?? "Language selector";
+                    },
+                    get children () {
+                        return createComponent(Show, {
+                            get when () {
+                                return !p.i18n.isLoading;
+                            },
+                            get fallback () {
+                                return createComponent(icon, mergeProps({
+                                    src: "icon-[mdi--loading]"
+                                }, ()=>({
+                                        class: CLASSES.loadingIcon
+                                    }), {
+                                    width: 16,
+                                    height: 16,
+                                    get ["aria-label"] () {
+                                        return p.loadingLabel ?? "Loading language";
+                                    }
+                                }));
+                            },
+                            get children () {
+                                var _el$ = _tmpl$();
+                                spread(_el$, mergeProps({
+                                    "data-slot": "language-current"
+                                }, ()=>({
+                                        class: CLASSES.locale
+                                    }), {
+                                    "aria-hidden": "true"
+                                }), true);
+                                insert(_el$, ()=>p.i18n.locale.toUpperCase());
+                                return _el$;
+                            }
+                        });
+                    }
+                })),
+                createComponent(dropdown.Menu, mergeProps(()=>({
+                        class: CLASSES.menu
+                    }), {
+                    get align () {
+                        return p.align;
+                    },
+                    get ["aria-label"] () {
+                        return p.optionsLabel ?? "Language options";
+                    },
+                    get children () {
+                        return createComponent(For, {
+                            get each () {
+                                return p.i18n.languages;
+                            },
+                            children: (lang)=>createComponent(dropdown.Item, mergeProps({
+                                    get id () {
+                                        return memo(()=>!!p.id)() ? `${p.id}-option-${lang.code}` : void 0;
+                                    },
+                                    onClick: ()=>void handleSelect(lang.code),
+                                    get ["aria-label"] () {
+                                        return lang.name;
+                                    }
+                                }, ()=>({
+                                        class: twMerge(CLASSES.item, isSelected(lang.code) && CLASSES.itemSelected)
+                                    }), {
+                                    get ["aria-current"] () {
+                                        return isSelected(lang.code) ? "true" : void 0;
+                                    },
+                                    get children () {
+                                        return lang.name;
+                                    }
+                                }))
+                        });
+                    }
+                }))
+            ];
         }
-    }), true);
-    insert(_el$, createComponent(For, {
-        get each () {
-            return p.i18n.languages;
-        },
-        children: (lang)=>(()=>{
-                var _el$2 = _tmpl$2();
-                insert(_el$2, ()=>lang.name);
-                effect(()=>lang.code, (_v$)=>{
-                    _el$2.value = _v$;
-                });
-                return _el$2;
-            })()
     }));
-    return _el$;
 };
 const LanguageSwitcher = defineComponent({
     recipe: componentRecipe,

package/dist/components/language-switcher/LanguageSwitcher.recipe.d.ts

@@ -11,5 +11,6 @@ export declare const componentRecipe: import("solid-layouts/solid-2").Recipe<{
     readonly component: "language-switcher";
     readonly slots: {
         readonly root: {};
+        readonly "language-current": {};
     };
 }>;

package/dist/components/language-switcher/LanguageSwitcher.recipe.js

@@ -11,18 +11,24 @@ const CLASSES = {
 const componentRecipe = recipe({
     component: "language-switcher",
     slots: {
-        root: {}
+        root: {},
+        "language-current": {}
     },
     _layouts: {
         slots: {
             root: {
                 base: "",
                 axes: {}
+            },
+            "language-current": {
+                base: "",
+                axes: {}
             }
         },
         stateKeys: [],
         slotIds: {
-            root: 0
+            root: 1,
+            "language-current": 0
         }
     }
 });

package/dist/components/language-switcher/createI18n.js

@@ -25,9 +25,7 @@ function createI18n(options) {
         if (lang === localeSignal() && Object.keys(translations()).length > 0) return;
         setIsLoading(true);
         try {
-            const minDelay = new Promise((resolve)=>setTimeout(resolve, 100));
             let data;
-            await minDelay;
             data = lang === defaultLanguage && Object.keys(initialTranslations).length > 0 ? initialTranslations : loadTranslations ? await loadTranslations(lang) : initialTranslations;
             setTranslations(data);
             setLocaleSignal(lang);

package/dist/components/link/Link.generated.js

@@ -58,7 +58,13 @@ const __solidLayoutLinkRoot = (_stable, p)=>{
 const LinkRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutLinkRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "variant",
+        "underline",
+        "isExternal",
+        "state"
+    ]
 });
 const __solidLayoutLinkIcon = (_stable, p)=>{
     const others = omit(p, "class", "children", "dataTheme", "style");

package/dist/components/list-box/ListBox.generated.js

@@ -201,7 +201,22 @@ const __solidLayoutListBoxRoot = (_stable, p)=>{
 const ListBoxRoot = defineComponent({
     recipe: componentRecipe,
     layout: __solidLayoutListBoxRoot,
-    embedded: true
+    embedded: true,
+    behaviour: [
+        "children",
+        "items",
+        "renderEmpty",
+        "variant",
+        "selectionMode",
+        "selectedKeys",
+        "defaultSelectedKeys",
+        "disabledKeys",
+        "disallowEmptySelection",
+        "onSelectionChange",
+        "onAction",
+        "state",
+        "disabled"
+    ]
 });
 const ListBox_generated = ListBoxRoot;
 export default ListBox_generated;