@transferwise/icons 3.9.2 → 3.10.0

package/build/components/insights.tsx

@@ -7,6 +7,7 @@ export interface InsightsIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Insights: React.FunctionComponent<InsightsIconProps> = ({
@@ -14,6 +15,7 @@ export const Insights: React.FunctionComponent<InsightsIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Insights: React.FunctionComponent<InsightsIconProps> = ({
     <span
       className={`tw-icon tw-icon-insights ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insights-icon'}
     >
       <svg

package/build/components/instagram.tsx

@@ -7,6 +7,7 @@ export interface InstagramIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Instagram: React.FunctionComponent<InstagramIconProps> = ({
@@ -14,6 +15,7 @@ export const Instagram: React.FunctionComponent<InstagramIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Instagram: React.FunctionComponent<InstagramIconProps> = ({
     <span
       className={`tw-icon tw-icon-instagram ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'instagram-icon'}
     >
       <svg

package/build/components/insurance.tsx

@@ -7,6 +7,7 @@ export interface InsuranceIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Insurance: React.FunctionComponent<InsuranceIconProps> = ({
@@ -14,6 +15,7 @@ export const Insurance: React.FunctionComponent<InsuranceIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Insurance: React.FunctionComponent<InsuranceIconProps> = ({
     <span
       className={`tw-icon tw-icon-insurance ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'insurance-icon'}
     >
       <svg

package/build/components/interac.tsx

@@ -7,6 +7,7 @@ export interface InteracIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Interac: React.FunctionComponent<InteracIconProps> = ({
@@ -14,6 +15,7 @@ export const Interac: React.FunctionComponent<InteracIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Interac: React.FunctionComponent<InteracIconProps> = ({
     <span
       className={`tw-icon tw-icon-interac ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'interac-icon'}
     >
       <svg

package/build/components/investments.tsx

@@ -7,6 +7,7 @@ export interface InvestmentsIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Investments: React.FunctionComponent<InvestmentsIconProps> = ({
@@ -14,6 +15,7 @@ export const Investments: React.FunctionComponent<InvestmentsIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Investments: React.FunctionComponent<InvestmentsIconProps> = ({
     <span
       className={`tw-icon tw-icon-investments ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'investments-icon'}
     >
       <svg

package/build/components/invite.tsx

@@ -7,6 +7,7 @@ export interface InviteIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Invite: React.FunctionComponent<InviteIconProps> = ({
@@ -14,6 +15,7 @@ export const Invite: React.FunctionComponent<InviteIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Invite: React.FunctionComponent<InviteIconProps> = ({
     <span
       className={`tw-icon tw-icon-invite ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'invite-icon'}
     >
       <svg

package/build/components/jar.tsx

@@ -7,6 +7,7 @@ export interface JarIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Jar: React.FunctionComponent<JarIconProps> = ({
@@ -14,6 +15,7 @@ export const Jar: React.FunctionComponent<JarIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Jar: React.FunctionComponent<JarIconProps> = ({
     <span
       className={`tw-icon tw-icon-jar ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'jar-icon'}
     >
       <svg

package/build/components/keep.tsx

@@ -7,6 +7,7 @@ export interface KeepIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Keep: React.FunctionComponent<KeepIconProps> = ({
@@ -14,6 +15,7 @@ export const Keep: React.FunctionComponent<KeepIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Keep: React.FunctionComponent<KeepIconProps> = ({
     <span
       className={`tw-icon tw-icon-keep ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'keep-icon'}
     >
       <svg

package/build/components/klarna.tsx

@@ -7,6 +7,7 @@ export interface KlarnaIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Klarna: React.FunctionComponent<KlarnaIconProps> = ({
@@ -14,6 +15,7 @@ export const Klarna: React.FunctionComponent<KlarnaIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Klarna: React.FunctionComponent<KlarnaIconProps> = ({
     <span
       className={`tw-icon tw-icon-klarna ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'klarna-icon'}
     >
       <svg

package/build/components/laptop.tsx

@@ -7,6 +7,7 @@ export interface LaptopIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Laptop: React.FunctionComponent<LaptopIconProps> = ({
@@ -14,6 +15,7 @@ export const Laptop: React.FunctionComponent<LaptopIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Laptop: React.FunctionComponent<LaptopIconProps> = ({
     <span
       className={`tw-icon tw-icon-laptop ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'laptop-icon'}
     >
       <svg

package/build/components/leaf.tsx

@@ -7,6 +7,7 @@ export interface LeafIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Leaf: React.FunctionComponent<LeafIconProps> = ({
@@ -14,6 +15,7 @@ export const Leaf: React.FunctionComponent<LeafIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Leaf: React.FunctionComponent<LeafIconProps> = ({
     <span
       className={`tw-icon tw-icon-leaf ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'leaf-icon'}
     >
       <svg

package/build/components/lightning-bolt.tsx

@@ -7,6 +7,7 @@ export interface LightningBoltIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const LightningBolt: React.FunctionComponent<LightningBoltIconProps> = ({
@@ -14,6 +15,7 @@ export const LightningBolt: React.FunctionComponent<LightningBoltIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const LightningBolt: React.FunctionComponent<LightningBoltIconProps> = ({
     <span
       className={`tw-icon tw-icon-lightning-bolt ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-bolt-icon'}
     >
       <svg

package/build/components/lightning.tsx

@@ -7,6 +7,7 @@ export interface LightningIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Lightning: React.FunctionComponent<LightningIconProps> = ({
@@ -14,6 +15,7 @@ export const Lightning: React.FunctionComponent<LightningIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Lightning: React.FunctionComponent<LightningIconProps> = ({
     <span
       className={`tw-icon tw-icon-lightning ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lightning-icon'}
     >
       <svg

package/build/components/limit.tsx

@@ -7,6 +7,7 @@ export interface LimitIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Limit: React.FunctionComponent<LimitIconProps> = ({
@@ -14,6 +15,7 @@ export const Limit: React.FunctionComponent<LimitIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Limit: React.FunctionComponent<LimitIconProps> = ({
     <span
       className={`tw-icon tw-icon-limit ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'limit-icon'}
     >
       <svg

package/build/components/link.tsx

@@ -7,6 +7,7 @@ export interface LinkIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Link: React.FunctionComponent<LinkIconProps> = ({
@@ -14,6 +15,7 @@ export const Link: React.FunctionComponent<LinkIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Link: React.FunctionComponent<LinkIconProps> = ({
     <span
       className={`tw-icon tw-icon-link ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'link-icon'}
     >
       <svg

package/build/components/linkedin.tsx

@@ -7,6 +7,7 @@ export interface LinkedinIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Linkedin: React.FunctionComponent<LinkedinIconProps> = ({
@@ -14,6 +15,7 @@ export const Linkedin: React.FunctionComponent<LinkedinIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Linkedin: React.FunctionComponent<LinkedinIconProps> = ({
     <span
       className={`tw-icon tw-icon-linkedin ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'linkedin-icon'}
     >
       <svg

package/build/components/list.tsx

@@ -7,6 +7,7 @@ export interface ListIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const List: React.FunctionComponent<ListIconProps> = ({
@@ -14,6 +15,7 @@ export const List: React.FunctionComponent<ListIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const List: React.FunctionComponent<ListIconProps> = ({
     <span
       className={`tw-icon tw-icon-list ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'list-icon'}
     >
       <svg

package/build/components/location-marker.tsx

@@ -7,6 +7,7 @@ export interface LocationMarkerIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const LocationMarker: React.FunctionComponent<LocationMarkerIconProps> = ({
@@ -14,6 +15,7 @@ export const LocationMarker: React.FunctionComponent<LocationMarkerIconProps> =
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const LocationMarker: React.FunctionComponent<LocationMarkerIconProps> =
     <span
       className={`tw-icon tw-icon-location-marker ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'location-marker-icon'}
     >
       <svg

package/build/components/lock.tsx

@@ -7,6 +7,7 @@ export interface LockIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Lock: React.FunctionComponent<LockIconProps> = ({
@@ -14,6 +15,7 @@ export const Lock: React.FunctionComponent<LockIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Lock: React.FunctionComponent<LockIconProps> = ({
     <span
       className={`tw-icon tw-icon-lock ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'lock-icon'}
     >
       <svg

package/build/components/log-in.tsx

@@ -7,6 +7,7 @@ export interface LogInIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const LogIn: React.FunctionComponent<LogInIconProps> = ({
@@ -14,6 +15,7 @@ export const LogIn: React.FunctionComponent<LogInIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const LogIn: React.FunctionComponent<LogInIconProps> = ({
     <span
       className={`tw-icon tw-icon-log-in ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-in-icon'}
     >
       <svg

package/build/components/log-out.tsx

@@ -7,6 +7,7 @@ export interface LogOutIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const LogOut: React.FunctionComponent<LogOutIconProps> = ({
@@ -14,6 +15,7 @@ export const LogOut: React.FunctionComponent<LogOutIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const LogOut: React.FunctionComponent<LogOutIconProps> = ({
     <span
       className={`tw-icon tw-icon-log-out ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'log-out-icon'}
     >
       <svg

package/build/components/marketing.tsx

@@ -7,6 +7,7 @@ export interface MarketingIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Marketing: React.FunctionComponent<MarketingIconProps> = ({
@@ -14,6 +15,7 @@ export const Marketing: React.FunctionComponent<MarketingIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Marketing: React.FunctionComponent<MarketingIconProps> = ({
     <span
       className={`tw-icon tw-icon-marketing ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'marketing-icon'}
     >
       <svg

package/build/components/mass-payout.tsx

@@ -7,6 +7,7 @@ export interface MassPayoutIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const MassPayout: React.FunctionComponent<MassPayoutIconProps> = ({
@@ -14,6 +15,7 @@ export const MassPayout: React.FunctionComponent<MassPayoutIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const MassPayout: React.FunctionComponent<MassPayoutIconProps> = ({
     <span
       className={`tw-icon tw-icon-mass-payout ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'mass-payout-icon'}
     >
       <svg

package/build/components/menu.tsx

@@ -7,6 +7,7 @@ export interface MenuIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Menu: React.FunctionComponent<MenuIconProps> = ({
@@ -14,6 +15,7 @@ export const Menu: React.FunctionComponent<MenuIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Menu: React.FunctionComponent<MenuIconProps> = ({
     <span
       className={`tw-icon tw-icon-menu ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'menu-icon'}
     >
       <svg

package/build/components/messenger.tsx

@@ -7,6 +7,7 @@ export interface MessengerIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const Messenger: React.FunctionComponent<MessengerIconProps> = ({
@@ -14,6 +15,7 @@ export const Messenger: React.FunctionComponent<MessengerIconProps> = ({
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const Messenger: React.FunctionComponent<MessengerIconProps> = ({
     <span
       className={`tw-icon tw-icon-messenger ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'messenger-icon'}
     >
       <svg

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

@@ -7,6 +7,7 @@ export interface MinusCircleFillIconProps {
   className?: string;
   title?: string;
   ['data-testid']?: string;
+  role?: React.AriaRole;
 }
 
 export const MinusCircleFill: React.FunctionComponent<MinusCircleFillIconProps> = ({
@@ -14,6 +15,7 @@ export const MinusCircleFill: React.FunctionComponent<MinusCircleFillIconProps>
   className = undefined,
   title = undefined,
   filled = undefined,
+  role = undefined,
   ...restProps
 }) => {
   if (filled) {
@@ -26,7 +28,7 @@ export const MinusCircleFill: React.FunctionComponent<MinusCircleFillIconProps>
     <span
       className={`tw-icon tw-icon-minus-circle-fill ${className ? className : ''}`}
       aria-hidden={!title ? 'true' : undefined}
-      role={!title ? 'presentation' : undefined}
+      role={role ?? (title ? undefined : 'none')}
       data-testid={restProps['data-testid'] || 'minus-circle-fill-icon'}
     >
       <svg