airport-one-widgets 0.2.106 → 0.3.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/README.md +38 -0
- package/dist/airport-one-widgets.iife.js +8 -8
- package/package.json +6 -6
package/README.md
CHANGED
|
@@ -296,6 +296,44 @@ On phones (viewport under 640px) the Airline, Traveling, and Hub menus open as a
|
|
|
296
296
|
|
|
297
297
|
Demo: `/demo/route-map.html` (`npm run dev`).
|
|
298
298
|
|
|
299
|
+
## Destination Showcase
|
|
300
|
+
|
|
301
|
+
`fma-destination-showcase` (AIR-1798) shows an airport's destinations as cards, a list, portrait tiles, or a carousel. Data comes from `GET /v1/widget-instances/{id}/destination-showcase`: the route map's schedule data plus, when AirportOne has turned pricing on for the airport (portal General widget settings, platform admins only), fares seen in the last 48 hours. Photos come from the Asset Library: the airport's own pick for the route, then the destination's linked library images, then platform assets tagged with the destination IATA (never the legacy header-destinations files); a destination with none shows a tinted placeholder. Like the route map it renders only for an active instance allowlisted for the embedding site, or from `previewPayload` in the portal builder. Any number of instances can share a page.
|
|
302
|
+
|
|
303
|
+
```html
|
|
304
|
+
<fma-destination-showcase
|
|
305
|
+
data-widget-instance-id="YOUR-INSTANCE-ID"
|
|
306
|
+
></fma-destination-showcase>
|
|
307
|
+
```
|
|
308
|
+
|
|
309
|
+
It lays out by the width of its container, not the viewport (container queries, with a media-query fallback):
|
|
310
|
+
|
|
311
|
+
| Container | Cards | Tiles | List | Carousel |
|
|
312
|
+
| --------- | ----- | ------------- | --------- | --------------------------- |
|
|
313
|
+
| ≥ 980 px | 3 | 4 | 2 columns | 3 visible |
|
|
314
|
+
| 620–980 | 2 | 3 | 1 | 2 |
|
|
315
|
+
| 380–620 | 1 | 2 | 1 | 1 + next peeking, no arrows |
|
|
316
|
+
| < 380 | 1 | 1 (landscape) | 1 | 1 |
|
|
317
|
+
|
|
318
|
+
Attributes (each overrides the saved instance):
|
|
319
|
+
|
|
320
|
+
| Attribute | Default | Purpose |
|
|
321
|
+
| ----------------------------------------------------------------------------------- | -------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
322
|
+
| `view` | `cards` | `cards`, `list`, `tiles`, or `carousel`. Travelers never change it |
|
|
323
|
+
| `shows` | `featured` | `featured`, `nonstop`, `one-stop`, or `all` (Featured / Nonstop / 1-stop chips for the traveler) |
|
|
324
|
+
| `featured-destinations` | promoted IATAs | Comma-separated IATAs in display order. Unserved codes are dropped; none served falls back to the airport's promoted IATAs (Settings > Promoted IATAs), then to its nonstops |
|
|
325
|
+
| `per-page` | `6` | `3`, `6`, `8`, `9`, or `12`. List shows double; the carousel shows everything |
|
|
326
|
+
| `show-eyebrow` / `show-title` / `show-subheading` / `show-see-all` / `show-filters` | on | `false` hides that part. All of the first four off leaves a bare content block |
|
|
327
|
+
| `heading` | per filter | Replaces the title |
|
|
328
|
+
| `primary-color` / `cta-color` / `cta-hover-color` | airport brand | Links, day pills and the tile price badge / the "See current price" button and eyebrow / button hover (a darker CTA if unset) |
|
|
329
|
+
| `font-family` / `border-radius` | host font / 16 | Font stack; card corner radius in px (0–32) |
|
|
330
|
+
|
|
331
|
+
The card, tile, or row body opens the FlyMyAirport destination page; the button opens KAYAK through the redirect worker (`a1_wid` / `a1_wtype`) on the fare's dates, or, with no fare, the first day at least 14 days out that the route flies, for four nights. The KAYAK footnote always shows: the AIR-1034 wording with pricing on, "Powered by KAYAK." without. Segment events (under `consent-analytics`): `showcase_click`, `showcase_filter`, `showcase_sort`, `showcase_more`, plus the shared `Widget V2 Mount` / `Widget V2 Public Config`.
|
|
332
|
+
|
|
333
|
+
CSS parts: `showcase-container`, `showcase-header`, `showcase-chips`, `showcase-item`, `showcase-footnote`.
|
|
334
|
+
|
|
335
|
+
Demo: `/demo/destination-showcase.html` (`npm run dev`) renders sample ATW data through `previewPayload` with controls for view, shows, pricing, and placement width.
|
|
336
|
+
|
|
299
337
|
## Carfare Search
|
|
300
338
|
|
|
301
339
|
Core Purpose:
|