Add aurelia 2 (#164)

* add aurelia 2

* remove template from au2

content/1-reactivity/1-declare-state/aurelia2/name.html

@@ -0,0 +1 @@
+<h1>Hello ${name}</h1>

content/1-reactivity/1-declare-state/aurelia2/name.ts

@@ -0,0 +1,3 @@
+export class Name {
+  name = "John";
+}

content/1-reactivity/2-update-state/aurelia2/name.html

@@ -0,0 +1 @@
+<h1>Hello ${name}</h1>

content/1-reactivity/2-update-state/aurelia2/name.ts

@@ -0,0 +1,7 @@
+export class Name {
+  name = "John";
+
+  constructor() {
+    this.name = "Jane";
+  }
+}

content/1-reactivity/3-computed-state/aurelia2/double-count.html

@@ -0,0 +1 @@
+<div>${doubleCount}</div>

content/1-reactivity/3-computed-state/aurelia2/double-count.ts

@@ -0,0 +1,4 @@
+export class DoubleCount {
+  count: number = 10;
+  doubleCount = this.count * 2;
+}

content/2-templating/1-minimal-template/aurelia2/hello-world.html

@@ -0,0 +1 @@
+<h1>Hello world</h1>

content/2-templating/2-styling/aurelia2/css-style.css

@@ -0,0 +1,3 @@
+.title {
+  color: red;
+}

content/2-templating/2-styling/aurelia2/css-style.html

@@ -0,0 +1,2 @@
+<h1 class="title">I am red</h1>
+<button style="font-size: 10rem">I am a button</button>

content/2-templating/3-loop/aurelia2/colors.html

@@ -0,0 +1,3 @@
+<ul>
+  <li repeat.for="color of colors">${color}</li>
+</ul>

content/2-templating/3-loop/aurelia2/colors.ts

@@ -0,0 +1,3 @@
+export class Colors {
+  colors = ["red", "green", "blue"];
+}

content/2-templating/4-event-click/aurelia2/counter.html

@@ -0,0 +1,2 @@
+<p>Counter: ${count}</p>
+<button click.trigger="incrementCount">+1</button>

content/2-templating/4-event-click/aurelia2/counter.ts

@@ -0,0 +1,7 @@
+export class Counter {
+  count: number = 0;
+
+  incrementCount() {
+    this.count++;
+  }
+}

content/2-templating/5-dom-ref/aurelia2/input-focused.html

@@ -0,0 +1 @@
+<input ref="inputElement" />

content/2-templating/5-dom-ref/aurelia2/input-focused.ts

@@ -0,0 +1,7 @@
+export class InputFocused {
+  inputElement: HTMLInputElement;
+
+  attached() {
+    this.inputElement.focus();
+  }
+}

content/2-templating/6-conditional/aurelia2/traffic-light.html

@@ -0,0 +1,8 @@
+<button click.trigger="nextLight()">Next light</button>
+<p>Light is: ${light}</p>
+<p switch.bind="light">
+  You must
+  <span case="red">STOP</span>
+  <span case="orange">SLOW DOWN</span>
+  <span case="green">GO</span>
+</p>

content/2-templating/6-conditional/aurelia2/traffic-light.ts

@@ -0,0 +1,16 @@
+const TRAFFIC_LIGHTS = ["red", "orange", "green"];
+
+export class App {
+  lightIndex = 0;
+  get light() {
+    return TRAFFIC_LIGHTS[this.lightIndex];
+  }
+
+  nextLight() {
+    if (this.lightIndex + 1 > TRAFFIC_LIGHTS.length - 1) {
+      this.lightIndex = 0;
+    } else {
+      this.lightIndex++;
+    }
+  }
+}

content/3-lifecycle/1-on-mount/aurelia2/page-title.html

@@ -0,0 +1 @@
+<p>Page title is: ${pageTitle}</p>

content/3-lifecycle/1-on-mount/aurelia2/page-title.ts

@@ -0,0 +1,7 @@
+export class PageTitle {
+  pageTitle = "";
+
+  attached(): void {
+    this.pageTitle = document.title;
+  }
+}

content/3-lifecycle/2-on-unmount/aurelia2/time.html

@@ -0,0 +1 @@
+<p>Current time: ${time}</p>

content/3-lifecycle/2-on-unmount/aurelia2/time.ts

@@ -0,0 +1,14 @@
+export class Time {
+  time: string = new Date().toLocaleTimeString();
+  timer: number;
+
+  constructor() {
+    this.timer = setInterval(() => {
+      this.time = new Date().toLocaleTimeString();
+    }, 1000);
+  }
+
+  dispose() {
+    clearInterval(this.timer);
+  }
+}

content/4-component-composition/1-props/aurelia2/app.html

@@ -0,0 +1,6 @@
+<user-profile
+  name.bind
+  age.bind
+  favourite-colors.bind="colors"
+  is-available.bind="available"
+></user-profile>

content/4-component-composition/1-props/aurelia2/app.ts

@@ -0,0 +1,9 @@
+import { UserProfile } from "./user-profile";
+
+export class App {
+  static dependencies = [UserProfile]; // static dependecies way or registered globablly
+  age = 20;
+  name = "John";
+  colors = ["green", "blue", "red"];
+  available = false;
+}

content/4-component-composition/1-props/aurelia2/user-profile.html

@@ -0,0 +1,4 @@
+<p>My name is ${name}</p>
+<p>My age is ${age}</p>
+<p>My favourite colors are ${favouriteColors.join(", ")}</p>
+<p>I am ${isAvailable ? "available" : "not available"}</p>

content/4-component-composition/1-props/aurelia2/user-profile.ts

@@ -0,0 +1,8 @@
+import { bindable } from "aurelia";
+
+export class UserProfile {
+  @bindable name = "";
+  @bindable age = null;
+  @bindable favouriteColors = [];
+  @bindable isAvailable = true;
+}

content/4-component-composition/2-emit-to-parent/aurelia2/answer-button.html

@@ -0,0 +1,2 @@
+<button click.trigger="actionHandler(true)">YES</button>
+<button click.trigger="actionHandler()">NO</button>

content/4-component-composition/2-emit-to-parent/aurelia2/answer-button.ts

@@ -0,0 +1,5 @@
+import { bindable } from "aurelia";
+
+export class AnswerButton {
+  @bindable actionHandler;
+}

content/4-component-composition/2-emit-to-parent/aurelia2/app.html

@@ -0,0 +1,3 @@
+<p>Can I come ?</p>
+<answer-button action-handler.bind="handleAnswer"></answer-button>
+<p style="font-size: 50px">${canCome ? "😀" : "😥"}</p>

content/4-component-composition/2-emit-to-parent/aurelia2/app.ts

@@ -0,0 +1,7 @@
+export class App {
+  canCome = false;
+
+  handleAnswer = (answer = false) => {
+    this.canCome = answer;
+  };
+}

content/4-component-composition/3-slot/aurelia2/app.html

@@ -0,0 +1 @@
+<funny-button>Click me !</funny-button>

content/4-component-composition/3-slot/aurelia2/funny-button.html

@@ -0,0 +1,19 @@
+<let
+  style="
+    color: #fff;
+    padding: 10px 20px;
+    font-size: 30px;
+    border: 2px solid #fff;
+    margin: 8px;
+    transform: scale(0.9);
+    box-shadow: 4px 4px rgba(0, 0, 0, 0.4);
+    transition: transform 0.2s cubic-bezier(0.34, 1.65, 0.88, 0.925) 0s;
+    outline: 0;
+    background: rgba(0, 0, 0, 0.4);
+  "
+>
+</let>
+
+<button style.bind="style">
+  <au-slot></au-slot>
+</button>

content/4-component-composition/4-slot-fallback/aurelia2/app.html

@@ -0,0 +1,2 @@
+<funny-button></funny-button>
+<funny-button>Click me !</funny-button>

content/4-component-composition/4-slot-fallback/aurelia2/funny-button.html

@@ -0,0 +1,19 @@
+<let
+  style="
+    background: rgba(0, 0, 0, 0.4);
+    color: #fff;
+    padding: 10px 20px;
+    font-size: 30px;
+    border: 2px solid #fff;
+    margin: 8px;
+    transform: scale(0.9);
+    box-shadow: 4px 4px rgba(0, 0, 0, 0.4);
+    transition: transform 0.2s cubic-bezier(0.34, 1.65, 0.88, 0.925) 0s;
+    outline: 0;
+  "
+>
+</let>
+
+<button style.bind="style">
+  <au-slot> No content </au-slot>
+</button>

content/4-component-composition/5-context/aurelia2/app.html

@@ -0,0 +1,2 @@
+<h1>Welcome back, {{ user.username }}</h1>
+<user-profile />

content/4-component-composition/5-context/aurelia2/app.ts

@@ -0,0 +1,5 @@
+import { user } from "./user-profile";
+
+export class App {
+  user = user;
+}

content/4-component-composition/5-context/aurelia2/user-profile.html

@@ -0,0 +1,8 @@
+<div>
+  <h2>My Profile</h2>
+  <p>Username: ${ user.username }</p>
+  <p>Email: ${ user.email }</p>
+  <button click.trigger="user.username = 'Jane'">
+    Update username to Jane
+  </button>
+</div>

content/4-component-composition/5-context/aurelia2/user-profile.ts

@@ -0,0 +1,9 @@
+export const user = {
+  id: 1,
+  username: "unicorn42",
+  email: "unicorn42@example.com",
+};
+
+export class UserProfile {
+  user = user;
+}

content/6-form-input/1-input-text/aurelia2/input-hello.html

@@ -0,0 +1,2 @@
+<p>${text}</p>
+<input value.bind />

content/6-form-input/1-input-text/aurelia2/input-hello.ts

@@ -0,0 +1,3 @@
+export class InputHello {
+  value: string = "Hello World";
+}

content/6-form-input/2-checkbox/aurelia2/is-available.html

@@ -0,0 +1,2 @@
+<input id="is-available" type="checkbox" checked.bind="isAvailable" />
+<label for="is-available">Is available</label>: ${isAvailable}

content/6-form-input/2-checkbox/aurelia2/is-available.ts

@@ -0,0 +1,3 @@
+export class IsAvailable {
+  isAvailable = false;
+}

content/6-form-input/3-radio/aurelia2/pick-pill.html

@@ -0,0 +1,7 @@
+<div>Picked: ${picked}</div>
+
+<input id="blue-pill" checked.bind="picked" type="radio" value="blue" />
+<label for="blue-pill">Blue pill</label>
+
+<input id="red-pill" checked.bind="picked" type="radio" value="red" />
+<label for="red-pill">Red pill</label>

content/6-form-input/3-radio/aurelia2/pick-pill.ts

@@ -0,0 +1,3 @@
+export class PickPill {
+  picked = "red";
+}

content/6-form-input/4-select/aurelia2/color-select.html

@@ -0,0 +1,10 @@
+<select value.bind="selectedColorId">
+  <option value="">Select A Color</option>
+  <option
+    repeat.for="color of colors"
+    value.bind="color.id"
+    disabled.bind="color.isDisabled"
+  >
+    ${color.text}
+  </option>
+</select>

content/6-form-input/4-select/aurelia2/color-select.ts

@@ -0,0 +1,11 @@
+const colors = [
+  { id: 1, text: "red" },
+  { id: 2, text: "blue" },
+  { id: 3, text: "green" },
+  { id: 4, text: "gray", isDisabled: true },
+];
+
+export class Select {
+  selectedColorId = 2;
+  colors = colors;
+}

content/7-webapp-features/1-render-app/aurelia2/app.html

@@ -0,0 +1 @@
+<h1>Hello world</h1>

content/7-webapp-features/1-render-app/aurelia2/app.ts

@@ -0,0 +1 @@
+export class App {}

content/7-webapp-features/1-render-app/aurelia2/index.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script type="module" src="./main.ts"></script>
+  </head>
+
+  <body>
+    <app></app>
+  </body>
+</html>

content/7-webapp-features/1-render-app/aurelia2/main.ts

@@ -0,0 +1,4 @@
+import { Aurelia } from "aurelia";
+import { App } from "./app";
+
+Aurelia.app(App).start();

content/7-webapp-features/2-fetch-data/aurelia2/UseFetchUsers.ts

@@ -0,0 +1,19 @@
+export class UseFetchUsers {
+  data = null;
+  error = null;
+  isLoading = false;
+
+  async fetchData() {
+    this.isLoading = true;
+    try {
+      const response = await fetch("https://randomuser.me/api/?results=3");
+      const { results: users } = await response.json();
+      this.data = users;
+      this.error = null;
+    } catch (err) {
+      this.data = null;
+      this.error = err;
+    }
+    this.isLoading = false;
+  }
+}

content/7-webapp-features/2-fetch-data/aurelia2/app.html

@@ -0,0 +1,10 @@
+<template promise.bind="useFetchUsers.fetchData()">
+  <p pending>Fetching users...</p>
+  <p catch>An error ocurred while fetching users</p>
+  <ul then.from-view="users">
+    <li repeat.for="user of users">
+      <img src.bind="user.picture.thumbnail" alt="user" />
+      <p>${ user.name.first } ${ user.name.last }</p>
+    </li>
+  </ul>
+</template>

content/7-webapp-features/2-fetch-data/aurelia2/app.ts

@@ -0,0 +1,6 @@
+import { UseFetchUsers } from "./UseFetchUsers";
+
+export class App {
+  // eslint-disable-next-line no-unused-vars
+  constructor(private useFetchUsers: UseFetchUsers) {}
+}

content/7-webapp-features/3-router-link/aurelia2/router-link.md

@@ -0,0 +1,12 @@
+See [Add routes and a viewport](https://docs.aurelia.io/routing/router-tutorial#add-routes-and-a-viewport)
+
+```html
+<ul>
+  <li>
+    <a load="/home">Home</a>
+  </li>
+  <li>
+    <a load="/about">About</a>
+  </li>
+</ul>
+```

content/7-webapp-features/4-routing/aurelia2/app.ts

@@ -0,0 +1,8 @@
+export class App {
+  static routes = [
+    {
+      path: ["", "home"],
+    },
+  ];
+  static template = "<au-viewport></au-viewport>";
+}

frameworks.mjs

@@ -264,4 +264,29 @@ export default [
       return sortAllFilenames(files, ["app.html", "app.ts"]);
     },
   },
+  {
+    id: "aurelia2",
+    title: "Aurelia 2",
+    img: "framework/aurelia.svg",
+    eslint: {
+      env: {
+        browser: true,
+        es2021: true,
+        node: true,
+      },
+      parser: "@typescript-eslint/parser",
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      files: ["**/aurelia2/**"],
+      extends: ["eslint:recommended"],
+    },
+    playgroundURL: "https://stackblitz.com/edit/au2-conventions?file=src%2Fmy-app.html",
+    documentationURL: "http://docs.aurelia.io",
+    filesSorter(files) {
+      return sortAllFilenames(files, ["app.html", "app.ts"]);
+    },
+  },
 ];

package.json

@@ -35,6 +35,8 @@
     "@typescript-eslint/eslint-plugin": "^5.48.0",
     "@typescript-eslint/parser": "^5.48.0",
     "aurelia-framework": "^1.4.1",
+    "aurelia": "latest",
+    "@aurelia/router": "latest",
     "autoprefixer": "^10.4.13",
     "chokidar": "^3.5.3",
     "codesandbox": "^2.2.3",

pnpm-lock.yaml

@@ -4,6 +4,7 @@ specifiers:
   '@angular-eslint/eslint-plugin': ^15.1.0
   '@angular-eslint/eslint-plugin-template': ^15.1.0
   '@angular-eslint/template-parser': ^15.1.0
+  '@aurelia/router': latest
   '@babel/core': ^7.20.12
   '@babel/eslint-parser': ^7.19.1
   '@babel/plugin-proposal-decorators': ^7.20.7
@@ -14,6 +15,7 @@ specifiers:
   '@typescript-eslint/eslint-plugin': ^5.48.0
   '@typescript-eslint/parser': ^5.48.0
   '@veljs/svelte': ^0.1.11
+  aurelia: latest
   aurelia-framework: ^1.4.1
   autoprefixer: ^10.4.13
   chokidar: ^3.5.3
@@ -65,6 +67,7 @@ devDependencies:
   '@angular-eslint/eslint-plugin': 15.1.0_iukboom6ndih5an6iafl45j2fe
   '@angular-eslint/eslint-plugin-template': 15.1.0_iukboom6ndih5an6iafl45j2fe
   '@angular-eslint/template-parser': 15.1.0_iukboom6ndih5an6iafl45j2fe
+  '@aurelia/router': 2.0.0-beta.4
   '@babel/core': 7.20.12
   '@babel/eslint-parser': 7.19.1_ucmnolur3r335ullwiyt3zl3pi
   '@babel/plugin-proposal-decorators': 7.20.7_@babel+core@7.20.12
@@ -74,6 +77,7 @@ devDependencies:
   '@tailwindcss/typography': 0.5.8_tailwindcss@3.2.4
   '@typescript-eslint/eslint-plugin': 5.48.0_k73wpmdolxikpyqun3p36akaaq
   '@typescript-eslint/parser': 5.48.0_iukboom6ndih5an6iafl45j2fe
+  aurelia: 2.0.0-beta.4
   aurelia-framework: 1.4.1
   autoprefixer: 10.4.13_postcss@8.4.21
   chokidar: 3.5.3
@@ -186,6 +190,77 @@ packages:
       - supports-color
     dev: true
 
+  /@aurelia/fetch-client/2.0.0-beta.4:
+    resolution: {integrity: sha512-0YyGVXNSUquCeJjb1PxGm4ZNnd5YtuHyHm0DwULSidwuVL+WBBLOJ1X2hGOeRY1rvkZBO6GI3pK6qrLo5YNbsg==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/kernel': 2.0.0-beta.4
+      '@aurelia/metadata': 2.0.0-beta.4
+    dev: true
+
+  /@aurelia/kernel/2.0.0-beta.4:
+    resolution: {integrity: sha512-1iFP43+3UyW+jyibaT7tmdx25nyn9yw/AC0n0ERWxbORX1pT9QmdUrdTwm5SivBTtvNbBif7MiP/TVvpzTUBkQ==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/metadata': 2.0.0-beta.4
+      '@aurelia/platform': 2.0.0-beta.4
+    dev: true
+
+  /@aurelia/metadata/2.0.0-beta.4:
+    resolution: {integrity: sha512-PQHpK64bYAvcugn5f5j8QAOUszWwOdb/TWrWm05ATVzlwIZz7CZYXZPVsRHn6soS4KlMlcBhjDrOstIqGtsBxw==}
+    engines: {node: '>=14.17.0'}
+    dev: true
+
+  /@aurelia/platform-browser/2.0.0-beta.4:
+    resolution: {integrity: sha512-jnwIpMy44MI6d6XrfBB04k+Di5KDTcU5kKkTu2sGIxPlUnKWQFmq1XeQ+y+ZuSkTM0JV9W1b6NMnBqlOJCS62g==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/platform': 2.0.0-beta.4
+    dev: true
+
+  /@aurelia/platform/2.0.0-beta.4:
+    resolution: {integrity: sha512-Y6sMgAMxefv9vXgyMGto16kZyuYnevmvTO0Uz7ceWROaGOKZ3UH6tEQHc3ImxDtlKow7nUZwZ+uuJ64IIGzq9A==}
+    engines: {node: '>=14.17.0'}
+    dev: true
+
+  /@aurelia/route-recognizer/2.0.0-beta.4:
+    resolution: {integrity: sha512-jWOC0gjQRCyW/3qXiMkZPPExp1/uth/x8oxYBRwSs6hmHEJRau+a97GQDs05YMwVvKmigA8vutcdcGX3teTI9A==}
+    engines: {node: '>=14.17.0'}
+    dev: true
+
+  /@aurelia/router/2.0.0-beta.4:
+    resolution: {integrity: sha512-EHRCEKmIi6jjRG9LotZVIhwtIBp9ZqYetWRAHdpPD/u+NWY64GcFLkkL7/nVFOPvYZ5vCnzTBbGiueb/iLMBzg==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/kernel': 2.0.0-beta.4
+      '@aurelia/metadata': 2.0.0-beta.4
+      '@aurelia/platform': 2.0.0-beta.4
+      '@aurelia/platform-browser': 2.0.0-beta.4
+      '@aurelia/route-recognizer': 2.0.0-beta.4
+      '@aurelia/runtime': 2.0.0-beta.4
+      '@aurelia/runtime-html': 2.0.0-beta.4
+    dev: true
+
+  /@aurelia/runtime-html/2.0.0-beta.4:
+    resolution: {integrity: sha512-JP+5cm/q+iwvcSwN84aCLqkvXmuEFNCvWuGPFYw1yf9upRviufxPzebAqpGKhqtTHDXhA7FG8S4x0C1HKczn4A==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/kernel': 2.0.0-beta.4
+      '@aurelia/metadata': 2.0.0-beta.4
+      '@aurelia/platform': 2.0.0-beta.4
+      '@aurelia/platform-browser': 2.0.0-beta.4
+      '@aurelia/runtime': 2.0.0-beta.4
+    dev: true
+
+  /@aurelia/runtime/2.0.0-beta.4:
+    resolution: {integrity: sha512-+qt/j9mhi8a73q/ItAinr3dUXqM/YzLa8jZRaT91SKaOQjbgL8o2TzgvDjvPvKZk2XAZaOIVt8vBT7YNAqcY0Q==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/kernel': 2.0.0-beta.4
+      '@aurelia/metadata': 2.0.0-beta.4
+      '@aurelia/platform': 2.0.0-beta.4
+    dev: true
+
   /@babel/code-frame/7.18.6:
     resolution: {integrity: sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==}
     engines: {node: '>=6.9.0'}
@@ -1573,6 +1648,19 @@ packages:
       aurelia-task-queue: 1.3.3
     dev: true
 
+  /aurelia/2.0.0-beta.4:
+    resolution: {integrity: sha512-GmBs1bDFEXAyKbqdjV3M6rg5mJLFEMSQEL2fuuoAKbPRV9gtU7qVRPMB+vkmwR6sXYgp/rbjKVW2oTdd8umMFA==}
+    engines: {node: '>=14.17.0'}
+    dependencies:
+      '@aurelia/fetch-client': 2.0.0-beta.4
+      '@aurelia/kernel': 2.0.0-beta.4
+      '@aurelia/metadata': 2.0.0-beta.4
+      '@aurelia/platform': 2.0.0-beta.4
+      '@aurelia/platform-browser': 2.0.0-beta.4
+      '@aurelia/runtime': 2.0.0-beta.4
+      '@aurelia/runtime-html': 2.0.0-beta.4
+    dev: true
+
   /autoprefixer/10.4.13_postcss@8.4.21:
     resolution: {integrity: sha512-49vKpMqcZYsJjwotvt4+h/BCjJVnhGwcLpDt5xkcaOG3eLrG/HUYLagrihYsQ+qrIBgIzX1Rw7a6L8I/ZA1Atg==}
     engines: {node: ^10 || ^12 || >=14}
@@ -3677,7 +3765,7 @@ packages:
   /heroiconsvelte/0.1.5:
     resolution: {integrity: sha512-OX3QfrT3Vbf8ERh89IxCGcpcK0hU4HhLtkG2WVQKrejuHhJrkvWm0p16LMqtCbvlw3lcaXDMQtwpeDHlr50p1w==}
     dependencies:
-      heroicons: github.com/tailwindlabs/heroicons/1511059c0584aa0d2690cb89c01b183c4ae011d7
+      heroicons: github.com/tailwindlabs/heroicons/af8933a0a08d7b0c6c71bbd42e821273648b9f81
     dev: false
 
   /homedir-polyfill/1.0.3:
@@ -7040,8 +7128,8 @@ packages:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
     dev: true
 
-  github.com/tailwindlabs/heroicons/1511059c0584aa0d2690cb89c01b183c4ae011d7:
-    resolution: {tarball: https://codeload.github.com/tailwindlabs/heroicons/tar.gz/1511059c0584aa0d2690cb89c01b183c4ae011d7}
+  github.com/tailwindlabs/heroicons/af8933a0a08d7b0c6c71bbd42e821273648b9f81:
+    resolution: {tarball: https://codeload.github.com/tailwindlabs/heroicons/tar.gz/af8933a0a08d7b0c6c71bbd42e821273648b9f81}
     name: heroicons
-    version: 2.0.13
+    version: 2.0.17
     dev: false