@smart-coder-labs/apple-design-system 1.0.0

package/dist/components/DateRangePicker.js

@@ -0,0 +1,213 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
+/* ========================================
+   UTILITY FUNCTIONS
+   ======================================== */
+const formatDate = (date, format = 'medium') => {
+    const optionsMap = {
+        short: { month: 'numeric', day: 'numeric', year: 'numeric' },
+        medium: { month: 'short', day: 'numeric', year: 'numeric' },
+        long: { month: 'long', day: 'numeric', year: 'numeric' },
+    };
+    return new Intl.DateTimeFormat('en-US', optionsMap[format]).format(date);
+};
+const isSameDay = (date1, date2) => {
+    return (date1.getFullYear() === date2.getFullYear() &&
+        date1.getMonth() === date2.getMonth() &&
+        date1.getDate() === date2.getDate());
+};
+const getDaysInMonth = (year, month) => {
+    return new Date(year, month + 1, 0).getDate();
+};
+const getFirstDayOfMonth = (year, month) => {
+    return new Date(year, month, 1).getDay();
+};
+const isDateDisabled = (date, minDate, maxDate) => {
+    if (minDate && date < minDate)
+        return true;
+    if (maxDate && date > maxDate)
+        return true;
+    return false;
+};
+/* ========================================
+   STYLES
+   ======================================== */
+const baseInputStyles = `
+  w-full
+  bg-surface-primary
+  border border-border-primary
+  text-text-primary
+  placeholder:text-text-tertiary
+  transition-apple
+  focus:outline-none
+  focus:border-accent-blue
+  focus:ring-2
+  focus:ring-accent-blue/20
+  disabled:opacity-40
+  disabled:cursor-not-allowed
+  cursor-pointer
+`;
+const sizeStyles = {
+    sm: 'h-8 px-3 text-sm rounded-lg',
+    md: 'h-10 px-4 text-base rounded-xl',
+    lg: 'h-12 px-5 text-lg rounded-xl',
+};
+const Calendar = ({ range, onSelectDate, minDate, maxDate, currentMonth, onMonthChange, }) => {
+    const [hoveredDate, setHoveredDate] = useState(null);
+    const year = currentMonth.getFullYear();
+    const month = currentMonth.getMonth();
+    const daysInMonth = getDaysInMonth(year, month);
+    const firstDay = getFirstDayOfMonth(year, month);
+    const today = new Date();
+    const days = Array.from({ length: daysInMonth }, (_, i) => i + 1);
+    const emptyDays = Array.from({ length: firstDay }, (_, i) => i);
+    const monthNames = [
+        'January', 'February', 'March', 'April', 'May', 'June',
+        'July', 'August', 'September', 'October', 'November', 'December'
+    ];
+    const handlePrevMonth = () => {
+        const newDate = new Date(year, month - 1, 1);
+        onMonthChange(newDate);
+    };
+    const handleNextMonth = () => {
+        const newDate = new Date(year, month + 1, 1);
+        onMonthChange(newDate);
+    };
+    const handleDayClick = (day) => {
+        const date = new Date(year, month, day);
+        if (!isDateDisabled(date, minDate, maxDate)) {
+            onSelectDate(date);
+        }
+    };
+    const isDateInRange = (date) => {
+        if (range.from && range.to) {
+            return date >= range.from && date <= range.to;
+        }
+        if (range.from && hoveredDate) {
+            return (date >= range.from && date <= hoveredDate) || (date <= range.from && date >= hoveredDate);
+        }
+        return false;
+    };
+    return (_jsx(motion.div, { initial: { opacity: 0, y: -8, scale: 0.96 }, animate: { opacity: 1, y: 0, scale: 1 }, exit: { opacity: 0, y: -8, scale: 0.96 }, transition: {
+            type: 'spring',
+            stiffness: 400,
+            damping: 30,
+        }, className: "absolute top-full left-0 mt-2 z-[1300] w-full min-w-[300px] max-w-[340px]", children: _jsxs("div", { className: "bg-surface-primary border border-border-primary rounded-2xl shadow-lg p-4 backdrop-blur-xl", children: [_jsxs("div", { className: "flex items-center justify-between mb-4", children: [_jsx(motion.button, { whileHover: { scale: 1.05 }, whileTap: { scale: 0.95 }, onClick: handlePrevMonth, className: "p-2 rounded-lg hover:bg-surface-secondary transition-apple", type: "button", children: _jsx("svg", { className: "w-5 h-5 text-text-primary", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), _jsxs("h3", { className: "text-base font-semibold text-text-primary", children: [monthNames[month], " ", year] }), _jsx(motion.button, { whileHover: { scale: 1.05 }, whileTap: { scale: 0.95 }, onClick: handleNextMonth, className: "p-2 rounded-lg hover:bg-surface-secondary transition-apple", type: "button", children: _jsx("svg", { className: "w-5 h-5 text-text-primary", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) }) })] }), _jsx("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'].map((day) => (_jsx("div", { className: "text-center text-xs font-medium text-text-tertiary py-2", children: day }, day))) }), _jsxs("div", { className: "grid grid-cols-7 gap-1", onMouseLeave: () => setHoveredDate(null), children: [emptyDays.map((_, index) => (_jsx("div", { className: "aspect-square" }, `empty-${index}`))), days.map((day) => {
+                            const date = new Date(year, month, day);
+                            const isSelectedStart = range.from && isSameDay(date, range.from);
+                            const isSelectedEnd = range.to && isSameDay(date, range.to);
+                            const isSelected = isSelectedStart || isSelectedEnd;
+                            const isInRange = isDateInRange(date);
+                            const isToday = isSameDay(date, today);
+                            const isDisabled = isDateDisabled(date, minDate, maxDate);
+                            let roundedClass = 'rounded-lg';
+                            if (isInRange) {
+                                if (isSelectedStart && isSelectedEnd)
+                                    roundedClass = 'rounded-lg';
+                                else if (isSelectedStart)
+                                    roundedClass = 'rounded-l-lg rounded-r-none';
+                                else if (isSelectedEnd)
+                                    roundedClass = 'rounded-r-lg rounded-l-none';
+                                else
+                                    roundedClass = 'rounded-none';
+                            }
+                            return (_jsx(motion.button, { whileHover: !isDisabled ? { scale: 1.05, zIndex: 10 } : {}, whileTap: !isDisabled ? { scale: 0.95 } : {}, onClick: () => handleDayClick(day), onMouseEnter: () => setHoveredDate(date), disabled: isDisabled, className: `
+                                    aspect-square text-sm font-medium relative
+                                    transition-colors duration-200
+                                    ${roundedClass}
+                                    ${isSelected
+                                    ? 'bg-accent-blue text-white z-10'
+                                    : isInRange
+                                        ? 'bg-accent-blue/10 text-text-primary'
+                                        : isToday
+                                            ? 'bg-accent-blue/5 text-accent-blue border border-accent-blue/20'
+                                            : 'text-text-primary hover:bg-surface-secondary'}
+                                    ${isDisabled ? 'opacity-30 cursor-not-allowed' : 'cursor-pointer'}
+                                `, type: "button", children: day }, day));
+                        })] })] }) }));
+};
+/* ========================================
+   DATE RANGE PICKER COMPONENT
+   ======================================== */
+export const DateRangePicker = ({ label, value, onChange, placeholder = 'Select date range', error, helperText, disabled = false, minDate, maxDate, dateFormat = 'medium', size = 'md', className = '', }) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const [range, setRange] = useState(value || { from: null, to: null });
+    const [currentMonth, setCurrentMonth] = useState(value?.from || new Date());
+    const containerRef = useRef(null);
+    const hasError = !!error;
+    // Sync state with props
+    useEffect(() => {
+        if (value) {
+            setRange(value);
+            if (value.from)
+                setCurrentMonth(value.from);
+        }
+    }, [value]);
+    useEffect(() => {
+        const handleClickOutside = (event) => {
+            if (containerRef.current && !containerRef.current.contains(event.target)) {
+                setIsOpen(false);
+            }
+        };
+        if (isOpen) {
+            document.addEventListener('mousedown', handleClickOutside);
+        }
+        return () => {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [isOpen]);
+    const handleSelectDate = (date) => {
+        let newRange = { ...range };
+        if (!range.from || (range.from && range.to)) {
+            // Start new range
+            newRange = { from: date, to: null };
+        }
+        else {
+            // Complete range
+            if (date < range.from) {
+                newRange = { from: date, to: range.from };
+            }
+            else {
+                newRange = { from: range.from, to: date };
+            }
+            setIsOpen(false); // Close on second selection
+        }
+        setRange(newRange);
+        onChange?.(newRange);
+    };
+    const handleInputClick = () => {
+        if (!disabled && !isOpen) {
+            setIsOpen(true);
+        }
+    };
+    const handleClear = (e) => {
+        e.stopPropagation();
+        const newRange = { from: null, to: null };
+        setRange(newRange);
+        onChange?.(newRange);
+    };
+    const getDisplayText = () => {
+        if (!range.from)
+            return '';
+        if (!range.to)
+            return formatDate(range.from, dateFormat);
+        return `${formatDate(range.from, dateFormat)} - ${formatDate(range.to, dateFormat)}`;
+    };
+    const inputClassName = `
+        ${baseInputStyles}
+        ${sizeStyles[size]}
+        ${hasError ? 'border-status-error focus:border-status-error focus:ring-status-error/20' : ''}
+        ${className}
+    `.trim().replace(/\s+/g, ' ');
+    return (_jsxs("div", { className: "w-full", ref: containerRef, children: [label && (_jsx("label", { className: "block text-sm font-medium text-text-primary mb-2", children: label })), _jsxs("div", { className: "relative", children: [_jsx(motion.div, { whileHover: !disabled ? { scale: 1.005 } : {}, transition: {
+                            type: 'spring',
+                            stiffness: 300,
+                            damping: 30,
+                        }, children: _jsx("input", { type: "text", readOnly: true, value: getDisplayText(), onClick: handleInputClick, placeholder: placeholder, disabled: disabled, className: inputClassName }) }), _jsxs("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [range.from && !disabled && (_jsx(motion.button, { whileHover: { scale: 1.1 }, whileTap: { scale: 0.9 }, onClick: handleClear, className: "p-1 rounded-md hover:bg-surface-secondary transition-apple", type: "button", children: _jsx("svg", { className: "w-4 h-4 text-text-tertiary", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), _jsx("svg", { className: "w-5 h-5 text-text-tertiary pointer-events-none", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) })] }), _jsx(AnimatePresence, { children: isOpen && (_jsx(Calendar, { range: range, onSelectDate: handleSelectDate, minDate: minDate, maxDate: maxDate, currentMonth: currentMonth, onMonthChange: setCurrentMonth })) })] }), (error || helperText) && (_jsx(motion.p, { initial: { opacity: 0, y: -4 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.16 }, className: `
+                        mt-2 text-sm
+                        ${hasError ? 'text-status-error' : 'text-text-secondary'}
+                    `, children: error || helperText }))] }));
+};
+DateRangePicker.displayName = 'DateRangePicker';
+//# sourceMappingURL=DateRangePicker.js.map

package/dist/components/DateRangePicker.js.map

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

package/dist/components/DefinitionList.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+export type DefinitionItem = {
+    term: React.ReactNode;
+    description: React.ReactNode;
+};
+export type DefinitionListVariant = 'default' | 'bordered' | 'striped' | 'compact';
+export type DefinitionListOrientation = 'horizontal' | 'vertical';
+export interface DefinitionListProps extends React.HTMLAttributes<HTMLDListElement> {
+    items: DefinitionItem[];
+    variant?: DefinitionListVariant;
+    orientation?: DefinitionListOrientation;
+    divider?: boolean;
+    hoverable?: boolean;
+    density?: 'comfortable' | 'compact';
+}
+export declare const DefinitionList: React.ForwardRefExoticComponent<DefinitionListProps & React.RefAttributes<HTMLDListElement>>;
+export interface CompactDefinitionListProps extends Omit<DefinitionListProps, 'density' | 'variant'> {
+    variant?: Exclude<DefinitionListVariant, 'compact'>;
+}
+export declare const CompactDefinitionList: React.ForwardRefExoticComponent<CompactDefinitionListProps & React.RefAttributes<HTMLDListElement>>;
+//# sourceMappingURL=DefinitionList.d.ts.map

package/dist/components/DefinitionList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefinitionList.d.ts","sourceRoot":"","sources":["../../components/DefinitionList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAQ1C,MAAM,MAAM,cAAc,GAAG;IACzB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AACnF,MAAM,MAAM,yBAAyB,GAAG,YAAY,GAAG,UAAU,CAAC;AAElE,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC;IAC/E,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,WAAW,CAAC,EAAE,yBAAyB,CAAC;IACxC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;CACvC;AAMD,eAAO,MAAM,cAAc,8FAsG1B,CAAC;AAQF,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,SAAS,CAAC;IAChG,OAAO,CAAC,EAAE,OAAO,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC;CACvD;AAED,eAAO,MAAM,qBAAqB,qGAIjC,CAAC"}

package/dist/components/DefinitionList.js

@@ -0,0 +1,44 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { motion } from 'framer-motion';
+import { cn } from '../lib/utils';
+/* ========================================
+   DEFINITION LIST COMPONENT
+   ======================================== */
+export const DefinitionList = forwardRef(({ items, variant = 'default', orientation = 'horizontal', divider = false, hoverable = false, density = 'comfortable', className, ...props }, ref) => {
+    const isHorizontal = orientation === 'horizontal';
+    const isCompact = density === 'compact';
+    const containerVariants = {
+        default: "bg-surface-primary",
+        bordered: "bg-surface-primary border border-border-primary rounded-xl",
+        striped: "bg-surface-primary",
+        compact: "bg-transparent",
+    };
+    const itemVariants = {
+        default: "",
+        bordered: "border-b border-border-primary last:border-b-0",
+        striped: "even:bg-surface-secondary/50",
+        compact: "",
+    };
+    const paddingClass = isCompact ? "py-2" : "py-3";
+    const gapClass = isCompact ? "gap-2" : "gap-4";
+    const MotionDL = motion.dl;
+    return (_jsx(MotionDL, { ref: ref, className: cn("overflow-hidden", containerVariants[variant], variant === 'bordered' && "shadow-sm", className), initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: {
+            duration: 0.22,
+            ease: [0.16, 1, 0.3, 1],
+        }, ...props, children: items.map((item, index) => (_jsxs(motion.div, { className: cn("group", itemVariants[variant], isHorizontal
+                ? `flex ${gapClass} ${paddingClass} px-4 sm:px-6`
+                : `flex flex-col ${gapClass} ${paddingClass} px-4 sm:px-6`, divider && index !== items.length - 1 && "border-b border-border-primary", hoverable && "transition-colors hover:bg-surface-secondary/30 cursor-default"), initial: { opacity: 0, x: -10 }, animate: { opacity: 1, x: 0 }, transition: {
+                duration: 0.2,
+                delay: index * 0.03,
+                ease: [0.16, 1, 0.3, 1],
+            }, children: [_jsx("dt", { className: cn("font-semibold text-text-primary", isHorizontal
+                        ? "min-w-[140px] sm:min-w-[180px] flex-shrink-0"
+                        : "mb-1", isCompact ? "text-sm" : "text-base"), children: item.term }), _jsx("dd", { className: cn("text-text-secondary", isHorizontal ? "flex-1" : "", isCompact ? "text-sm" : "text-base"), children: item.description })] }, index))) }));
+});
+DefinitionList.displayName = 'DefinitionList';
+export const CompactDefinitionList = forwardRef((props, ref) => {
+    return _jsx(DefinitionList, { ref: ref, ...props, density: "compact" });
+});
+CompactDefinitionList.displayName = 'CompactDefinitionList';
+//# sourceMappingURL=DefinitionList.js.map

package/dist/components/DefinitionList.js.map

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

package/dist/components/DescriptionBlock.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+export type DescriptionHighlightTrend = 'up' | 'down' | 'neutral';
+export interface DescriptionHighlightProps extends React.HTMLAttributes<HTMLDivElement> {
+    label: React.ReactNode;
+    value: React.ReactNode;
+    change?: React.ReactNode;
+    trend?: DescriptionHighlightTrend;
+    icon?: React.ReactNode;
+    badge?: React.ReactNode;
+    helper?: React.ReactNode;
+    emphasis?: 'default' | 'soft';
+    compact?: boolean;
+}
+export type DescriptionMetadataItem = {
+    label: React.ReactNode;
+    value: React.ReactNode;
+    icon?: React.ReactNode;
+    hint?: React.ReactNode;
+};
+export interface DescriptionBlockProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
+    eyebrow?: React.ReactNode;
+    title: React.ReactNode;
+    subtitle?: React.ReactNode;
+    description?: React.ReactNode;
+    badges?: React.ReactNode[];
+    metadata?: DescriptionMetadataItem[];
+    metadataColumns?: 1 | 2 | 3;
+    media?: React.ReactNode;
+    actions?: React.ReactNode;
+    footer?: React.ReactNode;
+    layout?: 'stacked' | 'split';
+    variant?: 'default' | 'soft' | 'panel' | 'glass';
+    align?: 'start' | 'center';
+}
+export declare const DescriptionBlock: React.ForwardRefExoticComponent<DescriptionBlockProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=DescriptionBlock.d.ts.map

package/dist/components/DescriptionBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DescriptionBlock.d.ts","sourceRoot":"","sources":["../../components/DescriptionBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAS1C,MAAM,MAAM,yBAAyB,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC;AAElE,MAAM,WAAW,yBAA0B,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACnF,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,yBAAyB,CAAC;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,uBAAuB,GAAG;IAClC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAC9F,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,uBAAuB,EAAE,CAAC;IACrC,eAAe,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC7B,OAAO,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAC;IACjD,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;CAC9B;AAMD,eAAO,MAAM,gBAAgB,8FAwI5B,CAAC"}

package/dist/components/DescriptionBlock.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { motion } from 'framer-motion';
+import { cn } from '../lib/utils';
+import { Badge } from './Badge';
+/* ========================================
+   DESCRIPTION BLOCK
+   ======================================== */
+export const DescriptionBlock = forwardRef(({ eyebrow, title, subtitle, description, badges, metadata, metadataColumns = 2, media, actions, footer, layout = 'stacked', variant = 'default', align = 'start', className, ...props }, ref) => {
+    const MotionSection = motion.section;
+    const variantClasses = {
+        default: 'bg-surface-primary border border-border-primary shadow-sm',
+        soft: 'bg-surface-secondary/60 border border-border-primary/50',
+        panel: 'bg-surface-primary/90 border border-border-primary shadow-lg',
+        glass: 'bg-white/5 dark:bg-white/2 backdrop-blur-2xl border border-white/10 shadow-[0_20px_80px_rgba(15,23,42,0.15)]',
+    };
+    const metadataGrid = {
+        1: 'grid-cols-1',
+        2: 'grid-cols-1 sm:grid-cols-2',
+        3: 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-3',
+    };
+    return (_jsxs(MotionSection, { ref: ref, className: cn('rounded-3xl p-6 sm:p-8 space-y-6', variantClasses[variant], className), initial: { opacity: 0, y: 20 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.3, ease: [0.16, 1, 0.3, 1] }, ...props, children: [_jsx("div", { className: cn(layout === 'split'
+                    ? 'grid gap-8 lg:grid-cols-[1.8fr_1fr]'
+                    : 'space-y-10'), children: _jsxs("div", { className: cn('space-y-7', align === 'center' && 'text-center items-center flex flex-col'), children: [eyebrow && (_jsx("p", { className: "text-xs font-semibold uppercase tracking-[0.35em] text-text-tertiary", children: eyebrow })), _jsxs("div", { className: "space-y-3 w-full", children: [_jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: cn('text-3xl font-semibold tracking-tight text-text-primary', align === 'center' && 'text-center'), children: title }), subtitle && (_jsx("p", { className: cn('text-lg text-text-secondary', align === 'center' && 'text-center'), children: subtitle }))] }), badges && badges.length > 0 && (_jsx("div", { className: cn('flex flex-wrap gap-2', align === 'center' && 'justify-center'), children: badges.map((badge, index) => (_jsx(Badge, { size: "sm", className: "bg-surface-secondary/60 border border-border-primary/60 text-text-secondary", children: badge }, index))) }))] }), description && (_jsx("div", { className: cn('text-base text-text-secondary leading-relaxed max-w-2xl', align === 'center' && 'mx-auto text-center'), children: description })), actions && (_jsx("div", { className: cn('flex flex-wrap gap-3', align === 'center' && 'justify-center'), children: actions })), media && (_jsx("div", { className: "overflow-hidden rounded-2xl border border-border-primary/60 bg-surface-secondary/40", children: media })), metadata && metadata.length > 0 && (_jsxs("div", { className: "space-y-4", children: [_jsx("p", { className: "text-xs font-semibold uppercase tracking-[0.3em] text-text-tertiary", children: "Detalles" }), _jsx("div", { className: cn('grid gap-6', metadataGrid[metadataColumns]), children: metadata.map((item, index) => (_jsxs("div", { className: "rounded-2xl border border-border-primary/40 bg-surface-secondary/30 p-5 space-y-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-xs font-semibold uppercase tracking-wide text-text-tertiary", children: [item.icon && _jsx("span", { className: "text-text-tertiary", children: item.icon }), _jsx("span", { children: item.label })] }), _jsx("div", { className: "text-text-primary text-lg font-semibold break-words", children: item.value }), item.hint && (_jsx("p", { className: "text-sm text-text-secondary", children: item.hint }))] }, index))) })] }))] }) }), layout === 'stacked' && footer && (_jsxs(_Fragment, { children: [_jsx("br", {}), _jsx("div", { className: "rounded-2xl border border-dashed border-border-primary/60 p-4 text-sm text-text-secondary", children: footer })] }))] }));
+});
+DescriptionBlock.displayName = 'DescriptionBlock';
+//# sourceMappingURL=DescriptionBlock.js.map

package/dist/components/DescriptionBlock.js.map

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

package/dist/components/DeviceList.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+export type DeviceType = 'phone' | 'tablet' | 'laptop' | 'desktop' | 'other';
+export type DeviceStatus = 'active' | 'inactive' | 'suspended';
+export interface Device {
+    id: string;
+    name: string;
+    type: DeviceType;
+    os?: string;
+    browser?: string;
+    lastActive?: string;
+    location?: string;
+    ipAddress?: string;
+    status: DeviceStatus;
+    isCurrentDevice?: boolean;
+}
+export interface DeviceListProps extends React.HTMLAttributes<HTMLDivElement> {
+    devices: Device[];
+    onRemove?: (device: Device) => void;
+    onMoreActions?: (device: Device) => void;
+    showActions?: boolean;
+    className?: string;
+}
+export declare const DeviceList: React.ForwardRefExoticComponent<DeviceListProps & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=DeviceList.d.ts.map

package/dist/components/DeviceList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceList.d.ts","sourceRoot":"","sources":["../../components/DeviceList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAC7E,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,UAAU,GAAG,WAAW,CAAC;AAE/D,MAAM,WAAW,MAAM;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,UAAU,CAAC;IACjB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,YAAY,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACzE,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAuCD,eAAO,MAAM,UAAU,wFA6FtB,CAAC"}

package/dist/components/DeviceList.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import { cn } from '../lib/utils';
+import { motion } from 'framer-motion';
+import { Smartphone, Monitor, Tablet, Laptop, Trash2, MoreVertical } from 'lucide-react';
+import { Button } from './Button';
+import { Badge } from './Badge';
+/* ========================================
+   HELPERS
+   ======================================== */
+const getDeviceIcon = (type) => {
+    switch (type) {
+        case 'phone':
+            return _jsx(Smartphone, { className: "w-5 h-5" });
+        case 'tablet':
+            return _jsx(Tablet, { className: "w-5 h-5" });
+        case 'laptop':
+            return _jsx(Laptop, { className: "w-5 h-5" });
+        case 'desktop':
+            return _jsx(Monitor, { className: "w-5 h-5" });
+        default:
+            return _jsx(Smartphone, { className: "w-5 h-5" });
+    }
+};
+const getStatusBadge = (status, isCurrent) => {
+    if (isCurrent) {
+        return _jsx(Badge, { variant: "success", size: "sm", children: "Current Device" });
+    }
+    switch (status) {
+        case 'active':
+            return _jsx(Badge, { variant: "success", size: "sm", children: "Active" });
+        case 'inactive':
+            return _jsx(Badge, { variant: "default", size: "sm", children: "Inactive" });
+        case 'suspended':
+            return _jsx(Badge, { variant: "error", size: "sm", children: "Suspended" });
+    }
+};
+/* ========================================
+   COMPONENT
+   ======================================== */
+export const DeviceList = React.forwardRef(({ devices, onRemove, onMoreActions, showActions = true, className, ...props }, ref) => {
+    return (_jsx("div", { ref: ref, className: cn("w-full space-y-2", className), ...props, children: devices.map((device, index) => (_jsxs(motion.div, { initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: { delay: index * 0.05 }, className: cn("flex items-center gap-4 p-4 rounded-xl border", "bg-surface-primary border-border-primary", "hover:bg-surface-secondary transition-colors"), children: [_jsx("div", { className: "flex-shrink-0 p-2 bg-surface-secondary rounded-lg text-text-tertiary", children: getDeviceIcon(device.type) }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsxs("div", { className: "flex items-center gap-2 mb-1", children: [_jsx("h3", { className: "text-sm font-semibold text-text-primary truncate", children: device.name }), getStatusBadge(device.status, device.isCurrentDevice)] }), _jsxs("div", { className: "flex flex-wrap items-center gap-3 text-xs text-text-secondary", children: [device.os && _jsx("span", { children: device.os }), device.browser && (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-text-tertiary", children: "\u2022" }), _jsx("span", { children: device.browser })] })), device.lastActive && (_jsxs(_Fragment, { children: [_jsx("span", { className: "text-text-tertiary", children: "\u2022" }), _jsxs("span", { children: ["Last active: ", device.lastActive] })] }))] }), device.location && (_jsx("p", { className: "text-xs text-text-tertiary mt-1", children: device.location }))] }), showActions && (_jsxs("div", { className: "flex-shrink-0 flex items-center gap-2", children: [onMoreActions && (_jsx(Button, { variant: "ghost", size: "sm", onClick: () => onMoreActions(device), children: _jsx(MoreVertical, { className: "w-4 h-4" }) })), onRemove && !device.isCurrentDevice && (_jsx(Button, { variant: "ghost", size: "sm", onClick: () => onRemove(device), children: _jsx(Trash2, { className: "w-4 h-4 text-status-error" }) }))] }))] }, device.id))) }));
+});
+DeviceList.displayName = 'DeviceList';
+//# sourceMappingURL=DeviceList.js.map

package/dist/components/DeviceList.js.map

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

package/dist/components/DiffViewer.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export type DiffViewMode = 'unified' | 'split';
+export interface DiffViewerProps {
+    oldText: string;
+    newText: string;
+    oldTitle?: string;
+    newTitle?: string;
+    initialMode?: DiffViewMode;
+    className?: string;
+    hideHeader?: boolean;
+}
+export declare const DiffViewer: React.FC<DiffViewerProps>;
+//# sourceMappingURL=DiffViewer.d.ts.map

package/dist/components/DiffViewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiffViewer.d.ts","sourceRoot":"","sources":["../../components/DiffViewer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,CAAC;AAE/C,MAAM,WAAW,eAAe;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAwED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyLhD,CAAC"}

package/dist/components/DiffViewer.js

@@ -0,0 +1,93 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from 'react';
+import { cn } from '../lib/utils';
+import { Button } from './Button';
+import { Columns, Rows } from 'lucide-react';
+/* ========================================
+   DIFF ALGORITHM (Simple LCS)
+   ======================================== */
+const computeDiff = (oldText, newText) => {
+    const oldLines = oldText.split('\n');
+    const newLines = newText.split('\n');
+    const N = oldLines.length;
+    const M = newLines.length;
+    // LCS Matrix
+    const lcs = Array(N + 1).fill(0).map(() => Array(M + 1).fill(0));
+    for (let i = 1; i <= N; i++) {
+        for (let j = 1; j <= M; j++) {
+            if (oldLines[i - 1] === newLines[j - 1]) {
+                lcs[i][j] = lcs[i - 1][j - 1] + 1;
+            }
+            else {
+                lcs[i][j] = Math.max(lcs[i - 1][j], lcs[i][j - 1]);
+            }
+        }
+    }
+    // Backtrack
+    const diff = [];
+    let i = N;
+    let j = M;
+    while (i > 0 || j > 0) {
+        if (i > 0 && j > 0 && oldLines[i - 1] === newLines[j - 1]) {
+            diff.unshift({
+                type: 'unchanged',
+                content: oldLines[i - 1],
+                oldLineNumber: i,
+                newLineNumber: j
+            });
+            i--;
+            j--;
+        }
+        else if (j > 0 && (i === 0 || lcs[i][j - 1] >= lcs[i - 1][j])) {
+            diff.unshift({
+                type: 'added',
+                content: newLines[j - 1],
+                newLineNumber: j
+            });
+            j--;
+        }
+        else {
+            diff.unshift({
+                type: 'removed',
+                content: oldLines[i - 1],
+                oldLineNumber: i
+            });
+            i--;
+        }
+    }
+    return diff;
+};
+/* ========================================
+   COMPONENTS
+   ======================================== */
+export const DiffViewer = ({ oldText, newText, oldTitle = 'Original', newTitle = 'Modified', initialMode = 'unified', className, hideHeader = false, }) => {
+    const [mode, setMode] = useState(initialMode);
+    const diffLines = useMemo(() => computeDiff(oldText, newText), [oldText, newText]);
+    const renderUnified = () => (_jsx("div", { className: "font-mono text-xs", children: diffLines.map((line, idx) => (_jsxs("div", { className: cn("flex", line.type === 'added' && "bg-green-100/50 dark:bg-green-900/20", line.type === 'removed' && "bg-red-100/50 dark:bg-red-900/20", line.type === 'unchanged' && "hover:bg-black/5 dark:hover:bg-white/5"), children: [_jsx("div", { className: "flex-none w-12 text-right pr-4 py-0.5 select-none text-text-tertiary border-r border-border-primary/30 opacity-50", children: line.oldLineNumber || '' }), _jsx("div", { className: "flex-none w-12 text-right pr-4 py-0.5 select-none text-text-tertiary border-r border-border-primary/30 opacity-50", children: line.newLineNumber || '' }), _jsxs("div", { className: cn("flex-none w-8 text-center py-0.5 select-none font-bold", line.type === 'added' && "text-green-600 dark:text-green-400", line.type === 'removed' && "text-red-600 dark:text-red-400", line.type === 'unchanged' && "text-text-secondary"), children: [line.type === 'added' && '+', line.type === 'removed' && '-'] }), _jsx("div", { className: cn("flex-1 py-0.5 px-4 whitespace-pre-wrap break-all", line.type === 'added' && "text-green-900 dark:text-green-100", line.type === 'removed' && "text-red-900 dark:text-red-100 line-through opacity-70", line.type === 'unchanged' && "text-text-secondary"), children: line.content })] }, idx))) }));
+    const renderSplit = () => {
+        // For split view, we need to align changes. 
+        // This simple implementation just renders two columns but doesn't perfectly align complex diff blocks vertically 
+        // like a sophisticated diff tool (e.g. GitHub) would with empty spacers.
+        // To improve this without deps, we can process the diffLines to insert "empty" placeholders.
+        const leftSide = [];
+        const rightSide = [];
+        diffLines.forEach(line => {
+            if (line.type === 'unchanged') {
+                leftSide.push(line);
+                rightSide.push(line);
+            }
+            else if (line.type === 'removed') {
+                leftSide.push(line);
+                rightSide.push({ type: 'unchanged', content: '', newLineNumber: undefined }); // Placeholder
+            }
+            else if (line.type === 'added') {
+                leftSide.push({ type: 'unchanged', content: '', oldLineNumber: undefined }); // Placeholder
+                rightSide.push(line);
+            }
+        });
+        return (_jsxs("div", { className: "flex font-mono text-xs divide-x divide-border-primary/30", children: [_jsx("div", { className: "flex-1 min-w-0", children: leftSide.map((line, idx) => (_jsxs("div", { className: cn("flex", line.type === 'removed' && "bg-red-100/50 dark:bg-red-900/20", !line.oldLineNumber && line.content === '' && "bg-black/5 dark:bg-white/5" // Placeholder styling
+                        ), children: [_jsx("div", { className: "flex-none w-12 text-right pr-4 py-0.5 select-none text-text-tertiary border-r border-border-primary/30 opacity-50", children: line.oldLineNumber || '' }), _jsx("div", { className: cn("flex-1 py-0.5 px-4 whitespace-pre-wrap break-all", line.type === 'removed' ? "text-red-900 dark:text-red-100" : "text-text-secondary", !line.oldLineNumber && "select-none"), children: line.content })] }, idx))) }), _jsx("div", { className: "flex-1 min-w-0", children: rightSide.map((line, idx) => (_jsxs("div", { className: cn("flex", line.type === 'added' && "bg-green-100/50 dark:bg-green-900/20", !line.newLineNumber && line.content === '' && "bg-black/5 dark:bg-white/5"), children: [_jsx("div", { className: "flex-none w-12 text-right pr-4 py-0.5 select-none text-text-tertiary border-r border-border-primary/30 opacity-50", children: line.newLineNumber || '' }), _jsx("div", { className: cn("flex-1 py-0.5 px-4 whitespace-pre-wrap break-all", line.type === 'added' ? "text-green-900 dark:text-green-100" : "text-text-secondary", !line.newLineNumber && "select-none"), children: line.content })] }, idx))) })] }));
+    };
+    return (_jsxs("div", { className: cn("border border-border-primary/50 rounded-lg overflow-hidden bg-surface-primary", className), children: [!hideHeader && (_jsxs("div", { className: "flex items-center justify-between px-4 py-2 bg-surface-secondary border-b border-border-primary/50", children: [_jsxs("div", { className: "flex items-center gap-4 text-sm", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-red-500/50" }), _jsx("span", { className: "font-medium text-text-secondary", children: oldTitle })] }), _jsx("span", { className: "text-text-tertiary", children: "\u2192" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "w-2 h-2 rounded-full bg-green-500/50" }), _jsx("span", { className: "font-medium text-text-secondary", children: newTitle })] })] }), _jsxs("div", { className: "flex bg-surface-primary rounded-md p-0.5 border border-border-primary/50", children: [_jsxs(Button, { variant: "ghost", size: "sm", onClick: () => setMode('unified'), className: cn("h-6 px-2 text-xs gap-1.5", mode === 'unified' ? "bg-surface-secondary shadow-sm text-text-primary" : "text-text-tertiary"), children: [_jsx(Rows, { className: "w-3.5 h-3.5" }), "Unified"] }), _jsxs(Button, { variant: "ghost", size: "sm", onClick: () => setMode('split'), className: cn("h-6 px-2 text-xs gap-1.5", mode === 'split' ? "bg-surface-secondary shadow-sm text-text-primary" : "text-text-tertiary"), children: [_jsx(Columns, { className: "w-3.5 h-3.5" }), "Split"] })] })] })), _jsx("div", { className: "overflow-x-auto", children: mode === 'unified' ? renderUnified() : renderSplit() })] }));
+};
+//# sourceMappingURL=DiffViewer.js.map