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;
};
var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
};
var _PlayAssetsLocalDirectory_instances, _PlayAssetsLocalDirectory_pickDirectory, _PlayAssetsLocalDirectory_emitChange;
import { customElement, property } from 'lit/decorators.js';
import { css, html, LitElement } from 'lit';
import { cssReset } from '../../utils/css-reset.js';
import { when } from 'lit-html/directives/when.js';
import { fileAccessContext } from '../../utils/file-access-api.js';
import '../play-button.js';
import { emptyAssetsState } from './play-assets.js';
import { Bubble } from '../../utils/bubble.js';
let PlayAssetsLocalDirectory = class PlayAssetsLocalDirectory extends LitElement {
    constructor() {
        super(...arguments);
        _PlayAssetsLocalDirectory_instances.add(this);
        this.assetsState = emptyAssetsState();
        _PlayAssetsLocalDirectory_pickDirectory.set(this, async () => {
            const directoryHandle = await fileAccessContext.showDirectoryPicker({
                id: 'selectDirectory',
                mode: 'read'
            });
            if (directoryHandle) {
                __classPrivateFieldGet(this, _PlayAssetsLocalDirectory_instances, "m", _PlayAssetsLocalDirectory_emitChange).call(this, { kind: 'mount-directory', directoryHandle });
            }
        });
    }
    render() {
        return html `
      <span>Local directory:</span>
      <div class="row vcenter">
        ${when(this.assetsState.directoryName, () => html `<pre class="grow">.../${this.assetsState.directoryName}</pre>
              <play-button
                appearance="bordered"
                size="small"
                icon="share-ios-outline"
                icon-color="red"
                title="Unmount"
                @click=${() => __classPrivateFieldGet(this, _PlayAssetsLocalDirectory_instances, "m", _PlayAssetsLocalDirectory_emitChange).call(this, { kind: 'unmount' })}
              ></play-button>`, () => html `<span class="no-selection grow">No directory selected</span
              ><play-button
                appearance="inverted"
                size="small"
                label="Select"
                @click=${__classPrivateFieldGet(this, _PlayAssetsLocalDirectory_pickDirectory, "f")}
              ></play-button>`)}
      </div>
    `;
    }
};
_PlayAssetsLocalDirectory_pickDirectory = new WeakMap();
_PlayAssetsLocalDirectory_instances = new WeakSet();
_PlayAssetsLocalDirectory_emitChange = function _PlayAssetsLocalDirectory_emitChange(change) {
    this.dispatchEvent(Bubble('assets-filesystem-change', change));
};
PlayAssetsLocalDirectory.styles = css `
    ${cssReset}

    .row {
      display: flex;
      flex-direction: row;
    }

    .row.vcenter {
      align-items: center;
    }

    .column {
      display: flex;
      flex-direction: column;
    }

    .row .grow,
    .column .grow {
      flex-grow: 1;
    }

    .no-selection {
      font-size: 0.9em;
      color: darkgrey;
      font-style: italic;
    }

    pre {
      margin: 0;
    }
  `;
__decorate([
    property({ attribute: false })
], PlayAssetsLocalDirectory.prototype, "assetsState", void 0);
PlayAssetsLocalDirectory = __decorate([
    customElement('play-assets-local-directory')
], PlayAssetsLocalDirectory);
export { PlayAssetsLocalDirectory };
//# sourceMappingURL=play-assets-local-directory.js.map