Merge next into main (#222)

* [WIP] Add new compiler (#135)

* add new compiler

* chore: update compiler, make-synchronous

* chore: use compiler's AST types

* feat: use new Astro compiler

* fix: use `type` keyword for type exports

* fix: update compiler

* remove old parser

* wip: format basic Astro file

* bump @astrojs/compiler

* fix: format basic Astro file

* bump @astrojs/compiler

* fix: format with a single style element

* format frontmatter and simple expression

* fix: format with embedded JSX expressions

* fix: JSX expressions in attribute values

* format html comments

* format shorthand

* fix: format components

* format unclosed tags

* fix: format script tag

* format with prettier ignore in frontmatter

* fix: format spread operator

* format nested comment

* fix: format attribute with expression as value

* uncomment working tests

* fix: format style element content and attributes

* fix: format style element with sass and scss

* bump compiler

* fix: inline element white space

* fix: format fragments

* fix: format markdown content

* enter pre release mode

* fix: pre release workflow

* run ci and format workflows on next branch

Co-authored-by: Nate Moore <nate@skypack.dev>

* add changeset

* change version from patch to minor

* Version Packages (next) (#148)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* [ci] yarn format

* fix: skip handling comments

* Version Packages (next) (#149)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* [ci] yarn format

* Move from ava to vitest (#151)

* Move from ava to vitest

* chore: add changeset

* Fix eslint (#153)

* fix: eslint

* retrigger checks

* remove node 12 from ci (#154)

* chore: add changeset

* Change prettier width (#155)

* chore: change prettier width from 180 to 80

* chore: add changeset

* fix: format expression (#150)

* Format `directives` (#156)

* format directives

* chore: add changeset

* chore: fix test title

* Version Packages (next) (#152)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* update readme & contributing (#157)

* set `astroAllowShorthand` to default off (#143)

* set `astroAllowShorthand` to default off

Shorthand removes attribute keys and breaks Typescript which is used by Astro. It's also uncommon and should be disabled by default, and only opt-in for those that specifically want it.

* Create selfish-cherries-grab.md

* fix tests for shorthand formatting

- shorthand off by default
- comment (and should remove) can format to shorthand because this is covered in the options test

* remove obsolete shorthand tests, update changeset

* Version Packages (next) (#161)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* try out synckit (#166)

* Version Packages (next) (#167)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* Refactor tests for better watch mode (#170)

* Refactor tests for better watch mode

* small refactor

* Update dependencies (#172)

* Fix: format indented sass (#173)

* Fix: format indented sass

* chore: add changeset

* Disable vitest multi-threading (#176)

* Fix: duplicate text (#177)

* Fix: prevent duplicate text

* typo

* Add new line after comments (#178)

* Add new line after comments

* chore: add changeset

* Refactor test-utils (#179)

* Update @astrojs/compiler and fix for spread in expression (#206)

* Update @astrojs/compiler and fix for spread in expression

* add changeset

* Version Packages (next) (#171)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

* Cleanup repo (#216)

* Update README

* Update configuration files

* Format repo with new rules

* Add .git-blame-ignore-revs

* Update CONTRIBUTING.md

* Update links in package.json

* Fix README example indentation

* Fix README mistake, update ignore-revs id to right one

* Exit pre mode

Co-authored-by: Antony Faris <acp325@gmail.com>
Co-authored-by: Nate Moore <nate@skypack.dev>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: antonyfaris <antonyfaris@users.noreply.github.com>
Co-authored-by: Mani Gandham <manigandham@gmail.com>
Co-authored-by: Fred K. Schott <fkschott@gmail.com>
Co-authored-by: Yosuke Ota <otameshiyo23@gmail.com>

.editorconfig

@@ -0,0 +1,15 @@
+# https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = tab
+insert_final_newline = true
+trim_trailing_whitespace = false
+
+[{.*,*.md,*.json,*.toml,*.yml,}]
+indent_style = space

.eslintignore

@@ -0,0 +1,4 @@
+test/fixtures/**
+dist/**
+.github
+.changeset

.eslintrc

@@ -1,26 +1,20 @@
 {
-  "ignorePatterns": ["test/fixtures/**", "dist/**", "rollup.config.js"],
-  "plugins": ["prettier-doc"],
-  "extends": ["eslint:recommended", "plugin:ava/recommended", "plugin:prettier-doc/recommended", "plugin:node/recommended"],
+  "plugins": ["prettier-doc", "@typescript-eslint", "prettier"],
+  "extends": ["plugin:@typescript-eslint/recommended", "prettier", "plugin:prettier/recommended"],
   "rules": {
-    "curly": ["error", "multi-line"],
-    "node/no-unsupported-features/es-builtins": [
-      "error",
-      {
-        "version": "^12.20.0 || ^14.13.1 || >=16.0.0",
-        "ignores": []
-      }
-    ],
-    "node/no-unsupported-features/node-builtins": [
-      "error",
-      {
-        "version": "^12.20.0 || ^14.13.1 || >=16.0.0",
-        "ignores": []
-      }
-    ]
-  },
-  "parserOptions": {
-    "ecmaVersion": "latest",
-    "sourceType": "module"
+    "@typescript-eslint/ban-ts-comment": "off",
+    "@typescript-eslint/camelcase": "off",
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-empty-function": "off",
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/no-non-null-assertion": "off",
+    "@typescript-eslint/no-unused-vars": "off",
+    "@typescript-eslint/no-use-before-define": "off",
+    "@typescript-eslint/no-var-requires": "off",
+    "@typescript-eslint/no-this-alias": "off",
+    "no-console": "warn",
+    "no-shadow": "off",
+    "@typescript-eslint/no-shadow": ["error"],
+    "prettier/prettier": "warn"
   }
 }

.git-blame-ignore-revs

@@ -0,0 +1,2 @@
+# Update Prettier configuration
+e0b6f19c6f75c12997143be739be81f6b4898357

.github/workflows/ci.yml

@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - main
+      - next
   pull_request:
 
 jobs:
@@ -12,7 +13,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest]
-        node_version: [12, 14, 16]
+        node_version: [14, 16]
         include:
           - os: windows-latest
             node_version: 16

.github/workflows/format.yml

@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - main
+      - next
 
 env:
   node_version: 14

.github/workflows/prerelease.yml

@@ -0,0 +1,36 @@
+name: PreRelease
+
+on:
+  push:
+    branches:
+      - next
+
+jobs:
+  release:
+    name: PreRelease
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out branch
+        uses: actions/checkout@v2
+        with:
+          fetch-depth: 0 # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits
+
+      - name: Set up Node.js 14.x
+        uses: actions/setup-node@v2
+        with:
+          node-version: 14.x
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile --ignore-engines
+        env:
+          CI: true
+
+      - name: Create Release Pull Request or Publish to npm
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          # This expects you to have a script called release which does a build for your packages and calls changeset publish
+          publish: yarn release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -1,2 +1,4 @@
 node_modules
-dist
+dist
+.DS_Store
+*.log

.prettierignore

@@ -1,2 +1,3 @@
 test/fixtures/**/*.md
-test/fixtures/**/*.astro
+test/fixtures/**/*.astro
+**/dist

.prettierrc.json

@@ -1,7 +1,16 @@
 {
-  "printWidth": 180,
+  "printWidth": 100,
   "semi": true,
   "singleQuote": true,
   "tabWidth": 2,
-  "trailingComma": "es5"
+  "trailingComma": "es5",
+  "useTabs": true,
+  "overrides": [
+    {
+      "files": [".*", "*.json", "*.md", "*.toml", "*.yml"],
+      "options": {
+        "useTabs": false
+      }
+    }
+  ]
 }

.vscode/extensions.json

@@ -0,0 +1,7 @@
+{
+  "recommendations": [
+    "esbenp.prettier-vscode",
+    "dbaeumer.vscode-eslint",
+    "EditorConfig.EditorConfig"
+  ]
+}

CHANGELOG.md

@@ -1,5 +1,11 @@
 # prettier-plugin-astro
 
+## 0.1.0
+
+### Minor Changes
+
+- 054d055: Migrate to new compiler. This took months of work, and some things might be broken for the time being. However, it should be a major improvement in most cases over the previous version. We hope you'll like it!
+
 ## 0.0.12
 
 ### Patch Changes

CONTRIBUTING.md

@@ -0,0 +1,25 @@
+# Contributing
+
+## To get set up
+
+1. `git clone git@github.com:withastro/prettier-plugin-astro.git`
+1. `yarn`
+1. `yarn build`
+1. Run [tests](https://vitest.dev/guide/) with `yarn test` or `yarn test:w` for watch mode
+1. Lint code with `yarn lint`
+1. Format code with `yarn format`
+1. Run `yarn changeset` to add your changes to the changelog on version bump.
+   Most changes to the plugin should be `patch` changes while we're before `1.0.0`.
+
+## Notes
+
+1. A single test file can be run with `yarn test *file-name*`
+1. To skip one or more tests in a file, add comments to them individually
+1. Watch mode won't rerun tests when changing an input/output file
+
+## Resources for contributing
+
+- [Prettier rationale](https://prettier.io/docs/en/rationale.html)
+- [Prettier plugin docs](https://prettier.io/docs/en/plugins.html)
+- [Svelte Prettier plugin](https://github.com/sveltejs/prettier-plugin-svelte)
+- [Prettier HTML formatter](https://github.com/prettier/prettier/tree/main/src/language-html)

README.md

@@ -1,33 +1,164 @@
-# Beta Prettier Plugin for [Astro](https://github.com/withastro/astro)
+# [Prettier](https://prettier.io/) Plugin for [Astro](https://astro.build/)
 
-## Install [prettier-plugin-astro](https://www.npmjs.com/package/prettier-plugin-astro)
+Official Prettier plugin adding support for formatting `.astro` files
 
-1. `yarn add --dev prettier-plugin-astro` or `npm i -D prettier-plugin-astro`
-1. `yarn prettier .` to check your formatting / `yarn prettier -w .` to fix your formatting.
-1. Add
+## Installation
+
+```shell
+npm i --save-dev prettier-plugin-astro prettier
+```
+
+To customize formatting behavior, see the [Configuration](#configuration) section below
+
+## Using with the Prettier CLI
+
+When using the CLI, Prettier will automatically pick up the plugin
+
+```shell
+prettier -w .
+```
+
+### pnpm support
+
+Due to [an upstream issue in Prettier](https://github.com/prettier/prettier/issues/8056), the `plugin-search-dir` parameter should be set to the current directory when using pnpm or Prettier won't be able to find the plugin automatically
+
+```shell
+prettier -w --plugin-search-dir=. .
+```
+
+## Using in VS Code
+
+First install the [VS Code Prettier extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) and add the following settings to your VS Code configuration so VS Code is aware that Prettier can be used for Astro files:
+
+```json
+{
+  "prettier.documentSelectors": "**/*.astro"
+}
+```
+
+Additionally, you should set Prettier as the default formatter for Astro files or VS Code will ask you to choose a formatter everytime you format since the Astro VS Code extension also includes a formatter for Astro files:
 
 ```json
-"format": "yarn prettier -w .",
+{
+  "[astro]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
+}
 ```
 
-to your `package.json` and create a `.prettierignore` to ignore any files.
+When submitting issues about formatting in VS Code, first make sure you're actually using Prettier to format your files and not the Astro VS Code extension included formatter
+
+### pnpm support
+
+Due to an upstream issue, Prettier inside VS Code isn't able to automatically infer the right parser to use for Astro files when using pnpm
+
+As such, add the following settings to your `.prettierc.js` config file:
+
+```js
+module.exports = {
+  plugins: [require.resolve('prettier-plugin-astro')],
+  overrides: [
+    {
+      files: '*.astro',
+      options: {
+        parser: 'astro',
+      },
+    },
+  ],
+};
+```
+
+The `require.resolve` call can alternatively be changed to a direct path, like such: `plugins: ["./node_modules/prettier-plugin-astro"]` for usage inside a non-JS config file
+
+## Configuration
+
+Most [options from Prettier](https://prettier.io/docs/en/options.html) will work with the plugin and can be set in a [configuration file](https://prettier.io/docs/en/configuration.html) or through [CLI flags](https://prettier.io/docs/en/cli.html).
+
+### Astro Sort Order
+
+Sort order for the markup and styles. Depending on the order, top-level `style` tags will be sorted below or on top of the rest of the template
+
+The format is a string with the words `markup` and `styles` separated by a pipe (`|`)
+
+| Default            | CLI Override                  | API Override               |
+| ------------------ | ----------------------------- | -------------------------- |
+| `markup \| styles` | `--astro-sort-order <string>` | `astroSortOrder: <string>` |
+
+### Astro Allow Shorthand
+
+Set if attributes with the same name as their expression should be formatted to the short form automatically (for example, if enabled `<element name={name} />` will become simply `<element {name} />`)
+
+> Please note that at the time of writing, [the shorthand form is not currently supported inside the Astro VS Code extension](https://github.com/withastro/language-tools/issues/225)
+
+| Default | CLI Override                     | API Override                  |
+| ------- | -------------------------------- | ----------------------------- |
+| `false` | `--astro-allow-shorthand <bool>` | `astroAllowShorthand: <bool>` |
+
+### Example `.prettierrc.js`
+
+```js
+{
+  astroSortOrder: "markup | styles",
+  astroAllowShorthand: false
+}
+```
 
 ## Contributing
 
-To get setup:
+Pull requests of any size and any skill level are welcome, no contribution is too small. Changes to the Astro Prettier Plugin are subject to [Astro Governance](https://github.com/withastro/astro/blob/main/GOVERNANCE.md) and should adhere to the [Astro Style Guide](https://github.com/withastro/astro/blob/main/STYLE_GUIDE.md)
+
+See [CONTRIBUTING.md](./CONTRIBUTING.md) for instructions on how to setup your development environnement
+
+## Sponsors
+
+Astro is generously supported by Netlify, Vercel, and several other amazing organizations.
+
+[❤️ Sponsor Astro! ❤️](https://github.com/withastro/astro/blob/main/FUNDING.md)
+
+### Platinum Sponsors
+
+<table>
+  <tbody>
+    <tr>
+      <td align="center"><a href="https://www.netlify.com/#gh-light-mode-only" target="_blank"><img width="147" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/netlify.svg#gh-light-mode-only" alt="Netlify" /></a><a href="https://www.netlify.com/#gh-dark-mode-only" target="_blank"><img width="147" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/netlify-dark.svg#gh-dark-mode-only" alt="Netlify" />
+      </a></td>
+      <td align="center"><a href="https://www.vercel.com/#gh-light-mode-only" target="_blank"><img width="150" height="34" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/vercel.svg#gh-light-mode-only" alt="Vercel" /></a><a href="https://www.vercel.com/#gh-dark-mode-only"><img width="150" height="34" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/vercel-dark.svg#gh-dark-mode-only" alt="Vercel" />
+      </a></td>
+    </tr>
+  </tbody>
+</table>
+
+### Gold Sponsors
 
-1. `git clone git@github.com:withastro/prettier-plugin-astro.git`
-1. `yarn`
-1. `yarn build`
-1. Run tests with [`yarn test`](https://github.com/avajs/ava/tree/main/docs)
-1. Lint code with `yarn lint`
-1. Format code with `yarn format`
-1. Run `yarn changeset` to add your changes to the changelog on version bump.
-   Most changes to the plugin should be `patch` changes while we're before `1.0.0`.
+<table>
+  <tbody>
+    <tr>
+      <td align="center">
+        <a href="https://divRIOTS.com#gh-light-mode-only" target="_blank">
+        <img width="150" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/divriots.svg#gh-light-mode-only" alt="‹div›RIOTS" />
+        </a>
+        <a href="https://divRIOTS.com#gh-dark-mode-only" target="_blank">
+        <img width="150" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/divriots-dark.svg#gh-dark-mode-only" alt="‹div›RIOTS" />
+        </a>
+      </td>
+      <td align="center">
+        <a href="https://stackupdigital.co.uk/#gh-light-mode-only" target="_blank">
+        <img width="162" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/stackup.svg#gh-light-mode-only" alt="StackUp Digital" />
+        </a>
+        <a href="https://stackupdigital.co.uk/#gh-dark-mode-only" target="_blank">
+        <img width="130" height="32" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/stackup-dark.svg#gh-dark-mode-only" alt="StackUp Digital" />
+        </a>
+      </td>
+    </tr>
+  </tbody>
+</table>
 
-## Resources for contributing
+### Sponsors
 
-- [prettier rationale](https://prettier.io/docs/en/rationale.html)
-- [prettier plugin docs](https://prettier.io/docs/en/plugins.html)
-- [svelte prettier plugin](https://github.com/sveltejs/prettier-plugin-svelte)
-- [prettier html formatter](https://github.com/prettier/prettier/tree/main/src/language-html)
+<table>
+  <tbody>
+    <tr>
+      <td align="center"><a href="https://sentry.io" target="_blank"><img width="147" height="40" src="https://raw.githubusercontent.com/withastro/astro/main/.github/assets/sentry.svg" alt="Sentry" /></a></td><td align="center"><a href="https://qoddi.com" target="_blank"><img width="147" height="40" src="https://devcenter.qoddi.com/wp-content/uploads/2021/11/blog-transparent-logo-1.png" alt="Qoddi App Platform" /></a></td>
+    </tr>
+  </tbody>
+</table>