import { CommonModule } from '@angular/common';
import { Component, inject, Input } from '@angular/core';
import { ThemeService } from '../../../services/theme.service';
import { resolveColor } from '../../../shared/utils/styles';
import { ButtonGroupComponent } from '../button-group/button-group.component';
import { TitleBlockComponent } from '../title-block/title-block.component';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class LayeredCardComponent {
    constructor() {
        this.theme = inject(ThemeService);
    }
    color(background) {
        if (!background) {
            return '';
        }
        return resolveColor(background);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayeredCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LayeredCardComponent, isStandalone: true, selector: "layered-card", inputs: { props: "props" }, ngImport: i0, template: `
    <div
      class="fun-card"
      [class.big-space]="props.bigSpace"
      [class.hoverable]="props.hoverable"
      [class.layered]="props.mode === 'layered'"
      [class.poster]="props.mode === 'poster'"
      [ngStyle]="{
        background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
        minHeight: props.withMin ? '340px' : 'auto',
      }"
    >
      @if (props.mode === 'poster') {
        <img
          class="poster-image"
          [class.dark]="props.dark"
          [class.with-opacity]="props.withOpacity"
          alt="image"
          [src]="props.image"
        />
      }
      @if (props.mode === 'layered') {
        <img
          class="layer-image"
          [class.dark]="props.dark"
          [class.with-opacity]="props.withOpacity"
          alt="image"
          [src]="props.image"
        />
      }

      <section>
        <val-title-block [props]="props.content" />
        @if (props.actions) {
          <val-button-group style="display:block; margin-top: 16px;" [props]="props.actions" />
        }
      </section>
    </div>
  `, isInline: true, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;box-shadow:0 .25rem .75rem #12195412}body.dark .fun-card,html.ion-palette-dark .fun-card,body.ion-palette-dark .fun-card,body[data-theme=dark] .fun-card{border:.0625rem solid var(--ion-color-medium)}.fun-card.layered{flex-direction:column;justify-content:space-between}.fun-card.poster{flex-direction:row;justify-content:flex-start}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-image.with-opacity{opacity:.1}body.dark .layer-image.dark,html.ion-palette-dark .layer-image.dark,body.ion-palette-dark .layer-image.dark,body[data-theme=dark] .layer-image.dark{opacity:.2;filter:invert(1)}.poster-image{max-height:100%;max-width:5rem;margin-right:1rem}.poster-image.with-opacity{opacity:.1}body.dark .poster-image.dark,html.ion-palette-dark .poster-image.dark,body.ion-palette-dark .poster-image.dark,body[data-theme=dark] .poster-image.dark{opacity:.2;filter:invert(1)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: ButtonGroupComponent, selector: "val-button-group", inputs: ["props"], outputs: ["onClick"] }, { kind: "component", type: TitleBlockComponent, selector: "val-title-block", inputs: ["props"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LayeredCardComponent, decorators: [{
            type: Component,
            args: [{ selector: 'layered-card', standalone: true, imports: [CommonModule, ButtonGroupComponent, TitleBlockComponent], template: `
    <div
      class="fun-card"
      [class.big-space]="props.bigSpace"
      [class.hoverable]="props.hoverable"
      [class.layered]="props.mode === 'layered'"
      [class.poster]="props.mode === 'poster'"
      [ngStyle]="{
        background: theme.IsDark ? 'var(--ion-background-color)' : color(props.background),
        minHeight: props.withMin ? '340px' : 'auto',
      }"
    >
      @if (props.mode === 'poster') {
        <img
          class="poster-image"
          [class.dark]="props.dark"
          [class.with-opacity]="props.withOpacity"
          alt="image"
          [src]="props.image"
        />
      }
      @if (props.mode === 'layered') {
        <img
          class="layer-image"
          [class.dark]="props.dark"
          [class.with-opacity]="props.withOpacity"
          alt="image"
          [src]="props.image"
        />
      }

      <section>
        <val-title-block [props]="props.content" />
        @if (props.actions) {
          <val-button-group style="display:block; margin-top: 16px;" [props]="props.actions" />
        }
      </section>
    </div>
  `, styles: ["@charset \"UTF-8\";:root{--val-container-sm: 540px;--val-container-md: 720px;--val-container-lg: 880px;--val-container-xl: 1100px;--val-container-padding: 16px;--ion-color-primary: #7026df;--ion-color-primary-rgb: 112, 38, 223;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #6321c4;--ion-color-primary-tint: #7e3ce2;--ion-color-secondary: #e2ccff;--ion-color-secondary-rgb: 226, 204, 255;--ion-color-secondary-contrast: #000000;--ion-color-secondary-contrast-rgb: 0, 0, 0;--ion-color-secondary-shade: #c7b4e0;--ion-color-secondary-tint: #e5d1ff;--ion-color-texti: #354c69;--ion-color-texti-rgb: 53, 76, 105;--ion-color-texti-contrast: #ffffff;--ion-color-texti-contrast-rgb: 255, 255, 255;--ion-color-texti-shade: #2f435c;--ion-color-texti-tint: #495e78;--ion-color-darki: #090f1b;--ion-color-darki-rgb: 9, 15, 27;--ion-color-darki-contrast: #ffffff;--ion-color-darki-contrast-rgb: 255, 255, 255;--ion-color-darki-shade: #080d18;--ion-color-darki-tint: #222732;--ion-color-medium: #9e9e9e;--ion-color-medium-rgb: 158, 158, 158;--ion-color-medium-contrast: #000000;--ion-color-medium-contrast-rgb: 0, 0, 0;--ion-color-medium-shade: #8b8b8b;--ion-color-medium-tint: #a8a8a8;--swiper-pagination-color: var(--ion-color-primary);--swiper-navigation-color: var(--ion-color-primary);--swiper-pagination-bullet-inactive-color: var(--ion-color-medium)}body.dark,html.ion-palette-dark,body[data-theme=dark]{--ion-color-texti: #8fc1ff;--ion-color-texti-rgb: 143, 193, 255;--ion-color-texti-contrast: #000000;--ion-color-texti-contrast-rgb: 0, 0, 0;--ion-color-texti-shade: #7eaae0;--ion-color-texti-tint: #9ac7ff;--ion-color-darki: #ffffff;--ion-color-darki-rgb: 255, 255, 255;--ion-color-darki-contrast: #000000;--ion-color-darki-contrast-rgb: 0, 0, 0;--ion-color-darki-shade: #e0e0e0;--ion-color-darki-tint: #ffffff;--ion-color-primary: #8f49f8;--ion-color-primary-rgb: 143, 73, 248;--ion-color-primary-contrast: #ffffff;--ion-color-primary-contrast-rgb: 255, 255, 255;--ion-color-primary-shade: #7e40da;--ion-color-primary-tint: #9a5bf9}.ion-color-texti{--ion-color-base: var(--ion-color-texti);--ion-color-base-rgb: var(--ion-color-texti-rgb);--ion-color-contrast: var(--ion-color-texti-contrast);--ion-color-contrast-rgb: var(--ion-color-texti-contrast-rgb);--ion-color-shade: var(--ion-color-texti-shade);--ion-color-tint: var(--ion-color-texti-tint)}.ion-color-darki{--ion-color-base: var(--ion-color-darki);--ion-color-base-rgb: var(--ion-color-darki-rgb);--ion-color-contrast: var(--ion-color-darki-contrast);--ion-color-contrast-rgb: var(--ion-color-darki-contrast-rgb);--ion-color-shade: var(--ion-color-darki-shade);--ion-color-tint: var(--ion-color-darki-tint)}.fun-card{z-index:0;position:relative;cursor:pointer;background:var(--ion-card-background, var(--ion-item-background, var(--ion-background-color, #fff)));display:flex;border-radius:1.5rem;align-items:start;padding:1rem;box-shadow:0 .25rem .75rem #12195412}body.dark .fun-card,html.ion-palette-dark .fun-card,body.ion-palette-dark .fun-card,body[data-theme=dark] .fun-card{border:.0625rem solid var(--ion-color-medium)}.fun-card.layered{flex-direction:column;justify-content:space-between}.fun-card.poster{flex-direction:row;justify-content:flex-start}.fun-card.hoverable{transition:transform .3s ease,box-shadow .3s ease}.fun-card.hoverable:hover{transform:scale(1.01);box-shadow:.1875rem .625rem .5rem #1219541a}.fun-card.big-space{padding:2.625rem}.layer-image{z-index:-1;right:3%;bottom:2%;position:absolute;max-height:100%;max-width:40%;padding:.5rem}.layer-image.with-opacity{opacity:.1}body.dark .layer-image.dark,html.ion-palette-dark .layer-image.dark,body.ion-palette-dark .layer-image.dark,body[data-theme=dark] .layer-image.dark{opacity:.2;filter:invert(1)}.poster-image{max-height:100%;max-width:5rem;margin-right:1rem}.poster-image.with-opacity{opacity:.1}body.dark .poster-image.dark,html.ion-palette-dark .poster-image.dark,body.ion-palette-dark .poster-image.dark,body[data-theme=dark] .poster-image.dark{opacity:.2;filter:invert(1)}\n"] }]
        }], propDecorators: { props: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGF5ZXJlZC1jYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9tb2xlY3VsZXMvbGF5ZXJlZC1jYXJkL2xheWVyZWQtY2FyZC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN6RCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDL0QsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzVELE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLHdDQUF3QyxDQUFDO0FBQzlFLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDOzs7QUFnRDNFLE1BQU0sT0FBTyxvQkFBb0I7SUE3Q2pDO1FBOENFLFVBQUssR0FBRyxNQUFNLENBQUMsWUFBWSxDQUFDLENBQUM7S0FXOUI7SUFOQyxLQUFLLENBQUMsVUFBVTtRQUNkLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztZQUNoQixPQUFPLEVBQUUsQ0FBQztRQUNaLENBQUM7UUFDRCxPQUFPLFlBQVksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUNsQyxDQUFDOytHQVhVLG9CQUFvQjttR0FBcEIsb0JBQW9CLG9HQXpDckI7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBc0NULHlqSUF2Q1MsWUFBWSxvSEFBRSxvQkFBb0Isc0dBQUUsbUJBQW1COzs0RkEwQ3RELG9CQUFvQjtrQkE3Q2hDLFNBQVM7K0JBQ0UsY0FBYyxjQUNaLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxvQkFBb0IsRUFBRSxtQkFBbUIsQ0FBQyxZQUN4RDs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7R0FzQ1Q7OEJBT0QsS0FBSztzQkFESixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgaW5qZWN0LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVGhlbWVTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vLi4vc2VydmljZXMvdGhlbWUuc2VydmljZSc7XG5pbXBvcnQgeyByZXNvbHZlQ29sb3IgfSBmcm9tICcuLi8uLi8uLi9zaGFyZWQvdXRpbHMvc3R5bGVzJztcbmltcG9ydCB7IEJ1dHRvbkdyb3VwQ29tcG9uZW50IH0gZnJvbSAnLi4vYnV0dG9uLWdyb3VwL2J1dHRvbi1ncm91cC5jb21wb25lbnQnO1xuaW1wb3J0IHsgVGl0bGVCbG9ja0NvbXBvbmVudCB9IGZyb20gJy4uL3RpdGxlLWJsb2NrL3RpdGxlLWJsb2NrLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBMYXllcmVkQ2FyZE1ldGFkYXRhIH0gZnJvbSAnLi90eXBlcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2xheWVyZWQtY2FyZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEJ1dHRvbkdyb3VwQ29tcG9uZW50LCBUaXRsZUJsb2NrQ29tcG9uZW50XSxcbiAgdGVtcGxhdGU6IGBcbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cImZ1bi1jYXJkXCJcbiAgICAgIFtjbGFzcy5iaWctc3BhY2VdPVwicHJvcHMuYmlnU3BhY2VcIlxuICAgICAgW2NsYXNzLmhvdmVyYWJsZV09XCJwcm9wcy5ob3ZlcmFibGVcIlxuICAgICAgW2NsYXNzLmxheWVyZWRdPVwicHJvcHMubW9kZSA9PT0gJ2xheWVyZWQnXCJcbiAgICAgIFtjbGFzcy5wb3N0ZXJdPVwicHJvcHMubW9kZSA9PT0gJ3Bvc3RlcidcIlxuICAgICAgW25nU3R5bGVdPVwie1xuICAgICAgICBiYWNrZ3JvdW5kOiB0aGVtZS5Jc0RhcmsgPyAndmFyKC0taW9uLWJhY2tncm91bmQtY29sb3IpJyA6IGNvbG9yKHByb3BzLmJhY2tncm91bmQpLFxuICAgICAgICBtaW5IZWlnaHQ6IHByb3BzLndpdGhNaW4gPyAnMzQwcHgnIDogJ2F1dG8nLFxuICAgICAgfVwiXG4gICAgPlxuICAgICAgQGlmIChwcm9wcy5tb2RlID09PSAncG9zdGVyJykge1xuICAgICAgICA8aW1nXG4gICAgICAgICAgY2xhc3M9XCJwb3N0ZXItaW1hZ2VcIlxuICAgICAgICAgIFtjbGFzcy5kYXJrXT1cInByb3BzLmRhcmtcIlxuICAgICAgICAgIFtjbGFzcy53aXRoLW9wYWNpdHldPVwicHJvcHMud2l0aE9wYWNpdHlcIlxuICAgICAgICAgIGFsdD1cImltYWdlXCJcbiAgICAgICAgICBbc3JjXT1cInByb3BzLmltYWdlXCJcbiAgICAgICAgLz5cbiAgICAgIH1cbiAgICAgIEBpZiAocHJvcHMubW9kZSA9PT0gJ2xheWVyZWQnKSB7XG4gICAgICAgIDxpbWdcbiAgICAgICAgICBjbGFzcz1cImxheWVyLWltYWdlXCJcbiAgICAgICAgICBbY2xhc3MuZGFya109XCJwcm9wcy5kYXJrXCJcbiAgICAgICAgICBbY2xhc3Mud2l0aC1vcGFjaXR5XT1cInByb3BzLndpdGhPcGFjaXR5XCJcbiAgICAgICAgICBhbHQ9XCJpbWFnZVwiXG4gICAgICAgICAgW3NyY109XCJwcm9wcy5pbWFnZVwiXG4gICAgICAgIC8+XG4gICAgICB9XG5cbiAgICAgIDxzZWN0aW9uPlxuICAgICAgICA8dmFsLXRpdGxlLWJsb2NrIFtwcm9wc109XCJwcm9wcy5jb250ZW50XCIgLz5cbiAgICAgICAgQGlmIChwcm9wcy5hY3Rpb25zKSB7XG4gICAgICAgICAgPHZhbC1idXR0b24tZ3JvdXAgc3R5bGU9XCJkaXNwbGF5OmJsb2NrOyBtYXJnaW4tdG9wOiAxNnB4O1wiIFtwcm9wc109XCJwcm9wcy5hY3Rpb25zXCIgLz5cbiAgICAgICAgfVxuICAgICAgPC9zZWN0aW9uPlxuICAgIDwvZGl2PlxuICBgLFxuICBzdHlsZVVybDogJy4vbGF5ZXJlZC1jYXJkLmNvbXBvbmVudC5zY3NzJyxcbn0pXG5leHBvcnQgY2xhc3MgTGF5ZXJlZENhcmRDb21wb25lbnQge1xuICB0aGVtZSA9IGluamVjdChUaGVtZVNlcnZpY2UpO1xuXG4gIEBJbnB1dCgpXG4gIHByb3BzOiBMYXllcmVkQ2FyZE1ldGFkYXRhO1xuXG4gIGNvbG9yKGJhY2tncm91bmQpIHtcbiAgICBpZiAoIWJhY2tncm91bmQpIHtcbiAgICAgIHJldHVybiAnJztcbiAgICB9XG4gICAgcmV0dXJuIHJlc29sdmVDb2xvcihiYWNrZ3JvdW5kKTtcbiAgfVxufVxuIl19