@lukekaalim/act-icons 1.0.0

package/docs/index.ts

@@ -0,0 +1,11 @@
+import { DocApp } from "@lukekaalim/grimoire";
+import { TypeDocPlugin } from "@lukekaalim/grimoire-ts";
+
+import readmeMd from '../readme.md?raw';
+import projectJSON from 'typedoc:../mod.ts';
+
+export const buildIconDocs = (doc: DocApp<[TypeDocPlugin]>) => {
+  doc.typedoc.addProjectJSON('@lukekaalim/act-icons', projectJSON);
+  
+  doc.article.add('icons.readme', readmeMd, '/packages/@lukekaalim/act-icons');
+}

package/mod.doc.ts

@@ -0,0 +1,16 @@
+import { h, useEffect, useRef } from "@lukekaalim/act";
+import { MarkdownArticle } from "@lukekaalim/grimoire";
+import md from './readme.md?raw';
+import { SVGRepo } from "./mod";
+import { MarkdownComponent } from "@lukekaalim/act-markdown";
+
+const SVGRepoDemo: MarkdownComponent = (props) => {
+  const href = `https://www.svgrepo.com/svg/${props.attributes.key}`;
+  return h('a', { href, style: { fontSize: '48px', display: 'flex', justifyContent: 'center' } },
+    h(SVGRepo, { key: props.attributes.key as string }));
+}
+
+export default h(MarkdownArticle, {
+  content: md,
+  //options: { inlineComponents: { SVGRepoDemo }}
+});

package/mod.module.css

@@ -0,0 +1,3 @@
+.icon {
+  height: 1em;
+}

package/mod.ts

@@ -0,0 +1,16 @@
+import { Component, h } from "@lukekaalim/act";
+import classes from './mod.module.css'
+
+export type SVGRepoProps = {
+  /** the id and name, i.e.: `535142/aquarius` */
+  key: string,
+  style?: Record<string, string>
+};
+
+export const SVGRepo: Component<SVGRepoProps> = ({ key, style }) => {
+  return h('img', {
+    style,
+    className: classes.icon,
+    src: `https://www.svgrepo.com/download/${key}.svg`,
+  })
+}

package/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@lukekaalim/act-icons",
+  "main": "mod.ts",
+  "version": "1.0.0",
+  "dependencies": {
+    "@lukekaalim/act": "^3.2.1",
+    "@lukekaalim/act-web": "^3.4.0-alpha.2",
+    "@svg-icons/feather": "^1.87.0"
+  }
+}

package/readme.md

@@ -0,0 +1,19 @@
+# @lukekaalim/act-icons
+
+Tiny icon library.
+
+```bash
+npm install @lukekaalim/act-icons
+```
+
+## SVGRepo
+
+<TypeDoc project="@lukekaalim/act-icons" name="SVGRepo" extras="SVGRepoProps" />
+
+Link `img` elements to URLs from [SVGRepo](https://www.svgrepo.com/).
+
+|Name|Key|Example|
+|-|-|-|
+|Front Page|`530508/front-page`|<SVGRepoDemo key="530508/front-page" />|
+|Chef Man|`533810/chef-man-cap`|<SVGRepoDemo key="533810/chef-man-cap" />|
+|Genetic Data|`530661/genetic-data`|<SVGRepoDemo key="530661/genetic-data" />|