@fmsim/board 1.0.34 → 1.0.38

package/dist/src/component/index.d.ts

@@ -1 +1,3 @@
-export * from './etc';
+export * from './restful-attachment-selector.js';
+export * from './etc.js';
+export * from './restful-input-fill-style.js';

package/dist/src/component/index.js

@@ -1,2 +1,4 @@
-export * from './etc';
+export * from './restful-attachment-selector.js';
+export * from './etc.js';
+export * from './restful-input-fill-style.js';
 //# sourceMappingURL=index.js.map

package/dist/src/component/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/component/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAA","sourcesContent":["export * from './etc'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/component/index.ts"],"names":[],"mappings":"AAAA,cAAc,kCAAkC,CAAA;AAChD,cAAc,UAAU,CAAA;AACxB,cAAc,+BAA+B,CAAA","sourcesContent":["export * from './restful-attachment-selector.js'\nexport * from './etc.js'\nexport * from './restful-input-fill-style.js'\n"]}

package/dist/src/component/restful-attachment-creation-card.d.ts

@@ -0,0 +1,18 @@
+import '@things-factory/image-uploader-ui/client/image-upload-previewer';
+import './restful-file-selector';
+import { LitElement } from 'lit';
+declare const RestfulAttachmentCreationCard_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class RestfulAttachmentCreationCard extends RestfulAttachmentCreationCard_base {
+    static styles: import("lit").CSSResult[];
+    defaultCategory?: string;
+    categories: string[];
+    _files: any[];
+    _currentCategory?: string;
+    fileId?: string;
+    render(): import("lit-html").TemplateResult<1>;
+    firstUpdated(): void;
+    onClickFlip(e: Event): void;
+    onClickSubmit(e: Event): void;
+    reset(): void;
+}
+export {};

package/dist/src/component/restful-attachment-creation-card.js

@@ -0,0 +1,264 @@
+import { __decorate } from "tslib";
+import '@things-factory/image-uploader-ui/client/image-upload-previewer';
+import './restful-file-selector';
+import { LitElement, html, css, unsafeCSS } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { i18next, localize } from '@operato/i18n';
+import { FileDropHelper } from '@operato/utils';
+const btnAddBoard = require('../../../icons/board/btn-add-board.svg');
+let RestfulAttachmentCreationCard = class RestfulAttachmentCreationCard extends localize(i18next)(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.categories = [];
+        this._files = [];
+    }
+    render() {
+        var categories = this.categories || [];
+        return html `
+      <div @click=${(e) => this.onClickFlip(e)} front>
+        <i class="btn-add-board"></i>
+        ${i18next.t('text.create attachment')}
+      </div>
+
+      <div @click=${(e) => this.onClickFlip(e)} back>
+        <form @submit=${(e) => this.onClickSubmit(e)}>
+          <label>${i18next.t('label.category')}</label>
+          <select
+            .value=${String(this.defaultCategory)}
+            name="category"
+            @change=${(e) => {
+            this._currentCategory = e.currentTarget.value;
+        }}
+          >
+            <option value="">--${i18next.t('text.please choose a category')}--</option>
+            ${categories.map(category => html `
+                <option value=${category} ?selected=${this.defaultCategory == category}>${category}</option>
+              `)}
+          </select>
+
+          <label>${i18next.t('label.file')}</label>
+          <restful-file-selector
+            name="file"
+            label=${String(i18next.t('label.select file'))}
+            accept="${this._currentCategory || '*'}/*"
+            multiple
+            @file-change=${(e) => {
+            this.fileId = e.detail.fileId;
+            this._files = Array.from(e.detail.files);
+        }}
+          ></restful-file-selector>
+
+          <div id="thumbnail-area">
+            ${this._files.map(file => html ` <image-upload-previewer .file=${file}></image-upload-previewer> `)}
+          </div>
+
+          <input type="submit" value=${String(i18next.t('button.create'))} />
+        </form>
+      </div>
+    `;
+    }
+    firstUpdated() {
+        FileDropHelper.set(this);
+    }
+    onClickFlip(e) {
+        const currentTarget = e.currentTarget;
+        const target = e.target;
+        if (currentTarget.hasAttribute('front') ||
+            (currentTarget.hasAttribute('back') && target.tagName != 'INPUT' && target.tagName != 'SELECT')) {
+            this.classList.toggle('flipped');
+        }
+        e.stopPropagation();
+    }
+    onClickSubmit(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        var form = e.target;
+        var category = form.elements['category'].value;
+        var files = this._files;
+        var fileId = this.fileId;
+        const extension = fileId === null || fileId === void 0 ? void 0 : fileId.substring(fileId.length - 3);
+        if (!extension || extension !== (extension === null || extension === void 0 ? void 0 : extension.toLowerCase())) {
+            document.dispatchEvent(new CustomEvent('notify', {
+                detail: {
+                    level: 'error',
+                    message: 'Error : File extension is not available.',
+                    ex: 'Error : File extension is not available.'
+                }
+            }));
+            return;
+        }
+        this.dispatchEvent(new CustomEvent('create-attachment', {
+            detail: {
+                category,
+                files,
+                fileId
+            }
+        }));
+    }
+    reset() {
+        var form = this.renderRoot.querySelector('form');
+        if (form) {
+            form.reset();
+            this._files = [];
+        }
+        this.classList.remove('flipped');
+    }
+};
+RestfulAttachmentCreationCard.styles = [
+    css `
+      :host {
+        position: relative;
+
+        padding: 0;
+        margin: 0;
+        height: 100%;
+
+        -webkit-transform-style: preserve-3d;
+        transform-style: preserve-3d;
+        -webkit-transition: all 0.5s ease-in-out;
+        transition: all 0.5s ease-in-out;
+        box-shadow: var(--box-shadow);
+      }
+
+      :host(.flipped) {
+        -webkit-transform: var(--card-list-flip-transform);
+        transform: var(--card-list-flip-transform);
+      }
+
+      [front],
+      [back] {
+        position: absolute;
+
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        padding: 0;
+
+        border: var(--card-list-create-border);
+        border-radius: var(--card-list-create-border-radius);
+
+        background-color: #fff;
+
+        -webkit-backface-visibility: hidden;
+        backface-visibility: hidden;
+      }
+
+      [front] {
+        text-align: center;
+        font-size: 0.8em;
+        color: var(--card-list-create-color);
+        text-transform: capitalize;
+      }
+
+      :host(.candrop) [front],
+      :host(.candrop) [back] {
+        border-width: 2px;
+        background-color: #fffde9;
+      }
+
+      [front] mwc-icon {
+        margin-top: 55px;
+        display: block;
+        font-size: 3.5em;
+        color: var(--card-list-create-icon-color);
+      }
+
+      [back] {
+        -webkit-transform: var(--card-list-flip-transform);
+        transform: var(--card-list-flip-transform);
+      }
+
+      [back] form {
+        padding: var(--card-list-create-form-padding);
+        width: 100%;
+        height: 100%;
+        box-sizing: border-box;
+        display: grid;
+        grid-template-columns: repeat(10, 1fr);
+        grid-template-rows: min-content min-content 1fr min-content;
+        grid-row-gap: 7px;
+        justify-content: center;
+        align-items: center;
+      }
+
+      [back] form label {
+        grid-column: span 4;
+        font: var(--card-list-create-label-font);
+        color: var(--card-list-create-label-color);
+      }
+
+      [back] form input,
+      [back] form select {
+        grid-column: span 6;
+        background-color: #fff;
+        border: var(--card-list-create-input-border);
+        border-radius: var(--card-list-create-input-border-radius);
+        padding: var(--card-list-create-input-padding);
+        font: var(--card-list-create-input-font);
+        color: var(--card-list-create-input-color);
+      }
+
+      restful-file-selector {
+        grid-column: span 6;
+        font: var(--card-list-create-input-font);
+        border: none;
+        box-sizing: border-box;
+        padding: 0;
+      }
+
+      #thumbnail-area {
+        grid-column: span 10;
+        align-self: stretch;
+        text-align: center;
+        overflow: hidden;
+        overflow-x: auto;
+        white-space: nowrap;
+      }
+
+      image-upload-previewer {
+        display: inline-block;
+        height: 100%;
+      }
+
+      [back] input[type='submit'] {
+        background-color: var(--button-background-color) !important;
+        margin: var(--button-margin);
+        font: var(--button-font);
+        color: var(--button-color) !important;
+        border-radius: var(--button-radius);
+        border: var(--button-border);
+        grid-column: span 10;
+        grid-row: auto / -1;
+        margin: 0;
+      }
+
+      .btn-add-board {
+        width: 3.8em;
+        height: 3.8em;
+        margin: auto;
+        margin-top: 20%;
+        background: url(${unsafeCSS(btnAddBoard)}) no-repeat;
+        display: block;
+      }
+    `
+];
+__decorate([
+    property({ type: String })
+], RestfulAttachmentCreationCard.prototype, "defaultCategory", void 0);
+__decorate([
+    property({ type: Array })
+], RestfulAttachmentCreationCard.prototype, "categories", void 0);
+__decorate([
+    property({ type: Array })
+], RestfulAttachmentCreationCard.prototype, "_files", void 0);
+__decorate([
+    property({ type: String })
+], RestfulAttachmentCreationCard.prototype, "_currentCategory", void 0);
+__decorate([
+    property({ type: String })
+], RestfulAttachmentCreationCard.prototype, "fileId", void 0);
+RestfulAttachmentCreationCard = __decorate([
+    customElement('restful-attachment-creation-card')
+], RestfulAttachmentCreationCard);
+export { RestfulAttachmentCreationCard };
+//# sourceMappingURL=restful-attachment-creation-card.js.map

package/dist/src/component/restful-attachment-creation-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"restful-attachment-creation-card.js","sourceRoot":"","sources":["../../../src/component/restful-attachment-creation-card.ts"],"names":[],"mappings":";AAAA,OAAO,iEAAiE,CAAA;AACxE,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AACtD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,WAAW,GAAG,OAAO,CAAC,wCAAwC,CAAC,CAAA;AAG9D,IAAM,6BAA6B,GAAnC,MAAM,6BAA8B,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAzE;;QA6IsB,eAAU,GAAa,EAAE,CAAA;QACzB,WAAM,GAAU,EAAE,CAAA;IAmH/C,CAAC;IA/GC,MAAM;QACJ,IAAI,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAA;QAEtC,OAAO,IAAI,CAAA;oBACK,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;;UAE3C,OAAO,CAAC,CAAC,CAAC,wBAAwB,CAAC;;;oBAGzB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;wBAC7B,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;mBACxC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;qBAEzB,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC;;sBAE3B,CAAC,CAAQ,EAAE,EAAE;YACrB,IAAI,CAAC,gBAAgB,GAAI,CAAC,CAAC,aAAmC,CAAC,KAAK,CAAA;QACtE,CAAC;;iCAEoB,OAAO,CAAC,CAAC,CAAC,+BAA+B,CAAC;cAC7D,UAAU,CAAC,GAAG,CACd,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAA;gCACE,QAAQ,cAAc,IAAI,CAAC,eAAe,IAAI,QAAQ,IAAI,QAAQ;eACnF,CACF;;;mBAGM,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;;;oBAGtB,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC;sBACpC,IAAI,CAAC,gBAAgB,IAAI,GAAG;;2BAEvB,CAAC,CAAQ,EAAE,EAAE;YAC1B,IAAI,CAAC,MAAM,GAAI,CAAiB,CAAC,MAAM,CAAC,MAAM,CAAA;YAC9C,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,IAAI,CAAE,CAAiB,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QAC3D,CAAC;;;;cAIC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA,kCAAkC,IAAI,6BAA6B,CAAC;;;uCAGvE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC;;;KAGpE,CAAA;IACH,CAAC;IAED,YAAY;QACV,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;IAC1B,CAAC;IAED,WAAW,CAAC,CAAQ;QAClB,MAAM,aAAa,GAAG,CAAC,CAAC,aAA4B,CAAA;QACpD,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;QAEtC,IACE,aAAa,CAAC,YAAY,CAAC,OAAO,CAAC;YACnC,CAAC,aAAa,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,OAAO,IAAI,OAAO,IAAI,MAAM,CAAC,OAAO,IAAI,QAAQ,CAAC,EAC/F,CAAC;YACD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;QAClC,CAAC;QAED,CAAC,CAAC,eAAe,EAAE,CAAA;IACrB,CAAC;IAED,aAAa,CAAC,CAAQ;QACpB,CAAC,CAAC,cAAc,EAAE,CAAA;QAClB,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;QAEtC,IAAI,QAAQ,GAAK,IAAI,CAAC,QAAgB,CAAC,UAAU,CAAuB,CAAC,KAAK,CAAA;QAC9E,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAA;QACvB,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QAExB,MAAM,SAAS,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,SAAS,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QACtD,IAAI,CAAC,SAAS,IAAI,SAAS,MAAK,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,EAAE,CAAA,EAAE,CAAC;YACzD,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,MAAM,EAAE;oBACN,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,0CAA0C;oBACnD,EAAE,EAAE,0CAA0C;iBAC/C;aACF,CAAC,CACH,CAAA;YACD,OAAM;QACR,CAAC;QAED,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,mBAAmB,EAAE;YACnC,MAAM,EAAE;gBACN,QAAQ;gBACR,KAAK;gBACL,MAAM;aACP;SACF,CAAC,CACH,CAAA;IACH,CAAC;IAED,KAAK;QACH,IAAI,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QAChD,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC,KAAK,EAAE,CAAA;YACZ,IAAI,CAAC,MAAM,GAAG,EAAE,CAAA;QAClB,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;IAClC,CAAC;;AA/PM,oCAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAoImB,SAAS,CAAC,WAAW,CAAC;;;KAG3C;CACF,AAzIY,CAyIZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sEAAyB;AACzB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;iEAA0B;AACzB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;6DAAmB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uEAA0B;AACzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAAgB;AAhJhC,6BAA6B;IADzC,aAAa,CAAC,kCAAkC,CAAC;GACrC,6BAA6B,CAiQzC","sourcesContent":["import '@things-factory/image-uploader-ui/client/image-upload-previewer'\nimport './restful-file-selector'\n\nimport { LitElement, html, css, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { FileDropHelper } from '@operato/utils'\n\nconst btnAddBoard = require('../../../icons/board/btn-add-board.svg')\n\n@customElement('restful-attachment-creation-card')\nexport class RestfulAttachmentCreationCard extends localize(i18next)(LitElement) {\n  static styles = [\n    css`\n      :host {\n        position: relative;\n\n        padding: 0;\n        margin: 0;\n        height: 100%;\n\n        -webkit-transform-style: preserve-3d;\n        transform-style: preserve-3d;\n        -webkit-transition: all 0.5s ease-in-out;\n        transition: all 0.5s ease-in-out;\n        box-shadow: var(--box-shadow);\n      }\n\n      :host(.flipped) {\n        -webkit-transform: var(--card-list-flip-transform);\n        transform: var(--card-list-flip-transform);\n      }\n\n      [front],\n      [back] {\n        position: absolute;\n\n        width: 100%;\n        height: 100%;\n        margin: 0;\n        padding: 0;\n\n        border: var(--card-list-create-border);\n        border-radius: var(--card-list-create-border-radius);\n\n        background-color: #fff;\n\n        -webkit-backface-visibility: hidden;\n        backface-visibility: hidden;\n      }\n\n      [front] {\n        text-align: center;\n        font-size: 0.8em;\n        color: var(--card-list-create-color);\n        text-transform: capitalize;\n      }\n\n      :host(.candrop) [front],\n      :host(.candrop) [back] {\n        border-width: 2px;\n        background-color: #fffde9;\n      }\n\n      [front] mwc-icon {\n        margin-top: 55px;\n        display: block;\n        font-size: 3.5em;\n        color: var(--card-list-create-icon-color);\n      }\n\n      [back] {\n        -webkit-transform: var(--card-list-flip-transform);\n        transform: var(--card-list-flip-transform);\n      }\n\n      [back] form {\n        padding: var(--card-list-create-form-padding);\n        width: 100%;\n        height: 100%;\n        box-sizing: border-box;\n        display: grid;\n        grid-template-columns: repeat(10, 1fr);\n        grid-template-rows: min-content min-content 1fr min-content;\n        grid-row-gap: 7px;\n        justify-content: center;\n        align-items: center;\n      }\n\n      [back] form label {\n        grid-column: span 4;\n        font: var(--card-list-create-label-font);\n        color: var(--card-list-create-label-color);\n      }\n\n      [back] form input,\n      [back] form select {\n        grid-column: span 6;\n        background-color: #fff;\n        border: var(--card-list-create-input-border);\n        border-radius: var(--card-list-create-input-border-radius);\n        padding: var(--card-list-create-input-padding);\n        font: var(--card-list-create-input-font);\n        color: var(--card-list-create-input-color);\n      }\n\n      restful-file-selector {\n        grid-column: span 6;\n        font: var(--card-list-create-input-font);\n        border: none;\n        box-sizing: border-box;\n        padding: 0;\n      }\n\n      #thumbnail-area {\n        grid-column: span 10;\n        align-self: stretch;\n        text-align: center;\n        overflow: hidden;\n        overflow-x: auto;\n        white-space: nowrap;\n      }\n\n      image-upload-previewer {\n        display: inline-block;\n        height: 100%;\n      }\n\n      [back] input[type='submit'] {\n        background-color: var(--button-background-color) !important;\n        margin: var(--button-margin);\n        font: var(--button-font);\n        color: var(--button-color) !important;\n        border-radius: var(--button-radius);\n        border: var(--button-border);\n        grid-column: span 10;\n        grid-row: auto / -1;\n        margin: 0;\n      }\n\n      .btn-add-board {\n        width: 3.8em;\n        height: 3.8em;\n        margin: auto;\n        margin-top: 20%;\n        background: url(${unsafeCSS(btnAddBoard)}) no-repeat;\n        display: block;\n      }\n    `\n  ]\n\n  @property({ type: String }) defaultCategory?: string\n  @property({ type: Array }) categories: string[] = []\n  @property({ type: Array }) _files: any[] = []\n  @property({ type: String }) _currentCategory?: string\n  @property({ type: String }) fileId?: string\n\n  render() {\n    var categories = this.categories || []\n\n    return html`\n      <div @click=${(e: Event) => this.onClickFlip(e)} front>\n        <i class=\"btn-add-board\"></i>\n        ${i18next.t('text.create attachment')}\n      </div>\n\n      <div @click=${(e: Event) => this.onClickFlip(e)} back>\n        <form @submit=${(e: Event) => this.onClickSubmit(e)}>\n          <label>${i18next.t('label.category')}</label>\n          <select\n            .value=${String(this.defaultCategory)}\n            name=\"category\"\n            @change=${(e: Event) => {\n              this._currentCategory = (e.currentTarget as HTMLSelectElement).value\n            }}\n          >\n            <option value=\"\">--${i18next.t('text.please choose a category')}--</option>\n            ${categories.map(\n              category => html`\n                <option value=${category} ?selected=${this.defaultCategory == category}>${category}</option>\n              `\n            )}\n          </select>\n\n          <label>${i18next.t('label.file')}</label>\n          <restful-file-selector\n            name=\"file\"\n            label=${String(i18next.t('label.select file'))}\n            accept=\"${this._currentCategory || '*'}/*\"\n            multiple\n            @file-change=${(e: Event) => {\n              this.fileId = (e as CustomEvent).detail.fileId\n              this._files = Array.from((e as CustomEvent).detail.files)\n            }}\n          ></restful-file-selector>\n\n          <div id=\"thumbnail-area\">\n            ${this._files.map(file => html` <image-upload-previewer .file=${file}></image-upload-previewer> `)}\n          </div>\n\n          <input type=\"submit\" value=${String(i18next.t('button.create'))} />\n        </form>\n      </div>\n    `\n  }\n\n  firstUpdated() {\n    FileDropHelper.set(this)\n  }\n\n  onClickFlip(e: Event) {\n    const currentTarget = e.currentTarget as HTMLElement\n    const target = e.target as HTMLElement\n\n    if (\n      currentTarget.hasAttribute('front') ||\n      (currentTarget.hasAttribute('back') && target.tagName != 'INPUT' && target.tagName != 'SELECT')\n    ) {\n      this.classList.toggle('flipped')\n    }\n\n    e.stopPropagation()\n  }\n\n  onClickSubmit(e: Event) {\n    e.preventDefault()\n    e.stopPropagation()\n\n    var form = e.target as HTMLFormElement\n\n    var category = ((form.elements as any)['category'] as HTMLSelectElement).value\n    var files = this._files\n    var fileId = this.fileId\n\n    const extension = fileId?.substring(fileId.length - 3)\n    if (!extension || extension !== extension?.toLowerCase()) {\n      document.dispatchEvent(\n        new CustomEvent('notify', {\n          detail: {\n            level: 'error',\n            message: 'Error : File extension is not available.',\n            ex: 'Error : File extension is not available.'\n          }\n        })\n      )\n      return\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('create-attachment', {\n        detail: {\n          category,\n          files,\n          fileId\n        }\n      })\n    )\n  }\n\n  reset() {\n    var form = this.renderRoot.querySelector('form')\n    if (form) {\n      form.reset()\n      this._files = []\n    }\n\n    this.classList.remove('flipped')\n  }\n}\n"]}

package/dist/src/component/restful-attachment-selector.d.ts

@@ -0,0 +1,36 @@
+import './restful-attachment-creation-card.js';
+import { LitElement, PropertyValues } from 'lit';
+import { RestfulAttachmentCreationCard } from './restful-attachment-creation-card.js';
+declare const RestfulAttachmentSelector_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class RestfulAttachmentSelector extends RestfulAttachmentSelector_base {
+    static styles: import("lit").CSSResult[];
+    categories: string[];
+    attachments: any[];
+    category?: string;
+    _page: number;
+    _total: number;
+    creatable?: boolean;
+    selectBoxToggle?: string | null;
+    btnDropBoxIcon: string;
+    userName?: string;
+    main: HTMLDivElement;
+    creationCard: RestfulAttachmentCreationCard;
+    render(): import("lit-html").TemplateResult<1>;
+    toggleSelectBox(): void;
+    firstUpdated(): Promise<void>;
+    updated(changed: PropertyValues<this>): void;
+    onClickSelect(attachment: any): void;
+    onAttachmentDropped(e: Event): Promise<void>;
+    onCreateAttachment(e: Event): Promise<void>;
+    onDeleteAttachment(id: string): Promise<void>;
+    refreshAttachments(): Promise<void>;
+    appendAttachments(): Promise<void>;
+    getAttachments({ page, limit }?: {
+        page?: number | undefined;
+        limit?: number | undefined;
+    }): Promise<any>;
+    createAttachments(category: string, files: any[], fileId?: string): Promise<void>;
+    deleteAttachment(id: string): Promise<void>;
+    copy(copied: any): Promise<void>;
+}
+export {};