Collapse.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. var __defProp = Object.defineProperty;
  2. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  3. var __getOwnPropNames = Object.getOwnPropertyNames;
  4. var __hasOwnProp = Object.prototype.hasOwnProperty;
  5. var __export = (target, all) => {
  6. for (var name2 in all)
  7. __defProp(target, name2, { get: all[name2], enumerable: true });
  8. };
  9. var __copyProps = (to, from, except, desc) => {
  10. if (from && typeof from === "object" || typeof from === "function") {
  11. for (let key of __getOwnPropNames(from))
  12. if (!__hasOwnProp.call(to, key) && key !== except)
  13. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  14. }
  15. return to;
  16. };
  17. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  18. var stdin_exports = {};
  19. __export(stdin_exports, {
  20. COLLAPSE_KEY: () => COLLAPSE_KEY,
  21. default: () => stdin_default
  22. });
  23. module.exports = __toCommonJS(stdin_exports);
  24. var import_vue = require("vue");
  25. var import_vue2 = require("vue");
  26. var import_utils = require("../utils");
  27. var import_use = require("@vant/use");
  28. var import_use_expose = require("../composables/use-expose");
  29. const [name, bem] = (0, import_utils.createNamespace)("collapse");
  30. const COLLAPSE_KEY = Symbol(name);
  31. const collapseProps = {
  32. border: import_utils.truthProp,
  33. accordion: Boolean,
  34. modelValue: {
  35. type: [String, Number, Array],
  36. default: ""
  37. }
  38. };
  39. function validateModelValue(modelValue, accordion) {
  40. if (accordion && Array.isArray(modelValue)) {
  41. console.error('[Vant] Collapse: "v-model" should not be Array in accordion mode');
  42. return false;
  43. }
  44. if (!accordion && !Array.isArray(modelValue)) {
  45. console.error('[Vant] Collapse: "v-model" should be Array in non-accordion mode');
  46. return false;
  47. }
  48. return true;
  49. }
  50. var stdin_default = (0, import_vue2.defineComponent)({
  51. name,
  52. props: collapseProps,
  53. emits: ["change", "update:modelValue"],
  54. setup(props, {
  55. emit,
  56. slots
  57. }) {
  58. const {
  59. linkChildren,
  60. children
  61. } = (0, import_use.useChildren)(COLLAPSE_KEY);
  62. const updateName = (name2) => {
  63. emit("change", name2);
  64. emit("update:modelValue", name2);
  65. };
  66. const toggle = (name2, expanded) => {
  67. const {
  68. accordion,
  69. modelValue
  70. } = props;
  71. if (accordion) {
  72. updateName(name2 === modelValue ? "" : name2);
  73. } else if (expanded) {
  74. updateName(modelValue.concat(name2));
  75. } else {
  76. updateName(modelValue.filter((activeName) => activeName !== name2));
  77. }
  78. };
  79. const toggleAll = (options = {}) => {
  80. if (props.accordion) {
  81. return;
  82. }
  83. if (typeof options === "boolean") {
  84. options = {
  85. expanded: options
  86. };
  87. }
  88. const {
  89. expanded,
  90. skipDisabled
  91. } = options;
  92. const expandedChildren = children.filter((item) => {
  93. if (item.disabled && skipDisabled) {
  94. return item.expanded.value;
  95. }
  96. return expanded != null ? expanded : !item.expanded.value;
  97. });
  98. const names = expandedChildren.map((item) => item.itemName.value);
  99. updateName(names);
  100. };
  101. const isExpanded = (name2) => {
  102. const {
  103. accordion,
  104. modelValue
  105. } = props;
  106. if (process.env.NODE_ENV !== "production" && !validateModelValue(modelValue, accordion)) {
  107. return false;
  108. }
  109. return accordion ? modelValue === name2 : modelValue.includes(name2);
  110. };
  111. (0, import_use_expose.useExpose)({
  112. toggleAll
  113. });
  114. linkChildren({
  115. toggle,
  116. isExpanded
  117. });
  118. return () => {
  119. var _a;
  120. return (0, import_vue.createVNode)("div", {
  121. "class": [bem(), {
  122. [import_utils.BORDER_TOP_BOTTOM]: props.border
  123. }]
  124. }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
  125. };
  126. }
  127. });