@fluid-topics/ft-reader-feedback 1.0.21 → 1.0.22

package/build/ft-reader-feedback.js

@@ -132,7 +132,9 @@ class FtReaderFeedback extends FtLitElementWithI18n {
                 const disliked = this.ratingType === "LIKE" && this.ratingValue === 0;
                 const liked = this.ratingType === "LIKE" && this.ratingValue === 1;
                 return html `
-                    <ft-switch @change=${(e) => this.rate(e.detail)} part="rating rating-like">
+                    <ft-switch unselectable
+                               @change=${(e) => this.rate(e.detail)} 
+                               part="rating rating-like">
                         <ft-switch-option .value=${1}
                                           ?selected=${liked}
                                           .iconVariant=${this.iconVariant}
@@ -151,7 +153,8 @@ class FtReaderFeedback extends FtLitElementWithI18n {
                 const no = this.ratingType === "DICHOTOMOUS" && this.ratingValue === 0;
                 const yes = this.ratingType === "DICHOTOMOUS" && this.ratingValue === 1;
                 return html `
-                    <ft-switch @change=${(e) => this.rate(e.detail)}
+                    <ft-switch unselectable
+                               @change=${(e) => this.rate(e.detail)}
                                part="rating rating-dichotomous">
                         <ft-switch-option .value=${1}
                                           ?selected=${yes}>

package/build/ft-reader-feedback.light.js

@@ -635,7 +635,7 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
         position: relative;
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content:before {
+    .ft-switch-option--selected .ft-switch-option--content:before {
         background-color: ${Ct.selectedBackgroundColor};
         border-radius: ${Me.borderRadiusLeft} ${Me.borderRadiusRight} ${Me.borderRadiusRight} ${Me.borderRadiusLeft};
         position: absolute;
@@ -656,7 +656,7 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
         ${e.setVariable(ot.lineHeight,"var(--ft-switch-option-internal-content-height)")}
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content .ft-switch-option--label {
+    .ft-switch-option--selected .ft-switch-option--label {
         color: ${Ct.selectedTextColor};
     }
 
@@ -681,14 +681,14 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
         color: ${Ct.iconColor};
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content ft-icon {
+    .ft-switch-option--selected ft-icon {
         color: ${Ct.selectedTextColor};
     }
-`;var Fe=function(t,e,i,o){for(var s,n=arguments.length,r=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,a=t.length-1;a>=0;a--)(s=t[a])&&(r=(n<3?s(r):n>3?s(e,i,r):s(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};class Le extends CustomEvent{constructor(){super("option-change",{bubbles:!0,composed:!0})}}class Pe extends e.FtLitElement{constructor(){super(...arguments),this.value="",this.label="",this.tooltipPosition="bottom",this.selected=!1,this.trailingIcon=!1,this.unselectable=!1}focus(){this.input.focus()}updated(t){super.updated(t),t.has("selected")&&this.dispatchEvent(new Le)}render(){const t={"ft-switch-option":!0,"ft-switch-option--trailing-icon":this.trailingIcon};return this.addTooltip(i.html`
+`;var Fe=function(t,e,i,o){for(var s,n=arguments.length,r=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,a=t.length-1;a>=0;a--)(s=t[a])&&(r=(n<3?s(r):n>3?s(e,i,r):s(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};class Le extends CustomEvent{constructor(){super("option-change",{bubbles:!0,composed:!0})}}class Pe extends e.FtLitElement{constructor(){super(...arguments),this.value="",this.label="",this.tooltipPosition="bottom",this.selected=!1,this.trailingIcon=!1,this.unselectable=!1}focus(){this.input.focus()}updated(t){super.updated(t),t.has("selected")&&this.dispatchEvent(new Le)}render(){const t={"ft-switch-option":!0,"ft-switch-option--trailing-icon":this.trailingIcon,"ft-switch-option--selected":this.selected};return this.addTooltip(i.html`
+            <input id="input" type="radio" class="ft-switch-option--input"
+                   .checked=${this.selected}>
             <label part="label" for="input" class=${n.classMap(t)}
                    @click=${this.onChange}>
-                <input id="input" type="radio" class="ft-switch-option--input"
-                       .checked=${this.selected}>
                 <div class="ft-switch-option--content">
                     <ft-ripple part="ripple" class="ft-switch-option--ripple"></ft-ripple>
                     <ft-typography part="text"
@@ -713,7 +713,7 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
                 <slot @slotchange=${this.onSlotchange}
                       @option-change=${this.onOptionChange}></slot>
             </div>
-        `}onKeyDown(t){let e;"ArrowDown"!=t.key&&"ArrowRight"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)+1:0),"ArrowUp"!=t.key&&"ArrowLeft"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)-1:this.options.length-1),null!=e&&(t.preventDefault(),this.options[this.fixIndex(e)].selected=!0)}fixIndex(t){return t<0?this.options.length-1:t>this.options.length-1?0:t}onSlotchange(){var t;this.options=[],null===(t=this.slottedContent)||void 0===t||t.assignedElements().forEach((t=>{t instanceof Pe&&this.registerOption(t)})),this.selectedOption=this.options.find((t=>t.selected))}registerOption(t){t.setAttribute("tabindex","-1"),t.unselectable=this.unselectable,this.options.push(t)}onOptionChange(t){t.stopPropagation();let e=t.target;e.selected?this.selectedOption=e:this.selectedOption=this.options.find((t=>t.selected))}focus(){this.ftSwitchDiv.focus()}updateOptions(){this.options.forEach((t=>{t.selected=t==this.selectedOption}))}}We.elementDefinitions={},We.styles=i.css`
+        `}onKeyDown(t){let e;"ArrowDown"!=t.key&&"ArrowRight"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)+1:0),"ArrowUp"!=t.key&&"ArrowLeft"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)-1:this.options.length-1),null!=e&&(t.preventDefault(),this.options[this.fixIndex(e)].selected=!0)}fixIndex(t){return t<0?this.options.length-1:t>this.options.length-1?0:t}onSlotchange(){var t;this.options=[],null===(t=this.slottedContent)||void 0===t||t.assignedElements().forEach((t=>{t instanceof Pe&&this.registerOption(t)})),this.selectedOption=this.options.find((t=>t.selected))}registerOption(t){t.setAttribute("tabindex","-1"),t.unselectable=this.unselectable,this.options.push(t)}onOptionChange(t){t.stopPropagation();let e=t.target;e.selected?this.selectedOption=e:this.selectedOption=this.options.find((t=>t.selected))}focus(){this.ftSwitchDiv.focus()}updateOptions(){this.options.forEach((t=>{t.selected=t===this.selectedOption}))}}We.elementDefinitions={},We.styles=i.css`
         :host {
             display: inline-block;
         }
@@ -1116,7 +1116,9 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
                                     `}))}
                     </div>
                 `;case"LIKE":const t="LIKE"===this.ratingType&&0===this.ratingValue,e="LIKE"===this.ratingType&&1===this.ratingValue;return i.html`
-                    <ft-switch @change=${t=>this.rate(t.detail)} part="rating rating-like">
+                    <ft-switch unselectable
+                               @change=${t=>this.rate(t.detail)} 
+                               part="rating rating-like">
                         <ft-switch-option .value=${1}
                                           ?selected=${e}
                                           .iconVariant=${this.iconVariant}
@@ -1131,7 +1133,8 @@ const ue=Symbol.for(""),be=t=>{if((null==t?void 0:t.r)===ue)return null==t?void
                         </ft-switch-option>
                     </ft-switch>
                 `;case"DICHOTOMOUS":const o="DICHOTOMOUS"===this.ratingType&&0===this.ratingValue,s="DICHOTOMOUS"===this.ratingType&&1===this.ratingValue;return i.html`
-                    <ft-switch @change=${t=>this.rate(t.detail)}
+                    <ft-switch unselectable
+                               @change=${t=>this.rate(t.detail)}
                                part="rating rating-dichotomous">
                         <ft-switch-option .value=${1}
                                           ?selected=${s}>

package/build/ft-reader-feedback.min.js

@@ -14,7 +14,7 @@
      *
      * @see https://github.com/webcomponents/polyfills/tree/master/packages/scoped-custom-element-registry
      */
-if(!ShadowRoot.prototype.createElement){const t=window.HTMLElement,e=window.customElements.define,i=window.customElements.get,n=window.customElements,o=new WeakMap,r=new WeakMap,s=new WeakMap,a=new WeakMap;let l;window.CustomElementRegistry=class{constructor(){this._definitionsByTag=new Map,this._definitionsByClass=new Map,this._whenDefinedPromises=new Map,this._awaitingUpgrade=new Map}define(t,o){if(t=t.toLowerCase(),void 0!==this._getDefinition(t))throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': the name "${t}" has already been used with this registry`);if(void 0!==this._definitionsByClass.get(o))throw new DOMException("Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry");const a=o.prototype.attributeChangedCallback,l=new Set(o.observedAttributes||[]);f(o,l,a);const c={elementClass:o,connectedCallback:o.prototype.connectedCallback,disconnectedCallback:o.prototype.disconnectedCallback,adoptedCallback:o.prototype.adoptedCallback,attributeChangedCallback:a,formAssociated:o.formAssociated,formAssociatedCallback:o.prototype.formAssociatedCallback,formDisabledCallback:o.prototype.formDisabledCallback,formResetCallback:o.prototype.formResetCallback,formStateRestoreCallback:o.prototype.formStateRestoreCallback,observedAttributes:l};this._definitionsByTag.set(t,c),this._definitionsByClass.set(o,c);let u=i.call(n,t);u||(u=h(t),e.call(n,t,u)),this===window.customElements&&(s.set(o,c),c.standInClass=u);const d=this._awaitingUpgrade.get(t);if(d){this._awaitingUpgrade.delete(t);for(const t of d)r.delete(t),p(t,c,!0)}const v=this._whenDefinedPromises.get(t);return void 0!==v&&(v.resolve(o),this._whenDefinedPromises.delete(t)),o}upgrade(){b.push(this),n.upgrade.apply(n,arguments),b.pop()}get(t){const e=this._definitionsByTag.get(t);return e?.elementClass}_getDefinition(t){return this._definitionsByTag.get(t)}whenDefined(t){const e=this._getDefinition(t);if(void 0!==e)return Promise.resolve(e.elementClass);let i=this._whenDefinedPromises.get(t);return void 0===i&&(i={},i.promise=new Promise((t=>i.resolve=t)),this._whenDefinedPromises.set(t,i)),i.promise}_upgradeWhenDefined(t,e,i){let n=this._awaitingUpgrade.get(e);n||this._awaitingUpgrade.set(e,n=new Set),i?n.add(t):n.delete(t)}},window.HTMLElement=function(){let e=l;if(e)return l=void 0,e;const i=s.get(this.constructor);if(!i)throw new TypeError("Illegal constructor (custom element class must be registered with global customElements registry to be newable)");return e=Reflect.construct(t,[],i.standInClass),Object.setPrototypeOf(e,this.constructor.prototype),o.set(e,i),e},window.HTMLElement.prototype=t.prototype;const c=t=>t===document||t instanceof ShadowRoot,u=t=>{let e=t.getRootNode();if(!c(e)){const t=b[b.length-1];if(t instanceof CustomElementRegistry)return t;e=t.getRootNode(),c(e)||(e=a.get(e)?.getRootNode()||document)}return e.customElements},h=e=>class{static get formAssociated(){return!0}constructor(){const i=Reflect.construct(t,[],this.constructor);Object.setPrototypeOf(i,HTMLElement.prototype);const n=u(i)||window.customElements,o=n._getDefinition(e);return o?p(i,o):r.set(i,n),i}connectedCallback(){const t=o.get(this);t?t.connectedCallback&&t.connectedCallback.apply(this,arguments):r.get(this)._upgradeWhenDefined(this,e,!0)}disconnectedCallback(){const t=o.get(this);t?t.disconnectedCallback&&t.disconnectedCallback.apply(this,arguments):r.get(this)._upgradeWhenDefined(this,e,!1)}adoptedCallback(){const t=o.get(this);t?.adoptedCallback?.apply(this,arguments)}formAssociatedCallback(){const t=o.get(this);t&&t.formAssociated&&t?.formAssociatedCallback?.apply(this,arguments)}formDisabledCallback(){const t=o.get(this);t?.formAssociated&&t?.formDisabledCallback?.apply(this,arguments)}formResetCallback(){const t=o.get(this);t?.formAssociated&&t?.formResetCallback?.apply(this,arguments)}formStateRestoreCallback(){const t=o.get(this);t?.formAssociated&&t?.formStateRestoreCallback?.apply(this,arguments)}},f=(t,e,i)=>{if(0===e.size||void 0===i)return;const n=t.prototype.setAttribute;n&&(t.prototype.setAttribute=function(t,o){const r=t.toLowerCase();if(e.has(r)){const t=this.getAttribute(r);n.call(this,r,o),i.call(this,r,t,o)}else n.call(this,r,o)});const o=t.prototype.removeAttribute;o&&(t.prototype.removeAttribute=function(t){const n=t.toLowerCase();if(e.has(n)){const t=this.getAttribute(n);o.call(this,n),i.call(this,n,t,null)}else o.call(this,n)})},d=e=>{const i=Object.getPrototypeOf(e);if(i!==window.HTMLElement)return i===t||"HTMLElement"===i?.prototype?.constructor?.name?Object.setPrototypeOf(e,window.HTMLElement):d(i)},p=(t,e,i=!1)=>{Object.setPrototypeOf(t,e.elementClass.prototype),o.set(t,e),l=t;try{new e.elementClass}catch(t){d(e.elementClass),new e.elementClass}e.observedAttributes.forEach((i=>{t.hasAttribute(i)&&e.attributeChangedCallback.call(t,i,null,t.getAttribute(i))})),i&&e.connectedCallback&&t.isConnected&&e.connectedCallback.call(t)},v=Element.prototype.attachShadow;Element.prototype.attachShadow=function(t){const e=v.apply(this,arguments);return t.customElements&&(e.customElements=t.customElements),e};let b=[document];const y=(t,e,i=void 0)=>{const n=(i?Object.getPrototypeOf(i):t.prototype)[e];t.prototype[e]=function(){b.push(this);const t=n.apply(i||this,arguments);return void 0!==t&&a.set(t,this),b.pop(),t}};y(ShadowRoot,"createElement",document),y(ShadowRoot,"importNode",document),y(Element,"insertAdjacentHTML");const g=(t,e)=>{const i=Object.getOwnPropertyDescriptor(t.prototype,e);Object.defineProperty(t.prototype,e,{...i,set(t){b.push(this),i.set.call(this,t),b.pop()}})};if(g(Element,"innerHTML"),g(ShadowRoot,"innerHTML"),Object.defineProperty(window,"customElements",{value:new CustomElementRegistry,configurable:!0,writable:!0}),window.ElementInternals&&window.ElementInternals.prototype.setFormValue){const t=new WeakMap,e=HTMLElement.prototype.attachInternals,i=["setFormValue","setValidity","checkValidity","reportValidity"];HTMLElement.prototype.attachInternals=function(...i){const n=e.call(this,...i);return t.set(n,this),n},i.forEach((e=>{const i=window.ElementInternals.prototype,n=i[e];i[e]=function(...e){const i=t.get(this);if(!0!==o.get(i).formAssociated)throw new DOMException(`Failed to execute ${n} on 'ElementInternals': The target element is not a form-associated custom element.`);n?.call(this,...e)}}));class n extends Array{constructor(t){super(...t),this._elements=t}get value(){return this._elements.find((t=>!0===t.checked))?.value||""}}class r{constructor(t){const e=new Map;t.forEach(((t,i)=>{const n=t.getAttribute("name"),o=e.get(n)||[];this[+i]=t,o.push(t),e.set(n,o)})),this.length=t.length,e.forEach(((t,e)=>{t&&(1===t.length?this[e]=t[0]:this[e]=new n(t))}))}namedItem(t){return this[t]}}const s=Object.getOwnPropertyDescriptor(HTMLFormElement.prototype,"elements");Object.defineProperty(HTMLFormElement.prototype,"elements",{get:function(){const t=s.get.call(this,[]),e=[];for(const i of t){const t=o.get(i);t&&!0!==t.formAssociated||e.push(i)}return new r(e)}})}}try{window.customElements.define("custom-element",null)}catch(xo){const t=window.customElements.define;window.customElements.define=(e,i,n)=>{if(null!==i)try{t.bind(window.customElements)(e,i,n)}catch(t){console.info(e,i,n,t)}}}class e extends Error{constructor(t,e,i){super(t),this.canceledPromiseResult=e,this.canceledPromiseError=i}}class i extends Promise{constructor(t){super(((i,n)=>t((t=>{this.isCanceled?n(new e("Promise has been canceled",t)):i(t)}),(t=>{this.isCanceled?n(new e("Promise has been canceled",void 0,t)):n(t)})))),this.isCanceled=!1}cancel(){this.isCanceled=!0}}class n{constructor(){this.loaders={},this.content={},this.clearTimeouts={},this.finalContent=new Set}register(t,e){this.loaders[t]=e,this.finalContent.delete(t)}registerFinal(t,e){this.loaders[t]=e,this.finalContent.add(t)}clearAll(){for(let t in this.content)this.clear(t)}clear(t){this.finalContent.has(t)||this.forceClear(t)}forceClear(t){null!=this.clearTimeouts[t]&&(window.clearTimeout(this.clearTimeouts[t]),delete this.clearTimeouts[t]),this.content[t]instanceof i&&this.content[t].cancel(),delete this.content[t]}set(t,e){this.forceClear(t),this.register(t,(async()=>e)),this.content[t]=e}setFinal(t,e){this.forceClear(t),this.registerFinal(t,(async()=>e)),this.content[t]=e}async get(t,e,n){if(void 0===this.content[t]){if(null==(e=null!=e?e:this.loaders[t]))throw new Error("Unknown cache key "+t);const o=(t=>new i(((e,i)=>t.then(e).catch(i))))(e());return this.content[t]=o,o.then((e=>(this.content[t]=e,null!=n&&(this.clearTimeouts[t]=window.setTimeout((()=>this.clear(t)),n)),e)))}if(this.content[t]instanceof Error)throw this.content[t];return this.content[t]}isResolvedValue(t){return!(null==t||t instanceof Promise||t instanceof Error)}getNow(t){if(this.isResolvedValue(this.content[t]))return this.content[t]}has(t){return null!=this.content[t]}resolvedKeys(){return Object.keys(this.content).filter((t=>this.isResolvedValue(this.content[t])))}resolvedValues(){return Object.values(this.content).filter((t=>this.isResolvedValue(t)))}keys(){return Object.keys(this.content)}values(){return Object.values(this.content)}}class o{constructor(t=0){this.timeout=t,this.callbacks=[]}run(t,e){return this.callbacks=[t],this.debounce(e)}queue(t,e){return this.callbacks.push(t),this.debounce(e)}cancel(){this.clearTimeout(),this.resolvePromise&&this.resolvePromise(!1),this.clearPromise()}debounce(t){return null==this.promise&&(this.promise=new Promise(((t,e)=>{this.resolvePromise=t,this.rejectPromise=e}))),this.clearTimeout(),this._debounce=window.setTimeout((()=>this.runCallbacks()),null!=t?t:this.timeout),this.promise}async runCallbacks(){var t,e;const i=[...this.callbacks];this.callbacks=[];const n=null!==(t=this.rejectPromise)&&void 0!==t?t:()=>null,o=null!==(e=this.resolvePromise)&&void 0!==e?e:()=>null;this.clearPromise();for(let t of i)try{await t()}catch(t){return void n(t)}o(!0)}clearTimeout(){null!=this._debounce&&window.clearTimeout(this._debounce)}clearPromise(){this.promise=void 0,this.resolvePromise=void 0,this.rejectPromise=void 0}}
+if(!ShadowRoot.prototype.createElement){const t=window.HTMLElement,e=window.customElements.define,i=window.customElements.get,n=window.customElements,o=new WeakMap,r=new WeakMap,s=new WeakMap,a=new WeakMap;let l;window.CustomElementRegistry=class{constructor(){this._definitionsByTag=new Map,this._definitionsByClass=new Map,this._whenDefinedPromises=new Map,this._awaitingUpgrade=new Map}define(t,o){if(t=t.toLowerCase(),void 0!==this._getDefinition(t))throw new DOMException(`Failed to execute 'define' on 'CustomElementRegistry': the name "${t}" has already been used with this registry`);if(void 0!==this._definitionsByClass.get(o))throw new DOMException("Failed to execute 'define' on 'CustomElementRegistry': this constructor has already been used with this registry");const a=o.prototype.attributeChangedCallback,l=new Set(o.observedAttributes||[]);f(o,l,a);const c={elementClass:o,connectedCallback:o.prototype.connectedCallback,disconnectedCallback:o.prototype.disconnectedCallback,adoptedCallback:o.prototype.adoptedCallback,attributeChangedCallback:a,formAssociated:o.formAssociated,formAssociatedCallback:o.prototype.formAssociatedCallback,formDisabledCallback:o.prototype.formDisabledCallback,formResetCallback:o.prototype.formResetCallback,formStateRestoreCallback:o.prototype.formStateRestoreCallback,observedAttributes:l};this._definitionsByTag.set(t,c),this._definitionsByClass.set(o,c);let u=i.call(n,t);u||(u=h(t),e.call(n,t,u)),this===window.customElements&&(s.set(o,c),c.standInClass=u);const d=this._awaitingUpgrade.get(t);if(d){this._awaitingUpgrade.delete(t);for(const t of d)r.delete(t),p(t,c,!0)}const v=this._whenDefinedPromises.get(t);return void 0!==v&&(v.resolve(o),this._whenDefinedPromises.delete(t)),o}upgrade(){b.push(this),n.upgrade.apply(n,arguments),b.pop()}get(t){const e=this._definitionsByTag.get(t);return e?.elementClass}_getDefinition(t){return this._definitionsByTag.get(t)}whenDefined(t){const e=this._getDefinition(t);if(void 0!==e)return Promise.resolve(e.elementClass);let i=this._whenDefinedPromises.get(t);return void 0===i&&(i={},i.promise=new Promise((t=>i.resolve=t)),this._whenDefinedPromises.set(t,i)),i.promise}_upgradeWhenDefined(t,e,i){let n=this._awaitingUpgrade.get(e);n||this._awaitingUpgrade.set(e,n=new Set),i?n.add(t):n.delete(t)}},window.HTMLElement=function(){let e=l;if(e)return l=void 0,e;const i=s.get(this.constructor);if(!i)throw new TypeError("Illegal constructor (custom element class must be registered with global customElements registry to be newable)");return e=Reflect.construct(t,[],i.standInClass),Object.setPrototypeOf(e,this.constructor.prototype),o.set(e,i),e},window.HTMLElement.prototype=t.prototype;const c=t=>t===document||t instanceof ShadowRoot,u=t=>{let e=t.getRootNode();if(!c(e)){const t=b[b.length-1];if(t instanceof CustomElementRegistry)return t;e=t.getRootNode(),c(e)||(e=a.get(e)?.getRootNode()||document)}return e.customElements},h=e=>class{static get formAssociated(){return!0}constructor(){const i=Reflect.construct(t,[],this.constructor);Object.setPrototypeOf(i,HTMLElement.prototype);const n=u(i)||window.customElements,o=n._getDefinition(e);return o?p(i,o):r.set(i,n),i}connectedCallback(){const t=o.get(this);t?t.connectedCallback&&t.connectedCallback.apply(this,arguments):r.get(this)._upgradeWhenDefined(this,e,!0)}disconnectedCallback(){const t=o.get(this);t?t.disconnectedCallback&&t.disconnectedCallback.apply(this,arguments):r.get(this)._upgradeWhenDefined(this,e,!1)}adoptedCallback(){const t=o.get(this);t?.adoptedCallback?.apply(this,arguments)}formAssociatedCallback(){const t=o.get(this);t&&t.formAssociated&&t?.formAssociatedCallback?.apply(this,arguments)}formDisabledCallback(){const t=o.get(this);t?.formAssociated&&t?.formDisabledCallback?.apply(this,arguments)}formResetCallback(){const t=o.get(this);t?.formAssociated&&t?.formResetCallback?.apply(this,arguments)}formStateRestoreCallback(){const t=o.get(this);t?.formAssociated&&t?.formStateRestoreCallback?.apply(this,arguments)}},f=(t,e,i)=>{if(0===e.size||void 0===i)return;const n=t.prototype.setAttribute;n&&(t.prototype.setAttribute=function(t,o){const r=t.toLowerCase();if(e.has(r)){const t=this.getAttribute(r);n.call(this,r,o),i.call(this,r,t,o)}else n.call(this,r,o)});const o=t.prototype.removeAttribute;o&&(t.prototype.removeAttribute=function(t){const n=t.toLowerCase();if(e.has(n)){const t=this.getAttribute(n);o.call(this,n),i.call(this,n,t,null)}else o.call(this,n)})},d=e=>{const i=Object.getPrototypeOf(e);if(i!==window.HTMLElement)return i===t||"HTMLElement"===i?.prototype?.constructor?.name?Object.setPrototypeOf(e,window.HTMLElement):d(i)},p=(t,e,i=!1)=>{Object.setPrototypeOf(t,e.elementClass.prototype),o.set(t,e),l=t;try{new e.elementClass}catch(t){d(e.elementClass),new e.elementClass}e.observedAttributes.forEach((i=>{t.hasAttribute(i)&&e.attributeChangedCallback.call(t,i,null,t.getAttribute(i))})),i&&e.connectedCallback&&t.isConnected&&e.connectedCallback.call(t)},v=Element.prototype.attachShadow;Element.prototype.attachShadow=function(t){const e=v.apply(this,arguments);return t.customElements&&(e.customElements=t.customElements),e};let b=[document];const y=(t,e,i=void 0)=>{const n=(i?Object.getPrototypeOf(i):t.prototype)[e];t.prototype[e]=function(){b.push(this);const t=n.apply(i||this,arguments);return void 0!==t&&a.set(t,this),b.pop(),t}};y(ShadowRoot,"createElement",document),y(ShadowRoot,"importNode",document),y(Element,"insertAdjacentHTML");const g=(t,e)=>{const i=Object.getOwnPropertyDescriptor(t.prototype,e);Object.defineProperty(t.prototype,e,{...i,set(t){b.push(this),i.set.call(this,t),b.pop()}})};if(g(Element,"innerHTML"),g(ShadowRoot,"innerHTML"),Object.defineProperty(window,"customElements",{value:new CustomElementRegistry,configurable:!0,writable:!0}),window.ElementInternals&&window.ElementInternals.prototype.setFormValue){const t=new WeakMap,e=HTMLElement.prototype.attachInternals,i=["setFormValue","setValidity","checkValidity","reportValidity"];HTMLElement.prototype.attachInternals=function(...i){const n=e.call(this,...i);return t.set(n,this),n},i.forEach((e=>{const i=window.ElementInternals.prototype,n=i[e];i[e]=function(...e){const i=t.get(this);if(!0!==o.get(i).formAssociated)throw new DOMException(`Failed to execute ${n} on 'ElementInternals': The target element is not a form-associated custom element.`);n?.call(this,...e)}}));class n extends Array{constructor(t){super(...t),this._elements=t}get value(){return this._elements.find((t=>!0===t.checked))?.value||""}}class r{constructor(t){const e=new Map;t.forEach(((t,i)=>{const n=t.getAttribute("name"),o=e.get(n)||[];this[+i]=t,o.push(t),e.set(n,o)})),this.length=t.length,e.forEach(((t,e)=>{t&&(1===t.length?this[e]=t[0]:this[e]=new n(t))}))}namedItem(t){return this[t]}}const s=Object.getOwnPropertyDescriptor(HTMLFormElement.prototype,"elements");Object.defineProperty(HTMLFormElement.prototype,"elements",{get:function(){const t=s.get.call(this,[]),e=[];for(const i of t){const t=o.get(i);t&&!0!==t.formAssociated||e.push(i)}return new r(e)}})}}try{window.customElements.define("custom-element",null)}catch(xo){const t=window.customElements.define;window.customElements.define=(e,i,n)=>{if(null!==i)try{t.bind(window.customElements)(e,i,n)}catch(t){console.info(e,i,n,t)}}}class e extends Error{constructor(t,e,i){super(t),this.canceledPromiseResult=e,this.canceledPromiseError=i}}class i extends Promise{constructor(t){super(((i,n)=>t((t=>{this.isCanceled?n(new e("Promise has been canceled",t)):i(t)}),(t=>{this.isCanceled?n(new e("Promise has been canceled",void 0,t)):n(t)})))),this.isCanceled=!1}cancel(){this.isCanceled=!0}}class n{constructor(){this.loaders={},this.content={},this.clearTimeouts={},this.finalContent=new Set}register(t,e){this.loaders[t]=e,this.finalContent.delete(t)}registerFinal(t,e){this.loaders[t]=e,this.finalContent.add(t)}clearAll(){for(let t in this.content)this.clear(t)}clear(t){this.finalContent.has(t)||this.forceClear(t)}forceClear(t){this.clearClearTimeout(t),this.content[t]instanceof i&&this.content[t].cancel(),delete this.content[t]}clearClearTimeout(t){null!=this.clearTimeouts[t]&&(window.clearTimeout(this.clearTimeouts[t]),delete this.clearTimeouts[t])}set(t,e){this.forceClear(t),this.register(t,(async()=>e)),this.content[t]=e}setFinal(t,e){this.forceClear(t),this.registerFinal(t,(async()=>e)),this.content[t]=e}async get(t,e,n){if(void 0===this.content[t]){if(null==(e=null!=e?e:this.loaders[t]))throw new Error("Unknown cache key "+t);const o=(t=>new i(((e,i)=>t.then(e).catch(i))))(e());return this.content[t]=o,o.then((e=>(this.content[t]=e,null!=n&&(this.clearClearTimeout(t),this.clearTimeouts[t]=window.setTimeout((()=>this.clear(t)),n)),e)))}if(this.content[t]instanceof Error)throw this.content[t];return this.content[t]}isResolvedValue(t){return!(null==t||t instanceof Promise||t instanceof Error)}getNow(t){if(this.isResolvedValue(this.content[t]))return this.content[t]}has(t){return null!=this.content[t]}resolvedKeys(){return Object.keys(this.content).filter((t=>this.isResolvedValue(this.content[t])))}resolvedValues(){return Object.values(this.content).filter((t=>this.isResolvedValue(t)))}keys(){return Object.keys(this.content)}values(){return Object.values(this.content)}}class o{constructor(t=0){this.timeout=t,this.callbacks=[]}run(t,e){return this.callbacks=[t],this.debounce(e)}queue(t,e){return this.callbacks.push(t),this.debounce(e)}cancel(){this.clearTimeout(),this.resolvePromise&&this.resolvePromise(!1),this.clearPromise()}debounce(t){return null==this.promise&&(this.promise=new Promise(((t,e)=>{this.resolvePromise=t,this.rejectPromise=e}))),this.clearTimeout(),this._debounce=window.setTimeout((()=>this.runCallbacks()),null!=t?t:this.timeout),this.promise}async runCallbacks(){var t,e;const i=[...this.callbacks];this.callbacks=[];const n=null!==(t=this.rejectPromise)&&void 0!==t?t:()=>null,o=null!==(e=this.resolvePromise)&&void 0!==e?e:()=>null;this.clearPromise();for(let t of i)try{await t()}catch(t){return void n(t)}o(!0)}clearTimeout(){null!=this._debounce&&window.clearTimeout(this._debounce)}clearPromise(){this.promise=void 0,this.resolvePromise=void 0,this.rejectPromise=void 0}}
 /**
      * @license
      * Copyright 2017 Google LLC
@@ -747,7 +747,7 @@ const Ao=yo(class extends go{constructor(t){var e;if(super(t),t.type!==vo||"clas
         position: relative;
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content:before {
+    .ft-switch-option--selected .ft-switch-option--content:before {
         background-color: ${no.selectedBackgroundColor};
         border-radius: ${Fo.borderRadiusLeft} ${Fo.borderRadiusRight} ${Fo.borderRadiusRight} ${Fo.borderRadiusLeft};
         position: absolute;
@@ -768,7 +768,7 @@ const Ao=yo(class extends go{constructor(t){var e;if(super(t),t.type!==vo||"clas
         ${St(In.lineHeight,"var(--ft-switch-option-internal-content-height)")}
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content .ft-switch-option--label {
+    .ft-switch-option--selected .ft-switch-option--label {
         color: ${no.selectedTextColor};
     }
 
@@ -793,14 +793,14 @@ const Ao=yo(class extends go{constructor(t){var e;if(super(t),t.type!==vo||"clas
         color: ${no.iconColor};
     }
 
-    .ft-switch-option--input:checked + .ft-switch-option--content ft-icon {
+    .ft-switch-option--selected ft-icon {
         color: ${no.selectedTextColor};
     }
-`;var Do=function(t,e,i,n){for(var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(r<3?o(s):r>3?o(e,i,s):o(e,i))||s);return r>3&&s&&Object.defineProperty(e,i,s),s};class Bo extends CustomEvent{constructor(){super("option-change",{bubbles:!0,composed:!0})}}class Lo extends It{constructor(){super(...arguments),this.value="",this.label="",this.tooltipPosition="bottom",this.selected=!1,this.trailingIcon=!1,this.unselectable=!1}focus(){this.input.focus()}updated(t){super.updated(t),t.has("selected")&&this.dispatchEvent(new Bo)}render(){const t={"ft-switch-option":!0,"ft-switch-option--trailing-icon":this.trailingIcon};return this.addTooltip(tt`
+`;var Do=function(t,e,i,n){for(var o,r=arguments.length,s=r<3?e:null===n?n=Object.getOwnPropertyDescriptor(e,i):n,a=t.length-1;a>=0;a--)(o=t[a])&&(s=(r<3?o(s):r>3?o(e,i,s):o(e,i))||s);return r>3&&s&&Object.defineProperty(e,i,s),s};class Bo extends CustomEvent{constructor(){super("option-change",{bubbles:!0,composed:!0})}}class Lo extends It{constructor(){super(...arguments),this.value="",this.label="",this.tooltipPosition="bottom",this.selected=!1,this.trailingIcon=!1,this.unselectable=!1}focus(){this.input.focus()}updated(t){super.updated(t),t.has("selected")&&this.dispatchEvent(new Bo)}render(){const t={"ft-switch-option":!0,"ft-switch-option--trailing-icon":this.trailingIcon,"ft-switch-option--selected":this.selected};return this.addTooltip(tt`
+            <input id="input" type="radio" class="ft-switch-option--input"
+                   .checked=${this.selected}>
             <label part="label" for="input" class=${Ao(t)}
                    @click=${this.onChange}>
-                <input id="input" type="radio" class="ft-switch-option--input"
-                       .checked=${this.selected}>
                 <div class="ft-switch-option--content">
                     <ft-ripple part="ripple" class="ft-switch-option--ripple"></ft-ripple>
                     <ft-typography part="text"
@@ -825,7 +825,7 @@ const Ao=yo(class extends go{constructor(t){var e;if(super(t),t.type!==vo||"clas
                 <slot @slotchange=${this.onSlotchange}
                       @option-change=${this.onOptionChange}></slot>
             </div>
-        `}onKeyDown(t){let e;"ArrowDown"!=t.key&&"ArrowRight"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)+1:0),"ArrowUp"!=t.key&&"ArrowLeft"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)-1:this.options.length-1),null!=e&&(t.preventDefault(),this.options[this.fixIndex(e)].selected=!0)}fixIndex(t){return t<0?this.options.length-1:t>this.options.length-1?0:t}onSlotchange(){var t;this.options=[],null===(t=this.slottedContent)||void 0===t||t.assignedElements().forEach((t=>{t instanceof Lo&&this.registerOption(t)})),this.selectedOption=this.options.find((t=>t.selected))}registerOption(t){t.setAttribute("tabindex","-1"),t.unselectable=this.unselectable,this.options.push(t)}onOptionChange(t){t.stopPropagation();let e=t.target;e.selected?this.selectedOption=e:this.selectedOption=this.options.find((t=>t.selected))}focus(){this.ftSwitchDiv.focus()}updateOptions(){this.options.forEach((t=>{t.selected=t==this.selectedOption}))}}Ko.elementDefinitions={},Ko.styles=w`
+        `}onKeyDown(t){let e;"ArrowDown"!=t.key&&"ArrowRight"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)+1:0),"ArrowUp"!=t.key&&"ArrowLeft"!=t.key||(e=this.selectedOption?this.options.indexOf(this.selectedOption)-1:this.options.length-1),null!=e&&(t.preventDefault(),this.options[this.fixIndex(e)].selected=!0)}fixIndex(t){return t<0?this.options.length-1:t>this.options.length-1?0:t}onSlotchange(){var t;this.options=[],null===(t=this.slottedContent)||void 0===t||t.assignedElements().forEach((t=>{t instanceof Lo&&this.registerOption(t)})),this.selectedOption=this.options.find((t=>t.selected))}registerOption(t){t.setAttribute("tabindex","-1"),t.unselectable=this.unselectable,this.options.push(t)}onOptionChange(t){t.stopPropagation();let e=t.target;e.selected?this.selectedOption=e:this.selectedOption=this.options.find((t=>t.selected))}focus(){this.ftSwitchDiv.focus()}updateOptions(){this.options.forEach((t=>{t.selected=t===this.selectedOption}))}}Ko.elementDefinitions={},Ko.styles=w`
         :host {
             display: inline-block;
         }
@@ -1239,7 +1239,9 @@ const{I:sr}=bt,ar=()=>document.createComment(""),lr=(t,e,i)=>{var n;const o=t._$
                                     `}))}
                     </div>
                 `;case"LIKE":const t="LIKE"===this.ratingType&&0===this.ratingValue,e="LIKE"===this.ratingType&&1===this.ratingValue;return tt`
-                    <ft-switch @change=${t=>this.rate(t.detail)} part="rating rating-like">
+                    <ft-switch unselectable
+                               @change=${t=>this.rate(t.detail)} 
+                               part="rating rating-like">
                         <ft-switch-option .value=${1}
                                           ?selected=${e}
                                           .iconVariant=${this.iconVariant}
@@ -1254,7 +1256,8 @@ const{I:sr}=bt,ar=()=>document.createComment(""),lr=(t,e,i)=>{var n;const o=t._$
                         </ft-switch-option>
                     </ft-switch>
                 `;case"DICHOTOMOUS":const i="DICHOTOMOUS"===this.ratingType&&0===this.ratingValue,n="DICHOTOMOUS"===this.ratingType&&1===this.ratingValue;return tt`
-                    <ft-switch @change=${t=>this.rate(t.detail)}
+                    <ft-switch unselectable
+                               @change=${t=>this.rate(t.detail)}
                                part="rating rating-dichotomous">
                         <ft-switch-option .value=${1}
                                           ?selected=${n}>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-reader-feedback",
-  "version": "1.0.21",
+  "version": "1.0.22",
   "description": "Feedback forms for a map and its topics in an integrated reader",
   "keywords": [
     "Lit"
@@ -19,10 +19,10 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-app-context": "1.0.21",
-    "@fluid-topics/ft-reader-context": "1.0.21",
-    "@fluid-topics/ft-wc-utils": "1.0.21",
+    "@fluid-topics/ft-app-context": "1.0.22",
+    "@fluid-topics/ft-reader-context": "1.0.22",
+    "@fluid-topics/ft-wc-utils": "1.0.22",
     "lit": "2.7.2"
   },
-  "gitHead": "e07f560e1fb9643e4a6719839de529952c1f70fa"
+  "gitHead": "d68f9748c223f9e8eb8da2da4f410e02a2121d36"
 }