@bysages/solid 0.4.1 → 0.4.3

package/dist/components/tree-view/index.mjs

@@ -1,10 +1,10 @@
 import { t as defineFamily } from "../../family-Cmd8HEyK.mjs";
 import { r as iconNode } from "../../icon-DTqmJCd5.mjs";
 import { t as useElementId } from "../../id-2ygNzPHF.mjs";
-import { createComponent, mergeProps } from "@solidjs/web";
+import { createComponent, memo, mergeProps } from "@solidjs/web";
 import { injectComponentStyle } from "@bysages/core/styling";
-import { splitProps } from "solid-js";
-import { TreeView as TreeView$1 } from "@ark-ui/solid/tree-view";
+import { For, Show, createMemo, splitProps } from "solid-js";
+import { TreeView as TreeView$1, createTreeCollection } from "@ark-ui/solid/tree-view";
 //#region src/components/tree-view/index.tsx
 const ArkRoot = TreeView$1.Root;
 function TreeViewRoot(props) {
@@ -29,7 +29,96 @@ function TreeViewBranchIndicator(props) {
 		return props.children ?? iconNode("chevron-right");
 	} }));
 }
-const TreeView = defineFamily(TreeViewRoot, {
+/** The complete tree behind selected values: nested options render their own
+* branches and leaves, while async and checkbox trees remain anatomy work. */
+function TreeViewFacade(props) {
+	injectComponentStyle("tree-view");
+	const collection = createMemo(() => createTreeCollection({
+		nodeToValue: (node) => node.value,
+		nodeToString: (node) => node.label,
+		isNodeDisabled: (node) => !!node.disabled,
+		rootNode: {
+			value: "root",
+			label: "",
+			children: props.options
+		}
+	}));
+	const renderNode = (node, indexPath) => createComponent(TreeView$1.NodeProvider, {
+		node,
+		indexPath,
+		get children() {
+			return memo(() => {
+				return !!node.children?.length;
+			})() ? createComponent(TreeView$1.Branch, { get children() {
+				return [createComponent(TreeView$1.BranchControl, { get children() {
+					return [createComponent(TreeView$1.BranchIndicator, { get children() {
+						return iconNode("chevron-right");
+					} }), createComponent(TreeView$1.BranchText, { get children() {
+						return node.label;
+					} })];
+				} }), createComponent(TreeView$1.BranchContent, { get children() {
+					return createComponent(For, {
+						get each() {
+							return node.children;
+						},
+						children: (child, index) => renderNode(child, [...indexPath, index()])
+					});
+				} })];
+			} }) : createComponent(TreeView$1.Item, { get children() {
+				return createComponent(TreeView$1.ItemText, { get children() {
+					return node.label;
+				} });
+			} });
+		}
+	});
+	const branchValues = () => props.options.filter((option) => option.children?.length).map((option) => option.value);
+	return createComponent(TreeViewRoot, mergeProps({
+		get size() {
+			return props.size ?? "md";
+		},
+		get collection() {
+			return collection();
+		},
+		get defaultExpandedValue() {
+			return props.defaultExpandedValue ?? branchValues();
+		},
+		get defaultSelectedValue() {
+			return props.defaultValue;
+		},
+		get selectionMode() {
+			return props.multiple ? "multiple" : "single";
+		}
+	}, () => {
+		return props.expandedValue === void 0 ? {} : { expandedValue: props.expandedValue };
+	}, () => {
+		return props.value === void 0 ? {} : { selectedValue: props.value };
+	}, {
+		onSelectionChange: (event) => props.onValueChange?.(event.selectedValue),
+		get children() {
+			return [createComponent(Show, {
+				get when() {
+					return props.label;
+				},
+				get children() {
+					return createComponent(TreeView$1.Label, {
+						"data-visually-hidden": "",
+						get children() {
+							return props.label;
+						}
+					});
+				}
+			}), createComponent(TreeView$1.Tree, { get children() {
+				return createComponent(For, {
+					get each() {
+						return props.options;
+					},
+					children: (option, index) => renderNode(option, [index()])
+				});
+			} })];
+		}
+	}));
+}
+const TreeView = defineFamily(TreeViewFacade, {
 	...TreeView$1,
 	Root: TreeViewRoot,
 	NodeCheckbox: TreeViewNodeCheckbox,

package/dist/components/user/index.mjs

@@ -43,9 +43,15 @@ const User = withSelfRoot(function User(props) {
 			return own.shape ?? "circle";
 		},
 		get children() {
-			return createComponent(Avatar.Fallback, { get children() {
+			return [memo(() => {
+				return memo(() => {
+					return !!own.src;
+				})() ? createComponent(Avatar.Image, { get src() {
+					return own.src;
+				} }) : null;
+			}), createComponent(Avatar.Fallback, { get children() {
 				return initials();
-			} });
+			} })];
 		}
 	}), _el$2);
 	insert(_el$3, () => {

package/dist/generative/index.d.mts

@@ -0,0 +1,47 @@
+import { z } from "zod";
+//#region src/generative/index.d.ts
+export declare const catalog: import("@json-render/core").Catalog<{
+  spec: import("@json-render/core").SchemaType<"object", {
+    root: import("@json-render/core").SchemaType<"string", unknown>;
+    elements: import("@json-render/core").SchemaType<"record", import("@json-render/core").SchemaType<"object", {
+      type: import("@json-render/core").SchemaType<"ref", string>;
+      props: import("@json-render/core").SchemaType<"propsOf", string>;
+      children: import("@json-render/core").SchemaType<"array", import("@json-render/core").SchemaType<"string", unknown>>;
+      visible: {
+        optional: true;
+        kind: "any";
+        inner?: unknown;
+      };
+      repeat: {
+        optional: true;
+        kind: "any";
+        inner?: unknown;
+      };
+    }>>;
+  }>;
+  catalog: import("@json-render/core").SchemaType<"object", {
+    components: import("@json-render/core").SchemaType<"map", {
+      props: import("@json-render/core").SchemaType<"zod", unknown>;
+      slots: import("@json-render/core").SchemaType<"array", import("@json-render/core").SchemaType<"string", unknown>>;
+      description: import("@json-render/core").SchemaType<"string", unknown>;
+      example: import("@json-render/core").SchemaType<"any", unknown>;
+    }>;
+    actions: import("@json-render/core").SchemaType<"map", {
+      params: import("@json-render/core").SchemaType<"zod", unknown>;
+      description: import("@json-render/core").SchemaType<"string", unknown>;
+    }>;
+  }>;
+}, {
+  components: Record<string, {
+    props: z.ZodObject;
+    description: string;
+  }>;
+  actions: {};
+}>;
+declare const registry: import("@json-render/solid").ComponentRegistry;
+/** Which family each face came home from. A family may speak under
+ * several names - Layout plus its parts, Bento plus its cell - and the
+ * palette groups by provenance, never by guessing from the name. */
+export declare const faceFamilies: Record<string, string>;
+//#endregion
+export { registry };