Fix: correção de componente Text, Input e Button

apps/docs/src/stories/Input/Root.stories.tsx

@@ -18,10 +18,10 @@ export default {
     status: {
       control: { type: 'select' },
       description: 'Define o status do input',
-      options: [undefined, 'error', 'success'],
+      options: ['default', 'error', 'success'],
       table: {
         type: {
-          summary: ['error', 'success'].join('|'),
+          summary: ['default', 'error', 'success'].join('|'),
         },
       },
       type: { name: 'string', required: false },

apps/docs/src/stories/Text.stories.tsx

@@ -1,4 +1,5 @@
 import { Meta, StoryObj } from '@storybook/react'
+import { User } from 'phosphor-react'
 
 import { Text, TextProps } from '@coaktion/visu'
 
@@ -73,6 +74,14 @@ export default {
       },
       type: { name: 'boolean', required: false },
     },
+    inline: {
+      control: { type: 'boolean' },
+      description: 'Adiciona flex inline ao texto',
+      table: {
+        type: { summary: 'boolean' },
+      },
+      type: { name: 'boolean', required: false },
+    },
     link: {
       control: { type: 'select' },
       description:
@@ -109,6 +118,21 @@ export default {
 
 export const Comum: StoryObj<TextProps> = {}
 
+export const ComIcone: StoryObj<TextProps> = {
+  argTypes: {
+    children: {
+      control: 'none',
+    },
+  },
+  args: {
+    children: (
+      <>
+        <User /> Username
+      </>
+    ),
+  },
+}
+
 export const ComoTagAnchor: StoryObj<TextProps> = {
   argTypes: {
     children: {

packages/visu/src/library/Button/style.ts

@@ -117,6 +117,9 @@ export const RootStyle = css({
       true: {
         width: '100%',
       },
+      false: {
+        width: 'fit-content',
+      },
     },
   },
   compoundVariants: [
@@ -178,5 +181,6 @@ export const RootStyle = css({
   defaultVariants: {
     size: 'md',
     variant: 'primary',
+    full: false,
   },
 })

packages/visu/src/library/Input/index.tsx

@@ -105,6 +105,7 @@ const InputIcon = ({
       ref={IconComponent}
       clickable={!!onClick}
       onClick={handleClick}
+      type="button"
       {...rest}
     >
       {children}

packages/visu/src/library/Input/style.ts

@@ -68,12 +68,8 @@ export const Root = styled('div', {
   gap: '$3',
   width: 'fit-content',
   padding: '0 $4',
-
   color: '$gray500',
-
-  border: '1px solid $gray500',
   borderRadius: '$md',
-
   cursor: 'text',
 
   '&:focus-within': {
@@ -97,6 +93,9 @@ export const Root = styled('div', {
       success: {
         border: '1px solid $success',
       },
+      default: {
+        border: '1px solid $gray500',
+      },
     },
     disabled: {
       true: {
@@ -111,4 +110,7 @@ export const Root = styled('div', {
       },
     },
   },
+  defaultVariants: {
+    status: 'default',
+  },
 })

packages/visu/src/library/Text/index.tsx

@@ -27,6 +27,7 @@ const Text = ({
   size,
   weight,
   underline,
+  inline,
   ...rest
 }: TextProps): JSX.Element => {
   const Component = asChild ? Slot : 'span'
@@ -45,6 +46,7 @@ const Text = ({
         size,
         weight,
         underline,
+        inline,
       })}
       {...rest}
     >

packages/visu/src/library/Text/style.ts

@@ -2,6 +2,12 @@ import { css } from '@library'
 
 export const Root = css({
   transition: '$normal all',
+  fontSize: 'inherit',
+
+  '& *': {
+    fontSize: 'inherit',
+    verticalAlign: 'middle',
+  },
 
   variants: {
     underline: {
@@ -33,6 +39,14 @@ export const Root = css({
         fontSize: '$3xl',
       },
     },
+    inline: {
+      true: {
+        display: 'inline-flex',
+        gap: '$1',
+        flexWrap: 'wrap',
+        alignItems: 'center',
+      },
+    },
     weight: {
       light: {
         fontWeight: '300',