@twobirds/microcomponents 0.0.76 → 0.0.78
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/formValues.min.js +1 -0
- package/dist/microcomponents.js +8 -0
- package/dist/microcomponents.min.js +1 -1
- package/dist/observables.d.ts +1 -0
- package/dist/observables.d.ts.map +1 -1
- package/dist/observables.min.js +1 -1
- package/dist/observables.ts +189 -169
- package/package.json +2 -2
- package/public/formValues.min.js +1 -0
- package/public/microcomponents.min.js +1 -1
- package/public/observables.d.ts +1 -0
- package/public/observables.d.ts.map +1 -1
- package/public/observables.js +117 -118
- package/public/observables.js.map +1 -1
- package/public/observables.min.js +1 -1
- package/public/observables.ts +189 -169
- package/public/src/observables.ts +189 -169
- package/public/test/microcomponents.min.js +1 -1
- package/public/test/observables.d.ts +1 -0
- package/public/test/observables.d.ts.map +1 -1
- package/public/test/observables.js +117 -118
- package/public/test/observables.js.map +1 -1
- package/public/test/observables.ts +189 -169
- package/public/test/test/testform.js +1 -1
- package/public/typedoc/assets/search.js +1 -1
- package/public/typedoc/classes/MC.DC.html +2 -2
- package/public/typedoc/classes/MC.MC.html +2 -2
- package/public/typedoc/classes/MC.McBase.html +2 -2
- package/public/typedoc/classes/MC.McEvent.html +2 -2
- package/public/typedoc/functions/MC.addListener.html +1 -1
- package/public/typedoc/functions/MC.autoload.html +1 -1
- package/public/typedoc/functions/MC.removeListener.html +1 -1
- package/public/typedoc/functions/elements.defineCE.html +1 -1
- package/public/typedoc/functions/elements.getCE.html +1 -1
- package/public/typedoc/functions/formValues.formValues.html +1 -1
- package/public/typedoc/functions/observables.observe.html +1 -1
- package/public/typedoc/interfaces/MC.HTMLMcElement.html +2 -2
- package/public/typedoc/modules/MC.html +1 -1
- package/public/typedoc/modules/elements.html +1 -1
- package/public/typedoc/modules/formValues.html +1 -1
- package/public/typedoc/modules/observables.html +1 -1
- package/public/typedoc/types/observables.Observable.html +1 -1
- package/src/observables.ts +189 -169
- package/src/test/test.ts +1 -1
- package/webpack.config.js +1 -1
- package/dist/formvValues.min.js +0 -1
- package/public/formvValues.min.js +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>MC | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="MC.html">MC</a></li></ul><h1>Module MC</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>MC | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="MC.html">MC</a></li></ul><h1>Module MC</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/1bcac31812c137ee8b202b37fef638e7df76f0cb/src/MC.ts#L1">src/MC.ts:1</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Classes</h3><div class="tsd-index-list"><a href="../classes/MC.DC.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-128"></use></svg><span>DC</span></a>
|
|
2
2
|
<a href="../classes/MC.MC.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-128"></use></svg><span>MC</span></a>
|
|
3
3
|
<a href="../classes/MC.McBase.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-128"></use></svg><span>Mc<wbr/>Base</span></a>
|
|
4
4
|
<a href="../classes/MC.McEvent.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-128"></use></svg><span>Mc<wbr/>Event</span></a>
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>elements | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="elements.html">elements</a></li></ul><h1>Module elements</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>elements | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="elements.html">elements</a></li></ul><h1>Module elements</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/1bcac31812c137ee8b202b37fef638e7df76f0cb/src/elements.ts#L1">src/elements.ts:1</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Functions</h3><div class="tsd-index-list"><a href="../functions/elements.defineCE.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>defineCE</span></a>
|
|
2
2
|
<a href="../functions/elements.getCE.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>getCE</span></a>
|
|
3
3
|
</div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>formValues | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="formValues.html">formValues</a></li></ul><h1>Module formValues</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>formValues | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="formValues.html">formValues</a></li></ul><h1>Module formValues</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/1bcac31812c137ee8b202b37fef638e7df76f0cb/src/formValues.ts#L1">src/formValues.ts:1</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Functions</h3><div class="tsd-index-list"><a href="../functions/formValues.formValues.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>form<wbr/>Values</span></a>
|
|
2
2
|
</div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>observables | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="observables.html">observables</a></li></ul><h1>Module observables</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>observables | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="observables.html">observables</a></li></ul><h1>Module observables</h1></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/1bcac31812c137ee8b202b37fef638e7df76f0cb/src/observables.ts#L1">src/observables.ts:1</a></li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Type Aliases</h3><div class="tsd-index-list"><a href="../types/observables.Observable.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-2097152"></use></svg><span>Observable</span></a>
|
|
2
2
|
</div></section><section class="tsd-index-section"><h3 class="tsd-index-heading">Functions</h3><div class="tsd-index-list"><a href="../functions/observables.observe.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>observe</span></a>
|
|
3
3
|
</div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Observable | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/observables.html">observables</a></li><li><a href="observables.Observable.html">Observable</a></li></ul><h1>Type Alias Observable</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">Observable</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span><br/><span> </span><span class="tsd-kind-property">bind</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">target</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">DocumentFragment</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">ShadowRoot</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span> </span><span class="tsd-kind-property">notify</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span> </span><span class="tsd-kind-property">observe</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">cb</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Callback</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>Observable | Micro Components</title><meta name="description" content="Documentation for Micro Components"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">Micro Components</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">Micro Components</a></li><li><a href="../modules/observables.html">observables</a></li><li><a href="observables.Observable.html">Observable</a></li></ul><h1>Type Alias Observable</h1></div><div class="tsd-signature"><span class="tsd-kind-type-alias">Observable</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-symbol">{ </span><br/><span> </span><span class="tsd-kind-property">bind</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">target</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">DocumentFragment</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">ShadowRoot</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span> </span><span class="tsd-kind-property">callbacks</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Function</span><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span> </span><span class="tsd-kind-property">notify</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span> </span><span class="tsd-kind-property">observe</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">(</span><span class="tsd-kind-parameter">cb</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">Callback</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol"> => </span><span class="tsd-signature-type">void</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in <a href="https://gitlab.com/twoBirds/microcomponents/-/blob/1bcac31812c137ee8b202b37fef638e7df76f0cb/src/observables.ts#L194">src/observables.ts:194</a></li></ul></aside></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>Micro Components</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
|
package/src/observables.ts
CHANGED
|
@@ -194,207 +194,227 @@ function makePlaceholders(
|
|
|
194
194
|
export type Observable = {
|
|
195
195
|
observe: (cb: Callback) => void;
|
|
196
196
|
notify: () => void;
|
|
197
|
-
bind: (target: HTMLElement | DocumentFragment | ShadowRoot) => void;
|
|
197
|
+
bind: (target: HTMLElement | DocumentFragment | ShadowRoot ) => void;
|
|
198
|
+
callbacks: Array<Function>;
|
|
198
199
|
};
|
|
199
200
|
|
|
200
|
-
|
|
201
|
-
target: LooseObject,
|
|
202
|
-
propertyName?: string
|
|
203
|
-
): LooseObject => {
|
|
204
|
-
let keys = !propertyName
|
|
205
|
-
? [...Object.getOwnPropertyNames(target)]
|
|
206
|
-
: [propertyName];
|
|
201
|
+
type Class<T> = new (...args: any[]) => T;
|
|
207
202
|
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
Constructor = Object;
|
|
230
|
-
}
|
|
231
|
-
break;
|
|
232
|
-
default:
|
|
233
|
-
return;
|
|
203
|
+
// repository for observable class wrappers
|
|
204
|
+
const classRepo: LooseObject = {};
|
|
205
|
+
|
|
206
|
+
// creates a new observable class wrapper
|
|
207
|
+
function makeObservable(val: any): Class<typeof val>{
|
|
208
|
+
|
|
209
|
+
const Constructor = val.constructor,
|
|
210
|
+
ConstructorName: string = Constructor.name;
|
|
211
|
+
|
|
212
|
+
let ObservableClass = class extends Constructor {
|
|
213
|
+
#notify: boolean = true;
|
|
214
|
+
#callbacks: Array<Function> = [];
|
|
215
|
+
|
|
216
|
+
constructor(val: any) {
|
|
217
|
+
super(val);
|
|
218
|
+
(this.constructor as LooseObject).callbacks = [];
|
|
219
|
+
if (isObservableObject(val)) {
|
|
220
|
+
// you cannot bind native values to the dom
|
|
221
|
+
Object.getOwnPropertyNames(val).forEach((key) => {
|
|
222
|
+
this[key] = val[key];
|
|
223
|
+
});
|
|
234
224
|
}
|
|
235
225
|
}
|
|
236
226
|
|
|
237
|
-
|
|
238
|
-
|
|
227
|
+
get callbacks(): Array<Function> {
|
|
228
|
+
return this.#callbacks
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
set callbacks( callbacks: Array<Function> ){
|
|
232
|
+
this.#callbacks = callbacks
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
observe(f: Function) {
|
|
236
|
+
//console.log('observe');
|
|
237
|
+
this.#callbacks.push(f);
|
|
238
|
+
return this;
|
|
239
|
+
}
|
|
239
240
|
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
(
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
241
|
+
bind(target: HTMLElement | DocumentFragment | ShadowRoot) {
|
|
242
|
+
const that = this,
|
|
243
|
+
iso = isObservableObject(that.valueOf());
|
|
244
|
+
//console.log('bind', iso, target);
|
|
245
|
+
|
|
246
|
+
if (iso) {
|
|
247
|
+
makePlaceholders(target);
|
|
248
|
+
const placeholders: unknown = [
|
|
249
|
+
...target.querySelectorAll('[_mc]'),
|
|
250
|
+
].filter((e) => !!(e as LooseObject)?._mc?._placeholders);
|
|
251
|
+
//console.log('placeholders:', target, placeholders);
|
|
252
|
+
const func = function callback(data: LooseObject) {
|
|
253
|
+
// avoid bubbling for speed
|
|
254
|
+
let d = flattenObject(data);
|
|
255
|
+
//console.log('inside callback', target, d);
|
|
256
|
+
(placeholders as DC[]).forEach((e) => {
|
|
257
|
+
// console.log('trigger callback', e);
|
|
258
|
+
if (!e) return;
|
|
259
|
+
(e as any)._mc.trigger('data', d);
|
|
247
260
|
});
|
|
248
|
-
}
|
|
261
|
+
};
|
|
262
|
+
(that as any).#callbacks.push(func);
|
|
263
|
+
that.notify();
|
|
264
|
+
} else {
|
|
265
|
+
console.warn(
|
|
266
|
+
'IGNORED - cannot bind a non-Object to the dom, IS:',
|
|
267
|
+
typeof that.valueOf(),
|
|
268
|
+
that
|
|
269
|
+
);
|
|
249
270
|
}
|
|
250
271
|
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
272
|
+
return this;
|
|
273
|
+
}
|
|
274
|
+
|
|
275
|
+
notify(notify?: boolean) {
|
|
276
|
+
let that = this,
|
|
277
|
+
data =
|
|
278
|
+
isObservableObject(that.valueOf()) &&
|
|
279
|
+
that.valueOf() instanceof Array === false
|
|
280
|
+
? structuredClone(Object.assign({}, that))
|
|
281
|
+
: that.valueOf();
|
|
282
|
+
|
|
283
|
+
if (notify !== undefined) {
|
|
284
|
+
that.#notify = notify;
|
|
285
|
+
// return;
|
|
255
286
|
}
|
|
256
287
|
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
//
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
//console.log('placeholders:', target, placeholders);
|
|
268
|
-
const func = function callback(data: LooseObject) {
|
|
269
|
-
// avoid bubbling for speed
|
|
270
|
-
let d = flattenObject(data);
|
|
271
|
-
//console.log('inside callback', target, d);
|
|
272
|
-
(placeholders as DC[]).forEach((e) => {
|
|
273
|
-
// console.log('trigger callback', e);
|
|
274
|
-
if (!e) return;
|
|
275
|
-
(e as any)._mc.trigger('data', d);
|
|
276
|
-
});
|
|
277
|
-
};
|
|
278
|
-
(that.constructor as any).callbacks.push(func);
|
|
279
|
-
that.notify();
|
|
280
|
-
} else {
|
|
281
|
-
console.warn(
|
|
282
|
-
'IGNORED - cannot bind a non-Object to the dom, IS:',
|
|
283
|
-
typeof that.valueOf(),
|
|
284
|
-
that
|
|
285
|
-
);
|
|
286
|
-
}
|
|
288
|
+
//if (that.#notify) console.log('notify', this, data);
|
|
289
|
+
(that as any).#callbacks.forEach((f: Function) => {
|
|
290
|
+
// console.log(
|
|
291
|
+
// (this.constructor as any).callbacks,
|
|
292
|
+
// 'notify: exec callback',
|
|
293
|
+
// f,
|
|
294
|
+
// data
|
|
295
|
+
// );
|
|
296
|
+
f(data);
|
|
297
|
+
});
|
|
287
298
|
|
|
288
|
-
|
|
289
|
-
|
|
299
|
+
return that;
|
|
300
|
+
}
|
|
301
|
+
};
|
|
290
302
|
|
|
291
|
-
|
|
292
|
-
let that = this,
|
|
293
|
-
data =
|
|
294
|
-
isObservableObject(that.valueOf()) &&
|
|
295
|
-
that.valueOf() instanceof Array === false
|
|
296
|
-
? structuredClone(Object.assign({}, that))
|
|
297
|
-
: that.valueOf();
|
|
298
|
-
|
|
299
|
-
if (notify !== undefined) {
|
|
300
|
-
that.#notify = notify;
|
|
301
|
-
// return;
|
|
302
|
-
}
|
|
303
|
+
(classRepo as any)[ConstructorName] = ObservableClass;
|
|
303
304
|
|
|
304
|
-
|
|
305
|
-
(that.constructor as any).callbacks.forEach((f: Function) => {
|
|
306
|
-
// console.log(
|
|
307
|
-
// (this.constructor as any).callbacks,
|
|
308
|
-
// 'notify: exec callback',
|
|
309
|
-
// f,
|
|
310
|
-
// data
|
|
311
|
-
// );
|
|
312
|
-
f(data);
|
|
313
|
-
});
|
|
305
|
+
// console.log( 'classRepo:', classRepo );
|
|
314
306
|
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
};
|
|
307
|
+
return ObservableClass;
|
|
308
|
+
}
|
|
318
309
|
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
get() {
|
|
324
|
-
if (isObservableObject(o.valueOf())) {
|
|
325
|
-
let check = structuredClone(Object.assign({}, o));
|
|
326
|
-
setTimeout(
|
|
327
|
-
debounce(function checkChanges() {
|
|
328
|
-
let state = structuredClone(Object.assign({}, o));
|
|
329
|
-
//console.log( 'check changes', state, check );
|
|
330
|
-
if (!deepEqual(state, check)) {
|
|
331
|
-
//console.log( '-> not equal!' );
|
|
332
|
-
o.notify();
|
|
333
|
-
}
|
|
334
|
-
}, 0),
|
|
335
|
-
0
|
|
336
|
-
);
|
|
337
|
-
}
|
|
338
|
-
return o;
|
|
339
|
-
},
|
|
340
|
-
set(val: any) {
|
|
341
|
-
//console.log( 'SET:', isObservableObject( val.valueOf() ), 'set:', val, 'to', isObservableObject( o.valueOf() ), o, );
|
|
342
|
-
if (typeof val === typeof o.valueOf()) {
|
|
343
|
-
let iso =
|
|
344
|
-
isObservableObject(o.valueOf()) &&
|
|
345
|
-
o.valueOf() instanceof Array === false;
|
|
346
|
-
//console.log('target iso:', iso);
|
|
347
|
-
if (iso) {
|
|
348
|
-
let old = structuredClone(Object.assign({}, o));
|
|
349
|
-
//val = structuredClone(Object.assign({}, val));
|
|
350
|
-
|
|
351
|
-
//let callbacks = (o.constructor as LooseObject).callbacks;
|
|
352
|
-
if (o instanceof Observable === false) {
|
|
353
|
-
o = new Observable(structuredClone(Object.assign({}, val)));
|
|
354
|
-
copyGettersSetters(val, o);
|
|
355
|
-
o.seal();
|
|
356
|
-
}
|
|
357
|
-
Object.assign(o, val);
|
|
310
|
+
function getConstructor( val: any ): Class<typeof val> {
|
|
311
|
+
let key: string = val.constructor.name;
|
|
312
|
+
return classRepo[key] || makeObservable( val );
|
|
313
|
+
}
|
|
358
314
|
|
|
359
|
-
|
|
360
|
-
|
|
315
|
+
export const observe = (
|
|
316
|
+
target: LooseObject,
|
|
317
|
+
propertyName?: string
|
|
318
|
+
): LooseObject => {
|
|
319
|
+
let keys = !propertyName
|
|
320
|
+
? [...Object.getOwnPropertyNames(target)]
|
|
321
|
+
: [propertyName];
|
|
361
322
|
|
|
323
|
+
keys.forEach((key) => {
|
|
324
|
+
if (
|
|
325
|
+
target.hasOwnProperty(key)
|
|
326
|
+
&& typeof target[key] !== 'function'
|
|
327
|
+
&& !target?.[key]?.constructor?.prototype?.observe
|
|
328
|
+
) {
|
|
329
|
+
|
|
330
|
+
// console.log( 'co propname', key, typeof target[key], target[key] );
|
|
331
|
+
if (key[0] === '_' || target?.[key] === undefined) return target;
|
|
332
|
+
let val: any = target[key];
|
|
333
|
+
|
|
334
|
+
let o = new ( getConstructor(val) as Class<typeof val> )( val );
|
|
335
|
+
|
|
336
|
+
Object.defineProperty(target, key, {
|
|
337
|
+
enumerable: true,
|
|
338
|
+
get() {
|
|
339
|
+
if (isObservableObject(o.valueOf())) {
|
|
340
|
+
let check = structuredClone(Object.assign({}, o));
|
|
362
341
|
setTimeout(
|
|
363
|
-
// check for changes
|
|
364
342
|
debounce(function checkChanges() {
|
|
365
343
|
let state = structuredClone(Object.assign({}, o));
|
|
366
344
|
//console.log( 'check changes', state, check );
|
|
367
|
-
if (!deepEqual(state,
|
|
345
|
+
if (!deepEqual(state, check)) {
|
|
368
346
|
//console.log( '-> not equal!' );
|
|
369
347
|
o.notify();
|
|
370
348
|
}
|
|
371
349
|
}, 0),
|
|
372
350
|
0
|
|
373
351
|
);
|
|
374
|
-
}
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
o.
|
|
352
|
+
}
|
|
353
|
+
return o;
|
|
354
|
+
},
|
|
355
|
+
set(val: any) {
|
|
356
|
+
//console.log( 'SET:', isObservableObject( val.valueOf() ), 'set:', val, 'to', isObservableObject( o.valueOf() ), o, );
|
|
357
|
+
if (typeof val === typeof o.valueOf()) {
|
|
358
|
+
let iso =
|
|
359
|
+
isObservableObject(o.valueOf()) &&
|
|
360
|
+
o.valueOf() instanceof Array === false;
|
|
361
|
+
//console.log('target iso:', iso);
|
|
362
|
+
if (iso) {
|
|
363
|
+
let old = structuredClone(Object.assign({}, o));
|
|
364
|
+
//val = structuredClone(Object.assign({}, val));
|
|
365
|
+
|
|
366
|
+
//let callbacks = (o.constructor as LooseObject).callbacks;
|
|
367
|
+
if (o?.constructor?.prototype?.observe === undefined ) {
|
|
368
|
+
o = new ( getConstructor(val) as Class<typeof val> )( structuredClone(Object.assign({}, val)) );
|
|
369
|
+
copyGettersSetters(val, o);
|
|
370
|
+
o.seal();
|
|
371
|
+
}
|
|
372
|
+
Object.assign(o, val);
|
|
373
|
+
|
|
374
|
+
// console.log('after set o=', o, 'check', old);
|
|
375
|
+
// (o.constructor as LooseObject).callbacks = callbacks;
|
|
376
|
+
|
|
377
|
+
setTimeout(
|
|
378
|
+
// check for changes
|
|
379
|
+
debounce(function checkChanges() {
|
|
380
|
+
let state = structuredClone(Object.assign({}, o));
|
|
381
|
+
//console.log( 'check changes', state, check );
|
|
382
|
+
if (!deepEqual(state, old)) {
|
|
383
|
+
//console.log( '-> not equal!' );
|
|
384
|
+
o.notify();
|
|
385
|
+
}
|
|
386
|
+
}, 0),
|
|
387
|
+
0
|
|
388
|
+
);
|
|
389
|
+
} else {
|
|
390
|
+
// simple native var
|
|
391
|
+
let old = o.valueOf(),
|
|
392
|
+
callbacks = (o as Observable).callbacks;
|
|
393
|
+
|
|
394
|
+
// console.log( 'sO', o, o.valueOf(), 'val', val );
|
|
395
|
+
if (val !== old) {
|
|
396
|
+
// console.log( '-> sO new val', val );
|
|
397
|
+
o = new ( getConstructor(val) as Class<typeof val> )( val );
|
|
398
|
+
(o as Observable).callbacks = callbacks;
|
|
399
|
+
o.notify();
|
|
400
|
+
}
|
|
382
401
|
}
|
|
402
|
+
} else {
|
|
403
|
+
console.warn(
|
|
404
|
+
'IGNORED - cannot change observable types, IS:',
|
|
405
|
+
typeof o.valueOf(),
|
|
406
|
+
o,
|
|
407
|
+
'- CANNOT BECOME:',
|
|
408
|
+
typeof val
|
|
409
|
+
);
|
|
383
410
|
}
|
|
384
|
-
}
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
typeof val
|
|
391
|
-
);
|
|
392
|
-
}
|
|
393
|
-
},
|
|
394
|
-
});
|
|
411
|
+
},
|
|
412
|
+
});
|
|
413
|
+
|
|
414
|
+
// replace old property with proxy (observable)
|
|
415
|
+
target[key] = val;
|
|
416
|
+
};
|
|
395
417
|
|
|
396
|
-
// replace old property with proxy (observable)
|
|
397
|
-
target[key] = val;
|
|
398
418
|
});
|
|
399
419
|
|
|
400
420
|
return target;
|
package/src/test/test.ts
CHANGED
|
@@ -39,7 +39,7 @@ class Translator extends DC {
|
|
|
39
39
|
// setup
|
|
40
40
|
that.#translations = translations;
|
|
41
41
|
|
|
42
|
-
//
|
|
42
|
+
// on language change switch translation object
|
|
43
43
|
(that.Language as Observable).observe((lang) => {
|
|
44
44
|
if (that.#translations.hasOwnProperty(lang)) {
|
|
45
45
|
that.Translation = { lang: that.#translations[lang] }; // set translation
|
package/webpack.config.js
CHANGED