import { CommonModule } from '@angular/common';
import { ChangeDetectionStrategy, Component, Input, computed, signal } from '@angular/core';
import { RouterLink } from '@angular/router';
import { IonIcon } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { chevronForwardOutline, openOutline } from 'ionicons/icons';
import * as i0 from "@angular/core";
/**
 * `val-page-links` — stacked list of navigational links with optional dividers.
 * Used for legal/policies, footer link columns, "about" sections, etc.
 *
 * Each item can navigate via Angular `routerLink` (SPA) or external `href`.
 * Detects absolute URLs (`http(s)://`) to apply `target="_blank"` by default.
 *
 * @example
 * <val-page-links [props]="{
 *   links: [
 *     { label: 'Terms', routerLink: '/legal/terms' },
 *     { label: 'Privacy', routerLink: '/legal/privacy' },
 *     { label: 'Visit main site', href: 'https://myvaltech.com', icon: 'open-outline' },
 *   ],
 * }"></val-page-links>
 */
export class PageLinksComponent {
    /** Page links configuration object. */
    set props(value) {
        this._props.set(value);
    }
    get props() {
        return this._props();
    }
    constructor() {
        this._props = signal({ links: [] }, {
            equal: (a, b) => a === b || JSON.stringify(a) === JSON.stringify(b),
        });
        this.links = computed(() => this._props().links ?? []);
        addIcons({ chevronForwardOutline, openOutline });
    }
    isExternal(link) {
        if (link.external !== undefined)
            return link.external;
        return !!link.href && /^https?:\/\//i.test(link.href);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PageLinksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: PageLinksComponent, isStandalone: true, selector: "val-page-links", inputs: { props: "props" }, ngImport: i0, template: `
    <nav
      class="val-page-links"
      [class.no-dividers]="props.showDividers === false"
      [class.size-small]="props.size === 'small'"
      [class.size-large]="props.size === 'large'"
    >
      @for (link of links(); track link.label; let last = $last) {
        @if (link.routerLink) {
          <a
            class="val-page-links__item"
            [routerLink]="link.routerLink"
            [class.is-last]="last"
            [attr.aria-label]="link.ariaLabel || link.label"
          >
            <span class="val-page-links__label">{{ link.label }}</span>
            @if (link.icon) {
              <ion-icon class="val-page-links__icon" [name]="link.icon" aria-hidden="true"></ion-icon>
            } @else {
              <ion-icon
                class="val-page-links__icon val-page-links__icon--default"
                name="chevron-forward-outline"
                aria-hidden="true"
              ></ion-icon>
            }
          </a>
        } @else if (link.href) {
          <a
            class="val-page-links__item"
            [href]="link.href"
            [class.is-last]="last"
            [attr.target]="isExternal(link) ? '_blank' : null"
            [attr.rel]="isExternal(link) ? 'noopener noreferrer' : null"
            [attr.aria-label]="link.ariaLabel || link.label"
          >
            <span class="val-page-links__label">{{ link.label }}</span>
            @if (link.icon) {
              <ion-icon class="val-page-links__icon" [name]="link.icon" aria-hidden="true"></ion-icon>
            } @else {
              <ion-icon
                class="val-page-links__icon val-page-links__icon--default"
                [name]="isExternal(link) ? 'open-outline' : 'chevron-forward-outline'"
                aria-hidden="true"
              ></ion-icon>
            }
          </a>
        }
      }
    </nav>
  `, isInline: true, styles: ["@charset \"UTF-8\";:host{display:block}.val-page-links{display:flex;flex-direction:column}.val-page-links__item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px 4px;background:transparent;border:0;border-bottom:1px solid var(--ion-color-light-shade, #e8e9ec);color:var(--ion-color-dark);font-size:.95rem;line-height:1.4;text-align:left;text-decoration:none;cursor:pointer;transition:color .15s ease,background .15s ease}.val-page-links__item.is-last{border-bottom:0}.val-page-links__item:hover{color:var(--ion-color-primary, #7026df)}.val-page-links__item:hover .val-page-links__icon--default{transform:translate(2px)}.val-page-links__item:focus-visible{outline:2px solid var(--ion-color-primary, #7026df);outline-offset:2px;border-radius:6px}.val-page-links__label{flex:1 1 auto;min-width:0}.val-page-links__icon{flex-shrink:0;font-size:1.125rem;color:var(--ion-color-medium);transition:transform .15s ease}.val-page-links__icon--default{font-size:1rem;opacity:.7}.val-page-links.no-dividers .val-page-links__item{border-bottom:0}.val-page-links.size-small .val-page-links__item{font-size:.85rem;padding:10px 4px}.val-page-links.size-large .val-page-links__item{font-size:1.05rem;padding:18px 4px}:host-context(body.dark) .val-page-links__item,:host-context(html.ion-palette-dark) .val-page-links__item,:host-context([data-theme=dark]) .val-page-links__item{border-bottom-color:#ffffff14}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PageLinksComponent, decorators: [{
            type: Component,
            args: [{ selector: 'val-page-links', standalone: true, imports: [CommonModule, RouterLink, IonIcon], template: `
    <nav
      class="val-page-links"
      [class.no-dividers]="props.showDividers === false"
      [class.size-small]="props.size === 'small'"
      [class.size-large]="props.size === 'large'"
    >
      @for (link of links(); track link.label; let last = $last) {
        @if (link.routerLink) {
          <a
            class="val-page-links__item"
            [routerLink]="link.routerLink"
            [class.is-last]="last"
            [attr.aria-label]="link.ariaLabel || link.label"
          >
            <span class="val-page-links__label">{{ link.label }}</span>
            @if (link.icon) {
              <ion-icon class="val-page-links__icon" [name]="link.icon" aria-hidden="true"></ion-icon>
            } @else {
              <ion-icon
                class="val-page-links__icon val-page-links__icon--default"
                name="chevron-forward-outline"
                aria-hidden="true"
              ></ion-icon>
            }
          </a>
        } @else if (link.href) {
          <a
            class="val-page-links__item"
            [href]="link.href"
            [class.is-last]="last"
            [attr.target]="isExternal(link) ? '_blank' : null"
            [attr.rel]="isExternal(link) ? 'noopener noreferrer' : null"
            [attr.aria-label]="link.ariaLabel || link.label"
          >
            <span class="val-page-links__label">{{ link.label }}</span>
            @if (link.icon) {
              <ion-icon class="val-page-links__icon" [name]="link.icon" aria-hidden="true"></ion-icon>
            } @else {
              <ion-icon
                class="val-page-links__icon val-page-links__icon--default"
                [name]="isExternal(link) ? 'open-outline' : 'chevron-forward-outline'"
                aria-hidden="true"
              ></ion-icon>
            }
          </a>
        }
      }
    </nav>
  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@charset \"UTF-8\";:host{display:block}.val-page-links{display:flex;flex-direction:column}.val-page-links__item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px 4px;background:transparent;border:0;border-bottom:1px solid var(--ion-color-light-shade, #e8e9ec);color:var(--ion-color-dark);font-size:.95rem;line-height:1.4;text-align:left;text-decoration:none;cursor:pointer;transition:color .15s ease,background .15s ease}.val-page-links__item.is-last{border-bottom:0}.val-page-links__item:hover{color:var(--ion-color-primary, #7026df)}.val-page-links__item:hover .val-page-links__icon--default{transform:translate(2px)}.val-page-links__item:focus-visible{outline:2px solid var(--ion-color-primary, #7026df);outline-offset:2px;border-radius:6px}.val-page-links__label{flex:1 1 auto;min-width:0}.val-page-links__icon{flex-shrink:0;font-size:1.125rem;color:var(--ion-color-medium);transition:transform .15s ease}.val-page-links__icon--default{font-size:1rem;opacity:.7}.val-page-links.no-dividers .val-page-links__item{border-bottom:0}.val-page-links.size-small .val-page-links__item{font-size:.85rem;padding:10px 4px}.val-page-links.size-large .val-page-links__item{font-size:1.05rem;padding:18px 4px}:host-context(body.dark) .val-page-links__item,:host-context(html.ion-palette-dark) .val-page-links__item,:host-context([data-theme=dark]) .val-page-links__item{border-bottom-color:#ffffff14}\n"] }]
        }], ctorParameters: () => [], propDecorators: { props: [{
                type: Input,
                args: [{ required: true }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 