How to use the bpk-component-icon.withLargeButtonAlignment function in bpk-component-icon

const getEnabledIcon = large => {
  const AlignedIcon = large
    ? withLargeButtonAlignment(withRtlSupport(ArrowIconLg))
    : withButtonAlignment(withRtlSupport(ArrowIconSm));
  return ;
};

import Code from '../../components/Code';
import CodeBlock from '../../components/CodeBlock';
import * as ROUTES from '../../constants/routes';

const AlignedBaseArrow = withAlignment(
  LongArrowRightIconSm,
  lineHeightBase,
  iconSizeSm,
);
const AlignedLargeArrow = withAlignment(
  LongArrowRightIcon,
  lineHeightLg,
  iconSizeLg,
);
const AlignedButtonArrow = withButtonAlignment(LongArrowRightIconSm);
const AlignedLargeButtonArrow = withLargeButtonAlignment(LongArrowRightIcon);
const AlignedSpan = withAlignment('span', iconSizeLg, lineHeightBase);
const AlignedSpanSmall = withAlignment('span', iconSizeLg, lineHeightSm);

const components = [
  {
    id: 'withinBase',
    title: 'Icon alignment within text with textStyle "base"',
    blurb: [
      
        Aligning an icon within text with textStyle "base" can be done
        using
        <code>withAlignment</code>, providing suitable spacings (see the{' '}
        Typesetting section).
      ,
      Using the HOC is done as follows:,

.add('Custom Icon', () => {
    const AlignedIconSm = withButtonAlignment(withRtlSupport(BaggageIconSm));
    const iconSm = ;

    const AlignedIconLg = withLargeButtonAlignment(
      withRtlSupport(BaggageIconLg),
    );
    const iconLg = ;

    return (
      <div>
        
          Button
        
        
          Disabled
        </div>

const getEnabledIcon = (large) => {
  const AlignedIcon = large ?
    withLargeButtonAlignment(withRtlSupport(ArrowIconLg)) :
    withButtonAlignment(withRtlSupport(ArrowIconSm));
  return ;
};