index.esm.mjs 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512
  1. // src/utils.ts
  2. var inBrowser = typeof window !== "undefined";
  3. var supportsPassive = true;
  4. function raf(fn) {
  5. return inBrowser ? requestAnimationFrame(fn) : -1;
  6. }
  7. function cancelRaf(id) {
  8. if (inBrowser) {
  9. cancelAnimationFrame(id);
  10. }
  11. }
  12. function doubleRaf(fn) {
  13. raf(() => raf(fn));
  14. }
  15. // src/useRect/index.ts
  16. import { unref } from "vue";
  17. var isWindow = (val) => val === window;
  18. var makeDOMRect = (width2, height2) => ({
  19. top: 0,
  20. left: 0,
  21. right: width2,
  22. bottom: height2,
  23. width: width2,
  24. height: height2
  25. });
  26. var useRect = (elementOrRef) => {
  27. const element = unref(elementOrRef);
  28. if (isWindow(element)) {
  29. const width2 = element.innerWidth;
  30. const height2 = element.innerHeight;
  31. return makeDOMRect(width2, height2);
  32. }
  33. if (element == null ? void 0 : element.getBoundingClientRect) {
  34. return element.getBoundingClientRect();
  35. }
  36. return makeDOMRect(0, 0);
  37. };
  38. // src/useToggle/index.ts
  39. import { ref } from "vue";
  40. function useToggle(defaultValue = false) {
  41. const state = ref(defaultValue);
  42. const toggle = (value = !state.value) => {
  43. state.value = value;
  44. };
  45. return [state, toggle];
  46. }
  47. // src/useRelation/useParent.ts
  48. import {
  49. ref as ref2,
  50. inject,
  51. computed,
  52. onUnmounted,
  53. getCurrentInstance
  54. } from "vue";
  55. function useParent(key) {
  56. const parent = inject(key, null);
  57. if (parent) {
  58. const instance = getCurrentInstance();
  59. const { link, unlink, internalChildren } = parent;
  60. link(instance);
  61. onUnmounted(() => unlink(instance));
  62. const index = computed(() => internalChildren.indexOf(instance));
  63. return {
  64. parent,
  65. index
  66. };
  67. }
  68. return {
  69. parent: null,
  70. index: ref2(-1)
  71. };
  72. }
  73. // src/useRelation/useChildren.ts
  74. import {
  75. isVNode,
  76. provide,
  77. reactive,
  78. getCurrentInstance as getCurrentInstance2
  79. } from "vue";
  80. function flattenVNodes(children) {
  81. const result = [];
  82. const traverse = (children2) => {
  83. if (Array.isArray(children2)) {
  84. children2.forEach((child) => {
  85. var _a;
  86. if (isVNode(child)) {
  87. result.push(child);
  88. if ((_a = child.component) == null ? void 0 : _a.subTree) {
  89. result.push(child.component.subTree);
  90. traverse(child.component.subTree.children);
  91. }
  92. if (child.children) {
  93. traverse(child.children);
  94. }
  95. }
  96. });
  97. }
  98. };
  99. traverse(children);
  100. return result;
  101. }
  102. var findVNodeIndex = (vnodes, vnode) => {
  103. const index = vnodes.indexOf(vnode);
  104. if (index === -1) {
  105. return vnodes.findIndex(
  106. (item) => vnode.key !== void 0 && vnode.key !== null && item.type === vnode.type && item.key === vnode.key
  107. );
  108. }
  109. return index;
  110. };
  111. function sortChildren(parent, publicChildren, internalChildren) {
  112. const vnodes = flattenVNodes(parent.subTree.children);
  113. internalChildren.sort(
  114. (a, b) => findVNodeIndex(vnodes, a.vnode) - findVNodeIndex(vnodes, b.vnode)
  115. );
  116. const orderedPublicChildren = internalChildren.map((item) => item.proxy);
  117. publicChildren.sort((a, b) => {
  118. const indexA = orderedPublicChildren.indexOf(a);
  119. const indexB = orderedPublicChildren.indexOf(b);
  120. return indexA - indexB;
  121. });
  122. }
  123. function useChildren(key) {
  124. const publicChildren = reactive([]);
  125. const internalChildren = reactive([]);
  126. const parent = getCurrentInstance2();
  127. const linkChildren = (value) => {
  128. const link = (child) => {
  129. if (child.proxy) {
  130. internalChildren.push(child);
  131. publicChildren.push(child.proxy);
  132. sortChildren(parent, publicChildren, internalChildren);
  133. }
  134. };
  135. const unlink = (child) => {
  136. const index = internalChildren.indexOf(child);
  137. publicChildren.splice(index, 1);
  138. internalChildren.splice(index, 1);
  139. };
  140. provide(
  141. key,
  142. Object.assign(
  143. {
  144. link,
  145. unlink,
  146. children: publicChildren,
  147. internalChildren
  148. },
  149. value
  150. )
  151. );
  152. };
  153. return {
  154. children: publicChildren,
  155. linkChildren
  156. };
  157. }
  158. // src/useCountDown/index.ts
  159. import {
  160. ref as ref3,
  161. computed as computed2,
  162. onActivated,
  163. onDeactivated,
  164. onBeforeUnmount
  165. } from "vue";
  166. var SECOND = 1e3;
  167. var MINUTE = 60 * SECOND;
  168. var HOUR = 60 * MINUTE;
  169. var DAY = 24 * HOUR;
  170. function parseTime(time) {
  171. const days = Math.floor(time / DAY);
  172. const hours = Math.floor(time % DAY / HOUR);
  173. const minutes = Math.floor(time % HOUR / MINUTE);
  174. const seconds = Math.floor(time % MINUTE / SECOND);
  175. const milliseconds = Math.floor(time % SECOND);
  176. return {
  177. total: time,
  178. days,
  179. hours,
  180. minutes,
  181. seconds,
  182. milliseconds
  183. };
  184. }
  185. function isSameSecond(time1, time2) {
  186. return Math.floor(time1 / 1e3) === Math.floor(time2 / 1e3);
  187. }
  188. function useCountDown(options) {
  189. let rafId;
  190. let endTime;
  191. let counting;
  192. let deactivated;
  193. const remain = ref3(options.time);
  194. const current = computed2(() => parseTime(remain.value));
  195. const pause = () => {
  196. counting = false;
  197. cancelRaf(rafId);
  198. };
  199. const getCurrentRemain = () => Math.max(endTime - Date.now(), 0);
  200. const setRemain = (value) => {
  201. var _a, _b;
  202. remain.value = value;
  203. (_a = options.onChange) == null ? void 0 : _a.call(options, current.value);
  204. if (value === 0) {
  205. pause();
  206. (_b = options.onFinish) == null ? void 0 : _b.call(options);
  207. }
  208. };
  209. const microTick = () => {
  210. rafId = raf(() => {
  211. if (counting) {
  212. setRemain(getCurrentRemain());
  213. if (remain.value > 0) {
  214. microTick();
  215. }
  216. }
  217. });
  218. };
  219. const macroTick = () => {
  220. rafId = raf(() => {
  221. if (counting) {
  222. const remainRemain = getCurrentRemain();
  223. if (!isSameSecond(remainRemain, remain.value) || remainRemain === 0) {
  224. setRemain(remainRemain);
  225. }
  226. if (remain.value > 0) {
  227. macroTick();
  228. }
  229. }
  230. });
  231. };
  232. const tick = () => {
  233. if (!inBrowser) {
  234. return;
  235. }
  236. if (options.millisecond) {
  237. microTick();
  238. } else {
  239. macroTick();
  240. }
  241. };
  242. const start = () => {
  243. if (!counting) {
  244. endTime = Date.now() + remain.value;
  245. counting = true;
  246. tick();
  247. }
  248. };
  249. const reset = (totalTime = options.time) => {
  250. pause();
  251. remain.value = totalTime;
  252. };
  253. onBeforeUnmount(pause);
  254. onActivated(() => {
  255. if (deactivated) {
  256. counting = true;
  257. deactivated = false;
  258. tick();
  259. }
  260. });
  261. onDeactivated(() => {
  262. if (counting) {
  263. pause();
  264. deactivated = true;
  265. }
  266. });
  267. return {
  268. start,
  269. pause,
  270. reset,
  271. current
  272. };
  273. }
  274. // src/useClickAway/index.ts
  275. import { unref as unref3 } from "vue";
  276. // src/useEventListener/index.ts
  277. import {
  278. watch,
  279. isRef,
  280. unref as unref2,
  281. onUnmounted as onUnmounted2,
  282. onDeactivated as onDeactivated2
  283. } from "vue";
  284. // src/onMountedOrActivated/index.ts
  285. import { nextTick, onMounted, onActivated as onActivated2 } from "vue";
  286. function onMountedOrActivated(hook) {
  287. let mounted;
  288. onMounted(() => {
  289. hook();
  290. nextTick(() => {
  291. mounted = true;
  292. });
  293. });
  294. onActivated2(() => {
  295. if (mounted) {
  296. hook();
  297. }
  298. });
  299. }
  300. // src/useEventListener/index.ts
  301. function useEventListener(type, listener, options = {}) {
  302. if (!inBrowser) {
  303. return;
  304. }
  305. const { target = window, passive = false, capture = false } = options;
  306. let cleaned = false;
  307. let attached;
  308. const add = (target2) => {
  309. if (cleaned) {
  310. return;
  311. }
  312. const element = unref2(target2);
  313. if (element && !attached) {
  314. element.addEventListener(type, listener, {
  315. capture,
  316. passive
  317. });
  318. attached = true;
  319. }
  320. };
  321. const remove = (target2) => {
  322. if (cleaned) {
  323. return;
  324. }
  325. const element = unref2(target2);
  326. if (element && attached) {
  327. element.removeEventListener(type, listener, capture);
  328. attached = false;
  329. }
  330. };
  331. onUnmounted2(() => remove(target));
  332. onDeactivated2(() => remove(target));
  333. onMountedOrActivated(() => add(target));
  334. let stopWatch;
  335. if (isRef(target)) {
  336. stopWatch = watch(target, (val, oldVal) => {
  337. remove(oldVal);
  338. add(val);
  339. });
  340. }
  341. return () => {
  342. stopWatch == null ? void 0 : stopWatch();
  343. remove(target);
  344. cleaned = true;
  345. };
  346. }
  347. // src/useClickAway/index.ts
  348. function useClickAway(target, listener, options = {}) {
  349. if (!inBrowser) {
  350. return;
  351. }
  352. const { eventName = "click" } = options;
  353. const onClick = (event) => {
  354. const targets = Array.isArray(target) ? target : [target];
  355. const isClickAway = targets.every((item) => {
  356. const element = unref3(item);
  357. return element && !element.contains(event.target);
  358. });
  359. if (isClickAway) {
  360. listener(event);
  361. }
  362. };
  363. useEventListener(eventName, onClick, { target: document });
  364. }
  365. // src/useWindowSize/index.ts
  366. import { ref as ref4 } from "vue";
  367. var width;
  368. var height;
  369. function useWindowSize() {
  370. if (!width) {
  371. width = ref4(0);
  372. height = ref4(0);
  373. if (inBrowser) {
  374. const update = () => {
  375. width.value = window.innerWidth;
  376. height.value = window.innerHeight;
  377. };
  378. update();
  379. window.addEventListener("resize", update, { passive: true });
  380. window.addEventListener("orientationchange", update, { passive: true });
  381. }
  382. }
  383. return { width, height };
  384. }
  385. // src/useScrollParent/index.ts
  386. import { ref as ref5, onMounted as onMounted2 } from "vue";
  387. var overflowScrollReg = /scroll|auto|overlay/i;
  388. var defaultRoot = inBrowser ? window : void 0;
  389. function isElement(node) {
  390. const ELEMENT_NODE_TYPE = 1;
  391. return node.tagName !== "HTML" && node.tagName !== "BODY" && node.nodeType === ELEMENT_NODE_TYPE;
  392. }
  393. function getScrollParent(el, root = defaultRoot) {
  394. let node = el;
  395. while (node && node !== root && isElement(node)) {
  396. const { overflowY } = window.getComputedStyle(node);
  397. if (overflowScrollReg.test(overflowY)) {
  398. return node;
  399. }
  400. node = node.parentNode;
  401. }
  402. return root;
  403. }
  404. function useScrollParent(el, root = defaultRoot) {
  405. const scrollParent = ref5();
  406. onMounted2(() => {
  407. if (el.value) {
  408. scrollParent.value = getScrollParent(el.value, root);
  409. }
  410. });
  411. return scrollParent;
  412. }
  413. // src/usePageVisibility/index.ts
  414. import { ref as ref6 } from "vue";
  415. var visibility;
  416. function usePageVisibility() {
  417. if (!visibility) {
  418. visibility = ref6("visible");
  419. if (inBrowser) {
  420. const update = () => {
  421. visibility.value = document.hidden ? "hidden" : "visible";
  422. };
  423. update();
  424. window.addEventListener("visibilitychange", update);
  425. }
  426. }
  427. return visibility;
  428. }
  429. // src/useCustomFieldValue/index.ts
  430. import { watch as watch2, inject as inject2 } from "vue";
  431. var CUSTOM_FIELD_INJECTION_KEY = Symbol("van-field");
  432. function useCustomFieldValue(customValue) {
  433. const field = inject2(CUSTOM_FIELD_INJECTION_KEY, null);
  434. if (field && !field.customValue.value) {
  435. field.customValue.value = customValue;
  436. watch2(customValue, () => {
  437. field.resetValidation();
  438. field.validateWithTrigger("onChange");
  439. });
  440. }
  441. }
  442. // src/useRaf/index.ts
  443. function useRaf(fn, options) {
  444. if (inBrowser) {
  445. const { interval = 0, isLoop = false } = options || {};
  446. let start;
  447. let isStopped = false;
  448. let rafId;
  449. const stop = () => {
  450. isStopped = true;
  451. cancelAnimationFrame(rafId);
  452. };
  453. const frameWrapper = (timestamp) => {
  454. if (isStopped)
  455. return;
  456. if (start === void 0) {
  457. start = timestamp;
  458. } else if (timestamp - start > interval) {
  459. fn(timestamp);
  460. start = timestamp;
  461. if (!isLoop) {
  462. stop();
  463. return;
  464. }
  465. }
  466. rafId = requestAnimationFrame(frameWrapper);
  467. };
  468. rafId = requestAnimationFrame(frameWrapper);
  469. return stop;
  470. }
  471. return () => {
  472. };
  473. }
  474. export {
  475. CUSTOM_FIELD_INJECTION_KEY,
  476. cancelRaf,
  477. doubleRaf,
  478. flattenVNodes,
  479. getScrollParent,
  480. inBrowser,
  481. onMountedOrActivated,
  482. raf,
  483. sortChildren,
  484. supportsPassive,
  485. useChildren,
  486. useClickAway,
  487. useCountDown,
  488. useCustomFieldValue,
  489. useEventListener,
  490. usePageVisibility,
  491. useParent,
  492. useRaf,
  493. useRect,
  494. useScrollParent,
  495. useToggle,
  496. useWindowSize
  497. };