@featherk/composables 0.7.0 → 0.7.2
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 +1 -36
- package/docs/trap/usePopupTrap.md +1 -2
- package/package.json +7 -19
package/README.md
CHANGED
|
@@ -56,51 +56,16 @@ import {
|
|
|
56
56
|
} from '@featherk/composables';
|
|
57
57
|
```
|
|
58
58
|
|
|
59
|
-
|
|
60
|
-
> useGridA11y currently does not use useFocusTrap composable, but has its own internal method for maintaining focus trap. useGridA11y does not require the @vueuse or focus-trap libraries.
|
|
61
|
-
|
|
62
|
-
**Why this happens:**
|
|
63
|
-
|
|
64
|
-
- If a dependency is imported or required anywhere in the package entry points (even if not used by your code), your bundler or Node will try to resolve it.
|
|
65
|
-
- In index.ts, all composables are exported from a single file, so importing from `@featherk/composables` pulls in all submodules, including those that import `@vueuse/core`, `@vueuse/integrations`, and `focus-trap`.
|
|
66
|
-
|
|
67
|
-
**Workarounds:**
|
|
68
|
-
|
|
69
|
-
1. **Use subpath imports**
|
|
70
|
-
|
|
71
|
-
Import only what you need, e.g.:
|
|
72
|
-
|
|
73
|
-
```ts
|
|
74
|
-
import { useGridA11y } from '@featherk/composables/grid';
|
|
75
|
-
```
|
|
76
|
-
|
|
77
|
-
This avoids loading the popup/focus-trap code.
|
|
78
|
-
|
|
79
|
-
2. **Install the dependencies**
|
|
80
|
-
If you must use the root import, you need to install all peer dependencies:
|
|
81
|
-
|
|
82
|
-
```bash
|
|
83
|
-
npm install @vueuse/core @vueuse/integrations focus-trap
|
|
84
|
-
```
|
|
85
|
-
|
|
86
|
-
**Recommendation:**
|
|
87
|
-
Prefer subpath imports for tree-shaking and to avoid unnecessary dependencies, as described in the README.
|
|
88
|
-
|
|
89
|
-
If you think this should be improved, consider opening an issue or PR to make `focus-trap` and VueUse truly optional by moving their imports inside the `usePopupTrap` function or using dynamic imports.
|
|
59
|
+
`usePopupTrap` depends on VueUse integrations and focus-trap internally. Those runtime packages are shipped as regular dependencies of `@featherk/composables`, so consumers do not need to install them separately.
|
|
90
60
|
|
|
91
61
|
## Peer Dependencies
|
|
92
62
|
|
|
93
63
|
- Required: `vue`
|
|
94
|
-
- Optional (for `usePopupTrap`): `@vueuse/core`, `@vueuse/integrations`, `focus-trap`
|
|
95
64
|
|
|
96
65
|
```bash
|
|
97
66
|
npm install vue
|
|
98
|
-
# If you use usePopupTrap, or any of the date/time based composables
|
|
99
|
-
npm install @vueuse/core @vueuse/integrations focus-trap
|
|
100
67
|
```
|
|
101
68
|
|
|
102
|
-
> Note: VueUse and focus-trap are declared as optional peer dependencies so apps that don’t use `usePopupTrap` aren’t forced to install them. They are present as devDependencies in this repo to enable local type-checking and builds.
|
|
103
|
-
|
|
104
69
|
## Notes
|
|
105
70
|
|
|
106
71
|
- The runtime files for `useGridA11y` and `useGridActiveFilter` live in `src/grid/`. Both are re-exported from the package root and from `@featherk/composables/grid` — no import path changes are needed by consumers.
|
|
@@ -7,8 +7,7 @@ Composable for managing focus trapping and close behavior for popup UIs (e.g., K
|
|
|
7
7
|
## Prerequisites
|
|
8
8
|
|
|
9
9
|
- Vue 3 Composition API
|
|
10
|
-
- `@vueuse/integrations
|
|
11
|
-
- `@vueuse/core` (`onClickOutside`)
|
|
10
|
+
- `@featherk/composables` (ships `@vueuse/integrations`, `@vueuse/core`, and `focus-trap` as runtime dependencies)
|
|
12
11
|
- Optional: Kendo Vue components (`Popup`, `DatePicker`, `TimePicker`) or any popup-like UI
|
|
13
12
|
|
|
14
13
|
## Quick Start
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@featherk/composables",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.2",
|
|
4
4
|
"main": "dist/featherk-composables.umd.js",
|
|
5
5
|
"module": "dist/featherk-composables.es.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -49,30 +49,18 @@
|
|
|
49
49
|
"clean": "rm -rf dist",
|
|
50
50
|
"prepublishOnly": "npm run build"
|
|
51
51
|
},
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"@vueuse/
|
|
55
|
-
"
|
|
56
|
-
"focus-trap": ">=7.0.0"
|
|
52
|
+
"dependencies": {
|
|
53
|
+
"@vueuse/core": "^13.5.0",
|
|
54
|
+
"@vueuse/integrations": "^13.5.0",
|
|
55
|
+
"focus-trap": "^7.6.0"
|
|
57
56
|
},
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"optional": true
|
|
61
|
-
},
|
|
62
|
-
"@vueuse/integrations": {
|
|
63
|
-
"optional": true
|
|
64
|
-
},
|
|
65
|
-
"focus-trap": {
|
|
66
|
-
"optional": true
|
|
67
|
-
}
|
|
57
|
+
"peerDependencies": {
|
|
58
|
+
"vue": ">=3.0.0"
|
|
68
59
|
},
|
|
69
60
|
"devDependencies": {
|
|
70
61
|
"@types/node": "^24.5.2",
|
|
71
62
|
"@vitejs/plugin-vue": "^6.0.1",
|
|
72
63
|
"@vue/test-utils": "^2.4.6",
|
|
73
|
-
"@vueuse/core": "^13.5.0",
|
|
74
|
-
"@vueuse/integrations": "^13.5.0",
|
|
75
|
-
"focus-trap": "^7.6.0",
|
|
76
64
|
"typescript": "~5.8.3",
|
|
77
65
|
"vite": "^7.1.7",
|
|
78
66
|
"vitest": "^3.2.4",
|