@transferwise/icons 3.11.0-beta.3 → 3.12.0

package/build/components/info-circle.tsx

@@ -26,7 +26,7 @@ export const InfoCircle: React.FunctionComponent<InfoCircleIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-info-circle tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-info-circle ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'info-circle-icon'}

package/build/components/info.tsx

@@ -26,7 +26,7 @@ export const Info: React.FunctionComponent<InfoIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-info tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-info ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'info-icon'}

package/build/components/insert-card.tsx

@@ -26,7 +26,7 @@ export const InsertCard: React.FunctionComponent<InsertCardIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insert-card tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insert-card ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insert-card-icon'}

package/build/components/insights.tsx

@@ -26,7 +26,7 @@ export const Insights: React.FunctionComponent<InsightsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insights tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insights ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insights-icon'}

package/build/components/instagram.tsx

@@ -26,7 +26,7 @@ export const Instagram: React.FunctionComponent<InstagramIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-instagram tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-instagram ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'instagram-icon'}

package/build/components/insurance.tsx

@@ -26,7 +26,7 @@ export const Insurance: React.FunctionComponent<InsuranceIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-insurance tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-insurance ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insurance-icon'}

package/build/components/interac.tsx

@@ -26,7 +26,7 @@ export const Interac: React.FunctionComponent<InteracIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-interac tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-interac ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'interac-icon'}

package/build/components/investments.tsx

@@ -26,7 +26,7 @@ export const Investments: React.FunctionComponent<InvestmentsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-investments tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-investments ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'investments-icon'}

package/build/components/invite.tsx

@@ -26,7 +26,7 @@ export const Invite: React.FunctionComponent<InviteIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-invite tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-invite ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'invite-icon'}

package/build/components/jar.tsx

@@ -26,7 +26,7 @@ export const Jar: React.FunctionComponent<JarIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-jar tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-jar ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'jar-icon'}

package/build/components/keep.tsx

@@ -26,7 +26,7 @@ export const Keep: React.FunctionComponent<KeepIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-keep tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-keep ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'keep-icon'}

package/build/components/klarna.tsx

@@ -26,7 +26,7 @@ export const Klarna: React.FunctionComponent<KlarnaIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-klarna tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-klarna ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'klarna-icon'}

package/build/components/laptop.tsx

@@ -26,7 +26,7 @@ export const Laptop: React.FunctionComponent<LaptopIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-laptop tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-laptop ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'laptop-icon'}

package/build/components/leaf.tsx

@@ -26,7 +26,7 @@ export const Leaf: React.FunctionComponent<LeafIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-leaf tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-leaf ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'leaf-icon'}

package/build/components/lightning-bolt.tsx

@@ -26,7 +26,7 @@ export const LightningBolt: React.FunctionComponent<LightningBoltIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lightning-bolt tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lightning-bolt ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-bolt-icon'}

package/build/components/lightning.tsx

@@ -26,7 +26,7 @@ export const Lightning: React.FunctionComponent<LightningIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lightning tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lightning ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-icon'}

package/build/components/limit.tsx

@@ -26,7 +26,7 @@ export const Limit: React.FunctionComponent<LimitIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-limit tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-limit ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'limit-icon'}

package/build/components/link.tsx

@@ -26,7 +26,7 @@ export const Link: React.FunctionComponent<LinkIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-link tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-link ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'link-icon'}

package/build/components/linkedin.tsx

@@ -26,7 +26,7 @@ export const Linkedin: React.FunctionComponent<LinkedinIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-linkedin tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-linkedin ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'linkedin-icon'}

package/build/components/list.tsx

@@ -26,7 +26,7 @@ export const List: React.FunctionComponent<ListIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-list tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-list ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'list-icon'}

package/build/components/location-marker.tsx

@@ -26,7 +26,7 @@ export const LocationMarker: React.FunctionComponent<LocationMarkerIconProps> =
 
   return (
     <span
-      className={`tw-icon tw-icon-location-marker tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-location-marker ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'location-marker-icon'}

package/build/components/lock.tsx

@@ -26,7 +26,7 @@ export const Lock: React.FunctionComponent<LockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-lock tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-lock ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lock-icon'}

package/build/components/log-in.tsx

@@ -26,7 +26,7 @@ export const LogIn: React.FunctionComponent<LogInIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-log-in tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-log-in ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-in-icon'}

package/build/components/log-out.tsx

@@ -26,7 +26,7 @@ export const LogOut: React.FunctionComponent<LogOutIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-log-out tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-log-out ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-out-icon'}

package/build/components/mallet.tsx

@@ -0,0 +1,54 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface MalletIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+  role?: React.AriaRole;
+}
+
+export const Mallet: React.FunctionComponent<MalletIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  role = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Mallet filled /> is now deprecated, please use <MalletFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-mallet ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={role ?? (title ? undefined : 'none')}
+      data-testid={restProps['data-testid'] || 'mallet-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M13.14 1.968a.86.86 0 0 0-1.216 0L10.11 3.782a.86.86 0 0 0 0 1.216l.013.013L5.225 9.91l-.227-.227a.86.86 0 0 0-1.216 0l-1.814 1.814a.86.86 0 0 0 0 1.216l5.45 5.45a.86.86 0 0 0 1.217 0l1.814-1.813a.86.86 0 0 0 .186-.94l.872-.872 7.277 7.278a.86.86 0 0 0 1.217 0L21.815 20a.86.86 0 0 0 0-1.216l-7.278-7.277 1.041-1.041a.86.86 0 0 0 1.2-.017l1.814-1.814a.86.86 0 0 0 0-1.217l-5.451-5.45ZM11.928 4.39l.606-.606 4.242 4.243-.606.606-4.242-4.243Zm-7.388 7.422a.858.858 0 0 1-.186-.277l-.57.57 4.243 4.242.524-.524-4.011-4.011Zm9.695-2.426-4.766 4.766-3.03-3.03 4.766-4.767 3.03 3.03Zm-3.948 12.9H1.714V20.57h8.572v1.715Zm2.44-8.955.605-.606L20 19.392l-.607.606-6.667-6.667Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/marketing.tsx

@@ -26,7 +26,7 @@ export const Marketing: React.FunctionComponent<MarketingIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-marketing tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-marketing ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'marketing-icon'}

package/build/components/mass-payout.tsx

@@ -26,7 +26,7 @@ export const MassPayout: React.FunctionComponent<MassPayoutIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mass-payout tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mass-payout ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mass-payout-icon'}

package/build/components/menu.tsx

@@ -26,7 +26,7 @@ export const Menu: React.FunctionComponent<MenuIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-menu tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-menu ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'menu-icon'}

package/build/components/messenger.tsx

@@ -26,7 +26,7 @@ export const Messenger: React.FunctionComponent<MessengerIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-messenger tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-messenger ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'messenger-icon'}

package/build/components/minus-circle-fill.tsx

@@ -26,7 +26,7 @@ export const MinusCircleFill: React.FunctionComponent<MinusCircleFillIconProps>
 
   return (
     <span
-      className={`tw-icon tw-icon-minus-circle-fill tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus-circle-fill ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-circle-fill-icon'}

package/build/components/minus-circle.tsx

@@ -26,7 +26,7 @@ export const MinusCircle: React.FunctionComponent<MinusCircleIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-minus-circle tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus-circle ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-circle-icon'}

package/build/components/minus.tsx

@@ -26,7 +26,7 @@ export const Minus: React.FunctionComponent<MinusIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-minus tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-minus ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-icon'}

package/build/components/mobile-lock.tsx

@@ -26,7 +26,7 @@ export const MobileLock: React.FunctionComponent<MobileLockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mobile-lock tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mobile-lock ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mobile-lock-icon'}

package/build/components/mobile.tsx

@@ -26,7 +26,7 @@ export const Mobile: React.FunctionComponent<MobileIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-mobile tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-mobile ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mobile-icon'}

package/build/components/money-bag.tsx

@@ -26,7 +26,7 @@ export const MoneyBag: React.FunctionComponent<MoneyBagIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-money-bag tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-money-bag ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'money-bag-icon'}

package/build/components/money.tsx

@@ -26,7 +26,7 @@ export const Money: React.FunctionComponent<MoneyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-money tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-money ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'money-icon'}

package/build/components/more.tsx

@@ -26,7 +26,7 @@ export const More: React.FunctionComponent<MoreIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-more tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-more ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'more-icon'}

package/build/components/multi-currency.tsx

@@ -26,7 +26,7 @@ export const MultiCurrency: React.FunctionComponent<MultiCurrencyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-multi-currency tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-multi-currency ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'multi-currency-icon'}

package/build/components/navigate-away.tsx

@@ -26,7 +26,7 @@ export const NavigateAway: React.FunctionComponent<NavigateAwayIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-navigate-away tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-navigate-away ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'navigate-away-icon'}

package/build/components/nearby.tsx

@@ -26,7 +26,7 @@ export const Nearby: React.FunctionComponent<NearbyIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-nearby tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-nearby ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'nearby-icon'}

package/build/components/new.tsx

@@ -26,7 +26,7 @@ export const New: React.FunctionComponent<NewIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-new tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-new ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'new-icon'}

package/build/components/notification-active.tsx

@@ -26,9 +26,7 @@ export const NotificationActive: React.FunctionComponent<NotificationActiveIconP
 
   return (
     <span
-      className={`tw-icon tw-icon-notification-active tw-icon-${size} ${
-        className ? className : ''
-      }`}
+      className={`tw-icon tw-icon-notification-active ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'notification-active-icon'}

package/build/components/notification.tsx

@@ -26,7 +26,7 @@ export const Notification: React.FunctionComponent<NotificationIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-notification tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-notification ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'notification-icon'}

package/build/components/office-expenses.tsx

@@ -26,7 +26,7 @@ export const OfficeExpenses: React.FunctionComponent<OfficeExpensesIconProps> =
 
   return (
     <span
-      className={`tw-icon tw-icon-office-expenses tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-office-expenses ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'office-expenses-icon'}

package/build/components/owners-withdrawal.tsx

@@ -26,7 +26,7 @@ export const OwnersWithdrawal: React.FunctionComponent<OwnersWithdrawalIconProps
 
   return (
     <span
-      className={`tw-icon tw-icon-owners-withdrawal tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-owners-withdrawal ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'owners-withdrawal-icon'}

package/build/components/padlock-unlocked.tsx

@@ -26,7 +26,7 @@ export const PadlockUnlocked: React.FunctionComponent<PadlockUnlockedIconProps>
 
   return (
     <span
-      className={`tw-icon tw-icon-padlock-unlocked tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-padlock-unlocked ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'padlock-unlocked-icon'}

package/build/components/padlock.tsx

@@ -26,7 +26,7 @@ export const Padlock: React.FunctionComponent<PadlockIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-padlock tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-padlock ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'padlock-icon'}

package/build/components/paperclip.tsx

@@ -26,7 +26,7 @@ export const Paperclip: React.FunctionComponent<PaperclipIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-paperclip tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-paperclip ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'paperclip-icon'}

package/build/components/passport.tsx

@@ -26,7 +26,7 @@ export const Passport: React.FunctionComponent<PassportIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-passport tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-passport ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'passport-icon'}

package/build/components/pause.tsx

@@ -26,7 +26,7 @@ export const Pause: React.FunctionComponent<PauseIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pause tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pause ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pause-icon'}

package/build/components/pay-in.tsx

@@ -26,7 +26,7 @@ export const PayIn: React.FunctionComponent<PayInIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pay-in tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pay-in ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pay-in-icon'}

package/build/components/payments.tsx

@@ -26,7 +26,7 @@ export const Payments: React.FunctionComponent<PaymentsIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-payments tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-payments ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'payments-icon'}

package/build/components/paypal.tsx

@@ -26,7 +26,7 @@ export const Paypal: React.FunctionComponent<PaypalIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-paypal tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-paypal ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'paypal-icon'}

package/build/components/pending-circle.tsx

@@ -26,7 +26,7 @@ export const PendingCircle: React.FunctionComponent<PendingCircleIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pending-circle tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pending-circle ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pending-circle-icon'}

package/build/components/pending.tsx

@@ -26,7 +26,7 @@ export const Pending: React.FunctionComponent<PendingIconProps> = ({
 
   return (
     <span
-      className={`tw-icon tw-icon-pending tw-icon-${size} ${className ? className : ''}`}
+      className={`tw-icon tw-icon-pending ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
       role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'pending-icon'}