@memberjunction/ng-list-management 5.34.1 → 5.36.0

package/dist/lib/components/shared-with-me/shared-with-me.component.js

@@ -0,0 +1,231 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Output, inject } from '@angular/core';
+import { BaseAngularComponent } from '@memberjunction/ng-base-types';
+import { GraphQLListsClient } from '@memberjunction/graphql-dataprovider';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/forms";
+import * as i3 from "@memberjunction/ng-ui-components";
+import * as i4 from "@memberjunction/ng-shared-generic";
+const _forTrack0 = ($index, $item) => $item.ListID;
+function ListsSharedWithMeComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 12);
+    i0.ɵɵelement(1, "mj-loading", 16);
+    i0.ɵɵelementEnd();
+} }
+function ListsSharedWithMeComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 13);
+    i0.ɵɵelement(1, "i", 17);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r0.errorMessage);
+} }
+function ListsSharedWithMeComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 14);
+    i0.ɵɵelement(1, "i", 18);
+    i0.ɵɵelementStart(2, "h3");
+    i0.ɵɵtext(3, "No lists shared with you");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5, "When someone shares a list with you, it'll appear here.");
+    i0.ɵɵelementEnd()();
+} }
+function ListsSharedWithMeComponent_Conditional_20_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 20);
+    i0.ɵɵlistener("click", function ListsSharedWithMeComponent_Conditional_20_For_2_Template_div_click_0_listener() { const share_r3 = i0.ɵɵrestoreView(_r2).$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.OnCardClick(share_r3.ListID)); });
+    i0.ɵɵelementStart(1, "div", 21)(2, "div", 22);
+    i0.ɵɵelement(3, "i", 23);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "div", 24);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(6, "div", 25)(7, "span", 26);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "span", 27);
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const share_r3 = ctx.$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(share_r3.ListName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngClass", ctx_r0.badgeClass(share_r3.PermissionLevel));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r0.badgeLabel(share_r3.PermissionLevel), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r0.formatRelative(share_r3.SharedAt));
+} }
+function ListsSharedWithMeComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵrepeaterCreate(1, ListsSharedWithMeComponent_Conditional_20_For_2_Template, 11, 4, "div", 19, _forTrack0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r0.visibleShares);
+} }
+/**
+ * "Shared With Me" view (mockup 17). Lists every `MJ: List` the current
+ * user has direct-share access to, plus a permission badge per row.
+ *
+ * Drop into the Lists app as a tab/resource. Click events bubble up via
+ * `OpenList` so the host app can route through its own navigation
+ * (NavigationService etc.) — keeps this component framework-agnostic.
+ */
+export class ListsSharedWithMeComponent extends BaseAngularComponent {
+    cdr = inject(ChangeDetectorRef);
+    /** Emitted when the user clicks a card. Host wires this to navigation.
+     *  Includes ListName so the host can open a properly-titled tab without
+     *  a second fetch. */
+    OpenList = new EventEmitter();
+    /** Permission-level filter (empty = "All Permissions"). */
+    filterLevel = '';
+    /** Free-text filter on list name. */
+    filterText = '';
+    loading = false;
+    errorMessage = null;
+    allShares = [];
+    async ngOnInit() {
+        await this.loadShares();
+    }
+    get visibleShares() {
+        const term = this.filterText.trim().toLowerCase();
+        return this.allShares.filter((s) => {
+            if (this.filterLevel && s.PermissionLevel !== this.filterLevel)
+                return false;
+            if (term && !s.ListName.toLowerCase().includes(term))
+                return false;
+            return true;
+        });
+    }
+    OnFilterChange() {
+        this.cdr.markForCheck();
+    }
+    OnCardClick(listId) {
+        const share = this.allShares.find((s) => s.ListID === listId);
+        this.OpenList.emit({ ListID: listId, ListName: share?.ListName ?? '' });
+    }
+    async Refresh() {
+        await this.loadShares();
+    }
+    /**
+     * Friendly-format the "shared at" timestamp into a relative phrase
+     * ("3d ago", "2w ago"). Matches the mockup; falls back to absolute on
+     * older entries.
+     */
+    formatRelative(date) {
+        const diffMs = Date.now() - date.getTime();
+        const seconds = Math.floor(diffMs / 1000);
+        if (seconds < 60)
+            return 'just now';
+        const minutes = Math.floor(seconds / 60);
+        if (minutes < 60)
+            return `${minutes}m ago`;
+        const hours = Math.floor(minutes / 60);
+        if (hours < 24)
+            return `${hours}h ago`;
+        const days = Math.floor(hours / 24);
+        if (days < 7)
+            return `${days}d ago`;
+        const weeks = Math.floor(days / 7);
+        if (weeks < 5)
+            return `${weeks}w ago`;
+        const months = Math.floor(days / 30);
+        if (months < 12)
+            return `${months}mo ago`;
+        return date.toLocaleDateString();
+    }
+    /** Badge variant class for the permission-level chip. */
+    badgeClass(level) {
+        switch (level) {
+            case 'Owner':
+                return 'badge--owner';
+            case 'Edit':
+                return 'badge--editor';
+            default:
+                return 'badge--viewer';
+        }
+    }
+    badgeLabel(level) {
+        switch (level) {
+            case 'Owner':
+                return 'Owner';
+            case 'Edit':
+                return 'Editor';
+            default:
+                return 'Viewer';
+        }
+    }
+    async loadShares() {
+        this.loading = true;
+        this.errorMessage = null;
+        this.cdr.markForCheck();
+        try {
+            const provider = this.ProviderToUse;
+            const client = new GraphQLListsClient(provider);
+            this.allShares = await client.ListsSharedWithMe();
+        }
+        catch (e) {
+            this.errorMessage = e instanceof Error ? e.message : String(e);
+            this.allShares = [];
+        }
+        finally {
+            this.loading = false;
+            this.cdr.markForCheck();
+        }
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵListsSharedWithMeComponent_BaseFactory; return function ListsSharedWithMeComponent_Factory(__ngFactoryType__) { return (ɵListsSharedWithMeComponent_BaseFactory || (ɵListsSharedWithMeComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ListsSharedWithMeComponent)))(__ngFactoryType__ || ListsSharedWithMeComponent); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ListsSharedWithMeComponent, selectors: [["mj-lists-shared-with-me"]], outputs: { OpenList: "OpenList" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 21, vars: 4, consts: [[1, "shared-with-me"], [1, "shared-toolbar"], [1, "search-box"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Filter shared lists\u2026", 1, "mj-input", 3, "ngModelChange", "ngModel"], ["title", "Filter by permission", 1, "mj-input", "mj-select", "permission-filter", 3, "ngModelChange", "ngModel"], ["value", ""], ["value", "View"], ["value", "Edit"], ["value", "Owner"], ["mjButton", "", "variant", "outline", 3, "click", "disabled"], [1, "fa-solid", "fa-rotate"], [1, "state-block"], [1, "state-block", "state-block--error"], [1, "state-block", "state-block--empty"], [1, "list-grid"], ["text", "Loading shared lists...", "size", "medium"], [1, "fa-solid", "fa-triangle-exclamation"], [1, "fa-solid", "fa-share-nodes"], ["tabindex", "0", 1, "list-card"], ["tabindex", "0", 1, "list-card", 3, "click"], [1, "list-card__header"], [1, "list-card__icon"], [1, "fa-solid", "fa-list"], [1, "list-card__title"], [1, "list-card__footer"], [1, "permission-badge", 3, "ngClass"], [1, "list-card__shared-at"]], template: function ListsSharedWithMeComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2);
+            i0.ɵɵelement(3, "i", 3);
+            i0.ɵɵelementStart(4, "input", 4);
+            i0.ɵɵtwoWayListener("ngModelChange", function ListsSharedWithMeComponent_Template_input_ngModelChange_4_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.filterText, $event) || (ctx.filterText = $event); return $event; });
+            i0.ɵɵlistener("ngModelChange", function ListsSharedWithMeComponent_Template_input_ngModelChange_4_listener() { return ctx.OnFilterChange(); });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(5, "select", 5);
+            i0.ɵɵtwoWayListener("ngModelChange", function ListsSharedWithMeComponent_Template_select_ngModelChange_5_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.filterLevel, $event) || (ctx.filterLevel = $event); return $event; });
+            i0.ɵɵlistener("ngModelChange", function ListsSharedWithMeComponent_Template_select_ngModelChange_5_listener() { return ctx.OnFilterChange(); });
+            i0.ɵɵelementStart(6, "option", 6);
+            i0.ɵɵtext(7, "All Permissions");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "option", 7);
+            i0.ɵɵtext(9, "Viewer");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(10, "option", 8);
+            i0.ɵɵtext(11, "Editor");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "option", 9);
+            i0.ɵɵtext(13, "Owner");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(14, "button", 10);
+            i0.ɵɵlistener("click", function ListsSharedWithMeComponent_Template_button_click_14_listener() { return ctx.Refresh(); });
+            i0.ɵɵelement(15, "i", 11);
+            i0.ɵɵtext(16, " Refresh ");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵconditionalCreate(17, ListsSharedWithMeComponent_Conditional_17_Template, 2, 0, "div", 12)(18, ListsSharedWithMeComponent_Conditional_18_Template, 4, 1, "div", 13)(19, ListsSharedWithMeComponent_Conditional_19_Template, 6, 0, "div", 14)(20, ListsSharedWithMeComponent_Conditional_20_Template, 3, 0, "div", 15);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance(4);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.filterText);
+            i0.ɵɵadvance();
+            i0.ɵɵtwoWayProperty("ngModel", ctx.filterLevel);
+            i0.ɵɵadvance(9);
+            i0.ɵɵproperty("disabled", ctx.loading);
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.loading ? 17 : ctx.errorMessage ? 18 : ctx.visibleShares.length === 0 ? 19 : 20);
+        } }, dependencies: [i1.NgClass, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJButtonDirective, i4.LoadingComponent], styles: [".shared-with-me[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n}\n\n.shared-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box[_ngcontent-%COMP%] {\n  flex: 1;\n  max-width: 320px;\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-box[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  pointer-events: none;\n}\n\n.search-box[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding-left: 32px;\n}\n\n.permission-filter[_ngcontent-%COMP%] {\n  width: 160px;\n}\n\n.state-block[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 48px 24px;\n  color: var(--mj-text-secondary);\n  font-size: 13.5px;\n}\n\n.state-block--error[_ngcontent-%COMP%] {\n  color: var(--mj-status-error-text);\n  background: var(--mj-status-error-bg);\n  border: 1px solid var(--mj-status-error-border);\n  border-radius: 8px;\n}\n\n.state-block--empty[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 18px;\n  color: var(--mj-text-primary);\n}\n\n.state-block--empty[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 32px;\n  color: var(--mj-text-muted);\n}\n\n.list-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.list-card[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  padding: 14px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 10px;\n  cursor: pointer;\n  transition: border-color 0.15s ease, background 0.15s ease;\n}\n\n.list-card[_ngcontent-%COMP%]:hover, \n.list-card[_ngcontent-%COMP%]:focus-visible {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  outline: none;\n}\n\n.list-card__header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.list-card__icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.list-card__title[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.list-card__footer[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 11.5px;\n  color: var(--mj-text-muted);\n}\n\n.list-card__shared-at[_ngcontent-%COMP%] {\n  margin-left: auto;\n}\n\n.permission-badge[_ngcontent-%COMP%] {\n  font-size: 11px;\n  padding: 2px 8px;\n  border-radius: 999px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n}\n\n.badge--viewer[_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.badge--editor[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n  color: var(--mj-status-warning-text);\n}\n\n.badge--owner[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n  color: var(--mj-status-success-text);\n}"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ListsSharedWithMeComponent, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-lists-shared-with-me', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"shared-with-me\">\n  <!-- Toolbar -->\n  <div class=\"shared-toolbar\">\n    <div class=\"search-box\">\n      <i class=\"fa-solid fa-search\"></i>\n      <input\n        class=\"mj-input\"\n        type=\"text\"\n        [(ngModel)]=\"filterText\"\n        (ngModelChange)=\"OnFilterChange()\"\n        placeholder=\"Filter shared lists\u2026\" />\n    </div>\n    <select\n      class=\"mj-input mj-select permission-filter\"\n      [(ngModel)]=\"filterLevel\"\n      (ngModelChange)=\"OnFilterChange()\"\n      title=\"Filter by permission\">\n      <option value=\"\">All Permissions</option>\n      <option value=\"View\">Viewer</option>\n      <option value=\"Edit\">Editor</option>\n      <option value=\"Owner\">Owner</option>\n    </select>\n    <button mjButton variant=\"outline\" (click)=\"Refresh()\" [disabled]=\"loading\">\n      <i class=\"fa-solid fa-rotate\"></i>\n      Refresh\n    </button>\n  </div>\n\n  @if (loading) {\n    <div class=\"state-block\">\n      <mj-loading text=\"Loading shared lists...\" size=\"medium\"></mj-loading>\n    </div>\n  } @else if (errorMessage) {\n    <div class=\"state-block state-block--error\">\n      <i class=\"fa-solid fa-triangle-exclamation\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  } @else if (visibleShares.length === 0) {\n    <div class=\"state-block state-block--empty\">\n      <i class=\"fa-solid fa-share-nodes\"></i>\n      <h3>No lists shared with you</h3>\n      <p>When someone shares a list with you, it'll appear here.</p>\n    </div>\n  } @else {\n    <div class=\"list-grid\">\n      @for (share of visibleShares; track share.ListID) {\n        <div class=\"list-card\" (click)=\"OnCardClick(share.ListID)\" tabindex=\"0\">\n          <div class=\"list-card__header\">\n            <div class=\"list-card__icon\">\n              <i class=\"fa-solid fa-list\"></i>\n            </div>\n            <div class=\"list-card__title\">{{ share.ListName }}</div>\n          </div>\n          <div class=\"list-card__footer\">\n            <span class=\"permission-badge\" [ngClass]=\"badgeClass(share.PermissionLevel)\">\n              {{ badgeLabel(share.PermissionLevel) }}\n            </span>\n            <span class=\"list-card__shared-at\">{{ formatRelative(share.SharedAt) }}</span>\n          </div>\n        </div>\n      }\n    </div>\n  }\n</div>\n", styles: [".shared-with-me {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n}\n\n.shared-toolbar {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box {\n  flex: 1;\n  max-width: 320px;\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-box i {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  pointer-events: none;\n}\n\n.search-box input {\n  width: 100%;\n  padding-left: 32px;\n}\n\n.permission-filter {\n  width: 160px;\n}\n\n.state-block {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 48px 24px;\n  color: var(--mj-text-secondary);\n  font-size: 13.5px;\n}\n\n.state-block--error {\n  color: var(--mj-status-error-text);\n  background: var(--mj-status-error-bg);\n  border: 1px solid var(--mj-status-error-border);\n  border-radius: 8px;\n}\n\n.state-block--empty h3 {\n  margin: 0;\n  font-size: 18px;\n  color: var(--mj-text-primary);\n}\n\n.state-block--empty i {\n  font-size: 32px;\n  color: var(--mj-text-muted);\n}\n\n.list-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 12px;\n}\n\n.list-card {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  padding: 14px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 10px;\n  cursor: pointer;\n  transition: border-color 0.15s ease, background 0.15s ease;\n}\n\n.list-card:hover,\n.list-card:focus-visible {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  outline: none;\n}\n\n.list-card__header {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.list-card__icon {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.list-card__title {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.list-card__footer {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 11.5px;\n  color: var(--mj-text-muted);\n}\n\n.list-card__shared-at {\n  margin-left: auto;\n}\n\n.permission-badge {\n  font-size: 11px;\n  padding: 2px 8px;\n  border-radius: 999px;\n  font-weight: 600;\n  letter-spacing: 0.02em;\n}\n\n.badge--viewer {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.badge--editor {\n  background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n  color: var(--mj-status-warning-text);\n}\n\n.badge--owner {\n  background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n  color: var(--mj-status-success-text);\n}\n"] }]
+    }], null, { OpenList: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ListsSharedWithMeComponent, { className: "ListsSharedWithMeComponent", filePath: "src/lib/components/shared-with-me/shared-with-me.component.ts", lineNumber: 22 }); })();
+//# sourceMappingURL=shared-with-me.component.js.map

package/dist/lib/components/shared-with-me/shared-with-me.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared-with-me.component.js","sourceRoot":"","sources":["../../../../src/lib/components/shared-with-me/shared-with-me.component.ts","../../../../src/lib/components/shared-with-me/shared-with-me.component.html"],"names":[],"mappings":"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","sourcesContent":["import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, OnInit, Output, inject } from '@angular/core';\n\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { GraphQLDataProvider, GraphQLListsClient } from '@memberjunction/graphql-dataprovider';\nimport type { SharedListSummary, SharePermissionLevel } from '@memberjunction/lists-base';\n\n/**\n * \"Shared With Me\" view (mockup 17). Lists every `MJ: List` the current\n * user has direct-share access to, plus a permission badge per row.\n *\n * Drop into the Lists app as a tab/resource. Click events bubble up via\n * `OpenList` so the host app can route through its own navigation\n * (NavigationService etc.) — keeps this component framework-agnostic.\n */\n@Component({\n  standalone: false,\n  selector: 'mj-lists-shared-with-me',\n  templateUrl: './shared-with-me.component.html',\n  styleUrls: ['./shared-with-me.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ListsSharedWithMeComponent extends BaseAngularComponent implements OnInit {\n  private readonly cdr = inject(ChangeDetectorRef);\n\n  /** Emitted when the user clicks a card. Host wires this to navigation.\n   *  Includes ListName so the host can open a properly-titled tab without\n   *  a second fetch. */\n  @Output() OpenList = new EventEmitter<{ ListID: string; ListName: string }>();\n\n  /** Permission-level filter (empty = \"All Permissions\"). */\n  public filterLevel: SharePermissionLevel | '' = '';\n\n  /** Free-text filter on list name. */\n  public filterText = '';\n\n  public loading = false;\n  public errorMessage: string | null = null;\n  private allShares: SharedListSummary[] = [];\n\n  async ngOnInit(): Promise<void> {\n    await this.loadShares();\n  }\n\n  public get visibleShares(): SharedListSummary[] {\n    const term = this.filterText.trim().toLowerCase();\n    return this.allShares.filter((s) => {\n      if (this.filterLevel && s.PermissionLevel !== this.filterLevel) return false;\n      if (term && !s.ListName.toLowerCase().includes(term)) return false;\n      return true;\n    });\n  }\n\n  public OnFilterChange(): void {\n    this.cdr.markForCheck();\n  }\n\n  public OnCardClick(listId: string): void {\n    const share = this.allShares.find((s) => s.ListID === listId);\n    this.OpenList.emit({ ListID: listId, ListName: share?.ListName ?? '' });\n  }\n\n  public async Refresh(): Promise<void> {\n    await this.loadShares();\n  }\n\n  /**\n   * Friendly-format the \"shared at\" timestamp into a relative phrase\n   * (\"3d ago\", \"2w ago\"). Matches the mockup; falls back to absolute on\n   * older entries.\n   */\n  public formatRelative(date: Date): string {\n    const diffMs = Date.now() - date.getTime();\n    const seconds = Math.floor(diffMs / 1000);\n    if (seconds < 60) return 'just now';\n    const minutes = Math.floor(seconds / 60);\n    if (minutes < 60) return `${minutes}m ago`;\n    const hours = Math.floor(minutes / 60);\n    if (hours < 24) return `${hours}h ago`;\n    const days = Math.floor(hours / 24);\n    if (days < 7) return `${days}d ago`;\n    const weeks = Math.floor(days / 7);\n    if (weeks < 5) return `${weeks}w ago`;\n    const months = Math.floor(days / 30);\n    if (months < 12) return `${months}mo ago`;\n    return date.toLocaleDateString();\n  }\n\n  /** Badge variant class for the permission-level chip. */\n  public badgeClass(level: SharePermissionLevel): string {\n    switch (level) {\n      case 'Owner':\n        return 'badge--owner';\n      case 'Edit':\n        return 'badge--editor';\n      default:\n        return 'badge--viewer';\n    }\n  }\n\n  public badgeLabel(level: SharePermissionLevel): string {\n    switch (level) {\n      case 'Owner':\n        return 'Owner';\n      case 'Edit':\n        return 'Editor';\n      default:\n        return 'Viewer';\n    }\n  }\n\n  private async loadShares(): Promise<void> {\n    this.loading = true;\n    this.errorMessage = null;\n    this.cdr.markForCheck();\n    try {\n      const provider = this.ProviderToUse as unknown as GraphQLDataProvider;\n      const client = new GraphQLListsClient(provider);\n      this.allShares = await client.ListsSharedWithMe();\n    } catch (e) {\n      this.errorMessage = e instanceof Error ? e.message : String(e);\n      this.allShares = [];\n    } finally {\n      this.loading = false;\n      this.cdr.markForCheck();\n    }\n  }\n}\n","<div class=\"shared-with-me\">\n  <!-- Toolbar -->\n  <div class=\"shared-toolbar\">\n    <div class=\"search-box\">\n      <i class=\"fa-solid fa-search\"></i>\n      <input\n        class=\"mj-input\"\n        type=\"text\"\n        [(ngModel)]=\"filterText\"\n        (ngModelChange)=\"OnFilterChange()\"\n        placeholder=\"Filter shared lists…\" />\n    </div>\n    <select\n      class=\"mj-input mj-select permission-filter\"\n      [(ngModel)]=\"filterLevel\"\n      (ngModelChange)=\"OnFilterChange()\"\n      title=\"Filter by permission\">\n      <option value=\"\">All Permissions</option>\n      <option value=\"View\">Viewer</option>\n      <option value=\"Edit\">Editor</option>\n      <option value=\"Owner\">Owner</option>\n    </select>\n    <button mjButton variant=\"outline\" (click)=\"Refresh()\" [disabled]=\"loading\">\n      <i class=\"fa-solid fa-rotate\"></i>\n      Refresh\n    </button>\n  </div>\n\n  @if (loading) {\n    <div class=\"state-block\">\n      <mj-loading text=\"Loading shared lists...\" size=\"medium\"></mj-loading>\n    </div>\n  } @else if (errorMessage) {\n    <div class=\"state-block state-block--error\">\n      <i class=\"fa-solid fa-triangle-exclamation\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  } @else if (visibleShares.length === 0) {\n    <div class=\"state-block state-block--empty\">\n      <i class=\"fa-solid fa-share-nodes\"></i>\n      <h3>No lists shared with you</h3>\n      <p>When someone shares a list with you, it'll appear here.</p>\n    </div>\n  } @else {\n    <div class=\"list-grid\">\n      @for (share of visibleShares; track share.ListID) {\n        <div class=\"list-card\" (click)=\"OnCardClick(share.ListID)\" tabindex=\"0\">\n          <div class=\"list-card__header\">\n            <div class=\"list-card__icon\">\n              <i class=\"fa-solid fa-list\"></i>\n            </div>\n            <div class=\"list-card__title\">{{ share.ListName }}</div>\n          </div>\n          <div class=\"list-card__footer\">\n            <span class=\"permission-badge\" [ngClass]=\"badgeClass(share.PermissionLevel)\">\n              {{ badgeLabel(share.PermissionLevel) }}\n            </span>\n            <span class=\"list-card__shared-at\">{{ formatRelative(share.SharedAt) }}</span>\n          </div>\n        </div>\n      }\n    </div>\n  }\n</div>\n"]}

package/dist/lib/components/tag-chips/tag-chips.component.d.ts

@@ -0,0 +1,85 @@
+import { EventEmitter, OnInit } from '@angular/core';
+import { BaseAngularComponent } from '@memberjunction/ng-base-types';
+import type { MJTagEntity } from '@memberjunction/core-entities';
+import * as i0 from "@angular/core";
+/**
+ * Compact tag chips for a single record (mockup 22). Loads tags by
+ * querying `MJ: Tagged Items` filtered to `(EntityID, RecordID)`, then
+ * resolves names from `MJ: Tags` in a single batch. Render-only by
+ * default; pass `Editable=true` to surface an inline add field and
+ * per-chip remove buttons.
+ *
+ * Intentionally lightweight — not a tag manager. For richer tag tooling
+ * (cloud view, related records, etc.) use `mj-record-tags` from
+ * `@memberjunction/ng-record-tags`.
+ */
+interface DisplayTag {
+    /** TaggedItem row ID — used for removal. */
+    TaggedItemID: string;
+    /** Tag.ID — useful for downstream filtering / lookups. */
+    TagID: string;
+    /** Tag display name. */
+    Name: string;
+}
+export declare class TagChipsComponent extends BaseAngularComponent implements OnInit {
+    private readonly cdr;
+    /** Entity name (e.g. 'MJ: Lists'). Required. */
+    set EntityName(value: string | null);
+    get EntityName(): string | null;
+    private _entityName;
+    /** Record ID (the row's primary key, serialized). Required. */
+    set RecordID(value: string | null);
+    get RecordID(): string | null;
+    private _recordId;
+    /** When true, shows add input + remove buttons on chips. */
+    Editable: boolean;
+    /** Cap visible chips and surface "+N more". Defaults to 6 for cards. */
+    MaxDisplay: number;
+    /** Emitted when a chip is clicked. Lets the parent drive filter-by-tag. */
+    TagClicked: EventEmitter<{
+        TagID: string;
+        Name: string;
+    }>;
+    /** Emitted after add/remove so parents can refresh dependent data. */
+    TagsChanged: EventEmitter<void>;
+    tags: DisplayTag[];
+    loading: boolean;
+    addInput: string;
+    suggestions: MJTagEntity[];
+    showSuggestions: boolean;
+    /** True when the trimmed input doesn't exactly match any existing tag —
+     *  drives the "Create '<term>'" affordance at the top of the dropdown. */
+    canCreateNew: boolean;
+    private initialized;
+    private entityID;
+    ngOnInit(): Promise<void>;
+    get displayedTags(): DisplayTag[];
+    get extraTagCount(): number;
+    OnTagClick(tag: DisplayTag): void;
+    OnRemove(tag: DisplayTag, event: Event): Promise<void>;
+    OnAddInputChange(value: string): Promise<void>;
+    /**
+     * Enter-key handler on the input. If suggestions are showing,
+     * picks the first one (existing tag); otherwise creates a new tag
+     * from the typed text and applies it. Closes the suggestion menu
+     * on either path.
+     */
+    OnAddInputSubmit(event?: Event): Promise<void>;
+    OnAddTag(tag: MJTagEntity): Promise<void>;
+    /** Click handler for the "Create '<term>'" affordance. Creates the
+     *  `MJ: Tags` row then attaches it via the standard apply path. */
+    OnCreateNew(): Promise<void>;
+    private CreateAndAddTag;
+    private applyTagToRecord;
+    /**
+     * Bulk-load tags + their names in two RunViews — one for the join
+     * rows and one to resolve display names. Cheap; this typically returns
+     * fewer than 10 rows.
+     */
+    private loadTags;
+    private metadata;
+    static ɵfac: i0.ɵɵFactoryDeclaration<TagChipsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TagChipsComponent, "mj-tag-chips", never, { "EntityName": { "alias": "EntityName"; "required": false; }; "RecordID": { "alias": "RecordID"; "required": false; }; "Editable": { "alias": "Editable"; "required": false; }; "MaxDisplay": { "alias": "MaxDisplay"; "required": false; }; }, { "TagClicked": "TagClicked"; "TagsChanged": "TagsChanged"; }, never, never, false, never>;
+}
+export {};
+//# sourceMappingURL=tag-chips.component.d.ts.map

package/dist/lib/components/tag-chips/tag-chips.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-chips.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/tag-chips/tag-chips.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAyD,YAAY,EAAS,MAAM,EAAkB,MAAM,eAAe,CAAC;AAEnI,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAErE,OAAO,KAAK,EAAE,WAAW,EAAsB,MAAM,+BAA+B,CAAC;;AAErF;;;;;;;;;;GAUG;AAEH,UAAU,UAAU;IAClB,4CAA4C;IAC5C,YAAY,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,qBAOa,iBAAkB,SAAQ,oBAAqB,YAAW,MAAM;IAC3E,OAAO,CAAC,QAAQ,CAAC,GAAG,CAA6B;IAEjD,gDAAgD;IAChD,IACI,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAKlC;IACD,IAAI,UAAU,IAAI,MAAM,GAAG,IAAI,CAE9B;IACD,OAAO,CAAC,WAAW,CAAuB;IAE1C,+DAA+D;IAC/D,IACI,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAKhC;IACD,IAAI,QAAQ,IAAI,MAAM,GAAG,IAAI,CAE5B;IACD,OAAO,CAAC,SAAS,CAAuB;IAExC,4DAA4D;IACnD,QAAQ,UAAS;IAE1B,wEAAwE;IAC/D,UAAU,SAAK;IAExB,2EAA2E;IACjE,UAAU;eAA6B,MAAM;cAAQ,MAAM;OAAM;IAE3E,sEAAsE;IAC5D,WAAW,qBAA4B;IAE1C,IAAI,EAAE,UAAU,EAAE,CAAM;IACxB,OAAO,UAAS;IAChB,QAAQ,SAAM;IACd,WAAW,EAAE,WAAW,EAAE,CAAM;IAChC,eAAe,UAAS;IAC/B;8EAC0E;IACnE,YAAY,UAAS;IAE5B,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,QAAQ,CAAuB;IAEjC,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC;IAK/B,IAAW,aAAa,IAAI,UAAU,EAAE,CAEvC;IAED,IAAW,aAAa,IAAI,MAAM,CAEjC;IAEM,UAAU,CAAC,GAAG,EAAE,UAAU,GAAG,IAAI;IAI3B,QAAQ,CAAC,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC;IAmBtD,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAsC3D;;;;;OAKG;IACU,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC;IAe9C,QAAQ,CAAC,GAAG,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;IAKtD;uEACmE;IACtD,WAAW,IAAI,OAAO,CAAC,IAAI,CAAC;YAM3B,eAAe;YAsBf,gBAAgB;IA4B9B;;;;OAIG;YACW,QAAQ;IAuDtB,OAAO,CAAC,QAAQ;yCA/QL,iBAAiB;2CAAjB,iBAAiB;CAkR7B"}