refactor

package.json

@@ -2,8 +2,8 @@
   "name": "lite-emoji-picker",
   "version": "1.0.0",
   "description": "Lightweight emoji picker based on IndexedDB",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.es.js",
+  "main": "dist/cjs/index.js",
+  "module": "dist/es/index.js",
   "files": [
     "dist"
   ],

rollup.config.js

@@ -3,7 +3,6 @@ import resolve from 'rollup-plugin-node-resolve'
 import svelte from 'rollup-plugin-svelte'
 
 const baseConfig = {
-  input: './src/index.js',
   plugins: [
     resolve(),
     cjs(),
@@ -11,19 +10,19 @@ const baseConfig = {
   ]
 }
 
-export default [
+const formats = ['es', 'cjs']
+const entryPoints = [
   {
-    ...baseConfig,
-    output: {
-      file: 'dist/index.cjs.js',
-      format: 'cjs'
-    }
-  },
-  {
-    ...baseConfig,
-    output: {
-      file: 'dist/index.es.js',
-      format: 'es'
-    }
+    input: './src/index.js',
+    output: 'index.js'
   }
 ]
+
+export default formats.map(format => (entryPoints.map(({ input, output }) => ({
+  ...baseConfig,
+  input,
+  output: {
+    format,
+    file: `dist/${format}/${output}`
+  }
+})))).flat()

src/index.js

@@ -1 +1,5 @@
-export * from './database'
+import Picker from './svelte/Picker.svelte'
+export {
+  Picker
+}
+export * from './database/database.js'

src/svelte/Picker.svelte

@@ -0,0 +1,19 @@
+<section
+    class="lite-emoji-picker"
+    aria-label={i18n.sectionLabel}>
+  <div role="tablist" aria-label={i18n.categories}></div>
+  <div>
+    <input id="lite-emoji-picker-search" type="text">
+    <label class="sr-only" for="lite-emoji-picker-search">{i18n.search}</label>
+  </div>
+  <div role="tabpanel" aria-label="Emoji">
+
+  </div>
+</section>
+<script>
+export let i18n = {
+  sectionLabel: 'Emoji picker',
+  categories: 'Categories',
+  search: 'Search emoji'
+}
+</script>