@nypl/design-system-react-components 2.0.0-rc2 → 2.0.0-rc4

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

@@ -135,6 +135,9 @@ declare const _default: {
     minus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    moonCrescent: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
     plus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
@@ -174,6 +177,9 @@ declare const _default: {
     speakerNotes: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    sunFull: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
     utilityAccountFilled: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;

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

@@ -1,6 +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", "actionIdentity", "actionIdentityFilled", "actionLaunch", "actionPower", "actionRegistration", "actionSearch", "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", "mapsPlace", "minus", "plus", "search", "socialFacebook", "socialInstagram", "socialPinterest", "socialSoundCloud", "socialSpotify", "socialTikTok", "socialTumblr", "socialTwitter", "socialVimeo", "socialYoutube", "speakerNotes", "utilityAccountFilled", "utilityAccountUnfilled", "utilityHamburger", "utilitySearch"];
+export declare const iconNamesArray: readonly ["accessibilityFull", "accessibilityPartial", "actionCheckCircle", "actionCheckCircleFilled", "actionExit", "actionHelpDefault", "actionHelpOutline", "actionIdentity", "actionIdentityFilled", "actionLaunch", "actionPower", "actionRegistration", "actionSearch", "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", "mapsPlace", "minus", "moonCrescent", "plus", "search", "socialFacebook", "socialInstagram", "socialPinterest", "socialSoundCloud", "socialSpotify", "socialTikTok", "socialTumblr", "socialTwitter", "socialVimeo", "socialYoutube", "speakerNotes", "sunFull", "utilityAccountFilled", "utilityAccountUnfilled", "utilityHamburger", "utilitySearch"];
 export declare const iconRotationsArray: 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/src/components/Link/Link.d.ts

@@ -15,6 +15,7 @@ export interface LinkProps {
      * underline in hover state. */
     isUnderlined?: boolean;
     onClick?: (event: React.MouseEvent<HTMLDivElement | HTMLAnchorElement, MouseEvent>) => void;
+    rel?: string;
     /** Visibly hidden text that will only be read by screenreaders. */
     screenreaderOnlyText?: string;
     /** Prop that sets the HTML attribute to target where the link should go. */

package/dist/src/components/Logo/LogoSvgs.d.ts

@@ -63,6 +63,15 @@ declare const _default: {
     nycdoeWhite: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;
+    nycpsBlack: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    nycpsColor: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
+    nycpsWhite: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
+        title?: string;
+    }>;
     nyplFullBlack: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
         title?: string;
     }>;

package/dist/src/components/Logo/logoVariables.d.ts

@@ -1,2 +1,2 @@
-export declare const logoNamesArray: readonly ["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 const logoNamesArray: readonly ["appleAppStoreBlack", "appleAppStoreWhite", "bplBlack", "bplWhite", "cleverBadgeColor", "cleverColor", "cleverWhite", "digitalCollectionsBlack", "digitalCollectionsWhite", "firstbookColor", "firstbookColorNegative", "googlePlayBlack", "lpaBlack", "lpaColor", "lpaWhite", "mlnBlack", "mlnColor", "mlnWhite", "nycdoeBlack", "nycdoeColor", "nycdoeWhite", "nycpsBlack", "nycpsColor", "nycpsWhite", "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 const logoSizesArray: readonly ["default", "xxsmall", "xsmall", "small", "medium", "large"];

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

@@ -0,0 +1,42 @@
+import { LayoutTypes } from "../../helpers/types";
+import React from "react";
+export declare const borderTypeArray: readonly ["none", "circular", "straight"];
+export type BorderType = typeof borderTypeArray[number];
+export declare const colorTypeArray: readonly ["link", "textDefault", "textInverse"];
+export type ColorType = typeof colorTypeArray[number];
+export declare const sizeTypeArray: readonly ["small", "medium", "large"];
+export type SizeType = typeof sizeTypeArray[number];
+export declare const socialMediaLinkTypeArray: string[];
+export type SocialMediaLinkType = typeof socialMediaLinkTypeArray[number];
+export interface SocialMediaLinkDataProps {
+    /** Optional override for default platform name */
+    labelText?: string;
+    /** Required. Must be one of socialMediaLinkTypeArray */
+    type: SocialMediaLinkType;
+    /** Optional override for default social media url */
+    url?: string;
+}
+export interface SocialMediaLinksProps {
+    /** Optional border: straight, circular or none. */
+    borders?: BorderType;
+    /** Optional className you can add in addition to "social-media-links." */
+    className?: string;
+    /** Any of three optional values that will change the color of the svg and label text (if any). */
+    color?: ColorType;
+    /** ID that other components can cross-reference for accessibility purposes. */
+    id?: string;
+    /** Optional desktop layout. Smaller viewports are always in a column. */
+    layout?: LayoutTypes;
+    /** Optional array of social media platform types, urls, and label texts. */
+    linksData?: SocialMediaLinkDataProps[];
+    /** Optional true/false to display names of platforms along with icons.
+     *  NOTE: Labels will NOT be shown with a circular border */
+    showLabels?: boolean;
+    /** Optional size: small, medium, or large. */
+    size?: SizeType;
+}
+/**
+ * The SocialMediaLinks component renders a list of links for accessing social media sites.
+ */
+export declare const SocialMediaLinks: import("@chakra-ui/react").ChakraComponent<React.ForwardRefExoticComponent<SocialMediaLinksProps & React.RefAttributes<HTMLDivElement & HTMLUListElement & HTMLOListElement>>, {}>;
+export default SocialMediaLinks;

package/dist/src/components/SocialMediaLinks/SocialMediaLinksUtils.d.ts

@@ -0,0 +1,7 @@
+export declare const socialMediaDataMap: {
+    type: string;
+    iconName: string;
+    labelText: string;
+    url: string;
+}[];
+export declare function GetTableData(): any[];

package/dist/src/index.d.ts

@@ -28,7 +28,7 @@ export { default as Hero } from "./components/Hero/Hero";
 export type { HeroTypes } from "./components/Hero/Hero";
 export { default as HorizontalRule } from "./components/HorizontalRule/HorizontalRule";
 export { default as Icon } from "./components/Icons/Icon";
-export type { IconAlign, IconColors, IconNames, IconRotations, IconSizes, IconTypes, } from "./components/Icons/Icon";
+export type { IconAlign, IconColors, IconNames, IconRotationTypes, IconRotations, IconSizes, IconTypes, } from "./components/Icons/Icon";
 export { default as Image } from "./components/Image/Image";
 export type { ImageRatios, ImageSizes, ImageTypes, } from "./components/Image/Image";
 export { default as Label } from "./components/Label/Label";
@@ -60,6 +60,7 @@ export { default as SkeletonLoader } from "./components/SkeletonLoader/SkeletonL
 export type { SkeletonLoaderImageRatios } from "./components/SkeletonLoader/SkeletonLoader";
 export { default as SkipNavigation } from "./components/SkipNavigation/SkipNavigation";
 export { default as Slider } from "./components/Slider/Slider";
+export { default as SocialMediaLinks } from "./components/SocialMediaLinks/SocialMediaLinks";
 export { default as StatusBadge } from "./components/StatusBadge/StatusBadge";
 export type { StatusBadgeTypes } from "./components/StatusBadge/StatusBadge";
 export { default as StructuredContent } from "./components/StructuredContent/StructuredContent";

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

@@ -0,0 +1,192 @@
+import { StyleFunctionProps } from "@chakra-ui/theme-tools";
+declare const SocialMediaLinks: {
+    baseStyle: {
+        display: string;
+        alignItems: string;
+        gap: string;
+        width: {
+            base: string;
+            md: string;
+        };
+        marginBottom: string;
+        li: {
+            marginInlineEnd: string;
+            marginTop: string;
+            width: {
+                base: string;
+                md: string;
+            };
+            _notFirst: {
+                marginTop: string;
+            };
+        };
+        a: {
+            display: string;
+            justifyContent: string;
+            alignContent: string;
+            flexWrap: string;
+            minWidth: {
+                base: string;
+                md: string;
+            };
+            minHeight: {
+                base: string;
+                md: string;
+            };
+            fontStyle: string;
+            fontSize: string;
+            textDecoration: string;
+            color: string;
+            _hover: {
+                color: string;
+            };
+            _visited: {
+                color: string;
+            };
+            _dark: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+            };
+        };
+        div: {
+            display: string;
+            alignItems: string;
+            gap: string;
+            alignSelf: string;
+            justifyContent: string;
+            width: string;
+            height: string;
+        };
+        svg: {
+            fill: string;
+            _dark: {
+                fill: string;
+            };
+        };
+    };
+    variants: {
+        straight(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            gap: string;
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    borderColor: string;
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            div: {
+                padding: string;
+                borderRadius: string;
+                borderWidth: string;
+                borderStyle: string;
+                borderColor: string;
+                _dark: {
+                    borderColor: string;
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                    borderColor: string;
+                };
+            };
+        };
+        circular(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            gap: string;
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            div: {
+                padding: string;
+                borderRadius: string;
+                borderColor: string;
+                borderWidth: string;
+                borderStyle: string;
+                _dark: {
+                    borderColor: string;
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                };
+            };
+        };
+        none(props: StyleFunctionProps): {
+            flexDirection: {
+                base: string;
+                md: any;
+            };
+            a: {
+                color: string;
+                _hover: {
+                    color: string;
+                };
+                _visited: {
+                    color: string;
+                };
+                _dark: {
+                    color: string;
+                    _hover: {
+                        color: string;
+                    };
+                    _visited: {
+                        color: string;
+                    };
+                };
+            };
+            svg: {
+                fill: string;
+                _dark: {
+                    fill: string;
+                };
+            };
+        };
+    };
+    defaultProps: {
+        variant: string;
+    };
+};
+export default SocialMediaLinks;

package/package.json

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