@verdocs/web-sdk 1.9.33 → 1.9.35

package/dist/esm/verdocs-template-card.entry.js.map

@@ -1 +0,0 @@
-{"file":"verdocs-template-card.entry.js","mappings":";;;;;;;;;;;;;;;;;;;;AAAA,MAAM,sBAAsB,GAAG,28CAA28C;;MCe79C,mBAAmB;;;;;EAM9B,MAAM;;IACJ,QACE,EAAC,IAAI,QACH,WAAK,GAAG,EAAE,CAAA,MAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,iBAAiB,0CAAE,aAAa,KAAI,EAAE,EAAE,GAAG,EAAC,oBAAoB,EAAC,KAAK,EAAC,WAAW,GAAG,EAE9G,YAAM,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAQ,EAC9C,YAAM,KAAK,EAAC,UAAU,IAAE,CAAA,MAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,0CAAE,IAAI,KAAI,QAAQ,CAAQ,EAE5E,aAAM,EAEN,WAAK,KAAK,EAAC,UAAU,IACnB,WAAK,KAAK,EAAC,SAAS,IAClB,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,QAAQ,GAAI,EAC1C,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAQ,CACnD,EAEN,WAAK,KAAK,EAAC,mBAAmB,IAC5B,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,GAAI,EAC3C,YAAM,KAAK,EAAC,OAAO,IAAE,CAAA,MAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,iBAAiB,0CAAE,YAAY,KAAI,CAAC,CAAQ,CAC5E,EAEN,WAAK,KAAK,EAAC,mBAAmB,IAC5B,YAAM,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,GAAI,EAC3C,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAQ,CAC9C,EAEN,YAAM,KAAK,EAAC,qBAAqB,EAAC,SAAS,EAAE,WAAW,GAAI,CACxD,CACD,EACP;GACH;;;;;;","names":[],"sources":["./src/components/controls/verdocs-template-card/verdocs-template-card.scss?tag=verdocs-template-card","./src/components/controls/verdocs-template-card/verdocs-template-card.tsx"],"sourcesContent":["@import '../../../theme.scss';\n\nverdocs-template-card {\n  font-family: $primary-font;\n  width: 320px;\n  height: 320px;\n  display: flex;\n  padding: 25px;\n  flex-wrap: nowrap;\n  box-sizing: border-box;\n  flex-direction: column;\n  background-color: $verdocs-grey-4;\n  box-shadow: 2px 2px 5px rgba(51, 54, 75, 0.05);\n\n  .thumbnail {\n    width: 272px;\n    height: 158px;\n    object-fit: cover;\n    margin-bottom: 22px;\n    object-position: -20% 0;\n  }\n\n  .name {\n    font-size: 18px;\n    font-weight: 700;\n    margin-bottom: 7px;\n  }\n\n  .org-name {\n    font-size: 14px;\n    font-weight: 700;\n    margin-bottom: 6px;\n  }\n\n  hr {\n    width: 100%;\n    margin-bottom: 17px;\n    background-color: $icon-color;\n  }\n\n  .controls {\n    display: flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: space-between;\n    text-align: center;\n    font-size: 16px;\n\n    .control {\n      flex: 1;\n      display: flex;\n      margin-right: 8px;\n      align-items: flex-start;\n      border-right: 1px solid $icon-color;\n\n      &.secondary {\n        justify-content: center;\n      }\n\n      svg {\n        fill: $icon-color;\n        height: 16px;\n        max-width: 16px;\n        margin: 0 8px -2px 0;\n      }\n    }\n  }\n\n  .additional-controls svg {\n    margin-right: 0;\n    fill: $verdocs-purple;\n  }\n}\n","import {Component, Prop, h, Host} from '@stencil/core';\nimport {ITemplate} from '@verdocs/js-sdk/Templates/Types';\nimport ActionsIcon from './actions.svg';\nimport EmailIcon from './email.svg';\nimport PagesIcon from './pages.svg';\nimport StarIcon from './star.svg';\n\n/**\n * Displays a summary of a template\n */\n@Component({\n  tag: 'verdocs-template-card',\n  styleUrl: 'verdocs-template-card.scss',\n  shadow: false,\n})\nexport class VerdocsTemplateCard {\n  /**\n   * The template for which the card will be rendered.\n   */\n  @Prop() template: ITemplate;\n\n  render() {\n    return (\n      <Host>\n        <img src={this.template?.template_document?.thumbnail_url || ''} alt=\"Template Thumbnail\" class=\"thumbnail\" />\n\n        <span class=\"name\">{this.template.name}</span>\n        <span class=\"org-name\">{this.template.organization?.name || 'Public'}</span>\n\n        <hr />\n\n        <div class=\"controls\">\n          <div class=\"control\">\n            <span class=\"icon\" innerHTML={StarIcon} />\n            <span class=\"value\">{this.template.star_counter}</span>\n          </div>\n\n          <div class=\"control secondary\">\n            <span class=\"icon\" innerHTML={PagesIcon} />\n            <span class=\"value\">{this.template?.template_document?.page_numbers || 1}</span>\n          </div>\n\n          <div class=\"control secondary\">\n            <span class=\"icon\" innerHTML={EmailIcon} />\n            <span class=\"value\">{this.template.counter}</span>\n          </div>\n\n          <span class=\"additional-controls\" innerHTML={ActionsIcon} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}