@geoscene/charts-components 5.0.19

package/dist/cdn/VQMZEOOE.js

@@ -0,0 +1,711 @@
+/* COPYRIGHT  - https://js.geoscene.cn/5.0/LICENSE.txt */
+import { a as re } from "./FEJD2JHY.js";
+import g from "./KM2WGERQ.js";
+import { a as le, h as oe } from "./ZLQXY2BV.js";
+import e from "./5752NFTR.js";
+import { l as i, m as v } from "./DPJE33GY.js";
+import { a as A } from "./VAB3BCTX.js";
+import c from "./AENRD2JF.js";
+import b from "./P5SSZWMH.js";
+import "./UG7LOBJE.js";
+import a from "./A7YNU2NS.js";
+import { B as K, f as I, g as _, n as x, s as O } from "./4B3QBH5T.js";
+import { e as L, g as N, h as H } from "./XLDY6CTA.js";
+import { c as Z } from "./KUVOINJC.js";
+import {
+  a as h,
+  b as u,
+  l as f,
+  m as k,
+  n as p,
+  w as q,
+  x as y,
+} from "./NKG4FLLR.js";
+import {
+  A as n,
+  B as F,
+  D as T,
+  F as w,
+  g as E,
+  h as r,
+  m as P,
+  x as d,
+  y as m,
+  z as D,
+} from "./KRZ433BT.js";
+import "./OR4HXHSY.js";
+export default $geoscene.t(
+  ([
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    ,
+    { F: W, G: b, Gb: R, Ia: z, Nc: j, Pb: U, Ra: B, Wd: X, a: V },
+    { s: Y },
+    { h: J },
+    { h: G, t: $ },
+    { a: Q, d: ee, e: ae, f: te, g: se, i: ie, j: S },
+  ]) => {
+    var ce = E`.hide{visibility:hidden}.am5-html-container{z-index:101!important}.am5-layer-1000{z-index:1000!important}.am5-layer-30{z-index:100!important}.show{display:block}.notifyPanel{flex:0 1 auto}.disable-interactions{pointer-events:none}.dim-text{color:var(--geoscene-charts-dim-text)}:host{display:flex;flex-direction:column;width:var(--geoscene-charts-config-calcite-block-default-width);margin:var(--geoscene-charts-config-calcite-block-default-margin);margin-top:var(--geoscene-charts-top-section-margin)}.label{display:flex;margin-left:var(--geoscene-charts-config-margin-minor);margin-right:var(--geoscene-charts-config-margin-minor);margin-bottom:var(--geoscene-charts-config-margin-minor);justify-content:space-between}.color-ramp{width:100%;height:20px;overflow:hidden;border-radius:0}.color-ramp-segment{height:100%;display:inline-block}.list{margin-left:var(--geoscene-charts-config-margin-minor);margin-right:var(--geoscene-charts-config-margin-minor);margin-bottom:var(--geoscene-charts-config-margin-major)}.accordion{margin-top:var(--geoscene-charts-config-margin-minor);margin-bottom:var(--geoscene-charts-config-margin-major)}`,
+      c = {
+        label: "label",
+        colorRamp: "color-ramp",
+        colorRampSegment: "color-ramp-segment",
+        list: "list",
+        accordion: "accordion",
+      },
+      M = class extends D {
+        constructor() {
+          super(...arguments),
+            (this._messages = A()),
+            (this.commonStrings = A({ name: "common", blocking: !0 })),
+            (this.heatChartPopover = null),
+            (this.xAxisFieldElement = d()),
+            (this.aggregationElement = d()),
+            (this.numericFieldsElement = d()),
+            (this.calendarTypeElement = d()),
+            (this.calendarViewTypeElement = d()),
+            (this.classBreakMethodElement = d()),
+            (this.nullElement = d()),
+            (this.breaksCountElement = d()),
+            (this.colorSchemeElement = d()),
+            (this.onHeatChartDataPopoverChange = async (e) => {
+              try {
+                if (e.detail?.value !== void 0) {
+                  let { contentKind: a } = e.detail,
+                    t = e.detail.value;
+                  switch (a) {
+                    case i.aggregation:
+                      (this.model.aggregationType = t),
+                        t === u.Count || t === u.Sum
+                          ? (this.model.nullPolicy = p.Zero)
+                          : (this.model.nullPolicy = p.Null);
+                      break;
+                    case i.xAxisField:
+                      (this.model.xAxisField = t),
+                        this.setDefaultPropertiesForCalendarHeatChart();
+                      break;
+                    case i.numericFields:
+                      (this.model.numericFields = [t.trim() || ""]),
+                        (this.model.numericFields ?? []).length > 0 &&
+                          this.model.aggregationType === u.Count &&
+                          this.model.numericFields[0] !==
+                            j(this.model.layer).idField &&
+                          (this.model.aggregationType = u.Sum);
+                      break;
+                    case i.calendarType: {
+                      switch (t) {
+                        case v.YearByMonthAndDayOfMonth: {
+                          let s = {
+                              type: h.CalendarDateParts,
+                              unit: f.DayOfMonth,
+                            },
+                            o = {
+                              type: h.CalendarDateParts,
+                              unit: f.MonthOfYear,
+                            };
+                          (this.model.xTemporalBinning = s),
+                            this.model.setAxisValueFormat(0, {
+                              type: h.DateAxisFormat,
+                              intlOptions: { day: "2-digit" },
+                            }),
+                            (this.model.yTemporalBinning = o),
+                            this.model.setAxisValueFormat(1, {
+                              type: h.DateAxisFormat,
+                              intlOptions: { month: "short" },
+                            });
+                          break;
+                        }
+                        case v.WeekByDayOfWeekAndHourOfDay: {
+                          let s = {
+                              type: h.CalendarDateParts,
+                              unit: f.HourOfDay,
+                            },
+                            o = {
+                              type: h.CalendarDateParts,
+                              unit: f.DayOfWeek,
+                            },
+                            { lang: l } = N(
+                              this.el ?? document.documentElement
+                            ),
+                            g = H(l),
+                            C = V.local()
+                              .setLocale(l)
+                              .startOf("week", {
+                                useLocaleWeeks: g !== L,
+                              }).weekday;
+                          (this.model.firstDayOfWeek = C),
+                            (this.model.xTemporalBinning = s),
+                            this.model.setAxisValueFormat(0, {
+                              type: h.DateAxisFormat,
+                              intlOptions: { hour: "numeric", hour12: !1 },
+                            }),
+                            (this.model.yTemporalBinning = o),
+                            this.model.setAxisValueFormat(1, {
+                              type: h.DateAxisFormat,
+                              intlOptions: { weekday: "short" },
+                            });
+                          break;
+                        }
+                        default:
+                          break;
+                      }
+                      break;
+                    }
+                    case i.calendarViewType: {
+                      this.model.viewType = t;
+                      break;
+                    }
+                    case i.classBreakMethod: {
+                      (this.model.classificationMethod = t),
+                        (this.updateChartRenderer = !0);
+                      break;
+                    }
+                    default:
+                      break;
+                  }
+                }
+              } catch (a) {
+                throw (
+                  (this.geosceneChartsConfigDataChangeError.emit({
+                    error: a,
+                    model: this.model,
+                  }),
+                  a)
+                );
+              }
+              this.removeHeatChartDataPopover(), this.requestUpdate();
+            }),
+            (this.popoverClose = (e) => {
+              this.heatChartPopover === e?.target &&
+                this.removeHeatChartDataPopover();
+            }),
+            (this.onModelConfigChange = () => {
+              X(this.model?.config) &&
+                (this.selectedColorRamp = S.defaultColorRampForCharts),
+                this.requestUpdate();
+            }),
+            (this.allColorRamps = []),
+            (this.onColorRampSelection = (e) => {
+              let { ramp: a, isFlipped: t } = e.detail;
+              (this.isFlipped = t),
+                x(this.selectedColorRamp, a) ||
+                  ((this.selectedColorRamp = a),
+                  (this.updateChartRenderer = !0),
+                  (this.updateClassBreaksColor = !0),
+                  this.generateAndUpdateClassBreaks());
+            }),
+            (this.updateClassBreaksColor = !1),
+            (this.onEmptyCellNameChange = (e) => {
+              let { name: a } = e.detail;
+              if (a !== void 0) {
+                let t = { ...this.model.emptyCell, name: a };
+                this.model.emptyCell = t;
+              }
+            }),
+            (this.onEmptyCellColorChange = (e) => {
+              let { color: a } = e.detail;
+              if (a !== void 0) {
+                let t = this.model.emptyCell,
+                  s = {
+                    ...t,
+                    symbol: {
+                      ...t?.symbol,
+                      type: K.SFS,
+                      color: a,
+                      outline: t?.symbol?.outline && {
+                        ...t.symbol.outline,
+                        color: a,
+                      },
+                    },
+                  };
+                this.model.emptyCell = s;
+              }
+            }),
+            (this.isFlipped = !1),
+            (this.availableColorRamps = []),
+            (this.updateChartRenderer = !1),
+            (this.layerFieldsInfo = []),
+            (this.geosceneChartsConfigDataChangeError = P());
+        }
+        static {
+          this.properties = {
+            availableColorRamps: 16,
+            aggregationLabel: 16,
+            selectedColorRamp: 16,
+            updateChartRenderer: 16,
+            messageOverrides: 0,
+            model: 0,
+            layerFieldsInfo: 0,
+            open: 5,
+          };
+        }
+        static {
+          this.styles = ce;
+        }
+        connectedCallback() {
+          super.connectedCallback(), this.loadColorRampFromGeoScene();
+        }
+        load() {
+          this.modelChange(this.model), this.onModelConfigChange();
+        }
+        willUpdate(e) {
+          e.has("model") && this.modelChange(this.model, e.get("model")),
+            (this.aggregationLabel = z(
+              this.model.aggregationType,
+              this.commonStrings
+            ));
+        }
+        updated(e) {
+          e.has("updateChartRenderer") &&
+            this.updateChartRenderer &&
+            this.generateAndUpdateClassBreaks();
+        }
+        disconnectedCallback() {
+          super.disconnectedCallback(),
+            this.model.removeEventListener(
+              "geosceneChartsModelConfigChange",
+              this.onModelConfigChange
+            );
+        }
+        loadColorRampFromGeoScene() {
+          let e = S.esriColorRamps;
+          (this.allColorRamps = e),
+            (this.availableColorRamps = this.allColorRamps);
+        }
+        normalizeClassBreakInfosForCompare(e, a) {
+          return (e ?? []).map(
+            ({ classMinValue: t, classMaxValue: s, label: o, symbol: l }) => ({
+              classMinValue: t,
+              classMaxValue: s,
+              label: o,
+              symbol: a ? void 0 : l,
+            })
+          );
+        }
+        async generateAndUpdateClassBreaks() {
+          let e = [],
+            a = this.model.chartRenderer?.classBreakInfos,
+            t =
+              this.requestedBreaksCount ??
+              this.model.breaksCount ??
+              B.classBreaks.breaksCount;
+          if (
+            this.model.classificationMethod === y.manual &&
+            a?.length &&
+            this.selectedColorRamp
+          ) {
+            e = _(a) ?? [];
+            let l = te({
+              numberOfClassBreaks: t,
+              selectedColorRamp: this.selectedColorRamp,
+              existingClassBreakInfos: a,
+              isFlipped: this.isFlipped,
+            });
+            e = se({ classBreakInfos: e, colors: l });
+          } else if (this.model.classificationMethod !== y.manual) {
+            let l = oe(le);
+            l &&
+              (e = await ie({
+                data: l,
+                xAxisField: this.model.xAxisField,
+                classificationMethod: this.model.classificationMethod,
+                breaksCount: this.model.breaksCount,
+                layer: this.model.layer,
+                selectedColorRamp: this.selectedColorRamp,
+                availableColorRamps: this.availableColorRamps,
+                existingClassBreakInfos: a,
+                useExistingColors: !this.updateClassBreaksColor,
+                isFlipped: this.isFlipped,
+              }));
+          }
+          let s = !this.updateClassBreaksColor,
+            o = !x(
+              this.normalizeClassBreakInfosForCompare(
+                this.model.chartRenderer?.classBreakInfos,
+                s
+              ),
+              this.normalizeClassBreakInfosForCompare(e, s)
+            );
+          if (
+            this.updateChartRenderer &&
+            o &&
+            ((this.model.chartRenderer = {
+              type: "classBreaks",
+              field: W.valueField,
+              classBreakInfos: e,
+            }),
+            this.model.heatRulesType !== k.Renderer &&
+              (this.model.heatRulesType = k.Renderer),
+            this.model.classificationMethod !== y.manual)
+          ) {
+            let l = e.length || t;
+            this.model.breaksCount !== l && (this.model.breaksCount = l);
+          }
+          (this.updateChartRenderer = !1), (this.updateClassBreaksColor = !1);
+        }
+        modelChange(e, a) {
+          a?.removeEventListener(
+            "geosceneChartsModelConfigChange",
+            this.onModelConfigChange
+          ),
+            e?.addEventListener(
+              "geosceneChartsModelConfigChange",
+              this.onModelConfigChange
+            );
+        }
+        getCorrectedXAxisFieldValue() {
+          return J({
+            fieldName: this.model.xAxisField,
+            fieldList: this.layerFieldsInfo,
+          })
+            ? ""
+            : R(this.layerFieldsInfo, this.model.xAxisField);
+        }
+        onXAxisFieldSelect(e) {
+          (this.contentKind = i.xAxisField), this.setupPopover(e);
+        }
+        onNumericFieldSelect(e) {
+          (this.contentKind = i.numericFields), this.setupPopover(e);
+        }
+        onCalendarTypeSelect(e) {
+          (this.contentKind = i.calendarType), this.setupPopover(e);
+        }
+        onClassBreakMethodSelect(e) {
+          (this.contentKind = i.classBreakMethod), this.setupPopover(e);
+        }
+        onColorSchemeSelect(e) {
+          (this.contentKind = i.colorScheme), this.setupPopover(e);
+        }
+        onBreaksCountChange(e) {
+          let a = O(e.target.value);
+          a < b.min ? (a = b.min) : a > b.max && (a = b.max),
+            U(a) &&
+              (this.breaksCountElement.value &&
+                (this.breaksCountElement.value.value = a.toString()),
+              (this.requestedBreaksCount = a),
+              (this.model.breaksCount = a),
+              (this.updateChartRenderer = !0));
+        }
+        onAggregationSelect(e) {
+          (this.contentKind = i.aggregation), this.setupPopover(e);
+        }
+        onNullSelect(e) {
+          (this.contentKind = i.null), this.setupPopover(e);
+        }
+        onIncludeLeapDayChange(e) {
+          let a = e.target.checked;
+          this.model.includeLeapDay = a;
+        }
+        onNullPolicyChange(e) {
+          this.model.nullPolicy = e.target.selectedItem.value;
+        }
+        setupPopover(e) {
+          e.stopImmediatePropagation(), this.removeHeatChartDataPopover();
+          let a,
+            t,
+            s,
+            o = this.isFlipped;
+          switch (this.contentKind) {
+            case i.aggregation:
+              (a = this.aggregationElement.value),
+                (t = this._messages.aggregationHeader),
+                (s = this.model.aggregationType);
+              break;
+            case i.xAxisField:
+              (a = this.xAxisFieldElement.value),
+                (t = this._messages.xAxisField),
+                (s = this.model.xAxisField);
+              break;
+            case i.numericFields:
+              (a = this.numericFieldsElement.value),
+                (t = this._messages.numericField),
+                (s = this.model.numericFields?.[0]);
+              break;
+            case i.calendarType:
+              (a = this.calendarTypeElement.value),
+                (t = this._messages.calendarType),
+                (s = $(this.model));
+              break;
+            case i.calendarViewType:
+              (a = this.calendarViewTypeElement.value),
+                (t = this._messages.viewType),
+                (s = this.model.viewType);
+              break;
+            case i.classBreakMethod:
+              (a = this.classBreakMethodElement.value),
+                (t = this._messages.method),
+                (s = this.model.classificationMethod);
+              break;
+            case i.colorScheme:
+              (a = this.colorSchemeElement.value),
+                (t = this._messages.colorScheme);
+              let l = ee(
+                this.model.chartRenderer?.classBreakInfos,
+                this.availableColorRamps
+              );
+              s = this.selectedColorRamp?.name ?? l?.name;
+              let g = l
+                ? l.colorsForClassBreaks.find(
+                    (C) => C.numClasses === this.model.breaksCount
+                  )?.colors
+                : void 0;
+              o = g ? ae(g, this.model.chartRenderer?.classBreakInfos) : o;
+              break;
+            case i.null:
+              (a = e.target), (t = this._messages.null);
+              break;
+          }
+          (this.heatChartPopover = T(
+            r`<geoscene-charts-config-heat-chart-popover .headingTitle=${t} .referenceElement=${a} open .contentKind=${this.contentKind} .model=${this.model} .layerFieldsInfo=${this.layerFieldsInfo} .selectedContent=${s} @geosceneChartsConfigHeatChartDataPopoverChange=${this.onHeatChartDataPopoverChange} @geosceneChartsConfigPopoverClose=${this.popoverClose} .colorRamps=${this.availableColorRamps} @geosceneChartsConfigHeatChartColorRampChange=${this.onColorRampSelection} @geosceneChartsConfigPopoverEmptyCellColorChange=${this.onEmptyCellColorChange} @geosceneChartsConfigPopoverEmptyCellNameChange=${this.onEmptyCellNameChange} .isFlipped=${o}></geoscene-charts-config-heat-chart-popover>`
+          )),
+            !document.body.contains(this.heatChartPopover) &&
+              this.heatChartPopover !== null &&
+              document.body.appendChild(this.heatChartPopover);
+        }
+        removeHeatChartDataPopover() {
+          this.heatChartPopover !== null &&
+            ((this.heatChartPopover.open = !1),
+            (this.heatChartPopover = re(this.heatChartPopover)));
+        }
+        setDefaultPropertiesForCalendarHeatChart() {
+          if (!Y(this.model?.config)) {
+            if (this.model.xTemporalBinning === void 0) {
+              let e = { type: h.CalendarDateParts, unit: f.DayOfMonth };
+              this.model.xTemporalBinning = e;
+            }
+            if (
+              ((this.model.yAxisField = this.model.xAxisField),
+              this.model.setYAxisSortOrder(Z.Desc),
+              this.model.yTemporalBinning === void 0)
+            ) {
+              let e = { type: h.CalendarDateParts, unit: f.MonthOfYear };
+              (this.model.yTemporalBinning = e),
+                this.model.setAxisValueFormat(1, {
+                  type: h.DateAxisFormat,
+                  intlOptions: { month: "short" },
+                });
+            }
+            this.model.classificationMethod === void 0 &&
+              (this.model.classificationMethod = y.naturalBreaks),
+              this.model.heatRulesType !== k.Renderer &&
+                (this.model.heatRulesType = k.Renderer),
+              this.model.viewType === void 0 &&
+                (this.model.viewType = q.singleCalendarView),
+              (this.model.aggregationType === u.Count ||
+                this.model.aggregationType === u.Sum) &&
+                this.model.nullPolicy !== p.Zero &&
+                (this.model.nullPolicy = p.Zero);
+          }
+        }
+        renderXAxisFieldSelect() {
+          let e = this.getCorrectedXAxisFieldValue();
+          return r`<geoscene-charts-config-field-select .label=${e} @click=${
+            this.onXAxisFieldSelect
+          } ${m(
+            this.xAxisFieldElement
+          )}></geoscene-charts-config-field-select>`;
+        }
+        renderAggregation() {
+          return r`<geoscene-charts-config-field-select .label=${
+            this.model.aggregationType === u.NoAggregation
+              ? this._messages.noAggregation
+              : this.aggregationLabel
+          } @click=${this.onAggregationSelect} ${m(
+            this.aggregationElement
+          )}></geoscene-charts-config-field-select>`;
+        }
+        renderNumericFieldsSelect() {
+          let e =
+            this.model.numericFields?.[0] === this.model.layer?.objectIdField
+              ? ""
+              : R(this.layerFieldsInfo, this.model.numericFields?.[0]);
+          return r`<geoscene-charts-config-field-select .label=${e} @click=${
+            this.onNumericFieldSelect
+          } ${m(
+            this.numericFieldsElement
+          )}></geoscene-charts-config-field-select>`;
+        }
+        renderCalendarTypeSelect() {
+          let e = $(this.model) ?? "",
+            a = {
+              weekByDayOfWeekAndHourOfDay:
+                this._messages.weekByDayOfWeekAndHourOfDay,
+              yearByMonthAndDayOfMonth: this._messages.yearByMonthAndDayOfMonth,
+            },
+            t = e ? a[e] ?? "" : "";
+          return r`<geoscene-charts-config-field-select .label=${t} @click=${
+            this.onCalendarTypeSelect
+          } ${m(
+            this.calendarTypeElement
+          )}></geoscene-charts-config-field-select>`;
+        }
+        renderClassBreakMethodSelect() {
+          let e = {
+              equalInterval: this._messages.classBreaksMethod?.equalInterval,
+              manual: this._messages.classBreaksMethod?.manual,
+              naturalBreaks: this._messages.classBreaksMethod?.naturalBreaks,
+              quantile: this._messages.classBreaksMethod?.quantile,
+            },
+            a = this.model.classificationMethod
+              ? e[I(this.model.classificationMethod)] ?? ""
+              : "";
+          return r`<geoscene-charts-config-field-select .label=${a} @click=${
+            this.onClassBreakMethodSelect
+          } ${m(
+            this.classBreakMethodElement
+          )}></geoscene-charts-config-field-select>`;
+        }
+        renderColorRampSelect() {
+          let e = this.model.chartRenderer?.classBreakInfos?.map((a) => {
+            let t = a !== void 0 ? Q(a.symbol.color) : "#FFFFFF";
+            return r`<div class=${n(c.colorRampSegment)} style=${F({
+              backgroundColor: t,
+              width: `${100 / this.model.breaksCount}%`,
+            })}></div>`;
+          });
+          return r`<geoscene-charts-config-field-select label @click=${
+            this.onColorSchemeSelect
+          } ${m(this.colorSchemeElement)}><div slot=fieldSelectSlot class=${n(
+            c.colorRamp
+          )}>${e}</div></geoscene-charts-config-field-select>`;
+        }
+        renderClassBreaksTable() {
+          let e = this.model.chartRenderer?.classBreakInfos ?? [];
+          return r`<calcite-table caption="Simple table"><calcite-table-row slot=table-header><calcite-table-header .heading=${
+            this._messages.symbol
+          }></calcite-table-header><calcite-table-header .heading=${
+            this._messages.upperValue
+          }></calcite-table-header></calcite-table-row>${e.map(
+            (a) =>
+              r`<calcite-table-row><calcite-table-cell><calcite-swatch label scale=m .color=${`rgba(${
+                a.symbol.color?.[0]
+              }, ${a.symbol.color?.[1]}, ${a.symbol.color?.[2]}, ${
+                a.symbol.color?.[3] / 255
+              })`}></calcite-swatch></calcite-table-cell><calcite-table-cell>${
+                a.label
+              }</calcite-table-cell></calcite-table-row>`
+          )}</calcite-table>`;
+        }
+        renderNullUI() {
+          let e = this.model.emptyCell,
+            a = this._messages.null,
+            t = e?.symbol?.color ?? B.grayColor,
+            [s, o, l, g] = [...t],
+            C = `rgba(${s},${o},${l},${g / 255})`;
+          return r`<calcite-list label class=${n(
+            c.list
+          )} selection-mode=none ${m(
+            this.nullElement
+          )}><calcite-list-item .label=${a} .value=${a} @calciteListItemSelect=${
+            this.onNullSelect
+          }><calcite-icon icon=square-f style=${F({
+            color: C,
+          })} slot=content-end></calcite-icon></calcite-list-item></calcite-list>`;
+        }
+        renderEmptyBins() {
+          return r`<calcite-radio-button-group name=empty-bins layout=vertical @calciteRadioButtonGroupChange=${
+            this.onNullPolicyChange
+          }><calcite-label layout=inline><calcite-radio-button .value=${
+            p.Zero
+          } .checked=${
+            this.model.nullPolicy === p.Zero
+          }></calcite-radio-button>${
+            this._messages.treatAsZero
+          }</calcite-label><calcite-label layout=inline><calcite-radio-button .value=${
+            p.Null
+          } .checked=${
+            this.model.nullPolicy === p.Null
+          }></calcite-radio-button>${
+            this._messages.treatAsNull
+          }</calcite-label></calcite-radio-button-group>`;
+        }
+        render() {
+          let e = this.renderXAxisFieldSelect(),
+            a = this.renderAggregation(),
+            t = this.renderNumericFieldsSelect(),
+            s = this.renderCalendarTypeSelect(),
+            o = this.renderClassBreakMethodSelect(),
+            l = this.renderColorRampSelect(),
+            g = this.renderClassBreaksTable(),
+            C = this.renderNullUI(),
+            ne = this.renderEmptyBins();
+          return r`<calcite-label class=${n(c.label)}>${
+            this._messages.dateRequired
+          }${e}</calcite-label><calcite-label class=${n(c.label)}>${
+            this._messages.calendarType
+          }${s}</calcite-label><calcite-label class=${n(c.label)}>${
+            this._messages.aggregation
+          }${a}</calcite-label><calcite-label class=${n(c.label)}>${
+            this._messages.numericField
+          }${t}</calcite-label><calcite-label class=${n(c.label)}>${
+            this._messages.method
+          }${o}</calcite-label><calcite-label class=${n(c.label)}>${
+            this._messages.numberOfClasses
+          }<calcite-input type=number .min=${b.min} .max=${b.max} .disabled=${
+            this.model.classificationMethod === void 0 ||
+            this.model.classificationMethod === y.manual
+          } step=1 .value=${G(this.model.breaksCount, 5)} @calciteInputInput=${
+            this.onBreaksCountChange
+          } ${m(
+            this.breaksCountElement
+          )}></calcite-input></calcite-label><calcite-label class=${n(
+            c.label
+          )}>${
+            this._messages.colorScheme
+          }${l}</calcite-label>${C}<calcite-accordion class=${n(
+            c.accordion
+          )} appearance=transparent selection-mode=single><calcite-accordion-item .heading=${
+            this._messages.classBreaks
+          }>${g}</calcite-accordion-item></calcite-accordion><calcite-label class=${n(
+            c.label
+          )}>${this._messages.emptyBins}${ne}</calcite-label>${
+            $(this.model) === v.YearByMonthAndDayOfMonth
+              ? r`<calcite-label class=${n(
+                  c.label
+                )} layout=inline-space-between>${
+                  this._messages.includeLeapDay
+                }<calcite-switch .checked=${
+                  this.model.includeLeapDay
+                } @calciteSwitchChange=${
+                  this.onIncludeLeapDayChange
+                }></calcite-switch></calcite-label>`
+              : null
+          }`;
+        }
+      };
+    w("geoscene-charts-config-heat-chart-data", M);
+    return M;
+  },
+  "Graphic",
+  "renderers/support/jsonUtils",
+  "symbols/support/symbolUtils",
+  "intl",
+  "layers/support/FeatureFilter",
+  "smartMapping/statistics/histogram",
+  "smartMapping/statistics/summaryStatistics",
+  "request",
+  "core/sql",
+  "AttributeBinsGraphic",
+  "geometry/support/jsonUtils",
+  "rest/support/AttributeBinsQuery",
+  "rest/support/StatisticDefinition",
+  "time/TimeExtent",
+  "core/promiseUtils",
+  a,
+  b,
+  c,
+  e,
+  g
+);