@hero-design/rn 8.80.1 → 8.81.1-alpha.0

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 (39) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/es/index.js +74 -24
  3. package/lib/index.js +74 -24
  4. package/package.json +3 -2
  5. package/src/components/Button/Button.tsx +13 -5
  6. package/src/components/Button/StyledButton.tsx +60 -39
  7. package/src/components/Button/__tests__/Button.spec.tsx +21 -16
  8. package/src/components/Button/__tests__/StyledButton.spec.tsx +19 -12
  9. package/src/components/Button/__tests__/__snapshots__/Button.spec.tsx.snap +670 -0
  10. package/src/components/Button/__tests__/__snapshots__/StyledButton.spec.tsx.snap +153 -0
  11. package/src/components/Chip/StyledChip.tsx +6 -1
  12. package/src/components/Chip/__tests__/__snapshots__/index.spec.tsx.snap +117 -60
  13. package/src/components/Chip/__tests__/index.spec.tsx +13 -0
  14. package/src/components/Chip/index.tsx +20 -12
  15. package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap +1 -0
  16. package/src/components/Select/MultiSelect/__tests__/__snapshots__/index.spec.tsx.snap +5 -0
  17. package/src/components/TimePicker/TimePickerIOS.tsx +5 -1
  18. package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap +1 -0
  19. package/src/theme/__tests__/__snapshots__/index.spec.ts.snap +8 -0
  20. package/src/theme/components/button.ts +5 -0
  21. package/src/theme/components/chip.ts +5 -0
  22. package/stats/8.81.0/rn-stats.html +4842 -0
  23. package/stats/8.81.1/rn-stats.html +4842 -0
  24. package/types/components/Button/Button.d.ts +1 -1
  25. package/types/components/Button/StyledButton.d.ts +3 -0
  26. package/types/components/Chip/StyledChip.d.ts +5 -1
  27. package/types/components/Chip/index.d.ts +2 -2
  28. package/types/components/CompoundSearch/CompoundSearchHandler.d.ts +31 -0
  29. package/types/components/CompoundSearch/CompoundSearchTextInput.d.ts +60 -0
  30. package/types/components/CompoundSearch/StyledCompoundSearch.d.ts +40 -0
  31. package/types/components/CompoundSearch/index.d.ts +8 -0
  32. package/types/components/CompoundSearch/utils.d.ts +8 -0
  33. package/types/components/FloatingIsland/SingleLine/StyledSingleLine.d.ts +15 -0
  34. package/types/components/FloatingIsland/SingleLine/index.d.ts +24 -0
  35. package/types/components/FloatingIsland/StyledFloatingIsland.d.ts +2 -2
  36. package/types/theme/components/button.d.ts +5 -0
  37. package/types/theme/components/chip.d.ts +3 -0
  38. package/types/theme/components/compoundSearch.d.ts +36 -0
  39. package/.turbo/turbo-build.log +0 -7
@@ -996,6 +996,7 @@ exports[`Button renders correctly 7`] = `
996
996
  }
997
997
  themeButtonVariant="text-primary"
998
998
  themeIntent="body"
999
+ themeIsPressed={false}
999
1000
  themeTypeface="neutral"
1000
1001
  themeVariant="regular-bold"
1001
1002
  >
@@ -1275,6 +1276,7 @@ exports[`Button renders correctly 9`] = `
1275
1276
  }
1276
1277
  themeButtonVariant="text-primary"
1277
1278
  themeIntent="body"
1279
+ themeIsPressed={false}
1278
1280
  themeTypeface="neutral"
1279
1281
  themeVariant="regular-bold"
1280
1282
  >
@@ -1378,6 +1380,7 @@ exports[`Button renders correctly 10`] = `
1378
1380
  }
1379
1381
  themeButtonVariant="text-secondary"
1380
1382
  themeIntent="body"
1383
+ themeIsPressed={false}
1381
1384
  themeTypeface="neutral"
1382
1385
  themeVariant="regular-bold"
1383
1386
  >
@@ -1657,6 +1660,7 @@ exports[`Button renders correctly 12`] = `
1657
1660
  }
1658
1661
  themeButtonVariant="text-secondary"
1659
1662
  themeIntent="body"
1663
+ themeIsPressed={false}
1660
1664
  themeTypeface="neutral"
1661
1665
  themeVariant="regular-bold"
1662
1666
  >
@@ -1760,6 +1764,7 @@ exports[`Button renders correctly 13`] = `
1760
1764
  }
1761
1765
  themeButtonVariant="text-danger"
1762
1766
  themeIntent="body"
1767
+ themeIsPressed={false}
1763
1768
  themeTypeface="neutral"
1764
1769
  themeVariant="regular-bold"
1765
1770
  >
@@ -2039,6 +2044,671 @@ exports[`Button renders correctly 15`] = `
2039
2044
  }
2040
2045
  themeButtonVariant="text-danger"
2041
2046
  themeIntent="body"
2047
+ themeIsPressed={false}
2048
+ themeTypeface="neutral"
2049
+ themeVariant="regular-bold"
2050
+ >
2051
+ A button
2052
+ </Text>
2053
+ </View>
2054
+ <View
2055
+ pointerEvents="box-none"
2056
+ position="bottom"
2057
+ style={
2058
+ [
2059
+ {
2060
+ "bottom": 0,
2061
+ "elevation": 9999,
2062
+ "flexDirection": "column-reverse",
2063
+ "left": 0,
2064
+ "paddingHorizontal": 24,
2065
+ "paddingVertical": 16,
2066
+ "position": "absolute",
2067
+ "right": 0,
2068
+ "top": 0,
2069
+ },
2070
+ undefined,
2071
+ ]
2072
+ }
2073
+ />
2074
+ </View>
2075
+ `;
2076
+
2077
+ exports[`Button renders correctly 16`] = `
2078
+ <View
2079
+ style={
2080
+ {
2081
+ "flex": 1,
2082
+ }
2083
+ }
2084
+ >
2085
+ <View
2086
+ accessibilityState={
2087
+ {
2088
+ "disabled": false,
2089
+ }
2090
+ }
2091
+ accessibilityValue={
2092
+ {
2093
+ "max": undefined,
2094
+ "min": undefined,
2095
+ "now": undefined,
2096
+ "text": undefined,
2097
+ }
2098
+ }
2099
+ accessible={true}
2100
+ focusable={true}
2101
+ onClick={[Function]}
2102
+ onResponderGrant={[Function]}
2103
+ onResponderMove={[Function]}
2104
+ onResponderRelease={[Function]}
2105
+ onResponderTerminate={[Function]}
2106
+ onResponderTerminationRequest={[Function]}
2107
+ onStartShouldSetResponder={[Function]}
2108
+ style={
2109
+ [
2110
+ {
2111
+ "alignItems": "center",
2112
+ "backgroundColor": "transparent",
2113
+ "borderRadius": 4,
2114
+ "borderWidth": 0,
2115
+ "flexDirection": "row",
2116
+ "height": undefined,
2117
+ "justifyContent": "center",
2118
+ "padding": 0,
2119
+ },
2120
+ undefined,
2121
+ ]
2122
+ }
2123
+ >
2124
+ <Text
2125
+ allowFontScaling={false}
2126
+ disabled={false}
2127
+ ellipsizeMode="tail"
2128
+ numberOfLines={1}
2129
+ style={
2130
+ [
2131
+ {
2132
+ "color": "#001f23",
2133
+ "fontFamily": "BeVietnamPro-SemiBold",
2134
+ "fontSize": 16,
2135
+ "letterSpacing": 0.24,
2136
+ "lineHeight": 24,
2137
+ },
2138
+ [
2139
+ {
2140
+ "color": "#401960",
2141
+ "flexShrink": 1,
2142
+ "lineHeight": 22,
2143
+ "textAlign": "center",
2144
+ },
2145
+ undefined,
2146
+ ],
2147
+ ]
2148
+ }
2149
+ themeButtonVariant="text-primary"
2150
+ themeIntent="body"
2151
+ themeIsPressed={false}
2152
+ themeTypeface="neutral"
2153
+ themeVariant="regular-bold"
2154
+ >
2155
+ A button
2156
+ </Text>
2157
+ </View>
2158
+ <View
2159
+ pointerEvents="box-none"
2160
+ position="bottom"
2161
+ style={
2162
+ [
2163
+ {
2164
+ "bottom": 0,
2165
+ "elevation": 9999,
2166
+ "flexDirection": "column-reverse",
2167
+ "left": 0,
2168
+ "paddingHorizontal": 24,
2169
+ "paddingVertical": 16,
2170
+ "position": "absolute",
2171
+ "right": 0,
2172
+ "top": 0,
2173
+ },
2174
+ undefined,
2175
+ ]
2176
+ }
2177
+ />
2178
+ </View>
2179
+ `;
2180
+
2181
+ exports[`Button renders correctly 17`] = `
2182
+ <View
2183
+ style={
2184
+ {
2185
+ "flex": 1,
2186
+ }
2187
+ }
2188
+ >
2189
+ <View
2190
+ accessibilityState={
2191
+ {
2192
+ "disabled": true,
2193
+ }
2194
+ }
2195
+ accessibilityValue={
2196
+ {
2197
+ "max": undefined,
2198
+ "min": undefined,
2199
+ "now": undefined,
2200
+ "text": undefined,
2201
+ }
2202
+ }
2203
+ accessible={true}
2204
+ focusable={true}
2205
+ onClick={[Function]}
2206
+ onResponderGrant={[Function]}
2207
+ onResponderMove={[Function]}
2208
+ onResponderRelease={[Function]}
2209
+ onResponderTerminate={[Function]}
2210
+ onResponderTerminationRequest={[Function]}
2211
+ onStartShouldSetResponder={[Function]}
2212
+ style={
2213
+ [
2214
+ {
2215
+ "alignItems": "center",
2216
+ "backgroundColor": "transparent",
2217
+ "borderRadius": 4,
2218
+ "borderWidth": 0,
2219
+ "flexDirection": "row",
2220
+ "height": undefined,
2221
+ "justifyContent": "center",
2222
+ "padding": 0,
2223
+ },
2224
+ undefined,
2225
+ ]
2226
+ }
2227
+ >
2228
+ <View
2229
+ collapsable={false}
2230
+ style={
2231
+ [
2232
+ {
2233
+ "alignItems": "center",
2234
+ "flexDirection": "row",
2235
+ "justifyContent": "center",
2236
+ },
2237
+ {},
2238
+ ]
2239
+ }
2240
+ testID="undefined-loading-indicator"
2241
+ >
2242
+ <View
2243
+ collapsable={false}
2244
+ style={
2245
+ {
2246
+ "transform": [
2247
+ {
2248
+ "scale": 1,
2249
+ },
2250
+ ],
2251
+ }
2252
+ }
2253
+ >
2254
+ <View
2255
+ collapsable={false}
2256
+ size={12}
2257
+ style={
2258
+ [
2259
+ {
2260
+ "backgroundColor": "#4d6265",
2261
+ "borderRadius": 8,
2262
+ "height": 12,
2263
+ "marginHorizontal": 8,
2264
+ "width": 12,
2265
+ },
2266
+ {},
2267
+ ]
2268
+ }
2269
+ themeVariant="text-secondary"
2270
+ />
2271
+ </View>
2272
+ <View
2273
+ collapsable={false}
2274
+ style={
2275
+ {
2276
+ "transform": [
2277
+ {
2278
+ "scale": 1,
2279
+ },
2280
+ ],
2281
+ }
2282
+ }
2283
+ >
2284
+ <View
2285
+ collapsable={false}
2286
+ size={12}
2287
+ style={
2288
+ [
2289
+ {
2290
+ "backgroundColor": "#4d6265",
2291
+ "borderRadius": 8,
2292
+ "height": 12,
2293
+ "marginHorizontal": 8,
2294
+ "width": 12,
2295
+ },
2296
+ {},
2297
+ ]
2298
+ }
2299
+ themeVariant="text-secondary"
2300
+ />
2301
+ </View>
2302
+ <View
2303
+ collapsable={false}
2304
+ style={
2305
+ {
2306
+ "transform": [
2307
+ {
2308
+ "scale": 1,
2309
+ },
2310
+ ],
2311
+ }
2312
+ }
2313
+ >
2314
+ <View
2315
+ collapsable={false}
2316
+ size={12}
2317
+ style={
2318
+ [
2319
+ {
2320
+ "backgroundColor": "#4d6265",
2321
+ "borderRadius": 8,
2322
+ "height": 12,
2323
+ "marginHorizontal": 8,
2324
+ "width": 12,
2325
+ },
2326
+ {},
2327
+ ]
2328
+ }
2329
+ themeVariant="text-secondary"
2330
+ />
2331
+ </View>
2332
+ </View>
2333
+ </View>
2334
+ <View
2335
+ pointerEvents="box-none"
2336
+ position="bottom"
2337
+ style={
2338
+ [
2339
+ {
2340
+ "bottom": 0,
2341
+ "elevation": 9999,
2342
+ "flexDirection": "column-reverse",
2343
+ "left": 0,
2344
+ "paddingHorizontal": 24,
2345
+ "paddingVertical": 16,
2346
+ "position": "absolute",
2347
+ "right": 0,
2348
+ "top": 0,
2349
+ },
2350
+ undefined,
2351
+ ]
2352
+ }
2353
+ />
2354
+ </View>
2355
+ `;
2356
+
2357
+ exports[`Button renders correctly 18`] = `
2358
+ <View
2359
+ style={
2360
+ {
2361
+ "flex": 1,
2362
+ }
2363
+ }
2364
+ >
2365
+ <View
2366
+ accessibilityState={
2367
+ {
2368
+ "disabled": false,
2369
+ }
2370
+ }
2371
+ accessibilityValue={
2372
+ {
2373
+ "max": undefined,
2374
+ "min": undefined,
2375
+ "now": undefined,
2376
+ "text": undefined,
2377
+ }
2378
+ }
2379
+ accessible={true}
2380
+ focusable={true}
2381
+ onClick={[Function]}
2382
+ onResponderGrant={[Function]}
2383
+ onResponderMove={[Function]}
2384
+ onResponderRelease={[Function]}
2385
+ onResponderTerminate={[Function]}
2386
+ onResponderTerminationRequest={[Function]}
2387
+ onStartShouldSetResponder={[Function]}
2388
+ style={
2389
+ [
2390
+ {
2391
+ "alignItems": "center",
2392
+ "backgroundColor": "transparent",
2393
+ "borderRadius": 4,
2394
+ "borderWidth": 0,
2395
+ "flexDirection": "row",
2396
+ "height": undefined,
2397
+ "justifyContent": "center",
2398
+ "padding": 0,
2399
+ },
2400
+ undefined,
2401
+ ]
2402
+ }
2403
+ >
2404
+ <Text
2405
+ allowFontScaling={false}
2406
+ disabled={false}
2407
+ ellipsizeMode="tail"
2408
+ numberOfLines={1}
2409
+ style={
2410
+ [
2411
+ {
2412
+ "color": "#001f23",
2413
+ "fontFamily": "BeVietnamPro-SemiBold",
2414
+ "fontSize": 16,
2415
+ "letterSpacing": 0.24,
2416
+ "lineHeight": 24,
2417
+ },
2418
+ [
2419
+ {
2420
+ "color": "#cb300a",
2421
+ "flexShrink": 1,
2422
+ "lineHeight": 22,
2423
+ "textAlign": "center",
2424
+ },
2425
+ undefined,
2426
+ ],
2427
+ ]
2428
+ }
2429
+ themeButtonVariant="text-danger"
2430
+ themeIntent="body"
2431
+ themeIsPressed={false}
2432
+ themeTypeface="neutral"
2433
+ themeVariant="regular-bold"
2434
+ >
2435
+ A button
2436
+ </Text>
2437
+ </View>
2438
+ <View
2439
+ pointerEvents="box-none"
2440
+ position="bottom"
2441
+ style={
2442
+ [
2443
+ {
2444
+ "bottom": 0,
2445
+ "elevation": 9999,
2446
+ "flexDirection": "column-reverse",
2447
+ "left": 0,
2448
+ "paddingHorizontal": 24,
2449
+ "paddingVertical": 16,
2450
+ "position": "absolute",
2451
+ "right": 0,
2452
+ "top": 0,
2453
+ },
2454
+ undefined,
2455
+ ]
2456
+ }
2457
+ />
2458
+ </View>
2459
+ `;
2460
+
2461
+ exports[`Button renders correctly 19`] = `
2462
+ <View
2463
+ style={
2464
+ {
2465
+ "flex": 1,
2466
+ }
2467
+ }
2468
+ >
2469
+ <View
2470
+ accessibilityState={
2471
+ {
2472
+ "disabled": true,
2473
+ }
2474
+ }
2475
+ accessibilityValue={
2476
+ {
2477
+ "max": undefined,
2478
+ "min": undefined,
2479
+ "now": undefined,
2480
+ "text": undefined,
2481
+ }
2482
+ }
2483
+ accessible={true}
2484
+ focusable={true}
2485
+ onClick={[Function]}
2486
+ onResponderGrant={[Function]}
2487
+ onResponderMove={[Function]}
2488
+ onResponderRelease={[Function]}
2489
+ onResponderTerminate={[Function]}
2490
+ onResponderTerminationRequest={[Function]}
2491
+ onStartShouldSetResponder={[Function]}
2492
+ style={
2493
+ [
2494
+ {
2495
+ "alignItems": "center",
2496
+ "backgroundColor": "transparent",
2497
+ "borderRadius": 4,
2498
+ "borderWidth": 0,
2499
+ "flexDirection": "row",
2500
+ "height": undefined,
2501
+ "justifyContent": "center",
2502
+ "padding": 0,
2503
+ },
2504
+ undefined,
2505
+ ]
2506
+ }
2507
+ >
2508
+ <View
2509
+ collapsable={false}
2510
+ style={
2511
+ [
2512
+ {
2513
+ "alignItems": "center",
2514
+ "flexDirection": "row",
2515
+ "justifyContent": "center",
2516
+ },
2517
+ {},
2518
+ ]
2519
+ }
2520
+ testID="undefined-loading-indicator"
2521
+ >
2522
+ <View
2523
+ collapsable={false}
2524
+ style={
2525
+ {
2526
+ "transform": [
2527
+ {
2528
+ "scale": 1,
2529
+ },
2530
+ ],
2531
+ }
2532
+ }
2533
+ >
2534
+ <View
2535
+ collapsable={false}
2536
+ size={12}
2537
+ style={
2538
+ [
2539
+ {
2540
+ "backgroundColor": "#4d6265",
2541
+ "borderRadius": 8,
2542
+ "height": 12,
2543
+ "marginHorizontal": 8,
2544
+ "width": 12,
2545
+ },
2546
+ {},
2547
+ ]
2548
+ }
2549
+ themeVariant="text-primary"
2550
+ />
2551
+ </View>
2552
+ <View
2553
+ collapsable={false}
2554
+ style={
2555
+ {
2556
+ "transform": [
2557
+ {
2558
+ "scale": 1,
2559
+ },
2560
+ ],
2561
+ }
2562
+ }
2563
+ >
2564
+ <View
2565
+ collapsable={false}
2566
+ size={12}
2567
+ style={
2568
+ [
2569
+ {
2570
+ "backgroundColor": "#4d6265",
2571
+ "borderRadius": 8,
2572
+ "height": 12,
2573
+ "marginHorizontal": 8,
2574
+ "width": 12,
2575
+ },
2576
+ {},
2577
+ ]
2578
+ }
2579
+ themeVariant="text-primary"
2580
+ />
2581
+ </View>
2582
+ <View
2583
+ collapsable={false}
2584
+ style={
2585
+ {
2586
+ "transform": [
2587
+ {
2588
+ "scale": 1,
2589
+ },
2590
+ ],
2591
+ }
2592
+ }
2593
+ >
2594
+ <View
2595
+ collapsable={false}
2596
+ size={12}
2597
+ style={
2598
+ [
2599
+ {
2600
+ "backgroundColor": "#4d6265",
2601
+ "borderRadius": 8,
2602
+ "height": 12,
2603
+ "marginHorizontal": 8,
2604
+ "width": 12,
2605
+ },
2606
+ {},
2607
+ ]
2608
+ }
2609
+ themeVariant="text-primary"
2610
+ />
2611
+ </View>
2612
+ </View>
2613
+ </View>
2614
+ <View
2615
+ pointerEvents="box-none"
2616
+ position="bottom"
2617
+ style={
2618
+ [
2619
+ {
2620
+ "bottom": 0,
2621
+ "elevation": 9999,
2622
+ "flexDirection": "column-reverse",
2623
+ "left": 0,
2624
+ "paddingHorizontal": 24,
2625
+ "paddingVertical": 16,
2626
+ "position": "absolute",
2627
+ "right": 0,
2628
+ "top": 0,
2629
+ },
2630
+ undefined,
2631
+ ]
2632
+ }
2633
+ />
2634
+ </View>
2635
+ `;
2636
+
2637
+ exports[`Button renders correctly 20`] = `
2638
+ <View
2639
+ style={
2640
+ {
2641
+ "flex": 1,
2642
+ }
2643
+ }
2644
+ >
2645
+ <View
2646
+ accessibilityState={
2647
+ {
2648
+ "disabled": true,
2649
+ }
2650
+ }
2651
+ accessibilityValue={
2652
+ {
2653
+ "max": undefined,
2654
+ "min": undefined,
2655
+ "now": undefined,
2656
+ "text": undefined,
2657
+ }
2658
+ }
2659
+ accessible={true}
2660
+ focusable={true}
2661
+ onClick={[Function]}
2662
+ onResponderGrant={[Function]}
2663
+ onResponderMove={[Function]}
2664
+ onResponderRelease={[Function]}
2665
+ onResponderTerminate={[Function]}
2666
+ onResponderTerminationRequest={[Function]}
2667
+ onStartShouldSetResponder={[Function]}
2668
+ style={
2669
+ [
2670
+ {
2671
+ "alignItems": "center",
2672
+ "backgroundColor": "transparent",
2673
+ "borderRadius": 4,
2674
+ "borderWidth": 0,
2675
+ "flexDirection": "row",
2676
+ "height": undefined,
2677
+ "justifyContent": "center",
2678
+ "padding": 0,
2679
+ },
2680
+ undefined,
2681
+ ]
2682
+ }
2683
+ >
2684
+ <Text
2685
+ allowFontScaling={false}
2686
+ disabled={true}
2687
+ ellipsizeMode="tail"
2688
+ numberOfLines={1}
2689
+ style={
2690
+ [
2691
+ {
2692
+ "color": "#001f23",
2693
+ "fontFamily": "BeVietnamPro-SemiBold",
2694
+ "fontSize": 16,
2695
+ "letterSpacing": 0.24,
2696
+ "lineHeight": 24,
2697
+ },
2698
+ [
2699
+ {
2700
+ "color": "#bfc1c5",
2701
+ "flexShrink": 1,
2702
+ "lineHeight": 22,
2703
+ "textAlign": "center",
2704
+ },
2705
+ undefined,
2706
+ ],
2707
+ ]
2708
+ }
2709
+ themeButtonVariant="text-primary"
2710
+ themeIntent="body"
2711
+ themeIsPressed={false}
2042
2712
  themeTypeface="neutral"
2043
2713
  themeVariant="regular-bold"
2044
2714
  >