@idealyst/mcp-server 1.0.87 → 1.0.88

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 (205) hide show
  1. package/ARCHITECTURE.md +313 -0
  2. package/README.md +292 -104
  3. package/TYPE-SYSTEM.md +397 -0
  4. package/dist/index.js +170 -1
  5. package/examples/components/Accordion.examples.tsx +147 -0
  6. package/examples/components/ActivityIndicator.examples.tsx +350 -0
  7. package/examples/components/Alert.examples.tsx +335 -0
  8. package/examples/components/Avatar.examples.tsx +188 -0
  9. package/examples/components/Badge.examples.tsx +242 -0
  10. package/examples/components/Breadcrumb.examples.tsx +303 -0
  11. package/examples/components/Button.examples.tsx +113 -0
  12. package/examples/components/Card.examples.tsx +131 -0
  13. package/examples/components/Checkbox.examples.tsx +195 -0
  14. package/examples/components/Chip.examples.tsx +87 -0
  15. package/examples/components/Dialog.examples.tsx +344 -0
  16. package/examples/components/Divider.examples.tsx +258 -0
  17. package/examples/components/Icon.examples.tsx +202 -0
  18. package/examples/components/Input.examples.tsx +205 -0
  19. package/examples/components/Menu.examples.tsx +321 -0
  20. package/examples/components/Popover.examples.tsx +439 -0
  21. package/examples/components/Progress.examples.tsx +340 -0
  22. package/examples/components/RadioButton.examples.tsx +443 -0
  23. package/examples/components/Screen.examples.tsx +347 -0
  24. package/examples/components/Select.examples.tsx +279 -0
  25. package/examples/components/Skeleton.examples.tsx +278 -0
  26. package/examples/components/Slider.examples.tsx +249 -0
  27. package/examples/components/Switch.examples.tsx +94 -0
  28. package/examples/components/TabBar.examples.tsx +356 -0
  29. package/examples/components/Text.examples.tsx +177 -0
  30. package/examples/components/TextArea.examples.tsx +203 -0
  31. package/examples/components/Tooltip.examples.tsx +318 -0
  32. package/examples/components/View.examples.tsx +307 -0
  33. package/package.json +15 -2
  34. package/scripts/extract-types.ts +71 -0
  35. package/scripts/type-extractor.ts +286 -0
  36. package/scripts/validate-examples.ts +142 -0
  37. package/src/data/components/Icon.ts +1 -1
  38. package/src/data/components/index.ts +2 -0
  39. package/src/index.ts +181 -1
  40. package/src/tools/get-types.ts +169 -0
  41. package/tsconfig.examples.json +14 -0
  42. package/dist/data/cli-commands.d.ts +0 -2
  43. package/dist/data/cli-commands.d.ts.map +0 -1
  44. package/dist/data/cli-commands.js +0 -100
  45. package/dist/data/cli-commands.js.map +0 -1
  46. package/dist/data/components/Accordion.d.ts +0 -15
  47. package/dist/data/components/Accordion.d.ts.map +0 -1
  48. package/dist/data/components/Accordion.js +0 -112
  49. package/dist/data/components/Accordion.js.map +0 -1
  50. package/dist/data/components/ActivityIndicator.d.ts +0 -15
  51. package/dist/data/components/ActivityIndicator.d.ts.map +0 -1
  52. package/dist/data/components/ActivityIndicator.js +0 -82
  53. package/dist/data/components/ActivityIndicator.js.map +0 -1
  54. package/dist/data/components/Alert.d.ts +0 -15
  55. package/dist/data/components/Alert.d.ts.map +0 -1
  56. package/dist/data/components/Alert.js +0 -132
  57. package/dist/data/components/Alert.js.map +0 -1
  58. package/dist/data/components/Avatar.d.ts +0 -15
  59. package/dist/data/components/Avatar.d.ts.map +0 -1
  60. package/dist/data/components/Avatar.js +0 -93
  61. package/dist/data/components/Avatar.js.map +0 -1
  62. package/dist/data/components/Badge.d.ts +0 -15
  63. package/dist/data/components/Badge.d.ts.map +0 -1
  64. package/dist/data/components/Badge.js +0 -64
  65. package/dist/data/components/Badge.js.map +0 -1
  66. package/dist/data/components/Breadcrumb.d.ts +0 -15
  67. package/dist/data/components/Breadcrumb.d.ts.map +0 -1
  68. package/dist/data/components/Breadcrumb.js +0 -96
  69. package/dist/data/components/Breadcrumb.js.map +0 -1
  70. package/dist/data/components/Button.d.ts +0 -15
  71. package/dist/data/components/Button.d.ts.map +0 -1
  72. package/dist/data/components/Button.js +0 -87
  73. package/dist/data/components/Button.js.map +0 -1
  74. package/dist/data/components/Card.d.ts +0 -15
  75. package/dist/data/components/Card.d.ts.map +0 -1
  76. package/dist/data/components/Card.js +0 -67
  77. package/dist/data/components/Card.js.map +0 -1
  78. package/dist/data/components/Checkbox.d.ts +0 -15
  79. package/dist/data/components/Checkbox.d.ts.map +0 -1
  80. package/dist/data/components/Checkbox.js +0 -118
  81. package/dist/data/components/Checkbox.js.map +0 -1
  82. package/dist/data/components/Chip.d.ts +0 -15
  83. package/dist/data/components/Chip.d.ts.map +0 -1
  84. package/dist/data/components/Chip.js +0 -76
  85. package/dist/data/components/Chip.js.map +0 -1
  86. package/dist/data/components/Dialog.d.ts +0 -15
  87. package/dist/data/components/Dialog.d.ts.map +0 -1
  88. package/dist/data/components/Dialog.js +0 -137
  89. package/dist/data/components/Dialog.js.map +0 -1
  90. package/dist/data/components/Divider.d.ts +0 -15
  91. package/dist/data/components/Divider.d.ts.map +0 -1
  92. package/dist/data/components/Divider.js +0 -71
  93. package/dist/data/components/Divider.js.map +0 -1
  94. package/dist/data/components/Icon.d.ts +0 -15
  95. package/dist/data/components/Icon.d.ts.map +0 -1
  96. package/dist/data/components/Icon.js +0 -70
  97. package/dist/data/components/Icon.js.map +0 -1
  98. package/dist/data/components/Image.d.ts +0 -15
  99. package/dist/data/components/Image.d.ts.map +0 -1
  100. package/dist/data/components/Image.js +0 -122
  101. package/dist/data/components/Image.js.map +0 -1
  102. package/dist/data/components/Input.d.ts +0 -15
  103. package/dist/data/components/Input.d.ts.map +0 -1
  104. package/dist/data/components/Input.js +0 -109
  105. package/dist/data/components/Input.js.map +0 -1
  106. package/dist/data/components/List.d.ts +0 -15
  107. package/dist/data/components/List.d.ts.map +0 -1
  108. package/dist/data/components/List.js +0 -113
  109. package/dist/data/components/List.js.map +0 -1
  110. package/dist/data/components/Menu.d.ts +0 -15
  111. package/dist/data/components/Menu.d.ts.map +0 -1
  112. package/dist/data/components/Menu.js +0 -132
  113. package/dist/data/components/Menu.js.map +0 -1
  114. package/dist/data/components/Popover.d.ts +0 -15
  115. package/dist/data/components/Popover.d.ts.map +0 -1
  116. package/dist/data/components/Popover.js +0 -159
  117. package/dist/data/components/Popover.js.map +0 -1
  118. package/dist/data/components/Pressable.d.ts +0 -15
  119. package/dist/data/components/Pressable.d.ts.map +0 -1
  120. package/dist/data/components/Pressable.js +0 -125
  121. package/dist/data/components/Pressable.js.map +0 -1
  122. package/dist/data/components/Progress.d.ts +0 -15
  123. package/dist/data/components/Progress.d.ts.map +0 -1
  124. package/dist/data/components/Progress.js +0 -95
  125. package/dist/data/components/Progress.js.map +0 -1
  126. package/dist/data/components/RadioButton.d.ts +0 -15
  127. package/dist/data/components/RadioButton.d.ts.map +0 -1
  128. package/dist/data/components/RadioButton.js +0 -140
  129. package/dist/data/components/RadioButton.js.map +0 -1
  130. package/dist/data/components/SVGImage.d.ts +0 -15
  131. package/dist/data/components/SVGImage.d.ts.map +0 -1
  132. package/dist/data/components/SVGImage.js +0 -112
  133. package/dist/data/components/SVGImage.js.map +0 -1
  134. package/dist/data/components/Screen.d.ts +0 -15
  135. package/dist/data/components/Screen.d.ts.map +0 -1
  136. package/dist/data/components/Screen.js +0 -99
  137. package/dist/data/components/Screen.js.map +0 -1
  138. package/dist/data/components/Select.d.ts +0 -15
  139. package/dist/data/components/Select.d.ts.map +0 -1
  140. package/dist/data/components/Select.js +0 -146
  141. package/dist/data/components/Select.js.map +0 -1
  142. package/dist/data/components/Skeleton.d.ts +0 -15
  143. package/dist/data/components/Skeleton.d.ts.map +0 -1
  144. package/dist/data/components/Skeleton.js +0 -110
  145. package/dist/data/components/Skeleton.js.map +0 -1
  146. package/dist/data/components/Slider.d.ts +0 -15
  147. package/dist/data/components/Slider.d.ts.map +0 -1
  148. package/dist/data/components/Slider.js +0 -129
  149. package/dist/data/components/Slider.js.map +0 -1
  150. package/dist/data/components/Switch.d.ts +0 -15
  151. package/dist/data/components/Switch.d.ts.map +0 -1
  152. package/dist/data/components/Switch.js +0 -127
  153. package/dist/data/components/Switch.js.map +0 -1
  154. package/dist/data/components/TabBar.d.ts +0 -15
  155. package/dist/data/components/TabBar.d.ts.map +0 -1
  156. package/dist/data/components/TabBar.js +0 -145
  157. package/dist/data/components/TabBar.js.map +0 -1
  158. package/dist/data/components/Table.d.ts +0 -15
  159. package/dist/data/components/Table.d.ts.map +0 -1
  160. package/dist/data/components/Table.js +0 -151
  161. package/dist/data/components/Table.js.map +0 -1
  162. package/dist/data/components/Tabs.d.ts +0 -15
  163. package/dist/data/components/Tabs.d.ts.map +0 -1
  164. package/dist/data/components/Tabs.js +0 -150
  165. package/dist/data/components/Tabs.js.map +0 -1
  166. package/dist/data/components/Text.d.ts +0 -15
  167. package/dist/data/components/Text.d.ts.map +0 -1
  168. package/dist/data/components/Text.js +0 -85
  169. package/dist/data/components/Text.js.map +0 -1
  170. package/dist/data/components/TextArea.d.ts +0 -15
  171. package/dist/data/components/TextArea.d.ts.map +0 -1
  172. package/dist/data/components/TextArea.js +0 -155
  173. package/dist/data/components/TextArea.js.map +0 -1
  174. package/dist/data/components/Tooltip.d.ts +0 -15
  175. package/dist/data/components/Tooltip.d.ts.map +0 -1
  176. package/dist/data/components/Tooltip.js +0 -105
  177. package/dist/data/components/Tooltip.js.map +0 -1
  178. package/dist/data/components/Video.d.ts +0 -15
  179. package/dist/data/components/Video.d.ts.map +0 -1
  180. package/dist/data/components/Video.js +0 -168
  181. package/dist/data/components/Video.js.map +0 -1
  182. package/dist/data/components/View.d.ts +0 -15
  183. package/dist/data/components/View.d.ts.map +0 -1
  184. package/dist/data/components/View.js +0 -126
  185. package/dist/data/components/View.js.map +0 -1
  186. package/dist/data/components/index.d.ts +0 -37
  187. package/dist/data/components/index.d.ts.map +0 -1
  188. package/dist/data/components/index.js +0 -110
  189. package/dist/data/components/index.js.map +0 -1
  190. package/dist/data/framework-guides.d.ts +0 -2
  191. package/dist/data/framework-guides.d.ts.map +0 -1
  192. package/dist/data/framework-guides.js +0 -589
  193. package/dist/data/framework-guides.js.map +0 -1
  194. package/dist/data/icon-guide.d.ts +0 -2
  195. package/dist/data/icon-guide.d.ts.map +0 -1
  196. package/dist/data/icon-guide.js +0 -285
  197. package/dist/data/icon-guide.js.map +0 -1
  198. package/dist/data/icons.json +0 -7452
  199. package/dist/data/navigation-guides.d.ts +0 -2
  200. package/dist/data/navigation-guides.d.ts.map +0 -1
  201. package/dist/data/navigation-guides.js +0 -1196
  202. package/dist/data/navigation-guides.js.map +0 -1
  203. package/dist/index.d.ts +0 -3
  204. package/dist/index.d.ts.map +0 -1
  205. package/dist/index.js.map +0 -1
@@ -1,155 +0,0 @@
1
- export const TextArea = {
2
- category: "form",
3
- description: "Multi-line text input field for longer text content",
4
- props: `
5
- - \`value\`: string - Current text value
6
- - \`defaultValue\`: string - Default value (uncontrolled)
7
- - \`onChange\`: (value: string) => void - Text change handler
8
- - \`placeholder\`: string - Placeholder text
9
- - \`disabled\`: boolean - Whether textarea is disabled
10
- - \`rows\`: number - Initial number of rows
11
- - \`minHeight\`: number - Minimum height in pixels
12
- - \`maxHeight\`: number - Maximum height in pixels
13
- - \`autoGrow\`: boolean - Automatically grow to fit content
14
- - \`maxLength\`: number - Maximum character length
15
- - \`label\`: string - Label text above textarea
16
- - \`error\`: string - Error message to display
17
- - \`helperText\`: string - Helper text below textarea
18
- - \`resize\`: 'none' | 'vertical' | 'horizontal' | 'both' - Resize behavior (web)
19
- - \`showCharacterCount\`: boolean - Show character count
20
- - \`intent\`: 'primary' | 'neutral' | 'success' | 'error' | 'warning' - Color scheme
21
- - \`size\`: 'small' | 'medium' | 'large' - TextArea size
22
- - \`style\`: ViewStyle - Additional styles
23
- - \`textareaStyle\`: TextStyle - Textarea-specific styles
24
- - \`testID\`: string - Test identifier
25
- `,
26
- features: [
27
- "Multi-line text input",
28
- "Auto-grow to fit content",
29
- "Character count display",
30
- "Min/max height constraints",
31
- "Max length validation",
32
- "Label and helper text",
33
- "Error state",
34
- "Resize control (web)",
35
- "Three sizes",
36
- ],
37
- bestPractices: [
38
- "Always provide a label",
39
- "Use helperText to guide users",
40
- "Set maxLength to prevent excessive input",
41
- "Show character count for limited fields",
42
- "Use autoGrow for dynamic content",
43
- "Set minHeight for comfortable input area",
44
- "Show inline error messages",
45
- ],
46
- usage: `
47
- import { TextArea } from '@idealyst/components';
48
- import { useState } from 'react';
49
-
50
- function Example() {
51
- const [text, setText] = useState('');
52
-
53
- return (
54
- <TextArea
55
- label="Description"
56
- value={text}
57
- onChange={setText}
58
- placeholder="Enter a detailed description"
59
- rows={4}
60
- maxLength={500}
61
- showCharacterCount
62
- helperText="Provide as much detail as possible"
63
- />
64
- );
65
- }
66
- `,
67
- examples: {
68
- basic: `import { TextArea } from '@idealyst/components';
69
-
70
- <TextArea
71
- label="Message"
72
- placeholder="Enter your message"
73
- rows={4}
74
- />`,
75
- variants: `import { TextArea, View } from '@idealyst/components';
76
-
77
- <View spacing="md">
78
- <TextArea label="Small" size="small" rows={3} />
79
- <TextArea label="Medium" size="medium" rows={4} />
80
- <TextArea label="Large" size="large" rows={5} />
81
- </View>`,
82
- "with-icons": `import { TextArea, View, Text } from '@idealyst/components';
83
- import { useState } from 'react';
84
-
85
- function Example() {
86
- const [feedback, setFeedback] = useState('');
87
- const maxLength = 200;
88
-
89
- return (
90
- <View spacing="sm">
91
- <TextArea
92
- label="Feedback"
93
- value={feedback}
94
- onChange={setFeedback}
95
- placeholder="Share your thoughts..."
96
- maxLength={maxLength}
97
- showCharacterCount
98
- autoGrow
99
- minHeight={100}
100
- maxHeight={300}
101
- />
102
- <Text size="small" color="secondary">
103
- {feedback.length}/{maxLength} characters
104
- </Text>
105
- </View>
106
- );
107
- }`,
108
- interactive: `import { TextArea, View, Button, Text } from '@idealyst/components';
109
- import { useState } from 'react';
110
-
111
- function Example() {
112
- const [message, setMessage] = useState('');
113
- const [error, setError] = useState('');
114
- const [submitted, setSubmitted] = useState(false);
115
-
116
- const handleSubmit = () => {
117
- if (message.trim().length < 10) {
118
- setError('Message must be at least 10 characters');
119
- return;
120
- }
121
- setError('');
122
- setSubmitted(true);
123
- // Submit logic here
124
- };
125
-
126
- if (submitted) {
127
- return <Text color="success">Message submitted successfully!</Text>;
128
- }
129
-
130
- return (
131
- <View spacing="md">
132
- <TextArea
133
- label="Your Message"
134
- value={message}
135
- onChange={(val) => {
136
- setMessage(val);
137
- setError('');
138
- }}
139
- placeholder="Type your message here..."
140
- rows={5}
141
- maxLength={500}
142
- showCharacterCount
143
- error={error}
144
- helperText={error || 'Minimum 10 characters required'}
145
- autoGrow
146
- />
147
- <Button intent="primary" onPress={handleSubmit}>
148
- Submit
149
- </Button>
150
- </View>
151
- );
152
- }`,
153
- },
154
- };
155
- //# sourceMappingURL=TextArea.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/data/components/TextArea.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,QAAQ,EAAE,MAAM;IAChB,WAAW,EAAE,qDAAqD;IAClE,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;CAqBR;IACC,QAAQ,EAAE;QACR,uBAAuB;QACvB,0BAA0B;QAC1B,yBAAyB;QACzB,4BAA4B;QAC5B,uBAAuB;QACvB,uBAAuB;QACvB,aAAa;QACb,sBAAsB;QACtB,aAAa;KACd;IACD,aAAa,EAAE;QACb,wBAAwB;QACxB,+BAA+B;QAC/B,0CAA0C;QAC1C,yCAAyC;QACzC,kCAAkC;QAClC,0CAA0C;QAC1C,4BAA4B;KAC7B;IACD,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;CAoBR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;;;;;GAMR;QAEC,QAAQ,EAAE;;;;;;QAMN;QAEJ,YAAY,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;EAyBhB;QAEE,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4Cf;KACC;CACF,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Tooltip: {
2
- category: string;
3
- description: string;
4
- props: string;
5
- features: string[];
6
- bestPractices: string[];
7
- usage: string;
8
- examples: {
9
- basic: string;
10
- variants: string;
11
- "with-icons": string;
12
- interactive: string;
13
- };
14
- };
15
- //# sourceMappingURL=Tooltip.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/data/components/Tooltip.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;CA0GnB,CAAC"}
@@ -1,105 +0,0 @@
1
- export const Tooltip = {
2
- category: "overlay",
3
- description: "Contextual tooltip that displays information on hover or focus",
4
- props: `
5
- - \`content\`: string | ReactNode - Tooltip content to display
6
- - \`children\`: ReactNode - Element that triggers the tooltip
7
- - \`placement\`: 'top' | 'bottom' | 'left' | 'right' - Tooltip placement
8
- - \`delay\`: number - Delay before showing tooltip (milliseconds)
9
- - \`intent\`: 'primary' | 'neutral' | 'success' | 'error' | 'warning' - Color scheme
10
- - \`size\`: 'small' | 'medium' | 'large' - Tooltip size
11
- - \`style\`: ViewStyle - Additional styles
12
- - \`testID\`: string - Test identifier
13
- `,
14
- features: [
15
- "Hover and focus triggers",
16
- "Four placement options",
17
- "Configurable delay",
18
- "Five intent colors",
19
- "Three sizes",
20
- "String or custom content",
21
- "Auto-positioning on overflow",
22
- ],
23
- bestPractices: [
24
- "Keep tooltip content concise",
25
- "Use for supplementary information only",
26
- "Don't hide critical information in tooltips",
27
- "Ensure tooltips are keyboard accessible",
28
- "Use appropriate placement to avoid obscuring content",
29
- "Add small delay to prevent flashing",
30
- ],
31
- usage: `
32
- import { Tooltip, Button } from '@idealyst/components';
33
-
34
- <Tooltip content="Click to save your changes" placement="top">
35
- <Button icon="content-save">Save</Button>
36
- </Tooltip>
37
- `,
38
- examples: {
39
- basic: `import { Tooltip, Button } from '@idealyst/components';
40
-
41
- <Tooltip content="This is a tooltip">
42
- <Button>Hover me</Button>
43
- </Tooltip>`,
44
- variants: `import { Tooltip, Button, View } from '@idealyst/components';
45
-
46
- <View spacing="md">
47
- <Tooltip content="Top placement" placement="top">
48
- <Button>Top</Button>
49
- </Tooltip>
50
- <Tooltip content="Bottom placement" placement="bottom">
51
- <Button>Bottom</Button>
52
- </Tooltip>
53
- <Tooltip content="Left placement" placement="left">
54
- <Button>Left</Button>
55
- </Tooltip>
56
- <Tooltip content="Right placement" placement="right">
57
- <Button>Right</Button>
58
- </Tooltip>
59
- </View>`,
60
- "with-icons": `import { Tooltip, Icon, Text, View } from '@idealyst/components';
61
-
62
- <View style={{ flexDirection: 'row', alignItems: 'center', gap: 8 }}>
63
- <Text>Need help?</Text>
64
- <Tooltip
65
- content="Click here for assistance"
66
- placement="right"
67
- intent="primary"
68
- >
69
- <Icon name="help-circle" size="md" color="primary" />
70
- </Tooltip>
71
- </View>`,
72
- interactive: `import { Tooltip, Button, View, Text } from '@idealyst/components';
73
-
74
- function ActionButtons() {
75
- return (
76
- <View spacing="sm">
77
- <View style={{ flexDirection: 'row', gap: 8 }}>
78
- <Tooltip content="Save your work" placement="top" delay={500}>
79
- <Button icon="content-save" variant="contained" intent="primary">
80
- Save
81
- </Button>
82
- </Tooltip>
83
-
84
- <Tooltip content="Undo last action" placement="top" delay={500}>
85
- <Button icon="undo" variant="outlined">
86
- Undo
87
- </Button>
88
- </Tooltip>
89
-
90
- <Tooltip content="Delete selected items" placement="top" intent="error" delay={500}>
91
- <Button icon="delete" variant="outlined" intent="error">
92
- Delete
93
- </Button>
94
- </Tooltip>
95
- </View>
96
-
97
- <Text size="small" color="secondary">
98
- Hover over buttons to see tooltips
99
- </Text>
100
- </View>
101
- );
102
- }`,
103
- },
104
- };
105
- //# sourceMappingURL=Tooltip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/data/components/Tooltip.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,QAAQ,EAAE,SAAS;IACnB,WAAW,EAAE,gEAAgE;IAC7E,KAAK,EAAE;;;;;;;;;CASR;IACC,QAAQ,EAAE;QACR,0BAA0B;QAC1B,wBAAwB;QACxB,oBAAoB;QACpB,oBAAoB;QACpB,aAAa;QACb,0BAA0B;QAC1B,8BAA8B;KAC/B;IACD,aAAa,EAAE;QACb,8BAA8B;QAC9B,wCAAwC;QACxC,6CAA6C;QAC7C,yCAAyC;QACzC,sDAAsD;QACtD,qCAAqC;KACtC;IACD,KAAK,EAAE;;;;;;CAMR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;;;WAIA;QAEP,QAAQ,EAAE;;;;;;;;;;;;;;;QAeN;QAEJ,YAAY,EAAE;;;;;;;;;;;QAWV;QAEJ,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8Bf;KACC;CACF,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Video: {
2
- category: string;
3
- description: string;
4
- props: string;
5
- features: string[];
6
- bestPractices: string[];
7
- usage: string;
8
- examples: {
9
- basic: string;
10
- variants: string;
11
- "with-icons": string;
12
- interactive: string;
13
- };
14
- };
15
- //# sourceMappingURL=Video.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Video.d.ts","sourceRoot":"","sources":["../../../src/data/components/Video.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK;;;;;;;;;;;;;CAyKjB,CAAC"}
@@ -1,168 +0,0 @@
1
- export const Video = {
2
- category: "media",
3
- description: "Video player component with playback controls and event handlers",
4
- props: `
5
- - \`source\`: VideoSource | string - Video source ({ uri, type } or string URL)
6
- - \`poster\`: string - Poster image URL (shown before playback)
7
- - \`width\`: number | string - Video width
8
- - \`height\`: number | string - Video height
9
- - \`aspectRatio\`: number - Aspect ratio (width/height)
10
- - \`controls\`: boolean - Show playback controls (default: true)
11
- - \`autoPlay\`: boolean - Start playing automatically
12
- - \`loop\`: boolean - Loop playback
13
- - \`muted\`: boolean - Mute audio
14
- - \`playsInline\`: boolean - Play inline (not fullscreen on mobile)
15
- - \`preload\`: 'auto' | 'metadata' | 'none' - Preload strategy (web)
16
- - \`onLoad\`: () => void - Called when video loads
17
- - \`onError\`: (error: any) => void - Called on load error
18
- - \`onPlay\`: () => void - Called when playback starts
19
- - \`onPause\`: () => void - Called when playback pauses
20
- - \`onEnd\`: () => void - Called when playback ends
21
- - \`onProgress\`: (progress) => void - Called during playback with current time
22
- - \`borderRadius\`: number - Border radius in pixels
23
- - \`style\`: ViewStyle - Additional styles
24
- - \`testID\`: string - Test identifier
25
- `,
26
- features: [
27
- "Remote and local video sources",
28
- "Poster image support",
29
- "Playback controls",
30
- "Auto-play and loop",
31
- "Multiple event callbacks",
32
- "Progress tracking",
33
- "Aspect ratio control",
34
- "Border radius support",
35
- ],
36
- bestPractices: [
37
- "Always provide a poster image",
38
- "Use appropriate video formats for cross-platform",
39
- "Enable controls for user control",
40
- "Avoid autoPlay with audio (UX best practice)",
41
- "Use playsInline for better mobile experience",
42
- "Provide onError fallback",
43
- "Set explicit dimensions or aspect ratio",
44
- "Use preload: 'metadata' for better performance",
45
- ],
46
- usage: `
47
- import { Video } from '@idealyst/components';
48
-
49
- <Video
50
- source={{ uri: 'https://example.com/video.mp4', type: 'video/mp4' }}
51
- poster="https://example.com/poster.jpg"
52
- width="100%"
53
- aspectRatio={16/9}
54
- controls
55
- playsInline
56
- onLoad={() => console.log('Video loaded')}
57
- onError={(error) => console.error('Video error:', error)}
58
- />
59
- `,
60
- examples: {
61
- basic: `import { Video } from '@idealyst/components';
62
-
63
- <Video
64
- source="https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4"
65
- width={640}
66
- height={360}
67
- controls
68
- />`,
69
- variants: `import { Video, View } from '@idealyst/components';
70
-
71
- <View spacing="md">
72
- {/* With controls */}
73
- <Video
74
- source={{ uri: 'https://example.com/video.mp4' }}
75
- width="100%"
76
- aspectRatio={16/9}
77
- controls
78
- />
79
-
80
- {/* Auto-play, looped, muted */}
81
- <Video
82
- source={{ uri: 'https://example.com/video.mp4' }}
83
- width="100%"
84
- aspectRatio={16/9}
85
- autoPlay
86
- loop
87
- muted
88
- controls={false}
89
- />
90
- </View>`,
91
- "with-icons": `import { Video, Card, View, Text } from '@idealyst/components';
92
-
93
- <Card variant="elevated" padding="none">
94
- <Video
95
- source="https://example.com/video.mp4"
96
- poster="https://example.com/poster.jpg"
97
- width="100%"
98
- aspectRatio={16/9}
99
- controls
100
- borderRadius={8}
101
- />
102
- <View spacing="sm" style={{ padding: 16 }}>
103
- <Text weight="bold">Video Title</Text>
104
- <Text size="small">Video description and details</Text>
105
- </View>
106
- </Card>`,
107
- interactive: `import { Video, View, Text, Button } from '@idealyst/components';
108
- import { useState, useRef } from 'react';
109
-
110
- function Example() {
111
- const [playing, setPlaying] = useState(false);
112
- const [progress, setProgress] = useState(0);
113
- const videoRef = useRef(null);
114
-
115
- const handleProgress = ({ currentTime, playableDuration }) => {
116
- if (playableDuration > 0) {
117
- setProgress((currentTime / playableDuration) * 100);
118
- }
119
- };
120
-
121
- return (
122
- <View spacing="md">
123
- <Video
124
- ref={videoRef}
125
- source={{ uri: 'https://example.com/video.mp4' }}
126
- poster="https://example.com/poster.jpg"
127
- width="100%"
128
- aspectRatio={16/9}
129
- controls
130
- playsInline
131
- onPlay={() => setPlaying(true)}
132
- onPause={() => setPlaying(false)}
133
- onEnd={() => {
134
- setPlaying(false);
135
- setProgress(0);
136
- }}
137
- onProgress={handleProgress}
138
- onError={(error) => console.error('Video error:', error)}
139
- />
140
-
141
- <View spacing="sm">
142
- <Text>
143
- Status: {playing ? 'Playing' : 'Paused'} | Progress: {progress.toFixed(1)}%
144
- </Text>
145
-
146
- <View style={{ flexDirection: 'row', gap: 8 }}>
147
- <Button
148
- size="small"
149
- variant="outlined"
150
- onPress={() => videoRef.current?.play()}
151
- >
152
- Play
153
- </Button>
154
- <Button
155
- size="small"
156
- variant="outlined"
157
- onPress={() => videoRef.current?.pause()}
158
- >
159
- Pause
160
- </Button>
161
- </View>
162
- </View>
163
- </View>
164
- );
165
- }`,
166
- },
167
- };
168
- //# sourceMappingURL=Video.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Video.js","sourceRoot":"","sources":["../../../src/data/components/Video.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,QAAQ,EAAE,OAAO;IACjB,WAAW,EAAE,kEAAkE;IAC/E,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;CAqBR;IACC,QAAQ,EAAE;QACR,gCAAgC;QAChC,sBAAsB;QACtB,mBAAmB;QACnB,oBAAoB;QACpB,0BAA0B;QAC1B,mBAAmB;QACnB,sBAAsB;QACtB,uBAAuB;KACxB;IACD,aAAa,EAAE;QACb,+BAA+B;QAC/B,kDAAkD;QAClD,kCAAkC;QAClC,8CAA8C;QAC9C,8CAA8C;QAC9C,0BAA0B;QAC1B,yCAAyC;QACzC,gDAAgD;KACjD;IACD,KAAK,EAAE;;;;;;;;;;;;;CAaR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;;;;;;GAOR;QAEC,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;QAqBN;QAEJ,YAAY,EAAE;;;;;;;;;;;;;;;QAeV;QAEJ,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0Df;KACC;CACF,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const View: {
2
- category: string;
3
- description: string;
4
- props: string;
5
- features: string[];
6
- bestPractices: string[];
7
- usage: string;
8
- examples: {
9
- basic: string;
10
- variants: string;
11
- "with-icons": string;
12
- interactive: string;
13
- };
14
- };
15
- //# sourceMappingURL=View.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"View.d.ts","sourceRoot":"","sources":["../../../src/data/components/View.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI;;;;;;;;;;;;;CA+HhB,CAAC"}
@@ -1,126 +0,0 @@
1
- export const View = {
2
- category: "layout",
3
- description: "Container component with spacing, padding, and background variants",
4
- props: `
5
- - \`children\`: ReactNode - Content to display inside the view
6
- - \`spacing\`: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' - Gap between children
7
- - \`marginVariant\`: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' - Margin variant
8
- - \`background\`: 'transparent' | 'surface' | 'primary' | 'secondary' - Background variant
9
- - \`radius\`: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' - Border radius variant
10
- - \`border\`: 'none' | 'thin' | 'thick' - Border variant
11
- - \`backgroundColor\`: string - Custom background color (overrides variant)
12
- - \`padding\`: number - Custom padding (overrides spacing)
13
- - \`margin\`: number - Custom margin (overrides marginVariant)
14
- - \`borderRadius\`: number - Custom border radius (overrides radius)
15
- - \`borderWidth\`: number - Custom border width (overrides border)
16
- - \`borderColor\`: string - Custom border color
17
- - \`style\`: any - Additional custom styles
18
- - \`testID\`: string - Test identifier
19
- `,
20
- features: [
21
- "Automatic gap spacing between children",
22
- "Six spacing/margin variants",
23
- "Four background variants",
24
- "Six border radius variants",
25
- "Border support",
26
- "Custom overrides for all variants",
27
- "Flexbox-based layout",
28
- ],
29
- bestPractices: [
30
- "Use View for all layout containers",
31
- "Use spacing prop for consistent gaps",
32
- "Prefer variants over custom values",
33
- "Use 'md' spacing for standard layouts",
34
- "Combine with Screen for full-screen layouts",
35
- "Use background variants for semantic colors",
36
- ],
37
- usage: `
38
- import { View, Text, Button } from '@idealyst/components';
39
-
40
- <View spacing="md" background="surface" radius="md" style={{ padding: 16 }}>
41
- <Text size="large" weight="bold">Card Title</Text>
42
- <Text>Card content with consistent spacing</Text>
43
- <Button>Action</Button>
44
- </View>
45
- `,
46
- examples: {
47
- basic: `import { View, Text } from '@idealyst/components';
48
-
49
- <View spacing="md">
50
- <Text>Item 1</Text>
51
- <Text>Item 2</Text>
52
- <Text>Item 3</Text>
53
- </View>`,
54
- variants: `import { View, Text } from '@idealyst/components';
55
-
56
- <View spacing="lg">
57
- <View spacing="xs" background="surface" radius="sm" style={{ padding: 12 }}>
58
- <Text>Extra small spacing</Text>
59
- <Text>Second item</Text>
60
- </View>
61
-
62
- <View spacing="md" background="surface" radius="md" style={{ padding: 16 }}>
63
- <Text>Medium spacing</Text>
64
- <Text>Second item</Text>
65
- </View>
66
-
67
- <View spacing="xl" background="surface" radius="lg" style={{ padding: 20 }}>
68
- <Text>Extra large spacing</Text>
69
- <Text>Second item</Text>
70
- </View>
71
- </View>`,
72
- "with-icons": `import { View, Icon, Text } from '@idealyst/components';
73
-
74
- <View
75
- spacing="sm"
76
- background="surface"
77
- radius="md"
78
- border="thin"
79
- style={{ padding: 16 }}
80
- >
81
- <View style={{ flexDirection: 'row', alignItems: 'center', gap: 12 }}>
82
- <Icon name="information-outline" size="lg" color="primary" />
83
- <View spacing="xs" style={{ flex: 1 }}>
84
- <Text weight="bold">Important Information</Text>
85
- <Text size="small">This is an informational message</Text>
86
- </View>
87
- </View>
88
- </View>`,
89
- interactive: `import { View, Text, Button, Card } from '@idealyst/components';
90
- import { useState } from 'react';
91
-
92
- function Example() {
93
- const [items, setItems] = useState(['Item 1', 'Item 2']);
94
-
95
- const addItem = () => {
96
- setItems([...items, \`Item \${items.length + 1}\`]);
97
- };
98
-
99
- return (
100
- <View spacing="lg" style={{ padding: 16 }}>
101
- <Card variant="outlined" padding="medium">
102
- <View spacing="md">
103
- <Text weight="bold">Dynamic List</Text>
104
- <View spacing="sm">
105
- {items.map((item, index) => (
106
- <View
107
- key={index}
108
- background="surface"
109
- radius="sm"
110
- style={{ padding: 12 }}
111
- >
112
- <Text>{item}</Text>
113
- </View>
114
- ))}
115
- </View>
116
- <Button onPress={addItem} variant="outlined">
117
- Add Item
118
- </Button>
119
- </View>
120
- </Card>
121
- </View>
122
- );
123
- }`,
124
- },
125
- };
126
- //# sourceMappingURL=View.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"View.js","sourceRoot":"","sources":["../../../src/data/components/View.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG;IAClB,QAAQ,EAAE,QAAQ;IAClB,WAAW,EAAE,oEAAoE;IACjF,KAAK,EAAE;;;;;;;;;;;;;;;CAeR;IACC,QAAQ,EAAE;QACR,wCAAwC;QACxC,6BAA6B;QAC7B,0BAA0B;QAC1B,4BAA4B;QAC5B,gBAAgB;QAChB,mCAAmC;QACnC,sBAAsB;KACvB;IACD,aAAa,EAAE;QACb,oCAAoC;QACpC,sCAAsC;QACtC,oCAAoC;QACpC,uCAAuC;QACvC,6CAA6C;QAC7C,6CAA6C;KAC9C;IACD,KAAK,EAAE;;;;;;;;CAQR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;;;;;QAMH;QAEJ,QAAQ,EAAE;;;;;;;;;;;;;;;;;QAiBN;QAEJ,YAAY,EAAE;;;;;;;;;;;;;;;;QAgBV;QAEJ,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCf;KACC;CACF,CAAC"}
@@ -1,37 +0,0 @@
1
- export { Accordion } from './Accordion.js';
2
- export { ActivityIndicator } from './ActivityIndicator.js';
3
- export { Alert } from './Alert.js';
4
- export { Avatar } from './Avatar.js';
5
- export { Badge } from './Badge.js';
6
- export { Breadcrumb } from './Breadcrumb.js';
7
- export { Button } from './Button.js';
8
- export { Card } from './Card.js';
9
- export { Checkbox } from './Checkbox.js';
10
- export { Chip } from './Chip.js';
11
- export { Dialog } from './Dialog.js';
12
- export { Divider } from './Divider.js';
13
- export { Icon } from './Icon.js';
14
- export { Image } from './Image.js';
15
- export { Input } from './Input.js';
16
- export { List } from './List.js';
17
- export { Menu } from './Menu.js';
18
- export { Popover } from './Popover.js';
19
- export { Pressable } from './Pressable.js';
20
- export { Progress } from './Progress.js';
21
- export { RadioButton } from './RadioButton.js';
22
- export { Screen } from './Screen.js';
23
- export { Select } from './Select.js';
24
- export { Skeleton } from './Skeleton.js';
25
- export { Slider } from './Slider.js';
26
- export { SVGImage } from './SVGImage.js';
27
- export { Switch } from './Switch.js';
28
- export { TabBar } from './TabBar.js';
29
- export { Table } from './Table.js';
30
- export { Tabs } from './Tabs.js';
31
- export { Text } from './Text.js';
32
- export { TextArea } from './TextArea.js';
33
- export { Tooltip } from './Tooltip.js';
34
- export { Video } from './Video.js';
35
- export { View } from './View.js';
36
- export declare const components: Record<string, any>;
37
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/data/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAuCjC,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAoC1C,CAAC"}