[Clickable Productive Cards and slug components]: Allow a clickable productive card to use a custom slug component

[skamath2000]

Package

Carbon for IBM Products

Description

I wanted to add an overflow menu to a clickable ProductiveCard but also have some overflow menu items be disabled under certain conditions. Since the overflowActions prop in the ProductiveCard component does not have a way to add pass a disabled=true prop to the overflow menu items, I would need to implement this via slug/decorator, but I can’t seem to do that and have the card be clickable.

There are two potential issues/solutions:

1. The overflowActions prop should also accept a disabled value.
2. If a card is clickable, the slug component should still be able to be implemented.

Component(s) impacted

ProductiveCard

https://carbon-for-ibm-products.netlify.app/?path=/docs/ibm-products-components-cards-productivecard--docs&args=clickZone:three&globals=viewport:basic

Browser

Chrome

@carbon/ibm-products (previously @carbon/ibm-cloud-cognitive) version

2.52.0

Suggested Severity

None

Product/offering

IBM Security Verify

CodeSandbox or Stackblitz example

https://stackblitz.com/edit/github-jnbrngif-xpjsulqj?file=src%2FExample%2FExample.jsx

Steps to reproduce the issue (if applicable)

1. Create a clickable productive card with an onclick function.
2. Add a slug prop with a custom node value.
3. Note that the slug prop does not show up.

Release date (if applicable)

No response

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate issues

[ljcarot]

The slug prop is deprecated. You need to use the decorator prop. Can you try and us know if that resolved your issue?