@verdocs/web-sdk 6.2.0-beta.11 → 6.2.0-beta.13

package/dist/components/{p-Bt-GZVHa.js.map → p-WzOFvlsv.js.map}

@@ -1 +1 @@
-{"file":"p-Bt-GZVHa.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.scss?tag=verdocs-initial-dialog","src/components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-initial-dialog {\n  font-family: $primary-font;\n  box-sizing: border-box;\n  position: fixed;\n  z-index: 10000;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #0000007f;\n\n  .dialog {\n    width: 100%;\n    max-width: 340px;\n    border-radius: 4px;\n    overflow: hidden;\n    box-shadow: 3px 3px 5px 1px rgba(40, 40, 40, 0.4);\n    background: $dialog-bg;\n  }\n\n  .heading {\n    display: flex;\n    flex-direction: row;\n    padding: 20px 20px 0 20px;\n    line-height: 28px;\n    font-size: 20px;\n    font-weight: 500;\n  }\n\n  .content {\n    font-size: 14px;\n    padding: 20px;\n  }\n\n  .buttons {\n    display: flex;\n    margin: 20px 0 0 0;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n\n    verdocs-button {\n      margin-left: 16px;\n    }\n  }\n\n  canvas {\n    background: #fff;\n    box-sizing: border-box;\n    margin: 0 auto;\n    width: 300px;\n    // TODO: The original app had an aspect ratio of (80 / 305) * (signatureBodyWidth - 20)\n    height: 79px;\n    max-width: 100%;\n    box-shadow: 0 0 6px 0 #0000001f;\n  }\n\n  .disclaimer {\n    text-align: justify;\n    padding: 8px 0;\n    font-size: 11px;\n    line-height: 14px;\n    color: rgba(0, 0, 0, 0.54);\n  }\n\n  .as-shown {\n    font-size: 11px;\n    margin: 4px 0 20px 4px;\n    color: rgba(0, 0, 0, 0.54);\n  }\n\n  .tabs {\n    display: flex;\n    flex-direction: row;\n\n    .tab {\n      padding: 8px 15px;\n      cursor: pointer;\n\n      &.active {\n        border-bottom: 2px solid $light-border-color;\n      }\n\n      &:hover {\n        color: $primary-color;\n      }\n    }\n  }\n}\n","import {Component, Prop, Host, h, Event, EventEmitter, State} from '@stencil/core';\n\n/**\n * Display a dialog that allows the user to specify an initials image, either by using a signature-font-generated image\n * based on their full name, or by hand-drawing their initials with a mouse or tablet.\n */\n@Component({\n  tag: 'verdocs-initial-dialog',\n  styleUrl: 'verdocs-initial-dialog.scss',\n})\nexport class VerdocsInitialDialog {\n  private canvasElement?: HTMLCanvasElement;\n\n  /**\n   * Initial signature text\n   */\n  @Prop() initials: string = '';\n\n  /**\n   * Fired when the user completes the dialog and clicks Adopt. The event detail will contain a base64-encoded string\n   * representation of the initials adopted.\n   */\n  @Event({composed: true}) next: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: EventEmitter;\n\n  @State() fontLoaded = false;\n\n  @State() enteredInitials: string = '';\n\n  @State() mode: string = 'type';\n\n  componentWillLoad() {\n    this.enteredInitials = this.initials.toUpperCase();\n\n    const ds = new FontFace('Dancing Script', 'url(https://fonts.gstatic.com/s/dancingscript/v19/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7BMSo3Sup6hNX6plRP.woff)');\n    ds.load().then(font => {\n      document.fonts.add(font);\n      this.fontLoaded = true;\n    });\n  }\n\n  componentDidLoad() {\n    this.redrawSignature();\n  }\n\n  componentDidUpdate() {\n    this.redrawSignature();\n  }\n\n  redrawSignature() {\n    if (!this.canvasElement) {\n      return;\n    }\n\n    const canvasWidth = this.canvasElement.width;\n\n    const context = this.canvasElement.getContext('2d');\n    context.clearRect(0, 0, this.canvasElement.width, this.canvasElement.height);\n\n    let fontSize = 100;\n    do {\n      fontSize -= 2;\n      context.font = `${fontSize}px Dancing Script`;\n    } while (context.measureText(this.enteredInitials).width > canvasWidth - 32); // 32px padding each side\n\n    context.textAlign = 'center';\n    context.textBaseline = 'middle';\n    context.font = `${fontSize}px Dancing Script`;\n    context.fillText(this.enteredInitials, this.canvasElement.width / 2, this.canvasElement.height / 2);\n  }\n\n  handleNameChange(e: any) {\n    this.enteredInitials = e.target.value;\n  }\n\n  handleCancel(e: any) {\n    e.stopPropagation();\n    e.preventDefault();\n    this.exit.emit();\n  }\n\n  handleAdopt(e: any) {\n    e.stopPropagation();\n    e.preventDefault();\n    const data = this.canvasElement.toDataURL('image/png');\n    this.next.emit(data);\n  }\n\n  /*\n  selColor(hex: string) {\n    this.color = hex;\n    this.animateDraw();\n  }\n\n  stopDraw() {\n    this.paint = false;\n    this.adoptedAndSigned = !this.hasSignature();\n  }\n\n  draw(e) {\n    this.paint = true;\n    this.addPoints(e, false);\n    this.animateDraw();\n  }\n\n  recordPoints(e) {\n    if (this.paint) {\n      this.addPoints(e, true);\n      this.animateDraw();\n    }\n  }\n\n  animateDraw() {\n    this.canvas.clearRect(0, 0, this.canvas.canvas.offsetWidth, this.canvas.canvas.offsetHeight);\n\n    this.canvas.strokeStyle = this.color || '#000000';\n    this.canvas.lineJoin = 'round';\n    this.canvas.lineWidth = 3;\n\n    for (let i = 0; i < this.points.length; i++) {\n      this.canvas.beginPath();\n      if (this.points[i].drag && i) {\n        this.canvas.moveTo(this.points[i - 1].x, this.points[i - 1].y);\n        // this.canvas.arc(this.points[i - 1].x, this.points[i - 1].y, 2, 0, 2 * Math.PI, false);\n      } else {\n        this.canvas.moveTo(this.points[i].x - 1, this.points[i].y);\n        // this.canvas.arc(this.points[i].x, this.points[i].y, 2, 0, 2 * Math.PI, false);\n      }\n\n      this.canvas.lineTo(this.points[i].x, this.points[i].y);\n      this.canvas.closePath();\n      this.canvas.stroke();\n    }\n  }\n\n  drawCurve(color: string, curve: number) {\n    this.canvas.beginPath();\n  }\n\n\n\n  addPoints(e, drag: boolean) {\n    if (window) {\n      let x;\n      let y;\n      e.preventDefault();\n      if (e.touches && e.touches.length > 0) {\n        x = e.touches[0].clientX;\n      } else {\n        x = e.clientX;\n      }\n\n      if (e.touches && e.touches.length > 0) {\n        y = e.touches[0].clientY;\n      } else {\n        y = e.clientY;\n      }\n      const rect = this.signatureCanvas.nativeElement.getBoundingClientRect();\n      this.points.push({\n        x: x - rect.left,\n        y: y - rect.top,\n        drag: drag\n      });\n    }\n  }\n\n  clearPad() {\n    this.canvas.clearRect(0, 0, this.canvas.canvas.offsetWidth, this.canvas.canvas.offsetHeight);\n    this.points = [];\n    this.adoptedAndSigned = !this.hasSignature();\n  }\n\n    async adoptAndSign() {\n    try {\n      this.adoptedAndSigned = true;\n      await this.updateFullName();\n      await this.captureSignatureFromCanvas();\n      const message = this.signatureMode === 'Signature' ? 'Saving Signature' : 'Saving Initial';\n      this.snackbarService.open(message, 'OK', this.snackbarService.initConfig(null, 'bottom'));\n      this.handleMode();\n    } catch (err) {\n      this.snackbarService.open('Failed to apply signature', 'OK', this.snackbarService.initConfig(null, 'bottom'));\n    }\n  }\n\n  handleMode() {\n    let currentField;\n    switch (this.mode) {\n      case 'signerview':\n        if (this.signatureMode === 'Signature') {\n          this.signatureService.postSignatureBlob().then(result => {\n            if (result && result.id && result.url) {\n              currentField = this.signatureService.currField;\n              this.signatureService.updateSigned(currentField.fName, true);\n              this.signatureService.toggleSig(false);\n              this.signatureService.setSignatureId(result.id);\n              this.signatureService.putSignatureField(this.envelopeId, this.fieldName, result.id).then(res => {\n                this.eventTracker.createEvent({\n                  category: 'verdoc',\n                  action: 'verdoc signed',\n                  label: `verdoc id: ${this.envelopeId}`\n                })\n                if (res && res.settings) {\n                  this.signatureService.setSignatureData(res.settings.base64);\n                  this.signatureService.setSignatureId(res.settings.signature_id);\n                }\n                this.snackbarService.dismiss();\n                this.dialog.close({ status: 'saved', temp_sig: res.settings.base64, sig_id: res.settings.signature_id });\n              }).catch(err => {\n                this.snackbarService.open('Failed to save signature. Please try again.', 'DISMISS', {\n                  duration: 3000\n                });\n                this.adoptedAndSigned = false;\n                return err;\n              });\n            }\n          });\n        } else {\n          this.signatureService.postInitialBlob().then(result => {\n            if (result && result.id && result.url) {\n              currentField = this.signatureService.currField;\n              this.signatureService.updateInitialed(currentField.fName, true);\n              this.signatureService.setInitialId(result.id);\n              this.signatureService.toggleSig(false);\n              this.signatureService.putInitialField(this.envelopeId, this.fieldName, result.id).then(res => {\n                if (res && res.settings) {\n                  this.signatureService.setInitialData(res.settings.base64);\n                  this.signatureService.setInitialId(res.settings.initial_id);\n                }\n                this.snackbarService.dismiss();\n                this.dialog.close({ status: 'saved', temp_int: res.settings.base64, int_id: res.settings.initial_id });\n              }).catch(err => {\n                this.snackbarService.open('Failed to save initial. Please try again.', 'DISMISS', {\n                  duration: 3000\n                });\n                this.adoptedAndSigned = false;\n                return err;\n              });\n            }\n          });\n        }\n        break;\n    }\n  }\n   */\n\n  render() {\n    return (\n      <Host onClick={e => this.handleCancel(e)}>\n        <div class=\"dialog\">\n          <div class=\"heading\">Create Your Initial</div>\n\n          <div class=\"content\">\n            <verdocs-text-input\n              placeholder=\"Initials...\"\n              label=\"Initials\"\n              value={this.enteredInitials}\n              onInput={e => this.handleNameChange(e)}\n              onClick={e => e.stopPropagation()}\n            />\n            <div class=\"as-shown\">As shown on driver's license or govt. ID card.</div>\n\n            {/*<div class=\"tabs\">*/}\n            {/*  <div class={{tab: true, active: this.mode === 'type'}} onClick={() => (this.mode = 'type')}>*/}\n            {/*    Type*/}\n            {/*  </div>*/}\n            {/*  <div class={{tab: true, active: this.mode === 'draw'}} onClick={() => (this.mode = 'draw')}>*/}\n            {/*    Draw*/}\n            {/*  </div>*/}\n            {/*</div>*/}\n\n            {this.fontLoaded ? <canvas ref={el => (this.canvasElement = el as HTMLCanvasElement)} /> : <div style={{display: 'none'}} />}\n\n            <div class=\"disclaimer\">\n              By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents,\n              including legally binding contracts &mdash; just the same as a pen-and-paper signature or initial.\n            </div>\n\n            <div class=\"buttons\">\n              <verdocs-button label=\"CANCEL\" size=\"normal\" variant=\"outline\" onClick={e => this.handleCancel(e)} />\n              <verdocs-button label=\"Adopt & Sign\" size=\"normal\" onClick={e => this.handleAdopt(e)} />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-WzOFvlsv.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.scss?tag=verdocs-initial-dialog","src/components/dialogs/verdocs-initial-dialog/verdocs-initial-dialog.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-initial-dialog {\n  font-family: $primary-font;\n  box-sizing: border-box;\n  position: fixed;\n  z-index: 10000;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: #0000007f;\n\n  .dialog {\n    width: 100%;\n    max-width: 340px;\n    border-radius: 4px;\n    overflow: hidden;\n    box-shadow: 3px 3px 5px 1px rgba(40, 40, 40, 0.4);\n    background: $dialog-bg;\n  }\n\n  .heading {\n    display: flex;\n    flex-direction: row;\n    padding: 20px 20px 0 20px;\n    line-height: 28px;\n    font-size: 20px;\n    font-weight: 500;\n  }\n\n  .content {\n    font-size: 14px;\n    padding: 20px;\n  }\n\n  .buttons {\n    display: flex;\n    margin: 20px 0 0 0;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n\n    verdocs-button {\n      margin-left: 16px;\n    }\n  }\n\n  canvas {\n    background: #fff;\n    box-sizing: border-box;\n    margin: 0 auto;\n    width: 300px;\n    // TODO: The original app had an aspect ratio of (80 / 305) * (signatureBodyWidth - 20)\n    height: 79px;\n    max-width: 100%;\n    box-shadow: 0 0 6px 0 #0000001f;\n  }\n\n  .disclaimer {\n    text-align: justify;\n    padding: 8px 0;\n    font-size: 11px;\n    line-height: 14px;\n    color: rgba(0, 0, 0, 0.54);\n  }\n\n  .as-shown {\n    font-size: 11px;\n    margin: 4px 0 20px 4px;\n    color: rgba(0, 0, 0, 0.54);\n  }\n\n  .tabs {\n    display: flex;\n    flex-direction: row;\n\n    .tab {\n      padding: 8px 15px;\n      cursor: pointer;\n\n      &.active {\n        border-bottom: 2px solid $light-border-color;\n      }\n\n      &:hover {\n        color: $primary-color;\n      }\n    }\n  }\n}\n","import {Component, Prop, Host, h, Event, EventEmitter, State} from '@stencil/core';\n\n/**\n * Display a dialog that allows the user to specify an initials image, either by using a signature-font-generated image\n * based on their full name, or by hand-drawing their initials with a mouse or tablet.\n */\n@Component({\n  tag: 'verdocs-initial-dialog',\n  styleUrl: 'verdocs-initial-dialog.scss',\n})\nexport class VerdocsInitialDialog {\n  private canvasElement?: HTMLCanvasElement;\n\n  /**\n   * Initial signature text\n   */\n  @Prop() initials: string = '';\n\n  /**\n   * Fired when the user completes the dialog and clicks Adopt. The event detail will contain a base64-encoded string\n   * representation of the initials adopted.\n   */\n  @Event({composed: true}) next: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: EventEmitter;\n\n  @State() fontLoaded = false;\n\n  @State() enteredInitials: string = '';\n\n  @State() mode: string = 'type';\n\n  componentWillLoad() {\n    this.enteredInitials = this.initials.toUpperCase();\n\n    const ds = new FontFace('Dancing Script', 'url(https://fonts.gstatic.com/s/dancingscript/v19/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7BMSo3Sup6hNX6plRP.woff)');\n    ds.load().then(font => {\n      document.fonts.add(font);\n      this.fontLoaded = true;\n    });\n  }\n\n  componentDidLoad() {\n    this.redrawSignature();\n  }\n\n  componentDidUpdate() {\n    this.redrawSignature();\n  }\n\n  redrawSignature() {\n    if (!this.canvasElement) {\n      return;\n    }\n\n    const canvasWidth = this.canvasElement.width;\n\n    const context = this.canvasElement.getContext('2d');\n    context.clearRect(0, 0, this.canvasElement.width, this.canvasElement.height);\n\n    let fontSize = 100;\n    do {\n      fontSize -= 2;\n      context.font = `${fontSize}px Dancing Script`;\n    } while (context.measureText(this.enteredInitials).width > canvasWidth - 32); // 32px padding each side\n\n    context.textAlign = 'center';\n    context.textBaseline = 'middle';\n    context.font = `${fontSize}px Dancing Script`;\n    context.fillText(this.enteredInitials, this.canvasElement.width / 2, this.canvasElement.height / 2);\n  }\n\n  handleNameChange(e: any) {\n    this.enteredInitials = e.target.value;\n  }\n\n  handleCancel(e: any) {\n    e.stopPropagation();\n    e.preventDefault();\n    this.exit.emit();\n  }\n\n  handleAdopt(e: any) {\n    e.stopPropagation();\n    e.preventDefault();\n    const data = this.canvasElement.toDataURL('image/png');\n    this.next.emit(data);\n  }\n\n  /*\n  selColor(hex: string) {\n    this.color = hex;\n    this.animateDraw();\n  }\n\n  stopDraw() {\n    this.paint = false;\n    this.adoptedAndSigned = !this.hasSignature();\n  }\n\n  draw(e) {\n    this.paint = true;\n    this.addPoints(e, false);\n    this.animateDraw();\n  }\n\n  recordPoints(e) {\n    if (this.paint) {\n      this.addPoints(e, true);\n      this.animateDraw();\n    }\n  }\n\n  animateDraw() {\n    this.canvas.clearRect(0, 0, this.canvas.canvas.offsetWidth, this.canvas.canvas.offsetHeight);\n\n    this.canvas.strokeStyle = this.color || '#000000';\n    this.canvas.lineJoin = 'round';\n    this.canvas.lineWidth = 3;\n\n    for (let i = 0; i < this.points.length; i++) {\n      this.canvas.beginPath();\n      if (this.points[i].drag && i) {\n        this.canvas.moveTo(this.points[i - 1].x, this.points[i - 1].y);\n        // this.canvas.arc(this.points[i - 1].x, this.points[i - 1].y, 2, 0, 2 * Math.PI, false);\n      } else {\n        this.canvas.moveTo(this.points[i].x - 1, this.points[i].y);\n        // this.canvas.arc(this.points[i].x, this.points[i].y, 2, 0, 2 * Math.PI, false);\n      }\n\n      this.canvas.lineTo(this.points[i].x, this.points[i].y);\n      this.canvas.closePath();\n      this.canvas.stroke();\n    }\n  }\n\n  drawCurve(color: string, curve: number) {\n    this.canvas.beginPath();\n  }\n\n\n\n  addPoints(e, drag: boolean) {\n    if (window) {\n      let x;\n      let y;\n      e.preventDefault();\n      if (e.touches && e.touches.length > 0) {\n        x = e.touches[0].clientX;\n      } else {\n        x = e.clientX;\n      }\n\n      if (e.touches && e.touches.length > 0) {\n        y = e.touches[0].clientY;\n      } else {\n        y = e.clientY;\n      }\n      const rect = this.signatureCanvas.nativeElement.getBoundingClientRect();\n      this.points.push({\n        x: x - rect.left,\n        y: y - rect.top,\n        drag: drag\n      });\n    }\n  }\n\n  clearPad() {\n    this.canvas.clearRect(0, 0, this.canvas.canvas.offsetWidth, this.canvas.canvas.offsetHeight);\n    this.points = [];\n    this.adoptedAndSigned = !this.hasSignature();\n  }\n\n    async adoptAndSign() {\n    try {\n      this.adoptedAndSigned = true;\n      await this.updateFullName();\n      await this.captureSignatureFromCanvas();\n      const message = this.signatureMode === 'Signature' ? 'Saving Signature' : 'Saving Initial';\n      this.snackbarService.open(message, 'OK', this.snackbarService.initConfig(null, 'bottom'));\n      this.handleMode();\n    } catch (err) {\n      this.snackbarService.open('Failed to apply signature', 'OK', this.snackbarService.initConfig(null, 'bottom'));\n    }\n  }\n\n  handleMode() {\n    let currentField;\n    switch (this.mode) {\n      case 'signerview':\n        if (this.signatureMode === 'Signature') {\n          this.signatureService.postSignatureBlob().then(result => {\n            if (result && result.id && result.url) {\n              currentField = this.signatureService.currField;\n              this.signatureService.updateSigned(currentField.fName, true);\n              this.signatureService.toggleSig(false);\n              this.signatureService.setSignatureId(result.id);\n              this.signatureService.putSignatureField(this.envelopeId, this.fieldName, result.id).then(res => {\n                this.eventTracker.createEvent({\n                  category: 'verdoc',\n                  action: 'verdoc signed',\n                  label: `verdoc id: ${this.envelopeId}`\n                })\n                if (res && res.settings) {\n                  this.signatureService.setSignatureData(res.settings.base64);\n                  this.signatureService.setSignatureId(res.settings.signature_id);\n                }\n                this.snackbarService.dismiss();\n                this.dialog.close({ status: 'saved', temp_sig: res.settings.base64, sig_id: res.settings.signature_id });\n              }).catch(err => {\n                this.snackbarService.open('Failed to save signature. Please try again.', 'DISMISS', {\n                  duration: 3000\n                });\n                this.adoptedAndSigned = false;\n                return err;\n              });\n            }\n          });\n        } else {\n          this.signatureService.postInitialBlob().then(result => {\n            if (result && result.id && result.url) {\n              currentField = this.signatureService.currField;\n              this.signatureService.updateInitialed(currentField.fName, true);\n              this.signatureService.setInitialId(result.id);\n              this.signatureService.toggleSig(false);\n              this.signatureService.putInitialField(this.envelopeId, this.fieldName, result.id).then(res => {\n                if (res && res.settings) {\n                  this.signatureService.setInitialData(res.settings.base64);\n                  this.signatureService.setInitialId(res.settings.initial_id);\n                }\n                this.snackbarService.dismiss();\n                this.dialog.close({ status: 'saved', temp_int: res.settings.base64, int_id: res.settings.initial_id });\n              }).catch(err => {\n                this.snackbarService.open('Failed to save initial. Please try again.', 'DISMISS', {\n                  duration: 3000\n                });\n                this.adoptedAndSigned = false;\n                return err;\n              });\n            }\n          });\n        }\n        break;\n    }\n  }\n   */\n\n  render() {\n    return (\n      <Host onClick={e => this.handleCancel(e)}>\n        <div class=\"dialog\">\n          <div class=\"heading\">Create Your Initial</div>\n\n          <div class=\"content\">\n            <verdocs-text-input\n              placeholder=\"Initials...\"\n              label=\"Initials\"\n              value={this.enteredInitials}\n              onInput={e => this.handleNameChange(e)}\n              onClick={e => e.stopPropagation()}\n            />\n            <div class=\"as-shown\">As shown on driver's license or govt. ID card.</div>\n\n            {/*<div class=\"tabs\">*/}\n            {/*  <div class={{tab: true, active: this.mode === 'type'}} onClick={() => (this.mode = 'type')}>*/}\n            {/*    Type*/}\n            {/*  </div>*/}\n            {/*  <div class={{tab: true, active: this.mode === 'draw'}} onClick={() => (this.mode = 'draw')}>*/}\n            {/*    Draw*/}\n            {/*  </div>*/}\n            {/*</div>*/}\n\n            {this.fontLoaded ? <canvas ref={el => (this.canvasElement = el as HTMLCanvasElement)} /> : <div style={{display: 'none'}} />}\n\n            <div class=\"disclaimer\">\n              By clicking Adopt, I agree that the signature will be the electronic representation of my signature for all purposes when I (or my agent) use them on documents,\n              including legally binding contracts &mdash; just the same as a pen-and-paper signature or initial.\n            </div>\n\n            <div class=\"buttons\">\n              <verdocs-button label=\"CANCEL\" size=\"normal\" variant=\"outline\" onClick={e => this.handleCancel(e)} />\n              <verdocs-button label=\"Adopt & Sign\" size=\"normal\" onClick={e => this.handleAdopt(e)} />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-dHBtO65i.js → p-ZnrDtTZt.js}

@@ -1,19 +1,20 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-BuCJI6fl.js';
-import { getRGBA } from '@verdocs/js-sdk';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-Clw7inRP.js';
+import { VerdocsEndpoint, updateField, getRGBA } from '@verdocs/js-sdk';
 import { S as SettingsIcon } from './p-7LXbcjVz.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$a } from './p-D_VkX_nC.js';
-import { d as defineCustomElement$9 } from './p-ChnAjOXc.js';
-import { d as defineCustomElement$8 } from './p-DPAlF5W0.js';
-import { d as defineCustomElement$7 } from './p-DGYycCbd.js';
-import { d as defineCustomElement$6 } from './p-Bt-GZVHa.js';
-import { d as defineCustomElement$5 } from './p-VxVNy_Vd.js';
-import { d as defineCustomElement$4 } from './p-BDofff4X.js';
-import { d as defineCustomElement$3 } from './p-Bv5CFhqy.js';
-import { d as defineCustomElement$2 } from './p-BNTIQRGG.js';
-import { d as defineCustomElement$1 } from './p-BlKUYiXH.js';
+import { i as interact } from './p-CGNX5HqF.js';
+import { d as defineCustomElement$a } from './p-BEuU1xX4.js';
+import { d as defineCustomElement$9 } from './p-BTA1be7y.js';
+import { d as defineCustomElement$8 } from './p-8YJmijSd.js';
+import { d as defineCustomElement$7 } from './p-C-4fLUhc.js';
+import { d as defineCustomElement$6 } from './p-WzOFvlsv.js';
+import { d as defineCustomElement$5 } from './p-DnaGcy-V.js';
+import { d as defineCustomElement$4 } from './p-ChYa_oDl.js';
+import { d as defineCustomElement$3 } from './p-Clx6y9zn.js';
+import { d as defineCustomElement$2 } from './p-18h9UMkx.js';
+import { d as defineCustomElement$1 } from './p-B9Ea7YKs.js';
 
-const verdocsFieldInitialCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-field-initial{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:83px;height:36px;display:block;font-size:11px;position:relative;letter-spacing:0.3px;scroll-margin:20px 0;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-initial label{top:-14px;left:-1px;height:14px;color:white;padding:0 4px;font-size:9px;line-height:13px;position:absolute;background:#4a4a99;border-top-left-radius:2px;border-top-right-radius:2px}verdocs-field-initial.done{border:none;opacity:1}verdocs-field-initial img{display:block;max-width:100%;max-height:100%}verdocs-field-initial.disabled img{opacity:0.5}verdocs-field-initial button{cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-initial button.hide{display:none}verdocs-field-initial.required{border:1px solid #cc0000}verdocs-field-initial.focused{-webkit-animation:verdocs-field-pulse 0.4s 1;animation:verdocs-field-pulse 0.4s 1}verdocs-field-initial verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-initial verdocs-button-panel[data-active],verdocs-field-initial verdocs-button-panel:hover{opacity:1}verdocs-field-initial verdocs-button-panel .icon svg{fill:#333333}verdocs-field-initial verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-initial .settings-icon{position:absolute;top:-3px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-initial .settings-icon svg{fill:#707ae5}verdocs-field-initial .settings-icon:hover{opacity:1}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}";
+const verdocsFieldInitialCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-field-initial{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;width:83px;height:36px;display:block;font-size:11px;position:relative;letter-spacing:0.3px;scroll-margin:20px 0;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-initial label{top:-14px;left:-1px;height:14px;color:white;padding:0 4px;font-size:9px;line-height:13px;position:absolute;background:#4a4a99;border-top-left-radius:2px;border-top-right-radius:2px}verdocs-field-initial.done{border:none;opacity:1}verdocs-field-initial img{display:block;max-width:100%;max-height:100%}verdocs-field-initial.disabled img{opacity:0.5}verdocs-field-initial button{cursor:inherit;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;color:rgba(0, 0, 0, 0.87);font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;height:100%;width:100%;background:none;font-size:11px}verdocs-field-initial button.hide{display:none}verdocs-field-initial.required{border:1px solid #cc0000}verdocs-field-initial.focused{-webkit-animation:verdocs-field-pulse 0.4s 1;animation:verdocs-field-pulse 0.4s 1}verdocs-field-initial verdocs-button-panel{top:-3px;left:-2px;opacity:0.5;z-index:1000;cursor:pointer;position:absolute;-webkit-transform:scale(0.6);transform:scale(0.6)}verdocs-field-initial verdocs-button-panel[data-active],verdocs-field-initial verdocs-button-panel:hover{opacity:1}verdocs-field-initial verdocs-button-panel .icon svg{fill:#333333}verdocs-field-initial verdocs-button-panel .icon:hover svg{fill:#000000}verdocs-field-initial .settings-icon{position:absolute;top:-3px;left:-20px;display:inline-block;cursor:pointer;opacity:0.3}verdocs-field-initial .settings-icon svg{fill:#707ae5}verdocs-field-initial .settings-icon:hover{opacity:1}verdocs-field-initial .edge-top,verdocs-field-initial .edge-right,verdocs-field-initial .edge-left,verdocs-field-initial .edge-bottom{position:absolute;z-index:10}verdocs-field-initial .edge-top{top:-2px;left:0;right:0;height:5px}verdocs-field-initial .edge-right{top:0;bottom:0;right:-2px;width:5px}verdocs-field-initial .edge-left{top:0;left:-2px;bottom:0;width:5px}verdocs-field-initial .edge-bottom{bottom:-2px;left:0;right:0;height:5px}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}";
 
 const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldInitial extends H {
     constructor(registerHost) {
@@ -84,6 +85,76 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
     async focusField() {
         this.handleShow();
     }
+    componentDidRender() {
+        interact.dynamicDrop(true);
+        if (this.editable) {
+            interact(this.el).resizable({
+                edges: {
+                    top: '.edge-top',
+                    left: '.edge-left',
+                    bottom: '.edge-bottom',
+                    right: '.edge-right',
+                },
+                modifiers: [
+                    interact.modifiers.restrictSize({
+                        min: { width: 71, height: 36 },
+                    }),
+                ],
+                listeners: {
+                    start: this.handleResizeStart.bind(this),
+                    move: this.handleResize.bind(this),
+                    end: this.handleResizeEnd.bind(this),
+                },
+            });
+        }
+    }
+    handleResizeStart(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        e.target.dataset.originalBottom = e.target.style.bottom;
+    }
+    handleResize(e) {
+        let { width, height } = e.rect;
+        const dX = e.deltaRect.left;
+        const dY = e.deltaRect.bottom;
+        const currentLeft = parseFloat(e.target.style.left);
+        const currentBottom = parseFloat(e.target.style.bottom);
+        width /= this.xscale;
+        height /= this.yscale;
+        Object.assign(e.target.style, {
+            width: `${width}px`,
+            height: `${height}px`,
+            left: `${currentLeft + dX}px`,
+            bottom: `${currentBottom - dY}px`,
+        });
+    }
+    async handleResizeEnd(e) {
+        const { sourceid, fieldname } = this;
+        const width = Math.round(parseFloat(e.target.style.width));
+        let height = Math.round(parseFloat(e.target.style.height));
+        if (height < 20) {
+            height = 15;
+        }
+        const newBottom = parseFloat(e.target.style.bottom);
+        const originalBottom = parseFloat(e.target.dataset.originalBottom);
+        const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);
+        const oldField = template.fields.find(f => f.name === fieldname);
+        const y = newBottom !== originalBottom ? newBottom / this.yscale : oldField === null || oldField === void 0 ? void 0 : oldField.y;
+        updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, { width, height, y })
+            .then(async (updatedField) => {
+            var _a;
+            const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);
+            const newTemplate = JSON.parse(JSON.stringify(template));
+            const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);
+            if (fieldIndex > -1) {
+                newTemplate.fields[fieldIndex] = updatedField;
+            }
+            Store.updateTemplate(this.sourceid, newTemplate);
+            (_a = this.settingsChanged) === null || _a === void 0 ? void 0 : _a.emit({ fieldName: fieldname, field: updatedField });
+            Object.assign(e.target.dataset, { x: 0, y: 0, h: 0 });
+        })
+            .catch(e => console.log('Field update failed', e));
+    }
     hideDialog() {
         var _a;
         (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.remove();
@@ -127,7 +198,7 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
         if (done) {
             return h(Host, { class: { done } }, value && h("img", { src: value, alt: "Initial" }));
         }
-        return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, label && h("label", null, label), base64 ? h("img", { src: base64, alt: "Initial" }) : h("button", { onClick: () => !disabled && this.handleShow() }, "Initial"), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
+        return (h(Host, { class: { required, disabled, done, focused }, style: { backgroundColor } }, editable && h("div", { class: "edge-right" }), editable && h("div", { class: "edge-left" }), editable && h("div", { class: "edge-top" }), editable && h("div", { class: "edge-bottom" }), label && h("label", null, label), base64 ? h("img", { src: base64, alt: "Initial" }) : h("button", { onClick: () => !disabled && this.handleShow() }, "Initial"), editable && (h(Fragment, null, h("div", { id: `verdocs-settings-panel-trigger-${fieldname}`, style: { transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})` }, class: "settings-icon", innerHTML: SettingsIcon, onClick: (e) => {
                 e.stopPropagation();
                 this.showingProperties = !this.showingProperties;
             } }), this.showingProperties && (h("verdocs-portal", { anchor: `verdocs-settings-panel-trigger-${fieldname}`, onClickAway: () => (this.showingProperties = false) }, h("verdocs-template-field-properties", { templateId: sourceid, fieldName: fieldname, onClose: () => (this.showingProperties = false), onDelete: () => {
@@ -140,6 +211,7 @@ const VerdocsFieldInitial = /*@__PURE__*/ proxyCustomElement(class VerdocsFieldI
                 return this.hideSettingsPanel();
             }, helpText: "initial fields capture the recipient's initials on a clause or page." })))))));
     }
+    get el() { return this; }
     static get style() { return verdocsFieldInitialCss; }
 }, [256, "verdocs-field-initial", {
         "source": [513],
@@ -226,6 +298,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsFieldInitial as V, defineCustomElement as d };
-//# sourceMappingURL=p-dHBtO65i.js.map
+//# sourceMappingURL=p-ZnrDtTZt.js.map
 
-//# sourceMappingURL=p-dHBtO65i.js.map
+//# sourceMappingURL=p-ZnrDtTZt.js.map

package/dist/components/p-ZnrDtTZt.js.map

@@ -0,0 +1 @@
+{"file":"p-ZnrDtTZt.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/fields/verdocs-field-initial/verdocs-field-initial.scss?tag=verdocs-field-initial","src/components/fields/verdocs-field-initial/verdocs-field-initial.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-initial {\n  font-family: $verdocs-primary-font;\n  width: 83px;\n  height: 36px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  letter-spacing: 0.3px;\n  scroll-margin: 20px 0;\n  background-color: transparent;\n  transform-origin: bottom left;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n\n  label {\n    top: -14px;\n    left: -1px;\n    height: 14px;\n    color: white;\n    padding: 0 4px;\n    font-size: 9px;\n    line-height: 13px;\n    position: absolute;\n    background: #4a4a99;\n    border-top-left-radius: 2px;\n    border-top-right-radius: 2px;\n  }\n\n  &.done {\n    border: none;\n    opacity: 1;\n  }\n\n  img {\n    display: block;\n    max-width: 100%;\n    max-height: 100%;\n  }\n\n  &.disabled img {\n    opacity: 0.5;\n  }\n\n  button {\n    // This is needed to bring down the cursor from the parent element, which is where interactjs applies it\n    cursor: inherit;\n\n    box-sizing: border-box;\n    border: none;\n    color: rgba(0, 0, 0, 0.87);\n    font-weight: 500;\n    transform-origin: 0 0;\n    height: 100%;\n    width: 100%;\n    background: none;\n    font-size: 11px;\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid $verdocs-red-1;\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.4s 1;\n  }\n\n  verdocs-button-panel {\n    top: -3px;\n    left: -2px;\n    opacity: 0.5;\n    z-index: 1000;\n    cursor: pointer;\n    position: absolute;\n    transform: scale(0.6);\n\n    &[data-active],\n    &:hover {\n      opacity: 1;\n    }\n\n    .icon {\n      svg {\n        fill: #333333;\n      }\n\n      &:hover {\n        svg {\n          fill: #000000;\n        }\n      }\n    }\n  }\n\n  .settings-icon {\n    position: absolute;\n    top: -3px;\n    left: -20px;\n    display: inline-block;\n    cursor: pointer;\n    opacity: 0.3;\n\n    svg {\n      fill: $border-color;\n    }\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n\n  .edge-top,\n  .edge-right,\n  .edge-left,\n  .edge-bottom {\n    position: absolute;\n    z-index: 10;\n  }\n\n  .edge-top {\n    top: -2px;\n    left: 0;\n    right: 0;\n    height: 5px;\n  }\n\n  .edge-right {\n    top: 0;\n    bottom: 0;\n    right: -2px;\n    width: 5px;\n  }\n\n  .edge-left {\n    top: 0;\n    left: -2px;\n    bottom: 0;\n    width: 5px;\n  }\n\n  .edge-bottom {\n    bottom: -2px;\n    left: 0;\n    right: 0;\n    height: 5px;\n  }\n}\n\n@keyframes verdocs-field-pulse {\n  0% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n  50% {\n    background-color: rgba(0, 0, 0, 0);\n  }\n  100% {\n    background-color: rgba(0, 0, 0, 0.35);\n  }\n}\n","import {ITemplateField, getRGBA, IEnvelopeField, VerdocsEndpoint, updateField, ITemplate} from '@verdocs/js-sdk';\nimport {Component, Event, EventEmitter, h, Host, Method, Prop, Fragment, State, Element} from '@stencil/core';\nimport {SettingsIcon} from '../../../utils/Icons';\nimport {Store} from '../../../utils/Datastore';\nimport interact from 'interactjs';\nimport {ResizeEvent} from '@interactjs/actions/resize/plugin';\n\n/**\n * Displays an initial field. If an initial already exists, it will be displayed and the field\n * will be disabled. Otherwise, a placeholder button will be shown. Clicking the button will\n * show a dialog to adopt an initial.\n *\n * NOTE: When initial fields are completed they will be filled with an initial \"stamp\".\n * This requires operation against a live, valid envelope. If you are testing this component\n * in Storybook, it will not be visible here.\n */\n@Component({\n  tag: 'verdocs-field-initial',\n  styleUrl: 'verdocs-field-initial.scss',\n  shadow: false,\n})\nexport class VerdocsFieldInitial {\n  @Element() el: HTMLElement;\n\n  /**\n   * Fields may be attached to templates or envelopes, but only template fields may be edited.\n   */\n  @Prop({reflect: true}) source: 'template' | 'envelope' = 'template';\n\n  /**\n   * The source template or envelope ID the field is found in.\n   */\n  @Prop({reflect: true}) sourceid: string = '';\n\n  /**\n   * The name of the field to display.\n   */\n  @Prop({reflect: true}) fieldname: string = '';\n\n  /**\n   * Override the field's settings. This is intended to be used during signing when fields are being\n   * mutated.\n   */\n  @Prop() field: IEnvelopeField | null | undefined = null;\n\n  /**\n   * If set, overrides the field's settings object. Primarily used to support \"preview\" modes where all fields are disabled.\n   */\n  @Prop({reflect: true}) disabled?: boolean = false;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop({reflect: true}) initials: string = '';\n\n  /**\n   * If set, a settings icon will be displayed on hover. The settings shown allow the field's recipient and other settings to be\n   * changed, so it should typically only be enabled in the Builder.\n   */\n  @Prop({reflect: true}) editable?: boolean = false;\n\n  /**\n   * If set, the field may be dragged to a new location. This should only be enabled in the Builder, or for self-placed fields.\n   */\n  @Prop({reflect: true}) moveable?: boolean = false;\n\n  /**\n   * If set, the field is considered \"done\" and is drawn in a display-final-value state.\n   */\n  @Prop({reflect: true}) done?: boolean = false;\n\n  /**\n   * If set, the field will be be scaled horizontally by this factor.\n   */\n  @Prop({reflect: true}) xscale?: number = 1;\n\n  /**\n   * If set, the field will be be scaled vertically by this factor.\n   */\n  @Prop({reflect: true}) yscale?: number = 1;\n\n  /**\n   * The page the field is on\n   */\n  @Prop({reflect: true}) pagenumber?: number = 1;\n\n  /**\n   * Event emitted when an initial block is adopted by the user. The event detail will contain the base64 string of the initial image.\n   */\n  @Event({composed: true}) adopt: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name.\n   */\n  @Event({composed: true}) exit: EventEmitter;\n\n  /**\n   * Event fired when the input field value changes. Note that this will only be fired on blur, tab-out, ENTER key press, etc.\n   * It is generally the best event to subscribe to than `input` for most cases EXCEPT autocomplete fields that need to see every\n   * keypress.\n   */\n  @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n  /**\n   * Event fired when the field's settings are changed.\n   */\n  @Event({composed: true}) settingsChanged: EventEmitter<{fieldName: string; field: ITemplateField}>;\n\n  /**\n   * Event fired on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) settingsPress: EventEmitter;\n\n  /**\n   * Event fired when the field is deleted.\n   */\n  @Event({composed: true}) deleted: EventEmitter<{fieldName: string}>;\n\n  @State() showingProperties?: boolean = false;\n  @State() focused?: boolean = false;\n\n  @Method() async focusField() {\n    this.handleShow();\n  }\n\n  @State()\n  tempInitials: string = '';\n\n  private dialog?: any;\n\n  componentDidRender() {\n    interact.dynamicDrop(true);\n\n    if (this.editable) {\n      interact(this.el).resizable({\n        edges: {\n          top: '.edge-top',\n          left: '.edge-left',\n          bottom: '.edge-bottom',\n          right: '.edge-right',\n        },\n        modifiers: [\n          interact.modifiers.restrictSize({\n            min: {width: 71, height: 36},\n          }),\n        ],\n        listeners: {\n          start: this.handleResizeStart.bind(this),\n          move: this.handleResize.bind(this),\n          end: this.handleResizeEnd.bind(this),\n        },\n      });\n    }\n  }\n\n  handleResizeStart(e: ResizeEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n    e.target.dataset.originalBottom = e.target.style.bottom;\n  }\n\n  handleResize(e: any) {\n    let {width, height} = e.rect;\n\n    const dX = e.deltaRect.left;\n    const dY = e.deltaRect.bottom;\n    const currentLeft = parseFloat(e.target.style.left);\n    const currentBottom = parseFloat(e.target.style.bottom);\n\n    width /= this.xscale;\n    height /= this.yscale;\n\n    Object.assign(e.target.style, {\n      width: `${width}px`,\n      height: `${height}px`,\n      left: `${currentLeft + dX}px`,\n      bottom: `${currentBottom - dY}px`,\n    });\n  }\n\n  async handleResizeEnd(e: any) {\n    const {sourceid, fieldname} = this;\n\n    const width = Math.round(parseFloat(e.target.style.width));\n    let height = Math.round(parseFloat(e.target.style.height));\n    if (height < 20) {\n      height = 15;\n    }\n\n    const newBottom = parseFloat(e.target.style.bottom);\n    const originalBottom = parseFloat(e.target.dataset.originalBottom);\n    const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n    const oldField = template.fields.find(f => f.name === fieldname);\n    const y = newBottom !== originalBottom ? newBottom / this.yscale : oldField?.y;\n\n    updateField(VerdocsEndpoint.getDefault(), sourceid, fieldname, {width, height, y})\n      .then(async updatedField => {\n        const template = await Store.getTemplate(VerdocsEndpoint.getDefault(), this.sourceid);\n        const newTemplate = JSON.parse(JSON.stringify(template)) as ITemplate;\n        const fieldIndex = newTemplate.fields.findIndex(field => field.name === fieldname);\n        if (fieldIndex > -1) {\n          newTemplate.fields[fieldIndex] = updatedField;\n        }\n        Store.updateTemplate(this.sourceid, newTemplate);\n\n        this.settingsChanged?.emit({fieldName: fieldname, field: updatedField});\n        Object.assign(e.target.dataset, {x: 0, y: 0, h: 0});\n      })\n      .catch(e => console.log('Field update failed', e));\n  }\n\n  hideDialog() {\n    this.dialog?.remove();\n    this.dialog = null;\n    this.focused = false;\n  }\n\n  handleAdopt(e: any) {\n    console.log('[INITIAL] Adopted initials');\n    this.tempInitials = e.detail;\n    this.fieldChange?.emit(this.tempInitials);\n    this.hideDialog();\n  }\n\n  handleShow() {\n    this.dialog = document.createElement('verdocs-initial-dialog');\n    this.dialog.setAttribute('initials', this.initials);\n    // this.dialog.setAttribute('roleindex', this.roleindex);\n    this.dialog.addEventListener('exit', () => this.hideDialog());\n    this.dialog.addEventListener('next', (e: any) => this.handleAdopt(e));\n    document.body.append(this.dialog);\n    this.focused = true;\n  }\n\n  @Method()\n  async showSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.showPanel) {\n      settingsPanel.showPanel();\n    }\n  }\n\n  @Method()\n  async hideSettingsPanel() {\n    const settingsPanel = document.getElementById(`verdocs-settings-panel-${this.fieldname}`) as any;\n    if (settingsPanel && settingsPanel.hidePanel) {\n      settingsPanel.hidePanel();\n    }\n  }\n\n  render() {\n    const {source, sourceid, fieldname, editable = false, done = false, disabled = false, focused, xscale = 1, yscale = 1} = this;\n\n    const {index, field} = Store.getField(source, sourceid, fieldname, this.field);\n    const {required = false, value = '', label = '', settings = {}} = field || {};\n    const backgroundColor = getRGBA(index);\n    const {base64} = settings;\n\n    if (done) {\n      return <Host class={{done}}>{value && <img src={value} alt=\"Initial\" />}</Host>;\n    }\n\n    return (\n      <Host class={{required, disabled, done, focused}} style={{backgroundColor}}>\n        {editable && <div class=\"edge-right\" />}\n        {editable && <div class=\"edge-left\" />}\n        {editable && <div class=\"edge-top\" />}\n        {editable && <div class=\"edge-bottom\" />}\n\n        {label && <label>{label}</label>}\n\n        {base64 ? <img src={base64} alt=\"Initial\" /> : <button onClick={() => !disabled && this.handleShow()}>Initial</button>}\n\n        {editable && (\n          <Fragment>\n            <div\n              id={`verdocs-settings-panel-trigger-${fieldname}`}\n              style={{transform: `scale(${Math.floor((1 / xscale) * 1000) / 1000}, ${Math.floor((1 / yscale) * 1000) / 1000})`}}\n              class=\"settings-icon\"\n              innerHTML={SettingsIcon}\n              onClick={(e: any) => {\n                e.stopPropagation();\n                this.showingProperties = !this.showingProperties;\n              }}\n            />\n\n            {this.showingProperties && (\n              <verdocs-portal anchor={`verdocs-settings-panel-trigger-${fieldname}`} onClickAway={() => (this.showingProperties = false)}>\n                <verdocs-template-field-properties\n                  templateId={sourceid}\n                  fieldName={fieldname}\n                  onClose={() => (this.showingProperties = false)}\n                  onDelete={() => {\n                    this.deleted?.emit({fieldName: field.name});\n                    return this.hideSettingsPanel();\n                  }}\n                  onSettingsChanged={e => {\n                    this.settingsChanged?.emit(e.detail);\n                    return this.hideSettingsPanel();\n                  }}\n                  helpText={\"initial fields capture the recipient's initials on a clause or page.\"}\n                />\n              </verdocs-portal>\n            )}\n          </Fragment>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-C2HrF4Tc.js → p-wBFmVUNi.js}

@@ -1,13 +1,13 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-BuCJI6fl.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-Clw7inRP.js';
 import { VerdocsEndpoint, getEnvelope, getEnvelopesZip, getEnvelopeDocumentDownloadLink, cancelEnvelope, userCanCancelEnvelope, integerSequence } from '@verdocs/js-sdk';
 import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$6 } from './p-qPO42SgN.js';
-import { d as defineCustomElement$5 } from './p-D2tuZy4-.js';
-import { d as defineCustomElement$4 } from './p-DuzP9nP2.js';
-import { d as defineCustomElement$3 } from './p-VxVNy_Vd.js';
-import { d as defineCustomElement$2 } from './p-C2aep_b9.js';
-import { d as defineCustomElement$1 } from './p-BDofff4X.js';
+import { d as defineCustomElement$6 } from './p-B5eQd9Mt.js';
+import { d as defineCustomElement$5 } from './p-CRwSFWzI.js';
+import { d as defineCustomElement$4 } from './p-Driek-y5.js';
+import { d as defineCustomElement$3 } from './p-DnaGcy-V.js';
+import { d as defineCustomElement$2 } from './p-CQCFJea3.js';
+import { d as defineCustomElement$1 } from './p-ChYa_oDl.js';
 
 const verdocsViewCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-view{display:-ms-flexbox;display:flex;overflow:hidden;min-height:600px;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-view div,verdocs-view canvas{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-view .document{-ms-flex:1;flex:1;width:100%;height:100%;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;min-height:200px;max-width:1200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-view .document .inner{width:100%;max-width:1028px}verdocs-view .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}#verdocs-view-header{width:100%;color:#fff;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 56px;flex:0 0 56px;padding:0 20px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}@media all and (max-width: 500px){#verdocs-view-header{padding:0 10px}}#verdocs-view-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 20px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}@media all and (max-width: 500px){#verdocs-view-header .inner{padding:0 10px}}#verdocs-view-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-view-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}";
 
@@ -276,6 +276,6 @@ function defineCustomElement() {
 }
 
 export { VerdocsView as V, defineCustomElement as d };
-//# sourceMappingURL=p-C2HrF4Tc.js.map
+//# sourceMappingURL=p-wBFmVUNi.js.map
 
-//# sourceMappingURL=p-C2HrF4Tc.js.map
+//# sourceMappingURL=p-wBFmVUNi.js.map

package/dist/components/{p-C2HrF4Tc.js.map → p-wBFmVUNi.js.map}

@@ -1 +1 @@
-{"file":"p-C2HrF4Tc.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-view/verdocs-view.scss?tag=verdocs-view","src/components/embeds/verdocs-view/verdocs-view.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-view {\n  display: flex;\n  overflow: hidden;\n  min-height: 600px;\n  position: relative;\n  align-items: center;\n  flex-direction: column;\n  box-sizing: border-box;\n  font-family: $verdocs-primary-font;\n\n  div,\n  canvas {\n    box-sizing: border-box;\n  }\n\n  .document {\n    flex: 1;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    padding: 15px;\n    row-gap: 15px;\n    min-height: 200px;\n    max-width: 1200px;\n    position: relative;\n    overflow-y: scroll;\n    align-items: center;\n    box-sizing: border-box;\n    flex-direction: column;\n    //justify-content: center;\n\n    .inner {\n      width: 100%;\n      max-width: 1028px;\n    }\n  }\n\n  .loading-indicator {\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    z-index: 10000;\n    position: fixed;\n    background-color: rgba(0, 0, 0, 0.7);\n  }\n}\n\n// Styled separately because the header is often re-parented\n#verdocs-view-header {\n  width: 100%;\n  color: #fff;\n  display: flex;\n  z-index: 1000;\n  flex: 0 0 56px;\n  padding: 0 20px;\n  font-size: 12px;\n  column-gap: 15px;\n  align-items: center;\n  flex-direction: row;\n  transition: all 0.25s;\n  background-color: $medium-bg;\n  box-shadow:\n    0 4px 4px 0 rgb(0 0 0 / 24%),\n    0 0 4px 0 rgb(0 0 0 / 12%);\n\n  @media all and (max-width: 500px) {\n    padding: 0 10px;\n  }\n\n  .inner {\n    width: 100%;\n    display: flex;\n    margin: 0 auto;\n    padding: 0 20px;\n    max-width: 1200px;\n    align-items: center;\n    flex-direction: row;\n\n    @media all and (max-width: 500px) {\n      padding: 0 10px;\n    }\n  }\n\n  .logo {\n    width: 80px;\n    display: none;\n    margin: -6px 0 0 0;\n  }\n\n  .title {\n    font-size: 18px;\n    font-weight: 500;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n}\n","import {cancelEnvelope, getEnvelopeDocumentDownloadLink, getEnvelope, IEnvelope, integerSequence, userCanCancelEnvelope, VerdocsEndpoint, getEnvelopesZip} from '@verdocs/js-sdk';\nimport {Component, h, Element, Event, Host, Prop, EventEmitter, Fragment, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Render the documents attached to an envelope in read-only (view) mode. All documents are\n * displayed in order.\n *\n * ```ts\n * <verdocs-view\n *   envelopeId={ENVELOPE_ID}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-view',\n  styleUrl: 'verdocs-view.scss',\n  shadow: false,\n})\nexport class VerdocsView {\n  private envelopeListenerId = null;\n\n  @Element() component: HTMLElement;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint | null = null;\n\n  /**\n   * The envelope ID to render. Set ONE OF templateId or envelopeId. If both are set, envelopeId will be ignored.\n   */\n  @Prop() envelopeId: string = '';\n\n  /**\n   * If set, (recommended), the host application should create a <DIV> element with a unique ID. When this\n   * component renders, the header will be removed from its default location and placed in the target element.\n   * This allows the parent application to more easily control its placement and scroll effects (e.g. \"fixed\").\n   *\n   * The movement of the header to the target container is not dynamic - it is performed only on the initial\n   * render. Host applications should not conditionally render this container. If the header's visibility must\n   * be externally controlled, use CSS display options to hide/show it instead.\n   */\n  @Prop() headerTargetId: string | null = null;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the envelope is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) envelopeUpdated: EventEmitter<{endpoint: VerdocsEndpoint; envelope: IEnvelope; event: string}>;\n\n  /**\n   * Event fired when the user clicks Send Another to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) another: EventEmitter;\n\n  /**\n   * Event fired when the user clicks Send Another to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) view: EventEmitter;\n\n  /**\n   * Event fired when the user clicks Done to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) next: EventEmitter;\n  @State() canceling = false;\n  @State() showCancelDone = false;\n  @State() showLoadError = false;\n\n  @State() loading = true;\n  @State() envelope: IEnvelope | null = null;\n\n  async componentWillLoad() {\n    if (!this.endpoint) {\n      this.endpoint = VerdocsEndpoint.getDefault();\n      this.endpoint.loadSession();\n    }\n\n    if (!this.envelopeId) {\n      console.error(`[VIEW] Missing required envelopeId`);\n      return;\n    }\n\n    this.listenToEnvelope();\n    if (!this.envelope) {\n      try {\n        console.log('[VIEW] Loading envelope...');\n        this.envelope = await getEnvelope(this.endpoint, this.envelopeId);\n        console.log('[VIEW] Loaded envelope', this.envelope);\n      } catch (e) {\n        this.showLoadError = true;\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    }\n  }\n\n  componentDidRender() {\n    const headerTarget = this.headerTargetId ? document.getElementById(this.headerTargetId) : null;\n    const headerEl = document.getElementById('verdocs-view-header');\n    if (headerTarget && headerEl) {\n      console.log('[VIEW] Moving header');\n      headerEl.remove();\n      headerTarget.append(headerEl);\n    }\n  }\n\n  disconnectedCallback() {\n    this.unlistenToEnvelope();\n  }\n\n  async listenToEnvelope() {\n    console.log('[SIDEBAR] Loading envelope', this.envelopeId);\n    this.unlistenToEnvelope();\n    Store.subscribe(\n      'envelopes',\n      this.envelopeId,\n      () => getEnvelope(this.endpoint, this.envelopeId),\n      true,\n      (envelope: IEnvelope) => {\n        this.envelope = envelope;\n        this.loading = false;\n      },\n    );\n  }\n\n  unlistenToEnvelope() {\n    if (this.envelopeListenerId) {\n      Store.store.delListener(this.envelopeListenerId);\n      this.envelopeListenerId = null;\n    }\n  }\n\n  handlePageRendered(_e: any) {\n    // const pageInfo = e.detail as IDocumentPageInfo;\n    // console.log('[VIEW] Page rendered', pageInfo);\n  }\n\n  async handleOptionSelected(e: any) {\n    switch (e.detail.id) {\n      case 'cancel':\n        // TODO: Better option for inline-flow confirmation and alert dialogs.\n        if (confirm('Are you sure you wish to cancel this envelope? This action cannot be undone.')) {\n          this.canceling = true;\n          cancelEnvelope(this.endpoint, this.envelopeId)\n            .then(r => {\n              this.canceling = false;\n              console.log('[VIEW] Envelope canceled', r);\n              return getEnvelope(this.endpoint, this.envelopeId);\n            })\n            .then(env => {\n              console.log('[VIEW] Loaded new envelope details', env);\n              this.envelope = env;\n            })\n            .catch(e => {\n              this.canceling = false;\n              console.log('[VIEW] Error canceling envelope', e);\n              this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n            });\n          this.showCancelDone = true;\n          this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'canceled'});\n        }\n        break;\n\n      case 'print':\n        window.print();\n        this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'printed'});\n        break;\n\n      case 'download-attachments':\n        // TODO: Multiple document support\n        {\n          const firstDoc = this.envelope.documents.find(doc => doc.type === 'attachment');\n          if (firstDoc) {\n            const url = await getEnvelopeDocumentDownloadLink(this.endpoint, firstDoc.id);\n            window.open(url, '_blank');\n          }\n        }\n        break;\n\n      case 'download-certificate':\n        // TODO: Multiple certificate support\n        {\n          const firstCert = this.envelope.documents.find(doc => doc.type === 'certificate');\n          if (firstCert) {\n            const url = await getEnvelopeDocumentDownloadLink(this.endpoint, firstCert.id);\n            window.open(url, '_blank');\n          }\n        }\n        // saveCertificate(this.endpoint, this.envelope, this.envelope.certificate_document_id)\n        //   .then(() => {\n        //     this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'downloaded'});\n        //   })\n        //   .catch(e => {\n        //     console.log('Error downloading PDF', e);\n        //   });\n        break;\n\n      case 'download-all':\n        getEnvelopesZip(this.endpoint, [this.envelope.id])\n          .then(() => {\n            this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'downloaded'});\n          })\n          .catch(e => {\n            console.log('Error downloading Zip', e);\n          });\n        break;\n    }\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host>\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    if (this.showLoadError) {\n      return (\n        <Host>\n          <verdocs-ok-dialog\n            heading=\"Unable to View Envelope\"\n            message={`Sorry, that envelope is not valid.`}\n            buttonLabel=\"OK\"\n            onNext={() => {\n              this.showLoadError = false;\n            }}\n          />\n        </Host>\n      );\n    }\n\n    if (!this.envelope) {\n      return (\n        <Host>\n          <img\n            src=\"https://public-assets.verdocs.com/loading-placeholder.png\"\n            style={{width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px'}}\n            alt=\"Placeholder page\"\n          />\n        </Host>\n      );\n    }\n\n    const menuOptions: any[] = [{id: 'print', label: 'Print'}];\n\n    if (userCanCancelEnvelope(this.endpoint.profile, this.envelope)) {\n      menuOptions.push({id: 'cancel', label: 'Cancel'});\n    }\n\n    // Add download options to the menu\n    const hasAttachments = this.envelope.documents.length > 0;\n    const normalDocCount = this.envelope.documents.filter(doc => doc.type === 'attachment').length;\n    const hasCertificate = this.envelope.documents.find(doc => doc.type === 'certificate') !== undefined;\n    if (hasAttachments || hasCertificate) {\n      menuOptions.push({label: ''});\n      if (hasAttachments) {\n        menuOptions.push({id: 'download-attachments', label: normalDocCount > 1 ? 'Download Documents' : 'Download Document'});\n      }\n      if (hasCertificate) {\n        menuOptions.push({id: 'download-certificate', label: 'Download Certificate'});\n      }\n      if (hasAttachments && hasCertificate) {\n        menuOptions.push({id: 'download-all', label: 'Download All Files'});\n      }\n    }\n\n    return (\n      <Host>\n        <div id=\"verdocs-view-header\">\n          <div class=\"inner\">\n            <img src=\"https://verdocs.com/assets/white-logo.svg\" alt=\"Verdocs Logo\" class=\"logo\" />\n            <div class=\"title\">{this.envelope.name}</div>\n            <div style={{flex: '1'}} />\n            <div style={{marginLeft: '10px'}} />\n            <verdocs-dropdown options={menuOptions} onOptionSelected={e => this.handleOptionSelected(e)} />\n          </div>\n        </div>\n\n        <div class=\"document\" style={{paddingTop: this.headerTargetId ? '70px' : '15px'}}>\n          {(this.envelope?.documents || [])\n            .filter(document => document.type !== 'certificate')\n            .map(envelopeDocument => {\n              const pageNumbers = integerSequence(1, envelopeDocument.pages);\n\n              return (\n                <Fragment>\n                  {pageNumbers.map(pageNumber => {\n                    const pageSize = envelopeDocument.page_sizes?.[pageNumber] || {width: 612, height: 792};\n\n                    return (\n                      <verdocs-envelope-document-page\n                        envelopeId={this.envelopeId}\n                        documentId={envelopeDocument.id}\n                        endpoint={this.endpoint}\n                        type=\"filled\"\n                        virtualWidth={pageSize.width}\n                        virtualHeight={pageSize.height}\n                        pageNumber={pageNumber}\n                        onPageRendered={e => this.handlePageRendered(e)}\n                        layers={[\n                          {name: 'page', type: 'canvas'},\n                          {name: 'controls', type: 'div'},\n                        ]}\n                      />\n                    );\n                  })}\n                </Fragment>\n              );\n            })}\n        </div>\n        {this.showCancelDone && (\n          <verdocs-ok-dialog\n            heading=\"Cancelled\"\n            message={`This envelope has been cancelled successfully.`}\n            onNext={() => {\n              this.showCancelDone = false;\n            }}\n          />\n        )}\n        {this.canceling && (\n          <div class=\"loading-indicator\">\n            <verdocs-loader />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-wBFmVUNi.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/embeds/verdocs-view/verdocs-view.scss?tag=verdocs-view","src/components/embeds/verdocs-view/verdocs-view.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-view {\n  display: flex;\n  overflow: hidden;\n  min-height: 600px;\n  position: relative;\n  align-items: center;\n  flex-direction: column;\n  box-sizing: border-box;\n  font-family: $verdocs-primary-font;\n\n  div,\n  canvas {\n    box-sizing: border-box;\n  }\n\n  .document {\n    flex: 1;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    padding: 15px;\n    row-gap: 15px;\n    min-height: 200px;\n    max-width: 1200px;\n    position: relative;\n    overflow-y: scroll;\n    align-items: center;\n    box-sizing: border-box;\n    flex-direction: column;\n    //justify-content: center;\n\n    .inner {\n      width: 100%;\n      max-width: 1028px;\n    }\n  }\n\n  .loading-indicator {\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    z-index: 10000;\n    position: fixed;\n    background-color: rgba(0, 0, 0, 0.7);\n  }\n}\n\n// Styled separately because the header is often re-parented\n#verdocs-view-header {\n  width: 100%;\n  color: #fff;\n  display: flex;\n  z-index: 1000;\n  flex: 0 0 56px;\n  padding: 0 20px;\n  font-size: 12px;\n  column-gap: 15px;\n  align-items: center;\n  flex-direction: row;\n  transition: all 0.25s;\n  background-color: $medium-bg;\n  box-shadow:\n    0 4px 4px 0 rgb(0 0 0 / 24%),\n    0 0 4px 0 rgb(0 0 0 / 12%);\n\n  @media all and (max-width: 500px) {\n    padding: 0 10px;\n  }\n\n  .inner {\n    width: 100%;\n    display: flex;\n    margin: 0 auto;\n    padding: 0 20px;\n    max-width: 1200px;\n    align-items: center;\n    flex-direction: row;\n\n    @media all and (max-width: 500px) {\n      padding: 0 10px;\n    }\n  }\n\n  .logo {\n    width: 80px;\n    display: none;\n    margin: -6px 0 0 0;\n  }\n\n  .title {\n    font-size: 18px;\n    font-weight: 500;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n}\n","import {cancelEnvelope, getEnvelopeDocumentDownloadLink, getEnvelope, IEnvelope, integerSequence, userCanCancelEnvelope, VerdocsEndpoint, getEnvelopesZip} from '@verdocs/js-sdk';\nimport {Component, h, Element, Event, Host, Prop, EventEmitter, Fragment, State} from '@stencil/core';\nimport {SDKError} from '../../../utils/errors';\nimport {Store} from '../../../utils/Datastore';\n\n/**\n * Render the documents attached to an envelope in read-only (view) mode. All documents are\n * displayed in order.\n *\n * ```ts\n * <verdocs-view\n *   envelopeId={ENVELOPE_ID}\n *   onSdkError={({ detail }) => { console.log('SDK error', detail) }\n *   />\n * ```\n */\n@Component({\n  tag: 'verdocs-view',\n  styleUrl: 'verdocs-view.scss',\n  shadow: false,\n})\nexport class VerdocsView {\n  private envelopeListenerId = null;\n\n  @Element() component: HTMLElement;\n\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint | null = null;\n\n  /**\n   * The envelope ID to render. Set ONE OF templateId or envelopeId. If both are set, envelopeId will be ignored.\n   */\n  @Prop() envelopeId: string = '';\n\n  /**\n   * If set, (recommended), the host application should create a <DIV> element with a unique ID. When this\n   * component renders, the header will be removed from its default location and placed in the target element.\n   * This allows the parent application to more easily control its placement and scroll effects (e.g. \"fixed\").\n   *\n   * The movement of the header to the target container is not dynamic - it is performed only on the initial\n   * render. Host applications should not conditionally render this container. If the header's visibility must\n   * be externally controlled, use CSS display options to hide/show it instead.\n   */\n  @Prop() headerTargetId: string | null = null;\n\n  /**\n   * Event fired if an error occurs. The event details will contain information about the error. Most errors will\n   * terminate the process, and the calling application should correct the condition and re-render the component.\n   */\n  @Event({composed: true}) sdkError: EventEmitter<SDKError>;\n\n  /**\n   * Event fired when the envelope is updated in any way. May be used for tasks such as cache invalidation or reporting to other systems.\n   */\n  @Event({composed: true}) envelopeUpdated: EventEmitter<{endpoint: VerdocsEndpoint; envelope: IEnvelope; event: string}>;\n\n  /**\n   * Event fired when the user clicks Send Another to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) another: EventEmitter;\n\n  /**\n   * Event fired when the user clicks Send Another to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) view: EventEmitter;\n\n  /**\n   * Event fired when the user clicks Done to proceed. It is up to the host application\n   * to redirect the user to the appropriate next workflow step.\n   */\n  @Event({composed: true}) next: EventEmitter;\n  @State() canceling = false;\n  @State() showCancelDone = false;\n  @State() showLoadError = false;\n\n  @State() loading = true;\n  @State() envelope: IEnvelope | null = null;\n\n  async componentWillLoad() {\n    if (!this.endpoint) {\n      this.endpoint = VerdocsEndpoint.getDefault();\n      this.endpoint.loadSession();\n    }\n\n    if (!this.envelopeId) {\n      console.error(`[VIEW] Missing required envelopeId`);\n      return;\n    }\n\n    this.listenToEnvelope();\n    if (!this.envelope) {\n      try {\n        console.log('[VIEW] Loading envelope...');\n        this.envelope = await getEnvelope(this.endpoint, this.envelopeId);\n        console.log('[VIEW] Loaded envelope', this.envelope);\n      } catch (e) {\n        this.showLoadError = true;\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      }\n    }\n  }\n\n  componentDidRender() {\n    const headerTarget = this.headerTargetId ? document.getElementById(this.headerTargetId) : null;\n    const headerEl = document.getElementById('verdocs-view-header');\n    if (headerTarget && headerEl) {\n      console.log('[VIEW] Moving header');\n      headerEl.remove();\n      headerTarget.append(headerEl);\n    }\n  }\n\n  disconnectedCallback() {\n    this.unlistenToEnvelope();\n  }\n\n  async listenToEnvelope() {\n    console.log('[SIDEBAR] Loading envelope', this.envelopeId);\n    this.unlistenToEnvelope();\n    Store.subscribe(\n      'envelopes',\n      this.envelopeId,\n      () => getEnvelope(this.endpoint, this.envelopeId),\n      true,\n      (envelope: IEnvelope) => {\n        this.envelope = envelope;\n        this.loading = false;\n      },\n    );\n  }\n\n  unlistenToEnvelope() {\n    if (this.envelopeListenerId) {\n      Store.store.delListener(this.envelopeListenerId);\n      this.envelopeListenerId = null;\n    }\n  }\n\n  handlePageRendered(_e: any) {\n    // const pageInfo = e.detail as IDocumentPageInfo;\n    // console.log('[VIEW] Page rendered', pageInfo);\n  }\n\n  async handleOptionSelected(e: any) {\n    switch (e.detail.id) {\n      case 'cancel':\n        // TODO: Better option for inline-flow confirmation and alert dialogs.\n        if (confirm('Are you sure you wish to cancel this envelope? This action cannot be undone.')) {\n          this.canceling = true;\n          cancelEnvelope(this.endpoint, this.envelopeId)\n            .then(r => {\n              this.canceling = false;\n              console.log('[VIEW] Envelope canceled', r);\n              return getEnvelope(this.endpoint, this.envelopeId);\n            })\n            .then(env => {\n              console.log('[VIEW] Loaded new envelope details', env);\n              this.envelope = env;\n            })\n            .catch(e => {\n              this.canceling = false;\n              console.log('[VIEW] Error canceling envelope', e);\n              this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n            });\n          this.showCancelDone = true;\n          this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'canceled'});\n        }\n        break;\n\n      case 'print':\n        window.print();\n        this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'printed'});\n        break;\n\n      case 'download-attachments':\n        // TODO: Multiple document support\n        {\n          const firstDoc = this.envelope.documents.find(doc => doc.type === 'attachment');\n          if (firstDoc) {\n            const url = await getEnvelopeDocumentDownloadLink(this.endpoint, firstDoc.id);\n            window.open(url, '_blank');\n          }\n        }\n        break;\n\n      case 'download-certificate':\n        // TODO: Multiple certificate support\n        {\n          const firstCert = this.envelope.documents.find(doc => doc.type === 'certificate');\n          if (firstCert) {\n            const url = await getEnvelopeDocumentDownloadLink(this.endpoint, firstCert.id);\n            window.open(url, '_blank');\n          }\n        }\n        // saveCertificate(this.endpoint, this.envelope, this.envelope.certificate_document_id)\n        //   .then(() => {\n        //     this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'downloaded'});\n        //   })\n        //   .catch(e => {\n        //     console.log('Error downloading PDF', e);\n        //   });\n        break;\n\n      case 'download-all':\n        getEnvelopesZip(this.endpoint, [this.envelope.id])\n          .then(() => {\n            this.envelopeUpdated?.emit({endpoint: this.endpoint, envelope: this.envelope, event: 'downloaded'});\n          })\n          .catch(e => {\n            console.log('Error downloading Zip', e);\n          });\n        break;\n    }\n  }\n\n  render() {\n    if (this.loading) {\n      return (\n        <Host>\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    if (this.showLoadError) {\n      return (\n        <Host>\n          <verdocs-ok-dialog\n            heading=\"Unable to View Envelope\"\n            message={`Sorry, that envelope is not valid.`}\n            buttonLabel=\"OK\"\n            onNext={() => {\n              this.showLoadError = false;\n            }}\n          />\n        </Host>\n      );\n    }\n\n    if (!this.envelope) {\n      return (\n        <Host>\n          <img\n            src=\"https://public-assets.verdocs.com/loading-placeholder.png\"\n            style={{width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px'}}\n            alt=\"Placeholder page\"\n          />\n        </Host>\n      );\n    }\n\n    const menuOptions: any[] = [{id: 'print', label: 'Print'}];\n\n    if (userCanCancelEnvelope(this.endpoint.profile, this.envelope)) {\n      menuOptions.push({id: 'cancel', label: 'Cancel'});\n    }\n\n    // Add download options to the menu\n    const hasAttachments = this.envelope.documents.length > 0;\n    const normalDocCount = this.envelope.documents.filter(doc => doc.type === 'attachment').length;\n    const hasCertificate = this.envelope.documents.find(doc => doc.type === 'certificate') !== undefined;\n    if (hasAttachments || hasCertificate) {\n      menuOptions.push({label: ''});\n      if (hasAttachments) {\n        menuOptions.push({id: 'download-attachments', label: normalDocCount > 1 ? 'Download Documents' : 'Download Document'});\n      }\n      if (hasCertificate) {\n        menuOptions.push({id: 'download-certificate', label: 'Download Certificate'});\n      }\n      if (hasAttachments && hasCertificate) {\n        menuOptions.push({id: 'download-all', label: 'Download All Files'});\n      }\n    }\n\n    return (\n      <Host>\n        <div id=\"verdocs-view-header\">\n          <div class=\"inner\">\n            <img src=\"https://verdocs.com/assets/white-logo.svg\" alt=\"Verdocs Logo\" class=\"logo\" />\n            <div class=\"title\">{this.envelope.name}</div>\n            <div style={{flex: '1'}} />\n            <div style={{marginLeft: '10px'}} />\n            <verdocs-dropdown options={menuOptions} onOptionSelected={e => this.handleOptionSelected(e)} />\n          </div>\n        </div>\n\n        <div class=\"document\" style={{paddingTop: this.headerTargetId ? '70px' : '15px'}}>\n          {(this.envelope?.documents || [])\n            .filter(document => document.type !== 'certificate')\n            .map(envelopeDocument => {\n              const pageNumbers = integerSequence(1, envelopeDocument.pages);\n\n              return (\n                <Fragment>\n                  {pageNumbers.map(pageNumber => {\n                    const pageSize = envelopeDocument.page_sizes?.[pageNumber] || {width: 612, height: 792};\n\n                    return (\n                      <verdocs-envelope-document-page\n                        envelopeId={this.envelopeId}\n                        documentId={envelopeDocument.id}\n                        endpoint={this.endpoint}\n                        type=\"filled\"\n                        virtualWidth={pageSize.width}\n                        virtualHeight={pageSize.height}\n                        pageNumber={pageNumber}\n                        onPageRendered={e => this.handlePageRendered(e)}\n                        layers={[\n                          {name: 'page', type: 'canvas'},\n                          {name: 'controls', type: 'div'},\n                        ]}\n                      />\n                    );\n                  })}\n                </Fragment>\n              );\n            })}\n        </div>\n        {this.showCancelDone && (\n          <verdocs-ok-dialog\n            heading=\"Cancelled\"\n            message={`This envelope has been cancelled successfully.`}\n            onNext={() => {\n              this.showCancelDone = false;\n            }}\n          />\n        )}\n        {this.canceling && (\n          <div class=\"loading-indicator\">\n            <verdocs-loader />\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/verdocs-auth.js

@@ -1,10 +1,10 @@
-import { p as proxyCustomElement, H, c as createEvent, h } from './p-BuCJI6fl.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-Clw7inRP.js';
 import { VerdocsEndpoint, createProfile, verifyEmail, authenticate, getMyUser, resendVerification, resetPassword } from '@verdocs/js-sdk';
 import { V as VerdocsToast } from './p-CyvDgtoV.js';
 import { S as SDKError } from './p-C1sRVZWv.js';
-import { d as defineCustomElement$4 } from './p-D_VkX_nC.js';
-import { d as defineCustomElement$3 } from './p-DGYycCbd.js';
-import { d as defineCustomElement$2 } from './p-BlKUYiXH.js';
+import { d as defineCustomElement$4 } from './p-BEuU1xX4.js';
+import { d as defineCustomElement$3 } from './p-C-4fLUhc.js';
+import { d as defineCustomElement$2 } from './p-B9Ea7YKs.js';
 
 const verdocsAuthCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-auth{font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}verdocs-auth .form{width:320px;display:-ms-flexbox;display:flex;padding:20px;max-width:90%;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-pack:center;justify-content:center;background:#ffffff}verdocs-auth .logo{width:128px;max-width:100%;margin:20px 0 30px}verdocs-auth h3{color:#092c4c;text-align:center;font-weight:400;font-size:18px;line-height:1.75;margin:0}verdocs-auth em{font-size:14px;margin:15px 0}verdocs-auth .buttons{gap:20px;margin:20px 0 0 0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}verdocs-auth .status-result{display:none}verdocs-auth .status-result.debug{white-space:pre-wrap;font-size:14px;background:#fff;padding:10px;display:block;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}verdocs-auth form{width:100%}verdocs-auth verdocs-text-input{margin-bottom:10px}verdocs-auth .account-option{gap:8px;margin:20px 0 8px 0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}verdocs-auth p{color:#092c4c;margin:1em 0;font-size:14px}verdocs-auth p+p{margin-top:0}verdocs-auth verdocs-help-icon{margin-top:18px;display:-ms-flexbox;display:flex;width:32px;height:32px;-ms-flex:0 0 32px;flex:0 0 32px}verdocs-auth .already-have{color:#092c4c;margin:0.5em 0;font-size:14px}";
 

package/dist/components/verdocs-build.js

@@ -1,49 +1,49 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-BuCJI6fl.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-Clw7inRP.js';
 import { VerdocsEndpoint, getTemplate } from '@verdocs/js-sdk';
 import { S as SDKError } from './p-C1sRVZWv.js';
 import { S as Store } from './p-DmsV595e.js';
-import { d as defineCustomElement$H } from './p-D_VkX_nC.js';
-import { d as defineCustomElement$G } from './p-DTSi2jmL.js';
-import { d as defineCustomElement$F } from './p-ChnAjOXc.js';
-import { d as defineCustomElement$E } from './p-DPAlF5W0.js';
-import { d as defineCustomElement$D } from './p-BVn3xhxx.js';
-import { d as defineCustomElement$C } from './p-qPO42SgN.js';
-import { d as defineCustomElement$B } from './p-ve-pBNd-.js';
-import { d as defineCustomElement$A } from './p-D3SGhXmE.js';
-import { d as defineCustomElement$z } from './p-Hkdx4H9H.js';
-import { d as defineCustomElement$y } from './p-B9gpGeDG.js';
-import { d as defineCustomElement$x } from './p-dHBtO65i.js';
-import { d as defineCustomElement$w } from './p-CbxnHcQ3.js';
-import { d as defineCustomElement$v } from './p-EXpiIDZa.js';
-import { d as defineCustomElement$u } from './p-DwuiNrjE.js';
-import { d as defineCustomElement$t } from './p-PXUFg-8o.js';
-import { d as defineCustomElement$s } from './p-K-NdlPFS.js';
-import { d as defineCustomElement$r } from './p-DnOIbTGi.js';
-import { d as defineCustomElement$q } from './p-DGYycCbd.js';
-import { d as defineCustomElement$p } from './p-Bt-GZVHa.js';
-import { d as defineCustomElement$o } from './p-VxVNy_Vd.js';
-import { d as defineCustomElement$n } from './p-BdN73vyV.js';
-import { d as defineCustomElement$m } from './p-C2aep_b9.js';
-import { d as defineCustomElement$l } from './p-BDofff4X.js';
-import { d as defineCustomElement$k } from './p-BGrP_dY2.js';
-import { d as defineCustomElement$j } from './p-CDAcaz4P.js';
-import { d as defineCustomElement$i } from './p-Bv5CFhqy.js';
-import { d as defineCustomElement$h } from './p-BA36wKSy.js';
-import { d as defineCustomElement$g } from './p-C7wadjXX.js';
-import { d as defineCustomElement$f } from './p-BwYUpVnP.js';
-import { d as defineCustomElement$e } from './p-CPTiPp39.js';
-import { d as defineCustomElement$d } from './p-DsixyEYT.js';
-import { d as defineCustomElement$c } from './p-Bi-CeVWz.js';
-import { d as defineCustomElement$b } from './p-Cg4UNrkK.js';
-import { d as defineCustomElement$a } from './p-DZhluhmn.js';
-import { d as defineCustomElement$9 } from './p-BNTIQRGG.js';
-import { d as defineCustomElement$8 } from './p-pYesdYiR.js';
-import { d as defineCustomElement$7 } from './p-DMu9DQ9X.js';
-import { d as defineCustomElement$6 } from './p-BSdKow-j.js';
-import { d as defineCustomElement$5 } from './p-CKMliVhp.js';
-import { d as defineCustomElement$4 } from './p-BlKUYiXH.js';
-import { d as defineCustomElement$3 } from './p-DsOkI92K.js';
-import { d as defineCustomElement$2 } from './p-BNlfak-i.js';
+import { d as defineCustomElement$H } from './p-BEuU1xX4.js';
+import { d as defineCustomElement$G } from './p-BuubyFAZ.js';
+import { d as defineCustomElement$F } from './p-BTA1be7y.js';
+import { d as defineCustomElement$E } from './p-8YJmijSd.js';
+import { d as defineCustomElement$D } from './p-DqU6EOrq.js';
+import { d as defineCustomElement$C } from './p-B5eQd9Mt.js';
+import { d as defineCustomElement$B } from './p-BRPzK8Xw.js';
+import { d as defineCustomElement$A } from './p-BaE2j0VJ.js';
+import { d as defineCustomElement$z } from './p-CI5cVahE.js';
+import { d as defineCustomElement$y } from './p-H5nk-La8.js';
+import { d as defineCustomElement$x } from './p-ZnrDtTZt.js';
+import { d as defineCustomElement$w } from './p-DlAdADTD.js';
+import { d as defineCustomElement$v } from './p-CXSpP5Gm.js';
+import { d as defineCustomElement$u } from './p-D3et9AL5.js';
+import { d as defineCustomElement$t } from './p-DpEBcKDj.js';
+import { d as defineCustomElement$s } from './p-Bsj4gHYP.js';
+import { d as defineCustomElement$r } from './p-B7mqZJ5f.js';
+import { d as defineCustomElement$q } from './p-C-4fLUhc.js';
+import { d as defineCustomElement$p } from './p-WzOFvlsv.js';
+import { d as defineCustomElement$o } from './p-DnaGcy-V.js';
+import { d as defineCustomElement$n } from './p-CO6oIgzX.js';
+import { d as defineCustomElement$m } from './p-CQCFJea3.js';
+import { d as defineCustomElement$l } from './p-ChYa_oDl.js';
+import { d as defineCustomElement$k } from './p-CKVx4yr2.js';
+import { d as defineCustomElement$j } from './p-CQobV491.js';
+import { d as defineCustomElement$i } from './p-Clx6y9zn.js';
+import { d as defineCustomElement$h } from './p-BdJ3dzrK.js';
+import { d as defineCustomElement$g } from './p-D5p6S1bi.js';
+import { d as defineCustomElement$f } from './p-C4FQgN27.js';
+import { d as defineCustomElement$e } from './p-BLj6y0dz.js';
+import { d as defineCustomElement$d } from './p-KBnlWGyn.js';
+import { d as defineCustomElement$c } from './p-DvtzYG5e.js';
+import { d as defineCustomElement$b } from './p-Bbme0kV0.js';
+import { d as defineCustomElement$a } from './p-BUjb-w39.js';
+import { d as defineCustomElement$9 } from './p-18h9UMkx.js';
+import { d as defineCustomElement$8 } from './p-CslSVc-D.js';
+import { d as defineCustomElement$7 } from './p-DIPvUaAv.js';
+import { d as defineCustomElement$6 } from './p-DLmnuCRM.js';
+import { d as defineCustomElement$5 } from './p-B9v-iqos.js';
+import { d as defineCustomElement$4 } from './p-B9Ea7YKs.js';
+import { d as defineCustomElement$3 } from './p-B7K8lTsJ.js';
+import { d as defineCustomElement$2 } from './p-DcWPdEq3.js';
 
 const verdocsBuildCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-build{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-build .content{-ms-flex:1;flex:1;gap:20px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column}verdocs-build verdocs-template-attachments,verdocs-build verdocs-template-roles{margin:20px}verdocs-build verdocs-template-fields{border-top:1px solid #777777}verdocs-build verdocs-template-attachments{padding:20px;background:#ffffff}verdocs-build verdocs-template-fields{width:100%}verdocs-build verdocs-preview{-ms-flex:1;flex:1}verdocs-build .preview-container{-ms-flex-direction:row;flex-direction:row;display:-ms-flexbox;display:flex;width:100%;background-color:#eeeeee;max-height:100%}@media all and (max-width: 450px){verdocs-build .preview-container{-ms-flex-direction:column;flex-direction:column}}verdocs-build .preview-send-wrapper{display:-ms-flexbox;display:flex;-ms-flex:0 0 300px;flex:0 0 300px;background-color:#ffffff;-webkit-box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157);box-shadow:1px 1px 6px -2px rgba(0, 0, 0, 0.4980392157)}@media all and (max-width: 450px){verdocs-build .preview-send-wrapper{-ms-flex:0;flex:0}}verdocs-build .preview-preview-wrapper{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:center;justify-content:center;overflow-y:scroll}";
 

package/dist/components/verdocs-button-panel.js

@@ -1,4 +1,4 @@
-import { V as VerdocsButtonPanel$1, d as defineCustomElement$1 } from './p-DTSi2jmL.js';
+import { V as VerdocsButtonPanel$1, d as defineCustomElement$1 } from './p-BuubyFAZ.js';
 
 const VerdocsButtonPanel = VerdocsButtonPanel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-button.js

@@ -1,4 +1,4 @@
-import { V as VerdocsButton$1, d as defineCustomElement$1 } from './p-D_VkX_nC.js';
+import { V as VerdocsButton$1, d as defineCustomElement$1 } from './p-BEuU1xX4.js';
 
 const VerdocsButton = VerdocsButton$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-checkbox.js

@@ -1,4 +1,4 @@
-import { V as VerdocsCheckbox$1, d as defineCustomElement$1 } from './p-ChnAjOXc.js';
+import { V as VerdocsCheckbox$1, d as defineCustomElement$1 } from './p-BTA1be7y.js';
 
 const VerdocsCheckbox = VerdocsCheckbox$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-component-error.js

@@ -1,4 +1,4 @@
-import { V as VerdocsComponentError$1, d as defineCustomElement$1 } from './p-DPAlF5W0.js';
+import { V as VerdocsComponentError$1, d as defineCustomElement$1 } from './p-8YJmijSd.js';
 
 const VerdocsComponentError = VerdocsComponentError$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-contact-picker.js

@@ -1,4 +1,4 @@
-import { V as VerdocsContactPicker$1, d as defineCustomElement$1 } from './p-BVn3xhxx.js';
+import { V as VerdocsContactPicker$1, d as defineCustomElement$1 } from './p-DqU6EOrq.js';
 
 const VerdocsContactPicker = VerdocsContactPicker$1;
 const defineCustomElement = defineCustomElement$1;