@esri/calcite-components 2.2.0-next.11 → 2.2.0-next.12

package/dist/cjs/calcite-meter.cjs.entry.js

@@ -1,21 +1,21 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.11
+ * v2.2.0-next.12
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-8b34daf0.js');
-const loadable = require('./loadable-64558297.js');
-const form = require('./form-89e59b29.js');
-const locale = require('./locale-92847a13.js');
-const dom = require('./dom-96b95ba5.js');
-const observers = require('./observers-72601b59.js');
-require('./key-89f3021a.js');
-require('./guid-f81db95d.js');
-require('./resources-1e439750.js');
+const index = require('./index-41b2d7a6.js');
+const loadable = require('./loadable-d0df67a5.js');
+const form = require('./form-0723d4c5.js');
+const locale = require('./locale-3660b9d2.js');
+const dom = require('./dom-8573aa26.js');
+const observers = require('./observers-beba3aca.js');
+require('./key-451c1254.js');
+require('./guid-ce508a49.js');
+require('./resources-91df8f40.js');
 
 const CSS = {
     container: "container",

package/dist/cjs/calcite-meter.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-meter.entry.cjs.js","mappings":"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","names":["createObserver","locale","getSupportedLocale","numberStringFormatter","setUpLoadableComponent","afterConnectDefaultValueSet","setComponentLoaded","connectLocalized","connectForm","disconnectLocalized","disconnectForm","intersects","h","Host"],"sources":["src/components/meter/resources.ts","src/components/meter/meter.scss?tag=calcite-meter&encapsulation=shadow","src/components/meter/meter.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  fill: \"fill\",\n  stepLine: \"step-line\",\n  label: \"label\",\n  labelHidden: \"label-hidden\",\n  labelRange: \"label-range\",\n  labelValue: \"label-value\",\n  unitLabel: \"unit-label\",\n  stepsVisible: \"steps-visible\",\n  valueVisible: \"value-visible\",\n  success: \"fill-success\",\n  warning: \"fill-warning\",\n  danger: \"fill-danger\",\n};\n","@include base-component();\n@include disabled();\n\n:host {\n  @apply flex;\n  --calcite-meter-space-internal: theme(\"spacing[0.5]\");\n  --calcite-meter-height-internal: theme(\"spacing.4\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size--1);\n}\n\n:host([scale=\"s\"]) {\n  --calcite-meter-height-internal: theme(\"spacing.3\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size--2);\n}\n\n:host([scale=\"l\"]) {\n  --calcite-meter-height-internal: theme(\"spacing.6\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size-0);\n}\n\n.container {\n  @apply flex relative items-center w-full m-0;\n  block-size: var(--calcite-meter-height-internal);\n  background-color: var(--calcite-color-foreground-2);\n  border: 1px solid var(--calcite-color-border-3);\n  border-radius: var(--calcite-meter-height-internal);\n}\n\n.solid {\n  border: 1px solid var(--calcite-color-foreground-3);\n  background-color: var(--calcite-color-foreground-3);\n}\n\n.outline {\n  @apply bg-transparent;\n}\n\n.value-visible {\n  margin-block-start: theme(\"spacing.6\");\n}\n\n.steps-visible {\n  margin-block-end: theme(\"spacing.6\");\n}\n\n.step-line {\n  @apply block absolute inset-y-0;\n  inline-size: var(--calcite-meter-space-internal);\n  background-color: var(--calcite-color-border-3);\n}\n\n.label {\n  @apply absolute;\n  font-size: var(--calcite-meter-font-size-internal);\n}\n\n.label-hidden {\n  @apply invisible opacity-0;\n}\n\n.label-value {\n  inset-block-end: calc(100% + 0.5em);\n  font-weight: var(--calcite-font-weight-bold);\n  color: var(--calcite-color-text-1);\n}\n\n.label-range {\n  @apply text-color-3;\n  inset-block-start: calc(100% + 0.5em);\n}\n\n.unit-label {\n  @apply text-color-3 font-medium;\n}\n\n.label-value .unit-label {\n  @apply text-color-2 font-bold;\n}\n\n.fill {\n  @apply block absolute duration-150 ease-in-out bg-brand z-default;\n  inset-inline-start: var(--calcite-meter-space-internal);\n  inset-block: var(--calcite-meter-space-internal);\n  border-radius: var(--calcite-meter-height-internal);\n  max-inline-size: calc(100% - (var(--calcite-meter-space-internal) * 2));\n  min-inline-size: calc(var(--calcite-meter-height-internal) - (var(--calcite-meter-space-internal) * 2));\n  transition-property: inline-size, background-color, box-shadow;\n}\n\n.fill-danger {\n  background-color: var(--calcite-color-status-danger);\n}\n\n.fill-success {\n  background-color: var(--calcite-color-status-success);\n}\n\n.fill-warning {\n  background-color: var(--calcite-color-status-warning);\n}\n\n.solid .fill {\n  inset-block: 0;\n  inset-inline-start: 0;\n  max-inline-size: 100%;\n  min-inline-size: calc(var(--calcite-meter-height-internal));\n  box-shadow: 0 0 0 1px var(--calcite-color-brand);\n}\n\n.solid .fill-danger {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-danger);\n}\n\n.solid .fill-success {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-success);\n}\n\n.solid .fill-warning {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-warning);\n}\n","import { Component, Element, h, Host, Prop, State, VNode, Watch } from \"@stencil/core\";\nimport { Appearance, Scale } from \"../interfaces\";\nimport { CSS } from \"./resources\";\n\nimport {\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\nimport {\n  afterConnectDefaultValueSet,\n  connectForm,\n  disconnectForm,\n  FormComponent,\n} from \"../../utils/form\";\n\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  getSupportedLocale,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n  SupportedLocale,\n} from \"../../utils/locale\";\nimport { intersects } from \"../../utils/dom\";\nimport { createObserver } from \"../../utils/observers\";\nimport { MeterLabelType } from \"./interfaces\";\n\n@Component({\n  tag: \"calcite-meter\",\n  styleUrl: \"meter.scss\",\n  shadow: true,\n})\nexport class Meter implements FormComponent, LoadableComponent, LocalizedComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** Specifies the appearance style of the component. */\n  @Prop({ reflect: true }) appearance: Extract<\"outline\" | \"outline-fill\" | \"solid\", Appearance> =\n    \"outline-fill\";\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Specifies the component's display, where `\"single\"` displays a single color and `\"range\"` displays a range of colors based on provided `low`, `high`, `min` or `max` values. */\n  @Prop({ reflect: true }) fillType: \"single\" | \"range\" = \"range\";\n\n  /**\n   * The ID of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true }) form: string;\n\n  /** When `true`, number values are displayed with a group separator corresponding to the language and country format. */\n  @Prop({ reflect: true }) groupSeparator = false;\n\n  /** Specifies a high value.  When `fillType` is `\"range\"`, displays a different color when above the specified threshold.  */\n  @Prop({ reflect: true, mutable: true }) high: number;\n\n  /**  Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies a low value.  When `fillType` is `\"range\"`, displays a different color when above the specified threshold.  */\n  @Prop({ reflect: true, mutable: true }) low: number;\n\n  /** Specifies the highest allowed value of the component. */\n  @Prop({ reflect: true }) max = 100;\n\n  /** Specifies the lowest allowed value of the component. */\n  @Prop({ reflect: true }) min = 0;\n\n  @Watch(\"min\")\n  @Watch(\"max\")\n  @Watch(\"low\")\n  @Watch(\"high\")\n  @Watch(\"value\")\n  handleRangeChange(): void {\n    this.calculateValues();\n    this.updateLabels();\n  }\n\n  /**\n   * Specifies the name of the component.\n   *\n   * Required to pass the component's `value` on form submission.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /** Specifies the Unicode numeral system used by the component for localization. */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /** When `true`, displays the values of `high`, `low`, `min`, and `max`. */\n  @Prop({ reflect: true }) rangeLabels = false;\n\n  /** When either `rangeLabels` is `true`, specifies the format of displayed labels. */\n  @Prop({ reflect: true }) rangeLabelType: MeterLabelType = \"percent\";\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** When `labelType` is `\"units\"` and either `valueLabel` or `rangeLabels` are `true`, displays beside the `value` and/or  `min` values. */\n  @Prop() unitLabel = \"\";\n\n  /** Specifies the current value of the component. */\n  @Prop({ mutable: true }) value: number;\n\n  /** When `true`, displays the current value. */\n  @Prop({ reflect: true }) valueLabel = false;\n\n  /** When either `valueLabel` is `true`, specifies the format of displayed label. */\n  @Prop({ reflect: true }) valueLabelType: MeterLabelType = \"percent\";\n\n  @Watch(\"rangeLabels\")\n  @Watch(\"rangeLabelType\")\n  @Watch(\"unitLabel\")\n  @Watch(\"valueLabel\")\n  @Watch(\"valueLabelType\")\n  handleLabelChange(): void {\n    this.updateLabels();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    this.calculateValues();\n    afterConnectDefaultValueSet(this, this.value);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n    this.updateLabels();\n  }\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectForm(this);\n    this.resizeObserver?.observe(this.el);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectForm(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteMeterElement;\n\n  defaultValue: Meter[\"value\"];\n\n  formEl: HTMLFormElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  private highLabelEl: HTMLDivElement;\n\n  private labelFlipMax = 0.8;\n\n  private labelFlipProximity = 0.15;\n\n  private lowLabelEl: HTMLDivElement;\n\n  private maxLabelEl: HTMLDivElement;\n\n  private maxPercent = 100;\n\n  private meterContainerEl: HTMLDivElement;\n\n  private minLabelEl: HTMLDivElement;\n\n  private minPercent = 0;\n\n  private percentFormatting: {\n    formatter: Intl.NumberFormat;\n    locale: SupportedLocale;\n  };\n\n  private resizeObserver = createObserver(\"resize\", () => this.resizeHandler());\n\n  private valueLabelEl: HTMLDivElement;\n\n  @State() currentPercent: number;\n\n  @State() effectiveLocale: string;\n\n  @State() highActive: boolean;\n\n  @State() highPercent: number;\n\n  @State() lowActive: boolean;\n\n  @State() lowPercent: number;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private resizeHandler(): void {\n    this.updateLabels();\n  }\n\n  private updateLabels(): void {\n    if (this.valueLabelEl) {\n      this.determineValueLabelPosition();\n    }\n    if (this.rangeLabels) {\n      this.determineVisibleLabels();\n    }\n  }\n\n  private calculateValues(): void {\n    const { min, max, low, high, value } = this;\n    const lowPercent = (100 * (low - min)) / (max - min);\n    const highPercent = (100 * (high - min)) / (max - min);\n    const currentPercent = (100 * (value - min)) / (max - min);\n\n    if (!low || low < min || low > high || low > max) {\n      this.low = min;\n    }\n    if (!high || high > max || high < low || high < min) {\n      this.high = max;\n    }\n    if (!value) {\n      this.value = min;\n    }\n\n    this.lowPercent = lowPercent;\n    this.highPercent = highPercent;\n    this.currentPercent = value ? currentPercent : 0;\n    this.lowActive = !!low && low > min && (!value || low > value) && (!high || low < high);\n    this.highActive =\n      !!high && min <= high && high < max && (!value || high > value) && (!low || high > low);\n  }\n\n  private formatLabel = (value: number, labelType: MeterLabelType): string => {\n    if (labelType === \"percent\") {\n      if (!this.percentFormatting) {\n        const locale = getSupportedLocale(this.effectiveLocale);\n        const formatter = new Intl.NumberFormat(locale, {\n          useGrouping: this.groupSeparator,\n          style: \"percent\",\n        });\n        this.percentFormatting = { formatter, locale };\n      }\n      return this.percentFormatting.formatter.format(value);\n    } else {\n      numberStringFormatter.numberFormatOptions = {\n        locale: this.effectiveLocale,\n        numberingSystem: this.numberingSystem,\n        useGrouping: this.groupSeparator,\n      };\n      return numberStringFormatter.localize(value.toString());\n    }\n  };\n\n  private getMeterKindCssClass(): string {\n    const { low, high, min, max, value } = this;\n    const lowest = low ? low : min;\n    const highest = high ? high : max;\n    const aboveLowest = value >= lowest;\n    const belowLowest = value < lowest;\n    const aboveHighest = value >= highest;\n    const belowHighest = value < highest;\n\n    if (!value || (!low && belowHighest) || belowLowest) {\n      return CSS.success;\n    } else if (aboveLowest && belowHighest) {\n      return CSS.warning;\n    } else if (aboveHighest) {\n      return CSS.danger;\n    } else {\n      return CSS.success;\n    }\n  }\n\n  private intersects(el1: HTMLDivElement, el2: HTMLDivElement): boolean {\n    return el1 && el2 && intersects(el1.getBoundingClientRect(), el2.getBoundingClientRect());\n  }\n\n  private determineVisibleLabels(): void {\n    const { minLabelEl, lowLabelEl, highLabelEl, maxLabelEl } = this;\n    const highMaxOverlap = this.intersects(highLabelEl, maxLabelEl);\n    const lowHighOverlap = this.intersects(lowLabelEl, highLabelEl);\n    const lowMaxOverlap = this.intersects(lowLabelEl, maxLabelEl);\n    const minHighOverlap = this.intersects(minLabelEl, highLabelEl);\n    const minLowOverlap = this.intersects(minLabelEl, lowLabelEl);\n    const minMaxOverlap = this.intersects(minLabelEl, maxLabelEl);\n    const hiddenClass = CSS.labelHidden;\n\n    if (lowLabelEl) {\n      if (minLowOverlap || lowMaxOverlap || lowHighOverlap) {\n        lowLabelEl.classList.add(hiddenClass);\n      } else {\n        lowLabelEl.classList.remove(hiddenClass);\n      }\n    }\n\n    if (highLabelEl) {\n      if (minHighOverlap || lowMaxOverlap || highMaxOverlap) {\n        highLabelEl.classList.add(hiddenClass);\n      } else {\n        highLabelEl.classList.remove(hiddenClass);\n      }\n    }\n\n    if (minLabelEl && maxLabelEl) {\n      if (minMaxOverlap) {\n        maxLabelEl.classList.add(hiddenClass);\n      } else {\n        maxLabelEl.classList.remove(hiddenClass);\n      }\n    }\n  }\n\n  private determineValueLabelPosition(): void {\n    const { valueLabelEl, meterContainerEl, currentPercent } = this;\n    const valuePosition = currentPercent > 100 ? 100 : currentPercent > 0 ? currentPercent : 0;\n    const valueLabelWidth = valueLabelEl.getBoundingClientRect().width;\n    const containerWidth = meterContainerEl.getBoundingClientRect().width;\n    const labelWidthPercent = (100 * (valueLabelWidth - 0)) / (containerWidth - 0);\n\n    if (valuePosition + labelWidthPercent >= 100) {\n      valueLabelEl.style.insetInlineEnd = \"0%\";\n      valueLabelEl.style.removeProperty(\"inset-inline-start\");\n    } else {\n      valueLabelEl.style.insetInlineStart = `${valuePosition}% `;\n      valueLabelEl.style.removeProperty(\"inset-inline-end\");\n    }\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  renderMeterFill(): VNode {\n    const { currentPercent, fillType } = this;\n    const kindClass = this.getMeterKindCssClass();\n    return (\n      <div\n        class={{ [CSS.fill]: true, [kindClass]: fillType !== \"single\" }}\n        style={{ width: `${currentPercent}%` }}\n      />\n    );\n  }\n\n  renderRangeLine(position: number): VNode {\n    const style = { insetInlineStart: `${position}%` };\n    return <div class={CSS.stepLine} style={style} />;\n  }\n\n  renderValueLabel(): VNode {\n    const { currentPercent, valueLabelType, unitLabel, value } = this;\n    const label = this.formatLabel(\n      valueLabelType === \"percent\" ? currentPercent / 100 : value || 0,\n      valueLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelValue]: true }}\n        key=\"low-label-line\"\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.valueLabelEl = el)}\n      >\n        {label}\n        {unitLabel && valueLabelType !== \"percent\" && (\n          <span class={CSS.unitLabel}>&nbsp;{unitLabel}</span>\n        )}\n      </div>\n    );\n  }\n\n  renderMinLabel(): VNode {\n    const { rangeLabelType, min, minPercent, unitLabel } = this;\n    const style = { insetInlineStart: `${minPercent}%` };\n    const labelMin = this.formatLabel(\n      rangeLabelType === \"percent\" ? minPercent : min,\n      rangeLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"min-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.minLabelEl = el)}\n      >\n        {labelMin}\n        {unitLabel && rangeLabelType !== \"percent\" && (\n          <span class={CSS.unitLabel}>&nbsp;{unitLabel}</span>\n        )}\n      </div>\n    );\n  }\n\n  renderLowLabel(): VNode {\n    const { rangeLabelType, low, lowPercent, highPercent, labelFlipProximity } = this;\n    const label = low\n      ? this.formatLabel(rangeLabelType === \"percent\" ? lowPercent / 100 : low, rangeLabelType)\n      : \"\";\n    const styleDefault = { insetInlineStart: `${lowPercent}%` };\n    const styleFlipped = { insetInlineEnd: `${100 - lowPercent}%` };\n    const style =\n      (highPercent - lowPercent) / 100 < labelFlipProximity ? styleFlipped : styleDefault;\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"low-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.lowLabelEl = el)}\n      >\n        {label}\n      </div>\n    );\n  }\n\n  renderHighLabel(): VNode {\n    const { rangeLabelType, high, highPercent, labelFlipMax } = this;\n    const label = high\n      ? this.formatLabel(rangeLabelType === \"percent\" ? highPercent / 100 : high, rangeLabelType)\n      : \"\";\n    const styleDefault = { insetInlineStart: `${highPercent}%` };\n    const styleFlipped = { insetInlineEnd: `${100 - highPercent}%` };\n    const style = highPercent / 100 >= labelFlipMax ? styleFlipped : styleDefault;\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"high-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.highLabelEl = el as HTMLDivElement)}\n      >\n        {label}\n      </div>\n    );\n  }\n\n  renderMaxLabel(): VNode {\n    const { rangeLabelType, max, maxPercent } = this;\n    const style = { insetInlineEnd: `${100 - maxPercent}%` };\n    const labelMax = this.formatLabel(\n      rangeLabelType === \"percent\" ? maxPercent / 100 : max,\n      rangeLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"max-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.maxLabelEl = el as HTMLDivElement)}\n      >\n        {labelMax}\n      </div>\n    );\n  }\n\n  render(): VNode {\n    const {\n      appearance,\n      currentPercent,\n      highActive,\n      highPercent,\n      label,\n      lowActive,\n      lowPercent,\n      max,\n      maxPercent,\n      min,\n      minPercent,\n      rangeLabels,\n      rangeLabelType,\n      unitLabel,\n      value,\n      valueLabel,\n      valueLabelType,\n    } = this;\n    const textPercentLabelWithPercent = this.formatLabel(currentPercent / 100, \"percent\");\n    const textUnitLabel = `${value} ${unitLabel}`;\n    const valueText =\n      valueLabelType === \"percent\"\n        ? textPercentLabelWithPercent\n        : unitLabel\n          ? textUnitLabel\n          : undefined;\n    return (\n      <Host>\n        <div\n          aria-label={label}\n          aria-valuemax={rangeLabelType === \"percent\" ? maxPercent : max}\n          aria-valuemin={rangeLabelType === \"percent\" ? minPercent : min}\n          aria-valuenow={valueLabelType === \"percent\" ? currentPercent : value}\n          aria-valuetext={valueText}\n          class={{\n            [CSS.container]: true,\n            [CSS.stepsVisible]: rangeLabels,\n            [CSS.valueVisible]: valueLabel,\n            [appearance]: appearance !== \"outline-fill\",\n          }}\n          role=\"meter\"\n          // eslint-disable-next-line react/jsx-sort-props\n          ref={(el) => (this.meterContainerEl = el as HTMLDivElement)}\n        >\n          {this.renderMeterFill()}\n          {valueLabel && this.renderValueLabel()}\n          {lowActive && this.renderRangeLine(lowPercent)}\n          {highActive && this.renderRangeLine(highPercent)}\n          {rangeLabels && this.renderMinLabel()}\n          {rangeLabels && lowActive && this.renderLowLabel()}\n          {rangeLabels && highActive && this.renderHighLabel()}\n          {rangeLabels && this.renderMaxLabel()}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"calcite-meter.entry.cjs.js","mappings":";;;;;;;;;;;;;;;;;;;AAAO,MAAM,GAAG,GAAG;IACjB,SAAS,EAAE,WAAW;IACtB,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,WAAW;IACrB,KAAK,EAAE,OAAO;IACd,WAAW,EAAE,cAAc;IAC3B,UAAU,EAAE,aAAa;IACzB,UAAU,EAAE,aAAa;IACzB,SAAS,EAAE,YAAY;IACvB,YAAY,EAAE,eAAe;IAC7B,YAAY,EAAE,eAAe;IAC7B,OAAO,EAAE,cAAc;IACvB,OAAO,EAAE,cAAc;IACvB,MAAM,EAAE,aAAa;CACtB;;ACdD,MAAM,QAAQ,GAAG,gmGAAgmG;;MCmCpmG,KAAK;;;QAyIR,iBAAY,GAAG,GAAG,CAAC;QAEnB,uBAAkB,GAAG,IAAI,CAAC;QAM1B,eAAU,GAAG,GAAG,CAAC;QAMjB,eAAU,GAAG,CAAC,CAAC;QAOf,mBAAc,GAAGA,wBAAc,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,CAAC,CAAC;QA2DtE,gBAAW,GAAG,CAAC,KAAa,EAAE,SAAyB;YAC7D,IAAI,SAAS,KAAK,SAAS,EAAE;gBAC3B,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;oBAC3B,MAAMC,QAAM,GAAGC,yBAAkB,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;oBACxD,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,YAAY,CAACD,QAAM,EAAE;wBAC9C,WAAW,EAAE,IAAI,CAAC,cAAc;wBAChC,KAAK,EAAE,SAAS;qBACjB,CAAC,CAAC;oBACH,IAAI,CAAC,iBAAiB,GAAG,EAAE,SAAS,UAAEA,QAAM,EAAE,CAAC;iBAChD;gBACD,OAAO,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;aACvD;iBAAM;gBACLE,4BAAqB,CAAC,mBAAmB,GAAG;oBAC1C,MAAM,EAAE,IAAI,CAAC,eAAe;oBAC5B,eAAe,EAAE,IAAI,CAAC,eAAe;oBACrC,WAAW,EAAE,IAAI,CAAC,cAAc;iBACjC,CAAC;gBACF,OAAOA,4BAAqB,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;aACzD;SACF,CAAC;0BAnOA,cAAc;wBAGoB,KAAK;wBAGe,OAAO;;8BAUrB,KAAK;;;;mBAYhB,GAAG;mBAGH,CAAC;;;2BAuBO,KAAK;8BAGc,SAAS;qBAG3B,GAAG;yBAGvB,EAAE;;0BAMgB,KAAK;8BAGe,SAAS;;;;;;;;IAlCnE,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAsCD,iBAAiB;QACf,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;;;;;;IAQD,MAAM,iBAAiB;QACrBC,+BAAsB,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,eAAe,EAAE,CAAC;QACvBC,gCAA2B,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;KAC/C;IAED,gBAAgB;QACdC,2BAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAED,iBAAiB;QACfC,uBAAgB,CAAC,IAAI,CAAC,CAAC;QACvBC,gBAAW,CAAC,IAAI,CAAC,CAAC;QAClB,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACvC;IAED,oBAAoB;QAClBC,0BAAmB,CAAC,IAAI,CAAC,CAAC;QAC1BC,mBAAc,CAAC,IAAI,CAAC,CAAC;QACrB,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE,CAAC;KACnC;;;;;;IA6DO,aAAa;QACnB,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAEO,YAAY;QAClB,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,2BAA2B,EAAE,CAAC;SACpC;QACD,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,IAAI,CAAC,sBAAsB,EAAE,CAAC;SAC/B;KACF;IAEO,eAAe;QACrB,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QAC5C,MAAM,UAAU,GAAG,CAAC,GAAG,IAAI,GAAG,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC,CAAC;QACrD,MAAM,WAAW,GAAG,CAAC,GAAG,IAAI,IAAI,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC,CAAC;QACvD,MAAM,cAAc,GAAG,CAAC,GAAG,IAAI,KAAK,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC,CAAC;QAE3D,IAAI,CAAC,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,IAAI,IAAI,GAAG,GAAG,GAAG,EAAE;YAChD,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;SAChB;QACD,IAAI,CAAC,IAAI,IAAI,IAAI,GAAG,GAAG,IAAI,IAAI,GAAG,GAAG,IAAI,IAAI,GAAG,GAAG,EAAE;YACnD,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC;SACjB;QACD,IAAI,CAAC,KAAK,EAAE;YACV,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC;SAClB;QAED,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,cAAc,GAAG,KAAK,GAAG,cAAc,GAAG,CAAC,CAAC;QACjD,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,GAAG,GAAG,KAAK,CAAC,KAAK,IAAI,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,IAAI,GAAG,GAAG,IAAI,CAAC,CAAC;QACxF,IAAI,CAAC,UAAU;YACb,CAAC,CAAC,IAAI,IAAI,GAAG,IAAI,IAAI,IAAI,IAAI,GAAG,GAAG,KAAK,CAAC,KAAK,IAAI,IAAI,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,IAAI,IAAI,GAAG,GAAG,CAAC,CAAC;KAC3F;IAuBO,oBAAoB;QAC1B,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QAC5C,MAAM,MAAM,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;QAC/B,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,CAAC;QAClC,MAAM,WAAW,GAAG,KAAK,IAAI,MAAM,CAAC;QACpC,MAAM,WAAW,GAAG,KAAK,GAAG,MAAM,CAAC;QACnC,MAAM,YAAY,GAAG,KAAK,IAAI,OAAO,CAAC;QACtC,MAAM,YAAY,GAAG,KAAK,GAAG,OAAO,CAAC;QAErC,IAAI,CAAC,KAAK,KAAK,CAAC,GAAG,IAAI,YAAY,CAAC,IAAI,WAAW,EAAE;YACnD,OAAO,GAAG,CAAC,OAAO,CAAC;SACpB;aAAM,IAAI,WAAW,IAAI,YAAY,EAAE;YACtC,OAAO,GAAG,CAAC,OAAO,CAAC;SACpB;aAAM,IAAI,YAAY,EAAE;YACvB,OAAO,GAAG,CAAC,MAAM,CAAC;SACnB;aAAM;YACL,OAAO,GAAG,CAAC,OAAO,CAAC;SACpB;KACF;IAEO,UAAU,CAAC,GAAmB,EAAE,GAAmB;QACzD,OAAO,GAAG,IAAI,GAAG,IAAIC,cAAU,CAAC,GAAG,CAAC,qBAAqB,EAAE,EAAE,GAAG,CAAC,qBAAqB,EAAE,CAAC,CAAC;KAC3F;IAEO,sBAAsB;QAC5B,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QACjE,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,CAAC;QAChE,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QAChE,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;QAC9D,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QAChE,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;QAC9D,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;QAC9D,MAAM,WAAW,GAAG,GAAG,CAAC,WAAW,CAAC;QAEpC,IAAI,UAAU,EAAE;YACd,IAAI,aAAa,IAAI,aAAa,IAAI,cAAc,EAAE;gBACpD,UAAU,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;aACvC;iBAAM;gBACL,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;aAC1C;SACF;QAED,IAAI,WAAW,EAAE;YACf,IAAI,cAAc,IAAI,aAAa,IAAI,cAAc,EAAE;gBACrD,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;aACxC;iBAAM;gBACL,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;aAC3C;SACF;QAED,IAAI,UAAU,IAAI,UAAU,EAAE;YAC5B,IAAI,aAAa,EAAE;gBACjB,UAAU,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;aACvC;iBAAM;gBACL,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;aAC1C;SACF;KACF;IAEO,2BAA2B;QACjC,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;QAChE,MAAM,aAAa,GAAG,cAAc,GAAG,GAAG,GAAG,GAAG,GAAG,cAAc,GAAG,CAAC,GAAG,cAAc,GAAG,CAAC,CAAC;QAC3F,MAAM,eAAe,GAAG,YAAY,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;QACnE,MAAM,cAAc,GAAG,gBAAgB,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;QACtE,MAAM,iBAAiB,GAAG,CAAC,GAAG,IAAI,eAAe,GAAG,CAAC,CAAC,KAAK,cAAc,GAAG,CAAC,CAAC,CAAC;QAE/E,IAAI,aAAa,GAAG,iBAAiB,IAAI,GAAG,EAAE;YAC5C,YAAY,CAAC,KAAK,CAAC,cAAc,GAAG,IAAI,CAAC;YACzC,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC;SACzD;aAAM;YACL,YAAY,CAAC,KAAK,CAAC,gBAAgB,GAAG,GAAG,aAAa,IAAI,CAAC;YAC3D,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;SACvD;KACF;;;;;;IAOD,eAAe;QACb,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1C,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9C,QACEC,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,CAAC,SAAS,GAAG,QAAQ,KAAK,QAAQ,EAAE,EAC/D,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,cAAc,GAAG,EAAE,GACtC,EACF;KACH;IAED,eAAe,CAAC,QAAgB;QAC9B,MAAM,KAAK,GAAG,EAAE,gBAAgB,EAAE,GAAG,QAAQ,GAAG,EAAE,CAAC;QACnD,OAAOA,iBAAK,KAAK,EAAE,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,KAAK,GAAI,CAAC;KACnD;IAED,gBAAgB;QACd,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QAClE,MAAM,KAAK,GAAG,IAAI,CAAC,WAAW,CAC5B,cAAc,KAAK,SAAS,GAAG,cAAc,GAAG,GAAG,GAAG,KAAK,IAAI,CAAC,EAChE,cAAc,CACf,CAAC;QACF,QACEA,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,EACpD,GAAG,EAAC,gBAAgB;;YAEpB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,IAEpC,KAAK,EACL,SAAS,IAAI,cAAc,KAAK,SAAS,KACxCA,kBAAM,KAAK,EAAE,GAAG,CAAC,SAAS,cAAS,SAAS,CAAQ,CACrD,CACG,EACN;KACH;IAED,cAAc;QACZ,MAAM,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC5D,MAAM,KAAK,GAAG,EAAE,gBAAgB,EAAE,GAAG,UAAU,GAAG,EAAE,CAAC;QACrD,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAC/B,cAAc,KAAK,SAAS,GAAG,UAAU,GAAG,GAAG,EAC/C,cAAc,CACf,CAAC;QACF,QACEA,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,EACpD,GAAG,EAAC,gBAAgB,EACpB,KAAK,EAAE,KAAK;;YAEZ,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,IAElC,QAAQ,EACR,SAAS,IAAI,cAAc,KAAK,SAAS,KACxCA,kBAAM,KAAK,EAAE,GAAG,CAAC,SAAS,cAAS,SAAS,CAAQ,CACrD,CACG,EACN;KACH;IAED,cAAc;QACZ,MAAM,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,EAAE,WAAW,EAAE,kBAAkB,EAAE,GAAG,IAAI,CAAC;QAClF,MAAM,KAAK,GAAG,GAAG;cACb,IAAI,CAAC,WAAW,CAAC,cAAc,KAAK,SAAS,GAAG,UAAU,GAAG,GAAG,GAAG,GAAG,EAAE,cAAc,CAAC;cACvF,EAAE,CAAC;QACP,MAAM,YAAY,GAAG,EAAE,gBAAgB,EAAE,GAAG,UAAU,GAAG,EAAE,CAAC;QAC5D,MAAM,YAAY,GAAG,EAAE,cAAc,EAAE,GAAG,GAAG,GAAG,UAAU,GAAG,EAAE,CAAC;QAChE,MAAM,KAAK,GACT,CAAC,WAAW,GAAG,UAAU,IAAI,GAAG,GAAG,kBAAkB,GAAG,YAAY,GAAG,YAAY,CAAC;QACtF,QACEA,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,EACpD,GAAG,EAAC,gBAAgB,EACpB,KAAK,EAAE,KAAK;;YAEZ,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC,IAElC,KAAK,CACF,EACN;KACH;IAED,eAAe;QACb,MAAM,EAAE,cAAc,EAAE,IAAI,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;QACjE,MAAM,KAAK,GAAG,IAAI;cACd,IAAI,CAAC,WAAW,CAAC,cAAc,KAAK,SAAS,GAAG,WAAW,GAAG,GAAG,GAAG,IAAI,EAAE,cAAc,CAAC;cACzF,EAAE,CAAC;QACP,MAAM,YAAY,GAAG,EAAE,gBAAgB,EAAE,GAAG,WAAW,GAAG,EAAE,CAAC;QAC7D,MAAM,YAAY,GAAG,EAAE,cAAc,EAAE,GAAG,GAAG,GAAG,WAAW,GAAG,EAAE,CAAC;QACjE,MAAM,KAAK,GAAG,WAAW,GAAG,GAAG,IAAI,YAAY,GAAG,YAAY,GAAG,YAAY,CAAC;QAC9E,QACEA,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,EACpD,GAAG,EAAC,iBAAiB,EACrB,KAAK,EAAE,KAAK;;YAEZ,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAoB,CAAC,IAErD,KAAK,CACF,EACN;KACH;IAED,cAAc;QACZ,MAAM,EAAE,cAAc,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QACjD,MAAM,KAAK,GAAG,EAAE,cAAc,EAAE,GAAG,GAAG,GAAG,UAAU,GAAG,EAAE,CAAC;QACzD,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAC/B,cAAc,KAAK,SAAS,GAAG,UAAU,GAAG,GAAG,GAAG,GAAG,EACrD,cAAc,CACf,CAAC;QACF,QACEA,iBACE,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC,KAAK,GAAG,IAAI,EAAE,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,EACpD,GAAG,EAAC,gBAAgB,EACpB,KAAK,EAAE,KAAK;;YAEZ,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,UAAU,GAAG,EAAoB,CAAC,IAEpD,QAAQ,CACL,EACN;KACH;IAED,MAAM;QACJ,MAAM,EACJ,UAAU,EACV,cAAc,EACd,UAAU,EACV,WAAW,EACX,KAAK,EACL,SAAS,EACT,UAAU,EACV,GAAG,EACH,UAAU,EACV,GAAG,EACH,UAAU,EACV,WAAW,EACX,cAAc,EACd,SAAS,EACT,KAAK,EACL,UAAU,EACV,cAAc,GACf,GAAG,IAAI,CAAC;QACT,MAAM,2BAA2B,GAAG,IAAI,CAAC,WAAW,CAAC,cAAc,GAAG,GAAG,EAAE,SAAS,CAAC,CAAC;QACtF,MAAM,aAAa,GAAG,GAAG,KAAK,IAAI,SAAS,EAAE,CAAC;QAC9C,MAAM,SAAS,GACb,cAAc,KAAK,SAAS;cACxB,2BAA2B;cAC3B,SAAS;kBACP,aAAa;kBACb,SAAS,CAAC;QAClB,QACEA,QAACC,UAAI,QACHD,+BACc,KAAK,mBACF,cAAc,KAAK,SAAS,GAAG,UAAU,GAAG,GAAG,mBAC/C,cAAc,KAAK,SAAS,GAAG,UAAU,GAAG,GAAG,mBAC/C,cAAc,KAAK,SAAS,GAAG,cAAc,GAAG,KAAK,oBACpD,SAAS,EACzB,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,SAAS,GAAG,IAAI;gBACrB,CAAC,GAAG,CAAC,YAAY,GAAG,WAAW;gBAC/B,CAAC,GAAG,CAAC,YAAY,GAAG,UAAU;gBAC9B,CAAC,UAAU,GAAG,UAAU,KAAK,cAAc;aAC5C,EACD,IAAI,EAAC,OAAO;;YAEZ,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,gBAAgB,GAAG,EAAoB,CAAC,IAE1D,IAAI,CAAC,eAAe,EAAE,EACtB,UAAU,IAAI,IAAI,CAAC,gBAAgB,EAAE,EACrC,SAAS,IAAI,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,EAC7C,UAAU,IAAI,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,EAC/C,WAAW,IAAI,IAAI,CAAC,cAAc,EAAE,EACpC,WAAW,IAAI,SAAS,IAAI,IAAI,CAAC,cAAc,EAAE,EACjD,WAAW,IAAI,UAAU,IAAI,IAAI,CAAC,eAAe,EAAE,EACnD,WAAW,IAAI,IAAI,CAAC,cAAc,EAAE,CACjC,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;","names":["createObserver","locale","getSupportedLocale","numberStringFormatter","setUpLoadableComponent","afterConnectDefaultValueSet","setComponentLoaded","connectLocalized","connectForm","disconnectLocalized","disconnectForm","intersects","h","Host"],"sources":["src/components/meter/resources.ts","src/components/meter/meter.scss?tag=calcite-meter&encapsulation=shadow","src/components/meter/meter.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  fill: \"fill\",\n  stepLine: \"step-line\",\n  label: \"label\",\n  labelHidden: \"label-hidden\",\n  labelRange: \"label-range\",\n  labelValue: \"label-value\",\n  unitLabel: \"unit-label\",\n  stepsVisible: \"steps-visible\",\n  valueVisible: \"value-visible\",\n  success: \"fill-success\",\n  warning: \"fill-warning\",\n  danger: \"fill-danger\",\n};\n","@include base-component();\n@include disabled();\n\n:host {\n  @apply flex;\n  --calcite-meter-space-internal: theme(\"spacing[0.5]\");\n  --calcite-meter-height-internal: theme(\"spacing.4\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size--1);\n}\n\n:host([scale=\"s\"]) {\n  --calcite-meter-height-internal: theme(\"spacing.3\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size--2);\n}\n\n:host([scale=\"l\"]) {\n  --calcite-meter-height-internal: theme(\"spacing.6\");\n  --calcite-meter-font-size-internal: var(--calcite-font-size-0);\n}\n\n.container {\n  @apply flex relative items-center w-full m-0;\n  block-size: var(--calcite-meter-height-internal);\n  background-color: var(--calcite-color-foreground-2);\n  border: 1px solid var(--calcite-color-border-3);\n  border-radius: var(--calcite-meter-height-internal);\n}\n\n.solid {\n  border: 1px solid var(--calcite-color-foreground-3);\n  background-color: var(--calcite-color-foreground-3);\n}\n\n.outline {\n  @apply bg-transparent;\n}\n\n.value-visible {\n  margin-block-start: theme(\"spacing.6\");\n}\n\n.steps-visible {\n  margin-block-end: theme(\"spacing.6\");\n}\n\n.step-line {\n  @apply block absolute inset-y-0;\n  inline-size: var(--calcite-meter-space-internal);\n  background-color: var(--calcite-color-border-3);\n}\n\n.label {\n  @apply absolute;\n  font-size: var(--calcite-meter-font-size-internal);\n}\n\n.label-hidden {\n  @apply invisible opacity-0;\n}\n\n.label-value {\n  inset-block-end: calc(100% + 0.5em);\n  font-weight: var(--calcite-font-weight-bold);\n  color: var(--calcite-color-text-1);\n}\n\n.label-range {\n  @apply text-color-3;\n  inset-block-start: calc(100% + 0.5em);\n}\n\n.unit-label {\n  @apply text-color-3 font-medium;\n}\n\n.label-value .unit-label {\n  @apply text-color-2 font-bold;\n}\n\n.fill {\n  @apply block absolute duration-150 ease-in-out bg-brand z-default;\n  inset-inline-start: var(--calcite-meter-space-internal);\n  inset-block: var(--calcite-meter-space-internal);\n  border-radius: var(--calcite-meter-height-internal);\n  max-inline-size: calc(100% - (var(--calcite-meter-space-internal) * 2));\n  min-inline-size: calc(var(--calcite-meter-height-internal) - (var(--calcite-meter-space-internal) * 2));\n  transition-property: inline-size, background-color, box-shadow;\n}\n\n.fill-danger {\n  background-color: var(--calcite-color-status-danger);\n}\n\n.fill-success {\n  background-color: var(--calcite-color-status-success);\n}\n\n.fill-warning {\n  background-color: var(--calcite-color-status-warning);\n}\n\n.solid .fill {\n  inset-block: 0;\n  inset-inline-start: 0;\n  max-inline-size: 100%;\n  min-inline-size: calc(var(--calcite-meter-height-internal));\n  box-shadow: 0 0 0 1px var(--calcite-color-brand);\n}\n\n.solid .fill-danger {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-danger);\n}\n\n.solid .fill-success {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-success);\n}\n\n.solid .fill-warning {\n  box-shadow: 0 0 0 1px var(--calcite-color-status-warning);\n}\n","import { Component, Element, h, Host, Prop, State, VNode, Watch } from \"@stencil/core\";\nimport { Appearance, Scale } from \"../interfaces\";\nimport { CSS } from \"./resources\";\n\nimport {\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\n\nimport {\n  afterConnectDefaultValueSet,\n  connectForm,\n  disconnectForm,\n  FormComponent,\n} from \"../../utils/form\";\n\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  getSupportedLocale,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n  SupportedLocale,\n} from \"../../utils/locale\";\nimport { intersects } from \"../../utils/dom\";\nimport { createObserver } from \"../../utils/observers\";\nimport { MeterLabelType } from \"./interfaces\";\n\n@Component({\n  tag: \"calcite-meter\",\n  styleUrl: \"meter.scss\",\n  shadow: true,\n})\nexport class Meter implements FormComponent, LoadableComponent, LocalizedComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** Specifies the appearance style of the component. */\n  @Prop({ reflect: true }) appearance: Extract<\"outline\" | \"outline-fill\" | \"solid\", Appearance> =\n    \"outline-fill\";\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Specifies the component's display, where `\"single\"` displays a single color and `\"range\"` displays a range of colors based on provided `low`, `high`, `min` or `max` values. */\n  @Prop({ reflect: true }) fillType: \"single\" | \"range\" = \"range\";\n\n  /**\n   * The ID of the form that will be associated with the component.\n   *\n   * When not set, the component will be associated with its ancestor form element, if any.\n   */\n  @Prop({ reflect: true }) form: string;\n\n  /** When `true`, number values are displayed with a group separator corresponding to the language and country format. */\n  @Prop({ reflect: true }) groupSeparator = false;\n\n  /** Specifies a high value.  When `fillType` is `\"range\"`, displays a different color when above the specified threshold.  */\n  @Prop({ reflect: true, mutable: true }) high: number;\n\n  /**  Accessible name for the component. */\n  @Prop() label!: string;\n\n  /** Specifies a low value.  When `fillType` is `\"range\"`, displays a different color when above the specified threshold.  */\n  @Prop({ reflect: true, mutable: true }) low: number;\n\n  /** Specifies the highest allowed value of the component. */\n  @Prop({ reflect: true }) max = 100;\n\n  /** Specifies the lowest allowed value of the component. */\n  @Prop({ reflect: true }) min = 0;\n\n  @Watch(\"min\")\n  @Watch(\"max\")\n  @Watch(\"low\")\n  @Watch(\"high\")\n  @Watch(\"value\")\n  handleRangeChange(): void {\n    this.calculateValues();\n    this.updateLabels();\n  }\n\n  /**\n   * Specifies the name of the component.\n   *\n   * Required to pass the component's `value` on form submission.\n   */\n  @Prop({ reflect: true }) name: string;\n\n  /** Specifies the Unicode numeral system used by the component for localization. */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /** When `true`, displays the values of `high`, `low`, `min`, and `max`. */\n  @Prop({ reflect: true }) rangeLabels = false;\n\n  /** When `rangeLabels` is `true`, specifies the format of displayed labels. */\n  @Prop({ reflect: true }) rangeLabelType: MeterLabelType = \"percent\";\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** When `rangeLabelType` is `\"units\"` and either `valueLabel` or `rangeLabels` are `true`, displays beside the `value` and/or  `min` values. */\n  @Prop() unitLabel = \"\";\n\n  /** Specifies the current value of the component. */\n  @Prop({ mutable: true }) value: number;\n\n  /** When `true`, displays the current value. */\n  @Prop({ reflect: true }) valueLabel = false;\n\n  /** When `valueLabel` is `true`, specifies the format of displayed label. */\n  @Prop({ reflect: true }) valueLabelType: MeterLabelType = \"percent\";\n\n  @Watch(\"rangeLabels\")\n  @Watch(\"rangeLabelType\")\n  @Watch(\"unitLabel\")\n  @Watch(\"valueLabel\")\n  @Watch(\"valueLabelType\")\n  handleLabelChange(): void {\n    this.updateLabels();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    this.calculateValues();\n    afterConnectDefaultValueSet(this, this.value);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n    this.updateLabels();\n  }\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectForm(this);\n    this.resizeObserver?.observe(this.el);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectForm(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteMeterElement;\n\n  defaultValue: Meter[\"value\"];\n\n  formEl: HTMLFormElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  private highLabelEl: HTMLDivElement;\n\n  private labelFlipMax = 0.8;\n\n  private labelFlipProximity = 0.15;\n\n  private lowLabelEl: HTMLDivElement;\n\n  private maxLabelEl: HTMLDivElement;\n\n  private maxPercent = 100;\n\n  private meterContainerEl: HTMLDivElement;\n\n  private minLabelEl: HTMLDivElement;\n\n  private minPercent = 0;\n\n  private percentFormatting: {\n    formatter: Intl.NumberFormat;\n    locale: SupportedLocale;\n  };\n\n  private resizeObserver = createObserver(\"resize\", () => this.resizeHandler());\n\n  private valueLabelEl: HTMLDivElement;\n\n  @State() currentPercent: number;\n\n  @State() effectiveLocale: string;\n\n  @State() highActive: boolean;\n\n  @State() highPercent: number;\n\n  @State() lowActive: boolean;\n\n  @State() lowPercent: number;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private resizeHandler(): void {\n    this.updateLabels();\n  }\n\n  private updateLabels(): void {\n    if (this.valueLabelEl) {\n      this.determineValueLabelPosition();\n    }\n    if (this.rangeLabels) {\n      this.determineVisibleLabels();\n    }\n  }\n\n  private calculateValues(): void {\n    const { min, max, low, high, value } = this;\n    const lowPercent = (100 * (low - min)) / (max - min);\n    const highPercent = (100 * (high - min)) / (max - min);\n    const currentPercent = (100 * (value - min)) / (max - min);\n\n    if (!low || low < min || low > high || low > max) {\n      this.low = min;\n    }\n    if (!high || high > max || high < low || high < min) {\n      this.high = max;\n    }\n    if (!value) {\n      this.value = min;\n    }\n\n    this.lowPercent = lowPercent;\n    this.highPercent = highPercent;\n    this.currentPercent = value ? currentPercent : 0;\n    this.lowActive = !!low && low > min && (!value || low > value) && (!high || low < high);\n    this.highActive =\n      !!high && min <= high && high < max && (!value || high > value) && (!low || high > low);\n  }\n\n  private formatLabel = (value: number, labelType: MeterLabelType): string => {\n    if (labelType === \"percent\") {\n      if (!this.percentFormatting) {\n        const locale = getSupportedLocale(this.effectiveLocale);\n        const formatter = new Intl.NumberFormat(locale, {\n          useGrouping: this.groupSeparator,\n          style: \"percent\",\n        });\n        this.percentFormatting = { formatter, locale };\n      }\n      return this.percentFormatting.formatter.format(value);\n    } else {\n      numberStringFormatter.numberFormatOptions = {\n        locale: this.effectiveLocale,\n        numberingSystem: this.numberingSystem,\n        useGrouping: this.groupSeparator,\n      };\n      return numberStringFormatter.localize(value.toString());\n    }\n  };\n\n  private getMeterKindCssClass(): string {\n    const { low, high, min, max, value } = this;\n    const lowest = low ? low : min;\n    const highest = high ? high : max;\n    const aboveLowest = value >= lowest;\n    const belowLowest = value < lowest;\n    const aboveHighest = value >= highest;\n    const belowHighest = value < highest;\n\n    if (!value || (!low && belowHighest) || belowLowest) {\n      return CSS.success;\n    } else if (aboveLowest && belowHighest) {\n      return CSS.warning;\n    } else if (aboveHighest) {\n      return CSS.danger;\n    } else {\n      return CSS.success;\n    }\n  }\n\n  private intersects(el1: HTMLDivElement, el2: HTMLDivElement): boolean {\n    return el1 && el2 && intersects(el1.getBoundingClientRect(), el2.getBoundingClientRect());\n  }\n\n  private determineVisibleLabels(): void {\n    const { minLabelEl, lowLabelEl, highLabelEl, maxLabelEl } = this;\n    const highMaxOverlap = this.intersects(highLabelEl, maxLabelEl);\n    const lowHighOverlap = this.intersects(lowLabelEl, highLabelEl);\n    const lowMaxOverlap = this.intersects(lowLabelEl, maxLabelEl);\n    const minHighOverlap = this.intersects(minLabelEl, highLabelEl);\n    const minLowOverlap = this.intersects(minLabelEl, lowLabelEl);\n    const minMaxOverlap = this.intersects(minLabelEl, maxLabelEl);\n    const hiddenClass = CSS.labelHidden;\n\n    if (lowLabelEl) {\n      if (minLowOverlap || lowMaxOverlap || lowHighOverlap) {\n        lowLabelEl.classList.add(hiddenClass);\n      } else {\n        lowLabelEl.classList.remove(hiddenClass);\n      }\n    }\n\n    if (highLabelEl) {\n      if (minHighOverlap || lowMaxOverlap || highMaxOverlap) {\n        highLabelEl.classList.add(hiddenClass);\n      } else {\n        highLabelEl.classList.remove(hiddenClass);\n      }\n    }\n\n    if (minLabelEl && maxLabelEl) {\n      if (minMaxOverlap) {\n        maxLabelEl.classList.add(hiddenClass);\n      } else {\n        maxLabelEl.classList.remove(hiddenClass);\n      }\n    }\n  }\n\n  private determineValueLabelPosition(): void {\n    const { valueLabelEl, meterContainerEl, currentPercent } = this;\n    const valuePosition = currentPercent > 100 ? 100 : currentPercent > 0 ? currentPercent : 0;\n    const valueLabelWidth = valueLabelEl.getBoundingClientRect().width;\n    const containerWidth = meterContainerEl.getBoundingClientRect().width;\n    const labelWidthPercent = (100 * (valueLabelWidth - 0)) / (containerWidth - 0);\n\n    if (valuePosition + labelWidthPercent >= 100) {\n      valueLabelEl.style.insetInlineEnd = \"0%\";\n      valueLabelEl.style.removeProperty(\"inset-inline-start\");\n    } else {\n      valueLabelEl.style.insetInlineStart = `${valuePosition}% `;\n      valueLabelEl.style.removeProperty(\"inset-inline-end\");\n    }\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  renderMeterFill(): VNode {\n    const { currentPercent, fillType } = this;\n    const kindClass = this.getMeterKindCssClass();\n    return (\n      <div\n        class={{ [CSS.fill]: true, [kindClass]: fillType !== \"single\" }}\n        style={{ width: `${currentPercent}%` }}\n      />\n    );\n  }\n\n  renderRangeLine(position: number): VNode {\n    const style = { insetInlineStart: `${position}%` };\n    return <div class={CSS.stepLine} style={style} />;\n  }\n\n  renderValueLabel(): VNode {\n    const { currentPercent, valueLabelType, unitLabel, value } = this;\n    const label = this.formatLabel(\n      valueLabelType === \"percent\" ? currentPercent / 100 : value || 0,\n      valueLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelValue]: true }}\n        key=\"low-label-line\"\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.valueLabelEl = el)}\n      >\n        {label}\n        {unitLabel && valueLabelType !== \"percent\" && (\n          <span class={CSS.unitLabel}>&nbsp;{unitLabel}</span>\n        )}\n      </div>\n    );\n  }\n\n  renderMinLabel(): VNode {\n    const { rangeLabelType, min, minPercent, unitLabel } = this;\n    const style = { insetInlineStart: `${minPercent}%` };\n    const labelMin = this.formatLabel(\n      rangeLabelType === \"percent\" ? minPercent : min,\n      rangeLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"min-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.minLabelEl = el)}\n      >\n        {labelMin}\n        {unitLabel && rangeLabelType !== \"percent\" && (\n          <span class={CSS.unitLabel}>&nbsp;{unitLabel}</span>\n        )}\n      </div>\n    );\n  }\n\n  renderLowLabel(): VNode {\n    const { rangeLabelType, low, lowPercent, highPercent, labelFlipProximity } = this;\n    const label = low\n      ? this.formatLabel(rangeLabelType === \"percent\" ? lowPercent / 100 : low, rangeLabelType)\n      : \"\";\n    const styleDefault = { insetInlineStart: `${lowPercent}%` };\n    const styleFlipped = { insetInlineEnd: `${100 - lowPercent}%` };\n    const style =\n      (highPercent - lowPercent) / 100 < labelFlipProximity ? styleFlipped : styleDefault;\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"low-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.lowLabelEl = el)}\n      >\n        {label}\n      </div>\n    );\n  }\n\n  renderHighLabel(): VNode {\n    const { rangeLabelType, high, highPercent, labelFlipMax } = this;\n    const label = high\n      ? this.formatLabel(rangeLabelType === \"percent\" ? highPercent / 100 : high, rangeLabelType)\n      : \"\";\n    const styleDefault = { insetInlineStart: `${highPercent}%` };\n    const styleFlipped = { insetInlineEnd: `${100 - highPercent}%` };\n    const style = highPercent / 100 >= labelFlipMax ? styleFlipped : styleDefault;\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"high-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.highLabelEl = el as HTMLDivElement)}\n      >\n        {label}\n      </div>\n    );\n  }\n\n  renderMaxLabel(): VNode {\n    const { rangeLabelType, max, maxPercent } = this;\n    const style = { insetInlineEnd: `${100 - maxPercent}%` };\n    const labelMax = this.formatLabel(\n      rangeLabelType === \"percent\" ? maxPercent / 100 : max,\n      rangeLabelType,\n    );\n    return (\n      <div\n        class={{ [CSS.label]: true, [CSS.labelRange]: true }}\n        key=\"max-label-line\"\n        style={style}\n        // eslint-disable-next-line react/jsx-sort-props\n        ref={(el) => (this.maxLabelEl = el as HTMLDivElement)}\n      >\n        {labelMax}\n      </div>\n    );\n  }\n\n  render(): VNode {\n    const {\n      appearance,\n      currentPercent,\n      highActive,\n      highPercent,\n      label,\n      lowActive,\n      lowPercent,\n      max,\n      maxPercent,\n      min,\n      minPercent,\n      rangeLabels,\n      rangeLabelType,\n      unitLabel,\n      value,\n      valueLabel,\n      valueLabelType,\n    } = this;\n    const textPercentLabelWithPercent = this.formatLabel(currentPercent / 100, \"percent\");\n    const textUnitLabel = `${value} ${unitLabel}`;\n    const valueText =\n      valueLabelType === \"percent\"\n        ? textPercentLabelWithPercent\n        : unitLabel\n          ? textUnitLabel\n          : undefined;\n    return (\n      <Host>\n        <div\n          aria-label={label}\n          aria-valuemax={rangeLabelType === \"percent\" ? maxPercent : max}\n          aria-valuemin={rangeLabelType === \"percent\" ? minPercent : min}\n          aria-valuenow={valueLabelType === \"percent\" ? currentPercent : value}\n          aria-valuetext={valueText}\n          class={{\n            [CSS.container]: true,\n            [CSS.stepsVisible]: rangeLabels,\n            [CSS.valueVisible]: valueLabel,\n            [appearance]: appearance !== \"outline-fill\",\n          }}\n          role=\"meter\"\n          // eslint-disable-next-line react/jsx-sort-props\n          ref={(el) => (this.meterContainerEl = el as HTMLDivElement)}\n        >\n          {this.renderMeterFill()}\n          {valueLabel && this.renderValueLabel()}\n          {lowActive && this.renderRangeLine(lowPercent)}\n          {highActive && this.renderRangeLine(highPercent)}\n          {rangeLabels && this.renderMinLabel()}\n          {rangeLabels && lowActive && this.renderLowLabel()}\n          {rangeLabels && highActive && this.renderHighLabel()}\n          {rangeLabels && this.renderMaxLabel()}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/calcite-modal.cjs.entry.js

@@ -1,25 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.11
+ * v2.2.0-next.12
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-8b34daf0.js');
-const conditionalSlot = require('./conditionalSlot-129f9fb1.js');
-const dom = require('./dom-96b95ba5.js');
-const focusTrapComponent = require('./focusTrapComponent-cea06372.js');
-const loadable = require('./loadable-64558297.js');
-const observers = require('./observers-72601b59.js');
-const openCloseComponent = require('./openCloseComponent-b4ccd661.js');
-const locale = require('./locale-92847a13.js');
-const t9n = require('./t9n-b908c650.js');
-const component = require('./component-3cb4d607.js');
-require('./guid-f81db95d.js');
-require('./resources-1e439750.js');
-require('./key-89f3021a.js');
+const index = require('./index-41b2d7a6.js');
+const conditionalSlot = require('./conditionalSlot-566fd2b6.js');
+const dom = require('./dom-8573aa26.js');
+const focusTrapComponent = require('./focusTrapComponent-290f6bd5.js');
+const loadable = require('./loadable-d0df67a5.js');
+const observers = require('./observers-beba3aca.js');
+const openCloseComponent = require('./openCloseComponent-2a9be1d1.js');
+const locale = require('./locale-3660b9d2.js');
+const t9n = require('./t9n-65657a5d.js');
+const component = require('./component-23821d6c.js');
+require('./guid-ce508a49.js');
+require('./resources-91df8f40.js');
+require('./key-451c1254.js');
 
 const CSS = {
     modal: "modal",

package/dist/cjs/calcite-modal.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-modal.entry.cjs.js","mappings":"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","names":["createObserver","getSlotted","slotChangeHasAssignedElement","deactivateFocusTrap","activateFocusTrap","setUpMessages","setUpLoadableComponent","setComponentLoaded","connectConditionalSlotComponent","connectLocalized","connectMessages","connectFocusTrap","disconnectConditionalSlotComponent","disconnectLocalized","disconnectMessages","h","Host","getIconScale","updateMessages","componentFocusable","focusFirstTabbable","updateFocusTrapElements","onToggleOpenCloseComponent","ensureId"],"sources":["src/components/modal/resources.ts","src/components/modal/modal.scss?tag=calcite-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["export const CSS = {\n  modal: \"modal\",\n  title: \"title\",\n  header: \"header\",\n  footer: \"footer\",\n  scrim: \"scrim\",\n  back: \"back\",\n  close: \"close\",\n  secondary: \"secondary\",\n  primary: \"primary\",\n  container: \"container\",\n  containerOpen: \"container--open\",\n  content: \"content\",\n  contentNoFooter: \"content--no-footer\",\n  contentBottom: \"content-bottom\",\n  contentTop: \"content-top\",\n  slottedInShell: \"slotted-in-shell\",\n\n  // these classes help apply the animation in phases to only set transform on open/close\n  // this helps avoid a positioning issue for any floating-ui-owning children\n  openingIdle: \"modal--opening-idle\",\n  openingActive: \"modal--opening-active\",\n  closingIdle: \"modal--closing-idle\",\n  closingActive: \"modal--closing-active\",\n};\n\nexport const DURATIONS = {\n  slow: 14000,\n  medium: 10000,\n  fast: 6000,\n  test: 300 / 1000,\n};\n\nexport const ICONS = {\n  close: \"x\",\n};\n\nexport const SLOTS = {\n  content: \"content\",\n  contentBottom: \"content-bottom\",\n  contentTop: \"content-top\",\n  header: \"header\",\n  back: \"back\",\n  secondary: \"secondary\",\n  primary: \"primary\",\n};\n","@import \"~@esri/calcite-design-tokens/dist/scss/core\";\n\n/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-modal-content-background: Specifies the background color of content placed in the `content` slot.\n * @prop --calcite-modal-content-padding: Specifies the padding of the modal `content` slot.\n * @prop --calcite-modal-scrim-background: Specifies the background color of the modal scrim.\n * @prop --calcite-modal-width: Specifies a width of the modal, using `px`, `em`, `rem`, `vw`, or `%`. Will never exceed the width of the viewport. Will not apply if `fullscreen` if set.\n * @prop --calcite-modal-height: Specifies a height of the modal, using `px`, `em`, `rem`, `vh`, or `%`. Will never exceed the height of the viewport. Will not apply if `fullscreen` if set.\n *\n */\n\n:host {\n  --calcite-modal-scrim-background: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n}\n\n:host {\n  @apply absolute flex inset-0 opacity-0 z-overlay;\n  visibility: hidden !important;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n  // the modal should always use a dark scrim, regardless of light / dark mode - matches value in global.scss\n  --calcite-modal-scrim-background-internal: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n}\n\n.content-top[hidden],\n.content-bottom[hidden] {\n  @apply hidden;\n}\n\n.container {\n  @apply text-color-2\n    fixed\n    inset-0\n    flex\n    items-center\n    justify-center\n    overflow-y-hidden\n    opacity-0\n    z-overlay;\n  visibility: hidden !important;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n:host([scale=\"s\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.3\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.4\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.1h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.n1\");\n}\n\n:host([scale=\"m\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.4\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.5\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.2h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.0\");\n}\n\n:host([scale=\"l\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.5\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.6\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.3h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.1\");\n}\n\n.scrim {\n  --calcite-scrim-background: var(--calcite-modal-scrim-background, var(--calcite-color-transparent-scrim));\n  @apply fixed inset-0 flex overflow-y-hidden;\n}\n\n.modal {\n  @apply shadow-2-sm\n    bg-foreground-1\n    pointer-events-none\n    float-none\n    m-6\n    box-border\n    flex\n    w-full\n    flex-col\n    overflow-hidden\n    rounded\n    opacity-0\n    z-modal;\n  -webkit-overflow-scrolling: touch;\n  visibility: hidden;\n  transition:\n    transform var(--calcite-internal-animation-timing-slow) $easing-function,\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n\n  --calcite-modal-hidden-position: translate3d(0, 20px, 0);\n  --calcite-modal-shown-position: translate3d(0, 0, 0);\n\n  &--opening {\n    &-idle {\n      transform: var(--calcite-modal-hidden-position);\n    }\n    &-active {\n      transform: var(--calcite-modal-shown-position);\n    }\n  }\n\n  &--closing {\n    &-idle {\n      transform: var(--calcite-modal-shown-position);\n    }\n    &-active {\n      transform: var(--calcite-modal-hidden-position);\n    }\n  }\n}\n\n:host([opened]) {\n  @apply opacity-100;\n  visibility: visible !important;\n  transition-delay: 0ms;\n}\n\n.container--open {\n  @apply opacity-100;\n  visibility: visible !important;\n  transition-delay: 0ms;\n  .modal {\n    @apply pointer-events-auto visible opacity-100;\n    transition:\n      transform var(--calcite-internal-animation-timing-slow) $easing-function,\n      visibility 0ms linear,\n      opacity var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-inline-size var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-block-size var(--calcite-internal-animation-timing-slow) $easing-function;\n    transition-delay: 0ms;\n  }\n}\n\n/**\n * Header\n */\n.header {\n  @apply bg-foreground-1\n    border-color-3\n    flex\n    min-w-0\n    max-w-full\n    rounded-t\n    border-0\n    border-b\n    border-solid\n    z-header;\n  flex: 0 0 auto;\n}\n\n.close {\n  @apply text-color-3\n    transition-default\n    focus-base\n    order-2\n    m-0\n    cursor-pointer\n    appearance-none\n    border-none\n    bg-transparent;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-internal);\n  flex: 0 0 auto;\n  calcite-icon {\n    @apply pointer-events-none;\n    vertical-align: -2px;\n  }\n  &:focus {\n    @apply focus-inset;\n  }\n  &:hover,\n  &:focus,\n  &:active {\n    @apply bg-foreground-2 text-color-1;\n  }\n}\n\n.title {\n  @apply order-1 flex min-w-0 items-center;\n  flex: 1 1 auto;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-large-internal);\n}\n\n@include slotted(\"header\", \"*\") {\n  @apply text-color-1 m-0 font-normal;\n  font-size: var(--calcite-modal-title-text-internal);\n}\n\n/**\n * Content area\n */\n.content {\n  @apply relative box-border block h-full overflow-auto p-0;\n  background-color: var(--calcite-modal-content-background, theme(\"colors.background.foreground.1\"));\n  max-block-size: 100%;\n  padding: var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal));\n}\n\n.content-top,\n.content-bottom {\n  @apply bg-foreground-1 border-color-3 border-solid border-0 z-header flex;\n  flex: 0 0 auto;\n  padding: var(--calcite-modal-padding-internal);\n}\n\n.content-top {\n  @apply min-w-0 max-w-full border-b;\n}\n\n.content-bottom {\n  @apply mt-auto box-border w-full justify-between border-t;\n}\n\n.content-top:not(.header ~ .content-top) {\n  @apply rounded-t;\n}\n\n.content-bottom:not(.content-bottom ~ .footer),\n.content--no-footer {\n  @apply rounded-b;\n}\n\n@include slotted(\"content\", \"*\") {\n  font-size: var(--calcite-modal-context-text-internal);\n}\n\n/**\n * Footer\n */\n.footer {\n  @apply bg-foreground-1\n    border-color-3\n    mt-auto\n    box-border\n    flex\n    w-full\n    justify-between\n    rounded-b\n    border-0\n    border-t\n    border-solid\n    z-header;\n  flex: 0 0 auto;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-large-internal);\n}\n\n.footer--hide-back .back,\n.footer--hide-secondary .secondary {\n  @apply hidden;\n}\n\n.back {\n  @apply block;\n  margin-inline-end: auto;\n}\n\n.secondary {\n  @apply mx-1 block;\n}\n\nslot[name=\"primary\"] {\n  @apply block;\n}\n\n/**\n * Sizes\n */\n@mixin modal-size($size, $width) {\n  :host([width-scale=\"#{$size}\"]) .modal {\n    @apply max-h-full max-w-full;\n    inline-size: var(--calcite-modal-width, $width);\n    block-size: var(--calcite-modal-height, auto);\n  }\n\n  @media screen and (max-width: $width + 2 * $baseline) {\n    :host([width-scale=\"#{$size}\"]) {\n      .modal {\n        @apply m-0 h-full max-h-full w-full max-w-full;\n      }\n      .content {\n        flex: 1 1 auto;\n        max-block-size: unset;\n      }\n    }\n    :host([width-scale=\"#{$size}\"][docked]) .container {\n      align-items: flex-end;\n    }\n  }\n}\n\n:host([width=\"small\"]) .modal {\n  @apply w-auto;\n}\n\n@include modal-size(\"s\", 32rem);\n@include modal-size(\"m\", 48rem);\n@include modal-size(\"l\", 94rem);\n\n/**\n * Fullscreen\n */\n:host([fullscreen]) {\n  .modal {\n    @apply m-0 max-h-full max-w-full h-full w-full rounded-none;\n    --calcite-modal-hidden-position: translate3D(0, 20px, 0) scale(0.95);\n    --calcite-modal-shown-position: translate3D(0, 0, 0) scale(1);\n  }\n  .content {\n    @apply max-h-full;\n    flex: 1 1 auto;\n  }\n}\n\n:host([opened][fullscreen]) {\n  .header,\n  .footer,\n  .content-top,\n  .content-bottom {\n    border-radius: 0;\n  }\n}\n\n/**\n * Docked\n */\n:host([docked]) {\n  .modal {\n    block-size: var(--calcite-modal-height, auto);\n  }\n  .content {\n    @apply h-auto;\n    flex: 1 1 auto;\n  }\n}\n\n/**\n * Kinds\n */\n:host([kind=\"brand\"]) .modal {\n  @apply border-color-brand;\n}\n\n:host([kind=\"danger\"]) .modal {\n  @apply border-color-danger;\n}\n\n:host([kind=\"info\"]) .modal {\n  @apply border-color-info;\n}\n\n:host([kind=\"success\"]) .modal {\n  @apply border-color-success;\n}\n\n:host([kind=\"warning\"]) .modal {\n  @apply border-color-warning;\n}\n\n:host([kind=\"brand\"]),\n:host([kind=\"danger\"]),\n:host([kind=\"info\"]),\n:host([kind=\"success\"]),\n:host([kind=\"warning\"]) {\n  .modal {\n    @apply border-0 border-t-4 border-solid;\n  }\n  .header,\n  .content-top {\n    @apply rounded rounded-b-none;\n  }\n}\n\n/**\n * Tablet\n */\n@media screen and (max-width: $viewport-medium) {\n  @include slotted(\"header\", \"content-top\", \"*\") {\n    @apply text-1;\n  }\n  .footer,\n  .content-bottom {\n    @apply sticky bottom-0;\n  }\n}\n\n/**\n * Mobile\n */\n@media screen and (max-width: $viewport-small) {\n  .footer,\n  .content-bottom {\n    @apply flex-col;\n  }\n  .back,\n  .secondary {\n    @apply m-0 mb-1;\n  }\n}\n\n/**\n * Conditional styles for when Modal is slotted in Shell\n */\n\n.container.slotted-in-shell {\n  position: absolute;\n  pointer-events: auto;\n  calcite-scrim {\n    position: absolute;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport {\n  ensureId,\n  focusFirstTabbable,\n  getSlotted,\n  slotChangeHasAssignedElement,\n} from \"../../utils/dom\";\nimport {\n  activateFocusTrap,\n  connectFocusTrap,\n  deactivateFocusTrap,\n  FocusTrap,\n  FocusTrapComponent,\n  updateFocusTrapElements,\n} from \"../../utils/focusTrapComponent\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { createObserver } from \"../../utils/observers\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { Kind, Scale } from \"../interfaces\";\nimport { CSS, ICONS, SLOTS } from \"./resources\";\n\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { ModalMessages } from \"./assets/modal/t9n\";\n\nimport { getIconScale } from \"../../utils/component\";\n\nlet totalOpenModals: number = 0;\nlet initialDocumentOverflowStyle: string = \"\";\n\n/**\n * @slot header - A slot for adding header text.\n * @slot content - A slot for adding the component's content.\n * @slot content-top - A slot for adding content to the component's sticky header, where content remains at the top of the component when scrolling up and down.\n * @slot content-bottom - A slot for adding content to the component's sticky footer, where content remains at the bottom of the component when scrolling up and down.\n * @slot primary - A slot for adding a primary button.\n * @slot secondary - A slot for adding a secondary button.\n * @slot back - A slot for adding a back button.\n */\n\n@Component({\n  tag: \"calcite-modal\",\n  styleUrl: \"modal.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Modal\n  implements\n    ConditionalSlotComponent,\n    OpenCloseComponent,\n    FocusTrapComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, displays and positions the component.  */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /**\n   * We use an internal property to handle styles for when a modal is actually opened, not just when the open attribute is applied. This is a property because we need to apply styles to the host element and to keep the styles present while beforeClose is.\n   *\n   * @internal\n   */\n  @Prop({ mutable: true, reflect: true }) opened = false;\n\n  /** Passes a function to run before the component closes. */\n  @Prop() beforeClose: (el: HTMLCalciteModalElement) => Promise<void>;\n\n  /** When `true`, disables the component's close button. */\n  @Prop({ reflect: true }) closeButtonDisabled = false;\n\n  /**\n   * When `true`, prevents focus trapping.\n   */\n  @Prop({ reflect: true }) focusTrapDisabled = false;\n\n  @Watch(\"focusTrapDisabled\")\n  handleFocusTrapDisabled(focusTrapDisabled: boolean): void {\n    if (!this.open) {\n      return;\n    }\n\n    focusTrapDisabled ? deactivateFocusTrap(this) : activateFocusTrap(this);\n  }\n\n  /** When `true`, disables the closing of the component when clicked outside. */\n  @Prop({ reflect: true }) outsideCloseDisabled = false;\n\n  /** When `true`, prevents the component from expanding to the entire screen on mobile devices. */\n  @Prop({ reflect: true }) docked: boolean;\n\n  /** When `true`, disables the default close on escape behavior. */\n  @Prop({ reflect: true }) escapeDisabled = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) widthScale: Scale = \"m\";\n\n  /** Sets the component to always be fullscreen (overrides `widthScale` and `--calcite-modal-width` / `--calcite-modal-height`). */\n  @Prop({ reflect: true }) fullscreen: boolean;\n\n  /** Specifies the kind of the component (will apply to top border). */\n  @Prop({ reflect: true }) kind: Extract<\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\", Kind>;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: ModalMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<ModalMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /**\n   * This internal property, managed by a containing calcite-shell, is used\n   * to inform the component if special configuration or styles are needed\n   *\n   * @internal\n   */\n  @Prop({ mutable: true }) slottedInShell: boolean;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    // when modal initially renders, if active was set we need to open as watcher doesn't fire\n    if (this.open) {\n      requestAnimationFrame(() => this.openModal());\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  connectedCallback(): void {\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n    this.cssVarObserver?.observe(this.el, { attributeFilter: [\"style\"] });\n    this.updateSizeCssVars();\n    this.updateFooterVisibility();\n    connectConditionalSlotComponent(this);\n    connectLocalized(this);\n    connectMessages(this);\n    connectFocusTrap(this);\n  }\n\n  disconnectedCallback(): void {\n    this.removeOverflowHiddenClass();\n    this.mutationObserver?.disconnect();\n    this.cssVarObserver?.disconnect();\n    disconnectConditionalSlotComponent(this);\n    deactivateFocusTrap(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.slottedInShell = false;\n  }\n\n  render(): VNode {\n    return (\n      <Host\n        aria-describedby={this.contentId}\n        aria-labelledby={this.titleId}\n        aria-modal=\"true\"\n        role=\"dialog\"\n      >\n        <div\n          class={{\n            [CSS.container]: true,\n            [CSS.containerOpen]: this.opened,\n            [CSS.slottedInShell]: this.slottedInShell,\n          }}\n        >\n          <calcite-scrim class={CSS.scrim} onClick={this.handleOutsideClose} />\n          {this.renderStyle()}\n          <div\n            class={{\n              [CSS.modal]: true,\n            }}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={this.setTransitionEl}\n          >\n            <div class={CSS.header}>\n              {this.renderCloseButton()}\n              <header class={CSS.title}>\n                <slot name={CSS.header} />\n              </header>\n            </div>\n            {this.renderContentTop()}\n            <div\n              class={{\n                [CSS.content]: true,\n                [CSS.contentNoFooter]: !this.hasFooter,\n              }}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={(el) => (this.modalContent = el)}\n            >\n              <slot name={SLOTS.content} />\n            </div>\n            {this.renderContentBottom()}\n            {this.renderFooter()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  renderFooter(): VNode {\n    return this.hasFooter ? (\n      <div class={CSS.footer} key=\"footer\">\n        <span class={CSS.back}>\n          <slot name={SLOTS.back} />\n        </span>\n        <span class={CSS.secondary}>\n          <slot name={SLOTS.secondary} />\n        </span>\n        <span class={CSS.primary}>\n          <slot name={SLOTS.primary} />\n        </span>\n      </div>\n    ) : null;\n  }\n\n  renderContentTop(): VNode {\n    return (\n      <div class={CSS.contentTop} hidden={!this.hasContentTop}>\n        <slot name={SLOTS.contentTop} onSlotchange={this.contentTopSlotChangeHandler} />\n      </div>\n    );\n  }\n\n  renderContentBottom(): VNode {\n    return (\n      <div class={CSS.contentBottom} hidden={!this.hasContentBottom}>\n        <slot name={SLOTS.contentBottom} onSlotchange={this.contentBottomSlotChangeHandler} />\n      </div>\n    );\n  }\n\n  renderCloseButton(): VNode {\n    return !this.closeButtonDisabled ? (\n      <button\n        aria-label={this.messages.close}\n        class={CSS.close}\n        key=\"button\"\n        onClick={this.handleCloseClick}\n        title={this.messages.close}\n        // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n        ref={(el) => (this.closeButtonEl = el)}\n      >\n        <calcite-icon icon={ICONS.close} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  renderStyle(): VNode {\n    if (!this.fullscreen && (this.cssWidth || this.cssHeight)) {\n      return (\n        <style>\n          {`.${CSS.container} {\n              ${this.docked && this.cssWidth ? `align-items: center !important;` : \"\"}\n            }\n            .${CSS.modal} {\n              block-size: ${this.cssHeight ? this.cssHeight : \"auto\"} !important;\n              ${this.cssWidth ? `inline-size: ${this.cssWidth} !important;` : \"\"}\n              ${this.cssWidth ? `max-inline-size: ${this.cssWidth} !important;` : \"\"}\n              ${this.docked ? `border-radius: var(--calcite-border-radius) !important;` : \"\"}\n            }\n            @media screen and (max-width: ${this.cssWidth}) {\n              .${CSS.container} {\n                ${this.docked ? `align-items: flex-end !important;` : \"\"}\n              }\n              .${CSS.modal} {\n                max-block-size: 100% !important;\n                inline-size: 100% !important;\n                max-inline-size: 100% !important;\n                min-inline-size: 100% !important;\n                margin: 0 !important;\n                ${!this.docked ? `block-size: 100% !important;` : \"\"}\n                ${!this.docked ? `border-radius: 0 !important;` : \"\"}\n                ${\n                  this.docked\n                    ? `border-radius: var(--calcite-border-radius) var(--calcite-border-radius) 0 0 !important;`\n                    : \"\"\n                }\n              }\n            }\n          `}\n        </style>\n      );\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  ignoreOpenChange = false;\n\n  @Element() el: HTMLCalciteModalElement;\n\n  modalContent: HTMLDivElement;\n\n  initialOverflowCSS: string;\n\n  private mutationObserver: MutationObserver = createObserver(\"mutation\", () =>\n    this.handleMutationObserver(),\n  );\n\n  private cssVarObserver: MutationObserver = createObserver(\"mutation\", () => {\n    this.updateSizeCssVars();\n  });\n\n  titleId: string;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLDivElement;\n\n  focusTrap: FocusTrap;\n\n  closeButtonEl: HTMLButtonElement;\n\n  contentId: string;\n\n  @State() cssWidth: string | number;\n\n  @State() cssHeight: string | number;\n\n  @State() hasFooter = true;\n\n  @State() hasContentTop = false;\n\n  @State() hasContentBottom = false;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: ModalMessages;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"keydown\", { target: \"window\" })\n  handleEscape(event: KeyboardEvent): void {\n    if (this.open && !this.escapeDisabled && event.key === \"Escape\" && !event.defaultPrevented) {\n      this.open = false;\n      event.preventDefault();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteModalBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteModalClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteModalBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteModalOpen: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's \"close\" button (the first focusable item).\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  /**\n   * Updates the element(s) that are used within the focus-trap of the component.\n   */\n  @Method()\n  async updateFocusTrapElements(): Promise<void> {\n    updateFocusTrapElements(this);\n  }\n\n  /**\n   * Sets the scroll top of the component's content.\n   *\n   * @param top\n   * @param left\n   */\n  @Method()\n  async scrollContent(top = 0, left = 0): Promise<void> {\n    if (this.modalContent) {\n      if (this.modalContent.scrollTo) {\n        this.modalContent.scrollTo({ top, left, behavior: \"smooth\" });\n      } else {\n        this.modalContent.scrollTop = top;\n        this.modalContent.scrollLeft = left;\n      }\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private setTransitionEl = (el: HTMLDivElement): void => {\n    this.transitionEl = el;\n  };\n\n  onBeforeOpen(): void {\n    this.transitionEl.classList.add(CSS.openingActive);\n    this.calciteModalBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.transitionEl.classList.remove(CSS.openingIdle, CSS.openingActive);\n    this.calciteModalOpen.emit();\n    activateFocusTrap(this);\n  }\n\n  onBeforeClose(): void {\n    this.transitionEl.classList.add(CSS.closingActive);\n    this.calciteModalBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.transitionEl.classList.remove(CSS.closingIdle, CSS.closingActive);\n    this.calciteModalClose.emit();\n    deactivateFocusTrap(this);\n  }\n\n  @Watch(\"open\")\n  toggleModal(value: boolean): void {\n    if (this.ignoreOpenChange) {\n      return;\n    }\n\n    if (value) {\n      this.openModal();\n    } else {\n      this.closeModal();\n    }\n  }\n\n  @Watch(\"opened\")\n  handleOpenedChange(value: boolean): void {\n    onToggleOpenCloseComponent(this);\n    if (value) {\n      this.transitionEl?.classList.add(CSS.openingIdle);\n    } else {\n      this.transitionEl?.classList.add(CSS.closingIdle);\n    }\n  }\n\n  private openEnd = (): void => {\n    this.setFocus();\n    this.el.removeEventListener(\"calciteModalOpen\", this.openEnd);\n  };\n\n  private handleCloseClick = () => {\n    this.open = false;\n  };\n\n  private openModal() {\n    this.el.addEventListener(\"calciteModalOpen\", this.openEnd);\n    this.opened = true;\n    const titleEl = getSlotted(this.el, SLOTS.header);\n    const contentEl = getSlotted(this.el, SLOTS.content);\n\n    this.titleId = ensureId(titleEl);\n    this.contentId = ensureId(contentEl);\n\n    if (!this.slottedInShell) {\n      if (totalOpenModals === 0) {\n        initialDocumentOverflowStyle = document.documentElement.style.overflow;\n      }\n\n      totalOpenModals++;\n      // use an inline style instead of a utility class to avoid global class declarations.\n      document.documentElement.style.setProperty(\"overflow\", \"hidden\");\n    }\n  }\n\n  private handleOutsideClose = (): void => {\n    if (this.outsideCloseDisabled) {\n      return;\n    }\n\n    this.open = false;\n  };\n\n  closeModal = async (): Promise<void> => {\n    if (this.beforeClose) {\n      try {\n        await this.beforeClose(this.el);\n      } catch (_error) {\n        // close prevented\n        requestAnimationFrame(() => {\n          this.ignoreOpenChange = true;\n          this.open = true;\n          this.ignoreOpenChange = false;\n        });\n        return;\n      }\n    }\n\n    totalOpenModals--;\n    this.opened = false;\n    this.removeOverflowHiddenClass();\n  };\n\n  private removeOverflowHiddenClass(): void {\n    document.documentElement.style.setProperty(\"overflow\", initialDocumentOverflowStyle);\n  }\n\n  private handleMutationObserver = (): void => {\n    this.updateFooterVisibility();\n    this.updateFocusTrapElements();\n  };\n\n  private updateFooterVisibility = (): void => {\n    this.hasFooter = !!getSlotted(this.el, [SLOTS.back, SLOTS.primary, SLOTS.secondary]);\n  };\n\n  private updateSizeCssVars = (): void => {\n    this.cssWidth = getComputedStyle(this.el).getPropertyValue(\"--calcite-modal-width\");\n    this.cssHeight = getComputedStyle(this.el).getPropertyValue(\"--calcite-modal-height\");\n  };\n\n  private contentTopSlotChangeHandler = (event: Event): void => {\n    this.hasContentTop = slotChangeHasAssignedElement(event);\n  };\n\n  private contentBottomSlotChangeHandler = (event: Event): void => {\n    this.hasContentBottom = slotChangeHasAssignedElement(event);\n  };\n}\n"],"version":3}
+{"file":"calcite-modal.entry.cjs.js","mappings":"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","names":["createObserver","getSlotted","slotChangeHasAssignedElement","deactivateFocusTrap","activateFocusTrap","setUpMessages","setUpLoadableComponent","setComponentLoaded","connectConditionalSlotComponent","connectLocalized","connectMessages","connectFocusTrap","disconnectConditionalSlotComponent","disconnectLocalized","disconnectMessages","h","Host","getIconScale","updateMessages","componentFocusable","focusFirstTabbable","updateFocusTrapElements","onToggleOpenCloseComponent","ensureId"],"sources":["src/components/modal/resources.ts","src/components/modal/modal.scss?tag=calcite-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["export const CSS = {\n  modal: \"modal\",\n  title: \"title\",\n  header: \"header\",\n  footer: \"footer\",\n  scrim: \"scrim\",\n  back: \"back\",\n  close: \"close\",\n  secondary: \"secondary\",\n  primary: \"primary\",\n  container: \"container\",\n  containerOpen: \"container--open\",\n  content: \"content\",\n  contentNoFooter: \"content--no-footer\",\n  contentBottom: \"content-bottom\",\n  contentTop: \"content-top\",\n  slottedInShell: \"slotted-in-shell\",\n\n  // these classes help apply the animation in phases to only set transform on open/close\n  // this helps avoid a positioning issue for any floating-ui-owning children\n  openingIdle: \"modal--opening-idle\",\n  openingActive: \"modal--opening-active\",\n  closingIdle: \"modal--closing-idle\",\n  closingActive: \"modal--closing-active\",\n};\n\nexport const DURATIONS = {\n  slow: 14000,\n  medium: 10000,\n  fast: 6000,\n  test: 300 / 1000,\n};\n\nexport const ICONS = {\n  close: \"x\",\n};\n\nexport const SLOTS = {\n  content: \"content\",\n  contentBottom: \"content-bottom\",\n  contentTop: \"content-top\",\n  header: \"header\",\n  back: \"back\",\n  secondary: \"secondary\",\n  primary: \"primary\",\n};\n","@import \"~@esri/calcite-design-tokens/dist/scss/core\";\n\n/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-modal-content-background: Specifies the background color of content placed in the component's `\"content\"` slot.\n * @prop --calcite-modal-content-padding: Specifies the padding of the component's `\"content\"` slot.\n * @prop --calcite-modal-scrim-background: Specifies the background color of the component's scrim.\n * @prop --calcite-modal-width: Specifies the width of the component, using `px`, `em`, `rem`, `vw`, or `%`. Will never exceed the width of the viewport. Will not apply if `fullscreen` if set.\n * @prop --calcite-modal-height: Specifies the height of the component, using `px`, `em`, `rem`, `vh`, or `%`. Will never exceed the height of the viewport. Will not apply if `fullscreen` if set.\n *\n */\n\n:host {\n  --calcite-modal-scrim-background: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n}\n\n:host {\n  @apply absolute flex inset-0 opacity-0 z-overlay;\n  visibility: hidden !important;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n  // the modal should always use a dark scrim, regardless of light / dark mode - matches value in global.scss\n  --calcite-modal-scrim-background-internal: #{rgba($calcite-color-neutral-blk-240, $calcite-opacity-85)};\n}\n\n.content-top[hidden],\n.content-bottom[hidden] {\n  @apply hidden;\n}\n\n.container {\n  @apply text-color-2\n    fixed\n    inset-0\n    flex\n    items-center\n    justify-center\n    overflow-y-hidden\n    opacity-0\n    z-overlay;\n  visibility: hidden !important;\n  transition:\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n}\n\n:host([scale=\"s\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.3\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.4\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.1h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.n1\");\n}\n\n:host([scale=\"m\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.4\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.5\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.2h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.0\");\n}\n\n:host([scale=\"l\"]) {\n  --calcite-modal-padding-internal: theme(\"spacing.5\");\n  --calcite-modal-padding-large-internal: theme(\"spacing.6\");\n  --calcite-modal-title-text-internal: theme(\"fontSize.3h\");\n  --calcite-modal-content-text-internal: theme(\"fontSize.1\");\n}\n\n.scrim {\n  --calcite-scrim-background: var(--calcite-modal-scrim-background, var(--calcite-color-transparent-scrim));\n  @apply fixed inset-0 flex overflow-y-hidden;\n}\n\n.modal {\n  @apply shadow-2-sm\n    bg-foreground-1\n    pointer-events-none\n    float-none\n    m-6\n    box-border\n    flex\n    w-full\n    flex-col\n    overflow-hidden\n    rounded\n    opacity-0\n    z-modal;\n  -webkit-overflow-scrolling: touch;\n  visibility: hidden;\n  transition:\n    transform var(--calcite-internal-animation-timing-slow) $easing-function,\n    visibility 0ms linear var(--calcite-internal-animation-timing-slow),\n    opacity var(--calcite-internal-animation-timing-slow) $easing-function;\n\n  --calcite-modal-hidden-position: translate3d(0, 20px, 0);\n  --calcite-modal-shown-position: translate3d(0, 0, 0);\n\n  &--opening {\n    &-idle {\n      transform: var(--calcite-modal-hidden-position);\n    }\n    &-active {\n      transform: var(--calcite-modal-shown-position);\n    }\n  }\n\n  &--closing {\n    &-idle {\n      transform: var(--calcite-modal-shown-position);\n    }\n    &-active {\n      transform: var(--calcite-modal-hidden-position);\n    }\n  }\n}\n\n:host([opened]) {\n  @apply opacity-100;\n  visibility: visible !important;\n  transition-delay: 0ms;\n}\n\n.container--open {\n  @apply opacity-100;\n  visibility: visible !important;\n  transition-delay: 0ms;\n  .modal {\n    @apply pointer-events-auto visible opacity-100;\n    transition:\n      transform var(--calcite-internal-animation-timing-slow) $easing-function,\n      visibility 0ms linear,\n      opacity var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-inline-size var(--calcite-internal-animation-timing-slow) $easing-function,\n      max-block-size var(--calcite-internal-animation-timing-slow) $easing-function;\n    transition-delay: 0ms;\n  }\n}\n\n/**\n * Header\n */\n.header {\n  @apply bg-foreground-1\n    border-color-3\n    flex\n    min-w-0\n    max-w-full\n    rounded-t\n    border-0\n    border-b\n    border-solid\n    z-header;\n  flex: 0 0 auto;\n}\n\n.close {\n  @apply text-color-3\n    transition-default\n    focus-base\n    order-2\n    m-0\n    cursor-pointer\n    appearance-none\n    border-none\n    bg-transparent;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-internal);\n  flex: 0 0 auto;\n  calcite-icon {\n    @apply pointer-events-none;\n    vertical-align: -2px;\n  }\n  &:focus {\n    @apply focus-inset;\n  }\n  &:hover,\n  &:focus,\n  &:active {\n    @apply bg-foreground-2 text-color-1;\n  }\n}\n\n.title {\n  @apply order-1 flex min-w-0 items-center;\n  flex: 1 1 auto;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-large-internal);\n}\n\n@include slotted(\"header\", \"*\") {\n  @apply text-color-1 m-0 font-normal;\n  font-size: var(--calcite-modal-title-text-internal);\n}\n\n/**\n * Content area\n */\n.content {\n  @apply relative box-border block h-full overflow-auto p-0;\n  background-color: var(--calcite-modal-content-background, theme(\"colors.background.foreground.1\"));\n  max-block-size: 100%;\n  padding: var(--calcite-modal-content-padding, var(--calcite-modal-padding-internal));\n}\n\n.content-top,\n.content-bottom {\n  @apply bg-foreground-1 border-color-3 border-solid border-0 z-header flex;\n  flex: 0 0 auto;\n  padding: var(--calcite-modal-padding-internal);\n}\n\n.content-top {\n  @apply min-w-0 max-w-full border-b;\n}\n\n.content-bottom {\n  @apply mt-auto box-border w-full justify-between border-t;\n}\n\n.content-top:not(.header ~ .content-top) {\n  @apply rounded-t;\n}\n\n.content-bottom:not(.content-bottom ~ .footer),\n.content--no-footer {\n  @apply rounded-b;\n}\n\n@include slotted(\"content\", \"*\") {\n  font-size: var(--calcite-modal-context-text-internal);\n}\n\n/**\n * Footer\n */\n.footer {\n  @apply bg-foreground-1\n    border-color-3\n    mt-auto\n    box-border\n    flex\n    w-full\n    justify-between\n    rounded-b\n    border-0\n    border-t\n    border-solid\n    z-header;\n  flex: 0 0 auto;\n  padding-block: var(--calcite-modal-padding-internal);\n  padding-inline: var(--calcite-modal-padding-large-internal);\n}\n\n.footer--hide-back .back,\n.footer--hide-secondary .secondary {\n  @apply hidden;\n}\n\n.back {\n  @apply block;\n  margin-inline-end: auto;\n}\n\n.secondary {\n  @apply mx-1 block;\n}\n\nslot[name=\"primary\"] {\n  @apply block;\n}\n\n/**\n * Sizes\n */\n@mixin modal-size($size, $width) {\n  :host([width-scale=\"#{$size}\"]) .modal {\n    @apply max-h-full max-w-full;\n    inline-size: var(--calcite-modal-width, $width);\n    block-size: var(--calcite-modal-height, auto);\n  }\n\n  @media screen and (max-width: $width + 2 * $baseline) {\n    :host([width-scale=\"#{$size}\"]) {\n      .modal {\n        @apply m-0 h-full max-h-full w-full max-w-full;\n      }\n      .content {\n        flex: 1 1 auto;\n        max-block-size: unset;\n      }\n    }\n    :host([width-scale=\"#{$size}\"][docked]) .container {\n      align-items: flex-end;\n    }\n  }\n}\n\n:host([width=\"small\"]) .modal {\n  @apply w-auto;\n}\n\n@include modal-size(\"s\", 32rem);\n@include modal-size(\"m\", 48rem);\n@include modal-size(\"l\", 94rem);\n\n/**\n * Fullscreen\n */\n:host([fullscreen]) {\n  .modal {\n    @apply m-0 max-h-full max-w-full h-full w-full rounded-none;\n    --calcite-modal-hidden-position: translate3D(0, 20px, 0) scale(0.95);\n    --calcite-modal-shown-position: translate3D(0, 0, 0) scale(1);\n  }\n  .content {\n    @apply max-h-full;\n    flex: 1 1 auto;\n  }\n}\n\n:host([opened][fullscreen]) {\n  .header,\n  .footer,\n  .content-top,\n  .content-bottom {\n    border-radius: 0;\n  }\n}\n\n/**\n * Docked\n */\n:host([docked]) {\n  .modal {\n    block-size: var(--calcite-modal-height, auto);\n  }\n  .content {\n    @apply h-auto;\n    flex: 1 1 auto;\n  }\n}\n\n/**\n * Kinds\n */\n:host([kind=\"brand\"]) .modal {\n  @apply border-color-brand;\n}\n\n:host([kind=\"danger\"]) .modal {\n  @apply border-color-danger;\n}\n\n:host([kind=\"info\"]) .modal {\n  @apply border-color-info;\n}\n\n:host([kind=\"success\"]) .modal {\n  @apply border-color-success;\n}\n\n:host([kind=\"warning\"]) .modal {\n  @apply border-color-warning;\n}\n\n:host([kind=\"brand\"]),\n:host([kind=\"danger\"]),\n:host([kind=\"info\"]),\n:host([kind=\"success\"]),\n:host([kind=\"warning\"]) {\n  .modal {\n    @apply border-0 border-t-4 border-solid;\n  }\n  .header,\n  .content-top {\n    @apply rounded rounded-b-none;\n  }\n}\n\n/**\n * Tablet\n */\n@media screen and (max-width: $viewport-medium) {\n  @include slotted(\"header\", \"content-top\", \"*\") {\n    @apply text-1;\n  }\n  .footer,\n  .content-bottom {\n    @apply sticky bottom-0;\n  }\n}\n\n/**\n * Mobile\n */\n@media screen and (max-width: $viewport-small) {\n  .footer,\n  .content-bottom {\n    @apply flex-col;\n  }\n  .back,\n  .secondary {\n    @apply m-0 mb-1;\n  }\n}\n\n/**\n * Conditional styles for when Modal is slotted in Shell\n */\n\n.container.slotted-in-shell {\n  position: absolute;\n  pointer-events: auto;\n  calcite-scrim {\n    position: absolute;\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport {\n  ensureId,\n  focusFirstTabbable,\n  getSlotted,\n  slotChangeHasAssignedElement,\n} from \"../../utils/dom\";\nimport {\n  activateFocusTrap,\n  connectFocusTrap,\n  deactivateFocusTrap,\n  FocusTrap,\n  FocusTrapComponent,\n  updateFocusTrapElements,\n} from \"../../utils/focusTrapComponent\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { createObserver } from \"../../utils/observers\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { Kind, Scale } from \"../interfaces\";\nimport { CSS, ICONS, SLOTS } from \"./resources\";\n\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { ModalMessages } from \"./assets/modal/t9n\";\n\nimport { getIconScale } from \"../../utils/component\";\n\nlet totalOpenModals: number = 0;\nlet initialDocumentOverflowStyle: string = \"\";\n\n/**\n * @slot header - A slot for adding header text.\n * @slot content - A slot for adding the component's content.\n * @slot content-top - A slot for adding content to the component's sticky header, where content remains at the top of the component when scrolling up and down.\n * @slot content-bottom - A slot for adding content to the component's sticky footer, where content remains at the bottom of the component when scrolling up and down.\n * @slot primary - A slot for adding a primary button.\n * @slot secondary - A slot for adding a secondary button.\n * @slot back - A slot for adding a back button.\n */\n\n@Component({\n  tag: \"calcite-modal\",\n  styleUrl: \"modal.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Modal\n  implements\n    ConditionalSlotComponent,\n    OpenCloseComponent,\n    FocusTrapComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, displays and positions the component.  */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /**\n   * We use an internal property to handle styles for when a modal is actually opened, not just when the open attribute is applied. This is a property because we need to apply styles to the host element and to keep the styles present while beforeClose is.\n   *\n   * @internal\n   */\n  @Prop({ mutable: true, reflect: true }) opened = false;\n\n  /** Passes a function to run before the component closes. */\n  @Prop() beforeClose: (el: HTMLCalciteModalElement) => Promise<void>;\n\n  /** When `true`, disables the component's close button. */\n  @Prop({ reflect: true }) closeButtonDisabled = false;\n\n  /**\n   * When `true`, prevents focus trapping.\n   */\n  @Prop({ reflect: true }) focusTrapDisabled = false;\n\n  @Watch(\"focusTrapDisabled\")\n  handleFocusTrapDisabled(focusTrapDisabled: boolean): void {\n    if (!this.open) {\n      return;\n    }\n\n    focusTrapDisabled ? deactivateFocusTrap(this) : activateFocusTrap(this);\n  }\n\n  /** When `true`, disables the closing of the component when clicked outside. */\n  @Prop({ reflect: true }) outsideCloseDisabled = false;\n\n  /** When `true`, prevents the component from expanding to the entire screen on mobile devices. */\n  @Prop({ reflect: true }) docked: boolean;\n\n  /** When `true`, disables the default close on escape behavior. */\n  @Prop({ reflect: true }) escapeDisabled = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) widthScale: Scale = \"m\";\n\n  /** Sets the component to always be fullscreen. Overrides `widthScale` and `--calcite-modal-width` / `--calcite-modal-height`. */\n  @Prop({ reflect: true }) fullscreen: boolean;\n\n  /** Specifies the kind of the component, which will apply to top border. */\n  @Prop({ reflect: true }) kind: Extract<\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\", Kind>;\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: ModalMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<ModalMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /**\n   * This internal property, managed by a containing calcite-shell, is used\n   * to inform the component if special configuration or styles are needed\n   *\n   * @internal\n   */\n  @Prop({ mutable: true }) slottedInShell: boolean;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    // when modal initially renders, if active was set we need to open as watcher doesn't fire\n    if (this.open) {\n      requestAnimationFrame(() => this.openModal());\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  connectedCallback(): void {\n    this.mutationObserver?.observe(this.el, { childList: true, subtree: true });\n    this.cssVarObserver?.observe(this.el, { attributeFilter: [\"style\"] });\n    this.updateSizeCssVars();\n    this.updateFooterVisibility();\n    connectConditionalSlotComponent(this);\n    connectLocalized(this);\n    connectMessages(this);\n    connectFocusTrap(this);\n  }\n\n  disconnectedCallback(): void {\n    this.removeOverflowHiddenClass();\n    this.mutationObserver?.disconnect();\n    this.cssVarObserver?.disconnect();\n    disconnectConditionalSlotComponent(this);\n    deactivateFocusTrap(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.slottedInShell = false;\n  }\n\n  render(): VNode {\n    return (\n      <Host\n        aria-describedby={this.contentId}\n        aria-labelledby={this.titleId}\n        aria-modal=\"true\"\n        role=\"dialog\"\n      >\n        <div\n          class={{\n            [CSS.container]: true,\n            [CSS.containerOpen]: this.opened,\n            [CSS.slottedInShell]: this.slottedInShell,\n          }}\n        >\n          <calcite-scrim class={CSS.scrim} onClick={this.handleOutsideClose} />\n          {this.renderStyle()}\n          <div\n            class={{\n              [CSS.modal]: true,\n            }}\n            // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n            ref={this.setTransitionEl}\n          >\n            <div class={CSS.header}>\n              {this.renderCloseButton()}\n              <header class={CSS.title}>\n                <slot name={CSS.header} />\n              </header>\n            </div>\n            {this.renderContentTop()}\n            <div\n              class={{\n                [CSS.content]: true,\n                [CSS.contentNoFooter]: !this.hasFooter,\n              }}\n              // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n              ref={(el) => (this.modalContent = el)}\n            >\n              <slot name={SLOTS.content} />\n            </div>\n            {this.renderContentBottom()}\n            {this.renderFooter()}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  renderFooter(): VNode {\n    return this.hasFooter ? (\n      <div class={CSS.footer} key=\"footer\">\n        <span class={CSS.back}>\n          <slot name={SLOTS.back} />\n        </span>\n        <span class={CSS.secondary}>\n          <slot name={SLOTS.secondary} />\n        </span>\n        <span class={CSS.primary}>\n          <slot name={SLOTS.primary} />\n        </span>\n      </div>\n    ) : null;\n  }\n\n  renderContentTop(): VNode {\n    return (\n      <div class={CSS.contentTop} hidden={!this.hasContentTop}>\n        <slot name={SLOTS.contentTop} onSlotchange={this.contentTopSlotChangeHandler} />\n      </div>\n    );\n  }\n\n  renderContentBottom(): VNode {\n    return (\n      <div class={CSS.contentBottom} hidden={!this.hasContentBottom}>\n        <slot name={SLOTS.contentBottom} onSlotchange={this.contentBottomSlotChangeHandler} />\n      </div>\n    );\n  }\n\n  renderCloseButton(): VNode {\n    return !this.closeButtonDisabled ? (\n      <button\n        aria-label={this.messages.close}\n        class={CSS.close}\n        key=\"button\"\n        onClick={this.handleCloseClick}\n        title={this.messages.close}\n        // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)\n        ref={(el) => (this.closeButtonEl = el)}\n      >\n        <calcite-icon icon={ICONS.close} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  renderStyle(): VNode {\n    if (!this.fullscreen && (this.cssWidth || this.cssHeight)) {\n      return (\n        <style>\n          {`.${CSS.container} {\n              ${this.docked && this.cssWidth ? `align-items: center !important;` : \"\"}\n            }\n            .${CSS.modal} {\n              block-size: ${this.cssHeight ? this.cssHeight : \"auto\"} !important;\n              ${this.cssWidth ? `inline-size: ${this.cssWidth} !important;` : \"\"}\n              ${this.cssWidth ? `max-inline-size: ${this.cssWidth} !important;` : \"\"}\n              ${this.docked ? `border-radius: var(--calcite-border-radius) !important;` : \"\"}\n            }\n            @media screen and (max-width: ${this.cssWidth}) {\n              .${CSS.container} {\n                ${this.docked ? `align-items: flex-end !important;` : \"\"}\n              }\n              .${CSS.modal} {\n                max-block-size: 100% !important;\n                inline-size: 100% !important;\n                max-inline-size: 100% !important;\n                min-inline-size: 100% !important;\n                margin: 0 !important;\n                ${!this.docked ? `block-size: 100% !important;` : \"\"}\n                ${!this.docked ? `border-radius: 0 !important;` : \"\"}\n                ${\n                  this.docked\n                    ? `border-radius: var(--calcite-border-radius) var(--calcite-border-radius) 0 0 !important;`\n                    : \"\"\n                }\n              }\n            }\n          `}\n        </style>\n      );\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties/ State\n  //\n  //--------------------------------------------------------------------------\n\n  ignoreOpenChange = false;\n\n  @Element() el: HTMLCalciteModalElement;\n\n  modalContent: HTMLDivElement;\n\n  initialOverflowCSS: string;\n\n  private mutationObserver: MutationObserver = createObserver(\"mutation\", () =>\n    this.handleMutationObserver(),\n  );\n\n  private cssVarObserver: MutationObserver = createObserver(\"mutation\", () => {\n    this.updateSizeCssVars();\n  });\n\n  titleId: string;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLDivElement;\n\n  focusTrap: FocusTrap;\n\n  closeButtonEl: HTMLButtonElement;\n\n  contentId: string;\n\n  @State() cssWidth: string | number;\n\n  @State() cssHeight: string | number;\n\n  @State() hasFooter = true;\n\n  @State() hasContentTop = false;\n\n  @State() hasContentBottom = false;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: ModalMessages;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"keydown\", { target: \"window\" })\n  handleEscape(event: KeyboardEvent): void {\n    if (this.open && !this.escapeDisabled && event.key === \"Escape\" && !event.defaultPrevented) {\n      this.open = false;\n      event.preventDefault();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteModalBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteModalClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteModalBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteModalOpen: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Sets focus on the component's \"close\" button (the first focusable item).\n   *\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    focusFirstTabbable(this.el);\n  }\n\n  /**\n   * Updates the element(s) that are used within the focus-trap of the component.\n   */\n  @Method()\n  async updateFocusTrapElements(): Promise<void> {\n    updateFocusTrapElements(this);\n  }\n\n  /**\n   * Sets the scroll top of the component's content.\n   *\n   * @param top\n   * @param left\n   */\n  @Method()\n  async scrollContent(top = 0, left = 0): Promise<void> {\n    if (this.modalContent) {\n      if (this.modalContent.scrollTo) {\n        this.modalContent.scrollTo({ top, left, behavior: \"smooth\" });\n      } else {\n        this.modalContent.scrollTop = top;\n        this.modalContent.scrollLeft = left;\n      }\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private setTransitionEl = (el: HTMLDivElement): void => {\n    this.transitionEl = el;\n  };\n\n  onBeforeOpen(): void {\n    this.transitionEl.classList.add(CSS.openingActive);\n    this.calciteModalBeforeOpen.emit();\n  }\n\n  onOpen(): void {\n    this.transitionEl.classList.remove(CSS.openingIdle, CSS.openingActive);\n    this.calciteModalOpen.emit();\n    activateFocusTrap(this);\n  }\n\n  onBeforeClose(): void {\n    this.transitionEl.classList.add(CSS.closingActive);\n    this.calciteModalBeforeClose.emit();\n  }\n\n  onClose(): void {\n    this.transitionEl.classList.remove(CSS.closingIdle, CSS.closingActive);\n    this.calciteModalClose.emit();\n    deactivateFocusTrap(this);\n  }\n\n  @Watch(\"open\")\n  toggleModal(value: boolean): void {\n    if (this.ignoreOpenChange) {\n      return;\n    }\n\n    if (value) {\n      this.openModal();\n    } else {\n      this.closeModal();\n    }\n  }\n\n  @Watch(\"opened\")\n  handleOpenedChange(value: boolean): void {\n    onToggleOpenCloseComponent(this);\n    if (value) {\n      this.transitionEl?.classList.add(CSS.openingIdle);\n    } else {\n      this.transitionEl?.classList.add(CSS.closingIdle);\n    }\n  }\n\n  private openEnd = (): void => {\n    this.setFocus();\n    this.el.removeEventListener(\"calciteModalOpen\", this.openEnd);\n  };\n\n  private handleCloseClick = () => {\n    this.open = false;\n  };\n\n  private openModal() {\n    this.el.addEventListener(\"calciteModalOpen\", this.openEnd);\n    this.opened = true;\n    const titleEl = getSlotted(this.el, SLOTS.header);\n    const contentEl = getSlotted(this.el, SLOTS.content);\n\n    this.titleId = ensureId(titleEl);\n    this.contentId = ensureId(contentEl);\n\n    if (!this.slottedInShell) {\n      if (totalOpenModals === 0) {\n        initialDocumentOverflowStyle = document.documentElement.style.overflow;\n      }\n\n      totalOpenModals++;\n      // use an inline style instead of a utility class to avoid global class declarations.\n      document.documentElement.style.setProperty(\"overflow\", \"hidden\");\n    }\n  }\n\n  private handleOutsideClose = (): void => {\n    if (this.outsideCloseDisabled) {\n      return;\n    }\n\n    this.open = false;\n  };\n\n  closeModal = async (): Promise<void> => {\n    if (this.beforeClose) {\n      try {\n        await this.beforeClose(this.el);\n      } catch (_error) {\n        // close prevented\n        requestAnimationFrame(() => {\n          this.ignoreOpenChange = true;\n          this.open = true;\n          this.ignoreOpenChange = false;\n        });\n        return;\n      }\n    }\n\n    totalOpenModals--;\n    this.opened = false;\n    this.removeOverflowHiddenClass();\n  };\n\n  private removeOverflowHiddenClass(): void {\n    document.documentElement.style.setProperty(\"overflow\", initialDocumentOverflowStyle);\n  }\n\n  private handleMutationObserver = (): void => {\n    this.updateFooterVisibility();\n    this.updateFocusTrapElements();\n  };\n\n  private updateFooterVisibility = (): void => {\n    this.hasFooter = !!getSlotted(this.el, [SLOTS.back, SLOTS.primary, SLOTS.secondary]);\n  };\n\n  private updateSizeCssVars = (): void => {\n    this.cssWidth = getComputedStyle(this.el).getPropertyValue(\"--calcite-modal-width\");\n    this.cssHeight = getComputedStyle(this.el).getPropertyValue(\"--calcite-modal-height\");\n  };\n\n  private contentTopSlotChangeHandler = (event: Event): void => {\n    this.hasContentTop = slotChangeHasAssignedElement(event);\n  };\n\n  private contentBottomSlotChangeHandler = (event: Event): void => {\n    this.hasContentBottom = slotChangeHasAssignedElement(event);\n  };\n}\n"],"version":3}

package/dist/cjs/calcite-navigation_3.cjs.entry.js

@@ -1,17 +1,17 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v2.2.0-next.11
+ * v2.2.0-next.12
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-8b34daf0.js');
-const dom = require('./dom-96b95ba5.js');
-const loadable = require('./loadable-64558297.js');
-require('./guid-f81db95d.js');
-require('./resources-1e439750.js');
+const index = require('./index-41b2d7a6.js');
+const dom = require('./dom-8573aa26.js');
+const loadable = require('./loadable-d0df67a5.js');
+require('./guid-ce508a49.js');
+require('./resources-91df8f40.js');
 
 const CSS$2 = {
     container: "container",
@@ -112,7 +112,7 @@ const CalciteNavigation = class {
     //  Public Methods
     //
     //--------------------------------------------------------------------------
-    /** When `navigation-action` is `true`, sets focus on the component's action element. */
+    /** When `navigationAction` is `true`, sets focus on the component's action element. */
     async setFocus() {
         await loadable.componentFocusable(this);
         return this.navigationActionEl?.setFocus();