@lockerverse/react 0.2.99 → 0.2.101

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.
package/README.md CHANGED
@@ -325,3 +325,92 @@ const recovery = savedRecovery
325
325
  ```
326
326
 
327
327
  Malformed host selections and invalid custom tips render customer-safe validation messages and do not call the Lockerverse API. Product selection remains owned by the host application.
328
+
329
+ ## Auctions
330
+
331
+ Browse auctions and open the built-in item checkout. The catalog entry does not
332
+ load Stripe. The checkout entry uses the optional Stripe peers listed above.
333
+ Import `auctions.css` for both components. Built-in auction checkout accepts
334
+ cards only. The core SDK supports the backend confirmation-token flows for
335
+ custom payment UIs.
336
+
337
+ ```tsx
338
+ import { useState } from "react";
339
+ import type { LockerverseAuction } from "@lockerverse/sdk/auctions";
340
+ import { LockerverseAuctions, useLockerverseAuctions } from "@lockerverse/react/auctions";
341
+ import { LockerverseAuctionItem } from "@lockerverse/react/auction-item";
342
+ import "@lockerverse/react/auctions.css";
343
+
344
+ export function AuctionPage() {
345
+ const auctions = useLockerverseAuctions({ communitySlug: "auburn" });
346
+ const [selected, setSelected] = useState<{
347
+ auction: LockerverseAuction;
348
+ itemId: string;
349
+ } | null>(null);
350
+
351
+ return selected ? (
352
+ <LockerverseAuctionItem
353
+ auction={selected.auction}
354
+ client={auctions.client}
355
+ itemId={selected.itemId}
356
+ onBidSubmitted={() => auctions.refresh()}
357
+ onPurchaseComplete={() => auctions.refresh()}
358
+ onUncertain={(kind) => {
359
+ // Show an unresolved-result message. Do not retry a bid.
360
+ console.info(`${kind} result is unknown`);
361
+ }}
362
+ theme="light"
363
+ />
364
+ ) : (
365
+ <LockerverseAuctions
366
+ auctions={auctions}
367
+ onSelectItem={(auction, item) => setSelected({ auction, itemId: item.id })}
368
+ theme="light"
369
+ />
370
+ );
371
+ }
372
+ ```
373
+
374
+ Production is the default. Set `environment: "development"` on the hook only
375
+ when you intend to use the development backend. Auction data supplies the
376
+ publishable key and connected account for Stripe initialization. The backend
377
+ must include the auction `payment` configuration to use built-in checkout.
378
+
379
+ Both components accept `theme` and the existing `LockerverseStyle` CSS-variable
380
+ object. Use the hook data for your own item cards and open `LockerverseAuctionItem`
381
+ for checkout. No general headless workflow API is required.
382
+
383
+ `onBidSubmitted` means the bid request and any required Stripe action completed;
384
+ it does not mean the bid won or a charge occurred. `onPurchaseComplete` runs only
385
+ when Lockerverse reports `paid`. `onUncertain` means the result remains unknown.
386
+ Keep that state visible and use the checkout recovery action for a purchase.
387
+ Status checks call `client.getPurchaseStatus` without creating another payment;
388
+ the backend can reconcile Stripe status and send the purchase notification.
389
+ A `null` status lookup is not proof that an original in-flight request ended.
390
+ Any retry must keep the original `clientRequestId` and purchase details.
391
+ If a bid result is unknown, block a new bid and keep the support message visible.
392
+ Do not navigate away or unmount checkout while submission is in progress.
393
+ Never automatically retry a bid: the backend has no public bid recovery API.
394
+
395
+ For a host that needs recovery after navigation, connect
396
+ `onPurchaseRecoveryChange` and later pass its record as `resumePurchase`:
397
+
398
+ ```tsx
399
+ <LockerverseAuctionItem
400
+ auction={auction}
401
+ client={client}
402
+ itemId={itemId}
403
+ onPurchaseRecoveryChange={savePrivateRecoveryRecord}
404
+ resumePurchase={previousRecoveryRecord}
405
+ />
406
+ ```
407
+
408
+ The host owns storage. A recovery record captures the original item, payment
409
+ configuration, pricing, buyer contact data, and Stripe confirmation token. Keep it private; do not put it in URLs, analytics, logs, or
410
+ shared caches. Clear the stored record when the callback supplies `null`.
411
+ Resume only with the same auction, item, client, and payment environment. Keep
412
+ the original `clientRequestId` and purchase details. The public example stores
413
+ recovery in memory only and asks the customer to keep the page open.
414
+
415
+ The raw receipt endpoint returns amounts, not payment status. Do not use a
416
+ receipt response alone to show a payment as complete.
@@ -0,0 +1,348 @@
1
+ .lockerverse-auctions--catalog {
2
+ max-width: 1600px;
3
+ padding: 48px 24px;
4
+ margin-inline: auto;
5
+ container-type: inline-size;
6
+ background: var(--lockerverse-bg, #050505);
7
+ border-radius: 0;
8
+ }
9
+ .lockerverse-auctions__catalog-header {
10
+ margin-bottom: 32px;
11
+ }
12
+ .lockerverse-auctions__catalog-header h2 {
13
+ font-size: 36px;
14
+ font-weight: 600;
15
+ letter-spacing: -0.04em;
16
+ }
17
+ .lockerverse-auctions__catalog-header > div {
18
+ max-width: 672px;
19
+ margin-top: 12px;
20
+ font-size: 14px;
21
+ line-height: 24px;
22
+ color: var(--lockerverse-muted, #b5b1bc);
23
+ }
24
+ .lockerverse-auctions button.lockerverse-auctions__catalog-back {
25
+ display: inline-flex;
26
+ gap: 8px;
27
+ align-items: center;
28
+ min-height: 38px;
29
+ padding: 8px 12px;
30
+ margin-bottom: 28px;
31
+ font-size: 14px;
32
+ font-weight: 500;
33
+ background: rgb(255 255 255 / 4%);
34
+ border-radius: 999px;
35
+ }
36
+ .lockerverse-auctions__catalog-lineup {
37
+ display: flex;
38
+ gap: 8px;
39
+ align-items: flex-end;
40
+ justify-content: space-between;
41
+ margin-bottom: 20px;
42
+ }
43
+ .lockerverse-auctions__catalog-lineup h3 {
44
+ font-size: 24px;
45
+ font-weight: 600;
46
+ }
47
+ .lockerverse-auctions__catalog-lineup p {
48
+ margin: 4px 0 0;
49
+ font-size: 14px;
50
+ line-height: 24px;
51
+ }
52
+ .lockerverse-auctions__catalog-lineup > span {
53
+ font-size: 14px;
54
+ color: var(--lockerverse-muted);
55
+ white-space: nowrap;
56
+ }
57
+ .lockerverse-auctions__catalog-filters {
58
+ display: flex;
59
+ flex-wrap: wrap;
60
+ gap: 8px;
61
+ min-width: 0;
62
+ padding: 0;
63
+ margin-bottom: 20px;
64
+ border: 0;
65
+ }
66
+ .lockerverse-auctions__catalog-filters button {
67
+ display: inline-flex;
68
+ gap: 8px;
69
+ align-items: center;
70
+ min-height: 40px;
71
+ padding: 8px 16px;
72
+ font-size: 14px;
73
+ font-weight: 500;
74
+ background: rgb(255 255 255 / 4%);
75
+ border-radius: 999px;
76
+ }
77
+ .lockerverse-auctions__catalog-filters button[aria-pressed="true"] {
78
+ color: var(--lockerverse-bg);
79
+ background: var(--lockerverse-text);
80
+ }
81
+ .lockerverse-auctions__catalog-filters button span {
82
+ padding: 2px 8px;
83
+ font-size: 12px;
84
+ background: rgb(127 127 127 / 16%);
85
+ border-radius: 999px;
86
+ }
87
+ .lockerverse-auctions__catalog-grid {
88
+ display: grid;
89
+ grid-template-columns: minmax(0, 1fr);
90
+ gap: 24px;
91
+ padding: 0;
92
+ margin: 0;
93
+ list-style: none;
94
+ }
95
+ .lockerverse-auctions__catalog-grid > li {
96
+ min-width: 0;
97
+ }
98
+ .lockerverse-auctions__catalog-card {
99
+ position: relative;
100
+ display: flex;
101
+ flex-direction: column;
102
+ height: 100%;
103
+ overflow: hidden;
104
+ background: var(--lockerverse-control, #0a0a0c);
105
+ border: 1px solid var(--lockerverse-border);
106
+ border-radius: 30px;
107
+ box-shadow: 0 28px 80px rgb(0 0 0 / 42%);
108
+ transition:
109
+ transform 0.3s,
110
+ border-color 0.3s;
111
+ }
112
+ .lockerverse-auctions__catalog-card:hover {
113
+ border-color: rgb(255 255 255 / 20%);
114
+ transform: translateY(-4px);
115
+ }
116
+ .lockerverse-auctions button.lockerverse-auctions__catalog-select {
117
+ position: absolute;
118
+ inset: 0;
119
+ z-index: 3;
120
+ width: 100%;
121
+ height: 100%;
122
+ padding: 0;
123
+ background: transparent;
124
+ border: 0;
125
+ border-radius: 30px;
126
+ }
127
+ .lockerverse-auctions
128
+ button.lockerverse-auctions__catalog-select:focus-visible {
129
+ outline-offset: -3px;
130
+ }
131
+ .lockerverse-auctions__catalog-media {
132
+ position: relative;
133
+ aspect-ratio: 1.28;
134
+ overflow: hidden;
135
+ color: #fff;
136
+ background: #131316;
137
+ }
138
+ .lockerverse-auctions__catalog-media::after {
139
+ position: absolute;
140
+ inset: 0;
141
+ pointer-events: none;
142
+ content: "";
143
+ background:
144
+ linear-gradient(to top, #000, rgb(0 0 0 / 35%), transparent),
145
+ linear-gradient(to bottom, rgb(0 0 0 / 60%), transparent 50%);
146
+ }
147
+ .lockerverse-auctions__catalog-images {
148
+ position: absolute;
149
+ inset: 0;
150
+ }
151
+ .lockerverse-auctions__catalog-photo {
152
+ position: absolute;
153
+ inset: 0;
154
+ width: 100%;
155
+ height: 100%;
156
+ object-fit: cover;
157
+ opacity: 0;
158
+ transition:
159
+ opacity 0.5s,
160
+ transform 0.5s;
161
+ }
162
+ .lockerverse-auctions__catalog-photo[data-visible="true"] {
163
+ opacity: 1;
164
+ }
165
+ .lockerverse-auctions__catalog-card:hover .lockerverse-auctions__catalog-photo {
166
+ transform: scale(1.03);
167
+ }
168
+ .lockerverse-auctions__catalog-chips {
169
+ position: absolute;
170
+ top: 16px;
171
+ right: 16px;
172
+ left: 16px;
173
+ z-index: 1;
174
+ display: flex;
175
+ gap: 12px;
176
+ align-items: flex-start;
177
+ justify-content: space-between;
178
+ }
179
+ .lockerverse-auctions__catalog-chip,
180
+ .lockerverse-auctions__catalog-timing {
181
+ padding: 6px 12px;
182
+ font-size: 11px;
183
+ line-height: 16px;
184
+ text-transform: uppercase;
185
+ letter-spacing: 0.24em;
186
+ background: rgb(0 0 0 / 55%);
187
+ border: 1px solid rgb(255 255 255 / 15%);
188
+ border-radius: 999px;
189
+ backdrop-filter: blur(8px);
190
+ }
191
+ .lockerverse-auctions__catalog-timing {
192
+ color: rgb(255 255 255 / 72%);
193
+ text-align: right;
194
+ background: rgb(255 255 255 / 8%);
195
+ }
196
+ .lockerverse-auctions__catalog-chip[data-live="true"] {
197
+ color: #d1fae5;
198
+ background: rgb(52 211 153 / 12%);
199
+ border-color: rgb(110 231 183 / 20%);
200
+ }
201
+ .lockerverse-auctions__catalog-metrics {
202
+ position: absolute;
203
+ inset: auto 16px 16px;
204
+ z-index: 1;
205
+ display: grid;
206
+ grid-template-columns: repeat(2, minmax(0, 1fr));
207
+ gap: 12px;
208
+ margin: 0;
209
+ }
210
+ .lockerverse-auctions__catalog-metric {
211
+ min-width: 0;
212
+ padding: 12px 16px;
213
+ background: rgb(0 0 0 / 55%);
214
+ border: 1px solid rgb(255 255 255 / 12%);
215
+ border-radius: 20px;
216
+ backdrop-filter: blur(8px);
217
+ }
218
+ .lockerverse-auctions__catalog-metric dt {
219
+ display: flex;
220
+ gap: 8px;
221
+ align-items: center;
222
+ font-size: 11px;
223
+ color: rgb(255 255 255 / 55%);
224
+ text-transform: uppercase;
225
+ letter-spacing: 0.22em;
226
+ }
227
+ .lockerverse-auctions__catalog-metric dt svg {
228
+ flex-shrink: 0;
229
+ }
230
+ .lockerverse-auctions__catalog-metric dd {
231
+ margin: 8px 0 0;
232
+ overflow: hidden;
233
+ text-overflow: ellipsis;
234
+ font-size: 16px;
235
+ font-weight: 600;
236
+ letter-spacing: -0.02em;
237
+ white-space: nowrap;
238
+ }
239
+ .lockerverse-auctions__catalog-body {
240
+ display: flex;
241
+ flex: 1;
242
+ flex-direction: column;
243
+ gap: 10px;
244
+ padding: 16px 20px 20px;
245
+ }
246
+ .lockerverse-auctions__catalog-body h3 {
247
+ display: -webkit-box;
248
+ -webkit-box-orient: vertical;
249
+ overflow: hidden;
250
+ -webkit-line-clamp: 2;
251
+ font-size: 22px;
252
+ font-weight: 600;
253
+ line-height: 1.25;
254
+ letter-spacing: -0.03em;
255
+ }
256
+ .lockerverse-auctions__catalog-description {
257
+ display: -webkit-box;
258
+ -webkit-box-orient: vertical;
259
+ overflow: hidden;
260
+ -webkit-line-clamp: 2;
261
+ font-size: 14px;
262
+ line-height: 24px;
263
+ color: var(--lockerverse-muted, #b5b1bc);
264
+ }
265
+ .lockerverse-auctions__catalog-description p {
266
+ margin: 0;
267
+ }
268
+ .lockerverse-auctions__catalog-footer {
269
+ display: flex;
270
+ gap: 16px;
271
+ align-items: center;
272
+ justify-content: space-between;
273
+ padding-top: 6px;
274
+ margin-top: auto;
275
+ }
276
+ .lockerverse-auctions__catalog-footer--item {
277
+ justify-content: flex-end;
278
+ }
279
+ .lockerverse-auctions__catalog-cta {
280
+ display: inline-flex;
281
+ gap: 8px;
282
+ align-items: center;
283
+ padding: 10px 20px;
284
+ font-size: 14px;
285
+ font-weight: 600;
286
+ text-transform: uppercase;
287
+ letter-spacing: 0.12em;
288
+ background: rgb(255 255 255 / 6%);
289
+ border: 1px solid var(--lockerverse-border);
290
+ border-radius: 999px;
291
+ transition:
292
+ background 0.2s,
293
+ color 0.2s;
294
+ }
295
+ .lockerverse-auctions__catalog-card:hover .lockerverse-auctions__catalog-cta {
296
+ color: var(--lockerverse-bg);
297
+ background: var(--lockerverse-text);
298
+ }
299
+ .lockerverse-auctions__catalog-arrow {
300
+ display: flex;
301
+ align-items: center;
302
+ justify-content: center;
303
+ width: 44px;
304
+ height: 44px;
305
+ border: 1px solid var(--lockerverse-border);
306
+ border-radius: 999px;
307
+ }
308
+ .lockerverse-auctions__catalog-empty {
309
+ padding: 32px;
310
+ text-align: center;
311
+ background: var(--lockerverse-control);
312
+ border: 1px solid var(--lockerverse-border);
313
+ border-radius: 8px;
314
+ }
315
+ @container (min-width: 720px) {
316
+ .lockerverse-auctions__catalog-grid {
317
+ grid-template-columns: repeat(2, minmax(0, 1fr));
318
+ }
319
+ }
320
+ @container (min-width: 1232px) {
321
+ .lockerverse-auctions__catalog-grid {
322
+ grid-template-columns: repeat(3, minmax(0, 1fr));
323
+ }
324
+ }
325
+ @container (max-width: 500px) {
326
+ .lockerverse-auctions__catalog-header h2 {
327
+ font-size: 30px;
328
+ }
329
+ .lockerverse-auctions__catalog-lineup {
330
+ flex-direction: column;
331
+ align-items: flex-start;
332
+ }
333
+ }
334
+ @media (max-width: 639px) {
335
+ .lockerverse-auctions--catalog {
336
+ padding: 48px 16px;
337
+ }
338
+ }
339
+ @media (prefers-reduced-motion: reduce) {
340
+ .lockerverse-auctions__catalog-card,
341
+ .lockerverse-auctions__catalog-photo,
342
+ .lockerverse-auctions__catalog-cta {
343
+ transition: none;
344
+ }
345
+ .lockerverse-auctions__catalog-card:hover {
346
+ transform: none;
347
+ }
348
+ }
@@ -0,0 +1,266 @@
1
+ .lockerverse-auctions .lockerverse-auctions__checkout {
2
+ display: block;
3
+ padding: 0;
4
+ margin: 0;
5
+ overflow: hidden;
6
+ background: var(--lockerverse-control, #111216);
7
+ border: 1px solid var(--lockerverse-border);
8
+ border-radius: 32px;
9
+ box-shadow: 0 30px 90px rgb(0 0 0 / 45%);
10
+ }
11
+ .lockerverse-auctions__checkout-header,
12
+ .lockerverse-auctions__checkout-body {
13
+ padding: 28px;
14
+ }
15
+ .lockerverse-auctions__checkout-header {
16
+ border-bottom: 1px solid var(--lockerverse-border);
17
+ }
18
+ .lockerverse-auctions__checkout-navigation {
19
+ display: flex;
20
+ gap: 16px;
21
+ align-items: center;
22
+ justify-content: space-between;
23
+ margin-bottom: 24px;
24
+ }
25
+ .lockerverse-auctions__checkout-navigation > div {
26
+ text-align: right;
27
+ }
28
+ .lockerverse-auctions .lockerverse-auctions__checkout-eyebrow {
29
+ margin: 0;
30
+ font-size: 11px;
31
+ color: var(--lockerverse-muted);
32
+ text-transform: uppercase;
33
+ letter-spacing: 0.32em;
34
+ }
35
+ .lockerverse-auctions__checkout-navigation p + p {
36
+ margin: 8px 0 0;
37
+ font-size: 14px;
38
+ }
39
+ .lockerverse-auctions__checkout-back {
40
+ display: inline-flex;
41
+ flex: 0 0 44px;
42
+ align-items: center;
43
+ justify-content: center;
44
+ width: 44px;
45
+ height: 44px;
46
+ padding: 0;
47
+ font: inherit;
48
+ font-size: 30px;
49
+ color: var(--lockerverse-text);
50
+ cursor: pointer;
51
+ background: rgb(255 255 255 / 4%);
52
+ border: 1px solid var(--lockerverse-border);
53
+ border-radius: 50%;
54
+ }
55
+ .lockerverse-auctions__checkout-back:disabled {
56
+ cursor: not-allowed;
57
+ opacity: 0.4;
58
+ }
59
+ .lockerverse-auctions .lockerverse-auctions__checkout-header h2 {
60
+ margin-top: 12px;
61
+ font-size: 30px;
62
+ font-weight: 600;
63
+ letter-spacing: -0.04em;
64
+ }
65
+ .lockerverse-auctions .lockerverse-auctions__checkout-summary {
66
+ margin-top: 12px;
67
+ }
68
+ .lockerverse-auctions__checkout strong {
69
+ font-weight: 600;
70
+ color: var(--lockerverse-text);
71
+ }
72
+ .lockerverse-auctions .lockerverse-auctions__checkout p {
73
+ font-size: 14px;
74
+ line-height: 2;
75
+ }
76
+ .lockerverse-auctions
77
+ .lockerverse-auctions__checkout
78
+ p.lockerverse-auctions__checkout-eyebrow {
79
+ font-size: 11px;
80
+ }
81
+ .lockerverse-auctions__checkout-physical {
82
+ padding: 20px;
83
+ margin-top: 20px;
84
+ background: linear-gradient(
85
+ 135deg,
86
+ rgb(255 255 255 / 5%),
87
+ rgb(255 255 255 / 2%)
88
+ );
89
+ border: 1px solid var(--lockerverse-border);
90
+ border-radius: 24px;
91
+ }
92
+ .lockerverse-auctions .lockerverse-auctions__checkout fieldset {
93
+ display: block;
94
+ min-width: 0;
95
+ padding: 0;
96
+ margin: 0;
97
+ border: 0;
98
+ }
99
+ .lockerverse-auctions__checkout-contact {
100
+ display: grid;
101
+ grid-template-columns: repeat(2, minmax(0, 1fr));
102
+ gap: 16px;
103
+ }
104
+ .lockerverse-auctions__checkout .lockerverse-auctions__field {
105
+ display: flex;
106
+ flex-direction: column;
107
+ gap: 8px;
108
+ font-size: 14px;
109
+ }
110
+ .lockerverse-auctions__checkout .lockerverse-auctions__field input {
111
+ width: 100%;
112
+ min-width: 0;
113
+ height: 48px;
114
+ padding: 0 16px;
115
+ font: inherit;
116
+ color: var(--lockerverse-text);
117
+ background: var(--lockerverse-bg);
118
+ border: 1px solid #3a3944;
119
+ border-radius: 18px;
120
+ }
121
+ .lockerverse-auctions__checkout-phone-help {
122
+ font-size: 12px;
123
+ color: var(--lockerverse-muted);
124
+ }
125
+ .lockerverse-auctions__checkout-section {
126
+ display: grid;
127
+ gap: 12px;
128
+ padding-top: 20px;
129
+ margin-top: 24px;
130
+ border-top: 1px solid var(--lockerverse-border);
131
+ }
132
+ .lockerverse-auctions .lockerverse-auctions__checkout-section h3 {
133
+ margin: 0;
134
+ font-size: 14px;
135
+ font-weight: 500;
136
+ line-height: 1.5;
137
+ }
138
+ .lockerverse-auctions__checkout-section-heading {
139
+ display: flex;
140
+ flex-wrap: wrap;
141
+ column-gap: 16px;
142
+ align-items: baseline;
143
+ justify-content: space-between;
144
+ }
145
+ .lockerverse-auctions .lockerverse-auctions__checkout-section p {
146
+ margin: 0;
147
+ }
148
+ .lockerverse-auctions__checkout-checkbox {
149
+ display: flex;
150
+ gap: 16px;
151
+ align-items: flex-start;
152
+ cursor: pointer;
153
+ }
154
+ .lockerverse-auctions__checkout
155
+ .lockerverse-auctions__checkout-checkbox
156
+ > input {
157
+ flex: 0 0 16px;
158
+ width: 16px;
159
+ height: 16px;
160
+ margin: 4px 0 0;
161
+ accent-color: var(--lockerverse-accent);
162
+ }
163
+ .lockerverse-auctions__checkout-checkbox > span {
164
+ display: grid;
165
+ gap: 6px;
166
+ font-size: 14px;
167
+ }
168
+ .lockerverse-auctions__checkout-checkbox > span > span {
169
+ line-height: 2;
170
+ color: var(--lockerverse-muted);
171
+ }
172
+ .lockerverse-auctions__checkout-delivery {
173
+ padding: 20px;
174
+ background: rgb(255 255 255 / 3%);
175
+ border: 1px solid var(--lockerverse-border);
176
+ border-radius: 24px;
177
+ }
178
+ .lockerverse-auctions__checkout-footer {
179
+ display: flex;
180
+ gap: 16px;
181
+ align-items: center;
182
+ justify-content: space-between;
183
+ padding-top: 20px;
184
+ margin-top: 24px;
185
+ border-top: 1px solid var(--lockerverse-border);
186
+ }
187
+ .lockerverse-auctions .lockerverse-auctions__checkout-footer p {
188
+ max-width: 576px;
189
+ margin: 0;
190
+ }
191
+ .lockerverse-auctions .lockerverse-auctions__checkout-submit {
192
+ flex-shrink: 0;
193
+ min-height: 48px;
194
+ padding: 12px 24px;
195
+ font-size: 14px;
196
+ font-weight: 600;
197
+ text-transform: uppercase;
198
+ letter-spacing: 0.14em;
199
+ border-radius: 999px;
200
+ box-shadow: 0 18px 40px rgb(0 0 0 / 32%);
201
+ }
202
+ @media (max-width: 639px) {
203
+ .lockerverse-auctions__checkout-header,
204
+ .lockerverse-auctions__checkout-body {
205
+ padding: 24px;
206
+ }
207
+
208
+ .lockerverse-auctions__checkout-footer {
209
+ flex-direction: column;
210
+ align-items: stretch;
211
+ }
212
+ .lockerverse-auctions__checkout-delivery,
213
+ .lockerverse-auctions__checkout-physical {
214
+ padding: 16px;
215
+ }
216
+ }
217
+
218
+ @media (max-width: 767px) {
219
+ .lockerverse-auctions__checkout-contact {
220
+ grid-template-columns: minmax(0, 1fr);
221
+ }
222
+ }
223
+
224
+ .lockerverse-auctions__phone {
225
+ display: flex;
226
+ width: 100%;
227
+ min-width: 0;
228
+ }
229
+ .lockerverse-auctions__phone-country {
230
+ position: relative;
231
+ display: inline-flex;
232
+ flex-shrink: 0;
233
+ align-items: center;
234
+ padding: 0 10px;
235
+ color: var(--lockerverse-muted);
236
+ background: var(--lockerverse-bg);
237
+ border: 1px solid #3a3944;
238
+ border-radius: 18px 0 0 18px;
239
+ }
240
+ .lockerverse-auctions__phone-country > span {
241
+ display: inline-flex;
242
+ gap: 5px;
243
+ align-items: center;
244
+ white-space: nowrap;
245
+ }
246
+ .lockerverse-auctions__phone-country select {
247
+ position: absolute;
248
+ inset: 0;
249
+ width: 100%;
250
+ cursor: pointer;
251
+ opacity: 0;
252
+ }
253
+ .lockerverse-auctions__phone-country:focus-within {
254
+ z-index: 1;
255
+ outline: 2px solid var(--lockerverse-accent);
256
+ outline-offset: 2px;
257
+ }
258
+ .lockerverse-auctions__phone-flag {
259
+ width: 20px;
260
+ overflow: hidden;
261
+ font-size: 17px;
262
+ }
263
+ .lockerverse-auctions__checkout .lockerverse-auctions__phone input {
264
+ margin-left: -1px;
265
+ border-radius: 0 18px 18px 0;
266
+ }
@@ -0,0 +1,2 @@
1
+ import{jsx as e,jsxs as t}from"react/jsx-runtime";import n from"sanitize-html";function r(e,t=e.status){let n=t===`draft`,r=n?e.startAt:e.endAt,i=new Date(r);if(!Number.isFinite(i.getTime()))return``;let a=(n?e.configuration.startTimeEnabled:e.configuration.endTimeEnabled)??!0,o=new Intl.DateTimeFormat(`en-US`,{day:`numeric`,month:`short`,timeZone:`America/New_York`,year:`numeric`}).format(i);return a?`${o} at ${new Intl.DateTimeFormat(`en-US`,{hour:`numeric`,minute:`2-digit`,timeZone:`America/New_York`,timeZoneName:`short`}).format(i)}`:o}function i(e){return new Intl.NumberFormat(`en-US`,{currency:`USD`,maximumFractionDigits:2,minimumFractionDigits:0,style:`currency`}).format(e/100)}function a(e,t){return e.status===`finished`||t?.status===`finished`||Date.parse(e.endAt)<=Date.now()?`finished`:e.status===`draft`||t?.status===`draft`||Date.parse(e.startAt)>Date.now()?`draft`:`active`}function o({kind:n}){return t(`svg`,{"aria-hidden":`true`,fill:`none`,height:`16`,stroke:`currentColor`,strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:`1.6`,viewBox:`0 0 24 24`,width:`16`,children:[n===`clock`?e(`circle`,{cx:`12`,cy:`12`,r:`9`}):null,e(`path`,{d:{arrow:`M5 12h14m-6-6 6 6-6 6`,back:`m15 6-6 6 6 6`,bag:`M5 7h14l1 14H4L5 7Zm4 0V5a3 3 0 0 1 6 0v2`,clock:`M12 8v4l3 2`,gavel:`m14 3 7 7m-9-5 7 7M3 21l10-10M3 17l4 4M10 7l7 7`,items:`M9 6h11M9 12h11M9 18h11M3 6h1M3 12h1M3 18h1`,shield:`M12 22s8-4 8-11V5l-8-3-8 3v6c0 7 8 11 8 11Zm-4-11 3 3 5-5`,timer:`M10 2h4M12 8v4l2 2M3 11a9 9 0 1 0 3-6M3 3v5h5`}[n]})]})}const s=/<\/?(?:p|br|strong|em|u|s|ul|ol|li|blockquote|pre|code|hr|h[1-6]|a)(?:\s|\/?>)/i;function c(e,t=!0){return s.test(e)?n(e,{allowedAttributes:{a:t?[`href`]:[],ol:[`start`]},allowedSchemes:[`http`,`https`,`mailto`,`tel`],allowedTags:[`p`,`br`,`strong`,`em`,`u`,`s`,`ul`,`ol`,`li`,`blockquote`,`pre`,`code`,`hr`,`h1`,`h2`,`h3`,`h4`,`h5`,`h6`,...t?[`a`]:[]],allowProtocolRelative:!1}):e.replace(/&/g,`&amp;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`).replace(/\r\n|\r|\n/g,`<br>`)}function l(e){return s.test(e)?n(e.replace(/<\/?(?:p|br|li|ul|ol|blockquote|pre|hr|h[1-6])(?:\s[^>]*)?\/?>/gi,` `),{allowedAttributes:{},allowedTags:[]}).replace(/&nbsp;/g,` `).replace(/&lt;/g,`<`).replace(/&gt;/g,`>`).replace(/&quot;/g,`"`).replace(/&#39;/g,`'`).replace(/&amp;/g,`&`).replace(/\s+/g,` `).trim():e.trim()}function u({description:t,links:n=!0,className:r,id:i}){return e(`div`,{className:[`lockerverse-auctions__description`,r].filter(Boolean).join(` `),dangerouslySetInnerHTML:{__html:c(t,n)},id:i})}export{i as a,r as i,l as n,a as o,o as r,u as t};
2
+ //# sourceMappingURL=auction-description.js.map