Github linting action / pnpm format

.eslintrc.cjs

@@ -9,10 +9,7 @@ module.exports = {
 		// 'airbnb-typescript/base',
 		'prettier'
 	],
-	plugins: [
-		'@typescript-eslint', 
-		'import'
-	],
+	plugins: ['@typescript-eslint', 'import'],
 	ignorePatterns: [], // ['*.cjs'],
 	overrides: [
 		{

.github/ISSUE_TEMPLATE/bug_report.yaml

@@ -2,23 +2,23 @@ name: 🐞 Bug
 description: Report an issue
 labels: [🐞 bug]
 body:
-- type: textarea
-  attributes:
-    label: Describe the bug
-    description: A clear description of the problem you're experiencing.
-  validations:
-    required: true
-- type: textarea
-  attributes:
-    label: Reproduction steps
-    description: Describe how to reproduce the issue.
-    placeholder: |
-      1. ...
-      2. ...
-  validations:
-    required: false
-- type: input
-  id: reproduction
-  attributes:
-    label: Link to Reproduction
-    description: A minimal SvelteLab / Stackblitz reproduction.
+  - type: textarea
+    attributes:
+      label: Describe the bug
+      description: A clear description of the problem you're experiencing.
+    validations:
+      required: true
+  - type: textarea
+    attributes:
+      label: Reproduction steps
+      description: Describe how to reproduce the issue.
+      placeholder: |
+        1. ...
+        2. ...
+    validations:
+      required: false
+  - type: input
+    id: reproduction
+    attributes:
+      label: Link to Reproduction
+      description: A minimal SvelteLab / Stackblitz reproduction.

.github/ISSUE_TEMPLATE/docs_report.yaml

@@ -2,7 +2,7 @@ name: 📖 Report docs related issue
 description: Report some problems with the documentation or improvements that can be made.
 labels: [📖 documentation]
 body:
-- type: textarea
-  attributes:
-    label: Describe the issue
-    description: Please add helpful screenshots and links (if it is a specific page).
+  - type: textarea
+    attributes:
+      label: Describe the issue
+      description: Please add helpful screenshots and links (if it is a specific page).

.github/workflows/ci.yaml

@@ -13,7 +13,7 @@ concurrency:
 
 permissions:
   contents: read # to fetch code (actions/checkout)
-  
+
 jobs:
   Check:
     runs-on: ubuntu-latest
@@ -24,4 +24,17 @@ jobs:
           version: 8.6.3
           run_install: true
       - run: pnpm run check
-
+
+  Lint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: pnpm/action-setup@v2.2.1
+        with:
+          version: 8
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18.x'
+          cache: pnpm
+      - run: pnpm install --frozen-lockfile
+      - run: pnpm run lint

.github/workflows/release.yml

@@ -38,4 +38,4 @@ jobs:
           publish: pnpm release
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_ACCESS_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_ACCESS_TOKEN }}

.vscode/extensions.json

@@ -1,10 +1,10 @@
 {
-    "recommendations": [
-        "svelte.svelte-vscode",
-        "dbaeumer.vscode-eslint",
-        "antfu.unocss",
-        "antfu.iconify",
-        "esbenp.prettier-vscode",
-        "zixuanchen.vitest-explorer"
-    ]
-}
+	"recommendations": [
+		"svelte.svelte-vscode",
+		"dbaeumer.vscode-eslint",
+		"antfu.unocss",
+		"antfu.iconify",
+		"esbenp.prettier-vscode",
+		"zixuanchen.vitest-explorer"
+	]
+}

CODE_OF_CONDUCT.md

@@ -17,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-* Demonstrating empathy and kindness toward other people
-* Being respectful of differing opinions, viewpoints, and experiences
-* Giving and gracefully accepting constructive feedback
-* Accepting responsibility and apologizing to those affected by our mistakes,
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
   and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the overall
+- Focusing on what is best not just for us as individuals, but for the overall
   community
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery, and sexual attention or advances of
+- The use of sexualized language or imagery, and sexual attention or advances of
   any kind
-* Trolling, insulting or derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or email address,
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or email address,
   without their explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
@@ -128,4 +128,4 @@ For answers to common questions about this code of conduct, see the FAQ at
 [v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html
 [Mozilla CoC]: https://github.com/mozilla/diversity
 [FAQ]: https://www.contributor-covenant.org/faq
-[translations]: https://www.contributor-covenant.org/translations
+[translations]: https://www.contributor-covenant.org/translations

CONTRIBUTING.md

@@ -29,4 +29,4 @@ If this is your first project to contribute to you can find many great resources
 3. Clone the forked repo into your machine.
 4. Open the project (using VSCode) and install the dependencies with `pnpm i`.
 5. Create a new branch for you to make changes on.
-6. Run the server `pnpm run dev` to see your changes.
+6. Run the server `pnpm run dev` to see your changes.

README.md

@@ -1,4 +1,4 @@
-![Ato UI](./static/seo/ato-ui-banner-resized.png "Ato UI")
+![Ato UI](./static/seo/ato-ui-banner-resized.png 'Ato UI')
 
 # Ato UI
 
@@ -17,6 +17,7 @@ pnpm add -D ato-ui
 ```
 
 ## ✨ Features
+
 - 🦄 Headless + Styled components
 - 🎨 Themeable with an easy to use designers page
 - 🎯 Written in TypeScript

mdsvex.config.js

@@ -1,4 +1,4 @@
 // @ts-nocheck
 /**
  * Source: https://github.com/melt-ui/melt-ui/blob/develop/mdsvex.config.js
  */
@@ -12,36 +12,33 @@
 import { BUNDLED_LANGUAGES, getHighlighter } from 'shiki-es';
 import { escapeSvelte } from '@huntabyte/mdsvex';
 
 import { highlightCode } from './src/docs/mdsvex/highlight.js';
 
-
 const __dirname = fileURLToPath(new URL('.', import.meta.url));
 
 const prettyCodeOptions = {
 	// theme: 'github-dark',
-	theme: JSON.parse(
-		readFileSync(resolve(__dirname, './static/moonlight-2-theme.json'), 'utf-8')
-	),
+	theme: JSON.parse(readFileSync(resolve(__dirname, './static/moonlight-2-theme.json'), 'utf-8')),
 	keepBackground: false,
 	// @ts-ignore:next-line
 	onVisitLine(node) {
 		if (node.children.length === 0) {
 			node.children = { type: 'text', value: ' ' };
 		}
 	},
 	// @ts-ignore:next-line
 	onVisitTitle(node) {
 		// console.log('title:', node);
 	},
 	// @ts-ignore:next-line
 	getHighlighter: (options) => {
 		return getHighlighter({
 			...options,
 			langs: BUNDLED_LANGUAGES.filter(({ id }) => {
 				return ['svelte', 'typescript', 'html', 'css', 'javascript', 'bash', 'shell'].includes(id);
-			}),
+			})
 		});
-	},
+	}
 };
 
 /** @type {import('mdsvex').MdsvexOptions} */
@@ -51,40 +48,44 @@
 	// highlight: {
 	// 	highlighter: highlightCode
 	// },
-    rehypePlugins: [
+	rehypePlugins: [
 		rehypeCustomComponents,
 		rehypeComponentPreToPre,
 		[rehypePrettyCode, prettyCodeOptions],
 		rehypeHandleMetadata,
 		rehypeRenderCode,
-		rehypePreToComponentPre,
-
-	],
+		rehypePreToComponentPre
+	]
 };
 
-
 function rehypeCustomComponents() {
 	// @ts-ignore:next-line
 	return async (tree) => {
-		const hTags = ['Components.h1', 'Components.h2', 'Components.h3', 'Components.h4', 'Components.h5', 'Components.h6'];
+		const hTags = [
+			'Components.h1',
+			'Components.h2',
+			'Components.h3',
+			'Components.h4',
+			'Components.h5',
+			'Components.h6'
+		];
 
 		visit(tree, (node, index, parent) => {
 			// Check h tags, and pass some extra parameters to the custom components.
-            if (node?.type === 'element' && hTags.includes(node?.tagName)) {
+			if (node?.type === 'element' && hTags.includes(node?.tagName)) {
 				node.properties['content'] = node.children[0].value;
-                node.properties['headerTag'] = node.tagName.split('.')[1];
-            }
+				node.properties['headerTag'] = node.tagName.split('.')[1];
+			}
 		});
 	};
 }
 
 function rehypeComponentPreToPre() {
 	// @ts-ignore:next-line
 	return async (tree) => {
 		// Replace `Component.pre` tags with regular `pre` tags.
 		// This enables us to use rehype-pretty-code with our custom `pre` component.
 		visit(tree, (node) => {
-
 			// if (node?.data && 'meta' in node?.data) {
 			// 	console.log('node:', node, '\n');
 			// 	console.log('data:', node?.data, '\n-------------------------');
@@ -100,11 +101,16 @@
 /**
  * Escapes the html string of code blocks so we can pass
  * it on to our custom `Component.pre` element.
- * @param {string} html 
+ * @param {string} html
  * @returns {string}
  */
 function escapeHtml(html) {
-	return html.replaceAll('&', '&amp;').replaceAll('<', '&lt;').replaceAll('>', '&gt;').replaceAll('"', '&quot;').replaceAll("'", '&#039;');
+	return html
+		.replaceAll('&', '&amp;')
+		.replaceAll('<', '&lt;')
+		.replaceAll('>', '&gt;')
+		.replaceAll('"', '&quot;')
+		.replaceAll("'", '&#039;');
 }
 
 function rehypePreToComponentPre() {
@@ -119,7 +125,6 @@
 			if (node?.type === 'element' && node?.tagName === 'pre') {
 				node.tagName = 'Components.pre';
 
-
 				// if (node?.children.length > 0) {
 				// 	console.log('\n\nnode:', node);
 				// 	console.log('\n\nnode.children[0]:', node?.children[0], '\n------------------------');
@@ -143,7 +148,10 @@
 
 				const titleElement = node.children[0];
 				const preElement = node.children.at(-1);
-				if (preElement.tagName !== 'pre' || !('data-rehype-pretty-code-title' in titleElement.properties)) {
+				if (
+					preElement.tagName !== 'pre' ||
+					!('data-rehype-pretty-code-title' in titleElement.properties)
+				) {
 					return;
 				}
 
@@ -173,7 +181,7 @@
 				const codeString = tabsToSpaces(
 					toHtml(codeEl, {
 						allowDangerousCharacters: true,
-						allowDangerousHtml: true,
+						allowDangerousHtml: true
 					})
 				);
 
@@ -185,10 +193,10 @@
 }
 
 /**
- * 
- * @param {string} code 
+ *
+ * @param {string} code
  * @returns {string}
  */
 function tabsToSpaces(code) {
 	return code.replaceAll('	', '  ');
-}
+}

package.json

@@ -140,4 +140,4 @@
 		"esm-env": "^1.0.0",
 		"unocss": "^0.55.7"
 	}
-}
+}

scripts/api-docs.ts

@@ -1,3 +1,3 @@
 import { getComponentFileData } from './utils';
 
-getComponentFileData();
+getComponentFileData();