diff --git a/src/components/IconText/__snapshots__/WIconText.spec.ts.snap b/src/components/IconText/__snapshots__/WIconText.spec.ts.snap
index 3e05f39..79af5c0 100644
--- a/src/components/IconText/__snapshots__/WIconText.spec.ts.snap
+++ b/src/components/IconText/__snapshots__/WIconText.spec.ts.snap
@@ -40,7 +40,7 @@ exports[`WIconText > renders properly ROUNDED RIGHT 1`] = `
target="_blank"
>
diff --git a/src/components/Input/WInput.spec.ts b/src/components/Input/WInput.spec.ts
new file mode 100644
index 0000000..da9ef41
--- /dev/null
+++ b/src/components/Input/WInput.spec.ts
@@ -0,0 +1,31 @@
+import { describe, it, expect } from 'vitest'
+
+import { mount } from '@vue/test-utils'
+import WInput from './WInput.vue'
+import { InputType } from './WInput'
+
+describe('WInput', () => {
+ it('base', () => {
+ const wrapper = mount(WInput, {
+ props: {
+ type: InputType.Base,
+ contentType: 'string',
+ placeholder: 'Amount'
+ }
+ })
+
+ expect(wrapper.element).toMatchSnapshot()
+ })
+
+ it('action', () => {
+ const wrapper = mount(WInput, {
+ props: {
+ type: InputType.Action,
+ contentType: 'email',
+ placeholder: 'email@mail.com'
+ }
+ })
+
+ expect(wrapper.element).toMatchSnapshot()
+ })
+})
diff --git a/src/components/Input/WInput.stories.ts b/src/components/Input/WInput.stories.ts
new file mode 100644
index 0000000..f627e0c
--- /dev/null
+++ b/src/components/Input/WInput.stories.ts
@@ -0,0 +1,48 @@
+import type { Meta, StoryObj } from '@storybook/vue3'
+import WInput from './WInput.vue'
+import { InputType, inputTypes } from './WInput'
+
+const meta: any = {
+ title: 'Example/WInput',
+ component: WInput,
+ tags: ['autodocs'],
+ argTypes: {
+ type: { control: 'select', options: inputTypes }
+ },
+ args: {}
+} satisfies Meta
+
+export default meta
+type Story = StoryObj
+
+export const Base: Story = {
+ render: (args: any) => ({
+ components: { WInput },
+ setup() {
+ return { args }
+ },
+ template: `WInput`
+ }),
+ args: {
+ type: InputType.Base,
+ contentType: 'string'
+ }
+}
+
+export const Action: Story = {
+ parameters: {
+ backgrounds: { default: 'grey' }
+ },
+ render: (args: any) => ({
+ components: { WInput },
+ setup() {
+ return { args }
+ },
+ template: `WInput`
+ }),
+ args: {
+ type: InputType.Action,
+ placeholder: 'email@mail.com',
+ contentType: 'email'
+ }
+}
diff --git a/src/components/Input/WInput.ts b/src/components/Input/WInput.ts
new file mode 100644
index 0000000..7321461
--- /dev/null
+++ b/src/components/Input/WInput.ts
@@ -0,0 +1,6 @@
+export enum InputType {
+ Base = 'base',
+ Action = 'action'
+}
+
+export const inputTypes = Object.values(InputType)
diff --git a/src/components/Input/WInput.vue b/src/components/Input/WInput.vue
new file mode 100644
index 0000000..d37aa4a
--- /dev/null
+++ b/src/components/Input/WInput.vue
@@ -0,0 +1,59 @@
+
+
+
+
+
+
+
+
diff --git a/src/components/Input/__snapshots__/WInput.spec.ts.snap b/src/components/Input/__snapshots__/WInput.spec.ts.snap
new file mode 100644
index 0000000..a2340c2
--- /dev/null
+++ b/src/components/Input/__snapshots__/WInput.spec.ts.snap
@@ -0,0 +1,34 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`WInput > action 1`] = `
+
+
+
+
+`;
+
+exports[`WInput > base 1`] = `
+
+
+
+
+`;
diff --git a/src/components/icon/WIcon.vue b/src/components/icon/WIcon.vue
index c720495..4d676b2 100644
--- a/src/components/icon/WIcon.vue
+++ b/src/components/icon/WIcon.vue
@@ -25,7 +25,7 @@ import WindowsIcon from '@/assets/svg/windows.svg?component'
import DiscordIcon from '@/assets/svg/discord.svg?component'
import GateIcon from '@/assets/svg/gate.svg?component'
import GithubIcon from '@/assets/svg/github.svg?component'
-import RightArrowIcon from '@/assets/svg/rightArrow.svg?component'
+import RightArrowIcon from '@/assets/svg/icon-right-arrow.svg?component'
import TelegramIcon from '@/assets/svg/telegram.svg?component'
import XIcon from '@/assets/svg/x.svg?component'
diff --git a/src/components/pagination/WPagination.stories.ts b/src/components/pagination/WPagination.stories.ts
index fa56525..c59e6dc 100644
--- a/src/components/pagination/WPagination.stories.ts
+++ b/src/components/pagination/WPagination.stories.ts
@@ -23,6 +23,6 @@ export const Default: Story = {
args: {
total: 100,
pageSize: 5,
- page: 1,
+ page: 1
}
}
diff --git a/src/index.ts b/src/index.ts
index 1142a92..9fbe31c 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -3,6 +3,7 @@ import './assets/main.css'
import WButton from './components/Button/WButton.vue'
export { buttonTypes } from './components/Button/WButton'
+import WCard from './components/Card/WCard.vue'
import WEmptyState from './components/EmptyState/WEmptyState.vue'
import WFooter from './components/Footer/WFooter.vue'
@@ -15,6 +16,7 @@ import WIconRounded from './components/IconRounded/WIconRounded.vue'
import WIconText from './components/IconText/WIconText.vue'
export { iconTextPositions } from './components/IconText/WIconText'
+import WInput from './components/Input/WInput.vue'
import WLink from './components/Link/WLink.vue'
import WLoadingPlaceholder from './components/LoadingPlaceholder/WLoadingPlaceholder.vue'
@@ -32,11 +34,13 @@ export { SOCIAL_URLS } from './components/SocialsBar/WSocialsBar'
export {
WButton,
+ WCard,
WEmptyState,
WFooter,
WIcon,
- WIconRounded,
WIconText,
+ WIconRounded,
+ WInput,
WLink,
WLoadingPlaceholder,
WNavbar,
@@ -45,13 +49,14 @@ export {
WSocialsBar,
WSpinner
}
-
export type WButton = typeof WButton
+export type WCard = typeof WCard
export type WEmptyState = typeof WEmptyState
export type WFooter = typeof WFooter
export type WIcon = typeof WIcon
export type WIconRounded = typeof WIconRounded
export type WIconText = typeof WIconText
+export type WInput = typeof WInput
export type WLink = typeof WLink
export type WLoadingPlaceholder = typeof WLoadingPlaceholder
export type WNavbar = typeof WNavbar
@@ -65,11 +70,13 @@ import type { App } from 'vue'
const WComponents = {
install(app: App) {
app.component('WButton', WButton)
+ app.component('WCard', WCard)
app.component('WEmptyState', WEmptyState)
app.component('WFooter', WFooter)
app.component('WIcon', WIcon)
app.component('WIconRounded', WIconRounded)
app.component('WIconText', WIconText)
+ app.component('WInput', WInput)
app.component('WLink', WLink)
app.component('WLoadingPlaceholder', WLoadingPlaceholder)
app.component('WNavbar', WNavbar)