@capyx/components-library 0.0.1 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (72) hide show
  1. package/README.md +250 -210
  2. package/dist/addons/AutocompleteInput.d.ts +40 -0
  3. package/dist/addons/AutocompleteInput.d.ts.map +1 -0
  4. package/dist/addons/AutocompleteInput.js +101 -0
  5. package/dist/addons/CharacterCountInput.d.ts +73 -0
  6. package/dist/addons/CharacterCountInput.d.ts.map +1 -0
  7. package/dist/addons/CharacterCountInput.js +130 -0
  8. package/dist/addons/index.d.ts +5 -0
  9. package/dist/addons/index.d.ts.map +1 -0
  10. package/dist/addons/index.js +2 -0
  11. package/dist/components/CheckInput.d.ts +49 -0
  12. package/dist/components/CheckInput.d.ts.map +1 -0
  13. package/dist/components/CheckInput.js +58 -0
  14. package/dist/components/DateInput.d.ts +63 -0
  15. package/dist/components/DateInput.d.ts.map +1 -0
  16. package/dist/components/DateInput.js +86 -0
  17. package/dist/components/FileInput.d.ts +102 -0
  18. package/dist/components/FileInput.d.ts.map +1 -0
  19. package/dist/components/FileInput.js +164 -0
  20. package/dist/components/RichTextInput.d.ts +34 -0
  21. package/dist/components/RichTextInput.d.ts.map +1 -0
  22. package/dist/components/RichTextInput.js +57 -0
  23. package/dist/components/SelectInput.d.ts +54 -0
  24. package/dist/components/SelectInput.d.ts.map +1 -0
  25. package/dist/components/SelectInput.js +64 -0
  26. package/dist/components/SwitchInput.d.ts +46 -0
  27. package/dist/components/SwitchInput.d.ts.map +1 -0
  28. package/dist/components/SwitchInput.js +53 -0
  29. package/dist/components/TagsInput.d.ts +35 -0
  30. package/dist/components/TagsInput.d.ts.map +1 -0
  31. package/dist/components/TagsInput.js +67 -0
  32. package/dist/components/TextAreaInput.d.ts +71 -0
  33. package/dist/components/TextAreaInput.d.ts.map +1 -0
  34. package/dist/components/TextAreaInput.js +113 -0
  35. package/dist/components/TextInput.d.ts +68 -0
  36. package/dist/components/TextInput.d.ts.map +1 -0
  37. package/dist/components/TextInput.js +77 -0
  38. package/dist/components/index.d.ts +10 -0
  39. package/dist/components/index.d.ts.map +1 -0
  40. package/dist/index.cjs +18 -0
  41. package/dist/index.d.ts +3 -0
  42. package/dist/index.d.ts.map +1 -0
  43. package/package.json +87 -72
  44. package/.storybook/main.ts +0 -33
  45. package/.storybook/preview.ts +0 -36
  46. package/.storybook/vitest.setup.ts +0 -7
  47. package/biome.json +0 -37
  48. package/lib/addons/CharacterCountInput.tsx +0 -204
  49. package/lib/addons/index.ts +0 -2
  50. package/lib/components/CheckInput.tsx +0 -126
  51. package/lib/components/DateInput.tsx +0 -179
  52. package/lib/components/FileInput.tsx +0 -353
  53. package/lib/components/RichTextInput.tsx +0 -112
  54. package/lib/components/SelectInput.tsx +0 -144
  55. package/lib/components/SwitchInput.tsx +0 -116
  56. package/lib/components/TagsInput.tsx +0 -118
  57. package/lib/components/TextAreaInput.tsx +0 -211
  58. package/lib/components/TextInput.tsx +0 -381
  59. package/stories/CharacterCountInput.stories.tsx +0 -104
  60. package/stories/CheckInput.stories.tsx +0 -80
  61. package/stories/DateInput.stories.tsx +0 -137
  62. package/stories/FileInput.stories.tsx +0 -125
  63. package/stories/RichTextInput.stories.tsx +0 -77
  64. package/stories/SelectInput.stories.tsx +0 -131
  65. package/stories/SwitchInput.stories.tsx +0 -80
  66. package/stories/TagsInput.stories.tsx +0 -69
  67. package/stories/TextAreaInput.stories.tsx +0 -117
  68. package/stories/TextInput.stories.tsx +0 -167
  69. package/vitest.config.ts +0 -37
  70. package/vitest.shims.d.ts +0 -1
  71. /package/{lib/components/index.ts → dist/components/index.js} +0 -0
  72. /package/{lib/index.ts → dist/index.js} +0 -0
@@ -1,167 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/react';
2
- import React from 'react';
3
- import { FormProvider, useForm } from 'react-hook-form';
4
- import { TextInput } from '../lib/components/TextInput';
5
-
6
- const meta = {
7
- title: 'Components/TextInput',
8
- component: TextInput,
9
- parameters: {
10
- layout: 'centered',
11
- },
12
- tags: ['autodocs'],
13
- argTypes: {
14
- type: {
15
- control: 'select',
16
- options: ['text', 'email', 'password', 'number', 'tel', 'url'],
17
- },
18
- controlSize: {
19
- control: 'select',
20
- options: ['sm', 'lg', undefined],
21
- },
22
- },
23
- } satisfies Meta<typeof TextInput>;
24
-
25
- export default meta;
26
- type Story = StoryObj<typeof meta>;
27
-
28
- // Wrapper component for react-hook-form integration
29
- const FormWrapper = ({ children }: { children: React.ReactNode }) => {
30
- const methods = useForm({
31
- defaultValues: {
32
- username: '',
33
- email: '',
34
- search: '',
35
- skill: '',
36
- },
37
- });
38
-
39
- return <FormProvider {...methods}>{children}</FormProvider>;
40
- };
41
-
42
- export const Basic: Story = {
43
- args: {
44
- name: 'username',
45
- label: 'Username',
46
- placeholder: 'Enter your username',
47
- },
48
- render: (args) => (
49
- <FormWrapper>
50
- <TextInput {...args} />
51
- </FormWrapper>
52
- ),
53
- };
54
-
55
- export const Required: Story = {
56
- args: {
57
- name: 'email',
58
- label: 'Email',
59
- type: 'email',
60
- placeholder: 'your.email@example.com',
61
- required: true,
62
- },
63
- render: (args) => (
64
- <FormWrapper>
65
- <TextInput {...args} />
66
- </FormWrapper>
67
- ),
68
- };
69
-
70
- export const WithMaxLength: Story = {
71
- args: {
72
- name: 'username',
73
- label: 'Username',
74
- maxLength: 20,
75
- placeholder: 'Max 20 characters',
76
- },
77
- render: (args) => (
78
- <FormWrapper>
79
- <TextInput {...args} />
80
- </FormWrapper>
81
- ),
82
- };
83
-
84
- export const WithAutocomplete: Story = {
85
- args: {
86
- name: 'skill',
87
- label: 'Primary Skill',
88
- shouldAutoComplete: true,
89
- values: ['JavaScript', 'TypeScript', 'React', 'Node.js', 'Python', 'Java'],
90
- placeholder: 'Type to search...',
91
- },
92
- render: (args) => (
93
- <FormWrapper>
94
- <TextInput {...args} />
95
- </FormWrapper>
96
- ),
97
- };
98
-
99
- export const WithDebounce: Story = {
100
- args: {
101
- name: 'search',
102
- label: 'Search',
103
- placeholder: 'Search with 300ms debounce...',
104
- debounceMs: 300,
105
- },
106
- render: (args) => (
107
- <FormWrapper>
108
- <TextInput {...args} />
109
- </FormWrapper>
110
- ),
111
- };
112
-
113
- export const Disabled: Story = {
114
- args: {
115
- name: 'username',
116
- label: 'Username',
117
- placeholder: 'This field is disabled',
118
- disabled: true,
119
- },
120
- render: (args) => (
121
- <FormWrapper>
122
- <TextInput {...args} />
123
- </FormWrapper>
124
- ),
125
- };
126
-
127
- export const ReadOnly: Story = {
128
- args: {
129
- name: 'username',
130
- label: 'Username',
131
- fieldValue: 'ReadOnlyValue',
132
- isReadOnly: true,
133
- },
134
- render: (args) => (
135
- <FormWrapper>
136
- <TextInput {...args} />
137
- </FormWrapper>
138
- ),
139
- };
140
-
141
- export const SmallSize: Story = {
142
- args: {
143
- name: 'username',
144
- label: 'Username (Small)',
145
- controlSize: 'sm',
146
- placeholder: 'Small input',
147
- },
148
- render: (args) => (
149
- <FormWrapper>
150
- <TextInput {...args} />
151
- </FormWrapper>
152
- ),
153
- };
154
-
155
- export const LargeSize: Story = {
156
- args: {
157
- name: 'username',
158
- label: 'Username (Large)',
159
- controlSize: 'lg',
160
- placeholder: 'Large input',
161
- },
162
- render: (args) => (
163
- <FormWrapper>
164
- <TextInput {...args} />
165
- </FormWrapper>
166
- ),
167
- };
package/vitest.config.ts DELETED
@@ -1,37 +0,0 @@
1
- import path from 'node:path';
2
- import { fileURLToPath } from 'node:url';
3
-
4
- import { defineConfig } from 'vitest/config';
5
-
6
- import { storybookTest } from '@storybook/addon-vitest/vitest-plugin';
7
-
8
- import { playwright } from '@vitest/browser-playwright';
9
-
10
- const dirname =
11
- typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url));
12
-
13
- // More info at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon
14
- export default defineConfig({
15
- test: {
16
- projects: [
17
- {
18
- extends: true,
19
- plugins: [
20
- // The plugin will run tests for the stories defined in your Storybook config
21
- // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest
22
- storybookTest({ configDir: path.join(dirname, '.storybook') }),
23
- ],
24
- test: {
25
- name: 'storybook',
26
- browser: {
27
- enabled: true,
28
- headless: true,
29
- provider: playwright({}),
30
- instances: [{ browser: 'chromium' }],
31
- },
32
- setupFiles: ['.storybook/vitest.setup.ts'],
33
- },
34
- },
35
- ],
36
- },
37
- });
package/vitest.shims.d.ts DELETED
@@ -1 +0,0 @@
1
- /// <reference types="@vitest/browser-playwright" />
File without changes