fix(export props): made changes to export all props

src/components/Accordion/Accordion.tsx

@@ -2,7 +2,7 @@ import React, { PropsWithChildren } from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["h4"];
 
-interface Props extends IntrinsicElements {
+export interface AccordionProps extends IntrinsicElements {
   className?: string;
   label: string;
   id: string;
@@ -30,7 +30,7 @@ interface Props extends IntrinsicElements {
  * @param {boolean}          hidden       Determines if the Accordion content will be visible or not on initial render. Defaults to true.
  * @param {string}           id           Unique identifier required for each Accordion item used for form control.
  */
-export const Accordion: React.FC<PropsWithChildren<Props>> = ({
+export const Accordion: React.FC<PropsWithChildren<AccordionProps>> = ({
   className,
   children,
   label,

src/components/Accordion/AccordionGroup.tsx

@@ -2,7 +2,7 @@ import React, { Children, PropsWithChildren, useState } from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["div"];
 
-interface Props extends IntrinsicElements {
+export interface AccordionGroupProps extends IntrinsicElements {
   bordered?: boolean;
   className?: string;
   multiSelect?: boolean;
@@ -27,7 +27,7 @@ interface Props extends IntrinsicElements {
  * @param {string}           id           Unique identifier that will be applied to the AccordionGroup root div.
  * @param {boolean}          multiSelect  Determines whether or not multiple Accordion items can be expanded at the same time.
  */
-export const AccordionGroup: React.FC<PropsWithChildren<Props>> = ({
+export const AccordionGroup: React.FC<PropsWithChildren<AccordionGroupProps>> = ({
   bordered = false,
   className,
   children,

src/components/Alert/Alert.tsx

@@ -3,7 +3,7 @@ import React from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["div"];
 
-interface Props extends IntrinsicElements {
+export interface AlertProps extends IntrinsicElements {
   alertHeading: string;
   alertBody: string | React.ReactNode;
   variation: "info" | "warning" | "error" | "success";
@@ -22,7 +22,7 @@ interface Props extends IntrinsicElements {
  * @param {boolean}                    icon           Show/hide the alert icon associated with the variation of the alert.
  * @param {React.MouseEventHandler}    close          Close button that shows when a event handler is passed to the component.
  */
-export const Alert: React.FC<Props> = ({
+export const Alert: React.FC<AlertProps> = ({
   alertHeading,
   alertBody,
   variation,

src/components/Breadcrumbs/Breadcrumbs.tsx

@@ -7,7 +7,7 @@ type BreadcrumbItems = {
   path?: string;
 }[];
 
-interface BreadcrumbProps {
+export interface BreadcrumbProps {
   currentItemName: string;
   items: BreadcrumbItems;
   parentOnly?: boolean;

src/components/Button/Button.tsx

@@ -4,7 +4,7 @@ import tooltip from "../../../node_modules/@uswds/uswds/packages/usa-tooltip/src
 
 type ButtonElements = JSX.IntrinsicElements["button"];
 
-interface Props extends ButtonElements {
+export interface ButtonProps extends ButtonElements {
   ariaLabel?: string;
   buttonText: string;
   buttonVariation?: ButtonVariation;
@@ -57,7 +57,7 @@ const ButtonVariationConversion: { [key: string]: string } = {
   link: "usa-button--unstyled",
 };
 
-export const Button: React.FC<Props> = ({
+export const Button: React.FC<ButtonProps> = ({
   ariaLabel,
   buttonText,
   buttonVariation = "primary",

src/components/Card/Card.tsx

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren } from "react";
 
-interface Props {
+export interface CardProps {
   alignContent?: "left" | "right" | "center";
   altText?: string;
   bodyText?: string;
@@ -25,7 +25,7 @@ interface Props {
  * @param {boolean}   [insetMedia]    Set a border of whitespace around card content.
  */
 
-export const Card: React.FC<PropsWithChildren<Props>> = ({
+export const Card: React.FC<PropsWithChildren<CardProps>> = ({
   alignContent,
   altText,
   bodyText,

src/components/CardChoice/CardChoice.tsx

@@ -3,7 +3,7 @@ import { Icon } from "components/Icon/Icon";
 
 type IntrinsicElements = JSX.IntrinsicElements["a"];
 
-interface Props extends IntrinsicElements {
+export interface CardChoiceProps extends IntrinsicElements {
   actionText?: string;
   ariaLabel?: string;
   bodyText?: string;
@@ -28,7 +28,7 @@ interface Props extends IntrinsicElements {
  * @param {string}             [href]           href provided to the anchor.
  * @param {callback}           [onClick]        onClick provided to the anchor.
  */
-export const CardChoice: React.FC<PropsWithChildren<Props>> = ({
+export const CardChoice: React.FC<PropsWithChildren<CardChoiceProps>> = ({
   actionText,
   ariaLabel,
   bodyText,

src/components/CardChoice/CardChoiceGroup.tsx

@@ -2,7 +2,7 @@ import React, { Children, PropsWithChildren } from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["div"];
 
-interface Props extends IntrinsicElements {
+export interface CardChoiceGroupProps extends IntrinsicElements {
   alternatingBG?: boolean;
   bordered?: boolean;
 }
@@ -13,7 +13,7 @@ interface Props extends IntrinsicElements {
  * @param {boolean}            [bordered]         All CardChoice children are displayed with a gray border. The bordered property on an individual CardChoice will override this property.
  * @param {React.ReactNode}    [children]         CardChoice children to be rendered.
  */
-export const CardChoiceGroup: React.FC<PropsWithChildren<Props>> = ({
+export const CardChoiceGroup: React.FC<PropsWithChildren<CardChoiceGroupProps>> = ({
   alternatingBG = false,
   bordered = false,
   children,

src/components/Checkbox/Checkbox.tsx

@@ -2,7 +2,7 @@ import React, { useState } from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["input"];
 
-interface Props extends IntrinsicElements {
+export interface CheckboxProps extends IntrinsicElements {
   checked?: boolean;
   children?: JSX.Element[];
   disabled?: boolean;
@@ -26,7 +26,7 @@ interface Props extends IntrinsicElements {
  * @param {string}  [tileDescription] Text that can be used to describe the label in more detail. Activates the tile variation automatically.
  * @param {string}  [value]           Value of the input element.
  */
-export const Checkbox: React.FC<Props> = ({
+export const Checkbox: React.FC<CheckboxProps> = ({
   checked = false,
   children,
   disabled = false,

src/components/DateRange/DateRange.tsx

@@ -4,7 +4,7 @@ import { Datefield } from "components/Datefield/Datefield";
 import dateRange from "../../../node_modules/@uswds/uswds/packages/usa-date-range-picker/src";
 
 type IntrinsicElements = JSX.IntrinsicElements["div"];
-export interface Props extends IntrinsicElements {
+export interface DateRangeProps extends IntrinsicElements {
   minDate?: string;
   maxDate?: string;
   startDate?: string;
@@ -37,7 +37,7 @@ export interface Props extends IntrinsicElements {
  * @param {boolean} [required]             The date picker component will be required in terms of native form validation.
  */
 
-export const DateRange: React.FC<Props> = ({
+export const DateRange: React.FC<DateRangeProps> = ({
   minDate,
   maxDate,
   hint,

src/components/Datefield/Datefield.tsx

@@ -10,7 +10,7 @@ import {
 import datePicker from "../../../node_modules/@uswds/uswds/packages/usa-date-picker/src";
 
 type IntrinsicElements = JSX.IntrinsicElements["input"];
-export interface Props extends IntrinsicElements {
+export interface DatefieldProps extends IntrinsicElements {
   id: string;
   name: string;
   label: string;
@@ -35,7 +35,7 @@ export interface Props extends IntrinsicElements {
  * @param {boolean} [required]             The date picker component will be required in terms of native form validation.
  */
 
-export const Datefield: React.FC<Props> = ({
+export const Datefield: React.FC<DatefieldProps> = ({
   id,
   name,
   label,

src/components/Dropdown/Dropdown.tsx

@@ -8,7 +8,7 @@ interface DropdownData {
   displayString: string;
 }
 
-interface DropdownProps extends IntrinsicElements {
+export interface DropdownProps extends IntrinsicElements {
   data: DropdownData[];
   label: string;
   readOnly?: boolean;

src/components/DropdownInput/DropdownInput.tsx

@@ -10,12 +10,12 @@ import React, {
 
 type IntrinsicElements = JSX.IntrinsicElements["select"];
 
-interface DropdownData {
+export interface DropdownData {
   value: string | number;
   displayString: string;
 }
 
-interface DropdownProps extends IntrinsicElements {
+export interface DropdownProps extends IntrinsicElements {
   data: DropdownData[];
   label: string;
   readOnly?: boolean;

src/components/FileInput/FileInput.tsx

@@ -3,7 +3,7 @@ import fileInput from "../../../node_modules/@uswds/uswds/packages/usa-file-inpu
 
 type IntrinsicElements = JSX.IntrinsicElements["input"];
 
-interface Props extends IntrinsicElements {
+export interface FileInputProps extends IntrinsicElements {
   id: string;
   name: string;
   multipleFiles?: boolean;
@@ -32,7 +32,7 @@ interface Props extends IntrinsicElements {
  *
  */
 
-export const FileInput: React.FC<Props> = ({
+export const FileInput: React.FC<FileInputProps> = ({
   id,
   multipleFiles = false,
   label,

src/components/FilterChip/FilterChip.tsx

@@ -3,7 +3,7 @@ import React from "react";
 
 type IntrinsicElements = JSX.IntrinsicElements["button"];
 
-interface Props extends IntrinsicElements {
+export interface FilterChipProps extends IntrinsicElements {
   text: string;
 }
 
@@ -12,7 +12,7 @@ interface Props extends IntrinsicElements {
  *
  * @param {string}    text  Text content to be displayed within the FilterChip.
  */
-export const FilterChip: React.FC<Props> = ({ text, ...rest }) => {
+export const FilterChip: React.FC<FilterChipProps> = ({ text, ...rest }) => {
   return (
     <Button
       buttonVariation="primary"

src/components/Footer/Footer.tsx

@@ -15,7 +15,7 @@ interface Link {
   target?: string;
 }
 
-interface Props extends IntrinsicElements {
+export interface FooterProps extends IntrinsicElements {
   emailAddress: string;
   address?: string;
   altFooter?: boolean;
@@ -30,7 +30,7 @@ interface Props extends IntrinsicElements {
  * @param {Link[]}                        [navigationLinks]  Array of navigation links to render in the alternative footer.
  */
 
-export const Footer: React.FC<Props> = ({
+export const Footer: React.FC<FooterProps> = ({
   altFooter = false,
   emailAddress,
   address = "7500 Security Boulevard Baltimore, MD 21244",

src/components/Header/ActionsMenu.tsx

@@ -3,11 +3,11 @@ import { Icon, IconChoice } from "../Icon/Icon";
 import { Link, LinkProps } from "../Link/Link";
 import { useOutsideClick } from "hooks/useOutsideClick";
 
-interface ActionsMenuLink extends LinkProps {
+export interface ActionsMenuLink extends LinkProps {
   iconName?: IconChoice;
 }
 
-interface Props {
+export interface ActionMenuProps {
   name: string;
   links: ActionsMenuLink[];
 }
@@ -19,7 +19,7 @@ interface Props {
  * @param {ActionsMenuLink[]} links  List of links to display in the menu.
  */
 
-export const ActionsMenu: React.FC<Props> = ({ name, links, ...rest }) => {
+export const ActionsMenu: React.FC<ActionMenuProps> = ({ name, links, ...rest }) => {
   const [isOpen, setIsOpen] = useState(false);
   const wrapperRef = useRef(null);
   useOutsideClick(wrapperRef, () => {

src/components/Header/Header.tsx

@@ -81,7 +81,7 @@ const NavSection: React.FC<NavSectionProps> = ({ section, index }) => {
 
 type IntrinsicElements = JSX.IntrinsicElements["nav"];
 
-interface HeaderProps extends IntrinsicElements {
+export interface HeaderProps extends IntrinsicElements {
   headerLogo?: React.ReactNode;
   secondaryComponent?: React.ReactNode;
   navData?: NavSection[];

src/components/Icon/Icon.tsx

@@ -5,7 +5,7 @@ import sprite from "../../assets/img/sprite.svg";
 export type IconChoice = typeof iconChoices[number];
 type IntrinsicElements = JSX.IntrinsicElements["svg"];
 
-interface Props extends IntrinsicElements {
+export interface IconProps extends IntrinsicElements {
   name: IconChoice;
   iconSize?: IconSize;
   ariaHidden?: boolean;
@@ -26,7 +26,7 @@ type IconSize = 3 | 4 | 5 | 6 | 7 | 8 | 9;
  * @param {color}   [string]              Color of Icon that is rendered, defaults to black.
  */
 
-export const Icon: React.FC<Props> = ({
+export const Icon: React.FC<IconProps> = ({
   name,
   iconSize = 3,
   role = "img",

src/components/Modal/Modal.tsx

@@ -4,7 +4,7 @@ import React from "react";
 
 type ModalType = "default" | "large" | "forcedAction";
 
-interface Props {
+export interface ModalProps {
   description: string;
   heading: string;
   id: string;
@@ -31,7 +31,7 @@ interface Props {
  * @param {string}     secondaryButtonText  Text shown on the secondary button.
  */
 
-export const Modal: React.FC<Props> = ({
+export const Modal: React.FC<ModalProps> = ({
   description,
   heading,
   id,

src/components/MultiSelect/MultiSelect.tsx

@@ -9,7 +9,7 @@ interface DropdownData {
   displayString: string;
 }
 
-interface MultiSelelctProps extends IntrinsicElements {
+export interface MultiSelelctProps extends IntrinsicElements {
   data: DropdownData[];
   defaultValues?: string[];
   label: string;

src/components/Radio/RadioGroup.tsx

@@ -1,12 +1,12 @@
 import React, { ReactElement } from "react";
 import { Radio, RadioProps } from "../Radio/Radio";
 
-interface Props {
+export interface RadioGroupProps {
   groupName: string;
   radioProps: RadioProps[];
 }
 
-export const RadioGroup: React.FC<Props> = ({ groupName, radioProps }) => {
+export const RadioGroup: React.FC<RadioGroupProps> = ({ groupName, radioProps }) => {
   // Track which Radio is currently selected in order to show/hide child elements:
   const [selected, setSelected] = React.useState("");
   const handleChange = (e: React.ChangeEvent) => {

src/components/Search/Search.tsx

@@ -3,7 +3,7 @@ import spyGlass from "../../assets/uswds/img/usa-icons-bg/search--white.svg";
 
 type IntrinsicElements = JSX.IntrinsicElements["input"];
 
-interface Props extends IntrinsicElements {
+export interface SearchProps extends IntrinsicElements {
   variation?: SearchVariation;
   onSearch: EventHandler<any>;
   onInput?: FormEventHandler<HTMLInputElement>;
@@ -25,7 +25,7 @@ type SearchVariation = "default" | "big" | "small";
  * @param {string}            [labelText]           Label text for screen reader.
  */
 
-export const Search: React.FC<Props> = ({
+export const Search: React.FC<SearchProps> = ({
   variation = "default",
   disabled = false,
   onSearch,

src/components/SiteAlert/SiteAlert.tsx

@@ -3,7 +3,7 @@ import { Icon } from "../Icon/Icon";
 
 type IntrinsicElements = JSX.IntrinsicElements["section"];
 
-interface Props extends IntrinsicElements {
+export interface SiteAlertProps extends IntrinsicElements {
   alertHeading?: string;
   alertBody: string | React.ReactNode;
   emergency?: boolean;
@@ -22,7 +22,7 @@ interface Props extends IntrinsicElements {
  * @param {boolean}                    icon           Show/hide the alert icon associated with the variation of the alert.
  * @param {React.MouseEventHandler}    close          Close button that shows when a event handler is passed to the component.
  */
-export const SiteAlert: React.FC<Props> = ({
+export const SiteAlert: React.FC<SiteAlertProps> = ({
   alertHeading,
   alertBody,
   emergency = false,