@code-surfer/standalone
Version:
Code Surfer React component
3 lines (2 loc) • 14.2 kB
JavaScript
;var e,n=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,t=require("@code-surfer/step-parser"),r=require("@code-surfer/themes");function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function o(e){var t=e.body;return n.createElement("div",{style:{background:"#290000",color:"#b96f70",border:"2px solid #b96f70",padding:"10px 30px",maxWidth:"90vw",margin:"0 auto",fontFamily:"monospace",fontSize:"1rem"}},n.createElement("h3",null,e.header),n.createElement("p",null,t))}function s(e){var n=window.getComputedStyle(e),t=parseFloat(n.marginTop||"0")+parseFloat(n.marginBottom||"0");return e.offsetHeight+t}require("prismjs/components/prism-markup"),require("prismjs/components/prism-bash"),require("prismjs/components/prism-clike"),require("prismjs/components/prism-c"),require("prismjs/components/prism-cpp"),require("prismjs/components/prism-css"),require("prismjs/components/prism-css-extras"),require("prismjs/components/prism-javascript"),require("prismjs/components/prism-jsx"),require("prismjs/components/prism-js-extras"),require("prismjs/components/prism-coffeescript"),require("prismjs/components/prism-diff"),require("prismjs/components/prism-git"),require("prismjs/components/prism-go"),require("prismjs/components/prism-graphql"),require("prismjs/components/prism-json"),require("prismjs/components/prism-less"),require("prismjs/components/prism-makefile"),require("prismjs/components/prism-markdown"),require("prismjs/components/prism-objectivec"),require("prismjs/components/prism-ocaml"),require("prismjs/components/prism-python"),require("prismjs/components/prism-reason"),require("prismjs/components/prism-sass"),require("prismjs/components/prism-scss"),require("prismjs/components/prism-sql"),require("prismjs/components/prism-stylus"),require("prismjs/components/prism-typescript"),require("prismjs/components/prism-wasm"),require("prismjs/components/prism-yaml");var u={linear:function(e){return e},easeInQuad:function(e){return e*e},easeOutQuad:function(e){return e*(2-e)},easeInOutQuad:function(e){return e<.5?2*e*e:(4-2*e)*e-1},easeInCubic:function(e){return e*e*e},easeOutCubic:function(e){return--e*e*e+1},easeInOutCubic:function(e){return e<.5?4*e*e*e:(e-1)*(2*e-2)*(2*e-2)+1},easeInQuart:function(e){return e*e*e*e},easeOutQuart:function(e){return 1- --e*e*e*e},easeInOutQuart:function(e){return e<.5?8*e*e*e*e:1-8*--e*e*e*e},easeInQuint:function(e){return e*e*e*e*e},easeOutQuint:function(e){return 1+--e*e*e*e*e},easeInOutQuint:function(e){return e<.5?16*e*e*e*e*e:1+16*--e*e*e*e*e}},a=250,c=0,l=.25,p=.75,m=1;function f(){return{}}function d(e,n,t,r){return k([[l,void 0],[p,void 0],[m,q(function(t){return{opacity:j(e,n,t)}},t,r)]],{opacity:e})}function h(e,n,t,r){return k([[l,q(function(t){return{opacity:j(e,n,t)}},t,r)],[p,void 0],[m,void 0]],{opacity:e})}function v(e){return void 0===e&&(e=0),k([[.5,b(e)],[1,w(e)]])}function y(e){return void 0===e&&(e=0),k([[.5,void 0],[1,w(e)]],{opacity:0})}function g(e){return void 0===e&&(e=0),k([[.5,b(e)],[1,void 0]])}function E(e){return function(n){return{height:j(e,c,n,u.easeInOutCubic)}}}function x(e){return function(n){return{height:j(c,e,n,u.easeInOutCubic)}}}function b(e){return void 0===e&&(e=0),function(n){return{opacity:j(1,e,n)}}}function w(e){return void 0===e&&(e=0),function(n){return{opacity:j(e,1,n)}}}function j(e,n,t,r){return void 0===r&&(r=u.linear),e+(n-e)*r(t)}function k(e,n){return void 0===n&&(n={}),function(t){for(var r=Object.assign({},n),i=0,o=0;o<e.length;o++){var s=e[o],u=s[0],a=s[1];if(a&&Object.assign(r,a(t>u?1:(t-i)/(u-i))),t<u)return r;i=u}return r}}function q(e,n,t,r){if(void 0===r&&(r=.3),t<=1)return e;var i=r/(t-1)*n,o=1-r+i;return function(n){var t=Math.max(0,Math.min(1,(n-i)/(o-i)));return e(t)}}function M(e,n){if(!e)return null;if(!n||!e.dimensions)throw new Error("Can't get zoom without dimensions");var t=n.containerWidth,r=n.contentWidth,i=e.dimensions,o=e.focusCount*n.lineHeight,s=n.containerHeight-2*Math.max(i.paddingBottom,i.paddingTop);return Math.min(s/o,1,.9*t/r)}function O(e){var t=e.stepPair,r=e.t,o=e.tokens,s=e.types,u=e.dimensions,c=e.unfocusedStyle,v=e.maxLineCount,y=e.showNumbers,g=n.useMemo(function(){var e=t.selectMany(function(e){return e.lines.map(function(n,t){return{key:n,lineNumber:t+1,focus:e.focus[t]}})}),r=e.map(function(e,n){var t=e.spread()[0],r=e.select(function(e){return e.focus}).spread(),i=r[0],o=r[1];return!t||!i&&o||o&&Array.isArray(i)?n:-1}).filter(function(e){return-1!==e}),i=e.map(function(e,n){var t=e.spread()[1],r=e.select(function(e){return e.focus}).spread(),i=r[0],o=r[1];return!t||!o&&i||i&&Array.isArray(o)?n:-1}).filter(function(e){return-1!==e});return e.map(function(e,t){var g=c.opacity,b=e.spread(),w=b[0],M=b[1],O=e.select(function(e){return e.focus}).spread(),S=O[0],C=O[1],A=!(!w||!M||S!==C),N=!(!A&&(Array.isArray(S)||Array.isArray(C))),H=N&&o[t].map(function(e,r){return n.createElement("span",{className:"token-"+s[t][r],key:r},e)}),L=(u||{}).lineHeight,I=e.any(),W=v.toString().replace(/./g," "),P=I?(W+I.lineNumber).slice(-W.length):"",T=y&&n.createElement("span",{className:"token-line-number"},P+" "),Q=A&&n.createElement("div",{style:{overflow:"hidden",opacity:S?void 0:g,height:L},key:t},T,n.createElement("div",{style:{display:"inline-block"},className:"cs-line cs-line-"+t},H)),_=f;if(!A)if(w)if(M)if(S||!C||Array.isArray(C)){if(S&&!C&&!Array.isArray(S)){var B=i.indexOf(t);_=h(1,g,B,i.length)}}else{var z=r.indexOf(t);_=d(g,1,z,r.length)}else{var F=i.indexOf(t);_=function(e,n,t,r,o){return void 0===o&&(o=100),k([[l,q((s=e,u=n,function(e){return{opacity:j(s,u,e),transform:"translateX("+j(0,-a,e)+"px)"}}),F,i.length)],[p,E(o)],[m,void 0]],{height:o});var s,u}(S?1:g,Array.isArray(S)?1:0,0,0,L)}else{var X=r.indexOf(t);_=function(e,n,t,r,i){return void 0===i&&(i=100),k([[l,void 0],[p,x(i)],[m,q((o=e,s=n,function(e){return{opacity:j(o,s,e),transform:"translateX("+j(a,0,e)+"px)"}}),t,r)]],{transform:"translateX("+a+"px)",height:0,opacity:0});var o,s}(Array.isArray(C)?1:0,C?1:g,X,r.length,L)}var K=f;if(!N){var R=o[t].map(function(e,n){return Array.isArray(S)?S.includes(n):S}),U=o[t].map(function(e,n){return Array.isArray(C)?C.includes(n):C}),G=r.indexOf(t),D=i.indexOf(t);K=function(e,n){var t=w?R[n]?1:g:0,o=M?U[n]?1:g:0;return(t<o?d(t,o,G,r.length):h(t,o,D,i.length))(e)}}return{lineKey:t,lineElement:Q,tokenElements:H,getLineStyle:_,getTokenStyle:K,lineNumberElement:T}})},[t]);return n.createElement(n.Fragment,null,g.map(function(e){var t=e.lineKey,u=e.tokenElements,a=e.getTokenStyle,c=e.lineNumberElement;return e.lineElement||n.createElement("div",{style:i({overflow:"hidden"},(0,e.getLineStyle)(r)),key:t},n.createElement("div",{style:{display:"inline-block"},className:"cs-line cs-line-"+t},c,u||o[t].map(function(e,i){return n.createElement("span",{className:"token-"+s[t][i],style:a(r,i),key:i},e)})))}))}var S=function(){function e(e,n){this.prev=e,this.next=n}var n=e.prototype;return n.spread=function(){return[this.prev,this.next]},n.select=function(n){var t=this.spread(),r=t[0],i=t[1];return new e(null===r?null:void 0===r?void 0:n(r),null===i?null:void 0===i?void 0:n(i))},n.selectMany=function(e){var n=this.spread(),t=n[0],r=n[1],i=null===t?null:void 0===t?void 0:e(t),o=null===r?null:void 0===r?void 0:e(r);return new C(i,o)},n.any=function(){var e=this.spread(),n=e[0];return null==n?e[1]:n},n.get=function(e){throw Error("Get only supported in ArrayTuple")},n.map=function(e){throw Error("Map only supported in ArrayTuple")},e}(),C=function(e){var n,t;function r(){return e.apply(this,arguments)||this}t=e,(n=r).prototype=Object.create(t.prototype),n.prototype.constructor=n,n.__proto__=t;var i=r.prototype;return i._getChildrenMap=function(){if(!this._dict){var e=this.spread(),n=e[1]||[],t=new Map((e[0]||[]).map(function(e){return[e.key,{prev:e}]}));n.forEach(function(e){var n=t.get(e.key)||{prev:void 0};t.set(e.key,{prev:n.prev,next:e})});var r=Array.from(t.keys());r.sort(function(e,n){return e<n?-1:e>n?1:0}),this._dict=new Map(r.map(function(e){var n=t.get(e)||{},r=n.prev,i=n.next;return[e,new S(void 0===r?void 0:r,void 0===i?void 0:i)]}))}return this._dict},i.get=function(e){return this._getChildrenMap().get(e)},i.map=function(e){var n=this,t=this._getChildrenMap(),r=[];return t.forEach(function(t,i){return r.push(e(t,i,n))}),r},r}(S);function A(e){var t=e.progress,r=e.dimensions,i=e.steps,o=e.tokens,s=e.types,u=e.maxLineCount,a=e.showNumbers,c=i[Math.floor(t)],l=i[Math.floor(t)+1],p=n.useMemo(function(){return new S(c,l)},[c,l]),m=n.useMemo(function(){return p.select(function(e){return e.title})},[p]),f=n.useMemo(function(){return p.select(function(e){return e.subtitle})},[p]),d=t%1;return n.createElement("div",{className:"cs-container",style:{width:"100%",height:r?r.containerHeight:"100%",maxHeight:"100%",position:"relative"}},n.createElement(N,{dimensions:r,stepPair:p,t:d,tokens:o,types:s,maxLineCount:u,showNumbers:a}),n.createElement(H,{textPair:m,t:d}),n.createElement(L,{textPair:f,t:d}))}function N(e){var t=e.dimensions,i=e.stepPair,o=e.t,s=e.tokens,a=e.types,c=e.maxLineCount,f=e.showNumbers,d=n.useRef(null),h=n.useMemo(function(){return function(e,n){if(!n)return function(){return 1};var t=e.spread(),r=t[1],i=M(t[0],n),o=M(r,n);return function(e){return j(i||o,o||i,e,u.easeInOutQuad)}}(i,t)},[i,t]),v=n.useMemo(function(){return function(e,n){if(!n)return function(){return 0};var t=e.spread(),r=t[0],i=t[1],o=r?r.focusCenter*n.lineHeight:0,s=i?i.focusCenter*n.lineHeight:0,a=k([[l,void 0],[p,function(e){return{scroll:j(o,s,e,u.easeInOutCubic)}}],[m,void 0]],{scroll:o});return function(e){return a(e).scroll}}(i,t)},[i,t]),y=h(o),g=v(o),E=t?t.containerHeight/2+g:0;n.useLayoutEffect(function(){null!=d.current&&(d.current.scrollTop=g)},[g]);var x=r.useUnfocusedStyle();return n.createElement(r.Styled.Pre,{className:"cs-content",ref:d,style:{margin:0,height:"100%",overflow:"hidden"}},n.createElement(r.Styled.Code,{className:"cs-scaled-content",style:{display:"block",height:t?t.contentHeight:"100%",width:t&&t.contentWidth,margin:t&&"0 "+(t.containerWidth-t.contentWidth)/2+"px",transform:"scale("+y+")",transformOrigin:"center "+E+"px"}},n.createElement("div",{style:{height:t&&t.containerHeight/2}}),n.createElement(O,{stepPair:i,t:o,tokens:s,types:a,dimensions:t,unfocusedStyle:x,maxLineCount:c,showNumbers:f}),n.createElement("div",{style:{height:t&&t.containerHeight/2}})))}function H(e){var t=e.textPair,i=e.t;if(!t.any())return null;var o=t.spread(),s=o[0],u=o[1],a=i<.5?s:u,c=s!==u?v()(i):void 0,l=s&&u?void 0:s?g()(i):y()(i);return n.createElement(r.Styled.Title,{className:"cs-title",style:l},n.createElement("span",{style:c},a))}function L(e){var t=e.textPair,i=e.t;if(!t.any())return null;var o=t.spread(),s=o[0],u=o[1],a=i<.5?s:u,c=s!==u?v()(i):void 0,l=s&&u?void 0:s?g()(i):y()(i);return n.createElement(r.Styled.Subtitle,{className:"cs-subtitle",style:l},n.createElement("span",{style:c},a))}function I(e){var t=e.progress,r=e.steps,o=e.tokens,u=e.types,a=e.maxLineCount,c=e.showNumbers,l=void 0!==c&&c,p=n.useMemo(function(){return function(e,n){for(var t=0,r=100,o=1;o<n.length&&(n[o].length<r&&(r=n[o].length,t=o),!(r<=1));o++);var s=e.map(function(e){var n=i({},e,{lines:e.lines.map(function(e){return t}),longestLineIndex:0});return n.lines[0]=e.lines[e.longestLineIndex],n});return s[0]=e[0],s}(r,o)},[r]),m=n.useRef(null),f=function(e,t){var r,o=n.useState(null),u=o[0],a=o[1];return r=function(){return a(null)},n.useEffect(function(){return window.addEventListener("resize",r),function(){window.removeEventListener("resize",r)}},[a]),n.useLayoutEffect(function(){if(e.current&&!u){var n=e.current.querySelectorAll(".cs-container"),r=Array.from(n).map(function(e,n){return function(e,n){var t=e.querySelector(".cs-line-"+n.lines[n.longestLineIndex]),r=e.parentElement,i=e.querySelector(".cs-title"),o=e.querySelector(".cs-subtitle"),u=n.lines.length,a=e.scrollHeight-(r.scrollHeight-r.clientHeight),c=t?t.clientHeight:0,l=i?s(i):c,p=o?s(o):c;return{lineHeight:c,contentHeight:u*c*2+a,contentWidth:t?t.clientWidth:0,paddingTop:l,paddingBottom:p,containerHeight:a,containerWidth:e.clientWidth}}(e,t[n])}),o=Math.max.apply(Math,r.map(function(e){return e.containerHeight})),c=Math.max.apply(Math,r.map(function(e){return e.containerWidth})),l=Math.max.apply(Math,r.map(function(e){return e.contentWidth})),p=Math.max.apply(Math,r.map(function(e){return e.lineHeight}));a({dimensions:{lineHeight:p,contentWidth:l,containerHeight:o,containerWidth:c,contentHeight:void 0},steps:t.map(function(e,n){return i({},e,{dimensions:{paddingTop:r[n].paddingTop,paddingBottom:r[n].paddingBottom}})})})}},[u]),u||{}}(m,r),d=f.dimensions,h=f.steps;return d&&h?n.createElement("div",{style:{height:"100%",width:"100%",overflow:"auto"},ref:m},n.createElement(A,{steps:h,progress:t,dimensions:d,tokens:o,types:u,maxLineCount:a,showNumbers:l})):n.createElement("div",{ref:m,style:{overflow:"auto",height:"100%",width:"100%"}},p.map(function(e,t){return n.createElement("div",{key:t,style:{overflow:"auto",height:"100%",width:"100%"}},n.createElement(A,{steps:p,progress:t,tokens:o,types:u,maxLineCount:a,showNumbers:l}))}))}function W(e){var r=e.progress,i=e.steps,o=e.parsedSteps,s=n.useMemo(function(){return o||t.parseSteps(i)},[i,o]),u=s.steps,a=s.tokens,c=s.types,l=s.maxLineCount,p=s.showNumbers;if(!u||0===u.length)throw new Error("No steps");return n.createElement(I,{progress:r,steps:u,tokens:a,types:c,maxLineCount:l,showNumbers:p})}exports.CodeSurfer=function(e){var t=e.theme,i=e.nonblocking,o=function(e,n){if(null==e)return{};var t,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n.indexOf(t=o[r])>=0||(i[t]=e[t]);return i}(e,["theme","nonblocking"]),s=n.useState(i),u=s[0],a=s[1];return n.useEffect(function(){u&&a(!1)},[]),n.createElement(r.StylesProvider,{theme:t},u?n.createElement(r.Styled.Placeholder,null):n.createElement(W,Object.assign({},o)))},exports.UnknownError=function(e){return n.createElement(o,{header:"Oops, there's a problem",body:e.error.toString()})};
//# sourceMappingURL=standalone.cjs.production.min.js.map