{"version":3,"file":"uofx-app-components-skeleton.mjs","sources":["../../../projects/uofx-app-pack/skeleton/src/skeleton.component.ts","../../../projects/uofx-app-pack/skeleton/src/skeleton.component.html","../../../projects/uofx-app-pack/skeleton/src/skeleton.module.ts","../../../projects/uofx-app-pack/skeleton/uofx-app-components-skeleton.ts"],"sourcesContent":["import { Component, HostBinding, Input, OnInit } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'uofx-skeleton',\r\n  templateUrl: './skeleton.component.html',\r\n  styleUrls: ['./skeleton.component.scss'],\r\n})\r\nexport class UofxSkeletonComponent implements OnInit {\r\n  /** 類型 */\r\n  @Input() type: 'list' | 'block' | 'full' = 'list';\r\n  /** 要顯示幾個 seletion */\r\n  @Input() count = 1;\r\n  /** 列表樣式時需有幾行skeleton-text(default:預設為3行、min: 1行) */\r\n  @Input() skeletonTextType: 'default' | 'min' = null;\r\n\r\n  // 押上寬度，不然skeleton會被擠壓跑版\r\n  @HostBinding('style.width.%') width = 100;\r\n\r\n  /** 用來延遲顯示skeleton，避免太頻繁顯示會看起來很像效能不好 */\r\n  showSkeleton = false;\r\n\r\n  skeletonCount = [];\r\n\r\n  ngOnInit() {\r\n    // 預期skeleton顯示的時機是讀資料讀很久的時候，所以做延遲顯示避免skeleton太頻繁顯示\r\n    setTimeout(() => {\r\n      this.showSkeleton = true;\r\n    }, 300);\r\n\r\n    this.skeletonCount = Array(this.count)\r\n      .fill(0)\r\n      .map((x, i) => i);\r\n    if (this.type === 'list' && !this.skeletonTextType) this.skeletonTextType = 'default';\r\n  }\r\n}\r\n","<ng-container *ngIf=\"showSkeleton\" [ngSwitch]=\"type\">\r\n  <ng-container *ngSwitchCase=\"'block'\">\r\n    <!-- 區塊樣式(水平) -->\r\n    <div class=\"uofx-skeleton-block\">\r\n      <ion-label *ngFor=\"let skeleton of skeletonCount\">\r\n        <ion-thumbnail slot=\"start\">\r\n          <ion-skeleton-text animated style=\"width: 60px\"></ion-skeleton-text>\r\n        </ion-thumbnail>\r\n        <span>\r\n          <ion-skeleton-text animated style=\"width: 60px\"></ion-skeleton-text>\r\n        </span>\r\n      </ion-label>\r\n    </div>\r\n  </ng-container>\r\n  <ng-container *ngSwitchCase=\"'full'\">\r\n    <!-- 填滿樣式(垂直) -->\r\n    <div\r\n      class=\"uofx-skeleton-full\"\r\n      [ngClass]=\"{ 'full-list': skeletonCount.length > 1 }\"\r\n      *ngFor=\"let skeleton of skeletonCount\">\r\n      <ion-thumbnail slot=\"start\">\r\n        <ion-skeleton-text animated style=\"width: 100%\"></ion-skeleton-text>\r\n      </ion-thumbnail>\r\n      <span *ngIf=\"skeletonTextType === 'default'\">\r\n        <ion-skeleton-text animated></ion-skeleton-text>\r\n        <ion-skeleton-text animated style=\"width: 50%\"></ion-skeleton-text>\r\n      </span>\r\n    </div>\r\n  </ng-container>\r\n  <ng-container *ngSwitchDefault>\r\n    <!-- 列表樣式(垂直) -->\r\n    <ion-list class=\"no-border-bottom\">\r\n      <ion-item lines=\"none\" *ngFor=\"let skeleton of skeletonCount\">\r\n        <ion-label>\r\n          <ng-container *ngIf=\"skeletonTextType === 'default'; else templateMinSkeletonText\">\r\n            <ng-container *ngTemplateOutlet=\"templateDefaultSkeletonText\"></ng-container>\r\n          </ng-container>\r\n        </ion-label>\r\n      </ion-item>\r\n    </ion-list>\r\n  </ng-container>\r\n</ng-container>\r\n\r\n<!-- 預設 skeleton-text -->\r\n<ng-template #templateDefaultSkeletonText>\r\n  <ion-skeleton-text animated style=\"width: 50%\"></ion-skeleton-text>\r\n  <ion-skeleton-text animated></ion-skeleton-text>\r\n  <ion-skeleton-text animated style=\"width: 70%\"></ion-skeleton-text>\r\n</ng-template>\r\n\r\n<!-- 一行skeleton-text -->\r\n<ng-template #templateMinSkeletonText>\r\n  <ion-skeleton-text animated></ion-skeleton-text>\r\n</ng-template>\r\n","import { CommonModule } from '@angular/common';\r\nimport { NgModule } from '@angular/core';\r\nimport { IonicModule } from '@ionic/angular';\r\nimport { UofxSkeletonComponent } from './skeleton.component';\r\n\r\n@NgModule({\r\n  imports: [CommonModule, IonicModule],\r\n  exports: [UofxSkeletonComponent],\r\n  declarations: [UofxSkeletonComponent],\r\n  providers: [],\r\n})\r\nexport class UofxSkeletonModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}