-
Notifications
You must be signed in to change notification settings - Fork 0
/
138-9c128e7e1f8e9241073d.js
1 lines (1 loc) · 20.4 KB
/
138-9c128e7e1f8e9241073d.js
1
(window.webpackJsonp=window.webpackJsonp||[]).push([[138],{1008:function(n,a,t){"use strict";t.r(a),t.d(a,"default",(function(){return H}));var s=t(840),e=t.n(s),o=t(841),p=t.n(o),i=t(521),c=t.n(i),r=t(842),l=t.n(r),d=t(843),u=t.n(d),h=t(844),m=t.n(h),k=t(845),g=t.n(k),f=t(846),C=t.n(f),b=t(0),y=t.n(b),v=t(210),x=t(145);function M(n){var a=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],(function(){}))),!0}catch(n){return!1}}();return function(){var t,s=m()(n);if(a){var e=m()(this).constructor;t=Reflect.construct(s,arguments,e)}else t=s.apply(this,arguments);return u()(this,t)}}var w=function(){return y.a.createElement(x.TextMark,{style:{lineHeight:"28px"},activeIndex:1,activeStyle:{backgroundColor:"#f48f42"},highlightStyle:{backgroundColor:"#ffd54f"},searchWords:["Chain","Chomps"],textToHighlight:"Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto's inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog's chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. "})},T=function(){return y.a.createElement(x.TextMark,{style:{lineHeight:"28px"},activeIndex:1,activeClassName:"zent-demo-text-mark-active",highlightClassName:"zent-demo-text-mark-highlight",searchWords:["Chomps"],textToHighlight:"Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto's inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog's chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. "})},N=function(){return y.a.createElement(x.TextMark,{style:{lineHeight:"28px"},activeIndex:1,activeClassName:"zent-demo-text-mark-active",highlightClassName:{Chomps:"zent-demo-text-mark-highlight",Chain:"zent-demo-text-mark-highlight2"},searchWords:["Chomps","Chain"],textToHighlight:"Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto's inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog's chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. "})};function S(n){return y.a.createElement(n.tag,C()({},n.attributes,{dangerouslySetInnerHTML:{__html:n.html}}))}function E(n){return y.a.createElement(S,{tag:"section",html:n.html,attributes:{className:"zandoc-react-markdown"}})}function z(n){return y.a.createElement(S,{tag:"style",html:n.style})}var j=function(n){l()(t,n);var a=M(t);function t(){var n;e()(this,t);for(var s=arguments.length,o=new Array(s),p=0;p<s;p++)o[p]=arguments[p];return n=a.call.apply(a,[this].concat(o)),g()(c()(n),"state",{showCode:!1}),g()(c()(n),"toggle",(function(){n.setState({showCode:!n.state.showCode})})),n}return p()(t,[{key:"render",value:function(){var n=this.state.showCode,a=this.props,t=a.title,s=a.src,e=a.children;return y.a.createElement("div",{className:"zandoc-react-demo"},y.a.createElement("div",{className:"zandoc-react-demo__preview"},e),y.a.createElement("div",{className:"zandoc-react-demo__bottom",onClick:this.toggle},y.a.createElement("div",{className:"zandoc-react-demo__title"},y.a.createElement("p",null,t||"")),y.a.createElement("i",{className:"zenticon zenticon-caret-up zandoc-react-demo__toggle ".concat(n?"zandoc-react-demo__toggle-on":"zandoc-react-demo__toggle-off")})),n&&y.a.createElement("pre",{className:"zandoc-react-demo__code"},y.a.createElement(S,{tag:"code",html:s,attributes:{className:"language-jsx"}})))}}]),t}(b.Component),H=function(n){l()(t,n);var a=M(t);function t(){return e()(this,t),a.apply(this,arguments)}return p()(t,[{key:"componentDidMount",value:function(){var n=location.hash;if(n){var a=document.querySelector('a[href="'.concat(n,'"]'));a&&Object(v.a)(document.documentElement,0,function n(a,t){for(;a;)return a.offsetTop&&"static"!==getComputedStyle(a).position&&(t+=a.offsetTop),n(a.parentNode,t);return t}(a,-9))}}},{key:"render",value:function(){return y.a.createElement("div",{className:"zandoc-react-container",key:null},y.a.createElement(z,{style:".zent-demo-text-mark-highlight {\n\tbackground-color: #ffd54f;\n}\n\n.zent-demo-text-mark-active {\n\tbackground-color: #f48f42;\n}\n\n.zent-demo-text-mark-highlight2 {\n\tbackground-color: #df4545;\n}"}),y.a.createElement(E,{html:'<h2 class="anchor-heading"><a href="#textmark">¶</a><a href="javascript:void(0)" id="textmark" class="anchor-point"></a>TextMark</h2>\n<p>Highlight selected words in a string.</p>\n<h3 class="anchor-heading"><a href="#demos">¶</a><a href="javascript:void(0)" id="demos" class="anchor-point"></a>Demos</h3>'}),y.a.createElement(j,{title:"Inline styles",id:"Demobasic",src:'<span class="token keyword module">import</span> <span class="token punctuation">{</span> <span class="token maybe-class-name">TextMark</span> <span class="token punctuation">}</span> <span class="token keyword module">from</span> <span class="token string">\'zent\'</span><span class="token punctuation">;</span>\n\n<span class="token maybe-class-name">ReactDOM</span><span class="token punctuation">.</span><span class="token method function property-access">render</span><span class="token punctuation">(</span>\n <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">TextMark</span></span>\n <span class="token attr-name">style</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span> lineHeight<span class="token operator">:</span> <span class="token string">\'28px\'</span> <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeIndex</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token number">1</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeStyle</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span> backgroundColor<span class="token operator">:</span> <span class="token string">\'#f48f42\'</span> <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">highlightStyle</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span> backgroundColor<span class="token operator">:</span> <span class="token string">\'#ffd54f\'</span> <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">searchWords</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token string">"Chain"</span><span class="token punctuation">,</span> <span class="token string">"Chomps"</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">textToHighlight</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto<span class="token punctuation">\'</span>s inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog<span class="token punctuation">\'</span>s chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. <span class="token punctuation">"</span></span>\n <span class="token punctuation">/></span></span><span class="token punctuation">,</span>\n mountNode\n<span class="token punctuation">)</span><span class="token punctuation">;</span>'},y.a.createElement(w)),y.a.createElement(j,{title:"External CSS",id:"Democlass",src:'<span class="token keyword module">import</span> <span class="token punctuation">{</span> <span class="token maybe-class-name">TextMark</span> <span class="token punctuation">}</span> <span class="token keyword module">from</span> <span class="token string">\'zent\'</span><span class="token punctuation">;</span>\n\n<span class="token maybe-class-name">ReactDOM</span><span class="token punctuation">.</span><span class="token method function property-access">render</span><span class="token punctuation">(</span>\n <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">TextMark</span></span>\n <span class="token attr-name">style</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span> lineHeight<span class="token operator">:</span> <span class="token string">\'28px\'</span> <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeIndex</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token number">1</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>zent-demo-text-mark-active<span class="token punctuation">"</span></span>\n <span class="token attr-name">highlightClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>zent-demo-text-mark-highlight<span class="token punctuation">"</span></span>\n <span class="token attr-name">searchWords</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token string">"Chomps"</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">textToHighlight</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto<span class="token punctuation">\'</span>s inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog<span class="token punctuation">\'</span>s chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. <span class="token punctuation">"</span></span>\n <span class="token punctuation">/></span></span><span class="token punctuation">,</span>\n mountNode\n<span class="token punctuation">)</span><span class="token punctuation">;</span>'},y.a.createElement(T)),y.a.createElement(j,{title:"Different styles for different search words",id:"Demomulti",src:'<span class="token keyword module">import</span> <span class="token punctuation">{</span> <span class="token maybe-class-name">TextMark</span> <span class="token punctuation">}</span> <span class="token keyword module">from</span> <span class="token string">\'zent\'</span><span class="token punctuation">;</span>\n\n<span class="token maybe-class-name">ReactDOM</span><span class="token punctuation">.</span><span class="token method function property-access">render</span><span class="token punctuation">(</span>\n <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">TextMark</span></span>\n <span class="token attr-name">style</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span> lineHeight<span class="token operator">:</span> <span class="token string">\'28px\'</span> <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeIndex</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token number">1</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">activeClassName</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>zent-demo-text-mark-active<span class="token punctuation">"</span></span>\n <span class="token attr-name">highlightClassName</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">{</span>\n <span class="token string">\'Chomps\'</span><span class="token operator">:</span> <span class="token string">\'zent-demo-text-mark-highlight\'</span><span class="token punctuation">,</span>\n <span class="token string">\'Chain\'</span><span class="token operator">:</span> <span class="token string">\'zent-demo-text-mark-highlight2\'</span><span class="token punctuation">,</span>\n <span class="token punctuation">}</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">searchWords</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span><span class="token string">\'Chomps\'</span><span class="token punctuation">,</span> <span class="token string">\'Chain\'</span><span class="token punctuation">]</span><span class="token punctuation">}</span></span>\n <span class="token attr-name">textToHighlight</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Chain Chomps (occasionally Chain-Chomps) are common enemies in the Mario franchise. They first appeared in Super Mario Bros. 3. Chain Chomps bear a resemblance to a ball and chain and are typified by their large, tooth-filled maws and incessant biting. Shigeru Miyamoto<span class="token punctuation">\'</span>s inspiration for the Chain Chomps was from a childhood experience: a dog once ran up to him and tried to bite him, but the dog<span class="token punctuation">\'</span>s chain held it back. As a result, Chain Chomps also possess canine qualities, such as barking, and are commonly used as guard dogs throughout the Mario series. Chain Chomps were originally created as an enemy for The Legend of Zelda series, but ended up being used for the Mario franchise first. Many Chomps have been part of the Koopa Troop, though a couple of them have been shown to be independent. <span class="token punctuation">"</span></span>\n <span class="token punctuation">/></span></span><span class="token punctuation">,</span>\n mountNode\n<span class="token punctuation">)</span><span class="token punctuation">;</span>'},y.a.createElement(N)),y.a.createElement(E,{html:'<h3 class="anchor-heading"><a href="#api">¶</a><a href="javascript:void(0)" id="api" class="anchor-point"></a>API</h3>\n<table class="table">\n<thead>\n<tr>\n<th>Property</th>\n<th>Description</th>\n<th>Type</th>\n<th>Required</th>\n<th>Default</th>\n<th>Alternative</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>textToHighlight</td>\n<td>Text to be searched</td>\n<td>string</td>\n<td>Yes</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>searchWords</td>\n<td>Search words, will be converted to RegExp</td>\n<td>Array<string \n|\n RegExp></td>\n<td>Yes</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>highlightClassName</td>\n<td>Highlight CSS class name, you can have different class names for each search word</td>\n<td>string \n|\n object</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>highlightStyle</td>\n<td>Highlight inline style</td>\n<td>object</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>activeClassName</td>\n<td>Active CSS class name</td>\n<td>string</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>activeStyle</td>\n<td>Active inline style</td>\n<td>object</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>activeIndex</td>\n<td>Active index</td>\n<td>number</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>unhighlightClassName</td>\n<td>Unhighlight CSS class name</td>\n<td>string</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>unhighlightStyle</td>\n<td>Unhighlight inline style</td>\n<td>object</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>highlightTag</td>\n<td>Component to render highlighted text</td>\n<td>React.ElementType</td>\n<td>No</td>\n<td><code>\'mark\'</code></td>\n<td></td>\n</tr>\n<tr>\n<td>sanitize</td>\n<td>Preprocessor for search words and text</td>\n<td>(str: string) => string</td>\n<td>No</td>\n<td>identity</td>\n<td></td>\n</tr>\n<tr>\n<td>autoEscape</td>\n<td>Automatically escape RegExp special characters in search words</td>\n<td>boolean</td>\n<td>No</td>\n<td><code>false</code></td>\n<td><code>true</code></td>\n</tr>\n<tr>\n<td>caseSensitive</td>\n<td>Case sensitive match</td>\n<td>boolean</td>\n<td>No</td>\n<td><code>false</code></td>\n<td><code>true</code></td>\n</tr>\n<tr>\n<td>findChunks</td>\n<td>Customize matching algorithm</td>\n<td>(options) => Array<{start: number; end: number; highlight: boolean;}></td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>className</td>\n<td>Custom top level CSS class name</td>\n<td>string</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n<tr>\n<td>style</td>\n<td>Custom top level inline style</td>\n<td>object</td>\n<td>No</td>\n<td></td>\n<td></td>\n</tr>\n</tbody>\n</table>'}))}}]),t}(b.Component)}}]);