bookish-press 0.5.194 → 0.6.53

package/README.md

@@ -4,4 +4,33 @@ Bookish is a framework and platform for writing and publishing web-based books.
 
 ## Status
 
-I'm working on a beta launch of the platform at [bookish.press](https://bookish.press) and expect to maintain the platform for the foreseeable future. Let me know if you'd like to help!
+I'm working on a 1.0 of the platform at [bookish.press](https://bookish.press) and expect to maintain the platform for the foreseeable future. Let me know if you'd like to help!
+
+## Deployment notes
+
+There are two major components to Bookish: the authoring platform and the reading front end. Changes to the authoring platform that do not affect reading can be verified and deployed to Firebase without any other coordination. However, changes to the reading experience have downstream dependencies that need to be managed. Here's the general deployment workflow, which I'm currently using as reminders for myself:
+
+0. Ensure you're working in the `dev` branch
+1. Fix bugs, add features
+2. Ensure there are no type errors (`npm run check`) or failed tests (`npm run test`).
+2. Test with emulator (`npm run emu`), if possible. (Some features aren't possible to perfectly emulate, such as authentication, hosting configurations, permissions.)
+3. Test on the [staging server](https://bookish-dev-21ac3.web.app/`) (`npm run stage`).
+4. Bump the version in `package.json`
+5. Describe the changes in `CHANGELOG.md`, linking to any issues closed
+6. Commit changes to `dev`, referring to any issues addressed
+7. Release to production (`npm run release`)
+8. Verify the change in production on [bookish.press](https://bookish.press)
+9. Merge dev to main (`npm run merge`)
+10. If any of the changes affected the reading experience (essentially if any `.svelte` file or its dependencies in `/src/lib/components` changed), then we need to update the reader package for authors who pre-build their books manually:
+    1. Update the bookish package with the Sveltekit package tooling (`npm run package`)
+    2. Publish the package to npm (`npm publish`)
+    3. Open the `bookish-reader` repository
+    4. Pull the revisions (`npm update`), ensuring you update the repository's `package.json` dependencies, in case there was a major version change
+    5. Update reader's `CHANGELOG.md` to describe any changes.
+    6. Bump the reader's version in `package.json`
+    7. Commit the changes directly to `main`, and sync them
+    8. For any of these changes to make it to pre-built books, authors need ot use the updated `bookish-reader` repo to rebuild their books. That generally involves:
+        1. Cloning the reader repo: `git clone https://github.com/amyjko/bookish-reader`
+        2. Entering the repo directory: `cd bookish-reader`
+        3. Binding the book: `bind.sh`
+        4. Deploying the bound book in the newly created `build` folder to wherever it's hosted.

package/dist/components/Auth.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: Record<string, never>;
     events: {
@@ -11,6 +11,6 @@ declare const __propDef: {
 export type AuthProps = typeof __propDef.props;
 export type AuthEvents = typeof __propDef.events;
 export type AuthSlots = typeof __propDef.slots;
-export default class Auth extends SvelteComponentTyped<AuthProps, AuthEvents, AuthSlots> {
+export default class Auth extends SvelteComponent<AuthProps, AuthEvents, AuthSlots> {
 }
 export {};

package/dist/components/Authentication.d.ts

@@ -5,4 +5,4 @@ type Authentication = {
     login: Function;
     logout: Function;
 };
-export default Authentication;
+export type { Authentication as default };

package/dist/components/BookPreview.svelte

@@ -60,6 +60,7 @@ $: url =
         text-align: left;
         flex-wrap: wrap;
         height: 12em;
+        overflow-y: hidden;
     }
 
     .cover {

package/dist/components/BookPreview.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type Book from '../models/book/Book';
 declare const __propDef: {
     props: {
@@ -13,6 +13,6 @@ declare const __propDef: {
 export type BookPreviewProps = typeof __propDef.props;
 export type BookPreviewEvents = typeof __propDef.events;
 export type BookPreviewSlots = typeof __propDef.slots;
-export default class BookPreview extends SvelteComponentTyped<BookPreviewProps, BookPreviewEvents, BookPreviewSlots> {
+export default class BookPreview extends SvelteComponent<BookPreviewProps, BookPreviewEvents, BookPreviewSlots> {
 }
 export {};

package/dist/components/Link.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         to: string;
@@ -14,6 +14,6 @@ declare const __propDef: {
 export type LinkProps = typeof __propDef.props;
 export type LinkEvents = typeof __propDef.events;
 export type LinkSlots = typeof __propDef.slots;
-export default class Link extends SvelteComponentTyped<LinkProps, LinkEvents, LinkSlots> {
+export default class Link extends SvelteComponent<LinkProps, LinkEvents, LinkSlots> {
 }
 export {};

package/dist/components/app/BookList.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type Book from '../../models/book/Book';
 declare const __propDef: {
     props: {
@@ -13,6 +13,6 @@ declare const __propDef: {
 export type BookListProps = typeof __propDef.props;
 export type BookListEvents = typeof __propDef.events;
 export type BookListSlots = typeof __propDef.slots;
-export default class BookList extends SvelteComponentTyped<BookListProps, BookListEvents, BookListSlots> {
+export default class BookList extends SvelteComponent<BookListProps, BookListEvents, BookListSlots> {
 }
 export {};

package/dist/components/app/Button.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: any;
@@ -17,6 +17,6 @@ declare const __propDef: {
 export type ButtonProps = typeof __propDef.props;
 export type ButtonEvents = typeof __propDef.events;
 export type ButtonSlots = typeof __propDef.slots;
-export default class Button extends SvelteComponentTyped<ButtonProps, ButtonEvents, ButtonSlots> {
+export default class Button extends SvelteComponent<ButtonProps, ButtonEvents, ButtonSlots> {
 }
 export {};

package/dist/components/app/Feedback.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         error?: boolean | undefined;
@@ -13,6 +13,6 @@ declare const __propDef: {
 export type FeedbackProps = typeof __propDef.props;
 export type FeedbackEvents = typeof __propDef.events;
 export type FeedbackSlots = typeof __propDef.slots;
-export default class Feedback extends SvelteComponentTyped<FeedbackProps, FeedbackEvents, FeedbackSlots> {
+export default class Feedback extends SvelteComponent<FeedbackProps, FeedbackEvents, FeedbackSlots> {
 }
 export {};

package/dist/components/app/Head.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         id?: string | null | undefined;
@@ -13,6 +13,6 @@ declare const __propDef: {
 export type HeadProps = typeof __propDef.props;
 export type HeadEvents = typeof __propDef.events;
 export type HeadSlots = typeof __propDef.slots;
-export default class Head extends SvelteComponentTyped<HeadProps, HeadEvents, HeadSlots> {
+export default class Head extends SvelteComponent<HeadProps, HeadEvents, HeadSlots> {
 }
 export {};

package/dist/components/app/Large.svelte.d.ts

@@ -1,7 +1,7 @@
 /** @typedef {typeof __propDef.props}  LargeProps */
 /** @typedef {typeof __propDef.events}  LargeEvents */
 /** @typedef {typeof __propDef.slots}  LargeSlots */
-export default class Large extends SvelteComponentTyped<{
+export default class Large extends SvelteComponent<{
     [x: string]: never;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -12,7 +12,7 @@ export default class Large extends SvelteComponentTyped<{
 export type LargeProps = typeof __propDef.props;
 export type LargeEvents = typeof __propDef.events;
 export type LargeSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: never;

package/dist/components/app/Lead.svelte.d.ts

@@ -1,7 +1,7 @@
 /** @typedef {typeof __propDef.props}  LeadProps */
 /** @typedef {typeof __propDef.events}  LeadEvents */
 /** @typedef {typeof __propDef.slots}  LeadSlots */
-export default class Lead extends SvelteComponentTyped<{
+export default class Lead extends SvelteComponent<{
     [x: string]: never;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -12,7 +12,7 @@ export default class Lead extends SvelteComponentTyped<{
 export type LeadProps = typeof __propDef.props;
 export type LeadEvents = typeof __propDef.events;
 export type LeadSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: never;

package/dist/components/app/Link.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         to: string;
@@ -16,6 +16,6 @@ declare const __propDef: {
 export type LinkProps = typeof __propDef.props;
 export type LinkEvents = typeof __propDef.events;
 export type LinkSlots = typeof __propDef.slots;
-export default class Link extends SvelteComponentTyped<LinkProps, LinkEvents, LinkSlots> {
+export default class Link extends SvelteComponent<LinkProps, LinkEvents, LinkSlots> {
 }
 export {};

package/dist/components/app/Options.svelte

@@ -20,5 +20,6 @@ export let label;
         padding: var(--app-chrome-padding);
         font-family: var(--app-font);
         font-size: var(--app-chrome-font-size);
+        max-width: 10em;
     }
 </style>

package/dist/components/app/Options.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         options: [string, string][];
@@ -14,6 +14,6 @@ declare const __propDef: {
 export type OptionsProps = typeof __propDef.props;
 export type OptionsEvents = typeof __propDef.events;
 export type OptionsSlots = typeof __propDef.slots;
-export default class Options extends SvelteComponentTyped<OptionsProps, OptionsEvents, OptionsSlots> {
+export default class Options extends SvelteComponent<OptionsProps, OptionsEvents, OptionsSlots> {
 }
 export {};

package/dist/components/app/Paragraph.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         aside?: boolean | undefined;
@@ -13,6 +13,6 @@ declare const __propDef: {
 export type ParagraphProps = typeof __propDef.props;
 export type ParagraphEvents = typeof __propDef.events;
 export type ParagraphSlots = typeof __propDef.slots;
-export default class Paragraph extends SvelteComponentTyped<ParagraphProps, ParagraphEvents, ParagraphSlots> {
+export default class Paragraph extends SvelteComponent<ParagraphProps, ParagraphEvents, ParagraphSlots> {
 }
 export {};

package/dist/components/app/Section.svelte.d.ts

@@ -1,7 +1,7 @@
 /** @typedef {typeof __propDef.props}  SectionProps */
 /** @typedef {typeof __propDef.events}  SectionEvents */
 /** @typedef {typeof __propDef.slots}  SectionSlots */
-export default class Section extends SvelteComponentTyped<{
+export default class Section extends SvelteComponent<{
     [x: string]: never;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -12,7 +12,7 @@ export default class Section extends SvelteComponentTyped<{
 export type SectionProps = typeof __propDef.props;
 export type SectionEvents = typeof __propDef.events;
 export type SectionSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: never;

package/dist/components/app/Table.svelte

@@ -9,7 +9,6 @@
         width: 100%;
         overflow-x: auto;
         margin-top: var(--app-text-spacing);
-        margin-bottom: var(--app-text-spacing);
         border-top: var(--app-chrome-border-size) solid var(--app-border-color);
         border-bottom: var(--app-chrome-border-size) solid
             var(--app-border-color);

package/dist/components/app/Table.svelte.d.ts

@@ -1,7 +1,7 @@
 /** @typedef {typeof __propDef.props}  TableProps */
 /** @typedef {typeof __propDef.events}  TableEvents */
 /** @typedef {typeof __propDef.slots}  TableSlots */
-export default class Table extends SvelteComponentTyped<{
+export default class Table extends SvelteComponent<{
     [x: string]: never;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -12,7 +12,7 @@ export default class Table extends SvelteComponentTyped<{
 export type TableProps = typeof __propDef.props;
 export type TableEvents = typeof __propDef.events;
 export type TableSlots = typeof __propDef.slots;
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         [x: string]: never;

package/dist/components/app/TextInput.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         text?: string | undefined;
@@ -16,7 +16,7 @@ declare const __propDef: {
 export type TextInputProps = typeof __propDef.props;
 export type TextInputEvents = typeof __propDef.events;
 export type TextInputSlots = typeof __propDef.slots;
-export default class TextInput extends SvelteComponentTyped<TextInputProps, TextInputEvents, TextInputSlots> {
+export default class TextInput extends SvelteComponent<TextInputProps, TextInputEvents, TextInputSlots> {
     get value(): () => string;
 }
 export {};

package/dist/components/chapter/Atom.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type AtomNode from '../../models/chapter/AtomNode';
 declare const __propDef: {
     props: {
@@ -14,6 +14,6 @@ declare const __propDef: {
 export type AtomProps = typeof __propDef.props;
 export type AtomEvents = typeof __propDef.events;
 export type AtomSlots = typeof __propDef.slots;
-export default class Atom extends SvelteComponentTyped<AtomProps, AtomEvents, AtomSlots> {
+export default class Atom extends SvelteComponent<AtomProps, AtomEvents, AtomSlots> {
 }
 export {};

package/dist/components/chapter/Block.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type BlockNode from '../../models/chapter/BlockNode';
 declare const __propDef: {
     props: {
@@ -12,6 +12,6 @@ declare const __propDef: {
 export type BlockProps = typeof __propDef.props;
 export type BlockEvents = typeof __propDef.events;
 export type BlockSlots = typeof __propDef.slots;
-export default class Block extends SvelteComponentTyped<BlockProps, BlockEvents, BlockSlots> {
+export default class Block extends SvelteComponent<BlockProps, BlockEvents, BlockSlots> {
 }
 export {};

package/dist/components/chapter/Callout.svelte

@@ -25,7 +25,6 @@ export let node;
         padding-bottom: var(--bookish-paragraph-spacing);
         line-height: var(--bookish-paragraph-line-height-tight);
         clear: both;
-        position: relative;
     }
 
     .bookish-callout :global(h2),

package/dist/components/chapter/Callout.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type CalloutNode from '../../models/chapter/CalloutNode';
 declare const __propDef: {
     props: {
@@ -12,6 +12,6 @@ declare const __propDef: {
 export type CalloutProps = typeof __propDef.props;
 export type CalloutEvents = typeof __propDef.events;
 export type CalloutSlots = typeof __propDef.slots;
-export default class Callout extends SvelteComponentTyped<CalloutProps, CalloutEvents, CalloutSlots> {
+export default class Callout extends SvelteComponent<CalloutProps, CalloutEvents, CalloutSlots> {
 }
 export {};

package/dist/components/chapter/CaptionedCode.svelte

@@ -5,35 +5,22 @@ import Python from './Python.svelte';
 import Text from './Text.svelte';
 import { isChapterEditable } from '../page/Contexts';
 import Figure from './Figure.svelte';
-import { getCaret } from '../page/Contexts';
+import Button from '../app/Button.svelte';
 export let node;
 $: language = node.getLanguage();
 let editable = isChapterEditable();
 // const languages = [ "C", "C++", "CSS", "Go", "HTML", "Java", "JavaScript", "Markdown", "Plaintext", "Python", "TypeScript" ];
-let caret = getCaret();
-$: inside =
-    $caret?.range?.start.node === node.getCodeNode() ||
-        $caret?.range?.end.node === node.getCodeNode();
+let editing = true;
 </script>
 
-<Figure {node} caption={node.getCaption()}>
-    {#if editable}
-        <div class="container">
+<Figure {node} caption={node.getCaption()} focusable={false}>
+    {#if editable && editing}
+        <div class="container" class:editing>
             <code
-                class={`bookish-code bookish-code-block language-${language} ${
-                    !inside ? 'hidden' : ''
-                }`}
+                class={`bookish-code bookish-code-block wrap language-${language}`}
             >
                 <Text node={node.getCodeNode()} />
             </code>
-            <div class="code" class:inside>
-                <Code
-                    editable={false}
-                    inline={false}
-                    language={node.getLanguage()}
-                    nodeID={node.getCodeNode().nodeID}>{node.getCode()}</Code
-                >
-            </div>
         </div>
     {:else if node.getLanguage() === 'python' && node.isExecutable()}
         <Python {node} startCode={node.getCode()} />
@@ -45,6 +32,15 @@ $: inside =
             nodeID={node.getCodeNode().nodeID}>{node.getCode()}</Code
         >
     {/if}
+    {#if editable}
+        <Button
+            tooltip={editing ? 'stop editing' : 'start editing'}
+            command={() => {
+                editing = !editing;
+            }}
+            >{#if editing}done{:else}edit{/if}</Button
+        >
+    {/if}
     {#if node.getLanguage() !== 'plaintext'}<aside class="language"
             >{node.getLanguage()}</aside
         >{/if}
@@ -66,6 +62,12 @@ $: inside =
     .container {
         position: relative;
     }
+
+    .container.editing {
+        border: 1px solid var(--app-interactive-color);
+        border-radius: var(--app-chrome-roundedness);
+    }
+
     .code {
         position: absolute;
         top: 0;

package/dist/components/chapter/CaptionedCode.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type CodeNode from '../../models/chapter/CodeNode';
 declare const __propDef: {
     props: {
@@ -12,6 +12,6 @@ declare const __propDef: {
 export type CaptionedCodeProps = typeof __propDef.props;
 export type CaptionedCodeEvents = typeof __propDef.events;
 export type CaptionedCodeSlots = typeof __propDef.slots;
-export default class CaptionedCode extends SvelteComponentTyped<CaptionedCodeProps, CaptionedCodeEvents, CaptionedCodeSlots> {
+export default class CaptionedCode extends SvelteComponent<CaptionedCodeProps, CaptionedCodeEvents, CaptionedCodeSlots> {
 }
 export {};

package/dist/components/chapter/ChapterBody.svelte

@@ -44,6 +44,8 @@ $: root.set(node);
     .bookish-chapter-body {
         min-height: 2em;
         min-width: 100%;
+
+        overflow-wrap: break-word;
     }
 
     :global(.bookish-content-highlight) {

package/dist/components/chapter/ChapterBody.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type ChapterNode from '../../models/chapter/ChapterNode';
 declare const __propDef: {
     props: {
@@ -14,6 +14,6 @@ declare const __propDef: {
 export type ChapterBodyProps = typeof __propDef.props;
 export type ChapterBodyEvents = typeof __propDef.events;
 export type ChapterBodySlots = typeof __propDef.slots;
-export default class ChapterBody extends SvelteComponentTyped<ChapterBodyProps, ChapterBodyEvents, ChapterBodySlots> {
+export default class ChapterBody extends SvelteComponent<ChapterBodyProps, ChapterBodyEvents, ChapterBodySlots> {
 }
 export {};

package/dist/components/chapter/Citations.svelte

@@ -33,54 +33,48 @@ $: citations = node.getMeta().sort((a, b) => {
 afterUpdate(() => $chapter?.layoutMarginals());
 </script>
 
-<Atom {node}>
-    {#if $root}
-        <span class="bookish-citation" data-nodeid={node.nodeID}>
-            <Marginal
+<Atom {node}
+    >{#if $root}<span class="bookish-citation" data-nodeid={node.nodeID}
+            ><Marginal
                 {node}
                 id={'citation-' + citations.join('-')}
                 label="citations"
-            >
-                <svelte:fragment slot="interactor">
-                    {#each citations as citationID, index}
-                        {@const citationNumber =
-                            $root.getCitationNumber(citationID)}
-                        {#if citationNumber && citationID in ($edition?.getReferences() ?? {})}
-                            <sup class="bookish-citation-symbol"
+                ><svelte:fragment slot="interactor">
+                    {#each citations as citationID, index}{@const citationNumber =
+                            $root.getCitationNumber(
+                                citationID,
+                            )}{#if citationNumber && citationID in ($edition?.getReferences() ?? {})}<sup
+                                class="bookish-citation-symbol"
                                 >{citationNumber}</sup
-                            >
-                        {:else}
-                            <Problem
+                            >{:else}<Problem
                                 >Unknown reference: <code>{citationID}</code
                                 ></Problem
-                            >
-                        {/if}
-                        {#if citations.length > 1 && index < citations.length - 1}<sup
+                            >{/if}{#if citations.length > 1 && index < citations.length - 1}<sup
                                 >,</sup
-                            >{/if}
-                    {:else}
-                        <sup class="bookish-citation-symbol">{'\u2014'}</sup>
-                    {/each}
-                </svelte:fragment>
-                <span slot="content" class="bookish-references">
-                    {#each citations as citationID}
+                            >{/if}{:else}<sup class="bookish-citation-symbol"
+                            >{'\u2014'}</sup
+                        >{/each}</svelte:fragment
+                ><span slot="content" class="bookish-references"
+                    >{#each citations as citationID}
                         {@const citationNumber =
                             $root.getCitationNumber(citationID)}
                         {@const ref = $edition?.getReference(citationID)}
-                        {#if citationNumber && ref && $edition}
-                            <span class="bookish-reference">
+                        {#if citationNumber && ref && $edition}<span
+                                class="bookish-reference"
+                            >
                                 <sup class="bookish-citation-symbol"
                                     >{citationNumber}</sup
                                 >
-                                <PossibleReference node={ref} edit={false} />
-                            </span>
-                        {/if}
-                    {/each}
-                </span>
-            </Marginal>
-        </span>
-    {/if}
-</Atom>
+                                <PossibleReference
+                                    node={ref}
+                                    edit={false}
+                                /></span
+                            >{/if}
+                    {/each}</span
+                ></Marginal
+            ></span
+        >{/if}</Atom
+>
 
 <style>
     sup {
@@ -110,8 +104,6 @@ afterUpdate(() => $chapter?.layoutMarginals());
     .bookish-references .bookish-reference {
         display: block;
         line-height: var(--bookish-paragraph-line-height-tight);
-        margin-left: 1rem;
-        margin-bottom: 1rem;
         text-align: left;
     }
 

package/dist/components/chapter/Citations.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type CitationsNode from '../../models/chapter/CitationsNode';
 declare const __propDef: {
     props: {
@@ -12,6 +12,6 @@ declare const __propDef: {
 export type CitationsProps = typeof __propDef.props;
 export type CitationsEvents = typeof __propDef.events;
 export type CitationsSlots = typeof __propDef.slots;
-export default class Citations extends SvelteComponentTyped<CitationsProps, CitationsEvents, CitationsSlots> {
+export default class Citations extends SvelteComponent<CitationsProps, CitationsEvents, CitationsSlots> {
 }
 export {};

package/dist/components/chapter/Code.svelte

@@ -57,6 +57,10 @@ function handleChange() {
         border-radius: var(--bookish-roundedness);
     }
 
+    :global(.bookish-code-block.wrap) {
+        white-space: pre-wrap !important;
+    }
+
     :global(.bookish-code-inline) {
         display: inline;
         padding: calc(1.5 * var(--bookish-inline-padding))

package/dist/components/chapter/Code.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 declare const __propDef: {
     props: {
         editable: boolean;
@@ -17,6 +17,6 @@ declare const __propDef: {
 export type CodeProps = typeof __propDef.props;
 export type CodeEvents = typeof __propDef.events;
 export type CodeSlots = typeof __propDef.slots;
-export default class Code extends SvelteComponentTyped<CodeProps, CodeEvents, CodeSlots> {
+export default class Code extends SvelteComponent<CodeProps, CodeEvents, CodeSlots> {
 }
 export {};

package/dist/components/chapter/Comment.svelte.d.ts

@@ -1,4 +1,4 @@
-import { SvelteComponentTyped } from "svelte";
+import { SvelteComponent } from "svelte";
 import type CommentNode from '../../models/chapter/CommentNode';
 declare const __propDef: {
     props: {
@@ -12,6 +12,6 @@ declare const __propDef: {
 export type CommentProps = typeof __propDef.props;
 export type CommentEvents = typeof __propDef.events;
 export type CommentSlots = typeof __propDef.slots;
-export default class Comment extends SvelteComponentTyped<CommentProps, CommentEvents, CommentSlots> {
+export default class Comment extends SvelteComponent<CommentProps, CommentEvents, CommentSlots> {
 }
 export {};