@nypl/design-system-react-components 1.5.4 → 1.6.0-vite-rc-2

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

@@ -0,0 +1,163 @@
+/// <reference types="react" />
+declare const _default: {
+    accessibilityFull: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    accessibilityPartial: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionCheckCircle: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionCheckCircleFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionExit: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionHelpDefault: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionHelpOutline: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionLaunch: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionPower: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionRegistration: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    actionSettings: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    alertNotificationImportant: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    alertWarningFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    alertWarningOutline: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    arrow: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    building: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    check: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    clock: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    close: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    decorativeEnvelope: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    decorativeLibraryCard: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    decorativeShoppingBag: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    download: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    errorFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    errorOutline: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeAudio: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeDoc: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeGenericDoc: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeImage: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypePdf: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeSpreadsheet: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    fileTypeVideo: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    headset: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacyAccountFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacyAccountUnfilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacySocialFacebook: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacySocialInstagram: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacySocialTwitter: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    legacySocialYoutube: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    locator: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    minus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    plus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    search: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    socialFacebook: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    socialInstagram: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    socialTumblr: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    socialTwitter: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    socialYoutube: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    speakerNotes: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    utilityAccountFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    utilityAccountUnfilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    utilityHamburger: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    utilitySearch: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+};
+export default _default;

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

@@ -0,0 +1,6 @@
+export declare const iconAlignArray: readonly ["left", "right", "none"];
+export declare const iconColorsArray: readonly ["ui.black", "ui.white", "brand.primary", "brand.secondary", "ui.error.primary", "ui.error.secondary", "ui.status.primary", "ui.status.secondary", "ui.success.primary", "ui.success.secondary", "ui.warning.primary", "ui.warning.secondary", "section.blogs.primary", "section.blogs.secondary", "section.books-and-more.primary", "section.books-and-more.secondary", "section.education.primary", "section.education.secondary", "section.locations.primary", "section.locations.secondary", "section.research.primary", "section.research.secondary", "section.research-library.lpa", "section.research-library.schomburg", "section.research-library.schwartzman", "section.whats-on.primary", "section.whats-on.secondary", "dark.ui.error.primary", "dark.ui.error.secondary", "dark.ui.status.primary", "dark.ui.status.secondary", "dark.ui.success.primary", "dark.ui.success.secondary", "dark.ui.warning.primary", "dark.ui.warning.secondary"];
+export declare const iconNamesArray: readonly ["accessibilityFull", "accessibilityPartial", "actionCheckCircle", "actionCheckCircleFilled", "actionExit", "actionHelpDefault", "actionHelpOutline", "actionLaunch", "actionPower", "actionRegistration", "actionSettings", "alertNotificationImportant", "alertWarningFilled", "alertWarningOutline", "arrow", "building", "check", "clock", "close", "decorativeEnvelope", "decorativeLibraryCard", "decorativeShoppingBag", "download", "errorFilled", "errorOutline", "fileTypeAudio", "fileTypeDoc", "fileTypeGenericDoc", "fileTypeImage", "fileTypePdf", "fileTypeSpreadsheet", "fileTypeVideo", "headset", "legacyAccountFilled", "legacyAccountUnfilled", "legacySocialFacebook", "legacySocialInstagram", "legacySocialTwitter", "legacySocialYoutube", "locator", "minus", "plus", "search", "socialFacebook", "socialInstagram", "socialTumblr", "socialTwitter", "socialYoutube", "speakerNotes", "utilityAccountFilled", "utilityAccountUnfilled", "utilityHamburger", "utilitySearch"];
+export declare const iconRotationTypesArray: readonly ["rotate0", "rotate90", "rotate180", "rotate270"];
+export declare const iconSizesArray: readonly ["default", "xsmall", "small", "medium", "large", "xlarge", "xxlarge", "xxxlarge"];
+export declare const iconTypesArray: readonly ["default", "breadcrumbs"];

package/dist/{components → src/components}/Image/Image.d.ts

@@ -1,65 +1,68 @@
-import React, { ImgHTMLAttributes } from "react";
-export declare type ImageRatios = "fourByThree" | "oneByTwo" | "original" | "sixteenByNine" | "square" | "threeByFour" | "threeByTwo" | "twoByOne";
-export declare type ImageSizes = "default" | "xxsmall" | "xsmall" | "small" | "medium" | "large";
-export declare type ImageTypes = "default" | "circle";
-export interface ComponentImageProps extends Partial<HTMLImageElement> {
-    /** String value used to populate the `alt` attribute of the internal `Image`
-     * component's `img` element. @NOTE if an image is used, this value must be passed. */
-    alt?: string;
-    /** Optional value to control the aspect ratio of the internal `Image` component.
-     * Defaults to `ImageRatios.Square`. */
-    aspectRatio?: ImageRatios;
-    /** Optional value to render as a caption for the internal `Image` component. */
-    caption?: string;
-    /** Optional DOM element to use instead of the DS `Image` component. */
-    component?: JSX.Element;
-    /** Optional value to render as a credit for the internal `Image` component. */
-    credit?: string;
-    /** Flag to set the internal `Image` component to `isLazy` mode. */
-    isLazy?: boolean;
-    /** Optional value to control the size of the internal `Image` component.
-     * Defaults to `ImageSizes.Default`. */
-    size?: ImageSizes;
-    /** Optional value that contains the path to an image. If omitted, the internal
-     * DS `Image` component will not render. */
-    src?: string;
-}
-interface ImageWrapperProps {
-    /** Optionally pass in additional Chakra-based styles. */
-    additionalWrapperStyles?: {
-        [key: string]: any;
-    };
-    /** ClassName you can add in addition to 'image' */
-    className?: string;
-    /** Optional value to control the aspect ratio of the card image; default
-     * value is `"original"` */
-    aspectRatio?: ImageRatios;
-    /** Optional value to control the size of the image */
-    size?: ImageSizes;
-}
-export interface ImageProps extends ImageWrapperProps, ImgHTMLAttributes<HTMLImageElement> {
-    /** Optionally pass in additional Chakra-based styles only for the figure. */
-    additionalFigureStyles?: {
-        [key: string]: any;
-    };
-    /** Optionally pass in additional Chakra-based styles only for the image. */
-    additionalImageStyles?: {
-        [key: string]: any;
-    };
-    /** Alternate text description of the image */
-    alt?: string;
-    /** Adding will wrap the image in a <figure> */
-    caption?: string;
-    /** Custom image component */
-    component?: JSX.Element | null;
-    /** Adding will wrap the image in a <figure> */
-    credit?: string;
-    /** Optional value for the image type */
-    imageType?: ImageTypes;
-    /** Flag to set the internal `Image` component to `isLazy` mode. */
-    isLazy?: boolean;
-    /** The src attribute is required, and contains the path to the image you want to embed. */
-    src?: string;
-}
-export declare const Image: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLDivElement>>, {}>;
-export default Image;
+import React, { ImgHTMLAttributes } from "react";
+export declare const imageRatiosArray: readonly ["fourByThree", "oneByTwo", "original", "sixteenByNine", "square", "threeByFour", "threeByTwo", "twoByOne"];
+export declare const imageSizesArray: readonly ["default", "xxsmall", "xsmall", "small", "medium", "large"];
+export declare const imageTypesArray: readonly ["default", "circle"];
+export type ImageRatios = typeof imageRatiosArray[number];
+export type ImageSizes = typeof imageSizesArray[number];
+export type ImageTypes = typeof imageTypesArray[number];
+export interface ComponentImageProps extends Partial<HTMLImageElement> {
+    /** String value used to populate the `alt` attribute of the internal `Image`
+     * component's `img` element. @NOTE if an image is used, this value must be passed. */
+    alt?: string;
+    /** Optional value to control the aspect ratio of the internal `Image` component.
+     * Defaults to `ImageRatios.Square`. */
+    aspectRatio?: ImageRatios;
+    /** Optional value to render as a caption for the internal `Image` component. */
+    caption?: string;
+    /** Optional DOM element to use instead of the DS `Image` component. */
+    component?: JSX.Element;
+    /** Optional value to render as a credit for the internal `Image` component. */
+    credit?: string;
+    /** Flag to set the internal `Image` component to `isLazy` mode. */
+    isLazy?: boolean;
+    /** Optional value to control the size of the internal `Image` component.
+     * Defaults to `ImageSizes.Default`. */
+    size?: ImageSizes;
+    /** Optional value that contains the path to an image. If omitted, the internal
+     * DS `Image` component will not render. */
+    src?: string;
+}
+interface ImageWrapperProps {
+    /** Optionally pass in additional Chakra-based styles. */
+    additionalWrapperStyles?: {
+        [key: string]: any;
+    };
+    /** ClassName you can add in addition to 'image' */
+    className?: string;
+    /** Optional value to control the aspect ratio of the card image; default
+     * value is `"original"` */
+    aspectRatio?: ImageRatios;
+    /** Optional value to control the size of the image */
+    size?: ImageSizes;
+}
+export interface ImageProps extends ImageWrapperProps, ImgHTMLAttributes<HTMLImageElement> {
+    /** Optionally pass in additional Chakra-based styles only for the figure. */
+    additionalFigureStyles?: {
+        [key: string]: any;
+    };
+    /** Optionally pass in additional Chakra-based styles only for the image. */
+    additionalImageStyles?: {
+        [key: string]: any;
+    };
+    /** Alternate text description of the image */
+    alt?: string;
+    /** Adding will wrap the image in a <figure> */
+    caption?: string;
+    /** Custom image component */
+    component?: JSX.Element | null;
+    /** Adding will wrap the image in a <figure> */
+    credit?: string;
+    /** Optional value for the image type */
+    imageType?: ImageTypes;
+    /** Flag to set the internal `Image` component to `isLazy` mode. */
+    isLazy?: boolean;
+    /** The src attribute is required, and contains the path to the image you want to embed. */
+    src?: string;
+}
+export declare const Image: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<ImageProps & React.RefAttributes<HTMLDivElement>>, {}>;
+export default Image;

package/dist/{components → src/components}/Label/Label.d.ts

@@ -1,25 +1,25 @@
-import React from "react";
-interface LabelProps {
-    /** Additional CSS class name to render in the `label` element. */
-    className?: string;
-    /** The id of the html element that this `Label` is describing. */
-    htmlFor: string;
-    /** ID that other components can cross reference for accessibility purposes */
-    id?: string;
-    /** Controls whether the label should be inline with the input it goes with.
-     * This prop should only be used internally. */
-    isInlined?: boolean;
-    /** Controls whether the "(Required)" text should be displayed alongside the
-     * label's text. False by default. */
-    isRequired?: boolean;
-    /** Allows the '(Required)' text to be changed for language purposes
-     * Note: Parenthesis will be added automatically by the component */
-    requiredLabelText?: string;
-}
-/**
- * A label for form inputs. It should never be used alone.
- */
-export declare const Label: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LabelProps & {
-    children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement & HTMLLabelElement>>, {}>;
-export default Label;
+import React from "react";
+interface LabelProps {
+    /** Additional CSS class name to render in the `label` element. */
+    className?: string;
+    /** The id of the html element that this `Label` is describing. */
+    htmlFor: string;
+    /** ID that other components can cross reference for accessibility purposes */
+    id?: string;
+    /** Controls whether the label should be inline with the input it goes with.
+     * This prop should only be used internally. */
+    isInlined?: boolean;
+    /** Controls whether the "(Required)" text should be displayed alongside the
+     * label's text. False by default. */
+    isRequired?: boolean;
+    /** Allows the '(Required)' text to be changed for language purposes
+     * Note: Parenthesis will be added automatically by the component */
+    requiredLabelText?: string;
+}
+/**
+ * A label for form inputs. It should never be used alone.
+ */
+export declare const Label: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LabelProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement & HTMLLabelElement>>, {}>;
+export default Label;

package/dist/{components → src/components}/Link/Link.d.ts

@@ -1,21 +1,22 @@
-import React from "react";
-export declare type LinkTypes = "action" | "backwards" | "button" | "buttonPrimary" | "buttonSecondary" | "buttonPill" | "buttonCallout" | "buttonNoBrand" | "buttonDisabled" | "default" | "external" | "forwards";
-export interface LinkProps {
-    /** Any child node passed to the component. */
-    children: React.ReactNode;
-    /** Additional class name to render in the `Link` component. */
-    className?: string;
-    /** The `href` attribute for the anchor element. */
-    href?: string;
-    /** ID used for accessibility purposes. */
-    id?: string;
-    onClick?: (event: React.MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>) => void;
-    /** Controls the link visuals: action, button, backwards, forwards, or default. */
-    type?: LinkTypes;
-}
-/**
- * A component that uses an `href` prop or a child anchor element, to create
- * an anchor element with added styling and conventions.
- */
-export declare const Link: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLDivElement & HTMLAnchorElement>>, {}>;
-export default Link;
+import React from "react";
+export declare const linkTypesArray: readonly ["action", "backwards", "button", "buttonPrimary", "buttonSecondary", "buttonPill", "buttonCallout", "buttonNoBrand", "buttonDisabled", "default", "external", "forwards"];
+export type LinkTypes = typeof linkTypesArray[number];
+export interface LinkProps {
+    /** Any child node passed to the component. */
+    children: React.ReactNode;
+    /** Additional class name to render in the `Link` component. */
+    className?: string;
+    /** The `href` attribute for the anchor element. */
+    href?: string;
+    /** ID used for accessibility purposes. */
+    id?: string;
+    onClick?: (event: React.MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>) => void;
+    /** Controls the link visuals: action, button, backwards, forwards, or default. */
+    type?: LinkTypes;
+}
+/**
+ * A component that uses an `href` prop or a child anchor element, to create
+ * an anchor element with added styling and conventions.
+ */
+export declare const Link: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLDivElement & HTMLAnchorElement>>, {}>;
+export default Link;

package/dist/{components → src/components}/List/List.d.ts

@@ -1,42 +1,42 @@
-import React from "react";
-export declare type ListTypes = "ol" | "ul" | "dl";
-interface DescriptionProps {
-    term: string;
-    description: string | JSX.Element;
-}
-export interface ListProps {
-    /** ClassName you can add in addition to 'list' */
-    className?: string;
-    /** ID that other components can cross reference for accessibility purposes */
-    id?: string;
-    /** Display the list in a row. */
-    inline?: boolean;
-    /** Data to render if children are not passed. For `listTypes` ordered `"ol"`
-     * and unordered `"ul"` `List` types, the data structure is an array of strings
-     * to renders as `li` items. For description `"dl"` `List` types, the data
-     * structure is an array of objects with `term` and `description` properties
-     * to render `dt` and `dd` elements, respectively.
-     */
-    listItems?: (string | JSX.Element | DescriptionProps)[];
-    /** Remove list styling. */
-    noStyling?: boolean;
-    /** An optional title that will appear over the list. This prop only applies
-     * to Description Lists. */
-    title?: string;
-    /** The type of list: "ol", "ul", or "dl". "ul" by default. */
-    type: ListTypes;
-}
-/**
- * A component that renders list item `li` elements or description item `dt`
- * and `dd` elements based on the `type` prop. Note that the `title` prop will
- * only display for the `Description` list type.
- */
-export declare const List: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<ListProps & {
-    children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement & HTMLUListElement & HTMLOListElement>>, {}>;
-/**
- * Checks for `li` elements and consoles a warning if the
- * children are different HTML elements.
- */
-export declare const checkListChildrenError: (children: React.ReactNode, listType?: string, componentName?: string) => void;
-export default List;
+import React from "react";
+export type ListTypes = "ol" | "ul" | "dl";
+interface DescriptionProps {
+    term: string;
+    description: string | JSX.Element;
+}
+export interface ListProps {
+    /** ClassName you can add in addition to 'list' */
+    className?: string;
+    /** ID that other components can cross reference for accessibility purposes */
+    id?: string;
+    /** Display the list in a row. */
+    inline?: boolean;
+    /** Data to render if children are not passed. For `listTypes` ordered `"ol"`
+     * and unordered `"ul"` `List` types, the data structure is an array of strings
+     * to renders as `li` items. For description `"dl"` `List` types, the data
+     * structure is an array of objects with `term` and `description` properties
+     * to render `dt` and `dd` elements, respectively.
+     */
+    listItems?: (string | JSX.Element | DescriptionProps)[];
+    /** Remove list styling. */
+    noStyling?: boolean;
+    /** An optional title that will appear over the list. This prop only applies
+     * to Description Lists. */
+    title?: string;
+    /** The type of list: "ol", "ul", or "dl". "ul" by default. */
+    type: ListTypes;
+}
+/**
+ * A component that renders list item `li` elements or description item `dt`
+ * and `dd` elements based on the `type` prop. Note that the `title` prop will
+ * only display for the `Description` list type.
+ */
+export declare const List: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<ListProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement & HTMLUListElement & HTMLOListElement>>, {}>;
+/**
+ * Checks for `li` elements and consoles a warning if the
+ * children are different HTML elements.
+ */
+export declare const checkListChildrenError: (children: React.ReactNode, listType?: string, componentName?: string) => void;
+export default List;

package/dist/{components → src/components}/Logo/Logo.d.ts

@@ -1,28 +1,28 @@
-import React from "react";
-export declare type LogoNames = "appleAppStoreBlack" | "appleAppStoreWhite" | "bplBlack" | "bplWhite" | "cleverBadgeColor" | "cleverColor" | "cleverWhite" | "digitalCollectionsBlack" | "digitalCollectionsWhite" | "firstbookColor" | "firstbookColorNegative" | "googlePlayBlack" | "lpaBlack" | "lpaColor" | "lpaWhite" | "mlnBlack" | "mlnColor" | "mlnWhite" | "nycdoeBlack" | "nycdoeColor" | "nycdoeWhite" | "nyplFullBlack" | "nyplFullWhite" | "nyplLionBlack" | "nyplLionWhite" | "nyplTextBlack" | "nyplTextWhite" | "openebooksColor" | "openebooksNegative" | "openebooksWithTextColor" | "openebooksWithTextNegative" | "qplAltBlack" | "qplAltWhite" | "qplBlack" | "qplColor" | "qplWhite" | "reservoirIconColor" | "reservoirVerticalColor" | "schomburgBlack" | "schomburgCircleBlack" | "schomburgCircleColor" | "schomburgCircleWhite" | "schomburgColor" | "schomburgWhite" | "simplyeBlack" | "simplyeWhite" | "simplyeColor" | "snflBlack" | "snflWhite" | "treasuresColor" | "treasuresColorNegative";
-export declare type LogoSizes = "default" | "xxsmall" | "xsmall" | "small" | "medium" | "large";
-export interface LogoProps {
-    /** Optional className that will be added to the parent element */
-    className?: string;
-    /** Logos designated as decorative will be ignored by screenreaders. False
-     * by default. */
-    decorative?: boolean;
-    /** ID that other components can cross reference for accessibility purposes */
-    id?: string;
-    /** The name of the logo you want to use. */
-    name?: LogoNames;
-    /** Sets the logo size. */
-    size?: LogoSizes;
-    /** For accessibility purposes, the text passed in the `title` prop gets
-     * rendered in a `title` element in the SVG. This descriptive text is not
-     * visible but is needed for screenreaders to describe the graphic. */
-    title?: string;
-}
-/**
- * The `Logo` component renders SVG-based logos and color variants that are
- * commonly used by the New York Public Library.
- */
-export declare const Logo: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LogoProps & {
-    children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement & SVGSVGElement>>, {}>;
-export default Logo;
+import React from "react";
+export type LogoNames = "appleAppStoreBlack" | "appleAppStoreWhite" | "bplBlack" | "bplWhite" | "cleverBadgeColor" | "cleverColor" | "cleverWhite" | "digitalCollectionsBlack" | "digitalCollectionsWhite" | "firstbookColor" | "firstbookColorNegative" | "googlePlayBlack" | "lpaBlack" | "lpaColor" | "lpaWhite" | "mlnBlack" | "mlnColor" | "mlnWhite" | "nycdoeBlack" | "nycdoeColor" | "nycdoeWhite" | "nyplFullBlack" | "nyplFullWhite" | "nyplLionBlack" | "nyplLionWhite" | "nyplTextBlack" | "nyplTextWhite" | "openebooksColor" | "openebooksNegative" | "openebooksWithTextColor" | "openebooksWithTextNegative" | "qplAltBlack" | "qplAltWhite" | "qplBlack" | "qplColor" | "qplWhite" | "reservoirIconColor" | "reservoirVerticalColor" | "schomburgBlack" | "schomburgCircleBlack" | "schomburgCircleColor" | "schomburgCircleWhite" | "schomburgColor" | "schomburgWhite" | "simplyeBlack" | "simplyeWhite" | "simplyeColor" | "snflBlack" | "snflWhite" | "treasuresColor" | "treasuresColorNegative";
+export type LogoSizes = "default" | "xxsmall" | "xsmall" | "small" | "medium" | "large";
+export interface LogoProps {
+    /** Optional className that will be added to the parent element */
+    className?: string;
+    /** Logos designated as decorative will be ignored by screenreaders. False
+     * by default. */
+    decorative?: boolean;
+    /** ID that other components can cross reference for accessibility purposes */
+    id?: string;
+    /** The name of the logo you want to use. */
+    name?: LogoNames;
+    /** Sets the logo size. */
+    size?: LogoSizes;
+    /** For accessibility purposes, the text passed in the `title` prop gets
+     * rendered in a `title` element in the SVG. This descriptive text is not
+     * visible but is needed for screenreaders to describe the graphic. */
+    title?: string;
+}
+/**
+ * The `Logo` component renders SVG-based logos and color variants that are
+ * commonly used by the New York Public Library.
+ */
+export declare const Logo: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<LogoProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement & SVGSVGElement>>, {}>;
+export default Logo;