handlebars-editor-react 0.1.3 → 0.1.4
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.
- package/dist/index.cjs +3 -3
- package/dist/index.js +3 -3
- package/dist/styles.css +22 -3
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),ne=require('handlebars'),reactDom=require('react-dom'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ne__default=/*#__PURE__*/_interopDefault(ne);var
|
|
2
|
-
`);H.setInput(t);try{for(let e=H.lex();e!==H.EOF;e=H.lex()){let r=Te[e]||"UNKNOWN",s=H.yylloc;n.push({type:r,text:H.yytext,start:le(o,s.first_line,s.first_column),end:le(o,s.last_line,s.last_column)});}}catch{}return n}function Me(t){return t.map(n=>n.type==="ID"&&n.text==="."?{...n,type:"SEP"}:n.type==="ID"&&n.text==="="?{...n,type:"EQUALS"}:n)}function Ve(t){let n=[],o=null,e=false,r=false,s=0;for(let l=0;l<t.length;l++){let i=t[l],d=t[l-1];ve(i.type)?(pe(i.type)?o=i.type==="OPEN_ENDBLOCK"?"block-close":"block-open":fe(i.type)?o="partial":ue(i.type)&&(o="mustache"),r=false,s=0):we(i.type)&&(o=null,r=false,s=0),i.type==="OPEN_BLOCK_PARAMS"?e=true:i.type==="CLOSE_BLOCK_PARAMS"&&(e=false),i.type==="SEP"?s++:i.type==="ID"&&d?.type!=="SEP"&&d?.type!=="DATA"&&(s=0);let O=false;if(i.type==="ID"){if(s===0)O=r;else for(let k=l-1;k>=0;k--)if(t[k].type==="ID"&&n[k]?.context.pathRootAfterHelper!==void 0){let x=t[k-1];if(x?.type!=="SEP"&&x?.type!=="DATA"){O=n[k].context.pathRootAfterHelper;break}}}n.push({...i,context:{type:o,isInBlockParams:e,pathRootAfterHelper:O}}),i.type==="ID"&&s===0&&!e&&d?.type!=="EQUALS"&&d?.type!=="DATA"&&(r=true);}return n}function Ke(t,n,o){let{context:e}=t;return t.text==="this"?"data-var":e.isInBlockParams?"block-param":o?.type==="EQUALS"?"hash-key":n?.type==="EQUALS"?"hash-value":n?.type==="DATA"?"data-var":n?.type==="SEP"?e.pathRootAfterHelper?"helper-arg":"variable-path":Ue(t,n,o)}function Ue(t,n,o){let{context:e}=t;return e.type==="block-open"||e.type==="block-close"?pe(n?.type??"")?"block-keyword":"helper-arg":e.type==="partial"?fe(n?.type??"")?"helper":"helper-arg":n?.type==="OPEN_SEXPR"?"helper":e.type==="mustache"?ue(n?.type??"")?o?.type==="SEP"?"variable":o&&De(o.type)?"helper":"variable":"helper-arg":"variable"}function We(t){return t.map((n,o)=>{let e=t[o-1],r=t[o+1],s;return n.type==="ID"?s=Ke(n,e,r):s=Be[n.type]||"text",{token:n,highlightType:s}})}function ze(t,n){let o=[],e=0;for(let r=0;r<n.length;r++){let{token:s,highlightType:l}=n[r];if(s.start>e&&o.push({type:"text",value:t.slice(e,s.start),start:e,end:s.start}),s.type==="DATA"){let i=n[r+1];if(i?.token.type==="ID"&&i.token.start===s.end){o.push({type:"data-var",value:t.slice(s.start,i.token.end),start:s.start,end:i.token.end}),e=i.token.end,r++;continue}}o.push({type:l,value:t.slice(s.start,s.end),start:s.start,end:s.end}),e=s.end;}return e<t.length&&o.push({type:"text",value:t.slice(e),start:e,end:t.length}),o}function M(t){if(!t)return [];let n=He(t),o=Me(n),e=Ve(o),r=We(e);return ze(t,r).filter(l=>l.value.length>0)}var J=["if","unless","each","with"],de=new Set([...J,"lookup","log","this","else"]),he=new Set(["each","with"]),$e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR"]),me=ne__default.default.Parser,D=me.lexer,Fe=me.terminals_;function j(t){return de.has(t)||t.startsWith("@")}function Xe(t){return $e.has(t.name)}function q(t,n){let o=[],e=true;for(let r=n;r<t.length;r++){let s=t[r];if(s.name==="EQUALS")break;if(s.name==="ID"){if(!e||t[r+1]?.name==="EQUALS")break;o.push(s.text),e=false;}else if(s.name==="SEP")e=true;else break}return o}function Qe(t,n,o,e){return {name:t,path:n,type:o?"block":n.includes(".")||e?"nested":"simple",blockType:o,context:e}}function Ge(t){let n=[],o=null;for(let e of t)he.has(e.helper)&&e.context&&(o||(o=e.context),n.push(e.helper==="each"?`${e.context}[]`:e.context));return n.length===0||!o?null:{root:o,prefix:`${n.join(".")}.`}}function je(t){let n=[],o=t;for(;o.length>0;){let e=qe(o);if(n.push(...e.expressions),e.consumed===o.length)break;let r=o.slice(e.consumed),s=r.search(/\{\{/);if(s===-1)break;o=r.slice(s);}return {expressions:n}}function qe(t){D.setInput(t),D.conditionStack=["INITIAL"];let n=[],o=0,e=false,r=null,s=[];try{for(let l=D.lex();l!==D.EOF;l=D.lex()){let i=Fe[l],d=D.yytext;if(o=D.yylloc?.last_column??o,!(i==="OPEN_RAW_BLOCK"||i==="CLOSE_RAW_BLOCK"||i==="END_RAW_BLOCK")){if(i==="OPEN"||i==="OPEN_UNESCAPED"){e=!0,r="mustache",s=[];continue}if(i==="OPEN_PARTIAL"||i==="OPEN_PARTIAL_BLOCK"){e=!0,r="partial",s=[];continue}if(i==="OPEN_BLOCK"||i==="OPEN_INVERSE"||i==="OPEN_INVERSE_CHAIN"){e=!0,r="block",s=[];continue}if(i==="OPEN_ENDBLOCK"){e=!0,r="endblock",s=[];continue}if(i==="CLOSE"||i==="CLOSE_UNESCAPED"){if(r){let O=s[0]?.text??null;n.push({type:r,tokens:[...s],helperName:O});}e=!1,s=[];continue}e&&s.push({name:i,text:d});}}return {expressions:n,consumed:t.length}}catch{return {expressions:n,consumed:o}}}function Ye(t,n,o){let e=t.tokens;if(e.length===0||e[0]?.name==="DATA")return;let r=e[0]?.text;if(j(r))F(e,1,n,o);else {let s=q(e,0);if(s.length>0){let i=s.length*2-1,d=e[i];d&&Xe(d)?F(e,i,n,o):Y(s,n,o);}}}function Je(t,n,o){let e=t.tokens,r=e[0]?.text;if(he.has(r)){if(e[1]?.name==="OPEN_SEXPR")return F(e,1,n,o),{helper:r,context:""};{let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);return l.length>0&&!j(l[0])&&Y(l,n,o,r),{helper:r,context:l[0]||""}}return {helper:r,context:""}}}else if(de.has(r)){if(e[1]?.name==="OPEN_SEXPR")F(e,1,n,o);else {let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);l.length>0&&!j(l[0])&&Y(l,n,o,r);}}return {helper:r,context:""}}return {helper:r,context:""}}function Ze(t,n,o){let e=t.tokens,r=1;for(;r<e.length&&(e[r].name==="SEP"||e[r].name==="ID")&&!(e[r].name==="ID"&&e[r-1]?.name!=="SEP");)r++;F(e,r,n,o);}function F(t,n,o,e){for(let r=n;r<t.length;r++){let s=t[r];if(!(s.name==="OPEN_SEXPR"||s.name==="CLOSE_SEXPR")&&s.name!=="DATA"&&t[r-1]?.name!=="DATA"&&s.name!=="EQUALS"&&!(s.name==="ID"&&t[r+1]?.name==="EQUALS")&&s.name==="ID"&&!j(s.text)){if(t[r-1]?.name==="OPEN_SEXPR")continue;let i=q(t,r);i.length>0&&(Y(i,o,e),r+=i.length*2-2);}}}function Y(t,n,o,e){let r=t[0],s=n.contextPrefix&&n.rootContext?{prefix:n.contextPrefix,root:n.rootContext}:null,l,i;s?(l=s.prefix+t.join("."),i=s.root):(l=t.join("."),i=void 0),o.has(l)||o.set(l,Qe(r,l,e,i));}function et(t,n){return n.type==="endblock"&&t.length>0?t.slice(0,-1):t}function tt(t){let n=new Map,o=[];for(let e of t){let r=Ge(o),s={contextPrefix:r?.prefix??null,rootContext:r?.root??null};if(e.type==="mustache")Ye(e,s,n);else if(e.type==="block"){let l=Je(e,s,n);o=[...o,l];}else e.type==="partial"?Ze(e,s,n):e.type==="endblock"&&(o=et(o,e));}return Array.from(n.values())}function oe(t){let{expressions:n}=je(t),o=tt(n),e=[...new Set(o.filter(r=>!r.context).map(r=>r.name))];return {variables:o,rootVariables:e}}function nt(t,n,o){if(!n)return t;let e=o?.helpers?ne__default.default.create():ne__default.default;if(o?.helpers)for(let[r,s]of Object.entries(o.helpers))e.registerHelper(r,s);return e.compile(t)(n)}var ot=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize","whiteSpace","wordWrap","wordBreak","overflowWrap"];function be(t,n){let o=getComputedStyle(t),e=document.createElement("div");e.id="hbs-caret-mirror",document.body.appendChild(e);let r=e.style;r.position="absolute",r.visibility="hidden",r.whiteSpace="pre-wrap",r.wordWrap="break-word";for(let x of ot)r[x]=o[x];r.width=`${t.clientWidth}px`,r.height="auto",r.overflow="hidden";let s=t.value.substring(0,n);e.textContent=s;let l=document.createElement("span");l.textContent="\u200B",e.appendChild(l);let i=t.value.substring(n);i&&e.appendChild(document.createTextNode(i));let d=l.getBoundingClientRect(),O=e.getBoundingClientRect(),k={top:d.top-O.top,left:d.left-O.left,height:parseFloat(o.lineHeight)||parseFloat(o.fontSize)*1.2};return document.body.removeChild(e),k}var at=160,se=200,X=10,it=["--hbs-color-text","--hbs-color-border","--hbs-color-placeholder","--hbs-color-focus-ring","--hbs-color-autocomplete-bg","--hbs-color-autocomplete-selected"];function Ee({textareaRef:t,containerRef:n,triggerPosition:o,isOpen:e,children:r,listboxId:s}){let[l,i]=react.useState({top:void 0,bottom:void 0,left:0,maxHeight:se,visible:false}),[d,O]=react.useState({});react.useEffect(()=>{if(!e||!n.current)return;let E=getComputedStyle(n.current),P={};for(let c of it){let u=E.getPropertyValue(c).trim();u&&(P[c]=u);}O(P);},[e,n]);let k=react.useCallback(()=>{let E=t.current;if(!E||!e){i(m=>({...m,visible:false}));return}let P=E.getBoundingClientRect(),c=be(E,o),u=E.scrollTop,S=E.scrollLeft,N=P.top+c.top-u,V=P.left+c.left-S,g=c.height,K=window.innerHeight,ee=window.innerWidth,R=K-N-g-X,Q=N-X,te=R<120&&Q>R,w,U,W;te?(W=Math.min(se,Math.max(80,Q)),U=K-N+X,w=void 0):(W=Math.min(se,Math.max(80,R)),w=N+g,U=void 0);let z=V,G=ee-at-X;z>G&&(z=Math.max(X,G));let a=c.top-u>=0&&c.top-u<E.clientHeight,p=c.left-S>=0&&c.left-S<E.clientWidth;i({top:w,bottom:U,left:z,maxHeight:W,visible:a&&p});},[t,o,e]);if(react.useEffect(()=>{k();},[k]),react.useEffect(()=>{if(!e)return;let E=()=>{k();};return window.addEventListener("scroll",E,true),window.addEventListener("resize",E),()=>{window.removeEventListener("scroll",E,true),window.removeEventListener("resize",E);}},[e,k]),!e||!l.visible)return null;let x={top:l.top,bottom:l.bottom,left:l.left,maxHeight:l.maxHeight,...d};return reactDom.createPortal(jsxRuntime.jsx("div",{id:s,role:"listbox","aria-label":"Autocomplete suggestions",className:"hbs-autocomplete-portal",style:x,children:r}),document.body)}var ut=["this","@index","@first","@last","@key"],ft=["@root"];function dt(t,n){if(!n)return "prefix";let o=t.toLowerCase(),e=n.toLowerCase();return o===e?"exact":o.startsWith(e)?"prefix":o.includes(e)?"partial":"none"}function ht(t,n,o,e,r){let s=[],l=new Set,i=r.lastIndexOf("."),d=i!==-1;d?r.slice(0,i+1):"";let k=d?r.slice(i+1):r,x=(c,u)=>{if(l.has(c))return;let S=dt(c,k);S!=="none"&&(l.add(c),s.push({option:{value:c,type:u},matchType:S}));};if(d){let c=r.slice(0,i).replace(/\[\]$/,"");n.forEach(u=>{let S=u.path.replace(/\[\]/g,"");if(S.startsWith(`${c}.`)){let V=S.slice(c.length+1).split(".")[0];x(V,"variable");}});}else {if(!o){for(let u of J)x(`#${u}`,"block-open");for(let u of J)x(`/${u}`,"block-close");x("else","block-close");}for(let u of t)x(u,"helper");if(e){if(e.isEach)for(let u of ut)x(u,"data-var");for(let u of e.blockParams)x(u,"variable");for(let u of ft)x(u,"data-var");}let c=new Set;for(let u of n){let S=u.path.split(".")[0].replace("[]","");c.add(S);}for(let u of c)x(u,"variable");}let E={"data-var":0,variable:1,helper:2,"block-open":3,"block-close":4},P={exact:0,prefix:1,partial:2,none:3};return s.sort((c,u)=>{let S=P[c.matchType]-P[u.matchType];if(S!==0)return S;let N=E[c.option.type]-E[u.option.type];return N!==0?N:c.option.value.localeCompare(u.option.value)}),s.map(c=>c.option)}function mt(t,n){let o=t.slice(0,n),e=[],r=/\{\{#(each|with)\s+([^\s}]+)(?:\s+as\s*\|([^|]+)\|)?|\{\{\/(each|with)\}\}/g;for(let s of o.matchAll(r))if(s[1]){let l=s[1],i=s[2],O=(s[3]||"").split(/\s+/).filter(Boolean);e.push({type:l,variable:i,blockParams:O,isEach:l==="each"});}else if(s[4]){let l=s[4];for(let i=e.length-1;i>=0;i--)if(e[i].type===l){e.splice(i,1);break}}return e.length>0?e[e.length-1]:null}function bt(t,n){let o=t.slice(0,n),e=o.lastIndexOf("{{!--");if(e!==-1&&o.slice(e).indexOf("--}}")===-1)return true;let r=o.lastIndexOf("{{!");if(r!==-1){let s=o.slice(r);if(!s.startsWith("{{!--")&&s.indexOf("}}")===-1)return true}return false}function xt(t,n){let o=t.slice(0,n),e=t.slice(n),r=o.lastIndexOf("{{");if(r===-1||o.slice(r).includes("}}"))return false;let l=e.indexOf("}}");return l===-1?false:!e.slice(0,l).includes("{{")}function ye({value:t,onChange:n,placeholder:o="Enter template...",readOnly:e=false,className:r="",style:s,theme:l,customHelpers:i=[],autocomplete:d=true,minHeight:O=100}){let k=react.useRef(null),x=react.useRef(null),E=react.useRef(null),P=react.useId(),[c,u]=react.useState({isOpen:false,options:[],selectedIndex:0,triggerStart:0,filterText:"",isRaw:false,contextPath:null}),S=react.useMemo(()=>oe(t).variables.map(p=>({path:p.path,context:p.context})),[t]),N=react.useMemo(()=>M(t),[t]),V=react.useMemo(()=>t?N.map(a=>a.type==="text"?a.value:jsxRuntime.jsx("span",{className:`hbs-token-${a.type}`,children:a.value},a.start)):jsxRuntime.jsx("span",{className:"hbs-editor-placeholder",children:o}),[N,t,o]),g=react.useCallback(()=>{u(a=>({...a,isOpen:false}));},[]),K=react.useCallback((a,p)=>{if(!d||e){g();return}if(bt(a,p)||xt(a,p)){g();return}let m=a.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/);if(!m){g();return}let y=m[1],f=m[2]||"",C=p-f.length,b=y==="{{{";if(f.includes("}")){g();return}let T=mt(a,p),A=ht(i,S,b,T,f);if(A.length===0){g();return}u({isOpen:true,options:A,selectedIndex:0,triggerStart:C,filterText:f,isRaw:b,contextPath:T});},[d,e,i,S,g]),ee=react.useCallback(a=>{let p=a.target.value;n?.(p),K(p,a.target.selectionStart);},[n,K]),R=react.useCallback(a=>{let p=x.current;if(!p)return;let{triggerStart:h,filterText:m,isRaw:y}=c,f=y?"}}}":"}}",C=m.lastIndexOf("."),b=C!==-1?m.slice(0,C+1):"",T,A;if(a.type==="block-open"&&!y){let I=a.value.slice(1);T=`${a.value} }}{{/${I}}}`,A=a.value.length+1;}else a.type!=="block-close"&&a.value!=="else"?(T=`${b}${a.value}${f}`,A=T.length):(T=`${a.value}${f}`,A=T.length);p.focus(),p.setSelectionRange(h,p.selectionStart),document.execCommand("insertText",false,T);let B=h+A;p.setSelectionRange(B,B),n?.(p.value),g();},[c,n,g]),Q=react.useCallback(a=>{let{scrollTop:p,scrollLeft:h}=a.currentTarget;E.current&&(E.current.scrollTop=p,E.current.scrollLeft=h);},[]),te=react.useCallback(a=>{document.querySelector(".hbs-autocomplete-portal")?.contains(a.relatedTarget)||g();},[g]),w=react.useCallback(()=>{let a=x.current;if(!a||!c.isOpen)return;let p=a.selectionStart;t.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/)||g();},[c.isOpen,t,g]),U=react.useCallback(a=>{let p=a.currentTarget;if(a.key==="Tab"){if(c.isOpen){a.preventDefault();let C=c.options[c.selectedIndex];C&&R(C);return}a.preventDefault();let{selectionStart:f}=p;if(a.shiftKey){let b=t.slice(0,f).lastIndexOf(`
|
|
3
|
-
`)+1,
|
|
1
|
+
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react'),ne=require('handlebars'),reactDom=require('react-dom'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var ne__default=/*#__PURE__*/_interopDefault(ne);var pe=ne__default.default.Parser,H=pe.lexer,Pe=pe.terminals_,Ne=new Set(["OPEN_BLOCK","OPEN_INVERSE","OPEN_INVERSE_CHAIN","OPEN_ENDBLOCK"]),Ce=new Set(["OPEN","OPEN_UNESCAPED"]),Re=new Set(["OPEN_PARTIAL","OPEN_PARTIAL_BLOCK"]),Le=new Set(["OPEN","OPEN_UNESCAPED","OPEN_BLOCK","OPEN_INVERSE","OPEN_INVERSE_CHAIN","OPEN_ENDBLOCK","OPEN_PARTIAL","OPEN_PARTIAL_BLOCK"]),Ie=new Set(["CLOSE","CLOSE_UNESCAPED","CLOSE_RAW_BLOCK","END_RAW_BLOCK"]),_e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR","UNDEFINED","NULL"]),ue=t=>Ne.has(t),fe=t=>Ce.has(t),de=t=>Re.has(t),ve=t=>Le.has(t),we=t=>Ie.has(t),De=t=>_e.has(t),Be={CONTENT:"text",COMMENT:"comment",OPEN:"brace",CLOSE:"brace",OPEN_UNESCAPED:"brace",CLOSE_UNESCAPED:"brace",OPEN_RAW_BLOCK:"brace",CLOSE_RAW_BLOCK:"brace",END_RAW_BLOCK:"brace",OPEN_BLOCK:"brace",OPEN_INVERSE:"brace",OPEN_INVERSE_CHAIN:"brace",OPEN_ENDBLOCK:"brace",OPEN_PARTIAL:"brace",OPEN_PARTIAL_BLOCK:"brace",OPEN_SEXPR:"subexpr-paren",CLOSE_SEXPR:"subexpr-paren",OPEN_BLOCK_PARAMS:"block-keyword",CLOSE_BLOCK_PARAMS:"block-keyword",INVERSE:"block-keyword",ID:"variable",STRING:"literal",NUMBER:"literal",BOOLEAN:"literal",UNDEFINED:"literal",NULL:"literal",DATA:"data-var",SEP:"brace",EQUALS:"brace"};function ce(t,n,r){let e=0;for(let o=0;o<n-1&&o<t.length;o++)e+=t[o].length+1;return e+r}function He(t){let n=[],r=t.split(`
|
|
2
|
+
`);H.setInput(t);try{for(let e=H.lex();e!==H.EOF;e=H.lex()){let o=Pe[e]||"UNKNOWN",s=H.yylloc;n.push({type:o,text:H.yytext,start:ce(r,s.first_line,s.first_column),end:ce(r,s.last_line,s.last_column)});}}catch{}return n}function Me(t){return t.map(n=>n.type==="ID"&&n.text==="."?{...n,type:"SEP"}:n.type==="ID"&&n.text==="="?{...n,type:"EQUALS"}:n)}function Ve(t){let n=[],r=null,e=false,o=false,s=0;for(let l=0;l<t.length;l++){let i=t[l],h=t[l-1];ve(i.type)?(ue(i.type)?r=i.type==="OPEN_ENDBLOCK"?"block-close":"block-open":de(i.type)?r="partial":fe(i.type)&&(r="mustache"),o=false,s=0):we(i.type)&&(r=null,o=false,s=0),i.type==="OPEN_BLOCK_PARAMS"?e=true:i.type==="CLOSE_BLOCK_PARAMS"&&(e=false),i.type==="SEP"?s++:i.type==="ID"&&h?.type!=="SEP"&&h?.type!=="DATA"&&(s=0);let O=false;if(i.type==="ID"){if(s===0)O=o;else for(let k=l-1;k>=0;k--)if(t[k].type==="ID"&&n[k]?.context.pathRootAfterHelper!==void 0){let b=t[k-1];if(b?.type!=="SEP"&&b?.type!=="DATA"){O=n[k].context.pathRootAfterHelper;break}}}n.push({...i,context:{type:r,isInBlockParams:e,pathRootAfterHelper:O}}),i.type==="ID"&&s===0&&!e&&h?.type!=="EQUALS"&&h?.type!=="DATA"&&(o=true);}return n}function Ke(t,n,r){let{context:e}=t;return t.text==="this"?"data-var":e.isInBlockParams?"block-param":r?.type==="EQUALS"?"hash-key":n?.type==="EQUALS"?"hash-value":n?.type==="DATA"?"data-var":n?.type==="SEP"?e.pathRootAfterHelper?"helper-arg":"variable-path":Ue(t,n,r)}function Ue(t,n,r){let{context:e}=t;return e.type==="block-open"||e.type==="block-close"?ue(n?.type??"")?"block-keyword":"helper-arg":e.type==="partial"?de(n?.type??"")?"helper":"helper-arg":n?.type==="OPEN_SEXPR"?"helper":e.type==="mustache"?fe(n?.type??"")?r?.type==="SEP"?"variable":r&&De(r.type)?"helper":"variable":"helper-arg":"variable"}function We(t){return t.map((n,r)=>{let e=t[r-1],o=t[r+1],s;return n.type==="ID"?s=Ke(n,e,o):s=Be[n.type]||"text",{token:n,highlightType:s}})}function ze(t,n){let r=[],e=0;for(let o=0;o<n.length;o++){let{token:s,highlightType:l}=n[o];if(s.start>e&&r.push({type:"text",value:t.slice(e,s.start),start:e,end:s.start}),s.type==="DATA"){let i=n[o+1];if(i?.token.type==="ID"&&i.token.start===s.end){r.push({type:"data-var",value:t.slice(s.start,i.token.end),start:s.start,end:i.token.end}),e=i.token.end,o++;continue}}r.push({type:l,value:t.slice(s.start,s.end),start:s.start,end:s.end}),e=s.end;}return e<t.length&&r.push({type:"text",value:t.slice(e),start:e,end:t.length}),r}function M(t){if(!t)return [];let n=He(t),r=Me(n),e=Ve(r),o=We(e);return ze(t,o).filter(l=>l.value.length>0)}var J=["if","unless","each","with"],he=new Set([...J,"lookup","log","this","else"]),me=new Set(["each","with"]),$e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR"]),be=ne__default.default.Parser,D=be.lexer,Fe=be.terminals_;function j(t){return he.has(t)||t.startsWith("@")}function Xe(t){return $e.has(t.name)}function q(t,n){let r=[],e=true;for(let o=n;o<t.length;o++){let s=t[o];if(s.name==="EQUALS")break;if(s.name==="ID"){if(!e||t[o+1]?.name==="EQUALS")break;r.push(s.text),e=false;}else if(s.name==="SEP")e=true;else break}return r}function Qe(t,n,r,e){return {name:t,path:n,type:r?"block":n.includes(".")||e?"nested":"simple",blockType:r,context:e}}function Ge(t){let n=[],r=null;for(let e of t)me.has(e.helper)&&e.context&&(r||(r=e.context),n.push(e.helper==="each"?`${e.context}[]`:e.context));return n.length===0||!r?null:{root:r,prefix:`${n.join(".")}.`}}function je(t){let n=[],r=t;for(;r.length>0;){let e=qe(r);if(n.push(...e.expressions),e.consumed===r.length)break;let o=r.slice(e.consumed),s=o.search(/\{\{/);if(s===-1)break;r=o.slice(s);}return {expressions:n}}function qe(t){D.setInput(t),D.conditionStack=["INITIAL"];let n=[],r=0,e=false,o=null,s=[];try{for(let l=D.lex();l!==D.EOF;l=D.lex()){let i=Fe[l],h=D.yytext;if(r=D.yylloc?.last_column??r,!(i==="OPEN_RAW_BLOCK"||i==="CLOSE_RAW_BLOCK"||i==="END_RAW_BLOCK")){if(i==="OPEN"||i==="OPEN_UNESCAPED"){e=!0,o="mustache",s=[];continue}if(i==="OPEN_PARTIAL"||i==="OPEN_PARTIAL_BLOCK"){e=!0,o="partial",s=[];continue}if(i==="OPEN_BLOCK"||i==="OPEN_INVERSE"||i==="OPEN_INVERSE_CHAIN"){e=!0,o="block",s=[];continue}if(i==="OPEN_ENDBLOCK"){e=!0,o="endblock",s=[];continue}if(i==="CLOSE"||i==="CLOSE_UNESCAPED"){if(o){let O=s[0]?.text??null;n.push({type:o,tokens:[...s],helperName:O});}e=!1,s=[];continue}e&&s.push({name:i,text:h});}}return {expressions:n,consumed:t.length}}catch{return {expressions:n,consumed:r}}}function Ye(t,n,r){let e=t.tokens;if(e.length===0||e[0]?.name==="DATA")return;let o=e[0]?.text;if(j(o))F(e,1,n,r);else {let s=q(e,0);if(s.length>0){let i=s.length*2-1,h=e[i];h&&Xe(h)?F(e,i,n,r):Y(s,n,r);}}}function Je(t,n,r){let e=t.tokens,o=e[0]?.text;if(me.has(o)){if(e[1]?.name==="OPEN_SEXPR")return F(e,1,n,r),{helper:o,context:""};{let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);return l.length>0&&!j(l[0])&&Y(l,n,r,o),{helper:o,context:l[0]||""}}return {helper:o,context:""}}}else if(he.has(o)){if(e[1]?.name==="OPEN_SEXPR")F(e,1,n,r);else {let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);l.length>0&&!j(l[0])&&Y(l,n,r,o);}}return {helper:o,context:""}}return {helper:o,context:""}}function Ze(t,n,r){let e=t.tokens,o=1;for(;o<e.length&&(e[o].name==="SEP"||e[o].name==="ID")&&!(e[o].name==="ID"&&e[o-1]?.name!=="SEP");)o++;F(e,o,n,r);}function F(t,n,r,e){for(let o=n;o<t.length;o++){let s=t[o];if(!(s.name==="OPEN_SEXPR"||s.name==="CLOSE_SEXPR")&&s.name!=="DATA"&&t[o-1]?.name!=="DATA"&&s.name!=="EQUALS"&&!(s.name==="ID"&&t[o+1]?.name==="EQUALS")&&s.name==="ID"&&!j(s.text)){if(t[o-1]?.name==="OPEN_SEXPR")continue;let i=q(t,o);i.length>0&&(Y(i,r,e),o+=i.length*2-2);}}}function Y(t,n,r,e){let o=t[0],s=n.contextPrefix&&n.rootContext?{prefix:n.contextPrefix,root:n.rootContext}:null,l,i;s?(l=s.prefix+t.join("."),i=s.root):(l=t.join("."),i=void 0),r.has(l)||r.set(l,Qe(o,l,e,i));}function et(t,n){return n.type==="endblock"&&t.length>0?t.slice(0,-1):t}function tt(t){let n=new Map,r=[];for(let e of t){let o=Ge(r),s={contextPrefix:o?.prefix??null,rootContext:o?.root??null};if(e.type==="mustache")Ye(e,s,n);else if(e.type==="block"){let l=Je(e,s,n);r=[...r,l];}else e.type==="partial"?Ze(e,s,n):e.type==="endblock"&&(r=et(r,e));}return Array.from(n.values())}function re(t){let{expressions:n}=je(t),r=tt(n),e=[...new Set(r.filter(o=>!o.context).map(o=>o.name))];return {variables:r,rootVariables:e}}function nt(t,n,r){if(!n)return t;let e=r?.helpers?ne__default.default.create():ne__default.default;if(r?.helpers)for(let[o,s]of Object.entries(r.helpers))e.registerHelper(o,s);return e.compile(t)(n)}var rt=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize","whiteSpace","wordWrap","wordBreak","overflowWrap"];function xe(t,n){let r=getComputedStyle(t),e=document.createElement("div");e.id="hbs-caret-mirror",document.body.appendChild(e);let o=e.style;o.position="absolute",o.visibility="hidden",o.whiteSpace="pre-wrap",o.wordWrap="break-word";for(let b of rt)o[b]=r[b];o.width=`${t.clientWidth}px`,o.height="auto",o.overflow="hidden";let s=t.value.substring(0,n);e.textContent=s;let l=document.createElement("span");l.textContent="\u200B",e.appendChild(l);let i=t.value.substring(n);i&&e.appendChild(document.createTextNode(i));let h=l.getBoundingClientRect(),O=e.getBoundingClientRect(),k={top:h.top-O.top,left:h.left-O.left,height:parseFloat(r.lineHeight)||parseFloat(r.fontSize)*1.2};return document.body.removeChild(e),k}var at=160,se=200,X=10,it=["--hbs-color-text","--hbs-color-border","--hbs-color-placeholder","--hbs-color-focus-ring","--hbs-color-autocomplete-bg","--hbs-color-autocomplete-selected"];function ge({textareaRef:t,containerRef:n,triggerPosition:r,isOpen:e,children:o,listboxId:s}){let[l,i]=react.useState({top:void 0,bottom:void 0,left:0,maxHeight:se,visible:false}),[h,O]=react.useState({});react.useEffect(()=>{if(!e||!n.current)return;let d=getComputedStyle(n.current),A={};for(let c of it){let u=d.getPropertyValue(c).trim();u&&(A[c]=u);}O(A);},[e,n]);let k=react.useCallback(()=>{let d=t.current;if(!d||!e){i(x=>({...x,visible:false}));return}let A=d.getBoundingClientRect(),c=xe(d,r),u=d.scrollTop,S=d.scrollLeft,N=A.top+c.top-u,V=A.left+c.left-S,g=c.height,K=window.innerHeight,ee=window.innerWidth,R=K-N-g-X,Q=N-X,te=R<120&&Q>R,w,U,W;te?(W=Math.min(se,Math.max(80,Q)),U=K-N+X,w=void 0):(W=Math.min(se,Math.max(80,R)),w=N+g,U=void 0);let z=V,G=ee-at-X;z>G&&(z=Math.max(X,G));let a=c.top-u>=0&&c.top-u<d.clientHeight,p=c.left-S>=0&&c.left-S<d.clientWidth;i({top:w,bottom:U,left:z,maxHeight:W,visible:a&&p});},[t,r,e]);if(react.useEffect(()=>{k();},[k]),react.useEffect(()=>{if(!e)return;let d=()=>{k();};return window.addEventListener("scroll",d,true),window.addEventListener("resize",d),()=>{window.removeEventListener("scroll",d,true),window.removeEventListener("resize",d);}},[e,k]),!e||!l.visible)return null;let b={top:l.top,bottom:l.bottom,left:l.left,maxHeight:l.maxHeight,...h};return reactDom.createPortal(jsxRuntime.jsx("div",{id:s,role:"listbox","aria-label":"Autocomplete suggestions",className:"hbs-autocomplete-portal",style:b,children:o}),document.body)}var ut=["this","@index","@first","@last","@key"],ft=["@root"];function dt(t,n){if(!n)return "prefix";let r=t.toLowerCase(),e=n.toLowerCase();return r===e?"exact":r.startsWith(e)?"prefix":r.includes(e)?"partial":"none"}function ht(t,n,r,e,o){let s=[],l=new Set,i=o.lastIndexOf("."),h=i!==-1;h?o.slice(0,i+1):"";let k=h?o.slice(i+1):o,b=(c,u)=>{if(l.has(c))return;let S=dt(c,k);S!=="none"&&(l.add(c),s.push({option:{value:c,type:u},matchType:S}));};if(h){let c=o.slice(0,i).replace(/\[\]$/,"");n.forEach(u=>{let S=u.path.replace(/\[\]/g,"");if(S.startsWith(`${c}.`)){let V=S.slice(c.length+1).split(".")[0];b(V,"variable");}});}else {if(!r){for(let u of J)b(`#${u}`,"block-open");for(let u of J)b(`/${u}`,"block-close");b("else","block-close");}for(let u of t)b(u,"helper");if(e){if(e.isEach)for(let u of ut)b(u,"data-var");for(let u of e.blockParams)b(u,"variable");for(let u of ft)b(u,"data-var");}let c=new Set;for(let u of n){let S=u.path.split(".")[0].replace("[]","");c.add(S);}for(let u of c)b(u,"variable");}let d={"data-var":0,variable:1,helper:2,"block-open":3,"block-close":4},A={exact:0,prefix:1,partial:2,none:3};return s.sort((c,u)=>{let S=A[c.matchType]-A[u.matchType];if(S!==0)return S;let N=d[c.option.type]-d[u.option.type];return N!==0?N:c.option.value.localeCompare(u.option.value)}),s.map(c=>c.option)}function mt(t,n){let r=t.slice(0,n),e=[],o=/\{\{#(each|with)\s+([^\s}]+)(?:\s+as\s*\|([^|]+)\|)?|\{\{\/(each|with)\}\}/g;for(let s of r.matchAll(o))if(s[1]){let l=s[1],i=s[2],O=(s[3]||"").split(/\s+/).filter(Boolean);e.push({type:l,variable:i,blockParams:O,isEach:l==="each"});}else if(s[4]){let l=s[4];for(let i=e.length-1;i>=0;i--)if(e[i].type===l){e.splice(i,1);break}}return e.length>0?e[e.length-1]:null}function bt(t,n){let r=t.slice(0,n),e=r.lastIndexOf("{{!--");if(e!==-1&&r.slice(e).indexOf("--}}")===-1)return true;let o=r.lastIndexOf("{{!");if(o!==-1){let s=r.slice(o);if(!s.startsWith("{{!--")&&s.indexOf("}}")===-1)return true}return false}function xt(t,n){let r=t.slice(0,n),e=t.slice(n),o=r.lastIndexOf("{{");if(o===-1||r.slice(o).includes("}}"))return false;let l=e.indexOf("}}");return l===-1?false:!e.slice(0,l).includes("{{")}function ye({value:t,onChange:n,placeholder:r="Enter template...",readOnly:e=false,className:o="",style:s,theme:l,customHelpers:i=[],autocomplete:h=true,minHeight:O=100}){let k=react.useRef(null),b=react.useRef(null),d=react.useRef(null),A=react.useId(),[c,u]=react.useState({isOpen:false,options:[],selectedIndex:0,triggerStart:0,filterText:"",isRaw:false,contextPath:null}),S=react.useMemo(()=>re(t).variables.map(p=>({path:p.path,context:p.context})),[t]),N=react.useMemo(()=>M(t),[t]),V=react.useMemo(()=>t?N.map(a=>a.type==="text"?a.value:jsxRuntime.jsx("span",{className:`hbs-token-${a.type}`,children:a.value},a.start)):jsxRuntime.jsx("span",{className:"hbs-editor-placeholder",children:r}),[N,t,r]),g=react.useCallback(()=>{u(a=>({...a,isOpen:false}));},[]),K=react.useCallback((a,p)=>{if(!h||e){g();return}if(bt(a,p)||xt(a,p)){g();return}let x=a.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/);if(!x){g();return}let y=x[1],f=x[2]||"",C=p-f.length,E=y==="{{{";if(f.includes("}")){g();return}let P=mt(a,p),T=ht(i,S,E,P,f);if(T.length===0){g();return}u({isOpen:true,options:T,selectedIndex:0,triggerStart:C,filterText:f,isRaw:E,contextPath:P});},[h,e,i,S,g]),ee=react.useCallback(a=>{let p=a.target.value;n?.(p),K(p,a.target.selectionStart),d.current&&(d.current.scrollTop=a.target.scrollTop,d.current.scrollLeft=a.target.scrollLeft);},[n,K]),R=react.useCallback(a=>{let p=b.current;if(!p)return;let{triggerStart:m,filterText:x,isRaw:y}=c,f=y?"}}}":"}}",C=x.lastIndexOf("."),E=C!==-1?x.slice(0,C+1):"",P,T;if(a.type==="block-open"&&!y){let L=a.value.slice(1);P=`${a.value} }}{{/${L}}}`,T=a.value.length+1;}else a.type!=="block-close"&&a.value!=="else"?(P=`${E}${a.value}${f}`,T=P.length):(P=`${a.value}${f}`,T=P.length);p.focus(),p.setSelectionRange(m,p.selectionStart),document.execCommand("insertText",false,P);let B=m+T;p.setSelectionRange(B,B),n?.(p.value),g();},[c,n,g]),Q=react.useCallback(a=>{let{scrollTop:p,scrollLeft:m}=a.currentTarget;d.current&&(d.current.scrollTop=p,d.current.scrollLeft=m);},[]),te=react.useCallback(a=>{document.querySelector(".hbs-autocomplete-portal")?.contains(a.relatedTarget)||g();},[g]),w=react.useCallback(()=>{let a=b.current;if(!a||!c.isOpen)return;let p=a.selectionStart;t.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/)||g();},[c.isOpen,t,g]),U=react.useCallback(a=>{let p=a.currentTarget;if(a.key==="Tab"){if(c.isOpen){a.preventDefault();let C=c.options[c.selectedIndex];C&&R(C);return}a.preventDefault();let{selectionStart:f}=p;if(a.shiftKey){let E=t.slice(0,f).lastIndexOf(`
|
|
3
|
+
`)+1,T=t.slice(E,f).match(/^(\t| {2})/);if(T){let B=T[1].length,L=t.slice(0,E)+t.slice(E+B);n?.(L);let I=Math.max(E,f-B);setTimeout(()=>p.setSelectionRange(I,I),0);}}else document.execCommand("insertText",false," "),n?.(p.value);return}if((a.metaKey||a.ctrlKey)&&(a.key==="z"||a.key==="y")||!c.isOpen)return;let{options:m,selectedIndex:x}=c,y=8;switch(a.key){case "ArrowDown":a.preventDefault(),u(f=>({...f,selectedIndex:Math.min(x+1,m.length-1)}));break;case "ArrowUp":a.preventDefault(),u(f=>({...f,selectedIndex:Math.max(x-1,0)}));break;case "Home":a.preventDefault(),u(f=>({...f,selectedIndex:0}));break;case "End":a.preventDefault(),u(f=>({...f,selectedIndex:m.length-1}));break;case "PageDown":a.preventDefault(),u(f=>({...f,selectedIndex:Math.min(x+y,m.length-1)}));break;case "PageUp":a.preventDefault(),u(f=>({...f,selectedIndex:Math.max(x-y,0)}));break;case "Enter":a.preventDefault(),m[x]&&R(m[x]);break;case "Escape":a.preventDefault(),g();break;case "ArrowLeft":case "ArrowRight":setTimeout(()=>w(),0);break}},[c,R,g,w,t,n]),W=react.useMemo(()=>{if(!l)return {};let a={},p={variable:"--hbs-color-variable",variablePath:"--hbs-color-variable-path",blockKeyword:"--hbs-color-block-keyword",blockParam:"--hbs-color-block-param",helper:"--hbs-color-helper",helperArg:"--hbs-color-helper-arg",hashKey:"--hbs-color-hash-key",hashValue:"--hbs-color-hash-value",literal:"--hbs-color-literal",dataVar:"--hbs-color-data-var",subexprParen:"--hbs-color-subexpr-paren",comment:"--hbs-color-comment",raw:"--hbs-color-raw",brace:"--hbs-color-brace",text:"--hbs-color-text",background:"--hbs-color-background",caret:"--hbs-color-caret",border:"--hbs-color-border",placeholder:"--hbs-color-placeholder"};for(let[m,x]of Object.entries(p)){let y=l[m];y&&(a[x]=y);}return a},[l]);react.useEffect(()=>{let a=b.current,p=d.current;!a||!p||requestAnimationFrame(()=>{p.scrollTop=a.scrollTop,p.scrollLeft=a.scrollLeft;});},[t]),react.useEffect(()=>{if(!c.isOpen)return;let a=document.querySelector(".hbs-autocomplete-portal");if(!a)return;let m=a.querySelectorAll(".hbs-autocomplete-item")[c.selectedIndex];m&&m.scrollIntoView({block:"nearest"});},[c.selectedIndex,c.isOpen]),react.useEffect(()=>{if(!c.isOpen)return;let a=k.current,p=x=>{let y=x.target;document.querySelector(".hbs-autocomplete-portal")?.contains(y)||a&&!a.contains(y)&&g();},m=x=>{let y=x.target;document.querySelector(".hbs-autocomplete-portal")?.contains(y)||a?.contains(y)&&y!==b.current&&g();};return document.addEventListener("mousedown",p),a?.addEventListener("mousedown",m),()=>{document.removeEventListener("mousedown",p),a?.removeEventListener("mousedown",m);}},[c.isOpen,g]);let z=react.useCallback((a,p)=>{let{filterText:m,selectedIndex:x}=c,y=p===x,f=m.lastIndexOf("."),C=f!==-1?m.slice(f+1):m,E=a.value;(a.type==="block-open"&&E.startsWith("#")||a.type==="block-close"&&E.startsWith("/")||a.type==="data-var"&&E.startsWith("@"))&&(E=E.slice(1));let P,T=C.toLowerCase().replace(/^[#/@]/,""),L=E.toLowerCase().indexOf(T);if(T.length>0&&L!==-1){let $=E.slice(0,L),Se=E.slice(L,L+T.length),Te=E.slice(L+T.length);P=jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[$,jsxRuntime.jsx("span",{className:"hbs-autocomplete-match",children:Se}),Te]});}else P=E;let I="";switch(a.type){case "block-open":I="#";break;case "block-close":I="/";break;case "data-var":I="@";break;case "helper":I="\u0192";break;case "variable":I="\xB7";break}let Oe=jsxRuntime.jsx("span",{className:"hbs-autocomplete-type",children:I});return jsxRuntime.jsxs("button",{id:`${A}-option-${p}`,type:"button",role:"option","aria-selected":y,className:`hbs-autocomplete-item hbs-autocomplete-${a.type} ${y?"hbs-selected":""}`,onMouseDown:$=>{$.preventDefault(),R(a);},onMouseEnter:()=>u($=>({...$,selectedIndex:p})),children:[Oe,jsxRuntime.jsx("span",{className:"hbs-autocomplete-value",children:P})]},a.value)},[c,R,A]),G=["hbs-editor",e?"hbs-readonly":"",o].filter(Boolean).join(" ");return jsxRuntime.jsxs("div",{ref:k,className:G,style:{...W,minHeight:typeof O=="number"?`${O}px`:O,...s},children:[jsxRuntime.jsx("div",{ref:d,className:"hbs-editor-highlight",children:V}),jsxRuntime.jsx("textarea",{ref:b,className:"hbs-editor-textarea",value:t,onChange:ee,onKeyDown:U,onScroll:Q,onBlur:te,onSelect:w,placeholder:"",readOnly:e,spellCheck:false,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off",role:"combobox","aria-haspopup":"listbox","aria-expanded":h&&c.isOpen,"aria-controls":A,"aria-activedescendant":h&&c.isOpen&&c.options[c.selectedIndex]?`${A}-option-${c.selectedIndex}`:void 0}),h&&jsxRuntime.jsx(ge,{textareaRef:b,containerRef:k,triggerPosition:c.triggerStart,isOpen:c.isOpen,listboxId:A,children:c.options.map((a,p)=>z(a,p))})]})}function gt({content:t,className:n}){if(!t)return null;let r=M(t);return jsxRuntime.jsx("span",{className:n,children:r.map(e=>jsxRuntime.jsx("span",{className:`hbs-token-${e.type}`,children:e.value},e.start))})}exports.HandlebarsEditor=ye;exports.HandlebarsHighlight=gt;exports.default=ye;exports.extract=re;exports.interpolate=nt;exports.tokenize=M;
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {useRef,useId,useState,useMemo,useCallback,useEffect}from'react';import ne from'handlebars';import {createPortal}from'react-dom';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var
|
|
2
|
-
`);H.setInput(t);try{for(let e=H.lex();e!==H.EOF;e=H.lex()){let r=Te[e]||"UNKNOWN",s=H.yylloc;n.push({type:r,text:H.yytext,start:le(o,s.first_line,s.first_column),end:le(o,s.last_line,s.last_column)});}}catch{}return n}function Me(t){return t.map(n=>n.type==="ID"&&n.text==="."?{...n,type:"SEP"}:n.type==="ID"&&n.text==="="?{...n,type:"EQUALS"}:n)}function Ve(t){let n=[],o=null,e=false,r=false,s=0;for(let l=0;l<t.length;l++){let i=t[l],d=t[l-1];ve(i.type)?(pe(i.type)?o=i.type==="OPEN_ENDBLOCK"?"block-close":"block-open":fe(i.type)?o="partial":ue(i.type)&&(o="mustache"),r=false,s=0):we(i.type)&&(o=null,r=false,s=0),i.type==="OPEN_BLOCK_PARAMS"?e=true:i.type==="CLOSE_BLOCK_PARAMS"&&(e=false),i.type==="SEP"?s++:i.type==="ID"&&d?.type!=="SEP"&&d?.type!=="DATA"&&(s=0);let O=false;if(i.type==="ID"){if(s===0)O=r;else for(let k=l-1;k>=0;k--)if(t[k].type==="ID"&&n[k]?.context.pathRootAfterHelper!==void 0){let x=t[k-1];if(x?.type!=="SEP"&&x?.type!=="DATA"){O=n[k].context.pathRootAfterHelper;break}}}n.push({...i,context:{type:o,isInBlockParams:e,pathRootAfterHelper:O}}),i.type==="ID"&&s===0&&!e&&d?.type!=="EQUALS"&&d?.type!=="DATA"&&(r=true);}return n}function Ke(t,n,o){let{context:e}=t;return t.text==="this"?"data-var":e.isInBlockParams?"block-param":o?.type==="EQUALS"?"hash-key":n?.type==="EQUALS"?"hash-value":n?.type==="DATA"?"data-var":n?.type==="SEP"?e.pathRootAfterHelper?"helper-arg":"variable-path":Ue(t,n,o)}function Ue(t,n,o){let{context:e}=t;return e.type==="block-open"||e.type==="block-close"?pe(n?.type??"")?"block-keyword":"helper-arg":e.type==="partial"?fe(n?.type??"")?"helper":"helper-arg":n?.type==="OPEN_SEXPR"?"helper":e.type==="mustache"?ue(n?.type??"")?o?.type==="SEP"?"variable":o&&De(o.type)?"helper":"variable":"helper-arg":"variable"}function We(t){return t.map((n,o)=>{let e=t[o-1],r=t[o+1],s;return n.type==="ID"?s=Ke(n,e,r):s=Be[n.type]||"text",{token:n,highlightType:s}})}function ze(t,n){let o=[],e=0;for(let r=0;r<n.length;r++){let{token:s,highlightType:l}=n[r];if(s.start>e&&o.push({type:"text",value:t.slice(e,s.start),start:e,end:s.start}),s.type==="DATA"){let i=n[r+1];if(i?.token.type==="ID"&&i.token.start===s.end){o.push({type:"data-var",value:t.slice(s.start,i.token.end),start:s.start,end:i.token.end}),e=i.token.end,r++;continue}}o.push({type:l,value:t.slice(s.start,s.end),start:s.start,end:s.end}),e=s.end;}return e<t.length&&o.push({type:"text",value:t.slice(e),start:e,end:t.length}),o}function M(t){if(!t)return [];let n=He(t),o=Me(n),e=Ve(o),r=We(e);return ze(t,r).filter(l=>l.value.length>0)}var J=["if","unless","each","with"],de=new Set([...J,"lookup","log","this","else"]),he=new Set(["each","with"]),$e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR"]),me=ne.Parser,D=me.lexer,Fe=me.terminals_;function j(t){return de.has(t)||t.startsWith("@")}function Xe(t){return $e.has(t.name)}function q(t,n){let o=[],e=true;for(let r=n;r<t.length;r++){let s=t[r];if(s.name==="EQUALS")break;if(s.name==="ID"){if(!e||t[r+1]?.name==="EQUALS")break;o.push(s.text),e=false;}else if(s.name==="SEP")e=true;else break}return o}function Qe(t,n,o,e){return {name:t,path:n,type:o?"block":n.includes(".")||e?"nested":"simple",blockType:o,context:e}}function Ge(t){let n=[],o=null;for(let e of t)he.has(e.helper)&&e.context&&(o||(o=e.context),n.push(e.helper==="each"?`${e.context}[]`:e.context));return n.length===0||!o?null:{root:o,prefix:`${n.join(".")}.`}}function je(t){let n=[],o=t;for(;o.length>0;){let e=qe(o);if(n.push(...e.expressions),e.consumed===o.length)break;let r=o.slice(e.consumed),s=r.search(/\{\{/);if(s===-1)break;o=r.slice(s);}return {expressions:n}}function qe(t){D.setInput(t),D.conditionStack=["INITIAL"];let n=[],o=0,e=false,r=null,s=[];try{for(let l=D.lex();l!==D.EOF;l=D.lex()){let i=Fe[l],d=D.yytext;if(o=D.yylloc?.last_column??o,!(i==="OPEN_RAW_BLOCK"||i==="CLOSE_RAW_BLOCK"||i==="END_RAW_BLOCK")){if(i==="OPEN"||i==="OPEN_UNESCAPED"){e=!0,r="mustache",s=[];continue}if(i==="OPEN_PARTIAL"||i==="OPEN_PARTIAL_BLOCK"){e=!0,r="partial",s=[];continue}if(i==="OPEN_BLOCK"||i==="OPEN_INVERSE"||i==="OPEN_INVERSE_CHAIN"){e=!0,r="block",s=[];continue}if(i==="OPEN_ENDBLOCK"){e=!0,r="endblock",s=[];continue}if(i==="CLOSE"||i==="CLOSE_UNESCAPED"){if(r){let O=s[0]?.text??null;n.push({type:r,tokens:[...s],helperName:O});}e=!1,s=[];continue}e&&s.push({name:i,text:d});}}return {expressions:n,consumed:t.length}}catch{return {expressions:n,consumed:o}}}function Ye(t,n,o){let e=t.tokens;if(e.length===0||e[0]?.name==="DATA")return;let r=e[0]?.text;if(j(r))F(e,1,n,o);else {let s=q(e,0);if(s.length>0){let i=s.length*2-1,d=e[i];d&&Xe(d)?F(e,i,n,o):Y(s,n,o);}}}function Je(t,n,o){let e=t.tokens,r=e[0]?.text;if(he.has(r)){if(e[1]?.name==="OPEN_SEXPR")return F(e,1,n,o),{helper:r,context:""};{let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);return l.length>0&&!j(l[0])&&Y(l,n,o,r),{helper:r,context:l[0]||""}}return {helper:r,context:""}}}else if(de.has(r)){if(e[1]?.name==="OPEN_SEXPR")F(e,1,n,o);else {let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);l.length>0&&!j(l[0])&&Y(l,n,o,r);}}return {helper:r,context:""}}return {helper:r,context:""}}function Ze(t,n,o){let e=t.tokens,r=1;for(;r<e.length&&(e[r].name==="SEP"||e[r].name==="ID")&&!(e[r].name==="ID"&&e[r-1]?.name!=="SEP");)r++;F(e,r,n,o);}function F(t,n,o,e){for(let r=n;r<t.length;r++){let s=t[r];if(!(s.name==="OPEN_SEXPR"||s.name==="CLOSE_SEXPR")&&s.name!=="DATA"&&t[r-1]?.name!=="DATA"&&s.name!=="EQUALS"&&!(s.name==="ID"&&t[r+1]?.name==="EQUALS")&&s.name==="ID"&&!j(s.text)){if(t[r-1]?.name==="OPEN_SEXPR")continue;let i=q(t,r);i.length>0&&(Y(i,o,e),r+=i.length*2-2);}}}function Y(t,n,o,e){let r=t[0],s=n.contextPrefix&&n.rootContext?{prefix:n.contextPrefix,root:n.rootContext}:null,l,i;s?(l=s.prefix+t.join("."),i=s.root):(l=t.join("."),i=void 0),o.has(l)||o.set(l,Qe(r,l,e,i));}function et(t,n){return n.type==="endblock"&&t.length>0?t.slice(0,-1):t}function tt(t){let n=new Map,o=[];for(let e of t){let r=Ge(o),s={contextPrefix:r?.prefix??null,rootContext:r?.root??null};if(e.type==="mustache")Ye(e,s,n);else if(e.type==="block"){let l=Je(e,s,n);o=[...o,l];}else e.type==="partial"?Ze(e,s,n):e.type==="endblock"&&(o=et(o,e));}return Array.from(n.values())}function oe(t){let{expressions:n}=je(t),o=tt(n),e=[...new Set(o.filter(r=>!r.context).map(r=>r.name))];return {variables:o,rootVariables:e}}function nt(t,n,o){if(!n)return t;let e=o?.helpers?ne.create():ne;if(o?.helpers)for(let[r,s]of Object.entries(o.helpers))e.registerHelper(r,s);return e.compile(t)(n)}var ot=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize","whiteSpace","wordWrap","wordBreak","overflowWrap"];function be(t,n){let o=getComputedStyle(t),e=document.createElement("div");e.id="hbs-caret-mirror",document.body.appendChild(e);let r=e.style;r.position="absolute",r.visibility="hidden",r.whiteSpace="pre-wrap",r.wordWrap="break-word";for(let x of ot)r[x]=o[x];r.width=`${t.clientWidth}px`,r.height="auto",r.overflow="hidden";let s=t.value.substring(0,n);e.textContent=s;let l=document.createElement("span");l.textContent="\u200B",e.appendChild(l);let i=t.value.substring(n);i&&e.appendChild(document.createTextNode(i));let d=l.getBoundingClientRect(),O=e.getBoundingClientRect(),k={top:d.top-O.top,left:d.left-O.left,height:parseFloat(o.lineHeight)||parseFloat(o.fontSize)*1.2};return document.body.removeChild(e),k}var at=160,se=200,X=10,it=["--hbs-color-text","--hbs-color-border","--hbs-color-placeholder","--hbs-color-focus-ring","--hbs-color-autocomplete-bg","--hbs-color-autocomplete-selected"];function Ee({textareaRef:t,containerRef:n,triggerPosition:o,isOpen:e,children:r,listboxId:s}){let[l,i]=useState({top:void 0,bottom:void 0,left:0,maxHeight:se,visible:false}),[d,O]=useState({});useEffect(()=>{if(!e||!n.current)return;let E=getComputedStyle(n.current),P={};for(let c of it){let u=E.getPropertyValue(c).trim();u&&(P[c]=u);}O(P);},[e,n]);let k=useCallback(()=>{let E=t.current;if(!E||!e){i(m=>({...m,visible:false}));return}let P=E.getBoundingClientRect(),c=be(E,o),u=E.scrollTop,S=E.scrollLeft,N=P.top+c.top-u,V=P.left+c.left-S,g=c.height,K=window.innerHeight,ee=window.innerWidth,R=K-N-g-X,Q=N-X,te=R<120&&Q>R,w,U,W;te?(W=Math.min(se,Math.max(80,Q)),U=K-N+X,w=void 0):(W=Math.min(se,Math.max(80,R)),w=N+g,U=void 0);let z=V,G=ee-at-X;z>G&&(z=Math.max(X,G));let a=c.top-u>=0&&c.top-u<E.clientHeight,p=c.left-S>=0&&c.left-S<E.clientWidth;i({top:w,bottom:U,left:z,maxHeight:W,visible:a&&p});},[t,o,e]);if(useEffect(()=>{k();},[k]),useEffect(()=>{if(!e)return;let E=()=>{k();};return window.addEventListener("scroll",E,true),window.addEventListener("resize",E),()=>{window.removeEventListener("scroll",E,true),window.removeEventListener("resize",E);}},[e,k]),!e||!l.visible)return null;let x={top:l.top,bottom:l.bottom,left:l.left,maxHeight:l.maxHeight,...d};return createPortal(jsx("div",{id:s,role:"listbox","aria-label":"Autocomplete suggestions",className:"hbs-autocomplete-portal",style:x,children:r}),document.body)}var ut=["this","@index","@first","@last","@key"],ft=["@root"];function dt(t,n){if(!n)return "prefix";let o=t.toLowerCase(),e=n.toLowerCase();return o===e?"exact":o.startsWith(e)?"prefix":o.includes(e)?"partial":"none"}function ht(t,n,o,e,r){let s=[],l=new Set,i=r.lastIndexOf("."),d=i!==-1;d?r.slice(0,i+1):"";let k=d?r.slice(i+1):r,x=(c,u)=>{if(l.has(c))return;let S=dt(c,k);S!=="none"&&(l.add(c),s.push({option:{value:c,type:u},matchType:S}));};if(d){let c=r.slice(0,i).replace(/\[\]$/,"");n.forEach(u=>{let S=u.path.replace(/\[\]/g,"");if(S.startsWith(`${c}.`)){let V=S.slice(c.length+1).split(".")[0];x(V,"variable");}});}else {if(!o){for(let u of J)x(`#${u}`,"block-open");for(let u of J)x(`/${u}`,"block-close");x("else","block-close");}for(let u of t)x(u,"helper");if(e){if(e.isEach)for(let u of ut)x(u,"data-var");for(let u of e.blockParams)x(u,"variable");for(let u of ft)x(u,"data-var");}let c=new Set;for(let u of n){let S=u.path.split(".")[0].replace("[]","");c.add(S);}for(let u of c)x(u,"variable");}let E={"data-var":0,variable:1,helper:2,"block-open":3,"block-close":4},P={exact:0,prefix:1,partial:2,none:3};return s.sort((c,u)=>{let S=P[c.matchType]-P[u.matchType];if(S!==0)return S;let N=E[c.option.type]-E[u.option.type];return N!==0?N:c.option.value.localeCompare(u.option.value)}),s.map(c=>c.option)}function mt(t,n){let o=t.slice(0,n),e=[],r=/\{\{#(each|with)\s+([^\s}]+)(?:\s+as\s*\|([^|]+)\|)?|\{\{\/(each|with)\}\}/g;for(let s of o.matchAll(r))if(s[1]){let l=s[1],i=s[2],O=(s[3]||"").split(/\s+/).filter(Boolean);e.push({type:l,variable:i,blockParams:O,isEach:l==="each"});}else if(s[4]){let l=s[4];for(let i=e.length-1;i>=0;i--)if(e[i].type===l){e.splice(i,1);break}}return e.length>0?e[e.length-1]:null}function bt(t,n){let o=t.slice(0,n),e=o.lastIndexOf("{{!--");if(e!==-1&&o.slice(e).indexOf("--}}")===-1)return true;let r=o.lastIndexOf("{{!");if(r!==-1){let s=o.slice(r);if(!s.startsWith("{{!--")&&s.indexOf("}}")===-1)return true}return false}function xt(t,n){let o=t.slice(0,n),e=t.slice(n),r=o.lastIndexOf("{{");if(r===-1||o.slice(r).includes("}}"))return false;let l=e.indexOf("}}");return l===-1?false:!e.slice(0,l).includes("{{")}function ye({value:t,onChange:n,placeholder:o="Enter template...",readOnly:e=false,className:r="",style:s,theme:l,customHelpers:i=[],autocomplete:d=true,minHeight:O=100}){let k=useRef(null),x=useRef(null),E=useRef(null),P=useId(),[c,u]=useState({isOpen:false,options:[],selectedIndex:0,triggerStart:0,filterText:"",isRaw:false,contextPath:null}),S=useMemo(()=>oe(t).variables.map(p=>({path:p.path,context:p.context})),[t]),N=useMemo(()=>M(t),[t]),V=useMemo(()=>t?N.map(a=>a.type==="text"?a.value:jsx("span",{className:`hbs-token-${a.type}`,children:a.value},a.start)):jsx("span",{className:"hbs-editor-placeholder",children:o}),[N,t,o]),g=useCallback(()=>{u(a=>({...a,isOpen:false}));},[]),K=useCallback((a,p)=>{if(!d||e){g();return}if(bt(a,p)||xt(a,p)){g();return}let m=a.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/);if(!m){g();return}let y=m[1],f=m[2]||"",C=p-f.length,b=y==="{{{";if(f.includes("}")){g();return}let T=mt(a,p),A=ht(i,S,b,T,f);if(A.length===0){g();return}u({isOpen:true,options:A,selectedIndex:0,triggerStart:C,filterText:f,isRaw:b,contextPath:T});},[d,e,i,S,g]),ee=useCallback(a=>{let p=a.target.value;n?.(p),K(p,a.target.selectionStart);},[n,K]),R=useCallback(a=>{let p=x.current;if(!p)return;let{triggerStart:h,filterText:m,isRaw:y}=c,f=y?"}}}":"}}",C=m.lastIndexOf("."),b=C!==-1?m.slice(0,C+1):"",T,A;if(a.type==="block-open"&&!y){let I=a.value.slice(1);T=`${a.value} }}{{/${I}}}`,A=a.value.length+1;}else a.type!=="block-close"&&a.value!=="else"?(T=`${b}${a.value}${f}`,A=T.length):(T=`${a.value}${f}`,A=T.length);p.focus(),p.setSelectionRange(h,p.selectionStart),document.execCommand("insertText",false,T);let B=h+A;p.setSelectionRange(B,B),n?.(p.value),g();},[c,n,g]),Q=useCallback(a=>{let{scrollTop:p,scrollLeft:h}=a.currentTarget;E.current&&(E.current.scrollTop=p,E.current.scrollLeft=h);},[]),te=useCallback(a=>{document.querySelector(".hbs-autocomplete-portal")?.contains(a.relatedTarget)||g();},[g]),w=useCallback(()=>{let a=x.current;if(!a||!c.isOpen)return;let p=a.selectionStart;t.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/)||g();},[c.isOpen,t,g]),U=useCallback(a=>{let p=a.currentTarget;if(a.key==="Tab"){if(c.isOpen){a.preventDefault();let C=c.options[c.selectedIndex];C&&R(C);return}a.preventDefault();let{selectionStart:f}=p;if(a.shiftKey){let b=t.slice(0,f).lastIndexOf(`
|
|
3
|
-
`)+1,
|
|
1
|
+
import {useRef,useId,useState,useMemo,useCallback,useEffect}from'react';import ne from'handlebars';import {createPortal}from'react-dom';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var pe=ne.Parser,H=pe.lexer,Pe=pe.terminals_,Ne=new Set(["OPEN_BLOCK","OPEN_INVERSE","OPEN_INVERSE_CHAIN","OPEN_ENDBLOCK"]),Ce=new Set(["OPEN","OPEN_UNESCAPED"]),Re=new Set(["OPEN_PARTIAL","OPEN_PARTIAL_BLOCK"]),Le=new Set(["OPEN","OPEN_UNESCAPED","OPEN_BLOCK","OPEN_INVERSE","OPEN_INVERSE_CHAIN","OPEN_ENDBLOCK","OPEN_PARTIAL","OPEN_PARTIAL_BLOCK"]),Ie=new Set(["CLOSE","CLOSE_UNESCAPED","CLOSE_RAW_BLOCK","END_RAW_BLOCK"]),_e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR","UNDEFINED","NULL"]),ue=t=>Ne.has(t),fe=t=>Ce.has(t),de=t=>Re.has(t),ve=t=>Le.has(t),we=t=>Ie.has(t),De=t=>_e.has(t),Be={CONTENT:"text",COMMENT:"comment",OPEN:"brace",CLOSE:"brace",OPEN_UNESCAPED:"brace",CLOSE_UNESCAPED:"brace",OPEN_RAW_BLOCK:"brace",CLOSE_RAW_BLOCK:"brace",END_RAW_BLOCK:"brace",OPEN_BLOCK:"brace",OPEN_INVERSE:"brace",OPEN_INVERSE_CHAIN:"brace",OPEN_ENDBLOCK:"brace",OPEN_PARTIAL:"brace",OPEN_PARTIAL_BLOCK:"brace",OPEN_SEXPR:"subexpr-paren",CLOSE_SEXPR:"subexpr-paren",OPEN_BLOCK_PARAMS:"block-keyword",CLOSE_BLOCK_PARAMS:"block-keyword",INVERSE:"block-keyword",ID:"variable",STRING:"literal",NUMBER:"literal",BOOLEAN:"literal",UNDEFINED:"literal",NULL:"literal",DATA:"data-var",SEP:"brace",EQUALS:"brace"};function ce(t,n,r){let e=0;for(let o=0;o<n-1&&o<t.length;o++)e+=t[o].length+1;return e+r}function He(t){let n=[],r=t.split(`
|
|
2
|
+
`);H.setInput(t);try{for(let e=H.lex();e!==H.EOF;e=H.lex()){let o=Pe[e]||"UNKNOWN",s=H.yylloc;n.push({type:o,text:H.yytext,start:ce(r,s.first_line,s.first_column),end:ce(r,s.last_line,s.last_column)});}}catch{}return n}function Me(t){return t.map(n=>n.type==="ID"&&n.text==="."?{...n,type:"SEP"}:n.type==="ID"&&n.text==="="?{...n,type:"EQUALS"}:n)}function Ve(t){let n=[],r=null,e=false,o=false,s=0;for(let l=0;l<t.length;l++){let i=t[l],h=t[l-1];ve(i.type)?(ue(i.type)?r=i.type==="OPEN_ENDBLOCK"?"block-close":"block-open":de(i.type)?r="partial":fe(i.type)&&(r="mustache"),o=false,s=0):we(i.type)&&(r=null,o=false,s=0),i.type==="OPEN_BLOCK_PARAMS"?e=true:i.type==="CLOSE_BLOCK_PARAMS"&&(e=false),i.type==="SEP"?s++:i.type==="ID"&&h?.type!=="SEP"&&h?.type!=="DATA"&&(s=0);let O=false;if(i.type==="ID"){if(s===0)O=o;else for(let k=l-1;k>=0;k--)if(t[k].type==="ID"&&n[k]?.context.pathRootAfterHelper!==void 0){let b=t[k-1];if(b?.type!=="SEP"&&b?.type!=="DATA"){O=n[k].context.pathRootAfterHelper;break}}}n.push({...i,context:{type:r,isInBlockParams:e,pathRootAfterHelper:O}}),i.type==="ID"&&s===0&&!e&&h?.type!=="EQUALS"&&h?.type!=="DATA"&&(o=true);}return n}function Ke(t,n,r){let{context:e}=t;return t.text==="this"?"data-var":e.isInBlockParams?"block-param":r?.type==="EQUALS"?"hash-key":n?.type==="EQUALS"?"hash-value":n?.type==="DATA"?"data-var":n?.type==="SEP"?e.pathRootAfterHelper?"helper-arg":"variable-path":Ue(t,n,r)}function Ue(t,n,r){let{context:e}=t;return e.type==="block-open"||e.type==="block-close"?ue(n?.type??"")?"block-keyword":"helper-arg":e.type==="partial"?de(n?.type??"")?"helper":"helper-arg":n?.type==="OPEN_SEXPR"?"helper":e.type==="mustache"?fe(n?.type??"")?r?.type==="SEP"?"variable":r&&De(r.type)?"helper":"variable":"helper-arg":"variable"}function We(t){return t.map((n,r)=>{let e=t[r-1],o=t[r+1],s;return n.type==="ID"?s=Ke(n,e,o):s=Be[n.type]||"text",{token:n,highlightType:s}})}function ze(t,n){let r=[],e=0;for(let o=0;o<n.length;o++){let{token:s,highlightType:l}=n[o];if(s.start>e&&r.push({type:"text",value:t.slice(e,s.start),start:e,end:s.start}),s.type==="DATA"){let i=n[o+1];if(i?.token.type==="ID"&&i.token.start===s.end){r.push({type:"data-var",value:t.slice(s.start,i.token.end),start:s.start,end:i.token.end}),e=i.token.end,o++;continue}}r.push({type:l,value:t.slice(s.start,s.end),start:s.start,end:s.end}),e=s.end;}return e<t.length&&r.push({type:"text",value:t.slice(e),start:e,end:t.length}),r}function M(t){if(!t)return [];let n=He(t),r=Me(n),e=Ve(r),o=We(e);return ze(t,o).filter(l=>l.value.length>0)}var J=["if","unless","each","with"],he=new Set([...J,"lookup","log","this","else"]),me=new Set(["each","with"]),$e=new Set(["ID","STRING","NUMBER","BOOLEAN","DATA","OPEN_SEXPR"]),be=ne.Parser,D=be.lexer,Fe=be.terminals_;function j(t){return he.has(t)||t.startsWith("@")}function Xe(t){return $e.has(t.name)}function q(t,n){let r=[],e=true;for(let o=n;o<t.length;o++){let s=t[o];if(s.name==="EQUALS")break;if(s.name==="ID"){if(!e||t[o+1]?.name==="EQUALS")break;r.push(s.text),e=false;}else if(s.name==="SEP")e=true;else break}return r}function Qe(t,n,r,e){return {name:t,path:n,type:r?"block":n.includes(".")||e?"nested":"simple",blockType:r,context:e}}function Ge(t){let n=[],r=null;for(let e of t)me.has(e.helper)&&e.context&&(r||(r=e.context),n.push(e.helper==="each"?`${e.context}[]`:e.context));return n.length===0||!r?null:{root:r,prefix:`${n.join(".")}.`}}function je(t){let n=[],r=t;for(;r.length>0;){let e=qe(r);if(n.push(...e.expressions),e.consumed===r.length)break;let o=r.slice(e.consumed),s=o.search(/\{\{/);if(s===-1)break;r=o.slice(s);}return {expressions:n}}function qe(t){D.setInput(t),D.conditionStack=["INITIAL"];let n=[],r=0,e=false,o=null,s=[];try{for(let l=D.lex();l!==D.EOF;l=D.lex()){let i=Fe[l],h=D.yytext;if(r=D.yylloc?.last_column??r,!(i==="OPEN_RAW_BLOCK"||i==="CLOSE_RAW_BLOCK"||i==="END_RAW_BLOCK")){if(i==="OPEN"||i==="OPEN_UNESCAPED"){e=!0,o="mustache",s=[];continue}if(i==="OPEN_PARTIAL"||i==="OPEN_PARTIAL_BLOCK"){e=!0,o="partial",s=[];continue}if(i==="OPEN_BLOCK"||i==="OPEN_INVERSE"||i==="OPEN_INVERSE_CHAIN"){e=!0,o="block",s=[];continue}if(i==="OPEN_ENDBLOCK"){e=!0,o="endblock",s=[];continue}if(i==="CLOSE"||i==="CLOSE_UNESCAPED"){if(o){let O=s[0]?.text??null;n.push({type:o,tokens:[...s],helperName:O});}e=!1,s=[];continue}e&&s.push({name:i,text:h});}}return {expressions:n,consumed:t.length}}catch{return {expressions:n,consumed:r}}}function Ye(t,n,r){let e=t.tokens;if(e.length===0||e[0]?.name==="DATA")return;let o=e[0]?.text;if(j(o))F(e,1,n,r);else {let s=q(e,0);if(s.length>0){let i=s.length*2-1,h=e[i];h&&Xe(h)?F(e,i,n,r):Y(s,n,r);}}}function Je(t,n,r){let e=t.tokens,o=e[0]?.text;if(me.has(o)){if(e[1]?.name==="OPEN_SEXPR")return F(e,1,n,r),{helper:o,context:""};{let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);return l.length>0&&!j(l[0])&&Y(l,n,r,o),{helper:o,context:l[0]||""}}return {helper:o,context:""}}}else if(he.has(o)){if(e[1]?.name==="OPEN_SEXPR")F(e,1,n,r);else {let s=1;for(;s<e.length&&e[s].name!=="ID";)s++;if(s<e.length){let l=q(e,s);l.length>0&&!j(l[0])&&Y(l,n,r,o);}}return {helper:o,context:""}}return {helper:o,context:""}}function Ze(t,n,r){let e=t.tokens,o=1;for(;o<e.length&&(e[o].name==="SEP"||e[o].name==="ID")&&!(e[o].name==="ID"&&e[o-1]?.name!=="SEP");)o++;F(e,o,n,r);}function F(t,n,r,e){for(let o=n;o<t.length;o++){let s=t[o];if(!(s.name==="OPEN_SEXPR"||s.name==="CLOSE_SEXPR")&&s.name!=="DATA"&&t[o-1]?.name!=="DATA"&&s.name!=="EQUALS"&&!(s.name==="ID"&&t[o+1]?.name==="EQUALS")&&s.name==="ID"&&!j(s.text)){if(t[o-1]?.name==="OPEN_SEXPR")continue;let i=q(t,o);i.length>0&&(Y(i,r,e),o+=i.length*2-2);}}}function Y(t,n,r,e){let o=t[0],s=n.contextPrefix&&n.rootContext?{prefix:n.contextPrefix,root:n.rootContext}:null,l,i;s?(l=s.prefix+t.join("."),i=s.root):(l=t.join("."),i=void 0),r.has(l)||r.set(l,Qe(o,l,e,i));}function et(t,n){return n.type==="endblock"&&t.length>0?t.slice(0,-1):t}function tt(t){let n=new Map,r=[];for(let e of t){let o=Ge(r),s={contextPrefix:o?.prefix??null,rootContext:o?.root??null};if(e.type==="mustache")Ye(e,s,n);else if(e.type==="block"){let l=Je(e,s,n);r=[...r,l];}else e.type==="partial"?Ze(e,s,n):e.type==="endblock"&&(r=et(r,e));}return Array.from(n.values())}function re(t){let{expressions:n}=je(t),r=tt(n),e=[...new Set(r.filter(o=>!o.context).map(o=>o.name))];return {variables:r,rootVariables:e}}function nt(t,n,r){if(!n)return t;let e=r?.helpers?ne.create():ne;if(r?.helpers)for(let[o,s]of Object.entries(r.helpers))e.registerHelper(o,s);return e.compile(t)(n)}var rt=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize","whiteSpace","wordWrap","wordBreak","overflowWrap"];function xe(t,n){let r=getComputedStyle(t),e=document.createElement("div");e.id="hbs-caret-mirror",document.body.appendChild(e);let o=e.style;o.position="absolute",o.visibility="hidden",o.whiteSpace="pre-wrap",o.wordWrap="break-word";for(let b of rt)o[b]=r[b];o.width=`${t.clientWidth}px`,o.height="auto",o.overflow="hidden";let s=t.value.substring(0,n);e.textContent=s;let l=document.createElement("span");l.textContent="\u200B",e.appendChild(l);let i=t.value.substring(n);i&&e.appendChild(document.createTextNode(i));let h=l.getBoundingClientRect(),O=e.getBoundingClientRect(),k={top:h.top-O.top,left:h.left-O.left,height:parseFloat(r.lineHeight)||parseFloat(r.fontSize)*1.2};return document.body.removeChild(e),k}var at=160,se=200,X=10,it=["--hbs-color-text","--hbs-color-border","--hbs-color-placeholder","--hbs-color-focus-ring","--hbs-color-autocomplete-bg","--hbs-color-autocomplete-selected"];function ge({textareaRef:t,containerRef:n,triggerPosition:r,isOpen:e,children:o,listboxId:s}){let[l,i]=useState({top:void 0,bottom:void 0,left:0,maxHeight:se,visible:false}),[h,O]=useState({});useEffect(()=>{if(!e||!n.current)return;let d=getComputedStyle(n.current),A={};for(let c of it){let u=d.getPropertyValue(c).trim();u&&(A[c]=u);}O(A);},[e,n]);let k=useCallback(()=>{let d=t.current;if(!d||!e){i(x=>({...x,visible:false}));return}let A=d.getBoundingClientRect(),c=xe(d,r),u=d.scrollTop,S=d.scrollLeft,N=A.top+c.top-u,V=A.left+c.left-S,g=c.height,K=window.innerHeight,ee=window.innerWidth,R=K-N-g-X,Q=N-X,te=R<120&&Q>R,w,U,W;te?(W=Math.min(se,Math.max(80,Q)),U=K-N+X,w=void 0):(W=Math.min(se,Math.max(80,R)),w=N+g,U=void 0);let z=V,G=ee-at-X;z>G&&(z=Math.max(X,G));let a=c.top-u>=0&&c.top-u<d.clientHeight,p=c.left-S>=0&&c.left-S<d.clientWidth;i({top:w,bottom:U,left:z,maxHeight:W,visible:a&&p});},[t,r,e]);if(useEffect(()=>{k();},[k]),useEffect(()=>{if(!e)return;let d=()=>{k();};return window.addEventListener("scroll",d,true),window.addEventListener("resize",d),()=>{window.removeEventListener("scroll",d,true),window.removeEventListener("resize",d);}},[e,k]),!e||!l.visible)return null;let b={top:l.top,bottom:l.bottom,left:l.left,maxHeight:l.maxHeight,...h};return createPortal(jsx("div",{id:s,role:"listbox","aria-label":"Autocomplete suggestions",className:"hbs-autocomplete-portal",style:b,children:o}),document.body)}var ut=["this","@index","@first","@last","@key"],ft=["@root"];function dt(t,n){if(!n)return "prefix";let r=t.toLowerCase(),e=n.toLowerCase();return r===e?"exact":r.startsWith(e)?"prefix":r.includes(e)?"partial":"none"}function ht(t,n,r,e,o){let s=[],l=new Set,i=o.lastIndexOf("."),h=i!==-1;h?o.slice(0,i+1):"";let k=h?o.slice(i+1):o,b=(c,u)=>{if(l.has(c))return;let S=dt(c,k);S!=="none"&&(l.add(c),s.push({option:{value:c,type:u},matchType:S}));};if(h){let c=o.slice(0,i).replace(/\[\]$/,"");n.forEach(u=>{let S=u.path.replace(/\[\]/g,"");if(S.startsWith(`${c}.`)){let V=S.slice(c.length+1).split(".")[0];b(V,"variable");}});}else {if(!r){for(let u of J)b(`#${u}`,"block-open");for(let u of J)b(`/${u}`,"block-close");b("else","block-close");}for(let u of t)b(u,"helper");if(e){if(e.isEach)for(let u of ut)b(u,"data-var");for(let u of e.blockParams)b(u,"variable");for(let u of ft)b(u,"data-var");}let c=new Set;for(let u of n){let S=u.path.split(".")[0].replace("[]","");c.add(S);}for(let u of c)b(u,"variable");}let d={"data-var":0,variable:1,helper:2,"block-open":3,"block-close":4},A={exact:0,prefix:1,partial:2,none:3};return s.sort((c,u)=>{let S=A[c.matchType]-A[u.matchType];if(S!==0)return S;let N=d[c.option.type]-d[u.option.type];return N!==0?N:c.option.value.localeCompare(u.option.value)}),s.map(c=>c.option)}function mt(t,n){let r=t.slice(0,n),e=[],o=/\{\{#(each|with)\s+([^\s}]+)(?:\s+as\s*\|([^|]+)\|)?|\{\{\/(each|with)\}\}/g;for(let s of r.matchAll(o))if(s[1]){let l=s[1],i=s[2],O=(s[3]||"").split(/\s+/).filter(Boolean);e.push({type:l,variable:i,blockParams:O,isEach:l==="each"});}else if(s[4]){let l=s[4];for(let i=e.length-1;i>=0;i--)if(e[i].type===l){e.splice(i,1);break}}return e.length>0?e[e.length-1]:null}function bt(t,n){let r=t.slice(0,n),e=r.lastIndexOf("{{!--");if(e!==-1&&r.slice(e).indexOf("--}}")===-1)return true;let o=r.lastIndexOf("{{!");if(o!==-1){let s=r.slice(o);if(!s.startsWith("{{!--")&&s.indexOf("}}")===-1)return true}return false}function xt(t,n){let r=t.slice(0,n),e=t.slice(n),o=r.lastIndexOf("{{");if(o===-1||r.slice(o).includes("}}"))return false;let l=e.indexOf("}}");return l===-1?false:!e.slice(0,l).includes("{{")}function ye({value:t,onChange:n,placeholder:r="Enter template...",readOnly:e=false,className:o="",style:s,theme:l,customHelpers:i=[],autocomplete:h=true,minHeight:O=100}){let k=useRef(null),b=useRef(null),d=useRef(null),A=useId(),[c,u]=useState({isOpen:false,options:[],selectedIndex:0,triggerStart:0,filterText:"",isRaw:false,contextPath:null}),S=useMemo(()=>re(t).variables.map(p=>({path:p.path,context:p.context})),[t]),N=useMemo(()=>M(t),[t]),V=useMemo(()=>t?N.map(a=>a.type==="text"?a.value:jsx("span",{className:`hbs-token-${a.type}`,children:a.value},a.start)):jsx("span",{className:"hbs-editor-placeholder",children:r}),[N,t,r]),g=useCallback(()=>{u(a=>({...a,isOpen:false}));},[]),K=useCallback((a,p)=>{if(!h||e){g();return}if(bt(a,p)||xt(a,p)){g();return}let x=a.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/);if(!x){g();return}let y=x[1],f=x[2]||"",C=p-f.length,E=y==="{{{";if(f.includes("}")){g();return}let P=mt(a,p),T=ht(i,S,E,P,f);if(T.length===0){g();return}u({isOpen:true,options:T,selectedIndex:0,triggerStart:C,filterText:f,isRaw:E,contextPath:P});},[h,e,i,S,g]),ee=useCallback(a=>{let p=a.target.value;n?.(p),K(p,a.target.selectionStart),d.current&&(d.current.scrollTop=a.target.scrollTop,d.current.scrollLeft=a.target.scrollLeft);},[n,K]),R=useCallback(a=>{let p=b.current;if(!p)return;let{triggerStart:m,filterText:x,isRaw:y}=c,f=y?"}}}":"}}",C=x.lastIndexOf("."),E=C!==-1?x.slice(0,C+1):"",P,T;if(a.type==="block-open"&&!y){let L=a.value.slice(1);P=`${a.value} }}{{/${L}}}`,T=a.value.length+1;}else a.type!=="block-close"&&a.value!=="else"?(P=`${E}${a.value}${f}`,T=P.length):(P=`${a.value}${f}`,T=P.length);p.focus(),p.setSelectionRange(m,p.selectionStart),document.execCommand("insertText",false,P);let B=m+T;p.setSelectionRange(B,B),n?.(p.value),g();},[c,n,g]),Q=useCallback(a=>{let{scrollTop:p,scrollLeft:m}=a.currentTarget;d.current&&(d.current.scrollTop=p,d.current.scrollLeft=m);},[]),te=useCallback(a=>{document.querySelector(".hbs-autocomplete-portal")?.contains(a.relatedTarget)||g();},[g]),w=useCallback(()=>{let a=b.current;if(!a||!c.isOpen)return;let p=a.selectionStart;t.slice(0,p).match(/(\{\{\{?)([#/]?[\w.@]*)$/)||g();},[c.isOpen,t,g]),U=useCallback(a=>{let p=a.currentTarget;if(a.key==="Tab"){if(c.isOpen){a.preventDefault();let C=c.options[c.selectedIndex];C&&R(C);return}a.preventDefault();let{selectionStart:f}=p;if(a.shiftKey){let E=t.slice(0,f).lastIndexOf(`
|
|
3
|
+
`)+1,T=t.slice(E,f).match(/^(\t| {2})/);if(T){let B=T[1].length,L=t.slice(0,E)+t.slice(E+B);n?.(L);let I=Math.max(E,f-B);setTimeout(()=>p.setSelectionRange(I,I),0);}}else document.execCommand("insertText",false," "),n?.(p.value);return}if((a.metaKey||a.ctrlKey)&&(a.key==="z"||a.key==="y")||!c.isOpen)return;let{options:m,selectedIndex:x}=c,y=8;switch(a.key){case "ArrowDown":a.preventDefault(),u(f=>({...f,selectedIndex:Math.min(x+1,m.length-1)}));break;case "ArrowUp":a.preventDefault(),u(f=>({...f,selectedIndex:Math.max(x-1,0)}));break;case "Home":a.preventDefault(),u(f=>({...f,selectedIndex:0}));break;case "End":a.preventDefault(),u(f=>({...f,selectedIndex:m.length-1}));break;case "PageDown":a.preventDefault(),u(f=>({...f,selectedIndex:Math.min(x+y,m.length-1)}));break;case "PageUp":a.preventDefault(),u(f=>({...f,selectedIndex:Math.max(x-y,0)}));break;case "Enter":a.preventDefault(),m[x]&&R(m[x]);break;case "Escape":a.preventDefault(),g();break;case "ArrowLeft":case "ArrowRight":setTimeout(()=>w(),0);break}},[c,R,g,w,t,n]),W=useMemo(()=>{if(!l)return {};let a={},p={variable:"--hbs-color-variable",variablePath:"--hbs-color-variable-path",blockKeyword:"--hbs-color-block-keyword",blockParam:"--hbs-color-block-param",helper:"--hbs-color-helper",helperArg:"--hbs-color-helper-arg",hashKey:"--hbs-color-hash-key",hashValue:"--hbs-color-hash-value",literal:"--hbs-color-literal",dataVar:"--hbs-color-data-var",subexprParen:"--hbs-color-subexpr-paren",comment:"--hbs-color-comment",raw:"--hbs-color-raw",brace:"--hbs-color-brace",text:"--hbs-color-text",background:"--hbs-color-background",caret:"--hbs-color-caret",border:"--hbs-color-border",placeholder:"--hbs-color-placeholder"};for(let[m,x]of Object.entries(p)){let y=l[m];y&&(a[x]=y);}return a},[l]);useEffect(()=>{let a=b.current,p=d.current;!a||!p||requestAnimationFrame(()=>{p.scrollTop=a.scrollTop,p.scrollLeft=a.scrollLeft;});},[t]),useEffect(()=>{if(!c.isOpen)return;let a=document.querySelector(".hbs-autocomplete-portal");if(!a)return;let m=a.querySelectorAll(".hbs-autocomplete-item")[c.selectedIndex];m&&m.scrollIntoView({block:"nearest"});},[c.selectedIndex,c.isOpen]),useEffect(()=>{if(!c.isOpen)return;let a=k.current,p=x=>{let y=x.target;document.querySelector(".hbs-autocomplete-portal")?.contains(y)||a&&!a.contains(y)&&g();},m=x=>{let y=x.target;document.querySelector(".hbs-autocomplete-portal")?.contains(y)||a?.contains(y)&&y!==b.current&&g();};return document.addEventListener("mousedown",p),a?.addEventListener("mousedown",m),()=>{document.removeEventListener("mousedown",p),a?.removeEventListener("mousedown",m);}},[c.isOpen,g]);let z=useCallback((a,p)=>{let{filterText:m,selectedIndex:x}=c,y=p===x,f=m.lastIndexOf("."),C=f!==-1?m.slice(f+1):m,E=a.value;(a.type==="block-open"&&E.startsWith("#")||a.type==="block-close"&&E.startsWith("/")||a.type==="data-var"&&E.startsWith("@"))&&(E=E.slice(1));let P,T=C.toLowerCase().replace(/^[#/@]/,""),L=E.toLowerCase().indexOf(T);if(T.length>0&&L!==-1){let $=E.slice(0,L),Se=E.slice(L,L+T.length),Te=E.slice(L+T.length);P=jsxs(Fragment,{children:[$,jsx("span",{className:"hbs-autocomplete-match",children:Se}),Te]});}else P=E;let I="";switch(a.type){case "block-open":I="#";break;case "block-close":I="/";break;case "data-var":I="@";break;case "helper":I="\u0192";break;case "variable":I="\xB7";break}let Oe=jsx("span",{className:"hbs-autocomplete-type",children:I});return jsxs("button",{id:`${A}-option-${p}`,type:"button",role:"option","aria-selected":y,className:`hbs-autocomplete-item hbs-autocomplete-${a.type} ${y?"hbs-selected":""}`,onMouseDown:$=>{$.preventDefault(),R(a);},onMouseEnter:()=>u($=>({...$,selectedIndex:p})),children:[Oe,jsx("span",{className:"hbs-autocomplete-value",children:P})]},a.value)},[c,R,A]),G=["hbs-editor",e?"hbs-readonly":"",o].filter(Boolean).join(" ");return jsxs("div",{ref:k,className:G,style:{...W,minHeight:typeof O=="number"?`${O}px`:O,...s},children:[jsx("div",{ref:d,className:"hbs-editor-highlight",children:V}),jsx("textarea",{ref:b,className:"hbs-editor-textarea",value:t,onChange:ee,onKeyDown:U,onScroll:Q,onBlur:te,onSelect:w,placeholder:"",readOnly:e,spellCheck:false,autoCapitalize:"off",autoComplete:"off",autoCorrect:"off",role:"combobox","aria-haspopup":"listbox","aria-expanded":h&&c.isOpen,"aria-controls":A,"aria-activedescendant":h&&c.isOpen&&c.options[c.selectedIndex]?`${A}-option-${c.selectedIndex}`:void 0}),h&&jsx(ge,{textareaRef:b,containerRef:k,triggerPosition:c.triggerStart,isOpen:c.isOpen,listboxId:A,children:c.options.map((a,p)=>z(a,p))})]})}function gt({content:t,className:n}){if(!t)return null;let r=M(t);return jsx("span",{className:n,children:r.map(e=>jsx("span",{className:`hbs-token-${e.type}`,children:e.value},e.start))})}export{ye as HandlebarsEditor,gt as HandlebarsHighlight,ye as default,re as extract,nt as interpolate,M as tokenize};
|
package/dist/styles.css
CHANGED
|
@@ -98,14 +98,33 @@
|
|
|
98
98
|
padding: var(--hbs-padding);
|
|
99
99
|
pointer-events: none;
|
|
100
100
|
color: var(--hbs-color-text);
|
|
101
|
+
/* Explicit font properties to match textarea exactly */
|
|
102
|
+
font-family: inherit;
|
|
103
|
+
font-size: inherit;
|
|
104
|
+
line-height: inherit;
|
|
101
105
|
tab-size: var(--hbs-tab-size);
|
|
102
106
|
-moz-tab-size: var(--hbs-tab-size);
|
|
103
|
-
scrollbar
|
|
104
|
-
-
|
|
107
|
+
/* Match textarea scrollbar to ensure same content width */
|
|
108
|
+
scrollbar-width: thin;
|
|
109
|
+
scrollbar-color: transparent transparent;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
/* Match textarea's trailing line space (textareas reserve space for cursor) */
|
|
113
|
+
.hbs-editor-highlight::after {
|
|
114
|
+
content: '\200b';
|
|
115
|
+
display: inline;
|
|
105
116
|
}
|
|
106
117
|
|
|
118
|
+
/* Invisible scrollbar that takes up same space as textarea's */
|
|
107
119
|
.hbs-editor-highlight::-webkit-scrollbar {
|
|
108
|
-
|
|
120
|
+
width: 10px;
|
|
121
|
+
height: 10px;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.hbs-editor-highlight::-webkit-scrollbar-track,
|
|
125
|
+
.hbs-editor-highlight::-webkit-scrollbar-thumb,
|
|
126
|
+
.hbs-editor-highlight::-webkit-scrollbar-corner {
|
|
127
|
+
background: transparent;
|
|
109
128
|
}
|
|
110
129
|
|
|
111
130
|
.hbs-editor-highlight code {
|
package/package.json
CHANGED