@pie-element/passage 1.6.4-ps.4 → 1.6.6

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.6.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage@1.6.5...@pie-element/passage@1.6.6) (2021-11-01)
+
+**Note:** Version bump only for package @pie-element/passage
+
+
+
+
+
+## [1.6.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage@1.6.4...@pie-element/passage@1.6.5) (2021-09-01)
+
+**Note:** Version bump only for package @pie-element/passage
+
+
+
+
+
 ## [1.6.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/passage@1.6.3...@pie-element/passage@1.6.4) (2021-08-05)
 
 **Note:** Version bump only for package @pie-element/passage

package/LICENSE.md

@@ -0,0 +1,5 @@
+Copyright 2019 CoreSpring Inc
+
+Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

package/lib/index.js

@@ -29,7 +29,7 @@ var _stimulusTabs = _interopRequireDefault(require("./stimulus-tabs"));
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var PiePassage = /*#__PURE__*/function (_HTMLElement) {
   (0, _inherits2["default"])(PiePassage, _HTMLElement);

package/lib/print.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactDom = _interopRequireDefault(require("react-dom"));
+
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+
+var _stimulusTabs = _interopRequireDefault(require("./stimulus-tabs"));
+
+var _debug = _interopRequireDefault(require("debug"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+var log = (0, _debug["default"])('pie-element:passage:print');
+
+var preparePrintPassage = function preparePrintPassage(model) {
+  return model.passages.map(function (passage, index) {
+    return {
+      id: index,
+      title: passage.title,
+      text: passage.text
+    };
+  });
+};
+
+var PassagePrint = /*#__PURE__*/function (_HTMLElement) {
+  (0, _inherits2["default"])(PassagePrint, _HTMLElement);
+
+  var _super = _createSuper(PassagePrint);
+
+  function PassagePrint() {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, PassagePrint);
+    _this = _super.call(this);
+    _this._model = null;
+    _this._session = [];
+    _this._rerender = (0, _debounce["default"])(function () {
+      if (_this._model && _this._session) {
+        if (_this._model.passages && _this._model.passages.length > 0) {
+          var printPassage = preparePrintPassage(_this._model);
+
+          var element = /*#__PURE__*/_react["default"].createElement(_stimulusTabs["default"], {
+            tabs: printPassage,
+            disabledTabs: true
+          });
+
+          _reactDom["default"].render(element, (0, _assertThisInitialized2["default"])(_this));
+        }
+      } else {
+        log('skip');
+      }
+    }, 50, {
+      leading: false,
+      trailing: true
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(PassagePrint, [{
+    key: "model",
+    set: function set(s) {
+      this._model = s;
+
+      this._rerender();
+    }
+  }, {
+    key: "connectedCallback",
+    value: function connectedCallback() {}
+  }]);
+  return PassagePrint;
+}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
+
+exports["default"] = PassagePrint;
+//# sourceMappingURL=print.js.map

package/lib/print.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/print.js"],"names":["log","preparePrintPassage","model","passages","map","passage","index","id","title","text","PassagePrint","_model","_session","_rerender","length","printPassage","element","React","createElement","StimulusTabs","tabs","disabledTabs","ReactDOM","render","leading","trailing","s","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,2BAAN,CAAZ;;AAEA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAAC,KAAK;AAAA,SAC/BA,KAAK,CAACC,QAAN,CAAeC,GAAf,CAAmB,UAACC,OAAD,EAAUC,KAAV,EAAoB;AACrC,WAAO;AACLC,MAAAA,EAAE,EAAED,KADC;AAELE,MAAAA,KAAK,EAAEH,OAAO,CAACG,KAFV;AAGLC,MAAAA,IAAI,EAAEJ,OAAO,CAACI;AAHT,KAAP;AAKD,GAND,CAD+B;AAAA,CAAjC;;IASqBC,Y;;;;;AACnB,0BAAc;AAAA;;AAAA;AACZ;AACA,UAAKC,MAAL,GAAc,IAAd;AACA,UAAKC,QAAL,GAAgB,EAAhB;AAEA,UAAKC,SAAL,GAAiB,0BACf,YAAM;AACJ,UAAI,MAAKF,MAAL,IAAe,MAAKC,QAAxB,EAAkC;AAChC,YAAI,MAAKD,MAAL,CAAYR,QAAZ,IAAwB,MAAKQ,MAAL,CAAYR,QAAZ,CAAqBW,MAArB,GAA8B,CAA1D,EAA6D;AAC3D,cAAMC,YAAY,GAAGd,mBAAmB,CAAC,MAAKU,MAAN,CAAxC;;AAEA,cAAMK,OAAO,gBAAGC,kBAAMC,aAAN,CAAoBC,wBAApB,EAAkC;AAAEC,YAAAA,IAAI,EAAEL,YAAR;AAAsBM,YAAAA,YAAY,EAAE;AAApC,WAAlC,CAAhB;;AAEAC,+BAASC,MAAT,CAAgBP,OAAhB;AACD;AACF,OARD,MAQO;AACLhB,QAAAA,GAAG,CAAC,MAAD,CAAH;AACD;AACF,KAbc,EAcf,EAde,EAef;AAAEwB,MAAAA,OAAO,EAAE,KAAX;AAAkBC,MAAAA,QAAQ,EAAE;AAA5B,KAfe,CAAjB;AALY;AAsBb;;;;SAED,aAAUC,CAAV,EAAa;AACX,WAAKf,MAAL,GAAce,CAAd;;AACA,WAAKb,SAAL;AACD;;;WAED,6BAAoB,CAAE;;;kDA9BkBc,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport debounce from 'lodash/debounce';\nimport StimulusTabs from './stimulus-tabs';\nimport debug from 'debug';\n\nconst log = debug('pie-element:passage:print');\n\nconst preparePrintPassage = model =>\n  model.passages.map((passage, index) => {\n    return {\n      id: index,\n      title: passage.title,\n      text: passage.text,\n    };\n  });\n\nexport default class PassagePrint extends HTMLElement {\n  constructor() {\n    super();\n    this._model = null;\n    this._session = [];\n\n    this._rerender = debounce(\n      () => {\n        if (this._model && this._session) {\n          if (this._model.passages && this._model.passages.length > 0) {\n            const printPassage = preparePrintPassage(this._model);\n\n            const element = React.createElement(StimulusTabs, { tabs: printPassage, disabledTabs: true });\n\n            ReactDOM.render(element, this);\n          }\n        } else {\n          log('skip');\n        }\n      },\n      50,\n      { leading: false, trailing: true }\n    );\n  }\n\n  set model(s) {\n    this._model = s;\n    this._rerender();\n  }\n\n  connectedCallback() {}\n}\n"],"file":"print.js"}

package/lib/stimulus-tabs.js

@@ -35,32 +35,36 @@ var _Typography = _interopRequireDefault(require("@material-ui/core/Typography")
 
 var _renderUi = require("@pie-lib/render-ui");
 
-var _previewLayout = _interopRequireDefault(require("@pie-lib/render-ui/lib/preview-layout"));
+var _classnames = _interopRequireDefault(require("classnames"));
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var styles = function styles() {
-  return (
-    /*theme*/
-    {
-      root: {
-        flexGrow: 1,
-        backgroundColor: _renderUi.color.background(),
-        color: _renderUi.color.text()
-      },
-      tab: {
-        fontSize: '0.8125em'
-      },
-      stickyTabs: {
-        background: _renderUi.color.background(),
-        paddingBottom: '20px',
-        position: 'sticky',
-        top: 0
-      }
+  return {
+    root: {
+      flexGrow: 1,
+      backgroundColor: _renderUi.color.background(),
+      color: _renderUi.color.text()
+    },
+    tab: {
+      fontSize: '0.8125em'
+    },
+    stickyTabs: {
+      background: _renderUi.color.background(),
+      paddingBottom: '20px',
+      position: 'sticky',
+      top: 0
+    },
+    title: {
+      textTransform: 'uppercase',
+      padding: '6px 24px',
+      borderBottom: "2px solid ".concat(_renderUi.color.secondary()),
+      width: 'fit-content',
+      marginBottom: '6px'
     }
-  );
+  };
 };
 
 function TabContainer(props) {
@@ -128,11 +132,34 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
 
       var _this$props = this.props,
           classes = _this$props.classes,
-          tabs = _this$props.tabs;
+          tabs = _this$props.tabs,
+          disabledTabs = _this$props.disabledTabs;
       var activeTab = this.state.activeTab;
 
       if (tabs && tabs.length > 1) {
-        return /*#__PURE__*/_react["default"].createElement("div", {
+        return disabledTabs ? /*#__PURE__*/_react["default"].createElement("div", {
+          className: "passages"
+        }, tabs.map(function (tab) {
+          return /*#__PURE__*/_react["default"].createElement("div", {
+            key: tab.id,
+            className: "passage-".concat(tab.id)
+          }, /*#__PURE__*/_react["default"].createElement(TabContainer, {
+            multiple: true
+          }, /*#__PURE__*/_react["default"].createElement("div", {
+            className: (0, _classnames["default"])(classes.title, 'title'),
+            dangerouslySetInnerHTML: {
+              __html: _this2.parsedText(tab.title)
+            }
+          }), /*#__PURE__*/_react["default"].createElement(_renderUi.Purpose, {
+            purpose: "passage-text"
+          }, /*#__PURE__*/_react["default"].createElement("div", {
+            className: "text",
+            key: tab.id,
+            dangerouslySetInnerHTML: {
+              __html: _this2.parsedText(tab.text)
+            }
+          }))));
+        })) : /*#__PURE__*/_react["default"].createElement("div", {
           className: classes.root
         }, /*#__PURE__*/_react["default"].createElement(_Tabs["default"], {
           classes: {
@@ -168,10 +195,12 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
         }));
       } else if (tabs && tabs[0]) {
         return /*#__PURE__*/_react["default"].createElement("div", {
+          className: "passage",
           style: {
             whiteSpace: 'break-spaces'
           }
         }, /*#__PURE__*/_react["default"].createElement(TabContainer, null, /*#__PURE__*/_react["default"].createElement("div", {
+          className: "text",
           dangerouslySetInnerHTML: {
             __html: this.parsedText(tabs[0].text)
           }
@@ -188,7 +217,8 @@ StimulusTabs.propTypes = {
     id: _propTypes["default"].number.isRequired,
     title: _propTypes["default"].string.isRequired,
     text: _propTypes["default"].string.isRequired
-  }).isRequired).isRequired
+  }).isRequired).isRequired,
+  disabledTabs: _propTypes["default"].bool
 };
 
 var _default = (0, _styles.withStyles)(styles)(StimulusTabs);

package/lib/stimulus-tabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/stimulus-tabs.jsx"],"names":["styles","root","flexGrow","backgroundColor","color","background","text","tab","fontSize","stickyTabs","paddingBottom","position","top","TabContainer","props","padding","multiple","children","propTypes","PropTypes","node","isRequired","bool","StimulusTabs","activeTab","event","setState","setTimeout","tabChangeEvent","CustomEvent","detail","window","dispatchEvent","replace","classes","tabs","state","length","handleChange","map","id","__html","parsedText","title","whiteSpace","React","Component","object","arrayOf","shape","number","string"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,MAAM,GAAG,SAATA,MAAS;AAAA;AAAC;AAAe;AAC7BC,MAAAA,IAAI,EAAE;AACJC,QAAAA,QAAQ,EAAE,CADN;AAEJC,QAAAA,eAAe,EAAEC,gBAAMC,UAAN,EAFb;AAGJD,QAAAA,KAAK,EAAEA,gBAAME,IAAN;AAHH,OADuB;AAM7BC,MAAAA,GAAG,EAAE;AACHC,QAAAA,QAAQ,EAAE;AADP,OANwB;AAS7BC,MAAAA,UAAU,EAAE;AACVJ,QAAAA,UAAU,EAAED,gBAAMC,UAAN,EADF;AAEVK,QAAAA,aAAa,EAAE,MAFL;AAGVC,QAAAA,QAAQ,EAAE,QAHA;AAIVC,QAAAA,GAAG,EAAE;AAJK;AATiB;AAAhB;AAAA,CAAf;;AAiBA,SAASC,YAAT,CAAsBC,KAAtB,EAA6B;AAC3B,MAAMC,OAAO,GAAGD,KAAK,CAACE,QAAN,GAAiB,kBAAjB,GAAsC,MAAtD;AAEA,sBACE,gCAAC,sBAAD;AACE,IAAA,SAAS,EAAC,KADZ;AAEE,IAAA,KAAK,EAAE;AACLD,MAAAA,OAAO,EAAPA,OADK;AAELP,MAAAA,QAAQ,EAAE,SAFL;AAGLL,MAAAA,eAAe,EAAEC,gBAAMC,UAAN,EAHZ;AAILD,MAAAA,KAAK,EAAEA,gBAAME,IAAN;AAJF;AAFT,KASGQ,KAAK,CAACG,QATT,CADF;AAaD;;AAEDJ,YAAY,CAACK,SAAb,GAAyB;AACvBD,EAAAA,QAAQ,EAAEE,sBAAUC,IAAV,CAAeC,UADF;AAEvBL,EAAAA,QAAQ,EAAEG,sBAAUG;AAFG,CAAzB;;IAKMC,Y;;;;;;;;;;;;;;;8FACI;AACNC,MAAAA,SAAS,EAAE;AADL,K;qGAIO,UAACC,KAAD,EAAQD,SAAR,EAAsB;AACnC,YAAKE,QAAL,CAAc;AAAA,eAAO;AAAEF,UAAAA,SAAS,EAATA;AAAF,SAAP;AAAA,OAAd;;AACAG,MAAAA,UAAU,CAAC,YAAM;AACf,YAAMC,cAAc,GAAG,IAAIC,WAAJ,CAAgB,2BAAhB,EAA6C;AAClEC,UAAAA,MAAM,EAAE;AACNvB,YAAAA,GAAG,EAAEiB;AADC;AAD0D,SAA7C,CAAvB;AAMAO,QAAAA,MAAM,CAACC,aAAP,CAAqBJ,cAArB;AACD,OARS,CAAV;AASD,K;mGAEY,UAACtB,IAAD;AAAA,aAAUA,IAAI,CAAC2B,OAAL,CAAa,aAAb,EAA4B,OAA5B,CAAV;AAAA,K;;;;;;WAEb,kBAAS;AAAA;;AAAA,wBACmB,KAAKnB,KADxB;AAAA,UACCoB,OADD,eACCA,OADD;AAAA,UACUC,IADV,eACUA,IADV;AAAA,UAECX,SAFD,GAEe,KAAKY,KAFpB,CAECZ,SAFD;;AAIP,UAAIW,IAAI,IAAIA,IAAI,CAACE,MAAL,GAAc,CAA1B,EAA6B;AAC3B,4BACE;AAAK,UAAA,SAAS,EAAEH,OAAO,CAACjC;AAAxB,wBACE,gCAAC,gBAAD;AACE,UAAA,OAAO,EAAE;AACPA,YAAAA,IAAI,EAAEiC,OAAO,CAACzB;AADP,WADX;AAIE,UAAA,KAAK,EAAEe,SAJT;AAKE,UAAA,QAAQ,EAAE,KAAKc;AALjB,WAOGH,IAAI,CAACI,GAAL,CAAS,UAAChC,GAAD;AAAA,8BACR,gCAAC,eAAD;AACE,YAAA,SAAS,EAAE2B,OAAO,CAAC3B,GADrB;AAEE,YAAA,GAAG,EAAEA,GAAG,CAACiC,EAFX;AAGE,YAAA,KAAK,eACH,gCAAC,iBAAD;AAAS,cAAA,OAAO,EAAC;AAAjB,4BACE;AACE,cAAA,uBAAuB,EAAE;AAAEC,gBAAAA,MAAM,EAAE,MAAI,CAACC,UAAL,CAAgBnC,GAAG,CAACoC,KAApB;AAAV;AAD3B,cADF,CAJJ;AAUE,YAAA,KAAK,EAAEpC,GAAG,CAACiC;AAVb,YADQ;AAAA,SAAT,CAPH,CADF,EAuBGL,IAAI,CAACI,GAAL,CAAS,UAAChC,GAAD;AAAA,iBACRiB,SAAS,KAAKjB,GAAG,CAACiC,EAAlB,gBACE,gCAAC,YAAD;AAAc,YAAA,QAAQ,MAAtB;AAAuB,YAAA,GAAG,EAAEjC,GAAG,CAACiC;AAAhC,0BACE,gCAAC,iBAAD;AAAS,YAAA,OAAO,EAAC;AAAjB,0BACE;AACE,YAAA,GAAG,EAAEjC,GAAG,CAACiC,EADX;AAEE,YAAA,uBAAuB,EAAE;AAAEC,cAAAA,MAAM,EAAE,MAAI,CAACC,UAAL,CAAgBnC,GAAG,CAACD,IAApB;AAAV;AAF3B,YADF,CADF,CADF,GAUI,IAXI;AAAA,SAAT,CAvBH,CADF;AAwCD,OAzCD,MAyCO,IAAI6B,IAAI,IAAIA,IAAI,CAAC,CAAD,CAAhB,EAAqB;AAC1B,4BACE;AAAK,UAAA,KAAK,EAAE;AAAES,YAAAA,UAAU,EAAE;AAAd;AAAZ,wBACE,gCAAC,YAAD,qBACE;AAAK,UAAA,uBAAuB,EAAE;AAAEH,YAAAA,MAAM,EAAE,KAAKC,UAAL,CAAgBP,IAAI,CAAC,CAAD,CAAJ,CAAQ7B,IAAxB;AAAV;AAA9B,UADF,CADF,CADF;AAOD;AACF;;;EA1EwBuC,kBAAMC,S;;AA6EjCvB,YAAY,CAACL,SAAb,GAAyB;AACvBgB,EAAAA,OAAO,EAAEf,sBAAU4B,MAAV,CAAiB1B,UADH;AAEvBc,EAAAA,IAAI,EAAEhB,sBAAU6B,OAAV,CACJ7B,sBAAU8B,KAAV,CAAgB;AACdT,IAAAA,EAAE,EAAErB,sBAAU+B,MAAV,CAAiB7B,UADP;AAEdsB,IAAAA,KAAK,EAAExB,sBAAUgC,MAAV,CAAiB9B,UAFV;AAGdf,IAAAA,IAAI,EAAEa,sBAAUgC,MAAV,CAAiB9B;AAHT,GAAhB,EAIGA,UALC,EAMJA;AARqB,CAAzB;;eAWe,wBAAWrB,MAAX,EAAmBuB,YAAnB,C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Tabs from '@material-ui/core/Tabs';\nimport Tab from '@material-ui/core/Tab';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { color, Purpose } from '@pie-lib/render-ui';\nimport previewLayout from '@pie-lib/render-ui/lib/preview-layout';\n\nconst styles = (/*theme*/) => ({\n  root: {\n    flexGrow: 1,\n    backgroundColor: color.background(),\n    color: color.text(),\n  },\n  tab: {\n    fontSize: '0.8125em',\n  },\n  stickyTabs: {\n    background: color.background(),\n    paddingBottom: '20px',\n    position: 'sticky',\n    top: 0,\n  }\n});\n\nfunction TabContainer(props) {\n  const padding = props.multiple ? '0 24px 24px 24px' : '24px';\n\n  return (\n    <Typography\n      component=\"div\"\n      style={{\n        padding,\n        fontSize: '0.875em',\n        backgroundColor: color.background(),\n        color: color.text(),\n      }}\n    >\n      {props.children}\n    </Typography>\n  );\n}\n\nTabContainer.propTypes = {\n  children: PropTypes.node.isRequired,\n  multiple: PropTypes.bool,\n};\n\nclass StimulusTabs extends React.Component {\n  state = {\n    activeTab: 0,\n  };\n\n  handleChange = (event, activeTab) => {\n    this.setState(() => ({ activeTab }));\n    setTimeout(() => {\n      const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {\n        detail: {\n          tab: activeTab,\n        },\n      });\n\n      window.dispatchEvent(tabChangeEvent);\n    });\n  };\n\n  parsedText = (text) => text.replace(/(<br\\/>\\n)/g, '<br/>');\n\n  render() {\n    const { classes, tabs } = this.props;\n    const { activeTab } = this.state;\n\n    if (tabs && tabs.length > 1) {\n      return (\n        <div className={classes.root}>\n          <Tabs\n            classes={{\n              root: classes.stickyTabs,\n            }}\n            value={activeTab}\n            onChange={this.handleChange}\n          >\n            {tabs.map((tab) => (\n              <Tab\n                className={classes.tab}\n                key={tab.id}\n                label={\n                  <Purpose purpose=\"passage-title\">\n                    <span\n                      dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }}\n                    ></span>\n                  </Purpose>\n                }\n                value={tab.id}\n              />\n            ))}\n          </Tabs>\n          {tabs.map((tab) =>\n            activeTab === tab.id ? (\n              <TabContainer multiple key={tab.id}>\n                <Purpose purpose=\"passage-text\">\n                  <div\n                    key={tab.id}\n                    dangerouslySetInnerHTML={{ __html: this.parsedText(tab.text) }}\n                  />\n                </Purpose>\n              </TabContainer>\n\n            ) : null\n          )}\n        </div>\n      );\n\n    } else if (tabs && tabs[0]) {\n      return (\n        <div style={{ whiteSpace: 'break-spaces' }} >\n          <TabContainer>\n            <div dangerouslySetInnerHTML={{ __html: this.parsedText(tabs[0].text) }} />\n          </TabContainer>\n        </div>\n      );\n    }\n  }\n}\n\nStimulusTabs.propTypes = {\n  classes: PropTypes.object.isRequired,\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number.isRequired,\n      title: PropTypes.string.isRequired,\n      text: PropTypes.string.isRequired,\n    }).isRequired\n  ).isRequired,\n};\n\nexport default withStyles(styles)(StimulusTabs);\n"],"file":"stimulus-tabs.js"}
+{"version":3,"sources":["../src/stimulus-tabs.jsx"],"names":["styles","root","flexGrow","backgroundColor","color","background","text","tab","fontSize","stickyTabs","paddingBottom","position","top","title","textTransform","padding","borderBottom","secondary","width","marginBottom","TabContainer","props","multiple","children","propTypes","PropTypes","node","isRequired","bool","StimulusTabs","activeTab","event","setState","setTimeout","tabChangeEvent","CustomEvent","detail","window","dispatchEvent","replace","classes","tabs","disabledTabs","state","length","map","id","__html","parsedText","handleChange","whiteSpace","React","Component","object","arrayOf","shape","number","string"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Tabs from '@material-ui/core/Tabs';\nimport Tab from '@material-ui/core/Tab';\nimport { withStyles } from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { color, Purpose } from '@pie-lib/render-ui';\nimport classNames from 'classnames';\n\nconst styles = (/*theme*/) => ({\n  root: {\n    flexGrow: 1,\n    backgroundColor: color.background(),\n    color: color.text(),\n  },\n  tab: {\n    fontSize: '0.8125em',\n  },\n  stickyTabs: {\n    background: color.background(),\n    paddingBottom: '20px',\n    position: 'sticky',\n    top: 0,\n  },\n  title: {\n    textTransform: 'uppercase',\n    padding: '6px 24px',\n    borderBottom: `2px solid ${color.secondary()}`,\n    width: 'fit-content',\n    marginBottom: '6px'\n  }\n});\n\nfunction TabContainer(props) {\n  const padding = props.multiple ? '0 24px 24px 24px' : '24px';\n\n  return (\n    <Typography\n      component=\"div\"\n      style={{\n        padding,\n        fontSize: '0.875em',\n        backgroundColor: color.background(),\n        color: color.text(),\n      }}\n    >\n      {props.children}\n    </Typography>\n  );\n}\n\nTabContainer.propTypes = {\n  children: PropTypes.node.isRequired,\n  multiple: PropTypes.bool,\n};\n\nclass StimulusTabs extends React.Component {\n  state = {\n    activeTab: 0,\n  };\n\n  handleChange = (event, activeTab) => {\n    this.setState(() => ({ activeTab }));\n    setTimeout(() => {\n      const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {\n        detail: {\n          tab: activeTab,\n        },\n      });\n\n      window.dispatchEvent(tabChangeEvent);\n    });\n  };\n\n  parsedText = (text) => text.replace(/(<br\\/>\\n)/g, '<br/>');\n\n  render() {\n    const { classes, tabs, disabledTabs } = this.props;\n    const { activeTab } = this.state;\n\n    if (tabs && tabs.length > 1) {\n      return disabledTabs ? (\n        <div className=\"passages\">\n          {tabs.map(tab =>\n            <div key={tab.id} className={`passage-${tab.id}`}>\n              <TabContainer multiple >\n                <div\n                  className={classNames(classes.title, 'title')}\n                  dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }}\n                />\n                <Purpose purpose=\"passage-text\">\n                  <div\n                    className=\"text\"\n                    key={tab.id}\n                    dangerouslySetInnerHTML={{ __html: this.parsedText(tab.text) }}\n                  />\n                </Purpose>\n              </TabContainer>\n            </div>)}\n        </div>\n      ) : (\n        <div className={classes.root}>\n          <Tabs\n            classes={{\n              root: classes.stickyTabs,\n            }}\n            value={activeTab}\n            onChange={this.handleChange}\n          >\n            {tabs.map((tab) => (\n              <Tab\n                className={classes.tab}\n                key={tab.id}\n                label={\n                  <Purpose purpose=\"passage-title\">\n                    <span\n                      dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }}\n                    />\n                  </Purpose>\n                }\n                value={tab.id}\n              />\n            ))}\n          </Tabs>\n          {tabs.map((tab) =>\n            activeTab === tab.id ? (\n              <TabContainer multiple key={tab.id}>\n                <Purpose purpose=\"passage-text\">\n                  <div\n                    key={tab.id}\n                    dangerouslySetInnerHTML={{ __html: this.parsedText(tab.text) }}\n                  />\n                </Purpose>\n              </TabContainer>\n\n            ) : null\n          )}\n        </div>\n      );\n\n    } else if (tabs && tabs[0]) {\n      return (\n        <div className=\"passage\" style={{ whiteSpace: 'break-spaces' }} >\n          <TabContainer>\n            <div className=\"text\" dangerouslySetInnerHTML={{ __html: this.parsedText(tabs[0].text) }} />\n          </TabContainer>\n        </div>\n      );\n    }\n  }\n}\n\nStimulusTabs.propTypes = {\n  classes: PropTypes.object.isRequired,\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number.isRequired,\n      title: PropTypes.string.isRequired,\n      text: PropTypes.string.isRequired,\n    }).isRequired\n  ).isRequired,\n  disabledTabs: PropTypes.bool\n};\n\nexport default withStyles(styles)(StimulusTabs);\n"],"file":"stimulus-tabs.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-element/passage",
-  "version": "1.6.4-ps.4",
+  "version": "1.6.6",
   "publishConfig": {
     "access": "public"
   },
@@ -12,12 +12,12 @@
     "@material-ui/core": "^3.9.2",
     "@pie-framework/pie-player-events": "^0.1.0",
     "@pie-lib/render-ui": "^4.12.0",
+    "classnames": "^2.2.5",
     "prop-types": "^15.6.1",
     "react": "^16.8.1",
-    "react-dom": "^16.8.1",
-    "classnames": "^2.2.5"
+    "react-dom": "^16.8.1"
   },
-  "gitHead": "0e14ff981bcdc8a89a0e58484026496701bfdbc3",
+  "gitHead": "39691eb79f1f5ece91c831add33b05871b20828b",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },

package/module/demo.js

@@ -1,63 +0,0 @@
-import Element from './element.js';
-
-var generate = {};
-
-generate.model = (id, element) => ({
-  id,
-  element,
-  passages: [
-    {
-      title: 'Hope Is the Thing with Feathers',
-      text: '<p><font style="visibility:hidden">00000</font>Hope is the thing with feathers<br /><font style="visibility:hidden">00000</font>That perches in the soul,<br /><font style="visibility:hidden">00000</font>And sings the tune without the words,<br /><font style="visibility:hidden">00000</font>And never stops at all,</p><p>5<font style="visibility:hidden">0000</font>And sweetest in the gale is heard;<br /><font style="visibility:hidden">00000</font>And sore must be the storm<br /><font style="visibility:hidden">00000</font>That could abash the little bird<br /><font style="visibility:hidden">00000</font>That kept so many warm.</p><p><font style="visibility:hidden">00000</font>I&#8217;ve heard it in the chillest land,<br />10<font style="visibility:hidden">000</font>And on the strangest sea;<br /><font style="visibility:hidden">00000</font>Yet, never, in extremity,<br /><font style="visibility:hidden">00000</font>It asked a crumb of me.</p><p><span class="no-number">&#34;Hope is the Thing With Feathers&#34; by Emily Dickinson, from <em>The Complete Poems of Emily Dickinson</em>. In the public domain.</span></p>'
-    },
-    {
-      title: 'Ineskeen Road, July Evening',
-      text: `The bicycles go by in twos and threes -<br/> 
-      There's a dance in Billy Brennan's barn tonight,<br/>
-      And there's the half-talk code of mysteries<br/>
-      And the wink-and-elbow language of delight.<br/>
-      Half-past eight and there is not a spot<br/>
-      Upon a mile of road, no shadow thrown<br/>
-      That might turn out a man or woman, not<br/>
-      A footfall tapping secrecies of stone. <br/>
-      <p/>
-      I have what every poet hates in spite<br/>
-      Of all the solemn talk of contemplation.<br/>
-      Oh, Alexander Selkirk knew the plight<br/>
-      Of being king and government and nation.<br/>
-      A road, a mile of kingdom. I am king<br/>
-      Of banks and stones and every blooming thing.<br/>
-      `
-    }
-  ]
-});
-
-const { model } = generate;
-
-var config = {
-  elements: {
-    'passage-element': '../..'
-  },
-  models: [model('1', 'passage-element')]
-};
-
-// configure 
-      class Configure extends HTMLElement{}
-
-
-      // controller 
-      const controller = {
-        model: (q) => Promise.resolve(q),
-        outcome: (q) => Promise.resolve(q)
-      };
-
-      
-  //Note: demo-el is a custom element loaded in the markup.
-  customElements.whenDefined("demo-el").then(() => {
-    config.models.forEach((m) => {
-      const de = document.createElement("demo-el");
-      document.body.appendChild(de);
-      de.def = { tagName: m.element, Element, Configure, controller };
-      de.model = m;
-    });
-  });

package/module/element.js

@@ -1,325 +0,0 @@
-import {_dll_react, _dll_prop_types, _dll_material_ui__core, _dll_material_ui__core_styles, _dll_pie_lib__render_ui, _dll_classnames, _dll_react_dom} from "../../../@pie-lib/shared-module@^1.2.9/module/index.js";
-var lib = {};
-Object.defineProperty(lib, "__esModule", {
-  value: true
-});
-class ModelSetEvent extends CustomEvent {
-  constructor(component, complete, hasModel) {
-    super(ModelSetEvent.TYPE, {
-      bubbles: true,
-      composed: true,
-      detail: {
-        complete,
-        component,
-        hasModel
-      }
-    });
-    this.component = component;
-    this.complete = complete;
-  }
-}
-ModelSetEvent.TYPE = 'model-set';
-var ModelSetEvent_1 = lib.ModelSetEvent = ModelSetEvent;
-class SessionChangedEvent extends CustomEvent {
-  constructor(component, complete) {
-    super(SessionChangedEvent.TYPE, {
-      bubbles: true,
-      composed: true,
-      detail: {
-        complete,
-        component
-      }
-    });
-    this.component = component;
-    this.complete = complete;
-  }
-}
-SessionChangedEvent.TYPE = 'session-changed';
-lib.SessionChangedEvent = SessionChangedEvent;
-const React$1 = _dll_react;
-const PropTypes = _dll_prop_types;
-const {Tabs: Tabs} = _dll_material_ui__core;
-const {Tab: Tab} = _dll_material_ui__core;
-const {Typography: Typography} = _dll_material_ui__core;
-const {withStyles: withStyles} = _dll_material_ui__core_styles;
-const {color: color} = _dll_pie_lib__render_ui;
-const {Purpose: Purpose} = _dll_pie_lib__render_ui;
-const classNames = _dll_classnames;
-const _jsxFileName = "/home/ede/dev/github/pie-framework/pie-elements/packages/passage/src/stimulus-tabs.jsx";
-const styles = () => ({
-  root: {
-    flexGrow: 1,
-    backgroundColor: color.background(),
-    color: color.text()
-  },
-  tab: {
-    fontSize: '0.8125em'
-  },
-  stickyTabs: {
-    background: color.background(),
-    paddingBottom: '20px',
-    position: 'sticky',
-    top: 0
-  },
-  title: {
-    textTransform: 'uppercase',
-    padding: '6px 24px',
-    borderBottom: `2px solid ${color.secondary()}`,
-    width: 'fit-content',
-    marginBottom: '6px'
-  }
-});
-function TabContainer(props) {
-  const padding = props.multiple ? '0 24px 24px 24px' : '24px';
-  return React$1.createElement(Typography, {
-    component: "div",
-    style: {
-      padding,
-      fontSize: '0.875em',
-      backgroundColor: color.background(),
-      color: color.text()
-    },
-    __self: this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 38
-    }
-  }, props.children);
-}
-TabContainer.propTypes = {
-  children: PropTypes.node.isRequired,
-  multiple: PropTypes.bool
-};
-class StimulusTabs extends React$1.Component {
-  constructor(...args) {
-    super(...args);
-    StimulusTabs.prototype.__init.call(this);
-    StimulusTabs.prototype.__init2.call(this);
-    StimulusTabs.prototype.__init3.call(this);
-  }
-  __init() {
-    this.state = {
-      activeTab: 0
-    };
-  }
-  __init2() {
-    this.handleChange = (event, activeTab) => {
-      this.setState(() => ({
-        activeTab
-      }));
-      setTimeout(() => {
-        const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {
-          detail: {
-            tab: activeTab
-          }
-        });
-        window.dispatchEvent(tabChangeEvent);
-      });
-    };
-  }
-  __init3() {
-    this.parsedText = text => text.replace(/(<br\/>\n)/g, '<br/>');
-  }
-  render() {
-    const {classes, tabs, disabledTabs} = this.props;
-    const {activeTab} = this.state;
-    if (tabs && tabs.length > 1) {
-      return disabledTabs ? React$1.createElement('div', {
-        className: "passages",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 83
-        }
-      }, tabs.map(tab => React$1.createElement('div', {
-        key: tab.id,
-        className: `passage-${tab.id}`,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 85
-        }
-      }, React$1.createElement(TabContainer, {
-        multiple: true,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 86
-        }
-      }, React$1.createElement('div', {
-        className: classNames(classes.title, 'title'),
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.title)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 87
-        }
-      }), React$1.createElement(Purpose, {
-        purpose: "passage-text",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 91
-        }
-      }, React$1.createElement('div', {
-        className: "text",
-        key: tab.id,
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 92
-        }
-      })))))) : React$1.createElement('div', {
-        className: classes.root,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 102
-        }
-      }, React$1.createElement(Tabs, {
-        classes: {
-          root: classes.stickyTabs
-        },
-        value: activeTab,
-        onChange: this.handleChange,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 103
-        }
-      }, tabs.map(tab => React$1.createElement(Tab, {
-        className: classes.tab,
-        key: tab.id,
-        label: React$1.createElement(Purpose, {
-          purpose: "passage-title",
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 115
-          }
-        }, React$1.createElement('span', {
-          dangerouslySetInnerHTML: {
-            __html: this.parsedText(tab.title)
-          },
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 116
-          }
-        })),
-        value: tab.id,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 111
-        }
-      }))), tabs.map(tab => activeTab === tab.id ? React$1.createElement(TabContainer, {
-        multiple: true,
-        key: tab.id,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 127
-        }
-      }, React$1.createElement(Purpose, {
-        purpose: "passage-text",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 128
-        }
-      }, React$1.createElement('div', {
-        key: tab.id,
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 129
-        }
-      }))) : null));
-    } else if (tabs && tabs[0]) {
-      return React$1.createElement('div', {
-        className: "passage",
-        style: {
-          whiteSpace: 'break-spaces'
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 143
-        }
-      }, React$1.createElement(TabContainer, {
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 144
-        }
-      }, React$1.createElement('div', {
-        className: "text",
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tabs[0].text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 145
-        }
-      })));
-    }
-  }
-}
-StimulusTabs.propTypes = {
-  classes: PropTypes.object.isRequired,
-  tabs: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.number.isRequired,
-    title: PropTypes.string.isRequired,
-    text: PropTypes.string.isRequired
-  }).isRequired).isRequired,
-  disabledTabs: PropTypes.bool
-};
-var StimulusTabs$1 = withStyles(styles)(StimulusTabs);
-const React = _dll_react;
-const ReactDOM = _dll_react_dom;
-class PiePassage extends HTMLElement {
-  constructor() {
-    super();
-    this._model = {
-      passages: []
-    };
-    this._session = null;
-  }
-  set model(s) {
-    this._model = s;
-    this.dispatchEvent(new ModelSetEvent_1(this.tagName.toLowerCase(), this._session, !!this._model));
-    this._render();
-  }
-  set session(s) {
-    this._session = s;
-  }
-  connectedCallback() {
-    this._render();
-  }
-  _render() {
-    if (this._model.passages.length > 0) {
-      const passagesTabs = this._model.passages.map((passage, index) => {
-        return {
-          id: index,
-          title: passage.title,
-          text: passage.text
-        };
-      });
-      let elem = React.createElement(StimulusTabs$1, {
-        tabs: passagesTabs
-      });
-      ReactDOM.render(elem, this);
-    }
-  }
-}
-export {PiePassage as default};

package/module/index.html

@@ -1,21 +0,0 @@
-
-  <!doctype html>
-  <html>
-    <head>
-      <title>@pie-element/passage@1.6.4</title>
-      <script
-        type="module"
-        src="https://cdn.jsdelivr.net/npm/@pslb/demo-el@^1.0.0/dist/demo-el/demo-el.esm.js"></script>
-     
-      <link
-        href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
-        rel="stylesheet"
-      />
-      <style>
-        html, body {
-          font-family: 'Roboto', sans-serif;
-        }
-      </style>
-      <script type="module" src="./demo.js"></script> 
-    </head>
-  </html>

package/module/manifest.json

@@ -1,10 +0,0 @@
-{
-  "name": "@pie-element/passage",
-  "version": "1.6.4",
-  "modules": [
-    {
-      "name": "@pie-lib/shared-module",
-      "version": "^1.2.9"
-    }
-  ]
-}

package/module/print-demo.js

@@ -1,92 +0,0 @@
-import PrintElement from './print.js';
-
-var generate = {};
-
-generate.model = (id, element) => ({
-  id,
-  element,
-  passages: [
-    {
-      title: 'Hope Is the Thing with Feathers',
-      text: '<p><font style="visibility:hidden">00000</font>Hope is the thing with feathers<br /><font style="visibility:hidden">00000</font>That perches in the soul,<br /><font style="visibility:hidden">00000</font>And sings the tune without the words,<br /><font style="visibility:hidden">00000</font>And never stops at all,</p><p>5<font style="visibility:hidden">0000</font>And sweetest in the gale is heard;<br /><font style="visibility:hidden">00000</font>And sore must be the storm<br /><font style="visibility:hidden">00000</font>That could abash the little bird<br /><font style="visibility:hidden">00000</font>That kept so many warm.</p><p><font style="visibility:hidden">00000</font>I&#8217;ve heard it in the chillest land,<br />10<font style="visibility:hidden">000</font>And on the strangest sea;<br /><font style="visibility:hidden">00000</font>Yet, never, in extremity,<br /><font style="visibility:hidden">00000</font>It asked a crumb of me.</p><p><span class="no-number">&#34;Hope is the Thing With Feathers&#34; by Emily Dickinson, from <em>The Complete Poems of Emily Dickinson</em>. In the public domain.</span></p>'
-    },
-    {
-      title: 'Ineskeen Road, July Evening',
-      text: `The bicycles go by in twos and threes -<br/> 
-      There's a dance in Billy Brennan's barn tonight,<br/>
-      And there's the half-talk code of mysteries<br/>
-      And the wink-and-elbow language of delight.<br/>
-      Half-past eight and there is not a spot<br/>
-      Upon a mile of road, no shadow thrown<br/>
-      That might turn out a man or woman, not<br/>
-      A footfall tapping secrecies of stone. <br/>
-      <p/>
-      I have what every poet hates in spite<br/>
-      Of all the solemn talk of contemplation.<br/>
-      Oh, Alexander Selkirk knew the plight<br/>
-      Of being king and government and nation.<br/>
-      A road, a mile of kingdom. I am king<br/>
-      Of banks and stones and every blooming thing.<br/>
-      `
-    }
-  ]
-});
-
-const { model } = generate;
-
-var config = {
-  elements: {
-    'passage-element': '../..'
-  },
-  models: [model('1', 'passage-element')]
-};
-
-// new init - just shows off print!
-
-const init = async () => {
-  console.log('define the element...');
-  await Promise.all(
-    config.models.map(async (m) => {
-      try {
-        const printTag = `${m.element}-print`;
-        if (customElements.get(printTag)) {
-          return true;
-        } else {
-          customElements.define(printTag, PrintElement);
-          await customElements.whenDefined(printTag);
-          return true;
-        }
-      } catch (e) {
-        return false;
-      }
-    })
-  );
-
-  console.log('now apply the model...');
-  config.models.forEach((m) => {
-    const printTag = `${m.element}-print`;
-    const h3s = document.createElement('h3');
-    h3s.textContent = 'student mode';
-    document.body.appendChild(h3s);
-    const de = document.createElement(printTag);
-    document.body.appendChild(de);
-    de.options = {};
-    de.model = m;
-
-    const h3 = document.createElement('h3');
-    h3.textContent = 'instructor mode';
-    document.body.appendChild(h3);
-    const instr = document.createElement(printTag);
-    document.body.appendChild(instr);
-    instr.options = { mode: 'instructor' };
-    instr.model = JSON.parse(JSON.stringify(m));
-  });
-};
-
-init()
-  .then(() => {
-    console.log('ready');
-  })
-  .catch((e) => {
-    console.error(e);
-  });

package/module/print.html

@@ -1,18 +0,0 @@
-
-  <!doctype html>
-  <html>
-    <head>
-      <title>@pie-element/passage@1.6.4</title>
-      <link
-        href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
-        rel="stylesheet"
-      />
-      <style>
-        html, body {
-          font-family: 'Roboto', sans-serif;
-        }
-      </style>
-      <script type="module" src="./print-demo.js"></script> 
-    </head>
-    <body></body>
-  </html>

package/module/print.js

@@ -1,292 +0,0 @@
-import {_dll_react, _dll_prop_types, _dll_material_ui__core, _dll_material_ui__core_styles, _dll_pie_lib__render_ui, _dll_classnames, _dll_react_dom, _dll_lodash, _dll_debug} from "../../../@pie-lib/shared-module@^1.2.9/module/index.js";
-const React$1 = _dll_react;
-const PropTypes = _dll_prop_types;
-const {Tabs: Tabs} = _dll_material_ui__core;
-const {Tab: Tab} = _dll_material_ui__core;
-const {Typography: Typography} = _dll_material_ui__core;
-const {withStyles: withStyles} = _dll_material_ui__core_styles;
-const {color: color} = _dll_pie_lib__render_ui;
-const {Purpose: Purpose} = _dll_pie_lib__render_ui;
-const classNames = _dll_classnames;
-const _jsxFileName = "/home/ede/dev/github/pie-framework/pie-elements/packages/passage/src/stimulus-tabs.jsx";
-const styles = () => ({
-  root: {
-    flexGrow: 1,
-    backgroundColor: color.background(),
-    color: color.text()
-  },
-  tab: {
-    fontSize: '0.8125em'
-  },
-  stickyTabs: {
-    background: color.background(),
-    paddingBottom: '20px',
-    position: 'sticky',
-    top: 0
-  },
-  title: {
-    textTransform: 'uppercase',
-    padding: '6px 24px',
-    borderBottom: `2px solid ${color.secondary()}`,
-    width: 'fit-content',
-    marginBottom: '6px'
-  }
-});
-function TabContainer(props) {
-  const padding = props.multiple ? '0 24px 24px 24px' : '24px';
-  return React$1.createElement(Typography, {
-    component: "div",
-    style: {
-      padding,
-      fontSize: '0.875em',
-      backgroundColor: color.background(),
-      color: color.text()
-    },
-    __self: this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 38
-    }
-  }, props.children);
-}
-TabContainer.propTypes = {
-  children: PropTypes.node.isRequired,
-  multiple: PropTypes.bool
-};
-class StimulusTabs extends React$1.Component {
-  constructor(...args) {
-    super(...args);
-    StimulusTabs.prototype.__init.call(this);
-    StimulusTabs.prototype.__init2.call(this);
-    StimulusTabs.prototype.__init3.call(this);
-  }
-  __init() {
-    this.state = {
-      activeTab: 0
-    };
-  }
-  __init2() {
-    this.handleChange = (event, activeTab) => {
-      this.setState(() => ({
-        activeTab
-      }));
-      setTimeout(() => {
-        const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {
-          detail: {
-            tab: activeTab
-          }
-        });
-        window.dispatchEvent(tabChangeEvent);
-      });
-    };
-  }
-  __init3() {
-    this.parsedText = text => text.replace(/(<br\/>\n)/g, '<br/>');
-  }
-  render() {
-    const {classes, tabs, disabledTabs} = this.props;
-    const {activeTab} = this.state;
-    if (tabs && tabs.length > 1) {
-      return disabledTabs ? React$1.createElement('div', {
-        className: "passages",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 83
-        }
-      }, tabs.map(tab => React$1.createElement('div', {
-        key: tab.id,
-        className: `passage-${tab.id}`,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 85
-        }
-      }, React$1.createElement(TabContainer, {
-        multiple: true,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 86
-        }
-      }, React$1.createElement('div', {
-        className: classNames(classes.title, 'title'),
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.title)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 87
-        }
-      }), React$1.createElement(Purpose, {
-        purpose: "passage-text",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 91
-        }
-      }, React$1.createElement('div', {
-        className: "text",
-        key: tab.id,
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 92
-        }
-      })))))) : React$1.createElement('div', {
-        className: classes.root,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 102
-        }
-      }, React$1.createElement(Tabs, {
-        classes: {
-          root: classes.stickyTabs
-        },
-        value: activeTab,
-        onChange: this.handleChange,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 103
-        }
-      }, tabs.map(tab => React$1.createElement(Tab, {
-        className: classes.tab,
-        key: tab.id,
-        label: React$1.createElement(Purpose, {
-          purpose: "passage-title",
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 115
-          }
-        }, React$1.createElement('span', {
-          dangerouslySetInnerHTML: {
-            __html: this.parsedText(tab.title)
-          },
-          __self: this,
-          __source: {
-            fileName: _jsxFileName,
-            lineNumber: 116
-          }
-        })),
-        value: tab.id,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 111
-        }
-      }))), tabs.map(tab => activeTab === tab.id ? React$1.createElement(TabContainer, {
-        multiple: true,
-        key: tab.id,
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 127
-        }
-      }, React$1.createElement(Purpose, {
-        purpose: "passage-text",
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 128
-        }
-      }, React$1.createElement('div', {
-        key: tab.id,
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 129
-        }
-      }))) : null));
-    } else if (tabs && tabs[0]) {
-      return React$1.createElement('div', {
-        className: "passage",
-        style: {
-          whiteSpace: 'break-spaces'
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 143
-        }
-      }, React$1.createElement(TabContainer, {
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 144
-        }
-      }, React$1.createElement('div', {
-        className: "text",
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tabs[0].text)
-        },
-        __self: this,
-        __source: {
-          fileName: _jsxFileName,
-          lineNumber: 145
-        }
-      })));
-    }
-  }
-}
-StimulusTabs.propTypes = {
-  classes: PropTypes.object.isRequired,
-  tabs: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.number.isRequired,
-    title: PropTypes.string.isRequired,
-    text: PropTypes.string.isRequired
-  }).isRequired).isRequired,
-  disabledTabs: PropTypes.bool
-};
-var StimulusTabs$1 = withStyles(styles)(StimulusTabs);
-const React = _dll_react;
-const ReactDOM = _dll_react_dom;
-const {debounce: debounce} = _dll_lodash;
-const debug = _dll_debug;
-const log = debug('pie-element:passage:print');
-const preparePrintPassage = model => model.passages.map((passage, index) => {
-  return {
-    id: index,
-    title: passage.title,
-    text: passage.text
-  };
-});
-class PassagePrint extends HTMLElement {
-  constructor() {
-    super();
-    this._model = null;
-    this._session = [];
-    this._rerender = debounce(() => {
-      if (this._model && this._session) {
-        if (this._model.passages && this._model.passages.length > 0) {
-          const printPassage = preparePrintPassage(this._model);
-          const element = React.createElement(StimulusTabs$1, {
-            tabs: printPassage,
-            disabledTabs: true
-          });
-          ReactDOM.render(element, this);
-        }
-      } else {
-        log('skip');
-      }
-    }, 50, {
-      leading: false,
-      trailing: true
-    });
-  }
-  set model(s) {
-    this._model = s;
-    this._rerender();
-  }
-  connectedCallback() {}
-}
-export {PassagePrint as default};