@nypl/design-system-react-components 3.3.0-rc2 → 3.3.1-rc-test-card-image

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

@@ -1,5 +1,5 @@
-import { ChakraComponent } from "@chakra-ui/react";
 import React from "react";
+import { ChakraComponent } from "@chakra-ui/react";
 import { LayoutTypes } from "../../helpers/types";
 import { ComponentImageProps } from "../Image/Image";
 interface CardBaseProps {

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

@@ -36,7 +36,7 @@ export interface CheckboxGroupProps {
     /** Offers the ability to show the group's legend onscreen or hide it. Refer
      * to the `labelText` property for more information. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
     /** The values to programmatically update the selected `Checkbox`es. */

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

@@ -26,7 +26,7 @@ interface DatePickerWrapperProps extends DateRangeRowProps {
     labelText: string;
     /** Offers the ability to show the label onscreen or hide it. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
 }

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

@@ -7,11 +7,11 @@ export interface FieldsetProps {
     id: string;
     /** Flag to show or hide the text in the `legend` element. False by default. */
     isLegendHidden?: boolean;
-    /** Flag to render "Required" in the `legend`. True by default. */
+    /** Flag to render "required" in the `legend`. True by default. */
     isRequired?: boolean;
     /** Text to display in the `legend` element. */
     legendText?: string;
-    /** Whether or not to display the "(Required)" text in the `legend` text.
+    /** Whether or not to display the "(required)" text in the `legend` text.
      * True by default. */
     showRequiredLabel?: boolean;
 }

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

@@ -4,9 +4,9 @@ import { DimensionTypes } from "../../helpers/types";
 export declare const imageRatiosArray: readonly ["fourByThree", "oneByTwo", "original", "sixteenByNine", "square", "threeByFour", "threeByTwo", "twoByOne"];
 export declare const imageSizesArray: readonly ["default", "xxxsmall", "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 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. */
@@ -22,6 +22,8 @@ export interface ComponentImageProps extends Partial<HTMLImageElement> {
     credit?: string;
     /** Fallback image path or URL. */
     fallbackSrc?: string;
+    /** ID that other components can cross reference for accessibility purposes. */
+    id?: string;
     /** Flag to set the internal `Image` component to `isLazy` mode. */
     isLazy?: boolean;
     /** Additional action to perform in the `img`'s `onerror` attribute function. */
@@ -40,6 +42,8 @@ interface ImageWrapperProps {
     };
     /** ClassName you can add in addition to 'image' */
     className?: string;
+    /** ID that other components can cross reference for accessibility purposes. */
+    id?: string;
     /** Optional value to control the aspect ratio of the card image; default
      * value is `"original"` */
     ratio?: ImageRatios;

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

@@ -10,10 +10,10 @@ export interface LabelProps {
     /** 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
+    /** 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
+    /** Allows the '(required)' text to be changed for language purposes
      * Note: Parenthesis will be added automatically by the component */
     requiredLabelText?: string;
 }

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

@@ -36,7 +36,7 @@ export interface RadioGroupProps {
     /** Offers the ability to show the group's legend onscreen or hide it. Refer
      * to the `labelText` property for more information. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
 }

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

@@ -8,6 +8,8 @@ export type LabelPositions = typeof labelPositionsArray[number];
 export interface SelectProps {
     /** A class name for the `div` parent element. */
     className?: string;
+    /** The initial value of an uncontrolled component */
+    defaultValue?: string;
     /** Optional string to populate the `HelperErrorText` for the standard state. */
     helperText?: HelperErrorTextType;
     /** ID that other components can cross reference for accessibility purposes */
@@ -43,7 +45,7 @@ export interface SelectProps {
     /** Offers the ability to show the select's label onscreen or hide it. Refer
      * to the `labelText` property for more information. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
     /** The value of the selected option.

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

@@ -45,7 +45,7 @@ export interface SliderProps {
     /** Offers the ability to show the label onscreen or hide it. Refer
      * to the `labelText` property for more information. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
     /** Offers the ability to hide the static min/max values. */

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

@@ -65,7 +65,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
     pattern?: string;
     /** Populates the placeholder for the input/textarea elements */
     placeholder?: string;
-    /** Allows the '(Required)' text to be changed for language purposes
+    /** Allows the '(required)' text to be changed for language purposes
      * Note: Parenthesis will be added automatically by the component */
     requiredLabelText?: string;
     /** Offers the ability to hide the helper/invalid text. */
@@ -73,7 +73,7 @@ export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement>
     /** Offers the ability to show the label onscreen or hide it. Refer to the
      * `labelText` property for more information. */
     showLabel?: boolean;
-    /** Whether or not to display the "(Required)" text in the label text.
+    /** Whether or not to display the "(required)" text in the label text.
      * True by default. */
     showRequiredLabel?: boolean;
     /** The amount to increase or decrease when using the number type. */

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

@@ -13,6 +13,10 @@ export interface TooltipProps {
     isDisabled?: boolean;
     /** Wraps the children of the tooltip in `ComponentWrapper` with `tabIndex=0` when true. */
     shouldWrapChildren?: boolean;
+    /** The placement of the tooltip relative to its children. */
+    placement?: "top" | "left" | "bottom" | "right" | "auto";
+    /** The main and cross-axis offset to displace the tooltip from its reference element. */
+    offset?: [number, number];
 }
 export declare const Tooltip: ChakraComponent<React.ForwardRefExoticComponent<React.PropsWithChildren<TooltipProps> & React.RefAttributes<HTMLDivElement>>, React.PropsWithChildren<TooltipProps>>;
 export default Tooltip;

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

@@ -5,14 +5,54 @@ declare const SearchBar: {
             base: string;
             md: string;
         };
+        ".textInput": {
+            flexGrow: number;
+            "div > input": {
+                borderRightRadius: number;
+            };
+        };
         flexFlow: {
             base: string;
             md: string;
         };
-        ".textInput": {
-            flexGrow: string;
+        ".searchButton": {
+            minWidth: string;
+            borderLeftRadius: string;
+            lineHeight: string;
+            marginBottom: string;
+            paddingTop: {
+                base: string;
+                md: string;
+            };
+            paddingLeft: {
+                base: string;
+                md: string;
+            };
+            paddingBottom: {
+                base: string;
+                md: string;
+            };
+            paddingRight: {
+                base: string;
+                md: string;
+            };
+            gap: string;
+            borderRightRadius: string;
+            " > span": {
+                display: {
+                    base: string;
+                    md: string;
+                };
+            };
+            " > svg": {
+                margin: number;
+            };
         };
         select: {
+            paddingBottom: {
+                base: "xs";
+                md: "unset";
+            };
             flexShrink: string;
             marginBottom: {
                 base: "-1px";

package/package.json

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