@trebired/frontend 23.2.0 → 25.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/CHANGELOG.md +96 -0
- package/README.md +78 -3
- package/dist/a11y/announce.d.ts +5 -0
- package/dist/a11y/announce.d.ts.map +1 -0
- package/dist/a11y/announce.js +38 -0
- package/dist/a11y/announce.js.map +1 -0
- package/dist/a11y/apply.d.ts +13 -0
- package/dist/a11y/apply.d.ts.map +1 -0
- package/dist/a11y/apply.js +81 -0
- package/dist/a11y/apply.js.map +1 -0
- package/dist/a11y/attributes.d.ts +17 -0
- package/dist/a11y/attributes.d.ts.map +1 -0
- package/dist/a11y/attributes.js +34 -0
- package/dist/a11y/attributes.js.map +1 -0
- package/dist/a11y/boot.d.ts +4 -0
- package/dist/a11y/boot.d.ts.map +1 -0
- package/dist/a11y/boot.js +30 -0
- package/dist/a11y/boot.js.map +1 -0
- package/dist/a11y/components/index.d.ts +13 -0
- package/dist/a11y/components/index.d.ts.map +1 -0
- package/dist/a11y/components/index.js +20 -0
- package/dist/a11y/components/index.js.map +1 -0
- package/dist/a11y/components/sections.d.ts +9 -0
- package/dist/a11y/components/sections.d.ts.map +1 -0
- package/dist/a11y/components/sections.js +45 -0
- package/dist/a11y/components/sections.js.map +1 -0
- package/dist/a11y/config.d.ts +12 -0
- package/dist/a11y/config.d.ts.map +1 -0
- package/dist/a11y/config.js +53 -0
- package/dist/a11y/config.js.map +1 -0
- package/dist/a11y/controls.d.ts +8 -0
- package/dist/a11y/controls.d.ts.map +1 -0
- package/dist/a11y/controls.js +78 -0
- package/dist/a11y/controls.js.map +1 -0
- package/dist/a11y/effects.d.ts +4 -0
- package/dist/a11y/effects.d.ts.map +1 -0
- package/dist/a11y/effects.js +14 -0
- package/dist/a11y/effects.js.map +1 -0
- package/dist/a11y/index.d.ts +15 -0
- package/dist/a11y/index.d.ts.map +1 -0
- package/dist/a11y/index.js +12 -0
- package/dist/a11y/index.js.map +1 -0
- package/dist/a11y/ratio.d.ts +16 -0
- package/dist/a11y/ratio.d.ts.map +1 -0
- package/dist/a11y/ratio.js +101 -0
- package/dist/a11y/ratio.js.map +1 -0
- package/dist/a11y/runtime.d.ts +11 -0
- package/dist/a11y/runtime.d.ts.map +1 -0
- package/dist/a11y/runtime.js +25 -0
- package/dist/a11y/runtime.js.map +1 -0
- package/dist/a11y/settings.d.ts +9 -0
- package/dist/a11y/settings.d.ts.map +1 -0
- package/dist/a11y/settings.js +41 -0
- package/dist/a11y/settings.js.map +1 -0
- package/dist/a11y/skip.d.ts +3 -0
- package/dist/a11y/skip.d.ts.map +1 -0
- package/dist/a11y/skip.js +22 -0
- package/dist/a11y/skip.js.map +1 -0
- package/dist/a11y/storage.d.ts +7 -0
- package/dist/a11y/storage.d.ts.map +1 -0
- package/dist/a11y/storage.js +49 -0
- package/dist/a11y/storage.js.map +1 -0
- package/dist/a11y/styles/_motion.scss +12 -0
- package/dist/a11y/styles/contrast.scss +23 -0
- package/dist/a11y/styles/forced.scss +69 -0
- package/dist/a11y/styles/index.scss +45 -0
- package/dist/a11y/styles/panel.scss +21 -0
- package/dist/a11y/styles/targets.scss +32 -0
- package/dist/a11y/types.d.ts +14 -0
- package/dist/a11y/types.d.ts.map +1 -0
- package/dist/a11y/types.js +2 -0
- package/dist/a11y/types.js.map +1 -0
- package/dist/actions/copy-components.d.ts +2 -0
- package/dist/actions/copy-components.d.ts.map +1 -1
- package/dist/actions/copy-components.js +1 -0
- package/dist/actions/copy-components.js.map +1 -1
- package/dist/actions/standard-buttons.d.ts +2 -1
- package/dist/actions/standard-buttons.d.ts.map +1 -1
- package/dist/actions/standard-buttons.js +1 -0
- package/dist/actions/standard-buttons.js.map +1 -1
- package/dist/actions/styles/index.scss +2 -2
- package/dist/config/a11y.d.ts +5 -0
- package/dist/config/a11y.d.ts.map +1 -0
- package/dist/config/a11y.js +66 -0
- package/dist/config/a11y.js.map +1 -0
- package/dist/config/default/component-tokens.d.ts +28 -8
- package/dist/config/default/component-tokens.d.ts.map +1 -1
- package/dist/config/default/component-tokens.js +94 -84
- package/dist/config/default/component-tokens.js.map +1 -1
- package/dist/config/default/config.d.ts +7 -0
- package/dist/config/default/config.d.ts.map +1 -0
- package/dist/config/default/config.js +104 -0
- package/dist/config/default/config.js.map +1 -0
- package/dist/config/glass.d.ts.map +1 -1
- package/dist/config/glass.js +10 -4
- package/dist/config/glass.js.map +1 -1
- package/dist/config/index.d.ts +7 -1
- package/dist/config/index.d.ts.map +1 -1
- package/dist/config/index.js +3 -0
- package/dist/config/index.js.map +1 -1
- package/dist/config/money.d.ts +5 -0
- package/dist/config/money.d.ts.map +1 -0
- package/dist/config/money.js +56 -0
- package/dist/config/money.js.map +1 -0
- package/dist/config/normalize.d.ts +2 -5
- package/dist/config/normalize.d.ts.map +1 -1
- package/dist/config/normalize.js +12 -97
- package/dist/config/normalize.js.map +1 -1
- package/dist/config/scales-css.d.ts.map +1 -1
- package/dist/config/scales-css.js +11 -5
- package/dist/config/scales-css.js.map +1 -1
- package/dist/config/scss.d.ts.map +1 -1
- package/dist/config/scss.js +19 -6
- package/dist/config/scss.js.map +1 -1
- package/dist/config/text-document.d.ts +18 -0
- package/dist/config/text-document.d.ts.map +1 -0
- package/dist/config/text-document.js +53 -0
- package/dist/config/text-document.js.map +1 -0
- package/dist/config/types/a11y.d.ts +17 -0
- package/dist/config/types/a11y.d.ts.map +1 -0
- package/dist/config/types/a11y.js +2 -0
- package/dist/config/types/a11y.js.map +1 -0
- package/dist/config/types/glass.d.ts +5 -1
- package/dist/config/types/glass.d.ts.map +1 -1
- package/dist/config/types/money.d.ts +14 -0
- package/dist/config/types/money.d.ts.map +1 -0
- package/dist/config/types/money.js +2 -0
- package/dist/config/types/money.js.map +1 -0
- package/dist/config/types.d.ts +9 -2
- package/dist/config/types.d.ts.map +1 -1
- package/dist/explorer/components/file/tree/keys.d.ts +14 -0
- package/dist/explorer/components/file/tree/keys.d.ts.map +1 -0
- package/dist/explorer/components/file/tree/keys.js +94 -0
- package/dist/explorer/components/file/tree/keys.js.map +1 -0
- package/dist/explorer/components/file/tree/row.d.ts.map +1 -1
- package/dist/explorer/components/file/tree/row.js +2 -2
- package/dist/explorer/components/file/tree/row.js.map +1 -1
- package/dist/explorer/components/file/tree.d.ts.map +1 -1
- package/dist/explorer/components/file/tree.js +2 -1
- package/dist/explorer/components/file/tree.js.map +1 -1
- package/dist/explorer/components/static-file-tree.d.ts.map +1 -1
- package/dist/explorer/components/static-file-tree.js +4 -3
- package/dist/explorer/components/static-file-tree.js.map +1 -1
- package/dist/flash/styles/index.scss +3 -3
- package/dist/fullscreen/styles/index.scss +3 -2
- package/dist/heading/index.js +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +11 -33
- package/dist/index.js.map +1 -1
- package/dist/inputs/advanced/checkbox/index.d.ts.map +1 -1
- package/dist/inputs/advanced/checkbox/index.js +4 -4
- package/dist/inputs/advanced/checkbox/index.js.map +1 -1
- package/dist/inputs/advanced/checkbox/styles.scss +14 -5
- package/dist/inputs/advanced/dropdown/index.d.ts.map +1 -1
- package/dist/inputs/advanced/dropdown/index.js +11 -8
- package/dist/inputs/advanced/dropdown/index.js.map +1 -1
- package/dist/inputs/advanced/dropdown/static/aria.d.ts +9 -0
- package/dist/inputs/advanced/dropdown/static/aria.d.ts.map +1 -0
- package/dist/inputs/advanced/dropdown/static/aria.js +47 -0
- package/dist/inputs/advanced/dropdown/static/aria.js.map +1 -0
- package/dist/inputs/advanced/dropdown/static/bind.d.ts.map +1 -1
- package/dist/inputs/advanced/dropdown/static/bind.js +25 -6
- package/dist/inputs/advanced/dropdown/static/bind.js.map +1 -1
- package/dist/inputs/advanced/dropdown/static/keys.d.ts +9 -0
- package/dist/inputs/advanced/dropdown/static/keys.d.ts.map +1 -0
- package/dist/inputs/advanced/dropdown/static/keys.js +69 -0
- package/dist/inputs/advanced/dropdown/static/keys.js.map +1 -0
- package/dist/inputs/advanced/dropdown/static/position.d.ts.map +1 -1
- package/dist/inputs/advanced/dropdown/static/position.js +4 -0
- package/dist/inputs/advanced/dropdown/static/position.js.map +1 -1
- package/dist/inputs/advanced/dropdown/styles/base.scss +14 -13
- package/dist/inputs/advanced/dropdown/styles/portaled.scss +6 -11
- package/dist/inputs/advanced/input/styles/field.scss +5 -1
- package/dist/inputs/advanced/radio/index.d.ts.map +1 -1
- package/dist/inputs/advanced/radio/index.js +5 -5
- package/dist/inputs/advanced/radio/index.js.map +1 -1
- package/dist/inputs/advanced/radio/styles.scss +14 -5
- package/dist/inputs/advanced/status/field.d.ts +14 -0
- package/dist/inputs/advanced/status/field.d.ts.map +1 -0
- package/dist/inputs/advanced/status/field.js +23 -0
- package/dist/inputs/advanced/status/field.js.map +1 -0
- package/dist/inputs/advanced/status/index.client.d.ts +2 -1
- package/dist/inputs/advanced/status/index.client.d.ts.map +1 -1
- package/dist/inputs/advanced/status/index.client.js +35 -5
- package/dist/inputs/advanced/status/index.client.js.map +1 -1
- package/dist/inputs/advanced/status/index.d.ts +1 -0
- package/dist/inputs/advanced/status/index.d.ts.map +1 -1
- package/dist/inputs/advanced/status/index.js +12 -14
- package/dist/inputs/advanced/status/index.js.map +1 -1
- package/dist/inputs/advanced/status/styles.scss +20 -0
- package/dist/inputs/advanced/tabs/styles.scss +16 -12
- package/dist/inputs/components/disclosure.d.ts +1 -0
- package/dist/inputs/components/disclosure.d.ts.map +1 -1
- package/dist/inputs/components/disclosure.js +2 -2
- package/dist/inputs/components/disclosure.js.map +1 -1
- package/dist/inputs/components/dropdown.d.ts.map +1 -1
- package/dist/inputs/components/dropdown.js +2 -2
- package/dist/inputs/components/dropdown.js.map +1 -1
- package/dist/inputs/components/status.d.ts.map +1 -1
- package/dist/inputs/components/status.js +1 -1
- package/dist/inputs/components/status.js.map +1 -1
- package/dist/inputs/status.d.ts.map +1 -1
- package/dist/inputs/status.js +4 -0
- package/dist/inputs/status.js.map +1 -1
- package/dist/inputs/styles/cropper.scss +19 -0
- package/dist/inputs/styles/primitives.scss +4 -0
- package/dist/inputs/upload/crop/keys.d.ts +26 -0
- package/dist/inputs/upload/crop/keys.d.ts.map +1 -0
- package/dist/inputs/upload/crop/keys.js +79 -0
- package/dist/inputs/upload/crop/keys.js.map +1 -0
- package/dist/inputs/upload/{crop-session.d.ts → crop/session.d.ts} +2 -2
- package/dist/inputs/upload/crop/session.d.ts.map +1 -0
- package/dist/{src/inputs/upload/crop-session.js → inputs/upload/crop/session.js} +26 -11
- package/dist/inputs/upload/crop/session.js.map +1 -0
- package/dist/inputs/upload/manager.js +1 -1
- package/dist/language/components.d.ts +1 -0
- package/dist/language/components.d.ts.map +1 -1
- package/dist/language/components.js +1 -0
- package/dist/language/components.js.map +1 -1
- package/dist/language/direction.d.ts +6 -0
- package/dist/language/direction.d.ts.map +1 -0
- package/dist/language/direction.js +21 -0
- package/dist/language/direction.js.map +1 -0
- package/dist/language/fragment.d.ts +10 -0
- package/dist/language/fragment.d.ts.map +1 -0
- package/dist/language/fragment.js +10 -0
- package/dist/language/fragment.js.map +1 -0
- package/dist/language/index.d.ts +2 -0
- package/dist/language/index.d.ts.map +1 -1
- package/dist/language/index.js +2 -0
- package/dist/language/index.js.map +1 -1
- package/dist/language/locale.d.ts.map +1 -1
- package/dist/language/locale.js +12 -6
- package/dist/language/locale.js.map +1 -1
- package/dist/language/messages.d.ts.map +1 -1
- package/dist/language/messages.js +34 -0
- package/dist/language/messages.js.map +1 -1
- package/dist/language/routing/boot.d.ts +2 -0
- package/dist/language/routing/boot.d.ts.map +1 -1
- package/dist/language/routing/boot.js +9 -2
- package/dist/language/routing/boot.js.map +1 -1
- package/dist/language/routing/document.d.ts.map +1 -1
- package/dist/language/routing/document.js +3 -1
- package/dist/language/routing/document.js.map +1 -1
- package/dist/language/routing/view.js +1 -1
- package/dist/language/routing/view.js.map +1 -1
- package/dist/language/shared.d.ts +3 -1
- package/dist/language/shared.d.ts.map +1 -1
- package/dist/language/shared.js +7 -1
- package/dist/language/shared.js.map +1 -1
- package/dist/language/styles/index.scss +5 -53
- package/dist/layout/components/site/footer.d.ts +27 -9
- package/dist/layout/components/site/footer.d.ts.map +1 -1
- package/dist/layout/components/site/footer.js +41 -4
- package/dist/layout/components/site/footer.js.map +1 -1
- package/dist/layout/components/site/header/fit.d.ts +4 -0
- package/dist/layout/components/site/header/fit.d.ts.map +1 -0
- package/dist/layout/components/site/header/fit.js +54 -0
- package/dist/layout/components/site/header/fit.js.map +1 -0
- package/dist/layout/components/site/{header_state.d.ts → header/state.d.ts} +1 -1
- package/dist/layout/components/site/header/state.d.ts.map +1 -0
- package/dist/{src/layout/components/site/header_state.js → layout/components/site/header/state.js} +1 -1
- package/dist/layout/components/site/header/state.js.map +1 -0
- package/dist/layout/components/site/header/tone.d.ts +6 -0
- package/dist/layout/components/site/header/tone.d.ts.map +1 -0
- package/dist/layout/components/site/header/tone.js +73 -0
- package/dist/layout/components/site/header/tone.js.map +1 -0
- package/dist/layout/components/site/header.d.ts +3 -8
- package/dist/layout/components/site/header.d.ts.map +1 -1
- package/dist/layout/components/site/header.js +49 -49
- package/dist/layout/components/site/header.js.map +1 -1
- package/dist/layout/components/site/link.d.ts +32 -0
- package/dist/layout/components/site/link.d.ts.map +1 -0
- package/dist/layout/components/site/link.js +73 -0
- package/dist/layout/components/site/link.js.map +1 -0
- package/dist/layout/index.d.ts.map +1 -1
- package/dist/layout/index.js +5 -1
- package/dist/layout/index.js.map +1 -1
- package/dist/layout/social.d.ts +10 -0
- package/dist/layout/social.d.ts.map +1 -0
- package/dist/layout/social.js +20 -0
- package/dist/layout/social.js.map +1 -0
- package/dist/layout/styles/index.scss +2 -0
- package/dist/layout/styles/site/menu.scss +156 -0
- package/dist/layout/styles/site-footer.scss +79 -18
- package/dist/layout/styles/site-header.scss +107 -123
- package/dist/layout/styles/site-link.scss +61 -0
- package/dist/media/carousel-state.d.ts +2 -1
- package/dist/media/carousel-state.d.ts.map +1 -1
- package/dist/media/carousel-state.js +16 -6
- package/dist/media/carousel-state.js.map +1 -1
- package/dist/media/styles/carousel.scss +2 -1
- package/dist/money/config.d.ts +15 -0
- package/dist/money/config.d.ts.map +1 -0
- package/dist/money/config.js +79 -0
- package/dist/money/config.js.map +1 -0
- package/dist/money/format.d.ts +12 -0
- package/dist/money/format.d.ts.map +1 -0
- package/dist/money/format.js +66 -0
- package/dist/money/format.js.map +1 -0
- package/dist/money/index.d.ts +5 -0
- package/dist/money/index.d.ts.map +1 -0
- package/dist/money/index.js +3 -0
- package/dist/money/index.js.map +1 -0
- package/dist/money/rates.d.ts +17 -0
- package/dist/money/rates.d.ts.map +1 -0
- package/dist/money/rates.js +48 -0
- package/dist/money/rates.js.map +1 -0
- package/dist/namespace/index.d.ts +2 -1
- package/dist/namespace/index.d.ts.map +1 -1
- package/dist/namespace/index.js +7 -1
- package/dist/namespace/index.js.map +1 -1
- package/dist/popover/index.d.ts.map +1 -1
- package/dist/popover/index.js +60 -0
- package/dist/popover/index.js.map +1 -1
- package/dist/popover/styles/index.scss +55 -18
- package/dist/primitives/components/classes.d.ts +1 -1
- package/dist/primitives/components/classes.d.ts.map +1 -1
- package/dist/primitives/components/index.d.ts +1 -0
- package/dist/primitives/components/index.d.ts.map +1 -1
- package/dist/primitives/components/index.js +1 -0
- package/dist/primitives/components/index.js.map +1 -1
- package/dist/primitives/components/prose.d.ts +8 -0
- package/dist/primitives/components/prose.d.ts.map +1 -0
- package/dist/primitives/components/prose.js +64 -0
- package/dist/primitives/components/prose.js.map +1 -0
- package/dist/primitives/styles/_controls.scss +51 -7
- package/dist/primitives/styles/_indicators.scss +13 -7
- package/dist/primitives/styles/_marquee.scss +2 -1
- package/dist/primitives/styles/_wizard.scss +2 -1
- package/dist/react/index.d.ts +5 -0
- package/dist/react/index.d.ts.map +1 -1
- package/dist/react/index.js +46 -9
- package/dist/react/index.js.map +1 -1
- package/dist/render/current_url.d.ts.map +1 -1
- package/dist/render/current_url.js +7 -0
- package/dist/render/current_url.js.map +1 -1
- package/dist/runtime/globals.d.ts +9 -0
- package/dist/runtime/globals.d.ts.map +1 -0
- package/dist/runtime/globals.js +27 -0
- package/dist/runtime/globals.js.map +1 -0
- package/dist/runtime/index.d.ts +1 -0
- package/dist/runtime/index.d.ts.map +1 -1
- package/dist/runtime/index.js +1 -0
- package/dist/runtime/index.js.map +1 -1
- package/dist/runtime/options.d.ts +7 -0
- package/dist/runtime/options.d.ts.map +1 -0
- package/dist/runtime/options.js +27 -0
- package/dist/runtime/options.js.map +1 -0
- package/dist/spa/navigate.d.ts.map +1 -1
- package/dist/spa/navigate.js +21 -2
- package/dist/spa/navigate.js.map +1 -1
- package/dist/src/a11y/announce.d.ts +5 -0
- package/dist/src/a11y/announce.d.ts.map +1 -0
- package/dist/src/a11y/announce.js +38 -0
- package/dist/src/a11y/announce.js.map +1 -0
- package/dist/src/a11y/apply.d.ts +13 -0
- package/dist/src/a11y/apply.d.ts.map +1 -0
- package/dist/src/a11y/apply.js +81 -0
- package/dist/src/a11y/apply.js.map +1 -0
- package/dist/src/a11y/attributes.d.ts +17 -0
- package/dist/src/a11y/attributes.d.ts.map +1 -0
- package/dist/src/a11y/attributes.js +34 -0
- package/dist/src/a11y/attributes.js.map +1 -0
- package/dist/src/a11y/boot.d.ts +4 -0
- package/dist/src/a11y/boot.d.ts.map +1 -0
- package/dist/src/a11y/boot.js +30 -0
- package/dist/src/a11y/boot.js.map +1 -0
- package/dist/src/a11y/components/index.d.ts +13 -0
- package/dist/src/a11y/components/index.d.ts.map +1 -0
- package/dist/src/a11y/components/index.js +20 -0
- package/dist/src/a11y/components/index.js.map +1 -0
- package/dist/src/a11y/components/sections.d.ts +9 -0
- package/dist/src/a11y/components/sections.d.ts.map +1 -0
- package/dist/src/a11y/components/sections.js +45 -0
- package/dist/src/a11y/components/sections.js.map +1 -0
- package/dist/src/a11y/config.d.ts +12 -0
- package/dist/src/a11y/config.d.ts.map +1 -0
- package/dist/src/a11y/config.js +53 -0
- package/dist/src/a11y/config.js.map +1 -0
- package/dist/src/a11y/controls.d.ts +8 -0
- package/dist/src/a11y/controls.d.ts.map +1 -0
- package/dist/src/a11y/controls.js +78 -0
- package/dist/src/a11y/controls.js.map +1 -0
- package/dist/src/a11y/effects.d.ts +4 -0
- package/dist/src/a11y/effects.d.ts.map +1 -0
- package/dist/src/a11y/effects.js +14 -0
- package/dist/src/a11y/effects.js.map +1 -0
- package/dist/src/a11y/index.d.ts +15 -0
- package/dist/src/a11y/index.d.ts.map +1 -0
- package/dist/src/a11y/index.js +12 -0
- package/dist/src/a11y/index.js.map +1 -0
- package/dist/src/a11y/ratio.d.ts +16 -0
- package/dist/src/a11y/ratio.d.ts.map +1 -0
- package/dist/src/a11y/ratio.js +101 -0
- package/dist/src/a11y/ratio.js.map +1 -0
- package/dist/src/a11y/runtime.d.ts +11 -0
- package/dist/src/a11y/runtime.d.ts.map +1 -0
- package/dist/src/a11y/runtime.js +25 -0
- package/dist/src/a11y/runtime.js.map +1 -0
- package/dist/src/a11y/settings.d.ts +9 -0
- package/dist/src/a11y/settings.d.ts.map +1 -0
- package/dist/src/a11y/settings.js +41 -0
- package/dist/src/a11y/settings.js.map +1 -0
- package/dist/src/a11y/skip.d.ts +3 -0
- package/dist/src/a11y/skip.d.ts.map +1 -0
- package/dist/src/a11y/skip.js +22 -0
- package/dist/src/a11y/skip.js.map +1 -0
- package/dist/src/a11y/storage.d.ts +7 -0
- package/dist/src/a11y/storage.d.ts.map +1 -0
- package/dist/src/a11y/storage.js +49 -0
- package/dist/src/a11y/storage.js.map +1 -0
- package/dist/src/a11y/types.d.ts +14 -0
- package/dist/src/a11y/types.d.ts.map +1 -0
- package/dist/src/a11y/types.js +2 -0
- package/dist/src/a11y/types.js.map +1 -0
- package/dist/src/actions/copy-components.d.ts +2 -0
- package/dist/src/actions/copy-components.d.ts.map +1 -1
- package/dist/src/actions/copy-components.js +1 -0
- package/dist/src/actions/copy-components.js.map +1 -1
- package/dist/src/actions/standard-buttons.d.ts +2 -1
- package/dist/src/actions/standard-buttons.d.ts.map +1 -1
- package/dist/src/actions/standard-buttons.js +1 -0
- package/dist/src/actions/standard-buttons.js.map +1 -1
- package/dist/src/config/a11y.d.ts +5 -0
- package/dist/src/config/a11y.d.ts.map +1 -0
- package/dist/src/config/a11y.js +66 -0
- package/dist/src/config/a11y.js.map +1 -0
- package/dist/src/config/default/component-tokens.d.ts +28 -8
- package/dist/src/config/default/component-tokens.d.ts.map +1 -1
- package/dist/src/config/default/component-tokens.js +94 -84
- package/dist/src/config/default/component-tokens.js.map +1 -1
- package/dist/src/config/default/config.d.ts +7 -0
- package/dist/src/config/default/config.d.ts.map +1 -0
- package/dist/src/config/default/config.js +104 -0
- package/dist/src/config/default/config.js.map +1 -0
- package/dist/src/config/glass.d.ts.map +1 -1
- package/dist/src/config/glass.js +10 -4
- package/dist/src/config/glass.js.map +1 -1
- package/dist/src/config/index.d.ts +7 -1
- package/dist/src/config/index.d.ts.map +1 -1
- package/dist/src/config/index.js +3 -0
- package/dist/src/config/index.js.map +1 -1
- package/dist/src/config/money.d.ts +5 -0
- package/dist/src/config/money.d.ts.map +1 -0
- package/dist/src/config/money.js +56 -0
- package/dist/src/config/money.js.map +1 -0
- package/dist/src/config/normalize.d.ts +2 -5
- package/dist/src/config/normalize.d.ts.map +1 -1
- package/dist/src/config/normalize.js +12 -97
- package/dist/src/config/normalize.js.map +1 -1
- package/dist/src/config/scales-css.d.ts.map +1 -1
- package/dist/src/config/scales-css.js +11 -5
- package/dist/src/config/scales-css.js.map +1 -1
- package/dist/src/config/scss.d.ts.map +1 -1
- package/dist/src/config/scss.js +19 -6
- package/dist/src/config/scss.js.map +1 -1
- package/dist/src/config/text-document.d.ts +18 -0
- package/dist/src/config/text-document.d.ts.map +1 -0
- package/dist/src/config/text-document.js +53 -0
- package/dist/src/config/text-document.js.map +1 -0
- package/dist/src/config/types/a11y.d.ts +17 -0
- package/dist/src/config/types/a11y.d.ts.map +1 -0
- package/dist/src/config/types/a11y.js +2 -0
- package/dist/src/config/types/a11y.js.map +1 -0
- package/dist/src/config/types/glass.d.ts +5 -1
- package/dist/src/config/types/glass.d.ts.map +1 -1
- package/dist/src/config/types/money.d.ts +14 -0
- package/dist/src/config/types/money.d.ts.map +1 -0
- package/dist/src/config/types/money.js +2 -0
- package/dist/src/config/types/money.js.map +1 -0
- package/dist/src/config/types.d.ts +9 -2
- package/dist/src/config/types.d.ts.map +1 -1
- package/dist/src/explorer/components/file/tree/keys.d.ts +14 -0
- package/dist/src/explorer/components/file/tree/keys.d.ts.map +1 -0
- package/dist/src/explorer/components/file/tree/keys.js +94 -0
- package/dist/src/explorer/components/file/tree/keys.js.map +1 -0
- package/dist/src/explorer/components/file/tree/row.d.ts.map +1 -1
- package/dist/src/explorer/components/file/tree/row.js +2 -2
- package/dist/src/explorer/components/file/tree/row.js.map +1 -1
- package/dist/src/explorer/components/file/tree.d.ts.map +1 -1
- package/dist/src/explorer/components/file/tree.js +2 -1
- package/dist/src/explorer/components/file/tree.js.map +1 -1
- package/dist/src/explorer/components/static-file-tree.d.ts.map +1 -1
- package/dist/src/explorer/components/static-file-tree.js +4 -3
- package/dist/src/explorer/components/static-file-tree.js.map +1 -1
- package/dist/src/heading/index.js +2 -2
- package/dist/src/index.d.ts +2 -2
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/index.js +11 -33
- package/dist/src/index.js.map +1 -1
- package/dist/src/inputs/advanced/checkbox/index.d.ts.map +1 -1
- package/dist/src/inputs/advanced/checkbox/index.js +4 -4
- package/dist/src/inputs/advanced/checkbox/index.js.map +1 -1
- package/dist/src/inputs/advanced/dropdown/index.d.ts.map +1 -1
- package/dist/src/inputs/advanced/dropdown/index.js +11 -8
- package/dist/src/inputs/advanced/dropdown/index.js.map +1 -1
- package/dist/src/inputs/advanced/dropdown/static/aria.d.ts +9 -0
- package/dist/src/inputs/advanced/dropdown/static/aria.d.ts.map +1 -0
- package/dist/src/inputs/advanced/dropdown/static/aria.js +47 -0
- package/dist/src/inputs/advanced/dropdown/static/aria.js.map +1 -0
- package/dist/src/inputs/advanced/dropdown/static/bind.d.ts.map +1 -1
- package/dist/src/inputs/advanced/dropdown/static/bind.js +25 -6
- package/dist/src/inputs/advanced/dropdown/static/bind.js.map +1 -1
- package/dist/src/inputs/advanced/dropdown/static/keys.d.ts +9 -0
- package/dist/src/inputs/advanced/dropdown/static/keys.d.ts.map +1 -0
- package/dist/src/inputs/advanced/dropdown/static/keys.js +69 -0
- package/dist/src/inputs/advanced/dropdown/static/keys.js.map +1 -0
- package/dist/src/inputs/advanced/dropdown/static/position.d.ts.map +1 -1
- package/dist/src/inputs/advanced/dropdown/static/position.js +4 -0
- package/dist/src/inputs/advanced/dropdown/static/position.js.map +1 -1
- package/dist/src/inputs/advanced/radio/index.d.ts.map +1 -1
- package/dist/src/inputs/advanced/radio/index.js +5 -5
- package/dist/src/inputs/advanced/radio/index.js.map +1 -1
- package/dist/src/inputs/advanced/status/field.d.ts +14 -0
- package/dist/src/inputs/advanced/status/field.d.ts.map +1 -0
- package/dist/src/inputs/advanced/status/field.js +23 -0
- package/dist/src/inputs/advanced/status/field.js.map +1 -0
- package/dist/src/inputs/advanced/status/index.client.d.ts +2 -1
- package/dist/src/inputs/advanced/status/index.client.d.ts.map +1 -1
- package/dist/src/inputs/advanced/status/index.client.js +35 -5
- package/dist/src/inputs/advanced/status/index.client.js.map +1 -1
- package/dist/src/inputs/advanced/status/index.d.ts +1 -0
- package/dist/src/inputs/advanced/status/index.d.ts.map +1 -1
- package/dist/src/inputs/advanced/status/index.js +12 -14
- package/dist/src/inputs/advanced/status/index.js.map +1 -1
- package/dist/src/inputs/components/disclosure.d.ts +1 -0
- package/dist/src/inputs/components/disclosure.d.ts.map +1 -1
- package/dist/src/inputs/components/disclosure.js +2 -2
- package/dist/src/inputs/components/disclosure.js.map +1 -1
- package/dist/src/inputs/components/dropdown.d.ts.map +1 -1
- package/dist/src/inputs/components/dropdown.js +2 -2
- package/dist/src/inputs/components/dropdown.js.map +1 -1
- package/dist/src/inputs/components/status.d.ts.map +1 -1
- package/dist/src/inputs/components/status.js +1 -1
- package/dist/src/inputs/components/status.js.map +1 -1
- package/dist/src/inputs/status.d.ts.map +1 -1
- package/dist/src/inputs/status.js +4 -0
- package/dist/src/inputs/status.js.map +1 -1
- package/dist/src/inputs/upload/crop/keys.d.ts +26 -0
- package/dist/src/inputs/upload/crop/keys.d.ts.map +1 -0
- package/dist/src/inputs/upload/crop/keys.js +79 -0
- package/dist/src/inputs/upload/crop/keys.js.map +1 -0
- package/dist/src/inputs/upload/{crop-session.d.ts → crop/session.d.ts} +2 -2
- package/dist/src/inputs/upload/crop/session.d.ts.map +1 -0
- package/dist/{inputs/upload/crop-session.js → src/inputs/upload/crop/session.js} +30 -15
- package/dist/src/inputs/upload/crop/session.js.map +1 -0
- package/dist/src/inputs/upload/manager.js +1 -1
- package/dist/src/language/components.d.ts +1 -0
- package/dist/src/language/components.d.ts.map +1 -1
- package/dist/src/language/components.js +1 -0
- package/dist/src/language/components.js.map +1 -1
- package/dist/src/language/direction.d.ts +6 -0
- package/dist/src/language/direction.d.ts.map +1 -0
- package/dist/src/language/direction.js +21 -0
- package/dist/src/language/direction.js.map +1 -0
- package/dist/src/language/fragment.d.ts +10 -0
- package/dist/src/language/fragment.d.ts.map +1 -0
- package/dist/src/language/fragment.js +10 -0
- package/dist/src/language/fragment.js.map +1 -0
- package/dist/src/language/index.d.ts +2 -0
- package/dist/src/language/index.d.ts.map +1 -1
- package/dist/src/language/index.js +2 -0
- package/dist/src/language/index.js.map +1 -1
- package/dist/src/language/locale.d.ts.map +1 -1
- package/dist/src/language/locale.js +12 -6
- package/dist/src/language/locale.js.map +1 -1
- package/dist/src/language/messages.d.ts.map +1 -1
- package/dist/src/language/messages.js +34 -0
- package/dist/src/language/messages.js.map +1 -1
- package/dist/src/language/routing/boot.d.ts +2 -0
- package/dist/src/language/routing/boot.d.ts.map +1 -1
- package/dist/src/language/routing/boot.js +9 -2
- package/dist/src/language/routing/boot.js.map +1 -1
- package/dist/src/language/routing/document.d.ts.map +1 -1
- package/dist/src/language/routing/document.js +3 -1
- package/dist/src/language/routing/document.js.map +1 -1
- package/dist/src/language/routing/view.js +1 -1
- package/dist/src/language/routing/view.js.map +1 -1
- package/dist/src/language/shared.d.ts +3 -1
- package/dist/src/language/shared.d.ts.map +1 -1
- package/dist/src/language/shared.js +7 -1
- package/dist/src/language/shared.js.map +1 -1
- package/dist/src/layout/components/site/footer.d.ts +27 -9
- package/dist/src/layout/components/site/footer.d.ts.map +1 -1
- package/dist/src/layout/components/site/footer.js +41 -4
- package/dist/src/layout/components/site/footer.js.map +1 -1
- package/dist/src/layout/components/site/header/fit.d.ts +4 -0
- package/dist/src/layout/components/site/header/fit.d.ts.map +1 -0
- package/dist/src/layout/components/site/header/fit.js +54 -0
- package/dist/src/layout/components/site/header/fit.js.map +1 -0
- package/dist/src/layout/components/site/{header_state.d.ts → header/state.d.ts} +1 -1
- package/dist/src/layout/components/site/header/state.d.ts.map +1 -0
- package/dist/{layout/components/site/header_state.js → src/layout/components/site/header/state.js} +3 -3
- package/dist/src/layout/components/site/header/state.js.map +1 -0
- package/dist/src/layout/components/site/header/tone.d.ts +6 -0
- package/dist/src/layout/components/site/header/tone.d.ts.map +1 -0
- package/dist/src/layout/components/site/header/tone.js +73 -0
- package/dist/src/layout/components/site/header/tone.js.map +1 -0
- package/dist/src/layout/components/site/header.d.ts +3 -8
- package/dist/src/layout/components/site/header.d.ts.map +1 -1
- package/dist/src/layout/components/site/header.js +49 -49
- package/dist/src/layout/components/site/header.js.map +1 -1
- package/dist/src/layout/components/site/link.d.ts +32 -0
- package/dist/src/layout/components/site/link.d.ts.map +1 -0
- package/dist/src/layout/components/site/link.js +73 -0
- package/dist/src/layout/components/site/link.js.map +1 -0
- package/dist/src/layout/index.d.ts.map +1 -1
- package/dist/src/layout/index.js +5 -1
- package/dist/src/layout/index.js.map +1 -1
- package/dist/src/layout/social.d.ts +10 -0
- package/dist/src/layout/social.d.ts.map +1 -0
- package/dist/src/layout/social.js +20 -0
- package/dist/src/layout/social.js.map +1 -0
- package/dist/src/media/carousel-state.d.ts +2 -1
- package/dist/src/media/carousel-state.d.ts.map +1 -1
- package/dist/src/media/carousel-state.js +16 -6
- package/dist/src/media/carousel-state.js.map +1 -1
- package/dist/src/money/config.d.ts +15 -0
- package/dist/src/money/config.d.ts.map +1 -0
- package/dist/src/money/config.js +79 -0
- package/dist/src/money/config.js.map +1 -0
- package/dist/src/money/format.d.ts +12 -0
- package/dist/src/money/format.d.ts.map +1 -0
- package/dist/src/money/format.js +66 -0
- package/dist/src/money/format.js.map +1 -0
- package/dist/src/money/index.d.ts +5 -0
- package/dist/src/money/index.d.ts.map +1 -0
- package/dist/src/money/index.js +3 -0
- package/dist/src/money/index.js.map +1 -0
- package/dist/src/money/rates.d.ts +17 -0
- package/dist/src/money/rates.d.ts.map +1 -0
- package/dist/src/money/rates.js +48 -0
- package/dist/src/money/rates.js.map +1 -0
- package/dist/src/namespace/index.d.ts +2 -1
- package/dist/src/namespace/index.d.ts.map +1 -1
- package/dist/src/namespace/index.js +7 -1
- package/dist/src/namespace/index.js.map +1 -1
- package/dist/src/popover/index.d.ts.map +1 -1
- package/dist/src/popover/index.js +60 -0
- package/dist/src/popover/index.js.map +1 -1
- package/dist/src/primitives/components/classes.d.ts +1 -1
- package/dist/src/primitives/components/classes.d.ts.map +1 -1
- package/dist/src/primitives/components/index.d.ts +1 -0
- package/dist/src/primitives/components/index.d.ts.map +1 -1
- package/dist/src/primitives/components/index.js +1 -0
- package/dist/src/primitives/components/index.js.map +1 -1
- package/dist/src/primitives/components/prose.d.ts +8 -0
- package/dist/src/primitives/components/prose.d.ts.map +1 -0
- package/dist/src/primitives/components/prose.js +64 -0
- package/dist/src/primitives/components/prose.js.map +1 -0
- package/dist/src/react/index.d.ts +5 -0
- package/dist/src/react/index.d.ts.map +1 -1
- package/dist/src/react/index.js +46 -9
- package/dist/src/react/index.js.map +1 -1
- package/dist/src/render/current_url.d.ts.map +1 -1
- package/dist/src/render/current_url.js +7 -0
- package/dist/src/render/current_url.js.map +1 -1
- package/dist/src/runtime/globals.d.ts +9 -0
- package/dist/src/runtime/globals.d.ts.map +1 -0
- package/dist/src/runtime/globals.js +27 -0
- package/dist/src/runtime/globals.js.map +1 -0
- package/dist/src/runtime/index.d.ts +1 -0
- package/dist/src/runtime/index.d.ts.map +1 -1
- package/dist/src/runtime/index.js +1 -0
- package/dist/src/runtime/index.js.map +1 -1
- package/dist/src/runtime/options.d.ts +7 -0
- package/dist/src/runtime/options.d.ts.map +1 -0
- package/dist/src/runtime/options.js +27 -0
- package/dist/src/runtime/options.js.map +1 -0
- package/dist/src/spa/navigate.d.ts.map +1 -1
- package/dist/src/spa/navigate.js +21 -2
- package/dist/src/spa/navigate.js.map +1 -1
- package/dist/src/surface/components/index.d.ts.map +1 -1
- package/dist/src/surface/components/index.js +2 -2
- package/dist/src/surface/components/index.js.map +1 -1
- package/dist/src/surface/components/motif.d.ts +8 -0
- package/dist/src/surface/components/motif.d.ts.map +1 -0
- package/dist/src/surface/components/motif.js +14 -0
- package/dist/src/surface/components/motif.js.map +1 -0
- package/dist/src/surface/motif/boot.d.ts +5 -0
- package/dist/src/surface/motif/boot.d.ts.map +1 -0
- package/dist/src/surface/motif/boot.js +32 -0
- package/dist/src/surface/motif/boot.js.map +1 -0
- package/dist/src/surface/motif/program.d.ts +45 -0
- package/dist/src/surface/motif/program.d.ts.map +1 -0
- package/dist/src/surface/motif/program.js +180 -0
- package/dist/src/surface/motif/program.js.map +1 -0
- package/dist/src/surface/motif/registry.d.ts +10 -0
- package/dist/src/surface/motif/registry.d.ts.map +1 -0
- package/dist/src/surface/motif/registry.js +18 -0
- package/dist/src/surface/motif/registry.js.map +1 -0
- package/dist/src/surface/motif/runtime.d.ts +8 -0
- package/dist/src/surface/motif/runtime.d.ts.map +1 -0
- package/dist/src/surface/motif/runtime.js +62 -0
- package/dist/src/surface/motif/runtime.js.map +1 -0
- package/dist/src/theme/apply.d.ts.map +1 -1
- package/dist/src/theme/apply.js +2 -1
- package/dist/src/theme/apply.js.map +1 -1
- package/dist/src/wizard/animation.d.ts.map +1 -1
- package/dist/src/wizard/animation.js +2 -1
- package/dist/src/wizard/animation.js.map +1 -1
- package/dist/styles/tokens.scss +28 -8
- package/dist/styles/utils/_tone.scss +44 -0
- package/dist/styles/utils/a11y.scss +16 -0
- package/dist/styles/utils/alignment.scss +2 -1
- package/dist/styles/utils/base.scss +11 -4
- package/dist/styles/utils/focus.scss +13 -0
- package/dist/styles/utils/swap.scss +12 -0
- package/dist/styles/utils/text/extra.scss +1 -1
- package/dist/styles/utils.scss +2 -0
- package/dist/surface/components/index.d.ts.map +1 -1
- package/dist/surface/components/index.js +2 -2
- package/dist/surface/components/index.js.map +1 -1
- package/dist/surface/components/motif.d.ts +8 -0
- package/dist/surface/components/motif.d.ts.map +1 -0
- package/dist/surface/components/motif.js +14 -0
- package/dist/surface/components/motif.js.map +1 -0
- package/dist/surface/motif/boot.d.ts +5 -0
- package/dist/surface/motif/boot.d.ts.map +1 -0
- package/dist/surface/motif/boot.js +32 -0
- package/dist/surface/motif/boot.js.map +1 -0
- package/dist/surface/motif/program.d.ts +45 -0
- package/dist/surface/motif/program.d.ts.map +1 -0
- package/dist/surface/motif/program.js +180 -0
- package/dist/surface/motif/program.js.map +1 -0
- package/dist/surface/motif/registry.d.ts +10 -0
- package/dist/surface/motif/registry.d.ts.map +1 -0
- package/dist/surface/motif/registry.js +18 -0
- package/dist/surface/motif/registry.js.map +1 -0
- package/dist/surface/motif/runtime.d.ts +8 -0
- package/dist/surface/motif/runtime.d.ts.map +1 -0
- package/dist/surface/motif/runtime.js +62 -0
- package/dist/surface/motif/runtime.js.map +1 -0
- package/dist/surface/styles/blocks.scss +2 -2
- package/dist/surface/styles/brand-canvas.scss +1 -2
- package/dist/surface/styles/hairline.scss +8 -4
- package/dist/surface/styles/index.scss +4 -3
- package/dist/surface/styles/layout.scss +10 -5
- package/dist/surface/styles/motif.scss +11 -0
- package/dist/surface/styles/track.scss +8 -3
- package/dist/theme/apply.d.ts.map +1 -1
- package/dist/theme/apply.js +2 -1
- package/dist/theme/apply.js.map +1 -1
- package/dist/wizard/animation.d.ts.map +1 -1
- package/dist/wizard/animation.js +2 -1
- package/dist/wizard/animation.js.map +1 -1
- package/package.json +2 -1
- package/dist/contrast/boot.d.ts +0 -3
- package/dist/contrast/boot.d.ts.map +0 -1
- package/dist/contrast/boot.js +0 -31
- package/dist/contrast/boot.js.map +0 -1
- package/dist/contrast/index.d.ts +0 -8
- package/dist/contrast/index.d.ts.map +0 -1
- package/dist/contrast/index.js +0 -213
- package/dist/contrast/index.js.map +0 -1
- package/dist/contrast/selectors.d.ts +0 -18
- package/dist/contrast/selectors.d.ts.map +0 -1
- package/dist/contrast/selectors.js +0 -38
- package/dist/contrast/selectors.js.map +0 -1
- package/dist/contrast/styles/adaptive.scss +0 -17
- package/dist/contrast/styles/index.scss +0 -94
- package/dist/inputs/upload/crop-session.d.ts.map +0 -1
- package/dist/inputs/upload/crop-session.js.map +0 -1
- package/dist/layout/components/site/header_state.d.ts.map +0 -1
- package/dist/layout/components/site/header_state.js.map +0 -1
- package/dist/src/contrast/boot.d.ts +0 -3
- package/dist/src/contrast/boot.d.ts.map +0 -1
- package/dist/src/contrast/boot.js +0 -31
- package/dist/src/contrast/boot.js.map +0 -1
- package/dist/src/contrast/index.d.ts +0 -8
- package/dist/src/contrast/index.d.ts.map +0 -1
- package/dist/src/contrast/index.js +0 -213
- package/dist/src/contrast/index.js.map +0 -1
- package/dist/src/contrast/selectors.d.ts +0 -18
- package/dist/src/contrast/selectors.d.ts.map +0 -1
- package/dist/src/contrast/selectors.js +0 -38
- package/dist/src/contrast/selectors.js.map +0 -1
- package/dist/src/inputs/upload/crop-session.d.ts.map +0 -1
- package/dist/src/inputs/upload/crop-session.js.map +0 -1
- package/dist/src/layout/components/site/header_state.d.ts.map +0 -1
- package/dist/src/layout/components/site/header_state.js.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,101 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 25.0.0
|
|
4
|
+
|
|
5
|
+
**Breaking:** the adaptive colour system is removed. `src/contrast` is gone, and with it `bindContrast`, `applyContrast`, `clearContrastMarks`, `beginContrastSettle`, the `contrast` system key, `data-tbf-on-dark`, `data-tbf-contrast`, `data-tbf-contrast-surface`, `data-tbf-contrast-settle` and the `--tbf-adaptive`, `--tbf-adaptive-muted` and `--tbf-adaptive-border` variables. Nothing measures what is painted behind an element any more. Stylesheets that read an adaptive variable read `--tbf-text`, `--tbf-text-muted` and `--tbf-border` instead, which is what those variables aliased.
|
|
6
|
+
|
|
7
|
+
The idea was that chrome standing over mixed content should work out its own ink. In practice it made every colour a function of a measurement: one reading for a whole element, so a tall panel over the edge of a band painted half its rows in the wrong colour; a new reading on every scroll frame, so panels flickered; and a reading that could not be predicted from the configuration, so nothing could be verified without a browser. Chrome now declares what it is.
|
|
8
|
+
|
|
9
|
+
- The site header bar and its mobile menu are opaque. The bar fills with the page colour, or with the ink on a page whose first band is dark, and the menu fills to match, so the navigation is readable at every scroll position without anything measuring what passes under it. `design.glass.tint` takes `light`, `dark` or `none` and stays available for a surface that genuinely lets the page through: `--tbf-glass-bg` is clear, `--tbf-glass-tint-bg` carries the tint, `light` is the page colour and `dark` is the ink, and `clear`, `color` and `opacity` set either fill by hand.
|
|
10
|
+
|
|
11
|
+
- The header takes its tone from the page's own markup. A page whose first band under the header carries `data-tbf-dark` gives the bar and its mobile menu the dark tone through one rule, `body:has(main > [data-tbf-dark]:first-child)`, so both carry the page's ink and ground from the first paint and no script runs for the header at all. That is `components.shell.header.tone.follow: "hero"`, the default, and the bar holds that tone for the whole page.
|
|
12
|
+
|
|
13
|
+
`follow: "band"` makes the bar follow the page under it instead. It reads the boxes of `main`'s own children and the site footer, takes the one crossing the line at `tone.probe` through its height, and marks itself `data-tbf-dark` when that band declares itself dark, so the ink, the border, the mobile menu and a two-face logo all follow one attribute and the crossfade is one `tone.duration` and `tone.easing` for all of them. It is still not a measurement of what is painted: the answer comes from the same attribute the markup already declares, the CSS rule stays the pre-hydration and no-script answer, and a header configured to `hero` installs no listeners at all.
|
|
14
|
+
|
|
15
|
+
This replaces reading pixels. The system removed earlier walked `elementsFromPoint` and a `querySelectorAll` per item per sample point on every scroll frame, and the thing it bought with that work was one colour per element, which a mixed backdrop defeats anyway. A declared region gives the same answer for a band that is one tone, which is the case worth serving, and gives it for free.
|
|
16
|
+
|
|
17
|
+
- An inverse `SiteFooter` and the stage of an inverse `BrandCanvas` declare `data-tbf-dark` on themselves, so everything inside them takes the dark tone from the one marker rather than from a rule per component. The canvas also paints its stage with `--tbf-ink` instead of `--tbf-text`: once the stage declared itself dark, `--tbf-text` was the inverted ink and the stage filled white.
|
|
18
|
+
|
|
19
|
+
- The header publishes its current ground as `--tbf-shell-header-surface`, and the mobile menu fills from it, so the two cannot disagree in any tone and the dark menu needs no rule of its own.
|
|
20
|
+
|
|
21
|
+
- `.tbf-logo` accepts an `<img>` face as well as inline SVG, and the brand slot's own image rule no longer overrides a `.tbf-logo` inside it. A site that ships a drawn mark as two files, one for light grounds and one for dark, can now hand them to the header as images instead of inlining them into every page.
|
|
22
|
+
|
|
23
|
+
- Eight header tokens and one prose token were unreachable from config. The stylesheets read `--tbf-shell-header-brand-button-*`, `--tbf-shell-header-link-active-text-decoration*` and `--tbf-surf-prose-root-line-height`, while the config flattener shortens `button` to `btn`, `text-decoration` to `decoration` and `line-height` to `line-h`, so those keys emitted a variable nothing read and failed in silence. The stylesheets now read the names config emits. `paddingInline` is gone from the README's token list instead: the bar's inline padding is one of the sizes the package fixes on purpose, so every Trebired site puts its brand at the same distance from the edge, and the README listed a key the stylesheet never read.
|
|
24
|
+
|
|
25
|
+
- `SiteFooter` takes an optional `site` band: this site's own mark, tagline, social links and a row of its own links, above the owner's part and separated from it by a rule. A product site's footer was a row of five columns of which only the first belonged to the product, with the organization's links in columns headed by category rather than by owner, so nothing said where one ended and the other began. Two marks and one rule do that now, inside one footer on one ground, and the same label can appear in both parts without being ambiguous.
|
|
26
|
+
|
|
27
|
+
- The desktop navigation collapses into the menu when it does not fit, instead of at 768px. The breakpoint assumed every site had a short bar: a header with seven links and two chrome buttons needed about 970px, so between 768px and that the links ran straight into the language and accessibility controls. The header now measures its own nav against the space it has, keeps a width in hand once it has had to collapse, and restores the bar when there is room again. Links in the bar no longer wrap, because a nav link that wraps hides the overflow instead of reporting it.
|
|
28
|
+
|
|
29
|
+
- A soft navigation arrives without animating. `<html>` carries `data-tbf-page-swap` while the page is replaced, holding every transition and animation at 1ms for that frame, so a header, a band or a mark that belongs to a different page simply appears in its own colours. Transitions are a comment on a change the reader watched happen; nobody watched this one.
|
|
30
|
+
|
|
31
|
+
- `Disclosure` takes a `panelId`, so the trigger can point `aria-controls` at the panel it opens. Without it the low-level component could only be wired correctly by hand, and an accordion built from it claimed a relationship the markup did not carry.
|
|
32
|
+
|
|
33
|
+
- `ProseText` turns a marked span in a plain string into a `TextLink`, for copy that is stored as strings and still has to point at another page. A markdown file marks the span with a comment pair, `<!--tbf:link /philosophy-->`, which a markdown renderer shows nothing of, so a document that is also read on a repository page stays plain there; a relative markdown link would have rendered as a visible link to a path that does not exist on that host. Source that nothing else renders uses `[label](/path)` and means the same. `tab` and `reload` are the only flags, and anything malformed renders as plain prose rather than as a marker.
|
|
34
|
+
|
|
35
|
+
- `parseTextDocument` reads a text repository document, front matter plus sections plus parts, from the `config` entry beside `fetchMoneyRates`. Every consumer of a Trebired text repository was writing that parser again in its own build script.
|
|
36
|
+
|
|
37
|
+
- A region declares its tone instead of being measured for it. `data-tbf-dark`, or `data-tbf-tone="dark"` and `="light"`, applies the tone mixins, so a dark band, an inverse footer or an inverted hairline cell says so in its markup. `--tbf-ink` and the `--tbf-base-*` snapshot replace the `--tbf-contrast-ink` and `--tbf-contrast-base-*` names.
|
|
38
|
+
|
|
39
|
+
This is the accessibility release. The package held a claim it could not support: no focus ring system, no skip link, a type scale emitted in px so the reader's own font size did nothing, no `aria-describedby`, `aria-invalid` or `aria-required` anywhere, a 28px control floor, a live region that was exported and never rendered, no `forced-colors` support, and reduced motion honoured in twelve places and ignored in roughly twice as many. All of that is addressed here, and a visitor can now set three of these things for themselves.
|
|
40
|
+
|
|
41
|
+
**Breaking:** scales are emitted in rem. `design.scales` still takes numbers, and at a 16px root every computed pixel is identical, so the change is invisible until a reader scales their text or a site hardcoded a px value against a token. Spacing, padding and text size convert; radius, height and width stay in px, because they describe a shape rather than a measure of text.
|
|
42
|
+
|
|
43
|
+
**Breaking:** the touch target floor is 44px. `--tbf-target-min` defaults to `2.75rem` and applies to buttons, choice rows, dropdown values, tabs and options, so controls that were 24 to 34px tall grow. A dense surface opts down to 24px, still the AA floor, by carrying `data-tbf-dense`.
|
|
44
|
+
|
|
45
|
+
**Breaking:** a heading at page depth is `h2`, not `h3`. `headingLevelForDepth` mapped depth 0 to `h3` and a card's own title to `h3` as well, so a page with an `h1` and a card skipped `h2`, and a `TitleDescription` with a card child went `h2` then `h4`. The mapping is now depth + 1 clamped to 2, and no level is skipped at any nesting.
|
|
46
|
+
|
|
47
|
+
- `a11y` config block: `defaults`, `textSizes` and `cookie`. `configureFrontendA11y` turns it into the runtime config the boot script and the panel both read, and `createLocaleBootScript(routing, { a11y, ... })` writes it onto `<html>` before first paint, so there is no flash and no hydration mismatch.
|
|
48
|
+
- `<AccessibilityMenu />` is a popover, the same shape as `LocaleSwitcher`: animation and text size are radio groups, high contrast is a checkbox, the panel is a `role="group"` and every change is announced.
|
|
49
|
+
- Reduce motion sets the transition and animation duration tokens to zero and backs that with a blanket `1ms` rule, which the contrast runtime needs because a zero duration fires neither `transitionend` nor `animationend`. `motionReduced()` is the predicate; the theme, wizard, carousel and motif binders call it rather than re-deriving the media query, so an explicit "animation is fine" beats an operating system that asks for less.
|
|
50
|
+
- A decorative motif stops without disappearing. `motifCalm` reads the resolved attribute the head boot script has already written, so the painter draws its first frame and the loop never starts. The artwork stays on screen, standing still, and the loop is measurably stopped: zero `requestAnimationFrame` callbacks in a two second window.
|
|
51
|
+
- High contrast is an override layer over the nine tone variables rather than a theme mode, so it composes with `data-tbf-on-dark` instead of fighting it. It reads `--tbf-high-contrast-ink` and `--tbf-high-contrast-paper`, which default to literals, because resolving them through `--tbf-contrast-ink` made `--tbf-text` and `--tbf-contrast-ink` depend on each other and CSS voided both, leaving a dark footer painting black on black.
|
|
52
|
+
- One baseline `:focus-visible` ring from `--tbf-focus-ring-width`, `-offset`, `-color` and `-style`, and a `forced-colors` layer that hands buttons, fields, invalid fields, errors and selected options back to the system palette and switches the ring to `Highlight`.
|
|
53
|
+
- Fields are wired for a screen reader: `htmlFor` against a generated id, `aria-describedby` naming both the help text and the error slot, `aria-required`, `aria-invalid` kept current by the status runtime, and the error rendered as real text in a `role="alert"` beside the field rather than only as a tooltip on a coloured icon.
|
|
54
|
+
- The advanced dropdown is operable from a keyboard and describes itself: `role="combobox"` on the value with `aria-expanded`, `aria-controls` and `aria-haspopup`, `role="listbox"` on the list, `aria-activedescendant` tracking, arrow keys, Home, End, Enter, Space, Escape and Tab. It had Escape and nothing else, and its options carried `role="option"` with no container role.
|
|
55
|
+
- The file tree follows the tree pattern: the role sits on the focusable element instead of a wrapper, the tree is one tab stop, and arrow keys, Home and End move between rows while left and right collapse, expand and step to the parent.
|
|
56
|
+
- The image cropper has a keyboard and a numeric path: arrow keys move the selection, Shift moves it ten pixels at a time, plus and minus zoom, and four labelled number fields take exact pixels. It was drag-only.
|
|
57
|
+
- `contrastRatio` and `meetsContrast` compute real WCAG ratios with sRGB linearisation and alpha composited over the backdrop. The existing `lightness` is a gamma-naive luma that reports black on white as something other than 21:1; it stays, because picking a tone is not the same job as measuring a ratio.
|
|
58
|
+
- `announce(message)` writes into one polite live region, created on first use.
|
|
59
|
+
- `SiteHeader` renders a skip link as its first child, and `ensureSkipTarget` gives `<main>` the id it points at and a `tabindex` of `-1`.
|
|
60
|
+
- A popover sizes itself in one unit. Its `min-width` was a rem token and its `max-width` px, so at 200% text the minimum overtook the maximum and a panel grew wider than a phone; both are now clamped by the viewport.
|
|
61
|
+
- `languageDirection` and `RTL_LANGUAGES` are exported, the locale boot script sets `dir` on `<html>` beside `lang`, and `<LangFragment lang>` marks a fragment in another language. The locale switcher marks each option with its own `lang`, which exposed that an unknown code collapsed to the current locale: a Polish option was labelled `lang="en"`, carried `value="en"` and was announced as checked alongside the real current language. Options now keep their own tag.
|
|
62
|
+
- `data-tbf-popover-autofocus` moves focus into a panel on every open path, not only the Enter and Space path.
|
|
63
|
+
- A choice row takes `currentColor` instead of `--text-color`, so a radio or a checkbox inside a dark region is readable. Its label was the one part of a panel that did not follow the measured tone, which left the settings rows invisible over a dark band while the section titles above them were not.
|
|
64
|
+
**Breaking:** a tone change crosses its ink instead of dipping its opacity. `SWAP_ATTR`, `data-tbf-contrast-swap` and the `contrast-swap` keyframes are gone. A contrast item that changed tone used to animate opacity from 0.2 back to 1, so text crossing a band dropped to a fifth of its opacity for a quarter of a second, every time; with a panel of eleven items crossing one after another it read as a strobe. The header had its own copy of that rule, scoped so the bar animated as one piece while everything else animated per item, which is why the two never looked alike.
|
|
65
|
+
|
|
66
|
+
- `chrome` is a button variant: a compact outlined control for header chrome. The language switcher, the accessibility trigger and every choice row in a radio or checkbox group render as `variant: "chrome"`, so their border, fill, hover, radius, height, padding and type size come from `design.components.primitives.button.variants.chrome` rather than three stylesheets agreeing by hand, and the shared mixin that used to hold this look is deleted. It is deliberately shorter than a content button, 2rem against the configured root height, and it declares itself a dense control so the 44px pointer floor does not inflate it; 2rem still clears the 24px that WCAG 2.5.8 asks for at AA. An icon-only chrome button is square at that height. A choice row keeps its own height and type size, because a row carrying a description is not a header control.
|
|
67
|
+
|
|
68
|
+
- An icon-only button is square at the button's own height. `slots.icon.size` defaulted to `1.75rem` regardless of how tall buttons were configured to be, so a site that set a 2.75rem button got a 1.75rem icon button beside it. It now defaults to `--tbf-ui-btn-root-height`, and its radius follows the button's rather than falling back to a tighter one.
|
|
69
|
+
|
|
70
|
+
- A variant's colour is written as a static value in config. A custom property declared at `:root` resolves there and inherits already resolved, so a `var()` written into config froze the root's ink and painted dark text on a dark header. The reference belongs in the rule's fallback, where it resolves per element; config carries only what is genuinely static.
|
|
71
|
+
|
|
72
|
+
- The header trigger look is one definition. `styles/utils/chrome-trigger` holds the base, square and hover mixins that the locale trigger and the accessibility trigger both include, so the two cannot drift. It reads `--tbf-shell-chrome-trigger-*` and falls back to the existing `--tbf-shell-language-trigger-*`, so a site that already themed the language trigger themes both and nothing moves.
|
|
73
|
+
|
|
74
|
+
|
|
75
|
+
## 24.0.0
|
|
76
|
+
|
|
77
|
+
- The minimal scrollbar is grey instead of black. `tbf-scroll-min` painted its thumb solid `#000` and its track solid `#fff`, which is a bar heavy enough to read as part of the layout and a track that is wrong on anything but a white surface. The thumb now defaults to the current colour at 26% and the track to nothing, so it takes the tone of whatever it sits on and stays quiet. `--scroll-thumb` and `--scroll-track` still override it.
|
|
78
|
+
|
|
79
|
+
- A live island binds the runtime on every commit, not only on its first mount. A soft redirect inserts the new page, and `prepareTabsContext` deliberately refuses to touch anything inside an island still marked unhydrated, leaving the enhancement to the island itself. The island then re-rendered through the React root it already had, so the mount effect never ran again and nothing bound: tabs on a page reached by a soft redirect had no `role`, no owner and no click handler. The binder now marks the island hydrated before it rebinds, and later commits schedule a rebind of that island's subtree on the next frame, coalesced so a chatty island does not rebind twice for one paint.
|
|
80
|
+
|
|
81
|
+
- Money is written once and read in the locale's own currency. `design` has nothing to do with it: a new `money` block takes a `base` (CZK unless a site says otherwise), a `locales` map from language to currency, the `rates` against that base, and optional `steps` for how coarsely a converted amount is rounded. `formatMoney(amount, lang)` returns the amount in that language's currency through `Intl.NumberFormat`, `convertMoney` gives the number alone, and `moneyCurrencyFor` the code. A ceiling rounds down and a floor rounds up, so a converted price never crosses the claim it stands for, and a currency with no rate falls back to the base rather than inventing one. The config reaches the client on `data-tbf-money-config`, written by the locale boot script, so a price renders the same before and after hydration.
|
|
82
|
+
- `fetchMoneyRates` reads the European Central Bank's daily reference rates, for a build that wants the conversion current without shipping a rate table by hand. It is in the `config` entry, because it belongs to the build and not to the page.
|
|
83
|
+
|
|
84
|
+
**Breaking:** the glass has one fill again. `design.glass.barColor` and `design.glass.barOpacity` are removed and `--tbf-glass-bar-bg` is no longer emitted. A bar and a pane are the same material, and the split let a header and a dropdown drift apart under the same background. Everything that frosts now reads `--tbf-glass-bg` and `--tbf-glass-filter`, and the fill defaults to `transparent`, so the glass tints nothing and has no light or dark form of its own.
|
|
85
|
+
|
|
86
|
+
**Breaking:** `clearContrast` is gone. Removing the measured state left a window in which nothing on the page knew its own tone, which was itself a flash of the wrong colour. The marks now stay until they are replaced.
|
|
87
|
+
|
|
88
|
+
- The contrast state is reached in the first style pass, not by a script. `body:has([data-tbf-dark="chrome"])` paints the header against a dark landing before any measurement runs, and every rule that guesses yields to `[data-tbf-on-dark]` the moment the runtime measures, so there is no window where the two disagree and no attribute has to be removed to hand over. A page load, a soft redirect and a reload after one all paint the correct colour in the first frame.
|
|
89
|
+
- A hairline cell declares the tone it paints. It fills with `--tbf-page` and took its text from `--tbf-text`, which a dark region rewrites to white, so a panel standing inside a dark band rendered white text on its own white card. A cell now resets the palette to the base tokens for its contents, and the inverted and hover cells set the dark palette and fill with `--tbf-contrast-ink` instead of `--tbf-text`, which a dark region bleaches.
|
|
90
|
+
- The inverse band fills with `--tbf-contrast-ink` for the same reason.
|
|
91
|
+
- `on-dark` and `on-light` moved to `contrast/styles/tone`, so a component can declare its own tone without pulling in the contrast stylesheet.
|
|
92
|
+
- A navigation settles without animating. The ink no longer tweens between pages, because a page switch is a switch, and `data-tbf-contrast-settle` holds transitions off while the new page is measured.
|
|
93
|
+
- A motif repaints on resize instead of scheduling one, since setting `canvas.width` clears it and a scheduled redraw is dropped while the loop is running. Detached motif canvases are now pruned, so soft redirects no longer leak observers.
|
|
94
|
+
|
|
95
|
+
## 23.3.0
|
|
96
|
+
|
|
97
|
+
- The glass has two fills, because a bar and a pane are not the same thing. A header lies over the page and should let it through: it takes `--tbf-glass-bar-bg`, which is clear, so all it adds is the blur. A popover, a dropdown or an open menu stands on the page as its own surface and has to be read against, so it keeps `--tbf-glass-bg` and its tint. Both still come from the one `design.glass` block, and a component picks the one that suits it, the same way it picks its own border.
|
|
98
|
+
|
|
3
99
|
## 23.2.0
|
|
4
100
|
|
|
5
101
|
- The glass is glass again. Its tint drops from 72% to 35%, which was raised too far while chasing text that had become unreadable under a pane with no fill at all. A pane now reads as something you see through rather than as a panel with a colour, and the page behind it is still damped enough for its contents to sit on. `opacity` sets it, as before.
|
package/README.md
CHANGED
|
@@ -98,7 +98,7 @@ Pass `level` to `Title` (or `titleAs` to a copy card) only for a page hero title
|
|
|
98
98
|
|
|
99
99
|
### Site Header
|
|
100
100
|
|
|
101
|
-
`SiteHeader` is the whole header of a content site: the sticky bar, the brand, the desktop navigation, the actions beside it, and the mobile menu behind the toggle. The menu is a full-width panel under the bar; it lists the same links, repeats the actions in a footer row, and closes on a link, on Escape, on a press outside the header and when the viewport grows past 768px. Pass the links as data, not markup:
|
|
101
|
+
`SiteHeader` is the whole header of a content site: the sticky bar, the brand, the desktop navigation, the actions beside it, and the mobile menu behind the toggle. The menu is a full-width panel under the bar; it lists the same links, repeats the actions in a footer row, and closes on a link, on Escape, on a press outside the header and when the viewport grows past 768px. The desktop navigation appears when it fits and not at a width: the header measures the bar against the links it was given and falls back to the menu whenever they would collide with the actions, so a site with four links keeps its bar on a tablet and a site with eight does not have to cram them at 820px. Pass the links as data, not markup:
|
|
102
102
|
|
|
103
103
|
```tsx
|
|
104
104
|
<SiteHeader
|
|
@@ -114,7 +114,35 @@ A header with no links and no `menuActions` has no toggle and keeps its actions
|
|
|
114
114
|
|
|
115
115
|
The header is the hydration root, so it renders itself as the `<header>` element. Server markup wraps it with `siteHeaderRootHtml(html)`, which the client hydrates through `SITE_HEADER_ROOT_SELECTOR`; the wrapper is `display: contents`, so the header still sticks to the viewport.
|
|
116
116
|
|
|
117
|
-
Colors, fonts, borders and spacing are tokens under `components.shell.header`: `root` (position, background, border, backdropFilter), `maxWidth`, `
|
|
117
|
+
Colors, fonts, borders and spacing are tokens under `components.shell.header`: `root` (position, background, border, backdropFilter), `maxWidth`, `brand`, `link`, `menu` and the motion pair `motionDuration` and `motionEasing`. Sizes are not: the bar is 5rem tall, its inline padding 1.5rem and 1rem once there is room for the full bar, a brand logo 3.5rem, navigation links 0.875rem, menu links 1rem, and the toggle a 3rem button with a 2rem icon, the same in every site.
|
|
118
|
+
|
|
119
|
+
`tone` decides where the bar takes its light or dark variant from, and nothing in the consuming application calls into it. `follow: "hero"`, the default, holds the tone of the page's first band for the whole page through one CSS rule and runs no script at all. `follow: "band"` gives the bar the tone of whatever band is under it as the page scrolls: the header reads `main`'s own children and the site footer, takes the one crossing its `probe` line (`0.5`, its own middle), and marks itself `data-tbf-dark` when that band carries it, so the ink, the border, the mobile menu and a logo that ships a light and a dark face all follow the one attribute. The CSS rule stays the pre-hydration and no-script answer in both modes. `duration` and `easing` set the crossfade, 320ms by default. A soft navigation does not cross-fade: `<html>` carries `data-tbf-page-swap` for the frame the page is replaced in, which holds every transition and animation at 1ms, so chrome arrives in the new page's colours instead of sliding into them while the reader is already looking at a different page.
|
|
120
|
+
|
|
121
|
+
### Prose Text
|
|
122
|
+
|
|
123
|
+
`ProseText` renders a plain string in which a marked span becomes a `TextLink`, so copy kept as strings can point at another page without becoming markup. It takes `text` and an optional `softRedirect`.
|
|
124
|
+
|
|
125
|
+
A span is marked in one of two spellings, which mean the same thing. In a markdown file, a comment pair, because a markdown renderer shows nothing of it and the document stays plain wherever else it is read:
|
|
126
|
+
|
|
127
|
+
```md
|
|
128
|
+
Read <!--tbf:link /philosophy-->the philosophy page<!--/tbf:link--> for why.
|
|
129
|
+
Get it from <!--tbf:link https://github.com/Trebired tab-->GitHub<!--/tbf:link-->.
|
|
130
|
+
Start at <!--tbf:link /downloads reload-->the downloads page<!--/tbf:link-->.
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
In source that nothing else renders, the short form: `[the philosophy page](/philosophy)`, equal to the comment pair with no flags.
|
|
134
|
+
|
|
135
|
+
The first token after the marker is the href and is required. `tab` opens a new tab and sets its `rel`; `reload` navigates fully instead of soft redirecting. Anything malformed, a missing href, an unknown flag, an unclosed pair, drops the annotation and renders the text plainly: a marker is never shown to a reader, and prose is never lost to a typo.
|
|
136
|
+
|
|
137
|
+
It is not a markdown renderer and will not become one. Bold, lists and headings stay out, because the moment copy carries markup the component that renders it owns a format, and a format has to be documented, versioned and escaped. A second annotation gets added when something needs one, not in advance.
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
### Site Footer
|
|
141
|
+
|
|
142
|
+
`SiteFooter` takes a `brand`, a `tagline`, `social` links, `columns` of links and a `note`. On a site that stands for itself they fill the whole footer: the brand on the left, the columns on the right. A site that belongs to someone else passes `site` as well, carrying that site's own `brand`, `tagline`, `social` and a row of `links`. That becomes a band above the first, with a rule between them: this site on top, and under it the owner's mark, one line saying who builds the site, and the columns that belong to the organization rather than to the product. One footer, one ground, two parts.
|
|
143
|
+
|
|
144
|
+
That is the whole mechanism for telling the two apart, and it is deliberate: a column heading cannot say whose links these are, because every column looks equally weighted, while a mark is read before it is read. The two parts share one ground, because a second background reads as a second footer rather than as the rest of this one. Give the bands the same heading names on every site so a reader learns one map, and let the same label appear in both bands when both genuinely have one, such as a brand page per site.
|
|
145
|
+
|
|
118
146
|
|
|
119
147
|
### Bottom Bar
|
|
120
148
|
|
|
@@ -154,9 +182,56 @@ Unknown sections fall through to the next handler. The request's own query is ke
|
|
|
154
182
|
|
|
155
183
|
Static apps set `assets.icons.mode: "static"` and `assets.icons.endpoint: false`, then register a build-generated icon cache before calling `bindFrontendRuntime(document, { icons: { mode: "static" } })`.
|
|
156
184
|
|
|
185
|
+
### Accessibility
|
|
186
|
+
|
|
187
|
+
`a11y` config owns the three settings a visitor sets for themselves: animation, text size and contrast.
|
|
188
|
+
|
|
189
|
+
```ts
|
|
190
|
+
a11y: {
|
|
191
|
+
cookie: false,
|
|
192
|
+
defaults: { contrast: "system", motion: "system", textSize: 100 },
|
|
193
|
+
textSizes: [100, 125, 150, 200],
|
|
194
|
+
}
|
|
195
|
+
```
|
|
196
|
+
|
|
197
|
+
`motion` is `"system"`, `"reduce"` or `"full"`. `contrast` is `"system"`, `"normal"` or `"high"`. `textSize` is one of `textSizes`. `cookie` adds a `ui_a11y` cookie beside the `localStorage` entry, for a server that renders the setting itself; it is off by default, because a static site has no server to read it.
|
|
198
|
+
|
|
199
|
+
A site passes the configured block to its one boot script so the settings apply before first paint:
|
|
200
|
+
|
|
201
|
+
```ts
|
|
202
|
+
const a11y = configureFrontendA11y(frontendConfig.a11y);
|
|
203
|
+
createLocaleBootScript(routing, { a11y, language, money, strategy });
|
|
204
|
+
```
|
|
205
|
+
|
|
206
|
+
Without that, the attributes are written by the runtime after hydration instead, and the page paints once with the wrong setting. The boot script writes four attributes on `<html>`: `data-tbf-motion-pref` is the choice, `data-tbf-reduce-motion` is the resolved `on`/`off` that CSS and motifs read, `data-tbf-text-size` is the percentage, and `data-tbf-high-contrast` is the resolved `on`/`off`.
|
|
207
|
+
|
|
208
|
+
`<AccessibilityMenu id lang />` renders the control as a popover, the same shape as `LocaleSwitcher`. `motionReduced()` is the predicate every animation checks; it reads the resolved attribute first and the media query only when no attribute is set, so an explicit "animation is fine" beats an operating system that asks for less. `announce(message)` speaks into the one polite live region the package renders. `contrastRatio(foreground, background)` returns a real WCAG ratio, with sRGB linearisation and alpha composited over the backdrop, and returns `null` rather than a guess for a colour it cannot parse, including `oklch()`; `meetsContrast(ratio, kind)` checks it against 4.5:1 for text, 3:1 for large text and 3:1 for non-text.
|
|
209
|
+
|
|
210
|
+
#### Touch targets
|
|
211
|
+
|
|
212
|
+
`--tbf-target-min` is the pointer target floor and defaults to `2.75rem`, which is 44px. That is WCAG 2.5.5 at level AAA. A dense surface opts down to `--tbf-target-min-dense`, `1.5rem`, by carrying `data-tbf-dense`; 24px is what WCAG 2.5.8 at level AA asks for. The opt-down is an explicit attribute on the surface. It is not a silent exception, and a surface that carries it is still accountable for the AA floor.
|
|
213
|
+
|
|
214
|
+
### Button variants
|
|
215
|
+
|
|
216
|
+
`design.components.primitives.button.variants` configures `chrome`, `danger`, `ghost`, `primary` and `secondary`. `chrome` is the header's own look: a compact quiet outline over whatever it sits on, and what the language switcher, the accessibility trigger and the choice rows in radio and checkbox groups all render as, so the three cannot drift apart. It is shorter than a content button and opts into the dense pointer tier, which is why it stays at 2rem beside a 2.75rem button. A variant may set `bg`, `border`, `color`, `radius`, `height`, `padding`, `fontSize` and a `states.hover` block.
|
|
217
|
+
|
|
218
|
+
Write only static values there. A variant value is emitted as a custom property on `:root`, so a `var()` written into config resolves once at the root and inherits already resolved. Leave the token unset and the rule's own fallback resolves it per element.
|
|
219
|
+
|
|
220
|
+
### Glass
|
|
221
|
+
|
|
222
|
+
`design.glass` is for a surface that lies over the page and lets it through. The glass has two fills. `--tbf-glass-bg` is clear and is what any surface that asks for glass gets; `--tbf-glass-tint-bg` carries the tint. `tint` is `light`, `dark` or `none` and sets the tinted fill: `light` is `--tbf-page`, `dark` is `--tbf-ink`, so a tinted pane matches the page exactly where nothing is behind it and reads as a material only where something is. `clear` sets the untinted fill, and `color` with `opacity` overrides the tint. Both shades are always emitted as `--tbf-glass-tint-light-bg` and `--tbf-glass-tint-dark-bg`.
|
|
223
|
+
|
|
224
|
+
The site header bar and the header's mobile menu do not take it. They are opaque: the bar fills with the page colour, or with the ink on a page whose first band is dark, and the menu fills to match. Chrome that carries the navigation is read at every scroll position, so it supplies its own ground rather than borrowing whatever happens to pass under it.
|
|
225
|
+
|
|
226
|
+
The chrome takes its tone from the markup, not from a measurement. A region that is dark says so with `data-tbf-dark`, or `data-tbf-tone="dark"`, which applies the dark tone to everything inside it. A page whose first band under the header is dark gives the header the dark tone through one rule, `body:has(main > [data-tbf-dark]:first-child)`, so the bar and its mobile menu are the page's own ink and ground from the first paint, with no script. The bar holds that tone for the whole page: it does not change as the page scrolls.
|
|
227
|
+
|
|
228
|
+
Nothing measures what is painted behind an element. A colour is either the palette's or declared by the markup.
|
|
229
|
+
|
|
230
|
+
A popover, a dropdown panel, a tooltip and a modal do not take it. They stand on the page rather than lying over it, they carry controls and text, and they appear over content they know nothing about, so each fills with `--tbf-surface` through its own token. For the same reason they are contrast surfaces rather than contrast items: their tone comes from the fill they supply, not from a reading of whatever is behind them.
|
|
231
|
+
|
|
157
232
|
### Systems
|
|
158
233
|
|
|
159
|
-
`systems` config
|
|
234
|
+
`systems` config gates which package-owned stylesheets are emitted, in the `SYSTEM_ORDER` cascade order. It does not gate boot scripts or binders.
|
|
160
235
|
|
|
161
236
|
## Runtime
|
|
162
237
|
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
declare const ANNOUNCER_ATTR: `data-${string}`;
|
|
2
|
+
declare function announcerElement(owner?: Document | null): HTMLElement | null;
|
|
3
|
+
declare function announce(message: string, owner?: Document | null): boolean;
|
|
4
|
+
export { ANNOUNCER_ATTR, announce, announcerElement };
|
|
5
|
+
//# sourceMappingURL=announce.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"announce.d.ts","sourceRoot":"","sources":["../../../src/a11y/announce.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,cAAc,kBAAqC,CAAC;AAiB1D,iBAAS,gBAAgB,CAAC,KAAK,CAAC,EAAE,QAAQ,GAAG,IAAI,GAAG,WAAW,GAAG,IAAI,CAKrE;AAED,iBAAS,QAAQ,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,QAAQ,GAAG,IAAI,GAAG,OAAO,CAYnE;AAED,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { frontendClassName, frontendDataAttr } from "./../namespace/index.js";
|
|
2
|
+
const ANNOUNCER_ATTR = frontendDataAttr("a11y-announcer");
|
|
3
|
+
const CLEAR_AFTER_MS = 1200;
|
|
4
|
+
let clearTimer = 0;
|
|
5
|
+
function createAnnouncer(owner) {
|
|
6
|
+
const node = owner.createElement("p");
|
|
7
|
+
node.className = frontendClassName("sr-only");
|
|
8
|
+
node.setAttribute(ANNOUNCER_ATTR, "");
|
|
9
|
+
node.setAttribute("aria-live", "polite");
|
|
10
|
+
node.setAttribute("aria-atomic", "true");
|
|
11
|
+
node.setAttribute("role", "status");
|
|
12
|
+
owner.body.append(node);
|
|
13
|
+
return node;
|
|
14
|
+
}
|
|
15
|
+
function announcerElement(owner) {
|
|
16
|
+
const doc = owner || (typeof document === "undefined" ? null : document);
|
|
17
|
+
if (!doc || !doc.body)
|
|
18
|
+
return null;
|
|
19
|
+
const existing = doc.querySelector(`[${ANNOUNCER_ATTR}]`);
|
|
20
|
+
return existing || createAnnouncer(doc);
|
|
21
|
+
}
|
|
22
|
+
function announce(message, owner) {
|
|
23
|
+
const text = String(message || "").trim();
|
|
24
|
+
const node = announcerElement(owner);
|
|
25
|
+
if (!text || !node)
|
|
26
|
+
return false;
|
|
27
|
+
node.textContent = "";
|
|
28
|
+
node.textContent = text;
|
|
29
|
+
if (typeof window === "undefined")
|
|
30
|
+
return true;
|
|
31
|
+
window.clearTimeout(clearTimer);
|
|
32
|
+
clearTimer = window.setTimeout(() => {
|
|
33
|
+
node.textContent = "";
|
|
34
|
+
}, CLEAR_AFTER_MS);
|
|
35
|
+
return true;
|
|
36
|
+
}
|
|
37
|
+
export { ANNOUNCER_ATTR, announce, announcerElement };
|
|
38
|
+
//# sourceMappingURL=announce.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"announce.js","sourceRoot":"","sources":["../../../src/a11y/announce.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE9E,MAAM,cAAc,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;AAE1D,MAAM,cAAc,GAAG,IAAI,CAAC;AAE5B,IAAI,UAAU,GAAG,CAAC,CAAC;AAEnB,SAAS,eAAe,CAAC,KAAe;IACtC,MAAM,IAAI,GAAG,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;IACtC,IAAI,CAAC,SAAS,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;IAC9C,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;IACtC,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;IACzC,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IACzC,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACpC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACxB,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,gBAAgB,CAAC,KAAuB;IAC/C,MAAM,GAAG,GAAG,KAAK,IAAI,CAAC,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACzE,IAAI,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IACnC,MAAM,QAAQ,GAAG,GAAG,CAAC,aAAa,CAAc,IAAI,cAAc,GAAG,CAAC,CAAC;IACvE,OAAO,QAAQ,IAAI,eAAe,CAAC,GAAG,CAAC,CAAC;AAC1C,CAAC;AAED,SAAS,QAAQ,CAAC,OAAe,EAAE,KAAuB;IACxD,MAAM,IAAI,GAAG,MAAM,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;IAC1C,MAAM,IAAI,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IACrC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI;QAAE,OAAO,KAAK,CAAC;IACjC,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;IACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;IACxB,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,OAAO,IAAI,CAAC;IAC/C,MAAM,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAChC,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;IACxB,CAAC,EAAE,cAAc,CAAC,CAAC;IACrB,OAAO,IAAI,CAAC;AACd,CAAC;AAED,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { FrontendA11ySettings, ResolvedFrontendA11ySettings } from "./types.js";
|
|
2
|
+
declare function systemPrefersHighContrast(): boolean;
|
|
3
|
+
declare function resolveA11ySettings(settings: FrontendA11ySettings): ResolvedFrontendA11ySettings;
|
|
4
|
+
declare function getA11ySettings(): FrontendA11ySettings;
|
|
5
|
+
declare function applyA11ySettings(settings: FrontendA11ySettings): ResolvedFrontendA11ySettings;
|
|
6
|
+
declare function runA11ySync(resolved: ResolvedFrontendA11ySettings): void;
|
|
7
|
+
declare function registerA11ySync(listener: (settings: ResolvedFrontendA11ySettings) => void): () => void;
|
|
8
|
+
declare function setA11yCookieEnabled(enabled: boolean): void;
|
|
9
|
+
declare function setA11ySettings(patch: Partial<FrontendA11ySettings>): ResolvedFrontendA11ySettings;
|
|
10
|
+
declare function configureA11yDefaults(defaults: unknown): FrontendA11ySettings;
|
|
11
|
+
declare function onSystemA11yChange(): () => void;
|
|
12
|
+
export { applyA11ySettings, configureA11yDefaults, getA11ySettings, onSystemA11yChange, registerA11ySync, resolveA11ySettings, runA11ySync, setA11yCookieEnabled, setA11ySettings, systemPrefersHighContrast, };
|
|
13
|
+
//# sourceMappingURL=apply.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"apply.d.ts","sourceRoot":"","sources":["../../../src/a11y/apply.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,oBAAoB,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAC;AAUrF,iBAAS,yBAAyB,IAAI,OAAO,CAG5C;AAED,iBAAS,mBAAmB,CAAC,QAAQ,EAAE,oBAAoB,GAAG,4BAA4B,CAMzF;AAED,iBAAS,eAAe,IAAI,oBAAoB,CAI/C;AAED,iBAAS,iBAAiB,CAAC,QAAQ,EAAE,oBAAoB,GAAG,4BAA4B,CASvF;AAED,iBAAS,WAAW,CAAC,QAAQ,EAAE,4BAA4B,GAAG,IAAI,CAEjE;AAED,iBAAS,gBAAgB,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,4BAA4B,KAAK,IAAI,GAAG,MAAM,IAAI,CAKhG;AAED,iBAAS,oBAAoB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAEpD;AAED,iBAAS,eAAe,CAAC,KAAK,EAAE,OAAO,CAAC,oBAAoB,CAAC,GAAG,4BAA4B,CAS3F;AAED,iBAAS,qBAAqB,CAAC,QAAQ,EAAE,OAAO,GAAG,oBAAoB,CAItE;AAED,iBAAS,kBAAkB,IAAI,MAAM,IAAI,CAUxC;AAED,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,WAAW,EACX,oBAAoB,EACpB,eAAe,EACf,yBAAyB,GAC1B,CAAC"}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { A11Y_CHANGE_EVENT, A11Y_HIGH_CONTRAST_ATTR, A11Y_MOTION_PREF_ATTR, A11Y_REDUCE_MOTION_ATTR, A11Y_TEXT_SIZE_ATTR, REDUCED_MOTION_QUERY, systemPrefersReducedMotion, } from "./attributes.js";
|
|
2
|
+
import { EMPTY_A11Y_SETTINGS, mergeA11ySettings, normalizeA11ySettings } from "./settings.js";
|
|
3
|
+
import { readStoredA11ySettings, writeStoredA11ySettings } from "./storage.js";
|
|
4
|
+
const HIGH_CONTRAST_QUERY = "(prefers-contrast: more)";
|
|
5
|
+
const syncListeners = new Set();
|
|
6
|
+
let current = null;
|
|
7
|
+
let cookieEnabled = false;
|
|
8
|
+
function systemPrefersHighContrast() {
|
|
9
|
+
if (typeof window === "undefined" || typeof window.matchMedia !== "function")
|
|
10
|
+
return false;
|
|
11
|
+
return window.matchMedia(HIGH_CONTRAST_QUERY).matches;
|
|
12
|
+
}
|
|
13
|
+
function resolveA11ySettings(settings) {
|
|
14
|
+
const reduceMotion = settings.motion === "reduce"
|
|
15
|
+
|| (settings.motion === "system" && systemPrefersReducedMotion());
|
|
16
|
+
const highContrast = settings.contrast === "high"
|
|
17
|
+
|| (settings.contrast === "system" && systemPrefersHighContrast());
|
|
18
|
+
return { ...settings, highContrast, reduceMotion };
|
|
19
|
+
}
|
|
20
|
+
function getA11ySettings() {
|
|
21
|
+
if (current)
|
|
22
|
+
return current;
|
|
23
|
+
current = readStoredA11ySettings() || { ...EMPTY_A11Y_SETTINGS };
|
|
24
|
+
return current;
|
|
25
|
+
}
|
|
26
|
+
function applyA11ySettings(settings) {
|
|
27
|
+
const resolved = resolveA11ySettings(settings);
|
|
28
|
+
if (typeof document === "undefined")
|
|
29
|
+
return resolved;
|
|
30
|
+
const root = document.documentElement;
|
|
31
|
+
root.setAttribute(A11Y_MOTION_PREF_ATTR, resolved.motion);
|
|
32
|
+
root.setAttribute(A11Y_REDUCE_MOTION_ATTR, resolved.reduceMotion ? "on" : "off");
|
|
33
|
+
root.setAttribute(A11Y_TEXT_SIZE_ATTR, String(resolved.textSize));
|
|
34
|
+
root.setAttribute(A11Y_HIGH_CONTRAST_ATTR, resolved.highContrast ? "on" : "off");
|
|
35
|
+
return resolved;
|
|
36
|
+
}
|
|
37
|
+
function runA11ySync(resolved) {
|
|
38
|
+
for (const listener of syncListeners)
|
|
39
|
+
listener(resolved);
|
|
40
|
+
}
|
|
41
|
+
function registerA11ySync(listener) {
|
|
42
|
+
syncListeners.add(listener);
|
|
43
|
+
return () => {
|
|
44
|
+
syncListeners.delete(listener);
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
function setA11yCookieEnabled(enabled) {
|
|
48
|
+
cookieEnabled = enabled;
|
|
49
|
+
}
|
|
50
|
+
function setA11ySettings(patch) {
|
|
51
|
+
current = mergeA11ySettings(getA11ySettings(), patch);
|
|
52
|
+
const resolved = applyA11ySettings(current);
|
|
53
|
+
writeStoredA11ySettings(current, cookieEnabled);
|
|
54
|
+
runA11ySync(resolved);
|
|
55
|
+
if (typeof document !== "undefined") {
|
|
56
|
+
document.dispatchEvent(new CustomEvent(A11Y_CHANGE_EVENT, { detail: resolved }));
|
|
57
|
+
}
|
|
58
|
+
return resolved;
|
|
59
|
+
}
|
|
60
|
+
function configureA11yDefaults(defaults) {
|
|
61
|
+
if (readStoredA11ySettings())
|
|
62
|
+
return getA11ySettings();
|
|
63
|
+
current = normalizeA11ySettings(defaults);
|
|
64
|
+
return current;
|
|
65
|
+
}
|
|
66
|
+
function onSystemA11yChange() {
|
|
67
|
+
if (typeof window === "undefined" || typeof window.matchMedia !== "function")
|
|
68
|
+
return () => { };
|
|
69
|
+
const queries = [window.matchMedia(REDUCED_MOTION_QUERY), window.matchMedia(HIGH_CONTRAST_QUERY)];
|
|
70
|
+
const handler = () => {
|
|
71
|
+
runA11ySync(applyA11ySettings(getA11ySettings()));
|
|
72
|
+
};
|
|
73
|
+
for (const query of queries)
|
|
74
|
+
query.addEventListener("change", handler);
|
|
75
|
+
return () => {
|
|
76
|
+
for (const query of queries)
|
|
77
|
+
query.removeEventListener("change", handler);
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
export { applyA11ySettings, configureA11yDefaults, getA11ySettings, onSystemA11yChange, registerA11ySync, resolveA11ySettings, runA11ySync, setA11yCookieEnabled, setA11ySettings, systemPrefersHighContrast, };
|
|
81
|
+
//# sourceMappingURL=apply.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"apply.js","sourceRoot":"","sources":["../../../src/a11y/apply.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,uBAAuB,EACvB,qBAAqB,EACrB,uBAAuB,EACvB,mBAAmB,EACnB,oBAAoB,EACpB,0BAA0B,GAC3B,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,MAAM,cAAc,CAAC;AAI/E,MAAM,mBAAmB,GAAG,0BAA0B,CAAC;AAEvD,MAAM,aAAa,GAAG,IAAI,GAAG,EAAiD,CAAC;AAE/E,IAAI,OAAO,GAAgC,IAAI,CAAC;AAEhD,IAAI,aAAa,GAAG,KAAK,CAAC;AAE1B,SAAS,yBAAyB;IAChC,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,OAAO,MAAM,CAAC,UAAU,KAAK,UAAU;QAAE,OAAO,KAAK,CAAC;IAC3F,OAAO,MAAM,CAAC,UAAU,CAAC,mBAAmB,CAAC,CAAC,OAAO,CAAC;AACxD,CAAC;AAED,SAAS,mBAAmB,CAAC,QAA8B;IACzD,MAAM,YAAY,GAAG,QAAQ,CAAC,MAAM,KAAK,QAAQ;WAC/C,CAAC,QAAQ,CAAC,MAAM,KAAK,QAAQ,IAAI,0BAA0B,EAAE,CAAC,CAAC;IACjE,MAAM,YAAY,GAAG,QAAQ,CAAC,QAAQ,KAAK,MAAM;WAC/C,CAAC,QAAQ,CAAC,QAAQ,KAAK,QAAQ,IAAI,yBAAyB,EAAE,CAAC,CAAC;IAClE,OAAO,EAAE,GAAG,QAAQ,EAAE,YAAY,EAAE,YAAY,EAAE,CAAC;AACrD,CAAC;AAED,SAAS,eAAe;IACtB,IAAI,OAAO;QAAE,OAAO,OAAO,CAAC;IAC5B,OAAO,GAAG,sBAAsB,EAAE,IAAI,EAAE,GAAG,mBAAmB,EAAE,CAAC;IACjE,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,SAAS,iBAAiB,CAAC,QAA8B;IACvD,MAAM,QAAQ,GAAG,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IAC/C,IAAI,OAAO,QAAQ,KAAK,WAAW;QAAE,OAAO,QAAQ,CAAC;IACrD,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC;IACtC,IAAI,CAAC,YAAY,CAAC,qBAAqB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC1D,IAAI,CAAC,YAAY,CAAC,uBAAuB,EAAE,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IACjF,IAAI,CAAC,YAAY,CAAC,mBAAmB,EAAE,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;IAClE,IAAI,CAAC,YAAY,CAAC,uBAAuB,EAAE,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IACjF,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,SAAS,WAAW,CAAC,QAAsC;IACzD,KAAK,MAAM,QAAQ,IAAI,aAAa;QAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAC3D,CAAC;AAED,SAAS,gBAAgB,CAAC,QAA0D;IAClF,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IAC5B,OAAO,GAAG,EAAE;QACV,aAAa,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IACjC,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,OAAgB;IAC5C,aAAa,GAAG,OAAO,CAAC;AAC1B,CAAC;AAED,SAAS,eAAe,CAAC,KAAoC;IAC3D,OAAO,GAAG,iBAAiB,CAAC,eAAe,EAAE,EAAE,KAAK,CAAC,CAAC;IACtD,MAAM,QAAQ,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAC5C,uBAAuB,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;IAChD,WAAW,CAAC,QAAQ,CAAC,CAAC;IACtB,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,CAAC;QACpC,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,iBAAiB,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;IACnF,CAAC;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED,SAAS,qBAAqB,CAAC,QAAiB;IAC9C,IAAI,sBAAsB,EAAE;QAAE,OAAO,eAAe,EAAE,CAAC;IACvD,OAAO,GAAG,qBAAqB,CAAC,QAAQ,CAAC,CAAC;IAC1C,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,SAAS,kBAAkB;IACzB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,OAAO,MAAM,CAAC,UAAU,KAAK,UAAU;QAAE,OAAO,GAAG,EAAE,GAAE,CAAC,CAAC;IAC9F,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,UAAU,CAAC,oBAAoB,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,mBAAmB,CAAC,CAAC,CAAC;IAClG,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,WAAW,CAAC,iBAAiB,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC;IACpD,CAAC,CAAC;IACF,KAAK,MAAM,KAAK,IAAI,OAAO;QAAE,KAAK,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IACvE,OAAO,GAAG,EAAE;QACV,KAAK,MAAM,KAAK,IAAI,OAAO;YAAE,KAAK,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;IAC5E,CAAC,CAAC;AACJ,CAAC;AAED,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,gBAAgB,EAChB,mBAAmB,EACnB,WAAW,EACX,oBAAoB,EACpB,eAAe,EACf,yBAAyB,GAC1B,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
declare const A11Y_MOTION_PREF_ATTR: `data-${string}`;
|
|
2
|
+
declare const A11Y_REDUCE_MOTION_ATTR: `data-${string}`;
|
|
3
|
+
declare const A11Y_TEXT_SIZE_ATTR: `data-${string}`;
|
|
4
|
+
declare const A11Y_HIGH_CONTRAST_ATTR: `data-${string}`;
|
|
5
|
+
declare const A11Y_CONFIG_ATTR: `data-${string}`;
|
|
6
|
+
declare const A11Y_BOUND_ATTR: `data-${string}`;
|
|
7
|
+
declare const A11Y_FIELD_ATTR: `data-${string}`;
|
|
8
|
+
declare const A11Y_PANEL_SELECTOR: string;
|
|
9
|
+
declare const A11Y_STATUS_SELECTOR: string;
|
|
10
|
+
declare const A11Y_CHANGE_EVENT: string;
|
|
11
|
+
declare const A11Y_MAIN_ID: string;
|
|
12
|
+
declare const REDUCED_MOTION_QUERY = "(prefers-reduced-motion: reduce)";
|
|
13
|
+
declare function readReduceMotionAttribute(doc?: Document | null): string;
|
|
14
|
+
declare function systemPrefersReducedMotion(): boolean;
|
|
15
|
+
declare function motionReduced(doc?: Document | null): boolean;
|
|
16
|
+
export { A11Y_BOUND_ATTR, A11Y_CHANGE_EVENT, A11Y_CONFIG_ATTR, A11Y_FIELD_ATTR, A11Y_HIGH_CONTRAST_ATTR, A11Y_MAIN_ID, A11Y_MOTION_PREF_ATTR, A11Y_PANEL_SELECTOR, A11Y_REDUCE_MOTION_ATTR, A11Y_STATUS_SELECTOR, A11Y_TEXT_SIZE_ATTR, motionReduced, readReduceMotionAttribute, REDUCED_MOTION_QUERY, systemPrefersReducedMotion, };
|
|
17
|
+
//# sourceMappingURL=attributes.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"attributes.d.ts","sourceRoot":"","sources":["../../../src/a11y/attributes.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,qBAAqB,kBAAkC,CAAC;AAE9D,QAAA,MAAM,uBAAuB,kBAAoC,CAAC;AAElE,QAAA,MAAM,mBAAmB,kBAAgC,CAAC;AAE1D,QAAA,MAAM,uBAAuB,kBAAoC,CAAC;AAElE,QAAA,MAAM,gBAAgB,kBAAkC,CAAC;AAEzD,QAAA,MAAM,eAAe,kBAAiC,CAAC;AAEvD,QAAA,MAAM,eAAe,kBAAiC,CAAC;AAEvD,QAAA,MAAM,mBAAmB,QAAqC,CAAC;AAE/D,QAAA,MAAM,oBAAoB,QAAsC,CAAC;AAEjE,QAAA,MAAM,iBAAiB,QAAkC,CAAC;AAE1D,QAAA,MAAM,YAAY,QAAgC,CAAC;AAEnD,QAAA,MAAM,oBAAoB,qCAAqC,CAAC;AAEhE,iBAAS,yBAAyB,CAAC,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,GAAG,MAAM,CAIhE;AAED,iBAAS,0BAA0B,IAAI,OAAO,CAG7C;AAED,iBAAS,aAAa,CAAC,GAAG,CAAC,EAAE,QAAQ,GAAG,IAAI,GAAG,OAAO,CAKrD;AAED,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,uBAAuB,EACvB,YAAY,EACZ,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,aAAa,EACb,yBAAyB,EACzB,oBAAoB,EACpB,0BAA0B,GAC3B,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { frontendDataAttr, frontendDataSelector, frontendEventName, frontendToken } from "./../namespace/index.js";
|
|
2
|
+
const A11Y_MOTION_PREF_ATTR = frontendDataAttr("motion-pref");
|
|
3
|
+
const A11Y_REDUCE_MOTION_ATTR = frontendDataAttr("reduce-motion");
|
|
4
|
+
const A11Y_TEXT_SIZE_ATTR = frontendDataAttr("text-size");
|
|
5
|
+
const A11Y_HIGH_CONTRAST_ATTR = frontendDataAttr("high-contrast");
|
|
6
|
+
const A11Y_CONFIG_ATTR = frontendDataAttr("a11y-config");
|
|
7
|
+
const A11Y_BOUND_ATTR = frontendDataAttr("a11y-bound");
|
|
8
|
+
const A11Y_FIELD_ATTR = frontendDataAttr("a11y-field");
|
|
9
|
+
const A11Y_PANEL_SELECTOR = frontendDataSelector("a11y-panel");
|
|
10
|
+
const A11Y_STATUS_SELECTOR = frontendDataSelector("a11y-status");
|
|
11
|
+
const A11Y_CHANGE_EVENT = frontendEventName("a11ychange");
|
|
12
|
+
const A11Y_MAIN_ID = frontendToken("main-content");
|
|
13
|
+
const REDUCED_MOTION_QUERY = "(prefers-reduced-motion: reduce)";
|
|
14
|
+
function readReduceMotionAttribute(doc) {
|
|
15
|
+
const owner = doc || (typeof document === "undefined" ? null : document);
|
|
16
|
+
if (!owner)
|
|
17
|
+
return "";
|
|
18
|
+
return owner.documentElement.getAttribute(A11Y_REDUCE_MOTION_ATTR) || "";
|
|
19
|
+
}
|
|
20
|
+
function systemPrefersReducedMotion() {
|
|
21
|
+
if (typeof window === "undefined" || typeof window.matchMedia !== "function")
|
|
22
|
+
return false;
|
|
23
|
+
return window.matchMedia(REDUCED_MOTION_QUERY).matches;
|
|
24
|
+
}
|
|
25
|
+
function motionReduced(doc) {
|
|
26
|
+
const attribute = readReduceMotionAttribute(doc);
|
|
27
|
+
if (attribute === "on")
|
|
28
|
+
return true;
|
|
29
|
+
if (attribute === "off")
|
|
30
|
+
return false;
|
|
31
|
+
return systemPrefersReducedMotion();
|
|
32
|
+
}
|
|
33
|
+
export { A11Y_BOUND_ATTR, A11Y_CHANGE_EVENT, A11Y_CONFIG_ATTR, A11Y_FIELD_ATTR, A11Y_HIGH_CONTRAST_ATTR, A11Y_MAIN_ID, A11Y_MOTION_PREF_ATTR, A11Y_PANEL_SELECTOR, A11Y_REDUCE_MOTION_ATTR, A11Y_STATUS_SELECTOR, A11Y_TEXT_SIZE_ATTR, motionReduced, readReduceMotionAttribute, REDUCED_MOTION_QUERY, systemPrefersReducedMotion, };
|
|
34
|
+
//# sourceMappingURL=attributes.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"attributes.js","sourceRoot":"","sources":["../../../src/a11y/attributes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAEnH,MAAM,qBAAqB,GAAG,gBAAgB,CAAC,aAAa,CAAC,CAAC;AAE9D,MAAM,uBAAuB,GAAG,gBAAgB,CAAC,eAAe,CAAC,CAAC;AAElE,MAAM,mBAAmB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;AAE1D,MAAM,uBAAuB,GAAG,gBAAgB,CAAC,eAAe,CAAC,CAAC;AAElE,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,aAAa,CAAC,CAAC;AAEzD,MAAM,eAAe,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;AAEvD,MAAM,eAAe,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;AAEvD,MAAM,mBAAmB,GAAG,oBAAoB,CAAC,YAAY,CAAC,CAAC;AAE/D,MAAM,oBAAoB,GAAG,oBAAoB,CAAC,aAAa,CAAC,CAAC;AAEjE,MAAM,iBAAiB,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;AAE1D,MAAM,YAAY,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC;AAEnD,MAAM,oBAAoB,GAAG,kCAAkC,CAAC;AAEhE,SAAS,yBAAyB,CAAC,GAAqB;IACtD,MAAM,KAAK,GAAG,GAAG,IAAI,CAAC,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACzE,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,CAAC;IACtB,OAAO,KAAK,CAAC,eAAe,CAAC,YAAY,CAAC,uBAAuB,CAAC,IAAI,EAAE,CAAC;AAC3E,CAAC;AAED,SAAS,0BAA0B;IACjC,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,OAAO,MAAM,CAAC,UAAU,KAAK,UAAU;QAAE,OAAO,KAAK,CAAC;IAC3F,OAAO,MAAM,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC,OAAO,CAAC;AACzD,CAAC;AAED,SAAS,aAAa,CAAC,GAAqB;IAC1C,MAAM,SAAS,GAAG,yBAAyB,CAAC,GAAG,CAAC,CAAC;IACjD,IAAI,SAAS,KAAK,IAAI;QAAE,OAAO,IAAI,CAAC;IACpC,IAAI,SAAS,KAAK,KAAK;QAAE,OAAO,KAAK,CAAC;IACtC,OAAO,0BAA0B,EAAE,CAAC;AACtC,CAAC;AAED,OAAO,EACL,eAAe,EACf,iBAAiB,EACjB,gBAAgB,EAChB,eAAe,EACf,uBAAuB,EACvB,YAAY,EACZ,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,aAAa,EACb,yBAAyB,EACzB,oBAAoB,EACpB,0BAA0B,GAC3B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"boot.d.ts","sourceRoot":"","sources":["../../../src/a11y/boot.ts"],"names":[],"mappings":"AAiBA,iBAAS,cAAc,CAAC,MAAM,EAAE,OAAO,GAAG,MAAM,EAAE,CAiBjD;AAED,iBAAS,oBAAoB,CAAC,MAAM,EAAE,OAAO,GAAG,MAAM,CAErD;AAED,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,CAAC"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { A11Y_CONFIG_ATTR, A11Y_HIGH_CONTRAST_ATTR, A11Y_MOTION_PREF_ATTR, A11Y_REDUCE_MOTION_ATTR, A11Y_TEXT_SIZE_ATTR, REDUCED_MOTION_QUERY, } from "./attributes.js";
|
|
2
|
+
import { A11Y_COOKIE_NAME, A11Y_STORAGE_KEY } from "./storage.js";
|
|
3
|
+
import { normalizeA11yRuntimeConfig } from "./config.js";
|
|
4
|
+
const HIGH_CONTRAST_QUERY = "(prefers-contrast: more)";
|
|
5
|
+
function bootJson(value) {
|
|
6
|
+
return JSON.stringify(value ?? null).replace(/</gu, "\\u003c");
|
|
7
|
+
}
|
|
8
|
+
function a11yBootSource(config) {
|
|
9
|
+
const resolved = normalizeA11yRuntimeConfig(config);
|
|
10
|
+
return [
|
|
11
|
+
`h.setAttribute(${bootJson(A11Y_CONFIG_ATTR)},${bootJson(bootJson(resolved))});`,
|
|
12
|
+
`var AK=${bootJson(A11Y_STORAGE_KEY)},AC=${bootJson(A11Y_COOKIE_NAME)},`,
|
|
13
|
+
`AD=${bootJson(resolved.defaults)},`,
|
|
14
|
+
`AM=${bootJson(A11Y_MOTION_PREF_ATTR)},AR=${bootJson(A11Y_REDUCE_MOTION_ATTR)},`,
|
|
15
|
+
`AT=${bootJson(A11Y_TEXT_SIZE_ATTR)},AH=${bootJson(A11Y_HIGH_CONTRAST_ATTR)};`,
|
|
16
|
+
"var as=null;try{as=JSON.parse(localStorage.getItem(AK)||'null')}catch(e){as=null}",
|
|
17
|
+
"if(!as){var am=document.cookie.match('(?:^|; )'+AC+'=([^;]*)');",
|
|
18
|
+
"if(am){try{as=JSON.parse(decodeURIComponent(am[1]))}catch(e){as=null}}}",
|
|
19
|
+
"as=as||AD;var ap=as.motion||'system',ac=as.contrast||'system',az=as.textSize||100;",
|
|
20
|
+
`var ar=ap==='reduce'||(ap==='system'&&matchMedia(${bootJson(REDUCED_MOTION_QUERY)}).matches);`,
|
|
21
|
+
`var ah=ac==='high'||(ac==='system'&&matchMedia(${bootJson(HIGH_CONTRAST_QUERY)}).matches);`,
|
|
22
|
+
"h.setAttribute(AM,ap);h.setAttribute(AR,ar?'on':'off');",
|
|
23
|
+
"h.setAttribute(AT,String(az));h.setAttribute(AH,ah?'on':'off');",
|
|
24
|
+
];
|
|
25
|
+
}
|
|
26
|
+
function createA11yBootScript(config) {
|
|
27
|
+
return ["(function(){var h=document.documentElement;", ...a11yBootSource(config), "})();"].join("");
|
|
28
|
+
}
|
|
29
|
+
export { a11yBootSource, createA11yBootScript };
|
|
30
|
+
//# sourceMappingURL=boot.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"boot.js","sourceRoot":"","sources":["../../../src/a11y/boot.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,uBAAuB,EACvB,qBAAqB,EACrB,uBAAuB,EACvB,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAClE,OAAO,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAC;AAEzD,MAAM,mBAAmB,GAAG,0BAA0B,CAAC;AAEvD,SAAS,QAAQ,CAAC,KAAc;IAC9B,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;AACjE,CAAC;AAED,SAAS,cAAc,CAAC,MAAe;IACrC,MAAM,QAAQ,GAAG,0BAA0B,CAAC,MAAM,CAAC,CAAC;IACpD,OAAO;QACL,kBAAkB,QAAQ,CAAC,gBAAgB,CAAC,IAAI,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,IAAI;QAChF,UAAU,QAAQ,CAAC,gBAAgB,CAAC,OAAO,QAAQ,CAAC,gBAAgB,CAAC,GAAG;QACxE,MAAM,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG;QACpC,MAAM,QAAQ,CAAC,qBAAqB,CAAC,OAAO,QAAQ,CAAC,uBAAuB,CAAC,GAAG;QAChF,MAAM,QAAQ,CAAC,mBAAmB,CAAC,OAAO,QAAQ,CAAC,uBAAuB,CAAC,GAAG;QAC9E,mFAAmF;QACnF,iEAAiE;QACjE,yEAAyE;QACzE,oFAAoF;QACpF,oDAAoD,QAAQ,CAAC,oBAAoB,CAAC,aAAa;QAC/F,kDAAkD,QAAQ,CAAC,mBAAmB,CAAC,aAAa;QAC5F,yDAAyD;QACzD,iEAAiE;KAClE,CAAC;AACJ,CAAC;AAED,SAAS,oBAAoB,CAAC,MAAe;IAC3C,OAAO,CAAC,6CAA6C,EAAE,GAAG,cAAc,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACtG,CAAC;AAED,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { A11yTextSize, FrontendA11ySettings } from "./../types.js";
|
|
2
|
+
type AccessibilityMenuProps = {
|
|
3
|
+
className?: string;
|
|
4
|
+
id?: string;
|
|
5
|
+
lang?: string;
|
|
6
|
+
settings?: FrontendA11ySettings;
|
|
7
|
+
textSizes?: A11yTextSize[];
|
|
8
|
+
};
|
|
9
|
+
declare function accessibility_menu(props: AccessibilityMenuProps): import("react").JSX.Element;
|
|
10
|
+
declare const AccessibilityMenu: typeof accessibility_menu;
|
|
11
|
+
export { AccessibilityMenu, accessibility_menu };
|
|
12
|
+
export type { AccessibilityMenuProps };
|
|
13
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/a11y/components/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAExE,KAAK,sBAAsB,GAAG;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;CAC5B,CAAC;AAEF,iBAAS,kBAAkB,CAAC,KAAK,EAAE,sBAAsB,+BAoCxD;AAED,QAAA,MAAM,iBAAiB,2BAAqB,CAAC;AAE7C,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,CAAC;AACjD,YAAY,EAAE,sBAAsB,EAAE,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { sourceLanguageMessage } from "./../../language/messages.js";
|
|
3
|
+
import { frontendClassName, frontendClassNames, frontendDataAttrs } from "../../namespace/index.js";
|
|
4
|
+
import { Icon } from "../../icons/react/index.js";
|
|
5
|
+
import { primitiveButtonClassName } from "../../primitives/components/classes.js";
|
|
6
|
+
import { a11ySections } from "./sections.js";
|
|
7
|
+
function accessibility_menu(props) {
|
|
8
|
+
const localT = (key) => sourceLanguageMessage(key, props.lang);
|
|
9
|
+
const triggerId = props.id || "a11y_menu_trigger";
|
|
10
|
+
const panelId = `${triggerId}_panel`;
|
|
11
|
+
const label = localT("a11yTriggerLabel");
|
|
12
|
+
return (_jsxs(_Fragment, { children: [_jsx("button", { "aria-controls": panelId, "aria-expanded": "false", "aria-label": label, className: primitiveButtonClassName({
|
|
13
|
+
className: frontendClassName("a11y-trigger"),
|
|
14
|
+
icon: true,
|
|
15
|
+
variant: "chrome",
|
|
16
|
+
}), id: triggerId, type: "button", ...frontendDataAttrs({ "popover-indicator": "false", "popover-trigger": "", "tooltip": label }), children: _jsx(Icon, { spec: "remixicon:wheelchair-line" }) }), _jsx("div", { "aria-hidden": "true", "aria-label": localT("a11yPanelLabel"), className: frontendClassNames("popover", "a11y-panel"), id: panelId, inert: true, role: "group", ...frontendDataAttrs({ "a11y-panel": "", "popover": "", "popover-autofocus": "true" }), children: a11ySections({ lang: props.lang, settings: props.settings, textSizes: props.textSizes }) })] }));
|
|
17
|
+
}
|
|
18
|
+
const AccessibilityMenu = accessibility_menu;
|
|
19
|
+
export { AccessibilityMenu, accessibility_menu };
|
|
20
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/a11y/components/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACzF,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACrC,OAAO,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAY7C,SAAS,kBAAkB,CAAC,KAA6B;IACvD,MAAM,MAAM,GAAG,CAAC,GAAW,EAAE,EAAE,CAAC,qBAAqB,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;IACvE,MAAM,SAAS,GAAG,KAAK,CAAC,EAAE,IAAI,mBAAmB,CAAC;IAClD,MAAM,OAAO,GAAG,GAAG,SAAS,QAAQ,CAAC;IACrC,MAAM,KAAK,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAEzC,OAAO,CACL,8BACA,kCACe,OAAO,mBACR,OAAO,gBACT,KAAK,EACjB,SAAS,EAAE,wBAAwB,CAAC;oBAC9B,SAAS,EAAE,iBAAiB,CAAC,cAAc,CAAC;oBAC5C,IAAI,EAAE,IAAI;oBACV,OAAO,EAAE,QAAQ;iBACtB,CAAC,EACF,EAAE,EAAE,SAAS,EACb,IAAI,EAAC,QAAQ,KACT,iBAAiB,CAAC,EAAE,mBAAmB,EAAE,OAAO,EAAE,iBAAiB,EAAE,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,YAEhG,KAAC,IAAI,IAAC,IAAI,EAAC,2BAA2B,GAAG,GAChC,EACT,6BACY,MAAM,gBACN,MAAM,CAAC,gBAAgB,CAAC,EACpC,SAAS,EAAE,kBAAkB,CAAC,SAAS,EAAE,YAAY,CAAC,EACtD,EAAE,EAAE,OAAO,EACX,KAAK,QACL,IAAI,EAAC,OAAO,KACR,iBAAiB,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,mBAAmB,EAAE,MAAM,EAAE,CAAC,YAEtF,YAAY,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,GACnF,IACH,CACJ,CAAC;AACJ,CAAC;AAED,MAAM,iBAAiB,GAAG,kBAAkB,CAAC;AAE7C,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { A11yTextSize, FrontendA11ySettings } from "./../types.js";
|
|
2
|
+
type SectionsProps = {
|
|
3
|
+
lang?: string;
|
|
4
|
+
settings?: FrontendA11ySettings;
|
|
5
|
+
textSizes?: A11yTextSize[];
|
|
6
|
+
};
|
|
7
|
+
declare function a11ySections(props: SectionsProps): import("react").JSX.Element;
|
|
8
|
+
export { a11ySections };
|
|
9
|
+
//# sourceMappingURL=sections.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sections.d.ts","sourceRoot":"","sources":["../../../../src/a11y/components/sections.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAExE,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,SAAS,CAAC,EAAE,YAAY,EAAE,CAAC;CAC5B,CAAC;AAqDF,iBAAS,YAAY,CAAC,KAAK,EAAE,aAAa,+BAUzC;AAED,OAAO,EAAE,YAAY,EAAE,CAAC"}
|