diff --git a/abstract/Block.js b/abstract/Block.js index 1546c8a5c..442fe28a2 100644 --- a/abstract/Block.js +++ b/abstract/Block.js @@ -174,6 +174,7 @@ export class Block extends BaseComponent { if (!this.has('*eventEmitter')) { this.add('*eventEmitter', new EventEmitter(this.debugPrint.bind(this))); } + if (!this.has('*localeManager')) { this.add('*localeManager', new LocaleManager(this)); } @@ -276,9 +277,6 @@ export class Block extends BaseComponent { return false; } const sharedKey = sharedConfigKey(/** @type {keyof import('../types').ConfigType} */ (key)); - if (!this.has(sharedKey)) { - this.add(sharedKey, initialConfig[/** @type {keyof import('../types').ConfigType} */ (key)]); - } this.$[sharedKey] = value; return true; }, @@ -287,10 +285,6 @@ export class Block extends BaseComponent { * @param {keyof import('../types').ConfigType} key */ get: (obj, key) => { - const sharedKey = sharedConfigKey(key); - if (!this.has(sharedKey)) { - this.add(sharedKey, initialConfig[key]); - } return this.$[sharedConfigKey(key)]; }, }); @@ -304,11 +298,7 @@ export class Block extends BaseComponent { * @param {(value: import('../types').ConfigType[T]) => void} callback */ subConfigValue(key, callback) { - const sharedKey = sharedConfigKey(key); - if (!this.has(sharedKey)) { - this.add(sharedKey, initialConfig[key]); - } - this.sub(sharedKey, callback); + this.sub(sharedConfigKey(key), callback); } /** @param {unknown[]} args */ diff --git a/blocks/FileItem/FileItem.js b/blocks/FileItem/FileItem.js index d9ca7ad3c..5680f7eaa 100644 --- a/blocks/FileItem/FileItem.js +++ b/blocks/FileItem/FileItem.js @@ -150,18 +150,8 @@ export class FileItem extends UploaderBlock { return; } - if (entry.getValue('file')?.type.includes('image')) { - try { - let thumbUrl = await generateThumb(entry.getValue('file'), this.cfg.thumbSize); - entry.setValue('thumbUrl', thumbUrl); - } catch (err) { - let color = window.getComputedStyle(this).getPropertyValue('--clr-generic-file-icon'); - entry.setValue('thumbUrl', fileCssBg(color)); - } - } else { - let color = window.getComputedStyle(this).getPropertyValue('--clr-generic-file-icon'); - entry.setValue('thumbUrl', fileCssBg(color)); - } + let color = window.getComputedStyle(this).getPropertyValue('--clr-generic-file-icon'); + entry.setValue('thumbUrl', fileCssBg(color)); } /** @@ -310,8 +300,6 @@ export class FileItem extends UploaderBlock { /** @private */ this._observer = new window.IntersectionObserver(this._observerCallback.bind(this), { - root: this.parentElement, - rootMargin: '50% 0px 50% 0px', threshold: [0, 1], }); this._observer.observe(this); diff --git a/blocks/FileItem/file-item.css b/blocks/FileItem/file-item.css index 30c2157d8..ab03deab6 100644 --- a/blocks/FileItem/file-item.css +++ b/blocks/FileItem/file-item.css @@ -1,6 +1,17 @@ lr-file-item { display: block; + content-visibility: auto; + + /* TODO: extract to theme */ + height: 56px; + contain-intrinsic-size: auto 56px; +} + +lr-file-item:last-of-type { + height: 52px; + contain-intrinsic-size: auto 52px; } + lr-file-item > .inner { position: relative; display: grid; @@ -13,7 +24,6 @@ lr-file-item > .inner { font-size: 0.95em; background-color: var(--clr-background); border-radius: var(--border-radius-element); - transition: var(--transition-duration); } lr-file-item:last-of-type > .inner { @@ -53,7 +63,6 @@ lr-file-item .file-name-wrapper { padding-left: var(--gap-mid); overflow: hidden; color: var(--clr-txt-light); - transition: color var(--transition-duration); } lr-file-item .file-name { @@ -94,7 +103,6 @@ lr-file-item .badge { border-radius: 50%; transform: scale(0.3); opacity: 0; - transition: var(--transition-duration) ease; display: flex; justify-content: center; align-items: center;