@holochain-open-dev/file-storage 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18,7 +18,7 @@ export declare class ShowImage extends ShowImage_base {
18
18
  /**
19
19
  * @internal
20
20
  */
21
- _client: FileStorageClient;
21
+ client: FileStorageClient;
22
22
  /**
23
23
  * @internal
24
24
  */
@@ -7,12 +7,13 @@ import { consume } from "@lit-labs/context";
7
7
  import { Task } from "@lit-labs/task";
8
8
  import { SlSkeleton } from "@scoped-elements/shoelace";
9
9
  import { fromUint8Array } from "js-base64";
10
+ import { localized, msg } from "@lit/localize";
10
11
  import { fileStorageClientContext } from "../context";
11
12
  /**
12
13
  * @fires file-uploaded - Fired after having uploaded the file
13
14
  * @csspart dropzone - Style the dropzone itself
14
15
  */
15
- export class ShowImage extends ScopedElementsMixin(LitElement) {
16
+ let ShowImage = class ShowImage extends ScopedElementsMixin(LitElement) {
16
17
  constructor() {
17
18
  /** Public attributes */
18
19
  super(...arguments);
@@ -20,7 +21,7 @@ export class ShowImage extends ScopedElementsMixin(LitElement) {
20
21
  * @internal
21
22
  */
22
23
  this._renderImage = new Task(this, async ([fileHash]) => {
23
- const file = await this._client.downloadFile(fileHash);
24
+ const file = await this.client.downloadFile(fileHash);
24
25
  const data = await file.arrayBuffer();
25
26
  return [file, new Uint8Array(data)];
26
27
  }, () => [this.imageHash]);
@@ -32,7 +33,9 @@ export class ShowImage extends ScopedElementsMixin(LitElement) {
32
33
  return this._renderImage.render({
33
34
  complete: ([f, d]) => this.renderImage(f, d),
34
35
  pending: () => html `<sl-skeleton effect="pulse" style="flex: 1"></sl-skeleton>`,
35
- error: (e) => html `<display-error .error=${e.data.data}></display-error>`,
36
+ error: (e) => html `<display-error
37
+ .headline=${msg("Error fetching the image")}
38
+ ></display-error>`,
36
39
  });
37
40
  }
38
41
  static get styles() {
@@ -52,11 +55,15 @@ export class ShowImage extends ScopedElementsMixin(LitElement) {
52
55
  static get scopedElements() {
53
56
  return { "sl-skeleton": SlSkeleton, "display-error": DisplayError };
54
57
  }
55
- }
58
+ };
56
59
  __decorate([
57
60
  property(hashProperty("image-hash"))
58
61
  ], ShowImage.prototype, "imageHash", void 0);
59
62
  __decorate([
60
63
  consume({ context: fileStorageClientContext })
61
- ], ShowImage.prototype, "_client", void 0);
64
+ ], ShowImage.prototype, "client", void 0);
65
+ ShowImage = __decorate([
66
+ localized()
67
+ ], ShowImage);
68
+ export { ShowImage };
62
69
  //# sourceMappingURL=show-image.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"show-image.js","sourceRoot":"","sources":["../../src/elements/show-image.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,YAAY,GACb,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAG5C,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAG3C,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAEtD;;;GAGG;AACH,MAAM,OAAO,SAAU,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAA9D;QACE,wBAAwB;;QAaxB;;WAEG;QACH,iBAAY,GAAG,IAAI,IAAI,CACrB,IAAI,EACJ,KAAK,EAAE,CAAC,QAAQ,CAAC,EAAE,EAAE;YACnB,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACvD,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,WAAW,EAAE,CAAC;YAEtC,OAAO,CAAC,IAAI,EAAE,IAAI,UAAU,CAAC,IAAI,CAAC,CAAuB,CAAC;QAC5D,CAAC,EACD,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CACvB,CAAC;IAoCJ,CAAC;IAlCC,WAAW,CAAC,IAAU,EAAE,IAAgB;QACtC,OAAO,IAAI,CAAA,kBAAkB,IAAI,CAAC,IAAI,WAAW,cAAc,CAC7D,IAAI,CACL,0BAA0B,CAAC;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;YAC9B,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC;YAC5C,OAAO,EAAE,GAAG,EAAE,CACZ,IAAI,CAAA,4DAA4D;YAClE,KAAK,EAAE,CAAC,CAAM,EAAE,EAAE,CAChB,IAAI,CAAA,yBAAyB,CAAC,CAAC,IAAI,CAAC,IAAI,mBAAmB;SAC9D,CAAC,CAAC;IACL,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,YAAY;YACZ,GAAG,CAAA;;;;;OAKF;SACF,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,MAAM,KAAK,cAAc;QACvB,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,eAAe,EAAE,YAAY,EAAE,CAAC;IACtE,CAAC;CACF;AAxDuC;IAArC,QAAQ,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;4CAAuB;AAM5D;IADC,OAAO,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,CAAC;0CACnB","sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport {\n DisplayError,\n hashProperty,\n sharedStyles,\n} from \"@holochain-open-dev/elements\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { consume } from \"@lit-labs/context\";\n\nimport { EntryHash } from \"@holochain/client\";\nimport { Task } from \"@lit-labs/task\";\nimport { SlSkeleton } from \"@scoped-elements/shoelace\";\nimport { fromUint8Array } from \"js-base64\";\n\nimport { FileStorageClient } from \"../file-storage-client\";\nimport { fileStorageClientContext } from \"../context\";\n\n/**\n * @fires file-uploaded - Fired after having uploaded the file\n * @csspart dropzone - Style the dropzone itself\n */\nexport class ShowImage extends ScopedElementsMixin(LitElement) {\n /** Public attributes */\n\n /**\n * REQUIRED. The hash of the image to be rendered\n */\n @property(hashProperty(\"image-hash\")) imageHash!: EntryHash;\n\n /**\n * @internal\n */\n @consume({ context: fileStorageClientContext })\n _client!: FileStorageClient;\n\n /**\n * @internal\n */\n _renderImage = new Task(\n this,\n async ([fileHash]) => {\n const file = await this._client.downloadFile(fileHash);\n const data = await file.arrayBuffer();\n\n return [file, new Uint8Array(data)] as [File, Uint8Array];\n },\n () => [this.imageHash]\n );\n\n renderImage(file: File, data: Uint8Array) {\n return html`<img src=\"data:${file.type};base64,${fromUint8Array(\n data\n )}\" style=\"flex: 1\"></img>`;\n }\n\n render() {\n return this._renderImage.render({\n complete: ([f, d]) => this.renderImage(f, d),\n pending: () =>\n html`<sl-skeleton effect=\"pulse\" style=\"flex: 1\"></sl-skeleton>`,\n error: (e: any) =>\n html`<display-error .error=${e.data.data}></display-error>`,\n });\n }\n\n static get styles() {\n return [\n sharedStyles,\n css`\n :host {\n display: flex;\n flex: 1;\n }\n `,\n ];\n }\n\n /**\n * @internal\n */\n static get scopedElements() {\n return { \"sl-skeleton\": SlSkeleton, \"display-error\": DisplayError };\n }\n}\n"]}
1
+ {"version":3,"file":"show-image.js","sourceRoot":"","sources":["../../src/elements/show-image.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EACL,YAAY,EACZ,YAAY,EACZ,YAAY,GACb,MAAM,8BAA8B,CAAC;AACtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAG5C,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAG/C,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAEtD;;;GAGG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAAvD;QACL,wBAAwB;;QAaxB;;WAEG;QACH,iBAAY,GAAG,IAAI,IAAI,CACrB,IAAI,EACJ,KAAK,EAAE,CAAC,QAAQ,CAAC,EAAE,EAAE;YACnB,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACtD,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,WAAW,EAAE,CAAC;YAEtC,OAAO,CAAC,IAAI,EAAE,IAAI,UAAU,CAAC,IAAI,CAAC,CAAuB,CAAC;QAC5D,CAAC,EACD,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CACvB,CAAC;IAsCJ,CAAC;IApCC,WAAW,CAAC,IAAU,EAAE,IAAgB;QACtC,OAAO,IAAI,CAAA,kBAAkB,IAAI,CAAC,IAAI,WAAW,cAAc,CAC7D,IAAI,CACL,0BAA0B,CAAC;IAC9B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;YAC9B,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC;YAC5C,OAAO,EAAE,GAAG,EAAE,CACZ,IAAI,CAAA,4DAA4D;YAClE,KAAK,EAAE,CAAC,CAAM,EAAE,EAAE,CAChB,IAAI,CAAA;sBACU,GAAG,CAAC,0BAA0B,CAAC;0BAC3B;SACrB,CAAC,CAAC;IACL,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,YAAY;YACZ,GAAG,CAAA;;;;;OAKF;SACF,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,MAAM,KAAK,cAAc;QACvB,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,eAAe,EAAE,YAAY,EAAE,CAAC;IACtE,CAAC;CACF,CAAA;AA1DuC;IAArC,QAAQ,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;4CAAuB;AAM5D;IADC,OAAO,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,CAAC;yCACpB;AAZhB,SAAS;IADrB,SAAS,EAAE;GACC,SAAS,CAgErB;SAhEY,SAAS","sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport {\n DisplayError,\n hashProperty,\n sharedStyles,\n} from \"@holochain-open-dev/elements\";\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { consume } from \"@lit-labs/context\";\n\nimport { EntryHash } from \"@holochain/client\";\nimport { Task } from \"@lit-labs/task\";\nimport { SlSkeleton } from \"@scoped-elements/shoelace\";\nimport { fromUint8Array } from \"js-base64\";\nimport { localized, msg } from \"@lit/localize\";\n\nimport { FileStorageClient } from \"../file-storage-client\";\nimport { fileStorageClientContext } from \"../context\";\n\n/**\n * @fires file-uploaded - Fired after having uploaded the file\n * @csspart dropzone - Style the dropzone itself\n */\n@localized()\nexport class ShowImage extends ScopedElementsMixin(LitElement) {\n /** Public attributes */\n\n /**\n * REQUIRED. The hash of the image to be rendered\n */\n @property(hashProperty(\"image-hash\")) imageHash!: EntryHash;\n\n /**\n * @internal\n */\n @consume({ context: fileStorageClientContext })\n client!: FileStorageClient;\n\n /**\n * @internal\n */\n _renderImage = new Task(\n this,\n async ([fileHash]) => {\n const file = await this.client.downloadFile(fileHash);\n const data = await file.arrayBuffer();\n\n return [file, new Uint8Array(data)] as [File, Uint8Array];\n },\n () => [this.imageHash]\n );\n\n renderImage(file: File, data: Uint8Array) {\n return html`<img src=\"data:${file.type};base64,${fromUint8Array(\n data\n )}\" style=\"flex: 1\"></img>`;\n }\n\n render() {\n return this._renderImage.render({\n complete: ([f, d]) => this.renderImage(f, d),\n pending: () =>\n html`<sl-skeleton effect=\"pulse\" style=\"flex: 1\"></sl-skeleton>`,\n error: (e: any) =>\n html`<display-error\n .headline=${msg(\"Error fetching the image\")}\n ></display-error>`,\n });\n }\n\n static get styles() {\n return [\n sharedStyles,\n css`\n :host {\n display: flex;\n flex: 1;\n }\n `,\n ];\n }\n\n /**\n * @internal\n */\n static get scopedElements() {\n return { \"sl-skeleton\": SlSkeleton, \"display-error\": DisplayError };\n }\n}\n"]}
@@ -20,7 +20,7 @@ export declare class UploadFiles extends UploadFiles_base {
20
20
  * @internal
21
21
  */
22
22
  _client: FileStorageClient;
23
- /** Private properties */
23
+ clear(): void;
24
24
  firstUpdated(): void;
25
25
  render(): import("lit-html").TemplateResult<1>;
26
26
  static get styles(): import("lit").CSSResult[];
@@ -25,7 +25,10 @@ export class UploadFiles extends ScopedElementsMixin(LitElement) {
25
25
  */
26
26
  this.acceptedFiles = undefined;
27
27
  }
28
- /** Private properties */
28
+ clear() {
29
+ var _a;
30
+ ((_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById("dropzone")).clear();
31
+ }
29
32
  firstUpdated() {
30
33
  const client = this._client;
31
34
  this.defineScopedElement("drop-zone", class extends DropzoneElement {
@@ -37,6 +40,7 @@ export class UploadFiles extends ScopedElementsMixin(LitElement) {
37
40
  render() {
38
41
  return html `
39
42
  <drop-zone
43
+ id="dropzone"
40
44
  .oneFile=${this.oneFile}
41
45
  .acceptedFiles=${this.acceptedFiles}
42
46
  @file-uploaded=${(e) => (e.detail.hash = e.detail.file.hash)}
@@ -1 +1 @@
1
- {"version":3,"file":"upload-files.js","sourceRoot":"","sources":["../../src/elements/upload-files.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAE5C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAG5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAEtD;;;GAGG;AACH,MAAM,OAAO,WAAY,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAAhE;QACE,wBAAwB;;QAExB;;WAEG;QACiD,YAAO,GAAG,KAAK,CAAC;QAEpE;;;WAGG;QACsD,kBAAa,GAEtD,SAAS,CAAC;IA4C5B,CAAC;IApCC,yBAAyB;IAEzB,YAAY;QACV,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;QAE5B,IAAI,CAAC,mBAAmB,CACtB,WAAW,EACX,KAAM,SAAQ,eAAe;YAC3B,aAAa,CAAC,eAA4B,EAAE,OAAwB;gBAClE,OAAO,IAAI,iBAAiB,CAAC,eAAe,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;YACjE,CAAC;SACF,CACF,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;mBAEI,IAAI,CAAC,OAAO;yBACN,IAAI,CAAC,aAAa;yBAClB,CAAC,CAAc,EAAE,EAAE,CAClC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;;KAEzC,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,YAAY;YACZ,GAAG,CAAA;;;;OAIF;SACF,CAAC;IACJ,CAAC;CACF;AApDqD;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;4CAAiB;AAMX;IAAxD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;kDAE9B;AAM1B;IADC,OAAO,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,CAAC;4CACnB","sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { DropzoneElement } from \"@scoped-elements/dropzone\";\nimport { consume } from \"@lit-labs/context\";\nimport { DropzoneOptions } from \"dropzone\";\nimport { sharedStyles } from \"@holochain-open-dev/elements\";\n\nimport { FileStorageClient } from \"../file-storage-client\";\nimport { HolochainDropzone } from \"../holochain-dropzone\";\nimport { fileStorageClientContext } from \"../context\";\n\n/**\n * @fires file-uploaded - Fired after having uploaded the file\n * @csspart dropzone - Style the dropzone itself\n */\nexport class UploadFiles extends ScopedElementsMixin(LitElement) {\n /** Public attributes */\n\n /**\n * Whether this element should allow only file to be uploaded\n */\n @property({ type: Boolean, attribute: \"one-file\" }) oneFile = false;\n\n /**\n * The type of files accepted by this element\n * Learn how to use this here: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept\n */\n @property({ type: String, attribute: \"accepted-files\" }) acceptedFiles:\n | string\n | undefined = undefined;\n\n /**\n * @internal\n */\n @consume({ context: fileStorageClientContext })\n _client!: FileStorageClient;\n\n /** Private properties */\n\n firstUpdated() {\n const client = this._client;\n\n this.defineScopedElement(\n \"drop-zone\",\n class extends DropzoneElement {\n buildDropzone(dropzoneElement: HTMLElement, options: DropzoneOptions) {\n return new HolochainDropzone(dropzoneElement, client, options);\n }\n }\n );\n }\n\n render() {\n return html`\n <drop-zone\n .oneFile=${this.oneFile}\n .acceptedFiles=${this.acceptedFiles}\n @file-uploaded=${(e: CustomEvent) =>\n (e.detail.hash = e.detail.file.hash)}\n ></drop-zone>\n `;\n }\n\n static get styles() {\n return [\n sharedStyles,\n css`\n :host {\n display: contents;\n }\n `,\n ];\n }\n}\n"]}
1
+ {"version":3,"file":"upload-files.js","sourceRoot":"","sources":["../../src/elements/upload-files.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAmB,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAG5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAC;AAEtD;;;GAGG;AACH,MAAM,OAAO,WAAY,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAAhE;QACE,wBAAwB;;QAExB;;WAEG;QACiD,YAAO,GAAG,KAAK,CAAC;QAEpE;;;WAGG;QACsD,kBAAa,GAEtD,SAAS,CAAC;IAmD5B,CAAC;IA3CC,KAAK;;QACH,CAAC,MAAA,IAAI,CAAC,UAAU,0CAAE,cAAc,CAAC,UAAU,CAAqB,CAAA,CAAC,KAAK,EAAE,CAAC;IAC3E,CAAC;IAED,YAAY;QACV,MAAM,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;QAE5B,IAAI,CAAC,mBAAmB,CACtB,WAAW,EACX,KAAM,SAAQ,eAAe;YAC3B,aAAa,CAAC,eAA4B,EAAE,OAAwB;gBAClE,OAAO,IAAI,iBAAiB,CAC1B,eAAe,EACf,MAAM,EACN,OAAO,CACW,CAAC;YACvB,CAAC;SACF,CACF,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;;mBAGI,IAAI,CAAC,OAAO;yBACN,IAAI,CAAC,aAAa;yBAClB,CAAC,CAAc,EAAE,EAAE,CAClC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;;KAEzC,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,YAAY;YACZ,GAAG,CAAA;;;;OAIF;SACF,CAAC;IACJ,CAAC;CACF;AA3DqD;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;4CAAiB;AAMX;IAAxD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;kDAE9B;AAM1B;IADC,OAAO,CAAC,EAAE,OAAO,EAAE,wBAAwB,EAAE,CAAC;4CACnB","sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n\nimport { ScopedElementsMixin } from \"@open-wc/scoped-elements\";\nimport { DropzoneOptions, DropzoneElement } from \"@scoped-elements/dropzone\";\nimport { consume } from \"@lit-labs/context\";\nimport { sharedStyles } from \"@holochain-open-dev/elements\";\n\nimport { FileStorageClient } from \"../file-storage-client\";\nimport { HolochainDropzone } from \"../holochain-dropzone\";\nimport { fileStorageClientContext } from \"../context\";\n\n/**\n * @fires file-uploaded - Fired after having uploaded the file\n * @csspart dropzone - Style the dropzone itself\n */\nexport class UploadFiles extends ScopedElementsMixin(LitElement) {\n /** Public attributes */\n\n /**\n * Whether this element should allow only file to be uploaded\n */\n @property({ type: Boolean, attribute: \"one-file\" }) oneFile = false;\n\n /**\n * The type of files accepted by this element\n * Learn how to use this here: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept\n */\n @property({ type: String, attribute: \"accepted-files\" }) acceptedFiles:\n | string\n | undefined = undefined;\n\n /**\n * @internal\n */\n @consume({ context: fileStorageClientContext })\n _client!: FileStorageClient;\n\n clear() {\n (this.shadowRoot?.getElementById(\"dropzone\") as DropzoneElement).clear();\n }\n\n firstUpdated() {\n const client = this._client;\n\n this.defineScopedElement(\n \"drop-zone\",\n class extends DropzoneElement {\n buildDropzone(dropzoneElement: HTMLElement, options: DropzoneOptions) {\n return new HolochainDropzone(\n dropzoneElement,\n client,\n options\n ) as any as Dropzone;\n }\n }\n );\n }\n\n render() {\n return html`\n <drop-zone\n id=\"dropzone\"\n .oneFile=${this.oneFile}\n .acceptedFiles=${this.acceptedFiles}\n @file-uploaded=${(e: CustomEvent) =>\n (e.detail.hash = e.detail.file.hash)}\n ></drop-zone>\n `;\n }\n\n static get styles() {\n return [\n sharedStyles,\n css`\n :host {\n display: contents;\n }\n `,\n ];\n }\n}\n"]}
@@ -1,4 +1,5 @@
1
- import Dropzone, { DropzoneOptions } from "dropzone";
1
+ /// <reference types="dropzone" />
2
+ import { Dropzone, DropzoneOptions } from "@scoped-elements/dropzone";
2
3
  import { FileStorageClient } from "./file-storage-client";
3
4
  export declare class HolochainDropzone extends Dropzone {
4
5
  fileStorageClient: FileStorageClient;
@@ -1,4 +1,4 @@
1
- import Dropzone from "dropzone";
1
+ import { Dropzone } from "@scoped-elements/dropzone";
2
2
  export class HolochainDropzone extends Dropzone {
3
3
  constructor(el, fileStorageClient, options) {
4
4
  options.url = "https://holochain.org/"; // just to bypass the check.
@@ -1 +1 @@
1
- {"version":3,"file":"holochain-dropzone.js","sourceRoot":"","sources":["../src/holochain-dropzone.ts"],"names":[],"mappings":"AAAA,OAAO,QAA6B,MAAM,UAAU,CAAC;AAGrD,MAAM,OAAO,iBAAkB,SAAQ,QAAQ;IAE7C,YACE,EAAe,EACf,iBAAoC,EACpC,OAAwB;QAExB,OAAO,CAAC,GAAG,GAAG,wBAAwB,CAAC,CAAC,4BAA4B;QACpE,KAAK,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;QACnB,IAAI,CAAC,iBAAiB,GAAG,iBAAiB,CAAC;IAC7C,CAAC;IAED,WAAW,CAAC,KAA8B;QACxC,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC;IACtC,CAAC;IAED,KAAK,CAAC,uBAAuB,CAC3B,aAAsC;QAEtC,KAAK,MAAM,IAAI,IAAI,aAAa,EAAE;YAChC,IAAI;gBACF,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;gBACjD,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAClD,IAAI,EACJ,CAAC,WAAW,EAAE,SAAS,EAAE,EAAE;oBACzB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,EAAE,WAAW,GAAG,GAAG,EAAE,SAAS,CAAC,CAAC;gBAClE,CAAC,CACF,CAAC;gBACF,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC;gBACrC,IAAY,CAAC,IAAI,GAAG,IAAI,CAAC;gBAC1B,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;aAC7B;YAAC,OAAO,CAAC,EAAE;gBACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACjB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,EAAG,CAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAChD;SACF;IACH,CAAC;CACF","sourcesContent":["import Dropzone, { DropzoneOptions } from \"dropzone\";\nimport { FileStorageClient } from \"./file-storage-client\";\n\nexport class HolochainDropzone extends Dropzone {\n fileStorageClient: FileStorageClient;\n constructor(\n el: HTMLElement,\n fileStorageClient: FileStorageClient,\n options: DropzoneOptions\n ) {\n options.url = \"https://holochain.org/\"; // just to bypass the check.\n super(el, options);\n this.fileStorageClient = fileStorageClient;\n }\n\n uploadFiles(files: Dropzone.DropzoneFile[]) {\n this._uploadFilesToHolochain(files);\n }\n\n async _uploadFilesToHolochain(\n dropzoneFiles: Dropzone.DropzoneFile[]\n ): Promise<void> {\n for (const file of dropzoneFiles) {\n try {\n this.emit(\"sending\", file, undefined, undefined);\n const hash = await this.fileStorageClient.uploadFile(\n file,\n (percentatge, bytesSent) => {\n this.emit(\"uploadprogress\", file, percentatge * 100, bytesSent);\n }\n );\n this.emit(\"success\", file, undefined);\n (file as any).hash = hash;\n this.emit(\"complete\", file);\n } catch (e) {\n console.error(e);\n this.emit(\"error\", file, (e as any).data.data);\n }\n }\n }\n}\n"]}
1
+ {"version":3,"file":"holochain-dropzone.js","sourceRoot":"","sources":["../src/holochain-dropzone.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAmB,MAAM,2BAA2B,CAAC;AAGtE,MAAM,OAAO,iBAAkB,SAAQ,QAAQ;IAE7C,YACE,EAAe,EACf,iBAAoC,EACpC,OAAwB;QAExB,OAAO,CAAC,GAAG,GAAG,wBAAwB,CAAC,CAAC,4BAA4B;QACpE,KAAK,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;QACnB,IAAI,CAAC,iBAAiB,GAAG,iBAAiB,CAAC;IAC7C,CAAC;IAED,WAAW,CAAC,KAA8B;QACxC,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC;IACtC,CAAC;IAED,KAAK,CAAC,uBAAuB,CAC3B,aAAsC;QAEtC,KAAK,MAAM,IAAI,IAAI,aAAa,EAAE;YAChC,IAAI;gBACF,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;gBACjD,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAClD,IAAI,EACJ,CAAC,WAAW,EAAE,SAAS,EAAE,EAAE;oBACzB,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,IAAI,EAAE,WAAW,GAAG,GAAG,EAAE,SAAS,CAAC,CAAC;gBAClE,CAAC,CACF,CAAC;gBACF,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC;gBACrC,IAAY,CAAC,IAAI,GAAG,IAAI,CAAC;gBAC1B,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;aAC7B;YAAC,OAAO,CAAC,EAAE;gBACV,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;gBACjB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,EAAG,CAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aAChD;SACF;IACH,CAAC;CACF","sourcesContent":["import { Dropzone, DropzoneOptions } from \"@scoped-elements/dropzone\";\nimport { FileStorageClient } from \"./file-storage-client\";\n\nexport class HolochainDropzone extends Dropzone {\n fileStorageClient: FileStorageClient;\n constructor(\n el: HTMLElement,\n fileStorageClient: FileStorageClient,\n options: DropzoneOptions\n ) {\n options.url = \"https://holochain.org/\"; // just to bypass the check.\n super(el, options);\n this.fileStorageClient = fileStorageClient;\n }\n\n uploadFiles(files: Dropzone.DropzoneFile[]) {\n this._uploadFilesToHolochain(files);\n }\n\n async _uploadFilesToHolochain(\n dropzoneFiles: Dropzone.DropzoneFile[]\n ): Promise<void> {\n for (const file of dropzoneFiles) {\n try {\n this.emit(\"sending\", file, undefined, undefined);\n const hash = await this.fileStorageClient.uploadFile(\n file,\n (percentatge, bytesSent) => {\n this.emit(\"uploadprogress\", file, percentatge * 100, bytesSent);\n }\n );\n this.emit(\"success\", file, undefined);\n (file as any).hash = hash;\n this.emit(\"complete\", file);\n } catch (e) {\n console.error(e);\n this.emit(\"error\", file, (e as any).data.data);\n }\n }\n }\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@holochain-open-dev/file-storage",
3
- "version": "0.1.0",
3
+ "version": "0.1.2",
4
4
  "description": "File storage utilities to store and retrieve files in a holochain DHT",
5
5
  "author": "guillem.cordoba@gmail.com",
6
6
  "license": "MIT",
@@ -23,19 +23,19 @@
23
23
  },
24
24
  "dependencies": {
25
25
  "@holochain-open-dev/elements": "^0.2.3",
26
- "@holochain-open-dev/utils": "^0.10.2",
26
+ "@holochain-open-dev/utils": "^0.12.0",
27
27
  "@holochain/client": "^0.12.0",
28
28
  "@lit-labs/context": "^0.2.0",
29
29
  "@lit-labs/task": "^2.0.0",
30
+ "@lit/localize": "^0.11.4",
30
31
  "@open-wc/scoped-elements": "^2.1.0",
31
- "@scoped-elements/dropzone": "^0.0.3",
32
- "@scoped-elements/material-web": "^0.0.19",
32
+ "@scoped-elements/dropzone": "^0.1.2",
33
+ "@scoped-elements/shoelace": "^0.1.0",
33
34
  "lit": "^2.6.0"
34
35
  },
35
36
  "devDependencies": {
36
37
  "@custom-elements-manifest/analyzer": "^0.5.7",
37
38
  "@open-wc/eslint-config": "^2.0.0",
38
- "@types/dropzone": "^5.7.4",
39
39
  "@types/lodash-es": "^4.17.5",
40
40
  "@types/node": "14.11.1",
41
41
  "@typescript-eslint/eslint-plugin": "^5.49.0",
@@ -50,9 +50,6 @@
50
50
  "vite": "^4.0.4",
51
51
  "vite-plugin-checker": "^0.5.3"
52
52
  },
53
- "eslintConfig": {
54
- "extends": ["@open-wc/eslint-config", "eslint-config-prettier"]
55
- },
56
53
  "prettier": {
57
54
  "singleQuote": true,
58
55
  "arrowParens": "avoid"