collection.js 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var collection = require('./collection2.js');
  5. var collectionItem = require('./collection-item.js');
  6. const COLLECTION_ITEM_SIGN = `data-el-collection-item`;
  7. const createCollectionWithScope = (name) => {
  8. const COLLECTION_NAME = `El${name}Collection`;
  9. const COLLECTION_ITEM_NAME = `${COLLECTION_NAME}Item`;
  10. const COLLECTION_INJECTION_KEY = Symbol(COLLECTION_NAME);
  11. const COLLECTION_ITEM_INJECTION_KEY = Symbol(COLLECTION_ITEM_NAME);
  12. const ElCollection = {
  13. ...collection["default"],
  14. name: COLLECTION_NAME,
  15. setup() {
  16. const collectionRef = vue.ref();
  17. const itemMap = /* @__PURE__ */ new Map();
  18. const getItems = () => {
  19. const collectionEl = vue.unref(collectionRef);
  20. if (!collectionEl)
  21. return [];
  22. const orderedNodes = Array.from(collectionEl.querySelectorAll(`[${COLLECTION_ITEM_SIGN}]`));
  23. const items = [...itemMap.values()];
  24. return items.sort((a, b) => orderedNodes.indexOf(a.ref) - orderedNodes.indexOf(b.ref));
  25. };
  26. vue.provide(COLLECTION_INJECTION_KEY, {
  27. itemMap,
  28. getItems,
  29. collectionRef
  30. });
  31. }
  32. };
  33. const ElCollectionItem = {
  34. ...collectionItem["default"],
  35. name: COLLECTION_ITEM_NAME,
  36. setup(_, { attrs }) {
  37. const collectionItemRef = vue.ref();
  38. const collectionInjection = vue.inject(COLLECTION_INJECTION_KEY, void 0);
  39. vue.provide(COLLECTION_ITEM_INJECTION_KEY, {
  40. collectionItemRef
  41. });
  42. vue.onMounted(() => {
  43. const collectionItemEl = vue.unref(collectionItemRef);
  44. if (collectionItemEl) {
  45. collectionInjection.itemMap.set(collectionItemEl, {
  46. ref: collectionItemEl,
  47. ...attrs
  48. });
  49. }
  50. });
  51. vue.onBeforeUnmount(() => {
  52. const collectionItemEl = vue.unref(collectionItemRef);
  53. collectionInjection.itemMap.delete(collectionItemEl);
  54. });
  55. }
  56. };
  57. return {
  58. COLLECTION_INJECTION_KEY,
  59. COLLECTION_ITEM_INJECTION_KEY,
  60. ElCollection,
  61. ElCollectionItem
  62. };
  63. };
  64. exports.COLLECTION_ITEM_SIGN = COLLECTION_ITEM_SIGN;
  65. exports.createCollectionWithScope = createCollectionWithScope;
  66. //# sourceMappingURL=collection.js.map