analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
243 lines (238 loc) • 10.5 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/NotFound/NotFound.tsx
var NotFound_exports = {};
__export(NotFound_exports, {
default: () => NotFound_default
});
module.exports = __toCommonJS(NotFound_exports);
// 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/Text/Text.tsx
var import_jsx_runtime = require("react/jsx-runtime");
var Text = ({
children,
size = "md",
weight = "normal",
color = "text-text-950",
as,
className = "",
...props
}) => {
let sizeClasses = "";
let weightClasses = "";
const sizeClassMap = {
"2xs": "text-2xs",
xs: "text-xs",
sm: "text-sm",
md: "text-md",
lg: "text-lg",
xl: "text-xl",
"2xl": "text-2xl",
"3xl": "text-3xl",
"4xl": "text-4xl",
"5xl": "text-5xl",
"6xl": "text-6xl"
};
sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
const weightClassMap = {
hairline: "font-hairline",
light: "font-light",
normal: "font-normal",
medium: "font-medium",
semibold: "font-semibold",
bold: "font-bold",
extrabold: "font-extrabold",
black: "font-black"
};
weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
const baseClasses = "font-primary";
const Component = as ?? "p";
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
Component,
{
className: cn(baseClasses, sizeClasses, weightClasses, color, className),
...props,
children
}
);
};
var Text_default = Text;
// src/components/Button/Button.tsx
var import_jsx_runtime2 = require("react/jsx-runtime");
var VARIANT_ACTION_CLASSES = {
solid: {
primary: "bg-primary-950 text-text border border-primary-950 hover:bg-primary-800 hover:border-primary-800 focus-visible:outline-none focus-visible:bg-primary-950 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-primary-700 active:border-primary-700 disabled:bg-primary-500 disabled:border-primary-500 disabled:opacity-40 disabled:cursor-not-allowed",
positive: "bg-success-500 text-text border border-success-500 hover:bg-success-600 hover:border-success-600 focus-visible:outline-none focus-visible:bg-success-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-success-700 active:border-success-700 disabled:bg-success-500 disabled:border-success-500 disabled:opacity-40 disabled:cursor-not-allowed",
negative: "bg-error-500 text-text border border-error-500 hover:bg-error-600 hover:border-error-600 focus-visible:outline-none focus-visible:bg-error-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-error-700 active:border-error-700 disabled:bg-error-500 disabled:border-error-500 disabled:opacity-40 disabled:cursor-not-allowed"
},
outline: {
primary: "bg-transparent text-primary-950 border border-primary-950 hover:bg-background-50 hover:text-primary-400 hover:border-primary-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 active:border-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
positive: "bg-transparent text-success-500 border border-success-300 hover:bg-background-50 hover:text-success-400 hover:border-success-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 active:border-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
negative: "bg-transparent text-error-500 border border-error-300 hover:bg-background-50 hover:text-error-400 hover:border-error-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 active:border-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
},
link: {
primary: "bg-transparent text-primary-950 hover:text-primary-400 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
positive: "bg-transparent text-success-500 hover:text-success-400 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
negative: "bg-transparent text-error-500 hover:text-error-400 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
}
};
var SIZE_CLASSES = {
"extra-small": "text-xs px-3.5 py-2",
small: "text-sm px-4 py-2.5",
medium: "text-md px-5 py-2.5",
large: "text-lg px-6 py-3",
"extra-large": "text-lg px-7 py-3.5"
};
var Button = ({
children,
iconLeft,
iconRight,
size = "medium",
variant = "solid",
action = "primary",
className = "",
disabled,
type = "button",
...props
}) => {
const sizeClasses = SIZE_CLASSES[size];
const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
const baseClasses = "inline-flex items-center justify-center rounded-full cursor-pointer font-medium";
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
"button",
{
className: cn(baseClasses, variantClasses, sizeClasses, className),
disabled,
type,
...props,
children: [
iconLeft && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "mr-2 flex items-center", children: iconLeft }),
children,
iconRight && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "ml-2 flex items-center", children: iconRight })
]
}
);
};
var Button_default = Button;
// src/components/NotFound/NotFound.tsx
var import_jsx_runtime3 = require("react/jsx-runtime");
var NotFound = ({
title,
description,
buttonText = "Voltar",
onButtonClick,
className = "",
errorType = "404",
customErrorCode
}) => {
const getErrorCode = () => {
if (errorType === "custom") {
return customErrorCode?.trim() || "ERROR";
}
return errorType;
};
const getDefaultTitle = () => {
switch (errorType) {
case "404":
return "P\xE1gina n\xE3o encontrada";
case "500":
return "Erro interno do servidor";
default:
return "Erro";
}
};
const getDefaultDescription = () => {
switch (errorType) {
case "404":
return "Oops! A p\xE1gina que voc\xEA est\xE1 procurando n\xE3o existe ou foi removida.";
case "500":
return "Algo deu errado em nossos servidores. Tente novamente mais tarde.";
default:
return "Ocorreu um erro inesperado.";
}
};
const handleButtonClick = (event) => {
event.preventDefault();
onButtonClick?.();
};
const errorTitle = title || getDefaultTitle();
const errorDescription = description || getDefaultDescription();
const errorCode = getErrorCode();
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
"div",
{
className: cn(
"flex flex-col w-full h-screen items-center justify-center bg-background-50 px-4",
className
),
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
"main",
{
role: "main",
"aria-labelledby": "error-title",
"aria-describedby": "error-description",
className: "flex flex-col items-center text-center max-w-md space-y-6",
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("section", { "aria-label": `Erro ${errorCode}`, children: [
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
"div",
{
className: "text-8xl font-bold text-primary-300 select-none",
"aria-label": `C\xF3digo de erro: ${errorCode}`,
children: errorCode
}
),
/* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("header", { className: "space-y-2", children: [
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
Text_default,
{
size: "xl",
weight: "bold",
className: "text-text-950",
id: "error-title",
"aria-level": 1,
children: errorTitle
}
),
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Text_default, { size: "md", className: "text-text-600", id: "error-description", children: errorDescription })
] }),
onButtonClick && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("nav", { "aria-label": "Navega\xE7\xE3o de erro", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
Button_default,
{
onClick: handleButtonClick,
variant: "solid",
size: "medium",
className: "mt-8",
"aria-describedby": "error-description",
"aria-label": `${buttonText}. ${errorDescription}`,
children: buttonText
}
) })
] })
}
)
}
);
};
var NotFound_default = NotFound;
//# sourceMappingURL=index.js.map