@mks2508/mks-ui 0.1.0

package/dist/components/ui/badge/badge.styles.js

@@ -0,0 +1,39 @@
+import { cva } from "class-variance-authority";
+/**
+ * Variantes de estilo para el componente Badge usando CVA (Class Variance Authority).
+ *
+ * Define las combinaciones de variantes visuales soportadas:
+ * - variant: default, secondary, destructive, outline
+ * - size: default, sm, lg
+ *
+ * @see {@link https://cva.style/docs/getting-started/variants}
+ */
+export const badgeVariants = cva("inline-flex items-center justify-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", {
+    variants: {
+        variant: {
+            default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+            secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+            outline: "text-foreground",
+        },
+        size: {
+            default: "h-6 px-2.5 py-0.5",
+            sm: "h-5 px-2 text-[10px]",
+            lg: "h-7 px-3 text-sm",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+/**
+ * Estilos estáticos para el componente Badge.
+ *
+ * Útil cuando se necesitan clases específicas fuera del sistema de variantes.
+ */
+export const badgeStyles = {
+    base: "inline-flex items-center justify-center rounded-full border font-semibold transition-colors",
+    focus: "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+};
+//# sourceMappingURL=badge.styles.js.map

package/dist/components/ui/badge/badge.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.styles.js","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAC9B,uLAAuL,EACvL;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,2EAA2E;YAC7E,SAAS,EACP,iFAAiF;YACnF,WAAW,EACT,uFAAuF;YACzF,OAAO,EAAE,iBAAiB;SAC3B;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,mBAAmB;YAC5B,EAAE,EAAE,sBAAsB;YAC1B,EAAE,EAAE,kBAAkB;SACvB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE,6FAA6F;IACnG,KAAK,EAAE,qEAAqE;CAC7E,CAAC"}

package/dist/components/ui/badge/badge.types.d.ts

@@ -0,0 +1,38 @@
+import type { VariantProps } from "class-variance-authority";
+/**
+ * Props para el componente Badge.
+ *
+ * @interface IBadgeProps
+ * @extends React.HTMLAttributes<HTMLDivElement>
+ * @extends VariantProps<typeof badgeVariants>
+ *
+ * @example
+ * ```tsx
+ * // Badge por defecto
+ * <Badge>Nuevo</Badge>
+ *
+ * // Badge con variante destructiva
+ * <Badge variant="destructive">Error</Badge>
+ *
+ * // Badge con tamaño pequeño
+ * <Badge size="sm">Mini</Badge>
+ *
+ * // Badge con variante outline
+ * <Badge variant="outline">Borrador</Badge>
+ * ```
+ */
+export interface IBadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof import("./badge.styles").badgeVariants> {
+}
+/**
+ * Variantes disponibles para el componente Badge.
+ *
+ * @type BadgeVariant
+ */
+export type BadgeVariant = "default" | "secondary" | "destructive" | "outline";
+/**
+ * Tamaños disponibles para el componente Badge.
+ *
+ * @type BadgeSize
+ */
+export type BadgeSize = "default" | "sm" | "lg";
+//# sourceMappingURL=badge.types.d.ts.map

package/dist/components/ui/badge/badge.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,cAAc,gBAAgB,EAAE,aAAa,CAAC;CAAG;AAElE;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,WAAW,GAAG,aAAa,GAAG,SAAS,CAAC;AAE/E;;;;GAIG;AACH,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,CAAC"}

package/dist/components/ui/badge/badge.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=badge.types.js.map

package/dist/components/ui/badge/badge.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.types.js","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.types.ts"],"names":[],"mappings":""}

package/dist/components/ui/badge/index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Badge component barrel export
+ *
+ * @module @mks2508/mks-ui/components/ui/badge
+ */
+export { Badge, badgeVariants } from "./badge";
+export type { IBadgeProps, BadgeVariant, BadgeSize } from "./badge.types";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC/C,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/ui/badge/index.js

@@ -0,0 +1,7 @@
+/**
+ * Badge component barrel export
+ *
+ * @module @mks2508/mks-ui/components/ui/badge
+ */
+export { Badge, badgeVariants } from "./badge";
+//# sourceMappingURL=index.js.map

package/dist/components/ui/badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/badge/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC"}

package/dist/components/ui/button/button.d.ts

@@ -0,0 +1,79 @@
+import type { IButtonProps } from "./button.types";
+/**
+ * Componente Button basado en Base UI.
+ *
+ * Un componente de botón que puede renderizarse como otra etiqueta
+ * o mantenerse enfocable cuando está deshabilitado.
+ *
+ * Características:
+ * - Soporte para múltiples variantes de estilo (default, secondary, destructive, outline, ghost, link, success, warning)
+ * - Múltiples tamaños (default, sm, lg, icon)
+ * - Patrón asChild para composición con otros elementos
+ * - Renderizado flexible con la prop `render`
+ * - Estados accesibles (disabled, pressed)
+ * - Clases y estilos dinámicos basados en estado
+ *
+ * @param props - Props del componente incluyendo variantes de estilo y comportamiento
+ * @returns Elemento button renderizado (o elemento personalizado si se usa `asChild` o `render`)
+ *
+ * @example
+ * ```tsx
+ * import { Button } from "@/components/ui/button";
+ *
+ * function Example() {
+ *   return (
+ *     <div className="flex gap-2">
+ *       <Button>Default</Button>
+ *       <Button variant="secondary">Secondary</Button>
+ *       <Button variant="destructive">Delete</Button>
+ *       <Button variant="success">Saved</Button>
+ *       <Button variant="warning">Warning</Button>
+ *       <Button variant="outline">Outline</Button>
+ *       <Button variant="ghost">Ghost</Button>
+ *       <Button variant="link">Link</Button>
+ *       <Button size="sm">Small</Button>
+ *       <Button size="lg">Large</Button>
+ *       <Button size="icon">
+ *         <Icon />
+ *       </Button>
+ *       <Button disabled>Disabled</Button>
+ *       <Button disabled focusableWhenDisabled>
+ *         Loading...
+ *       </Button>
+ *       <Button asChild>
+ *         <a href="/link">Link Button</a>
+ *       </Button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Button con renderizado personalizado
+ * <Button render={<div />} nativeButton={false}>
+ *   Custom container
+ * </Button>
+ *
+ * // Button con clases dinámicas basadas en estado
+ * <Button
+ *   className={(state) =>
+ *     cn(
+ *       "transition-transform",
+ *       state.pressed && "scale-95"
+ *     )
+ *   }
+ * >
+ *   Press me
+ * </Button>
+ * ```
+ *
+ * @see {@link IButtonProps}
+ * @see {@link buttonVariants}
+ * @see {@link https://base-ui.com/react/components/button}
+ */
+declare function Button({ className, variant, size, focusableWhenDisabled, nativeButton, asChild, render, style, children, disabled, onPointerDown, onPointerUp, onPointerLeave, ...props }: IButtonProps): import("react/jsx-runtime").JSX.Element;
+export { Button };
+export { buttonVariants, buttonStateStyles } from "./button.styles";
+export type { IButtonProps, IButtonState, ButtonVariant, ButtonSize, } from "./button.types";
+//# sourceMappingURL=button.d.ts.map

package/dist/components/ui/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/button.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,YAAY,EAAgB,MAAM,gBAAgB,CAAC;AAmBjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,qBAAqB,EACrB,YAAY,EACZ,OAAe,EACf,MAAM,EACN,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,aAAa,EACb,WAAW,EACX,cAAc,EACd,GAAG,KAAK,EACT,EAAE,YAAY,2CAqFd;AAED,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACpE,YAAY,EACV,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,UAAU,GACX,MAAM,gBAAgB,CAAC"}

package/dist/components/ui/button/button.js

@@ -0,0 +1,121 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Button as ButtonPrimitive } from "@base-ui/react/button";
+import { cn } from "@/lib/utils";
+import { buttonVariants, buttonStateStyles } from "./button.styles";
+/**
+ * Slot component para el patrón asChild.
+ * Permite componer el botón con otro elemento pasando todas las props y handlers.
+ */
+function Slot({ children, ...props }) {
+    const child = React.Children.only(children);
+    return React.cloneElement(child, {
+        ...props,
+        ...child.props,
+        className: cn(props.className, child.props.className),
+        style: { ...props.style, ...child.props.style },
+    });
+}
+/**
+ * Componente Button basado en Base UI.
+ *
+ * Un componente de botón que puede renderizarse como otra etiqueta
+ * o mantenerse enfocable cuando está deshabilitado.
+ *
+ * Características:
+ * - Soporte para múltiples variantes de estilo (default, secondary, destructive, outline, ghost, link, success, warning)
+ * - Múltiples tamaños (default, sm, lg, icon)
+ * - Patrón asChild para composición con otros elementos
+ * - Renderizado flexible con la prop `render`
+ * - Estados accesibles (disabled, pressed)
+ * - Clases y estilos dinámicos basados en estado
+ *
+ * @param props - Props del componente incluyendo variantes de estilo y comportamiento
+ * @returns Elemento button renderizado (o elemento personalizado si se usa `asChild` o `render`)
+ *
+ * @example
+ * ```tsx
+ * import { Button } from "@/components/ui/button";
+ *
+ * function Example() {
+ *   return (
+ *     <div className="flex gap-2">
+ *       <Button>Default</Button>
+ *       <Button variant="secondary">Secondary</Button>
+ *       <Button variant="destructive">Delete</Button>
+ *       <Button variant="success">Saved</Button>
+ *       <Button variant="warning">Warning</Button>
+ *       <Button variant="outline">Outline</Button>
+ *       <Button variant="ghost">Ghost</Button>
+ *       <Button variant="link">Link</Button>
+ *       <Button size="sm">Small</Button>
+ *       <Button size="lg">Large</Button>
+ *       <Button size="icon">
+ *         <Icon />
+ *       </Button>
+ *       <Button disabled>Disabled</Button>
+ *       <Button disabled focusableWhenDisabled>
+ *         Loading...
+ *       </Button>
+ *       <Button asChild>
+ *         <a href="/link">Link Button</a>
+ *       </Button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Button con renderizado personalizado
+ * <Button render={<div />} nativeButton={false}>
+ *   Custom container
+ * </Button>
+ *
+ * // Button con clases dinámicas basadas en estado
+ * <Button
+ *   className={(state) =>
+ *     cn(
+ *       "transition-transform",
+ *       state.pressed && "scale-95"
+ *     )
+ *   }
+ * >
+ *   Press me
+ * </Button>
+ * ```
+ *
+ * @see {@link IButtonProps}
+ * @see {@link buttonVariants}
+ * @see {@link https://base-ui.com/react/components/button}
+ */
+function Button({ className, variant, size, focusableWhenDisabled, nativeButton, asChild = false, render, style, children, disabled, onPointerDown, onPointerUp, onPointerLeave, ...props }) {
+    const [pressed, setPressed] = React.useState(false);
+    const handlePointerDown = React.useCallback((e) => {
+        setPressed(true);
+        onPointerDown?.(e);
+    }, [onPointerDown]);
+    const handlePointerUp = React.useCallback((e) => {
+        setPressed(false);
+        onPointerUp?.(e);
+    }, [onPointerUp]);
+    const handlePointerLeave = React.useCallback((e) => {
+        setPressed(false);
+        onPointerLeave?.(e);
+    }, [onPointerLeave]);
+    const state = {
+        disabled: disabled ?? false,
+        pressed,
+    };
+    const baseClassName = cn(buttonVariants({ variant, size }), typeof className === "function" ? className(state) : className, pressed && buttonStateStyles.pressed);
+    const baseStyle = typeof style === "function" ? style(state) : style;
+    // Si asChild está activo, usamos el patrón Slot
+    if (asChild && React.isValidElement(children)) {
+        return (_jsx(ButtonPrimitive, { "data-slot": "button", "data-variant": variant, "data-size": size, "data-pressed": pressed, disabled: disabled, focusableWhenDisabled: focusableWhenDisabled, className: baseClassName, style: baseStyle, onPointerDown: handlePointerDown, onPointerUp: handlePointerUp, onPointerLeave: handlePointerLeave, ...props, children: _jsx(Slot, { className: baseClassName, style: baseStyle, children: children }) }));
+    }
+    return (_jsx(ButtonPrimitive, { "data-slot": "button", "data-variant": variant, "data-size": size, "data-pressed": pressed, disabled: disabled, focusableWhenDisabled: focusableWhenDisabled, nativeButton: nativeButton, render: render, className: baseClassName, style: baseStyle, onPointerDown: handlePointerDown, onPointerUp: handlePointerUp, onPointerLeave: handlePointerLeave, ...props, children: children }));
+}
+export { Button };
+export { buttonVariants, buttonStateStyles } from "./button.styles";
+//# sourceMappingURL=button.js.map

package/dist/components/ui/button/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../../src/components/ui/button/button.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/button/button.styles.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Variantes de estilo para el componente Button usando CVA (Class Variance Authority).
+ *
+ * Define las combinaciones de variantes visuales soportadas:
+ * - variant: default, secondary, destructive, outline, ghost, link, success, warning
+ * - size: default, sm, lg, icon
+ *
+ * @see {@link https://cva.style/docs/getting-started/variants}
+ */
+export declare const buttonVariants: (props?: ({
+    variant?: "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | "success" | "warning" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/**
+ * Estilos estáticos para el componente Button.
+ *
+ * Útil cuando se necesitan clases específicas fuera del sistema de variantes.
+ */
+export declare const buttonStyles: {
+    base: string;
+    focus: string;
+    disabled: string;
+    icon: string;
+    pressed: string;
+};
+/**
+ * Clases para estados específicos del botón.
+ */
+export declare const buttonStateStyles: {
+    pressed: string;
+    disabled: string;
+};
+//# sourceMappingURL=button.styles.d.ts.map

package/dist/components/ui/button/button.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/button.styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc;;;8EAgC1B,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,YAAY;;;;;;CAOxB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB;;;CAG7B,CAAC"}

package/dist/components/ui/button/button.styles.js

@@ -0,0 +1,54 @@
+import { cva } from "class-variance-authority";
+/**
+ * Variantes de estilo para el componente Button usando CVA (Class Variance Authority).
+ *
+ * Define las combinaciones de variantes visuales soportadas:
+ * - variant: default, secondary, destructive, outline, ghost, link, success, warning
+ * - size: default, sm, lg, icon
+ *
+ * @see {@link https://cva.style/docs/getting-started/variants}
+ */
+export const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 active:scale-[0.98]", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+            outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+            ghost: "hover:bg-accent hover:text-accent-foreground",
+            link: "text-primary underline-offset-4 hover:underline",
+            success: "bg-emerald-600 text-white hover:bg-emerald-700 focus-visible:ring-emerald-600",
+            warning: "bg-amber-500 text-white hover:bg-amber-600 focus-visible:ring-amber-500",
+        },
+        size: {
+            default: "h-10 px-4 py-2",
+            sm: "h-9 rounded-md px-3 text-xs",
+            lg: "h-11 rounded-md px-8 text-base",
+            icon: "h-10 w-10 p-0",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+/**
+ * Estilos estáticos para el componente Button.
+ *
+ * Útil cuando se necesitan clases específicas fuera del sistema de variantes.
+ */
+export const buttonStyles = {
+    base: "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium transition-all",
+    focus: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    disabled: "disabled:pointer-events-none disabled:opacity-50",
+    icon: "[&_svg]:pointer-events-none [&_svg]:shrink-0",
+    pressed: "active:scale-[0.98]",
+};
+/**
+ * Clases para estados específicos del botón.
+ */
+export const buttonStateStyles = {
+    pressed: "scale-[0.98]",
+    disabled: "opacity-50 pointer-events-none",
+};
+//# sourceMappingURL=button.styles.js.map

package/dist/components/ui/button/button.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../../../src/components/ui/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,qUAAqU,EACrU;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,wDAAwD;YAC1D,SAAS,EACP,8DAA8D;YAChE,WAAW,EACT,oEAAoE;YACtE,OAAO,EACL,gFAAgF;YAClF,KAAK,EAAE,8CAA8C;YACrD,IAAI,EAAE,iDAAiD;YACvD,OAAO,EACL,+EAA+E;YACjF,OAAO,EACL,yEAAyE;SAC5E;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,gBAAgB;YACzB,EAAE,EAAE,6BAA6B;YACjC,EAAE,EAAE,gCAAgC;YACpC,IAAI,EAAE,eAAe;SACtB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAEF;;;;GAIG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,IAAI,EAAE,uGAAuG;IAC7G,KAAK,EACH,qGAAqG;IACvG,QAAQ,EAAE,kDAAkD;IAC5D,IAAI,EAAE,8CAA8C;IACpD,OAAO,EAAE,qBAAqB;CAC/B,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE,gCAAgC;CAC3C,CAAC"}

package/dist/components/ui/button/button.types.d.ts

@@ -0,0 +1,103 @@
+import type { VariantProps } from "class-variance-authority";
+/**
+ * Estados del componente Button.
+ *
+ * @interface IButtonState
+ */
+export interface IButtonState {
+    /** Indica si el botón está deshabilitado */
+    disabled: boolean;
+    /** Indica si el botón está siendo presionado */
+    pressed: boolean;
+}
+/**
+ * Props para el componente Button basado en Base UI.
+ *
+ * @interface IButtonProps
+ * @extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "className" | "style">
+ * @extends VariantProps<typeof import("./button.styles").buttonVariants>
+ *
+ * @example
+ * ```tsx
+ * // Button por defecto
+ * <Button>Click me</Button>
+ *
+ * // Button con variante destructiva
+ * <Button variant="destructive">Delete</Button>
+ *
+ * // Button con variante success
+ * <Button variant="success">Saved</Button>
+ *
+ * // Button deshabilitado pero enfocable
+ * <Button disabled focusableWhenDisabled>Loading...</Button>
+ *
+ * // Button renderizado como div
+ * <Button render={<div />} nativeButton={false}>
+ *   Custom content
+ * </Button>
+ *
+ * // Button con asChild (composición)
+ * <Button asChild>
+ *   <a href="/link">Link Button</a>
+ * </Button>
+ *
+ * // Button con clase basada en estado
+ * <Button className={(state) => state.pressed ? "scale-95" : ""}>
+ *   Pressable
+ * </Button>
+ * ```
+ */
+export interface IButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "className" | "style">, VariantProps<typeof import("./button.styles").buttonVariants> {
+    /**
+     * Si el botón debe ser enfocable cuando está deshabilitado.
+     * Útil para mantener el foco durante estados de carga.
+     *
+     * @default false
+     */
+    focusableWhenDisabled?: boolean;
+    /**
+     * Si el componente renderiza un elemento `<button>` nativo al reemplazarlo
+     * mediante la prop `render`. Establecer en `false` si el elemento renderizado
+     * no es un botón (por ejemplo, un `<div>`).
+     *
+     * @default true
+     */
+    nativeButton?: boolean;
+    /**
+     * Permite componer el botón con otro elemento (patrón asChild).
+     * El componente hijo recibirá todas las props y event handlers del botón.
+     *
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Permite reemplazar el elemento HTML del componente con una etiqueta diferente
+     * o componerlo con otro componente. Ignorado si `asChild` es true.
+     *
+     * Puede ser un `ReactElement` o una función que retorne el elemento a renderizar.
+     */
+    render?: React.ReactElement | ((props: React.HTMLProps<HTMLElement>, state: IButtonState) => React.ReactElement);
+    /**
+     * Clase CSS aplicada al elemento, o una función que retorna una clase
+     * basada en el estado del componente.
+     */
+    className?: string | ((state: IButtonState) => string | undefined);
+    /**
+     * Estilos CSS aplicados al elemento, o una función que retorna estilos
+     * basados en el estado del componente.
+     */
+    style?: React.CSSProperties | ((state: IButtonState) => React.CSSProperties | undefined);
+}
+/**
+ * Variantes disponibles para el componente Button.
+ *
+ * @type ButtonVariant
+ */
+export type ButtonVariant = "default" | "secondary" | "destructive" | "outline" | "ghost" | "link" | "success" | "warning";
+/**
+ * Tamaños disponibles para el componente Button.
+ *
+ * @type ButtonSize
+ */
+export type ButtonSize = "default" | "sm" | "lg" | "icon";
+//# sourceMappingURL=button.types.d.ts.map

package/dist/components/ui/button/button.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.types.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/button.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE7D;;;;GAIG;AACH,MAAM,WAAW,YAAY;IAC3B,4CAA4C;IAC5C,QAAQ,EAAE,OAAO,CAAC;IAClB,gDAAgD;IAChD,OAAO,EAAE,OAAO,CAAC;CAClB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,WAAW,GAAG,OAAO,CAAC,EAChF,YAAY,CAAC,cAAc,iBAAiB,EAAE,cAAc,CAAC;IAC/D;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;;OAKG;IACH,MAAM,CAAC,EACH,KAAK,CAAC,YAAY,GAClB,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,YAAY,KAAK,KAAK,CAAC,YAAY,CAAC,CAAC;IAEvF;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,YAAY,KAAK,MAAM,GAAG,SAAS,CAAC,CAAC;IAEnE;;;OAGG;IACH,KAAK,CAAC,EACF,KAAK,CAAC,aAAa,GACnB,CAAC,CAAC,KAAK,EAAE,YAAY,KAAK,KAAK,CAAC,aAAa,GAAG,SAAS,CAAC,CAAC;CAChE;AAED;;;;GAIG;AACH,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,aAAa,GACb,SAAS,GACT,OAAO,GACP,MAAM,GACN,SAAS,GACT,SAAS,CAAC;AAEd;;;;GAIG;AACH,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC"}

package/dist/components/ui/button/button.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=button.types.js.map

package/dist/components/ui/button/button.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.types.js","sourceRoot":"","sources":["../../../../src/components/ui/button/button.types.ts"],"names":[],"mappings":""}

package/dist/components/ui/button/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Button component barrel export
+ *
+ * @module @mks2508/mks-ui/components/ui/button
+ */
+export * from "./button";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ui/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/button/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,UAAU,CAAC"}

package/dist/components/ui/button/index.js

@@ -0,0 +1,7 @@
+/**
+ * Button component barrel export
+ *
+ * @module @mks2508/mks-ui/components/ui/button
+ */
+export * from "./button";
+//# sourceMappingURL=index.js.map

package/dist/components/ui/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/button/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,UAAU,CAAC"}

package/dist/components/ui/card.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const cardVariants: (props?: ({
+    variant?: "default" | "glass" | "glass-accent" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Card({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof cardVariants>): import("react/jsx-runtime").JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): import("react/jsx-runtime").JSX.Element;
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, cardVariants, };
+//# sourceMappingURL=card.d.ts.map

package/dist/components/ui/card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,YAAY;;8EAcjB,CAAA;AAED,iBAAS,IAAI,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,2CAS9G;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQtE;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ5E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQvE;AAED,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,YAAY,GACb,CAAA"}

package/dist/components/ui/card.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { cn } from "@/lib/utils";
+const cardVariants = cva("flex flex-col gap-6 rounded-xl border transition-all", {
+    variants: {
+        variant: {
+            default: "bg-card text-card-foreground py-6 shadow-sm",
+            "glass": "bg-card/70 backdrop-blur-md border-border shadow-[0_4px_20px_rgba(0,0,0,0.19)]",
+            "glass-accent": "bg-card/70 backdrop-blur-md border-border-primary shadow-[0_4px_20px_rgba(212,12,103,0.25)]",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Card({ className, variant, ...props }) {
+    return (_jsx("div", { "data-slot": "card", "data-variant": variant, className: cn(cardVariants({ variant }), className), ...props }));
+}
+function CardHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-header", className: cn("@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6", className), ...props }));
+}
+function CardTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-title", className: cn("leading-none font-semibold", className), ...props }));
+}
+function CardDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-description", className: cn("text-muted-foreground text-sm", className), ...props }));
+}
+function CardAction({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-action", className: cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className), ...props }));
+}
+function CardContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-content", className: cn("px-6", className), ...props }));
+}
+function CardFooter({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "card-footer", className: cn("flex items-center px-6 [.border-t]:pt-6", className), ...props }));
+}
+export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, cardVariants, };
+//# sourceMappingURL=card.js.map

package/dist/components/ui/card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../src/components/ui/card.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAA;AAEhC,MAAM,YAAY,GAAG,GAAG,CACtB,sDAAsD,EACtD;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,6CAA6C;YACtD,OAAO,EAAE,gFAAgF;YACzF,cAAc,EAAE,6FAA6F;SAC9G;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAA;AAED,SAAS,IAAI,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAmE;IAC7G,OAAO,CACL,2BACY,MAAM,kBACF,OAAO,EACrB,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,KAC/C,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,0JAA0J,EAC1J,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACrE,OAAO,CACL,2BACY,YAAY,EACtB,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC,KAClD,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IAC3E,OAAO,CACL,2BACY,kBAAkB,EAC5B,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE,SAAS,CAAC,KACrD,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CACX,gEAAgE,EAChE,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO,CACL,2BACY,cAAc,EACxB,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,KAC5B,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACtE,OAAO,CACL,2BACY,aAAa,EACvB,SAAS,EAAE,EAAE,CAAC,yCAAyC,EAAE,SAAS,CAAC,KAC/D,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAED,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,YAAY,GACb,CAAA"}