@neoptocom/neopto-ui 0.9.2 → 0.9.4

package/dist/index.cjs

@@ -308,7 +308,7 @@ function Modal({
       children: /* @__PURE__ */ jsxRuntime.jsxs(
         Card,
         {
-          className: `w-full max-w-lg ${className}`,
+          className: `w-full ${className || "max-w-lg"}`,
           role: "dialog",
           "aria-modal": "true",
           "aria-labelledby": title ? "modal-title" : void 0,
@@ -541,7 +541,7 @@ function Icon({
   );
 }
 function getIconButtonClasses(variant = "ghost", size = "md", className) {
-  const base = "flex items-center justify-center rounded-full flex-shrink-0 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50";
+  const base = "cursor-pointer flex items-center justify-center rounded-full flex-shrink-0 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50";
   const variants = {
     ghost: "bg-transparent hover:bg-[var(--muted)] active:bg-[var(--muted)]",
     primary: "bg-cyan-500 text-white hover:bg-cyan-400 active:bg-cyan-600",

package/dist/index.js

@@ -287,7 +287,7 @@ function Modal({
       children: /* @__PURE__ */ jsxs(
         Card,
         {
-          className: `w-full max-w-lg ${className}`,
+          className: `w-full ${className || "max-w-lg"}`,
           role: "dialog",
           "aria-modal": "true",
           "aria-labelledby": title ? "modal-title" : void 0,
@@ -520,7 +520,7 @@ function Icon({
   );
 }
 function getIconButtonClasses(variant = "ghost", size = "md", className) {
-  const base = "flex items-center justify-center rounded-full flex-shrink-0 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50";
+  const base = "cursor-pointer flex items-center justify-center rounded-full flex-shrink-0 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50";
   const variants = {
     ghost: "bg-transparent hover:bg-[var(--muted)] active:bg-[var(--muted)]",
     primary: "bg-cyan-500 text-white hover:bg-cyan-400 active:bg-cyan-600",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neoptocom/neopto-ui",
-  "version": "0.9.2",
+  "version": "0.9.4",
   "private": false,
   "description": "A modern React component library built with Tailwind CSS v4 and TypeScript. Features dark mode, design tokens, and comprehensive Storybook documentation. Requires Tailwind v4+.",
   "keywords": [

package/src/components/IconButton.tsx

@@ -22,7 +22,7 @@ function getIconButtonClasses(
   className?: string
 ): string {
   const base =
-    "flex items-center justify-center rounded-full flex-shrink-0 " +
+    "cursor-pointer flex items-center justify-center rounded-full flex-shrink-0 " +
     "transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 " +
     "focus-visible:ring-cyan-500/40 disabled:cursor-not-allowed disabled:opacity-50";
 

package/src/components/Modal.tsx

@@ -92,13 +92,13 @@ export function Modal({
         onClose={closeOnBackdrop ? onClose : undefined}
         zIndex={zIndex}
       >
-        <Card
-          className={`w-full max-w-lg ${className}`}
-          role="dialog"
-          aria-modal="true"
-          aria-labelledby={title ? "modal-title" : undefined}
-          showDecorations={showDecorations}
-        >
+      <Card
+        className={`w-full ${className || "max-w-lg"}`}
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby={title ? "modal-title" : undefined}
+        showDecorations={showDecorations}
+      >
         {title && (
           <h2 id="modal-title" className="mb-4 text-xl font-semibold">
             {title}