{"meta":"<h2 id=\"Guide\">Guide <a class=\"header-anchor scroll-count-item\" href=\"#Guide\" data-scroll-id=\"Guide\">#</a></h2>\n","api":"<h2 id=\"API\">API <a class=\"header-anchor scroll-count-item\" href=\"#API\" data-scroll-id=\"API\">#</a></h2>\n<h3 id=\"Message\">Message <a class=\"header-anchor scroll-count-item\" href=\"#Message\" data-scroll-id=\"Message\">#</a></h3>\n<table>\n<thead>\n<tr>\n<th>Param</th>\n<th>Description</th>\n<th>Type</th>\n<th>Default Value</th>\n<th>Required</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>Type of message</td>\n<td>&apos;success&apos; | &apos;warning&apos; | &apos;error&apos; | &apos;notice&apos; | &apos;help&apos; | &apos;loading&apos;</td>\n<td>&apos;success&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>shape</td>\n<td>Shape of message</td>\n<td>&apos;inline&apos; | &apos;addon&apos; | &apos;toast&apos;</td>\n<td>&apos;inline&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>size</td>\n<td>Size of message</td>\n<td>&apos;medium&apos; | &apos;large&apos;</td>\n<td>&apos;medium&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>title</td>\n<td>Title of message</td>\n<td>React.ReactNode</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>children</td>\n<td>Content of message</td>\n<td>React.ReactNode</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>defaultVisible</td>\n<td>Whether the message is visible in default</td>\n<td>boolean</td>\n<td>false</td>\n<td></td>\n</tr>\n<tr>\n<td>visible</td>\n<td>Whether the message is visible currently</td>\n<td>boolean</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>iconType</td>\n<td>Type of icon, overriding the internally type of icon</td>\n<td>string | false</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>closeable</td>\n<td>Whether to show the close button</td>\n<td>boolean</td>\n<td>false</td>\n<td></td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>Callback function triggered when close</td>\n<td>() =&gt; void</td>\n<td>() =&gt; {}</td>\n<td></td>\n</tr>\n<tr>\n<td>afterClose</td>\n<td>Callback function triggered after closed</td>\n<td>() =&gt; void</td>\n<td>() =&gt; {}</td>\n<td></td>\n</tr>\n<tr>\n<td>animation</td>\n<td>Whether to enable expand and collapse animation</td>\n<td>boolean</td>\n<td>true</td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<h3 id=\"Message Show\">Message.show <a class=\"header-anchor scroll-count-item\" href=\"#Message Show\" data-scroll-id=\"Message Show\">#</a></h3>\n<p><code>Message.show(props)</code> provides a singleton call with the following configuration parameters (inheriting <code>Overlay</code> configuration):</p>\n<pre class=\"language-js\"><code class=\"language-js\">Message<span class=\"token punctuation\">.</span><span class=\"token function\">show</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n    <span class=\"token literal-property property\">type</span><span class=\"token operator\">:</span> <span class=\"token string\">&apos;error&apos;</span><span class=\"token punctuation\">,</span>\n    <span class=\"token literal-property property\">title</span><span class=\"token operator\">:</span> <span class=\"token string\">&apos;Error&apos;</span><span class=\"token punctuation\">,</span>\n    <span class=\"token literal-property property\">content</span><span class=\"token operator\">:</span> <span class=\"token string\">&apos;Please contact admin feedback!&apos;</span><span class=\"token punctuation\">,</span>\n    <span class=\"token literal-property property\">hasMask</span><span class=\"token operator\">:</span> <span class=\"token boolean\">true</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre>\n<table>\n<thead>\n<tr>\n<th>Param</th>\n<th>Description</th>\n<th>Type</th>\n<th>Default Value</th>\n<th>Required</th>\n</tr>\n</thead>\n<tbody>\n<tr>\n<td>type</td>\n<td>Type of message</td>\n<td>&apos;success&apos; | &apos;warning&apos; | &apos;error&apos; | &apos;notice&apos; | &apos;help&apos; | &apos;loading&apos;</td>\n<td>&apos;success&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>size</td>\n<td>Size of message</td>\n<td>&apos;medium&apos; | &apos;large&apos;</td>\n<td>&apos;medium&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>title</td>\n<td>Title of message</td>\n<td>React.ReactNode</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>content</td>\n<td>Content of message</td>\n<td>React.ReactNode</td>\n<td>-</td>\n<td></td>\n</tr>\n<tr>\n<td>align</td>\n<td>Alignment reference Overlay</td>\n<td>string | boolean</td>\n<td>&apos;tc tc&apos;</td>\n<td></td>\n</tr>\n<tr>\n<td>offset</td>\n<td>Offset after positioned</td>\n<td>Array&lt;number&gt;</td>\n<td>[0, 0]</td>\n<td></td>\n</tr>\n<tr>\n<td>hasMask</td>\n<td>Whether to have a mask</td>\n<td>boolean</td>\n<td>false</td>\n<td></td>\n</tr>\n<tr>\n<td>duration</td>\n<td>Show duration, 0 means always present, in milliseconds</td>\n<td>number</td>\n<td>3000</td>\n<td></td>\n</tr>\n<tr>\n<td>closeable</td>\n<td>Whether to show the close button</td>\n<td>boolean</td>\n<td>false</td>\n<td></td>\n</tr>\n<tr>\n<td>onClose</td>\n<td>Callback function triggered when close</td>\n<td>() =&gt; void</td>\n<td>() =&gt; {}</td>\n<td></td>\n</tr>\n<tr>\n<td>afterClose</td>\n<td>Callback function triggered after closed</td>\n<td>() =&gt; void</td>\n<td>() =&gt; {}</td>\n<td></td>\n</tr>\n<tr>\n<td>animation</td>\n<td>Whether to enable expand and collapse animation</td>\n<td>boolean</td>\n<td>true</td>\n<td></td>\n</tr>\n<tr>\n<td>overlayProps</td>\n<td>Props of Overlay</td>\n<td>OverlayProps</td>\n<td>-</td>\n<td></td>\n</tr>\n</tbody>\n</table>\n<!-- api-extra-start -->\n<h3 id=\"Message Hide\">Message.hide <a class=\"header-anchor scroll-count-item\" href=\"#Message Hide\" data-scroll-id=\"Message Hide\">#</a></h3>\n<p><code>Message.hide()</code> provides a quick way to close the message.</p>\n<h3 id=\"Message Success Error Notice Help Loading\">Message.[success|error|notice|help|loading] <a class=\"header-anchor scroll-count-item\" href=\"#Message Success Error Notice Help Loading\" data-scroll-id=\"Message Success Error Notice Help Loading\">#</a></h3>\n<p>Quick ways of <code>Message.show({type: type, title: &apos;xxx&apos;});</code>.</p>\n<p>Example&#xFF1A;</p>\n<pre class=\"language-js\"><code class=\"language-js\">Message<span class=\"token punctuation\">.</span><span class=\"token function\">success</span><span class=\"token punctuation\">(</span><span class=\"token string\">&apos;message content&apos;</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\">// or</span>\nMessage<span class=\"token punctuation\">.</span><span class=\"token function\">success</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n    <span class=\"token literal-property property\">title</span><span class=\"token operator\">:</span> <span class=\"token string\">&apos;message content&apos;</span><span class=\"token punctuation\">,</span>\n    <span class=\"token literal-property property\">duration</span><span class=\"token operator\">:</span> <span class=\"token number\">1000</span><span class=\"token punctuation\">,</span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre>\n<!-- api-extra-end -->\n<h2 id=\"ARIA And Key Board\">ARIA and KeyBoard <a class=\"header-anchor scroll-count-item\" href=\"#ARIA And Key Board\" data-scroll-id=\"ARIA And Key Board\">#</a></h2>\n<p><code>Description</code>: This component needs to be used in conjunction with other components to be prompted. Refer to the above <code>accessibility</code></p>\n"}