analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
111 lines (108 loc) • 4.36 kB
JavaScript
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/components/Toast/Toast.tsx
var Toast_exports = {};
__export(Toast_exports, {
default: () => Toast_default
});
module.exports = __toCommonJS(Toast_exports);
var import_phosphor_react = require("phosphor-react");
// src/utils/utils.ts
var import_clsx = require("clsx");
var import_tailwind_merge = require("tailwind-merge");
function cn(...inputs) {
return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
}
// src/components/Toast/Toast.tsx
var import_jsx_runtime = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES = {
solid: {
warning: "bg-warning text-warning-600 border-none focus-visible:outline-none",
success: "bg-success text-success-800 border-none focus-visible:outline-none",
info: "bg-info text-info-600 border-none focus-visible:outline-none"
},
outlined: {
warning: "bg-warning text-warning-600 border border-warning-300 focus-visible:outline-none",
success: "bg-success text-success-800 border border-success-200 focus-visible:outline-none",
info: "bg-info text-info-600 border border-info-600 focus-visible:outline-none"
}
};
var iconMap = {
success: import_phosphor_react.CheckCircle,
info: import_phosphor_react.Info,
warning: import_phosphor_react.WarningCircle
};
var Toast = ({
variant = "outlined",
action = "success",
className = "",
onClose,
title,
description,
position = "default",
...props
}) => {
const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
const positionClasses = {
"top-left": "fixed top-4 left-4",
"top-center": "fixed top-4 left-1/2 transform -translate-x-1/2",
"top-right": "fixed top-4 right-4",
"bottom-left": "fixed bottom-4 left-4",
"bottom-center": "fixed bottom-4 left-1/2 transform -translate-x-1/2",
"bottom-right": "fixed bottom-4 right-4",
default: ""
};
const IconAction = iconMap[action] || iconMap["success"];
const baseClasses = "max-w-[390px] w-full flex flex-row items-start justify-between shadow-lg rounded-lg border p-4 gap-6 group";
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
"div",
{
role: "alert",
"aria-live": "assertive",
"aria-atomic": "true",
className: cn(
baseClasses,
positionClasses[position],
variantClasses,
className
),
...props,
children: [
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-row items-start gap-3", children: [
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "mt-1", "data-testid": `toast-icon-${action}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconAction, {}) }),
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col items-start justify-start", children: [
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "font-semibold text-md", children: title }),
description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-md text-text-900", children: description })
] })
] }),
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
"button",
{
onClick: onClose,
"aria-label": "Dismiss notification",
className: "text-background-500 cursor-pointer opacity-0 group-hover:opacity-100 transition-opacity",
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_phosphor_react.X, {})
}
)
]
}
);
};
var Toast_default = Toast;
//# sourceMappingURL=index.js.map