@base-framework/organisms 1.0.29 → 1.0.32
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/README.md +44 -79
- package/dist/organisms.js +1 -1
- package/dist/organisms.js.map +4 -4
- package/dist/types/lists/list.d.ts +4 -0
- package/dist/types/organisms.d.ts +3 -1
- package/dist/types/router/nav-link.d.ts +7 -0
- package/dist/types/time/dynamic-time.d.ts +33 -0
- package/dist/types/utils/timer.d.ts +55 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# Base
|
|
1
|
+
# Base Organisms
|
|
2
2
|
|
|
3
3
|
**Version**: 1.0.0
|
|
4
4
|
|
|
@@ -7,40 +7,60 @@ This documentation aims to guide the enhancement of component scalability and re
|
|
|
7
7
|
|
|
8
8
|
This module will add default organisms to your project.
|
|
9
9
|
|
|
10
|
-
##
|
|
11
|
-
|
|
10
|
+
## Atomic Design
|
|
11
|
+
If you need to learn about atomic design, please refer to the [Atomic Design](https://bradfrost.com/blog/post/atomic-web-design/) documentation.
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
Organisms can be composed of various atoms and reused across different components. This promotes a modular approach to building user interfaces.
|
|
13
|
+
To learn more about Base framework or how to build atoms, refer to the [Base](https://github.com/chrisdurfee/base/wiki) documentation.
|
|
15
14
|
|
|
16
|
-
|
|
17
|
-
Organisms can be
|
|
18
|
-
|
|
19
|
-
### Function Oragnisms
|
|
20
|
-
These atoms are instantiated with either standard functions or arrow functions, equipped with a props object to transfer properties to the atoms.
|
|
15
|
+
### Oragnism Structure
|
|
16
|
+
Organisms can be created using atoms, other organisms, and components. Atoms are the smallest building blocks of a component, while components are composed of atoms and other components. Organisms are a collection of atoms and components that form a larger structure.
|
|
21
17
|
|
|
22
18
|
```typescript
|
|
19
|
+
// Atom
|
|
20
|
+
const Link = Atom((props, children) => ({
|
|
21
|
+
...props,
|
|
22
|
+
children,
|
|
23
|
+
tag: 'a',
|
|
24
|
+
}));
|
|
25
|
+
|
|
26
|
+
// Organism Atom
|
|
23
27
|
const Link = Atom((props, children) => (
|
|
24
|
-
|
|
28
|
+
Link({...props }, [
|
|
25
29
|
Icon({ class: 'icon' }),
|
|
26
30
|
children
|
|
27
31
|
])
|
|
28
32
|
));
|
|
29
|
-
```
|
|
30
33
|
|
|
31
|
-
|
|
32
|
-
|
|
34
|
+
// Organism Atom with Component
|
|
35
|
+
const Link = Atom((props, children) => (
|
|
36
|
+
Nav([
|
|
37
|
+
Ul([
|
|
38
|
+
Li([
|
|
39
|
+
Link([
|
|
40
|
+
Icon({ class: 'icon' }),
|
|
41
|
+
Span('Text')
|
|
42
|
+
])
|
|
43
|
+
])
|
|
44
|
+
])
|
|
45
|
+
]),
|
|
46
|
+
new List({...props }, [
|
|
47
|
+
children
|
|
48
|
+
])
|
|
49
|
+
));
|
|
33
50
|
|
|
34
|
-
|
|
35
|
-
const
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
}
|
|
51
|
+
// Organism Function with Component
|
|
52
|
+
const List = (props, children) => Div([
|
|
53
|
+
Header([
|
|
54
|
+
H1('Title')
|
|
55
|
+
]),
|
|
56
|
+
new List({...props }, [
|
|
57
|
+
children
|
|
58
|
+
])
|
|
59
|
+
]);
|
|
40
60
|
```
|
|
41
61
|
|
|
42
|
-
####
|
|
43
|
-
|
|
62
|
+
#### Organisms Nesting
|
|
63
|
+
Organisms should use composition to nest other atoms, organisms, or components.
|
|
44
64
|
|
|
45
65
|
```typescript
|
|
46
66
|
const SecondaryButton = Atom((props, children) => (Button({
|
|
@@ -50,36 +70,8 @@ const SecondaryButton = Atom((props, children) => (Button({
|
|
|
50
70
|
}));
|
|
51
71
|
```
|
|
52
72
|
|
|
53
|
-
##
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
### Accessing the Parent Component in an Atom
|
|
57
|
-
```typescript
|
|
58
|
-
class Page extends Component
|
|
59
|
-
{
|
|
60
|
-
render()
|
|
61
|
-
{
|
|
62
|
-
return Div([
|
|
63
|
-
SecondaryButton({
|
|
64
|
-
/**
|
|
65
|
-
* This will add a click event listener to the button.
|
|
66
|
-
*
|
|
67
|
-
* @param {Event} event The event object
|
|
68
|
-
* @param {Component} parent The parent component object
|
|
69
|
-
* @returns {void}
|
|
70
|
-
*/
|
|
71
|
-
click(event, parent) =>
|
|
72
|
-
{
|
|
73
|
-
// Code to access the parent component
|
|
74
|
-
}
|
|
75
|
-
})
|
|
76
|
-
]);
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
```
|
|
80
|
-
|
|
81
|
-
## Utilization of Atoms
|
|
82
|
-
To leverage an atom, invoke its function and pass the requisite values via a props and children. The Atoms created with the Atom callback functions support passing optional props or children to the atom. The props object should always be first but if the atom does not require props, the children array or string can be passed as the first argument.
|
|
73
|
+
## Utilization of Organisms
|
|
74
|
+
To leverage an organism, invoke its function and pass the requisite values via a props and children. The organisms created with the Atom callback functions support passing optional props or children to the atom. The props object should always be first but if the atom does not require props, the children array or string can be passed as the first argument.
|
|
83
75
|
|
|
84
76
|
```javascript
|
|
85
77
|
// props only
|
|
@@ -112,30 +104,3 @@ SecondaryButton({
|
|
|
112
104
|
}
|
|
113
105
|
})
|
|
114
106
|
```
|
|
115
|
-
|
|
116
|
-
The implementation of atoms is aimed at enhancing the readability and modularity of extensive layouts.
|
|
117
|
-
|
|
118
|
-
### Illustrative Example of a Complex Layout
|
|
119
|
-
```typescript
|
|
120
|
-
Section([
|
|
121
|
-
Article({ class: 'post' }, [
|
|
122
|
-
Header([
|
|
123
|
-
H1('Title')
|
|
124
|
-
])
|
|
125
|
-
])
|
|
126
|
-
])
|
|
127
|
-
```
|
|
128
|
-
|
|
129
|
-
## Contributing
|
|
130
|
-
|
|
131
|
-
Contributions to Base Framework are welcome. Follow these steps to contribute:
|
|
132
|
-
|
|
133
|
-
- Fork the repository.
|
|
134
|
-
- Create a new branch for your feature or bug fix.
|
|
135
|
-
- Commit your changes with clear, descriptive messages.
|
|
136
|
-
- Push your branch and submit a pull request.
|
|
137
|
-
- Before contributing, read our CONTRIBUTING.md for coding standards and community guidelines.
|
|
138
|
-
|
|
139
|
-
## License
|
|
140
|
-
|
|
141
|
-
Base Atoms are licensed under the MIT License. See the LICENSE file for details.
|
package/dist/organisms.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Div as
|
|
1
|
+
import{Div as I}from"@base-framework/atoms";import{Data as B,Jot as E}from"@base-framework/base";import{Builder as p,Html as v}from"@base-framework/base";var o=class{static first(t){return this.get(t,0)}static last(t){let e=t.childNodes.length-1;return this.get(t,e)}static get(t,e){return t?.childNodes[e]??null}static next(t){return t?.nextSibling??null}static previous(t){return t?.previousSibling??null}static index(t){if(!t||!t.parentNode)return-1;let e=t.parentNode.children;return Array.from(e).indexOf(t)}static getPreviousIndex(t){let e=this.index(t);return e>0?e-1:0}static replace(t,e,r){if(!e)return;let i=e.parentNode,n=this.getPreviousIndex(e);this.remove(e);let c=p.build(t,null,r);i.insertBefore(c,i.childNodes[n])}static remove(t){t&&v.removeChild(t)}static append(t,e,r){!t||p.build(t,e,r)}static prepend(t,e,r){if(!t)return;let i=p.build(t,null,r);e.insertBefore(i,e.firstChild)}};var f=(s,t,e)=>({index:s,item:t,status:e}),d=class{static diff(t,e,r){let i=this.arrayToMap(t,r),n=[],c=[];return e.forEach((a,h)=>{let l=a[r];if(!i.has(l)){n.push(f(h,a,"added"));return}let{item:k}=i.get(l);if(!this.deepEqual(k,a)){n.push(f(h,a,"updated"));return}n.push(f(h,a,"unchanged")),i.delete(l)}),i.forEach(({item:a})=>{c.push(a)}),{changes:n,deletedItems:c}}static arrayToMap(t,e){let r=new Map;return t.forEach((i,n)=>{r.set(i[e],{item:i,index:n})}),r}static deepEqual(t,e){if(t===e)return!0;if(typeof t!="object"||t===null||typeof e!="object"||e===null)return!1;let r=Object.keys(t),i=Object.keys(e);if(r.length!==i.length)return!1;for(let n of r)if(!i.includes(n)||!this.deepEqual(t[n],e[n]))return!1;return!0}};var T=E({setData(){return new B({items:this.items??[]})},render(){let s=this.row.bind(this);return I({class:`list ${this.class||""}`,for:["items",s]})},row(s){return typeof this.rowItem!="function"?null:this.rowItem(s)},delete(s){let t=this.findIndexByKey(s);if(t===-1)return;this.data.delete(`items[${t}]`);let e=o.get(this.panel,t);o.remove(e)},replace(s){if(s.status==="unchanged")return;let t=s.item;if(s.status==="added"){this.append(t);return}let e=t[this.key],r=this.findIndexByKey(e);if(r===-1)return;this.data.set(`items[${r}]`,t);let i=o.get(this.panel,r),n=this.row(t,r);o.replace(n,i,this)},remove(s){s.forEach(t=>{this.delete(t[this.key])})},append(s){Array.isArray(s)||(s=[s]);let t=[],e=this.data.items.length-1;s.forEach(r=>{t.push(this.row(r)),this.data.set(`items[${++e}]`,r)}),o.append(t,this.panel,this)},mingle(s,t=!1){let e=this.data.get("items"),r=d.diff(e,s,this.key);t&&r.deletedItems.length>0&&this.remove(r.deletedItems),r.changes.forEach(i=>{this.replace(i)})},prepend(s){Array.isArray(s)||(s=[s]);let t=[],e=s.reverse();e.forEach(i=>{t.push(this.row(i))});let r=e.concat(this.data.get("items"));this.data.stage.items=r,o.prepend(t,this.panel,this)},findIndexByKey(s){return this.data.items.findIndex(e=>e[this.key]===s)}});import{A as S}from"@base-framework/atoms";import{Component as N,router as A}from"@base-framework/base";var y=(s,t)=>({attr:s,value:t}),b=(s,t)=>new RegExp("^"+s+"($|#|/|\\.).*").test(t),m=class extends N{beforeSetup(){this.selectedClass=this.activeClass||"active"}render(){let t=this.href,e=this.text,r=this.setupWatchers(t,e);return S({tag:"a",class:this.class||this.className||null,onState:["selected",{[this.selectedClass]:!0}],href:this.getString(t),text:this.getString(e),nest:this.nest||this.children,watch:r})}getString(t){let e=typeof t;return e!=="object"&&e!=="undefined"?t:null}setupWatchers(t,e){let r=this.exact!==!1,i=A.data,n=[];return t&&typeof t=="object"&&n.push(y("href",t)),e&&typeof e=="object"&&n.push(y("text",e)),n.push({value:["[[path]]",i],callBack:(c,a)=>{let h=a.pathname+a.hash,l=r?c===h:b(a.pathname,c);this.update(l)}}),n}setupStates(){return{selected:!1}}update(t){this.state.selected=t}};import{Span as C}from"@base-framework/atoms";import{Component as D,SimpleData as M}from"@base-framework/base";var g=class{constructor(t,e){this.timer=null,this.callBack=e,this.duration=t||1e3}createTimer(t){this.timer=window.setTimeout(t,this.duration)}start(){this.stop();let t=this.returnCallBack.bind(this);this.createTimer(t)}stop(){window.clearTimeout(this.timer)}returnCallBack(){let t=this.callBack;typeof t=="function"&&t.call()}},u=class extends g{createTimer(t){this.timer=window.setInterval(t,this.duration)}stop(){window.clearInterval(this.timer)}};var w=new M({date:0}),$=6e4,q=new u($,()=>{w.increment("date")});q.start();var x=class extends D{setData(){return w}render(){return C({class:this.class,text:this.getTime(),onSet:["date",()=>this.getTime()]})}getTime(){let t=this.dateTime;return this.filter?this.filter(t):t}};export{x as DynamicTime,T as List,m as NavLink};
|
|
2
2
|
//# sourceMappingURL=organisms.js.map
|
package/dist/organisms.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../src/lists/list.js", "../src/utils/child-helper.js", "../src/utils/data-helper.js"],
|
|
4
|
-
"sourcesContent": ["import { Div } from '@base-framework/atoms';\r\nimport { Data, Jot } from '@base-framework/base';\r\nimport { ChildHelper } from 'src/utils/child-helper.js';\r\nimport { DataHelper } from 'src/utils/data-helper.js';\r\n\r\n/**\r\n * List\r\n *\r\n * This will create a list component.\r\n *\r\n * @class\r\n */\r\nexport const List = Jot(\r\n{\r\n /**\r\n * This will set the default data.\r\n *\r\n * @returns {object}\r\n */\r\n\tsetData()\r\n {\r\n // @ts-ignore\r\n return new Data({ items: this.items ?? [] })\r\n },\r\n\r\n /**\r\n * This will render the list.\r\n *\r\n * @returns {object}\r\n */\r\n\trender()\r\n {\r\n // @ts-ignore\r\n const rowCallBack = this.row.bind(this);\r\n\r\n return Div({\r\n // @ts-ignore\r\n class: `list ${this.class || ''}`,\r\n for: ['items', rowCallBack]\r\n });\r\n },\r\n\r\n /**\r\n * This will create a row for each item.\r\n *\r\n * @param {*} item\r\n * @returns {object|null}\r\n */\r\n row(item)\r\n {\r\n // @ts-ignore\r\n if (typeof this.rowItem !== 'function')\r\n {\r\n return null;\r\n }\r\n\r\n // @ts-ignore\r\n return this.rowItem(item);\r\n },\r\n\r\n /**\r\n * This will delete an item from the list.\r\n *\r\n * @public\r\n * @param {*} keyValue\r\n * @returns {void}\r\n */\r\n delete(keyValue)\r\n {\r\n // @ts-ignore\r\n const index = this.findIndexByKey(keyValue);\r\n if (index === -1)\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n this.data.delete(`items[${index}]`);\r\n // @ts-ignore\r\n const rowElement = ChildHelper.get(this.panel, index);\r\n ChildHelper.remove(rowElement);\r\n },\r\n\r\n /**\r\n * This will replace an item in the list.\r\n *\r\n * @protected\r\n * @param {object} row\r\n * @returns {void}\r\n */\r\n replace(row)\r\n {\r\n if (row.status === 'unchanged')\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n const item = row.item;\r\n if (row.status === 'added')\r\n {\r\n // @ts-ignore\r\n this.append(item);\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n const keyValue = item[this.key];\r\n // @ts-ignore\r\n const index = this.findIndexByKey(keyValue);\r\n if (index === -1)\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n this.data.set(`items[${index}]`, item);\r\n // @ts-ignore\r\n const oldRow = ChildHelper.get(this.panel, index);\r\n // @ts-ignore\r\n const layout = this.row(item, index);\r\n ChildHelper.replace(layout, oldRow, this);\r\n },\r\n\r\n /**\r\n * This will remove items from the list.\r\n *\r\n * @public\r\n * @param {array} items\r\n * @returns {void}\r\n */\r\n remove(items)\r\n {\r\n /**\r\n * This will get the deleted rows.\r\n */\r\n items.forEach((item) =>\r\n {\r\n // @ts-ignore\r\n this.delete(item[this.key]);\r\n });\r\n },\r\n\r\n /**\r\n * This will append items to the list.\r\n *\r\n * @public\r\n * @param {array|object} items\r\n * @returns {void}\r\n */\r\n append(items)\r\n {\r\n if (!Array.isArray(items))\r\n {\r\n items = [items];\r\n }\r\n\r\n /**\r\n * This will get all the new rows to be batched later.\r\n */\r\n const rows = [];\r\n // @ts-ignore\r\n let lastIndex = this.data.items.length - 1;\r\n items.forEach((item) =>\r\n {\r\n /**\r\n * This will build the new rows that will be appended.\r\n */\r\n // @ts-ignore\r\n rows.push(this.row(item));\r\n\r\n /**\r\n * This will silently add the new rows without re-rendering the entire list.\r\n */\r\n // @ts-ignore\r\n this.data.set(`items[${++lastIndex}]`, item);\r\n });\r\n\r\n // This will batch push all the rows.\r\n // @ts-ignore\r\n ChildHelper.append(rows, this.panel, this);\r\n },\r\n\r\n /**\r\n * This will mingle the new items with the old items.\r\n *\r\n * @public\r\n * @param {Array<Object>} newItems\r\n * @param {boolean} withDelete\r\n * @returns {void}\r\n */\r\n mingle(newItems, withDelete = false)\r\n {\r\n // @ts-ignore\r\n const oldItems = this.data.get('items');\r\n\r\n /**\r\n * This will diff the old and new items to determine what has\r\n * been added, updated, or deleted.\r\n */\r\n // @ts-ignore\r\n const changes = DataHelper.diff(oldItems, newItems, this.key);\r\n\r\n /**\r\n * We want to delete the items before adding and updating the\r\n * new items.\r\n */\r\n if (withDelete && changes.deletedItems.length > 0)\r\n {\r\n // @ts-ignore\r\n this.remove(changes.deletedItems);\r\n }\r\n\r\n /**\r\n * This will add or update the new rows.\r\n */\r\n changes.changes.forEach((row) =>\r\n {\r\n // @ts-ignore\r\n this.replace(row);\r\n });\r\n },\r\n\r\n /**\r\n * This will prepend items to the list.\r\n *\r\n * @public\r\n * @param {array|object} items\r\n * @returns {void}\r\n */\r\n prepend(items)\r\n {\r\n if (!Array.isArray(items))\r\n {\r\n items = [items];\r\n }\r\n\r\n /**\r\n * This will get all the new rows to be batched later.\r\n */\r\n const rows = [];\r\n const reverseItems = items.reverse();\r\n reverseItems.forEach((item) =>\r\n {\r\n /**\r\n * This will build the new rows that will be appended.\r\n */\r\n // @ts-ignore\r\n rows.push(this.row(item));\r\n });\r\n\r\n /**\r\n * This will silently add the new rows without re-rendering the entire list.\r\n */\r\n // @ts-ignore\r\n this.data.stage.items = reverseItems.concat(this.data.get('items'));\r\n\r\n // @ts-ignore\r\n ChildHelper.prepend(rows, this.panel, this);\r\n },\r\n\r\n /**\r\n * Finds the index of an item in the data array by its key.\r\n *\r\n * @private\r\n * @param {*} keyValue\r\n * @returns {number} Index of the item, or -1 if not found\r\n */\r\n findIndexByKey(keyValue)\r\n {\r\n //@ts-ignore\r\n const items = this.data.items;\r\n //@ts-ignore\r\n return items.findIndex((item) => item[this.key] === keyValue);\r\n }\r\n});", "import { Builder, Html } from \"@base-framework/base\";\r\n\r\n/**\r\n * ChildHelper\r\n *\r\n * This class will help with getting children of a node.\r\n *\r\n * @class\r\n */\r\nexport class ChildHelper\r\n{\r\n /**\r\n * This will get the first child.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\n\tstatic first(parent)\r\n {\r\n return this.get(parent, 0);\r\n }\r\n\r\n /**\r\n * This will get the last child.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\n static last(parent)\r\n {\r\n const index = parent.childNodes.length - 1;\r\n return this.get(parent, index);\r\n }\r\n\r\n /**\r\n * This will get the child at the specified index.\r\n *\r\n * @param {object} parent\r\n * @param {number} index\r\n * @returns {object|null}\r\n */\r\n static get(parent, index)\r\n {\r\n return parent?.childNodes[index] ?? null;\r\n }\r\n\r\n /**\r\n * This will get the parent of the node.\r\n *\r\n * @param {object} node\r\n * @returns {object|null}\r\n */\r\n static next(node)\r\n {\r\n return node?.nextSibling ?? null;\r\n }\r\n\r\n /**\r\n * This will get the previous sibling.\r\n *\r\n * @param {object} node\r\n * @returns {object|null}\r\n */\r\n static previous(node)\r\n {\r\n return node?.previousSibling ?? null;\r\n }\r\n\r\n /**\r\n * This will get the index of the node.\r\n *\r\n * @param {object} node\r\n * @returns {number}\r\n */\r\n static index(node)\r\n {\r\n if (!node || !node.parentNode)\r\n\t\t{\r\n return -1; // Return -1 if node or its parent doesn't exist\r\n }\r\n\r\n const children = node.parentNode.children;\r\n return Array.from(children).indexOf(node);\r\n }\r\n\r\n /**\r\n * This will get the previous index of the node.\r\n *\r\n * @param {object} node\r\n * @returns {number}\r\n */\r\n static getPreviousIndex(node)\r\n {\r\n let index = this.index(node);\r\n return (index > 0)? index - 1 : 0;\r\n }\r\n\r\n /**\r\n * This will replace a child layout.\r\n *\r\n * @param {object} layout\r\n * @param {object} oldChild\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static replace(layout, oldChild, parent)\r\n {\r\n if (!oldChild)\r\n {\r\n return;\r\n }\r\n\r\n // get child index from parent\r\n const container = oldChild.parentNode;\r\n const index = this.getPreviousIndex(oldChild);\r\n this.remove(oldChild);\r\n\r\n const frag = Builder.build(layout, null, parent);\r\n\r\n // append to parent at index\r\n container.insertBefore(frag, container.childNodes[index]);\r\n }\r\n\r\n /**\r\n * This will remove a child.\r\n *\r\n * @param {object} node\r\n * @returns {void}\r\n */\r\n static remove(node)\r\n {\r\n if (node)\r\n {\r\n Html.removeChild(node);\r\n }\r\n }\r\n\r\n /**\r\n * This will append a child layout.\r\n *\r\n * @param {object} childrenLayout\r\n * @param {object} container\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static append(childrenLayout, container, parent)\r\n {\r\n if (!childrenLayout)\r\n {\r\n return;\r\n }\r\n\r\n Builder.build(childrenLayout, container, parent);\r\n }\r\n\r\n /**\r\n * This will prepend a child layout.\r\n *\r\n * @param {object} childrenLayout\r\n * @param {object} container\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static prepend(childrenLayout, container, parent)\r\n {\r\n if (!childrenLayout)\r\n {\r\n return;\r\n }\r\n\r\n const frag = Builder.build(childrenLayout, null, parent);\r\n container.insertBefore(frag, container.firstChild);\r\n }\r\n}", "/**\r\n * This will create a new item.\r\n *\r\n * @param {number} index\r\n * @param {*} item\r\n * @param {string} status\r\n * @returns {object}\r\n */\r\nconst Item = (index, item, status) =>\r\n{\r\n\treturn {\r\n\t\tindex,\r\n\t\titem,\r\n\t\tstatus\r\n\t};\r\n};\r\n\r\n/**\r\n * DataHelper\r\n *\r\n * This will help with data manipulation.\r\n *\r\n * @class\r\n */\r\nexport class DataHelper\r\n{\r\n\t/**\r\n * Compares two arrays of objects and returns the differences based on a specified key.\r\n *\r\n * @param {Array<Object>} oldArray - The original array of objects.\r\n * @param {Array<Object>} newArray - The updated array of objects.\r\n * @param {string} key - The key used to compare objects in the arrays.\r\n * @returns {Object} An object containing arrays of added, updated, and deleted items.\r\n */\r\n\tstatic diff(oldArray, newArray, key)\r\n\t{\r\n\t\tconst oldItemsMap = this.arrayToMap(oldArray, key);\r\n\t\tconst changes = [];\r\n\t\tconst deletedItems = [];\r\n\r\n\t\t// Process new array to determine status of each item\r\n\t\tnewArray.forEach((newItem, newIndex) =>\r\n\t\t{\r\n\t\t\tconst keyValue = newItem[key];\r\n\t\t\tif (!oldItemsMap.has(keyValue))\r\n\t\t\t{\r\n\t\t\t\t// Item is added\r\n\t\t\t\tchanges.push(Item(newIndex, newItem, 'added'));\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tconst { item: oldItem } = oldItemsMap.get(keyValue);\r\n\t\t\tif (!this.deepEqual(oldItem, newItem))\r\n\t\t\t{\r\n\t\t\t\t// Item is updated\r\n\t\t\t\tchanges.push(Item(newIndex, newItem, 'updated'));\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\t// Item is unchanged\r\n\t\t\tchanges.push(Item(newIndex, newItem, 'unchanged'));\r\n\r\n\t\t\t// Remove from oldItemsMap to identify deletions later\r\n\t\t\toldItemsMap.delete(keyValue);\r\n\t\t});\r\n\r\n\t\t// Remaining items in oldItemsMap are deleted\r\n\t\toldItemsMap.forEach(({ item: oldItem }) =>\r\n\t\t{\r\n\t\t\tdeletedItems.push(oldItem);\r\n\t\t});\r\n\r\n\t\treturn {\r\n\t\t\tchanges,\r\n\t\t\tdeletedItems\r\n\t\t};\r\n\t}\r\n\r\n\t/**\r\n\t * Converts an array of objects into a Map keyed by the specified property.\r\n * Each value in the Map is an object containing the item and its index in the array.\r\n\t *\r\n\t * @param {Array<Object>} array - The array to convert.\r\n\t * @param {string} key - The key used to map the objects.\r\n\t * @returns {Map} A Map with keys as specified property and values as objects.\r\n\t * @private\r\n\t */\r\n\tstatic arrayToMap(array, key)\r\n\t{\r\n\t\tconst map = new Map();\r\n\t\tarray.forEach((item, index) =>\r\n\t\t{\r\n\t\t\tmap.set(item[key], { item, index });\r\n\t\t});\r\n\t\treturn map;\r\n\t}\r\n\r\n\t/**\r\n\t * Performs a deep comparison between two objects.\r\n\t *\r\n\t * @param {Object} obj1 - The first object to compare.\r\n\t * @param {Object} obj2 - The second object to compare.\r\n\t * @returns {boolean} True if objects are equal, else false.\r\n\t * @private\r\n\t */\r\n\tstatic deepEqual(obj1, obj2)\r\n\t{\r\n\t\tif (obj1 === obj2) return true;\r\n\r\n\t\tif (\r\n\t\t\ttypeof obj1 !== 'object' ||\r\n\t\t\tobj1 === null ||\r\n\t\t\ttypeof obj2 !== 'object' ||\r\n\t\t\tobj2 === null\r\n\t\t)\r\n\t\t{\r\n\t\t\treturn false;\r\n\t\t}\r\n\r\n\t\tconst keys1 = Object.keys(obj1);\r\n\t\tconst keys2 = Object.keys(obj2);\r\n\r\n\t\t// Different number of properties\r\n\t\tif (keys1.length !== keys2.length)\r\n\t\t{\r\n\t\t\treturn false\r\n\t\t}\r\n\r\n\t\tfor (const key of keys1)\r\n\t\t{\r\n\t\t\tif (!keys2.includes(key))\r\n\t\t\t{\r\n\t\t\t\treturn false;\r\n\t\t\t}\r\n\r\n\t\t\tif (!this.deepEqual(obj1[key], obj2[key]))\r\n\t\t\t{\r\n\t\t\t\treturn false\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn true;\r\n\t}\r\n}"],
|
|
5
|
-
"mappings": "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
|
|
6
|
-
"names": ["Div", "Data", "Jot", "Builder", "Html", "ChildHelper", "parent", "index", "node", "children", "layout", "oldChild", "container", "frag", "childrenLayout", "Item", "index", "item", "status", "DataHelper", "oldArray", "newArray", "key", "oldItemsMap", "changes", "deletedItems", "newItem", "newIndex", "keyValue", "oldItem", "array", "map", "obj1", "obj2", "keys1", "keys2", "List", "Jot", "Data", "rowCallBack", "Div", "item", "keyValue", "index", "rowElement", "ChildHelper", "row", "oldRow", "layout", "items", "rows", "lastIndex", "newItems", "withDelete", "oldItems", "changes", "DataHelper", "reverseItems"]
|
|
3
|
+
"sources": ["../src/lists/list.js", "../src/utils/child-helper.js", "../src/utils/data-helper.js", "../src/router/nav-link.js", "../src/time/dynamic-time.js", "../src/utils/timer.js"],
|
|
4
|
+
"sourcesContent": ["import { Div } from '@base-framework/atoms';\r\nimport { Data, Jot } from '@base-framework/base';\r\nimport { ChildHelper } from 'src/utils/child-helper.js';\r\nimport { DataHelper } from 'src/utils/data-helper.js';\r\n\r\n/**\r\n * List\r\n *\r\n * This will create a list component.\r\n *\r\n * @property {string} class - The class to add to the list\r\n * @property {string} key - The key to use to identify the items\r\n * @property {array} [items] - The items\r\n *\r\n * @class\r\n */\r\nexport const List = Jot(\r\n{\r\n /**\r\n * This will set the default data.\r\n *\r\n * @returns {object}\r\n */\r\n\tsetData()\r\n {\r\n // @ts-ignore\r\n return new Data({ items: this.items ?? [] })\r\n },\r\n\r\n /**\r\n * This will render the list.\r\n *\r\n * @returns {object}\r\n */\r\n\trender()\r\n {\r\n // @ts-ignore\r\n const rowCallBack = this.row.bind(this);\r\n\r\n return Div({\r\n // @ts-ignore\r\n class: `list ${this.class || ''}`,\r\n for: ['items', rowCallBack]\r\n });\r\n },\r\n\r\n /**\r\n * This will create a row for each item.\r\n *\r\n * @param {*} item\r\n * @returns {object|null}\r\n */\r\n row(item)\r\n {\r\n // @ts-ignore\r\n if (typeof this.rowItem !== 'function')\r\n {\r\n return null;\r\n }\r\n\r\n // @ts-ignore\r\n return this.rowItem(item);\r\n },\r\n\r\n /**\r\n * This will delete an item from the list.\r\n *\r\n * @public\r\n * @param {*} keyValue\r\n * @returns {void}\r\n */\r\n delete(keyValue)\r\n {\r\n // @ts-ignore\r\n const index = this.findIndexByKey(keyValue);\r\n if (index === -1)\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n this.data.delete(`items[${index}]`);\r\n // @ts-ignore\r\n const rowElement = ChildHelper.get(this.panel, index);\r\n ChildHelper.remove(rowElement);\r\n },\r\n\r\n /**\r\n * This will replace an item in the list.\r\n *\r\n * @protected\r\n * @param {object} row\r\n * @returns {void}\r\n */\r\n replace(row)\r\n {\r\n if (row.status === 'unchanged')\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n const item = row.item;\r\n if (row.status === 'added')\r\n {\r\n // @ts-ignore\r\n this.append(item);\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n const keyValue = item[this.key];\r\n // @ts-ignore\r\n const index = this.findIndexByKey(keyValue);\r\n if (index === -1)\r\n {\r\n return;\r\n }\r\n\r\n // @ts-ignore\r\n this.data.set(`items[${index}]`, item);\r\n // @ts-ignore\r\n const oldRow = ChildHelper.get(this.panel, index);\r\n // @ts-ignore\r\n const layout = this.row(item, index);\r\n ChildHelper.replace(layout, oldRow, this);\r\n },\r\n\r\n /**\r\n * This will remove items from the list.\r\n *\r\n * @public\r\n * @param {array} items\r\n * @returns {void}\r\n */\r\n remove(items)\r\n {\r\n /**\r\n * This will get the deleted rows.\r\n */\r\n items.forEach((item) =>\r\n {\r\n // @ts-ignore\r\n this.delete(item[this.key]);\r\n });\r\n },\r\n\r\n /**\r\n * This will append items to the list.\r\n *\r\n * @public\r\n * @param {array|object} items\r\n * @returns {void}\r\n */\r\n append(items)\r\n {\r\n if (!Array.isArray(items))\r\n {\r\n items = [items];\r\n }\r\n\r\n /**\r\n * This will get all the new rows to be batched later.\r\n */\r\n const rows = [];\r\n // @ts-ignore\r\n let lastIndex = this.data.items.length - 1;\r\n items.forEach((item) =>\r\n {\r\n /**\r\n * This will build the new rows that will be appended.\r\n */\r\n // @ts-ignore\r\n rows.push(this.row(item));\r\n\r\n /**\r\n * This will silently add the new rows without re-rendering the entire list.\r\n */\r\n // @ts-ignore\r\n this.data.set(`items[${++lastIndex}]`, item);\r\n });\r\n\r\n // This will batch push all the rows.\r\n // @ts-ignore\r\n ChildHelper.append(rows, this.panel, this);\r\n },\r\n\r\n /**\r\n * This will mingle the new items with the old items.\r\n *\r\n * @public\r\n * @param {Array<Object>} newItems\r\n * @param {boolean} withDelete\r\n * @returns {void}\r\n */\r\n mingle(newItems, withDelete = false)\r\n {\r\n // @ts-ignore\r\n const oldItems = this.data.get('items');\r\n\r\n /**\r\n * This will diff the old and new items to determine what has\r\n * been added, updated, or deleted.\r\n */\r\n // @ts-ignore\r\n const changes = DataHelper.diff(oldItems, newItems, this.key);\r\n\r\n /**\r\n * We want to delete the items before adding and updating the\r\n * new items.\r\n */\r\n if (withDelete && changes.deletedItems.length > 0)\r\n {\r\n // @ts-ignore\r\n this.remove(changes.deletedItems);\r\n }\r\n\r\n /**\r\n * This will add or update the new rows.\r\n */\r\n changes.changes.forEach((row) =>\r\n {\r\n // @ts-ignore\r\n this.replace(row);\r\n });\r\n },\r\n\r\n /**\r\n * This will prepend items to the list.\r\n *\r\n * @public\r\n * @param {array|object} items\r\n * @returns {void}\r\n */\r\n prepend(items)\r\n {\r\n if (!Array.isArray(items))\r\n {\r\n items = [items];\r\n }\r\n\r\n /**\r\n * This will get all the new rows to be batched later.\r\n */\r\n const rows = [];\r\n const reverseItems = items.reverse();\r\n reverseItems.forEach((item) =>\r\n {\r\n /**\r\n * This will build the new rows that will be appended.\r\n */\r\n // @ts-ignore\r\n rows.push(this.row(item));\r\n });\r\n\r\n // This will use the get method to get the items as a raw array.\r\n // @ts-ignore\r\n const newItems = reverseItems.concat(this.data.get('items'));\r\n\r\n /**\r\n * This will silently add the new rows without re-rendering the entire\r\n * list. This will bypass the data object and directly add the items\r\n * to the stage.\r\n */\r\n // @ts-ignore\r\n this.data.stage.items = newItems;\r\n\r\n // @ts-ignore\r\n ChildHelper.prepend(rows, this.panel, this);\r\n },\r\n\r\n /**\r\n * Finds the index of an item in the data array by its key.\r\n *\r\n * @private\r\n * @param {*} keyValue\r\n * @returns {number} Index of the item, or -1 if not found\r\n */\r\n findIndexByKey(keyValue)\r\n {\r\n //@ts-ignore\r\n const items = this.data.items;\r\n //@ts-ignore\r\n return items.findIndex((item) => item[this.key] === keyValue);\r\n }\r\n});", "import { Builder, Html } from \"@base-framework/base\";\r\n\r\n/**\r\n * ChildHelper\r\n *\r\n * This class will help with getting children of a node.\r\n *\r\n * @class\r\n */\r\nexport class ChildHelper\r\n{\r\n /**\r\n * This will get the first child.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\n\tstatic first(parent)\r\n {\r\n return this.get(parent, 0);\r\n }\r\n\r\n /**\r\n * This will get the last child.\r\n *\r\n * @param {object} parent\r\n * @returns {object|null}\r\n */\r\n static last(parent)\r\n {\r\n const index = parent.childNodes.length - 1;\r\n return this.get(parent, index);\r\n }\r\n\r\n /**\r\n * This will get the child at the specified index.\r\n *\r\n * @param {object} parent\r\n * @param {number} index\r\n * @returns {object|null}\r\n */\r\n static get(parent, index)\r\n {\r\n return parent?.childNodes[index] ?? null;\r\n }\r\n\r\n /**\r\n * This will get the parent of the node.\r\n *\r\n * @param {object} node\r\n * @returns {object|null}\r\n */\r\n static next(node)\r\n {\r\n return node?.nextSibling ?? null;\r\n }\r\n\r\n /**\r\n * This will get the previous sibling.\r\n *\r\n * @param {object} node\r\n * @returns {object|null}\r\n */\r\n static previous(node)\r\n {\r\n return node?.previousSibling ?? null;\r\n }\r\n\r\n /**\r\n * This will get the index of the node.\r\n *\r\n * @param {object} node\r\n * @returns {number}\r\n */\r\n static index(node)\r\n {\r\n if (!node || !node.parentNode)\r\n\t\t{\r\n return -1; // Return -1 if node or its parent doesn't exist\r\n }\r\n\r\n const children = node.parentNode.children;\r\n return Array.from(children).indexOf(node);\r\n }\r\n\r\n /**\r\n * This will get the previous index of the node.\r\n *\r\n * @param {object} node\r\n * @returns {number}\r\n */\r\n static getPreviousIndex(node)\r\n {\r\n let index = this.index(node);\r\n return (index > 0)? index - 1 : 0;\r\n }\r\n\r\n /**\r\n * This will replace a child layout.\r\n *\r\n * @param {object} layout\r\n * @param {object} oldChild\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static replace(layout, oldChild, parent)\r\n {\r\n if (!oldChild)\r\n {\r\n return;\r\n }\r\n\r\n // get child index from parent\r\n const container = oldChild.parentNode;\r\n const index = this.getPreviousIndex(oldChild);\r\n this.remove(oldChild);\r\n\r\n const frag = Builder.build(layout, null, parent);\r\n\r\n // append to parent at index\r\n container.insertBefore(frag, container.childNodes[index]);\r\n }\r\n\r\n /**\r\n * This will remove a child.\r\n *\r\n * @param {object} node\r\n * @returns {void}\r\n */\r\n static remove(node)\r\n {\r\n if (node)\r\n {\r\n Html.removeChild(node);\r\n }\r\n }\r\n\r\n /**\r\n * This will append a child layout.\r\n *\r\n * @param {object} childrenLayout\r\n * @param {object} container\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static append(childrenLayout, container, parent)\r\n {\r\n if (!childrenLayout)\r\n {\r\n return;\r\n }\r\n\r\n Builder.build(childrenLayout, container, parent);\r\n }\r\n\r\n /**\r\n * This will prepend a child layout.\r\n *\r\n * @param {object} childrenLayout\r\n * @param {object} container\r\n * @param {object} parent\r\n * @returns {void}\r\n */\r\n static prepend(childrenLayout, container, parent)\r\n {\r\n if (!childrenLayout)\r\n {\r\n return;\r\n }\r\n\r\n const frag = Builder.build(childrenLayout, null, parent);\r\n container.insertBefore(frag, container.firstChild);\r\n }\r\n}", "/**\r\n * This will create a new item.\r\n *\r\n * @param {number} index\r\n * @param {*} item\r\n * @param {string} status\r\n * @returns {object}\r\n */\r\nconst Item = (index, item, status) =>\r\n{\r\n\treturn {\r\n\t\tindex,\r\n\t\titem,\r\n\t\tstatus\r\n\t};\r\n};\r\n\r\n/**\r\n * DataHelper\r\n *\r\n * This will help with data manipulation.\r\n *\r\n * @class\r\n */\r\nexport class DataHelper\r\n{\r\n\t/**\r\n * Compares two arrays of objects and returns the differences based on a specified key.\r\n *\r\n * @param {Array<Object>} oldArray - The original array of objects.\r\n * @param {Array<Object>} newArray - The updated array of objects.\r\n * @param {string} key - The key used to compare objects in the arrays.\r\n * @returns {Object} An object containing arrays of added, updated, and deleted items.\r\n */\r\n\tstatic diff(oldArray, newArray, key)\r\n\t{\r\n\t\tconst oldItemsMap = this.arrayToMap(oldArray, key);\r\n\t\tconst changes = [];\r\n\t\tconst deletedItems = [];\r\n\r\n\t\t// Process new array to determine status of each item\r\n\t\tnewArray.forEach((newItem, newIndex) =>\r\n\t\t{\r\n\t\t\tconst keyValue = newItem[key];\r\n\t\t\tif (!oldItemsMap.has(keyValue))\r\n\t\t\t{\r\n\t\t\t\t// Item is added\r\n\t\t\t\tchanges.push(Item(newIndex, newItem, 'added'));\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\tconst { item: oldItem } = oldItemsMap.get(keyValue);\r\n\t\t\tif (!this.deepEqual(oldItem, newItem))\r\n\t\t\t{\r\n\t\t\t\t// Item is updated\r\n\t\t\t\tchanges.push(Item(newIndex, newItem, 'updated'));\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\r\n\t\t\t// Item is unchanged\r\n\t\t\tchanges.push(Item(newIndex, newItem, 'unchanged'));\r\n\r\n\t\t\t// Remove from oldItemsMap to identify deletions later\r\n\t\t\toldItemsMap.delete(keyValue);\r\n\t\t});\r\n\r\n\t\t// Remaining items in oldItemsMap are deleted\r\n\t\toldItemsMap.forEach(({ item: oldItem }) =>\r\n\t\t{\r\n\t\t\tdeletedItems.push(oldItem);\r\n\t\t});\r\n\r\n\t\treturn {\r\n\t\t\tchanges,\r\n\t\t\tdeletedItems\r\n\t\t};\r\n\t}\r\n\r\n\t/**\r\n\t * Converts an array of objects into a Map keyed by the specified property.\r\n * Each value in the Map is an object containing the item and its index in the array.\r\n\t *\r\n\t * @param {Array<Object>} array - The array to convert.\r\n\t * @param {string} key - The key used to map the objects.\r\n\t * @returns {Map} A Map with keys as specified property and values as objects.\r\n\t * @private\r\n\t */\r\n\tstatic arrayToMap(array, key)\r\n\t{\r\n\t\tconst map = new Map();\r\n\t\tarray.forEach((item, index) =>\r\n\t\t{\r\n\t\t\tmap.set(item[key], { item, index });\r\n\t\t});\r\n\t\treturn map;\r\n\t}\r\n\r\n\t/**\r\n\t * Performs a deep comparison between two objects.\r\n\t *\r\n\t * @param {Object} obj1 - The first object to compare.\r\n\t * @param {Object} obj2 - The second object to compare.\r\n\t * @returns {boolean} True if objects are equal, else false.\r\n\t * @private\r\n\t */\r\n\tstatic deepEqual(obj1, obj2)\r\n\t{\r\n\t\tif (obj1 === obj2) return true;\r\n\r\n\t\tif (\r\n\t\t\ttypeof obj1 !== 'object' ||\r\n\t\t\tobj1 === null ||\r\n\t\t\ttypeof obj2 !== 'object' ||\r\n\t\t\tobj2 === null\r\n\t\t)\r\n\t\t{\r\n\t\t\treturn false;\r\n\t\t}\r\n\r\n\t\tconst keys1 = Object.keys(obj1);\r\n\t\tconst keys2 = Object.keys(obj2);\r\n\r\n\t\t// Different number of properties\r\n\t\tif (keys1.length !== keys2.length)\r\n\t\t{\r\n\t\t\treturn false\r\n\t\t}\r\n\r\n\t\tfor (const key of keys1)\r\n\t\t{\r\n\t\t\tif (!keys2.includes(key))\r\n\t\t\t{\r\n\t\t\t\treturn false;\r\n\t\t\t}\r\n\r\n\t\t\tif (!this.deepEqual(obj1[key], obj2[key]))\r\n\t\t\t{\r\n\t\t\t\treturn false\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\treturn true;\r\n\t}\r\n}", "import { A } from '@base-framework/atoms';\r\nimport { Component, router } from '@base-framework/base';\r\n\r\n/**\r\n * Watcher\r\n *\r\n * This will create a watcher object.\r\n *\r\n * @param {string} attr\r\n * @param {string} value\r\n * @returns {object}\r\n */\r\nconst Watcher = (attr, value) => ({\r\n attr,\r\n value\r\n});\r\n\r\n/**\r\n * This will check if the path is active.\r\n *\r\n * @param {string} path\r\n * @param {string} url\r\n * @returns {boolean}\r\n */\r\nconst iSActive = (path, url) => new RegExp('^' + path + '($|#|/|\\\\.).*').test(url);\r\n\r\n/**\r\n * NavLink\r\n *\r\n * This will create a nav link that will add an active\r\n * class when the browser route path matches the link\r\n * href.\r\n *\r\n * @property {string} activeClass - The active class to add.\r\n * @property {string} class - The class\r\n * @property {string} exact - The exact match\r\n * @property {string|object} href - The href or watcher object\r\n * @property {string|object} text - The text or watcher object\r\n * @property {array|string} nest - The nested elements\r\n *\r\n * @class\r\n * @extends Component\r\n */\r\nexport class NavLink extends Component\r\n{\r\n /**\r\n * This will configure the link active class.\r\n *\r\n * @protected\r\n * @returns {void}\r\n */\r\n beforeSetup()\r\n {\r\n // @ts-ignore\r\n this.selectedClass = this.activeClass || 'active';\r\n }\r\n\r\n /**\r\n * This will render the component.\r\n *\r\n * @returns {object}\r\n */\r\n render()\r\n {\r\n // @ts-ignore\r\n const href = this.href,\r\n\r\n // @ts-ignore\r\n text = this.text,\r\n watchers = this.setupWatchers(href, text);\r\n\r\n return A({\r\n tag: 'a',\r\n // @ts-ignore\r\n class: this.class || this.className || null,\r\n onState: ['selected', {\r\n [this.selectedClass]: true\r\n }],\r\n href: this.getString(href),\r\n text: this.getString(text),\r\n nest: this.nest || this.children,\r\n watch: watchers\r\n });\r\n }\r\n\r\n /**\r\n * This will get string.\r\n *\r\n * @param {string} string\r\n * @returns {(string|null)}\r\n */\r\n getString(string)\r\n {\r\n const type = typeof string;\r\n return (type !== 'object' && type !== 'undefined')? string : null;\r\n }\r\n\r\n /**\r\n * This will setup the watchers.\r\n *\r\n * @protected\r\n * @param {string} href\r\n * @param {string} text\r\n * @returns {array}\r\n */\r\n setupWatchers(href, text)\r\n {\r\n // @ts-ignore\r\n const exact = (this.exact !== false),\r\n data = router.data;\r\n\r\n const watchers = [];\r\n\r\n if (href && typeof href === 'object')\r\n {\r\n watchers.push(Watcher('href', href));\r\n }\r\n\r\n if (text && typeof text === 'object')\r\n {\r\n watchers.push(Watcher('text', text));\r\n }\r\n\r\n watchers.push({\r\n value: ['[[path]]', data],\r\n callBack: (value, ele) =>\r\n {\r\n const path = ele.pathname + ele.hash;\r\n\t\t\t\tconst selected = exact? (value === path) : (iSActive(ele.pathname, value));\r\n this.update(selected);\r\n }\r\n });\r\n\r\n return watchers;\r\n }\r\n\r\n /**\r\n * This will setup the states.\r\n *\r\n * @protected\r\n * @returns {object}\r\n */\r\n setupStates()\r\n {\r\n return {\r\n selected: false\r\n };\r\n }\r\n\r\n /**\r\n * This will update the class on the element.\r\n *\r\n * @param {boolean} selected\r\n * @returns {void}\r\n */\r\n update(selected)\r\n {\r\n this.state.selected = selected;\r\n }\r\n}", "import { Span } from \"@base-framework/atoms\";\r\nimport { Component, SimpleData } from \"@base-framework/base\";\r\nimport { IntervalTimer } from \"src/utils/timer\";\r\n\r\n/**\r\n * This will createa simple flat data object to use to bind\r\n * timer update.\r\n */\r\nconst data = new SimpleData({\r\n date: 0\r\n});\r\n\r\n/**\r\n * This will update the the data value every minute.\r\n */\r\nconst MINUTE_INTERVAL = 60000;\r\nconst timer = new IntervalTimer(MINUTE_INTERVAL, () =>\r\n{\r\n data.increment('date');\r\n});\r\n\r\ntimer.start();\r\n\r\n/**\r\n * DynamicTime\r\n *\r\n * This will create a dynamic time element that will update\r\n * the time every minute.\r\n *\r\n * @property {string} dateTime - The date time to display.\r\n * @property {function} [filter] - The filter to apply to the date time.\r\n *\r\n * @class\r\n * @augments Component\r\n */\r\nexport class DynamicTime extends Component\r\n{\r\n /**\r\n * This will set up the component data.\r\n *\r\n * @returns {object}\r\n */\r\n setData()\r\n {\r\n return data;\r\n }\r\n\r\n /**\r\n * This will render the component.\r\n *\r\n * @returns {object}\r\n */\r\n render()\r\n {\r\n return Span({\r\n // @ts-ignore\r\n class: this.class,\r\n text: this.getTime(),\r\n onSet: ['date', () => this.getTime()]\r\n });\r\n }\r\n\r\n /**\r\n * This will get the date and check to filter the value.\r\n *\r\n * @returns {string}\r\n */\r\n getTime()\r\n {\r\n // @ts-ignore\r\n const dateTime = this.dateTime;\r\n // @ts-ignore\r\n return (this.filter) ? this.filter(dateTime) : dateTime;\r\n }\r\n}", "/**\r\n * Timer\r\n *\r\n * This will create a timer that will call a callback function.\r\n *\r\n * @class\r\n */\r\nexport class Timer\r\n{\r\n /**\r\n * This will create a new timer.\r\n *\r\n * @param {number} duration\r\n * @param {function} callBack\r\n */\r\n\tconstructor(duration, callBack)\r\n\t{\r\n\t\tthis.timer = null;\r\n\t\tthis.callBack = callBack;\r\n\t\tthis.duration = duration || 1000;\r\n\t}\r\n\r\n /**\r\n * This will create a timer.\r\n *\r\n * @protected\r\n * @param {function} callBack\r\n * @returns {void}\r\n */\r\n\tcreateTimer(callBack)\r\n\t{\r\n\t\tthis.timer = window.setTimeout(callBack, this.duration);\r\n\t}\r\n\r\n /**\r\n * This will start the timer.\r\n *\r\n * @returns {void}\r\n */\r\n\tstart()\r\n\t{\r\n\t\tthis.stop();\r\n\t\tlet callBack = this.returnCallBack.bind(this);\r\n\t\tthis.createTimer(callBack);\r\n\t}\r\n\r\n /**\r\n * This will stop the timer.\r\n *\r\n * @returns {void}\r\n */\r\n\tstop()\r\n\t{\r\n\t\twindow.clearTimeout(this.timer);\r\n\t}\r\n\r\n /**\r\n * This will call the callback function.\r\n *\r\n * @private\r\n * @returns {void}\r\n */\r\n\treturnCallBack()\r\n\t{\r\n\t\tconst callBack = this.callBack;\r\n\t\tif (typeof callBack === 'function')\r\n\t\t{\r\n\t\t\tcallBack.call();\r\n\t\t}\r\n\t}\r\n}\r\n\r\n/**\r\n * IntervalTimer\r\n *\r\n * This will create a timer that will call a callback function.\r\n *\r\n * @class\r\n */\r\nexport class IntervalTimer extends Timer\r\n{\r\n /**\r\n * This will create a timer.\r\n *\r\n * @protected\r\n * @param {function} callBack\r\n * @returns {void}\r\n */\r\n\tcreateTimer(callBack)\r\n\t{\r\n\t\tthis.timer = window.setInterval(callBack, this.duration);\r\n\t}\r\n\r\n /**\r\n * This will stop the timer.\r\n *\r\n * @returns {void}\r\n */\r\n\tstop()\r\n\t{\r\n\t\twindow.clearInterval(this.timer);\r\n\t}\r\n}"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["Div", "Data", "Jot", "Builder", "Html", "ChildHelper", "parent", "index", "node", "children", "layout", "oldChild", "container", "frag", "childrenLayout", "Item", "index", "item", "status", "DataHelper", "oldArray", "newArray", "key", "oldItemsMap", "changes", "deletedItems", "newItem", "newIndex", "keyValue", "oldItem", "array", "map", "obj1", "obj2", "keys1", "keys2", "List", "Jot", "Data", "rowCallBack", "Div", "item", "keyValue", "index", "rowElement", "ChildHelper", "row", "oldRow", "layout", "items", "rows", "lastIndex", "newItems", "withDelete", "oldItems", "changes", "DataHelper", "reverseItems", "A", "Component", "router", "Watcher", "attr", "value", "iSActive", "path", "url", "NavLink", "href", "text", "watchers", "string", "type", "exact", "data", "ele", "selected", "Span", "Component", "SimpleData", "Timer", "duration", "callBack", "IntervalTimer", "data", "SimpleData", "MINUTE_INTERVAL", "timer", "IntervalTimer", "DynamicTime", "Component", "Span", "dateTime"]
|
|
7
7
|
}
|
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
*
|
|
4
4
|
* This will create a list component.
|
|
5
5
|
*
|
|
6
|
+
* @property {string} class - The class to add to the list
|
|
7
|
+
* @property {string} key - The key to use to identify the items
|
|
8
|
+
* @property {array} [items] - The items
|
|
9
|
+
*
|
|
6
10
|
* @class
|
|
7
11
|
*/
|
|
8
12
|
export const List: object | Function;
|
|
@@ -5,6 +5,13 @@
|
|
|
5
5
|
* class when the browser route path matches the link
|
|
6
6
|
* href.
|
|
7
7
|
*
|
|
8
|
+
* @property {string} activeClass - The active class to add.
|
|
9
|
+
* @property {string} class - The class
|
|
10
|
+
* @property {string} exact - The exact match
|
|
11
|
+
* @property {string|object} href - The href or watcher object
|
|
12
|
+
* @property {string|object} text - The text or watcher object
|
|
13
|
+
* @property {array|string} nest - The nested elements
|
|
14
|
+
*
|
|
8
15
|
* @class
|
|
9
16
|
* @extends Component
|
|
10
17
|
*/
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* DynamicTime
|
|
3
|
+
*
|
|
4
|
+
* This will create a dynamic time element that will update
|
|
5
|
+
* the time every minute.
|
|
6
|
+
*
|
|
7
|
+
* @property {string} dateTime - The date time to display.
|
|
8
|
+
* @property {function} [filter] - The filter to apply to the date time.
|
|
9
|
+
*
|
|
10
|
+
* @class
|
|
11
|
+
* @augments Component
|
|
12
|
+
*/
|
|
13
|
+
export class DynamicTime extends Component {
|
|
14
|
+
/**
|
|
15
|
+
* This will set up the component data.
|
|
16
|
+
*
|
|
17
|
+
* @returns {object}
|
|
18
|
+
*/
|
|
19
|
+
setData(): object;
|
|
20
|
+
/**
|
|
21
|
+
* This will render the component.
|
|
22
|
+
*
|
|
23
|
+
* @returns {object}
|
|
24
|
+
*/
|
|
25
|
+
render(): object;
|
|
26
|
+
/**
|
|
27
|
+
* This will get the date and check to filter the value.
|
|
28
|
+
*
|
|
29
|
+
* @returns {string}
|
|
30
|
+
*/
|
|
31
|
+
getTime(): string;
|
|
32
|
+
}
|
|
33
|
+
import { Component } from "@base-framework/base";
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Timer
|
|
3
|
+
*
|
|
4
|
+
* This will create a timer that will call a callback function.
|
|
5
|
+
*
|
|
6
|
+
* @class
|
|
7
|
+
*/
|
|
8
|
+
export class Timer {
|
|
9
|
+
/**
|
|
10
|
+
* This will create a new timer.
|
|
11
|
+
*
|
|
12
|
+
* @param {number} duration
|
|
13
|
+
* @param {function} callBack
|
|
14
|
+
*/
|
|
15
|
+
constructor(duration: number, callBack: Function);
|
|
16
|
+
timer: number;
|
|
17
|
+
callBack: Function;
|
|
18
|
+
duration: number;
|
|
19
|
+
/**
|
|
20
|
+
* This will create a timer.
|
|
21
|
+
*
|
|
22
|
+
* @protected
|
|
23
|
+
* @param {function} callBack
|
|
24
|
+
* @returns {void}
|
|
25
|
+
*/
|
|
26
|
+
protected createTimer(callBack: Function): void;
|
|
27
|
+
/**
|
|
28
|
+
* This will start the timer.
|
|
29
|
+
*
|
|
30
|
+
* @returns {void}
|
|
31
|
+
*/
|
|
32
|
+
start(): void;
|
|
33
|
+
/**
|
|
34
|
+
* This will stop the timer.
|
|
35
|
+
*
|
|
36
|
+
* @returns {void}
|
|
37
|
+
*/
|
|
38
|
+
stop(): void;
|
|
39
|
+
/**
|
|
40
|
+
* This will call the callback function.
|
|
41
|
+
*
|
|
42
|
+
* @private
|
|
43
|
+
* @returns {void}
|
|
44
|
+
*/
|
|
45
|
+
private returnCallBack;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* IntervalTimer
|
|
49
|
+
*
|
|
50
|
+
* This will create a timer that will call a callback function.
|
|
51
|
+
*
|
|
52
|
+
* @class
|
|
53
|
+
*/
|
|
54
|
+
export class IntervalTimer extends Timer {
|
|
55
|
+
}
|