@ctlyst.id/internal-ui 2.0.1 → 2.0.2

package/dist/config/theme/components/badge.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentStyleConfig } from '@chakra-ui/theme';
+declare const Badge: ComponentStyleConfig;
+export default Badge;

package/dist/config/theme/components/index.d.ts

@@ -1,4 +1,5 @@
 export { default as Alert } from './alert';
+export { default as Badge } from './badge';
 export { default as Button } from './button';
 export { default as Card } from './card';
 export { default as Checkbox } from './checkbox';

package/dist/internal-ui.cjs.development.js

@@ -35,9 +35,7 @@ const Badge = props => {
   } = props;
   return /*#__PURE__*/React__default.createElement(react.Badge, Object.assign({
     borderRadius: pill ? 10 : 4,
-    variant: "solid",
-    color: "white",
-    fontSize: "10px",
+    variant: "primary-solid",
     padding: "0 8px",
     height: "18px",
     display: "flex",
@@ -3267,6 +3265,72 @@ const alertTheme = /*#__PURE__*/defineMultiStyleConfig({
   }
 });
 
+const Badge$1 = {
+  baseStyle: {
+    display: 'inline-block',
+    fontSize: 10,
+    fontWeight: 600,
+    lineHeight: '1.25',
+    textTransform: 'none',
+    px: 2,
+    py: '0.5'
+  },
+  variants: {
+    'primary-solid': {
+      bg: 'primary.500',
+      color: 'white'
+    },
+    'success-solid': {
+      bg: 'success.500',
+      color: 'white'
+    },
+    'info-solid': {
+      bg: 'info.500',
+      color: 'white'
+    },
+    'warning-solid': {
+      bg: 'warning.500',
+      color: 'white'
+    },
+    'danger-solid': {
+      bg: 'danger.500',
+      color: 'white'
+    },
+    'neutral-solid': {
+      bg: 'neutral.600',
+      color: 'white'
+    },
+    'primary-light': {
+      bg: 'primary.50',
+      color: 'primary.500'
+    },
+    'success-light': {
+      bg: 'success.50',
+      color: 'success.500'
+    },
+    'info-light': {
+      bg: 'info.50',
+      color: 'info.500'
+    },
+    'warning-light': {
+      bg: 'warning.50',
+      color: 'warning.500'
+    },
+    'danger-light': {
+      bg: 'danger.50',
+      color: 'danger.500'
+    },
+    'neutral-light': {
+      bg: 'neutral.100',
+      color: 'neutral.600'
+    }
+  },
+  // The default size and variant values
+  defaultProps: {
+    variant: 'primary-solid'
+  }
+};
+
 // You can also use the more specific type for
 // a single part component: ComponentSingleStyleConfig
 const Button$1 = /*#__PURE__*/styledSystem.defineStyleConfig({
@@ -4166,6 +4230,7 @@ const Textarea = /*#__PURE__*/react.defineStyleConfig({
 var components = {
   __proto__: null,
   Alert: alertTheme,
+  Badge: Badge$1,
   Button: Button$1,
   Card: CardStyle,
   Checkbox: Checkbox,