atlas-viewer · stephenwf · Apr 9, 2024 · Apr 9, 2024 · Apr 9, 2024 · Apr 9, 2024
diff --git a/.codesandbox/ci.json b/.codesandbox/ci.json
@@ -1,4 +1,4 @@
 {
   "sandboxes": ["new", "vanilla"],
-  "node": "16"
+  "node": "18"
 }
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.js b/.eslintrc.js
diff --git a/.github/workflows/build-test.yml b/.github/workflows/build-test.yml
@@ -1,4 +1,4 @@
-name: Yarn build + test
+name: Build + test
 
 on: [push]
 
@@ -7,24 +7,36 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: [ '16' ]
+        node: ['18', '20']
 
     name: Node ${{ matrix.node }} build
     steps:
-      - uses: actions/checkout@v1
-      - name: Get yarn cache
-        id: yarn-cache
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - uses: actions/cache@v1
-        with:
-          path: ${{ steps.yarn-cache.outputs.dir }}
-          key: ${{ runner.os }}-${{ matrix.node }}-yarn-${{ hashFiles('**/yarn.lock') }}
-          restore-keys: |
-            ${{ runner.os }}-yarn-
+      - uses: actions/checkout@v3
+
       - name: Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node }}
-      - run: yarn install --frozen-lockfile --non-interactive
-      - run: yarn run build
-      - run: yarn run test
+
+      - uses: pnpm/action-setup@v2
+        name: Install pnpm
+        with:
+          version: 8
+          run_install: false
+
+      - name: Get pnpm store directory
+        shell: bash
+        run: |
+          echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV
+
+      - uses: actions/cache@v3
+        name: Setup pnpm cache
+        with:
+          path: ${{ env.STORE_PATH }}
+          key: ${{ runner.os }}-${{ matrix.node }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-${{ matrix.node }}-pnpm-store-
+
+      - run: pnpm i --frozen-lockfile
+      - run: pnpm run build
+      - run: pnpm run test
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-16
+18
diff --git a/.storybook/main.js b/.storybook/main.js
diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
diff --git a/.storybook/preview.js b/.storybook/preview.js
diff --git a/.storylite/canvas.tsx b/.storylite/canvas.tsx
@@ -0,0 +1,17 @@
+import '@storylite/storylite/styles.css';
+//
+// import '../src/styles/components.css';
+//
+// import '../src/styles/storylite-iframe.css';
+// import '../src/styles/storylite-ui.css';
+
+// import iframe-scope styles here
+
+import stories from '@storylite/vite-plugin:stories';
+import { renderStoryLiteApp } from '@storylite/storylite';
+
+import config from './config';
+
+const rootElement = document.getElementById('root') as HTMLElement;
+
+renderStoryLiteApp(rootElement, stories, config);
diff --git a/.storylite/config.tsx b/.storylite/config.tsx
@@ -0,0 +1,13 @@
+import type { SLAddonPropsWithoutId, SLAppComponentProps } from '@storylite/storylite';
+
+const config: Partial<SLAppComponentProps> = {
+  title: ' ⚡️ Atlas Viewer',
+  defaultStory: 'index-default',
+  useIframeStyles: false,
+  iframeProps: {
+    style: {},
+  },
+  addons: [],
+};
+
+export default config;
diff --git a/.storylite/index.tsx b/.storylite/index.tsx
@@ -0,0 +1,13 @@
+import '@storylite/storylite/styles.css';
+// import '../src/styles/storylite-ui.css';
+
+// import other StoryLite UI styles here
+
+import stories from '@storylite/vite-plugin:stories';
+import { renderStoryLiteApp } from '@storylite/storylite';
+
+import config from './config';
+
+const rootElement = document.getElementById('root') as HTMLElement;
+
+renderStoryLiteApp(rootElement, stories, config);
diff --git a/canvas.html b/canvas.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/logo.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>StoryLite - Design System (React) - IFRAME</title>
+    <script src="https://cdn.jsdelivr.net/npm/@iiif/[email protected]/dist/index.umd.js"></script>
+    <script>
+      // Render blocking JS to fix theme flickering:
+      const slParams = window.localStorage.getItem('storylite.parameters');
+      if (slParams) {
+        document.documentElement.dataset.theme = JSON.parse(slParams)?.theme?.value ?? 'auto';
+      }
+    </script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/.storylite/canvas.tsx"></script>
+  </body>
+</html>
diff --git a/index.html b/index.html
@@ -1,31 +1,21 @@
-<html>
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport"
-          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-    <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>Document</title>
-</head>
-<body>
-
-<ul id="list">
-
-</ul>
-
-<script type="module">
-    const htmls = Object.keys(import.meta.glob('./pkg-tests/*.html'));
-    const $ul = document.getElementById('list');
-
-    for (const htmlLink of htmls) {
-      const $li = document.createElement('li');
-      const $a = document.createElement('a');
-      $a.href = htmlLink;
-      console.log(htmlLink);
-      $a.innerText = htmlLink.slice('./pkg-tests/'.length, htmlLink.length - '.html'.length);
-      $li.appendChild($a)
-      $ul.appendChild($li);
-    }
-</script>
-
-</body>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/logo.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>StoryLite - Design System (React)</title>
+    <script src="https://cdn.jsdelivr.net/npm/@iiif/[email protected]/dist/index.umd.js"></script>
+    <script>
+      // Render blocking JS to fix theme flickering:
+      const slParams = window.localStorage.getItem('storylite.parameters');
+      if (slParams) {
+        document.documentElement.dataset.theme = JSON.parse(slParams)?.theme?.value ?? 'auto';
+      }
+    </script>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/.storylite/index.tsx"></script>
+  </body>
 </html>
diff --git a/package.json b/package.json
@@ -1,51 +1,51 @@
 {
   "name": "@atlas-viewer/atlas",
   "version": "2.1.1",
-  "main": "dist/bundle/cjs/index.js",
-  "module": "dist/bundle/esm/index.mjs",
-  "web": "dist/index.umd.js",
-  "types": "dist/types/index.d.ts",
+  "bugs": "https://github.com/atlas-viewer/atlas/issues",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/atlas-viewer/atlas"
+  },
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "web": "dist/index.global.js",
+  "types": "dist/index.d.ts",
   "author": "Stephen Fraser <[email protected]>",
   "license": "MIT",
   "files": [
-    "dist",
-    "lib"
+    "dist"
   ],
   "exports": {
     ".": {
-      "require": "./dist/bundle/cjs/index.js",
-      "import": "./dist/bundle/esm/index.mjs",
-      "default": "./dist/bundle/cjs/index.js",
-      "types": "./dist/types/index.d.ts"
-    }
-  },
-  "typesVersions": {
-    "*": {
-      "*": [
-        "dist/types/index.d.ts"
-      ]
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      },
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      }
     }
   },
   "scripts": {
-    "build": "NODE_ENV=production node vite/build.mjs && tsc -p ./tsconfig.dist.json --emitDeclarationOnly",
-    "start": "vite",
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "prepack": "tsup",
+    "lint": "publint",
+    "storybook": "vite",
     "test": "vitest",
-    "idea-test": "vitest --watch --reporter=dot --reporter=json --outputFile=.vitest-result.json",
-    "storybook": "start-storybook -p 6007",
-    "build-types": "tsc -p ./tsconfig.dist.json --emitDeclarationOnly",
-    "prepublishOnly": "NODE_ENV=production node vite/build.mjs && tsc -p ./tsconfig.dist.json --emitDeclarationOnly && cp ./experimental/web-components.js ./dist/web-components.js"
-  },
-  "resolutions": {
-    "@atlas-viewer/iiif-image-api": "^2.0.5"
+    "build-vite": "vite build",
+    "idea-test": "vitest --watch --reporter=dot --reporter=json --outputFile=.vitest-result.json"
   },
   "dependencies": {
     "@atlas-viewer/dna": "^0.5.0",
-    "@atlas-viewer/iiif-image-api": "^2.0.5",
+    "@atlas-viewer/iiif-image-api": "^2.2.0",
     "@iiif/presentation-3": ">=2",
-    "@iiif/helpers": "^1.0.3",
-    "@iiif/parser": "2.0.1",
+    "@iiif/helpers": "^1.1.0",
+    "@iiif/parser": "^2.1.0",
     "lru-cache": "^7.17.0",
-    "nanoid": "^3.1.9",
+    "nanoid": "^5.0.7",
     "normalize-wheel": "^1.0.1",
     "react-reconciler": "^0.29.0",
     "react-use-measure": "^2.0.1",
@@ -55,31 +55,19 @@
     "react": ">=17.0",
     "react-dom": ">=17.0"
   },
+  "sideEffects": false,
   "devDependencies": {
-    "@babel/core": "^7.18.6",
+    "@storylite/storylite": "^0.15.1",
+    "@storylite/vite-plugin": "^0.15.0",
     "@iiif/presentation-3-normalized": "^0.9.7",
-    "@storybook/addon-actions": "^6.5.9",
-    "@storybook/addon-essentials": "^6.5.9",
-    "@storybook/addon-links": "^6.5.9",
-    "@storybook/builder-webpack5": "^6.5.9",
-    "@storybook/core": "^6.5.9",
-    "@storybook/manager-webpack5": "^6.5.9",
-    "@storybook/react": "^6.5.9",
-    "@types/nanoid": "^2.1.0",
-    "@types/node": "~16.11.7",
+    "@types/nanoid": "^3.0.0",
+    "@types/node": "~18",
     "@types/react": "^18.0.28",
     "@types/react-dom": "^18.0.11",
     "@types/react-reconciler": "^0.28.8",
     "@types/scheduler": "^0.16.2",
-    "@types/stats.js": "^0.17.0",
-    "@typescript-eslint/eslint-plugin": "^5.4.0",
-    "@typescript-eslint/parser": "^5.4.0",
     "@vitejs/plugin-react": "^1.3.2",
-    "eslint": "^8.2.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react-hooks": "^4.3.0",
     "happy-dom": "^6.0.3",
-    "leva": "^0.9.34",
     "prettier": "^2.4.1",
     "react": ">=17.0",
     "react-16": "npm:react@16",
@@ -90,14 +78,13 @@
     "react-dom-17": "npm:react-dom@17",
     "react-dom-18": "npm:react-dom@18",
     "react-is": "^16.13.1",
-    "stats.js": "^0.17.0",
-    "ts-loader": "^9.3.1",
-    "tslib": "^2.3.1",
+    "tslib": "^2.6.2",
     "typesafe-actions": "^5.1.0",
-    "typescript": "^4.5.2",
-    "vite": "^2.9.14",
-    "vitest": "^0.18.0",
-    "webpack": "~5.73.0"
+    "typescript": "^5.4.4",
+    "vite": "^5.2.8",
+    "vitest": "^1.4.0",
+    "publint": "^0.2.7",
+    "tsup": "^8.0.2"
   },
   "peerDependenciesMeta": {
     "react-dom": {