@bln-design-system/button 0.0.1

package/dist/index.cjs

@@ -0,0 +1,86 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  default: () => index_default
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/Button.constants.ts
+var import_class_variance_authority = require("class-variance-authority");
+var buttonVariants = (0, import_class_variance_authority.cva)(
+  `
+  px-4 py-2
+  rounded-full
+  cursor-pointer
+  transition-all duration-150
+  active:scale-90
+  hover:brightness-95
+  hover:-translate-y-0.5
+  hover:shadow-md
+  `,
+  {
+    variants: {
+      variant: {
+        primary: "bg-[var(--primary)] text-white font-medium ",
+        outlined: "border border-slate-900",
+        glass: `
+          relative
+          text-white font-bold
+          bg-white/10
+          backdrop-blur-sm
+          border border-white/40
+          shadow-black/10
+          overflow-hidden
+
+          before:absolute before:inset-0
+          before:bg-gradient-to-br
+          before:from-white/10 before:via-white/5 before:to-transparent
+          before:rounded-full
+          before:pointer-events-none
+          hover:bg-white/20
+
+          before:translate-x-[-60%]
+          hover:before:translate-x-[60%]
+          before:transition-transform before:duration-700
+        `
+      }
+    },
+    defaultVariants: {
+      variant: "primary"
+    }
+  }
+);
+
+// src/Button.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Button = ({
+  children,
+  className,
+  variant = "primary",
+  ...props
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: buttonVariants({ variant, className }), ...props, children });
+};
+var Button_default = Button;
+
+// src/index.ts
+var index_default = Button_default;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/Button.constants.ts","../src/Button.tsx"],"sourcesContent":["import Button from './Button'\n\n\nexport * from \"./Button\"\nexport type * from \"./Button.types\"\n\nexport default Button;","\n// // Prop\n\n// export type TButtonVariant = typeof BUTTON_VARIANTS[number]\n\n// // Styling\n// export const BUTTON_BASE_STYLE = \"px-4 py-2 rounded-full cursor-pointer transition-all duration-150 hover:brightness-95 hover:-translate-y-0.5 hover:shadow-md\"\n// export const BUTTON_VARIANT_STYLE: Record<typeof BUTTON_VARIANTS[number], string> = {\n//   primary: 'bg-slate-900! text-white font-medium',\n//   outlined: 'border border-slate-900',\n//   glass: `\n//     relative!\n//     text-white font-bold!\n//     bg-white/10!\n//     backdrop-blur-sm!\n//     border border-white/40!\n//     shadow-black/10!\n//     overflow-hidden!\n\n//     before:absolute! before:inset-0!\n//     before:bg-gradient-to-br!\n//     before:from-white/10! before:via-white/5! before:to-transparent!\n//     before:rounded-full!\n//     before:pointer-events-none!\n//     hover:bg-white/20!\n\n//     before:translate-x-[-60%]!\n//     hover:before:translate-x-[60%]!\n//     before:transition-transform before:duration-700!\n//   `,\n// }\n\nimport { cva } from \"class-variance-authority\"\n\nexport const BUTTON_VARIANTS = ['primary', 'outlined', 'glass'] as const\n\nexport const buttonVariants = cva(\n  `\n  px-4 py-2\n  rounded-full\n  cursor-pointer\n  transition-all duration-150\n  active:scale-90\n  hover:brightness-95\n  hover:-translate-y-0.5\n  hover:shadow-md\n  `,\n  {\n    variants: {\n      variant: {\n        primary: \"bg-[var(--primary)] text-white font-medium \",\n        outlined: \"border border-slate-900\",\n        glass: `\n          relative\n          text-white font-bold\n          bg-white/10\n          backdrop-blur-sm\n          border border-white/40\n          shadow-black/10\n          overflow-hidden\n\n          before:absolute before:inset-0\n          before:bg-gradient-to-br\n          before:from-white/10 before:via-white/5 before:to-transparent\n          before:rounded-full\n          before:pointer-events-none\n          hover:bg-white/20\n\n          before:translate-x-[-60%]\n          hover:before:translate-x-[60%]\n          before:transition-transform before:duration-700\n        `\n      }\n    },\n    defaultVariants: {\n      variant: \"primary\"\n    }\n  }\n)","'use client';\n// for support serverside\n\nimport { buttonVariants } from \"./Button.constants\"\nimport type { IButtonProps } from \"./Button.types\"\n\nconst Button: React.FC<IButtonProps> = ({ \n  children, \n  className, \n  variant = 'primary',\n  ...props\n}) => {\n  \n  return (\n    <button className={buttonVariants({ variant, className })} {...props}>\n      { children }\n    </button>\n  )\n}\n\nexport default Button"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACgCA,sCAAoB;AAIb,IAAM,qBAAiB;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,UAAU;AAAA,QACV,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAoBT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AChEI;AARJ,IAAM,SAAiC,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AAEJ,SACE,4CAAC,YAAO,WAAW,eAAe,EAAE,SAAS,UAAU,CAAC,GAAI,GAAG,OAC3D,UACJ;AAEJ;AAEA,IAAO,iBAAQ;;;AFdf,IAAO,gBAAQ;","names":[]}

package/dist/index.d.cts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+declare const buttonVariants: (props?: {
+    variant?: "primary" | "outlined" | "glass";
+} & class_variance_authority_types.ClassProp) => string;
+
+interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    children?: ReactNode;
+    className?: string;
+}
+
+declare const Button: React.FC<IButtonProps>;
+
+export { type IButtonProps, Button as default };

package/dist/index.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+
+declare const buttonVariants: (props?: {
+    variant?: "primary" | "outlined" | "glass";
+} & class_variance_authority_types.ClassProp) => string;
+
+interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    children?: ReactNode;
+    className?: string;
+}
+
+declare const Button: React.FC<IButtonProps>;
+
+export { type IButtonProps, Button as default };

package/dist/index.js

@@ -0,0 +1,64 @@
+// src/Button.constants.ts
+import { cva } from "class-variance-authority";
+var buttonVariants = cva(
+  `
+  px-4 py-2
+  rounded-full
+  cursor-pointer
+  transition-all duration-150
+  active:scale-90
+  hover:brightness-95
+  hover:-translate-y-0.5
+  hover:shadow-md
+  `,
+  {
+    variants: {
+      variant: {
+        primary: "bg-[var(--primary)] text-white font-medium ",
+        outlined: "border border-slate-900",
+        glass: `
+          relative
+          text-white font-bold
+          bg-white/10
+          backdrop-blur-sm
+          border border-white/40
+          shadow-black/10
+          overflow-hidden
+
+          before:absolute before:inset-0
+          before:bg-gradient-to-br
+          before:from-white/10 before:via-white/5 before:to-transparent
+          before:rounded-full
+          before:pointer-events-none
+          hover:bg-white/20
+
+          before:translate-x-[-60%]
+          hover:before:translate-x-[60%]
+          before:transition-transform before:duration-700
+        `
+      }
+    },
+    defaultVariants: {
+      variant: "primary"
+    }
+  }
+);
+
+// src/Button.tsx
+import { jsx } from "react/jsx-runtime";
+var Button = ({
+  children,
+  className,
+  variant = "primary",
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx("button", { className: buttonVariants({ variant, className }), ...props, children });
+};
+var Button_default = Button;
+
+// src/index.ts
+var index_default = Button_default;
+export {
+  index_default as default
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Button.constants.ts","../src/Button.tsx","../src/index.ts"],"sourcesContent":["\n// // Prop\n\n// export type TButtonVariant = typeof BUTTON_VARIANTS[number]\n\n// // Styling\n// export const BUTTON_BASE_STYLE = \"px-4 py-2 rounded-full cursor-pointer transition-all duration-150 hover:brightness-95 hover:-translate-y-0.5 hover:shadow-md\"\n// export const BUTTON_VARIANT_STYLE: Record<typeof BUTTON_VARIANTS[number], string> = {\n//   primary: 'bg-slate-900! text-white font-medium',\n//   outlined: 'border border-slate-900',\n//   glass: `\n//     relative!\n//     text-white font-bold!\n//     bg-white/10!\n//     backdrop-blur-sm!\n//     border border-white/40!\n//     shadow-black/10!\n//     overflow-hidden!\n\n//     before:absolute! before:inset-0!\n//     before:bg-gradient-to-br!\n//     before:from-white/10! before:via-white/5! before:to-transparent!\n//     before:rounded-full!\n//     before:pointer-events-none!\n//     hover:bg-white/20!\n\n//     before:translate-x-[-60%]!\n//     hover:before:translate-x-[60%]!\n//     before:transition-transform before:duration-700!\n//   `,\n// }\n\nimport { cva } from \"class-variance-authority\"\n\nexport const BUTTON_VARIANTS = ['primary', 'outlined', 'glass'] as const\n\nexport const buttonVariants = cva(\n  `\n  px-4 py-2\n  rounded-full\n  cursor-pointer\n  transition-all duration-150\n  active:scale-90\n  hover:brightness-95\n  hover:-translate-y-0.5\n  hover:shadow-md\n  `,\n  {\n    variants: {\n      variant: {\n        primary: \"bg-[var(--primary)] text-white font-medium \",\n        outlined: \"border border-slate-900\",\n        glass: `\n          relative\n          text-white font-bold\n          bg-white/10\n          backdrop-blur-sm\n          border border-white/40\n          shadow-black/10\n          overflow-hidden\n\n          before:absolute before:inset-0\n          before:bg-gradient-to-br\n          before:from-white/10 before:via-white/5 before:to-transparent\n          before:rounded-full\n          before:pointer-events-none\n          hover:bg-white/20\n\n          before:translate-x-[-60%]\n          hover:before:translate-x-[60%]\n          before:transition-transform before:duration-700\n        `\n      }\n    },\n    defaultVariants: {\n      variant: \"primary\"\n    }\n  }\n)","'use client';\n// for support serverside\n\nimport { buttonVariants } from \"./Button.constants\"\nimport type { IButtonProps } from \"./Button.types\"\n\nconst Button: React.FC<IButtonProps> = ({ \n  children, \n  className, \n  variant = 'primary',\n  ...props\n}) => {\n  \n  return (\n    <button className={buttonVariants({ variant, className })} {...props}>\n      { children }\n    </button>\n  )\n}\n\nexport default Button","import Button from './Button'\n\n\nexport * from \"./Button\"\nexport type * from \"./Button.types\"\n\nexport default Button;"],"mappings":";AAgCA,SAAS,WAAW;AAIb,IAAM,iBAAiB;AAAA,EAC5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SAAS;AAAA,QACT,UAAU;AAAA,QACV,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAoBT;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;;;AChEI;AARJ,IAAM,SAAiC,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AAEJ,SACE,oBAAC,YAAO,WAAW,eAAe,EAAE,SAAS,UAAU,CAAC,GAAI,GAAG,OAC3D,UACJ;AAEJ;AAEA,IAAO,iBAAQ;;;ACdf,IAAO,gBAAQ;","names":[]}

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@bln-design-system/button",
+  "version": "0.0.1",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "license": "ISC",
+  "devDependencies": {
+    "tsup": "^8.5.1"
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7.1"
+  },
+  "scripts": {
+    "build": "tsup"
+  }
+}