feat(build): provide un-bundled element by default (bundled version s…

…till available in dist folder) (#1065) * build: remove minify and optimization for drawtools and geosearch * build: update output structure to reflect src structure * fix: update drawtools import in agri e2e test * fix: use src folder for npm package, without any vite intervention * add: elements-styles package * chore: revert drawtools vite config * fix: revert geosearch vite config * fix: update agri e2e import * fix: serve e2e test with vite * chore: update package lock * chore(test): clean up e2e test setup * chore: remove old e2e tests * chore(deps): link elements-utils package * chore(deps): adding peer dependencies * chore: add src folder to published package, set src/main as main entry file * chore(deps): remove glob package * chore: remove test folders from published packages * chore: use package imports instead of relative links in preview.js * chore(docs): changes for plugin import, explain dist bundle * chore: update package.json --------- Co-authored-by: silvester-pari <[email protected]>
EOX-A · Oct 17, 2024 · 333e324 · 333e324
1 parent e88e875
commit 333e324
Show file tree

Hide file tree

Showing 49 changed files with 1,768 additions and 3,854 deletions.
diff --git a/.storybook/preview.js b/.storybook/preview.js
@@ -2,18 +2,18 @@ import { setCustomElementsManifest } from "@storybook/web-components";
 import customElements from "../custom-elements.json";
 import DocumentationTemplate from "./DocumentationTemplate.mdx";
 
-import "../elements/chart/src/main.js";
-import "../elements/drawtools/src/main.js";
-import "../elements/geosearch/src/main.js";
-import "../elements/itemfilter/src/main.js";
-import "../elements/jsonform/src/main.js";
-import "../elements/layercontrol/src/main.js";
-import "../elements/layout/src/main.js";
-import "../elements/map/src/main.js";
-import "../elements/map/src/plugins/advancedLayersAndSources/index";
-import "../elements/stacinfo/src/main.js";
-import "../elements/storytelling/src/main.js";
-import "../elements/timecontrol/src/main.js";
+import "@eox/chart";
+import "@eox/drawtools";
+import "@eox/geosearch";
+import "@eox/itemfilter";
+import "@eox/jsonform";
+import "@eox/layercontrol";
+import "@eox/layout";
+import "@eox/map";
+import "@eox/map/src/plugins/advancedLayersAndSources";
+import "@eox/stacinfo";
+import "@eox/storytelling";
+import "@eox/timecontrol";
 
 /**
  * A custom wrapper for the default setCustomElementsManifest function.

diff --git a/cypress/e2e/agri.cy.js b/cypress/e2e/agri.cy.js
diff --git a/cypress/e2e/agri.html b/cypress/e2e/agri.html
diff --git a/elements/chart/README.md b/elements/chart/README.md
@@ -9,8 +9,12 @@ npm install @eox/chart
 ```
 
 ```
+// for setups with bundlers e.g. Vite
 import "@eox/chart"
 
+// or, for e.g. single HTML files without bundler
+import "@eox/chart/dist/eox-chart.js"
+
 <eox-chart></eox-chart>
 ```
 

diff --git a/elements/chart/package.json b/elements/chart/package.json
@@ -11,14 +11,15 @@
   },
   "files": [
     "dist",
-    "test"
+    "src"
   ],
-  "main": "./dist/eox-chart.js",
+  "main": "./src/main.js",
   "scripts": {
     "build": "vite build",
     "watch": "vite build --watch"
   },
   "dependencies": {
+    "@eox/elements-utils": "^0.0.1",
     "deepmerge-ts": "^7.1.3",
     "lit": "^3.0.2",
     "vega": "^5.30.0",

diff --git a/elements/chart/src/main.js b/elements/chart/src/main.js
@@ -1,7 +1,7 @@
 import { LitElement, html } from "lit";
 import { style } from "./style";
 import { styleEOX } from "./style.eox";
-import allStyle from "../../../utils/styles/dist/all.style";
+import allStyle from "@eox/elements-utils/styles/dist/all.style";
 import { renderChartMethod } from "./methods/render";
 
 /**

diff --git a/elements/drawtools/README.md b/elements/drawtools/README.md
@@ -7,8 +7,12 @@ npm install @eox/drawtools
 ```
 
 ```
+// for setups with bundlers e.g. Vite
 import "@eox/drawtools"
 
+// or, for e.g. single HTML files without bundler
+import "@eox/drawtools/dist/eox-drawtools.js"
+
 <eox-drawtools></eox-drawtools>
 ```
 

diff --git a/elements/drawtools/package.json b/elements/drawtools/package.json
@@ -12,14 +12,15 @@
   },
   "files": [
     "dist",
-    "test"
+    "src"
   ],
-  "main": "./dist/eox-drawtools.js",
+  "main": "./src/main.js",
   "scripts": {
     "build": "vite build",
     "watch": "vite build --watch"
   },
   "dependencies": {
+    "@eox/elements-utils": "^0.0.1",
     "lit": "^3.0.2"
   }
 }
diff --git a/elements/drawtools/src/components/controller.js b/elements/drawtools/src/components/controller.js
@@ -1,7 +1,7 @@
 import { LitElement, html, nothing } from "lit";
 import { updateButtonStatesMethod } from "../methods/controller";
-import buttonStyle from "../../../../utils/styles/dist/button.style";
-import inputStyle from "../../../../utils/styles/dist/input.style";
+import buttonStyle from "@eox/elements-utils/styles/dist/button.style";
+import inputStyle from "@eox/elements-utils/styles/dist/input.style";
 import { copyTextToClipboard } from "../helpers/index.js";
 import { when } from "lit/directives/when.js";
 

diff --git a/elements/drawtools/src/components/list.js b/elements/drawtools/src/components/list.js
@@ -6,7 +6,7 @@ import {
   hoverFeatureMethod,
   selectAndDeselectFeatureMethod,
 } from "../methods/list";
-import listStyle from "../../../../utils/styles/dist/list.style";
+import listStyle from "@eox/elements-utils/styles/dist/list.style";
 
 /**
  * Display list of features

diff --git a/elements/drawtools/src/main.js b/elements/drawtools/src/main.js
@@ -8,7 +8,7 @@ import {
   discardDrawingMethod,
   emitDrawnFeaturesMethod,
 } from "./methods/draw";
-import mainStyle from "../../../utils/styles/dist/main.style";
+import mainStyle from "@eox/elements-utils/styles/dist/main.style";
 import { DUMMY_GEO_JSON } from "./enums/index.js";
 import {
   initMapDragDropImport,

diff --git a/elements/drawtools/src/methods/draw/init-layer.js b/elements/drawtools/src/methods/draw/init-layer.js
@@ -1,6 +1,6 @@
 import { onDrawEndMethod } from "./";
 
-import { getElement } from "../../../../../utils";
+import { getElement } from "@eox/elements-utils";
 
 /**
  * Initializes the draw layer, interacts with the map, and returns map instances.

diff --git a/elements/geosearch/README.md b/elements/geosearch/README.md
@@ -1,11 +1,27 @@
-# EOxGeoSearch
+# Geo Search
 
 An autocompleted search input for geographic locations.
 
 The element comes with a configurable button mode which can be enabled with the boolean attributes `button` and, additionally, `small`, to use the button in a map toolbar.
 
 Real-time OpenCage API access is enabled by setting the `endpoint` attribute. Optionally, a `limit` attribute may be set to restrict the number of fetched locations.
 
+## Usage
+
+```
+npm install @eox/geosearch
+```
+
+```
+// for setups with bundlers e.g. Vite
+import "@eox/geosearch"
+
+// or, for e.g. single HTML files without bundler
+import "@eox/geosearch/dist/eox-geosearch.js"
+
+<eox-geosearch></eox-geosearch>
+```
+
 ## Configuration
 
 Furthermore, the alignment of the input and search results can be configured to align straight or in a 90-degree angle in any direction with the `input-direction` and `results-direction` attributes and the following directions:
@@ -28,3 +44,11 @@ To style the component, the following CSS variables are supported:
 ## Screenshots/Videos
 
 ![Screen Recording 2024-05-21 at 12 11 02](https://github.com/EOX-A/EOxElements/assets/94269527/5d207fbb-6abf-42d5-b053-74ad4e75f930)
+
+## Development
+
+For a development setup, please check the [root-level readme](../../README.md).
+
+## Changelog
+
+Created automatically [here](./CHANGELOG.md)
diff --git a/elements/geosearch/package.json b/elements/geosearch/package.json
@@ -2,15 +2,15 @@
   "name": "@eox/geosearch",
   "version": "0.3.0",
   "type": "module",
-  "main": "./dist/eox-geosearch.js",
   "engines": {
     "npm": ">=8.0.0",
     "node": ">=18.0.0"
   },
   "files": [
     "dist",
-    "test"
+    "src"
   ],
+  "main": "./src/main.js",
   "scripts": {
     "build": "vite build",
     "watch": "vite build --watch"
@@ -21,8 +21,9 @@
     "vite": "^5.2.11"
   },
   "dependencies": {
+    "@eox/elements-utils": "^0.0.1",
     "lit": "^3.1.3",
-    "proj4": "^2.11.0",
-    "lodash.debounce": "^4.0.8"
+    "lodash.debounce": "^4.0.8",
+    "proj4": "^2.11.0"
   }
 }
diff --git a/elements/geosearch/src/main.js b/elements/geosearch/src/main.js
@@ -3,11 +3,11 @@ import { unsafeSVG } from "lit/directives/unsafe-svg.js";
 import proj4 from "proj4";
 import _debounce from "lodash.debounce";
 
-import mainStyle from "../../../utils/styles/dist/main.style";
-import buttonStyle from "../../../utils/styles/dist/button.style";
+import mainStyle from "@eox/elements-utils/styles/dist/main.style";
+import buttonStyle from "@eox/elements-utils/styles/dist/button.style";
 import { styleEOX } from "./style.eox";
 
-import { getElement } from "../../../utils/getElement";
+import { getElement } from "@eox/elements-utils";
 
 const loaderSvg = `
   <svg

diff --git a/elements/geosearch/src/style.eox.js b/elements/geosearch/src/style.eox.js
@@ -1,5 +1,4 @@
 import { css } from "lit";
-// import { button } from "../../utils/styles/button";
 
 export const styleEOX = css`
   .geosearch {

diff --git a/elements/itemfilter/README.md b/elements/itemfilter/README.md
@@ -7,8 +7,12 @@ npm install @eox/itemfilter
 ```
 
 ```
+// for setups with bundlers e.g. Vite
 import "@eox/itemfilter"
 
+// or, for e.g. single HTML files without bundler
+import "@eox/itemfilter/dist/eox-itemfilter.js"
+
 <eox-itemfilter></eox-itemfilter>
 ```
 

diff --git a/elements/itemfilter/package.json b/elements/itemfilter/package.json
@@ -13,14 +13,15 @@
   },
   "files": [
     "dist",
-    "test"
+    "src"
   ],
-  "main": "./dist/eox-itemfilter.js",
+  "main": "./src/main.js",
   "scripts": {
     "build": "vite build",
     "watch": "vite build --watch"
   },
   "dependencies": {
+    "@eox/elements-utils": "^0.0.1",
     "@floating-ui/dom": "^1.6.8",
     "@turf/boolean-intersects": "^7.0.0",
     "@turf/boolean-within": "^7.0.0",
@@ -30,5 +31,8 @@
     "lodash.flatmap": "^4.5.0",
     "lodash.uniq": "^4.5.0",
     "toolcool-range-slider": "^4.0.27"
+  },
+  "peerDependencies": {
+    "@eox/map": "^1.15.0"
   }
 }