@coras-io/embed 0.1.0

package/dist/components/reviews/review/review.d.ts

@@ -0,0 +1,8 @@
+import { CorasReview } from "./review.component.js";
+export * from "./review.component.js";
+export default CorasReview;
+declare global {
+    interface HTMLElementTagNameMap {
+        "coras-review": CorasReview;
+    }
+}

package/dist/components/reviews/review/review.js

@@ -0,0 +1,6 @@
+import { CorasReview } from "./review.component.js";
+export * from "./review.component.js";
+export default CorasReview;
+if (!customElements.get("coras-review")) {
+    customElements.define("coras-review", CorasReview);
+}

package/dist/components/reviews/review/review.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/reviews/review/review.styles.js

@@ -0,0 +1,45 @@
+import { css } from "lit";
+import component from "../../../styles/defaults/component.js";
+export default css `
+  ${component}
+
+  :host {
+    --review-caption-font-size: var(--coras-font-size-lg);
+    --review-caption-font-weight: var(--coras-font-weight-normal);
+    --review-caption-line-height: var(--coras-font-size-2xl);
+    --review-caption-color: var(--coras-color-text);
+    --review-location-font-size: var(--coras-font-size-sm);
+    --review-location-font-weight: var(--coras-font-weight-semibold);
+    --review-location-line-height: var(--coras-font-size-xl);
+    --review-location-color: var(--coras-color-text);
+    --review-date-font-size: var(--coras-font-size-sm);
+    --review-date-font-weight: var(--coras-font-weight-normal);
+    --review-date-line-height: var(--coras-font-size-xl);
+    --review-date-color: var(--coras-color-text);
+
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+
+    .caption {
+      font-size: var(--review-caption-font-size);
+      font-weight: var(--review-caption-font-weight);
+      line-height: var(--review-caption-line-height);
+      color: var(--review-caption-color);
+    }
+
+    .location {
+      font-size: var(--review-location-font-size);
+      font-weight: var(--review-location-font-weight);
+      line-height: var(--review-location-line-height);
+      color: var(--review-location-color);
+    }
+
+    .date {
+      font-size: var(--review-date-font-size);
+      font-weight: var(--review-date-font-weight);
+      line-height: var(--review-date-line-height);
+      color: var(--review-date-color);
+    }
+  }
+`;

package/dist/components/reviews/reviews.component.d.ts

@@ -0,0 +1,9 @@
+import { CSSResultGroup, LitElement } from "lit";
+export declare class CorasReviews extends LitElement {
+    static styles: CSSResultGroup;
+    overallRating: number;
+    reviewNumber: number;
+    private get overallRatingLabel();
+    private get reviewNumberLabel();
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/reviews/reviews.component.js

@@ -0,0 +1,56 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement } from "lit";
+import { property } from "lit/decorators.js";
+import { localized, msg } from "@lit/localize";
+import styles from "./reviews.styles.js";
+let CorasReviews = class CorasReviews extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.overallRating = 0;
+        this.reviewNumber = 0;
+    }
+    static { this.styles = styles; }
+    get overallRatingLabel() {
+        return `${msg("Overall Rating")} ${this.overallRating}`;
+    }
+    get reviewNumberLabel() {
+        return msg(html `Based on ${this.reviewNumber} Reviews`);
+    }
+    render() {
+        return html `
+      <div class="heading">
+        <span data-testid="caption" class="caption">${msg("Reviews")}</span>
+
+        <div class="rating">
+          <span data-testid="rating-label" class="rating-label"
+            >${this.overallRatingLabel}</span
+          >
+          <coras-star-rating rating=${this.overallRating}></coras-star-rating>
+        </div>
+
+        <span data-testid="review-number" class="review-number"
+          >${this.reviewNumberLabel}</span
+        >
+      </div>
+
+      <div class="reviews">
+        <slot></slot>
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: Number, attribute: "overall-rating" })
+], CorasReviews.prototype, "overallRating", void 0);
+__decorate([
+    property({ type: Number, attribute: "review-number" })
+], CorasReviews.prototype, "reviewNumber", void 0);
+CorasReviews = __decorate([
+    localized()
+], CorasReviews);
+export { CorasReviews };

package/dist/components/reviews/reviews.d.ts

@@ -0,0 +1,8 @@
+import { CorasReviews } from "./reviews.component.js";
+export * from "./reviews.component.js";
+export default CorasReviews;
+declare global {
+    interface HTMLElementTagNameMap {
+        "coras-reviews": CorasReviews;
+    }
+}

package/dist/components/reviews/reviews.js

@@ -0,0 +1,6 @@
+import { CorasReviews } from "./reviews.component.js";
+export * from "./reviews.component.js";
+export default CorasReviews;
+if (!customElements.get("coras-reviews")) {
+    customElements.define("coras-reviews", CorasReviews);
+}

package/dist/components/reviews/reviews.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/reviews/reviews.styles.js

@@ -0,0 +1,73 @@
+import { css } from "lit";
+import component from "../../styles/defaults/component.js";
+export default css `
+  ${component}
+
+  :host {
+    --reviews-border-color: var(--coras-color-neutral-300);
+    --reviews-caption-font-size: var(--coras-font-size-2xl);
+    --reviews-caption-font-weight: var(--coras-font-weight-semibold);
+    --reviews-caption-line-height: var(--coras-font-size-3xl);
+    --reviews-caption-color: var(--coras-color-text);
+    --reviews-rating-label-font-size: var(--coras-font-size-2xl);
+    --reviews-rating-label-font-weight: var(--coras-font-weight-semibold);
+    --reviews-rating-label-line-height: var(--coras-font-size-3xl);
+    --reviews-rating-label-color: var(--coras-color-text);
+    --reviews-review-number-font-size: var(--coras-font-size-base);
+    --reviews-review-number-font-weight: var(--coras-font-weight-normal);
+    --reviews-review-number-line-height: var(--coras-font-size-2xl);
+    --reviews-review-number-color: var(--coras-color-text);
+
+    display: flex;
+    flex-direction: column;
+    flex-wrap: nowrap;
+    gap: 26px;
+
+    .heading {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+      border-bottom: 1px solid var(--reviews-border-color);
+      padding-bottom: 8px;
+
+      .caption {
+        font-size: var(--reviews-caption-font-size);
+        font-weight: var(--reviews-caption-font-weight);
+        line-height: var(--reviews-caption-line-height);
+        color: var(--reviews-caption-color);
+      }
+
+      .rating {
+        display: inline-flex;
+        align-items: center;
+        gap: 16px;
+
+        .rating-label {
+          font-size: var(--reviews-rating-label-font-size);
+          font-weight: var(--reviews-rating-label-font-weight);
+          line-height: var(--reviews-rating-label-line-height);
+          color: var(--reviews-rating-label-color);
+        }
+      }
+
+      .review-number {
+        font-size: var(--reviews-review-number-font-size);
+        font-weight: var(--reviews-review-number-font-weight);
+        line-height: var(--reviews-review-number-line-height);
+        color: var(--reviews-review-number-color);
+        margin-top: 16px;
+      }
+    }
+
+    .reviews {
+      display: flex;
+      flex-direction: column;
+      gap: 48px;
+    }
+
+    ::slotted(*) {
+      border-bottom: 1px solid var(--reviews-border-color);
+      padding-bottom: 8px;
+    }
+  }
+`;

package/dist/components/search-button/search-button.component.d.ts

@@ -0,0 +1,8 @@
+import { CSSResultGroup, LitElement } from "lit";
+import "../icon/icon.js";
+export declare class CorasSearchButton extends LitElement {
+    static styles: CSSResultGroup;
+    assetsURL: string;
+    isDisabled: boolean;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/components/search-button/search-button.component.js

@@ -0,0 +1,37 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, html } from "lit";
+import { property } from "lit/decorators.js";
+import "../icon/icon.js";
+import styles from "./search-button.styles.js";
+export class CorasSearchButton extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.assetsURL = "";
+        this.isDisabled = false;
+    }
+    static { this.styles = styles; }
+    render() {
+        return html `<button
+      part="base"
+      ?disabled=${this.isDisabled}
+      aria-disabled=${this.isDisabled ? "true" : "false"}
+    >
+      <coras-icon
+        slot="prefix"
+        assets-url="${this.assetsURL}"
+        icon="search"
+      ></coras-icon>
+    </button>`;
+    }
+}
+__decorate([
+    property({ type: String, attribute: "assets-url" })
+], CorasSearchButton.prototype, "assetsURL", void 0);
+__decorate([
+    property({ type: Boolean })
+], CorasSearchButton.prototype, "isDisabled", void 0);

package/dist/components/search-button/search-button.d.ts

@@ -0,0 +1,8 @@
+import { CorasSearchButton } from "./search-button.component.js";
+export * from "./search-button.component.js";
+export default CorasSearchButton;
+declare global {
+    interface HTMLElementTagNameMap {
+        "coras-search-button": CorasSearchButton;
+    }
+}

package/dist/components/search-button/search-button.js

@@ -0,0 +1,6 @@
+import { CorasSearchButton } from "./search-button.component.js";
+export * from "./search-button.component.js";
+export default CorasSearchButton;
+if (!customElements.get("coras-search-button")) {
+    customElements.define("coras-search-button", CorasSearchButton);
+}

package/dist/components/search-button/search-button.styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/dist/components/search-button/search-button.styles.js

@@ -0,0 +1,61 @@
+import { css } from "lit";
+import component from "../../styles/defaults/component.js";
+export default css `
+  ${component}
+
+  :host {
+    --search-button-font-size: var(--coras-font-size-base);
+    --search-button-font-weight: var(--coras-font-weight-normal);
+    --search-button-background-color: var(--coras-color-surface);
+    --search-button-color: var(--coras-color-text-secondary);
+    --search-button-border-color: var(--coras-color-neutral-300);
+    --search-button-border-radius: var(--coras-radius-lg);
+    --search-button-background-color-hover: var(--coras-color-primary-200);
+    --search-button-background-color-active: var(--coras-color-primary-100);
+    --search-button-border-color-disabled: var(--coras-color-neutral-400);
+    --search-button-color-disabled: var(--coras-color-neutral-400);
+    --search-button-icon-color: var(--coras-color-text-secondary);
+  }
+
+  button {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    padding: 0.25rem 0.75rem;
+
+    font-size: var(--search-button-font-size);
+    font-weight: var(--search-button-font-weight);
+    letter-spacing: 0.01em;
+    line-height: 1rem;
+
+    background-color: var(--search-button-background-color);
+    color: var(--search-button-color);
+    border: 1px solid var(--search-button-border-color);
+    border-radius: var(--search-button-border-radius);
+
+    &:hover:not([disabled]) {
+      background-color: var(--search-button-background-color-hover);
+    }
+
+    &:active:not([disabled]) {
+      background-color: var(--search-button-background-color-active);
+    }
+
+    &:disabled {
+      cursor: not-allowed;
+      border: 1px solid var(--search-button-border-color-disabled);
+      color: var(--search-button-color-disabled);
+
+      > coras-icon {
+        fill: var(--search-button-color-disabled);
+      }
+    }
+
+    > coras-icon {
+      fill: var(--search-button-icon-color);
+      width: 1.25rem;
+      height: 1.25rem;
+    }
+  }
+`;

package/dist/components/search-results-item/search-results-item.d.ts

@@ -0,0 +1,13 @@
+import { TemplateResult } from "lit";
+import { components } from "../../core/types/api-schema.js";
+import { IconName } from "../icon/icon.types.js";
+import "../select-list/select-option/select-option.js";
+import "../icon/icon.js";
+export interface SearchResultOptionProps {
+    item: components["schemas"]["SearchGetResult"];
+    assetsURL: string;
+    selected?: boolean;
+    onSelect?: (item: components["schemas"]["SearchGetResult"]) => void;
+}
+export declare function getSearchResultIcon(type: components["schemas"]["SearchGetResult"]["type"]): IconName;
+export declare function renderSearchResultsOption({ item, onSelect, assetsURL, }: SearchResultOptionProps): TemplateResult;

package/dist/components/search-results-item/search-results-item.js

@@ -0,0 +1,26 @@
+import { html } from "lit";
+import "../select-list/select-option/select-option.js";
+import "../icon/icon.js";
+export function getSearchResultIcon(type) {
+    const ICONS_MAP = {
+        attraction: "activity",
+        country: "pin-drop",
+        city: "pin-drop",
+    };
+    return ICONS_MAP[type];
+}
+export function renderSearchResultsOption({ item, onSelect, assetsURL, }) {
+    return html `
+    <coras-select-option
+      key=${item.value}
+      @click=${() => onSelect && onSelect(item)}
+    >
+      <coras-icon
+        assets-url="${assetsURL}"
+        icon=${getSearchResultIcon(item.type)}
+        size="base"
+      ></coras-icon>
+      <span> ${item.name} </span>
+    </coras-select-option>
+  `;
+}

package/dist/components/seated-selector/seated-selector.component.d.ts

@@ -0,0 +1,42 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import "../seats-io/seats-io.js";
+import "../alert/alert.js";
+import "../button/button.js";
+export declare class CorasSeatedSelector extends LitElement {
+    static styles: CSSResultGroup;
+    private client;
+    private distributorID;
+    private locale;
+    private currency;
+    attractionId: string;
+    instanceId: string;
+    assetsURL: string;
+    workspaceKey: string;
+    dateLabel: string;
+    region: string;
+    ticketCount: number;
+    private selectedSeats;
+    private selectionValid;
+    private violations;
+    private reserved;
+    private fallbackFired;
+    private seatsTask;
+    private chartDataCache;
+    private get chartData();
+    private get selectedLabels();
+    private fallBackToSections;
+    protected willUpdate(changed: PropertyValues): void;
+    updated(changed: PropertyValues): void;
+    private seatLabelFor;
+    private handleObjectSelected;
+    private handleObjectDeselected;
+    reservationCreated(): void;
+    private handleSelectionValid;
+    private handleSelectionInvalid;
+    private get isComplete();
+    private formatPrice;
+    private handleConfirm;
+    private renderWarning;
+    private renderDrawer;
+    render(): symbol | import("lit").TemplateResult<1> | undefined;
+}