agroptima-design-system 0.22.3 → 0.22.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agroptima-design-system",
-  "version": "0.22.3",
+  "version": "0.22.4",
   "scripts": {
     "dev": "npm run storybook",
     "storybook": "storybook dev -p 6006 --ci",

package/src/atoms/EmptyState.tsx

@@ -1,5 +1,4 @@
 import { classNames } from '../utils/classNames'
-import { Button, ButtonProps } from './Button'
 import './EmptyState.scss'
 import { Icon, IconType } from './Icon'
 
@@ -7,25 +6,21 @@ export type Variant = 'primary'
 
 export interface EmptyStateProps extends React.ComponentPropsWithoutRef<'div'> {
   icon?: IconType
-  text?: string
   variant?: Variant
-  button?: ButtonProps
 }
 
 export function EmptyState({
   className,
   icon = 'EmptyState',
-  text = 'No data',
   variant = 'primary',
-  button,
+  children,
 }: EmptyStateProps): React.JSX.Element {
   const cssClasses = classNames('empty-state', variant, className)
 
   return (
     <div className={cssClasses}>
       <Icon name={icon} />
-      <p>{text}</p>
-      {button?.label && <Button {...button} />}
+      {children}
     </div>
   )
 }

package/src/stories/Changelog.mdx

@@ -4,6 +4,12 @@ import { Meta } from "@storybook/blocks";
 
 # Changelog
 
+# 0.22.4
+
+BREAKING CHANGES
+
+* EmptyState text and button props have been removed and children elements can be passed to the component.
+
 # 0.22.3
 
 * Add Delivery Note icon

package/src/stories/EmptyState.stories.js

@@ -0,0 +1,46 @@
+import { Button } from '../atoms/Button'
+import { EmptyState } from '../atoms/EmptyState'
+
+const figmaPrimaryDesign = {
+  design: {
+    type: 'figma',
+    url: 'https://www.figma.com/file/DN2ova21vWqCRvPspBXgI1/Design-System?type=design&node-id=1719-258&mode=dev',
+  },
+}
+
+const meta = {
+  title: 'Design System/Atoms/EmptyState',
+  component: EmptyState,
+  tags: ['autodocs'],
+  argTypes: {
+    icon: {
+      description: 'A default icon is set for the empty state.',
+    },
+    variant: {
+      description: 'Variant used.',
+    },
+  },
+  parameters: figmaPrimaryDesign,
+}
+
+export default meta
+
+export const PrimaryCustom = {
+  render: () => (
+    <EmptyState variant="primary">
+      <p>
+        There are no videogames yet. You can import videogames to your{' '}
+        <a href="#">list</a>.
+      </p>
+      <Button label="Import videogames" onClick={() => alert('click')}></Button>
+    </EmptyState>
+  ),
+}
+
+export const PrimaryBasic = {
+  render: () => (
+    <EmptyState variant="primary">
+      <p>No data</p>
+    </EmptyState>
+  ),
+}

package/tsconfig.json

@@ -22,6 +22,6 @@
       "@/*": ["./src/*"]
     }
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/stories/CardsTable.stories.js", "src/stories/Modal.stories.js", "src/stories/Typography.stories.mdx", "src/stories/Card.stories.js", "src/stories/Menu.stories.js"],
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts", "src/stories/CardsTable.stories.js", "src/stories/Modal.stories.js", "src/stories/Typography.stories.mdx", "src/stories/Card.stories.js", "src/stories/Menu.stories.js", "src/stories/EmptyState.stories.js"],
   "exclude": ["node_modules"]
 }

package/src/stories/EmptyState.stories.ts

@@ -1,54 +0,0 @@
-import { EmptyState } from '../atoms/EmptyState'
-import { StoryObj } from '@storybook/react'
-
-const meta = {
-  title: 'Design System/Atoms/EmptyState',
-  component: EmptyState,
-  tags: ['autodocs'],
-  argTypes: {
-    icon: {
-      description: 'A default icon is set for the empty state.',
-    },
-    text: {
-      description: 'Label used to describe the empty state.',
-    },
-    variant: {
-      description: 'Variant used.',
-    },
-    buttonLabel: {
-      description: 'Label used on the button.',
-    },
-    action: {
-      description: 'Action called when button is pressed.',
-    },
-  },
-}
-
-const figmaPrimaryDesign = {
-  design: {
-    type: 'figma',
-    url: 'https://www.figma.com/file/DN2ova21vWqCRvPspBXgI1/Design-System?type=design&node-id=1719-258&mode=dev',
-  },
-}
-
-export default meta
-type Story = StoryObj<typeof meta>
-
-export const PrimaryCustom: Story = {
-  args: {
-    variant: 'primary',
-    text: 'There are no videogames yet. You can import videogames to your list.',
-    button: {
-      label: 'Import videogames',
-      onClick: () => alert('click'),
-    },
-  },
-  parameters: figmaPrimaryDesign,
-}
-
-export const PrimaryBasic: Story = {
-  args: {
-    variant: 'primary',
-  },
-  parameters: figmaPrimaryDesign,
-}