@getflip/swirl-components 0.3.0 → 0.4.0

package/dist/swirl-components/p-a178d901.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as i,H as t}from"./p-9fe00e8a.js";import{c as o,a as n}from"./p-86bd3473.js";var s=o((function(e,i){(function(e,i){i()})(n,(function(){function i(e,i){return"undefined"==typeof i?i={autoBom:!1}:"object"!=typeof i&&(console.warn("Deprecated: Expected third argument to be a object"),i={autoBom:!i}),i.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)?new Blob(["\ufeff",e],{type:e.type}):e}function t(e,i,t){var o=new XMLHttpRequest;o.open("GET",e),o.responseType="blob",o.onload=function(){l(o.response,i,t)},o.onerror=function(){console.error("could not download file")},o.send()}function o(e){var i=new XMLHttpRequest;i.open("HEAD",e,!1);try{i.send()}catch(e){}return 200<=i.status&&299>=i.status}function s(e){try{e.dispatchEvent(new MouseEvent("click"))}catch(t){var i=document.createEvent("MouseEvents");i.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),e.dispatchEvent(i)}}var a="object"==typeof window&&window.window===window?window:"object"==typeof self&&self.self===self?self:"object"==typeof n&&n.global===n?n:void 0,r=a.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),l=a.saveAs||("object"!=typeof window||window!==a?function(){}:"download"in HTMLAnchorElement.prototype&&!r?function(e,i,n){var r=a.URL||a.webkitURL,l=document.createElement("a");i=i||e.name||"download",l.download=i,l.rel="noopener","string"==typeof e?(l.href=e,l.origin===location.origin?s(l):o(l.href)?t(e,i,n):s(l,l.target="_blank")):(l.href=r.createObjectURL(e),setTimeout((function(){r.revokeObjectURL(l.href)}),4e4),setTimeout((function(){s(l)}),0))}:"msSaveOrOpenBlob"in navigator?function(e,n,a){if(n=n||e.name||"download","string"!=typeof e)navigator.msSaveOrOpenBlob(i(e,a),n);else if(o(e))t(e,n,a);else{var r=document.createElement("a");r.href=e,r.target="_blank",setTimeout((function(){s(r)}))}}:function(e,i,o,n){if(n=n||open("","_blank"),n&&(n.document.title=n.document.body.innerText="downloading..."),"string"==typeof e)return t(e,i,o);var s="application/octet-stream"===e.type,l=/constructor/i.test(a.HTMLElement)||a.safari,f=/CriOS\/[\d]+/.test(navigator.userAgent);if((f||s&&l||r)&&"undefined"!=typeof FileReader){var c=new FileReader;c.onloadend=function(){var e=c.result;e=f?e:e.replace(/^data:[^;]*;/,"data:attachment/file;"),n?n.location.href=e:location=e,n=null},c.readAsDataURL(e)}else{var h=a.URL||a.webkitURL,d=h.createObjectURL(e);n?n.location=d:location.href=d,n=null,setTimeout((function(){h.revokeObjectURL(d)}),4e4)}});a.saveAs=l.saveAs=l,e.exports=l}))}));const a=":host{display:block;width:100%;height:100%}:host *{box-sizing:border-box}.file-viewer{display:flex;width:100%;height:100%;justify-content:center;align-items:center}.file-viewer__file{display:inline-flex;width:100%;height:100%;justify-content:center;align-items:center}";const r=class{constructor(i){e(this,i);this.active=true;this.errorMessage="File could not be loaded.";this.typeUnsupportedMessage="File type is not supported.";this.zoom=1}async download(){const e=this.file.split("/").pop();s.saveAs(this.file,e)}async print(){if(this.type==="application/pdf"){this.viewer.print()}}render(){const e=!Boolean(this.type)||!this.type.startsWith("image/")&&!this.type.startsWith("video/")&&!this.type.startsWith("audio/")&&this.type!=="text/plain"&&this.type!=="text/csv"&&this.type!=="application/pdf";return i(t,null,i("div",{class:"file-viewer"},this.type&&this.active&&i("div",{class:"file-viewer__file"},this.type.startsWith("image/")&&i("flip-file-viewer-image",{description:this.description,errorMessage:this.errorMessage,file:this.file,ref:e=>this.viewer=e}),this.type==="text/plain"&&i("flip-file-viewer-text",{errorMessage:this.errorMessage,file:this.file,ref:e=>this.viewer=e}),this.type==="text/csv"&&i("flip-file-viewer-csv",{errorMessage:this.errorMessage,file:this.file,ref:e=>this.viewer=e}),this.type==="application/pdf"&&i("flip-file-viewer-pdf",{errorMessage:this.errorMessage,file:this.file,ref:e=>this.viewer=e,zoom:this.zoom}),this.type.startsWith("video/")&&i("flip-file-viewer-video",{file:this.file,ref:e=>this.viewer=e,type:this.type}),this.type.startsWith("audio/")&&i("flip-file-viewer-audio",{file:this.file,ref:e=>this.viewer=e,type:this.type}),e&&i("flip-inline-error",{message:this.typeUnsupportedMessage}))))}};r.style=a;export{r as flip_file_viewer};
+//# sourceMappingURL=p-a178d901.entry.js.map

package/dist/swirl-components/p-a178d901.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../node_modules/file-saver/dist/FileSaver.min.js","src/components/flip-file-viewer/flip-file-viewer.css?tag=flip-file-viewer&encapsulation=shadow","src/components/flip-file-viewer/flip-file-viewer.tsx"],"names":["a","b","this","autoBom","console","warn","test","type","Blob","c","d","XMLHttpRequest","open","responseType","onload","g","response","onerror","error","send","status","e","dispatchEvent","MouseEvent","document","createEvent","initMouseEvent","window","f","self","global","navigator","userAgent","saveAs","HTMLAnchorElement","prototype","h","i","URL","webkitURL","j","createElement","name","download","rel","href","origin","location","target","createObjectURL","setTimeout","revokeObjectURL","msSaveOrOpenBlob","title","body","innerText","HTMLElement","safari","FileReader","k","onloadend","result","replace","readAsDataURL","l","m","module","exports","flipFileViewerCss","FlipFileViewer","[object Object]","hostRef","active","errorMessage","typeUnsupportedMessage","zoom","fileName","file","split","pop","viewer","print","unsupportedType","Boolean","startsWith","Host","class","description","ref","el","message"],"mappings":"qHAAA,SAAUA,EAAEC,GAA6FA,KAAzG,CAA0JC,GAAK,WAAwB,SAASD,EAAED,EAAEC,GAAG,MAAM,oBAAoBA,EAAEA,EAAE,CAACE,SAAS,GAAG,iBAAiBF,IAAIG,QAAQC,KAAK,sDAAsDJ,EAAE,CAACE,SAASF,IAAIA,EAAEE,SAAS,6EAA6EG,KAAKN,EAAEO,MAAM,IAAIC,KAAK,CAAC,SAASR,GAAG,CAACO,KAAKP,EAAEO,OAAOP,EAAE,SAASS,EAAET,EAAEC,EAAEQ,GAAG,IAAIC,EAAE,IAAIC,eAAeD,EAAEE,KAAK,MAAMZ,GAAGU,EAAEG,aAAa,OAAOH,EAAEI,OAAO,WAAWC,EAAEL,EAAEM,SAASf,EAAEQ,IAAIC,EAAEO,QAAQ,WAAWb,QAAQc,MAAM,4BAA4BR,EAAES,OAAO,SAAST,EAAEV,GAAG,IAAIC,EAAE,IAAIU,eAAeV,EAAEW,KAAK,OAAOZ,GAAG,GAAG,IAAIC,EAAEkB,OAAO,MAAMnB,IAAI,OAAO,KAAKC,EAAEmB,QAAQ,KAAKnB,EAAEmB,OAAO,SAASC,EAAErB,GAAG,IAAIA,EAAEsB,cAAc,IAAIC,WAAW,UAAU,MAAMd,GAAG,IAAIR,EAAEuB,SAASC,YAAY,eAAexB,EAAEyB,eAAe,SAAS,GAAG,EAAEC,OAAO,EAAE,EAAE,EAAE,GAAG,IAAI,GAAG,GAAG,GAAG,EAAE,EAAE,MAAM3B,EAAEsB,cAAcrB,IAAI,IAAI2B,EAAE,iBAAiBD,QAAQA,OAAOA,SAASA,OAAOA,OAAO,iBAAiBE,MAAMA,KAAKA,OAAOA,KAAKA,KAAK,iBAAiBC,GAAQA,EAAOA,SAASA,EAAOA,OAAY,EAAE9B,EAAE4B,EAAEG,WAAW,YAAYzB,KAAKyB,UAAUC,YAAY,cAAc1B,KAAKyB,UAAUC,aAAa,SAAS1B,KAAKyB,UAAUC,WAAWjB,EAAEa,EAAEK,SAAS,iBAAiBN,QAAQA,SAASC,EAAE,aAAa,aAAaM,kBAAkBC,YAAYnC,EAAE,SAASC,EAAEc,EAAEqB,GAAG,IAAIC,EAAET,EAAEU,KAAKV,EAAEW,UAAUC,EAAEhB,SAASiB,cAAc,KAAK1B,EAAEA,GAAGd,EAAEyC,MAAM,WAAWF,EAAEG,SAAS5B,EAAEyB,EAAEI,IAAI,WAAW,iBAAiB3C,GAAGuC,EAAEK,KAAK5C,EAAEuC,EAAEM,SAASC,SAASD,OAAOzB,EAAEmB,GAAG9B,EAAE8B,EAAEK,MAAMpC,EAAER,EAAEc,EAAEqB,GAAGf,EAAEmB,EAAEA,EAAEQ,OAAO,YAAYR,EAAEK,KAAKR,EAAEY,gBAAgBhD,GAAGiD,YAAW,WAAWb,EAAEc,gBAAgBX,EAAEK,QAAO,KAAKK,YAAW,WAAW7B,EAAEmB,KAAI,KAAK,qBAAqBT,UAAU,SAASH,EAAEb,EAAEqB,GAAG,GAAGrB,EAAEA,GAAGa,EAAEc,MAAM,WAAW,iBAAiBd,EAAEG,UAAUqB,iBAAiBnD,EAAE2B,EAAEQ,GAAGrB,QAAQ,GAAGL,EAAEkB,GAAGnB,EAAEmB,EAAEb,EAAEqB,OAAO,CAAC,IAAIC,EAAEb,SAASiB,cAAc,KAAKJ,EAAEQ,KAAKjB,EAAES,EAAEW,OAAO,SAASE,YAAW,WAAW7B,EAAEgB,QAAO,SAASpC,EAAES,EAAEW,EAAEN,GAAG,GAAGA,EAAEA,GAAGH,KAAK,GAAG,UAAUG,IAAIA,EAAES,SAAS6B,MAAMtC,EAAES,SAAS8B,KAAKC,UAAU,kBAAkB,iBAAiBtD,EAAE,OAAOQ,EAAER,EAAES,EAAEW,GAAG,IAAIe,EAAE,6BAA6BnC,EAAEM,KAAK8B,EAAE,eAAe/B,KAAKsB,EAAE4B,cAAc5B,EAAE6B,OAAOjB,EAAE,eAAelC,KAAKyB,UAAUC,WAAW,IAAIQ,GAAGJ,GAAGC,GAAGrC,IAAI,oBAAoB0D,WAAW,CAAC,IAAIC,EAAE,IAAID,WAAWC,EAAEC,UAAU,WAAW,IAAI5D,EAAE2D,EAAEE,OAAO7D,EAAEwC,EAAExC,EAAEA,EAAE8D,QAAQ,eAAe,yBAAyB/C,EAAEA,EAAEgC,SAASF,KAAK7C,EAAE+C,SAAS/C,EAAEe,EAAE,MAAM4C,EAAEI,cAAc9D,OAAO,CAAC,IAAI+D,EAAEpC,EAAEU,KAAKV,EAAEW,UAAU0B,EAAED,EAAEf,gBAAgBhD,GAAGc,EAAEA,EAAEgC,SAASkB,EAAElB,SAASF,KAAKoB,EAAElD,EAAE,KAAKmC,YAAW,WAAWc,EAAEb,gBAAgBc,KAAI,QAAQrC,EAAEK,OAAOlB,EAAEkB,OAAOlB,EAA+BmD,EAAAC,QAAepD,QCA7oF,MAAMqD,EAAoB,qRCSbC,EAAc,MAL3BC,YAAAC,aAMUrE,KAAAsE,OAAmB,KAEnBtE,KAAAuE,aAAwB,4BAGxBvE,KAAAwE,uBAAkC,8BAClCxE,KAAAyE,KAA+B,EAQvCL,iBACE,MAAMM,EAAW1E,KAAK2E,KAAKC,MAAM,KAAKC,MAEtC9C,EAAAA,OAAO/B,KAAK2E,KAAMD,GAOpBN,cACE,GAAIpE,KAAKK,OAAS,kBAAmB,CAClCL,KAAK8E,OAAwCC,SAIlDX,SACE,MAAMY,GACHC,QAAQjF,KAAKK,QACZL,KAAKK,KAAK6E,WAAW,YACpBlF,KAAKK,KAAK6E,WAAW,YACrBlF,KAAKK,KAAK6E,WAAW,WACtBlF,KAAKK,OAAS,cACdL,KAAKK,OAAS,YACdL,KAAKK,OAAS,kBAElB,OACE6B,EAACiD,EAAI,KACHjD,EAAA,MAAA,CAAKkD,MAAM,eACRpF,KAAKK,MAAQL,KAAKsE,QACjBpC,EAAA,MAAA,CAAKkD,MAAM,qBAERpF,KAAKK,KAAK6E,WAAW,WACpBhD,EAAA,yBAAA,CACEmD,YAAarF,KAAKqF,YAClBd,aAAcvE,KAAKuE,aACnBI,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,IAK/BvF,KAAKK,OAAS,cACb6B,EAAA,wBAAA,CACEqC,aAAcvE,KAAKuE,aACnBI,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,IAK/BvF,KAAKK,OAAS,YACb6B,EAAA,uBAAA,CACEqC,aAAcvE,KAAKuE,aACnBI,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,IAK/BvF,KAAKK,OAAS,mBACb6B,EAAA,uBAAA,CACEqC,aAAcvE,KAAKuE,aACnBI,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,EAC5Bd,KAAMzE,KAAKyE,OAKdzE,KAAKK,KAAK6E,WAAW,WACpBhD,EAAA,yBAAA,CACEyC,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,EAC5BlF,KAAML,KAAKK,OAKdL,KAAKK,KAAK6E,WAAW,WACpBhD,EAAA,yBAAA,CACEyC,KAAM3E,KAAK2E,KACXW,IAAMC,GAAQvF,KAAK8E,OAASS,EAC5BlF,KAAML,KAAKK,OAId2E,GACC9C,EAAA,oBAAA,CACEsD,QAASxF,KAAKwE","sourcesContent":["(function(a,b){if(\"function\"==typeof define&&define.amd)define([],b);else if(\"undefined\"!=typeof exports)b();else{b(),a.FileSaver={exports:{}}.exports}})(this,function(){\"use strict\";function b(a,b){return\"undefined\"==typeof b?b={autoBom:!1}:\"object\"!=typeof b&&(console.warn(\"Deprecated: Expected third argument to be a object\"),b={autoBom:!b}),b.autoBom&&/^\\s*(?:text\\/\\S*|application\\/xml|\\S*\\/\\S*\\+xml)\\s*;.*charset\\s*=\\s*utf-8/i.test(a.type)?new Blob([\"\\uFEFF\",a],{type:a.type}):a}function c(a,b,c){var d=new XMLHttpRequest;d.open(\"GET\",a),d.responseType=\"blob\",d.onload=function(){g(d.response,b,c)},d.onerror=function(){console.error(\"could not download file\")},d.send()}function d(a){var b=new XMLHttpRequest;b.open(\"HEAD\",a,!1);try{b.send()}catch(a){}return 200<=b.status&&299>=b.status}function e(a){try{a.dispatchEvent(new MouseEvent(\"click\"))}catch(c){var b=document.createEvent(\"MouseEvents\");b.initMouseEvent(\"click\",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),a.dispatchEvent(b)}}var f=\"object\"==typeof window&&window.window===window?window:\"object\"==typeof self&&self.self===self?self:\"object\"==typeof global&&global.global===global?global:void 0,a=f.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),g=f.saveAs||(\"object\"!=typeof window||window!==f?function(){}:\"download\"in HTMLAnchorElement.prototype&&!a?function(b,g,h){var i=f.URL||f.webkitURL,j=document.createElement(\"a\");g=g||b.name||\"download\",j.download=g,j.rel=\"noopener\",\"string\"==typeof b?(j.href=b,j.origin===location.origin?e(j):d(j.href)?c(b,g,h):e(j,j.target=\"_blank\")):(j.href=i.createObjectURL(b),setTimeout(function(){i.revokeObjectURL(j.href)},4E4),setTimeout(function(){e(j)},0))}:\"msSaveOrOpenBlob\"in navigator?function(f,g,h){if(g=g||f.name||\"download\",\"string\"!=typeof f)navigator.msSaveOrOpenBlob(b(f,h),g);else if(d(f))c(f,g,h);else{var i=document.createElement(\"a\");i.href=f,i.target=\"_blank\",setTimeout(function(){e(i)})}}:function(b,d,e,g){if(g=g||open(\"\",\"_blank\"),g&&(g.document.title=g.document.body.innerText=\"downloading...\"),\"string\"==typeof b)return c(b,d,e);var h=\"application/octet-stream\"===b.type,i=/constructor/i.test(f.HTMLElement)||f.safari,j=/CriOS\\/[\\d]+/.test(navigator.userAgent);if((j||h&&i||a)&&\"undefined\"!=typeof FileReader){var k=new FileReader;k.onloadend=function(){var a=k.result;a=j?a:a.replace(/^data:[^;]*;/,\"data:attachment/file;\"),g?g.location.href=a:location=a,g=null},k.readAsDataURL(b)}else{var l=f.URL||f.webkitURL,m=l.createObjectURL(b);g?g.location=m:location.href=m,g=null,setTimeout(function(){l.revokeObjectURL(m)},4E4)}});f.saveAs=g.saveAs=g,\"undefined\"!=typeof module&&(module.exports=g)});\n\n//# sourceMappingURL=FileSaver.min.js.map",":host {\n  display: block;\n  width: 100%;\n  height: 100%;\n\n  & * {\n    box-sizing: border-box;\n  }\n}\n\n.file-viewer {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  justify-content: center;\n  align-items: center;\n}\n\n.file-viewer__file {\n  display: inline-flex;\n  width: 100%;\n  height: 100%;\n  justify-content: center;\n  align-items: center;\n}\n","import { Component, h, Host, Method, Prop } from \"@stencil/core\";\nimport { saveAs } from \"file-saver\";\nimport { FlipFileViewerPdfZoom } from \"./viewers/flip-file-viewer-pdf/flip-file-viewer-pdf\";\n\n@Component({\n  shadow: true,\n  styleUrl: \"flip-file-viewer.css\",\n  tag: \"flip-file-viewer\",\n})\nexport class FlipFileViewer {\n  @Prop() active?: boolean = true;\n  @Prop() description?: string;\n  @Prop() errorMessage?: string = \"File could not be loaded.\";\n  @Prop() file!: string;\n  @Prop() type!: string;\n  @Prop() typeUnsupportedMessage?: string = \"File type is not supported.\";\n  @Prop() zoom?: FlipFileViewerPdfZoom = 1;\n\n  private viewer: HTMLElement;\n\n  /**\n   * Download the file.\n   */\n  @Method()\n  async download() {\n    const fileName = this.file.split(\"/\").pop();\n\n    saveAs(this.file, fileName);\n  }\n\n  /**\n   * Print the file. Applicable to PDFs only.\n   */\n  @Method()\n  async print() {\n    if (this.type === \"application/pdf\") {\n      (this.viewer as HTMLFlipFileViewerPdfElement).print();\n    }\n  }\n\n  render() {\n    const unsupportedType =\n      !Boolean(this.type) ||\n      (!this.type.startsWith(\"image/\") &&\n        !this.type.startsWith(\"video/\") &&\n        !this.type.startsWith(\"audio/\") &&\n        this.type !== \"text/plain\" &&\n        this.type !== \"text/csv\" &&\n        this.type !== \"application/pdf\");\n\n    return (\n      <Host>\n        <div class=\"file-viewer\">\n          {this.type && this.active && (\n            <div class=\"file-viewer__file\">\n              {/* images */}\n              {this.type.startsWith(\"image/\") && (\n                <flip-file-viewer-image\n                  description={this.description}\n                  errorMessage={this.errorMessage}\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                ></flip-file-viewer-image>\n              )}\n\n              {/* text files */}\n              {this.type === \"text/plain\" && (\n                <flip-file-viewer-text\n                  errorMessage={this.errorMessage}\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                ></flip-file-viewer-text>\n              )}\n\n              {/* csv files */}\n              {this.type === \"text/csv\" && (\n                <flip-file-viewer-csv\n                  errorMessage={this.errorMessage}\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                ></flip-file-viewer-csv>\n              )}\n\n              {/* pdf files */}\n              {this.type === \"application/pdf\" && (\n                <flip-file-viewer-pdf\n                  errorMessage={this.errorMessage}\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                  zoom={this.zoom}\n                ></flip-file-viewer-pdf>\n              )}\n\n              {/* video files */}\n              {this.type.startsWith(\"video/\") && (\n                <flip-file-viewer-video\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                  type={this.type}\n                ></flip-file-viewer-video>\n              )}\n\n              {/* audio files */}\n              {this.type.startsWith(\"audio/\") && (\n                <flip-file-viewer-audio\n                  file={this.file}\n                  ref={(el) => (this.viewer = el)}\n                  type={this.type}\n                ></flip-file-viewer-audio>\n              )}\n\n              {unsupportedType && (\n                <flip-inline-error\n                  message={this.typeUnsupportedMessage}\n                ></flip-inline-error>\n              )}\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/swirl-components/p-ad92140f.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as s,h as a,H as i,g as e}from"./p-9fe00e8a.js";import{c as r}from"./p-efffd297.js";import"./p-86bd3473.js";const o='.sc-flip-tabs-h{display:block;width:100%}.sc-flip-tabs-h *.sc-flip-tabs{box-sizing:border-box}.tabs.sc-flip-tabs{width:100%}.tabs__tab-bar.sc-flip-tabs{position:relative;display:flex;width:100%;justify-content:flex-start;border-bottom:var(--s-border-width-default) solid var(--s-border-default)}.tabs__tab.sc-flip-tabs{position:relative;display:block;min-width:0;margin:0;padding:var(--s-space-4) var(--s-space-8);border:none;background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);cursor:pointer}.tabs__tab.sc-flip-tabs:focus-visible{outline:none}.tabs__tab.sc-flip-tabs:focus-visible .tabs__tab-label.sc-flip-tabs{border-radius:var(--s-border-radius-s);box-shadow:inset 0 0 0 0.125rem var(--s-focus-default)}.tabs__tab.sc-flip-tabs:not(.tabs__tab--active):hover:after{position:absolute;bottom:0;left:50%;width:calc(100% - var(--s-space-8));height:0.1875rem;border-radius:0.125rem;background-color:var(--s-border-default);content:"";transform:translateX(-50%);pointer-events:none}.tabs__tab-label.sc-flip-tabs{display:block;overflow:hidden;width:100%;padding:var(--s-space-8) var(--s-space-8);text-align:center;white-space:nowrap;text-overflow:ellipsis}.tabs__tab--active.sc-flip-tabs{color:var(--s-text-highlight)}.tabs__tab--active.sc-flip-tabs:after{position:absolute;bottom:0;left:50%;width:calc(100% - var(--s-space-8));height:0.1875rem;border-radius:0.125rem;background-color:var(--s-border-highlight);content:"";transform:translateX(-50%);pointer-events:none}';const b=class{constructor(a){t(this,a);this.tabActivated=s(this,"tabActivated",7);this.tabs=[];this.onKeyDown=t=>{if(t.code==="ArrowLeft"){t.preventDefault();this.activatePreviousTab()}else if(t.code==="ArrowRight"){t.preventDefault();this.activateNextTab()}}}componentWillLoad(){this.collectTabs()}async activateTab(t){if(this.activeTab===t){return}this.activeTab=t;this.tabs.forEach((t=>t.active=false));const s=this.tabs.find((s=>s.tabId===t));if(!Boolean(s)){return}s.active=true;this.tabActivated.emit(s)}activateNextTab(){const t=this.tabs.findIndex((t=>t.tabId===this.activeTab));const s=Math.min(this.tabs.length-1,t+1);this.activateTab(this.tabs[s].tabId);requestAnimationFrame((()=>{var t;(t=this.el.querySelector(".tabs__tab--active"))===null||t===void 0?void 0:t.focus()}))}activatePreviousTab(){const t=this.tabs.findIndex((t=>t.tabId===this.activeTab));const s=Math.max(0,t-1);this.activateTab(this.tabs[s].tabId);requestAnimationFrame((()=>{var t;(t=this.el.querySelector(".tabs__tab--active"))===null||t===void 0?void 0:t.focus()}))}collectTabs(){this.tabs=Array.from(this.el.querySelectorAll("flip-tab"));if(this.tabs.length===0){return}const t=this.tabs.find((t=>t.tabId===this.initialTab));this.activateTab(Boolean(t)?t.tabId:this.tabs[0].tabId)}render(){return a(i,null,a("div",{class:"tabs"},a("div",{"aria-label":this.label,class:"tabs__tab-bar",onKeyDown:this.onKeyDown,role:"tablist"},this.tabs.map((t=>{const s=t.tabId===this.activeTab;const i=r("tabs__tab",{"tabs__tab--active":s});return a("button",{"aria-controls":t.tabId,"aria-selected":s?"true":"false",class:i,id:`tab-${t.tabId}`,key:t.tabId,onClick:()=>this.activateTab(t.tabId),role:"tab",tabIndex:s?0:-1,type:"button"},a("span",{class:"tabs__tab-label"},t.label))}))),a("slot",null)))}get el(){return e(this)}};b.style=o;export{b as flip_tabs};
+//# sourceMappingURL=p-ad92140f.entry.js.map

package/dist/swirl-components/p-ad92140f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/flip-tabs/flip-tabs.css?tag=flip-tabs&encapsulation=scoped","src/components/flip-tabs/flip-tabs.tsx"],"names":["flipTabsCss","FlipTabs","[object Object]","hostRef","this","tabs","onKeyDown","event","code","preventDefault","activatePreviousTab","activateNextTab","collectTabs","tabId","activeTab","forEach","tab","active","find","Boolean","tabActivated","emit","currentIndex","findIndex","nextIndex","Math","min","length","activateTab","requestAnimationFrame","_a","el","querySelector","focus","previousIndex","max","Array","from","querySelectorAll","initialTab","h","Host","class","aria-label","label","role","map","isActive","className","classnames","tabs__tab--active","aria-controls","aria-selected","id","key","onClick","tabIndex","type"],"mappings":"4HAAA,MAAMA,EAAc,ogDCmBPC,EAAQ,MANrBC,YAAAC,wDAgBUC,KAAAC,KAA6B,GAuE7BD,KAAAE,UAAaC,IACnB,GAAIA,EAAMC,OAAS,YAAa,CAC9BD,EAAME,iBACNL,KAAKM,2BACA,GAAIH,EAAMC,OAAS,aAAc,CACtCD,EAAME,iBACNL,KAAKO,oBA3ETT,oBACEE,KAAKQ,cAQAV,kBAAkBW,GACvB,GAAIT,KAAKU,YAAcD,EAAO,CAC5B,OAGFT,KAAKU,UAAYD,EACjBT,KAAKC,KAAKU,SAASC,GAASA,EAAIC,OAAS,QAEzC,MAAMD,EAAMZ,KAAKC,KAAKa,MAAMF,GAAQA,EAAIH,QAAUA,IAElD,IAAKM,QAAQH,GAAM,CACjB,OAGFA,EAAIC,OAAS,KACbb,KAAKgB,aAAaC,KAAKL,GAGjBd,kBACN,MAAMoB,EAAelB,KAAKC,KAAKkB,WAC5BP,GAAQA,EAAIH,QAAUT,KAAKU,YAG9B,MAAMU,EAAYC,KAAKC,IAAItB,KAAKC,KAAKsB,OAAS,EAAGL,EAAe,GAEhElB,KAAKwB,YAAYxB,KAAKC,KAAKmB,GAAWX,OAEtCgB,uBAAsB,YACpBC,EAAA1B,KAAK2B,GAAGC,cAAiC,yBAAqB,MAAAF,SAAA,OAAA,EAAAA,EAAEG,WAI5D/B,sBACN,MAAMoB,EAAelB,KAAKC,KAAKkB,WAC5BP,GAAQA,EAAIH,QAAUT,KAAKU,YAG9B,MAAMoB,EAAgBT,KAAKU,IAAI,EAAGb,EAAe,GAEjDlB,KAAKwB,YAAYxB,KAAKC,KAAK6B,GAAerB,OAE1CgB,uBAAsB,YACpBC,EAAA1B,KAAK2B,GAAGC,cAAiC,yBAAqB,MAAAF,SAAA,OAAA,EAAAA,EAAEG,WAI5D/B,cACNE,KAAKC,KAAO+B,MAAMC,KAAKjC,KAAK2B,GAAGO,iBAAiB,aAEhD,GAAIlC,KAAKC,KAAKsB,SAAW,EAAG,CAC1B,OAGF,MAAMY,EAAanC,KAAKC,KAAKa,MAAMF,GAAQA,EAAIH,QAAUT,KAAKmC,aAE9DnC,KAAKwB,YACHT,QAAQoB,GAAcA,EAAW1B,MAAQT,KAAKC,KAAK,GAAGQ,OAc1DX,SACE,OACEsC,EAACC,EAAI,KACHD,EAAA,MAAA,CAAKE,MAAM,QACTF,EAAA,MAAA,CAAAG,aACcvC,KAAKwC,MACjBF,MAAM,gBACNpC,UAAWF,KAAKE,UAChBuC,KAAK,WAEJzC,KAAKC,KAAKyC,KAAK9B,IACd,MAAM+B,EAAW/B,EAAIH,QAAUT,KAAKU,UACpC,MAAMkC,EAAYC,EAAW,YAAa,CACxCC,oBAAqBH,IAGvB,OACEP,EAAA,SAAA,CAAAW,gBACiBnC,EAAIH,MAAKuC,gBACTL,EAAW,OAAS,QACnCL,MAAOM,EACPK,GAAI,OAAOrC,EAAIH,QACfyC,IAAKtC,EAAIH,MAET0C,QAAS,IAAMnD,KAAKwB,YAAYZ,EAAIH,OACpCgC,KAAK,MACLW,SAAUT,EAAW,GAAK,EAC1BU,KAAK,UAELjB,EAAA,OAAA,CAAME,MAAM,mBAAmB1B,EAAI4B,YAK3CJ,EAAA,OAAA","sourcesContent":[":host {\n  display: block;\n  width: 100%;\n\n  & * {\n    box-sizing: border-box;\n  }\n}\n\n.tabs {\n  width: 100%;\n}\n\n.tabs__tab-bar {\n  position: relative;\n  display: flex;\n  width: 100%;\n  justify-content: flex-start;\n  border-bottom: var(--s-border-width-default) solid var(--s-border-default);\n}\n\n.tabs__tab {\n  position: relative;\n  display: block;\n  min-width: 0;\n  margin: 0;\n  padding: var(--s-space-4) var(--s-space-8);\n  border: none;\n  background-color: transparent;\n  font: inherit;\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-base);\n  cursor: pointer;\n\n  &:focus-visible {\n    outline: none;\n\n    & .tabs__tab-label {\n      border-radius: var(--s-border-radius-s);\n      box-shadow: inset 0 0 0 0.125rem var(--s-focus-default);\n    }\n  }\n\n  &:not(.tabs__tab--active) {\n    &:hover {\n      &:after {\n        position: absolute;\n        bottom: 0;\n        left: 50%;\n        width: calc(100% - var(--s-space-8));\n        height: 0.1875rem;\n        border-radius: 0.125rem;\n        background-color: var(--s-border-default);\n        content: \"\";\n        transform: translateX(-50%);\n        pointer-events: none;\n      }\n    }\n  }\n}\n\n.tabs__tab-label {\n  display: block;\n  overflow: hidden;\n  width: 100%;\n  padding: var(--s-space-8) var(--s-space-8);\n  text-align: center;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.tabs__tab--active {\n  color: var(--s-text-highlight);\n\n  &:after {\n    position: absolute;\n    bottom: 0;\n    left: 50%;\n    width: calc(100% - var(--s-space-8));\n    height: 0.1875rem;\n    border-radius: 0.125rem;\n    background-color: var(--s-border-highlight);\n    content: \"\";\n    transform: translateX(-50%);\n    pointer-events: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from \"@stencil/core\";\nimport classnames from \"classnames\";\n\n@Component({\n  scoped: true,\n  shadow: false,\n  styleUrl: \"flip-tabs.css\",\n  tag: \"flip-tabs\",\n})\nexport class FlipTabs {\n  @Element() el: HTMLElement;\n\n  @Prop() initialTab?: string;\n  @Prop() label!: string;\n\n  @State() activeTab?: string;\n\n  @Event() tabActivated: EventEmitter<HTMLFlipTabElement>;\n\n  private tabs: HTMLFlipTabElement[] = [];\n\n  componentWillLoad() {\n    this.collectTabs();\n  }\n\n  /**\n   * Activate a tab.\n   * @param tabId\n   */\n  @Method()\n  public async activateTab(tabId: string) {\n    if (this.activeTab === tabId) {\n      return;\n    }\n\n    this.activeTab = tabId;\n    this.tabs.forEach((tab) => (tab.active = false));\n\n    const tab = this.tabs.find((tab) => tab.tabId === tabId);\n\n    if (!Boolean(tab)) {\n      return;\n    }\n\n    tab.active = true;\n    this.tabActivated.emit(tab);\n  }\n\n  private activateNextTab() {\n    const currentIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.activeTab\n    );\n\n    const nextIndex = Math.min(this.tabs.length - 1, currentIndex + 1);\n\n    this.activateTab(this.tabs[nextIndex].tabId);\n\n    requestAnimationFrame(() => {\n      this.el.querySelector<HTMLButtonElement>(\".tabs__tab--active\")?.focus();\n    });\n  }\n\n  private activatePreviousTab() {\n    const currentIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.activeTab\n    );\n\n    const previousIndex = Math.max(0, currentIndex - 1);\n\n    this.activateTab(this.tabs[previousIndex].tabId);\n\n    requestAnimationFrame(() => {\n      this.el.querySelector<HTMLButtonElement>(\".tabs__tab--active\")?.focus();\n    });\n  }\n\n  private collectTabs() {\n    this.tabs = Array.from(this.el.querySelectorAll(\"flip-tab\"));\n\n    if (this.tabs.length === 0) {\n      return;\n    }\n\n    const initialTab = this.tabs.find((tab) => tab.tabId === this.initialTab);\n\n    this.activateTab(\n      Boolean(initialTab) ? initialTab.tabId : this.tabs[0].tabId\n    );\n  }\n\n  private onKeyDown = (event: KeyboardEvent) => {\n    if (event.code === \"ArrowLeft\") {\n      event.preventDefault();\n      this.activatePreviousTab();\n    } else if (event.code === \"ArrowRight\") {\n      event.preventDefault();\n      this.activateNextTab();\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"tabs\">\n          <div\n            aria-label={this.label}\n            class=\"tabs__tab-bar\"\n            onKeyDown={this.onKeyDown}\n            role=\"tablist\"\n          >\n            {this.tabs.map((tab) => {\n              const isActive = tab.tabId === this.activeTab;\n              const className = classnames(\"tabs__tab\", {\n                \"tabs__tab--active\": isActive,\n              });\n\n              return (\n                <button\n                  aria-controls={tab.tabId}\n                  aria-selected={isActive ? \"true\" : \"false\"}\n                  class={className}\n                  id={`tab-${tab.tabId}`}\n                  key={tab.tabId}\n                  // eslint-disable-next-line react/jsx-no-bind\n                  onClick={() => this.activateTab(tab.tabId)}\n                  role=\"tab\"\n                  tabIndex={isActive ? 0 : -1}\n                  type=\"button\"\n                >\n                  <span class=\"tabs__tab-label\">{tab.label}</span>\n                </button>\n              );\n            })}\n          </div>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/swirl-components/p-b1532bdb.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as t,H as s,g as o}from"./p-9fe00e8a.js";import{A as e}from"./p-fe0b5250.js";import{d as n,e as a}from"./p-33c168b3.js";import{c as l}from"./p-efffd297.js";import{q as h}from"./p-db7b3635.js";import"./p-86bd3473.js";const r=':host{display:block}:host *{box-sizing:border-box}.lightbox{position:fixed;z-index:var(--s-z-40);background-color:rgba(0, 0, 0, 1);inset:0}.lightbox[aria-hidden="true"]{display:none}@media (min-width: 768px){.lightbox{background-color:rgba(0, 0, 0, 0.6)}}.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:0.15s lightbox-fade-in;animation:0.15s lightbox-fade-in}@media (prefers-reduced-motion){.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:none;animation:none}}.lightbox--closing{-webkit-animation:0.15s lightbox-fade-out;animation:0.15s lightbox-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.lightbox--closing{-webkit-animation:none;animation:none}}.lightbox__body{position:relative;width:100%;height:100%}.lightbox__header{position:absolute;z-index:1;top:0;right:0;left:0;display:flex;padding:var(--s-space-12) var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}.lightbox__controls{position:absolute;z-index:1;top:50%;right:0;left:0;display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}@media (min-width: 768px){.lightbox__controls{display:flex}}.lightbox__close-button,.lightbox__download-button,.lightbox__previous-slide-button,.lightbox__next-slide-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.lightbox__close-button:disabled,.lightbox__download-button:disabled,.lightbox__previous-slide-button:disabled,.lightbox__next-slide-button:disabled{pointer-events:none;opacity:0}.lightbox__content{overflow:hidden;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lightbox__slides{display:flex;width:100%;height:100%}.lightbox__slides ::slotted(*){flex-basis:100%;flex-shrink:0;transition:transform 0.3s}@media (min-width: 768px){.lightbox__slides ::slotted(*){padding:4rem 5rem}}@media (prefers-reduced-motion){.lightbox__slides ::slotted(*){transition:none}}.lightbox__pagination{position:absolute;bottom:var(--s-space-32);left:50%;padding:var(--s-space-4) var(--s-space-12);border-radius:var(--s-border-radius-base);color:var(--s-text-on-image);background-color:rgba(0, 0, 0, 0.6);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);transform:translateX(-50%);pointer-events:none}@media (min-width: 768px){.lightbox__pagination{display:none}}@-webkit-keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}@keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}';const d=class{constructor(t){i(this,t);this.closeButtonLabel="Close modal";this.downloadButtonLabel="Download active slide content";this.nextSlideButtonLabel="Next slide";this.previousSlideButtonLabel="Previous slide";this.activeSlideIndex=0;this.closing=false;this.dragging=false;this.mediaPlayers=[];this.onCloseButtonClick=()=>{this.close()};this.onDownloadButtonClick=()=>{var i;(i=this.slides[this.activeSlideIndex])===null||i===void 0?void 0:i.download()};this.onKeyDown=i=>{if(i.code==="Escape"){this.close()}else if(i.code==="ArrowLeft"){this.onPreviousSlideClick()}else if(i.code==="ArrowRight"){this.onNextSlideClick()}};this.onNextSlideClick=()=>{this.activateSlide(Math.min(this.slides.length-1,this.activeSlideIndex+1))};this.onPreviousSlideClick=()=>{this.activateSlide(Math.max(0,this.activeSlideIndex-1))};this.registerSlides=()=>{this.slides=Array.from(this.el.children);this.setSlideAttributes();this.updateMediaPlayers()};this.onPointerDown=i=>{i.preventDefault();this.dragging=true;this.dragStartPosition=i instanceof MouseEvent?i.clientX:i.touches[0].clientX;this.slides.forEach((i=>{i.style.transition="none"}))};this.onPointerMove=i=>{if(this.dragging){i.preventDefault();const t=i instanceof MouseEvent?i.clientX-this.dragStartPosition:i.touches[0].clientX-this.dragStartPosition;this.slides.forEach((i=>{const s=this.activeSlideIndex*i.getBoundingClientRect().width;this.dragDelta=t;i.style.transform=`translate3d(${(-s+this.dragDelta)/16}rem, 0, 0)`}))}};this.onPointerUp=()=>{this.dragging=false;this.dragStartPosition=undefined;const i=this.dragDelta/this.slides[this.activeSlideIndex].getBoundingClientRect().width;this.dragDelta=0;const t=i>.2;const s=i<-.2;this.slides.forEach((i=>{i.style.transition=""}));if(t){this.onPreviousSlideClick()}else if(s){this.onNextSlideClick()}else{this.resetSlidePositions()}}}componentWillLoad(){this.registerSlides()}componentDidLoad(){this.modal=new e(this.modalEl);this.activateSlide(0)}disconnectedCallback(){var i;(i=this.modal)===null||i===void 0?void 0:i.destroy();this.unlockBodyScroll()}async open(){this.modal.show();this.lockBodyScroll()}async close(){if(this.closing){return}this.closing=true;this.unlockBodyScroll();setTimeout((()=>{this.modal.hide();this.closing=false}),150)}async activateSlide(i){this.dragging=false;this.activeSlideIndex=i;this.slides.forEach(((i,t)=>{if(t===this.activeSlideIndex){i.removeAttribute("aria-hidden");i.setAttribute("active","true")}else if(t===this.activeSlideIndex-1||t===this.activeSlideIndex+1){i.setAttribute("aria-hidden","true");i.setAttribute("active","true")}else{i.setAttribute("aria-hidden","true")}i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`}));setTimeout((()=>{this.slides.forEach(((i,t)=>{if(t!==this.activeSlideIndex&&t!==this.activeSlideIndex-1&&t!==this.activeSlideIndex+1){i.setAttribute("active","false")}}))}),300);this.stopAllMediaPlayers();this.updateMediaPlayers()}setSlideAttributes(){this.slides.forEach((i=>{i.setAttribute("active","false");i.setAttribute("aria-label",i.file);i.setAttribute("aria-roledescription","slide");i.setAttribute("role","group")}))}resetSlidePositions(){this.slides.forEach((i=>{i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`}))}lockBodyScroll(){n(this.el)}unlockBodyScroll(){a(this.el)}updateMediaPlayers(){const i=h(this.el,"video");this.mediaPlayers=i}stopAllMediaPlayers(){this.mediaPlayers.forEach((i=>i.pause()))}render(){const i=this.slides.length>1;const o=l("lightbox",{"lightbox--closing":this.closing});return t(s,null,t("section",{"aria-hidden":"true","aria-label":this.label,class:o,id:"lightbox",onMouseDown:this.onPointerDown,onMouseMove:this.onPointerMove,onMouseOut:this.onPointerUp,onMouseUp:this.onPointerUp,onKeyDown:this.onKeyDown,onTouchEnd:this.onPointerUp,onTouchMove:this.onPointerMove,onTouchStart:this.onPointerDown,ref:i=>this.modalEl=i},t("div",{class:"lightbox__body",role:"document"},t("header",{class:"lightbox__header"},t("button",{"aria-label":this.closeButtonLabel,class:"lightbox__close-button",onClick:this.onCloseButtonClick},t("flip-icon-close",null)),t("button",{"aria-label":this.downloadButtonLabel,class:"lightbox__download-button",onClick:this.onDownloadButtonClick},t("flip-icon-download",null))),t("div",{"aria-roledescription":"carousel",class:"lightbox__content",role:"group"},t("div",{"aria-atomic":"false","aria-live":"polite",class:"lightbox__slides"},t("slot",{onSlotchange:this.registerSlides}))),t("div",{class:"lightbox__controls"},t("button",{"aria-label":this.previousSlideButtonLabel,class:"lightbox__previous-slide-button",disabled:this.activeSlideIndex===0,onClick:this.onPreviousSlideClick},t("flip-icon-arrow-left",null)),t("button",{"aria-label":this.nextSlideButtonLabel,class:"lightbox__next-slide-button",disabled:this.activeSlideIndex===this.slides.length-1,onClick:this.onNextSlideClick},t("flip-icon-arrow-right",null))),i&&t("span",{class:"lightbox__pagination"},t("span",{"aria-current":"page"},this.activeSlideIndex+1)," /"," ",this.slides.length))))}get el(){return o(this)}};d.style=r;export{d as flip_lightbox};
+//# sourceMappingURL=p-b1532bdb.entry.js.map

package/dist/swirl-components/p-b1532bdb.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/flip-lightbox/flip-lightbox.css?tag=flip-lightbox&encapsulation=shadow","src/components/flip-lightbox/flip-lightbox.tsx"],"names":["flipLightboxCss","FlipLightbox","[object Object]","hostRef","this","closeButtonLabel","downloadButtonLabel","nextSlideButtonLabel","previousSlideButtonLabel","activeSlideIndex","closing","dragging","mediaPlayers","onCloseButtonClick","close","onDownloadButtonClick","_a","slides","download","onKeyDown","event","code","onPreviousSlideClick","onNextSlideClick","activateSlide","Math","min","length","max","registerSlides","Array","from","el","children","setSlideAttributes","updateMediaPlayers","onPointerDown","preventDefault","dragStartPosition","MouseEvent","clientX","touches","forEach","slide","style","transition","onPointerMove","deltaX","pixelOffset","getBoundingClientRect","width","dragDelta","transform","onPointerUp","undefined","dragRatio","shouldMoveToPreviousSlide","shouldMoveToNextSlide","resetSlidePositions","modal","A11yDialog","modalEl","destroy","unlockBodyScroll","show","lockBodyScroll","setTimeout","hide","newActiveSlideIndex","index","removeAttribute","setAttribute","stopAllMediaPlayers","file","disableBodyScroll","enableBodyScroll","querySelectorAllDeep","mediaPlayer","pause","showPagination","className","classnames","lightbox--closing","h","Host","aria-hidden","aria-label","label","class","id","onMouseDown","onMouseMove","onMouseOut","onMouseUp","onTouchEnd","onTouchMove","onTouchStart","ref","role","onClick","aria-roledescription","aria-atomic","aria-live","onSlotchange","disabled","aria-current"],"mappings":"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","sourcesContent":["@import \"../../styles/media-queries.css\";\n\n:host {\n  display: block;\n\n  & * {\n    box-sizing: border-box;\n  }\n}\n\n.lightbox {\n  position: fixed;\n  z-index: var(--s-z-40);\n  background-color: rgba(0, 0, 0, 1);\n  inset: 0;\n\n  &[aria-hidden=\"true\"] {\n    display: none;\n  }\n\n  @media (--from-tablet) {\n    background-color: rgba(0, 0, 0, 0.6);\n  }\n}\n\n.lightbox:not(.lightbox--closing) {\n  & .lightbox__body {\n    animation: 0.15s lightbox-fade-in;\n\n    @media (prefers-reduced-motion) {\n      animation: none;\n    }\n  }\n}\n\n.lightbox--closing {\n  animation: 0.15s lightbox-fade-out;\n  animation-fill-mode: forwards;\n\n  @media (prefers-reduced-motion) {\n    animation: none;\n  }\n}\n\n.lightbox__body {\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n\n.lightbox__header {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  left: 0;\n  display: flex;\n  padding: var(--s-space-12) var(--s-space-16);\n  justify-content: space-between;\n  align-items: flex-start;\n  pointer-events: none;\n}\n\n.lightbox__controls {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  right: 0;\n  left: 0;\n  display: none;\n  padding-right: var(--s-space-16);\n  padding-left: var(--s-space-16);\n  justify-content: space-between;\n  align-items: flex-start;\n  pointer-events: none;\n\n  @media (--from-tablet) {\n    display: flex;\n  }\n}\n\n.lightbox__close-button,\n.lightbox__download-button,\n.lightbox__previous-slide-button,\n.lightbox__next-slide-button {\n  display: inline-flex;\n  width: 2.5rem;\n  height: 2.5rem;\n  justify-content: center;\n  align-items: center;\n  border: none;\n  border-radius: 50%;\n  color: var(--s-icon-on-image);\n  background-color: rgba(0, 0, 0, 0.6);\n  cursor: pointer;\n  transition: opacity 0.15s;\n  pointer-events: auto;\n\n  &:disabled {\n    pointer-events: none;\n    opacity: 0;\n  }\n}\n\n.lightbox__content {\n  overflow: hidden;\n  width: 100%;\n  height: 100%;\n  user-select: none;\n}\n\n.lightbox__slides {\n  display: flex;\n  width: 100%;\n  height: 100%;\n\n  & ::slotted(*) {\n    flex-basis: 100%;\n    flex-shrink: 0;\n    transition: transform 0.3s;\n\n    @media (--from-tablet) {\n      padding: 4rem 5rem;\n    }\n\n    @media (prefers-reduced-motion) {\n      transition: none;\n    }\n  }\n}\n\n.lightbox__pagination {\n  position: absolute;\n  bottom: var(--s-space-32);\n  left: 50%;\n  padding: var(--s-space-4) var(--s-space-12);\n  border-radius: var(--s-border-radius-base);\n  color: var(--s-text-on-image);\n  background-color: rgba(0, 0, 0, 0.6);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-base);\n  transform: translateX(-50%);\n  pointer-events: none;\n\n  @media (--from-tablet) {\n    display: none;\n  }\n}\n\n@keyframes lightbox-fade-in {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes lightbox-fade-out {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}\n","import {\n  Component,\n  Element,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from \"@stencil/core\";\nimport A11yDialog from \"a11y-dialog\";\nimport { disableBodyScroll, enableBodyScroll } from \"body-scroll-lock\";\nimport classnames from \"classnames\";\nimport { querySelectorAllDeep } from \"../../utils\";\n\n@Component({\n  shadow: true,\n  styleUrl: \"flip-lightbox.css\",\n  tag: \"flip-lightbox\",\n})\nexport class FlipLightbox {\n  @Element() el: HTMLElement;\n\n  @Prop() closeButtonLabel?: string = \"Close modal\";\n  @Prop() downloadButtonLabel?: string = \"Download active slide content\";\n  @Prop() label!: string;\n  @Prop() nextSlideButtonLabel?: string = \"Next slide\";\n  @Prop() previousSlideButtonLabel?: string = \"Previous slide\";\n\n  @State() activeSlideIndex: number = 0;\n  @State() closing = false;\n  @State() slides: HTMLFlipFileViewerElement[];\n\n  private dragging: boolean = false;\n  private dragStartPosition: number;\n  private dragDelta: number;\n  private modal: A11yDialog;\n  private modalEl: HTMLElement;\n  private mediaPlayers: (HTMLVideoElement | HTMLAudioElement)[] = [];\n\n  componentWillLoad() {\n    this.registerSlides();\n  }\n\n  componentDidLoad() {\n    this.modal = new A11yDialog(this.modalEl);\n    this.activateSlide(0);\n  }\n\n  disconnectedCallback() {\n    this.modal?.destroy();\n    this.unlockBodyScroll();\n  }\n\n  /**\n   * Open the lightbox.\n   */\n  @Method()\n  async open() {\n    this.modal.show();\n    this.lockBodyScroll();\n  }\n\n  /**\n   * Close the lightbox.\n   */\n  @Method()\n  async close() {\n    if (this.closing) {\n      return;\n    }\n\n    this.closing = true;\n    this.unlockBodyScroll();\n\n    setTimeout(() => {\n      this.modal.hide();\n      this.closing = false;\n    }, 150);\n  }\n\n  /**\n   * Activate a slide.\n   * @param newActiveSlideIndex\n   */\n  @Method()\n  async activateSlide(newActiveSlideIndex: number) {\n    this.dragging = false;\n    this.activeSlideIndex = newActiveSlideIndex;\n\n    this.slides.forEach((slide, index) => {\n      if (index === this.activeSlideIndex) {\n        slide.removeAttribute(\"aria-hidden\");\n        slide.setAttribute(\"active\", \"true\");\n      } else if (\n        index === this.activeSlideIndex - 1 ||\n        index === this.activeSlideIndex + 1\n      ) {\n        slide.setAttribute(\"aria-hidden\", \"true\");\n        slide.setAttribute(\"active\", \"true\");\n      } else {\n        slide.setAttribute(\"aria-hidden\", \"true\");\n      }\n\n      slide.style.transform = `translate3d(-${\n        100 * this.activeSlideIndex\n      }%, 0, 0)`;\n    });\n\n    // wait for slide animation before deactivating the slide\n    setTimeout(() => {\n      this.slides.forEach((slide, index) => {\n        if (\n          index !== this.activeSlideIndex &&\n          index !== this.activeSlideIndex - 1 &&\n          index !== this.activeSlideIndex + 1\n        ) {\n          slide.setAttribute(\"active\", \"false\");\n        }\n      });\n    }, 300);\n\n    this.stopAllMediaPlayers();\n    this.updateMediaPlayers();\n  }\n\n  private setSlideAttributes() {\n    this.slides.forEach((slide) => {\n      slide.setAttribute(\"active\", \"false\");\n      slide.setAttribute(\"aria-label\", slide.file);\n      slide.setAttribute(\"aria-roledescription\", \"slide\");\n      slide.setAttribute(\"role\", \"group\");\n    });\n  }\n\n  private resetSlidePositions() {\n    this.slides.forEach((slide) => {\n      slide.style.transform = `translate3d(-${\n        100 * this.activeSlideIndex\n      }%, 0, 0)`;\n    });\n  }\n\n  private lockBodyScroll() {\n    disableBodyScroll(this.el);\n  }\n\n  private unlockBodyScroll() {\n    enableBodyScroll(this.el);\n  }\n\n  private onCloseButtonClick = () => {\n    this.close();\n  };\n\n  private onDownloadButtonClick = () => {\n    this.slides[this.activeSlideIndex]?.download();\n  };\n\n  private onKeyDown = (event: KeyboardEvent) => {\n    if (event.code === \"Escape\") {\n      this.close();\n    } else if (event.code === \"ArrowLeft\") {\n      this.onPreviousSlideClick();\n    } else if (event.code === \"ArrowRight\") {\n      this.onNextSlideClick();\n    }\n  };\n\n  private onNextSlideClick = () => {\n    this.activateSlide(\n      Math.min(this.slides.length - 1, this.activeSlideIndex + 1)\n    );\n  };\n\n  private onPreviousSlideClick = () => {\n    this.activateSlide(Math.max(0, this.activeSlideIndex - 1));\n  };\n\n  private registerSlides = () => {\n    this.slides = Array.from(this.el.children) as HTMLFlipFileViewerElement[];\n    this.setSlideAttributes();\n    this.updateMediaPlayers();\n  };\n\n  private updateMediaPlayers() {\n    const mediaPlayers = querySelectorAllDeep<\n      HTMLAudioElement | HTMLVideoElement\n    >(this.el, \"video\");\n\n    this.mediaPlayers = mediaPlayers;\n  }\n\n  private stopAllMediaPlayers() {\n    this.mediaPlayers.forEach((mediaPlayer) => mediaPlayer.pause());\n  }\n\n  private onPointerDown = (event: MouseEvent | TouchEvent) => {\n    event.preventDefault();\n\n    this.dragging = true;\n\n    this.dragStartPosition =\n      event instanceof MouseEvent ? event.clientX : event.touches[0].clientX;\n\n    this.slides.forEach((slide) => {\n      slide.style.transition = \"none\";\n    });\n  };\n\n  private onPointerMove = (event: MouseEvent | TouchEvent) => {\n    if (this.dragging) {\n      event.preventDefault();\n\n      const deltaX =\n        event instanceof MouseEvent\n          ? event.clientX - this.dragStartPosition\n          : event.touches[0].clientX - this.dragStartPosition;\n\n      this.slides.forEach((slide) => {\n        const pixelOffset =\n          this.activeSlideIndex * slide.getBoundingClientRect().width;\n\n        this.dragDelta = deltaX;\n\n        slide.style.transform = `translate3d(${\n          (-pixelOffset + this.dragDelta) / 16\n        }rem, 0, 0)`;\n      });\n    }\n  };\n\n  private onPointerUp = () => {\n    this.dragging = false;\n    this.dragStartPosition = undefined;\n\n    const dragRatio =\n      this.dragDelta /\n      this.slides[this.activeSlideIndex].getBoundingClientRect().width;\n\n    this.dragDelta = 0;\n\n    const shouldMoveToPreviousSlide = dragRatio > 0.2;\n    const shouldMoveToNextSlide = dragRatio < -0.2;\n\n    this.slides.forEach((slide) => {\n      slide.style.transition = \"\";\n    });\n\n    if (shouldMoveToPreviousSlide) {\n      this.onPreviousSlideClick();\n    } else if (shouldMoveToNextSlide) {\n      this.onNextSlideClick();\n    } else {\n      this.resetSlidePositions();\n    }\n  };\n\n  render() {\n    const showPagination = this.slides.length > 1;\n\n    const className = classnames(\"lightbox\", {\n      \"lightbox--closing\": this.closing,\n    });\n\n    return (\n      <Host>\n        <section\n          aria-hidden=\"true\"\n          aria-label={this.label}\n          class={className}\n          id=\"lightbox\"\n          onMouseDown={this.onPointerDown}\n          onMouseMove={this.onPointerMove}\n          onMouseOut={this.onPointerUp}\n          onMouseUp={this.onPointerUp}\n          onKeyDown={this.onKeyDown}\n          onTouchEnd={this.onPointerUp}\n          onTouchMove={this.onPointerMove}\n          onTouchStart={this.onPointerDown}\n          ref={(el) => (this.modalEl = el)}\n        >\n          <div class=\"lightbox__body\" role=\"document\">\n            <header class=\"lightbox__header\">\n              <button\n                aria-label={this.closeButtonLabel}\n                class=\"lightbox__close-button\"\n                onClick={this.onCloseButtonClick}\n              >\n                <flip-icon-close></flip-icon-close>\n              </button>\n              <button\n                aria-label={this.downloadButtonLabel}\n                class=\"lightbox__download-button\"\n                onClick={this.onDownloadButtonClick}\n              >\n                <flip-icon-download></flip-icon-download>\n              </button>\n            </header>\n            <div\n              aria-roledescription=\"carousel\"\n              class=\"lightbox__content\"\n              role=\"group\"\n            >\n              <div\n                aria-atomic=\"false\"\n                aria-live=\"polite\"\n                class=\"lightbox__slides\"\n              >\n                <slot onSlotchange={this.registerSlides}></slot>\n              </div>\n            </div>\n            <div class=\"lightbox__controls\">\n              <button\n                aria-label={this.previousSlideButtonLabel}\n                class=\"lightbox__previous-slide-button\"\n                disabled={this.activeSlideIndex === 0}\n                onClick={this.onPreviousSlideClick}\n              >\n                <flip-icon-arrow-left></flip-icon-arrow-left>\n              </button>\n              <button\n                aria-label={this.nextSlideButtonLabel}\n                class=\"lightbox__next-slide-button\"\n                disabled={this.activeSlideIndex === this.slides.length - 1}\n                onClick={this.onNextSlideClick}\n              >\n                <flip-icon-arrow-right></flip-icon-arrow-right>\n              </button>\n            </div>\n            {showPagination && (\n              <span class=\"lightbox__pagination\">\n                <span aria-current=\"page\">{this.activeSlideIndex + 1}</span> /{\" \"}\n                {this.slides.length}\n              </span>\n            )}\n          </div>\n        </section>\n      </Host>\n    );\n  }\n}\n"]}