@@ -5,33 +5,65 @@ export interface Properties {
55table :StateEquivalenceTableType ;
66}
77
8+ enum CopyType {
9+ LaTeX ,
10+ }
11+
812export function StateEquivalenceTable ( props :Properties ) :JSX . Element {
13+ async function copyAs ( button :HTMLButtonElement , type :CopyType ) :Promise < void > {
14+ button . classList . remove ( "success" , "fail" ) ;
15+ try {
16+ let text :string ;
17+ switch ( type ) {
18+ case CopyType . LaTeX :
19+ text = StateEquivalenceTableType . formatLaTeX ( props . table ) ;
20+ break ;
21+ default :
22+ throw null ;
23+ }
24+ await navigator . clipboard . writeText ( text ) ;
25+ button . classList . add ( "success" ) ;
26+ }
27+ catch {
28+ setTimeout ( ( ) => button . classList . add ( "fail" ) ) ;
29+ }
30+ }
31+
932return (
10- < table >
11- < tbody >
12- < tr >
13- < th > </ th >
33+ < div >
34+ < table >
35+ < tbody >
36+ < tr >
37+ < th > </ th >
38+ {
39+ Object . keys ( Object . values ( props . table ) [ 0 ] ) . map ( k =>
40+ < th key = { k } > { k } </ th >
41+ )
42+ }
43+ </ tr >
1444{
15- Object . keys ( Object . values ( props . table ) [ 0 ] ) . map ( k =>
16- < th key = { k } > { k } </ th >
45+ Object . entries ( props . table ) . map ( ( [ n , states ] ) =>
46+ < tr key = { n } >
47+ < th > { n } </ th >
48+ {
49+ Object . entries ( states ) . map ( ( [ n , v ] ) =>
50+ < td key = { n } >
51+ { v ?"✔️" :"❌" }
52+ </ td >
53+ )
54+ }
55+ </ tr >
1756)
1857}
19- </ tr >
20- {
21- Object . entries ( props . table ) . map ( ( [ n , states ] ) =>
22- < tr key = { n } >
23- < th > { n } </ th >
24- {
25- Object . entries ( states ) . map ( ( [ n , v ] ) =>
26- < td key = { n } >
27- { v ?"✔️" :"❌" }
28- </ td >
29- )
30- }
31- </ tr >
32- )
33- }
34- </ tbody >
35- </ table >
58+ </ tbody >
59+ </ table >
60+ < div className = "action-buttons" >
61+ < button
62+ data-icon = "📄"
63+ onClick = { e => copyAs ( e . currentTarget , CopyType . LaTeX ) }
64+ title = "Copy this table as LaTeX"
65+ > LaTeX</ button >
66+ </ div >
67+ </ div >
3668) ;
3769}