@memberjunction/ng-file-storage 6.1.0-edge.5 → 6.1.0-edge.7
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.
- package/dist/lib/admin/storage-admin-dialog.component.js +1 -1
- package/dist/lib/category-tree/category-tree.js +6 -6
- package/dist/lib/category-tree/category-tree.js.map +1 -1
- package/dist/lib/file-browser/file-browser-resource.component.js +1 -1
- package/dist/lib/file-browser/file-browser.component.js +1 -1
- package/dist/lib/file-browser/file-grid.component.js +13 -13
- package/dist/lib/file-browser/file-grid.component.js.map +1 -1
- package/dist/lib/file-browser/folder-tree.component.js +1 -1
- package/dist/lib/file-browser/storage-providers-list.component.js +1 -1
- package/dist/lib/record-attachments/record-attachments.component.js +200 -201
- package/dist/lib/record-attachments/record-attachments.component.js.map +1 -1
- package/package.json +19 -19
|
@@ -897,7 +897,7 @@ export class StorageAdminDialogComponent {
|
|
|
897
897
|
i0.ɵɵconditional(ctx.IsEditingAccount ? 20 : -1);
|
|
898
898
|
i0.ɵɵadvance();
|
|
899
899
|
i0.ɵɵconditional(ctx.AccountToDelete ? 21 : -1);
|
|
900
|
-
} }, dependencies: [i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.CheckboxControlValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.NgModel, i2.LoadingComponent, i3.MJDialogComponent, i3.MJDialogActionsComponent, i3.MJEmptyStateComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n}\n\n.mj-storage-admin-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 16px;\n min-height: 460px;\n color: var(--mj-text-primary);\n}\n\n\n\n.mj-storage-admin-tabs[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n border-bottom: 1px solid var(--mj-border-default);\n padding-bottom: 8px;\n}\n\n.mj-tab-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n border-radius: var(--mj-radius-md, 8px);\n padding: 8px 14px;\n font-size: 0.86rem;\n font-weight: 500;\n color: var(--mj-text-secondary);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.15s ease;\n}\n\n.mj-tab-btn[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-tab-btn.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-weight: 600;\n}\n\n.mj-tab-count[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n font-weight: 600;\n padding: 2px 7px;\n border-radius: var(--mj-radius-full, 9999px);\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-secondary);\n}\n\n.mj-tab-btn.active[_ngcontent-%COMP%] .mj-tab-count[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n\n\n.mj-tab-pane[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n\n.mj-admin-pane-desc[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n color: var(--mj-text-secondary);\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 14px;\n border-radius: var(--mj-radius-md, 8px);\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n}\n\n.mj-admin-pane-toolbar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] {\n position: relative;\n flex: 1;\n max-width: 440px;\n display: flex;\n align-items: center;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] > i[_ngcontent-%COMP%] {\n position: absolute;\n left: 10px;\n font-size: 0.8rem;\n color: var(--mj-text-muted);\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 7px 32px 7px 32px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n color: var(--mj-text-primary);\n font-size: 0.82rem;\n outline: none;\n transition: all 0.12s ease;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.mj-clear-btn[_ngcontent-%COMP%] {\n position: absolute;\n right: 8px;\n background: none;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n padding: 2px;\n}\n\n.mj-admin-loading[_ngcontent-%COMP%] {\n padding: 40px;\n display: flex;\n justify-content: center;\n}\n\n.mj-empty-cta[_ngcontent-%COMP%] {\n margin-top: 14px;\n}\n\n\n\n.mj-admin-table-container[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md, 8px);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n\n.mj-admin-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.82rem;\n text-align: left;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 10px 14px;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n color: var(--mj-text-secondary);\n font-weight: 600;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-admin-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 10px 14px;\n border-bottom: 1px solid var(--mj-border-default);\n vertical-align: middle;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:last-child td[_ngcontent-%COMP%] {\n border-bottom: none;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover td[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-primary) 2%, var(--mj-bg-surface));\n}\n\n.mj-row-inactive[_ngcontent-%COMP%] {\n opacity: 0.6;\n}\n\n\n\n.mj-account-name-cell[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.mj-account-title[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.mj-account-desc[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-muted);\n}\n\n.mj-provider-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 8px;\n border-radius: 4px;\n background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-weight: 500;\n}\n\n.mj-provider-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.mj-provider-icon-circle[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n.mj-provider-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.mj-provider-desc[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-muted);\n}\n\n.mj-status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n padding: 3px 8px;\n border-radius: var(--mj-radius-full, 9999px);\n font-size: 0.72rem;\n font-weight: 600;\n}\n\n.mj-status-badge--success[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-status-success, #10b981) 14%, var(--mj-bg-surface));\n color: var(--mj-status-success, #10b981);\n}\n\n.mj-status-badge--warning[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, var(--mj-bg-surface));\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-status-badge--info[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.mj-status-badge--muted[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-muted);\n}\n\n.mj-role-count-badge[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-secondary);\n display: inline-flex;\n align-items: center;\n gap: 5px;\n}\n\n.mj-code-pill[_ngcontent-%COMP%] {\n font-family: var(--mj-font-mono, monospace);\n font-size: 0.74rem;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 5%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n padding: 2px 6px;\n border-radius: 4px;\n color: var(--mj-text-secondary);\n}\n\n.mj-priority-pill[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n font-weight: 600;\n padding: 2px 8px;\n border-radius: 4px;\n background: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-secondary);\n}\n\n.mj-action-button-group[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}\n\n.mj-action-icon-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n width: 28px;\n height: 28px;\n font-size: 0.78rem;\n color: var(--mj-text-secondary);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.12s;\n}\n\n.mj-action-icon-btn[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.mj-action-icon-btn--danger[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-status-error, #ef4444) 15%, var(--mj-bg-surface));\n color: var(--mj-status-error, #ef4444);\n border-color: var(--mj-status-error, #ef4444);\n}\n\n.mj-text-right[_ngcontent-%COMP%] {\n text-align: right;\n}\n\n.mj-text-center[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n\n\n.mj-toggle-switch[_ngcontent-%COMP%] {\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n cursor: pointer;\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%] {\n opacity: 0;\n width: 0;\n height: 0;\n}\n\n.mj-toggle-slider[_ngcontent-%COMP%] {\n position: absolute;\n inset: 0;\n background-color: color-mix(in srgb, var(--mj-text-primary) 20%, var(--mj-bg-surface));\n border-radius: 20px;\n transition: 0.2s ease;\n}\n\n.mj-toggle-slider[_ngcontent-%COMP%]:before {\n position: absolute;\n content: \"\";\n height: 14px;\n width: 14px;\n left: 3px;\n bottom: 3px;\n background-color: var(--mj-bg-surface);\n border-radius: 50%;\n transition: 0.2s ease;\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:checked + .mj-toggle-slider[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:checked + .mj-toggle-slider[_ngcontent-%COMP%]:before {\n transform: translateX(16px);\n}\n\n\n\n.mj-account-editor-form[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 14px;\n padding: 4px 0;\n}\n\n.mj-form-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 5px;\n}\n\n.mj-form-label-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.mj-form-label[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n}\n\n.mj-required[_ngcontent-%COMP%] {\n color: var(--mj-status-error, #ef4444);\n}\n\n.mj-form-input[_ngcontent-%COMP%], .mj-form-select[_ngcontent-%COMP%], .mj-form-textarea[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 8px 10px;\n font-size: 0.84rem;\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface);\n outline: none;\n font-family: inherit;\n transition: border-color 0.12s;\n}\n\n.mj-form-input[_ngcontent-%COMP%]:focus, .mj-form-select[_ngcontent-%COMP%]:focus, .mj-form-textarea[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.mj-form-hint[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n color: var(--mj-text-muted);\n}\n\n.mj-credential-input-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.mj-credential-input-row[_ngcontent-%COMP%] .mj-form-select[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.mj-form-checkbox-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 6px 0;\n}\n\n.mj-checkbox-label[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n font-size: 0.82rem;\n font-weight: 500;\n cursor: pointer;\n}\n\n.mj-checkbox-hint[_ngcontent-%COMP%] {\n margin-left: 22px;\n}\n\n.mj-roles-checklist[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));\n gap: 8px;\n max-height: 140px;\n overflow-y: auto;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 10px;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n}\n\n.mj-role-check-item[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 0.78rem;\n color: var(--mj-text-primary);\n cursor: pointer;\n}\n\n\n\n.mj-delete-confirm-body[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n padding: 10px 0;\n}\n\n.mj-delete-confirm-icon[_ngcontent-%COMP%] {\n font-size: 2.2rem;\n color: var(--mj-status-error, #ef4444);\n flex-shrink: 0;\n}\n\n.mj-delete-confirm-title[_ngcontent-%COMP%] {\n font-size: 0.92rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 6px 0;\n}\n\n.mj-delete-confirm-subtitle[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n color: var(--mj-text-secondary);\n line-height: 1.4;\n margin: 0;\n}\n\n\n\n.mj-admin-btn[_ngcontent-%COMP%] {\n padding: 7px 14px;\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.82rem;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border: 1px solid transparent;\n transition: all 0.12s;\n}\n\n.mj-admin-btn-primary[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n.mj-admin-btn-primary[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary-hover);\n}\n\n.mj-admin-btn-secondary[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border-color: var(--mj-border-default);\n color: var(--mj-text-secondary);\n}\n\n.mj-admin-btn-secondary[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-admin-btn-danger[_ngcontent-%COMP%] {\n background: var(--mj-status-error, #ef4444);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n.mj-admin-btn-danger[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary, #000000) 15%, var(--mj-status-error, #ef4444));\n}\n\n.mj-admin-btn-link[_ngcontent-%COMP%] {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n font-size: 0.78rem;\n font-weight: 600;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 0;\n}\n\n.mj-admin-btn-link[_ngcontent-%COMP%]:hover {\n text-decoration: underline;\n}"] });
|
|
900
|
+
} }, dependencies: [i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.CheckboxControlValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.NgModel, i2.LoadingComponent, i3.MJDialogComponent, i3.MJDialogActionsComponent, i3.MJEmptyStateComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n}\n\n.mj-storage-admin-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 16px;\n min-height: 460px;\n color: var(--mj-text-primary);\n}\n\n\n.mj-storage-admin-tabs[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n border-bottom: 1px solid var(--mj-border-default);\n padding-bottom: 8px;\n}\n\n.mj-tab-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n border-radius: var(--mj-radius-md, 8px);\n padding: 8px 14px;\n font-size: 0.86rem;\n font-weight: 500;\n color: var(--mj-text-secondary);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.15s ease;\n}\n\n.mj-tab-btn[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-tab-btn.active[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-weight: 600;\n}\n\n.mj-tab-count[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n font-weight: 600;\n padding: 2px 7px;\n border-radius: var(--mj-radius-full, 9999px);\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-secondary);\n}\n\n.mj-tab-btn.active[_ngcontent-%COMP%] .mj-tab-count[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n\n.mj-tab-pane[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 14px;\n}\n\n.mj-admin-pane-desc[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n color: var(--mj-text-secondary);\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 14px;\n border-radius: var(--mj-radius-md, 8px);\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n}\n\n.mj-admin-pane-toolbar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] {\n position: relative;\n flex: 1;\n max-width: 440px;\n display: flex;\n align-items: center;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] > i[_ngcontent-%COMP%] {\n position: absolute;\n left: 10px;\n font-size: 0.8rem;\n color: var(--mj-text-muted);\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 7px 32px 7px 32px;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n color: var(--mj-text-primary);\n font-size: 0.82rem;\n outline: none;\n transition: all 0.12s ease;\n}\n\n.mj-admin-search-wrapper[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.mj-clear-btn[_ngcontent-%COMP%] {\n position: absolute;\n right: 8px;\n background: none;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n padding: 2px;\n}\n\n.mj-admin-loading[_ngcontent-%COMP%] {\n padding: 40px;\n display: flex;\n justify-content: center;\n}\n\n.mj-empty-cta[_ngcontent-%COMP%] {\n margin-top: 14px;\n}\n\n\n.mj-admin-table-container[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md, 8px);\n overflow: hidden;\n background: var(--mj-bg-surface);\n}\n\n.mj-admin-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.82rem;\n text-align: left;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 10px 14px;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n color: var(--mj-text-secondary);\n font-weight: 600;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mj-admin-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 10px 14px;\n border-bottom: 1px solid var(--mj-border-default);\n vertical-align: middle;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:last-child td[_ngcontent-%COMP%] {\n border-bottom: none;\n}\n\n.mj-admin-table[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover td[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-primary) 2%, var(--mj-bg-surface));\n}\n\n.mj-row-inactive[_ngcontent-%COMP%] {\n opacity: 0.6;\n}\n\n\n.mj-account-name-cell[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.mj-account-title[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.mj-account-desc[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-muted);\n}\n\n.mj-provider-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 3px 8px;\n border-radius: 4px;\n background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n font-weight: 500;\n}\n\n.mj-provider-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.mj-provider-icon-circle[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n.mj-provider-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.mj-provider-desc[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-muted);\n}\n\n.mj-status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n padding: 3px 8px;\n border-radius: var(--mj-radius-full, 9999px);\n font-size: 0.72rem;\n font-weight: 600;\n}\n\n.mj-status-badge--success[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-status-success, #10b981) 14%, var(--mj-bg-surface));\n color: var(--mj-status-success, #10b981);\n}\n\n.mj-status-badge--warning[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, var(--mj-bg-surface));\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-status-badge--info[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.mj-status-badge--muted[_ngcontent-%COMP%] {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-muted);\n}\n\n.mj-role-count-badge[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-secondary);\n display: inline-flex;\n align-items: center;\n gap: 5px;\n}\n\n.mj-code-pill[_ngcontent-%COMP%] {\n font-family: var(--mj-font-mono, monospace);\n font-size: 0.74rem;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 5%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n padding: 2px 6px;\n border-radius: 4px;\n color: var(--mj-text-secondary);\n}\n\n.mj-priority-pill[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n font-weight: 600;\n padding: 2px 8px;\n border-radius: 4px;\n background: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-secondary);\n}\n\n.mj-action-button-group[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n}\n\n.mj-action-icon-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n width: 28px;\n height: 28px;\n font-size: 0.78rem;\n color: var(--mj-text-secondary);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.12s;\n}\n\n.mj-action-icon-btn[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.mj-action-icon-btn--danger[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-status-error, #ef4444) 15%, var(--mj-bg-surface));\n color: var(--mj-status-error, #ef4444);\n border-color: var(--mj-status-error, #ef4444);\n}\n\n.mj-text-right[_ngcontent-%COMP%] {\n text-align: right;\n}\n\n.mj-text-center[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n\n.mj-toggle-switch[_ngcontent-%COMP%] {\n position: relative;\n display: inline-block;\n width: 36px;\n height: 20px;\n cursor: pointer;\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%] {\n opacity: 0;\n width: 0;\n height: 0;\n}\n\n.mj-toggle-slider[_ngcontent-%COMP%] {\n position: absolute;\n inset: 0;\n background-color: color-mix(in srgb, var(--mj-text-primary) 20%, var(--mj-bg-surface));\n border-radius: 20px;\n transition: 0.2s ease;\n}\n\n.mj-toggle-slider[_ngcontent-%COMP%]:before {\n position: absolute;\n content: \"\";\n height: 14px;\n width: 14px;\n left: 3px;\n bottom: 3px;\n background-color: var(--mj-bg-surface);\n border-radius: 50%;\n transition: 0.2s ease;\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:checked + .mj-toggle-slider[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n}\n\n.mj-toggle-switch[_ngcontent-%COMP%] input[_ngcontent-%COMP%]:checked + .mj-toggle-slider[_ngcontent-%COMP%]:before {\n transform: translateX(16px);\n}\n\n\n.mj-account-editor-form[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 14px;\n padding: 4px 0;\n}\n\n.mj-form-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 5px;\n}\n\n.mj-form-label-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n\n.mj-form-label[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n}\n\n.mj-required[_ngcontent-%COMP%] {\n color: var(--mj-status-error, #ef4444);\n}\n\n.mj-form-input[_ngcontent-%COMP%], .mj-form-select[_ngcontent-%COMP%], .mj-form-textarea[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 8px 10px;\n font-size: 0.84rem;\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface);\n outline: none;\n font-family: inherit;\n transition: border-color 0.12s;\n}\n\n.mj-form-input[_ngcontent-%COMP%]:focus, .mj-form-select[_ngcontent-%COMP%]:focus, .mj-form-textarea[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.mj-form-hint[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n color: var(--mj-text-muted);\n}\n\n.mj-credential-input-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.mj-credential-input-row[_ngcontent-%COMP%] .mj-form-select[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.mj-form-checkbox-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n padding: 6px 0;\n}\n\n.mj-checkbox-label[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n font-size: 0.82rem;\n font-weight: 500;\n cursor: pointer;\n}\n\n.mj-checkbox-hint[_ngcontent-%COMP%] {\n margin-left: 22px;\n}\n\n.mj-roles-checklist[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));\n gap: 8px;\n max-height: 140px;\n overflow-y: auto;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 10px;\n background: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n}\n\n.mj-role-check-item[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-size: 0.78rem;\n color: var(--mj-text-primary);\n cursor: pointer;\n}\n\n\n.mj-delete-confirm-body[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n padding: 10px 0;\n}\n\n.mj-delete-confirm-icon[_ngcontent-%COMP%] {\n font-size: 2.2rem;\n color: var(--mj-status-error, #ef4444);\n flex-shrink: 0;\n}\n\n.mj-delete-confirm-title[_ngcontent-%COMP%] {\n font-size: 0.92rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 6px 0;\n}\n\n.mj-delete-confirm-subtitle[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n color: var(--mj-text-secondary);\n line-height: 1.4;\n margin: 0;\n}\n\n\n.mj-admin-btn[_ngcontent-%COMP%] {\n padding: 7px 14px;\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.82rem;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n border: 1px solid transparent;\n transition: all 0.12s;\n}\n\n.mj-admin-btn-primary[_ngcontent-%COMP%] {\n background: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n.mj-admin-btn-primary[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary-hover);\n}\n\n.mj-admin-btn-secondary[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface);\n border-color: var(--mj-border-default);\n color: var(--mj-text-secondary);\n}\n\n.mj-admin-btn-secondary[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary) 8%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-admin-btn-danger[_ngcontent-%COMP%] {\n background: var(--mj-status-error, #ef4444);\n color: var(--mj-text-inverse, #ffffff);\n}\n\n.mj-admin-btn-danger[_ngcontent-%COMP%]:hover {\n background: color-mix(in srgb, var(--mj-text-primary, #000000) 15%, var(--mj-status-error, #ef4444));\n}\n\n.mj-admin-btn-link[_ngcontent-%COMP%] {\n background: none;\n border: none;\n color: var(--mj-brand-primary);\n font-size: 0.78rem;\n font-weight: 600;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 0;\n}\n\n.mj-admin-btn-link[_ngcontent-%COMP%]:hover {\n text-decoration: underline;\n}"] });
|
|
901
901
|
}
|
|
902
902
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(StorageAdminDialogComponent, [{
|
|
903
903
|
type: Component,
|
|
@@ -281,11 +281,11 @@ export class CategoryTreeComponent extends BaseAngularComponent {
|
|
|
281
281
|
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CategoryTreeComponent, selectors: [["mj-files-category-tree"]], outputs: { categorySelected: "categorySelected" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 26, vars: 9, consts: [["treeNode", ""], ["newForm", "ngForm"], ["renameForm", "ngForm"], [1, "container"], [1, "tree-header"], ["mjButton", "", 3, "click"], ["mjButton", "", "variant", "primary", "size", "sm", 3, "click"], [1, "category-tree"], [1, "context-menu", 3, "top", "left"], ["Title", "New file category", 3, "Close", "Visible", "Width", "MinWidth"], [1, "dialog-form-container"], [1, "mj-form-field"], [1, "mj-form-label"], ["name", "name", "required", "", 1, "mj-input", 3, "ngModelChange", "ngModel", "disabled"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], ["mjButton", "", 3, "click", "disabled"], ["Title", "Rename file category", 3, "Visible", "Width", "MinWidth"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "tree-node"], [1, "tree-node-row", 3, "click", "contextmenu"], [1, "tree-expand-btn"], [1, "tree-expand-placeholder"], [1, "fa-solid", "fa-folder", "tree-folder-icon"], [1, "tree-node-label"], [1, "tree-expand-btn", 3, "click"], [1, "fa-solid"], [1, "context-menu", 3, "click"], [1, "context-menu-item", 3, "click"], [1, "fa-solid", "fa-pen"], ["disabled", "", 1, "context-menu-item", 3, "click"], [1, "fa-solid", "fa-trash-can"], ["Title", "Rename file category", 3, "Close", "Visible", "Width", "MinWidth"], ["name", "Name", "required", "", 1, "mj-input", 3, "ngModelChange", "ngModel", "disabled"]], template: function CategoryTreeComponent_Template(rf, ctx) { if (rf & 1) {
|
|
282
282
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
283
283
|
i0.ɵɵelementStart(0, "div", 3)(1, "div", 4)(2, "button", 5);
|
|
284
|
-
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_2_listener() {
|
|
284
|
+
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_2_listener() { return ctx.clearSelection(); });
|
|
285
285
|
i0.ɵɵtext(3, "All Files");
|
|
286
286
|
i0.ɵɵelementEnd();
|
|
287
287
|
i0.ɵɵelementStart(4, "button", 6);
|
|
288
|
-
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_4_listener() {
|
|
288
|
+
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_4_listener() { return ctx.createNewCategory(); });
|
|
289
289
|
i0.ɵɵtext(5, "Add category");
|
|
290
290
|
i0.ɵɵelementEnd()();
|
|
291
291
|
i0.ɵɵelementStart(6, "div", 7);
|
|
@@ -294,7 +294,7 @@ export class CategoryTreeComponent extends BaseAngularComponent {
|
|
|
294
294
|
i0.ɵɵtemplate(9, CategoryTreeComponent_ng_template_9_Template, 8, 7, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
|
|
295
295
|
i0.ɵɵconditionalCreate(11, CategoryTreeComponent_Conditional_11_Template, 7, 4, "div", 8);
|
|
296
296
|
i0.ɵɵelementStart(12, "mj-dialog", 9);
|
|
297
|
-
i0.ɵɵlistener("Close", function CategoryTreeComponent_Template_mj_dialog_Close_12_listener() {
|
|
297
|
+
i0.ɵɵlistener("Close", function CategoryTreeComponent_Template_mj_dialog_Close_12_listener() { return ctx.cancelNewCategory(); });
|
|
298
298
|
i0.ɵɵelementStart(13, "div", 10)(14, "form", null, 1)(16, "label", 11)(17, "span", 12);
|
|
299
299
|
i0.ɵɵtext(18, "Name");
|
|
300
300
|
i0.ɵɵelementEnd();
|
|
@@ -302,11 +302,11 @@ export class CategoryTreeComponent extends BaseAngularComponent {
|
|
|
302
302
|
i0.ɵɵtwoWayListener("ngModelChange", function CategoryTreeComponent_Template_input_ngModelChange_19_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.newCategoryName, $event) || (ctx.newCategoryName = $event); return i0.ɵɵresetView($event); });
|
|
303
303
|
i0.ɵɵelementEnd()()()();
|
|
304
304
|
i0.ɵɵelementStart(20, "mj-dialog-actions")(21, "button", 14);
|
|
305
|
-
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_21_listener() {
|
|
305
|
+
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_21_listener() { return ctx.saveNewCategory(); });
|
|
306
306
|
i0.ɵɵtext(22, "Save");
|
|
307
307
|
i0.ɵɵelementEnd();
|
|
308
308
|
i0.ɵɵelementStart(23, "button", 15);
|
|
309
|
-
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_23_listener() {
|
|
309
|
+
i0.ɵɵlistener("click", function CategoryTreeComponent_Template_button_click_23_listener() { return ctx.cancelNewCategory(); });
|
|
310
310
|
i0.ɵɵtext(24, "Cancel");
|
|
311
311
|
i0.ɵɵelementEnd()()();
|
|
312
312
|
i0.ɵɵconditionalCreate(25, CategoryTreeComponent_Conditional_25_Template, 13, 7, "mj-dialog", 16);
|
|
@@ -327,7 +327,7 @@ export class CategoryTreeComponent extends BaseAngularComponent {
|
|
|
327
327
|
i0.ɵɵproperty("disabled", ctx.isLoading);
|
|
328
328
|
i0.ɵɵadvance(2);
|
|
329
329
|
i0.ɵɵconditional(!!ctx.renameFileCategory ? 25 : -1);
|
|
330
|
-
} }, dependencies: [i2.NgTemplateOutlet, i3.ɵNgNoValidate, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgControlStatusGroup, i3.RequiredValidator, i3.NgModel, i3.NgForm, i4.MJButtonDirective, i4.MJDialogComponent, i4.MJDialogActionsComponent], styles: ["\n
|
|
330
|
+
} }, dependencies: [i2.NgTemplateOutlet, i3.ɵNgNoValidate, i3.DefaultValueAccessor, i3.NgControlStatus, i3.NgControlStatusGroup, i3.RequiredValidator, i3.NgModel, i3.NgForm, i4.MJButtonDirective, i4.MJDialogComponent, i4.MJDialogActionsComponent], styles: ["\n.container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n}\n\n.category-tree[_ngcontent-%COMP%] {\n width: 250px;\n max-height: 500px;\n overflow-y: auto;\n border: 1px solid var(--mj-border-subtle);\n border-radius: 4px;\n background: var(--mj-bg-surface);\n}\n\n.tree-header[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding-right: 4px;\n margin-bottom: 4px;\n}\n\n.tree-node-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n padding: 4px 8px;\n cursor: pointer;\n border-radius: 4px;\n transition: background-color 0.15s;\n user-select: none;\n}\n\n.tree-node-row[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-hover);\n}\n\n.tree-node-row.selected[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.tree-expand-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n width: 16px;\n height: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-text-muted);\n font-size: 10px;\n}\n\n.tree-expand-placeholder[_ngcontent-%COMP%] {\n width: 16px;\n height: 16px;\n display: inline-block;\n}\n\n.tree-folder-icon[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 14px;\n}\n\n.tree-node-label[_ngcontent-%COMP%] {\n font-size: 13px;\n color: var(--mj-text-primary);\n}\n\n\n.context-menu[_ngcontent-%COMP%] {\n position: fixed;\n z-index: 10000;\n background: var(--mj-bg-surface-elevated);\n border: 1px solid var(--mj-border-default);\n border-radius: 6px;\n box-shadow: 0 4px 12px var(--mj-bg-overlay);\n padding: 4px 0;\n min-width: 140px;\n}\n\n.context-menu-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n padding: 8px 16px;\n border: none;\n background: none;\n color: var(--mj-text-primary);\n font-size: 13px;\n cursor: pointer;\n text-align: left;\n}\n\n.context-menu-item[_ngcontent-%COMP%]:hover:not(:disabled) {\n background: var(--mj-bg-surface-hover);\n}\n\n.context-menu-item[_ngcontent-%COMP%]:disabled {\n opacity: 0.4;\n cursor: default;\n}\n\n.dialog-form-container[_ngcontent-%COMP%] {\n padding: 8px 0;\n}\n\n.mj-form-field[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: row;\n align-items: center;\n column-gap: 12px;\n margin-bottom: 8px;\n}\n\n.mj-form-label[_ngcontent-%COMP%] {\n min-width: 80px;\n color: var(--mj-text-secondary);\n font-weight: 500;\n}\n\n.mj-form-field[_ngcontent-%COMP%] .mj-input[_ngcontent-%COMP%] {\n width: 100%;\n}"] });
|
|
331
331
|
}
|
|
332
332
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CategoryTreeComponent, [{
|
|
333
333
|
type: Component,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"category-tree.js","sourceRoot":"","sources":["../../../src/lib/category-tree/category-tree.ts","../../../src/lib/category-tree/category-tree.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, OnInit, Output } from '@angular/core';\nimport { MJNotificationService } from '@memberjunction/ng-notifications';\nimport { RunView } from '@memberjunction/core';\nimport { MJFileCategoryEntity } from '@memberjunction/core-entities';\nimport { UUIDsEqual } from '@memberjunction/global';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\n\n@Component({\n standalone: false,\n selector: 'mj-files-category-tree',\n templateUrl: './category-tree.html',\n styleUrls: ['./category-tree.css'],\n})\nexport class CategoryTreeComponent extends BaseAngularComponent implements OnInit {\n @Output() categorySelected = new EventEmitter<string | undefined>();\n\n public isLoading: boolean = false;\n public showNew: boolean = false;\n public newCategoryName = '';\n public renameFileCategory: MJFileCategoryEntity | undefined;\n\n public categoriesData: MJFileCategoryEntity[] = [];\n\n /** Expanded node IDs for the tree */\n public expandedIds = new Set<string>();\n\n /** Currently selected node ID */\n private selectedId: string | undefined;\n\n /** Context menu state */\n public contextMenuVisible = false;\n public contextMenuX = 0;\n public contextMenuY = 0;\n private contextMenuNode: MJFileCategoryEntity | undefined;\n\n private get md() { return this.ProviderToUse; }\n\n constructor(private notifications: MJNotificationService) { super(); }\n\n ngOnInit(): void {\n this.Refresh();\n }\n\n /** Returns root-level nodes (no parent). */\n get rootNodes(): MJFileCategoryEntity[] {\n return this.categoriesData.filter((c) => !c.ParentID);\n }\n\n /** Checks if a node has children. */\n hasChildren(node: MJFileCategoryEntity): boolean {\n return this.categoriesData.some((c) => UUIDsEqual(c.ParentID, node.ID));\n }\n\n /** Returns children of a node. */\n getChildren(node: MJFileCategoryEntity): MJFileCategoryEntity[] {\n return this.categoriesData.filter((c) => UUIDsEqual(c.ParentID, node.ID));\n }\n\n /** Checks if a node is expanded. */\n isExpanded(node: MJFileCategoryEntity): boolean {\n return this.expandedIds.has(node.ID);\n }\n\n /** Toggles expand/collapse on a node. */\n toggleExpand(node: MJFileCategoryEntity, event: Event): void {\n event.stopPropagation();\n if (this.expandedIds.has(node.ID)) {\n this.expandedIds.delete(node.ID);\n } else {\n this.expandedIds.add(node.ID);\n }\n }\n\n /** Checks if a node is the currently selected node. */\n isSelected(node: MJFileCategoryEntity): boolean {\n return this.selectedId != null && UUIDsEqual(this.selectedId, node.ID);\n }\n\n /** Selects a node and emits event. */\n selectNode(node: MJFileCategoryEntity): void {\n this.selectedId = node.ID;\n this.categorySelected.emit(node.ID);\n }\n\n /** Opens context menu on right-click. */\n onContextMenu(event: MouseEvent, node: MJFileCategoryEntity): void {\n event.preventDefault();\n event.stopPropagation();\n this.contextMenuNode = node;\n this.contextMenuX = event.clientX;\n this.contextMenuY = event.clientY;\n this.contextMenuVisible = true;\n }\n\n /** Closes the context menu. */\n closeContextMenu(): void {\n this.contextMenuVisible = false;\n this.contextMenuNode = undefined;\n }\n\n /** Handles context menu action selection. */\n onContextMenuAction(action: string): void {\n const node = this.contextMenuNode;\n this.closeContextMenu();\n if (!node) {\n return;\n }\n\n switch (action) {\n case 'rename':\n this.renameFileCategory = node;\n break;\n case 'delete':\n this.deleteCategory(node);\n break;\n }\n }\n\n async createNewCategory() {\n this.showNew = true;\n }\n\n cancelNewCategory() {\n this.showNew = false;\n }\n\n async saveNewCategory() {\n this.isLoading = true;\n const categoryEntity: MJFileCategoryEntity = await this.md.GetEntityObject('MJ: File Categories', this.md.CurrentUser);\n categoryEntity.NewRecord();\n categoryEntity.Name = this.newCategoryName;\n await categoryEntity?.Save();\n this.categoriesData = [...this.categoriesData, categoryEntity];\n this.showNew = false;\n this.newCategoryName = '';\n this.isLoading = false;\n }\n\n async deleteCategory(fileCategory: MJFileCategoryEntity) {\n this.isLoading = true;\n const { ID } = fileCategory;\n const success = await fileCategory.Delete();\n if (!success) {\n console.error('Unable to delete file category:', fileCategory);\n this.notifications.CreateSimpleNotification(`Unable to delete category '${fileCategory.Name}'`, 'error');\n this.isLoading = false;\n return;\n }\n\n this.categoriesData = this.categoriesData.filter((c) => !UUIDsEqual(c.ID, ID));\n this.clearSelection();\n this.isLoading = false;\n }\n\n clearSelection() {\n this.selectedId = undefined;\n this.categorySelected.emit(undefined);\n }\n\n cancelRename() {\n this.renameFileCategory?.Revert();\n this.renameFileCategory = undefined;\n }\n\n async saveRename() {\n this.isLoading = true;\n await this.renameFileCategory?.Save();\n this.renameFileCategory = undefined;\n this.isLoading = false;\n }\n\n async Refresh() {\n this.isLoading = true;\n\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView({\n EntityName: 'MJ: File Categories',\n ResultType: 'entity_object',\n });\n\n if (result.Success) {\n this.categoriesData = <MJFileCategoryEntity[]>result.Results;\n } else {\n throw new Error('Error loading file categories: ' + result.ErrorMessage);\n }\n this.isLoading = false;\n }\n}\n","<div class=\"container\">\n <div class=\"tree-header\">\n <button mjButton (click)=\"clearSelection()\">All Files</button>\n <button mjButton variant=\"primary\" size=\"sm\" (click)=\"createNewCategory()\">Add category</button>\n </div>\n\n <div class=\"category-tree\">\n @for (node of rootNodes; track node.ID) {\n <ng-container *ngTemplateOutlet=\"treeNode; context: { $implicit: node, level: 0 }\"></ng-container>\n }\n </div>\n\n <ng-template #treeNode let-node let-level=\"level\">\n <div class=\"tree-node\" [style.padding-left.px]=\"level * 20\">\n <div class=\"tree-node-row\"\n [class.selected]=\"isSelected(node)\"\n (click)=\"selectNode(node)\"\n (contextmenu)=\"onContextMenu($event, node)\">\n @if (hasChildren(node)) {\n <button class=\"tree-expand-btn\" (click)=\"toggleExpand(node, $event)\">\n <i class=\"fa-solid\" [class.fa-chevron-right]=\"!isExpanded(node)\" [class.fa-chevron-down]=\"isExpanded(node)\"></i>\n </button>\n } @else {\n <span class=\"tree-expand-placeholder\"></span>\n }\n <i class=\"fa-solid fa-folder tree-folder-icon\"></i>\n <span class=\"tree-node-label\">{{ node.Name }}</span>\n </div>\n @if (isExpanded(node)) {\n @for (child of getChildren(node); track child.ID) {\n <ng-container *ngTemplateOutlet=\"treeNode; context: { $implicit: child, level: level + 1 }\"></ng-container>\n }\n }\n </div>\n </ng-template>\n\n <!-- Context Menu -->\n @if (contextMenuVisible) {\n <div class=\"context-menu\"\n [style.top.px]=\"contextMenuY\"\n [style.left.px]=\"contextMenuX\"\n (document:click)=\"closeContextMenu()\">\n <button class=\"context-menu-item\" (click)=\"onContextMenuAction('rename')\">\n <i class=\"fa-solid fa-pen\"></i> Rename\n </button>\n <button class=\"context-menu-item\" (click)=\"onContextMenuAction('delete')\" disabled>\n <i class=\"fa-solid fa-trash-can\"></i> Delete\n </button>\n </div>\n }\n\n <mj-dialog\n [Visible]=\"showNew\"\n Title=\"New file category\"\n [Width]=\"450\"\n [MinWidth]=\"250\"\n (Close)=\"cancelNewCategory()\">\n <div class=\"dialog-form-container\">\n <form #newForm=\"ngForm\">\n <label class=\"mj-form-field\">\n <span class=\"mj-form-label\">Name</span>\n <input\n class=\"mj-input\"\n name=\"name\"\n [(ngModel)]=\"newCategoryName\"\n required\n [disabled]=\"isLoading\" />\n </label>\n </form>\n </div>\n <mj-dialog-actions>\n <button mjButton variant=\"primary\" (click)=\"saveNewCategory()\" [disabled]=\"isLoading\">Save</button>\n <button mjButton (click)=\"cancelNewCategory()\" [disabled]=\"isLoading\">Cancel</button>\n </mj-dialog-actions>\n </mj-dialog>\n\n @if (!!renameFileCategory) {\n <mj-dialog\n [Visible]=\"true\"\n Title=\"Rename file category\"\n [Width]=\"450\"\n [MinWidth]=\"250\"\n (Close)=\"cancelRename()\">\n <div class=\"dialog-form-container\">\n <form #renameForm=\"ngForm\">\n <label class=\"mj-form-field\">\n <span class=\"mj-form-label\">Name</span>\n <input\n class=\"mj-input\"\n name=\"Name\"\n [(ngModel)]=\"renameFileCategory.Name\"\n required\n [disabled]=\"isLoading\" />\n </label>\n </form>\n </div>\n <mj-dialog-actions>\n <button mjButton variant=\"primary\" (click)=\"saveRename()\" [disabled]=\"isLoading || !renameFileCategory.Dirty\">Save</button>\n <button mjButton (click)=\"cancelRename()\" [disabled]=\"isLoading\">Cancel</button>\n </mj-dialog-actions>\n </mj-dialog>\n }\n</div>\n"]}
|
|
1
|
+
{"version":3,"file":"category-tree.js","sourceRoot":"","sources":["../../../src/lib/category-tree/category-tree.ts","../../../src/lib/category-tree/category-tree.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, OnInit, Output } from '@angular/core';\nimport { MJNotificationService } from '@memberjunction/ng-notifications';\nimport { RunView } from '@memberjunction/core';\nimport { MJFileCategoryEntity } from '@memberjunction/core-entities';\nimport { UUIDsEqual } from '@memberjunction/global';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\n\n@Component({\n standalone: false,\n selector: 'mj-files-category-tree',\n templateUrl: './category-tree.html',\n styleUrls: ['./category-tree.css'],\n})\nexport class CategoryTreeComponent extends BaseAngularComponent implements OnInit {\n @Output() categorySelected = new EventEmitter<string | undefined>();\n\n public isLoading: boolean = false;\n public showNew: boolean = false;\n public newCategoryName = '';\n public renameFileCategory: MJFileCategoryEntity | undefined;\n\n public categoriesData: MJFileCategoryEntity[] = [];\n\n /** Expanded node IDs for the tree */\n public expandedIds = new Set<string>();\n\n /** Currently selected node ID */\n private selectedId: string | undefined;\n\n /** Context menu state */\n public contextMenuVisible = false;\n public contextMenuX = 0;\n public contextMenuY = 0;\n private contextMenuNode: MJFileCategoryEntity | undefined;\n\n private get md() { return this.ProviderToUse; }\n\n constructor(private notifications: MJNotificationService) { super(); }\n\n ngOnInit(): void {\n this.Refresh();\n }\n\n /** Returns root-level nodes (no parent). */\n get rootNodes(): MJFileCategoryEntity[] {\n return this.categoriesData.filter((c) => !c.ParentID);\n }\n\n /** Checks if a node has children. */\n hasChildren(node: MJFileCategoryEntity): boolean {\n return this.categoriesData.some((c) => UUIDsEqual(c.ParentID, node.ID));\n }\n\n /** Returns children of a node. */\n getChildren(node: MJFileCategoryEntity): MJFileCategoryEntity[] {\n return this.categoriesData.filter((c) => UUIDsEqual(c.ParentID, node.ID));\n }\n\n /** Checks if a node is expanded. */\n isExpanded(node: MJFileCategoryEntity): boolean {\n return this.expandedIds.has(node.ID);\n }\n\n /** Toggles expand/collapse on a node. */\n toggleExpand(node: MJFileCategoryEntity, event: Event): void {\n event.stopPropagation();\n if (this.expandedIds.has(node.ID)) {\n this.expandedIds.delete(node.ID);\n } else {\n this.expandedIds.add(node.ID);\n }\n }\n\n /** Checks if a node is the currently selected node. */\n isSelected(node: MJFileCategoryEntity): boolean {\n return this.selectedId != null && UUIDsEqual(this.selectedId, node.ID);\n }\n\n /** Selects a node and emits event. */\n selectNode(node: MJFileCategoryEntity): void {\n this.selectedId = node.ID;\n this.categorySelected.emit(node.ID);\n }\n\n /** Opens context menu on right-click. */\n onContextMenu(event: MouseEvent, node: MJFileCategoryEntity): void {\n event.preventDefault();\n event.stopPropagation();\n this.contextMenuNode = node;\n this.contextMenuX = event.clientX;\n this.contextMenuY = event.clientY;\n this.contextMenuVisible = true;\n }\n\n /** Closes the context menu. */\n closeContextMenu(): void {\n this.contextMenuVisible = false;\n this.contextMenuNode = undefined;\n }\n\n /** Handles context menu action selection. */\n onContextMenuAction(action: string): void {\n const node = this.contextMenuNode;\n this.closeContextMenu();\n if (!node) {\n return;\n }\n\n switch (action) {\n case 'rename':\n this.renameFileCategory = node;\n break;\n case 'delete':\n this.deleteCategory(node);\n break;\n }\n }\n\n async createNewCategory() {\n this.showNew = true;\n }\n\n cancelNewCategory() {\n this.showNew = false;\n }\n\n async saveNewCategory() {\n this.isLoading = true;\n const categoryEntity: MJFileCategoryEntity = await this.md.GetEntityObject('MJ: File Categories', this.md.CurrentUser);\n categoryEntity.NewRecord();\n categoryEntity.Name = this.newCategoryName;\n await categoryEntity?.Save();\n this.categoriesData = [...this.categoriesData, categoryEntity];\n this.showNew = false;\n this.newCategoryName = '';\n this.isLoading = false;\n }\n\n async deleteCategory(fileCategory: MJFileCategoryEntity) {\n this.isLoading = true;\n const { ID } = fileCategory;\n const success = await fileCategory.Delete();\n if (!success) {\n console.error('Unable to delete file category:', fileCategory);\n this.notifications.CreateSimpleNotification(`Unable to delete category '${fileCategory.Name}'`, 'error');\n this.isLoading = false;\n return;\n }\n\n this.categoriesData = this.categoriesData.filter((c) => !UUIDsEqual(c.ID, ID));\n this.clearSelection();\n this.isLoading = false;\n }\n\n clearSelection() {\n this.selectedId = undefined;\n this.categorySelected.emit(undefined);\n }\n\n cancelRename() {\n this.renameFileCategory?.Revert();\n this.renameFileCategory = undefined;\n }\n\n async saveRename() {\n this.isLoading = true;\n await this.renameFileCategory?.Save();\n this.renameFileCategory = undefined;\n this.isLoading = false;\n }\n\n async Refresh() {\n this.isLoading = true;\n\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView({\n EntityName: 'MJ: File Categories',\n ResultType: 'entity_object',\n });\n\n if (result.Success) {\n this.categoriesData = <MJFileCategoryEntity[]>result.Results;\n } else {\n throw new Error('Error loading file categories: ' + result.ErrorMessage);\n }\n this.isLoading = false;\n }\n}\n","<div class=\"container\">\n <div class=\"tree-header\">\n <button mjButton (click)=\"clearSelection()\">All Files</button>\n <button mjButton variant=\"primary\" size=\"sm\" (click)=\"createNewCategory()\">Add category</button>\n </div>\n\n <div class=\"category-tree\">\n @for (node of rootNodes; track node.ID) {\n <ng-container *ngTemplateOutlet=\"treeNode; context: { $implicit: node, level: 0 }\"></ng-container>\n }\n </div>\n\n <ng-template #treeNode let-node let-level=\"level\">\n <div class=\"tree-node\" [style.padding-left.px]=\"level * 20\">\n <div class=\"tree-node-row\"\n [class.selected]=\"isSelected(node)\"\n (click)=\"selectNode(node)\"\n (contextmenu)=\"onContextMenu($event, node)\">\n @if (hasChildren(node)) {\n <button class=\"tree-expand-btn\" (click)=\"toggleExpand(node, $event)\">\n <i class=\"fa-solid\" [class.fa-chevron-right]=\"!isExpanded(node)\" [class.fa-chevron-down]=\"isExpanded(node)\"></i>\n </button>\n } @else {\n <span class=\"tree-expand-placeholder\"></span>\n }\n <i class=\"fa-solid fa-folder tree-folder-icon\"></i>\n <span class=\"tree-node-label\">{{ node.Name }}</span>\n </div>\n @if (isExpanded(node)) {\n @for (child of getChildren(node); track child.ID) {\n <ng-container *ngTemplateOutlet=\"treeNode; context: { $implicit: child, level: level + 1 }\"></ng-container>\n }\n }\n </div>\n </ng-template>\n\n <!-- Context Menu -->\n @if (contextMenuVisible) {\n <div class=\"context-menu\"\n [style.top.px]=\"contextMenuY\"\n [style.left.px]=\"contextMenuX\"\n (document:click)=\"closeContextMenu()\">\n <button class=\"context-menu-item\" (click)=\"onContextMenuAction('rename')\">\n <i class=\"fa-solid fa-pen\"></i> Rename\n </button>\n <button class=\"context-menu-item\" (click)=\"onContextMenuAction('delete')\" disabled>\n <i class=\"fa-solid fa-trash-can\"></i> Delete\n </button>\n </div>\n }\n\n <mj-dialog\n [Visible]=\"showNew\"\n Title=\"New file category\"\n [Width]=\"450\"\n [MinWidth]=\"250\"\n (Close)=\"cancelNewCategory()\">\n <div class=\"dialog-form-container\">\n <form #newForm=\"ngForm\">\n <label class=\"mj-form-field\">\n <span class=\"mj-form-label\">Name</span>\n <input\n class=\"mj-input\"\n name=\"name\"\n [(ngModel)]=\"newCategoryName\"\n required\n [disabled]=\"isLoading\" />\n </label>\n </form>\n </div>\n <mj-dialog-actions>\n <button mjButton variant=\"primary\" (click)=\"saveNewCategory()\" [disabled]=\"isLoading\">Save</button>\n <button mjButton (click)=\"cancelNewCategory()\" [disabled]=\"isLoading\">Cancel</button>\n </mj-dialog-actions>\n </mj-dialog>\n\n @if (!!renameFileCategory) {\n <mj-dialog\n [Visible]=\"true\"\n Title=\"Rename file category\"\n [Width]=\"450\"\n [MinWidth]=\"250\"\n (Close)=\"cancelRename()\">\n <div class=\"dialog-form-container\">\n <form #renameForm=\"ngForm\">\n <label class=\"mj-form-field\">\n <span class=\"mj-form-label\">Name</span>\n <input\n class=\"mj-input\"\n name=\"Name\"\n [(ngModel)]=\"renameFileCategory.Name\"\n required\n [disabled]=\"isLoading\" />\n </label>\n </form>\n </div>\n <mj-dialog-actions>\n <button mjButton variant=\"primary\" (click)=\"saveRename()\" [disabled]=\"isLoading || !renameFileCategory.Dirty\">Save</button>\n <button mjButton (click)=\"cancelRename()\" [disabled]=\"isLoading\">Cancel</button>\n </mj-dialog-actions>\n </mj-dialog>\n }\n</div>\n"]}
|
|
@@ -61,7 +61,7 @@ let FileBrowserResource = class FileBrowserResource extends BaseResourceComponen
|
|
|
61
61
|
i0.ɵɵelementStart(0, "div", 0);
|
|
62
62
|
i0.ɵɵelement(1, "mj-file-browser");
|
|
63
63
|
i0.ɵɵelementEnd();
|
|
64
|
-
} }, dependencies: [i1.FileBrowserComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n width: 100%;\n height: 100%;\n }\n .file-browser-resource-container[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n
|
|
64
|
+
} }, dependencies: [i1.FileBrowserComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n width: 100%;\n height: 100%;\n }\n .file-browser-resource-container[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n .file-browser-resource-container[_ngcontent-%COMP%] :is(mj-file-browser[_ngcontent-%COMP%]) {\n flex: 1;\n min-height: 0;\n min-width: 0;\n display: flex;\n }"] });
|
|
65
65
|
};
|
|
66
66
|
FileBrowserResource = __decorate([
|
|
67
67
|
RegisterClass(BaseResourceComponent, 'FileBrowserResource')
|
|
@@ -119,7 +119,7 @@ export class FileBrowserComponent {
|
|
|
119
119
|
i0.ɵɵproperty("account", ctx.selectedAccount);
|
|
120
120
|
i0.ɵɵadvance(2);
|
|
121
121
|
i0.ɵɵproperty("account", ctx.selectedAccount)("folderPath", ctx.selectedFolderPath);
|
|
122
|
-
} }, dependencies: [i1.StorageProvidersListComponent, i2.FolderTreeComponent, i3.FileGridComponent], styles: ["\n\n\n\n\n
|
|
122
|
+
} }, dependencies: [i1.StorageProvidersListComponent, i2.FolderTreeComponent, i3.FileGridComponent], styles: ["\n\n\n\n\n[_nghost-%COMP%] {\n display: block;\n width: 100%;\n height: 100%;\n}\n\n.file-browser[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: var(--mj-bg-surface);\n border: none;\n border-radius: 0;\n overflow: hidden;\n box-shadow: none;\n}\n\n\n.mobile-header[_ngcontent-%COMP%] {\n display: none;\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n background-color: var(--mj-bg-surface);\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.mobile-header[_ngcontent-%COMP%] .browser-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.95rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.sidebar-toggle[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-default);\n color: var(--mj-text-secondary);\n padding: 6px 10px;\n cursor: pointer;\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.85rem;\n transition: all 0.15s ease;\n}\n\n.sidebar-toggle[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n\n.browser-container[_ngcontent-%COMP%] {\n display: flex;\n flex: 1;\n overflow: hidden;\n position: relative;\n}\n\n\n.sidebar[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 2%, var(--mj-bg-surface)));\n border-right: 1px solid var(--mj-border-default);\n width: 250px;\n min-width: 250px;\n max-width: 250px;\n overflow: hidden;\n transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s ease, opacity 0.2s ease;\n z-index: 10;\n}\n\n.sidebar.collapsed[_ngcontent-%COMP%] {\n width: 0;\n min-width: 0;\n border-right: none;\n opacity: 0;\n pointer-events: none;\n}\n\n\n.sidebar-section[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n min-height: 180px;\n max-height: 48%;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.sidebar-section[_ngcontent-%COMP%]:last-child {\n flex: 1;\n max-height: none;\n border-bottom: none;\n}\n\n.section-header[_ngcontent-%COMP%] {\n padding: 8px 14px;\n background-color: transparent;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.section-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.7rem;\n font-weight: 700;\n color: var(--mj-text-muted);\n text-transform: uppercase;\n letter-spacing: 0.06em;\n}\n\n.section-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n\n.main-panel[_ngcontent-%COMP%] {\n flex: 1;\n background-color: var(--mj-bg-surface);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-width: 0;\n}\n\n\n.section-content[_ngcontent-%COMP%]::-webkit-scrollbar {\n width: 5px;\n}\n\n.section-content[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n background: transparent;\n}\n\n.section-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n background: var(--mj-border-default);\n border-radius: 4px;\n}\n\n.section-content[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n background: var(--mj-text-muted);\n}\n\n\n\n\n\n\n@media screen and (max-width: 1024px) {\n .sidebar[_ngcontent-%COMP%] {\n width: 220px;\n min-width: 220px;\n max-width: 220px;\n }\n}\n\n\n@media screen and (max-width: 768px) {\n .mobile-header[_ngcontent-%COMP%] {\n display: flex;\n }\n\n .browser-container[_ngcontent-%COMP%] {\n flex-direction: column;\n }\n\n .sidebar[_ngcontent-%COMP%] {\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n width: 270px;\n min-width: 270px;\n max-width: 270px;\n z-index: 1000;\n box-shadow: var(--mj-shadow-lg, 0 10px 25px rgba(0, 0, 0, 0.2));\n background-color: var(--mj-bg-surface);\n }\n\n .sidebar.collapsed[_ngcontent-%COMP%] {\n transform: translateX(-100%);\n }\n\n .main-panel[_ngcontent-%COMP%] {\n flex: 1;\n }\n}"] });
|
|
123
123
|
}
|
|
124
124
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileBrowserComponent, [{
|
|
125
125
|
type: Component,
|
|
@@ -167,7 +167,7 @@ function FileGridComponent_Conditional_2_Conditional_8_Template(rf, ctx) { if (r
|
|
|
167
167
|
function FileGridComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
168
168
|
const _r8 = i0.ɵɵgetCurrentView();
|
|
169
169
|
i0.ɵɵelementStart(0, "div", 2)(1, "div", 46)(2, "label", 47);
|
|
170
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_2_Template_label_click_2_listener($event) {
|
|
170
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_2_Template_label_click_2_listener($event) { return $event.stopPropagation(); });
|
|
171
171
|
i0.ɵɵelementStart(3, "input", 48);
|
|
172
172
|
i0.ɵɵlistener("change", function FileGridComponent_Conditional_2_Template_input_change_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.areAllSelected() ? ctx_r1.deselectAll() : ctx_r1.selectAll()); });
|
|
173
173
|
i0.ɵɵelementEnd();
|
|
@@ -424,12 +424,12 @@ function FileGridComponent_Conditional_6_For_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
424
424
|
i0.ɵɵelementStart(0, "div", 108);
|
|
425
425
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_2_Template_div_click_0_listener($event) { const item_r19 = i0.ɵɵrestoreView(_r18).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTileClick(item_r19, $event)); })("dblclick", function FileGridComponent_Conditional_6_For_2_Template_div_dblclick_0_listener() { const item_r19 = i0.ɵɵrestoreView(_r18).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onItemDoubleClick(item_r19)); });
|
|
426
426
|
i0.ɵɵelementStart(1, "div", 109)(2, "label", 110);
|
|
427
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_2_Template_label_click_2_listener($event) {
|
|
427
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_2_Template_label_click_2_listener($event) { return $event.stopPropagation(); });
|
|
428
428
|
i0.ɵɵelementStart(3, "input", 48);
|
|
429
429
|
i0.ɵɵlistener("change", function FileGridComponent_Conditional_6_For_2_Template_input_change_3_listener($event) { const item_r19 = i0.ɵɵrestoreView(_r18).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleItemSelection(item_r19, $event)); });
|
|
430
430
|
i0.ɵɵelementEnd()();
|
|
431
431
|
i0.ɵɵelementStart(4, "div", 111);
|
|
432
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_2_Template_div_click_4_listener($event) {
|
|
432
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_6_For_2_Template_div_click_4_listener($event) { return $event.stopPropagation(); });
|
|
433
433
|
i0.ɵɵconditionalCreate(5, FileGridComponent_Conditional_6_For_2_Conditional_5_Template, 4, 0);
|
|
434
434
|
i0.ɵɵelementEnd()();
|
|
435
435
|
i0.ɵɵelementStart(6, "div", 112);
|
|
@@ -489,7 +489,7 @@ function FileGridComponent_Conditional_7_For_24_Template(rf, ctx) { if (rf & 1)
|
|
|
489
489
|
i0.ɵɵelementStart(0, "tr", 129);
|
|
490
490
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_For_24_Template_tr_click_0_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTileClick(item_r23, $event)); })("dblclick", function FileGridComponent_Conditional_7_For_24_Template_tr_dblclick_0_listener() { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onItemDoubleClick(item_r23)); });
|
|
491
491
|
i0.ɵɵelementStart(1, "td", 130);
|
|
492
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_For_24_Template_td_click_1_listener($event) {
|
|
492
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_For_24_Template_td_click_1_listener($event) { return $event.stopPropagation(); });
|
|
493
493
|
i0.ɵɵelementStart(2, "input", 48);
|
|
494
494
|
i0.ɵɵlistener("change", function FileGridComponent_Conditional_7_For_24_Template_input_change_2_listener($event) { const item_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleItemSelection(item_r23, $event)); });
|
|
495
495
|
i0.ɵɵelementEnd()();
|
|
@@ -509,7 +509,7 @@ function FileGridComponent_Conditional_7_For_24_Template(rf, ctx) { if (rf & 1)
|
|
|
509
509
|
i0.ɵɵtext(17);
|
|
510
510
|
i0.ɵɵelementEnd()();
|
|
511
511
|
i0.ɵɵelementStart(18, "td", 142);
|
|
512
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_For_24_Template_td_click_18_listener($event) {
|
|
512
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_7_For_24_Template_td_click_18_listener($event) { return $event.stopPropagation(); });
|
|
513
513
|
i0.ɵɵelementStart(19, "div", 143);
|
|
514
514
|
i0.ɵɵconditionalCreate(20, FileGridComponent_Conditional_7_For_24_Conditional_20_Template, 4, 0);
|
|
515
515
|
i0.ɵɵelementEnd()()();
|
|
@@ -743,7 +743,7 @@ function FileGridComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
|
|
|
743
743
|
i0.ɵɵelementStart(0, "div", 159);
|
|
744
744
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closePreview()); });
|
|
745
745
|
i0.ɵɵelementStart(1, "div", 160);
|
|
746
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_div_click_1_listener($event) {
|
|
746
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_12_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
747
747
|
i0.ɵɵelementStart(2, "div", 161)(3, "div", 162)(4, "div", 133);
|
|
748
748
|
i0.ɵɵelement(5, "i");
|
|
749
749
|
i0.ɵɵelementEnd();
|
|
@@ -787,7 +787,7 @@ function FileGridComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
|
|
|
787
787
|
i0.ɵɵelementStart(0, "div", 184);
|
|
788
788
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r29); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelNewFolder()); });
|
|
789
789
|
i0.ɵɵelementStart(1, "div", 185);
|
|
790
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_div_click_1_listener($event) {
|
|
790
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_13_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
791
791
|
i0.ɵɵelementStart(2, "div", 186)(3, "h3", 163);
|
|
792
792
|
i0.ɵɵtext(4, "Create New Folder");
|
|
793
793
|
i0.ɵɵelementEnd();
|
|
@@ -841,7 +841,7 @@ function FileGridComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
|
|
|
841
841
|
i0.ɵɵelementStart(0, "div", 184);
|
|
842
842
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r30); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelDelete()); });
|
|
843
843
|
i0.ɵɵelementStart(1, "div", 185);
|
|
844
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_div_click_1_listener($event) {
|
|
844
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_14_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
845
845
|
i0.ɵɵelementStart(2, "div", 186)(3, "h3", 163);
|
|
846
846
|
i0.ɵɵtext(4);
|
|
847
847
|
i0.ɵɵelementEnd();
|
|
@@ -893,7 +893,7 @@ function FileGridComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
|
|
|
893
893
|
i0.ɵɵelementStart(0, "div", 184);
|
|
894
894
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r31); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelRename()); });
|
|
895
895
|
i0.ɵɵelementStart(1, "div", 185);
|
|
896
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_div_click_1_listener($event) {
|
|
896
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_15_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
897
897
|
i0.ɵɵelementStart(2, "div", 186)(3, "h3", 163);
|
|
898
898
|
i0.ɵɵtext(4);
|
|
899
899
|
i0.ɵɵelementEnd();
|
|
@@ -942,7 +942,7 @@ function FileGridComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
|
|
|
942
942
|
i0.ɵɵelementStart(0, "div", 159);
|
|
943
943
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopy()); });
|
|
944
944
|
i0.ɵɵelementStart(1, "div", 199);
|
|
945
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_div_click_1_listener($event) {
|
|
945
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_16_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
946
946
|
i0.ɵɵelementStart(2, "div", 161)(3, "h3", 163);
|
|
947
947
|
i0.ɵɵtext(4);
|
|
948
948
|
i0.ɵɵelementEnd();
|
|
@@ -998,7 +998,7 @@ function FileGridComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
|
|
|
998
998
|
i0.ɵɵelementStart(0, "div", 159);
|
|
999
999
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_17_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelMove()); });
|
|
1000
1000
|
i0.ɵɵelementStart(1, "div", 199);
|
|
1001
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_17_Template_div_click_1_listener($event) {
|
|
1001
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_17_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
1002
1002
|
i0.ɵɵelementStart(2, "div", 161)(3, "h3", 163);
|
|
1003
1003
|
i0.ɵɵtext(4);
|
|
1004
1004
|
i0.ɵɵelementEnd();
|
|
@@ -1087,7 +1087,7 @@ function FileGridComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
|
|
|
1087
1087
|
i0.ɵɵelementStart(0, "div", 159);
|
|
1088
1088
|
i0.ɵɵlistener("click", function FileGridComponent_Conditional_18_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCancelCopyToAccount()); });
|
|
1089
1089
|
i0.ɵɵelementStart(1, "div", 205);
|
|
1090
|
-
i0.ɵɵlistener("click", function FileGridComponent_Conditional_18_Template_div_click_1_listener($event) {
|
|
1090
|
+
i0.ɵɵlistener("click", function FileGridComponent_Conditional_18_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
|
|
1091
1091
|
i0.ɵɵelementStart(2, "div", 161)(3, "h3", 163);
|
|
1092
1092
|
i0.ɵɵtext(4, "Copy to Another Account");
|
|
1093
1093
|
i0.ɵɵelementEnd();
|
|
@@ -2741,7 +2741,7 @@ export class FileGridComponent {
|
|
|
2741
2741
|
i0.ɵɵconditional(ctx.showMoveDialog && ctx.itemToMove ? 17 : -1);
|
|
2742
2742
|
i0.ɵɵadvance();
|
|
2743
2743
|
i0.ɵɵconditional(ctx.showCopyToProviderDialog && ctx.itemToCopyToProvider ? 18 : -1);
|
|
2744
|
-
} }, dependencies: [i1.NgIf, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.LoadingComponent, i4.MJEmptyStateComponent], styles: ["\n\n\n\n\n\n[_nghost-%COMP%] {\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n.file-grid-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n position: relative;\n overflow: hidden;\n}\n\n\n\n\n\n\n.command-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n padding: 10px 16px;\n background-color: var(--mj-bg-surface);\n border-bottom: 1px solid var(--mj-border-default);\n flex-shrink: 0;\n flex-wrap: wrap;\n}\n\n.command-bar-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n min-width: 0;\n flex: 1;\n}\n\n.nav-btn-group[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n flex-shrink: 0;\n}\n\n.mj-tool-btn[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n min-width: 32px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n\n.mj-tool-btn[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.mj-tool-btn[disabled][_ngcontent-%COMP%] {\n opacity: 0.4;\n cursor: not-allowed;\n background-color: transparent;\n}\n\n\n\n.breadcrumb-trail[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n min-width: 0;\n padding: 2px 4px;\n}\n\n.breadcrumb-trail[_ngcontent-%COMP%]::-webkit-scrollbar {\n display: none;\n}\n\n.trail-root-icon[_ngcontent-%COMP%] {\n color: var(--mj-status-warning, #f59e0b);\n font-size: 0.95rem;\n margin-right: 2px;\n flex-shrink: 0;\n}\n\n.crumb-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 0.82rem;\n font-weight: 500;\n padding: 4px 8px;\n border-radius: var(--mj-radius-sm, 6px);\n cursor: pointer;\n white-space: nowrap;\n transition: all 0.12s ease;\n}\n\n.crumb-btn[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.crumb-btn.current[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-weight: 600;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.crumb-separator[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 0.75rem;\n}\n\n\n\n.command-bar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n\n\n.search-pill[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 4%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-full, 9999px);\n padding: 2px 10px;\n gap: 6px;\n transition: border-color 0.15s ease;\n}\n\n.search-pill[_ngcontent-%COMP%]:focus-within {\n border-color: var(--mj-brand-primary);\n}\n\n.search-icon[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n color: var(--mj-text-muted);\n}\n\n.search-input[_ngcontent-%COMP%] {\n border: none;\n background: transparent;\n outline: none;\n font-size: 0.82rem;\n color: var(--mj-text-primary);\n width: 150px;\n padding: 4px 0;\n}\n\n.search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-muted);\n}\n\n.search-clear-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n padding: 0 4px;\n font-size: 0.75rem;\n}\n\n.search-clear-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.type-filter-select[_ngcontent-%COMP%] {\n border: none;\n background: transparent;\n font-size: 0.76rem;\n color: var(--mj-text-secondary);\n outline: none;\n cursor: pointer;\n padding: 2px 4px;\n border-left: 1px solid var(--mj-border-default);\n}\n\n\n\n.mj-btn-search-toggle[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n color: var(--mj-text-secondary);\n font-size: 0.8rem;\n font-weight: 500;\n padding: 6px 12px;\n border-radius: var(--mj-radius-full, 9999px);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n\n.mj-btn-search-toggle[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-btn-search-toggle.active[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-brand-primary);\n}\n\n\n\n.view-mode-toggle[_ngcontent-%COMP%] {\n display: flex;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 4%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 2px;\n gap: 2px;\n}\n\n.view-mode-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n padding: 5px 8px;\n font-size: 0.8rem;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.view-mode-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.view-mode-btn.active[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n color: var(--mj-brand-primary);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);\n}\n\n\n\n.mj-action-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n font-size: 0.82rem;\n font-weight: 500;\n border-radius: var(--mj-radius-sm, 6px);\n cursor: pointer;\n transition: all 0.15s ease;\n border: 1px solid transparent;\n white-space: nowrap;\n}\n\n.mj-action-btn--primary[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary, #3b82f6);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-brand-primary, #3b82f6);\n}\n\n.mj-action-btn--primary[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 85%, var(--mj-text-primary, #000000));\n}\n\n.mj-action-btn--secondary[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border-color: var(--mj-border-default);\n color: var(--mj-text-primary);\n}\n\n.mj-action-btn--secondary[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n}\n\n.mj-action-btn--danger[_ngcontent-%COMP%] {\n background-color: var(--mj-status-error, #ef4444);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-status-error, #ef4444);\n}\n\n.mj-action-btn--danger[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-status-error, #ef4444) 85%, var(--mj-text-primary, #000000));\n}\n\n.mj-action-btn[disabled][_ngcontent-%COMP%] {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n\n\n\n\n\n.selection-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 16px;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n gap: 12px;\n flex-shrink: 0;\n animation: _ngcontent-%COMP%_slideDown 0.18s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from { transform: translateY(-100%); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n\n.selection-bar-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.selection-checkbox-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n user-select: none;\n}\n\n.selection-count[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n font-weight: 600;\n color: var(--mj-brand-primary);\n}\n\n.selection-bar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.sel-action-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n padding: 4px 10px;\n font-size: 0.76rem;\n font-weight: 500;\n border-radius: var(--mj-radius-sm, 6px);\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n color: var(--mj-text-primary);\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.sel-action-btn[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n border-color: var(--mj-brand-primary);\n color: var(--mj-brand-primary);\n}\n\n.sel-action-btn--danger[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n border-color: var(--mj-status-error);\n color: var(--mj-status-error);\n}\n\n.sel-action-btn--ghost[_ngcontent-%COMP%] {\n background: transparent;\n border-color: transparent;\n}\n\n\n\n\n\n\n.multi-search-card[_ngcontent-%COMP%] {\n margin: 12px 16px;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 10px);\n box-shadow: var(--mj-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));\n overflow: hidden;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from { opacity: 0; transform: translateY(-6px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n.multi-search-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: var(--mj-bg-surface-sunken);\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.multi-search-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-brand-primary);\n}\n\n.multi-search-title[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.88rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.multi-search-body[_ngcontent-%COMP%] {\n padding: 14px 16px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.multi-search-bar[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.multi-search-text[_ngcontent-%COMP%] {\n flex: 1;\n padding: 8px 12px;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n font-size: 0.85rem;\n outline: none;\n}\n\n.multi-search-text[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.multi-search-accounts[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n\n.account-select-label[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n text-transform: uppercase;\n}\n\n.account-pill-list[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n}\n\n.account-select-pill[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n border-radius: var(--mj-radius-full, 9999px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n font-size: 0.76rem;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.account-select-pill.checked[_ngcontent-%COMP%] {\n border-color: var(--mj-brand-primary);\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.account-select-pill.disabled[_ngcontent-%COMP%] {\n opacity: 0.4;\n cursor: not-allowed;\n}\n\n.pill-account-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.pill-provider-tag[_ngcontent-%COMP%] {\n font-size: 0.68rem;\n color: var(--mj-text-muted);\n}\n\n.pill-no-search[_ngcontent-%COMP%] {\n font-size: 0.68rem;\n color: var(--mj-status-warning);\n}\n\n\n\n.multi-search-results[_ngcontent-%COMP%] {\n border-top: 1px solid var(--mj-border-default);\n padding: 12px 16px;\n max-height: 400px;\n overflow-y: auto;\n}\n\n.results-meta-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 12px;\n font-size: 0.8rem;\n}\n\n.meta-count[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n}\n\n.meta-stats[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n}\n\n.clear-results-btn[_ngcontent-%COMP%] {\n margin-left: auto;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 0.76rem;\n cursor: pointer;\n}\n\n.clear-results-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.results-groups[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.result-group[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n overflow: hidden;\n}\n\n.result-group-head[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background-color: var(--mj-bg-surface-sunken);\n font-size: 0.8rem;\n}\n\n.group-account-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.group-count-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n background-color: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n font-size: 0.7rem;\n font-weight: 600;\n padding: 1px 6px;\n border-radius: 9999px;\n}\n\n.group-error-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n color: var(--mj-status-error);\n font-size: 0.72rem;\n}\n\n.result-items-grid[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n}\n\n.search-item-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 8px 12px;\n border-bottom: 1px solid var(--mj-border-default);\n font-size: 0.8rem;\n}\n\n.search-item-row[_ngcontent-%COMP%]:last-child {\n border-bottom: none;\n}\n\n.search-item-icon[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.search-item-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-width: 0;\n}\n\n.search-item-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.search-item-path[_ngcontent-%COMP%] {\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n.search-item-size[_ngcontent-%COMP%], .search-item-date[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-secondary);\n}\n\n.group-empty-text[_ngcontent-%COMP%] {\n padding: 12px;\n font-size: 0.78rem;\n color: var(--mj-text-muted);\n text-align: center;\n}\n\n\n\n\n\n\n.file-cards-grid[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 16px;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));\n gap: 14px;\n align-content: start;\n}\n\n.file-card[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 10px);\n padding: 10px;\n cursor: pointer;\n transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n position: relative;\n user-select: none;\n}\n\n.file-card[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n box-shadow: var(--mj-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));\n transform: translateY(-2px);\n}\n\n.file-card.selected[_ngcontent-%COMP%] {\n border-color: var(--mj-brand-primary);\n background-color: color-mix(in srgb, var(--mj-brand-primary) 6%, var(--mj-bg-surface));\n box-shadow: 0 0 0 1px var(--mj-brand-primary);\n}\n\n.file-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 22px;\n margin-bottom: 6px;\n}\n\n.file-card-checkbox[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.file-card-quick-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n opacity: 0;\n transition: opacity 0.15s ease;\n}\n\n.file-card[_ngcontent-%COMP%]:hover .file-card-quick-actions[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.quick-action-btn[_ngcontent-%COMP%] {\n width: 22px;\n height: 22px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n color: var(--mj-text-secondary);\n font-size: 0.68rem;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.quick-action-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary);\n border-color: var(--mj-brand-primary);\n}\n\n\n\n.file-card-icon-container[_ngcontent-%COMP%] {\n height: 74px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-md, 8px);\n margin-bottom: 8px;\n font-size: 2rem;\n transition: transform 0.15s ease;\n}\n\n.file-card[_ngcontent-%COMP%]:hover .file-card-icon-container[_ngcontent-%COMP%] {\n transform: scale(1.04);\n}\n\n\n\n.file-card-body[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.file-card-name[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.25;\n min-height: 2em;\n}\n\n.file-card-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n\n\n\n\n\n.file-table-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 8px 16px;\n}\n\n.file-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.82rem;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n text-align: left;\n padding: 8px 10px;\n border-bottom: 1px solid var(--mj-border-default);\n color: var(--mj-text-muted);\n font-size: 0.72rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n user-select: none;\n cursor: pointer;\n}\n\n.file-table[_ngcontent-%COMP%] th.th-check[_ngcontent-%COMP%] {\n width: 32px;\n cursor: default;\n}\n\n.file-table[_ngcontent-%COMP%] th.th-actions[_ngcontent-%COMP%] {\n width: 70px;\n text-align: right;\n cursor: default;\n}\n\n.sort-arrow[_ngcontent-%COMP%] {\n margin-left: 4px;\n font-size: 0.65rem;\n}\n\n.file-table-row[_ngcontent-%COMP%] {\n border-bottom: 1px solid var(--mj-border-default);\n cursor: pointer;\n transition: background-color 0.12s ease;\n}\n\n.file-table-row[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n}\n\n.file-table-row.selected[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.file-table-row[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 8px 10px;\n vertical-align: middle;\n}\n\n.row-name-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n\n.row-icon-badge[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n min-width: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.9rem;\n}\n\n.row-file-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 2px 6px;\n border-radius: 4px;\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-secondary);\n font-size: 0.7rem;\n}\n\n.size-text[_ngcontent-%COMP%], .date-text[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n font-size: 0.76rem;\n white-space: nowrap;\n}\n\n.row-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 4px;\n opacity: 0;\n transition: opacity 0.12s ease;\n}\n\n.file-table-row[_ngcontent-%COMP%]:hover .row-action-buttons[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.row-act-btn[_ngcontent-%COMP%] {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n color: var(--mj-text-secondary);\n font-size: 0.7rem;\n cursor: pointer;\n}\n\n.row-act-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary);\n border-color: var(--mj-brand-primary);\n}\n\n\n\n\n\n\n.mj-file-thumb--folder[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, transparent);\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-thumb--pdf[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-error, #ef4444) 14%, transparent);\n color: var(--mj-status-error, #ef4444);\n}\n\n.mj-file-thumb--image[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-media-image, #8b5cf6) 14%, transparent);\n color: var(--mj-media-image, #8b5cf6);\n}\n\n.mj-file-thumb--video[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary, #3b82f6) 14%, transparent);\n color: var(--mj-brand-primary, #3b82f6);\n}\n\n.mj-file-thumb--audio[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, transparent);\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-thumb--code[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-success, #10b981) 14%, transparent);\n color: var(--mj-status-success, #10b981);\n}\n\n.mj-file-thumb--text[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-text-muted, #6b7280) 14%, transparent);\n color: var(--mj-text-muted, #6b7280);\n}\n\n.mj-file-thumb--document[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary-hover, #2563eb) 14%, transparent);\n color: var(--mj-brand-primary-hover, #2563eb);\n}\n\n\n\n\n\n\n.status-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 16px;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n border-top: 1px solid var(--mj-border-default);\n font-size: 0.72rem;\n color: var(--mj-text-secondary);\n flex-shrink: 0;\n}\n\n.status-account-badge[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-brand-primary);\n font-weight: 500;\n}\n\n\n\n\n\n\n.drag-drop-overlay[_ngcontent-%COMP%] {\n position: absolute;\n inset: 0;\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, rgba(255, 255, 255, 0.9));\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 100;\n pointer-events: none;\n}\n\n.drag-drop-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 32px 48px;\n background-color: var(--mj-bg-surface);\n border: 2px dashed var(--mj-brand-primary);\n border-radius: var(--mj-radius-lg, 12px);\n box-shadow: var(--mj-shadow-lg, 0 10px 25px rgba(0, 0, 0, 0.15));\n}\n\n.drag-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-brand-primary);\n margin-bottom: 12px;\n}\n\n.drag-drop-content[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 6px 0;\n font-size: 1.1rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.drag-drop-content[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.8rem;\n color: var(--mj-text-secondary);\n}\n\n.upload-progress-bar-wrap[_ngcontent-%COMP%] {\n position: absolute;\n bottom: 36px;\n right: 20px;\n z-index: 90;\n}\n\n.upload-progress-card[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md, 8px);\n padding: 10px 14px;\n box-shadow: var(--mj-shadow-lg, 0 8px 20px rgba(0, 0, 0, 0.15));\n width: 260px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.upload-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.upload-spinner[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.upload-text[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.progress-track[_ngcontent-%COMP%] {\n height: 4px;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 9999px;\n overflow: hidden;\n}\n\n.progress-fill[_ngcontent-%COMP%] {\n height: 100%;\n background-color: var(--mj-brand-primary);\n transition: width 0.15s ease;\n}\n\n.grid-loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1;\n}\n\n\n\n\n\n\n.mj-modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1050;\n padding: 20px;\n animation: _ngcontent-%COMP%_modalFadeIn 0.18s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_modalFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n.mj-modal-window[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 12px);\n box-shadow: var(--mj-shadow-xl, 0 20px 35px rgba(0, 0, 0, 0.25));\n width: 100%;\n max-width: 500px;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n}\n\n.mj-modal-window.modal-compact[_ngcontent-%COMP%] {\n max-width: 420px;\n}\n\n.mj-modal-window.preview-modal-window[_ngcontent-%COMP%] {\n max-width: 850px;\n max-height: 85vh;\n height: 80vh;\n}\n\n.mj-modal-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 18px;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n}\n\n.modal-title-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.modal-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.95rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.modal-subtitle[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n color: var(--mj-text-muted);\n}\n\n.modal-header-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-close-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 1rem;\n cursor: pointer;\n padding: 4px;\n border-radius: 4px;\n}\n\n.modal-close-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.mj-modal-body[_ngcontent-%COMP%] {\n padding: 18px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.form-label[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n}\n\n.form-input[_ngcontent-%COMP%] {\n padding: 8px 12px;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n font-size: 0.85rem;\n outline: none;\n}\n\n.form-input[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.modal-body-text[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: var(--mj-text-primary);\n}\n\n.modal-warning-banner[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background-color: color-mix(in srgb, var(--mj-status-warning) 12%, var(--mj-bg-surface));\n border: 1px solid var(--mj-status-warning);\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.76rem;\n color: var(--mj-text-primary);\n}\n\n.mj-modal-footer[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 18px;\n border-top: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n}\n\n\n\n.preview-modal-body[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--mj-bg-surface-sunken);\n padding: 16px;\n overflow: hidden;\n}\n\n.preview-media-wrap[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.preview-img[_ngcontent-%COMP%] {\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.preview-iframe[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n border: none;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.preview-video[_ngcontent-%COMP%] {\n max-width: 100%;\n max-height: 100%;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.audio-preview-wrap[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n}\n\n.preview-audio-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-brand-primary);\n}\n\n.preview-audio[_ngcontent-%COMP%] {\n width: 320px;\n}\n\n.preview-fallback[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n text-align: center;\n color: var(--mj-text-secondary);\n}\n\n.preview-fallback-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-text-muted);\n margin-bottom: 8px;\n}\n\n.preview-fallback[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.95rem;\n color: var(--mj-text-primary);\n}\n\n.preview-fallback[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.8rem;\n}\n\n.account-picker-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-height: 180px;\n overflow-y: auto;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 6px;\n}\n\n.account-picker-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 8px;\n border-radius: 4px;\n cursor: pointer;\n}\n\n.account-picker-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.picker-name[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.picker-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n.copy-progress-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 0.78rem;\n color: var(--mj-brand-primary);\n margin-top: 8px;\n}"] });
|
|
2744
|
+
} }, dependencies: [i1.NgIf, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.LoadingComponent, i4.MJEmptyStateComponent], styles: ["\n\n\n\n\n[_nghost-%COMP%] {\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n.file-grid-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n position: relative;\n overflow: hidden;\n}\n\n\n\n\n\n.command-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n padding: 10px 16px;\n background-color: var(--mj-bg-surface);\n border-bottom: 1px solid var(--mj-border-default);\n flex-shrink: 0;\n flex-wrap: wrap;\n}\n\n.command-bar-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n min-width: 0;\n flex: 1;\n}\n\n.nav-btn-group[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n flex-shrink: 0;\n}\n\n.mj-tool-btn[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n min-width: 32px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-secondary);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n\n.mj-tool-btn[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.mj-tool-btn[disabled][_ngcontent-%COMP%] {\n opacity: 0.4;\n cursor: not-allowed;\n background-color: transparent;\n}\n\n\n.breadcrumb-trail[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n min-width: 0;\n padding: 2px 4px;\n}\n\n.breadcrumb-trail[_ngcontent-%COMP%]::-webkit-scrollbar {\n display: none;\n}\n\n.trail-root-icon[_ngcontent-%COMP%] {\n color: var(--mj-status-warning, #f59e0b);\n font-size: 0.95rem;\n margin-right: 2px;\n flex-shrink: 0;\n}\n\n.crumb-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 0.82rem;\n font-weight: 500;\n padding: 4px 8px;\n border-radius: var(--mj-radius-sm, 6px);\n cursor: pointer;\n white-space: nowrap;\n transition: all 0.12s ease;\n}\n\n.crumb-btn[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.crumb-btn.current[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-weight: 600;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.crumb-separator[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 0.75rem;\n}\n\n\n.command-bar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n\n.search-pill[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 4%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-full, 9999px);\n padding: 2px 10px;\n gap: 6px;\n transition: border-color 0.15s ease;\n}\n\n.search-pill[_ngcontent-%COMP%]:focus-within {\n border-color: var(--mj-brand-primary);\n}\n\n.search-icon[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n color: var(--mj-text-muted);\n}\n\n.search-input[_ngcontent-%COMP%] {\n border: none;\n background: transparent;\n outline: none;\n font-size: 0.82rem;\n color: var(--mj-text-primary);\n width: 150px;\n padding: 4px 0;\n}\n\n.search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-muted);\n}\n\n.search-clear-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n padding: 0 4px;\n font-size: 0.75rem;\n}\n\n.search-clear-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.type-filter-select[_ngcontent-%COMP%] {\n border: none;\n background: transparent;\n font-size: 0.76rem;\n color: var(--mj-text-secondary);\n outline: none;\n cursor: pointer;\n padding: 2px 4px;\n border-left: 1px solid var(--mj-border-default);\n}\n\n\n.mj-btn-search-toggle[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n color: var(--mj-text-secondary);\n font-size: 0.8rem;\n font-weight: 500;\n padding: 6px 12px;\n border-radius: var(--mj-radius-full, 9999px);\n cursor: pointer;\n transition: all 0.15s ease;\n}\n\n.mj-btn-search-toggle[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n color: var(--mj-text-primary);\n}\n\n.mj-btn-search-toggle.active[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-brand-primary);\n}\n\n\n.view-mode-toggle[_ngcontent-%COMP%] {\n display: flex;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 4%, var(--mj-bg-surface)));\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 2px;\n gap: 2px;\n}\n\n.view-mode-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n padding: 5px 8px;\n font-size: 0.8rem;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.view-mode-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.view-mode-btn.active[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n color: var(--mj-brand-primary);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);\n}\n\n\n.mj-action-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 12px;\n font-size: 0.82rem;\n font-weight: 500;\n border-radius: var(--mj-radius-sm, 6px);\n cursor: pointer;\n transition: all 0.15s ease;\n border: 1px solid transparent;\n white-space: nowrap;\n}\n\n.mj-action-btn--primary[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary, #3b82f6);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-brand-primary, #3b82f6);\n}\n\n.mj-action-btn--primary[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 85%, var(--mj-text-primary, #000000));\n}\n\n.mj-action-btn--secondary[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border-color: var(--mj-border-default);\n color: var(--mj-text-primary);\n}\n\n.mj-action-btn--secondary[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n}\n\n.mj-action-btn--danger[_ngcontent-%COMP%] {\n background-color: var(--mj-status-error, #ef4444);\n color: var(--mj-text-inverse, #ffffff);\n border-color: var(--mj-status-error, #ef4444);\n}\n\n.mj-action-btn--danger[_ngcontent-%COMP%]:hover:not([disabled]) {\n background-color: color-mix(in srgb, var(--mj-status-error, #ef4444) 85%, var(--mj-text-primary, #000000));\n}\n\n.mj-action-btn[disabled][_ngcontent-%COMP%] {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n\n\n\n\n.selection-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 16px;\n background-color: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n border-bottom: 1px solid color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n gap: 12px;\n flex-shrink: 0;\n animation: _ngcontent-%COMP%_slideDown 0.18s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from { transform: translateY(-100%); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n\n.selection-bar-left[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.selection-checkbox-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n user-select: none;\n}\n\n.selection-count[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n font-weight: 600;\n color: var(--mj-brand-primary);\n}\n\n.selection-bar-right[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n flex-wrap: wrap;\n}\n\n.sel-action-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n padding: 4px 10px;\n font-size: 0.76rem;\n font-weight: 500;\n border-radius: var(--mj-radius-sm, 6px);\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n color: var(--mj-text-primary);\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.sel-action-btn[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-text-primary) 6%, var(--mj-bg-surface));\n border-color: var(--mj-brand-primary);\n color: var(--mj-brand-primary);\n}\n\n.sel-action-btn--danger[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n border-color: var(--mj-status-error);\n color: var(--mj-status-error);\n}\n\n.sel-action-btn--ghost[_ngcontent-%COMP%] {\n background: transparent;\n border-color: transparent;\n}\n\n\n\n\n\n.multi-search-card[_ngcontent-%COMP%] {\n margin: 12px 16px;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 10px);\n box-shadow: var(--mj-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));\n overflow: hidden;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from { opacity: 0; transform: translateY(-6px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n.multi-search-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 10px 16px;\n background-color: var(--mj-bg-surface-sunken);\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.multi-search-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n color: var(--mj-brand-primary);\n}\n\n.multi-search-title[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.88rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.multi-search-body[_ngcontent-%COMP%] {\n padding: 14px 16px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.multi-search-bar[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.multi-search-text[_ngcontent-%COMP%] {\n flex: 1;\n padding: 8px 12px;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n font-size: 0.85rem;\n outline: none;\n}\n\n.multi-search-text[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.multi-search-accounts[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n\n.account-select-label[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n text-transform: uppercase;\n}\n\n.account-pill-list[_ngcontent-%COMP%] {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n}\n\n.account-select-pill[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 4px 10px;\n border-radius: var(--mj-radius-full, 9999px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n font-size: 0.76rem;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.account-select-pill.checked[_ngcontent-%COMP%] {\n border-color: var(--mj-brand-primary);\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.account-select-pill.disabled[_ngcontent-%COMP%] {\n opacity: 0.4;\n cursor: not-allowed;\n}\n\n.pill-account-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.pill-provider-tag[_ngcontent-%COMP%] {\n font-size: 0.68rem;\n color: var(--mj-text-muted);\n}\n\n.pill-no-search[_ngcontent-%COMP%] {\n font-size: 0.68rem;\n color: var(--mj-status-warning);\n}\n\n\n.multi-search-results[_ngcontent-%COMP%] {\n border-top: 1px solid var(--mj-border-default);\n padding: 12px 16px;\n max-height: 400px;\n overflow-y: auto;\n}\n\n.results-meta-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 12px;\n font-size: 0.8rem;\n}\n\n.meta-count[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n}\n\n.meta-stats[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n}\n\n.clear-results-btn[_ngcontent-%COMP%] {\n margin-left: auto;\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 0.76rem;\n cursor: pointer;\n}\n\n.clear-results-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n}\n\n.results-groups[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.result-group[_ngcontent-%COMP%] {\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n overflow: hidden;\n}\n\n.result-group-head[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background-color: var(--mj-bg-surface-sunken);\n font-size: 0.8rem;\n}\n\n.group-account-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.group-count-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n background-color: var(--mj-brand-primary);\n color: var(--mj-text-inverse, #ffffff);\n font-size: 0.7rem;\n font-weight: 600;\n padding: 1px 6px;\n border-radius: 9999px;\n}\n\n.group-error-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n color: var(--mj-status-error);\n font-size: 0.72rem;\n}\n\n.result-items-grid[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n}\n\n.search-item-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 8px 12px;\n border-bottom: 1px solid var(--mj-border-default);\n font-size: 0.8rem;\n}\n\n.search-item-row[_ngcontent-%COMP%]:last-child {\n border-bottom: none;\n}\n\n.search-item-icon[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.search-item-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n flex: 1;\n min-width: 0;\n}\n\n.search-item-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.search-item-path[_ngcontent-%COMP%] {\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n.search-item-size[_ngcontent-%COMP%], .search-item-date[_ngcontent-%COMP%] {\n font-size: 0.74rem;\n color: var(--mj-text-secondary);\n}\n\n.group-empty-text[_ngcontent-%COMP%] {\n padding: 12px;\n font-size: 0.78rem;\n color: var(--mj-text-muted);\n text-align: center;\n}\n\n\n\n\n\n.file-cards-grid[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 16px;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));\n gap: 14px;\n align-content: start;\n}\n\n.file-card[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 10px);\n padding: 10px;\n cursor: pointer;\n transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);\n position: relative;\n user-select: none;\n}\n\n.file-card[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n box-shadow: var(--mj-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));\n transform: translateY(-2px);\n}\n\n.file-card.selected[_ngcontent-%COMP%] {\n border-color: var(--mj-brand-primary);\n background-color: color-mix(in srgb, var(--mj-brand-primary) 6%, var(--mj-bg-surface));\n box-shadow: 0 0 0 1px var(--mj-brand-primary);\n}\n\n.file-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n height: 22px;\n margin-bottom: 6px;\n}\n\n.file-card-checkbox[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.file-card-quick-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 4px;\n opacity: 0;\n transition: opacity 0.15s ease;\n}\n\n.file-card[_ngcontent-%COMP%]:hover .file-card-quick-actions[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.quick-action-btn[_ngcontent-%COMP%] {\n width: 22px;\n height: 22px;\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n color: var(--mj-text-secondary);\n font-size: 0.68rem;\n cursor: pointer;\n transition: all 0.12s ease;\n}\n\n.quick-action-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary);\n border-color: var(--mj-brand-primary);\n}\n\n\n.file-card-icon-container[_ngcontent-%COMP%] {\n height: 74px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-md, 8px);\n margin-bottom: 8px;\n font-size: 2rem;\n transition: transform 0.15s ease;\n}\n\n.file-card[_ngcontent-%COMP%]:hover .file-card-icon-container[_ngcontent-%COMP%] {\n transform: scale(1.04);\n}\n\n\n.file-card-body[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.file-card-name[_ngcontent-%COMP%] {\n font-size: 0.8rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.25;\n min-height: 2em;\n}\n\n.file-card-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n\n\n\n\n.file-table-container[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n padding: 8px 16px;\n}\n\n.file-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.82rem;\n}\n\n.file-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n text-align: left;\n padding: 8px 10px;\n border-bottom: 1px solid var(--mj-border-default);\n color: var(--mj-text-muted);\n font-size: 0.72rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n user-select: none;\n cursor: pointer;\n}\n\n.file-table[_ngcontent-%COMP%] th.th-check[_ngcontent-%COMP%] {\n width: 32px;\n cursor: default;\n}\n\n.file-table[_ngcontent-%COMP%] th.th-actions[_ngcontent-%COMP%] {\n width: 70px;\n text-align: right;\n cursor: default;\n}\n\n.sort-arrow[_ngcontent-%COMP%] {\n margin-left: 4px;\n font-size: 0.65rem;\n}\n\n.file-table-row[_ngcontent-%COMP%] {\n border-bottom: 1px solid var(--mj-border-default);\n cursor: pointer;\n transition: background-color 0.12s ease;\n}\n\n.file-table-row[_ngcontent-%COMP%]:hover {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n}\n\n.file-table-row.selected[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.file-table-row[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 8px 10px;\n vertical-align: middle;\n}\n\n.row-name-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n min-width: 0;\n}\n\n.row-icon-badge[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n min-width: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.9rem;\n}\n\n.row-file-name[_ngcontent-%COMP%] {\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 2px 6px;\n border-radius: 4px;\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-secondary);\n font-size: 0.7rem;\n}\n\n.size-text[_ngcontent-%COMP%], .date-text[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n font-size: 0.76rem;\n white-space: nowrap;\n}\n\n.row-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 4px;\n opacity: 0;\n transition: opacity 0.12s ease;\n}\n\n.file-table-row[_ngcontent-%COMP%]:hover .row-action-buttons[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.row-act-btn[_ngcontent-%COMP%] {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--mj-bg-surface-sunken);\n border: 1px solid var(--mj-border-default);\n border-radius: 4px;\n color: var(--mj-text-secondary);\n font-size: 0.7rem;\n cursor: pointer;\n}\n\n.row-act-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-brand-primary);\n border-color: var(--mj-brand-primary);\n}\n\n\n\n\n\n.mj-file-thumb--folder[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, transparent);\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-thumb--pdf[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-error, #ef4444) 14%, transparent);\n color: var(--mj-status-error, #ef4444);\n}\n\n.mj-file-thumb--image[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-media-image, #8b5cf6) 14%, transparent);\n color: var(--mj-media-image, #8b5cf6);\n}\n\n.mj-file-thumb--video[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary, #3b82f6) 14%, transparent);\n color: var(--mj-brand-primary, #3b82f6);\n}\n\n.mj-file-thumb--audio[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning, #f59e0b) 14%, transparent);\n color: var(--mj-status-warning, #f59e0b);\n}\n\n.mj-file-thumb--code[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-success, #10b981) 14%, transparent);\n color: var(--mj-status-success, #10b981);\n}\n\n.mj-file-thumb--text[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-text-muted, #6b7280) 14%, transparent);\n color: var(--mj-text-muted, #6b7280);\n}\n\n.mj-file-thumb--document[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary-hover, #2563eb) 14%, transparent);\n color: var(--mj-brand-primary-hover, #2563eb);\n}\n\n\n\n\n\n.status-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 6px 16px;\n background-color: var(--mj-bg-surface-sunken, color-mix(in srgb, var(--mj-text-primary) 3%, var(--mj-bg-surface)));\n border-top: 1px solid var(--mj-border-default);\n font-size: 0.72rem;\n color: var(--mj-text-secondary);\n flex-shrink: 0;\n}\n\n.status-account-badge[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n color: var(--mj-brand-primary);\n font-weight: 500;\n}\n\n\n\n\n\n.drag-drop-overlay[_ngcontent-%COMP%] {\n position: absolute;\n inset: 0;\n background: color-mix(in srgb, var(--mj-brand-primary) 12%, rgba(255, 255, 255, 0.9));\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 100;\n pointer-events: none;\n}\n\n.drag-drop-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n padding: 32px 48px;\n background-color: var(--mj-bg-surface);\n border: 2px dashed var(--mj-brand-primary);\n border-radius: var(--mj-radius-lg, 12px);\n box-shadow: var(--mj-shadow-lg, 0 10px 25px rgba(0, 0, 0, 0.15));\n}\n\n.drag-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-brand-primary);\n margin-bottom: 12px;\n}\n\n.drag-drop-content[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 6px 0;\n font-size: 1.1rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.drag-drop-content[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.8rem;\n color: var(--mj-text-secondary);\n}\n\n.upload-progress-bar-wrap[_ngcontent-%COMP%] {\n position: absolute;\n bottom: 36px;\n right: 20px;\n z-index: 90;\n}\n\n.upload-progress-card[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-md, 8px);\n padding: 10px 14px;\n box-shadow: var(--mj-shadow-lg, 0 8px 20px rgba(0, 0, 0, 0.15));\n width: 260px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.upload-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.upload-spinner[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.upload-text[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.progress-track[_ngcontent-%COMP%] {\n height: 4px;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 9999px;\n overflow: hidden;\n}\n\n.progress-fill[_ngcontent-%COMP%] {\n height: 100%;\n background-color: var(--mj-brand-primary);\n transition: width 0.15s ease;\n}\n\n.grid-loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 1;\n}\n\n\n\n\n\n.mj-modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.5);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1050;\n padding: 20px;\n animation: _ngcontent-%COMP%_modalFadeIn 0.18s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_modalFadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n.mj-modal-window[_ngcontent-%COMP%] {\n background-color: var(--mj-bg-surface);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg, 12px);\n box-shadow: var(--mj-shadow-xl, 0 20px 35px rgba(0, 0, 0, 0.25));\n width: 100%;\n max-width: 500px;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n}\n\n.mj-modal-window.modal-compact[_ngcontent-%COMP%] {\n max-width: 420px;\n}\n\n.mj-modal-window.preview-modal-window[_ngcontent-%COMP%] {\n max-width: 850px;\n max-height: 85vh;\n height: 80vh;\n}\n\n.mj-modal-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 18px;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n}\n\n.modal-title-wrap[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.modal-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.95rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n.modal-subtitle[_ngcontent-%COMP%] {\n font-size: 0.72rem;\n color: var(--mj-text-muted);\n}\n\n.modal-header-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.modal-close-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n color: var(--mj-text-secondary);\n font-size: 1rem;\n cursor: pointer;\n padding: 4px;\n border-radius: 4px;\n}\n\n.modal-close-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.mj-modal-body[_ngcontent-%COMP%] {\n padding: 18px;\n display: flex;\n flex-direction: column;\n gap: 10px;\n}\n\n.form-label[_ngcontent-%COMP%] {\n font-size: 0.78rem;\n font-weight: 600;\n color: var(--mj-text-secondary);\n}\n\n.form-input[_ngcontent-%COMP%] {\n padding: 8px 12px;\n border-radius: var(--mj-radius-sm, 6px);\n border: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n color: var(--mj-text-primary);\n font-size: 0.85rem;\n outline: none;\n}\n\n.form-input[_ngcontent-%COMP%]:focus {\n border-color: var(--mj-brand-primary);\n}\n\n.modal-body-text[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: var(--mj-text-primary);\n}\n\n.modal-warning-banner[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background-color: color-mix(in srgb, var(--mj-status-warning) 12%, var(--mj-bg-surface));\n border: 1px solid var(--mj-status-warning);\n border-radius: var(--mj-radius-sm, 6px);\n font-size: 0.76rem;\n color: var(--mj-text-primary);\n}\n\n.mj-modal-footer[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 8px;\n padding: 12px 18px;\n border-top: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n}\n\n\n.preview-modal-body[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--mj-bg-surface-sunken);\n padding: 16px;\n overflow: hidden;\n}\n\n.preview-media-wrap[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.preview-img[_ngcontent-%COMP%] {\n max-width: 100%;\n max-height: 100%;\n object-fit: contain;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.preview-iframe[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n border: none;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.preview-video[_ngcontent-%COMP%] {\n max-width: 100%;\n max-height: 100%;\n border-radius: var(--mj-radius-md, 8px);\n}\n\n.audio-preview-wrap[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n}\n\n.preview-audio-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-brand-primary);\n}\n\n.preview-audio[_ngcontent-%COMP%] {\n width: 320px;\n}\n\n.preview-fallback[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n text-align: center;\n color: var(--mj-text-secondary);\n}\n\n.preview-fallback-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-text-muted);\n margin-bottom: 8px;\n}\n\n.preview-fallback[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.95rem;\n color: var(--mj-text-primary);\n}\n\n.preview-fallback[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.8rem;\n}\n\n.account-picker-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-height: 180px;\n overflow-y: auto;\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-sm, 6px);\n padding: 6px;\n}\n\n.account-picker-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 6px 8px;\n border-radius: 4px;\n cursor: pointer;\n}\n\n.account-picker-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.picker-name[_ngcontent-%COMP%] {\n font-size: 0.82rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.picker-badge[_ngcontent-%COMP%] {\n margin-left: auto;\n font-size: 0.7rem;\n color: var(--mj-text-muted);\n}\n\n.copy-progress-indicator[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 0.78rem;\n color: var(--mj-brand-primary);\n margin-top: 8px;\n}"] });
|
|
2745
2745
|
}
|
|
2746
2746
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileGridComponent, [{
|
|
2747
2747
|
type: Component,
|