devx-web-widget 1.0.0 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/README.md +30 -91
  2. package/dist/feedback-widget.js +309 -0
  3. package/dist/index.d.ts +85 -0
  4. package/dist/index.d.ts.map +1 -0
  5. package/dist/index.js +737 -0
  6. package/dist/index.js.map +1 -0
  7. package/dist/index.min.js +6 -0
  8. package/package.json +1 -1
  9. package/src/feedback-widget.js +0 -496
package/dist/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
package/dist/index.min.js ADDED
@@ -0,0 +1,6 @@
1
+ /*!
2
+ * Feedback Capture Widget - TypeScript Implementation
3
+ * Class-based, configurable widget with style isolation via Shadow DOM
4
+ * Supports multiple widget types (default, chatbot) and positioning (left, right)
5
+ */
6
+ const DEFAULT_CONFIG={buttonLabel:"Feedback",backgroundColor:"#111827",textColor:"#ffffff",accentColor:"#2F6FED",font:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',position:"right",widgetType:"default"};class FeedbackWidget{config;host;root;elements;state;showItemInForm;selectedSelector;selectedEl;hoverRafId;hostId;apiKey;endPoint;constructor(e=null,t={}){this.config={...DEFAULT_CONFIG,...t},this.hostId=`feedback-widget-host-${Math.random().toString(36).substr(2,9)}`,this.state="idle",this.showItemInForm=!0,this.selectedSelector=null,this.selectedEl=null,this.hoverRafId=null,this.apiKey=e||"",this.endPoint="https://devx.today/v1/widget/ingest",this.initialize()}initialize(){this.createHostAndShadow(),this.injectStyles(),this.createMarkup(),this.cacheElements(),this.attachEventListeners()}createHostAndShadow(){this.host=document.createElement("div"),this.host.id=this.hostId,document.documentElement.appendChild(this.host),this.root=this.host.attachShadow({mode:"open"})}injectStyles(){const e=this.generateCSS(),t=document.createElement("style");t.textContent=e,this.root.appendChild(t)}generateCSS(){const{backgroundColor:e,textColor:t,accentColor:n,font:i,position:o}=this.config;return`\n :host { all: initial; }\n * { box-sizing: border-box; font-family: ${i}; }\n \n .fbw-tab {\n position: fixed;\n top: 50%;\n ${"right"===o?"right":"left"}: 0;\n transform: ${"right"===o?"translateY(-50%) rotate(180deg)":"translateY(-50%)"};\n background: ${e};\n color: ${t};\n writing-mode: vertical-rl;\n text-orientation: mixed;\n padding: 14px 9px;\n border-radius: ${"right"===o?"8px 0 0 8px":"0 8px 8px 0"};\n cursor: pointer;\n font-size: 13px;\n font-weight: 600;\n letter-spacing: 0.03em;\n box-shadow: ${"right"===o?"-2px":"2px"} 0 10px rgba(0,0,0,0.18);\n z-index: 2147483000;\n border: none;\n user-select: none;\n transition: padding 0.12s ease, background 0.12s ease;\n }\n \n .fbw-tab:hover { padding-right: 13px; background: #1f2937; }\n .fbw-tab:focus-visible { outline: 2px solid ${n}; outline-offset: 2px; }\n \n .fbw-menu {\n position: fixed;\n top: 50%;\n right: ${"right"===o?"46px":"auto"};\n left: ${"left"===o?"46px":"auto"};\n transform: translateY(-50%);\n background: #fff;\n border-radius: 10px;\n box-shadow: 0 8px 30px rgba(0,0,0,0.22);\n padding: 6px;\n min-width: 220px;\n z-index: 2147483001;\n display: none;\n border: 1px solid #e5e7eb;\n }\n \n .fbw-menu.fbw-open { display: block; }\n \n .fbw-menu button {\n display: block;\n width: 100%;\n text-align: left;\n background: none;\n border: none;\n padding: 10px 12px;\n font-size: 13.5px;\n color: #111827;\n border-radius: 6px;\n cursor: pointer;\n }\n \n .fbw-menu button:hover { background: #f3f4f6; }\n .fbw-menu button small { display: block; color: #6b7280; font-weight: 400; margin-top: 2px; font-size: 11.5px; }\n \n .fbw-banner {\n position: fixed;\n top: 18px;\n left: 50%;\n transform: translateX(-50%);\n background: ${e};\n color: ${t};\n padding: 10px 10px 10px 16px;\n border-radius: 999px;\n font-size: 13px;\n display: none;\n align-items: center;\n gap: 10px;\n z-index: 2147483002;\n box-shadow: 0 8px 24px rgba(0,0,0,0.25);\n }\n \n .fbw-banner.fbw-open { display: flex; }\n \n .fbw-banner button {\n background: rgba(255,255,255,0.12);\n color: ${t};\n border: none;\n padding: 6px 12px;\n border-radius: 999px;\n font-size: 12px;\n cursor: pointer;\n }\n \n .fbw-banner button:hover { background: rgba(255,255,255,0.22); }\n \n .fbw-highlight {\n position: fixed;\n pointer-events: none;\n border: 2px solid ${n};\n box-shadow: 0 0 0 4px ${this.hexToRgba(n,.22)};\n border-radius: 4px;\n z-index: 2147483000;\n display: none;\n transition: top 0.06s ease, left 0.06s ease, width 0.06s ease, height 0.06s ease;\n }\n \n .fbw-overlay {\n position: fixed;\n inset: 0;\n background: rgba(17,24,39,0.5);\n display: none;\n align-items: center;\n justify-content: center;\n z-index: 2147483003;\n }\n \n .fbw-overlay.fbw-open { display: flex; }\n \n .fbw-modal {\n background: #fff;\n border-radius: 14px;\n width: 420px;\n max-width: 92vw;\n max-height: 88vh;\n overflow-y: auto;\n padding: 22px;\n box-shadow: 0 20px 60px rgba(0,0,0,0.35);\n }\n \n .fbw-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }\n .fbw-modal-head h2 { font-size: 16px; margin: 0; color: #111827; font-weight: 700; }\n .fbw-close { background: none; border: none; font-size: 18px; color: #6b7280; cursor: pointer; line-height: 1; padding: 4px; }\n .fbw-close:hover { color: #111827; }\n \n .fbw-field { margin-bottom: 14px; }\n .fbw-field label { display: block; font-size: 12.5px; font-weight: 600; color: #374151; margin-bottom: 5px; }\n \n .fbw-item-box {\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 11.5px;\n color: #1f2937;\n background: #f3f4f6;\n border: 1px solid #e5e7eb;\n border-radius: 6px;\n padding: 8px 10px;\n word-break: break-all;\n max-height: 60px;\n overflow-y: auto;\n }\n \n .fbw-field textarea, .fbw-field input[type="email"], .fbw-field input[type="text"] {\n width: 100%;\n border: 1px solid #d1d5db;\n border-radius: 8px;\n padding: 9px 10px;\n font-size: 13.5px;\n color: #111827;\n resize: vertical;\n }\n \n .fbw-field textarea:focus, .fbw-field input:focus {\n outline: none;\n border-color: ${n};\n box-shadow: 0 0 0 3px ${this.hexToRgba(n,.15)};\n }\n \n .fbw-error { color: #dc2626; font-size: 12px; margin: -6px 0 12px; display: none; }\n .fbw-error.fbw-show { display: block; }\n \n .fbw-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }\n \n .fbw-btn {\n border: none;\n border-radius: 8px;\n padding: 9px 16px;\n font-size: 13.5px;\n font-weight: 600;\n cursor: pointer;\n }\n \n .fbw-btn-primary { background: ${n}; color: #fff; }\n .fbw-btn-primary:hover { filter: brightness(1.08); }\n .fbw-btn-ghost { background: none; color: #4b5563; }\n .fbw-btn-ghost:hover { background: #f3f4f6; }\n \n .fbw-toast {\n position: fixed;\n bottom: 22px;\n right: 22px;\n background: ${e};\n color: ${t};\n padding: 11px 16px;\n border-radius: 10px;\n font-size: 13px;\n z-index: 2147483004;\n box-shadow: 0 8px 24px rgba(0,0,0,0.3);\n opacity: 0;\n transform: translateY(6px);\n transition: opacity 0.18s ease, transform 0.18s ease;\n pointer-events: none;\n }\n \n .fbw-toast.fbw-show { opacity: 1; transform: translateY(0); }\n .fbw-hidden { display: none !important; }\n `}hexToRgba(e,t){const n=e.replace("#",""),i=3===n.length?n.split("").map(e=>e+e).join(""):n;return`rgba(${parseInt(i.substring(0,2),16)},${parseInt(i.substring(2,4),16)},${parseInt(i.substring(4,6),16)},${t})`}createMarkup(){const e=document.createElement("div");e.innerHTML=this.getMarkup(),this.root.appendChild(e)}getMarkup(){const{buttonLabel:e,widgetType:t}=this.config;return"chatbot"===t?this.getChatbotMarkup(e):this.getDefaultMarkup(e)}getDefaultMarkup(e){return`\n <button class="fbw-tab" type="button" aria-haspopup="true" aria-expanded="false">${this.escapeHtml(e)}</button>\n <div class="fbw-menu" role="menu">\n <button type="button" data-action="pick-visible" role="menuitem">\n Feedback on this page<small>Select any element you have feedback on</small>\n </button>\n <button type="button" data-action="pick-hidden" role="menuitem">\n Quick feedback<small>General feedback on us</small>\n </button>\n </div>\n <div class="fbw-banner">\n <span>Click an element to select it &middot; Esc to cancel</span>\n <button type="button" data-action="cancel-pick">Cancel</button>\n </div>\n <div class="fbw-highlight"></div>\n <div class="fbw-overlay">\n <div class="fbw-modal" role="dialog" aria-modal="true" aria-labelledby="fbw-modal-title">\n <div class="fbw-modal-head">\n <h2 id="fbw-modal-title">Share feedback</h2>\n <button class="fbw-close" type="button" data-action="close-modal" aria-label="Close">&times;</button>\n </div>\n <form data-role="form">\n <div class="fbw-field" data-role="item-field">\n <label>Selected element</label>\n <div class="fbw-item-box" data-role="item-box"></div>\n </div>\n <div class="fbw-field">\n <label for="fbw-title">Title</label>\n <input id="fbw-title" data-role="title" type="text" placeholder="Brief summary of your feedback" required />\n </div>\n <div class="fbw-field">\n <label for="fbw-feedback">What's going on?</label>\n <textarea id="fbw-feedback" data-role="feedback" rows="4" placeholder="Tell us what you noticed..."></textarea>\n </div>\n <div class="fbw-field">\n <label for="fbw-email">Email</label>\n <input id="fbw-email" data-role="email" type="email" placeholder="you@example.com" required />\n </div>\n <div class="fbw-error" data-role="error"></div>\n <div class="fbw-actions">\n <button type="button" class="fbw-btn fbw-btn-ghost" data-action="close-modal">Cancel</button>\n <button type="submit" class="fbw-btn fbw-btn-primary">Submit</button>\n </div>\n </form>\n </div>\n </div>\n <div class="fbw-toast" data-role="toast"></div>\n `}getChatbotMarkup(e){return`\n <button class="fbw-tab" type="button" aria-haspopup="true" aria-expanded="false">${this.escapeHtml(e)}</button>\n <div class="fbw-menu" role="menu">\n <button type="button" data-action="pick-visible" role="menuitem">\n Feedback on this page<small>Select any element you have feedback on</small>\n </button>\n <button type="button" data-action="pick-hidden" role="menuitem">\n Quick feedback<small>General feedback on us</small>\n </button>\n </div>\n <div class="fbw-banner">\n <span>Click an element to select it &middot; Esc to cancel</span>\n <button type="button" data-action="cancel-pick">Cancel</button>\n </div>\n <div class="fbw-highlight"></div>\n <div class="fbw-overlay">\n <div class="fbw-modal" role="dialog" aria-modal="true" aria-labelledby="fbw-modal-title">\n <div class="fbw-modal-head">\n <h2 id="fbw-modal-title">Share feedback</h2>\n <button class="fbw-close" type="button" data-action="close-modal" aria-label="Close">&times;</button>\n </div>\n <form data-role="form">\n <div class="fbw-field" data-role="item-field">\n <label>Selected element</label>\n <div class="fbw-item-box" data-role="item-box"></div>\n </div>\n <div class="fbw-field">\n <label for="fbw-title">Title</label>\n <input id="fbw-title" data-role="title" type="text" placeholder="Brief summary of your feedback" required />\n </div>\n <div class="fbw-field">\n <label for="fbw-feedback">What's going on?</label>\n <textarea id="fbw-feedback" data-role="feedback" rows="4" placeholder="Tell us what you noticed..."></textarea>\n </div>\n <div class="fbw-field">\n <label for="fbw-email">Email</label>\n <input id="fbw-email" data-role="email" type="email" placeholder="you@example.com" required />\n </div>\n <div class="fbw-error" data-role="error"></div>\n <div class="fbw-actions">\n <button type="button" class="fbw-btn fbw-btn-ghost" data-action="close-modal">Cancel</button>\n <button type="submit" class="fbw-btn fbw-btn-primary">Submit</button>\n </div>\n </form>\n </div>\n </div>\n <div class="fbw-toast" data-role="toast"></div>\n `}escapeHtml(e){const t=document.createElement("div");return t.textContent=e,t.innerHTML}cacheElements(){this.elements={tab:this.root.querySelector(".fbw-tab"),menu:this.root.querySelector(".fbw-menu"),banner:this.root.querySelector(".fbw-banner"),highlight:this.root.querySelector(".fbw-highlight"),overlay:this.root.querySelector(".fbw-overlay"),modal:this.root.querySelector(".fbw-modal"),form:this.root.querySelector('[data-role="form"]'),itemField:this.root.querySelector('[data-role="item-field"]'),itemBox:this.root.querySelector('[data-role="item-box"]'),title:this.root.querySelector('[data-role="title"]'),feedback:this.root.querySelector('[data-role="feedback"]'),email:this.root.querySelector('[data-role="email"]'),error:this.root.querySelector('[data-role="error"]'),toast:this.root.querySelector('[data-role="toast"]')}}attachEventListeners(){this.elements.tab.addEventListener("click",()=>this.onTabClick()),this.elements.menu.addEventListener("click",e=>this.onMenuClick(e)),this.elements.banner.addEventListener("click",e=>this.onBannerClick(e)),this.elements.overlay.addEventListener("click",e=>this.onOverlayClick(e)),this.elements.form.addEventListener("submit",e=>this.onSubmit(e))}onTabClick(){"menu"===this.state?this.closeMenu():this.openMenu()}openMenu(){this.state="menu",this.elements.menu.classList.add("fbw-open"),this.elements.tab.setAttribute("aria-expanded","true"),document.addEventListener("click",this.onOutsideMenuClick,!0)}closeMenu(){"menu"===this.state&&(this.state="idle"),this.elements.menu.classList.remove("fbw-open"),this.elements.tab.setAttribute("aria-expanded","false"),document.removeEventListener("click",this.onOutsideMenuClick,!0)}onOutsideMenuClick=e=>{this.isInsideWidget(e.target)||this.closeMenu()};onMenuClick(e){const t=e.target.closest("button[data-action]");if(!t)return;const n=t.getAttribute("data-action");"pick-visible"===n&&this.startPicking(!0),"pick-hidden"===n&&(this.showItemInForm=!1,this.closeMenu(),this.openModal())}startPicking(e){this.showItemInForm=e,this.closeMenu(),this.state="picking",this.elements.banner.classList.add("fbw-open"),document.addEventListener("mousemove",this.onHoverMove,!0),document.addEventListener("click",this.onDocumentClickCapture,!0),document.addEventListener("keydown",this.onKeyDownCapture,!0),document.addEventListener("scroll",this.onScrollOrResize,!0),window.addEventListener("resize",this.onScrollOrResize,!0)}stopPicking(){this.elements.banner.classList.remove("fbw-open"),document.removeEventListener("mousemove",this.onHoverMove,!0),document.removeEventListener("scroll",this.onScrollOrResize,!0),window.removeEventListener("resize",this.onScrollOrResize,!0)}onBannerClick(e){e.target.closest('[data-action="cancel-pick"]')&&this.cancelAll()}onHoverMove=e=>{this.isInsideWidget(e.target)||(this.hoverRafId&&cancelAnimationFrame(this.hoverRafId),this.hoverRafId=requestAnimationFrame(()=>{this.positionHighlight(e.target)}))};positionHighlight(e){const t=e.getBoundingClientRect();this.elements.highlight.style.display="block",this.elements.highlight.style.top=`${t.top}px`,this.elements.highlight.style.left=`${t.left}px`,this.elements.highlight.style.width=`${t.width}px`,this.elements.highlight.style.height=`${t.height}px`}onScrollOrResize=()=>{this.selectedEl&&"review"===this.state&&this.positionHighlight(this.selectedEl)};onDocumentClickCapture=e=>{this.isInsideWidget(e.target)||(e.preventDefault(),e.stopPropagation(),"function"==typeof e.stopImmediatePropagation&&e.stopImmediatePropagation(),"picking"===this.state&&this.finalizeSelection(e.target))};onKeyDownCapture=e=>{"Escape"===e.key&&(e.preventDefault(),this.cancelAll())};finalizeSelection(e){this.selectedEl=e,this.selectedSelector=this.getUniqueSelector(e),this.stopPicking(),this.positionHighlight(e),this.openModal()}getUniqueSelector(e){if(!(e instanceof Element))return null;if(e.id){const t=`#${this.cssEscape(e.id)}`;if(1===this.safeQueryCount(t))return t}const t=[];let n=e;for(;n&&1===n.nodeType&&n!==document.documentElement;){let e=n.tagName.toLowerCase();if(n.id){e=`#${this.cssEscape(n.id)}`,t.unshift(e);break}const i=Array.from(n.classList).filter(e=>!!e);i.length&&(e+="."+i.map(this.cssEscape).join("."));const o=n.parentElement;if(o){const t=Array.from(o.children).filter(e=>e.tagName===n.tagName);if(t.length>1){e+=`:nth-of-type(${t.indexOf(n)+1})`}}t.unshift(e);const s=t.join(" > ");if(1===this.safeQueryCount(s))return s;n=o||null}return t.join(" > ")}cssEscape(e){return window.CSS&&window.CSS.escape?window.CSS.escape(e):String(e).replace(/([ #.;?%&,.+*~':"!^$[\]()=>|/])/g,"\\$1")}safeQueryCount(e){try{return document.querySelectorAll(e).length}catch(e){return-1}}openModal(){this.state="review",this.elements.error.classList.remove("fbw-show"),this.elements.form.reset(),this.showItemInForm?(this.elements.itemField.classList.remove("fbw-hidden"),this.elements.itemBox.textContent=this.selectedSelector||"(none)"):this.elements.itemField.classList.add("fbw-hidden"),this.elements.overlay.classList.add("fbw-open"),setTimeout(()=>this.elements.feedback.focus(),30)}closeModal(){this.elements.overlay.classList.remove("fbw-open")}cancelAll(){this.stopPicking(),this.closeModal(),this.elements.highlight.style.display="none",document.removeEventListener("click",this.onDocumentClickCapture,!0),document.removeEventListener("keydown",this.onKeyDownCapture,!0),this.selectedEl=null,this.selectedSelector=null,this.state="idle"}onOverlayClick(e){e.target.closest('[data-action="close-modal"]')&&this.cancelAll()}onSubmit(e){e.preventDefault();const t=this.elements.title.value.trim(),n=this.elements.feedback.value.trim(),i=this.elements.email.value.trim(),o=/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(i);if(!t||!o)return this.elements.error.textContent=t?"Please enter a valid email address.":"Please add a title before submitting.",void this.elements.error.classList.add("fbw-show");const s={optionType:this.showItemInForm?"page_item_visible":"page_item_hidden",elementSelector:this.selectedSelector,pageUrl:window.location.href,pageTitle:document.title,title:t,feedback:n,email:i,submittedAt:(new Date).toISOString()};this.submitFeedback(s)}prepareMessageBody(e){const t=e.email;return{title:e.title,body:`${e.feedback||"(No additional details provided)"}\n\nPage: ${e.pageTitle}\nURL: ${e.pageUrl}\nSelector: ${e.elementSelector}\nOption: ${e.optionType}\nSubmitted: ${e.submittedAt}`,user_handle:t}}submitFeedback(e){if(window.dispatchEvent(new CustomEvent("feedbackwidget:submit",{detail:e})),this.apiKey){const t=this.prepareMessageBody(e);fetch(this.endPoint,{method:"POST",headers:{"Content-Type":"application/json",Authorization:`Bearer ${this.apiKey}`},body:JSON.stringify(t)}).catch(()=>{})}this.cancelAll(),this.showToast("Thanks for the feedback!")}showToast(e){this.elements.toast.textContent=e,this.elements.toast.classList.add("fbw-show"),setTimeout(()=>this.elements.toast.classList.remove("fbw-show"),2400)}isInsideWidget(e){return e===this.host||this.host.contains(e)}open(e="visible"){this.startPicking("visible"===e)}close(){this.cancelAll()}destroy(){this.cancelAll(),this.host.remove()}}export{FeedbackWidget};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "devx-web-widget",
3
- "version": "1.0.0",
3
+ "version": "1.1.1",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "keywords": [],
package/src/feedback-widget.js DELETED
@@ -1,496 +0,0 @@
1
- /*!
2
- * Feedback Capture Widget
3
- * Drop-in, dependency-free widget: a side tab that opens two feedback flows.
4
- * 1. "Feedback on this page" -> pick an element, item selector shown in form
5
- * 2. "Quick feedback" -> pick an element, item selector hidden in form
6
- * Both flows freeze the host page (preventDefault on all outside interactions)
7
- * while an element is being picked and while the modal is open.
8
- *
9
- * Usage:
10
- * <script src="feedback-widget.js"></script>
11
- * <script>
12
- * window.FeedbackWidgetConfig = {
13
- * endpoint: 'https://your-api.example.com/feedback', // optional
14
- * buttonLabel: 'Feedback', // optional
15
- * accentColor: '#2F6FED' // optional
16
- * };
17
- * </script>
18
- *
19
- * Listen for submissions from anywhere on the page:
20
- * window.addEventListener('feedbackwidget:submit', (e) => console.log(e.detail));
21
- */
22
- (function () {
23
- 'use strict';
24
-
25
- if (window.__feedbackWidgetLoaded) return;
26
- window.__feedbackWidgetLoaded = true;
27
-
28
- var config = window.FeedbackWidgetConfig || {};
29
- var ENDPOINT = config.endpoint || null;
30
- var BUTTON_LABEL = config.buttonLabel || 'Feedback';
31
- var ACCENT = config.accentColor || '#2F6FED';
32
-
33
- // ---------------------------------------------------------------------
34
- // Host + Shadow root (style isolation from the page we're embedded in)
35
- // ---------------------------------------------------------------------
36
- var host = document.createElement('div');
37
- host.id = 'feedback-widget-host';
38
- document.documentElement.appendChild(host);
39
- var root = host.attachShadow({ mode: 'open' });
40
-
41
- var css = ''
42
- + ':host { all: initial; }'
43
- + '* { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }'
44
- + '.fbw-tab {'
45
- + ' position: fixed; top: 50%; right: 0; transform: translateY(-50%);'
46
- + ' background: #111827; color: #fff; writing-mode: vertical-rl; text-orientation: mixed;'
47
- + ' transform: translateY(-50%) rotate(180deg);'
48
- + ' padding: 14px 9px; border-radius: 8px 0 0 8px; cursor: pointer;'
49
- + ' font-size: 13px; font-weight: 600; letter-spacing: 0.03em;'
50
- + ' box-shadow: -2px 0 10px rgba(0,0,0,0.18); z-index: 2147483000;'
51
- + ' border: none; user-select: none; transition: padding 0.12s ease, background 0.12s ease;'
52
- + '}'
53
- + '.fbw-tab:hover { padding-right: 13px; background: #1f2937; }'
54
- + '.fbw-tab:focus-visible { outline: 2px solid ' + ACCENT + '; outline-offset: 2px; }'
55
- + '.fbw-menu {'
56
- + ' position: fixed; top: 50%; right: 46px; transform: translateY(-50%);'
57
- + ' background: #fff; border-radius: 10px; box-shadow: 0 8px 30px rgba(0,0,0,0.22);'
58
- + ' padding: 6px; min-width: 220px; z-index: 2147483001; display: none;'
59
- + ' border: 1px solid #e5e7eb;'
60
- + '}'
61
- + '.fbw-menu.fbw-open { display: block; }'
62
- + '.fbw-menu button {'
63
- + ' display: block; width: 100%; text-align: left; background: none; border: none;'
64
- + ' padding: 10px 12px; font-size: 13.5px; color: #111827; border-radius: 6px; cursor: pointer;'
65
- + '}'
66
- + '.fbw-menu button:hover { background: #f3f4f6; }'
67
- + '.fbw-menu button small { display: block; color: #6b7280; font-weight: 400; margin-top: 2px; font-size: 11.5px; }'
68
- + '.fbw-banner {'
69
- + ' position: fixed; top: 18px; left: 50%; transform: translateX(-50%);'
70
- + ' background: #111827; color: #fff; padding: 10px 10px 10px 16px; border-radius: 999px;'
71
- + ' font-size: 13px; display: none; align-items: center; gap: 10px; z-index: 2147483002;'
72
- + ' box-shadow: 0 8px 24px rgba(0,0,0,0.25);'
73
- + '}'
74
- + '.fbw-banner.fbw-open { display: flex; }'
75
- + '.fbw-banner button {'
76
- + ' background: rgba(255,255,255,0.12); color: #fff; border: none; padding: 6px 12px;'
77
- + ' border-radius: 999px; font-size: 12px; cursor: pointer;'
78
- + '}'
79
- + '.fbw-banner button:hover { background: rgba(255,255,255,0.22); }'
80
- + '.fbw-highlight {'
81
- + ' position: fixed; pointer-events: none; border: 2px solid ' + ACCENT + ';'
82
- + ' box-shadow: 0 0 0 4px ' + hexToRgba(ACCENT, 0.22) + '; border-radius: 4px;'
83
- + ' z-index: 2147483000; display: none; transition: top 0.06s ease, left 0.06s ease, width 0.06s ease, height 0.06s ease;'
84
- + '}'
85
- + '.fbw-overlay {'
86
- + ' position: fixed; inset: 0; background: rgba(17,24,39,0.5);'
87
- + ' display: none; align-items: center; justify-content: center; z-index: 2147483003;'
88
- + '}'
89
- + '.fbw-overlay.fbw-open { display: flex; }'
90
- + '.fbw-modal {'
91
- + ' background: #fff; border-radius: 14px; width: 420px; max-width: 92vw;'
92
- + ' max-height: 88vh; overflow-y: auto; padding: 22px; box-shadow: 0 20px 60px rgba(0,0,0,0.35);'
93
- + '}'
94
- + '.fbw-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }'
95
- + '.fbw-modal-head h2 { font-size: 16px; margin: 0; color: #111827; font-weight: 700; }'
96
- + '.fbw-close { background: none; border: none; font-size: 18px; color: #6b7280; cursor: pointer; line-height: 1; padding: 4px; }'
97
- + '.fbw-close:hover { color: #111827; }'
98
- + '.fbw-field { margin-bottom: 14px; }'
99
- + '.fbw-field label { display: block; font-size: 12.5px; font-weight: 600; color: #374151; margin-bottom: 5px; }'
100
- + '.fbw-item-box {'
101
- + ' font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11.5px; color: #1f2937;'
102
- + ' background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 6px; padding: 8px 10px;'
103
- + ' word-break: break-all; max-height: 60px; overflow-y: auto;'
104
- + '}'
105
- + '.fbw-field textarea, .fbw-field input[type="email"] {'
106
- + ' width: 100%; border: 1px solid #d1d5db; border-radius: 8px; padding: 9px 10px; font-size: 13.5px;'
107
- + ' color: #111827; resize: vertical;'
108
- + '}'
109
- + '.fbw-field textarea:focus, .fbw-field input:focus { outline: none; border-color: ' + ACCENT + '; box-shadow: 0 0 0 3px ' + hexToRgba(ACCENT, 0.15) + '; }'
110
- + '.fbw-error { color: #dc2626; font-size: 12px; margin: -6px 0 12px; display: none; }'
111
- + '.fbw-error.fbw-show { display: block; }'
112
- + '.fbw-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 4px; }'
113
- + '.fbw-btn { border: none; border-radius: 8px; padding: 9px 16px; font-size: 13.5px; font-weight: 600; cursor: pointer; }'
114
- + '.fbw-btn-primary { background: ' + ACCENT + '; color: #fff; }'
115
- + '.fbw-btn-primary:hover { filter: brightness(1.08); }'
116
- + '.fbw-btn-ghost { background: none; color: #4b5563; }'
117
- + '.fbw-btn-ghost:hover { background: #f3f4f6; }'
118
- + '.fbw-toast {'
119
- + ' position: fixed; bottom: 22px; right: 22px; background: #111827; color: #fff;'
120
- + ' padding: 11px 16px; border-radius: 10px; font-size: 13px; z-index: 2147483004;'
121
- + ' box-shadow: 0 8px 24px rgba(0,0,0,0.3); opacity: 0; transform: translateY(6px);'
122
- + ' transition: opacity 0.18s ease, transform 0.18s ease; pointer-events: none;'
123
- + '}'
124
- + '.fbw-toast.fbw-show { opacity: 1; transform: translateY(0); }'
125
- + '.fbw-hidden { display: none !important; }';
126
-
127
- var styleEl = document.createElement('style');
128
- styleEl.textContent = css;
129
- root.appendChild(styleEl);
130
-
131
- function hexToRgba(hex, alpha) {
132
- var h = hex.replace('#', '');
133
- if (h.length === 3) h = h.split('').map(function (c) { return c + c; }).join('');
134
- var r = parseInt(h.substring(0, 2), 16);
135
- var g = parseInt(h.substring(2, 4), 16);
136
- var b = parseInt(h.substring(4, 6), 16);
137
- return 'rgba(' + r + ',' + g + ',' + b + ',' + alpha + ')';
138
- }
139
-
140
- // ---------------------------------------------------------------------
141
- // Markup
142
- // ---------------------------------------------------------------------
143
- var wrap = document.createElement('div');
144
- wrap.innerHTML = ''
145
- + '<button class="fbw-tab" type="button" aria-haspopup="true" aria-expanded="false">' + escapeHtml(BUTTON_LABEL) + '</button>'
146
- + '<div class="fbw-menu" role="menu">'
147
- + ' <button type="button" data-action="pick-visible" role="menuitem">'
148
- + ' Feedback on this page<small>Select any element you have feedback on</small>'
149
- + ' </button>'
150
- + ' <button type="button" data-action="pick-hidden" role="menuitem">'
151
- + ' Quick feedback<small>General feedback on us</small>'
152
- + ' </button>'
153
- + '</div>'
154
- + '<div class="fbw-banner">'
155
- + ' <span>Click an element to select it &middot; Esc to cancel</span>'
156
- + ' <button type="button" data-action="cancel-pick">Cancel</button>'
157
- + '</div>'
158
- + '<div class="fbw-highlight"></div>'
159
- + '<div class="fbw-overlay">'
160
- + ' <div class="fbw-modal" role="dialog" aria-modal="true" aria-labelledby="fbw-modal-title">'
161
- + ' <div class="fbw-modal-head">'
162
- + ' <h2 id="fbw-modal-title">Share feedback</h2>'
163
- + ' <button class="fbw-close" type="button" data-action="close-modal" aria-label="Close">&times;</button>'
164
- + ' </div>'
165
- + ' <form data-role="form">'
166
- + ' <div class="fbw-field" data-role="item-field">'
167
- + ' <label>Selected element</label>'
168
- + ' <div class="fbw-item-box" data-role="item-box"></div>'
169
- + ' </div>'
170
- + ' <div class="fbw-field">'
171
- + ' <label for="fbw-feedback">What\'s going on?</label>'
172
- + ' <textarea id="fbw-feedback" data-role="feedback" rows="4" placeholder="Tell us what you noticed..." required></textarea>'
173
- + ' </div>'
174
- + ' <div class="fbw-field">'
175
- + ' <label for="fbw-email">Email</label>'
176
- + ' <input id="fbw-email" data-role="email" type="email" placeholder="you@example.com" required />'
177
- + ' </div>'
178
- + ' <div class="fbw-error" data-role="error"></div>'
179
- + ' <div class="fbw-actions">'
180
- + ' <button type="button" class="fbw-btn fbw-btn-ghost" data-action="close-modal">Cancel</button>'
181
- + ' <button type="submit" class="fbw-btn fbw-btn-primary">Submit</button>'
182
- + ' </div>'
183
- + ' </form>'
184
- + ' </div>'
185
- + '</div>'
186
- + '<div class="fbw-toast" data-role="toast"></div>';
187
- root.appendChild(wrap);
188
-
189
- function escapeHtml(s) {
190
- var d = document.createElement('div');
191
- d.textContent = s;
192
- return d.innerHTML;
193
- }
194
-
195
- // ---------------------------------------------------------------------
196
- // Element refs
197
- // ---------------------------------------------------------------------
198
- var el = {
199
- tab: root.querySelector('.fbw-tab'),
200
- menu: root.querySelector('.fbw-menu'),
201
- banner: root.querySelector('.fbw-banner'),
202
- highlight: root.querySelector('.fbw-highlight'),
203
- overlay: root.querySelector('.fbw-overlay'),
204
- modal: root.querySelector('.fbw-modal'),
205
- form: root.querySelector('[data-role="form"]'),
206
- itemField: root.querySelector('[data-role="item-field"]'),
207
- itemBox: root.querySelector('[data-role="item-box"]'),
208
- feedback: root.querySelector('[data-role="feedback"]'),
209
- email: root.querySelector('[data-role="email"]'),
210
- error: root.querySelector('[data-role="error"]'),
211
- toast: root.querySelector('[data-role="toast"]')
212
- };
213
-
214
- // ---------------------------------------------------------------------
215
- // State
216
- // ---------------------------------------------------------------------
217
- var STATE = { IDLE: 'idle', MENU: 'menu', PICKING: 'picking', REVIEW: 'review' };
218
- var state = STATE.IDLE;
219
- var showItemInForm = true;
220
- var selectedSelector = null;
221
- var selectedEl = null;
222
- var hoverRafId = null;
223
-
224
- function isInsideWidget(target) {
225
- return target === host || host.contains(target);
226
- }
227
-
228
- // ---------------------------------------------------------------------
229
- // Menu
230
- // ---------------------------------------------------------------------
231
- el.tab.addEventListener('click', function () {
232
- state === STATE.MENU ? closeMenu() : openMenu();
233
- });
234
-
235
- function openMenu() {
236
- state = STATE.MENU;
237
- el.menu.classList.add('fbw-open');
238
- el.tab.setAttribute('aria-expanded', 'true');
239
- document.addEventListener('click', onOutsideMenuClick, true);
240
- }
241
- function closeMenu() {
242
- if (state === STATE.MENU) state = STATE.IDLE;
243
- el.menu.classList.remove('fbw-open');
244
- el.tab.setAttribute('aria-expanded', 'false');
245
- document.removeEventListener('click', onOutsideMenuClick, true);
246
- }
247
- function onOutsideMenuClick(e) {
248
- if (!isInsideWidget(e.target)) closeMenu();
249
- }
250
-
251
- el.menu.addEventListener('click', function (e) {
252
- var btn = e.target.closest('button[data-action]');
253
- if (!btn) return;
254
- if (btn.dataset.action === 'pick-visible') startPicking(true);
255
- if (btn.dataset.action === 'pick-hidden') {
256
- showItemInForm = false;
257
- closeMenu();
258
- openModal();
259
- }
260
- });
261
-
262
- // ---------------------------------------------------------------------
263
- // Picking mode (freezes the page, tracks hover, captures selection)
264
- // ---------------------------------------------------------------------
265
- function startPicking(showItem) {
266
- showItemInForm = showItem;
267
- closeMenu();
268
- state = STATE.PICKING;
269
- el.banner.classList.add('fbw-open');
270
- document.addEventListener('mousemove', onHoverMove, true);
271
- document.addEventListener('click', onDocumentClickCapture, true);
272
- document.addEventListener('keydown', onKeyDownCapture, true);
273
- document.addEventListener('scroll', onScrollOrResize, true);
274
- window.addEventListener('resize', onScrollOrResize, true);
275
- }
276
-
277
- function stopPicking() {
278
- el.banner.classList.remove('fbw-open');
279
- document.removeEventListener('mousemove', onHoverMove, true);
280
- document.removeEventListener('scroll', onScrollOrResize, true);
281
- window.removeEventListener('resize', onScrollOrResize, true);
282
- }
283
-
284
- el.banner.addEventListener('click', function (e) {
285
- if (e.target.closest('[data-action="cancel-pick"]')) cancelAll();
286
- });
287
-
288
- function onHoverMove(e) {
289
- if (isInsideWidget(e.target)) return;
290
- if (hoverRafId) cancelAnimationFrame(hoverRafId);
291
- hoverRafId = requestAnimationFrame(function () {
292
- positionHighlight(e.target);
293
- });
294
- }
295
-
296
- function positionHighlight(target) {
297
- var r = target.getBoundingClientRect();
298
- el.highlight.style.display = 'block';
299
- el.highlight.style.top = r.top + 'px';
300
- el.highlight.style.left = r.left + 'px';
301
- el.highlight.style.width = r.width + 'px';
302
- el.highlight.style.height = r.height + 'px';
303
- }
304
-
305
- function onScrollOrResize() {
306
- if (selectedEl && state === STATE.REVIEW) positionHighlight(selectedEl);
307
- }
308
-
309
- function onDocumentClickCapture(e) {
310
- if (isInsideWidget(e.target)) return; // let widget UI work normally
311
- e.preventDefault();
312
- e.stopPropagation();
313
- if (typeof e.stopImmediatePropagation === 'function') e.stopImmediatePropagation();
314
-
315
- if (state === STATE.PICKING) {
316
- finalizeSelection(e.target);
317
- }
318
- // if state === STATE.REVIEW, the outside click is simply swallowed (page stays frozen)
319
- }
320
-
321
- function onKeyDownCapture(e) {
322
- if (e.key === 'Escape') {
323
- e.preventDefault();
324
- cancelAll();
325
- }
326
- }
327
-
328
- function finalizeSelection(target) {
329
- selectedEl = target;
330
- selectedSelector = getUniqueSelector(target);
331
- stopPicking();
332
- positionHighlight(target);
333
- openModal();
334
- }
335
-
336
- // ---------------------------------------------------------------------
337
- // Unique selector generation
338
- // ---------------------------------------------------------------------
339
- function getUniqueSelector(node) {
340
- if (!(node instanceof Element)) return null;
341
-
342
- if (node.id) {
343
- var idSel = '#' + cssEscape(node.id);
344
- if (safeQueryCount(idSel) === 1) return idSel;
345
- }
346
-
347
- var parts = [];
348
- var current = node;
349
-
350
- while (current && current.nodeType === 1 && current !== document.documentElement) {
351
- var part = current.tagName.toLowerCase();
352
-
353
- if (current.id) {
354
- part = '#' + cssEscape(current.id);
355
- parts.unshift(part);
356
- break;
357
- }
358
-
359
- var classes = Array.prototype.filter.call(current.classList, function (c) { return !!c; });
360
- if (classes.length) {
361
- part += '.' + classes.map(cssEscape).join('.');
362
- }
363
-
364
- var parent = current.parentElement;
365
- if (parent) {
366
- var sameTagSiblings = Array.prototype.filter.call(parent.children, function (s) {
367
- return s.tagName === current.tagName;
368
- });
369
- if (sameTagSiblings.length > 1) {
370
- var idx = sameTagSiblings.indexOf(current) + 1;
371
- part += ':nth-of-type(' + idx + ')';
372
- }
373
- }
374
-
375
- parts.unshift(part);
376
-
377
- var testSelector = parts.join(' > ');
378
- if (safeQueryCount(testSelector) === 1) return testSelector;
379
-
380
- current = parent;
381
- }
382
-
383
- return parts.join(' > ');
384
- }
385
-
386
- function cssEscape(str) {
387
- if (window.CSS && window.CSS.escape) return window.CSS.escape(str);
388
- return String(str).replace(/([ #.;?%&,.+*~':"!^$[\]()=>|/])/g, '\\$1');
389
- }
390
-
391
- function safeQueryCount(selector) {
392
- try {
393
- return document.querySelectorAll(selector).length;
394
- } catch (err) {
395
- return -1;
396
- }
397
- }
398
-
399
- // ---------------------------------------------------------------------
400
- // Modal (page stays frozen while this is open)
401
- // ---------------------------------------------------------------------
402
- function openModal() {
403
- state = STATE.REVIEW;
404
- el.error.classList.remove('fbw-show');
405
- el.form.reset();
406
-
407
- if (showItemInForm) {
408
- el.itemField.classList.remove('fbw-hidden');
409
- el.itemBox.textContent = selectedSelector || '(none)';
410
- } else {
411
- el.itemField.classList.add('fbw-hidden');
412
- }
413
-
414
- el.overlay.classList.add('fbw-open');
415
- setTimeout(function () { el.feedback.focus(); }, 30);
416
- }
417
-
418
- function closeModal() {
419
- el.overlay.classList.remove('fbw-open');
420
- }
421
-
422
- function cancelAll() {
423
- stopPicking();
424
- closeModal();
425
- el.highlight.style.display = 'none';
426
- document.removeEventListener('click', onDocumentClickCapture, true);
427
- document.removeEventListener('keydown', onKeyDownCapture, true);
428
- selectedEl = null;
429
- selectedSelector = null;
430
- state = STATE.IDLE;
431
- }
432
-
433
- el.overlay.addEventListener('click', function (e) {
434
- var actionBtn = e.target.closest('[data-action="close-modal"]');
435
- if (actionBtn) cancelAll();
436
- });
437
-
438
- // ---------------------------------------------------------------------
439
- // Submit
440
- // ---------------------------------------------------------------------
441
- el.form.addEventListener('submit', function (e) {
442
- e.preventDefault();
443
- var feedback = el.feedback.value.trim();
444
- var email = el.email.value.trim();
445
- var emailOk = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
446
-
447
- if (!feedback || !emailOk) {
448
- el.error.textContent = !feedback
449
- ? 'Please add some feedback before submitting.'
450
- : 'Please enter a valid email address.';
451
- el.error.classList.add('fbw-show');
452
- return;
453
- }
454
-
455
- var payload = {
456
- optionType: showItemInForm ? 'page_item_visible' : 'page_item_hidden',
457
- elementSelector: selectedSelector,
458
- pageUrl: window.location.href,
459
- pageTitle: document.title,
460
- feedback: feedback,
461
- email: email,
462
- submittedAt: new Date().toISOString()
463
- };
464
-
465
- submitFeedback(payload);
466
- });
467
-
468
- function submitFeedback(payload) {
469
- window.dispatchEvent(new CustomEvent('feedbackwidget:submit', { detail: payload }));
470
-
471
- if (ENDPOINT) {
472
- fetch(ENDPOINT, {
473
- method: 'POST',
474
- headers: { 'Content-Type': 'application/json' },
475
- body: JSON.stringify(payload)
476
- }).catch(function () { /* swallow network errors, UX already confirmed below */ });
477
- }
478
-
479
- cancelAll();
480
- showToast('Thanks for the feedback!');
481
- }
482
-
483
- function showToast(message) {
484
- el.toast.textContent = message;
485
- el.toast.classList.add('fbw-show');
486
- setTimeout(function () { el.toast.classList.remove('fbw-show'); }, 2400);
487
- }
488
-
489
- // ---------------------------------------------------------------------
490
- // Minimal public API
491
- // ---------------------------------------------------------------------
492
- window.FeedbackWidget = {
493
- open: function (mode) { startPicking(mode !== 'hidden'); },
494
- close: cancelAll
495
- };
496
- })();