@nypl/design-system-react-components 3.2.0-rc → 3.2.0-rc2

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

@@ -0,0 +1,31 @@
+import { ChakraComponent } from "@chakra-ui/react";
+import React from "react";
+import { LayoutTypes } from "../../helpers/types";
+import { MultiSelectWidths, SelectedItems as MultiSelectItems } from "../MultiSelect/MultiSelect";
+export type FilterBarItemsType = (boolean | number | number[] | string | string[] | MultiSelectItems)[];
+interface FilterBarInlineProps {
+    /** The className of the FilterBarInline. */
+    className?: string;
+    /** ID that other components can cross reference for accessibility purposes. */
+    id?: string;
+    /** Optional string value used to set the text for a `Heading` component, or
+     * a DS Heading component that can be passed in.
+     */
+    heading?: string | JSX.Element;
+    /** Renders the layout of the FilterBarInline child components in a row or column. */
+    layout?: LayoutTypes;
+    /** Function for the global `Clear Filters` button. If passed the `Clear Filters` button will render. */
+    onClear?: () => void;
+    /** Function for the global `Apply Filters` button. If passed the `Apply Filters` button will render. */
+    onSubmit?: () => void;
+    /** Render prop function used to render child components with updated props. */
+    renderChildren: ({ isBlockElement, layout, width, }: {
+        isBlockElement?: boolean;
+        layout?: LayoutTypes;
+        width?: MultiSelectWidths;
+    }) => React.ReactNode;
+    /** The selected items state (items that were checked by user). */
+    selectedItems?: FilterBarItemsType;
+}
+export declare const FilterBarInline: ChakraComponent<React.ForwardRefExoticComponent<React.PropsWithChildren<FilterBarInlineProps> & React.RefAttributes<HTMLDivElement>>, FilterBarInlineProps>;
+export default FilterBarInline;

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

@@ -0,0 +1,48 @@
+import { ChakraComponent } from "@chakra-ui/react";
+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];
+type IconNames = "fileTypeGenericDoc" | "socialFacebook" | "socialInstagram" | "socialPinterest" | "socialSoundCloud" | "socialTikTok" | "socialTumblr" | "socialTwitter" | "socialYoutube";
+export interface SocialMediaLinkDataProps {
+    /** Required. Label rendered on page is showLabel is true  */
+    labelText: string;
+    /** Required. Should match the social media platform that it's linking to */
+    icon: IconNames;
+    /** Required. Url to link to the platform */
+    url: string;
+}
+interface BaseSocialMediaLinksProps {
+    /** 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 if there are labels and
+     * in a row if there are no labels. */
+    layout?: LayoutTypes;
+    /** Required. Array of social media platform types, urls, and label texts. */
+    linksData: SocialMediaLinkDataProps[];
+    /** Optional size: small, medium, or large. */
+    size?: SizeType;
+}
+type ConditionalSocialMediaLinksProps = {
+    showLabels?: true;
+    borders?: Exclude<BorderType, "circular">;
+} | {
+    showLabels?: false;
+    borders?: BorderType;
+};
+export type SocialMediaLinksProps = BaseSocialMediaLinksProps & ConditionalSocialMediaLinksProps;
+/**
+ * The SocialMediaLinks component renders a list of links for accessing social media sites.
+ * The data passed to the `linksData` prop controls which social media icons are displayed,
+ * the order they appear, the url they link to, and the text used for the label of each.
+ */
+export declare const SocialMediaLinks: ChakraComponent<React.ForwardRefExoticComponent<SocialMediaLinksProps & React.RefAttributes<HTMLDivElement & HTMLUListElement & HTMLOListElement>>, SocialMediaLinksProps>;
+export default SocialMediaLinks;

package/dist/src/index.d.ts

@@ -23,6 +23,7 @@ export { default as FeaturedContent } from "./components/FeaturedContent/Feature
 export { default as FeedbackBox, useFeedbackBox, } from "./components/FeedbackBox/FeedbackBox";
 export type { FeedbackBoxViewType } from "./components/FeedbackBox/FeedbackBox";
 export { default as Fieldset } from "./components/Fieldset/Fieldset";
+export { default as FilterBarInline } from "./components/FilterBarInline/FilterBarInline";
 export { default as Form, FormField, FormRow } from "./components/Form/Form";
 export { default as Heading } from "./components/Heading/Heading";
 export type { HeadingSizes, HeadingLevels } from "./components/Heading/Heading";
@@ -51,10 +52,8 @@ export { default as MultiSelect } from "./components/MultiSelect/MultiSelect";
 export type { MultiSelectItem, SelectedItems, } from "./components/MultiSelect/MultiSelect";
 export { default as MultiSelectGroup } from "./components/MultiSelectGroup/MultiSelectGroup";
 export type { MultiSelectGroupProps } from "./components/MultiSelectGroup/MultiSelectGroup";
-/** The code associated with the NewsletterSignup component and the
- * NewsletterSignupViewType type will not be exported until the refactor of the
- * component has been completed.
- * */
+export { default as NewsletterSignup } from "./components/NewsletterSignup/NewsletterSignup";
+export type { NewsletterSignupViewType } from "./components/NewsletterSignup/NewsletterSignup";
 export { default as Notification } from "./components/Notification/Notification";
 export type { NotificationTypes } from "./components/Notification/Notification";
 export { default as Pagination } from "./components/Pagination/Pagination";
@@ -71,9 +70,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";
-/** The code associated with the SocialMediaLinks component will not be exported
- * until the refactor of the component has been completed.
- * */
+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/package.json

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