huly-ui 0.0.7 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -11,10 +11,6 @@ var bgButton = {
11
11
  light: "bg-transparent text-light-foreground",
12
12
  dark: "bg-black text-white"
13
13
  };
14
- var hoverButton = {
15
- light: "hover:bg-transparent hover:text-black",
16
- dark: "hover:bg-black/90 hover:text-white"
17
- };
18
14
  var sizeButton = {
19
15
  md: "text-base",
20
16
  lg: "text-lg",
@@ -44,9 +40,10 @@ var Button = ({
44
40
  baseButton,
45
41
  variantButton[variant],
46
42
  bgButton[bg],
47
- hoverButton[hover],
48
43
  sizeButton[size],
49
- roundedButton[rounded]
44
+ roundedButton[rounded],
45
+ hover === "dark" && "hover:bg-black/90 hover:text-white",
46
+ hover === "light" && "hover:bg-transparent hover:text-black"
50
47
  ),
51
48
  children: [
52
49
  linksButton.icon,
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/buttoms/buttom.tsx","../src/components/navigations/navigation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\ninterface ButtonLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {\n href: string;\n icon: React.ReactNode;\n label?: string;\n}\ntype variantButtonProps = {\n variant?: keyof typeof variantButton;\n};\ntype bgButtonProps = {\n bg?: keyof typeof bgButton;\n};\ntype hoverButtonProps = {\n hover?: keyof typeof hoverButton;\n};\ntype sizeButtonProps = {\n size?: keyof typeof sizeButton;\n};\ntype roundedButtonProps = {\n rounded?: keyof typeof roundedButton;\n};\n\ntype ButtonProps = variantButtonProps &\n bgButtonProps &\n hoverButtonProps &\n sizeButtonProps &\n roundedButtonProps & {\n linksButton: ButtonLinkProps;\n };\nconst baseButton =\n \"px-4 py-2 text-lg backdrop-blur-md flex items-center gap-2 transition-colors duration-300\";\n\nconst variantButton = {\n primary: \"border border-gray-700 px-2 py-2\",\n glass: \"p-2\",\n ghost: \"p-2\",\n};\n\nconst bgButton = {\n light: \"bg-transparent text-light-foreground\",\n dark: \"bg-black text-white\",\n};\n\nconst hoverButton = {\n light: \"hover:bg-transparent hover:text-black\",\n dark: \"hover:bg-black/90 hover:text-white\",\n};\n\nconst sizeButton = {\n md: \"text-base\",\n lg: \"text-lg\",\n xl: \"text-xl\",\n xs: \"text-xs\",\n};\n\nconst roundedButton = {\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n sm: \"rounded-sm\",\n full: \"rounded-full\",\n};\n\nexport const Button = ({\n variant = \"primary\",\n bg = \"dark\",\n hover = \"dark\",\n size = \"md\",\n rounded = \"md\",\n linksButton,\n}: ButtonProps) => {\n return (\n <a\n href={linksButton.href}\n className={clsx(\n baseButton,\n variantButton[variant],\n bgButton[bg],\n hoverButton[hover],\n sizeButton[size],\n roundedButton[rounded]\n )}\n >\n {linksButton.icon}\n {linksButton.label}\n </a>\n );\n};\n","import clsx from \"clsx\";\n\ntype NavLink = {\n href: string;\n label?: string;\n icon: React.ReactNode;\n};\n\ntype NavigationProps = {\n variant?: \"primary\" | \"glass\" | \"ghost\";\n bg?: \"light\" | \"dark\";\n hover?: \"light\" | \"dark\";\n links: NavLink[];\n size: \"md\" | \"lg\" | \"xl\" | \"xs\";\n text?: \"light\" | \"dark\";\n rounded?: \"md\" | \"lg\" | \"xl\" | \"xs\" | \"full\";\n};\n\nconst base = \"text-white shadow-lg rounded-full text-lg backdrop-blur-sm\";\n\nconst variants = {\n primary: \"px-2 py-2\",\n glass: \"bg-white/5 border border-white/10\",\n ghost: \"bg-transparent\",\n};\n\nconst backgrounds = {\n light: \"bg-white/30\",\n dark: \"bg-black/30\",\n};\n\nconst hoverVariants = {\n light: \"hover:bg-white hover:text-black\",\n dark: \"hover:bg-black hover:text-white\",\n};\nconst sizes = {\n md: \"text-md\",\n lg: \"text-lg\",\n xl: \"text-xl\",\n xs: \"text-xs\",\n};\n\nconst textColors = {\n light: \"text-white\",\n dark: \"text-black\",\n};\n\nconst roundedColors = {\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n xs: \"rounded-xs\",\n full: \"rounded-full\",\n};\n\nexport const Navigation = ({\n variant = \"primary\",\n bg = \"light\",\n hover = \"light\",\n links,\n size,\n text = \"light\",\n rounded = \"md\",\n}: NavigationProps) => {\n return (\n <nav\n className={clsx(\n \"flex justify-center m-2\",\n base,\n variants[variant],\n backgrounds[bg]\n )}\n >\n <div className=\"flex items-center gap-9\">\n {links.map((link, index) => (\n <a\n key={index}\n href={link.href}\n className={clsx(\n \"p-4 font-mono flex items-center gap-2 rounded-full w-full transition-colors duration-300\",\n hoverVariants[hover],\n sizes[size],\n textColors[text],\n roundedColors[rounded]\n )}\n >\n {link.icon}\n {link.label}\n </a>\n ))}\n </div>\n </nav>\n );\n};\n"],"mappings":";AAAA,OAAO,UAAU;AA0Eb;AA3CJ,IAAM,aACJ;AAEF,IAAM,gBAAgB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AACT;AAEA,IAAM,WAAW;AAAA,EACf,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,cAAc;AAAA,EAClB,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,aAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,SAAS,CAAC;AAAA,EACrB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,UAAU;AAAA,EACV;AACF,MAAmB;AACjB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,YAAY;AAAA,MAClB,WAAW;AAAA,QACT;AAAA,QACA,cAAc,OAAO;AAAA,QACrB,SAAS,EAAE;AAAA,QACX,YAAY,KAAK;AAAA,QACjB,WAAW,IAAI;AAAA,QACf,cAAc,OAAO;AAAA,MACvB;AAAA,MAEC;AAAA,oBAAY;AAAA,QACZ,YAAY;AAAA;AAAA;AAAA,EACf;AAEJ;;;ACzFA,OAAOA,WAAU;AAyEX,cAEI,QAAAC,aAFJ;AAvDN,IAAM,OAAO;AAEb,IAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AACT;AAEA,IAAM,cAAc;AAAA,EAClB,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,gBAAgB;AAAA,EACpB,OAAO;AAAA,EACP,MAAM;AACR;AACA,IAAM,QAAQ;AAAA,EACZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,aAAa;AAAA,EACjB,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,aAAa,CAAC;AAAA,EACzB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AACZ,MAAuB;AACrB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAWD;AAAA,QACT;AAAA,QACA;AAAA,QACA,SAAS,OAAO;AAAA,QAChB,YAAY,EAAE;AAAA,MAChB;AAAA,MAEA,8BAAC,SAAI,WAAU,2BACZ,gBAAM,IAAI,CAAC,MAAM,UAChB,gBAAAC;AAAA,QAAC;AAAA;AAAA,UAEC,MAAM,KAAK;AAAA,UACX,WAAWD;AAAA,YACT;AAAA,YACA,cAAc,KAAK;AAAA,YACnB,MAAM,IAAI;AAAA,YACV,WAAW,IAAI;AAAA,YACf,cAAc,OAAO;AAAA,UACvB;AAAA,UAEC;AAAA,iBAAK;AAAA,YACL,KAAK;AAAA;AAAA;AAAA,QAXD;AAAA,MAYP,CACD,GACH;AAAA;AAAA,EACF;AAEJ;","names":["clsx","jsxs"]}
1
+ {"version":3,"sources":["../src/components/buttoms/buttom.tsx","../src/components/navigations/navigation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\ninterface ButtonLinkProps extends React.HTMLAttributes<HTMLAnchorElement> {\n href: string;\n icon: React.ReactNode;\n label?: string;\n}\ntype variantButtonProps = {\n variant?: keyof typeof variantButton;\n};\ntype bgButtonProps = {\n bg?: keyof typeof bgButton;\n};\ntype hoverButtonProps = {\n hover?: keyof typeof hoverButton;\n};\ntype sizeButtonProps = {\n size?: keyof typeof sizeButton;\n};\ntype roundedButtonProps = {\n rounded?: keyof typeof roundedButton;\n};\n\ntype ButtonProps = variantButtonProps &\n bgButtonProps &\n hoverButtonProps &\n sizeButtonProps &\n roundedButtonProps & {\n linksButton: ButtonLinkProps;\n };\nconst baseButton =\n \"px-4 py-2 text-lg backdrop-blur-md flex items-center gap-2 transition-colors duration-300\";\n\nconst variantButton = {\n primary: \"border border-gray-700 px-2 py-2\",\n glass: \"p-2\",\n ghost: \"p-2\",\n};\n\nconst bgButton = {\n light: \"bg-transparent text-light-foreground\",\n dark: \"bg-black text-white\",\n};\n\nconst hoverButton = {\n light: \"hover:bg-transparent hover:text-black\",\n dark: \"hover:bg-black/90 hover:text-white\",\n};\n\nconst sizeButton = {\n md: \"text-base\",\n lg: \"text-lg\",\n xl: \"text-xl\",\n xs: \"text-xs\",\n};\n\nconst roundedButton = {\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n sm: \"rounded-sm\",\n full: \"rounded-full\",\n};\n\nexport const Button = ({\n variant = \"primary\",\n bg = \"dark\",\n hover = \"dark\",\n size = \"md\",\n rounded = \"md\",\n linksButton,\n}: ButtonProps) => {\n return (\n <a\n href={linksButton.href}\n className={clsx(\n baseButton,\n variantButton[variant],\n bgButton[bg],\n sizeButton[size],\n roundedButton[rounded],\n hover === \"dark\" && \"hover:bg-black/90 hover:text-white\",\n\n hover === \"light\" && \"hover:bg-transparent hover:text-black\"\n )}\n >\n {linksButton.icon}\n {linksButton.label}\n </a>\n );\n};\n","import clsx from \"clsx\";\n\ntype NavLink = {\n href: string;\n label?: string;\n icon: React.ReactNode;\n};\n\ntype NavigationProps = {\n variant?: \"primary\" | \"glass\" | \"ghost\";\n bg?: \"light\" | \"dark\";\n hover?: \"light\" | \"dark\";\n links: NavLink[];\n size: \"md\" | \"lg\" | \"xl\" | \"xs\";\n text?: \"light\" | \"dark\";\n rounded?: \"md\" | \"lg\" | \"xl\" | \"xs\" | \"full\";\n};\n\nconst base = \"text-white shadow-lg rounded-full text-lg backdrop-blur-sm\";\n\nconst variants = {\n primary: \"px-2 py-2\",\n glass: \"bg-white/5 border border-white/10\",\n ghost: \"bg-transparent\",\n};\n\nconst backgrounds = {\n light: \"bg-white/30\",\n dark: \"bg-black/30\",\n};\n\nconst hoverVariants = {\n light: \"hover:bg-white hover:text-black\",\n dark: \"hover:bg-black hover:text-white\",\n};\nconst sizes = {\n md: \"text-md\",\n lg: \"text-lg\",\n xl: \"text-xl\",\n xs: \"text-xs\",\n};\n\nconst textColors = {\n light: \"text-white\",\n dark: \"text-black\",\n};\n\nconst roundedColors = {\n md: \"rounded-md\",\n lg: \"rounded-lg\",\n xl: \"rounded-xl\",\n xs: \"rounded-xs\",\n full: \"rounded-full\",\n};\n\nexport const Navigation = ({\n variant = \"primary\",\n bg = \"light\",\n hover = \"light\",\n links,\n size,\n text = \"light\",\n rounded = \"md\",\n}: NavigationProps) => {\n return (\n <nav\n className={clsx(\n \"flex justify-center m-2\",\n base,\n variants[variant],\n backgrounds[bg]\n )}\n >\n <div className=\"flex items-center gap-9\">\n {links.map((link, index) => (\n <a\n key={index}\n href={link.href}\n className={clsx(\n \"p-4 font-mono flex items-center gap-2 rounded-full w-full transition-colors duration-300\",\n hoverVariants[hover],\n sizes[size],\n textColors[text],\n roundedColors[rounded]\n )}\n >\n {link.icon}\n {link.label}\n </a>\n ))}\n </div>\n </nav>\n );\n};\n"],"mappings":";AAAA,OAAO,UAAU;AA0Eb;AA3CJ,IAAM,aACJ;AAEF,IAAM,gBAAgB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AACT;AAEA,IAAM,WAAW;AAAA,EACf,OAAO;AAAA,EACP,MAAM;AACR;AAOA,IAAM,aAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,SAAS,CAAC;AAAA,EACrB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,UAAU;AAAA,EACV;AACF,MAAmB;AACjB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,YAAY;AAAA,MAClB,WAAW;AAAA,QACT;AAAA,QACA,cAAc,OAAO;AAAA,QACrB,SAAS,EAAE;AAAA,QACX,WAAW,IAAI;AAAA,QACf,cAAc,OAAO;AAAA,QACrB,UAAU,UAAU;AAAA,QAEpB,UAAU,WAAW;AAAA,MACvB;AAAA,MAEC;AAAA,oBAAY;AAAA,QACZ,YAAY;AAAA;AAAA;AAAA,EACf;AAEJ;;;AC3FA,OAAOA,WAAU;AAyEX,cAEI,QAAAC,aAFJ;AAvDN,IAAM,OAAO;AAEb,IAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AACT;AAEA,IAAM,cAAc;AAAA,EAClB,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,gBAAgB;AAAA,EACpB,OAAO;AAAA,EACP,MAAM;AACR;AACA,IAAM,QAAQ;AAAA,EACZ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,IAAM,aAAa;AAAA,EACjB,OAAO;AAAA,EACP,MAAM;AACR;AAEA,IAAM,gBAAgB;AAAA,EACpB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,IAAM,aAAa,CAAC;AAAA,EACzB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AACZ,MAAuB;AACrB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAWD;AAAA,QACT;AAAA,QACA;AAAA,QACA,SAAS,OAAO;AAAA,QAChB,YAAY,EAAE;AAAA,MAChB;AAAA,MAEA,8BAAC,SAAI,WAAU,2BACZ,gBAAM,IAAI,CAAC,MAAM,UAChB,gBAAAC;AAAA,QAAC;AAAA;AAAA,UAEC,MAAM,KAAK;AAAA,UACX,WAAWD;AAAA,YACT;AAAA,YACA,cAAc,KAAK;AAAA,YACnB,MAAM,IAAI;AAAA,YACV,WAAW,IAAI;AAAA,YACf,cAAc,OAAO;AAAA,UACvB;AAAA,UAEC;AAAA,iBAAK;AAAA,YACL,KAAK;AAAA;AAAA;AAAA,QAXD;AAAA,MAYP,CACD,GACH;AAAA;AAAA,EACF;AAEJ;","names":["clsx","jsxs"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "huly-ui",
3
- "version": "0.0.7",
3
+ "version": "0.0.8",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",