@nypl/design-system-react-components 4.0.0-alpha-rc → 4.0.0-alpha-rc2

package/dist/src/components/Accordion/Accordion.d.ts

@@ -1,8 +1,9 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export type AccordionTypes = "default" | "warning" | "error";
+export declare const accordionVariantsArray: readonly ["default", "warning", "error"];
+export type AccordionVariants = typeof accordionVariantsArray[number];
 export interface AccordionDataProps {
-    accordionType?: AccordionTypes;
+    variant?: AccordionVariants;
     ariaLabel?: string;
     /** Ref to the DOM element of the AccordionButton. */
     buttonInteractionRef?: any;
@@ -10,7 +11,7 @@ export interface AccordionDataProps {
     panel: string | React.ReactNode;
 }
 export interface AccordionProps extends Omit<BoxProps, "onChange"> {
-    /** Array of data to display, and an optional accordionType */
+    /** Array of data to display, and an optional variant */
     accordionData: AccordionDataProps[];
     /** ID that other components can cross reference for accessibility purposes */
     id?: string;

package/dist/src/components/Banner/Banner.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 import { messageVariantsArray, bgColorsArray, highlightColorsArray } from "../../theme/sharedTypes";
-export type BannerTypes = typeof messageVariantsArray[number];
+export type BannerVariants = typeof messageVariantsArray[number];
 export type BannerBgColors = typeof bgColorsArray[number];
 export type BannerHighlightColors = typeof highlightColorsArray[number];
 export interface BannerProps extends Omit<BoxProps, "content"> {
@@ -25,7 +25,7 @@ export interface BannerProps extends Omit<BoxProps, "content"> {
      * (closed) by a user. */
     isDismissible?: boolean;
     /** Used to control the component's semantic coloring and iconography. */
-    type?: BannerTypes;
+    variant?: BannerVariants;
 }
 /**
  * The `Banner` component is a non-modal semantic dialog used to communicate a

package/dist/src/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export declare const breadcrumbTypeArray: readonly ["blogs", "booksAndMore", "brand", "connect", "digitalCollections", "education", "locations", "research", "whatsOn"];
-export type BreadcrumbsTypes = typeof breadcrumbTypeArray[number];
+export declare const breadcrumbVariantsArray: readonly ["blogs", "booksAndMore", "brand", "connect", "digitalCollections", "education", "locations", "research", "whatsOn"];
+export type BreadcrumbsVariants = typeof breadcrumbVariantsArray[number];
 export interface BreadcrumbsDataProps {
     url: string;
     text: string | React.ReactNode;
@@ -10,8 +10,8 @@ export interface BreadcrumbsDataProps {
 export interface BreadcrumbProps extends BoxProps {
     /** Breadcrumb links as an array */
     breadcrumbsData: BreadcrumbsDataProps[];
-    /** Used to control how the `Hero` component will be rendered. */
-    breadcrumbsType?: BreadcrumbsTypes;
+    /** Used to control how the `Breadcrumbs` component will be rendered. */
+    variant?: BreadcrumbsVariants;
     /** ID that other components can cross reference for accessibility purposes */
     id?: string;
     /** Custom Link component for apps with internal routing, defaults to BreadcrumbLink if not passed */

package/dist/src/components/Button/Button.d.ts

@@ -2,13 +2,14 @@ import { BoxProps, ChakraComponent, ChakraProps } from "@chakra-ui/react";
 import { sizesArray } from "../../theme/sharedTypes";
 import React, { ButtonHTMLAttributes } from "react";
 export declare const buttonElementTypeArray: readonly ["submit", "button", "reset"];
-export declare const buttonTypesArray: readonly ["primary", "secondary", "text", "callout", "pill", "noBrand"];
+export declare const buttonSizesArray: readonly ["small", "medium", "large"];
+export declare const buttonVariantsArray: readonly ["primary", "secondary", "text", "callout", "pill", "noBrand"];
 export type ButtonElementType = typeof buttonElementTypeArray[number];
+export type ButtonVariants = typeof buttonVariantsArray[number];
 export type ButtonSizes = typeof sizesArray[number];
-export type ButtonTypes = typeof buttonTypesArray[number];
 export interface ButtonProps extends Pick<BoxProps, keyof ChakraProps>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, "color"> {
-    /** The button variation to render based on the `ButtonTypes` type. */
-    buttonType?: ButtonTypes;
+    /** The button variation to render based on the `ButtonVariants` type. */
+    variant?: ButtonVariants;
     /** ID that other components can cross reference for accessibility purposes. */
     id: string;
     /** Adds 'disabled' property to the button. */

package/dist/src/components/Hero/Hero.d.ts

@@ -1,8 +1,8 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 import { ComponentImageProps } from "../Image/Image";
-export declare const heroTypesArray: readonly ["primary", "tertiary", "campaign"];
-export type HeroTypes = typeof heroTypesArray[number];
+export declare const heroVariantsArray: readonly ["primary", "tertiary", "campaign"];
+export type HeroVariants = typeof heroVariantsArray[number];
 export interface HeroImageProps extends Omit<BoxProps, "onError">, Pick<ComponentImageProps, "alt" | "fallbackSrc" | "id" | "src" | "onError" | "component"> {
 }
 export interface HeroProps {
@@ -13,21 +13,21 @@ export interface HeroProps {
      */
     backdropBackgroundColor?: string;
     /** Optional hex color value used to override the default background
-     * color for a given `Hero` variation.
-     * Note: not all `Hero` variations utilize this prop. */
+     * color for a given `Hero` variant.
+     * Note: not all `Hero` variants utilize this prop. */
     backgroundColor?: string;
     /** Optional path to an image that will be used as a background image for the
      * `Hero` component.
-     * Note: not all `Hero` variations utilize this prop. */
+     * Note: not all `Hero` variants utilize this prop. */
     backgroundImageSrc?: string;
     /** Optional hex color value used to override the default text color for a
      * given `Hero` variation.
-     * Note: not all `Hero` variations utilize this prop. */
+     * Note: not all `Hero` variants utilize this prop. */
     foregroundColor?: string;
     /** Optional heading element. */
     heading?: JSX.Element;
     /** Used to control how the `Hero` component will be rendered. */
-    heroType?: HeroTypes;
+    variant?: HeroVariants;
     /** ID that other components can cross reference for accessibility purposes. */
     id?: string;
     /** Object used to create and render the `Image` component. You can pass `component`

package/dist/src/components/Icons/Icon.d.ts

@@ -1,12 +1,12 @@
 import { BoxProps, ChakraProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-import { iconAlignArray, iconColorsArray, iconNamesArray, iconRotationsArray, iconSizesArray, iconTypesArray } from "./iconVariables";
+import { iconAlignArray, iconColorsArray, iconNamesArray, iconRotationsArray, iconSizesArray, iconVariantsArray } from "./iconVariables";
 export type IconAlign = typeof iconAlignArray[number];
 export type IconColors = typeof iconColorsArray[number];
 export type IconNames = typeof iconNamesArray[number];
 export type IconRotations = typeof iconRotationsArray[number];
 export type IconSizes = typeof iconSizesArray[number];
-export type IconTypes = typeof iconTypesArray[number];
+export type IconVariants = typeof iconVariantsArray[number];
 export interface IconProps extends Pick<BoxProps, "className" | keyof ChakraProps> {
     /** Aligns the icon. */
     align?: IconAlign;
@@ -28,7 +28,7 @@ export interface IconProps extends Pick<BoxProps, "className" | keyof ChakraProp
      * visible but is needed for screenreaders to describe the graphic. */
     title?: string;
     /** FOR INTERNAL DS USE ONLY: the icon variant to display. */
-    type?: IconTypes;
+    variant?: IconVariants;
 }
 /**
  * Renders SVG-based icons.

package/dist/src/components/Icons/iconVariables.d.ts

@@ -3,4 +3,4 @@ export declare const iconColorsArray: readonly ["currentColor", "transparent", "
 export declare const iconNamesArray: readonly ["accessibilityFull", "accessibilityPartial", "actionCheckCircle", "actionCheckCircleFilled", "actionDelete", "actionExit", "actionHelpDefault", "actionHelpOutline", "actionHome", "actionIdentity", "actionIdentityFilled", "actionLaunch", "actionLightbulb", "actionLockClosed", "actionPayment", "actionPower", "actionRegistration", "actionSearch", "actionSettings", "alertNotificationImportant", "alertWarningFilled", "alertWarningOutline", "arrow", "building", "check", "clock", "close", "communicationCall", "communicationChatBubble", "communicationEmail", "contentFilterList", "decorativeBookBroken", "decorativeEnvelope", "decorativeLibraryCard", "decorativeShoppingBag", "download", "editorMode", "errorFilled", "errorOutline", "fileTypeAudio", "fileTypeDoc", "fileTypeGenericDoc", "fileTypeImage", "fileTypePdf", "fileTypeSpreadsheet", "fileTypeVideo", "headset", "legacyAccountFilled", "legacyAccountUnfilled", "legacySocialFacebook", "legacySocialInstagram", "legacySocialTwitter", "legacySocialYoutube", "locator", "mapsPlace", "minus", "moonCrescent", "navigationMoreVert", "navigationSubdirectoryArrowLeft", "navigationSubdirectoryArrowRight", "plus", "search", "socialFacebook", "socialInstagram", "socialPinterest", "socialSoundCloud", "socialSpotify", "socialTikTok", "socialTumblr", "socialTwitter", "socialVimeo", "socialX", "socialYoutube", "speakerNotes", "sunFull", "utilityAccountFilled", "utilityAccountUnfilled", "utilityCheck", "utilityHamburger", "utilitySearch"];
 export declare const iconRotationsArray: readonly ["rotate0", "rotate90", "rotate180", "rotate270"];
 export declare const iconSizesArray: readonly ["default", "xsmall", "small", "medium", "large", "xlarge", "xxlarge", "xxxlarge", "xxxxlarge", "xxxxxlarge", "2xlarge", "3xlarge", "4xlarge", "5xlarge"];
-export declare const iconTypesArray: readonly ["default", "breadcrumbs"];
+export declare const iconVariantsArray: readonly ["default", "breadcrumbs"];

package/dist/src/components/Link/Link.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, ChakraComponent, ChakraProps } from "@chakra-ui/react";
 import React, { AnchorHTMLAttributes } from "react";
-export declare const linkTypesArray: readonly ["action", "backwards", "buttonPrimary", "buttonSecondary", "buttonPill", "buttonCallout", "buttonNoBrand", "buttonDisabled", "default", "external", "forwards", "standalone"];
-export type LinkTypes = typeof linkTypesArray[number];
+export declare const linkVariantsArray: readonly ["action", "backwards", "buttonPrimary", "buttonSecondary", "buttonPill", "buttonCallout", "buttonNoBrand", "buttonDisabled", "default", "external", "forwards", "standalone"];
+export type LinkVariants = typeof linkVariantsArray[number];
 export interface LinkProps extends Pick<BoxProps, "as" | keyof ChakraProps>, Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "color"> {
     /** Used to include or remove visited state styles. Default is true. */
     hasVisitedState?: boolean;
@@ -15,7 +15,7 @@ export interface LinkProps extends Pick<BoxProps, "as" | keyof ChakraProps>, Omi
     screenreaderOnlyText?: string;
     /** Controls the link's styles based on the value: action, backwards, default,
      * external, forwards, standalone, and all "button" types. */
-    type?: LinkTypes;
+    variant?: LinkVariants;
 }
 /**
  * A component that renders an anchor element with added styling

package/dist/src/components/List/List.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export declare const listTypesArray: readonly ["ol", "ul", "dl"];
-export type ListTypes = typeof listTypesArray[number];
+export declare const listVariantsArray: readonly ["ol", "ul", "dl"];
+export type ListVariants = typeof listVariantsArray[number];
 export interface DescriptionProps {
     term: string;
     description: string | JSX.Element;
@@ -27,7 +27,7 @@ export interface ListProps extends Omit<BoxProps, "title"> {
      * to Description Lists and will render above the list. */
     title?: string | JSX.Element;
     /** The type of list: "ol", "ul", or "dl". "ul" by default. */
-    type: ListTypes;
+    variant: ListVariants;
 }
 /**
  * A component that renders list item `li` elements or description item `dt`
@@ -39,9 +39,9 @@ export declare const List: ChakraComponent<React.ForwardRefExoticComponent<React
  * Checks for `li` elements and consoles a warning if the
  * children are different HTML elements.
  */
-export declare const checkListChildrenError: ({ children, listType, componentName, }: {
+export declare const checkListChildrenError: ({ children, variant, componentName, }: {
     children: React.ReactNode;
-    listType?: ListTypes;
+    variant?: ListVariants;
     componentName?: string;
 }) => void;
 export default List;

package/dist/src/components/Modal/Modal.d.ts

@@ -16,7 +16,7 @@ export interface ConfirmationModalProps {
     onCancel: () => void;
     onConfirm: () => void;
     /** The `Modal` variant to render. */
-    type: "confirmation";
+    variant: "confirmation";
     /** The label for the close button. This prop is used for the
      * "cancel" button in the confirmation variant. */
     closeButtonLabel?: string;
@@ -27,7 +27,7 @@ export interface DefaultModalProps {
     closeButtonLabel?: string;
     onClose?: () => void;
     /** The `Modal` variant to render. */
-    type: "default";
+    variant: "default";
     /** The label for the confirm button. This prop is not used
      * in the default variant. */
     confirmButtonLabel?: never;
@@ -45,7 +45,7 @@ export interface ModalProps {
      * `bodyContent`, `headingText`, `isOpen`, and the modal type props. */
     modalProps: BaseModalProps;
 }
-export declare function isDefaultType(type: BaseModalProps["type"]): type is "default";
+export declare function isDefaultVariant(variant: BaseModalProps["variant"]): variant is "default";
 export declare const BaseModal: ChakraComponent<React.FunctionComponent<BaseModalProps>, BaseModalProps>;
 /**
  * The `ModalTrigger` component renders a button that you click to open the

package/dist/src/components/Notification/Notification.d.ts

@@ -1,7 +1,7 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export declare const notificationTypesArray: readonly ["standard", "announcement", "warning"];
-export type NotificationTypes = typeof notificationTypesArray[number];
+export declare const notificationVariantsArray: readonly ["standard", "announcement", "warning"];
+export type NotificationVariants = typeof notificationVariantsArray[number];
 interface BaseProps {
     /** Optional prop to control text alignment in `NotificationContent` */
     alignText?: boolean;
@@ -18,7 +18,7 @@ interface BaseProps {
     notificationHeading?: string | JSX.Element;
     /** Optional prop to control the coloring of the `Notification` text and the
      * visibility of an applicable icon. */
-    notificationType?: NotificationTypes;
+    variant?: NotificationVariants;
     /** Prop to display the `Notification` icon. Defaults to `true`. */
     showIcon?: boolean;
 }

package/dist/src/components/Select/Select.d.ts

@@ -1,9 +1,9 @@
 import { BoxProps, ChakraComponent, ChakraProps } from "@chakra-ui/react";
 import React from "react";
 import { HelperErrorTextType } from "../HelperErrorText/HelperErrorText";
-export declare const selectTypesArray: string[];
-export declare const labelPositionsArray: string[];
-export type SelectTypes = typeof selectTypesArray[number];
+export declare const selectVariantsArray: readonly ["default", "searchbar"];
+export declare const labelPositionsArray: readonly ["default", "inline"];
+export type SelectVariants = typeof selectVariantsArray[number];
 export type LabelPositions = typeof labelPositionsArray[number];
 export interface SelectProps extends Pick<BoxProps, keyof ChakraProps>, Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "color"> {
     /** The initial value of an uncontrolled component */
@@ -35,7 +35,7 @@ export interface SelectProps extends Pick<BoxProps, keyof ChakraProps>, Omit<Rea
      * Note: Parenthesis will be added automatically by the component */
     requiredLabelText?: string;
     /** The variant to display. */
-    selectType?: SelectTypes;
+    variant?: SelectVariants;
     /** Offers the ability to hide the helper/invalid text. */
     showHelperInvalidText?: boolean;
     /** Offers the ability to show the select's label onscreen or hide it. Refer

package/dist/src/components/StatusBadge/StatusBadge.d.ts

@@ -2,12 +2,12 @@ import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 import { messageVariantsArray } from "../../theme/sharedTypes";
 export declare const statusBadgeFontSizeArray: readonly ["desktop.body.body1", "desktop.body.body2", "desktop.caption"];
-export type StatusBadgeTypes = typeof messageVariantsArray[number];
+export type StatusBadgeVariants = typeof messageVariantsArray[number];
 export interface StatusBadgeProps extends BoxProps {
     /** ID that other components can cross reference for accessibility purposes */
     id?: string;
     /** Semantic type of the status badge. */
-    type?: StatusBadgeTypes;
+    variant?: StatusBadgeVariants;
 }
 /**
  * The `StatusBadge` component is a label that indicates status or importance.

package/dist/src/components/Table/Table.d.ts

@@ -1,7 +1,5 @@
 import { BoxProps, ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export declare const tableBodyTextSizesArray: readonly ["body1", "body2", "caption"];
-export type TableBodyTextSizes = typeof tableBodyTextSizesArray[number];
 export interface TableProps extends BoxProps {
     /** Array of string values used to populate the `Table` column headers.
      * For improved accessibility, column headers are required. */
@@ -14,10 +12,6 @@ export interface TableProps extends BoxProps {
      * Any style can be passed, but the most common use would be to pass "width"
      * and "maxWidth" to set custom column widths. */
     columnStyles?: object[];
-    /** The size of the table body text. */
-    tableTextSize?: TableBodyTextSizes;
-    /** ID that other components can cross reference for accessibility purposes. */
-    id?: string;
     /** If true, horizontal scrolling will be enabled for the table content.  */
     isScrollable?: boolean;
     /** If true, a border will be displayed between each row in the `Table`

package/dist/src/components/TagSet/TagSet.d.ts

@@ -8,7 +8,7 @@ export interface BaseTagSetProps extends BoxProps {
 }
 export type TagSetTypeProps = TagSetFilterProps | TagSetExploreProps;
 export type TagSetProps = BaseTagSetProps & TagSetTypeProps;
-export declare function isFilterType(type: TagSetProps["type"]): type is "filter";
+export declare function isFilterVariant(variant: TagSetProps["variant"]): variant is "filter";
 /**
  * The `TagSet` component renders a group of individual tags which have two
  * variants: "explore" and "filter". The "explore" tags are meant to be used for

package/dist/src/components/TagSet/TagSetExplore.d.ts

@@ -21,7 +21,7 @@ export interface TagSetExploreProps {
     /** The array of data to display as tags. */
     tagSetData: TagSetExploreDataProps[];
     /** The `TagSet` variant to render; "filter" by default. */
-    type: "explore";
+    variant: "explore";
 }
 /**
  * The "explore" `TagSet` variant will always display the tags passed as data.

package/dist/src/components/TagSet/TagSetFilter.d.ts

@@ -20,7 +20,7 @@ export interface TagSetFilterProps {
     /** The array of data to display as tags. */
     tagSetData: TagSetFilterDataProps[];
     /** The `TagSet` variant to render; "filter" by default. */
-    type: "filter";
+    variant: "filter";
 }
 /**
  * The "filter" `TagSet` variant will display tags that can be removed when

package/dist/src/components/TextInput/TextInput.d.ts

@@ -59,7 +59,7 @@ export interface InputProps extends TextInputPropsWithHTML {
      * True by default. */
     showRequiredLabel?: boolean;
     /** FOR INTERNAL DS USE ONLY: the input variant to display. */
-    textInputType?: TextInputVariants;
+    textInputVariant?: TextInputVariants;
 }
 /**
  * The type used for `ref`s. We want to extend both `input` and `textarea`

package/dist/src/index.d.ts

@@ -1,17 +1,17 @@
 export { Box, Center, chakra, Circle, ColorModeScript, cookieStorageManager, cookieStorageManagerSSR, FocusLock, Flex, Grid, GridItem, HStack, localStorageManager, Spacer, Square, Stack, useColorMode, useColorModeValue, useStyleConfig, useMediaQuery, useMultiStyleConfig, VStack, } from "@chakra-ui/react";
 export { default as DSProvider } from "./theme/provider";
 export { default as Accordion } from "./components/Accordion/Accordion";
-export type { AccordionTypes, AccordionDataProps, } from "./components/Accordion/Accordion";
+export type { AccordionVariants, AccordionDataProps, } from "./components/Accordion/Accordion";
 export { default as AlphabetFilter } from "./components/AlphabetFilter/AlphabetFilter";
 export type { AlphabetFilterProps } from "./components/AlphabetFilter/AlphabetFilter";
 export { default as AudioPlayer } from "./components/AudioPlayer/AudioPlayer";
 export type { AudioType, AudioPlayerProps, } from "./components/AudioPlayer/AudioPlayer";
 export { default as Banner } from "./components/Banner/Banner";
-export type { BannerTypes, BannerBgColors, BannerHighlightColors, BannerProps, } from "./components/Banner/Banner";
+export type { BannerVariants, BannerBgColors, BannerHighlightColors, BannerProps, } from "./components/Banner/Banner";
 export { default as Breadcrumbs } from "./components/Breadcrumbs/Breadcrumbs";
-export type { BreadcrumbsTypes, BreadcrumbProps, BreadcrumbsDataProps, } from "./components/Breadcrumbs/Breadcrumbs";
+export type { BreadcrumbsVariants, BreadcrumbProps, BreadcrumbsDataProps, } from "./components/Breadcrumbs/Breadcrumbs";
 export { default as Button } from "./components/Button/Button";
-export type { ButtonElementType, ButtonProps, ButtonSizes, ButtonTypes, } from "./components/Button/Button";
+export type { ButtonElementType, ButtonProps, ButtonSizes, ButtonVariants, } from "./components/Button/Button";
 export { default as ButtonGroup } from "./components/ButtonGroup/ButtonGroup";
 export type { ButtonGroupProps } from "./components/ButtonGroup/ButtonGroup";
 export { default as Card, CardActions, CardContent, CardHeading, } from "./components/Card/Card";
@@ -40,20 +40,20 @@ export type { HeadingLevels, HeadingProps, HeadingSizes, } from "./components/He
 export { default as HelperErrorText } from "./components/HelperErrorText/HelperErrorText";
 export type { HelperErrorTextProps } from "./components/HelperErrorText/HelperErrorText";
 export { default as Hero } from "./components/Hero/Hero";
-export type { HeroProps, HeroTypes } from "./components/Hero/Hero";
+export type { HeroProps, HeroVariants } from "./components/Hero/Hero";
 export { default as HorizontalRule } from "./components/HorizontalRule/HorizontalRule";
 export type { HorizontalRuleProps } from "./components/HorizontalRule/HorizontalRule";
 export { default as Icon } from "./components/Icons/Icon";
-export type { IconAlign, IconColors, IconNames, IconRotations, IconSizes, IconTypes, IconProps, } from "./components/Icons/Icon";
+export type { IconAlign, IconColors, IconNames, IconRotations, IconSizes, IconVariants, IconProps, } from "./components/Icons/Icon";
 export { default as Image } from "./components/Image/Image";
 export type { ComponentImageProps, ImageProps, ImageRatios, ImageSizes, ImageTypes, } from "./components/Image/Image";
 export { default as Label } from "./components/Label/Label";
 export type { LabelProps } from "./components/Label/Label";
 export type { DimensionTypes, LayoutTypes, SectionTypes, } from "./helpers/types";
 export { default as Link } from "./components/Link/Link";
-export type { LinkProps, LinkTypes } from "./components/Link/Link";
+export type { LinkProps, LinkVariants } from "./components/Link/Link";
 export { default as List } from "./components/List/List";
-export type { DescriptionProps, ListProps, ListTypes, } from "./components/List/List";
+export type { DescriptionProps, ListProps, ListVariants, } from "./components/List/List";
 export { default as Logo } from "./components/Logo/Logo";
 export type { LogoNames, LogoProps, LogoSizes } from "./components/Logo/Logo";
 export { default as MatchMedia } from "../src/__tests__/mediaMatchMock";
@@ -68,7 +68,7 @@ export type { MultiSelectGroupProps } from "./components/MultiSelectGroup/MultiS
 export { default as NewsletterSignup } from "./components/NewsletterSignup/NewsletterSignup";
 export type { HighlightColorTypes, NewsletterSignupProps, NewsletterSignupViewType, } from "./components/NewsletterSignup/NewsletterSignup";
 export { default as Notification } from "./components/Notification/Notification";
-export type { NotificationProps, NotificationTypes, } from "./components/Notification/Notification";
+export type { NotificationProps, NotificationVariants, } from "./components/Notification/Notification";
 export { default as Pagination } from "./components/Pagination/Pagination";
 export type { PaginationProps } from "./components/Pagination/Pagination";
 export { default as ProgressIndicator } from "./components/ProgressIndicator/ProgressIndicator";
@@ -80,7 +80,7 @@ export type { RadioGroupProps } from "./components/RadioGroup/RadioGroup";
 export { default as SearchBar } from "./components/SearchBar/SearchBar";
 export type { SearchBarProps } from "./components/SearchBar/SearchBar";
 export { default as Select } from "./components/Select/Select";
-export type { LabelPositions, SelectProps, SelectTypes, } from "./components/Select/Select";
+export type { LabelPositions, SelectProps, SelectVariants, } from "./components/Select/Select";
 export { default as SimpleGrid } from "./components/Grid/SimpleGrid";
 export type { GridGaps, SimpleGridProps } from "./components/Grid/SimpleGrid";
 export { default as SkeletonLoader } from "./components/SkeletonLoader/SkeletonLoader";
@@ -92,14 +92,14 @@ export type { SliderProps } from "./components/Slider/Slider";
 export { default as SocialMediaLinks } from "./components/SocialMediaLinks/SocialMediaLinks";
 export type { SocialMediaLinkDataProps } from "./components/SocialMediaLinks/SocialMediaLinks";
 export { default as StatusBadge } from "./components/StatusBadge/StatusBadge";
-export type { StatusBadgeProps, StatusBadgeTypes, } from "./components/StatusBadge/StatusBadge";
+export type { StatusBadgeProps, StatusBadgeVariants, } from "./components/StatusBadge/StatusBadge";
 export { default as StructuredContent } from "./components/StructuredContent/StructuredContent";
 export type { StructuredContentImagePosition, StructuredContentProps, } from "./components/StructuredContent/StructuredContent";
 export { default as StyledList } from "./components/StyledList/StyledList";
 export type { StyledListProps, StyledListTextSizes, } from "./components/StyledList/StyledList";
 export { default as SubNav, SubNavButton, SubNavLink, } from "./components/SubNav/SubNav";
 export { default as Table } from "./components/Table/Table";
-export type { TableBodyTextSizes, TableProps } from "./components/Table/Table";
+export type { TableProps } from "./components/Table/Table";
 export { default as Tabs, TabList, Tab, TabPanels, TabPanel, } from "./components/Tabs/Tabs";
 export type { TabsDataProps, TabsProps } from "./components/Tabs/Tabs";
 export { default as TagSet } from "./components/TagSet/TagSet";

package/dist/src/theme/components/notification.d.ts

@@ -1,13 +1,13 @@
-import { NotificationTypes } from "../../components/Notification/Notification";
+import { NotificationVariants } from "../../components/Notification/Notification";
 import { StyleFunctionProps } from "@chakra-ui/system";
 interface NotificationBaseStyle extends StyleFunctionProps {
     isCentered: boolean;
     notificationHeading: string;
-    notificationType: NotificationTypes;
+    variant: NotificationVariants;
     showIcon: boolean;
 }
 declare const Notification: {
-    baseStyle?: ({ isCentered, notificationHeading, notificationType, }: NotificationBaseStyle) => {
+    baseStyle?: ({ isCentered, notificationHeading, variant }: NotificationBaseStyle) => {
         bg: string;
         display: string;
         fontSize: string;

package/dist/src/theme/components/notificationContent.d.ts

@@ -1,14 +1,14 @@
-import { NotificationTypes } from "../../components/Notification/Notification";
+import { NotificationVariants } from "../../components/Notification/Notification";
 import { StyleFunctionProps } from "@chakra-ui/system";
 interface NotificationContentBaseStyle extends StyleFunctionProps {
     alignText: boolean;
     isCentered: boolean;
     notificationHeading: string;
-    notificationType: NotificationTypes;
+    variant: NotificationVariants;
     showIcon: boolean;
 }
 declare const NotificationContent: {
-    baseStyle?: ({ isCentered, notificationHeading, notificationType, showIcon, }: NotificationContentBaseStyle) => {
+    baseStyle?: ({ isCentered, notificationHeading, variant, showIcon, }: NotificationContentBaseStyle) => {
         display: string;
         justifyContent: string;
         content: {

package/dist/src/theme/components/notificationHeading.d.ts

@@ -1,12 +1,12 @@
-import { NotificationTypes } from "../../components/Notification/Notification";
+import { NotificationVariants } from "../../components/Notification/Notification";
 import { StyleFunctionProps } from "@chakra-ui/system";
 interface NotificationHeadingBaseStyle extends StyleFunctionProps {
     icon: boolean;
     isCentered: boolean;
-    notificationType: NotificationTypes;
+    variant: NotificationVariants;
 }
 declare const NotificationHeading: {
-    baseStyle?: ({ icon, isCentered, notificationType }: NotificationHeadingBaseStyle) => {
+    baseStyle?: ({ icon, isCentered, variant }: NotificationHeadingBaseStyle) => {
         display: string;
         flexDirection: string;
         m: string;

package/dist/src/theme/components/structuredContent.d.ts

@@ -467,7 +467,6 @@ declare const StructuredContent: {
                     base: string;
                     md: string;
                 };
-                fontSize: any;
                 gap: string;
                 letterSpacing: string;
                 lineHeight: number;

package/dist/src/theme/components/table.d.ts

@@ -1,9 +1,7 @@
 import { StyleFunctionProps } from "@chakra-ui/system";
-import { TableBodyTextSizes } from "../../components/Table/Table";
 interface BaseStyleProps extends StyleFunctionProps {
     columnHeadersBackgroundColor?: string;
     columnHeadersTextColor?: string;
-    tableTextSize?: TableBodyTextSizes;
     isScrollable?: boolean;
     showRowDividers?: boolean;
     useRowHeaders?: boolean;
@@ -57,7 +55,7 @@ export declare const baseTRStyles: (columnHeadersBackgroundColor?: string, isScr
         borderColor: string;
     };
 };
-export declare const baseCellStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, tableTextSize?: any, isScrollable?: boolean, showRowDividers?: boolean) => {
+export declare const baseCellStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, isScrollable?: boolean, showRowDividers?: boolean) => {
     border: string;
     borderBottom: string;
     borderColor: string;
@@ -65,7 +63,6 @@ export declare const baseCellStyles: (columnHeadersBackgroundColor?: string, col
         base: string;
         md: string;
     };
-    fontSize: any;
     gap: string;
     letterSpacing: string;
     lineHeight: number;
@@ -113,7 +110,7 @@ export declare const baseCellStyles: (columnHeadersBackgroundColor?: string, col
         };
     };
 };
-export declare const baseTHStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, tableTextSize?: string, isScrollable?: boolean, showRowDividers?: boolean, useRowHeaders?: boolean) => {
+export declare const baseTHStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, isScrollable?: boolean, showRowDividers?: boolean, useRowHeaders?: boolean) => {
     color: string;
     fontWeight: string;
     fontSize: string;
@@ -189,7 +186,7 @@ export declare const baseTHStyles: (columnHeadersBackgroundColor?: string, colum
         };
     };
 };
-export declare const baseTDStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, tableTextSize?: string, isScrollable?: boolean, showRowDividers?: boolean) => {
+export declare const baseTDStyles: (columnHeadersBackgroundColor?: string, columnHeadersTextColor?: string, isScrollable?: boolean, showRowDividers?: boolean) => {
     _last: {
         borderBottom: string | {
             base: number;
@@ -203,7 +200,6 @@ export declare const baseTDStyles: (columnHeadersBackgroundColor?: string, colum
         base: string;
         md: string;
     };
-    fontSize: any;
     gap: string;
     letterSpacing: string;
     lineHeight: number;
@@ -247,7 +243,7 @@ export declare const baseTDStyles: (columnHeadersBackgroundColor?: string, colum
         };
     };
 };
-export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTextColor, tableTextSize, isScrollable, showRowDividers, useRowHeaders, }: BaseStyleProps) => {
+export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTextColor, isScrollable, showRowDividers, useRowHeaders, }: BaseStyleProps) => {
     base: {
         overflow: string;
         maxWidth: string;
@@ -280,7 +276,6 @@ export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTe
                 };
                 color: string;
                 fontWeight: string;
-                fontSize: any;
                 textTransform: string;
                 verticalAlign: string;
                 _dark: {
@@ -297,6 +292,7 @@ export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTe
                 md: "table-header-group";
             };
             th: {
+                fontSize: string;
                 _first: {
                     backgroundColor: string;
                     _dark: {
@@ -424,7 +420,6 @@ export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTe
                 base: string;
                 md: string;
             };
-            fontSize: any;
             gap: string;
             letterSpacing: string;
             lineHeight: number;
@@ -489,7 +484,7 @@ export declare const baseStyle: ({ columnHeadersBackgroundColor, columnHeadersTe
     };
 };
 declare const CustomTable: {
-    baseStyle?: ({ columnHeadersBackgroundColor, columnHeadersTextColor, tableTextSize, isScrollable, showRowDividers, useRowHeaders, }: BaseStyleProps) => {
+    baseStyle?: ({ columnHeadersBackgroundColor, columnHeadersTextColor, isScrollable, showRowDividers, useRowHeaders, }: BaseStyleProps) => {
         base: {
             overflow: string;
             maxWidth: string;
@@ -522,7 +517,6 @@ declare const CustomTable: {
                     };
                     color: string;
                     fontWeight: string;
-                    fontSize: any;
                     textTransform: string;
                     verticalAlign: string;
                     _dark: {
@@ -539,6 +533,7 @@ declare const CustomTable: {
                     md: "table-header-group";
                 };
                 th: {
+                    fontSize: string;
                     _first: {
                         backgroundColor: string;
                         _dark: {
@@ -666,7 +661,6 @@ declare const CustomTable: {
                     base: string;
                     md: string;
                 };
-                fontSize: any;
                 gap: string;
                 letterSpacing: string;
                 lineHeight: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nypl/design-system-react-components",
-  "version": "4.0.0-alpha-rc",
+  "version": "4.0.0-alpha-rc2",
   "description": "NYPL Reservoir Design System React Components",
   "repository": {
     "type": "git",