@arcgis/map-components 5.1.0-next.74 → 5.1.0-next.76
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cdn/5CKHTWHC.js +2 -0
- package/dist/cdn/6D72H6LD.js +2 -0
- package/dist/cdn/AG7LUCV3.js +2 -0
- package/dist/cdn/APYGTRF2.js +2 -0
- package/dist/cdn/CUYGLJRU.js +2 -0
- package/dist/cdn/G7KHJU6J.js +2 -0
- package/dist/cdn/HL4M23YL.js +2 -0
- package/dist/cdn/MNXYDKVS.js +2 -0
- package/dist/cdn/PP7ZT3L2.js +2 -0
- package/dist/cdn/QW4QGAIG.js +2 -0
- package/dist/cdn/SD7DMWPD.js +2 -0
- package/dist/cdn/{KGLUFWJ7.js → T66WG4I4.js} +1 -1
- package/dist/cdn/V2HLEYHF.js +3 -0
- package/dist/cdn/WO2BX7U2.js +2 -0
- package/dist/cdn/XOTOQOK6.js +2 -0
- package/dist/cdn/YFXHW7I2.js +2 -0
- package/dist/cdn/YLKEVZLN.js +2 -0
- package/dist/cdn/index.js +1 -1
- package/dist/chunks/resources.js +35 -0
- package/dist/chunks/slots.js +12 -40
- package/dist/chunks/useArcgisViewReadyError.js +20 -19
- package/dist/chunks/video-utils.js +12 -0
- package/dist/components/arcgis-feature/customElement.js +75 -53
- package/dist/components/arcgis-feature-media/customElement.js +222 -211
- package/dist/components/arcgis-feature-relationship/customElement.js +69 -68
- package/dist/components/arcgis-features/customElement.d.ts +2 -2
- package/dist/components/arcgis-features/customElement.js +44 -44
- package/dist/components/arcgis-link-chart/customElement.js +2 -1
- package/dist/components/arcgis-map/customElement.js +7 -6
- package/dist/components/arcgis-popup/customElement.d.ts +2 -2
- package/dist/components/arcgis-presentation/customElement.js +256 -109
- package/dist/components/arcgis-presentation/index.js +1 -0
- package/dist/components/arcgis-presentation-captions/customElement.js +37 -0
- package/dist/components/arcgis-presentation-captions/index.js +1 -0
- package/dist/components/arcgis-scene/customElement.js +2 -1
- package/dist/components/arcgis-slider-scale-range/customElement.js +8 -8
- package/dist/components/arcgis-video/customElement.js +10 -9
- package/dist/components/arcgis-video-player/customElement.js +22 -21
- package/dist/components/arcgis-video-player-action-bar/customElement.js +14 -17
- package/dist/docs/api.json +1 -1
- package/dist/docs/docs.json +1 -1
- package/dist/docs/web-types.json +1 -1
- package/dist/loader.js +2 -1
- package/package.json +5 -5
- package/dist/cdn/5EAOM22D.js +0 -2
- package/dist/cdn/7J7GJZ35.js +0 -2
- package/dist/cdn/AHDX7DZE.js +0 -2
- package/dist/cdn/CQCKW6L4.js +0 -2
- package/dist/cdn/EXZFAJW4.js +0 -3
- package/dist/cdn/GHSQJ4UC.js +0 -2
- package/dist/cdn/NYCLIJ7T.js +0 -2
- package/dist/cdn/OPXYBLHE.js +0 -2
- package/dist/cdn/QPMWCCXQ.js +0 -2
- package/dist/cdn/UPVWARLK.js +0 -2
- package/dist/cdn/YCM6SOEX.js +0 -2
- package/dist/cdn/YCN7F3YY.js +0 -2
- package/dist/cdn/Z4OSJFVK.js +0 -2
|
@@ -1,36 +1,37 @@
|
|
|
1
1
|
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
|
|
2
|
-
import { c as
|
|
3
|
-
import { css as
|
|
2
|
+
import { c as k } from "../../chunks/runtime.js";
|
|
3
|
+
import { css as H, html as o } from "lit";
|
|
4
4
|
import { keyed as P } from "lit/directives/keyed.js";
|
|
5
5
|
import { debounce as $ } from "@arcgis/toolkit/function";
|
|
6
|
-
import { LitElement as
|
|
6
|
+
import { LitElement as K, renderElement as D, safeClassMap as x } from "@arcgis/lumina";
|
|
7
7
|
import { templateHasKey as E, stripHTML as N } from "@arcgis/core/applications/Components/stringUtils.js";
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import S from "@arcgis/core/
|
|
8
|
+
import { renderingSanitizer as O } from "@arcgis/core/applications/Components/sanitizerUtils.js";
|
|
9
|
+
import { isRelatableFeatureSupportedLayer as W, findRelatedLayer as z } from "@arcgis/core/applications/Components/featureUtils.js";
|
|
10
|
+
import { substitute as Z, formatNumber as M } from "@arcgis/core/intl.js";
|
|
11
|
+
import { watch as f, on as G } from "@arcgis/core/core/reactiveUtils.js";
|
|
12
|
+
import { o as J } from "../../chunks/feature-utils.js";
|
|
13
|
+
import S from "@arcgis/core/core/Collection.js";
|
|
14
|
+
import V from "@arcgis/core/rest/support/RelationshipQuery.js";
|
|
14
15
|
import { ignoreAbortErrors as q } from "@arcgis/core/core/promiseUtils.js";
|
|
15
|
-
import { classes as
|
|
16
|
-
import { createRef as
|
|
17
|
-
import
|
|
18
|
-
const
|
|
16
|
+
import { classes as Q } from "@arcgis/toolkit/dom";
|
|
17
|
+
import { createRef as U, ref as X } from "lit/directives/ref.js";
|
|
18
|
+
import Y from "@arcgis/core/popup/Feature.js";
|
|
19
|
+
const ee = H`:host{position:relative;flex:1 1 auto}.list{min-height:var(--calcite-spacing-xxxl)}.list-item-hidden{display:none}.feature-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.sticky-loading-container{display:flex;position:sticky;bottom:var(--calcite-spacing-sm);align-items:center;justify-content:center;z-index:2;margin:0;padding:0;height:var(--calcite-spacing-xxxl);pointer-events:none}`, te = (g) => {
|
|
19
20
|
const e = [];
|
|
20
21
|
if (g.formTemplate) {
|
|
21
22
|
const { description: t, title: r } = g.formTemplate;
|
|
22
|
-
g.fields?.forEach((
|
|
23
|
-
const
|
|
24
|
-
(
|
|
23
|
+
g.fields?.forEach((i) => {
|
|
24
|
+
const s = r && E(r, i.name), a = t && E(t, i.name);
|
|
25
|
+
(s || a) && e.push(i.name);
|
|
25
26
|
});
|
|
26
27
|
}
|
|
27
28
|
return e;
|
|
28
29
|
}, L = 100;
|
|
29
|
-
class
|
|
30
|
+
class re extends K {
|
|
30
31
|
constructor() {
|
|
31
32
|
super(...arguments), this._increaseFeaturePage = () => {
|
|
32
|
-
const { state: e, showAllEnabled: t, relatedFeatures: r, featuresPerPage:
|
|
33
|
-
e === "ready" && t && r.length >=
|
|
33
|
+
const { state: e, showAllEnabled: t, relatedFeatures: r, featuresPerPage: i, featurePage: s } = this;
|
|
34
|
+
e === "ready" && t && r.length >= i * s && this.featurePage++;
|
|
34
35
|
}, this._relatedFeatureIntersectionObserver = new IntersectionObserver(([e]) => {
|
|
35
36
|
e?.isIntersecting && this._increaseFeaturePage();
|
|
36
37
|
}, {
|
|
@@ -60,19 +61,19 @@ class te extends H {
|
|
|
60
61
|
!this.featureCount || this.relatedLayer?.type === "subtype-group" && !this.activeCategory || (this.relatedFeatureViewModels.destroyAll(), this.featurePage = 1, t.destroyAll(), t.addMany(this._sliceFeatures(await this._queryRelatedFeatures({ signal: e?.signal }))));
|
|
61
62
|
}, this._addFlowItem = (e) => {
|
|
62
63
|
e && this.flowItems?.push(e);
|
|
63
|
-
}, this._relatedFeatureIntersectionObserverNode =
|
|
64
|
+
}, this._relatedFeatureIntersectionObserverNode = U(), this.relatedFeatures = new S(), this._queryAbortController = null, this._queryPageAbortController = null, this._queryFeatureCountAbortController = null, this.featureCount = 0, this._loaded = !1, this.relatedFeatureViewModels = new S(), this.autoDestroyDisabled = !1, this.featuresPerPage = 10, this.flowType = "feature-relationship", this.headingLevel = 2, this.hideHeading = !1, this.hideDescription = !1, this.showAllEnabled = !1;
|
|
64
65
|
}
|
|
65
66
|
static {
|
|
66
67
|
this.properties = { allCategories: 16, _queryAbortController: 16, _queryPageAbortController: 16, _queryFeatureCountAbortController: 16, featureCount: 16, _loaded: 16, canLoad: 16, canQuery: 16, displayShowAllButton: 16, displayListItems: 16, categories: 16, itemDescriptionFieldName: 16, relatedFeatureViewModels: 16, state: 16, autoDestroyDisabled: 5, allItemsDescription: 32, featurePage: 9, featuresPerPage: 9, flowItems: 0, flowType: 1, headingLevel: 9, messages: 0, heading: 1, description: 1, values: 0, activeCategory: 0, hideHeading: 5, hideDescription: 5, displayCount: 9, graphic: 0, layer: 0, map: 0, view: 0, spatialReference: 0, timeZone: 1, orderByFields: 0, relationshipId: 9, showAllEnabled: 5, label: 3 };
|
|
67
68
|
}
|
|
68
69
|
static {
|
|
69
|
-
this.styles =
|
|
70
|
+
this.styles = ee;
|
|
70
71
|
}
|
|
71
72
|
get orderByFieldsFixedCasing() {
|
|
72
73
|
const { orderByFields: e, relatedLayer: t } = this;
|
|
73
74
|
return e && t?.loaded ? e.map((r) => {
|
|
74
|
-
const
|
|
75
|
-
return
|
|
75
|
+
const i = r.clone();
|
|
76
|
+
return i.field = J(r.field, t), i;
|
|
76
77
|
}) : e ?? [];
|
|
77
78
|
}
|
|
78
79
|
get supportsCacheHint() {
|
|
@@ -91,8 +92,8 @@ class te extends H {
|
|
|
91
92
|
const { layer: e, map: t, relationship: r } = this;
|
|
92
93
|
if (!e?.loaded || !t || !r)
|
|
93
94
|
return null;
|
|
94
|
-
const
|
|
95
|
-
return
|
|
95
|
+
const i = e.type === "subtype-sublayer" && e.parent && W(e.parent) ? e.parent : e;
|
|
96
|
+
return z(t, i, r) ?? null;
|
|
96
97
|
}
|
|
97
98
|
get relatedLayerKeyField() {
|
|
98
99
|
const { relatedLayer: e, relationshipId: t } = this;
|
|
@@ -121,8 +122,8 @@ class te extends H {
|
|
|
121
122
|
return !!this.relatedLayer && !!this.relationship && this.relationshipId != null && this.objectId != null && !!e?.supportsCount && e?.supportsPagination;
|
|
122
123
|
}
|
|
123
124
|
get displayShowAllButton() {
|
|
124
|
-
const { showAllEnabled: e, featureCount: t, displayCount: r, state:
|
|
125
|
-
return !e &&
|
|
125
|
+
const { showAllEnabled: e, featureCount: t, displayCount: r, state: i, allCategoriesCount: s } = this, a = !!s && (s > r || r === 0), n = !!t && (t > r || r === 0);
|
|
126
|
+
return !e && i === "ready" && (a || n);
|
|
126
127
|
}
|
|
127
128
|
get displayListItems() {
|
|
128
129
|
const { relatedFeatures: e, allCategoriesCount: t } = this;
|
|
@@ -136,21 +137,21 @@ class te extends H {
|
|
|
136
137
|
return this.orderByFieldsFixedCasing[0]?.field || null;
|
|
137
138
|
}
|
|
138
139
|
get state() {
|
|
139
|
-
const { _queryAbortController: e, _queryFeatureCountAbortController: t, _queryPageAbortController: r, canQuery:
|
|
140
|
-
return t || a && !
|
|
140
|
+
const { _queryAbortController: e, _queryFeatureCountAbortController: t, _queryPageAbortController: r, canQuery: i, _loaded: s, canLoad: a } = this;
|
|
141
|
+
return t || a && !s ? "loading" : e || r ? "querying" : i ? "ready" : "disabled";
|
|
141
142
|
}
|
|
142
143
|
get allItemsDescription() {
|
|
143
|
-
const { messages: e, featureCount: t, allCategories: r, allCategoriesCount:
|
|
144
|
+
const { messages: e, featureCount: t, allCategories: r, allCategoriesCount: i } = this;
|
|
144
145
|
return Z(e?.numberRecords ?? "", {
|
|
145
|
-
number:
|
|
146
|
+
number: M(r ? i : t)
|
|
146
147
|
});
|
|
147
148
|
}
|
|
148
149
|
get featurePage() {
|
|
149
150
|
return this._featurePage;
|
|
150
151
|
}
|
|
151
152
|
set featurePage(e) {
|
|
152
|
-
const { featuresPerPage: t, featureCount: r } = this,
|
|
153
|
-
this._featurePage = Math.min(Math.max(e,
|
|
153
|
+
const { featuresPerPage: t, featureCount: r } = this, i = 1, s = Math.ceil(r / t) || 1;
|
|
154
|
+
this._featurePage = Math.min(Math.max(e, i), s);
|
|
154
155
|
}
|
|
155
156
|
get heading() {
|
|
156
157
|
const { activeCategory: e } = this;
|
|
@@ -187,7 +188,7 @@ class te extends H {
|
|
|
187
188
|
f(() => [this.featurePage, this.showAllEnabled], () => this._queryPageDebounced()),
|
|
188
189
|
f(() => [this.layer, this.relationshipId, this.objectId, this.canQuery, this.activeCategory], () => this._queryFeatureCountDebounced(), { initial: !0 }),
|
|
189
190
|
f(() => [this.state, this.showAllEnabled, this._relatedFeatureIntersectionObserverNode], () => this._handleRelatedFeatureObserverChange()),
|
|
190
|
-
|
|
191
|
+
G(() => this.relatedFeatures, "change", () => this._setRelatedFeaturesViewModels())
|
|
191
192
|
]), this.manager.onDestroy(() => {
|
|
192
193
|
this.relatedFeatureViewModels.destroyAll(), this.relatedFeatures.destroyAll(), this._cancelQuery(), this._cancelQueryFeatureCount(), this._cancelQueryPage(), this._unobserveRelatedFeatureObserver();
|
|
193
194
|
});
|
|
@@ -195,19 +196,19 @@ class te extends H {
|
|
|
195
196
|
async _queryFeatureCount() {
|
|
196
197
|
const { layer: e, relatedLayer: t } = this;
|
|
197
198
|
await e?.load(), await t?.load();
|
|
198
|
-
const { _queryFeatureCountAbortController: r, activeCategory:
|
|
199
|
-
if (!
|
|
199
|
+
const { _queryFeatureCountAbortController: r, activeCategory: i, canQuery: s, objectId: a, relatedLayerKeyField: n, relationshipId: l, relationshipKey: d, supportsCacheHint: b } = this;
|
|
200
|
+
if (!s || !e || !t || a == null) {
|
|
200
201
|
this.featureCount = 0, this.allCategories = void 0;
|
|
201
202
|
return;
|
|
202
203
|
}
|
|
203
|
-
if (t?.type === "subtype-group" && !
|
|
204
|
+
if (t?.type === "subtype-group" && !i) {
|
|
204
205
|
if (this.featureCount = 0, this.relatedFeatureViewModels.destroyAll(), this.featurePage = 1, this.relatedFeatures.destroyAll(), n && d != null) {
|
|
205
|
-
const { default: F } = await import("@arcgis/core/smartMapping/statistics/uniqueValues.js"), { uniqueValueInfos:
|
|
206
|
+
const { default: F } = await import("@arcgis/core/smartMapping/statistics/uniqueValues.js"), { uniqueValueInfos: v } = await F({
|
|
206
207
|
layer: t,
|
|
207
208
|
sqlWhere: `${n} = '${d}'`,
|
|
208
209
|
field: t.subtypeField ?? void 0,
|
|
209
210
|
signal: r?.signal
|
|
210
|
-
}),
|
|
211
|
+
}), w = v.map(({ count: h, value: y }) => {
|
|
211
212
|
const m = t.subtypes?.find((I) => I.code === y)?.name;
|
|
212
213
|
return y != null && m ? {
|
|
213
214
|
count: h,
|
|
@@ -215,11 +216,11 @@ class te extends H {
|
|
|
215
216
|
name: m
|
|
216
217
|
} : void 0;
|
|
217
218
|
}).filter((h) => h != null);
|
|
218
|
-
this.allCategories =
|
|
219
|
+
this.allCategories = w;
|
|
219
220
|
}
|
|
220
221
|
return;
|
|
221
222
|
}
|
|
222
|
-
const { historicMoment: p, gdbVersion: _ } = e, C = new
|
|
223
|
+
const { historicMoment: p, gdbVersion: _ } = e, C = new V({
|
|
223
224
|
cacheHint: b,
|
|
224
225
|
gdbVersion: _,
|
|
225
226
|
historicMoment: p,
|
|
@@ -233,40 +234,40 @@ class te extends H {
|
|
|
233
234
|
this.allCategories = void 0, this.featureCount = c[a] || 0;
|
|
234
235
|
}
|
|
235
236
|
_getRelationshipWhereClause(e) {
|
|
236
|
-
const { activeCategory: t } = this, r = e.createQuery(),
|
|
237
|
-
return a &&
|
|
237
|
+
const { activeCategory: t } = this, r = e.createQuery(), i = "subtypeField" in e ? e.subtypeField : void 0, s = t && i ? `${i} = ${t.value}` : void 0, a = r.where;
|
|
238
|
+
return a && s ? `(${a}) AND (${s})` : a ?? s;
|
|
238
239
|
}
|
|
239
240
|
_sliceFeatures(e) {
|
|
240
241
|
const { showAllEnabled: t, displayCount: r } = this;
|
|
241
242
|
return t ? e : r ? e.slice(0, r) : [];
|
|
242
243
|
}
|
|
243
244
|
async _queryPage() {
|
|
244
|
-
const { relatedFeatures: e, featurePage: t, showAllEnabled: r, _queryPageAbortController:
|
|
245
|
-
!r || t < 2 || !
|
|
245
|
+
const { relatedFeatures: e, featurePage: t, showAllEnabled: r, _queryPageAbortController: i, featureCount: s } = this;
|
|
246
|
+
!r || t < 2 || !s || this.relatedLayer?.type === "subtype-group" && !this.activeCategory || e.addMany(await this._queryRelatedFeatures({ signal: i?.signal }));
|
|
246
247
|
}
|
|
247
248
|
async _queryRelatedFeatures(e) {
|
|
248
|
-
const { displayCount: t, featureCount: r, featurePage:
|
|
249
|
+
const { displayCount: t, featureCount: r, featurePage: i, featuresPerPage: s, layer: a, orderByFieldsFixedCasing: n, relatedLayer: l, relatedLayerKeyFields: d, relationshipId: b, showAllEnabled: p, supportsCacheHint: _ } = this, { canQuery: C, objectId: c } = this;
|
|
249
250
|
if (!C || !a || !l || c == null)
|
|
250
251
|
return [];
|
|
251
|
-
const F = p ? ((
|
|
252
|
+
const F = p ? ((i - 1) * s + r) % r : 0, v = p ? s : t, w = l.objectIdField, h = "subtypeField" in l ? l.subtypeField : void 0, y = [
|
|
252
253
|
...n.map((u) => u.field),
|
|
253
|
-
...
|
|
254
|
+
...te(l),
|
|
254
255
|
...d,
|
|
255
|
-
|
|
256
|
+
w,
|
|
256
257
|
h
|
|
257
|
-
].filter((u) => u != null), m = n.map((u) => `${u.field} ${u.order}`), { historicMoment: I, gdbVersion:
|
|
258
|
+
].filter((u) => u != null), m = n.map((u) => `${u.field} ${u.order}`), { historicMoment: I, gdbVersion: j } = a, T = new V({
|
|
258
259
|
orderByFields: m,
|
|
259
260
|
start: F,
|
|
260
|
-
num:
|
|
261
|
+
num: v,
|
|
261
262
|
outFields: y,
|
|
262
263
|
cacheHint: _,
|
|
263
264
|
historicMoment: I,
|
|
264
|
-
gdbVersion:
|
|
265
|
+
gdbVersion: j,
|
|
265
266
|
relationshipId: b,
|
|
266
267
|
returnGeometry: !1,
|
|
267
268
|
objectIds: [c],
|
|
268
269
|
where: this._getRelationshipWhereClause(l)
|
|
269
|
-
}), A = (await a.queryRelatedFeatures(
|
|
270
|
+
}), A = (await a.queryRelatedFeatures(T, {
|
|
270
271
|
signal: e?.signal
|
|
271
272
|
}))[c]?.features || [];
|
|
272
273
|
return l.type === "subtype-group" && h ? A.forEach((u) => {
|
|
@@ -300,17 +301,17 @@ class te extends H {
|
|
|
300
301
|
this._relatedFeatureIntersectionObserverNode.value && this._relatedFeatureIntersectionObserver.unobserve(this._relatedFeatureIntersectionObserverNode.value);
|
|
301
302
|
}
|
|
302
303
|
_matchesFeature(e, t) {
|
|
303
|
-
const r = e?.graphic?.getObjectId(),
|
|
304
|
-
return r != null &&
|
|
304
|
+
const r = e?.graphic?.getObjectId(), i = t?.getObjectId();
|
|
305
|
+
return r != null && i != null && r === i;
|
|
305
306
|
}
|
|
306
307
|
_setRelatedFeaturesViewModels() {
|
|
307
|
-
const { relatedFeatures: e, relatedFeatureViewModels: t, map: r, view:
|
|
308
|
+
const { relatedFeatures: e, relatedFeatureViewModels: t, map: r, view: i, spatialReference: s, timeZone: a } = this;
|
|
308
309
|
e?.filter(Boolean).forEach((n) => {
|
|
309
|
-
t.some((d) => this._matchesFeature(d, n)) || t.add(new
|
|
310
|
+
t.some((d) => this._matchesFeature(d, n)) || t.add(new Y({
|
|
310
311
|
abilities: { relationshipContent: !1 },
|
|
311
312
|
map: r,
|
|
312
|
-
view:
|
|
313
|
-
spatialReference:
|
|
313
|
+
view: i,
|
|
314
|
+
spatialReference: s,
|
|
314
315
|
timeZone: a,
|
|
315
316
|
graphic: n
|
|
316
317
|
}));
|
|
@@ -338,15 +339,15 @@ class te extends H {
|
|
|
338
339
|
return o`<calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon>`;
|
|
339
340
|
}
|
|
340
341
|
_renderCategory(e) {
|
|
341
|
-
const { count: t, name: r } = e,
|
|
342
|
-
return o`<calcite-list-item class="list-item" .disabled=${!t} .label=${r} @calciteListItemSelect=${() => this._selectCategory(e)}><calcite-chip .label=${
|
|
342
|
+
const { count: t, name: r } = e, i = M(t);
|
|
343
|
+
return o`<calcite-list-item class="list-item" .disabled=${!t} .label=${r} @calciteListItemSelect=${() => this._selectCategory(e)}><calcite-chip .label=${i} scale=s slot=content-end>${i}</calcite-chip>${this._renderChevronIconNode()}</calcite-list-item>`;
|
|
343
344
|
}
|
|
344
345
|
_renderRelatedFeature(e) {
|
|
345
|
-
const { itemDescriptionFieldName: t, values: r } = this, { formattedAttributes:
|
|
346
|
+
const { itemDescriptionFieldName: t, values: r } = this, { formattedAttributes: i, state: s, heading: a } = e, n = {
|
|
346
347
|
...r,
|
|
347
|
-
...
|
|
348
|
+
...i?.global
|
|
348
349
|
}, l = (t && n?.[t]) ?? "";
|
|
349
|
-
return o`<calcite-list-item class=${x(
|
|
350
|
+
return o`<calcite-list-item class=${x(Q("list-item", { "list-item-hidden": s === "loading" }))} .description=${N(l.toString())} .label=${N(a)} @calciteListItemSelect=${() => this._selectRecord(e)}><div slot=heading .innerHTML=${O.sanitize(a ?? "") ?? ""}></div><div slot=description .innerHTML=${O.sanitize(l ?? "") ?? ""}></div>${this._renderChevronIconNode()}</calcite-list-item>`;
|
|
350
351
|
}
|
|
351
352
|
_renderShowAllListItem() {
|
|
352
353
|
return this.displayShowAllButton ? o`<calcite-list-item .description=${this.allItemsDescription} .label=${this.messages?.showAll} @calciteListItemSelect=${() => this._showAllRecords()}>${this._renderShowAllIconNode()}</calcite-list-item>` : null;
|
|
@@ -355,7 +356,7 @@ class te extends H {
|
|
|
355
356
|
return o`<calcite-notice icon=information kind=brand open scale=s width=full><div slot=message>${this.messages?.noRelatedFeatures}</div></calcite-notice>`;
|
|
356
357
|
}
|
|
357
358
|
_renderFeatureObserver() {
|
|
358
|
-
return o`<div class="feature-observer" ${
|
|
359
|
+
return o`<div class="feature-observer" ${X(this._relatedFeatureIntersectionObserverNode)}></div>`;
|
|
359
360
|
}
|
|
360
361
|
_renderList() {
|
|
361
362
|
const { relatedFeatureViewModels: e, categories: t } = this;
|
|
@@ -363,7 +364,7 @@ class te extends H {
|
|
|
363
364
|
}
|
|
364
365
|
_renderRelatedFeatures() {
|
|
365
366
|
const { displayListItems: e } = this, { state: t } = this;
|
|
366
|
-
return o`<div class=${x(
|
|
367
|
+
return o`<div class=${x(Q("list", {
|
|
367
368
|
"list-querying": t === "querying"
|
|
368
369
|
}))}>${e ? this._renderList() : t === "ready" ? this._renderNoRelatedFeaturesMessage() : null}${this._renderStickyLoading()}${this._renderFeatureObserver()}</div>`;
|
|
369
370
|
}
|
|
@@ -371,7 +372,7 @@ class te extends H {
|
|
|
371
372
|
return o`<calcite-notice icon=exclamation-mark-triangle kind=danger open scale=s width=full><div slot=message>${this.messages?.relationshipNotFound}</div></calcite-notice>`;
|
|
372
373
|
}
|
|
373
374
|
}
|
|
374
|
-
|
|
375
|
+
k("arcgis-feature-relationship", re);
|
|
375
376
|
export {
|
|
376
|
-
|
|
377
|
+
re as ArcgisFeatureRelationship
|
|
377
378
|
};
|
|
@@ -51,7 +51,7 @@ export abstract class ArcgisFeatures extends LitElement {
|
|
|
51
51
|
*/
|
|
52
52
|
accessor actions: Collection<PopupAction>;
|
|
53
53
|
/**
|
|
54
|
-
* Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/
|
|
54
|
+
* Indicates if the component is active when it is visible and is not [waiting](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#waitingForResult) for results.
|
|
55
55
|
*
|
|
56
56
|
* @default false
|
|
57
57
|
*/
|
|
@@ -446,7 +446,7 @@ export abstract class ArcgisFeatures extends LitElement {
|
|
|
446
446
|
*
|
|
447
447
|
* @default false
|
|
448
448
|
* @see [fetchFeatures()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-features/#fetchFeatures)
|
|
449
|
-
* @see [active](https://developers.arcgis.com/javascript/latest/references/core/
|
|
449
|
+
* @see [active](https://developers.arcgis.com/javascript/latest/references/core/popup/Features/#active)
|
|
450
450
|
* @see [clear()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-features/#clear)
|
|
451
451
|
* @since 5.0
|
|
452
452
|
* @example
|
|
@@ -1,37 +1,37 @@
|
|
|
1
1
|
/* COPYRIGHT Esri - https://js.arcgis.com/5.1/LICENSE.txt */
|
|
2
|
-
import { c as
|
|
3
|
-
import { css as
|
|
4
|
-
import { keyed as
|
|
5
|
-
import
|
|
2
|
+
import { c as L } from "../../chunks/runtime.js";
|
|
3
|
+
import { css as O, html as o } from "lit";
|
|
4
|
+
import { keyed as $ } from "lit/directives/keyed.js";
|
|
5
|
+
import B from "@arcgis/core/popup/Features.js";
|
|
6
6
|
import { u as R } from "../../chunks/useT9n.js";
|
|
7
|
-
import { classes as
|
|
8
|
-
import { usePropertyChange as S, bypassReadOnly as
|
|
7
|
+
import { classes as C } from "@arcgis/toolkit/dom";
|
|
8
|
+
import { usePropertyChange as S, bypassReadOnly as T } from "@arcgis/lumina/controllers";
|
|
9
9
|
import { m as P } from "../../chunks/useViewModel.js";
|
|
10
|
-
import { LitElement as H, createEvent as
|
|
11
|
-
import { substitute as d, formatNumber as
|
|
10
|
+
import { LitElement as H, createEvent as y, renderElement as z, nothing as c, safeClassMap as A } from "@arcgis/lumina";
|
|
11
|
+
import { substitute as d, formatNumber as _ } from "@arcgis/core/intl.js";
|
|
12
12
|
import { watch as l } from "@arcgis/core/core/reactiveUtils.js";
|
|
13
13
|
import { b as V, t as U, z as Z, a as j } from "../../chunks/action-utils.js";
|
|
14
|
-
import { stripHTML as
|
|
15
|
-
import
|
|
14
|
+
import { stripHTML as I } from "@arcgis/core/applications/Components/stringUtils.js";
|
|
15
|
+
import k from "@arcgis/core/core/Collection.js";
|
|
16
16
|
import { a as G } from "../../chunks/feature-utils.js";
|
|
17
|
-
import { renderingSanitizer as
|
|
17
|
+
import { renderingSanitizer as m } from "@arcgis/core/applications/Components/sanitizerUtils.js";
|
|
18
18
|
import { initializeProjection as K } from "@arcgis/core/applications/Components/featureUtils.js";
|
|
19
|
-
import { createRef as
|
|
20
|
-
const q =
|
|
21
|
-
function W(
|
|
22
|
-
return
|
|
19
|
+
import { createRef as w, ref as v } from "lit/directives/ref.js";
|
|
20
|
+
const q = O`:host{display:flex;overflow:hidden;flex:1 1 auto}.root{--calcite-color-background: var(--calcite-color-foreground-1);display:flex;overflow:hidden;flex:1 1 auto;flex-direction:column}.root img{image-orientation:from-image}.flow-item-collapsed{--calcite-flow-item-header-border-block-end: none}.container{display:flex;flex:1 1 auto;background-color:var(--calcite-color-foreground-1)}.container calcite-list{width:100%}.container:not(:empty){padding:var(--arcgis-internal-padding-md, var(--calcite-spacing-md))}.root .arcgis-feature,.root .arcgis-feature-relationship,.root .arcgis-feature-utility-network-associations{background-color:transparent}.heading{word-break:break-word;word-wrap:break-word}.header,.footer{display:flex;align-items:center;justify-content:flex-end;background-color:var(--calcite-color-foreground-1)}.footer{flex:1}.pagination-text{padding-inline:var(--calcite-spacing-sm);color:var(--calcite-color-text-3);font-size:var(--calcite-font-size-sm)}.loader{align-self:center;padding-inline:var(--calcite-spacing-lg)}.pagination-action-bar{flex:1}.pagination-menu-button{padding-inline:var(--calcite-spacing-xxs);border-inline-start:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.icon{display:inline-block;flex:0 0 var(--calcite-spacing-lg);width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.action-image{flex:0 0 var(--calcite-spacing-lg);background-position:50% 50%;background-repeat:no-repeat;background-size:contain;width:var(--calcite-spacing-lg);height:var(--calcite-spacing-lg)}.header{border-block-end:var(--calcite-border-width-sm) solid var(--calcite-color-border-3)}.content-feature{--calcite-flow-item-footer-padding: 0}.feature-menu-observer{position:relative;bottom:var(--calcite-spacing-xxl);z-index:2;text-align:center}.action-exit{transform:scaleX(-1)}`, F = j.clone();
|
|
21
|
+
function W(x) {
|
|
22
|
+
return x?.declaredClass.startsWith("esri.layers.") ?? !1;
|
|
23
23
|
}
|
|
24
|
-
const X = P(
|
|
24
|
+
const X = P(B);
|
|
25
25
|
class J extends H {
|
|
26
26
|
constructor() {
|
|
27
27
|
super(...arguments), this._fetchFeaturesController = null, this._featureMenuIntersectionObserverCallback = ([e]) => {
|
|
28
28
|
e?.isIntersecting && this.viewModel.featurePage != null && this.viewModel.featurePage++;
|
|
29
29
|
}, this._featureMenuIntersectionObserver = new IntersectionObserver(this._featureMenuIntersectionObserverCallback, {
|
|
30
30
|
root: window.document
|
|
31
|
-
}), this._featureMenuIntersectionObserverNode = null, this._rootFlowItemNode =
|
|
31
|
+
}), this._featureMenuIntersectionObserverNode = null, this._rootFlowItemNode = w(), this._featureMenuViewportNode = w(), this._actionBarMenuNode = w(), this._flowContainerNode = w(), this.messages = R(), this._selectedFeatureComponent = w(), this._cancelOpenRelatedFeature = () => {
|
|
32
32
|
const { _openRelatedFeatureAbortController: e } = this;
|
|
33
33
|
e && e.abort(), this._openRelatedFeatureAbortController = null;
|
|
34
|
-
}, this._openRelatedFeatureAbortController = null, this.flowItems = new
|
|
34
|
+
}, this._openRelatedFeatureAbortController = null, this.flowItems = new k(), this.viewModel = X(this), this.actions = this.viewModel.actions, this.active = this.viewModel.active, this.autoDestroyDisabled = !1, this.collapsed = !1, this.content = this.viewModel.content, this.defaultPopupTemplateEnabled = this.viewModel.defaultPopupTemplateEnabled, this.featureCount = this.viewModel.featureCount, this.featureMenuOpen = !1, this.featureNavigationTop = !1, this.features = this.viewModel.features, this.featuresPerPage = this.viewModel.featuresPerPage, this.featureItemAbilities = this.viewModel.featureItemAbilities, this.goToOverride = this.viewModel.goToOverride, this.headerActions = new k(), this.heading = this.viewModel.heading, this.headingLevel = 2, this.hideActionBar = !1, this.hideCloseButton = !1, this.hideFeatureMenuHeading = !1, this.hideFeatureNavigation = !1, this.hideFeatureListLayerTitle = !1, this.hideHeading = !1, this.hideSelectFeature = !1, this.hideSpinner = !1, this.hideContent = !1, this.chartAnimationDisabled = this.viewModel.featureItemAbilities?.chartAnimation, this.hideAttachmentsContent = this.viewModel.featureItemAbilities?.attachmentsContent, this.hideCustomContent = this.viewModel.featureItemAbilities?.customContent, this.hideExpressionContent = !1, this.hideFieldsContent = this.viewModel.featureItemAbilities?.fieldsContent, this.hideMediaContent = this.viewModel.featureItemAbilities?.mediaContent, this.hideRelationshipContent = this.viewModel.featureItemAbilities?.relationshipContent, this.hideTextContent = this.viewModel.featureItemAbilities?.textContent, this.hideUtilityNetworkContent = this.viewModel.featureItemAbilities?.utilityNetworkAssociationsContent, this.hideLastEditedInfo = !1, this.highlightDisabled = this.viewModel.highlightEnabled, this.includeDefaultActionsDisabled = this.viewModel.includeDefaultActions, this.initialDisplayMode = this.viewModel.initialDisplayMode, this.location = this.viewModel.location, this.map = this.viewModel.map, this.open = this.viewModel.open, this.promises = this.viewModel.promises, this.responsiveActionsEnabled = !1, this.selectedFeature = this.viewModel.selectedFeature, this.selectedFeatureIndex = this.viewModel.selectedFeatureIndex, this.showCollapseButton = !1, this.spatialReference = this.viewModel.spatialReference, this.state = this.viewModel.state, this.timeZone = this.viewModel.timeZone, this.updateLocationEnabled = this.viewModel.updateLocationEnabled, this.view = this.viewModel.view, this.arcgisPropertyChange = S()("active", "collapsed", "featureCount", "featureMenuOpen", "features", "promises", "selectedDrillInFeature", "selectedFeature", "selectedFeatureComponent", "selectedFeatureIndex", "state", "open"), this.arcgisReady = y(), this.arcgisClose = y(), this.arcgisTriggerAction = y();
|
|
35
35
|
}
|
|
36
36
|
static {
|
|
37
37
|
this.properties = { _openRelatedFeatureAbortController: 16, flowItems: 16, _hideActionText: 16, _featureNavigationVisible: 16, _isCollapsed: 16, _collapseEnabled: 16, _featureFlowItemSelected: 16, viewModel: 0, actions: 0, active: 0, autoDestroyDisabled: 5, collapsed: 5, content: 1, defaultPopupTemplateEnabled: 5, featureCount: 9, featureMenuOpen: 5, featureMenuTitle: 1, featureNavigationTop: 5, features: 0, featuresPerPage: 9, featureItemAbilities: 0, goToOverride: 0, headerActions: 0, heading: 1, headingLevel: 9, hideActionBar: 5, hideCloseButton: 5, hideFeatureMenuHeading: 5, hideFeatureNavigation: 5, hideFeatureListLayerTitle: 5, hideHeading: 5, hideSelectFeature: 5, hideSpinner: 5, hideContent: 5, chartAnimationDisabled: 5, hideAttachmentsContent: 5, hideCustomContent: 5, hideExpressionContent: 5, hideFieldsContent: 5, hideMediaContent: 5, hideRelationshipContent: 5, hideTextContent: 5, hideUtilityNetworkContent: 5, hideLastEditedInfo: 5, highlightDisabled: 5, icon: 1, includeDefaultActionsDisabled: 5, initialDisplayMode: 1, label: 1, location: 0, map: 0, messageOverrides: 0, open: 5, referenceElement: 1, promises: 0, responsiveActionsEnabled: 5, selectedDrillInFeature: 32, selectedFeature: 0, selectedFeatureComponent: 32, selectedFeatureIndex: 9, showCollapseButton: 5, spatialReference: 0, state: 32, timeZone: 1, updateLocationEnabled: 5, view: 0 };
|
|
@@ -101,7 +101,7 @@ class J extends H {
|
|
|
101
101
|
l(() => this.viewModel?.featureItems, () => this._featureMenuViewportScrollTop()),
|
|
102
102
|
l(() => this.flowItems.length, () => {
|
|
103
103
|
const e = Array.from(this.flowItems).at(-1);
|
|
104
|
-
|
|
104
|
+
T(() => this.selectedDrillInFeature = e?.graphic ?? void 0);
|
|
105
105
|
}),
|
|
106
106
|
l(() => [this.flowItems?.length, this.featureMenuOpen], () => {
|
|
107
107
|
this.setFocus();
|
|
@@ -122,7 +122,7 @@ class J extends H {
|
|
|
122
122
|
}
|
|
123
123
|
updated() {
|
|
124
124
|
const e = this._selectedFeatureComponent.value ?? void 0;
|
|
125
|
-
this.selectedFeatureComponent !== e &&
|
|
125
|
+
this.selectedFeatureComponent !== e && T(() => this.selectedFeatureComponent = e);
|
|
126
126
|
}
|
|
127
127
|
_cancelFetchingFeatures() {
|
|
128
128
|
this._fetchFeaturesController?.abort(), this._fetchFeaturesController = null;
|
|
@@ -265,15 +265,15 @@ class J extends H {
|
|
|
265
265
|
_renderFeaturePaginationText() {
|
|
266
266
|
const { messages: e, viewModel: t } = this, { featureCount: i, selectedFeatureIndex: s } = t;
|
|
267
267
|
return o`<div class="pagination-text">${d(e.pageText ?? "", {
|
|
268
|
-
index:
|
|
269
|
-
total:
|
|
268
|
+
index: _(s + 1),
|
|
269
|
+
total: _(i)
|
|
270
270
|
})}</div>`;
|
|
271
271
|
}
|
|
272
272
|
_renderFeatureMenuButton() {
|
|
273
273
|
const { messages: e, viewModel: t } = this, { featureCount: i, selectedFeatureIndex: s, pendingPromisesCount: a } = t;
|
|
274
274
|
return o`<calcite-action class="pagination-menu-button" icon=list .label=${e.selectFeature} .loading=${a > 0} @click=${this._handlePaginationMenuButton} .text=${d(e.pageText ?? "", {
|
|
275
|
-
index:
|
|
276
|
-
total:
|
|
275
|
+
index: _(s + 1),
|
|
276
|
+
total: _(i)
|
|
277
277
|
})} text-enabled title=${e.selectFeature ?? c}></calcite-action>`;
|
|
278
278
|
}
|
|
279
279
|
_renderPagination() {
|
|
@@ -282,13 +282,13 @@ class J extends H {
|
|
|
282
282
|
}
|
|
283
283
|
_renderFeatureMenuItem(e) {
|
|
284
284
|
const { initialDisplayMode: t } = this, { selectedFeatureItem: i, featureItems: s } = this.viewModel, a = e === i, n = s.indexOf(e);
|
|
285
|
-
return o`<calcite-list-item @blur=${this._removeActiveFeature} @focus=${() => this._setActiveFeature(n)} @mouseleave=${this._removeActiveFeature} @mouseover=${() => this._setActiveFeature(n)} .selected=${a} @calciteListItemSelect=${() => this._selectFeature(n)}><span .innerHTML=${(
|
|
285
|
+
return o`<calcite-list-item @blur=${this._removeActiveFeature} @focus=${() => this._setActiveFeature(n)} @mouseleave=${this._removeActiveFeature} @mouseover=${() => this._setActiveFeature(n)} .selected=${a} @calciteListItemSelect=${() => this._selectFeature(n)}><span .innerHTML=${(m.sanitize(e.heading) || this.messages.untitled) ?? ""} slot=content></span>${t === "list" ? o`<calcite-icon flip-rtl icon=chevron-right scale=s slot=content-end></calcite-icon>` : null}</calcite-list-item>`;
|
|
286
286
|
}
|
|
287
287
|
_renderFeatureMenu() {
|
|
288
288
|
const { messages: e, viewModel: t } = this, i = this._groupResultsByLayer(), s = this.initialDisplayMode === "list" ? "none" : "single";
|
|
289
289
|
return t.featureItems.length ? o`<calcite-list display-mode=flat .label=${e?.featuresList ?? ""} selection-appearance=icon .selectionMode=${s}>${Array.from(i.keys(), (a) => {
|
|
290
290
|
const n = i.get(a)?.map((h) => this._renderFeatureMenuItem(h)), r = a ? a.title ?? this.messages.untitled : null;
|
|
291
|
-
return !this.hideFeatureListLayerTitle && r !== null ?
|
|
291
|
+
return !this.hideFeatureListLayerTitle && r !== null ? $(a ?? "map-graphics", o`<calcite-list-item-group .heading=${r}>${n}</calcite-list-item-group>`) : n;
|
|
292
292
|
})}</calcite-list>` : null;
|
|
293
293
|
}
|
|
294
294
|
_renderHeaderAction(e) {
|
|
@@ -299,40 +299,40 @@ class J extends H {
|
|
|
299
299
|
return this.headerActions.map((e) => this._renderHeaderAction(e)).toArray();
|
|
300
300
|
}
|
|
301
301
|
_renderContentFeature() {
|
|
302
|
-
const { headingLevel: e, hideCloseButton: t, _isCollapsed: i, _collapseEnabled: s, _featureFlowItemSelected: a, featureNavigationTop: n, flowItems: r, initialDisplayMode: h, selectedFeature:
|
|
303
|
-
if (h === "list" && !
|
|
302
|
+
const { headingLevel: e, hideCloseButton: t, _isCollapsed: i, _collapseEnabled: s, _featureFlowItemSelected: a, featureNavigationTop: n, flowItems: r, initialDisplayMode: h, selectedFeature: p } = this, { active: f } = this.viewModel, u = this._getHeading();
|
|
303
|
+
if (h === "list" && !p)
|
|
304
304
|
return null;
|
|
305
305
|
const g = r.length === 0 && a;
|
|
306
|
-
return o`<calcite-flow-item class=${
|
|
306
|
+
return o`<calcite-flow-item class=${A(C({
|
|
307
307
|
"content-feature": !0,
|
|
308
308
|
"flow-item-collapsed": i
|
|
309
|
-
}))} .closable=${!t} .closed=${!
|
|
309
|
+
}))} .closable=${!t} .closed=${!f} .collapsed=${i} .collapseDirection=${n ? "down" : "up"} .collapsible=${s} .headingLevel=${e} .selected=${g} @calciteFlowItemBack=${this._handleFeatureBack} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} .heading=${I(u)} ${v(this._rootFlowItemNode)}><div slot=heading .innerHTML=${m.sanitize(u ?? "") ?? ""}></div>${this._renderHeaderActions()}${this._renderActionBar()}<div class=${A(C("container", "content-container"))}>${this._renderContent()}</div>${this._renderFooter()}</calcite-flow-item>`;
|
|
310
310
|
}
|
|
311
311
|
_renderFeatureMenuContainer() {
|
|
312
|
-
const { viewModel: e, hideCloseButton: t, featureMenuTitle: i, messages: s, initialDisplayMode: a, featureMenuOpen: n, _featureFlowItemSelected: r, _collapseEnabled: h, _isCollapsed:
|
|
312
|
+
const { viewModel: e, hideCloseButton: t, featureMenuTitle: i, messages: s, initialDisplayMode: a, featureMenuOpen: n, _featureFlowItemSelected: r, _collapseEnabled: h, _isCollapsed: p, featureNavigationTop: f, headingLevel: u } = this, { active: g, featureItems: M, pendingPromisesCount: b } = e, D = i ?? s.selectFeature;
|
|
313
313
|
if (a === "feature" && !n)
|
|
314
314
|
return null;
|
|
315
315
|
const N = !r;
|
|
316
|
-
return o`<calcite-flow-item class=${
|
|
317
|
-
"flow-item-collapsed":
|
|
318
|
-
}))} .closable=${a === "list" && !t} .closed=${!g} .collapsed=${a === "list" &&
|
|
319
|
-
total:
|
|
320
|
-
})} .heading=${this.hideFeatureMenuHeading ? void 0 : D} .headingLevel=${
|
|
316
|
+
return o`<calcite-flow-item class=${A(C({
|
|
317
|
+
"flow-item-collapsed": p
|
|
318
|
+
}))} .closable=${a === "list" && !t} .closed=${!g} .collapsed=${a === "list" && p} .collapseDirection=${f ? "down" : "up"} .collapsible=${a === "list" && h} .description=${this.hideFeatureMenuHeading ? void 0 : d(s.total ?? "", {
|
|
319
|
+
total: M.length
|
|
320
|
+
})} .heading=${this.hideFeatureMenuHeading ? void 0 : D} .headingLevel=${u} .loading=${e.waitingForContents} .selected=${N} @calciteFlowItemBack=${(E) => {
|
|
321
321
|
E.preventDefault(), this._handleFeatureMenuBack();
|
|
322
|
-
}} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} ${v(this._featureMenuViewportNode)}>${a === "list" ? this._renderHeaderActions() : null}${
|
|
322
|
+
}} @calciteFlowItemClose=${this._handleClose} @calciteFlowItemToggle=${this._handleCollapseToggle} ${v(this._featureMenuViewportNode)}>${a === "list" ? this._renderHeaderActions() : null}${b > 0 ? o`<calcite-loader class="loader" inline .label=${s.loading ?? ""} slot=header-actions-end></calcite-loader>` : null}<div class="container">${this._renderFeatureMenu()}</div><div class="feature-menu-observer" ${v(this._featureMenuIntersectionObserverCreated)}></div>${a === "feature" ? o`<calcite-button appearance=transparent @click=${this._handleFeatureMenuBack} slot=footer-start width=full>${s.back}</calcite-button>` : null}</calcite-flow-item>`;
|
|
323
323
|
}
|
|
324
324
|
_renderFlowItem(e, t) {
|
|
325
|
-
const { messages: i, hideCloseButton: s, hideSelectFeature: a, active: n } = this, r = "graphic" in e && "isFeatureFromTable" in e && !e.isFeatureFromTable, h = r && !a,
|
|
326
|
-
return o`<calcite-flow-item .closable=${!s} .closed=${!n} .description=${
|
|
327
|
-
|
|
328
|
-
}} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose}><calcite-action class="action-exit" icon=move-up @click=${this._removeFlowItems} slot=header-actions-start .text=${
|
|
325
|
+
const { messages: i, hideCloseButton: s, hideSelectFeature: a, active: n } = this, r = "graphic" in e && "isFeatureFromTable" in e && !e.isFeatureFromTable, h = r && !a, p = e.flowType === "feature-association", f = i.returnToInitialFeature ?? "", u = i?.selectFeature, g = this._getActionTitle(F), M = !this.hideActionBar && p && r;
|
|
326
|
+
return o`<calcite-flow-item .closable=${!s} .closed=${!n} .description=${I(this._getDrillInFlowItemDescription(e) ?? "")} .heading=${this.hideHeading ? void 0 : I(e.heading ?? "")} .selected=${t} @calciteFlowItemBack=${(b) => {
|
|
327
|
+
b.preventDefault(), this._handleDrillInBackClick();
|
|
328
|
+
}} .loading=${!!this._openRelatedFeatureAbortController} @calciteFlowItemClose=${this._handleClose}>${this.hideHeading ? null : o`<div slot=heading .innerHTML=${m.sanitize(e.heading ?? "") ?? ""}></div>`}<div slot=description .innerHTML=${m.sanitize(this._getDrillInFlowItemDescription(e) ?? "") ?? ""}></div><calcite-action class="action-exit" icon=move-up @click=${this._removeFlowItems} slot=header-actions-start .text=${f ?? ""} title=${f ?? "" ?? c}></calcite-action>${h ? o`<calcite-action icon=zoom-to-object @click=${() => this._openRelatedFeature(e)} slot=header-actions-end .text=${u ?? ""} title=${u ?? c}></calcite-action>` : null}${M ? o`<calcite-action-bar expand-disabled expanded scale=s slot=action-bar><calcite-action-group overlay-positioning=fixed scale=s><calcite-action .disabled=${F.disabled} .icon=${F.icon ?? void 0} .loading=${F.active} scale=s text-enabled .text=${g} title=${g ?? c} @click=${() => Z(this.viewModel, e)}></calcite-action></calcite-action-group></calcite-action-bar>` : null}<div class="container">${e}</div></calcite-flow-item>`;
|
|
329
329
|
}
|
|
330
330
|
_renderContentContainer() {
|
|
331
331
|
const e = this.flowItems?.toArray(), t = e?.map((s, a) => this._renderFlowItem(s, this._featureFlowItemSelected && a === e.length - 1)), i = this.initialDisplayMode === "list" ? [this._renderFeatureMenuContainer(), this._renderContentFeature(), t] : [this._renderContentFeature(), t, this._renderFeatureMenuContainer()];
|
|
332
332
|
return o`<calcite-flow ${v(this._flowContainerNode)}>${i}</calcite-flow>`;
|
|
333
333
|
}
|
|
334
334
|
_renderActionBar() {
|
|
335
|
-
const t = this.viewModel.selectedFeatureItem?.isFeatureFromTable && !this.location ? this.viewModel.allActions.filter((i) => i.id !==
|
|
335
|
+
const t = this.viewModel.selectedFeatureItem?.isFeatureFromTable && !this.location ? this.viewModel.allActions.filter((i) => i.id !== F.id) : this.viewModel.allActions;
|
|
336
336
|
return !this._isCollapsed && !this.hideActionBar && t.length ? o`<calcite-action-bar expand-disabled .expanded=${!this._hideActionText} scale=s slot=action-bar><calcite-action-group overlay-positioning=fixed scale=s ${v(this._actionBarMenuNode)}>${this._renderActions()}</calcite-action-group></calcite-action-bar>` : null;
|
|
337
337
|
}
|
|
338
338
|
_renderActions() {
|
|
@@ -343,10 +343,10 @@ class J extends H {
|
|
|
343
343
|
}
|
|
344
344
|
_renderContent() {
|
|
345
345
|
const { content: e, selectedFeatureItem: t } = this.viewModel;
|
|
346
|
-
return t ?
|
|
346
|
+
return t ? $(t, o`<arcgis-feature .autoDestroyDisabled=${this.autoDestroyDisabled} .chartAnimationDisabled=${this.chartAnimationDisabled} .defaultPopupTemplateEnabled=${this.defaultPopupTemplateEnabled} .flowItems=${this.flowItems} .graphic=${t.graphic} .headingLevel=${this.headingLevel + 1} .hideAttachmentsContent=${this.hideAttachmentsContent} .hideContent=${this.hideContent} .hideCustomContent=${this.hideCustomContent} .hideExpressionContent=${this.hideExpressionContent} .hideFieldsContent=${this.hideFieldsContent} hide-heading .hideLastEditedInfo=${this.hideLastEditedInfo} .hideMediaContent=${this.hideMediaContent} .hideTextContent=${this.hideTextContent} .location=${this.location} .map=${this.map} .referenceElement=${this.referenceElement} .showRelationshipContent=${!this.hideRelationshipContent} .showUtilityNetworkContent=${!this.hideUtilityNetworkContent} .spatialReference=${this.spatialReference} .timeZone=${this.timeZone} ${v(this._selectedFeatureComponent)}></arcgis-feature>`) : typeof e == "string" ? $(e, o`<div .innerHTML=${m.sanitize(e) ?? ""}></div>`) : e ?? null;
|
|
347
347
|
}
|
|
348
348
|
}
|
|
349
|
-
|
|
349
|
+
L("arcgis-features", J);
|
|
350
350
|
export {
|
|
351
351
|
J as ArcgisFeatures
|
|
352
352
|
};
|
|
@@ -7,7 +7,8 @@ import { LitElement as V, createEvent as w, safeClassMap as c } from "@arcgis/lu
|
|
|
7
7
|
import { reCreateAccessor as A, reEmitEvent as e, makeAccessorController as f } from "@arcgis/lumina/controllers/accessor";
|
|
8
8
|
import { createRef as v, ref as m } from "lit/directives/ref.js";
|
|
9
9
|
import { s as I } from "../../chunks/esri-main.js";
|
|
10
|
-
import { s as E
|
|
10
|
+
import { s as E } from "../../chunks/slots.js";
|
|
11
|
+
import { C as u } from "../../chunks/resources.js";
|
|
11
12
|
import { p as L, i as k } from "../../chunks/component-utils.js";
|
|
12
13
|
import { U as M, u as R, a as U } from "../../chunks/useArcgisViewReadyError.js";
|
|
13
14
|
import { fetchKnowledgeGraph as D } from "@arcgis/core/rest/knowledgeGraphService.js";
|
|
@@ -4,11 +4,12 @@ import { html as a } from "lit";
|
|
|
4
4
|
import { watch as s } from "@arcgis/core/core/reactiveUtils.js";
|
|
5
5
|
import c from "@arcgis/core/views/MapView.js";
|
|
6
6
|
import v from "@arcgis/core/WebMap.js";
|
|
7
|
-
import { LitElement as m, createEvent as r, safeClassMap as
|
|
7
|
+
import { LitElement as m, createEvent as r, safeClassMap as o } from "@arcgis/lumina";
|
|
8
8
|
import { reEmitEvent as e, reCreateAccessor as u, makeAccessorController as l } from "@arcgis/lumina/controllers/accessor";
|
|
9
|
-
import { createRef as
|
|
9
|
+
import { createRef as n, ref as h } from "lit/directives/ref.js";
|
|
10
10
|
import { s as g } from "../../chunks/esri-main.js";
|
|
11
|
-
import { s as d
|
|
11
|
+
import { s as d } from "../../chunks/slots.js";
|
|
12
|
+
import { C as w } from "../../chunks/resources.js";
|
|
12
13
|
import { p as y, i as f } from "../../chunks/component-utils.js";
|
|
13
14
|
import { U as b, u as V, a as C } from "../../chunks/useArcgisViewReadyError.js";
|
|
14
15
|
import E from "@arcgis/core/core/Collection.js";
|
|
@@ -26,7 +27,7 @@ const A = l(
|
|
|
26
27
|
), R = l(c, {});
|
|
27
28
|
class _ extends m {
|
|
28
29
|
constructor() {
|
|
29
|
-
super(), this._containerRef =
|
|
30
|
+
super(), this._containerRef = n(), this._mapRef = n(), this._uiController = new b(this), this.extraContent = new E(), this.arcgisLoadError = V(this), this.arcgisViewReadyError = C(this), this._map = A(this), this.view = R(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.floors = this.view.floors, this.graphics = this.view.graphics, this.ground = this._map.ground, this.highlights = this.view.highlights, this.ipsInfo = this._map.ipsInfo, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.spatialReferenceLocked = this.view.spatialReferenceLocked, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.visibleArea = this.view.visibleArea, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = r(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = r(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
|
|
30
31
|
components: []
|
|
31
32
|
};
|
|
32
33
|
}
|
|
@@ -168,10 +169,10 @@ class _ extends m {
|
|
|
168
169
|
]);
|
|
169
170
|
}
|
|
170
171
|
renderMain() {
|
|
171
|
-
return a`<div class=${
|
|
172
|
+
return a`<div class=${o(w.base)} ${h(this._mapRef)}></div>`;
|
|
172
173
|
}
|
|
173
174
|
render() {
|
|
174
|
-
return a`${this.renderMain()}<section class=${
|
|
175
|
+
return a`${this.renderMain()}<section class=${o(w.containerUI)} ${h(this._containerRef)}>${this._uiController.render()}${this.extraContent}</section>`;
|
|
175
176
|
}
|
|
176
177
|
}
|
|
177
178
|
p("arcgis-map", _);
|