@toptal/picasso-pagination 2.0.8 → 2.0.9

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 (2) hide show
  1. package/package.json +2 -2
  2. package/src/Pagination/__snapshots__/test.tsx.snap +18 -18
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@toptal/picasso-pagination",
3
- "version": "2.0.8",
3
+ "version": "2.0.9",
4
4
  "description": "Toptal UI components library - Pagination",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -22,7 +22,7 @@
22
22
  },
23
23
  "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
24
24
  "dependencies": {
25
- "@toptal/picasso-button": "2.0.8",
25
+ "@toptal/picasso-button": "2.1.0",
26
26
  "@toptal/picasso-container": "1.0.3",
27
27
  "@toptal/picasso-typography": "2.0.2",
28
28
  "@toptal/picasso-utils": "1.0.3",
package/src/Pagination/__snapshots__/test.tsx.snap CHANGED
@@ -10,7 +10,7 @@ exports[`Pagination renders 1`] = `
10
10
  >
11
11
  <button
12
12
  aria-disabled="false"
13
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black active:bg-gray active:border-black bg-white border-gray min-w h-6 py-0 px-3 [&+&]:ml-2"
13
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black active:bg-gray active:border-black bg-white border-gray min-w h-6 py-0 px-3 [&+&]:ml-2"
14
14
  data-component-type="button"
15
15
  role="button"
16
16
  tabindex="0"
@@ -25,7 +25,7 @@ exports[`Pagination renders 1`] = `
25
25
  <button
26
26
  aria-current="false"
27
27
  aria-disabled="false"
28
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
28
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
29
29
  data-component-type="button"
30
30
  role="button"
31
31
  tabindex="0"
@@ -49,7 +49,7 @@ exports[`Pagination renders 1`] = `
49
49
  <button
50
50
  aria-current="false"
51
51
  aria-disabled="false"
52
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
52
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
53
53
  data-component-type="button"
54
54
  role="button"
55
55
  tabindex="0"
@@ -64,7 +64,7 @@ exports[`Pagination renders 1`] = `
64
64
  <button
65
65
  aria-current="false"
66
66
  aria-disabled="false"
67
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
67
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
68
68
  data-component-type="button"
69
69
  role="button"
70
70
  tabindex="0"
@@ -79,7 +79,7 @@ exports[`Pagination renders 1`] = `
79
79
  <button
80
80
  aria-current="true"
81
81
  aria-disabled="false"
82
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] shadow-none border border-solid hover:border-black visited:text-black h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white bg-graphite border-graphite text-white disabled:text-gray [&+&]:ml-2"
82
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] shadow-none border border-solid hover:border-black visited:text-black h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white bg-graphite border-graphite text-white disabled:text-gray [&+&]:ml-2"
83
83
  data-component-type="button"
84
84
  role="button"
85
85
  tabindex="0"
@@ -94,7 +94,7 @@ exports[`Pagination renders 1`] = `
94
94
  <button
95
95
  aria-current="false"
96
96
  aria-disabled="false"
97
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
97
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
98
98
  data-component-type="button"
99
99
  role="button"
100
100
  tabindex="0"
@@ -109,7 +109,7 @@ exports[`Pagination renders 1`] = `
109
109
  <button
110
110
  aria-current="false"
111
111
  aria-disabled="false"
112
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
112
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
113
113
  data-component-type="button"
114
114
  role="button"
115
115
  tabindex="0"
@@ -133,7 +133,7 @@ exports[`Pagination renders 1`] = `
133
133
  <button
134
134
  aria-current="false"
135
135
  aria-disabled="false"
136
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
136
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black bg-white border-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray [&+&]:ml-2"
137
137
  data-component-type="button"
138
138
  role="button"
139
139
  tabindex="0"
@@ -147,7 +147,7 @@ exports[`Pagination renders 1`] = `
147
147
  </button>
148
148
  <button
149
149
  aria-disabled="false"
150
- class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black active:bg-gray active:border-black bg-white border-gray min-w h-6 py-0 px-3 [&+&]:ml-2"
150
+ class="base-Button text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-pointer no-underline hover:no-underline rounded-sm shadow-none focus-visible:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] focus-within:shadow-[0_0_0_3px_rgba(32,78,207,0.48)] border border-solid text-black hover:border-black visited:text-black active:bg-gray active:border-black bg-white border-gray min-w h-6 py-0 px-3 [&+&]:ml-2"
151
151
  data-component-type="button"
152
152
  role="button"
153
153
  tabindex="0"
@@ -174,7 +174,7 @@ exports[`Pagination renders disabled 1`] = `
174
174
  >
175
175
  <button
176
176
  aria-disabled="true"
177
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid text-gray border-gray bg-white min-w h-6 py-0 px-3 [&+&]:ml-2"
177
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid text-gray visited:text-gray border-gray bg-white min-w h-6 py-0 px-3 [&+&]:ml-2"
178
178
  data-component-type="button"
179
179
  disabled=""
180
180
  role="button"
@@ -190,7 +190,7 @@ exports[`Pagination renders disabled 1`] = `
190
190
  <button
191
191
  aria-current="false"
192
192
  aria-disabled="true"
193
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
193
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
194
194
  data-component-type="button"
195
195
  disabled=""
196
196
  role="button"
@@ -215,7 +215,7 @@ exports[`Pagination renders disabled 1`] = `
215
215
  <button
216
216
  aria-current="false"
217
217
  aria-disabled="true"
218
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
218
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
219
219
  data-component-type="button"
220
220
  disabled=""
221
221
  role="button"
@@ -231,7 +231,7 @@ exports[`Pagination renders disabled 1`] = `
231
231
  <button
232
232
  aria-current="false"
233
233
  aria-disabled="true"
234
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
234
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
235
235
  data-component-type="button"
236
236
  disabled=""
237
237
  role="button"
@@ -247,7 +247,7 @@ exports[`Pagination renders disabled 1`] = `
247
247
  <button
248
248
  aria-current="true"
249
249
  aria-disabled="true"
250
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white bg-graphite border-graphite disabled:text-gray text-gray [&+&]:ml-2"
250
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white bg-graphite border-graphite disabled:text-gray text-gray [&+&]:ml-2"
251
251
  data-component-type="button"
252
252
  disabled=""
253
253
  role="button"
@@ -263,7 +263,7 @@ exports[`Pagination renders disabled 1`] = `
263
263
  <button
264
264
  aria-current="false"
265
265
  aria-disabled="true"
266
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
266
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
267
267
  data-component-type="button"
268
268
  disabled=""
269
269
  role="button"
@@ -279,7 +279,7 @@ exports[`Pagination renders disabled 1`] = `
279
279
  <button
280
280
  aria-current="false"
281
281
  aria-disabled="true"
282
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
282
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
283
283
  data-component-type="button"
284
284
  disabled=""
285
285
  role="button"
@@ -304,7 +304,7 @@ exports[`Pagination renders disabled 1`] = `
304
304
  <button
305
305
  aria-current="false"
306
306
  aria-disabled="true"
307
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
307
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid visited:text-gray border-gray bg-white h-6 py-0 min-w px-[0.3em] active:bg-graphite active:border-graphite active:text-white disabled:text-gray text-gray [&+&]:ml-2"
308
308
  data-component-type="button"
309
309
  disabled=""
310
310
  role="button"
@@ -319,7 +319,7 @@ exports[`Pagination renders disabled 1`] = `
319
319
  </button>
320
320
  <button
321
321
  aria-disabled="true"
322
- class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline rounded-sm shadow-none border border-solid text-gray border-gray bg-white min-w h-6 py-0 px-3 [&+&]:ml-2"
322
+ class="base-Button base- text-lg inline-flex items-center justify-center select-none appearance-none m-0 relative normal-case align-middle transition-colors duration-350 ease-out shrink-0 outline-none cursor-default pointer-events no-underline hover:no-underline rounded-sm shadow-none border border-solid text-gray visited:text-gray border-gray bg-white min-w h-6 py-0 px-3 [&+&]:ml-2"
323
323
  data-component-type="button"
324
324
  disabled=""
325
325
  role="button"