react-antd-admin-panel
Version:
Modern TypeScript-first React admin panel builder with Ant Design 6
369 lines (368 loc) • 8.23 kB
JavaScript
"use strict";
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const antd = require("antd");
const icons = require("@ant-design/icons");
const useAccess = require("./useAccess-Bu6PpWEB.cjs");
class Action {
constructor() {
__publicField(this, "_key");
__publicField(this, "_label");
__publicField(this, "_icon");
__publicField(this, "_tooltip");
__publicField(this, "_type", "submit");
__publicField(this, "_buttonType", "default");
__publicField(this, "_danger", false);
__publicField(this, "_disabled", false);
__publicField(this, "_loading", false);
__publicField(this, "_confirm");
__publicField(this, "_route");
__publicField(this, "_access");
// Callbacks
__publicField(this, "_callback");
__publicField(this, "_onComplete");
__publicField(this, "_onError");
}
/**
* Set action key/identifier
*/
key(value) {
this._key = value;
return this;
}
/**
* Get action key
*/
getKey() {
return this._key;
}
/**
* Set action label
*/
label(value) {
this._label = value;
return this;
}
/**
* Get action label
*/
getLabel() {
return this._label;
}
/**
* Set action icon
*/
icon(value) {
this._icon = value;
return this;
}
/**
* Get action icon
*/
getIcon() {
return this._icon;
}
/**
* Set tooltip text (also used as aria-label for icon-only buttons)
*/
tooltip(value) {
this._tooltip = value;
return this;
}
/**
* Get tooltip text
*/
getTooltip() {
return this._tooltip;
}
/**
* Set action type
*/
type(value) {
this._type = value;
return this;
}
/**
* Get action type
*/
getType() {
return this._type;
}
/**
* Set button type (Ant Design ButtonType)
*/
buttonType(value) {
this._buttonType = value;
return this;
}
/**
* Get button type
*/
getButtonType() {
return this._buttonType;
}
/**
* Set danger mode
*/
danger(value = true) {
this._danger = value;
return this;
}
/**
* Check if danger mode
*/
isDanger() {
return this._danger;
}
/**
* Set disabled state
*/
disabled(value = true) {
this._disabled = value;
return this;
}
/**
* Check if disabled
*/
isDisabled() {
return this._disabled;
}
/**
* Set loading state
*/
loading(value = true) {
this._loading = value;
return this;
}
/**
* Check if loading
*/
isLoading() {
return this._loading;
}
/**
* Set confirmation dialog (string shorthand or full config)
*/
confirm(value) {
this._confirm = typeof value === "string" ? { content: value } : value;
return this;
}
/**
* Get confirmation config
*/
getConfirm() {
return this._confirm;
}
/**
* Set route for link type actions
*/
route(value) {
this._route = value;
return this;
}
/**
* Get route
*/
getRoute() {
return this._route;
}
/**
* Set access requirements
*/
access(value) {
this._access = value;
return this;
}
/**
* Get access requirements
*/
getAccess() {
return this._access;
}
/**
* Set callback function for 'callback' type actions
*/
callback(fn) {
this._type = "callback";
this._callback = fn;
return this;
}
/**
* Get callback function
*/
getCallback() {
return this._callback;
}
/**
* Set completion callback
*/
onComplete(fn) {
this._onComplete = fn;
return this;
}
/**
* Call completion callback
*/
callComplete(result) {
var _a;
(_a = this._onComplete) == null ? void 0 : _a.call(this, result);
}
/**
* Set error callback
*/
onError(fn) {
this._onError = fn;
return this;
}
/**
* Call error callback
*/
callError(error) {
var _a;
(_a = this._onError) == null ? void 0 : _a.call(this, error);
}
/**
* Execute the action's callback
* For 'callback' type actions
*/
async execute(args) {
var _a, _b;
if (this._type !== "callback" || !this._callback) {
return;
}
this._loading = true;
try {
await this._callback(this, args);
(_a = this._onComplete) == null ? void 0 : _a.call(this);
} catch (error) {
const err = error instanceof Error ? error : new Error(String(error));
(_b = this._onError) == null ? void 0 : _b.call(this, err);
throw err;
} finally {
this._loading = false;
}
}
/**
* Clone this action
*/
clone() {
const cloned = new Action();
cloned._key = this._key;
cloned._label = this._label;
cloned._icon = this._icon;
cloned._type = this._type;
cloned._buttonType = this._buttonType;
cloned._danger = this._danger;
cloned._disabled = this._disabled;
cloned._confirm = this._confirm;
cloned._route = this._route;
cloned._access = this._access;
cloned._callback = this._callback;
cloned._onComplete = this._onComplete;
cloned._onError = this._onError;
return cloned;
}
}
function ActionButton({
action,
formula,
args,
navigate,
disabled: disabledProp,
className,
size
}) {
const [loading, setLoading] = React.useState(false);
const access = useAccess.useAccess();
const accessConfig = action.getAccess();
const hasAccess = React.useCallback(() => {
if (!accessConfig) return true;
if (accessConfig.role && !access.hasRole(accessConfig.role)) {
return false;
}
if (accessConfig.roles && !access.hasAnyRole(accessConfig.roles)) {
return false;
}
if (accessConfig.permission && !access.hasPermission(accessConfig.permission)) {
return false;
}
if (accessConfig.feature && !access.hasFeature(accessConfig.feature, accessConfig.level)) {
return false;
}
return true;
}, [accessConfig, access]);
if (!hasAccess()) {
return null;
}
const isDisabled = disabledProp ?? action.isDisabled();
const isLoading = loading || action.isLoading();
const confirmConfig = action.getConfirm();
const executeAction = async () => {
const actionType = action.getType();
try {
setLoading(true);
switch (actionType) {
case "submit":
if (formula) {
await formula.submit();
}
break;
case "callback":
await action.execute(args);
break;
case "link":
const route = action.getRoute();
if (route && navigate) {
navigate(route);
} else if (route) {
window.location.href = route;
}
break;
case "reset":
if (formula) {
formula.reset();
}
break;
}
} catch {
} finally {
setLoading(false);
}
};
const handleClick = () => {
if (confirmConfig) {
antd.Modal.confirm({
title: confirmConfig.title || "Confirm",
icon: /* @__PURE__ */ jsxRuntime.jsx(icons.ExclamationCircleOutlined, {}),
content: confirmConfig.content,
okText: confirmConfig.okText || "OK",
cancelText: confirmConfig.cancelText || "Cancel",
okButtonProps: confirmConfig.danger ? { danger: true } : void 0,
onOk: executeAction
});
} else {
executeAction();
}
};
return /* @__PURE__ */ jsxRuntime.jsx(
antd.Button,
{
type: action.getButtonType(),
danger: action.isDanger(),
disabled: isDisabled,
loading: isLoading,
icon: action.getIcon(),
onClick: handleClick,
className,
size,
"aria-label": !action.getLabel() && action.getIcon() ? action.getTooltip() || "Action button" : void 0,
children: action.getLabel()
}
);
}
exports.Action = Action;
exports.ActionButton = ActionButton;
//# sourceMappingURL=ActionButton-DWH3-bPK.cjs.map