@fluid-topics/ft-reader-metadata 1.1.73 → 1.1.75

package/build/ft-reader-metadata.d.ts

@@ -9,6 +9,7 @@ export declare class FtReaderMetadata extends FtReaderMetadata_base implements F
     key?: string;
     multiLine: boolean;
     useForSwitchingToRelatives: boolean;
+    displayLabel: boolean;
     editorMode: boolean;
     private metadata?;
     private flatMetadata?;
@@ -22,7 +23,7 @@ export declare class FtReaderMetadata extends FtReaderMetadata_base implements F
     protected render(): import("lit").TemplateResult<1>;
     private renderSwitchToRelatives;
     private renderChip;
-    private renderChipContent;
+    private get metadataValue();
     private renderRelativeItem;
     private hideIfEmpty;
     private addTopicPivotParam;

package/build/ft-reader-metadata.js

@@ -23,6 +23,7 @@ class FtReaderMetadata extends withI18n(FtReaderComponent) {
         super();
         this.multiLine = false;
         this.useForSwitchingToRelatives = false;
+        this.displayLabel = false;
         this.editorMode = false;
         this.relatives = [];
         this.noValueMessage = "No value";
@@ -61,26 +62,32 @@ class FtReaderMetadata extends withI18n(FtReaderComponent) {
         `;
     }
     renderChip(inFloatingMenu = false) {
-        var _a, _b;
-        return html `
+        var _a, _b, _c, _d, _e, _f;
+        let noTooltip = this.displayLabel && ((_a = this.flatMetadata) === null || _a === void 0 ? void 0 : _a.value) == ((_b = this.flatMetadata) === null || _b === void 0 ? void 0 : _b.displayValue);
+        let chip = html `
+            <ft-chip part="chip"
+                     exportpartsPrefix="chip"
+                     slot="${noTooltip && inFloatingMenu ? "toggle" : ""}"
+                     trailingIcon icon="${inFloatingMenu ? "thin_arrow" : ""}"
+                     ?clickable=${inFloatingMenu}
+                     ?multiLine=${this.multiLine}>
+                ${this.displayLabel ? html `
+                        <span part="label">${(_d = (_c = this.metadata) === null || _c === void 0 ? void 0 : _c.label) !== null && _d !== void 0 ? _d : this.key}: </span>
+                    ` : nothing}
+                <span part="values">${this.metadataValue}</span>
+            </ft-chip>`;
+        return noTooltip ? chip : html `
             <ft-tooltip part="tooltip"
                         slot="${inFloatingMenu ? "toggle" : ""}"
                         class="${this.multiLine ? "ft-reader-metadata-multi-line" : ""}"
-                        text="${`${this.metadataLabel}: ${(_b = (_a = this.flatMetadata) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : this.noValueMessage}`}">
-                <ft-chip part="chip"
-                         exportpartsPrefix="chip"
-                         trailingIcon icon="${inFloatingMenu ? "thin_arrow" : ""}"
-                         ?clickable=${inFloatingMenu}
-                         ?multiLine=${this.multiLine}>
-                    ${this.renderChipContent()}
-                </ft-chip>
+                        text="${`${this.metadataLabel}: ${(_f = (_e = this.flatMetadata) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : this.noValueMessage}`}">
+                ${chip}
             </ft-tooltip>
         `;
     }
-    renderChipContent() {
-        var _a, _b;
-        if (this.metadata && this.metadata.values.length > 0) {
-            return (_b = (_a = this.flatMetadata) === null || _a === void 0 ? void 0 : _a.displayValue) !== null && _b !== void 0 ? _b : this.noValueMessage;
+    get metadataValue() {
+        if (this.flatMetadata) {
+            return this.flatMetadata.displayValue;
         }
         if (this.editorMode) {
             if (this.key) {
@@ -107,8 +114,7 @@ class FtReaderMetadata extends withI18n(FtReaderComponent) {
         `;
     }
     hideIfEmpty() {
-        const theresNoMetadata = !this.metadata || this.metadata.values.length == 0;
-        const shouldHide = this.useForSwitchingToRelatives ? theresNoMetadata && this.relatives.length === 0 : theresNoMetadata;
+        const shouldHide = this.flatMetadata == null && (this.useForSwitchingToRelatives ? this.relatives.length === 0 : true);
         if (!this.editorMode && shouldHide) {
             return html `
                 <style>
@@ -163,12 +169,7 @@ class FtReaderMetadata extends withI18n(FtReaderComponent) {
             }
         }
         if (props.has("metadata")) {
-            this.flatMetadata = this.metadata && this.metadata.values.length > 0 ? ClusteringHelper.flattenMetadata(this.metadata) : ({
-                key: this.key,
-                label: this.key,
-                value: undefined,
-                displayValue: undefined,
-            });
+            this.flatMetadata = ClusteringHelper.flattenMetadata(this.metadata);
         }
     }
     get metadataLabel() {
@@ -198,6 +199,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], FtReaderMetadata.prototype, "useForSwitchingToRelatives", void 0);
+__decorate([
+    property({ type: Boolean })
+], FtReaderMetadata.prototype, "displayLabel", void 0);
 __decorate([
     property({ attribute: false })
 ], FtReaderMetadata.prototype, "editorMode", void 0);