cifkao commited on
Commit
bed1194
1 Parent(s): fe36eff

Fix style on dark theme, build Sass

Browse files
highlighted_text/build/asset-manifest.json CHANGED
@@ -1,17 +1,20 @@
1
  {
2
  "files": {
3
- "main.js": "./static/js/main.0c3ca5a6.chunk.js",
4
- "main.js.map": "./static/js/main.0c3ca5a6.chunk.js.map",
 
5
  "runtime-main.js": "./static/js/runtime-main.e6b0ae4c.js",
6
  "runtime-main.js.map": "./static/js/runtime-main.e6b0ae4c.js.map",
7
  "static/js/2.ce130e37.chunk.js": "./static/js/2.ce130e37.chunk.js",
8
  "static/js/2.ce130e37.chunk.js.map": "./static/js/2.ce130e37.chunk.js.map",
9
  "index.html": "./index.html",
 
10
  "static/js/2.ce130e37.chunk.js.LICENSE.txt": "./static/js/2.ce130e37.chunk.js.LICENSE.txt"
11
  },
12
  "entrypoints": [
13
  "static/js/runtime-main.e6b0ae4c.js",
14
  "static/js/2.ce130e37.chunk.js",
15
- "static/js/main.0c3ca5a6.chunk.js"
 
16
  ]
17
  }
 
1
  {
2
  "files": {
3
+ "main.css": "./static/css/main.b2f89d68.chunk.css",
4
+ "main.js": "./static/js/main.b8970cf8.chunk.js",
5
+ "main.js.map": "./static/js/main.b8970cf8.chunk.js.map",
6
  "runtime-main.js": "./static/js/runtime-main.e6b0ae4c.js",
7
  "runtime-main.js.map": "./static/js/runtime-main.e6b0ae4c.js.map",
8
  "static/js/2.ce130e37.chunk.js": "./static/js/2.ce130e37.chunk.js",
9
  "static/js/2.ce130e37.chunk.js.map": "./static/js/2.ce130e37.chunk.js.map",
10
  "index.html": "./index.html",
11
+ "static/css/main.b2f89d68.chunk.css.map": "./static/css/main.b2f89d68.chunk.css.map",
12
  "static/js/2.ce130e37.chunk.js.LICENSE.txt": "./static/js/2.ce130e37.chunk.js.LICENSE.txt"
13
  },
14
  "entrypoints": [
15
  "static/js/runtime-main.e6b0ae4c.js",
16
  "static/js/2.ce130e37.chunk.js",
17
+ "static/css/main.b2f89d68.chunk.css",
18
+ "static/js/main.b8970cf8.chunk.js"
19
  ]
20
  }
highlighted_text/build/index.css DELETED
@@ -1,50 +0,0 @@
1
- body {
2
- padding: 0;
3
- margin: 0;
4
- font-family: "Source Sans Pro", sans-serif;
5
- font-size: 1rem;
6
- line-height: 1.4;
7
- }
8
-
9
- .highlighted-text {
10
- border: 1px solid #d2d2d2;
11
- border-radius: 0 0 5px 5px;
12
- background-color: white;
13
- padding: 4px;
14
- cursor: pointer;
15
-
16
- .token.active {
17
- outline: 1px solid #444;
18
- }
19
-
20
- &.frozen {
21
- .token {
22
- opacity: 0.75;
23
-
24
- &.context, &.active {
25
- opacity: 1;
26
- }
27
-
28
- &.context {
29
- text-decoration: #999 underline;
30
- }
31
- }
32
- }
33
- }
34
-
35
- .status-bar {
36
- min-height: 1.4em;
37
- border: 1px solid #d2d2d2;
38
- border-bottom: none;
39
- border-radius: 5px 5px 0 0;
40
- padding: 3px 4px;
41
-
42
- .token {
43
- border: 1px solid #aaa;
44
- border-radius: 2px;
45
- background: #f5f5f5;
46
- padding: 1px;
47
- margin: 1px;
48
- margin-right: 2px;
49
- }
50
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
highlighted_text/build/index.html CHANGED
@@ -1 +1 @@
1
- <!doctype html><html lang="en"><head><title>Highlighted text component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="description" content="Highlighted text"/><link rel="stylesheet" href="index.css"/></head><body><div id="root"></div><script>!function(e){function t(t){for(var n,l,a=t[0],p=t[1],i=t[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in p)Object.prototype.hasOwnProperty.call(p,n)&&(e[n]=p[n]);for(f&&f(t);s.length;)s.shift()();return u.push.apply(u,i||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,a=1;a<r.length;a++){var p=r[a];0!==o[p]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="./";var a=this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[],p=a.push.bind(a);a.push=t,a=a.slice();for(var i=0;i<a.length;i++)t(a[i]);var f=p;r()}([])</script><script src="./static/js/2.ce130e37.chunk.js"></script><script src="./static/js/main.0c3ca5a6.chunk.js"></script></body></html>
 
1
+ <!doctype html><html lang="en"><head><title>Highlighted text component</title><meta charset="UTF-8"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="description" content="Highlighted text"/><link href="./static/css/main.b2f89d68.chunk.css" rel="stylesheet"></head><body><div id="root"></div><script>!function(e){function t(t){for(var n,l,a=t[0],p=t[1],i=t[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in p)Object.prototype.hasOwnProperty.call(p,n)&&(e[n]=p[n]);for(f&&f(t);s.length;)s.shift()();return u.push.apply(u,i||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,a=1;a<r.length;a++){var p=r[a];0!==o[p]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={1:0},u=[];function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="./";var a=this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[],p=a.push.bind(a);a.push=t,a=a.slice();for(var i=0;i<a.length;i++)t(a[i]);var f=p;r()}([])</script><script src="./static/js/2.ce130e37.chunk.js"></script><script src="./static/js/main.b8970cf8.chunk.js"></script></body></html>
highlighted_text/build/static/css/main.b2f89d68.chunk.css ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ body{padding:0;margin:0;font-family:"Source Sans Pro",sans-serif;font-size:1rem;line-height:1.4}.highlighted-text,.status-bar{color:#000;background-color:#fff}.highlighted-text{border:1px solid #d2d2d2;border-radius:0 0 5px 5px;padding:4px;cursor:pointer}.highlighted-text .token.active{outline:1px solid #444}.highlighted-text.frozen .token{opacity:.75}.highlighted-text.frozen .token.active,.highlighted-text.frozen .token.context{opacity:1}.highlighted-text.frozen .token.context{-webkit-text-decoration:#999 underline;text-decoration:#999 underline}.status-bar{min-height:1.4em;border:1px solid #d2d2d2;border-bottom:none;border-radius:5px 5px 0 0;padding:3px 4px}.status-bar .token{border:1px solid #aaa;border-radius:2px;background:#f5f5f5;padding:1px;margin:1px 2px 1px 1px}
2
+ /*# sourceMappingURL=main.b2f89d68.chunk.css.map */
highlighted_text/build/static/css/main.b2f89d68.chunk.css.map ADDED
@@ -0,0 +1 @@
 
 
1
+ {"version":3,"sources":["webpack://src/index.scss"],"names":[],"mappings":"AAAA,KACI,SAAA,CACA,QAAA,CACA,wCAAA,CACA,cAAA,CACA,eAAA,CAGJ,8BACI,UAAA,CACA,qBAAA,CAGJ,kBACI,wBAAA,CACA,yBAAA,CACA,WAAA,CACA,cAAA,CAEA,gCACI,sBAAA,CAIA,gCACI,WAAA,CAEA,+EACI,SAAA,CAGJ,wCACI,sCAAA,CAAA,8BAAA,CAMhB,YACI,gBAAA,CAEA,wBAAA,CAAA,kBAAA,CACA,yBAAA,CACA,eAAA,CAEA,mBACI,qBAAA,CACA,iBAAA,CACA,kBAAA,CACA,WAAA,CAEA,sBAAA","file":"main.b2f89d68.chunk.css","sourcesContent":["body {\n padding: 0;\n margin: 0;\n font-family: \"Source Sans Pro\", sans-serif;\n font-size: 1rem;\n line-height: 1.4;\n}\n\n.highlighted-text, .status-bar {\n color: black;\n background-color: white;\n}\n\n.highlighted-text {\n border: 1px solid #d2d2d2;\n border-radius: 0 0 5px 5px;\n padding: 4px;\n cursor: pointer;\n\n .token.active {\n outline: 1px solid #444;\n }\n\n &.frozen {\n .token {\n opacity: 0.75;\n\n &.context, &.active {\n opacity: 1;\n }\n\n &.context {\n text-decoration: #999 underline;\n }\n }\n }\n}\n\n.status-bar {\n min-height: 1.4em;\n border: 1px solid #d2d2d2;\n border-bottom: none;\n border-radius: 5px 5px 0 0;\n padding: 3px 4px;\n\n .token {\n border: 1px solid #aaa;\n border-radius: 2px;\n background: #f5f5f5;\n padding: 1px;\n margin: 1px;\n margin-right: 2px;\n }\n}\n"]}
highlighted_text/build/static/js/main.0c3ca5a6.chunk.js DELETED
@@ -1,2 +0,0 @@
1
- (this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[]).push([[0],{27:function(t,e,a){"use strict";a.r(e);var n=a(7),s=a.n(n),r=a(18),c=a.n(r),i=a(4),o=a(0),l=a(1),h=a(2),d=a(3),j=a(16),u=a(6),b=function(t){Object(h.a)(a,t);var e=Object(d.a)(a);function a(){var t;Object(o.a)(this,a);for(var n=arguments.length,s=new Array(n),r=0;r<n;r++)s[r]=arguments[r];return(t=e.call.apply(e,[this].concat(s))).state={activeIndex:null,hoverIndex:null,isFrozen:!1},t}return Object(l.a)(a,[{key:"render",value:function(){var t=this,e=this.props.args.tokens,a=this.getScores(),n="highlighted-text";this.state.isFrozen&&(n+=" frozen");var s=function(){t.setState({isFrozen:!1})};return Object(u.jsxs)(u.Fragment,{children:[Object(u.jsxs)("div",{className:"status-bar",children:[Object(u.jsxs)("span",{className:this.state.isFrozen?"":" d-none",children:[Object(u.jsx)("i",{className:"fa fa-lock"})," "]},"lock-icon"),null!=this.state.activeIndex?Object(u.jsxs)(u.Fragment,{children:[Object(u.jsx)("strong",{children:"index:"},"index-label")," ",Object(u.jsxs)("span",{children:[this.state.activeIndex," "]},"index")]}):Object(u.jsx)(u.Fragment,{})]},"status-bar"),Object(u.jsx)("div",{className:n,onClick:s,children:e.map((function(e,n){var r="token";t.state&&t.state.activeIndex==n&&(r+=" active");var c={backgroundColor:a[n]>0?"rgba(32, 255, 32, ".concat(a[n],")"):"rgba(255, 32, 32, ".concat(-a[n],")")};return Object(u.jsx)("span",{className:r,style:c,onMouseOver:function(){t.state.isFrozen||t.setState({activeIndex:n}),t.setState({hoverIndex:n})},onClick:s,children:e},n)}))},"text")]})}},{key:"getScores",value:function(){var t=this.props.args.tokens;if(!this.state||null==this.state.activeIndex||this.state.activeIndex<1)return t.map((function(){return 0}));var e=this.props.args.scores,a=this.state.activeIndex-1,n=Math.min(Math.max(0,a),e[a].length),s=e[a].slice(0,n);s.reverse();var r=[].concat(Object(i.a)(Array(Math.max(0,a-1-s.length)).fill(0)),Object(i.a)(s.map((function(t){return void 0==t||isNaN(t)?0:t}))));return r=[].concat(Object(i.a)(r),Object(i.a)(Array(t.length-r.length).fill(0)))}}]),a}(j.a),v=Object(j.b)(b);c.a.render(Object(u.jsx)(s.a.StrictMode,{children:Object(u.jsx)(v,{})}),document.getElementById("root"))}},[[27,1,2]]]);
2
- //# sourceMappingURL=main.0c3ca5a6.chunk.js.map
 
 
 
highlighted_text/build/static/js/main.b8970cf8.chunk.js ADDED
@@ -0,0 +1,2 @@
 
 
 
1
+ (this.webpackJsonpstreamlit_component_template=this.webpackJsonpstreamlit_component_template||[]).push([[0],{27:function(t,e,n){},28:function(t,e,n){"use strict";n.r(e);var a=n(7),s=n.n(a),c=n(18),r=n.n(c),i=n(4),o=n(0),l=n(1),h=n(2),d=n(3),j=n(16),u=n(6),b=function(t){Object(h.a)(n,t);var e=Object(d.a)(n);function n(){var t;Object(o.a)(this,n);for(var a=arguments.length,s=new Array(a),c=0;c<a;c++)s[c]=arguments[c];return(t=e.call.apply(e,[this].concat(s))).state={activeIndex:null,hoverIndex:null,isFrozen:!1},t}return Object(l.a)(n,[{key:"render",value:function(){var t=this,e=this.props.args.tokens,n=this.getScores(),a="highlighted-text";this.state.isFrozen&&(a+=" frozen");var s=function(){t.setState({isFrozen:!1})};return Object(u.jsxs)(u.Fragment,{children:[Object(u.jsxs)("div",{className:"status-bar",children:[Object(u.jsxs)("span",{className:this.state.isFrozen?"":" d-none",children:[Object(u.jsx)("i",{className:"fa fa-lock"})," "]},"lock-icon"),null!=this.state.activeIndex?Object(u.jsxs)(u.Fragment,{children:[Object(u.jsx)("strong",{children:"index:"},"index-label")," ",Object(u.jsxs)("span",{children:[this.state.activeIndex," "]},"index")]}):Object(u.jsx)(u.Fragment,{})]},"status-bar"),Object(u.jsx)("div",{className:a,onClick:s,children:e.map((function(e,a){var c="token";t.state&&t.state.activeIndex==a&&(c+=" active");var r={backgroundColor:n[a]>0?"rgba(32, 255, 32, ".concat(n[a],")"):"rgba(255, 32, 32, ".concat(-n[a],")")};return Object(u.jsx)("span",{className:c,style:r,onMouseOver:function(){t.state.isFrozen||t.setState({activeIndex:a}),t.setState({hoverIndex:a})},onClick:s,children:e},a)}))},"text")]})}},{key:"getScores",value:function(){var t=this.props.args.tokens;if(!this.state||null==this.state.activeIndex||this.state.activeIndex<1)return t.map((function(){return 0}));var e=this.props.args.scores,n=this.state.activeIndex-1,a=Math.min(Math.max(0,n),e[n].length),s=e[n].slice(0,a);s.reverse();var c=[].concat(Object(i.a)(Array(Math.max(0,n-1-s.length)).fill(0)),Object(i.a)(s.map((function(t){return void 0==t||isNaN(t)?0:t}))));return c=[].concat(Object(i.a)(c),Object(i.a)(Array(t.length-c.length).fill(0)))}}]),n}(j.a),v=Object(j.b)(b);n(27);r.a.render(Object(u.jsx)(s.a.StrictMode,{children:Object(u.jsx)(v,{})}),document.getElementById("root"))}},[[28,1,2]]]);
2
+ //# sourceMappingURL=main.b8970cf8.chunk.js.map
highlighted_text/build/static/js/{main.0c3ca5a6.chunk.js.map → main.b8970cf8.chunk.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"sources":["HighlightedText.tsx","index.tsx"],"names":["HighlightedText","_StreamlitComponentBa","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","state","activeIndex","hoverIndex","isFrozen","_createClass","key","value","_this2","tokens","this","props","scores","getScores","className","onClick","setState","_jsxs","_Fragment","children","_jsx","map","t","i","style","backgroundColor","onMouseOver","allScores","hi","Math","min","max","row","slice","reverse","result","_toConsumableArray","fill","x","undefined","isNaN","StreamlitComponentBase","withStreamlitConnection","ReactDOM","render","React","StrictMode","document","getElementById"],"mappings":"2OAeMA,EAAe,SAAAC,GAAAC,YAAAF,EAAAC,GAAA,IAAAE,EAAAC,YAAAJ,GAAA,SAAAA,IAAA,IAAAK,EAAAC,YAAA,KAAAN,GAAA,QAAAO,EAAAC,UAAAC,OAAAC,EAAA,IAAAC,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GACqD,OADrDP,EAAAF,EAAAU,KAAAC,MAAAX,EAAA,OAAAY,OAAAL,KACVM,MAAQ,CAACC,YAAa,KAAMC,WAAY,KAAMC,UAAU,GAAMd,CAAC,CAuErE,OAvEoEe,YAAApB,EAAA,EAAAqB,IAAA,SAAAC,MAErE,WAAU,IAADC,EAAA,KACCC,EAAmBC,KAAKC,MAAMhB,KAAa,OAC3CiB,EAAmBF,KAAKG,YAE1BC,EAAY,mBACZJ,KAAKT,MAAMG,WACXU,GAAa,WAGjB,IAAMC,EAAU,WACZP,EAAKQ,SAAS,CAAEZ,UAAU,GAC9B,EAEA,OAAOa,eAAAC,WAAA,CAAAC,SAAA,CACHF,eAAA,OAAKH,UAAU,aAAYK,SAAA,CACvBF,eAAA,QAAMH,UAAWJ,KAAKT,MAAMG,SAAW,GAAK,UAAUe,SAAA,CAAiBC,cAAA,KAAGN,UAAU,eAAiB,MAA1C,aAChC,MAA1BJ,KAAKT,MAAMC,YACZe,eAAAC,WAAA,CAAAC,SAAA,CACIC,cAAA,UAAAD,SAA0B,UAAd,eAA6B,IAACF,eAAA,QAAAE,SAAA,CAAmBT,KAAKT,MAAMC,YAAY,MAAhC,YAEtDkB,cAAAF,WAAA,MAN0B,cAQhCE,cAAA,OAAKN,UAAWA,EAAWC,QAASA,EAAQI,SAEpCV,EAAOY,KAAI,SAACC,EAAWC,GACnB,IAAIT,EAAY,QACZN,EAAKP,OACDO,EAAKP,MAAMC,aAAeqB,IAC1BT,GAAa,WAGrB,IAAMU,EAAQ,CACVC,gBACIb,EAAOW,GAAK,EAAC,qBAAAvB,OACcY,EAAOW,GAAE,0BAAAvB,QACRY,EAAOW,GAAE,MAS7C,OAAOH,cAAA,QAAcN,UAAWA,EAAWU,MAAOA,EAC9CE,YAPgB,WACXlB,EAAKP,MAAMG,UACZI,EAAKQ,SAAS,CAAEd,YAAaqB,IAEjCf,EAAKQ,SAAS,CAAEb,WAAYoB,GAChC,EAE8BR,QAASA,EAAQI,SAAEG,GAD/BC,EAEtB,KAxByC,UA4BzD,GAAC,CAAAjB,IAAA,YAAAC,MAED,WACI,IAAME,EAASC,KAAKC,MAAMhB,KAAa,OACvC,IAAKe,KAAKT,OAAmC,MAA1BS,KAAKT,MAAMC,aAAuBQ,KAAKT,MAAMC,YAAc,EAC1E,OAAOO,EAAOY,KAAI,kBAAM,CAAC,IAE7B,IAAMM,EAAwBjB,KAAKC,MAAMhB,KAAa,OAEhD4B,EAAIb,KAAKT,MAAMC,YAAc,EAC7B0B,EAAKC,KAAKC,IAAID,KAAKE,IAAI,EAAGR,GAAII,EAAUJ,GAAG7B,QAC3CsC,EAAML,EAAUJ,GAAGU,MAAM,EAAGL,GAClCI,EAAIE,UACJ,IAAIC,EAAM,GAAAnC,OAAAoC,YACHxC,MAAMiC,KAAKE,IAAI,EAAGR,EAAI,EAAIS,EAAItC,SAAS2C,KAAK,IAAED,YAC9CJ,EAAIX,KAAI,SAACiB,GAAC,YAAUC,GAALD,GAAkBE,MAAMF,GAAK,EAAIA,CAAC,MAGxD,OADAH,EAAM,GAAAnC,OAAAoC,YAAOD,GAAMC,YAAKxC,MAAMa,EAAOf,OAASyC,EAAOzC,QAAQ2C,KAAK,IAEtE,KAACpD,CAAA,CAxEgB,CAASwD,KA2EfC,cAAwBzD,GCtFvC0D,IAASC,OACPxB,cAACyB,IAAMC,WAAU,CAAA3B,SACfC,cAACnC,EAAe,MAElB8D,SAASC,eAAe,Q","file":"static/js/main.0c3ca5a6.chunk.js","sourcesContent":["import {\n StreamlitComponentBase,\n withStreamlitConnection,\n} from \"streamlit-component-lib\";\n\ntype HighlightedTextState = {\n activeIndex: number | null,\n hoverIndex: number | null,\n isFrozen: boolean\n};\n\n/**\n * This is a React-based component template. The `render()` function is called\n * automatically when your component should be re-rendered.\n */\nclass HighlightedText extends StreamlitComponentBase<HighlightedTextState> {\n public state = {activeIndex: null, hoverIndex: null, isFrozen: false};\n\n render() {\n const tokens: string[] = this.props.args[\"tokens\"];\n const scores: number[] = this.getScores();\n\n let className = \"highlighted-text\";\n if (this.state.isFrozen) {\n className += \" frozen\";\n }\n\n const onClick = () => {\n this.setState({ isFrozen: false });\n };\n\n return <>\n <div className=\"status-bar\" key=\"status-bar\">\n <span className={this.state.isFrozen ? \"\" : \" d-none\"} key=\"lock-icon\"><i className=\"fa fa-lock\"></i> </span>\n {this.state.activeIndex != null ?\n <>\n <strong key=\"index-label\">index:</strong> <span key=\"index\">{this.state.activeIndex} </span>\n </>\n : <></>}\n </div>\n <div className={className} onClick={onClick} key=\"text\">\n {\n tokens.map((t: string, i: number) => {\n let className = \"token\";\n if (this.state) {\n if (this.state.activeIndex == i) {\n className += \" active\";\n }\n }\n const style = {\n backgroundColor:\n scores[i] > 0\n ? `rgba(32, 255, 32, ${scores[i]})`\n : `rgba(255, 32, 32, ${-scores[i]})`\n };\n\n const onMouseOver = () => {\n if (!this.state.isFrozen) {\n this.setState({ activeIndex: i });\n }\n this.setState({ hoverIndex: i });\n };\n return <span key={i} className={className} style={style}\n onMouseOver={onMouseOver} onClick={onClick}>{t}</span>;\n })\n }\n </div>\n </>;\n }\n\n private getScores() {\n const tokens = this.props.args[\"tokens\"];\n if (!this.state || this.state.activeIndex == null || this.state.activeIndex < 1) {\n return tokens.map(() => 0);\n }\n const allScores: number[][] = this.props.args[\"scores\"];\n\n const i = this.state.activeIndex - 1;\n const hi = Math.min(Math.max(0, i), allScores[i].length);\n const row = allScores[i].slice(0, hi);\n row.reverse();\n let result = [\n ...Array(Math.max(0, i - 1 - row.length)).fill(0), \n ...row.map((x) => x == undefined || isNaN(x) ? 0 : x)\n ];\n result = [...result, ...Array(tokens.length - result.length).fill(0)];\n return result;\n }\n}\n\nexport default withStreamlitConnection(HighlightedText);\n","import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport HighlightedText from \"./HighlightedText\";\n\nReactDOM.render(\n <React.StrictMode>\n <HighlightedText />\n </React.StrictMode>,\n document.getElementById(\"root\")\n)\n"],"sourceRoot":""}
 
1
+ {"version":3,"sources":["HighlightedText.tsx","index.tsx"],"names":["HighlightedText","_StreamlitComponentBa","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","state","activeIndex","hoverIndex","isFrozen","_createClass","key","value","_this2","tokens","this","props","scores","getScores","className","onClick","setState","_jsxs","_Fragment","children","_jsx","map","t","i","style","backgroundColor","onMouseOver","allScores","hi","Math","min","max","row","slice","reverse","result","_toConsumableArray","fill","x","undefined","isNaN","StreamlitComponentBase","withStreamlitConnection","ReactDOM","render","React","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.b8970cf8.chunk.js","sourcesContent":["import {\n StreamlitComponentBase,\n withStreamlitConnection,\n} from \"streamlit-component-lib\";\n\ntype HighlightedTextState = {\n activeIndex: number | null,\n hoverIndex: number | null,\n isFrozen: boolean\n};\n\n/**\n * This is a React-based component template. The `render()` function is called\n * automatically when your component should be re-rendered.\n */\nclass HighlightedText extends StreamlitComponentBase<HighlightedTextState> {\n public state = {activeIndex: null, hoverIndex: null, isFrozen: false};\n\n render() {\n const tokens: string[] = this.props.args[\"tokens\"];\n const scores: number[] = this.getScores();\n\n let className = \"highlighted-text\";\n if (this.state.isFrozen) {\n className += \" frozen\";\n }\n\n const onClick = () => {\n this.setState({ isFrozen: false });\n };\n\n return <>\n <div className=\"status-bar\" key=\"status-bar\">\n <span className={this.state.isFrozen ? \"\" : \" d-none\"} key=\"lock-icon\"><i className=\"fa fa-lock\"></i> </span>\n {\n this.state.activeIndex != null ?\n <>\n <strong key=\"index-label\">index:</strong> <span key=\"index\">{this.state.activeIndex} </span>\n </>\n : <></>\n }\n </div>\n <div className={className} onClick={onClick} key=\"text\">\n {\n tokens.map((t: string, i: number) => {\n let className = \"token\";\n if (this.state) {\n if (this.state.activeIndex == i) {\n className += \" active\";\n }\n }\n const style = {\n backgroundColor:\n scores[i] > 0\n ? `rgba(32, 255, 32, ${scores[i]})`\n : `rgba(255, 32, 32, ${-scores[i]})`\n };\n\n const onMouseOver = () => {\n if (!this.state.isFrozen) {\n this.setState({ activeIndex: i });\n }\n this.setState({ hoverIndex: i });\n };\n return <span key={i} className={className} style={style}\n onMouseOver={onMouseOver} onClick={onClick}>{t}</span>;\n })\n }\n </div>\n </>;\n }\n\n private getScores() {\n const tokens = this.props.args[\"tokens\"];\n if (!this.state || this.state.activeIndex == null || this.state.activeIndex < 1) {\n return tokens.map(() => 0);\n }\n const allScores: number[][] = this.props.args[\"scores\"];\n\n const i = this.state.activeIndex - 1;\n const hi = Math.min(Math.max(0, i), allScores[i].length);\n const row = allScores[i].slice(0, hi);\n row.reverse();\n let result = [\n ...Array(Math.max(0, i - 1 - row.length)).fill(0), \n ...row.map((x) => x == undefined || isNaN(x) ? 0 : x)\n ];\n result = [...result, ...Array(tokens.length - result.length).fill(0)];\n return result;\n }\n}\n\nexport default withStreamlitConnection(HighlightedText);\n","import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport HighlightedText from \"./HighlightedText\";\nimport \"./index.scss\";\n\nReactDOM.render(\n <React.StrictMode>\n <HighlightedText />\n </React.StrictMode>,\n document.getElementById(\"root\")\n)\n"],"sourceRoot":""}
highlighted_text/package-lock.json CHANGED
@@ -10,6 +10,7 @@
10
  "dependencies": {
11
  "react": "^16.13.1",
12
  "react-dom": "^16.13.1",
 
13
  "streamlit-component-lib": "^1.3.0"
14
  },
15
  "devDependencies": {
@@ -4237,7 +4238,6 @@
4237
  "version": "3.1.3",
4238
  "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
4239
  "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
4240
- "dev": true,
4241
  "dependencies": {
4242
  "normalize-path": "^3.0.0",
4243
  "picomatch": "^2.0.4"
@@ -5180,8 +5180,6 @@
5180
  "version": "2.2.0",
5181
  "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
5182
  "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
5183
- "dev": true,
5184
- "optional": true,
5185
  "engines": {
5186
  "node": ">=8"
5187
  }
@@ -5307,7 +5305,6 @@
5307
  "version": "3.0.2",
5308
  "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
5309
  "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
5310
- "dev": true,
5311
  "dependencies": {
5312
  "fill-range": "^7.0.1"
5313
  },
@@ -5754,14 +5751,12 @@
5754
  "version": "3.5.3",
5755
  "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
5756
  "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
5757
- "dev": true,
5758
  "funding": [
5759
  {
5760
  "type": "individual",
5761
  "url": "https://paulmillr.com/funding/"
5762
  }
5763
  ],
5764
- "optional": true,
5765
  "dependencies": {
5766
  "anymatch": "~3.1.2",
5767
  "braces": "~3.0.2",
@@ -9313,7 +9308,6 @@
9313
  "version": "7.0.1",
9314
  "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
9315
  "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
9316
- "dev": true,
9317
  "dependencies": {
9318
  "to-regex-range": "^5.0.1"
9319
  },
@@ -9733,7 +9727,6 @@
9733
  "version": "2.3.2",
9734
  "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
9735
  "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
9736
- "dev": true,
9737
  "hasInstallScript": true,
9738
  "optional": true,
9739
  "os": [
@@ -9894,7 +9887,6 @@
9894
  "version": "5.1.2",
9895
  "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
9896
  "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
9897
- "dev": true,
9898
  "dependencies": {
9899
  "is-glob": "^4.0.1"
9900
  },
@@ -10711,6 +10703,11 @@
10711
  "url": "https://opencollective.com/immer"
10712
  }
10713
  },
 
 
 
 
 
10714
  "node_modules/import-cwd": {
10715
  "version": "2.1.0",
10716
  "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
@@ -10976,8 +10973,6 @@
10976
  "version": "2.1.0",
10977
  "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
10978
  "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
10979
- "dev": true,
10980
- "optional": true,
10981
  "dependencies": {
10982
  "binary-extensions": "^2.0.0"
10983
  },
@@ -11138,7 +11133,6 @@
11138
  "version": "2.1.1",
11139
  "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
11140
  "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
11141
- "dev": true,
11142
  "engines": {
11143
  "node": ">=0.10.0"
11144
  }
@@ -11165,7 +11159,6 @@
11165
  "version": "4.0.3",
11166
  "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
11167
  "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
11168
- "dev": true,
11169
  "dependencies": {
11170
  "is-extglob": "^2.1.1"
11171
  },
@@ -11204,7 +11197,6 @@
11204
  "version": "7.0.0",
11205
  "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
11206
  "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
11207
- "dev": true,
11208
  "engines": {
11209
  "node": ">=0.12.0"
11210
  }
@@ -14535,7 +14527,6 @@
14535
  "version": "3.0.0",
14536
  "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
14537
  "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
14538
- "dev": true,
14539
  "engines": {
14540
  "node": ">=0.10.0"
14541
  }
@@ -15270,7 +15261,6 @@
15270
  "version": "2.3.1",
15271
  "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
15272
  "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
15273
- "dev": true,
15274
  "engines": {
15275
  "node": ">=8.6"
15276
  },
@@ -17578,8 +17568,6 @@
17578
  "version": "3.6.0",
17579
  "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
17580
  "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
17581
- "dev": true,
17582
- "optional": true,
17583
  "dependencies": {
17584
  "picomatch": "^2.2.1"
17585
  },
@@ -18566,6 +18554,22 @@
18566
  "integrity": "sha512-vTxrZz4dX5W86M6oVWVdOVe72ZiPs41Oi7Z6Km4W5Turyz28mrXSJhhEBZoRtzJWIv3833WKVwLSDWWkEfupMg==",
18567
  "dev": true
18568
  },
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
18569
  "node_modules/sass-loader": {
18570
  "version": "10.4.1",
18571
  "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.4.1.tgz",
@@ -19308,7 +19312,6 @@
19308
  "version": "1.0.2",
19309
  "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
19310
  "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
19311
- "dev": true,
19312
  "engines": {
19313
  "node": ">=0.10.0"
19314
  }
@@ -20564,7 +20567,6 @@
20564
  "version": "5.0.1",
20565
  "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
20566
  "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
20567
- "dev": true,
20568
  "dependencies": {
20569
  "is-number": "^7.0.0"
20570
  },
 
10
  "dependencies": {
11
  "react": "^16.13.1",
12
  "react-dom": "^16.13.1",
13
+ "sass": "^1.62.1",
14
  "streamlit-component-lib": "^1.3.0"
15
  },
16
  "devDependencies": {
 
4238
  "version": "3.1.3",
4239
  "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
4240
  "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
 
4241
  "dependencies": {
4242
  "normalize-path": "^3.0.0",
4243
  "picomatch": "^2.0.4"
 
5180
  "version": "2.2.0",
5181
  "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
5182
  "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
 
 
5183
  "engines": {
5184
  "node": ">=8"
5185
  }
 
5305
  "version": "3.0.2",
5306
  "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
5307
  "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
 
5308
  "dependencies": {
5309
  "fill-range": "^7.0.1"
5310
  },
 
5751
  "version": "3.5.3",
5752
  "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
5753
  "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
 
5754
  "funding": [
5755
  {
5756
  "type": "individual",
5757
  "url": "https://paulmillr.com/funding/"
5758
  }
5759
  ],
 
5760
  "dependencies": {
5761
  "anymatch": "~3.1.2",
5762
  "braces": "~3.0.2",
 
9308
  "version": "7.0.1",
9309
  "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
9310
  "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
 
9311
  "dependencies": {
9312
  "to-regex-range": "^5.0.1"
9313
  },
 
9727
  "version": "2.3.2",
9728
  "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
9729
  "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
 
9730
  "hasInstallScript": true,
9731
  "optional": true,
9732
  "os": [
 
9887
  "version": "5.1.2",
9888
  "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
9889
  "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
 
9890
  "dependencies": {
9891
  "is-glob": "^4.0.1"
9892
  },
 
10703
  "url": "https://opencollective.com/immer"
10704
  }
10705
  },
10706
+ "node_modules/immutable": {
10707
+ "version": "4.3.0",
10708
+ "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.0.tgz",
10709
+ "integrity": "sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg=="
10710
+ },
10711
  "node_modules/import-cwd": {
10712
  "version": "2.1.0",
10713
  "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
 
10973
  "version": "2.1.0",
10974
  "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
10975
  "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
 
 
10976
  "dependencies": {
10977
  "binary-extensions": "^2.0.0"
10978
  },
 
11133
  "version": "2.1.1",
11134
  "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
11135
  "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
 
11136
  "engines": {
11137
  "node": ">=0.10.0"
11138
  }
 
11159
  "version": "4.0.3",
11160
  "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
11161
  "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
 
11162
  "dependencies": {
11163
  "is-extglob": "^2.1.1"
11164
  },
 
11197
  "version": "7.0.0",
11198
  "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
11199
  "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
 
11200
  "engines": {
11201
  "node": ">=0.12.0"
11202
  }
 
14527
  "version": "3.0.0",
14528
  "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
14529
  "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
 
14530
  "engines": {
14531
  "node": ">=0.10.0"
14532
  }
 
15261
  "version": "2.3.1",
15262
  "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
15263
  "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
 
15264
  "engines": {
15265
  "node": ">=8.6"
15266
  },
 
17568
  "version": "3.6.0",
17569
  "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
17570
  "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
 
 
17571
  "dependencies": {
17572
  "picomatch": "^2.2.1"
17573
  },
 
18554
  "integrity": "sha512-vTxrZz4dX5W86M6oVWVdOVe72ZiPs41Oi7Z6Km4W5Turyz28mrXSJhhEBZoRtzJWIv3833WKVwLSDWWkEfupMg==",
18555
  "dev": true
18556
  },
18557
+ "node_modules/sass": {
18558
+ "version": "1.62.1",
18559
+ "resolved": "https://registry.npmjs.org/sass/-/sass-1.62.1.tgz",
18560
+ "integrity": "sha512-NHpxIzN29MXvWiuswfc1W3I0N8SXBd8UR26WntmDlRYf0bSADnwnOjsyMZ3lMezSlArD33Vs3YFhp7dWvL770A==",
18561
+ "dependencies": {
18562
+ "chokidar": ">=3.0.0 <4.0.0",
18563
+ "immutable": "^4.0.0",
18564
+ "source-map-js": ">=0.6.2 <2.0.0"
18565
+ },
18566
+ "bin": {
18567
+ "sass": "sass.js"
18568
+ },
18569
+ "engines": {
18570
+ "node": ">=14.0.0"
18571
+ }
18572
+ },
18573
  "node_modules/sass-loader": {
18574
  "version": "10.4.1",
18575
  "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-10.4.1.tgz",
 
19312
  "version": "1.0.2",
19313
  "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
19314
  "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
 
19315
  "engines": {
19316
  "node": ">=0.10.0"
19317
  }
 
20567
  "version": "5.0.1",
20568
  "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
20569
  "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
 
20570
  "dependencies": {
20571
  "is-number": "^7.0.0"
20572
  },
highlighted_text/package.json CHANGED
@@ -5,6 +5,7 @@
5
  "dependencies": {
6
  "react": "^16.13.1",
7
  "react-dom": "^16.13.1",
 
8
  "streamlit-component-lib": "^1.3.0"
9
  },
10
  "scripts": {
 
5
  "dependencies": {
6
  "react": "^16.13.1",
7
  "react-dom": "^16.13.1",
8
+ "sass": "^1.62.1",
9
  "streamlit-component-lib": "^1.3.0"
10
  },
11
  "scripts": {
highlighted_text/public/index.css DELETED
@@ -1,50 +0,0 @@
1
- body {
2
- padding: 0;
3
- margin: 0;
4
- font-family: "Source Sans Pro", sans-serif;
5
- font-size: 1rem;
6
- line-height: 1.4;
7
- }
8
-
9
- .highlighted-text {
10
- border: 1px solid #d2d2d2;
11
- border-radius: 0 0 5px 5px;
12
- background-color: white;
13
- padding: 4px;
14
- cursor: pointer;
15
-
16
- .token.active {
17
- outline: 1px solid #444;
18
- }
19
-
20
- &.frozen {
21
- .token {
22
- opacity: 0.75;
23
-
24
- &.context, &.active {
25
- opacity: 1;
26
- }
27
-
28
- &.context {
29
- text-decoration: #999 underline;
30
- }
31
- }
32
- }
33
- }
34
-
35
- .status-bar {
36
- min-height: 1.4em;
37
- border: 1px solid #d2d2d2;
38
- border-bottom: none;
39
- border-radius: 5px 5px 0 0;
40
- padding: 3px 4px;
41
-
42
- .token {
43
- border: 1px solid #aaa;
44
- border-radius: 2px;
45
- background: #f5f5f5;
46
- padding: 1px;
47
- margin: 1px;
48
- margin-right: 2px;
49
- }
50
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
highlighted_text/public/index.html CHANGED
@@ -5,7 +5,6 @@
5
  <meta charset="UTF-8" />
6
  <meta name="viewport" content="width=device-width, initial-scale=1" />
7
  <meta name="description" content="Highlighted text" />
8
- <link rel="stylesheet" href="index.css" />
9
  </head>
10
  <body>
11
  <div id="root"></div>
 
5
  <meta charset="UTF-8" />
6
  <meta name="viewport" content="width=device-width, initial-scale=1" />
7
  <meta name="description" content="Highlighted text" />
 
8
  </head>
9
  <body>
10
  <div id="root"></div>
highlighted_text/src/index.tsx CHANGED
@@ -1,6 +1,7 @@
1
  import React from "react";
2
  import ReactDOM from "react-dom";
3
  import HighlightedText from "./HighlightedText";
 
4
 
5
  ReactDOM.render(
6
  <React.StrictMode>
 
1
  import React from "react";
2
  import ReactDOM from "react-dom";
3
  import HighlightedText from "./HighlightedText";
4
+ import "./index.scss";
5
 
6
  ReactDOM.render(
7
  <React.StrictMode>