@mjhls/mjh-framework 1.0.776-block-table → 1.0.776-block-table-1

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.
@@ -49,7 +49,7 @@ require('react-bootstrap');
49
49
  require('./iconBase-68959171.js');
50
50
  require('./index.esm-974f47d9.js');
51
51
  var ArticleSeriesListing = require('./ArticleSeriesListing.js');
52
- var getSerializers = require('./index-12bc7e08.js');
52
+ var getSerializers = require('./index-88dd92b5.js');
53
53
  require('./util-f2c1b65b.js');
54
54
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
55
55
  require('next/head');
@@ -44,7 +44,7 @@ require('./GroupDeck.js');
44
44
  require('react-bootstrap');
45
45
  require('./iconBase-68959171.js');
46
46
  require('./index.esm-974f47d9.js');
47
- var getSerializers = require('./index-12bc7e08.js');
47
+ var getSerializers = require('./index-88dd92b5.js');
48
48
  require('./util-f2c1b65b.js');
49
49
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
50
50
  require('next/head');
@@ -46,7 +46,7 @@ require('react-bootstrap');
46
46
  require('./iconBase-68959171.js');
47
47
  var index_esm = require('./index.esm-974f47d9.js');
48
48
  var ArticleCarousel = require('./ArticleCarousel.js');
49
- var getSerializers = require('./index-12bc7e08.js');
49
+ var getSerializers = require('./index-88dd92b5.js');
50
50
  require('./util-f2c1b65b.js');
51
51
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
52
52
  require('next/head');
@@ -54,7 +54,7 @@ require('./timeDifferenceCalc.js');
54
54
  var QueueDeckExpanded = require('./QueueDeckExpanded.js');
55
55
  require('./iconBase-68959171.js');
56
56
  require('./index.esm-974f47d9.js');
57
- var getSerializers = require('./index-12bc7e08.js');
57
+ var getSerializers = require('./index-88dd92b5.js');
58
58
  require('./util-f2c1b65b.js');
59
59
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
60
60
  require('next/head');
@@ -44,7 +44,7 @@ require('./GroupDeck.js');
44
44
  require('react-bootstrap');
45
45
  require('./iconBase-68959171.js');
46
46
  require('./index.esm-974f47d9.js');
47
- var getSerializers = require('./index-12bc7e08.js');
47
+ var getSerializers = require('./index-88dd92b5.js');
48
48
  require('./util-f2c1b65b.js');
49
49
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
50
50
  var Head = require('next/head');
@@ -49,7 +49,7 @@ require('react-bootstrap');
49
49
  require('./iconBase-68959171.js');
50
50
  require('./index.esm-974f47d9.js');
51
51
  var VideoSeriesListing = require('./VideoSeriesListing.js');
52
- var getSerializers = require('./index-12bc7e08.js');
52
+ var getSerializers = require('./index-88dd92b5.js');
53
53
  require('./util-f2c1b65b.js');
54
54
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
55
55
  require('next/head');
package/dist/cjs/View.js CHANGED
@@ -46,7 +46,7 @@ require('./GroupDeck.js');
46
46
  require('react-bootstrap');
47
47
  require('./iconBase-68959171.js');
48
48
  require('./index.esm-974f47d9.js');
49
- var getSerializers = require('./index-12bc7e08.js');
49
+ var getSerializers = require('./index-88dd92b5.js');
50
50
  require('./util-f2c1b65b.js');
51
51
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
52
52
  var Head = require('next/head');
@@ -44,7 +44,7 @@ require('./GroupDeck.js');
44
44
  require('react-bootstrap');
45
45
  require('./iconBase-68959171.js');
46
46
  require('./index.esm-974f47d9.js');
47
- var getSerializers = require('./index-12bc7e08.js');
47
+ var getSerializers = require('./index-88dd92b5.js');
48
48
  require('./util-f2c1b65b.js');
49
49
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
50
50
  require('next/head');
@@ -9227,30 +9227,59 @@ var AnchorLinkElement = function AnchorLinkElement(props) {
9227
9227
  };
9228
9228
 
9229
9229
  var BlockTable = function BlockTable(props) {
9230
- var rows = props.node.rows,
9230
+ var _props$node = props.node,
9231
+ rows = _props$node.rows,
9232
+ _props$node$showBorde = _props$node.showBorders,
9233
+ showBorders = _props$node$showBorde === undefined ? true : _props$node$showBorde,
9234
+ borderColor = _props$node.borderColor,
9235
+ _props$node$borderWid = _props$node.borderWidth,
9236
+ borderWidth = _props$node$borderWid === undefined ? 1 : _props$node$borderWid,
9237
+ _props$node$minTableW = _props$node.minTableWidth,
9238
+ minTableWidth = _props$node$minTableW === undefined ? 500 : _props$node$minTableW,
9231
9239
  getSerializers = props.getSerializers,
9232
9240
  client = props.client;
9233
9241
 
9242
+ var _borderColor = borderColor ? borderColor.hex : '#000000';
9243
+ var holder = React.useRef();
9244
+ React.useEffect(function () {
9245
+ var handleResize = function handleResize() {
9246
+ var holderWidth = holder.current.offsetWidth;
9247
+ if (holderWidth < minTableWidth) {
9248
+ holder.current.style.overflow = 'scroll';
9249
+ } else {
9250
+ holder.current.style.overflow = 'hidden';
9251
+ }
9252
+ };
9253
+ handleResize();
9254
+ window.addEventListener('resize', handleResize);
9255
+ return function () {
9256
+ return window.removeEventListener('resize', handleResize);
9257
+ };
9258
+ }, []);
9234
9259
  return React__default['default'].createElement(
9235
9260
  'div',
9236
- { className: 'blockTable' },
9237
- rows && rows.map(function (row) {
9238
- return React__default['default'].createElement(
9239
- 'div',
9240
- { className: 'blockTableRow' },
9241
- row.cells && row.cells.map(function (cell) {
9242
- return React__default['default'].createElement(
9243
- 'div',
9244
- { className: 'blockTableCell', style: { width: 1 / row.cells.length * 100 + '%' } },
9245
- React__default['default'].createElement(BlockContent.BlockContent, _extends._extends({ blocks: cell.content, serializers: getSerializers }, client.config()))
9246
- );
9247
- })
9248
- );
9249
- }),
9261
+ { className: 'blockTableHolder', ref: holder },
9262
+ React__default['default'].createElement(
9263
+ 'div',
9264
+ { className: 'blockTable' },
9265
+ rows && rows.map(function (row) {
9266
+ return React__default['default'].createElement(
9267
+ 'div',
9268
+ { className: 'blockTableRow' },
9269
+ row.cells && row.cells.map(function (cell) {
9270
+ return React__default['default'].createElement(
9271
+ 'div',
9272
+ { className: 'blockTableCell', style: { width: (100 / row.cells.length).toFixed(2) + '%' } },
9273
+ React__default['default'].createElement(BlockContent.BlockContent, _extends._extends({ blocks: cell.content, serializers: getSerializers }, client.config()))
9274
+ );
9275
+ })
9276
+ );
9277
+ })
9278
+ ),
9250
9279
  React__default['default'].createElement(
9251
9280
  'style',
9252
9281
  { jsx: true },
9253
- '\n .blockTableRow {\n display: flex;\n border-top: 1px solid;\n }\n .blockTableRow:last-of-type {\n border-bottom: 1px solid;\n }\n .blockTableCell {\n padding: 0.25rem;\n border-left: 1px solid;\n }\n .blockTableCell:last-of-type {\n border-right: 1px solid;\n }\n .blockTableCell:last-child {\n color: red;\n }\n '
9282
+ '\n .blockTableRow {\n display: flex;\n ' + (showBorders && 'border-top: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTable {\n min-width: ' + minTableWidth + 'px;\n }\n .blockTableRow:last-of-type {\n ' + (showBorders && 'border-bottom: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTableCell {\n padding: 0.5rem;\n ' + (showBorders && 'border-left: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTableCell > div {\n width: 100%;\n }\n .blockTableCell > div p {\n margin: 0;\n }\n .blockTableCell > div figure {\n width: 100%;\n margin: 0;\n }\n .blockTableCell > div figure img {\n width: 100%;\n object-fit: contain;\n margin: 0;\n }\n .blockTableCell:last-of-type {\n ' + (showBorders && 'border-right: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n @media only screen and (max-width: 800px) {\n .blockTableCell {\n padding: 0.25rem;\n }\n }\n '
9254
9283
  )
9255
9284
  );
9256
9285
  };
package/dist/cjs/index.js CHANGED
@@ -72,7 +72,7 @@ require('./index.esm-974f47d9.js');
72
72
  var VideoSeriesListing = require('./VideoSeriesListing.js');
73
73
  var ArticleSeriesListing = require('./ArticleSeriesListing.js');
74
74
  var ArticleCarousel = require('./ArticleCarousel.js');
75
- var getSerializers = require('./index-12bc7e08.js');
75
+ var getSerializers = require('./index-88dd92b5.js');
76
76
  require('./util-f2c1b65b.js');
77
77
  require('./brightcove-react-player-loader.es-4ba0d3d5.js');
78
78
  require('next/head');
@@ -47,7 +47,7 @@ import 'react-bootstrap';
47
47
  import './iconBase-602d52fe.js';
48
48
  import './index.esm-3fdda599.js';
49
49
  import ArticleSeriesListing from './ArticleSeriesListing.js';
50
- import { g as getSerializers } from './index-236123b3.js';
50
+ import { g as getSerializers } from './index-3a7dc9ac.js';
51
51
  import './util-7700fc59.js';
52
52
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
53
53
  import 'next/head';
@@ -42,7 +42,7 @@ import './GroupDeck.js';
42
42
  import 'react-bootstrap';
43
43
  import './iconBase-602d52fe.js';
44
44
  import './index.esm-3fdda599.js';
45
- import { g as getSerializers } from './index-236123b3.js';
45
+ import { g as getSerializers } from './index-3a7dc9ac.js';
46
46
  import './util-7700fc59.js';
47
47
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
48
48
  import 'next/head';
@@ -44,7 +44,7 @@ import 'react-bootstrap';
44
44
  import './iconBase-602d52fe.js';
45
45
  import { I as IoIosArrowForward } from './index.esm-3fdda599.js';
46
46
  import ArticleCarousel from './ArticleCarousel.js';
47
- import { g as getSerializers } from './index-236123b3.js';
47
+ import { g as getSerializers } from './index-3a7dc9ac.js';
48
48
  import './util-7700fc59.js';
49
49
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
50
50
  import 'next/head';
@@ -52,7 +52,7 @@ import './timeDifferenceCalc.js';
52
52
  import QueueDeckExpanded from './QueueDeckExpanded.js';
53
53
  import './iconBase-602d52fe.js';
54
54
  import './index.esm-3fdda599.js';
55
- import { g as getSerializers } from './index-236123b3.js';
55
+ import { g as getSerializers } from './index-3a7dc9ac.js';
56
56
  import './util-7700fc59.js';
57
57
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
58
58
  import 'next/head';
@@ -42,7 +42,7 @@ import './GroupDeck.js';
42
42
  import 'react-bootstrap';
43
43
  import './iconBase-602d52fe.js';
44
44
  import './index.esm-3fdda599.js';
45
- import { g as getSerializers } from './index-236123b3.js';
45
+ import { g as getSerializers } from './index-3a7dc9ac.js';
46
46
  import './util-7700fc59.js';
47
47
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
48
48
  import Head from 'next/head';
@@ -47,7 +47,7 @@ import 'react-bootstrap';
47
47
  import './iconBase-602d52fe.js';
48
48
  import './index.esm-3fdda599.js';
49
49
  import VideoSeriesListing from './VideoSeriesListing.js';
50
- import { g as getSerializers } from './index-236123b3.js';
50
+ import { g as getSerializers } from './index-3a7dc9ac.js';
51
51
  import './util-7700fc59.js';
52
52
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
53
53
  import 'next/head';
package/dist/esm/View.js CHANGED
@@ -44,7 +44,7 @@ import './GroupDeck.js';
44
44
  import 'react-bootstrap';
45
45
  import './iconBase-602d52fe.js';
46
46
  import './index.esm-3fdda599.js';
47
- import { r as renderAuthor, g as getSerializers } from './index-236123b3.js';
47
+ import { r as renderAuthor, g as getSerializers } from './index-3a7dc9ac.js';
48
48
  import './util-7700fc59.js';
49
49
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
50
50
  import Head from 'next/head';
@@ -42,7 +42,7 @@ import './GroupDeck.js';
42
42
  import 'react-bootstrap';
43
43
  import './iconBase-602d52fe.js';
44
44
  import './index.esm-3fdda599.js';
45
- export { g as default } from './index-236123b3.js';
45
+ export { g as default } from './index-3a7dc9ac.js';
46
46
  import './util-7700fc59.js';
47
47
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
48
48
  import 'next/head';
@@ -9213,30 +9213,59 @@ var AnchorLinkElement = function AnchorLinkElement(props) {
9213
9213
  };
9214
9214
 
9215
9215
  var BlockTable = function BlockTable(props) {
9216
- var rows = props.node.rows,
9216
+ var _props$node = props.node,
9217
+ rows = _props$node.rows,
9218
+ _props$node$showBorde = _props$node.showBorders,
9219
+ showBorders = _props$node$showBorde === undefined ? true : _props$node$showBorde,
9220
+ borderColor = _props$node.borderColor,
9221
+ _props$node$borderWid = _props$node.borderWidth,
9222
+ borderWidth = _props$node$borderWid === undefined ? 1 : _props$node$borderWid,
9223
+ _props$node$minTableW = _props$node.minTableWidth,
9224
+ minTableWidth = _props$node$minTableW === undefined ? 500 : _props$node$minTableW,
9217
9225
  getSerializers = props.getSerializers,
9218
9226
  client = props.client;
9219
9227
 
9228
+ var _borderColor = borderColor ? borderColor.hex : '#000000';
9229
+ var holder = useRef();
9230
+ useEffect(function () {
9231
+ var handleResize = function handleResize() {
9232
+ var holderWidth = holder.current.offsetWidth;
9233
+ if (holderWidth < minTableWidth) {
9234
+ holder.current.style.overflow = 'scroll';
9235
+ } else {
9236
+ holder.current.style.overflow = 'hidden';
9237
+ }
9238
+ };
9239
+ handleResize();
9240
+ window.addEventListener('resize', handleResize);
9241
+ return function () {
9242
+ return window.removeEventListener('resize', handleResize);
9243
+ };
9244
+ }, []);
9220
9245
  return React.createElement(
9221
9246
  'div',
9222
- { className: 'blockTable' },
9223
- rows && rows.map(function (row) {
9224
- return React.createElement(
9225
- 'div',
9226
- { className: 'blockTableRow' },
9227
- row.cells && row.cells.map(function (cell) {
9228
- return React.createElement(
9229
- 'div',
9230
- { className: 'blockTableCell', style: { width: 1 / row.cells.length * 100 + '%' } },
9231
- React.createElement(BlockContent, _extends({ blocks: cell.content, serializers: getSerializers }, client.config()))
9232
- );
9233
- })
9234
- );
9235
- }),
9247
+ { className: 'blockTableHolder', ref: holder },
9248
+ React.createElement(
9249
+ 'div',
9250
+ { className: 'blockTable' },
9251
+ rows && rows.map(function (row) {
9252
+ return React.createElement(
9253
+ 'div',
9254
+ { className: 'blockTableRow' },
9255
+ row.cells && row.cells.map(function (cell) {
9256
+ return React.createElement(
9257
+ 'div',
9258
+ { className: 'blockTableCell', style: { width: (100 / row.cells.length).toFixed(2) + '%' } },
9259
+ React.createElement(BlockContent, _extends({ blocks: cell.content, serializers: getSerializers }, client.config()))
9260
+ );
9261
+ })
9262
+ );
9263
+ })
9264
+ ),
9236
9265
  React.createElement(
9237
9266
  'style',
9238
9267
  { jsx: true },
9239
- '\n .blockTableRow {\n display: flex;\n border-top: 1px solid;\n }\n .blockTableRow:last-of-type {\n border-bottom: 1px solid;\n }\n .blockTableCell {\n padding: 0.25rem;\n border-left: 1px solid;\n }\n .blockTableCell:last-of-type {\n border-right: 1px solid;\n }\n .blockTableCell:last-child {\n color: red;\n }\n '
9268
+ '\n .blockTableRow {\n display: flex;\n ' + (showBorders && 'border-top: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTable {\n min-width: ' + minTableWidth + 'px;\n }\n .blockTableRow:last-of-type {\n ' + (showBorders && 'border-bottom: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTableCell {\n padding: 0.5rem;\n ' + (showBorders && 'border-left: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n .blockTableCell > div {\n width: 100%;\n }\n .blockTableCell > div p {\n margin: 0;\n }\n .blockTableCell > div figure {\n width: 100%;\n margin: 0;\n }\n .blockTableCell > div figure img {\n width: 100%;\n object-fit: contain;\n margin: 0;\n }\n .blockTableCell:last-of-type {\n ' + (showBorders && 'border-right: ' + borderWidth + 'px solid ' + _borderColor) + ';\n }\n @media only screen and (max-width: 800px) {\n .blockTableCell {\n padding: 0.25rem;\n }\n }\n '
9240
9269
  )
9241
9270
  );
9242
9271
  };
package/dist/esm/index.js CHANGED
@@ -68,7 +68,7 @@ import './index.esm-3fdda599.js';
68
68
  export { default as VideoSeriesListing } from './VideoSeriesListing.js';
69
69
  export { default as ArticleSeriesListing } from './ArticleSeriesListing.js';
70
70
  export { default as ArticleCarousel } from './ArticleCarousel.js';
71
- export { g as getSerializers } from './index-236123b3.js';
71
+ export { g as getSerializers } from './index-3a7dc9ac.js';
72
72
  import './util-7700fc59.js';
73
73
  import './brightcove-react-player-loader.es-e1c6b0f2.js';
74
74
  import 'next/head';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mjhls/mjh-framework",
3
- "version": "1.0.776-block-table",
3
+ "version": "1.0.776-block-table-1",
4
4
  "description": "Foundation Framework",
5
5
  "author": "mjh-framework",
6
6
  "license": "MIT",