@bquery/bquery 1.6.0 → 1.8.1
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/README.md +192 -18
- package/dist/a11y/announce.d.ts +43 -0
- package/dist/a11y/announce.d.ts.map +1 -0
- package/dist/a11y/audit.d.ts +42 -0
- package/dist/a11y/audit.d.ts.map +1 -0
- package/dist/a11y/index.d.ts +53 -0
- package/dist/a11y/index.d.ts.map +1 -0
- package/dist/a11y/media-preferences.d.ts +77 -0
- package/dist/a11y/media-preferences.d.ts.map +1 -0
- package/dist/a11y/roving-tab-index.d.ts +38 -0
- package/dist/a11y/roving-tab-index.d.ts.map +1 -0
- package/dist/a11y/skip-link.d.ts +37 -0
- package/dist/a11y/skip-link.d.ts.map +1 -0
- package/dist/a11y/trap-focus.d.ts +49 -0
- package/dist/a11y/trap-focus.d.ts.map +1 -0
- package/dist/a11y/types.d.ts +152 -0
- package/dist/a11y/types.d.ts.map +1 -0
- package/dist/a11y-DVBCy09c.js +421 -0
- package/dist/a11y-DVBCy09c.js.map +1 -0
- package/dist/a11y.es.mjs +14 -0
- package/dist/component/component.d.ts.map +1 -1
- package/dist/component/html.d.ts.map +1 -1
- package/dist/component/index.d.ts +2 -1
- package/dist/component/index.d.ts.map +1 -1
- package/dist/component/library.d.ts.map +1 -1
- package/dist/component/scope.d.ts +138 -0
- package/dist/component/scope.d.ts.map +1 -0
- package/dist/component/types.d.ts +53 -1
- package/dist/component/types.d.ts.map +1 -1
- package/dist/component-L3-JfOFz.js +684 -0
- package/dist/component-L3-JfOFz.js.map +1 -0
- package/dist/component.es.mjs +9 -6
- package/dist/{config-DRmZZno3.js → config-DhT9auRm.js} +4 -4
- package/dist/{config-DRmZZno3.js.map → config-DhT9auRm.js.map} +1 -1
- package/dist/constraints-D5RHQLmP.js +100 -0
- package/dist/constraints-D5RHQLmP.js.map +1 -0
- package/dist/core/collection.d.ts +134 -0
- package/dist/core/collection.d.ts.map +1 -1
- package/dist/core/element.d.ts +120 -0
- package/dist/core/element.d.ts.map +1 -1
- package/dist/core/env.d.ts +18 -0
- package/dist/core/env.d.ts.map +1 -0
- package/dist/core/index.d.ts +1 -0
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/shared.d.ts +14 -0
- package/dist/core/shared.d.ts.map +1 -1
- package/dist/core/utils/index.d.ts +52 -41
- package/dist/core/utils/index.d.ts.map +1 -1
- package/dist/core-DdtZHzsS.js +168 -0
- package/dist/core-DdtZHzsS.js.map +1 -0
- package/dist/{core-CCEabVHl.js → core-EMYSLzaT.js} +293 -194
- package/dist/core-EMYSLzaT.js.map +1 -0
- package/dist/core.es.mjs +48 -46
- package/dist/custom-directives-Dr4C5lVV.js +9 -0
- package/dist/custom-directives-Dr4C5lVV.js.map +1 -0
- package/dist/devtools/devtools.d.ts +212 -0
- package/dist/devtools/devtools.d.ts.map +1 -0
- package/dist/devtools/index.d.ts +20 -0
- package/dist/devtools/index.d.ts.map +1 -0
- package/dist/devtools/types.d.ts +69 -0
- package/dist/devtools/types.d.ts.map +1 -0
- package/dist/devtools-BhB2iDPT.js +122 -0
- package/dist/devtools-BhB2iDPT.js.map +1 -0
- package/dist/devtools.es.mjs +19 -0
- package/dist/dnd/draggable.d.ts +51 -0
- package/dist/dnd/draggable.d.ts.map +1 -0
- package/dist/dnd/droppable.d.ts +38 -0
- package/dist/dnd/droppable.d.ts.map +1 -0
- package/dist/dnd/index.d.ts +47 -0
- package/dist/dnd/index.d.ts.map +1 -0
- package/dist/dnd/sortable.d.ts +43 -0
- package/dist/dnd/sortable.d.ts.map +1 -0
- package/dist/dnd/types.d.ts +250 -0
- package/dist/dnd/types.d.ts.map +1 -0
- package/dist/dnd-NwZBYh4l.js +244 -0
- package/dist/dnd-NwZBYh4l.js.map +1 -0
- package/dist/dnd.es.mjs +6 -0
- package/dist/env-CTdvLaH2.js +19 -0
- package/dist/env-CTdvLaH2.js.map +1 -0
- package/dist/forms/create-form.d.ts +49 -0
- package/dist/forms/create-form.d.ts.map +1 -0
- package/dist/forms/index.d.ts +40 -0
- package/dist/forms/index.d.ts.map +1 -0
- package/dist/forms/types.d.ts +185 -0
- package/dist/forms/types.d.ts.map +1 -0
- package/dist/forms/use-field.d.ts +34 -0
- package/dist/forms/use-field.d.ts.map +1 -0
- package/dist/forms/validators.d.ts +204 -0
- package/dist/forms/validators.d.ts.map +1 -0
- package/dist/forms-UcRHsYxC.js +227 -0
- package/dist/forms-UcRHsYxC.js.map +1 -0
- package/dist/forms.es.mjs +16 -0
- package/dist/full.d.ts +30 -11
- package/dist/full.d.ts.map +1 -1
- package/dist/full.es.mjs +209 -93
- package/dist/full.iife.js +47 -31
- package/dist/full.iife.js.map +1 -1
- package/dist/full.umd.js +47 -31
- package/dist/full.umd.js.map +1 -1
- package/dist/function-Cybd57JV.js +33 -0
- package/dist/function-Cybd57JV.js.map +1 -0
- package/dist/i18n/formatting.d.ts +40 -0
- package/dist/i18n/formatting.d.ts.map +1 -0
- package/dist/i18n/i18n.d.ts +48 -0
- package/dist/i18n/i18n.d.ts.map +1 -0
- package/dist/i18n/index.d.ts +57 -0
- package/dist/i18n/index.d.ts.map +1 -0
- package/dist/i18n/translate.d.ts +83 -0
- package/dist/i18n/translate.d.ts.map +1 -0
- package/dist/i18n/types.d.ts +156 -0
- package/dist/i18n/types.d.ts.map +1 -0
- package/dist/i18n-kuF6Ekj6.js +89 -0
- package/dist/i18n-kuF6Ekj6.js.map +1 -0
- package/dist/i18n.es.mjs +6 -0
- package/dist/index.d.ts +11 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.es.mjs +257 -143
- package/dist/media/battery.d.ts +35 -0
- package/dist/media/battery.d.ts.map +1 -0
- package/dist/media/breakpoints.d.ts +51 -0
- package/dist/media/breakpoints.d.ts.map +1 -0
- package/dist/media/clipboard.d.ts +30 -0
- package/dist/media/clipboard.d.ts.map +1 -0
- package/dist/media/device-sensors.d.ts +54 -0
- package/dist/media/device-sensors.d.ts.map +1 -0
- package/dist/media/geolocation.d.ts +38 -0
- package/dist/media/geolocation.d.ts.map +1 -0
- package/dist/media/index.d.ts +42 -0
- package/dist/media/index.d.ts.map +1 -0
- package/dist/media/media-query.d.ts +36 -0
- package/dist/media/media-query.d.ts.map +1 -0
- package/dist/media/network.d.ts +35 -0
- package/dist/media/network.d.ts.map +1 -0
- package/dist/media/types.d.ts +173 -0
- package/dist/media/types.d.ts.map +1 -0
- package/dist/media/viewport.d.ts +32 -0
- package/dist/media/viewport.d.ts.map +1 -0
- package/dist/media-i-fB5WxI.js +340 -0
- package/dist/media-i-fB5WxI.js.map +1 -0
- package/dist/media.es.mjs +12 -0
- package/dist/motion/index.d.ts +7 -3
- package/dist/motion/index.d.ts.map +1 -1
- package/dist/motion/morph.d.ts +27 -0
- package/dist/motion/morph.d.ts.map +1 -0
- package/dist/motion/parallax.d.ts +30 -0
- package/dist/motion/parallax.d.ts.map +1 -0
- package/dist/motion/reduced-motion.d.ts +36 -3
- package/dist/motion/reduced-motion.d.ts.map +1 -1
- package/dist/motion/types.d.ts +58 -0
- package/dist/motion/types.d.ts.map +1 -1
- package/dist/motion/typewriter.d.ts +31 -0
- package/dist/motion/typewriter.d.ts.map +1 -0
- package/dist/motion-BJsAuULb.js +530 -0
- package/dist/motion-BJsAuULb.js.map +1 -0
- package/dist/motion.es.mjs +27 -23
- package/dist/{view-C70lA3vf.js → mount-B4Y8bk8Z.js} +166 -160
- package/dist/mount-B4Y8bk8Z.js.map +1 -0
- package/dist/{object-qGpWr6-J.js → object-BCk-1c8T.js} +5 -4
- package/dist/{object-qGpWr6-J.js.map → object-BCk-1c8T.js.map} +1 -1
- package/dist/{platform-Dr9b6fsq.js → platform-Dw2gE3zI.js} +21 -22
- package/dist/{platform-Dr9b6fsq.js.map → platform-Dw2gE3zI.js.map} +1 -1
- package/dist/platform.es.mjs +2 -2
- package/dist/plugin/index.d.ts +22 -0
- package/dist/plugin/index.d.ts.map +1 -0
- package/dist/plugin/registry.d.ts +108 -0
- package/dist/plugin/registry.d.ts.map +1 -0
- package/dist/plugin/types.d.ts +110 -0
- package/dist/plugin/types.d.ts.map +1 -0
- package/dist/plugin-C2WuC8SF.js +66 -0
- package/dist/plugin-C2WuC8SF.js.map +1 -0
- package/dist/plugin.es.mjs +9 -0
- package/dist/reactive/async-data.d.ts +28 -3
- package/dist/reactive/async-data.d.ts.map +1 -1
- package/dist/reactive/computed.d.ts +10 -0
- package/dist/reactive/computed.d.ts.map +1 -1
- package/dist/reactive/effect.d.ts +3 -0
- package/dist/reactive/effect.d.ts.map +1 -1
- package/dist/reactive/http.d.ts +194 -0
- package/dist/reactive/http.d.ts.map +1 -0
- package/dist/reactive/index.d.ts +2 -2
- package/dist/reactive/index.d.ts.map +1 -1
- package/dist/reactive/pagination.d.ts +126 -0
- package/dist/reactive/pagination.d.ts.map +1 -0
- package/dist/reactive/polling.d.ts +55 -0
- package/dist/reactive/polling.d.ts.map +1 -0
- package/dist/reactive/readonly.d.ts +20 -1
- package/dist/reactive/readonly.d.ts.map +1 -1
- package/dist/reactive/rest.d.ts +293 -0
- package/dist/reactive/rest.d.ts.map +1 -0
- package/dist/reactive/scope.d.ts +140 -0
- package/dist/reactive/scope.d.ts.map +1 -0
- package/dist/reactive/signal.d.ts +16 -2
- package/dist/reactive/signal.d.ts.map +1 -1
- package/dist/reactive/to-value.d.ts +57 -0
- package/dist/reactive/to-value.d.ts.map +1 -0
- package/dist/reactive/websocket.d.ts +285 -0
- package/dist/reactive/websocket.d.ts.map +1 -0
- package/dist/reactive-DwkhUJfP.js +1148 -0
- package/dist/reactive-DwkhUJfP.js.map +1 -0
- package/dist/reactive.es.mjs +38 -20
- package/dist/registry-B08iilIh.js +26 -0
- package/dist/registry-B08iilIh.js.map +1 -0
- package/dist/router/bq-link.d.ts +112 -0
- package/dist/router/bq-link.d.ts.map +1 -0
- package/dist/router/constraints.d.ts +9 -0
- package/dist/router/constraints.d.ts.map +1 -0
- package/dist/router/index.d.ts +15 -7
- package/dist/router/index.d.ts.map +1 -1
- package/dist/router/match.d.ts +0 -1
- package/dist/router/match.d.ts.map +1 -1
- package/dist/router/path-pattern.d.ts +14 -0
- package/dist/router/path-pattern.d.ts.map +1 -0
- package/dist/router/query.d.ts.map +1 -1
- package/dist/router/router.d.ts +3 -1
- package/dist/router/router.d.ts.map +1 -1
- package/dist/router/state.d.ts +25 -2
- package/dist/router/state.d.ts.map +1 -1
- package/dist/router/types.d.ts +48 -4
- package/dist/router/types.d.ts.map +1 -1
- package/dist/router/use-route.d.ts +50 -0
- package/dist/router/use-route.d.ts.map +1 -0
- package/dist/router/utils.d.ts +3 -0
- package/dist/router/utils.d.ts.map +1 -1
- package/dist/router-CQikC9Ed.js +492 -0
- package/dist/router-CQikC9Ed.js.map +1 -0
- package/dist/router.es.mjs +14 -10
- package/dist/{sanitize-Bs2dkMby.js → sanitize-B1V4JswB.js} +2 -1
- package/dist/{sanitize-Bs2dkMby.js.map → sanitize-B1V4JswB.js.map} +1 -1
- package/dist/security/index.d.ts +2 -2
- package/dist/security/index.d.ts.map +1 -1
- package/dist/security.es.mjs +1 -1
- package/dist/ssr/hydrate.d.ts +65 -0
- package/dist/ssr/hydrate.d.ts.map +1 -0
- package/dist/ssr/index.d.ts +59 -0
- package/dist/ssr/index.d.ts.map +1 -0
- package/dist/ssr/render.d.ts +62 -0
- package/dist/ssr/render.d.ts.map +1 -0
- package/dist/ssr/serialize.d.ts +118 -0
- package/dist/ssr/serialize.d.ts.map +1 -0
- package/dist/ssr/types.d.ts +70 -0
- package/dist/ssr/types.d.ts.map +1 -0
- package/dist/ssr-_dAcGdzu.js +248 -0
- package/dist/ssr-_dAcGdzu.js.map +1 -0
- package/dist/ssr.es.mjs +9 -0
- package/dist/store/create-store.d.ts.map +1 -1
- package/dist/store/index.d.ts +1 -1
- package/dist/store/index.d.ts.map +1 -1
- package/dist/store/persisted.d.ts +38 -4
- package/dist/store/persisted.d.ts.map +1 -1
- package/dist/store/types.d.ts +138 -1
- package/dist/store/types.d.ts.map +1 -1
- package/dist/store/utils.d.ts +2 -2
- package/dist/store/utils.d.ts.map +1 -1
- package/dist/store-Cb3gPRve.js +338 -0
- package/dist/store-Cb3gPRve.js.map +1 -0
- package/dist/store.es.mjs +11 -10
- package/dist/storybook/index.d.ts.map +1 -1
- package/dist/storybook.es.mjs +1 -1
- package/dist/storybook.es.mjs.map +1 -1
- package/dist/testing/index.d.ts +23 -0
- package/dist/testing/index.d.ts.map +1 -0
- package/dist/testing/testing.d.ts +156 -0
- package/dist/testing/testing.d.ts.map +1 -0
- package/dist/testing/types.d.ts +134 -0
- package/dist/testing/types.d.ts.map +1 -0
- package/dist/testing-C5Sjfsna.js +224 -0
- package/dist/testing-C5Sjfsna.js.map +1 -0
- package/dist/testing.es.mjs +9 -0
- package/dist/type-guards-BMX2c0LP.js +44 -0
- package/dist/type-guards-BMX2c0LP.js.map +1 -0
- package/dist/untrack-D0fnO5k2.js +36 -0
- package/dist/untrack-D0fnO5k2.js.map +1 -0
- package/dist/view/custom-directives.d.ts +20 -0
- package/dist/view/custom-directives.d.ts.map +1 -0
- package/dist/view/evaluate.d.ts.map +1 -1
- package/dist/view/process.d.ts.map +1 -1
- package/dist/view.es.mjs +9 -9
- package/package.json +47 -11
- package/src/a11y/announce.ts +131 -0
- package/src/a11y/audit.ts +314 -0
- package/src/a11y/index.ts +68 -0
- package/src/a11y/media-preferences.ts +255 -0
- package/src/a11y/roving-tab-index.ts +164 -0
- package/src/a11y/skip-link.ts +255 -0
- package/src/a11y/trap-focus.ts +184 -0
- package/src/a11y/types.ts +183 -0
- package/src/component/component.ts +599 -524
- package/src/component/html.ts +153 -153
- package/src/component/index.ts +52 -50
- package/src/component/library.ts +540 -518
- package/src/component/scope.ts +212 -0
- package/src/component/types.ts +310 -256
- package/src/core/collection.ts +249 -1
- package/src/core/element.ts +252 -11
- package/src/core/env.ts +60 -0
- package/src/core/index.ts +1 -0
- package/src/core/shared.ts +64 -0
- package/src/core/utils/index.ts +66 -1
- package/src/devtools/devtools.ts +410 -0
- package/src/devtools/index.ts +48 -0
- package/src/devtools/types.ts +104 -0
- package/src/dnd/draggable.ts +296 -0
- package/src/dnd/droppable.ts +228 -0
- package/src/dnd/index.ts +62 -0
- package/src/dnd/sortable.ts +307 -0
- package/src/dnd/types.ts +293 -0
- package/src/forms/create-form.ts +320 -0
- package/src/forms/index.ts +70 -0
- package/src/forms/types.ts +203 -0
- package/src/forms/use-field.ts +231 -0
- package/src/forms/validators.ts +294 -0
- package/src/full.ts +554 -229
- package/src/i18n/formatting.ts +67 -0
- package/src/i18n/i18n.ts +200 -0
- package/src/i18n/index.ts +67 -0
- package/src/i18n/translate.ts +182 -0
- package/src/i18n/types.ts +171 -0
- package/src/index.ts +72 -0
- package/src/media/battery.ts +116 -0
- package/src/media/breakpoints.ts +129 -0
- package/src/media/clipboard.ts +80 -0
- package/src/media/device-sensors.ts +158 -0
- package/src/media/geolocation.ts +119 -0
- package/src/media/index.ts +76 -0
- package/src/media/media-query.ts +92 -0
- package/src/media/network.ts +115 -0
- package/src/media/types.ts +177 -0
- package/src/media/viewport.ts +84 -0
- package/src/motion/index.ts +11 -2
- package/src/motion/morph.ts +151 -0
- package/src/motion/parallax.ts +120 -0
- package/src/motion/reduced-motion.ts +52 -3
- package/src/motion/types.ts +63 -0
- package/src/motion/typewriter.ts +164 -0
- package/src/plugin/index.ts +37 -0
- package/src/plugin/registry.ts +284 -0
- package/src/plugin/types.ts +137 -0
- package/src/reactive/async-data.ts +250 -29
- package/src/reactive/computed.ts +53 -1
- package/src/reactive/effect.ts +29 -6
- package/src/reactive/http.ts +790 -0
- package/src/reactive/index.ts +60 -0
- package/src/reactive/pagination.ts +317 -0
- package/src/reactive/polling.ts +179 -0
- package/src/reactive/readonly.ts +52 -8
- package/src/reactive/rest.ts +859 -0
- package/src/reactive/scope.ts +276 -0
- package/src/reactive/signal.ts +61 -1
- package/src/reactive/to-value.ts +71 -0
- package/src/reactive/websocket.ts +849 -0
- package/src/router/bq-link.ts +279 -0
- package/src/router/constraints.ts +204 -0
- package/src/router/index.ts +15 -7
- package/src/router/match.ts +255 -49
- package/src/router/path-pattern.ts +52 -0
- package/src/router/query.ts +3 -0
- package/src/router/router.ts +258 -48
- package/src/router/state.ts +51 -3
- package/src/router/types.ts +50 -4
- package/src/router/use-route.ts +68 -0
- package/src/router/utils.ts +44 -3
- package/src/security/index.ts +12 -17
- package/src/security/sanitize.ts +70 -70
- package/src/security/trusted-html.ts +71 -71
- package/src/ssr/hydrate.ts +84 -0
- package/src/ssr/index.ts +70 -0
- package/src/ssr/render.ts +508 -0
- package/src/ssr/serialize.ts +296 -0
- package/src/ssr/types.ts +81 -0
- package/src/store/create-store.ts +146 -8
- package/src/store/define-store.ts +49 -49
- package/src/store/index.ts +5 -0
- package/src/store/mapping.ts +74 -74
- package/src/store/persisted.ts +245 -62
- package/src/store/types.ts +247 -92
- package/src/store/utils.ts +4 -10
- package/src/store/watch.ts +53 -53
- package/src/storybook/index.ts +480 -479
- package/src/testing/index.ts +42 -0
- package/src/testing/testing.ts +593 -0
- package/src/testing/types.ts +170 -0
- package/src/view/custom-directives.ts +28 -0
- package/src/view/evaluate.ts +2 -0
- package/src/view/process.ts +19 -3
- package/dist/component-BEQgt5hl.js +0 -600
- package/dist/component-BEQgt5hl.js.map +0 -1
- package/dist/core-BGQJVw0-.js +0 -35
- package/dist/core-BGQJVw0-.js.map +0 -1
- package/dist/core-CCEabVHl.js.map +0 -1
- package/dist/effect-AFRW_Plg.js +0 -84
- package/dist/effect-AFRW_Plg.js.map +0 -1
- package/dist/motion-D9TcHxOF.js +0 -415
- package/dist/motion-D9TcHxOF.js.map +0 -1
- package/dist/reactive-DSkct0dO.js +0 -254
- package/dist/reactive-DSkct0dO.js.map +0 -1
- package/dist/router-CbDhl8rS.js +0 -188
- package/dist/router-CbDhl8rS.js.map +0 -1
- package/dist/store-BwDvI45q.js +0 -263
- package/dist/store-BwDvI45q.js.map +0 -1
- package/dist/untrack-B0rVscTc.js +0 -7
- package/dist/untrack-B0rVscTc.js.map +0 -1
- package/dist/view-C70lA3vf.js.map +0 -1
package/README.md
CHANGED
|
@@ -20,12 +20,14 @@
|
|
|
20
20
|
|
|
21
21
|
**The jQuery for the modern Web Platform.**
|
|
22
22
|
|
|
23
|
-
bQuery.js is a slim, TypeScript-first library that combines jQuery's direct DOM workflow with modern features like reactivity, async data composables, Web Components, motion utilities, routing, stores,
|
|
23
|
+
bQuery.js is a slim, TypeScript-first library that combines jQuery's direct DOM workflow with modern features like reactivity, async data composables, HTTP clients, polling and pagination helpers, realtime transports, REST workflows, Web Components, motion utilities, routing, stores, declarative views, accessibility helpers, forms, i18n, media signals, drag-and-drop, plugins, devtools, testing utilities, and SSR — without a mandatory build step.
|
|
24
|
+
|
|
25
|
+
> **New in 1.8.0:** the Reactive module now also covers transport-ready workflows such as `createHttp()`, `usePolling()`, `usePaginatedFetch()`, `useInfiniteFetch()`, `useWebSocket()`, `useEventSource()`, `useResource()`, `useSubmit()`, `createRequestQueue()`, and `deduplicateRequest()`.
|
|
24
26
|
|
|
25
27
|
## Highlights
|
|
26
28
|
|
|
27
29
|
- **Zero-build capable**: runs directly in the browser; build tools are optional.
|
|
28
|
-
- **
|
|
30
|
+
- **Transport-ready reactive data**: fetch composables, HTTP clients, polling, pagination, WebSocket / SSE, REST helpers, and request coordination plug directly into signals.
|
|
29
31
|
- **Security-focused**: DOM writes are sanitized by default; Trusted Types supported.
|
|
30
32
|
- **Modular**: the core stays small; extra modules are opt-in.
|
|
31
33
|
- **TypeScript-first**: clear types and strong IDE support.
|
|
@@ -108,6 +110,20 @@ import {
|
|
|
108
110
|
useAsyncData,
|
|
109
111
|
useFetch,
|
|
110
112
|
createUseFetch,
|
|
113
|
+
createHttp,
|
|
114
|
+
http,
|
|
115
|
+
usePolling,
|
|
116
|
+
usePaginatedFetch,
|
|
117
|
+
useInfiniteFetch,
|
|
118
|
+
useWebSocket,
|
|
119
|
+
useWebSocketChannel,
|
|
120
|
+
useEventSource,
|
|
121
|
+
useResource,
|
|
122
|
+
useResourceList,
|
|
123
|
+
useSubmit,
|
|
124
|
+
createRestClient,
|
|
125
|
+
createRequestQueue,
|
|
126
|
+
deduplicateRequest,
|
|
111
127
|
} from '@bquery/bquery/reactive';
|
|
112
128
|
|
|
113
129
|
// Components only
|
|
@@ -133,23 +149,46 @@ import { createRouter, navigate } from '@bquery/bquery/router';
|
|
|
133
149
|
import { createStore, defineStore } from '@bquery/bquery/store';
|
|
134
150
|
import { mount, createTemplate } from '@bquery/bquery/view';
|
|
135
151
|
|
|
152
|
+
// Forms, i18n, accessibility, drag & drop, media
|
|
153
|
+
import { createForm, required, email } from '@bquery/bquery/forms';
|
|
154
|
+
import { createI18n } from '@bquery/bquery/i18n';
|
|
155
|
+
import { trapFocus, rovingTabIndex } from '@bquery/bquery/a11y';
|
|
156
|
+
import { draggable, droppable, sortable } from '@bquery/bquery/dnd';
|
|
157
|
+
import { mediaQuery, useViewport, clipboard } from '@bquery/bquery/media';
|
|
158
|
+
|
|
159
|
+
// Plugins, devtools, testing, SSR
|
|
160
|
+
import { use } from '@bquery/bquery/plugin';
|
|
161
|
+
import { enableDevtools, inspectSignals } from '@bquery/bquery/devtools';
|
|
162
|
+
import { renderComponent, fireEvent, waitFor } from '@bquery/bquery/testing';
|
|
163
|
+
import { renderToString, hydrateMount, serializeStoreState } from '@bquery/bquery/ssr';
|
|
164
|
+
|
|
136
165
|
// Storybook helpers
|
|
137
166
|
import { storyHtml, when } from '@bquery/bquery/storybook';
|
|
138
167
|
```
|
|
139
168
|
|
|
140
169
|
## Modules at a glance
|
|
141
170
|
|
|
142
|
-
| Module | Description
|
|
143
|
-
| ------------- |
|
|
144
|
-
| **Core** | Selectors, DOM manipulation, events,
|
|
145
|
-
| **Reactive** | `signal`, `computed`, `effect`, async data/
|
|
146
|
-
| **Component** |
|
|
147
|
-
| **
|
|
148
|
-
| **
|
|
149
|
-
| **
|
|
150
|
-
| **
|
|
151
|
-
| **
|
|
152
|
-
| **
|
|
171
|
+
| Module | Description |
|
|
172
|
+
| ------------- | ---------------------------------------------------------------------------------------------------------------- |
|
|
173
|
+
| **Core** | Selectors, DOM manipulation, events, traversal, and typed utilities |
|
|
174
|
+
| **Reactive** | `signal`, `computed`, `effect`, async data, HTTP clients, polling, pagination, WebSocket / SSE, and REST helpers |
|
|
175
|
+
| **Component** | Typed Web Components with scoped reactivity and configurable Shadow DOM |
|
|
176
|
+
| **Storybook** | Safe story template helpers with boolean-attribute shorthand |
|
|
177
|
+
| **Motion** | View transitions, FLIP, morphing, parallax, typewriter, springs, and timelines |
|
|
178
|
+
| **Security** | HTML sanitization, Trusted Types, CSP helpers, and trusted fragment composition |
|
|
179
|
+
| **Platform** | Storage, cache, cookies, page metadata, announcers, and shared runtime config |
|
|
180
|
+
| **Router** | SPA routing, constrained params, redirects, guards, `useRoute()`, and `<bq-link>` |
|
|
181
|
+
| **Store** | Signal-based state management, persistence, migrations, and action hooks |
|
|
182
|
+
| **View** | Declarative DOM bindings, directives, and plugin-provided custom directives |
|
|
183
|
+
| **Forms** | Reactive form state with sync/async validation and submit handling |
|
|
184
|
+
| **i18n** | Reactive locales, interpolation, pluralization, lazy loading, and Intl formatting |
|
|
185
|
+
| **A11y** | Focus traps, live-region announcements, roving tabindex, skip links, and audits |
|
|
186
|
+
| **DnD** | Draggable elements, droppable zones, and sortable lists |
|
|
187
|
+
| **Media** | Reactive browser/device signals for viewport, network, battery, geolocation, and more |
|
|
188
|
+
| **Plugin** | Global plugin registration for custom directives and Web Components |
|
|
189
|
+
| **Devtools** | Runtime inspection helpers for signals, stores, components, and timelines |
|
|
190
|
+
| **Testing** | Component mounting, mock signals/router helpers, and async test utilities |
|
|
191
|
+
| **SSR** | Server-side rendering, hydration, and store-state serialization |
|
|
153
192
|
|
|
154
193
|
Storybook authoring helpers are also available as a dedicated entry point via `@bquery/bquery/storybook`.
|
|
155
194
|
|
|
@@ -249,6 +288,34 @@ const settings = useApiFetch<{ theme: string }>('/settings');
|
|
|
249
288
|
console.log(user.pending.value, user.data.value, settings.error.value);
|
|
250
289
|
```
|
|
251
290
|
|
|
291
|
+
### Reactive – HTTP, streaming & request coordination
|
|
292
|
+
|
|
293
|
+
```ts
|
|
294
|
+
import {
|
|
295
|
+
createHttp,
|
|
296
|
+
createRequestQueue,
|
|
297
|
+
deduplicateRequest,
|
|
298
|
+
useEventSource,
|
|
299
|
+
useWebSocket,
|
|
300
|
+
} from '@bquery/bquery/reactive';
|
|
301
|
+
|
|
302
|
+
const api = createHttp({
|
|
303
|
+
baseUrl: 'https://api.example.com',
|
|
304
|
+
retry: {
|
|
305
|
+
count: 2,
|
|
306
|
+
onRetry: (error, attempt) => console.warn(`Retry #${attempt}`, error.message),
|
|
307
|
+
},
|
|
308
|
+
});
|
|
309
|
+
|
|
310
|
+
const queue = createRequestQueue({ concurrency: 4 });
|
|
311
|
+
const ws = useWebSocket<{ type: string; payload: unknown }>('wss://api.example.com/live');
|
|
312
|
+
const sse = useEventSource<{ token: string }>('/api/stream');
|
|
313
|
+
|
|
314
|
+
const users = await deduplicateRequest('/users', () => queue.add(() => api.get('/users')));
|
|
315
|
+
|
|
316
|
+
console.log(users.data, ws.status.value, sse.eventName.value);
|
|
317
|
+
```
|
|
318
|
+
|
|
252
319
|
### Components – Web Components
|
|
253
320
|
|
|
254
321
|
```ts
|
|
@@ -429,6 +496,93 @@ effect(() => {
|
|
|
429
496
|
});
|
|
430
497
|
```
|
|
431
498
|
|
|
499
|
+
### Forms – reactive validation
|
|
500
|
+
|
|
501
|
+
```ts
|
|
502
|
+
import { createForm, email, required } from '@bquery/bquery/forms';
|
|
503
|
+
|
|
504
|
+
const form = createForm({
|
|
505
|
+
fields: {
|
|
506
|
+
name: { initialValue: '', validators: [required()] },
|
|
507
|
+
email: { initialValue: '', validators: [required(), email()] },
|
|
508
|
+
},
|
|
509
|
+
onSubmit: async (values) => {
|
|
510
|
+
await fetch('/api/signup', {
|
|
511
|
+
method: 'POST',
|
|
512
|
+
body: JSON.stringify(values),
|
|
513
|
+
});
|
|
514
|
+
},
|
|
515
|
+
});
|
|
516
|
+
|
|
517
|
+
await form.handleSubmit();
|
|
518
|
+
console.log(form.isValid.value, form.fields.email.error.value);
|
|
519
|
+
```
|
|
520
|
+
|
|
521
|
+
### i18n – locale-aware content
|
|
522
|
+
|
|
523
|
+
```ts
|
|
524
|
+
import { createI18n } from '@bquery/bquery/i18n';
|
|
525
|
+
|
|
526
|
+
const i18n = createI18n({
|
|
527
|
+
locale: 'en',
|
|
528
|
+
fallbackLocale: 'en',
|
|
529
|
+
messages: {
|
|
530
|
+
en: { greeting: 'Hello, {name}!' },
|
|
531
|
+
de: { greeting: 'Hallo, {name}!' },
|
|
532
|
+
},
|
|
533
|
+
});
|
|
534
|
+
|
|
535
|
+
console.log(i18n.t('greeting', { name: 'Ada' }));
|
|
536
|
+
i18n.$locale.value = 'de';
|
|
537
|
+
```
|
|
538
|
+
|
|
539
|
+
### Accessibility, media, and drag & drop
|
|
540
|
+
|
|
541
|
+
```ts
|
|
542
|
+
import { trapFocus, announceToScreenReader } from '@bquery/bquery/a11y';
|
|
543
|
+
import { mediaQuery, useViewport } from '@bquery/bquery/media';
|
|
544
|
+
import { draggable } from '@bquery/bquery/dnd';
|
|
545
|
+
|
|
546
|
+
const modalTrap = trapFocus(document.querySelector('#dialog')!);
|
|
547
|
+
announceToScreenReader('Dialog opened');
|
|
548
|
+
|
|
549
|
+
const isDark = mediaQuery('(prefers-color-scheme: dark)');
|
|
550
|
+
const viewport = useViewport();
|
|
551
|
+
const drag = draggable(document.querySelector('#card')!, { bounds: 'parent' });
|
|
552
|
+
|
|
553
|
+
console.log(isDark.value, viewport.value.width);
|
|
554
|
+
|
|
555
|
+
drag.destroy();
|
|
556
|
+
modalTrap.release();
|
|
557
|
+
```
|
|
558
|
+
|
|
559
|
+
### Plugins, devtools, testing, and SSR
|
|
560
|
+
|
|
561
|
+
```ts
|
|
562
|
+
import { use } from '@bquery/bquery/plugin';
|
|
563
|
+
import { enableDevtools, getTimeline } from '@bquery/bquery/devtools';
|
|
564
|
+
import { renderComponent, fireEvent } from '@bquery/bquery/testing';
|
|
565
|
+
import { renderToString } from '@bquery/bquery/ssr';
|
|
566
|
+
|
|
567
|
+
use({
|
|
568
|
+
name: 'focus-plugin',
|
|
569
|
+
install(ctx) {
|
|
570
|
+
ctx.directive('focus', (el) => (el as HTMLElement).focus());
|
|
571
|
+
},
|
|
572
|
+
});
|
|
573
|
+
|
|
574
|
+
enableDevtools(true, { logToConsole: true });
|
|
575
|
+
console.log(getTimeline());
|
|
576
|
+
|
|
577
|
+
const mounted = renderComponent('ui-button', { props: { variant: 'primary' } });
|
|
578
|
+
fireEvent(mounted.el, 'click');
|
|
579
|
+
|
|
580
|
+
const { html } = renderToString('<p bq-text="label"></p>', { label: 'Hello SSR' });
|
|
581
|
+
console.log(html);
|
|
582
|
+
|
|
583
|
+
mounted.unmount();
|
|
584
|
+
```
|
|
585
|
+
|
|
432
586
|
### Store – state management
|
|
433
587
|
|
|
434
588
|
```ts
|
|
@@ -502,10 +656,10 @@ mount('#app', {
|
|
|
502
656
|
|
|
503
657
|
| Browser | Version | Support |
|
|
504
658
|
| ------- | ------- | ------- |
|
|
505
|
-
| Chrome | 90+ | ✅ Full
|
|
506
|
-
| Firefox | 90+ | ✅ Full
|
|
507
|
-
| Safari | 15+ | ✅ Full
|
|
508
|
-
| Edge | 90+ | ✅ Full
|
|
659
|
+
| Chrome | 90+ | ✅ Full |
|
|
660
|
+
| Firefox | 90+ | ✅ Full |
|
|
661
|
+
| Safari | 15+ | ✅ Full |
|
|
662
|
+
| Edge | 90+ | ✅ Full |
|
|
509
663
|
|
|
510
664
|
> **No IE support** by design.
|
|
511
665
|
|
|
@@ -515,6 +669,7 @@ mount('#app', {
|
|
|
515
669
|
- **Core API**: [docs/guide/api-core.md](docs/guide/api-core.md)
|
|
516
670
|
- **Agents**: [docs/guide/agents.md](docs/guide/agents.md)
|
|
517
671
|
- **Components**: [docs/guide/components.md](docs/guide/components.md)
|
|
672
|
+
- **Storybook**: [docs/guide/storybook.md](docs/guide/storybook.md)
|
|
518
673
|
- **Reactivity**: [docs/guide/reactive.md](docs/guide/reactive.md)
|
|
519
674
|
- **Motion**: [docs/guide/motion.md](docs/guide/motion.md)
|
|
520
675
|
- **Security**: [docs/guide/security.md](docs/guide/security.md)
|
|
@@ -522,6 +677,15 @@ mount('#app', {
|
|
|
522
677
|
- **Router**: [docs/guide/router.md](docs/guide/router.md)
|
|
523
678
|
- **Store**: [docs/guide/store.md](docs/guide/store.md)
|
|
524
679
|
- **View**: [docs/guide/view.md](docs/guide/view.md)
|
|
680
|
+
- **Forms**: [docs/guide/forms.md](docs/guide/forms.md)
|
|
681
|
+
- **i18n**: [docs/guide/i18n.md](docs/guide/i18n.md)
|
|
682
|
+
- **Accessibility**: [docs/guide/a11y.md](docs/guide/a11y.md)
|
|
683
|
+
- **Drag & Drop**: [docs/guide/dnd.md](docs/guide/dnd.md)
|
|
684
|
+
- **Media**: [docs/guide/media.md](docs/guide/media.md)
|
|
685
|
+
- **Plugin System**: [docs/guide/plugin.md](docs/guide/plugin.md)
|
|
686
|
+
- **Devtools**: [docs/guide/devtools.md](docs/guide/devtools.md)
|
|
687
|
+
- **Testing Utilities**: [docs/guide/testing.md](docs/guide/testing.md)
|
|
688
|
+
- **SSR / Hydration**: [docs/guide/ssr.md](docs/guide/ssr.md)
|
|
525
689
|
|
|
526
690
|
## Local Development
|
|
527
691
|
|
|
@@ -556,12 +720,22 @@ bQuery.js
|
|
|
556
720
|
│ ├── core/ # Selectors, DOM ops, events, utils
|
|
557
721
|
│ ├── reactive/ # Signals, computed, effects, async data
|
|
558
722
|
│ ├── component/ # Web Components helper + default library
|
|
723
|
+
│ ├── storybook/ # Story template helpers
|
|
559
724
|
│ ├── motion/ # View transitions, FLIP, springs
|
|
560
725
|
│ ├── security/ # Sanitizer, CSP, Trusted Types
|
|
561
726
|
│ ├── platform/ # Storage, cache, cookies, meta, config
|
|
562
727
|
│ ├── router/ # SPA routing, navigation guards
|
|
563
728
|
│ ├── store/ # State management, persistence
|
|
564
|
-
│
|
|
729
|
+
│ ├── view/ # Declarative DOM bindings
|
|
730
|
+
│ ├── forms/ # Reactive forms + validators
|
|
731
|
+
│ ├── i18n/ # Internationalization + formatting
|
|
732
|
+
│ ├── a11y/ # Accessibility utilities
|
|
733
|
+
│ ├── dnd/ # Drag & drop helpers
|
|
734
|
+
│ ├── media/ # Browser and device reactive signals
|
|
735
|
+
│ ├── plugin/ # Global plugin system
|
|
736
|
+
│ ├── devtools/ # Runtime inspection helpers
|
|
737
|
+
│ ├── testing/ # Test utilities
|
|
738
|
+
│ └── ssr/ # Server-side rendering + hydration
|
|
565
739
|
├── docs/ # VitePress documentation
|
|
566
740
|
├── .storybook/ # Storybook config
|
|
567
741
|
├── stories/ # Component stories
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Screen reader announcement utility using ARIA live regions.
|
|
3
|
+
*
|
|
4
|
+
* Creates and manages off-screen live regions to announce dynamic
|
|
5
|
+
* content changes to assistive technologies.
|
|
6
|
+
*
|
|
7
|
+
* @module bquery/a11y
|
|
8
|
+
*/
|
|
9
|
+
import type { AnnouncePriority } from './types';
|
|
10
|
+
/**
|
|
11
|
+
* Announces a message to screen readers via an ARIA live region.
|
|
12
|
+
*
|
|
13
|
+
* The message is injected into a visually-hidden live region element.
|
|
14
|
+
* Screen readers will pick up the change and announce it to the user.
|
|
15
|
+
*
|
|
16
|
+
* @param message - The text message to announce
|
|
17
|
+
* @param priority - The urgency level: `'polite'` (default) or `'assertive'`
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* ```ts
|
|
21
|
+
* import { announceToScreenReader } from '@bquery/bquery/a11y';
|
|
22
|
+
*
|
|
23
|
+
* // Polite announcement (waits for idle)
|
|
24
|
+
* announceToScreenReader('3 search results found');
|
|
25
|
+
*
|
|
26
|
+
* // Assertive announcement (interrupts current speech)
|
|
27
|
+
* announceToScreenReader('Error: Please fix the form', 'assertive');
|
|
28
|
+
* ```
|
|
29
|
+
*/
|
|
30
|
+
export declare const announceToScreenReader: (message: string, priority?: AnnouncePriority) => void;
|
|
31
|
+
/**
|
|
32
|
+
* Removes all live region elements created by `announceToScreenReader`.
|
|
33
|
+
* Useful for cleanup in tests or when unmounting an application.
|
|
34
|
+
*
|
|
35
|
+
* @example
|
|
36
|
+
* ```ts
|
|
37
|
+
* import { clearAnnouncements } from '@bquery/bquery/a11y';
|
|
38
|
+
*
|
|
39
|
+
* clearAnnouncements();
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
export declare const clearAnnouncements: () => void;
|
|
43
|
+
//# sourceMappingURL=announce.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"announce.d.ts","sourceRoot":"","sources":["../../src/a11y/announce.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAoDhD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,sBAAsB,GACjC,SAAS,MAAM,EACf,WAAU,gBAA2B,KACpC,IAuBF,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,QAAO,IAUrC,CAAC"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Development-time accessibility audit utility.
|
|
3
|
+
*
|
|
4
|
+
* Scans DOM elements for common accessibility issues such as missing
|
|
5
|
+
* alt text on images, missing labels on form inputs, empty links/buttons,
|
|
6
|
+
* and incorrect ARIA usage.
|
|
7
|
+
*
|
|
8
|
+
* @module bquery/a11y
|
|
9
|
+
*/
|
|
10
|
+
import type { AuditResult } from './types';
|
|
11
|
+
/**
|
|
12
|
+
* Runs a development-time accessibility audit on a container element.
|
|
13
|
+
*
|
|
14
|
+
* Checks for common accessibility issues including:
|
|
15
|
+
* - Missing alt text on images
|
|
16
|
+
* - Missing labels on form inputs
|
|
17
|
+
* - Empty buttons and links
|
|
18
|
+
* - Heading hierarchy issues
|
|
19
|
+
* - Invalid ARIA references
|
|
20
|
+
* - Missing document landmarks
|
|
21
|
+
*
|
|
22
|
+
* This is intended as a development tool — not a replacement for
|
|
23
|
+
* manual testing or professional accessibility audits.
|
|
24
|
+
*
|
|
25
|
+
* @param container - The element to audit (defaults to `document.body`)
|
|
26
|
+
* @returns An audit result with findings, counts, and pass/fail status
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```ts
|
|
30
|
+
* import { auditA11y } from '@bquery/bquery/a11y';
|
|
31
|
+
*
|
|
32
|
+
* const result = auditA11y();
|
|
33
|
+
* if (!result.passed) {
|
|
34
|
+
* console.warn(`Found ${result.errors} accessibility errors:`);
|
|
35
|
+
* for (const f of result.findings) {
|
|
36
|
+
* console.warn(`[${f.severity}] ${f.message}`, f.element);
|
|
37
|
+
* }
|
|
38
|
+
* }
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
41
|
+
export declare const auditA11y: (container?: Element) => AuditResult;
|
|
42
|
+
//# sourceMappingURL=audit.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"audit.d.ts","sourceRoot":"","sources":["../../src/a11y/audit.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAgB,WAAW,EAAiB,MAAM,SAAS,CAAC;AAmPxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,SAAS,GAAI,YAAY,OAAO,KAAG,WA8B/C,CAAC"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Accessibility (a11y) utilities module for bQuery.js.
|
|
3
|
+
*
|
|
4
|
+
* Provides essential accessibility helpers for building inclusive
|
|
5
|
+
* web applications: focus trapping, screen reader announcements,
|
|
6
|
+
* keyboard navigation patterns, skip navigation, media preference
|
|
7
|
+
* signals, and development-time auditing.
|
|
8
|
+
*
|
|
9
|
+
* @module bquery/a11y
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```ts
|
|
13
|
+
* import {
|
|
14
|
+
* trapFocus,
|
|
15
|
+
* announceToScreenReader,
|
|
16
|
+
* rovingTabIndex,
|
|
17
|
+
* skipLink,
|
|
18
|
+
* prefersReducedMotion,
|
|
19
|
+
* prefersColorScheme,
|
|
20
|
+
* auditA11y,
|
|
21
|
+
* } from '@bquery/bquery/a11y';
|
|
22
|
+
*
|
|
23
|
+
* // Trap focus in a modal
|
|
24
|
+
* const trap = trapFocus(dialogElement);
|
|
25
|
+
*
|
|
26
|
+
* // Announce changes to screen readers
|
|
27
|
+
* announceToScreenReader('Form submitted successfully');
|
|
28
|
+
*
|
|
29
|
+
* // Arrow key navigation in a toolbar
|
|
30
|
+
* const roving = rovingTabIndex(toolbar, 'button', {
|
|
31
|
+
* orientation: 'horizontal',
|
|
32
|
+
* });
|
|
33
|
+
*
|
|
34
|
+
* // Auto-generate skip navigation
|
|
35
|
+
* const skip = skipLink('#main-content');
|
|
36
|
+
*
|
|
37
|
+
* // Reactive media preferences
|
|
38
|
+
* const reduced = prefersReducedMotion();
|
|
39
|
+
* const scheme = prefersColorScheme();
|
|
40
|
+
*
|
|
41
|
+
* // Development-time audit
|
|
42
|
+
* const result = auditA11y();
|
|
43
|
+
* if (!result.passed) console.warn(result.findings);
|
|
44
|
+
* ```
|
|
45
|
+
*/
|
|
46
|
+
export { announceToScreenReader, clearAnnouncements } from './announce';
|
|
47
|
+
export { auditA11y } from './audit';
|
|
48
|
+
export { prefersColorScheme, prefersContrast, prefersReducedMotion } from './media-preferences';
|
|
49
|
+
export { rovingTabIndex } from './roving-tab-index';
|
|
50
|
+
export { skipLink } from './skip-link';
|
|
51
|
+
export { getFocusableElements, releaseFocus, trapFocus } from './trap-focus';
|
|
52
|
+
export type { AnnouncePriority, AuditFinding, AuditResult, AuditSeverity, ColorScheme, ContrastPreference, FocusTrapHandle, MediaPreferenceSignal, RovingTabIndexHandle, RovingTabIndexOptions, SkipLinkHandle, SkipLinkOptions, TrapFocusOptions, } from './types';
|
|
53
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/a11y/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAEH,OAAO,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAChG,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE7E,YAAY,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,aAAa,EACb,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,qBAAqB,EACrB,oBAAoB,EACpB,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,gBAAgB,GACjB,MAAM,SAAS,CAAC"}
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Reactive media preference signals for accessibility.
|
|
3
|
+
*
|
|
4
|
+
* Provides reactive signals that track the user's system-level
|
|
5
|
+
* accessibility preferences (reduced motion, color scheme, contrast).
|
|
6
|
+
*
|
|
7
|
+
* @module bquery/a11y
|
|
8
|
+
*/
|
|
9
|
+
import type { ColorScheme, ContrastPreference, MediaPreferenceSignal } from './types';
|
|
10
|
+
/**
|
|
11
|
+
* Returns a reactive signal indicating whether the user prefers reduced motion.
|
|
12
|
+
*
|
|
13
|
+
* Tracks the `(prefers-reduced-motion: reduce)` media query. Returns `true`
|
|
14
|
+
* when the user has requested reduced motion in their system settings.
|
|
15
|
+
*
|
|
16
|
+
* @returns A readonly reactive signal handle. Call `destroy()` to remove listeners.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* ```ts
|
|
20
|
+
* import { prefersReducedMotion } from '@bquery/bquery/a11y';
|
|
21
|
+
* import { effect } from '@bquery/bquery/reactive';
|
|
22
|
+
*
|
|
23
|
+
* const reduced = prefersReducedMotion();
|
|
24
|
+
* effect(() => {
|
|
25
|
+
* if (reduced.value) {
|
|
26
|
+
* console.log('User prefers reduced motion');
|
|
27
|
+
* }
|
|
28
|
+
* });
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
export declare const prefersReducedMotion: () => MediaPreferenceSignal<boolean>;
|
|
32
|
+
/**
|
|
33
|
+
* Returns a reactive signal tracking the user's preferred color scheme.
|
|
34
|
+
*
|
|
35
|
+
* Tracks the `(prefers-color-scheme: dark)` media query. Returns `'dark'`
|
|
36
|
+
* when the user prefers a dark color scheme, `'light'` otherwise.
|
|
37
|
+
*
|
|
38
|
+
* @returns A readonly reactive signal handle with `'light'` or `'dark'`
|
|
39
|
+
*
|
|
40
|
+
* @example
|
|
41
|
+
* ```ts
|
|
42
|
+
* import { prefersColorScheme } from '@bquery/bquery/a11y';
|
|
43
|
+
* import { effect } from '@bquery/bquery/reactive';
|
|
44
|
+
*
|
|
45
|
+
* const scheme = prefersColorScheme();
|
|
46
|
+
* effect(() => {
|
|
47
|
+
* document.body.dataset.theme = scheme.value;
|
|
48
|
+
* });
|
|
49
|
+
* ```
|
|
50
|
+
*/
|
|
51
|
+
export declare const prefersColorScheme: () => MediaPreferenceSignal<ColorScheme>;
|
|
52
|
+
/**
|
|
53
|
+
* Returns a reactive signal tracking the user's contrast preference.
|
|
54
|
+
*
|
|
55
|
+
* Tracks the `(prefers-contrast)` media query. Returns:
|
|
56
|
+
* - `'more'` — user prefers higher contrast
|
|
57
|
+
* - `'less'` — user prefers lower contrast
|
|
58
|
+
* - `'custom'` — user has set a custom contrast level
|
|
59
|
+
* - `'no-preference'` — no explicit preference
|
|
60
|
+
*
|
|
61
|
+
* @returns A readonly reactive signal handle
|
|
62
|
+
*
|
|
63
|
+
* @example
|
|
64
|
+
* ```ts
|
|
65
|
+
* import { prefersContrast } from '@bquery/bquery/a11y';
|
|
66
|
+
* import { effect } from '@bquery/bquery/reactive';
|
|
67
|
+
*
|
|
68
|
+
* const contrast = prefersContrast();
|
|
69
|
+
* effect(() => {
|
|
70
|
+
* if (contrast.value === 'more') {
|
|
71
|
+
* document.body.classList.add('high-contrast');
|
|
72
|
+
* }
|
|
73
|
+
* });
|
|
74
|
+
* ```
|
|
75
|
+
*/
|
|
76
|
+
export declare const prefersContrast: () => MediaPreferenceSignal<ContrastPreference>;
|
|
77
|
+
//# sourceMappingURL=media-preferences.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"media-preferences.d.ts","sourceRoot":"","sources":["../../src/a11y/media-preferences.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAyFtF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,oBAAoB,QAAO,qBAAqB,CAAC,OAAO,CAEpE,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,kBAAkB,QAAO,qBAAqB,CAAC,WAAW,CA4BtE,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,eAAe,QAAO,qBAAqB,CAAC,kBAAkB,CAyD1E,CAAC"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Roving tab index utility for arrow-key navigation within groups.
|
|
3
|
+
*
|
|
4
|
+
* Implements the WAI-ARIA roving tabindex pattern: only one item
|
|
5
|
+
* in the group has tabindex="0" (the active item), while all others
|
|
6
|
+
* have tabindex="-1". Arrow keys move focus between items.
|
|
7
|
+
*
|
|
8
|
+
* @module bquery/a11y
|
|
9
|
+
*/
|
|
10
|
+
import type { RovingTabIndexHandle, RovingTabIndexOptions } from './types';
|
|
11
|
+
/**
|
|
12
|
+
* Sets up roving tab index navigation for a group of elements.
|
|
13
|
+
*
|
|
14
|
+
* Only the active item receives `tabindex="0"`, making it the only
|
|
15
|
+
* tabbable element in the group. Arrow keys move focus between items,
|
|
16
|
+
* and Home/End jump to the first/last item.
|
|
17
|
+
*
|
|
18
|
+
* @param container - The parent element containing the navigable items
|
|
19
|
+
* @param itemSelector - CSS selector for the navigable items within the container
|
|
20
|
+
* @param options - Configuration options
|
|
21
|
+
* @returns A handle with `destroy()`, `focusItem()`, and `activeIndex()`
|
|
22
|
+
*
|
|
23
|
+
* @example
|
|
24
|
+
* ```ts
|
|
25
|
+
* import { rovingTabIndex } from '@bquery/bquery/a11y';
|
|
26
|
+
*
|
|
27
|
+
* const toolbar = document.querySelector('[role="toolbar"]');
|
|
28
|
+
* const handle = rovingTabIndex(toolbar, 'button', {
|
|
29
|
+
* orientation: 'horizontal',
|
|
30
|
+
* wrap: true,
|
|
31
|
+
* });
|
|
32
|
+
*
|
|
33
|
+
* // Later, clean up
|
|
34
|
+
* handle.destroy();
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export declare const rovingTabIndex: (container: HTMLElement, itemSelector: string, options?: RovingTabIndexOptions) => RovingTabIndexHandle;
|
|
38
|
+
//# sourceMappingURL=roving-tab-index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"roving-tab-index.d.ts","sourceRoot":"","sources":["../../src/a11y/roving-tab-index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAE3E;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,cAAc,GACzB,WAAW,WAAW,EACtB,cAAc,MAAM,EACpB,UAAS,qBAA0B,KAClC,oBAyHF,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Auto-generated skip navigation link utility.
|
|
3
|
+
*
|
|
4
|
+
* Creates a visually-hidden (but keyboard-focusable) "Skip to content"
|
|
5
|
+
* link that becomes visible on focus, letting keyboard users bypass
|
|
6
|
+
* repeated navigation.
|
|
7
|
+
*
|
|
8
|
+
* @module bquery/a11y
|
|
9
|
+
*/
|
|
10
|
+
import type { SkipLinkHandle, SkipLinkOptions } from './types';
|
|
11
|
+
/**
|
|
12
|
+
* Creates a skip navigation link that jumps to the specified target.
|
|
13
|
+
*
|
|
14
|
+
* The link is visually hidden by default and becomes visible when
|
|
15
|
+
* it receives keyboard focus. This follows the WCAG 2.4.1 "Bypass Blocks"
|
|
16
|
+
* success criterion.
|
|
17
|
+
*
|
|
18
|
+
* @param targetSelector - CSS selector for the main content area (e.g. `'#main'`, `'main'`)
|
|
19
|
+
* @param options - Configuration options
|
|
20
|
+
* @returns A handle with `destroy()` method and reference to the created element
|
|
21
|
+
*
|
|
22
|
+
* @example
|
|
23
|
+
* ```ts
|
|
24
|
+
* import { skipLink } from '@bquery/bquery/a11y';
|
|
25
|
+
*
|
|
26
|
+
* // Creates a "Skip to main content" link pointing to <main>
|
|
27
|
+
* const handle = skipLink('#main-content');
|
|
28
|
+
*
|
|
29
|
+
* // Custom text
|
|
30
|
+
* const handle2 = skipLink('#content', { text: 'Jump to content' });
|
|
31
|
+
*
|
|
32
|
+
* // Remove when no longer needed
|
|
33
|
+
* handle.destroy();
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
export declare const skipLink: (targetSelector: string, options?: SkipLinkOptions) => SkipLinkHandle;
|
|
37
|
+
//# sourceMappingURL=skip-link.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"skip-link.d.ts","sourceRoot":"","sources":["../../src/a11y/skip-link.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA6C/D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,QAAQ,GAAI,gBAAgB,MAAM,EAAE,UAAS,eAAoB,KAAG,cA8KhF,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Focus trapping utility for modals, dialogs, and popover content.
|
|
3
|
+
*
|
|
4
|
+
* Constrains keyboard focus within a container so that Tab and Shift+Tab
|
|
5
|
+
* cycle only through the container's focusable elements.
|
|
6
|
+
*
|
|
7
|
+
* @module bquery/a11y
|
|
8
|
+
*/
|
|
9
|
+
import type { FocusTrapHandle, TrapFocusOptions } from './types';
|
|
10
|
+
/**
|
|
11
|
+
* Gets all focusable elements within a container.
|
|
12
|
+
*
|
|
13
|
+
* @param container - The container element
|
|
14
|
+
* @returns Array of focusable elements
|
|
15
|
+
* @internal
|
|
16
|
+
*/
|
|
17
|
+
export declare const getFocusableElements: (container: Element) => HTMLElement[];
|
|
18
|
+
/**
|
|
19
|
+
* Traps keyboard focus within a container element.
|
|
20
|
+
*
|
|
21
|
+
* When activated, Tab and Shift+Tab will cycle only through focusable
|
|
22
|
+
* elements within the container. Useful for modals, dialogs, and
|
|
23
|
+
* dropdown menus.
|
|
24
|
+
*
|
|
25
|
+
* @param container - The DOM element to trap focus within
|
|
26
|
+
* @param options - Configuration options
|
|
27
|
+
* @returns A handle with a `release()` method to deactivate the trap
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```ts
|
|
31
|
+
* import { trapFocus } from '@bquery/bquery/a11y';
|
|
32
|
+
*
|
|
33
|
+
* const dialog = document.querySelector('#my-dialog');
|
|
34
|
+
* const trap = trapFocus(dialog, { escapeDeactivates: true });
|
|
35
|
+
*
|
|
36
|
+
* // Later, release the trap
|
|
37
|
+
* trap.release();
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export declare const trapFocus: (container: HTMLElement, options?: TrapFocusOptions) => FocusTrapHandle;
|
|
41
|
+
/**
|
|
42
|
+
* Releases a focus trap handle.
|
|
43
|
+
* This is a convenience function — in most cases, use the `release()`
|
|
44
|
+
* method on the individual trap handle directly.
|
|
45
|
+
*
|
|
46
|
+
* @deprecated Prefer using the handle returned by `trapFocus()` directly.
|
|
47
|
+
*/
|
|
48
|
+
export declare const releaseFocus: (handle: FocusTrapHandle) => void;
|
|
49
|
+
//# sourceMappingURL=trap-focus.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"trap-focus.d.ts","sourceRoot":"","sources":["../../src/a11y/trap-focus.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAgBjE;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,GAAI,WAAW,OAAO,KAAG,WAAW,EAKpE,CAAC;AAiBF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,SAAS,GACpB,WAAW,WAAW,EACtB,UAAS,gBAAqB,KAC7B,eA6FF,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,GAAI,QAAQ,eAAe,KAAG,IAEtD,CAAC"}
|