@transferwise/components 46.119.5 → 46.120.0

package/build/accordion/Accordion.js

@@ -6,6 +6,48 @@ var React = require('react');
 var AccordionItem = require('./AccordionItem/AccordionItem.js');
 var jsxRuntime = require('react/jsx-runtime');
 
+/**
+ * Accordion
+ *
+ * A simple accordion component that displays a list of items that can be expanded or collapsed.
+ *
+ * @component
+ * @param {number} indexOpen - index of the item that should be open
+ * @param {Array<AccordionItemProps>} items - array of items to display
+ * @param {Function} onClick - callback function
+ * @example
+ * // Example usage:
+ *
+ * import Accordion from './Accordion';
+ *
+ * const items = [
+ *   {
+ *     id: 'item1',
+ *     title: 'Item 1',
+ *     content: 'This is the content for item 1.',
+ *   },
+ *   {
+ *     id: 'item2',
+ *     title: 'Item 2',
+ *     content: 'This is the content for item 2.',
+ *   },
+ *   {
+ *     id: 'item3',
+ *     title: 'Item 3',
+ *     content: 'This is the content for item 3.',
+ *   },
+ * ];
+ *
+ * function App() {
+ *   const handleItemClick = (index) => {
+ *     console.log(`Item ${index} was clicked.`);
+ *   };
+ *
+ *   return (
+ *     <Accordion items={items} onClick={handleItemClick} />
+ *   );
+ * }
+ */
 const Accordion = ({
   indexOpen = -1,
   items,
@@ -13,6 +55,7 @@ const Accordion = ({
   theme = 'light'
 }) => {
   const [itemsOpen, setItemsOpen] = React.useState(() => items.map((value, index) => index === indexOpen));
+
   /**
    * Handles a click event on an accordion item.
    *

package/build/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../../src/accordion/Accordion.tsx"],"sourcesContent":["import { useState, FC } from 'react';\n\nimport AccordionItem, { AccordionItemProps } from './AccordionItem';\n\nexport type AccordionItem = Omit<AccordionItemProps, 'onClick' | 'open' | 'theme'>;\n\nexport interface AccordionProps {\n  /** The index of the item that should be open by default. */\n  indexOpen?: number;\n  /** An array of items to display in the accordion. */\n  items: readonly AccordionItem[];\n  /** A callback function that is called when an item is clicked. */\n  onClick?: (index: number) => void;\n  /** @deprecated */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * Accordion\n *\n * A simple accordion component that displays a list of items that can be expanded or collapsed.\n *\n * @component\n * @param {number} indexOpen - index of the item that should be open\n * @param {Array<AccordionItemProps>} items - array of items to display\n * @param {Function} onClick - callback function\n * @example\n * // Example usage:\n *\n * import Accordion from './Accordion';\n *\n * const items = [\n *   {\n *     id: 'item1',\n *     title: 'Item 1',\n *     content: 'This is the content for item 1.',\n *   },\n *   {\n *     id: 'item2',\n *     title: 'Item 2',\n *     content: 'This is the content for item 2.',\n *   },\n *   {\n *     id: 'item3',\n *     title: 'Item 3',\n *     content: 'This is the content for item 3.',\n *   },\n * ];\n *\n * function App() {\n *   const handleItemClick = (index) => {\n *     console.log(`Item ${index} was clicked.`);\n *   };\n *\n *   return (\n *     <Accordion items={items} onClick={handleItemClick} />\n *   );\n * }\n */\nconst Accordion: FC<AccordionProps> = ({ indexOpen = -1, items, onClick, theme = 'light' }) => {\n  const [itemsOpen, setItemsOpen] = useState(() =>\n    items.map((value, index) => index === indexOpen),\n  );\n\n  /**\n   * Handles a click event on an accordion item.\n   *\n   * @param index The index of the item that was clicked.\n   */\n  const handleOnClick = (index: number) => {\n    if (onClick) {\n      onClick(index);\n    }\n    const newItems = [...itemsOpen];\n    newItems[index] = !itemsOpen[index];\n    setItemsOpen(newItems);\n  };\n\n  return (\n    <>\n      {items.map((item, index) => (\n        <AccordionItem\n          key={item.id || index}\n          open={itemsOpen[index]}\n          title={item.title}\n          subtitle={item.subtitle}\n          content={item.content}\n          icon={item.icon}\n          media={item.media}\n          showMediaAtAllSizes={item.showMediaAtAllSizes}\n          showMediaCircle={item.showMediaCircle}\n          isContainerAligned={item.isContainerAligned}\n          onClick={() => handleOnClick(index)}\n        />\n      ))}\n    </>\n  );\n};\n\nexport default Accordion;\n"],"names":["Accordion","indexOpen","items","onClick","theme","itemsOpen","setItemsOpen","useState","map","value","index","handleOnClick","newItems","_jsx","_Fragment","children","item","AccordionItem","open","title","subtitle","content","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","id"],"mappings":";;;;;;;;AA2DA,MAAMA,SAAS,GAAuBA,CAAC;EAAEC,SAAS,GAAG,EAAE;EAAEC,KAAK;EAAEC,OAAO;AAAEC,EAAAA,KAAK,GAAG;AAAO,CAAE,KAAI;EAC5F,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,cAAQ,CAAC,MACzCL,KAAK,CAACM,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAKA,KAAK,KAAKT,SAAS,CAAC,CACjD;AAED;;;;AAIG;EACH,MAAMU,aAAa,GAAID,KAAa,IAAI;AACtC,IAAA,IAAIP,OAAO,EAAE;MACXA,OAAO,CAACO,KAAK,CAAC;AAChB,IAAA;AACA,IAAA,MAAME,QAAQ,GAAG,CAAC,GAAGP,SAAS,CAAC;IAC/BO,QAAQ,CAACF,KAAK,CAAC,GAAG,CAACL,SAAS,CAACK,KAAK,CAAC;IACnCJ,YAAY,CAACM,QAAQ,CAAC;EACxB,CAAC;EAED,oBACEC,cAAA,CAAAC,mBAAA,EAAA;AAAAC,IAAAA,QAAA,EACGb,KAAK,CAACM,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK,kBACrBG,cAAA,CAACI,qBAAa,EAAA;AAEZC,MAAAA,IAAI,EAAEb,SAAS,CAACK,KAAK,CAAE;MACvBS,KAAK,EAAEH,IAAI,CAACG,KAAM;MAClBC,QAAQ,EAAEJ,IAAI,CAACI,QAAS;MACxBC,OAAO,EAAEL,IAAI,CAACK,OAAQ;MACtBC,IAAI,EAAEN,IAAI,CAACM,IAAK;MAChBC,KAAK,EAAEP,IAAI,CAACO,KAAM;MAClBC,mBAAmB,EAAER,IAAI,CAACQ,mBAAoB;MAC9CC,eAAe,EAAET,IAAI,CAACS,eAAgB;MACtCC,kBAAkB,EAAEV,IAAI,CAACU,kBAAmB;AAC5CvB,MAAAA,OAAO,EAAEA,MAAMQ,aAAa,CAACD,KAAK;AAAE,KAAA,EAV/BM,IAAI,CAACW,EAAE,IAAIjB,KAUoB,CAEvC;AAAC,GACJ,CAAG;AAEP;;;;"}
+{"version":3,"file":"Accordion.js","sources":["../../src/accordion/Accordion.tsx"],"sourcesContent":["import { useState, FC } from 'react';\n\nimport AccordionItem, { AccordionItemProps } from './AccordionItem';\n\nexport type AccordionItem = Omit<AccordionItemProps, 'onClick' | 'open' | 'theme'>;\n\nexport interface AccordionProps {\n  /** The index of the item that should be open by default. */\n  indexOpen?: number;\n  /** An array of items to display in the accordion. */\n  items: readonly AccordionItem[];\n  /** A callback function that is called when an item is clicked. */\n  onClick?: (index: number) => void;\n  /** @deprecated */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * Accordion\n *\n * A simple accordion component that displays a list of items that can be expanded or collapsed.\n *\n * @component\n * @param {number} indexOpen - index of the item that should be open\n * @param {Array<AccordionItemProps>} items - array of items to display\n * @param {Function} onClick - callback function\n * @example\n * // Example usage:\n *\n * import Accordion from './Accordion';\n *\n * const items = [\n *   {\n *     id: 'item1',\n *     title: 'Item 1',\n *     content: 'This is the content for item 1.',\n *   },\n *   {\n *     id: 'item2',\n *     title: 'Item 2',\n *     content: 'This is the content for item 2.',\n *   },\n *   {\n *     id: 'item3',\n *     title: 'Item 3',\n *     content: 'This is the content for item 3.',\n *   },\n * ];\n *\n * function App() {\n *   const handleItemClick = (index) => {\n *     console.log(`Item ${index} was clicked.`);\n *   };\n *\n *   return (\n *     <Accordion items={items} onClick={handleItemClick} />\n *   );\n * }\n */\nconst Accordion: FC<AccordionProps> = ({ indexOpen = -1, items, onClick, theme = 'light' }) => {\n  const [itemsOpen, setItemsOpen] = useState(() =>\n    items.map((value, index) => index === indexOpen),\n  );\n\n  /**\n   * Handles a click event on an accordion item.\n   *\n   * @param index The index of the item that was clicked.\n   */\n  const handleOnClick = (index: number) => {\n    if (onClick) {\n      onClick(index);\n    }\n    const newItems = [...itemsOpen];\n    newItems[index] = !itemsOpen[index];\n    setItemsOpen(newItems);\n  };\n\n  return (\n    <>\n      {items.map((item, index) => (\n        <AccordionItem\n          key={item.id || index}\n          open={itemsOpen[index]}\n          title={item.title}\n          subtitle={item.subtitle}\n          content={item.content}\n          icon={item.icon}\n          media={item.media}\n          showMediaAtAllSizes={item.showMediaAtAllSizes}\n          showMediaCircle={item.showMediaCircle}\n          isContainerAligned={item.isContainerAligned}\n          onClick={() => handleOnClick(index)}\n        />\n      ))}\n    </>\n  );\n};\n\nexport default Accordion;\n"],"names":["Accordion","indexOpen","items","onClick","theme","itemsOpen","setItemsOpen","useState","map","value","index","handleOnClick","newItems","_jsx","_Fragment","children","item","AccordionItem","open","title","subtitle","content","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","id"],"mappings":";;;;;;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,SAA6B,GAAGA,CAAC;EAAEC,SAAS,GAAG,EAAE;EAAEC,KAAK;EAAEC,OAAO;AAAEC,EAAAA,KAAK,GAAG;AAAQ,CAAC,KAAK;EAC7F,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,cAAQ,CAAC,MACzCL,KAAK,CAACM,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAKA,KAAK,KAAKT,SAAS,CACjD,CAAC;;AAED;AACF;AACA;AACA;AACA;EACE,MAAMU,aAAa,GAAID,KAAa,IAAK;AACvC,IAAA,IAAIP,OAAO,EAAE;MACXA,OAAO,CAACO,KAAK,CAAC;AAChB,IAAA;AACA,IAAA,MAAME,QAAQ,GAAG,CAAC,GAAGP,SAAS,CAAC;IAC/BO,QAAQ,CAACF,KAAK,CAAC,GAAG,CAACL,SAAS,CAACK,KAAK,CAAC;IACnCJ,YAAY,CAACM,QAAQ,CAAC;EACxB,CAAC;EAED,oBACEC,cAAA,CAAAC,mBAAA,EAAA;AAAAC,IAAAA,QAAA,EACGb,KAAK,CAACM,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK,kBACrBG,cAAA,CAACI,qBAAa,EAAA;AAEZC,MAAAA,IAAI,EAAEb,SAAS,CAACK,KAAK,CAAE;MACvBS,KAAK,EAAEH,IAAI,CAACG,KAAM;MAClBC,QAAQ,EAAEJ,IAAI,CAACI,QAAS;MACxBC,OAAO,EAAEL,IAAI,CAACK,OAAQ;MACtBC,IAAI,EAAEN,IAAI,CAACM,IAAK;MAChBC,KAAK,EAAEP,IAAI,CAACO,KAAM;MAClBC,mBAAmB,EAAER,IAAI,CAACQ,mBAAoB;MAC9CC,eAAe,EAAET,IAAI,CAACS,eAAgB;MACtCC,kBAAkB,EAAEV,IAAI,CAACU,kBAAmB;AAC5CvB,MAAAA,OAAO,EAAEA,MAAMQ,aAAa,CAACD,KAAK;AAAE,KAAA,EAV/BM,IAAI,CAACW,EAAE,IAAIjB,KAWjB,CACF;AAAC,GACF,CAAC;AAEP;;;;"}

package/build/accordion/Accordion.mjs

@@ -2,6 +2,48 @@ import { useState } from 'react';
 import AccordionItem from './AccordionItem/AccordionItem.mjs';
 import { jsx, Fragment } from 'react/jsx-runtime';
 
+/**
+ * Accordion
+ *
+ * A simple accordion component that displays a list of items that can be expanded or collapsed.
+ *
+ * @component
+ * @param {number} indexOpen - index of the item that should be open
+ * @param {Array<AccordionItemProps>} items - array of items to display
+ * @param {Function} onClick - callback function
+ * @example
+ * // Example usage:
+ *
+ * import Accordion from './Accordion';
+ *
+ * const items = [
+ *   {
+ *     id: 'item1',
+ *     title: 'Item 1',
+ *     content: 'This is the content for item 1.',
+ *   },
+ *   {
+ *     id: 'item2',
+ *     title: 'Item 2',
+ *     content: 'This is the content for item 2.',
+ *   },
+ *   {
+ *     id: 'item3',
+ *     title: 'Item 3',
+ *     content: 'This is the content for item 3.',
+ *   },
+ * ];
+ *
+ * function App() {
+ *   const handleItemClick = (index) => {
+ *     console.log(`Item ${index} was clicked.`);
+ *   };
+ *
+ *   return (
+ *     <Accordion items={items} onClick={handleItemClick} />
+ *   );
+ * }
+ */
 const Accordion = ({
   indexOpen = -1,
   items,
@@ -9,6 +51,7 @@ const Accordion = ({
   theme = 'light'
 }) => {
   const [itemsOpen, setItemsOpen] = useState(() => items.map((value, index) => index === indexOpen));
+
   /**
    * Handles a click event on an accordion item.
    *

package/build/accordion/Accordion.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.mjs","sources":["../../src/accordion/Accordion.tsx"],"sourcesContent":["import { useState, FC } from 'react';\n\nimport AccordionItem, { AccordionItemProps } from './AccordionItem';\n\nexport type AccordionItem = Omit<AccordionItemProps, 'onClick' | 'open' | 'theme'>;\n\nexport interface AccordionProps {\n  /** The index of the item that should be open by default. */\n  indexOpen?: number;\n  /** An array of items to display in the accordion. */\n  items: readonly AccordionItem[];\n  /** A callback function that is called when an item is clicked. */\n  onClick?: (index: number) => void;\n  /** @deprecated */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * Accordion\n *\n * A simple accordion component that displays a list of items that can be expanded or collapsed.\n *\n * @component\n * @param {number} indexOpen - index of the item that should be open\n * @param {Array<AccordionItemProps>} items - array of items to display\n * @param {Function} onClick - callback function\n * @example\n * // Example usage:\n *\n * import Accordion from './Accordion';\n *\n * const items = [\n *   {\n *     id: 'item1',\n *     title: 'Item 1',\n *     content: 'This is the content for item 1.',\n *   },\n *   {\n *     id: 'item2',\n *     title: 'Item 2',\n *     content: 'This is the content for item 2.',\n *   },\n *   {\n *     id: 'item3',\n *     title: 'Item 3',\n *     content: 'This is the content for item 3.',\n *   },\n * ];\n *\n * function App() {\n *   const handleItemClick = (index) => {\n *     console.log(`Item ${index} was clicked.`);\n *   };\n *\n *   return (\n *     <Accordion items={items} onClick={handleItemClick} />\n *   );\n * }\n */\nconst Accordion: FC<AccordionProps> = ({ indexOpen = -1, items, onClick, theme = 'light' }) => {\n  const [itemsOpen, setItemsOpen] = useState(() =>\n    items.map((value, index) => index === indexOpen),\n  );\n\n  /**\n   * Handles a click event on an accordion item.\n   *\n   * @param index The index of the item that was clicked.\n   */\n  const handleOnClick = (index: number) => {\n    if (onClick) {\n      onClick(index);\n    }\n    const newItems = [...itemsOpen];\n    newItems[index] = !itemsOpen[index];\n    setItemsOpen(newItems);\n  };\n\n  return (\n    <>\n      {items.map((item, index) => (\n        <AccordionItem\n          key={item.id || index}\n          open={itemsOpen[index]}\n          title={item.title}\n          subtitle={item.subtitle}\n          content={item.content}\n          icon={item.icon}\n          media={item.media}\n          showMediaAtAllSizes={item.showMediaAtAllSizes}\n          showMediaCircle={item.showMediaCircle}\n          isContainerAligned={item.isContainerAligned}\n          onClick={() => handleOnClick(index)}\n        />\n      ))}\n    </>\n  );\n};\n\nexport default Accordion;\n"],"names":["Accordion","indexOpen","items","onClick","theme","itemsOpen","setItemsOpen","useState","map","value","index","handleOnClick","newItems","_jsx","_Fragment","children","item","AccordionItem","open","title","subtitle","content","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","id"],"mappings":";;;;AA2DA,MAAMA,SAAS,GAAuBA,CAAC;EAAEC,SAAS,GAAG,EAAE;EAAEC,KAAK;EAAEC,OAAO;AAAEC,EAAAA,KAAK,GAAG;AAAO,CAAE,KAAI;EAC5F,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,QAAQ,CAAC,MACzCL,KAAK,CAACM,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAKA,KAAK,KAAKT,SAAS,CAAC,CACjD;AAED;;;;AAIG;EACH,MAAMU,aAAa,GAAID,KAAa,IAAI;AACtC,IAAA,IAAIP,OAAO,EAAE;MACXA,OAAO,CAACO,KAAK,CAAC;AAChB,IAAA;AACA,IAAA,MAAME,QAAQ,GAAG,CAAC,GAAGP,SAAS,CAAC;IAC/BO,QAAQ,CAACF,KAAK,CAAC,GAAG,CAACL,SAAS,CAACK,KAAK,CAAC;IACnCJ,YAAY,CAACM,QAAQ,CAAC;EACxB,CAAC;EAED,oBACEC,GAAA,CAAAC,QAAA,EAAA;AAAAC,IAAAA,QAAA,EACGb,KAAK,CAACM,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK,kBACrBG,GAAA,CAACI,aAAa,EAAA;AAEZC,MAAAA,IAAI,EAAEb,SAAS,CAACK,KAAK,CAAE;MACvBS,KAAK,EAAEH,IAAI,CAACG,KAAM;MAClBC,QAAQ,EAAEJ,IAAI,CAACI,QAAS;MACxBC,OAAO,EAAEL,IAAI,CAACK,OAAQ;MACtBC,IAAI,EAAEN,IAAI,CAACM,IAAK;MAChBC,KAAK,EAAEP,IAAI,CAACO,KAAM;MAClBC,mBAAmB,EAAER,IAAI,CAACQ,mBAAoB;MAC9CC,eAAe,EAAET,IAAI,CAACS,eAAgB;MACtCC,kBAAkB,EAAEV,IAAI,CAACU,kBAAmB;AAC5CvB,MAAAA,OAAO,EAAEA,MAAMQ,aAAa,CAACD,KAAK;AAAE,KAAA,EAV/BM,IAAI,CAACW,EAAE,IAAIjB,KAUoB,CAEvC;AAAC,GACJ,CAAG;AAEP;;;;"}
+{"version":3,"file":"Accordion.mjs","sources":["../../src/accordion/Accordion.tsx"],"sourcesContent":["import { useState, FC } from 'react';\n\nimport AccordionItem, { AccordionItemProps } from './AccordionItem';\n\nexport type AccordionItem = Omit<AccordionItemProps, 'onClick' | 'open' | 'theme'>;\n\nexport interface AccordionProps {\n  /** The index of the item that should be open by default. */\n  indexOpen?: number;\n  /** An array of items to display in the accordion. */\n  items: readonly AccordionItem[];\n  /** A callback function that is called when an item is clicked. */\n  onClick?: (index: number) => void;\n  /** @deprecated */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * Accordion\n *\n * A simple accordion component that displays a list of items that can be expanded or collapsed.\n *\n * @component\n * @param {number} indexOpen - index of the item that should be open\n * @param {Array<AccordionItemProps>} items - array of items to display\n * @param {Function} onClick - callback function\n * @example\n * // Example usage:\n *\n * import Accordion from './Accordion';\n *\n * const items = [\n *   {\n *     id: 'item1',\n *     title: 'Item 1',\n *     content: 'This is the content for item 1.',\n *   },\n *   {\n *     id: 'item2',\n *     title: 'Item 2',\n *     content: 'This is the content for item 2.',\n *   },\n *   {\n *     id: 'item3',\n *     title: 'Item 3',\n *     content: 'This is the content for item 3.',\n *   },\n * ];\n *\n * function App() {\n *   const handleItemClick = (index) => {\n *     console.log(`Item ${index} was clicked.`);\n *   };\n *\n *   return (\n *     <Accordion items={items} onClick={handleItemClick} />\n *   );\n * }\n */\nconst Accordion: FC<AccordionProps> = ({ indexOpen = -1, items, onClick, theme = 'light' }) => {\n  const [itemsOpen, setItemsOpen] = useState(() =>\n    items.map((value, index) => index === indexOpen),\n  );\n\n  /**\n   * Handles a click event on an accordion item.\n   *\n   * @param index The index of the item that was clicked.\n   */\n  const handleOnClick = (index: number) => {\n    if (onClick) {\n      onClick(index);\n    }\n    const newItems = [...itemsOpen];\n    newItems[index] = !itemsOpen[index];\n    setItemsOpen(newItems);\n  };\n\n  return (\n    <>\n      {items.map((item, index) => (\n        <AccordionItem\n          key={item.id || index}\n          open={itemsOpen[index]}\n          title={item.title}\n          subtitle={item.subtitle}\n          content={item.content}\n          icon={item.icon}\n          media={item.media}\n          showMediaAtAllSizes={item.showMediaAtAllSizes}\n          showMediaCircle={item.showMediaCircle}\n          isContainerAligned={item.isContainerAligned}\n          onClick={() => handleOnClick(index)}\n        />\n      ))}\n    </>\n  );\n};\n\nexport default Accordion;\n"],"names":["Accordion","indexOpen","items","onClick","theme","itemsOpen","setItemsOpen","useState","map","value","index","handleOnClick","newItems","_jsx","_Fragment","children","item","AccordionItem","open","title","subtitle","content","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","id"],"mappings":";;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,SAA6B,GAAGA,CAAC;EAAEC,SAAS,GAAG,EAAE;EAAEC,KAAK;EAAEC,OAAO;AAAEC,EAAAA,KAAK,GAAG;AAAQ,CAAC,KAAK;EAC7F,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,QAAQ,CAAC,MACzCL,KAAK,CAACM,GAAG,CAAC,CAACC,KAAK,EAAEC,KAAK,KAAKA,KAAK,KAAKT,SAAS,CACjD,CAAC;;AAED;AACF;AACA;AACA;AACA;EACE,MAAMU,aAAa,GAAID,KAAa,IAAK;AACvC,IAAA,IAAIP,OAAO,EAAE;MACXA,OAAO,CAACO,KAAK,CAAC;AAChB,IAAA;AACA,IAAA,MAAME,QAAQ,GAAG,CAAC,GAAGP,SAAS,CAAC;IAC/BO,QAAQ,CAACF,KAAK,CAAC,GAAG,CAACL,SAAS,CAACK,KAAK,CAAC;IACnCJ,YAAY,CAACM,QAAQ,CAAC;EACxB,CAAC;EAED,oBACEC,GAAA,CAAAC,QAAA,EAAA;AAAAC,IAAAA,QAAA,EACGb,KAAK,CAACM,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK,kBACrBG,GAAA,CAACI,aAAa,EAAA;AAEZC,MAAAA,IAAI,EAAEb,SAAS,CAACK,KAAK,CAAE;MACvBS,KAAK,EAAEH,IAAI,CAACG,KAAM;MAClBC,QAAQ,EAAEJ,IAAI,CAACI,QAAS;MACxBC,OAAO,EAAEL,IAAI,CAACK,OAAQ;MACtBC,IAAI,EAAEN,IAAI,CAACM,IAAK;MAChBC,KAAK,EAAEP,IAAI,CAACO,KAAM;MAClBC,mBAAmB,EAAER,IAAI,CAACQ,mBAAoB;MAC9CC,eAAe,EAAET,IAAI,CAACS,eAAgB;MACtCC,kBAAkB,EAAEV,IAAI,CAACU,kBAAmB;AAC5CvB,MAAAA,OAAO,EAAEA,MAAMQ,aAAa,CAACD,KAAK;AAAE,KAAA,EAV/BM,IAAI,CAACW,EAAE,IAAIjB,KAWjB,CACF;AAAC,GACF,CAAC;AAEP;;;;"}

package/build/accordion/AccordionItem/AccordionItem.js

@@ -6,31 +6,54 @@ var clsx = require('clsx');
 var React = require('react');
 var Body = require('../../body/Body.js');
 var Chevron = require('../../chevron/Chevron.js');
-require('../../common/theme.js');
-require('../../common/direction.js');
-require('../../common/propsValues/control.js');
-require('../../common/propsValues/breakpoint.js');
 var size = require('../../common/propsValues/size.js');
 var typography = require('../../common/propsValues/typography.js');
-require('../../common/propsValues/width.js');
-require('../../common/propsValues/type.js');
-require('../../common/propsValues/dateMode.js');
-require('../../common/propsValues/monthFormat.js');
 var position = require('../../common/propsValues/position.js');
-require('../../common/propsValues/layouts.js');
-require('../../common/propsValues/status.js');
-require('../../common/propsValues/sentiment.js');
-require('../../common/propsValues/profileType.js');
-require('../../common/propsValues/variant.js');
-require('../../common/propsValues/scroll.js');
-require('../../common/propsValues/markdownNodeType.js');
-require('../../common/fileType.js');
 require('@transferwise/icons');
 require('react-intl');
 require('../../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
 var Option = require('../../common/Option/Option.js');
 
+/**
+ * AccordionItem
+ *
+ * A single item in an accordion component.
+ *
+ * @component
+ * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.
+ * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.
+ * @param {ReactNode} title - The title of the accordion item.
+ * @param {ReactNode} subtitle - The subtitle of the accordion item.
+ * @param {ReactNode} content - The content of the accordion item.
+ * @param {Function} onClick - A callback function that is called when the accordion item is clicked.
+ * @param {boolean} open - Whether the accordion item is currently open or closed.
+ * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.
+ * @param {ReactNode} [media] - An optional media to display next to the accordion item.
+ * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.
+ * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.
+ * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.
+ * @example
+ * // Example usage:
+ *
+ * import AccordionItem from './AccordionItem';
+ *
+ * function App() {
+ *   const handleItemClick = () => {
+ *     console.log('Accordion item was clicked.');
+ *   };
+ *
+ *   return (
+ *     <AccordionItem
+ *       title={<h2>Item Title</h2>}
+ *       content={<p>Item content goes here.</p>}
+ *       onClick={handleItemClick}
+ *       open={true}
+ *       icon={<Chevron />}
+ *     />
+ *   );
+ * }
+ */
 const AccordionItem = ({
   'aria-label': ariaLabel,
   id,

package/build/accordion/AccordionItem/AccordionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.js","sources":["../../../src/accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { IdIconProps } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { FC, ReactNode, cloneElement, useId } from 'react';\n\nimport Body from '../../body';\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport Option from '../../common/Option';\n\nexport interface AccordionItemProps {\n  /** A label for the accordion item, used for accessibility purposes. */\n  'aria-label'?: string;\n  /** An ID for the accordion item, used for accessibility purposes. */\n  id?: string;\n  /** The title of the accordion item. */\n  title: ReactNode;\n  /** The subtitle of the accordion item. */\n  subtitle?: ReactNode;\n  /** The content of the accordion item. */\n  content: ReactNode;\n  /** A callback function that is called when the accordion item is clicked. */\n  onClick: () => void;\n  /** Whether the accordion item is currently open or closed. */\n  open: boolean;\n  /** An optional icon to display next to the accordion item title. */\n  icon?: ReactNode;\n  /** An optional media element to display next to the accordion item title. */\n  media?: ReactNode;\n  /** An optional showMediaAtAllSizes with media available at all sizes of the screen. */\n  showMediaAtAllSizes?: boolean;\n  /** An optional showMediaCircle to display media within the circle. */\n  showMediaCircle?: boolean;\n  /** An optional isContainerAligned to display media aligned with the container. */\n  isContainerAligned?: boolean;\n  /** @deprecated ... */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * AccordionItem\n *\n * A single item in an accordion component.\n *\n * @component\n * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.\n * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.\n * @param {ReactNode} title - The title of the accordion item.\n * @param {ReactNode} subtitle - The subtitle of the accordion item.\n * @param {ReactNode} content - The content of the accordion item.\n * @param {Function} onClick - A callback function that is called when the accordion item is clicked.\n * @param {boolean} open - Whether the accordion item is currently open or closed.\n * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.\n * @param {ReactNode} [media] - An optional media to display next to the accordion item.\n * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.\n * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.\n * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.\n * @example\n * // Example usage:\n *\n * import AccordionItem from './AccordionItem';\n *\n * function App() {\n *   const handleItemClick = () => {\n *     console.log('Accordion item was clicked.');\n *   };\n *\n *   return (\n *     <AccordionItem\n *       title={<h2>Item Title</h2>}\n *       content={<p>Item content goes here.</p>}\n *       onClick={handleItemClick}\n *       open={true}\n *       icon={<Chevron />}\n *     />\n *   );\n * }\n */\nconst AccordionItem: FC<AccordionItemProps> = ({\n  'aria-label': ariaLabel,\n  id,\n  title,\n  subtitle,\n  content,\n  onClick,\n  open,\n  icon,\n  media,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  theme = 'light',\n}) => {\n  const mediaElement = icon\n    ? cloneElement(icon as React.ReactElement<IdIconProps>, { size: 24 })\n    : media;\n  const fallbackId = useId();\n  const accordionId = id ?? fallbackId;\n\n  return (\n    <div\n      id={accordionId}\n      className={clsx('np-accordion-item', {\n        'np-accordion-item--open': open,\n        'np-accordion-item--with-icon': Boolean(icon),\n        'np-accordion-item--with-media': Boolean(media),\n      })}\n    >\n      <Option\n        aria-label={ariaLabel}\n        as=\"button\"\n        media={mediaElement}\n        title={title}\n        content={subtitle}\n        button={<Chevron orientation={open ? Position.TOP : Position.BOTTOM} size={Size.MEDIUM} />}\n        inverseMediaCircle={false}\n        aria-expanded={open}\n        aria-controls={`${accordionId}-section`}\n        id={`${accordionId}-control`}\n        showMediaCircle={showMediaCircle}\n        showMediaAtAllSizes={showMediaAtAllSizes}\n        isContainerAligned={isContainerAligned}\n        onClick={onClick}\n      />\n      {open && (\n        <div id={`${accordionId}-section`} role=\"region\" aria-labelledby={`${accordionId}-control`}>\n          <Body\n            as=\"span\"\n            type={Typography.BODY_LARGE}\n            className={clsx('np-accordion-item__content', 'd-block', {\n              'has-icon': icon,\n            })}\n          >\n            {content}\n          </Body>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default AccordionItem;\n"],"names":["AccordionItem","ariaLabel","id","title","subtitle","content","onClick","open","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","theme","mediaElement","cloneElement","size","fallbackId","useId","accordionId","_jsxs","className","clsx","Boolean","children","_jsx","Option","as","button","Chevron","orientation","Position","TOP","BOTTOM","Size","MEDIUM","inverseMediaCircle","role","Body","type","Typography","BODY_LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6EA,MAAMA,aAAa,GAA2BA,CAAC;AAC7C,EAAA,YAAY,EAAEC,SAAS;EACvBC,EAAE;EACFC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,OAAO;EACPC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;AAClBC,EAAAA,KAAK,GAAG;AAAO,CAChB,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGN,IAAI,gBACrBO,kBAAY,CAACP,IAAuC,EAAE;AAAEQ,IAAAA,IAAI,EAAE;GAAI,CAAC,GACnEP,KAAK;AACT,EAAA,MAAMQ,UAAU,GAAGC,WAAK,EAAE;AAC1B,EAAA,MAAMC,WAAW,GAAGjB,EAAE,IAAIe,UAAU;AAEpC,EAAA,oBACEG,eAAA,CAAA,KAAA,EAAA;AACElB,IAAAA,EAAE,EAAEiB,WAAY;AAChBE,IAAAA,SAAS,EAAEC,SAAI,CAAC,mBAAmB,EAAE;AACnC,MAAA,yBAAyB,EAAEf,IAAI;AAC/B,MAAA,8BAA8B,EAAEgB,OAAO,CAACf,IAAI,CAAC;MAC7C,+BAA+B,EAAEe,OAAO,CAACd,KAAK;AAC/C,KAAA,CAAE;IAAAe,QAAA,EAAA,cAEHC,cAAA,CAACC,cAAM,EAAA;AACL,MAAA,YAAA,EAAYzB,SAAU;AACtB0B,MAAAA,EAAE,EAAC,QAAQ;AACXlB,MAAAA,KAAK,EAAEK,YAAa;AACpBX,MAAAA,KAAK,EAAEA,KAAM;AACbE,MAAAA,OAAO,EAAED,QAAS;MAClBwB,MAAM,eAAEH,cAAA,CAACI,eAAO,EAAA;QAACC,WAAW,EAAEvB,IAAI,GAAGwB,iBAAQ,CAACC,GAAG,GAAGD,iBAAQ,CAACE,MAAO;QAACjB,IAAI,EAAEkB,SAAI,CAACC;AAAO,OAAA,CAAI;AAC3FC,MAAAA,kBAAkB,EAAE,KAAM;AAC1B,MAAA,eAAA,EAAe7B,IAAK;MACpB,eAAA,EAAe,CAAA,EAAGY,WAAW,CAAA,QAAA,CAAW;MACxCjB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAC7BR,MAAAA,eAAe,EAAEA,eAAgB;AACjCD,MAAAA,mBAAmB,EAAEA,mBAAoB;AACzCE,MAAAA,kBAAkB,EAAEA,kBAAmB;AACvCN,MAAAA,OAAO,EAAEA;AAAQ,KAAA,CAEnB,EAACC,IAAI,iBACHkB,cAAA,CAAA,KAAA,EAAA;MAAKvB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAACkB,MAAAA,IAAI,EAAC,QAAQ;MAAC,iBAAA,EAAiB,CAAA,EAAGlB,WAAW,CAAA,QAAA,CAAW;MAAAK,QAAA,eACzFC,cAAA,CAACa,YAAI,EAAA;AACHX,QAAAA,EAAE,EAAC,MAAM;QACTY,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BpB,QAAAA,SAAS,EAAEC,SAAI,CAAC,4BAA4B,EAAE,SAAS,EAAE;AACvD,UAAA,UAAU,EAAEd;AACb,SAAA,CAAE;AAAAgB,QAAAA,QAAA,EAEFnB;OACG;AACR,KAAK,CACN;AAAA,GACE,CAAC;AAEV;;;;"}
+{"version":3,"file":"AccordionItem.js","sources":["../../../src/accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { IdIconProps } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { FC, ReactNode, cloneElement, useId } from 'react';\n\nimport Body from '../../body';\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport Option from '../../common/Option';\n\nexport interface AccordionItemProps {\n  /** A label for the accordion item, used for accessibility purposes. */\n  'aria-label'?: string;\n  /** An ID for the accordion item, used for accessibility purposes. */\n  id?: string;\n  /** The title of the accordion item. */\n  title: ReactNode;\n  /** The subtitle of the accordion item. */\n  subtitle?: ReactNode;\n  /** The content of the accordion item. */\n  content: ReactNode;\n  /** A callback function that is called when the accordion item is clicked. */\n  onClick: () => void;\n  /** Whether the accordion item is currently open or closed. */\n  open: boolean;\n  /** An optional icon to display next to the accordion item title. */\n  icon?: ReactNode;\n  /** An optional media element to display next to the accordion item title. */\n  media?: ReactNode;\n  /** An optional showMediaAtAllSizes with media available at all sizes of the screen. */\n  showMediaAtAllSizes?: boolean;\n  /** An optional showMediaCircle to display media within the circle. */\n  showMediaCircle?: boolean;\n  /** An optional isContainerAligned to display media aligned with the container. */\n  isContainerAligned?: boolean;\n  /** @deprecated ... */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * AccordionItem\n *\n * A single item in an accordion component.\n *\n * @component\n * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.\n * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.\n * @param {ReactNode} title - The title of the accordion item.\n * @param {ReactNode} subtitle - The subtitle of the accordion item.\n * @param {ReactNode} content - The content of the accordion item.\n * @param {Function} onClick - A callback function that is called when the accordion item is clicked.\n * @param {boolean} open - Whether the accordion item is currently open or closed.\n * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.\n * @param {ReactNode} [media] - An optional media to display next to the accordion item.\n * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.\n * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.\n * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.\n * @example\n * // Example usage:\n *\n * import AccordionItem from './AccordionItem';\n *\n * function App() {\n *   const handleItemClick = () => {\n *     console.log('Accordion item was clicked.');\n *   };\n *\n *   return (\n *     <AccordionItem\n *       title={<h2>Item Title</h2>}\n *       content={<p>Item content goes here.</p>}\n *       onClick={handleItemClick}\n *       open={true}\n *       icon={<Chevron />}\n *     />\n *   );\n * }\n */\nconst AccordionItem: FC<AccordionItemProps> = ({\n  'aria-label': ariaLabel,\n  id,\n  title,\n  subtitle,\n  content,\n  onClick,\n  open,\n  icon,\n  media,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  theme = 'light',\n}) => {\n  const mediaElement = icon\n    ? cloneElement(icon as React.ReactElement<IdIconProps>, { size: 24 })\n    : media;\n  const fallbackId = useId();\n  const accordionId = id ?? fallbackId;\n\n  return (\n    <div\n      id={accordionId}\n      className={clsx('np-accordion-item', {\n        'np-accordion-item--open': open,\n        'np-accordion-item--with-icon': Boolean(icon),\n        'np-accordion-item--with-media': Boolean(media),\n      })}\n    >\n      <Option\n        aria-label={ariaLabel}\n        as=\"button\"\n        media={mediaElement}\n        title={title}\n        content={subtitle}\n        button={<Chevron orientation={open ? Position.TOP : Position.BOTTOM} size={Size.MEDIUM} />}\n        inverseMediaCircle={false}\n        aria-expanded={open}\n        aria-controls={`${accordionId}-section`}\n        id={`${accordionId}-control`}\n        showMediaCircle={showMediaCircle}\n        showMediaAtAllSizes={showMediaAtAllSizes}\n        isContainerAligned={isContainerAligned}\n        onClick={onClick}\n      />\n      {open && (\n        <div id={`${accordionId}-section`} role=\"region\" aria-labelledby={`${accordionId}-control`}>\n          <Body\n            as=\"span\"\n            type={Typography.BODY_LARGE}\n            className={clsx('np-accordion-item__content', 'd-block', {\n              'has-icon': icon,\n            })}\n          >\n            {content}\n          </Body>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default AccordionItem;\n"],"names":["AccordionItem","ariaLabel","id","title","subtitle","content","onClick","open","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","theme","mediaElement","cloneElement","size","fallbackId","useId","accordionId","_jsxs","className","clsx","Boolean","children","_jsx","Option","as","button","Chevron","orientation","Position","TOP","BOTTOM","Size","MEDIUM","inverseMediaCircle","role","Body","type","Typography","BODY_LARGE"],"mappings":";;;;;;;;;;;;;;;;;AAsCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,aAAqC,GAAGA,CAAC;AAC7C,EAAA,YAAY,EAAEC,SAAS;EACvBC,EAAE;EACFC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,OAAO;EACPC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;AAClBC,EAAAA,KAAK,GAAG;AACV,CAAC,KAAK;AACJ,EAAA,MAAMC,YAAY,GAAGN,IAAI,gBACrBO,kBAAY,CAACP,IAAI,EAAqC;AAAEQ,IAAAA,IAAI,EAAE;GAAI,CAAC,GACnEP,KAAK;AACT,EAAA,MAAMQ,UAAU,GAAGC,WAAK,EAAE;AAC1B,EAAA,MAAMC,WAAW,GAAGjB,EAAE,IAAIe,UAAU;AAEpC,EAAA,oBACEG,eAAA,CAAA,KAAA,EAAA;AACElB,IAAAA,EAAE,EAAEiB,WAAY;AAChBE,IAAAA,SAAS,EAAEC,SAAI,CAAC,mBAAmB,EAAE;AACnC,MAAA,yBAAyB,EAAEf,IAAI;AAC/B,MAAA,8BAA8B,EAAEgB,OAAO,CAACf,IAAI,CAAC;MAC7C,+BAA+B,EAAEe,OAAO,CAACd,KAAK;AAChD,KAAC,CAAE;IAAAe,QAAA,EAAA,cAEHC,cAAA,CAACC,cAAM,EAAA;AACL,MAAA,YAAA,EAAYzB,SAAU;AACtB0B,MAAAA,EAAE,EAAC,QAAQ;AACXlB,MAAAA,KAAK,EAAEK,YAAa;AACpBX,MAAAA,KAAK,EAAEA,KAAM;AACbE,MAAAA,OAAO,EAAED,QAAS;MAClBwB,MAAM,eAAEH,cAAA,CAACI,eAAO,EAAA;QAACC,WAAW,EAAEvB,IAAI,GAAGwB,iBAAQ,CAACC,GAAG,GAAGD,iBAAQ,CAACE,MAAO;QAACjB,IAAI,EAAEkB,SAAI,CAACC;AAAO,OAAE,CAAE;AAC3FC,MAAAA,kBAAkB,EAAE,KAAM;AAC1B,MAAA,eAAA,EAAe7B,IAAK;MACpB,eAAA,EAAe,CAAA,EAAGY,WAAW,CAAA,QAAA,CAAW;MACxCjB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAC7BR,MAAAA,eAAe,EAAEA,eAAgB;AACjCD,MAAAA,mBAAmB,EAAEA,mBAAoB;AACzCE,MAAAA,kBAAkB,EAAEA,kBAAmB;AACvCN,MAAAA,OAAO,EAAEA;AAAQ,KAClB,CAAC,EACDC,IAAI,iBACHkB,cAAA,CAAA,KAAA,EAAA;MAAKvB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAACkB,MAAAA,IAAI,EAAC,QAAQ;MAAC,iBAAA,EAAiB,CAAA,EAAGlB,WAAW,CAAA,QAAA,CAAW;MAAAK,QAAA,eACzFC,cAAA,CAACa,YAAI,EAAA;AACHX,QAAAA,EAAE,EAAC,MAAM;QACTY,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BpB,QAAAA,SAAS,EAAEC,SAAI,CAAC,4BAA4B,EAAE,SAAS,EAAE;AACvD,UAAA,UAAU,EAAEd;AACd,SAAC,CAAE;AAAAgB,QAAAA,QAAA,EAEFnB;OACG;AAAC,KACJ,CACN;AAAA,GACE,CAAC;AAEV;;;;"}

package/build/accordion/AccordionItem/AccordionItem.mjs

@@ -2,31 +2,54 @@ import { clsx } from 'clsx';
 import { useId, cloneElement } from 'react';
 import Body from '../../body/Body.mjs';
 import Chevron from '../../chevron/Chevron.mjs';
-import '../../common/theme.mjs';
-import '../../common/direction.mjs';
-import '../../common/propsValues/control.mjs';
-import '../../common/propsValues/breakpoint.mjs';
 import { Size } from '../../common/propsValues/size.mjs';
 import { Typography } from '../../common/propsValues/typography.mjs';
-import '../../common/propsValues/width.mjs';
-import '../../common/propsValues/type.mjs';
-import '../../common/propsValues/dateMode.mjs';
-import '../../common/propsValues/monthFormat.mjs';
 import { Position } from '../../common/propsValues/position.mjs';
-import '../../common/propsValues/layouts.mjs';
-import '../../common/propsValues/status.mjs';
-import '../../common/propsValues/sentiment.mjs';
-import '../../common/propsValues/profileType.mjs';
-import '../../common/propsValues/variant.mjs';
-import '../../common/propsValues/scroll.mjs';
-import '../../common/propsValues/markdownNodeType.mjs';
-import '../../common/fileType.mjs';
 import '@transferwise/icons';
 import 'react-intl';
 import '../../common/closeButton/CloseButton.messages.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import Option from '../../common/Option/Option.mjs';
 
+/**
+ * AccordionItem
+ *
+ * A single item in an accordion component.
+ *
+ * @component
+ * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.
+ * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.
+ * @param {ReactNode} title - The title of the accordion item.
+ * @param {ReactNode} subtitle - The subtitle of the accordion item.
+ * @param {ReactNode} content - The content of the accordion item.
+ * @param {Function} onClick - A callback function that is called when the accordion item is clicked.
+ * @param {boolean} open - Whether the accordion item is currently open or closed.
+ * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.
+ * @param {ReactNode} [media] - An optional media to display next to the accordion item.
+ * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.
+ * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.
+ * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.
+ * @example
+ * // Example usage:
+ *
+ * import AccordionItem from './AccordionItem';
+ *
+ * function App() {
+ *   const handleItemClick = () => {
+ *     console.log('Accordion item was clicked.');
+ *   };
+ *
+ *   return (
+ *     <AccordionItem
+ *       title={<h2>Item Title</h2>}
+ *       content={<p>Item content goes here.</p>}
+ *       onClick={handleItemClick}
+ *       open={true}
+ *       icon={<Chevron />}
+ *     />
+ *   );
+ * }
+ */
 const AccordionItem = ({
   'aria-label': ariaLabel,
   id,

package/build/accordion/AccordionItem/AccordionItem.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionItem.mjs","sources":["../../../src/accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { IdIconProps } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { FC, ReactNode, cloneElement, useId } from 'react';\n\nimport Body from '../../body';\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport Option from '../../common/Option';\n\nexport interface AccordionItemProps {\n  /** A label for the accordion item, used for accessibility purposes. */\n  'aria-label'?: string;\n  /** An ID for the accordion item, used for accessibility purposes. */\n  id?: string;\n  /** The title of the accordion item. */\n  title: ReactNode;\n  /** The subtitle of the accordion item. */\n  subtitle?: ReactNode;\n  /** The content of the accordion item. */\n  content: ReactNode;\n  /** A callback function that is called when the accordion item is clicked. */\n  onClick: () => void;\n  /** Whether the accordion item is currently open or closed. */\n  open: boolean;\n  /** An optional icon to display next to the accordion item title. */\n  icon?: ReactNode;\n  /** An optional media element to display next to the accordion item title. */\n  media?: ReactNode;\n  /** An optional showMediaAtAllSizes with media available at all sizes of the screen. */\n  showMediaAtAllSizes?: boolean;\n  /** An optional showMediaCircle to display media within the circle. */\n  showMediaCircle?: boolean;\n  /** An optional isContainerAligned to display media aligned with the container. */\n  isContainerAligned?: boolean;\n  /** @deprecated ... */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * AccordionItem\n *\n * A single item in an accordion component.\n *\n * @component\n * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.\n * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.\n * @param {ReactNode} title - The title of the accordion item.\n * @param {ReactNode} subtitle - The subtitle of the accordion item.\n * @param {ReactNode} content - The content of the accordion item.\n * @param {Function} onClick - A callback function that is called when the accordion item is clicked.\n * @param {boolean} open - Whether the accordion item is currently open or closed.\n * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.\n * @param {ReactNode} [media] - An optional media to display next to the accordion item.\n * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.\n * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.\n * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.\n * @example\n * // Example usage:\n *\n * import AccordionItem from './AccordionItem';\n *\n * function App() {\n *   const handleItemClick = () => {\n *     console.log('Accordion item was clicked.');\n *   };\n *\n *   return (\n *     <AccordionItem\n *       title={<h2>Item Title</h2>}\n *       content={<p>Item content goes here.</p>}\n *       onClick={handleItemClick}\n *       open={true}\n *       icon={<Chevron />}\n *     />\n *   );\n * }\n */\nconst AccordionItem: FC<AccordionItemProps> = ({\n  'aria-label': ariaLabel,\n  id,\n  title,\n  subtitle,\n  content,\n  onClick,\n  open,\n  icon,\n  media,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  theme = 'light',\n}) => {\n  const mediaElement = icon\n    ? cloneElement(icon as React.ReactElement<IdIconProps>, { size: 24 })\n    : media;\n  const fallbackId = useId();\n  const accordionId = id ?? fallbackId;\n\n  return (\n    <div\n      id={accordionId}\n      className={clsx('np-accordion-item', {\n        'np-accordion-item--open': open,\n        'np-accordion-item--with-icon': Boolean(icon),\n        'np-accordion-item--with-media': Boolean(media),\n      })}\n    >\n      <Option\n        aria-label={ariaLabel}\n        as=\"button\"\n        media={mediaElement}\n        title={title}\n        content={subtitle}\n        button={<Chevron orientation={open ? Position.TOP : Position.BOTTOM} size={Size.MEDIUM} />}\n        inverseMediaCircle={false}\n        aria-expanded={open}\n        aria-controls={`${accordionId}-section`}\n        id={`${accordionId}-control`}\n        showMediaCircle={showMediaCircle}\n        showMediaAtAllSizes={showMediaAtAllSizes}\n        isContainerAligned={isContainerAligned}\n        onClick={onClick}\n      />\n      {open && (\n        <div id={`${accordionId}-section`} role=\"region\" aria-labelledby={`${accordionId}-control`}>\n          <Body\n            as=\"span\"\n            type={Typography.BODY_LARGE}\n            className={clsx('np-accordion-item__content', 'd-block', {\n              'has-icon': icon,\n            })}\n          >\n            {content}\n          </Body>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default AccordionItem;\n"],"names":["AccordionItem","ariaLabel","id","title","subtitle","content","onClick","open","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","theme","mediaElement","cloneElement","size","fallbackId","useId","accordionId","_jsxs","className","clsx","Boolean","children","_jsx","Option","as","button","Chevron","orientation","Position","TOP","BOTTOM","Size","MEDIUM","inverseMediaCircle","role","Body","type","Typography","BODY_LARGE"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6EA,MAAMA,aAAa,GAA2BA,CAAC;AAC7C,EAAA,YAAY,EAAEC,SAAS;EACvBC,EAAE;EACFC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,OAAO;EACPC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;AAClBC,EAAAA,KAAK,GAAG;AAAO,CAChB,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGN,IAAI,gBACrBO,YAAY,CAACP,IAAuC,EAAE;AAAEQ,IAAAA,IAAI,EAAE;GAAI,CAAC,GACnEP,KAAK;AACT,EAAA,MAAMQ,UAAU,GAAGC,KAAK,EAAE;AAC1B,EAAA,MAAMC,WAAW,GAAGjB,EAAE,IAAIe,UAAU;AAEpC,EAAA,oBACEG,IAAA,CAAA,KAAA,EAAA;AACElB,IAAAA,EAAE,EAAEiB,WAAY;AAChBE,IAAAA,SAAS,EAAEC,IAAI,CAAC,mBAAmB,EAAE;AACnC,MAAA,yBAAyB,EAAEf,IAAI;AAC/B,MAAA,8BAA8B,EAAEgB,OAAO,CAACf,IAAI,CAAC;MAC7C,+BAA+B,EAAEe,OAAO,CAACd,KAAK;AAC/C,KAAA,CAAE;IAAAe,QAAA,EAAA,cAEHC,GAAA,CAACC,MAAM,EAAA;AACL,MAAA,YAAA,EAAYzB,SAAU;AACtB0B,MAAAA,EAAE,EAAC,QAAQ;AACXlB,MAAAA,KAAK,EAAEK,YAAa;AACpBX,MAAAA,KAAK,EAAEA,KAAM;AACbE,MAAAA,OAAO,EAAED,QAAS;MAClBwB,MAAM,eAAEH,GAAA,CAACI,OAAO,EAAA;QAACC,WAAW,EAAEvB,IAAI,GAAGwB,QAAQ,CAACC,GAAG,GAAGD,QAAQ,CAACE,MAAO;QAACjB,IAAI,EAAEkB,IAAI,CAACC;AAAO,OAAA,CAAI;AAC3FC,MAAAA,kBAAkB,EAAE,KAAM;AAC1B,MAAA,eAAA,EAAe7B,IAAK;MACpB,eAAA,EAAe,CAAA,EAAGY,WAAW,CAAA,QAAA,CAAW;MACxCjB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAC7BR,MAAAA,eAAe,EAAEA,eAAgB;AACjCD,MAAAA,mBAAmB,EAAEA,mBAAoB;AACzCE,MAAAA,kBAAkB,EAAEA,kBAAmB;AACvCN,MAAAA,OAAO,EAAEA;AAAQ,KAAA,CAEnB,EAACC,IAAI,iBACHkB,GAAA,CAAA,KAAA,EAAA;MAAKvB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAACkB,MAAAA,IAAI,EAAC,QAAQ;MAAC,iBAAA,EAAiB,CAAA,EAAGlB,WAAW,CAAA,QAAA,CAAW;MAAAK,QAAA,eACzFC,GAAA,CAACa,IAAI,EAAA;AACHX,QAAAA,EAAE,EAAC,MAAM;QACTY,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BpB,QAAAA,SAAS,EAAEC,IAAI,CAAC,4BAA4B,EAAE,SAAS,EAAE;AACvD,UAAA,UAAU,EAAEd;AACb,SAAA,CAAE;AAAAgB,QAAAA,QAAA,EAEFnB;OACG;AACR,KAAK,CACN;AAAA,GACE,CAAC;AAEV;;;;"}
+{"version":3,"file":"AccordionItem.mjs","sources":["../../../src/accordion/AccordionItem/AccordionItem.tsx"],"sourcesContent":["import { IdIconProps } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { FC, ReactNode, cloneElement, useId } from 'react';\n\nimport Body from '../../body';\nimport Chevron from '../../chevron';\nimport { Position, Size, Typography } from '../../common';\nimport Option from '../../common/Option';\n\nexport interface AccordionItemProps {\n  /** A label for the accordion item, used for accessibility purposes. */\n  'aria-label'?: string;\n  /** An ID for the accordion item, used for accessibility purposes. */\n  id?: string;\n  /** The title of the accordion item. */\n  title: ReactNode;\n  /** The subtitle of the accordion item. */\n  subtitle?: ReactNode;\n  /** The content of the accordion item. */\n  content: ReactNode;\n  /** A callback function that is called when the accordion item is clicked. */\n  onClick: () => void;\n  /** Whether the accordion item is currently open or closed. */\n  open: boolean;\n  /** An optional icon to display next to the accordion item title. */\n  icon?: ReactNode;\n  /** An optional media element to display next to the accordion item title. */\n  media?: ReactNode;\n  /** An optional showMediaAtAllSizes with media available at all sizes of the screen. */\n  showMediaAtAllSizes?: boolean;\n  /** An optional showMediaCircle to display media within the circle. */\n  showMediaCircle?: boolean;\n  /** An optional isContainerAligned to display media aligned with the container. */\n  isContainerAligned?: boolean;\n  /** @deprecated ... */\n  theme?: 'light' | 'dark';\n}\n\n/**\n * AccordionItem\n *\n * A single item in an accordion component.\n *\n * @component\n * @param {string} [aria-label] - A label for the accordion item, used for accessibility purposes.\n * @param {string} [id] - An ID for the accordion item, used for accessibility purposes.\n * @param {ReactNode} title - The title of the accordion item.\n * @param {ReactNode} subtitle - The subtitle of the accordion item.\n * @param {ReactNode} content - The content of the accordion item.\n * @param {Function} onClick - A callback function that is called when the accordion item is clicked.\n * @param {boolean} open - Whether the accordion item is currently open or closed.\n * @param {ReactNode} [icon] - An optional icon to display next to the accordion item title.\n * @param {ReactNode} [media] - An optional media to display next to the accordion item.\n * @param {boolean} [showMediaAtAllSizes] - An optional showMediaAtAllSizes with media available at all sizes of the screen.\n * @param {boolean} [showMediaCircle] - An optional showMediaCircle to display media within the circle.\n * @param {boolean} [isContainerAligned] - An optional isContainerAligned to display media aligned with the container.\n * @example\n * // Example usage:\n *\n * import AccordionItem from './AccordionItem';\n *\n * function App() {\n *   const handleItemClick = () => {\n *     console.log('Accordion item was clicked.');\n *   };\n *\n *   return (\n *     <AccordionItem\n *       title={<h2>Item Title</h2>}\n *       content={<p>Item content goes here.</p>}\n *       onClick={handleItemClick}\n *       open={true}\n *       icon={<Chevron />}\n *     />\n *   );\n * }\n */\nconst AccordionItem: FC<AccordionItemProps> = ({\n  'aria-label': ariaLabel,\n  id,\n  title,\n  subtitle,\n  content,\n  onClick,\n  open,\n  icon,\n  media,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  theme = 'light',\n}) => {\n  const mediaElement = icon\n    ? cloneElement(icon as React.ReactElement<IdIconProps>, { size: 24 })\n    : media;\n  const fallbackId = useId();\n  const accordionId = id ?? fallbackId;\n\n  return (\n    <div\n      id={accordionId}\n      className={clsx('np-accordion-item', {\n        'np-accordion-item--open': open,\n        'np-accordion-item--with-icon': Boolean(icon),\n        'np-accordion-item--with-media': Boolean(media),\n      })}\n    >\n      <Option\n        aria-label={ariaLabel}\n        as=\"button\"\n        media={mediaElement}\n        title={title}\n        content={subtitle}\n        button={<Chevron orientation={open ? Position.TOP : Position.BOTTOM} size={Size.MEDIUM} />}\n        inverseMediaCircle={false}\n        aria-expanded={open}\n        aria-controls={`${accordionId}-section`}\n        id={`${accordionId}-control`}\n        showMediaCircle={showMediaCircle}\n        showMediaAtAllSizes={showMediaAtAllSizes}\n        isContainerAligned={isContainerAligned}\n        onClick={onClick}\n      />\n      {open && (\n        <div id={`${accordionId}-section`} role=\"region\" aria-labelledby={`${accordionId}-control`}>\n          <Body\n            as=\"span\"\n            type={Typography.BODY_LARGE}\n            className={clsx('np-accordion-item__content', 'd-block', {\n              'has-icon': icon,\n            })}\n          >\n            {content}\n          </Body>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default AccordionItem;\n"],"names":["AccordionItem","ariaLabel","id","title","subtitle","content","onClick","open","icon","media","showMediaAtAllSizes","showMediaCircle","isContainerAligned","theme","mediaElement","cloneElement","size","fallbackId","useId","accordionId","_jsxs","className","clsx","Boolean","children","_jsx","Option","as","button","Chevron","orientation","Position","TOP","BOTTOM","Size","MEDIUM","inverseMediaCircle","role","Body","type","Typography","BODY_LARGE"],"mappings":";;;;;;;;;;;;;AAsCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,aAAqC,GAAGA,CAAC;AAC7C,EAAA,YAAY,EAAEC,SAAS;EACvBC,EAAE;EACFC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,OAAO;EACPC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;AAClBC,EAAAA,KAAK,GAAG;AACV,CAAC,KAAK;AACJ,EAAA,MAAMC,YAAY,GAAGN,IAAI,gBACrBO,YAAY,CAACP,IAAI,EAAqC;AAAEQ,IAAAA,IAAI,EAAE;GAAI,CAAC,GACnEP,KAAK;AACT,EAAA,MAAMQ,UAAU,GAAGC,KAAK,EAAE;AAC1B,EAAA,MAAMC,WAAW,GAAGjB,EAAE,IAAIe,UAAU;AAEpC,EAAA,oBACEG,IAAA,CAAA,KAAA,EAAA;AACElB,IAAAA,EAAE,EAAEiB,WAAY;AAChBE,IAAAA,SAAS,EAAEC,IAAI,CAAC,mBAAmB,EAAE;AACnC,MAAA,yBAAyB,EAAEf,IAAI;AAC/B,MAAA,8BAA8B,EAAEgB,OAAO,CAACf,IAAI,CAAC;MAC7C,+BAA+B,EAAEe,OAAO,CAACd,KAAK;AAChD,KAAC,CAAE;IAAAe,QAAA,EAAA,cAEHC,GAAA,CAACC,MAAM,EAAA;AACL,MAAA,YAAA,EAAYzB,SAAU;AACtB0B,MAAAA,EAAE,EAAC,QAAQ;AACXlB,MAAAA,KAAK,EAAEK,YAAa;AACpBX,MAAAA,KAAK,EAAEA,KAAM;AACbE,MAAAA,OAAO,EAAED,QAAS;MAClBwB,MAAM,eAAEH,GAAA,CAACI,OAAO,EAAA;QAACC,WAAW,EAAEvB,IAAI,GAAGwB,QAAQ,CAACC,GAAG,GAAGD,QAAQ,CAACE,MAAO;QAACjB,IAAI,EAAEkB,IAAI,CAACC;AAAO,OAAE,CAAE;AAC3FC,MAAAA,kBAAkB,EAAE,KAAM;AAC1B,MAAA,eAAA,EAAe7B,IAAK;MACpB,eAAA,EAAe,CAAA,EAAGY,WAAW,CAAA,QAAA,CAAW;MACxCjB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAC7BR,MAAAA,eAAe,EAAEA,eAAgB;AACjCD,MAAAA,mBAAmB,EAAEA,mBAAoB;AACzCE,MAAAA,kBAAkB,EAAEA,kBAAmB;AACvCN,MAAAA,OAAO,EAAEA;AAAQ,KAClB,CAAC,EACDC,IAAI,iBACHkB,GAAA,CAAA,KAAA,EAAA;MAAKvB,EAAE,EAAE,CAAA,EAAGiB,WAAW,CAAA,QAAA,CAAW;AAACkB,MAAAA,IAAI,EAAC,QAAQ;MAAC,iBAAA,EAAiB,CAAA,EAAGlB,WAAW,CAAA,QAAA,CAAW;MAAAK,QAAA,eACzFC,GAAA,CAACa,IAAI,EAAA;AACHX,QAAAA,EAAE,EAAC,MAAM;QACTY,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BpB,QAAAA,SAAS,EAAEC,IAAI,CAAC,4BAA4B,EAAE,SAAS,EAAE;AACvD,UAAA,UAAU,EAAEd;AACd,SAAC,CAAE;AAAAgB,QAAAA,QAAA,EAEFnB;OACG;AAAC,KACJ,CACN;AAAA,GACE,CAAC;AAEV;;;;"}

package/build/actionButton/ActionButton.js

@@ -4,30 +4,15 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var clsx = require('clsx');
 var React = require('react');
-require('../common/theme.js');
-require('../common/direction.js');
 var control = require('../common/propsValues/control.js');
-require('../common/propsValues/breakpoint.js');
-require('../common/propsValues/size.js');
-require('../common/propsValues/typography.js');
-require('../common/propsValues/width.js');
-require('../common/propsValues/type.js');
-require('../common/propsValues/dateMode.js');
-require('../common/propsValues/monthFormat.js');
-require('../common/propsValues/position.js');
-require('../common/propsValues/layouts.js');
-require('../common/propsValues/status.js');
-require('../common/propsValues/sentiment.js');
-require('../common/propsValues/profileType.js');
-require('../common/propsValues/variant.js');
-require('../common/propsValues/scroll.js');
-require('../common/propsValues/markdownNodeType.js');
-require('../common/fileType.js');
 require('@transferwise/icons');
 require('react-intl');
 require('../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
 
+/**
+ * @deprecated use `<Button v2 size="sm" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead
+ */
 const ActionButton = /*#__PURE__*/React.forwardRef(({
   disabled = false,
   className = undefined,

package/build/actionButton/ActionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButton.js","sources":["../../src/actionButton/ActionButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ButtonHTMLAttributes, forwardRef } from 'react';\n\nimport { Priority, PriorityPrimary, PrioritySecondary, PriorityTertiary } from '../common';\n\n/**\n * @deprecated use `<Button />` component instead with `ButtonProps`\n */\nexport type ActionButtonProps = {\n  priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary;\n  /**\n   * @deprecated use `children` instead\n   */\n  text?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * @deprecated use `<Button v2 size=\"sm\" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead\n */\nconst ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  (\n    {\n      disabled = false,\n      className = undefined,\n      onClick,\n      priority = Priority.PRIMARY,\n      text,\n      children,\n      ...rest\n    }: ActionButtonProps,\n    reference,\n  ) => (\n    <button\n      ref={reference}\n      type=\"button\"\n      className={clsx(\n        'np-action-btn',\n        'np-text-body-default-bold',\n        priority === Priority.TERTIARY\n          ? 'btn-priority-3'\n          : priority === Priority.SECONDARY\n            ? 'btn-priority-2'\n            : 'btn-priority-1',\n        className,\n      )}\n      disabled={disabled}\n      onClick={onClick}\n      {...rest}\n    >\n      {children || text}\n    </button>\n  ),\n);\n\nexport default ActionButton;\n"],"names":["ActionButton","forwardRef","disabled","className","undefined","onClick","priority","Priority","PRIMARY","text","children","rest","reference","_jsx","ref","type","clsx","TERTIARY","SECONDARY"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAMA,YAAY,gBAAGC,gBAAU,CAC7B,CACE;AACEC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;EACPC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,IAAI;EACJC,QAAQ;EACR,GAAGC;AAAI,CACW,EACpBC,SAAS,kBAETC,cAAA,CAAA,QAAA,EAAA;AACEC,EAAAA,GAAG,EAAEF,SAAU;AACfG,EAAAA,IAAI,EAAC,QAAQ;EACbZ,SAAS,EAAEa,SAAI,CACb,eAAe,EACf,2BAA2B,EAC3BV,QAAQ,KAAKC,gBAAQ,CAACU,QAAQ,GAC1B,gBAAgB,GAChBX,QAAQ,KAAKC,gBAAQ,CAACW,SAAS,GAC7B,gBAAgB,GAChB,gBAAgB,EACtBf,SAAS,CACT;AACFD,EAAAA,QAAQ,EAAEA,QAAS;AACnBG,EAAAA,OAAO,EAAEA,OAAQ;AAAA,EAAA,GACbM,IAAI;EAAAD,QAAA,EAEPA,QAAQ,IAAID;AAAI,CACX,CACT;;;;"}
+{"version":3,"file":"ActionButton.js","sources":["../../src/actionButton/ActionButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ButtonHTMLAttributes, forwardRef } from 'react';\n\nimport { Priority, PriorityPrimary, PrioritySecondary, PriorityTertiary } from '../common';\n\n/**\n * @deprecated use `<Button />` component instead with `ButtonProps`\n */\nexport type ActionButtonProps = {\n  priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary;\n  /**\n   * @deprecated use `children` instead\n   */\n  text?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * @deprecated use `<Button v2 size=\"sm\" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead\n */\nconst ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  (\n    {\n      disabled = false,\n      className = undefined,\n      onClick,\n      priority = Priority.PRIMARY,\n      text,\n      children,\n      ...rest\n    }: ActionButtonProps,\n    reference,\n  ) => (\n    <button\n      ref={reference}\n      type=\"button\"\n      className={clsx(\n        'np-action-btn',\n        'np-text-body-default-bold',\n        priority === Priority.TERTIARY\n          ? 'btn-priority-3'\n          : priority === Priority.SECONDARY\n            ? 'btn-priority-2'\n            : 'btn-priority-1',\n        className,\n      )}\n      disabled={disabled}\n      onClick={onClick}\n      {...rest}\n    >\n      {children || text}\n    </button>\n  ),\n);\n\nexport default ActionButton;\n"],"names":["ActionButton","forwardRef","disabled","className","undefined","onClick","priority","Priority","PRIMARY","text","children","rest","reference","_jsx","ref","type","clsx","TERTIARY","SECONDARY"],"mappings":";;;;;;;;;;;;AAgBA;AACA;AACA;AACA,MAAMA,YAAY,gBAAGC,gBAAU,CAC7B,CACE;AACEC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;EACPC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,IAAI;EACJC,QAAQ;EACR,GAAGC;AACc,CAAC,EACpBC,SAAS,kBAETC,cAAA,CAAA,QAAA,EAAA;AACEC,EAAAA,GAAG,EAAEF,SAAU;AACfG,EAAAA,IAAI,EAAC,QAAQ;EACbZ,SAAS,EAAEa,SAAI,CACb,eAAe,EACf,2BAA2B,EAC3BV,QAAQ,KAAKC,gBAAQ,CAACU,QAAQ,GAC1B,gBAAgB,GAChBX,QAAQ,KAAKC,gBAAQ,CAACW,SAAS,GAC7B,gBAAgB,GAChB,gBAAgB,EACtBf,SACF,CAAE;AACFD,EAAAA,QAAQ,EAAEA,QAAS;AACnBG,EAAAA,OAAO,EAAEA,OAAQ;AAAA,EAAA,GACbM,IAAI;EAAAD,QAAA,EAEPA,QAAQ,IAAID;AAAI,CACX,CAEZ;;;;"}

package/build/actionButton/ActionButton.mjs

@@ -1,29 +1,14 @@
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import '../common/theme.mjs';
-import '../common/direction.mjs';
 import { Priority } from '../common/propsValues/control.mjs';
-import '../common/propsValues/breakpoint.mjs';
-import '../common/propsValues/size.mjs';
-import '../common/propsValues/typography.mjs';
-import '../common/propsValues/width.mjs';
-import '../common/propsValues/type.mjs';
-import '../common/propsValues/dateMode.mjs';
-import '../common/propsValues/monthFormat.mjs';
-import '../common/propsValues/position.mjs';
-import '../common/propsValues/layouts.mjs';
-import '../common/propsValues/status.mjs';
-import '../common/propsValues/sentiment.mjs';
-import '../common/propsValues/profileType.mjs';
-import '../common/propsValues/variant.mjs';
-import '../common/propsValues/scroll.mjs';
-import '../common/propsValues/markdownNodeType.mjs';
-import '../common/fileType.mjs';
 import '@transferwise/icons';
 import 'react-intl';
 import '../common/closeButton/CloseButton.messages.mjs';
 import { jsx } from 'react/jsx-runtime';
 
+/**
+ * @deprecated use `<Button v2 size="sm" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead
+ */
 const ActionButton = /*#__PURE__*/forwardRef(({
   disabled = false,
   className = undefined,

package/build/actionButton/ActionButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButton.mjs","sources":["../../src/actionButton/ActionButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ButtonHTMLAttributes, forwardRef } from 'react';\n\nimport { Priority, PriorityPrimary, PrioritySecondary, PriorityTertiary } from '../common';\n\n/**\n * @deprecated use `<Button />` component instead with `ButtonProps`\n */\nexport type ActionButtonProps = {\n  priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary;\n  /**\n   * @deprecated use `children` instead\n   */\n  text?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * @deprecated use `<Button v2 size=\"sm\" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead\n */\nconst ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  (\n    {\n      disabled = false,\n      className = undefined,\n      onClick,\n      priority = Priority.PRIMARY,\n      text,\n      children,\n      ...rest\n    }: ActionButtonProps,\n    reference,\n  ) => (\n    <button\n      ref={reference}\n      type=\"button\"\n      className={clsx(\n        'np-action-btn',\n        'np-text-body-default-bold',\n        priority === Priority.TERTIARY\n          ? 'btn-priority-3'\n          : priority === Priority.SECONDARY\n            ? 'btn-priority-2'\n            : 'btn-priority-1',\n        className,\n      )}\n      disabled={disabled}\n      onClick={onClick}\n      {...rest}\n    >\n      {children || text}\n    </button>\n  ),\n);\n\nexport default ActionButton;\n"],"names":["ActionButton","forwardRef","disabled","className","undefined","onClick","priority","Priority","PRIMARY","text","children","rest","reference","_jsx","ref","type","clsx","TERTIARY","SECONDARY"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAMA,YAAY,gBAAGC,UAAU,CAC7B,CACE;AACEC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;EACPC,QAAQ,GAAGC,QAAQ,CAACC,OAAO;EAC3BC,IAAI;EACJC,QAAQ;EACR,GAAGC;AAAI,CACW,EACpBC,SAAS,kBAETC,GAAA,CAAA,QAAA,EAAA;AACEC,EAAAA,GAAG,EAAEF,SAAU;AACfG,EAAAA,IAAI,EAAC,QAAQ;EACbZ,SAAS,EAAEa,IAAI,CACb,eAAe,EACf,2BAA2B,EAC3BV,QAAQ,KAAKC,QAAQ,CAACU,QAAQ,GAC1B,gBAAgB,GAChBX,QAAQ,KAAKC,QAAQ,CAACW,SAAS,GAC7B,gBAAgB,GAChB,gBAAgB,EACtBf,SAAS,CACT;AACFD,EAAAA,QAAQ,EAAEA,QAAS;AACnBG,EAAAA,OAAO,EAAEA,OAAQ;AAAA,EAAA,GACbM,IAAI;EAAAD,QAAA,EAEPA,QAAQ,IAAID;AAAI,CACX,CACT;;;;"}
+{"version":3,"file":"ActionButton.mjs","sources":["../../src/actionButton/ActionButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ButtonHTMLAttributes, forwardRef } from 'react';\n\nimport { Priority, PriorityPrimary, PrioritySecondary, PriorityTertiary } from '../common';\n\n/**\n * @deprecated use `<Button />` component instead with `ButtonProps`\n */\nexport type ActionButtonProps = {\n  priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary;\n  /**\n   * @deprecated use `children` instead\n   */\n  text?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * @deprecated use `<Button v2 size=\"sm\" priority={'primary' / 'secondary-neutral' / 'tertiary'} .. />` component instead\n */\nconst ActionButton = forwardRef<HTMLButtonElement, ActionButtonProps>(\n  (\n    {\n      disabled = false,\n      className = undefined,\n      onClick,\n      priority = Priority.PRIMARY,\n      text,\n      children,\n      ...rest\n    }: ActionButtonProps,\n    reference,\n  ) => (\n    <button\n      ref={reference}\n      type=\"button\"\n      className={clsx(\n        'np-action-btn',\n        'np-text-body-default-bold',\n        priority === Priority.TERTIARY\n          ? 'btn-priority-3'\n          : priority === Priority.SECONDARY\n            ? 'btn-priority-2'\n            : 'btn-priority-1',\n        className,\n      )}\n      disabled={disabled}\n      onClick={onClick}\n      {...rest}\n    >\n      {children || text}\n    </button>\n  ),\n);\n\nexport default ActionButton;\n"],"names":["ActionButton","forwardRef","disabled","className","undefined","onClick","priority","Priority","PRIMARY","text","children","rest","reference","_jsx","ref","type","clsx","TERTIARY","SECONDARY"],"mappings":";;;;;;;;AAgBA;AACA;AACA;AACA,MAAMA,YAAY,gBAAGC,UAAU,CAC7B,CACE;AACEC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,SAAS,GAAGC,SAAS;EACrBC,OAAO;EACPC,QAAQ,GAAGC,QAAQ,CAACC,OAAO;EAC3BC,IAAI;EACJC,QAAQ;EACR,GAAGC;AACc,CAAC,EACpBC,SAAS,kBAETC,GAAA,CAAA,QAAA,EAAA;AACEC,EAAAA,GAAG,EAAEF,SAAU;AACfG,EAAAA,IAAI,EAAC,QAAQ;EACbZ,SAAS,EAAEa,IAAI,CACb,eAAe,EACf,2BAA2B,EAC3BV,QAAQ,KAAKC,QAAQ,CAACU,QAAQ,GAC1B,gBAAgB,GAChBX,QAAQ,KAAKC,QAAQ,CAACW,SAAS,GAC7B,gBAAgB,GAChB,gBAAgB,EACtBf,SACF,CAAE;AACFD,EAAAA,QAAQ,EAAEA,QAAS;AACnBG,EAAAA,OAAO,EAAEA,OAAQ;AAAA,EAAA,GACbM,IAAI;EAAAD,QAAA,EAEPA,QAAQ,IAAID;AAAI,CACX,CAEZ;;;;"}

package/build/actionOption/ActionOption.js

@@ -4,25 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var clsx = require('clsx');
 var Button_resolver = require('../button/Button.resolver.js');
-require('../common/theme.js');
-require('../common/direction.js');
 var control = require('../common/propsValues/control.js');
-require('../common/propsValues/breakpoint.js');
-require('../common/propsValues/size.js');
-require('../common/propsValues/typography.js');
-require('../common/propsValues/width.js');
-require('../common/propsValues/type.js');
-require('../common/propsValues/dateMode.js');
-require('../common/propsValues/monthFormat.js');
-require('../common/propsValues/position.js');
-require('../common/propsValues/layouts.js');
-require('../common/propsValues/status.js');
-require('../common/propsValues/sentiment.js');
-require('../common/propsValues/profileType.js');
-require('../common/propsValues/variant.js');
-require('../common/propsValues/scroll.js');
-require('../common/propsValues/markdownNodeType.js');
-require('../common/fileType.js');
 require('@transferwise/icons');
 require('react');
 require('react-intl');
@@ -30,6 +12,14 @@ require('../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
 var Option = require('../common/Option/Option.js');
 
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 const ActionOption = ({
   action,
   priority = control.Priority.PRIMARY,

package/build/actionOption/ActionOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionOption.js","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n  AriaLabelProperty,\n  CommonProps,\n  Priority,\n  PriorityPrimary,\n  PrioritySecondary,\n  PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n  | PriorityPrimary\n  | PrioritySecondary\n  | PriorityTertiary\n  | 'secondary-send';\n\nexport type ActionOptionProps = {\n  complex?: boolean;\n  content?: React.ReactNode;\n  disabled?: boolean;\n  media?: React.ReactNode;\n  showMediaAtAllSizes?: boolean;\n  onClick: () => void;\n  title: React.ReactNode;\n  additionalContent?: React.ReactNode;\n  action: React.ReactNode;\n  priority?: ActionOptionPriority;\n  showMediaCircle?: boolean;\n  isContainerAligned?: boolean;\n  as?: React.ElementType;\n} & CommonProps &\n  AriaLabelProperty;\n\n/**\n * @deprecated Please use `<ListItem />` instead.\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n  action,\n  priority = Priority.PRIMARY,\n  disabled,\n  onClick,\n  media,\n  title,\n  content,\n  additionalContent,\n  complex,\n  className,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  as,\n  'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n  const sharedProps = {\n    media,\n    title,\n    content,\n    complex,\n    disabled,\n    showMediaAtAllSizes,\n    showMediaCircle,\n    className: clsx('tw-action-option', className),\n    isContainerAligned,\n    additionalContent,\n    as,\n  };\n\n  const getAriaLabel = (): string | undefined => {\n    if (ariaLabel) {\n      return ariaLabel;\n    }\n\n    const generatedLabels: string[] = [];\n\n    if (typeof title === 'string') {\n      generatedLabels.push(title);\n    }\n\n    if (typeof action === 'string') {\n      generatedLabels.push(action);\n    }\n\n    return generatedLabels.join(', ') || undefined;\n  };\n\n  const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n    switch (priority) {\n      case 'primary':\n        return 'primary';\n      case 'secondary':\n        return 'secondary-neutral';\n      case 'tertiary':\n        return 'tertiary';\n      case 'secondary-send':\n        return 'secondary';\n      default:\n        return 'primary';\n    }\n  };\n\n  return (\n    <Option\n      {...sharedProps}\n      button={\n        <Button\n          v2\n          size=\"sm\"\n          priority={mapPriority(priority)}\n          disabled={disabled}\n          aria-label={getAriaLabel()}\n          onClick={onClick}\n        >\n          {action}\n        </Button>\n      }\n    />\n  );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AAAS,CACL,KAAI;AACtB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,SAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAAyB;AAC5C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAe,GAAa,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAoB;AACrE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,cAAA,CAACG,uBAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GAAA,CACD;AAEN;;;;"}
+{"version":3,"file":"ActionOption.js","sources":["../../src/actionOption/ActionOption.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Button from '../button';\nimport {\n  AriaLabelProperty,\n  CommonProps,\n  Priority,\n  PriorityPrimary,\n  PrioritySecondary,\n  PriorityTertiary,\n} from '../common';\nimport Option from '../common/Option';\nimport { ButtonPriority } from '../button/Button.types';\n\ntype ActionOptionPriority =\n  | PriorityPrimary\n  | PrioritySecondary\n  | PriorityTertiary\n  | 'secondary-send';\n\nexport type ActionOptionProps = {\n  complex?: boolean;\n  content?: React.ReactNode;\n  disabled?: boolean;\n  media?: React.ReactNode;\n  showMediaAtAllSizes?: boolean;\n  onClick: () => void;\n  title: React.ReactNode;\n  additionalContent?: React.ReactNode;\n  action: React.ReactNode;\n  priority?: ActionOptionPriority;\n  showMediaCircle?: boolean;\n  isContainerAligned?: boolean;\n  as?: React.ElementType;\n} & CommonProps &\n  AriaLabelProperty;\n\n/**\n * @deprecated Please use `<ListItem />` instead.\n * @deprecatedSince 46.104.0\n * @see [Source](../listItem/ListItem.tsx)\n * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)\n * @see [Design docs](https://wise.design/components/list-item)\n * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)\n */\nconst ActionOption = ({\n  action,\n  priority = Priority.PRIMARY,\n  disabled,\n  onClick,\n  media,\n  title,\n  content,\n  additionalContent,\n  complex,\n  className,\n  showMediaAtAllSizes,\n  showMediaCircle,\n  isContainerAligned,\n  as,\n  'aria-label': ariaLabel,\n}: ActionOptionProps) => {\n  const sharedProps = {\n    media,\n    title,\n    content,\n    complex,\n    disabled,\n    showMediaAtAllSizes,\n    showMediaCircle,\n    className: clsx('tw-action-option', className),\n    isContainerAligned,\n    additionalContent,\n    as,\n  };\n\n  const getAriaLabel = (): string | undefined => {\n    if (ariaLabel) {\n      return ariaLabel;\n    }\n\n    const generatedLabels: string[] = [];\n\n    if (typeof title === 'string') {\n      generatedLabels.push(title);\n    }\n\n    if (typeof action === 'string') {\n      generatedLabels.push(action);\n    }\n\n    return generatedLabels.join(', ') || undefined;\n  };\n\n  const mapPriority = (priority: ActionOptionPriority): ButtonPriority => {\n    switch (priority) {\n      case 'primary':\n        return 'primary';\n      case 'secondary':\n        return 'secondary-neutral';\n      case 'tertiary':\n        return 'tertiary';\n      case 'secondary-send':\n        return 'secondary';\n      default:\n        return 'primary';\n    }\n  };\n\n  return (\n    <Option\n      {...sharedProps}\n      button={\n        <Button\n          v2\n          size=\"sm\"\n          priority={mapPriority(priority)}\n          disabled={disabled}\n          aria-label={getAriaLabel()}\n          onClick={onClick}\n        >\n          {action}\n        </Button>\n      }\n    />\n  );\n};\n\nexport default ActionOption;\n"],"names":["ActionOption","action","priority","Priority","PRIMARY","disabled","onClick","media","title","content","additionalContent","complex","className","showMediaAtAllSizes","showMediaCircle","isContainerAligned","as","ariaLabel","sharedProps","clsx","getAriaLabel","generatedLabels","push","join","undefined","mapPriority","_jsx","Option","button","Button","v2","size","children"],"mappings":";;;;;;;;;;;;;;AAqCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,YAAY,GAAGA,CAAC;EACpBC,MAAM;EACNC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;EAC3BC,QAAQ;EACRC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,iBAAiB;EACjBC,OAAO;EACPC,SAAS;EACTC,mBAAmB;EACnBC,eAAe;EACfC,kBAAkB;EAClBC,EAAE;AACF,EAAA,YAAY,EAAEC;AACG,CAAC,KAAK;AACvB,EAAA,MAAMC,WAAW,GAAG;IAClBX,KAAK;IACLC,KAAK;IACLC,OAAO;IACPE,OAAO;IACPN,QAAQ;IACRQ,mBAAmB;IACnBC,eAAe;AACfF,IAAAA,SAAS,EAAEO,SAAI,CAAC,kBAAkB,EAAEP,SAAS,CAAC;IAC9CG,kBAAkB;IAClBL,iBAAiB;AACjBM,IAAAA;GACD;EAED,MAAMI,YAAY,GAAGA,MAA0B;AAC7C,IAAA,IAAIH,SAAS,EAAE;AACb,MAAA,OAAOA,SAAS;AAClB,IAAA;IAEA,MAAMI,eAAyB,GAAG,EAAE;AAEpC,IAAA,IAAI,OAAOb,KAAK,KAAK,QAAQ,EAAE;AAC7Ba,MAAAA,eAAe,CAACC,IAAI,CAACd,KAAK,CAAC;AAC7B,IAAA;AAEA,IAAA,IAAI,OAAOP,MAAM,KAAK,QAAQ,EAAE;AAC9BoB,MAAAA,eAAe,CAACC,IAAI,CAACrB,MAAM,CAAC;AAC9B,IAAA;AAEA,IAAA,OAAOoB,eAAe,CAACE,IAAI,CAAC,IAAI,CAAC,IAAIC,SAAS;EAChD,CAAC;EAED,MAAMC,WAAW,GAAIvB,QAA8B,IAAqB;AACtE,IAAA,QAAQA,QAAQ;AACd,MAAA,KAAK,SAAS;AACZ,QAAA,OAAO,SAAS;AAClB,MAAA,KAAK,WAAW;AACd,QAAA,OAAO,mBAAmB;AAC5B,MAAA,KAAK,UAAU;AACb,QAAA,OAAO,UAAU;AACnB,MAAA,KAAK,gBAAgB;AACnB,QAAA,OAAO,WAAW;AACpB,MAAA;AACE,QAAA,OAAO,SAAS;AACpB;EACF,CAAC;EAED,oBACEwB,cAAA,CAACC,cAAM,EAAA;AAAA,IAAA,GACDT,WAAW;IACfU,MAAM,eACJF,cAAA,CAACG,uBAAM,EAAA;MACLC,EAAE,EAAA,IAAA;AACFC,MAAAA,IAAI,EAAC,IAAI;AACT7B,MAAAA,QAAQ,EAAEuB,WAAW,CAACvB,QAAQ,CAAE;AAChCG,MAAAA,QAAQ,EAAEA,QAAS;MACnB,YAAA,EAAYe,YAAY,EAAG;AAC3Bd,MAAAA,OAAO,EAAEA,OAAQ;AAAA0B,MAAAA,QAAA,EAEhB/B;KACK;AACT,GACF,CAAC;AAEN;;;;"}

package/build/actionOption/ActionOption.mjs

@@ -1,24 +1,6 @@
 import { clsx } from 'clsx';
 import Button from '../button/Button.resolver.mjs';
-import '../common/theme.mjs';
-import '../common/direction.mjs';
 import { Priority } from '../common/propsValues/control.mjs';
-import '../common/propsValues/breakpoint.mjs';
-import '../common/propsValues/size.mjs';
-import '../common/propsValues/typography.mjs';
-import '../common/propsValues/width.mjs';
-import '../common/propsValues/type.mjs';
-import '../common/propsValues/dateMode.mjs';
-import '../common/propsValues/monthFormat.mjs';
-import '../common/propsValues/position.mjs';
-import '../common/propsValues/layouts.mjs';
-import '../common/propsValues/status.mjs';
-import '../common/propsValues/sentiment.mjs';
-import '../common/propsValues/profileType.mjs';
-import '../common/propsValues/variant.mjs';
-import '../common/propsValues/scroll.mjs';
-import '../common/propsValues/markdownNodeType.mjs';
-import '../common/fileType.mjs';
 import '@transferwise/icons';
 import 'react';
 import 'react-intl';
@@ -26,6 +8,14 @@ import '../common/closeButton/CloseButton.messages.mjs';
 import { jsx } from 'react/jsx-runtime';
 import Option from '../common/Option/Option.mjs';
 
+/**
+ * @deprecated Please use `<ListItem />` instead.
+ * @deprecatedSince 46.104.0
+ * @see [Source](../listItem/ListItem.tsx)
+ * @see [Storybook](https://storybook.wise.design/?path=/docs/content-listitem--docs)
+ * @see [Design docs](https://wise.design/components/list-item)
+ * @see [Release notes](https://transferwise.atlassian.net/wiki/spaces/DS/pages/3647251055/List+Item+release+notes)
+ */
 const ActionOption = ({
   action,
   priority = Priority.PRIMARY,