rename package and repo to elementari

contributing.md

@@ -2,15 +2,15 @@
 
 ## 🙋 How can I help?
 
-Pull requests to improve docs, test coverage or examples are always welcome! If you want to implement a new feature, please submit an issue first so we can discuss project-fit. You can also look for [issues labeled 'help wanted'](https://github.com/janosh/sveriodic-table/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22) and open a PR to close one of those. If you don't finish, you're welcome to submit it as draft PR anyway. Someone else might take over.
+Pull requests to improve docs, test coverage or examples are always welcome! If you want to implement a new feature, please submit an issue first so we can discuss project-fit. You can also look for [issues labeled 'help wanted'](https://github.com/janosh/elementari/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22) and open a PR to close one of those. If you don't finish, you're welcome to submit it as draft PR anyway. Someone else might take over.
 
 ## 🚀 Submit a PR
 
 To submit a pull request, clone the repo, install dependencies and start the dev server to see changes as you make them.
 
 ```sh
-git clone https://github.com/janosh/sveriodic-table
-cd sveriodic-table
+git clone https://github.com/janosh/elementari
+cd elementari
 npm run install
 npm dev
 ```
@@ -37,9 +37,9 @@ Any new features should come with corresponding tests. If you fix a bug, please
 
 This repo has 3 required CI checks that have to pass for every PR before merging:
 
-- tests: run as [GitHub Action](https://github.com/janosh/sveriodic-table/actions/workflows/test.yml) ([workflow code](https://github.com/janosh/sveriodic-table/blob/main/.github/workflows/test.yml))
-- linting: handled by [pre-commit.ci](https://results.pre-commit.ci/latest/github/janosh/sveriodic-table/main)
-- docs: [continuous deployment](https://github.com/janosh/sveriodic-table/blob/main/.github/workflows/gh-pages.yml) through GitHub Pages
+- tests: run as [GitHub Action](https://github.com/janosh/elementari/actions/workflows/test.yml) ([workflow code](https://github.com/janosh/elementari/blob/main/.github/workflows/test.yml))
+- linting: handled by [pre-commit.ci](https://results.pre-commit.ci/latest/github/janosh/elementari/main)
+- docs: [continuous deployment](https://github.com/janosh/elementari/blob/main/.github/workflows/gh-pages.yml) through GitHub Pages
 
 ## 🆕 New release
 
@@ -75,4 +75,4 @@ Push the release commit and tag to `origin/main`:
 git push && git push --tags
 ```
 
-Finally [publish a new release on GitHub](https://github.com/janosh/sveriodic-table/releases/new).
+Finally [publish a new release on GitHub](https://github.com/janosh/elementari/releases/new).

package.json

@@ -1,14 +1,14 @@
 {
-  "name": "sveriodic-table",
-  "description": "Svelte components for interactive periodic tables with heatmaps, scatter+line plots and atomic Bohr model animations.",
+  "name": "elementari",
+  "description": "Interactive visualizations for materials science: periodic tables, Bohr atoms, nuclei, heatmaps, scatter plots.",
   "author": "Janosh Riebesell <janosh.riebesell@gmail.com>",
-  "homepage": "https://janosh.github.io/sveriodic-table",
-  "repository": "https://github.com/janosh/sveriodic-table",
+  "homepage": "https://janosh.github.io/elementari",
+  "repository": "https://github.com/janosh/elementari",
   "license": "MIT",
-  "version": "0.1.8",
+  "version": "0.1.0",
   "type": "module",
   "svelte": "index.js",
-  "bugs": "https://github.com/janosh/sveriodic-table/issues",
+  "bugs": "https://github.com/janosh/elementari/issues",
   "scripts": {
     "dev": "vite dev",
     "build": "vite build",
@@ -34,18 +34,18 @@
   "devDependencies": {
     "@playwright/test": "^1.30.0",
     "@sveltejs/adapter-static": "^2.0.1",
-    "@sveltejs/kit": "^1.5.5",
+    "@sveltejs/kit": "^1.3.5",
     "@sveltejs/package": "^1.0.2",
     "@types/d3-array": "^3.0.4",
     "@types/d3-color": "^3.1.0",
     "@types/d3-interpolate-path": "^2.0.0",
     "@types/d3-scale": "^4.0.3",
     "@types/d3-scale-chromatic": "^3.0.0",
     "@types/d3-shape": "^3.1.1",
-    "@typescript-eslint/eslint-plugin": "^5.51.0",
-    "@typescript-eslint/parser": "^5.51.0",
-    "@vitest/coverage-c8": "^0.28.4",
-    "eslint": "^8.33.0",
+    "@typescript-eslint/eslint-plugin": "^5.52.0",
+    "@typescript-eslint/parser": "^5.52.0",
+    "@vitest/coverage-c8": "^0.28.5",
+    "eslint": "^8.34.0",
     "eslint-plugin-svelte3": "^4.0.0",
     "hastscript": "^7.2.0",
     "jsdom": "^21.1.0",
@@ -61,11 +61,11 @@
     "svelte-check": "^3.0.3",
     "svelte-preprocess": "^5.0.1",
     "svelte-toc": "^0.5.2",
-    "svelte-zoo": "^0.2.4",
+    "svelte-zoo": "^0.2.5",
     "svelte2tsx": "^0.6.1",
     "typescript": "^4.9.5",
     "vite": "^4.1.1",
-    "vitest": "^0.28.4"
+    "vitest": "^0.28.5"
   },
   "keywords": [
     "svelte",

readme.md

@@ -6,10 +6,10 @@
 
 <h4 align="center">
 
-[![Tests](https://github.com/janosh/sveriodic-table/actions/workflows/test.yml/badge.svg)](https://github.com/janosh/sveriodic-table/actions/workflows/test.yml)
-[![GH Pages](https://github.com/janosh/sveriodic-table/actions/workflows/gh-pages.yml/badge.svg)](https://github.com/janosh/sveriodic-table/actions/workflows/gh-pages.yml)
-[![pre-commit.ci status](https://results.pre-commit.ci/badge/github/janosh/sveriodic-table/main.svg?badge_token=nUqJfPCFS4uyMwcFSDIfdQ)](https://results.pre-commit.ci/latest/github/janosh/sveriodic-table/main?badge_token=nUqJfPCFS4uyMwcFSDIfdQ)
-[![Open in StackBlitz](https://img.shields.io/badge/Open%20in-StackBlitz-darkblue?logo=stackblitz)](https://stackblitz.com/github/janosh/sveriodic-table)
+[![Tests](https://github.com/janosh/elementari/actions/workflows/test.yml/badge.svg)](https://github.com/janosh/elementari/actions/workflows/test.yml)
+[![GH Pages](https://github.com/janosh/elementari/actions/workflows/gh-pages.yml/badge.svg)](https://github.com/janosh/elementari/actions/workflows/gh-pages.yml)
+[![pre-commit.ci status](https://results.pre-commit.ci/badge/github/janosh/elementari/main.svg?badge_token=nUqJfPCFS4uyMwcFSDIfdQ)](https://results.pre-commit.ci/latest/github/janosh/elementari/main?badge_token=nUqJfPCFS4uyMwcFSDIfdQ)
+[![Open in StackBlitz](https://img.shields.io/badge/Open%20in-StackBlitz-darkblue?logo=stackblitz)](https://stackblitz.com/github/janosh/elementari)
 
 </h4>
 
@@ -32,7 +32,7 @@ The details page for gold.
 ## 🔨 &thinsp; Installation
 
 ```sh
-npm install --dev sveriodic-tables
+npm install --dev elementari
 ```
 
 ## 📙 &thinsp; Usage
@@ -41,7 +41,7 @@ Import the `PeriodicTable` component and pass it some heatmap values:
 
 ```svelte
 <script>
-  import PeriodicTable from 'sveriodic-tables'
+  import PeriodicTable from 'elementari'
 
   const heatmap_values = { H: 10, He: 4, Li: 8, Fe: 3, O: 24 }
 </script>

src/app.html

@@ -11,13 +11,13 @@
     <meta name="twitter:creator" content="@jrib_" />
     <meta
       property="og:image"
-      content="https://github.com/raw/janosh/sveriodic-table/main/static/2022-07-12-screenshot.png"
+      content="https://github.com/raw/janosh/elementari/main/static/2022-07-12-screenshot.png"
     />
     <meta property="og:image:alt" content="Interactive Periodic Table" />
 
     <script
       defer
-      data-domain="sveriodic-table.janosh.dev"
+      data-domain="elementari.janosh.dev"
       src="https://plausible.io/js/plausible.js"
     ></script>
 

src/routes/(demos)/bohr-atoms/+page.svelte

@@ -1,17 +1,21 @@
 <script lang="ts">
   import { BohrAtom, element_data } from '$lib'
+  import { Slider } from 'svelte-zoo'
   import Desc from './desc.md'
 
   let orbital_period = 2
 </script>
 
 <Desc />
 
-<label>
-  Electron Orbital Period:
-  <input type="range" bind:value={orbital_period} min={0} max={5} step={0.01} />
-  <input type="number" bind:value={orbital_period} min={0} max={5} />
-</label>
+<Slider
+  label="Electron Orbital Period"
+  bind:value={orbital_period}
+  min={0}
+  max={5}
+  step={0.1}
+  style="place-content: center; margin: 1em;"
+/>
 
 <ol>
   {#each element_data as { shells, symbol, number, name }}
@@ -25,26 +29,6 @@
 </ol>
 
 <style>
-  label {
-    display: flex;
-    gap: 6pt;
-    place-content: center;
-    margin: 1em;
-  }
-  input[type='number'] {
-    background: transparent;
-    color: inherit;
-    border: none;
-    /* text-align: center; */
-    padding: 0 4pt;
-    font-size: large;
-    box-sizing: border-box;
-    width: 2em;
-  }
-  input[type='number']::-webkit-inner-spin-button,
-  input[type='number']::-webkit-outer-spin-button {
-    appearance: none;
-  }
   ol {
     display: flex;
     flex-wrap: wrap;

tests/unit/periodic-table.test.ts

@@ -70,17 +70,17 @@ describe(`PeriodicTable`, () => {
     await sleep()
 
     const selected = doc_query(`div.multiselect > ul.selected`)
-    const heatmap_label = `Atomic Radius (Å)`
+    const heatmap_label = `Atomic Mass (u)`
     expect(selected.textContent?.trim()).toBe(heatmap_label)
     const heatmap_key = heatmap_labels[heatmap_label]
 
-    expect(heatmap_key).toBe(`atomic_radius`)
+    expect(heatmap_key).toBe(`atomic_mass`)
     ptable.$set({ heatmap_values: element_data.map((e) => e[heatmap_key]) })
     await sleep()
 
     const element_tile = doc_query(`div.element-tile`)
     // hydrogen with lowest mass should be blue (low end of color scale)
-    expect(element_tile.style.backgroundColor).toBe(`rgb(60, 79, 138)`)
+    expect(element_tile.style.backgroundColor).toBe(`rgb(68, 1, 84)`)
   })
 
   test.each([[0], [0.5], [1], [2]])(