feat: improve examples

.clingon/templates/component/Component.stories.tsx

@@ -1 +1,16 @@
-function stories() {}
+import type { Meta, StoryObj } from '@storybook/react'
+
+import { ResourceName } from './ResourceName'
+
+const meta: Meta<typeof ResourceName> = {
+  component: ResourceName
+}
+
+export default meta
+type Story = StoryObj<typeof ResourceName>
+
+export const Primary: Story = {
+  args: {
+    message: "I'm a component called ResourceName"
+  }
+}

.clingon/templates/component/Component.test.tsx

@@ -1 +1,10 @@
-function tests() {}
+import { render, screen } from '@testing-library/react'
+import { describe, it, expect } from 'vitest'
+
+describe('ResourceName', () => {
+  it("should work's properly", async () => {
+    render(<ResourceName message="Hello Clingon!" />)
+
+    expect(await screen.findByText('Hello Clingon!'))
+  })
+})

.clingon/templates/component/Component.tsx

@@ -1,8 +1,10 @@
 import './ResourceName.styles.css'
 
-export function ResourceName() {
-  const message = 'Hello Clingon!'
+export interface ResourceNameProps {
+  message: string
+}
 
+export function ResourceName({ message }: ResourceNameProps) {
   return (
     <div>
       <p>{message}</p>

.clingon/templates/docs/ReactHookDoc.md

@@ -1,5 +1,5 @@
 # ResourceName
 
-> My hok doc
+> My hook doc
 
 - Test generate with MD file

.clingon/templates/meta.yaml

@@ -32,3 +32,10 @@
       template: ./functions/AsyncFunction.ts
     - path: src/utils
       template: ./functions/AsyncFunction.spec.ts
+
+# Markdown
+
+- identifier: hook-doc
+  resources:
+    - path: src/docs/hooks
+      template: ./docs/ReactHookDoc.md