9a57846302241ea4260ceff11a3ebc956fffa9deebb23243b950bdf13a390cb68204cda23a5d658c503afd449a976e9a095dbf40b0284d19866f45a23ab3b8 2.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var constants = require('./constants.js');
  5. var index$1 = require('../../../hooks/use-id/index.js');
  6. var index = require('../../../hooks/use-namespace/index.js');
  7. const useCollapseItem = (props) => {
  8. const collapse = vue.inject(constants.collapseContextKey);
  9. const { namespace } = index.useNamespace("collapse");
  10. const focusing = vue.ref(false);
  11. const isClick = vue.ref(false);
  12. const idInjection = index$1.useIdInjection();
  13. const id = vue.computed(() => idInjection.current++);
  14. const name = vue.computed(() => {
  15. var _a;
  16. return (_a = props.name) != null ? _a : `${namespace.value}-id-${idInjection.prefix}-${vue.unref(id)}`;
  17. });
  18. const isActive = vue.computed(() => collapse == null ? void 0 : collapse.activeNames.value.includes(vue.unref(name)));
  19. const handleFocus = () => {
  20. setTimeout(() => {
  21. if (!isClick.value) {
  22. focusing.value = true;
  23. } else {
  24. isClick.value = false;
  25. }
  26. }, 50);
  27. };
  28. const handleHeaderClick = (e) => {
  29. if (props.disabled)
  30. return;
  31. const target = e.target;
  32. if (target == null ? void 0 : target.closest("input, textarea, select"))
  33. return;
  34. collapse == null ? void 0 : collapse.handleItemClick(vue.unref(name));
  35. focusing.value = false;
  36. isClick.value = true;
  37. };
  38. const handleEnterClick = (e) => {
  39. const target = e.target;
  40. if (target == null ? void 0 : target.closest("input, textarea, select"))
  41. return;
  42. e.preventDefault();
  43. collapse == null ? void 0 : collapse.handleItemClick(vue.unref(name));
  44. };
  45. return {
  46. focusing,
  47. id,
  48. isActive,
  49. handleFocus,
  50. handleHeaderClick,
  51. handleEnterClick
  52. };
  53. };
  54. const useCollapseItemDOM = (props, { focusing, isActive, id }) => {
  55. const ns = index.useNamespace("collapse");
  56. const rootKls = vue.computed(() => [
  57. ns.b("item"),
  58. ns.is("active", vue.unref(isActive)),
  59. ns.is("disabled", props.disabled)
  60. ]);
  61. const headKls = vue.computed(() => [
  62. ns.be("item", "header"),
  63. ns.is("active", vue.unref(isActive)),
  64. { focusing: vue.unref(focusing) && !props.disabled }
  65. ]);
  66. const arrowKls = vue.computed(() => [
  67. ns.be("item", "arrow"),
  68. ns.is("active", vue.unref(isActive))
  69. ]);
  70. const itemTitleKls = vue.computed(() => [ns.be("item", "title")]);
  71. const itemWrapperKls = vue.computed(() => ns.be("item", "wrap"));
  72. const itemContentKls = vue.computed(() => ns.be("item", "content"));
  73. const scopedContentId = vue.computed(() => ns.b(`content-${vue.unref(id)}`));
  74. const scopedHeadId = vue.computed(() => ns.b(`head-${vue.unref(id)}`));
  75. return {
  76. itemTitleKls,
  77. arrowKls,
  78. headKls,
  79. rootKls,
  80. itemWrapperKls,
  81. itemContentKls,
  82. scopedContentId,
  83. scopedHeadId
  84. };
  85. };
  86. exports.useCollapseItem = useCollapseItem;
  87. exports.useCollapseItemDOM = useCollapseItemDOM;
  88. //# sourceMappingURL=use-collapse-item.js.map