@nypl/design-system-react-components 3.6.1 → 4.0.0-remove-matchMedia-test

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

@@ -1,5 +1,5 @@
 import { ChakraComponent } from "@chakra-ui/react";
-import React from "react";
+import React, { ButtonHTMLAttributes } from "react";
 export type AccordionTypes = "default" | "warning" | "error";
 export interface AccordionDataProps {
     accordionType?: AccordionTypes;
@@ -9,12 +9,10 @@ export interface AccordionDataProps {
     label: string | JSX.Element;
     panel: string | React.ReactNode;
 }
-export interface AccordionProps {
+type HTMLButtonAttributes = Pick<ButtonHTMLAttributes<HTMLButtonElement>, "aria-label">;
+export interface AccordionProps extends HTMLButtonAttributes {
     /** Array of data to display, and an optional accordionType */
     accordionData: AccordionDataProps[];
-    /** Global aria-label value that is applied to all accordions if individual
-     * ariaLabel props are not included with accordionData entries. */
-    ariaLabel?: string;
     /** ID that other components can cross reference for accessibility purposes */
     id?: string;
     /** Whether the accordion is open by default only on its initial rendering */

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

@@ -7,8 +7,6 @@ export type BannerBgColors = typeof bannerBgColorsArray[number];
 export declare const bannerHighlightColorsArray: readonly ["brand.primary", "section.blogs.primary", "section.books-and-more.primary", "section.connect.primary", "section.education.primary", "section.locations.primary", "section.research.primary", "section.research-library-lpa.primary", "section.research-library-schomburg.primary", "section.research-library-schwarzman.primary", "section.whats-on.primary", "dark.brand.primary", "dark.section.blogs.primary", "dark.section.books-and-more.primary", "dark.section.connect.primary", "dark.section.education.primary", "dark.section.locations.primary", "dark.section.research.secondary", "dark.section.research-library-lpa.primary", "dark.section.research-library-schomburg.primary", "dark.section.research-library-schwarzman.primary", "dark.section.whats-on.primary"];
 export type BannerHighlightColors = typeof bannerHighlightColorsArray[number];
 export interface BannerProps {
-    /** Label used to describe the `Banner`'s aside HTML element. */
-    ariaLabel?: string;
     /** Used to set the color of the background for the full component.
      * Refer to how color values are defined and typed in the DS Icon component. */
     backgroundColor?: BannerBgColors;

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

@@ -2,7 +2,7 @@ import { ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 export declare const buttonElementTypeArray: readonly ["submit", "button", "reset"];
 export declare const buttonSizesArray: readonly ["small", "medium", "large"];
-export declare const buttonTypesArray: readonly ["primary", "secondary", "text", "callout", "pill", "noBrand", "link"];
+export declare const buttonTypesArray: readonly ["primary", "secondary", "text", "callout", "pill", "noBrand"];
 export type ButtonElementType = typeof buttonElementTypeArray[number];
 export type ButtonSizes = typeof buttonSizesArray[number];
 export type ButtonTypes = typeof buttonTypesArray[number];

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

@@ -1,7 +1,7 @@
 import { ChakraComponent, HeadingProps as ChakraHeadingProps } from "@chakra-ui/react";
 import React from "react";
-export declare const headingSizesArray: readonly ["display1", "heading1", "heading2", "heading3", "heading4", "heading5", "heading6", "heading7", "heading8", "primary", "secondary", "tertiary", "callout"];
-export declare const headingLevelsArray: readonly ["h1", "h2", "h3", "h4", "h5", "h6", "one", "two", "three", "four", "five", "six"];
+export declare const headingSizesArray: readonly ["display1", "heading1", "heading2", "heading3", "heading4", "heading5", "heading6", "heading7", "heading8"];
+export declare const headingLevelsArray: readonly ["h1", "h2", "h3", "h4", "h5", "h6"];
 export type HeadingSizes = typeof headingSizesArray[number];
 export type HeadingLevels = typeof headingLevelsArray[number];
 export interface HeadingProps extends ChakraHeadingProps {

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

@@ -1,19 +1,8 @@
 /// <reference types="react" />
 import { ChakraComponent } from "@chakra-ui/react";
-export type AriaLiveValues = "assertive" | "off" | "polite" | undefined;
 export type HelperErrorTextType = string | JSX.Element;
-export interface HelperErrorTextProps {
-    /** Aria attribute. When true, assistive technologies will read the entire
-     * DOM element. When false, only changes (additionals or removals) will be
-     * read. True by default. */
-    ariaAtomic?: boolean;
-    /** Aria attribute used to handle live updates for the helper and error text.
-     * This indicates the priority of the text and when it should be presented to
-     * users using screen readers; "off" indicates that the content should not be
-     * presented, "polite" that it will be announced at the next available time
-     * slot, and "assertive" that it should be announced immediately. This is set
-     * to "polite" by default. */
-    ariaLive?: AriaLiveValues;
+type HTMLDivAttributes = Pick<React.HTMLAttributes<HTMLDivElement>, "aria-atomic" | "aria-live">;
+export interface HelperErrorTextProps extends HTMLDivAttributes {
     /** Additional className to add. */
     className?: string;
     /** Unique ID for accessibility purposes. */

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

@@ -1,9 +1,8 @@
 import { ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 import { ComponentImageProps } from "../Image/Image";
-export declare const heroTypesArray: readonly ["primary", "secondary", "secondaryBooksAndMore", "secondaryLocations", "secondaryResearch", "secondaryWhatsOn", "tertiary", "campaign", "fiftyFifty"];
+export declare const heroTypesArray: readonly ["primary", "tertiary", "campaign"];
 export type HeroTypes = typeof heroTypesArray[number];
-export declare const heroSecondaryTypes: string[];
 export interface HeroImageProps extends Pick<ComponentImageProps, "alt" | "fallbackSrc" | "id" | "src" | "onError" | "component"> {
 }
 export interface HeroProps {
@@ -32,10 +31,10 @@ export interface HeroProps {
     /** 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`
-     * (with its own internal props, which will override) or `src`, `alt`, `id`, `fallBackSrc`, and `onError`.
-     * If `imageProps.alt` is left blank, a warning will be logged to the console and
-     * will cause accessibility issues. For `imageProps.src`, it will only work for
-     * the "secondary", "fiftyFifty" and "campaign" `Hero` types. */
+     * (with its own internal props, which will override) or `src`, `alt`, `id`,
+     * `fallBackSrc`, and `onError`. If `imageProps.alt` is left blank, a warning
+     * will be logged to the console and will cause accessibility issues. For
+     * `imageProps.src`, it will only work for the "campaign" `Hero` type. */
     imageProps?: HeroImageProps;
     /** Optional boolean used to toggle the default text color from light to dark.
      * Set isDarkText to `true` if the backgroundColor is set to a light color. */
@@ -44,9 +43,6 @@ export interface HeroProps {
      * the "campaign" variant. If true, the background image will be converted to
      * black & white and darkened to 60% black. */
     isDarkBackgroundImage?: boolean;
-    /** Optional details area that contains location data.
-     * Note: not all `Hero` variations utilize this prop. */
-    locationDetails?: JSX.Element;
     /** Optional string used for the subheader that displays
      * underneath the heading element. */
     subHeaderText?: string | JSX.Element;

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

@@ -5,7 +5,6 @@ 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 IconRotationTypes = typeof iconRotationsArray[number];
 export type IconSizes = typeof iconSizesArray[number];
 export type IconTypes = typeof iconTypesArray[number];
 export interface IconProps {

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

@@ -1,6 +1,6 @@
 import { ChakraComponent, LinkProps as ChakraLinkProps } from "@chakra-ui/react";
 import React from "react";
-export declare const linkTypesArray: readonly ["action", "backwards", "button", "buttonPrimary", "buttonSecondary", "buttonPill", "buttonCallout", "buttonNoBrand", "buttonDisabled", "default", "external", "forwards", "standalone"];
+export declare const linkTypesArray: readonly ["action", "backwards", "buttonPrimary", "buttonSecondary", "buttonPill", "buttonCallout", "buttonNoBrand", "buttonDisabled", "default", "external", "forwards", "standalone"];
 export type LinkTypes = typeof linkTypesArray[number];
 export interface LinkProps extends ChakraLinkProps {
     /** Additional class name to render in the `Link` component. */
@@ -21,8 +21,8 @@ export interface LinkProps extends ChakraLinkProps {
     screenreaderOnlyText?: string;
     /** Prop that sets the HTML attribute to target where the link should go. */
     target?: "_blank" | "_parent" | "_self" | "_top";
-    /** Controls the link visuals: action, button, backwards, forwards,
-     * standalone, or default. */
+    /** Controls the link's styles based on the value: action, backwards, default,
+     * external, forwards, standalone, and all "button" types. */
     type?: LinkTypes;
 }
 /**

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

@@ -26,8 +26,6 @@ type NotificationHeadingProps = Omit<BasePropsWithoutAlignText, "showIcon">;
 type NotificationContentProps = Omit<BaseProps, "icon">;
 type BasePropsWithoutAlignText = Omit<BaseProps, "alignText">;
 export interface NotificationProps extends BasePropsWithoutAlignText {
-    /** Label used to describe the `Notification`'s aside HTML element. */
-    ariaLabel?: string;
     /** Additional `className` to add. */
     className?: string;
     /** Optional prop to control whether a `Notification` can be dismissed
@@ -35,8 +33,6 @@ export interface NotificationProps extends BasePropsWithoutAlignText {
     dismissible?: boolean;
     /** Optional custom `Icon` that will override the default `Icon`. */
     icon?: JSX.Element;
-    /** Optional prop to control the margin around the `Notification` component. */
-    noMargin?: boolean;
     /** Content to be rendered in a `NotificationContent` component. */
     notificationContent: string | JSX.Element;
 }

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

@@ -7,8 +7,6 @@ export type ProgressIndicatorSizes = typeof progressIndicatorSizesArray[number];
 export type ProgressIndicatorTypes = typeof progressIndicatorTypesArray[number];
 export type ProgressIndicatorLabelPlacements = typeof progressIndicatorLabelPlacementsArray[number];
 interface BaseProgressIndicatorProps {
-    /** The darkMode prop is deprecated and should no longer be used. */
-    darkMode?: boolean;
     /** ID that other components can cross reference for accessibility purposes. */
     id: string;
     /** Whether the `ProgressIndicator` should be linear or circular. */

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

@@ -1,18 +1,13 @@
 import { ChakraComponent } from "@chakra-ui/react";
 import React from "react";
 export declare const statusBadgeFontSizeArray: readonly ["desktop.body.body1", "desktop.body.body2", "desktop.caption"];
-export declare const statusBadgeLevelArray: readonly ["low", "medium", "high"];
-export type StatusBadgeLevels = typeof statusBadgeLevelArray[number];
-export declare const statusBadgeTypeArray: readonly ["informative", "negative", "neutral", "positive", "recommendation", "warning", "low", "medium", "high"];
+export declare const statusBadgeTypeArray: readonly ["informative", "negative", "neutral", "positive", "recommendation", "warning"];
 export type StatusBadgeTypes = typeof statusBadgeTypeArray[number];
 export interface StatusBadgeProps {
     /** Additional class for the component */
     className?: string;
     /** ID that other components can cross reference for accessibility purposes */
     id?: string;
-    /** Level of the status badge. This prop has been deprecated in favor of the
-     * `type` prop. */
-    level?: StatusBadgeLevels;
     /** Semantic type of the status badge. */
     type?: StatusBadgeTypes;
 }

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

@@ -1,6 +1,6 @@
 import { ChakraComponent } from "@chakra-ui/react";
 import React from "react";
-export declare const textSizesArray: readonly ["default", "body1", "body2", "caption", "tag", "mini"];
+export declare const textSizesArray: readonly ["default", "body1", "body2", "caption"];
 export type StyledListTextSizes = typeof textSizesArray[number];
 export interface StyledListProps {
     /** Any child node passed to the component. */

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

@@ -1,52 +1,18 @@
+/// <reference types="react" />
 import { ChakraComponent } from "@chakra-ui/react";
-import React from "react";
+export declare const sidebarPlacementArray: readonly ["none", "left", "right"];
+export type SidebarPlacement = typeof sidebarPlacementArray[number];
 export interface TemplateProps {
     /** ID that other components can cross reference for accessibility purposes. */
     id?: string;
+    /** Renders the `TemplateSidebar` component either on the left or
+     * right side of the `TemplateMain` component. */
+    sidebar?: SidebarPlacement;
 }
-export interface TemplateHeaderProps {
-    /** Flag to render an HTML header element. True by default. */
-    renderHeaderElement?: boolean;
-}
-export interface TemplateFooterProps {
-    /** Flag to render an HTML footer element. True by default. */
-    renderFooterElement?: boolean;
-}
-export interface TemplateSidebarProps {
-    /** Renders the `TemplateContentSidebar` component either on the left or
-     * right side of the `TemplateContentPrimary` component. */
-    sidebar?: "none" | "left" | "right";
-}
-export interface TemplateContentProps extends TemplateSidebarProps {
-    /** ID used for the `main` HTML element. Defaults to "mainContent". Useful
-     * anchor for the application skip navigation. */
-    id?: string;
-}
-export interface TemplateAppContainerProps extends TemplateFooterProps, TemplateHeaderProps, TemplateSidebarProps {
-    /** DOM that will be rendered before the rest of the components in
-     * `TemplateAppContainer` and immediately before the `TemplateHeader` component. */
-    aboveHeader?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateBreakout` component section. */
-    breakout?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateContentBottom` component section. */
-    contentBottom?: React.ReactElement;
+export interface TemplateMainProps {
     /** ID used for the `main` HTML element. Defaults to "mainContent". Useful
      * anchor for the application skip navigation. */
-    contentId?: string;
-    /** DOM that will be rendered in the `TemplateContentPrimary` component section. */
-    contentPrimary?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateContentSidebar` component section. */
-    contentSidebar?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateContentTop` component section. */
-    contentTop?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateFooter` component section. */
-    footer?: React.ReactElement;
-    /** DOM that will be rendered in the `TemplateHeader` component section. */
-    header?: React.ReactElement;
-    /** ID that other components can cross reference for accessibility purposes. */
     id?: string;
-    /** Render the `SkipNavigation` component or not. False by default. */
-    renderSkipNavigation?: boolean;
 }
 /**
  * The main top-level parent component that wraps all template-related
@@ -54,88 +20,43 @@ export interface TemplateAppContainerProps extends TemplateFooterProps, Template
  */
 declare const Template: ChakraComponent<React.ForwardRefExoticComponent<React.PropsWithChildren<TemplateProps> & React.RefAttributes<HTMLDivElement>>, React.PropsWithChildren<TemplateProps>>;
 /**
- * This optional component renders its children from edge-to-edge and should
- * be used for alerts or notifications that are typically site-wide. This must
- * be rendered immediately before the `TemplateHeader` component. This is meant
- * for components that render an `aside` HTML element or HTML element with the
- * `role="complementary"` attribute. These elements should *not* be rendered
- * in the `header` HTML section since that's an accessibility violation.
- */
-declare const TemplateAboveHeader: React.FC<any>;
-/**
- * This optional component should be the first child of the `Template`
- * component. This is rendered as an HTML `<header>` element. If an HTML
- * `<header>` element is already passed in a custom component as the children,
- * set `renderFooterElement` to `false`. Otherwise, the parent wrapper will
- * render an HTML `<header>` element.
- */
-declare const TemplateHeader: React.FC<any>;
-/**
- * This component should be used inside the `Template` component to contain both
- * the `TemplateAboveHeader` and `TemplateHeader` components. This is meant to
- * render its children from edge to edge and is most useful for the headers,
- * `Breadcrumbs`, and `Hero` components or other banner-like components.
- */
-declare const TemplateBreakout: React.FC<any>;
-/**
- * This component is most useful to render content on the page. This renders an
- * HTML `<main>` element with an id of "mainContent". The "mainContent" id should
- * be used as the consuming application's skip navigation link. The `TemplateContent`
- * component also takes a `sidebar` prop with optional "left" or "right" values.
- * This will set the correct *styling* needed for the `TemplateContentPrimary`
- * and `TemplateContentSidebar` components. Note that `TemplateContentPrimary`
- * and `TemplateContentSidebar` must be ordered correctly as children elements
- * for the appropriate styles to take effect.
- */
-declare const TemplateContent: React.FC<any>;
-/**
- * This optional component must be used inside the `TemplateContent` component.
- * This renders content in the main width of the container and will always render
- * above the primary component and the sidebar component (if any).
+ * This optional component renders its children above the main content
+ * and spans edge-to-edge. It is most useful for `Breadcrumbs`, `Hero`,
+ * or other banner-like components.
  */
-declare const TemplateContentTop: React.FC<any>;
+declare const TemplateBreakout: React.FC<React.PropsWithChildren>;
 /**
- * This optional component must be used inside the `TemplateContent` component
- * and after the `TemplateContentPrimary` or `TemplateContentSidebar` component.
- * This renders content in the main width of the container and should always
- * render below the primary component and the sidebar component (if any).
+ * This optional component renders content at a max width of 1280px and
+ * will render below `TemplateBreakout` (if being used) and above the
+ * main content and sidebar (if one exists).
  */
-declare const TemplateContentBottom: React.FC<any>;
+declare const TemplateTop: React.FC<React.PropsWithChildren>;
 /**
- * This component is used to render content in a column when there must be a
- * sidebar component on either its left or right side. It must go inside the
- * `TemplateContent` component. An optional `sidebar` prop value of "left" or
- * "right" can be passed to render the correct CSS styles. If the `sidebar`
- * prop is used in the `TemplateContent` component, there is no need to pass
- * the `sidebar` prop to this component -- `TemplateContent` will handle it.
+ * This component renders an HTML `<main>` element with an id of "mainContent".
+ * The "mainContent" id should be used as the consuming application's skip
+ * navigation link. The component should not be used in conjunction with
+ * `TemplateMainNarrow`.
  */
-declare const TemplateContentPrimary: React.FC<any>;
+declare const TemplateMain: React.FC<React.PropsWithChildren<TemplateMainProps>>;
 /**
- * This component is used to render content in a sidebar column. It must go
- * inside the `TemplateContent` component and must be paired with the
- * `TemplateContentPrimary` component. If this is a left sidebar, it needs to be
- * rendered before the `TemplateContentPrimary` component. If this is a right
- * sidebar, it needs to be rendered after the `TemplateContentPrimary` component.
- * An optional `sidebar` prop value of "left" or "right" can be passed to render
- * the correct CSS styles. If the `sidebar` prop is used in the `TemplateContent`
- * component, there is no need to pass the `sidebar` prop to this component --
- * `TemplateContent` will handle it.
+ * This component renders an HTML `<main>` element with an id of "mainContent".
+ * The "mainContent" id should be used as the consuming application's skip
+ * navigation link. It provides a narrower container for better readability if
+ * the main content includes long text. This component is meant to be used in
+ * lieu of `TemplateMain`, and should not be used in conjunction with
+ * `TemplateSidebar`.
  */
-declare const TemplateContentSidebar: React.FC<any>;
+declare const TemplateMainNarrow: React.FC<React.PropsWithChildren<TemplateMainProps>>;
 /**
- * This optional component should be the last child of the `Template`
- * component. This is rendered as an HTML `<footer>` element and spans the full
- * width of the page. If an HTML `<footer>` element is already passed in a
- * custom component, set `renderFooterElement` to `false`.
+ * This optional component is used to render content in a sidebar column.
+ * It must be paired with the `TemplateMain` component. An optional `sidebar`
+ * prop value of "left" or "right" must be passed to the `Template` wrapper
+ * to render the correct CSS styles.
  */
-declare const TemplateFooter: React.FC<any>;
+declare const TemplateSidebar: React.FC<React.PropsWithChildren>;
 /**
- * This single component can be used instead of all the individual template
- * components. Instead of importing and rendering the needed "template"
- * components, each section is passed as a prop to the section where it should
- * be rendered. For example, if you want to render content in the
- * `TemplateContentPrimary` section, then pass it as a prop to `contentPrimary`.
+ * This optional component renders content at a max width of 1280px and
+ * will always render below the main content and sidebar (if one exists).
  */
-export declare const TemplateAppContainer: ChakraComponent<React.ForwardRefExoticComponent<React.PropsWithChildren<TemplateAppContainerProps> & React.RefAttributes<HTMLDivElement>>, React.PropsWithChildren<TemplateAppContainerProps>>;
-export { Template, TemplateAboveHeader, TemplateBreakout, TemplateContent, TemplateContentBottom, TemplateContentPrimary, TemplateContentSidebar, TemplateContentTop, TemplateFooter, TemplateHeader, };
-export default TemplateAppContainer;
+declare const TemplateBottom: React.FC<React.PropsWithChildren>;
+export { Template, TemplateBreakout, TemplateTop, TemplateMain, TemplateMainNarrow, TemplateSidebar, TemplateBottom, };

package/dist/src/hooks/useNYPLBreakpoints.d.ts

@@ -6,8 +6,13 @@
 declare const useNYPLBreakpoints: () => {
     isLargerThanSmall: any;
     isLargerThanMedium: any;
-    isLargerThanMobile: any;
     isLargerThanLarge: any;
     isLargerThanXLarge: any;
+    isLargerThanSmallMobile: any;
+    isLargerThanLargeMobile: any;
+    isLargerThanSmallTablet: any;
+    isLargerThanLargeTablet: any;
+    isLargerThanMobile: any;
+    isLargerThanTablet: any;
 };
 export default useNYPLBreakpoints;

package/dist/src/hooks/useResponsiveSpacing.d.ts

@@ -0,0 +1,23 @@
+/**
+ * A custom hook This hook returns responsive gap and padding values that align
+ * with NYPL design standards for responsive grids and columns. The values will
+ * adjust based on the width of the viewport.
+ */
+declare function useResponsiveSpacing(): {
+    responsiveGap: {
+        base: string;
+        md: string;
+        xl: string;
+    };
+    responsiveMargin: {
+        base: string;
+        md: string;
+        xl: string;
+    };
+    responsivePadding: {
+        base: string;
+        md: string;
+        xl: string;
+    };
+};
+export default useResponsiveSpacing;

package/dist/src/index.d.ts

@@ -35,7 +35,6 @@ export { default as FilterBarPopup, useFilterBarPopup, } from "./components/Filt
 export type { FilterBarPopupProps } from "./components/FilterBarPopup/FilterBarPopup";
 export { default as Form, FormField, FormRow } from "./components/Form/Form";
 export type { FormProps } from "./components/Form/Form";
-export { default as Header } from "./components/Header/Header";
 export { default as Heading } from "./components/Heading/Heading";
 export type { HeadingLevels, HeadingProps, HeadingSizes, } from "./components/Heading/Heading";
 export { default as HelperErrorText } from "./components/HelperErrorText/HelperErrorText";
@@ -45,7 +44,7 @@ export type { HeroProps, HeroTypes } 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, IconRotationTypes, IconSizes, IconTypes, IconProps, } from "./components/Icons/Icon";
+export type { IconAlign, IconColors, IconNames, IconRotations, IconSizes, IconTypes, 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";
@@ -93,7 +92,7 @@ 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 { StatusBadgeLevels, StatusBadgeProps, StatusBadgeTypes, } from "./components/StatusBadge/StatusBadge";
+export type { StatusBadgeProps, StatusBadgeTypes, } 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";
@@ -107,8 +106,7 @@ export { default as TagSet } from "./components/TagSet/TagSet";
 export type { TagSetProps, TagSetTypeProps } from "./components/TagSet/TagSet";
 export type { TagSetExploreDataProps, TagSetExploreProps, } from "./components/TagSet/TagSetExplore";
 export type { TagSetFilterDataProps, TagSetFilterProps, } from "./components/TagSet/TagSetFilter";
-export { TemplateAppContainer, Template, TemplateAboveHeader, TemplateHeader, TemplateBreakout, TemplateContent, TemplateContentTop, TemplateContentPrimary, TemplateContentSidebar, TemplateFooter, } from "./components/Template/Template";
-export type { TemplateAppContainerProps, TemplateProps, TemplateContentProps, TemplateFooterProps, TemplateHeaderProps, TemplateSidebarProps, } from "./components/Template/Template";
+export { Template, TemplateBreakout, TemplateTop, TemplateMain, TemplateMainNarrow, TemplateSidebar, TemplateBottom, } from "./components/Template/Template";
 export { default as Text } from "./components/Text/Text";
 export type { TextProps, TextSizes } from "./components/Text/Text";
 export { default as TextInput } from "./components/TextInput/TextInput";
@@ -121,10 +119,11 @@ export { default as VideoPlayer } from "./components/VideoPlayer/VideoPlayer";
 export type { VideoPlayerAspectRatios, VideoPlayerProps, VideoPlayerTypes, } from "./components/VideoPlayer/VideoPlayer";
 export { default as useCarouselStyles } from "./hooks/useCarouselStyles";
 export { default as useCloseDropDown } from "./hooks/useCloseDropDown";
+export { default as useFormatNumber } from "./hooks/useFormatNumber";
 export { default as useMultiSelect } from "./hooks/useMultiSelect";
 export { default as useNYPLBreakpoints } from "./hooks/useNYPLBreakpoints";
 export { default as useNYPLTheme } from "./hooks/useNYPLTheme";
-export { default as useWindowSize } from "./hooks/useWindowSize";
+export { default as useResponsiveSpacing } from "./hooks/useResponsiveSpacing";
 export { default as useScrollFadeStyles } from "./hooks/useScrollFadeStyles";
-export { default as useFormatNumber } from "./hooks/useFormatNumber";
+export { default as useWindowSize } from "./hooks/useWindowSize";
 export type { AutoCompleteValues } from "./utils/constantValues";

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

@@ -178,9 +178,6 @@ declare const Button: {
         text: ({ buttonSize }: any) => {
             base: any;
         };
-        link: ({ buttonSize }: any) => {
-            base: any;
-        };
         pill: ({ buttonSize }: any) => {
             base: any;
         };
@@ -196,7 +193,7 @@ declare const Button: {
     };
     defaultProps?: {
         size?: string | number;
-        variant?: "link" | "text" | "primary" | "secondary" | "callout" | "pill" | "iconOnly" | "noBrand";
+        variant?: "text" | "primary" | "secondary" | "pill" | "iconOnly" | "callout" | "noBrand";
         colorScheme?: string;
     };
     parts: ("base" | "screenreaderOnly")[];