@tactics/toddle-styleguide 1.2.7 → 1.2.9

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 (89) hide show
  1. package/App.tsx +5 -0
  2. package/index.d.ts +3 -1
  3. package/index.tsx +50 -46
  4. package/package.json +1 -1
  5. package/src/components/atoms/calendar/__snapshots__/calendar.test.js.snap +628 -1810
  6. package/src/components/atoms/quick-message/__snapshots__/quick-message.test.js.snap +72 -1
  7. package/src/components/atoms/quick-message/quick-message.component.d.ts +2 -1
  8. package/src/components/atoms/quick-message/quick-message.component.tsx +3 -1
  9. package/src/components/atoms/quick-message/quick-message.preview.tsx +10 -1
  10. package/src/components/atoms/quick-message/quick-message.styles.d.ts +1 -1
  11. package/src/components/atoms/quick-message/quick-message.styles.js +4 -2
  12. package/src/components/atoms/quick-message/quick-message.test.js +38 -6
  13. package/src/components/atoms/text-input/text-input.component.tsx +6 -9
  14. package/src/components/atoms/text-input/text-input.preview.tsx +3 -3
  15. package/src/components/atoms/text-input/text-input.styles.d.ts +20 -44
  16. package/src/components/atoms/text-input/text-input.styles.js +7 -13
  17. package/src/components/molecules/button/button.styles.d.ts +17 -13
  18. package/src/components/molecules/day/day.component.tsx +17 -4
  19. package/src/components/molecules/day/day.styles.d.ts +27 -44
  20. package/src/components/molecules/day/day.styles.js +14 -17
  21. package/src/components/molecules/filter-tab/filter-tab.component.d.ts +3 -2
  22. package/src/components/molecules/filter-tab/filter-tab.component.tsx +9 -5
  23. package/src/components/molecules/filter-tab/filter-tab.preview.tsx +2 -2
  24. package/src/components/molecules/filter-tab/filter-tab.test.js +2 -2
  25. package/src/components/molecules/password-input/password-input.component.tsx +7 -9
  26. package/src/components/molecules/password-input/password-input.styles.d.ts +27 -26
  27. package/src/components/molecules/password-input/password-input.styles.js +6 -6
  28. package/src/components/molecules/search-input/__snapshots__/search.test.js.snap +23 -13
  29. package/src/components/molecules/search-input/search.component.d.ts +7 -8
  30. package/src/components/molecules/search-input/search.component.tsx +19 -30
  31. package/src/components/molecules/search-input/search.preview.tsx +8 -6
  32. package/src/components/molecules/search-input/search.styles.d.ts +31 -30
  33. package/src/components/molecules/search-input/search.styles.js +14 -8
  34. package/src/components/molecules/search-input/search.test.js +3 -1
  35. package/src/components/molecules/send-bubble/send-text-bubble.component.tsx +1 -5
  36. package/src/components/molecules/send-bubble/send-text-bubble.styles.d.ts +58 -74
  37. package/src/components/molecules/send-bubble/send-text-bubble.styles.js +2 -8
  38. package/src/components/molecules/timeline/timeline.styles.d.ts +40 -50
  39. package/src/components/molecules/timeline/timeline.styles.js +2 -2
  40. package/src/components/molecules/timestamp/timestamp.component.d.ts +2 -1
  41. package/src/components/molecules/timestamp/timestamp.component.tsx +4 -7
  42. package/src/components/organisms/child-list-item/__snapshots__/child-list-item.test.js.snap +165 -14
  43. package/src/components/organisms/child-list-item/child-list-item.component.d.ts +2 -1
  44. package/src/components/organisms/child-list-item/child-list-item.component.tsx +24 -1
  45. package/src/components/organisms/child-list-item/child-list-item.preview.tsx +12 -0
  46. package/src/components/organisms/child-list-item/child-list-item.styles.d.ts +35 -41
  47. package/src/components/organisms/child-list-item/child-list-item.styles.js +2 -5
  48. package/src/components/organisms/child-list-item/child-list-item.test.js +9 -4
  49. package/src/components/organisms/child-list-item/components/child-list-tag.component.d.ts +6 -0
  50. package/src/components/organisms/child-list-item/components/child-list-tag.component.tsx +28 -0
  51. package/src/components/organisms/child-list-item/components/child-list-tag.styles.d.ts +10 -0
  52. package/src/components/organisms/child-list-item/components/child-list-tag.styles.js +16 -0
  53. package/src/components/organisms/day-select/day-select.preview.tsx +9 -5
  54. package/src/components/organisms/my-child-list-item/__snapshots__/my-child-list-item.test.js.snap +143 -401
  55. package/src/components/organisms/my-child-list-item/my-child-list-item.component.d.ts +4 -5
  56. package/src/components/organisms/my-child-list-item/my-child-list-item.component.tsx +32 -59
  57. package/src/components/organisms/my-child-list-item/my-child-list-item.preview.tsx +37 -24
  58. package/src/components/organisms/my-child-list-item/my-child-list-item.styles.d.ts +32 -28
  59. package/src/components/organisms/my-child-list-item/my-child-list-item.styles.js +16 -12
  60. package/src/components/organisms/my-child-list-item/my-child-list-item.test.js +5 -22
  61. package/src/components/organisms/person-info-card/person-info-card.component.d.ts +2 -1
  62. package/src/components/organisms/person-info-card/person-info-card.component.tsx +3 -0
  63. package/src/components/organisms/tab-view/__snapshots__/tab-view.test.js.snap +421 -0
  64. package/src/components/organisms/tab-view/tab-view.component.d.ts +11 -0
  65. package/src/components/organisms/tab-view/tab-view.component.tsx +48 -0
  66. package/src/components/organisms/tab-view/tab-view.preview.d.ts +1 -0
  67. package/src/components/organisms/tab-view/tab-view.preview.tsx +36 -0
  68. package/src/components/organisms/tab-view/tab-view.styles.d.ts +10 -0
  69. package/src/components/organisms/tab-view/tab-view.styles.js +14 -0
  70. package/src/components/organisms/tab-view/tab-view.test.js +37 -0
  71. package/src/components/organisms/text-bubble/text-bubble.component.d.ts +2 -1
  72. package/src/components/organisms/text-bubble/text-bubble.component.tsx +3 -1
  73. package/src/components/organisms/text-bubble/text-bubble.preview.tsx +8 -4
  74. package/src/components/organisms/text-bubble/text-bubble.styles.d.ts +1 -0
  75. package/src/components/organisms/text-bubble/text-bubble.styles.js +2 -0
  76. package/src/components/templates/modal/components/fade-panel.component.tsx +1 -1
  77. package/src/components/templates/popover/components/modal/modal.component.d.ts +2 -1
  78. package/src/components/templates/popover/components/modal/modal.component.tsx +8 -2
  79. package/src/components/templates/popover/popover.component.d.ts +2 -1
  80. package/src/components/templates/popover/popover.component.tsx +3 -0
  81. package/src/utilities/toddle-datetime/interfaces/toddle-datetime.interface.d.ts +4 -0
  82. package/src/utilities/toddle-datetime/interfaces/toddle-datetime.interface.tsx +6 -0
  83. package/src/utilities/toddle-datetime/toddle-datetime.class.d.ts +10 -2
  84. package/src/utilities/toddle-datetime/toddle-datetime.class.tsx +31 -2
  85. package/src/utilities/toddle-datetime/toddle-datetime.preview.tsx +114 -84
  86. package/src/utilities/toddle-datetime/types/{duration-like.type.d.ts → duration.type.d.ts} +2 -0
  87. package/src/utilities/toddle-datetime/types/{duration-like.type.tsx → duration.type.tsx} +3 -0
  88. package/src/utilities/toddle-datetime/types/toddle-datetime.type.d.ts +1 -0
  89. package/src/utilities/toddle-datetime/types/toddle-datetime.type.tsx +8 -1
package/App.tsx CHANGED
@@ -70,6 +70,7 @@ import {PersonInfoCardPreview} from './src/components/organisms/person-info-card
70
70
  import {TimePickerPreview} from './src/components/molecules/time-picker/time-picker.preview';
71
71
  import {PopOverActionPreview} from './src/components/templates/popover-action/popover-action.preview';
72
72
  import {QuickMessagePreview} from './src/components/atoms/quick-message/quick-message.preview';
73
+ import {TabViewPreview} from './src/components/organisms/tab-view/tab-view.preview';
73
74
 
74
75
  const Stack = createNativeStackNavigator();
75
76
 
@@ -248,6 +249,7 @@ const HomeScreen = ({navigation}: {navigation: any}) => {
248
249
  onPress={() => navigation.push('split-container')}
249
250
  />
250
251
  <ReactBtn title="Swiper" onPress={() => navigation.push('swiper')} />
252
+ <ReactBtn title="Tab View" onPress={() => navigation.push('tab-view')} />
251
253
  <ReactBtn title="Tag" onPress={() => navigation.push('tag')} />
252
254
  <ReactBtn
253
255
  title="Text Bubble"
@@ -428,6 +430,9 @@ function App() {
428
430
  {() => <SplitContainerPreview />}
429
431
  </Stack.Screen>
430
432
  <Stack.Screen name="swiper">{() => <SwipePreview />}</Stack.Screen>
433
+ <Stack.Screen name="tab-view">
434
+ {() => <TabViewPreview />}
435
+ </Stack.Screen>
431
436
  <Stack.Screen name="tag">{() => <TagPreview />}</Stack.Screen>
432
437
  <Stack.Screen name="textBubble">
433
438
  {() => <TextBubblePreview />}
package/index.d.ts CHANGED
@@ -54,6 +54,8 @@ import { BackgroundGradient } from './src/components/atoms/background-gradient/b
54
54
  import { PersonInfoCard } from './src/components/organisms/person-info-card/person-info-card.component';
55
55
  import { TimePicker } from './src/components/molecules/time-picker/time-picker.component';
56
56
  import { PopOverAction } from './src/components/templates/popover-action/popover-action.component';
57
+ import { QuickMessage } from './src/components/atoms/quick-message/quick-message.component';
58
+ import { TabView } from './src/components/organisms/tab-view/tab-view.component';
57
59
  import { BubbleAlignment } from './src/types/bubble-alignment.enum';
58
60
  import { KeyBoardTypes } from './src/types/keyboard-types.enum';
59
61
  import { Size } from './src/types/size.enum';
@@ -63,4 +65,4 @@ import { ToddleDateTime } from './src/utilities/toddle-datetime/toddle-datetime.
63
65
  import { ThemeCtx } from './src/context/theme.context';
64
66
  import { Scale } from './src/theme/scale/index';
65
67
  import CreateResponsiveStyle from './src/theme/responsive/index';
66
- export { Initials, BubbleAlignment, KeyBoardTypes, Size, Scale, CreateResponsiveStyle, VisualState, ThemeCtx, ToddleDateTime, Avatar, Button, CancelLink, Check, Checkbox, ChildListItem, ContactItem, FilterTab, SplitContainer, ImageBubble, Info, Pill, Popover, PressableIcon, QuickFilter, Search, SelectListItem, Snackbar, Tag, TextBubble, TextInput, TimeTracker, WideButton, Icon, Calendar, IncrementInput, Swipe, Logo, DaySelect, BlockedMessage, DepartmentLogo, ContactRole, TimeLine, SelectPicker, CalendarSelect, DateInput, FilterRange, Footer, DefaultSelect, PasswordInput, MessageInput, Heading1, Heading2, Heading3, Heading4, AllCapsHeading, Paragraph, SmallText, TinyText, SelectLink, MyChildListItem, MoreInfoButton, LanguageButton, Modal, LoadingIndicator, WaveBackground, BackgroundGradient, PersonInfoCard, TimePicker, PopOverAction, };
68
+ export { AllCapsHeading, Avatar, BackgroundGradient, BlockedMessage, Button, Calendar, CalendarSelect, CancelLink, Check, Checkbox, ChildListItem, ContactItem, ContactRole, DateInput, DaySelect, DefaultSelect, DepartmentLogo, FilterRange, FilterTab, Footer, Heading1, Heading2, Heading3, Heading4, Icon, ImageBubble, IncrementInput, Info, LanguageButton, LoadingIndicator, Logo, MessageInput, Modal, MoreInfoButton, MyChildListItem, Paragraph, PasswordInput, PersonInfoCard, Pill, Popover, PopOverAction, PressableIcon, QuickFilter, QuickMessage, Search, SelectLink, SelectListItem, SelectPicker, SmallText, Snackbar, SplitContainer, Swipe, TabView, Tag, TextBubble, TextInput, TimeLine, TimePicker, TimeTracker, TinyText, WaveBackground, WideButton, BubbleAlignment, Initials, KeyBoardTypes, Size, ThemeCtx, ToddleDateTime, VisualState, CreateResponsiveStyle, Scale, };
package/index.tsx CHANGED
@@ -72,6 +72,8 @@ import {BackgroundGradient} from './src/components/atoms/background-gradient/bac
72
72
  import {PersonInfoCard} from './src/components/organisms/person-info-card/person-info-card.component';
73
73
  import {TimePicker} from './src/components/molecules/time-picker/time-picker.component';
74
74
  import {PopOverAction} from './src/components/templates/popover-action/popover-action.component';
75
+ import {QuickMessage} from './src/components/atoms/quick-message/quick-message.component';
76
+ import {TabView} from './src/components/organisms/tab-view/tab-view.component';
75
77
 
76
78
  // Exports of enums
77
79
  import {BubbleAlignment} from './src/types/bubble-alignment.enum';
@@ -95,73 +97,75 @@ import {Scale} from './src/theme/scale/index';
95
97
  import CreateResponsiveStyle from './src/theme/responsive/index';
96
98
 
97
99
  export {
98
- Initials,
99
- BubbleAlignment,
100
- KeyBoardTypes,
101
- Size,
102
- Scale,
103
- CreateResponsiveStyle,
104
- VisualState,
105
- ThemeCtx,
106
- ToddleDateTime,
100
+ AllCapsHeading,
107
101
  Avatar,
102
+ BackgroundGradient,
103
+ BlockedMessage,
108
104
  Button,
105
+ Calendar,
106
+ CalendarSelect,
109
107
  CancelLink,
110
108
  Check,
111
109
  Checkbox,
112
110
  ChildListItem,
113
111
  ContactItem,
112
+ ContactRole,
113
+ DateInput,
114
+ DaySelect,
115
+ DefaultSelect,
116
+ DepartmentLogo,
117
+ FilterRange,
114
118
  FilterTab,
115
- SplitContainer,
119
+ Footer,
120
+ Heading1,
121
+ Heading2,
122
+ Heading3,
123
+ Heading4,
124
+ Icon,
116
125
  ImageBubble,
126
+ IncrementInput,
117
127
  Info,
128
+ LanguageButton,
129
+ LoadingIndicator,
130
+ Logo,
131
+ MessageInput,
132
+ Modal,
133
+ MoreInfoButton,
134
+ MyChildListItem,
135
+ Paragraph,
136
+ PasswordInput,
137
+ PersonInfoCard,
118
138
  Pill,
119
139
  Popover,
140
+ PopOverAction,
120
141
  PressableIcon,
121
142
  QuickFilter,
143
+ QuickMessage,
122
144
  Search,
145
+ SelectLink,
123
146
  SelectListItem,
147
+ SelectPicker,
148
+ SmallText,
124
149
  Snackbar,
150
+ SplitContainer,
151
+ Swipe,
152
+ TabView,
125
153
  Tag,
126
154
  TextBubble,
127
155
  TextInput,
128
- TimeTracker,
129
- WideButton,
130
- Icon,
131
- Calendar,
132
- IncrementInput,
133
- Swipe,
134
- Logo,
135
- DaySelect,
136
- BlockedMessage,
137
- DepartmentLogo,
138
- ContactRole,
139
156
  TimeLine,
140
- SelectPicker,
141
- CalendarSelect,
142
- DateInput,
143
- FilterRange,
144
- Footer,
145
- DefaultSelect,
146
- PasswordInput,
147
- MessageInput,
148
- Heading1,
149
- Heading2,
150
- Heading3,
151
- Heading4,
152
- AllCapsHeading,
153
- Paragraph,
154
- SmallText,
157
+ TimePicker,
158
+ TimeTracker,
155
159
  TinyText,
156
- SelectLink,
157
- MyChildListItem,
158
- MoreInfoButton,
159
- LanguageButton,
160
- Modal,
161
- LoadingIndicator,
162
160
  WaveBackground,
163
- BackgroundGradient,
164
- PersonInfoCard,
165
- TimePicker,
166
- PopOverAction,
161
+ WideButton,
162
+ BubbleAlignment,
163
+ Initials,
164
+ KeyBoardTypes,
165
+ Size,
166
+ ThemeCtx,
167
+ ToddleDateTime,
168
+ VisualState,
169
+ CreateResponsiveStyle,
170
+ Scale,
167
171
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tactics/toddle-styleguide",
3
- "version": "1.2.7",
3
+ "version": "1.2.9",
4
4
  "main": "index.tsx",
5
5
  "types": "index.d.ts",
6
6
  "prepublish": "tsc",