@mjhls/mjh-framework 1.0.99 → 1.0.101
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 +172 -172
- package/dist/index.es.js +26 -25
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +25 -24
- package/dist/index.js.map +1 -1
- package/package.json +84 -84
package/README.md
CHANGED
|
@@ -1,172 +1,172 @@
|
|
|
1
|
-
|
|
2
|
-
# mjh-framework v. 1.0.
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
> Foundation Framework
|
|
6
|
-
|
|
7
|
-
[](https://www.npmjs.com/package/mjh-framework) [](https://standardjs.com)
|
|
8
|
-
|
|
9
|
-
## Install
|
|
10
|
-
|
|
11
|
-
```bash
|
|
12
|
-
npm install --save @mjhls/mjh-framework
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
## Usage
|
|
16
|
-
|
|
17
|
-
```jsx
|
|
18
|
-
import React, { Component } from 'react'
|
|
19
|
-
|
|
20
|
-
import { NavMagazine, DeckQueue } from 'mjh-framework'
|
|
21
|
-
|
|
22
|
-
export default class App extends Component {
|
|
23
|
-
render() {
|
|
24
|
-
return (
|
|
25
|
-
<div>
|
|
26
|
-
<NavMagazine />
|
|
27
|
-
<DeckQueue />
|
|
28
|
-
</div>
|
|
29
|
-
)
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
## Publish new updates to the npm registry
|
|
35
|
-
|
|
36
|
-
```bash
|
|
37
|
-
npm publish
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
## For getting updates in the template without publishing each time a change is made in the framework
|
|
41
|
-
|
|
42
|
-
Link react and react-dom of the template repo, so that it can be used by the framework.
|
|
43
|
-
This is to avoid the error arising due to multiple instances of React.
|
|
44
|
-
|
|
45
|
-
```bash
|
|
46
|
-
cd ../mjh-template/node_modules/react
|
|
47
|
-
|
|
48
|
-
yarn link
|
|
49
|
-
|
|
50
|
-
cd ../react-dom
|
|
51
|
-
|
|
52
|
-
yarn link
|
|
53
|
-
|
|
54
|
-
cd ../../../mjh-framework
|
|
55
|
-
|
|
56
|
-
yarn link react && yarn link react-dom
|
|
57
|
-
```
|
|
58
|
-
|
|
59
|
-
Link the framework repo so that it can be used in the template
|
|
60
|
-
|
|
61
|
-
```bash
|
|
62
|
-
npm link
|
|
63
|
-
|
|
64
|
-
cd ../mjh-template
|
|
65
|
-
|
|
66
|
-
npm link @mjhls/mjh-framework
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
## Components and "props"
|
|
70
|
-
|
|
71
|
-
### Deck Components
|
|
72
|
-
|
|
73
|
-
- #### DeckContent
|
|
74
|
-
|
|
75
|
-
##### Props
|
|
76
|
-
|
|
77
|
-
- mapping
|
|
78
|
-
- dataRecord
|
|
79
|
-
- query
|
|
80
|
-
- params
|
|
81
|
-
- pointer
|
|
82
|
-
- pointerArray
|
|
83
|
-
- defaultImage
|
|
84
|
-
|
|
85
|
-
- #### DeckQueue
|
|
86
|
-
##### Props
|
|
87
|
-
- page
|
|
88
|
-
- dataRecord
|
|
89
|
-
- query
|
|
90
|
-
- params
|
|
91
|
-
- pointer
|
|
92
|
-
- pointerArray
|
|
93
|
-
|
|
94
|
-
### Layout Components
|
|
95
|
-
|
|
96
|
-
- #### Column1
|
|
97
|
-
- #### Column2
|
|
98
|
-
##### Props
|
|
99
|
-
- rightItems
|
|
100
|
-
- #### Column3
|
|
101
|
-
##### Props
|
|
102
|
-
- leftItems
|
|
103
|
-
- rightItems
|
|
104
|
-
##### Common Props (Column1, Column2, Column3)
|
|
105
|
-
- title
|
|
106
|
-
- children
|
|
107
|
-
- #### Header
|
|
108
|
-
##### Props
|
|
109
|
-
- title
|
|
110
|
-
- keyword
|
|
111
|
-
- description
|
|
112
|
-
- #### LeftNav
|
|
113
|
-
##### Props
|
|
114
|
-
- leftItems
|
|
115
|
-
- #### AccordionPanel
|
|
116
|
-
##### Props
|
|
117
|
-
- accordionClassName
|
|
118
|
-
- data
|
|
119
|
-
|
|
120
|
-
### Navigation Components
|
|
121
|
-
|
|
122
|
-
- #### NavMagazine
|
|
123
|
-
##### Props
|
|
124
|
-
- logo
|
|
125
|
-
- dataObject
|
|
126
|
-
- #### NavNative
|
|
127
|
-
##### Props
|
|
128
|
-
- logo
|
|
129
|
-
- dataObject
|
|
130
|
-
- #### NavNormal
|
|
131
|
-
##### Props
|
|
132
|
-
- logo
|
|
133
|
-
- dataObject
|
|
134
|
-
- variant
|
|
135
|
-
- #### NavDvm
|
|
136
|
-
##### Props
|
|
137
|
-
- logo
|
|
138
|
-
- dataObject
|
|
139
|
-
- subNavHeads
|
|
140
|
-
|
|
141
|
-
### Template Components
|
|
142
|
-
|
|
143
|
-
- #### TemplateNormal
|
|
144
|
-
##### Props
|
|
145
|
-
- config
|
|
146
|
-
- title
|
|
147
|
-
- keywords
|
|
148
|
-
- description
|
|
149
|
-
- website
|
|
150
|
-
|
|
151
|
-
### Ad Components
|
|
152
|
-
|
|
153
|
-
- #### AD300x250
|
|
154
|
-
- #### AD300x250x600
|
|
155
|
-
- #### AD728x90
|
|
156
|
-
##### Common Props
|
|
157
|
-
- networkID
|
|
158
|
-
- adUnit
|
|
159
|
-
|
|
160
|
-
### Serializers
|
|
161
|
-
|
|
162
|
-
- #### getSerializers (function)
|
|
163
|
-
##### arguments
|
|
164
|
-
- client
|
|
165
|
-
##### types
|
|
166
|
-
- youtube
|
|
167
|
-
- figure
|
|
168
|
-
- slideshow
|
|
169
|
-
|
|
170
|
-
## License
|
|
171
|
-
|
|
172
|
-
MIT © [mjh-framework](https://github.com/mjh-framework)
|
|
1
|
+
|
|
2
|
+
# mjh-framework v. 1.0.101
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
> Foundation Framework
|
|
6
|
+
|
|
7
|
+
[](https://www.npmjs.com/package/mjh-framework) [](https://standardjs.com)
|
|
8
|
+
|
|
9
|
+
## Install
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
npm install --save @mjhls/mjh-framework
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
```jsx
|
|
18
|
+
import React, { Component } from 'react'
|
|
19
|
+
|
|
20
|
+
import { NavMagazine, DeckQueue } from 'mjh-framework'
|
|
21
|
+
|
|
22
|
+
export default class App extends Component {
|
|
23
|
+
render() {
|
|
24
|
+
return (
|
|
25
|
+
<div>
|
|
26
|
+
<NavMagazine />
|
|
27
|
+
<DeckQueue />
|
|
28
|
+
</div>
|
|
29
|
+
)
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Publish new updates to the npm registry
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
npm publish
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
## For getting updates in the template without publishing each time a change is made in the framework
|
|
41
|
+
|
|
42
|
+
Link react and react-dom of the template repo, so that it can be used by the framework.
|
|
43
|
+
This is to avoid the error arising due to multiple instances of React.
|
|
44
|
+
|
|
45
|
+
```bash
|
|
46
|
+
cd ../mjh-template/node_modules/react
|
|
47
|
+
|
|
48
|
+
yarn link
|
|
49
|
+
|
|
50
|
+
cd ../react-dom
|
|
51
|
+
|
|
52
|
+
yarn link
|
|
53
|
+
|
|
54
|
+
cd ../../../mjh-framework
|
|
55
|
+
|
|
56
|
+
yarn link react && yarn link react-dom
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
Link the framework repo so that it can be used in the template
|
|
60
|
+
|
|
61
|
+
```bash
|
|
62
|
+
npm link
|
|
63
|
+
|
|
64
|
+
cd ../mjh-template
|
|
65
|
+
|
|
66
|
+
npm link @mjhls/mjh-framework
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
## Components and "props"
|
|
70
|
+
|
|
71
|
+
### Deck Components
|
|
72
|
+
|
|
73
|
+
- #### DeckContent
|
|
74
|
+
|
|
75
|
+
##### Props
|
|
76
|
+
|
|
77
|
+
- mapping
|
|
78
|
+
- dataRecord
|
|
79
|
+
- query
|
|
80
|
+
- params
|
|
81
|
+
- pointer
|
|
82
|
+
- pointerArray
|
|
83
|
+
- defaultImage
|
|
84
|
+
|
|
85
|
+
- #### DeckQueue
|
|
86
|
+
##### Props
|
|
87
|
+
- page
|
|
88
|
+
- dataRecord
|
|
89
|
+
- query
|
|
90
|
+
- params
|
|
91
|
+
- pointer
|
|
92
|
+
- pointerArray
|
|
93
|
+
|
|
94
|
+
### Layout Components
|
|
95
|
+
|
|
96
|
+
- #### Column1
|
|
97
|
+
- #### Column2
|
|
98
|
+
##### Props
|
|
99
|
+
- rightItems
|
|
100
|
+
- #### Column3
|
|
101
|
+
##### Props
|
|
102
|
+
- leftItems
|
|
103
|
+
- rightItems
|
|
104
|
+
##### Common Props (Column1, Column2, Column3)
|
|
105
|
+
- title
|
|
106
|
+
- children
|
|
107
|
+
- #### Header
|
|
108
|
+
##### Props
|
|
109
|
+
- title
|
|
110
|
+
- keyword
|
|
111
|
+
- description
|
|
112
|
+
- #### LeftNav
|
|
113
|
+
##### Props
|
|
114
|
+
- leftItems
|
|
115
|
+
- #### AccordionPanel
|
|
116
|
+
##### Props
|
|
117
|
+
- accordionClassName
|
|
118
|
+
- data
|
|
119
|
+
|
|
120
|
+
### Navigation Components
|
|
121
|
+
|
|
122
|
+
- #### NavMagazine
|
|
123
|
+
##### Props
|
|
124
|
+
- logo
|
|
125
|
+
- dataObject
|
|
126
|
+
- #### NavNative
|
|
127
|
+
##### Props
|
|
128
|
+
- logo
|
|
129
|
+
- dataObject
|
|
130
|
+
- #### NavNormal
|
|
131
|
+
##### Props
|
|
132
|
+
- logo
|
|
133
|
+
- dataObject
|
|
134
|
+
- variant
|
|
135
|
+
- #### NavDvm
|
|
136
|
+
##### Props
|
|
137
|
+
- logo
|
|
138
|
+
- dataObject
|
|
139
|
+
- subNavHeads
|
|
140
|
+
|
|
141
|
+
### Template Components
|
|
142
|
+
|
|
143
|
+
- #### TemplateNormal
|
|
144
|
+
##### Props
|
|
145
|
+
- config
|
|
146
|
+
- title
|
|
147
|
+
- keywords
|
|
148
|
+
- description
|
|
149
|
+
- website
|
|
150
|
+
|
|
151
|
+
### Ad Components
|
|
152
|
+
|
|
153
|
+
- #### AD300x250
|
|
154
|
+
- #### AD300x250x600
|
|
155
|
+
- #### AD728x90
|
|
156
|
+
##### Common Props
|
|
157
|
+
- networkID
|
|
158
|
+
- adUnit
|
|
159
|
+
|
|
160
|
+
### Serializers
|
|
161
|
+
|
|
162
|
+
- #### getSerializers (function)
|
|
163
|
+
##### arguments
|
|
164
|
+
- client
|
|
165
|
+
##### types
|
|
166
|
+
- youtube
|
|
167
|
+
- figure
|
|
168
|
+
- slideshow
|
|
169
|
+
|
|
170
|
+
## License
|
|
171
|
+
|
|
172
|
+
MIT © [mjh-framework](https://github.com/mjh-framework)
|
package/dist/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React__default, { Component, useState, useEffect, useRef,
|
|
1
|
+
import React__default, { Component, useState, useEffect, useRef, createElement, createContext } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import reactDom from 'react-dom';
|
|
4
4
|
import Container from 'react-bootstrap/Container';
|
|
@@ -3937,14 +3937,14 @@ var DeckContent = function (_React$Component) {
|
|
|
3937
3937
|
var newPath = pageNumber === 1 ? '' + path : path + '?page=' + pageNumber;
|
|
3938
3938
|
|
|
3939
3939
|
// please leave this for later debug purpose : Yong Jun.
|
|
3940
|
-
/* console.log('page change reported', {
|
|
3941
|
-
currentPage: currentPage,
|
|
3942
|
-
pageNumber: pageNumber,
|
|
3943
|
-
pathname: pathname,
|
|
3944
|
-
path: path,
|
|
3945
|
-
newPath: newPath,
|
|
3946
|
-
firstPage: pageNumber === 1,
|
|
3947
|
-
queryString: queryString
|
|
3940
|
+
/* console.log('page change reported', {
|
|
3941
|
+
currentPage: currentPage,
|
|
3942
|
+
pageNumber: pageNumber,
|
|
3943
|
+
pathname: pathname,
|
|
3944
|
+
path: path,
|
|
3945
|
+
newPath: newPath,
|
|
3946
|
+
firstPage: pageNumber === 1,
|
|
3947
|
+
queryString: queryString
|
|
3948
3948
|
}) */
|
|
3949
3949
|
|
|
3950
3950
|
pageview(newPath);
|
|
@@ -5948,14 +5948,14 @@ var TaxonomyCard = function TaxonomyCard(props) {
|
|
|
5948
5948
|
);
|
|
5949
5949
|
};
|
|
5950
5950
|
|
|
5951
|
-
/*
|
|
5952
|
-
GROQ query -
|
|
5953
|
-
*[_type == "article" && references(*[_type == 'documentGroup' && name == 'test']._id)][0...10]{
|
|
5954
|
-
title,
|
|
5955
|
-
published,
|
|
5956
|
-
"thumbnail": thumbnail.asset->url,
|
|
5957
|
-
"url": url.current
|
|
5958
|
-
}
|
|
5951
|
+
/*
|
|
5952
|
+
GROQ query -
|
|
5953
|
+
*[_type == "article" && references(*[_type == 'documentGroup' && name == 'test']._id)][0...10]{
|
|
5954
|
+
title,
|
|
5955
|
+
published,
|
|
5956
|
+
"thumbnail": thumbnail.asset->url,
|
|
5957
|
+
"url": url.current
|
|
5958
|
+
}
|
|
5959
5959
|
*/
|
|
5960
5960
|
var GroupDeck = function GroupDeck(props) {
|
|
5961
5961
|
// Props should be an array of objects containing Thumbnail, title, and URL
|
|
@@ -6150,10 +6150,10 @@ var getYoutubeId = createCommonjsModule(function (module, exports) {
|
|
|
6150
6150
|
}));
|
|
6151
6151
|
});
|
|
6152
6152
|
|
|
6153
|
-
/*
|
|
6154
|
-
GROQ query -
|
|
6155
|
-
accepts an array of title, URL
|
|
6156
|
-
`http://img.youtube.com/vi/${getYouTubeId(vid.url)}/hqdefault.jpg`
|
|
6153
|
+
/*
|
|
6154
|
+
GROQ query -
|
|
6155
|
+
accepts an array of title, URL
|
|
6156
|
+
`http://img.youtube.com/vi/${getYouTubeId(vid.url)}/hqdefault.jpg`
|
|
6157
6157
|
*/
|
|
6158
6158
|
var YoutubeGroup = function YoutubeGroup(props) {
|
|
6159
6159
|
// Props should be an array of objects containing Thumbnail, title, and URL
|
|
@@ -12366,11 +12366,12 @@ var IFrame = function IFrame(_ref) {
|
|
|
12366
12366
|
|
|
12367
12367
|
var Video = function Video(_ref) {
|
|
12368
12368
|
var node = _ref.node,
|
|
12369
|
-
|
|
12369
|
+
accountIDs = _ref.accountIDs;
|
|
12370
12370
|
var source = node.source,
|
|
12371
12371
|
videoID = node.videoID;
|
|
12372
12372
|
|
|
12373
|
-
if (source === 'brightcove') return React__default.createElement(ReactPlayerLoader, { accountId:
|
|
12373
|
+
if (source === 'brightcove' && accountIDs.brightcove) return React__default.createElement(ReactPlayerLoader, { accountId: accountIDs.brightcove, videoId: videoID, attrs: { className: 'brightcove' } });
|
|
12374
|
+
// TODO - add players for other video types
|
|
12374
12375
|
return null;
|
|
12375
12376
|
};
|
|
12376
12377
|
|
|
@@ -12567,7 +12568,7 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
|
12567
12568
|
);
|
|
12568
12569
|
};
|
|
12569
12570
|
|
|
12570
|
-
var getSerializers$1 = function getSerializers(client, pageview,
|
|
12571
|
+
var getSerializers$1 = function getSerializers(client, pageview, videoAccountIDs) {
|
|
12571
12572
|
return {
|
|
12572
12573
|
types: {
|
|
12573
12574
|
youtube: function youtube(_ref) {
|
|
@@ -12622,7 +12623,7 @@ var getSerializers$1 = function getSerializers(client, pageview, brightcoveAccou
|
|
|
12622
12623
|
video: function video(_ref9) {
|
|
12623
12624
|
var node = _ref9.node;
|
|
12624
12625
|
|
|
12625
|
-
return React__default.createElement(Video, { node: node,
|
|
12626
|
+
return React__default.createElement(Video, { node: node, accountIDs: videoAccountIDs || {} });
|
|
12626
12627
|
},
|
|
12627
12628
|
audio: function audio(_ref10) {
|
|
12628
12629
|
var node = _ref10.node;
|