npm - analytica-frontend-lib - Versions diffs - 1.0.75 → 1.0.76 - Mend

analytica-frontend-lib 1.0.75 → 1.0.76

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (25) hide show

package/dist/Accordation/index.d.mts +1 -1
package/dist/Accordation/index.d.ts +1 -1
package/dist/Accordation/index.js +10 -11
package/dist/Accordation/index.js.map +1 -1
package/dist/Accordation/index.mjs +15 -12
package/dist/Accordation/index.mjs.map +1 -1
package/dist/AlertDialog/index.d.mts +4 -8
package/dist/AlertDialog/index.d.ts +4 -8
package/dist/AlertDialog/index.js +52 -78
package/dist/AlertDialog/index.js.map +1 -1
package/dist/AlertDialog/index.mjs +52 -79
package/dist/AlertDialog/index.mjs.map +1 -1
package/dist/Alternative/index.js +25 -5
package/dist/Alternative/index.js.map +1 -1
package/dist/Alternative/index.mjs +26 -6
package/dist/Alternative/index.mjs.map +1 -1
package/dist/index.css +11 -0
package/dist/index.css.map +1 -1
package/dist/index.js +87 -94
package/dist/index.js.map +1 -1
package/dist/index.mjs +93 -97
package/dist/index.mjs.map +1 -1
package/dist/styles.css +11 -0
package/dist/styles.css.map +1 -1
package/package.json +1 -1

package/dist/AlertDialog/index.d.ts CHANGED Viewed

@@ -1,17 +1,13 @@
 import * as react from 'react';
-import { HTMLAttributes, ReactNode } from 'react';
+import { HTMLAttributes } from 'react';
 interface AlertDialogProps extends HTMLAttributes<HTMLDivElement> {
-    /** Trigger element that opens the alert dialog */
-    trigger: ReactNode;
     /** Title of the alert dialog */
     title: string;
     /** Whether the alert dialog is open (controlled mode) */
-    isOpen?: boolean;
-    /** Function called when the alert dialog should be opened (controlled mode) */
-    onOpen?: () => void;
-    /** Function called when the alert dialog should be closed (controlled mode) */
-    onClose?: () => void;
+    isOpen: boolean;
+    /** Function called when the alert dialog is opened or closed (controlled mode) */
+    onChangeOpen: (open: boolean) => void;
     /** Whether clicking the backdrop should close the alert dialog */
     closeOnBackdropClick?: boolean;
     /** Whether pressing Escape should close the alert dialog */

package/dist/AlertDialog/index.js CHANGED Viewed

@@ -94,38 +94,27 @@ var SIZE_CLASSES2 = {
 };
 var AlertDialog = (0, import_react.forwardRef)(
   ({
-    trigger,
     description,
     cancelButtonLabel = "Cancelar",
     submitButtonLabel = "Deletar",
     title,
-    isOpen: controlledIsOpen,
-    onOpen,
-    onClose,
+    isOpen,
     closeOnBackdropClick = true,
     closeOnEscape = true,
     className = "",
     onSubmit,
+    onChangeOpen,
     submitValue,
     onCancel,
     cancelValue,
     size = "medium",
     ...props
   }, ref) => {
-    const [internalIsOpen, setInternalIsOpen] = (0, import_react.useState)(false);
-    const isOpen = controlledIsOpen ?? internalIsOpen;
-    const setIsOpen = (open) => {
-      if (controlledIsOpen === void 0) {
-        setInternalIsOpen(open);
-      }
-      if (open && onOpen) onOpen();
-      if (!open && onClose) onClose();
-    };
     (0, import_react.useEffect)(() => {
       if (!isOpen || !closeOnEscape) return;
       const handleEscape = (event) => {
         if (event.key === "Escape") {
-          setIsOpen(false);
+          onChangeOpen(false);
         }
       };
       document.addEventListener("keydown", handleEscape);
@@ -143,86 +132,71 @@ var AlertDialog = (0, import_react.forwardRef)(
     }, [isOpen]);
     const handleBackdropClick = (event) => {
       if (event.target === event.currentTarget && closeOnBackdropClick) {
-        setIsOpen(false);
+        onChangeOpen(false);
       }
     };
     const handleBackdropKeyDown = (event) => {
       if (event.key === "Escape" && closeOnEscape) {
-        setIsOpen(false);
+        onChangeOpen(false);
       }
     };
-    const handleTriggerClick = () => {
-      setIsOpen(true);
-    };
     const handleSubmit = () => {
-      setIsOpen(false);
+      onChangeOpen(false);
       onSubmit?.(submitValue);
     };
     const handleCancel = () => {
-      setIsOpen(false);
+      onChangeOpen(false);
       onCancel?.(cancelValue);
     };
     const sizeClasses = SIZE_CLASSES2[size];
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "button",
-        {
-          onClick: handleTriggerClick,
-          "aria-label": "Open dialog",
-          type: "button",
-          className: "border-none bg-transparent p-0 cursor-pointer",
-          children: trigger
-        }
-      ),
-      isOpen && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        "div",
-        {
-          className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",
-          onClick: handleBackdropClick,
-          onKeyDown: handleBackdropKeyDown,
-          "data-testid": "alert-dialog-overlay",
-          children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-            "div",
-            {
-              ref,
-              className: `bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`,
-              ...props,
-              children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "div",
+      {
+        className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",
+        onClick: handleBackdropClick,
+        onKeyDown: handleBackdropKeyDown,
+        "data-testid": "alert-dialog-overlay",
+        children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          "div",
+          {
+            ref,
+            className: `bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`,
+            ...props,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "h2",
+                {
+                  id: "alert-dialog-title",
+                  className: "pb-3 text-xl font-semibold",
+                  children: title
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "p",
+                {
+                  id: "alert-dialog-description",
+                  className: "text-text-700 text-sm",
+                  children: description
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-row items-center justify-end pt-4 gap-3", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Button_default, { variant: "outline", size: "small", onClick: handleCancel, children: cancelButtonLabel }),
                 /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                  "h2",
+                  Button_default,
                   {
-                    id: "alert-dialog-title",
-                    className: "pb-3 text-xl font-semibold",
-                    children: title
+                    variant: "solid",
+                    size: "small",
+                    action: "negative",
+                    onClick: handleSubmit,
+                    children: submitButtonLabel
                   }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                  "p",
-                  {
-                    id: "alert-dialog-description",
-                    className: "text-text-700 text-sm",
-                    children: description
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-row items-center justify-end pt-4 gap-3", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Button_default, { variant: "outline", size: "small", onClick: handleCancel, children: cancelButtonLabel }),
-                  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-                    Button_default,
-                    {
-                      variant: "solid",
-                      size: "small",
-                      action: "negative",
-                      onClick: handleSubmit,
-                      children: submitButtonLabel
-                    }
-                  )
-                ] })
-              ]
-            }
-          )
-        }
-      )
-    ] });
+                )
+              ] })
+            ]
+          }
+        )
+      }
+    ) });
   }
 );
 AlertDialog.displayName = "AlertDialog";

package/dist/AlertDialog/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/components/AlertDialog/AlertDialog.tsx","../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n ReactNode,\n useState,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n} from 'react';\nimport Button from '../Button/Button';\n\n/*\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'w-screen max-w-[324px]',\n small: 'w-screen max-w-[378px]',\n medium: 'w-screen max-w-[459px]',\n large: 'w-screen max-w-[578px]',\n 'extra-large': 'w-screen max-w-[912px]',\n} as const;\n\ninterface AlertDialogProps extends HTMLAttributes<HTMLDivElement> {\n /* Trigger element that opens the alert dialog /\n trigger: ReactNode;\n /* Title of the alert dialog /\n title: string;\n /* Whether the alert dialog is open (controlled mode) /\n isOpen?: boolean;\n /* Function called when the alert dialog should be opened (controlled mode) /\n onOpen?: () => void;\n /* Function called when the alert dialog should be closed (controlled mode) /\n onClose?: () => void;\n /* Whether clicking the backdrop should close the alert dialog /\n closeOnBackdropClick?: boolean;\n /* Whether pressing Escape should close the alert dialog /\n closeOnEscape?: boolean;\n /* Additional CSS classes for the alert dialog content /\n className?: string;\n /* Function called when submit button is clicked /\n onSubmit?: (value?: unknown) => void;\n /* Value to pass to onSubmit function /\n submitValue?: unknown;\n /* Function called when cancel button is clicked /\n onCancel?: (value?: unknown) => void;\n /* Value to pass to onCancel function /\n cancelValue?: unknown;\n /* Description of the alert dialog /\n description: string;\n /* Label of the cancel button /\n cancelButtonLabel?: string;\n /* Label of the submit button /\n submitButtonLabel?: string;\n /* Size of the alert dialog /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n}\n\nconst AlertDialog = forwardRef<HTMLDivElement, AlertDialogProps>(\n (\n {\n trigger,\n description,\n cancelButtonLabel = 'Cancelar',\n submitButtonLabel = 'Deletar',\n title,\n isOpen: controlledIsOpen,\n onOpen,\n onClose,\n closeOnBackdropClick = true,\n closeOnEscape = true,\n className = '',\n onSubmit,\n submitValue,\n onCancel,\n cancelValue,\n size = 'medium',\n ...props\n },\n ref\n ) => {\n // Internal state for uncontrolled mode\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n\n // Use controlled or uncontrolled state\n const isOpen = controlledIsOpen ?? internalIsOpen;\n const setIsOpen = (open: boolean) => {\n if (controlledIsOpen === undefined) {\n setInternalIsOpen(open);\n }\n if (open && onOpen) onOpen();\n if (!open && onClose) onClose();\n };\n\n // Handle escape key\n useEffect(() => {\n if (!isOpen \|\| !closeOnEscape) return;\n\n const handleEscape = (event: globalThis.KeyboardEvent) => {\n if (event.key === 'Escape') {\n setIsOpen(false);\n }\n };\n\n document.addEventListener('keydown', handleEscape);\n return () => document.removeEventListener('keydown', handleEscape);\n }, [isOpen, closeOnEscape]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = 'hidden';\n } else {\n document.body.style.overflow = 'unset';\n }\n\n return () => {\n document.body.style.overflow = 'unset';\n };\n }, [isOpen]);\n\n const handleBackdropClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === event.currentTarget && closeOnBackdropClick) {\n setIsOpen(false);\n }\n };\n\n const handleBackdropKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape' && closeOnEscape) {\n setIsOpen(false);\n }\n };\n\n const handleTriggerClick = () => {\n setIsOpen(true);\n };\n\n const handleSubmit = () => {\n setIsOpen(false);\n onSubmit?.(submitValue);\n };\n\n const handleCancel = () => {\n setIsOpen(false);\n onCancel?.(cancelValue);\n };\n\n const sizeClasses = SIZE_CLASSES[size];\n\n return (\n <>\n {/ Trigger /}\n <button\n onClick={handleTriggerClick}\n aria-label=\"Open dialog\"\n type=\"button\"\n className=\"border-none bg-transparent p-0 cursor-pointer\"\n >\n {trigger}\n </button>\n\n {/ Alert Dialog Overlay /}\n {isOpen && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm\"\n onClick={handleBackdropClick}\n onKeyDown={handleBackdropKeyDown}\n data-testid=\"alert-dialog-overlay\"\n >\n {/ Alert Dialog Content /}\n <div\n ref={ref}\n className={`bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`}\n {...props}\n >\n <h2\n id=\"alert-dialog-title\"\n className=\"pb-3 text-xl font-semibold\"\n >\n {title}\n </h2>\n <p\n id=\"alert-dialog-description\"\n className=\"text-text-700 text-sm\"\n >\n {description}\n </p>\n\n <div className=\"flex flex-row items-center justify-end pt-4 gap-3\">\n <Button variant=\"outline\" size=\"small\" onClick={handleCancel}>\n {cancelButtonLabel}\n </Button>\n\n <Button\n variant=\"solid\"\n size=\"small\"\n action=\"negative\"\n onClick={handleSubmit}\n >\n {submitButtonLabel}\n </Button>\n </div>\n </div>\n </div>\n )}\n </>\n );\n }\n);\n\nAlertDialog.displayName = 'AlertDialog';\n\nexport { AlertDialog };\n","import { ButtonHTMLAttributes, ReactNode } from 'react';\n\n/\n Lookup table for variant and action class combinations\n /\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n outline: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n link: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n} as const;\n\n/\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'text-xs px-3.5 py-2',\n small: 'text-sm px-4 py-2.5',\n medium: 'text-md px-5 py-2.5',\n large: 'text-lg px-6 py-3',\n 'extra-large': 'text-lg px-7 py-3.5',\n} as const;\n\n/\n Button component props interface\n /\ntype ButtonProps = {\n /* Content to be displayed inside the button /\n children: ReactNode;\n /* Ícone à esquerda do texto /\n iconLeft?: ReactNode;\n /* Ícone à direita do texto /\n iconRight?: ReactNode;\n /* Size of the button /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n /* Visual variant of the button /\n variant?: 'solid' \| 'outline' \| 'link';\n /* Action type of the button /\n action?: 'primary' \| 'positive' \| 'negative';\n /* Additional CSS classes to apply /\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/\n Button component for Analytica Ensino platforms\n \n A flexible button component with multiple variants, sizes and actions.\n \n @param children - The content to display inside the button\n * @param size - The size variant (extra-small, small, medium, large, extra-large)\n * @param variant - The visual style variant (solid, outline, link)\n * @param action - The action type (primary, positive, negative)\n * @param className - Additional CSS classes\n * @param props - All other standard button HTML attributes\n * @returns A styled button element\n \n @example\n * ```tsx\n * <Button variant=\"solid\" action=\"primary\" size=\"medium\" onClick={() => console.log('clicked')}>\n * Click me\n * </Button>\n * ```\n */\nconst Button = ({\n children,\n iconLeft,\n iconRight,\n size = 'medium',\n variant = 'solid',\n action = 'primary',\n className = '',\n disabled,\n type = 'button',\n ...props\n}: ButtonProps) => {\n // Get classes from lookup tables\n const sizeClasses = SIZE_CLASSES[size];\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n\n const baseClasses =\n 'inline-flex items-center justify-center rounded-full cursor-pointer font-medium';\n\n return (\n <button\n className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`}\n disabled={disabled}\n type={type}\n {...props}\n >\n {iconLeft && <span className=\"mr-2 flex items-center\">{iconLeft}</span>}\n {children}\n {iconRight && <span className=\"ml-2 flex items-center\">{iconRight}</span>}\n </button>\n );\n};\n\nexport default Button;\n"],"mappings":"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","names":["import_jsx_runtime","SIZE_CLASSES"]}
1	+ {"version":3,"sources":["../../src/components/AlertDialog/AlertDialog.tsx","../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n} from 'react';\nimport Button from '../Button/Button';\n\n/*\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'w-screen max-w-[324px]',\n small: 'w-screen max-w-[378px]',\n medium: 'w-screen max-w-[459px]',\n large: 'w-screen max-w-[578px]',\n 'extra-large': 'w-screen max-w-[912px]',\n} as const;\n\ninterface AlertDialogProps extends HTMLAttributes<HTMLDivElement> {\n /* Title of the alert dialog /\n title: string;\n /* Whether the alert dialog is open (controlled mode) /\n isOpen: boolean;\n /* Function called when the alert dialog is opened or closed (controlled mode) /\n onChangeOpen: (open: boolean) => void;\n /* Whether clicking the backdrop should close the alert dialog /\n closeOnBackdropClick?: boolean;\n /* Whether pressing Escape should close the alert dialog /\n closeOnEscape?: boolean;\n /* Additional CSS classes for the alert dialog content /\n className?: string;\n /* Function called when submit button is clicked /\n onSubmit?: (value?: unknown) => void;\n /* Value to pass to onSubmit function /\n submitValue?: unknown;\n /* Function called when cancel button is clicked /\n onCancel?: (value?: unknown) => void;\n /* Value to pass to onCancel function /\n cancelValue?: unknown;\n /* Description of the alert dialog /\n description: string;\n /* Label of the cancel button /\n cancelButtonLabel?: string;\n /* Label of the submit button /\n submitButtonLabel?: string;\n /* Size of the alert dialog /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n}\n\nconst AlertDialog = forwardRef<HTMLDivElement, AlertDialogProps>(\n (\n {\n description,\n cancelButtonLabel = 'Cancelar',\n submitButtonLabel = 'Deletar',\n title,\n isOpen,\n closeOnBackdropClick = true,\n closeOnEscape = true,\n className = '',\n onSubmit,\n onChangeOpen,\n submitValue,\n onCancel,\n cancelValue,\n size = 'medium',\n ...props\n },\n ref\n ) => {\n // Handle escape key\n useEffect(() => {\n if (!isOpen \|\| !closeOnEscape) return;\n\n const handleEscape = (event: globalThis.KeyboardEvent) => {\n if (event.key === 'Escape') {\n onChangeOpen(false);\n }\n };\n\n document.addEventListener('keydown', handleEscape);\n return () => document.removeEventListener('keydown', handleEscape);\n }, [isOpen, closeOnEscape]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = 'hidden';\n } else {\n document.body.style.overflow = 'unset';\n }\n\n return () => {\n document.body.style.overflow = 'unset';\n };\n }, [isOpen]);\n\n const handleBackdropClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === event.currentTarget && closeOnBackdropClick) {\n onChangeOpen(false);\n }\n };\n\n const handleBackdropKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape' && closeOnEscape) {\n onChangeOpen(false);\n }\n };\n\n const handleSubmit = () => {\n onChangeOpen(false);\n onSubmit?.(submitValue);\n };\n\n const handleCancel = () => {\n onChangeOpen(false);\n onCancel?.(cancelValue);\n };\n\n const sizeClasses = SIZE_CLASSES[size];\n\n return (\n <>\n {/ Alert Dialog Overlay /}\n {isOpen && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm\"\n onClick={handleBackdropClick}\n onKeyDown={handleBackdropKeyDown}\n data-testid=\"alert-dialog-overlay\"\n >\n {/ Alert Dialog Content /}\n <div\n ref={ref}\n className={`bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`}\n {...props}\n >\n <h2\n id=\"alert-dialog-title\"\n className=\"pb-3 text-xl font-semibold\"\n >\n {title}\n </h2>\n <p\n id=\"alert-dialog-description\"\n className=\"text-text-700 text-sm\"\n >\n {description}\n </p>\n\n <div className=\"flex flex-row items-center justify-end pt-4 gap-3\">\n <Button variant=\"outline\" size=\"small\" onClick={handleCancel}>\n {cancelButtonLabel}\n </Button>\n\n <Button\n variant=\"solid\"\n size=\"small\"\n action=\"negative\"\n onClick={handleSubmit}\n >\n {submitButtonLabel}\n </Button>\n </div>\n </div>\n </div>\n )}\n </>\n );\n }\n);\n\nAlertDialog.displayName = 'AlertDialog';\n\nexport { AlertDialog };\n","import { ButtonHTMLAttributes, ReactNode } from 'react';\n\n/\n Lookup table for variant and action class combinations\n /\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n outline: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n link: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n} as const;\n\n/\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'text-xs px-3.5 py-2',\n small: 'text-sm px-4 py-2.5',\n medium: 'text-md px-5 py-2.5',\n large: 'text-lg px-6 py-3',\n 'extra-large': 'text-lg px-7 py-3.5',\n} as const;\n\n/\n Button component props interface\n /\ntype ButtonProps = {\n /* Content to be displayed inside the button /\n children: ReactNode;\n /* Ícone à esquerda do texto /\n iconLeft?: ReactNode;\n /* Ícone à direita do texto /\n iconRight?: ReactNode;\n /* Size of the button /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n /* Visual variant of the button /\n variant?: 'solid' \| 'outline' \| 'link';\n /* Action type of the button /\n action?: 'primary' \| 'positive' \| 'negative';\n /* Additional CSS classes to apply /\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/\n Button component for Analytica Ensino platforms\n \n A flexible button component with multiple variants, sizes and actions.\n \n @param children - The content to display inside the button\n * @param size - The size variant (extra-small, small, medium, large, extra-large)\n * @param variant - The visual style variant (solid, outline, link)\n * @param action - The action type (primary, positive, negative)\n * @param className - Additional CSS classes\n * @param props - All other standard button HTML attributes\n * @returns A styled button element\n \n @example\n * ```tsx\n * <Button variant=\"solid\" action=\"primary\" size=\"medium\" onClick={() => console.log('clicked')}>\n * Click me\n * </Button>\n * ```\n */\nconst Button = ({\n children,\n iconLeft,\n iconRight,\n size = 'medium',\n variant = 'solid',\n action = 'primary',\n className = '',\n disabled,\n type = 'button',\n ...props\n}: ButtonProps) => {\n // Get classes from lookup tables\n const sizeClasses = SIZE_CLASSES[size];\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n\n const baseClasses =\n 'inline-flex items-center justify-center rounded-full cursor-pointer font-medium';\n\n return (\n <button\n className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`}\n disabled={disabled}\n type={type}\n {...props}\n >\n {iconLeft && <span className=\"mr-2 flex items-center\">{iconLeft}</span>}\n {children}\n {iconRight && <span className=\"ml-2 flex items-center\">{iconRight}</span>}\n </button>\n );\n};\n\nexport default Button;\n"],"mappings":"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","names":["import_jsx_runtime","SIZE_CLASSES"]}

package/dist/AlertDialog/index.mjs CHANGED Viewed

@@ -1,7 +1,6 @@
 // src/components/AlertDialog/AlertDialog.tsx
 import {
   forwardRef,
-  useState,
   useEffect
 } from "react";
@@ -74,38 +73,27 @@ var SIZE_CLASSES2 = {
 };
 var AlertDialog = forwardRef(
   ({
-    trigger,
     description,
     cancelButtonLabel = "Cancelar",
     submitButtonLabel = "Deletar",
     title,
-    isOpen: controlledIsOpen,
-    onOpen,
-    onClose,
+    isOpen,
     closeOnBackdropClick = true,
     closeOnEscape = true,
     className = "",
     onSubmit,
+    onChangeOpen,
     submitValue,
     onCancel,
     cancelValue,
     size = "medium",
     ...props
   }, ref) => {
-    const [internalIsOpen, setInternalIsOpen] = useState(false);
-    const isOpen = controlledIsOpen ?? internalIsOpen;
-    const setIsOpen = (open) => {
-      if (controlledIsOpen === void 0) {
-        setInternalIsOpen(open);
-      }
-      if (open && onOpen) onOpen();
-      if (!open && onClose) onClose();
-    };
     useEffect(() => {
       if (!isOpen || !closeOnEscape) return;
       const handleEscape = (event) => {
         if (event.key === "Escape") {
-          setIsOpen(false);
+          onChangeOpen(false);
         }
       };
       document.addEventListener("keydown", handleEscape);
@@ -123,86 +111,71 @@ var AlertDialog = forwardRef(
     }, [isOpen]);
     const handleBackdropClick = (event) => {
       if (event.target === event.currentTarget && closeOnBackdropClick) {
-        setIsOpen(false);
+        onChangeOpen(false);
       }
     };
     const handleBackdropKeyDown = (event) => {
       if (event.key === "Escape" && closeOnEscape) {
-        setIsOpen(false);
+        onChangeOpen(false);
       }
     };
-    const handleTriggerClick = () => {
-      setIsOpen(true);
-    };
     const handleSubmit = () => {
-      setIsOpen(false);
+      onChangeOpen(false);
       onSubmit?.(submitValue);
     };
     const handleCancel = () => {
-      setIsOpen(false);
+      onChangeOpen(false);
       onCancel?.(cancelValue);
     };
     const sizeClasses = SIZE_CLASSES2[size];
-    return /* @__PURE__ */ jsxs2(Fragment, { children: [
-      /* @__PURE__ */ jsx2(
-        "button",
-        {
-          onClick: handleTriggerClick,
-          "aria-label": "Open dialog",
-          type: "button",
-          className: "border-none bg-transparent p-0 cursor-pointer",
-          children: trigger
-        }
-      ),
-      isOpen && /* @__PURE__ */ jsx2(
-        "div",
-        {
-          className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",
-          onClick: handleBackdropClick,
-          onKeyDown: handleBackdropKeyDown,
-          "data-testid": "alert-dialog-overlay",
-          children: /* @__PURE__ */ jsxs2(
-            "div",
-            {
-              ref,
-              className: `bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`,
-              ...props,
-              children: [
+    return /* @__PURE__ */ jsx2(Fragment, { children: isOpen && /* @__PURE__ */ jsx2(
+      "div",
+      {
+        className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm",
+        onClick: handleBackdropClick,
+        onKeyDown: handleBackdropKeyDown,
+        "data-testid": "alert-dialog-overlay",
+        children: /* @__PURE__ */ jsxs2(
+          "div",
+          {
+            ref,
+            className: `bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`,
+            ...props,
+            children: [
+              /* @__PURE__ */ jsx2(
+                "h2",
+                {
+                  id: "alert-dialog-title",
+                  className: "pb-3 text-xl font-semibold",
+                  children: title
+                }
+              ),
+              /* @__PURE__ */ jsx2(
+                "p",
+                {
+                  id: "alert-dialog-description",
+                  className: "text-text-700 text-sm",
+                  children: description
+                }
+              ),
+              /* @__PURE__ */ jsxs2("div", { className: "flex flex-row items-center justify-end pt-4 gap-3", children: [
+                /* @__PURE__ */ jsx2(Button_default, { variant: "outline", size: "small", onClick: handleCancel, children: cancelButtonLabel }),
                 /* @__PURE__ */ jsx2(
-                  "h2",
+                  Button_default,
                   {
-                    id: "alert-dialog-title",
-                    className: "pb-3 text-xl font-semibold",
-                    children: title
+                    variant: "solid",
+                    size: "small",
+                    action: "negative",
+                    onClick: handleSubmit,
+                    children: submitButtonLabel
                   }
-                ),
-                /* @__PURE__ */ jsx2(
-                  "p",
-                  {
-                    id: "alert-dialog-description",
-                    className: "text-text-700 text-sm",
-                    children: description
-                  }
-                ),
-                /* @__PURE__ */ jsxs2("div", { className: "flex flex-row items-center justify-end pt-4 gap-3", children: [
-                  /* @__PURE__ */ jsx2(Button_default, { variant: "outline", size: "small", onClick: handleCancel, children: cancelButtonLabel }),
-                  /* @__PURE__ */ jsx2(
-                    Button_default,
-                    {
-                      variant: "solid",
-                      size: "small",
-                      action: "negative",
-                      onClick: handleSubmit,
-                      children: submitButtonLabel
-                    }
-                  )
-                ] })
-              ]
-            }
-          )
-        }
-      )
-    ] });
+                )
+              ] })
+            ]
+          }
+        )
+      }
+    ) });
   }
 );
 AlertDialog.displayName = "AlertDialog";

package/dist/AlertDialog/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/components/AlertDialog/AlertDialog.tsx","../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n ReactNode,\n useState,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n} from 'react';\nimport Button from '../Button/Button';\n\n/*\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'w-screen max-w-[324px]',\n small: 'w-screen max-w-[378px]',\n medium: 'w-screen max-w-[459px]',\n large: 'w-screen max-w-[578px]',\n 'extra-large': 'w-screen max-w-[912px]',\n} as const;\n\ninterface AlertDialogProps extends HTMLAttributes<HTMLDivElement> {\n /* Trigger element that opens the alert dialog /\n trigger: ReactNode;\n /* Title of the alert dialog /\n title: string;\n /* Whether the alert dialog is open (controlled mode) /\n isOpen?: boolean;\n /* Function called when the alert dialog should be opened (controlled mode) /\n onOpen?: () => void;\n /* Function called when the alert dialog should be closed (controlled mode) /\n onClose?: () => void;\n /* Whether clicking the backdrop should close the alert dialog /\n closeOnBackdropClick?: boolean;\n /* Whether pressing Escape should close the alert dialog /\n closeOnEscape?: boolean;\n /* Additional CSS classes for the alert dialog content /\n className?: string;\n /* Function called when submit button is clicked /\n onSubmit?: (value?: unknown) => void;\n /* Value to pass to onSubmit function /\n submitValue?: unknown;\n /* Function called when cancel button is clicked /\n onCancel?: (value?: unknown) => void;\n /* Value to pass to onCancel function /\n cancelValue?: unknown;\n /* Description of the alert dialog /\n description: string;\n /* Label of the cancel button /\n cancelButtonLabel?: string;\n /* Label of the submit button /\n submitButtonLabel?: string;\n /* Size of the alert dialog /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n}\n\nconst AlertDialog = forwardRef<HTMLDivElement, AlertDialogProps>(\n (\n {\n trigger,\n description,\n cancelButtonLabel = 'Cancelar',\n submitButtonLabel = 'Deletar',\n title,\n isOpen: controlledIsOpen,\n onOpen,\n onClose,\n closeOnBackdropClick = true,\n closeOnEscape = true,\n className = '',\n onSubmit,\n submitValue,\n onCancel,\n cancelValue,\n size = 'medium',\n ...props\n },\n ref\n ) => {\n // Internal state for uncontrolled mode\n const [internalIsOpen, setInternalIsOpen] = useState(false);\n\n // Use controlled or uncontrolled state\n const isOpen = controlledIsOpen ?? internalIsOpen;\n const setIsOpen = (open: boolean) => {\n if (controlledIsOpen === undefined) {\n setInternalIsOpen(open);\n }\n if (open && onOpen) onOpen();\n if (!open && onClose) onClose();\n };\n\n // Handle escape key\n useEffect(() => {\n if (!isOpen \|\| !closeOnEscape) return;\n\n const handleEscape = (event: globalThis.KeyboardEvent) => {\n if (event.key === 'Escape') {\n setIsOpen(false);\n }\n };\n\n document.addEventListener('keydown', handleEscape);\n return () => document.removeEventListener('keydown', handleEscape);\n }, [isOpen, closeOnEscape]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = 'hidden';\n } else {\n document.body.style.overflow = 'unset';\n }\n\n return () => {\n document.body.style.overflow = 'unset';\n };\n }, [isOpen]);\n\n const handleBackdropClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === event.currentTarget && closeOnBackdropClick) {\n setIsOpen(false);\n }\n };\n\n const handleBackdropKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape' && closeOnEscape) {\n setIsOpen(false);\n }\n };\n\n const handleTriggerClick = () => {\n setIsOpen(true);\n };\n\n const handleSubmit = () => {\n setIsOpen(false);\n onSubmit?.(submitValue);\n };\n\n const handleCancel = () => {\n setIsOpen(false);\n onCancel?.(cancelValue);\n };\n\n const sizeClasses = SIZE_CLASSES[size];\n\n return (\n <>\n {/ Trigger /}\n <button\n onClick={handleTriggerClick}\n aria-label=\"Open dialog\"\n type=\"button\"\n className=\"border-none bg-transparent p-0 cursor-pointer\"\n >\n {trigger}\n </button>\n\n {/ Alert Dialog Overlay /}\n {isOpen && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm\"\n onClick={handleBackdropClick}\n onKeyDown={handleBackdropKeyDown}\n data-testid=\"alert-dialog-overlay\"\n >\n {/ Alert Dialog Content /}\n <div\n ref={ref}\n className={`bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`}\n {...props}\n >\n <h2\n id=\"alert-dialog-title\"\n className=\"pb-3 text-xl font-semibold\"\n >\n {title}\n </h2>\n <p\n id=\"alert-dialog-description\"\n className=\"text-text-700 text-sm\"\n >\n {description}\n </p>\n\n <div className=\"flex flex-row items-center justify-end pt-4 gap-3\">\n <Button variant=\"outline\" size=\"small\" onClick={handleCancel}>\n {cancelButtonLabel}\n </Button>\n\n <Button\n variant=\"solid\"\n size=\"small\"\n action=\"negative\"\n onClick={handleSubmit}\n >\n {submitButtonLabel}\n </Button>\n </div>\n </div>\n </div>\n )}\n </>\n );\n }\n);\n\nAlertDialog.displayName = 'AlertDialog';\n\nexport { AlertDialog };\n","import { ButtonHTMLAttributes, ReactNode } from 'react';\n\n/\n Lookup table for variant and action class combinations\n /\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n outline: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n link: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n} as const;\n\n/\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'text-xs px-3.5 py-2',\n small: 'text-sm px-4 py-2.5',\n medium: 'text-md px-5 py-2.5',\n large: 'text-lg px-6 py-3',\n 'extra-large': 'text-lg px-7 py-3.5',\n} as const;\n\n/\n Button component props interface\n /\ntype ButtonProps = {\n /* Content to be displayed inside the button /\n children: ReactNode;\n /* Ícone à esquerda do texto /\n iconLeft?: ReactNode;\n /* Ícone à direita do texto /\n iconRight?: ReactNode;\n /* Size of the button /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n /* Visual variant of the button /\n variant?: 'solid' \| 'outline' \| 'link';\n /* Action type of the button /\n action?: 'primary' \| 'positive' \| 'negative';\n /* Additional CSS classes to apply /\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/\n Button component for Analytica Ensino platforms\n \n A flexible button component with multiple variants, sizes and actions.\n \n @param children - The content to display inside the button\n * @param size - The size variant (extra-small, small, medium, large, extra-large)\n * @param variant - The visual style variant (solid, outline, link)\n * @param action - The action type (primary, positive, negative)\n * @param className - Additional CSS classes\n * @param props - All other standard button HTML attributes\n * @returns A styled button element\n \n @example\n * ```tsx\n * <Button variant=\"solid\" action=\"primary\" size=\"medium\" onClick={() => console.log('clicked')}>\n * Click me\n * </Button>\n * ```\n */\nconst Button = ({\n children,\n iconLeft,\n iconRight,\n size = 'medium',\n variant = 'solid',\n action = 'primary',\n className = '',\n disabled,\n type = 'button',\n ...props\n}: ButtonProps) => {\n // Get classes from lookup tables\n const sizeClasses = SIZE_CLASSES[size];\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n\n const baseClasses =\n 'inline-flex items-center justify-center rounded-full cursor-pointer font-medium';\n\n return (\n <button\n className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`}\n disabled={disabled}\n type={type}\n {...props}\n >\n {iconLeft && <span className=\"mr-2 flex items-center\">{iconLeft}</span>}\n {children}\n {iconRight && <span className=\"ml-2 flex items-center\">{iconRight}</span>}\n </button>\n );\n};\n\nexport default Button;\n"],"mappings":"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","names":["jsx","jsxs","SIZE_CLASSES"]}
1	+ {"version":3,"sources":["../../src/components/AlertDialog/AlertDialog.tsx","../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n} from 'react';\nimport Button from '../Button/Button';\n\n/*\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'w-screen max-w-[324px]',\n small: 'w-screen max-w-[378px]',\n medium: 'w-screen max-w-[459px]',\n large: 'w-screen max-w-[578px]',\n 'extra-large': 'w-screen max-w-[912px]',\n} as const;\n\ninterface AlertDialogProps extends HTMLAttributes<HTMLDivElement> {\n /* Title of the alert dialog /\n title: string;\n /* Whether the alert dialog is open (controlled mode) /\n isOpen: boolean;\n /* Function called when the alert dialog is opened or closed (controlled mode) /\n onChangeOpen: (open: boolean) => void;\n /* Whether clicking the backdrop should close the alert dialog /\n closeOnBackdropClick?: boolean;\n /* Whether pressing Escape should close the alert dialog /\n closeOnEscape?: boolean;\n /* Additional CSS classes for the alert dialog content /\n className?: string;\n /* Function called when submit button is clicked /\n onSubmit?: (value?: unknown) => void;\n /* Value to pass to onSubmit function /\n submitValue?: unknown;\n /* Function called when cancel button is clicked /\n onCancel?: (value?: unknown) => void;\n /* Value to pass to onCancel function /\n cancelValue?: unknown;\n /* Description of the alert dialog /\n description: string;\n /* Label of the cancel button /\n cancelButtonLabel?: string;\n /* Label of the submit button /\n submitButtonLabel?: string;\n /* Size of the alert dialog /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n}\n\nconst AlertDialog = forwardRef<HTMLDivElement, AlertDialogProps>(\n (\n {\n description,\n cancelButtonLabel = 'Cancelar',\n submitButtonLabel = 'Deletar',\n title,\n isOpen,\n closeOnBackdropClick = true,\n closeOnEscape = true,\n className = '',\n onSubmit,\n onChangeOpen,\n submitValue,\n onCancel,\n cancelValue,\n size = 'medium',\n ...props\n },\n ref\n ) => {\n // Handle escape key\n useEffect(() => {\n if (!isOpen \|\| !closeOnEscape) return;\n\n const handleEscape = (event: globalThis.KeyboardEvent) => {\n if (event.key === 'Escape') {\n onChangeOpen(false);\n }\n };\n\n document.addEventListener('keydown', handleEscape);\n return () => document.removeEventListener('keydown', handleEscape);\n }, [isOpen, closeOnEscape]);\n\n // Prevent body scroll when modal is open\n useEffect(() => {\n if (isOpen) {\n document.body.style.overflow = 'hidden';\n } else {\n document.body.style.overflow = 'unset';\n }\n\n return () => {\n document.body.style.overflow = 'unset';\n };\n }, [isOpen]);\n\n const handleBackdropClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === event.currentTarget && closeOnBackdropClick) {\n onChangeOpen(false);\n }\n };\n\n const handleBackdropKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Escape' && closeOnEscape) {\n onChangeOpen(false);\n }\n };\n\n const handleSubmit = () => {\n onChangeOpen(false);\n onSubmit?.(submitValue);\n };\n\n const handleCancel = () => {\n onChangeOpen(false);\n onCancel?.(cancelValue);\n };\n\n const sizeClasses = SIZE_CLASSES[size];\n\n return (\n <>\n {/ Alert Dialog Overlay /}\n {isOpen && (\n <div\n className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm\"\n onClick={handleBackdropClick}\n onKeyDown={handleBackdropKeyDown}\n data-testid=\"alert-dialog-overlay\"\n >\n {/ Alert Dialog Content /}\n <div\n ref={ref}\n className={`bg-background border border-border-100 rounded-lg shadow-lg p-6 m-3 ${sizeClasses} ${className}`}\n {...props}\n >\n <h2\n id=\"alert-dialog-title\"\n className=\"pb-3 text-xl font-semibold\"\n >\n {title}\n </h2>\n <p\n id=\"alert-dialog-description\"\n className=\"text-text-700 text-sm\"\n >\n {description}\n </p>\n\n <div className=\"flex flex-row items-center justify-end pt-4 gap-3\">\n <Button variant=\"outline\" size=\"small\" onClick={handleCancel}>\n {cancelButtonLabel}\n </Button>\n\n <Button\n variant=\"solid\"\n size=\"small\"\n action=\"negative\"\n onClick={handleSubmit}\n >\n {submitButtonLabel}\n </Button>\n </div>\n </div>\n </div>\n )}\n </>\n );\n }\n);\n\nAlertDialog.displayName = 'AlertDialog';\n\nexport { AlertDialog };\n","import { ButtonHTMLAttributes, ReactNode } from 'react';\n\n/\n Lookup table for variant and action class combinations\n /\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n outline: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n link: {\n primary:\n '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',\n positive:\n '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',\n negative:\n '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',\n },\n} as const;\n\n/\n Lookup table for size classes\n /\nconst SIZE_CLASSES = {\n 'extra-small': 'text-xs px-3.5 py-2',\n small: 'text-sm px-4 py-2.5',\n medium: 'text-md px-5 py-2.5',\n large: 'text-lg px-6 py-3',\n 'extra-large': 'text-lg px-7 py-3.5',\n} as const;\n\n/\n Button component props interface\n /\ntype ButtonProps = {\n /* Content to be displayed inside the button /\n children: ReactNode;\n /* Ícone à esquerda do texto /\n iconLeft?: ReactNode;\n /* Ícone à direita do texto /\n iconRight?: ReactNode;\n /* Size of the button /\n size?: 'extra-small' \| 'small' \| 'medium' \| 'large' \| 'extra-large';\n /* Visual variant of the button /\n variant?: 'solid' \| 'outline' \| 'link';\n /* Action type of the button /\n action?: 'primary' \| 'positive' \| 'negative';\n /* Additional CSS classes to apply /\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/\n Button component for Analytica Ensino platforms\n \n A flexible button component with multiple variants, sizes and actions.\n \n @param children - The content to display inside the button\n * @param size - The size variant (extra-small, small, medium, large, extra-large)\n * @param variant - The visual style variant (solid, outline, link)\n * @param action - The action type (primary, positive, negative)\n * @param className - Additional CSS classes\n * @param props - All other standard button HTML attributes\n * @returns A styled button element\n \n @example\n * ```tsx\n * <Button variant=\"solid\" action=\"primary\" size=\"medium\" onClick={() => console.log('clicked')}>\n * Click me\n * </Button>\n * ```\n */\nconst Button = ({\n children,\n iconLeft,\n iconRight,\n size = 'medium',\n variant = 'solid',\n action = 'primary',\n className = '',\n disabled,\n type = 'button',\n ...props\n}: ButtonProps) => {\n // Get classes from lookup tables\n const sizeClasses = SIZE_CLASSES[size];\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n\n const baseClasses =\n 'inline-flex items-center justify-center rounded-full cursor-pointer font-medium';\n\n return (\n <button\n className={`${baseClasses} ${variantClasses} ${sizeClasses} ${className}`}\n disabled={disabled}\n type={type}\n {...props}\n >\n {iconLeft && <span className=\"mr-2 flex items-center\">{iconLeft}</span>}\n {children}\n {iconRight && <span className=\"ml-2 flex items-center\">{iconRight}</span>}\n </button>\n );\n};\n\nexport default Button;\n"],"mappings":"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","names":["jsx","jsxs","SIZE_CLASSES"]}

package/dist/Alternative/index.js CHANGED Viewed

@@ -545,6 +545,7 @@ var AlternativesList = ({
 }) => {
   const uniqueId = (0, import_react2.useId)();
   const groupName = name || `alternatives-${uniqueId}`;
+  const [actualValue, setActualValue] = (0, import_react2.useState)(value);
   const isReadonly = mode === "readonly";
   const getStatusStyles = (status, isReadonly2) => {
     const hoverClass = isReadonly2 ? "" : "hover:bg-background-50";
@@ -603,7 +604,13 @@ var AlternativesList = ({
             /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-start gap-3 flex-1", children: [
               /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-1", children: renderRadio() }),
               /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex-1", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "block font-medium text-text-950", children: alternative.label }),
+                /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                  "p",
+                  {
+                    className: `block font-medium ${selectedValue === alternative.value || statusBadge ? "text-primary-950" : "text-text-600"}`,
+                    children: alternative.label
+                  }
+                ),
                 alternative.description && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-text-600 mt-1", children: alternative.description })
               ] })
             ] }),
@@ -620,7 +627,13 @@ var AlternativesList = ({
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-2 flex-1", children: [
             renderRadio(),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex-1", children: alternative.label })
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+              "span",
+              {
+                className: `flex-1 ${selectedValue === alternative.value || statusBadge ? "text-primary-950" : "text-text-600"}`,
+                children: alternative.label
+              }
+            )
           ] }),
           statusBadge && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex-shrink-0", children: statusBadge })
         ]
@@ -645,7 +658,10 @@ var AlternativesList = ({
       name: groupName,
       defaultValue,
       value,
-      onValueChange,
+      onValueChange: (value2) => {
+        setActualValue(value2);
+        onValueChange?.(value2);
+      },
       disabled,
       className: `flex flex-col ${getLayoutClasses()} ${className}`,
       children: alternatives.map((alternative, index) => {
@@ -673,7 +689,9 @@ var AlternativesList = ({
                       "label",
                       {
                         htmlFor: alternativeId,
-                        className: `block font-medium text-text-950 ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
+                        className: `block font-medium
+                        ${actualValue === alternative.value ? "text-primary-950" : "text-text-600"}
+                        ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
                         children: alternative.label
                       }
                     ),
@@ -704,7 +722,9 @@ var AlternativesList = ({
                   "label",
                   {
                     htmlFor: alternativeId,
-                    className: `flex-1 ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
+                    className: `flex-1
+                  ${actualValue === alternative.value ? "text-primary-950" : "text-text-600"}
+                  ${alternative.disabled ? "cursor-not-allowed" : "cursor-pointer"}`,
                     children: alternative.label
                   }
                 )