@sakura-ui/sakura-ui 0.2.0 → 0.3.0

package/packages/core/src/index.ts

@@ -1,10 +1,13 @@
 export {
   Button,
+  MenuButton,
   Card,
   CardImg,
   CardHeader,
   CardBody,
   CardFooter,
+  LinkCard,
+  LinkCardHeader,
   Code,
   Faq,
   Question,
@@ -27,32 +30,10 @@ export {
   Tbody,
   Th,
   Tr,
-  Td
-} from './components'
-
-export type {
-  ButtonProps,
-  CardProps,
-  CardImgProps,
-  CardHeaderProps,
-  CardBodyProps,
-  CardFooterProps,
-  CodeProps,
-  FaqProps,
-  QuestionProps,
-  AnswerProps,
-  HeadingProps,
-  IconProps,
-  IconButtonProps,
-  LinkProps,
-  OlProps,
-  UlProps,
-  PreProps,
-  TableProps,
-  CaptionProps,
-  TheadProps,
-  TbodyProps,
-  ThProps,
-  TrProps,
-  TdProps
+  Td,
+  OverflowContainer,
+  LangSelector,
+  NavigationItem,
+  PopoverMenu,
+  PopoverMenuItem
 } from './components'

package/packages/core/src/type.d.ts

@@ -0,0 +1 @@
+/// <reference types="react/canary" />

package/packages/core/tests/Button.test.tsx

@@ -1,23 +1,18 @@
 import React from 'react'
-import { describe, test, expect } from 'vitest'
+import { describe, it, expect, vi } from 'vitest'
 import { render, screen } from '@testing-library/react'
 
 import { Button } from '../src'
 
-describe('should labeled text from Button', () => {
-  test('text', async () => {
-    render(<Button>Button</Button>)
-
-    const text = screen.getByText(/Button/)
-    expect(text).toBeInTheDocument()
-  })
-  test('as button', async () => {
+describe('Button', () => {
+  it('should render a button', async () => {
     render(<Button>Button</Button>)
 
     const button = screen.getByRole('button')
     expect(button).toBeInTheDocument()
   })
-  test('as link', async () => {
+
+  it('should render a link', async () => {
     render(
       <Button as="a" href="https://example.com">
         Button
@@ -27,4 +22,19 @@ describe('should labeled text from Button', () => {
     const button = screen.getByRole('link')
     expect(button).toBeInTheDocument()
   })
+
+  it('should labeled text from Button', async () => {
+    render(<Button>button</Button>)
+
+    const text = screen.getByText(/button/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should pass an object to the ref property', async () => {
+    const ref = vi.fn()
+
+    render(<Button ref={ref}>button</Button>)
+
+    expect(ref).toHaveBeenCalledTimes(1)
+  })
 })

package/packages/core/tests/Card.test.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
-import { describe, test, expect } from 'vitest'
+import { describe, expect, it } from 'vitest'
 import { render, screen } from '@testing-library/react'
 
 import { Card, CardBody, CardHeader } from '../src'
 
-describe('should labeled text from Card', () => {
-  test('text', async () => {
+describe('Card', () => {
+  it('should labeled text from Card', async () => {
     render(
       <Card>
         <CardHeader>Card-Header</CardHeader>
@@ -19,24 +19,29 @@ describe('should labeled text from Card', () => {
     const text2 = screen.getByText(/Card-Body/)
     expect(text2).toBeInTheDocument()
   })
-  test('role and id', async () => {
+  it('should set the role and id correctly', async () => {
     render(
       <Card>
-        <CardHeader>Card-Header</CardHeader>
-        <CardBody>Card-Body</CardBody>
+        <CardHeader data-testid="header">Card-Header</CardHeader>
+        <CardBody data-testid="body">Card-Body</CardBody>
       </Card>
     )
 
     const card = screen.getByRole('article')
     expect(card).toBeInTheDocument()
-    expect(card).toHaveProperty('id')
 
-    const header = screen.getByLabelText('Card-Header')
+    const header = screen.getByTestId('header')
     expect(header).toBeInTheDocument()
-    expect(header).toHaveProperty('id')
+    expect(header).toHaveAttribute('id')
 
-    const body = screen.getByRole('article', { description: 'Card-Body' })
+    const headerText = screen.getByLabelText('Card-Header')
+    expect(headerText).toBeInTheDocument()
+
+    const body = screen.getByTestId('body')
     expect(body).toBeInTheDocument()
-    expect(body).toHaveProperty('id')
+    expect(body).toHaveAttribute('id')
+
+    const bodyText = screen.getByRole('article', { description: 'Card-Body' })
+    expect(bodyText).toBeInTheDocument()
   })
 })

package/packages/core/tests/IconButton.test.tsx

@@ -0,0 +1,57 @@
+import React from 'react'
+import { describe, it, expect, vi } from 'vitest'
+import { render, screen } from '@testing-library/react'
+
+import { IconButton } from '../src'
+
+describe('IconButton', () => {
+  it('should render a button with icon', async () => {
+    render(<IconButton icon="home">Button with icon</IconButton>)
+
+    const button = screen.getByRole('button')
+    expect(button).toBeInTheDocument()
+
+    const text = screen.getByText(/home/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should render a link with icon', async () => {
+    render(
+      <IconButton as="a" icon="home" href="https://googl.com">
+        Button with icon
+      </IconButton>
+    )
+
+    const button = screen.getByRole('link')
+    expect(button).toBeInTheDocument()
+
+    const text = screen.getByText(/home/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should aria-hidden true', async () => {
+    render(<IconButton icon="home">button</IconButton>)
+
+    const text = screen.getByText(/home/)
+    expect(text).toHaveAttribute('aria-hidden', 'true')
+  })
+
+  it('should aria-hidden false', async () => {
+    render(<IconButton icon="home" />)
+
+    const text = screen.getByText(/home/)
+    expect(text).toHaveAttribute('aria-hidden', 'false')
+  })
+
+  it('should pass an object to the ref property', async () => {
+    const ref = vi.fn()
+
+    render(
+      <IconButton icon="home" ref={ref}>
+        button
+      </IconButton>
+    )
+
+    expect(ref).toHaveBeenCalledTimes(1)
+  })
+})

package/packages/core/tests/Link.test.tsx

@@ -0,0 +1,60 @@
+import React from 'react'
+import { describe, it, expect, vi } from 'vitest'
+import { render, screen } from '@testing-library/react'
+
+import { Link } from '../src'
+
+describe('Link', () => {
+  it('should render a link', async () => {
+    render(<Link href="/">Button</Link>)
+
+    const link = screen.getByRole('link')
+    expect(link).toBeInTheDocument()
+    expect(link).not.toHaveAttribute('target')
+  })
+
+  it('should render a link with icon', async () => {
+    render(<Link href="https://google.com">Button</Link>)
+
+    const link = screen.getByRole('link')
+    expect(link).toBeInTheDocument()
+    expect(link).toHaveAttribute('target')
+
+    const text = screen.getByText(/open_in_new/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should render a link with icon', async () => {
+    render(
+      <Link href="/test" target="_blank">
+        Button
+      </Link>
+    )
+
+    const link = screen.getByRole('link')
+    expect(link).toBeInTheDocument()
+    expect(link).toHaveAttribute('target')
+
+    const text = screen.getByText(/open_in_new/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should labeled text from Button', async () => {
+    render(<Link href="/">here</Link>)
+
+    const text = screen.getByText(/here/)
+    expect(text).toBeInTheDocument()
+  })
+
+  it('should pass an object to the ref property', async () => {
+    const ref = vi.fn()
+
+    render(
+      <Link ref={ref} href="/">
+        link
+      </Link>
+    )
+
+    expect(ref).toHaveBeenCalledTimes(1)
+  })
+})

package/packages/core/tests/vitest.setup.ts

@@ -1 +1,2 @@
+/// <reference types="vitest" />
 import '@testing-library/jest-dom'

package/packages/core/tsconfig.node.json

@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
-    "composite": true
+    "composite": true,
+    "resolveJsonModule": true
   },
-  "include": ["vite.config.ts"]
+  "include": ["vite.config.ts", "package.json"]
 }

package/packages/forms/.turbo/turbo-build.log

@@ -0,0 +1,22 @@
+
+
+> @sakura-ui/forms@0.3.0 prebuild /Users/t.fujita/Documents/Repos/sakura-ui/packages/forms
+> rimraf dist
+
+
+> @sakura-ui/forms@0.3.0 build /Users/t.fujita/Documents/Repos/sakura-ui/packages/forms
+> run-p build:*
+
+
+> @sakura-ui/forms@0.3.0 build:types /Users/t.fujita/Documents/Repos/sakura-ui/packages/forms
+> tsc && tsc-alias
+
+
+> @sakura-ui/forms@0.3.0 build:scripts /Users/t.fujita/Documents/Repos/sakura-ui/packages/forms
+> vite build
+
+vite v6.0.3 building for production...
+transforming (1) src/index.ts✓ 25 modules transformed.
+rendering chunks (1)...computing gzip size (0)...computing gzip size (1)...dist/index.es.js  31.87 kB │ gzip: 8.19 kB
+rendering chunks (1)...computing gzip size (1)...dist/index.cjs.js  21.92 kB │ gzip: 7.09 kB
+✓ built in 170ms