@tactics/toddle-styleguide 0.1.8 → 0.1.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 (5) hide show
  1. package/package.json +1 -1
  2. package/src/components/atoms/calendar/__snapshots__/calendar.test.js.snap +21 -33
  3. package/src/components/atoms/swipe/Swipe.styles.d.ts +5 -5
  4. package/src/components/atoms/swipe/__snapshots__/swipe.test.js.snap +2 -189
  5. package/src/components/atoms/swipe/swipe.component.tsx +1 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tactics/toddle-styleguide",
3
- "version": "0.1.8",
3
+ "version": "0.1.9",
4
4
  "main": "index.tsx",
5
5
  "types": "index.d.ts",
6
6
  "prepublish": "tsc",
package/src/components/atoms/calendar/__snapshots__/calendar.test.js.snap CHANGED
@@ -2132,7 +2132,7 @@ exports[`Test for the calendar component renders a calendar where you can select
2132
2132
  }
2133
2133
  >
2134
2134
  <View
2135
- accessibilityLabel="today Donderdag 19 Januari 2023 "
2135
+ accessibilityLabel=" Donderdag 19 Januari 2023 "
2136
2136
  accessibilityRole="button"
2137
2137
  accessibilityState={
2138
2138
  {
@@ -2152,10 +2152,6 @@ exports[`Test for the calendar component renders a calendar where you can select
2152
2152
  style={
2153
2153
  {
2154
2154
  "alignItems": "center",
2155
- "borderColor": "#7B93DB",
2156
- "borderRadius": 21,
2157
- "borderStyle": "solid",
2158
- "borderWidth": 1,
2159
2155
  "height": 42,
2160
2156
  "justifyContent": "center",
2161
2157
  "opacity": 1,
@@ -2175,9 +2171,6 @@ exports[`Test for the calendar component renders a calendar where you can select
2175
2171
  "lineHeight": 22.4,
2176
2172
  "marginTop": 4,
2177
2173
  },
2178
- {
2179
- "color": "#7B93DB",
2180
- },
2181
2174
  ]
2182
2175
  }
2183
2176
  >
@@ -2208,7 +2201,7 @@ exports[`Test for the calendar component renders a calendar where you can select
2208
2201
  }
2209
2202
  >
2210
2203
  <View
2211
- accessibilityLabel="today Vrijdag 20 Januari 2023 "
2204
+ accessibilityLabel=" Vrijdag 20 Januari 2023 "
2212
2205
  accessibilityRole="button"
2213
2206
  accessibilityState={
2214
2207
  {
@@ -2228,10 +2221,6 @@ exports[`Test for the calendar component renders a calendar where you can select
2228
2221
  style={
2229
2222
  {
2230
2223
  "alignItems": "center",
2231
- "borderColor": "#7B93DB",
2232
- "borderRadius": 21,
2233
- "borderStyle": "solid",
2234
- "borderWidth": 1,
2235
2224
  "height": 42,
2236
2225
  "justifyContent": "center",
2237
2226
  "opacity": 1,
@@ -2251,9 +2240,6 @@ exports[`Test for the calendar component renders a calendar where you can select
2251
2240
  "lineHeight": 22.4,
2252
2241
  "marginTop": 4,
2253
2242
  },
2254
- {
2255
- "color": "#7B93DB",
2256
- },
2257
2243
  ]
2258
2244
  }
2259
2245
  >
@@ -2639,7 +2625,7 @@ exports[`Test for the calendar component renders a calendar where you can select
2639
2625
  }
2640
2626
  >
2641
2627
  <View
2642
- accessibilityLabel=" Donderdag 26 Januari 2023 "
2628
+ accessibilityLabel="today Donderdag 26 Januari 2023 "
2643
2629
  accessibilityRole="button"
2644
2630
  accessibilityState={
2645
2631
  {
@@ -2659,6 +2645,10 @@ exports[`Test for the calendar component renders a calendar where you can select
2659
2645
  style={
2660
2646
  {
2661
2647
  "alignItems": "center",
2648
+ "borderColor": "#7B93DB",
2649
+ "borderRadius": 21,
2650
+ "borderStyle": "solid",
2651
+ "borderWidth": 1,
2662
2652
  "height": 42,
2663
2653
  "justifyContent": "center",
2664
2654
  "opacity": 1,
@@ -2678,6 +2668,9 @@ exports[`Test for the calendar component renders a calendar where you can select
2678
2668
  "lineHeight": 22.4,
2679
2669
  "marginTop": 4,
2680
2670
  },
2671
+ {
2672
+ "color": "#7B93DB",
2673
+ },
2681
2674
  ]
2682
2675
  }
2683
2676
  >
@@ -5583,8 +5576,7 @@ exports[`Test for the calendar component renders a calendar where you can select
5583
5576
  }
5584
5577
  >
5585
5578
  <View
5586
- accessibilityLabel="today Donderdag 19 Januari 2023 "
5587
- accessibilityRole="button"
5579
+ accessibilityLabel=" Donderdag 19 Januari 2023 "
5588
5580
  accessibilityState={
5589
5581
  {
5590
5582
  "disabled": false,
@@ -5603,10 +5595,6 @@ exports[`Test for the calendar component renders a calendar where you can select
5603
5595
  style={
5604
5596
  {
5605
5597
  "alignItems": "center",
5606
- "borderColor": "#7B93DB",
5607
- "borderRadius": 21,
5608
- "borderStyle": "solid",
5609
- "borderWidth": 1,
5610
5598
  "height": 42,
5611
5599
  "justifyContent": "center",
5612
5600
  "opacity": 1,
@@ -5627,7 +5615,7 @@ exports[`Test for the calendar component renders a calendar where you can select
5627
5615
  "marginTop": 4,
5628
5616
  },
5629
5617
  {
5630
- "color": "#7B93DB",
5618
+ "color": "#9AA5B1",
5631
5619
  },
5632
5620
  ]
5633
5621
  }
@@ -5659,8 +5647,7 @@ exports[`Test for the calendar component renders a calendar where you can select
5659
5647
  }
5660
5648
  >
5661
5649
  <View
5662
- accessibilityLabel="today Vrijdag 20 Januari 2023 "
5663
- accessibilityRole="button"
5650
+ accessibilityLabel=" Vrijdag 20 Januari 2023 "
5664
5651
  accessibilityState={
5665
5652
  {
5666
5653
  "disabled": false,
@@ -5679,10 +5666,6 @@ exports[`Test for the calendar component renders a calendar where you can select
5679
5666
  style={
5680
5667
  {
5681
5668
  "alignItems": "center",
5682
- "borderColor": "#7B93DB",
5683
- "borderRadius": 21,
5684
- "borderStyle": "solid",
5685
- "borderWidth": 1,
5686
5669
  "height": 42,
5687
5670
  "justifyContent": "center",
5688
5671
  "opacity": 1,
@@ -5703,7 +5686,7 @@ exports[`Test for the calendar component renders a calendar where you can select
5703
5686
  "marginTop": 4,
5704
5687
  },
5705
5688
  {
5706
- "color": "#7B93DB",
5689
+ "color": "#9AA5B1",
5707
5690
  },
5708
5691
  ]
5709
5692
  }
@@ -6100,7 +6083,8 @@ exports[`Test for the calendar component renders a calendar where you can select
6100
6083
  }
6101
6084
  >
6102
6085
  <View
6103
- accessibilityLabel=" Donderdag 26 Januari 2023 "
6086
+ accessibilityLabel="today Donderdag 26 Januari 2023 "
6087
+ accessibilityRole="button"
6104
6088
  accessibilityState={
6105
6089
  {
6106
6090
  "disabled": false,
@@ -6119,6 +6103,10 @@ exports[`Test for the calendar component renders a calendar where you can select
6119
6103
  style={
6120
6104
  {
6121
6105
  "alignItems": "center",
6106
+ "borderColor": "#7B93DB",
6107
+ "borderRadius": 21,
6108
+ "borderStyle": "solid",
6109
+ "borderWidth": 1,
6122
6110
  "height": 42,
6123
6111
  "justifyContent": "center",
6124
6112
  "opacity": 1,
@@ -6139,7 +6127,7 @@ exports[`Test for the calendar component renders a calendar where you can select
6139
6127
  "marginTop": 4,
6140
6128
  },
6141
6129
  {
6142
- "color": "#9AA5B1",
6130
+ "color": "#7B93DB",
6143
6131
  },
6144
6132
  ]
6145
6133
  }
package/src/components/atoms/swipe/Swipe.styles.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  export function Stylesheet(context: any): {
2
- container: {
3
- alignItems: "center";
4
- justifyContent: "center";
5
- height: number;
6
- };
2
+ container: {
3
+ alignItems: 'center';
4
+ justifyContent: 'center';
5
+ height: number;
6
+ };
7
7
  };
package/src/components/atoms/swipe/__snapshots__/swipe.test.js.snap CHANGED
@@ -50,7 +50,7 @@ exports[`Test Swipe component should render an swipe component with dots and nav
50
50
  index={0}
51
51
  loadMinimal={false}
52
52
  loadMinimalSize={1}
53
- loop={true}
53
+ loop={false}
54
54
  nextButton={
55
55
  <ChevronRightIcon
56
56
  color="#19216C"
@@ -79,73 +79,6 @@ exports[`Test Swipe component should render an swipe component with dots and nav
79
79
  showsVerticalScrollIndicator={false}
80
80
  >
81
81
  <View>
82
- <View
83
- style={
84
- [
85
- {
86
- "height": 1334,
87
- "width": 750,
88
- },
89
- {
90
- "backgroundColor": "transparent",
91
- },
92
- ]
93
- }
94
- >
95
- <View
96
- style={
97
- {
98
- "alignSelf": "center",
99
- "marginLeft": 15,
100
- "marginRight": 15,
101
- "marginTop": 20,
102
- "width": "60%",
103
- }
104
- }
105
- >
106
- <View
107
- accessible={true}
108
- collapsable={false}
109
- focusable={true}
110
- onBlur={[Function]}
111
- onClick={[Function]}
112
- onFocus={[Function]}
113
- onResponderGrant={[Function]}
114
- onResponderMove={[Function]}
115
- onResponderRelease={[Function]}
116
- onResponderTerminate={[Function]}
117
- onResponderTerminationRequest={[Function]}
118
- onStartShouldSetResponder={[Function]}
119
- >
120
- <View
121
- style={
122
- {
123
- "alignItems": "center",
124
- "backgroundColor": "#19216C",
125
- "borderRadius": 50,
126
- "flexDirection": "row",
127
- "justifyContent": "center",
128
- "paddingHorizontal": 24,
129
- "paddingVertical": 12,
130
- }
131
- }
132
- >
133
- <Text
134
- style={
135
- {
136
- "color": "#E0E8F9",
137
- "fontFamily": "SourceSansPro",
138
- "fontSize": 16,
139
- "lineHeight": 22.4,
140
- }
141
- }
142
- >
143
- button 2
144
- </Text>
145
- </View>
146
- </View>
147
- </View>
148
- </View>
149
82
  <View
150
83
  style={
151
84
  [
@@ -280,73 +213,6 @@ exports[`Test Swipe component should render an swipe component with dots and nav
280
213
  </View>
281
214
  </View>
282
215
  </View>
283
- <View
284
- style={
285
- [
286
- {
287
- "height": 1334,
288
- "width": 750,
289
- },
290
- {
291
- "backgroundColor": "transparent",
292
- },
293
- ]
294
- }
295
- >
296
- <View
297
- style={
298
- {
299
- "alignSelf": "center",
300
- "marginLeft": 15,
301
- "marginRight": 15,
302
- "marginTop": 20,
303
- "width": "60%",
304
- }
305
- }
306
- >
307
- <View
308
- accessible={true}
309
- collapsable={false}
310
- focusable={true}
311
- onBlur={[Function]}
312
- onClick={[Function]}
313
- onFocus={[Function]}
314
- onResponderGrant={[Function]}
315
- onResponderMove={[Function]}
316
- onResponderRelease={[Function]}
317
- onResponderTerminate={[Function]}
318
- onResponderTerminationRequest={[Function]}
319
- onStartShouldSetResponder={[Function]}
320
- >
321
- <View
322
- style={
323
- {
324
- "alignItems": "center",
325
- "backgroundColor": "#19216C",
326
- "borderRadius": 50,
327
- "flexDirection": "row",
328
- "justifyContent": "center",
329
- "paddingHorizontal": 24,
330
- "paddingVertical": 12,
331
- }
332
- }
333
- >
334
- <Text
335
- style={
336
- {
337
- "color": "#E0E8F9",
338
- "fontFamily": "SourceSansPro",
339
- "fontSize": 16,
340
- "lineHeight": 22.4,
341
- }
342
- }
343
- >
344
- button 1
345
- </Text>
346
- </View>
347
- </View>
348
- </View>
349
- </View>
350
216
  </View>
351
217
  </RCTScrollView>
352
218
  <View
@@ -451,60 +317,7 @@ exports[`Test Swipe component should render an swipe component with dots and nav
451
317
  }
452
318
  }
453
319
  >
454
- <View>
455
- <RNSVGSvgView
456
- align="xMidYMid"
457
- bbHeight="28"
458
- bbWidth="28"
459
- fill="none"
460
- focusable={false}
461
- height="28"
462
- meetOrSlice={0}
463
- minX={0}
464
- minY={0}
465
- style={
466
- [
467
- {
468
- "backgroundColor": "transparent",
469
- "borderWidth": 0,
470
- },
471
- {
472
- "flex": 0,
473
- "height": 28,
474
- "width": 28,
475
- },
476
- ]
477
- }
478
- vbHeight={27}
479
- vbWidth={27}
480
- width="28"
481
- >
482
- <RNSVGGroup
483
- fill={null}
484
- propList={
485
- [
486
- "fill",
487
- ]
488
- }
489
- >
490
- <RNSVGPath
491
- d="M16.875 21.375L9 13.5L16.875 5.625"
492
- propList={
493
- [
494
- "stroke",
495
- "strokeWidth",
496
- "strokeLinecap",
497
- "strokeLinejoin",
498
- ]
499
- }
500
- stroke={4279837036}
501
- strokeLinecap={1}
502
- strokeLinejoin={1}
503
- strokeWidth="2"
504
- />
505
- </RNSVGGroup>
506
- </RNSVGSvgView>
507
- </View>
320
+ <View />
508
321
  </View>
509
322
  <View
510
323
  accessibilityState={
package/src/components/atoms/swipe/swipe.component.tsx CHANGED
@@ -23,6 +23,7 @@ const Swipe = ({children, onIndexChanged}: SwipeProps) => {
23
23
  return (
24
24
  <View style={styles.container}>
25
25
  <Swiper
26
+ loop={false}
26
27
  onIndexChanged={onIndexChanged}
27
28
  paginationStyle={{bottom: 0}}
28
29
  showsButtons={true}