webwriter-chart
Version:
ww-chart is an interactive data visualization widget for the WebWriter tool that implements various charts and diagrams for static and exploratory data visualization.
59 lines (57 loc) • 2.09 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { LitElementWw } from "@webwriter/lit";
import { css, html } from "lit";
import { customElement, property } from "lit/decorators.js";
let FileUploadButton = class FileUploadButton extends LitElementWw {
static styles = css `
.file-upload-button {
display: inline-block;
padding: 10px 20px;
background-color: hsl(240 5.3% 26.1%);
color: #fff;
border: none;
border-radius: 4px;
cursor: pointer;
}
.file-upload {
display: none;
}
`;
#buttonText_accessor_storage = "load external data";
get buttonText() { return this.#buttonText_accessor_storage; }
set buttonText(value) { this.#buttonText_accessor_storage = value; }
render() {
return html `
<label for="file" class="file-upload-button">${this.buttonText}</label>
<input
type="file"
id="file"
class="file-upload"
accept=".csv"
@change=${async (e) => {
await this._handleFileSelect(e);
//@ts-ignore
this.shadowRoot.getElementById("file").value = "";
}}
/>
`;
}
_handleFileSelect(e) {
this.dispatchEvent(new CustomEvent("wwcifileinput", {
detail: { value: e },
composed: true,
}));
}
};
__decorate([
property({ type: String })
], FileUploadButton.prototype, "buttonText", null);
FileUploadButton = __decorate([
customElement("wwci-file-upload-button")
], FileUploadButton);
export { FileUploadButton };