@unllamas/ui
Advanced tools
+5
-1
@@ -7,4 +7,8 @@ /** @type {import("eslint").Linter.Config} */ | ||
| parserOptions: { | ||
| // project: "./tsconfig.lint.json", | ||
| "ecmaFeatures": { | ||
| "jsx": true | ||
| }, | ||
| "ecmaVersion": 12, | ||
| "sourceType": "module" | ||
| }, | ||
| }; |
| > @unllamas/ui@0.0.2 lint /Users/macbook/Documents/Testing/component-test/packages/ui | ||
| > @unllamas/ui@0.0.3 lint /Users/macbook/Documents/Testing/component-test/packages/ui | ||
| > eslint . --max-warnings 0 | ||
+1
-1
| { | ||
| "name": "@unllamas/ui", | ||
| "version": "0.0.3", | ||
| "version": "0.0.4", | ||
| "private": false, | ||
@@ -5,0 +5,0 @@ "exports": { |
+25
-27
| "use client"; | ||
| import { Variant, Color, ButtonProps } from "./types"; | ||
| import { ButtonProps } from "./types"; | ||
@@ -8,25 +8,2 @@ import { theme } from "../theme"; | ||
| function variantsList(variant: Variant, color: Color) { | ||
| const list = { | ||
| filled: { | ||
| background: theme.colors[color], | ||
| color: theme.colors.black, | ||
| }, | ||
| bezeled: { | ||
| background: theme.colors[`${color}15`], | ||
| color: theme.colors[color], | ||
| }, | ||
| bezeledGray: { | ||
| background: theme.colors.gray15, | ||
| color: theme.colors[color], | ||
| }, | ||
| borderless: { | ||
| background: theme.colors.transparent, | ||
| color: theme.colors[color], | ||
| }, | ||
| }; | ||
| return list[variant]; | ||
| } | ||
| export function Button(props: ButtonProps) { | ||
@@ -48,2 +25,24 @@ const { | ||
| let backgroundColor: string = "transparent"; | ||
| let textColor: string = theme.colors.text; | ||
| switch (variant) { | ||
| case "filled": | ||
| backgroundColor = theme.colors[color]; | ||
| textColor = theme.colors.black; | ||
| break; | ||
| case "bezeled": | ||
| backgroundColor = theme.colors[`${color}15`]; | ||
| textColor = theme.colors[color]; | ||
| break; | ||
| case "bezeledGray": | ||
| backgroundColor = theme.colors.gray15; | ||
| textColor = theme.colors[color]; | ||
| break; | ||
| case "borderless": | ||
| backgroundColor = "transparent"; | ||
| textColor = theme.colors[color]; | ||
| break; | ||
| } | ||
| return ( | ||
@@ -59,6 +58,5 @@ <BaseButton | ||
| $isSmall={size === "small"} | ||
| $background={variantsList(variant, color)?.background} | ||
| $color={variantsList(variant, color)?.color} | ||
| $background={backgroundColor} | ||
| $color={textColor} | ||
| > | ||
| {/* {loading ? <BtnLoader /> : children} */} | ||
| {children} | ||
@@ -65,0 +63,0 @@ </BaseButton> |
8286
0.35%306
0.66%