@nypl/design-system-react-components 3.5.5 → 3.6.0-rc

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -57,6 +57,8 @@ declare const _default: {
57
57
  minus: any;
58
58
  moonCrescent: any;
59
59
  navigationMoreVert: any;
60
+ navigationSubdirectoryArrowLeft: any;
61
+ navigationSubdirectoryArrowRight: any;
60
62
  plus: any;
61
63
  search: any;
62
64
  socialFacebook: any;
@@ -1,6 +1,6 @@
1
1
  export declare const iconAlignArray: readonly ["left", "right", "none"];
2
2
  export declare const iconColorsArray: readonly ["transparent", "ui.black", "ui.white", "ui.disabled.primary", "ui.disabled.secondary", "ui.error.primary", "ui.error.secondary", "ui.focus", "ui.link.primary", "ui.link.primary-05", "ui.link.primary-10", "ui.link.secondary", "ui.link.tertiary", "ui.status.primary", "ui.status.secondary", "ui.success.primary", "ui.success.secondary", "ui.test", "ui.warning.primary", "ui.warning.secondary", "ui.bg.default", "ui.bg.hover", "ui.bg.active", "ui.border.default", "ui.border.hover", "ui.typography.heading", "ui.typography.body", "ui.typography.inverse.heading", "ui.typography.inverse.body", "ui.gray.xxxx-dark", "ui.gray.xxx-dark", "ui.gray.xx-dark", "ui.gray.x-dark", "ui.gray.dark", "ui.gray.semi-dark", "ui.gray.medium", "ui.gray.semi-medium", "ui.gray.light-cool", "ui.gray.x-light-cool", "ui.gray.xx-light-cool", "ui.gray.light-warm", "ui.gray.x-light-warm", "brand.primary", "brand.secondary", "section.blogs.primary", "section.blogs.secondary", "section.books-and-more.primary", "section.books-and-more.secondary", "section.connect.primary", "section.connect.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.schwarzman", "section.whats-on.primary", "section.whats-on.secondary", "dark.brand.primary", "dark.brand.secondary", "dark.section.blogs.primary", "dark.section.blogs.secondary", "dark.section.books-and-more.primary", "dark.section.books-and-more.secondary", "dark.section.connect.primary", "dark.section.connect.secondary", "dark.section.education.primary", "dark.section.education.secondary", "dark.section.locations.primary", "dark.section.locations.secondary", "dark.section.research.primary", "dark.section.research.secondary", "dark.section.research-library.primary", "dark.section.research-library.secondary", "dark.section.whats-on.primary", "dark.section.whats-on.secondary", "dark.ui.disabled.primary", "dark.ui.disabled.secondary", "dark.ui.error.primary", "dark.ui.error.secondary", "dark.ui.focus", "dark.ui.link.primary", "dark.ui.link.primary-05", "dark.ui.link.primary-10", "dark.ui.link.secondary", "dark.ui.link.tertiary", "dark.ui.status.primary", "dark.ui.status.secondary", "dark.ui.success.primary", "dark.ui.success.secondary", "dark.ui.test", "dark.ui.warning.secondary", "dark.ui.warning.primary", "dark.ui.bg.page", "dark.ui.bg.default", "dark.ui.bg.hover", "dark.ui.bg.active", "dark.ui.border.default", "dark.ui.border.hover", "dark.ui.typography.heading", "dark.ui.typography.body", "dark.ui.typography.inverse.heading", "dark.ui.typography.inverse.body"];
3
- export declare const iconNamesArray: readonly ["accessibilityFull", "accessibilityPartial", "actionCheckCircle", "actionCheckCircleFilled", "actionDelete", "actionExit", "actionHelpDefault", "actionHelpOutline", "actionHome", "actionIdentity", "actionIdentityFilled", "actionLaunch", "actionLightbulb", "actionLockClosed", "actionPayment", "actionPower", "actionRegistration", "actionSearch", "actionSettings", "alertNotificationImportant", "alertWarningFilled", "alertWarningOutline", "arrow", "building", "check", "clock", "close", "communicationCall", "communicationChatBubble", "communicationEmail", "contentFilterList", "decorativeBookBroken", "decorativeEnvelope", "decorativeLibraryCard", "decorativeShoppingBag", "download", "editorMode", "errorFilled", "errorOutline", "fileTypeAudio", "fileTypeDoc", "fileTypeGenericDoc", "fileTypeImage", "fileTypePdf", "fileTypeSpreadsheet", "fileTypeVideo", "headset", "legacyAccountFilled", "legacyAccountUnfilled", "legacySocialFacebook", "legacySocialInstagram", "legacySocialTwitter", "legacySocialYoutube", "locator", "mapsPlace", "minus", "moonCrescent", "navigationMoreVert", "plus", "search", "socialFacebook", "socialInstagram", "socialPinterest", "socialSoundCloud", "socialSpotify", "socialTikTok", "socialTumblr", "socialTwitter", "socialVimeo", "socialX", "socialYoutube", "speakerNotes", "sunFull", "utilityAccountFilled", "utilityAccountUnfilled", "utilityCheck", "utilityHamburger", "utilitySearch"];
3
+ export declare const iconNamesArray: readonly ["accessibilityFull", "accessibilityPartial", "actionCheckCircle", "actionCheckCircleFilled", "actionDelete", "actionExit", "actionHelpDefault", "actionHelpOutline", "actionHome", "actionIdentity", "actionIdentityFilled", "actionLaunch", "actionLightbulb", "actionLockClosed", "actionPayment", "actionPower", "actionRegistration", "actionSearch", "actionSettings", "alertNotificationImportant", "alertWarningFilled", "alertWarningOutline", "arrow", "building", "check", "clock", "close", "communicationCall", "communicationChatBubble", "communicationEmail", "contentFilterList", "decorativeBookBroken", "decorativeEnvelope", "decorativeLibraryCard", "decorativeShoppingBag", "download", "editorMode", "errorFilled", "errorOutline", "fileTypeAudio", "fileTypeDoc", "fileTypeGenericDoc", "fileTypeImage", "fileTypePdf", "fileTypeSpreadsheet", "fileTypeVideo", "headset", "legacyAccountFilled", "legacyAccountUnfilled", "legacySocialFacebook", "legacySocialInstagram", "legacySocialTwitter", "legacySocialYoutube", "locator", "mapsPlace", "minus", "moonCrescent", "navigationMoreVert", "navigationSubdirectoryArrowLeft", "navigationSubdirectoryArrowRight", "plus", "search", "socialFacebook", "socialInstagram", "socialPinterest", "socialSoundCloud", "socialSpotify", "socialTikTok", "socialTumblr", "socialTwitter", "socialVimeo", "socialX", "socialYoutube", "speakerNotes", "sunFull", "utilityAccountFilled", "utilityAccountUnfilled", "utilityCheck", "utilityHamburger", "utilitySearch"];
4
4
  export declare const iconRotationsArray: readonly ["rotate0", "rotate90", "rotate180", "rotate270"];
5
5
  export declare const iconSizesArray: readonly ["default", "xsmall", "small", "medium", "large", "xlarge", "xxlarge", "xxxlarge", "xxxxlarge", "xxxxxlarge", "2xlarge", "3xlarge", "4xlarge", "5xlarge"];
6
6
  export declare const iconTypesArray: readonly ["default", "breadcrumbs"];
@@ -5,7 +5,7 @@ export declare const selectTypesArray: string[];
5
5
  export declare const labelPositionsArray: string[];
6
6
  export type SelectTypes = typeof selectTypesArray[number];
7
7
  export type LabelPositions = typeof labelPositionsArray[number];
8
- export interface SelectProps {
8
+ export interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
9
9
  /** A class name for the `div` parent element. */
10
10
  className?: string;
11
11
  /** The initial value of an uncontrolled component */
@@ -38,6 +38,9 @@ export interface SelectProps {
38
38
  onChange?: (event: React.FormEvent) => void;
39
39
  /** Placeholder text in the select element. */
40
40
  placeholder?: string;
41
+ /** Allows the '(required)' text to be changed for language purposes
42
+ * Note: Parenthesis will be added automatically by the component */
43
+ requiredLabelText?: string;
41
44
  /** The variant to display. */
42
45
  selectType?: SelectTypes;
43
46
  /** Offers the ability to hide the helper/invalid text. */
@@ -1,8 +1,7 @@
1
1
  import { ChakraComponent } from "@chakra-ui/react";
2
2
  import React from "react";
3
3
  import { HelperErrorTextType } from "../HelperErrorText/HelperErrorText";
4
- export declare const autoCompleteValuesArray: readonly ["on", "off", "additional-name", "address-level1", "address-level2", "address-level3", "address-level4", "address-line1", "address-line2", "address-line3", "bday-day", "bday-month", "bday-year", "bday", "cc-additional-name", "cc-csc", "cc-exp-month", "cc-exp-year", "cc-exp", "cc-family-name", "cc-given-name", "cc-name", "cc-number", "cc-type", "country-name", "country", "current-password", "email", "family-name", "given-name", "honorific-prefix", "honorific-suffix", "impp", "language", "name", "new-password", "nickname", "organization-title", "organization", "photo", "postal-code", "sex", "street-address", "tel-area-code", "tel-country-code", "tel-extension", "tel-local-prefix", "tel-local-suffix", "tel-local", "tel-national", "tel", "transaction-amount", "transaction-currency", "url", "username"];
5
- export type AutoCompleteValues = typeof autoCompleteValuesArray[number];
4
+ import type { AutoCompleteValues } from "../../utils/constantValues";
6
5
  export declare const textInputTypesArray: readonly ["email", "hidden", "number", "password", "text", "textarea", "tel", "url"];
7
6
  export type TextInputTypes = typeof textInputTypesArray[number];
8
7
  export declare const TextInputFormats: {
@@ -1,4 +1,5 @@
1
1
  export { Box, Center, chakra, Circle, ColorModeScript, cookieStorageManager, cookieStorageManagerSSR, FocusLock, Flex, Grid, GridItem, HStack, localStorageManager, Spacer, Square, Stack, useColorMode, useColorModeValue, useStyleConfig, useMediaQuery, useMultiStyleConfig, VStack, } from "@chakra-ui/react";
2
+ export { default as DSProvider } from "./theme/provider";
2
3
  export { default as Accordion } from "./components/Accordion/Accordion";
3
4
  export type { AccordionTypes, AccordionDataProps, } from "./components/Accordion/Accordion";
4
5
  export { default as AlphabetFilter } from "./components/AlphabetFilter/AlphabetFilter";
@@ -22,7 +23,6 @@ export type { CheckboxGroupProps } from "./components/CheckboxGroup/CheckboxGrou
22
23
  export { default as ColorCard } from "./components/StyleGuide/ColorCard";
23
24
  export { default as DatePicker } from "./components/DatePicker/DatePicker";
24
25
  export type { DatePickerTypes, FullDateType, CustomTextInputProps, DatePickerProps, } from "./components/DatePicker/DatePicker";
25
- export { default as DSProvider } from "./theme/provider";
26
26
  export { default as FeaturedContent } from "./components/FeaturedContent/FeaturedContent";
27
27
  export type { FeaturedContentImageProps, FeaturedContentPositionType, FeaturedContentProps, FeaturedContentWidthType, } from "./components/FeaturedContent/FeaturedContent";
28
28
  export { default as FeedbackBox, useFeedbackBox, } from "./components/FeedbackBox/FeedbackBox";
@@ -112,11 +112,13 @@ export type { TemplateAppContainerProps, TemplateProps, TemplateContentProps, Te
112
112
  export { default as Text } from "./components/Text/Text";
113
113
  export type { TextProps, TextSizes } from "./components/Text/Text";
114
114
  export { default as TextInput } from "./components/TextInput/TextInput";
115
- export type { AutoCompleteValues, InputProps, TextInputRefType, TextInputTypes, } from "./components/TextInput/TextInput";
115
+ export type { InputProps, TextInputRefType, TextInputTypes, } from "./components/TextInput/TextInput";
116
116
  export { default as Toggle } from "./components/Toggle/Toggle";
117
117
  export type { ToggleProps, ToggleSizes } from "./components/Toggle/Toggle";
118
118
  export { default as Tooltip } from "./components/Tooltip/Tooltip";
119
119
  export type { TooltipProps } from "./components/Tooltip/Tooltip";
120
+ export { default as VideoPlayer } from "./components/VideoPlayer/VideoPlayer";
121
+ export type { VideoPlayerAspectRatios, VideoPlayerProps, VideoPlayerTypes, } from "./components/VideoPlayer/VideoPlayer";
120
122
  export { default as useCarouselStyles } from "./hooks/useCarouselStyles";
121
123
  export { default as useCloseDropDown } from "./hooks/useCloseDropDown";
122
124
  export { default as useMultiSelect } from "./hooks/useMultiSelect";
@@ -125,5 +127,4 @@ export { default as useNYPLTheme } from "./hooks/useNYPLTheme";
125
127
  export { default as useWindowSize } from "./hooks/useWindowSize";
126
128
  export { default as useScrollFadeStyles } from "./hooks/useScrollFadeStyles";
127
129
  export { default as useFormatNumber } from "./hooks/useFormatNumber";
128
- export { default as VideoPlayer } from "./components/VideoPlayer/VideoPlayer";
129
- export type { VideoPlayerAspectRatios, VideoPlayerProps, VideoPlayerTypes, } from "./components/VideoPlayer/VideoPlayer";
130
+ export type { AutoCompleteValues } from "./utils/constantValues";
@@ -77,9 +77,6 @@ export declare const descriptionStyles: (showRowDividers?: boolean) => {
77
77
  md: string;
78
78
  };
79
79
  paddingTop: string;
80
- paddingEnd: {
81
- md: string;
82
- };
83
80
  _dark: {
84
81
  borderColor: string;
85
82
  color: string;
@@ -95,6 +92,9 @@ export declare const descriptionStyles: (showRowDividers?: boolean) => {
95
92
  borderColor: {
96
93
  md: string;
97
94
  };
95
+ paddingStart: {
96
+ md: string;
97
+ };
98
98
  paddingTop: {
99
99
  md: string;
100
100
  };
@@ -204,9 +204,6 @@ declare const List: {
204
204
  md: string;
205
205
  };
206
206
  paddingTop: string;
207
- paddingEnd: {
208
- md: string;
209
- };
210
207
  _dark: {
211
208
  borderColor: string;
212
209
  color: string;
@@ -222,6 +219,9 @@ declare const List: {
222
219
  borderColor: {
223
220
  md: string;
224
221
  };
222
+ paddingStart: {
223
+ md: string;
224
+ };
225
225
  paddingTop: {
226
226
  md: string;
227
227
  };
@@ -13,7 +13,6 @@ declare const NotificationContent: {
13
13
  justifyContent: string;
14
14
  content: {
15
15
  color: string;
16
- marginTop: string;
17
16
  paddingStart: string;
18
17
  pt: string;
19
18
  w: string;
@@ -23,7 +23,6 @@ declare const NotificationHeading: {
23
23
  heading: {
24
24
  color: string;
25
25
  ml: string;
26
- mt: string;
27
26
  _dark: {
28
27
  borderLeftColor: string;
29
28
  borderLeftStyle: string;
@@ -348,9 +348,6 @@ declare const StructuredContent: {
348
348
  * not rendered from the Reservoir DS. Typically, these HTML elements
349
349
  * are added from an API response.
350
350
  */
351
- paddingEnd: {
352
- md: string;
353
- };
354
351
  _dark: {
355
352
  borderColor: string;
356
353
  color: string;
@@ -366,6 +363,9 @@ declare const StructuredContent: {
366
363
  borderColor: {
367
364
  md: string;
368
365
  };
366
+ paddingStart: {
367
+ md: string;
368
+ };
369
369
  paddingTop: {
370
370
  md: string;
371
371
  };
@@ -0,0 +1,2 @@
1
+ export declare const autoCompleteValuesArray: readonly ["on", "off", "additional-name", "address-level1", "address-level2", "address-level3", "address-level4", "address-line1", "address-line2", "address-line3", "bday-day", "bday-month", "bday-year", "bday", "cc-additional-name", "cc-csc", "cc-exp-month", "cc-exp-year", "cc-exp", "cc-family-name", "cc-given-name", "cc-name", "cc-number", "cc-type", "country-name", "country", "current-password", "email", "family-name", "given-name", "honorific-prefix", "honorific-suffix", "impp", "language", "name", "new-password", "nickname", "organization-title", "organization", "photo", "postal-code", "sex", "street-address", "tel-area-code", "tel-country-code", "tel-extension", "tel-local-prefix", "tel-local-suffix", "tel-local", "tel-national", "tel", "transaction-amount", "transaction-currency", "url", "username"];
2
+ export type AutoCompleteValues = typeof autoCompleteValuesArray[number];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nypl/design-system-react-components",
3
- "version": "3.5.5",
3
+ "version": "3.6.0-rc",
4
4
  "description": "NYPL Reservoir Design System React Components",
5
5
  "repository": {
6
6
  "type": "git",