@aurodesignsystem-dev/auro-flightline 0.0.0-pr101.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 +359 -0
- package/LICENSE +201 -0
- package/NOTICE +2 -0
- package/README.md +137 -0
- package/demo/api.html +56 -0
- package/demo/api.js +1 -0
- package/demo/api.md +386 -0
- package/demo/api.min.js +4 -0
- package/demo/auro-flightline.min.js +432 -0
- package/demo/dotCompliance.md +194 -0
- package/demo/index.html +56 -0
- package/demo/index.js +7 -0
- package/demo/index.md +57 -0
- package/demo/index.min.js +7 -0
- package/dist/auro-flightline-Ua1BdkHT.js +27 -0
- package/dist/index.d.ts +33 -0
- package/dist/index.js +1 -0
- package/dist/registered.js +1 -0
- package/package.json +87 -0
package/demo/index.html
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
<!--
|
|
2
|
+
Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
3
|
+
See LICENSE in the project root for license information.
|
|
4
|
+
|
|
5
|
+
HTML in this document is standardized and NOT to be edited.
|
|
6
|
+
All demo code should be added/edited in ./demo/index.md
|
|
7
|
+
|
|
8
|
+
With the exception of adding custom elements if needed for the demo.
|
|
9
|
+
|
|
10
|
+
----------------------- DO NOT EDIT -----------------------------
|
|
11
|
+
|
|
12
|
+
-->
|
|
13
|
+
|
|
14
|
+
<!DOCTYPE html>
|
|
15
|
+
<html lang="en">
|
|
16
|
+
<head>
|
|
17
|
+
<meta charset="UTF-8" />
|
|
18
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
19
|
+
<title>Auro Web Component Demo | auro-flightline</title>
|
|
20
|
+
|
|
21
|
+
<!-- Prism.js Stylesheet -->
|
|
22
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
|
|
23
|
+
|
|
24
|
+
<!-- Legacy reference is still needed to support auro-flightline's use of legacy token values at this time -->
|
|
25
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
|
|
26
|
+
|
|
27
|
+
<!-- Design Token Alaska Theme -->
|
|
28
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
|
|
29
|
+
|
|
30
|
+
<!-- Webcore Stylesheet Alaska Theme -->
|
|
31
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
|
|
32
|
+
|
|
33
|
+
<!-- Demo Specific Styles -->
|
|
34
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
|
|
35
|
+
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
|
|
36
|
+
</head>
|
|
37
|
+
<body class="auro-markdown">
|
|
38
|
+
<main></main>
|
|
39
|
+
|
|
40
|
+
<script type="module">
|
|
41
|
+
import 'https://cdn.jsdelivr.net/npm/marked@latest/marked.min.js';
|
|
42
|
+
import 'https://cdn.jsdelivr.net/npm/prismjs@latest/prism.js';
|
|
43
|
+
fetch('./index.md')
|
|
44
|
+
.then((response) => response.text())
|
|
45
|
+
.then((text) => {
|
|
46
|
+
const rawHtml = marked.parse(text);
|
|
47
|
+
document.querySelector('main').innerHTML = rawHtml;
|
|
48
|
+
Prism.highlightAll();
|
|
49
|
+
});
|
|
50
|
+
</script>
|
|
51
|
+
<script type="module" data-demo-script="true" src="./index.min.js"></script>
|
|
52
|
+
|
|
53
|
+
<!-- If additional elements are needed for the demo, add them here. -->
|
|
54
|
+
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@latest/dist/auro-accordion__bundled.js" type="module"></script>
|
|
55
|
+
</body>
|
|
56
|
+
</html>
|
package/demo/index.js
ADDED
package/demo/index.md
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
<!--
|
|
2
|
+
THIS PAGE'S CONTENT SHOULD BE KEPT MINIMAL.
|
|
3
|
+
ONLY ADD EXAMPLES THAT ARE TRULY NECESSARY FOR THE INDEX PAGE — THE BASIC EXAMPLE IS USUALLY ENOUGH.
|
|
4
|
+
ALL OTHER EXAMPLES SHOULD GO IN THE API DOCUMENTATION.
|
|
5
|
+
-->
|
|
6
|
+
|
|
7
|
+
# Flightline
|
|
8
|
+
|
|
9
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/description.md) -->
|
|
10
|
+
<!-- The below content is automatically added from ./../docs/partials/description.md -->
|
|
11
|
+
The `<auro-flightline>` component represents any layovers and/or stopovers a guest may encounter throughout their journey.
|
|
12
|
+
|
|
13
|
+
For mobile, the number of stops is automatically calculated by the number of layovers and/or stopovers added in the DOM via the `auro-flight-segment` element.
|
|
14
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
15
|
+
|
|
16
|
+
## Use Cases
|
|
17
|
+
|
|
18
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../docs/partials/useCases.md) -->
|
|
19
|
+
<!-- The below content is automatically added from ./../docs/partials/useCases.md -->
|
|
20
|
+
The `<auro-flightline>` element should be used in situations where users may:
|
|
21
|
+
|
|
22
|
+
* Flying from SEA (Seattle, WA) to AVP (Scranton, PA) will require a *layover* in ORD (Chicago, IL)
|
|
23
|
+
* Flying from [ANC (Anchorage, AK) to ADK (Adak Island, AK) will have a *stopover* in CDB (Cold Bay, AK)](https://onemileatatime.com/alaska-airlines-adak-cold-bay/). These passengers will not deplane in Cold Bay. Stopover duration cannot be predicted due to variants in passenger and cargo loads.
|
|
24
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
25
|
+
|
|
26
|
+
## Example(s)
|
|
27
|
+
|
|
28
|
+
### Basic
|
|
29
|
+
|
|
30
|
+
<div class="exampleWrapper">
|
|
31
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/canceled-stop-and-layovers.html) -->
|
|
32
|
+
<!-- The below content is automatically added from ./../apiExamples/canceled-stop-and-layovers.html -->
|
|
33
|
+
<auro-flightline>
|
|
34
|
+
<auro-flight-segment stopover iata="YAK"></auro-flight-segment>
|
|
35
|
+
<auro-flight-segment stopover iata="WRG"></auro-flight-segment>
|
|
36
|
+
<auro-flight-segment canceled iata="SEA" duration="0h 40m"></auro-flight-segment>
|
|
37
|
+
<auro-flight-segment iata="BOS" duration="1h 40m"></auro-flight-segment>
|
|
38
|
+
<auro-flight-segment canceled destinationCanceled iata="DUB" duration="13h 40m"></auro-flight-segment>
|
|
39
|
+
</auro-flightline>
|
|
40
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
41
|
+
</div>
|
|
42
|
+
<auro-accordion alignRight>
|
|
43
|
+
<span slot="trigger">See code</span>
|
|
44
|
+
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/canceled-stop-and-layovers.html) -->
|
|
45
|
+
<!-- The below code snippet is automatically added from ./../apiExamples/canceled-stop-and-layovers.html -->
|
|
46
|
+
|
|
47
|
+
```html
|
|
48
|
+
<auro-flightline>
|
|
49
|
+
<auro-flight-segment stopover iata="YAK"></auro-flight-segment>
|
|
50
|
+
<auro-flight-segment stopover iata="WRG"></auro-flight-segment>
|
|
51
|
+
<auro-flight-segment canceled iata="SEA" duration="0h 40m"></auro-flight-segment>
|
|
52
|
+
<auro-flight-segment iata="BOS" duration="1h 40m"></auro-flight-segment>
|
|
53
|
+
<auro-flight-segment canceled destinationCanceled iata="DUB" duration="13h 40m"></auro-flight-segment>
|
|
54
|
+
</auro-flightline>
|
|
55
|
+
```
|
|
56
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
57
|
+
</auro-accordion>
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import{css as e,LitElement as s,html as t}from"lit";import{classMap as a}from"lit/directives/class-map.js";import{html as i}from"lit/static-html.js";class l{registerComponent(e,s){customElements.get(e)||customElements.define(e,class extends s{})}closestElement(e,s=this,t=(s,a=s&&s.closest(e))=>s&&s!==document&&s!==window?a||t(s.getRootNode().host):null){return t(s)}handleComponentTagRename(e,s){const t=s.toLowerCase();e.tagName.toLowerCase()!==t&&e.setAttribute(t,!0)}elementMatch(e,s){const t=s.toLowerCase();return e.tagName.toLowerCase()===t||e.hasAttribute(t)}getSlotText(e,s){const t=e.shadowRoot?.querySelector(`slot[name="${s}"]`);return(t?.assignedNodes({flatten:!0})||[]).map(e=>e.textContent?.trim()).join(" ").trim()||null}}var r=e`.wrapper:before{border-top-color:var(--ds-auro-flightline-segment-line-color)}.wrapper:after{border-top-color:var(--ds-auro-flightline-destination-line-color)}.iata{color:var(--ds-auro-flightline-segment-iata-text-color)}.duration{color:var(--ds-auro-flightline-layover-duration-color)}.leg{border-color:var(--ds-auro-flightline-layover-marker-border-color);background-color:var(--ds-auro-flightline-layover-marker-container-color)}.leg--stopover{--ds-auro-flightline-layover-marker-container-color: var(--ds-basic-color-surface-default, #ffffff)}.leg--canceled{--ds-auro-flightline-layover-marker-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-flightline-layover-marker-container-color: var(--ds-basic-color-status-error, #e31f26)}:host([nextday]){--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-status-error, #e31f26)}:host([canceled]){--ds-auro-flightline-segment-line-color: var(--ds-basic-color-status-error, #e31f26)}:host([destinationCanceled]){--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-flightline-destination-line-color: var(--ds-basic-color-status-error, #e31f26)}
|
|
2
|
+
`,n=e`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{flex-grow:1;flex-basis:0}.wrapper{position:relative}.wrapper:before,.wrapper:after{border-top-width:var(--ds-size-25, .125rem);border-top-style:solid;position:absolute;top:.5rem;z-index:1}.wrapper:before{content:"";right:50%;width:100%}.wrapper:after{left:50%;width:50%}:host(:first-child) .wrapper:before,:host(:only-of-type) .wrapper:before{width:50%}:host(:last-child) .wrapper:after,:host(:only-of-type) .wrapper:after{content:""}:host([canceled]) .wrapper:before{border-top-width:var(--ds-size-25, .125rem);border-top-style:dashed}:host([destinationCanceled]) .wrapper:after{border-top-width:var(--ds-size-25, .125rem);border-top-style:dashed}.layout{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;z-index:2;width:100%}.leg{border-style:solid;border-width:var(--ds-size-25, .125rem);border-radius:50%;width:var(--ds-size-150, .75rem);height:var(--ds-size-150, .75rem)}@media screen and (min-width: 576px){.leg{width:var(--ds-size-200, 1rem);height:var(--ds-size-200, 1rem)}}.iata{margin-top:var(--ds-size-150, .75rem)}
|
|
3
|
+
`,o=e`:host{--ds-auro-flightline-destination-line-color: var(--ds-advanced-color-flightline-line, #00274a);--ds-auro-flightline-segment-iata-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-flightline-segment-line-color: var(--ds-advanced-color-flightline-line, #00274a);--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-flightline-layover-marker-border-color: var(--ds-advanced-color-flightline-indicator, #00274a);--ds-auro-flightline-layover-marker-container-color: var(--ds-advanced-color-flightline-indicator, #00274a)}
|
|
4
|
+
`;class c extends s{constructor(){super(),this._initializeDefaults()}_initializeDefaults(){this.stopover=!1,this.canceled=!1,this.destinationCanceled=!1,this.partialCancel=!1}static get properties(){return{canceled:{type:Boolean,reflect:!0},destinationCanceled:{type:Boolean,reflect:!0},duration:{type:String},iata:{type:String},nextDay:{type:Boolean,reflect:!0},partialCancel:{type:Boolean,reflect:!0},stopover:{type:Boolean,reflect:!0}}}static get styles(){return[e`${n}`,e`${r}`,e`${o}`]}static register(e="auro-flight-segment"){l.prototype.registerComponent(e,c)}firstUpdated(){l.prototype.handleComponentTagRename(this,"auro-flight-segment")}render(){const e={leg:!0,layout:!0,"leg--stopover":this.stopover,"leg--canceled":this.canceled||this.partialCancel};return i`
|
|
5
|
+
<div class="wrapper">
|
|
6
|
+
<div class="layout">
|
|
7
|
+
<slot></slot>
|
|
8
|
+
<div class="${a(e)}"></div>
|
|
9
|
+
<span class="iata body-default">${this.iata}</span>
|
|
10
|
+
${this.duration?i`<span class="duration body-xs">${this.duration}</span>`:void 0}
|
|
11
|
+
</div>
|
|
12
|
+
</div>
|
|
13
|
+
`}}var d=e`.nonstop:before,.canceled:before{border-top-color:var(--ds-auro-flightline-segment-line-color)}:host([canceled]){--ds-auro-flightline-segment-line-color: var(--ds-basic-color-status-error, #e31f26)}
|
|
14
|
+
`,m=e`:focus:not(:focus-visible){outline:3px solid transparent}:host{display:block;isolation:isolate}.nonstop:before{content:"";height:var(--ds-size-25, .125rem);width:100%;position:relative;top:10px;border-width:var(--ds-size-25, .125rem) 0 0 0;border-style:solid}.canceled:before{border-style:dashed}.multiple ::slotted(*){display:block}@container (max-width: 320px){.multiple ::slotted(*){display:none}}.showNoStops{display:none}@container (max-width: 320px){.showNoStops{display:block}}.slotContainer{display:flex;justify-content:space-around;min-height:var(--ds-size-300, 1.5rem);container-type:inline-size}
|
|
15
|
+
`;class g extends s{constructor(){super(),this._initializeDefaults()}_initializeDefaults(){this.canceled=!1,this.hasCanceledSegment=!1,this.firstSegmentCanceled=!1,this.lastSegmentCanceled=!1,this.runtimeUtils=new l}static get properties(){return{canceled:{type:Boolean,reflect:!0},firstSegmentCanceled:{type:Boolean,reflect:!0},hasCanceledSegment:{type:Boolean,reflect:!0},lastSegmentCanceled:{type:Boolean,reflect:!0}}}static get styles(){return[m,d,o]}static register(e="auro-flightline"){l.prototype.registerComponent(e,g)}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-flightline")}containsCanceledSegment(){const e=this.querySelectorAll("auro-flight-segment, [auro-flight-segment]");for(let s=0;s<e.length;s+=1){const t=e[s];this.canceled&&(t.canceled=!0,t.destinationCanceled=!0),(t.canceled||t.hasAttribute("canceled"))&&(this.hasCanceledSegment=!0,0===s&&(this.firstSegmentCanceled=!0)),t.hasAttribute("destinationCanceled")&&s===e.length-1&&(this.lastSegmentCanceled=!0)}}render(){const e=this.children.length>1,s={slotContainer:!0,nonstop:!this.children.length,multiple:e,canceled:this.canceled};return t`
|
|
16
|
+
<div class="${a(s)}">
|
|
17
|
+
<slot @slotchange=${this.containsCanceledSegment}></slot>
|
|
18
|
+
${e?t`
|
|
19
|
+
<auro-flight-segment
|
|
20
|
+
class="showNoStops"
|
|
21
|
+
?canceled=${this.firstSegmentCanceled}
|
|
22
|
+
?partialCancel=${this.hasCanceledSegment}
|
|
23
|
+
?destinationCanceled=${this.lastSegmentCanceled}
|
|
24
|
+
iata="${this.children.length} stops"
|
|
25
|
+
></auro-flight-segment>
|
|
26
|
+
`:t``}
|
|
27
|
+
</div>`}}export{g as A,c as a};
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { css, LitElement, html as html$1 } from 'lit';
|
|
2
|
+
import { classMap } from 'lit/directives/class-map.js';
|
|
3
|
+
import { html } from 'lit/static-html.js';
|
|
4
|
+
|
|
5
|
+
class l{registerComponent(e,s){customElements.get(e)||customElements.define(e,class extends s{});}closestElement(e,s=this,t=(s,a=s&&s.closest(e))=>s&&s!==document&&s!==window?a||t(s.getRootNode().host):null){return t(s)}handleComponentTagRename(e,s){const t=s.toLowerCase();e.tagName.toLowerCase()!==t&&e.setAttribute(t,true);}elementMatch(e,s){const t=s.toLowerCase();return e.tagName.toLowerCase()===t||e.hasAttribute(t)}getSlotText(e,s){const t=e.shadowRoot?.querySelector(`slot[name="${s}"]`);return (t?.assignedNodes({flatten:true})||[]).map(e=>e.textContent?.trim()).join(" ").trim()||null}}var r=css`.wrapper:before{border-top-color:var(--ds-auro-flightline-segment-line-color)}.wrapper:after{border-top-color:var(--ds-auro-flightline-destination-line-color)}.iata{color:var(--ds-auro-flightline-segment-iata-text-color)}.duration{color:var(--ds-auro-flightline-layover-duration-color)}.leg{border-color:var(--ds-auro-flightline-layover-marker-border-color);background-color:var(--ds-auro-flightline-layover-marker-container-color)}.leg--stopover{--ds-auro-flightline-layover-marker-container-color: var(--ds-basic-color-surface-default, #ffffff)}.leg--canceled{--ds-auro-flightline-layover-marker-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-flightline-layover-marker-container-color: var(--ds-basic-color-status-error, #e31f26)}:host([nextday]){--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-status-error, #e31f26)}:host([canceled]){--ds-auro-flightline-segment-line-color: var(--ds-basic-color-status-error, #e31f26)}:host([destinationCanceled]){--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-flightline-destination-line-color: var(--ds-basic-color-status-error, #e31f26)}
|
|
6
|
+
`,n=css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{flex-grow:1;flex-basis:0}.wrapper{position:relative}.wrapper:before,.wrapper:after{border-top-width:var(--ds-size-25, .125rem);border-top-style:solid;position:absolute;top:.5rem;z-index:1}.wrapper:before{content:"";right:50%;width:100%}.wrapper:after{left:50%;width:50%}:host(:first-child) .wrapper:before,:host(:only-of-type) .wrapper:before{width:50%}:host(:last-child) .wrapper:after,:host(:only-of-type) .wrapper:after{content:""}:host([canceled]) .wrapper:before{border-top-width:var(--ds-size-25, .125rem);border-top-style:dashed}:host([destinationCanceled]) .wrapper:after{border-top-width:var(--ds-size-25, .125rem);border-top-style:dashed}.layout{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;z-index:2;width:100%}.leg{border-style:solid;border-width:var(--ds-size-25, .125rem);border-radius:50%;width:var(--ds-size-150, .75rem);height:var(--ds-size-150, .75rem)}@media screen and (min-width: 576px){.leg{width:var(--ds-size-200, 1rem);height:var(--ds-size-200, 1rem)}}.iata{margin-top:var(--ds-size-150, .75rem)}
|
|
7
|
+
`,o=css`:host{--ds-auro-flightline-destination-line-color: var(--ds-advanced-color-flightline-line, #00274a);--ds-auro-flightline-segment-iata-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-flightline-segment-line-color: var(--ds-advanced-color-flightline-line, #00274a);--ds-auro-flightline-layover-duration-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-flightline-layover-marker-border-color: var(--ds-advanced-color-flightline-indicator, #00274a);--ds-auro-flightline-layover-marker-container-color: var(--ds-advanced-color-flightline-indicator, #00274a)}
|
|
8
|
+
`;class c extends LitElement{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.stopover=false,this.canceled=false,this.destinationCanceled=false,this.partialCancel=false;}static get properties(){return {canceled:{type:Boolean,reflect:true},destinationCanceled:{type:Boolean,reflect:true},duration:{type:String},iata:{type:String},nextDay:{type:Boolean,reflect:true},partialCancel:{type:Boolean,reflect:true},stopover:{type:Boolean,reflect:true}}}static get styles(){return [css`${n}`,css`${r}`,css`${o}`]}static register(e="auro-flight-segment"){l.prototype.registerComponent(e,c);}firstUpdated(){l.prototype.handleComponentTagRename(this,"auro-flight-segment");}render(){const e={leg:true,layout:true,"leg--stopover":this.stopover,"leg--canceled":this.canceled||this.partialCancel};return html`
|
|
9
|
+
<div class="wrapper">
|
|
10
|
+
<div class="layout">
|
|
11
|
+
<slot></slot>
|
|
12
|
+
<div class="${classMap(e)}"></div>
|
|
13
|
+
<span class="iata body-default">${this.iata}</span>
|
|
14
|
+
${this.duration?html`<span class="duration body-xs">${this.duration}</span>`:void 0}
|
|
15
|
+
</div>
|
|
16
|
+
</div>
|
|
17
|
+
`}}var d=css`.nonstop:before,.canceled:before{border-top-color:var(--ds-auro-flightline-segment-line-color)}:host([canceled]){--ds-auro-flightline-segment-line-color: var(--ds-basic-color-status-error, #e31f26)}
|
|
18
|
+
`,m=css`:focus:not(:focus-visible){outline:3px solid transparent}:host{display:block;isolation:isolate}.nonstop:before{content:"";height:var(--ds-size-25, .125rem);width:100%;position:relative;top:10px;border-width:var(--ds-size-25, .125rem) 0 0 0;border-style:solid}.canceled:before{border-style:dashed}.multiple ::slotted(*){display:block}@container (max-width: 320px){.multiple ::slotted(*){display:none}}.showNoStops{display:none}@container (max-width: 320px){.showNoStops{display:block}}.slotContainer{display:flex;justify-content:space-around;min-height:var(--ds-size-300, 1.5rem);container-type:inline-size}
|
|
19
|
+
`;class g extends LitElement{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.canceled=false,this.hasCanceledSegment=false,this.firstSegmentCanceled=false,this.lastSegmentCanceled=false,this.runtimeUtils=new l;}static get properties(){return {canceled:{type:Boolean,reflect:true},firstSegmentCanceled:{type:Boolean,reflect:true},hasCanceledSegment:{type:Boolean,reflect:true},lastSegmentCanceled:{type:Boolean,reflect:true}}}static get styles(){return [m,d,o]}static register(e="auro-flightline"){l.prototype.registerComponent(e,g);}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-flightline");}containsCanceledSegment(){const e=this.querySelectorAll("auro-flight-segment, [auro-flight-segment]");for(let s=0;s<e.length;s+=1){const t=e[s];this.canceled&&(t.canceled=true,t.destinationCanceled=true),(t.canceled||t.hasAttribute("canceled"))&&(this.hasCanceledSegment=true,0===s&&(this.firstSegmentCanceled=true)),t.hasAttribute("destinationCanceled")&&s===e.length-1&&(this.lastSegmentCanceled=true);}}render(){const e=this.children.length>1,s={slotContainer:true,nonstop:!this.children.length,multiple:e,canceled:this.canceled};return html$1`
|
|
20
|
+
<div class="${classMap(s)}">
|
|
21
|
+
<slot @slotchange=${this.containsCanceledSegment}></slot>
|
|
22
|
+
${e?html$1`
|
|
23
|
+
<auro-flight-segment
|
|
24
|
+
class="showNoStops"
|
|
25
|
+
?canceled=${this.firstSegmentCanceled}
|
|
26
|
+
?partialCancel=${this.hasCanceledSegment}
|
|
27
|
+
?destinationCanceled=${this.lastSegmentCanceled}
|
|
28
|
+
iata="${this.children.length} stops"
|
|
29
|
+
></auro-flight-segment>
|
|
30
|
+
`:html$1``}
|
|
31
|
+
</div>`}}
|
|
32
|
+
|
|
33
|
+
export { c as AuroFlightSegment, g as AuroFlightline };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{a as AuroFlightSegment,A as AuroFlightline}from"./auro-flightline-Ua1BdkHT.js";import"lit";import"lit/directives/class-map.js";import"lit/static-html.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{A as i,a as t}from"./auro-flightline-Ua1BdkHT.js";import"lit";import"lit/directives/class-map.js";import"lit/static-html.js";i.register(),t.register();
|
package/package.json
ADDED
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
{
|
|
2
|
+
"//": [
|
|
3
|
+
"================================================================================",
|
|
4
|
+
"# To work within the development environment, run the following tasks",
|
|
5
|
+
" 1. $ npm run dev",
|
|
6
|
+
" 2. Go to http://localhost:8000",
|
|
7
|
+
"================================================================================"
|
|
8
|
+
],
|
|
9
|
+
"name": "@aurodesignsystem-dev/auro-flightline",
|
|
10
|
+
"version": "0.0.0-pr101.0",
|
|
11
|
+
"description": "auro-flightline HTML custom element",
|
|
12
|
+
"repository": {
|
|
13
|
+
"type": "git",
|
|
14
|
+
"url": "https://github.com/AlaskaAirlines/auro-flightline"
|
|
15
|
+
},
|
|
16
|
+
"type": "module",
|
|
17
|
+
"main": "index.js",
|
|
18
|
+
"license": "Apache-2.0",
|
|
19
|
+
"engines": {
|
|
20
|
+
"node": ">=20"
|
|
21
|
+
},
|
|
22
|
+
"dependencies": {
|
|
23
|
+
"lit": "^3.3.2"
|
|
24
|
+
},
|
|
25
|
+
"devDependencies": {
|
|
26
|
+
"@aurodesignsystem/auro-cli": "^3.0.3",
|
|
27
|
+
"@aurodesignsystem/auro-config": "^1.3.1",
|
|
28
|
+
"@aurodesignsystem/auro-library": "^5.5.4",
|
|
29
|
+
"@aurodesignsystem/design-tokens": "^8.7.0",
|
|
30
|
+
"@aurodesignsystem/webcorestylesheets": "^10.1.4",
|
|
31
|
+
"husky": "^9.1.7"
|
|
32
|
+
},
|
|
33
|
+
"browserslist": [
|
|
34
|
+
"last 2 Chrome versions",
|
|
35
|
+
"last 2 iOS major versions",
|
|
36
|
+
"last 2 Firefox versions",
|
|
37
|
+
"last 2 Edge versions",
|
|
38
|
+
"last 2 Safari major versions"
|
|
39
|
+
],
|
|
40
|
+
"publishConfig": {
|
|
41
|
+
"access": "public",
|
|
42
|
+
"provenance": true
|
|
43
|
+
},
|
|
44
|
+
"keywords": [
|
|
45
|
+
"alaska airlines",
|
|
46
|
+
"auro",
|
|
47
|
+
"design system",
|
|
48
|
+
"web components"
|
|
49
|
+
],
|
|
50
|
+
"scripts": {
|
|
51
|
+
"build": "auro build",
|
|
52
|
+
"dev": "auro dev -w -s",
|
|
53
|
+
"dev:open": "auro dev -w -s --open",
|
|
54
|
+
"lint": "biome check --no-errors-on-unmatched && stylelint \"./src/**/*.scss\"",
|
|
55
|
+
"lint:fix": "biome check --fix --no-errors-on-unmatched && stylelint \"./src/**/*.scss\" --fix",
|
|
56
|
+
"test": "auro test",
|
|
57
|
+
"test:watch": "auro test --watch",
|
|
58
|
+
"prepare": "husky",
|
|
59
|
+
"test:coverage": "auro test --coverage-report --open"
|
|
60
|
+
},
|
|
61
|
+
"exports": {
|
|
62
|
+
"./package.json": "./package.json",
|
|
63
|
+
"./readme.md": "./README.md",
|
|
64
|
+
"./custom-elements.json": "./custom-elements.json",
|
|
65
|
+
".": {
|
|
66
|
+
"module": "./dist/registered.js",
|
|
67
|
+
"types": "./dist/index.d.ts",
|
|
68
|
+
"default": "./dist/registered.js"
|
|
69
|
+
},
|
|
70
|
+
"./demo/*.md": "./demo/*.md",
|
|
71
|
+
"./demo/*.js": "./demo/*.min.js",
|
|
72
|
+
"./class": {
|
|
73
|
+
"module": "./dist/index.js",
|
|
74
|
+
"types": "./dist/index.d.ts",
|
|
75
|
+
"default": "./dist/index.js"
|
|
76
|
+
}
|
|
77
|
+
},
|
|
78
|
+
"files": [
|
|
79
|
+
"dist/**/*",
|
|
80
|
+
"demo/**/*",
|
|
81
|
+
"CHANGELOG.md",
|
|
82
|
+
"README.md",
|
|
83
|
+
"LICENSE",
|
|
84
|
+
"NOTICE"
|
|
85
|
+
],
|
|
86
|
+
"customElements": "custom-elements.json"
|
|
87
|
+
}
|