@vio-live/web-sdk 0.29.0 → 0.32.0
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/CHANGELOG.md +171 -0
- package/README.md +108 -15
- package/dist/{chunk-L6YYYKQK.js → chunk-C5Q6W4B2.js} +1392 -202
- package/dist/chunk-C5Q6W4B2.js.map +1 -0
- package/dist/{chunk-AG4G2S2M.js → chunk-IR4XYTZL.js} +493 -79
- package/dist/chunk-IR4XYTZL.js.map +1 -0
- package/dist/chunk-QGJUBVH3.js +3 -0
- package/dist/{chunk-67QESEV2.js.map → chunk-QGJUBVH3.js.map} +1 -1
- package/dist/core/index.d.ts +147 -3
- package/dist/core/index.js +2 -2
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/react/index.d.ts +2 -2
- package/dist/react/index.js +3 -3
- package/dist/{tokens-Dok4d21V.d.ts → tokens-D1DCVzOf.d.ts} +311 -21
- package/dist/ui/index.d.ts +1 -1
- package/dist/ui/index.js +3 -3
- package/package.json +1 -1
- package/dist/chunk-67QESEV2.js +0 -3
- package/dist/chunk-AG4G2S2M.js.map +0 -1
- package/dist/chunk-L6YYYKQK.js.map +0 -1
|
@@ -9,6 +9,18 @@ declare class VioProduct extends LitElement {
|
|
|
9
9
|
name: string;
|
|
10
10
|
/** Pre-formatted price string (e.g. "990 kr"). Bold. */
|
|
11
11
|
price: string;
|
|
12
|
+
/** Short text under the name (plain text, cut after --vio-card-description-lines, 4). Shown only with `show-description`. */
|
|
13
|
+
description: string;
|
|
14
|
+
/** Show `description` under the name. Off by default. */
|
|
15
|
+
showDescription: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* The buy button, as in the Vev card: `icon` (the round bag on the image —
|
|
18
|
+
* default), `bar` (a full-width button under the price) or `hidden`. Both
|
|
19
|
+
* add to the cart, or open the product when it has sizes to pick.
|
|
20
|
+
*/
|
|
21
|
+
buttonStyle: 'icon' | 'bar' | 'hidden';
|
|
22
|
+
/** Text of the `bar` button (default «Kjøp»); «Kjøp · 2» once two are in the cart. */
|
|
23
|
+
buttonLabel: string;
|
|
12
24
|
/** Retailer / sponsor name shown at the bottom (uppercase, gray). */
|
|
13
25
|
retailer: string;
|
|
14
26
|
/** Product image URL. Square aspect, gray bg if missing. */
|
|
@@ -135,6 +147,26 @@ declare class VioProductCarousel extends LitElement {
|
|
|
135
147
|
productRefs: string;
|
|
136
148
|
/** Currency for product prices. */
|
|
137
149
|
currency: string;
|
|
150
|
+
/**
|
|
151
|
+
* `carousel` (default: one row that scrolls sideways) or `list` (the cards
|
|
152
|
+
* one under the other, full width, like products inside an article). Unset
|
|
153
|
+
* = the theme's `carouselLayout` (`--vio-carousel-layout`).
|
|
154
|
+
*/
|
|
155
|
+
layout: string;
|
|
156
|
+
/** Every card shows its product's description (see `descriptions` to write your own). Off by default. */
|
|
157
|
+
showDescription: boolean;
|
|
158
|
+
/**
|
|
159
|
+
* The editor's own text per product, over the catalogue's: `{ "<productId>": "text" }`
|
|
160
|
+
* (attribute: the same as JSON). Shown even without `show-description`; `""`
|
|
161
|
+
* hides that product's description.
|
|
162
|
+
*/
|
|
163
|
+
descriptions: Record<string, string>;
|
|
164
|
+
/** The cards' buy button: `icon` (default), `bar` or `hidden` — see `<vio-product>`. */
|
|
165
|
+
buttonStyle: 'icon' | 'bar' | 'hidden';
|
|
166
|
+
/** Text of the `bar` button (default «Kjøp»). */
|
|
167
|
+
buttonLabel: string;
|
|
168
|
+
/** `layout` resolved against the theme on connect. */
|
|
169
|
+
private resolvedLayout;
|
|
138
170
|
/**
|
|
139
171
|
* Slot this carousel sits in (ADR-0027). Optional: without it the carousel
|
|
140
172
|
* registers itself as `carousel-N` (its position among the carousels on the
|
|
@@ -179,6 +211,11 @@ declare class VioProductCarousel extends LitElement {
|
|
|
179
211
|
private isLoading;
|
|
180
212
|
private fetchError;
|
|
181
213
|
static styles: lit.CSSResult;
|
|
214
|
+
private overrideFor;
|
|
215
|
+
private descriptionFor;
|
|
216
|
+
/** The editor's text always shows (unless empty); the catalogue's only with show-description. */
|
|
217
|
+
private showsDescription;
|
|
218
|
+
willUpdate(changed: Map<string, unknown>): void;
|
|
182
219
|
connectedCallback(): void;
|
|
183
220
|
disconnectedCallback(): void;
|
|
184
221
|
updated(changed: Map<string, unknown>): void;
|
|
@@ -196,6 +233,8 @@ declare class VioProductCarousel extends LitElement {
|
|
|
196
233
|
/** view_item_list needs BOTH the viewport dwell and loaded products —
|
|
197
234
|
* whichever lands last fires it (once). */
|
|
198
235
|
private maybeTrackList;
|
|
236
|
+
/** The products on show as analytics lines (impression and view_item_list); null before they load. */
|
|
237
|
+
private listCommerce;
|
|
199
238
|
private parseRefs;
|
|
200
239
|
private scrollByDirection;
|
|
201
240
|
private renderScrollerContent;
|
|
@@ -207,6 +246,13 @@ declare global {
|
|
|
207
246
|
}
|
|
208
247
|
}
|
|
209
248
|
|
|
249
|
+
/** One of the brand's promises under the buy zone («Rask levering», «Designet i Norge»). */
|
|
250
|
+
interface VioDetailHighlight {
|
|
251
|
+
/** A built-in line icon (see HIGHLIGHT_ICONS: plane, heart, shirt, truck, return, leaf, star, shield) or an image URL. */
|
|
252
|
+
icon?: string;
|
|
253
|
+
title: string;
|
|
254
|
+
text?: string;
|
|
255
|
+
}
|
|
210
256
|
declare class VioProductDetail extends LitElement {
|
|
211
257
|
open: boolean;
|
|
212
258
|
productId: string;
|
|
@@ -243,6 +289,46 @@ declare class VioProductDetail extends LitElement {
|
|
|
243
289
|
vioContentId: string;
|
|
244
290
|
/** Per-element override of the content title. */
|
|
245
291
|
vioContentTitle: string;
|
|
292
|
+
/**
|
|
293
|
+
* No «Lagt i handlekurven» toast after «Legg i handlekurv» — for a host
|
|
294
|
+
* that answers `vio:added-to-cart` with its own (opening its cart drawer,
|
|
295
|
+
* say). Off by default: the toast shows.
|
|
296
|
+
*/
|
|
297
|
+
noAddedToast: boolean;
|
|
298
|
+
/**
|
|
299
|
+
* How the images show: `thumbs` (one image, thumbnails under it — the
|
|
300
|
+
* default) or `carousel` (every image in one swipeable row, no thumbnails:
|
|
301
|
+
* less height). Unset = the theme's `detailGallery` (`--vio-detail-gallery`),
|
|
302
|
+
* so a host sets it once for every detail on the page.
|
|
303
|
+
*/
|
|
304
|
+
gallery: string;
|
|
305
|
+
/**
|
|
306
|
+
* «Beskrivelse»: `preview` (default — the first lines fading out and «Les
|
|
307
|
+
* mer»), `folded` (only the heading until a tap) or `open` (all of it).
|
|
308
|
+
* Unset = the theme's `detailDescriptionMode` (`--vio-detail-description-mode`).
|
|
309
|
+
*/
|
|
310
|
+
descriptionMode: string;
|
|
311
|
+
/**
|
|
312
|
+
* The brand's promises, shown in a row under the buy zone. By default the
|
|
313
|
+
* brand's own (dashboard Settings → Brand, in the bootstrap); this list
|
|
314
|
+
* replaces them on this page — e.g.
|
|
315
|
+
* `[{ icon: 'plane', title: 'Rask levering', text: '2-5 virkedager' }]`
|
|
316
|
+
* (attribute: the same as JSON). Up to three read well. None by default.
|
|
317
|
+
*/
|
|
318
|
+
highlights: VioDetailHighlight[];
|
|
319
|
+
/**
|
|
320
|
+
* How long delivery takes (`2-5 virkedager`), for a brand whose rates do not
|
|
321
|
+
* say it: Commerce's own text on each rate («Leveringstid 1-5 dager») wins.
|
|
322
|
+
* Shown under the rates in «Frakt & retur». None by default.
|
|
323
|
+
*/
|
|
324
|
+
deliveryTime: string;
|
|
325
|
+
/**
|
|
326
|
+
* Carrier logos for «Frakt & retur», by the carrier's name as the rate
|
|
327
|
+
* starts (`{ "Bring": "https://…/bring.svg", "Helthjem": "…" }`, any case;
|
|
328
|
+
* attribute: the same as JSON), for rates without their own logo in
|
|
329
|
+
* Commerce (which wins). A carrier with neither gets the line icon.
|
|
330
|
+
*/
|
|
331
|
+
carrierLogos: Record<string, string>;
|
|
246
332
|
private readonly slotRegistration;
|
|
247
333
|
/** What the click that opened the detail carried ('' when nothing), and for which product. */
|
|
248
334
|
private eventSlot;
|
|
@@ -272,23 +358,65 @@ declare class VioProductDetail extends LitElement {
|
|
|
272
358
|
*/
|
|
273
359
|
private sellerName;
|
|
274
360
|
private sellerSettled;
|
|
361
|
+
/**
|
|
362
|
+
* The cheapest shipping rate of the product for the page's market, in the
|
|
363
|
+
* product's currency — under the price as «Frakt fra X» («Gratis frakt» at
|
|
364
|
+
* 0). null = not known (not asked yet, none, or another currency): only the
|
|
365
|
+
* right of withdrawal is said then.
|
|
366
|
+
*/
|
|
367
|
+
private shippingFrom;
|
|
368
|
+
/** Every rate for the page's country, cheapest first — for «Frakt & retur». */
|
|
369
|
+
private shippingRates;
|
|
275
370
|
private isLoading;
|
|
276
371
|
private fetchError;
|
|
277
372
|
private selectedOptions;
|
|
373
|
+
/** The option a buy button asked for and the shopper has not chosen yet ('' = none asked). */
|
|
374
|
+
private selectionPrompt;
|
|
278
375
|
private quantity;
|
|
279
376
|
private activeImageIndex;
|
|
280
377
|
/** The thumbnail row is wider than its box (arrows shown with a mouse). */
|
|
281
378
|
private thumbsOverflow;
|
|
282
379
|
private thumbsAtStart;
|
|
283
380
|
private thumbsAtEnd;
|
|
381
|
+
/** «Beskrivelse» shows a preview until a tap opens it all. */
|
|
382
|
+
private descriptionOpen;
|
|
383
|
+
/** The description is longer than its preview (otherwise there is nothing to open). */
|
|
384
|
+
private descriptionClipped;
|
|
385
|
+
/** `gallery` resolved against the theme when the detail opens. */
|
|
386
|
+
private galleryMode;
|
|
387
|
+
/** `description-mode` resolved against the theme when the detail opens. */
|
|
388
|
+
private resolvedDescriptionMode;
|
|
284
389
|
/** The top bar's logo file is square-ish: a mark, so its name goes beside it. */
|
|
285
390
|
private logoSquare;
|
|
286
391
|
private adding;
|
|
392
|
+
/**
|
|
393
|
+
* «Lagt i handlekurven» after an add, with «Til kassen» and «Fortsett å
|
|
394
|
+
* handle» (Mote & Livsstil, 2026-10-28: an add closed the detail and said
|
|
395
|
+
* nothing). Outlives the detail: the brand and attribution of the add.
|
|
396
|
+
*/
|
|
397
|
+
private addedToast;
|
|
398
|
+
private addedToastTimer;
|
|
287
399
|
/** Apple Pay actually usable (real Stripe + registered domain) — set on load. */
|
|
288
400
|
private applePayOk;
|
|
289
401
|
/** Payment method names enabled for the sponsor (backend-configured).
|
|
290
402
|
* null = not loaded yet → all buy buttons render; [] = none enabled. */
|
|
291
403
|
private availableMethods;
|
|
404
|
+
/**
|
|
405
|
+
* The brand's methods are being asked for. Meanwhile the buy zone shows a
|
|
406
|
+
* neutral placeholder, never the buttons of every method: «null = render
|
|
407
|
+
* all» painted Stripe and Klarna for a Vipps-only brand until the answer
|
|
408
|
+
* came (Mote & Livsstil, 2026-10-28).
|
|
409
|
+
*/
|
|
410
|
+
private methodsLoading;
|
|
411
|
+
/**
|
|
412
|
+
* The brand's Vipps is KNOWN to run Express: its method list came back,
|
|
413
|
+
* with Vipps and no `config.express: false`. Only then does the line under
|
|
414
|
+
* the button say the app fills in name and address — never on a guess
|
|
415
|
+
* after a failed lookup.
|
|
416
|
+
*/
|
|
417
|
+
private vippsExpress;
|
|
418
|
+
/** Whose methods `availableMethods` are — another brand's are not shown while its own load. */
|
|
419
|
+
private methodsSponsorId;
|
|
292
420
|
private vippsOfficial;
|
|
293
421
|
/** Race guard: only the latest fetch may write state (two quick taps on
|
|
294
422
|
* different cards would otherwise let the slow response win). */
|
|
@@ -310,6 +438,19 @@ declare class VioProductDetail extends LitElement {
|
|
|
310
438
|
connectedCallback(): void;
|
|
311
439
|
disconnectedCallback(): void;
|
|
312
440
|
updated(changed: Map<string, unknown>): void;
|
|
441
|
+
willUpdate(changed: Map<string, unknown>): void;
|
|
442
|
+
/** An option as the element says it, else as the theme's custom property says it (lower case, unquoted). */
|
|
443
|
+
private themeChoice;
|
|
444
|
+
/** The attribute wins; else the theme's `--vio-detail-gallery`; else thumbnails. */
|
|
445
|
+
private resolveGalleryMode;
|
|
446
|
+
private carouselTrack;
|
|
447
|
+
/** The photo in view is the active one (dots, Apple Pay sheet, events). */
|
|
448
|
+
private onCarouselScroll;
|
|
449
|
+
/** One photo's width plus the gap (with a peek a photo is narrower than the row). */
|
|
450
|
+
private carouselStep;
|
|
451
|
+
/** Bring the active photo into view — only when it is not already the one a swipe is on. */
|
|
452
|
+
private revealActiveSlide;
|
|
453
|
+
private stepCarousel;
|
|
313
454
|
private thumbRow;
|
|
314
455
|
/** Arrows only when the row overflows; each one off at its own end. */
|
|
315
456
|
private measureThumbs;
|
|
@@ -323,6 +464,8 @@ declare class VioProductDetail extends LitElement {
|
|
|
323
464
|
private fetchProduct;
|
|
324
465
|
/** Which buy buttons to render — backend-configured per sponsor. */
|
|
325
466
|
private loadAvailablePaymentMethods;
|
|
467
|
+
/** The methods are still on their way: a placeholder stands where the buttons go. */
|
|
468
|
+
private get methodsPending();
|
|
326
469
|
/** Backend names arrive as e.g. "Apple Pay" — compare letters only. */
|
|
327
470
|
private methodEnabled;
|
|
328
471
|
/**
|
|
@@ -353,18 +496,55 @@ declare class VioProductDetail extends LitElement {
|
|
|
353
496
|
/** True if some in-stock variant carries this option value. */
|
|
354
497
|
private isValueAvailable;
|
|
355
498
|
private get unitPrice();
|
|
499
|
+
/**
|
|
500
|
+
* There is something to pay for — whether the express buttons show. With
|
|
501
|
+
* every option chosen, the chosen variant's price; before that, the
|
|
502
|
+
* product's or any variant's: the first variant (what `unitPrice` falls
|
|
503
|
+
* back to) at 0 must not hide Vipps for a size that costs 699.
|
|
504
|
+
*/
|
|
505
|
+
private get hasPrice();
|
|
356
506
|
private get compareAt();
|
|
507
|
+
/** The options the shopper has to choose (those with values), in order. */
|
|
508
|
+
private choosableOptions;
|
|
509
|
+
/** The first option still without a value, or null when every one is chosen. */
|
|
510
|
+
private missingOption;
|
|
511
|
+
/**
|
|
512
|
+
* Units that can be sold. With every option chosen, the chosen variant's;
|
|
513
|
+
* before that, the most any variant still matching the partial choice has
|
|
514
|
+
* — so the stepper and «Utsolgt» do not speak for a variant (the first
|
|
515
|
+
* one) the shopper never picked.
|
|
516
|
+
*/
|
|
357
517
|
private get availableQuantity();
|
|
518
|
+
/**
|
|
519
|
+
* «Få igjen — N stk» only for the variant actually chosen: before a size is
|
|
520
|
+
* picked the count belonged to the first variant, which said «Få igjen» of
|
|
521
|
+
* a product with plenty of other sizes.
|
|
522
|
+
*/
|
|
358
523
|
private stockLabel;
|
|
524
|
+
/** «Velg størrelse» for a size, «Velg farge» for a colour… */
|
|
525
|
+
private promptFor;
|
|
526
|
+
/**
|
|
527
|
+
* Every buy button goes through here first: with an option not chosen yet,
|
|
528
|
+
* nothing is added or paid — the picker says what is missing and comes
|
|
529
|
+
* into view (it sits right above the buttons, inside the buy zone).
|
|
530
|
+
*/
|
|
531
|
+
private requireSelection;
|
|
359
532
|
/** Pick an option value. If the exact combination doesn't exist, jump to an
|
|
360
533
|
* in-stock variant that carries the value and adopt its full option map
|
|
361
534
|
* (keeps the selection always resolvable to a real variant). */
|
|
362
535
|
private selectOption;
|
|
536
|
+
private applyOption;
|
|
363
537
|
private allImages;
|
|
364
538
|
private get activeImage();
|
|
365
539
|
/** Add the current product + selected variant + qty to the cart. Returns the variant id used. */
|
|
366
540
|
private addCurrentToCart;
|
|
367
541
|
private addToCart;
|
|
542
|
+
/** The toast after an add; it goes by itself after a while. */
|
|
543
|
+
private showAddedToast;
|
|
544
|
+
private hideAddedToast;
|
|
545
|
+
/** «Til kassen»: the checkout of the brand just added to — the host opens it on `vio:checkout-open`, as from the cart. */
|
|
546
|
+
private toastToCheckout;
|
|
547
|
+
private renderAddedToast;
|
|
368
548
|
/**
|
|
369
549
|
* Express buy: add to cart, then open the checkout overlay with Klarna
|
|
370
550
|
* preselected. The host app handles `vio:checkout-open` (same event the cart
|
|
@@ -397,6 +577,12 @@ declare class VioProductDetail extends LitElement {
|
|
|
397
577
|
/** Vipps' own button when its script answers; our orange one otherwise. */
|
|
398
578
|
private loadVippsButton;
|
|
399
579
|
private buyWithVipps;
|
|
580
|
+
/**
|
|
581
|
+
* The Vipps button will open the app with Express (see buyWithVipps): the
|
|
582
|
+
* brand has Express on, and this brand's cart is empty — with lines in it
|
|
583
|
+
* the checkout opens first.
|
|
584
|
+
*/
|
|
585
|
+
private vippsGoesStraightToApp;
|
|
400
586
|
private startVippsExpressOrCheckout;
|
|
401
587
|
/** The ordinary way in, Vipps preselected: the host opens the checkout on `vio:checkout-open`. */
|
|
402
588
|
private openCheckoutWithVipps;
|
|
@@ -423,6 +609,35 @@ declare class VioProductDetail extends LitElement {
|
|
|
423
609
|
* that total.
|
|
424
610
|
*/
|
|
425
611
|
private buyWithApplePay;
|
|
612
|
+
/**
|
|
613
|
+
* The product's cheapest rate for the page's market — the rates the
|
|
614
|
+
* backend cart offers for its line. A rate in another currency than the
|
|
615
|
+
* product's price is not shown (never a price the shopper would not pay).
|
|
616
|
+
*/
|
|
617
|
+
private loadShippingFrom;
|
|
618
|
+
/**
|
|
619
|
+
* `gallery="carousel"`: every photo in one row that snaps one at a time —
|
|
620
|
+
* swipe on touch, arrows with a mouse — and a dot per photo over it
|
|
621
|
+
* instead of thumbnails, so the name, price and sizes come up higher.
|
|
622
|
+
*/
|
|
623
|
+
private renderCarousel;
|
|
624
|
+
/**
|
|
625
|
+
* «Beskrivelse», not shut: the first lines show, fading out, and a tap on
|
|
626
|
+
* the heading, the text or «Les mer» opens the rest (Angelo, 2026-10-28).
|
|
627
|
+
* A description that fits in the preview has nothing to open.
|
|
628
|
+
*/
|
|
629
|
+
private renderDescription;
|
|
630
|
+
/** Is the preview hiding part of the text? Measured with the preview applied. */
|
|
631
|
+
private measureDescription;
|
|
632
|
+
private renderHighlights;
|
|
633
|
+
/**
|
|
634
|
+
* «Frakt & retur», folded like «Beskrivelse»: the delivery options for the
|
|
635
|
+
* page's country with their price, and the right of withdrawal with the
|
|
636
|
+
* brand's own terms and returns pages when it gave them.
|
|
637
|
+
*/
|
|
638
|
+
private renderShippingReturns;
|
|
639
|
+
/** Under the price: «Frakt fra X · 14 dagers angrerett» (or «Gratis frakt · …»). */
|
|
640
|
+
private renderDeliveryNote;
|
|
426
641
|
/** The seller's Company name; the brand when there is none; nothing while asking. */
|
|
427
642
|
private headerName;
|
|
428
643
|
private loadSeller;
|
|
@@ -468,6 +683,8 @@ declare class VioCart extends LitElement {
|
|
|
468
683
|
/** Payment method names enabled for the sponsor (backend-configured).
|
|
469
684
|
* null = not loaded yet → all buttons render; [] = none enabled. */
|
|
470
685
|
private availableMethods;
|
|
686
|
+
/** Asking for the brand's methods: a neutral placeholder instead of every method's button (see methodEnabled). */
|
|
687
|
+
private methodsLoading;
|
|
471
688
|
private vippsOfficial;
|
|
472
689
|
/** Whether the method lookup has been attempted — see boundOnCartChange. */
|
|
473
690
|
private paymentMethodsAttempted;
|
|
@@ -493,7 +710,13 @@ declare class VioCart extends LitElement {
|
|
|
493
710
|
/** Which payment buttons to render — backend-configured per sponsor.
|
|
494
711
|
* Falls back to showing everything if the query fails or none is set. */
|
|
495
712
|
private loadAvailablePaymentMethods;
|
|
496
|
-
/**
|
|
713
|
+
/** The methods are on their way and none is known yet. */
|
|
714
|
+
private get methodsPending();
|
|
715
|
+
/**
|
|
716
|
+
* Backend names arrive as e.g. "Apple Pay" — compare letters only. While
|
|
717
|
+
* the list loads, no method's button is drawn: «unknown = all» painted
|
|
718
|
+
* Stripe and Klarna for a Vipps-only brand until it came.
|
|
719
|
+
*/
|
|
497
720
|
private methodEnabled;
|
|
498
721
|
updated(changed: Map<string, unknown>): void;
|
|
499
722
|
/** Pre-resolve the Apple Pay sheet for the current cart total. */
|
|
@@ -518,25 +741,36 @@ declare class VioCart extends LitElement {
|
|
|
518
741
|
*/
|
|
519
742
|
private onCheckout;
|
|
520
743
|
/**
|
|
521
|
-
* Vipps
|
|
522
|
-
*
|
|
523
|
-
*
|
|
524
|
-
*
|
|
744
|
+
* Vipps from the cart: the checkout opens with Vipps preselected — the
|
|
745
|
+
* standard path, where our form collects name, address, mobile and the
|
|
746
|
+
* delivery (with its price) before paying (Mote & Livsstil, 2026-10-28).
|
|
747
|
+
* It no longer starts Express from here: Express is the product detail's
|
|
748
|
+
* «Kjøp nå med Vipps» only.
|
|
525
749
|
*/
|
|
526
750
|
private onVipps;
|
|
527
751
|
/** Vipps' own button when its script answers; our orange one otherwise. */
|
|
528
752
|
private loadVippsButton;
|
|
529
|
-
private startVippsExpressOrCheckout;
|
|
530
753
|
/** Stripe — opens the checkout with Stripe preselected. */
|
|
531
754
|
private onStripe;
|
|
532
755
|
/** The name over a sponsor's lines: the brand's display name by the one rule, else what the cart kept. */
|
|
533
756
|
private sponsorLabel;
|
|
757
|
+
/** Something to pay for: lines, and a total above 0. No button opens a checkout or a payment otherwise. */
|
|
758
|
+
private get payable();
|
|
534
759
|
private get totalAcrossSponsors();
|
|
760
|
+
/**
|
|
761
|
+
* Shipping across the carts, from what the server cart says of its lines:
|
|
762
|
+
* the rate chosen for them, else the cheapest one offered (the one the
|
|
763
|
+
* checkout preselects). null when some cart has no known rate — the footer
|
|
764
|
+
* says it is worked out in the checkout then.
|
|
765
|
+
*/
|
|
766
|
+
private get shippingAcrossSponsors();
|
|
535
767
|
private get primaryCurrency();
|
|
536
768
|
private onIncrement;
|
|
537
769
|
private onDecrement;
|
|
538
770
|
private onRemove;
|
|
539
771
|
render(): lit_html.TemplateResult<1>;
|
|
772
|
+
/** «Frakt» (the chosen or cheapest rate) and «Totalt» with it; «Beregnes i kassen» when unknown. */
|
|
773
|
+
private renderShippingRows;
|
|
540
774
|
private renderConfirmation;
|
|
541
775
|
}
|
|
542
776
|
declare global {
|
|
@@ -549,12 +783,6 @@ declare class VioCheckout extends LitElement {
|
|
|
549
783
|
open: boolean;
|
|
550
784
|
heading: string;
|
|
551
785
|
shippingLabel: string;
|
|
552
|
-
/**
|
|
553
|
-
* Vipps Express: the shopper picks the delivery inside Vipps, so with Vipps
|
|
554
|
-
* selected our own shipping rate is not part of the total and the summary
|
|
555
|
-
* says the shipping is chosen in Vipps (Angelo, 2026-10-24).
|
|
556
|
-
*/
|
|
557
|
-
private vippsShipsInApp;
|
|
558
786
|
/** Express mode — render only the Klarna widget (no address form / method grid). */
|
|
559
787
|
express: boolean;
|
|
560
788
|
private checkoutState;
|
|
@@ -810,7 +1038,20 @@ declare class VioCheckout extends LitElement {
|
|
|
810
1038
|
* shopcart refuses the physical case on its side.
|
|
811
1039
|
*/
|
|
812
1040
|
private someLineShipsOnItsOwn;
|
|
813
|
-
/**
|
|
1041
|
+
/** The shipping country the mobile's calling code defaults to (no +prefix typed). */
|
|
1042
|
+
private get phoneCountry();
|
|
1043
|
+
/**
|
|
1044
|
+
* The mobile is required only for the standard Vipps payment — shopcart
|
|
1045
|
+
* does not ask Vipps for the profile there. Every other method takes it
|
|
1046
|
+
* when given and never waits for it (a host that pre-fills the form with
|
|
1047
|
+
* `setAddress()` and no phone keeps working).
|
|
1048
|
+
*/
|
|
1049
|
+
private get phoneRequired();
|
|
1050
|
+
/** A number typed that is not usable (nothing said while the field is empty). */
|
|
1051
|
+
private get phoneError();
|
|
1052
|
+
/** The mobile as the chosen method needs it: valid when required, else anything. */
|
|
1053
|
+
private get phoneReady();
|
|
1054
|
+
/** Whether all mandatory Leveringsadresse fields are filled (the mobile only for Vipps). */
|
|
814
1055
|
private get isAddressValid();
|
|
815
1056
|
/** Whether a valid shipping option is selected (when shippings exist). */
|
|
816
1057
|
private get hasSelectedShipping();
|
|
@@ -865,14 +1106,21 @@ declare class VioCheckout extends LitElement {
|
|
|
865
1106
|
/** After choosing a method that needs our form, bring the form into view. */
|
|
866
1107
|
private revealAddressForm;
|
|
867
1108
|
/**
|
|
868
|
-
* Vipps from the checkout:
|
|
869
|
-
*
|
|
870
|
-
*
|
|
871
|
-
*
|
|
872
|
-
*
|
|
873
|
-
*
|
|
1109
|
+
* Vipps from the checkout: the STANDARD payment, always (Mote & Livsstil,
|
|
1110
|
+
* 2026-10-28). The shopper filled our form — name, address, mobile — and
|
|
1111
|
+
* chose the delivery with its price here; the payment carries that address
|
|
1112
|
+
* and the rate on the cart, and Vipps only approves and pays. Express (the
|
|
1113
|
+
* app filling in name and address) is the product detail's «Kjøp nå med
|
|
1114
|
+
* Vipps» alone, even when the brand has Express on.
|
|
874
1115
|
*/
|
|
875
1116
|
private startVippsFromCheckout;
|
|
1117
|
+
/**
|
|
1118
|
+
* The chosen delivery on the cart before a hosted payment is minted (its
|
|
1119
|
+
* total depends on it). False — and the payment must not start — when it
|
|
1120
|
+
* could not be saved: the selected rate has no supplier to save it under,
|
|
1121
|
+
* or the backend refused. A cart with no rates at all has nothing to save.
|
|
1122
|
+
*/
|
|
1123
|
+
private persistSelectedShipping;
|
|
876
1124
|
private onApplePay;
|
|
877
1125
|
private onPay;
|
|
878
1126
|
/**
|
|
@@ -939,13 +1187,17 @@ declare class VioCheckout extends LitElement {
|
|
|
939
1187
|
private methodLabel;
|
|
940
1188
|
/** True for methods that complete via a separate sheet/widget, not the CTA. */
|
|
941
1189
|
private isExpressMethod;
|
|
1190
|
+
/**
|
|
1191
|
+
* A total above 0 — every pay button needs it. The state's subtotal follows
|
|
1192
|
+
* the cart (CheckoutManager.onCartChange): a cart emptied or paid in
|
|
1193
|
+
* another tab drops it to 0 here.
|
|
1194
|
+
*/
|
|
1195
|
+
private get cartPayable();
|
|
942
1196
|
private orderTotal;
|
|
943
1197
|
/** Shipping cost (major units) whenever a shipping option is in effect —
|
|
944
1198
|
* express always has one; the normal flow has one once the backend
|
|
945
1199
|
* shippings loaded (the choice IS persisted on the cart and charged). */
|
|
946
1200
|
private shippingMajor;
|
|
947
|
-
/** Vipps is the method and it runs as Express: the delivery is chosen in Vipps. */
|
|
948
|
-
private vippsChoosesShipping;
|
|
949
1201
|
/** The rate the summary names — Qliro's own pick while Qliro is the method. */
|
|
950
1202
|
private summaryShippingName;
|
|
951
1203
|
/** Total to charge — items + shipping (express). */
|
|
@@ -1317,6 +1569,20 @@ interface VioThemeOverrides {
|
|
|
1317
1569
|
detailImageInset?: string;
|
|
1318
1570
|
/** Background behind the main image (default the muted surface). */
|
|
1319
1571
|
detailImageBg?: string;
|
|
1572
|
+
/** `thumbs` (default: one image, thumbnails under it) or `carousel` (every image in one swipeable row with a dot per photo, no thumbnails — less height). An element's `gallery` attribute wins over it. */
|
|
1573
|
+
detailGallery?: string;
|
|
1574
|
+
/** In the carousel, how much of the next photo shows at the edge (default `0px`), e.g. `32px`. */
|
|
1575
|
+
detailCarouselPeek?: string;
|
|
1576
|
+
/** «Beskrivelse»: `preview` (default — first lines + «Les mer»), `folded` (heading only until a tap) or `open`. An element's `description-mode` wins. */
|
|
1577
|
+
detailDescriptionMode?: string;
|
|
1578
|
+
/** Lines the «Beskrivelse» preview shows (default `3`). */
|
|
1579
|
+
detailDescriptionPreviewLines?: string;
|
|
1580
|
+
/** The brand's promises under the buy zone: `grid` (default, shown when the brand has some) or `none` (hidden). */
|
|
1581
|
+
detailHighlightsDisplay?: string;
|
|
1582
|
+
/** «Frakt & retur» in the detail: `block` (default) or `none` (hidden). */
|
|
1583
|
+
detailShippingReturnsDisplay?: string;
|
|
1584
|
+
/** `<vio-product-carousel>`: `carousel` (default, one row) or `list` (cards one under the other). Its `layout` attribute wins. */
|
|
1585
|
+
carouselLayout?: string;
|
|
1320
1586
|
/** Thumbnail size (default `64px`). One row, scrolls sideways. */
|
|
1321
1587
|
detailThumbSize?: string;
|
|
1322
1588
|
/** Space between thumbnails (default `8px`). */
|
|
@@ -1341,6 +1607,30 @@ interface VioThemeOverrides {
|
|
|
1341
1607
|
detailBuyPosition?: string;
|
|
1342
1608
|
/** Shadow over a sticky buy zone, e.g. `0 -8px 16px rgba(0,0,0,.06)`. */
|
|
1343
1609
|
detailBuyShadow?: string;
|
|
1610
|
+
/** Font of the card (default the SDK's sans). */
|
|
1611
|
+
cardFont?: string;
|
|
1612
|
+
/** Frame around the card, e.g. `1px solid rgba(230,230,230,.6)` (default none). */
|
|
1613
|
+
cardBorder?: string;
|
|
1614
|
+
/** Image box proportion (default `1 / 1`), e.g. `3 / 4`. */
|
|
1615
|
+
cardImageAspect?: string;
|
|
1616
|
+
/** `cover` (default, fills and crops) or `contain` (whole image). */
|
|
1617
|
+
cardImageFit?: string;
|
|
1618
|
+
/** Background behind the card image (default the muted surface). */
|
|
1619
|
+
cardImageBg?: string;
|
|
1620
|
+
/** Space around the image inside its box (default `0`). */
|
|
1621
|
+
cardImagePadding?: string;
|
|
1622
|
+
/** Padding of the text under the image (default `14px 0 0`), e.g. `16px` in a framed card. */
|
|
1623
|
+
cardMetaPadding?: string;
|
|
1624
|
+
/** Font of the price (default the card's), e.g. a serif. */
|
|
1625
|
+
cardPriceFont?: string;
|
|
1626
|
+
/** Colour of the `bar` buy button (default the text colour). */
|
|
1627
|
+
cardAccent?: string;
|
|
1628
|
+
/** Corners of the `bar` buy button (default `6px`). */
|
|
1629
|
+
cardBarRadius?: string;
|
|
1630
|
+
/** Lines of the description a card shows (default `4`). */
|
|
1631
|
+
cardDescriptionLines?: string;
|
|
1632
|
+
/** `-1` lifts the seller line above the name (where a brand line goes); default `0` (at the bottom). */
|
|
1633
|
+
cardRetailerOrder?: string;
|
|
1344
1634
|
/** Cart drawer width on desktop (default `440px`). */
|
|
1345
1635
|
cartWidth?: string;
|
|
1346
1636
|
/** Checkout panel width on desktop (default `440px`). */
|
package/dist/ui/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { V as VioCart, a as VioCheckout, b as VioProduct, c as VioProductCarousel, d as VioProductDetail, e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-
|
|
1
|
+
export { V as VioCart, a as VioCheckout, b as VioProduct, c as VioProductCarousel, d as VioProductDetail, e as VioThemeOverrides, f as VioTokens, g as applyVioTheme } from '../tokens-D1DCVzOf.js';
|
|
2
2
|
import 'lit-html';
|
|
3
3
|
import 'lit';
|
|
4
4
|
|
package/dist/ui/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { registerVioElements } from '../chunk-
|
|
2
|
-
export { VioCart, VioCheckout, VioProduct, VioProductCarousel, VioProductDetail, VioTokens, applyVioTheme, registerVioElements } from '../chunk-
|
|
3
|
-
import '../chunk-
|
|
1
|
+
import { registerVioElements } from '../chunk-C5Q6W4B2.js';
|
|
2
|
+
export { VioCart, VioCheckout, VioProduct, VioProductCarousel, VioProductDetail, VioTokens, applyVioTheme, registerVioElements } from '../chunk-C5Q6W4B2.js';
|
|
3
|
+
import '../chunk-IR4XYTZL.js';
|
|
4
4
|
|
|
5
5
|
// src/ui/index.ts
|
|
6
6
|
registerVioElements();
|
package/package.json
CHANGED
package/dist/chunk-67QESEV2.js
DELETED