@lolmath/ui 3.2.5 → 4.0.0

package/dist/es/components/button.js

@@ -3,181 +3,49 @@ import { forwardRef } from "react";
 import {
   Button as AriaButton
 } from "react-aria-components";
-import {
-  dimmedGradient,
-  disabledGradient,
-  goldGradient,
-  goldGradientHover,
-  goldGradientPressed,
-  hextechGradient,
-  hextechGradientHover,
-  hextechGradientPressed
-} from "../utilities/gradient.js";
 import { resolveClassName } from "../utilities/resolve-class-name.js";
-import { tv } from "../utilities/tv.js";
-const buttonBorder = tv({
-  base: "bg-gradient-to-t p-0.5 outline-none transition-colors duration-200",
+import { cva } from "cva";
+import classes from "./button.module";
+const button = cva({
+  base: classes.button,
   variants: {
     preset: {
-      primary: "",
-      secondary: "",
-      text: "",
-      hextech: "",
-      dimmed: dimmedGradient
-    },
-    shape: {
-      round: "aspect-square rounded-full",
-      square: "aspect-square",
-      normal: ""
+      primary: classes.primary,
+      secondary: classes.secondary,
+      text: classes.text,
+      hextech: classes.hextech,
+      dimmed: classes.dimmed
     },
     isHovered: {
-      true: ""
+      true: classes.hover
     },
     isPressed: {
-      true: ""
+      true: classes.press
     },
     isDisabled: {
-      true: ""
+      true: classes.disabled
     },
     isFocused: {
       true: ""
     },
     isFocusVisible: {
-      true: ""
-    },
-    thin: {
-      true: "p-px"
-    }
-  },
-  compoundVariants: [
-    {
-      preset: ["primary", "secondary"],
-      class: goldGradient
-    },
-    {
-      preset: ["primary", "secondary", "dimmed"],
-      isHovered: true,
-      class: goldGradientHover
-    },
-    {
-      preset: ["primary", "secondary", "dimmed"],
-      isPressed: true,
-      class: goldGradientPressed
-    },
-    {
-      preset: ["primary", "secondary", "dimmed"],
-      isDisabled: true,
-      class: disabledGradient
-    },
-    {
-      preset: ["primary", "secondary"],
-      isFocusVisible: true,
-      class: "outline outline-offset-2 outline-yellow-50"
-    },
-    {
-      preset: ["hextech"],
-      class: hextechGradient
-    },
-    {
-      preset: ["hextech"],
-      isHovered: true,
-      class: hextechGradientHover
-    },
-    {
-      preset: ["hextech"],
-      isPressed: true,
-      class: hextechGradientPressed
-    },
-    {
-      preset: ["hextech"],
-      isDisabled: true,
-      class: disabledGradient
-    }
-  ]
-});
-const button = tv({
-  base: "text-lol-gold-300 font-beaufort block h-full w-full font-bold uppercase tracking-wide transition-colors duration-200",
-  variants: {
-    preset: {
-      primary: "from-lol-gold-600 via-lol-gold-600 to-lol-gold-700 bg-gradient-to-b",
-      secondary: "",
-      text: "",
-      hextech: "text-lol-blue-100",
-      dimmed: "bg-lol-grey-hextech-black"
-    },
-    isHovered: {
-      true: "text-lol-gold-100"
-    },
-    isPressed: {
-      true: "text-lol-grey-150"
-    },
-    isDisabled: {
-      true: "text-lol-grey-150"
-    },
-    isFocused: {
-      true: ""
-    },
-    isFocusVisible: {
-      true: ""
+      true: classes.focusVisible
     },
     shape: {
-      round: "rounded-full",
-      square: "",
-      normal: ""
-    }
-  },
-  compoundVariants: [
-    {
-      preset: ["primary", "secondary", "hextech", "dimmed"],
-      class: "px-4 py-2"
-    },
-    {
-      preset: ["primary", "secondary", "hextech"],
-      class: "bg-lol-grey-300"
-    },
-    {
-      preset: ["hextech"],
-      isHovered: true,
-      class: "text-lol-blue-100"
-    },
-    {
-      preset: ["hextech"],
-      isPressed: true,
-      class: "text-lol-blue-400"
-    },
-    {
-      preset: ["text"],
-      shape: ["normal", "square"],
-      class: "relative after:absolute after:-bottom-2 after:-left-2 after:-right-2 after:-top-2"
+      round: classes.round,
+      square: classes.square,
+      normal: classes.normal
     },
-    {
-      isHovered: true,
-      preset: "primary",
-      class: "from-lol-gold-600 via-lol-gold-600 to-lol-gold-500"
-    },
-    {
-      isPressed: true,
-      preset: "primary",
-      class: "from-lol-gold-600 via-lol-gold-700 to-lol-gold-700 text-lol-gold-500"
-    },
-    {
-      shape: ["round", "square"],
-      class: "flex aspect-square h-7 items-center justify-center p-0 font-black leading-none"
-    },
-    {
-      isHovered: true,
-      preset: "text",
-      shape: ["round", "square"],
-      class: "bg-lol-grey-300"
+    thin: {
+      true: classes.thin
     }
-  ]
+  }
 });
 function _Button({
   children,
   className,
   preset = "secondary",
   shape = "normal",
-  innerClassName,
   thin = preset === "dimmed",
   ...props
 }, ref) {
@@ -187,7 +55,7 @@ function _Button({
       ref,
       ...props,
       className: (values) => {
-        return buttonBorder({
+        return button({
           className: resolveClassName(className, values),
           preset,
           shape,
@@ -195,26 +63,16 @@ function _Button({
           ...values
         });
       },
-      children: (values) => {
-        return /* @__PURE__ */ jsx(
-          "span",
-          {
-            className: button({
-              className: resolveClassName(innerClassName, values),
-              preset,
-              shape,
-              ...values
-            }),
-            children: typeof children === "function" ? children(values) : children
-          }
-        );
-      }
+      children
     }
   );
 }
 const Button = forwardRef(_Button);
+Button.displayName = "Button";
 export {
-  Button
+  Button,
+  _Button,
+  button
 };
 
 //# sourceMappingURL=button.js.map

package/dist/es/components/button.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"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","names":[],"ignoreList":[],"sources":["../../../src/components/button.tsx"],"sourcesContent":["import { type Ref, forwardRef } from \"react\";\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n\ttype ButtonRenderProps,\n} from \"react-aria-components\";\nimport {\n\tdimmedGradient,\n\tdisabledGradient,\n\tgoldGradient,\n\tgoldGradientHover,\n\tgoldGradientPressed,\n\thextechGradient,\n\thextechGradientHover,\n\thextechGradientPressed,\n} from \"../utilities/gradient.js\";\nimport { resolveClassName } from \"../utilities/resolve-class-name.js\";\nimport { tv } from \"../utilities/tv.js\";\n\nexport type ButtonShape = \"round\" | \"square\" | \"normal\";\nexport type ButtonPreset =\n\t| \"primary\"\n\t| \"secondary\"\n\t| \"text\"\n\t| \"hextech\"\n\t| \"dimmed\";\n\ninterface ButtonProps extends AriaButtonProps {\n\tinnerClassName?: string | ((values: ButtonRenderProps) => string);\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n}\n\nconst buttonBorder = tv({\n\tbase: \"bg-gradient-to-t p-0.5 outline-none transition-colors duration-200\",\n\tvariants: {\n\t\tpreset: {\n\t\t\tprimary: \"\",\n\t\t\tsecondary: \"\",\n\t\t\ttext: \"\",\n\t\t\thextech: \"\",\n\t\t\tdimmed: dimmedGradient,\n\t\t},\n\t\tshape: {\n\t\t\tround: \"aspect-square rounded-full\",\n\t\t\tsquare: \"aspect-square\",\n\t\t\tnormal: \"\",\n\t\t},\n\t\tisHovered: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisPressed: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisFocused: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisFocusVisible: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tthin: {\n\t\t\ttrue: \"p-px\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\"],\n\t\t\tclass: goldGradient,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\", \"dimmed\"],\n\t\t\tisHovered: true,\n\t\t\tclass: goldGradientHover,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\", \"dimmed\"],\n\t\t\tisPressed: true,\n\t\t\tclass: goldGradientPressed,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\", \"dimmed\"],\n\t\t\tisDisabled: true,\n\t\t\tclass: disabledGradient,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\"],\n\t\t\tisFocusVisible: true,\n\t\t\tclass: \"outline outline-offset-2 outline-yellow-50\",\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tclass: hextechGradient,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tisHovered: true,\n\t\t\tclass: hextechGradientHover,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tisPressed: true,\n\t\t\tclass: hextechGradientPressed,\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tisDisabled: true,\n\t\t\tclass: disabledGradient,\n\t\t},\n\t],\n});\n\nconst button = tv({\n\tbase: \"text-lol-gold-300 font-beaufort block h-full w-full font-bold uppercase tracking-wide transition-colors duration-200\",\n\tvariants: {\n\t\tpreset: {\n\t\t\tprimary:\n\t\t\t\t\"from-lol-gold-600 via-lol-gold-600 to-lol-gold-700 bg-gradient-to-b\",\n\t\t\tsecondary: \"\",\n\t\t\ttext: \"\",\n\t\t\thextech: \"text-lol-blue-100\",\n\t\t\tdimmed: \"bg-lol-grey-hextech-black\",\n\t\t},\n\t\tisHovered: {\n\t\t\ttrue: \"text-lol-gold-100\",\n\t\t},\n\t\tisPressed: {\n\t\t\ttrue: \"text-lol-grey-150\",\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: \"text-lol-grey-150\",\n\t\t},\n\t\tisFocused: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisFocusVisible: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tshape: {\n\t\t\tround: \"rounded-full\",\n\t\t\tsquare: \"\",\n\t\t\tnormal: \"\",\n\t\t},\n\t},\n\tcompoundVariants: [\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\", \"hextech\", \"dimmed\"],\n\t\t\tclass: \"px-4 py-2\",\n\t\t},\n\t\t{\n\t\t\tpreset: [\"primary\", \"secondary\", \"hextech\"],\n\t\t\tclass: \"bg-lol-grey-300\",\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tisHovered: true,\n\t\t\tclass: \"text-lol-blue-100\",\n\t\t},\n\t\t{\n\t\t\tpreset: [\"hextech\"],\n\t\t\tisPressed: true,\n\t\t\tclass: \"text-lol-blue-400\",\n\t\t},\n\t\t{\n\t\t\tpreset: [\"text\"],\n\t\t\tshape: [\"normal\", \"square\"],\n\t\t\tclass:\n\t\t\t\t\"relative after:absolute after:-bottom-2 after:-left-2 after:-right-2 after:-top-2\",\n\t\t},\n\t\t{\n\t\t\tisHovered: true,\n\t\t\tpreset: \"primary\",\n\t\t\tclass: \"from-lol-gold-600 via-lol-gold-600 to-lol-gold-500\",\n\t\t},\n\t\t{\n\t\t\tisPressed: true,\n\t\t\tpreset: \"primary\",\n\t\t\tclass:\n\t\t\t\t\"from-lol-gold-600 via-lol-gold-700 to-lol-gold-700 text-lol-gold-500\",\n\t\t},\n\t\t{\n\t\t\tshape: [\"round\", \"square\"],\n\t\t\tclass:\n\t\t\t\t\"flex aspect-square h-7 items-center justify-center p-0 font-black leading-none\",\n\t\t},\n\t\t{\n\t\t\tisHovered: true,\n\t\t\tpreset: \"text\",\n\t\t\tshape: [\"round\", \"square\"],\n\t\t\tclass: \"bg-lol-grey-300\",\n\t\t},\n\t],\n});\n\nfunction _Button(\n\t{\n\t\tchildren,\n\t\tclassName,\n\t\tpreset = \"secondary\",\n\t\tshape = \"normal\",\n\t\tinnerClassName,\n\t\tthin = preset === \"dimmed\",\n\t\t...props\n\t}: ButtonProps,\n\tref: Ref<HTMLButtonElement>,\n) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={(values) => {\n\t\t\t\treturn buttonBorder({\n\t\t\t\t\tclassName: resolveClassName(className, values),\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\t...values,\n\t\t\t\t});\n\t\t\t}}\n\t\t>\n\t\t\t{(values) => {\n\t\t\t\treturn (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName={button({\n\t\t\t\t\t\t\tclassName: resolveClassName(innerClassName, values),\n\t\t\t\t\t\t\tpreset,\n\t\t\t\t\t\t\tshape,\n\t\t\t\t\t\t\t...values,\n\t\t\t\t\t\t})}\n\t\t\t\t\t>\n\t\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t\t</span>\n\t\t\t\t);\n\t\t\t}}\n\t\t</AriaButton>\n\t);\n}\n\nexport const Button = forwardRef(_Button);\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"AAuEE;AAvEF,SAAmB,kBAAkB;AACrC;AAAA,EACC,UAAU;AAAA,OAEJ;AACP,SAAS,wBAAwB;AACjC,SAAS,WAAW;AACpB,OAAO,aAAa;AAgBb,MAAM,SAAS,IAAI;AAAA,EACzB,MAAM,QAAQ;AAAA,EACd,UAAU;AAAA,IACT,QAAQ;AAAA,MACP,SAAS,QAAQ;AAAA,MACjB,WAAW,QAAQ;AAAA,MACnB,MAAM,QAAQ;AAAA,MACd,SAAS,QAAQ;AAAA,MACjB,QAAQ,QAAQ;AAAA,IACjB;AAAA,IACA,WAAW;AAAA,MACV,MAAM,QAAQ;AAAA,IACf;AAAA,IACA,WAAW;AAAA,MACV,MAAM,QAAQ;AAAA,IACf;AAAA,IACA,YAAY;AAAA,MACX,MAAM,QAAQ;AAAA,IACf;AAAA,IACA,WAAW;AAAA,MACV,MAAM;AAAA,IACP;AAAA,IACA,gBAAgB;AAAA,MACf,MAAM,QAAQ;AAAA,IACf;AAAA,IACA,OAAO;AAAA,MACN,OAAO,QAAQ;AAAA,MACf,QAAQ,QAAQ;AAAA,MAChB,QAAQ,QAAQ;AAAA,IACjB;AAAA,IACA,MAAM;AAAA,MACL,MAAM,QAAQ;AAAA,IACf;AAAA,EACD;AACD,CAAC;AAEM,SAAS,QACf;AAAA,EACC;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,OAAO,WAAW;AAAA,EAClB,GAAG;AACJ,GACA,KACC;AACD,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACJ,WAAW,CAAC,WAAW;AACtB,eAAO,OAAO;AAAA,UACb,WAAW,iBAAiB,WAAW,MAAM;AAAA,UAC7C;AAAA,UACA;AAAA,UACA;AAAA,UACA,GAAG;AAAA,QACJ,CAAC;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACF;AAEF;AAEO,MAAM,SAAS,WAAW,OAAO;AACxC,OAAO,cAAc","names":[],"ignoreList":[],"sources":["../../../src/components/button.tsx"],"sourcesContent":["import { type Ref, forwardRef } from \"react\";\nimport {\n\tButton as AriaButton,\n\ttype ButtonProps as AriaButtonProps,\n} from \"react-aria-components\";\nimport { resolveClassName } from \"../utilities/resolve-class-name.js\";\nimport { cva } from \"cva\";\nimport classes from \"./button.module\";\n\nexport type ButtonShape = \"round\" | \"square\" | \"normal\";\nexport type ButtonPreset =\n\t| \"primary\"\n\t| \"secondary\"\n\t| \"text\"\n\t| \"hextech\"\n\t| \"dimmed\";\n\ninterface ButtonProps extends AriaButtonProps {\n\tpreset?: ButtonPreset;\n\tthin?: boolean;\n\tshape?: ButtonShape;\n}\n\nexport const button = cva({\n\tbase: classes.button,\n\tvariants: {\n\t\tpreset: {\n\t\t\tprimary: classes.primary,\n\t\t\tsecondary: classes.secondary,\n\t\t\ttext: classes.text,\n\t\t\thextech: classes.hextech,\n\t\t\tdimmed: classes.dimmed,\n\t\t},\n\t\tisHovered: {\n\t\t\ttrue: classes.hover,\n\t\t},\n\t\tisPressed: {\n\t\t\ttrue: classes.press,\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t\tisFocused: {\n\t\t\ttrue: \"\",\n\t\t},\n\t\tisFocusVisible: {\n\t\t\ttrue: classes.focusVisible,\n\t\t},\n\t\tshape: {\n\t\t\tround: classes.round,\n\t\t\tsquare: classes.square,\n\t\t\tnormal: classes.normal,\n\t\t},\n\t\tthin: {\n\t\t\ttrue: classes.thin,\n\t\t},\n\t},\n});\n\nexport function _Button(\n\t{\n\t\tchildren,\n\t\tclassName,\n\t\tpreset = \"secondary\",\n\t\tshape = \"normal\",\n\t\tthin = preset === \"dimmed\",\n\t\t...props\n\t}: ButtonProps,\n\tref: Ref<HTMLButtonElement>,\n) {\n\treturn (\n\t\t<AriaButton\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t\tclassName={(values) => {\n\t\t\t\treturn button({\n\t\t\t\t\tclassName: resolveClassName(className, values),\n\t\t\t\t\tpreset,\n\t\t\t\t\tshape,\n\t\t\t\t\tthin,\n\t\t\t\t\t...values,\n\t\t\t\t});\n\t\t\t}}\n\t\t>\n\t\t\t{children}\n\t\t</AriaButton>\n\t);\n}\n\nexport const Button = forwardRef(_Button);\nButton.displayName = \"Button\";\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/button.module.js

@@ -0,0 +1,7 @@
+import "./button_module.css";
+var button_default = { "button": "button_56ea2", "text": "text_56ea2", "round": "round_56ea2", "hover": "hover_56ea2", "square": "square_56ea2", "normal": "normal_56ea2", "press": "press_56ea2", "disabled": "disabled_56ea2", "hextech": "hextech_56ea2", "dimmed": "dimmed_56ea2", "selected": "selected_56ea2", "primary": "primary_56ea2", "secondary": "secondary_56ea2", "focusVisible": "focusVisible_56ea2", "thin": "thin_56ea2" };
+export {
+  button_default as default
+};
+
+//# sourceMappingURL=button.module.js.map

package/dist/es/components/button.module.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,OAAO;AAAsB,IAAO,iBAAQ,EAAC,UAAS,gBAAe,QAAO,cAAa,SAAQ,eAAc,SAAQ,eAAc,UAAS,gBAAe,UAAS,gBAAe,SAAQ,eAAc,YAAW,kBAAiB,WAAU,iBAAgB,UAAS,gBAAe,YAAW,kBAAiB,WAAU,iBAAgB,aAAY,mBAAkB,gBAAe,sBAAqB,QAAO,aAAY","names":[],"ignoreList":[],"sources":["../../../src/components/button.module.css"],"sourcesContent":["import \"./button_module.css\";export default {\"button\":\"button_56ea2\",\"text\":\"text_56ea2\",\"round\":\"round_56ea2\",\"hover\":\"hover_56ea2\",\"square\":\"square_56ea2\",\"normal\":\"normal_56ea2\",\"press\":\"press_56ea2\",\"disabled\":\"disabled_56ea2\",\"hextech\":\"hextech_56ea2\",\"dimmed\":\"dimmed_56ea2\",\"selected\":\"selected_56ea2\",\"primary\":\"primary_56ea2\",\"secondary\":\"secondary_56ea2\",\"focusVisible\":\"focusVisible_56ea2\",\"thin\":\"thin_56ea2\"}//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/button_module.css

@@ -0,0 +1,158 @@
+.button_56ea2 {
+	border-radius: 0px;
+	border: 2px solid transparent;
+	outline: none;
+	transition: all;
+	transition-duration: 0.3s;
+
+	font-family: var(--lol-font-family-beaufort);
+	color: var(--lol-color-gold-300);
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	font-size: 1rem;
+
+	background: var(--lol-button-background-gradient) padding-box,
+		var(--lol-button-border-gradient) border-box;
+	display: inline-block;
+}
+
+.text_56ea2.round_56ea2.hover_56ea2, .text_56ea2.square_56ea2.hover_56ea2 {
+			--lol-button-background-gradient: var(--lol-gradient-grey-300);
+			--lol-button-border-gradient: var(--lol-gradient-transparent);
+		}
+
+.text_56ea2.round_56ea2,
+	.text_56ea2.square_56ea2,
+	.text_56ea2.normal_56ea2 {
+		position: relative;
+	}
+
+.text_56ea2.round_56ea2::after, .text_56ea2.square_56ea2::after, .text_56ea2.normal_56ea2::after {
+			position: absolute;
+			top: -0.5rem;
+			left: -0.5rem;
+			bottom: -0.5rem;
+			right: -0.5rem;
+			content: '';
+		}
+
+.hover_56ea2 {
+	color: var(--lol-color-gold-100);
+}
+
+.press_56ea2 {
+	color: var(--lol-color-grey-150);
+}
+
+.disabled_56ea2 {
+	color: var(--lol-color-grey-150);
+}
+
+.hextech_56ea2 {
+	color: var(--lol-color-blue-100);
+	--lol-button-border-gradient: var(--lol-gradient-hextech);
+	--lol-button-background-gradient: var(--lol-gradient-grey-300);
+}
+
+.hextech_56ea2.hover_56ea2 {
+		color: var(--lol-color-blue-100);
+		--lol-button-border-gradient: var(--lol-gradient-hextech-hover);
+	}
+
+.hextech_56ea2.press_56ea2 {
+		color: var(--lol-color-blue-400);
+		--lol-button-border-gradient: var(--lol-gradient-hextech-press);
+	}
+
+.hextech_56ea2.disabled_56ea2 {
+		color: var(--lol-color-grey-150);
+		--lol-button-border-gradient: var(--lol-gradient-disabled);
+	}
+
+.dimmed_56ea2 {
+	--lol-button-background-gradient: var(--lol-gradient-hextech-black);
+	--lol-button-border-gradient: var(--lol-gradient-grey-300);
+}
+
+.dimmed_56ea2.selected_56ea2 {
+		--lol-button-border-gradient: var(--lol-gradient-gold);
+	}
+
+.primary_56ea2 {
+	--lol-button-border-gradient: var(--lol-gradient-gold);
+	--lol-button-background-gradient: linear-gradient(to top, var(--lol-color-gold-600), var(--lol-color-gold-600), var(--lol-color-gold-700));
+}
+
+.primary_56ea2.hover_56ea2 {
+		--lol-button-background-gradient: linear-gradient(to top, var(--lol-color-gold-600), var(--lol-color-gold-600), var(--lol-color-gold-500));
+	}
+
+.primary_56ea2.press_56ea2 {
+		--lol-button-background-gradient: linear-gradient(to top, var(--lol-color-gold-600), var(--lol-color-gold-700), var(--lol-color-gold-700));
+	}
+
+.primary_56ea2,
+.secondary_56ea2,
+.hextech_56ea2,
+.dimmed_56ea2 {
+	padding: 0.5rem 1rem;
+}
+
+.secondary_56ea2 {
+	--lol-button-border-gradient: var(--lol-gradient-gold);
+	--lol-button-background-gradient: var(--lol-gradient-grey-300);
+}
+
+.primary_56ea2.hover_56ea2,
+.secondary_56ea2.hover_56ea2,
+.dimmed_56ea2.hover_56ea2 {
+	--lol-button-border-gradient: var(--lol-gradient-gold-hover);
+}
+
+
+.primary_56ea2.press_56ea2,
+.secondary_56ea2.press_56ea2,
+.dimmed_56ea2.press_56ea2 {
+	--lol-button-border-gradient: var(--lol-gradient-gold-press);
+}
+
+
+.primary_56ea2.disabled_56ea2,
+.secondary_56ea2.disabled_56ea2,
+.dimmed_56ea2.disabled_56ea2 {
+	--lol-button-border-gradient: var(--lol-gradient-disabled);
+}
+
+.primary_56ea2.focusVisible_56ea2,
+.secondary_56ea2.focusVisible_56ea2 {
+	outline-style: solid;
+	outline-offset: 2px;
+	outline-color: var(--lol-color-gold-400);
+}
+
+.round_56ea2 {
+	border-radius: 9999px;
+}
+
+.round_56ea2,
+.square_56ea2 {
+	display: flex;
+	aspect-ratio: 1/1;
+	height: 2rem;
+	align-items: center;
+	justify-content: center;
+	padding: 0px;
+	font-weight: 900;
+	line-height: 1;
+}
+
+.thin_56ea2 {
+	border-width: 1px;
+}
+
+.selected_56ea2 {
+	--lol-button-background-gradient: var(--lol-gradient-hextech);
+	box-shadow: inset 0 2px 4px 0 var(--lol-color-grey-300);
+	color: var(--lol-color-blue-100);
+}

package/dist/es/components/card.d.ts

@@ -1,6 +1,6 @@
 import type { ComponentProps } from "react";
 export interface CardProps extends ComponentProps<"div"> {
-    borderProps?: ComponentProps<"div">;
+    radius?: string;
+    borderWidth?: string;
 }
-export declare function Card({ children, className, style, borderProps }: CardProps): import("react/jsx-runtime").JSX.Element;
-export declare function borderInverted(r: string): string;
+export declare function Card({ className, style, radius, borderWidth, ...props }: CardProps): import("react/jsx-runtime").JSX.Element;

package/dist/es/components/card.js

@@ -1,51 +1,32 @@
 import { jsx } from "react/jsx-runtime";
-import { goldGradient } from "../utilities/gradient.js";
-import { tv } from "../utilities/tv.js";
-const cardBorder = tv({
-  base: ["bg-gradient-to-t p-[2px]", goldGradient],
-  variants: {}
+import { cva } from "cva";
+import classes from "./card.module";
+const card = cva({
+  base: classes.card
 });
-const inner = tv({
-  base: "bg-lol-grey-hextech-black w-full",
-  variants: {}
-});
-function Card({ children, className, style, borderProps }) {
-  const r = "1rem";
+function Card({
+  className,
+  style,
+  radius = "1rem",
+  borderWidth = "2px",
+  ...props
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      ...borderProps ?? {},
-      className: cardBorder({
-        className: borderProps?.className
-      }),
+      className: card({ className }),
       style: {
-        WebkitMask: borderInverted(r),
-        mask: borderInverted(r),
-        ...borderProps?.style ?? {}
+        // @ts-ignore: Css variable
+        "--lol-card-radius": radius,
+        "--lol-card-border-width": borderWidth,
+        ...style ?? {}
       },
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: inner({
-            className
-          }),
-          style: {
-            WebkitMask: borderInverted(r),
-            mask: borderInverted(r),
-            ...style ?? {}
-          },
-          children
-        }
-      )
+      ...props
     }
   );
 }
-function borderInverted(r) {
-  return `radial-gradient(${r} at ${r} ${r},#0000 98%,#000) -${r} -${r}`;
-}
 export {
-  Card,
-  borderInverted
+  Card
 };
 
 //# sourceMappingURL=card.js.map

package/dist/es/components/card.js.map

@@ -1 +1 @@
-{"version":3,"mappings":"AAiCG;AAhCH,SAAS,oBAAoB;AAC7B,SAAS,UAAU;AAMnB,MAAM,aAAa,GAAG;AAAA,EACrB,MAAM,CAAC,4BAA4B,YAAY;AAAA,EAC/C,UAAU,CAAC;AACZ,CAAC;AAED,MAAM,QAAQ,GAAG;AAAA,EAChB,MAAM;AAAA,EACN,UAAU,CAAC;AACZ,CAAC;AAEM,SAAS,KAAK,EAAE,UAAU,WAAW,OAAO,YAAY,GAAc;AAC5E,QAAM,IAAI;AAEV,SACC;AAAA,IAAC;AAAA;AAAA,MACC,GAAI,eAAe,CAAC;AAAA,MACrB,WAAW,WAAW;AAAA,QACrB,WAAW,aAAa;AAAA,MACzB,CAAC;AAAA,MACD,OAAO;AAAA,QACN,YAAY,eAAe,CAAC;AAAA,QAC5B,MAAM,eAAe,CAAC;AAAA,QACtB,GAAI,aAAa,SAAS,CAAC;AAAA,MAC5B;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACA,WAAW,MAAM;AAAA,YAChB;AAAA,UACD,CAAC;AAAA,UACD,OAAO;AAAA,YACN,YAAY,eAAe,CAAC;AAAA,YAC5B,MAAM,eAAe,CAAC;AAAA,YACtB,GAAI,SAAS,CAAC;AAAA,UACf;AAAA,UAEC;AAAA;AAAA,MACF;AAAA;AAAA,EACD;AAEF;AAEO,SAAS,eAAe,GAAW;AACzC,SAAO,mBAAmB,CAAC,OAAO,CAAC,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC;AACrE","names":[],"ignoreList":[],"sources":["../../../src/components/card.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { goldGradient } from \"../utilities/gradient.js\";\nimport { tv } from \"../utilities/tv.js\";\n\nexport interface CardProps extends ComponentProps<\"div\"> {\n\tborderProps?: ComponentProps<\"div\">;\n}\n\nconst cardBorder = tv({\n\tbase: [\"bg-gradient-to-t p-[2px]\", goldGradient],\n\tvariants: {},\n});\n\nconst inner = tv({\n\tbase: \"bg-lol-grey-hextech-black w-full\",\n\tvariants: {},\n});\n\nexport function Card({ children, className, style, borderProps }: CardProps) {\n\tconst r = \"1rem\";\n\n\treturn (\n\t\t<div\n\t\t\t{...(borderProps ?? {})}\n\t\t\tclassName={cardBorder({\n\t\t\t\tclassName: borderProps?.className,\n\t\t\t})}\n\t\t\tstyle={{\n\t\t\t\tWebkitMask: borderInverted(r),\n\t\t\t\tmask: borderInverted(r),\n\t\t\t\t...(borderProps?.style ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={inner({\n\t\t\t\t\tclassName,\n\t\t\t\t})}\n\t\t\t\tstyle={{\n\t\t\t\t\tWebkitMask: borderInverted(r),\n\t\t\t\t\tmask: borderInverted(r),\n\t\t\t\t\t...(style ?? {}),\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nexport function borderInverted(r: string) {\n\treturn `radial-gradient(${r} at ${r} ${r},#0000 98%,#000) -${r} -${r}`;\n}\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}
+{"version":3,"mappings":"AAqBE;AArBF,SAAS,WAAW;AAEpB,OAAO,aAAa;AAOpB,MAAM,OAAO,IAAI;AAAA,EAChB,MAAM,QAAQ;AACf,CAAC;AAEM,SAAS,KAAK;AAAA,EACpB;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,cAAc;AAAA,EACd,GAAG;AACJ,GAAc;AACb,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW,KAAK,EAAE,UAAU,CAAC;AAAA,MAC7B,OAAO;AAAA;AAAA,QAEN,qBAAqB;AAAA,QACrB,2BAA2B;AAAA,QAC3B,GAAI,SAAS,CAAC;AAAA,MACf;AAAA,MACC,GAAG;AAAA;AAAA,EACL;AAEF","names":[],"ignoreList":[],"sources":["../../../src/components/card.tsx"],"sourcesContent":["import { cva } from \"cva\";\nimport type { ComponentProps } from \"react\";\nimport classes from \"./card.module\";\n\nexport interface CardProps extends ComponentProps<\"div\"> {\n\tradius?: string;\n\tborderWidth?: string;\n}\n\nconst card = cva({\n\tbase: classes.card,\n});\n\nexport function Card({\n\tclassName,\n\tstyle,\n\tradius = \"1rem\",\n\tborderWidth = \"2px\",\n\t...props\n}: CardProps) {\n\treturn (\n\t\t<div\n\t\t\tclassName={card({ className })}\n\t\t\tstyle={{\n\t\t\t\t// @ts-ignore: Css variable\n\t\t\t\t\"--lol-card-radius\": radius,\n\t\t\t\t\"--lol-card-border-width\": borderWidth,\n\t\t\t\t...(style ?? {}),\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/card.module.js

@@ -0,0 +1,7 @@
+import "./card_module.css";
+var card_default = { "card": "card_dfb9a" };
+export {
+  card_default as default
+};
+
+//# sourceMappingURL=card.module.js.map

package/dist/es/components/card.module.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,OAAO;AAAoB,IAAO,eAAQ,EAAC,QAAO,aAAY","names":[],"ignoreList":[],"sources":["../../../src/components/card.module.css"],"sourcesContent":["import \"./card_module.css\";export default {\"card\":\"card_dfb9a\"}//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/card_module.css

@@ -0,0 +1,16 @@
+.card_dfb9a {
+	position: relative;
+	--mask:
+		radial-gradient(var(--lol-card-radius) at var(--lol-card-radius) var(--lol-card-radius), #0000 calc(98% - var(--lol-card-border-width)), #000 calc(100% - var(--lol-card-border-width)) 98%, #0000) calc(var(--lol-card-radius) * -1) calc(var(--lol-card-radius) * -1),
+		linear-gradient(90deg, #000 calc(var(--lol-card-border-width) * 2), #0000 0) calc(var(--lol-card-border-width) * -1) 50% /100% calc(100% - calc(var(--lol-card-radius) * 2) + var(--lol-card-border-width)) repeat-x,
+		linear-gradient(#000 calc(var(--lol-card-border-width) * 2), #0000 0) 50% calc(var(--lol-card-border-width) * -1)/calc(100% - calc(var(--lol-card-radius) * 2) + var(--lol-card-border-width)) 100% repeat-y;
+}
+
+.card_dfb9a:before {
+	content: "";
+	position: absolute;
+	inset: 0;
+	background-image: var(--lol-gradient-gold);
+	mask: var(--mask);
+	pointer-events: none;
+}

package/dist/es/components/checkbox/checkbox.js

@@ -0,0 +1,55 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "cva";
+import {
+  Checkbox as AriaCheckbox
+} from "react-aria-components";
+import { resolveClassName } from "../../utilities/resolve-class-name.js";
+import classes from "./checkbox.module";
+import imageCheckedHover from "../../assets/checked-hover.d13cb1b3.png";
+import imageChecked from "../../assets/checked.3258b858.png";
+import imageIndeterminateHover from "../../assets/indeterminate-hover.68fcbcda.png";
+import imageIndeterminate from "../../assets/indeterminate.90d6dc3e.png";
+import imageUncheckedHover from "../../assets/unchecked-hover.c8e5f2d0.png";
+import imageUnchecked from "../../assets/unchecked.cc033abe.png";
+const checkbox = cva({
+  base: classes.checkbox,
+  variants: {
+    isHovered: {
+      true: classes.hover
+    },
+    isDisabled: {
+      true: classes.disabled
+    }
+  }
+});
+function Checkbox({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    AriaCheckbox,
+    {
+      className: (values) => {
+        return checkbox({
+          className: resolveClassName(className, values),
+          ...values
+        });
+      },
+      ...props,
+      children: (values) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "img",
+          {
+            className: "h-3.5 w-3.5",
+            "aria-hidden": "true",
+            alt: "",
+            src: values.isHovered ? values.isIndeterminate ? imageIndeterminateHover : values.isSelected ? imageCheckedHover : imageUncheckedHover : values.isIndeterminate ? imageIndeterminate : values.isSelected ? imageChecked : imageUnchecked
+          }
+        ),
+        typeof children === "function" ? children(values) : children
+      ] })
+    }
+  );
+}
+export {
+  Checkbox
+};
+
+//# sourceMappingURL=checkbox.js.map

package/dist/es/components/checkbox/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAsCI,mBACC,KADD;AAtCJ,SAAS,WAAW;AACpB;AAAA,EACC,YAAY;AAAA,OAEN;AACP,SAAS,wBAAwB;AACjC,OAAO,aAAa;AACpB,OAAO,uBAAuB;AAC9B,OAAO,kBAAkB;AACzB,OAAO,6BAA6B;AACpC,OAAO,wBAAwB;AAC/B,OAAO,yBAAyB;AAChC,OAAO,oBAAoB;AAE3B,MAAM,WAAW,IAAI;AAAA,EACpB,MAAM,QAAQ;AAAA,EACd,UAAU;AAAA,IACT,WAAW;AAAA,MACV,MAAM,QAAQ;AAAA,IACf;AAAA,IACA,YAAY;AAAA,MACX,MAAM,QAAQ;AAAA,IACf;AAAA,EACD;AACD,CAAC;AAEM,SAAS,SAAS,EAAE,UAAU,WAAW,GAAG,MAAM,GAAkB;AAC1E,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAW,CAAC,WAAW;AACtB,eAAO,SAAS;AAAA,UACf,WAAW,iBAAiB,WAAW,MAAM;AAAA,UAC7C,GAAG;AAAA,QACJ,CAAC;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,WAAC,WACD,iCACC;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,KAAI;AAAA,YACJ,KACC,OAAO,YACJ,OAAO,kBACN,0BACA,OAAO,aACN,oBACA,sBACF,OAAO,kBACN,qBACA,OAAO,aACN,eACA;AAAA;AAAA,QAEP;AAAA,QACC,OAAO,aAAa,aAAa,SAAS,MAAM,IAAI;AAAA,SACtD;AAAA;AAAA,EAEF;AAEF","names":[],"ignoreList":[],"sources":["../../../../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { cva } from \"cva\";\nimport {\n\tCheckbox as AriaCheckbox,\n\ttype CheckboxProps,\n} from \"react-aria-components\";\nimport { resolveClassName } from \"../../utilities/resolve-class-name.js\";\nimport classes from \"./checkbox.module\";\nimport imageCheckedHover from \"../../assets/checked-hover.d13cb1b3.png\";\nimport imageChecked from \"../../assets/checked.3258b858.png\";\nimport imageIndeterminateHover from \"../../assets/indeterminate-hover.68fcbcda.png\";\nimport imageIndeterminate from \"../../assets/indeterminate.90d6dc3e.png\";\nimport imageUncheckedHover from \"../../assets/unchecked-hover.c8e5f2d0.png\";\nimport imageUnchecked from \"../../assets/unchecked.cc033abe.png\";\n\nconst checkbox = cva({\n\tbase: classes.checkbox,\n\tvariants: {\n\t\tisHovered: {\n\t\t\ttrue: classes.hover,\n\t\t},\n\t\tisDisabled: {\n\t\t\ttrue: classes.disabled,\n\t\t},\n\t},\n});\n\nexport function Checkbox({ children, className, ...props }: CheckboxProps) {\n\treturn (\n\t\t<AriaCheckbox\n\t\t\tclassName={(values) => {\n\t\t\t\treturn checkbox({\n\t\t\t\t\tclassName: resolveClassName(className, values),\n\t\t\t\t\t...values,\n\t\t\t\t});\n\t\t\t}}\n\t\t\t{...props}\n\t\t>\n\t\t\t{(values) => (\n\t\t\t\t<>\n\t\t\t\t\t<img\n\t\t\t\t\t\tclassName=\"h-3.5 w-3.5\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={\n\t\t\t\t\t\t\tvalues.isHovered\n\t\t\t\t\t\t\t\t? values.isIndeterminate\n\t\t\t\t\t\t\t\t\t? imageIndeterminateHover\n\t\t\t\t\t\t\t\t\t: values.isSelected\n\t\t\t\t\t\t\t\t\t\t? imageCheckedHover\n\t\t\t\t\t\t\t\t\t\t: imageUncheckedHover\n\t\t\t\t\t\t\t\t: values.isIndeterminate\n\t\t\t\t\t\t\t\t\t? imageIndeterminate\n\t\t\t\t\t\t\t\t\t: values.isSelected\n\t\t\t\t\t\t\t\t\t\t? imageChecked\n\t\t\t\t\t\t\t\t\t\t: imageUnchecked\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t\t{typeof children === \"function\" ? children(values) : children}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</AriaCheckbox>\n\t);\n}\n//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/checkbox/checkbox.module.js

@@ -0,0 +1,7 @@
+import "./checkbox_module.css";
+var checkbox_default = { "checkbox": "checkbox_8a1c7", "hover": "hover_8a1c7", "disabled": "disabled_8a1c7" };
+export {
+  checkbox_default as default
+};
+
+//# sourceMappingURL=checkbox.module.js.map

package/dist/es/components/checkbox/checkbox.module.js.map

@@ -0,0 +1 @@
+{"version":3,"mappings":"AAAA,OAAO;AAAwB,IAAO,mBAAQ,EAAC,YAAW,kBAAiB,SAAQ,eAAc,YAAW,iBAAgB","names":[],"ignoreList":[],"sources":["../../../../src/components/checkbox/checkbox.module.css"],"sourcesContent":["import \"./checkbox_module.css\";export default {\"checkbox\":\"checkbox_8a1c7\",\"hover\":\"hover_8a1c7\",\"disabled\":\"disabled_8a1c7\"}//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJtYXBwaW5ncyI6IiIsIm5hbWVzIjpbXSwiaWdub3JlTGlzdCI6W10sInNvdXJjZXMiOltdLCJzb3VyY2VzQ29udGVudCI6W119"]}

package/dist/es/components/checkbox/checkbox_module.css

@@ -0,0 +1,17 @@
+.checkbox_8a1c7 {
+	font-family: var(--lol-font-family-spiegel);
+	color: var(--lol-color-grey-100);
+	display: flex;
+	cursor: pointer;
+	align-items: center;
+	gap: 0.25rem;
+	font-size: .75rem;
+	letter-spacing: .1em;
+}
+.checkbox_8a1c7.hover_8a1c7 {
+		color: var(--lol-color-gold-100);
+	}
+.checkbox_8a1c7.disabled_8a1c7 {
+		filter: brightness(0.5);
+		cursor: default;
+	}