v6.1.0-beta.1

Updates:

• Ionic 6 / Angular 14 support
• Updated demo project

v5.0.0-beta.3

Fixed null check error when binding toolbarTopMargin property

v5.0.0-beta.2

Upgrade components for Ionic 5 and Angular 9 compatibility

v2.2.2

Fix for production builds

2.2.0

Updated module to work with Ionic 2 final

BREAKING CHANGES

• Needs to add module to tsconfig.json to tell the compiler to transpile the module

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [
      "dom",
      "es2015"
    ],
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "target": "es5"
  },
  "files": [
    "node_modules/ionic-pullup/dist/index.ts"
  ],
  "include": [
    "src/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ],
  "compileOnSave": false,
  "atom": {
    "rewriteTsconfig": false
  }
}

• Import module into app's root module

import { IonPullupModule } from 'ionic-pullup/dist';

@NgModule({
  declarations: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  imports: [
    IonicModule.forRoot(MyApp),
    IonPullupModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}],
  schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class AppModule {}

• Create a two-way binding variable that controls the footer state from your component

import { IonPullUpFooterState} from 'ionic-pullup/dist';

@Component({
  selector: 'page-about',
  templateUrl: 'about.html'
})
export class AboutPage {

  footerState: IonPullUpFooterState;

  constructor(public navCtrl: NavController) {
    this.footerState = IonPullUpFooterState.Collapsed;
  }

  footerExpanded() {
    console.log('Footer expanded!');
  }

  footerCollapsed() {
    console.log('Footer collapsed!');
  }

  toggleFooter() {
    this.footerState = this.footerState == IonPullUpFooterState.Collapsed ? IonPullUpFooterState.Expanded : IonPullUpFooterState.Collapsed;
  }
}

• Add ionic-pullup components to the view

<ion-pullup (onExpand)="footerExpanded()" (onCollapse)="footerCollapsed()" [(state)]="footerState">
  <ion-pullup-tab [footer]="pullup" (tap)="toggleFooter()">
    <ion-icon name="arrow-up" *ngIf="footerState == 0"></ion-icon><ion-icon name="arrow-down" *ngIf="footerState == 1"></ion-icon>
  </ion-pullup-tab>
  <ion-toolbar color="primary" (tap)="toggleFooter()">
    <ion-title>Footer</ion-title>
  </ion-toolbar>
  <ion-content>
   ... FOOTER CONTENT...
  </ion-content>
</ion-pullup>

v1.1.0

This release requires Ionic 1.3 and Angular 1.5

• Added allow-mid-range parameter prevents footer from stopping halfway when dragging (defaults to false)
• Fixes #17 where footer position was wrong when used in multiple views with different template structures (tabs, headers)
• Minor UI fixes and improvements

Breaking changes

• Removed toggle attribute from ion-pull-up-handle directive in favor of two new attributes that allow for better control of icons: icon-expand and icon-collapse. Also, there is not need to specify a default icon as a child element as the directive will add it to the DOM.

<ion-pull-up-handle icon-expand="ion-chevron-up" icon-collapse="ion-chevron-down" style="border-radius: 25px 25px 0 0">
</ion-pull-up-handle>

Thanks: @bianchimro, @nikolaz111, @jsanta

v1.0.3

Fixes issue #1 where component height was wrong after changing device orientation.

Thanks @pliablepixels

v1.0.2

Breaking change

Removed minimize attribute from ion-pull-up-footer directive and added two new attributes for better component behavior:

• initial-state: collapsed || minimized
• default-behavior: expand || hide

v1.0.1

fixed DI issues

v1.0.0

Initial release