Upgrade dependencies

package.json

@@ -24,7 +24,7 @@
     ],
     "packages/site/**/*.{ts,tsx}": [
       "yarn workspace site eslint --fix",
-      "yarn workspace site tsatsiki --project tsconfig.json next-env.d.ts declarations.d.ts patches.d.ts",
+      "yarn workspace site tsatsiki --project tsconfig.json next-env.d.ts declarations.d.ts",
       "yarn workspace site prettier"
     ],
     "packages/site/**/*.css": [
@@ -59,16 +59,16 @@
     "release": "yarn test && lerna publish"
   },
   "devDependencies": {
-    "@marcbouchenoire/eslint-config": "^2.4.2",
+    "@marcbouchenoire/eslint-config": "^2.7.0",
     "@marcbouchenoire/prettier-config": "^1.1.0",
-    "@types/node": "^17.0.5",
-    "eslint": "^8.5.0",
+    "@types/node": "^18.0.0",
+    "eslint": "^8.18.0",
     "husky": "4.3.8",
-    "lerna": "^4.0.0",
-    "nano-staged": "^0.5.0",
-    "prettier": "^2.5.1",
+    "lerna": "^5.1.5",
+    "nano-staged": "^0.8.0",
+    "prettier": "^2.7.1",
     "tsatsiki": "^2.0.1",
     "tsm": "^2.2.1",
-    "typescript": "^4.5.4"
+    "typescript": "^4.7.4"
   }
 }

packages/site/.eslintrc.json

@@ -5,6 +5,6 @@
     "@marcbouchenoire/eslint-config/jsdoc"
   ],
   "rules": {
-    "import/no-unresolved": ["error", { "ignore": ["mdast", "unist"] }]
+    "import/no-unresolved": ["error", { "ignore": ["hast", "mdast", "unist"] }]
   }
 }

packages/site/.stylelintrc.json

@@ -4,10 +4,16 @@
     "at-rule-no-unknown": [
       true,
       {
-        "ignoreAtRules": ["tailwind", "apply", "screen", "layer"]
+        "ignoreAtRules": ["tailwind", "apply", "layer"]
       }
     ],
     "declaration-block-trailing-semicolon": null,
+    "function-no-unknown": [
+      true,
+      {
+        "ignoreFunctions": ["screen", "theme"]
+      }
+    ],
     "no-descending-specificity": null
   }
 }

packages/site/package.json

@@ -16,39 +16,40 @@
     "@radix-ui/react-popover": "^0.1.6",
     "clsx": "^1.1.1",
     "colord": "^2.9.2",
-    "framer-motion": "^6.3.0",
-    "hast-util-find-and-replace": "^4.0.0",
+    "framer-motion": "^6.3.15",
+    "hast-util-find-and-replace": "^4.1.1",
     "mdast-util-to-string": "^3.1.0",
-    "next": "^12.1.5",
-    "next-themes": "^0.1.1",
-    "react": "^18.0.0",
+    "next": "^12.1.6",
+    "next-themes": "^0.2.0",
+    "react": "^18.2.0",
     "react-colorful": "^5.5.1",
-    "react-dom": "^18.0.0",
+    "react-dom": "^18.2.0",
     "rehype-autolink-headings": "^6.1.1",
-    "rehype-prism-plus": "^1.1.3",
+    "rehype-prism-plus": "^1.4.1",
     "rehype-raw": "^6.1.1",
     "rehype-slug": "^5.0.1",
-    "rehype-stringify": "^9.0.2",
+    "rehype-stringify": "^9.0.3",
     "remark-parse": "^10.0.1",
     "remark-rehype": "^10.1.0",
     "symbolist": "^1.2.0",
-    "unified": "^10.1.1",
+    "unified": "^10.1.2",
     "unist-util-remove": "^3.1.0",
     "unist-util-select": "^4.0.1"
   },
   "devDependencies": {
-    "@marcbouchenoire/stylelint-config": "^1.2.0",
-    "@tailwindcss/typography": "^0.5.0",
+    "@marcbouchenoire/stylelint-config": "^1.4.0",
+    "@tailwindcss/typography": "^0.5.2",
+    "@types/hast": "^2.3.4",
     "@types/mdast": "^3.0.10",
-    "@types/react": "^18.0.5",
-    "@types/react-dom": "^18.0.0",
+    "@types/react": "^18.0.14",
+    "@types/react-dom": "^18.0.5",
     "@types/unist": "^2.0.6",
-    "autoprefixer": "^10.4.1",
-    "postcss": "^8.4.5",
-    "postcss-nesting": "^10.1.0",
-    "prettier-plugin-tailwindcss": "^0.1.3",
-    "stylelint": "^14.2.0",
-    "tailwindcss": "^3.0.8",
+    "autoprefixer": "^10.4.7",
+    "postcss": "^8.4.14",
+    "postcss-nesting": "^10.1.9",
+    "prettier-plugin-tailwindcss": "^0.1.11",
+    "stylelint": "^14.9.1",
+    "tailwindcss": "^3.1.4",
     "write-json-file": "^5.0.0"
   }
 }

packages/site/src/components/sections/Introduction.tsx

@@ -81,7 +81,7 @@ export function Introduction({ features, className, ...props }: Props) {
           <span>View on GitHub</span>
         </a>
         <button
-          className="group hover:bg-primary-500/20 dark:hover:bg-primary-400/30 focusable text-primary-500 bg-primary-500/10 dark:bg-primary-400/20 dark:text-primary-400 flex w-full flex-none cursor-pointer items-center justify-center gap-2 rounded-md py-2 px-2.5 font-mono text-sm transition sm:w-auto"
+          className="hover:bg-primary-500/20 dark:hover:bg-primary-400/30 focusable text-primary-500 bg-primary-500/10 dark:bg-primary-400/20 dark:text-primary-400 group flex w-full flex-none cursor-pointer items-center justify-center gap-2 rounded-md py-2 px-2.5 font-mono text-sm transition sm:w-auto"
           onClick={handleClipboardClick}
           type="button"
         >

packages/site/src/pages/index.tsx

@@ -7,7 +7,7 @@ import rehypeSlug from "rehype-slug"
 import rehypeStringify from "rehype-stringify"
 import remarkParse from "remark-parse"
 import remarkRehype from "remark-rehype"
-import { unified } from "unified"
+import { Plugin, unified } from "unified"
 import { Introduction } from "../components/sections/Introduction"
 import { Symbols } from "../components/sections/Symbols"
 import rehypeRemoveImages from "../plugins/rehype/remove-images"
@@ -51,14 +51,14 @@ export default Page
 
 export const getStaticProps: GetStaticProps<Props> = async () => {
   const file = await readFile("../../packages/symbolist/README.md")
-  const processor = unified().use(remarkParse)
+  const processor = unified().use(remarkParse as Plugin)
 
   const features = await processor()
     .use(remarkFindNode, "list")
     .use(remarkRehype, { allowDangerousHtml: true })
     .use(rehypeRaw)
     .use(rehypeSlug)
-    .use(rehypeStringify)
+    .use(rehypeStringify as Plugin)
     .process(file)
 
   const content = await processor()
@@ -70,7 +70,7 @@ export const getStaticProps: GetStaticProps<Props> = async () => {
     .use(rehypeSlug)
     .use(rehypeAutolinkHeadings, { content: [] })
     .use(rehypeWrapSymbols)
-    .use(rehypeStringify)
+    .use(rehypeStringify as Plugin)
     .process(file)
 
   return {

packages/site/src/plugins/rehype/wrap-symbols.ts

@@ -1,19 +1,24 @@
-import { Content, Node, findAndReplace } from "hast-util-find-and-replace"
+import { Content, Root } from "hast"
+import { findAndReplace } from "hast-util-find-and-replace"
 import { Plugin } from "unified"
 
 /**
  * A plugin to wrap all SF Symbols within `span` elements with a `data-symbol` attribute.
  */
 const wrapSymbols: Plugin<[]> = () => {
   return (tree) => {
-    findAndReplace(tree as Node, /[\u{100000}-\u{10FFFF}]/gmu, (symbol) => {
-      return {
-        type: "element",
-        tagName: "span",
-        properties: { "data-symbol": true },
-        children: [{ type: "text", value: symbol }]
-      } as Content
-    })
+    findAndReplace(
+      tree as Root,
+      /[\u{100000}-\u{10FFFF}]/gmu,
+      (symbol: string) => {
+        return {
+          type: "element",
+          tagName: "span",
+          properties: { "data-symbol": true },
+          children: [{ type: "text", value: symbol }]
+        } as Content
+      }
+    )
   }
 }
 

packages/site/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "extends": "../../tsconfig",
-  "include": ["next-env.d.ts", "declarations.d.ts", "patches.d.ts", "src"],
+  "include": ["next-env.d.ts", "declarations.d.ts", "src"],
   "compilerOptions": {
     "allowJs": true,
     "resolveJsonModule": true,

packages/symbolist/package.json

@@ -45,17 +45,17 @@
   },
   "devDependencies": {
     "@types/listr": "^0.14.4",
-    "@types/prettier": "^2.4.2",
+    "@types/prettier": "^2.6.3",
     "@types/write-file-atomic": "^4.0.0",
     "app-exists": "^2.1.1",
     "clipboardy": "^3.0.0",
     "listr": "^0.14.3",
     "listr-input": "^0.2.1",
-    "microbundle": "^0.14.2",
+    "microbundle": "^0.15.0",
     "nyc": "^15.1.0",
     "picocolors": "^1.0.0",
-    "uvu": "^0.5.2",
-    "write-file-atomic": "^4.0.0",
+    "uvu": "^0.5.4",
+    "write-file-atomic": "^4.0.1",
     "write-json-file": "^5.0.0"
   }
 }