agroptima-design-system 0.27.11 → 0.27.12

package/.github/workflows/run-linters.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v3
         with:
-          node-version: 18.x
+          node-version: lts/*
           cache: 'npm'
 
       - name: Install dependencies

package/.github/workflows/run-tests.yml

@@ -17,7 +17,7 @@ jobs:
       - name: Setup Node
         uses: actions/setup-node@v3
         with:
-          node-version: 18.x
+          node-version: lts/*
           cache: 'npm'
 
       - name: Install dependencies

package/.nvmrc

@@ -1 +1 @@
-18.18
+lts/*

package/package.json

@@ -1,7 +1,6 @@
 {
   "name": "agroptima-design-system",
-
-  "version": "0.27.11",
+  "version": "0.27.12",
   "scripts": {
     "dev": "npm run storybook",
     "storybook": "storybook dev -p 6006 --ci",
@@ -25,16 +24,16 @@
     "@chromatic-com/storybook": "^3.2.2",
     "@eslint/eslintrc": "^3.1.0",
     "@eslint/js": "^9.14.0",
-    "@storybook/addon-a11y": "^8.4.2",
+    "@storybook/addon-a11y": "^8.4.5",
     "@storybook/addon-designs": "^8.0.4",
-    "@storybook/addon-essentials": "^8.4.2",
-    "@storybook/addon-interactions": "^8.4.2",
-    "@storybook/addon-links": "^8.4.2",
-    "@storybook/addon-viewport": "^8.4.2",
-    "@storybook/blocks": "^8.4.2",
-    "@storybook/nextjs": "^8.4.2",
-    "@storybook/react": "^8.4.2",
-    "@storybook/test": "^8.4.2",
+    "@storybook/addon-essentials": "^8.4.5",
+    "@storybook/addon-interactions": "^8.4.5",
+    "@storybook/addon-links": "^8.4.5",
+    "@storybook/addon-viewport": "^8.4.5",
+    "@storybook/blocks": "^8.4.5",
+    "@storybook/nextjs": "^8.4.5",
+    "@storybook/react": "^8.4.5",
+    "@storybook/test": "^8.4.5",
     "@svgr/webpack": "^8.1.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
@@ -49,12 +48,12 @@
     "eslint-config-next": "15.0.3",
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-prettier": "^5.0.1",
-    "eslint-plugin-storybook": "^0.11.0",
+    "eslint-plugin-storybook": "^0.11.1",
     "jest": "^29.7.0",
     "jest-axe": "^9.0.0",
     "jest-environment-jsdom": "^29.7.0",
     "prettier": "3.3.3",
-    "storybook": "^8.4.2",
+    "storybook": "^8.4.5",
     "ts-node": "^10.9.2",
     "typescript": "^5.6.3"
   },

package/src/atoms/Multiselect.tsx

@@ -4,8 +4,8 @@ import { Icon } from './Icon'
 import { IconButton } from './Button'
 import { classNames } from '../utils/classNames'
 import { buildHelpText } from '../utils/buildHelpText'
-import { useOutsideClick } from '@/utils/useOutsideClick'
-import { useOpen } from '@/utils/useOpen'
+import { useOutsideClick } from '../utils/useOutsideClick'
+import { useOpen } from '../utils/useOpen'
 
 export type Variant = 'primary'
 export type Option = { id: string; label: string }

package/src/stories/Alert.stories.ts

@@ -1,5 +1,5 @@
-import { Alert } from '../atoms/Alert'
 import type { StoryObj } from '@storybook/react'
+import { Alert } from '../atoms/Alert'
 
 const meta = {
   title: 'Design System/Atoms/Alert',

package/src/stories/CardMenu.stories.js

@@ -1,5 +1,3 @@
-import React from 'react'
-
 import { CardMenu, CardMenuOption } from '../atoms/CardMenu'
 
 const figmaPrimaryDesign = {

package/src/stories/CardsTable.stories.js

@@ -10,9 +10,9 @@ import {
 } from '../atoms/CardsTable'
 import { IconButton } from '../atoms/Button'
 import { Badge } from '../atoms/Badge'
-import { Checkbox } from '@/atoms/Checkbox'
-import { Popover, PopoverMenu, PopoverMenuOption } from '@/atoms/Popover'
-import { Button } from '@/atoms/Button'
+import { Checkbox } from '../atoms/Checkbox'
+import { Popover, PopoverMenu, PopoverMenuOption } from '../atoms/Popover'
+import { Button } from '../atoms/Button'
 
 const figmaPrimaryDesign = {
   design: {

package/src/stories/Collapsible.stories.js

@@ -1,10 +1,10 @@
 import React from 'react'
-import { Collapsible } from '@/atoms/Collapsible'
-import { Input } from '@/atoms/Input'
-import { Select } from '@/atoms/Select'
-import { Card } from '@/atoms/Card'
-import { Form as FormComponent, Actions } from '@/atoms/Form'
-import { Button } from '@/atoms/Button'
+import { Collapsible } from '../atoms/Collapsible'
+import { Input } from '../atoms/Input'
+import { Select } from '../atoms/Select'
+import { Card } from '../atoms/Card'
+import { Form as FormComponent, Actions } from '../atoms/Form'
+import { Button } from '../atoms/Button'
 
 const figmaPrimaryDesign = {
   design: {

package/src/stories/Drawer.stories.js

@@ -2,7 +2,7 @@ import React from 'react'
 
 import { Drawer } from '../atoms/Drawer'
 import { CheckableTagGroup, CheckableTag } from '../atoms/CheckableTag'
-import { Collapsible } from '@/atoms/Collapsible'
+import { Collapsible } from '../atoms/Collapsible'
 
 const figmaPrimaryDesign = {
   design: {

package/src/stories/Form.stories.js

@@ -1,6 +1,6 @@
-import { Form, Actions } from '@/atoms/Form'
-import { Input } from '@/atoms/Input'
-import { Button } from '@/atoms/Button'
+import { Form, Actions } from '../atoms/Form'
+import { Input } from '../atoms/Input'
+import { Button } from '../atoms/Button'
 
 const meta = {
   title: 'Design System/Atoms/Form',

package/src/stories/Modal.stories.js

@@ -1,8 +1,8 @@
 import React from 'react'
-import { Modal } from '@/atoms/Modal'
-import { DetailItem } from '@/atoms/DetailItem'
-import { Collapsible } from '@/atoms/Collapsible'
-import { Card } from '@/atoms/Card'
+import { Modal } from '../atoms/Modal'
+import { DetailItem } from '../atoms/DetailItem'
+import { Collapsible } from '../atoms/Collapsible'
+import { Card } from '../atoms/Card'
 
 const figmaPrimaryDesign = {
   design: {

package/src/stories/Popover.stories.js

@@ -1,6 +1,6 @@
 import React from 'react'
-import { Popover, PopoverMenu, PopoverMenuOption } from '@/atoms/Popover'
-import { Button } from '@/atoms/Button'
+import { Popover, PopoverMenu, PopoverMenuOption } from '../atoms/Popover'
+import { Button } from '../atoms/Button'
 
 const figmaPrimaryDesign = {
   design: {

package/tests/Alert.spec.tsx

@@ -1,7 +1,7 @@
-import type { Variant } from '@/atoms/Alert/Alert'
+import type { Variant } from '../src/atoms/Alert/Alert'
 import React from 'react'
 import { screen, render } from '@testing-library/react'
-import { Alert } from '@/atoms/Alert'
+import { Alert } from '../src/atoms/Alert'
 
 describe('Alert', () => {
   const variants = ['info', 'success', 'warning', 'error']

package/tests/Badge.spec.tsx

@@ -1,7 +1,7 @@
-import type { Variant } from '@/atoms/Badge'
+import type { Variant } from '../src/atoms/Badge'
 import React from 'react'
 import { getByTitle, render, screen } from '@testing-library/react'
-import { Badge } from '@/atoms/Badge'
+import { Badge } from '../src/atoms/Badge'
 
 describe('Badge', () => {
   const variants = [

package/tests/Button.spec.tsx

@@ -1,8 +1,8 @@
-import type { ButtonVariant } from '@/atoms/Button/Button'
+import type { ButtonVariant } from '../src/atoms/Button/Button'
 import React from 'react'
 import { screen, render } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { Button } from '@/atoms/Button/Button'
+import { Button } from '../src/atoms/Button/Button'
 
 describe('Button', () => {
   const variants = [

package/tests/Card.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Card, CardHeader, CardContent, CardFooter } from '@/atoms/Card'
-import { Button } from '@/atoms/Button'
+import { Card, CardHeader, CardContent, CardFooter } from '../src/atoms/Card'
+import { Button } from '../src/atoms/Button'
 
 describe('Product card', () => {
   it('renders the expected structure and data', () => {

package/tests/CardMenuOption.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { CardMenuOption } from '@/atoms/CardMenu/CardMenuOption'
+import { CardMenuOption } from '../src/atoms/CardMenu/CardMenuOption'
 
 describe('CardMenuOption', () => {
   it('renders', () => {

package/tests/CardsTable.spec.tsx

@@ -8,9 +8,9 @@ import {
   CardsTableBody,
   CardsTableCell,
   Alignment,
-} from '@/atoms/CardsTable'
-import { IconButton } from '@/atoms/Button'
-import { Badge } from '@/atoms/Badge'
+} from '../src/atoms/CardsTable'
+import { IconButton } from '../src/atoms/Button'
+import { Badge } from '../src/atoms/Badge'
 
 describe('CardsTable', () => {
   it('renders', () => {

package/tests/CheckableTag.spec.tsx

@@ -1,7 +1,7 @@
-import type { Variant } from '@/atoms/CheckableTag'
+import type { Variant } from '../src/atoms/CheckableTag'
 import React from 'react'
 import { render } from '@testing-library/react'
-import { CheckableTag } from '@/atoms/CheckableTag'
+import { CheckableTag } from '../src/atoms/CheckableTag'
 
 describe('CheckableTag', () => {
   const variants = ['primary']

package/tests/Checkbox.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Checkbox } from '@/atoms/Checkbox'
+import { Checkbox } from '../src/atoms/Checkbox'
 
 describe('Checkbox', () => {
   const variants = ['primary']

package/tests/Collapsible.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Collapsible } from '@/atoms/Collapsible'
-import { Input } from '@/atoms/Input'
+import { Collapsible } from '../src/atoms/Collapsible'
+import { Input } from '../src/atoms/Input'
 
 describe('Collapsible', () => {
   it('renders', () => {

package/tests/Drawer.spec.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Drawer } from '@/atoms/Drawer'
-import { Collapsible } from '@/atoms/Collapsible'
-import { CheckableTag, CheckableTagGroup } from '@/atoms/CheckableTag'
+import { Drawer } from '../src/atoms/Drawer'
+import { Collapsible } from '../src/atoms/Collapsible'
+import { CheckableTag, CheckableTagGroup } from '../src/atoms/CheckableTag'
 
 describe('Drawer', () => {
   it('renders with expected title, content and buttons', () => {

package/tests/EmptyState.spec.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import type { Variant } from '@/atoms/EmptyState'
-import { EmptyState } from '@/atoms/EmptyState'
-import { Button } from '@/atoms/Button/Button'
+import type { Variant } from '../src/atoms/EmptyState'
+import { EmptyState } from '../src/atoms/EmptyState'
+import { Button } from '../src/atoms/Button/Button'
 
 describe('EmptyState', () => {
   const variants = ['primary']

package/tests/FloatingButton.spec.tsx

@@ -1,8 +1,8 @@
-import type { Variant } from '@/atoms/Button/FloatingButton'
+import type { Variant } from '../src/atoms/Button/FloatingButton'
 import React from 'react'
 import { screen, render } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { FloatingButton } from '@/atoms/Button/FloatingButton'
+import { FloatingButton } from '../src/atoms/Button/FloatingButton'
 
 describe('Floating Button', () => {
   const variants = ['primary']

package/tests/Icon.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Icon } from '@/atoms/Icon'
+import { Icon } from '../src/atoms/Icon'
 
 describe('Icon', () => {
   it('renders with the expected graphic and styles', () => {

package/tests/IconButton.spec.tsx

@@ -1,8 +1,8 @@
-import type { Variant } from '@/atoms/Button/IconButton'
+import type { Variant } from '../src/atoms/Button/IconButton'
 import React from 'react'
 import { screen, render } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { IconButton } from '@/atoms/Button/IconButton'
+import { IconButton } from '../src/atoms/Button/IconButton'
 
 describe('Icon Button', () => {
   const variants = ['primary', 'secondary']

package/tests/Input.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { getByText, render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { Input } from '@/atoms/Input'
+import { Input } from '../src/atoms/Input'
 
 describe('Input', () => {
   it('renders the Text type', () => {

package/tests/Menu.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Menu } from '@/atoms/Menu/Menu'
-import { MenuDropdown, MenuLink } from '@/atoms/Menu'
+import { Menu } from '../src/atoms/Menu/Menu'
+import { MenuDropdown, MenuLink } from '../src/atoms/Menu'
 
 describe('Menu', () => {
   it('renders first-level menu', () => {

package/tests/Modal.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { screen, render } from '@testing-library/react'
-import { Modal } from '@/atoms/Modal'
+import { Modal } from '../src/atoms/Modal'
 
 describe('Modal', () => {
   const variants = ['info', 'success', 'warning', 'error']

package/tests/Multiselect.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { render, screen } from '@testing-library/react'
 import userEvent from '@testing-library/user-event'
-import { Multiselect } from '@/atoms/Multiselect'
+import { Multiselect } from '../src/atoms/Multiselect'
 import { Placeholder } from 'storybook/internal/components'
 
 describe('Multiselect', () => {

package/tests/Pagination.spec.tsx

@@ -5,7 +5,7 @@ import {
   PaginationArrow,
   PaginationNumber,
   Ellipsis,
-} from '@/atoms/Pagination'
+} from '../src/atoms/Pagination'
 
 describe('Pagination', () => {
   it('renders Pagination components', () => {

package/tests/Popover.spec.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { render } from '@testing-library/react'
-import { Popover, PopoverMenu, PopoverMenuOption } from '@/atoms/Popover'
-import { Button } from '@/atoms/Button'
 import userEvent from '@testing-library/user-event'
+import { Popover, PopoverMenu, PopoverMenuOption } from '../src/atoms/Popover'
+import { Button } from '../src/atoms/Button'
 
 describe('PopoverMenu', () => {
   it('shows when click on button', async () => {

package/tests/QuantitySelector.spec.tsx

@@ -1,6 +1,5 @@
-import React from 'react'
 import { render } from '@testing-library/react'
-import { QuantitySelector } from '@/atoms/QuantitySelector'
+import { QuantitySelector } from '../src/atoms/QuantitySelector'
 
 describe('QuantitySelector', () => {
   it('renders', () => {

package/tests/RadioButton.spec.tsx

@@ -1,6 +1,5 @@
-import React from 'react'
 import { render } from '@testing-library/react'
-import { RadioButton } from '@/atoms/RadioButton'
+import { RadioButton } from '../src/atoms/RadioButton'
 
 describe('RadioButton', () => {
   const variants = ['primary']

package/tests/Select.spec.tsx

@@ -1,7 +1,6 @@
-import React from 'react'
 import { render, screen } from '@testing-library/react'
+import { Select } from '../src/atoms/Select'
 import userEvent from '@testing-library/user-event'
-import { Select } from '@/atoms/Select'
 
 describe('Select', () => {
   it('renders', async () => {

package/tests/TextArea.spec.tsx

@@ -1,6 +1,5 @@
-import React from 'react'
 import { render } from '@testing-library/react'
-import { TextArea } from '@/atoms/TextArea'
+import { TextArea } from '../src/atoms/TextArea'
 
 describe('TextArea', () => {
   it('renders', () => {

package/tests/utils/classNames.spec.tsx

@@ -1,4 +1,4 @@
-import { classNames } from '@/utils/classNames'
+import { classNames } from '../../src/utils/classNames'
 
 describe('classNames', () => {
   it('returns a string of classes', () => {

package/tsconfig.json

@@ -18,10 +18,7 @@
       {
         "name": "next"
       }
-    ],
-    "paths": {
-      "@/*": ["./src/*"]
-    }
+    ]
   },
   "include": [
     "next-env.d.ts",