@transferwise/components 0.0.0-experimental-305fdc6 → 0.0.0-experimental-1605d4e

package/src/{legacylistItem/LegacyListItem.tsx → listItem/ListItem.tsx}

@@ -3,7 +3,7 @@ import { ElementType, FC, ReactNode } from 'react';
 
 import Body from '../body/Body';
 
-export type LegacyListItemProps = {
+export type ListItemProps = {
   title: ReactNode;
   value: ReactNode;
   media?: ReactNode;
@@ -13,7 +13,7 @@ export type LegacyListItemProps = {
   as?: ElementType;
 };
 
-const LegacyListItem: FC<LegacyListItemProps> = ({
+const ListItem: FC<ListItemProps> = ({
   media,
   action,
   className,
@@ -50,4 +50,4 @@ const LegacyListItem: FC<LegacyListItemProps> = ({
   );
 };
 
-export default LegacyListItem;
+export default ListItem;

package/src/listItem/index.ts

@@ -0,0 +1,4 @@
+export { List } from './List';
+export type { ListProps } from './List';
+export { default } from './ListItem';
+export type { ListItemProps } from './ListItem';

package/src/main.css

@@ -2648,6 +2648,189 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
   border-radius: 9999px !important;
   border-radius: var(--radius-full) !important;
 }
+.np-item {
+  padding: 16px;
+  padding: var(--size-16);
+  border-radius: 24px;
+  border-radius: var(--radius-large);
+  background-color: #ffffff;
+  background-color: var(--color-background-screen);
+  gap: 16px;
+  gap: var(--size-16);
+  cursor: pointer;
+}
+.np-item:hover {
+  background-color: var(--color-background-screen-hover);
+}
+.np-item:active {
+  background-color: var(--color-background-screen-active);
+}
+.np-item-media-image {
+  width: var(--item-media-image-size);
+  height: var(--item-media-image-size);
+}
+.np-item-title {
+  color: #37517e;
+  color: var(--color-content-primary);
+}
+.np-item-additional-info {
+  color: #768e9c;
+  color: var(--color-content-tertiary);
+}
+.np-item-value {
+  flex: 0 0 auto;
+}
+.np-item-control {
+  flex: 0 0 auto;
+}
+.np-item-spotlight-active {
+  background-color: rgba(134,167,189,0.10196);
+  background-color: var(--color-background-neutral);
+}
+.np-item-spotlight-active:hover {
+  background-color: var(--color-background-neutral-hover);
+}
+.np-item-spotlight-active:active {
+  background-color: var(--color-background-neutral-active);
+}
+.np-item-spotlight-inactive {
+  background-color: rgba(134, 167, 189, 0.025);
+  border: 1px dashed rgba(0,0,0,0.10196);
+  border: 1px dashed var(--color-border-neutral);
+}
+@supports (color: color-mix(in lch, red, blue)) {
+.np-item-spotlight-inactive {
+  background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
+}
+}
+.np-item-spotlight-inactive:hover {
+  background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
+}
+.np-item-spotlight-inactive:active {
+  background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
+}
+.np-item-prompt {
+  display: inline-flex;
+  padding-top: calc(8px / 2);
+  padding-top: calc(var(--padding-x-small) / 2);
+  padding-bottom: calc(8px / 2);
+  padding-bottom: calc(var(--padding-x-small) / 2);
+  padding-left: calc(8px - 1px);
+  padding-left: calc(var(--padding-x-small) - 1px);
+  padding-right: 8px;
+  padding-right: var(--padding-x-small);
+  border-radius: 10px;
+  border-radius: var(--radius-small);
+  word-break: break-word;
+  word-wrap: break-word;
+}
+.np-item-prompt .np-prompt-icon {
+  padding-right: calc(12px / 2);
+  padding-right: calc(var(--size-12) / 2);
+  padding-top: calc(4px - 1px);
+  padding-top: calc(var(--size-4) - 1px);
+  padding-bottom: calc(4px - 1px);
+  padding-bottom: calc(var(--size-4) - 1px);
+}
+.np-item-prompt .np-prompt-icon .tw-icon-tags,
+.np-item-prompt .np-prompt-icon .tw-icon-confetti {
+  color: var(--color-sentiment-positive-primary);
+}
+.np-item-prompt a {
+  text-underline-offset: calc(4px / 2);
+  text-underline-offset: calc(var(--size-4) / 2);
+}
+.np-item-prompt.np-prompt-interactive {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  cursor: pointer;
+  border: none;
+}
+.np-item-prompt.negative {
+  background-color: var(--color-sentiment-negative-secondary);
+  color: var(--color-sentiment-negative-primary);
+}
+.np-item-prompt.negative a {
+  color: var(--color-sentiment-negative-primary);
+}
+.np-item-prompt.negative a:hover {
+  color: var(--color-sentiment-negative-primary-hover);
+}
+.np-item-prompt.negative a:active {
+  color: var(--color-sentiment-negative-primary-active);
+}
+.np-prompt-interactive.np-item-prompt.negative:hover {
+  background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 95%, var(--color-sentiment-negative-primary));
+}
+.np-prompt-interactive.np-item-prompt.negative:active {
+  background-color: color-mix(in srgb, var(--color-sentiment-negative-secondary) 90%, var(--color-sentiment-negative-primary));
+}
+.np-item-prompt.positive,
+.np-item-prompt.discount,
+.np-item-prompt.savings {
+  background-color: var(--color-sentiment-positive-secondary);
+  color: var(--color-sentiment-positive-primary);
+}
+.np-item-prompt.positive a,
+.np-item-prompt.discount a,
+.np-item-prompt.savings a {
+  color: var(--color-sentiment-positive-primary);
+}
+.np-item-prompt.positive a:hover,
+.np-item-prompt.discount a:hover,
+.np-item-prompt.savings a:hover {
+  color: var(--color-sentiment-positive-primary-hover);
+}
+.np-item-prompt.positive a:active,
+.np-item-prompt.discount a:active,
+.np-item-prompt.savings a:active {
+  color: var(--color-sentiment-positive-primary-active);
+}
+.np-prompt-interactive.np-item-prompt.positive:hover,
+.np-prompt-interactive.np-item-prompt.discount:hover,
+.np-prompt-interactive.np-item-prompt.savings:hover {
+  background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 95%, var(--color-sentiment-positive-primary));
+}
+.np-prompt-interactive.np-item-prompt.positive:active,
+.np-prompt-interactive.np-item-prompt.discount:active,
+.np-prompt-interactive.np-item-prompt.savings:active {
+  background-color: color-mix(in srgb, var(--color-sentiment-positive-secondary) 90%, var(--color-sentiment-positive-primary));
+}
+.np-item-prompt.neutral {
+  background-color: rgba(134,167,189,0.10196);
+  background-color: var(--color-background-neutral);
+  color: #37517e;
+  color: var(--color-content-primary);
+}
+.np-item-prompt.neutral a {
+  color: #37517e;
+  color: var(--color-content-primary);
+}
+.np-prompt-interactive.np-item-prompt.neutral:hover {
+  background-color: var(--color-background-neutral-hover);
+}
+.np-prompt-interactive.np-item-prompt.neutral:active {
+  background-color: var(--color-background-neutral-active);
+}
+.np-item-prompt.warning {
+  background-color: var(--color-sentiment-warning-secondary);
+  color: var(--color-sentiment-warning-content);
+}
+.np-item-prompt.warning a {
+  color: var(--color-sentiment-warning-content);
+}
+.np-item-prompt.warning a:hover {
+  color: var(--color-sentiment-warning-content-hover);
+}
+.np-item-prompt.warning a:active {
+  color: var(--color-sentiment-warning-content-active);
+}
+.np-prompt-interactive.np-item-prompt.warning:hover {
+  background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 90%, var(--color-sentiment-warning-primary));
+}
+.np-prompt-interactive.np-item-prompt.warning:active {
+  background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 80%, var(--color-sentiment-warning-primary));
+}
 .np-field-control {
   margin-top: 4px;
   margin-top: var(--size-4);
@@ -5165,9 +5348,6 @@ html:not([dir="rtl"]) .np-navigation-option {
   width: 50px;
   padding: 2px;
   border-radius: 16px;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
 }
 .np-switch:focus {
   outline: none;

package/src/main.less

@@ -39,6 +39,7 @@
 @import "./image/Image.less";
 @import "./info/Info.less";
 @import "./inputs/Input.less";
+@import "./item/Item.less";
 @import "./field/Field.less";
 @import "./inputs/InputGroup.less";
 @import "./inputs/SelectInput.less";
@@ -77,7 +78,7 @@
 @import "./uploadInput/uploadItem/UploadItem.less";
 @import "./progress/Progress.less";
 @import "./progressBar/ProgressBar.less";
-@import "./legacylistItem/LegacyListItem.less";
+@import "./listItem/ListItem.less";
 
 // List all less files in src in alphabetical order: find -s src -type f -name '*.less' ! -name 'main.less'
 // Make sure you are not referencing main.less itself in this file!

package/src/switch/Switch.css

@@ -4,9 +4,6 @@
   width: 50px;
   padding: 2px;
   border-radius: 16px;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-          user-select: none;
 }
 .np-switch:focus {
   outline: none;

package/src/switch/Switch.less

@@ -8,7 +8,6 @@
   width: 50px;
   padding: 2px;
   border-radius: 16px;
-  user-select: none;
 
   .focus-ring();
 

package/src/test-utils/assets/apple-pay-logo.svg

@@ -0,0 +1,84 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<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"
+	 width="165.52107px" height="105.9651px" viewBox="0 0 165.52107 105.9651" enable-background="new 0 0 165.52107 105.9651"
+	 xml:space="preserve">
+<g>
+	<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
+		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
+		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
+		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
+		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
+		c0,0.5671-0.0011,1.13181,0.0022,1.69901c0.00311,0.4763,0.0086,0.9527,0.0214,1.4291
+		c0.028,1.03699,0.08971,2.08469,0.2751,3.11069c0.1863,1.0436,0.4925,2.0135,0.9744,2.9599
+		c0.473,0.9313,1.0918,1.7827,1.83021,2.52c0.73809,0.7396,1.58979,1.3583,2.52009,1.8302
+		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
+		c0.56489,0.0044,1.13179,0.0044,1.69769,0.0044h135.87489c0.5649,0,1.13181,0,1.69659-0.0044
+		c0.47641-0.0022,0.95282-0.0086,1.4314-0.0194c1.0368-0.0281,2.0845-0.0905,3.11301-0.2737
+		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
+		c0.48299-0.9464,0.78889-1.9163,0.97429-2.9599c0.1855-1.026,0.2457-2.0737,0.2738-3.11069
+		c0.013-0.4764,0.01941-0.9528,0.02161-1.4291c0.00439-0.5672,0.00439-1.1319,0.00439-1.69901V14.8242
+		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
+		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
+		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
+		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
+		L150.69807,0z"/>
+	<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
+		c0.79201,0.0214,1.71849,0.0643,2.58209,0.2191c0.7507,0.1352,1.38029,0.3408,1.9845,0.6484
+		c0.5965,0.3031,1.14301,0.7003,1.62019,1.1768c0.479,0.4797,0.87671,1.0271,1.18381,1.6302
+		c0.30589,0.5995,0.51019,1.2261,0.64459,1.9823c0.1544,0.8542,0.1971,1.7832,0.21881,2.5801
+		c0.01219,0.4498,0.01819,0.8996,0.0204,1.3601c0.00429,0.5569,0.0042,1.1135,0.0042,1.6715V91.142
+		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
+		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
+		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
+		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
+		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
+		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
+		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
+		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
+		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
+		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
+		c0.1336-0.7479,0.3385-1.3765,0.6465-1.9814c0.3037-0.5979,0.7003-1.1437,1.17921-1.6225
+		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
+		c0.4526-0.0123,0.9052-0.0172,1.3544-0.0203l1.6771-0.0033H150.69807"/>
+	<g>
+		<g>
+			<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
+				c-1.31607,1.5192-2.4809,3.99902-2.17723,6.3293C41.39111,38.72954,43.71785,37.36345,45.1862,35.64053"/>
+			<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
+				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
+				c1.71618,2.5238,3.78447,5.30269,6.50976,5.20287c2.57494-0.10104,3.58421-1.66732,6.71416-1.66732
+				c3.12765,0,4.03679,1.66732,6.76252,1.61681c2.82665-0.05054,4.59381-2.52506,6.30997-5.05132
+				c1.96878-2.877,2.77473-5.65498,2.82542-5.80748c-0.0507-0.05051-5.45058-2.12204-5.50065-8.33358
+				c-0.05098-5.20101,4.23951-7.6749,4.44144-7.82832C52.3832,39.4881,48.5975,39.08404,47.28506,38.98252"/>
+		</g>
+		<g>
+			<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
+				v12.94318h-5.88037v-37.8846H76.73385z M68.41059,51.9493h6.74732c5.11975,0,8.0336-2.75636,8.0336-7.53479
+				c0-4.77792-2.91385-7.50845-8.00727-7.50845h-6.77365V51.9493z"/>
+			<path d="M90.73997,61.97864c0-4.8311,3.70182-7.79761,10.26583-8.16526l7.56061-0.44614v-2.12639
+				c0-3.07185-2.07423-4.90959-5.53905-4.90959c-3.28251,0-5.33041,1.57492-5.82871,4.04313h-5.35574
+				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
+				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
+				 M108.56641,59.4846v-2.17905l-6.8,0.41981c-3.38683,0.23649-5.30306,1.73291-5.30306,4.09579
+				c0,2.41504,1.99523,3.99046,5.04075,3.99046C105.46823,65.81161,108.56641,63.08108,108.56641,59.4846z"/>
+			<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
+				c0-0.05267,0.49931-1.68025,0.49931-1.70658l-9.97616-27.64562h6.14268l6.98432,22.47371h0.10432l6.98433-22.47371h5.9857
+				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
+				z"/>
+		</g>
+	</g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>

package/src/test-utils/fake-data.ts

@@ -1,6 +1,11 @@
+export const lorem5 = 'Lorem ipsum dolor sit amet.';
+
 export const lorem10 =
   'Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste, architecto?';
 
+export const lorem20 =
+  'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorum non explicabo doloribus rerum saepe ut beatae adipisci rem vero optio.';
+
 export const lorem40 =
   '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?';
 

package/build/legacylistItem/LegacyListItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LegacyListItem.js","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n  title: ReactNode;\n  value: ReactNode;\n  media?: ReactNode;\n  action?: ReactNode;\n  className?: string;\n  isContainerAligned?: boolean;\n  as?: ElementType;\n};\n\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n  media,\n  action,\n  className,\n  title,\n  value,\n  isContainerAligned,\n  as = 'li',\n  ...rest\n}) => {\n  const Element = as;\n\n  return (\n    <Element\n      className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n        'p-x-2': !isContainerAligned,\n      })}\n      {...rest}\n    >\n      {media}\n\n      <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n        <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n          {title}\n        </Body>\n        {value && (\n          <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n            {value}\n          </Body>\n        )}\n      </div>\n\n      {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n    </Element>\n  );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;;;;;AAeMA,MAAAA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC,IAAAA;AACJ,CAAA,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE,CAAA;EAElB,oBACEG,eAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,SAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG,kBAAAA;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,eAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,SAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC,MAAAA;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR,KAAAA;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,cAAA,CAACC,YAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP,KAAAA;AAAK,OACF,CACP,CAAA;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,cAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV,MAAAA;KAAY,CAAC,GAAG,IAAI,CAAA;AAAA,GACvE,CAAC,CAAA;AAEd;;;;"}

package/build/legacylistItem/LegacyListItem.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"LegacyListItem.mjs","sources":["../../src/legacylistItem/LegacyListItem.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, FC, ReactNode } from 'react';\n\nimport Body from '../body/Body';\n\nexport type LegacyListItemProps = {\n  title: ReactNode;\n  value: ReactNode;\n  media?: ReactNode;\n  action?: ReactNode;\n  className?: string;\n  isContainerAligned?: boolean;\n  as?: ElementType;\n};\n\nconst LegacyListItem: FC<LegacyListItemProps> = ({\n  media,\n  action,\n  className,\n  title,\n  value,\n  isContainerAligned,\n  as = 'li',\n  ...rest\n}) => {\n  const Element = as;\n\n  return (\n    <Element\n      className={clsx('np-list-item d-flex align-items-center p-y-2', className, {\n        'p-x-2': !isContainerAligned,\n      })}\n      {...rest}\n    >\n      {media}\n\n      <div className={clsx('d-flex flex-column', { 'p-l-2': !!media, 'p-r-2': !!action })}>\n        <Body type=\"body-default\" className=\"text-secondary m-b-0\">\n          {title}\n        </Body>\n        {value && (\n          <Body type=\"body-large\" className=\"text-primary text-overflow-wrap m-b-0\">\n            {value}\n          </Body>\n        )}\n      </div>\n\n      {action ? <div className=\"np-list-item__action m-l-auto\">{action}</div> : null}\n    </Element>\n  );\n};\n\nexport default LegacyListItem;\n"],"names":["LegacyListItem","media","action","className","title","value","isContainerAligned","as","rest","Element","_jsxs","clsx","children","_jsx","Body","type"],"mappings":";;;;AAeMA,MAAAA,cAAc,GAA4BA,CAAC;EAC/CC,KAAK;EACLC,MAAM;EACNC,SAAS;EACTC,KAAK;EACLC,KAAK;EACLC,kBAAkB;AAClBC,EAAAA,EAAE,GAAG,IAAI;EACT,GAAGC,IAAAA;AACJ,CAAA,KAAI;EACH,MAAMC,OAAO,GAAGF,EAAE,CAAA;EAElB,oBACEG,IAAA,CAACD,OAAO,EAAA;AACNN,IAAAA,SAAS,EAAEQ,IAAI,CAAC,8CAA8C,EAAER,SAAS,EAAE;AACzE,MAAA,OAAO,EAAE,CAACG,kBAAAA;AACX,KAAA,CAAE;AAAA,IAAA,GACCE,IAAI;IAAAI,QAAA,EAAA,CAEPX,KAAK,eAENS,IAAA,CAAA,KAAA,EAAA;AAAKP,MAAAA,SAAS,EAAEQ,IAAI,CAAC,oBAAoB,EAAE;QAAE,OAAO,EAAE,CAAC,CAACV,KAAK;QAAE,OAAO,EAAE,CAAC,CAACC,MAAAA;AAAM,OAAE,CAAE;MAAAU,QAAA,EAAA,cAClFC,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,cAAc;AAACZ,QAAAA,SAAS,EAAC,sBAAsB;AAAAS,QAAAA,QAAA,EACvDR,KAAAA;AAAK,OACF,CACN,EAACC,KAAK,iBACJQ,GAAA,CAACC,IAAI,EAAA;AAACC,QAAAA,IAAI,EAAC,YAAY;AAACZ,QAAAA,SAAS,EAAC,uCAAuC;AAAAS,QAAAA,QAAA,EACtEP,KAAAA;AAAK,OACF,CACP,CAAA;AAAA,KACE,CAEL,EAACH,MAAM,gBAAGW,GAAA,CAAA,KAAA,EAAA;AAAKV,MAAAA,SAAS,EAAC,+BAA+B;AAAAS,MAAAA,QAAA,EAAEV,MAAAA;KAAY,CAAC,GAAG,IAAI,CAAA;AAAA,GACvE,CAAC,CAAA;AAEd;;;;"}

package/build/legacylistItem/List.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"List.js","sources":["../../src/legacylistItem/List.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport interface ListProps {\n  className?: string;\n  children?: React.ReactNode;\n}\n\nexport function List({ className, children }: ListProps) {\n  return <ul className={clsx(className, 'list-unstyled')}>{children}</ul>;\n}\n"],"names":["List","className","children","_jsx","clsx"],"mappings":";;;;;SAOgBA,IAAIA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,QAAAA;AAAqB,CAAA,EAAA;AACrD,EAAA,oBAAOC,cAAA,CAAA,IAAA,EAAA;AAAIF,IAAAA,SAAS,EAAEG,SAAI,CAACH,SAAS,EAAE,eAAe,CAAE;AAAAC,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAAK,CAAC,CAAA;AACzE;;;;"}

package/build/legacylistItem/List.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"List.mjs","sources":["../../src/legacylistItem/List.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport interface ListProps {\n  className?: string;\n  children?: React.ReactNode;\n}\n\nexport function List({ className, children }: ListProps) {\n  return <ul className={clsx(className, 'list-unstyled')}>{children}</ul>;\n}\n"],"names":["List","className","children","_jsx","clsx"],"mappings":";;;SAOgBA,IAAIA,CAAC;EAAEC,SAAS;AAAEC,EAAAA,QAAAA;AAAqB,CAAA,EAAA;AACrD,EAAA,oBAAOC,GAAA,CAAA,IAAA,EAAA;AAAIF,IAAAA,SAAS,EAAEG,IAAI,CAACH,SAAS,EAAE,eAAe,CAAE;AAAAC,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAAK,CAAC,CAAA;AACzE;;;;"}

package/build/types/legacylistItem/LegacyListItem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LegacyListItem.d.ts","sourceRoot":"","sources":["../../../src/legacylistItem/LegacyListItem.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAInD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,EAAE,CAAC,EAAE,WAAW,CAAC;CAClB,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAmC3C,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/build/types/legacylistItem/List.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/legacylistItem/List.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,SAAS;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,IAAI,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,SAAS,+BAEtD"}

package/build/types/legacylistItem/index.d.ts

@@ -1,5 +0,0 @@
-export { List } from './List';
-export type { ListProps } from './List';
-export { default } from './LegacyListItem';
-export type { LegacyListItemProps } from './LegacyListItem';
-//# sourceMappingURL=index.d.ts.map

package/build/types/legacylistItem/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/legacylistItem/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,YAAY,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAC3C,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC"}

package/src/legacylistItem/index.ts

@@ -1,4 +0,0 @@
-export { List } from './List';
-export type { ListProps } from './List';
-export { default } from './LegacyListItem';
-export type { LegacyListItemProps } from './LegacyListItem';