@rdlabo/ionic-theme-ios26 0.1.1 → 0.1.3

package/demo/src/app/index/pages/floating-action-button/floating-action-button.page.html

@@ -1,106 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-back-button slot="start" defaultHref="/main/index"></ion-back-button>
-    <ion-title>floating-action-button</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true" color="light">
-  <ion-list [inset]="true">
-    <ion-item-group class="header-item-group">
-      <ion-item>
-        <ion-label>
-          <ion-icon name="logo-ionic" style="background: linear-gradient(#489bfd, #2b77f4)"></ion-icon>
-          <h2>floating-action-button</h2>
-          <ion-header collapse="condense">
-            <ion-toolbar></ion-toolbar>
-          </ion-header>
-          <ion-text><code>This page is a component demo for &#64;rdlabo/ionic-theme-ios26.</code></ion-text>
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-
-  <ion-fab slot="fixed" vertical="top" horizontal="start">
-    <ion-fab-button size="small">
-      <ion-icon name="chevron-forward-circle"></ion-icon>
-    </ion-fab-button>
-    <ion-fab-list side="end">
-      <ion-fab-button>
-        <ion-icon name="document"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="color-palette"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="globe"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-  </ion-fab>
-
-  <ion-fab slot="fixed" vertical="top" horizontal="end" [edge]="true">
-    <ion-fab-button>
-      <ion-icon name="chevron-down-circle"></ion-icon>
-    </ion-fab-button>
-    <ion-fab-list side="bottom">
-      <ion-fab-button>
-        <ion-icon name="document"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="color-palette"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="globe"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-  </ion-fab>
-
-  <ion-fab slot="fixed" horizontal="center" vertical="center">
-    <ion-fab-button>
-      <ion-icon name="add"></ion-icon>
-    </ion-fab-button>
-    <ion-fab-list side="top">
-      <ion-fab-button>
-        <ion-icon name="chevron-up"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-    <ion-fab-list side="end">
-      <ion-fab-button>
-        <ion-icon name="chevron-forward"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="chevron-forward"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-    <ion-fab-list side="bottom">
-      <ion-fab-button>
-        <ion-icon name="chevron-down"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-    <ion-fab-list side="start">
-      <ion-fab-button>
-        <ion-icon name="chevron-back"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="chevron-back"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-  </ion-fab>
-
-  <ion-fab slot="fixed" vertical="bottom" horizontal="end">
-    <ion-fab-button>
-      <ion-icon name="chevron-up-circle"></ion-icon>
-    </ion-fab-button>
-    <ion-fab-list side="top">
-      <ion-fab-button>
-        <ion-icon name="document"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="color-palette"></ion-icon>
-      </ion-fab-button>
-      <ion-fab-button>
-        <ion-icon name="globe"></ion-icon>
-      </ion-fab-button>
-    </ion-fab-list>
-  </ion-fab>
-</ion-content>

package/demo/src/app/index/pages/floating-action-button/floating-action-button.page.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FloatingActionButtonPage } from './floating-action-button.page';
-import { testConfig } from '../../../../../util/test.config';
-
-describe('FloatingActionButtonPage', () => {
-  let component: FloatingActionButtonPage;
-  let fixture: ComponentFixture<FloatingActionButtonPage>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      providers: testConfig.providers,
-    }).compileComponents();
-    fixture = TestBed.createComponent(FloatingActionButtonPage);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/demo/src/app/index/pages/floating-action-button/floating-action-button.page.ts

@@ -1,49 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import {
-  IonBackButton,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonFabList,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonItemGroup,
-  IonLabel,
-  IonList,
-  IonText,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-floating-action-button',
-  templateUrl: './floating-action-button.page.html',
-  styleUrls: ['./floating-action-button.page.scss'],
-  standalone: true,
-  imports: [
-    IonContent,
-    IonHeader,
-    IonTitle,
-    IonToolbar,
-    CommonModule,
-    FormsModule,
-    IonBackButton,
-    IonIcon,
-    IonItem,
-    IonItemGroup,
-    IonLabel,
-    IonList,
-    IonText,
-    IonFab,
-    IonFabButton,
-    IonFabList,
-  ],
-})
-export class FloatingActionButtonPage implements OnInit {
-  constructor() {}
-
-  ngOnInit() {}
-}

package/demo/src/app/index/pages/inputs/inputs.page.html

@@ -1,65 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-back-button slot="start" defaultHref="/main/index"></ion-back-button>
-    <ion-title>inputs</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true" color="light">
-  <ion-list [inset]="true">
-    <ion-item-group class="header-item-group">
-      <ion-item>
-        <ion-label>
-          <ion-icon name="logo-ionic" style="background: linear-gradient(#489bfd, #2b77f4)"></ion-icon>
-          <h2>inputs</h2>
-          <ion-header collapse="condense">
-            <ion-toolbar></ion-toolbar>
-          </ion-header>
-          <ion-text><code>This page is a component demo for &#64;rdlabo/ionic-theme-ios26.</code></ion-text>
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-  <ion-list [inset]="true">
-    <ion-item-group>
-      <ion-item>
-        <ion-input label="Default label" placeholder="Enter text"></ion-input>
-      </ion-item>
-
-      <ion-item>
-        <ion-input label="Fixed label" labelPlacement="fixed" placeholder="Enter text"></ion-input>
-      </ion-item>
-
-      <ion-item>
-        <ion-input label="Stacked label" labelPlacement="stacked" placeholder="Enter text"></ion-input>
-      </ion-item>
-
-      <ion-item>
-        <ion-input label="Floating label" labelPlacement="floating" placeholder="Enter text"></ion-input>
-      </ion-item>
-
-      <ion-item>
-        <ion-input type="password" label="Password" value="NeverGonnaGiveYouUp">
-          <ion-input-password-toggle slot="end"></ion-input-password-toggle>
-        </ion-input>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-
-  <ion-list [inset]="true">
-    <ion-item-group>
-      <ion-item>
-        <ion-textarea label="Default label" placeholder="Enter textarea"></ion-textarea>
-      </ion-item>
-      <ion-item>
-        <ion-textarea label="Fixed label" labelPlacement="fixed" placeholder="Enter textarea"></ion-textarea>
-      </ion-item>
-      <ion-item>
-        <ion-textarea label="Stacked label" labelPlacement="stacked" placeholder="Enter textarea"></ion-textarea>
-      </ion-item>
-      <ion-item>
-        <ion-textarea label="Floating label" labelPlacement="floating" placeholder="Enter textarea"></ion-textarea>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-</ion-content>

package/demo/src/app/index/pages/inputs/inputs.page.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { InputsPage } from './inputs.page';
-import { testConfig } from '../../../../../util/test.config';
-
-describe('InputsPage', () => {
-  let component: InputsPage;
-  let fixture: ComponentFixture<InputsPage>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      providers: testConfig.providers,
-    }).compileComponents();
-    fixture = TestBed.createComponent(InputsPage);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/demo/src/app/index/pages/inputs/inputs.page.ts

@@ -1,49 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import {
-  IonBackButton,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonInputPasswordToggle,
-  IonItem,
-  IonItemGroup,
-  IonLabel,
-  IonList,
-  IonText,
-  IonTextarea,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-inputs',
-  templateUrl: './inputs.page.html',
-  styleUrls: ['./inputs.page.scss'],
-  standalone: true,
-  imports: [
-    IonContent,
-    IonHeader,
-    IonTitle,
-    IonToolbar,
-    CommonModule,
-    FormsModule,
-    IonBackButton,
-    IonIcon,
-    IonItem,
-    IonItemGroup,
-    IonLabel,
-    IonList,
-    IonText,
-    IonInput,
-    IonInputPasswordToggle,
-    IonTextarea,
-  ],
-})
-export class InputsPage implements OnInit {
-  constructor() {}
-
-  ngOnInit() {}
-}

package/demo/src/app/index/pages/item-list/item-list.page.html

@@ -1,52 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-back-button slot="start" defaultHref="/main/index"></ion-back-button>
-    <ion-title>item-list</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true" color="light">
-  <ion-list [inset]="true">
-    <ion-item-group class="header-item-group">
-      <ion-item>
-        <ion-label>
-          <ion-icon name="logo-ionic" style="background: linear-gradient(#489bfd, #2b77f4)"></ion-icon>
-          <h2>item-list</h2>
-          <ion-header collapse="condense">
-            <ion-toolbar></ion-toolbar>
-          </ion-header>
-          <ion-text><code>This page is a component demo for &#64;rdlabo/ionic-theme-ios26.</code></ion-text>
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-  <ion-list [inset]="true">
-    <ion-list-header><ion-label>Inset List</ion-label></ion-list-header>
-    <ion-item-group>
-      <ion-item>
-        <ion-label>Basic Item</ion-label>
-      </ion-item>
-      <ion-item>
-        <ion-label>
-          Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-    <ion-note>Note additional information.</ion-note>
-  </ion-list>
-
-  <ion-list>
-    <ion-list-header><ion-label>Default List</ion-label></ion-list-header>
-    <ion-item-group>
-      <ion-item>
-        <ion-label>Basic Item</ion-label>
-      </ion-item>
-      <ion-item>
-        <ion-label>
-          Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-    <ion-note>Note additional information.</ion-note>
-  </ion-list>
-</ion-content>

package/demo/src/app/index/pages/item-list/item-list.page.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { ItemListPage } from './item-list.page';
-import { testConfig } from '../../../../../util/test.config';
-
-describe('ItemListPage', () => {
-  let component: ItemListPage;
-  let fixture: ComponentFixture<ItemListPage>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      providers: testConfig.providers,
-    }).compileComponents();
-    fixture = TestBed.createComponent(ItemListPage);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/demo/src/app/index/pages/item-list/item-list.page.ts

@@ -1,47 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import {
-  IonBackButton,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonItemGroup,
-  IonLabel,
-  IonList,
-  IonListHeader,
-  IonNote,
-  IonText,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-item-list',
-  templateUrl: './item-list.page.html',
-  styleUrls: ['./item-list.page.scss'],
-  standalone: true,
-  imports: [
-    IonContent,
-    IonHeader,
-    IonTitle,
-    IonToolbar,
-    CommonModule,
-    FormsModule,
-    IonBackButton,
-    IonIcon,
-    IonItem,
-    IonItemGroup,
-    IonLabel,
-    IonList,
-    IonText,
-    IonListHeader,
-    IonNote,
-  ],
-})
-export class ItemListPage implements OnInit {
-  constructor() {}
-
-  ngOnInit() {}
-}

package/demo/src/app/index/pages/menu/menu.page.html

@@ -1,13 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-title>menu</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true">
-  <ion-header collapse="condense">
-    <ion-toolbar>
-      <ion-title size="large">menu</ion-title>
-    </ion-toolbar>
-  </ion-header>
-</ion-content>

package/demo/src/app/index/pages/menu/menu.page.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MenuPage } from './menu.page';
-import { testConfig } from '../../../../../util/test.config';
-
-describe('MenuPage', () => {
-  let component: MenuPage;
-  let fixture: ComponentFixture<MenuPage>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      providers: testConfig.providers,
-    }).compileComponents();
-    fixture = TestBed.createComponent(MenuPage);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/demo/src/app/index/pages/menu/menu.page.ts

@@ -1,17 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import { IonContent, IonHeader, IonTitle, IonToolbar } from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-menu',
-  templateUrl: './menu.page.html',
-  styleUrls: ['./menu.page.scss'],
-  standalone: true,
-  imports: [IonContent, IonHeader, IonTitle, IonToolbar, CommonModule, FormsModule],
-})
-export class MenuPage implements OnInit {
-  constructor() {}
-
-  ngOnInit() {}
-}

package/demo/src/app/index/pages/modal/modal.page.html

@@ -1,37 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    @if (this.isModal()) {
-      <ion-buttons slot="end">
-        <ion-button (click)="overlayCtrl.dismiss()"><ion-icon name="close-outline" slot="icon-only"></ion-icon></ion-button>
-      </ion-buttons>
-    } @else {
-      <ion-back-button slot="start" defaultHref="/main/index"></ion-back-button>
-    }
-    <ion-title>modal</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true" color="light">
-  <ion-list [inset]="true">
-    <ion-item-group class="header-item-group">
-      <ion-item>
-        <ion-label>
-          <ion-icon name="logo-ionic" style="background: linear-gradient(#489bfd, #2b77f4)"></ion-icon>
-          <h2>modal</h2>
-          <ion-header collapse="condense">
-            <ion-toolbar></ion-toolbar>
-          </ion-header>
-          <ion-text><code>This page is a component demo for &#64;rdlabo/ionic-theme-ios26.</code></ion-text>
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-
-  <ion-list [inset]="true">
-    <ion-item-group>
-      <ion-item (click)="present('normal')" [button]="true">present:normal</ion-item>
-      <ion-item (click)="present('card')" [button]="true">present:card</ion-item>
-      <ion-item (click)="present('sheet')" [button]="true">present:sheet</ion-item>
-    </ion-item-group>
-  </ion-list>
-</ion-content>

package/demo/src/app/index/pages/modal/modal.page.spec.ts

@@ -1,21 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { ModalPage } from './modal.page';
-import { testConfig } from '../../../../../util/test.config';
-
-describe('ModalPage', () => {
-  let component: ModalPage;
-  let fixture: ComponentFixture<ModalPage>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      providers: testConfig.providers,
-    }).compileComponents();
-    fixture = TestBed.createComponent(ModalPage);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/demo/src/app/index/pages/modal/modal.page.ts

@@ -1,77 +0,0 @@
-import { Component, ElementRef, inject, input, OnInit } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { FormsModule } from '@angular/forms';
-import {
-  IonBackButton,
-  IonButton,
-  IonButtons,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonItemGroup,
-  IonLabel,
-  IonList,
-  IonText,
-  IonTitle,
-  IonToolbar,
-  ModalController,
-} from '@ionic/angular/standalone';
-
-@Component({
-  selector: 'app-modal',
-  templateUrl: './modal.page.html',
-  styleUrls: ['./modal.page.scss'],
-  standalone: true,
-  imports: [
-    IonContent,
-    IonHeader,
-    IonTitle,
-    IonToolbar,
-    CommonModule,
-    FormsModule,
-    IonBackButton,
-    IonIcon,
-    IonItem,
-    IonItemGroup,
-    IonLabel,
-    IonList,
-    IonText,
-    IonButtons,
-    IonButton,
-  ],
-})
-export class ModalPage implements OnInit {
-  readonly overlayCtrl = inject(ModalController);
-  readonly #el = inject(ElementRef);
-
-  readonly isModal = input<boolean>();
-
-  ngOnInit() {}
-
-  async present(type: 'normal' | 'card' | 'sheet') {
-    const modalDefault = {
-      component: ModalPage,
-      componentProps: {
-        isModal: true,
-      },
-    };
-    const applyConfig = ((type) => {
-      if (type === 'card') {
-        return {
-          ...modalDefault,
-          presentingElement: this.#el.nativeElement,
-        };
-      } else if (type === 'sheet') {
-        return {
-          ...modalDefault,
-          breakpoints: [0, 0.5, 0.8],
-          initialBreakpoint: 0.8,
-        };
-      }
-      return modalDefault;
-    })(type);
-    const actionSheet = await this.overlayCtrl.create(applyConfig);
-    await actionSheet.present();
-  }
-}

package/demo/src/app/index/pages/popover/popover.page.html

@@ -1,34 +0,0 @@
-<ion-header [translucent]="true">
-  <ion-toolbar>
-    <ion-back-button slot="start" defaultHref="/main/index"></ion-back-button>
-    <ion-title>popover</ion-title>
-  </ion-toolbar>
-</ion-header>
-
-<ion-content [fullscreen]="true" color="light">
-  <ion-list [inset]="true">
-    <ion-item-group class="header-item-group">
-      <ion-item>
-        <ion-label>
-          <ion-icon name="logo-ionic" style="background: linear-gradient(#489bfd, #2b77f4)"></ion-icon>
-          <h2>popover</h2>
-          <ion-header collapse="condense">
-            <ion-toolbar></ion-toolbar>
-          </ion-header>
-          <ion-text><code>This page is a component demo for &#64;rdlabo/ionic-theme-ios26.</code></ion-text>
-        </ion-label>
-      </ion-item>
-    </ion-item-group>
-  </ion-list>
-
-  <section class="section-example">
-    <ion-button id="click-trigger">Click Me</ion-button>
-    <ion-popover trigger="click-trigger" triggerAction="click">
-      <ng-template>
-        <div class="ion-padding">
-          <ion-text>Hello World!</ion-text>
-        </div>
-      </ng-template>
-    </ion-popover>
-  </section>
-</ion-content>