@mrts/soltw 0.3.29 → 0.3.30

package/dist/index.d.ts

@@ -95,6 +95,7 @@ declare const Item: Component<TItemProps>;
 //#region src/Block.d.ts
 type TProps$2 = ParentProps & {
   vtags?: TagListArgument;
+  stags?: TagListArgument;
   styler?: ISVTStyler;
   class?: string;
   element?: string;
@@ -104,6 +105,7 @@ declare const Block: Component<TProps$2>;
 //#region src/items/ItemGroup.d.ts
 type TProps$1 = {
   items: IdLabelArg[];
+  vertical?: boolean;
   callback?: (item: IdLabel) => void;
   class?: string | {
     group?: string;
@@ -116,6 +118,7 @@ type TProps$1 = {
     group?: TagListArgument;
     item?: TagListArgument;
   };
+  styler?: ISVTStyler;
 };
 declare const ItemGroup: Component<TProps$1>;
 //#endregion

package/dist/index.js

@@ -3095,16 +3095,13 @@ const Item = (props) => {
 		if (props.disabled) r.push("item:disabled");
 		return r;
 	};
-	const currentStyler = () => {
-		if (props.styler) return props.styler;
-		else return Stylers.base;
-	};
+	const currentStyler = () => props.styler ?? Stylers.base;
 	const classProp = createMemo(() => {
 		if (props.class == void 0) return {};
 		else if (typeof props.class == "string") return { item: props.class };
 		else return props.class;
 	});
-	const itemClasses = () => {
+	const itemClasses = createMemo(() => {
 		const stags = currentSTags();
 		const styler = currentStyler();
 		const rawClasses = [];
@@ -3117,7 +3114,7 @@ const Item = (props) => {
 		if (props.disabled && customClasses.disabled) rawClasses.push(customClasses.disabled);
 		rawClasses.push("relative");
 		return twMerge(rawClasses);
-	};
+	});
 	const disablerClasses = createMemo(() => {
 		const rawClasses = [];
 		if (currentStyler()) rawClasses.push(...currentStyler().classes("item/disabler", props.vtags));
@@ -3164,9 +3161,10 @@ const Block = (props) => {
 		else return Stylers.base;
 	};
 	function blockClasses() {
-		const classes = currentStyler().classes("block", props.vtags) ?? [];
+		const stags = props.stags ?? "block";
+		const classes = currentStyler().classes(stags, props.vtags) ?? [];
 		if (props.class) classes.push(props.class);
-		return twMerge(classes);
+		return "_block " + twMerge(classes);
 	}
 	return (() => {
 		var _el$ = _tmpl$$1();
@@ -3209,7 +3207,7 @@ const ItemGroup = (props) => {
 		};
 	});
 	const blockClasses = () => {
-		return twMerge("flex flex-row gap-1", classes().group);
+		return twMerge("flex flex-row gap-1", props.vertical ? "flex-col" : "flex-row", classes().group);
 	};
 	const itemClasses = () => {
 		return classes().item;
@@ -3229,6 +3227,10 @@ const ItemGroup = (props) => {
 		get vtags() {
 			return currentVTags().group;
 		},
+		stags: "item-group",
+		get styler() {
+			return props.styler;
+		},
 		get children() {
 			return createComponent(For, {
 				get each() {
@@ -3247,6 +3249,9 @@ const ItemGroup = (props) => {
 						},
 						get vtags() {
 							return currentVTags().item;
+						},
+						get styler() {
+							return props.styler;
 						}
 					});
 				}

package/dist/index.jsx

@@ -2712,16 +2712,13 @@ const Item = (props) => {
 		if (props.disabled) r.push("item:disabled");
 		return r;
 	};
-	const currentStyler = () => {
-		if (props.styler) return props.styler;
-		else return Stylers.base;
-	};
+	const currentStyler = () => props.styler ?? Stylers.base;
 	const classProp = createMemo(() => {
 		if (props.class == void 0) return {};
 		else if (typeof props.class == "string") return { item: props.class };
 		else return props.class;
 	});
-	const itemClasses = () => {
+	const itemClasses = createMemo(() => {
 		const stags = currentSTags();
 		const styler = currentStyler();
 		const rawClasses = [];
@@ -2734,7 +2731,7 @@ const Item = (props) => {
 		if (props.disabled && customClasses.disabled) rawClasses.push(customClasses.disabled);
 		rawClasses.push("relative");
 		return twMerge(rawClasses);
-	};
+	});
 	const disablerClasses = createMemo(() => {
 		const rawClasses = [];
 		if (currentStyler()) rawClasses.push(...currentStyler().classes("item/disabler", props.vtags));
@@ -2767,13 +2764,12 @@ const Block = (props) => {
 		else return Stylers.base;
 	};
 	function blockClasses() {
-		const classes = currentStyler().classes("block", props.vtags) ?? [];
+		const stags = props.stags ?? "block";
+		const classes = currentStyler().classes(stags, props.vtags) ?? [];
 		if (props.class) classes.push(props.class);
-		return twMerge(classes);
+		return "_block " + twMerge(classes);
 	}
-	return <div class={blockClasses()}>
-      {props.children}
-    </div>;
+	return <div class={blockClasses()}>{props.children}</div>;
 };
 
 //#endregion
@@ -2809,7 +2805,7 @@ const ItemGroup = (props) => {
 		};
 	});
 	const blockClasses = () => {
-		return twMerge("flex flex-row gap-1", classes().group);
+		return twMerge("flex flex-row gap-1", props.vertical ? "flex-col" : "flex-row", classes().group);
 	};
 	const itemClasses = () => {
 		return classes().item;
@@ -2822,11 +2818,11 @@ const ItemGroup = (props) => {
 		else if (typeof props.selection == "object") return !!props.selection[id];
 		return false;
 	};
-	return <Block class={blockClasses()} vtags={currentVTags().group}>
+	return <Block class={blockClasses()} vtags={currentVTags().group} stags="item-group" styler={props.styler}>
       <For each={items()}>
         {(item) => {
 		const selected = () => itemSelected(item.id);
-		return <Item idLabel={item} selected={selected()} callback={() => callCallback(item)} class={itemClasses()} vtags={currentVTags().item}></Item>;
+		return <Item idLabel={item} selected={selected()} callback={() => callCallback(item)} class={itemClasses()} vtags={currentVTags().item} styler={props.styler}></Item>;
 	}}
       </For>
     </Block>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mrts/soltw",
   "description": "S O L T W : SolidJS + tailwindcss ui components",
-  "version": "0.3.29",
+  "version": "0.3.30",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -40,5 +40,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "2296d33f40347b27cdeddbabd5542806901fd8d1"
+  "gitHead": "56805e2a1ac643ee83064ec4ed91c8d3e85353d0"
 }