[CL-133] add skip links to bit-layout (#7213)

* Add light LinkType to link directive

* add skip link to bit-layout; update i18n for all apps

* install storybook interaction testing packages

* update storybook config

* add skiplink story to bit-layout

* update route and focus logic

* remove focus ring
This commit is contained in:
Will Martin 2023-12-15 09:06:05 -05:00 committed by GitHub
parent b73d73b508
commit e102919c2f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 642 additions and 7 deletions

View File

@ -17,6 +17,7 @@ const config: StorybookConfig = {
"@storybook/addon-essentials",
"@storybook/addon-a11y",
"@storybook/addon-designs",
"@storybook/addon-interactions",
{
name: "@storybook/addon-docs",
options: {

View File

@ -2512,6 +2512,9 @@
"message": "Turn off master password re-prompt to edit this field",
"description": "Message appearing below the autofill on load message when master password reprompt is set for a vault item."
},
"skipToContent": {
"message": "Skip to content"
},
"bitwardenOverlayButton": {
"message": "Bitwarden auto-fill menu button",
"description": "Page title for the iframe containing the overlay button"

View File

@ -2427,6 +2427,9 @@
"submenu": {
"message": "Submenu"
},
"skipToContent": {
"message": "Skip to content"
},
"typePasskey": {
"message": "Passkey"
},

View File

@ -7395,6 +7395,9 @@
"alreadyHaveAccount": {
"message": "Already have an account?"
},
"skipToContent": {
"message": "Skip to content"
},
"customBillingStart": {
"message": "Custom billing is not reflected. Visit the "
},

View File

@ -1,3 +1,18 @@
<div
class="tw-fixed tw-z-50 tw-w-full tw-flex tw-justify-center tw-opacity-0 focus-within:tw-opacity-100 tw-pointer-events-none focus-within:tw-pointer-events-auto"
>
<nav class="tw-bg-background-alt3 tw-rounded-md tw-rounded-t-none tw-py-2 tw-text-alt2">
<a
bitLink
class="tw-mx-6 focus-visible:before:!tw-ring-0"
[fragment]="mainContentId"
[routerLink]="[]"
(click)="focusMainContent()"
linkType="light"
>{{ "skipToContent" | i18n }}</a
>
</nav>
</div>
<div class="tw-flex tw-w-full">
<aside
[ngStyle]="
@ -12,7 +27,11 @@
>
<ng-content select="[slot=sidebar]"></ng-content>
</aside>
<main class="tw-ml-60 tw-min-h-screen tw-min-w-0 tw-flex-1 tw-bg-background tw-p-6">
<main
[id]="mainContentId"
tabindex="-1"
class="tw-ml-60 tw-min-h-screen tw-min-w-0 tw-flex-1 tw-bg-background tw-p-6"
>
<ng-content></ng-content>
</main>
</div>

View File

@ -1,5 +1,8 @@
import { CommonModule } from "@angular/common";
import { Component, Input } from "@angular/core";
import { RouterModule } from "@angular/router";
import { LinkModule } from "../link";
import { SharedModule } from "../shared";
export type LayoutVariant = "primary" | "secondary";
@ -7,8 +10,14 @@ export type LayoutVariant = "primary" | "secondary";
selector: "bit-layout",
templateUrl: "layout.component.html",
standalone: true,
imports: [CommonModule],
imports: [SharedModule, LinkModule, RouterModule],
})
export class LayoutComponent {
protected mainContentId = "main-content";
@Input() variant: LayoutVariant = "primary";
focusMainContent() {
document.getElementById(this.mainContentId)?.focus();
}
}

View File

@ -1,5 +1,6 @@
import { RouterTestingModule } from "@angular/router/testing";
import { Meta, StoryObj, componentWrapperDecorator, moduleMetadata } from "@storybook/angular";
import { userEvent } from "@storybook/testing-library";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@ -30,6 +31,7 @@ export default {
provide: I18nService,
useFactory: () => {
return new I18nMockService({
skipToContent: "Skip to content",
submenu: "submenu",
toggleCollapse: "toggle collapse",
});
@ -134,6 +136,13 @@ export const WithContent: Story = {
}),
};
export const SkipLinks: Story = {
...WithContent,
play: async () => {
await userEvent.tab();
},
};
export const Secondary: Story = {
render: (args) => ({
props: args,

View File

@ -1,6 +1,6 @@
import { Input, HostBinding, Directive } from "@angular/core";
export type LinkType = "primary" | "secondary" | "contrast";
export type LinkType = "primary" | "secondary" | "contrast" | "light";
const linkStyles: Record<LinkType, string[]> = {
primary: [
@ -21,6 +21,12 @@ const linkStyles: Record<LinkType, string[]> = {
"focus-visible:before:tw-ring-text-contrast",
"disabled:!tw-text-contrast/60",
],
light: [
"!tw-text-alt2",
"hover:!tw-text-alt2",
"focus-visible:before:tw-ring-text-alt2",
"disabled:!tw-text-alt2/60",
],
};
const commonStyles = [

585
package-lock.json generated
View File

@ -86,8 +86,11 @@
"@storybook/addon-actions": "7.3.0",
"@storybook/addon-designs": "7.0.7",
"@storybook/addon-essentials": "7.3.0",
"@storybook/addon-interactions": "^7.6.4",
"@storybook/addon-links": "7.3.0",
"@storybook/angular": "7.3.0",
"@storybook/jest": "^0.2.3",
"@storybook/testing-library": "^0.2.2",
"@types/argon2-browser": "1.18.1",
"@types/chrome": "0.0.243",
"@types/duo_web_sdk": "2.7.1",
@ -332,6 +335,12 @@
"node": ">=0.10.0"
}
},
"node_modules/@adobe/css-tools": {
"version": "4.3.2",
"resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.3.2.tgz",
"integrity": "sha512-DA5a1C0gD/pLOvhv33YMrbf2FK3oUzwNl9oOJqE4XVjuEtt6XIakRcsd7eLiOSPkp1kTRQGICTA8cKra/vFbjw==",
"dev": true
},
"node_modules/@aduh95/viz.js": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/@aduh95/viz.js/-/viz.js-3.4.0.tgz",
@ -9325,6 +9334,121 @@
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions": {
"version": "7.6.4",
"resolved": "https://registry.npmjs.org/@storybook/addon-interactions/-/addon-interactions-7.6.4.tgz",
"integrity": "sha512-LjK9uhkgnbGyDwwa7pQhLptDEHeTIFmy+KurfJs9T08DpvRFfuuzyW4mj/hA63R1W5yjFSAhRiZj26+D7kBIyw==",
"dev": true,
"dependencies": {
"@storybook/global": "^5.0.0",
"@storybook/types": "7.6.4",
"jest-mock": "^27.0.6",
"polished": "^4.2.2",
"ts-dedent": "^2.2.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@jest/types": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/@jest/types/-/types-27.5.1.tgz",
"integrity": "sha512-Cx46iJ9QpwQTjIdq5VJu2QTMMs3QlEjI0x1QbBP5W1+nMzyc2XmimiRR/CbX9TO0cPTeUlxWMOu8mslYsJ8DEw==",
"dev": true,
"dependencies": {
"@types/istanbul-lib-coverage": "^2.0.0",
"@types/istanbul-reports": "^3.0.0",
"@types/node": "*",
"@types/yargs": "^16.0.0",
"chalk": "^4.0.0"
},
"engines": {
"node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@storybook/channels": {
"version": "7.6.4",
"resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.6.4.tgz",
"integrity": "sha512-Z4PY09/Czl70ap4ObmZ4bgin+EQhPaA3HdrEDNwpnH7A9ttfEO5u5KThytIjMq6kApCCihmEPDaYltoVrfYJJA==",
"dev": true,
"dependencies": {
"@storybook/client-logger": "7.6.4",
"@storybook/core-events": "7.6.4",
"@storybook/global": "^5.0.0",
"qs": "^6.10.0",
"telejson": "^7.2.0",
"tiny-invariant": "^1.3.1"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@storybook/client-logger": {
"version": "7.6.4",
"resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.6.4.tgz",
"integrity": "sha512-vJwMShC98tcoFruRVQ4FphmFqvAZX1FqZqjFyk6IxtFumPKTVSnXJjlU1SnUIkSK2x97rgdUMqkdI+wAv/tugQ==",
"dev": true,
"dependencies": {
"@storybook/global": "^5.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@storybook/core-events": {
"version": "7.6.4",
"resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.6.4.tgz",
"integrity": "sha512-i3xzcJ19ILSy4oJL5Dz9y0IlyApynn5RsGhAMIsW+mcfri+hGfeakq1stNCo0o7jW4Y3A7oluFTtIoK8DOxQdQ==",
"dev": true,
"dependencies": {
"ts-dedent": "^2.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@storybook/types": {
"version": "7.6.4",
"resolved": "https://registry.npmjs.org/@storybook/types/-/types-7.6.4.tgz",
"integrity": "sha512-qyiiXPCvol5uVgfubcIMzJBA0awAyFPU+TyUP1mkPYyiTHnsHYel/mKlSdPjc8a97N3SlJXHOCx41Hde4IyJgg==",
"dev": true,
"dependencies": {
"@storybook/channels": "7.6.4",
"@types/babel__core": "^7.0.0",
"@types/express": "^4.7.0",
"file-system-cache": "2.3.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/addon-interactions/node_modules/@types/yargs": {
"version": "16.0.9",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-16.0.9.tgz",
"integrity": "sha512-tHhzvkFXZQeTECenFoRljLBYPZJ7jAVxqqtEI0qTLOmuultnFp4I9yKE17vTuhf7BkhCu7I4XuemPgikDVuYqA==",
"dev": true,
"dependencies": {
"@types/yargs-parser": "*"
}
},
"node_modules/@storybook/addon-interactions/node_modules/jest-mock": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-27.5.1.tgz",
"integrity": "sha512-K4jKbY1d4ENhbrG2zuPWaQBvDly+iZ2yAW+T1fATN78hc0sInwn7wZB8XtlNnvHug5RMwV897Xm4LqmPM4e2Og==",
"dev": true,
"dependencies": {
"@jest/types": "^27.5.1",
"@types/node": "*"
},
"engines": {
"node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
}
},
"node_modules/@storybook/addon-links": {
"version": "7.3.0",
"resolved": "https://registry.npmjs.org/@storybook/addon-links/-/addon-links-7.3.0.tgz",
@ -13186,6 +13310,118 @@
"url": "https://opencollective.com/storybook"
}
},
"node_modules/@storybook/expect": {
"version": "28.1.3-5",
"resolved": "https://registry.npmjs.org/@storybook/expect/-/expect-28.1.3-5.tgz",
"integrity": "sha512-lS1oJnY1qTAxnH87C765NdfvGhksA6hBcbUVI5CHiSbNsEtr456wtg/z+dT9XlPriq1D5t2SgfNL9dBAoIGyIA==",
"dev": true,
"dependencies": {
"@types/jest": "28.1.3"
}
},
"node_modules/@storybook/expect/node_modules/@jest/schemas": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-28.1.3.tgz",
"integrity": "sha512-/l/VWsdt/aBXgjshLWOFyFt3IVdYypu5y2Wn2rOO1un6nkqIn8SLXzgIMYXFyYsRWDyF5EthmKJMIdJvk08grg==",
"dev": true,
"dependencies": {
"@sinclair/typebox": "^0.24.1"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/expect/node_modules/@sinclair/typebox": {
"version": "0.24.51",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
"integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==",
"dev": true
},
"node_modules/@storybook/expect/node_modules/@types/jest": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/@types/jest/-/jest-28.1.3.tgz",
"integrity": "sha512-Tsbjk8Y2hkBaY/gJsataeb4q9Mubw9EOz7+4RjPkzD5KjTvHHs7cpws22InaoXxAVAhF5HfFbzJjo6oKWqSZLw==",
"dev": true,
"dependencies": {
"jest-matcher-utils": "^28.0.0",
"pretty-format": "^28.0.0"
}
},
"node_modules/@storybook/expect/node_modules/ansi-styles": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
"integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
"dev": true,
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
}
},
"node_modules/@storybook/expect/node_modules/diff-sequences": {
"version": "28.1.1",
"resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-28.1.1.tgz",
"integrity": "sha512-FU0iFaH/E23a+a718l8Qa/19bF9p06kgE0KipMOMadwa3SjnaElKzPaUC0vnibs6/B/9ni97s61mcejk8W1fQw==",
"dev": true,
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/expect/node_modules/jest-diff": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-28.1.3.tgz",
"integrity": "sha512-8RqP1B/OXzjjTWkqMX67iqgwBVJRgCyKD3L9nq+6ZqJMdvjE8RgHktqZ6jNrkdMT+dJuYNI3rhQpxaz7drJHfw==",
"dev": true,
"dependencies": {
"chalk": "^4.0.0",
"diff-sequences": "^28.1.1",
"jest-get-type": "^28.0.2",
"pretty-format": "^28.1.3"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/expect/node_modules/jest-get-type": {
"version": "28.0.2",
"resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-28.0.2.tgz",
"integrity": "sha512-ioj2w9/DxSYHfOm5lJKCdcAmPJzQXmbM/Url3rhlghrPvT3tt+7a/+oXc9azkKmLvoiXjtV83bEWqi+vs5nlPA==",
"dev": true,
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/expect/node_modules/jest-matcher-utils": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-28.1.3.tgz",
"integrity": "sha512-kQeJ7qHemKfbzKoGjHHrRKH6atgxMk8Enkk2iPQ3XwO6oE/KYD8lMYOziCkeSB9G4adPM4nR1DE8Tf5JeWH6Bw==",
"dev": true,
"dependencies": {
"chalk": "^4.0.0",
"jest-diff": "^28.1.3",
"jest-get-type": "^28.0.2",
"pretty-format": "^28.1.3"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/expect/node_modules/pretty-format": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-28.1.3.tgz",
"integrity": "sha512-8gFb/To0OmxHR9+ZTb14Df2vNxdGCX8g1xWGUTqUw5TiZvcQf5sHKObd5UcPyLLyowNwDAMTF3XWOG1B6mxl1Q==",
"dev": true,
"dependencies": {
"@jest/schemas": "^28.1.3",
"ansi-regex": "^5.0.1",
"ansi-styles": "^5.0.0",
"react-is": "^18.0.0"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/global": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/@storybook/global/-/global-5.0.0.tgz",
@ -13205,6 +13441,159 @@
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/@storybook/jest": {
"version": "0.2.3",
"resolved": "https://registry.npmjs.org/@storybook/jest/-/jest-0.2.3.tgz",
"integrity": "sha512-ov5izrmbAFObzKeh9AOC5MlmFxAcf0o5i6YFGae9sDx6DGh6alXsRM+chIbucVkUwVHVlSzdfbLDEFGY/ShaYw==",
"dev": true,
"dependencies": {
"@storybook/expect": "storybook-jest",
"@testing-library/jest-dom": "^6.1.2",
"@types/jest": "28.1.3",
"jest-mock": "^27.3.0"
}
},
"node_modules/@storybook/jest/node_modules/@jest/schemas": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-28.1.3.tgz",
"integrity": "sha512-/l/VWsdt/aBXgjshLWOFyFt3IVdYypu5y2Wn2rOO1un6nkqIn8SLXzgIMYXFyYsRWDyF5EthmKJMIdJvk08grg==",
"dev": true,
"dependencies": {
"@sinclair/typebox": "^0.24.1"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/jest/node_modules/@jest/types": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/@jest/types/-/types-27.5.1.tgz",
"integrity": "sha512-Cx46iJ9QpwQTjIdq5VJu2QTMMs3QlEjI0x1QbBP5W1+nMzyc2XmimiRR/CbX9TO0cPTeUlxWMOu8mslYsJ8DEw==",
"dev": true,
"dependencies": {
"@types/istanbul-lib-coverage": "^2.0.0",
"@types/istanbul-reports": "^3.0.0",
"@types/node": "*",
"@types/yargs": "^16.0.0",
"chalk": "^4.0.0"
},
"engines": {
"node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
}
},
"node_modules/@storybook/jest/node_modules/@sinclair/typebox": {
"version": "0.24.51",
"resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.24.51.tgz",
"integrity": "sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA==",
"dev": true
},
"node_modules/@storybook/jest/node_modules/@types/jest": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/@types/jest/-/jest-28.1.3.tgz",
"integrity": "sha512-Tsbjk8Y2hkBaY/gJsataeb4q9Mubw9EOz7+4RjPkzD5KjTvHHs7cpws22InaoXxAVAhF5HfFbzJjo6oKWqSZLw==",
"dev": true,
"dependencies": {
"jest-matcher-utils": "^28.0.0",
"pretty-format": "^28.0.0"
}
},
"node_modules/@storybook/jest/node_modules/@types/yargs": {
"version": "16.0.9",
"resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-16.0.9.tgz",
"integrity": "sha512-tHhzvkFXZQeTECenFoRljLBYPZJ7jAVxqqtEI0qTLOmuultnFp4I9yKE17vTuhf7BkhCu7I4XuemPgikDVuYqA==",
"dev": true,
"dependencies": {
"@types/yargs-parser": "*"
}
},
"node_modules/@storybook/jest/node_modules/ansi-styles": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
"integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
"dev": true,
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
}
},
"node_modules/@storybook/jest/node_modules/diff-sequences": {
"version": "28.1.1",
"resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-28.1.1.tgz",
"integrity": "sha512-FU0iFaH/E23a+a718l8Qa/19bF9p06kgE0KipMOMadwa3SjnaElKzPaUC0vnibs6/B/9ni97s61mcejk8W1fQw==",
"dev": true,
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/jest/node_modules/jest-diff": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-28.1.3.tgz",
"integrity": "sha512-8RqP1B/OXzjjTWkqMX67iqgwBVJRgCyKD3L9nq+6ZqJMdvjE8RgHktqZ6jNrkdMT+dJuYNI3rhQpxaz7drJHfw==",
"dev": true,
"dependencies": {
"chalk": "^4.0.0",
"diff-sequences": "^28.1.1",
"jest-get-type": "^28.0.2",
"pretty-format": "^28.1.3"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/jest/node_modules/jest-get-type": {
"version": "28.0.2",
"resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-28.0.2.tgz",
"integrity": "sha512-ioj2w9/DxSYHfOm5lJKCdcAmPJzQXmbM/Url3rhlghrPvT3tt+7a/+oXc9azkKmLvoiXjtV83bEWqi+vs5nlPA==",
"dev": true,
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/jest/node_modules/jest-matcher-utils": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-28.1.3.tgz",
"integrity": "sha512-kQeJ7qHemKfbzKoGjHHrRKH6atgxMk8Enkk2iPQ3XwO6oE/KYD8lMYOziCkeSB9G4adPM4nR1DE8Tf5JeWH6Bw==",
"dev": true,
"dependencies": {
"chalk": "^4.0.0",
"jest-diff": "^28.1.3",
"jest-get-type": "^28.0.2",
"pretty-format": "^28.1.3"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/jest/node_modules/jest-mock": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-27.5.1.tgz",
"integrity": "sha512-K4jKbY1d4ENhbrG2zuPWaQBvDly+iZ2yAW+T1fATN78hc0sInwn7wZB8XtlNnvHug5RMwV897Xm4LqmPM4e2Og==",
"dev": true,
"dependencies": {
"@jest/types": "^27.5.1",
"@types/node": "*"
},
"engines": {
"node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
}
},
"node_modules/@storybook/jest/node_modules/pretty-format": {
"version": "28.1.3",
"resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-28.1.3.tgz",
"integrity": "sha512-8gFb/To0OmxHR9+ZTb14Df2vNxdGCX8g1xWGUTqUw5TiZvcQf5sHKObd5UcPyLLyowNwDAMTF3XWOG1B6mxl1Q==",
"dev": true,
"dependencies": {
"@jest/schemas": "^28.1.3",
"ansi-regex": "^5.0.1",
"ansi-styles": "^5.0.0",
"react-is": "^18.0.0"
},
"engines": {
"node": "^12.13.0 || ^14.15.0 || ^16.10.0 || >=17.0.0"
}
},
"node_modules/@storybook/manager": {
"version": "7.3.0",
"resolved": "https://registry.npmjs.org/@storybook/manager/-/manager-7.3.0.tgz",
@ -13391,6 +13780,17 @@
"node": ">=14.14"
}
},
"node_modules/@storybook/testing-library": {
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/@storybook/testing-library/-/testing-library-0.2.2.tgz",
"integrity": "sha512-L8sXFJUHmrlyU2BsWWZGuAjv39Jl1uAqUHdxmN42JY15M4+XCMjGlArdCCjDe1wpTSW6USYISA9axjZojgtvnw==",
"dev": true,
"dependencies": {
"@testing-library/dom": "^9.0.0",
"@testing-library/user-event": "^14.4.0",
"ts-dedent": "^2.2.0"
}
},
"node_modules/@storybook/theming": {
"version": "7.2.2",
"resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-7.2.2.tgz",
@ -13635,6 +14035,124 @@
"node": ">=10"
}
},
"node_modules/@testing-library/dom": {
"version": "9.3.3",
"resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.3.3.tgz",
"integrity": "sha512-fB0R+fa3AUqbLHWyxXa2kGVtf1Fe1ZZFr0Zp6AIbIAzXb2mKbEXl+PCQNUOaq5lbTab5tfctfXRNsWXxa2f7Aw==",
"dev": true,
"dependencies": {
"@babel/code-frame": "^7.10.4",
"@babel/runtime": "^7.12.5",
"@types/aria-query": "^5.0.1",
"aria-query": "5.1.3",
"chalk": "^4.1.0",
"dom-accessibility-api": "^0.5.9",
"lz-string": "^1.5.0",
"pretty-format": "^27.0.2"
},
"engines": {
"node": ">=14"
}
},
"node_modules/@testing-library/dom/node_modules/ansi-styles": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
"integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
"dev": true,
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
}
},
"node_modules/@testing-library/dom/node_modules/pretty-format": {
"version": "27.5.1",
"resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
"integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
"dev": true,
"dependencies": {
"ansi-regex": "^5.0.1",
"ansi-styles": "^5.0.0",
"react-is": "^17.0.1"
},
"engines": {
"node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
}
},
"node_modules/@testing-library/dom/node_modules/react-is": {
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
"integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
"dev": true
},
"node_modules/@testing-library/jest-dom": {
"version": "6.1.5",
"resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.1.5.tgz",
"integrity": "sha512-3y04JLW+EceVPy2Em3VwNr95dOKqA8DhR0RJHhHKDZNYXcVXnEK7WIrpj4eYU8SVt/qYZ2aRWt/WgQ+grNES8g==",
"dev": true,
"dependencies": {
"@adobe/css-tools": "^4.3.1",
"@babel/runtime": "^7.9.2",
"aria-query": "^5.0.0",
"chalk": "^3.0.0",
"css.escape": "^1.5.1",
"dom-accessibility-api": "^0.5.6",
"lodash": "^4.17.15",
"redent": "^3.0.0"
},
"engines": {
"node": ">=14",
"npm": ">=6",
"yarn": ">=1"
},
"peerDependencies": {
"@jest/globals": ">= 28",
"@types/jest": ">= 28",
"jest": ">= 28",
"vitest": ">= 0.32"
},
"peerDependenciesMeta": {
"@jest/globals": {
"optional": true
},
"@types/jest": {
"optional": true
},
"jest": {
"optional": true
},
"vitest": {
"optional": true
}
}
},
"node_modules/@testing-library/jest-dom/node_modules/chalk": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-3.0.0.tgz",
"integrity": "sha512-4D3B6Wf41KOYRFdszmDqMCGq5VV/uMAB273JILmO+3jAlh8X4qDtdtgCR3fxtbLEMzSx22QdhnDcJvu2u1fVwg==",
"dev": true,
"dependencies": {
"ansi-styles": "^4.1.0",
"supports-color": "^7.1.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/@testing-library/user-event": {
"version": "14.5.1",
"resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.5.1.tgz",
"integrity": "sha512-UCcUKrUYGj7ClomOo2SpNVvx4/fkd/2BbIHDCle8A0ax+P3bU7yJwDBDrS6ZwdTMARWTGODX1hEsCcO+7beJjg==",
"dev": true,
"engines": {
"node": ">=12",
"npm": ">=6"
},
"peerDependencies": {
"@testing-library/dom": ">=7.21.4"
}
},
"node_modules/@thednp/event-listener": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/@thednp/event-listener/-/event-listener-2.0.4.tgz",
@ -13776,6 +14294,12 @@
"integrity": "sha512-PZffP/CqH9m2kovDSRQMfMMxUC3V98I7i7/caa0RB0/nvsXzYbL9bKyqZpNMFmLFGZslROlG1R60ONt7abrwlA==",
"dev": true
},
"node_modules/@types/aria-query": {
"version": "5.0.4",
"resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
"integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
"dev": true
},
"node_modules/@types/babel__core": {
"version": "7.20.1",
"resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.1.tgz",
@ -19256,6 +19780,12 @@
"url": "https://github.com/sponsors/fb55"
}
},
"node_modules/css.escape": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
"integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
"dev": true
},
"node_modules/cssesc": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@ -20027,6 +20557,12 @@
"node": ">=6.0.0"
}
},
"node_modules/dom-accessibility-api": {
"version": "0.5.16",
"resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
"integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
"dev": true
},
"node_modules/dom-converter": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz",
@ -29093,6 +29629,15 @@
"resolved": "https://registry.npmjs.org/lunr/-/lunr-2.3.9.tgz",
"integrity": "sha512-zTU3DaZaF3Rt9rhN3uBMGQD3dD2/vFQqnvZCDv4dl5iOzq2IZQqTxu90r4E5J+nP70J3ilqVCrbho2eWaeW8Ow=="
},
"node_modules/lz-string": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
"integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
"dev": true,
"bin": {
"lz-string": "bin/bin.js"
}
},
"node_modules/macos-release": {
"version": "2.5.1",
"resolved": "https://registry.npmjs.org/macos-release/-/macos-release-2.5.1.tgz",
@ -30543,6 +31088,15 @@
"node": ">=4"
}
},
"node_modules/min-indent": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
"integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
"dev": true,
"engines": {
"node": ">=4"
}
},
"node_modules/mini-css-extract-plugin": {
"version": "2.7.6",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz",
@ -34797,6 +35351,19 @@
"node": ">= 0.10"
}
},
"node_modules/redent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
"integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
"dev": true,
"dependencies": {
"indent-string": "^4.0.0",
"strip-indent": "^3.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/reflect-metadata": {
"version": "0.1.13",
"resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.13.tgz",
@ -37605,6 +38172,18 @@
"node": ">=6"
}
},
"node_modules/strip-indent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
"integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
"dev": true,
"dependencies": {
"min-indent": "^1.0.0"
},
"engines": {
"node": ">=8"
}
},
"node_modules/strip-json-comments": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
@ -37974,9 +38553,9 @@
}
},
"node_modules/telejson": {
"version": "7.1.0",
"resolved": "https://registry.npmjs.org/telejson/-/telejson-7.1.0.tgz",
"integrity": "sha512-jFJO4P5gPebZAERPkJsqMAQ0IMA1Hi0AoSfxpnUaV6j6R2SZqlpkbS20U6dEUtA3RUYt2Ak/mTlkQzHH9Rv/hA==",
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/telejson/-/telejson-7.2.0.tgz",
"integrity": "sha512-1QTEcJkJEhc8OnStBx/ILRu5J2p0GjvWsBx56bmZRqnrkdBMUe+nX92jxV+p3dB4CP6PZCdJMQJwCggkNBMzkQ==",
"dev": true,
"dependencies": {
"memoizerific": "^1.11.3"

View File

@ -49,8 +49,11 @@
"@storybook/addon-actions": "7.3.0",
"@storybook/addon-designs": "7.0.7",
"@storybook/addon-essentials": "7.3.0",
"@storybook/addon-interactions": "^7.6.4",
"@storybook/addon-links": "7.3.0",
"@storybook/angular": "7.3.0",
"@storybook/jest": "^0.2.3",
"@storybook/testing-library": "^0.2.2",
"@types/argon2-browser": "1.18.1",
"@types/chrome": "0.0.243",
"@types/duo_web_sdk": "2.7.1",