accented 0.0.1-dev.4 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/NOTICE +14 -0
- package/README.md +71 -0
- package/dist/accented.d.ts +28 -7
- package/dist/accented.d.ts.map +1 -1
- package/dist/accented.js +107 -42
- package/dist/accented.js.map +1 -1
- package/dist/common/tokens.d.ts +7 -0
- package/dist/common/tokens.d.ts.map +1 -0
- package/dist/common/tokens.js +8 -0
- package/dist/common/tokens.js.map +1 -0
- package/dist/constants.d.ts +4 -0
- package/dist/constants.d.ts.map +1 -0
- package/dist/constants.js +4 -0
- package/dist/constants.js.map +1 -0
- package/dist/dom-updater.d.ts +1 -6
- package/dist/dom-updater.d.ts.map +1 -1
- package/dist/dom-updater.js +136 -20
- package/dist/dom-updater.js.map +1 -1
- package/dist/elements/accented-dialog.d.ts +359 -0
- package/dist/elements/accented-dialog.d.ts.map +1 -0
- package/dist/elements/accented-dialog.js +377 -0
- package/dist/elements/accented-dialog.js.map +1 -0
- package/dist/elements/accented-trigger.d.ts +364 -0
- package/dist/elements/accented-trigger.d.ts.map +1 -0
- package/dist/elements/accented-trigger.js +214 -0
- package/dist/elements/accented-trigger.js.map +1 -0
- package/dist/fullscreen-listener.d.ts +2 -0
- package/dist/fullscreen-listener.d.ts.map +1 -0
- package/dist/fullscreen-listener.js +17 -0
- package/dist/fullscreen-listener.js.map +1 -0
- package/dist/intersection-observer.d.ts +5 -0
- package/dist/intersection-observer.d.ts.map +1 -0
- package/dist/intersection-observer.js +34 -0
- package/dist/intersection-observer.js.map +1 -0
- package/dist/log-and-rethrow.d.ts +2 -0
- package/dist/log-and-rethrow.d.ts.map +1 -0
- package/dist/log-and-rethrow.js +6 -0
- package/dist/log-and-rethrow.js.map +1 -0
- package/dist/logger.d.ts +2 -0
- package/dist/logger.d.ts.map +1 -0
- package/dist/logger.js +28 -0
- package/dist/logger.js.map +1 -0
- package/dist/register-elements.d.ts +2 -0
- package/dist/register-elements.d.ts.map +1 -0
- package/dist/register-elements.js +20 -0
- package/dist/register-elements.js.map +1 -0
- package/dist/resize-listener.d.ts +2 -0
- package/dist/resize-listener.d.ts.map +1 -0
- package/dist/resize-listener.js +17 -0
- package/dist/resize-listener.js.map +1 -0
- package/dist/scanner.d.ts +3 -0
- package/dist/scanner.d.ts.map +1 -0
- package/dist/scanner.js +153 -0
- package/dist/scanner.js.map +1 -0
- package/dist/scroll-listeners.d.ts +2 -0
- package/dist/scroll-listeners.d.ts.map +1 -0
- package/dist/scroll-listeners.js +37 -0
- package/dist/scroll-listeners.js.map +1 -0
- package/dist/state.d.ts +7 -0
- package/dist/state.d.ts.map +1 -0
- package/dist/state.js +16 -0
- package/dist/state.js.map +1 -0
- package/dist/task-queue.d.ts +5 -6
- package/dist/task-queue.d.ts.map +1 -1
- package/dist/task-queue.js +30 -25
- package/dist/task-queue.js.map +1 -1
- package/dist/types.d.ts +227 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/are-elements-with-issues-equal.d.ts +3 -0
- package/dist/utils/are-elements-with-issues-equal.d.ts.map +1 -0
- package/dist/utils/are-elements-with-issues-equal.js +5 -0
- package/dist/utils/are-elements-with-issues-equal.js.map +1 -0
- package/dist/utils/are-issue-sets-equal.d.ts +3 -0
- package/dist/utils/are-issue-sets-equal.d.ts.map +1 -0
- package/dist/utils/are-issue-sets-equal.js +6 -0
- package/dist/utils/are-issue-sets-equal.js.map +1 -0
- package/dist/utils/containing-blocks.d.ts +3 -0
- package/dist/utils/containing-blocks.d.ts.map +1 -0
- package/dist/utils/containing-blocks.js +46 -0
- package/dist/utils/containing-blocks.js.map +1 -0
- package/dist/utils/contains.d.ts +2 -0
- package/dist/utils/contains.d.ts.map +1 -0
- package/dist/utils/contains.js +19 -0
- package/dist/utils/contains.js.map +1 -0
- package/dist/utils/deduplicate-nodes.d.ts +2 -0
- package/dist/utils/deduplicate-nodes.d.ts.map +1 -0
- package/dist/utils/deduplicate-nodes.js +4 -0
- package/dist/utils/deduplicate-nodes.js.map +1 -0
- package/dist/utils/deep-merge.d.ts +4 -0
- package/dist/utils/deep-merge.d.ts.map +1 -0
- package/dist/utils/deep-merge.js +21 -0
- package/dist/utils/deep-merge.js.map +1 -0
- package/dist/utils/dom-helpers.d.ts +9 -0
- package/dist/utils/dom-helpers.d.ts.map +1 -0
- package/dist/utils/dom-helpers.js +34 -0
- package/dist/utils/dom-helpers.js.map +1 -0
- package/dist/utils/ensure-non-empty.d.ts +2 -0
- package/dist/utils/ensure-non-empty.d.ts.map +1 -0
- package/dist/utils/ensure-non-empty.js +7 -0
- package/dist/utils/ensure-non-empty.js.map +1 -0
- package/dist/utils/get-element-html.d.ts +2 -0
- package/dist/utils/get-element-html.d.ts.map +1 -0
- package/dist/utils/get-element-html.js +16 -0
- package/dist/utils/get-element-html.js.map +1 -0
- package/dist/utils/get-element-position.d.ts +11 -0
- package/dist/utils/get-element-position.d.ts.map +1 -0
- package/dist/utils/get-element-position.js +70 -0
- package/dist/utils/get-element-position.js.map +1 -0
- package/dist/utils/get-parent.d.ts +2 -0
- package/dist/utils/get-parent.d.ts.map +1 -0
- package/dist/utils/get-parent.js +12 -0
- package/dist/utils/get-parent.js.map +1 -0
- package/dist/utils/get-scan-context.d.ts +3 -0
- package/dist/utils/get-scan-context.d.ts.map +1 -0
- package/dist/utils/get-scan-context.js +28 -0
- package/dist/utils/get-scan-context.js.map +1 -0
- package/dist/utils/get-scrollable-ancestors.d.ts +2 -0
- package/dist/utils/get-scrollable-ancestors.d.ts.map +1 -0
- package/dist/utils/get-scrollable-ancestors.js +19 -0
- package/dist/utils/get-scrollable-ancestors.js.map +1 -0
- package/dist/utils/is-node-in-scan-context.d.ts +3 -0
- package/dist/utils/is-node-in-scan-context.d.ts.map +1 -0
- package/dist/utils/is-node-in-scan-context.js +26 -0
- package/dist/utils/is-node-in-scan-context.js.map +1 -0
- package/dist/utils/is-non-empty.d.ts +2 -0
- package/dist/utils/is-non-empty.d.ts.map +1 -0
- package/dist/utils/is-non-empty.js +4 -0
- package/dist/utils/is-non-empty.js.map +1 -0
- package/dist/utils/normalize-context.d.ts +3 -0
- package/dist/utils/normalize-context.d.ts.map +1 -0
- package/dist/utils/normalize-context.js +59 -0
- package/dist/utils/normalize-context.js.map +1 -0
- package/dist/utils/recalculate-positions.d.ts +2 -0
- package/dist/utils/recalculate-positions.d.ts.map +1 -0
- package/dist/utils/recalculate-positions.js +27 -0
- package/dist/utils/recalculate-positions.js.map +1 -0
- package/dist/utils/recalculate-scrollable-ancestors.d.ts +2 -0
- package/dist/utils/recalculate-scrollable-ancestors.d.ts.map +1 -0
- package/dist/utils/recalculate-scrollable-ancestors.js +13 -0
- package/dist/utils/recalculate-scrollable-ancestors.js.map +1 -0
- package/dist/utils/shadow-dom-aware-mutation-observer.d.ts +10 -0
- package/dist/utils/shadow-dom-aware-mutation-observer.d.ts.map +1 -0
- package/dist/utils/shadow-dom-aware-mutation-observer.js +61 -0
- package/dist/utils/shadow-dom-aware-mutation-observer.js.map +1 -0
- package/dist/utils/supports-anchor-positioning.d.ts +6 -0
- package/dist/utils/supports-anchor-positioning.d.ts.map +1 -0
- package/dist/utils/supports-anchor-positioning.js +4 -0
- package/dist/utils/supports-anchor-positioning.js.map +1 -0
- package/dist/utils/transform-violations.d.ts +4 -0
- package/dist/utils/transform-violations.d.ts.map +1 -0
- package/dist/utils/transform-violations.js +61 -0
- package/dist/utils/transform-violations.js.map +1 -0
- package/dist/utils/update-elements-with-issues.d.ts +13 -0
- package/dist/utils/update-elements-with-issues.d.ts.map +1 -0
- package/dist/utils/update-elements-with-issues.js +96 -0
- package/dist/utils/update-elements-with-issues.js.map +1 -0
- package/dist/validate-options.d.ts +3 -0
- package/dist/validate-options.d.ts.map +1 -0
- package/dist/validate-options.js +129 -0
- package/dist/validate-options.js.map +1 -0
- package/package.json +21 -8
- package/src/accented.test.ts +24 -0
- package/src/accented.ts +130 -0
- package/src/common/tokens.ts +10 -0
- package/src/constants.ts +3 -0
- package/src/dom-updater.ts +165 -0
- package/src/elements/accented-dialog.ts +419 -0
- package/src/elements/accented-trigger.ts +251 -0
- package/src/fullscreen-listener.ts +21 -0
- package/src/intersection-observer.ts +39 -0
- package/src/log-and-rethrow.ts +8 -0
- package/src/logger.ts +36 -0
- package/src/register-elements.ts +21 -0
- package/src/resize-listener.ts +21 -0
- package/src/scanner.ts +195 -0
- package/src/scroll-listeners.ts +45 -0
- package/src/state.ts +35 -0
- package/src/task-queue.test.ts +136 -0
- package/src/task-queue.ts +61 -0
- package/src/types.ts +258 -0
- package/src/utils/are-elements-with-issues-equal.ts +11 -0
- package/src/utils/are-issue-sets-equal.test.ts +53 -0
- package/src/utils/are-issue-sets-equal.ts +12 -0
- package/src/utils/containing-blocks.ts +60 -0
- package/src/utils/contains.test.ts +54 -0
- package/src/utils/contains.ts +19 -0
- package/src/utils/deduplicate-nodes.ts +3 -0
- package/src/utils/deep-merge.test.ts +41 -0
- package/src/utils/deep-merge.ts +24 -0
- package/src/utils/dom-helpers.ts +42 -0
- package/src/utils/ensure-non-empty.ts +6 -0
- package/src/utils/get-element-html.ts +15 -0
- package/src/utils/get-element-position.ts +89 -0
- package/src/utils/get-parent.ts +14 -0
- package/src/utils/get-scan-context.test.ts +85 -0
- package/src/utils/get-scan-context.ts +36 -0
- package/src/utils/get-scrollable-ancestors.ts +22 -0
- package/src/utils/is-node-in-scan-context.test.ts +70 -0
- package/src/utils/is-node-in-scan-context.ts +29 -0
- package/src/utils/is-non-empty.ts +3 -0
- package/src/utils/normalize-context.test.ts +105 -0
- package/src/utils/normalize-context.ts +65 -0
- package/src/utils/recalculate-positions.ts +27 -0
- package/src/utils/recalculate-scrollable-ancestors.ts +13 -0
- package/src/utils/shadow-dom-aware-mutation-observer.ts +75 -0
- package/src/utils/supports-anchor-positioning.ts +7 -0
- package/src/utils/transform-violations.test.ts +128 -0
- package/src/utils/transform-violations.ts +74 -0
- package/src/utils/update-elements-with-issues.test.ts +371 -0
- package/src/utils/update-elements-with-issues.ts +144 -0
- package/src/validate-options.ts +184 -0
- package/dist/utils/issuesToElements.d.ts +0 -3
- package/dist/utils/issuesToElements.d.ts.map +0 -1
- package/dist/utils/issuesToElements.js +0 -16
- package/dist/utils/issuesToElements.js.map +0 -1
package/NOTICE
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
NOTICE
|
|
2
|
+
|
|
3
|
+
This project, Accented, is licensed under the MIT License.
|
|
4
|
+
|
|
5
|
+
However, it depends on axe-core, which is licensed under the Mozilla Public License 2.0 (MPL-2.0). The source code for axe-core is available at:
|
|
6
|
+
|
|
7
|
+
https://github.com/dequelabs/axe-core
|
|
8
|
+
|
|
9
|
+
According to the MPL-2.0 requirements:
|
|
10
|
+
- Any modifications made to axe-core within this project will remain under the MPL-2.0 license.
|
|
11
|
+
- The original license and notices for axe-core are preserved.
|
|
12
|
+
- The full MPL-2.0 license can be found at: https://www.mozilla.org/MPL/2.0/
|
|
13
|
+
|
|
14
|
+
No changes have been made to axe-core within this project, beyond its use as a dependency.
|
package/README.md
ADDED
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
<a href="https://www.accented.dev">
|
|
2
|
+
<img alt="Accented" src="https://www.accented.dev/images/logo.svg" width="100" />
|
|
3
|
+
</a>
|
|
4
|
+
|
|
5
|
+
# Accented
|
|
6
|
+
|
|
7
|
+
A frontend library for continuous accessibility testing and issue highlighting.
|
|
8
|
+
|
|
9
|
+
## What is Accented?
|
|
10
|
+
|
|
11
|
+
Accented is a visual library based on [axe-core](https://github.com/dequelabs/axe-core) that helps identify issues as soon as they are introduced.
|
|
12
|
+
|
|
13
|
+
It adds interactive visual callouts for all accessibility issues that axe-core identifies.
|
|
14
|
+
|
|
15
|
+
Example — without Accented vs. with Accented:
|
|
16
|
+
|
|
17
|
+

|
|
18
|
+
|
|
19
|
+
[Try it out at the Playground (StackBlitz).](https://stackblitz.com/edit/accented-playground-react-ts?file=src%2Fmain.tsx)
|
|
20
|
+
|
|
21
|
+
Accented can complement other tools commonly used for accessibility testing:
|
|
22
|
+
|
|
23
|
+
- **It can find more issues than source code linting.** The popular [`eslint-plugin-jsx-a11y`](https://www.npmjs.com/package/eslint-plugin-jsx-a11y) is great, and linters validate the whole codebase, but some issues can only be detected on the rendered page. For example, the linter cannot find issues with color contrast or heading order. Besides, Accented is not framework-specific.
|
|
24
|
+
- **It’s embedded into the project code, with no setup required in the browser or code editor.** You’d get a similar audit from [Lighthouse](https://developer.chrome.com/docs/lighthouse/overview) or [axe DevTools](https://www.deque.com/axe/devtools/), but with Accented, you don’t need a browser extension, and the results are always up to date.
|
|
25
|
+
- **You don’t need to write any extra code, unlike with adding accessibility tests to a test suite.** You can test for accessibility issues in your test suite, for example using [`@axe-core/playwright`](https://www.npmjs.com/package/@axe-core/playwright). For that, however, you need to write a test case for every state of the application that you want to test. Accented instead automatically tests anything that’s currently on the page in your browser.
|
|
26
|
+
|
|
27
|
+
Learn more about Accented at [accented.dev](https://www.accented.dev).
|
|
28
|
+
|
|
29
|
+
## Installation and usage
|
|
30
|
+
|
|
31
|
+
Install:
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
npm install --save-dev accented
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
Import and run at any moment during your app’s initialization:
|
|
38
|
+
|
|
39
|
+
```js
|
|
40
|
+
if (isDevelopment) {
|
|
41
|
+
const { accented } = await import("accented");
|
|
42
|
+
accented();
|
|
43
|
+
}
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
⚠️ **Heads up!**
|
|
47
|
+
Don’t expose Accented to your users.
|
|
48
|
+
It’s for development use only.
|
|
49
|
+
|
|
50
|
+
See the docs for your bundler or framework for how to run code only in the development environment.
|
|
51
|
+
|
|
52
|
+
- [More detailed installation and usage guide](https://www.accented.dev/getting-started)
|
|
53
|
+
- [Full API](https://www.accented.dev/api)
|
|
54
|
+
|
|
55
|
+
## More info
|
|
56
|
+
|
|
57
|
+
- [Accessibility](https://www.accented.dev/about#accessibility) (how accessible is Accented itself?)
|
|
58
|
+
- [Performance](https://www.accented.dev/how-it-works#performance) (does Accented affect runtime performance of my app?)
|
|
59
|
+
- [Browser support](https://www.accented.dev/about#browser-support) (will Accented work for me and my teammates?)
|
|
60
|
+
- [Versioning policy](https://www.accented.dev/about#versioning) (Accented follows [SemVer](https://semver.org/))
|
|
61
|
+
- [Changelog](https://github.com/pomerantsev/accented/blob/main/packages/accented/CHANGELOG.md)
|
|
62
|
+
|
|
63
|
+
## Contributing
|
|
64
|
+
|
|
65
|
+
Contributions are welcome!
|
|
66
|
+
|
|
67
|
+
- See [CONTRIBUTING.md](https://github.com/pomerantsev/accented/blob/main/CONTRIBUTING.md) for setup instructions and guidelines.
|
|
68
|
+
- Open an [issue](https://github.com/pomerantsev/accented/issues) or pull request if you spot a bug or want to propose a new feature.
|
|
69
|
+
- See [Milestones](https://github.com/pomerantsev/accented/milestones) to learn about our plans for Accented.
|
|
70
|
+
|
|
71
|
+
Have feedback or ideas? Contact Pavel at [hello@pavelpomerantsev.com](mailto:hello@pavelpomerantsev.com).
|
package/dist/accented.d.ts
CHANGED
|
@@ -1,8 +1,29 @@
|
|
|
1
|
-
type
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import type { AccentedOptions, DisableAccented } from './types.ts';
|
|
2
|
+
export type { AccentedOptions, DisableAccented };
|
|
3
|
+
/**
|
|
4
|
+
* Enables the continuous scanning and highlighting of accessibility issues on the page.
|
|
5
|
+
*
|
|
6
|
+
* @param {AccentedOptions} options - The options object (optional).
|
|
7
|
+
*
|
|
8
|
+
* @returns A `disable` function that takes no parameters. When called, disables the scanning and highlighting, and cleans up any changes that Accented has made to the page.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* accented();
|
|
12
|
+
*
|
|
13
|
+
* @example
|
|
14
|
+
* const disableAccented = accented({
|
|
15
|
+
* output: {
|
|
16
|
+
* console: false
|
|
17
|
+
* },
|
|
18
|
+
* throttle: {
|
|
19
|
+
* wait: 500,
|
|
20
|
+
* leading: false
|
|
21
|
+
* },
|
|
22
|
+
* callback: ({ elementsWithIssues, performance }) => {
|
|
23
|
+
* console.log('Elements with issues:', elementsWithIssues);
|
|
24
|
+
* console.log('Total blocking time:', performance.totalBlockingTime);
|
|
25
|
+
* }
|
|
26
|
+
* });
|
|
27
|
+
*/
|
|
28
|
+
export declare function accented(options?: AccentedOptions): DisableAccented;
|
|
8
29
|
//# sourceMappingURL=accented.d.ts.map
|
package/dist/accented.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accented.d.ts","sourceRoot":"","sources":["../src/accented.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"accented.d.ts","sourceRoot":"","sources":["../src/accented.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAMnE,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,CAAC;AAEjD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,QAAQ,CAAC,OAAO,GAAE,eAAoB,GAAG,eAAe,CAsFvE"}
|
package/dist/accented.js
CHANGED
|
@@ -1,46 +1,111 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
};
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
1
|
+
import { createDomUpdater } from './dom-updater.js';
|
|
2
|
+
import { setupResizeListener as setupFullscreenListener } from './fullscreen-listener.js';
|
|
3
|
+
import { setupIntersectionObserver } from './intersection-observer.js';
|
|
4
|
+
import { logAndRethrow } from './log-and-rethrow.js';
|
|
5
|
+
import { createLogger } from './logger.js';
|
|
6
|
+
import { registerElements } from './register-elements.js';
|
|
7
|
+
import { setupResizeListener } from './resize-listener.js';
|
|
8
|
+
import { createScanner } from './scanner.js';
|
|
9
|
+
import { setupScrollListeners } from './scroll-listeners.js';
|
|
10
|
+
import { enabled, extendedElementsWithIssues } from './state.js';
|
|
11
|
+
import { initializeContainingBlockSupportSet } from './utils/containing-blocks.js';
|
|
12
|
+
import { deepMerge } from './utils/deep-merge.js';
|
|
13
|
+
import { supportsAnchorPositioning } from './utils/supports-anchor-positioning.js';
|
|
14
|
+
import { validateOptions } from './validate-options.js';
|
|
15
|
+
/**
|
|
16
|
+
* Enables the continuous scanning and highlighting of accessibility issues on the page.
|
|
17
|
+
*
|
|
18
|
+
* @param {AccentedOptions} options - The options object (optional).
|
|
19
|
+
*
|
|
20
|
+
* @returns A `disable` function that takes no parameters. When called, disables the scanning and highlighting, and cleans up any changes that Accented has made to the page.
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* accented();
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* const disableAccented = accented({
|
|
27
|
+
* output: {
|
|
28
|
+
* console: false
|
|
29
|
+
* },
|
|
30
|
+
* throttle: {
|
|
31
|
+
* wait: 500,
|
|
32
|
+
* leading: false
|
|
33
|
+
* },
|
|
34
|
+
* callback: ({ elementsWithIssues, performance }) => {
|
|
35
|
+
* console.log('Elements with issues:', elementsWithIssues);
|
|
36
|
+
* console.log('Total blocking time:', performance.totalBlockingTime);
|
|
37
|
+
* }
|
|
38
|
+
* });
|
|
39
|
+
*/
|
|
40
|
+
export function accented(options = {}) {
|
|
41
|
+
validateOptions(options);
|
|
42
|
+
try {
|
|
43
|
+
if (typeof window === 'undefined' || typeof document === 'undefined') {
|
|
44
|
+
console.warn('Accented: this script can only run in the browser, and it’s likely running on the server now. Exiting.');
|
|
45
|
+
console.trace();
|
|
46
|
+
return () => { };
|
|
26
47
|
}
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
48
|
+
const defaultOutput = {
|
|
49
|
+
console: true,
|
|
50
|
+
};
|
|
51
|
+
const defaultThrottle = {
|
|
52
|
+
wait: 1000,
|
|
53
|
+
leading: true,
|
|
54
|
+
};
|
|
55
|
+
// IMPORTANT: when changing any of the properties or values, also do the following:
|
|
56
|
+
// * update the default value in the type documentation accordingly;
|
|
57
|
+
// * update validations and validation tests if necessary;
|
|
58
|
+
// * update examples in the accented() function JSDoc;
|
|
59
|
+
// * update examples in the Readme.
|
|
60
|
+
const defaultOptions = {
|
|
61
|
+
context: document,
|
|
62
|
+
axeOptions: {},
|
|
63
|
+
name: 'accented',
|
|
64
|
+
output: defaultOutput,
|
|
65
|
+
throttle: defaultThrottle,
|
|
66
|
+
callback: () => { },
|
|
67
|
+
};
|
|
68
|
+
const { context, axeOptions, name, output, throttle, callback } = deepMerge(defaultOptions, options);
|
|
69
|
+
if (enabled.value) {
|
|
70
|
+
console.warn('You are trying to run the Accented library more than once, which may lead to errors. See https://www.accented.dev/getting-started#run-once-per-page');
|
|
71
|
+
console.trace();
|
|
37
72
|
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
73
|
+
enabled.value = true;
|
|
74
|
+
initializeContainingBlockSupportSet();
|
|
75
|
+
registerElements(name);
|
|
76
|
+
const { disconnect: cleanupIntersectionObserver, intersectionObserver } = setupIntersectionObserver();
|
|
77
|
+
const cleanupScanner = createScanner(name, context, axeOptions, throttle, callback);
|
|
78
|
+
const cleanupDomUpdater = createDomUpdater(name, intersectionObserver);
|
|
79
|
+
const cleanupLogger = output.console ? createLogger() : () => { };
|
|
80
|
+
const cleanupScrollListeners = setupScrollListeners();
|
|
81
|
+
const cleanupResizeListener = supportsAnchorPositioning(window)
|
|
82
|
+
? () => { }
|
|
83
|
+
: setupResizeListener();
|
|
84
|
+
const cleanupFullscreenListener = supportsAnchorPositioning(window)
|
|
85
|
+
? () => { }
|
|
86
|
+
: setupFullscreenListener();
|
|
87
|
+
return () => {
|
|
88
|
+
try {
|
|
89
|
+
enabled.value = false;
|
|
90
|
+
extendedElementsWithIssues.value = [];
|
|
91
|
+
cleanupScanner();
|
|
92
|
+
cleanupDomUpdater();
|
|
93
|
+
cleanupLogger();
|
|
94
|
+
cleanupScrollListeners();
|
|
95
|
+
cleanupResizeListener();
|
|
96
|
+
cleanupFullscreenListener();
|
|
97
|
+
if (cleanupIntersectionObserver) {
|
|
98
|
+
cleanupIntersectionObserver();
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
catch (error) {
|
|
102
|
+
logAndRethrow(error);
|
|
103
|
+
}
|
|
104
|
+
};
|
|
105
|
+
}
|
|
106
|
+
catch (error) {
|
|
107
|
+
logAndRethrow(error);
|
|
108
|
+
return () => { };
|
|
109
|
+
}
|
|
45
110
|
}
|
|
46
111
|
//# sourceMappingURL=accented.js.map
|
package/dist/accented.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accented.js","sourceRoot":"","sources":["../src/accented.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"accented.js","sourceRoot":"","sources":["../src/accented.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const primaryColorDark = "oklch(0.5 0.3 0)";
|
|
2
|
+
export declare const primaryColorLight = "oklch(0.8 0.2 0)";
|
|
3
|
+
export declare const colorLight = "oklch(0.98 0 0)";
|
|
4
|
+
export declare const colorDark = "oklch(0.22 0 0)";
|
|
5
|
+
export declare const fontSystemSans = "-apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, Adwaita Sans, Cantarell, Ubuntu, roboto, noto, helvetica, arial, sans-serif";
|
|
6
|
+
export declare const fontSystemMono = "Menlo, Consolas, Monaco, Adwaita Mono, Liberation Mono, Lucida Console, monospace";
|
|
7
|
+
//# sourceMappingURL=tokens.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/common/tokens.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB,qBAAqB,CAAC;AACnD,eAAO,MAAM,iBAAiB,qBAAqB,CAAC;AACpD,eAAO,MAAM,UAAU,oBAAoB,CAAC;AAC5C,eAAO,MAAM,SAAS,oBAAoB,CAAC;AAG3C,eAAO,MAAM,cAAc,kKACsI,CAAC;AAClK,eAAO,MAAM,cAAc,sFAC0D,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export const primaryColorDark = 'oklch(0.5 0.3 0)';
|
|
2
|
+
export const primaryColorLight = 'oklch(0.8 0.2 0)';
|
|
3
|
+
export const colorLight = 'oklch(0.98 0 0)';
|
|
4
|
+
export const colorDark = 'oklch(0.22 0 0)';
|
|
5
|
+
/* https://systemfontstack.com/ */
|
|
6
|
+
export const fontSystemSans = '-apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, Adwaita Sans, Cantarell, Ubuntu, roboto, noto, helvetica, arial, sans-serif';
|
|
7
|
+
export const fontSystemMono = 'Menlo, Consolas, Monaco, Adwaita Mono, Liberation Mono, Lucida Console, monospace';
|
|
8
|
+
//# sourceMappingURL=tokens.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../../src/common/tokens.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,kBAAkB,CAAC;AACnD,MAAM,CAAC,MAAM,iBAAiB,GAAG,kBAAkB,CAAC;AACpD,MAAM,CAAC,MAAM,UAAU,GAAG,iBAAiB,CAAC;AAC5C,MAAM,CAAC,MAAM,SAAS,GAAG,iBAAiB,CAAC;AAE3C,kCAAkC;AAClC,MAAM,CAAC,MAAM,cAAc,GACzB,+JAA+J,CAAC;AAClK,MAAM,CAAC,MAAM,cAAc,GACzB,mFAAmF,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,6BAA6B,CAAC;AACtD,eAAO,MAAM,SAAS,mDAAmD,CAAC;AAC1E,eAAO,MAAM,uBAAuB,GAAI,MAAM,MAAM,aAA0C,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG,0BAA0B,CAAC;AACtD,MAAM,CAAC,MAAM,SAAS,GAAG,gDAAgD,CAAC;AAC1E,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,IAAY,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,UAAU,EAAE,GAAG,IAAI,SAAS,CAAC,CAAC"}
|
package/dist/dom-updater.d.ts
CHANGED
|
@@ -1,7 +1,2 @@
|
|
|
1
|
-
export
|
|
2
|
-
#private;
|
|
3
|
-
elements: Array<Element>;
|
|
4
|
-
constructor();
|
|
5
|
-
update(newElements: Array<Element>): void;
|
|
6
|
-
}
|
|
1
|
+
export declare function createDomUpdater(name: string, intersectionObserver?: IntersectionObserver): () => void;
|
|
7
2
|
//# sourceMappingURL=dom-updater.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom-updater.d.ts","sourceRoot":"","sources":["../src/dom-updater.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"dom-updater.d.ts","sourceRoot":"","sources":["../src/dom-updater.ts"],"names":[],"mappings":"AAiCA,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,oBAAoB,CAAC,EAAE,oBAAoB,cAmIzF"}
|
package/dist/dom-updater.js
CHANGED
|
@@ -1,29 +1,145 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import { effect } from '@preact/signals-core';
|
|
2
|
+
import { primaryColorDark } from './common/tokens.js';
|
|
3
|
+
import { extendedElementsWithIssues, rootNodes } from './state.js';
|
|
4
|
+
import { areElementsWithIssuesEqual } from './utils/are-elements-with-issues-equal.js';
|
|
5
|
+
import { isDocument, isDocumentFragment, isShadowRoot } from './utils/dom-helpers.js';
|
|
6
|
+
import { getParent } from './utils/get-parent.js';
|
|
7
|
+
import { supportsAnchorPositioning } from './utils/supports-anchor-positioning.js';
|
|
8
|
+
const shouldInsertTriggerInsideElement = (element) => {
|
|
9
|
+
/**
|
|
10
|
+
* No parent means that the element is a root node,
|
|
11
|
+
* which cannot have siblings.
|
|
12
|
+
*/
|
|
13
|
+
const noParent = !getParent(element);
|
|
14
|
+
/**
|
|
15
|
+
* Table cells get a special treatment because if a sibling to a TH or TD is inserted,
|
|
16
|
+
* it alters the table layout, no matter how that sibling is positioned.
|
|
17
|
+
* We don't want tables to look broken, so we're inserting the trigger inside the table cell.
|
|
18
|
+
*/
|
|
19
|
+
const isTableCell = element.nodeName === 'TH' || element.nodeName === 'TD';
|
|
20
|
+
/**
|
|
21
|
+
* We want to put the trigger inside the <summary> element,
|
|
22
|
+
* because otherwise it will be hidden by the browser when the <details> element is collapsed
|
|
23
|
+
* (since none of the siblings of <summary> are visible then).
|
|
24
|
+
*/
|
|
25
|
+
const isSummary = element.nodeName === 'SUMMARY';
|
|
26
|
+
return noParent || isTableCell || isSummary;
|
|
27
|
+
};
|
|
28
|
+
export function createDomUpdater(name, intersectionObserver) {
|
|
29
|
+
const attrName = `data-${name}`;
|
|
30
|
+
function getAnchorNames(anchorNameValue) {
|
|
31
|
+
return anchorNameValue
|
|
32
|
+
.split(',')
|
|
33
|
+
.map((anchorName) => anchorName.trim())
|
|
34
|
+
.filter((anchorName) => anchorName.startsWith('--'));
|
|
6
35
|
}
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
36
|
+
function setAnchorName(elementWithIssues) {
|
|
37
|
+
const { element, id, anchorNameValue } = elementWithIssues;
|
|
38
|
+
const anchorNames = getAnchorNames(anchorNameValue);
|
|
39
|
+
if (anchorNames.length > 0) {
|
|
40
|
+
element.style.setProperty('anchor-name', `${anchorNameValue}, --${name}-anchor-${id}`);
|
|
10
41
|
}
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
element.setAttribute(attrName, '');
|
|
42
|
+
else {
|
|
43
|
+
element.style.setProperty('anchor-name', `--${name}-anchor-${id}`);
|
|
14
44
|
}
|
|
15
45
|
}
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
|
|
46
|
+
function removeAnchorName(elementWithIssues) {
|
|
47
|
+
const { element, anchorNameValue } = elementWithIssues;
|
|
48
|
+
const anchorNames = getAnchorNames(anchorNameValue);
|
|
49
|
+
if (anchorNames.length > 0) {
|
|
50
|
+
element.style.setProperty('anchor-name', anchorNames.join(', '));
|
|
51
|
+
}
|
|
52
|
+
else {
|
|
53
|
+
element.style.removeProperty('anchor-name');
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
function setIssues(extendedElementsWithIssues) {
|
|
57
|
+
for (const elementWithIssues of extendedElementsWithIssues) {
|
|
58
|
+
if (elementWithIssues.skipRender) {
|
|
59
|
+
continue;
|
|
60
|
+
}
|
|
61
|
+
elementWithIssues.element.setAttribute(attrName, elementWithIssues.id.toString());
|
|
62
|
+
if (supportsAnchorPositioning(window)) {
|
|
63
|
+
setAnchorName(elementWithIssues);
|
|
64
|
+
}
|
|
65
|
+
if (shouldInsertTriggerInsideElement(elementWithIssues.element)) {
|
|
66
|
+
elementWithIssues.element.insertAdjacentElement('beforeend', elementWithIssues.trigger);
|
|
67
|
+
}
|
|
68
|
+
else {
|
|
69
|
+
elementWithIssues.element.insertAdjacentElement('afterend', elementWithIssues.trigger);
|
|
70
|
+
}
|
|
71
|
+
if (intersectionObserver) {
|
|
72
|
+
intersectionObserver.observe(elementWithIssues.element);
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
function removeIssues(extendedElementsWithIssues) {
|
|
77
|
+
for (const elementWithIssues of extendedElementsWithIssues) {
|
|
78
|
+
if (elementWithIssues.skipRender) {
|
|
79
|
+
continue;
|
|
80
|
+
}
|
|
81
|
+
elementWithIssues.element.removeAttribute(attrName);
|
|
82
|
+
if (supportsAnchorPositioning(window)) {
|
|
83
|
+
removeAnchorName(elementWithIssues);
|
|
84
|
+
}
|
|
85
|
+
elementWithIssues.trigger.remove();
|
|
86
|
+
if (intersectionObserver) {
|
|
87
|
+
intersectionObserver.unobserve(elementWithIssues.element);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
const stylesheet = new CSSStyleSheet();
|
|
92
|
+
stylesheet.replaceSync(`
|
|
93
|
+
@layer ${name} {
|
|
94
|
+
:root {
|
|
95
|
+
/* Ensure that the primary / secondary color combination meets WCAG 1.4.3 Contrast (Minimum) */
|
|
96
|
+
/* OKLCH stuff: https://oklch.com/ */
|
|
97
|
+
--${name}-primary-color: ${primaryColorDark};
|
|
98
|
+
--${name}-secondary-color: oklch(0.98 0 0);
|
|
99
|
+
--${name}-outline-width: 2px;
|
|
100
|
+
--${name}-outline-style: solid;
|
|
101
|
+
}
|
|
102
|
+
|
|
21
103
|
[${attrName}]:not(:focus-visible) {
|
|
22
|
-
outline:
|
|
23
|
-
outline-offset: -
|
|
104
|
+
outline-width: var(--${name}-outline-width) !important;
|
|
105
|
+
outline-offset: calc(-1 * var(--${name}-outline-width)) !important;
|
|
106
|
+
outline-color: var(--${name}-primary-color) !important;
|
|
107
|
+
outline-style: var(--${name}-outline-style) !important;
|
|
24
108
|
}
|
|
25
|
-
`;
|
|
26
|
-
document.head.appendChild(styleElement);
|
|
27
109
|
}
|
|
110
|
+
`);
|
|
111
|
+
let previousExtendedElementsWithIssues = [];
|
|
112
|
+
let previousRootNodes = new Set();
|
|
113
|
+
const disposeOfStyleSheetsEffect = effect(() => {
|
|
114
|
+
const newRootNodes = rootNodes.value;
|
|
115
|
+
const addedRootNodes = [...newRootNodes].filter((rootNode) => !previousRootNodes.has(rootNode));
|
|
116
|
+
const removedRootNodes = [...previousRootNodes].filter((rootNode) => !newRootNodes.has(rootNode));
|
|
117
|
+
for (const rootNode of addedRootNodes) {
|
|
118
|
+
if (isDocument(rootNode) || (isDocumentFragment(rootNode) && isShadowRoot(rootNode))) {
|
|
119
|
+
rootNode.adoptedStyleSheets.push(stylesheet);
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
for (const rootNode of removedRootNodes) {
|
|
123
|
+
if (isDocument(rootNode) || (isDocumentFragment(rootNode) && isShadowRoot(rootNode))) {
|
|
124
|
+
rootNode.adoptedStyleSheets.splice(rootNode.adoptedStyleSheets.indexOf(stylesheet), 1);
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
previousRootNodes = newRootNodes;
|
|
128
|
+
});
|
|
129
|
+
const disposeOfElementsEffect = effect(() => {
|
|
130
|
+
const added = extendedElementsWithIssues.value.filter((elementWithIssues) => {
|
|
131
|
+
return !previousExtendedElementsWithIssues.some((previousElementWithIssues) => areElementsWithIssuesEqual(previousElementWithIssues, elementWithIssues));
|
|
132
|
+
});
|
|
133
|
+
const removed = previousExtendedElementsWithIssues.filter((previousElementWithIssues) => {
|
|
134
|
+
return !extendedElementsWithIssues.value.some((elementWithIssues) => areElementsWithIssuesEqual(elementWithIssues, previousElementWithIssues));
|
|
135
|
+
});
|
|
136
|
+
removeIssues(removed);
|
|
137
|
+
setIssues(added);
|
|
138
|
+
previousExtendedElementsWithIssues = [...extendedElementsWithIssues.value];
|
|
139
|
+
});
|
|
140
|
+
return () => {
|
|
141
|
+
disposeOfStyleSheetsEffect();
|
|
142
|
+
disposeOfElementsEffect();
|
|
143
|
+
};
|
|
28
144
|
}
|
|
29
145
|
//# sourceMappingURL=dom-updater.js.map
|
package/dist/dom-updater.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dom-updater.js","sourceRoot":"","sources":["../src/dom-updater.ts"],"names":[],"mappings":"AAAA,MAAM,QAAQ,GAAG,
|
|
1
|
+
{"version":3,"file":"dom-updater.js","sourceRoot":"","sources":["../src/dom-updater.ts"],"names":[],"mappings":"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"}
|