@tb-dev/vue 2.0.14 → 2.1.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/dist/composables/index.d.ts +8 -7
- package/dist/composables/useMutex/index.d.ts +5 -0
- package/dist/composables/{window-size → useWindowSize}/index.d.ts +2 -0
- package/dist/index.js +85 -65
- package/package.json +2 -1
- /package/dist/composables/{async-computed → asyncComputed}/index.d.ts +0 -0
- /package/dist/composables/{async-ref → asyncRef}/index.d.ts +0 -0
- /package/dist/composables/{local-ref → localRef}/index.d.ts +0 -0
- /package/dist/composables/{key-down → onKeyDown}/index.d.ts +0 -0
- /package/dist/composables/{session-ref → sessionRef}/index.d.ts +0 -0
- /package/dist/composables/{element-size → useElementSize}/index.d.ts +0 -0
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
export * from './async-computed';
|
|
2
|
-
export * from './async-ref';
|
|
3
1
|
export * from './console';
|
|
4
|
-
export * from './
|
|
5
|
-
export * from './
|
|
6
|
-
export * from './
|
|
7
|
-
export * from './
|
|
8
|
-
export * from './
|
|
2
|
+
export * from './useMutex';
|
|
3
|
+
export * from './asyncRef';
|
|
4
|
+
export * from './localRef';
|
|
5
|
+
export * from './onKeyDown';
|
|
6
|
+
export * from './sessionRef';
|
|
7
|
+
export * from './asyncComputed';
|
|
8
|
+
export * from './useWindowSize';
|
|
9
|
+
export * from './useElementSize';
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,33 @@
|
|
|
1
|
+
import { watch, ref, readonly, inject as inject$1, computed, effectScope, toValue, toRef } from 'vue';
|
|
2
|
+
import { Mutex } from 'es-toolkit';
|
|
1
3
|
import { unwrap, isNil } from '@tb-dev/utils';
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
+
import { useAsyncState, useLocalStorage, tryOnScopeDispose, onKeyStroke, useSessionStorage, computedAsync, useWindowSize, useElementSize as useElementSize$1 } from '@vueuse/core';
|
|
5
|
+
export { useWindowSize } from '@vueuse/core';
|
|
6
|
+
|
|
7
|
+
function log(source) {
|
|
8
|
+
return watch(source, (value) => console.log(value));
|
|
9
|
+
}
|
|
10
|
+
function warn(source) {
|
|
11
|
+
return watch(source, (value) => console.warn(value));
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
function useMutex() {
|
|
15
|
+
const mutex = new Mutex();
|
|
16
|
+
const locked = ref(mutex.isLocked);
|
|
17
|
+
async function acquire() {
|
|
18
|
+
await mutex.acquire();
|
|
19
|
+
locked.value = mutex.isLocked;
|
|
20
|
+
}
|
|
21
|
+
function release() {
|
|
22
|
+
mutex.release();
|
|
23
|
+
locked.value = mutex.isLocked;
|
|
24
|
+
}
|
|
25
|
+
return {
|
|
26
|
+
locked: readonly(locked),
|
|
27
|
+
acquire,
|
|
28
|
+
release
|
|
29
|
+
};
|
|
30
|
+
}
|
|
4
31
|
|
|
5
32
|
function create$1() {
|
|
6
33
|
let APP = null;
|
|
@@ -80,16 +107,6 @@ function create() {
|
|
|
80
107
|
}
|
|
81
108
|
const { get: getErrorHandler, set: setErrorHandler, handle: handleError } = create();
|
|
82
109
|
|
|
83
|
-
function asyncComputed(initial, callback, options) {
|
|
84
|
-
const state = computedAsync(callback, initial, {
|
|
85
|
-
onError: handleError,
|
|
86
|
-
shallow: true,
|
|
87
|
-
lazy: false,
|
|
88
|
-
...options
|
|
89
|
-
});
|
|
90
|
-
return state;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
110
|
function asyncRef(initial, fn, options = {}) {
|
|
94
111
|
const { immediate = true } = options;
|
|
95
112
|
const value = useAsyncState(fn, initial, {
|
|
@@ -111,38 +128,24 @@ function asyncRef(initial, fn, options = {}) {
|
|
|
111
128
|
};
|
|
112
129
|
}
|
|
113
130
|
|
|
114
|
-
function
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
return useElementSize(element).height;
|
|
133
|
-
}
|
|
134
|
-
function useHeightDiff(element) {
|
|
135
|
-
const height = useHeight(element);
|
|
136
|
-
const windowHeight = useWindowHeight();
|
|
137
|
-
return computed(() => windowHeight.value - height.value);
|
|
138
|
-
}
|
|
139
|
-
function useWidth(element) {
|
|
140
|
-
return useElementSize(element).width;
|
|
141
|
-
}
|
|
142
|
-
function useWidthDiff(element) {
|
|
143
|
-
const width = useWidth(element);
|
|
144
|
-
const windowWidth = useWindowWidth();
|
|
145
|
-
return computed(() => windowWidth.value - width.value);
|
|
131
|
+
function localRef(key, initial, options) {
|
|
132
|
+
const defaultValue = { inner: initial };
|
|
133
|
+
const local = useLocalStorage(key, defaultValue, {
|
|
134
|
+
deep: options?.deep ?? true,
|
|
135
|
+
initOnMounted: options?.initOnMounted ?? true,
|
|
136
|
+
onError: options?.onError ?? handleError,
|
|
137
|
+
writeDefaults: options?.writeDefaults ?? true,
|
|
138
|
+
serializer: {
|
|
139
|
+
read: JSON.parse,
|
|
140
|
+
write: JSON.stringify
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
return computed({
|
|
144
|
+
get: () => local.value.inner,
|
|
145
|
+
set: (value) => {
|
|
146
|
+
local.value.inner = value;
|
|
147
|
+
}
|
|
148
|
+
});
|
|
146
149
|
}
|
|
147
150
|
|
|
148
151
|
function onKeyDown(key, handler, options = {}) {
|
|
@@ -204,26 +207,6 @@ function onCtrlShiftKeyDown(key, handler, options) {
|
|
|
204
207
|
return onKeyDown(key, handler, { ...options, ctrlKey: true, shiftKey: true });
|
|
205
208
|
}
|
|
206
209
|
|
|
207
|
-
function localRef(key, initial, options) {
|
|
208
|
-
const defaultValue = { inner: initial };
|
|
209
|
-
const local = useLocalStorage(key, defaultValue, {
|
|
210
|
-
deep: options?.deep ?? true,
|
|
211
|
-
initOnMounted: options?.initOnMounted ?? true,
|
|
212
|
-
onError: options?.onError ?? handleError,
|
|
213
|
-
writeDefaults: options?.writeDefaults ?? true,
|
|
214
|
-
serializer: {
|
|
215
|
-
read: JSON.parse,
|
|
216
|
-
write: JSON.stringify
|
|
217
|
-
}
|
|
218
|
-
});
|
|
219
|
-
return computed({
|
|
220
|
-
get: () => local.value.inner,
|
|
221
|
-
set: (value) => {
|
|
222
|
-
local.value.inner = value;
|
|
223
|
-
}
|
|
224
|
-
});
|
|
225
|
-
}
|
|
226
|
-
|
|
227
210
|
function sessionRef(key, initial, options) {
|
|
228
211
|
const defaultValue = { inner: initial };
|
|
229
212
|
const session = useSessionStorage(key, defaultValue, {
|
|
@@ -244,9 +227,46 @@ function sessionRef(key, initial, options) {
|
|
|
244
227
|
});
|
|
245
228
|
}
|
|
246
229
|
|
|
230
|
+
function asyncComputed(initial, callback, options) {
|
|
231
|
+
const state = computedAsync(callback, initial, {
|
|
232
|
+
onError: handleError,
|
|
233
|
+
shallow: true,
|
|
234
|
+
lazy: false,
|
|
235
|
+
...options
|
|
236
|
+
});
|
|
237
|
+
return state;
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
function useWindowHeight() {
|
|
241
|
+
return useWindowSize().height;
|
|
242
|
+
}
|
|
243
|
+
function useWindowWidth() {
|
|
244
|
+
return useWindowSize().width;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
function useElementSize(element) {
|
|
248
|
+
return useElementSize$1(toRef(element), { height: 0, width: 0 }, { box: "border-box" });
|
|
249
|
+
}
|
|
250
|
+
function useHeight(element) {
|
|
251
|
+
return useElementSize(element).height;
|
|
252
|
+
}
|
|
253
|
+
function useHeightDiff(element) {
|
|
254
|
+
const height = useHeight(element);
|
|
255
|
+
const windowHeight = useWindowHeight();
|
|
256
|
+
return computed(() => windowHeight.value - height.value);
|
|
257
|
+
}
|
|
258
|
+
function useWidth(element) {
|
|
259
|
+
return useElementSize(element).width;
|
|
260
|
+
}
|
|
261
|
+
function useWidthDiff(element) {
|
|
262
|
+
const width = useWidth(element);
|
|
263
|
+
const windowWidth = useWindowWidth();
|
|
264
|
+
return computed(() => windowWidth.value - width.value);
|
|
265
|
+
}
|
|
266
|
+
|
|
247
267
|
function maybe(value, fn) {
|
|
248
268
|
const _value = toValue(value);
|
|
249
269
|
return isNil(_value) ? null : fn(_value);
|
|
250
270
|
}
|
|
251
271
|
|
|
252
|
-
export { asyncComputed, asyncRef, getCurrentApp, getErrorHandler, handleError, inject, localRef, log, maybe, onAltKeyDown, onCtrlKeyDown, onCtrlShiftKeyDown, onKeyDown, onShiftKeyDown, provide, runWithContext, sessionRef, setCurrentApp, setErrorHandler, tryGetCurrentApp, tryInject, tryInjectOrElse, trySetCurrentApp, useElementSize, useHeight, useHeightDiff, useWidth, useWidthDiff, useWindowHeight, useWindowWidth, warn };
|
|
272
|
+
export { asyncComputed, asyncRef, getCurrentApp, getErrorHandler, handleError, inject, localRef, log, maybe, onAltKeyDown, onCtrlKeyDown, onCtrlShiftKeyDown, onKeyDown, onShiftKeyDown, provide, runWithContext, sessionRef, setCurrentApp, setErrorHandler, tryGetCurrentApp, tryInject, tryInjectOrElse, trySetCurrentApp, useElementSize, useHeight, useHeightDiff, useMutex, useWidth, useWidthDiff, useWindowHeight, useWindowWidth, warn };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tb-dev/vue",
|
|
3
|
-
"version": "2.0
|
|
3
|
+
"version": "2.1.0",
|
|
4
4
|
"description": "Vue utilities",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -26,6 +26,7 @@
|
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@tb-dev/utils": "^7.0.8",
|
|
28
28
|
"@vueuse/core": "^13.5.0",
|
|
29
|
+
"es-toolkit": "^1.39.7",
|
|
29
30
|
"vue": "^3.5.18"
|
|
30
31
|
},
|
|
31
32
|
"devDependencies": {
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|