@crockery/fellowship-components 1.0.0 → 1.1.0

package/README.md

@@ -136,11 +136,13 @@ pnpm --filter @crockery/fellowship-components build
 pnpm --filter @crockery/fellowship-components pack:check
 ```
 
-Current Chromium, Firefox, and Safari/WebKit are supported. Add a Changeset with
-`pnpm changeset` from the monorepo root for every user-facing change. Merging
-the generated version pull request publishes through trusted OIDC publishing.
-The private repository means npm provenance attestations are unavailable.
-Maintainers should follow [`RELEASING.md`](RELEASING.md).
+Browser tests currently use headless Chromium as the package's deterministic
+browser harness. Cross-browser compatibility is not yet a supported contract.
+Add a Changeset with `pnpm changeset` from the monorepo root for every
+user-facing change. Merging the generated version pull request publishes
+through trusted OIDC publishing. The private repository means npm provenance
+attestations are unavailable. Maintainers should follow
+[`RELEASING.md`](RELEASING.md).
 
 ## License
 

package/dist/chunks/{gear-planner-Bgt77Ovf.js → gear-planner-uQOpm4QI.js}

@@ -4,12 +4,12 @@ import { LitElement as i, css as a, html as o, nothing as s } from "lit";
 import { customElement as c, property as l, query as u, state as d } from "lit/decorators.js";
 import { repeat as f } from "lit/directives/repeat.js";
 import { findImage as p } from "@crockery/fellowship-data";
-import { calculateGearPlannerBuild as m, getValidGearConfiguration as h, getValidGearItems as g, normalizeGearPlannerBuild as _, validateGearPlannerBuild as v } from "@crockery/fellowship-data/gear-planner";
+import { calculateGearPlannerBuild as m, getValidGearConfiguration as h, getValidGearItems as g, normalizeGearPlannerBuild as _, resolveGearPlannerItemName as v, validateGearPlannerBuild as y } from "@crockery/fellowship-data/gear-planner";
 //#region src/gear-planner/gear-position.ts
 r();
-var y = class extends i {
+var b = class extends i {
 	constructor(...e) {
-		super(...e), this.position = null, this.item = null, this.itemBuild = null, this.selected = !1, this.imageUrl = null, this.tooltipDetails = [], this.#e = (e) => {
+		super(...e), this.position = null, this.item = null, this.itemBuild = null, this.itemName = null, this.selected = !1, this.imageUrl = null, this.tooltipDetails = [], this.#e = (e) => {
 			this.dispatchEvent(new CustomEvent("fellowship-gear-position-select", {
 				bubbles: !0,
 				composed: !0,
@@ -144,7 +144,7 @@ var y = class extends i {
 	}
 	render() {
 		if (!this.position) return o``;
-		let e = this.item?.item.name ?? this.item?.item.id ?? "Choose item", t = this.itemBuild ? `${e}. Level ${this.itemBuild.itemLevel}, ${this.itemBuild.rarity}.` : `${this.position.label}. Empty.`, n = o`
+		let e = this.itemName ?? this.item?.item.name ?? this.item?.item.id ?? "Choose item", t = this.itemBuild ? `${e}. Level ${this.itemBuild.itemLevel}, ${this.itemBuild.rarity}.` : `${this.position.label}. Empty.`, n = o`
       <button
         type="button"
         aria-pressed=${String(this.selected)}
@@ -180,13 +180,13 @@ var y = class extends i {
 	#e;
 	#t;
 };
-e([l({ attribute: !1 })], y.prototype, "position", void 0), e([l({ attribute: !1 })], y.prototype, "item", void 0), e([l({ attribute: !1 })], y.prototype, "itemBuild", void 0), e([l({
+e([l({ attribute: !1 })], b.prototype, "position", void 0), e([l({ attribute: !1 })], b.prototype, "item", void 0), e([l({ attribute: !1 })], b.prototype, "itemBuild", void 0), e([l({ type: String })], b.prototype, "itemName", void 0), e([l({
 	type: Boolean,
 	reflect: !0
-})], y.prototype, "selected", void 0), e([l({ type: String })], y.prototype, "imageUrl", void 0), e([l({ attribute: !1 })], y.prototype, "tooltipDetails", void 0), y = e([c("fellowship-gear-position")], y);
-var b = () => {
-	customElements.get("fellowship-gear-position") || customElements.define("fellowship-gear-position", y);
-}, x = a`
+})], b.prototype, "selected", void 0), e([l({ type: String })], b.prototype, "imageUrl", void 0), e([l({ attribute: !1 })], b.prototype, "tooltipDetails", void 0), b = e([c("fellowship-gear-position")], b);
+var x = () => {
+	customElements.get("fellowship-gear-position") || customElements.define("fellowship-gear-position", b);
+}, S = a`
   :host {
     display: block;
     min-width: 0;
@@ -431,23 +431,23 @@ var b = () => {
       grid-row: auto;
     }
   }
-`, S = class extends i {
+`, C = class extends i {
 	constructor(...e) {
 		super(...e), this.data = null, this.build = null, this.positionId = null, this.resolveAssetUrl = null, this._query = "", this.#g = (e) => {
 			this._query = e.currentTarget.value;
 		};
 	}
 	static {
-		this.styles = [n, x];
+		this.styles = [n, S];
 	}
 	render() {
 		if (!this.data || !this.build || !this.positionId) return o`<div class="empty">Select a gear position to begin.</div>`;
 		let e = this.data.positions.find(({ id: e }) => e === this.positionId), t = this.build.positions.find(({ positionId: e }) => e === this.positionId);
 		if (!e) return o`<div class="empty">This gear position is unavailable.</div>`;
-		let n = t?.item ?? null, r = n ? this.data.itemById.get(n.itemId) : null, i = n && r ? h(this.data, this.build, this.positionId, n.itemId) : null, a = g(this.data, this.build, this.positionId).filter((e) => {
-			let t = this._query.trim().toLocaleLowerCase();
-			return !t || (e.item.name ?? e.item.id).toLocaleLowerCase().includes(t);
-		});
+		let n = t?.item ?? null, r = n ? this.data.itemById.get(n.itemId) : null, i = n && r ? h(this.data, this.build, this.positionId, n.itemId) : null, a = this.data.heroById.get(this.build.heroId), s = this._query.trim().toLocaleLowerCase(), c = a ? g(this.data, this.build, this.positionId).map((e) => ({
+			item: e,
+			name: v(e, a)
+		})).filter(({ name: e }) => !s || e.toLocaleLowerCase().includes(s)) : [];
 		return o`
       <header class="workbench-header">
         <div>
@@ -467,20 +467,22 @@ var b = () => {
         />
       </label>
       <div class="item-list" aria-label=${`Valid items for ${e.label}`}>
-        ${a.length === 0 ? o`<p class="empty-search">No valid items match this search.</p>` : f(a, (e) => e.item.id, (e) => o`
+        ${c.length === 0 ? o`<p class="empty-search">No valid items match this search.</p>` : f(c, (e) => e.item.item.id, (e) => o`
                 <button
                   type="button"
                   class="item-choice"
-                  aria-pressed=${String(e.item.id === n?.itemId)}
-                  ?disabled=${e.validItemLevels.length === 0 || e.validRarities.length === 0}
-                  @click=${() => this.#l(e.item.id)}
+                  aria-pressed=${String(e.item.item.id === n?.itemId)}
+                  ?disabled=${e.item.validItemLevels.length === 0 || e.item.validRarities.length === 0}
+                  @click=${() => this.#l(e.item.item.id)}
                 >
                   <span class="choice-mark" aria-hidden="true"></span>
                   <span class="choice-image">
-                    ${this.#o(e.item.images, e.item.name ?? e.item.id)}
+                    ${this.#o(e.item.item.images, e.name)}
                   </span>
-                  <span>${e.item.name ?? e.item.id}</span>
-                  <small>${e.maxEquipped === 1 ? "Unique" : e.itemType}</small>
+                  <span>${e.name}</span>
+                  <small>
+                    ${e.item.maxEquipped === 1 ? "Unique" : e.item.itemType}
+                  </small>
                 </button>
               `)}
       </div>
@@ -768,10 +770,10 @@ var b = () => {
 	}
 	#g;
 };
-e([l({ attribute: !1 })], S.prototype, "data", void 0), e([l({ attribute: !1 })], S.prototype, "build", void 0), e([l({ type: String })], S.prototype, "positionId", void 0), e([l({ attribute: !1 })], S.prototype, "resolveAssetUrl", void 0), e([d()], S.prototype, "_query", void 0), S = e([c("fellowship-item-workbench")], S);
-var C = () => {
-	customElements.get("fellowship-item-workbench") || customElements.define("fellowship-item-workbench", S);
-}, w = a`
+e([l({ attribute: !1 })], C.prototype, "data", void 0), e([l({ attribute: !1 })], C.prototype, "build", void 0), e([l({ type: String })], C.prototype, "positionId", void 0), e([l({ attribute: !1 })], C.prototype, "resolveAssetUrl", void 0), e([d()], C.prototype, "_query", void 0), C = e([c("fellowship-item-workbench")], C);
+var w = () => {
+	customElements.get("fellowship-item-workbench") || customElements.define("fellowship-item-workbench", C);
+}, T = a`
   :host {
     display: block;
     min-width: 0;
@@ -1231,7 +1233,7 @@ var C = () => {
       animation-iteration-count: 1 !important;
     }
   }
-`, T = [
+`, E = [
 	"head",
 	"shoulders",
 	"chest",
@@ -1239,7 +1241,7 @@ var C = () => {
 	"waist",
 	"ring-1",
 	"trinket-1"
-], E = [
+], D = [
 	"necklace",
 	"back",
 	"wrists",
@@ -1247,17 +1249,17 @@ var C = () => {
 	"ring-2",
 	"trinket-2",
 	"weapon"
-], D = "button:not([disabled]), input:not([disabled]), select:not([disabled]), [href], [tabindex]:not([tabindex=\"-1\"])", O = (e) => {
+], O = "button:not([disabled]), input:not([disabled]), select:not([disabled]), [href], [tabindex]:not([tabindex=\"-1\"])", k = (e) => {
 	let t = [];
-	for (let n of e.children) n instanceof HTMLElement && n.matches(D) && t.push(n), n.shadowRoot && t.push(...O(n.shadowRoot)), t.push(...O(n));
+	for (let n of e.children) n instanceof HTMLElement && n.matches(O) && t.push(n), n.shadowRoot && t.push(...k(n.shadowRoot)), t.push(...k(n));
 	return t;
-}, k = (e) => {
+}, A = (e) => {
 	let t = e.activeElement;
 	for (; t?.shadowRoot?.activeElement;) t = t.shadowRoot.activeElement;
 	return t;
 };
-b(), C();
-var A = class extends i {
+x(), w();
+var j = class extends i {
 	constructor(...e) {
 		super(...e), this.data = null, this.build = null, this.loading = !1, this.error = null, this.resolveAssetUrl = null, this._selectedPositionId = null, this._tab = "gear", this._sheetOpen = !1, this._compact = !1, this._announcement = "", this._calculation = null, this.#e = null, this.#t = null, this.#n = null, this.#r = null, this.#i = null, this.#a = !1, this.#o = /* @__PURE__ */ new Set(), this.#p = (e) => {
 			e.stopPropagation(), this._selectedPositionId = e.detail.positionId, this.#i = e.detail.trigger, this._compact && (this._sheetOpen = !0, this.#r !== null && window.clearTimeout(this.#r), this.#r = window.setTimeout(() => {
@@ -1271,7 +1273,7 @@ var A = class extends i {
 					...t,
 					item: e.detail.item
 				} : t)
-			}, n = _(this.data, t), r = v(this.data, n.build);
+			}, n = _(this.data, t), r = y(this.data, n.build);
 			if (!r.valid || !r.build) {
 				let e = r.issues.find(({ severity: e }) => e === "error");
 				this.#_({
@@ -1298,7 +1300,7 @@ var A = class extends i {
 				return;
 			}
 			if (e.key !== "Tab" || !this._workbenchPanel) return;
-			let t = O(this._workbenchPanel), n = t[0], r = t.at(-1), i = k(this.shadowRoot);
+			let t = k(this._workbenchPanel), n = t[0], r = t.at(-1), i = A(this.shadowRoot);
 			if (!n || !r) {
 				e.preventDefault();
 				return;
@@ -1320,7 +1322,7 @@ var A = class extends i {
 		};
 	}
 	static {
-		this.styles = [n, w];
+		this.styles = [n, T];
 	}
 	#e;
 	#t;
@@ -1419,11 +1421,11 @@ var A = class extends i {
           >
             <div class="slot-grid">
               <div class="slot-rail left-rail">
-                ${this.#c(this._compact ? this.data.positions.map(({ id: e }) => e) : T)}
+                ${this.#c(this._compact ? this.data.positions.map(({ id: e }) => e) : E)}
               </div>
               ${this._compact ? s : o`
                     <div class="slot-rail right-rail">
-                      ${this.#c(E)}
+                      ${this.#c(D)}
                     </div>
                   `}
             </div>
@@ -1468,20 +1470,23 @@ var A = class extends i {
     `;
 	}
 	#c(e) {
-		return !this.data || !this.build ? o`` : o`
+		if (!this.data || !this.build) return o``;
+		let t = this.data.heroById.get(this.build.heroId) ?? null;
+		return o`
       ${f(e, (e) => e, (e) => {
-			let t = this.data?.positions.find(({ id: t }) => t === e) ?? null, n = this.build?.positions.find((t) => t.positionId === e) ?? null, r = n?.item ? this.data?.itemById.get(n.item.itemId) ?? null : null, i = r ? p(r.item.images, {
+			let n = this.data?.positions.find(({ id: t }) => t === e) ?? null, r = this.build?.positions.find((t) => t.positionId === e) ?? null, i = r?.item ? this.data?.itemById.get(r.item.itemId) ?? null : null, a = i ? p(i.item.images, {
 				size: "200",
 				type: "hero-item"
 			}) : null;
 			return o`
             <fellowship-gear-position
-              .position=${t}
-              .item=${r}
-              .itemBuild=${n?.item ?? null}
+              .position=${n}
+              .item=${i}
+              .itemBuild=${r?.item ?? null}
+              .itemName=${i && t ? v(i, t) : null}
               .selected=${e === this._selectedPositionId}
-              .imageUrl=${i ? this.#S(i) : null}
-              .tooltipDetails=${this.#u(e, n?.item ?? null)}
+              .imageUrl=${a ? this.#S(a) : null}
+              .tooltipDetails=${this.#u(e, r?.item ?? null)}
               @fellowship-gear-position-select=${this.#p}
             ></fellowship-gear-position>
           `;
@@ -1685,12 +1690,12 @@ var A = class extends i {
 	}
 	#C;
 };
-e([l({ attribute: !1 })], A.prototype, "data", void 0), e([l({ attribute: !1 })], A.prototype, "build", void 0), e([l({
+e([l({ attribute: !1 })], j.prototype, "data", void 0), e([l({ attribute: !1 })], j.prototype, "build", void 0), e([l({
 	type: Boolean,
 	reflect: !0
-})], A.prototype, "loading", void 0), e([l({ attribute: !1 })], A.prototype, "error", void 0), e([l({ attribute: !1 })], A.prototype, "resolveAssetUrl", void 0), e([d()], A.prototype, "_selectedPositionId", void 0), e([d()], A.prototype, "_tab", void 0), e([d()], A.prototype, "_sheetOpen", void 0), e([d()], A.prototype, "_compact", void 0), e([d()], A.prototype, "_announcement", void 0), e([d()], A.prototype, "_calculation", void 0), e([u(".workbench-panel")], A.prototype, "_workbenchPanel", void 0), A = e([c("fellowship-gear-planner")], A);
-var j = () => {
-	customElements.get("fellowship-gear-planner") || customElements.define("fellowship-gear-planner", A);
+})], j.prototype, "loading", void 0), e([l({ attribute: !1 })], j.prototype, "error", void 0), e([l({ attribute: !1 })], j.prototype, "resolveAssetUrl", void 0), e([d()], j.prototype, "_selectedPositionId", void 0), e([d()], j.prototype, "_tab", void 0), e([d()], j.prototype, "_sheetOpen", void 0), e([d()], j.prototype, "_compact", void 0), e([d()], j.prototype, "_announcement", void 0), e([d()], j.prototype, "_calculation", void 0), e([u(".workbench-panel")], j.prototype, "_workbenchPanel", void 0), j = e([c("fellowship-gear-planner")], j);
+var M = () => {
+	customElements.get("fellowship-gear-planner") || customElements.define("fellowship-gear-planner", j);
 };
 //#endregion
-export { j as n, A as t };
+export { M as n, j as t };

package/dist/gear-planner/gear-position.d.ts

@@ -6,6 +6,7 @@ export declare class FellowshipGearPositionElement extends LitElement {
     position: GearPlannerPosition | null;
     item: GearPlannerItem | null;
     itemBuild: GearPlannerItemBuild | null;
+    itemName: string | null;
     selected: boolean;
     imageUrl: string | null;
     tooltipDetails: readonly string[];

package/dist/gear-planner.js

@@ -1,4 +1,4 @@
-import { n as e, t } from "./chunks/gear-planner-Bgt77Ovf.js";
+import { n as e, t } from "./chunks/gear-planner-uQOpm4QI.js";
 //#region src/gear-planner/index.ts
 e();
 //#endregion

package/dist/index.js

@@ -7,7 +7,7 @@ import "./dungeon-cast-browser.js";
 import { n as C, o as w, r as T, s as E, t as D } from "./chunks/tooltip-C3SSJw-t.js";
 import "./talent-calculator.js";
 import "./tooltip.js";
-import { n as O, t as k } from "./chunks/gear-planner-Bgt77Ovf.js";
+import { n as O, t as k } from "./chunks/gear-planner-uQOpm4QI.js";
 import "./gear-planner.js";
 import { createPackageFellowshipDataClient as A } from "@crockery/fellowship-data/client";
 export { e as FellowshipDataError, d as FellowshipDungeonCastBrowserElement, o as FellowshipDungeonMapElement, k as FellowshipGearPlannerElement, x as FellowshipTalentCalculatorElement, D as FellowshipTooltipElement, h as MAX_TALENT_POINTS, a as ViewportController, T as calculateTooltipPosition, f as canSelectTalent, u as castIdentityKey, c as createDungeonCastBrowserModel, n as createDungeonMapRenderModel, s as createPackageFellowshipCastDataSource, A as createPackageFellowshipDataClient, i as createPackageFellowshipDataSource, m as createPackageFellowshipTalentDataSource, g as createTalentCalculatorRenderModel, v as createTalentCalculatorSelectionState, l as defineFellowshipDungeonCastBrowser, r as defineFellowshipDungeonMap, O as defineFellowshipGearPlanner, _ as defineFellowshipTalentCalculator, C as defineFellowshipTooltip, t as humanizeMapLabel, b as normalizeSelectedTalentIds, p as normalizeTalentPoints, w as resolveFellowshipRichText, E as stripFellowshipRichText, S as talentRowLabel, y as talentSlotName };

package/dist/react/gear-planner.js

@@ -1,4 +1,4 @@
-import { n as e, t } from "../chunks/gear-planner-Bgt77Ovf.js";
+import { n as e, t } from "../chunks/gear-planner-uQOpm4QI.js";
 import { createComponent as n } from "@lit/react";
 import r, { forwardRef as i } from "react";
 import { jsx as a } from "react/jsx-runtime";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crockery/fellowship-components",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Lit web components for rendering Fellowship game data.",
   "repository": {
     "type": "git",
@@ -112,7 +112,7 @@
   "dependencies": {
     "@lit/react": "^1.0.8",
     "lit": "^3.3.3",
-    "@crockery/fellowship-data": "^3.0.0"
+    "@crockery/fellowship-data": "^3.1.0"
   },
   "peerDependencies": {
     "react": ">=18 <20",
@@ -155,8 +155,6 @@
     "test": "pnpm test:unit && pnpm test:browser",
     "test:unit": "vitest run --project unit",
     "test:browser": "vitest run --project browser",
-    "test:browser:smoke": "FELLOWSHIP_TEST_BROWSERS=smoke vitest run --project browser -t '\\[smoke\\]'",
-    "test:browser:all": "FELLOWSHIP_TEST_BROWSERS=all vitest run --project browser",
     "ladle": "ladle serve",
     "ladle:build": "ladle build",
     "package:lint": "publint --strict --pack npm && attw --pack . --profile esm-only",