updates

dist/pdfplayer-stencil/index.esm.js

@@ -1 +0,0 @@
-

dist/types/components.d.ts

@@ -8,6 +8,7 @@ import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 export namespace Components {
     interface TalisPdfViewer {
         "annotations": string;
+        "currentPage": number;
         "depotUrl": string;
         "pageCount": number;
         "token": string;
@@ -27,6 +28,7 @@ declare global {
 declare namespace LocalJSX {
     interface TalisPdfViewer {
         "annotations"?: string;
+        "currentPage"?: number;
         "depotUrl"?: string;
         "pageCount"?: number;
         "token"?: string;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pdfplayer-stencil",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

src/components.d.ts

@@ -8,6 +8,7 @@ import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
 export namespace Components {
     interface TalisPdfViewer {
         "annotations": string;
+        "currentPage": number;
         "depotUrl": string;
         "pageCount": number;
         "token": string;
@@ -27,6 +28,7 @@ declare global {
 declare namespace LocalJSX {
     interface TalisPdfViewer {
         "annotations"?: string;
+        "currentPage"?: number;
         "depotUrl"?: string;
         "pageCount"?: number;
         "token"?: string;

src/components/talis-pdf-viewer/readme.md

@@ -0,0 +1,21 @@
+# talis-pdf-viewer
+
+
+
+<!-- Auto Generated Below -->
+
+
+## Properties
+
+| Property      | Attribute      | Description | Type     | Default     |
+| ------------- | -------------- | ----------- | -------- | ----------- |
+| `annotations` | `annotations`  |             | `string` | `undefined` |
+| `currentPage` | `current-page` |             | `number` | `undefined` |
+| `depotUrl`    | `depot-url`    |             | `string` | `undefined` |
+| `pageCount`   | `page-count`   |             | `number` | `undefined` |
+| `token`       | `token`        |             | `string` | `undefined` |
+
+
+----------------------------------------------
+
+*Built with [StencilJS](https://stenciljs.com/)*

src/components/talis-pdf-viewer/talis-pdf-viewer.css

@@ -12,13 +12,27 @@
   height: auto;
 }
 
+button {
+  font-weight: 400;
+  line-height: 1.333;
+  color: white;
+  background-color: #017d87;
+  border: 1px solid #017d87;
+  font-size: 1.09rem;
+  border-radius: 0.3125rem;
+  margin-left: 10px;
+  margin-right: 10px;
+  margin-top: 5px;
+  padding: 5px 7px;
+  cursor: pointer;
+}
+
 .page-navigation {
   text-align: center;
   display: block;
   bottom: 0px;
-  border-top: solid 1px black;
-  background-color: #017d87;
-
+  border-top: solid 1px #017d87;
+  background-color: white;
   position: absolute;
   bottom: 0px;
   height: 50px;
@@ -27,17 +41,10 @@
   overflow: hidden;
 }
 
-.page-navigation button {
-  font-weight: 400;
-  line-height: 1.333;
+.page-location {
   color: #017d87;
   background-color: white;
-  border-color: #017d87;
-  font-size: 1.09rem;
-  border-radius: 0.3125rem;
-  box-shadow: 0;
-  margin-left: 10px;
-  margin-right: 10px;
+  cursor: default;
 }
 
 .pin-drop-holder {

src/components/talis-pdf-viewer/talis-pdf-viewer.tsx

@@ -10,11 +10,11 @@ export class TalisPdfViewer {
   @Prop() token: string;
   @Prop() pageCount: number;
   @Prop() annotations: string;
+  @Prop() currentPage: number;
   @State() hasLoaded = false;
   @State() showPinDrop = false;
   @State() top: string;
   @State() left: string;
-  @State() currentPage: number = 0;
   @Element() el: HTMLElement;
 
   documentImages: string[] = [];
@@ -104,7 +104,7 @@ export class TalisPdfViewer {
         </div>
         <div class="page-navigation">
           <button onClick={() => this.prevPage()}>Previous</button>
-          <button>Page {this.currentPage + 1}</button>
+          <button class="page-location">Page {this.currentPage + 1}</button>
           <button onClick={() => this.nextPage()}>Next</button>
         </div>
       </div>

src/index.html

@@ -13,6 +13,7 @@
       depot-url="https://files.talis.com/files/62e2788ee8f2f056550eb052/presign?version=2021/09/22/614ad895313a4a0eff4e96c2/png/o/"
       page-count="8"
       token="eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsImtpZCI6InByb2R1Y3Rpb24tandrIn0.eyJqdGkiOiJlNTgwMTNiOTE2OTdhMjM4OGIxNGRkYmYyOTYwNWM5MGE2MzQ1Zjk3IiwiaWF0IjoxNjYyOTc2MDU5LCJleHAiOjE2NjMwMDQ4NTksImF1ZCI6ImhNaXpDbWlYYWpjWU4xS1pMN0hqc1EiLCJzdWIiOiJoTWl6Q21pWGFqY1lOMUtaTDdIanNRIiwic2NvcGVzIjpbImhNaXpDbWlYYWpjWU4xS1pMN0hqc1EiLCJ0ZGM6YXBwOmFjY2VzcyIsImVsZXZhdGU6d3JpdGVAdGFsaXMiLCJlbGV2YXRlOnJlYWRAdGFsaXMiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTpnMjAxIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6YXQxIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6MTAyIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6dmlkMSIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOkFCLTEwMSIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOnVuZGVmaW5lZCIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOlZTMDAxIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6dDEyMyIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOmcxMDMiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTpnMTA1IiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6Y2VvIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6ZGF6emExIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6ZXh3IiwiZWxldmF0ZTp3cml0ZUB3b3J0bGV5IiwiZWxldmF0ZTpyZWFkQHdvcnRsZXkiLCJlbGV2YXRlOndyaXRlQGJyb2FkbWluc3RlciIsImVsZXZhdGU6cmVhZEBicm9hZG1pbnN0ZXIiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTp0ZWFtZWxldmF0ZXJldHJvIiwiZWxldmF0ZTpyZWFkQHRhbGlzLWdvb2dsZSIsImVsZXZhdGU6d3JpdGVAdGFsaXMtZ29vZ2xlIiwiZWxldmF0ZTp3cml0ZUB1Y2wiLCJlbGV2YXRlOnJlYWRAdWNsIiwiZWxldmF0ZTpyZWFkQHN1c3NleCIsImVsZXZhdGU6d3JpdGVAc3Vzc2V4IiwiZWxldmF0ZTp3cml0ZUBleGV0ZXIiLCJlbGV2YXRlOnJlYWRAZXhldGVyIiwic3UiLCJlbGV2YXRlOndyaXRlQGxpbmNvbG4iLCJlbGV2YXRlOnJlYWRAbGluY29sbiIsImVsZXZhdGU6d3JpdGVAYmVja2V0dCIsImVsZXZhdGU6cmVhZEBiZWNrZXR0IiwiZWxldmF0ZTp3cml0ZUBub3J0aHVtYnJpYSIsImVsZXZhdGU6cmVhZEBub3J0aHVtYnJpYSIsImVsZXZhdGU6d3JpdGVAdGFsaXMtZ29vZ2xlOm1vZHVsZTp0ZXN0MSIsImVsZXZhdGU6d3JpdGVAdGFsaXMtZ29vZ2xlOm1vZHVsZTpkMSIsImVsZXZhdGU6d3JpdGVAZ2xhc2dvdyIsImVsZXZhdGU6cmVhZEBnbGFzZ293IiwiZWxldmF0ZTp3cml0ZUB0YWxpcy1nb29nbGU6bW9kdWxlOnVuZGVmaW5lZCIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOm5ld21vZHVsZXRlc3Rpbmctbm10MTAxLSIsImVsZXZhdGU6d3JpdGVAdGFsaXMtZ29vZ2xlOm1vZHVsZTpsZDEiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTpkYWxpdDAwMSIsImVsZXZhdGU6d3JpdGVAdGVzdG9uZSIsImVsZXZhdGU6cmVhZEB0ZXN0b25lIiwiZWxldmF0ZTpzdSIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOnRlc3QtXzg5IiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6aDEiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTplazAxIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6c2IwMSIsImVsZXZhdGU6d3JpdGVAdGFsaXM6bW9kdWxlOmRzZnNkIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6cGVuZG8iLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6a2wiLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6ZDIiLCJlbGV2YXRlOndyaXRlQGJyb2FkbWluc3Rlcjptb2R1bGU6ZHQxIiwiZWxldmF0ZTp3cml0ZUBicm9hZG1pbnN0ZXI6bW9kdWxlOnRlc3QxIiwiZWxldmF0ZTp3cml0ZUBicm9hZG1pbnN0ZXI6bW9kdWxlOmlyMDAxIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6Y2F0YWx5c3QyMDIwdGFsaXMiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTprc3QiLCJlbGV2YXRlOndyaXRlQHRhbGlzOm1vZHVsZTpwbGF0X3JldHJvIiwiZWxldmF0ZTp3cml0ZUB0YWxpczptb2R1bGU6cHdyMjIiLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6ZjEiLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6YW0xMDEiLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6dGFsaXNjb25jb3JkdGVhY2hpbmdtb2R1bGUiLCJlbGV2YXRlOndyaXRlQHRhbGlzLWdvb2dsZTptb2R1bGU6aW1hZ2UxIl19.rEiuqn2ATscMp4E67CQcRqhqG-hW_B66uUNh-8yBxzaFs7fDvLu-a8NzyNEE1BtVYzMi4H6wtCi_vJDmVTmpDaDmklP8SqM56xH2Kvc7G9a64VtHuYAOwtdcx49gk61gvbDaHK-q3FWavy-37-gz0Rt6QdquuMHR2voZf02EmQLMnte8W3SM0mtzix86zjgW6H-wQ5sFThWXm6sn671a-uTHC53ndd4sVY3R2qa1f9zW-KuwYq-5JHF1-KyOetVehmjSkNQdtUarkfidyoJxH_KhDdStRe_REyxkZOLQkz8Rr0fNLnnlkhrjy9j6pUDHnQTWtY_zWaoNVfNQF5m5Cg"
+      current-page="0"
       annotations='[
     {
         "hasBody": {