@purr-react-tailwindcss/components.button 0.0.1 → 0.0.2

package/dist/_components.d.ts

@@ -1,4 +1,4 @@
 import { default as React } from 'react';
 import { IButtonProps } from './_types';
 
-export declare const Button: ({ variant, size, loading, loadingComponent, classes, htmlAttributes, children, onClick, }: IButtonProps) => React.JSX.Element;
+export declare const Button: ({ variant, size, loading, loadingComponent, htmlAttributes, children, onClick, }: IButtonProps) => React.JSX.Element;

package/dist/_types.d.ts

@@ -1,19 +1,14 @@
-import { ClassValue } from 'clsx';
 import { ButtonHTMLAttributes, MouseEventHandler, ReactNode } from 'react';
 import { IExtendable } from '@purr-core/utils.definitions';
 
 export type TButtonSize = "small" | "medium" | "large";
 export type TButtonVariant = "outlined" | "contained" | "text";
-export interface IButtonClasses {
-    container?: ClassValue;
-}
 export interface IButtonProps {
     size?: TButtonSize;
     variant?: TButtonVariant;
     onClick?: MouseEventHandler<HTMLButtonElement>;
     loading?: boolean;
     loadingComponent?: ReactNode;
-    classes?: IButtonClasses;
     children?: ReactNode;
     htmlAttributes?: ButtonHTMLAttributes<HTMLButtonElement> & IExtendable;
 }

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react/jsx-runtime"),a=require("clsx"),d=require("react"),c=require("@purr-react-tailwindcss/components.icon"),x={container:"animate-spin text-blue-300 w-4 h-4"},m=({variant:e="text",size:t="medium",loading:n=!1,loadingComponent:o,classes:r,htmlAttributes:i,children:u,onClick:l})=>{const s=d.useMemo(()=>n?o??b.jsx(c.Icon,{name:"loader-2",classes:x}):u,[u,n,o]);return b.jsx("button",{onClick:l,className:a("flex","items-center","justify-center","transition-all","duration-200","ease-in-out","shadow-none","outline-none","overflow-hidden","rounded","min-w-16","text-sm","font-medium","cursor-pointer","button",t==="small"?"h-6 px-4":"",t==="medium"?"h-9 px-5":"",t==="large"?"h-12 px-6":"",e==="contained"?"text-gray-900 bg-blue-300 border border-blue-300 hover:bg-blue-400":"",e==="outlined"?"text-blue-300 bg-transparent border border-blue-300 hover:border-blue-200 hover:text-blue-200":"",e==="text"?"text-blue-300 bg-transparent border border-transparent hover:text-blue-200":"",r==null?void 0:r.container),...i,children:s})};exports.Button=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),i=require("clsx"),a=require("react"),d=require("@purr-react-tailwindcss/components.icon"),c={className:"animate-spin text-blue-300 w-4 h-4"},m=({variant:e="text",size:t="medium",loading:r=!1,loadingComponent:n,htmlAttributes:s,children:o,onClick:b})=>{const l=a.useMemo(()=>r?n??u.jsx(d.Icon,{name:"loader-2",htmlAttributes:c}):o,[o,r,n]);return u.jsx("button",{onClick:b,className:i("flex","items-center","justify-center","transition-all","duration-200","ease-in-out","shadow-none","outline-none","overflow-hidden","rounded","min-w-16","text-sm","font-medium","cursor-pointer","button",t==="small"?"h-6 px-4":"",t==="medium"?"h-9 px-5":"",t==="large"?"h-12 px-6":"",e==="contained"?"border border-blue-300 bg-blue-300 text-gray-900 hover:bg-blue-400":"",e==="outlined"?"border border-blue-300 bg-transparent text-blue-300 hover:border-blue-200 hover:text-blue-200":"",e==="text"?"border border-transparent bg-transparent text-blue-300 hover:text-blue-200":""),...s,children:l})};exports.Button=m;

package/dist/index.js

@@ -1,25 +1,24 @@
-import { jsx as b } from "react/jsx-runtime";
-import i from "clsx";
+import { jsx as u } from "react/jsx-runtime";
+import s from "clsx";
 import { useMemo as a } from "react";
-import { Icon as x } from "@purr-react-tailwindcss/components.icon";
-const s = {
-  container: "animate-spin text-blue-300 w-4 h-4"
-}, g = ({
+import { Icon as d } from "@purr-react-tailwindcss/components.icon";
+const i = {
+  className: "animate-spin text-blue-300 w-4 h-4"
+}, h = ({
   variant: e = "text",
   size: t = "medium",
-  loading: o = !1,
-  loadingComponent: n,
-  classes: r,
-  htmlAttributes: m,
-  children: u,
+  loading: r = !1,
+  loadingComponent: o,
+  htmlAttributes: b,
+  children: n,
   onClick: l
 }) => {
-  const d = a(() => o ? n ?? /* @__PURE__ */ b(x, { name: "loader-2", classes: s }) : u, [u, o, n]);
-  return /* @__PURE__ */ b(
+  const m = a(() => r ? o ?? /* @__PURE__ */ u(d, { name: "loader-2", htmlAttributes: i }) : n, [n, r, o]);
+  return /* @__PURE__ */ u(
     "button",
     {
       onClick: l,
-      className: i(
+      className: s(
         "flex",
         "items-center",
         "justify-center",
@@ -41,16 +40,15 @@ const s = {
         // variant === "contained"
         //   ? "text-gray-900 !bg-blue-300 border border-blue-300 hover:!bg-blue-400"
         //   : "",
-        e === "contained" ? "text-gray-900 bg-blue-300 border border-blue-300 hover:bg-blue-400" : "",
-        e === "outlined" ? "text-blue-300 bg-transparent border border-blue-300 hover:border-blue-200 hover:text-blue-200" : "",
-        e === "text" ? "text-blue-300 bg-transparent border border-transparent hover:text-blue-200" : "",
-        r == null ? void 0 : r.container
+        e === "contained" ? "border border-blue-300 bg-blue-300 text-gray-900 hover:bg-blue-400" : "",
+        e === "outlined" ? "border border-blue-300 bg-transparent text-blue-300 hover:border-blue-200 hover:text-blue-200" : "",
+        e === "text" ? "border border-transparent bg-transparent text-blue-300 hover:text-blue-200" : ""
       ),
-      ...m,
-      children: d
+      ...b,
+      children: m
     }
   );
 };
 export {
-  g as Button
+  h as Button
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purr-react-tailwindcss/components.button",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.js",
@@ -24,8 +24,8 @@
     "typescript": "*",
     "react": "*",
     "clsx": "*",
-    "@purr-core/utils.definitions": "0.0.5",
-    "@purr-react-tailwindcss/components.icon": "0.0.1"
+    "@purr-core/utils.definitions": "0.0.6",
+    "@purr-react-tailwindcss/components.icon": "0.0.2"
   },
   "author": "@DinhThienPhuc",
   "license": "ISC",