@twobirds/microcomponents 0.0.9 → 0.0.12

package/public/jsdoc/es5+/symbols/MC.html

@@ -1,621 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-	<head>
-		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
-		<meta name="generator" content="JsDoc Toolkit" />
-		
-		<title>JsDoc Reference - MC</title>
-
-		<style type="text/css">
-			/* default.css */
-body
-{
-	font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif;
-	width: 800px;
-}
-
-.header
-{
-	clear: both;
-	background-color: #ccc;
-	padding: 8px;
-}
-
-h1
-{
-	font-size: 150%;
-	font-weight: bold;
-	padding: 0;
-	margin: 1em 0 0 .3em;
-}
-
-hr
-{
-	border: none 0;
-	border-top: 1px solid #7F8FB1;
-	height: 1px;
-}
-
-pre.code
-{
-	display: block;
-	padding: 8px;
-	border: 1px dashed #ccc;
-}
-
-#index
-{
-	margin-top: 24px;
-	float: left;
-	width: 160px;
-	position: absolute;
-	left: 8px;
-	background-color: #F3F3F3;
-	padding: 8px;
-}
-
-#content
-{
-	margin-left: 190px;
-	width: 600px;
-}
-
-.classList
-{
-	list-style-type: none;
-	padding: 0;
-	margin: 0 0 0 8px;
-	font-family: arial, sans-serif;
-	font-size: 1em;
-	overflow: auto;
-}
-
-.classList li
-{
-	padding: 0;
-	margin: 0 0 8px 0;
-}
-
-.summaryTable { width: 100%; }
-
-h1.classTitle
-{
-	font-size:170%;
-	line-height:130%;
-}
-
-h2 { font-size: 110%; }
-caption, div.sectionTitle
-{
-	background-color: #7F8FB1;
-	color: #fff;
-	font-size:130%;
-	text-align: left;
-	padding: 2px 6px 2px 6px;
-	border: 1px #7F8FB1 solid;
-}
-
-div.sectionTitle { margin-bottom: 8px; }
-.summaryTable thead { display: none; }
-
-.summaryTable td
-{
-	vertical-align: top;
-	padding: 4px;
-	border-bottom: 1px #7F8FB1 solid;
-	border-right: 1px #7F8FB1 solid;
-}
-
-/*col#summaryAttributes {}*/
-.summaryTable td.attributes
-{
-	border-left: 1px #7F8FB1 solid;
-	width: 140px;
-	text-align: right;
-}
-
-td.attributes, .fixedFont
-{
-	line-height: 15px;
-	color: #002EBE;
-	font-family: "Courier New",Courier,monospace;
-	font-size: 13px;
-}
-
-.summaryTable td.nameDescription
-{
-	text-align: left;
-	font-size: 13px;
-	line-height: 15px;
-}
-
-.summaryTable td.nameDescription, .description
-{
-	line-height: 15px;
-	padding: 4px;
-	padding-left: 4px;
-}
-
-.summaryTable { margin-bottom: 8px; }
-
-ul.inheritsList
-{
-	list-style: square;
-	margin-left: 20px;
-	padding-left: 0;
-}
-
-.detailList {
-	margin-left: 20px; 
-	line-height: 15px;
-}
-.detailList dt { margin-left: 20px; }
-
-.detailList .heading
-{
-	font-weight: bold;
-	padding-bottom: 6px;
-	margin-left: 0;
-}
-
-.light, td.attributes, .light a:link, .light a:visited
-{
-	color: #777;
-	font-style: italic;
-}
-
-.fineprint
-{
-	text-align: right;
-	font-size: 10px;
-}
-		</style>
-	</head>
-
-	<body>
-<!-- ============================== header ================================= -->	
-		<!-- begin static/header.html -->
-		<div id="header">
-</div>
-		<!-- end static/header.html -->
-
-<!-- ============================== classes index ============================ -->
-		<div id="index">
-			<!-- begin publish.classesIndex -->
-			<div align="center"><a href="../index.html">Class Index</a>
-| <a href="../files.html">File Index</a></div>
-<hr />
-<h2>Classes</h2>
-<ul class="classList">
-	
-	<li><i><a href="../symbols/_global_.html">_global_</a></i></li>
-	
-	<li><a href="../symbols/MC.html">MC</a></li>
-	
-</ul>
-<hr />
-			<!-- end publish.classesIndex -->
-		</div>
-		
-		<div id="content">
-<!-- ============================== class title ============================ -->
-			<h1 class="classTitle">
-				
-				Class MC
-			</h1>
-
-<!-- ============================== class summary ========================== -->			
-			<p class="description">
-				
-				
-			
-				
-				
-				
-					<br /><i>Defined in: </i> <a href="../symbols/src/build_microcomponents.js.html">microcomponents.js</a>.
-				
-			</p>
-
-<!-- ============================== constructor summary ==================== -->			
-			
-			<table class="summaryTable" cellspacing="0" summary="A summary of the constructor documented in the class MC.">
-				<caption>Class Summary</caption>
-				<thead>
-					<tr>
-						<th scope="col">Constructor Attributes</th>
-						<th scope="col">Constructor Name and Description</th>
-					</tr>
-				</thead>
-				<tbody>
-					<tr>
-						<td class="attributes">&nbsp;</td>
-						<td class="nameDescription" >
-							<div class="fixedFont">
-								<b><a href="../symbols/MC.html#constructor">MC</a></b>()
-							</div>
-							<div class="description">Manages microcomponents (MCs) attached to DOM elements, allowing for the
-addition, removal, and traversal of microcomponents across siblings, parents,
-children, and descendants.</div>
-						</td>
-					</tr>
-				</tbody>
-			</table>
-			
-
-<!-- ============================== properties summary ===================== -->
-			
-				
-				
-				<table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class MC.">
-					<caption>Field Summary</caption>
-					<thead>
-						<tr>
-							<th scope="col">Field Attributes</th>
-							<th scope="col">Field Name and Description</th>
-						</tr>
-					</thead>
-					<tbody>
-					
-						<tr>
-							<td class="attributes">&lt;static&gt; &nbsp;</td>
-							<td class="nameDescription">
-								<div class="fixedFont">
-								MC.<b><a href="../symbols/MC.html#.debug">debug</a></b>
-								</div>
-								<div class="description">A static flag to enable or disable debugging mode.</div>
-							</td>
-						</tr>
-					
-					</tbody>
-				</table>
-				
-				
-				
-			
-
-<!-- ============================== methods summary ======================== -->
-			
-				
-				
-				<table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class MC.">
-					<caption>Method Summary</caption>
-					<thead>
-						<tr>
-							<th scope="col">Method Attributes</th>
-							<th scope="col">Method Name and Description</th>
-						</tr>
-					</thead>
-					<tbody>
-					
-						<tr>
-							<td class="attributes">&lt;static&gt; &nbsp;</td>
-							<td class="nameDescription">
-								<div class="fixedFont">MC.<b><a href="../symbols/MC.html#.add">add</a></b>(target, key, element)
-								</div>
-								<div class="description">Adds a top level microcomponent to a target DOM node.</div>
-							</td>
-						</tr>
-					
-						<tr>
-							<td class="attributes">&lt;static&gt; &nbsp;</td>
-							<td class="nameDescription">
-								<div class="fixedFont">MC.<b><a href="../symbols/MC.html#.remove">remove</a></b>(target, key)
-								</div>
-								<div class="description">Removes a top level microcomponent from the target DOM node.</div>
-							</td>
-						</tr>
-					
-						<tr>
-							<td class="attributes">&lt;static&gt; &nbsp;</td>
-							<td class="nameDescription">
-								<div class="fixedFont">MC.<b><a href="../symbols/MC.html#.siblings">siblings</a></b>(target, search)
-								</div>
-								<div class="description">Retrieves all top-level microcomponents from a target HTMLElement.</div>
-							</td>
-						</tr>
-					
-					</tbody>
-				</table>
-				
-				
-				
-			
-<!-- ============================== events summary ======================== -->
-			
-
-<!-- ============================== constructor details ==================== -->		
-			
-			<div class="details"><a name="constructor"> </a>
-				<div class="sectionTitle">
-					Class Detail
-				</div>
-				
-				<div class="fixedFont">
-						<b>MC</b>()
-				</div>
-				
-				<div class="description">
-					Manages microcomponents (MCs) attached to DOM elements, allowing for the
-addition, removal, and traversal of microcomponents across siblings, parents,
-children, and descendants.
-
-This class provides an API for interacting with microcomponents on DOM elements.
-Public microcomponents are stored on the `_mc` attribute of the DOM element, while
-private microcomponents are managed internally.
-					
-				</div>
-				
-				
-				
-				<pre class="code">```javascript
-
-// create the micro component class
-class MyMC extends MC{
-
-&nbsp;constructor( target ){
-&nbsp;&nbsp;super( target );
-&nbsp;&nbsp;this.target = target;
-&nbsp;}
-}
-
-const element = document.querySelector('div')
-
-// Add the top level microcomponent to the target element
-let mcc = MC.add(
-&nbsp;element,
-&nbsp;'myMC',
-&nbsp;new MyMC( element )
-);
-
-// Add an inner (private) microcomponent to mcc
-let mcc.add(
-&nbsp;'myInnerMC',
-&nbsp;new MyMC( element )
-);
-
-console.log( element._mc );
-// { 'myMC': { target: (element) } }
-
-console.log( element._mc.myMC );
-// { target: (element) }
-
-console.log( mcc.siblings() );
-// [ { target: (element) } ]
-
-```</pre>
-				
-				
-				
-				
-					
-					
-					
-					
-					
-					
-					
-
-			</div>
-			
-
-<!-- ============================== field details ========================== -->		
-			
-				<div class="sectionTitle">
-					Field Detail
-				</div>
-				
-					<a name=".debug"> </a>
-					<div class="fixedFont">&lt;static&gt; 
-					
-					<span class="light">{A static flag to enable or disable debugging mode.}</span>
-					<span class="light">MC.</span><b>debug</b>
-					
-					</div>
-					<div class="description">
-						A static flag to enable or disable debugging mode.
-						
-						
-					</div>
-					
-					
-
-						
-						
-						
-						
-
-					
-				
-			
-
-<!-- ============================== method details ========================= -->		
-			
-				<div class="sectionTitle">
-					Method Detail
-				</div>
-				
-					<a name=".add"> </a>
-					<div class="fixedFont">&lt;static&gt; 
-					
-					<span class="light">{any}</span>
-					<span class="light">MC.</span><b>add</b>(target, key, element)
-					
-					</div>
-					<div class="description">
-						Adds a top level microcomponent to a target DOM node.
-						
-						
-					</div>
-					
-					
-					
-					<pre class="code">const component = MC.add(
-&nbsp;document.getElementById('myElement'),
-&nbsp;'myComponent',
-&nbsp;{}
-);</pre>
-					
-					
-					
-						
-							<dl class="detailList">
-							<dt class="heading">Parameters:</dt>
-							
-								<dt>
-									<span class="light fixedFont">{HTMLElement}</span> <b>target</b>
-									
-								</dt>
-								<dd>- The target DOM element.</dd>
-							
-								<dt>
-									<span class="light fixedFont">{string}</span> <b>key</b>
-									
-								</dt>
-								<dd>- The key to identify the microcomponent.</dd>
-							
-								<dt>
-									<span class="light fixedFont">{any}</span> <b>element</b>
-									<i>Optional, Default: {}</i>
-								</dt>
-								<dd>- The microcomponent to add.</dd>
-							
-							</dl>
-						
-						
-						
-						
-						
-							<dl class="detailList">
-							<dt class="heading">Returns:</dt>
-							
-								<dd><span class="light fixedFont">{any}</span> The added microcomponent.</dd>
-							
-							</dl>
-						
-						
-						
-
-					<hr />
-				
-					<a name=".remove"> </a>
-					<div class="fixedFont">&lt;static&gt; 
-					
-					
-					<span class="light">MC.</span><b>remove</b>(target, key)
-					
-					</div>
-					<div class="description">
-						Removes a top level microcomponent from the target DOM node.
-						
-						
-					</div>
-					
-					
-					
-					<pre class="code">MC.remove(
-&nbsp;document.getElementById('myElement'),
-&nbsp;'myComponent'
-);</pre>
-					
-					
-					
-						
-							<dl class="detailList">
-							<dt class="heading">Parameters:</dt>
-							
-								<dt>
-									<span class="light fixedFont">{HTMLElement}</span> <b>target</b>
-									
-								</dt>
-								<dd>- The target DOM element.</dd>
-							
-								<dt>
-									<span class="light fixedFont">{string}</span> <b>key</b>
-									
-								</dt>
-								<dd>- The key identifying the microcomponent.</dd>
-							
-							</dl>
-						
-						
-						
-						
-						
-						
-						
-
-					<hr />
-				
-					<a name=".siblings"> </a>
-					<div class="fixedFont">&lt;static&gt; 
-					
-					<span class="light">{Array<any>}</span>
-					<span class="light">MC.</span><b>siblings</b>(target, search)
-					
-					</div>
-					<div class="description">
-						Retrieves all top-level microcomponents from a target HTMLElement.
-						
-						
-					</div>
-					
-					
-					
-					<pre class="code">const siblings = MC.siblings(
-&nbsp;document.getElementById('myElement'),
-&nbsp;'myComponent'
-);</pre>
-					
-					
-					
-						
-							<dl class="detailList">
-							<dt class="heading">Parameters:</dt>
-							
-								<dt>
-									<span class="light fixedFont">{HTMLElement}</span> <b>target</b>
-									
-								</dt>
-								<dd>- The target DOM element.</dd>
-							
-								<dt>
-									<span class="light fixedFont">{string}</span> <b>search</b>
-									<i>Optional</i>
-								</dt>
-								<dd>- The key of the specific microcomponent to find.</dd>
-							
-							</dl>
-						
-						
-						
-						
-						
-							<dl class="detailList">
-							<dt class="heading">Returns:</dt>
-							
-								<dd><span class="light fixedFont">{Array<any>}</span> An array of microcomponents or an empty array if none found.</dd>
-							
-							</dl>
-						
-						
-						
-
-					
-				
-			
-			
-<!-- ============================== event details ========================= -->		
-			
-			
-			<hr />
-		</div>
-
-		
-<!-- ============================== footer ================================= -->
-		<div class="fineprint" style="clear:both">
-			
-			Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0 on Wed Oct 30 2024 23:18:47 GMT+0100 (MEZ)
-		</div>
-	</body>
-</html>