turbo_boost-elements 0.0.13 → 0.0.14
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/app/assets/builds/@turbo-boost/elements.js +2 -2
- data/app/assets/builds/@turbo-boost/elements.js.map +2 -2
- data/app/javascript/elements/toggle_elements/target_element/index.js +15 -3
- data/app/javascript/elements/toggle_elements/trigger_element/index.js +3 -7
- data/lib/turbo_boost/elements/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 77c9cd04b03c7a17490ec8629f6228021713ab5ae446e53e4493df10f95c6116
|
|
4
|
+
data.tar.gz: 5d80a6b28a3ee091e4dc8ff370e2da025f344f6c534b373e59e7a85e0c4627a0
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: a5f3e6bb874f87f1edcb4f97b5c5664b9fed20aadbd5d7a66d71c3d270125b3be924de12e2fc3a4b7af4660ecb26c1f1c2ec0a4c25e4d781a744784bf3d93d28
|
|
7
|
+
data.tar.gz: cf332ae059c01f8c1b570d63422896a1b682376821626af88023e4d67374b5286037f0163fa5e2e720da8ba62913ae85f45eb6a83c38fae01df56f9e078fb0ff
|
data/README.md
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
</h1>
|
|
5
5
|
<p align="center">
|
|
6
6
|
<a href="http://blog.codinghorror.com/the-best-code-is-no-code-at-all/">
|
|
7
|
-
<img alt="Lines of Code" src="https://img.shields.io/badge/loc-
|
|
7
|
+
<img alt="Lines of Code" src="https://img.shields.io/badge/loc-1378-47d299.svg" />
|
|
8
8
|
</a>
|
|
9
9
|
<a href="https://codeclimate.com/github/hopsoft/turbo_boost-elements/maintainability">
|
|
10
10
|
<img src="https://api.codeclimate.com/v1/badges/7aac6daed3e4032e292e/maintainability" />
|
|
@@ -7,7 +7,7 @@ ${n?'Expression: "'+n+`"
|
|
|
7
7
|
<slot name="busy" hidden></slot>
|
|
8
8
|
<slot></slot>
|
|
9
9
|
</turbo-boost>
|
|
10
|
-
`,_o=100,Tn=400,de=class extends ce{constructor(){super(Rl)}showBusyElement(){clearTimeout(this.showBusyElementTimeout),clearTimeout(this.hideBusyElementTimeout),this.busyElement&&(this.busyStartedAt=Date.now()+_o,this.showBusyElementTimeout=setTimeout(()=>{this.busySlotElement.hidden=!1,this.defaultSlotElement.hidden=!0},_o))}hideBusyElement(){if(clearTimeout(this.showBusyElementTimeout),clearTimeout(this.hideBusyElementTimeout),!this.busyElement)return;let t=Tn-(Date.now()-this.busyStartedAt);t<0&&(t=0),delete this.busyStartedAt,this.hideBusyElementTimeout=setTimeout(()=>{this.busySlotElement.hidden=!0,this.defaultSlotElement.hidden=!1},t)}get busyElement(){return this.querySelector(':scope > [slot="busy"]')}get busySlotElement(){return this.shadowRoot.querySelector('slot[name="busy"]')}get defaultSlotElement(){return this.shadowRoot.querySelector("slot:not([name])")}get busy(){return this.getAttribute("busy")==="true"}set busy(t){t=!!t,this.busy!==t&&(this.setAttribute("busy",t),t?this.showBusyElement():this.hideBusyElement())}get busyStartedAt(){return this.dataset.busyStartedAt?Number(this.dataset.busyStartedAt):0}set busyStartedAt(t){this.dataset.busyStartedAt=t}};var We=class extends de{connectedCallback(){super.connectedCallback(),this.mouseenterHandler=this.onMouseenter.bind(this),this.addEventListener("mouseenter",this.mouseenterHandler),this.collapseHandler=this.collapse.bind(this),this.collapseNowHandler=this.collapseNow.bind(this),this.collapseOn.forEach(t=>{let n=t.split("@"),r=n[0];n.length>1?(n[1].match(/^self|window$/)?self:self[n[1]]).addEventListener(r,this.collapseNowHandler):this.addEventListener(r,this.collapseHandler)})}disconnectedCallback(){this.removeEventListener("mouseenter",this.mouseenterHandler),this.collapseOn.forEach(t=>{let n=t.split("@"),r=n[0];n.length>1?(n[1].match(/^self|window$/)?self:self[n[1]]).removeEventListener(r,this.collapseNowHandler):this.removeEventListener(r,this.collapseHandler)})}cacheHTML(){}renderCachedHTML(){}onMouseenter(){clearTimeout(this.collapseTimeout)}collapse(t=250){if(clearTimeout(this.collapseTimeout)
|
|
10
|
+
`,_o=100,Tn=400,de=class extends ce{constructor(){super(Rl)}showBusyElement(){clearTimeout(this.showBusyElementTimeout),clearTimeout(this.hideBusyElementTimeout),this.busyElement&&(this.busyStartedAt=Date.now()+_o,this.showBusyElementTimeout=setTimeout(()=>{this.busySlotElement.hidden=!1,this.defaultSlotElement.hidden=!0},_o))}hideBusyElement(){if(clearTimeout(this.showBusyElementTimeout),clearTimeout(this.hideBusyElementTimeout),!this.busyElement)return;let t=Tn-(Date.now()-this.busyStartedAt);t<0&&(t=0),delete this.busyStartedAt,this.hideBusyElementTimeout=setTimeout(()=>{this.busySlotElement.hidden=!0,this.defaultSlotElement.hidden=!1},t)}get busyElement(){return this.querySelector(':scope > [slot="busy"]')}get busySlotElement(){return this.shadowRoot.querySelector('slot[name="busy"]')}get defaultSlotElement(){return this.shadowRoot.querySelector("slot:not([name])")}get busy(){return this.getAttribute("busy")==="true"}set busy(t){t=!!t,this.busy!==t&&(this.setAttribute("busy",t),t?this.showBusyElement():this.hideBusyElement())}get busyStartedAt(){return this.dataset.busyStartedAt?Number(this.dataset.busyStartedAt):0}set busyStartedAt(t){this.dataset.busyStartedAt=t}};var We=class extends de{connectedCallback(){super.connectedCallback(),this.mouseenterHandler=this.onMouseenter.bind(this),this.addEventListener("mouseenter",this.mouseenterHandler),this.collapseHandler=this.collapse.bind(this),this.collapseNowHandler=this.collapseNow.bind(this),this.collapseOn.forEach(t=>{let n=t.split("@"),r=n[0];n.length>1?(n[1].match(/^self|window$/)?self:self[n[1]]).addEventListener(r,this.collapseNowHandler):this.addEventListener(r,this.collapseHandler)})}disconnectedCallback(){this.removeEventListener("mouseenter",this.mouseenterHandler),this.collapseOn.forEach(t=>{let n=t.split("@"),r=n[0];n.length>1?(n[1].match(/^self|window$/)?self:self[n[1]]).removeEventListener(r,this.collapseNowHandler):this.removeEventListener(r,this.collapseHandler)})}cacheHTML(){}renderCachedHTML(){}onMouseenter(){clearTimeout(this.collapseTimeout)}collapse(t=250){if(clearTimeout(this.collapseTimeout),!this.busy){if(typeof t!="number"&&(t=250),t>0)return this.collapseTimeout=setTimeout(()=>this.collapse(0),t);this.innerHTML="";try{this.expanded=!1,this.triggerElement.hideDevtool()}catch(n){}}}collapseNow(t){t.target.closest("turbo-boost-devtool-tooltip")||this.collapse(0)}collapseMatches(){document.querySelectorAll(this.collapseSelector).forEach(t=>{t.id!==this.id&&t.collapse&&t.collapse(0)})}get collapseSelector(){return this.triggerElement.collapseSelector||this.getAttribute("collapse-selector")}get focusSelector(){return this.getAttribute("focus-selector")}get triggerElement(){return document.getElementById(this.labeledBy)}get triggerElements(){return document.querySelectorAll(`[aria-controls="${this.id}"]`)}get labeledBy(){return this.getAttribute("aria-labeledby")}set labeledBy(t){return this.setAttribute("aria-labeledby",t)}get collapseOn(){let t=this.getAttribute("collapse-on");return t?JSON.parse(t):[]}get expanded(){return this.triggerElement?this.triggerElement.expanded:!1}set expanded(t){this.triggerElements.forEach(n=>n.expanded=t)}get busy(){return this.triggerElement&&this.triggerElement.busy}};function Dl(e){let t=document.createElement("template");return t.innerHTML=e,t}function Ve(e,t){t=t||document.body;let r=Dl(e).content.cloneNode(!0).querySelector("*");return t.appendChild(r)}function St(e,t={}){if(!e)return;At(e);let{outline:n,outlineOffset:r}=t;n=n||"dashed 3px red",r=r||"0px",e.originalStyles=e.originalStyles||{display:e.style.display,minHeight:e.style.minHeight,minWidth:e.style.minWidth,outline:e.style.outline,outlineOffset:e.style.outlineOffset},getComputedStyle(e).display.match(/^inline$/i)&&e.offsetWidth===0&&e.offsetHeight===0&&(e.style.display="inline-block",e.style.minHeight="2px",e.style.minWidth="2px"),e.style.outline=n,e.style.outlineOffset=r,e.dataset.turboBoostHighlight=!0}function At(e){if(e){if(e.originalStyles){for(let[t,n]of Object.entries(e.originalStyles))n?e.style[t]=n:e.style[t]="";delete e.originalStyles}delete e.dataset.turboBoostHighlight}}function Ct(e){if(!e)return{};let t=e.getBoundingClientRect(),n=e.offsetWidth,r=e.offsetHeight,o=t.top+window.scrollY,i=t.left+window.scrollX,s=i+n,l=o+r;return{top:o,left:i,right:s,bottom:l,width:n,height:r}}function ke(e){try{e()}catch(t){}}var Ue=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=this.html,this.labelElement.addEventListener("click",t=>{t.preventDefault(),this.toggle()}),this.checkboxElement.addEventListener("change",t=>this.dispatchEvent(new CustomEvent("change",{bubbles:!0})))}toggle(){this.checked?this.uncheck():this.check()}check(){this.checkboxElement.checked=!0,this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}uncheck(){this.checkboxElement.checked=!1,this.dispatchEvent(new CustomEvent("change",{bubbles:!0}))}get name(){return this.getAttribute("name")}get checked(){return this.checkboxElement.checked}get checkboxElement(){return this.shadowRoot.querySelector("input")}get labelElement(){return this.shadowRoot.querySelector("label")}get html(){return`
|
|
11
11
|
<style>${this.stylesheet}</style>
|
|
12
12
|
<div>
|
|
13
13
|
<input name="checkbox" type="checkbox">
|
|
@@ -238,5 +238,5 @@ ${n?'Expression: "'+n+`"
|
|
|
238
238
|
<b>View Stack</b>
|
|
239
239
|
</div>
|
|
240
240
|
${i}
|
|
241
|
-
`;let s=Cn(r,o,i,{backgroundColor:"lavender",color:"blueviolet"}),l=Ct(this.triggerElement),a=Math.ceil(l.top-s.offsetHeight*2),u=Math.ceil(l.left+l.width+s.offsetWidth/3);return s.style.top=`${a}px`,s.style.left=`${u}px`,s.line=new LeaderLine(this.triggerElement,s,K(J({},this.leaderLineOptions),{color:"blueviolet"})),t&&(s.lineToTarget=new LeaderLine(s,t,K(J({},this.leaderLineOptions),{color:"blueviolet",middleLabel:"toggles",size:2.1})),t.drag.onMove=()=>{t.line.position(),s.lineToTarget.position(),s.lineToRendering.position()}),n&&(s.lineToRendering=new LeaderLine(s,n,K(J({},this.leaderLineOptions),{color:"blueviolet",middleLabel:"renders & morphs",size:2.1})),n.drag.onMove=()=>{n.line.position(),s.lineToTarget&&s.lineToTarget.position(),s.lineToRendering.position()}),s.drag=new PlainDraggable(s),s.drag.onMove=()=>{s.line.position(),s.lineToTarget&&s.lineToTarget.position(),s.lineToRendering&&s.lineToRendering.position()},s}get leaderLineOptions(){return{dash:{animation:!0},dropShadow:{opacity:.3},endPlug:"arrow3",endPlugSize:1.7,size:3,startPlug:"disc",startPlugSize:1}}};var So;function Vl(e){["bold","bullet","code","heading1","href","italic","number","quote","strike"].forEach(n=>e.deactivateAttribute(n))}function Ul(e){if(e.value.length===0)return;let t=e.editor,n=[];for(;n[0]!==t.getSelectedRange()[0]&&n[1]!==t.getSelectedRange()[1];)n=t.getSelectedRange(),t.moveCursorInDirection("forward");t.insertString(" "),t.moveCursorInDirection("forward"),t.setSelectedRange([n[1],t.getSelectedRange()[1]]),Vl(t),t.setSelectedRange([t.getSelectedRange()[1],t.getSelectedRange()[1]])}function Jl(e){clearTimeout(So),So=setTimeout(()=>{if(!e)return;e.focus();let t=e.closest("trix-editor");try{t?Ul(t):e.selectionStart=e.selectionEnd=e.value.length}catch(n){}finally{e.scrollIntoView({block:"center",behavior:"smooth"})}},100)}var Ao=e=>Jl(e);var Co,Ye=class extends de{connectedCallback(){super.connectedCallback();let{start:t}=TurboBoost.Commands.events;this.commandStartHandler=this.onCommandStart.bind(this),this.addEventListener(t,this.commandStartHandler);let{before:n}=TurboBoost.Streams.invokeEvents;this.beforeInvokeHandler=this.onBeforeInvoke.bind(this),addEventListener(n,this.beforeInvokeHandler),this.initializeDevtool()}disconnectedCallback(){setTimeout(()=>{let{start:t}=TurboBoost.Commands.events;this.removeEventListener(t,this.commandStartHandler);let{before:n}=TurboBoost.Streams.invokeEvents;removeEventListener(n,this.beforeInvokeHandler),this.devtool.hide({active:!1}),this.devtool.unregisterEventListeners(),delete this.devtool},1e3)}initializeDevtool(){let t=()=>this.devtool.show();addEventListener("turbo-boost:devtools-start",()=>{this.devtool=new Ze(this),this.addEventListener("mouseenter",t)}),addEventListener("turbo-boost:devtools-stop",()=>{this.removeEventListener("mouseenter",t),this.devtool.hide({active:!1}),this.devtool.unregisterEventListeners(),delete this.devtool}),this.dispatchEvent(new CustomEvent("turbo-boost:devtools-connect",{bubbles:!0}))}hideDevtool(){this.devtool&&this.devtool.hide({active:!1})}onCommandStart(t){Co=this.focusSelector,this.targetElement.labeledBy=this.id,this.targetElement.collapseMatches(),this.
|
|
241
|
+
`;let s=Cn(r,o,i,{backgroundColor:"lavender",color:"blueviolet"}),l=Ct(this.triggerElement),a=Math.ceil(l.top-s.offsetHeight*2),u=Math.ceil(l.left+l.width+s.offsetWidth/3);return s.style.top=`${a}px`,s.style.left=`${u}px`,s.line=new LeaderLine(this.triggerElement,s,K(J({},this.leaderLineOptions),{color:"blueviolet"})),t&&(s.lineToTarget=new LeaderLine(s,t,K(J({},this.leaderLineOptions),{color:"blueviolet",middleLabel:"toggles",size:2.1})),t.drag.onMove=()=>{t.line.position(),s.lineToTarget.position(),s.lineToRendering.position()}),n&&(s.lineToRendering=new LeaderLine(s,n,K(J({},this.leaderLineOptions),{color:"blueviolet",middleLabel:"renders & morphs",size:2.1})),n.drag.onMove=()=>{n.line.position(),s.lineToTarget&&s.lineToTarget.position(),s.lineToRendering.position()}),s.drag=new PlainDraggable(s),s.drag.onMove=()=>{s.line.position(),s.lineToTarget&&s.lineToTarget.position(),s.lineToRendering&&s.lineToRendering.position()},s}get leaderLineOptions(){return{dash:{animation:!0},dropShadow:{opacity:.3},endPlug:"arrow3",endPlugSize:1.7,size:3,startPlug:"disc",startPlugSize:1}}};var So;function Vl(e){["bold","bullet","code","heading1","href","italic","number","quote","strike"].forEach(n=>e.deactivateAttribute(n))}function Ul(e){if(e.value.length===0)return;let t=e.editor,n=[];for(;n[0]!==t.getSelectedRange()[0]&&n[1]!==t.getSelectedRange()[1];)n=t.getSelectedRange(),t.moveCursorInDirection("forward");t.insertString(" "),t.moveCursorInDirection("forward"),t.setSelectedRange([n[1],t.getSelectedRange()[1]]),Vl(t),t.setSelectedRange([t.getSelectedRange()[1],t.getSelectedRange()[1]])}function Jl(e){clearTimeout(So),So=setTimeout(()=>{if(!e)return;e.focus();let t=e.closest("trix-editor");try{t?Ul(t):e.selectionStart=e.selectionEnd=e.value.length}catch(n){}finally{e.scrollIntoView({block:"center",behavior:"smooth"})}},100)}var Ao=e=>Jl(e);var Co,Ye=class extends de{connectedCallback(){super.connectedCallback();let{start:t}=TurboBoost.Commands.events;this.commandStartHandler=this.onCommandStart.bind(this),this.addEventListener(t,this.commandStartHandler);let{before:n}=TurboBoost.Streams.invokeEvents;this.beforeInvokeHandler=this.onBeforeInvoke.bind(this),addEventListener(n,this.beforeInvokeHandler),this.initializeDevtool()}disconnectedCallback(){setTimeout(()=>{let{start:t}=TurboBoost.Commands.events;this.removeEventListener(t,this.commandStartHandler);let{before:n}=TurboBoost.Streams.invokeEvents;removeEventListener(n,this.beforeInvokeHandler),this.devtool.hide({active:!1}),this.devtool.unregisterEventListeners(),delete this.devtool},1e3)}initializeDevtool(){let t=()=>this.devtool.show();addEventListener("turbo-boost:devtools-start",()=>{this.devtool=new Ze(this),this.addEventListener("mouseenter",t)}),addEventListener("turbo-boost:devtools-stop",()=>{this.removeEventListener("mouseenter",t),this.devtool.hide({active:!1}),this.devtool.unregisterEventListeners(),delete this.devtool}),this.dispatchEvent(new CustomEvent("turbo-boost:devtools-connect",{bubbles:!0}))}hideDevtool(){this.devtool&&this.devtool.hide({active:!1})}onCommandStart(t){Co=this.focusSelector,this.targetElement.labeledBy=this.id,this.targetElement.collapseMatches(),this.busy=!0}onBeforeInvoke(t){if(t.detail.method!=="morph"||t.target.id!==this.morphs)return;let n=`turbo-boost-toggle-target[aria-labeledby="${this.id}"]`;if(!t.target.querySelector(n))return;let r=Date.now()-this.busyStartedAt,o=Tn-r;o<10&&(o=10),t.detail.invoke={delay:o},setTimeout(()=>{this.busy=!1,this.morphToggleTriggerElements.forEach(i=>i.busy=!1)},o-10),setTimeout(()=>Ao(this.targetElement.querySelector(Co)),o+100)}get sharedViews(){if(!this.targetElement)return[];if(!this.targetElement.viewStack)return[];let t=(n,r)=>(this.targetElement.viewStack.includes(r)&&n.push(r),n);return this.viewStack.reduce(t.bind(this),[])}get renders(){return this.getAttribute("renders")}get morphs(){return this.getAttribute("morphs")}get morphElement(){return this.morphs?document.getElementById(this.morphs):null}get morphToggleTriggerElements(){return Array.from(this.morphElement.querySelectorAll("turbo-boost-toggle-trigger"))}get controls(){return this.getAttribute("aria-controls")}get targetElement(){return this.controls?document.getElementById(this.controls):null}get collapseSelector(){return this.getAttribute("collapse-selector")}get focusSelector(){return this.getAttribute("focus-selector")||this.targetElement.focusSelector}get remember(){return this.getAttribute("remember")==="true"}set remember(t){return this.setAttribute("remember",!!t)}get expanded(){return this.getAttribute("aria-expanded")==="true"}set expanded(t){this.setAttribute("aria-expanded",!!t)}get collapsed(){return!this.expanded}};customElements.define("turbo-boost",ce);customElements.define("turbo-boost-toggle-target",We);customElements.define("turbo-boost-toggle-trigger",Ye);var{restart:Kl,start:Xl,stop:Gl}=Ge,Oo={restart:Kl,start:Xl,stop:Gl};self.TurboBoost=self.TurboBoost||{};self.TurboBoost.devtools=Oo;self.TurboBoost.Elements={};var Ja=self.TurboBoost.Elements;export{Ja as default};
|
|
242
242
|
//# sourceMappingURL=elements.js.map
|