@ryanhe919/lumen-ui 0.2.1 → 0.3.0

package/dist/LMButton-S4xQSohi.js

@@ -0,0 +1,334 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { memo } from "react";
+import { c as clampComponentSize, k as SIZE_BUTTON_CONFIG, b as SIZE_TEXT_CLASSES, f as SIZE_GAP_CLASSES, C as COMPONENT_SIZE_ORDER } from "./componentSizes-CdWNL526.js";
+const LoadingSpinner = ({ style }) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    className: "animate-spin h-4 w-4",
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    style,
+    children: [
+      /* @__PURE__ */ jsx(
+        "circle",
+        {
+          className: "opacity-25",
+          cx: "12",
+          cy: "12",
+          r: "10",
+          stroke: "currentColor",
+          strokeWidth: "4"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          className: "opacity-75",
+          fill: "currentColor",
+          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+        }
+      )
+    ]
+  }
+);
+const LMButton = ({
+  children,
+  variant = "primary",
+  size = "md",
+  loading = false,
+  loadingText,
+  leftIcon,
+  rightIcon,
+  fullWidth = false,
+  rounded = false,
+  disabled = false,
+  className = "",
+  ...props
+}) => {
+  const isDisabled = disabled || loading;
+  const resolvedSize = clampComponentSize(size, COMPONENT_SIZE_ORDER);
+  const roundedClasses = rounded ? "rounded-full" : "rounded-xl";
+  const widthClasses = fullWidth ? "w-full" : "";
+  const baseClassName = `
+    ${SIZE_BUTTON_CONFIG[resolvedSize].padding} ${SIZE_TEXT_CLASSES[resolvedSize]} ${SIZE_GAP_CLASSES[resolvedSize]}
+    ${roundedClasses} ${widthClasses}
+    border font-medium
+    focus:ring-2 focus:ring-offset-0 focus:outline-none
+    disabled:cursor-not-allowed
+    flex items-center justify-center
+    cursor-pointer select-none
+    ${className}
+  `.trim().replace(/\s+/g, " ");
+  const getButtonStyles = () => {
+    const baseStyles = {
+      backgroundColor: "var(--lm-bg-elevated)",
+      color: "var(--lm-text-primary)",
+      borderColor: "var(--lm-border-default)",
+      boxShadow: "var(--lm-shadow-sm)",
+      transition: "all var(--lm-transition-normal) var(--lm-ease-out)"
+    };
+    switch (variant) {
+      case "primary":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-primary-500)",
+          color: "white",
+          borderColor: "transparent",
+          boxShadow: "var(--lm-shadow-md)",
+          "--tw-ring-color": "var(--lm-primary-400)",
+          "--tw-ring-opacity": "0.4"
+        };
+      case "secondary":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-bg-elevated)",
+          color: "var(--lm-text-primary)",
+          borderColor: "var(--lm-border-default)",
+          "--tw-ring-color": "var(--lm-primary-400)",
+          "--tw-ring-opacity": "0.3"
+        };
+      case "outline":
+        return {
+          ...baseStyles,
+          backgroundColor: "transparent",
+          color: "var(--lm-primary-500)",
+          borderColor: "var(--lm-primary-400)",
+          boxShadow: "none",
+          "--tw-ring-color": "var(--lm-primary-400)",
+          "--tw-ring-opacity": "0.3"
+        };
+      case "ghost":
+        return {
+          ...baseStyles,
+          backgroundColor: "transparent",
+          color: "var(--lm-text-primary)",
+          borderColor: "transparent",
+          boxShadow: "none",
+          "--tw-ring-color": "var(--lm-primary-400)",
+          "--tw-ring-opacity": "0.3"
+        };
+      case "danger":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-error-500)",
+          color: "white",
+          borderColor: "transparent",
+          boxShadow: "var(--lm-shadow-md)",
+          "--tw-ring-color": "var(--lm-error-400)",
+          "--tw-ring-opacity": "0.4"
+        };
+      case "success":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-success-500)",
+          color: "white",
+          borderColor: "transparent",
+          boxShadow: "var(--lm-shadow-md)",
+          "--tw-ring-color": "var(--lm-success-400)",
+          "--tw-ring-opacity": "0.4"
+        };
+      case "warning":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-warning-500)",
+          color: "white",
+          borderColor: "transparent",
+          boxShadow: "var(--lm-shadow-md)",
+          "--tw-ring-color": "var(--lm-warning-400)",
+          "--tw-ring-opacity": "0.4"
+        };
+      default:
+        return baseStyles;
+    }
+  };
+  const getDisabledStyles = () => {
+    if (isDisabled) {
+      return {
+        backgroundColor: "var(--lm-bg-paper)",
+        color: "var(--lm-text-disabled)",
+        borderColor: "var(--lm-border-light)",
+        cursor: "not-allowed",
+        opacity: 0.6
+      };
+    }
+    return {};
+  };
+  const getHoverStyles = () => {
+    if (isDisabled) return {};
+    const baseHover = {
+      transform: "scale(1.02)"
+    };
+    switch (variant) {
+      case "primary":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-primary-600)",
+          boxShadow: "var(--lm-shadow-lg)"
+        };
+      case "secondary":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-bg-hover)",
+          borderColor: "var(--lm-border-strong)"
+        };
+      case "outline":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-primary-50)",
+          borderColor: "var(--lm-primary-500)"
+        };
+      case "ghost":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-bg-hover)"
+        };
+      case "danger":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-error-600)",
+          boxShadow: "var(--lm-shadow-lg)"
+        };
+      case "success":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-success-600)",
+          boxShadow: "var(--lm-shadow-lg)"
+        };
+      case "warning":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-warning-600)",
+          boxShadow: "var(--lm-shadow-lg)"
+        };
+      default:
+        return baseHover;
+    }
+  };
+  const getActiveStyles = () => {
+    if (isDisabled) return {};
+    const baseActive = {
+      transform: "scale(0.98)"
+    };
+    switch (variant) {
+      case "primary":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-primary-700)"
+        };
+      case "secondary":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-bg-active)"
+        };
+      case "outline":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-primary-100)"
+        };
+      case "ghost":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-bg-active)"
+        };
+      case "danger":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-error-700)"
+        };
+      case "success":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-success-700)"
+        };
+      case "warning":
+        return {
+          ...baseActive,
+          backgroundColor: "var(--lm-warning-700)"
+        };
+      default:
+        return baseActive;
+    }
+  };
+  const getIconStyles = () => {
+    if (isDisabled) {
+      return { color: "var(--lm-text-disabled)" };
+    }
+    switch (variant) {
+      case "primary":
+      case "danger":
+      case "success":
+      case "warning":
+        return { color: "white" };
+      case "outline":
+        return { color: "var(--lm-primary-600)" };
+      default:
+        return { color: "var(--lm-text-primary)" };
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ...props,
+      disabled: isDisabled,
+      className: baseClassName,
+      style: {
+        ...getButtonStyles(),
+        ...getDisabledStyles()
+      },
+      onMouseEnter: (e) => {
+        var _a;
+        if (!isDisabled) Object.assign(e.currentTarget.style, getHoverStyles());
+        (_a = props.onMouseEnter) == null ? void 0 : _a.call(props, e);
+      },
+      onMouseLeave: (e) => {
+        var _a;
+        if (!isDisabled)
+          Object.assign(e.currentTarget.style, {
+            ...getButtonStyles(),
+            ...getDisabledStyles()
+          });
+        (_a = props.onMouseLeave) == null ? void 0 : _a.call(props, e);
+      },
+      onMouseDown: (e) => {
+        var _a;
+        if (!isDisabled) Object.assign(e.currentTarget.style, getActiveStyles());
+        (_a = props.onMouseDown) == null ? void 0 : _a.call(props, e);
+      },
+      onMouseUp: (e) => {
+        var _a;
+        if (!isDisabled) Object.assign(e.currentTarget.style, getHoverStyles());
+        (_a = props.onMouseUp) == null ? void 0 : _a.call(props, e);
+      },
+      onFocus: (e) => {
+        var _a;
+        if (!isDisabled) {
+          e.currentTarget.style.borderColor = "var(--lm-primary-400)";
+        }
+        (_a = props.onFocus) == null ? void 0 : _a.call(props, e);
+      },
+      onBlur: (e) => {
+        var _a;
+        if (!isDisabled)
+          Object.assign(e.currentTarget.style, {
+            ...getButtonStyles(),
+            ...getDisabledStyles()
+          });
+        (_a = props.onBlur) == null ? void 0 : _a.call(props, e);
+      },
+      children: loading ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(LoadingSpinner, { style: getIconStyles() }),
+        loadingText || children
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        leftIcon && /* @__PURE__ */ jsx("span", { style: getIconStyles(), children: leftIcon }),
+        /* @__PURE__ */ jsx("span", { className: "inline-flex items-center", children }),
+        rightIcon && /* @__PURE__ */ jsx("span", { style: getIconStyles(), children: rightIcon })
+      ] })
+    }
+  );
+};
+const LMButton$1 = memo(LMButton);
+export {
+  LMButton$1 as L
+};
+//# sourceMappingURL=LMButton-S4xQSohi.js.map

package/dist/LMButton-S4xQSohi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LMButton-S4xQSohi.js","sources":["../src/components/General/LMButton/LMButton.tsx"],"sourcesContent":["import React, { memo } from 'react'\nimport {\n  COMPONENT_SIZE_ORDER,\n  SIZE_GAP_CLASSES,\n  SIZE_TEXT_CLASSES,\n  SIZE_BUTTON_CONFIG,\n  clampComponentSize,\n} from '../../../utils/componentSizes'\nimport type { ComponentSize } from '../../../utils/componentSizes'\n\nconst LoadingSpinner: React.FC<{ style?: React.CSSProperties }> = ({ style }) => (\n  <svg\n    className=\"animate-spin h-4 w-4\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    style={style}\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      fill=\"currentColor\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n    />\n  </svg>\n)\n\nexport type LMButtonVariant =\n  | 'primary'\n  | 'secondary'\n  | 'outline'\n  | 'ghost'\n  | 'danger'\n  | 'success'\n  | 'warning'\n\nexport interface LMButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Button variant */\n  variant?: LMButtonVariant\n  /** Size */\n  size?: ComponentSize\n  /** Loading state */\n  loading?: boolean\n  /** Loading text */\n  loadingText?: string\n  /** Left icon */\n  leftIcon?: React.ReactNode\n  /** Right icon */\n  rightIcon?: React.ReactNode\n  /** Full width */\n  fullWidth?: boolean\n  /** Full rounded */\n  rounded?: boolean\n}\n\nconst LMButton: React.FC<LMButtonProps> = ({\n  children,\n  variant = 'primary',\n  size = 'md',\n  loading = false,\n  loadingText,\n  leftIcon,\n  rightIcon,\n  fullWidth = false,\n  rounded = false,\n  disabled = false,\n  className = '',\n  ...props\n}) => {\n  const isDisabled = disabled || loading\n  const resolvedSize = clampComponentSize(size, COMPONENT_SIZE_ORDER)\n\n  // Apple-like refined border radius (12px default, full for pill)\n  const roundedClasses = rounded ? 'rounded-full' : 'rounded-xl'\n  const widthClasses = fullWidth ? 'w-full' : ''\n\n  // Apple-like base styling with refined transitions\n  const baseClassName = `\n    ${SIZE_BUTTON_CONFIG[resolvedSize].padding} ${SIZE_TEXT_CLASSES[resolvedSize]} ${SIZE_GAP_CLASSES[resolvedSize]}\n    ${roundedClasses} ${widthClasses}\n    border font-medium\n    focus:ring-2 focus:ring-offset-0 focus:outline-none\n    disabled:cursor-not-allowed\n    flex items-center justify-center\n    cursor-pointer select-none\n    ${className}\n  `\n    .trim()\n    .replace(/\\s+/g, ' ')\n\n  const getButtonStyles = () => {\n    // Apple-like base styles with refined shadows and transitions\n    const baseStyles = {\n      backgroundColor: 'var(--lm-bg-elevated)',\n      color: 'var(--lm-text-primary)',\n      borderColor: 'var(--lm-border-default)',\n      boxShadow: 'var(--lm-shadow-sm)',\n      transition: 'all var(--lm-transition-normal) var(--lm-ease-out)',\n    }\n\n    switch (variant) {\n      case 'primary':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-primary-500)',\n          color: 'white',\n          borderColor: 'transparent',\n          boxShadow: 'var(--lm-shadow-md)',\n          '--tw-ring-color': 'var(--lm-primary-400)',\n          '--tw-ring-opacity': '0.4',\n        }\n      case 'secondary':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-bg-elevated)',\n          color: 'var(--lm-text-primary)',\n          borderColor: 'var(--lm-border-default)',\n          '--tw-ring-color': 'var(--lm-primary-400)',\n          '--tw-ring-opacity': '0.3',\n        }\n      case 'outline':\n        return {\n          ...baseStyles,\n          backgroundColor: 'transparent',\n          color: 'var(--lm-primary-500)',\n          borderColor: 'var(--lm-primary-400)',\n          boxShadow: 'none',\n          '--tw-ring-color': 'var(--lm-primary-400)',\n          '--tw-ring-opacity': '0.3',\n        }\n      case 'ghost':\n        return {\n          ...baseStyles,\n          backgroundColor: 'transparent',\n          color: 'var(--lm-text-primary)',\n          borderColor: 'transparent',\n          boxShadow: 'none',\n          '--tw-ring-color': 'var(--lm-primary-400)',\n          '--tw-ring-opacity': '0.3',\n        }\n      case 'danger':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-error-500)',\n          color: 'white',\n          borderColor: 'transparent',\n          boxShadow: 'var(--lm-shadow-md)',\n          '--tw-ring-color': 'var(--lm-error-400)',\n          '--tw-ring-opacity': '0.4',\n        }\n      case 'success':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-success-500)',\n          color: 'white',\n          borderColor: 'transparent',\n          boxShadow: 'var(--lm-shadow-md)',\n          '--tw-ring-color': 'var(--lm-success-400)',\n          '--tw-ring-opacity': '0.4',\n        }\n      case 'warning':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-warning-500)',\n          color: 'white',\n          borderColor: 'transparent',\n          boxShadow: 'var(--lm-shadow-md)',\n          '--tw-ring-color': 'var(--lm-warning-400)',\n          '--tw-ring-opacity': '0.4',\n        }\n      default:\n        return baseStyles\n    }\n  }\n\n  const getDisabledStyles = () => {\n    if (isDisabled) {\n      return {\n        backgroundColor: 'var(--lm-bg-paper)',\n        color: 'var(--lm-text-disabled)',\n        borderColor: 'var(--lm-border-light)',\n        cursor: 'not-allowed',\n        opacity: 0.6,\n      }\n    }\n    return {}\n  }\n\n  // Apple-like subtle hover with scale effect\n  const getHoverStyles = () => {\n    if (isDisabled) return {}\n\n    const baseHover = {\n      transform: 'scale(1.02)',\n    }\n\n    switch (variant) {\n      case 'primary':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-primary-600)',\n          boxShadow: 'var(--lm-shadow-lg)',\n        }\n      case 'secondary':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-bg-hover)',\n          borderColor: 'var(--lm-border-strong)',\n        }\n      case 'outline':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-primary-50)',\n          borderColor: 'var(--lm-primary-500)',\n        }\n      case 'ghost':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-bg-hover)',\n        }\n      case 'danger':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-error-600)',\n          boxShadow: 'var(--lm-shadow-lg)',\n        }\n      case 'success':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-success-600)',\n          boxShadow: 'var(--lm-shadow-lg)',\n        }\n      case 'warning':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-warning-600)',\n          boxShadow: 'var(--lm-shadow-lg)',\n        }\n      default:\n        return baseHover\n    }\n  }\n\n  // Apple-like pressed state with scale down\n  const getActiveStyles = () => {\n    if (isDisabled) return {}\n\n    const baseActive = {\n      transform: 'scale(0.98)',\n    }\n\n    switch (variant) {\n      case 'primary':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-primary-700)',\n        }\n      case 'secondary':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-bg-active)',\n        }\n      case 'outline':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-primary-100)',\n        }\n      case 'ghost':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-bg-active)',\n        }\n      case 'danger':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-error-700)',\n        }\n      case 'success':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-success-700)',\n        }\n      case 'warning':\n        return {\n          ...baseActive,\n          backgroundColor: 'var(--lm-warning-700)',\n        }\n      default:\n        return baseActive\n    }\n  }\n\n  const getIconStyles = () => {\n    if (isDisabled) {\n      return { color: 'var(--lm-text-disabled)' }\n    }\n    switch (variant) {\n      case 'primary':\n      case 'danger':\n      case 'success':\n      case 'warning':\n        return { color: 'white' }\n      case 'outline':\n        return { color: 'var(--lm-primary-600)' }\n      default:\n        return { color: 'var(--lm-text-primary)' }\n    }\n  }\n\n  return (\n    <button\n      {...props}\n      disabled={isDisabled}\n      className={baseClassName}\n      style={{\n        ...getButtonStyles(),\n        ...getDisabledStyles(),\n      } as React.CSSProperties}\n      onMouseEnter={(e) => {\n        if (!isDisabled) Object.assign(e.currentTarget.style, getHoverStyles())\n        props.onMouseEnter?.(e)\n      }}\n      onMouseLeave={(e) => {\n        if (!isDisabled)\n          Object.assign(e.currentTarget.style, {\n            ...getButtonStyles(),\n            ...getDisabledStyles(),\n          })\n        props.onMouseLeave?.(e)\n      }}\n      onMouseDown={(e) => {\n        if (!isDisabled) Object.assign(e.currentTarget.style, getActiveStyles())\n        props.onMouseDown?.(e)\n      }}\n      onMouseUp={(e) => {\n        if (!isDisabled) Object.assign(e.currentTarget.style, getHoverStyles())\n        props.onMouseUp?.(e)\n      }}\n      onFocus={(e) => {\n        if (!isDisabled) {\n          e.currentTarget.style.borderColor = 'var(--lm-primary-400)'\n        }\n        props.onFocus?.(e)\n      }}\n      onBlur={(e) => {\n        if (!isDisabled)\n          Object.assign(e.currentTarget.style, {\n            ...getButtonStyles(),\n            ...getDisabledStyles(),\n          })\n        props.onBlur?.(e)\n      }}\n    >\n      {loading ? (\n        <>\n          <LoadingSpinner style={getIconStyles()} />\n          {loadingText || children}\n        </>\n      ) : (\n        <>\n          {leftIcon && <span style={getIconStyles()}>{leftIcon}</span>}\n          <span className=\"inline-flex items-center\">{children}</span>\n          {rightIcon && <span style={getIconStyles()}>{rightIcon}</span>}\n        </>\n      )}\n    </button>\n  )\n}\n\nexport default memo(LMButton)\n"],"names":[],"mappings":"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"}

package/dist/LMCard-D7ABNC95.js

@@ -0,0 +1,207 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { c as clampComponentSize, e as SIZE_PADDING_CLASSES, f as SIZE_GAP_CLASSES, b as SIZE_TEXT_CLASSES, C as COMPONENT_SIZE_ORDER } from "./componentSizes-CdWNL526.js";
+const LMCard = ({
+  title,
+  extra,
+  children,
+  size = "md",
+  bordered = true,
+  hoverable = false,
+  loading = false,
+  cover,
+  actions,
+  variant = "default",
+  className = "",
+  ...rest
+}) => {
+  const resolvedSize = clampComponentSize(size, COMPONENT_SIZE_ORDER);
+  const [isHovered, setIsHovered] = useState(false);
+  const titleTextClasses = {
+    xs: "text-sm",
+    sm: "text-sm",
+    md: "text-base",
+    lg: "text-lg",
+    xl: "text-xl",
+    "2xl": "text-2xl"
+  };
+  const roundedClasses = "rounded-xl";
+  const borderClasses = bordered ? "border" : "";
+  const hoverableClasses = hoverable ? "cursor-pointer" : "";
+  const baseClassName = `
+    ${roundedClasses} ${borderClasses} ${hoverableClasses}
+    overflow-hidden
+    ${className}
+  `.trim().replace(/\s+/g, " ");
+  const getCardStyles = () => {
+    const baseStyles = {
+      backgroundColor: "var(--lm-bg-elevated)",
+      borderColor: "var(--lm-border-default)",
+      boxShadow: "var(--lm-shadow-sm)",
+      transition: "all var(--lm-transition-normal) var(--lm-ease-out)"
+    };
+    switch (variant) {
+      case "elevated":
+        return {
+          ...baseStyles,
+          boxShadow: "var(--lm-shadow-md)"
+        };
+      case "outline":
+        return {
+          ...baseStyles,
+          backgroundColor: "transparent",
+          borderColor: "var(--lm-border-strong)",
+          boxShadow: "none"
+        };
+      case "soft":
+        return {
+          ...baseStyles,
+          backgroundColor: "var(--lm-bg-paper)",
+          borderColor: "var(--lm-border-light)",
+          boxShadow: "none"
+        };
+      default:
+        return baseStyles;
+    }
+  };
+  const getHoverStyles = () => {
+    if (!hoverable) return {};
+    const baseHover = {
+      boxShadow: "var(--lm-shadow-lg)",
+      borderColor: "var(--lm-border-strong)",
+      transform: "scale(1.01)"
+    };
+    switch (variant) {
+      case "elevated":
+        return {
+          ...baseHover,
+          boxShadow: "var(--lm-shadow-xl)"
+        };
+      case "outline":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-bg-hover)",
+          boxShadow: "var(--lm-shadow-md)"
+        };
+      case "soft":
+        return {
+          ...baseHover,
+          backgroundColor: "var(--lm-bg-hover)",
+          boxShadow: "var(--lm-shadow-md)"
+        };
+      default:
+        return baseHover;
+    }
+  };
+  const currentStyles = isHovered && hoverable ? { ...getCardStyles(), ...getHoverStyles() } : getCardStyles();
+  const renderSkeleton = () => /* @__PURE__ */ jsxs("div", { className: "animate-pulse", children: [
+    title && /* @__PURE__ */ jsx("div", { className: "mb-4", children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "h-4 rounded w-1/3",
+        style: { backgroundColor: "var(--lm-bg-active)" }
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "h-4 rounded w-full",
+          style: { backgroundColor: "var(--lm-bg-active)" }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "h-4 rounded w-5/6",
+          style: { backgroundColor: "var(--lm-bg-active)" }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "h-4 rounded w-4/6",
+          style: { backgroundColor: "var(--lm-bg-active)" }
+        }
+      )
+    ] })
+  ] });
+  const renderHeader = () => {
+    var _a;
+    if (!title && !extra) return null;
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `flex items-center justify-between ${SIZE_GAP_CLASSES[resolvedSize]} border-b`,
+        style: {
+          borderColor: "var(--lm-border-light)",
+          padding: `${SIZE_PADDING_CLASSES[resolvedSize].split(" ")[0].replace("px-", "")}rem ${((_a = SIZE_PADDING_CLASSES[resolvedSize].split(" ")[1]) == null ? void 0 : _a.replace("py-", "")) || "1"}rem`,
+          paddingLeft: "1rem",
+          paddingRight: "1rem",
+          paddingTop: "0.75rem",
+          paddingBottom: "0.75rem"
+        },
+        children: [
+          title && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `${titleTextClasses[resolvedSize]} font-semibold`,
+              style: { color: "var(--lm-text-primary)" },
+              children: title
+            }
+          ),
+          extra && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: SIZE_TEXT_CLASSES[resolvedSize],
+              style: { color: "var(--lm-text-secondary)" },
+              children: extra
+            }
+          )
+        ]
+      }
+    );
+  };
+  const renderActions = () => {
+    if (!actions || actions.length === 0) return null;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex items-center border-t",
+        style: { borderColor: "var(--lm-border-light)" },
+        children: actions.map((action, index) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `flex-1 flex items-center justify-center py-3 transition-colors duration-200 hover:bg-(--lm-bg-hover) ${index !== actions.length - 1 ? "border-r" : ""}`,
+            style: {
+              borderColor: "var(--lm-border-light)",
+              color: "var(--lm-text-secondary)"
+            },
+            children: action
+          },
+          index
+        ))
+      }
+    );
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: baseClassName,
+      style: currentStyles,
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
+      ...rest,
+      children: [
+        cover && /* @__PURE__ */ jsx("div", { className: "w-full overflow-hidden", children: cover }),
+        renderHeader(),
+        /* @__PURE__ */ jsx("div", { className: SIZE_PADDING_CLASSES[resolvedSize], children: loading ? renderSkeleton() : children }),
+        renderActions()
+      ]
+    }
+  );
+};
+export {
+  LMCard as L
+};
+//# sourceMappingURL=LMCard-D7ABNC95.js.map

package/dist/LMCard-D7ABNC95.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LMCard-D7ABNC95.js","sources":["../src/components/DataDisplay/LMCard/LMCard.tsx"],"sourcesContent":["import React, { useState } from 'react'\nimport {\n  COMPONENT_SIZE_ORDER,\n  SIZE_PADDING_CLASSES,\n  SIZE_TEXT_CLASSES,\n  SIZE_GAP_CLASSES,\n  clampComponentSize,\n} from '../../../utils/componentSizes'\nimport type { ComponentSize } from '../../../utils/componentSizes'\n\nexport interface LMCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  /** Card title */\n  title?: React.ReactNode\n  /** Extra content in the top-right corner */\n  extra?: React.ReactNode\n  /** Card content */\n  children: React.ReactNode\n  /** Card size */\n  size?: ComponentSize\n  /** Show border */\n  bordered?: boolean\n  /** Hoverable effect */\n  hoverable?: boolean\n  /** Loading state - shows skeleton */\n  loading?: boolean\n  /** Cover image at top */\n  cover?: React.ReactNode\n  /** Actions at bottom */\n  actions?: React.ReactNode[]\n  /** Visual variant */\n  variant?: 'default' | 'elevated' | 'outline' | 'soft'\n  /** Custom class name */\n  className?: string\n}\n\nconst LMCard: React.FC<LMCardProps> = ({\n  title,\n  extra,\n  children,\n  size = 'md',\n  bordered = true,\n  hoverable = false,\n  loading = false,\n  cover,\n  actions,\n  variant = 'default',\n  className = '',\n  ...rest\n}) => {\n  const resolvedSize = clampComponentSize(size, COMPONENT_SIZE_ORDER)\n  const [isHovered, setIsHovered] = useState(false)\n\n  const titleTextClasses: Record<ComponentSize, string> = {\n    xs: 'text-sm',\n    sm: 'text-sm',\n    md: 'text-base',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n  }\n\n  // Apple-like refined border radius\n  const roundedClasses = 'rounded-xl'\n  const borderClasses = bordered ? 'border' : ''\n  const hoverableClasses = hoverable ? 'cursor-pointer' : ''\n\n  // Apple-like card styling\n  const baseClassName = `\n    ${roundedClasses} ${borderClasses} ${hoverableClasses}\n    overflow-hidden\n    ${className}\n  `\n    .trim()\n    .replace(/\\s+/g, ' ')\n\n  const getCardStyles = (): React.CSSProperties => {\n    // Apple-like refined card styles with smooth transitions\n    const baseStyles: React.CSSProperties = {\n      backgroundColor: 'var(--lm-bg-elevated)',\n      borderColor: 'var(--lm-border-default)',\n      boxShadow: 'var(--lm-shadow-sm)',\n      transition: 'all var(--lm-transition-normal) var(--lm-ease-out)',\n    }\n\n    switch (variant) {\n      case 'elevated':\n        return {\n          ...baseStyles,\n          boxShadow: 'var(--lm-shadow-md)',\n        }\n      case 'outline':\n        return {\n          ...baseStyles,\n          backgroundColor: 'transparent',\n          borderColor: 'var(--lm-border-strong)',\n          boxShadow: 'none',\n        }\n      case 'soft':\n        return {\n          ...baseStyles,\n          backgroundColor: 'var(--lm-bg-paper)',\n          borderColor: 'var(--lm-border-light)',\n          boxShadow: 'none',\n        }\n      default:\n        return baseStyles\n    }\n  }\n\n  // Apple-like subtle hover with scale effect (not translateY)\n  const getHoverStyles = (): React.CSSProperties => {\n    if (!hoverable) return {}\n\n    const baseHover: React.CSSProperties = {\n      boxShadow: 'var(--lm-shadow-lg)',\n      borderColor: 'var(--lm-border-strong)',\n      transform: 'scale(1.01)',\n    }\n\n    switch (variant) {\n      case 'elevated':\n        return {\n          ...baseHover,\n          boxShadow: 'var(--lm-shadow-xl)',\n        }\n      case 'outline':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-bg-hover)',\n          boxShadow: 'var(--lm-shadow-md)',\n        }\n      case 'soft':\n        return {\n          ...baseHover,\n          backgroundColor: 'var(--lm-bg-hover)',\n          boxShadow: 'var(--lm-shadow-md)',\n        }\n      default:\n        return baseHover\n    }\n  }\n\n  const currentStyles = isHovered && hoverable ? { ...getCardStyles(), ...getHoverStyles() } : getCardStyles()\n\n  // Loading skeleton\n  const renderSkeleton = () => (\n    <div className=\"animate-pulse\">\n      {title && (\n        <div className=\"mb-4\">\n          <div\n            className=\"h-4 rounded w-1/3\"\n            style={{ backgroundColor: 'var(--lm-bg-active)' }}\n          />\n        </div>\n      )}\n      <div className=\"space-y-3\">\n        <div\n          className=\"h-4 rounded w-full\"\n          style={{ backgroundColor: 'var(--lm-bg-active)' }}\n        />\n        <div\n          className=\"h-4 rounded w-5/6\"\n          style={{ backgroundColor: 'var(--lm-bg-active)' }}\n        />\n        <div\n          className=\"h-4 rounded w-4/6\"\n          style={{ backgroundColor: 'var(--lm-bg-active)' }}\n        />\n      </div>\n    </div>\n  )\n\n  // Header section\n  const renderHeader = () => {\n    if (!title && !extra) return null\n\n    return (\n      <div\n        className={`flex items-center justify-between ${SIZE_GAP_CLASSES[resolvedSize]} border-b`}\n        style={{\n          borderColor: 'var(--lm-border-light)',\n          padding: `${SIZE_PADDING_CLASSES[resolvedSize].split(' ')[0].replace('px-', '')}rem ${SIZE_PADDING_CLASSES[resolvedSize].split(' ')[1]?.replace('py-', '') || '1'}rem`,\n          paddingLeft: '1rem',\n          paddingRight: '1rem',\n          paddingTop: '0.75rem',\n          paddingBottom: '0.75rem',\n        }}\n      >\n        {title && (\n          <div\n            className={`${titleTextClasses[resolvedSize]} font-semibold`}\n            style={{ color: 'var(--lm-text-primary)' }}\n          >\n            {title}\n          </div>\n        )}\n        {extra && (\n          <div\n            className={SIZE_TEXT_CLASSES[resolvedSize]}\n            style={{ color: 'var(--lm-text-secondary)' }}\n          >\n            {extra}\n          </div>\n        )}\n      </div>\n    )\n  }\n\n  // Actions section\n  const renderActions = () => {\n    if (!actions || actions.length === 0) return null\n\n    return (\n      <div\n        className=\"flex items-center border-t\"\n        style={{ borderColor: 'var(--lm-border-light)' }}\n      >\n        {actions.map((action, index) => (\n          <div\n            key={index}\n            className={`flex-1 flex items-center justify-center py-3 transition-colors duration-200 hover:bg-(--lm-bg-hover) ${\n              index !== actions.length - 1 ? 'border-r' : ''\n            }`}\n            style={{\n              borderColor: 'var(--lm-border-light)',\n              color: 'var(--lm-text-secondary)',\n            }}\n          >\n            {action}\n          </div>\n        ))}\n      </div>\n    )\n  }\n\n  return (\n    <div\n      className={baseClassName}\n      style={currentStyles}\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n      {...rest}\n    >\n      {/* Cover image */}\n      {cover && (\n        <div className=\"w-full overflow-hidden\">\n          {cover}\n        </div>\n      )}\n\n      {/* Header */}\n      {renderHeader()}\n\n      {/* Body */}\n      <div className={SIZE_PADDING_CLASSES[resolvedSize]}>\n        {loading ? renderSkeleton() : children}\n      </div>\n\n      {/* Actions */}\n      {renderActions()}\n    </div>\n  )\n}\n\nexport default LMCard\n"],"names":[],"mappings":"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"}