How to use the @paprika/helpers/lib/customPropTypes.ShirtSizes.LARGE function in @paprika/helpers

const renderClear = () => {
    const { hasClearButton, isDisabled, isReadOnly, size, value } = props;
    if (!hasClearButton || isDisabled || isReadOnly || !value) return null;
    const iconSize = size === ShirtSizes.LARGE ? ShirtSizes.MEDIUM : ShirtSizes.SMALL;
    return (
      
        
      
    );
  };

`;

// Sizes

const sizeStyles = {
  [ShirtSizes.SMALL]: `
    ${stylers.fontSize(-2)};
    min-height: ${stylers.spacer(3)};
    padding: 3px ${tokens.space};
  `,
  [ShirtSizes.MEDIUM]: `
    ${stylers.fontSize(-1)};
    min-height: ${stylers.spacer(4)};
    padding: 6.5px ${tokens.spaceLg};
  `,
  [ShirtSizes.LARGE]: `
    ${stylers.fontSize()};
    min-height: ${stylers.spacer(5)};
    padding: 9px ${stylers.spacer(2)};
  `,
};

// Kinds

const kindStyles = props => ({
  [Kinds.DEFAULT]: `
    ${skeuomorphicStyles}

    background-image: linear-gradient(${tokens.color.blackLighten90}, ${tokens.color.blackLighten70});
    background-color: ${tokens.color.white};
    border-color: ${tokens.border.color};
    color: ${tokens.color.black};

import tokens from "@paprika/tokens";
import stylers from "@paprika/stylers";
import { ShirtSizes } from "@paprika/helpers/lib/customPropTypes";

const iconStyles = {
  [ShirtSizes.SMALL]: `
    ${stylers.fontSize(-2)}
    margin-left: 3px;
    padding: 0 ${tokens.spaceSm};
  `,
  [ShirtSizes.MEDIUM]: `
    ${stylers.fontSize()}
    margin-left: 2px;
    padding: 0 ${tokens.spaceSm};
  `,
  [ShirtSizes.LARGE]: `
    ${stylers.fontSize(2)}
    margin-left: ${tokens.spaceSm};
    padding: 0 ${tokens.spaceSm};
  `,
};

const inputStyles = css`
  line-height: 1;
  position: relative;

  input.form-input__input {
    ${stylers.placeholders}

    background-color: ${tokens.color.white};
    border: 1px solid ${tokens.border.color};
    border-radius: ${tokens.border.radius};

display: flex;
  flex-direction: column;
  height: 100%;

  &::before,
  &::after {
    content: "";
    display: block;
    flex: 0 1 ${tokens.modal.top};
  }
`;

const mapShirtSizesToValues = {
  [ShirtSizes.SMALL]: tokens.modal.sizes.sm,
  [ShirtSizes.MEDIUM]: tokens.modal.sizes.md,
  [ShirtSizes.LARGE]: tokens.modal.sizes.lg,
};

export const Dialog = styled.div`
  background-color: ${tokens.modal.backgroundColor};
  border-radius: ${tokens.modal.borderRadius};
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: flex-start;
  overflow: auto;
  transition: all ${tokens.overlay.animationDuration}ms ease;
  width: 100%;
  ${({ state }) => states[state]};
  ${stylers.boxSizingStyles};
`;

top: "5px",
      width: "10px",
    },
    radioIconStyles: {
      fontSize: `${fontSizeValue(-2)}px`,
      height: mediumRadioSize,
      left: mediumRadioHalfSize,
    },
    labelStyles: hasLabel => {
      return {
        minHeight: mediumRadioSize,
        padding: `1px 0 0 ${getLabelLeftPadding(mediumRadioSize, hasLabel)}`,
      };
    },
  },
  [ShirtSizes.LARGE]: {
    baseFontSize: {
      fontSize: `${fontSizeValue()}px`,
    },
    radioStyles: {
      height: largeRadioSize,
      width: largeRadioSize,
      borderRadius: largeRadioHalfSize,
    },
    radioIconBackgroundStyles: {
      borderRadius: "6px",
      height: "12px",
      top: "6px",
      width: "12px",
    },
    radioIconStyles: {
      fontSize: `${fontSizeValue()}px`,

    padding-left: ${({ size }) => (size === ShirtSizes.LARGE ? stylers.spacer(4) : stylers.spacer(3))};
  }

const iconButtonSizes = {
  [ShirtSizes.SMALL]: css`
    font-size: 14px;
    height: ${stylers.spacer(3)};
    line-height: ${Number.parseInt(tokens.space, 10) * 3 - 2}px;
    padding: 0;
    width: ${stylers.spacer(3)};
  `,
  [ShirtSizes.MEDIUM]: css`
    font-size: 18px;
    height: ${stylers.spacer(4)};
    line-height: ${Number.parseInt(tokens.space, 10) * 4 - 2}px;
    padding: 0;
    width: ${stylers.spacer(4)};
  `,
  [ShirtSizes.LARGE]: css`
    font-size: 22px;
    height: ${stylers.spacer(5)};
    line-height: ${Number.parseInt(tokens.space, 10) * 5 - 2}px;
    padding: 0;
    width: ${stylers.spacer(5)};
  `,
};

const minorStyles = css`
  transition: background-color 0.2s ease-out;

  &:hover {
    background-color: ${stylers.alpha(tokens.color.black, 0.1)};
  }

  &:active {