@seahax/elemental 0.5.7 → 0.5.9

package/README.md

@@ -302,3 +302,25 @@ h(parent, items.map((item) => {
   return h('p', { 'data-key': item.id }, [item.text]);
 }));
 ```
+
+## Combine Conditional Classes
+
+```ts
+// Using a dictionary of boolean values.
+const classNames = classes({
+  'my-class-0': true,
+  'my-class-1': false,
+  'my-class-2': undefined,
+  'my-class-3': null,
+  'my-class-4': true,
+}); // = 'my-class-0 my-class-4'
+
+// Using a sparse array.
+const classNames = classes([
+  'my-class-0',
+  false,
+  undefined,
+  null,
+  'my-class-4',
+]); // = 'my-class-0 my-class-3'
+```

package/dist/classes.d.ts

@@ -0,0 +1,2 @@
+/** Space separated class string helper. */
+export declare function classes(classes: readonly (string | boolean | null | undefined)[] | Readonly<Record<string, boolean | null | undefined>>): string | null;

package/dist/classes.js

@@ -0,0 +1,8 @@
+//#region src/classes.ts
+function e(e) {
+	return (Array.isArray(e) ? e.filter(Boolean).join(" ") : Object.entries(e).filter(([, e]) => e).map(([e]) => e).join(" ")) || null;
+}
+//#endregion
+export { e as classes };
+
+//# sourceMappingURL=classes.js.map

package/dist/classes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"classes.js","names":[],"sources":["../src/classes.ts"],"sourcesContent":["/** Space separated class string helper. */\nexport function classes(\n  classes: readonly (string | boolean | null | undefined)[] | Readonly<Record<string, boolean | null | undefined>>,\n): string | null {\n  return (\n    (Array.isArray(classes)\n      ? classes.filter(Boolean).join(' ')\n      : Object.entries(classes)\n          .filter(([, value]) => value)\n          .map(([key]) => key)\n          .join(' ')) || null\n  );\n}\n"],"mappings":";AACA,SAAgB,EACd,GACe;AACf,SACG,MAAM,QAAQ,EAAQ,GACnB,EAAQ,OAAO,QAAQ,CAAC,KAAK,IAAI,GACjC,OAAO,QAAQ,EAAQ,CACpB,QAAQ,GAAG,OAAW,EAAM,CAC5B,KAAK,CAAC,OAAS,EAAI,CACnB,KAAK,IAAI,KAAK"}

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export * from './classes.ts';
 export * from './createStore.ts';
 export * from './defineComponent.ts';
 export * from './hooks/useAsync.ts';

package/dist/index.js

@@ -1,17 +1,18 @@
-import { createStore as e } from "./createStore.js";
-import { useRef as t } from "./hooks/useRef.js";
-import { defineComponent as n } from "./defineComponent.js";
-import { useDisconnectCallback as r } from "./hooks/useDisconnect.js";
-import { useEffect as i } from "./hooks/useEffect.js";
-import { useAsync as a } from "./hooks/useAsync.js";
-import { useHost as o } from "./hooks/useHost.js";
-import { useAttributes as s } from "./hooks/useAttributes.js";
-import { useChildEffect as c } from "./hooks/useChildEffect.js";
-import { useDocument as l } from "./hooks/useDocument.js";
-import { useElementInternals as u } from "./hooks/useElementInternals.js";
-import { useForm as d, useFormDisabled as f, useFormResetCallback as p, useFormRestoreCallback as m } from "./hooks/useForm.js";
-import { useParent as h } from "./hooks/useParent.js";
-import { useStore as g } from "./hooks/useStore.js";
-import { useRoute as _ } from "./hooks/useRoute.js";
-import { html as v } from "./html.js";
-export { e as createStore, n as defineComponent, v as h, v as html, a as useAsync, s as useAttributes, c as useChildEffect, r as useDisconnectCallback, l as useDocument, i as useEffect, u as useElementInternals, d as useForm, f as useFormDisabled, p as useFormResetCallback, m as useFormRestoreCallback, o as useHost, h as useParent, t as useRef, _ as useRoute, g as useStore };
+import { classes as e } from "./classes.js";
+import { createStore as t } from "./createStore.js";
+import { useRef as n } from "./hooks/useRef.js";
+import { defineComponent as r } from "./defineComponent.js";
+import { useDisconnectCallback as i } from "./hooks/useDisconnect.js";
+import { useEffect as a } from "./hooks/useEffect.js";
+import { useAsync as o } from "./hooks/useAsync.js";
+import { useHost as s } from "./hooks/useHost.js";
+import { useAttributes as c } from "./hooks/useAttributes.js";
+import { useChildEffect as l } from "./hooks/useChildEffect.js";
+import { useDocument as u } from "./hooks/useDocument.js";
+import { useElementInternals as d } from "./hooks/useElementInternals.js";
+import { useForm as f, useFormDisabled as p, useFormResetCallback as m, useFormRestoreCallback as h } from "./hooks/useForm.js";
+import { useParent as g } from "./hooks/useParent.js";
+import { useStore as _ } from "./hooks/useStore.js";
+import { useRoute as v } from "./hooks/useRoute.js";
+import { html as y } from "./html.js";
+export { e as classes, t as createStore, r as defineComponent, y as h, y as html, o as useAsync, c as useAttributes, l as useChildEffect, i as useDisconnectCallback, u as useDocument, a as useEffect, d as useElementInternals, f as useForm, p as useFormDisabled, m as useFormResetCallback, h as useFormRestoreCallback, s as useHost, g as useParent, n as useRef, v as useRoute, _ as useStore };

package/package.json

@@ -21,5 +21,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.5.7"
+  "version": "0.5.9"
 }