@mlightcad/cad-simple-viewer 1.7.4 → 1.7.5

package/lib/ui/AcUiFileOpenPanel.js

@@ -0,0 +1,695 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { AcApDocManager } from '../app/AcApDocManager';
+import { acapBuildDataSourceMenu } from '../app/dataSource/acapBuildDataSourceMenu';
+import { ACAP_LOCAL_DATA_SOURCE_ID } from '../app/dataSource/AcApLocalDataSource';
+import { ACAP_URL_DATA_SOURCE_ID } from '../app/dataSource/AcApUrlDataSource';
+import { acedApplyUiTheme, acedSubscribeUiTheme, resolveUiTheme } from '../editor/global/AcEdUiTheme';
+import { AcApI18n } from '../i18n/AcApI18n';
+var SUPPORTED_EXTENSIONS = ['.dxf', '.dwg'];
+var VIEW_LOCAL = 'local';
+var VIEW_URL = 'url';
+var DEFAULT_CARD_WIDTH = '100%';
+var DEFAULT_CARD_HEIGHT = '150px';
+function toCssSize(value, fallback) {
+    if (value == null)
+        return fallback;
+    return typeof value === 'number' ? "".concat(value, "px") : value;
+}
+/**
+ * Framework-free landing panel for opening CAD files.
+ *
+ * Card body swaps by source; bottom chevron opens a source menu.
+ * Pass {@link AcUiFileOpenPanelOptions.theme} for an isolated light/dark
+ * palette, and {@link AcUiFileOpenPanelOptions.cardSize} for width/height.
+ */
+var AcUiFileOpenPanel = /** @class */ (function () {
+    function AcUiFileOpenPanel(options) {
+        var e_1, _a;
+        var _this = this;
+        var _b, _c;
+        this.activeView = VIEW_LOCAL;
+        this.menuOpen = false;
+        this.disposed = false;
+        this.unsubManager = null;
+        this.unsubTheme = null;
+        this.onDocPointerDown = null;
+        this.options = __assign(__assign({}, options), { cardSize: __assign({}, ((_b = options.cardSize) !== null && _b !== void 0 ? _b : {})) });
+        AcUiFileOpenPanel.ensureStyles();
+        this.root = document.createElement('div');
+        this.root.className = 'ml-ui-file-open';
+        this.root.setAttribute('data-ml-ui-file-open', '1');
+        this.applyTheme();
+        if (options.title || options.subtitle) {
+            var header = document.createElement('div');
+            header.className = 'ml-ui-file-open-header';
+            if (options.title) {
+                var title = document.createElement('h2');
+                title.className = 'ml-ui-file-open-title';
+                title.textContent = options.title;
+                header.appendChild(title);
+            }
+            if (options.subtitle) {
+                var subtitle = document.createElement('p');
+                subtitle.className = 'ml-ui-file-open-subtitle';
+                subtitle.textContent = options.subtitle;
+                header.appendChild(subtitle);
+            }
+            this.root.appendChild(header);
+        }
+        if (options.showNewDrawing) {
+            var newBtn = document.createElement('button');
+            newBtn.type = 'button';
+            newBtn.className = 'ml-ui-file-open-primary';
+            newBtn.textContent = AcApI18n.t('main.dataSource.newDrawing');
+            newBtn.addEventListener('click', function () { return _this.emit({ kind: 'new-drawing' }); });
+            this.root.appendChild(newBtn);
+            this.root.appendChild(this.createDivider());
+        }
+        this.card = document.createElement('div');
+        this.card.className = 'ml-ui-file-open-card';
+        this.applyCardSize();
+        this.root.appendChild(this.card);
+        this.fileInput = document.createElement('input');
+        this.fileInput.type = 'file';
+        this.fileInput.accept = (_c = options.accept) !== null && _c !== void 0 ? _c : SUPPORTED_EXTENSIONS.join(',');
+        this.fileInput.className = 'ml-ui-file-open-input-hidden';
+        this.fileInput.addEventListener('change', function () {
+            var _a;
+            var file = (_a = _this.fileInput.files) === null || _a === void 0 ? void 0 : _a[0];
+            _this.fileInput.value = '';
+            if (file && _this.isSupportedFileName(file.name)) {
+                _this.emitLocal(file);
+            }
+        });
+        this.card.appendChild(this.fileInput);
+        this.contentEl = document.createElement('div');
+        this.contentEl.className = 'ml-ui-file-open-body';
+        this.card.appendChild(this.contentEl);
+        this.dropzone = document.createElement('div');
+        this.dropzone.className = 'ml-ui-file-open-dropzone';
+        this.dropzone.tabIndex = 0;
+        this.dropzone.setAttribute('role', 'button');
+        this.dropzone.setAttribute('aria-label', AcApI18n.t('main.dataSource.dropOrBrowse'));
+        var dropTitle = document.createElement('p');
+        dropTitle.className = 'ml-ui-file-open-drop-title';
+        dropTitle.append(document.createTextNode("".concat(AcApI18n.t('main.dataSource.dropFile'), " ")));
+        var dropLink = document.createElement('span');
+        dropLink.className = 'ml-ui-file-open-drop-link';
+        dropLink.textContent = AcApI18n.t('main.dataSource.browse');
+        dropTitle.appendChild(dropLink);
+        var tags = document.createElement('div');
+        tags.className = 'ml-ui-file-open-tags';
+        try {
+            for (var _d = __values(['DWG', 'DXF']), _e = _d.next(); !_e.done; _e = _d.next()) {
+                var tag = _e.value;
+                var span = document.createElement('span');
+                span.className = 'ml-ui-file-open-tag';
+                span.textContent = tag;
+                tags.appendChild(span);
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_e && !_e.done && (_a = _d.return)) _a.call(_d);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        this.dropzone.appendChild(dropTitle);
+        this.dropzone.appendChild(tags);
+        this.dropzone.addEventListener('click', function () { return _this.fileInput.click(); });
+        this.dropzone.addEventListener('keydown', function (e) {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                _this.fileInput.click();
+            }
+        });
+        this.dropzone.addEventListener('dragenter', function (e) { return _this.onDrag(e, true); });
+        this.dropzone.addEventListener('dragover', function (e) { return _this.onDrag(e, true); });
+        this.dropzone.addEventListener('dragleave', function (e) { return _this.onDrag(e, false); });
+        this.dropzone.addEventListener('drop', function (e) { return _this.onDrop(e); });
+        this.urlRow = document.createElement('div');
+        this.urlRow.className = 'ml-ui-file-open-url-row';
+        this.urlInput = document.createElement('input');
+        this.urlInput.type = 'url';
+        this.urlInput.className = 'ml-ui-file-open-url-input';
+        this.urlInput.placeholder = AcApI18n.t('main.dataSource.urlPlaceholder');
+        this.urlInput.autocomplete = 'off';
+        this.urlInput.spellcheck = false;
+        this.urlInput.addEventListener('keydown', function (e) {
+            if (e.key === 'Enter') {
+                e.preventDefault();
+                _this.submitUrl();
+            }
+        });
+        var urlBtn = document.createElement('button');
+        urlBtn.type = 'button';
+        urlBtn.className = 'ml-ui-file-open-secondary';
+        urlBtn.textContent = AcApI18n.t('main.dataSource.open');
+        urlBtn.addEventListener('click', function () { return _this.submitUrl(); });
+        this.urlRow.appendChild(this.urlInput);
+        this.urlRow.appendChild(urlBtn);
+        this.sourceActionsEl = document.createElement('div');
+        this.sourceActionsEl.className = 'ml-ui-file-open-sources';
+        var footer = document.createElement('div');
+        footer.className = 'ml-ui-file-open-footer';
+        this.footerBtn = document.createElement('button');
+        this.footerBtn.type = 'button';
+        this.footerBtn.className = 'ml-ui-file-open-footer-btn';
+        this.footerBtn.setAttribute('aria-label', AcApI18n.t('main.dataSource.source'));
+        this.footerBtn.setAttribute('aria-haspopup', 'listbox');
+        this.footerBtn.setAttribute('aria-expanded', 'false');
+        this.footerLabel = document.createElement('span');
+        this.footerLabel.className = 'ml-ui-file-open-footer-label';
+        this.footerChevron = document.createElement('span');
+        this.footerChevron.className = 'ml-ui-file-open-footer-chevron';
+        this.footerChevron.setAttribute('aria-hidden', 'true');
+        this.footerChevron.textContent = '▾';
+        this.footerBtn.appendChild(this.footerLabel);
+        this.footerBtn.appendChild(this.footerChevron);
+        this.footerBtn.addEventListener('click', function (e) {
+            e.stopPropagation();
+            _this.toggleMenu();
+        });
+        footer.appendChild(this.footerBtn);
+        this.card.appendChild(footer);
+        this.menuEl = document.createElement('div');
+        this.menuEl.className = 'ml-ui-file-open-menu';
+        this.menuEl.hidden = true;
+        this.menuEl.setAttribute('role', 'listbox');
+        this.card.appendChild(this.menuEl);
+        this.onDocPointerDown = function (event) {
+            if (!_this.menuOpen)
+                return;
+            var target = event.target;
+            if (!(target instanceof Node))
+                return;
+            if (_this.card.contains(target))
+                return;
+            _this.closeMenu();
+        };
+        document.addEventListener('pointerdown', this.onDocPointerDown);
+        this.unsubTheme = acedSubscribeUiTheme(function () {
+            if (_this.options.theme)
+                return;
+            _this.applyTheme();
+        });
+        options.host.appendChild(this.root);
+        this.bindManagerEvents();
+        this.refreshSourceButtons();
+    }
+    Object.defineProperty(AcUiFileOpenPanel.prototype, "element", {
+        /** Root element of the panel. */
+        get: function () {
+            return this.root;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    /** Rebuilds the source menu and active body content. */
+    AcUiFileOpenPanel.prototype.refreshSourceButtons = function () {
+        if (this.disposed)
+            return;
+        this.bindManagerEvents();
+        this.applyTheme();
+        this.applyCardSize();
+        this.syncSourceChrome();
+        this.renderActiveView();
+    };
+    /**
+     * Sets an isolated card theme, or `undefined` to follow the host app theme.
+     *
+     * @param theme - `light`, `dark`, or `undefined` to track {@link resolveUiTheme}
+     */
+    AcUiFileOpenPanel.prototype.setTheme = function (theme) {
+        if (this.disposed)
+            return;
+        this.options.theme = theme;
+        this.applyTheme();
+    };
+    /**
+     * Updates the source card width and/or height.
+     *
+     * @param size - Partial size; omitted sides keep their current option value
+     */
+    AcUiFileOpenPanel.prototype.setCardSize = function (size) {
+        if (this.disposed)
+            return;
+        this.options.cardSize = __assign(__assign({}, this.options.cardSize), size);
+        this.applyCardSize();
+    };
+    /** Removes the panel from the host and unsubscribes. */
+    AcUiFileOpenPanel.prototype.dispose = function () {
+        var _a, _b;
+        if (this.disposed)
+            return;
+        this.disposed = true;
+        (_a = this.unsubManager) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.unsubManager = null;
+        (_b = this.unsubTheme) === null || _b === void 0 ? void 0 : _b.call(this);
+        this.unsubTheme = null;
+        if (this.onDocPointerDown) {
+            document.removeEventListener('pointerdown', this.onDocPointerDown);
+            this.onDocPointerDown = null;
+        }
+        this.root.remove();
+    };
+    AcUiFileOpenPanel.prototype.applyTheme = function () {
+        var _a;
+        var isolated = this.options.theme != null;
+        var theme = (_a = this.options.theme) !== null && _a !== void 0 ? _a : resolveUiTheme(this.options.host);
+        acedApplyUiTheme(theme, this.root, { isolated: isolated });
+    };
+    AcUiFileOpenPanel.prototype.applyCardSize = function () {
+        var size = this.options.cardSize;
+        this.card.style.width = toCssSize(size === null || size === void 0 ? void 0 : size.width, DEFAULT_CARD_WIDTH);
+        this.card.style.height = toCssSize(size === null || size === void 0 ? void 0 : size.height, DEFAULT_CARD_HEIGHT);
+    };
+    AcUiFileOpenPanel.prototype.syncSourceChrome = function () {
+        var e_2, _a;
+        var _this = this;
+        var _b, _c;
+        var options = this.resolveSourceOptions();
+        var values = new Set(options.map(function (o) { return o.value; }));
+        if (!values.has(this.activeView)) {
+            this.activeView = VIEW_LOCAL;
+            this.closeMenu();
+        }
+        var current = (_b = options.find(function (o) { return o.value === _this.activeView; })) !== null && _b !== void 0 ? _b : options[0];
+        this.footerLabel.textContent = (_c = current === null || current === void 0 ? void 0 : current.label) !== null && _c !== void 0 ? _c : '';
+        var multi = options.length > 1;
+        this.footerBtn.disabled = !multi;
+        this.footerBtn.classList.toggle('is-single', !multi);
+        this.footerChevron.hidden = !multi;
+        if (!multi)
+            this.closeMenu();
+        this.menuEl.replaceChildren();
+        var _loop_1 = function (opt) {
+            var item = document.createElement('button');
+            item.type = 'button';
+            item.className = 'ml-ui-file-open-menu-item';
+            item.setAttribute('role', 'option');
+            item.setAttribute('aria-selected', opt.value === this_1.activeView ? 'true' : 'false');
+            if (opt.value === this_1.activeView) {
+                item.classList.add('is-active');
+            }
+            item.textContent = opt.label;
+            item.addEventListener('click', function (e) {
+                e.stopPropagation();
+                _this.selectSource(opt.value);
+            });
+            this_1.menuEl.appendChild(item);
+        };
+        var this_1 = this;
+        try {
+            for (var options_1 = __values(options), options_1_1 = options_1.next(); !options_1_1.done; options_1_1 = options_1.next()) {
+                var opt = options_1_1.value;
+                _loop_1(opt);
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (options_1_1 && !options_1_1.done && (_a = options_1.return)) _a.call(options_1);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+    };
+    AcUiFileOpenPanel.prototype.selectSource = function (value) {
+        this.activeView = value;
+        this.closeMenu();
+        this.syncSourceChrome();
+        this.renderActiveView();
+        this.maybeAutoSignIn(value);
+    };
+    /**
+     * When switching to an auth-required cloud source, start sign-in immediately
+     * (separate from pick, so the File Picker popup is not blocked).
+     */
+    AcUiFileOpenPanel.prototype.maybeAutoSignIn = function (sourceId) {
+        var _this = this;
+        if (sourceId === VIEW_LOCAL || sourceId === VIEW_URL)
+            return;
+        var source = this.resolveSources().find(function (s) { return s.id === sourceId; });
+        if (source) {
+            if (source.requiresAuth && source.getAuthState() === 'signed-out') {
+                void source
+                    .signIn()
+                    .catch(function () { return undefined; })
+                    .finally(function () { return _this.refreshSourceButtons(); });
+            }
+            return;
+        }
+        var signInItem = this.resolveExtraMenuItems().find(function (i) { return i.sourceId === sourceId && i.action === 'sign-in'; });
+        if (signInItem) {
+            this.emit({ kind: 'data-source', item: signInItem });
+        }
+    };
+    AcUiFileOpenPanel.prototype.toggleMenu = function () {
+        if (this.footerBtn.disabled)
+            return;
+        if (this.menuOpen)
+            this.closeMenu();
+        else
+            this.openMenu();
+    };
+    AcUiFileOpenPanel.prototype.openMenu = function () {
+        this.menuOpen = true;
+        this.menuEl.hidden = false;
+        this.footerBtn.setAttribute('aria-expanded', 'true');
+        this.footerBtn.classList.add('is-open');
+        this.footerChevron.textContent = '▴';
+    };
+    AcUiFileOpenPanel.prototype.closeMenu = function () {
+        this.menuOpen = false;
+        this.menuEl.hidden = true;
+        this.footerBtn.setAttribute('aria-expanded', 'false');
+        this.footerBtn.classList.remove('is-open');
+        this.footerChevron.textContent = '▾';
+    };
+    AcUiFileOpenPanel.prototype.resolveSourceOptions = function () {
+        var e_3, _a;
+        var options = [
+            {
+                value: VIEW_LOCAL,
+                label: AcApI18n.t('main.dataSource.local')
+            }
+        ];
+        if (this.options.showUrl !== false) {
+            options.push({
+                value: VIEW_URL,
+                label: AcApI18n.t('main.dataSource.url')
+            });
+        }
+        var seen = new Set();
+        try {
+            for (var _b = __values(this.resolveMenuItems()), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var item = _c.value;
+                if (seen.has(item.sourceId))
+                    continue;
+                seen.add(item.sourceId);
+                options.push({
+                    value: item.sourceId,
+                    label: this.resolveSourceLabel(item.sourceId)
+                });
+            }
+        }
+        catch (e_3_1) { e_3 = { error: e_3_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_3) throw e_3.error; }
+        }
+        return options;
+    };
+    AcUiFileOpenPanel.prototype.resolveSourceLabel = function (sourceId) {
+        var _a;
+        var source = this.resolveSources().find(function (s) { return s.id === sourceId; });
+        if (source) {
+            return AcApI18n.t(source.labelKey);
+        }
+        var extra = this.resolveExtraMenuItems().find(function (i) { return i.sourceId === sourceId; });
+        if ((_a = extra === null || extra === void 0 ? void 0 : extra.labelParams) === null || _a === void 0 ? void 0 : _a.name) {
+            return extra.labelParams.name;
+        }
+        return sourceId;
+    };
+    AcUiFileOpenPanel.prototype.renderActiveView = function () {
+        var _this = this;
+        this.contentEl.replaceChildren();
+        if (this.activeView === VIEW_LOCAL) {
+            this.contentEl.appendChild(this.dropzone);
+            return;
+        }
+        if (this.activeView === VIEW_URL) {
+            this.contentEl.appendChild(this.urlRow);
+            requestAnimationFrame(function () { return _this.urlInput.focus(); });
+            return;
+        }
+        this.renderSourceActions(this.activeView);
+        this.contentEl.appendChild(this.sourceActionsEl);
+    };
+    AcUiFileOpenPanel.prototype.canPickSource = function (sourceId) {
+        var source = this.resolveSources().find(function (s) { return s.id === sourceId; });
+        if (source) {
+            if (!source.requiresAuth)
+                return true;
+            return source.getAuthState() === 'signed-in';
+        }
+        // Landing page before registration: host exposes a pick item after sign-in.
+        return this.resolveExtraMenuItems().some(function (i) { return i.sourceId === sourceId && i.action === 'pick'; });
+    };
+    AcUiFileOpenPanel.prototype.buildPickMenuItem = function (sourceId) {
+        var name = this.resolveSourceLabel(sourceId);
+        var labelTemplate = AcApI18n.t('main.dataSource.openFrom');
+        return {
+            id: "".concat(sourceId, ":pick"),
+            sourceId: sourceId,
+            action: 'pick',
+            labelKey: 'main.dataSource.openFrom',
+            labelParams: { name: name },
+            label: labelTemplate.includes('{name}')
+                ? labelTemplate.split('{name}').join(name)
+                : AcApI18n.t('main.dataSource.selectFile')
+        };
+    };
+    AcUiFileOpenPanel.prototype.resolveAccountProfile = function (sourceId) {
+        var _a, _b, _c, _d;
+        var fromHost = (_b = (_a = this.options).getAccountProfile) === null || _b === void 0 ? void 0 : _b.call(_a, sourceId);
+        if (fromHost === null || fromHost === void 0 ? void 0 : fromHost.displayName)
+            return fromHost;
+        var source = this.resolveSources().find(function (s) { return s.id === sourceId; });
+        if (!source || source.getAuthState() !== 'signed-in')
+            return undefined;
+        var profile = (_c = source.getAccountProfile) === null || _c === void 0 ? void 0 : _c.call(source);
+        if (profile === null || profile === void 0 ? void 0 : profile.displayName)
+            return profile;
+        var label = (_d = source.getAccountLabel) === null || _d === void 0 ? void 0 : _d.call(source);
+        if (label)
+            return { displayName: label };
+        return undefined;
+    };
+    AcUiFileOpenPanel.prototype.initialsFromName = function (name) {
+        var _a, _b;
+        var parts = name.trim().split(/\s+/).filter(Boolean);
+        if (parts.length === 0)
+            return '?';
+        if (parts.length === 1)
+            return parts[0].slice(0, 2).toUpperCase();
+        return "".concat((_a = parts[0][0]) !== null && _a !== void 0 ? _a : '').concat((_b = parts[1][0]) !== null && _b !== void 0 ? _b : '').toUpperCase();
+    };
+    AcUiFileOpenPanel.prototype.renderSourceActions = function (sourceId) {
+        var _this = this;
+        this.sourceActionsEl.replaceChildren();
+        var profile = this.resolveAccountProfile(sourceId);
+        if (profile) {
+            var accountRow = document.createElement('div');
+            accountRow.className = 'ml-ui-file-open-account';
+            var avatar = document.createElement('div');
+            avatar.className = 'ml-ui-file-open-avatar';
+            if (profile.avatarUrl) {
+                var img = document.createElement('img');
+                img.className = 'ml-ui-file-open-avatar-img';
+                img.src = profile.avatarUrl;
+                img.alt = '';
+                img.referrerPolicy = 'no-referrer';
+                avatar.appendChild(img);
+            }
+            else {
+                var initials = document.createElement('span');
+                initials.className = 'ml-ui-file-open-avatar-initials';
+                initials.textContent = this.initialsFromName(profile.displayName);
+                avatar.appendChild(initials);
+            }
+            var textCol = document.createElement('div');
+            textCol.className = 'ml-ui-file-open-account-text';
+            var nameEl = document.createElement('div');
+            nameEl.className = 'ml-ui-file-open-account-name';
+            nameEl.textContent = profile.displayName;
+            textCol.appendChild(nameEl);
+            if (profile.email && profile.email !== profile.displayName) {
+                var emailEl = document.createElement('div');
+                emailEl.className = 'ml-ui-file-open-account-email';
+                emailEl.textContent = profile.email;
+                textCol.appendChild(emailEl);
+            }
+            accountRow.appendChild(avatar);
+            accountRow.appendChild(textCol);
+            this.sourceActionsEl.appendChild(accountRow);
+        }
+        var pickBtn = document.createElement('button');
+        pickBtn.type = 'button';
+        pickBtn.className =
+            'ml-ui-file-open-source-btn ml-ui-file-open-source-btn--primary';
+        pickBtn.textContent = AcApI18n.t('main.dataSource.selectFile');
+        var canPick = this.canPickSource(sourceId);
+        pickBtn.disabled = !canPick;
+        if (!canPick) {
+            pickBtn.title = AcApI18n.t('main.dataSource.signInRequired');
+        }
+        pickBtn.addEventListener('click', function () {
+            if (!_this.canPickSource(sourceId))
+                return;
+            _this.emit({
+                kind: 'data-source',
+                item: _this.buildPickMenuItem(sourceId)
+            });
+        });
+        this.sourceActionsEl.appendChild(pickBtn);
+    };
+    AcUiFileOpenPanel.prototype.resolveMenuItems = function () {
+        var sources = this.resolveSources().filter(function (s) {
+            return s.id !== ACAP_LOCAL_DATA_SOURCE_ID && s.id !== ACAP_URL_DATA_SOURCE_ID;
+        });
+        var fromManager = acapBuildDataSourceMenu(sources);
+        var extra = this.resolveExtraMenuItems();
+        var known = new Set(fromManager.map(function (i) { return i.sourceId; }));
+        var pending = extra.filter(function (i) { return !known.has(i.sourceId); });
+        return __spreadArray(__spreadArray([], __read(fromManager), false), __read(pending), false);
+    };
+    AcUiFileOpenPanel.prototype.resolveSources = function () {
+        var _a, _b;
+        if (this.options.getSources) {
+            return this.options.getSources();
+        }
+        return (_b = (_a = AcApDocManager.tryGetInstance()) === null || _a === void 0 ? void 0 : _a.dataSourceManager.list()) !== null && _b !== void 0 ? _b : [];
+    };
+    AcUiFileOpenPanel.prototype.resolveExtraMenuItems = function () {
+        var extra = this.options.extraMenuItems;
+        if (!extra)
+            return [];
+        return typeof extra === 'function' ? extra() : extra;
+    };
+    AcUiFileOpenPanel.prototype.bindManagerEvents = function () {
+        var _this = this;
+        var _a;
+        if (this.unsubManager)
+            return;
+        var dsm = (_a = AcApDocManager.tryGetInstance()) === null || _a === void 0 ? void 0 : _a.dataSourceManager;
+        if (!dsm)
+            return;
+        var refresh = function () { return _this.refreshSourceButtons(); };
+        dsm.on('changed', refresh);
+        dsm.on('auth-changed', refresh);
+        this.unsubManager = function () {
+            dsm.off('changed', refresh);
+            dsm.off('auth-changed', refresh);
+        };
+    };
+    AcUiFileOpenPanel.prototype.submitUrl = function () {
+        var url = this.urlInput.value.trim();
+        if (!url) {
+            this.urlInput.focus();
+            return;
+        }
+        this.emit({ kind: 'url', url: url });
+    };
+    AcUiFileOpenPanel.prototype.onDrag = function (event, active) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.dropzone.classList.toggle('is-dragover', active);
+    };
+    AcUiFileOpenPanel.prototype.onDrop = function (event) {
+        var _a, _b;
+        this.onDrag(event, false);
+        var file = (_b = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0];
+        if (file && this.isSupportedFileName(file.name)) {
+            this.emitLocal(file);
+        }
+    };
+    AcUiFileOpenPanel.prototype.isSupportedFileName = function (name) {
+        var lower = name.toLowerCase();
+        return SUPPORTED_EXTENSIONS.some(function (ext) { return lower.endsWith(ext); });
+    };
+    AcUiFileOpenPanel.prototype.emitLocal = function (file) {
+        this.emit({ kind: 'local', file: file });
+    };
+    AcUiFileOpenPanel.prototype.emit = function (result) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        (_b = (_a = this.options).onResult) === null || _b === void 0 ? void 0 : _b.call(_a, result);
+        switch (result.kind) {
+            case 'local':
+                (_d = (_c = this.options).onLocalFile) === null || _d === void 0 ? void 0 : _d.call(_c, result.file);
+                break;
+            case 'url':
+                (_f = (_e = this.options).onUrl) === null || _f === void 0 ? void 0 : _f.call(_e, result.url);
+                break;
+            case 'data-source':
+                (_h = (_g = this.options).onDataSourceAction) === null || _h === void 0 ? void 0 : _h.call(_g, result.item);
+                break;
+            case 'new-drawing':
+                (_k = (_j = this.options).onNewDrawing) === null || _k === void 0 ? void 0 : _k.call(_j);
+                break;
+        }
+    };
+    AcUiFileOpenPanel.prototype.createDivider = function () {
+        var el = document.createElement('p');
+        el.className = 'ml-ui-file-open-divider';
+        el.setAttribute('aria-hidden', 'true');
+        var span = document.createElement('span');
+        span.textContent = AcApI18n.t('main.dataSource.or');
+        el.appendChild(span);
+        return el;
+    };
+    AcUiFileOpenPanel.ensureStyles = function () {
+        if (typeof document === 'undefined')
+            return;
+        if (document.getElementById(AcUiFileOpenPanel.styleId))
+            return;
+        var style = document.createElement('style');
+        style.id = AcUiFileOpenPanel.styleId;
+        style.textContent = "\n.ml-ui-file-open {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n  width: 100%;\n  box-sizing: border-box;\n  font-family: system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n  color: var(--ml-ui-text, #303133);\n}\n.ml-ui-file-open-header { margin-bottom: 12px; }\n.ml-ui-file-open-title {\n  margin: 0 0 4px;\n  font-size: 18px;\n  font-weight: 700;\n  line-height: 1.3;\n}\n.ml-ui-file-open-subtitle {\n  margin: 0;\n  font-size: 13px;\n  line-height: 1.4;\n  color: var(--ml-ui-text-muted, #606266);\n}\n.ml-ui-file-open-primary {\n  display: block;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  border-radius: 10px;\n  background: var(--ml-ui-accent, #409eff);\n  color: #fff;\n  font-size: 13px;\n  font-weight: 700;\n  cursor: pointer;\n}\n.ml-ui-file-open-primary:hover { filter: brightness(1.05); }\n.ml-ui-file-open-secondary {\n  flex: 0 0 auto;\n  padding: 8px 14px;\n  border: none;\n  border-radius: 8px;\n  background: var(--ml-ui-accent, #409eff);\n  color: #fff;\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n  white-space: nowrap;\n}\n.ml-ui-file-open-divider {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  margin: 12px 0;\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--ml-ui-text-muted, #94a3b8);\n  text-transform: uppercase;\n  letter-spacing: 0.06em;\n}\n.ml-ui-file-open-divider::before,\n.ml-ui-file-open-divider::after {\n  content: '';\n  flex: 1;\n  height: 1px;\n  background: var(--ml-ui-border, #e2e8f0);\n}\n.ml-ui-file-open-card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 150px;\n  max-width: 100%;\n  box-sizing: border-box;\n  border: 1px solid var(--ml-ui-border, #dcdfe6);\n  border-radius: 12px;\n  background: var(--ml-ui-bg, #fff);\n  box-shadow: var(--ml-ui-shadow, 0 2px 6px rgba(0, 0, 0, 0.12));\n  overflow: hidden;\n}\n.ml-ui-file-open-body {\n  flex: 1 1 auto;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n}\n.ml-ui-file-open-input-hidden { display: none; }\n.ml-ui-file-open-dropzone {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  padding: 16px;\n  box-sizing: border-box;\n  border: 1.5px dashed transparent;\n  border-radius: 0;\n  background: transparent;\n  cursor: pointer;\n  outline: none;\n  transition: border-color 0.15s ease, background 0.15s ease;\n}\n.ml-ui-file-open-dropzone:hover,\n.ml-ui-file-open-dropzone:focus-visible,\n.ml-ui-file-open-dropzone.is-dragover {\n  border-color: var(--ml-ui-accent, #409eff);\n  background: color-mix(in srgb, var(--ml-ui-accent, #409eff) 8%, transparent);\n}\n.ml-ui-file-open-drop-title {\n  margin: 0;\n  font-size: 14px;\n  text-align: center;\n  color: var(--ml-ui-text-muted, #606266);\n}\n.ml-ui-file-open-drop-link {\n  color: var(--ml-ui-accent, #409eff);\n  font-weight: 600;\n}\n.ml-ui-file-open-tags { display: flex; gap: 6px; }\n.ml-ui-file-open-tag {\n  padding: 2px 8px;\n  border-radius: 999px;\n  border: 1px solid var(--ml-ui-border, #dcdfe6);\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--ml-ui-text-muted, #606266);\n}\n.ml-ui-file-open-url-row {\n  flex: 1;\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  padding: 16px;\n  box-sizing: border-box;\n}\n.ml-ui-file-open-url-input {\n  flex: 1;\n  min-width: 0;\n  padding: 8px 10px;\n  border: 1px solid var(--ml-ui-border, #c0c4cc);\n  border-radius: 8px;\n  background: var(--ml-ui-bg, #fff);\n  color: inherit;\n  font-size: 13px;\n  box-sizing: border-box;\n}\n.ml-ui-file-open-url-input:focus {\n  outline: 2px solid var(--ml-ui-accent, #409eff);\n  outline-offset: 1px;\n}\n.ml-ui-file-open-sources {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  justify-content: center;\n  padding: 16px;\n  box-sizing: border-box;\n}\n.ml-ui-file-open-empty {\n  margin: 0;\n  text-align: center;\n  font-size: 13px;\n  color: var(--ml-ui-text-muted, #606266);\n}\n.ml-ui-file-open-account {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  margin: 0 0 4px;\n  min-width: 0;\n}\n.ml-ui-file-open-avatar {\n  flex: 0 0 auto;\n  width: 36px;\n  height: 36px;\n  border-radius: 999px;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: color-mix(in srgb, var(--ml-ui-accent, #409eff) 22%, transparent);\n  border: 1px solid var(--ml-ui-border, #dcdfe6);\n}\n.ml-ui-file-open-avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  display: block;\n}\n.ml-ui-file-open-avatar-initials {\n  font-size: 12px;\n  font-weight: 700;\n  color: var(--ml-ui-accent, #409eff);\n  line-height: 1;\n}\n.ml-ui-file-open-account-text {\n  flex: 1;\n  min-width: 0;\n}\n.ml-ui-file-open-account-name {\n  font-size: 13px;\n  font-weight: 600;\n  color: var(--ml-ui-text, #303133);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.ml-ui-file-open-account-email {\n  margin-top: 2px;\n  font-size: 11px;\n  color: var(--ml-ui-text-muted, #606266);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.ml-ui-file-open-source-btn {\n  width: 100%;\n  padding: 10px 14px;\n  border: 1px solid var(--ml-ui-border, #e2e8f0);\n  border-radius: 8px;\n  background: var(--ml-ui-bg, #fff);\n  color: var(--ml-ui-text, #334155);\n  font-size: 13px;\n  cursor: pointer;\n  text-align: center;\n}\n.ml-ui-file-open-source-btn:disabled {\n  opacity: 0.55;\n  cursor: not-allowed;\n}\n.ml-ui-file-open-source-btn--primary {\n  border: none;\n  background: var(--ml-ui-accent, #409eff);\n  color: #fff;\n  font-weight: 600;\n}\n.ml-ui-file-open-source-btn--primary:hover:not(:disabled) { filter: brightness(1.05); }\n.ml-ui-file-open-source-btn--muted:hover {\n  border-color: var(--ml-ui-accent, #409eff);\n  color: var(--ml-ui-accent, #409eff);\n}\n.ml-ui-file-open-footer {\n  flex: 0 0 auto;\n  border-top: 1px solid var(--ml-ui-border, #dcdfe6);\n  background: color-mix(in srgb, var(--ml-ui-bg, #fff) 92%, var(--ml-ui-text, #303133) 8%);\n}\n.ml-ui-file-open-footer-btn {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  width: 100%;\n  padding: 10px 14px;\n  border: none;\n  background: transparent;\n  color: var(--ml-ui-text, #303133);\n  font-size: 13px;\n  font-weight: 600;\n  cursor: pointer;\n  text-align: left;\n  box-sizing: border-box;\n}\n.ml-ui-file-open-footer-btn:hover:not(:disabled),\n.ml-ui-file-open-footer-btn.is-open {\n  background: color-mix(in srgb, var(--ml-ui-accent, #409eff) 10%, transparent);\n}\n.ml-ui-file-open-footer-btn:disabled,\n.ml-ui-file-open-footer-btn.is-single {\n  cursor: default;\n}\n.ml-ui-file-open-footer-label {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.ml-ui-file-open-footer-chevron {\n  flex: 0 0 auto;\n  color: var(--ml-ui-text-muted, #606266);\n  font-size: 12px;\n  line-height: 1;\n}\n.ml-ui-file-open-menu {\n  position: absolute;\n  left: 8px;\n  right: 8px;\n  bottom: 44px;\n  z-index: 5;\n  display: flex;\n  flex-direction: column;\n  padding: 4px;\n  border: 1px solid var(--ml-ui-border, #dcdfe6);\n  border-radius: 10px;\n  background: var(--ml-ui-bg, #fff);\n  box-shadow: var(--ml-ui-shadow, 0 6px 18px rgba(0, 0, 0, 0.18));\n  max-height: 148px;\n  overflow: auto;\n}\n.ml-ui-file-open-menu[hidden] { display: none; }\n.ml-ui-file-open-menu-item {\n  display: block;\n  width: 100%;\n  padding: 9px 12px;\n  border: none;\n  border-radius: 7px;\n  background: transparent;\n  color: var(--ml-ui-text, #303133);\n  font-size: 13px;\n  text-align: left;\n  cursor: pointer;\n}\n.ml-ui-file-open-menu-item:hover {\n  background: color-mix(in srgb, var(--ml-ui-accent, #409eff) 12%, transparent);\n}\n.ml-ui-file-open-menu-item.is-active {\n  color: var(--ml-ui-accent, #409eff);\n  font-weight: 600;\n}\n";
+        document.head.appendChild(style);
+    };
+    AcUiFileOpenPanel.styleId = 'ml-ui-file-open-panel-styles-v3';
+    return AcUiFileOpenPanel;
+}());
+export { AcUiFileOpenPanel };
+//# sourceMappingURL=AcUiFileOpenPanel.js.map