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

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

@@ -5,6 +5,7 @@ export type BreadcrumbsTypes = typeof breadcrumbTypeArray[number];
 export interface BreadcrumbsDataProps {
     url: string;
     text: string | React.ReactNode;
+    linkProps?: any;
 }
 export interface BreadcrumbProps {
     /** Breadcrumb links as an array */
@@ -15,6 +16,8 @@ export interface BreadcrumbProps {
     className?: string;
     /** 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 */
+    customLinkComponent?: any;
 }
 /**
  * The `Breadcrumbs` component is a navigation element that provides a

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

@@ -19,7 +19,8 @@ export interface FilterBarInlineProps {
     /** 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, }: {
+    renderChildren: ({ closeOnBlur, isBlockElement, layout, width, }: {
+        closeOnBlur?: boolean;
         isBlockElement?: boolean;
         layout?: LayoutTypes;
         width?: MultiSelectWidths;

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

@@ -0,0 +1,38 @@
+import { ChakraComponent } from "@chakra-ui/react";
+import React from "react";
+import { LayoutTypes } from "../../helpers/types";
+import { MultiSelectWidths } from "../MultiSelect/MultiSelect";
+import { FilterBarItemsType } from "../FilterBarInline/FilterBarInline";
+export interface FilterBarPopupProps {
+    /** The className of the FilterBarInline. */
+    className?: 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;
+    /** ID that other components can cross reference for accessibility purposes. */
+    id?: string;
+    /** Only used for internal purposes. */
+    isOpen?: boolean;
+    /** Function for the global `Clear Filters` button. If passed the `Clear Filters` button will render. */
+    onClear?: () => void;
+    /** Only used for internal purposes. */
+    onClose?: any;
+    /** Only used for internal purposes. */
+    onOpen?: any;
+    /** 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;
+    /** A number that represents the total number of results in the associated search results list. */
+    totalResults?: number;
+}
+export declare const FilterBarPopup: ChakraComponent<React.ForwardRefExoticComponent<React.PropsWithChildren<FilterBarPopupProps> & React.RefAttributes<HTMLDivElement>>, FilterBarPopupProps>;
+export declare function useFilterBarPopup(): any;
+export default FilterBarPopup;

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

@@ -10,6 +10,8 @@ export interface MenuProps {
     /** Optional string used to identify and highlight an item when the menu opens. The value should
      * match the id associated with one of the items. */
     selectedItem?: string;
+    /** Optional boolean value, toggles whether the label of the menu will display the text of the selected item. labelText is required for the aria-label either way. */
+    showSelectionAsLabel?: boolean;
     /** Used to set the highlight color for the current item.  The values correspond with the NYPL section colors */
     highlightColor?: SectionTypes;
     /** Required string used to set the label text for the button element. If showLabel is false,

package/dist/src/index.d.ts

@@ -31,6 +31,8 @@ export { default as Fieldset } from "./components/Fieldset/Fieldset";
 export type { FieldsetProps } from "./components/Fieldset/Fieldset";
 export { default as FilterBarInline } from "./components/FilterBarInline/FilterBarInline";
 export type { FilterBarItemsType, FilterBarInlineProps, } from "./components/FilterBarInline/FilterBarInline";
+export { default as FilterBarPopup, useFilterBarPopup, } from "./components/FilterBarPopup/FilterBarPopup";
+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 Heading } from "./components/Heading/Heading";
@@ -115,9 +117,6 @@ export { default as Tooltip } from "./components/Tooltip/Tooltip";
 export type { TooltipProps } from "./components/Tooltip/Tooltip";
 export { default as useCarouselStyles } from "./hooks/useCarouselStyles";
 export { default as useCloseDropDown } from "./hooks/useCloseDropDown";
-/** The useFilterBar hooks will not be exported until the refactor of the v2
- * versions of the FilterBar component has been completed.
- * */
 export { default as useMultiSelect } from "./hooks/useMultiSelect";
 export { default as useNYPLBreakpoints } from "./hooks/useNYPLBreakpoints";
 export { default as useNYPLTheme } from "./hooks/useNYPLTheme";

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

@@ -25,6 +25,9 @@ declare const Breadcrumb: {
             paddingEnd: string;
         };
         a: {
+            _visited: {
+                color: string;
+            };
             _hover: {
                 color: string;
                 textDecoration: string;

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

@@ -0,0 +1,51 @@
+declare const FilterBarPopup: {
+    baseStyle?: {
+        width: string;
+        modalBody: {
+            _dark: {
+                background: string;
+            };
+        };
+        modalHeader: {
+            bg: string;
+            borderBottom: string;
+            borderColor: string;
+            _dark: {
+                background: string;
+                borderBottom: string;
+                borderColor: string;
+            };
+        };
+        modalFooter: {
+            bg: string;
+            borderTop: string;
+            borderColor: string;
+            _dark: {
+                background: string;
+                borderTop: string;
+                borderColor: string;
+                color: string;
+            };
+        };
+        modalCloseButton: {
+            mt: string;
+        };
+    };
+    sizes?: {
+        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+            keys: ("modalBody" | "modalHeader" | "modalFooter" | "modalCloseButton")[];
+        }>;
+    };
+    variants?: {
+        [key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
+            keys: ("modalBody" | "modalHeader" | "modalFooter" | "modalCloseButton")[];
+        }>;
+    };
+    defaultProps?: {
+        size?: string | number;
+        variant?: string | number;
+        colorScheme?: string;
+    };
+    parts: ("modalBody" | "modalHeader" | "modalFooter" | "modalCloseButton")[];
+};
+export default FilterBarPopup;

package/package.json

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