The prompt

Build an inline workspace-slug editor with Tailwind CSS inside a compact settings card. The resting state shows the current public URL, a green Available badge, and an Edit button. The editing state replaces it with a fixed domain prefix, a focused text input, a live character counter, helper text describing the allowed format, and Cancel / Save buttons. Add a small preview line beneath the control so people can see the final URL before saving. Then add JavaScript that opens the editor, normalizes pasted or typed text to lowercase kebab-case, validates a 3–32 character slug, rejects a short list of reserved words, updates the preview and character counter live, supports Escape to cancel and Enter to save, preserves the original value on cancel, and simulates an asynchronous save with a Saving… state before returning to the read-only view.

Paste it into Claude, Cursor, v0 or any AI coding tool. Prefer the finished markup? Open the Tailwind source.