@abcnews/components-builder 0.0.7 → 0.0.9

package/README.md

@@ -16,7 +16,7 @@ A two column frame you can use to scaffold your builder.
 
 ```svelte
 <script lang="ts">
-  import { BuilderFrame } from '@abcnews/components-builder';
+  import { BuilderStyleRoot, BuilderFrame } from '@abcnews/components-builder';
 </script>
 
 {#snippet Viz()}
@@ -70,7 +70,7 @@ Note that the screenshot tool is not fast. We haven't been able to speed up the
 />
 ```
 
-The `defaultMarkerName` Function provides a user-friendly version of the marker for the preview step. This is the same funcitopn as the `MarkerAdmin` component.
+The `defaultMarkerName` Function provides a user-friendly version of the marker for the preview step. This is the same function as the `MarkerAdmin` component.
 
 Prefixes correlate to the different marker types that have been implemented in the app. This is the same object as the `MarkerAdmin` component.
 
@@ -149,7 +149,7 @@ This uses the native dialogue element, so focus will always be inside the modal.
 
 ## Google Doc Scrollyteller
 
-This component lets edits draft stories in Google Docs and preview to scroll teller in real time. Period this is useful because multiple people can be editing at once and have a real-time preview, whereas the CMS is single user and can be slow to iterate on.
+This component lets edits draft stories in Google Docs and preview to scrollyteller in real time. This is useful because multiple people can be editing at once and have a real-time preview, whereas the CMS is single user and can be slow to iterate on.
 
 This component must be set up on its own page, as it has two different routes built into it. An example implementation follows:
 
@@ -194,7 +194,7 @@ As a prerequisite your builder must store its state in window.location.hash. E.g
 
 `defaultMarkerName` is a function that returns a user friendly name for the marker when the user clicks the save button. You can use this to customise default marker names based on the current hash, which can be useful if you have several different visualisations with distinct names.
 
-Prefixes correlate to the different marker types that have been implemented in the app. Users can choose which type of marker they want to copy. This is the same object as the `MarkerAdmin` component.
+Prefixes correlate to the different marker types that have been implemented in the app. Users can choose which type of marker they want to copy. This is the same object as the `ScreenshotTool` component.
 
 ## Developing
 
@@ -210,25 +210,11 @@ Everything inside `src/lib` is part of the library, everything inside `src/route
 
 To build the library:
 
-```bash
-npm run package
-```
-
-To create a production version of the showcase app:
-
 ```bash
 npm run build
 ```
 
-You can preview the production build with `npm run preview`.
-
-> To deploy the app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for the target environment.
-
-## Publishing
-
-Go into the `package.json` and give the package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
-
-To publish the library to [npm](https://www.npmjs.com):
+Then publish the new version with:
 
 ```bash
 npm publish

package/dist/ScreenshotTool/ScreenshotTool.svelte

@@ -1,9 +1,9 @@
 <script>
   import { untrack } from "svelte";
   import JSZip from "jszip";
-  import { saveAs } from "file-saver";
   import eachLimit from "async/eachLimit";
   import Modal from "../Modal/Modal.svelte";
+  import saveAs from "./saveAs";
 
   const GENERATOR_URL = "https://fallback-automations-yknow.kyd.au/api";
   const GENERATOR_MAX_PARALLEL = 3;

package/dist/ScreenshotTool/saveAs.d.ts

@@ -0,0 +1 @@
+export default function saveAs(blob: any, name: any): void;

package/dist/ScreenshotTool/saveAs.js

@@ -0,0 +1,25 @@
+/*
+ * FileSaver.js
+ * A saveAs() FileSaver implementation.
+ *
+ * By Eli Grey, http://eligrey.com
+ *
+ * License : https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md (MIT)
+ * source  : http://purl.eligrey.com/github/FileSaver.js
+ */
+export default function saveAs(blob, name) {
+  var a = document.createElement("a");
+  name = name || blob.name || "download";
+
+  a.download = name;
+  a.rel = "noopener";
+
+  // Support blobs
+  a.href = URL.createObjectURL(blob);
+  setTimeout(function () {
+    URL.revokeObjectURL(a.href);
+  }, 4e4); // 40s
+  setTimeout(function () {
+    a.click();
+  }, 0);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abcnews/components-builder",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build && npm run prepack",
@@ -64,7 +64,6 @@
     "@abcnews/svelte-scrollyteller": "github:abcnews/svelte-scrollyteller#feature/future-news",
     "async": "^3.2.6",
     "bootstrap-icons": "^1.11.3",
-    "file-saver": "^2.0.5",
     "jszip": "^3.10.1",
     "svelte-bootstrap-icons": "^3.1.2"
   }