diff --git a/adev/BUILD.bazel b/adev/BUILD.bazel index efabb43082b8..a0f5864bbd70 100644 --- a/adev/BUILD.bazel +++ b/adev/BUILD.bazel @@ -60,6 +60,7 @@ APPLICATION_DEPS = [ ":node_modules/@lezer/highlight", ":node_modules/@lezer/javascript", ":node_modules/@stackblitz/sdk", + ":node_modules/shiki", ":node_modules/@typescript/vfs", ":node_modules/@webcontainer/api", ":node_modules/@xterm/addon-fit", @@ -91,6 +92,30 @@ APPLICATION_DEPS = [ ":node_modules/crelt", ":node_modules/style-mod", ":node_modules/w3c-keyname", + # + ":node_modules/@shikijs/themes", + ":node_modules/@shikijs/langs", + ":node_modules/@shikijs/engine-oniguruma", + ":node_modules/@shikijs/core", + ":node_modules/@shikijs/engine-javascript", + ":node_modules/@shikijs/types", + ":node_modules/@shikijs/vscode-textmate", + ":node_modules/hast-util-to-html", + # ":node_modules/oniguruma-to-es", + ":node_modules/ccount", + ":node_modules/comma-separated-tokens", + ":node_modules/hast-util-whitespace", + ":node_modules/html-void-elements", + # ":node_modules/oniguruma-parser", + ":node_modules/property-information", + # ":node_modules/regex-recursion", + # ":node_modules/regex", + ":node_modules/space-separated-tokens", + ":node_modules/stringify-entities", + ":node_modules/zwitch", + ":node_modules/character-entities-html4", + ":node_modules/character-entities-legacy", + # ":node_modules/regex-utilities", ] TEST_FILES = APPLICATION_FILES + glob(["src/app/**/*.spec.ts"]) diff --git a/adev/package.json b/adev/package.json index 6bd8217d34ea..eef166bc5bbc 100644 --- a/adev/package.json +++ b/adev/package.json @@ -40,6 +40,13 @@ "@lezer/lr": "1.4.7", "@lezer/sass": "1.1.0", "@marijn/find-cluster-break": "1.0.2", + "@shikijs/core": "^3.21.0", + "@shikijs/engine-javascript": "^3.21.0", + "@shikijs/engine-oniguruma": "^3.21.0", + "@shikijs/langs": "^3.21.0", + "@shikijs/themes": "^3.21.0", + "@shikijs/types": "^3.21.0", + "@shikijs/vscode-textmate": "^10.0.2", "@stackblitz/sdk": "1.11.0", "@types/dom-navigation": "1.0.6", "@types/jasmine": "5.1.15", @@ -51,10 +58,17 @@ "@xterm/xterm": "6.0.0", "algoliasearch": "5.46.3", "angular-split": "20.0.0", + "ccount": "^2.0.1", + "character-entities-html4": "^2.1.0", + "character-entities-legacy": "^3.0.0", + "comma-separated-tokens": "^2.0.3", "crelt": "1.0.6", "diff": "8.0.3", "emoji-regex": "10.6.0", "fflate": "0.8.2", + "hast-util-to-html": "^9.0.5", + "hast-util-whitespace": "^3.0.0", + "html-void-elements": "^3.0.0", "jasmine-core": "5.13.0", "jsdom": "27.4.0", "karma-chrome-launcher": "3.2.0", @@ -69,13 +83,17 @@ "preact": "10.28.2", "preact-render-to-string": "6.6.5", "prettier": "3.7.4", + "property-information": "^7.1.0", "rxjs": "7.8.2", "shiki": "3.21.0", + "space-separated-tokens": "^2.0.2", + "stringify-entities": "^4.0.4", "style-mod": "4.1.3", "tinyglobby": "0.2.15", "tslib": "2.8.1", "typescript": "5.9.3", - "w3c-keyname": "2.2.8" + "w3c-keyname": "2.2.8", + "zwitch": "^2.0.4" }, "devDependencies": { "autoprefixer": "10.4.23", diff --git a/adev/src/app/features/home/code-highlighting/code-highlighter.ts b/adev/src/app/features/home/code-highlighting/code-highlighter.ts new file mode 100644 index 000000000000..4ca1f492fd5c --- /dev/null +++ b/adev/src/app/features/home/code-highlighting/code-highlighter.ts @@ -0,0 +1,33 @@ +import { Injectable, OnDestroy } from '@angular/core'; +import angularTs from '@shikijs/langs/angular-ts'; +import githubDark from '@shikijs/themes/github-dark'; +import githubLight from '@shikijs/themes/github-light'; +import { CodeToHastOptions, createHighlighterCoreSync, HighlighterCore } from 'shiki/core'; +import { createOnigurumaEngine } from 'shiki/engine/oniguruma'; + +@Injectable({providedIn: 'root'}) +export class CodeHighligher implements OnDestroy { + private cachedHighligher: HighlighterCore | undefined; + + async codeToHtml(code: string, options: CodeToHastOptions): Promise { + const highlighter = await this.getHighlighter(); + return highlighter.codeToHtml(code, options); + } + + ngOnDestroy(): void { + this.cachedHighligher?.dispose(); + } + + private async getHighlighter() { + if (!this.cachedHighligher) { + const engine = await createOnigurumaEngine(import('shiki/wasm')); + this.cachedHighligher = createHighlighterCoreSync({ + themes: [githubLight, githubDark], + langs: [angularTs], + engine, + }); + } + + return this.cachedHighligher; + } +} diff --git a/adev/src/app/features/home/components/code-block/code-block.ts b/adev/src/app/features/home/components/code-block/code-block.ts new file mode 100644 index 000000000000..a04a7dff9fdf --- /dev/null +++ b/adev/src/app/features/home/components/code-block/code-block.ts @@ -0,0 +1,15 @@ +import { AsyncPipe } from "@angular/common"; +import { Component, computed, inject, input } from "@angular/core"; +import { CodeHighligher } from "../../code-highlighting/code-highlighter"; + +@Component({ + selector: 'adev-code-block', + template: `
`, + imports: [AsyncPipe], +}) +export class CodeBlock { + codeHighlighter = inject(CodeHighligher); + code = input.required(); + + highlightedCode = computed(() => this.codeHighlighter.codeToHtml(this.code(), { lang: 'typescript', theme: 'github-light' })); +} \ No newline at end of file diff --git a/adev/src/app/features/home/home.component.html b/adev/src/app/features/home/home.component.html index f13d163ce061..e2448a24ee77 100644 --- a/adev/src/app/features/home/home.component.html +++ b/adev/src/app/features/home/home.component.html @@ -1,489 +1,224 @@
-
-
- -

Angular v21 is here!

-

🕹️ Start your adventure

- -
-
- @if (!isUwu) { - -
- - - - - - - - - - - - - - - -

The framework for building scalable web apps with confidence

-
- } @else { - -
- Angular logo +
+
+
+ +

Angular v21 is here!

+

🕹️ Start your adventure

+ + +
+ +
- } -
- - - -
+ @if (!isUwu) { + +
+

Productivity
Meets scalability

+

The framework for building scalable web apps with confidence

+
+ } @else { + +
+ Angular logo +
+ } + +
+ + + +
+
-
-

Productivity meets scalability

-
-
- - - - - - - - - - -

AI-forward

-

Resources and integrations to supercharge your development with AI

-
-
- - - -

Opinionated & versatile

-

Organized yet modular thanks to Angular components and dependency injection

-
-
- - - -

Reactive

-

Fast state updates with fine-grained reactivity based on Angular Signals

+
+

Features that actually
help you solve problems

+ +
+
+
Signals
+
Control Flow
+
Deferrable Views
+
Hydration
-
- - - -

Fully featured

-

- Everything works together with Angular's first-party modules for forms, routing, and more -

+ +
+
+ +
+
+
Signals: Fine-Grained Reactivity
+
+ Type in the search box to filter the list. A + computed signal automatically recalculates the + filteredItems whenever the + searchTerm signal changes. +
+ +
+ +
+ @for (item of filteredItems(); track item) { +
{{ item }}
+ } +
+
+ + +
+ +
+
+
+ component.ts + +
+ 
xxxx
+
+ +
+
+ component.html + +
+ 
xxxx
+
+
+
+ +
+ +
+ +
+
+
Control Flow
+
+ Angular's new control flow syntax makes templates easier to write and understand. +
+
+
+
+ +
+ +
+ +
+
+
Deferrable Views
+
Defer loading of dependencies until they are needed.
+
+
+
+ +
+ +
+ +
+
+
Hydration
+
Non-destructive hydration for faster startup.
+
+
+
+ +
- +
+

Enabling you to build
smarter and faster

+
+
+
+ auto_awesome +
+
+

+ AI-forward resources and integrations to supercharge your development + with AI +

+
+
-
-
-
-

When performance matters

-

- Trusted by millions to build fast, reliable applications that scale with the size of your - team -

-
- - - - -
-

Reactivity with signals makes it a breeze to manage your state

-
- Explore signals - - - - - -
-

- Meet your performance targets with SSR, SSG, hydration, and next generation deferred - loading -

-
- Learn about rendering strategies - +
+
+ grid_view +
+
+

+ Opinionated & versatile, organized yet modular thanks to Angular + components and dependency injection +

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + +
+
+ sensors +
+
+

+ Reactive and fast state updates with fine-grained reactivity based on + Angular Signals +

+
+
+ +
+
+ layers +
+
+

+ Fully featured platform where everything works together with Angular's + first-party modules for forms, routing, and more +

+
- - -
-
-

Want to learn more?

-
- - - - -
-

New to Angular?

-

- Try our completely in browser tutorial lessons designed to give you hands on - experience with Angular. -

-

- Recommended for developers new to Angular looking to dive right into the code -

- Start coding -
- - - - - -
-

More of a reader?

-

- Our essentials guides are designed to help you understand Angular fundamentals in the - time it would take to finish a cup of coffee (or tea). -

-

- Recommended for developers with framework experience but want quick overview of - concepts -

- Angular concepts -
- - - -
-

Why Angular?

-

Learn about Angular, its benefits, and if it's right for you.

-

- Recommended for developers seeking to learn more about the Angular framework -

- About Angular -
- - - - - - - - - -
-

Are you an LLM or curious about AI in Angular?

-

- Head over to our AI section to find prompts, strategies, best practices, examples, and - more. -

-

- Recommended for robots... and developers who want to get the most out of Angular and - AI -

- Angular + AI -
- +
+
+
+
+

Where performance matters

+

+ Trusted by millions to build fast, reliable applications that scale with the size of your + team +

+
+ +
Explore Signals / Rendering Strategies
diff --git a/adev/src/app/features/home/home.component.scss b/adev/src/app/features/home/home.component.scss index 251fb66778cb..5bb5ac0b9371 100644 --- a/adev/src/app/features/home/home.component.scss +++ b/adev/src/app/features/home/home.component.scss @@ -4,106 +4,179 @@ width: 100%; position: relative; display: block; + + --card-background: #121114; + --pattern-url: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'96'%20height%3D'96'%20viewBox%3D'0%200%2096%2096'%3E%3Cdefs%3E%3Cpattern%20id%3D'p'%20patternUnits%3D'userSpaceOnUse'%20width%3D'96'%20height%3D'96'%3E%3Cg%20transform%3D'translate(48%2048)%20rotate(-60)'%3E%3Cline%20x1%3D'-10'%20y1%3D'0'%20x2%3D'10'%20y2%3D'0'%20stroke%3D'white'%20stroke-width%3D'3'%20stroke-linecap%3D'round'%2F%3E%3C%2Fg%3E%3C%2Fpattern%3E%3C%2Fdefs%3E%3Crect%20width%3D'100%25'%20height%3D'100%25'%20fill%3D'url(%23p)'%2F%3E%3C%2Fsvg%3E"); } -.banners-layer { - z-index: 10; +.adev-banner-container { + margin-top: 3rem; + padding: 0 3rem; + display: flex; + justify-content: space-between; + gap: 0.5rem; + top: var(--layout-padding); + left: calc(var(--layout-padding) + var(--primary-nav-width)); + z-index: 1; - .adev-banner-container { - display: flex; - flex-direction: column; - gap: 0.5rem; - position: absolute; - top: var(--layout-padding); - left: calc(var(--layout-padding) + var(--primary-nav-width)); - - @include mq.for-tablet-landscape-down { - top: 6rem; - left: var(--layout-padding); - /* Assuming the container width is identical to the viewport width (mobile device). */ - max-width: calc(100% - var(--layout-padding) * 2); - } + @include mq.for-tablet-landscape-down { + top: 6rem; + left: var(--layout-padding); + /* Assuming the container width is identical to the viewport width (mobile device). */ + max-width: calc(100% - var(--layout-padding) * 2); + } - @include mq.for-phone-only { - & { - top: 5rem; - } + @include mq.for-phone-only { + & { + top: 5rem; } } +} - .adev-banner { - display: flex; - align-items: center; - flex-wrap: wrap; - gap: 0.5rem; - border: 1px solid var(--senary-contrast); - background: var(--page-background); - border-radius: 0.25rem; - padding: 10px; - max-width: 100%; +.adev-banner { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 0.5rem; + border: 1px solid var(--senary-contrast); + background: var(--page-background); + border-radius: 0.25rem; + padding: 10px; + max-width: 100%; + width: fit-content; + box-sizing: border-box; + + h1, + p { + display: inline; + font-size: 0.875rem; + margin: 0; + background-image: var(--red-to-pink-to-purple-horizontal-gradient); + background-clip: text; + color: transparent; width: fit-content; - box-sizing: border-box; - - h1, - p { - display: inline; - font-size: 0.875rem; - margin: 0; - background-image: var(--red-to-pink-to-purple-horizontal-gradient); - background-clip: text; - color: transparent; - width: fit-content; - font-weight: 500; - box-shadow: none; - position: relative; - - &.adev-banner-cta { - color: var(--tertiary-contrast); - - &::after { - content: ''; - position: absolute; - width: 100%; - transform: scaleX(0); - height: 1px; - bottom: -2px; - left: 0; - background: var(--red-to-pink-to-purple-horizontal-gradient); - transform-origin: bottom right; - transition: transform 0.3s ease; - } + font-weight: 500; + box-shadow: none; + position: relative; + + &.adev-banner-cta { + color: var(--tertiary-contrast); + + &::after { + content: ''; + position: absolute; + width: 100%; + transform: scaleX(0); + height: 1px; + bottom: -2px; + left: 0; + background: var(--red-to-pink-to-purple-horizontal-gradient); + transform-origin: bottom right; + transition: transform 0.3s ease; } } + } - &:hover { - .adev-banner-cta { - &::after { - transform: scaleX(1); - transform-origin: bottom left; - } + &:hover { + .adev-banner-cta { + &::after { + transform: scaleX(1); + transform-origin: bottom left; } } } } -.logo-section { +section { + padding-left: 7rem; text-align: center; - background-image: - linear-gradient( - 63deg, - transparent 66%, - var(--page-background) 69%, - var(--page-background) 70%, - transparent 70% - ), - linear-gradient(162deg, var(--page-background) 50%, #9337f58a 100%); - background-size: - 27px 27px, - auto; - background-repeat: repeat; - background-color: transparent; - padding-bottom: 36px; - padding-top: 7rem; +} + +@property --gradient-angle { + syntax: ''; + initial-value: 90deg; + inherits: false; +} + +@keyframes rotateGradient { + from { + --gradient-angle: 0deg; + } + to { + --gradient-angle: 360deg; + } +} + +@property --pulse-inner { + syntax: ''; + initial-value: 20%; + inherits: false; +} + +@property --pulse-outer { + syntax: ''; + initial-value: 75%; + inherits: false; +} + +@keyframes pulse { + 0% { + --pulse-inner: 30%; + --pulse-outer: 75%; + } + 50% { + --pulse-inner: 30%; + --pulse-outer: 60%; + } + 100% { + --pulse-inner: 30%; + --pulse-outer: 75%; + } +} + +.logo-section { + position: relative; + display: flex; + flex-direction: column; + height: min(700px, 100vh); + + .pattern { + pointer-events: none; + position: absolute; + height: 100%; + width: calc(100% - 7rem); + animation: rotateGradient 10s linear infinite; + + background: conic-gradient( + from var(--gradient-angle) at 50% 60%, + #6911d2, + #000, + #f627e3, + #000, + #6911d2 + ); + mask-image: var(--pattern-url); + + mask-size: 22px 22px; + mask-repeat: repeat; + } + + .content { + z-index: 1; + flex: 1; + display: flex; + flex-direction: column; + justify-content: space-between; + + h2 { + font-size: 58pt; + margin-bottom: 0; + } + + h3 { + font-size: 12pt; + } + } @include mq.for-tablet-landscape-down { padding-top: 9rem; @@ -111,6 +184,7 @@ button { font-size: 1.2rem; + margin-bottom: 3rem; @include mq.for-tablet-down { font-size: 1rem; @@ -143,230 +217,340 @@ } } -section { - padding-left: 9rem; - padding-right: 2rem; - +.features-section { h2 { - font-size: 2.5rem; - margin-bottom: 3rem; + font-size: 38pt; } - svg { - fill: var(--always-pink); - color: var(--always-pink); + [ngTabs] { + overflow: hidden; + width: 100%; + border-radius: 0.5rem; + display: flex; + flex-direction: column; } - .section-content { - max-width: 1200px; - margin: 0 auto; + [ngTabList] { + padding: 4px; + display: flex; + gap: 0; + list-style: none; + position: relative; + background: var(--card-background); + border: 1px solid #27272a; + border-radius: 0.5rem; + width: fit-content; + margin: 0 auto 2rem; } - @include mq.for-tablet-landscape-down { - padding-left: 2rem; + [ngTab] { + outline: none; + padding: 10px 20px; + cursor: pointer; + text-align: center; + color: #a1a1aa; + font-size: 14px; + border-radius: 0.5rem; + transition: all 0.2s ease-in-out; + + &:hover { + color: #fff; + } } -} -.features { - padding-block: 2rem; - text-align: center; + [ngTab][aria-selected='true'] { + background-color: #27272a; + color: #fff; + } - h2 { - font-size: 2.2rem; + .sliding-window { + width: 400%; + display: flex; + transition: all 0.2s ease-in-out; } - .features-grid { - display: grid; - grid-template-columns: repeat(4, 1fr); - max-width: 1200px; - margin: 0 auto; + [ngTabList]:has([ngTab]:nth-child(1)[aria-selected='true']) ~ .sliding-window { + transform: translateX(0%); + } + [ngTabList]:has([ngTab]:nth-child(2)[aria-selected='true']) ~ .sliding-window { + transform: translateX(-25%); + } + [ngTabList]:has([ngTab]:nth-child(3)[aria-selected='true']) ~ .sliding-window { + transform: translateX(-50%); + } + [ngTabList]:has([ngTab]:nth-child(4)[aria-selected='true']) ~ .sliding-window { + transform: translateX(-75%); + } - @include mq.for-tablet-down { - grid-template-columns: repeat(2, 1fr); - } + [ngTabPanel] { + display: grid; + place-items: center; + padding: 1rem 3rem; + min-height: 100px; + width: 25%; + box-sizing: border-box; + } +} - @include mq.for-phone-only { - grid-template-columns: 1fr; - } +.two-column-step { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 3rem; + text-align: left; + width: 100%; + max-width: 1200px; + margin: 0 auto; + box-sizing: border-box; + background-color: var(--card-background); + border: 1px solid var(--senary-contrast); + border-radius: 0.5rem; + padding: 2rem; + + @include mq.for-tablet-down { + grid-template-columns: 1fr; + gap: 2rem; + padding: 1.5rem; } +} - .feature { - padding: 2rem; - border-left: 1px solid var(--senary-contrast); +.step-description { + display: flex; + flex-direction: column; + gap: 1.5rem; - &:first-child { - border-left: none; - } + .header { + font-size: 1.75rem; + font-weight: 500; + } - @include mq.for-tablet-down { - border-top: 1px solid var(--senary-contrast); + .description { + font-size: 1.1rem; + line-height: 1.6; + color: var(--secondary-contrast); + + .code { + font-family: monospace; + background: rgba(128, 128, 128, 0.2); + padding: 0.1rem 0.3rem; + border-radius: 0.5rem; + margin: 0 0.1rem; + } + } - &:first { - border-top: none; - } + .demo-display { + background: var(--card-background, #1e1e1e); + padding: 1.5rem; + border-radius: 0.5rem; + display: flex; + flex-direction: column; + gap: 1rem; + border: 1px solid var(--senary-contrast, #333); + height: 250px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); + + .demo-input { + width: 100%; + padding: 1rem; + border-radius: 0.5rem; + border: 1px solid var(--senary-contrast, #444); + background: rgba(0, 0, 0, 0.2); + color: var(--primary-contrast); + font-size: 1rem; + box-sizing: border-box; - &:nth-child(odd) { - border-left: none; + &:focus { + outline: 2px solid var(--primary-color, #c2185b); + border-color: transparent; } } - @include mq.for-phone-only { - &:nth-child(n) { - border-left: none; - } - - &:nth-child(-n + 1) { - border-top: none; + .demo-list { + display: flex; + flex-direction: column; + gap: 0.25rem; + overflow-y: auto; + flex: 1; + padding-right: 0.5rem; + + .demo-item { + padding: 0.25rem 1rem; + color: var(--secondary-contrast); + border-radius: 0.5rem; + transition: background 0.2s; + + &:hover { + background: rgba(255, 255, 255, 0.05); + } } } + } +} - svg { - width: 3rem; +.step-code { + display: flex; + flex-direction: column; + gap: 1.5rem; + + .code-block { + background: var(--card-background, #111); + border: 1px solid var(--senary-contrast, #333); + border-radius: 0.5rem; + padding: 1.5rem; + font-family: 'JetBrains Mono', monospace; + font-size: 0.9rem; + line-height: 1.5; + position: relative; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); + + .code-header { + display: flex; + justify-content: space-between; + align-items: center; + color: var(--tertiary-contrast, #888); + font-size: 0.8rem; + margin-bottom: 1rem; } - h3 { - font-size: 1.5rem; - margin-bottom: 1rem; + .copy-icon { + width: 16px; + height: 16px; + border: 1px solid #555; + border-radius: 0.5rem; } - p { - font-size: 1rem; - color: var(--quaternary-contrast); - font-weight: 300; + pre { + margin: 0; + white-space: pre-wrap; + font-family: inherit; } } } -.performance { - background-image: - linear-gradient( - 63deg, - transparent 66%, - var(--page-background) 69%, - var(--page-background) 70%, - transparent 70% - ), - linear-gradient(350deg, var(--page-background) 50%, #9337f58a 100%); - background-size: - 27px 27px, - auto; - background-repeat: repeat; - background-color: transparent; - - .section-content { - display: flex; - flex-wrap: wrap; - gap: 1.5rem; - } +.selling-points { + padding: 5rem 3rem 5rem 9rem; + max-width: 1440px; + margin: 0 auto; + box-sizing: border-box; - .performance-half { - flex: 1 0 200px; - padding: 3rem 0; - - &:nth-child(2) { - display: flex; - justify-content: center; - align-items: center; + h2 { + font-size: 38pt; + line-height: 1.2; + margin-bottom: 4rem; + font-weight: 500; + } - @include mq.for-desktop-down { - display: none; - } + .cards { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1.5rem; + text-align: left; /* reset center alignment from section */ + overflow-x: auto; - svg { - width: 80%; - max-width: 365px; - } + @include mq.for-tablet-landscape-down { + grid-template-columns: repeat(2, 1fr); } - } - p { - &.secondary { - font-size: 1.2rem; + @include mq.for-phone-only { + grid-template-columns: 1fr; } } - .docs-card-grid { - display: grid; - grid-template-columns: repeat(2, 1fr); + .card { + background-color: var(--card-background); + border: 1px solid var(--senary-contrast); + border-radius: 0.5rem; + padding: 2rem; + display: flex; + flex-direction: column; gap: 1.5rem; + height: 100%; + box-sizing: border-box; + transition: border-color 0.3s ease; - @include mq.for-tablet-down { - grid-template-columns: 1fr; + &:hover { + border-color: var(--quinary-contrast); } } -} -.learn-more { - background-image: - linear-gradient( - 63deg, - transparent 66%, - var(--page-background) 69%, - var(--page-background) 70%, - transparent 70% - ), - linear-gradient(162deg, var(--page-background) 50%, #9337f58a 100%); - background-size: - 27px 27px, - auto; - background-repeat: repeat; - background-color: transparent; - - padding-block: 5rem; - text-align: left; + .icon-wrapper { + width: 48px; + height: 48px; + border: 1px solid var(--quinary-contrast); + border-radius: 0.5rem; + display: flex; + align-items: center; + justify-content: center; + color: var(--primary-contrast); - h2 { - font-size: 2.5rem; - margin-bottom: 3rem; + docs-icon { + font-size: 24px; + } } - h3 { - margin-top: 0; - } + .card-content { + h3 { + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: var(--secondary-contrast); + margin: 0; - svg { - width: 64px; - flex: 0 0 64px; - margin: 0 1rem; + strong { + color: var(--primary-contrast); + font-weight: 600; + } + } } +} - p { - font-size: 1rem; - font-weight: 300; +.performance-section { + display: flex; + justify-content: center; + align-items: center; - &.secondary { - color: var(--quaternary-contrast); - } + .wrapper { + width: 800px; + height: 800px; + position: relative; + display: flex; + justify-content: center; } - .card-content { - flex: 1; - display: flex; - flex-direction: column; - justify-content: space-between; + .pattern { + z-index: -1; + pointer-events: none; + position: absolute; height: 100%; + width: 100%; + + animation: pulse 4s ease-in-out infinite; + background: radial-gradient( + transparent var(--pulse-inner), + #f627e3 45%, + #6911d2 55%, + transparent var(--pulse-outer) + ); + mask-image: var(--pattern-url); + + mask-size: 22px 22px; + mask-repeat: repeat; } - .docs-card { + .content { + height: 100%; + max-width: 500px; display: flex; - flex-direction: row; - align-items: flex-start; - gap: 1.5rem; - - @include mq.for-tablet-down { - & { - flex-direction: column; - } + flex-direction: column; + justify-content: center; + align-items: center; + h2 { + font-size: 42pt; } - } - - .docs-card-grid { - display: grid; - grid-template-columns: repeat(2, 1fr); - gap: 1.5rem; - - @include mq.for-tablet-down { - grid-template-columns: 1fr; + h3 { + font-size: 12pt; + } + button { + margin-top: 2rem; } } } diff --git a/adev/src/app/features/home/home.component.ts b/adev/src/app/features/home/home.component.ts index 5c7c61c07741..4eb556a2eaa6 100644 --- a/adev/src/app/features/home/home.component.ts +++ b/adev/src/app/features/home/home.component.ts @@ -6,12 +6,28 @@ * found in the LICENSE file at https://angular.dev/license */ -import {ChangeDetectionStrategy, Component, inject} from '@angular/core'; -import {ActivatedRoute, RouterLink} from '@angular/router'; +import { Tab, TabContent, TabList, TabPanel, Tabs } from '@angular/aria/tabs'; +import { A11yModule } from '@angular/cdk/a11y'; +import { ChangeDetectionStrategy, Component, computed, inject, signal } from '@angular/core'; +import { IS_SEARCH_DIALOG_OPEN, IconComponent, TextField } from '@angular/docs'; +import { ActivatedRoute, RouterLink } from '@angular/router'; +import { CodeHighligher } from './code-highlighting/code-highlighter'; +import { CodeBlock } from './components/code-block/code-block'; @Component({ selector: 'adev-home', - imports: [RouterLink], + imports: [ + RouterLink, + TextField, + TabList, + Tab, + Tabs, + TabPanel, + TabContent, + IconComponent, + A11yModule, + CodeBlock, + ], templateUrl: './home.component.html', styleUrls: ['./home.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, @@ -19,4 +35,34 @@ import {ActivatedRoute, RouterLink} from '@angular/router'; export default class Home { private readonly activatedRoute = inject(ActivatedRoute); protected readonly isUwu = 'uwu' in this.activatedRoute.snapshot.queryParams; + private readonly codeHighlighter = inject(CodeHighligher); + + protected readonly displaySearchDialog = inject(IS_SEARCH_DIALOG_OPEN); + + // Source signals for state. + items = signal([ + 'Apple', + 'Apricot', + 'Avocado', + 'Banana', + 'Blueberry', + 'Cherry', + 'Date', + 'Dragonfruit', + ]); + searchTerm = signal(''); + + // A computed signal that derives the filtered list. + // It automatically re-runs when a dependency changes. + filteredItems = computed(() => + this.items().filter((item) => item.toLowerCase().includes(this.searchTerm().toLowerCase())), + ); + + openSearch() { + this.displaySearchDialog.set(true); + } + + onSearch(event: Event) { + this.searchTerm.set((event.target as HTMLInputElement).value); + } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3a11d3dc3ec8..ab854fca278f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -578,6 +578,27 @@ importers: '@marijn/find-cluster-break': specifier: 1.0.2 version: 1.0.2 + '@shikijs/core': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/engine-javascript': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/engine-oniguruma': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/langs': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/themes': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/types': + specifier: ^3.21.0 + version: 3.21.0 + '@shikijs/vscode-textmate': + specifier: ^10.0.2 + version: 10.0.2 '@stackblitz/sdk': specifier: 1.11.0 version: 1.11.0 @@ -611,6 +632,18 @@ importers: angular-split: specifier: 20.0.0 version: 20.0.0(@angular/common@packages+common)(@angular/core@packages+core)(rxjs@7.8.2) + ccount: + specifier: ^2.0.1 + version: 2.0.1 + character-entities-html4: + specifier: ^2.1.0 + version: 2.1.0 + character-entities-legacy: + specifier: ^3.0.0 + version: 3.0.0 + comma-separated-tokens: + specifier: ^2.0.3 + version: 2.0.3 crelt: specifier: 1.0.6 version: 1.0.6 @@ -623,6 +656,15 @@ importers: fflate: specifier: 0.8.2 version: 0.8.2 + hast-util-to-html: + specifier: ^9.0.5 + version: 9.0.5 + hast-util-whitespace: + specifier: ^3.0.0 + version: 3.0.0 + html-void-elements: + specifier: ^3.0.0 + version: 3.0.0 jasmine-core: specifier: 5.13.0 version: 5.13.0 @@ -665,12 +707,21 @@ importers: prettier: specifier: 3.7.4 version: 3.7.4 + property-information: + specifier: ^7.1.0 + version: 7.1.0 rxjs: specifier: 7.8.2 version: 7.8.2 shiki: specifier: 3.21.0 version: 3.21.0 + space-separated-tokens: + specifier: ^2.0.2 + version: 2.0.2 + stringify-entities: + specifier: ^4.0.4 + version: 4.0.4 style-mod: specifier: 4.1.3 version: 4.1.3 @@ -686,6 +737,9 @@ importers: w3c-keyname: specifier: 2.2.8 version: 2.2.8 + zwitch: + specifier: ^2.0.4 + version: 2.0.4 devDependencies: autoprefixer: specifier: 10.4.23 @@ -13207,7 +13261,7 @@ snapshots: beasties: 0.3.5 browserslist: 4.28.1 esbuild: 0.27.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 istanbul-lib-instrument: 6.0.3 jsonc-parser: 3.3.1 listr2: 9.0.5 @@ -13266,7 +13320,7 @@ snapshots: beasties: 0.3.5 browserslist: 4.28.1 esbuild: 0.27.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 istanbul-lib-instrument: 6.0.3 jsonc-parser: 3.3.1 listr2: 9.0.5 @@ -13325,7 +13379,7 @@ snapshots: beasties: 0.3.5 browserslist: 4.28.1 esbuild: 0.27.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 istanbul-lib-instrument: 6.0.3 jsonc-parser: 3.3.1 listr2: 9.0.5 @@ -13704,7 +13758,7 @@ snapshots: '@babel/traverse': 7.28.6 '@babel/types': 7.28.6 convert-source-map: 2.0.0 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -13724,7 +13778,7 @@ snapshots: '@babel/types': 7.28.6 '@jridgewell/remapping': 2.3.5 convert-source-map: 2.0.0 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -13744,7 +13798,7 @@ snapshots: '@babel/types': 7.28.6 '@jridgewell/remapping': 2.3.5 convert-source-map: 2.0.0 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -13804,7 +13858,7 @@ snapshots: '@babel/core': 7.28.5 '@babel/helper-compilation-targets': 7.28.6 '@babel/helper-plugin-utils': 7.28.6 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) lodash.debounce: 4.0.8 resolve: 1.22.11 transitivePeerDependencies: @@ -14536,7 +14590,7 @@ snapshots: '@babel/parser': 7.28.6 '@babel/template': 7.28.6 '@babel/types': 7.28.6 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -15198,8 +15252,8 @@ snapshots: '@google-cloud/cloud-sql-connector@1.9.0': dependencies: '@googleapis/sqladmin': 35.0.0 - gaxios: 7.1.3(supports-color@10.2.2) - google-auth-library: 10.5.0(supports-color@10.2.2) + gaxios: 7.1.3 + google-auth-library: 10.5.0 p-throttle: 7.0.0 transitivePeerDependencies: - supports-color @@ -15243,8 +15297,8 @@ snapshots: '@opentelemetry/semantic-conventions': 1.34.0 arrify: 2.0.1 extend: 3.0.2 - google-auth-library: 10.5.0(supports-color@10.2.2) - google-gax: 5.0.6(supports-color@10.2.2) + google-auth-library: 10.5.0 + google-gax: 5.0.6 heap-js: 2.7.1 is-stream-ended: 0.1.4 lodash.snakecase: 4.1.1 @@ -16439,7 +16493,7 @@ snapshots: dependencies: agent-base: 7.1.4 http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 lru-cache: 11.2.4 socks-proxy-agent: 8.0.5 transitivePeerDependencies: @@ -16822,8 +16876,8 @@ snapshots: '@puppeteer/browsers@2.11.1': dependencies: - debug: 4.4.3(supports-color@10.2.2) - extract-zip: 2.0.1 + debug: 4.4.3(supports-color@8.1.1) + extract-zip: 2.0.1(supports-color@8.1.1) progress: 2.0.3 proxy-agent: 6.5.0 semver: 7.7.3 @@ -17071,7 +17125,7 @@ snapshots: '@secretlint/resolver': 10.2.2 '@secretlint/types': 10.2.2 ajv: 8.17.1 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) rc-config-loader: 4.1.3 transitivePeerDependencies: - supports-color @@ -17080,7 +17134,7 @@ snapshots: dependencies: '@secretlint/profiler': 10.2.2 '@secretlint/types': 10.2.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) structured-source: 4.0.0 transitivePeerDependencies: - supports-color @@ -17093,7 +17147,7 @@ snapshots: '@textlint/module-interop': 15.5.0 '@textlint/types': 15.5.0 chalk: 5.6.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) pluralize: 8.0.0 strip-ansi: 7.1.2 table: 6.9.0 @@ -17109,7 +17163,7 @@ snapshots: '@secretlint/profiler': 10.2.2 '@secretlint/source-creator': 10.2.2 '@secretlint/types': 10.2.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) p-map: 7.0.4 transitivePeerDependencies: - supports-color @@ -17248,7 +17302,7 @@ snapshots: '@textlint/resolver': 15.5.0 '@textlint/types': 15.5.0 chalk: 4.1.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) js-yaml: 4.1.1 lodash: 4.17.21 pluralize: 2.0.0 @@ -17743,7 +17797,7 @@ snapshots: '@typescript/vfs@1.6.2(typescript@5.9.3)': dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) typescript: 5.9.3 transitivePeerDependencies: - supports-color @@ -17751,7 +17805,7 @@ snapshots: '@typespec/ts-http-runtime@0.3.2': dependencies: http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 tslib: 2.8.1 transitivePeerDependencies: - supports-color @@ -17882,7 +17936,7 @@ snapshots: '@vscode/test-electron@2.5.2': dependencies: http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 jszip: 3.10.1 ora: 8.2.0 semver: 7.7.3 @@ -18112,6 +18166,12 @@ snapshots: adm-zip@0.5.16: {} + agent-base@6.0.2: + dependencies: + debug: 4.4.3(supports-color@8.1.1) + transitivePeerDependencies: + - supports-color + agent-base@6.0.2(supports-color@10.2.2): dependencies: debug: 4.4.3(supports-color@10.2.2) @@ -18676,7 +18736,7 @@ snapshots: dependencies: bytes: 3.1.2 content-type: 1.0.5 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) http-errors: 2.0.1 iconv-lite: 0.7.2 on-finished: 2.4.1 @@ -18735,7 +18795,7 @@ snapshots: browserstack@1.6.1: dependencies: - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 transitivePeerDependencies: - supports-color @@ -20095,7 +20155,7 @@ snapshots: base64id: 2.0.0 cookie: 0.7.2 cors: 2.8.5 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) engine.io-parser: 5.2.3 ws: 8.18.3(bufferutil@4.1.0)(utf-8-validate@6.0.6) transitivePeerDependencies: @@ -20460,7 +20520,7 @@ snapshots: content-type: 1.0.5 cookie: 0.7.2 cookie-signature: 1.2.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) depd: 2.0.0 encodeurl: 2.0.0 escape-html: 1.0.3 @@ -20487,16 +20547,6 @@ snapshots: extend@3.0.2: {} - extract-zip@2.0.1: - dependencies: - debug: 4.4.3(supports-color@10.2.2) - get-stream: 5.2.0 - yauzl: 2.10.0 - optionalDependencies: - '@types/yauzl': 2.10.3 - transitivePeerDependencies: - - supports-color - extract-zip@2.0.1(supports-color@8.1.1): dependencies: debug: 4.4.3(supports-color@8.1.1) @@ -20618,7 +20668,7 @@ snapshots: finalhandler@2.1.1: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) encodeurl: 2.0.0 escape-html: 1.0.3 on-finished: 2.4.1 @@ -20803,7 +20853,7 @@ snapshots: follow-redirects@1.15.11(debug@4.4.3): optionalDependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) for-each@0.3.5: dependencies: @@ -20912,7 +20962,7 @@ snapshots: gaxios@6.7.1(encoding@0.1.13): dependencies: extend: 3.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 is-stream: 2.0.1 node-fetch: 2.7.0(encoding@0.1.13) uuid: 9.0.1 @@ -20920,6 +20970,15 @@ snapshots: - encoding - supports-color + gaxios@7.1.3: + dependencies: + extend: 3.0.2 + https-proxy-agent: 7.0.6 + node-fetch: 3.3.2 + rimraf: 5.0.10 + transitivePeerDependencies: + - supports-color + gaxios@7.1.3(supports-color@10.2.2): dependencies: extend: 3.0.2 @@ -20938,6 +20997,14 @@ snapshots: - encoding - supports-color + gcp-metadata@8.1.2: + dependencies: + gaxios: 7.1.3 + google-logging-utils: 1.1.3 + json-bigint: 1.0.0 + transitivePeerDependencies: + - supports-color + gcp-metadata@8.1.2(supports-color@10.2.2): dependencies: gaxios: 7.1.3(supports-color@10.2.2) @@ -21000,7 +21067,7 @@ snapshots: dependencies: basic-ftp: 5.1.0 data-uri-to-buffer: 6.0.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -21156,6 +21223,18 @@ snapshots: dependencies: sparkles: 2.1.0 + google-auth-library@10.5.0: + dependencies: + base64-js: 1.5.1 + ecdsa-sig-formatter: 1.0.11 + gaxios: 7.1.3 + gcp-metadata: 8.1.2 + google-logging-utils: 1.1.3 + gtoken: 8.0.0 + jws: 4.0.1 + transitivePeerDependencies: + - supports-color + google-auth-library@10.5.0(supports-color@10.2.2): dependencies: base64-js: 1.5.1 @@ -21180,6 +21259,22 @@ snapshots: - encoding - supports-color + google-gax@5.0.6: + dependencies: + '@grpc/grpc-js': 1.14.3 + '@grpc/proto-loader': 0.8.0 + duplexify: 4.1.3 + google-auth-library: 10.5.0 + google-logging-utils: 1.1.3 + node-fetch: 3.3.2 + object-hash: 3.0.0 + proto3-json-serializer: 3.0.4 + protobufjs: 7.5.4 + retry-request: 8.0.2 + rimraf: 5.0.10 + transitivePeerDependencies: + - supports-color + google-gax@5.0.6(supports-color@10.2.2): dependencies: '@grpc/grpc-js': 1.14.3 @@ -21203,8 +21298,8 @@ snapshots: googleapis-common@8.0.1: dependencies: extend: 3.0.2 - gaxios: 7.1.3(supports-color@10.2.2) - google-auth-library: 10.5.0(supports-color@10.2.2) + gaxios: 7.1.3 + google-auth-library: 10.5.0 qs: 6.14.1 url-template: 2.0.8 transitivePeerDependencies: @@ -21252,6 +21347,13 @@ snapshots: - encoding - supports-color + gtoken@8.0.0: + dependencies: + gaxios: 7.1.3 + jws: 4.0.1 + transitivePeerDependencies: + - supports-color + gtoken@8.0.0(supports-color@10.2.2): dependencies: gaxios: 7.1.3(supports-color@10.2.2) @@ -21466,6 +21568,14 @@ snapshots: http-parser-js@0.5.10: {} + http-proxy-agent@5.0.0: + dependencies: + '@tootallnate/once': 2.0.0 + agent-base: 6.0.2 + debug: 4.4.3(supports-color@8.1.1) + transitivePeerDependencies: + - supports-color + http-proxy-agent@5.0.0(supports-color@10.2.2): dependencies: '@tootallnate/once': 2.0.0 @@ -21477,7 +21587,7 @@ snapshots: http-proxy-agent@7.0.2: dependencies: agent-base: 7.1.4 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -21496,7 +21606,7 @@ snapshots: http-proxy-middleware@3.0.5: dependencies: '@types/http-proxy': 1.17.17 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) http-proxy: 1.18.1(debug@4.4.3) is-glob: 4.0.3 is-plain-object: 5.0.0 @@ -21548,6 +21658,13 @@ snapshots: quick-lru: 5.1.1 resolve-alpn: 1.2.1 + https-proxy-agent@7.0.6: + dependencies: + agent-base: 7.1.4 + debug: 4.4.3(supports-color@8.1.1) + transitivePeerDependencies: + - supports-color + https-proxy-agent@7.0.6(supports-color@10.2.2): dependencies: agent-base: 7.1.4 @@ -21963,7 +22080,7 @@ snapshots: istanbul-lib-source-maps@4.0.1: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) istanbul-lib-coverage: 3.2.2 source-map: 0.6.1 transitivePeerDependencies: @@ -21972,7 +22089,7 @@ snapshots: istanbul-lib-source-maps@5.0.6: dependencies: '@jridgewell/trace-mapping': 0.3.31 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) istanbul-lib-coverage: 3.2.2 transitivePeerDependencies: - supports-color @@ -22502,7 +22619,7 @@ snapshots: decimal.js: 10.6.0 html-encoding-sniffer: 4.0.0 http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 is-potential-custom-element-name: 1.0.1 nwsapi: 2.2.23 parse5: 7.3.0 @@ -22532,7 +22649,7 @@ snapshots: decimal.js: 10.6.0 html-encoding-sniffer: 6.0.0 http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 is-potential-custom-element-name: 1.0.1 parse5: 8.0.0 saxes: 6.0.0 @@ -22997,7 +23114,7 @@ snapshots: log4js@6.9.1: dependencies: date-format: 4.0.14 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) flatted: 3.3.3 rfdc: 1.4.1 streamroller: 3.1.5 @@ -23876,10 +23993,10 @@ snapshots: dependencies: '@tootallnate/quickjs-emscripten': 0.23.0 agent-base: 7.1.4 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) get-uri: 6.0.5 http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 pac-resolver: 7.0.1 socks-proxy-agent: 8.0.5 transitivePeerDependencies: @@ -24144,7 +24261,7 @@ snapshots: portfinder@1.0.38: dependencies: async: 3.2.6 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -24342,9 +24459,9 @@ snapshots: proxy-agent@6.5.0: dependencies: agent-base: 7.1.4 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) http-proxy-agent: 7.0.2 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + https-proxy-agent: 7.0.6 lru-cache: 7.18.3 pac-proxy-agent: 7.2.0 proxy-from-env: 1.1.0 @@ -24393,7 +24510,7 @@ snapshots: dependencies: '@puppeteer/browsers': 2.11.1 chromium-bidi: 12.0.1(devtools-protocol@0.0.1534754) - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) devtools-protocol: 0.0.1534754 typed-query-selector: 2.12.0 webdriver-bidi-protocol: 0.3.10 @@ -24408,10 +24525,10 @@ snapshots: puppeteer-core@5.5.0(bufferutil@4.1.0)(encoding@0.1.13)(utf-8-validate@6.0.6): dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) devtools-protocol: 0.0.818844 - extract-zip: 2.0.1 - https-proxy-agent: 7.0.6(supports-color@10.2.2) + extract-zip: 2.0.1(supports-color@8.1.1) + https-proxy-agent: 7.0.6 node-fetch: 2.7.0(encoding@0.1.13) pkg-dir: 4.2.0 progress: 2.0.3 @@ -24495,7 +24612,7 @@ snapshots: rc-config-loader@4.1.3: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) js-yaml: 4.1.1 json5: 2.2.3 require-from-string: 2.0.2 @@ -24741,6 +24858,13 @@ snapshots: ret@0.1.15: {} + retry-request@8.0.2: + dependencies: + extend: 3.0.2 + teeny-request: 10.1.0 + transitivePeerDependencies: + - supports-color + retry-request@8.0.2(supports-color@10.2.2): dependencies: extend: 3.0.2 @@ -24859,7 +24983,7 @@ snapshots: router@2.2.0: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) depd: 2.0.0 is-promise: 4.0.0 parseurl: 1.3.3 @@ -24961,7 +25085,7 @@ snapshots: '@secretlint/formatter': 10.2.2 '@secretlint/node': 10.2.2 '@secretlint/profiler': 10.2.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) globby: 14.1.0 read-pkg: 9.0.1 transitivePeerDependencies: @@ -25044,7 +25168,7 @@ snapshots: send@1.2.1: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) encodeurl: 2.0.0 escape-html: 1.0.3 etag: 1.8.1 @@ -25260,7 +25384,7 @@ snapshots: socket.io-adapter@2.5.6(bufferutil@4.1.0)(utf-8-validate@6.0.6): dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) ws: 8.18.3(bufferutil@4.1.0)(utf-8-validate@6.0.6) transitivePeerDependencies: - bufferutil @@ -25270,7 +25394,7 @@ snapshots: socket.io-parser@4.2.5: dependencies: '@socket.io/component-emitter': 3.1.2 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -25279,7 +25403,7 @@ snapshots: accepts: 1.3.8 base64id: 2.0.0 cors: 2.8.5 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) engine.io: 6.6.5(bufferutil@4.1.0)(utf-8-validate@6.0.6) socket.io-adapter: 2.5.6(bufferutil@4.1.0)(utf-8-validate@6.0.6) socket.io-parser: 4.2.5 @@ -25297,7 +25421,7 @@ snapshots: socks-proxy-agent@8.0.5: dependencies: agent-base: 7.1.4 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) socks: 2.8.7 transitivePeerDependencies: - supports-color @@ -25361,7 +25485,7 @@ snapshots: spdy-transport@3.0.0: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) detect-node: 2.1.0 hpack.js: 2.1.6 obuf: 1.1.2 @@ -25372,7 +25496,7 @@ snapshots: spdy@4.0.2: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) handle-thing: 2.0.1 http-deceiver: 1.2.7 select-hose: 2.0.0 @@ -25469,7 +25593,7 @@ snapshots: streamroller@3.1.5: dependencies: date-format: 4.0.14 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) fs-extra: 8.1.0 transitivePeerDependencies: - supports-color @@ -25759,6 +25883,15 @@ snapshots: transitivePeerDependencies: - supports-color + teeny-request@10.1.0: + dependencies: + http-proxy-agent: 5.0.0 + https-proxy-agent: 7.0.6 + node-fetch: 3.3.2 + stream-events: 1.0.5 + transitivePeerDependencies: + - supports-color + teeny-request@10.1.0(supports-color@10.2.2): dependencies: http-proxy-agent: 5.0.0(supports-color@10.2.2) @@ -26064,7 +26197,7 @@ snapshots: tuf-js@4.1.0: dependencies: '@tufjs/models': 4.1.0 - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) make-fetch-happen: 15.0.3 transitivePeerDependencies: - supports-color @@ -26272,7 +26405,7 @@ snapshots: universal-analytics@0.5.3: dependencies: - debug: 4.4.3(supports-color@10.2.2) + debug: 4.4.3(supports-color@8.1.1) uuid: 8.3.2 transitivePeerDependencies: - supports-color