@alexandregme/zljs 0.6.0 → 1.0.0

package/dist/index.d.ts

@@ -28,12 +28,13 @@ interface IconProps {
     size?: Size;
 }
 
-type ButtonVariant = "default" | "icon" | "ghost" | "link";
+type ButtonVariant = "default" | "icon" | "link";
+type ButtonColor = SemanticColor | "ghost";
 interface ButtonProps {
     children?: ReactNode;
     type?: "button" | "submit" | "reset";
     variant?: ButtonVariant;
-    color?: SemanticColor;
+    color?: ButtonColor;
     size?: Size;
     icon?: IconName;
     iconPosition?: "left" | "right";
@@ -455,4 +456,4 @@ declare class HTTPClient {
 }
 
 export { AppWrapper, Button, Checkbox, ConnectedModal, DataGrid, DocumentWrapper, Error, Form, GlobalState, HTTPClient, Heading, Icon, Input, Loader, Modal, PageWrapper, Radio, Select, Sidebar, Spinner, StatsCard, Tag, Text, TextArea, Toaster, WhatsAppButton, splitURLasPath, useAppStore, useModalStore, usePageStore, useRouterStore, useToastStore };
-export type { AppState, AppWrapperProps, ButtonProps, ButtonVariant, CheckboxProps, ConnectedModalProps, DataGridColumn, DataGridProps, DocumentWrapperProps, ErrorProps, ExtendedStore, FormProps, GlobalStateProps, HeadingProps, HttpClientConfig, HttpRequestConfig, IconName, InitPageFunction, InputProps, LoaderProps, ModalEntry, ModalProps, ModalState, PageState, PageWrapperProps, RadioProps, RouterState, SelectOption, SelectProps, SidebarItem, SidebarProps, SidebarSection, SidebarUser, SpinnerProps, SpinnerVariant, StatsCardProps, TagProps, TextAreaProps, TextProps, TextVariant, Toast, ToastState, ToastType, WhatsAppButtonProps };
+export type { AppState, AppWrapperProps, ButtonColor, ButtonProps, ButtonVariant, CheckboxProps, ConnectedModalProps, DataGridColumn, DataGridProps, DocumentWrapperProps, ErrorProps, ExtendedStore, FormProps, GlobalStateProps, HeadingProps, HttpClientConfig, HttpRequestConfig, IconName, InitPageFunction, InputProps, LoaderProps, ModalEntry, ModalProps, ModalState, PageState, PageWrapperProps, RadioProps, RouterState, SelectOption, SelectProps, SidebarItem, SidebarProps, SidebarSection, SidebarUser, SpinnerProps, SpinnerVariant, StatsCardProps, TagProps, TextAreaProps, TextProps, TextVariant, Toast, ToastState, ToastType, WhatsAppButtonProps };

package/dist/index.js

@@ -40,8 +40,7 @@ var button = tv({
     variant: {
       default: "px-4 py-2 text-white text-sm gap-2 rounded-md focus:ring-2 focus:ring-offset-2",
       icon: "p-1 bg-transparent text-gray-500 hover:text-gray-700 hover:bg-gray-100 focus:ring-gray-500 rounded-md focus:ring-2 focus:ring-offset-2",
-      ghost: "px-3 py-2 gap-3 text-sm bg-transparent text-neutral-400 hover:text-white hover:bg-neutral-800 rounded-md focus-visible:ring-2 focus-visible:ring-neutral-600",
-      link: "text-xs underline bg-transparent hover:no-underline"
+      link: "text-xs hover:underline"
     },
     color: {
       primary: "bg-blue-600 hover:bg-blue-700 focus:ring-blue-500",
@@ -49,6 +48,7 @@ var button = tv({
       danger: "bg-red-600 hover:bg-red-700 focus:ring-red-500",
       warning: "bg-yellow-500 hover:bg-yellow-600 focus:ring-yellow-500 text-gray-900",
       info: "bg-cyan-500 hover:bg-cyan-600 focus:ring-cyan-500",
+      ghost: "bg-transparent text-neutral-400 hover:text-white hover:bg-neutral-800 focus:ring-neutral-600",
       none: ""
     },
     size: {
@@ -58,6 +58,11 @@ var button = tv({
     }
   },
   compoundVariants: [
+    {
+      variant: "default",
+      color: "none",
+      class: "bg-gray-100 text-gray-900 hover:bg-gray-200 focus:ring-gray-500"
+    },
     {
       variant: "default",
       size: "sm",
@@ -81,17 +86,41 @@ var button = tv({
     {
       variant: "link",
       color: "primary",
-      class: "bg-transparent text-blue-600 hover:text-blue-800"
+      class: "text-blue-600 hover:text-blue-800"
+    },
+    {
+      variant: "link",
+      color: "success",
+      class: "text-green-600 hover:text-green-800"
     },
     {
       variant: "link",
       color: "danger",
-      class: "bg-transparent text-red-600 hover:text-red-800"
+      class: "text-red-600 hover:text-red-800"
+    },
+    {
+      variant: "link",
+      color: "warning",
+      class: "text-yellow-600 hover:text-yellow-800"
+    },
+    {
+      variant: "link",
+      color: "info",
+      class: "text-cyan-600 hover:text-cyan-800"
+    },
+    {
+      variant: "link",
+      color: "ghost",
+      class: "text-neutral-400 hover:text-neutral-600"
     },
     {
       variant: "link",
       color: "none",
       class: "text-slate-500 hover:text-slate-700"
+    },
+    {
+      variant: "link",
+      class: "bg-transparent hover:bg-transparent"
     }
   ],
   defaultVariants: {
@@ -142,7 +171,7 @@ var Button = ({
       "aria-label": ariaLabel,
       className: button({
         variant,
-        color: variant === "icon" || variant === "ghost" ? "none" : color,
+        color: variant === "icon" && color !== "ghost" ? "none" : color,
         size
       }),
       children: renderContent()
@@ -926,7 +955,7 @@ var Sidebar = ({
       /* @__PURE__ */ jsx17(
         Button,
         {
-          variant: "ghost",
+          color: "ghost",
           icon: "LogOut",
           "aria-label": "Logout",
           onClick: onLogout
@@ -936,7 +965,7 @@ var Sidebar = ({
     /* @__PURE__ */ jsx17("div", { className: toggleButton(), children: /* @__PURE__ */ jsx17(
       Button,
       {
-        variant: "ghost",
+        color: "ghost",
         icon: collapsed ? "ChevronRight" : "ChevronLeft",
         "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
         onClick: () => setCollapsed(!collapsed),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alexandregme/zljs",
-  "version": "0.6.0",
+  "version": "1.0.0",
   "description": "Opinionated, accessible React component library for enterprise apps (Next.js, Tailwind CSS v4).",
   "keywords": [
     "react",