ShareSheet.mjs 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
  2. import { defineComponent } from "vue";
  3. import { pick, extend, truthProp, makeArrayProp, createNamespace, HAPTICS_FEEDBACK } from "../utils/index.mjs";
  4. import { popupSharedProps, popupSharedPropKeys } from "../popup/shared.mjs";
  5. import { Icon } from "../icon/index.mjs";
  6. import { Popup } from "../popup/index.mjs";
  7. const popupInheritKeys = [...popupSharedPropKeys, "round", "closeOnPopstate", "safeAreaInsetBottom"];
  8. const iconMap = {
  9. qq: "qq",
  10. link: "link-o",
  11. weibo: "weibo",
  12. qrcode: "qr",
  13. poster: "photo-o",
  14. wechat: "wechat",
  15. "weapp-qrcode": "miniprogram-o",
  16. "wechat-moments": "wechat-moments"
  17. };
  18. const [name, bem, t] = createNamespace("share-sheet");
  19. const shareSheetProps = extend({}, popupSharedProps, {
  20. title: String,
  21. round: truthProp,
  22. options: makeArrayProp(),
  23. cancelText: String,
  24. description: String,
  25. closeOnPopstate: truthProp,
  26. safeAreaInsetBottom: truthProp
  27. });
  28. var stdin_default = defineComponent({
  29. name,
  30. props: shareSheetProps,
  31. emits: ["cancel", "select", "update:show"],
  32. setup(props, {
  33. emit,
  34. slots
  35. }) {
  36. const updateShow = (value) => emit("update:show", value);
  37. const onCancel = () => {
  38. updateShow(false);
  39. emit("cancel");
  40. };
  41. const onSelect = (option, index) => emit("select", option, index);
  42. const renderHeader = () => {
  43. const title = slots.title ? slots.title() : props.title;
  44. const description = slots.description ? slots.description() : props.description;
  45. if (title || description) {
  46. return _createVNode("div", {
  47. "class": bem("header")
  48. }, [title && _createVNode("h2", {
  49. "class": bem("title")
  50. }, [title]), description && _createVNode("span", {
  51. "class": bem("description")
  52. }, [description])]);
  53. }
  54. };
  55. const renderIcon = (icon) => {
  56. if (iconMap[icon]) {
  57. return _createVNode("div", {
  58. "class": bem("icon", [icon])
  59. }, [_createVNode(Icon, {
  60. "name": iconMap[icon] || icon
  61. }, null)]);
  62. }
  63. return _createVNode("img", {
  64. "src": icon,
  65. "class": bem("image-icon")
  66. }, null);
  67. };
  68. const renderOption = (option, index) => {
  69. const {
  70. name: name2,
  71. icon,
  72. className,
  73. description
  74. } = option;
  75. return _createVNode("div", {
  76. "role": "button",
  77. "tabindex": 0,
  78. "class": [bem("option"), className, HAPTICS_FEEDBACK],
  79. "onClick": () => onSelect(option, index)
  80. }, [renderIcon(icon), name2 && _createVNode("span", {
  81. "class": bem("name")
  82. }, [name2]), description && _createVNode("span", {
  83. "class": bem("option-description")
  84. }, [description])]);
  85. };
  86. const renderOptions = (options, border) => _createVNode("div", {
  87. "class": bem("options", {
  88. border
  89. })
  90. }, [options.map(renderOption)]);
  91. const renderRows = () => {
  92. const {
  93. options
  94. } = props;
  95. if (Array.isArray(options[0])) {
  96. return options.map((item, index) => renderOptions(item, index !== 0));
  97. }
  98. return renderOptions(options);
  99. };
  100. const renderCancelButton = () => {
  101. var _a;
  102. const cancelText = (_a = props.cancelText) != null ? _a : t("cancel");
  103. if (slots.cancel || cancelText) {
  104. return _createVNode("button", {
  105. "type": "button",
  106. "class": bem("cancel"),
  107. "onClick": onCancel
  108. }, [slots.cancel ? slots.cancel() : cancelText]);
  109. }
  110. };
  111. return () => _createVNode(Popup, _mergeProps({
  112. "class": bem(),
  113. "position": "bottom",
  114. "onUpdate:show": updateShow
  115. }, pick(props, popupInheritKeys)), {
  116. default: () => [renderHeader(), renderRows(), renderCancelButton()]
  117. });
  118. }
  119. });
  120. export {
  121. stdin_default as default
  122. };