@acfatah/eslint-preset 1.0.0

package/README.md

@@ -0,0 +1,264 @@
+# Eslint Preset
+
+<p>
+  <a href="https://github.com/antfu/eslint-config">
+    <img
+      alt="Code Style"
+      src="https://antfu.me/badge-code-style.svg"></a>
+  <a href="https://github.com/antfu/eslint-config">
+    <img
+      alt="GitHub last commit (by committer)"
+      src="https://img.shields.io/github/last-commit/acfatah/eslint-preset?display_timestamp=committer&style=flat-square"></a>
+</p>
+
+An opinionated ESLint configuration preset for TypeScript projects, based on [`antfu/eslint-config`][1].
+
+## Installation
+
+To install the config, run:
+
+```bash
+bun add --dev @acfatah/eslint-preset
+```
+
+Add `eslint.config.ts` file with the following content,
+
+```typescript
+import { markdown, preset, vue } from '@acfatah/eslint-preset/rules'
+import antfu from '@antfu/eslint-config'
+
+export default antfu(
+  {
+    formatters: true,
+    vue: true,
+  },
+
+  {
+    rules: {
+      ...preset,
+      ...markdown,
+      ...vue,
+    },
+  },
+
+  {
+    name: 'app/files-to-ignore',
+    ignores: [
+      '**/coverage/**',
+      '**/dist/**',
+      '**/logs/**',
+      'bun.lock',
+      'tsconfig.*',
+    ],
+  },
+)
+```
+
+## VS Code Support
+
+Install the [VS Code ESLint extension][2].
+
+Add the following vscode configuration to `.vscode/settings.json`,
+
+```jsonc
+{
+  // Disable the default formatter, use eslint instead
+  "prettier.enable": false,
+  "editor.formatOnSave": false,
+
+  // Auto fix
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never"
+  },
+
+  // Silent the stylistic rules in you IDE, but still auto fix them
+  "eslint.rules.customizations": [
+    { "rule": "style/*", "severity": "off", "fixable": true },
+    { "rule": "format/*", "severity": "off", "fixable": true },
+    { "rule": "*-indent", "severity": "off", "fixable": true },
+    { "rule": "*-spacing", "severity": "off", "fixable": true },
+    { "rule": "*-spaces", "severity": "off", "fixable": true },
+    { "rule": "*-order", "severity": "off", "fixable": true },
+    { "rule": "*-dangle", "severity": "off", "fixable": true },
+    { "rule": "*-newline", "severity": "off", "fixable": true },
+    { "rule": "*quotes", "severity": "off", "fixable": true },
+    { "rule": "*semi", "severity": "off", "fixable": true }
+  ],
+
+  // Enable eslint for all supported languages
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact",
+    "vue",
+    "html",
+    "markdown",
+    "json",
+    "jsonc",
+    "yaml",
+    "toml",
+    "xml",
+    "gql",
+    "graphql",
+    "astro",
+    "svelte",
+    "css",
+    "less",
+    "scss",
+    "pcss",
+    "postcss"
+  ],
+
+  // https://github.com/tailwindlabs/tailwindcss-intellisense?tab=readme-ov-file#recommended-vs-code-settings
+  "files.associations": {
+    "*.css": "tailwindcss"
+  },
+
+  // https://github.com/tailwindlabs/tailwindcss-intellisense?tab=readme-ov-file#recommended-vs-code-settings
+  "editor.quickSuggestions": {
+    "strings": "on"
+  }
+}
+```
+
+## Tailwind CSS Configuration
+
+Install the [Tailwind CSS IntelliSense extension][3].
+
+Add the following custom Tailwind CSS v4 functions and directives lines to the `.vscode/settings.json` file:
+
+```jsonc
+{
+  // other settings...
+
+  // Custom Tailwind CSS v4 functions and directives
+  // See:
+  // - https://tailwindcss.com/docs/functions-and-directives
+  // - https://grok.com/share/bGVnYWN5_1cf7d218-282e-46e5-acc6-efb07d12d35e
+  "css.customData": [
+    ".vscode/tailwind.json"
+  ]
+
+  // other settings...
+}
+```
+
+Then, add the following configurations to `.vscode/tailwindcss.json`.
+
+```jsonc
+{
+  "version": 1.1,
+  "atDirectives": [
+    {
+      "name": "@apply",
+      "description": "Inline any existing utility classes into custom CSS.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#apply-directive"
+        }
+      ]
+    },
+    {
+      "name": "@config",
+      "description": "Load legacy JavaScript-based configuration file (compatibility with v3.x).",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#config-directive"
+        }
+      ]
+    },
+    {
+      "name": "@custom-variant",
+      "description": "Add a custom variant in the project.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#custom-variant-directive"
+        }
+      ]
+    },
+    {
+      "name": "@import",
+      "description": "Use the @import directive to inline import CSS files, including Tailwind itself.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#import-directive"
+        }
+      ]
+    },
+    {
+      "name": "@plugin",
+      "description": "Load legacy JavaScript-based plugin (compatibility with v3.x).",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/upgrading-to-v4#plugins"
+        }
+      ]
+    },
+    {
+      "name": "@reference",
+      "description": "Import main stylesheet for reference without including styles, for use with frameworks like React, Svelte, etc.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#reference-directive"
+        }
+      ]
+    },
+    {
+      "name": "@source",
+      "description": "Specify source files not picked up by automatic content detection.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#source-directive"
+        }
+      ]
+    },
+    {
+      "name": "@theme",
+      "description": "Define custom design tokens like fonts, colors, breakpoints.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#theme-directive"
+        }
+      ]
+    },
+    {
+      "name": "@utility",
+      "description": "Add custom utilities that work with variants like hover, focus, lg.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#utility-directive"
+        }
+      ]
+    },
+    {
+      "name": "@variant",
+      "description": "Apply a Tailwind variant to styles in CSS.",
+      "references": [
+        {
+          "name": "Tailwind Documentation",
+          "url": "https://tailwindcss.com/docs/functions-and-directives#variant-directive"
+        }
+      ]
+    }
+  ]
+}
+```
+
+## Acknowledgments
+
+- [antfu/eslint-config][1]
+
+[1]: https://github.com/antfu/eslint-config
+[2]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
+[3]: https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss

package/dist/index.d.ts

@@ -0,0 +1,76 @@
+// Generated by dts-bundle-generator v9.5.1
+
+/**
+ * Eslint preset for Markdown files.
+ *
+ * This preset integrates the `@eslint/markdown` plugin.
+ * See: https://github.com/eslint/markdown
+ */
+export declare const markdown: {
+	name: string;
+	files: string[];
+	language: string;
+	plugins: {};
+	rules: {
+		readonly "markdown/fenced-code-language": "error";
+		readonly "markdown/heading-increment": "error";
+		readonly "markdown/no-duplicate-definitions": "error";
+		readonly "markdown/no-empty-definitions": "error";
+		readonly "markdown/no-empty-images": "error";
+		readonly "markdown/no-empty-links": "error";
+		readonly "markdown/no-invalid-label-refs": "error";
+		readonly "markdown/no-missing-atx-heading-space": "error";
+		readonly "markdown/no-missing-label-refs": "error";
+		readonly "markdown/no-missing-link-fragments": "error";
+		readonly "markdown/no-multiple-h1": "error";
+		readonly "markdown/no-reference-like-urls": "error";
+		readonly "markdown/no-reversed-media-syntax": "error";
+		readonly "markdown/no-space-in-emphasis": "error";
+		readonly "markdown/no-unused-definitions": "error";
+		readonly "markdown/require-alt-text": "error";
+		readonly "markdown/table-column-count": "error";
+	};
+}[];
+export declare const preset: {
+	"sort-imports": string;
+	"perfectionist/sort-imports": (string | {
+		partitionByNewLine: boolean;
+		newlinesBetween: string;
+	})[];
+	"space-before-function-paren": (string | {
+		anonymous: string;
+		named: string;
+		asyncArrow: string;
+	})[];
+	"style/padding-line-between-statements": (string | {
+		blankLine: string;
+		prev: string;
+		next: string;
+	})[];
+};
+/**
+ * Eslint preset for Tailwind CSS.
+ *
+ * This preset integrates the `eslint-plugin-better-tailwindcss` plugin.
+ * See: https://github.com/schoero/eslint-plugin-better-tailwindcss
+ */
+export declare const tailwind: {
+	"better-tailwindcss/enforce-consistent-line-wrapping": (string | {
+		printWidth: number;
+	})[];
+	"better-tailwindcss/no-restricted-classes": string;
+	"better-tailwindcss/no-unregistered-classes": string;
+};
+/**
+ * Eslint preset for Vue.js files.
+ *
+ * This preset integrates the `eslint-plugin-vue` plugin.
+ * See: https://eslint.vuejs.org/
+ */
+export declare const vue: {
+	"vue/object-property-newline": (string | {
+		allowAllPropertiesOnSameLine: boolean;
+	})[];
+};
+
+export {};

package/dist/index.mjs

@@ -0,0 +1,43 @@
+// src/rules/markdown.ts
+import eslintMarkdown from "@eslint/markdown";
+var markdown = eslintMarkdown.configs.recommended;
+// src/rules/preset.ts
+var preset = {
+  "sort-imports": "off",
+  "perfectionist/sort-imports": ["error", {
+    partitionByNewLine: true,
+    newlinesBetween: "ignore"
+  }],
+  "space-before-function-paren": ["error", {
+    anonymous: "never",
+    named: "never",
+    asyncArrow: "always"
+  }],
+  "style/padding-line-between-statements": [
+    "error",
+    { blankLine: "always", prev: "*", next: "return" }
+  ]
+};
+// src/rules/tailwind.ts
+import eslintPluginBetterTailwindcss from "eslint-plugin-better-tailwindcss";
+var tailwind = {
+  ...eslintPluginBetterTailwindcss.configs["recommended-warn"]?.rules,
+  ...eslintPluginBetterTailwindcss.configs["recommended-error"]?.rules,
+  "better-tailwindcss/enforce-consistent-line-wrapping": ["warn", {
+    printWidth: 100
+  }],
+  "better-tailwindcss/no-restricted-classes": "off",
+  "better-tailwindcss/no-unregistered-classes": "off"
+};
+// src/rules/vue.ts
+var vue = {
+  "vue/object-property-newline": ["error", {
+    allowAllPropertiesOnSameLine: true
+  }]
+};
+export {
+  vue,
+  tailwind,
+  preset,
+  markdown
+};

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "@acfatah/eslint-preset",
+  "type": "module",
+  "version": "1.0.0",
+  "description": "Eslint config preset.",
+  "author": "Achmad F. Ibrahim <acfatah@gmail.com>",
+  "license": "MIT",
+  "homepage": "https://github.com/acfatah/eslint-preset#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/acfatah/eslint-preset.git"
+  },
+  "bugs": {
+    "url": "https://github.com/acfatah/eslint-preset/issues"
+  },
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "import": "./dist/index.mjs"
+  },
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "scripts": {
+    "build": "bun run scripts/build.ts",
+    "lint": "bunx --bun eslint",
+    "lint:staged": "bunx --bun eslint --pass-on-no-patterns --no-warn-ignored $(git diff --relative --cached --name-only --diff-filter=d)",
+    "lint:commit-message": "bunx --bun commitlint --edit",
+    "format": "bunx --bun eslint --fix",
+    "typecheck": "tsc --noEmit",
+    "release": "bunx --bun bumpp --execute=\"bun install\"",
+    "publish": "npm publish --access public"
+  },
+  "dependencies": {
+    "@antfu/eslint-config": "^6.2.0",
+    "@eslint/markdown": "^7.5.1",
+    "eslint-plugin-better-tailwindcss": "^3.7.11",
+    "eslint-plugin-vue": "^10.6.2"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^20.1.0",
+    "@commitlint/config-conventional": "^20.0.0",
+    "@types/bun": "^1.3.3",
+    "bumpp": "^10.3.1",
+    "bun-plugin-dts": "^0.3.0",
+    "eslint": "^9.39.1",
+    "eslint-plugin-format": "^1.0.2",
+    "simple-git-hooks": "^2.13.1"
+  },
+  "simple-git-hooks": {
+    "commit-msg": "bun lint:commit-message",
+    "pre-commit": "bun lint:staged"
+  }
+}