@nypl/design-system-react-components 3.6.1 → 4.0.0-remove-matchMedia-test

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.
Files changed (107) hide show
  1. package/dist/design-system-react-components.cjs +56 -59
  2. package/dist/design-system-react-components.js +18925 -20667
  3. package/dist/filteringStyleGuide/activeFiltersList.png +0 -0
  4. package/dist/filteringStyleGuide/exampleColumn.png +0 -0
  5. package/dist/filteringStyleGuide/examplePopup.png +0 -0
  6. package/dist/filteringStyleGuide/exampleRow.png +0 -0
  7. package/dist/filteringStyleGuide/filterBar.png +0 -0
  8. package/dist/filteringStyleGuide/focusClearingFilters.gif +0 -0
  9. package/dist/filteringStyleGuide/focusKeywordSearch.gif +0 -0
  10. package/dist/filteringStyleGuide/focusLiveFiltering.gif +0 -0
  11. package/dist/filteringStyleGuide/focusPagination.gif +0 -0
  12. package/dist/filteringStyleGuide/focusSorting.gif +0 -0
  13. package/dist/filteringStyleGuide/fullPageExample.png +0 -0
  14. package/dist/filteringStyleGuide/keywordSearchField.png +0 -0
  15. package/dist/filteringStyleGuide/paginationMenu.png +0 -0
  16. package/dist/filteringStyleGuide/resultsList.png +0 -0
  17. package/dist/filteringStyleGuide/sortingMenu.png +0 -0
  18. package/dist/filteringStyleGuide/totalResultsHeading.png +0 -0
  19. package/dist/responsiveGrid/breakpointRangeDesktop.png +0 -0
  20. package/dist/responsiveGrid/breakpointRangeMobileLarge.png +0 -0
  21. package/dist/responsiveGrid/breakpointRangeMobileSmall.png +0 -0
  22. package/dist/responsiveGrid/breakpointRangeTabletLarge.png +0 -0
  23. package/dist/responsiveGrid/breakpointRangeTabletSmall.png +0 -0
  24. package/dist/responsiveGrid/cardGridDesktop4Cols.png +0 -0
  25. package/dist/responsiveGrid/cardGridLargeMobile1Col.png +0 -0
  26. package/dist/responsiveGrid/cardGridLargeMobile2Cols.png +0 -0
  27. package/dist/responsiveGrid/cardGridSmallMobile1Col.png +0 -0
  28. package/dist/responsiveGrid/cardGridSmallTablet1Col.png +0 -0
  29. package/dist/responsiveGrid/cardGridSmallTablet3Cols.png +0 -0
  30. package/dist/responsiveGrid/cardGridSmallTablet3ColsSidebar.png +0 -0
  31. package/dist/responsiveGrid/gridColumns.png +0 -0
  32. package/dist/responsiveGrid/gridGutters.png +0 -0
  33. package/dist/responsiveGrid/gridMargins.png +0 -0
  34. package/dist/responsiveGrid/gridPerceivedColumns1.png +0 -0
  35. package/dist/responsiveGrid/gridPerceivedColumns2.png +0 -0
  36. package/dist/responsiveGrid/gridPerceivedColumns3.png +0 -0
  37. package/dist/responsiveGrid/gridPerceivedColumns4.png +0 -0
  38. package/dist/src/components/Accordion/Accordion.d.ts +3 -5
  39. package/dist/src/components/Banner/Banner.d.ts +0 -2
  40. package/dist/src/components/Button/Button.d.ts +1 -1
  41. package/dist/src/components/Heading/Heading.d.ts +2 -2
  42. package/dist/src/components/HelperErrorText/HelperErrorText.d.ts +2 -13
  43. package/dist/src/components/Hero/Hero.d.ts +5 -9
  44. package/dist/src/components/Icons/Icon.d.ts +0 -1
  45. package/dist/src/components/Link/Link.d.ts +3 -3
  46. package/dist/src/components/Notification/Notification.d.ts +0 -4
  47. package/dist/src/components/ProgressIndicator/ProgressIndicator.d.ts +0 -2
  48. package/dist/src/components/StatusBadge/StatusBadge.d.ts +1 -6
  49. package/dist/src/components/StyledList/StyledList.d.ts +1 -1
  50. package/dist/src/components/Template/Template.d.ts +36 -115
  51. package/dist/src/hooks/useNYPLBreakpoints.d.ts +6 -1
  52. package/dist/src/hooks/useResponsiveSpacing.d.ts +23 -0
  53. package/dist/src/index.d.ts +6 -7
  54. package/dist/src/theme/components/button.d.ts +1 -4
  55. package/dist/src/theme/components/heading.d.ts +1 -125
  56. package/dist/src/theme/components/hero.d.ts +11 -11
  57. package/dist/src/theme/components/link.d.ts +1 -40
  58. package/dist/src/theme/components/newsletterSignup.d.ts +1 -1
  59. package/dist/src/theme/components/notification.d.ts +1 -4
  60. package/dist/src/theme/components/progressIndicator.d.ts +1 -2
  61. package/dist/src/theme/components/slider.d.ts +3 -3
  62. package/dist/src/theme/components/statusBadge.d.ts +1 -14
  63. package/dist/src/theme/components/template.d.ts +49 -125
  64. package/dist/src/theme/components/text.d.ts +1 -9
  65. package/dist/src/theme/foundations/breakpoints.d.ts +21 -8
  66. package/dist/src/utils/utils.d.ts +3 -0
  67. package/dist/styles.css +1 -1
  68. package/dist/template/templateBottom.png +0 -0
  69. package/dist/template/templateBreakout.png +0 -0
  70. package/dist/template/templateFluidColumns1.png +0 -0
  71. package/dist/template/templateFluidColumns2.png +0 -0
  72. package/dist/template/templateFluidColumns3.png +0 -0
  73. package/dist/template/templateFluidColumns4.png +0 -0
  74. package/dist/template/templateFullPageLayout.png +0 -0
  75. package/dist/template/templateMain.png +0 -0
  76. package/dist/template/templateMainNarrow.png +0 -0
  77. package/dist/template/templateMainWide.png +0 -0
  78. package/dist/template/templateSidebarLeft.png +0 -0
  79. package/dist/template/templateSidebarNone.png +0 -0
  80. package/dist/template/templateSidebarRight.png +0 -0
  81. package/dist/template/templateTop.png +0 -0
  82. package/package.json +1 -1
  83. package/dist/src/components/Header/Header.d.ts +0 -13
  84. package/dist/src/components/Header/components/HeaderLogin.d.ts +0 -12
  85. package/dist/src/components/Header/components/HeaderLoginButton.d.ts +0 -10
  86. package/dist/src/components/Header/components/HeaderLowerNav.d.ts +0 -6
  87. package/dist/src/components/Header/components/HeaderMobileIconNav.d.ts +0 -6
  88. package/dist/src/components/Header/components/HeaderMobileNav.d.ts +0 -6
  89. package/dist/src/components/Header/components/HeaderMobileNavButton.d.ts +0 -6
  90. package/dist/src/components/Header/components/HeaderSearchButton.d.ts +0 -9
  91. package/dist/src/components/Header/components/HeaderSearchForm.d.ts +0 -10
  92. package/dist/src/components/Header/components/HeaderSitewideAlerts.d.ts +0 -7
  93. package/dist/src/components/Header/components/HeaderUpperNav.d.ts +0 -7
  94. package/dist/src/components/Header/context/headerContext.d.ts +0 -13
  95. package/dist/src/components/Header/utils/encoreCatalogLogOutTimer.d.ts +0 -4
  96. package/dist/src/components/Header/utils/headerUtils.d.ts +0 -70
  97. package/dist/src/theme/components/header.d.ts +0 -100
  98. package/dist/src/theme/components/headerLogin.d.ts +0 -333
  99. package/dist/src/theme/components/headerLoginButton.d.ts +0 -72
  100. package/dist/src/theme/components/headerLowerNav.d.ts +0 -78
  101. package/dist/src/theme/components/headerMobileIconNav.d.ts +0 -28
  102. package/dist/src/theme/components/headerMobileNav.d.ts +0 -92
  103. package/dist/src/theme/components/headerMobileNavButton.d.ts +0 -36
  104. package/dist/src/theme/components/headerSearchButton.d.ts +0 -85
  105. package/dist/src/theme/components/headerSearchForm.d.ts +0 -185
  106. package/dist/src/theme/components/headerSitewideAlerts.d.ts +0 -43
  107. package/dist/src/theme/components/headerUpperNav.d.ts +0 -60
@@ -1,333 +0,0 @@
1
- declare const HeaderLogin: {
2
- parts: string[];
3
- baseStyle: ({ patronName }: {
4
- patronName: any;
5
- }) => {
6
- bg: {
7
- base: string;
8
- mh: string;
9
- };
10
- boxShadow: {
11
- base: string;
12
- mh: string;
13
- };
14
- display: {
15
- base: string;
16
- mh: string;
17
- };
18
- flexDirection: string;
19
- left: {
20
- base: string;
21
- mh: any;
22
- };
23
- marginTop: {
24
- mh: string;
25
- };
26
- minHeight: {
27
- base: string;
28
- mh: string;
29
- };
30
- minWidth: {
31
- base: string;
32
- mh: string;
33
- };
34
- position: string;
35
- padding: {
36
- base: string;
37
- mh: string;
38
- };
39
- zIndex: string;
40
- ul: {
41
- display: {
42
- base: string;
43
- mh: string;
44
- };
45
- marginBottom: string;
46
- marginTop: {
47
- base: string;
48
- mh: string;
49
- };
50
- width: string;
51
- li: {
52
- _first: {
53
- gridColumn: {
54
- base: string;
55
- mh: any;
56
- };
57
- };
58
- _last: {
59
- gridColumn: {
60
- base: string;
61
- mh: any;
62
- };
63
- };
64
- };
65
- };
66
- li: {
67
- _first: {
68
- marginEnd: {
69
- base: string;
70
- mh: string;
71
- };
72
- marginTop: {
73
- base: string;
74
- mh: string;
75
- };
76
- marginBottom: {
77
- mh: string;
78
- };
79
- };
80
- };
81
- "li a": {
82
- alignItems: string;
83
- border: {
84
- base: string;
85
- mh: string;
86
- };
87
- borderColor: string;
88
- borderRadius: {
89
- base: string;
90
- mh: string;
91
- };
92
- bg: {
93
- base: string;
94
- mh: string;
95
- };
96
- color: string;
97
- display: string;
98
- fontSize: string;
99
- fontWeight: string;
100
- justifyContent: {
101
- mh: string;
102
- };
103
- lineHeight: {
104
- base: string;
105
- mh: string;
106
- };
107
- marginTop: {
108
- base: string;
109
- };
110
- minHeight: {
111
- base: string;
112
- mh: string;
113
- };
114
- padding: {
115
- base: string;
116
- mh: string;
117
- };
118
- textTransform: string;
119
- whiteSpace: string;
120
- width: string;
121
- svg: {
122
- marginRight: {
123
- base: string;
124
- mh: any;
125
- };
126
- };
127
- span: {
128
- width: {
129
- base: string;
130
- mh: string;
131
- };
132
- };
133
- _hover: {
134
- bg: {
135
- base: string;
136
- mh: string;
137
- };
138
- color: string;
139
- };
140
- _focus: {
141
- borderRadius: {
142
- base: string;
143
- mh: string;
144
- };
145
- boxShadow: {
146
- base: any;
147
- mh: string;
148
- };
149
- outline: {
150
- base: string;
151
- mh: string;
152
- };
153
- outlineStyle: {
154
- base: string;
155
- mh: any;
156
- };
157
- outlineWidth: {
158
- base: string;
159
- mh: any;
160
- };
161
- };
162
- _dark: {
163
- bgColor: {
164
- base: string;
165
- mh: string;
166
- };
167
- color: {
168
- base: string;
169
- mh: string;
170
- };
171
- svg: {
172
- fill: {
173
- base: string;
174
- mh: string;
175
- };
176
- };
177
- _hover: {
178
- bgColor: {
179
- base: string;
180
- mh: string;
181
- };
182
- color: {
183
- base: string;
184
- mh: string;
185
- };
186
- };
187
- };
188
- _visited: {
189
- color: string;
190
- };
191
- };
192
- patronGreeting: {
193
- alignSelf: string;
194
- color: string;
195
- fontSize: {
196
- base: string;
197
- mh: string;
198
- };
199
- fontWeight: string;
200
- lineHeight: string;
201
- margin: {
202
- base: string;
203
- mh: string;
204
- };
205
- minHeight: {
206
- base: string;
207
- mh: string;
208
- };
209
- textAlign: string;
210
- textTransform: string;
211
- width: {
212
- mh: string;
213
- };
214
- _focus: {
215
- boxShadow: {
216
- base: any;
217
- mh: string;
218
- };
219
- outline: {
220
- base: string;
221
- mh: string;
222
- };
223
- outlineStyle: {
224
- base: string;
225
- mh: any;
226
- };
227
- outlineWidth: {
228
- base: string;
229
- mh: any;
230
- };
231
- };
232
- ".greeting": {
233
- fontStyle: string;
234
- margin: {
235
- base: string;
236
- mh: string;
237
- };
238
- };
239
- ".name": {
240
- margin: number;
241
- };
242
- };
243
- logoutButton: {
244
- alignSelf: string;
245
- bg: {
246
- base: string;
247
- mh: string;
248
- };
249
- borderRadius: {
250
- base: string;
251
- mh: string;
252
- };
253
- color: {
254
- base: string;
255
- mh: string;
256
- };
257
- fontSize: {
258
- base: string;
259
- mh: string;
260
- };
261
- marginTop: {
262
- base: string;
263
- mh: string;
264
- };
265
- marginBottom: {
266
- base: string;
267
- mh: string;
268
- };
269
- padding: {
270
- base: string;
271
- mh: any;
272
- };
273
- textDecoration: {
274
- base: string;
275
- mh: any;
276
- };
277
- textTransform: string;
278
- width: {
279
- base: string;
280
- mh: string;
281
- };
282
- svg: {
283
- fill: string;
284
- };
285
- _hover: {
286
- bg: {
287
- base: string;
288
- mh: string;
289
- };
290
- color: {
291
- base: string;
292
- mh: string;
293
- };
294
- textDecoration: {
295
- base: string;
296
- mh: any;
297
- };
298
- };
299
- _focus: {
300
- borderRadius: {
301
- base: string;
302
- mh: string;
303
- };
304
- boxShadow: {
305
- base: any;
306
- mh: string;
307
- };
308
- outline: {
309
- base: string;
310
- mh: string;
311
- };
312
- outlineStyle: {
313
- base: string;
314
- mh: any;
315
- };
316
- outlineWidth: {
317
- base: string;
318
- mh: any;
319
- };
320
- };
321
- _dark: {
322
- color: string;
323
- svg: {
324
- fill: string;
325
- };
326
- _hover: {
327
- color: string;
328
- };
329
- };
330
- };
331
- };
332
- };
333
- export default HeaderLogin;
@@ -1,72 +0,0 @@
1
- declare const HeaderLoginButton: {
2
- baseStyle: ({ isOpen }: {
3
- isOpen: any;
4
- }) => {
5
- alignItems: {
6
- base: string;
7
- };
8
- bg: {
9
- base: string;
10
- mh: string;
11
- };
12
- borderRadius: string;
13
- color: string;
14
- display: string;
15
- fontFamily: string;
16
- fontSize: string;
17
- fontWeight: string;
18
- justifyContent: string;
19
- minHeight: {
20
- mh: string;
21
- };
22
- paddingY: {
23
- mh: string;
24
- };
25
- svg: {
26
- fill: string;
27
- marginLeft: {
28
- base: string;
29
- mh: string;
30
- };
31
- marginTop: {
32
- base: string;
33
- };
34
- };
35
- textDecoration: string;
36
- textTransform: string;
37
- _hover: {
38
- backgroundColor: {
39
- base: string;
40
- mh: string;
41
- };
42
- color: string;
43
- svg: {
44
- fill: string;
45
- };
46
- textDecoration: string;
47
- };
48
- _focus: {
49
- borderRadius: string;
50
- outlineColor: string;
51
- outlineOffset: string;
52
- outlineStyle: string;
53
- outlineWidth: string;
54
- };
55
- _dark: {
56
- bg: {
57
- base: string;
58
- mh: string;
59
- };
60
- color: string;
61
- svg: {
62
- fill: string;
63
- };
64
- _hover: {
65
- svg: {
66
- fill: string;
67
- };
68
- };
69
- };
70
- };
71
- };
72
- export default HeaderLoginButton;
@@ -1,78 +0,0 @@
1
- declare const HeaderLowerNav: {
2
- baseStyle: {
3
- ul: {
4
- alignItems: string;
5
- marginBottom: string;
6
- marginLeft: string;
7
- whiteSpace: string;
8
- li: {
9
- marginEnd: {
10
- mh: string;
11
- xl: string;
12
- };
13
- _last: {
14
- marginRight: string;
15
- };
16
- };
17
- };
18
- "li > a": {
19
- color: string;
20
- fontSize: {
21
- base: string;
22
- lh: string;
23
- };
24
- fontWeight: string;
25
- textDecoration: string;
26
- _hover: {
27
- borderBottom: string;
28
- color: string;
29
- paddingBottom: string;
30
- textDecoration: string;
31
- _dark: {
32
- color: string;
33
- };
34
- };
35
- _focus: {
36
- borderBottom: string;
37
- color: string;
38
- paddingBottom: string;
39
- textDecoration: string;
40
- _dark: {
41
- color: string;
42
- };
43
- borderRadius: string;
44
- outlineColor: string;
45
- outlineOffset: string;
46
- outlineStyle: string;
47
- outlineWidth: string;
48
- };
49
- _dark: {
50
- color: string;
51
- _hover: {
52
- borderBottom: string;
53
- color: string;
54
- paddingBottom: string;
55
- textDecoration: string;
56
- _dark: {
57
- color: string;
58
- };
59
- };
60
- _focus: {
61
- borderBottom: string;
62
- color: string;
63
- paddingBottom: string;
64
- textDecoration: string;
65
- _dark: {
66
- color: string;
67
- };
68
- borderRadius: string;
69
- outlineColor: string;
70
- outlineOffset: string;
71
- outlineStyle: string;
72
- outlineWidth: string;
73
- };
74
- };
75
- };
76
- };
77
- };
78
- export default HeaderLowerNav;
@@ -1,28 +0,0 @@
1
- declare const HeaderMobileIconNav: {
2
- baseStyle: {
3
- button: {
4
- minHeight: string;
5
- minWidth: string;
6
- };
7
- "> a": {
8
- display: string;
9
- alignItems: string;
10
- justifyContent: string;
11
- minHeight: string;
12
- minWidth: string;
13
- _focus: {
14
- borderRadius: string;
15
- outlineColor: string;
16
- outlineOffset: string;
17
- outlineStyle: string;
18
- outlineWidth: string;
19
- };
20
- };
21
- _dark: {
22
- svg: {
23
- fill: string;
24
- };
25
- };
26
- };
27
- };
28
- export default HeaderMobileIconNav;
@@ -1,92 +0,0 @@
1
- declare const HeaderMobileNav: {
2
- parts: string[];
3
- baseStyle: () => {
4
- backgroundColor: string;
5
- color: string;
6
- left: string;
7
- minHeight: string;
8
- position: string;
9
- whiteSpace: string;
10
- width: string;
11
- zIndex: string;
12
- logo: {
13
- marginTop: string;
14
- marginLeft: string;
15
- };
16
- sideNav: {
17
- lineHeight: string;
18
- marginBottom: string;
19
- padding: string;
20
- textAlign: string;
21
- "li:not(:first-child)": {
22
- marginTop: string;
23
- };
24
- a: {
25
- color: string;
26
- fontSize: string;
27
- fontWeight: string;
28
- textDecoration: string;
29
- _hover: {
30
- color: string;
31
- textDecoration: string;
32
- };
33
- _focus: {
34
- outlineColor: string;
35
- borderRadius: string;
36
- outlineOffset: string;
37
- outlineStyle: string;
38
- outlineWidth: string;
39
- };
40
- _visited: {
41
- color: string;
42
- };
43
- };
44
- };
45
- bottomLinks: {
46
- display: string;
47
- gridTemplateColumns: string;
48
- a: {
49
- alignItems: string;
50
- color: string;
51
- display: string;
52
- fontWeight: string;
53
- justifyContent: string;
54
- textDecoration: string;
55
- paddingY: string;
56
- paddingLeft: string;
57
- svg: {
58
- marginRight: string;
59
- };
60
- _hover: {
61
- color: string;
62
- backgroundColor: string;
63
- textDecoration: string;
64
- };
65
- _focus: {
66
- outlineColor: string;
67
- borderRadius: string;
68
- outlineOffset: string;
69
- outlineStyle: string;
70
- outlineWidth: string;
71
- };
72
- _visited: {
73
- color: string;
74
- };
75
- _last: {
76
- backgroundColor: string;
77
- _hover: {
78
- backgroundColor: string;
79
- };
80
- _dark: {
81
- bgColor: string;
82
- color: string;
83
- _hover: {
84
- bgColor: string;
85
- };
86
- };
87
- };
88
- };
89
- };
90
- };
91
- };
92
- export default HeaderMobileNav;
@@ -1,36 +0,0 @@
1
- declare const HeaderMobileNavButton: {
2
- baseStyle: ({ isOpen }: {
3
- isOpen: any;
4
- }) => {
5
- alignItems: string;
6
- backgroundColor: string;
7
- border: string;
8
- borderRadius: string;
9
- display: string;
10
- justifyContent: string;
11
- svg: {
12
- fill: string;
13
- marginLeft: string;
14
- };
15
- _hover: {
16
- backgroundColor: string;
17
- svg: {
18
- fill: string;
19
- };
20
- };
21
- _focus: {
22
- borderRadius: string;
23
- outlineColor: string;
24
- outlineOffset: string;
25
- outlineStyle: string;
26
- outlineWidth: string;
27
- };
28
- _dark: {
29
- backgroundColor: string;
30
- svg: {
31
- fill: string;
32
- };
33
- };
34
- };
35
- };
36
- export default HeaderMobileNavButton;