Upgrade ol, Don't import from barrel files openlayers/openlayers#16461

Author: m-mohr

docs/options.md

@@ -340,6 +340,7 @@ If the option `useTileLayerAsFallback` is set to `true`, the tile server is only
 `buildTileUrlTemplate` is disabled by default (i.e. set to `null`) since v3.4.0.
 
 You can enable this option by providing a function with a single parameter that returns a tile server template url.
+The given function can optionally be async (i.e. return a Promise).
 The parameter passed into the function is an [Asset object](https://m-mohr.github.io/stac-js/latest/#asset) as defined in stac-js.
 
 **Example**:

package-lock.json

@@ -51,8 +51,8 @@
     "core-js": "^3.6.5",
     "node-polyfill-webpack-plugin": "^2.0.0",
     "oidc-client-ts": "^3.0.1",
-    "ol": "^10.3.1",
-    "ol-stac": "^1.0.0-rc.6",
+    "ol": "~10.4.0",
+    "ol-stac": "^1.0.0-rc.7",
     "proj4": "^2.15.0",
     "remove-markdown": "^0.5.0",
     "stac-js": "~0.1.4",

package.json

@@ -28,20 +28,14 @@ import TextControl from './maps/TextControl.vue';
 import { mapGetters } from 'vuex';
 import { BPopover } from 'bootstrap-vue';
 import proj4 from 'proj4';
-import {register} from 'ol/proj/proj4.js';
 import Select from 'ol/interaction/Select';
+import {register} from 'ol/proj/proj4.js';
 import StacLayer from 'ol-stac';
-import { getStacObjectsForEvent } from 'ol-stac/util.js';
-import { Stroke, Style } from 'ol/style.js';
+import { getStacObjectsForEvent, getStyle } from 'ol-stac/util.js';
 
 register(proj4); // required to support source reprojection
 
-const selectStyle = new Style({
-  stroke: new Stroke({
-      color: '#ff0000',
-      width: 2,
-  }),
-});
+const selectStyle = getStyle('#ff0000', 2, null);
 
 export default {
   name: 'Map',

src/components/Map.vue

@@ -1,4 +1,4 @@
-import { Control } from 'ol/control.js';
+import Control from 'ol/control/Control.js';
 
 export default {
   props: {

src/components/maps/ControlMixin.js

@@ -22,7 +22,7 @@ import Style, { createDefaultStyle } from 'ol/style/Style';
 import proj4 from 'proj4';
 import VectorSource from 'ol/source/Vector';
 import GeoJSON from 'ol/format/GeoJSON';
-import { Fill } from 'ol/style';
+import Fill from 'ol/style/Fill';
 import VectorLayer from 'ol/layer/Vector';
 import create from 'stac-js';
 import { toGeoJSON } from 'stac-js/src/geo.js';

src/components/maps/MapSelect.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script>
-import { Point } from 'ol/geom';
+import Point from 'ol/geom/Point';
 import ControlMixin from './ControlMixin';
 import { fromLonLat } from 'ol/proj';
 import { BIconPinMapFill } from 'bootstrap-vue';