@lets-events/react 12.7.1 → 12.7.2

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @lets-events/react@12.7.1 build
+> @lets-events/react@12.7.2 build
 > tsup src/index.tsx  --format esm,cjs --dts --external react
 
 CLI Building entry: src/index.tsx
@@ -9,11 +9,11 @@
 CLI Target: es6
 ESM Build start
 CJS Build start
-CJS dist\index.js 404.79 KB
-CJS ⚡️ Build success in 199ms
 ESM dist\index.mjs 389.70 KB
-ESM ⚡️ Build success in 201ms
+ESM ⚡️ Build success in 199ms
+CJS dist\index.js 404.79 KB
+CJS ⚡️ Build success in 204ms
 DTS Build start
-DTS ⚡️ Build success in 4529ms
+DTS ⚡️ Build success in 4599ms
 DTS dist\index.d.mts 403.02 KB
 DTS dist\index.d.ts  403.02 KB

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @lets-events/react
 
+## 12.7.2
+
+### Patch Changes
+
+- fix xs badge
+
 ## 12.7.1
 
 ### Patch Changes

package/dist/index.js

@@ -3692,7 +3692,7 @@ var BadgeStyled = styled(import_themes11.Badge, {
         padding: "$4 $6",
         fontSize: "$badgeExtraSmall",
         borderRadius: "$2xs",
-        lineHeight: "$bagdeExtraSmall"
+        lineHeight: "$badgeExtraSmall"
       },
       sm: {
         padding: "$4 $8",
@@ -3720,7 +3720,7 @@ var BadgeStyled = styled(import_themes11.Badge, {
       bold: { fontWeight: "$bold" }
     },
     radii: {
-      "full": {
+      full: {
         borderRadius: "$full"
       }
     }

package/dist/index.mjs

@@ -3577,7 +3577,7 @@ var BadgeStyled = styled(BadgeRadix, {
         padding: "$4 $6",
         fontSize: "$badgeExtraSmall",
         borderRadius: "$2xs",
-        lineHeight: "$bagdeExtraSmall"
+        lineHeight: "$badgeExtraSmall"
       },
       sm: {
         padding: "$4 $8",
@@ -3605,7 +3605,7 @@ var BadgeStyled = styled(BadgeRadix, {
       bold: { fontWeight: "$bold" }
     },
     radii: {
-      "full": {
+      full: {
         borderRadius: "$full"
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lets-events/react",
-  "version": "12.7.1",
+  "version": "12.7.2",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/components/Badge.tsx

@@ -1,125 +1,123 @@
-import React from 'react'
-import { ComponentProps, ElementType } from 'react'
-import { styled } from '../styles'
-import { Badge as BadgeRadix } from '@radix-ui/themes'
+import React from "react";
+import { ComponentProps, ElementType } from "react";
+import { styled } from "../styles";
+import { Badge as BadgeRadix } from "@radix-ui/themes";
 export const BadgeStyled = styled(BadgeRadix, {
-    fontFamily: '$default',
-    borderRadius: '$sm',
-    verticalAlign: 'middle',
-    variants: {
-        color: {
-            primary: {
-                backgroundColor: '$brand100',
-                color: '$dark700',
-            },
-            dark: {
-                backgroundColor: '$dark700',
-                color: '$grey50',
-            },
-            light: {
-                backgroundColor: '$neutral200',
-                color: '$dark700',
-            },
-            red: {
-                backgroundColor: '$red100',
-                color: '$dark700',
-            },
-            green: {
-                backgroundColor: '$green100',
-                color: '$dark700',
-            },
-            yellow: {
-                backgroundColor: '$yellow100',
-                color: '$dark700',
-            },
-            orange: {
-                backgroundColor: '$orange100',
-                color: '$dark700',
-            },
-            blue: {
-                backgroundColor: '$blue100',
-                color: '$dark700',
-            },
-            pink: {
-                backgroundColor: '$pink100',
-                color: '$dark700',
-            },
-            purple: {
-                backgroundColor: '$purple100',
-                color: '$dark700',
-            },
-            grey: {
-                backgroundColor: '$grey200',
-                color: '$dark700',
-            },
-            disable: {
-                backgroundColor: '$neutral200',
-                color: '$grey500',
-            }
-
-
-        },
-        size: {
-            xs: {
-                padding: '$4 $6',
-                fontSize: '$badgeExtraSmall',
-                borderRadius: '$2xs',
-                lineHeight: '$bagdeExtraSmall',
-            },
-            sm: {
-                padding: '$4 $8',
-                fontSize: '$badgeSmall',
-                borderRadius: '$xs',
-                lineHeight: '$badgeSmall',
-            },
-            md: {
-                padding: '$8 $10',
-                fontSize: '$badgeMedium',
-                borderRadius: '$sm',
-                lineHeight: '$badgeMedium',
-            },
-            xl: {
-                padding: '$12 $12',
-                fontSize: '$badgeLarge',
-                borderRadius: '$sm',
-                lineHeight: '$badgeLarge',
-            },
-        },
-        fontWeight: {
-            regular: { fontWeight: '$regular' },
-            medium: { fontWeight: '$medium' },
-            semibold: { fontWeight: '$semibold' },
-            bold: { fontWeight: '$bold' },
-        },
-        radii: {
-            'full': {
-                borderRadius: '$full',
-            },
-        },
+  fontFamily: "$default",
+  borderRadius: "$sm",
+  verticalAlign: "middle",
+  variants: {
+    color: {
+      primary: {
+        backgroundColor: "$brand100",
+        color: "$dark700",
+      },
+      dark: {
+        backgroundColor: "$dark700",
+        color: "$grey50",
+      },
+      light: {
+        backgroundColor: "$neutral200",
+        color: "$dark700",
+      },
+      red: {
+        backgroundColor: "$red100",
+        color: "$dark700",
+      },
+      green: {
+        backgroundColor: "$green100",
+        color: "$dark700",
+      },
+      yellow: {
+        backgroundColor: "$yellow100",
+        color: "$dark700",
+      },
+      orange: {
+        backgroundColor: "$orange100",
+        color: "$dark700",
+      },
+      blue: {
+        backgroundColor: "$blue100",
+        color: "$dark700",
+      },
+      pink: {
+        backgroundColor: "$pink100",
+        color: "$dark700",
+      },
+      purple: {
+        backgroundColor: "$purple100",
+        color: "$dark700",
+      },
+      grey: {
+        backgroundColor: "$grey200",
+        color: "$dark700",
+      },
+      disable: {
+        backgroundColor: "$neutral200",
+        color: "$grey500",
+      },
     },
-
-    defaultVariants: {
-        size: 'md',
-        color: 'primary',
-        fontWeight: 'regular',
+    size: {
+      xs: {
+        padding: "$4 $6",
+        fontSize: "$badgeExtraSmall",
+        borderRadius: "$2xs",
+        lineHeight: "$badgeExtraSmall",
+      },
+      sm: {
+        padding: "$4 $8",
+        fontSize: "$badgeSmall",
+        borderRadius: "$xs",
+        lineHeight: "$badgeSmall",
+      },
+      md: {
+        padding: "$8 $10",
+        fontSize: "$badgeMedium",
+        borderRadius: "$sm",
+        lineHeight: "$badgeMedium",
+      },
+      xl: {
+        padding: "$12 $12",
+        fontSize: "$badgeLarge",
+        borderRadius: "$sm",
+        lineHeight: "$badgeLarge",
+      },
+    },
+    fontWeight: {
+      regular: { fontWeight: "$regular" },
+      medium: { fontWeight: "$medium" },
+      semibold: { fontWeight: "$semibold" },
+      bold: { fontWeight: "$bold" },
     },
-})
+    radii: {
+      full: {
+        borderRadius: "$full",
+      },
+    },
+  },
+
+  defaultVariants: {
+    size: "md",
+    color: "primary",
+    fontWeight: "regular",
+  },
+});
 
 export type BadgeProps = ComponentProps<typeof BadgeStyled> & {
-    as?: ElementType
-    icon?: boolean
-    children: React.ReactNode
-}
+  as?: ElementType;
+  icon?: boolean;
+  children: React.ReactNode;
+};
 
 export function Badge({ asChild, children, ...props }: BadgeProps) {
-    return (
-        <BadgeStyled {...props}>
-            {React.Children.map(children, (child) => {
-                if (React.isValidElement(child)) {
-                    return React.cloneElement(child, { size: props.size } as any)
-                }
-                return child
-            })}
-        </BadgeStyled>
-    )
+  return (
+    <BadgeStyled {...props}>
+      {React.Children.map(children, (child) => {
+        if (React.isValidElement(child)) {
+          return React.cloneElement(child, { size: props.size } as any);
+        }
+        return child;
+      })}
+    </BadgeStyled>
+  );
 }