How to use the fundamental-react.Icon.defaultProps function in fundamental-react

}

export const CollapseArrow = styled(Icon)`
  && {
    margin-left: 5px;
    position: relative;
    display: inline-block;
    cursor: pointer;
  }
  &:before {
    transition: 0.3s ease;
    ${(props: CollapseArrowProps) => props.open && 'transform: rotate(90deg);'};
  }
`;

Icon.defaultProps = {
  size: 'l',
  glyph: 'feeder-arrow',
};

export const CollapseButton = styled(Button)`
  && {
    direction: rtl;
    margin-bottom: 20px;
  }
  &:before {
    margin-right: 0;
    margin-left: 8px;
    transition: 0.3s ease;
    ${(props: { open?: boolean }) => props.open && 'transform: rotate(90deg);'};
  }
`;

color: ${props => (props.active ? `#0b74de` : '#32363a')};
  font-size: 14px;
  font-weight: ${props => (props.active ? 'bold' : 'normal')};
  display: block;
  border: 1px solid transparent;
  border-left: ${props =>
    props.active && props.noArrow ? '3px solid' : '1px solid transparent'};
  position: relative;

  :hover {
    color: #0b74de;
    cursor: pointer;
  }
`;

Icon.defaultProps = { glyph: 'feeder-arrow', size: 's' };
export const CollapseArrow = styled(Icon)`
  && {
    margin-left: 5px;
    position: relative;
    top: 1px;
    display: inline-block;
    cursor: pointer;
  }
  &:before {
    transition: 0.3s ease;
    ${props => props.open && 'transform: rotate(90deg);'};
  }
`;