@idealyst/mcp-server 1.0.86 → 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,96 +0,0 @@
1
- export const Breadcrumb = {
2
- category: "navigation",
3
- description: "Navigation aid showing the current location within a hierarchy",
4
- props: `
5
- - \`items\`: BreadcrumbItem[] - Array of breadcrumb items
6
- - \`label\`: string - Label text for the breadcrumb item
7
- - \`icon\`: IconName | ReactNode - Optional icon (icon name string or custom component)
8
- - \`onPress\`: () => void - Click handler for the breadcrumb item
9
- - \`disabled\`: boolean - Whether this item is disabled
10
- - \`separator\`: ReactNode - Custom separator between items (default: '/')
11
- - \`maxItems\`: number - Maximum number of items before truncating
12
- - \`intent\`: 'primary' | 'neutral' - Intent color for links
13
- - \`size\`: 'small' | 'medium' | 'large' - Size of breadcrumb text
14
- - \`style\`: StyleProp<ViewStyle> - Custom container style
15
- - \`itemStyle\`: StyleProp<ViewStyle> - Custom item style
16
- - \`separatorStyle\`: StyleProp<TextStyle> - Custom separator style
17
- - \`testID\`: string - Test identifier
18
- `,
19
- features: [
20
- "Icon support with string names or custom components",
21
- "Custom separators",
22
- "Truncation with maxItems",
23
- "Two intent colors",
24
- "Three sizes",
25
- "Disabled items",
26
- "Click handlers for navigation",
27
- ],
28
- bestPractices: [
29
- "Keep breadcrumb labels short and clear",
30
- "Last item should represent current page (typically not clickable)",
31
- "Use icons sparingly for visual clarity",
32
- "Set maxItems for deep hierarchies to avoid overflow",
33
- "Use 'neutral' intent for subtle breadcrumbs",
34
- ],
35
- usage: `
36
- import { Breadcrumb } from '@idealyst/components';
37
-
38
- const items = [
39
- { label: 'Home', icon: 'home', onPress: () => navigate('/') },
40
- { label: 'Products', onPress: () => navigate('/products') },
41
- { label: 'Electronics', onPress: () => navigate('/products/electronics') },
42
- { label: 'Laptop' }, // Current page, no onPress
43
- ];
44
-
45
- <Breadcrumb items={items} intent="primary" />
46
- `,
47
- examples: {
48
- basic: `import { Breadcrumb } from '@idealyst/components';
49
-
50
- const items = [
51
- { label: 'Home', onPress: () => console.log('Home') },
52
- { label: 'Products', onPress: () => console.log('Products') },
53
- { label: 'Item' },
54
- ];
55
-
56
- <Breadcrumb items={items} />`,
57
- variants: `import { Breadcrumb, View } from '@idealyst/components';
58
-
59
- const items = [
60
- { label: 'Home', onPress: () => {} },
61
- { label: 'Category', onPress: () => {} },
62
- { label: 'Item' },
63
- ];
64
-
65
- <View spacing="md">
66
- <Breadcrumb items={items} size="small" />
67
- <Breadcrumb items={items} size="medium" />
68
- <Breadcrumb items={items} size="large" />
69
- </View>`,
70
- "with-icons": `import { Breadcrumb } from '@idealyst/components';
71
-
72
- const items = [
73
- { label: 'Home', icon: 'home', onPress: () => navigate('/') },
74
- { label: 'Settings', icon: 'cog', onPress: () => navigate('/settings') },
75
- { label: 'Profile', icon: 'account' },
76
- ];
77
-
78
- <Breadcrumb items={items} intent="primary" />`,
79
- interactive: `import { Breadcrumb } from '@idealyst/components';
80
- import { useState } from 'react';
81
-
82
- function Example() {
83
- const [path, setPath] = useState(['Home', 'Products', 'Electronics']);
84
-
85
- const items = path.map((label, index) => ({
86
- label,
87
- onPress: index < path.length - 1
88
- ? () => setPath(path.slice(0, index + 1))
89
- : undefined,
90
- }));
91
-
92
- return <Breadcrumb items={items} maxItems={4} />;
93
- }`,
94
- },
95
- };
96
- //# sourceMappingURL=Breadcrumb.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Breadcrumb.js","sourceRoot":"","sources":["../../../src/data/components/Breadcrumb.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,QAAQ,EAAE,YAAY;IACtB,WAAW,EAAE,gEAAgE;IAC7E,KAAK,EAAE;;;;;;;;;;;;;;CAcR;IACC,QAAQ,EAAE;QACR,qDAAqD;QACrD,mBAAmB;QACnB,0BAA0B;QAC1B,mBAAmB;QACnB,aAAa;QACb,gBAAgB;QAChB,+BAA+B;KAChC;IACD,aAAa,EAAE;QACb,wCAAwC;QACxC,mEAAmE;QACnE,wCAAwC;QACxC,qDAAqD;QACrD,6CAA6C;KAC9C;IACD,KAAK,EAAE;;;;;;;;;;;CAWR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;;;;;;;6BAQkB;QAEzB,QAAQ,EAAE;;;;;;;;;;;;QAYN;QAEJ,YAAY,EAAE;;;;;;;;8CAQ4B;QAE1C,WAAW,EAAE;;;;;;;;;;;;;;EAcf;KACC;CACF,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Button: {
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=Button.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/data/components/Button.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAqFlB,CAAC"}
@@ -1,87 +0,0 @@
1
- export const Button = {
2
- category: "form",
3
- description: "Interactive button component with multiple variants, sizes, and icon support",
4
- props: `
5
- - \`variant\`: 'contained' | 'outlined' | 'text' - Visual style variant
6
- - \`intent\`: 'primary' | 'neutral' | 'success' | 'error' | 'warning' - Color scheme
7
- - \`size\`: 'small' | 'medium' | 'large' - Button size
8
- - \`icon\`: string | ReactNode - Icon name (MDI) or custom React element
9
- - \`iconPosition\`: 'left' | 'right' - Position of icon relative to label
10
- - \`disabled\`: boolean - Disable button interaction
11
- - \`loading\`: boolean - Show loading state
12
- - \`fullWidth\`: boolean - Expand button to full container width
13
- - \`onPress\`: () => void - Press handler
14
- `,
15
- features: [
16
- "Three variants: contained, outlined, text",
17
- "Five intent colors for semantic meaning",
18
- "Three sizes: small, medium, large",
19
- "Icon support with string names or custom React elements",
20
- "Loading and disabled states",
21
- "Full width option",
22
- "Cross-platform (React & React Native)",
23
- ],
24
- bestPractices: [
25
- "Use 'primary' intent for main actions",
26
- "Use 'contained' variant for prominent actions",
27
- "Use icon names (strings) for consistency with design system",
28
- "Keep button labels concise and action-oriented",
29
- ],
30
- usage: `
31
- import { Button } from '@idealyst/components';
32
-
33
- <Button
34
- variant="contained"
35
- intent="primary"
36
- icon="check"
37
- onPress={() => console.log('Pressed')}
38
- >
39
- Save Changes
40
- </Button>
41
- `,
42
- examples: {
43
- basic: `import { Button } from '@idealyst/components';
44
-
45
- // Basic button
46
- <Button onPress={() => console.log('Clicked')}>
47
- Click Me
48
- </Button>`,
49
- variants: `import { Button } from '@idealyst/components';
50
-
51
- // Different variants
52
- <Button variant="contained" intent="primary">Contained</Button>
53
- <Button variant="outlined" intent="primary">Outlined</Button>
54
- <Button variant="text" intent="primary">Text</Button>`,
55
- "with-icons": `import { Button } from '@idealyst/components';
56
-
57
- // Button with icon
58
- <Button icon="check" iconPosition="left">
59
- Confirm
60
- </Button>
61
-
62
- // Icon-only button
63
- <Button icon="close" />`,
64
- interactive: `import { Button } from '@idealyst/components';
65
- import { useState } from 'react';
66
-
67
- function Example() {
68
- const [loading, setLoading] = useState(false);
69
-
70
- const handlePress = async () => {
71
- setLoading(true);
72
- await someAsyncOperation();
73
- setLoading(false);
74
- };
75
-
76
- return (
77
- <Button
78
- loading={loading}
79
- onPress={handlePress}
80
- >
81
- Save
82
- </Button>
83
- );
84
- }`,
85
- }
86
- };
87
- //# sourceMappingURL=Button.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/data/components/Button.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAAG;IACtB,QAAQ,EAAE,MAAM;IACZ,WAAW,EAAE,8EAA8E;IAC3F,KAAK,EAAE;;;;;;;;;;CAUV;IACG,QAAQ,EAAE;QACR,2CAA2C;QAC3C,yCAAyC;QACzC,mCAAmC;QACnC,yDAAyD;QACzD,6BAA6B;QAC7B,mBAAmB;QACnB,uCAAuC;KACxC;IACD,aAAa,EAAE;QACb,uCAAuC;QACvC,+CAA+C;QAC/C,6DAA6D;QAC7D,gDAAgD;KACjD;IACD,KAAK,EAAE;;;;;;;;;;;CAWV;IACG,QAAQ,EAAE;QACR,KAAK,EAAE;;;;;UAKH;QACJ,QAAQ,EAAE;;;;;sDAKsC;QAChD,YAAY,EAAE;;;;;;;;wBAQI;QAClB,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;EAoBjB;KACG;CACJ,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Card: {
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=Card.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/data/components/Card.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI;;;;;;;;;;;;;CAiEhB,CAAC"}
@@ -1,67 +0,0 @@
1
- export const Card = {
2
- category: "display",
3
- description: "Container component for grouping related content with various visual styles",
4
- props: `
5
- - \`variant\`: 'default' | 'outlined' | 'elevated' | 'filled' - Visual style
6
- - \`intent\`: 'primary' | 'neutral' | 'success' | 'error' | 'warning' - Color scheme
7
- - \`padding\`: 'none' | 'small' | 'medium' | 'large' - Internal padding
8
- - \`radius\`: 'none' | 'small' | 'medium' | 'large' - Border radius
9
- - \`clickable\`: boolean - Make card interactive
10
- - \`onPress\`: () => void - Press handler (when clickable)
11
- - \`children\`: ReactNode - Card content
12
- `,
13
- features: [
14
- "Four visual variants",
15
- "Intent-based color schemes",
16
- "Configurable padding and border radius",
17
- "Clickable with press handler",
18
- "Flexible content container",
19
- ],
20
- bestPractices: [
21
- "Use 'elevated' variant for prominent content",
22
- "Group related content within cards",
23
- "Use appropriate padding for content density",
24
- "Make cards clickable only when they represent an action",
25
- ],
26
- usage: `
27
- import { Card, Text, View } from '@idealyst/components';
28
-
29
- <Card variant="elevated" padding="medium">
30
- <View spacing="sm">
31
- <Text weight="bold">Card Title</Text>
32
- <Text size="small">Card content goes here</Text>
33
- </View>
34
- </Card>
35
- `,
36
- examples: {
37
- basic: `import { Card, Text } from '@idealyst/components';
38
-
39
- <Card>
40
- <Text>Simple card content</Text>
41
- </Card>`,
42
- variants: `import { Card, Text } from '@idealyst/components';
43
-
44
- <Card variant="default"><Text>Default</Text></Card>
45
- <Card variant="outlined"><Text>Outlined</Text></Card>
46
- <Card variant="elevated"><Text>Elevated</Text></Card>
47
- <Card variant="filled"><Text>Filled</Text></Card>`,
48
- "with-icons": `import { Card, View, Text, Icon } from '@idealyst/components';
49
-
50
- <Card variant="outlined">
51
- <View spacing="sm">
52
- <Icon name="information" size="lg" />
53
- <Text>Card with icon header</Text>
54
- </View>
55
- </Card>`,
56
- interactive: `import { Card, Text } from '@idealyst/components';
57
-
58
- <Card
59
- clickable
60
- onPress={() => console.log('Card clicked')}
61
- variant="outlined"
62
- >
63
- <Text>Click this card</Text>
64
- </Card>`,
65
- }
66
- };
67
- //# sourceMappingURL=Card.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/data/components/Card.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG;IACpB,QAAQ,EAAE,SAAS;IACf,WAAW,EAAE,6EAA6E;IAC1F,KAAK,EAAE;;;;;;;;CAQV;IACG,QAAQ,EAAE;QACR,sBAAsB;QACtB,4BAA4B;QAC5B,wCAAwC;QACxC,8BAA8B;QAC9B,4BAA4B;KAC7B;IACD,aAAa,EAAE;QACb,8CAA8C;QAC9C,oCAAoC;QACpC,6CAA6C;QAC7C,yDAAyD;KAC1D;IACD,KAAK,EAAE;;;;;;;;;CASV;IACG,QAAQ,EAAE;QACR,KAAK,EAAE;;;;QAIL;QACF,QAAQ,EAAE;;;;;kDAKkC;QAC5C,YAAY,EAAE;;;;;;;QAOZ;QACF,WAAW,EAAE;;;;;;;;QAQX;KACH;CACJ,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Checkbox: {
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=Checkbox.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/data/components/Checkbox.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;CAuHpB,CAAC"}
@@ -1,118 +0,0 @@
1
- export const Checkbox = {
2
- category: "form",
3
- description: "Form checkbox for boolean selection with label and validation support",
4
- props: `
5
- - \`checked\`: boolean - Whether the checkbox is checked
6
- - \`indeterminate\`: boolean - Whether the checkbox is in an indeterminate state
7
- - \`disabled\`: boolean - Whether the checkbox is disabled
8
- - \`onCheckedChange\`: (checked: boolean) => void - Called when checkbox state changes
9
- - \`size\`: 'small' | 'medium' | 'large' - Checkbox size
10
- - \`intent\`: IntentVariant - Color scheme
11
- - \`variant\`: 'default' | 'outlined' - Visual style
12
- - \`label\`: string - Label text to display next to checkbox
13
- - \`children\`: ReactNode - Custom label content
14
- - \`style\`: any - Additional custom styles
15
- - \`testID\`: string - Test identifier
16
- - \`accessibilityLabel\`: string - Accessibility label
17
- - \`required\`: boolean - Whether the checkbox is required
18
- - \`error\`: string - Error message to display
19
- - \`helperText\`: string - Helper text to display
20
- `,
21
- features: [
22
- "Checked, unchecked, and indeterminate states",
23
- "Label support (string or custom ReactNode)",
24
- "Three sizes",
25
- "Intent-based colors",
26
- "Error and helper text",
27
- "Required field support",
28
- "Accessible with proper ARIA attributes",
29
- ],
30
- bestPractices: [
31
- "Always provide a label for accessibility",
32
- "Use indeterminate state for parent checkboxes with partial children selection",
33
- "Show error messages inline",
34
- "Use helperText to clarify checkbox meaning",
35
- "Group related checkboxes visually",
36
- ],
37
- usage: `
38
- import { Checkbox } from '@idealyst/components';
39
- import { useState } from 'react';
40
-
41
- function Example() {
42
- const [checked, setChecked] = useState(false);
43
-
44
- return (
45
- <Checkbox
46
- checked={checked}
47
- onCheckedChange={setChecked}
48
- label="Accept terms and conditions"
49
- required
50
- />
51
- );
52
- }
53
- `,
54
- examples: {
55
- basic: `import { Checkbox } from '@idealyst/components';
56
-
57
- <Checkbox label="Subscribe to newsletter" />`,
58
- variants: `import { Checkbox, View } from '@idealyst/components';
59
-
60
- <View spacing="sm">
61
- <Checkbox label="Small" size="small" />
62
- <Checkbox label="Medium" size="medium" />
63
- <Checkbox label="Large" size="large" />
64
- </View>`,
65
- "with-icons": `import { Checkbox, View } from '@idealyst/components';
66
-
67
- <View spacing="sm">
68
- <Checkbox
69
- label="Enable notifications"
70
- intent="primary"
71
- checked
72
- />
73
- <Checkbox
74
- label="Dark mode"
75
- intent="success"
76
- checked
77
- />
78
- </View>`,
79
- interactive: `import { Checkbox, View, Text } from '@idealyst/components';
80
- import { useState } from 'react';
81
-
82
- function Example() {
83
- const [options, setOptions] = useState({
84
- email: false,
85
- sms: false,
86
- push: false,
87
- });
88
-
89
- return (
90
- <View spacing="md">
91
- <Text weight="bold">Notification Preferences</Text>
92
- <Checkbox
93
- label="Email notifications"
94
- checked={options.email}
95
- onCheckedChange={(checked) =>
96
- setOptions({ ...options, email: checked })
97
- }
98
- />
99
- <Checkbox
100
- label="SMS notifications"
101
- checked={options.sms}
102
- onCheckedChange={(checked) =>
103
- setOptions({ ...options, sms: checked })
104
- }
105
- />
106
- <Checkbox
107
- label="Push notifications"
108
- checked={options.push}
109
- onCheckedChange={(checked) =>
110
- setOptions({ ...options, push: checked })
111
- }
112
- />
113
- </View>
114
- );
115
- }`,
116
- },
117
- };
118
- //# sourceMappingURL=Checkbox.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/data/components/Checkbox.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,QAAQ,EAAE,MAAM;IAChB,WAAW,EAAE,uEAAuE;IACpF,KAAK,EAAE;;;;;;;;;;;;;;;;CAgBR;IACC,QAAQ,EAAE;QACR,8CAA8C;QAC9C,4CAA4C;QAC5C,aAAa;QACb,qBAAqB;QACrB,uBAAuB;QACvB,wBAAwB;QACxB,wCAAwC;KACzC;IACD,aAAa,EAAE;QACb,0CAA0C;QAC1C,+EAA+E;QAC/E,4BAA4B;QAC5B,4CAA4C;QAC5C,mCAAmC;KACpC;IACD,KAAK,EAAE;;;;;;;;;;;;;;;;CAgBR;IACC,QAAQ,EAAE;QACR,KAAK,EAAE;;6CAEkC;QAEzC,QAAQ,EAAE;;;;;;QAMN;QAEJ,YAAY,EAAE;;;;;;;;;;;;;QAaV;QAEJ,WAAW,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCf;KACC;CACF,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Chip: {
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=Chip.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/data/components/Chip.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,IAAI;;;;;;;;;;;;;CA0EhB,CAAC"}
@@ -1,76 +0,0 @@
1
- export const Chip = {
2
- category: "display",
3
- description: "Compact element for tags, filters, and selections with optional delete action",
4
- props: `
5
- - \`label\`: string - Chip text
6
- - \`variant\`: 'filled' | 'outlined' | 'soft' - Visual style
7
- - \`intent\`: 'primary' | 'neutral' | 'success' | 'error' | 'warning' - Color scheme
8
- - \`size\`: 'small' | 'medium' | 'large' - Chip size
9
- - \`icon\`: string | ReactNode - Leading icon
10
- - \`deletable\`: boolean - Show delete button
11
- - \`onDelete\`: () => void - Delete handler
12
- - \`selectable\`: boolean - Enable selection
13
- - \`selected\`: boolean - Selected state
14
- - \`onPress\`: () => void - Press handler
15
- - \`disabled\`: boolean - Disabled state
16
- `,
17
- features: [
18
- "Three variants: filled, outlined, soft",
19
- "Five intent colors",
20
- "Icon support",
21
- "Deletable with onDelete handler",
22
- "Selectable with selected state",
23
- "Three sizes",
24
- "Disabled state",
25
- ],
26
- bestPractices: [
27
- "Use for tags, filters, and multi-select options",
28
- "Use deletable chips for removable tags",
29
- "Use selectable chips for filter options",
30
- "Keep chip labels concise",
31
- ],
32
- usage: `
33
- import { Chip } from '@idealyst/components';
34
-
35
- <Chip
36
- label="React"
37
- icon="check"
38
- deletable
39
- onDelete={() => removeTag('React')}
40
- />
41
- `,
42
- examples: {
43
- basic: `import { Chip } from '@idealyst/components';
44
-
45
- <Chip label="Tag" />`,
46
- variants: `import { Chip } from '@idealyst/components';
47
-
48
- <Chip label="Filled" variant="filled" intent="primary" />
49
- <Chip label="Outlined" variant="outlined" intent="success" />
50
- <Chip label="Soft" variant="soft" intent="warning" />`,
51
- "with-icons": `import { Chip } from '@idealyst/components';
52
-
53
- <Chip label="Star" icon="star" />
54
- <Chip label="Heart" icon="heart" intent="error" />`,
55
- interactive: `import { Chip, View } from '@idealyst/components';
56
- import { useState } from 'react';
57
-
58
- function Example() {
59
- const [tags, setTags] = useState(['React', 'TypeScript', 'Node.js']);
60
-
61
- return (
62
- <View spacing="sm">
63
- {tags.map(tag => (
64
- <Chip
65
- key={tag}
66
- label={tag}
67
- deletable
68
- onDelete={() => setTags(tags.filter(t => t !== tag))}
69
- />
70
- ))}
71
- </View>
72
- );
73
- }`,
74
- }
75
- };
76
- //# sourceMappingURL=Chip.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../../src/data/components/Chip.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,IAAI,GAAG;IACpB,QAAQ,EAAE,SAAS;IACf,WAAW,EAAE,+EAA+E;IAC5F,KAAK,EAAE;;;;;;;;;;;;CAYV;IACG,QAAQ,EAAE;QACR,wCAAwC;QACxC,oBAAoB;QACpB,cAAc;QACd,iCAAiC;QACjC,gCAAgC;QAChC,aAAa;QACb,gBAAgB;KACjB;IACD,aAAa,EAAE;QACb,iDAAiD;QACjD,wCAAwC;QACxC,yCAAyC;QACzC,0BAA0B;KAC3B;IACD,KAAK,EAAE;;;;;;;;;CASV;IACG,QAAQ,EAAE;QACR,KAAK,EAAE;;qBAEQ;QACf,QAAQ,EAAE;;;;sDAIsC;QAChD,YAAY,EAAE;;;mDAG+B;QAC7C,WAAW,EAAE;;;;;;;;;;;;;;;;;;EAkBjB;KACG;CACJ,CAAC"}
@@ -1,15 +0,0 @@
1
- export declare const Dialog: {
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=Dialog.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/data/components/Dialog.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,MAAM;;;;;;;;;;;;;CAuIlB,CAAC"}