print component

src/lib/components/App.svelte

@@ -9,6 +9,9 @@
 <div class:hide={activeTab !== 'json'}>
     <JsonOutput />
 </div>
+<div class:hide={activeTab !== 'print'}>
+    <PrintOutput />
+</div>
 
 </main>
 
@@ -20,6 +23,7 @@
     import ShipEdit from "./ShipEdit/index.svelte";
     import About from "./About.svelte";
     import JsonOutput from './Output/Json.svelte';
+    import PrintOutput from './Output/Print/index.svelte';
 
     let activeTab = 'editor';
     $: console.log(activeTab);

src/lib/components/Output/Print/Identification/index.svelte

@@ -3,7 +3,7 @@
 </h1>
 
 <div class="details">
-  <h2>{ship_class}-class, {ship_type}</h2>
+    <h2>{shipClass}-class, {shipType}</h2>
     <div class="reqs">
         <Cost {cost} />
         &nbsp;
@@ -15,8 +15,8 @@
     import Cost from "../../../Cost.svelte";
     import Mass from "$lib/components/Mass.svelte";
 
-  export let ship_class;
+    export let shipClass;
-  export let ship_type;
+    export let shipType;
     export let cost,
         mass = (0, 0);
 </script>

src/lib/components/Output/Print/index.svelte

@@ -1,3 +1,7 @@
+<div>
+  <Identification {...$state.identification} />
+</div>
+<!--
 <aside class="ship-sheet" transition:fade>
   <Identification {...ship.general} />
 
@@ -12,21 +16,25 @@
     />
   </div>
 
-  <MainSystems ftl={ship.ftl.type} engine={ship.engine.rating} />
 </aside>
+-->
+  <MainSystems ftl={$state?.propulsion?.ftl}
+        engine={$state?.propulsion?.drive?.rating} />
 
 <script>
-  import _ from "lodash";
+import { getContext } from 'svelte';
+  /* import _ from "lodash"; */
 
   import Identification from "./Identification/index.svelte";
   import MainSystems from "./MainSystems/index.svelte";
-  import Hull from "./Hull/index.svelte";
+  /* import Hull from "./Hull/index.svelte"; */
-  import Weapons from "./Weapons/index.svelte";
+  /* import Weapons from "./Weapons/index.svelte"; */
-  import Systems from "./Systems/index.svelte";
+  /* import Systems from "./Systems/index.svelte"; */
 
-  export let ship;
+  /* export let ship; */
+    const { state } = getContext('ship');
 
-  import { fly, fade } from "svelte/transition";
+  /* import { fly, fade } from "svelte/transition"; */
 </script>
 
 <style>