@ecohouse/ui 0.1.5 → 0.1.7

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 (57) hide show
  1. package/README.md +34 -3
  2. package/dist/index.cjs +946 -102
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.d.cts +349 -157
  5. package/dist/index.d.ts +349 -157
  6. package/dist/index.js +930 -104
  7. package/dist/index.js.map +1 -1
  8. package/package.json +1 -1
  9. package/src/components/Badge/Badge.stories.tsx +52 -0
  10. package/src/components/Badge/Badge.tsx +131 -0
  11. package/src/components/Badge/index.ts +2 -0
  12. package/src/components/CommentCard/CommentCard.stories.tsx +31 -0
  13. package/src/components/CommentCard/CommentCard.tsx +209 -0
  14. package/src/components/CommentCard/index.ts +2 -0
  15. package/src/components/Counter/Counter.stories.tsx +46 -0
  16. package/src/components/Counter/Counter.tsx +135 -0
  17. package/src/components/Counter/index.ts +2 -0
  18. package/src/components/RatingInput/RatingInput.stories.tsx +41 -0
  19. package/src/components/RatingInput/RatingInput.tsx +168 -0
  20. package/src/components/RatingInput/index.ts +2 -0
  21. package/src/components/SegmentedToggle/SegmentedToggle.stories.tsx +63 -0
  22. package/src/components/SegmentedToggle/SegmentedToggle.tsx +221 -0
  23. package/src/components/SegmentedToggle/index.ts +2 -0
  24. package/src/components/StatCard/StatCard.stories.tsx +20 -0
  25. package/src/components/StatCard/StatCard.tsx +61 -0
  26. package/src/components/StatCard/index.ts +2 -0
  27. package/src/components/index.ts +18 -0
  28. package/src/icons/Minus/MinusIcon.tsx +20 -0
  29. package/src/icons/Minus/MinusIcon.web.tsx +19 -0
  30. package/src/icons/Minus/index.ts +1 -0
  31. package/src/icons/Minus/minusPath.ts +1 -0
  32. package/src/icons/Plus/PlusIcon.tsx +20 -0
  33. package/src/icons/Plus/PlusIcon.web.tsx +19 -0
  34. package/src/icons/Plus/index.ts +1 -0
  35. package/src/icons/Plus/plusPath.ts +1 -0
  36. package/src/icons/Sidebar/SidebarIcon.tsx +21 -0
  37. package/src/icons/Sidebar/SidebarIcon.web.tsx +27 -0
  38. package/src/icons/Sidebar/index.ts +1 -0
  39. package/src/icons/Sidebar/sidebarPath.ts +3 -0
  40. package/src/icons/Star/StarIcon.tsx +35 -0
  41. package/src/icons/Star/StarIcon.web.tsx +41 -0
  42. package/src/icons/Star/index.ts +2 -0
  43. package/src/icons/Star/starPath.ts +3 -0
  44. package/src/icons/StarFilled/StarFilledIcon.tsx +28 -0
  45. package/src/icons/StarFilled/StarFilledIcon.web.tsx +34 -0
  46. package/src/icons/StarFilled/index.ts +1 -0
  47. package/src/icons/UsersAlt/UsersAltIcon.tsx +14 -0
  48. package/src/icons/UsersAlt/UsersAltIcon.web.tsx +13 -0
  49. package/src/icons/UsersAlt/index.ts +1 -0
  50. package/src/icons/UsersAlt/usersAltPath.ts +2 -0
  51. package/src/icons/index.ts +7 -0
  52. package/src/icons/registry.ts +18 -2
  53. package/src/index.ts +34 -1
  54. package/src/theme/colors.test.ts +6 -0
  55. package/src/theme/colors.ts +6 -0
  56. package/src/theme/index.ts +6 -0
  57. package/src/theme/typography.ts +77 -0
package/dist/index.d.cts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react from 'react';
2
2
  import { ReactNode, ComponentType } from 'react';
3
3
  import * as react_native from 'react-native';
4
- import { PressableProps, GestureResponderEvent, StyleProp, ViewStyle, TextStyle, View, TouchableOpacityProps, ViewProps, TextInputProps, TextInput } from 'react-native';
4
+ import { PressableProps, GestureResponderEvent, StyleProp, ViewStyle, TextStyle, View, ViewProps, TouchableOpacityProps, TextInputProps, TextInput } from 'react-native';
5
5
 
6
6
  interface MenuItemProps extends Omit<PressableProps, "onPress" | "disabled" | "style" | "children" | "hitSlop"> {
7
7
  /** Leading icon, e.g. `<CalendarIcon size={16} />` — pass it pre-colored. */
@@ -57,6 +57,244 @@ interface AvatarProps extends Omit<PressableProps, "onPress" | "disabled" | "sty
57
57
  }
58
58
  declare const Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAttributes<View>>;
59
59
 
60
+ interface IconProps {
61
+ size?: number;
62
+ color?: string;
63
+ strokeWidth?: number;
64
+ }
65
+ type IconComponent = ComponentType<IconProps>;
66
+
67
+ interface ArrowRightIconProps {
68
+ size?: number;
69
+ color?: string;
70
+ strokeWidth?: number;
71
+ }
72
+ /** Native — react-native-svg (peer dependency). */
73
+ declare function ArrowRightIcon({ size, color, strokeWidth, }: ArrowRightIconProps): react.JSX.Element;
74
+
75
+ declare function BagIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
76
+
77
+ declare function BellIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
78
+
79
+ declare function BuildingIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
80
+
81
+ /** Native — react-native-svg (peer dependency). */
82
+ declare function CalendarIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
83
+
84
+ /** Native — react-native-svg (peer dependency). */
85
+ declare function CalendarOutlineIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
86
+
87
+ declare function CameraIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
88
+
89
+ interface CheckIconProps {
90
+ size?: number;
91
+ color?: string;
92
+ strokeWidth?: number;
93
+ }
94
+ /** Native — react-native-svg (peer dependency). */
95
+ declare function CheckIcon({ size, color, strokeWidth }: CheckIconProps): react.JSX.Element;
96
+
97
+ declare function CheckBadgeIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
98
+
99
+ interface ChevronDownIconProps {
100
+ size?: number;
101
+ color?: string;
102
+ strokeWidth?: number;
103
+ }
104
+ /** Native — react-native-svg (peer dependency). */
105
+ declare function ChevronDownIcon({ size, color, strokeWidth, }: ChevronDownIconProps): react.JSX.Element;
106
+
107
+ /** Native — react-native-svg (peer dependency). */
108
+ declare function ChevronLeftIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
109
+
110
+ declare function ClockIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
111
+
112
+ declare function FacebookIcon({ size, color }: IconProps): react.JSX.Element;
113
+
114
+ /** Native — react-native-svg (peer dependency). */
115
+ declare function HeartIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
116
+
117
+ /** Native — react-native-svg (peer dependency). */
118
+ declare function HelpCircleIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
119
+
120
+ declare function HomeIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
121
+
122
+ declare function InstagramIcon({ size, color }: IconProps): react.JSX.Element;
123
+
124
+ declare function KeyIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
125
+
126
+ /** Native — react-native-svg (peer dependency). */
127
+ declare function LayoutGridIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
128
+
129
+ declare function LinkedInIcon({ size, color }: IconProps): react.JSX.Element;
130
+
131
+ /** Native — react-native-svg (peer dependency). */
132
+ declare function LogOutIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
133
+
134
+ declare function MailIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
135
+
136
+ declare function MinusIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
137
+
138
+ declare function NavigateIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
139
+
140
+ declare function PhoneIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
141
+
142
+ declare function PlusIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
143
+
144
+ interface SearchIconProps {
145
+ size?: number;
146
+ color?: string;
147
+ strokeWidth?: number;
148
+ }
149
+ /** Native — react-native-svg (peer dependency). */
150
+ declare function SearchIcon({ size, color, strokeWidth, }: SearchIconProps): react.JSX.Element;
151
+
152
+ /** Native — react-native-svg (peer dependency). */
153
+ declare function SettingsIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
154
+
155
+ interface ShowIconProps {
156
+ size?: number;
157
+ color?: string;
158
+ strokeWidth?: number;
159
+ }
160
+ /** Native — react-native-svg (peer dependency). */
161
+ declare function ShowIcon({ size, color, strokeWidth }: ShowIconProps): react.JSX.Element;
162
+
163
+ /** Native — react-native-svg (peer dependency). */
164
+ declare function SidebarIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
165
+
166
+ interface StarIconProps extends IconProps {
167
+ active?: boolean;
168
+ height?: number;
169
+ }
170
+ /** Native — active is solid orange; inactive is a grey outline. */
171
+ declare function StarIcon({ active, size, height, color, strokeWidth, }: StarIconProps): react.JSX.Element;
172
+
173
+ interface StarFilledIconProps extends IconProps {
174
+ height?: number;
175
+ }
176
+ /** Native — supplied solid orange 28×26 star icon. */
177
+ declare function StarFilledIcon({ size, height, color, strokeWidth, }: StarFilledIconProps): react.JSX.Element;
178
+
179
+ interface UserIconProps {
180
+ size?: number;
181
+ color?: string;
182
+ strokeWidth?: number;
183
+ }
184
+ /** Native — react-native-svg (peer dependency). */
185
+ declare function UserIcon({ size, color, strokeWidth }: UserIconProps): react.JSX.Element;
186
+
187
+ declare function UsersAltIcon({ size, color }: IconProps): react.JSX.Element;
188
+
189
+ /** Native — react-native-svg (peer dependency). */
190
+ declare function VideoIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
191
+
192
+ declare const icons: {
193
+ readonly arrowRight: typeof ArrowRightIcon;
194
+ readonly bag: typeof BagIcon;
195
+ readonly bell: typeof BellIcon;
196
+ readonly building: typeof BuildingIcon;
197
+ readonly calendar: typeof CalendarIcon;
198
+ readonly calendarOutline: typeof CalendarOutlineIcon;
199
+ readonly camera: typeof CameraIcon;
200
+ readonly check: typeof CheckIcon;
201
+ readonly checkBadge: typeof CheckBadgeIcon;
202
+ readonly chevronDown: typeof ChevronDownIcon;
203
+ readonly chevronLeft: typeof ChevronLeftIcon;
204
+ readonly clock: typeof ClockIcon;
205
+ readonly facebook: typeof FacebookIcon;
206
+ readonly heart: typeof HeartIcon;
207
+ readonly helpCircle: typeof HelpCircleIcon;
208
+ readonly home: typeof HomeIcon;
209
+ readonly instagram: typeof InstagramIcon;
210
+ readonly key: typeof KeyIcon;
211
+ readonly layoutGrid: typeof LayoutGridIcon;
212
+ readonly linkedin: typeof LinkedInIcon;
213
+ readonly logOut: typeof LogOutIcon;
214
+ readonly mail: typeof MailIcon;
215
+ readonly minus: typeof MinusIcon;
216
+ readonly navigate: typeof NavigateIcon;
217
+ readonly phone: typeof PhoneIcon;
218
+ readonly plus: typeof PlusIcon;
219
+ readonly search: typeof SearchIcon;
220
+ readonly settings: typeof SettingsIcon;
221
+ readonly show: typeof ShowIcon;
222
+ readonly sidebar: typeof SidebarIcon;
223
+ readonly star: typeof StarIcon;
224
+ readonly starFilled: typeof StarFilledIcon;
225
+ readonly user: typeof UserIcon;
226
+ readonly usersAlt: typeof UsersAltIcon;
227
+ readonly video: typeof VideoIcon;
228
+ };
229
+ type IconName = keyof typeof icons;
230
+ declare const iconNames: IconName[];
231
+ declare const iconGroups: {
232
+ readonly navigation: readonly ["arrowRight", "chevronDown", "chevronLeft", "home", "navigate"];
233
+ readonly actions: readonly ["show", "bell", "camera", "key", "check", "checkBadge", "search", "calendar", "calendarOutline", "heart", "star", "starFilled", "minus", "plus"];
234
+ readonly objects: readonly ["bag", "building", "clock", "user", "usersAlt", "video"];
235
+ readonly communication: readonly ["mail", "phone"];
236
+ readonly social: readonly ["facebook", "instagram", "linkedin"];
237
+ readonly interface: readonly ["layoutGrid", "sidebar", "settings", "helpCircle", "logOut"];
238
+ };
239
+ type IconGroup = keyof typeof iconGroups;
240
+ declare const iconGroupNames: IconGroup[];
241
+ declare function getIconsByGroup(group: IconGroup): IconName[];
242
+
243
+ interface IconByNameProps extends IconProps {
244
+ name: IconName;
245
+ }
246
+ declare function Icon({ name, ...props }: IconByNameProps): react.JSX.Element;
247
+
248
+ type BadgeVariant = "default" | "transparent";
249
+ interface BadgeProps extends Omit<ViewProps, "style" | "children"> {
250
+ label: string;
251
+ variant?: BadgeVariant;
252
+ icon?: IconComponent;
253
+ style?: StyleProp<ViewStyle>;
254
+ className?: string;
255
+ }
256
+ declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<View>>;
257
+
258
+ interface CounterProps extends Omit<ViewProps, "style" | "children"> {
259
+ value?: number;
260
+ defaultValue?: number;
261
+ onValueChange?: (value: number) => void;
262
+ min?: number;
263
+ max?: number;
264
+ step?: number;
265
+ disabled?: boolean;
266
+ style?: StyleProp<ViewStyle>;
267
+ className?: string;
268
+ hitSlop?: PressableProps["hitSlop"];
269
+ }
270
+ declare const Counter: react.ForwardRefExoticComponent<CounterProps & react.RefAttributes<View>>;
271
+
272
+ interface SegmentedToggleOption {
273
+ value: string;
274
+ label: string;
275
+ icon?: IconComponent;
276
+ }
277
+ interface SegmentedToggleProps extends Omit<ViewProps, "style" | "children"> {
278
+ options: readonly [SegmentedToggleOption, SegmentedToggleOption];
279
+ value?: string;
280
+ defaultValue?: string;
281
+ onValueChange?: (value: string) => void;
282
+ fullWidth?: boolean;
283
+ disabled?: boolean;
284
+ style?: StyleProp<ViewStyle>;
285
+ className?: string;
286
+ hitSlop?: PressableProps["hitSlop"];
287
+ }
288
+ declare const SegmentedToggle: react.ForwardRefExoticComponent<SegmentedToggleProps & react.RefAttributes<View>>;
289
+
290
+ interface StatCardProps extends Omit<ViewProps, "style" | "children"> {
291
+ label: string;
292
+ icon: IconComponent;
293
+ style?: StyleProp<ViewStyle>;
294
+ className?: string;
295
+ }
296
+ declare const StatCard: react.ForwardRefExoticComponent<StatCardProps & react.RefAttributes<View>>;
297
+
60
298
  type ButtonVariant = "primary" | "secondary";
61
299
  type ButtonSize = "lg" | "sm";
62
300
  interface ButtonProps extends Omit<TouchableOpacityProps, "onPress" | "disabled" | "style" | "children"> {
@@ -244,165 +482,42 @@ interface ToggleProps extends Omit<PressableProps, "onPress" | "disabled" | "sty
244
482
  }
245
483
  declare const Toggle: react.ForwardRefExoticComponent<ToggleProps & react.RefAttributes<react_native.View>>;
246
484
 
247
- interface IconProps {
248
- size?: number;
249
- color?: string;
250
- strokeWidth?: number;
251
- }
252
- type IconComponent = ComponentType<IconProps>;
253
-
254
- interface ArrowRightIconProps {
255
- size?: number;
256
- color?: string;
257
- strokeWidth?: number;
258
- }
259
- /** Native — react-native-svg (peer dependency). */
260
- declare function ArrowRightIcon({ size, color, strokeWidth, }: ArrowRightIconProps): react.JSX.Element;
261
-
262
- declare function BagIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
263
-
264
- declare function BellIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
265
-
266
- declare function BuildingIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
267
-
268
- /** Native — react-native-svg (peer dependency). */
269
- declare function CalendarIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
270
-
271
- /** Native — react-native-svg (peer dependency). */
272
- declare function CalendarOutlineIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
273
-
274
- declare function CameraIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
275
-
276
- interface CheckIconProps {
277
- size?: number;
278
- color?: string;
279
- strokeWidth?: number;
280
- }
281
- /** Native — react-native-svg (peer dependency). */
282
- declare function CheckIcon({ size, color, strokeWidth }: CheckIconProps): react.JSX.Element;
283
-
284
- declare function CheckBadgeIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
285
-
286
- interface ChevronDownIconProps {
287
- size?: number;
288
- color?: string;
289
- strokeWidth?: number;
290
- }
291
- /** Native — react-native-svg (peer dependency). */
292
- declare function ChevronDownIcon({ size, color, strokeWidth, }: ChevronDownIconProps): react.JSX.Element;
293
-
294
- /** Native — react-native-svg (peer dependency). */
295
- declare function ChevronLeftIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
296
-
297
- declare function ClockIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
298
-
299
- declare function FacebookIcon({ size, color }: IconProps): react.JSX.Element;
300
-
301
- /** Native — react-native-svg (peer dependency). */
302
- declare function HeartIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
303
-
304
- /** Native — react-native-svg (peer dependency). */
305
- declare function HelpCircleIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
306
-
307
- declare function HomeIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
308
-
309
- declare function InstagramIcon({ size, color }: IconProps): react.JSX.Element;
310
-
311
- declare function KeyIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
312
-
313
- /** Native — react-native-svg (peer dependency). */
314
- declare function LayoutGridIcon({ size, color, strokeWidth, }: IconProps): react.JSX.Element;
315
-
316
- declare function LinkedInIcon({ size, color }: IconProps): react.JSX.Element;
317
-
318
- /** Native — react-native-svg (peer dependency). */
319
- declare function LogOutIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
320
-
321
- declare function MailIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
322
-
323
- declare function NavigateIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
324
-
325
- declare function PhoneIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
326
-
327
- interface SearchIconProps {
328
- size?: number;
329
- color?: string;
330
- strokeWidth?: number;
331
- }
332
- /** Native — react-native-svg (peer dependency). */
333
- declare function SearchIcon({ size, color, strokeWidth, }: SearchIconProps): react.JSX.Element;
334
-
335
- /** Native — react-native-svg (peer dependency). */
336
- declare function SettingsIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
337
-
338
- interface ShowIconProps {
339
- size?: number;
340
- color?: string;
341
- strokeWidth?: number;
342
- }
343
- /** Native — react-native-svg (peer dependency). */
344
- declare function ShowIcon({ size, color, strokeWidth }: ShowIconProps): react.JSX.Element;
345
-
346
- interface UserIconProps {
485
+ interface RatingInputProps extends Omit<ViewProps, "style" | "children"> {
486
+ value?: number;
487
+ defaultValue?: number;
488
+ onValueChange?: (value: number) => void;
489
+ showValue?: boolean;
490
+ precision?: number;
491
+ /** Star item size. Glyph dimensions and default spacing scale with it. */
347
492
  size?: number;
348
- color?: string;
349
- strokeWidth?: number;
493
+ /** Overrides the proportional spacing between star items. */
494
+ starGap?: number;
495
+ readOnly?: boolean;
496
+ disabled?: boolean;
497
+ style?: StyleProp<ViewStyle>;
498
+ valueStyle?: StyleProp<TextStyle>;
499
+ className?: string;
500
+ hitSlop?: PressableProps["hitSlop"];
501
+ accessibilityLabel?: string;
350
502
  }
351
- /** Native react-native-svg (peer dependency). */
352
- declare function UserIcon({ size, color, strokeWidth }: UserIconProps): react.JSX.Element;
353
-
354
- /** Native — react-native-svg (peer dependency). */
355
- declare function VideoIcon({ size, color, strokeWidth }: IconProps): react.JSX.Element;
503
+ declare const RatingInput: react.ForwardRefExoticComponent<RatingInputProps & react.RefAttributes<View>>;
356
504
 
357
- declare const icons: {
358
- readonly arrowRight: typeof ArrowRightIcon;
359
- readonly bag: typeof BagIcon;
360
- readonly bell: typeof BellIcon;
361
- readonly building: typeof BuildingIcon;
362
- readonly calendar: typeof CalendarIcon;
363
- readonly calendarOutline: typeof CalendarOutlineIcon;
364
- readonly camera: typeof CameraIcon;
365
- readonly check: typeof CheckIcon;
366
- readonly checkBadge: typeof CheckBadgeIcon;
367
- readonly chevronDown: typeof ChevronDownIcon;
368
- readonly chevronLeft: typeof ChevronLeftIcon;
369
- readonly clock: typeof ClockIcon;
370
- readonly facebook: typeof FacebookIcon;
371
- readonly heart: typeof HeartIcon;
372
- readonly helpCircle: typeof HelpCircleIcon;
373
- readonly home: typeof HomeIcon;
374
- readonly instagram: typeof InstagramIcon;
375
- readonly key: typeof KeyIcon;
376
- readonly layoutGrid: typeof LayoutGridIcon;
377
- readonly linkedin: typeof LinkedInIcon;
378
- readonly logOut: typeof LogOutIcon;
379
- readonly mail: typeof MailIcon;
380
- readonly navigate: typeof NavigateIcon;
381
- readonly phone: typeof PhoneIcon;
382
- readonly search: typeof SearchIcon;
383
- readonly settings: typeof SettingsIcon;
384
- readonly show: typeof ShowIcon;
385
- readonly user: typeof UserIcon;
386
- readonly video: typeof VideoIcon;
387
- };
388
- type IconName = keyof typeof icons;
389
- declare const iconNames: IconName[];
390
- declare const iconGroups: {
391
- readonly navigation: readonly ["arrowRight", "chevronDown", "chevronLeft", "home", "navigate"];
392
- readonly actions: readonly ["show", "bell", "camera", "key", "check", "checkBadge", "search", "calendar", "calendarOutline", "heart"];
393
- readonly objects: readonly ["bag", "building", "clock", "user", "video"];
394
- readonly communication: readonly ["mail", "phone"];
395
- readonly social: readonly ["facebook", "instagram", "linkedin"];
396
- readonly interface: readonly ["layoutGrid", "settings", "helpCircle", "logOut"];
397
- };
398
- type IconGroup = keyof typeof iconGroups;
399
- declare const iconGroupNames: IconGroup[];
400
- declare function getIconsByGroup(group: IconGroup): IconName[];
401
-
402
- interface IconByNameProps extends IconProps {
403
- name: IconName;
505
+ interface CommentCardProps extends Omit<ViewProps, "style" | "children"> {
506
+ userName: string;
507
+ date: string;
508
+ commentText: string;
509
+ rating: number;
510
+ imageUrl?: string | null;
511
+ maxCommentLines?: number;
512
+ maxCommentLength?: number;
513
+ readMoreLabel?: string;
514
+ readLessLabel?: string;
515
+ onExpandedChange?: (expanded: boolean) => void;
516
+ style?: StyleProp<ViewStyle>;
517
+ commentStyle?: StyleProp<TextStyle>;
518
+ className?: string;
404
519
  }
405
- declare function Icon({ name, ...props }: IconByNameProps): react.JSX.Element;
520
+ declare const CommentCard: react.ForwardRefExoticComponent<CommentCardProps & react.RefAttributes<View>>;
406
521
 
407
522
  declare const grey: {
408
523
  readonly "0": "#767676";
@@ -426,9 +541,15 @@ declare const colors: {
426
541
  readonly primary: "#B46436";
427
542
  readonly black: "#000000";
428
543
  readonly white: "#ffffff";
544
+ readonly whiteAlpha86: "#FFFFFFDB";
545
+ readonly whiteAlpha40: "#FFFFFF66";
546
+ readonly whiteAlpha20: "#FFFFFF33";
547
+ readonly whiteAlpha10: "#FFFFFF1A";
548
+ readonly whiteAlpha5: "#FFFFFF0D";
429
549
  readonly dark: "#090909";
430
550
  readonly red: "#A63E3E";
431
551
  readonly lightGrey: "#B7B7B7";
552
+ readonly green: "#34A853";
432
553
  readonly primaryMuted: "#B464360F";
433
554
  readonly primaryHover: "#B4643633";
434
555
  readonly redMuted: "#A63E3E0F";
@@ -470,6 +591,77 @@ declare const buttonTypography: {
470
591
  readonly letterSpacing: 0.36;
471
592
  };
472
593
  };
594
+ /** Badge label — Regular 14, line-height 112%, letter-spacing 0. */
595
+ declare const badgeTypography: {
596
+ readonly fontFamily: "Noto Sans Armenian";
597
+ readonly fontSize: 14;
598
+ readonly fontWeight: "400";
599
+ readonly lineHeight: 16;
600
+ readonly letterSpacing: 0;
601
+ };
602
+ /** Stat card label — Medium 16, line-height 100%, letter-spacing 0. */
603
+ declare const statCardTypography: {
604
+ readonly fontFamily: "Noto Sans Armenian";
605
+ readonly fontSize: 16;
606
+ readonly fontWeight: "500";
607
+ readonly lineHeight: 16;
608
+ readonly letterSpacing: 0;
609
+ };
610
+ /** Segmented toggle label — Medium 14, line-height 100%, letter-spacing 0. */
611
+ declare const segmentedToggleTypography: {
612
+ readonly fontFamily: "Noto Sans Armenian";
613
+ readonly fontSize: 14;
614
+ readonly fontWeight: "500";
615
+ readonly lineHeight: 14;
616
+ readonly letterSpacing: 0;
617
+ };
618
+ /** Counter value — Bold 14, line-height 100%, letter-spacing 0. */
619
+ declare const counterTypography: {
620
+ readonly fontFamily: "Noto Sans Armenian";
621
+ readonly fontSize: 14;
622
+ readonly fontWeight: "700";
623
+ readonly lineHeight: 14;
624
+ readonly letterSpacing: 0;
625
+ };
626
+ /** Rating score — Bold 32, line-height 112%, letter-spacing 0. */
627
+ declare const ratingTypography: {
628
+ readonly fontFamily: "Noto Sans Armenian";
629
+ readonly fontSize: 32;
630
+ readonly fontWeight: "700";
631
+ readonly lineHeight: 35.84;
632
+ readonly letterSpacing: 0;
633
+ };
634
+ /** Comment card identity, body, and action typography. */
635
+ declare const commentCardTypography: {
636
+ readonly name: {
637
+ readonly fontFamily: "Noto Sans Armenian";
638
+ readonly fontSize: 16;
639
+ readonly fontWeight: "600";
640
+ readonly lineHeight: 18;
641
+ readonly letterSpacing: 0;
642
+ };
643
+ readonly date: {
644
+ readonly fontFamily: "Noto Sans Armenian";
645
+ readonly fontSize: 14;
646
+ readonly fontWeight: "400";
647
+ readonly lineHeight: 16;
648
+ readonly letterSpacing: 0;
649
+ };
650
+ readonly comment: {
651
+ readonly fontFamily: "Noto Sans Armenian";
652
+ readonly fontSize: 14;
653
+ readonly fontWeight: "400";
654
+ readonly lineHeight: 19;
655
+ readonly letterSpacing: 0;
656
+ };
657
+ readonly action: {
658
+ readonly fontFamily: "Noto Sans Armenian";
659
+ readonly fontSize: 12;
660
+ readonly fontWeight: "700";
661
+ readonly lineHeight: 12;
662
+ readonly letterSpacing: 0;
663
+ };
664
+ };
473
665
  /** Input label / field / hint typography. */
474
666
  declare const inputTypography: {
475
667
  readonly label: {
@@ -606,4 +798,4 @@ declare const textareaTypography: {
606
798
  };
607
799
  };
608
800
 
609
- export { ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, BagIcon, BellIcon, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CheckBadgeIcon, CheckIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockIcon, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, type GreyStep, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputProps, type InputSize, InstagramIcon, KeyIcon, LayoutGridIcon, LinkedInIcon, LogOutIcon, MailIcon, MenuItem, type MenuItemProps, NavigateIcon, PhoneIcon, SearchIcon, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShowIcon, Textarea, type TextareaProps, Toggle, type ToggleProps, UserIcon, VideoIcon, avatarTypography, buttonTypography, colors, datePickerTypography, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, selectTypography, textareaTypography };
801
+ export { ArrowRightIcon, Avatar, type AvatarMenuItem, type AvatarProps, Badge, type BadgeProps, type BadgeVariant, BagIcon, BellIcon, BuildingIcon, Button, type ButtonProps, type ButtonSize, type ButtonVariant, CalendarIcon, CalendarOutlineIcon, CameraIcon, CheckBadgeIcon, CheckIcon, Checkbox, type CheckboxProps, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ClockIcon, CommentCard, type CommentCardProps, Counter, type CounterProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, FacebookIcon, type GreyStep, HeartIcon, HelpCircleIcon, HomeIcon, Icon, type IconByNameProps, type IconComponent, type IconGroup, type IconName, type IconProps, Input, type InputProps, type InputSize, InstagramIcon, KeyIcon, LayoutGridIcon, LinkedInIcon, LogOutIcon, MailIcon, MenuItem, type MenuItemProps, MinusIcon, NavigateIcon, PhoneIcon, PlusIcon, RatingInput, type RatingInputProps, SearchIcon, SegmentedToggle, type SegmentedToggleOption, type SegmentedToggleProps, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectSingleProps, SettingsIcon, ShowIcon, SidebarIcon, StarFilledIcon, StarIcon, type StarIconProps, StatCard, type StatCardProps, Textarea, type TextareaProps, Toggle, type ToggleProps, UserIcon, UsersAltIcon, VideoIcon, avatarTypography, badgeTypography, buttonTypography, colors, commentCardTypography, counterTypography, datePickerTypography, fonts, getIconsByGroup, grey, iconGroupNames, iconGroups, iconNames, icons, inputTypography, ratingTypography, segmentedToggleTypography, selectTypography, statCardTypography, textareaTypography };