UNPKG

5.38 kBJavaScriptView Raw
1var __defProp = Object.defineProperty;
2var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3var __getOwnPropNames = Object.getOwnPropertyNames;
4var __hasOwnProp = Object.prototype.hasOwnProperty;
5var __export = (target, all) => {
6 for (var name2 in all)
7 __defProp(target, name2, { get: all[name2], enumerable: true });
8};
9var __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};
17var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
18var stdin_exports = {};
19__export(stdin_exports, {
20 actionSheetProps: () => actionSheetProps,
21 default: () => stdin_default
22});
23module.exports = __toCommonJS(stdin_exports);
24var import_vue = require("vue");
25var import_utils = require("../utils");
26var import_icon = require("../icon");
27var import_popup = require("../popup");
28var import_loading = require("../loading");
29var import_shared = require("../popup/shared");
30const [name, bem] = (0, import_utils.createNamespace)("action-sheet");
31const actionSheetProps = (0, import_utils.extend)({}, import_shared.popupSharedProps, {
32 title: String,
33 round: import_utils.truthProp,
34 actions: (0, import_utils.makeArrayProp)(),
35 closeIcon: (0, import_utils.makeStringProp)("cross"),
36 closeable: import_utils.truthProp,
37 cancelText: String,
38 description: String,
39 closeOnPopstate: import_utils.truthProp,
40 closeOnClickAction: Boolean,
41 safeAreaInsetBottom: import_utils.truthProp
42});
43const popupInheritKeys = [...import_shared.popupSharedPropKeys, "round", "closeOnPopstate", "safeAreaInsetBottom"];
44var stdin_default = (0, import_vue.defineComponent)({
45 name,
46 props: actionSheetProps,
47 emits: ["select", "cancel", "update:show"],
48 setup(props, {
49 slots,
50 emit
51 }) {
52 const updateShow = (show) => emit("update:show", show);
53 const onCancel = () => {
54 updateShow(false);
55 emit("cancel");
56 };
57 const renderHeader = () => {
58 if (props.title) {
59 return (0, import_vue.createVNode)("div", {
60 "class": bem("header")
61 }, [props.title, props.closeable && (0, import_vue.createVNode)(import_icon.Icon, {
62 "name": props.closeIcon,
63 "class": [bem("close"), import_utils.HAPTICS_FEEDBACK],
64 "onClick": onCancel
65 }, null)]);
66 }
67 };
68 const renderCancel = () => {
69 if (slots.cancel || props.cancelText) {
70 return [(0, import_vue.createVNode)("div", {
71 "class": bem("gap")
72 }, null), (0, import_vue.createVNode)("button", {
73 "type": "button",
74 "class": bem("cancel"),
75 "onClick": onCancel
76 }, [slots.cancel ? slots.cancel() : props.cancelText])];
77 }
78 };
79 const renderIcon = (action) => {
80 if (action.icon) {
81 return (0, import_vue.createVNode)(import_icon.Icon, {
82 "class": bem("item-icon"),
83 "name": action.icon
84 }, null);
85 }
86 };
87 const renderActionContent = (action, index) => {
88 if (action.loading) {
89 return (0, import_vue.createVNode)(import_loading.Loading, {
90 "class": bem("loading-icon")
91 }, null);
92 }
93 if (slots.action) {
94 return slots.action({
95 action,
96 index
97 });
98 }
99 return [(0, import_vue.createVNode)("span", {
100 "class": bem("name")
101 }, [action.name]), action.subname && (0, import_vue.createVNode)("div", {
102 "class": bem("subname")
103 }, [action.subname])];
104 };
105 const renderAction = (action, index) => {
106 const {
107 color,
108 loading,
109 callback,
110 disabled,
111 className
112 } = action;
113 const onClick = () => {
114 if (disabled || loading) {
115 return;
116 }
117 if (callback) {
118 callback(action);
119 }
120 if (props.closeOnClickAction) {
121 updateShow(false);
122 }
123 (0, import_vue.nextTick)(() => emit("select", action, index));
124 };
125 return (0, import_vue.createVNode)("button", {
126 "type": "button",
127 "style": {
128 color
129 },
130 "class": [bem("item", {
131 loading,
132 disabled
133 }), className],
134 "onClick": onClick
135 }, [renderIcon(action), renderActionContent(action, index)]);
136 };
137 const renderDescription = () => {
138 if (props.description || slots.description) {
139 const content = slots.description ? slots.description() : props.description;
140 return (0, import_vue.createVNode)("div", {
141 "class": bem("description")
142 }, [content]);
143 }
144 };
145 return () => (0, import_vue.createVNode)(import_popup.Popup, (0, import_vue.mergeProps)({
146 "class": bem(),
147 "position": "bottom",
148 "onUpdate:show": updateShow
149 }, (0, import_utils.pick)(props, popupInheritKeys)), {
150 default: () => {
151 var _a;
152 return [renderHeader(), renderDescription(), (0, import_vue.createVNode)("div", {
153 "class": bem("content")
154 }, [props.actions.map(renderAction), (_a = slots.default) == null ? void 0 : _a.call(slots)]), renderCancel()];
155 }
156 });
157 }
158});