Update Prettier options

package.json

@@ -22,7 +22,7 @@
   },
   "dependencies": {
     "classnames": "2.2.6",
-    "prettier": "2.2.1",
+    "prettier": "2.4.1",
     "prop-types": "15.7.2",
     "react": "17.0.1",
     "react-dom": "17.0.1",

src/content/extension.js

@@ -12,7 +12,8 @@ const STACKEXCHANGE_SITES = [
   "https://superuser.com",
 ];
 const STACKEXCHANGE_URL_REGEX = /^https:\/\/([a-z]+).stackexchange.com/;
-const STACKEXCHANGE_VALID_PATHNAMES = /(^\/questions|\/posts\/\d+\/edit|^\/review)/u;
+const STACKEXCHANGE_VALID_PATHNAMES =
+  /(^\/questions|\/posts\/\d+\/edit|^\/review)/u;
 
 export default class Extension {
   constructor() {
@@ -206,9 +207,8 @@ export default class Extension {
           // Code Blocks
         } else {
           const isCodeBlock = codeBlockRegex.test(firstLine);
-          const isIndentedBlockWithLang = indentedCodeWithLangRegex.test(
-            firstLine
-          );
+          const isIndentedBlockWithLang =
+            indentedCodeWithLangRegex.test(firstLine);
           let codeLines;
 
           if (isCodeBlock) {

src/options/VisualConfig.js

@@ -13,13 +13,13 @@ const fields = [
   },
   {
     description: "Specify the number of spaces per indentation-level.",
-    label: "Tab width",
+    label: "Tab Width",
     name: "tabWidth",
     type: "number",
   },
   {
     description: "Indent lines with tabs instead of spaces.",
-    label: "Use tabs",
+    label: "Tabs",
     name: "useTabs",
     type: "checkbox",
   },
@@ -30,14 +30,32 @@ const fields = [
     type: "checkbox",
   },
   {
-    description: `Use 'single' quotes instead of "double" quotes.`,
-    label: "Use single quotes",
+    description: "Use single quotes instead of double quotes.",
+    label: "Quotes",
     name: "singleQuote",
     type: "checkbox",
   },
   {
-    description: "Print trailing commas wherever possible.",
-    label: "Trailing commas",
+    description: "Change when properties in objects are quoted.",
+    label: "Quote Props",
+    name: "quoteProps",
+    options: [
+      { label: "as-needed", value: "as-needed" },
+      { label: "consistent", value: "consistent" },
+      { label: "preserve", value: "preserve" },
+    ],
+    type: "select",
+  },
+  {
+    description: "Use single quotes instead of double quotes in JSX.",
+    label: "JSX Quotes",
+    name: "jsxSingleQuote",
+    type: "checkbox",
+  },
+  {
+    description:
+      "Print trailing commas wherever possible in multi-line comma-separated syntactic structures. (A single-line array, for example, never gets trailing commas.)",
+    label: "Trailing Commas",
     name: "trailingComma",
     options: [
       { label: "none", value: "none" },
@@ -48,15 +66,14 @@ const fields = [
   },
   {
     description: "Print spaces between brackets in object literals.",
-    label: "Bracket spacing",
+    label: "Bracket Spacing",
     name: "bracketSpacing",
     type: "checkbox",
   },
   {
-    description: `Put the ">" of a multi-line JSX element at the end of the last line
-                  instead of being alone on the next line.`,
-    label: "JSX Brackets",
-    name: "jsxBracketSameLine",
+    description: `Put the ">" of a multi-line HTML (HTML, JSX, Vue, Angular) element at the end of the last line instead of being alone on the next line (does not apply to self closing elements).`,
+    label: "Bracket Line",
+    name: "bracketSameLine",
     type: "checkbox",
   },
   {
@@ -69,6 +86,48 @@ const fields = [
     ],
     type: "select",
   },
+  {
+    description:
+      'By default, Prettier will wrap markdown text as-is since some services use a linebreak-sensitive renderer, e.g. GitHub comment and BitBucket. In some cases you may want to rely on editor/viewer soft wrapping instead, so this option allows you to opt out with "never".',
+    label: "Prose Wrap",
+    name: "proseWrap",
+    options: [
+      { label: "always", value: "always" },
+      { label: "never", value: "never" },
+      { label: "preserve", value: "preserve" },
+    ],
+    type: "select",
+  },
+  {
+    description:
+      "Specify the global whitespace sensitivity for HTML, Vue, Angular, and Handlebars. See whitespace-sensitive formatting for more info.",
+    label: "HTML Whitespace Sensitivity",
+    name: "htmlWhitespaceSensitivity",
+    options: [
+      { label: "css", value: "css" },
+      { label: "strict", value: "strict" },
+      { label: "ignore", value: "ignore" },
+    ],
+    type: "select",
+  },
+  {
+    description:
+      "Whether or not to indent the code inside <script> and <style> tags in Vue files. Some people (like the creator of Vue) don’t indent to save an indentation level, but this might break code folding in your editor.",
+    label: "Vue files script and style tags indentation",
+    name: "vueIndentScriptAndStyle",
+    type: "boolean",
+  },
+  {
+    description:
+      "Control whether Prettier formats quoted code embedded in the file.",
+    label: "Embedded Language Formatting",
+    name: "embeddedLanguageFormatting",
+    options: [
+      { label: "auto", value: "auto" },
+      { label: "off", value: "off" },
+    ],
+    type: "select",
+  },
 ];
 
 const componentMap = {

src/options/options.js

@@ -2,14 +2,20 @@ const defaultOptions = {
   isJsonVisible: false,
   prettierOptions: {
     arrowParens: "always",
+    bracketSameLine: false,
     bracketSpacing: true,
-    jsxBracketSameLine: false,
+    embeddedLanguageFormatting: "auto",
+    htmlWhitespaceSensitivity: "css",
+    jsxSingleQuote: false,
     printWidth: 80,
+    proseWrap: "preserve",
+    quoteProps: "as-needed",
     semi: true,
     singleQuote: false,
     tabWidth: 2,
     trailingComma: "es5",
     useTabs: false,
+    vueIndentScriptAndStyle: false,
   },
 };
 

yarn.lock

@@ -7071,10 +7071,10 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.2.1.tgz#795a1a78dd52f073da0cd42b21f9c91381923ff5"
-  integrity sha512-PqyhM2yCjg/oKkFPtTGUojv7gnZAoG80ttl45O6x2Ug/rMJw4wcc9k6aaf2hibP7BGVCCM33gZoGjyvt9mm16Q==
+prettier@2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.4.1.tgz#671e11c89c14a4cfc876ce564106c4a6726c9f5c"
+  integrity sha512-9fbDAXSBcc6Bs1mZrDYb3XKzDLm4EXXL9sC1LqKP5rZkT6KRr/rf9amVUcODVXgguK/isJz0d0hP72WeaKWsvA==
 
 pretty-error@^2.1.1:
   version "2.1.2"