New style Shadow DOM

__mocks__/fileMock.js

@@ -1,3 +1,3 @@
 
-module.exports = '// mocked-file-content';
+module.exports = {};
 

babel.config.js

@@ -0,0 +1,20 @@
+module.exports = {
+  presets: [
+      ['@babel/preset-env', {
+          targets: {
+            browsers: ['> 1%', 'last 3 versions', 'not dead']
+          },
+          modules: 'commonjs'
+       }],
+    '@babel/preset-typescript'
+  ],
+  plugins: [
+    [
+      'babel-plugin-inline-import', {
+        extensions: [
+          '.ttl'
+        ]
+      }
+    ]
+  ]
+}

declarations.d.ts

@@ -1,3 +1,5 @@
+declare module '*.module.css';
+
 declare module '*.ttl' {
   const content: string;
   export default content;

dev/index.ts

@@ -1,3 +1,5 @@
+import '../src/styles/global.css'
+import '../src/styles/utilities.css'
 import { sym } from 'rdflib'
 import { default as pane } from '../src'
 import { context, fetcher } from './context'

jest.config.mjs → jest.config.js

@@ -1,4 +1,4 @@
-export default {
+module.exports = {
   // verbose: true, // Uncomment for detailed test output
   collectCoverage: true,
   coverageDirectory: 'coverage',
@@ -7,7 +7,7 @@ export default {
     customExportConditions: ['node'],
   },
   transform: {
-    '^.+\\.[tj]sx?$': ['babel-jest', { configFile: './babel.config.mjs' }],
+    '^.+\\.(ts|js)$': ['babel-jest'],
   },
   setupFilesAfterEnv: ["./test/helpers/jest.setup.ts"],
   transformIgnorePatterns: ["/node_modules/(?!lit-html).+\\.js"],
@@ -17,8 +17,9 @@ export default {
   },
   roots: ['<rootDir>/src', '<rootDir>/test', '<rootDir>/__mocks__'],
   moduleNameMapper: {
+    '\\.module\\.css$': 'identity-obj-proxy',
+    '\\.css$': '<rootDir>/__mocks__/fileMock.js',
     '^SolidLogic$': 'solid-logic',
     '^\\$rdf$': 'rdflib'
   }
-}
-
+}