@mks2508/mks-ui 0.1.4 → 0.2.0

package/dist/components/animate-ui/primitives/effects/highlight.js

@@ -1,356 +0,0 @@
-'use client';
-
-import { cn } from "../../../../lib/utils.js";
-import * as React from "react";
-import { AnimatePresence, motion } from "motion/react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/animate-ui/primitives/effects/highlight.tsx
-const DEFAULT_BOUNDS_OFFSET = {
-	top: 0,
-	left: 0,
-	width: 0,
-	height: 0
-};
-const HighlightContext = React.createContext(void 0);
-function useHighlight() {
-	const context = React.useContext(HighlightContext);
-	if (!context) throw new Error("useHighlight must be used within a HighlightProvider");
-	return context;
-}
-function Highlight({ ref, ...props }) {
-	const { as: Component = "div", children, value, defaultValue, onValueChange, className, style, transition = {
-		type: "spring",
-		stiffness: 350,
-		damping: 35
-	}, hover = false, click = true, enabled = true, controlledItems, disabled = false, exitDelay = 200, mode = "children" } = props;
-	const localRef = React.useRef(null);
-	React.useImperativeHandle(ref, () => localRef.current);
-	const boundsOffset = props?.boundsOffset ?? DEFAULT_BOUNDS_OFFSET;
-	const boundsOffsetTop = boundsOffset.top ?? 0;
-	const boundsOffsetLeft = boundsOffset.left ?? 0;
-	const boundsOffsetWidth = boundsOffset.width ?? 0;
-	const boundsOffsetHeight = boundsOffset.height ?? 0;
-	const boundsOffsetRef = React.useRef({
-		top: boundsOffsetTop,
-		left: boundsOffsetLeft,
-		width: boundsOffsetWidth,
-		height: boundsOffsetHeight
-	});
-	React.useEffect(() => {
-		boundsOffsetRef.current = {
-			top: boundsOffsetTop,
-			left: boundsOffsetLeft,
-			width: boundsOffsetWidth,
-			height: boundsOffsetHeight
-		};
-	}, [
-		boundsOffsetTop,
-		boundsOffsetLeft,
-		boundsOffsetWidth,
-		boundsOffsetHeight
-	]);
-	const [activeValue, setActiveValue] = React.useState(value ?? defaultValue ?? null);
-	const [boundsState, setBoundsState] = React.useState(null);
-	const [activeClassNameState, setActiveClassNameState] = React.useState("");
-	const safeSetActiveValue = (id) => {
-		setActiveValue((prev) => {
-			if (prev !== id) {
-				onValueChange?.(id);
-				return id;
-			}
-			return prev;
-		});
-	};
-	const safeSetBoundsRef = React.useRef(void 0);
-	React.useEffect(() => {
-		safeSetBoundsRef.current = (bounds) => {
-			if (!localRef.current) return;
-			const containerRect = localRef.current.getBoundingClientRect();
-			const offset = boundsOffsetRef.current;
-			const newBounds = {
-				top: bounds.top - containerRect.top + offset.top,
-				left: bounds.left - containerRect.left + offset.left,
-				width: bounds.width + offset.width,
-				height: bounds.height + offset.height
-			};
-			setBoundsState((prev) => {
-				if (prev && prev.top === newBounds.top && prev.left === newBounds.left && prev.width === newBounds.width && prev.height === newBounds.height) return prev;
-				return newBounds;
-			});
-		};
-	});
-	const safeSetBounds = (bounds) => {
-		safeSetBoundsRef.current?.(bounds);
-	};
-	const clearBounds = React.useCallback(() => {
-		setBoundsState((prev) => prev === null ? prev : null);
-	}, []);
-	React.useEffect(() => {
-		if (value !== void 0) setActiveValue(value);
-		else if (defaultValue !== void 0) setActiveValue(defaultValue);
-	}, [value, defaultValue]);
-	const id = React.useId();
-	React.useEffect(() => {
-		if (mode !== "parent") return;
-		const container = localRef.current;
-		if (!container) return;
-		const onScroll = () => {
-			if (!activeValue) return;
-			const activeEl = container.querySelector(`[data-value="${activeValue}"][data-highlight="true"]`);
-			if (activeEl) safeSetBoundsRef.current?.(activeEl.getBoundingClientRect());
-		};
-		container.addEventListener("scroll", onScroll, { passive: true });
-		return () => container.removeEventListener("scroll", onScroll);
-	}, [mode, activeValue]);
-	const render = (children) => {
-		if (mode === "parent") return /* @__PURE__ */ jsxs(Component, {
-			ref: localRef,
-			"data-slot": "motion-highlight-container",
-			style: {
-				position: "relative",
-				zIndex: 1
-			},
-			className: props?.containerClassName,
-			children: [/* @__PURE__ */ jsx(AnimatePresence, {
-				initial: false,
-				mode: "wait",
-				children: boundsState && /* @__PURE__ */ jsx(motion.div, {
-					"data-slot": "motion-highlight",
-					animate: {
-						top: boundsState.top,
-						left: boundsState.left,
-						width: boundsState.width,
-						height: boundsState.height,
-						opacity: 1
-					},
-					initial: {
-						top: boundsState.top,
-						left: boundsState.left,
-						width: boundsState.width,
-						height: boundsState.height,
-						opacity: 0
-					},
-					exit: {
-						opacity: 0,
-						transition: {
-							...transition,
-							delay: (transition?.delay ?? 0) + (exitDelay ?? 0) / 1e3
-						}
-					},
-					transition,
-					style: {
-						position: "absolute",
-						zIndex: 0,
-						...style
-					},
-					className: cn(className, activeClassNameState)
-				})
-			}), children]
-		});
-		return children;
-	};
-	return /* @__PURE__ */ jsx(HighlightContext.Provider, {
-		value: {
-			mode,
-			activeValue,
-			setActiveValue: safeSetActiveValue,
-			id,
-			hover,
-			click,
-			className,
-			style,
-			transition,
-			disabled,
-			enabled,
-			exitDelay,
-			setBounds: safeSetBounds,
-			clearBounds,
-			activeClassName: activeClassNameState,
-			setActiveClassName: setActiveClassNameState,
-			forceUpdateBounds: props?.forceUpdateBounds
-		},
-		children: enabled ? controlledItems ? render(children) : render(React.Children.map(children, (child, index) => /* @__PURE__ */ jsx(HighlightItem, {
-			className: props?.itemsClassName,
-			children: child
-		}, index))) : children
-	});
-}
-function getNonOverridingDataAttributes(element, dataAttributes) {
-	return Object.keys(dataAttributes).reduce((acc, key) => {
-		if (element.props[key] === void 0) acc[key] = dataAttributes[key];
-		return acc;
-	}, {});
-}
-function HighlightItem({ ref, as, children, id, value, className, style, transition, disabled = false, activeClassName, exitDelay, asChild = false, forceUpdateBounds, ...props }) {
-	const itemId = React.useId();
-	const { activeValue, setActiveValue, mode, setBounds, clearBounds, hover, click, enabled, className: contextClassName, style: contextStyle, transition: contextTransition, id: contextId, disabled: contextDisabled, exitDelay: contextExitDelay, forceUpdateBounds: contextForceUpdateBounds, setActiveClassName } = useHighlight();
-	const Component = as ?? "div";
-	const element = children;
-	const childValue = id ?? value ?? element.props?.["data-value"] ?? element.props?.id ?? itemId;
-	const isActive = activeValue === childValue;
-	const isDisabled = disabled === void 0 ? contextDisabled : disabled;
-	const itemTransition = transition ?? contextTransition;
-	const localRef = React.useRef(null);
-	React.useImperativeHandle(ref, () => localRef.current);
-	const refCallback = React.useCallback((node) => {
-		localRef.current = node;
-	}, []);
-	React.useEffect(() => {
-		if (mode !== "parent") return;
-		let rafId;
-		let previousBounds = null;
-		const shouldUpdateBounds = forceUpdateBounds === true || contextForceUpdateBounds && forceUpdateBounds !== false;
-		const updateBounds = () => {
-			if (!localRef.current) return;
-			const bounds = localRef.current.getBoundingClientRect();
-			if (shouldUpdateBounds) {
-				if (previousBounds && previousBounds.top === bounds.top && previousBounds.left === bounds.left && previousBounds.width === bounds.width && previousBounds.height === bounds.height) {
-					rafId = requestAnimationFrame(updateBounds);
-					return;
-				}
-				previousBounds = bounds;
-				rafId = requestAnimationFrame(updateBounds);
-			}
-			setBounds(bounds);
-		};
-		if (isActive) {
-			updateBounds();
-			setActiveClassName(activeClassName ?? "");
-		} else if (!activeValue) clearBounds();
-		if (shouldUpdateBounds) return () => cancelAnimationFrame(rafId);
-	}, [
-		mode,
-		isActive,
-		activeValue,
-		setBounds,
-		clearBounds,
-		activeClassName,
-		setActiveClassName,
-		forceUpdateBounds,
-		contextForceUpdateBounds
-	]);
-	if (!React.isValidElement(children)) return children;
-	const dataAttributes = {
-		"data-active": isActive ? "true" : "false",
-		"aria-selected": isActive,
-		"data-disabled": isDisabled,
-		"data-value": childValue,
-		"data-highlight": true
-	};
-	const commonHandlers = hover ? {
-		onMouseEnter: (e) => {
-			setActiveValue(childValue);
-			element.props.onMouseEnter?.(e);
-		},
-		onMouseLeave: (e) => {
-			setActiveValue(null);
-			element.props.onMouseLeave?.(e);
-		}
-	} : click ? { onClick: (e) => {
-		setActiveValue(childValue);
-		element.props.onClick?.(e);
-	} } : {};
-	if (asChild) {
-		if (mode === "children") return React.cloneElement(element, {
-			key: childValue,
-			ref: refCallback,
-			className: cn("relative", element.props.className),
-			...getNonOverridingDataAttributes(element, {
-				...dataAttributes,
-				"data-slot": "motion-highlight-item-container"
-			}),
-			...commonHandlers,
-			...props
-		}, /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(AnimatePresence, {
-			initial: false,
-			mode: "wait",
-			children: isActive && !isDisabled && /* @__PURE__ */ jsx(motion.div, {
-				layoutId: `transition-background-${contextId}`,
-				"data-slot": "motion-highlight",
-				style: {
-					position: "absolute",
-					zIndex: 0,
-					...contextStyle,
-					...style
-				},
-				className: cn(contextClassName, activeClassName),
-				transition: itemTransition,
-				initial: { opacity: 0 },
-				animate: { opacity: 1 },
-				exit: {
-					opacity: 0,
-					transition: {
-						...itemTransition,
-						delay: (itemTransition?.delay ?? 0) + (exitDelay ?? contextExitDelay ?? 0) / 1e3
-					}
-				},
-				...dataAttributes
-			})
-		}), /* @__PURE__ */ jsx(Component, {
-			"data-slot": "motion-highlight-item",
-			style: {
-				position: "relative",
-				zIndex: 1
-			},
-			className,
-			...dataAttributes,
-			children
-		})] }));
-		return React.cloneElement(element, {
-			ref: refCallback,
-			...getNonOverridingDataAttributes(element, {
-				...dataAttributes,
-				"data-slot": "motion-highlight-item"
-			}),
-			...commonHandlers
-		});
-	}
-	return enabled ? /* @__PURE__ */ jsxs(Component, {
-		ref: localRef,
-		"data-slot": "motion-highlight-item-container",
-		className: cn(mode === "children" && "relative", className),
-		...dataAttributes,
-		...props,
-		...commonHandlers,
-		children: [mode === "children" && /* @__PURE__ */ jsx(AnimatePresence, {
-			initial: false,
-			mode: "wait",
-			children: isActive && !isDisabled && /* @__PURE__ */ jsx(motion.div, {
-				layoutId: `transition-background-${contextId}`,
-				"data-slot": "motion-highlight",
-				style: {
-					position: "absolute",
-					zIndex: 0,
-					...contextStyle,
-					...style
-				},
-				className: cn(contextClassName, activeClassName),
-				transition: itemTransition,
-				initial: { opacity: 0 },
-				animate: { opacity: 1 },
-				exit: {
-					opacity: 0,
-					transition: {
-						...itemTransition,
-						delay: (itemTransition?.delay ?? 0) + (exitDelay ?? contextExitDelay ?? 0) / 1e3
-					}
-				},
-				...dataAttributes
-			})
-		}), React.cloneElement(element, {
-			style: {
-				position: "relative",
-				zIndex: 1
-			},
-			className: element.props.className,
-			...getNonOverridingDataAttributes(element, {
-				...dataAttributes,
-				"data-slot": "motion-highlight-item"
-			})
-		})]
-	}, childValue) : children;
-}
-
-//#endregion
-export { Highlight, HighlightItem, useHighlight };

package/dist/components/animate-ui/primitives/texts/counting-number.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-import { type SpringOptions } from 'motion/react';
-import { type UseIsInViewOptions } from '../../../../hooks/use-is-in-view';
-type CountingNumberProps = Omit<React.ComponentProps<'span'>, 'children'> & {
-    number: number;
-    fromNumber?: number;
-    padStart?: boolean;
-    decimalSeparator?: string;
-    decimalPlaces?: number;
-    transition?: SpringOptions;
-    delay?: number;
-    initiallyStable?: boolean;
-} & UseIsInViewOptions;
-declare function CountingNumber({ ref, number, fromNumber, padStart, inView, inViewMargin, inViewOnce, decimalSeparator, transition, decimalPlaces, delay, initiallyStable, ...props }: CountingNumberProps): import("react/jsx-runtime").JSX.Element;
-export { CountingNumber, type CountingNumberProps };
-//# sourceMappingURL=counting-number.d.ts.map

package/dist/components/animate-ui/primitives/texts/counting-number.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"counting-number.d.ts","sourceRoot":"","sources":["../../../../../src/components/animate-ui/primitives/texts/counting-number.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAA6B,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7E,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,wBAAwB,CAAC;AAEhC,KAAK,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,UAAU,CAAC,GAAG;IAC1E,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,GAAG,kBAAkB,CAAC;AAEvB,iBAAS,cAAc,CAAC,EACtB,GAAG,EACH,MAAM,EACN,UAAc,EACd,QAAgB,EAChB,MAAc,EACd,YAAoB,EACpB,UAAiB,EACjB,gBAAsB,EACtB,UAA2C,EAC3C,aAAiB,EACjB,KAAS,EACT,eAAuB,EACvB,GAAG,KAAK,EACT,EAAE,mBAAmB,2CAiFrB;AAED,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAC"}

package/dist/components/animate-ui/primitives/texts/counting-number.js

@@ -1,78 +0,0 @@
-'use client';
-
-import { useIsInView } from "../../../../hooks/use-is-in-view.js";
-import * as React from "react";
-import { useMotionValue, useSpring } from "motion/react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/animate-ui/primitives/texts/counting-number.tsx
-function CountingNumber({ ref, number, fromNumber = 0, padStart = false, inView = false, inViewMargin = "0px", inViewOnce = true, decimalSeparator = ".", transition = {
-	stiffness: 90,
-	damping: 50
-}, decimalPlaces = 0, delay = 0, initiallyStable = false, ...props }) {
-	const { ref: localRef, isInView } = useIsInView(ref, {
-		inView,
-		inViewOnce,
-		inViewMargin
-	});
-	const numberStr = number.toString();
-	const decimals = typeof decimalPlaces === "number" ? decimalPlaces : numberStr.includes(".") ? numberStr.split(".")[1]?.length ?? 0 : 0;
-	const motionVal = useMotionValue(initiallyStable ? number : fromNumber);
-	const springVal = useSpring(motionVal, transition);
-	React.useEffect(() => {
-		const timeoutId = setTimeout(() => {
-			if (isInView) motionVal.set(number);
-		}, delay);
-		return () => clearTimeout(timeoutId);
-	}, [
-		isInView,
-		number,
-		motionVal,
-		delay
-	]);
-	React.useEffect(() => {
-		const unsubscribe = springVal.on("change", (latest) => {
-			if (localRef.current) {
-				let formatted = decimals > 0 ? latest.toFixed(decimals) : Math.round(latest).toString();
-				if (decimals > 0) formatted = formatted.replace(".", decimalSeparator);
-				if (padStart) {
-					const finalIntLength = Math.floor(Math.abs(number)).toString().length;
-					const [intPart, fracPart] = formatted.split(decimalSeparator);
-					const paddedInt = intPart?.padStart(finalIntLength, "0") ?? "";
-					formatted = fracPart ? `${paddedInt}${decimalSeparator}${fracPart}` : paddedInt;
-				}
-				localRef.current.textContent = formatted;
-			}
-		});
-		return () => unsubscribe();
-	}, [
-		springVal,
-		decimals,
-		padStart,
-		number,
-		decimalSeparator,
-		localRef
-	]);
-	const finalIntLength = Math.floor(Math.abs(number)).toString().length;
-	const formatValue = (val) => {
-		let out = decimals > 0 ? val.toFixed(decimals) : Math.round(val).toString();
-		if (decimals > 0) out = out.replace(".", decimalSeparator);
-		if (padStart) {
-			const [intPart, fracPart] = out.split(decimalSeparator);
-			const paddedInt = (intPart ?? "").padStart(finalIntLength, "0");
-			out = fracPart ? `${paddedInt}${decimalSeparator}${fracPart}` : paddedInt;
-		}
-		return out;
-	};
-	const zeroText = padStart ? "0".padStart(finalIntLength, "0") + (decimals > 0 ? decimalSeparator + "0".repeat(decimals) : "") : "0" + (decimals > 0 ? decimalSeparator + "0".repeat(decimals) : "");
-	const initialText = initiallyStable ? formatValue(number) : zeroText;
-	return /* @__PURE__ */ jsx("span", {
-		ref: localRef,
-		"data-slot": "counting-number",
-		...props,
-		children: initialText
-	});
-}
-
-//#endregion
-export { CountingNumber };

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

@@ -1,9 +0,0 @@
-/**
- * Accordion component - Animate UI primitive re-export.
- *
- * Animated accordion with smooth expand/collapse transitions.
- *
- * @module @mks2508/mks-ui/components/ui/accordion
- */
-export * from '../../components/animate-ui/primitives/base/accordion';
-//# sourceMappingURL=accordion.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/ui/accordion.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,cAAc,mDAAmD,CAAC"}

package/dist/components/ui/accordion.js

@@ -1 +0,0 @@
-import { Accordion, AccordionHeader, AccordionItem, AccordionPanel, AccordionTrigger, useAccordionItem } from "../animate-ui/primitives/base/accordion.js";

package/dist/components/ui/alert-dialog.d.ts

@@ -1,9 +0,0 @@
-/**
- * AlertDialog component - Animate UI primitive re-export.
- *
- * Animated alert dialog with backdrop and motion transitions.
- *
- * @module @mks2508/mks-ui/components/ui/alert-dialog
- */
-export * from '../../components/animate-ui/primitives/base/alert-dialog';
-//# sourceMappingURL=alert-dialog.d.ts.map

package/dist/components/ui/alert-dialog.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/alert-dialog.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,cAAc,sDAAsD,CAAC"}

package/dist/components/ui/alert-dialog.js

@@ -1 +0,0 @@
-import { AlertDialog, AlertDialogBackdrop, AlertDialogClose, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogPopup, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, useAlertDialog } from "../animate-ui/primitives/base/alert-dialog.js";

package/dist/components/ui/auto-height.d.ts

@@ -1,9 +0,0 @@
-/**
- * AutoHeight effect - Animate UI primitive re-export.
- *
- * Smooth height auto-resize animation for dynamic content.
- *
- * @module @mks2508/mks-ui/components/ui/auto-height
- */
-export * from '../../components/animate-ui/primitives/effects/auto-height';
-//# sourceMappingURL=auto-height.d.ts.map

package/dist/components/ui/auto-height.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"auto-height.d.ts","sourceRoot":"","sources":["../../../src/components/ui/auto-height.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,cAAc,wDAAwD,CAAC"}

package/dist/components/ui/auto-height.js

@@ -1 +0,0 @@
-import { AutoHeight } from "../animate-ui/primitives/effects/auto-height.js";

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

@@ -1,37 +0,0 @@
-import type { IBadgeProps } from "./badge.types";
-/**
- * Componente Badge para mostrar etiquetas de estado, categorías o indicadores.
- *
- * El Badge es un componente visual que muestra información contextual como
- * estados, categorías, contadores o etiquetas. Soporta múltiples variantes
- * de color y tamaños.
- *
- * @param props - Props del componente incluyendo variantes de estilo
- * @returns Elemento div renderizado como badge
- *
- * @example
- * ```tsx
- * import { Badge } from "../../../components/ui/badge";
- *
- * function Example() {
- *   return (
- *     <div className="flex gap-2">
- *       <Badge>Default</Badge>
- *       <Badge variant="secondary">Secondary</Badge>
- *       <Badge variant="destructive">Destructive</Badge>
- *       <Badge variant="outline">Outline</Badge>
- *       <Badge size="sm">Small</Badge>
- *       <Badge size="lg">Large</Badge>
- *     </div>
- *   );
- * }
- * ```
- *
- * @see {@link IBadgeProps}
- * @see {@link badgeVariants}
- */
-declare function Badge({ className, variant, size, ...props }: IBadgeProps): import("react/jsx-runtime").JSX.Element;
-export { Badge };
-export { badgeVariants } from "./badge.styles";
-export type { IBadgeProps, BadgeVariant, BadgeSize } from "./badge.types";
-//# sourceMappingURL=badge.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,iBAAS,KAAK,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAUjE;AAED,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC"}

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

@@ -1,52 +0,0 @@
-import { cn } from "../../../lib/utils.js";
-import { badgeVariants } from "./badge.styles.js";
-import "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/ui/badge/badge.tsx
-/**
-* Componente Badge para mostrar etiquetas de estado, categorías o indicadores.
-*
-* El Badge es un componente visual que muestra información contextual como
-* estados, categorías, contadores o etiquetas. Soporta múltiples variantes
-* de color y tamaños.
-*
-* @param props - Props del componente incluyendo variantes de estilo
-* @returns Elemento div renderizado como badge
-*
-* @example
-* ```tsx
-* import { Badge } from "../../../components/ui/badge";
-*
-* function Example() {
-*   return (
-*     <div className="flex gap-2">
-*       <Badge>Default</Badge>
-*       <Badge variant="secondary">Secondary</Badge>
-*       <Badge variant="destructive">Destructive</Badge>
-*       <Badge variant="outline">Outline</Badge>
-*       <Badge size="sm">Small</Badge>
-*       <Badge size="lg">Large</Badge>
-*     </div>
-*   );
-* }
-* ```
-*
-* @see {@link IBadgeProps}
-* @see {@link badgeVariants}
-*/
-function Badge({ className, variant, size, ...props }) {
-	return /* @__PURE__ */ jsx("div", {
-		"data-slot": "badge",
-		"data-variant": variant,
-		"data-size": size,
-		className: cn(badgeVariants({
-			variant,
-			size
-		}), className),
-		...props
-	});
-}
-
-//#endregion
-export { Badge };

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

@@ -1,23 +0,0 @@
-/**
- * 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 declare const badgeVariants: (props?: ({
-    variant?: "outline" | "default" | "secondary" | "destructive" | null | undefined;
-    size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
-/**
- * Estilos estáticos para el componente Badge.
- *
- * Útil cuando se necesitan clases específicas fuera del sistema de variantes.
- */
-export declare const badgeStyles: {
-    base: string;
-    focus: string;
-};
-//# sourceMappingURL=badge.styles.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"badge.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/badge/badge.styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,eAAO,MAAM,aAAa;;;8EAwBzB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;CAGvB,CAAC"}

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

@@ -1,34 +0,0 @@
-import { cva } from "class-variance-authority";
-
-//#region src/components/ui/badge/badge.styles.ts
-/**
-* 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}
-*/
-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"
-	}
-});
-
-//#endregion
-export { badgeVariants };