index.esm.mjs 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450
  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. function sortChildren(parent, publicChildren, internalChildren) {
  103. const vnodes = flattenVNodes(parent.subTree.children);
  104. internalChildren.sort(
  105. (a, b) => vnodes.indexOf(a.vnode) - vnodes.indexOf(b.vnode)
  106. );
  107. const orderedPublicChildren = internalChildren.map((item) => item.proxy);
  108. publicChildren.sort((a, b) => {
  109. const indexA = orderedPublicChildren.indexOf(a);
  110. const indexB = orderedPublicChildren.indexOf(b);
  111. return indexA - indexB;
  112. });
  113. }
  114. function useChildren(key) {
  115. const publicChildren = reactive([]);
  116. const internalChildren = reactive([]);
  117. const parent = getCurrentInstance2();
  118. const linkChildren = (value) => {
  119. const link = (child) => {
  120. if (child.proxy) {
  121. internalChildren.push(child);
  122. publicChildren.push(child.proxy);
  123. sortChildren(parent, publicChildren, internalChildren);
  124. }
  125. };
  126. const unlink = (child) => {
  127. const index = internalChildren.indexOf(child);
  128. publicChildren.splice(index, 1);
  129. internalChildren.splice(index, 1);
  130. };
  131. provide(
  132. key,
  133. Object.assign(
  134. {
  135. link,
  136. unlink,
  137. children: publicChildren,
  138. internalChildren
  139. },
  140. value
  141. )
  142. );
  143. };
  144. return {
  145. children: publicChildren,
  146. linkChildren
  147. };
  148. }
  149. // src/useCountDown/index.ts
  150. import {
  151. ref as ref3,
  152. computed as computed2,
  153. onActivated,
  154. onDeactivated,
  155. onBeforeUnmount
  156. } from "vue";
  157. var SECOND = 1e3;
  158. var MINUTE = 60 * SECOND;
  159. var HOUR = 60 * MINUTE;
  160. var DAY = 24 * HOUR;
  161. function parseTime(time) {
  162. const days = Math.floor(time / DAY);
  163. const hours = Math.floor(time % DAY / HOUR);
  164. const minutes = Math.floor(time % HOUR / MINUTE);
  165. const seconds = Math.floor(time % MINUTE / SECOND);
  166. const milliseconds = Math.floor(time % SECOND);
  167. return {
  168. total: time,
  169. days,
  170. hours,
  171. minutes,
  172. seconds,
  173. milliseconds
  174. };
  175. }
  176. function isSameSecond(time1, time2) {
  177. return Math.floor(time1 / 1e3) === Math.floor(time2 / 1e3);
  178. }
  179. function useCountDown(options) {
  180. let rafId;
  181. let endTime;
  182. let counting;
  183. let deactivated;
  184. const remain = ref3(options.time);
  185. const current = computed2(() => parseTime(remain.value));
  186. const pause = () => {
  187. counting = false;
  188. cancelRaf(rafId);
  189. };
  190. const getCurrentRemain = () => Math.max(endTime - Date.now(), 0);
  191. const setRemain = (value) => {
  192. var _a, _b;
  193. remain.value = value;
  194. (_a = options.onChange) == null ? void 0 : _a.call(options, current.value);
  195. if (value === 0) {
  196. pause();
  197. (_b = options.onFinish) == null ? void 0 : _b.call(options);
  198. }
  199. };
  200. const microTick = () => {
  201. rafId = raf(() => {
  202. if (counting) {
  203. setRemain(getCurrentRemain());
  204. if (remain.value > 0) {
  205. microTick();
  206. }
  207. }
  208. });
  209. };
  210. const macroTick = () => {
  211. rafId = raf(() => {
  212. if (counting) {
  213. const remainRemain = getCurrentRemain();
  214. if (!isSameSecond(remainRemain, remain.value) || remainRemain === 0) {
  215. setRemain(remainRemain);
  216. }
  217. if (remain.value > 0) {
  218. macroTick();
  219. }
  220. }
  221. });
  222. };
  223. const tick = () => {
  224. if (!inBrowser) {
  225. return;
  226. }
  227. if (options.millisecond) {
  228. microTick();
  229. } else {
  230. macroTick();
  231. }
  232. };
  233. const start = () => {
  234. if (!counting) {
  235. endTime = Date.now() + remain.value;
  236. counting = true;
  237. tick();
  238. }
  239. };
  240. const reset = (totalTime = options.time) => {
  241. pause();
  242. remain.value = totalTime;
  243. };
  244. onBeforeUnmount(pause);
  245. onActivated(() => {
  246. if (deactivated) {
  247. counting = true;
  248. deactivated = false;
  249. tick();
  250. }
  251. });
  252. onDeactivated(() => {
  253. if (counting) {
  254. pause();
  255. deactivated = true;
  256. }
  257. });
  258. return {
  259. start,
  260. pause,
  261. reset,
  262. current
  263. };
  264. }
  265. // src/useClickAway/index.ts
  266. import { unref as unref3 } from "vue";
  267. // src/useEventListener/index.ts
  268. import { watch, isRef, unref as unref2, onUnmounted as onUnmounted2, onDeactivated as onDeactivated2 } from "vue";
  269. // src/onMountedOrActivated/index.ts
  270. import { nextTick, onMounted, onActivated as onActivated2 } from "vue";
  271. function onMountedOrActivated(hook) {
  272. let mounted;
  273. onMounted(() => {
  274. hook();
  275. nextTick(() => {
  276. mounted = true;
  277. });
  278. });
  279. onActivated2(() => {
  280. if (mounted) {
  281. hook();
  282. }
  283. });
  284. }
  285. // src/useEventListener/index.ts
  286. function useEventListener(type, listener, options = {}) {
  287. if (!inBrowser) {
  288. return;
  289. }
  290. const { target = window, passive = false, capture = false } = options;
  291. let attached;
  292. const add = (target2) => {
  293. const element = unref2(target2);
  294. if (element && !attached) {
  295. element.addEventListener(type, listener, {
  296. capture,
  297. passive
  298. });
  299. attached = true;
  300. }
  301. };
  302. const remove = (target2) => {
  303. const element = unref2(target2);
  304. if (element && attached) {
  305. element.removeEventListener(type, listener, capture);
  306. attached = false;
  307. }
  308. };
  309. onUnmounted2(() => remove(target));
  310. onDeactivated2(() => remove(target));
  311. onMountedOrActivated(() => add(target));
  312. if (isRef(target)) {
  313. watch(target, (val, oldVal) => {
  314. remove(oldVal);
  315. add(val);
  316. });
  317. }
  318. }
  319. // src/useClickAway/index.ts
  320. function useClickAway(target, listener, options = {}) {
  321. if (!inBrowser) {
  322. return;
  323. }
  324. const { eventName = "click" } = options;
  325. const onClick = (event) => {
  326. const targets = Array.isArray(target) ? target : [target];
  327. const isClickAway = targets.every((item) => {
  328. const element = unref3(item);
  329. return element && !element.contains(event.target);
  330. });
  331. if (isClickAway) {
  332. listener(event);
  333. }
  334. };
  335. useEventListener(eventName, onClick, { target: document });
  336. }
  337. // src/useWindowSize/index.ts
  338. import { ref as ref4 } from "vue";
  339. var width;
  340. var height;
  341. function useWindowSize() {
  342. if (!width) {
  343. width = ref4(0);
  344. height = ref4(0);
  345. if (inBrowser) {
  346. const update = () => {
  347. width.value = window.innerWidth;
  348. height.value = window.innerHeight;
  349. };
  350. update();
  351. window.addEventListener("resize", update, { passive: true });
  352. window.addEventListener("orientationchange", update, { passive: true });
  353. }
  354. }
  355. return { width, height };
  356. }
  357. // src/useScrollParent/index.ts
  358. import { ref as ref5, onMounted as onMounted2 } from "vue";
  359. var overflowScrollReg = /scroll|auto|overlay/i;
  360. var defaultRoot = inBrowser ? window : void 0;
  361. function isElement(node) {
  362. const ELEMENT_NODE_TYPE = 1;
  363. return node.tagName !== "HTML" && node.tagName !== "BODY" && node.nodeType === ELEMENT_NODE_TYPE;
  364. }
  365. function getScrollParent(el, root = defaultRoot) {
  366. let node = el;
  367. while (node && node !== root && isElement(node)) {
  368. const { overflowY } = window.getComputedStyle(node);
  369. if (overflowScrollReg.test(overflowY)) {
  370. return node;
  371. }
  372. node = node.parentNode;
  373. }
  374. return root;
  375. }
  376. function useScrollParent(el, root = defaultRoot) {
  377. const scrollParent = ref5();
  378. onMounted2(() => {
  379. if (el.value) {
  380. scrollParent.value = getScrollParent(el.value, root);
  381. }
  382. });
  383. return scrollParent;
  384. }
  385. // src/usePageVisibility/index.ts
  386. import { ref as ref6 } from "vue";
  387. var visibility;
  388. function usePageVisibility() {
  389. if (!visibility) {
  390. visibility = ref6("visible");
  391. if (inBrowser) {
  392. const update = () => {
  393. visibility.value = document.hidden ? "hidden" : "visible";
  394. };
  395. update();
  396. window.addEventListener("visibilitychange", update);
  397. }
  398. }
  399. return visibility;
  400. }
  401. // src/useCustomFieldValue/index.ts
  402. import { watch as watch2, inject as inject2 } from "vue";
  403. var CUSTOM_FIELD_INJECTION_KEY = Symbol("van-field");
  404. function useCustomFieldValue(customValue) {
  405. const field = inject2(CUSTOM_FIELD_INJECTION_KEY, null);
  406. if (field && !field.customValue.value) {
  407. field.customValue.value = customValue;
  408. watch2(customValue, () => {
  409. field.resetValidation();
  410. field.validateWithTrigger("onChange");
  411. });
  412. }
  413. }
  414. export {
  415. CUSTOM_FIELD_INJECTION_KEY,
  416. cancelRaf,
  417. doubleRaf,
  418. flattenVNodes,
  419. getScrollParent,
  420. inBrowser,
  421. onMountedOrActivated,
  422. raf,
  423. sortChildren,
  424. supportsPassive,
  425. useChildren,
  426. useClickAway,
  427. useCountDown,
  428. useCustomFieldValue,
  429. useEventListener,
  430. usePageVisibility,
  431. useParent,
  432. useRect,
  433. useScrollParent,
  434. useToggle,
  435. useWindowSize
  436. };