Show a variant programmatically
We can add the variant class programmatically this way:
function Button( {properties, events, scope, slideId, context} ) {
const { dsModel } = context;
const [props, setProps] = useState(properties);
const [active, setActive] = useState(false);
const actions = {};
function onClickHandler(event) {
setActive(true);
setTimeout( () => {
setActive(false);
},1000);
}
useComponent(properties, props, actions, style, setProps, dsModel);
let body = renderSlots(props, setProps, events, actions, scope, dsModel, slideId, context);
let classes = props.classes;
if (active) {
classes = classes + ` __pz_${props._referredUid}_active`;
}
return props.visible?<a className={classes} onClick={onClickHandler}>{body}</a>:null;
}
When the button is clicked it will be displayed with the active variant and a second later will be reset to the default variant.
Last modified 6mo ago