chore: initial commit

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,38 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: bug
+assignees: daviddarnes
+
+---
+
+**Describe the bug**
+A clear and concise description of what the bug is.
+
+**To Reproduce**
+Steps to reproduce the behaviour:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behaviour**
+A clear and concise description of what you expected to happen.
+
+**Screenshots**
+If applicable, add screenshots to help explain your problem.
+
+**Desktop (please complete the following information):**
+ - OS: [e.g. iOS]
+ - Browser [e.g. chrome, safari]
+ - Version [e.g. 22]
+
+**Smartphone (please complete the following information):**
+ - Device: [e.g. iPhone6]
+ - OS: [e.g. iOS8.1]
+ - Browser [e.g. stock browser, safari]
+ - Version [e.g. 22]
+
+**Additional context**
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,20 @@
+---
+name: Feature request
+about: Suggest an idea for this project
+title: ''
+labels: enhancement
+assignees: daviddarnes
+
+---
+
+**Is your feature request related to a problem? Please describe.**
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+**Describe the solution you'd like**
+A clear and concise description of what you want to happen.
+
+**Describe alternatives you've considered**
+A clear and concise description of any alternative solutions or features you've considered.
+
+**Additional context**
+Add any other context or screenshots about the feature request here.

.github/workflows/npm-publish.yml

@@ -0,0 +1,19 @@
+name: Node.js Package
+
+on:
+  release:
+    types: [created]
+
+jobs:
+  publish-npm:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+      - run: npm install
+      - run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.npm_token}}

.gitignore

@@ -0,0 +1,12 @@
+# build output
+node_modules/
+
+# logs
+*log
+*-error.log
+
+# IDE
+.idea
+
+# system
+.DS_Store

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Cory Dransfeldt
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,80 @@
+# Eleventy: tabler icons plugin
+
+Shortcodes to add [tabler icons](https://tabler-icons.io) to your [Eleventy](https://11ty.dev) projects
+
+## Get started
+
+Install the package:
+
+```sh
+npm i -D eleventy-plugin-tablericons
+```
+
+Then add the plugin to your `.eleventy.js` file:
+
+```js
+// .eleventy.js
+module.exports = eleventyConfig => {
+    eleventyConfig.addPlugin(require('eleventy-plugin-tablericons'));
+}
+```
+
+## Usage
+
+This plugin adds the `tablericon` shortcode.
+
+**Note**: These examples use Liquid template syntax, which is the default for Eleventy. If you are using another template engine like Nunjucks, the syntax might be slightly different.
+
+### `tablericon`
+
+Args: `name: string`, `alt?: string`
+
+```md
+{% tablericon "archive" %}
+{% tablericon "x" "Close menu" %}
+```
+
+## Configuration
+
+`eleventy-plugin-tablericons` offers a few options on a configuration object passed to Eleventy's `addPlugin()`:
+
+- `className?: string` Adds a class to all tabler icons
+- `errorOnMissing: boolean` (default: `false`) Throw an error when passed an invalid style/name or invalid attribute
+
+Pass the configuration object when adding the plugin:
+
+```js
+// .eleventy.js
+module.exports = eleventyConfig => {
+    eleventyConfig.addPlugin(require('eleventy-plugin-tablericons'), {
+        className: 'icon',
+        errorOnMissing: true
+    });
+}
+```
+
+## Styling
+
+The `svg` element receives two data attributes that you can use for styling:
+
+- `data-tablericon-name="string"`
+
+You could add the following to your stylesheets:
+
+```css
+/* Arrow down icon */
+[data-tablericon-name="arrow-down"] {
+    color: darkgreen;
+}
+
+/* All icons */
+[data-tablericon-name] {
+    padding: 2ch;
+}
+```
+
+If you passed a `className` to the configuration object, then you could use that to select all icons.
+
+## License
+
+[MIT](./LICENSE)

build.js

@@ -0,0 +1,28 @@
+const fs = require('fs');
+const path = `./node_modules/@tabler/icons/icons/filled/`;
+const fileNames = fs.readdirSync(path);
+const object = {};
+const CONTENTS = {
+  HEAD: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">",
+  TAIL: "</svg>",
+};
+
+fileNames.forEach((filename) => {
+  const contents = fs
+    .readFileSync(path + filename)
+    .toString()
+    .trimEnd();
+  const lines = contents.split("\n");
+  const guts = lines
+    .slice(1, lines.length - 1)
+    .join("")
+    .replace(/\ \ /g, "");
+  if (object) object[filename.slice(0, -4)] = guts;
+});
+
+fs.writeFileSync(
+  "./icons.js",
+  `// Generated by build.js at ${new Date().toISOString()}\n\nmodule.exports = ${JSON.stringify(
+    {...object, HEAD: CONTENTS['HEAD'], TAIL: CONTENTS['TAIL']}
+  )};\n`
+);

package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@cdransf/eleventy-tabler-icons-filled",
+  "version": "1.0.0",
+  "description": "Shortcodes to add filled Tabler icons to your Eleventy projects",
+  "main": "tablericons.js",
+  "files": [
+    "tablericons.js",
+    "icons.js"
+  ],
+  "scripts": {
+    "build": "node build.js",
+    "postversion": "git push && git push --tags"
+  },
+  "keywords": [
+    "eleventy-plugin",
+    "eleventy",
+    "plugin",
+    "tabler-icons"
+  ],
+  "author": {
+    "email": "coryd@hey.com",
+    "name": "Cory Dransfeldt",
+    "url": "https://coryd.dev"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/cdransf/eleventy-tabler-icons-filled.git"
+  },
+  "homepage": "https://github.com/cdransf/eleventy-tabler-icons-filled#readme",
+  "bugs": {
+    "url": "https://github.com/cdransf/eleventy-tabler-icons-filled/issues"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@11ty/eleventy": "^2.0.1",
+    "@tabler/icons": "^3.0.1"
+  }
+}

tablericons.js

@@ -0,0 +1,55 @@
+const ICONS = require("./icons");
+
+const initialConfig = {
+  className: "",
+  errorOnMissing: false,
+};
+
+module.exports = function tablericons(eleventyConfig, config = initialConfig) {
+  function tablericons(context = this, name, alt) {
+    const contents = ICONS[name];
+    if (!contents) {
+      const message = `No tablericons found for name "${name}"`;
+      if (config.errorOnMissing) {
+        throw new Error(message);
+      } else {
+        console.warn(message + ` in ${context.page.inputPath}`);
+        return "";
+      }
+    }
+
+    if (!contents) return "";
+
+    return `${head(alt, config.className, name)}${contents}${
+      ICONS.TAIL
+    }`;
+  }
+
+  eleventyConfig.addShortcode("tablericon", function (name, alt, attrs) {
+    return tablericons(this, name, alt, attrs);
+  });
+};
+
+function head(alt, className, iconName, attrs) {
+  let output = ICONS.HEAD.slice(0, -1); // Open tag
+  if (!alt) output += ` aria-hidden="true"`;
+  if (className) output += ` class="${className}"`;
+  output += ` data-tablericon-name="${iconName}"`;
+
+  if (attrs) {
+    if (typeof attrs === "string") {
+      output += ` ${attrs}`;
+    } else {
+      Object.entries(attrs).forEach(([property, value]) => {
+        if (property && value) {
+          output += ` ${property}="${value}"`;
+        }
+      });
+    }
+  }
+
+  output += ">"; // Close tag
+  if (alt) output += `<title>${alt}</title>`;
+
+  return output;
+}