@transferwise/components 0.0.0-experimental-feb2ddf → 0.0.0-experimental-d155e01

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 (60) hide show
  1. package/build/i18n/cs.json +9 -9
  2. package/build/i18n/cs.json.js +9 -9
  3. package/build/i18n/cs.json.mjs +9 -9
  4. package/build/index.js +0 -1
  5. package/build/index.js.map +1 -1
  6. package/build/index.mjs +1 -1
  7. package/build/main.css +0 -188
  8. package/build/styles/main.css +0 -188
  9. package/build/types/index.d.ts +0 -2
  10. package/build/types/index.d.ts.map +1 -1
  11. package/build/types/test-utils/fake-data.d.ts +0 -2
  12. package/build/types/test-utils/fake-data.d.ts.map +1 -1
  13. package/package.json +1 -1
  14. package/src/i18n/cs.json +9 -9
  15. package/src/index.ts +0 -2
  16. package/src/main.css +0 -188
  17. package/src/main.less +0 -1
  18. package/src/test-utils/fake-data.ts +0 -5
  19. package/build/styles/listItem/ListItem.css +0 -188
  20. package/build/test-utils/assets/apple-pay-logo.svg +0 -84
  21. package/build/types/listItem/ListItem.d.ts +0 -43
  22. package/build/types/listItem/ListItem.d.ts.map +0 -1
  23. package/build/types/listItem/ListItemAdditionalInfo.d.ts +0 -9
  24. package/build/types/listItem/ListItemAdditionalInfo.d.ts.map +0 -1
  25. package/build/types/listItem/ListItemButton.d.ts +0 -4
  26. package/build/types/listItem/ListItemButton.d.ts.map +0 -1
  27. package/build/types/listItem/ListItemCheckbox.d.ts +0 -4
  28. package/build/types/listItem/ListItemCheckbox.d.ts.map +0 -1
  29. package/build/types/listItem/ListItemIconButton.d.ts +0 -7
  30. package/build/types/listItem/ListItemIconButton.d.ts.map +0 -1
  31. package/build/types/listItem/ListItemMedia.d.ts +0 -19
  32. package/build/types/listItem/ListItemMedia.d.ts.map +0 -1
  33. package/build/types/listItem/ListItemNavigation.d.ts +0 -4
  34. package/build/types/listItem/ListItemNavigation.d.ts.map +0 -1
  35. package/build/types/listItem/ListItemSwitch.d.ts +0 -3
  36. package/build/types/listItem/ListItemSwitch.d.ts.map +0 -1
  37. package/build/types/listItem/index.d.ts +0 -6
  38. package/build/types/listItem/index.d.ts.map +0 -1
  39. package/build/types/listItem/prompt/Prompt.d.ts +0 -12
  40. package/build/types/listItem/prompt/Prompt.d.ts.map +0 -1
  41. package/build/types/listItem/useItemControl.d.ts +0 -5
  42. package/build/types/listItem/useItemControl.d.ts.map +0 -1
  43. package/src/listItem/ListItem.css +0 -188
  44. package/src/listItem/ListItem.less +0 -182
  45. package/src/listItem/ListItem.story.tsx +0 -273
  46. package/src/listItem/ListItem.tsx +0 -183
  47. package/src/listItem/ListItemAdditionalInfo.tsx +0 -31
  48. package/src/listItem/ListItemButton.spec.tsx +0 -90
  49. package/src/listItem/ListItemButton.tsx +0 -18
  50. package/src/listItem/ListItemCheckbox.tsx +0 -11
  51. package/src/listItem/ListItemIconButton.tsx +0 -13
  52. package/src/listItem/ListItemMedia.tsx +0 -52
  53. package/src/listItem/ListItemNavigation.tsx +0 -11
  54. package/src/listItem/ListItemSwitch.tsx +0 -8
  55. package/src/listItem/index.ts +0 -6
  56. package/src/listItem/prompt/Prompt.spec.tsx +0 -77
  57. package/src/listItem/prompt/Prompt.story.tsx +0 -170
  58. package/src/listItem/prompt/Prompt.tsx +0 -44
  59. package/src/listItem/useItemControl.tsx +0 -12
  60. package/src/test-utils/assets/apple-pay-logo.svg +0 -84
package/src/i18n/cs.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "neptune.Button.loadingAriaLabel": "načítání",
3
- "neptune.Chips.ariaLabel": "Vyčistit {choice}",
4
- "neptune.ClearButton.ariaLabel": "Vyčistit",
3
+ "neptune.Chips.ariaLabel": "Vymazat {choice}",
4
+ "neptune.ClearButton.ariaLabel": "Vymazat",
5
5
  "neptune.CloseButton.ariaLabel": "Zavřít",
6
6
  "neptune.DateInput.day.label": "Den",
7
7
  "neptune.DateInput.day.placeholder": "DD",
@@ -47,25 +47,25 @@
47
47
  "neptune.Upload.csWrongTypeMessage": "Tento formát souboru není podporován. Zkuste to znovu s jiným souborem",
48
48
  "neptune.Upload.psButtonText": "Zrušit",
49
49
  "neptune.Upload.psProcessingText": "Načítání...",
50
- "neptune.Upload.retry": "Opakovat",
50
+ "neptune.Upload.retry": "Zkusit znovu",
51
51
  "neptune.Upload.usButtonText": "Nebo vyberte soubor",
52
- "neptune.Upload.usDropMessage": "Pusťte sem soubor pro jeho nahrání",
52
+ "neptune.Upload.usDropMessage": "Přetáhněte soubor a zahajte nahrávání",
53
53
  "neptune.Upload.usPlaceholder": "Přetáhněte soubor menší než {maxSize} MB",
54
54
  "neptune.UploadButton.allFileTypes": "Všechny typy souborů",
55
- "neptune.UploadButton.dropFiles": "Pusťte sem soubor pro jeho nahrání",
56
- "neptune.UploadButton.instructions": "{fileTypes}, menší než {size}MB",
55
+ "neptune.UploadButton.dropFiles": "Přetáhněte soubor a zahajte nahrávání",
56
+ "neptune.UploadButton.instructions": "{fileTypes}, menší než {size} MB",
57
57
  "neptune.UploadButton.maximumFiles": "Max. počet souborů: {maxFiles}.",
58
58
  "neptune.UploadButton.uploadFile": "Nahrát soubor",
59
59
  "neptune.UploadButton.uploadFiles": "Nahrát soubory",
60
60
  "neptune.UploadInput.deleteModalBody": "Odstraněním tohoto souboru jej smažete z našeho systému.",
61
61
  "neptune.UploadInput.deleteModalCancelButtonText": "Zrušit",
62
62
  "neptune.UploadInput.deleteModalConfirmButtonText": "Odstranit",
63
- "neptune.UploadInput.deleteModalTitle": "Jistě chcete odstranit tento soubor?",
63
+ "neptune.UploadInput.deleteModalTitle": "Opravdu chcete odstranit tento soubor?",
64
64
  "neptune.UploadInput.fileIsTooLarge": "Soubor je příliš velký",
65
65
  "neptune.UploadInput.fileTypeNotSupported": "Typ souboru není podporován",
66
66
  "neptune.UploadInput.maximumFilesAlreadyUploaded": "Je nám líto, ale toto nahrání se nezdařilo, protože můžeme přijmout pouze {maxFilesAllowed} souborů najednou.",
67
- "neptune.UploadItem.deleting": "Mažeme...",
68
- "neptune.UploadItem.removeFile": "Odstranit soubor {filename}",
67
+ "neptune.UploadItem.deleting": "Odstraňování...",
68
+ "neptune.UploadItem.removeFile": "Odebrat soubor {filename}",
69
69
  "neptune.UploadItem.uploaded": "Nahráno",
70
70
  "neptune.UploadItem.uploadedFile": "Nahraný soubor",
71
71
  "neptune.UploadItem.uploading": "Nahrávání...",
package/src/index.ts CHANGED
@@ -109,7 +109,6 @@ export type {
109
109
  TableCellStatus,
110
110
  TableCellType,
111
111
  } from './table';
112
- export type { ItemProps, ItemAdditionalInfoProps, ItemCheckboxProps } from './listItem';
113
112
 
114
113
  /**
115
114
  * Components
@@ -212,7 +211,6 @@ export { default as Typeahead } from './typeahead';
212
211
  export { default as Upload } from './upload';
213
212
  export { default as UploadInput } from './uploadInput';
214
213
  export { default as Table } from './table';
215
- export { default as Item } from './table';
216
214
 
217
215
  /**
218
216
  * Hooks
package/src/main.css CHANGED
@@ -2648,194 +2648,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2648
2648
  border-radius: 9999px !important;
2649
2649
  border-radius: var(--radius-full) !important;
2650
2650
  }
2651
- .wds-list-item {
2652
- padding: 16px;
2653
- padding: var(--size-16);
2654
- border-radius: 24px;
2655
- border-radius: var(--radius-large);
2656
- background-color: #ffffff;
2657
- background-color: var(--color-background-screen);
2658
- gap: 16px;
2659
- gap: var(--size-16);
2660
- }
2661
- .wds-list-item-interactive {
2662
- cursor: pointer;
2663
- }
2664
- .wds-list-item-interactive:hover {
2665
- background-color: var(--color-background-screen-hover);
2666
- }
2667
- .wds-list-item-interactive:active {
2668
- background-color: var(--color-background-screen-active);
2669
- }
2670
- .wds-list-item-media-image {
2671
- width: var(--item-media-image-size);
2672
- height: var(--item-media-image-size);
2673
- }
2674
- .wds-list-item-body {
2675
- width: 100%;
2676
- }
2677
- .wds-list-item-title {
2678
- color: #37517e;
2679
- color: var(--color-content-primary);
2680
- }
2681
- .wds-list-item-additional-info {
2682
- color: #768e9c;
2683
- color: var(--color-content-tertiary);
2684
- }
2685
- .wds-list-item-value {
2686
- flex: 0 0 auto;
2687
- }
2688
- .wds-list-item-control {
2689
- flex: 0 0 auto;
2690
- }
2691
- .wds-list-item-spotlight-active {
2692
- background-color: rgba(134,167,189,0.10196);
2693
- background-color: var(--color-background-neutral);
2694
- }
2695
- .wds-list-item-spotlight-active:hover {
2696
- background-color: var(--color-background-neutral-hover);
2697
- }
2698
- .wds-list-item-spotlight-active:active {
2699
- background-color: var(--color-background-neutral-active);
2700
- }
2701
- .wds-list-item-spotlight-inactive {
2702
- background-color: rgba(134, 167, 189, 0.025);
2703
- border: 1px dashed rgba(0,0,0,0.10196);
2704
- border: 1px dashed var(--color-border-neutral);
2705
- }
2706
- @supports (color: color-mix(in lch, red, blue)) {
2707
- .wds-list-item-spotlight-inactive {
2708
- background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
2709
- }
2710
- }
2711
- .wds-list-item-spotlight-inactive:hover {
2712
- background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
2713
- }
2714
- .wds-list-item-spotlight-inactive:active {
2715
- background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
2716
- }
2717
- .wds-list-item-prompt {
2718
- display: inline-flex;
2719
- padding-top: calc(8px / 2);
2720
- padding-top: calc(var(--padding-x-small) / 2);
2721
- padding-bottom: calc(8px / 2);
2722
- padding-bottom: calc(var(--padding-x-small) / 2);
2723
- padding-left: calc(8px - 1px);
2724
- padding-left: calc(var(--padding-x-small) - 1px);
2725
- padding-right: 8px;
2726
- padding-right: var(--padding-x-small);
2727
- border-radius: 10px;
2728
- border-radius: var(--radius-small);
2729
- word-break: break-word;
2730
- word-wrap: break-word;
2731
- }
2732
- .wds-list-item-prompt .np-prompt-icon {
2733
- padding-right: calc(12px / 2);
2734
- padding-right: calc(var(--size-12) / 2);
2735
- padding-top: calc(4px - 1px);
2736
- padding-top: calc(var(--size-4) - 1px);
2737
- padding-bottom: calc(4px - 1px);
2738
- padding-bottom: calc(var(--size-4) - 1px);
2739
- }
2740
- .wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
2741
- .wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
2742
- color: var(--color-sentiment-positive-primary);
2743
- }
2744
- .wds-list-item-prompt a {
2745
- text-underline-offset: calc(4px / 2);
2746
- text-underline-offset: calc(var(--size-4) / 2);
2747
- }
2748
- .wds-list-item-prompt.np-prompt-interactive {
2749
- -webkit-text-decoration: none;
2750
- text-decoration: none;
2751
- cursor: pointer;
2752
- border: none;
2753
- }
2754
- .wds-list-item-prompt.negative {
2755
- background-color: var(--color-sentiment-negative-secondary);
2756
- color: var(--color-sentiment-negative-primary);
2757
- }
2758
- .wds-list-item-prompt.negative a {
2759
- color: var(--color-sentiment-negative-primary);
2760
- }
2761
- .wds-list-item-prompt.negative a:hover {
2762
- color: var(--color-sentiment-negative-primary-hover);
2763
- }
2764
- .wds-list-item-prompt.negative a:active {
2765
- color: var(--color-sentiment-negative-primary-active);
2766
- }
2767
- .np-prompt-interactive.wds-list-item-prompt.negative:hover {
2768
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 95%, var(--color-sentiment-negative-primary));
2769
- }
2770
- .np-prompt-interactive.wds-list-item-prompt.negative:active {
2771
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 90%, var(--color-sentiment-negative-primary));
2772
- }
2773
- .wds-list-item-prompt.positive,
2774
- .wds-list-item-prompt.discount,
2775
- .wds-list-item-prompt.savings {
2776
- background-color: var(--color-sentiment-positive-secondary);
2777
- color: var(--color-sentiment-positive-primary);
2778
- }
2779
- .wds-list-item-prompt.positive a,
2780
- .wds-list-item-prompt.discount a,
2781
- .wds-list-item-prompt.savings a {
2782
- color: var(--color-sentiment-positive-primary);
2783
- }
2784
- .wds-list-item-prompt.positive a:hover,
2785
- .wds-list-item-prompt.discount a:hover,
2786
- .wds-list-item-prompt.savings a:hover {
2787
- color: var(--color-sentiment-positive-primary-hover);
2788
- }
2789
- .wds-list-item-prompt.positive a:active,
2790
- .wds-list-item-prompt.discount a:active,
2791
- .wds-list-item-prompt.savings a:active {
2792
- color: var(--color-sentiment-positive-primary-active);
2793
- }
2794
- .np-prompt-interactive.wds-list-item-prompt.positive:hover,
2795
- .np-prompt-interactive.wds-list-item-prompt.discount:hover,
2796
- .np-prompt-interactive.wds-list-item-prompt.savings:hover {
2797
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 95%, var(--color-sentiment-positive-primary));
2798
- }
2799
- .np-prompt-interactive.wds-list-item-prompt.positive:active,
2800
- .np-prompt-interactive.wds-list-item-prompt.discount:active,
2801
- .np-prompt-interactive.wds-list-item-prompt.savings:active {
2802
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 90%, var(--color-sentiment-positive-primary));
2803
- }
2804
- .wds-list-item-prompt.neutral {
2805
- background-color: rgba(134,167,189,0.10196);
2806
- background-color: var(--color-background-neutral);
2807
- color: #37517e;
2808
- color: var(--color-content-primary);
2809
- }
2810
- .wds-list-item-prompt.neutral a {
2811
- color: #37517e;
2812
- color: var(--color-content-primary);
2813
- }
2814
- .np-prompt-interactive.wds-list-item-prompt.neutral:hover {
2815
- background-color: var(--color-background-neutral-hover);
2816
- }
2817
- .np-prompt-interactive.wds-list-item-prompt.neutral:active {
2818
- background-color: var(--color-background-neutral-active);
2819
- }
2820
- .wds-list-item-prompt.warning {
2821
- background-color: var(--color-sentiment-warning-secondary);
2822
- color: var(--color-sentiment-warning-content);
2823
- }
2824
- .wds-list-item-prompt.warning a {
2825
- color: var(--color-sentiment-warning-content);
2826
- }
2827
- .wds-list-item-prompt.warning a:hover {
2828
- color: var(--color-sentiment-warning-content-hover);
2829
- }
2830
- .wds-list-item-prompt.warning a:active {
2831
- color: var(--color-sentiment-warning-content-active);
2832
- }
2833
- .np-prompt-interactive.wds-list-item-prompt.warning:hover {
2834
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 90%, var(--color-sentiment-warning-primary));
2835
- }
2836
- .np-prompt-interactive.wds-list-item-prompt.warning:active {
2837
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 80%, var(--color-sentiment-warning-primary));
2838
- }
2839
2651
  .np-field-control {
2840
2652
  margin-top: 4px;
2841
2653
  margin-top: var(--size-4);
package/src/main.less CHANGED
@@ -39,7 +39,6 @@
39
39
  @import "./image/Image.less";
40
40
  @import "./info/Info.less";
41
41
  @import "./inputs/Input.less";
42
- @import "./listItem/ListItem.less";
43
42
  @import "./field/Field.less";
44
43
  @import "./inputs/InputGroup.less";
45
44
  @import "./inputs/SelectInput.less";
@@ -1,11 +1,6 @@
1
- export const lorem5 = 'Lorem ipsum dolor sit amet.';
2
-
3
1
  export const lorem10 =
4
2
  'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, architecto?';
5
3
 
6
- export const lorem20 =
7
- 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum non explicabo doloribus rerum saepe ut beatae adipisci rem vero optio.';
8
-
9
4
  export const lorem40 =
10
5
  'Lorem ipsum dolor sit amet consectetur, adipisicing elit. Illo esse quod et iure deserunt facilis similique voluptatem reprehenderit mollitia inventore, ab voluptate dignissimos autem repellat accusamus perferendis sed pariatur tempore possimus ipsam praesentium ipsum? Nesciunt cumque repellendus impedit aliquam! Error?';
11
6
 
@@ -1,188 +0,0 @@
1
- .wds-list-item {
2
- padding: 16px;
3
- padding: var(--size-16);
4
- border-radius: 24px;
5
- border-radius: var(--radius-large);
6
- background-color: #ffffff;
7
- background-color: var(--color-background-screen);
8
- gap: 16px;
9
- gap: var(--size-16);
10
- }
11
- .wds-list-item-interactive {
12
- cursor: pointer;
13
- }
14
- .wds-list-item-interactive:hover {
15
- background-color: var(--color-background-screen-hover);
16
- }
17
- .wds-list-item-interactive:active {
18
- background-color: var(--color-background-screen-active);
19
- }
20
- .wds-list-item-media-image {
21
- width: var(--item-media-image-size);
22
- height: var(--item-media-image-size);
23
- }
24
- .wds-list-item-body {
25
- width: 100%;
26
- }
27
- .wds-list-item-title {
28
- color: #37517e;
29
- color: var(--color-content-primary);
30
- }
31
- .wds-list-item-additional-info {
32
- color: #768e9c;
33
- color: var(--color-content-tertiary);
34
- }
35
- .wds-list-item-value {
36
- flex: 0 0 auto;
37
- }
38
- .wds-list-item-control {
39
- flex: 0 0 auto;
40
- }
41
- .wds-list-item-spotlight-active {
42
- background-color: rgba(134,167,189,0.10196);
43
- background-color: var(--color-background-neutral);
44
- }
45
- .wds-list-item-spotlight-active:hover {
46
- background-color: var(--color-background-neutral-hover);
47
- }
48
- .wds-list-item-spotlight-active:active {
49
- background-color: var(--color-background-neutral-active);
50
- }
51
- .wds-list-item-spotlight-inactive {
52
- background-color: rgba(134, 167, 189, 0.025);
53
- border: 1px dashed rgba(0,0,0,0.10196);
54
- border: 1px dashed var(--color-border-neutral);
55
- }
56
- @supports (color: color-mix(in lch, red, blue)) {
57
- .wds-list-item-spotlight-inactive {
58
- background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
59
- }
60
- }
61
- .wds-list-item-spotlight-inactive:hover {
62
- background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
63
- }
64
- .wds-list-item-spotlight-inactive:active {
65
- background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
66
- }
67
- .wds-list-item-prompt {
68
- display: inline-flex;
69
- padding-top: calc(8px / 2);
70
- padding-top: calc(var(--padding-x-small) / 2);
71
- padding-bottom: calc(8px / 2);
72
- padding-bottom: calc(var(--padding-x-small) / 2);
73
- padding-left: calc(8px - 1px);
74
- padding-left: calc(var(--padding-x-small) - 1px);
75
- padding-right: 8px;
76
- padding-right: var(--padding-x-small);
77
- border-radius: 10px;
78
- border-radius: var(--radius-small);
79
- word-break: break-word;
80
- word-wrap: break-word;
81
- }
82
- .wds-list-item-prompt .np-prompt-icon {
83
- padding-right: calc(12px / 2);
84
- padding-right: calc(var(--size-12) / 2);
85
- padding-top: calc(4px - 1px);
86
- padding-top: calc(var(--size-4) - 1px);
87
- padding-bottom: calc(4px - 1px);
88
- padding-bottom: calc(var(--size-4) - 1px);
89
- }
90
- .wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
91
- .wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
92
- color: var(--color-sentiment-positive-primary);
93
- }
94
- .wds-list-item-prompt a {
95
- text-underline-offset: calc(4px / 2);
96
- text-underline-offset: calc(var(--size-4) / 2);
97
- }
98
- .wds-list-item-prompt.np-prompt-interactive {
99
- -webkit-text-decoration: none;
100
- text-decoration: none;
101
- cursor: pointer;
102
- border: none;
103
- }
104
- .wds-list-item-prompt.negative {
105
- background-color: var(--color-sentiment-negative-secondary);
106
- color: var(--color-sentiment-negative-primary);
107
- }
108
- .wds-list-item-prompt.negative a {
109
- color: var(--color-sentiment-negative-primary);
110
- }
111
- .wds-list-item-prompt.negative a:hover {
112
- color: var(--color-sentiment-negative-primary-hover);
113
- }
114
- .wds-list-item-prompt.negative a:active {
115
- color: var(--color-sentiment-negative-primary-active);
116
- }
117
- .np-prompt-interactive.wds-list-item-prompt.negative:hover {
118
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 95%, var(--color-sentiment-negative-primary));
119
- }
120
- .np-prompt-interactive.wds-list-item-prompt.negative:active {
121
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 90%, var(--color-sentiment-negative-primary));
122
- }
123
- .wds-list-item-prompt.positive,
124
- .wds-list-item-prompt.discount,
125
- .wds-list-item-prompt.savings {
126
- background-color: var(--color-sentiment-positive-secondary);
127
- color: var(--color-sentiment-positive-primary);
128
- }
129
- .wds-list-item-prompt.positive a,
130
- .wds-list-item-prompt.discount a,
131
- .wds-list-item-prompt.savings a {
132
- color: var(--color-sentiment-positive-primary);
133
- }
134
- .wds-list-item-prompt.positive a:hover,
135
- .wds-list-item-prompt.discount a:hover,
136
- .wds-list-item-prompt.savings a:hover {
137
- color: var(--color-sentiment-positive-primary-hover);
138
- }
139
- .wds-list-item-prompt.positive a:active,
140
- .wds-list-item-prompt.discount a:active,
141
- .wds-list-item-prompt.savings a:active {
142
- color: var(--color-sentiment-positive-primary-active);
143
- }
144
- .np-prompt-interactive.wds-list-item-prompt.positive:hover,
145
- .np-prompt-interactive.wds-list-item-prompt.discount:hover,
146
- .np-prompt-interactive.wds-list-item-prompt.savings:hover {
147
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 95%, var(--color-sentiment-positive-primary));
148
- }
149
- .np-prompt-interactive.wds-list-item-prompt.positive:active,
150
- .np-prompt-interactive.wds-list-item-prompt.discount:active,
151
- .np-prompt-interactive.wds-list-item-prompt.savings:active {
152
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 90%, var(--color-sentiment-positive-primary));
153
- }
154
- .wds-list-item-prompt.neutral {
155
- background-color: rgba(134,167,189,0.10196);
156
- background-color: var(--color-background-neutral);
157
- color: #37517e;
158
- color: var(--color-content-primary);
159
- }
160
- .wds-list-item-prompt.neutral a {
161
- color: #37517e;
162
- color: var(--color-content-primary);
163
- }
164
- .np-prompt-interactive.wds-list-item-prompt.neutral:hover {
165
- background-color: var(--color-background-neutral-hover);
166
- }
167
- .np-prompt-interactive.wds-list-item-prompt.neutral:active {
168
- background-color: var(--color-background-neutral-active);
169
- }
170
- .wds-list-item-prompt.warning {
171
- background-color: var(--color-sentiment-warning-secondary);
172
- color: var(--color-sentiment-warning-content);
173
- }
174
- .wds-list-item-prompt.warning a {
175
- color: var(--color-sentiment-warning-content);
176
- }
177
- .wds-list-item-prompt.warning a:hover {
178
- color: var(--color-sentiment-warning-content-hover);
179
- }
180
- .wds-list-item-prompt.warning a:active {
181
- color: var(--color-sentiment-warning-content-active);
182
- }
183
- .np-prompt-interactive.wds-list-item-prompt.warning:hover {
184
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 90%, var(--color-sentiment-warning-primary));
185
- }
186
- .np-prompt-interactive.wds-list-item-prompt.warning:active {
187
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 80%, var(--color-sentiment-warning-primary));
188
- }
@@ -1,84 +0,0 @@
1
- <?xml version="1.0" encoding="utf-8"?>
2
- <!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
- <svg version="1.1" id="Artwork" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
4
- width="165.52107px" height="105.9651px" viewBox="0 0 165.52107 105.9651" enable-background="new 0 0 165.52107 105.9651"
5
- xml:space="preserve">
6
- <g>
7
- <path id="XMLID_4_" d="M150.69807,0H14.82318c-0.5659,0-1.1328,0-1.69769,0.0033c-0.47751,0.0034-0.95391,0.0087-1.43031,0.0217
8
- c-1.039,0.0281-2.0869,0.0894-3.1129,0.2738c-1.0424,0.1876-2.0124,0.4936-2.9587,0.9754
9
- c-0.9303,0.4731-1.782,1.0919-2.52009,1.8303c-0.73841,0.7384-1.35721,1.5887-1.83021,2.52
10
- c-0.4819,0.9463-0.7881,1.9166-0.9744,2.9598c-0.18539,1.0263-0.2471,2.074-0.2751,3.1119
11
- c-0.0128,0.4764-0.01829,0.9528-0.0214,1.4291c-0.0033,0.5661-0.0022,1.1318-0.0022,1.6989V91.142
12
- c0,0.5671-0.0011,1.13181,0.0022,1.69901c0.00311,0.4763,0.0086,0.9527,0.0214,1.4291
13
- c0.028,1.03699,0.08971,2.08469,0.2751,3.11069c0.1863,1.0436,0.4925,2.0135,0.9744,2.9599
14
- c0.473,0.9313,1.0918,1.7827,1.83021,2.52c0.73809,0.7396,1.58979,1.3583,2.52009,1.8302
15
- c0.9463,0.4831,1.9163,0.7892,2.9587,0.9767c1.026,0.1832,2.0739,0.2456,3.1129,0.2737c0.4764,0.0108,0.9528,0.0172,1.43031,0.0194
16
- c0.56489,0.0044,1.13179,0.0044,1.69769,0.0044h135.87489c0.5649,0,1.13181,0,1.69659-0.0044
17
- c0.47641-0.0022,0.95282-0.0086,1.4314-0.0194c1.0368-0.0281,2.0845-0.0905,3.11301-0.2737
18
- c1.041-0.1875,2.0112-0.4936,2.9576-0.9767c0.9313-0.4719,1.7805-1.0906,2.52011-1.8302c0.7372-0.7373,1.35599-1.5887,1.8302-2.52
19
- c0.48299-0.9464,0.78889-1.9163,0.97429-2.9599c0.1855-1.026,0.2457-2.0737,0.2738-3.11069
20
- c0.013-0.4764,0.01941-0.9528,0.02161-1.4291c0.00439-0.5672,0.00439-1.1319,0.00439-1.69901V14.8242
21
- c0-0.5671,0-1.1328-0.00439-1.6989c-0.0022-0.4763-0.00861-0.9527-0.02161-1.4291c-0.02811-1.0379-0.0883-2.0856-0.2738-3.1119
22
- c-0.18539-1.0432-0.4913-2.0135-0.97429-2.9598c-0.47421-0.9313-1.093-1.7816-1.8302-2.52
23
- c-0.73961-0.7384-1.58881-1.3572-2.52011-1.8303c-0.9464-0.4818-1.9166-0.7878-2.9576-0.9754
24
- c-1.0285-0.1844-2.0762-0.2457-3.11301-0.2738c-0.47858-0.013-0.95499-0.0183-1.4314-0.0217C151.82988,0,151.26297,0,150.69807,0
25
- L150.69807,0z"/>
26
- <path id="XMLID_3_" fill="#FFFFFF" d="M150.69807,3.532l1.67149,0.0032c0.4528,0.0032,0.90561,0.0081,1.36092,0.0205
27
- c0.79201,0.0214,1.71849,0.0643,2.58209,0.2191c0.7507,0.1352,1.38029,0.3408,1.9845,0.6484
28
- c0.5965,0.3031,1.14301,0.7003,1.62019,1.1768c0.479,0.4797,0.87671,1.0271,1.18381,1.6302
29
- c0.30589,0.5995,0.51019,1.2261,0.64459,1.9823c0.1544,0.8542,0.1971,1.7832,0.21881,2.5801
30
- c0.01219,0.4498,0.01819,0.8996,0.0204,1.3601c0.00429,0.5569,0.0042,1.1135,0.0042,1.6715V91.142
31
- c0,0.558,0.00009,1.1136-0.0043,1.6824c-0.00211,0.4497-0.0081,0.8995-0.0204,1.3501c-0.02161,0.7957-0.0643,1.7242-0.2206,2.5885
32
- c-0.13251,0.7458-0.3367,1.3725-0.64429,1.975c-0.30621,0.6016-0.70331,1.1484-1.18022,1.6251
33
- c-0.47989,0.48-1.0246,0.876-1.62819,1.1819c-0.5997,0.3061-1.22821,0.51151-1.97151,0.6453
34
- c-0.88109,0.157-1.84639,0.2002-2.57339,0.2199c-0.4574,0.0103-0.9126,0.01649-1.37889,0.0187
35
- c-0.55571,0.0043-1.1134,0.0042-1.6692,0.0042H14.82318c-0.0074,0-0.0146,0-0.0221,0c-0.5494,0-1.0999,0-1.6593-0.0043
36
- c-0.4561-0.00211-0.9112-0.0082-1.3512-0.0182c-0.7436-0.0201-1.7095-0.0632-2.5834-0.2193
37
- c-0.74969-0.1348-1.3782-0.3402-1.9858-0.6503c-0.59789-0.3032-1.1422-0.6988-1.6223-1.1797
38
- c-0.4764-0.4756-0.8723-1.0207-1.1784-1.6232c-0.3064-0.6019-0.5114-1.2305-0.64619-1.9852
39
- c-0.15581-0.8626-0.19861-1.7874-0.22-2.5777c-0.01221-0.4525-0.01731-0.9049-0.02021-1.3547l-0.0022-1.3279l0.0001-0.3506V14.8242
40
- l-0.0001-0.3506l0.0021-1.3251c0.003-0.4525,0.0081-0.9049,0.02031-1.357c0.02139-0.7911,0.06419-1.7163,0.22129-2.5861
41
- c0.1336-0.7479,0.3385-1.3765,0.6465-1.9814c0.3037-0.5979,0.7003-1.1437,1.17921-1.6225
42
- c0.477-0.4772,1.02309-0.8739,1.62479-1.1799c0.6011-0.3061,1.2308-0.5116,1.9805-0.6465c0.8638-0.1552,1.7909-0.198,2.5849-0.2195
43
- c0.4526-0.0123,0.9052-0.0172,1.3544-0.0203l1.6771-0.0033H150.69807"/>
44
- <g>
45
- <g>
46
- <path d="M45.1862,35.64053c1.41724-1.77266,2.37897-4.15282,2.12532-6.58506c-2.07464,0.10316-4.60634,1.36871-6.07207,3.14276
47
- c-1.31607,1.5192-2.4809,3.99902-2.17723,6.3293C41.39111,38.72954,43.71785,37.36345,45.1862,35.64053"/>
48
- <path d="M47.28506,38.98252c-3.38211-0.20146-6.25773,1.91951-7.87286,1.91951c-1.61602,0-4.08931-1.81799-6.76438-1.76899
49
- c-3.48177,0.05114-6.71245,2.01976-8.4793,5.15079c-3.63411,6.2636-0.95904,15.55471,2.57494,20.65606
50
- c1.71618,2.5238,3.78447,5.30269,6.50976,5.20287c2.57494-0.10104,3.58421-1.66732,6.71416-1.66732
51
- c3.12765,0,4.03679,1.66732,6.76252,1.61681c2.82665-0.05054,4.59381-2.52506,6.30997-5.05132
52
- c1.96878-2.877,2.77473-5.65498,2.82542-5.80748c-0.0507-0.05051-5.45058-2.12204-5.50065-8.33358
53
- c-0.05098-5.20101,4.23951-7.6749,4.44144-7.82832C52.3832,39.4881,48.5975,39.08404,47.28506,38.98252"/>
54
- </g>
55
- <g>
56
- <path d="M76.73385,31.94381c7.35096,0,12.4697,5.06708,12.4697,12.44437c0,7.40363-5.22407,12.49704-12.65403,12.49704h-8.13892
57
- v12.94318h-5.88037v-37.8846H76.73385z M68.41059,51.9493h6.74732c5.11975,0,8.0336-2.75636,8.0336-7.53479
58
- c0-4.77792-2.91385-7.50845-8.00727-7.50845h-6.77365V51.9493z"/>
59
- <path d="M90.73997,61.97864c0-4.8311,3.70182-7.79761,10.26583-8.16526l7.56061-0.44614v-2.12639
60
- c0-3.07185-2.07423-4.90959-5.53905-4.90959c-3.28251,0-5.33041,1.57492-5.82871,4.04313h-5.35574
61
- c0.31499-4.98859,4.56777-8.66407,11.3941-8.66407c6.69466,0,10.97377,3.54432,10.97377,9.08388v19.03421h-5.43472v-4.54194
62
- h-0.13065c-1.60125,3.07185-5.09341,5.01441-8.71623,5.01441C94.52078,70.30088,90.73997,66.94038,90.73997,61.97864z
63
- M108.56641,59.4846v-2.17905l-6.8,0.41981c-3.38683,0.23649-5.30306,1.73291-5.30306,4.09579
64
- c0,2.41504,1.99523,3.99046,5.04075,3.99046C105.46823,65.81161,108.56641,63.08108,108.56641,59.4846z"/>
65
- <path d="M119.34167,79.9889v-4.5946c0.4193,0.10483,1.36425,0.10483,1.83723,0.10483c2.6252,0,4.04313-1.10245,4.90908-3.9378
66
- c0-0.05267,0.49931-1.68025,0.49931-1.70658l-9.97616-27.64562h6.14268l6.98432,22.47371h0.10432l6.98433-22.47371h5.9857
67
- l-10.34483,29.06304c-2.36186,6.69517-5.0924,8.84789-10.81577,8.84789C121.17891,80.12006,119.76098,80.06739,119.34167,79.9889
68
- z"/>
69
- </g>
70
- </g>
71
- </g>
72
- <g>
73
- </g>
74
- <g>
75
- </g>
76
- <g>
77
- </g>
78
- <g>
79
- </g>
80
- <g>
81
- </g>
82
- <g>
83
- </g>
84
- </svg>
@@ -1,43 +0,0 @@
1
- import { ReactNode } from 'react';
2
- export type ListItemTypes = 'non-interactive' | 'navigation' | 'radio' | 'checkbox' | 'switch' | 'button' | 'icon-button';
3
- export type Props = {
4
- as?: 'li' | 'div' | 'span';
5
- inverted?: boolean;
6
- disabled?: boolean;
7
- spotlight?: 'active' | 'inactive';
8
- title: ReactNode;
9
- subtitle?: ReactNode;
10
- additionalInfo?: ReactNode;
11
- valueTitle?: ReactNode;
12
- valueSubtitle?: ReactNode;
13
- media?: ReactNode;
14
- control?: ReactNode;
15
- prompt?: ReactNode;
16
- };
17
- export type ListItemContextData = {
18
- setControlType: (type: ListItemTypes) => void;
19
- ids: {
20
- label: string;
21
- additionalInfo: string;
22
- value: string;
23
- control: string;
24
- prompt: string;
25
- };
26
- props: Pick<Props, 'as' | 'disabled' | 'inverted'>;
27
- };
28
- export declare const ListItemContext: import("react").Context<ListItemContextData>;
29
- export declare const ListItem: {
30
- ({ as: View, title, subtitle, additionalInfo, prompt, inverted, media, spotlight, valueTitle, valueSubtitle, control, disabled, }: Props): import("react").JSX.Element;
31
- Image: ({ alt, size, ...props }: import("./ListItemMedia").ItemImageProps) => import("react").JSX.Element;
32
- AvatarView: ({ className, size, ...props }: import("./ListItemMedia").ItemAvatarViewProps) => import("react").JSX.Element;
33
- AvatarLayout: ({ className, size, ...props }: import("./ListItemMedia").ItemAvatarLayoutProps) => import("react").JSX.Element;
34
- AdditionalInfo: ({ children, action }: import("./ListItemAdditionalInfo").ItemAdditionalInfoProps) => import("react").JSX.Element;
35
- Checkbox: (props: import("./ListItemCheckbox").ItemCheckboxProps) => import("react").JSX.Element;
36
- IconButton: (props: import("./ListItemIconButton").ItemIconButtonProps) => import("react").JSX.Element;
37
- Navigation: ({ onClick }: import("./ListItemNavigation").ItemNavigationProps) => import("react").JSX.Element;
38
- Button: ({ priority, ...props }: import("./ListItemButton").ItemButtonProps) => import("react").JSX.Element;
39
- Switch: (props: import("..").SwitchProps) => import("react").JSX.Element;
40
- Prompt: ({ type, children, action }: import("./prompt/Prompt").ItemPromptProps) => import("react").JSX.Element;
41
- };
42
- export default ListItem;
43
- //# sourceMappingURL=ListItem.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,SAAS,EAA4B,MAAM,OAAO,CAAC;AAa3E,MAAM,MAAM,aAAa,GACrB,iBAAiB,GACjB,YAAY,GACZ,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,aAAa,CAAC;AAElB,MAAM,MAAM,KAAK,GAAG;IAClB,EAAE,CAAC,EAAE,IAAI,GAAG,KAAK,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,GAAG,EAAE;QACH,KAAK,EAAE,MAAM,CAAC;QACd,cAAc,EAAE,MAAM,CAAC;QACvB,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,GAAG,UAAU,GAAG,UAAU,CAAC,CAAC;CACpD,CAAC;AAIF,eAAO,MAAM,eAAe,8CAA2C,CAAC;AAExE,eAAO,MAAM,QAAQ;uIAalB,KAAK;;;;;;;;;;;CAqGP,CAAC;AAeF,eAAe,QAAQ,CAAC"}
@@ -1,9 +0,0 @@
1
- import { PropsWithChildren } from 'react';
2
- import { LinkProps } from '../link';
3
- export type ItemAdditionalInfoProps = PropsWithChildren<{
4
- action?: Pick<LinkProps, 'href' | 'onClick' | 'target'> & {
5
- label?: string;
6
- };
7
- }>;
8
- export declare const AdditionalInfo: ({ children, action }: ItemAdditionalInfoProps) => import("react").JSX.Element;
9
- //# sourceMappingURL=ListItemAdditionalInfo.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemAdditionalInfo.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemAdditionalInfo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAC;AAGtD,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAG1C,MAAM,MAAM,uBAAuB,GAAG,iBAAiB,CAAC;IACtD,MAAM,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC,GAAG;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC9E,CAAC,CAAC;AAEH,eAAO,MAAM,cAAc,yBAAmC,uBAAuB,gCAoBpF,CAAC"}
@@ -1,4 +0,0 @@
1
- import { NewButtonProps } from '../button';
2
- export type ItemButtonProps = Omit<NewButtonProps, 'v2' | 'size' | 'disabled'>;
3
- export declare const Button: ({ priority, ...props }: ItemButtonProps) => import("react").JSX.Element;
4
- //# sourceMappingURL=ListItemButton.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemButton.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,cAAc,EAAE,MAAM,WAAW,CAAC;AAGlE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,cAAc,EAAE,IAAI,GAAG,MAAM,GAAG,UAAU,CAAC,CAAC;AAE/E,eAAO,MAAM,MAAM,2BAA0C,eAAe,gCAY3E,CAAC"}
@@ -1,4 +0,0 @@
1
- import { CheckboxButtonProps } from '../checkboxButton/CheckboxButton';
2
- export type ItemCheckboxProps = Pick<CheckboxButtonProps, 'checked' | 'indeterminate' | 'onChange'>;
3
- export declare const Checkbox: (props: ItemCheckboxProps) => import("react").JSX.Element;
4
- //# sourceMappingURL=ListItemCheckbox.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemCheckbox.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemCheckbox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAGvE,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,mBAAmB,EAAE,SAAS,GAAG,eAAe,GAAG,UAAU,CAAC,CAAC;AAEpG,eAAO,MAAM,QAAQ,UAAoB,iBAAiB,gCAIzD,CAAC"}
@@ -1,7 +0,0 @@
1
- import { IconButtonProps } from '../iconButton';
2
- import { ReactNode } from 'react';
3
- export type ItemIconButtonProps = Pick<IconButtonProps, 'onClick' | 'href' | 'target'> & {
4
- children: ReactNode;
5
- };
6
- export declare const IconButton: (props: ItemIconButtonProps) => import("react").JSX.Element;
7
- //# sourceMappingURL=ListItemIconButton.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ListItemIconButton.d.ts","sourceRoot":"","sources":["../../../src/listItem/ListItemIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,eAAe,EAAE,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAC,GAAG;IACvF,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,UAAU,UAAoB,mBAAmB,gCAI7D,CAAC"}