Release Healer Man 0.1.29

src/ui/UiLayoutEditor.tsx

@@ -8,6 +8,8 @@ import {
   BAR_COLUMNS, HUD_ELEMENTS, actionKeyForEvent, bindDesktopSlot, defaultUiLayout,
   exportUiPreferences, importUiPreferences, type HudElementId, type UiDevice,
 } from "../game/uiLayout";
+import { INPUT_ACTION_BY_ID, conflictingInputActions } from "../input/keybinds";
+import { profileInputBindings } from "../game/keybindPreferences";
 import { useUiLayoutStore } from "../game/uiLayoutStore";
 
 export function UiLayoutEditor() {
@@ -52,6 +54,12 @@ export function UiLayoutEditor() {
       const key = event.code === "Backspace" || event.code === "Delete" ? null : actionKeyForEvent(event);
       if (!key && event.code !== "Backspace" && event.code !== "Delete") return;
       const { bar, slot: button } = state.selectedButton;
+      const bindings = profileInputBindings(state.preferences, "pc");
+      const conflicts = conflictingInputActions(bindings, "pc", `bar:${bar}:${button}`, key).filter((id) => !id.startsWith("bar:"));
+      if (conflicts.length) {
+        setMessage(`That key belongs to ${conflicts.map((id) => INPUT_ACTION_BY_ID[id].label).join(", ")}. Change it in Options → Keybinds first. Your existing bindings were kept.`);
+        useUiLayoutStore.setState({ selectedButton: null }); return;
+      }
       state.updateDraft((draft) => bindDesktopSlot(draft, bar, button, key));
       setMessage(key ? `Bound bar ${bar + 1}, button ${button + 1}. Any previous assignment was cleared.` : "Keybind cleared.");
       useUiLayoutStore.setState({ selectedButton: null });
@@ -118,7 +126,7 @@ export function UiLayoutEditor() {
           <button type="button" onClick={() => attempt(() => { setPendingImport(importUiPreferences(transferText)); setTransferText(null); })}>Review import</button>
           <button type="button" onClick={() => setTransferText(null)}>Close text</button>
         </div>}
-        {pendingImport && <div className="ui-layout-editor__import"><p>Replace all six slots and both saved layouts with this file?</p><button type="button" onClick={() => attempt(() => {
+        {pendingImport && <div className="ui-layout-editor__import"><p>Replace all six slots, both saved layouts, and profile keybinds with this file?</p><button type="button" onClick={() => attempt(() => {
           ui.persist(pendingImport); useUiLayoutStore.setState({ draft: pendingImport.current[ui.device], selectedButton: null }); setPendingImport(null); setMessage("Imported all six slots.");
         })}>Replace with imported UI</button><button type="button" onClick={() => setPendingImport(null)}>Keep existing UI</button></div>}
         <small>{session?.accessToken ? "Templates save to your account and upload with cloud saves. Sign in on another device to load them." : "Offline profile: saved on this device. Use export/import to transfer your UI."}</small>
@@ -144,7 +152,7 @@ export function UiLayoutEditor() {
             <label>Columns<select aria-label={`Bar ${index + 1} columns`} value={bar.columns} onChange={(event) => ui.updateDraft((layout) => ({ ...layout, bars: layout.bars.map((bar, b) => b === index ? { ...bar, columns: Number(event.target.value) } : bar) }))}>{BAR_COLUMNS.map((cols) => <option key={cols}>{cols}</option>)}</select></label>
           </div>)}
           <button type="button" aria-pressed={ui.mode === "bindings"} onClick={() => useUiLayoutStore.setState({ mode: ui.mode === "bindings" ? "layout" : "bindings", selectedButton: null })}>{ui.mode === "bindings" ? "Finish keybind editing" : "Keybind edit mode"}</button>
-          <p>{ui.mode === "bindings" ? "Click a bar button, then press a key or modifier + key. Backspace/Delete clears it; Escape cancels selection. Bound keys take priority over game shortcuts." : "Click a bar button to assign an ability."}</p>
+          <p>{ui.mode === "bindings" ? "Click a bar button, then press a key or modifier + key. Backspace/Delete clears it; Escape cancels selection. Keys already used by game controls are protected. Review all bindings in Options → Keybinds." : "Click a bar button to assign an ability."}</p>
           {selected && <div className="ui-layout-editor__assignment"><strong>Bar {selected.bar + 1} · Button {selected.slot + 1}{ui.mode === "bindings" ? " · Press a key…" : ""}</strong>
             <button type="button" onClick={() => setAbility(null)}>Clear ability</button>
             <label>Find ability<input value={search} onChange={(event) => setSearch(event.target.value)} /></label>