@esri/calcite-components 2.4.1-next.0 → 2.5.0-next.0

package/dist/calcite/p-8fcc31af.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CSS","modal","title","header","footer","scrim","back","close","secondary","primary","container","containerOpen","content","contentNoFooter","contentBottom","contentTop","slottedInShell","openingIdle","openingActive","closingIdle","closingActive","ICONS","SLOTS","modalCss","totalOpenModals","initialDocumentOverflowStyle","Modal","this","ignoreOpenChange","mutationObserver","createObserver","handleMutationObserver","cssVarObserver","updateSizeCssVars","openTransitionProp","setTransitionEl","el","transitionEl","openEnd","setFocus","removeEventListener","handleCloseClick","open","handleOutsideClose","outsideCloseDisabled","closeModal","async","beforeClose","_error","requestAnimationFrame","opened","removeOverflowHiddenClass","updateFooterVisibility","updateFocusTrapElements","hasFooter","getSlotted","cssWidth","getComputedStyle","getPropertyValue","cssHeight","contentTopSlotChangeHandler","event","hasContentTop","slotChangeHasAssignedElement","contentBottomSlotChangeHandler","hasContentBottom","handleFocusTrapDisabled","focusTrapDisabled","deactivateFocusTrap","activateFocusTrap","onMessagesChange","componentWillLoad","setUpMessages","setUpLoadableComponent","openModal","componentDidLoad","setComponentLoaded","connectedCallback","observe","childList","subtree","attributeFilter","connectConditionalSlotComponent","connectLocalized","connectMessages","connectFocusTrap","disconnectedCallback","disconnect","disconnectConditionalSlotComponent","disconnectLocalized","disconnectMessages","render","h","Host","contentId","titleId","role","class","onClick","renderStyle","ref","renderCloseButton","name","renderContentTop","modalContent","renderContentBottom","renderFooter","key","hidden","onSlotchange","closeButtonDisabled","messages","closeButtonEl","icon","scale","getIconScale","fullscreen","docked","effectiveLocaleChange","updateMessages","effectiveLocale","handleEscape","escapeDisabled","defaultPrevented","preventDefault","componentFocusable","focusFirstTabbable","scrollContent","top","left","scrollTo","behavior","scrollTop","scrollLeft","onBeforeOpen","classList","add","calciteModalBeforeOpen","emit","onOpen","remove","calciteModalOpen","onBeforeClose","calciteModalBeforeClose","onClose","calciteModalClose","toggleModal","value","handleOpenedChange","idleClass","onToggleOpenCloseComponent","componentOnReady","addEventListener","titleEl","contentEl","ensureId","document","documentElement","style","overflow","setProperty"],"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 { componentOnReady, 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      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    const idleClass = value ? CSS.openingIdle : CSS.closingIdle;\n    this.transitionEl.classList.add(idleClass);\n    onToggleOpenCloseComponent(this);\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 async openModal(): Promise<void> {\n    await componentOnReady(this.el);\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"],"mappings":"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"}

package/dist/calcite/p-9020d0e6.entry.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{r as t,c as s,h as i,g as e,H as a}from"./p-aa4a7aa0.js";import{c as o,u as n,d as r,I as c}from"./p-45af6cec.js";import{s as l,a as h,c as d}from"./p-705f04ba.js";import{c as f,d as u}from"./p-9e925631.js";import{c as p}from"./p-8d22af5c.js";import{u as m,c as b,s as w,d as g}from"./p-3c675720.js";import{g as v,m as x,d as y,a as k,s as L,h as j,b as I,c as C,k as D,e as z,i as H,f as S,j as A,l as F,n as R,r as B,o as E,p as U,q as _,t as M,L as O,I as V,C as q,S as G}from"./p-3ac4588f.js";import{d as K,a as T,c as W}from"./p-da496453.js";import{d as $,e as P}from"./p-2a0f60c9.js";import{c as J,d as N}from"./p-b77f3a77.js";import{g as Q}from"./p-2b05e96c.js";import"./p-0b4fc200.js";import"./p-5bdc1461.js";import"./p-bf26a6ed.js";import"./p-c00b8868.js";import"./p-b4352ddb.js";const X={container:"container",handle:"handle"};var Y;(function(t){t["grip"]="grip"})(Y||(Y={}));function Z(t,s,i){const{items:e,messages:a}=i;const o=e.length;const n=v(i,t)+1;const r=s==="idle"?a.dragHandleIdle:s==="active"?a.dragHandleActive:s==="change"?a.dragHandleChange:a.dragHandleCommit;return st(r,t.label,n,o)}function tt(t){const s=t.composedPath().find((t=>t.dataset?.jsHandle!==undefined));const i=t.composedPath().find((t=>t.tagName?.toLowerCase()==="calcite-value-list-item"));return{handle:s,item:i}}function st(t,s,i,e){const a=t.replace("{position}",i.toString());const o=a.replace("{itemLabel}",s);return o.replace("{total}",e.toString())}const it=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;flex-grow:0;flex-direction:column;align-items:stretch;background-color:transparent;font-size:var(--calcite-font-size--1);color:var(--calcite-color-text-2)}:host *{box-sizing:border-box}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}calcite-value-list-item:last-of-type{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([filter-enabled]) header{margin-block-end:0.25rem;display:flex;align-items:center;justify-content:flex-end;background-color:var(--calcite-color-foreground-1);--tw-shadow:0 1px 0 var(--calcite-color-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([filter-enabled]) header.sticky-pos{position:sticky;inset-block-start:0px;z-index:var(--calcite-z-index-sticky)}calcite-filter{margin-block-end:1px}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}:host([hidden]){display:none}[hidden]{display:none}";const et=class{constructor(i){t(this,i);this.calciteListChange=s(this,"calciteListChange",6);this.calciteListOrderChange=s(this,"calciteListOrderChange",6);this.calciteListFilter=s(this,"calciteListFilter",6);this.lastSelectedItem=null;this.mutationObserver=p("mutation",x.bind(this));this.handleSelector=`.${X.handle}`;this.dragSelector="calcite-value-list-item";this.setFilterEl=t=>{this.filterEl=t};this.setFilteredItems=t=>{this.filteredItems=t};this.deselectRemovedItems=y.bind(this);this.deselectSiblingItems=k.bind(this);this.selectSiblings=L.bind(this);this.handleFilter=j.bind(this);this.handleFilterEvent=I.bind(this);this.getItemData=C.bind(this);this.keyDownHandler=t=>{if(t.defaultPrevented){return}const{handle:s,item:i}=tt(t);if(s&&!i.handleActivated&&t.key===" "){this.updateScreenReaderText(Z(i,"commit",this))}if(!s||!i.handleActivated){D.call(this,t);return}t.preventDefault();const{items:e}=this;if(t.key===" "){this.updateScreenReaderText(Z(i,"active",this))}if(t.key!=="ArrowUp"&&t.key!=="ArrowDown"||e.length<=1){return}const{el:a}=this;const o=z(this,i,t.key==="ArrowUp"?"up":"down");if(o===e.length-1){a.appendChild(i)}else{const t=a.children[o];const s=t===i.nextElementSibling?t.nextElementSibling:t;a.insertBefore(i,s)}this.items=this.getItems();this.calciteListOrderChange.emit(this.items.map((({value:t})=>t)));requestAnimationFrame((()=>$(s)));i.handleActivated=true;this.updateHandleAriaLabel(s,Z(i,"change",this))};this.storeAssistiveEl=t=>{this.assistiveTextEl=t};this.handleFocusIn=t=>{const{handle:s,item:i}=tt(t);if(!i?.handleActivated&&i&&s){this.updateHandleAriaLabel(s,Z(i,"idle",this))}};this.disabled=false;this.canPull=undefined;this.canPut=undefined;this.dragEnabled=false;this.filteredItems=[];this.filteredData=[];this.filterEnabled=false;this.filterPlaceholder=undefined;this.filterText=undefined;this.group=undefined;this.loading=false;this.multiple=false;this.selectionFollowsFocus=false;this.messageOverrides=undefined;this.messages=undefined;this.dataForFilter=[];this.defaultMessages=undefined;this.effectiveLocale="";this.selectedValues=new Map}onMessagesChange(){}effectiveLocaleChange(){m(this,this.effectiveLocale)}connectedCallback(){if(K(this)){return}o(this);f(this);b(this);H.call(this);S.call(this);this.setUpSorting()}async componentWillLoad(){l(this);await w(this)}componentDidLoad(){h(this);A.call(this)}componentDidRender(){n(this)}disconnectedCallback(){if(K(this)){return}r(this);T(this);u(this);g(this);F.call(this)}calciteListFocusOutHandler(t){R.call(this,t)}calciteListItemRemoveHandler(t){B.call(this,t)}calciteListItemChangeHandler(t){E.call(this,t)}calciteInternalListItemPropsChangeHandler(t){t.stopPropagation();this.setUpFilter()}calciteInternalListItemValueChangeHandler(t){U.call(this,t);t.stopPropagation()}onGlobalDragStart(){F.call(this)}onGlobalDragEnd(){S.call(this)}onDragEnd(){}onDragStart(){}onDragSort(){this.items=Array.from(this.el.querySelectorAll("calcite-value-list-item"));const t=this.items.map((t=>t.value));this.calciteListOrderChange.emit(t)}getItems(){return Array.from(this.el.querySelectorAll("calcite-value-list-item"))}setUpItems(){_.call(this,"calcite-value-list-item");this.setUpSorting()}setUpFilter(){if(this.filterEnabled){this.dataForFilter=this.getItemData()}}setUpSorting(){const{dragEnabled:t}=this;if(!t){return}W(this)}handleBlur(){if(this.dragEnabled){this.updateScreenReaderText("")}}async getSelectedItems(){return this.selectedValues}async setFocus(t){await d(this);return M.call(this,t)}getIconType(){let t=null;if(this.dragEnabled){t=Y.grip}return t}updateScreenReaderText(t){this.assistiveTextEl.textContent=t}updateHandleAriaLabel(t,s){t.ariaLabel=s}handleValueListItemBlur(t){const{item:s,handle:i}=t.detail;if(!s?.handleActivated&&s){this.updateHandleAriaLabel(i,Z(s,"idle",this))}t.stopPropagation()}render(){return i(O,{onBlur:this.handleBlur,onFocusin:this.handleFocusIn,onKeyDown:this.keyDownHandler,props:this})}static get assetsDirs(){return["assets"]}get el(){return e(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};et.style=it;const at={drag:"drag"};const ot={actionsEnd:"actions-end",actionsStart:"actions-start"};const nt=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{margin-block-end:1px;box-sizing:border-box;display:flex;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);color:var(--calcite-color-text-2);--tw-shadow:0 1px 0 var(--calcite-color-border-3);--tw-shadow-colored:0 1px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition:background-color var(--calcite-animation-timing), box-shadow var(--calcite-animation-timing)}:host *{box-sizing:border-box}calcite-pick-list-item{position:relative;margin:0px;flex-grow:1;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host([active]),:host([selected]){--tw-shadow:0 0 0 1px var(--calcite-color-brand);--tw-shadow-colored:0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.handle{display:flex;cursor:move;align-items:center;justify-content:center;border-style:none;background-color:transparent;padding-block:0px;padding-inline:0.25rem;color:var(--calcite-color-border-input);outline-color:transparent}.handle:hover{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}.handle:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.handle--activated{background-color:var(--calcite-color-foreground-3);color:var(--calcite-color-text-1)}.handle calcite-icon{color:inherit}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";const rt=class{constructor(i){t(this,i);this.calciteListItemChange=s(this,"calciteListItemChange",6);this.calciteListItemRemove=s(this,"calciteListItemRemove",7);this.calciteValueListItemDragHandleBlur=s(this,"calciteValueListItemDragHandleBlur",6);this.pickListItem=null;this.guid=`calcite-value-list-item-${Q()}`;this.getPickListRef=t=>this.pickListItem=t;this.handleKeyDown=t=>{if(t.key===" "){this.handleActivated=!this.handleActivated}};this.handleBlur=()=>{this.handleActivated=false;this.calciteValueListItemDragHandleBlur.emit({item:this.el,handle:this.handleEl})};this.handleSelectChange=t=>{this.selected=t.detail.selected};this.description=undefined;this.disabled=false;this.deselectDisabled=false;this.nonInteractive=false;this.handleActivated=false;this.icon=null;this.iconFlipRtl=false;this.label=undefined;this.metadata=undefined;this.removable=false;this.selected=false;this.value=undefined}connectedCallback(){J(this);o(this)}disconnectedCallback(){N(this);r(this)}componentWillLoad(){l(this)}componentDidLoad(){h(this)}componentDidRender(){n(this)}async toggleSelected(t){this.pickListItem.toggleSelected(t)}async setFocus(){await d(this);return this.pickListItem?.setFocus()}calciteListItemChangeHandler(t){t.detail.item=this.el}renderActionsEnd(){const{el:t}=this;const s=P(t,ot.actionsEnd);return s?i("slot",{name:ot.actionsEnd,slot:G.actionsEnd}):null}renderActionsStart(){const{el:t}=this;const s=P(t,ot.actionsStart);return s?i("slot",{name:ot.actionsStart,slot:G.actionsStart}):null}renderHandle(){const{icon:t,iconFlipRtl:s}=this;if(t===V.grip){return i("span",{class:{[q.handle]:true,[q.handleActivated]:this.handleActivated},"data-js-handle":true,onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,role:"button",tabindex:"0",ref:t=>this.handleEl=t},i("calcite-icon",{flipRtl:s,icon:at.drag,scale:"s"}))}}render(){return i(a,{id:this.el.id||this.guid},i(c,{disabled:this.disabled},this.renderHandle(),i("calcite-pick-list-item",{description:this.description,deselectDisabled:this.deselectDisabled,disabled:this.disabled,label:this.label,metadata:this.metadata,nonInteractive:this.nonInteractive,onCalciteListItemChange:this.handleSelectChange,removable:this.removable,selected:this.selected,value:this.value,ref:this.getPickListRef},this.renderActionsStart(),this.renderActionsEnd())))}get el(){return e(this)}};rt.style=nt;export{et as calcite_value_list,rt as calcite_value_list_item};
+//# sourceMappingURL=p-9020d0e6.entry.js.map

package/dist/calcite/p-9020d0e6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CSS","container","handle","ICON_TYPES","getScreenReaderText","item","status","valueList","items","messages","total","length","position","getItemIndex","template","dragHandleIdle","dragHandleActive","dragHandleChange","dragHandleCommit","replacePlaceholders","label","getHandleAndItemElement","event","composedPath","find","dataset","jsHandle","undefined","tagName","toLowerCase","text","replacePosition","replace","toString","replaceLabel","valueListCss","ValueList","this","lastSelectedItem","mutationObserver","createObserver","mutationObserverCallback","bind","handleSelector","dragSelector","setFilterEl","el","filterEl","setFilteredItems","filteredItems","deselectRemovedItems","deselectSiblingItems","selectSiblings","handleFilter","handleFilterEvent","getItemData","keyDownHandler","defaultPrevented","handleActivated","key","updateScreenReaderText","call","preventDefault","nextIndex","moveItemIndex","appendChild","itemAtNextIndex","children","insertionReferenceItem","nextElementSibling","insertBefore","getItems","calciteListOrderChange","emit","map","value","requestAnimationFrame","focusElement","updateHandleAriaLabel","storeAssistiveEl","assistiveTextEl","handleFocusIn","Map","onMessagesChange","effectiveLocaleChange","updateMessages","effectiveLocale","connectedCallback","dragActive","connectInteractive","connectLocalized","connectMessages","initialize","initializeObserver","setUpSorting","componentWillLoad","setUpLoadableComponent","setUpMessages","componentDidLoad","setComponentLoaded","handleInitialFilter","componentDidRender","updateHostInteraction","disconnectedCallback","disconnectInteractive","disconnectSortableComponent","disconnectLocalized","disconnectMessages","cleanUpObserver","calciteListFocusOutHandler","calciteListItemRemoveHandler","removeItem","calciteListItemChangeHandler","calciteInternalListItemPropsChangeHandler","stopPropagation","setUpFilter","calciteInternalListItemValueChangeHandler","onGlobalDragStart","onGlobalDragEnd","onDragEnd","onDragStart","onDragSort","Array","from","querySelectorAll","values","setUpItems","filterEnabled","dataForFilter","dragEnabled","connectSortableComponent","handleBlur","getSelectedItems","selectedValues","setFocus","focusId","componentFocusable","getIconType","type","grip","textContent","handleElement","ariaLabel","handleValueListItemBlur","detail","render","h","List","onBlur","onFocusin","onKeyDown","props","ICONS","drag","SLOTS","actionsEnd","actionsStart","valueListItemCss","ValueListItem","pickListItem","guid","getPickListRef","handleKeyDown","calciteValueListItemDragHandleBlur","handleEl","handleSelectChange","selected","connectConditionalSlotComponent","disconnectConditionalSlotComponent","toggleSelected","coerce","renderActionsEnd","hasActionsEnd","getSlotted","name","slot","PICK_LIST_SLOTS","renderActionsStart","hasActionsStart","renderHandle","icon","iconFlipRtl","class","role","tabindex","ref","flipRtl","scale","Host","id","InteractiveContainer","disabled","description","deselectDisabled","metadata","nonInteractive","onCalciteListItemChange","removable"],"sources":["src/components/value-list/resources.ts","src/components/value-list/utils.ts","src/components/value-list/value-list.scss?tag=calcite-value-list&encapsulation=shadow","src/components/value-list/value-list.tsx","src/components/value-list-item/resources.ts","src/components/value-list-item/value-list-item.scss?tag=calcite-value-list-item&encapsulation=shadow","src/components/value-list-item/value-list-item.tsx"],"sourcesContent":["export const CSS = {\n  container: \"container\",\n  handle: \"handle\",\n};\nexport enum ICON_TYPES {\n  grip = \"grip\",\n}\nexport const TEXT = {\n  filterResults: \"Filter results\",\n};\n","import { getItemIndex } from \"../pick-list/shared-list-logic\";\nimport { DragStatus } from \"./interfaces\";\nimport { ValueList } from \"./value-list\";\n\nexport function getScreenReaderText(\n  item: HTMLCalciteValueListItemElement,\n  status: DragStatus,\n  valueList: ValueList<HTMLCalciteValueListItemElement>,\n): string {\n  const { items, messages } = valueList;\n\n  const total = items.length;\n  const position = getItemIndex(valueList, item) + 1;\n  const template =\n    status === \"idle\"\n      ? messages.dragHandleIdle\n      : status === \"active\"\n        ? messages.dragHandleActive\n        : status === \"change\"\n          ? messages.dragHandleChange\n          : messages.dragHandleCommit;\n\n  return replacePlaceholders(template, item.label, position, total);\n}\n\nexport function getHandleAndItemElement(event: KeyboardEvent | FocusEvent): {\n  handle: HTMLCalciteHandleElement;\n  item: HTMLCalciteValueListItemElement;\n} {\n  const handle = event\n    .composedPath()\n    .find((item: HTMLElement) => item.dataset?.jsHandle !== undefined) as HTMLCalciteHandleElement;\n\n  const item = event\n    .composedPath()\n    .find(\n      (item: HTMLElement) => item.tagName?.toLowerCase() === \"calcite-value-list-item\",\n    ) as HTMLCalciteValueListItemElement;\n\n  return { handle, item };\n}\n\nexport function replacePlaceholders(text: string, label: string, position: number, total: number): string {\n  const replacePosition = text.replace(\"{position}\", position.toString());\n  const replaceLabel = replacePosition.replace(\"{itemLabel}\", label);\n  return replaceLabel.replace(\"{total}\", total.toString());\n}\n",":host {\n  @apply text-color-2\n    text-n1\n    relative\n    box-border\n    flex\n    flex-shrink-0\n    flex-grow-0\n    flex-col\n    items-stretch\n    bg-transparent;\n  * {\n    @apply box-border;\n  }\n}\n\n@include disabled();\n\ncalcite-value-list-item:last-of-type {\n  @apply shadow-none;\n}\n\n:host([filter-enabled]) header {\n  @apply bg-foreground-1\n    mb-1\n    flex\n    items-center\n    justify-end;\n  &.sticky-pos {\n    @apply sticky top-0 z-sticky;\n  }\n  @apply shadow-border-bottom;\n}\n\ncalcite-filter {\n  @apply mb-px;\n}\n\n.assistive-text {\n  @apply sr-only;\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Listen,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport Sortable from \"sortablejs\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport { createObserver } from \"../../utils/observers\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport {\n  calciteInternalListItemValueChangeHandler,\n  calciteListFocusOutHandler,\n  calciteListItemChangeHandler,\n  cleanUpObserver,\n  deselectRemovedItems,\n  deselectSiblingItems,\n  getItemData,\n  handleFilter,\n  handleFilterEvent,\n  handleInitialFilter,\n  initialize,\n  initializeObserver,\n  ItemData,\n  keyDownHandler,\n  ListFocusId,\n  moveItemIndex,\n  mutationObserverCallback,\n  removeItem,\n  selectSiblings,\n  setFocus,\n  setUpItems,\n} from \"../pick-list/shared-list-logic\";\nimport List from \"../pick-list/shared-list-render\";\nimport { ListItemAndHandle } from \"../value-list-item/interfaces\";\nimport { ValueListMessages } from \"./assets/value-list/t9n\";\nimport { CSS, ICON_TYPES } from \"./resources\";\nimport { getHandleAndItemElement, getScreenReaderText } from \"./utils\";\nimport {\n  DragDetail,\n  connectSortableComponent,\n  disconnectSortableComponent,\n  SortableComponent,\n  dragActive,\n} from \"../../utils/sortableComponent\";\nimport { focusElement } from \"../../utils/dom\";\n\n/**\n * @deprecated Use the `list` component instead.\n * @slot - A slot for adding `calcite-value-list-item` elements. List items are displayed as a vertical list.\n * @slot menu-actions - A slot for adding a button and menu combination for performing actions, such as sorting.\n */\n@Component({\n  tag: \"calcite-value-list\",\n  styleUrl: \"value-list.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class ValueList<\n    ItemElement extends HTMLCalciteValueListItemElement = HTMLCalciteValueListItemElement,\n  >\n  implements\n    InteractiveComponent,\n    LoadableComponent,\n    LocalizedComponent,\n    T9nComponent,\n    SortableComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * When provided, the method will be called to determine whether the element can move from the list.\n   */\n  @Prop() canPull: (detail: DragDetail) => boolean;\n\n  /**\n   * When provided, the method will be called to determine whether the element can be added from another list.\n   */\n  @Prop() canPut: (detail: DragDetail) => boolean;\n\n  /**\n   * When `true`, `calcite-value-list-item`s are sortable via a draggable button.\n   */\n  @Prop({ reflect: true }) dragEnabled = false;\n\n  /**\n   * The currently filtered items.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) filteredItems: HTMLCalciteValueListItemElement[] = [];\n\n  /**\n   * The currently filtered data.\n   *\n   * @readonly\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by shared-list-logic module\n  @Prop({ mutable: true }) filteredData: ItemData = [];\n\n  /**\n   * When `true`, an input appears at the top of the component that can be used by end users to filter list items.\n   */\n  @Prop({ reflect: true }) filterEnabled = false;\n\n  /**\n   * Placeholder text for the filter's input field.\n   */\n  @Prop({ reflect: true }) filterPlaceholder: string;\n\n  /**\n   * Text for the filter input field.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by shared-list-logic module\n  @Prop({ reflect: true, mutable: true }) filterText: string;\n\n  /**\n   * The component's group identifier.\n   *\n   * To drag elements from one list into another, both lists must have the same group value.\n   */\n  @Prop({ reflect: true }) group?: string;\n\n  /**\n   * When `true`, a busy indicator is displayed.\n   */\n  @Prop({ reflect: true }) loading = false;\n\n  /**\n   * Similar to standard radio buttons and checkboxes.\n   * When `true`, a user can select multiple `calcite-value-list-item`s at a time.\n   * When `false`, only a single `calcite-value-list-item` can be selected at a time,\n   * and a new selection will deselect previous selections.\n   */\n  @Prop({ reflect: true }) multiple = false;\n\n  /**\n   * When `true` and single-selection is enabled, the selection changes when navigating `calcite-value-list-item`s via keyboard.\n   */\n  @Prop({ reflect: true }) selectionFollowsFocus = false;\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<ValueListMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\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: ValueListMessages;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteValueListElement;\n\n  @State() dataForFilter: ItemData = [];\n\n  @State() defaultMessages: ValueListMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() selectedValues: Map<string, ItemElement> = new Map();\n\n  items: ItemElement[];\n\n  lastSelectedItem: ItemElement = null;\n\n  mutationObserver = createObserver(\"mutation\", mutationObserverCallback.bind(this));\n\n  sortable: Sortable;\n\n  emitCalciteListChange: () => void;\n\n  emitCalciteListFilter: () => void;\n\n  filterEl: HTMLCalciteFilterElement;\n\n  assistiveTextEl: HTMLSpanElement;\n\n  handleSelector = `.${CSS.handle}`;\n\n  dragSelector = \"calcite-value-list-item\";\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    if (dragActive(this)) {\n      return;\n    }\n\n    connectInteractive(this);\n    connectLocalized(this);\n    connectMessages(this);\n    initialize.call(this);\n    initializeObserver.call(this);\n    this.setUpSorting();\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n    handleInitialFilter.call(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    if (dragActive(this)) {\n      return;\n    }\n\n    disconnectInteractive(this);\n    disconnectSortableComponent(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    cleanUpObserver.call(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Emits when any of the list item selections have changed.\n   */\n  @Event({ cancelable: false }) calciteListChange: EventEmitter<\n    Map<string, HTMLCalciteValueListItemElement>\n  >;\n\n  /**\n   * Emits when the order of the list has changed.\n   */\n  @Event({ cancelable: false }) calciteListOrderChange: EventEmitter<any[]>;\n\n  /**\n   * Emits when a filter has changed.\n   */\n  @Event({ cancelable: false }) calciteListFilter: EventEmitter<void>;\n\n  @Listen(\"focusout\")\n  calciteListFocusOutHandler(event: FocusEvent): void {\n    calciteListFocusOutHandler.call(this, event);\n  }\n\n  @Listen(\"calciteListItemRemove\")\n  calciteListItemRemoveHandler(event: CustomEvent<void>): void {\n    removeItem.call(this, event);\n  }\n\n  @Listen(\"calciteListItemChange\")\n  calciteListItemChangeHandler(event: CustomEvent): void {\n    calciteListItemChangeHandler.call(this, event);\n  }\n\n  @Listen(\"calciteInternalListItemPropsChange\")\n  calciteInternalListItemPropsChangeHandler(event: CustomEvent): void {\n    event.stopPropagation();\n    this.setUpFilter();\n  }\n\n  @Listen(\"calciteInternalListItemValueChange\")\n  calciteInternalListItemValueChangeHandler(event: CustomEvent): void {\n    calciteInternalListItemValueChangeHandler.call(this, event);\n    event.stopPropagation();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  onGlobalDragStart(): void {\n    cleanUpObserver.call(this);\n  }\n\n  onGlobalDragEnd(): void {\n    initializeObserver.call(this);\n  }\n\n  onDragEnd(): void {}\n\n  onDragStart(): void {}\n\n  onDragSort(): void {\n    this.items = Array.from(this.el.querySelectorAll<ItemElement>(\"calcite-value-list-item\"));\n    const values = this.items.map((item) => item.value);\n    this.calciteListOrderChange.emit(values);\n  }\n\n  getItems(): ItemElement[] {\n    return Array.from(this.el.querySelectorAll<ItemElement>(\"calcite-value-list-item\"));\n  }\n\n  setUpItems(): void {\n    setUpItems.call(this, \"calcite-value-list-item\");\n    this.setUpSorting();\n  }\n\n  setUpFilter(): void {\n    if (this.filterEnabled) {\n      this.dataForFilter = this.getItemData();\n    }\n  }\n\n  setFilterEl = (el: HTMLCalciteFilterElement): void => {\n    this.filterEl = el;\n  };\n\n  setFilteredItems = (filteredItems: HTMLCalciteValueListItemElement[]): void => {\n    this.filteredItems = filteredItems;\n  };\n\n  setUpSorting(): void {\n    const { dragEnabled } = this;\n\n    if (!dragEnabled) {\n      return;\n    }\n\n    connectSortableComponent(this);\n  }\n\n  deselectRemovedItems = deselectRemovedItems.bind(this);\n\n  deselectSiblingItems = deselectSiblingItems.bind(this);\n\n  selectSiblings = selectSiblings.bind(this);\n\n  handleFilter = handleFilter.bind(this);\n\n  handleFilterEvent = handleFilterEvent.bind(this);\n\n  getItemData = getItemData.bind(this);\n\n  keyDownHandler = (event: KeyboardEvent): void => {\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    const { handle, item } = getHandleAndItemElement(event);\n    if (handle && !item.handleActivated && event.key === \" \") {\n      this.updateScreenReaderText(getScreenReaderText(item, \"commit\", this));\n    }\n\n    if (!handle || !item.handleActivated) {\n      keyDownHandler.call(this, event);\n      return;\n    }\n\n    event.preventDefault();\n\n    const { items } = this;\n\n    if (event.key === \" \") {\n      this.updateScreenReaderText(getScreenReaderText(item, \"active\", this));\n    }\n\n    if ((event.key !== \"ArrowUp\" && event.key !== \"ArrowDown\") || items.length <= 1) {\n      return;\n    }\n\n    const { el } = this;\n    const nextIndex = moveItemIndex(this, item, event.key === \"ArrowUp\" ? \"up\" : \"down\");\n    if (nextIndex === items.length - 1) {\n      el.appendChild(item);\n    } else {\n      const itemAtNextIndex = el.children[nextIndex];\n      const insertionReferenceItem =\n        itemAtNextIndex === item.nextElementSibling\n          ? itemAtNextIndex.nextElementSibling\n          : itemAtNextIndex;\n      el.insertBefore(item, insertionReferenceItem);\n    }\n\n    this.items = this.getItems();\n    this.calciteListOrderChange.emit(this.items.map(({ value }) => value));\n\n    requestAnimationFrame(() => focusElement(handle));\n    item.handleActivated = true;\n\n    this.updateHandleAriaLabel(handle, getScreenReaderText(item, \"change\", this));\n  };\n\n  handleBlur(): void {\n    if (this.dragEnabled) {\n      this.updateScreenReaderText(\"\");\n    }\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Returns the component's selected items. */\n  @Method()\n  async getSelectedItems(): Promise<Map<string, HTMLCalciteValueListItemElement>> {\n    return this.selectedValues;\n  }\n\n  /**\n   * Sets focus on the component's first focusable element.\n   *\n   * @param focusId\n   */\n  @Method()\n  async setFocus(focusId?: ListFocusId): Promise<void> {\n    await componentFocusable(this);\n\n    return setFocus.call(this, focusId);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  getIconType(): ICON_TYPES | null {\n    let type = null;\n    if (this.dragEnabled) {\n      type = ICON_TYPES.grip;\n    }\n    return type;\n  }\n\n  updateScreenReaderText(text: string): void {\n    this.assistiveTextEl.textContent = text;\n  }\n\n  updateHandleAriaLabel(handleElement: HTMLSpanElement, text: string): void {\n    handleElement.ariaLabel = text;\n  }\n\n  storeAssistiveEl = (el: HTMLSpanElement): void => {\n    this.assistiveTextEl = el;\n  };\n\n  handleFocusIn = (event: FocusEvent): void => {\n    const { handle, item } = getHandleAndItemElement(event);\n    if (!item?.handleActivated && item && handle) {\n      this.updateHandleAriaLabel(handle, getScreenReaderText(item, \"idle\", this));\n    }\n  };\n\n  @Listen(\"calciteValueListItemDragHandleBlur\")\n  handleValueListItemBlur(event: CustomEvent<ListItemAndHandle>): void {\n    const { item, handle } = event.detail;\n    if (!item?.handleActivated && item) {\n      this.updateHandleAriaLabel(handle, getScreenReaderText(item, \"idle\", this));\n    }\n    event.stopPropagation();\n  }\n\n  render(): VNode {\n    return (\n      <List\n        onBlur={this.handleBlur}\n        onFocusin={this.handleFocusIn}\n        onKeyDown={this.keyDownHandler}\n        props={this}\n      />\n    );\n  }\n}\n","export const ICONS = {\n  drag: \"drag\",\n};\n\nexport const SLOTS = {\n  actionsEnd: \"actions-end\",\n  actionsStart: \"actions-start\",\n};\n",":host {\n  @apply bg-foreground-1\n    text-color-2\n    text-n1\n    shadow-border-bottom\n    mb-px\n    box-border\n    flex;\n  transition:\n    background-color var(--calcite-animation-timing),\n    box-shadow var(--calcite-animation-timing);\n  * {\n    @apply box-border;\n  }\n}\n\ncalcite-pick-list-item {\n  @apply relative\n    m-0\n    flex-grow\n    shadow-none;\n}\n\n:host([active]),\n:host([selected]) {\n  @apply shadow-outline-active;\n}\n\n.handle {\n  @apply flex\n    cursor-move\n    items-center\n    justify-center\n    border-none\n    bg-transparent\n    py-0\n    px-1;\n  color: theme(\"borderColor.color.input\");\n  &:hover {\n    @apply bg-foreground-2 text-color-1;\n  }\n  @apply focus-base;\n  &:focus {\n    @apply focus-inset;\n  }\n  &--activated {\n    @apply bg-foreground-3 text-color-1;\n  }\n  calcite-icon {\n    color: inherit;\n  }\n}\n\n@include disabled();\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  VNode,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport { getSlotted } from \"../../utils/dom\";\nimport { guid } from \"../../utils/guid\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { CSS, SLOTS as PICK_LIST_SLOTS } from \"../pick-list-item/resources\";\nimport { ICON_TYPES } from \"../pick-list/resources\";\nimport { ListItemAndHandle } from \"./interfaces\";\nimport { ICONS, SLOTS } from \"./resources\";\n\n/**\n * @deprecated Use the `list` component instead.\n * @slot actions-end - A slot for adding `calcite-action`s or content to the end side of the component.\n * @slot actions-start - A slot for adding `calcite-action`s or content to the start side of the component.\n */\n@Component({\n  tag: \"calcite-value-list-item\",\n  styleUrl: \"value-list-item.scss\",\n  shadow: true,\n})\nexport class ValueListItem\n  implements ConditionalSlotComponent, InteractiveComponent, LoadableComponent\n{\n  // --------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * A description for the component that displays below the label text.\n   */\n  @Prop({ reflect: true }) description?: string;\n\n  /**\n   * When `true`, interaction is prevented and the component is displayed with lower opacity.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * @internal\n   */\n  @Prop() deselectDisabled = false;\n\n  /**\n   * When `true`, prevents the content of the component from user interaction.\n   */\n  @Prop({ reflect: true }) nonInteractive = false;\n\n  /**\n   * @internal\n   */\n  @Prop({ mutable: true }) handleActivated? = false;\n\n  /**\n   * Determines the icon SVG symbol that will be shown. Options are circle, square, grip or null.\n   *\n   * @see [ICON_TYPES](https://github.com/Esri/calcite-design-system/blob/main/src/components/pick-list/resources.ts#L5)\n   */\n  @Prop({ reflect: true }) icon?: ICON_TYPES | null = null;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /**\n   * Label and accessible name for the component. Appears next to the icon.\n   */\n  @Prop({ reflect: true }) label!: string;\n\n  /**\n   * Provides additional metadata to the component. Primary use is for a filter on the parent list.\n   */\n  @Prop() metadata?: Record<string, unknown>;\n\n  /**\n   * When `true`, adds an action to remove the component.\n   */\n  @Prop({ reflect: true }) removable = false;\n\n  /**\n   * When `true`, the component is selected.\n   */\n  @Prop({ reflect: true, mutable: true }) selected = false;\n\n  /**\n   * The component's value.\n   */\n  @Prop() value!: any;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteValueListItemElement;\n\n  pickListItem: HTMLCalcitePickListItemElement = null;\n\n  handleEl: HTMLSpanElement;\n\n  guid = `calcite-value-list-item-${guid()}`;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectConditionalSlotComponent(this);\n    connectInteractive(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectConditionalSlotComponent(this);\n    disconnectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Toggle the selection state. By default this won't trigger an event.\n   * The first argument allows the value to be coerced, rather than swapping values.\n   *\n   * @param coerce\n   */\n  @Method()\n  async toggleSelected(coerce?: boolean): Promise<void> {\n    this.pickListItem.toggleSelected(coerce);\n  }\n\n  /** Set focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    return this.pickListItem?.setFocus();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  // --------------------------------------------------------------------------\n\n  /**\n   * Fires when the component is selected or unselected.\n   */\n  @Event({ cancelable: false }) calciteListItemChange: EventEmitter<{\n    item: HTMLCalciteValueListItemElement;\n    value: any;\n    selected: boolean;\n    shiftPressed: boolean;\n  }>;\n\n  /**\n   * Fires when the remove button is pressed.\n   */\n  @Event({ cancelable: true }) calciteListItemRemove: EventEmitter<void>; // wrapped pick-list-item emits this\n\n  /**\n   * @internal\n   */\n  @Event({ cancelable: false })\n  calciteValueListItemDragHandleBlur: EventEmitter<ListItemAndHandle>;\n\n  @Listen(\"calciteListItemChange\")\n  calciteListItemChangeHandler(event: CustomEvent): void {\n    // adjust item payload from wrapped item before bubbling\n    event.detail.item = this.el;\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  getPickListRef = (el: HTMLCalcitePickListItemElement): HTMLCalcitePickListItemElement =>\n    (this.pickListItem = el);\n\n  handleKeyDown = (event: KeyboardEvent): void => {\n    if (event.key === \" \") {\n      this.handleActivated = !this.handleActivated;\n    }\n  };\n\n  handleBlur = (): void => {\n    this.handleActivated = false;\n    this.calciteValueListItemDragHandleBlur.emit({ item: this.el, handle: this.handleEl });\n  };\n\n  handleSelectChange = (event: CustomEvent): void => {\n    this.selected = event.detail.selected;\n  };\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  renderActionsEnd(): VNode {\n    const { el } = this;\n    const hasActionsEnd = getSlotted(el, SLOTS.actionsEnd);\n\n    return hasActionsEnd ? (\n      <slot name={SLOTS.actionsEnd} slot={PICK_LIST_SLOTS.actionsEnd} />\n    ) : null;\n  }\n\n  renderActionsStart(): VNode {\n    const { el } = this;\n    const hasActionsStart = getSlotted(el, SLOTS.actionsStart);\n\n    return hasActionsStart ? (\n      <slot name={SLOTS.actionsStart} slot={PICK_LIST_SLOTS.actionsStart} />\n    ) : null;\n  }\n\n  renderHandle(): VNode {\n    const { icon, iconFlipRtl } = this;\n    if (icon === ICON_TYPES.grip) {\n      return (\n        <span\n          class={{\n            [CSS.handle]: true,\n            [CSS.handleActivated]: this.handleActivated,\n          }}\n          data-js-handle\n          onBlur={this.handleBlur}\n          onKeyDown={this.handleKeyDown}\n          role=\"button\"\n          tabindex=\"0\"\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.handleEl = el as HTMLSpanElement)}\n        >\n          <calcite-icon flipRtl={iconFlipRtl} icon={ICONS.drag} scale=\"s\" />\n        </span>\n      );\n    }\n  }\n\n  render(): VNode {\n    return (\n      <Host id={this.el.id || this.guid}>\n        <InteractiveContainer disabled={this.disabled}>\n          {this.renderHandle()}\n          <calcite-pick-list-item\n            description={this.description}\n            deselectDisabled={this.deselectDisabled}\n            disabled={this.disabled}\n            label={this.label}\n            metadata={this.metadata}\n            nonInteractive={this.nonInteractive}\n            onCalciteListItemChange={this.handleSelectChange}\n            removable={this.removable}\n            selected={this.selected}\n            value={this.value}\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.getPickListRef}\n          >\n            {this.renderActionsStart()}\n            {this.renderActionsEnd()}\n          </calcite-pick-list-item>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/calcite/p-9111d38f.entry.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{r as t,c as e,h as i,H as s,g as a}from"./p-aa4a7aa0.js";import{s as n,a as l}from"./p-705f04ba.js";import{u as c,s as o,c as r,d as h}from"./p-3c675720.js";import{n as d,c as p,d as b}from"./p-9e925631.js";import{g as f}from"./p-0b4fc200.js";import"./p-2a0f60c9.js";import"./p-2b05e96c.js";import"./p-b4352ddb.js";import"./p-5bdc1461.js";import"./p-8d22af5c.js";const u={bordered:"bordered",striped:"striped",selectionArea:"selection-area",paginationArea:"pagination-area",container:"container",tableContainer:"table-container",tableFixed:"table--fixed",assistiveText:"assistive-text",selectionActions:"selection-actions"};const g={selectionActions:"selection-actions",tableHeader:"table-header",tableFooter:"table-footer"};const m=":host([scale=s]){--calcite-internal-table-cell-padding:0.25rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--2);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--3)}:host([scale=m]){--calcite-internal-table-cell-padding:0.5rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size--1);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--2)}:host([scale=l]){--calcite-internal-table-cell-padding:1rem;--calcite-internal-table-cell-font-size:var(--calcite-font-size-0);--calcite-internal-table-cell-font-size-secondary:var(--calcite-font-size--1)}:host{display:flex}.container{display:flex;block-size:100%;inline-size:100%;flex-direction:column}.table-container{overflow:auto;white-space:nowrap;border:1px solid var(--calcite-color-border-3)}.assistive-text{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}table{inline-size:100%;border-collapse:collapse;overflow-x:scroll}.table--fixed{table-layout:fixed}.bordered ::slotted(calcite-table-row){--calcite-table-row-border-color:var(--calcite-color-border-3)}.striped ::slotted(calcite-table-row:nth-child(2n+1)){--calcite-table-row-background:var(--calcite-color-foreground-2)}.selection-actions{display:flex;flex-direction:row;margin-inline-start:auto}.selection-area{display:flex;flex-direction:row;align-items:center;padding-block:var(--calcite-internal-table-cell-padding)}.selection-area calcite-chip:last-of-type{margin-inline-end:0.5rem}.selection-area calcite-chip:last-of-type:not(:first-of-type){margin-inline-start:0.5rem}.selection-area calcite-button{margin-inline-end:1rem}.pagination-area{display:flex;inline-size:100%;flex-direction:row;justify-content:center;padding-block:var(--calcite-internal-table-cell-padding)}calcite-pagination{flex:1;justify-content:center}:host([hidden]){display:none}[hidden]{display:none}";const v=class{constructor(i){t(this,i);this.calciteTableSelect=e(this,"calciteTableSelect",6);this.calciteTablePageChange=e(this,"calciteTablePageChange",6);this.calciteInternalTableRowFocusChange=e(this,"calciteInternalTableRowFocusChange",6);this.getSlottedRows=t=>t?.assignedElements({flatten:true})?.filter((t=>t?.matches("calcite-table-row")));this.updateRows=()=>{const t=this.getSlottedRows(this.tableHeadSlotEl)||[];const e=this.getSlottedRows(this.tableBodySlotEl)||[];const i=this.getSlottedRows(this.tableFootSlotEl)||[];const s=[...t,...e,...i];t?.forEach((e=>{const i=t?.indexOf(e);e.rowType="head";e.positionSection=i;e.positionSectionLocalized=this.localizeNumber((i+1).toString())}));e?.forEach((t=>{const i=e?.indexOf(t);t.rowType="body";t.positionSection=i;t.positionSectionLocalized=this.localizeNumber((i+1).toString())}));i?.forEach((t=>{const e=i?.indexOf(t);t.rowType="foot";t.positionSection=e;t.positionSectionLocalized=this.localizeNumber((e+1).toString())}));s?.forEach((t=>{t.selectionMode=this.selectionMode;t.bodyRowCount=e?.length;t.positionAll=s?.indexOf(t);t.numbered=this.numbered;t.scale=this.scale;t.readCellContentsToAT=this.readCellContentsToAT;t.lastVisibleRow=s?.indexOf(t)===s.length-1}));const a=t[0]?.cellCount||t[0]?.querySelectorAll("calcite-table-header")?.length;this.colCount=a;this.headRows=t;this.bodyRows=e;this.footRows=i;this.allRows=s;this.updateSelectedItems();this.paginateRows()};this.handlePaginationChange=()=>{const t=this.paginationEl?.startItem;this.pageStartRow=t||1;this.calciteTablePageChange.emit();this.updateRows()};this.paginateRows=()=>{this.bodyRows?.forEach((t=>{const e=t.positionSection+1;const i=e>=this.pageStartRow&&e<this.pageStartRow+this.pageSize;t.hidden=this.pageSize>0&&!i&&!this.footRows.includes(t);t.lastVisibleRow=e===this.pageStartRow+this.pageSize-1||e===this.bodyRows.length}))};this.updateSelectedItems=t=>{const e=this.bodyRows?.filter((t=>t.selected));this.selectedItems=e;this.selectedCount=e?.length;this.allRows?.forEach((t=>{t.selectedRowCount=this.selectedCount;t.selectedRowCountLocalized=this.localizeNumber(this.selectedCount)}));if(t){this.calciteTableSelect.emit()}};this.handleDeselectAllRows=()=>{this.bodyRows?.forEach((t=>{t.selected=false}));this.updateSelectedItems(true)};this.setSelectedItems=t=>{this.bodyRows?.forEach((e=>{if(t?.rowType==="head"){e.selected=this.selectedCount!==this.bodyRows?.length}else{e.selected=t===e?!e.selected:this.selectionMode==="multiple"?e.selected:false}}));this.updateSelectedItems(true)};this.localizeNumber=t=>{d.numberFormatOptions={locale:this.effectiveLocale,numberingSystem:this.numberingSystem,useGrouping:this.groupSeparator};return d.localize(t.toString())};this.bordered=false;this.caption=undefined;this.groupSeparator=false;this.layout="auto";this.numbered=false;this.numberingSystem=undefined;this.pageSize=0;this.scale="m";this.selectionMode="none";this.zebra=false;this.striped=false;this.selectedItems=[];this.messages=undefined;this.messageOverrides=undefined;this.colCount=0;this.pageStartRow=1;this.selectedCount=0;this.readCellContentsToAT=undefined;this.defaultMessages=undefined;this.effectiveLocale=""}handleNumberedChange(){this.updateRows()}onMessagesChange(){}effectiveLocaleChange(){c(this,this.effectiveLocale)}async componentWillLoad(){n(this);await o(this);this.readCellContentsToAT=/safari/i.test(f());this.updateRows()}componentDidLoad(){l(this)}connectedCallback(){p(this);r(this)}disconnectedCallback(){b(this);h(this)}calciteChipSelectListener(t){if(t.composedPath().includes(this.el)){this.setSelectedItems(t.target)}}calciteInternalTableRowFocusEvent(t){const e=t["detail"].cellPosition;const i=t["detail"].rowPosition;const s=t["detail"].destination;const a=t["detail"].lastCell;const n=this.bodyRows?.filter((t=>!t.hidden));const l=this.allRows?.filter((t=>!t.hidden));const c=this.headRows[this.headRows.length-1]?.positionAll;const o=n[0]?.positionAll;const r=n[n.length-1]?.positionAll;const h=this.footRows[0]?.positionAll;const d=l[l.length-1]?.positionAll;const p=s==="next"&&i===c;const b=s==="previous"&&i===h;const f=s==="previous"&&i===o;const u=s==="next"&&i===r;let g;switch(s){case"first":g=0;break;case"last":g=d;break;case"next":g=p?o:u?h:i+1;break;case"previous":g=b?r:f?c:i-1;break}const m=this.allRows?.find((t=>t.positionAll===g))?.cellCount;const v=e>m?m:e;if(g!==undefined){this.calciteInternalTableRowFocusChange.emit({cellPosition:v,rowPosition:g,destination:s,lastCell:a})}}renderSelectionArea(){const t=this.selectedItems?.filter((t=>t.hidden))?.length;const e=this.localizeNumber(t?.toString());const s=this.localizeNumber(this.selectedCount?.toString());const a=`${s} ${this.messages.selected}`;const n=`${e} ${this.messages.hiddenSelected}`;return i("div",{class:u.selectionArea},i("calcite-chip",{kind:this.selectedCount>0?"brand":"neutral",scale:this.scale,value:a},a),t>0&&i("calcite-chip",{icon:"hide-empty",scale:this.scale,title:n,value:n},e),this.selectedCount>0&&i("calcite-button",{"icon-start":"x",kind:"neutral",onClick:this.handleDeselectAllRows,round:true,scale:this.scale,title:`${this.messages.clear} ${a} ${this.messages.row}`},this.messages.clear),i("div",{class:u.selectionActions},i("slot",{name:g.selectionActions})))}renderPaginationArea(){return i("div",{class:u.paginationArea},i("calcite-pagination",{groupSeparator:this.groupSeparator,numberingSystem:this.numberingSystem,onCalcitePaginationChange:this.handlePaginationChange,pageSize:this.pageSize,scale:this.scale,startItem:1,totalItems:this.bodyRows?.length,ref:t=>this.paginationEl=t}))}renderTHead(){return i("thead",null,i("slot",{name:g.tableHeader,onSlotchange:this.updateRows,ref:t=>this.tableHeadSlotEl=t}))}renderTBody(){return i("tbody",null,i("slot",{onSlotchange:this.updateRows,ref:t=>this.tableBodySlotEl=t}))}renderTFoot(){return i("tfoot",null,i("slot",{name:g.tableFooter,onSlotchange:this.updateRows,ref:t=>this.tableFootSlotEl=t}))}render(){return i(s,null,i("div",{class:u.container},this.selectionMode!=="none"&&this.renderSelectionArea(),i("div",{class:{[u.bordered]:this.bordered,[u.striped]:this.striped||this.zebra,[u.tableContainer]:true}},i("table",{"aria-colcount":this.colCount,"aria-multiselectable":this.selectionMode==="multiple","aria-readonly":true,"aria-rowcount":this.allRows?.length,class:{[u.tableFixed]:this.layout==="fixed"},role:"grid"},i("caption",{class:u.assistiveText},this.caption),this.renderTHead(),this.renderTBody(),this.renderTFoot())),this.pageSize>0&&this.renderPaginationArea()))}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{groupSeparator:["handleNumberedChange"],numbered:["handleNumberedChange"],numberingSystem:["handleNumberedChange"],pageSize:["handleNumberedChange"],scale:["handleNumberedChange"],selectionMode:["handleNumberedChange"],messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};v.style=m;export{v as calcite_table};
+//# sourceMappingURL=p-9111d38f.entry.js.map

package/dist/calcite/p-9926ee56.entry.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{r as e,c as t,h as i,H as n,g as o}from"./p-aa4a7aa0.js";import{g as l,t as a}from"./p-2a0f60c9.js";import{a as s,c as r,d as c,H as h}from"./p-237e7376.js";import{c as d,d as m,u as p,I as u}from"./p-45af6cec.js";import{c as f,d as g}from"./p-f501737a.js";import{s as b,a as v,c as k}from"./p-705f04ba.js";import{c as w}from"./p-8d22af5c.js";import{V as x}from"./p-8a08539c.js";import"./p-2b05e96c.js";import"./p-b4352ddb.js";import"./p-0b4fc200.js";import"./p-f4650a58.js";const y={itemWrapper:"item-wrapper"};const z=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:flex;flex-direction:column}.item-wrapper{display:flex;background-color:var(--calcite-color-foreground-1);inline-size:-moz-fit-content;inline-size:fit-content;outline:1px solid var(--calcite-color-border-input);outline-offset:-1px}:host([appearance=outline])>.item-wrapper{background-color:transparent}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([layout=vertical])>.item-wrapper{flex-direction:column;align-items:flex-start;align-self:flex-start}:host([width=full])>.item-wrapper{inline-size:100%;min-inline-size:-moz-fit-content;min-inline-size:fit-content}:host([width=full])>.item-wrapper ::slotted(calcite-segmented-control-item){flex:1 1 auto}:host([width=full][layout=vertical])>.item-wrapper ::slotted(calcite-segmented-control-item){justify-content:flex-start}.validation-container{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}:host([scale=m]) .validation-container,:host([scale=l]) .validation-container{padding-block-start:0.5rem}:host([scale=s]) .validation-container{padding-block-start:0.25rem}::slotted(input[slot=hidden-form-input]){margin:0 !important;opacity:0 !important;outline:none !important;padding:0 !important;position:absolute !important;inset:0 !important;transform:none !important;-webkit-appearance:none !important;z-index:-1 !important}:host([hidden]){display:none}[hidden]{display:none}";const C=class{constructor(i){e(this,i);this.calciteSegmentedControlChange=t(this,"calciteSegmentedControlChange",6);this.handleClick=e=>{if(this.disabled){return}if(e.target.localName==="calcite-segmented-control-item"){this.selectItem(e.target,true)}};this.mutationObserver=w("mutation",(()=>this.setUpItems()));this.appearance="solid";this.disabled=false;this.form=undefined;this.required=false;this.name=undefined;this.layout="horizontal";this.scale="m";this.value=null;this.selectedItem=undefined;this.status="idle";this.validationMessage=undefined;this.validationIcon=undefined;this.width="auto"}handlePropsChange(){this.handleItemPropChange()}valueHandler(e){const t=this.getItems();t.forEach((t=>t.checked=t.value===e))}handleSelectedItemChange(e,t){this.value=e?.value;if(e===t){return}const i=this.getItems();const n=i.filter((t=>t===e)).pop();if(n){this.selectItem(n)}else if(i[0]){i[0].tabIndex=0}}componentWillLoad(){b(this);this.setUpItems()}componentDidLoad(){s(this,this.value);v(this)}connectedCallback(){d(this);f(this);r(this);this.mutationObserver?.observe(this.el,{childList:true});this.handleItemPropChange()}disconnectedCallback(){m(this);g(this);c(this);this.mutationObserver?.unobserve(this.el)}componentDidRender(){p(this)}render(){return i(n,{onClick:this.handleClick,role:"radiogroup"},i("div",{class:y.itemWrapper},i(u,{disabled:this.disabled},i("slot",null),i(h,{component:this}))),this.validationMessage?i(x,{icon:this.validationIcon,message:this.validationMessage,scale:this.scale,status:this.status}):null)}handleSelected(e){e.preventDefault();this.selectItem(e.target);e.stopPropagation()}handleKeyDown(e){const t=["ArrowLeft","ArrowUp","ArrowRight","ArrowDown"," "];const{key:i}=e;const{el:n,selectedItem:o}=this;if(t.indexOf(i)===-1){return}let a=i;if(l(n)==="rtl"){if(i==="ArrowRight"){a="ArrowLeft"}if(i==="ArrowLeft"){a="ArrowRight"}}const s=this.getItems();let r=-1;s.forEach(((e,t)=>{if(e===o){r=t}}));switch(a){case"ArrowLeft":case"ArrowUp":e.preventDefault();const t=r<1?s[s.length-1]:s[r-1];this.selectItem(t,true);return;case"ArrowRight":case"ArrowDown":e.preventDefault();const i=r===-1?s[1]:s[r+1]||s[0];this.selectItem(i,true);return;case" ":e.preventDefault();this.selectItem(e.target,true);return;default:return}}async setFocus(){await k(this);(this.selectedItem||this.getItems()[0])?.focus()}handleItemPropChange(){const e=this.getItems();e.forEach((e=>{e.appearance=this.appearance;e.layout=this.layout;e.scale=this.scale}))}onLabelClick(){this.setFocus()}getItems(){return Array.from(this.el.querySelectorAll("calcite-segmented-control-item"))}selectItem(e,t=false){if(e===this.selectedItem){return}const i=this.getItems();let n=null;i.forEach((i=>{const o=i===e;if(o&&!i.checked||!o&&i.checked){i.checked=o}i.tabIndex=o?0:-1;if(o){n=i;if(t){this.calciteSegmentedControlChange.emit()}}}));this.selectedItem=n;if(n){n.focus()}}setUpItems(){const e=this.getItems();const t=e.filter((e=>e.checked)).pop();if(t){this.selectItem(t)}else if(e[0]){e[0].tabIndex=0}}get el(){return o(this)}static get watchers(){return{appearance:["handlePropsChange"],layout:["handlePropsChange"],scale:["handlePropsChange"],value:["valueHandler"],selectedItem:["handleSelectedItemChange"]}}};C.style=z;const j={input:"input"};const A={segmentedControlItemIcon:"segmented-control-item-icon"};const I=":host{display:flex;cursor:pointer;align-self:stretch;font-weight:var(--calcite-font-weight-normal);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-animation-timing) ease-in-out}:host label{pointer-events:none;margin:0.125rem;box-sizing:border-box;display:flex;flex:1 1 0%;align-items:center;color:var(--calcite-color-text-3);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-internal-animation-timing-fast) ease-in-out, color var(--calcite-internal-animation-timing-fast) ease-in-out}.label--horizontal{justify-content:center}:host{outline-color:transparent}:host(:focus){outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          );outline-offset:-1px}.label--scale-s{padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-block:0.125rem}.label--scale-m{padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-block:0.375rem}.label--scale-l{padding-inline:1rem;padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host(:hover) label{background-color:var(--calcite-color-foreground-2);color:var(--calcite-color-text-1)}:host(:active) label{background-color:var(--calcite-color-foreground-3)}:host([checked]) label{cursor:default;border-color:var(--calcite-color-brand);background-color:var(--calcite-color-brand);color:var(--calcite-color-text-inverse)}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{border-color:var(--calcite-color-brand);background-color:var(--calcite-color-foreground-1);box-shadow:inset 0 0 0 1px var(--calcite-color-brand);color:var(--calcite-color-brand)}:host([checked]) .label--outline{background-color:transparent}::slotted(input){display:none}@media (forced-colors: active){:host([checked]) label{background-color:highlight}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{outline:2px solid transparent;outline-offset:2px}:host([checked]) label:not([class~=label--outline]) .segmented-control-item-icon{color:highlightText}}.segmented-control-item-icon{position:relative;margin:0px;display:inline-flex;line-height:inherit}:host([icon-start]) .label--scale-s .segmented-control-item-icon{margin-inline-end:0.5rem}:host([icon-end]) .label--scale-s .segmented-control-item-icon{margin-inline-start:0.5rem}:host([icon-start]) .label--scale-m .segmented-control-item-icon{margin-inline-end:0.75rem}:host([icon-end]) .label--scale-m .segmented-control-item-icon{margin-inline-start:0.75rem}:host([icon-start]) .label--scale-l .segmented-control-item-icon{margin-inline-end:1rem}:host([icon-end]) .label--scale-l .segmented-control-item-icon{margin-inline-start:1rem}:host([hidden]){display:none}[hidden]{display:none}";const L=class{constructor(i){e(this,i);this.calciteInternalSegmentedControlItemChange=t(this,"calciteInternalSegmentedControlItemChange",6);this.checked=false;this.iconFlipRtl=false;this.iconStart=undefined;this.iconEnd=undefined;this.value=undefined;this.appearance="solid";this.layout="horizontal";this.scale="m"}handleCheckedChange(){this.calciteInternalSegmentedControlItemChange.emit()}render(){const{appearance:e,checked:t,layout:o,scale:l,value:s}=this;const r=this.iconStart?i("calcite-icon",{class:A.segmentedControlItemIcon,flipRtl:this.iconFlipRtl,icon:this.iconStart,key:"icon-start",scale:"s"}):null;const c=this.iconEnd?i("calcite-icon",{class:A.segmentedControlItemIcon,flipRtl:this.iconFlipRtl,icon:this.iconEnd,key:"icon-end",scale:"s"}):null;return i(n,{"aria-checked":a(t),"aria-label":s,role:"radio"},i("label",{class:{"label--scale-s":l==="s","label--scale-m":l==="m","label--scale-l":l==="l","label--horizontal":o==="horizontal","label--outline":e==="outline","label--outline-fill":e==="outline-fill"}},this.iconStart?r:null,i("slot",null,s),i("slot",{name:j.input}),this.iconEnd?c:null))}get el(){return o(this)}static get watchers(){return{checked:["handleCheckedChange"]}}};L.style=I;export{C as calcite_segmented_control,L as calcite_segmented_control_item};
+//# sourceMappingURL=p-9926ee56.entry.js.map

package/dist/calcite/p-9926ee56.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CSS","itemWrapper","segmentedControlCss","SegmentedControl","this","handleClick","event","disabled","target","localName","selectItem","mutationObserver","createObserver","setUpItems","handlePropsChange","handleItemPropChange","valueHandler","value","items","getItems","forEach","item","checked","handleSelectedItemChange","newItem","oldItem","match","filter","pop","tabIndex","componentWillLoad","setUpLoadableComponent","componentDidLoad","afterConnectDefaultValueSet","setComponentLoaded","connectedCallback","connectInteractive","connectLabel","connectForm","observe","el","childList","disconnectedCallback","disconnectInteractive","disconnectLabel","disconnectForm","unobserve","componentDidRender","updateHostInteraction","render","h","Host","onClick","role","class","InteractiveContainer","HiddenFormInputSlot","component","validationMessage","Validation","icon","validationIcon","message","scale","status","handleSelected","preventDefault","stopPropagation","handleKeyDown","keys","key","selectedItem","indexOf","adjustedKey","getElementDir","selectedIndex","index","previous","length","next","setFocus","componentFocusable","focus","appearance","layout","onLabelClick","Array","from","querySelectorAll","selected","emit","matches","calciteSegmentedControlChange","lastChecked","SLOTS","input","segmentedControlItemIcon","segmentedControlItemCss","SegmentedControlItem","handleCheckedChange","calciteInternalSegmentedControlItemChange","iconStartEl","iconStart","flipRtl","iconFlipRtl","iconEndEl","iconEnd","toAriaBoolean","name"],"sources":["src/components/segmented-control/resources.ts","src/components/segmented-control/segmented-control.scss?tag=calcite-segmented-control&encapsulation=shadow","src/components/segmented-control/segmented-control.tsx","src/components/segmented-control-item/resources.ts","src/components/segmented-control-item/segmented-control-item.scss?tag=calcite-segmented-control-item&encapsulation=shadow","src/components/segmented-control-item/segmented-control-item.tsx"],"sourcesContent":["export const CSS = {\n  itemWrapper: \"item-wrapper\",\n};\n",":host {\n  @apply flex flex-col;\n}\n\n.item-wrapper {\n  @apply bg-foreground-1 flex;\n  inline-size: fit-content;\n  outline: 1px solid var(--calcite-color-border-input);\n  outline-offset: -1px;\n}\n\n:host([appearance=\"outline\"]) > .item-wrapper {\n  @apply bg-transparent;\n}\n\n@include disabled();\n\n:host([layout=\"vertical\"]) > .item-wrapper {\n  @apply flex-col items-start self-start;\n}\n\n// segmented control width for full\n:host([width=\"full\"]) > .item-wrapper {\n  @apply w-full;\n  min-inline-size: fit-content;\n\n  ::slotted(calcite-segmented-control-item) {\n    @apply flex-auto;\n  }\n}\n\n:host([width=\"full\"][layout=\"vertical\"]) > .item-wrapper {\n  ::slotted(calcite-segmented-control-item) {\n    @apply justify-start;\n  }\n}\n\n@include form-validation-message();\n@include hidden-form-input();\n@include base-component();\n","import {\n  Build,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\n\nimport { getElementDir } from \"../../utils/dom\";\nimport {\n  afterConnectDefaultValueSet,\n  connectForm,\n  disconnectForm,\n  FormComponent,\n  HiddenFormInputSlot,\n} from \"../../utils/form\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport { connectLabel, disconnectLabel, LabelableComponent } from \"../../utils/label\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { Appearance, Layout, Scale, Status, Width } from \"../interfaces\";\nimport { createObserver } from \"../../utils/observers\";\nimport { Validation } from \"../functional/Validation\";\nimport { CSS } from \"./resources\";\n\n/**\n * @slot - A slot for adding `calcite-segmented-control-item`s.\n */\n@Component({\n  tag: \"calcite-segmented-control\",\n  styleUrl: \"segmented-control.scss\",\n  shadow: true,\n})\nexport class SegmentedControl\n  implements LabelableComponent, FormComponent, InteractiveComponent, LoadableComponent\n{\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    \"solid\";\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\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`, the component must have a value in order for the form to submit. */\n  @Prop({ reflect: true }) required = false;\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  /** Defines the layout of the component. */\n  @Prop({ reflect: true }) layout: Extract<\"horizontal\" | \"vertical\", Layout> = \"horizontal\";\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  @Watch(\"appearance\")\n  @Watch(\"layout\")\n  @Watch(\"scale\")\n  handlePropsChange(): void {\n    this.handleItemPropChange();\n  }\n\n  /** The component's `selectedItem` value. */\n  @Prop({ mutable: true }) value: string = null;\n\n  @Watch(\"value\")\n  valueHandler(value: string): void {\n    const items = this.getItems();\n    items.forEach((item) => (item.checked = item.value === value));\n  }\n\n  /**\n   * The component's selected item `HTMLElement`.\n   *\n   * @readonly\n   */\n  @Prop({ mutable: true }) selectedItem: HTMLCalciteSegmentedControlItemElement;\n\n  @Watch(\"selectedItem\")\n  protected handleSelectedItemChange<T extends HTMLCalciteSegmentedControlItemElement>(\n    newItem: T,\n    oldItem: T,\n  ): void {\n    this.value = newItem?.value;\n    if (newItem === oldItem) {\n      return;\n    }\n    const items = this.getItems();\n    const match = items.filter((item) => item === newItem).pop();\n\n    if (match) {\n      this.selectItem(match);\n    } else if (items[0]) {\n      items[0].tabIndex = 0;\n    }\n  }\n\n  /** Specifies the status of the validation message. */\n  @Prop({ reflect: true }) status: Status = \"idle\";\n\n  /** Specifies the validation message to display under the component. */\n  @Prop() validationMessage: string;\n\n  /** Specifies the validation icon to display under the component. */\n  @Prop({ reflect: true }) validationIcon: string | boolean;\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) width: Extract<\"auto\" | \"full\", Width> = \"auto\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n    this.setUpItems();\n  }\n\n  componentDidLoad(): void {\n    afterConnectDefaultValueSet(this, this.value);\n    setComponentLoaded(this);\n  }\n\n  connectedCallback(): void {\n    connectInteractive(this);\n    connectLabel(this);\n    connectForm(this);\n    this.mutationObserver?.observe(this.el, { childList: true });\n\n    this.handleItemPropChange();\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n    disconnectLabel(this);\n    disconnectForm(this);\n    this.mutationObserver?.unobserve(this.el);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  render(): VNode {\n    return (\n      <Host onClick={this.handleClick} role=\"radiogroup\">\n        <div class={CSS.itemWrapper}>\n          <InteractiveContainer disabled={this.disabled}>\n            <slot />\n            <HiddenFormInputSlot component={this} />\n          </InteractiveContainer>\n        </div>\n        {this.validationMessage ? (\n          <Validation\n            icon={this.validationIcon}\n            message={this.validationMessage}\n            scale={this.scale}\n            status={this.status}\n          />\n        ) : null}\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  protected handleClick = (event: MouseEvent): void => {\n    if (this.disabled) {\n      return;\n    }\n\n    if ((event.target as HTMLElement).localName === \"calcite-segmented-control-item\") {\n      this.selectItem(event.target as HTMLCalciteSegmentedControlItemElement, true);\n    }\n  };\n\n  @Listen(\"calciteInternalSegmentedControlItemChange\")\n  protected handleSelected(event: Event): void {\n    event.preventDefault();\n    this.selectItem(event.target as HTMLCalciteSegmentedControlItemElement);\n    event.stopPropagation();\n  }\n\n  @Listen(\"keydown\")\n  protected handleKeyDown(event: KeyboardEvent): void {\n    const keys = [\"ArrowLeft\", \"ArrowUp\", \"ArrowRight\", \"ArrowDown\", \" \"];\n    const { key } = event;\n    const { el, selectedItem } = this;\n\n    if (keys.indexOf(key) === -1) {\n      return;\n    }\n\n    let adjustedKey = key;\n\n    if (getElementDir(el) === \"rtl\") {\n      if (key === \"ArrowRight\") {\n        adjustedKey = \"ArrowLeft\";\n      }\n      if (key === \"ArrowLeft\") {\n        adjustedKey = \"ArrowRight\";\n      }\n    }\n\n    const items = this.getItems();\n    let selectedIndex = -1;\n\n    items.forEach((item, index) => {\n      if (item === selectedItem) {\n        selectedIndex = index;\n      }\n    });\n\n    switch (adjustedKey) {\n      case \"ArrowLeft\":\n      case \"ArrowUp\":\n        event.preventDefault();\n        const previous = selectedIndex < 1 ? items[items.length - 1] : items[selectedIndex - 1];\n        this.selectItem(previous, true);\n        return;\n      case \"ArrowRight\":\n      case \"ArrowDown\":\n        event.preventDefault();\n        const next = selectedIndex === -1 ? items[1] : items[selectedIndex + 1] || items[0];\n        this.selectItem(next, true);\n        return;\n      case \" \":\n        event.preventDefault();\n        this.selectItem(event.target as HTMLCalciteSegmentedControlItemElement, true);\n        return;\n      default:\n        return;\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the `calcite-segmented-control-item` selection changes. */\n  @Event({ cancelable: false }) calciteSegmentedControlChange: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    (this.selectedItem || this.getItems()[0])?.focus();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteSegmentedControlElement;\n\n  labelEl: HTMLCalciteLabelElement;\n\n  formEl: HTMLFormElement;\n\n  defaultValue: SegmentedControl[\"value\"];\n\n  private mutationObserver = createObserver(\"mutation\", () => this.setUpItems());\n\n  private handleItemPropChange(): void {\n    const items = this.getItems();\n\n    items.forEach((item) => {\n      item.appearance = this.appearance;\n      item.layout = this.layout;\n      item.scale = this.scale;\n    });\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  onLabelClick(): void {\n    this.setFocus();\n  }\n\n  private getItems(): HTMLCalciteSegmentedControlItemElement[] {\n    return Array.from(this.el.querySelectorAll(\"calcite-segmented-control-item\"));\n  }\n\n  private selectItem(selected: HTMLCalciteSegmentedControlItemElement, emit = false): void {\n    if (selected === this.selectedItem) {\n      return;\n    }\n\n    const items = this.getItems();\n    let match: HTMLCalciteSegmentedControlItemElement = null;\n\n    items.forEach((item) => {\n      const matches = item === selected;\n\n      if ((matches && !item.checked) || (!matches && item.checked)) {\n        item.checked = matches;\n      }\n\n      item.tabIndex = matches ? 0 : -1;\n\n      if (matches) {\n        match = item;\n\n        if (emit) {\n          this.calciteSegmentedControlChange.emit();\n        }\n      }\n    });\n\n    this.selectedItem = match;\n    if (Build.isBrowser && match) {\n      match.focus();\n    }\n  }\n\n  private setUpItems(): void {\n    const items = this.getItems();\n    const lastChecked = items.filter((item) => item.checked).pop();\n\n    if (lastChecked) {\n      this.selectItem(lastChecked);\n    } else if (items[0]) {\n      items[0].tabIndex = 0;\n    }\n  }\n}\n","export const SLOTS = {\n  input: \"input\",\n};\n\nexport const CSS = {\n  segmentedControlItemIcon: \"segmented-control-item-icon\",\n};\n",":host {\n  @apply flex\n    cursor-pointer\n    self-stretch\n    font-normal;\n  transition:\n    background-color var(--calcite-internal-animation-timing-fast) ease-in-out,\n    border-color var(--calcite-animation-timing) ease-in-out;\n}\n\n:host label {\n  @apply text-color-3\n    pointer-events-none\n    m-0.5\n    box-border\n    flex\n    flex-1\n    items-center;\n  transition:\n    background-color var(--calcite-internal-animation-timing-fast) ease-in-out,\n    border-color var(--calcite-internal-animation-timing-fast) ease-in-out,\n    color var(--calcite-internal-animation-timing-fast) ease-in-out;\n}\n\n.label--horizontal {\n  @apply justify-center;\n}\n\n// focus styles\n:host {\n  @apply focus-base;\n}\n:host(:focus) {\n  @apply focus-inset;\n  outline-offset: -1px;\n}\n\n.label--scale-s {\n  @apply text-n2h px-2;\n  padding-block: 0.125rem;\n}\n\n.label--scale-m {\n  @apply text-n1h px-3;\n  padding-block: 0.375rem;\n}\n\n.label--scale-l {\n  @apply text-0h px-4 py-2.5;\n}\n\n:host(:hover) label {\n  @apply bg-foreground-2 text-color-1;\n}\n\n:host(:active) label {\n  @apply bg-foreground-3;\n}\n\n:host([checked]) label {\n  @apply bg-brand border-color-brand cursor-default text-color-inverse;\n}\n\n:host([checked]) .label--outline,\n:host([checked]) .label--outline-fill {\n  @apply bg-foreground-1 border-color-brand;\n  box-shadow: inset 0 0 0 1px theme(\"backgroundColor.brand\");\n  color: theme(\"backgroundColor.brand\");\n}\n\n:host([checked]) .label--outline {\n  @apply bg-transparent;\n}\n\n::slotted(input) {\n  @apply hidden;\n}\n\n@media (forced-colors: active) {\n  :host([checked]) label {\n    background-color: highlight;\n  }\n  :host([checked]) .label--outline,\n  :host([checked]) .label--outline-fill {\n    @apply outline-none;\n  }\n  :host([checked]) label:not([class~=\"label--outline\"]) .segmented-control-item-icon {\n    color: highlightText;\n  }\n}\n\n// icon\n.segmented-control-item-icon {\n  @apply relative\n    m-0\n    inline-flex;\n  line-height: inherit;\n}\n\n:host([icon-start]) .label--scale-s .segmented-control-item-icon {\n  margin-inline-end: theme(\"margin.2\");\n}\n\n:host([icon-end]) .label--scale-s .segmented-control-item-icon {\n  margin-inline-start: theme(\"margin.2\");\n}\n\n:host([icon-start]) .label--scale-m .segmented-control-item-icon {\n  margin-inline-end: theme(\"margin.3\");\n}\n\n:host([icon-end]) .label--scale-m .segmented-control-item-icon {\n  margin-inline-start: theme(\"margin.3\");\n}\n\n:host([icon-start]) .label--scale-l .segmented-control-item-icon {\n  margin-inline-end: theme(\"margin.4\");\n}\n:host([icon-end]) .label--scale-l .segmented-control-item-icon {\n  margin-inline-start: theme(\"margin.4\");\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Prop,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { toAriaBoolean } from \"../../utils/dom\";\nimport { Appearance, Layout, Scale } from \"../interfaces\";\nimport { CSS, SLOTS } from \"./resources\";\n\n@Component({\n  tag: \"calcite-segmented-control-item\",\n  styleUrl: \"segmented-control-item.scss\",\n  shadow: true,\n})\nexport class SegmentedControlItem {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, the component is checked. */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by form module\n  @Prop({ reflect: true, mutable: true }) checked = false;\n\n  @Watch(\"checked\")\n  protected handleCheckedChange(): void {\n    this.calciteInternalSegmentedControlItemChange.emit();\n  }\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /** Specifies an icon to display at the start of the component. */\n  @Prop({ reflect: true }) iconStart: string;\n\n  /** Specifies an icon to display at the end of the component. */\n  @Prop({ reflect: true }) iconEnd: string;\n\n  /**\n   * The component's value.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by form module\n  @Prop({ mutable: true })\n  value: any | null;\n\n  /**\n   * Specifies the appearance style of the component inherited from parent `calcite-segmented-control`, defaults to `solid`.\n   *\n   * @internal\n   */\n  @Prop() appearance: Extract<\"outline\" | \"outline-fill\" | \"solid\", Appearance> = \"solid\";\n\n  /**\n   * Defines the layout of the component inherited from parent `calcite-segmented-control`, defaults to `horizontal`.\n   *\n   * @internal\n   */\n  @Prop() layout: Layout = \"horizontal\";\n\n  /**\n   * Specifies the size of the component inherited from the `calcite-segmented-control`, defaults to `m`.\n   *\n   * @internal\n   */\n  @Prop() scale: Scale = \"m\";\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  render(): VNode {\n    const { appearance, checked, layout, scale, value } = this;\n\n    const iconStartEl = this.iconStart ? (\n      <calcite-icon\n        class={CSS.segmentedControlItemIcon}\n        flipRtl={this.iconFlipRtl}\n        icon={this.iconStart}\n        key=\"icon-start\"\n        scale=\"s\"\n      />\n    ) : null;\n\n    const iconEndEl = this.iconEnd ? (\n      <calcite-icon\n        class={CSS.segmentedControlItemIcon}\n        flipRtl={this.iconFlipRtl}\n        icon={this.iconEnd}\n        key=\"icon-end\"\n        scale=\"s\"\n      />\n    ) : null;\n\n    return (\n      <Host aria-checked={toAriaBoolean(checked)} aria-label={value} role=\"radio\">\n        <label\n          class={{\n            \"label--scale-s\": scale === \"s\",\n            \"label--scale-m\": scale === \"m\",\n            \"label--scale-l\": scale === \"l\",\n            \"label--horizontal\": layout === \"horizontal\",\n            \"label--outline\": appearance === \"outline\",\n            \"label--outline-fill\": appearance === \"outline-fill\",\n          }}\n        >\n          {this.iconStart ? iconStartEl : null}\n          <slot>{value}</slot>\n          <slot name={SLOTS.input} />\n          {this.iconEnd ? iconEndEl : null}\n        </label>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteSegmentedControlItemElement;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Fires when the item has been selected.\n   *\n   * @internal\n   */\n  @Event({ cancelable: false })\n  calciteInternalSegmentedControlItemChange: EventEmitter<void>;\n}\n"],"mappings":"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"}

package/dist/calcite/p-992cd7cf.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{d as r}from"./p-c5f2d6dd.js";import"./p-aa4a7aa0.js";import"./p-237e7376.js";import"./p-2a0f60c9.js";import"./p-2b05e96c.js";import"./p-b4352ddb.js";import"./p-45af6cec.js";import"./p-0b4fc200.js";import"./p-5bdc1461.js";import"./p-f501737a.js";import"./p-f4650a58.js";import"./p-705f04ba.js";import"./p-9e925631.js";import"./p-8d22af5c.js";import"./p-5713e697.js";import"./p-da0a8316.js";import"./p-3c675720.js";import"./p-2a7b59b3.js";import"./p-8a08539c.js";var a={name:"sv",weekdays:"söndag_måndag_tisdag_onsdag_torsdag_fredag_lördag".split("_"),weekdaysShort:"sön_mån_tis_ons_tor_fre_lör".split("_"),weekdaysMin:"sö_må_ti_on_to_fr_lö".split("_"),months:"januari_februari_mars_april_maj_juni_juli_augusti_september_oktober_november_december".split("_"),monthsShort:"jan_feb_mar_apr_maj_jun_jul_aug_sep_okt_nov_dec".split("_"),weekStart:1,yearStart:4,ordinal:function r(a){var m=a%10;var t=m===1||m===2?"a":"e";return"["+a+t+"]"},formats:{LT:"HH:mm",LTS:"HH:mm:ss",L:"YYYY-MM-DD",LL:"D MMMM YYYY",LLL:"D MMMM YYYY [kl.] HH:mm",LLLL:"dddd D MMMM YYYY [kl.] HH:mm",lll:"D MMM YYYY HH:mm",llll:"ddd D MMM YYYY HH:mm"},relativeTime:{future:"om %s",past:"för %s sedan",s:"några sekunder",m:"en minut",mm:"%d minuter",h:"en timme",hh:"%d timmar",d:"en dag",dd:"%d dagar",M:"en månad",MM:"%d månader",y:"ett år",yy:"%d år"}};r.locale(a,null,true);export default a;
+//# sourceMappingURL=p-992cd7cf.js.map

package/dist/calcite/p-99d9f179.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{d as _}from"./p-c5f2d6dd.js";import"./p-aa4a7aa0.js";import"./p-237e7376.js";import"./p-2a0f60c9.js";import"./p-2b05e96c.js";import"./p-b4352ddb.js";import"./p-45af6cec.js";import"./p-0b4fc200.js";import"./p-5bdc1461.js";import"./p-f501737a.js";import"./p-f4650a58.js";import"./p-705f04ba.js";import"./p-9e925631.js";import"./p-8d22af5c.js";import"./p-5713e697.js";import"./p-da0a8316.js";import"./p-3c675720.js";import"./p-2a7b59b3.js";import"./p-8a08539c.js";var r="січня_лютого_березня_квітня_травня_червня_липня_серпня_вересня_жовтня_листопада_грудня".split("_");var t="січень_лютий_березень_квітень_травень_червень_липень_серпень_вересень_жовтень_листопад_грудень".split("_");var p=/D[oD]?(\[[^[\]]*\]|\s)+MMMM?/;function m(_,r){var t=_.split("_");return r%10===1&&r%100!==11?t[0]:r%10>=2&&r%10<=4&&(r%100<10||r%100>=20)?t[1]:t[2]}function s(_,r,t){var p={ss:r?"секунда_секунди_секунд":"секунду_секунди_секунд",mm:r?"хвилина_хвилини_хвилин":"хвилину_хвилини_хвилин",hh:r?"година_години_годин":"годину_години_годин",dd:"день_дні_днів",MM:"місяць_місяці_місяців",yy:"рік_роки_років"};if(t==="m"){return r?"хвилина":"хвилину"}else if(t==="h"){return r?"година":"годину"}return _+" "+m(p[t],+_)}var a=function _(m,s){if(p.test(s)){return r[m.month()]}return t[m.month()]};a.s=t;a.f=r;var o={name:"uk",weekdays:"неділя_понеділок_вівторок_середа_четвер_п’ятниця_субота".split("_"),weekdaysShort:"ндл_пнд_втр_срд_чтв_птн_сбт".split("_"),weekdaysMin:"нд_пн_вт_ср_чт_пт_сб".split("_"),months:a,monthsShort:"січ_лют_бер_квіт_трав_черв_лип_серп_вер_жовт_лист_груд".split("_"),weekStart:1,relativeTime:{future:"за %s",past:"%s тому",s:"декілька секунд",m:s,mm:s,h:s,hh:s,d:"день",dd:s,M:"місяць",MM:s,y:"рік",yy:s},ordinal:function _(r){return r},formats:{LT:"HH:mm",LTS:"HH:mm:ss",L:"DD.MM.YYYY",LL:"D MMMM YYYY р.",LLL:"D MMMM YYYY р., HH:mm",LLLL:"dddd, D MMMM YYYY р., HH:mm"}};_.locale(o,null,true);export default o;
+//# sourceMappingURL=p-99d9f179.js.map

package/dist/calcite/p-9ac37ea4.entry.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{r as i,h as t,H as n,g as e}from"./p-aa4a7aa0.js";import{g as s,d as o}from"./p-2a0f60c9.js";import{c as a,u as c,d as l,I as r}from"./p-45af6cec.js";import{s as d,a as h,c as p}from"./p-705f04ba.js";import{C as u}from"./p-b4352ddb.js";import"./p-2b05e96c.js";import"./p-0b4fc200.js";const f=":host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline}:host a,:host span{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:0px;border-style:none;font-family:inherit;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;text-decoration:none;line-height:inherit;font-size:inherit;-webkit-appearance:none}:host a:hover,:host span:hover{text-decoration:none}:host a,:host span{outline-color:transparent}:host a:focus,:host span:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}calcite-icon{inline-size:1em;block-size:1em;min-inline-size:unset;min-block-size:unset}.calcite-link--icon{vertical-align:middle;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;margin-block-start:-0.25em}:host .calcite-link--icon.icon-start{margin-inline-end:0.5rem}:host .calcite-link--icon.icon-end{margin-inline-start:0.5rem}:host span,:host a{position:relative;display:inline;border-style:none;background-color:transparent;padding:0px;color:var(--calcite-color-text-link);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;line-height:inherit;white-space:initial;background-image:linear-gradient(currentColor, currentColor), linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));background-position-x:0%, 100%;background-position-y:min(1.5em, 100%);background-repeat:no-repeat, no-repeat;background-size:0% 1px, 100% 1px}:host span:hover,:host span:focus,:host a:hover,:host a:focus{background-size:100% 1px, 100% 1px}:host span:active,:host a:active{background-size:100% 2px, 100% 2px}:host span.calcite--rtl,:host a.calcite--rtl{background-position:100% 100%, 100% 100%}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}";const b=class{constructor(t){i(this,t);this.childElClickHandler=i=>{if(!i.isTrusted){i.stopPropagation()}};this.storeTagRef=i=>{this.childEl=i};this.disabled=false;this.download=false;this.href=undefined;this.iconEnd=undefined;this.iconFlipRtl=undefined;this.iconStart=undefined;this.rel=undefined;this.target=undefined}connectedCallback(){a(this)}componentWillLoad(){d(this)}componentDidLoad(){h(this)}componentDidRender(){c(this)}disconnectedCallback(){l(this)}render(){const{download:i,el:e}=this;const o=s(e);const a=this.href?"a":"span";const c=t("calcite-icon",{class:"calcite-link--icon icon-start",flipRtl:this.iconFlipRtl==="start"||this.iconFlipRtl==="both",icon:this.iconStart,scale:"s"});const l=t("calcite-icon",{class:"calcite-link--icon icon-end",flipRtl:this.iconFlipRtl==="end"||this.iconFlipRtl==="both",icon:this.iconEnd,scale:"s"});const d=a;const h=a==="span"?"link":null;const p=a==="span"?0:null;return t(n,{role:"presentation"},t(r,{disabled:this.disabled},t(d,{class:{[u.rtl]:o==="rtl"},download:d==="a"&&(i===""||i)?i:null,href:d==="a"&&this.href,onClick:this.childElClickHandler,rel:d==="a"&&this.rel,role:h,tabIndex:p,target:d==="a"&&this.target,ref:this.storeTagRef},this.iconStart?c:null,t("slot",null),this.iconEnd?l:null)))}clickHandler(i){if(this.disabled){return}if(!i.isTrusted){this.childEl.click()}}async setFocus(){await p(this);o(this.childEl)}get el(){return e(this)}};b.style=f;export{b as calcite_link};
+//# sourceMappingURL=p-9ac37ea4.entry.js.map

package/dist/calcite/p-9ac37ea4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["linkCss","Link","this","childElClickHandler","event","isTrusted","stopPropagation","storeTagRef","el","childEl","connectedCallback","connectInteractive","componentWillLoad","setUpLoadableComponent","componentDidLoad","setComponentLoaded","componentDidRender","updateHostInteraction","disconnectedCallback","disconnectInteractive","render","download","dir","getElementDir","childElType","href","iconStartEl","h","class","flipRtl","iconFlipRtl","icon","iconStart","scale","iconEndEl","iconEnd","Tag","role","tabIndex","Host","InteractiveContainer","disabled","CSS_UTILITY","rtl","onClick","rel","target","ref","clickHandler","click","setFocus","componentFocusable","focusElement"],"sources":["src/components/link/link.scss?tag=calcite-link&encapsulation=shadow","src/components/link/link.tsx"],"sourcesContent":[":host {\n  display: inline;\n}\n\n// link base\n:host a,\n:host span {\n  @apply font-inherit\n    transition-default\n    relative\n    flex\n    cursor-pointer\n    items-center\n    justify-center\n    rounded-none\n    border-none;\n  text-decoration: none;\n  line-height: inherit;\n  font-size: inherit;\n  -webkit-appearance: none;\n  &:hover {\n    text-decoration: none;\n  }\n}\n\n// focus styles\n:host a,\n:host span {\n  @apply focus-base;\n  &:focus {\n    @apply focus-outset;\n  }\n}\n\ncalcite-icon {\n  inline-size: 1em;\n  block-size: 1em;\n  min-inline-size: unset;\n  min-block-size: unset;\n}\n\n.calcite-link--icon {\n  @apply transition-default align-middle;\n  margin-block-start: -0.25em;\n}\n\n// icon positioning and styles\n:host .calcite-link--icon.icon-start {\n  margin-inline-end: theme(\"margin.2\");\n}\n\n:host .calcite-link--icon.icon-end {\n  margin-inline-start: theme(\"margin.2\");\n}\n\n:host {\n  span,\n  a {\n    @apply text-color-link\n      transition-default\n      relative\n      inline\n      border-none\n      bg-transparent\n      p-0;\n    line-height: inherit;\n    white-space: initial;\n    background-image: linear-gradient(currentColor, currentColor),\n      linear-gradient(var(--calcite-color-brand-underline), var(--calcite-color-brand-underline));\n    background-position-x: 0%, 100%;\n    background-position-y: min(1.5em, 100%);\n    background-repeat: no-repeat, no-repeat;\n    background-size:\n      0% 1px,\n      100% 1px;\n\n    &:hover,\n    &:focus {\n      background-size:\n        100% 1px,\n        100% 1px;\n    }\n    &:active {\n      background-size:\n        100% 2px,\n        100% 2px;\n    }\n    &.calcite--rtl {\n      background-position:\n        100% 100%,\n        100% 100%;\n    }\n  }\n}\n\n@include disabled();\n@include base-component();\n","import { Component, Element, h, Host, Listen, Method, Prop, VNode } from \"@stencil/core\";\nimport { focusElement, getElementDir } from \"../../utils/dom\";\nimport {\n  connectInteractive,\n  disconnectInteractive,\n  InteractiveComponent,\n  InteractiveContainer,\n  updateHostInteraction,\n} from \"../../utils/interactive\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { CSS_UTILITY } from \"../../utils/resources\";\nimport { FlipContext } from \"../interfaces\";\n\n/** Any attributes placed on <calcite-link> component will propagate to the rendered child */\n/** Passing a 'href' will render an anchor link, instead of a span. Role will be set to link, or link, depending on this. */\n/** It is the consumers responsibility to add aria information, rel, target, for links, and any link attributes for form submission */\n\n/** @slot - A slot for adding text. */\n@Component({\n  tag: \"calcite-link\",\n  styleUrl: \"link.scss\",\n  shadow: true,\n})\nexport class Link implements InteractiveComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /** When `true`, interaction is prevented and the component is displayed with lower opacity. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Prompts the user to save the linked URL instead of navigating to it. Can be used with or without a value:\n   * Without a value, the browser will suggest a filename/extension\n   * See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-download.\n   */\n  @Prop({ reflect: true }) download: string | boolean = false;\n\n  /** Specifies the URL of the linked resource, which can be set as an absolute or relative path. */\n  @Prop({ reflect: true }) href: string;\n\n  /** Specifies an icon to display at the end of the component. */\n  @Prop({ reflect: true }) iconEnd: string;\n\n  /** Displays the `iconStart` and/or `iconEnd` as flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl: FlipContext;\n\n  /** Specifies an icon to display at the start of the component. */\n  @Prop({ reflect: true }) iconStart: string;\n\n  /** Specifies the relationship to the linked document defined in `href`. */\n  @Prop() rel: string;\n\n  /** Specifies the frame or window to open the linked document. */\n  @Prop() target: string;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectInteractive(this);\n  }\n\n  componentWillLoad(): void {\n    setUpLoadableComponent(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  componentDidRender(): void {\n    updateHostInteraction(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectInteractive(this);\n  }\n\n  render(): VNode {\n    const { download, el } = this;\n    const dir = getElementDir(el);\n    const childElType = this.href ? \"a\" : \"span\";\n    const iconStartEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-start\"\n        flipRtl={this.iconFlipRtl === \"start\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconStart}\n        scale=\"s\"\n      />\n    );\n\n    const iconEndEl = (\n      <calcite-icon\n        class=\"calcite-link--icon icon-end\"\n        flipRtl={this.iconFlipRtl === \"end\" || this.iconFlipRtl === \"both\"}\n        icon={this.iconEnd}\n        scale=\"s\"\n      />\n    );\n\n    const Tag = childElType;\n    const role = childElType === \"span\" ? \"link\" : null;\n    const tabIndex = childElType === \"span\" ? 0 : null;\n\n    return (\n      <Host role=\"presentation\">\n        <InteractiveContainer disabled={this.disabled}>\n          <Tag\n            class={{ [CSS_UTILITY.rtl]: dir === \"rtl\" }}\n            /*\n          When the 'download' property of type 'boolean | string' is set to true, the value is \"\".\n          This works around that issue for now.\n          */\n            download={Tag === \"a\" && (download === \"\" || download) ? download : null}\n            href={Tag === \"a\" && this.href}\n            onClick={this.childElClickHandler}\n            rel={Tag === \"a\" && this.rel}\n            role={role}\n            tabIndex={tabIndex}\n            target={Tag === \"a\" && this.target}\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.storeTagRef}\n          >\n            {this.iconStart ? iconStartEl : null}\n            <slot />\n            {this.iconEnd ? iconEndEl : null}\n          </Tag>\n        </InteractiveContainer>\n      </Host>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"click\")\n  clickHandler(event: PointerEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    // forwards the click() to the internal link for non user-initiated events\n    if (!event.isTrusted) {\n      this.childEl.click();\n    }\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    focusElement(this.childEl);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteLinkElement;\n\n  /** the rendered child element */\n  private childEl: HTMLAnchorElement | HTMLSpanElement;\n\n  private childElClickHandler = (event: PointerEvent): void => {\n    if (!event.isTrusted) {\n      // click was invoked internally, we stop it here\n      event.stopPropagation();\n    }\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private storeTagRef = (el: Link[\"childEl\"]): void => {\n    this.childEl = el;\n  };\n}\n"],"mappings":";;;;;mSAAA,MAAMA,EAAU,o4E,MC4BHC,EAAI,M,yBA8JPC,KAAAC,oBAAuBC,IAC7B,IAAKA,EAAMC,UAAW,CAEpBD,EAAME,iB,GAUFJ,KAAAK,YAAeC,IACrBN,KAAKO,QAAUD,CAAE,E,cApKiB,M,cAOkB,M,wIA0BtD,iBAAAE,GACEC,EAAmBT,K,CAGrB,iBAAAU,GACEC,EAAuBX,K,CAGzB,gBAAAY,GACEC,EAAmBb,K,CAGrB,kBAAAc,GACEC,EAAsBf,K,CAGxB,oBAAAgB,GACEC,EAAsBjB,K,CAGxB,MAAAkB,GACE,MAAMC,SAAEA,EAAQb,GAAEA,GAAON,KACzB,MAAMoB,EAAMC,EAAcf,GAC1B,MAAMgB,EAActB,KAAKuB,KAAO,IAAM,OACtC,MAAMC,EACJC,EAAA,gBACEC,MAAM,gCACNC,QAAS3B,KAAK4B,cAAgB,SAAW5B,KAAK4B,cAAgB,OAC9DC,KAAM7B,KAAK8B,UACXC,MAAM,MAIV,MAAMC,EACJP,EAAA,gBACEC,MAAM,8BACNC,QAAS3B,KAAK4B,cAAgB,OAAS5B,KAAK4B,cAAgB,OAC5DC,KAAM7B,KAAKiC,QACXF,MAAM,MAIV,MAAMG,EAAMZ,EACZ,MAAMa,EAAOb,IAAgB,OAAS,OAAS,KAC/C,MAAMc,EAAWd,IAAgB,OAAS,EAAI,KAE9C,OACEG,EAACY,EAAI,CAACF,KAAK,gBACTV,EAACa,EAAoB,CAACC,SAAUvC,KAAKuC,UACnCd,EAACS,EAAG,CACFR,MAAO,CAAE,CAACc,EAAYC,KAAMrB,IAAQ,OAKpCD,SAAUe,IAAQ,MAAQf,IAAa,IAAMA,GAAYA,EAAW,KACpEI,KAAMW,IAAQ,KAAOlC,KAAKuB,KAC1BmB,QAAS1C,KAAKC,oBACd0C,IAAKT,IAAQ,KAAOlC,KAAK2C,IACzBR,KAAMA,EACNC,SAAUA,EACVQ,OAAQV,IAAQ,KAAOlC,KAAK4C,OAE5BC,IAAK7C,KAAKK,aAETL,KAAK8B,UAAYN,EAAc,KAChCC,EAAA,aACCzB,KAAKiC,QAAUD,EAAY,O,CActC,YAAAc,CAAa5C,GACX,GAAIF,KAAKuC,SAAU,CACjB,M,CAIF,IAAKrC,EAAMC,UAAW,CACpBH,KAAKO,QAAQwC,O,EAYjB,cAAMC,SACEC,EAAmBjD,MAEzBkD,EAAalD,KAAKO,Q"}

package/dist/calcite/p-9af44e5e.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+const t={container:"container",actionsStart:"actions-start",contentStart:"content-start",content:"content",contentEnd:"content-end",actionsEnd:"actions-end"};const n={actionsStart:"actions-start",contentStart:"content-start",contentEnd:"content-end",actionsEnd:"actions-end"};export{t as C,n as S};
+//# sourceMappingURL=p-9af44e5e.js.map

package/dist/calcite/p-9b95254f.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{h as t}from"./p-aa4a7aa0.js";const o={arrow:"calcite-floating-ui-arrow",arrowStroke:"calcite-floating-ui-arrow__stroke"};const r={width:12,height:6,strokeWidth:1};const a=({floatingLayout:a,key:e,ref:i})=>{const{width:s,height:n,strokeWidth:h}=r;const c=s/2;const d=a==="vertical";const l="M0,0"+` H${s}`+` L${s-c},${n}`+` Q${c},${n} ${c},${n}`+" Z";return t("svg",{"aria-hidden":"true",class:o.arrow,height:s,key:e,viewBox:`0 0 ${s} ${s+(!d?h:0)}`,width:s+(d?h:0),ref:i},h>0&&t("path",{class:o.arrowStroke,d:l,fill:"none","stroke-width":h+1}),t("path",{d:l,stroke:"none"}))};export{a as F};
+//# sourceMappingURL=p-9b95254f.js.map

package/dist/calcite/p-9e925631.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{c as t,a as n}from"./p-2a0f60c9.js";import{n as e}from"./p-5bdc1461.js";import{c as s}from"./p-8d22af5c.js";const r=new RegExp(`\\${"."}(0+)?$`);const i=new RegExp("0+$");class o{constructor(t){if(t instanceof o){return t}const[n,e]=d(t).split(".").concat("");this.value=BigInt(n+e.padEnd(o.DECIMALS,"0").slice(0,o.DECIMALS))+BigInt(o.ROUNDED&&e[o.DECIMALS]>="5");this.isNegative=t.charAt(0)==="-"}getIntegersAndDecimals(){const t=this.value.toString().replace("-","").padStart(o.DECIMALS+1,"0");const n=t.slice(0,-o.DECIMALS);const e=t.slice(-o.DECIMALS).replace(i,"");return{integers:n,decimals:e}}toString(){const{integers:t,decimals:n}=this.getIntegersAndDecimals();return`${this.isNegative?"-":""}${t}${n.length?"."+n:""}`}formatToParts(t){const{integers:n,decimals:e}=this.getIntegersAndDecimals();const s=t.numberFormatter.formatToParts(BigInt(n));this.isNegative&&s.unshift({type:"minusSign",value:t.minusSign});if(e.length){s.push({type:"decimal",value:t.decimal});e.split("").forEach((t=>s.push({type:"fraction",value:t})))}return s}format(t){const{integers:n,decimals:e}=this.getIntegersAndDecimals();const s=`${this.isNegative?t.minusSign:""}${t.numberFormatter.format(BigInt(n))}`;const r=e.length?`${t.decimal}${e.split("").map((n=>t.numberFormatter.format(Number(n)))).join("")}`:"";return`${s}${r}`}add(t){return o.fromBigInt(this.value+new o(t).value)}subtract(t){return o.fromBigInt(this.value-new o(t).value)}multiply(t){return o._divRound(this.value*new o(t).value,o.SHIFT)}divide(t){return o._divRound(this.value*o.SHIFT,new o(t).value)}}o.DECIMALS=100;o.ROUNDED=true;o.SHIFT=BigInt("1"+"0".repeat(o.DECIMALS));o._divRound=(t,n)=>o.fromBigInt(t/n+(o.ROUNDED?t*BigInt(2)/n%BigInt(2):BigInt(0)));o.fromBigInt=t=>Object.assign(Object.create(o.prototype),{value:t,isNegative:t<BigInt(0)});function c(t){return!(!t||isNaN(Number(t)))}function u(t){if(!t||!b(t)){return""}return p(t,(t=>{let n=false;const s=t.split("").filter(((t,s)=>{if(t.match(/\./g)&&!n){n=true;return true}if(t.match(/\-/g)&&s===0){return true}return e.includes(t)})).join("");return c(s)?new o(s).toString():""}))}const a=/^([-0])0+(?=\d)/;const h=/(?!^\.)\.$/;const f=/(?!^-)-/g;const l=/^-\b0\b\.?0*$/;const g=/0*$/;const $=t=>p(t,(t=>{const n=t.replace(f,"").replace(h,"").replace(a,"$1");return c(n)?l.test(n)?n:m(n):t}));function m(t){const n=t.split(".")[1];const e=new o(t).toString();const[s,r]=e.split(".");return n&&r!==n?`${s}.${n}`:e}function p(t,n){if(!t){return t}const e=t.toLowerCase().indexOf("e")+1;if(!e){return n(t)}return t.replace(/[eE]*$/g,"").substring(0,e).concat(t.slice(e).replace(/[eE]/g,"")).split(/[eE]/).map(((t,e)=>e===1?n(t.replace(/\./g,"")):n(t))).join("e").replace(/^e/,"1e")}function d(t){const n=t.split(/[eE]/);if(n.length===1){return t}const e=+t;if(Number.isSafeInteger(e)){return`${e}`}const s=t.charAt(0)==="-";const i=+n[1];const o=n[0].split(".");const c=(s?o[0].substring(1):o[0])||"";const u=o[1]||"";const h=(t,n)=>{const e=Math.abs(n)-t.length;const s=e>0?`${"0".repeat(e)}${t}`:t;const r=`${s.slice(0,n)}${"."}${s.slice(n)}`;return r};const f=(t,n)=>{const e=n>t.length?`${t}${"0".repeat(n-t.length)}`:t;const s=`${e.slice(0,n)}${"."}${e.slice(n)}`;return s};const l=i>0?`${c}${f(u,i)}`:`${h(c,i)}${u}`;return`${s?"-":""}${l.charAt(0)==="."?"0":""}${l.replace(r,"").replace(a,"")}`}function b(t){return e.some((n=>t.includes(n)))}function w(t,n,e){const s=n.split(".")[1];if(s){const r=s.match(g)[0];if(r&&e.delocalize(t).length!==n.length&&s.indexOf("e")===-1){const n=e.decimal;t=!t.includes(n)?`${t}${n}`:t;return t.padEnd(t.length+r.length,e.localize("0"))}}return t}const I="en";const v=["ar","bg","bs","ca","cs","da","de","el",I,"es","et","fi","fr","he","hr","hu","id","it","ja","ko","lt","lv","no","nl","pl","pt-BR","pt-PT","ro","ru","sk","sl","sr","sv","th","tr","uk","vi","zh-CN","zh-HK","zh-TW"];const B=["ar","bg","bs","ca","cs","da","de","de-AT","de-CH","el",I,"en-AU","en-CA","en-GB","es","es-MX","et","fi","fr","fr-CH","he","hi","hr","hu","id","it","it-CH","ja","ko","lt","lv","mk","no","nl","pl","pt","pt-PT","ro","ru","sk","sl","sr","sv","th","tr","uk","vi","zh-CN","zh-HK","zh-TW"];const E=["arab","arabext","latn"];const N=t=>E.includes(t);const j=(new Intl.NumberFormat).resolvedOptions().numberingSystem;const x=j==="arab"||!N(j)?"latn":j;const R=t=>N(t)?t:x;function S(t,n="cldr"){const e=n==="cldr"?B:v;if(!t){return I}if(e.includes(t)){return t}t=t.toLowerCase();if(t==="nb"){return"no"}if(n==="t9n"&&t==="pt"){return"pt-BR"}if(t.includes("-")){t=t.replace(/(\w+)-(\w+)/,((t,n,e)=>`${n}-${e.toUpperCase()}`));if(!e.includes(t)){t=t.split("-")[0]}}if(t==="zh"){return"zh-CN"}if(!e.includes(t)){console.warn(`Translations for the "${t}" locale are not available and will fall back to the default, English (en).`);return I}return t}const k=new Set;function z(t){O(t);if(k.size===0){T?.observe(document.documentElement,{attributes:true,attributeFilter:["lang"],subtree:true})}k.add(t)}function O(t){t.effectiveLocale=y(t)}function C(t){k.delete(t);if(k.size===0){T.disconnect()}}const T=s("mutation",(e=>{e.forEach((e=>{const s=e.target;k.forEach((e=>{const r=!n(s,e.el);if(r){return}const i=t(e.el,"[lang]");if(!i){e.effectiveLocale=I;return}const o=i.lang;e.effectiveLocale=i.hasAttribute("lang")&&o===""?I:o}))}))}));function y(n){return n.el.lang||t(n.el,"[lang]")?.lang||document.documentElement.lang||I}class H{constructor(){this.delocalize=t=>this._numberFormatOptions?p(t,(t=>t.replace(new RegExp(`[${this._minusSign}]`,"g"),"-").replace(new RegExp(`[${this._group}]`,"g"),"").replace(new RegExp(`[${this._decimal}]`,"g"),".").replace(new RegExp(`[${this._digits.join("")}]`,"g"),this._getDigitIndex))):t;this.localize=t=>this._numberFormatOptions?p(t,(t=>c(t.trim())?new o(t.trim()).format(this).replace(new RegExp(`[${this._actualGroup}]`,"g"),this._group):t)):t}get group(){return this._group}get decimal(){return this._decimal}get minusSign(){return this._minusSign}get digits(){return this._digits}get numberFormatter(){return this._numberFormatter}get numberFormatOptions(){return this._numberFormatOptions}set numberFormatOptions(t){t.locale=S(t?.locale);t.numberingSystem=R(t?.numberingSystem);if(!this._numberFormatOptions&&t.locale===I&&t.numberingSystem===x&&Object.keys(t).length===2||JSON.stringify(this._numberFormatOptions)===JSON.stringify(t)){return}this._numberFormatOptions=t;this._numberFormatter=new Intl.NumberFormat(this._numberFormatOptions.locale,this._numberFormatOptions);this._digits=[...new Intl.NumberFormat(this._numberFormatOptions.locale,{useGrouping:false,numberingSystem:this._numberFormatOptions.numberingSystem}).format(9876543210)].reverse();const n=new Map(this._digits.map(((t,n)=>[t,n])));const e=new Intl.NumberFormat(this._numberFormatOptions.locale,{numberingSystem:this._numberFormatOptions.numberingSystem}).formatToParts(-12345678.9);this._actualGroup=e.find((t=>t.type==="group")).value;this._group=this._actualGroup.trim().length===0||this._actualGroup==" "?" ":this._actualGroup;this._decimal=e.find((t=>t.type==="decimal")).value;this._minusSign=e.find((t=>t.type==="minusSign")).value;this._getDigitIndex=t=>n.get(t)}}const A=new H;let F;let M;function P(t={}){return Object.entries(t).sort((([t],[n])=>t.localeCompare(n))).map((t=>`${t[0]}-${t[1]}`)).flat().join(":")}function G(t,n){t=S(t);if(!F){F=new Map}if(M!==t){F.clear();M=t}const e=P(n);const s=F.get(e);if(s){return s}const r=new Intl.DateTimeFormat(t,n);F.set(e,r);return r}export{o as B,H as N,w as a,R as b,z as c,C as d,G as e,S as g,c as i,A as n,u as p,$ as s};
+//# sourceMappingURL=p-9e925631.js.map

package/dist/calcite/p-9fdae794.entry.js

@@ -0,0 +1,7 @@
+/*!
+ * 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.5.0-next.0
+ */
+import{r as e,c as t,h as i,F as n,g as a}from"./p-aa4a7aa0.js";import{c as s,d as o}from"./p-b77f3a77.js";import{e as c,g as r,t as l}from"./p-2a0f60c9.js";import{c as d,d as h}from"./p-9e925631.js";import{u as p,c as g,s as f,d as m}from"./p-3c675720.js";import{H as u,c as x}from"./p-7a32abca.js";import{c as v}from"./p-8d22af5c.js";import"./p-2b05e96c.js";import"./p-b4352ddb.js";import"./p-5bdc1461.js";const b={container:"container",header:"header",heading:"heading",close:"close",imageFrame:"image-frame",content:"content",info:"info"};const y={close:"x"};const k={thumbnail:"thumbnail"};const z=":host{position:relative;margin:1rem;box-sizing:border-box;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-color:var(--calcite-color-border-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-color-text-2)}:host *{box-sizing:border-box}.container{inline-size:100%;padding:1rem}:host([closed]),:host([closed]) .container{display:none}:host([selected]) .container{margin:0px;border-style:none;padding:0px}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-color-text-2);color:var(--calcite-color-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.header{margin-block-end:0.5rem}.header .heading{padding:0px;font-size:var(--calcite-font-size-0);line-height:1.25rem;color:var(--calcite-color-text-1)}.container[hidden]{display:none}.content{display:flex}.info{padding-block:0px;padding-inline:1rem;inline-size:70%}.info:only-child{inline-size:100%;padding-inline:0px}::slotted(p){margin-block-start:0px}::slotted(a){outline-color:transparent;color:var(--calcite-color-brand)}::slotted(a:focus){outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.image-frame{inline-size:25%}.image-frame img{max-inline-size:100%}::slotted(img){max-inline-size:100%}:host([hidden]){display:none}[hidden]{display:none}";const w=class{constructor(i){e(this,i);this.calciteTipDismiss=t(this,"calciteTipDismiss",6);this.hideTip=()=>{this.closed=true;this.calciteTipDismiss.emit()};this.closed=false;this.closeDisabled=false;this.heading=undefined;this.headingLevel=undefined;this.selected=false;this.messages=undefined;this.messageOverrides=undefined;this.defaultMessages=undefined;this.effectiveLocale=""}onMessagesChange(){}effectiveLocaleChange(){p(this,this.effectiveLocale)}connectedCallback(){s(this);d(this);g(this)}async componentWillLoad(){await f(this)}disconnectedCallback(){o(this);h(this);m(this)}renderHeader(){const{heading:e,headingLevel:t,el:n}=this;const a=n.closest("calcite-tip-manager")?.headingLevel;const s=a?x(a+1):null;const o=t||s;return e?i("header",{class:b.header},i(u,{class:b.heading,level:o},e)):null}renderDismissButton(){const{closeDisabled:e,hideTip:t}=this;return!e?i("calcite-action",{class:b.close,icon:y.close,onClick:t,scale:"l",text:this.messages.close}):null}renderImageFrame(){const{el:e}=this;return c(e,k.thumbnail)?i("div",{class:b.imageFrame,key:"thumbnail"},i("slot",{name:k.thumbnail})):null}renderInfoNode(){return i("div",{class:b.info},i("slot",null))}renderContent(){return i("div",{class:b.content},this.renderImageFrame(),this.renderInfoNode())}render(){return i(n,null,i("article",{class:b.container},this.renderHeader(),this.renderContent()),this.renderDismissButton())}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{messageOverrides:["onMessagesChange"],effectiveLocale:["effectiveLocaleChange"]}}};w.style=z;const C=":host{box-sizing:border-box;display:block;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-color-text-2)}::slotted(calcite-tip){margin:0px;border-style:none;max-inline-size:var(--calcite-tip-max-width)}:host([hidden]){display:none}[hidden]{display:none}";const L=class{constructor(t){e(this,t);this.groupTitle=undefined}render(){return i("slot",null)}};L.style=C;const j={header:"header",heading:"heading",close:"close",container:"container",tipContainer:"tip-container",tipContainerAdvancing:"tip-container--advancing",tipContainerRetreating:"tip-container--retreating",pagination:"pagination",pagePosition:"page-position",pageNext:"page-next",pagePrevious:"page-previous"};const T={chevronLeft:"chevron-left",chevronRight:"chevron-right",close:"x"};const H=":host{box-sizing:border-box;display:block;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-color-text-2);--calcite-tip-manager-height:19vh}:host *{box-sizing:border-box}:host([closed]){display:none}.header{margin:0px;display:flex;align-content:space-between;align-items:center;fill:var(--calcite-color-text-2);color:var(--calcite-color-text-2)}.heading{margin:0px;padding:0px;font-weight:var(--calcite-font-weight-medium)}.header .heading{flex:1 1 auto;padding:0.5rem}.header{border-width:0px;border-block-end-width:1px;border-style:solid;border-color:var(--calcite-color-border-3);padding-block:0px;padding-inline-end:0px;padding-inline-start:1rem}.header .heading{padding:0px;font-size:var(--calcite-font-size-1);line-height:1.5rem;font-weight:var(--calcite-font-weight-bold);color:var(--calcite-color-text-1)}.container{position:relative;overflow:hidden;outline-color:transparent;min-block-size:150px}.container:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}.tip-container{margin-block-start:1px;display:flex;align-items:flex-start;justify-content:center;overflow:auto;padding:1rem;outline-color:transparent;animation-name:none;animation-duration:var(--calcite-animation-timing);block-size:var(--calcite-tip-manager-height)}.tip-container:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-color-brand-hover, var(--calcite--color-brand)));outline-offset:calc(\n            2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-offset-invert-focus),\n                1\n              )\n            )\n          )}::slotted(calcite-tip){margin:0px;border-style:none;max-inline-size:var(--calcite-tip-max-width)}.tip-container--advancing{animation-name:tip-advance}.tip-container--retreating{animation-name:tip-retreat}.pagination{display:flex;align-items:center;justify-content:center;padding-inline:0px;padding-block:0.75rem 0.5rem}.page-position{margin-block:0px;margin-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}@keyframes tip-advance{0%{opacity:0;transform:translate3d(50px, 0, 0) scale(0.99)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}@keyframes tip-retreat{0%{opacity:0;transform:translate3d(-50px, 0, 0) scale(0.99)}100%{opacity:1;transform:translate3d(0, 0, 0) scale(1)}}:host([hidden]){display:none}[hidden]{display:none}";const I=class{constructor(i){e(this,i);this.calciteTipManagerClose=t(this,"calciteTipManagerClose",6);this.mutationObserver=v("mutation",(()=>this.setUpTips()));this.hideTipManager=()=>{this.closed=true;this.calciteTipManagerClose.emit()};this.previousClicked=()=>{this.previousTip()};this.nextClicked=()=>{this.nextTip()};this.tipManagerKeyDownHandler=e=>{if(e.target!==this.container){return}switch(e.key){case"ArrowRight":e.preventDefault();this.nextTip();break;case"ArrowLeft":e.preventDefault();this.previousTip();break;case"Home":e.preventDefault();this.selectedIndex=0;break;case"End":e.preventDefault();this.selectedIndex=this.total-1;break}};this.storeContainerRef=e=>{this.container=e};this.closed=false;this.headingLevel=undefined;this.messages=undefined;this.messageOverrides=undefined;this.selectedIndex=undefined;this.tips=undefined;this.total=undefined;this.direction=undefined;this.groupTitle=undefined;this.defaultMessages=undefined;this.effectiveLocale=""}closedChangeHandler(){this.direction=null}onMessagesChange(){}selectedChangeHandler(){this.showSelectedTip();this.updateGroupTitle()}async effectiveLocaleChange(){await p(this,this.effectiveLocale);this.updateGroupTitle()}connectedCallback(){d(this);g(this);this.setUpTips();this.mutationObserver?.observe(this.el,{childList:true,subtree:true})}async componentWillLoad(){await f(this);this.updateGroupTitle()}disconnectedCallback(){this.mutationObserver?.disconnect();h(this);m(this)}async nextTip(){this.direction="advancing";const e=this.selectedIndex+1;this.selectedIndex=(e+this.total)%this.total}async previousTip(){this.direction="retreating";const e=this.selectedIndex-1;this.selectedIndex=(e+this.total)%this.total}setUpTips(){const e=Array.from(this.el.querySelectorAll("calcite-tip"));this.total=e.length;if(this.total===0){return}const t=this.el.querySelector("calcite-tip[selected]");this.tips=e;this.selectedIndex=t?e.indexOf(t):0;e.forEach((e=>{e.closeDisabled=true}));this.showSelectedTip()}showSelectedTip(){this.tips.forEach(((e,t)=>{const i=this.selectedIndex===t;e.selected=i;e.hidden=!i}))}updateGroupTitle(){if(this.tips){const e=this.tips[this.selectedIndex];const t=e.closest("calcite-tip-group");this.groupTitle=t?.groupTitle||this.messages?.defaultGroupTitle}}renderPagination(){const e=r(this.el);const{selectedIndex:t,tips:n,total:a,messages:s}=this;const o=s.next;const c=s.previous;const l=s.defaultPaginationLabel;return n.length>1?i("footer",{class:j.pagination},i("calcite-action",{class:j.pagePrevious,icon:e==="ltr"?T.chevronLeft:T.chevronRight,onClick:this.previousClicked,scale:"m",text:c}),i("span",{class:j.pagePosition},`${l} ${t+1}/${a}`),i("calcite-action",{class:j.pageNext,icon:e==="ltr"?T.chevronRight:T.chevronLeft,onClick:this.nextClicked,scale:"m",text:o})):null}render(){const{closed:e,direction:t,headingLevel:n,groupTitle:a,selectedIndex:s,messages:o,total:c}=this;const r=o.close;if(c===0){return null}return i("section",{"aria-hidden":l(e),class:j.container,hidden:e,onKeyDown:this.tipManagerKeyDownHandler,tabIndex:0,ref:this.storeContainerRef},i("header",{class:j.header},i(u,{class:j.heading,level:n},a),i("calcite-action",{class:j.close,onClick:this.hideTipManager,scale:"m",text:r},i("calcite-icon",{icon:T.close,scale:"m"}))),i("div",{class:{[j.tipContainer]:true,[j.tipContainerAdvancing]:!e&&t==="advancing",[j.tipContainerRetreating]:!e&&t==="retreating"},key:s,tabIndex:0},i("slot",null)),this.renderPagination())}static get assetsDirs(){return["assets"]}get el(){return a(this)}static get watchers(){return{closed:["closedChangeHandler"],messageOverrides:["onMessagesChange"],selectedIndex:["selectedChangeHandler"],effectiveLocale:["effectiveLocaleChange"]}}};I.style=H;export{w as calcite_tip,L as calcite_tip_group,I as calcite_tip_manager};
+//# sourceMappingURL=p-9fdae794.entry.js.map