@mrts/soltw 0.3.10 → 0.3.13

package/dist/index.jsx

@@ -1,369 +1,12 @@
-import { For, Show, createMemo } from "solid-js";
-import { twMerge } from "tailwind-merge";
-import { argTokenizeBySpaces, deduplicate, tokenizeFilterString } from "@mrts/common";
-import { Dynamic } from "solid-js/web";
+import { buildIdLabel } from "./items/IdLabel.jsx";
+import { exclusiveTagsNormalize, mainTagNormalize, twMergeNormalize } from "./stylers/normalizers.jsx";
+import { SVTStyler, tagRuleMatches } from "./stylers/SVTStyler.jsx";
+import { baseStyler } from "./stylers/base.styler.jsx";
+import { Stylers } from "./stylers/Stylers.jsx";
+import { Item } from "./items/Item.jsx";
+import "./stylers/index.jsx";
+import { Block } from "./Block.jsx";
+import { ItemGroup } from "./items/ItemGroup.jsx";
+import { SolTw } from "./soltw.jsx";
 
-//#region src/items/IdLabel.ts
-function buildIdLabel(arg) {
-	if (typeof arg == "string") return {
-		id: arg,
-		label: arg
-	};
-	else if (Array.isArray(arg)) return {
-		id: arg[0],
-		label: arg[1]
-	};
-	else {
-		const r = Object.assign({}, arg);
-		if (r.label == void 0) r["label"] = r.id;
-		return r;
-	}
-}
-
-//#endregion
-//#region src/stylers/normalizers.ts
-function twMergeNormalize(raw) {
-	return tokenizeFilterString(twMerge(...raw));
-}
-function mainTagNormalize(rawTags, defaultTag) {
-	return exclusiveTagsNormalize(rawTags, (tag) => tag.length == 1 && tag.toUpperCase() == tag, defaultTag);
-}
-function exclusiveTagsNormalize(rawTags, tagSet, defaultTag) {
-	const rhead = [];
-	const rtail = [];
-	let rtag = void 0;
-	const tagSetFunc = typeof tagSet == "function" ? tagSet : (tag) => tagSet.has(tag);
-	for (const tag of rawTags) if (tagSetFunc(tag)) {
-		rtag = tag;
-		rhead.push(...rtail);
-		rtail.length = 0;
-	} else if (rtag == void 0) rhead.push(tag);
-	else rtail.push(tag);
-	rtag = rtag ?? defaultTag;
-	return rtag == void 0 ? [...rhead, ...rtail] : [
-		...rhead,
-		rtag,
-		...rtail
-	];
-}
-
-//#endregion
-//#region src/stylers/SVTStyler.ts
-var SVTStyler = class SVTStyler {
-	_rules = [];
-	options;
-	constructor(rules, options = {}) {
-		for (const r of rules) this._rules.push(SVTStyler.normalizeRule(r));
-		this.options = { ...options };
-	}
-	with(rules, options = {}) {
-		const addedRules = [];
-		for (const r of rules) addedRules.push(SVTStyler.normalizeRule(r));
-		const styler = new SVTStyler([], { ...this.options });
-		styler._rules.push(...this._rules, ...addedRules);
-		return styler;
-	}
-	classes(stags, vtags) {
-		const r = [];
-		let stagsNormalized = argTokenizeBySpaces(stags);
-		let vtagsNormalized = argTokenizeBySpaces(vtags);
-		if (this.options.stagsNormaliser) stagsNormalized = this.options.stagsNormaliser(stagsNormalized);
-		if (this.options.vtagsNormaliser) vtagsNormalized = this.options.vtagsNormaliser(vtagsNormalized);
-		for (const rule of this._rules) if (this.ruleMatches(rule, stagsNormalized, vtagsNormalized)) r.push(...rule.classes);
-		return this.options.normalizer ? this.options.normalizer(r) : r;
-	}
-	static normalizeRule(rule) {
-		let stagMode = rule.stagMode ?? "or";
-		let vtagMode = rule.vtagMode ?? "or";
-		let stags = deduplicate(argTokenizeBySpaces(rule.stags));
-		let vtags = deduplicate(argTokenizeBySpaces(rule.vtags));
-		let classes = deduplicate(argTokenizeBySpaces(rule.classes));
-		if (rule.stags == void 0 && rule.stagMode == void 0) stagMode = "any";
-		if (rule.vtags == void 0 && rule.vtagMode == void 0) vtagMode = "any";
-		return {
-			stagRule: {
-				mode: stagMode,
-				tags: stags
-			},
-			vtagRule: {
-				mode: vtagMode,
-				tags: vtags
-			},
-			classes
-		};
-	}
-	ruleMatches(rule, stags, vtags) {
-		return tagRuleMatches(rule.stagRule, stags) && tagRuleMatches(rule.vtagRule, vtags);
-	}
-};
-function tagRuleMatches(rule, candidateTags) {
-	if (rule.mode == "any") return true;
-	else if (rule.mode == "or") {
-		for (const ctag of candidateTags) if (rule.tags.indexOf(ctag) >= 0) return true;
-		return false;
-	} else if (rule.mode == "and") {
-		for (const rtag of rule.tags) if (candidateTags.indexOf(rtag) < 0) return false;
-		return true;
-	}
-	return false;
-}
-
-//#endregion
-//#region src/stylers/base.styler.ts
-const baseStyler = new SVTStyler([
-	{
-		vtags: "A",
-		classes: "bg-slate-100 text-slate-800"
-	},
-	{
-		vtags: "B",
-		classes: "bg-slate-800 text-slate-100"
-	},
-	{
-		vtags: "C",
-		classes: "bg-stone-300 text-orange-950"
-	},
-	{
-		vtags: "D",
-		classes: "bg-orange-900 text-stone-100"
-	},
-	{
-		vtags: "LG",
-		classes: "text-xl p-2"
-	},
-	{
-		vtags: "BASE",
-		classes: "text-base p-1"
-	},
-	{
-		vtags: "SM",
-		classes: "text-sm p-0.5"
-	},
-	{
-		vtags: "LG",
-		stags: "item",
-		classes: "text-xl px-2 py-1"
-	},
-	{
-		vtags: "BASE",
-		stags: "item",
-		classes: "text-base px-1 py-0.5"
-	},
-	{
-		vtags: "SM",
-		stags: "item",
-		classes: "text-sm p-0.5"
-	},
-	{
-		stags: "item:selected",
-		classes: "underline font-bold"
-	},
-	{
-		stags: "item:disabled",
-		classes: "blur-[1px]"
-	},
-	{
-		stags: "item/disabler",
-		classes: "bg-slate-300/85 cursor-not-allowed"
-	}
-], {
-	normalizer: twMergeNormalize,
-	vtagsNormaliser: (tags) => exclusiveTagsNormalize(mainTagNormalize(tags, "A"), new Set([
-		"SM",
-		"BASE",
-		"LG"
-	]), "BASE")
-});
-
-//#endregion
-//#region src/stylers/Stylers.ts
-var Stylers = class {
-	static _base;
-	static _stylersMap = /* @__PURE__ */ new Map();
-	static get base() {
-		return this._base;
-	}
-	static setBase(base) {
-		return this._base = base;
-	}
-	static {
-		this._stylersMap.set("default", baseStyler);
-		this.setBase(baseStyler);
-	}
-	static get(name) {
-		return this._stylersMap.get(name);
-	}
-};
-
-//#endregion
-//#region src/items/Item.tsx
-const Item = (props) => {
-	const itemData = () => buildIdLabel(props.idLabel);
-	const currentSTags = () => {
-		const r = [];
-		r.push("item");
-		if (props.selected) r.push("item:selected");
-		if (props.disabled) r.push("item:disabled");
-		return r;
-	};
-	const currentStyler = () => {
-		if (props.styler) return props.styler;
-		else return 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 = createMemo(() => {
-		const stags = currentSTags();
-		const styler = currentStyler();
-		const rawClasses = [];
-		const stylerClasses = styler ? styler.classes(stags, props.vtags) : void 0;
-		rawClasses.push(...stylerClasses ?? []);
-		if (props.callback) rawClasses.push("select-none cursor-pointer");
-		const customClasses = classProp();
-		if (customClasses.item) rawClasses.push(customClasses.item);
-		if (props.selected && customClasses.selected) rawClasses.push(customClasses.selected);
-		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));
-		if (classProp().disabler) rawClasses.push(classProp().disabler);
-		rawClasses.push("absolute inset-0");
-		return twMerge(rawClasses);
-	});
-	function handleClick() {
-		if (props.callback != void 0) props.callback(itemData());
-	}
-	return <div onClick={handleClick} class={itemClasses()}>
-      {itemData().label}
-      <Show when={props.disabled}>
-        <div class={disablerClasses()} onClick={(e) => {
-		if (!props.clickableWhendisabled) e.stopPropagation();
-	}}></div>
-      </Show>
-    </div>;
-};
-
-//#endregion
-//#region src/Block.tsx
-const Block = (props) => {
-	const elementTag = () => props.element ?? "div";
-	const currentStyler = () => {
-		if (props.styler) return props.styler;
-		else return Stylers.base;
-	};
-	function blockClasses() {
-		const classes = currentStyler().classes("block", props.vtags) ?? [];
-		if (props.class) classes.push(props.class);
-		return twMerge(classes);
-	}
-	return <Dynamic component={elementTag()} class={blockClasses()}>
-      {props.children}
-    </Dynamic>;
-};
-
-//#endregion
-//#region ../common/dist/strings/tokenize.js
-function buildTokenizeFuncUsingSplitters(splitters) {
-	splitters = Array.isArray(splitters) ? splitters : [splitters];
-	const tokenize = (s) => {
-		let r = s.split(splitters[0]).filter((t) => t != "" && t != void 0);
-		for (const splitter of splitters.slice(1)) {
-			const r0 = [...r];
-			r = [];
-			for (const s$1 of r0) r.push(...tokenizeFilterString$1(s$1, {
-				splitter,
-				filter: (t) => t != "" && t != void 0
-			}));
-		}
-		return r;
-	};
-	return tokenize;
-}
-function buildArgTokenizeFunc(tokenize) {
-	const argTokenize = (arg) => {
-		if (arg == void 0) return [];
-		else if (Array.isArray(arg)) {
-			const r = [];
-			for (const a of arg) r.push(...argTokenize(a));
-			return r;
-		} else return tokenize(arg);
-	};
-	return argTokenize;
-}
-const tokenizeBySpaces = buildTokenizeFuncUsingSplitters(/\s+/);
-const argTokenizeBySpaces$1 = buildArgTokenizeFunc(tokenizeBySpaces);
-function tokenizeFilterString$1(s, options = {}) {
-	const separator = options.splitter ?? /\s+/;
-	const filter = options.filter ?? ((s$1) => s$1.length > 0);
-	return s.split(separator).filter(filter);
-}
-
-//#endregion
-//#region src/items/ItemGroup.tsx
-const ItemGroup = (props) => {
-	const items = () => props.items.map(buildIdLabel);
-	const currentVTags = createMemo(() => {
-		const item = [];
-		const group = [];
-		const _vtags = props.vtags;
-		if (Array.isArray(_vtags) || typeof _vtags == "string") group.push(...argTokenizeBySpaces$1(_vtags));
-		else if (typeof _vtags == "object" && _vtags != null) {
-			group.push(...argTokenizeBySpaces$1(_vtags.group));
-			item.push(...argTokenizeBySpaces$1(_vtags.item));
-		}
-		return {
-			group,
-			item
-		};
-	});
-	const classes = createMemo(() => {
-		let group = "";
-		let item = "";
-		if (typeof props.class == "string") group = props.class;
-		else if (props.class != void 0) {
-			props.class;
-			group = props.class.group ?? "";
-			item = props.class.item ?? "";
-		}
-		return {
-			group,
-			item
-		};
-	});
-	const blockClasses = () => {
-		return twMerge("flex flex-row gap-1", classes().group);
-	};
-	const itemClasses = () => {
-		return classes().item;
-	};
-	const callCallback = (item) => {
-		if (props.callback) props.callback(item);
-	};
-	const itemSelected = (id) => {
-		if (typeof props.selection == "string") return id == props.selection;
-		else if (typeof props.selection == "object") return !!props.selection[id];
-		return false;
-	};
-	return <Block class={blockClasses()} vtags={currentVTags().group}>
-      <For each={items()}>
-        {(item) => {
-		return <Item idLabel={item} selected={itemSelected(item.id)} callback={() => callCallback(item)} class={itemClasses()} vtags={currentVTags().item}></Item>;
-	}}
-      </For>
-    </Block>;
-};
-
-//#endregion
-//#region src/soltw.tsx
-const SolTw = (props) => {
-	return <div class="bg-red-600">- - S O L T W - -</div>;
-};
-
-//#endregion
 export { Block, Item, ItemGroup, SVTStyler, SolTw, Stylers, baseStyler, buildIdLabel, exclusiveTagsNormalize, mainTagNormalize, tagRuleMatches, twMergeNormalize };

package/dist/items/IdLabel.d.ts

@@ -0,0 +1,15 @@
+//#region src/items/IdLabel.d.ts
+interface IdLabel {
+  id: string;
+  label: string;
+  [x: string | symbol]: unknown;
+}
+type IdLabelDef = {
+  id: string;
+  label?: string;
+  [x: string | symbol]: unknown;
+};
+type IdLabelArg = IdLabelDef | [string, string] | string;
+declare function buildIdLabel(arg: IdLabelArg): IdLabel;
+//#endregion
+export { IdLabel, IdLabelArg, IdLabelDef, buildIdLabel };

package/dist/items/IdLabel.js

@@ -0,0 +1,19 @@
+//#region src/items/IdLabel.ts
+function buildIdLabel(arg) {
+	if (typeof arg == "string") return {
+		id: arg,
+		label: arg
+	};
+	else if (Array.isArray(arg)) return {
+		id: arg[0],
+		label: arg[1]
+	};
+	else {
+		const r = Object.assign({}, arg);
+		if (r.label == void 0) r["label"] = r.id;
+		return r;
+	}
+}
+
+//#endregion
+export { buildIdLabel };

package/dist/items/IdLabel.jsx

@@ -0,0 +1,19 @@
+//#region src/items/IdLabel.ts
+function buildIdLabel(arg) {
+	if (typeof arg == "string") return {
+		id: arg,
+		label: arg
+	};
+	else if (Array.isArray(arg)) return {
+		id: arg[0],
+		label: arg[1]
+	};
+	else {
+		const r = Object.assign({}, arg);
+		if (r.label == void 0) r["label"] = r.id;
+		return r;
+	}
+}
+
+//#endregion
+export { buildIdLabel };

package/dist/items/Item.d.ts

@@ -0,0 +1,25 @@
+import { IdLabel, IdLabelArg } from "./IdLabel.js";
+import { ISVTStyler, TagListArgument } from "../stylers/types.js";
+import { Component } from "solid-js";
+
+//#region src/items/Item.d.ts
+type TItemClass = {
+  item?: string;
+  selected?: string;
+  disabled?: string;
+  disabler?: string;
+};
+type TItemClassArg = TItemClass | string;
+type TItemProps = {
+  idLabel: IdLabelArg;
+  callback?: (item: IdLabel) => void;
+  selected?: boolean;
+  disabled?: boolean;
+  clickableWhendisabled?: boolean;
+  styler?: ISVTStyler;
+  vtags?: TagListArgument;
+  class?: TItemClassArg;
+};
+declare const Item: Component<TItemProps>;
+//#endregion
+export { Item, TItemClass, TItemClassArg, TItemProps };

package/dist/items/Item.js

@@ -0,0 +1,75 @@
+import { buildIdLabel } from "./IdLabel.js";
+import { Show, createComponent, createMemo, createRenderEffect } from "../node_modules/solid-js/dist/solid.js";
+import { className, delegateEvents, insert, template } from "../node_modules/solid-js/web/dist/web.js";
+import { twMerge } from "../node_modules/tailwind-merge/dist/bundle-mjs.js";
+import { Stylers } from "../stylers/Stylers.js";
+
+//#region src/items/Item.tsx
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+const Item = (props) => {
+	const itemData = () => buildIdLabel(props.idLabel);
+	const currentSTags = () => {
+		const r = [];
+		r.push("item");
+		if (props.selected) r.push("item:selected");
+		if (props.disabled) r.push("item:disabled");
+		return r;
+	};
+	const currentStyler = () => {
+		if (props.styler) return props.styler;
+		else return 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 = createMemo(() => {
+		const stags = currentSTags();
+		const styler = currentStyler();
+		const rawClasses = [];
+		const stylerClasses = styler ? styler.classes(stags, props.vtags) : void 0;
+		rawClasses.push(...stylerClasses ?? []);
+		if (props.callback) rawClasses.push("select-none cursor-pointer");
+		const customClasses = classProp();
+		if (customClasses.item) rawClasses.push(customClasses.item);
+		if (props.selected && customClasses.selected) rawClasses.push(customClasses.selected);
+		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));
+		if (classProp().disabler) rawClasses.push(classProp().disabler);
+		rawClasses.push("absolute inset-0");
+		return twMerge(rawClasses);
+	});
+	function handleClick() {
+		if (props.callback != void 0) props.callback(itemData());
+	}
+	return (() => {
+		var _el$ = _tmpl$();
+		_el$.$$click = handleClick;
+		insert(_el$, () => itemData().label, null);
+		insert(_el$, createComponent(Show, {
+			get when() {
+				return props.disabled;
+			},
+			get children() {
+				var _el$2 = _tmpl$();
+				_el$2.$$click = (e) => {
+					if (!props.clickableWhendisabled) e.stopPropagation();
+				};
+				createRenderEffect(() => className(_el$2, disablerClasses()));
+				return _el$2;
+			}
+		}), null);
+		createRenderEffect(() => className(_el$, itemClasses()));
+		return _el$;
+	})();
+};
+delegateEvents(["click"]);
+
+//#endregion
+export { Item };

package/dist/items/Item.jsx

@@ -0,0 +1,60 @@
+import { buildIdLabel } from "./IdLabel.jsx";
+import { Show, createMemo } from "../node_modules/solid-js/dist/solid.jsx";
+import { twMerge } from "../node_modules/tailwind-merge/dist/bundle-mjs.jsx";
+import { Stylers } from "../stylers/Stylers.jsx";
+
+//#region src/items/Item.tsx
+const Item = (props) => {
+	const itemData = () => buildIdLabel(props.idLabel);
+	const currentSTags = () => {
+		const r = [];
+		r.push("item");
+		if (props.selected) r.push("item:selected");
+		if (props.disabled) r.push("item:disabled");
+		return r;
+	};
+	const currentStyler = () => {
+		if (props.styler) return props.styler;
+		else return 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 = createMemo(() => {
+		const stags = currentSTags();
+		const styler = currentStyler();
+		const rawClasses = [];
+		const stylerClasses = styler ? styler.classes(stags, props.vtags) : void 0;
+		rawClasses.push(...stylerClasses ?? []);
+		if (props.callback) rawClasses.push("select-none cursor-pointer");
+		const customClasses = classProp();
+		if (customClasses.item) rawClasses.push(customClasses.item);
+		if (props.selected && customClasses.selected) rawClasses.push(customClasses.selected);
+		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));
+		if (classProp().disabler) rawClasses.push(classProp().disabler);
+		rawClasses.push("absolute inset-0");
+		return twMerge(rawClasses);
+	});
+	function handleClick() {
+		if (props.callback != void 0) props.callback(itemData());
+	}
+	return <div onClick={handleClick} class={itemClasses()}>
+      {itemData().label}
+      <Show when={props.disabled}>
+        <div class={disablerClasses()} onClick={(e) => {
+		if (!props.clickableWhendisabled) e.stopPropagation();
+	}}></div>
+      </Show>
+    </div>;
+};
+
+//#endregion
+export { Item };

package/dist/items/ItemGroup.d.ts

@@ -0,0 +1,24 @@
+import { IdLabel, IdLabelArg } from "./IdLabel.js";
+import { TagListArgument } from "../stylers/types.js";
+import { TItemClassArg } from "./Item.js";
+import { Component } from "solid-js";
+
+//#region src/items/ItemGroup.d.ts
+type TProps = {
+  items: IdLabelArg[];
+  callback?: (item: IdLabel) => void;
+  class?: string | {
+    group?: string;
+    item?: TItemClassArg;
+  };
+  selection?: string | {
+    [id: string]: boolean;
+  };
+  vtags?: TagListArgument | {
+    group?: TagListArgument;
+    item?: TagListArgument;
+  };
+};
+declare const ItemGroup: Component<TProps>;
+//#endregion
+export { ItemGroup };