🎨 improve badge with capitalize

tonightpass · Apr 2, 2023 · 6f7d3a1 · 6f7d3a1 · vercel · Apr 2, 2023
1 parent bd30326
commit 6f7d3a1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/.changeset/thirty-spies-worry.md b/.changeset/thirty-spies-worry.md
@@ -0,0 +1,5 @@
+---
+"@tonightpass/kitchen": patch
+---
+
+Improve `Badge` with capitalize
diff --git a/packages/kitchen/src/components/Badge/index.tsx b/packages/kitchen/src/components/Badge/index.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import styled from "styled-components";
 import withScale from "../../hoc/withScale";
 import { KitchenComponent, NormalSizes } from "../../types";
+import { capitalize, isString } from "../..";
 
 type Props = {
   /**
@@ -24,8 +25,14 @@ type Props = {
 
 export type BadgeProps = KitchenComponent<Props>;
 
-const Badge = styled((props: BadgeProps) => {
-  return <span {...props} />;
+const Badge = styled(({ children, ...props }: BadgeProps) => {
+  return (
+    <span {...props}>
+      {children && isString(children)
+        ? capitalize(children as string)
+        : children}
+    </span>
+  );
 })<BadgeProps>`
   box-sizing: border-box;
   display: inline-flex;