@transferwise/components 0.0.0-experimental-bd2aa28 → 0.0.0-experimental-1664fea

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 (84) hide show
  1. package/build/i18n/en.json +0 -2
  2. package/build/i18n/en.json.js +0 -2
  3. package/build/i18n/en.json.js.map +1 -1
  4. package/build/i18n/en.json.mjs +0 -2
  5. package/build/i18n/en.json.mjs.map +1 -1
  6. package/build/index.js +0 -3
  7. package/build/index.js.map +1 -1
  8. package/build/index.mjs +1 -2
  9. package/build/index.mjs.map +1 -1
  10. package/build/main.css +0 -256
  11. package/build/styles/main.css +0 -256
  12. package/build/types/index.d.ts +0 -4
  13. package/build/types/index.d.ts.map +1 -1
  14. package/build/types/test-utils/index.d.ts +0 -4
  15. package/build/types/test-utils/index.d.ts.map +1 -1
  16. package/package.json +1 -1
  17. package/src/i18n/en.json +0 -2
  18. package/src/index.ts +0 -4
  19. package/src/main.css +0 -256
  20. package/src/main.less +0 -2
  21. package/src/ssr.spec.tsx +0 -1
  22. package/build/selectOption/SelectOption.js +0 -131
  23. package/build/selectOption/SelectOption.js.map +0 -1
  24. package/build/selectOption/SelectOption.messages.js +0 -17
  25. package/build/selectOption/SelectOption.messages.js.map +0 -1
  26. package/build/selectOption/SelectOption.messages.mjs +0 -13
  27. package/build/selectOption/SelectOption.messages.mjs.map +0 -1
  28. package/build/selectOption/SelectOption.mjs +0 -127
  29. package/build/selectOption/SelectOption.mjs.map +0 -1
  30. package/build/styles/listItem/ListItem.css +0 -212
  31. package/build/styles/selectOption/SelectOption.css +0 -44
  32. package/build/types/listItem/ListItem.d.ts +0 -50
  33. package/build/types/listItem/ListItem.d.ts.map +0 -1
  34. package/build/types/listItem/ListItemAdditionalInfo.d.ts +0 -9
  35. package/build/types/listItem/ListItemAdditionalInfo.d.ts.map +0 -1
  36. package/build/types/listItem/ListItemButton.d.ts +0 -6
  37. package/build/types/listItem/ListItemButton.d.ts.map +0 -1
  38. package/build/types/listItem/ListItemCheckbox.d.ts +0 -4
  39. package/build/types/listItem/ListItemCheckbox.d.ts.map +0 -1
  40. package/build/types/listItem/ListItemIconButton.d.ts +0 -8
  41. package/build/types/listItem/ListItemIconButton.d.ts.map +0 -1
  42. package/build/types/listItem/ListItemMedia.d.ts +0 -19
  43. package/build/types/listItem/ListItemMedia.d.ts.map +0 -1
  44. package/build/types/listItem/ListItemNavigation.d.ts +0 -4
  45. package/build/types/listItem/ListItemNavigation.d.ts.map +0 -1
  46. package/build/types/listItem/ListItemSwitch.d.ts +0 -3
  47. package/build/types/listItem/ListItemSwitch.d.ts.map +0 -1
  48. package/build/types/listItem/index.d.ts +0 -6
  49. package/build/types/listItem/index.d.ts.map +0 -1
  50. package/build/types/listItem/prompt/Prompt.d.ts +0 -12
  51. package/build/types/listItem/prompt/Prompt.d.ts.map +0 -1
  52. package/build/types/listItem/useItemControl.d.ts +0 -5
  53. package/build/types/listItem/useItemControl.d.ts.map +0 -1
  54. package/build/types/selectOption/SelectOption.d.ts +0 -21
  55. package/build/types/selectOption/SelectOption.d.ts.map +0 -1
  56. package/build/types/selectOption/SelectOption.messages.d.ts +0 -12
  57. package/build/types/selectOption/SelectOption.messages.d.ts.map +0 -1
  58. package/build/types/selectOption/index.d.ts +0 -3
  59. package/build/types/selectOption/index.d.ts.map +0 -1
  60. package/src/listItem/ListItem.css +0 -212
  61. package/src/listItem/ListItem.less +0 -210
  62. package/src/listItem/ListItem.spec.tsx +0 -35
  63. package/src/listItem/ListItem.story.tsx +0 -461
  64. package/src/listItem/ListItem.tsx +0 -282
  65. package/src/listItem/ListItemAdditionalInfo.tsx +0 -31
  66. package/src/listItem/ListItemButton.spec.tsx +0 -92
  67. package/src/listItem/ListItemButton.tsx +0 -24
  68. package/src/listItem/ListItemCheckbox.tsx +0 -14
  69. package/src/listItem/ListItemIconButton.tsx +0 -16
  70. package/src/listItem/ListItemMedia.tsx +0 -52
  71. package/src/listItem/ListItemNavigation.tsx +0 -23
  72. package/src/listItem/ListItemSwitch.tsx +0 -8
  73. package/src/listItem/index.ts +0 -10
  74. package/src/listItem/prompt/Prompt.spec.tsx +0 -77
  75. package/src/listItem/prompt/Prompt.story.tsx +0 -170
  76. package/src/listItem/prompt/Prompt.tsx +0 -44
  77. package/src/listItem/useItemControl.tsx +0 -23
  78. package/src/selectOption/SelectOption.css +0 -44
  79. package/src/selectOption/SelectOption.less +0 -40
  80. package/src/selectOption/SelectOption.messages.ts +0 -12
  81. package/src/selectOption/SelectOption.spec.tsx +0 -83
  82. package/src/selectOption/SelectOption.story.tsx +0 -277
  83. package/src/selectOption/SelectOption.tsx +0 -151
  84. package/src/selectOption/index.ts +0 -2
@@ -28,8 +28,6 @@
28
28
  "neptune.PhoneNumberInput.phoneNumberLabel": "Phone number",
29
29
  "neptune.Select.searchPlaceholder": "Search...",
30
30
  "neptune.SelectInput.noResultsFound": "No results found",
31
- "neptune.SelectOption.action.label": "Choose",
32
- "neptune.SelectOption.selected.action.label": "Change chosen option",
33
31
  "neptune.StatusIcon.iconLabel.error": "Error:",
34
32
  "neptune.StatusIcon.iconLabel.information": "Information:",
35
33
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -32,8 +32,6 @@ var en = {
32
32
  "neptune.PhoneNumberInput.phoneNumberLabel": "Phone number",
33
33
  "neptune.Select.searchPlaceholder": "Search...",
34
34
  "neptune.SelectInput.noResultsFound": "No results found",
35
- "neptune.SelectOption.action.label": "Choose",
36
- "neptune.SelectOption.selected.action.label": "Change chosen option",
37
35
  "neptune.StatusIcon.iconLabel.error": "Error:",
38
36
  "neptune.StatusIcon.iconLabel.information": "Information:",
39
37
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -28,8 +28,6 @@ var en = {
28
28
  "neptune.PhoneNumberInput.phoneNumberLabel": "Phone number",
29
29
  "neptune.Select.searchPlaceholder": "Search...",
30
30
  "neptune.SelectInput.noResultsFound": "No results found",
31
- "neptune.SelectOption.action.label": "Choose",
32
- "neptune.SelectOption.selected.action.label": "Change chosen option",
33
31
  "neptune.StatusIcon.iconLabel.error": "Error:",
34
32
  "neptune.StatusIcon.iconLabel.information": "Information:",
35
33
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/index.js CHANGED
@@ -4,7 +4,6 @@
4
4
  var Accordion = require('./accordion/Accordion.js');
5
5
  var ActionButton = require('./actionButton/ActionButton.js');
6
6
  var ActionOption = require('./actionOption/ActionOption.js');
7
- var SelectOption = require('./selectOption/SelectOption.js');
8
7
  var Alert = require('./alert/Alert.js');
9
8
  var avatarTypes = require('./avatar/avatarTypes.js');
10
9
  var Avatar = require('./avatar/Avatar.js');
@@ -144,7 +143,6 @@ var withId = require('./withId/withId.js');
144
143
  exports.Accordion = Accordion.default;
145
144
  exports.ActionButton = ActionButton.default;
146
145
  exports.ActionOption = ActionOption.default;
147
- exports.SelectOption = SelectOption.default;
148
146
  exports.Alert = Alert.default;
149
147
  Object.defineProperty(exports, "AlertArrowPosition", {
150
148
  enumerable: true,
@@ -274,7 +272,6 @@ Object.defineProperty(exports, "UploadStep", {
274
272
  get: function () { return Upload.UploadStep; }
275
273
  });
276
274
  exports.UploadInput = UploadInput.default;
277
- exports.Item = Table.default;
278
275
  exports.Table = Table.default;
279
276
  exports.useDirection = useDirection.useDirection;
280
277
  exports.useLayout = useLayout.useLayout;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/index.mjs CHANGED
@@ -2,7 +2,6 @@
2
2
  export { default as Accordion } from './accordion/Accordion.mjs';
3
3
  export { default as ActionButton } from './actionButton/ActionButton.mjs';
4
4
  export { default as ActionOption } from './actionOption/ActionOption.mjs';
5
- export { default as SelectOption } from './selectOption/SelectOption.mjs';
6
5
  export { default as Alert, AlertArrowPosition } from './alert/Alert.mjs';
7
6
  export { AvatarType } from './avatar/avatarTypes.mjs';
8
7
  export { default as Avatar } from './avatar/Avatar.mjs';
@@ -105,7 +104,7 @@ export { default as Tooltip } from './tooltip/Tooltip.mjs';
105
104
  export { default as Typeahead } from './typeahead/Typeahead.mjs';
106
105
  export { default as Upload, UploadStep } from './upload/Upload.mjs';
107
106
  export { default as UploadInput } from './uploadInput/UploadInput.mjs';
108
- export { default as Item, default as Table } from './table/Table.mjs';
107
+ export { default as Table } from './table/Table.mjs';
109
108
  import '@transferwise/neptune-validation';
110
109
  export { useDirection } from './common/hooks/useDirection/useDirection.mjs';
111
110
  export { useLayout } from './common/hooks/useLayout/useLayout.mjs';
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/main.css CHANGED
@@ -1789,50 +1789,6 @@ button.np-option {
1789
1789
  margin-top: -3px;
1790
1790
  }
1791
1791
  }
1792
- .np-select-option {
1793
- border-radius: 10px;
1794
- border-radius: var(--radius-small);
1795
- padding: 16px;
1796
- padding: var(--size-16);
1797
- }
1798
- .np-select-option-placeholder {
1799
- background-color: rgba(134,167,189,0.10196);
1800
- background-color: var(--color-background-neutral);
1801
- }
1802
- .np-select-option-placeholder:not(.disabled):hover {
1803
- background-color: var(--color-background-neutral-hover);
1804
- }
1805
- .np-select-option-placeholder:not(.disabled):focus,
1806
- .np-select-option-placeholder:not(.disabled):active {
1807
- background-color: var(--color-background-neutral-active);
1808
- }
1809
- .np-select-option-selected {
1810
- border: 1px solid #c9cbce;
1811
- border: 1px solid var(--color-interactive-secondary);
1812
- }
1813
- .np-select-option-list {
1814
- max-height: 350px;
1815
- overflow-y: auto;
1816
- }
1817
- .np-select-option-list > .np-section {
1818
- margin-top: 0;
1819
- }
1820
- .has-error * .np-select-option {
1821
- --ring-outline-color: var(--color-sentiment-negative);
1822
- --ring-outline-width: 3px;
1823
- --ring-outline-offset: calc(-1 * var(--ring-outline-width));
1824
- outline: var(--ring-outline-color) solid 3px;
1825
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
1826
- outline-offset: calc(-1 * 3px);
1827
- outline-offset: var(--ring-outline-offset);
1828
- }
1829
- .has-error * .np-select-option:focus {
1830
- outline: none;
1831
- }
1832
- .has-error * .np-select-option:focus-visible {
1833
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
1834
- outline-offset: var(--ring-outline-offset);
1835
- }
1836
1792
  .np-panel__content {
1837
1793
  opacity: 0;
1838
1794
  visibility: hidden;
@@ -2662,218 +2618,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2662
2618
  border-radius: 9999px !important;
2663
2619
  border-radius: var(--radius-full) !important;
2664
2620
  }
2665
- .wds-list-item {
2666
- list-style: none;
2667
- width: 100%;
2668
- padding: 0;
2669
- border-radius: 16px;
2670
- border-radius: var(--radius-medium);
2671
- background-color: #ffffff;
2672
- background-color: var(--color-background-screen);
2673
- gap: 16px;
2674
- gap: var(--size-16);
2675
- }
2676
- .wds-list-item .partially-interactive {
2677
- padding: 16px;
2678
- padding: var(--size-16);
2679
- }
2680
- .wds-list-item label,
2681
- .wds-list-item a {
2682
- padding: 16px;
2683
- padding: var(--size-16);
2684
- }
2685
- .wds-list-item-interactive label {
2686
- cursor: pointer;
2687
- }
2688
- .wds-list-item-interactive:hover {
2689
- background-color: var(--color-background-screen-hover);
2690
- }
2691
- .wds-list-item-interactive:hover .wds-list-item-control .wds-Button {
2692
- background-color: var(--Button-background-hover);
2693
- color: var(--Button-color-hover);
2694
- transition: none;
2695
- }
2696
- .wds-list-item-interactive:active {
2697
- background-color: var(--color-background-screen-active);
2698
- }
2699
- .wds-list-item-interactive .wds-list-item-control .wds-Button {
2700
- transition: none;
2701
- }
2702
- .wds-list-item-media-image {
2703
- width: var(--item-media-image-size);
2704
- height: var(--item-media-image-size);
2705
- }
2706
- .wds-list-item-body {
2707
- width: 100%;
2708
- }
2709
- .wds-list-item-title {
2710
- color: #37517e;
2711
- color: var(--color-content-primary);
2712
- }
2713
- .wds-list-item-additional-info {
2714
- color: #768e9c;
2715
- color: var(--color-content-tertiary);
2716
- }
2717
- .wds-list-item-value {
2718
- flex: 0 0 auto;
2719
- }
2720
- .wds-list-item-control {
2721
- flex: 0 0 auto;
2722
- }
2723
- .wds-list-item-navigation,
2724
- .wds-list-item-navigation:hover,
2725
- .wds-list-item-navigation:focus {
2726
- -webkit-text-decoration: none;
2727
- text-decoration: none;
2728
- }
2729
- .wds-list-item-spotlight-active {
2730
- background-color: rgba(134,167,189,0.10196);
2731
- background-color: var(--color-background-neutral);
2732
- }
2733
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):hover {
2734
- background-color: var(--color-background-neutral-hover);
2735
- }
2736
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):active {
2737
- background-color: var(--color-background-neutral-active);
2738
- }
2739
- .wds-list-item-spotlight-inactive {
2740
- background-color: rgba(134, 167, 189, 0.025);
2741
- border: 1px dashed rgba(0,0,0,0.10196);
2742
- border: 1px dashed var(--color-border-neutral);
2743
- }
2744
- @supports (color: color-mix(in lch, red, blue)) {
2745
- .wds-list-item-spotlight-inactive {
2746
- background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
2747
- }
2748
- }
2749
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
2750
- background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
2751
- }
2752
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
2753
- background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
2754
- }
2755
- .wds-list-item-prompt {
2756
- display: inline-flex;
2757
- padding-top: calc(8px / 2);
2758
- padding-top: calc(var(--padding-x-small) / 2);
2759
- padding-bottom: calc(8px / 2);
2760
- padding-bottom: calc(var(--padding-x-small) / 2);
2761
- padding-left: calc(8px - 1px);
2762
- padding-left: calc(var(--padding-x-small) - 1px);
2763
- padding-right: 8px;
2764
- padding-right: var(--padding-x-small);
2765
- border-radius: 10px;
2766
- border-radius: var(--radius-small);
2767
- word-break: break-word;
2768
- word-wrap: break-word;
2769
- }
2770
- .wds-list-item-prompt .np-prompt-icon {
2771
- padding-right: calc(12px / 2);
2772
- padding-right: calc(var(--size-12) / 2);
2773
- padding-top: calc(4px - 1px);
2774
- padding-top: calc(var(--size-4) - 1px);
2775
- padding-bottom: calc(4px - 1px);
2776
- padding-bottom: calc(var(--size-4) - 1px);
2777
- }
2778
- .wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
2779
- .wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
2780
- color: var(--color-sentiment-positive-primary);
2781
- }
2782
- .wds-list-item-prompt a {
2783
- text-underline-offset: calc(4px / 2);
2784
- text-underline-offset: calc(var(--size-4) / 2);
2785
- }
2786
- .wds-list-item-prompt.np-prompt-interactive {
2787
- -webkit-text-decoration: none;
2788
- text-decoration: none;
2789
- cursor: pointer;
2790
- border: none;
2791
- }
2792
- .wds-list-item-prompt.negative {
2793
- background-color: var(--color-sentiment-negative-secondary);
2794
- color: var(--color-sentiment-negative-primary);
2795
- }
2796
- .wds-list-item-prompt.negative a {
2797
- color: var(--color-sentiment-negative-primary);
2798
- }
2799
- .wds-list-item-prompt.negative a:hover {
2800
- color: var(--color-sentiment-negative-primary-hover);
2801
- }
2802
- .wds-list-item-prompt.negative a:active {
2803
- color: var(--color-sentiment-negative-primary-active);
2804
- }
2805
- .np-prompt-interactive.wds-list-item-prompt.negative:hover {
2806
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 95%, var(--color-sentiment-negative-primary));
2807
- }
2808
- .np-prompt-interactive.wds-list-item-prompt.negative:active {
2809
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 90%, var(--color-sentiment-negative-primary));
2810
- }
2811
- .wds-list-item-prompt.positive,
2812
- .wds-list-item-prompt.discount,
2813
- .wds-list-item-prompt.savings {
2814
- background-color: var(--color-sentiment-positive-secondary);
2815
- color: var(--color-sentiment-positive-primary);
2816
- }
2817
- .wds-list-item-prompt.positive a,
2818
- .wds-list-item-prompt.discount a,
2819
- .wds-list-item-prompt.savings a {
2820
- color: var(--color-sentiment-positive-primary);
2821
- }
2822
- .wds-list-item-prompt.positive a:hover,
2823
- .wds-list-item-prompt.discount a:hover,
2824
- .wds-list-item-prompt.savings a:hover {
2825
- color: var(--color-sentiment-positive-primary-hover);
2826
- }
2827
- .wds-list-item-prompt.positive a:active,
2828
- .wds-list-item-prompt.discount a:active,
2829
- .wds-list-item-prompt.savings a:active {
2830
- color: var(--color-sentiment-positive-primary-active);
2831
- }
2832
- .np-prompt-interactive.wds-list-item-prompt.positive:hover,
2833
- .np-prompt-interactive.wds-list-item-prompt.discount:hover,
2834
- .np-prompt-interactive.wds-list-item-prompt.savings:hover {
2835
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 95%, var(--color-sentiment-positive-primary));
2836
- }
2837
- .np-prompt-interactive.wds-list-item-prompt.positive:active,
2838
- .np-prompt-interactive.wds-list-item-prompt.discount:active,
2839
- .np-prompt-interactive.wds-list-item-prompt.savings:active {
2840
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 90%, var(--color-sentiment-positive-primary));
2841
- }
2842
- .wds-list-item-prompt.neutral {
2843
- background-color: rgba(134,167,189,0.10196);
2844
- background-color: var(--color-background-neutral);
2845
- color: #37517e;
2846
- color: var(--color-content-primary);
2847
- }
2848
- .wds-list-item-prompt.neutral a {
2849
- color: #37517e;
2850
- color: var(--color-content-primary);
2851
- }
2852
- .np-prompt-interactive.wds-list-item-prompt.neutral:hover {
2853
- background-color: var(--color-background-neutral-hover);
2854
- }
2855
- .np-prompt-interactive.wds-list-item-prompt.neutral:active {
2856
- background-color: var(--color-background-neutral-active);
2857
- }
2858
- .wds-list-item-prompt.warning {
2859
- background-color: var(--color-sentiment-warning-secondary);
2860
- color: var(--color-sentiment-warning-content);
2861
- }
2862
- .wds-list-item-prompt.warning a {
2863
- color: var(--color-sentiment-warning-content);
2864
- }
2865
- .wds-list-item-prompt.warning a:hover {
2866
- color: var(--color-sentiment-warning-content-hover);
2867
- }
2868
- .wds-list-item-prompt.warning a:active {
2869
- color: var(--color-sentiment-warning-content-active);
2870
- }
2871
- .np-prompt-interactive.wds-list-item-prompt.warning:hover {
2872
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 90%, var(--color-sentiment-warning-primary));
2873
- }
2874
- .np-prompt-interactive.wds-list-item-prompt.warning:active {
2875
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 80%, var(--color-sentiment-warning-primary));
2876
- }
2877
2621
  .np-field-control {
2878
2622
  margin-top: 4px;
2879
2623
  margin-top: var(--size-4);
@@ -1789,50 +1789,6 @@ button.np-option {
1789
1789
  margin-top: -3px;
1790
1790
  }
1791
1791
  }
1792
- .np-select-option {
1793
- border-radius: 10px;
1794
- border-radius: var(--radius-small);
1795
- padding: 16px;
1796
- padding: var(--size-16);
1797
- }
1798
- .np-select-option-placeholder {
1799
- background-color: rgba(134,167,189,0.10196);
1800
- background-color: var(--color-background-neutral);
1801
- }
1802
- .np-select-option-placeholder:not(.disabled):hover {
1803
- background-color: var(--color-background-neutral-hover);
1804
- }
1805
- .np-select-option-placeholder:not(.disabled):focus,
1806
- .np-select-option-placeholder:not(.disabled):active {
1807
- background-color: var(--color-background-neutral-active);
1808
- }
1809
- .np-select-option-selected {
1810
- border: 1px solid #c9cbce;
1811
- border: 1px solid var(--color-interactive-secondary);
1812
- }
1813
- .np-select-option-list {
1814
- max-height: 350px;
1815
- overflow-y: auto;
1816
- }
1817
- .np-select-option-list > .np-section {
1818
- margin-top: 0;
1819
- }
1820
- .has-error * .np-select-option {
1821
- --ring-outline-color: var(--color-sentiment-negative);
1822
- --ring-outline-width: 3px;
1823
- --ring-outline-offset: calc(-1 * var(--ring-outline-width));
1824
- outline: var(--ring-outline-color) solid 3px;
1825
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
1826
- outline-offset: calc(-1 * 3px);
1827
- outline-offset: var(--ring-outline-offset);
1828
- }
1829
- .has-error * .np-select-option:focus {
1830
- outline: none;
1831
- }
1832
- .has-error * .np-select-option:focus-visible {
1833
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
1834
- outline-offset: var(--ring-outline-offset);
1835
- }
1836
1792
  .np-panel__content {
1837
1793
  opacity: 0;
1838
1794
  visibility: hidden;
@@ -2662,218 +2618,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2662
2618
  border-radius: 9999px !important;
2663
2619
  border-radius: var(--radius-full) !important;
2664
2620
  }
2665
- .wds-list-item {
2666
- list-style: none;
2667
- width: 100%;
2668
- padding: 0;
2669
- border-radius: 16px;
2670
- border-radius: var(--radius-medium);
2671
- background-color: #ffffff;
2672
- background-color: var(--color-background-screen);
2673
- gap: 16px;
2674
- gap: var(--size-16);
2675
- }
2676
- .wds-list-item .partially-interactive {
2677
- padding: 16px;
2678
- padding: var(--size-16);
2679
- }
2680
- .wds-list-item label,
2681
- .wds-list-item a {
2682
- padding: 16px;
2683
- padding: var(--size-16);
2684
- }
2685
- .wds-list-item-interactive label {
2686
- cursor: pointer;
2687
- }
2688
- .wds-list-item-interactive:hover {
2689
- background-color: var(--color-background-screen-hover);
2690
- }
2691
- .wds-list-item-interactive:hover .wds-list-item-control .wds-Button {
2692
- background-color: var(--Button-background-hover);
2693
- color: var(--Button-color-hover);
2694
- transition: none;
2695
- }
2696
- .wds-list-item-interactive:active {
2697
- background-color: var(--color-background-screen-active);
2698
- }
2699
- .wds-list-item-interactive .wds-list-item-control .wds-Button {
2700
- transition: none;
2701
- }
2702
- .wds-list-item-media-image {
2703
- width: var(--item-media-image-size);
2704
- height: var(--item-media-image-size);
2705
- }
2706
- .wds-list-item-body {
2707
- width: 100%;
2708
- }
2709
- .wds-list-item-title {
2710
- color: #37517e;
2711
- color: var(--color-content-primary);
2712
- }
2713
- .wds-list-item-additional-info {
2714
- color: #768e9c;
2715
- color: var(--color-content-tertiary);
2716
- }
2717
- .wds-list-item-value {
2718
- flex: 0 0 auto;
2719
- }
2720
- .wds-list-item-control {
2721
- flex: 0 0 auto;
2722
- }
2723
- .wds-list-item-navigation,
2724
- .wds-list-item-navigation:hover,
2725
- .wds-list-item-navigation:focus {
2726
- -webkit-text-decoration: none;
2727
- text-decoration: none;
2728
- }
2729
- .wds-list-item-spotlight-active {
2730
- background-color: rgba(134,167,189,0.10196);
2731
- background-color: var(--color-background-neutral);
2732
- }
2733
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):hover {
2734
- background-color: var(--color-background-neutral-hover);
2735
- }
2736
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):active {
2737
- background-color: var(--color-background-neutral-active);
2738
- }
2739
- .wds-list-item-spotlight-inactive {
2740
- background-color: rgba(134, 167, 189, 0.025);
2741
- border: 1px dashed rgba(0,0,0,0.10196);
2742
- border: 1px dashed var(--color-border-neutral);
2743
- }
2744
- @supports (color: color-mix(in lch, red, blue)) {
2745
- .wds-list-item-spotlight-inactive {
2746
- background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
2747
- }
2748
- }
2749
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
2750
- background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
2751
- }
2752
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
2753
- background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
2754
- }
2755
- .wds-list-item-prompt {
2756
- display: inline-flex;
2757
- padding-top: calc(8px / 2);
2758
- padding-top: calc(var(--padding-x-small) / 2);
2759
- padding-bottom: calc(8px / 2);
2760
- padding-bottom: calc(var(--padding-x-small) / 2);
2761
- padding-left: calc(8px - 1px);
2762
- padding-left: calc(var(--padding-x-small) - 1px);
2763
- padding-right: 8px;
2764
- padding-right: var(--padding-x-small);
2765
- border-radius: 10px;
2766
- border-radius: var(--radius-small);
2767
- word-break: break-word;
2768
- word-wrap: break-word;
2769
- }
2770
- .wds-list-item-prompt .np-prompt-icon {
2771
- padding-right: calc(12px / 2);
2772
- padding-right: calc(var(--size-12) / 2);
2773
- padding-top: calc(4px - 1px);
2774
- padding-top: calc(var(--size-4) - 1px);
2775
- padding-bottom: calc(4px - 1px);
2776
- padding-bottom: calc(var(--size-4) - 1px);
2777
- }
2778
- .wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
2779
- .wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
2780
- color: var(--color-sentiment-positive-primary);
2781
- }
2782
- .wds-list-item-prompt a {
2783
- text-underline-offset: calc(4px / 2);
2784
- text-underline-offset: calc(var(--size-4) / 2);
2785
- }
2786
- .wds-list-item-prompt.np-prompt-interactive {
2787
- -webkit-text-decoration: none;
2788
- text-decoration: none;
2789
- cursor: pointer;
2790
- border: none;
2791
- }
2792
- .wds-list-item-prompt.negative {
2793
- background-color: var(--color-sentiment-negative-secondary);
2794
- color: var(--color-sentiment-negative-primary);
2795
- }
2796
- .wds-list-item-prompt.negative a {
2797
- color: var(--color-sentiment-negative-primary);
2798
- }
2799
- .wds-list-item-prompt.negative a:hover {
2800
- color: var(--color-sentiment-negative-primary-hover);
2801
- }
2802
- .wds-list-item-prompt.negative a:active {
2803
- color: var(--color-sentiment-negative-primary-active);
2804
- }
2805
- .np-prompt-interactive.wds-list-item-prompt.negative:hover {
2806
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 95%, var(--color-sentiment-negative-primary));
2807
- }
2808
- .np-prompt-interactive.wds-list-item-prompt.negative:active {
2809
- background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 90%, var(--color-sentiment-negative-primary));
2810
- }
2811
- .wds-list-item-prompt.positive,
2812
- .wds-list-item-prompt.discount,
2813
- .wds-list-item-prompt.savings {
2814
- background-color: var(--color-sentiment-positive-secondary);
2815
- color: var(--color-sentiment-positive-primary);
2816
- }
2817
- .wds-list-item-prompt.positive a,
2818
- .wds-list-item-prompt.discount a,
2819
- .wds-list-item-prompt.savings a {
2820
- color: var(--color-sentiment-positive-primary);
2821
- }
2822
- .wds-list-item-prompt.positive a:hover,
2823
- .wds-list-item-prompt.discount a:hover,
2824
- .wds-list-item-prompt.savings a:hover {
2825
- color: var(--color-sentiment-positive-primary-hover);
2826
- }
2827
- .wds-list-item-prompt.positive a:active,
2828
- .wds-list-item-prompt.discount a:active,
2829
- .wds-list-item-prompt.savings a:active {
2830
- color: var(--color-sentiment-positive-primary-active);
2831
- }
2832
- .np-prompt-interactive.wds-list-item-prompt.positive:hover,
2833
- .np-prompt-interactive.wds-list-item-prompt.discount:hover,
2834
- .np-prompt-interactive.wds-list-item-prompt.savings:hover {
2835
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 95%, var(--color-sentiment-positive-primary));
2836
- }
2837
- .np-prompt-interactive.wds-list-item-prompt.positive:active,
2838
- .np-prompt-interactive.wds-list-item-prompt.discount:active,
2839
- .np-prompt-interactive.wds-list-item-prompt.savings:active {
2840
- background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 90%, var(--color-sentiment-positive-primary));
2841
- }
2842
- .wds-list-item-prompt.neutral {
2843
- background-color: rgba(134,167,189,0.10196);
2844
- background-color: var(--color-background-neutral);
2845
- color: #37517e;
2846
- color: var(--color-content-primary);
2847
- }
2848
- .wds-list-item-prompt.neutral a {
2849
- color: #37517e;
2850
- color: var(--color-content-primary);
2851
- }
2852
- .np-prompt-interactive.wds-list-item-prompt.neutral:hover {
2853
- background-color: var(--color-background-neutral-hover);
2854
- }
2855
- .np-prompt-interactive.wds-list-item-prompt.neutral:active {
2856
- background-color: var(--color-background-neutral-active);
2857
- }
2858
- .wds-list-item-prompt.warning {
2859
- background-color: var(--color-sentiment-warning-secondary);
2860
- color: var(--color-sentiment-warning-content);
2861
- }
2862
- .wds-list-item-prompt.warning a {
2863
- color: var(--color-sentiment-warning-content);
2864
- }
2865
- .wds-list-item-prompt.warning a:hover {
2866
- color: var(--color-sentiment-warning-content-hover);
2867
- }
2868
- .wds-list-item-prompt.warning a:active {
2869
- color: var(--color-sentiment-warning-content-active);
2870
- }
2871
- .np-prompt-interactive.wds-list-item-prompt.warning:hover {
2872
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 90%, var(--color-sentiment-warning-primary));
2873
- }
2874
- .np-prompt-interactive.wds-list-item-prompt.warning:active {
2875
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 80%, var(--color-sentiment-warning-primary));
2876
- }
2877
2621
  .np-field-control {
2878
2622
  margin-top: 4px;
2879
2623
  margin-top: var(--size-4);
@@ -3,7 +3,6 @@
3
3
  */
4
4
  export type { AccordionItem, AccordionProps } from './accordion';
5
5
  export type { ActionOptionProps } from './actionOption';
6
- export type { SelectOptionProps, SelectOptionValue, SelectOptiopsSection } from './selectOption';
7
6
  export type { AlertAction, AlertProps, AlertType } from './alert';
8
7
  export type { AvatarProps } from './avatar';
9
8
  export type { AvatarViewProps } from './avatarView';
@@ -72,14 +71,12 @@ export type { UploadError, UploadResponse, UploadedFile } from './uploadInput/ty
72
71
  export type { WithIdProps } from './withId';
73
72
  export type { IconButtonProps } from './iconButton';
74
73
  export type { TableProps, TableRowType, TableRowClickableType, TableHeaderType, TableCellLeading, TableCellText, TableCellCurrency, TableCellStatus, TableCellType, } from './table';
75
- export type { ListItemProps, ListItemAdditionalInfoProps, ListItemCheckboxProps } from './listItem';
76
74
  /**
77
75
  * Components
78
76
  */
79
77
  export { default as Accordion } from './accordion';
80
78
  export { default as ActionButton } from './actionButton';
81
79
  export { default as ActionOption } from './actionOption';
82
- export { default as SelectOption } from './selectOption';
83
80
  export { default as Alert } from './alert';
84
81
  export { default as Avatar } from './avatar';
85
82
  export { default as AvatarView } from './avatarView';
@@ -170,7 +167,6 @@ export { default as Typeahead } from './typeahead';
170
167
  export { default as Upload } from './upload';
171
168
  export { default as UploadInput } from './uploadInput';
172
169
  export { default as Table } from './table';
173
- export { default as Item } from './table';
174
170
  /**
175
171
  * Hooks
176
172
  */