How to use the @ui5/webcomponents-react/lib/ButtonDesign.ButtonDesign.Transparent function in @ui5/webcomponents-react

const renderActionSheetButton = (element) => {
      if (element && element.props) {
        return (
          <div>
            {cloneElement(element, {
              design: ButtonDesign.Transparent,
              onClick: onActionButtonClicked(element.props.onClick)
            })}
          </div>
        );
      }
      return element;
    };

}, [showFilters]);

  const filterAreaClasses = StyleClassHelper.of(classes.filterArea);
  if (showFilters) {
    filterAreaClasses.put(classes.filterAreaOpen);
  } else {
    filterAreaClasses.put(classes.filterAreaClosed);
  }

  return (
    <div>
      <div>
        {renderVariants &amp;&amp; renderVariants()}
        {renderSearch &amp;&amp; <div> {renderSearch()} </div>}
        <div>
          <button>
            {showFilters ? 'Hide Filter Bar' : 'Show Filter Bar'}
          </button>
        </div>
      </div>
      <div>{children}</div>
    </div>
  );
});

<div>
                <div style="{{">
                  {!noShowMoreButton &amp;&amp; (
                    <button>
                      {showMore ? 'Show Less' : 'Show More'}
                    </button>
                  )}
                  {footer}
                </div>
              </div>
            
            {children &amp;&amp; (
              <button>
                {showChildren ? 'Collapse Group' : 'Expand Group'}
              </button>
            )}
          
        
        {showChildren ? renderChildren : null}
      
    );
  }
);

const renderBackButton = useCallback(() => {
    if (showBackButton) {
      return (
        <button>
      );
    }
    return null;
  }, [showBackButton]);
</button>

const variantManagementButton = useMemo(() => {
      const selectedItem = getItemByKey(selectedKey) || variantItems[0];

      let textClasses = classes.VariantManagementText;
      if (disabled) {
        textClasses += ` ${classes.disabled}`;
      }

      return (
        <div>
          <title>
            {selectedItem.label}
          </title>
          <button disabled="{disabled}">
        </button></div>
      );
    }, [classes, variantItems, level, selectedKey, disabled]);