@arcgis/map-components 5.2.0-next.132 → 5.2.0-next.135
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/4HPOOW2U.js +2 -0
- package/dist/cdn/{SJ5GQWFA.js → F4GSGW6P.js} +1 -1
- package/dist/cdn/{FX2T6AOI.js → FKJYZGQV.js} +1 -1
- package/dist/cdn/NAIKAKHU.js +2 -0
- package/dist/cdn/index.js +1 -1
- package/dist/components/arcgis-oriented-imagery-viewer/customElement.d.ts +154 -0
- package/dist/components/arcgis-oriented-imagery-viewer/customElement.js +14 -11
- package/dist/components/arcgis-slider-scale-range/customElement.d.ts +12 -0
- package/dist/components/arcgis-slider-scale-range/customElement.js +48 -36
- package/dist/components/arcgis-time-bar-extent/customElement.js +1 -1
- package/dist/components/arcgis-time-bar-slider/customElement.js +11 -11
- package/dist/docs/api.json +1 -1
- package/dist/docs/docs.json +1 -1
- package/dist/docs/vscode.html-custom-data.json +1 -1
- package/dist/docs/web-types.json +1 -1
- package/dist/loader.js +2 -2
- package/dist/types/lumina.d.ts +2 -2
- package/dist/types/preact.d.ts +2 -2
- package/dist/types/react.d.ts +2 -2
- package/dist/types/stencil.d.ts +2 -2
- package/package.json +6 -6
- package/dist/cdn/2BMYUPDQ.js +0 -2
- package/dist/cdn/Y4W2M6DK.js +0 -2
|
@@ -44,6 +44,13 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
|
|
|
44
44
|
*
|
|
45
45
|
*/
|
|
46
46
|
accessor autoDestroyDisabled: boolean;
|
|
47
|
+
/**
|
|
48
|
+
* The HTML element where the component's widget content is rendered.
|
|
49
|
+
* Returns `null` when the widget container is not an `HTMLDivElement`.
|
|
50
|
+
*
|
|
51
|
+
* @internal
|
|
52
|
+
*/
|
|
53
|
+
get container(): HTMLDivElement | null;
|
|
47
54
|
/**
|
|
48
55
|
* Toggles the visibility of the current footprint polygon associated with the selected image loaded in the viewer.
|
|
49
56
|
* Current footprint coverage allows you to better understand how the images in the oriented imagery layer relate to the map.
|
|
@@ -77,6 +84,68 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
|
|
|
77
84
|
* @default false
|
|
78
85
|
*/
|
|
79
86
|
accessor galleryOpened: boolean;
|
|
87
|
+
/**
|
|
88
|
+
* Indicates whether to hide the action button that toggles visibility of camera locations
|
|
89
|
+
* for additional images, meaning images other than the currently displayed image.
|
|
90
|
+
*
|
|
91
|
+
* @default false
|
|
92
|
+
* @since 5.2
|
|
93
|
+
*/
|
|
94
|
+
accessor hideAdditionalCameraLocationsToggle: boolean;
|
|
95
|
+
/**
|
|
96
|
+
* Indicates whether to hide the action button that toggles visibility of footprints
|
|
97
|
+
* for additional images, meaning images other than the currently displayed image.
|
|
98
|
+
*
|
|
99
|
+
* @default false
|
|
100
|
+
* @since 5.2
|
|
101
|
+
*/
|
|
102
|
+
accessor hideAdditionalFootprintsToggle: boolean;
|
|
103
|
+
/**
|
|
104
|
+
* Indicates whether to hide the action button that toggles visibility of the footprint
|
|
105
|
+
* for the currently displayed image.
|
|
106
|
+
*
|
|
107
|
+
* @default false
|
|
108
|
+
* @since 5.2
|
|
109
|
+
*/
|
|
110
|
+
accessor hideCurrentFootprintToggle: boolean;
|
|
111
|
+
/**
|
|
112
|
+
* Indicates whether to hide the action button that toggles directional navigation mode.
|
|
113
|
+
*
|
|
114
|
+
* @default false
|
|
115
|
+
* @since 5.2
|
|
116
|
+
*/
|
|
117
|
+
accessor hideDirectionalNavigationToggle: boolean;
|
|
118
|
+
/**
|
|
119
|
+
* Indicates whether to hide the action button that displays imagery for the clicked feature.
|
|
120
|
+
* Unlike explore-images mode, this action uses the feature returned from the click location
|
|
121
|
+
* instead of performing a spatial query for the best image.
|
|
122
|
+
*
|
|
123
|
+
* @default false
|
|
124
|
+
* @since 5.2
|
|
125
|
+
*/
|
|
126
|
+
accessor hideDisplayImageToggle: boolean;
|
|
127
|
+
/**
|
|
128
|
+
* Indicates whether to hide the action button that opens the image enhancement controls.
|
|
129
|
+
*
|
|
130
|
+
* @default false
|
|
131
|
+
* @since 5.2
|
|
132
|
+
*/
|
|
133
|
+
accessor hideEnhancementToolToggle: boolean;
|
|
134
|
+
/**
|
|
135
|
+
* Indicates whether to hide the action button that toggles 3D explore-images mode.
|
|
136
|
+
*
|
|
137
|
+
* @default false
|
|
138
|
+
* @since 5.2
|
|
139
|
+
*/
|
|
140
|
+
accessor hideExploreImages3dToggle: boolean;
|
|
141
|
+
/**
|
|
142
|
+
* Indicates whether to hide the action button that toggles explore-images mode,
|
|
143
|
+
* allowing the user to click the map and load imagery for that location.
|
|
144
|
+
*
|
|
145
|
+
* @default false
|
|
146
|
+
* @since 5.2
|
|
147
|
+
*/
|
|
148
|
+
accessor hideExploreImagesToggle: boolean;
|
|
80
149
|
/**
|
|
81
150
|
* Indicates whether to hide the header of the widget.
|
|
82
151
|
*
|
|
@@ -84,6 +153,41 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
|
|
|
84
153
|
* @since 5.1
|
|
85
154
|
*/
|
|
86
155
|
accessor hideHeader: boolean;
|
|
156
|
+
/**
|
|
157
|
+
* Indicates whether to hide the action button that opens the image gallery.
|
|
158
|
+
*
|
|
159
|
+
* @default false
|
|
160
|
+
* @since 5.2
|
|
161
|
+
*/
|
|
162
|
+
accessor hideImageGalleryToggle: boolean;
|
|
163
|
+
/**
|
|
164
|
+
* Indicates whether to hide the top-level action bar group for measurement tools.
|
|
165
|
+
*
|
|
166
|
+
* @default false
|
|
167
|
+
* @since 5.2
|
|
168
|
+
*/
|
|
169
|
+
accessor hideImageMeasurementToolsGroup: boolean;
|
|
170
|
+
/**
|
|
171
|
+
* Indicates whether to hide the top-level action bar group for image navigation tools.
|
|
172
|
+
*
|
|
173
|
+
* @default false
|
|
174
|
+
* @since 5.2
|
|
175
|
+
*/
|
|
176
|
+
accessor hideImageNavigationGroup: boolean;
|
|
177
|
+
/**
|
|
178
|
+
* Indicates whether to hide the action button that opens the image overlays UI.
|
|
179
|
+
*
|
|
180
|
+
* @default false
|
|
181
|
+
* @since 5.2
|
|
182
|
+
*/
|
|
183
|
+
accessor hideImageOverlaysToggle: boolean;
|
|
184
|
+
/**
|
|
185
|
+
* Indicates whether to hide the action button that toggles the map-image conversion tool.
|
|
186
|
+
*
|
|
187
|
+
* @default false
|
|
188
|
+
* @since 5.2
|
|
189
|
+
*/
|
|
190
|
+
accessor hideMapImageLocationToolToggle: boolean;
|
|
87
191
|
/**
|
|
88
192
|
* Indicates whether to hide the action bar of the widget.
|
|
89
193
|
*
|
|
@@ -91,6 +195,56 @@ export abstract class ArcgisOrientedImageryViewer extends LitElement {
|
|
|
91
195
|
* @since 5.1
|
|
92
196
|
*/
|
|
93
197
|
accessor hideMenu: boolean;
|
|
198
|
+
/**
|
|
199
|
+
* Indicates whether to hide the action button that toggles the navigation tool.
|
|
200
|
+
*
|
|
201
|
+
* @default false
|
|
202
|
+
* @since 5.2
|
|
203
|
+
*/
|
|
204
|
+
accessor hideNavigationToolToggle: boolean;
|
|
205
|
+
/**
|
|
206
|
+
* Indicates whether to hide the top-level action bar group for overlay controls.
|
|
207
|
+
*
|
|
208
|
+
* @default false
|
|
209
|
+
* @since 5.2
|
|
210
|
+
*/
|
|
211
|
+
accessor hideOverlaysGroup: boolean;
|
|
212
|
+
/**
|
|
213
|
+
* Indicates whether to hide the action button that shows image popups and attributes.
|
|
214
|
+
*
|
|
215
|
+
* @default false
|
|
216
|
+
* @since 5.2
|
|
217
|
+
*/
|
|
218
|
+
accessor hidePopupsAction: boolean;
|
|
219
|
+
/**
|
|
220
|
+
* Indicates whether to hide the top-level action bar group for search and image discovery tools.
|
|
221
|
+
*
|
|
222
|
+
* @default false
|
|
223
|
+
* @since 5.2
|
|
224
|
+
*/
|
|
225
|
+
accessor hideSearchGroup: boolean;
|
|
226
|
+
/**
|
|
227
|
+
* Indicates whether to hide the action button that toggles sequential navigation mode.
|
|
228
|
+
*
|
|
229
|
+
* @default false
|
|
230
|
+
* @since 5.2
|
|
231
|
+
*/
|
|
232
|
+
accessor hideSequentialNavigationToggle: boolean;
|
|
233
|
+
/**
|
|
234
|
+
* Indicates whether to hide the action button that toggles superimposition of the current image
|
|
235
|
+
* in a 3D scene when the required camera properties and metadata are available.
|
|
236
|
+
*
|
|
237
|
+
* @default false
|
|
238
|
+
* @since 5.2
|
|
239
|
+
*/
|
|
240
|
+
accessor hideSuperimposeViewToggle: boolean;
|
|
241
|
+
/**
|
|
242
|
+
* Indicates whether to hide the top-level action bar group for utility tools.
|
|
243
|
+
*
|
|
244
|
+
* @default false
|
|
245
|
+
* @since 5.2
|
|
246
|
+
*/
|
|
247
|
+
accessor hideUtilitiesGroup: boolean;
|
|
94
248
|
/**
|
|
95
249
|
* Icon which represents the component.
|
|
96
250
|
* Typically used when the component is controlled by another component (e.g. by the Expand component).
|
|
@@ -5,22 +5,25 @@ import a from "@arcgis/core/layers/OrientedImageryLayer.js";
|
|
|
5
5
|
import n from "@arcgis/core/widgets/OrientedImageryViewer.js";
|
|
6
6
|
import { LitElement as s, createEvent as d } from "@arcgis/lumina";
|
|
7
7
|
import { log as l } from "@arcgis/toolkit/log";
|
|
8
|
-
import { m as
|
|
9
|
-
import { css as
|
|
8
|
+
import { m as g } from "../../chunks/useWidget.js";
|
|
9
|
+
import { css as c } from "lit";
|
|
10
10
|
import { s as m } from "../../chunks/esri-main.js";
|
|
11
|
-
import { u as
|
|
12
|
-
const h = g`:host{--esri-oriented-imagery-viewer-min-width: var(--arcgis-oriented-imagery-viewer-min-width, 288px);--esri-oriented-imagery-viewer-min-height: var(--arcgis-oriented-imagery-viewer-min-height, 348px);inline-size:100%;block-size:100%}.esri-image-viewer{width:100%;height:100%}.esri-image-viewer__slider-container{--calcite-block-padding: 0;box-sizing:border-box;box-shadow:none;padding-inline:var(--calcite-spacing-md);background-color:#0000;border:none;width:100%;margin:0;overflow:hidden}.esri-image-viewer__slider-container calcite-slider{width:100%}.esri-oriented-imagery-viewer{--esri-oriented-imagery-viewer-action-icon-size: 8px;--calcite-dialog-size-x: 210px;--calcite-dialog-min-size-y: 90px;--calcite-font-weight-medium: $font-weight;--calcite-font-size-0: $font-size;--calcite-icon-size: var(--esri-oriented-imagery-viewer-action-icon-size);box-sizing:border-box;z-index:1;container-type:size;width:100%;min-width:var(--esri-oriented-imagery-viewer-min-width);height:100%;min-height:var(--esri-oriented-imagery-viewer-min-height);flex-direction:column;align-items:flex-start;display:flex;overflow:hidden}.esri-oriented-imagery-viewer:has(.esri-widget .esri-oriented-imagery-viewer__image-overlays-no-result){--esri-oriented-imagery-viewer-min-height: 420px}.esri-oriented-imagery-viewer__body{flex-direction:column;flex:1 0 auto;order:1;align-self:stretch;height:100%;display:flex}.esri-oriented-imagery-viewer__body-current-coverage{--calcite-icon-color: var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__body-additional-camera-locations{--calcite-icon-color: var(--calcite-color-brand)}.esri-oriented-imagery-viewer__body-additional-coverage{--calcite-icon-color: var(--calcite-color-status-info)}.esri-oriented-imagery-viewer__body-footprint{--calcite-icon-color: var(--calcite-color-status-success)}.esri-oriented-imagery-viewer__carousel{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__carousel-container{height:auto;display:inline-block;overflow:auto hidden}.esri-oriented-imagery-viewer__carousel header{--calcite-font-weight-medium: $font-weight--light;--calcite-font-size-0: $font-size--tiny}.esri-oriented-imagery-viewer__carousel-item{width:100px;height:70px}.esri-oriented-imagery-viewer__carousel-item-wrapper{box-sizing:border-box;justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-item-wrapper--selected{box-sizing:border-box;border:2px solid var(--calcite-color-brand);justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-content{display:flex}.esri-oriented-imagery-viewer__close{background:var(--calcite-color-foreground-1);flex-direction:row;flex-grow:0;order:7;justify-content:center;align-items:center;width:48px;height:59px;display:flex}.esri-oriented-imagery-viewer__image-enhancement-wrapper{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-enhancement-tools{display:flex}.esri-oriented-imagery-viewer__image-enhancement-tool-container{width:50%;margin-block:2px;padding-inline:.75rem}.esri-oriented-imagery-viewer__superimpose-tools{box-shadow:none;width:100%;height:auto;margin:0}.esri-oriented-imagery-viewer__superimpose-tools .esri-oriented-imagery-viewer__image-enhancement-tool-container{padding-block:var(--calcite-spacing-sm) var(--calcite-spacing-md);width:100%;margin-block:0}.esri-oriented-imagery-viewer__image-overlays{z-index:1;margin:auto 1% 0;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-layer-list,.esri-oriented-imagery-viewer__image-overlays-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-container{height:auto;display:flex}.esri-oriented-imagery-viewer__image-overlays-no-result{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:auto;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-no-result-layer-list,.esri-oriented-imagery-viewer__image-overlays-no-result-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-increased-height{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:200px;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-increased-height-layer-list,.esri-oriented-imagery-viewer__image-overlays-increased-height-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__measurement-results{width:auto;height:fit-content}.esri-oriented-imagery-viewer__measurements-table{margin-block-start:var(--calcite-spacing-sm)}.esri-oriented-imagery-viewer__measurements-bar{flex-wrap:nowrap;display:flex}.esri-oriented-imagery-viewer__measurements-button{display:flex}.esri-oriented-imagery-viewer__measurement-display{text-align:center;margin-block-end:var(--calcite-spacing-xxs)}.esri-oriented-imagery-viewer__viewer{cursor:url(data:text/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2226%22%20width%3D%2226%22%3E%0A%3Cpath%20stroke%3D%22%23000%22%20stroke-width%3D%221px%22%20fill%3D%22%23fff%22%20d%3D%22m15.3%2020.5s6.38-6.73%204.64-8.24-3.47%201.01-3.47%201.01%203.61-5.72%201.41-6.49c-2.2-0.769-3.33%204.36-3.33%204.36s0.873-5.76-1.06-5.76-1.58%205.39-1.58%205.39-0.574-4.59-2.18-4.12c-1.61%200.468-0.572%205.51-0.572%205.51s-1.58-4.89-2.93-3.79c-1.35%201.11%200.258%205.25%200.572%206.62%200.836%202.43%202.03%202.94%202.17%205.55%22%2F%3E%0A%3C%2Fsvg%3E%0A);flex-grow:1;width:100%;margin:0;display:flex}.esri-oriented-imagery-viewer__viewer--hidden{display:none}.esri-oriented-imagery-viewer__viewer-container{border-top:1px solid var(--calcite-color-border-3);background:var(--calcite-color-foreground-1);border-radius:0 0 3px 3px;flex:1 0 auto;order:1;align-self:stretch;width:100%;height:100%;display:flex}.esri-oriented-imagery-viewer__alert{inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);position:absolute}.esri-oriented-imagery-viewer__alert>[slot=message]{display:block}@container (width <= 386px) or (height <= 348px){.esri-oriented-imagery-viewer__alert>[slot=message]{display:none}}.esri-oriented-imagery-viewer-container-measurement{border-top:var(--calcite-border-width-sm) solid var(--calcite-color-border-3);border-radius:0 0 var(--calcite-corner-radius-round) var(--calcite-corner-radius-round);background:var(--calcite-color-foreground-1);flex:1 0 auto;order:1;align-self:stretch;width:100%;height:50%;display:flex}@keyframes rotateOrientedImageryNavigationTool{0%{transform:rotate(var(--oi-navigation-tool-rotation-from, 0deg))}to{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}}.esri-oriented-imagery-viewer__navigation{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}.esri-oriented-imagery-viewer__navigation-animate{animation:.7s linear forwards rotateOrientedImageryNavigationTool}.esri-oriented-imagery-viewer__navigation-feature{fill:var(--calcite-color-brand);stroke:var(--calcite-color-foreground-1);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-feature.selected{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-feature-path{pointer-events:none}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-0{stop-color:var(--calcite-color-status-danger);stop-opacity:.4}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-1{stop-color:var(--calcite-color-status-danger);stop-opacity:.2}.esri-oriented-imagery-viewer__navigation-pointer{fill:var(--calcite-color-foreground-1);fill-rule:evenodd;stroke:#0000;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-width:0}.esri-oriented-imagery-viewer__navigation-pointer-north{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-wrapper{z-index:1;position:absolute;bottom:0;right:0;overflow:hidden}.esri-oriented-imagery-viewer__navigation-wrapper--video{inset-block-end:calc(var(--calcite-spacing-xxxl) * 3)}.esri-oriented-imagery-viewer__navigation-wrapper--zoomed{transform-origin:100% 100%;transform:scale(1.5)}.esri-oriented-imagery-viewer__navigation-wrapper-boundary{fill:var(--calcite-color-foreground-1);fill-opacity:.25;stroke:var(--calcite-color-border-2)}.esri-oriented-imagery-viewer__navigation-sector{fill:none}.esri-oriented-imagery-viewer__navigation-sector-separator{stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-cross{stroke:var(--calcite-color-status-danger);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-enabled{fill:var(--calcite-color-foreground-1);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-disabled{fill:var(--calcite-color-foreground-3);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-outer{fill:var(--calcite-color-foreground-1);fill-opacity:.4;stroke:none}.esri-oriented-imagery-viewer__pro .esri-oriented-imagery-viewer{width:100%;max-width:unset;height:100%;max-height:unset;position:static}.esri-oriented-imagery-viewer__sketch-tools{justify-content:center;align-items:center;width:100%;display:flex;position:absolute;bottom:0}.esri-oriented-imagery-viewer--notice{margin-block:auto}.esri-oriented-imagery-viewer__navigation-ui{box-sizing:border-box;transform-style:preserve-3d;z-index:var(--calcite-z-index-overlay);aspect-ratio:1;pointer-events:none;flex-direction:column;align-items:center;width:50%;max-width:330px;display:flex;position:absolute;inset-block-end:0;inset-inline:50%;overflow:hidden;translate:-50%}.esri-oriented-imagery-viewer__navigation-ui__direction{--esri-oriented-imagery-viewer__navigation-ui-direction-color: wheat;--calcite-icon-color: var(--esri-oriented-imagery-viewer__navigation-ui-direction-color);transform-origin:top;transform-style:preserve-3d;cursor:not-allowed;border:3px solid #bfc5cc;border-radius:50%;width:4.5em;height:4.5em;transition:border-color .15s;position:absolute}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]){cursor:pointer;pointer-events:auto}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]):hover{--calcite-icon-color: var(--calcite-color-brand);border-color:var(--calcite-color-brand)}.esri-oriented-imagery-viewer__navigation-ui__direction-pad{box-sizing:border-box;filter:drop-shadow(0 2px 1px #00000080);width:100%;height:100%;transform:perspective(400px) rotateX(60deg)}.esri-oriented-imagery-viewer__navigation-settings-ui [slot=content-bottom]{padding:.5rem;display:none}.esri-oriented-imagery-viewer__navigation-settings-ui [selected]>[slot=content-bottom]{display:block}.esri-panoramic-viewer{width:100%;height:100%;overflow-x:hidden}.esri-panoramic-viewer__slider-container{--calcite-block-padding: 0;box-sizing:border-box;box-shadow:none;padding-inline:var(--calcite-spacing-md);background-color:#0000;border:none;width:100%;margin:0;overflow:hidden}.esri-panoramic-viewer__slider-container calcite-slider{width:100%}`, w = c(n), y = "map-components:arcgis-oriented-imagery-viewer";
|
|
13
|
-
class
|
|
11
|
+
import { u as h } from "../../chunks/useLayerById.js";
|
|
12
|
+
const v = c`:host{--esri-oriented-imagery-viewer-min-width: var(--arcgis-oriented-imagery-viewer-min-width, 288px);--esri-oriented-imagery-viewer-min-height: var(--arcgis-oriented-imagery-viewer-min-height, 348px);inline-size:100%;block-size:100%}.esri-image-viewer{width:100%;height:100%}.esri-image-viewer__slider-container{--calcite-block-padding: 0;box-sizing:border-box;box-shadow:none;padding-inline:var(--calcite-spacing-md);background-color:#0000;border:none;width:100%;margin:0;overflow:hidden}.esri-image-viewer__slider-container calcite-slider{width:100%}.esri-oriented-imagery-viewer{--esri-oriented-imagery-viewer-action-icon-size: 8px;--calcite-dialog-size-x: 210px;--calcite-dialog-min-size-y: 90px;--calcite-font-weight-medium: $font-weight;--calcite-font-size-0: $font-size;--calcite-icon-size: var(--esri-oriented-imagery-viewer-action-icon-size);box-sizing:border-box;z-index:1;container-type:size;width:100%;min-width:var(--esri-oriented-imagery-viewer-min-width);height:100%;min-height:var(--esri-oriented-imagery-viewer-min-height);flex-direction:column;align-items:flex-start;display:flex;overflow:hidden}.esri-oriented-imagery-viewer:has(.esri-widget .esri-oriented-imagery-viewer__image-overlays-no-result){--esri-oriented-imagery-viewer-min-height: 420px}.esri-oriented-imagery-viewer__body{flex-direction:column;flex:1 0 auto;order:1;align-self:stretch;height:100%;display:flex}.esri-oriented-imagery-viewer__body-current-coverage{--calcite-icon-color: var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__body-additional-camera-locations{--calcite-icon-color: var(--calcite-color-brand)}.esri-oriented-imagery-viewer__body-additional-coverage{--calcite-icon-color: var(--calcite-color-status-info)}.esri-oriented-imagery-viewer__body-footprint{--calcite-icon-color: var(--calcite-color-status-success)}.esri-oriented-imagery-viewer__carousel{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__carousel-container{height:auto;display:inline-block;overflow:auto hidden}.esri-oriented-imagery-viewer__carousel header{--calcite-font-weight-medium: $font-weight--light;--calcite-font-size-0: $font-size--tiny}.esri-oriented-imagery-viewer__carousel-item{width:100px;height:70px}.esri-oriented-imagery-viewer__carousel-item-wrapper{box-sizing:border-box;justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-item-wrapper--selected{box-sizing:border-box;border:2px solid var(--calcite-color-brand);justify-content:center;align-items:center;width:106px;height:78px;margin:auto 10px;display:flex;box-shadow:0 1px 2px #0000004d}.esri-oriented-imagery-viewer__carousel-content{display:flex}.esri-oriented-imagery-viewer__close{background:var(--calcite-color-foreground-1);flex-direction:row;flex-grow:0;order:7;justify-content:center;align-items:center;width:48px;height:59px;display:flex}.esri-oriented-imagery-viewer__image-enhancement-wrapper{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;margin:auto 1% 0;position:absolute;bottom:0;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-enhancement-tools{display:flex}.esri-oriented-imagery-viewer__image-enhancement-tool-container{width:50%;margin-block:2px;padding-inline:.75rem}.esri-oriented-imagery-viewer__superimpose-tools{box-shadow:none;width:100%;height:auto;margin:0}.esri-oriented-imagery-viewer__superimpose-tools .esri-oriented-imagery-viewer__image-enhancement-tool-container{padding-block:var(--calcite-spacing-sm) var(--calcite-spacing-md);width:100%;margin-block:0}.esri-oriented-imagery-viewer__image-overlays{z-index:1;margin:auto 1% 0;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:140px;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-layer-list,.esri-oriented-imagery-viewer__image-overlays-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-container{height:auto;display:flex}.esri-oriented-imagery-viewer__image-overlays-no-result{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:auto;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-no-result-layer-list,.esri-oriented-imagery-viewer__image-overlays-no-result-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__image-overlays-increased-height{z-index:1;border:1px solid var(--calcite-color-border-2);align-items:center;width:98%;height:200px;margin:auto 1% 0;position:absolute;bottom:0;overflow-y:auto;box-shadow:0 0 1px #0000004d}.esri-oriented-imagery-viewer__image-overlays-increased-height-layer-list,.esri-oriented-imagery-viewer__image-overlays-increased-height-switch{padding:0 var(--calcite-spacing-md)}.esri-oriented-imagery-viewer__measurement-results{width:auto;height:fit-content}.esri-oriented-imagery-viewer__measurements-table{margin-block-start:var(--calcite-spacing-sm)}.esri-oriented-imagery-viewer__measurements-bar{flex-wrap:nowrap;display:flex}.esri-oriented-imagery-viewer__measurements-button{display:flex}.esri-oriented-imagery-viewer__measurement-display{text-align:center;margin-block-end:var(--calcite-spacing-xxs)}.esri-oriented-imagery-viewer__viewer{cursor:url(data:text/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2226%22%20width%3D%2226%22%3E%0A%3Cpath%20stroke%3D%22%23000%22%20stroke-width%3D%221px%22%20fill%3D%22%23fff%22%20d%3D%22m15.3%2020.5s6.38-6.73%204.64-8.24-3.47%201.01-3.47%201.01%203.61-5.72%201.41-6.49c-2.2-0.769-3.33%204.36-3.33%204.36s0.873-5.76-1.06-5.76-1.58%205.39-1.58%205.39-0.574-4.59-2.18-4.12c-1.61%200.468-0.572%205.51-0.572%205.51s-1.58-4.89-2.93-3.79c-1.35%201.11%200.258%205.25%200.572%206.62%200.836%202.43%202.03%202.94%202.17%205.55%22%2F%3E%0A%3C%2Fsvg%3E%0A);flex-grow:1;width:100%;margin:0;display:flex}.esri-oriented-imagery-viewer__viewer--hidden{display:none}.esri-oriented-imagery-viewer__viewer-container{border-top:1px solid var(--calcite-color-border-3);background:var(--calcite-color-foreground-1);border-radius:0 0 3px 3px;flex:1 0 auto;order:1;align-self:stretch;width:100%;height:100%;display:flex}.esri-oriented-imagery-viewer__alert{inset-block-end:var(--calcite-spacing-md);inset-inline:var(--calcite-spacing-md);position:absolute}.esri-oriented-imagery-viewer__alert>[slot=message]{display:block}@container (width <= 386px) or (height <= 348px){.esri-oriented-imagery-viewer__alert>[slot=message]{display:none}}.esri-oriented-imagery-viewer-container-measurement{border-top:var(--calcite-border-width-sm) solid var(--calcite-color-border-3);border-radius:0 0 var(--calcite-corner-radius-round) var(--calcite-corner-radius-round);background:var(--calcite-color-foreground-1);flex:1 0 auto;order:1;align-self:stretch;width:100%;height:50%;display:flex}@keyframes rotateOrientedImageryNavigationTool{0%{transform:rotate(var(--oi-navigation-tool-rotation-from, 0deg))}to{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}}.esri-oriented-imagery-viewer__navigation{transform:rotate(var(--oi-navigation-tool-rotation-to, 0deg))}.esri-oriented-imagery-viewer__navigation-animate{animation:.7s linear forwards rotateOrientedImageryNavigationTool}.esri-oriented-imagery-viewer__navigation-feature{fill:var(--calcite-color-brand);stroke:var(--calcite-color-foreground-1);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-feature.selected{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-feature-path{pointer-events:none}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-0{stop-color:var(--calcite-color-status-danger);stop-opacity:.4}.esri-oriented-imagery-viewer__navigation-feature-path-stop-offset-1{stop-color:var(--calcite-color-status-danger);stop-opacity:.2}.esri-oriented-imagery-viewer__navigation-pointer{fill:var(--calcite-color-foreground-1);fill-rule:evenodd;stroke:#0000;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-width:0}.esri-oriented-imagery-viewer__navigation-pointer-north{fill:var(--calcite-color-status-danger)}.esri-oriented-imagery-viewer__navigation-wrapper{z-index:1;position:absolute;bottom:0;right:0;overflow:hidden}.esri-oriented-imagery-viewer__navigation-wrapper--video{inset-block-end:calc(var(--calcite-spacing-xxxl) * 3)}.esri-oriented-imagery-viewer__navigation-wrapper--zoomed{transform-origin:100% 100%;transform:scale(1.5)}.esri-oriented-imagery-viewer__navigation-wrapper-boundary{fill:var(--calcite-color-foreground-1);fill-opacity:.25;stroke:var(--calcite-color-border-2)}.esri-oriented-imagery-viewer__navigation-sector{fill:none}.esri-oriented-imagery-viewer__navigation-sector-separator{stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-cross{stroke:var(--calcite-color-status-danger);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-enabled{fill:var(--calcite-color-foreground-1);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-disabled{fill:var(--calcite-color-foreground-3);stroke:var(--calcite-color-border-2);stroke-width:1px}.esri-oriented-imagery-viewer__navigation-sector-outer{fill:var(--calcite-color-foreground-1);fill-opacity:.4;stroke:none}.esri-oriented-imagery-viewer__pro .esri-oriented-imagery-viewer{width:100%;max-width:unset;height:100%;max-height:unset;position:static}.esri-oriented-imagery-viewer__sketch-tools{justify-content:center;align-items:center;width:100%;display:flex;position:absolute;bottom:0}.esri-oriented-imagery-viewer--notice{margin-block:auto}.esri-oriented-imagery-viewer__navigation-ui{box-sizing:border-box;transform-style:preserve-3d;z-index:var(--calcite-z-index-overlay);aspect-ratio:1;pointer-events:none;flex-direction:column;align-items:center;width:50%;max-width:330px;display:flex;position:absolute;inset-block-end:0;inset-inline:50%;overflow:hidden;translate:-50%}.esri-oriented-imagery-viewer__navigation-ui__direction{--esri-oriented-imagery-viewer__navigation-ui-direction-color: wheat;--calcite-icon-color: var(--esri-oriented-imagery-viewer__navigation-ui-direction-color);transform-origin:top;transform-style:preserve-3d;cursor:not-allowed;border:3px solid #bfc5cc;border-radius:50%;width:4.5em;height:4.5em;transition:border-color .15s;position:absolute}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]){cursor:pointer;pointer-events:auto}.esri-oriented-imagery-viewer__navigation-ui__direction:not([disabled]):hover{--calcite-icon-color: var(--calcite-color-brand);border-color:var(--calcite-color-brand)}.esri-oriented-imagery-viewer__navigation-ui__direction-pad{box-sizing:border-box;filter:drop-shadow(0 2px 1px #00000080);width:100%;height:100%;transform:perspective(400px) rotateX(60deg)}.esri-oriented-imagery-viewer__navigation-settings-ui [slot=content-bottom]{padding:.5rem;display:none}.esri-oriented-imagery-viewer__navigation-settings-ui [selected]>[slot=content-bottom]{display:block}.esri-panoramic-viewer{width:100%;height:100%;overflow-x:hidden}.esri-panoramic-viewer__slider-container{--calcite-block-padding: 0;box-sizing:border-box;box-shadow:none;padding-inline:var(--calcite-spacing-md);background-color:#0000;border:none;width:100%;margin:0;overflow:hidden}.esri-panoramic-viewer__slider-container calcite-slider{width:100%}`, w = g(n), p = "map-components:arcgis-oriented-imagery-viewer";
|
|
13
|
+
class y extends s {
|
|
14
14
|
constructor() {
|
|
15
|
-
super(...arguments), this.widget = w(this), this._hasOrientedImageryLayerToAdd = !1, this.viewModel = this.widget.viewModel, this.view = this.widget.view, this.autoDestroyDisabled = !1, this.actionBarPosition = this.widget.actionBarPosition, this.currentCoverageVisible = this.widget.currentCoverageVisible, this.dataCaptureEnabled = this.widget.dataCaptureEnabled, this.disabled = this.widget.disabled, this.galleryOpened = this.widget.galleryOpened, this.hideHeader = this.widget.visibleElements.header, this.hideMenu = this.widget.visibleElements.menu, this.icon = this.widget.icon, this.imageEnhancementToolActive = this.widget.imageEnhancementToolActive, this.imageGalleryEnabled = this.widget.imageGalleryEnabled, this.imageOverlaysOpened = this.widget.imageOverlaysOpened, this.isAdditionalCoverageVisible = this.widget.isAdditionalCoverageVisible, this.isAdditionalPointSourcesVisible = this.widget.isAdditionalPointSourcesVisible, this.label = this.widget.label, this.layer = this.widget.layer, this.mapLayerId =
|
|
16
|
-
e && (e.type === "oriented-imagery" ? this.layer = e : l("warn", this, `${
|
|
15
|
+
super(...arguments), this.widget = w(this), this._hasOrientedImageryLayerToAdd = !1, this.viewModel = this.widget.viewModel, this.view = this.widget.view, this.autoDestroyDisabled = !1, this.actionBarPosition = this.widget.actionBarPosition, this.currentCoverageVisible = this.widget.currentCoverageVisible, this.dataCaptureEnabled = this.widget.dataCaptureEnabled, this.disabled = this.widget.disabled, this.galleryOpened = this.widget.galleryOpened, this.hideAdditionalCameraLocationsToggle = this.widget.visibleElements.additionalCameraLocationsToggle, this.hideAdditionalFootprintsToggle = this.widget.visibleElements.additionalFootprintToggle, this.hideCurrentFootprintToggle = this.widget.visibleElements.currentFootprintToggle, this.hideDirectionalNavigationToggle = this.widget.visibleElements.directionalNavigation, this.hideEnhancementToolToggle = this.widget.visibleElements.enhancementTool, this.hideExploreImagesToggle = this.widget.visibleElements.exploreImages, this.hideExploreImages3dToggle = this.widget.visibleElements.exploreImages3D, this.hideHeader = this.widget.visibleElements.header, this.hideMenu = this.widget.visibleElements.menu, this.hideImageGalleryToggle = this.widget.visibleElements.imageGallery, this.hideImageNavigationGroup = this.widget.visibleElements.imageNavigationTools, this.hideImageOverlaysToggle = this.widget.visibleElements.imageOverlays, this.hideMapImageLocationToolToggle = this.widget.visibleElements.mapImageConversionTool, this.hideImageMeasurementToolsGroup = this.widget.visibleElements.measurementTools, this.hideNavigationToolToggle = this.widget.visibleElements.navigationTool, this.hideOverlaysGroup = this.widget.visibleElements.overlays, this.hideSearchGroup = this.widget.visibleElements.searchTools, this.hideSequentialNavigationToggle = this.widget.visibleElements.sequentialNavigation, this.hideDisplayImageToggle = this.widget.visibleElements.showSelectedImage, this.hidePopupsAction = this.widget.visibleElements.showPopupsAction, this.hideSuperimposeViewToggle = this.widget.visibleElements.superimpose, this.hideUtilitiesGroup = this.widget.visibleElements.utilityTools, this.icon = this.widget.icon, this.imageEnhancementToolActive = this.widget.imageEnhancementToolActive, this.imageGalleryEnabled = this.widget.imageGalleryEnabled, this.imageOverlaysOpened = this.widget.imageOverlaysOpened, this.isAdditionalCoverageVisible = this.widget.isAdditionalCoverageVisible, this.isAdditionalPointSourcesVisible = this.widget.isAdditionalPointSourcesVisible, this.label = this.widget.label, this.layer = this.widget.layer, this.mapLayerId = h(this, (e) => {
|
|
16
|
+
e && (e.type === "oriented-imagery" ? this.layer = e : l("warn", this, `${p} - layer with id ${this.mapLayerId} is not a valid Oriented Imagery Layer`));
|
|
17
17
|
}), this.mapImageConversionToolState = this.widget.mapImageConversionToolState, this.navigationToolActive = this.widget.navigationToolActive, this.preloadMedia = this.widget.preloadMedia, this.referencePoint = this.widget.referencePoint, this.arcgisPropertyChange = o()("imageGalleryEnabled", "layer"), this.arcgisReady = d();
|
|
18
18
|
}
|
|
19
19
|
static {
|
|
20
|
-
this.properties = { view: 0, autoDestroyDisabled: 5, actionBarPosition: 1, currentCoverageVisible: 5, dataCaptureEnabled: 5, disabled: 5, galleryOpened: 5, hideHeader: 5, hideMenu: 5, icon: 1, imageEnhancementToolActive: 5, imageGalleryEnabled: 36, imageOverlaysOpened: 5, isAdditionalCoverageVisible: 5, isAdditionalPointSourcesVisible: 5, label: 1, layer: 0, mapLayerId: 1, mapImageConversionToolState: 5, navigationToolActive: 5, orientedImageryLayerItemId: 1, preloadMedia: 5, referenceElement: 1, referencePoint: 32, selectedPoint: 32 };
|
|
20
|
+
this.properties = { view: 0, autoDestroyDisabled: 5, container: 32, actionBarPosition: 1, currentCoverageVisible: 5, dataCaptureEnabled: 5, disabled: 5, galleryOpened: 5, hideAdditionalCameraLocationsToggle: 5, hideAdditionalFootprintsToggle: 5, hideCurrentFootprintToggle: 5, hideDirectionalNavigationToggle: 5, hideEnhancementToolToggle: 5, hideExploreImagesToggle: 5, hideExploreImages3dToggle: 5, hideHeader: 5, hideMenu: 5, hideImageGalleryToggle: 5, hideImageNavigationGroup: 5, hideImageOverlaysToggle: 5, hideMapImageLocationToolToggle: 5, hideImageMeasurementToolsGroup: 5, hideNavigationToolToggle: 5, hideOverlaysGroup: 5, hideSearchGroup: 5, hideSequentialNavigationToggle: 5, hideDisplayImageToggle: 5, hidePopupsAction: 5, hideSuperimposeViewToggle: 5, hideUtilitiesGroup: 5, icon: 1, imageEnhancementToolActive: 5, imageGalleryEnabled: 36, imageOverlaysOpened: 5, isAdditionalCoverageVisible: 5, isAdditionalPointSourcesVisible: 5, label: 1, layer: 0, mapLayerId: 1, mapImageConversionToolState: 5, navigationToolActive: 5, orientedImageryLayerItemId: 1, preloadMedia: 5, referenceElement: 1, referencePoint: 32, selectedPoint: 32 };
|
|
21
21
|
}
|
|
22
22
|
static {
|
|
23
|
-
this.styles = [m,
|
|
23
|
+
this.styles = [m, v];
|
|
24
|
+
}
|
|
25
|
+
get container() {
|
|
26
|
+
return this.widget.container instanceof HTMLDivElement ? this.widget.container : null;
|
|
24
27
|
}
|
|
25
28
|
get selectedPoint() {
|
|
26
29
|
return this.widget.selectedPoint;
|
|
@@ -50,7 +53,7 @@ class p extends s {
|
|
|
50
53
|
e && (this.widget.view?.map?.add(e), this._hasOrientedImageryLayerToAdd = !1);
|
|
51
54
|
}
|
|
52
55
|
}
|
|
53
|
-
t("arcgis-oriented-imagery-viewer",
|
|
56
|
+
t("arcgis-oriented-imagery-viewer", y);
|
|
54
57
|
export {
|
|
55
|
-
|
|
58
|
+
y as ArcgisOrientedImageryViewer
|
|
56
59
|
};
|
|
@@ -243,6 +243,18 @@ export abstract class ArcgisSliderScaleRange extends LitElement {
|
|
|
243
243
|
* See [SupportedRegion](https://developers.arcgis.com/javascript/latest/references/core/widgets/ScaleRangeSlider/types/#SupportedRegion) for the list of regions that are currently supported.
|
|
244
244
|
*/
|
|
245
245
|
accessor region: SupportedRegion | undefined;
|
|
246
|
+
/**
|
|
247
|
+
* If an [arcgis-scene](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-scene/) is associated with the component and this property
|
|
248
|
+
* is set to `true`, the current scale indicator will be represented as a highlighted range of the slider track. The width of the indicator will increase
|
|
249
|
+
* as the [camera's tilt](https://developers.arcgis.com/javascript/latest/references/core/Camera/#tilt) approaches 90 degrees. If this property is set to `false`,
|
|
250
|
+
* a small caret will render under the track indicating the current scale instead.
|
|
251
|
+
*
|
|
252
|
+
* > [!WARNING]
|
|
253
|
+
* > This property is not supported when the component is used in 2D maps.
|
|
254
|
+
*
|
|
255
|
+
* @default false
|
|
256
|
+
*/
|
|
257
|
+
accessor showScaleRangeIndicator: boolean;
|
|
246
258
|
/**
|
|
247
259
|
* Indicates whether the world scale value is shown in the scale menu.
|
|
248
260
|
*
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
|
|
2
|
-
import { g as x, c as
|
|
2
|
+
import { g as x, c as g } from "../../chunks/runtime.js";
|
|
3
3
|
import { keyed as p } from "lit/directives/keyed.js";
|
|
4
|
-
import { LitElement as
|
|
5
|
-
import { watch as
|
|
6
|
-
import { u as
|
|
7
|
-
import { u as
|
|
8
|
-
import { css as b, html as
|
|
9
|
-
import { usePropertyChange as
|
|
10
|
-
import { createRef as
|
|
11
|
-
import
|
|
4
|
+
import { LitElement as _, createEvent as d, safeClassMap as v, safeStyleMap as f, nothing as M } from "@arcgis/lumina";
|
|
5
|
+
import { watch as u } from "@arcgis/core/core/reactiveUtils.js";
|
|
6
|
+
import { u as y } from "../../chunks/useView.js";
|
|
7
|
+
import { u as $ } from "../../chunks/useT9n.js";
|
|
8
|
+
import { css as b, html as r } from "lit";
|
|
9
|
+
import { usePropertyChange as L } from "@arcgis/lumina/controllers";
|
|
10
|
+
import { createRef as w, ref as R } from "lit/directives/ref.js";
|
|
11
|
+
import I from "@arcgis/core/portal/Portal.js";
|
|
12
12
|
const h = /* @__PURE__ */ new Set([
|
|
13
13
|
"ar-iq",
|
|
14
14
|
"ar-kw",
|
|
@@ -112,7 +112,7 @@ const h = /* @__PURE__ */ new Set([
|
|
|
112
112
|
sv: "se",
|
|
113
113
|
th: "th",
|
|
114
114
|
zh: "cn"
|
|
115
|
-
}, P = b`:host{display:block;width:310px;max-width:100%}.slider{height:50px}.scale-indicator-container{position:relative;width:100%;margin-top:2px}.scale-indicator-icon{transform:scale(.8,1.7);margin-left:-6px;width:1px;--calcite-icon-color: var(--calcite-color-text-3)}.scale-menu-list{max-height:220px;overflow-y:auto}.scale-menu-input{max-width:120px}.scale-menu-button-container{display:flex;direction:ltr;justify-content:space-between}.scale-menu-button{min-width:0}:dir(rtl) .scale-menu-button-container>*{direction:rtl}.preview-container{padding:6px;background-color:var(--calcite-color-foreground-1);box-shadow:0 1px 2px #0000004d}`, l = [
|
|
115
|
+
}, P = b`:host{display:block;width:310px;max-width:100%}.slider{height:50px}.scale-indicator-container{position:relative;width:100%;margin-top:2px}.scale-indicator-container[slot=track-overlay]{position:absolute;inset:0;pointer-events:none;margin-top:0}.scale-indicator-icon{left:var(--arcgis-internal-scale-indicator-offset);transform:scale(.8,1.7);margin-left:-6px;width:1px;--calcite-icon-color: var(--calcite-color-text-3)}.scale-indicator-range{top:-1px;left:var(--arcgis-internal-scale-indicator-left);width:calc(var(--arcgis-internal-scale-indicator-right) - var(--arcgis-internal-scale-indicator-left));height:4px;background-color:var(--calcite-color-brand);mask-image:linear-gradient(to right,transparent 0%,black 30%,black 70%,transparent 100%);pointer-events:none}.scale-menu-list{max-height:220px;overflow-y:auto}.scale-menu-input{max-width:120px}.scale-menu-button-container{display:flex;direction:ltr;justify-content:space-between}.scale-menu-button{min-width:0}:dir(rtl) .scale-menu-button-container>*{direction:rtl}.preview-container{padding:6px;background-color:var(--calcite-color-foreground-1);box-shadow:0 1px 2px #0000004d}`, l = [
|
|
116
116
|
{ id: "world", scale: 147914382, minScale: 147914382, maxScale: 1e8 },
|
|
117
117
|
{ id: "continent", scale: 5e7, minScale: 99999999, maxScale: 35e6 },
|
|
118
118
|
{ id: "countriesBig", scale: 25e6, minScale: 34999999, maxScale: 15e6 },
|
|
@@ -134,12 +134,12 @@ const h = /* @__PURE__ */ new Set([
|
|
|
134
134
|
{ id: "rooms", scale: 400, minScale: 400, maxScale: 101 },
|
|
135
135
|
{ id: "room", scale: 100, minScale: 100, maxScale: 0 }
|
|
136
136
|
];
|
|
137
|
-
class
|
|
137
|
+
class k extends _ {
|
|
138
138
|
constructor() {
|
|
139
|
-
super(...arguments), this.messages =
|
|
139
|
+
super(...arguments), this.messages = $(), this._sliderRef = w(), this._activeMenu = null, this._customScaleSelected = null, this._portalRegion = null, this._layerMaxScaleLimit = l[l.length - 1].maxScale, this._layerMinScaleLimit = l[0].minScale, this.autoDestroyDisabled = !1, this.disabled = !1, this.hidePreview = !1, this.hideMaxScaleMenu = !1, this.hideMinScaleMenu = !1, this.icon = "actual-size", this.maxScale = 0, this.maxScaleLimit = l[l.length - 1].maxScale, this.minScale = 0, this.minScaleLimit = l[0].minScale, this.mode = "range", this.showScaleRangeIndicator = !1, this.showWorldValue = !1, this.view = y(this), this.arcgisChange = d(), this.arcgisInput = d(), this.arcgisPropertyChange = L()("state", "minScale", "maxScale"), this.arcgisReady = d();
|
|
140
140
|
}
|
|
141
141
|
static {
|
|
142
|
-
this.properties = { _activeMenu: 16, _customScaleSelected: 16, _portalRegion: 16, _layerMaxScaleLimit: 16, _layerMinScaleLimit: 16, autoDestroyDisabled: 5, disabled: 7, hidePreview: 5, hideMaxScaleMenu: 5, hideMinScaleMenu: 5, icon: 1, label: 1, layer: 0, maxScale: 9, maxScaleLimit: 9, minScale: 9, minScaleLimit: 9, mode: 1, referenceElement: 1, region: 1, showWorldValue: 5, state: 32, view: 0 };
|
|
142
|
+
this.properties = { _activeMenu: 16, _customScaleSelected: 16, _portalRegion: 16, _layerMaxScaleLimit: 16, _layerMinScaleLimit: 16, autoDestroyDisabled: 5, disabled: 7, hidePreview: 5, hideMaxScaleMenu: 5, hideMinScaleMenu: 5, icon: 1, label: 1, layer: 0, maxScale: 9, maxScaleLimit: 9, minScale: 9, minScaleLimit: 9, mode: 1, referenceElement: 1, region: 1, showScaleRangeIndicator: 5, showWorldValue: 5, state: 32, view: 0 };
|
|
143
143
|
}
|
|
144
144
|
static {
|
|
145
145
|
this.styles = P;
|
|
@@ -166,13 +166,16 @@ class I extends g {
|
|
|
166
166
|
}) : (this._layerMinScaleLimit = l[0].minScale, this._layerMaxScaleLimit = l[l.length - 1].maxScale)), e.has("mode") && (this.mode === "max-scale-only" ? this.minScale = 0 : this.mode === "min-scale-only" && (this.maxScale = 0), e.get("mode") !== void 0 && this._syncLayerScale());
|
|
167
167
|
}
|
|
168
168
|
loaded() {
|
|
169
|
-
|
|
169
|
+
I.getDefault().load().then((i) => {
|
|
170
170
|
const a = i.user?.culture ?? i.culture;
|
|
171
171
|
a && (this._portalRegion = a.split("-")[1]?.toLowerCase() ?? null);
|
|
172
172
|
}).catch(() => {
|
|
173
173
|
}), this.manager.onLifecycle(() => [
|
|
174
|
-
|
|
175
|
-
|
|
174
|
+
u(() => this.view?.scale, () => this.requestUpdate(), { initial: !0 }),
|
|
175
|
+
u(() => this.view?.type === "3d" ? this.view.camera?.tilt : void 0, () => {
|
|
176
|
+
this.showScaleRangeIndicator && this.requestUpdate();
|
|
177
|
+
}, { initial: !0 }),
|
|
178
|
+
u(() => ({
|
|
176
179
|
// Layer type has loaded property, but Sublayer and SubtypeSublayer use loadStatus instead
|
|
177
180
|
loaded: this.layer?.loadStatus === "loaded",
|
|
178
181
|
ready: this.view?.ready
|
|
@@ -185,8 +188,8 @@ class I extends g {
|
|
|
185
188
|
!("resampling" in this.layer) || this.layer.resampling || (this._layerMinScaleLimit = s[0].scale === 0 ? l[0].minScale : Math.min(l[0].minScale, s[0].scale), this._layerMaxScaleLimit = s[s.length - 1].scale);
|
|
186
189
|
else {
|
|
187
190
|
const n = this.layer && "maxScaleRange" in this.layer ? this.layer.maxScaleRange : null;
|
|
188
|
-
let
|
|
189
|
-
n && (
|
|
191
|
+
let o = 0, m = 0;
|
|
192
|
+
n && (o = n.minScale, m = n.maxScale), m !== 0 && (this._layerMaxScaleLimit = m), o !== 0 && (this._layerMinScaleLimit = o);
|
|
190
193
|
}
|
|
191
194
|
const c = this.layer;
|
|
192
195
|
c && "minScale" in c && "maxScale" in c && (c.minScale !== 0 && this.minScale === 0 && (this.minScale = Math.min(c.minScale, this._interactiveMinScale)), c.maxScale !== 0 && this.maxScale === 0 && (this.maxScale = Math.max(c.maxScale, this._interactiveMaxScale)));
|
|
@@ -218,6 +221,10 @@ class I extends g {
|
|
|
218
221
|
const i = e === "min" ? this._effectiveMinScale : this._effectiveMaxScale, a = Math.floor(this._mapScaleToSlider(i)), t = this.messages.scaleRangeLabels;
|
|
219
222
|
return t ? t[l[a].id] : "";
|
|
220
223
|
}
|
|
224
|
+
_getScaleRangeIndicatorWidth() {
|
|
225
|
+
const e = this.view?.type === "3d" ? this.view.camera?.tilt ?? 0 : 0, i = e <= 90 ? e : 180 - e;
|
|
226
|
+
return Math.min(33 + i / 90 * 30, 60);
|
|
227
|
+
}
|
|
221
228
|
_getSpriteSheetFile() {
|
|
222
229
|
if (this.region) {
|
|
223
230
|
const a = this.region.toLowerCase(), t = `${this.messages._t9nLocale}-${a}`;
|
|
@@ -267,7 +274,7 @@ class I extends g {
|
|
|
267
274
|
}
|
|
268
275
|
}
|
|
269
276
|
_mapScaleToSlider(e) {
|
|
270
|
-
const i = Math.min(l[0].minScale, Math.max(l[l.length - 1].maxScale, e)), a = l.findIndex((
|
|
277
|
+
const i = Math.min(l[0].minScale, Math.max(l[l.length - 1].maxScale, e)), a = l.findIndex((o) => i >= o.maxScale && i <= o.minScale), t = l[a], s = a, c = a + 0.9999;
|
|
271
278
|
return t ? s + (i - t.minScale) * (c - s) / (t.maxScale - t.minScale) : 0;
|
|
272
279
|
}
|
|
273
280
|
_mapSliderToScale(e) {
|
|
@@ -282,22 +289,27 @@ class I extends g {
|
|
|
282
289
|
}
|
|
283
290
|
_renderScalePreviewPopover() {
|
|
284
291
|
const e = this._renderScalePreview();
|
|
285
|
-
return this.hidePreview || !e ? null :
|
|
292
|
+
return this.hidePreview || !e ? null : r`<div slot=popover>${e}</div>`;
|
|
286
293
|
}
|
|
287
294
|
render() {
|
|
288
295
|
const e = this._mapScaleToSlider(this._interactiveMinScale), i = this._mapScaleToSlider(this._interactiveMaxScale), a = this._sliderFullRangeMin, t = this._sliderFullRangeMax;
|
|
289
|
-
return
|
|
296
|
+
return r`<div><arcgis-slider class="slider" .disabled=${this.disabled} layout=horizontal .fillPlacement=${this.mode === "max-scale-only" ? "start" : this.mode === "min-scale-only" ? "end" : void 0} .fullRangeMin=${a < e ? a : void 0} .fullRangeMax=${t > i ? t : void 0} .max=${i} .min=${e} .labelFormatter=${(s, c, n) => n(Math.round(this._mapSliderToScale(s)))} .values=${this.mode === "max-scale-only" ? [this._mapScaleToSlider(this._effectiveMaxScale)] : this.mode === "min-scale-only" ? [this._mapScaleToSlider(this._effectiveMinScale)] : [this._mapScaleToSlider(this._effectiveMinScale), this._mapScaleToSlider(this._effectiveMaxScale)]} @arcgisInput=${this._handleSliderThumbDrag} ${R(this._sliderRef)}>${this._renderScalePreviewPopover()}${this.view?.scale != null && this._renderCurrentScaleIndicator(this.view.scale) || ""}</arcgis-slider><div class="scale-menu-button-container" slot=content-end>${this.mode !== "max-scale-only" && !this.hideMinScaleMenu ? [this._renderScaleMenuButtons("min"), this._renderScaleMenuPopover("min")] : r`<div></div>`}${this.mode !== "min-scale-only" && !this.hideMaxScaleMenu && [this._renderScaleMenuButtons("max"), this._renderScaleMenuPopover("max")] || ""}</div></div>`;
|
|
290
297
|
}
|
|
291
298
|
_renderCurrentScaleIndicator(e) {
|
|
292
|
-
const i = this._sliderFullRangeMin, t = this._sliderFullRangeMax - i, s = Math.min(100, Math.max(0, (this._mapScaleToSlider(e) - i) / t * 100));
|
|
293
|
-
return p("scale-indicator",
|
|
299
|
+
const i = this._sliderFullRangeMin, t = this._sliderFullRangeMax - i, s = this.view?.type === "3d" && this.showScaleRangeIndicator, c = Math.min(100, Math.max(0, (this._mapScaleToSlider(e) - i) / t * 100));
|
|
300
|
+
return p("scale-indicator", r`<div class="scale-indicator-container" .slot=${s ? "track-overlay" : "content-end"}><div class=${v(s ? "scale-indicator-range" : "scale-indicator-icon")} style=${f({
|
|
294
301
|
position: "absolute",
|
|
295
|
-
|
|
296
|
-
|
|
302
|
+
"--arcgis-internal-scale-indicator-offset": `${c}%`,
|
|
303
|
+
// calculate the intended position of each edge of the scale indicator and clamp to the slider track bounds
|
|
304
|
+
...s ? {
|
|
305
|
+
"--arcgis-internal-scale-indicator-left": `max(0%, calc(${c}% - ${this._getScaleRangeIndicatorWidth() / 2}px))`,
|
|
306
|
+
"--arcgis-internal-scale-indicator-right": `min(100%, calc(${c}% + ${this._getScaleRangeIndicatorWidth() / 2}px))`
|
|
307
|
+
} : {}
|
|
308
|
+
})} .title=${`${this.messages.currentScale} 1:${Math.round(e).toLocaleString(this.messages._t9nLocale)}`}>${s ? null : r`<calcite-icon icon=caret-up scale=s></calcite-icon>`}</div></div>`);
|
|
297
309
|
}
|
|
298
310
|
_renderCustomScaleValue(e, i) {
|
|
299
311
|
const a = Math.round(i).toString();
|
|
300
|
-
return
|
|
312
|
+
return r`<calcite-list-item .label=${this.messages?.featuredScaleLabels?.custom} .selected=${this._customScaleSelected === e} @calciteListItemSelect=${(t) => {
|
|
301
313
|
const s = t.target.querySelector("calcite-input-number");
|
|
302
314
|
this._handleCustomScaleInput(e, s?.value ?? ""), this._customScaleSelected = e;
|
|
303
315
|
}}><calcite-input-number dir=ltr class="scale-menu-input" slot=content-end group-separator inputmode=numeric .max=${l[0].minScale} .min=${l[l.length - 1].maxScale} number-button-type=none .placeholder=${this.messages?.customScaleInputTooltip} prefix-text=1: scale=s step=1 .value=${a} @click=${(t) => t.stopPropagation()} @keydown=${(t) => {
|
|
@@ -305,10 +317,10 @@ class I extends g {
|
|
|
305
317
|
}}></calcite-input-number></calcite-list-item>`;
|
|
306
318
|
}
|
|
307
319
|
_renderScaleMenuButtons(e) {
|
|
308
|
-
return
|
|
320
|
+
return r`<calcite-button .disabled=${this.disabled} class="scale-menu-button" .id=${`scale-menu-button-${e}`} icon-end=chevron-down scale=s .appearance=${this._activeMenu === e ? "outline" : "transparent"}>${this._getDropdownLabel(e)}</calcite-button>`;
|
|
309
321
|
}
|
|
310
322
|
_renderScaleMenuPopover(e) {
|
|
311
|
-
return
|
|
323
|
+
return r`<calcite-popover auto-close .label=${`${e === "min" ? "Min" : "Max"} scale menu`} .referenceElement=${`scale-menu-button-${e}`} .placement=${e === "max" ? "bottom-end" : "bottom-start"} .open=${this._activeMenu === e} scale=s @calcitePopoverOpen=${() => this._activeMenu = e} @calcitePopoverClose=${() => {
|
|
312
324
|
this._activeMenu === e && (this._activeMenu = null);
|
|
313
325
|
}}>${this._renderScaleMenu(e)}</calcite-popover>`;
|
|
314
326
|
}
|
|
@@ -316,24 +328,24 @@ class I extends g {
|
|
|
316
328
|
const i = Math.floor(this._mapScaleToSlider(this._effectiveMaxScale)), a = Math.floor(this._mapScaleToSlider(this._effectiveMinScale)), t = e === "min" ? this._effectiveMinScale : this._effectiveMaxScale, s = this.messages.featuredScaleLabels;
|
|
317
329
|
if (!s)
|
|
318
330
|
return;
|
|
319
|
-
const c = Math.floor(this._mapScaleToSlider(this._interactiveMaxScale)), n = Math.floor(this._mapScaleToSlider(this._interactiveMinScale)),
|
|
331
|
+
const c = Math.floor(this._mapScaleToSlider(this._interactiveMaxScale)), n = Math.floor(this._mapScaleToSlider(this._interactiveMinScale)), o = l.filter((m, S) => e === "min" ? S < i && S >= n : S > a && S <= c).map((m) => this._renderScaleMenuItem({
|
|
320
332
|
scaleLabel: s[m.id],
|
|
321
333
|
scaleValue: m.scale,
|
|
322
334
|
isSelected: t === m.scale,
|
|
323
335
|
valueVisible: m.id !== "world" || this.showWorldValue,
|
|
324
336
|
type: e
|
|
325
337
|
}));
|
|
326
|
-
return
|
|
338
|
+
return r`<calcite-list label="Scale Menu List" scale=s class="scale-menu-list" selection-appearance=icon selection-mode=single-persist>${this._renderCustomScaleValue(e, t)}${this.view?.scale != null ? this._renderScaleMenuItem({
|
|
327
339
|
scaleValue: this.view.scale,
|
|
328
340
|
scaleLabel: s.current,
|
|
329
341
|
isSelected: t === this.view.scale,
|
|
330
342
|
valueVisible: !0,
|
|
331
343
|
type: e
|
|
332
|
-
}) : null}${
|
|
344
|
+
}) : null}${o}</calcite-list>`;
|
|
333
345
|
}
|
|
334
346
|
_renderScaleMenuItem(e) {
|
|
335
347
|
const { scaleValue: i, scaleLabel: a, isSelected: t, valueVisible: s } = e, c = i === l[0].scale ? ` ${this.messages.aboveSuffix}` : i === l[l.length - 1].scale ? ` ${this.messages.belowSuffix}` : "";
|
|
336
|
-
return
|
|
348
|
+
return r`<calcite-list-item .label=${a} .selected=${t && this._customScaleSelected !== e.type} .description=${s ? `1:${Math.round(i).toLocaleString(this.messages._t9nLocale)}${c}` : void 0} @calciteListItemSelect=${() => {
|
|
337
349
|
this._setScale(e.type, i), this._customScaleSelected = null;
|
|
338
350
|
}}></calcite-list-item>`;
|
|
339
351
|
}
|
|
@@ -341,8 +353,8 @@ class I extends g {
|
|
|
341
353
|
const e = this._sliderRef.value?.activeValue;
|
|
342
354
|
if (typeof e != "number")
|
|
343
355
|
return null;
|
|
344
|
-
const i = Math.min(l.length - 1, Math.max(0, Math.floor(e))), a = 5, t = 128, s = t * (i % a), c = t * Math.floor(i / a), n = `-${s}px -${c}px`,
|
|
345
|
-
return
|
|
356
|
+
const i = Math.min(l.length - 1, Math.max(0, Math.floor(e))), a = 5, t = 128, s = t * (i % a), c = t * Math.floor(i / a), n = `-${s}px -${c}px`, o = this._getSpriteSheetFile();
|
|
357
|
+
return r`<div class="preview-container"><img src=${x(`./assets/slider-scale-range/images/${o}.avif`) ?? M} style=${f({
|
|
346
358
|
display: "block",
|
|
347
359
|
height: `${t}px`,
|
|
348
360
|
width: `${t}px`,
|
|
@@ -351,7 +363,7 @@ class I extends g {
|
|
|
351
363
|
})}></div>`;
|
|
352
364
|
}
|
|
353
365
|
}
|
|
354
|
-
|
|
366
|
+
g("arcgis-slider-scale-range", k);
|
|
355
367
|
export {
|
|
356
|
-
|
|
368
|
+
k as ArcgisSliderScaleRange
|
|
357
369
|
};
|
|
@@ -26,7 +26,7 @@ class u extends d {
|
|
|
26
26
|
if (c.isEmpty)
|
|
27
27
|
return a`<div class="table-instant"><span class=${l({ disabled: i, text: !0 })}>${s.emptyTimeExtent}</span></div>`;
|
|
28
28
|
const { start: e, end: r } = c;
|
|
29
|
-
return e && r ? e.getTime() === r.getTime() ? a`<div class="table-instant"><arcgis-time-bar-date align=center .autoDestroyDisabled=${this.autoDestroyDisabled} class="end" .date=${e} .viewModel=${t}></arcgis-time-bar-date></div>` : a`<div class="table-extent"><arcgis-time-bar-date align=end .autoDestroyDisabled=${this.autoDestroyDisabled} class="start" .date=${e} .viewModel=${t}></arcgis-time-bar-date><div class=${l({ dash: !0, disabled: i })}></div><arcgis-time-bar-date align=start .autoDestroyDisabled=${this.autoDestroyDisabled} class="end" .date=${r} .viewModel=${t}></arcgis-time-bar-date></div>` : e ? a`<div class="table-cumulative"><span class=${l({ disabled: i, text: !0 })}>${s.from}</span><div></div><arcgis-time-bar-date align=
|
|
29
|
+
return e && r ? e.getTime() === r.getTime() ? a`<div class="table-instant"><arcgis-time-bar-date align=center .autoDestroyDisabled=${this.autoDestroyDisabled} class="end" .date=${e} .viewModel=${t}></arcgis-time-bar-date></div>` : a`<div class="table-extent"><arcgis-time-bar-date align=end .autoDestroyDisabled=${this.autoDestroyDisabled} class="start" .date=${e} .viewModel=${t}></arcgis-time-bar-date><div class=${l({ dash: !0, disabled: i })}></div><arcgis-time-bar-date align=start .autoDestroyDisabled=${this.autoDestroyDisabled} class="end" .date=${r} .viewModel=${t}></arcgis-time-bar-date></div>` : e ? a`<div class="table-cumulative"><span class=${l({ disabled: i, text: !0 })}>${s.from}</span><div></div><arcgis-time-bar-date align=start .autoDestroyDisabled=${this.autoDestroyDisabled} class="start" .date=${e} .viewModel=${t}></arcgis-time-bar-date></div>` : r ? a`<div class="table-cumulative"><span class=${l({ disabled: i, text: !0 })}>${s.through}</span><div></div><arcgis-time-bar-date align=start .autoDestroyDisabled=${this.autoDestroyDisabled} class="start" .date=${r} .viewModel=${t}></arcgis-time-bar-date></div>` : null;
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
n("arcgis-time-bar-extent", u);
|
|
@@ -4,8 +4,8 @@ import { css as m, html as r } from "lit";
|
|
|
4
4
|
import { ref as u } from "lit/directives/ref.js";
|
|
5
5
|
import l from "@arcgis/core/time/TimeExtent.js";
|
|
6
6
|
import { LitElement as h, nothing as v, safeClassMap as g } from "@arcgis/lumina";
|
|
7
|
-
const w = m`:host{background-color:var(--calcite-color-surface-2);block-size:var(--calcite-size-fixed-xxxl);color:var(--calcite-color-text-1);display:flex;flex:1 0 auto;font-family:var(--calcite-font-family);font-size:var(--calcite-font-size-sm);inline-size:auto;--arcgis-internal-time-bar-slider-tick-gap: 100}.root{align-items:center;block-size:100%;display:flex;inline-size:100%}slot[name=max],slot[name=min]{display:flex}.slider{padding-inline:var(--calcite-spacing-md);--labels-container-width: 100%}.slider-container{flex:1 1 auto;min-inline-size:calc(var(--calcite-spacing-md) * 15)}.slider--has-ticks{margin-top:calc(var(--calcite-spacing-md) * -1)}.hidden,.max-date,.min-date{flex:0 0 auto}.hidden{inline-size:0}.max-date,.min-date{inline-size:calc(var(--calcite-size-md) * 3.125)}.popover{padding:var(--calcite-spacing-xxs) var(--calcite-spacing-xs) var(--calcite-spacing-xs)}.ticks-container{flex:1;position:relative;width:100%;arcgis-ticks,>slot::slotted(arcgis-ticks){inset:0;position:absolute;white-space:nowrap;--arcgis-ticks-font-weight: var(--calcite-font-weight-normal);--arcgis-ticks-label-width: auto;--arcgis-ticks-tick-transform: unset;--arcgis-ticks-tick-width: var(--calcite-size-px)}}.slider.slider--out-of-range{--arcgis-internal-slider-handle-color: var(--calcite-color-status-danger);--arcgis-internal-slider-track-range-background-color: var(--calcite-color-status-danger)}`;
|
|
8
|
-
class
|
|
7
|
+
const w = m`:host{background-color:var(--calcite-color-surface-2);block-size:var(--calcite-size-fixed-xxxl);color:var(--calcite-color-text-1);display:flex;flex:1 0 auto;font-family:var(--calcite-font-family);font-size:var(--calcite-font-size-sm);inline-size:auto;--arcgis-internal-time-bar-slider-tick-gap: 100}.root{align-items:center;block-size:100%;display:flex;inline-size:100%}slot[name=max],slot[name=min]{display:flex}.slider{padding-inline:var(--calcite-spacing-md);--labels-container-width: 100%}.slider-container{flex:1 1 auto;min-inline-size:calc(var(--calcite-spacing-md) * 15)}.slider--has-ticks{margin-top:calc(var(--calcite-spacing-md) * -1)}.hidden,.max-date,.min-date{flex:0 0 auto}.hidden{inline-size:0}.max-date,.min-date{inline-size:calc(var(--calcite-size-md) * 3.125)}.popover{padding:var(--calcite-spacing-xxs) var(--calcite-spacing-xs) var(--calcite-spacing-xs)}.ticks-container{flex:1;position:relative;width:100%;arcgis-ticks,>slot::slotted(arcgis-ticks){inset:0;position:absolute;white-space:nowrap;--arcgis-ticks-font-weight: var(--calcite-font-weight-normal);--arcgis-ticks-label-width: auto;--arcgis-ticks-tick-transform: unset;--arcgis-ticks-tick-width: var(--calcite-size-px)}}.slider.slider--out-of-range{--arcgis-internal-slider-handle-color: var(--calcite-color-status-danger);--arcgis-internal-slider-track-range-background-color: var(--calcite-color-status-danger)}.lock-time-window{--arcgis-internal-time-bar-slider-border-margin: calc(var(--calcite-spacing-base) + 1px);border-image:linear-gradient(transparent var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) var(--arcgis-internal-time-bar-slider-border-margin),var(--calcite-action-group-border-color, var(--calcite-color-border-3)) calc(100% - var(--arcgis-internal-time-bar-slider-border-margin)),transparent var(--arcgis-internal-time-bar-slider-border-margin));border-image-slice:1;border-inline-end-style:solid;border-inline-end-width:var(--calcite-border-width-sm);padding-inline-end:var(--calcite-spacing-sm)}`;
|
|
8
|
+
class p extends h {
|
|
9
9
|
constructor() {
|
|
10
10
|
super(...arguments), this.#t = new ResizeObserver(([e]) => {
|
|
11
11
|
this._sliderWidth = e.contentRect.width;
|
|
@@ -134,7 +134,7 @@ class f extends h {
|
|
|
134
134
|
if (!e || !i || !t)
|
|
135
135
|
return null;
|
|
136
136
|
const s = this.lockTimeWindow ? "lock" : "unlock", a = this.lockTimeWindow ? e.unlockTimeWindow : e.lockTimeWindow;
|
|
137
|
-
return r`<calcite-action .active=${this.lockTimeWindow} .disabled=${t.disabled || t.mode !== "time-window"} .icon=${s} @click=${this.#c} .text=${a} title=${a ?? v}></calcite-action>`;
|
|
137
|
+
return r`<calcite-action .active=${this.lockTimeWindow} class="lock-time-window" .disabled=${t.disabled || t.mode !== "time-window"} .icon=${s} @click=${this.#c} .text=${a} title=${a ?? v}></calcite-action>`;
|
|
138
138
|
}
|
|
139
139
|
#v() {
|
|
140
140
|
const e = this.viewModel?.fullTimeExtent?.end;
|
|
@@ -145,9 +145,9 @@ class f extends h {
|
|
|
145
145
|
return this.showMin && e ? r`<slot name=min><arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} class="min-date" .date=${e} .viewModel=${this.viewModel}></arcgis-time-bar-date></slot>` : r`<div class="hidden"></div>`;
|
|
146
146
|
}
|
|
147
147
|
#w() {
|
|
148
|
-
return this.popoverDisplay !== "none" ? r`<div class="popover" slot=popover><slot name=popover>${this.#
|
|
148
|
+
return this.popoverDisplay !== "none" ? r`<div class="popover" slot=popover><slot name=popover>${this.#p()}</slot></div>` : null;
|
|
149
149
|
}
|
|
150
|
-
#
|
|
150
|
+
#p() {
|
|
151
151
|
const { activeValue: e, messages: i, viewModel: t } = this;
|
|
152
152
|
if (!e || !i || !t)
|
|
153
153
|
return null;
|
|
@@ -163,7 +163,7 @@ class f extends h {
|
|
|
163
163
|
return e instanceof Date ? r`<arcgis-time-bar-date .autoDestroyDisabled=${this.autoDestroyDisabled} .date=${e} .viewModel=${t}></arcgis-time-bar-date>` : r`<arcgis-time-bar-extent .autoDestroyDisabled=${this.autoDestroyDisabled} .messages=${i} .viewModel=${t}></arcgis-time-bar-extent>`;
|
|
164
164
|
}
|
|
165
165
|
}
|
|
166
|
-
#
|
|
166
|
+
#f() {
|
|
167
167
|
const { messages: e, viewModel: i } = this;
|
|
168
168
|
if (!i?.fullTimeExtent?.start || !i?.fullTimeExtent?.end || !e)
|
|
169
169
|
return null;
|
|
@@ -176,16 +176,16 @@ class f extends h {
|
|
|
176
176
|
slider: !0,
|
|
177
177
|
"slider--has-ticks": this.showTicks,
|
|
178
178
|
"slider--out-of-range": i.isOutOfRange
|
|
179
|
-
})} .disabled=${!i.interactive} .fillPlacement=${this._sliderFillPlacement} .max=${a} .min=${s} @arcgisActiveValueChange=${this.#d} @arcgisInput=${this.#m} .popoverLabel=${e.timeExtent} .popoverDisplay=${this.popoverDisplay === "none" ? "auto" : this.popoverDisplay} precision=0 .steps=${i.effectiveStopsEpoch} .values=${this._timeExtentEpochValues}>${this.#w()}${this.#
|
|
179
|
+
})} .disabled=${!i.interactive} .fillPlacement=${this._sliderFillPlacement} .max=${a} .min=${s} @arcgisActiveValueChange=${this.#d} @arcgisInput=${this.#m} .popoverLabel=${e.timeExtent} .popoverDisplay=${this.popoverDisplay === "none" ? "auto" : this.popoverDisplay} precision=0 .steps=${i.effectiveStopsEpoch} .values=${this._timeExtentEpochValues}>${this.#w()}${this.#b(i, s, a)}</arcgis-slider></div>`;
|
|
180
180
|
}
|
|
181
|
-
#
|
|
181
|
+
#b(e, i, t) {
|
|
182
182
|
return this.showTicks ? r`<div slot=content-end class="ticks-container"><slot name=content-end><arcgis-ticks .autoDestroyDisabled=${this.autoDestroyDisabled} .labelFormatter=${e.tickFormatter} .max=${t} .min=${i} mode=value show-labels .values=${this.#s}></arcgis-ticks></slot></div>` : null;
|
|
183
183
|
}
|
|
184
184
|
render() {
|
|
185
|
-
return r`<div class="root">${this.#h()}${this.#g()}${this.#
|
|
185
|
+
return r`<div class="root">${this.#h()}${this.#g()}${this.#f()}${this.#v()}</div>`;
|
|
186
186
|
}
|
|
187
187
|
}
|
|
188
|
-
d("arcgis-time-bar-slider",
|
|
188
|
+
d("arcgis-time-bar-slider", p);
|
|
189
189
|
export {
|
|
190
|
-
|
|
190
|
+
p as ArcgisTimeBarSlider
|
|
191
191
|
};
|