@verdocs/web-sdk 1.9.6 → 1.9.10

package/dist/verdocs-web-sdk/p-1cace026.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/elements/verdocs-document-page/verdocs-document-page.scss?tag=verdocs-document-page","src/components/elements/verdocs-document-page/verdocs-document-page.tsx","src/components/controls/verdocs-loader/verdocs-loader.scss?tag=verdocs-loader","src/components/controls/verdocs-loader/verdocs-loader.tsx","src/components/embeds/verdocs-view/verdocs-view.scss?tag=verdocs-view","src/components/embeds/verdocs-view/verdocs-view.tsx"],"names":["verdocsDocumentPageCss","VerdocsDocumentPage","exports","name","type","concat","Math","random","toString","substring","class_1","prototype","componentDidLoad","_this","this","resizeObserver","ResizeObserver","entries","_i","entries_1","length","entry","renderedWidth","contentRect","width","renderedHeight","virtualHeight","virtualWidth","notifyRenderedSize","observe","container","disconnectedCallback","_a","disconnect","skipFirstNotification","pageRendered","emit","containerId","pageNumber","xScale","yScale","render","height","h","Host","id","style","layers","map","layer","class","src","pageImageUri","alt","verdocsLoaderCss","VerdocsLoader","class_2","verdocsViewCss","VerdocsView","domPages","sourcePageMetrics","VerdocsEndpoint","getDefault","class_3","componentWillLoad","endpoint","loadSession","templateId","console","log","getTemplate","template","_g","sent","pageNumbers","integerSequence","pages","pageUris","_e","__asyncValues","page","_f","value","getPageImage","sequence","image","url","loadProgress","e_2","sdkError","SDKError","message","_b","response","status","_c","data","renderPage","domPage","pageMetrics","renderedPage","e","warn","handlePageRendered","stopPropagation","detail","_d","pageLayers","onPageRendered","p"],"mappings":"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","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-document-page {\n  width: 100%;\n  position: relative;\n\n  .verdocs-document-page-layer {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    //background: #fff;\n    box-shadow: 0 0 10px 5px #0000000f;\n\n    //&.background {\n    //  background: #fff;\n    //  box-shadow: 0 0 10px 5px #0000000f;\n    //}\n  }\n}\n","// NOTE: This component does not have a story because it's not intended for external use.\n\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Element} from '@stencil/core';\nimport {IDocumentPageInfo, IPageLayer} from '../../../utils/Types';\n\n/**\n * Represents one document page. This is primarily a layout container used to coordinate positions of\n * page-related layers such as the page itself, signature fields, etc.\n */\n@Component({\n  tag: 'verdocs-document-page',\n  styleUrl: 'verdocs-document-page.scss',\n  shadow: false,\n})\nexport class VerdocsDocumentPage {\n  @Element() container: HTMLElement;\n  private resizeObserver: ResizeObserver;\n\n  /**\n   * The URL of the image to render as the page background.\n   */\n  @Prop() pageImageUri: string = '';\n\n  /**\n   * The page number being rendered. Not used internally but included in callbacks/events beacuse page numbers\n   * are used everywhere in document handling.\n   */\n  @Prop() pageNumber: number = 1;\n\n  /**\n   * The \"virtual\" width of the page canvas. Defaults to 612 which at 72dpi is 8.5\" wide. This is used to compute\n   * the aspect ratio of the final rendered element.\n   */\n  @Prop() virtualWidth: number = 612;\n\n  /**\n   * The \"virtual\" height of the page canvas.  Defaults to 792 which at 72dpi is 11\" tall. This is used to compute\n   * the aspect ratio of the final rendered element.\n   */\n  @Prop() virtualHeight: number = 792;\n\n  /**\n   * The layers that will be rendered. The DOM structure will be a DIV container with one child DIV for each layer.\n   * The parent DIV will have a unique ID, and each child DIV will have that ID with the layer name appended, e.g.\n   * if `pages` was ['page', 'fields'] the structure will be:\n   *\n   * ```\n   *     <div id=\"verdocs-document-page-ker2fr1p9\">\n   *       <div id=\"verdocs-document-page-ker2fr1p9-page\"></div>\n   *       <div id=\"verdocs-document-page-ker2fr1p9-fields\"></div>\n   *     </div>\n   * ```\n   */\n  @Prop() layers: IPageLayer[] = [{name: 'page', type: 'canvas'}];\n\n  /**\n   * Fired when a page has been rendered. This is also fired when the page is resized.\n   */\n  @Event() pageRendered: EventEmitter<IDocumentPageInfo>;\n\n  @State() containerId = `verdocs-document-page-${Math.random().toString(36).substring(2, 11)}`;\n\n  @State() renderedWidth: number = 612;\n\n  @State() renderedHeight: number = 792;\n\n  @State() skipFirstNotification = true;\n\n  componentDidLoad(): void {\n    this.resizeObserver = new ResizeObserver(entries => {\n      for (const entry of entries) {\n        const renderedWidth = entry.contentRect.width;\n        this.renderedWidth = renderedWidth;\n        this.renderedHeight = this.virtualHeight * (renderedWidth / this.virtualWidth);\n      }\n\n      this.notifyRenderedSize();\n    });\n\n    this.resizeObserver.observe(this.container);\n  }\n\n  disconnectedCallback() {\n    this.resizeObserver?.disconnect();\n  }\n\n  // Left here for documentation purposes in case we find an edge case where this isn't true. But we apparently don't need this.\n  // When we add the resize observer it will always be triggered at least once so notifying here as well is just a dupe.\n  // componentDidRender() {\n  //   this.notifyRenderedSize();\n  // }\n\n  notifyRenderedSize() {\n    // We skip one notification because by default we will always get at least two, one when rendering the initial size\n    // and a second once we're able to compute the scale size, when the resizeObserver sets renderedWidth/renderedHeight.\n    if (this.skipFirstNotification) {\n      this.skipFirstNotification = false;\n      return;\n    }\n\n    this.pageRendered.emit({\n      container: this.container,\n      containerId: this.containerId,\n      pageNumber: this.pageNumber,\n      virtualWidth: this.virtualWidth,\n      virtualHeight: this.virtualHeight,\n      renderedWidth: this.renderedWidth,\n      renderedHeight: this.renderedHeight,\n      xScale: this.renderedWidth / this.virtualWidth,\n      yScale: this.renderedHeight / this.virtualHeight,\n    });\n  }\n\n  render() {\n    const height = this.renderedHeight + 'px';\n\n    return (\n      <Host id={`${this.containerId}`} style={{height}}>\n        {this.layers.map(layer =>\n          layer.type === 'div' ? (\n            <div class=\"verdocs-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}} />\n          ) : (\n            <img class=\"verdocs-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}} src={this.pageImageUri} alt={`Page ${this.pageNumber}`} />\n            // <canvas class=\"verdocs-document-page-layer\" id={`${this.containerId}-${layer.name}`} style={{height}} />\n          ),\n        )}\n      </Host>\n    );\n  }\n}\n","@import '../../../theme.scss';\n\nverdocs-loader {\n  display: block;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  margin-left: -20px;\n  margin-top: -20px;\n  font-size: 24px;\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  text-indent: -9999em;\n  -webkit-animation: load5 1.1s infinite ease;\n  animation: verdocs-loader-kf 1.1s infinite ease;\n  -webkit-transform: translateZ(0);\n  -ms-transform: translateZ(0);\n  transform: translateZ(0);\n}\n\n@keyframes verdocs-loader-kf {\n  0%,\n  100% {\n    box-shadow: 0em -2.6em 0em 0em $verdocs-bg-2, 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.3), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.4);\n  }\n  12.5% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.4), 1.8em -1.8em 0 0em $verdocs-bg-2, 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.3);\n  }\n  25% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.3), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.4), 2.5em 0em 0 0em $verdocs-bg-2, 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);\n  }\n  37.5% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.3), 2.5em 0em 0 0em rgba(0, 0, 0, 0.4), 1.75em 1.75em 0 0em $verdocs-bg-2,\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);\n  }\n  50% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.3), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.4),\n      0em 2.5em 0 0em $verdocs-bg-2, -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.2), -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);\n  }\n  62.5% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.3),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.4), -1.8em 1.8em 0 0em $verdocs-bg-2, -2.6em 0em 0 0em rgba(0, 0, 0, 0.2), -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);\n  }\n  75% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.3), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.4), -2.6em 0em 0 0em $verdocs-bg-2, -1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2);\n  }\n  87.5% {\n    box-shadow: 0em -2.6em 0em 0em rgba(0, 0, 0, 0.2), 1.8em -1.8em 0 0em rgba(0, 0, 0, 0.2), 2.5em 0em 0 0em rgba(0, 0, 0, 0.2), 1.75em 1.75em 0 0em rgba(0, 0, 0, 0.2),\n      0em 2.5em 0 0em rgba(0, 0, 0, 0.2), -1.8em 1.8em 0 0em rgba(0, 0, 0, 0.3), -2.6em 0em 0 0em rgba(0, 0, 0, 0.4), -1.8em -1.8em 0 0em $verdocs-bg-2;\n  }\n}\n","import {Component, h, Host} from '@stencil/core';\n\n/**\n * Animated loader placeholder. There are currently no configuration options for this control.\n */\n@Component({\n  tag: 'verdocs-loader',\n  styleUrl: 'verdocs-loader.scss',\n  shadow: false,\n})\nexport class VerdocsLoader {\n  render() {\n    return <Host />;\n  }\n}\n","@import '../../../theme.scss';\n\nverdocs-view {\n  font-family: $verdocs-primary-font;\n  display: flex;\n  padding: 15px;\n  row-gap: 15px;\n  min-height: 200px;\n  position: relative;\n  align-items: center;\n  box-sizing: border-box;\n  flex-direction: column;\n\n  div,\n  canvas {\n    box-sizing: border-box;\n  }\n}\n","// import pdf from 'pdfjs-dist';\nimport {VerdocsEndpoint} from '@verdocs/js-sdk';\n// import * as pdfjsLib from 'pdfjs-dist/legacy/build/pdf';\n// import PDFJSWorker from 'pdfjs-dist/legacy/build/pdf.worker.entry';\n// import {DocumentInitParameters, OnProgressParameters} from 'pdfjs-dist/types/src/display/api';\nimport {Component, h, Element, Event, Host, Prop, EventEmitter, State} from '@stencil/core';\n// import {Component, h, Element, Event, Host, Prop, Watch, EventEmitter, State} from '@stencil/core';\n// import {integerSequence} from '../../../utils/utils';\nimport {IDocumentPageInfo, IPageLayer} from '../../../utils/Types';\nimport {SDKError} from '../../../utils/errors';\nimport {getTemplate} from '@verdocs/js-sdk/Templates/Templates';\nimport {getPageImage} from '@verdocs/js-sdk/Templates/Pages';\nimport {ITemplate} from '@verdocs/js-sdk/Templates/Types';\nimport {integerSequence} from '../../../utils/utils';\n\n// const CMAPS_URL = `https://unpkg.com/pdfjs-dist@${pdfjsLib.version}/cmaps/`;\n\n// pdfjsLib.GlobalWorkerOptions.workerSrc = PDFJSWorker;\n\nexport interface ISourcePageMetrics {\n  width: number;\n  height: number;\n}\n\nexport interface IPageRenderEvent {\n  renderedPage: IDocumentPageInfo;\n  sourcePageMetrics: ISourcePageMetrics;\n  pages: Record<number, IDocumentPageInfo>;\n}\n\n@Component({\n  tag: 'verdocs-view',\n  styleUrl: 'verdocs-view.scss',\n  shadow: false,\n})\nexport class VerdocsView {\n  @Element() component: HTMLElement;\n\n  // private pdfDocument: pdfjsLib.PDFDocumentProxy;\n  // private fingerprints = [] as string[];\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 = VerdocsEndpoint.getDefault();\n\n  /**\n   * The template ID to render\n   */\n  @Prop() templateId: string = '';\n\n  /**\n   * Rotate the PDF in degrees\n   */\n  @Prop() rotation: 0 | 90 | 180 | 270 = 0;\n\n  /**\n   * Layers will be passed through to the individual pages inside this component.\n   */\n  @Prop() pageLayers: IPageLayer[] = [\n    {name: 'page', type: 'canvas'},\n    {name: 'controls', type: 'div'},\n  ];\n\n  /**\n   * Src of the PDF to load and render\n   */\n  @Prop() source: string;\n\n  /**\n   * Listen for changes to src\n   */\n  // @Watch('source')\n  // doSrc(newValue: string | null, oldValue: string | null): void {\n  //   if (newValue === oldValue) {\n  //     return;\n  //   }\n  //   this.loadAndRender(newValue);\n  // }\n\n  /**\n   * Fired when a page has been rendered\n   */\n  @Event() pageRendered: EventEmitter<IPageRenderEvent>;\n\n  /**\n   * Fired when a page has been changed\n   */\n  @Event() pageLoaded: EventEmitter<number>;\n\n  /**\n   * Fired when a page has been changed\n   */\n  @Event() pageChange: EventEmitter<number>;\n\n  /**\n   * Fired when a page has been initialized\n   */\n  @Event() pageInit: EventEmitter<number>;\n\n  /**\n   * Fired when a page has been scaled\n   */\n  @Event() scaleChange: EventEmitter<number>;\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  @State() loadProgress = 0;\n  @State() template: ITemplate | null = null;\n  @State() pageNumbers: number[] = [];\n  @State() pageUris: Record<number, string> = {};\n\n  @State()\n  numPages = 0;\n\n  domPages: Record<number, IDocumentPageInfo> = {};\n\n  sourcePageMetrics: Record<number, {width: number; height: number}> = {};\n\n  componentWillLoad() {\n    this.endpoint.loadSession();\n  }\n\n  // TODO: Handling signing vs preview-as-user cases\n  // TODO: Handle anonymous case and failure to load due to not being logged in\n  async componentDidLoad() {\n    this.endpoint.loadSession();\n\n    if (!this.templateId) {\n      console.log(`[VIEW] Missing required template ID ${this.templateId}`);\n      return;\n    }\n\n    try {\n      console.log(`[VIEW] Loading template ${this.templateId}`);\n      const template = await getTemplate(this.endpoint, this.templateId);\n\n      console.log('[VIEW] Got template', this.template);\n      this.template = template;\n      this.pageNumbers = integerSequence(1, template.pages.length);\n\n      const pageUris: Record<number, string> = {};\n      for await (let page of template.pages) {\n        console.log('[VIEW] Loading page', page);\n        // TODO: Make an endpoint to get all of the pages for a template\n        // TODO: When uploading a new template, pre-process its pages into images and comment that the individual page-loader is a utility,\n        //  not the primary mechanism.\n        const image = await getPageImage(this.endpoint, this.templateId, page.sequence);\n        // TODO: Make this uri to match the rest of the terminology?\n        pageUris[page.sequence] = image.url;\n        console.log('[VIEW] Got image Uri', image.url);\n        this.loadProgress = page.sequence / template.pages.length;\n      }\n\n      this.pageUris = pageUris;\n      this.loadProgress = 100;\n\n      // this.pdfUrl = `${this.endpoint.getBaseURL()}/templates/${this.templateId}/documents/${template.template_document?.id}?file=true`;\n    } catch (e) {\n      console.log('[VIEW] Error loading template', e);\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n    }\n    // if (this.source) {\n    //   this.loadAndRender(this.source);\n    // }\n  }\n\n  // Determine whether a page is \"rotated\" (in either direction)\n  // isRotated(rotation) {\n  //   return rotation !== 0 && rotation % 180 !== 0;\n  // }\n\n  // Render one document page. Note that pageNumber is 1-based.\n  async renderPage(pageNumber: number): Promise<void> {\n    const domPage = this.domPages[pageNumber];\n\n    // Two async operations happen here, loading the PDF and rendering the DOM div/canvas placeholders to draw the pages on.\n    if (!domPage) {\n      console.log('[VIEW] Skipping rendering page not yet in DOM', {pageNumber});\n      return;\n    }\n\n    const pageMetrics = this.sourcePageMetrics[pageNumber];\n\n    console.log('[VIEW] Rendering page', {pageNumber, pageMetrics, domPage});\n    try {\n      // const pdfPage = await this.pdfDocument.getPage(pageNumber);\n      // const viewport = pdfPage.getViewport({scale: domPage.xScale});\n      // console.log('[VIEW] Page viewport', domPage.xScale, viewport);\n\n      // const canvas = document.getElementById(`${domPage.containerId}-page`) as HTMLCanvasElement | null;\n      // if (!canvas) {\n      //   console.log('[VIEW] Unable to find canvas element');\n      //   return;\n      // }\n      //\n      // canvas.width = domPage.renderedWidth;\n      // canvas.height = domPage.renderedHeight;\n      // const canvasContext = canvas.getContext('2d');\n      // canvasContext.clearRect(0, 0, domPage.renderedWidth, domPage.renderedHeight);\n      // await pdfPage.render({canvasContext, viewport});\n\n      this.pageRendered.emit({\n        renderedPage: domPage,\n        sourcePageMetrics: pageMetrics,\n        pages: this.domPages,\n      });\n    } catch (e) {\n      this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n      console.warn('[VIEW] Error rendering page', e);\n    }\n  }\n\n  // async renderPages(): Promise<void> {\n  //   const pageNumbersToRender = integerSequence(1, this.numPages);\n  //   for await (let pageNumber of pageNumbersToRender) {\n  //     try {\n  //       await this.renderPage(pageNumber);\n  //     } catch (e) {\n  //       this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n  //       console.warn('[VIEW] Error rendering pages', e);\n  //     }\n  //   }\n  // }\n\n  // onProgress(progress: OnProgressParameters) {\n  //   console.log(`[VIEW] Progress ${Math.floor((progress.loaded / progress.total) * 100)} (${progress.loaded} / ${progress.total})`);\n  //   this.loadProgress = Math.floor((100 * progress.loaded) / progress.total);\n  // }\n\n  // After a document is done loading, go through its pages to get their dimensions\n  // async parsePageMetrics(pdfDocument: pdfjsLib.PDFDocumentProxy) {\n  //   const pageNumbersToRender = integerSequence(1, pdfDocument.numPages);\n  //\n  //   for await (let pageNumber of pageNumbersToRender) {\n  //     const pdfPage = await pdfDocument.getPage(1);\n  //     const [pageX0, pageY0, pageX1, pageY1] = pdfPage.view;\n  //     this.sourcePageMetrics[pageNumber] = {width: pageX1 - pageX0, height: pageY1 - pageY0};\n  //   }\n  //\n  //   console.log('[VIEW] Parsed page metrics', this.sourcePageMetrics);\n  // }\n\n  // loadAndRender(src: string): void {\n  //   console.log('[VIEW] Loading', src);\n  //\n  //   const token = this.endpoint.getToken();\n  //   const httpHeaders = token ? {Authorization: `Bearer ${token}`} : {};\n  //\n  //   const source = {\n  //     url: src,\n  //     cMapUrl: CMAPS_URL,\n  //     cMapPacked: true,\n  //     httpHeaders,\n  //     withCredentials: true,\n  //     stopAtErrors: true,\n  //     verbosity: pdfjsLib.VerbosityLevel.WARNINGS,\n  //     // verbosity: pdfjsLib.VerbosityLevel.INFOS,\n  //   } as DocumentInitParameters;\n  //\n  //   // @ts-ignore\n  //   const loadingTask = pdf.getDocument(source, null, null, this.onProgress);\n  //   loadingTask.onProgress = this.onProgress;\n  //   loadingTask.promise\n  //     .then(async (pdfDocument: pdfjsLib.PDFDocumentProxy) => {\n  //       await this.parsePageMetrics(pdfDocument);\n  //\n  //       this.pdfDocument = pdfDocument;\n  //       this.numPages = pdfDocument.numPages;\n  //       this.fingerprints = pdfDocument.fingerprints;\n  //       console.log(`[VIEW] Got PDF document fingerprints \"${this.fingerprints.join(', ')}\", ${this.numPages} page(s)`);\n  //\n  //       // We don't try to render the pages here, setting loadProtress triggers that by adding the individual page entries in\n  //       // DOM in render() below. Each page then fires onPageRendered when it is ready to receive content.\n  //       this.loadProgress = 100;\n  //     })\n  //     .catch(e => {\n  //       this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n  //       console.log('[VIEW] Loading error', e);\n  //     });\n  // }\n\n  async handlePageRendered(e: any) {\n    e.stopPropagation();\n\n    const domPage = e.detail as IDocumentPageInfo;\n    this.domPages[domPage.pageNumber] = domPage;\n    await this.renderPage(domPage.pageNumber);\n  }\n\n  render() {\n    console.log('[VIEW] Loading...', this.loadProgress);\n    if (this.loadProgress < 100) {\n      return (\n        <Host>\n          <verdocs-loader />\n        </Host>\n      );\n    }\n\n    console.log('[VIEW] Rendering pages', this.pageNumbers, this.pageUris);\n\n    // TODO: Error handling for missing pages. Is it better to skip the page or show a placeholder?\n    return (\n      <Host>\n        {this.pageNumbers.map(pageNumber => (\n          <verdocs-document-page\n            pageImageUri={this.pageUris[pageNumber]}\n            virtualWidth={this.sourcePageMetrics[pageNumber]?.width || 612}\n            virtualHeight={this.sourcePageMetrics[pageNumber]?.height || 792}\n            pageNumber={pageNumber}\n            layers={this.pageLayers}\n            onPageRendered={p => this.handlePageRendered(p)}\n          />\n        ))}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-1ec3941b.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(e,t,i,n){function o(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,r){function l(e){try{a(n.next(e))}catch(e){r(e)}}function s(e){try{a(n["throw"](e))}catch(e){r(e)}}function a(e){e.done?i(e.value):o(e.value).then(l,s)}a((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,o,r,l;return l={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(l[Symbol.iterator]=function(){return this}),l;function s(e){return function(t){return a([e,t])}}function a(l){if(n)throw new TypeError("Generator is already executing.");while(i)try{if(n=1,o&&(r=l[0]&2?o["return"]:l[0]?o["throw"]||((r=o["return"])&&r.call(o),0):o.next)&&!(r=r.call(o,l[1])).done)return r;if(o=0,r)l=[l[0]&2,r.value];switch(l[0]){case 0:case 1:r=l;break;case 4:i.label++;return{value:l[1],done:false};case 5:i.label++;o=l[1];l=[0];continue;case 7:l=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(l[0]===6||l[0]===2)){i=0;continue}if(l[0]===3&&(!r||l[1]>r[0]&&l[1]<r[3])){i.label=l[1];break}if(l[0]===6&&i.label<r[1]){i.label=r[1];r=l;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(l);break}if(r[2])i.ops.pop();i.trys.pop();continue}l=t.call(e,i)}catch(e){l=[6,e];o=0}finally{n=r=0}if(l[0]&5)throw l[1];return{value:l[0]?l[1]:void 0,done:true}}};System.register(["./p-97329951.system.js","./p-05eb4fed.system.js","./p-a4041773.system.js","./p-3035b6c5.system.js"],(function(e){"use strict";var t,i,n,o,r,l,s,a;return{setters:[function(e){t=e.r;i=e.c;n=e.h;o=e.H},function(e){r=e.g},function(e){l=e.a;s=e.g},function(e){a=e.s}],execute:function(){var u='verdocs-field-textbox{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;width:150px;height:15px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-textbox.disabled{opacity:0.5}verdocs-field-textbox input{width:100%;height:100%;font-size:11px;background:none;font-weight:500;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-box-sizing:border-box;box-sizing:border-box;color:rgba(0, 0, 0, 0.87);border:1px solid rgba(0, 0, 0, 0.2)}verdocs-field-textbox input:focus{outline:none}verdocs-field-textbox input.hide{display:none}verdocs-field-textbox.required{border:1px solid #cc0000}verdocs-field-textbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-field-textbox 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-textbox verdocs-button-panel[data-active],verdocs-field-textbox verdocs-button-panel:hover{opacity:1}verdocs-field-textbox verdocs-button-panel .icon svg{fill:#333333}verdocs-field-textbox verdocs-button-panel .icon:hover svg{fill:#000000}';var d='<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"><path d="m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z"/></svg>';var c=e("verdocs_field_textbox",function(){function e(e){t(this,e);this.fieldFocus=i(this,"fieldFocus",7);this.fieldBlur=i(this,"fieldBlur",7);this.fieldChange=i(this,"fieldChange",7);this.fieldInput=i(this,"fieldInput",7);this.recipientChanged=i(this,"recipientChanged",7);this.field=null;this.recipient=undefined;this.disabled=false;this.editable=false;this.moveable=false;this.roleindex=0;this.focused=false}e.prototype.focusField=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){this.focused=true;this.el.focus();this.fieldFocus.emit(true);return[2]}))}))};e.prototype.handleBlur=function(){this.focused=false;this.fieldBlur.emit(true)};e.prototype.handleFocus=function(){this.focused=true;this.fieldFocus.emit(true)};e.prototype.handleChange=function(e){this.fieldChange.emit(e.target.value)};e.prototype.handleInput=function(e){this.fieldInput.emit(e.target.value)};e.prototype.handleChangeRecipient=function(e){var t;console.log("recipient changed",e.detail);(t=this.recipientChanged)===null||t===void 0?void 0:t.emit(e.detail)};e.prototype.render=function(){var e=this;var t,i,u,c;var f=s(this.field);var h=(i=(t=this.disabled)!==null&&t!==void 0?t:f.disabled)!==null&&i!==void 0?i:false;var p=this.field["rgba"]||r(l(a.roleNames,""));return n(o,{class:{focused:this.focused,required:(u=this.field)===null||u===void 0?void 0:u.required,disabled:h},style:{backgroundColor:p}},n("input",{type:"text",placeholder:f===null||f===void 0?void 0:f.placeholder,tabIndex:f===null||f===void 0?void 0:f.order,value:f===null||f===void 0?void 0:f.result,disabled:h,required:(c=this.field)===null||c===void 0?void 0:c.required,ref:function(t){return e.el=t},onBlur:function(){return e.handleBlur()},onFocus:function(){return e.handleFocus()},onChange:function(t){return e.handleChange(t)},onInput:function(t){return e.handleInput(t)}}),this.editable&&n("verdocs-button-panel",{icon:d},n("h6",null,"Field Settings"),n("form",null,n("verdocs-select-input",{label:"Recipient",value:a.roleNames[this.roleindex],options:a.roleNames.map((function(e){return{label:e,value:e}})),onFieldChange:function(t){return e.handleChangeRecipient(t)}}),n("verdocs-text-input",{label:"Field Name",value:"",placeholder:"Stored field name...",onInput:function(e){return console.log("ipt",e)}}),n("verdocs-text-input",{label:"Placeholder",value:"",placeholder:"Placeholder text...",onInput:function(e){return console.log("ipt",e)}}))))};return e}());c.style=u}}}));
-//# sourceMappingURL=p-1ec3941b.system.entry.js.map

package/dist/verdocs-web-sdk/p-1ec3941b.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/elements/verdocs-field-textbox/verdocs-field-textbox.scss?tag=verdocs-field-textbox","src/components/elements/verdocs-field-textbox/verdocs-field-textbox.tsx"],"names":["verdocsFieldTextboxCss","settingsIcon","VerdocsFieldTextbox","exports","class_1","prototype","focusField","this","focused","el","focus","fieldFocus","emit","handleBlur","fieldBlur","handleFocus","handleChange","e","fieldChange","target","value","handleInput","fieldInput","handleChangeRecipient","console","log","detail","_a","recipientChanged","render","_this","settings","getFieldSettings","field","disabled","_b","backgroundColor","getRGBA","getRoleIndex","TemplateStore","roleNames","h","Host","class","required","_c","style","type","placeholder","tabIndex","order","result","_d","ref","onBlur","onFocus","onChange","onInput","editable","icon","label","roleindex","options","map","role","onFieldChange"],"mappings":"quDAAA,IAAMA,EAAyB,qvCCO/B,IAAMC,EACJ,6rCAUWC,EAAmBC,EAAA,wBAAA,6PAM0B,4CAU3B,oBAMA,oBAKA,qBAKA,eA6BV,MAEHC,EAAAC,UAAAC,WAAN,gGACRC,KAAKC,QAAU,KACfD,KAAKE,GAAGC,QACRH,KAAKI,WAAWC,KAAK,uBAGvBR,EAAAC,UAAAQ,WAAA,WACEN,KAAKC,QAAU,MACfD,KAAKO,UAAUF,KAAK,OAGtBR,EAAAC,UAAAU,YAAA,WACER,KAAKC,QAAU,KACfD,KAAKI,WAAWC,KAAK,OAGvBR,EAAAC,UAAAW,aAAA,SAAaC,GACXV,KAAKW,YAAYN,KAAKK,EAAEE,OAAOC,QAGjChB,EAAAC,UAAAgB,YAAA,SAAYJ,GACVV,KAAKe,WAAWV,KAAKK,EAAEE,OAAOC,QAGhChB,EAAAC,UAAAkB,sBAAA,SAAsBN,SACpBO,QAAQC,IAAI,oBAAqBR,EAAES,SACnCC,EAAApB,KAAKqB,oBAAgB,MAAAD,SAAA,OAAA,EAAAA,EAAEf,KAAKK,EAAES,SAGhCtB,EAAAC,UAAAwB,OAAA,WAAA,IAAAC,EAAAvB,iBACE,IAAMwB,EAAWC,EAAiBzB,KAAK0B,OACvC,IAAIC,GAAWC,GAAAR,EAAApB,KAAK2B,YAAQ,MAAAP,SAAA,EAAAA,EAAII,EAASG,YAAQ,MAAAC,SAAA,EAAAA,EAAI,MAErD,IAAMC,EAAkB7B,KAAK0B,MAAM,SAAWI,EAAQC,EAAaC,EAAcC,UAAW,KAE5F,OACEC,EAACC,EAAI,CAACC,MAAO,CAACnC,QAASD,KAAKC,QAASoC,UAAUC,EAAAtC,KAAK0B,SAAK,MAAAY,SAAA,OAAA,EAAAA,EAAED,SAAUV,SAAQA,GAAGY,MAAO,CAACV,gBAAeA,IACrGK,EAAA,QAAA,CACEM,KAAK,OACLC,YAAajB,IAAQ,MAARA,SAAQ,OAAA,EAARA,EAAUiB,YACvBC,SAAUlB,IAAQ,MAARA,SAAQ,OAAA,EAARA,EAAUmB,MACpB9B,MAAOW,IAAQ,MAARA,SAAQ,OAAA,EAARA,EAAUoB,OACjBjB,SAAUA,EACVU,UAAUQ,EAAA7C,KAAK0B,SAAK,MAAAmB,SAAA,OAAA,EAAAA,EAAER,SACtBS,IAAK,SAAA5C,GAAE,OAAKqB,EAAKrB,GAAKA,GACtB6C,OAAQ,WAAM,OAAAxB,EAAKjB,cACnB0C,QAAS,WAAM,OAAAzB,EAAKf,eACpByC,SAAU,SAAAvC,GAAK,OAAAa,EAAKd,aAAaC,IACjCwC,QAAS,SAAAxC,GAAK,OAAAa,EAAKT,YAAYJ,MAGhCV,KAAKmD,UACJjB,EAAA,uBAAA,CAAsBkB,KAAM1D,GAC1BwC,EAAA,KAAA,KAAA,kBACAA,EAAA,OAAA,KACEA,EAAA,uBAAA,CACEmB,MAAM,YACNxC,MAAOmB,EAAcC,UAAUjC,KAAKsD,WACpCC,QAASvB,EAAcC,UAAUuB,KAAI,SAAAC,GAAI,MAAA,CAAMJ,MAAOI,EAAM5C,MAAO4C,MACnEC,cAAe,SAAAhD,GAAK,OAAAa,EAAKP,sBAAsBN,MAGjDwB,EAAA,qBAAA,CAAoBmB,MAAM,aAAaxC,MAAM,GAAG4B,YAAY,uBAAuBS,QAAS,SAAAxC,GAAK,OAAAO,QAAQC,IAAI,MAAOR,MACpHwB,EAAA,qBAAA,CAAoBmB,MAAM,cAAcxC,MAAM,GAAG4B,YAAY,sBAAsBS,QAAS,SAAAxC,GAAK,OAAAO,QAAQC,IAAI,MAAOR,mBA9HlG","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-textbox {\n  font-family: $verdocs-primary-font;\n  width: 150px;\n  height: 15px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  background-color: transparent;\n  transform-origin: bottom left;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  input {\n    width: 100%;\n    height: 100%;\n    font-size: 11px;\n    background: none;\n    font-weight: 500;\n    transform-origin: 0 0;\n    box-sizing: border-box;\n    color: rgba(0, 0, 0, 0.87);\n    border: 1px solid rgba(0, 0, 0, 0.2);\n\n    &:focus {\n      outline: none;\n    }\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid rgb(204, 0, 0);\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.75s 2;\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","import {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\nimport {ITemplateField} from '@verdocs/js-sdk/Templates/Types';\nimport {IDocumentField, IRecipient} from '@verdocs/js-sdk/Documents/Types';\nimport {Component, h, Host, Prop, Event, EventEmitter, State, Method} from '@stencil/core';\nimport {getFieldSettings, getRoleIndex} from '../../../utils/utils';\nimport TemplateStore from '../../../utils/templateStore';\n\nconst settingsIcon =\n  '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\"><path d=\"m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z\"/></svg>';\n\n/**\n * Display a text input field.\n */\n@Component({\n  tag: 'verdocs-field-textbox',\n  styleUrl: 'verdocs-field-textbox.scss',\n  shadow: false,\n})\nexport class VerdocsFieldTextbox {\n  private el: HTMLInputElement;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop() field: IDocumentField | ITemplateField | null = null;\n\n  /**\n   * The recipient completing the form, if known.\n   */\n  @Prop() recipient?: IRecipient;\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() disabled?: boolean = false;\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() 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() moveable?: boolean = false;\n\n  /**\n   * If set, the field will be colored using this index value to select the background color.\n   */\n  @Prop() roleindex?: number = 0;\n\n  /**\n   * Event fired when the input field loses focus.\n   */\n  @Event({composed: true}) fieldFocus: EventEmitter<boolean>;\n\n  /**\n   * Event fired when the input field gains focus.\n   */\n  @Event({composed: true}) fieldBlur: EventEmitter<boolean>;\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 on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) fieldInput: EventEmitter<string>;\n\n  /**\n   * Event fired if the field is configurable when the recipient has changed.\n   */\n  @Event({composed: true}) recipientChanged: EventEmitter<string>;\n\n  @State() focused = false;\n\n  @Method() async focusField() {\n    this.focused = true;\n    this.el.focus();\n    this.fieldFocus.emit(true);\n  }\n\n  handleBlur() {\n    this.focused = false;\n    this.fieldBlur.emit(true);\n  }\n\n  handleFocus() {\n    this.focused = true;\n    this.fieldFocus.emit(true);\n  }\n\n  handleChange(e: any) {\n    this.fieldChange.emit(e.target.value);\n  }\n\n  handleInput(e: any) {\n    this.fieldInput.emit(e.target.value);\n  }\n\n  handleChangeRecipient(e: any) {\n    console.log('recipient changed', e.detail);\n    this.recipientChanged?.emit(e.detail);\n  }\n\n  render() {\n    const settings = getFieldSettings(this.field);\n    let disabled = this.disabled ?? settings.disabled ?? false;\n    // this.roleindex\n    const backgroundColor = this.field['rgba'] || getRGBA(getRoleIndex(TemplateStore.roleNames, ''));\n\n    return (\n      <Host class={{focused: this.focused, required: this.field?.required, disabled}} style={{backgroundColor}}>\n        <input\n          type=\"text\"\n          placeholder={settings?.placeholder}\n          tabIndex={settings?.order}\n          value={settings?.result}\n          disabled={disabled}\n          required={this.field?.required}\n          ref={el => (this.el = el)}\n          onBlur={() => this.handleBlur()}\n          onFocus={() => this.handleFocus()}\n          onChange={e => this.handleChange(e)}\n          onInput={e => this.handleInput(e)}\n        />\n\n        {this.editable && (\n          <verdocs-button-panel icon={settingsIcon}>\n            <h6>Field Settings</h6>\n            <form>\n              <verdocs-select-input\n                label=\"Recipient\"\n                value={TemplateStore.roleNames[this.roleindex]}\n                options={TemplateStore.roleNames.map(role => ({label: role, value: role}))}\n                onFieldChange={e => this.handleChangeRecipient(e)}\n              />\n\n              <verdocs-text-input label=\"Field Name\" value=\"\" placeholder=\"Stored field name...\" onInput={e => console.log('ipt', e)} />\n              <verdocs-text-input label=\"Placeholder\" value=\"\" placeholder=\"Placeholder text...\" onInput={e => console.log('ipt', e)} />\n            </form>\n          </verdocs-button-panel>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-2f4c5964.system.entry.js

@@ -1,2 +0,0 @@
-var __awaiter=this&&this.__awaiter||function(e,t,n,r){function o(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,i){function a(e){try{l(r.next(e))}catch(e){i(e)}}function s(e){try{l(r["throw"](e))}catch(e){i(e)}}function l(e){e.done?n(e.value):o(e.value).then(a,s)}l((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},r,o,i,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return l([e,t])}}function l(a){if(r)throw new TypeError("Generator is already executing.");while(n)try{if(r=1,o&&(i=a[0]&2?o["return"]:a[0]?o["throw"]||((i=o["return"])&&i.call(o),0):o.next)&&!(i=i.call(o,a[1])).done)return i;if(o=0,i)a=[a[0]&2,i.value];switch(a[0]){case 0:case 1:i=a;break;case 4:n.label++;return{value:a[1],done:false};case 5:n.label++;o=a[1];a=[0];continue;case 7:a=n.ops.pop();n.trys.pop();continue;default:if(!(i=n.trys,i=i.length>0&&i[i.length-1])&&(a[0]===6||a[0]===2)){n=0;continue}if(a[0]===3&&(!i||a[1]>i[0]&&a[1]<i[3])){n.label=a[1];break}if(a[0]===6&&n.label<i[1]){n.label=i[1];i=a;break}if(i&&n.label<i[2]){n.label=i[2];n.ops.push(a);break}if(i[2])n.ops.pop();n.trys.pop();continue}a=t.call(e,n)}catch(e){a=[6,e];o=0}finally{r=i=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};System.register(["./p-97329951.system.js","./p-a7433630.system.js","./p-7a63bdd1.system.js","./p-a4041773.system.js","./p-3035b6c5.system.js","./p-db54004b.system.js","./p-187b20b7.system.js","./p-d84dbdf9.system.js","./p-df878df9.system.js"],(function(e){"use strict";var t,n,r,o,i,a,s,l,u,c;return{setters:[function(e){t=e.r;n=e.c;r=e.h;o=e.H},function(){},function(e){i=e.V},function(e){a=e.r;s=e.a},function(e){l=e.s},function(e){u=e.l},function(e){c=e.S},function(){},function(){}],execute:function(){var d="";var p=e("verdocs_preview",function(){function e(e){t(this,e);this.sdkError=n(this,"sdkError",7);this.endpoint=i.getDefault();this.templateId=null}e.prototype.componentDidLoad=function(){return __awaiter(this,void 0,void 0,(function(){var e,t,n,r;return __generator(this,(function(o){switch(o.label){case 0:this.endpoint.loadSession();if(!this.templateId){console.log("[PREVIEW] Missing required template ID ".concat(this.templateId));return[2]}o.label=1;case 1:o.trys.push([1,3,,4]);console.log("[PREVIEW] Loading template ".concat(this.templateId));return[4,u(this.endpoint,this.templateId)];case 2:o.sent();return[3,4];case 3:r=o.sent();console.log("[PREVIEW] Error loading template",r);(e=this.sdkError)===null||e===void 0?void 0:e.emit(new c(r.message,(t=r.response)===null||t===void 0?void 0:t.status,(n=r.response)===null||n===void 0?void 0:n.data));return[3,4];case 4:return[2]}}))}))};e.prototype.handleFieldChange=function(e,t,n){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){console.log("[PREVIEW] handleFieldChange",e,t,n);return[2]}))}))};e.prototype.handlePageRendered=function(e){var t=this;var n=e.detail;console.log("[PREVIEW] Page rendered",n);var r=l.fields.filter((function(e){return e.page_sequence===n.renderedPage.pageNumber}));console.log("[PREVIEW] Fields on page",r);r.forEach((function(e){return a(e,n.renderedPage,s(l.roleNames,e.role_name),t.handleFieldChange,true)}))};e.prototype.render=function(){var e=this;if(l.loading){return r(o,null,r("verdocs-loader",null))}return r(o,null,l.template?r("div",{class:"inner"},r("verdocs-view",{templateId:this.templateId,endpoint:this.endpoint,onPageRendered:function(t){return e.handlePageRendered(t)},pageLayers:[{name:"page",type:"canvas"},{name:"controls",type:"div"}]})):r("div",null,"Error loading Template. Please try again later."))};return e}());p.style=d}}}));
-//# sourceMappingURL=p-2f4c5964.system.entry.js.map

package/dist/verdocs-web-sdk/p-2f7e61e9.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,H as o,c as i}from"./p-ff1278ed.js";import{c as n}from"./p-ec26fc38.js";const s='verdocs-button-panel{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;display:inline-block}verdocs-button-panel .icon{display:inline-block;cursor:pointer}verdocs-button-panel .icon svg{fill:#cccccc}verdocs-button-panel .icon:hover svg{fill:#ffffff}.verdocs-button-panel-content{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;-webkit-box-shadow:0 0 10px 1px #999999;box-shadow:0 0 10px 1px #999999;display:none;background:#ffffff;color:#33364b;width:280px;font-weight:bold;padding:15px;font-size:14px;position:relative;border-radius:4px;z-index:10000}.verdocs-button-panel-content .arrow,.verdocs-button-panel-content .arrow::before{position:absolute;width:8px;height:8px;background:inherit}.verdocs-button-panel-content .arrow{visibility:hidden;top:-4px}.verdocs-button-panel-content .arrow::before{visibility:visible;content:"";-webkit-transform:rotate(45deg);transform:rotate(45deg)}.verdocs-button-panel-content[data-show]{display:block}.verdocs-button-panel-content[data-popper-placement^=top]>.arrow{bottom:-4px}.verdocs-button-panel-content[data-popper-placement^=bottom]>.arrow{top:-4px}.verdocs-button-panel-content[data-popper-placement^=left]>.arrow{right:-4px}.verdocs-button-panel-content[data-popper-placement^=right]>.arrow{left:-4px}.verdocs-button-panel-content h6{color:#092c4c;font-size:16px;font-weight:bold;margin:0 0 8px 0}.verdocs-button-panel-content form{margin:0;padding:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.verdocs-button-panel-content label{display:block;font-size:14px;font-weight:bold;margin:0 0 3px 0;color:#33364b}.verdocs-button-panel-content input{-ms-flex:1;flex:1;height:34px;display:-ms-flexbox;display:flex;font-size:14px;margin:0 0 10px 0}';const a=class{constructor(e){t(this,e);this.showing=false;this.icon=""}componentDidRender(){document.body.appendChild(this.panelEl);if(this.popperInstance){this.popperInstance.destroy()}this.popperInstance=n(this.iconEl,this.panelEl,{})}disconnectedCallback(){if(this.popperInstance){this.popperInstance.destroy();this.popperInstance=null}if(this.panelEl){this.panelEl.remove()}}toggle(t){var e,o,i,n;t.stopPropagation();if(this.showing){(e=this.panelEl)===null||e===void 0?void 0:e.removeAttribute("data-show");(o=this.hiderEl)===null||o===void 0?void 0:o.remove();this.showing=false}else{(i=this.panelEl)===null||i===void 0?void 0:i.setAttribute("data-show","");(n=this.popperInstance)===null||n===void 0?void 0:n.update().catch((()=>{}));this.showing=true;this.hiderEl=document.createElement("div");this.hiderEl.style.zIndex="100";this.hiderEl.style.position="absolute";this.hiderEl.style.top="0px";this.hiderEl.style.left="0px";this.hiderEl.style.right="0px";this.hiderEl.style.bottom="0px";this.hiderEl.onclick=t=>this.toggle(t);document.body.appendChild(this.hiderEl)}}render(){return e(o,null,e("div",{class:"icon",innerHTML:this.icon,onClick:t=>this.toggle(t),ref:t=>this.iconEl=t}),e("div",{role:"tooltip",class:"verdocs-button-panel-content","data-popper-placement":"bottom",ref:t=>this.panelEl=t},e("div",{"data-popper-arrow":"true",class:"arrow"}),e("slot",null)))}};a.style=s;const l='verdocs-select-input{font-family:"Barlow", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 0 10px 0;display:block}verdocs-select-input .input-element{-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #707ae5;border-radius:4px;background:#ffffff;color:#000;width:100%;font-size:16px;height:28px;padding:4px 12px}verdocs-select-input .input-element::-webkit-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-moz-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element::placeholder{color:#aaaaaa;opacity:1}verdocs-select-input .input-element:focus{border:1px solid #7d88ff}verdocs-select-input .input-label{display:block;color:#555570;font-weight:700;font-size:14px;margin:0 0 4px 0}';const p=class{constructor(e){t(this,e);this.fieldChange=i(this,"fieldChange",7);this.value="";this.label="";this.options=undefined;this.disabled=false;this._value=""}componentWillLoad(){this._value=this.value}componentDidLoad(){}handleInput(t){var e;this._value=t.target.value;(e=this.fieldChange)===null||e===void 0?void 0:e.emit(t.target.value)}render(){return e(o,{class:"input-field"},e("label",null,this.label?e("div",{class:"input-label"},this.label+":"):e("div",null),e("select",{class:"input-element",disabled:this.disabled,onInput:t=>this.handleInput(t)},this.options.map((t=>e("option",{value:t.value,selected:t.value===this.value},t.label))))))}};p.style=l;const r='verdocs-text-input{font-family:"Barlow", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 0 10px 0;display:block}verdocs-text-input .input-element{-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #707ae5;border-radius:4px;background:#ffffff;color:#000;width:100%;font-size:16px;height:28px;padding:4px 12px;outline:none}verdocs-text-input .input-element::-webkit-input-placeholder{color:#aaaaaa;opacity:1}verdocs-text-input .input-element::-moz-placeholder{color:#aaaaaa;opacity:1}verdocs-text-input .input-element:-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-text-input .input-element::-ms-input-placeholder{color:#aaaaaa;opacity:1}verdocs-text-input .input-element::placeholder{color:#aaaaaa;opacity:1}verdocs-text-input .input-element:focus{outline:1px solid #7d88ff}verdocs-text-input .input-label{display:block;color:#555570;font-weight:700;font-size:14px;margin:0 0 4px 0}';const c=class{constructor(e){t(this,e);this.value="";this.label="";this.placeholder="";this.autocomplete="";this.type="text";this.disabled=false;this._value=""}componentWillLoad(){}componentDidLoad(){}render(){return e(o,{class:"input-field"},e("label",null,this.label?e("div",{class:"input-label"},this.label+":"):e("div",null),e("input",{type:this.type,value:this.value,class:"input-element","data-lpignore":"true",disabled:this.disabled,placeholder:this.placeholder,autoComplete:this.autocomplete})))}};c.style=r;export{a as verdocs_button_panel,p as verdocs_select_input,c as verdocs_text_input};
-//# sourceMappingURL=p-2f7e61e9.entry.js.map

package/dist/verdocs-web-sdk/p-2f7e61e9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/controls/verdocs-button-panel/verdocs-button-panel.scss?tag=verdocs-button-panel","src/components/controls/verdocs-button-panel/verdocs-button-panel.tsx","src/components/controls/verdocs-select-input/verdocs-select-input.scss?tag=verdocs-select-input","src/components/controls/verdocs-select-input/verdocs-select-input.tsx","src/components/controls/verdocs-text-input/verdocs-text-input.scss?tag=verdocs-text-input","src/components/controls/verdocs-text-input/verdocs-text-input.tsx"],"names":["verdocsButtonPanelCss","VerdocsButtonPanel","this","showing","[object Object]","document","body","appendChild","panelEl","popperInstance","destroy","createPopper","iconEl","remove","e","stopPropagation","_a","removeAttribute","_b","hiderEl","_c","setAttribute","_d","update","catch","createElement","style","zIndex","position","top","left","right","bottom","onclick","toggle","h","Host","class","innerHTML","icon","onClick","ref","el","role","data-popper-placement","data-popper-arrow","verdocsSelectInputCss","VerdocsSelectInput","_value","value","target","fieldChange","emit","label","disabled","onInput","handleInput","options","map","option","selected","verdocsTextInputCss","VerdocsTextInput","type","data-lpignore","placeholder","autoComplete","autocomplete"],"mappings":"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","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-button-panel {\n  font-family: $verdocs-primary-font;\n  display: inline-block;\n\n  .icon {\n    display: inline-block;\n    cursor: pointer;\n\n    svg {\n      fill: $light-border-color;\n    }\n\n    &:hover {\n      svg {\n        fill: $verdocs-grey-4;\n      }\n    }\n  }\n}\n\n.verdocs-button-panel-content {\n  font-family: $verdocs-primary-font;\n  box-shadow: 0 0 10px 1px #999999;\n  display: none;\n  background: #ffffff;\n  color: $label-color;\n  width: 280px;\n  font-weight: bold;\n  padding: 15px;\n  font-size: 14px;\n  position: relative;\n  border-radius: 4px;\n  z-index: 10000;\n\n  .arrow,\n  .arrow::before {\n    position: absolute;\n    width: 8px;\n    height: 8px;\n    background: inherit;\n  }\n\n  .arrow {\n    visibility: hidden;\n    top: -4px;\n  }\n\n  .arrow::before {\n    visibility: visible;\n    content: '';\n    transform: rotate(45deg);\n  }\n\n  &[data-show] {\n    display: block;\n  }\n\n  &[data-popper-placement^='top'] > .arrow {\n    bottom: -4px;\n  }\n\n  &[data-popper-placement^='bottom'] > .arrow {\n    top: -4px;\n  }\n\n  &[data-popper-placement^='left'] > .arrow {\n    right: -4px;\n  }\n\n  &[data-popper-placement^='right'] > .arrow {\n    left: -4px;\n  }\n\n  h6 {\n    color: $verdocs-grey-0;\n    font-size: 16px;\n    font-weight: bold;\n    margin: 0 0 8px 0;\n  }\n\n  form {\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n  }\n\n  label {\n    display: block;\n    font-size: 14px;\n    font-weight: bold;\n    margin: 0 0 3px 0;\n    color: $verdocs-grey-1;\n  }\n\n  input {\n    flex: 1;\n    height: 34px;\n    display: flex;\n    font-size: 14px;\n    margin: 0 0 10px 0;\n  }\n}\n","import {createPopper, Instance} from '@popperjs/core';\nimport {Component, h, Host, Prop} from '@stencil/core';\n\n/**\n * Displays a clickable icon. When clicked, a customizable drop-down panel will be displayed.\n */\n@Component({\n  tag: 'verdocs-button-panel',\n  styleUrl: 'verdocs-button-panel.scss',\n  shadow: false,\n})\nexport class VerdocsButtonPanel {\n  iconEl: HTMLDivElement;\n  panelEl: HTMLDivElement;\n  hiderEl?: HTMLDivElement;\n  popperInstance: Instance;\n\n  /**\n   * SVG icon to display\n   */\n  @Prop() icon: string = '';\n\n  componentDidRender() {\n    document.body.appendChild(this.panelEl);\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n    }\n\n    this.popperInstance = createPopper(this.iconEl, this.panelEl, {\n      // placement: 'top-end',\n      // modifiers: [{name: 'offset', options: {offset: [0, 10]}}],\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.popperInstance) {\n      this.popperInstance.destroy();\n      this.popperInstance = null;\n    }\n\n    if (this.panelEl) {\n      this.panelEl.remove();\n    }\n  }\n\n  showing = false;\n  toggle(e: any) {\n    e.stopPropagation();\n\n    if (this.showing) {\n      this.panelEl?.removeAttribute('data-show');\n      this.hiderEl?.remove();\n      this.showing = false;\n    } else {\n      this.panelEl?.setAttribute('data-show', '');\n      this.popperInstance?.update().catch(() => {});\n      this.showing = true;\n\n      this.hiderEl = document.createElement('div');\n      this.hiderEl.style.zIndex = '100';\n      this.hiderEl.style.position = 'absolute';\n      this.hiderEl.style.top = '0px';\n      this.hiderEl.style.left = '0px';\n      this.hiderEl.style.right = '0px';\n      this.hiderEl.style.bottom = '0px';\n      this.hiderEl.onclick = (e: any) => this.toggle(e);\n      document.body.appendChild(this.hiderEl);\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"icon\" innerHTML={this.icon} onClick={(e: any) => this.toggle(e)} ref={el => (this.iconEl = el)} />\n        <div role=\"tooltip\" class=\"verdocs-button-panel-content\" data-popper-placement=\"bottom\" ref={el => (this.panelEl = el as HTMLDivElement)}>\n          <div data-popper-arrow=\"true\" class=\"arrow\" />\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n","@import '../../../theme.scss';\n\nverdocs-select-input {\n  font-family: $primary-font;\n  box-sizing: border-box;\n  margin: 0 0 10px 0;\n  display: block;\n\n  .input-element {\n    box-sizing: border-box;\n    border: 1px solid $border-color;\n    border-radius: 4px;\n    background: $verdocs-grey-4;\n    color: #000;\n    width: 100%;\n    font-size: 16px;\n    height: 28px;\n    padding: 4px 12px;\n\n    &::placeholder {\n      color: $light-disabled-color;\n      opacity: 1;\n    }\n\n    &:focus {\n      border: 1px solid $border-color-highlight;\n    }\n  }\n\n  .input-label {\n    display: block;\n    color: $label-color-light;\n    font-weight: 700;\n    font-size: 14px;\n    margin: 0 0 4px 0;\n  }\n}\n","import {Component, Prop, State, Host, h, Event, EventEmitter} from '@stencil/core';\n\n/**\n * Display a text input field. This is just a standard HTML input field with minimal markup to fit the\n * visual styles of the other components. Note that events \"bubble\" from the input field to the container,\n * so you can subscribe to the same DOM events (input, blur, etc) that a normal input would emmit.\n */\n@Component({\n  tag: 'verdocs-select-input',\n  styleUrl: 'verdocs-select-input.scss',\n})\nexport class VerdocsSelectInput {\n  /**\n   * The initial value for the input field.\n   */\n  @Prop() value: string = '';\n\n  /**\n   * The label for the field.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * The options to list.\n   */\n  @Prop() options: {label: string; value: string}[];\n\n  /**\n   * Should the field be disabled?\n   */\n  @Prop() disabled: boolean = false;\n\n  @State() _value: string = '';\n\n  /**\n   * Event fired when the selection has changed\n   */\n  @Event({composed: true}) fieldChange: EventEmitter<string>;\n\n  componentWillLoad() {\n    this._value = this.value;\n  }\n\n  componentDidLoad() {}\n\n  handleInput(e: any) {\n    this._value = e.target.value;\n    this.fieldChange?.emit(e.target.value);\n  }\n\n  render() {\n    return (\n      <Host class=\"input-field\">\n        <label>\n          {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n          <select class=\"input-element\" disabled={this.disabled} onInput={e => this.handleInput(e)}>\n            {this.options.map(option => (\n              <option value={option.value} selected={option.value === this.value}>\n                {option.label}\n              </option>\n            ))}\n          </select>\n        </label>\n      </Host>\n    );\n  }\n}\n","@import '../../../theme.scss';\n\nverdocs-text-input {\n  font-family: $primary-font;\n  box-sizing: border-box;\n  margin: 0 0 10px 0;\n  display: block;\n\n  .input-element {\n    box-sizing: border-box;\n    border: 1px solid $border-color;\n    border-radius: 4px;\n    background: $verdocs-grey-4;\n    color: #000;\n    width: 100%;\n    font-size: 16px;\n    height: 28px;\n    padding: 4px 12px;\n    outline: none;\n\n    &::placeholder {\n      color: $light-disabled-color;\n      opacity: 1;\n    }\n\n    &:focus {\n      outline: 1px solid $border-color-highlight;\n    }\n  }\n\n  .input-label {\n    display: block;\n    color: $label-color-light;\n    font-weight: 700;\n    font-size: 14px;\n    margin: 0 0 4px 0;\n  }\n}\n","import {Component, Prop, State, Host, h} from '@stencil/core';\n\n/**\n * Display a text input field. This is just a standard HTML input field with minimal markup to fit the\n * visual styles of the other components. Note that events \"bubble\" from the input field to the container,\n * so you can subscribe to the same DOM events (input, blur, etc) that a normal input would emmit.\n */\n@Component({\n  tag: 'verdocs-text-input',\n  styleUrl: 'verdocs-text-input.scss',\n})\nexport class VerdocsTextInput {\n  /**\n   * The initial value for the input field.\n   */\n  @Prop() value: string = '';\n\n  /**\n   * The label for the field.\n   */\n  @Prop() label: string = '';\n\n  /**\n   * The placeholder for the field.\n   */\n  @Prop() placeholder: string = '';\n\n  /**\n   * If desired, the autocomplete attribute to set.\n   */\n  @Prop() autocomplete: string = '';\n\n  /**\n   * The type of field to render. Only text-type fields are allowed here for the current styling. Additional types\n   * (e.g. a date picker) will be supported by other controls in the future.\n   */\n  @Prop() type: 'text' | 'password' | 'email' | 'number' | 'search' | 'tel' | 'url' = 'text';\n\n  /**\n   * Should the field be disabled?\n   */\n  @Prop() disabled: boolean = false;\n\n  @State() _value: string = '';\n\n  componentWillLoad() {\n    // this._value = this.value;\n  }\n\n  componentDidLoad() {}\n\n  // handleInput(e: any) {\n  //   this._value = e.target.value;\n  // }\n\n  render() {\n    return (\n      <Host class=\"input-field\">\n        <label>\n          {this.label ? <div class=\"input-label\">{this.label + ':'}</div> : <div />}\n          <input\n            type={this.type}\n            value={this.value}\n            class=\"input-element\"\n            data-lpignore=\"true\"\n            disabled={this.disabled}\n            placeholder={this.placeholder}\n            autoComplete={this.autocomplete}\n            // onInput={e => this.handleInput(e)}\n          />\n        </label>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-3bc4c242.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/elements/verdocs-field-textarea/verdocs-field-textarea.scss?tag=verdocs-field-textarea","src/components/elements/verdocs-field-textarea/verdocs-field-textarea.tsx"],"names":["verdocsFieldTextareaCss","settingsIcon","VerdocsFieldTextarea","[object Object]","this","focused","el","focus","fieldFocus","emit","fieldBlur","e","fieldChange","target","value","fieldInput","settings","getFieldSettings","field","disabled","_b","_a","backgroundColor","getRGBA","roleindex","h","Host","class","required","style","placeholder","tabIndex","order","ref","onBlur","handleBlur","onFocus","handleFocus","onChange","handleChange","onInput","handleInput","editable","icon","label","options","onFieldChange","console","log"],"mappings":"iIAAA,MAAMA,EAA0B,2yBCMhC,MAAMC,EACJ,+rCAUWC,EAAoB,sMAMyB,4CAU3B,oBAMA,oBAKA,qBA2BA,eAEV,MAETC,mBACRC,KAAKC,QAAU,KACfD,KAAKE,GAAGC,QACRH,KAAKI,WAAWC,KAAK,MAGvBN,aACEC,KAAKC,QAAU,MACfD,KAAKM,UAAUD,KAAK,MAGtBN,cACEC,KAAKC,QAAU,KACfD,KAAKI,WAAWC,KAAK,MAGvBN,aAAaQ,GACXP,KAAKQ,YAAYH,KAAKE,EAAEE,OAAOC,OAGjCX,YAAYQ,GACVP,KAAKW,WAAWN,KAAKE,EAAEE,OAAOC,OAGhCX,iBACE,MAAMa,EAAWC,EAAiBb,KAAKc,OACvC,MAAMC,GAAWC,GAAAC,EAAAjB,KAAKe,YAAQ,MAAAE,SAAA,EAAAA,EAAIL,EAASG,YAAQ,MAAAC,SAAA,EAAAA,EAAI,MACvD,MAAME,EAAkBlB,KAAKc,MAAM,SAAWK,EAAQnB,KAAKoB,WAE3D,OACEC,EAACC,EAAI,CAACC,MAAO,CAACtB,QAASD,KAAKC,QAASuB,SAAUZ,EAASY,SAAUT,SAAAA,GAAWU,MAAO,CAACP,gBAAAA,IACnFG,EAAA,WAAA,CACEK,YAAad,EAASc,aAAe,GACrCC,SAAUf,EAASgB,MACnBlB,MAAOE,EAASF,MAChBK,SAAUA,EACVS,SAAUZ,EAASY,SACnBK,IAAK3B,GAAOF,KAAKE,GAAKA,EACtB4B,OAAQ,IAAM9B,KAAK+B,aACnBC,QAAS,IAAMhC,KAAKiC,cACpBC,SAAU3B,GAAKP,KAAKmC,aAAa5B,GACjC6B,QAAS7B,GAAKP,KAAKqC,YAAY9B,KAGhCP,KAAKsC,UACJjB,EAAA,uBAAA,CAAsBkB,KAAM1C,GAC1BwB,EAAA,KAAA,KAAA,kBACAA,EAAA,OAAA,KACEA,EAAA,uBAAA,CACEmB,MAAM,YACNC,QAAS,CACP,CAACD,MAAO,QAAS9B,MAAO,SACxB,CAAC8B,MAAO,SAAU9B,MAAO,WAE3BgC,cAAenC,IACboC,QAAQC,IAAI,iBAAkBrC,MAIlCc,EAAA,qBAAA,CAAoBmB,MAAM,aAAa9B,MAAM,GAAGgB,YAAY,uBAAuBU,QAAS7B,GAAKoC,QAAQC,IAAI,MAAOrC,KACpHc,EAAA,qBAAA,CAAoBmB,MAAM,cAAc9B,MAAM,GAAGgB,YAAY,sBAAsBU,QAAS7B,GAAKoC,QAAQC,IAAI,MAAOrC","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-textarea {\n  font-family: $verdocs-primary-font;\n  width: 150px;\n  height: 15px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  background-color: transparent;\n  transform-origin: bottom left;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  textarea {\n    box-sizing: border-box;\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    border: 1px solid rgba(0, 0, 0, 0.2);\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid rgb(204, 0, 0);\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.75s 2;\n  }\n}\n","import {Component, h, Host, Prop, Event, EventEmitter, State, Method} from '@stencil/core';\nimport {IDocumentField, IRecipient} from '@verdocs/js-sdk/Documents/Types';\nimport {ITemplateField} from '@verdocs/js-sdk/Templates/Types';\nimport {getFieldSettings} from '../../../utils/utils';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\n\nconst settingsIcon =\n  '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\"><path d=\"m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z\"/></svg>';\n\n/**\n * Display a multi-line text input field.\n */\n@Component({\n  tag: 'verdocs-field-textarea',\n  styleUrl: 'verdocs-field-textarea.scss',\n  shadow: false,\n})\nexport class VerdocsFieldTextarea {\n  private el: HTMLTextAreaElement;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop() field: IDocumentField | ITemplateField | null = null;\n\n  /**\n   * The recipient completing the form, if known.\n   */\n  @Prop() recipient?: IRecipient;\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() disabled?: boolean = false;\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() 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() moveable?: boolean = false;\n\n  /**\n   * Event fired when the input field loses focus.\n   */\n  @Event({composed: true}) fieldFocus: EventEmitter<boolean>;\n\n  /**\n   * Event fired when the input field gains focus.\n   */\n  @Event({composed: true}) fieldBlur: EventEmitter<boolean>;\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 on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) fieldInput: EventEmitter<string>;\n\n  /**\n   * If set, the field will be colored using this index value to select the background color.\n   */\n  @Prop() roleindex?: number = 0;\n\n  @State() focused = false;\n\n  @Method() async focusField() {\n    this.focused = true;\n    this.el.focus();\n    this.fieldFocus.emit(true);\n  }\n\n  handleBlur() {\n    this.focused = false;\n    this.fieldBlur.emit(true);\n  }\n\n  handleFocus() {\n    this.focused = true;\n    this.fieldFocus.emit(true);\n  }\n\n  handleChange(e: any) {\n    this.fieldChange.emit(e.target.value);\n  }\n\n  handleInput(e: any) {\n    this.fieldInput.emit(e.target.value);\n  }\n\n  render() {\n    const settings = getFieldSettings(this.field);\n    const disabled = this.disabled ?? settings.disabled ?? false;\n    const backgroundColor = this.field['rgba'] || getRGBA(this.roleindex);\n\n    return (\n      <Host class={{focused: this.focused, required: settings.required, disabled}} style={{backgroundColor}}>\n        <textarea\n          placeholder={settings.placeholder || ''}\n          tabIndex={settings.order}\n          value={settings.value}\n          disabled={disabled}\n          required={settings.required}\n          ref={el => (this.el = el)}\n          onBlur={() => this.handleBlur()}\n          onFocus={() => this.handleFocus()}\n          onChange={e => this.handleChange(e)}\n          onInput={e => this.handleInput(e)}\n        />\n\n        {this.editable && (\n          <verdocs-button-panel icon={settingsIcon}>\n            <h6>Field Settings</h6>\n            <form>\n              <verdocs-select-input\n                label=\"Recipient\"\n                options={[\n                  {label: 'Buyer', value: 'Buyer'},\n                  {label: 'Seller', value: 'Seller'},\n                ]}\n                onFieldChange={e => {\n                  console.log('select changed', e);\n                }}\n              />\n\n              <verdocs-text-input label=\"Field Name\" value=\"\" placeholder=\"Stored field name...\" onInput={e => console.log('ipt', e)} />\n              <verdocs-text-input label=\"Placeholder\" value=\"\" placeholder=\"Placeholder text...\" onInput={e => console.log('ipt', e)} />\n            </form>\n          </verdocs-button-panel>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-42ee012b.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-97329951.system.js","./p-a7433630.system.js","./p-7a63bdd1.system.js"],(function(e){"use strict";var t,o,n,a;return{setters:[function(e){t=e.r;o=e.c;n=e.h},function(){},function(e){a=e.V}],execute:function(){var s='verdocs-contact-picker{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif}verdocs-contact-picker form{background-color:#f5f5fa;padding:12px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker form .row{width:300px;display:-ms-flexbox;display:flex;position:relative;margin:0 0 20px 0;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker form label{display:block;font-size:14px;font-weight:500;margin:0 0 4px 0;color:#5c6575}verdocs-contact-picker form input{border:none;font-size:18px;padding:3px 6px 3px 0;background:transparent;border-bottom:1px solid #33364b}verdocs-contact-picker form input:focus{outline:none}verdocs-contact-picker form .dropdown{left:0;right:0;top:49px;z-index:100;position:absolute;background:#ffffff;-webkit-box-shadow:0 0 15px 0 rgba(0, 0, 0, 0.1);box-shadow:0 0 15px 0 rgba(0, 0, 0, 0.1)}verdocs-contact-picker form .dropdown .suggestion{display:-ms-flexbox;display:flex;padding:6px 12px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-contact-picker form .dropdown .suggestion svg{fill:#666666}verdocs-contact-picker form .dropdown .suggestion .avatar{width:48px;height:48px;-ms-flex:0 0 48px;flex:0 0 48px;margin-right:8px;border-radius:100%}verdocs-contact-picker form .dropdown .suggestion .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}verdocs-contact-picker form .dropdown .suggestion .name{font-size:16px;font-weight:500;margin-bottom:3px;color:#092c4c}verdocs-contact-picker form .dropdown .suggestion .destination{font-size:14px;margin-bottom:3px;color:#33364b}verdocs-contact-picker form .dropdown .suggestion:hover{background:#eee;cursor:pointer}verdocs-contact-picker .buttons{display:-ms-flexbox;display:flex;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;margin-top:16px;-ms-flex-direction:row;flex-direction:row}verdocs-contact-picker .buttons .flex-fill{-ms-flex:1;flex:1}verdocs-contact-picker ::-webkit-input-placeholder{color:#aaaaaa}verdocs-contact-picker ::-moz-placeholder{color:#aaaaaa}verdocs-contact-picker :-ms-input-placeholder{color:#aaaaaa}verdocs-contact-picker ::-ms-input-placeholder{color:#aaaaaa}verdocs-contact-picker ::placeholder{color:#aaaaaa}';var i='<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiBox-root css-1om0hkc" focusable="false" aria-hidden="true" viewBox="0 0 24 24"><path d="M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z"></path></svg>';var c='<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-zjt8k" focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="AssignmentIndIcon" tabindex="-1" title="AssignmentInd"><path d="M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm0 4c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm6 12H6v-1.4c0-2 4-3.1 6-3.1s6 1.1 6 3.1V19z"></path></svg>';var r='<svg class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-zjt8k" focusable="false" aria-hidden="true" viewBox="0 0 24 24" data-testid="AccountCircleIcon" tabindex="-1" title="AccountCircle"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 4c1.93 0 3.5 1.57 3.5 3.5S13.93 13 12 13s-3.5-1.57-3.5-3.5S10.07 6 12 6zm0 14c-2.03 0-4.43-.82-6.14-2.88C7.55 15.8 9.68 15 12 15s4.45.8 6.14 2.12C16.43 19.18 14.03 20 12 20z"></path></svg>';var l=e("verdocs_contact_picker",function(){function e(e){t(this,e);this.searchContacts=o(this,"searchContacts",7);this.cancel=o(this,"cancel",7);this.contactSelected=o(this,"contactSelected",7);this.endpoint=a.getDefault();this.templateRole=null;this.contactSuggestions=[];this.name=undefined;this.email=undefined;this.phone=undefined;this.message=undefined;this.showSuggestions=false;this.showMessage=false;this.delegator=false}e.prototype.componentWillLoad=function(){if(this.templateRole){this.name=this.templateRole.full_name||"";this.email=this.templateRole.email||"";this.phone=this.templateRole.phone||"";this.delegator=this.templateRole.delegator||false;this.message=this.templateRole.message||"";this.showMessage=this.message!==""}};e.prototype.handleNameChange=function(e){var t;this.name=e.target.value;(t=this.searchContacts)===null||t===void 0?void 0:t.emit({query:this.name})};e.prototype.handleEmailChange=function(e){this.email=e.target.value};e.prototype.handlePhoneChange=function(e){this.phone=e.target.value};e.prototype.handleMessageChange=function(e){this.message=e.target.value};e.prototype.handleCancel=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.cancel)===null||t===void 0?void 0:t.emit()};e.prototype.handleSubmit=function(e){var t;e.stopPropagation();this.showSuggestions=false;(t=this.contactSelected)===null||t===void 0?void 0:t.emit({full_name:this.name,email:this.email,phone:this.phone,message:this.message,delegator:this.delegator})};e.prototype.handleSelectSuggestion=function(e,t){e.stopPropagation();this.name=t.name;this.email=t.email;this.phone=t.phone;this.showSuggestions=false};e.prototype.render=function(){var e=this;return n("form",{onSubmit:function(e){return e.preventDefault()},onClick:function(e){return e.stopPropagation()},autocomplete:"off"},n("div",{class:"row"},n("label",{htmlFor:"verdocs-contact-picker-name"},"Name:"),n("input",{id:"verdocs-contact-picker-name",name:"verdocs-contact-picker-name",type:"text","data-lpignore":"true",autocomplete:"off",value:this.name,placeholder:"Recipient Name...",onFocus:function(){var t;return e.showSuggestions=((t=e.contactSuggestions)===null||t===void 0?void 0:t.length)>0},onInput:function(t){return e.handleNameChange(t)}}),this.showSuggestions&&n("div",{class:"dropdown"},this.contactSuggestions.map((function(t){var o;return n("div",{key:(o=t.id)!==null&&o!==void 0?o:t.name,class:"suggestion",onClick:function(o){return e.handleSelectSuggestion(o,t)}},t.avatar?n("img",{alt:"Avatar",class:"avatar",src:t.avatar}):n("div",{class:"avatar",innerHTML:r}),n("div",{class:"details"},n("div",{class:"name"},t.name),t.email&&n("div",{class:"destination"},t.email),t.phone&&n("div",{class:"destination"},t.phone)))})))),n("div",{class:"row"},n("label",{htmlFor:"verdocs-contact-picker-email"},"Email:"),n("input",{id:"verdocs-contact-picker-email",name:"verdocs-contact-picker-email",type:"text","data-lpignore":"true",autocomplete:"off",value:this.email,placeholder:"Email Address...",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.handleEmailChange(t)}})),n("div",{class:"row"},n("label",{htmlFor:"verdocs-contact-picker-phone"},"Phone:"),n("input",{id:"verdocs-contact-picker-phone",name:"verdocs-contact-picker-phone",type:"text","data-lpignore":"true",autocomplete:"off",value:this.phone,placeholder:"Phone Number...",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.handlePhoneChange(t)}})),this.showMessage&&n("div",{class:"row"},n("label",{htmlFor:"verdocs-contact-picker-message"},"Message:"),n("input",{id:"verdocs-contact-picker-message",name:"verdocs-contact-picker-message",type:"text","data-lpignore":"true",autocomplete:"off",value:this.message,placeholder:"Invitation Message...",onFocus:function(){return e.showSuggestions=false},onInput:function(t){return e.handleMessageChange(t)}})),n("div",{class:"buttons"},n("verdocs-toggle-button",{icon:i,size:"small",active:this.showMessage,onToggle:function(t){e.showMessage=t.detail.active;e.showSuggestions=false}}),n("verdocs-toggle-button",{icon:c,size:"small",active:this.delegator,onToggle:function(t){e.delegator=t.detail.active;e.showSuggestions=false}}),n("div",{class:"flex-fill"}),n("verdocs-button",{variant:"outline",label:"Cancel",size:"small",onPress:function(t){return e.handleCancel(t)}}),n("verdocs-button",{label:"OK",size:"small",onPress:function(t){return e.handleSubmit(t)}})))};return e}());l.style=s}}}));
-//# sourceMappingURL=p-42ee012b.system.entry.js.map

package/dist/verdocs-web-sdk/p-42ee012b.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/elements/verdocs-contact-picker/verdocs-contact-picker.scss?tag=verdocs-contact-picker","src/components/elements/verdocs-contact-picker/verdocs-contact-picker.tsx"],"names":["verdocsContactPickerCss","messageIcon","delegateIcon","placeholderIcon","VerdocsContactPicker","exports","VerdocsEndpoint","getDefault","class_1","prototype","componentWillLoad","this","templateRole","name","full_name","email","phone","delegator","message","showMessage","handleNameChange","e","target","value","_a","searchContacts","emit","query","handleEmailChange","handlePhoneChange","handleMessageChange","handleCancel","stopPropagation","showSuggestions","cancel","handleSubmit","contactSelected","handleSelectSuggestion","suggestion","render","_this","h","onSubmit","preventDefault","onClick","autocomplete","class","htmlFor","id","type","data-lpignore","placeholder","onFocus","contactSuggestions","length","onInput","map","key","avatar","alt","src","innerHTML","icon","size","active","onToggle","detail","variant","label","onPress"],"mappings":"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","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-contact-picker {\n  font-family: $verdocs-primary-font;\n\n  form {\n    background-color: $verdocs-grey-3;\n    padding: 12px;\n    display: flex;\n    flex-direction: column;\n\n    .row {\n      width: 300px;\n      display: flex;\n      position: relative;\n      margin: 0 0 20px 0;\n      flex-direction: column;\n    }\n\n    label {\n      display: block;\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0 0 4px 0;\n      color: $verdocs-bg-4;\n    }\n\n    input {\n      border: none;\n      font-size: 18px;\n      padding: 3px 6px 3px 0;\n      background: transparent;\n      border-bottom: 1px solid $verdocs-dark-blue;\n\n      &:focus {\n        outline: none;\n      }\n    }\n\n    .dropdown {\n      left: 0;\n      right: 0;\n      top: 49px;\n      z-index: 100;\n      position: absolute;\n      background: #ffffff;\n      box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);\n\n      .suggestion {\n        display: flex;\n        padding: 6px 12px;\n        align-items: center;\n        flex-direction: row;\n\n        svg {\n          fill: #666666;\n        }\n\n        .avatar {\n          width: 48px;\n          height: 48px;\n          flex: 0 0 48px;\n          margin-right: 8px;\n          border-radius: 100%;\n        }\n\n        .details {\n          display: flex;\n          flex-direction: column;\n        }\n\n        .name {\n          font-size: 16px;\n          font-weight: 500;\n          margin-bottom: 3px;\n          color: $verdocs-grey-0;\n        }\n\n        .destination {\n          font-size: 14px;\n          margin-bottom: 3px;\n          color: $verdocs-grey-1;\n        }\n\n        &:hover {\n          background: #eee;\n          cursor: pointer;\n        }\n      }\n    }\n  }\n\n  .buttons {\n    display: flex;\n    column-gap: 8px;\n    margin-top: 16px;\n    flex-direction: row;\n\n    .flex-fill {\n      flex: 1;\n    }\n  }\n\n  ::placeholder {\n    color: $verdocs-bg-2;\n  }\n}\n","import {VerdocsEndpoint} from '@verdocs/js-sdk';\nimport {IRole} from '@verdocs/js-sdk/Templates/Types';\nimport {Component, h, Event, EventEmitter, Prop, State} from '@stencil/core';\n\nconst messageIcon =\n  '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiBox-root css-1om0hkc\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\"><path d=\"M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z\"></path></svg>';\n\nconst delegateIcon =\n  '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-zjt8k\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"AssignmentIndIcon\" tabindex=\"-1\" title=\"AssignmentInd\"><path d=\"M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm0 4c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm6 12H6v-1.4c0-2 4-3.1 6-3.1s6 1.1 6 3.1V19z\"></path></svg>';\n\nconst placeholderIcon =\n  '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSvgIcon-root MuiSvgIcon-fontSizeLarge css-zjt8k\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"AccountCircleIcon\" tabindex=\"-1\" title=\"AccountCircle\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 4c1.93 0 3.5 1.57 3.5 3.5S13.93 13 12 13s-3.5-1.57-3.5-3.5S10.07 6 12 6zm0 14c-2.03 0-4.43-.82-6.14-2.88C7.55 15.8 9.68 15 12 15s4.45.8 6.14 2.12C16.43 19.18 14.03 20 12 20z\"></path></svg>';\n\nexport interface IContactSearchEvent {\n  // The text the user has entered in the search field\n  query: string;\n}\n\nexport interface IContactSelectEvent {\n  full_name: string;\n  email: string;\n  phone: string;\n  message: string;\n  delegator: boolean;\n}\n\nexport interface IEmailContact {\n  // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n  id?: any;\n\n  // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n  // `verdocs-contact-picker .avatar { display: none; }`\n  avatar?: string;\n\n  // The recipient's name, as it should be displayed to the user.\n  name: string;\n\n  // The email address for the contact.\n  email: string;\n\n  // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n  // notifications will be sent to both locations.\n  phone?: string;\n\n  [key: string]: any;\n}\n\nexport interface IPhoneContact {\n  // Optional but recommended. An internal identifier used to identify the contact in the calling system.\n  id?: any;\n\n  // The user's avatar. If not set, a placeholder will be shown. To hide avatars entirely, use CSS to set\n  // `verdocs-contact-picker .avatar { display: none; }`\n  avatar?: string;\n\n  // The recipient's name, as it should be displayed to the user.\n  name: string;\n\n  // The email address for the contact.\n  email?: string;\n\n  // An optional phone number for the contact. This number must be able SMS messages. If both email and phone are provided,\n  // notifications will be sent to both locations.\n  phone: string;\n\n  [key: string]: any;\n}\n\n/**\n * Displays a contact picker suitable for filling out Recipient objects when sending Documents.\n *\n * This picker can also be integrated with a backend to provide contact list / suggestion / address-book style behavior. As the\n * user interacts with the component, the text entered in the name field is sent back to the parent via the `searchContacts` event.\n * The parent can use that text as a query string to call a backend to obtain appropriate contacts to show. This list may also be\n * hard-coded ahead of time to provide the user with smart suggestions on initial display, such as \"Recently Used\" contacts, or\n * to always display the user's own contact record.\n */\n@Component({\n  tag: 'verdocs-contact-picker',\n  styleUrl: 'verdocs-contact-picker.scss',\n  shadow: false,\n})\nexport class VerdocsContactPicker {\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * The role that this contact will be assigned to.\n   */\n  @Prop() templateRole: IRole | null = null;\n\n  /**\n   * If set, suggestions will be displayed in a drop-down list to the user. It is recommended that the number\n   * of suggestions be limited to the 5 best matching records.\n   */\n  @Prop() contactSuggestions: (IEmailContact | IPhoneContact)[] = [];\n\n  /**\n   * Event fired when the user enters text in the search field. The calling application may use this to update\n   * the `contactSuggestions` property.\n   */\n  @Event({composed: true}) searchContacts: EventEmitter<IContactSearchEvent>;\n\n  /**\n   * Event fired when the user cancels the dialog.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired when the user changes the type.\n   */\n  @Event({composed: true}) contactSelected: EventEmitter<IContactSelectEvent>;\n\n  @State() name: string;\n  @State() email: string;\n  @State() phone: string;\n  @State() message: string;\n  @State() showSuggestions: boolean = false;\n  @State() showMessage: boolean = false;\n  @State() delegator: boolean = false;\n\n  componentWillLoad() {\n    if (this.templateRole) {\n      this.name = this.templateRole.full_name || '';\n      this.email = this.templateRole.email || '';\n      this.phone = this.templateRole.phone || '';\n      this.delegator = this.templateRole.delegator || false;\n      this.message = this.templateRole.message || '';\n      this.showMessage = this.message !== '';\n    }\n  }\n\n  handleNameChange(e: any) {\n    this.name = e.target.value;\n    this.searchContacts?.emit({query: this.name});\n  }\n\n  handleEmailChange(e: any) {\n    this.email = e.target.value;\n  }\n\n  handlePhoneChange(e: any) {\n    this.phone = e.target.value;\n  }\n\n  handleMessageChange(e: any) {\n    this.message = e.target.value;\n  }\n\n  handleCancel(e) {\n    e.stopPropagation();\n    this.showSuggestions = false;\n    this.cancel?.emit();\n  }\n\n  handleSubmit(e) {\n    e.stopPropagation();\n\n    this.showSuggestions = false;\n    this.contactSelected?.emit({\n      full_name: this.name,\n      email: this.email,\n      phone: this.phone,\n      message: this.message,\n      delegator: this.delegator,\n    });\n  }\n\n  handleSelectSuggestion(e: any, suggestion: IEmailContact | IPhoneContact) {\n    e.stopPropagation();\n\n    this.name = suggestion.name;\n    this.email = suggestion.email;\n    this.phone = suggestion.phone;\n    this.showSuggestions = false;\n  }\n\n  render() {\n    return (\n      <form onSubmit={e => e.preventDefault()} onClick={e => e.stopPropagation()} autocomplete=\"off\">\n        <div class=\"row\">\n          <label htmlFor=\"verdocs-contact-picker-name\">Name:</label>\n          <input\n            id=\"verdocs-contact-picker-name\"\n            name=\"verdocs-contact-picker-name\"\n            type=\"text\"\n            data-lpignore=\"true\"\n            autocomplete=\"off\"\n            value={this.name}\n            placeholder=\"Recipient Name...\"\n            onFocus={() => (this.showSuggestions = this.contactSuggestions?.length > 0)}\n            // onBlur={() => (this.showSuggestions = false)}\n            onInput={e => this.handleNameChange(e)}\n          />\n\n          {this.showSuggestions && (\n            <div class=\"dropdown\">\n              {this.contactSuggestions.map(suggestion => (\n                <div key={suggestion.id ?? suggestion.name} class=\"suggestion\" onClick={e => this.handleSelectSuggestion(e, suggestion)}>\n                  {suggestion.avatar ? <img alt=\"Avatar\" class=\"avatar\" src={suggestion.avatar} /> : <div class=\"avatar\" innerHTML={placeholderIcon} />}\n                  <div class=\"details\">\n                    <div class=\"name\">{suggestion.name}</div>\n                    {suggestion.email && <div class=\"destination\">{suggestion.email}</div>}\n                    {suggestion.phone && <div class=\"destination\">{suggestion.phone}</div>}\n                  </div>\n                </div>\n              ))}\n            </div>\n          )}\n        </div>\n\n        <div class=\"row\">\n          <label htmlFor=\"verdocs-contact-picker-email\">Email:</label>\n          <input\n            id=\"verdocs-contact-picker-email\"\n            name=\"verdocs-contact-picker-email\"\n            type=\"text\"\n            data-lpignore=\"true\"\n            autocomplete=\"off\"\n            value={this.email}\n            placeholder=\"Email Address...\"\n            onFocus={() => (this.showSuggestions = false)}\n            onInput={e => this.handleEmailChange(e)}\n          />\n        </div>\n\n        <div class=\"row\">\n          <label htmlFor=\"verdocs-contact-picker-phone\">Phone:</label>\n          <input\n            id=\"verdocs-contact-picker-phone\"\n            name=\"verdocs-contact-picker-phone\"\n            type=\"text\"\n            data-lpignore=\"true\"\n            autocomplete=\"off\"\n            value={this.phone}\n            placeholder=\"Phone Number...\"\n            onFocus={() => (this.showSuggestions = false)}\n            onInput={e => this.handlePhoneChange(e)}\n          />\n        </div>\n\n        {this.showMessage && (\n          <div class=\"row\">\n            <label htmlFor=\"verdocs-contact-picker-message\">Message:</label>\n            <input\n              id=\"verdocs-contact-picker-message\"\n              name=\"verdocs-contact-picker-message\"\n              type=\"text\"\n              data-lpignore=\"true\"\n              autocomplete=\"off\"\n              value={this.message}\n              placeholder=\"Invitation Message...\"\n              onFocus={() => (this.showSuggestions = false)}\n              onInput={e => this.handleMessageChange(e)}\n            />\n          </div>\n        )}\n\n        <div class=\"buttons\">\n          <verdocs-toggle-button\n            icon={messageIcon}\n            size=\"small\"\n            active={this.showMessage}\n            onToggle={e => {\n              this.showMessage = e.detail.active;\n              this.showSuggestions = false;\n            }}\n          />\n          <verdocs-toggle-button\n            icon={delegateIcon}\n            size=\"small\"\n            active={this.delegator}\n            onToggle={e => {\n              this.delegator = e.detail.active;\n              this.showSuggestions = false;\n            }}\n          />\n\n          <div class=\"flex-fill\" />\n\n          <verdocs-button variant=\"outline\" label=\"Cancel\" size=\"small\" onPress={e => this.handleCancel(e)} />\n          <verdocs-button label=\"OK\" size=\"small\" onPress={e => this.handleSubmit(e)} />\n        </div>\n      </form>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-46028ce3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["node_modules/@verdocs/js-sdk/Users/Auth.js","src/components/embeds/verdocs-auth/verdocs-auth.scss?tag=verdocs-auth","src/components/embeds/verdocs-auth/verdocs-auth.tsx"],"names":["authenticateUser","endpoint","params","api","post","then","r","data","verdocsAuthCss","VerdocsAuth","VerdocsEndpoint","getDefault","[object Object]","this","loadSession","session","console","log","isAuthenticated","activeSession","_a","authenticated","emit","_b","loggingIn","Auth.authenticateUser","username","password","setToken","accessToken","catch","e","response","JSON","stringify","sdkError","SDKError","message","_c","status","_d","_e","loginError","clearSession","visible","h","style","display","debug","class","label","disabled","onPress","handleLogout","displayMode","src","logo","alt","variant","onClick","onSubmit","handleLogin","autocomplete","value","onInput","target","type","justifyContent","margin","open","heading","onClosed","handleClearError"],"mappings":"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","sourcesContent":["/**\n * Authenticate to Verdocs via user/password authentication\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n * import {Transport} from '@verdocs/js-sdk/HTTP';\n *\n * const {accessToken} = await Auth.authenticateUser({ username: 'test@test.com', password: 'PASSWORD' });\n * Transport.setAuthToken(accessToken);\n * ```\n */\nexport var authenticateUser = function (endpoint, params) {\n    return endpoint.api //\n        .post('/authentication/login', params)\n        .then(function (r) { return r.data; });\n};\n/**\n * Authenticate to Verdocs via client ID / Secret authentication. **NOTE: This is only suitable for\n * NodeJS server-side applications. Never expose your Client Secret in a Web or Mobile app!** Also note\n * that access tokens may be cached by server-side apps (and this is recommended) but do expire after 2\n * hours. This expiration may change based on future security needs. Application developers are encouraged\n * to check the `exp` expiration field in the response accessToken and renew tokens after they expire.\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n * import {Transport} from '@verdocs/js-sdk/HTTP';\n *\n * const {accessToken} = await Auth.authenticateApp({ client_id: 'CLIENTID', client_secret: 'SECRET' });\n * Transport.setAuthToken(accessToken);\n * ```\n */\nexport var authenticateApp = function (endpoint, params) {\n    return endpoint.api //\n        .post('/authentication/login_client', {}, { headers: params })\n        .then(function (r) { return r.data; });\n};\n/**\n * Validate a token. Only Verdocs tokens will be accepted. Most applications can decode tokens locally,\n * because tokens will be validated when API calls are made anyway. However, high-security applications\n * may use this endpoint to check if a token has been revoked.\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n *\n * const {valid} = await Auth.validateToken({ token });\n * if (!valid) {\n *   window.alert('Session invalid or expired. Please re-authenticate.');\n * }\n * ```\n */\nexport var validateToken = function (endpoint, params) {\n    return endpoint.api //\n        .post('/token/isValid', params)\n        .then(function (r) { return r.data; });\n};\n/**\n * If called before the session expires, this will refresh the caller's session and tokens.\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n * import {Transport} from '@verdocs/js-sdk/HTTP';\n *\n * const {accessToken} = await Auth.refreshTokens();\n * Transport.setAuthToken(accessToken);\n * ```\n */\nexport var refreshTokens = function (endpoint) {\n    return endpoint.api //\n        .get('/token')\n        .then(function (r) { return r.data; });\n};\n/**\n * Update the caller's password. To help prevent CSRF attack vectors, the user's old password and email address are required.\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n *\n * const {status, message} = await Auth.updatePassword({ email, oldPassword, newPassword });\n * if (status !== 'OK') {\n *   window.alert(`Password reset error: ${message}`);\n * }\n * ```\n */\nexport var updatePassword = function (endpoint, params) {\n    return endpoint.api //\n        .put('/user/update_password', params)\n        .then(function (r) { return r.data; });\n};\n/**\n * Update the caller's email address.\n *\n * ```typescript\n * import {Auth} from '@verdocs/js-sdk/Auth';\n *\n * const {profiles} = await Auth.updateEmail({ email: newEmail });\n * ```\n */\nexport var updateEmail = function (endpoint, params) {\n    return endpoint.api //\n        .put('/user/update_email', params)\n        .then(function (r) { return r.data; });\n};\n","@import '../../../theme.scss';\n\nverdocs-auth {\n  font-family: $verdocs-primary-font;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  .login-form,\n  .signup-form {\n    background: $verdocs-grey-4;\n    align-items: center;\n    justify-content: center;\n    flex-direction: column;\n    display: flex;\n    padding: 20px;\n    width: 300px;\n    max-width: 100%;\n  }\n\n  .logo {\n    margin: 20px 0 30px;\n    width: 128px;\n    max-width: 100%;\n  }\n\n  h3 {\n    text-align: center;\n    font-weight: 400;\n    font-size: 16px;\n    line-height: 1.75;\n    margin: 0;\n  }\n\n  h4 {\n    text-align: center;\n    font-weight: 400;\n    font-size: 14px;\n    line-height: 1.43;\n    margin: 0;\n  }\n\n  .status-result {\n    display: none;\n\n    &.debug {\n      white-space: pre-wrap;\n      font-size: 14px;\n      background: #fff;\n      padding: 10px;\n      display: block;\n      flex-direction: row;\n      justify-content: center;\n    }\n  }\n\n  form {\n    width: 100%;\n  }\n\n  verdocs-text-input {\n    margin-bottom: 10px;\n  }\n}\n","import {Auth} from '@verdocs/js-sdk/Users';\nimport {Component, Prop, State, h, Event, EventEmitter} from '@stencil/core';\nimport {VerdocsEndpoint, TSession} from '@verdocs/js-sdk';\nimport {SDKError} from '../../../utils/errors';\n\nexport interface IAuthStatus {\n  authenticated: boolean;\n  session: TSession;\n}\n\n/**\n * Display an authentication dialog that allows the user to login or sign up. Callbacks are provided for events that\n * occur during the process (especially successful completion). The success callback will be fired immediately if the\n * user is already authenticated with a valid session, so this component may not always display visibly.\n *\n * To simplify some types of authentication flows, a visibility flag can force this component to never display. This\n * allows you to susbcribe to notifications from the\n *\n * This embed is responsive / mobile-friendly, but the calling application should provide at least a 300px wide\n * container to allow sufficient space for the required forms.\n *\n * As noted below, the primary event is `authenticated`. This will always be fired at least once, immediately after\n * the widget is rendered and the user's status has been checked. It may be fired again as the user completes (or\n * cancels) authentication steps.\n *\n * Authentication is required to demonstrate this Element. You may do this in Storybook by using the Auth\n * embed. This Element will reuse the same session produced by logging in via that Embed.\n *\n * ```typescript\n * interface IAuthStatus {\n *   // If true, the user is authenticated with a valid session\n *   authenticated: boolean;\n *\n *   // Details for the user's session\n *   session: IActiveSession | null;\n * }\n * ```\n */\n@Component({\n  tag: 'verdocs-auth',\n  styleUrl: 'verdocs-auth.scss',\n  shadow: false,\n})\nexport class VerdocsAuth {\n  /**\n   * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.\n   */\n  @Prop() endpoint: VerdocsEndpoint = VerdocsEndpoint.getDefault();\n\n  /**\n   * Normally, if the user has a valid session, this embed will be invisible, otherwise it will display\n   * login / signup forms. If this is set to false, this embed will be invisible in both cases. Apps may\n   * use this to verify if a user has a valid session without needing a separate call to Verdocs JS SDK.\n   */\n  @Prop() visible: boolean = true;\n\n  /**\n   * By default, a Verdocs logo will be displayed above the login/signup forms. This may be used to\n   * override its source. (Alternatively, you may simply hide it via CSS overrides.) Logos should be\n   * in SVG format for best results.\n   */\n  @Prop() logo: string = 'https://verdocs.com/assets/blue-logo.svg';\n\n  /**\n   * If the user is authenticated, this embed will normally render invisibly. If debug is set true, a summary\n   * if the user's session details will be displayed instead. This may be useful while debugging authentication\n   * flows in new applications.\n   */\n  @Prop() debug: boolean = false;\n\n  /**\n   * Event fired when session authentication process has completed. Check the event contents for completion status.\n   */\n  @Event({composed: true}) authenticated: EventEmitter<IAuthStatus>;\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  @State() isAuthenticated: boolean = false;\n  @State() displayMode: string = 'login';\n  @State() username: string = '';\n  @State() password: string = '';\n  @State() loggingIn: boolean = false;\n  @State() activeSession: TSession = null;\n  @State() loginError: string | null = null;\n\n  componentWillLoad() {\n    this.endpoint.loadSession();\n    if (this.endpoint.session) {\n      console.log('[AUTH] Authenticated');\n      this.isAuthenticated = true;\n      this.activeSession = this.endpoint.session;\n      this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n    } else {\n      console.log('[AUTH] Anonymous');\n      this.authenticated?.emit({authenticated: false, session: null});\n    }\n  }\n\n  handleLogin() {\n    this.loggingIn = true;\n    Auth.authenticateUser(this.endpoint, {username: this.username, password: this.password})\n      .then(r => {\n        this.loggingIn = false;\n        this.endpoint.setToken(r.accessToken);\n        this.activeSession = this.endpoint.session;\n        this.isAuthenticated = true;\n        this.authenticated?.emit({authenticated: true, session: this.endpoint.session});\n      })\n      .catch(e => {\n        console.log('[AUTH] Authentication error', e.response, JSON.stringify(e));\n        this.loggingIn = false;\n        this.activeSession = null;\n        this.authenticated?.emit({authenticated: false, session: null});\n        this.sdkError?.emit(new SDKError(e.message, e.response?.status, e.response?.data));\n\n        if (e?.response?.status === 403) {\n          this.loginError = 'Please check your username and password and try again.';\n        }\n      });\n  }\n\n  handleLogout() {\n    this.endpoint.clearSession();\n    this.isAuthenticated = false;\n    this.authenticated?.emit({authenticated: false, session: null});\n  }\n\n  handleClearError() {\n    this.loginError = null;\n  }\n\n  render() {\n    if (!this.visible) {\n      return <div style={{display: 'none'}}>Verdocs Auth Placeholder</div>;\n    }\n\n    if (this.isAuthenticated) {\n      if (this.debug) {\n        return (\n          <div class=\"status-result debug\">\n            <verdocs-button label=\"Logout\" disabled={this.loggingIn} onPress={() => this.handleLogout()} />\n          </div>\n        );\n      }\n\n      return <div class=\"status-result\">Authenticated</div>;\n    }\n\n    if (this.displayMode === 'signup') {\n      return (\n        <div class=\"signup-form\">\n          <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n          <h3>Sign up for an account</h3>\n          <h4>\n            Already have an account?\n            <verdocs-button label=\"Log In\" variant=\"text\" onClick={() => (this.displayMode = 'login')} disabled={this.loggingIn} />\n          </h4>\n\n          <form onSubmit={() => this.handleLogin()}>\n            <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n            <verdocs-text-input\n              label=\"Password\"\n              type=\"password\"\n              autocomplete=\"current-password\"\n              value={this.password}\n              onInput={(e: any) => (this.password = e.target.value)}\n              disabled={this.loggingIn}\n            />\n\n            <verdocs-button\n              label=\"Signup\"\n              disabled={this.loggingIn}\n              onPress={() => this.handleLogin()}\n              style={{display: 'flex', justifyContent: 'center', margin: '30px auto 0'}}\n            />\n          </form>\n        </div>\n      );\n    }\n\n    return (\n      <div class=\"login-form\">\n        <img src={this.logo} alt=\"Verdocs Logo\" class=\"logo\" />\n\n        <h3>Log in to your account</h3>\n        <h4>\n          Don't have an account?\n          <verdocs-button label=\"Sign Up\" variant=\"text\" onClick={() => (this.displayMode = 'signup')} disabled={this.loggingIn} />\n        </h4>\n\n        <form onSubmit={() => this.handleLogin()}>\n          <verdocs-text-input label=\"Email\" autocomplete=\"username\" value={this.username} onInput={(e: any) => (this.username = e.target.value)} disabled={this.loggingIn} />\n          <verdocs-text-input\n            label=\"Password\"\n            type=\"password\"\n            autocomplete=\"current-password\"\n            value={this.password}\n            onInput={(e: any) => (this.password = e.target.value)}\n            disabled={this.loggingIn}\n          />\n\n          <verdocs-button\n            label=\"Forgot Your Password?\"\n            variant=\"text\"\n            onClick={() => (this.displayMode = 'signup')}\n            disabled={this.loggingIn}\n            style={{display: 'flex', justifyContent: 'center', margin: '10px auto 20px'}}\n          />\n\n          <verdocs-button label=\"Login\" disabled={this.loggingIn} onPress={() => this.handleLogin()} style={{display: 'flex', justifyContent: 'center', margin: '10px auto 0'}} />\n        </form>\n\n        {this.loginError ? <verdocs-ok-dialog open={true} heading=\"Login Error\" message={this.loginError} onClosed={() => this.handleClearError()} /> : <div />}\n      </div>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-476f20a0.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as s,H as o}from"./p-ff1278ed.js";const a=`<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#ffffff"><rect fill="none" height="24" width="24"/><g><path d="M4,13c1.1,0,2-0.9,2-2c0-1.1-0.9-2-2-2s-2,0.9-2,2C2,12.1,2.9,13,4,13z M5.13,14.1C4.76,14.04,4.39,14,4,14 c-0.99,0-1.93,0.21-2.78,0.58C0.48,14.9,0,15.62,0,16.43V18l4.5,0v-1.61C4.5,15.56,4.73,14.78,5.13,14.1z M20,13c1.1,0,2-0.9,2-2 c0-1.1-0.9-2-2-2s-2,0.9-2,2C18,12.1,18.9,13,20,13z M24,16.43c0-0.81-0.48-1.53-1.22-1.85C21.93,14.21,20.99,14,20,14 c-0.39,0-0.76,0.04-1.13,0.1c0.4,0.68,0.63,1.46,0.63,2.29V18l4.5,0V16.43z M16.24,13.65c-1.17-0.52-2.61-0.9-4.24-0.9 c-1.63,0-3.07,0.39-4.24,0.9C6.68,14.13,6,15.21,6,16.39V18h12v-1.61C18,15.21,17.32,14.13,16.24,13.65z M8.07,16 c0.09-0.23,0.13-0.39,0.91-0.69c0.97-0.38,1.99-0.56,3.02-0.56s2.05,0.18,3.02,0.56c0.77,0.3,0.81,0.46,0.91,0.69H8.07z M12,8 c0.55,0,1,0.45,1,1s-0.45,1-1,1s-1-0.45-1-1S11.45,8,12,8 M12,6c-1.66,0-3,1.34-3,3c0,1.66,1.34,3,3,3s3-1.34,3-3 C15,7.34,13.66,6,12,6L12,6z"/></g></svg>`;const i='verdocs-organization-card{font-family:"Barlow", sans-serif;width:242px;position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}verdocs-organization-card:hover>.popup{display:-ms-flexbox;display:flex;background:#ffffff;color:#33354c}verdocs-organization-card .icon{-ms-flex:0;flex:0;margin:0 7px 0 0}verdocs-organization-card .icon svg{fill:#aeb4bf;width:24px;margin-bottom:-5px}verdocs-organization-card .popup{position:absolute;top:-1px;left:-4px;display:none;border:1px solid #1e2031;border-radius:10px;width:326px;height:220px;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:space-evenly;justify-content:space-evenly;font-family:sans-serif}verdocs-organization-card .popup-header{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;width:242px;height:69px;-ms-flex-pack:justify;justify-content:space-between;font-size:21px;color:#4c56cb}verdocs-organization-card .popup-body{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;width:256.2px;height:95px;-ms-flex-pack:space-evenly;justify-content:space-evenly;font-size:13px;text-transform:uppercase}verdocs-organization-card .popup-body span{display:block;-ms-flex:2 80px;flex:2 80px;margin-left:7px}verdocs-organization-card .popup-body span:last-child{margin-top:5px}verdocs-organization-card .status{width:29px;height:29px;background-color:#aeb4bf;border-radius:50%}';const n=class{constructor(s){e(this,s);this.organization=undefined}render(){console.log("org",JSON.stringify(this.organization,null,2));return s(o,null,s("span",{class:"icon",innerHTML:a}),s("span",{class:"content"},this.organization.name),s("div",{class:"popup"},s("div",{class:"popup-header"},s("span",{class:"status"}),s("span",{class:"title"},this.organization.name)),s("div",{class:"popup-body"},s("span",{class:"joined"},s("b",null,"Joined")," ","Jan 1 2022"),s("span",{class:"followers"},s("b",null,"Followers")," 57"),s("span",{class:"website"},s("b",null,"Website")),s("span",{class:"templates"},s("b",null,"Templates")," 7"),s("span",null,"https://www.google.com"))))}};n.style=i;export{n as verdocs_organization_card};
-//# sourceMappingURL=p-476f20a0.entry.js.map

package/dist/verdocs-web-sdk/p-476f20a0.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/controls/verdocs-organization-card/verdocs-organization-card.scss?tag=verdocs-organization-card","src/components/controls/verdocs-organization-card/verdocs-organization-card.tsx"],"names":["verdocsOrganizationCardCss","VerdocsOrganizationCard","[object Object]","console","log","JSON","stringify","this","organization","h","Host","class","innerHTML","UserGroup","name"],"mappings":"okCAAA,MAAMA,EAA6B,8iDCWtBC,EAAuB,2DAMlCC,SACEC,QAAQC,IAAI,MAAOC,KAAKC,UAAUC,KAAKC,aAAc,KAAM,IAC3D,OACEC,EAACC,EAAI,KACHD,EAAA,OAAA,CAAME,MAAM,OAAOC,UAAWC,IAE9BJ,EAAA,OAAA,CAAME,MAAM,WAAWJ,KAAKC,aAAaM,MAEzCL,EAAA,MAAA,CAAKE,MAAM,SACTF,EAAA,MAAA,CAAKE,MAAM,gBACTF,EAAA,OAAA,CAAME,MAAM,WACZF,EAAA,OAAA,CAAME,MAAM,SAASJ,KAAKC,aAAaM,OAEzCL,EAAA,MAAA,CAAKE,MAAM,cACTF,EAAA,OAAA,CAAME,MAAM,UACVF,EAAA,IAAA,KAAA,UAAa,IAAE,cAEjBA,EAAA,OAAA,CAAME,MAAM,aACVF,EAAA,IAAA,KAAA,aAAgB,OAElBA,EAAA,OAAA,CAAME,MAAM,WACVF,EAAA,IAAA,KAAA,YAEFA,EAAA,OAAA,CAAME,MAAM,aACVF,EAAA,IAAA,KAAA,aAAgB,MAElBA,EAAA,OAAA,KAAA","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-organization-card {\n  font-family: $primary-font;\n  width: 242px;\n  position: relative;\n  display: flex;\n  flex-direction: row;\n\n  &:hover > .popup {\n    display: flex;\n    background: #ffffff;\n    color: $medium-bg;\n  }\n\n  .icon {\n    flex: 0;\n    margin: 0 7px 0 0;\n\n    svg {\n      fill: $icon-color;\n      width: 24px;\n      margin-bottom: -5px;\n    }\n  }\n\n  .popup {\n    position: absolute;\n    top: -1px;\n    left: -4px;\n    display: none;\n    border: 1px solid $dark-bg;\n    border-radius: 10px;\n    width: 326px;\n    height: 220px;\n    flex-direction: column;\n    flex-wrap: nowrap;\n    align-items: center;\n    justify-content: space-evenly;\n    font-family: sans-serif;\n  }\n\n  .popup-header {\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    width: 242px;\n    height: 69px;\n    justify-content: space-between;\n    font-size: 21px;\n    color: $secondary-color;\n  }\n\n  .popup-body {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    width: 256.2px;\n    height: 95px;\n    justify-content: space-evenly;\n    font-size: 13px;\n    text-transform: uppercase;\n\n    span {\n      display: block;\n      flex: 2 80px;\n      margin-left: 7px;\n\n      &:last-child {\n        margin-top: 5px;\n      }\n    }\n  }\n\n  .status {\n    width: 29px;\n    height: 29px;\n    background-color: $icon-color;\n    border-radius: 50%;\n  }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\nimport {IOrganization} from '@verdocs/js-sdk/Organizations/Types';\nimport UserGroup from './user-group.svg';\n\n/**\n * Display a pop-up describing the company that was hovered over\n */\n@Component({\n  tag: 'verdocs-organization-card',\n  styleUrl: 'verdocs-organization-card.scss',\n})\nexport class VerdocsOrganizationCard {\n  /**\n   * The organization to display\n   */\n  @Prop() organization: IOrganization;\n\n  render() {\n    console.log('org', JSON.stringify(this.organization, null, 2));\n    return (\n      <Host>\n        <span class=\"icon\" innerHTML={UserGroup} />\n\n        <span class=\"content\">{this.organization.name}</span>\n\n        <div class=\"popup\">\n          <div class=\"popup-header\">\n            <span class=\"status\" />\n            <span class=\"title\">{this.organization.name}</span>\n          </div>\n          <div class=\"popup-body\">\n            <span class=\"joined\">\n              <b>Joined</b> {'Jan 1 2022'}\n            </span>\n            <span class=\"followers\">\n              <b>Followers</b> 57\n            </span>\n            <span class=\"website\">\n              <b>Website</b>\n            </span>\n            <span class=\"templates\">\n              <b>Templates</b> 7\n            </span>\n            <span>https://www.google.com</span>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-48321abf.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/elements/verdocs-field-textarea/verdocs-field-textarea.scss?tag=verdocs-field-textarea","src/components/elements/verdocs-field-textarea/verdocs-field-textarea.tsx"],"names":["verdocsFieldTextareaCss","settingsIcon","VerdocsFieldTextarea","exports","class_1","prototype","focusField","this","focused","el","focus","fieldFocus","emit","handleBlur","fieldBlur","handleFocus","handleChange","e","fieldChange","target","value","handleInput","fieldInput","render","_this","settings","getFieldSettings","field","disabled","_b","_a","backgroundColor","getRGBA","roleindex","h","Host","class","required","style","placeholder","tabIndex","order","ref","onBlur","onFocus","onChange","onInput","editable","icon","label","options","onFieldChange","console","log"],"mappings":"+qDAAA,IAAMA,EAA0B,2yBCMhC,IAAMC,EACJ,6rCAUWC,EAAoBC,EAAA,yBAAA,0MAMyB,4CAU3B,oBAMA,oBAKA,qBA2BA,eAEV,MAEHC,EAAAC,UAAAC,WAAN,gGACRC,KAAKC,QAAU,KACfD,KAAKE,GAAGC,QACRH,KAAKI,WAAWC,KAAK,uBAGvBR,EAAAC,UAAAQ,WAAA,WACEN,KAAKC,QAAU,MACfD,KAAKO,UAAUF,KAAK,OAGtBR,EAAAC,UAAAU,YAAA,WACER,KAAKC,QAAU,KACfD,KAAKI,WAAWC,KAAK,OAGvBR,EAAAC,UAAAW,aAAA,SAAaC,GACXV,KAAKW,YAAYN,KAAKK,EAAEE,OAAOC,QAGjChB,EAAAC,UAAAgB,YAAA,SAAYJ,GACVV,KAAKe,WAAWV,KAAKK,EAAEE,OAAOC,QAGhChB,EAAAC,UAAAkB,OAAA,WAAA,IAAAC,EAAAjB,aACE,IAAMkB,EAAWC,EAAiBnB,KAAKoB,OACvC,IAAMC,GAAWC,GAAAC,EAAAvB,KAAKqB,YAAQ,MAAAE,SAAA,EAAAA,EAAIL,EAASG,YAAQ,MAAAC,SAAA,EAAAA,EAAI,MACvD,IAAME,EAAkBxB,KAAKoB,MAAM,SAAWK,EAAQzB,KAAK0B,WAE3D,OACEC,EAACC,EAAI,CAACC,MAAO,CAAC5B,QAASD,KAAKC,QAAS6B,SAAUZ,EAASY,SAAUT,SAAQA,GAAGU,MAAO,CAACP,gBAAeA,IAClGG,EAAA,WAAA,CACEK,YAAad,EAASc,aAAe,GACrCC,SAAUf,EAASgB,MACnBrB,MAAOK,EAASL,MAChBQ,SAAUA,EACVS,SAAUZ,EAASY,SACnBK,IAAK,SAAAjC,GAAE,OAAKe,EAAKf,GAAKA,GACtBkC,OAAQ,WAAM,OAAAnB,EAAKX,cACnB+B,QAAS,WAAM,OAAApB,EAAKT,eACpB8B,SAAU,SAAA5B,GAAK,OAAAO,EAAKR,aAAaC,IACjC6B,QAAS,SAAA7B,GAAK,OAAAO,EAAKH,YAAYJ,MAGhCV,KAAKwC,UACJb,EAAA,uBAAA,CAAsBc,KAAM/C,GAC1BiC,EAAA,KAAA,KAAA,kBACAA,EAAA,OAAA,KACEA,EAAA,uBAAA,CACEe,MAAM,YACNC,QAAS,CACP,CAACD,MAAO,QAAS7B,MAAO,SACxB,CAAC6B,MAAO,SAAU7B,MAAO,WAE3B+B,cAAe,SAAAlC,GACbmC,QAAQC,IAAI,iBAAkBpC,MAIlCiB,EAAA,qBAAA,CAAoBe,MAAM,aAAa7B,MAAM,GAAGmB,YAAY,uBAAuBO,QAAS,SAAA7B,GAAK,OAAAmC,QAAQC,IAAI,MAAOpC,MACpHiB,EAAA,qBAAA,CAAoBe,MAAM,cAAc7B,MAAM,GAAGmB,YAAY,sBAAsBO,QAAS,SAAA7B,GAAK,OAAAmC,QAAQC,IAAI,MAAOpC,mBAtHjG","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-field-textarea {\n  font-family: $verdocs-primary-font;\n  width: 150px;\n  height: 15px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  background-color: transparent;\n  transform-origin: bottom left;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  textarea {\n    box-sizing: border-box;\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    border: 1px solid rgba(0, 0, 0, 0.2);\n\n    &.hide {\n      display: none;\n    }\n  }\n\n  &.required {\n    border: 1px solid rgb(204, 0, 0);\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.75s 2;\n  }\n}\n","import {Component, h, Host, Prop, Event, EventEmitter, State, Method} from '@stencil/core';\nimport {IDocumentField, IRecipient} from '@verdocs/js-sdk/Documents/Types';\nimport {ITemplateField} from '@verdocs/js-sdk/Templates/Types';\nimport {getFieldSettings} from '../../../utils/utils';\nimport {getRGBA} from '@verdocs/js-sdk/Utils/Colors';\n\nconst settingsIcon =\n  '<svg xmlns=\"http://www.w3.org/2000/svg\" height=\"20\" width=\"20\"><path d=\"m7.5 18.5-.312-2.667q-.188-.125-.396-.25-.209-.125-.396-.229l-2.479 1.063-2.521-4.334 2.125-1.625q.021-.104.021-.229v-.458q0-.125-.021-.229L1.396 7.917l2.521-4.313 2.5 1.042q.166-.104.375-.229.208-.125.396-.229L7.5 1.5h5l.312 2.688q.188.104.396.229.209.125.396.229l2.479-1.042 2.521 4.313-2.125 1.625v.916l2.125 1.625-2.521 4.334-2.5-1.063q-.166.104-.375.229-.208.125-.396.25L12.5 18.5Zm2.479-5.521q1.229 0 2.104-.875T12.958 10q0-1.229-.875-2.104t-2.104-.875q-1.208 0-2.094.875Q7 8.771 7 10t.885 2.104q.886.875 2.094.875Zm0-1.75q-.5 0-.864-.364Q8.75 10.5 8.75 10t.365-.865q.364-.364.864-.364t.865.364q.364.365.364.865t-.364.865q-.365.364-.865.364ZM10.021 10Zm-.792 6.521h1.542l.25-2.146q.625-.167 1.198-.51.573-.344 1.031-.823l2.021.854.771-1.271-1.771-1.354q.104-.292.156-.615.052-.323.052-.656 0-.292-.052-.604-.052-.313-.135-.646l1.77-1.375-.77-1.271-2.021.875q-.479-.5-1.042-.833-.562-.334-1.187-.5l-.271-2.167H9.208l-.25 2.167q-.625.166-1.187.5-.563.333-1.042.812l-2-.854-.771 1.271 1.73 1.354q-.084.333-.136.656Q5.5 9.708 5.5 10t.052.604q.052.313.136.667l-1.73 1.354.771 1.271 2-.834q.479.459 1.042.792.562.334 1.187.5Z\"/></svg>';\n\n/**\n * Display a multi-line text input field.\n */\n@Component({\n  tag: 'verdocs-field-textarea',\n  styleUrl: 'verdocs-field-textarea.scss',\n  shadow: false,\n})\nexport class VerdocsFieldTextarea {\n  private el: HTMLTextAreaElement;\n\n  /**\n   * The document or template field to display.\n   */\n  @Prop() field: IDocumentField | ITemplateField | null = null;\n\n  /**\n   * The recipient completing the form, if known.\n   */\n  @Prop() recipient?: IRecipient;\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() disabled?: boolean = false;\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() 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() moveable?: boolean = false;\n\n  /**\n   * Event fired when the input field loses focus.\n   */\n  @Event({composed: true}) fieldFocus: EventEmitter<boolean>;\n\n  /**\n   * Event fired when the input field gains focus.\n   */\n  @Event({composed: true}) fieldBlur: EventEmitter<boolean>;\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 on every character entered into / deleted from the field.\n   */\n  @Event({composed: true}) fieldInput: EventEmitter<string>;\n\n  /**\n   * If set, the field will be colored using this index value to select the background color.\n   */\n  @Prop() roleindex?: number = 0;\n\n  @State() focused = false;\n\n  @Method() async focusField() {\n    this.focused = true;\n    this.el.focus();\n    this.fieldFocus.emit(true);\n  }\n\n  handleBlur() {\n    this.focused = false;\n    this.fieldBlur.emit(true);\n  }\n\n  handleFocus() {\n    this.focused = true;\n    this.fieldFocus.emit(true);\n  }\n\n  handleChange(e: any) {\n    this.fieldChange.emit(e.target.value);\n  }\n\n  handleInput(e: any) {\n    this.fieldInput.emit(e.target.value);\n  }\n\n  render() {\n    const settings = getFieldSettings(this.field);\n    const disabled = this.disabled ?? settings.disabled ?? false;\n    const backgroundColor = this.field['rgba'] || getRGBA(this.roleindex);\n\n    return (\n      <Host class={{focused: this.focused, required: settings.required, disabled}} style={{backgroundColor}}>\n        <textarea\n          placeholder={settings.placeholder || ''}\n          tabIndex={settings.order}\n          value={settings.value}\n          disabled={disabled}\n          required={settings.required}\n          ref={el => (this.el = el)}\n          onBlur={() => this.handleBlur()}\n          onFocus={() => this.handleFocus()}\n          onChange={e => this.handleChange(e)}\n          onInput={e => this.handleInput(e)}\n        />\n\n        {this.editable && (\n          <verdocs-button-panel icon={settingsIcon}>\n            <h6>Field Settings</h6>\n            <form>\n              <verdocs-select-input\n                label=\"Recipient\"\n                options={[\n                  {label: 'Buyer', value: 'Buyer'},\n                  {label: 'Seller', value: 'Seller'},\n                ]}\n                onFieldChange={e => {\n                  console.log('select changed', e);\n                }}\n              />\n\n              <verdocs-text-input label=\"Field Name\" value=\"\" placeholder=\"Stored field name...\" onInput={e => console.log('ipt', e)} />\n              <verdocs-text-input label=\"Placeholder\" value=\"\" placeholder=\"Placeholder text...\" onInput={e => console.log('ipt', e)} />\n            </form>\n          </verdocs-button-panel>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-4b89126c.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as s,h as o,H as r}from"./p-ff1278ed.js";import"./p-8efc9749.js";import{V as t}from"./p-10d804cf.js";import{r as i,a}from"./p-7ce27ce2.js";import{s as n}from"./p-8fd9dc5a.js";import{l as d}from"./p-8cb4e511.js";import{S as l}from"./p-7a1b2643.js";import"./p-6de53dcc.js";import"./p-d534fffb.js";const c="";const p=class{constructor(o){e(this,o);this.sdkError=s(this,"sdkError",7);this.endpoint=t.getDefault();this.templateId=null}async componentDidLoad(){var e,s,o;this.endpoint.loadSession();if(!this.templateId){console.log(`[PREVIEW] Missing required template ID ${this.templateId}`);return}try{console.log(`[PREVIEW] Loading template ${this.templateId}`);await d(this.endpoint,this.templateId)}catch(r){console.log("[PREVIEW] Error loading template",r);(e=this.sdkError)===null||e===void 0?void 0:e.emit(new l(r.message,(s=r.response)===null||s===void 0?void 0:s.status,(o=r.response)===null||o===void 0?void 0:o.data))}}async handleFieldChange(e,s,o){console.log("[PREVIEW] handleFieldChange",e,s,o)}handlePageRendered(e){const s=e.detail;console.log("[PREVIEW] Page rendered",s);const o=n.fields.filter((e=>e.page_sequence===s.renderedPage.pageNumber));console.log("[PREVIEW] Fields on page",o);o.forEach((e=>i(e,s.renderedPage,a(n.roleNames,e.role_name),this.handleFieldChange,true)))}render(){if(n.loading){return o(r,null,o("verdocs-loader",null))}return o(r,null,n.template?o("div",{class:"inner"},o("verdocs-view",{templateId:this.templateId,endpoint:this.endpoint,onPageRendered:e=>this.handlePageRendered(e),pageLayers:[{name:"page",type:"canvas"},{name:"controls",type:"div"}]})):o("div",null,"Error loading Template. Please try again later."))}};p.style=c;export{p as verdocs_preview};
-//# sourceMappingURL=p-4b89126c.entry.js.map

package/dist/verdocs-web-sdk/p-513168f7.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as s,h as t,H as o}from"./p-ff1278ed.js";const i='verdocs-checkbox{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;width:20px;height:20px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:100%}verdocs-checkbox.disabled{opacity:0.5}verdocs-checkbox.hide{display:none}verdocs-checkbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}verdocs-checkbox input[type=checkbox]{width:18px;height:18px}';const c=class{constructor(t){e(this,t);this.selected=s(this,"selected",7);this.checked=false;this.name="";this.value="";this.disabled=false}handleChange(e){console.log("changed",e.target.checked);this.selected.emit({value:this.value})}render(){return t(o,{class:{disabled:this.disabled}},t("input",{type:"checkbox",value:this.value,name:this.name,id:`verdocs-checkbox-${this.name}-${this.value}`,checked:this.checked,disabled:this.disabled,onChange:e=>this.handleChange(e)}))}};c.style=i;export{c as verdocs_checkbox};
-//# sourceMappingURL=p-513168f7.entry.js.map

package/dist/verdocs-web-sdk/p-513168f7.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/controls/verdocs-checkbox/verdocs-checkbox.scss?tag=verdocs-checkbox","src/components/controls/verdocs-checkbox/verdocs-checkbox.tsx"],"names":["verdocsCheckboxCss","VerdocsCheckbox","[object Object]","e","console","log","target","checked","this","selected","emit","value","h","Host","class","disabled","type","name","id","onChange","handleChange"],"mappings":"yDAAA,MAAMA,EAAqB,4hBCYdC,EAAe,+EAIC,gBAKJ,cAKC,iBAKK,MAS7BC,aAAaC,GACXC,QAAQC,IAAI,UAAWF,EAAEG,OAAOC,SAChCC,KAAKC,SAASC,KAAK,CAACC,MAAOH,KAAKG,QAGlCT,SACE,OACEU,EAACC,EAAI,CAACC,MAAO,CAACC,SAAUP,KAAKO,WAC3BH,EAAA,QAAA,CACEI,KAAK,WACLL,MAAOH,KAAKG,MACZM,KAAMT,KAAKS,KACXC,GAAI,oBAAoBV,KAAKS,QAAQT,KAAKG,QAC1CJ,QAASC,KAAKD,QACdQ,SAAUP,KAAKO,SACfI,SAAUhB,GAAKK,KAAKY,aAAajB","sourcesContent":["@import '../../../theme.scss';\n\n// See https://www.sliderrevolution.com/resources/styling-radio-buttons/\nverdocs-checkbox {\n  font-family: $verdocs-primary-font;\n  width: 20px;\n  height: 20px;\n  display: block;\n  font-size: 11px;\n  position: relative;\n  background-color: transparent;\n  transform-origin: bottom left;\n  border-radius: 100%;\n\n  &.disabled {\n    opacity: 0.5;\n  }\n\n  &.hide {\n    display: none;\n  }\n\n  &.focused {\n    animation: verdocs-field-pulse 0.75s 2;\n  }\n\n  input[type='checkbox'] {\n    width: 18px;\n    height: 18px;\n  }\n}\n","import {Component, h, Host, Prop, Event, EventEmitter} from '@stencil/core';\n\n/**\n * Displays a radio button. Note that this is different from the `verdocs-field-radio-button` component, which is designed\n * to be used in signing experiences and contains settings that connect to template fields. This is just a simple radio\n * button for UI displays e.g. dialogs and .\n */\n@Component({\n  tag: 'verdocs-checkbox',\n  styleUrl: 'verdocs-checkbox.scss',\n  shadow: false,\n})\nexport class VerdocsCheckbox {\n  /**\n   * Whether the radio button is currently selected.\n   */\n  @Prop() checked: boolean = false;\n\n  /**\n   * HTML form field name for the input.\n   */\n  @Prop() name: string = '';\n\n  /**\n   * Value to track with the input.\n   */\n  @Prop() value: string = '';\n\n  /**\n   * If set, the button will still be displayed but not selectable.\n   */\n  @Prop() disabled?: boolean = false;\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}) selected: EventEmitter<{value: string}>;\n\n  handleChange(e: any) {\n    console.log('changed', e.target.checked);\n    this.selected.emit({value: this.value});\n  }\n\n  render() {\n    return (\n      <Host class={{disabled: this.disabled}}>\n        <input\n          type=\"checkbox\"\n          value={this.value}\n          name={this.name}\n          id={`verdocs-checkbox-${this.name}-${this.value}`}\n          checked={this.checked}\n          disabled={this.disabled}\n          onChange={e => this.handleChange(e)}\n        />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-51353418.system.entry.js

@@ -1,2 +0,0 @@
-System.register(["./p-97329951.system.js"],(function(t){"use strict";var e,i,o,n;return{setters:[function(t){e=t.r;i=t.c;o=t.h;n=t.H}],execute:function(){var s='verdocs-toggle-button{font-family:"Barlow", sans-serif}verdocs-toggle-button button{border:none;cursor:pointer;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:center;justify-content:center;background:#cccccc;color:#33364b}verdocs-toggle-button button svg{max-width:100%;max-height:100%;fill:#33364b}verdocs-toggle-button button.active{background:#55bc81;color:#f5f5fa}verdocs-toggle-button button.active svg{fill:#f5f5fa}verdocs-toggle-button.size-normal button{width:40px;height:40px;padding:6px;border-radius:4px}verdocs-toggle-button.size-small button{width:34px;height:34px;padding:4px;border-radius:2px}';var c=t("verdocs_toggle_button",function(){function t(t){e(this,t);this.toggle=i(this,"toggle",7);this.active=false;this.icon=null;this.label=null;this.size="normal";this._active=false}t.prototype.componentWillLoad=function(){this._active=this.active};t.prototype.handleToggle=function(t){var e;t.stopPropagation();var i=!this._active;this._active=i;(e=this.toggle)===null||e===void 0?void 0:e.emit({active:i})};t.prototype.render=function(){var t=this;return o(n,{class:"size-".concat(this.size)},this.icon?o("button",{innerHTML:this.icon,class:{active:this._active},onClick:function(e){return t.handleToggle(e)}}):o("button",{class:{active:this._active},onClick:function(e){return t.handleToggle(e)}},this.label))};return t}());c.style=s}}}));
-//# sourceMappingURL=p-51353418.system.entry.js.map

package/dist/verdocs-web-sdk/p-51353418.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/controls/verdocs-toggle-button/verdocs-toggle-button.scss?tag=verdocs-toggle-button","src/components/controls/verdocs-toggle-button/verdocs-toggle-button.tsx"],"names":["verdocsToggleButtonCss","VerdocsToggleButton","exports","class_1","prototype","componentWillLoad","this","_active","active","handleToggle","e","stopPropagation","newState","_a","toggle","emit","render","_this","h","Host","class","concat","size","icon","innerHTML","onClick","label"],"mappings":"0JAAA,IAAMA,EAAyB,6pBCSlBC,EAAmBC,EAAA,wBAAA,8EACb,gBAKc,gBAKC,eAKI,sBAOjB,MAEnBC,EAAAC,UAAAC,kBAAA,WACEC,KAAKC,QAAUD,KAAKE,QAGtBL,EAAAC,UAAAK,aAAA,SAAaC,SACXA,EAAEC,kBAEF,IAAMC,GAAYN,KAAKC,QACvBD,KAAKC,QAAUK,GACfC,EAAAP,KAAKQ,UAAM,MAAAD,SAAA,OAAA,EAAAA,EAAEE,KAAK,CAACP,OAAQI,KAG7BT,EAAAC,UAAAY,OAAA,WAAA,IAAAC,EAAAX,KACE,OACEY,EAACC,EAAI,CAACC,MAAO,QAAAC,OAAQf,KAAKgB,OACvBhB,KAAKiB,KACJL,EAAA,SAAA,CAAQM,UAAWlB,KAAKiB,KAAMH,MAAO,CAACZ,OAAQF,KAAKC,SAAUkB,QAAS,SAAAf,GAAK,OAAAO,EAAKR,aAAaC,MAE7FQ,EAAA,SAAA,CAAQE,MAAO,CAACZ,OAAQF,KAAKC,SAAUkB,QAAS,SAAAf,GAAK,OAAAO,EAAKR,aAAaC,KACpEJ,KAAKoB,kBA5Cc","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-toggle-button {\n  font-family: $primary-font;\n\n  button {\n    border: none;\n    cursor: pointer;\n    align-items: center;\n    display: inline-flex;\n    justify-content: center;\n    background: $verdocs-bg-1;\n    color: $verdocs-dark-blue;\n\n    svg {\n      max-width: 100%;\n      max-height: 100%;\n      fill: $verdocs-dark-blue;\n    }\n\n    &.active {\n      background: $verdocs-green;\n      color: $verdocs-grey-3;\n\n      svg {\n        fill: $verdocs-grey-3;\n      }\n    }\n  }\n\n  &.size-normal button {\n    width: 40px;\n    height: 40px;\n    padding: 6px;\n    border-radius: 4px;\n  }\n\n  &.size-small button {\n    width: 34px;\n    height: 34px;\n    padding: 4px;\n    border-radius: 2px;\n  }\n}\n","import {Component, Prop, h, State, Event, EventEmitter, Host} from '@stencil/core';\n\n/**\n * Displays a single button that can be toggled on or off by clicking it.\n */\n@Component({\n  tag: 'verdocs-toggle-button',\n  styleUrl: 'verdocs-toggle-button.scss',\n})\nexport class VerdocsToggleButton {\n  @Prop() active = false;\n\n  /**\n   * If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n   */\n  @Prop() icon?: string | null = null;\n\n  /**\n   * If set, should be an SVG object. This will be rendered as the button's visible element. If icon is supplied, label is ignored.\n   */\n  @Prop() label?: string | null = null;\n\n  /**\n   * How large the button should be. Small buttons are intended for dialog boxes and other smaller scale UI regions.\n   */\n  @Prop() size?: 'small' | 'normal' = 'normal';\n\n  /**\n   * Event fired when the button is pressed.\n   */\n  @Event({composed: true}) toggle!: EventEmitter<{active: boolean}>;\n\n  @State() _active = false;\n\n  componentWillLoad() {\n    this._active = this.active;\n  }\n\n  handleToggle(e: any) {\n    e.stopPropagation();\n\n    const newState = !this._active;\n    this._active = newState;\n    this.toggle?.emit({active: newState});\n  }\n\n  render() {\n    return (\n      <Host class={`size-${this.size}`}>\n        {this.icon ? (\n          <button innerHTML={this.icon} class={{active: this._active}} onClick={e => this.handleToggle(e)} />\n        ) : (\n          <button class={{active: this._active}} onClick={e => this.handleToggle(e)}>\n            {this.label}\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-52179311.entry.js

@@ -1,2 +0,0 @@
-import{r as i,c as t,h as s,H as e}from"./p-ff1278ed.js";const o='verdocs-initial-dialog{font-family:"Barlow", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box;display:none}verdocs-initial-dialog.open{display:block}verdocs-initial-dialog .background-overlay{position:absolute;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:#0000007f}verdocs-initial-dialog .dialog{width:100%;max-width:340px;border-radius:4px;overflow:hidden;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);background:#f9f9f9}verdocs-initial-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding:20px 20px 0 20px;line-height:28px;font-size:20px;font-weight:500}verdocs-initial-dialog .content{font-size:14px;padding:20px}verdocs-initial-dialog .buttons{display:-ms-flexbox;display:flex;margin:20px 0 0 0;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;-ms-flex-align:center;align-items:center}verdocs-initial-dialog .buttons verdocs-button{margin-left:16px}verdocs-initial-dialog canvas{background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 auto;width:300px;height:79px;max-width:100%;-webkit-box-shadow:0 0 6px 0 #0000001f;box-shadow:0 0 6px 0 #0000001f}verdocs-initial-dialog .disclaimer{text-align:justify;padding:8px 0;font-size:11px;line-height:14px;color:rgba(0, 0, 0, 0.54)}verdocs-initial-dialog .as-shown{font-size:11px;margin:4px 0 20px 4px;color:rgba(0, 0, 0, 0.54)}verdocs-initial-dialog .tabs{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}verdocs-initial-dialog .tabs .tab{padding:8px 15px;cursor:pointer}verdocs-initial-dialog .tabs .tab.active{border-bottom:2px solid #cccccc}verdocs-initial-dialog .tabs .tab:hover{color:#55bc81}';const a=class{constructor(s){i(this,s);this.adopt=t(this,"adopt",7);this.cancel=t(this,"cancel",7);this.initials="";this.open=false;this.fontLoaded=false;this.enteredInitials="";this.mode="type"}componentWillLoad(){this.enteredInitials=this.initials.toUpperCase();const i=new FontFace("Dancing Script","url(https://fonts.gstatic.com/s/dancingscript/v19/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7BMSo3Sup6hNX6plRP.woff)");i.load().then((i=>{document.fonts.add(i);this.fontLoaded=true}))}componentDidLoad(){this.redrawSignature()}componentDidUpdate(){this.redrawSignature()}redrawSignature(){if(!this.canvasElement){return}const i=this.canvasElement.width;const t=this.canvasElement.getContext("2d");t.clearRect(0,0,this.canvasElement.width,this.canvasElement.height);let s=100;do{s-=2;t.font=`${s}px Dancing Script`}while(t.measureText(this.enteredInitials).width>i-32);t.textAlign="center";t.textBaseline="middle";t.font=`${s}px Dancing Script`;t.fillText(this.enteredInitials,this.canvasElement.width/2,this.canvasElement.height/2)}handleDismiss(i){i.stopPropagation();if(i.target.className==="background-overlay"){this.handleCancel()}}handleNameChange(i){this.enteredInitials=i.target.value}handleAdopt(){const i=this.canvasElement.toDataURL("image/png");this.adopt.emit(i);this.open=false}handleCancel(){this.cancel.emit();this.open=false}render(){return s(e,{class:{open:this.open}},s("div",{class:"background-overlay",onClick:i=>this.handleDismiss(i)},s("div",{class:"dialog"},s("div",{class:"heading"},"Create Your Initial"),s("div",{class:"content"},s("verdocs-text-input",{placeholder:"Initials...",label:"Initials",value:this.enteredInitials,onInput:i=>this.handleNameChange(i)}),s("div",{class:"as-shown"},"As shown on driver's license or govt. ID card."),s("div",{class:"tabs"},s("div",{class:{tab:true,active:this.mode==="type"},onClick:()=>this.mode="type"},"Type"),s("div",{class:{tab:true,active:this.mode==="draw"},onClick:()=>this.mode="draw"},"Draw")),this.fontLoaded?s("canvas",{ref:i=>this.canvasElement=i}):s("div",{style:{display:"none"}}),s("div",{class:"disclaimer"},"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, including legally binding contracts — just the same as a pen-and-paper signature or initial."),s("div",{class:"buttons"},s("verdocs-button",{label:"CANCEL",variant:"outline",onPress:()=>this.handleCancel()}),s("verdocs-button",{label:"Adopt & Sign",onPress:()=>this.handleAdopt()}))))))}};a.style=o;export{a as verdocs_initial_dialog};
-//# sourceMappingURL=p-52179311.entry.js.map

package/dist/verdocs-web-sdk/p-52179311.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"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"],"names":["verdocsInitialDialogCss","VerdocsInitialDialog","[object Object]","this","enteredInitials","initials","toUpperCase","ds","FontFace","load","then","font","document","fonts","add","fontLoaded","redrawSignature","canvasElement","canvasWidth","width","context","getContext","clearRect","height","fontSize","measureText","textAlign","textBaseline","fillText","e","stopPropagation","target","className","handleCancel","value","data","toDataURL","adopt","emit","open","cancel","h","Host","class","onClick","handleDismiss","placeholder","label","onInput","handleNameChange","tab","active","mode","ref","el","style","display","variant","onPress","handleAdopt"],"mappings":"yDAAA,MAAMA,EAA0B,81DCUnBC,EAAoB,yGAMJ,aAKH,sBAYF,2BAEa,aAEX,OAExBC,oBACEC,KAAKC,gBAAkBD,KAAKE,SAASC,cAErC,MAAMC,EAAK,IAAIC,SAAS,iBAAkB,oHAC1CD,EAAGE,OAAOC,MAAKC,IACbC,SAASC,MAAMC,IAAIH,GACnBR,KAAKY,WAAa,QAItBb,mBACEC,KAAKa,kBAGPd,qBACEC,KAAKa,kBAGPd,kBACE,IAAKC,KAAKc,cAAe,CACvB,OAGF,MAAMC,EAAcf,KAAKc,cAAcE,MAEvC,MAAMC,EAAUjB,KAAKc,cAAcI,WAAW,MAC9CD,EAAQE,UAAU,EAAG,EAAGnB,KAAKc,cAAcE,MAAOhB,KAAKc,cAAcM,QAErE,IAAIC,EAAW,IACf,EAAG,CACDA,GAAY,EACZJ,EAAQT,KAAO,GAAGa,2BACXJ,EAAQK,YAAYtB,KAAKC,iBAAiBe,MAAQD,EAAc,IAEzEE,EAAQM,UAAY,SACpBN,EAAQO,aAAe,SACvBP,EAAQT,KAAO,GAAGa,qBAClBJ,EAAQQ,SAASzB,KAAKC,gBAAiBD,KAAKc,cAAcE,MAAQ,EAAGhB,KAAKc,cAAcM,OAAS,GAInGrB,cAAc2B,GACZA,EAAEC,kBACF,GAAID,EAAEE,OAAOC,YAAc,qBAAsB,CAC/C7B,KAAK8B,gBAIT/B,iBAAiB2B,GACf1B,KAAKC,gBAAkByB,EAAEE,OAAOG,MAGlChC,cACE,MAAMiC,EAAOhC,KAAKc,cAAcmB,UAAU,aAC1CjC,KAAKkC,MAAMC,KAAKH,GAChBhC,KAAKoC,KAAO,MAGdrC,eACEC,KAAKqC,OAAOF,OACZnC,KAAKoC,KAAO,MAiKdrC,SACE,OACEuC,EAACC,EAAI,CAACC,MAAO,CAACJ,KAAMpC,KAAKoC,OACvBE,EAAA,MAAA,CAAKE,MAAM,qBAAqBC,QAASf,GAAK1B,KAAK0C,cAAchB,IAC/DY,EAAA,MAAA,CAAKE,MAAM,UACTF,EAAA,MAAA,CAAKE,MAAM,WAAS,uBAEpBF,EAAA,MAAA,CAAKE,MAAM,WACTF,EAAA,qBAAA,CAAoBK,YAAY,cAAcC,MAAM,WAAWb,MAAO/B,KAAKC,gBAAiB4C,QAASnB,GAAK1B,KAAK8C,iBAAiBpB,KAChIY,EAAA,MAAA,CAAKE,MAAM,YAAU,kDAErBF,EAAA,MAAA,CAAKE,MAAM,QACTF,EAAA,MAAA,CAAKE,MAAO,CAACO,IAAK,KAAMC,OAAQhD,KAAKiD,OAAS,QAASR,QAAS,IAAOzC,KAAKiD,KAAO,QAAO,QAG1FX,EAAA,MAAA,CAAKE,MAAO,CAACO,IAAK,KAAMC,OAAQhD,KAAKiD,OAAS,QAASR,QAAS,IAAOzC,KAAKiD,KAAO,QAAO,SAK3FjD,KAAKY,WAAa0B,EAAA,SAAA,CAAQY,IAAKC,GAAOnD,KAAKc,cAAgBqC,IAA+Bb,EAAA,MAAA,CAAKc,MAAO,CAACC,QAAS,UAEjHf,EAAA,MAAA,CAAKE,MAAM,cAAY,iQAKvBF,EAAA,MAAA,CAAKE,MAAM,WACTF,EAAA,iBAAA,CAAgBM,MAAM,SAASU,QAAQ,UAAUC,QAAS,IAAMvD,KAAK8B,iBACrEQ,EAAA,iBAAA,CAAgBM,MAAM,eAAeW,QAAS,IAAMvD,KAAKwD","sourcesContent":["@import '../../../theme.scss';\n\nverdocs-initial-dialog {\n  font-family: $primary-font;\n  box-sizing: border-box;\n  display: none;\n\n  &.open {\n    display: block;\n  }\n\n  .background-overlay {\n    position: absolute;\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\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   * Whether the dialog is currently being displayed. This allows it to be added to the DOM before being displayed.\n   */\n  @Prop() open: boolean = false;\n\n  /**\n   * Event fired when the initials are adopted.\n   */\n  @Event({composed: true}) adopt: EventEmitter<string>;\n\n  /**\n   * Event fired when the step is cancelled.\n   */\n  @Event({composed: true}) cancel: 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  // We need a separate event handler for clicking the background because it can receive events \"through\" other child components\n  handleDismiss(e: any) {\n    e.stopPropagation();\n    if (e.target.className === 'background-overlay') {\n      this.handleCancel();\n    }\n  }\n\n  handleNameChange(e: any) {\n    this.enteredInitials = e.target.value;\n  }\n\n  handleAdopt() {\n    const data = this.canvasElement.toDataURL('image/png');\n    this.adopt.emit(data);\n    this.open = false;\n  }\n\n  handleCancel() {\n    this.cancel.emit();\n    this.open = false;\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 class={{open: this.open}}>\n        <div class=\"background-overlay\" onClick={e => this.handleDismiss(e)}>\n          <div class=\"dialog\">\n            <div class=\"heading\">Create Your Initial</div>\n\n            <div class=\"content\">\n              <verdocs-text-input placeholder=\"Initials...\" label=\"Initials\" value={this.enteredInitials} onInput={e => this.handleNameChange(e)} />\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\" variant=\"outline\" onPress={() => this.handleCancel()} />\n                <verdocs-button label=\"Adopt & Sign\" onPress={() => this.handleAdopt()} />\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-5713fea6.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as o,h as i,H as t}from"./p-ff1278ed.js";var a=function(e){return new Promise((function(o,i){var t=new FileReader;t.onload=function(){return o({lastModified:e.lastModified,size:e.size,type:e.type,name:e.name,data:t.result})};t.onerror=i;if(e){t.readAsDataURL(e)}else{i(new Error("Invalid file"))}}))};const s=`<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">\n  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" />\n</svg>\n`;const l=`<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">\n  <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />\n</svg>\n`;const n='verdocs-upload-dialog{font-family:"Barlow", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-upload-dialog .background-overlay{position:absolute;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:#0000007f}verdocs-upload-dialog .dialog{width:300px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;background:#ffffff;padding:16px;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-upload-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;font-size:20px;font-weight:500}verdocs-upload-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}verdocs-upload-dialog .buttons verdocs-button{margin-left:16px}verdocs-upload-dialog .drop-target{padding:30px 15px;width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background-color:#f5f5f5;border:2px dashed #979797;min-height:260px;text-align:center;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;color:rgba(0, 0, 0, 0.54);opacity:1;margin:20px 0}verdocs-upload-dialog .drop-target p{margin:12px 0}verdocs-upload-dialog .drop-target.dragging-over{border:5px solid #4c56cb}verdocs-upload-dialog .drop-target>verdocs-button{margin:12px 0;display:inline-block}verdocs-upload-dialog .attachments{height:56px;font-size:0;margin:20px 0;padding:0 16px;line-height:56px;white-space:normal;-webkit-box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 0 2px 0 rgba(0, 0, 0, 0.14)}verdocs-upload-dialog .attachments .attachment{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}verdocs-upload-dialog .attachments .attachment .icon{width:18px;height:18px;line-height:18px}verdocs-upload-dialog .attachments .attachment .icon.trash{cursor:pointer}verdocs-upload-dialog .attachments .attachment .name{-ms-flex:1;flex:1;display:-ms-flexbox;display:flex;padding:0 8px;font-size:14px;font-weight:400}';const r=class{constructor(i){e(this,i);this.cancel=o(this,"cancel",7);this.done=o(this,"done",7);this.open=false;this.draggingOver=false;this.decodedFiles=[]}handleCancel(){this.cancel.emit();this.open=false}handleDismiss(e){if(e.target.className==="background-overlay"){e.preventDefault();this.handleCancel()}}handleDone(){this.done.emit(this.decodedFiles);this.open=false}handleDragOver(e){e.preventDefault();this.draggingOver=true}handleDragLeave(e){e.preventDefault();this.draggingOver=false}async handleDrop(e){e.preventDefault();this.draggingOver=false;let o=[];if(e.dataTransfer.items){for(let i=0;i<e.dataTransfer.items.length;i++){if(e.dataTransfer.items[i].kind==="file"){const t=e.dataTransfer.items[i].getAsFile();o.push(t)}}}else{o=e.dataTransfer.files}this.decodedFiles=await Promise.all(o.map(a))}handleRemoveAttachment(e){const o=[...this.decodedFiles];o.splice(e,1);this.decodedFiles=o}handleSelectFile(){var e;(e=this.fileInput)===null||e===void 0?void 0:e.click()}async handleFileChange(e){var o,i,t;console.log("fileChange",e);console.log("files",(o=this.fileInput)===null||o===void 0?void 0:o.files);let s=[];for(let e=0;e<((i=this.fileInput)===null||i===void 0?void 0:i.files.length);e++){s.push((t=this.fileInput)===null||t===void 0?void 0:t.files[e])}this.decodedFiles=await Promise.all(s.map(a))}render(){return i(t,{style:{display:this.open?"block":"none"}},i("div",{class:"background-overlay",onClick:e=>this.handleDismiss(e)},i("div",{class:"dialog"},i("div",{class:"heading"},"Upload attachment"),this.decodedFiles.length<1?i("div",{class:{"drop-target":true,"dragging-over":this.draggingOver},onDragOver:e=>this.handleDragOver(e),onDragLeave:e=>this.handleDragLeave(e),onDrop:e=>this.handleDrop(e)},i("p",null,"Drag and drop a file here..."),i("p",null,"- or -"),i("verdocs-button",{label:"Select a file...",onPress:()=>this.handleSelectFile()}),i("input",{type:"file",ref:e=>this.fileInput=e,style:{display:"none"},onChange:e=>this.handleFileChange(e)})):i("div",{class:"attachments"},this.decodedFiles.map(((e,o)=>i("div",{class:"attachment"},i("div",{class:"icon",innerHTML:s}),i("div",{class:"name"},e.name),i("div",{class:"icon trash",innerHTML:l,onClick:()=>this.handleRemoveAttachment(o)}))))),i("div",{class:"buttons"},i("verdocs-button",{label:"Cancel",variant:"outline",onPress:()=>this.handleCancel()}),i("verdocs-button",{label:"Done",onPress:()=>this.handleDone(),disabled:this.decodedFiles.length<1})))))}};r.style=n;export{r as verdocs_upload_dialog};
-//# sourceMappingURL=p-5713fea6.entry.js.map

package/dist/verdocs-web-sdk/p-5713fea6.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["node_modules/@verdocs/js-sdk/Utils/Files.js","src/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.scss?tag=verdocs-upload-dialog","src/components/dialogs/verdocs-upload-dialog/verdocs-upload-dialog.tsx"],"names":["fileToDataUrl","file","Promise","resolve","reject","reader","FileReader","onload","lastModified","size","type","name","data","result","onerror","readAsDataURL","Error","verdocsUploadDialogCss","VerdocsUploadDialog","[object Object]","this","cancel","emit","open","e","target","className","preventDefault","handleCancel","done","decodedFiles","draggingOver","droppedFiles","dataTransfer","items","i","length","kind","getAsFile","push","files","all","map","index","newFiles","splice","_a","fileInput","click","console","log","_b","_c","h","Host","style","display","class","onClick","handleDismiss","drop-target","dragging-over","onDragOver","handleDragOver","onDragLeave","handleDragLeave","onDrop","handleDrop","label","onPress","handleSelectFile","ref","el","onChange","handleFileChange","innerHTML","Paperclip","Trash","handleRemoveAttachment","variant","handleDone","disabled"],"mappings":"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","sourcesContent":["/**\n * Given a File, extract the file's content as a base64 encoded data URL. The response will have a prefix that\n * includes the MIME type of the file, e.g. \"data:image/jpeg;base64,iVBORw0K......\"\n */\nexport var fileToDataUrl = function (file) {\n    return new Promise(function (resolve, reject) {\n        var reader = new FileReader();\n        reader.onload = function () {\n            return resolve({\n                lastModified: file.lastModified,\n                size: file.size,\n                type: file.type,\n                name: file.name,\n                data: reader.result,\n            });\n        };\n        reader.onerror = reject;\n        if (file) {\n            reader.readAsDataURL(file);\n        }\n        else {\n            reject(new Error('Invalid file'));\n        }\n    });\n};\n","@import '../../../theme.scss';\n\nverdocs-upload-dialog {\n  font-family: $primary-font;\n  box-sizing: border-box;\n\n  div {\n    box-sizing: border-box;\n  }\n\n  .background-overlay {\n    position: absolute;\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\n  .dialog {\n    width: 300px;\n    display: flex;\n    flex-direction: column;\n    border-radius: 4px;\n    overflow: hidden;\n    background: $verdocs-grey-4;\n    padding: 16px;\n    box-shadow: 3px 3px 5px 1px rgba(40, 40, 40, 0.4);\n  }\n\n  .heading {\n    display: flex;\n    flex-direction: row;\n    font-size: 20px;\n    font-weight: 500;\n  }\n\n  .buttons {\n    display: flex;\n    align-items: center;\n    flex-direction: row;\n    justify-content: flex-end;\n\n    verdocs-button {\n      margin-left: 16px;\n    }\n  }\n\n  .drop-target {\n    padding: 30px 15px;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    background-color: #f5f5f5;\n    border: 2px dashed #979797;\n    min-height: 260px;\n    text-align: center;\n    justify-content: center;\n    align-items: center;\n    color: rgba(0, 0, 0, 0.54);\n    opacity: 1;\n    margin: 20px 0;\n\n    p {\n      margin: 12px 0;\n    }\n\n    &.dragging-over {\n      border: 5px solid $verdocs-deep-blue;\n    }\n\n    > verdocs-button {\n      margin: 12px 0;\n      display: inline-block;\n    }\n  }\n\n  .attachments {\n    height: 56px;\n    font-size: 0;\n    margin: 20px 0;\n    padding: 0 16px;\n    line-height: 56px;\n    white-space: normal;\n    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 12%), 0 0 2px 0 rgb(0 0 0 / 14%);\n\n    .attachment {\n      display: flex;\n      align-items: center;\n      flex-direction: row;\n\n      .icon {\n        width: 18px;\n        height: 18px;\n        line-height: 18px;\n\n        &.trash {\n          cursor: pointer;\n        }\n      }\n\n      .name {\n        flex: 1;\n        display: flex;\n        padding: 0 8px;\n        font-size: 14px;\n        font-weight: 400;\n      }\n    }\n  }\n}\n","import {Component, Prop, h, Event, EventEmitter, Host, State} from '@stencil/core';\nimport {fileToDataUrl, FileWithData} from '@verdocs/js-sdk/Utils/Files';\nimport Paperclip from './paperclip.svg';\nimport Trash from './trash.svg';\n\n/**\n * Display a file upload experience.\n */\n@Component({\n  tag: 'verdocs-upload-dialog',\n  styleUrl: 'verdocs-upload-dialog.scss',\n})\nexport class VerdocsUploadDialog {\n  private fileInput?: HTMLInputElement;\n\n  /**\n   * Whether the dialog is currently being displayed. This allows it to be added to the DOM before being displayed.\n   */\n  @Prop() open: boolean = false;\n\n  /**\n   * Event fired when the dialog is closed. The event data will contain the closure reason.\n   */\n  @Event({composed: true}) cancel: EventEmitter;\n\n  /**\n   * Event fired when the dialog is closed. The event data will contain the closure reason.\n   */\n  @Event({composed: true}) done: EventEmitter<FileWithData[]>;\n\n  @State() draggingOver = false;\n\n  @State() decodedFiles = [] as FileWithData[];\n\n  handleCancel() {\n    this.cancel.emit();\n    this.open = false;\n  }\n\n  // We need a separate event handler for clicking the background because it can receive events \"through\" other child components\n  handleDismiss(e: any) {\n    if (e.target.className === 'background-overlay') {\n      e.preventDefault();\n      this.handleCancel();\n    }\n  }\n\n  handleDone() {\n    this.done.emit(this.decodedFiles);\n    this.open = false;\n  }\n\n  handleDragOver(e) {\n    e.preventDefault();\n    this.draggingOver = true;\n  }\n\n  handleDragLeave(e) {\n    e.preventDefault();\n    this.draggingOver = false;\n  }\n\n  async handleDrop(e) {\n    e.preventDefault();\n    this.draggingOver = false;\n\n    // Required for cross-browser support. Note that dataTransfer.items is of type DataTransferItemList and is not an array.\n    let droppedFiles = [] as File[];\n    if (e.dataTransfer.items) {\n      for (let i = 0; i < e.dataTransfer.items.length; i++) {\n        if (e.dataTransfer.items[i].kind === 'file') {\n          const file = e.dataTransfer.items[i].getAsFile();\n          droppedFiles.push(file);\n        }\n      }\n    } else {\n      droppedFiles = e.dataTransfer.files;\n    }\n\n    this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));\n  }\n\n  handleRemoveAttachment(index: number) {\n    const newFiles = [...this.decodedFiles];\n    newFiles.splice(index, 1);\n    this.decodedFiles = newFiles;\n  }\n\n  handleSelectFile() {\n    this.fileInput?.click();\n  }\n\n  async handleFileChange(e) {\n    console.log('fileChange', e);\n    console.log('files', this.fileInput?.files);\n    let droppedFiles = [] as File[];\n    for (let i = 0; i < this.fileInput?.files.length; i++) {\n      droppedFiles.push(this.fileInput?.files[i]);\n    }\n    this.decodedFiles = await Promise.all(droppedFiles.map(fileToDataUrl));\n  }\n\n  render() {\n    return (\n      <Host style={{display: this.open ? 'block' : 'none'}}>\n        <div class=\"background-overlay\" onClick={e => this.handleDismiss(e)}>\n          <div class=\"dialog\">\n            <div class=\"heading\">Upload attachment</div>\n\n            {this.decodedFiles.length < 1 ? (\n              <div\n                class={{'drop-target': true, 'dragging-over': this.draggingOver}}\n                onDragOver={e => this.handleDragOver(e)}\n                onDragLeave={e => this.handleDragLeave(e)}\n                onDrop={e => this.handleDrop(e)}\n              >\n                <p>Drag and drop a file here...</p>\n                <p>- or -</p>\n\n                <verdocs-button label=\"Select a file...\" onPress={() => this.handleSelectFile()} />\n                <input type=\"file\" ref={el => (this.fileInput = el as HTMLInputElement)} style={{display: 'none'}} onChange={e => this.handleFileChange(e)} />\n              </div>\n            ) : (\n              <div class=\"attachments\">\n                {this.decodedFiles.map((file, index) => (\n                  <div class=\"attachment\">\n                    <div class=\"icon\" innerHTML={Paperclip} />\n                    <div class=\"name\">{file.name}</div>\n                    <div class=\"icon trash\" innerHTML={Trash} onClick={() => this.handleRemoveAttachment(index)} />\n                  </div>\n                ))}\n              </div>\n            )}\n\n            <div class=\"buttons\">\n              <verdocs-button label=\"Cancel\" variant=\"outline\" onPress={() => this.handleCancel()} />\n              <verdocs-button label=\"Done\" onPress={() => this.handleDone()} disabled={this.decodedFiles.length < 1} />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/verdocs-web-sdk/p-5c40246d.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as o,h as i,H as t}from"./p-ff1278ed.js";import{c as d}from"./p-ec26fc38.js";import{g as s}from"./p-7ce27ce2.js";const r=`<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#50BE80"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M7 10l5 5 5-5H7z"/></svg>\n`;const n='verdocs-dropdown{font-family:"Barlow", sans-serif;display:block}verdocs-dropdown .arrow{width:32px;height:26px;background:#fff;cursor:pointer;border-radius:4px;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;border:1px solid #cccccc;-ms-flex-pack:center;justify-content:center}verdocs-dropdown .arrow svg{fill:#55bc81;-webkit-transition:0.3s;transition:0.3s}verdocs-dropdown .items{width:200px;display:none;z-index:10000;border-radius:5px;background:#33354c;border:1px solid #654dcb}verdocs-dropdown .items[data-show]{display:block}verdocs-dropdown .option{width:100%;color:#fff;border:none;display:block;text-align:left;background:none;padding:10px 20px}verdocs-dropdown .option:hover{cursor:pointer;background:#55bc81}verdocs-dropdown .option[disabled]{color:#aaaaaa}verdocs-dropdown .option[disabled]:hover{color:#aaaaaa;cursor:inherit;background:transparent}verdocs-dropdown.open .items{display:block}verdocs-dropdown.open .arrow{background:#4c56cb;border:1px solid #707ae5}verdocs-dropdown.open .arrow svg{-webkit-transform:scaleY(-1);transform:scaleY(-1);fill:#fff}';const a=class{constructor(i){e(this,i);this.optionSelected=o(this,"optionSelected",7);this.options=[];this.open=undefined;this.isOpen=undefined}componentWillLoad(){this.isOpen=!!this.open}componentDidLoad(){this.popper=d(this.dropdownButton,this.dropdownMenu,{placement:"bottom-start",modifiers:[{name:"offset",options:{offset:[0,6]}}]})}handleSelectOption(e,o){e.stopPropagation();this.isOpen=false;this.optionSelected.emit(o);this.hide()}showDropdown(){var e,o;this.isOpen=true;this.dropdownMenu.setAttribute("data-show","");this.dropdownMenu.removeAttribute("aria-hidden");(e=this.popper)===null||e===void 0?void 0:e.setOptions((e=>({...e,modifiers:[...e.modifiers,{name:"eventListeners",enabled:true}]})));(o=this.popper)===null||o===void 0?void 0:o.update()}handleHideDropdown(e){var o,i;if(((o=e===null||e===void 0?void 0:e.target)===null||o===void 0?void 0:o.localName)==="button"&&((i=e===null||e===void 0?void 0:e.target)===null||i===void 0?void 0:i.className)==="arrow"){return}this.hide()}toggleDropdown(e){e.stopPropagation();if(this.isOpen){this.hide()}else{this.showDropdown()}}hide(){var e;this.isOpen=false;this.dropdownMenu.removeAttribute("data-show");this.dropdownMenu.setAttribute("aria-hidden","true");(e=this.popper)===null||e===void 0?void 0:e.setOptions((e=>({...e,modifiers:[...e.modifiers,{name:"eventListeners",enabled:false}]})))}render(){var e;return i(t,{class:{storybook:!!(window===null||window===void 0?void 0:window["STORYBOOK_ENV"]),open:!!this.isOpen}},i("button",{class:"arrow",innerHTML:r,"aria-label":"Open Menu",onClick:e=>this.toggleDropdown(e),onBlur:e=>this.handleHideDropdown(e),ref:e=>this.dropdownButton=e}),i("div",{class:"items","aria-hidden":!this.open,ref:e=>this.dropdownMenu=e},(e=this.options)===null||e===void 0?void 0:e.map((e=>i("button",{onClick:o=>this.handleSelectOption(o,e),class:"option",disabled:e.disabled},e.label)))))}};a.style=n;const l='@charset "UTF-8";verdocs-field-checkbox{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left}verdocs-field-checkbox.disabled{opacity:0.5}verdocs-field-checkbox label>input[type=checkbox]{display:none}verdocs-field-checkbox label>input[type=checkbox]+*::before{content:"";position:absolute;display:block;top:1px;left:1px;width:10px;height:10px;border-radius:2px;background:#f5f5fa;border:1px solid rgba(0, 0, 0, 0.7)}verdocs-field-checkbox label>input[type=checkbox]:checked+*{color:#55bc81}verdocs-field-checkbox label>input[type=checkbox]:checked+*::before{content:"✓";color:white;text-align:center;background:#55bc81;border-color:#55bc81}verdocs-field-checkbox.required label>input[type=checkbox]+*::before{border:1px solid #cc0000}verdocs-field-checkbox.hide{display:none}verdocs-field-checkbox.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}';const c=class{constructor(i){e(this,i);this.fieldChange=o(this,"fieldChange",7);this.field=null;this.recipient=undefined;this.option=0;this.disabled=false}handleChange(e){this.fieldChange.emit({option:this.option,value:e.target.checked})}render(){var e,o,d,r;const n=s(this.field);const a=(o=(e=n.options)===null||e===void 0?void 0:e[this.option])!==null&&o!==void 0?o:{checked:false};const l=(r=(d=this.disabled)!==null&&d!==void 0?d:n.disabled)!==null&&r!==void 0?r:false;return i(t,{class:{required:n.required,disabled:l}},i("label",null,i("input",{type:"checkbox",tabIndex:n.order,checked:a.checked,disabled:l,required:n.required,onChange:e=>this.handleChange(e)}),i("span",null)))}};c.style=l;const p='verdocs-field-radio-button{font-family:"Inter", -apple-system, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;width:14px;height:14px;display:block;font-size:11px;position:relative;background-color:transparent;-webkit-transform-origin:bottom left;transform-origin:bottom left;border-radius:100%}verdocs-field-radio-button.disabled{opacity:0.5}verdocs-field-radio-button input[type=radio]{position:absolute;opacity:0}verdocs-field-radio-button input[type=radio]+label:before{content:"";background:#f5f5fa;border-radius:100%;border:1px solid rgba(0, 0, 0, 0.6);display:inline-block;width:10px;height:10px;position:absolute;left:1px;top:1px;cursor:pointer;text-align:center;-webkit-transition:all 250ms ease;transition:all 250ms ease}verdocs-field-radio-button input[type=radio]:checked+label:before{background-color:#55bc81;-webkit-box-shadow:inset 0 0 0 2px #f5f5fa;box-shadow:inset 0 0 0 2px #f5f5fa}verdocs-field-radio-button input[type=radio]:focus+label:before{outline:none;border-color:#55bc81}verdocs-field-radio-button input[type=radio]:disabled+label:before{-webkit-box-shadow:inset 0 0 0 4px #f5f5fa;box-shadow:inset 0 0 0 4px #f5f5fa;border-color:#a0a0d0;background:#a0a0d0}verdocs-field-radio-button input[type=radio]+label:empty:before{margin-right:0}verdocs-field-radio-button.required input[type=radio]+label:before{border:1px solid #cc0000}verdocs-field-radio-button.hide{display:none}verdocs-field-radio-button.focused{-webkit-animation:verdocs-field-pulse 0.75s 2;animation:verdocs-field-pulse 0.75s 2}';const b=class{constructor(i){e(this,i);this.fieldChange=o(this,"fieldChange",7);this.field=null;this.recipient=undefined;this.option=0;this.disabled=false}handleChange(e){console.log("changed",e);this.fieldChange.emit({option:this.option,value:e.target.checked})}render(){var e,o;const d=s(this.field);const r=(o=(e=this.disabled)!==null&&e!==void 0?e:d.disabled)!==null&&o!==void 0?o:false;return i(t,{class:{required:d.required,disabled:r}},i("input",{type:"radio",tabIndex:d.order,value:d.value,name:d.name,id:`${d.name}=${d.value}`,checked:d.checked,disabled:r,required:d.required,onChange:e=>this.handleChange(e)}),i("label",{htmlFor:`${d.name}=${d.value}`}))}};b.style=p;export{a as verdocs_dropdown,c as verdocs_field_checkbox,b as verdocs_field_radio_button};
-//# sourceMappingURL=p-5c40246d.entry.js.map