@esri/calcite-components 2.1.0-next.6 → 2.1.0-next.7

package/dist/components/menu.js

@@ -1,14 +1,13 @@
 /*!
  * 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.1.0-next.6
+ * v2.1.0-next.7
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { proxyCustomElement, HTMLElement, forceUpdate, h, Host } from '@stencil/core/internal/client';
 import { s as slotChangeGetAssignedElements, v as focusElementInGroup, e as focusElement } from './dom.js';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';
 import { u as updateMessages, c as connectMessages, s as setUpMessages, d as disconnectMessages } from './t9n.js';
-import { w as watchGlobalAttributes, u as unwatchGlobalAttributes } from './globalAttributes.js';
 
 const menuCss = ":host{display:flex}ul{margin:0px;display:inline-flex;block-size:100%;align-items:center;padding:0px}:host([layout=vertical]) ul{display:flex;inline-size:100%;flex-direction:column}:host([hidden]){display:none}[hidden]{display:none}";
 
@@ -33,9 +32,15 @@ const CalciteMenu = /*@__PURE__*/ proxyCustomElement(class CalciteMenu extends H
         this.messages = undefined;
         this.defaultMessages = undefined;
         this.effectiveLocale = "";
-        this.globalAttributes = {
-            role: "menubar",
-        };
+    }
+    //--------------------------------------------------------------------------
+    //
+    //  Global attributes
+    //
+    //--------------------------------------------------------------------------
+    handleGlobalAttributesChanged() {
+        forceUpdate(this);
+        this.setMenuItemLayout(this.menuItems, this.layout);
     }
     handleLayoutChange(value) {
         this.setMenuItemLayout(this.menuItems, value);
@@ -54,7 +59,6 @@ const CalciteMenu = /*@__PURE__*/ proxyCustomElement(class CalciteMenu extends H
     connectedCallback() {
         connectLocalized(this);
         connectMessages(this);
-        watchGlobalAttributes(this, ["role"]);
     }
     async componentWillLoad() {
         setUpLoadableComponent(this);
@@ -66,7 +70,6 @@ const CalciteMenu = /*@__PURE__*/ proxyCustomElement(class CalciteMenu extends H
     disconnectedCallback() {
         disconnectLocalized(this);
         disconnectMessages(this);
-        unwatchGlobalAttributes(this);
     }
     //--------------------------------------------------------------------------
     //
@@ -143,24 +146,28 @@ const CalciteMenu = /*@__PURE__*/ proxyCustomElement(class CalciteMenu extends H
     setMenuItemLayout(items, layout) {
         items.forEach((item) => {
             item.layout = layout;
-            if (this.globalAttributes.role === "menubar") {
+            if (this.getEffectiveRole() === "menubar") {
                 item.isTopLevelItem = true;
                 item.topLevelMenuLayout = this.layout;
             }
         });
     }
+    getEffectiveRole() {
+        return this.el.getAttribute("role") || "menubar";
+    }
     // --------------------------------------------------------------------------
     //
     //  Render Methods
     //
     // --------------------------------------------------------------------------
     render() {
-        return (h(Host, null, h("ul", { "aria-label": this.label, ...this.globalAttributes }, h("slot", { onSlotchange: this.handleMenuSlotChange }))));
+        return (h(Host, null, h("ul", { "aria-label": this.label, role: this.getEffectiveRole() }, h("slot", { onSlotchange: this.handleMenuSlotChange }))));
     }
     static get delegatesFocus() { return true; }
     static get assetsDirs() { return ["assets"]; }
     get el() { return this; }
     static get watchers() { return {
+        "role": ["handleGlobalAttributesChanged"],
         "layout": ["handleLayoutChange"],
         "messageOverrides": ["onMessagesChange"],
         "effectiveLocale": ["effectiveLocaleChange"]
@@ -173,9 +180,9 @@ const CalciteMenu = /*@__PURE__*/ proxyCustomElement(class CalciteMenu extends H
         "messages": [1040],
         "defaultMessages": [32],
         "effectiveLocale": [32],
-        "globalAttributes": [32],
         "setFocus": [64]
     }, [[0, "calciteInternalMenuItemKeyEvent", "calciteInternalNavMenuItemKeyEvent"]], {
+        "role": ["handleGlobalAttributesChanged"],
         "layout": ["handleLayoutChange"],
         "messageOverrides": ["onMessagesChange"],
         "effectiveLocale": ["effectiveLocaleChange"]

package/dist/components/menu.js.map

@@ -1 +1 @@
-{"file":"menu.js","mappings":"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","names":[],"sources":["src/components/menu/menu.scss?tag=calcite-menu&encapsulation=shadow","src/components/menu/menu.tsx"],"sourcesContent":[":host {\n  @apply flex;\n}\n\nul {\n  @apply inline-flex items-center h-full m-0 p-0;\n}\n\n:host([layout=\"vertical\"]) ul {\n  @apply flex flex-col w-full;\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  VNode,\n} from \"@stencil/core\";\nimport { focusElement, focusElementInGroup, slotChangeGetAssignedElements } from \"../../utils/dom\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { MenuMessages } from \"./assets/menu/t9n\";\nimport {\n  GlobalAttrComponent,\n  unwatchGlobalAttributes,\n  watchGlobalAttributes,\n} from \"../../utils/globalAttributes\";\n\ntype Layout = \"horizontal\" | \"vertical\";\n\n@Component({\n  tag: \"calcite-menu\",\n  styleUrl: \"menu.scss\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  assetsDirs: [\"assets\"],\n})\nexport class CalciteMenu\n  implements GlobalAttrComponent, LocalizedComponent, T9nComponent, LoadableComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Accessible name for the component.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Specifies the layout of the component.\n   */\n  @Prop({ reflect: true }) layout: Layout = \"horizontal\";\n\n  @Watch(\"layout\")\n  handleLayoutChange(value: Layout): void {\n    this.setMenuItemLayout(this.menuItems, value);\n  }\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<MenuMessages>;\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: MenuMessages;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteMenuElement;\n\n  @State() defaultMessages: MenuMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() globalAttributes = {\n    role: \"menubar\",\n  };\n\n  menuItems: HTMLCalciteMenuItemElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n    watchGlobalAttributes(this, [\"role\"]);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    unwatchGlobalAttributes(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.el.focus();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalMenuItemKeyEvent\")\n  calciteInternalNavMenuItemKeyEvent(event: CustomEvent): void {\n    const target = event.target as HTMLCalciteMenuItemElement;\n    const submenuItems = event.detail.children;\n    const key = event.detail.event.key;\n    event.stopPropagation();\n\n    if (key === \"ArrowDown\") {\n      if (target.layout === \"vertical\") {\n        focusElementInGroup(this.menuItems, target, \"next\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[0].setFocus();\n        }\n      }\n    } else if (key === \"ArrowUp\") {\n      if (this.layout === \"vertical\") {\n        focusElementInGroup(this.menuItems, target, \"previous\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[submenuItems.length - 1].setFocus();\n        }\n      }\n    } else if (key === \"ArrowRight\") {\n      if (this.layout === \"horizontal\") {\n        focusElementInGroup(this.menuItems, target, \"next\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[0].setFocus();\n        }\n      }\n    } else if (key === \"ArrowLeft\") {\n      if (this.layout === \"horizontal\") {\n        focusElementInGroup(this.menuItems, target, \"previous\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          this.focusParentElement(event.target as HTMLCalciteMenuItemElement);\n        }\n      }\n    } else if (key === \"Escape\") {\n      this.focusParentElement(event.target as HTMLCalciteMenuItemElement);\n    }\n    event.preventDefault();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  handleMenuSlotChange = (event: Event): void => {\n    this.menuItems = slotChangeGetAssignedElements(event) as HTMLCalciteMenuItemElement[];\n    this.setMenuItemLayout(this.menuItems, this.layout);\n  };\n\n  focusParentElement(el: HTMLCalciteMenuItemElement): void {\n    const parentEl = el.parentElement as HTMLCalciteMenuItemElement;\n    if (parentEl) {\n      focusElement(parentEl);\n      parentEl.open = false;\n    }\n  }\n\n  setMenuItemLayout(items: HTMLCalciteMenuItemElement[], layout: Layout): void {\n    items.forEach((item) => {\n      item.layout = layout;\n      if (this.globalAttributes.role === \"menubar\") {\n        item.isTopLevelItem = true;\n        item.topLevelMenuLayout = this.layout;\n      }\n    });\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  render(): VNode {\n    return (\n      <Host>\n        <ul aria-label={this.label} {...this.globalAttributes}>\n          <slot onSlotchange={this.handleMenuSlotChange} />\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"menu.js","mappings":"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","names":[],"sources":["src/components/menu/menu.scss?tag=calcite-menu&encapsulation=shadow","src/components/menu/menu.tsx"],"sourcesContent":[":host {\n  @apply flex;\n}\n\nul {\n  @apply inline-flex items-center h-full m-0 p-0;\n}\n\n:host([layout=\"vertical\"]) ul {\n  @apply flex flex-col w-full;\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  VNode,\n  forceUpdate,\n} from \"@stencil/core\";\nimport { focusElement, focusElementInGroup, slotChangeGetAssignedElements } from \"../../utils/dom\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { MenuMessages } from \"./assets/menu/t9n\";\n\ntype Layout = \"horizontal\" | \"vertical\";\n\n@Component({\n  tag: \"calcite-menu\",\n  styleUrl: \"menu.scss\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  assetsDirs: [\"assets\"],\n})\nexport class CalciteMenu implements LocalizedComponent, T9nComponent, LoadableComponent {\n  //--------------------------------------------------------------------------\n  //\n  //  Global attributes\n  //\n  //--------------------------------------------------------------------------\n\n  @Watch(\"role\")\n  handleGlobalAttributesChanged(): void {\n    forceUpdate(this);\n    this.setMenuItemLayout(this.menuItems, this.layout);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Accessible name for the component.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Specifies the layout of the component.\n   */\n  @Prop({ reflect: true }) layout: Layout = \"horizontal\";\n\n  @Watch(\"layout\")\n  handleLayoutChange(value: Layout): void {\n    this.setMenuItemLayout(this.menuItems, value);\n  }\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<MenuMessages>;\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: MenuMessages;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteMenuElement;\n\n  @State() defaultMessages: MenuMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  menuItems: HTMLCalciteMenuItemElement[] = [];\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    await setUpMessages(this);\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.el.focus();\n  }\n  //--------------------------------------------------------------------------\n  //\n  //  Event Listeners\n  //\n  //--------------------------------------------------------------------------\n\n  @Listen(\"calciteInternalMenuItemKeyEvent\")\n  calciteInternalNavMenuItemKeyEvent(event: CustomEvent): void {\n    const target = event.target as HTMLCalciteMenuItemElement;\n    const submenuItems = event.detail.children;\n    const key = event.detail.event.key;\n    event.stopPropagation();\n\n    if (key === \"ArrowDown\") {\n      if (target.layout === \"vertical\") {\n        focusElementInGroup(this.menuItems, target, \"next\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[0].setFocus();\n        }\n      }\n    } else if (key === \"ArrowUp\") {\n      if (this.layout === \"vertical\") {\n        focusElementInGroup(this.menuItems, target, \"previous\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[submenuItems.length - 1].setFocus();\n        }\n      }\n    } else if (key === \"ArrowRight\") {\n      if (this.layout === \"horizontal\") {\n        focusElementInGroup(this.menuItems, target, \"next\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          submenuItems[0].setFocus();\n        }\n      }\n    } else if (key === \"ArrowLeft\") {\n      if (this.layout === \"horizontal\") {\n        focusElementInGroup(this.menuItems, target, \"previous\", false);\n      } else {\n        if (event.detail.isSubmenuOpen) {\n          this.focusParentElement(event.target as HTMLCalciteMenuItemElement);\n        }\n      }\n    } else if (key === \"Escape\") {\n      this.focusParentElement(event.target as HTMLCalciteMenuItemElement);\n    }\n    event.preventDefault();\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  handleMenuSlotChange = (event: Event): void => {\n    this.menuItems = slotChangeGetAssignedElements(event) as HTMLCalciteMenuItemElement[];\n    this.setMenuItemLayout(this.menuItems, this.layout);\n  };\n\n  focusParentElement(el: HTMLCalciteMenuItemElement): void {\n    const parentEl = el.parentElement as HTMLCalciteMenuItemElement;\n    if (parentEl) {\n      focusElement(parentEl);\n      parentEl.open = false;\n    }\n  }\n\n  setMenuItemLayout(items: HTMLCalciteMenuItemElement[], layout: Layout): void {\n    items.forEach((item) => {\n      item.layout = layout;\n      if (this.getEffectiveRole() === \"menubar\") {\n        item.isTopLevelItem = true;\n        item.topLevelMenuLayout = this.layout;\n      }\n    });\n  }\n\n  private getEffectiveRole(): string {\n    return this.el.getAttribute(\"role\") || \"menubar\";\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  // --------------------------------------------------------------------------\n\n  render(): VNode {\n    return (\n      <Host>\n        <ul aria-label={this.label} role={this.getEffectiveRole()}>\n          <slot onSlotchange={this.handleMenuSlotChange} />\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/mk.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/nb.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/nl.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/observers.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { Build } from '@stencil/core/internal/client';
 

package/dist/components/openCloseComponent.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { readTask } from '@stencil/core/internal/client';
 

package/dist/components/pagination.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
@@ -27,7 +27,7 @@ const ICONS = {
 
 /**
  * Do not edit directly
- * Generated on Tue, 12 Dec 2023 18:26:22 GMT
+ * Generated on Wed, 13 Dec 2023 18:59:39 GMT
  */
 const calciteContainerSizeWidthXxs = {"min":"0","max":"320px"}; // Small handheld devices and mini-windows
 const calciteContainerSizeWidthXs = {"min":"321px","max":"476px"}; // Handheld devices

package/dist/components/pagination.js.map

@@ -1 +1 @@
-{"file":"pagination.js","mappings":";;;;;;;;;;;;;AAAO,MAAM,GAAG,GAAG;IACjB,IAAI,EAAE,MAAM;IACZ,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,SAAS;IAClB,QAAQ,EAAE,UAAU;IACpB,QAAQ,EAAE,UAAU;CACrB,CAAC;AAEK,MAAM,KAAK,GAAG;IACnB,IAAI,EAAE,eAAe;IACrB,QAAQ,EAAE,cAAc;IACxB,KAAK,EAAE,eAAe;IACtB,IAAI,EAAE,aAAa;CACpB;;ACbD;AACA;AACA;AACA;AAyDO,MAAM,4BAA4B,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAC/D,MAAM,2BAA2B,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAClE,MAAM,2BAA2B,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAClE,MAAM,2BAA2B,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;AACnE,MAAM,2BAA2B,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;;AC9C3E;;;AAGO,MAAM,WAAW,GAAgB;IACtC,KAAK,EAAE;QACL,KAAK,EAAE,iBAAiB,CAAC,2BAA2B,CAAC,GAAG,CAAC;QACzD,MAAM,EAAE,iBAAiB,CAAC,2BAA2B,CAAC,GAAG,CAAC;QAC1D,KAAK,EAAE,iBAAiB,CAAC,2BAA2B,CAAC,GAAG,CAAC;QACzD,MAAM,EAAE,iBAAiB,CAAC,2BAA2B,CAAC,GAAG,CAAC;QAC1D,OAAO,EAAE,iBAAiB,CAAC,4BAA4B,CAAC,GAAG,CAAC;KAC7D;CACF,CAAC;AAEF,SAAS,iBAAiB,CAAC,MAAc;IACvC,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC1B;;ACjCA,MAAM,aAAa,GAAG,8oEAA8oE;;AC8CpqE,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAChC,MAAM,aAAa,GAAG,CAAC,CAAC;AAExB,MAAM,kBAAkB,GAAG;IACzB,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,OAAO,EAAE,CAAC;CACX,CAAC;MAUW,UAAU;;;;;;QA4Gb,mBAAc,GAAG,cAAc,CAAC,QAAQ,EAAE,CAAC,OAAO,KACxD,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CACpC,CAAC;QAuGM,kBAAa,GAAG,CAAC,EAAE,WAAW,EAAE,EAAE,KAAK,EAAE,EAAuB,KACtE,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC;QAE9B,iBAAY,GAAG;YACrB,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC;YACnB,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB,CAAC;QAEM,gBAAW,GAAG;YACpB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC;YACpC,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB,CAAC;QAEM,oBAAe,GAAG;YACxB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC;YAC1B,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB,CAAC;QAEM,gBAAW,GAAG;YACpB,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;YACtB,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB,CAAC;QAsBM,oBAAe,GAAG,CAAC,KAAY;YACrC,MAAM,MAAM,GAAG,KAAK,CAAC,MAA2B,CAAC;YACjD,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YAC5C,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB,CAAC;8BAxPwC,KAAK;;;;wBA2BI,EAAE;qBAGb,GAAG;yBAGS,CAAC;0BAGf,CAAC;;+BAqBZ,EAAE;wBAgBT,kBAAkB,CAAC,OAAO;;;;;IAxD9C,gBAAgB;;KAEf;IAqBD,gBAAgB;QACd,IAAI,IAAI,CAAC,QAAQ,GAAG,CAAC,EAAE;YACrB,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;SACnB;QACD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC;KACnD;IAeD,qBAAqB;QACnB,cAAc,CAAC,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;KAC5C;IAGD,sBAAsB;QACpB,qBAAqB,CAAC,mBAAmB,GAAG;YAC1C,MAAM,EAAE,IAAI,CAAC,eAAe;YAC5B,eAAe,EAAE,IAAI,CAAC,eAAe;YACrC,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC;KACH;IAWD,yBAAyB;QACvB,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAElD,IAAI,CAAC,aAAa;YAChB,CAAC,UAAU,GAAG,QAAQ,KAAK,CAAC,GAAG,UAAU,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,QAAQ,IAAI,CAAC,CAAC;KACjG;IAKD,eAAe;QACb,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,KAAK,kBAAkB,CAAC,OAAO,CAAC;KAC/D;;;;;;IAuBD,iBAAiB;QACf,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACvB,eAAe,CAAC,IAAI,CAAC,CAAC;QACtB,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACvC;IAED,MAAM,iBAAiB;QACrB,MAAM,aAAa,CAAC,IAAI,CAAC,CAAC;QAC1B,sBAAsB,CAAC,IAAI,CAAC,CAAC;QAC7B,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,yBAAyB,EAAE,CAAC;QACjC,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,gBAAgB;QACd,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;KACnD;IAED,oBAAoB;QAClB,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,kBAAkB,CAAC,IAAI,CAAC,CAAC;QACzB,IAAI,CAAC,cAAc,EAAE,UAAU,EAAE,CAAC;KACnC;;;;;;;IAUD,MAAM,QAAQ;QACZ,MAAM,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;KACjB;;IAID,MAAM,QAAQ;QACZ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC/E;;IAID,MAAM,YAAY;QAChB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC9D;;;;;;IAQO,uBAAuB,CAAC,KAAa;QAC3C,IAAI,CAAC,WAAW,IAAI,CAAC,KAAK,EAAE;YAC1B,OAAO;SACR;QAED,IAAI,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE;YACrC,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,KAAK,CAAC;YACzC,OAAO;SACR;QAED,IAAI,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE;YACpC,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,MAAM,CAAC;YAC1C,OAAO;SACR;QAED,IAAI,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC,MAAM,EAAE;YACrC,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,KAAK,CAAC;YACzC,OAAO;SACR;QAED,IAAI,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE;YACtC,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,MAAM,CAAC;YAC1C,OAAO;SACR;QAED,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,OAAO,CAAC;KAC5C;IAyBO,iBAAiB;QACvB,QACE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ;YAC/B,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;gBACxC,IAAI,CAAC,QAAQ,GAAG,qBAAqB,GAAG,aAAa,EACvD;KACH;IAEO,eAAe;QACrB,QACE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ;YAC/B,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,QAAQ;gBAChD,IAAI,CAAC,QAAQ,GAAG,qBAAqB,IAAI,aAAa,GAAG,CAAC,CAAC,EAC7D;KACH;IAEO,UAAU;QAChB,IAAI,CAAC,uBAAuB,CAAC,IAAI,EAAE,CAAC;KACrC;;;;;;IAcD,cAAc,CAAC,IAAqB;QAClC,QACE,YAAM,KAAK,EAAE,GAAG,CAAC,QAAQ,wBAAsB,IAAI,EAAE,GAAG,EAAE,IAAI,aAEvD,EACP;KACH;IAED,WAAW;QACT,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,aAAa,EAAE,SAAS,EAAE,GACvF,IAAI,CAAC;QAEP,MAAM,KAAK,GAAY,EAAE,CAAC;QAE1B,IAAI,SAAS,EAAE;YACb,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC;YACvC,OAAO,KAAK,CAAC;SACd;QAED,MAAM,eAAe,GAAG,UAAU,GAAG,QAAQ,CAAC;QAC9C,MAAM,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACrD,MAAM,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEjD,IAAI,eAAe,EAAE;YACnB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC;SAChC;QAED,IAAI,mBAAmB,EAAE;YACvB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;SAC1C;QAED,MAAM,cAAc,GAClB,QAAQ;YACR,qBAAqB;aACpB,iBAAiB,GAAG,CAAC,GAAG,CAAC,CAAC;aAC1B,mBAAmB,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAEhC,IAAI,GAAW,CAAC;QAChB,IAAI,SAAiB,CAAC;;QAGtB,IAAI,UAAU,GAAG,CAAC,IAAI,cAAc,EAAE;YACpC,SAAS,GAAG,CAAC,GAAG,QAAQ,CAAC;YACzB,GAAG,GAAG,aAAa,GAAG,QAAQ,CAAC;SAChC;aAAM;;YAEL,IAAI,SAAS,GAAG,QAAQ,GAAG,cAAc,EAAE;gBACzC,SAAS,GAAG,CAAC,GAAG,QAAQ,CAAC;gBACzB,GAAG,GAAG,CAAC,GAAG,cAAc,GAAG,QAAQ,CAAC;aACrC;iBAAM;;gBAEL,IAAI,SAAS,GAAG,cAAc,GAAG,QAAQ,IAAI,UAAU,EAAE;oBACvD,SAAS,GAAG,aAAa,GAAG,cAAc,GAAG,QAAQ,CAAC;oBACtD,GAAG,GAAG,aAAa,GAAG,QAAQ,CAAC;iBAChC;qBAAM;;oBAEL,SAAS,GAAG,SAAS,GAAG,QAAQ,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;oBAC9D,GAAG,GAAG,SAAS,GAAG,QAAQ,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;iBACzD;aACF;SACF;QAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,cAAc,IAAI,SAAS,IAAI,GAAG,EAAE,CAAC,EAAE,EAAE;YAC3D,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC;YACvC,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;SAClC;QAED,IAAI,iBAAiB,EAAE;YACrB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;SACxC;QAED,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC,CAAC;QAE3C,OAAO,KAAK,CAAC;KACd;IAED,UAAU,CAAC,KAAa;QACtB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC,IAAI,QAAQ,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAErE,qBAAqB,CAAC,mBAAmB,GAAG;YAC1C,MAAM,EAAE,IAAI,CAAC,eAAe;YAC5B,eAAe,EAAE,IAAI,CAAC,eAAe;YACrC,WAAW,EAAE,IAAI,CAAC,cAAc;SACjC,CAAC;QAEF,MAAM,aAAa,GAAG,qBAAqB,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;QACtE,MAAM,QAAQ,GAAG,KAAK,KAAK,IAAI,CAAC,SAAS,CAAC;QAE1C,QACE,8BACgB,QAAQ,GAAG,MAAM,GAAG,OAAO,EACzC,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,IAAI,GAAG,IAAI;gBAChB,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ;aACzB,EACD,OAAO,EAAE,IAAI,CAAC,eAAe,EAC7B,KAAK,EAAE,KAAK,IAEX,aAAa,CACP,EACT;KACH;IAED,qBAAqB;QACnB,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAE/C,MAAM,QAAQ,GAAG,QAAQ,KAAK,CAAC,GAAG,SAAS,IAAI,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;QAE/E,QACE,4BACc,QAAQ,CAAC,QAAQ,EAC7B,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI;gBACnB,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ;aACzB,uBACiB,UAAU,EAC5B,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAC,UAAU,EACd,OAAO,EAAE,IAAI,CAAC,eAAe,IAE7B,oBAAc,OAAO,QAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,GAAI,CACxE,EACT;KACH;IAED,iBAAiB;QACf,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAE3D,MAAM,QAAQ,GACZ,QAAQ,KAAK,CAAC,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;QAEzF,QACE,4BACc,QAAQ,CAAC,IAAI,EACzB,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI;gBACnB,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ;aACzB,uBACiB,MAAM,EACxB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAC,aAAa,EACjB,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,oBAAc,OAAO,QAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,GAAI,CACpE,EACT;KACH;IAED,kBAAkB;QAChB,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAEhD,MAAM,QAAQ,GAAG,SAAS,KAAK,CAAC,CAAC;QAEjC,OAAO,SAAS,IACd,4BACc,QAAQ,CAAC,KAAK,EAC1B,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI;gBACnB,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ;aACzB,EACD,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAC,cAAc,EAClB,OAAO,EAAE,IAAI,CAAC,YAAY,IAE1B,oBAAc,OAAO,QAAC,IAAI,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,GAAI,CACrE,IACP,IAAI,CAAC;KACV;IAED,iBAAiB;QACf,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC;QAE/D,MAAM,QAAQ,GAAG,SAAS,KAAK,aAAa,CAAC;QAE7C,OAAO,SAAS,IACd,4BACc,QAAQ,CAAC,IAAI,EACzB,KAAK,EAAE;gBACL,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI;gBACnB,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ;aACzB,EACD,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAC,aAAa,EACjB,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,oBAAc,OAAO,QAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,GAAI,CACpE,IACP,IAAI,CAAC;KACV;IAED,MAAM;QACJ,QACE,EAAC,QAAQ,QACN,IAAI,CAAC,kBAAkB,EAAE,EACzB,IAAI,CAAC,qBAAqB,EAAE,EAC5B,IAAI,CAAC,WAAW,EAAE,EAClB,IAAI,CAAC,iBAAiB,EAAE,EACxB,IAAI,CAAC,iBAAiB,EAAE,CAChB,EACX;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/pagination/resources.ts","../calcite-design-tokens/dist/es6/global.js","src/utils/responsive.ts","src/components/pagination/pagination.scss?tag=calcite-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["export const CSS = {\n  page: \"page\",\n  selected: \"selected\",\n  chevron: \"chevron\",\n  disabled: \"disabled\",\n  ellipsis: \"ellipsis\",\n};\n\nexport const ICONS = {\n  next: \"chevron-right\",\n  previous: \"chevron-left\",\n  first: \"chevron-start\",\n  last: \"chevron-end\",\n};\n","/**\n * Do not edit directly\n * Generated on Tue, 12 Dec 2023 18:26:22 GMT\n */\n\nexport const calciteBorderWidthNone = \"0\";\nexport const calciteBorderWidthSm = \"1px\";\nexport const calciteBorderWidthMd = \"2px\";\nexport const calciteBorderWidthLg = \"4px\";\nexport const calciteCornerRadius = \"0\";\nexport const calciteCornerRadiusSharp = \"0\";\nexport const calciteCornerRadiusRound = \"4px\";\nexport const calciteCornerRadiusPill = \"100%\";\nexport const calciteColorBackground = {\"light\":\"#f8f8f8\",\"dark\":\"#353535\"};\nexport const calciteColorBackgroundNone = \"rgba(#ffffff, 0%)\";\nexport const calciteColorForeground1 = {\"light\":\"#ffffff\",\"dark\":\"#2b2b2b\"};\nexport const calciteColorForeground2 = {\"light\":\"#f3f3f3\",\"dark\":\"#202020\"};\nexport const calciteColorForeground3 = {\"light\":\"#eaeaea\",\"dark\":\"#151515\"};\nexport const calciteColorForegroundCurrent = {\"light\":\"#c7eaff\",\"dark\":\"#214155\"};\nexport const calciteColorTransparent = {\"light\":\"rgba(0, 0, 0, 0%)\",\"dark\":\"rgba(255, 255, 255, 0%)\"};\nexport const calciteColorTransparentHover = {\"light\":\"rgba(0, 0, 0, 4%)\",\"dark\":\"rgba(255, 255, 255, 4%)\"};\nexport const calciteColorTransparentPress = {\"light\":\"rgba(0, 0, 0, 8%)\",\"dark\":\"rgba(255, 255, 255, 8%)\"};\nexport const calciteColorTransparentScrim = {\"light\":\"rgba(255, 255, 255, 85%)\",\"dark\":\"rgba(0, 0, 0, 85%)\"};\nexport const calciteColorTransparentTint = {\"light\":\"rgba(255, 255, 255, 80%)\",\"dark\":\"rgba(43, 43, 43, 80%)\"};\nexport const calciteColorBrand = {\"light\":\"#007ac2\",\"dark\":\"#009af2\"};\nexport const calciteColorBrandHover = {\"light\":\"#00619b\",\"dark\":\"#007ac2\"};\nexport const calciteColorBrandPress = {\"light\":\"#004874\",\"dark\":\"#00619b\"};\nexport const calciteColorBrandUnderline = {\"light\":\"rgba(0, 97, 155, 40%)\",\"dark\":\"rgba(0, 160, 255, 40%)\"};\nexport const calciteColorStatusInfo = {\"light\":\"#00619b\",\"dark\":\"#00A0FF\"};\nexport const calciteColorStatusInfoHover = {\"light\":\"#004874\",\"dark\":\"#3db8ff\"};\nexport const calciteColorStatusInfoPress = {\"light\":\"#00304d\",\"dark\":\"#009af2\"};\nexport const calciteColorStatusSuccess = {\"light\":\"#35ac46\",\"dark\":\"#36DA43\"};\nexport const calciteColorStatusSuccessHover = {\"light\":\"#288835\",\"dark\":\"#3bed52\"};\nexport const calciteColorStatusSuccessPress = {\"light\":\"#1a6324\",\"dark\":\"#00b81b\"};\nexport const calciteColorStatusWarning = {\"light\":\"#edd317\",\"dark\":\"#FFC900\"};\nexport const calciteColorStatusWarningHover = {\"light\":\"#d9bc00\",\"dark\":\"#ffee33\"};\nexport const calciteColorStatusWarningPress = {\"light\":\"#bfa200\",\"dark\":\"#f5d000\"};\nexport const calciteColorStatusDanger = {\"light\":\"#d83020\",\"dark\":\"#FE583E\"};\nexport const calciteColorStatusDangerHover = {\"light\":\"#a82b1e\",\"dark\":\"#ff0015\"};\nexport const calciteColorStatusDangerPress = {\"light\":\"#7c1d13\",\"dark\":\"#d90012\"};\nexport const calciteColorInverse = {\"light\":\"#353535\",\"dark\":\"#f8f8f8\"};\nexport const calciteColorInverseHover = {\"light\":\"#2b2b2b\",\"dark\":\"#ffffff\"};\nexport const calciteColorInversePress = {\"light\":\"#202020\",\"dark\":\"#f3f3f3\"};\nexport const calciteColorText1 = {\"light\":\"#151515\",\"dark\":\"#ffffff\"};\nexport const calciteColorText2 = {\"light\":\"#4a4a4a\",\"dark\":\"#bfbfbf\"};\nexport const calciteColorText3 = {\"light\":\"#6a6a6a\",\"dark\":\"#9f9f9f\"};\nexport const calciteColorTextInverse = {\"light\":\"#ffffff\",\"dark\":\"#151515\"};\nexport const calciteColorTextLink = {\"light\":\"#00619b\",\"dark\":\"#00A0FF\"};\nexport const calciteColorBorder1 = {\"light\":\"#cacaca\",\"dark\":\"#555555\"};\nexport const calciteColorBorder2 = {\"light\":\"#d4d4d4\",\"dark\":\"#4a4a4a\"};\nexport const calciteColorBorder3 = {\"light\":\"#dfdfdf\",\"dark\":\"#404040\"};\nexport const calciteColorBorderInput = {\"light\":\"#949494\",\"dark\":\"#757575\"};\nexport const calciteColorBorderGhost = {\"light\":\"rgba(0, 0, 0, 30%)\",\"dark\":\"rgba(117, 117, 117, 30%)\"};\nexport const calciteColorBorderWhite = {\"light\":\"#ffffff\",\"dark\":\"#f8f8f8\"};\nexport const calciteContainerSizeHeightXxs = {\"min\":\"0\",\"max\":\"154px\"}; // Small handheld devices and mini-windows\nexport const calciteContainerSizeHeightXs = {\"min\":\"155px\",\"max\":\"328px\"}; // Handheld devices\nexport const calciteContainerSizeHeightSm = {\"min\":\"329px\",\"max\":\"504px\"}; // Small tablets\nexport const calciteContainerSizeHeightMd = {\"min\":\"505px\",\"max\":\"678px\"}; // Small laptops\nexport const calciteContainerSizeHeightLg = {\"min\":\"679px\",\"max\":\"854px\"}; // Large laptops and desktop computers\nexport const calciteContainerSizeHeightXl = {\"min\":\"855px\"}; // Projectors and televisions\nexport const calciteContainerSizeWidthXxs = {\"min\":\"0\",\"max\":\"320px\"}; // Small handheld devices and mini-windows\nexport const calciteContainerSizeWidthXs = {\"min\":\"321px\",\"max\":\"476px\"}; // Handheld devices\nexport const calciteContainerSizeWidthSm = {\"min\":\"477px\",\"max\":\"768px\"}; // Small tablets\nexport const calciteContainerSizeWidthMd = {\"min\":\"769px\",\"max\":\"1152px\"}; // Small laptops\nexport const calciteContainerSizeWidthLg = {\"min\":\"1153px\",\"max\":\"1440px\"}; // Large laptops and desktop computers\nexport const calciteContainerSizeWidthXl = {\"min\":\"1441px\"}; // Projectors and televisions\nexport const calciteContainerSizeMargin = \"24px\";\nexport const calciteContainerSizeGutter = \"16px\";\nexport const calciteContainerSizeContentFluid = \"100%\"; // for fluid grid widths\nexport const calciteContainerSizeContentFixed = \"1440px\"; // only for lg breakpoint fixed grid width\nexport const calciteFontFamily = \"Avenir Next LT Pro\";\nexport const calciteFontFamilyCode = \"Monaco\";\nexport const calciteFontWeightLight = \"300\"; // For Avenir Next World (secondary font family)\nexport const calciteFontWeightNormal = \"400\"; // For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word \"regular\"\nexport const calciteFontWeightRegular = \"400\";\nexport const calciteFontWeightMedium = \"500\";\nexport const calciteFontWeightSemibold = \"600\";\nexport const calciteFontWeightBold = \"700\";\nexport const calciteFontSizeXs = \"10px\";\nexport const calciteFontSizeSm = \"12px\";\nexport const calciteFontSize = \"14px\";\nexport const calciteFontSizeMd = \"16px\";\nexport const calciteFontSizeLg = \"18px\";\nexport const calciteFontSizeXl = \"20px\";\nexport const calciteFontSizeXxl = \"24px\";\nexport const calciteFontStyleEmphasis = \"italic\"; // used in ratings\nexport const calciteFontLineHeightFixedSm = \"12px\";\nexport const calciteFontLineHeightFixedBase = \"16px\";\nexport const calciteFontLineHeightFixedLg = \"20px\";\nexport const calciteFontLineHeightFixedXl = \"24px\";\nexport const calciteFontLineHeightRelative = \"auto\"; // 1\nexport const calciteFontLineHeightRelativeTight = \"125%\"; // 1.25\nexport const calciteFontLineHeightRelativeSnug = \"137.5%\"; // 1.375\nexport const calciteFontLineHeightRelativeNormal = \"150%\"; // 1.5\nexport const calciteFontLineHeightRelativeRelaxed = \"162.5%\"; // 1.625\nexport const calciteFontLineHeightRelativeLoose = \"200%\"; // 2\nexport const calciteFontLetterSpacingTight = \"-0.4\";\nexport const calciteFontLetterSpacingNormal = \"0\";\nexport const calciteFontLetterSpacingWide = \"0.4\";\nexport const calciteFontParagraphSpacingNormal = \"4px\";\nexport const calciteFontTextDecorationNone = \"none\";\nexport const calciteFontTextDecorationUnderline = \"underline\";\nexport const calciteFontTextCaseNone = \"none\";\nexport const calciteFontTextCaseUppercase = \"uppercase\";\nexport const calciteFontTextCaseLowercase = \"lowercase\";\nexport const calciteFontTextCaseCapitalize = \"capitalize\";\nexport const calciteOpacityLight = \"40%\";\nexport const calciteOpacityHalf = \"50%\";\nexport const calciteOpacityDark = \"85%\";\nexport const calciteOpacityFull = \"100%\";\nexport const calciteOpacityDisabled = \"50%\";\nexport const calciteShadowNone = {\"x\":\"0\",\"y\":\"0\",\"blur\":\"0\",\"spread\":\"0\",\"color\":\"rgba(#000000, 0%)\"};\nexport const calciteShadowSm = [{\"x\":\"0\",\"y\":\"2\",\"blur\":\"8\",\"spread\":\"0\",\"color\":\"rgba(#000000, 4%)\"},{\"x\":\"0\",\"y\":\"4\",\"blur\":\"16\",\"spread\":\"0\",\"color\":\"rgba(#000000, 8%)\"}];\nexport const calciteShadowMd = [{\"x\":\"0\",\"y\":\"4\",\"blur\":\"20\",\"spread\":\"0\",\"color\":\"rgba(#000000, 8%)\"},{\"x\":\"0\",\"y\":\"12\",\"blur\":\"32\",\"spread\":\"-2\",\"color\":\"rgba(#000000, 10%)\"}];\nexport const calciteSizePx = \"1px\";\nexport const calciteSizeXxxs = \"2px\";\nexport const calciteSizeXxs = \"4px\";\nexport const calciteSizeXs = \"6px\";\nexport const calciteSizeSm = \"8px\";\nexport const calciteSizeSmPlus = \"10px\";\nexport const calciteSizeMd = \"12px\";\nexport const calciteSizeMdPlus = \"14px\";\nexport const calciteSizeLg = \"16px\";\nexport const calciteSizeXl = \"20px\";\nexport const calciteSizeXxl = \"24px\";\nexport const calciteSizeXxxl = \"32px\";\nexport const calciteSpacingPx = \"1px\";\nexport const calciteSpacingBase = \"2px\";\nexport const calciteSpacingXxs = \"4px\";\nexport const calciteSpacingXs = \"6px\";\nexport const calciteSpacingSm = \"8px\";\nexport const calciteSpacingMd = \"12px\";\nexport const calciteSpacingLg = \"14px\";\nexport const calciteSpacingXl = \"16px\";\nexport const calciteSpacingXxl = \"20px\";\nexport const calciteSpacingXxxl = \"32px\";\nexport const calciteTypography = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyLightMinus3h = {\"fontSize\":\"10px\",\"fontWeight\":\"300\",\"lineHeight\":\"12px\"};\nexport const calciteTypographyLightMinus2h = {\"fontSize\":\"12px\",\"fontWeight\":\"300\"};\nexport const calciteTypographyLightMinus1h = {\"fontWeight\":\"300\"};\nexport const calciteTypographyLight0h = {\"fontSize\":\"16px\",\"fontWeight\":\"300\",\"lineHeight\":\"20px\"};\nexport const calciteTypographyLight1h = {\"fontSize\":\"18px\",\"fontWeight\":\"300\",\"lineHeight\":\"24px\"};\nexport const calciteTypographyRegularMinus3h = {\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyRegularMinus2h = {\"fontSize\":\"12px\"};\nexport const calciteTypographyRegularMinus1h = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyRegular0h = {\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyRegular1h = {\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyMediumMinus3h = {\"fontWeight\":\"500\",\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyMediumMinus2h = {\"fontWeight\":\"500\",\"fontSize\":\"12px\"};\nexport const calciteTypographyMediumMinus1h = {\"fontWeight\":\"500\"};\nexport const calciteTypographyMedium0h = {\"fontWeight\":\"500\",\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyMedium1h = {\"fontWeight\":\"500\",\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyBoldMinus3h = {\"fontWeight\":\"600\",\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyBoldMinus2h = {\"fontWeight\":\"600\",\"fontSize\":\"12px\"};\nexport const calciteTypographyBoldMinus1h = {\"fontWeight\":\"600\"};\nexport const calciteTypographyBold0h = {\"fontWeight\":\"600\",\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyBold1h = {\"fontWeight\":\"600\",\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapLight0 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapLight1 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapLight2 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapLight3 = {\"fontWeight\":\"300\",\"lineHeight\":\"125%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapLightMinus2 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapLightMinus1 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapRegular0 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapRegular1 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapRegular2 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapRegular3 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapRegularMinus2 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapRegularMinus1 = {\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapMedium0 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapMedium1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapMedium2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapMedium3 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapMediumMinus2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapMediumMinus1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapBold0 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapBold1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapBold2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapBold3 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapBoldMinus2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapBoldMinus1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyDisplay1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyHierarchyDisplay2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyHierarchyHeading1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyHierarchyHeading2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyHierarchyHeading3 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyHierarchyHeading4 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyHierarchyHeading5 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyBodySnug = {\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyBody = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyHierarchyOverline = {\"lineHeight\":\"12px\",\"textCase\":\"uppercase\",\"fontWeight\":\"700\"};\nexport const calciteTypographyHierarchyCaption = {\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteZIndexDeep = \"-999999\";\nexport const calciteZIndex = \"1\";\nexport const calciteZIndexSticky = \"300\";\nexport const calciteZIndexHeader = \"400\";\nexport const calciteZIndexToast = \"500\";\nexport const calciteZIndexDropdown = \"600\";\nexport const calciteZIndexOverlay = \"700\";\nexport const calciteZIndexModal = \"800\";\nexport const calciteZIndexPopup = \"900\";\nexport const calciteZIndexTooltip = \"901\";\n","import {\n  calciteContainerSizeWidthLg,\n  calciteContainerSizeWidthMd,\n  calciteContainerSizeWidthSm,\n  calciteContainerSizeWidthXs,\n  calciteContainerSizeWidthXxs,\n} from \"@esri/calcite-design-tokens/dist/es6/global\";\n\nexport interface Breakpoints {\n  width: {\n    large: number;\n    medium: number;\n    small: number;\n    xsmall: number;\n    xxsmall: number;\n  };\n}\n\n/**\n * A breakpoints lookup object.\n */\nexport const breakpoints: Breakpoints = {\n  width: {\n    large: cssLengthToNumber(calciteContainerSizeWidthLg.max),\n    medium: cssLengthToNumber(calciteContainerSizeWidthMd.max),\n    small: cssLengthToNumber(calciteContainerSizeWidthSm.max),\n    xsmall: cssLengthToNumber(calciteContainerSizeWidthXs.max),\n    xxsmall: cssLengthToNumber(calciteContainerSizeWidthXxs.max),\n  },\n};\n\nfunction cssLengthToNumber(length: string): number {\n  return parseInt(length);\n}\n",":host {\n  @apply flex;\n  writing-mode: horizontal-tb;\n}\n\n:host([scale=\"s\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-n2h h-6 px-1;\n    min-inline-size: theme(\"width.6\");\n  }\n}\n\n:host([scale=\"m\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-n1h h-8 px-2;\n    min-inline-size: theme(\"width.8\");\n  }\n}\n\n:host([scale=\"l\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-0h h-11;\n    min-inline-size: theme(\"width.11\");\n  }\n\n  & .chevron {\n    @apply px-2.5;\n  }\n\n  & .page,\n  & .ellipsis {\n    @apply px-3;\n  }\n}\n\n// focus styles\n:host button {\n  @apply focus-base;\n  &:focus {\n    @apply focus-inset;\n  }\n}\n\n.chevron,\n.page,\n.ellipsis {\n  @apply p-0\n    m-0\n    text-0h\n    text-color-3\n    font-inherit\n    box-border\n    flex\n    items-center\n    border-none\n    border-opacity-0\n    justify-center\n    align-baseline\n    bg-transparent;\n}\n\n.chevron,\n.page {\n  @apply cursor-pointer;\n  border-block: 2px solid transparent;\n\n  &:hover {\n    @apply text-color-1 transition-default;\n  }\n}\n\n.page {\n  &:hover {\n    @apply border-b-color-2;\n  }\n  &.selected {\n    @apply text-color-1 border-b-color-brand font-medium;\n  }\n}\n\n.chevron {\n  &:hover {\n    @apply bg-foreground-2;\n    color: theme(\"backgroundColor.brand\");\n  }\n  &:active {\n    @apply bg-foreground-3;\n  }\n  &.disabled {\n    @apply pointer-events-none bg-transparent;\n    & > calcite-icon {\n      @apply opacity-disabled;\n    }\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n} from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Scale } from \"../interfaces\";\nimport { PaginationMessages } from \"./assets/pagination/t9n\";\nimport { CSS, ICONS } from \"./resources\";\nimport { createObserver } from \"../../utils/observers\";\nimport { breakpoints } from \"../../utils/responsive\";\nimport { getIconScale } from \"../../utils/component\";\n\nexport interface PaginationDetail {\n  start: number;\n  totalItems: number;\n  startItem: number;\n}\n\nconst firstAndLastPageCount = 2;\nconst ellipsisCount = 2;\n\nconst maxItemBreakpoints = {\n  large: 11,\n  medium: 9,\n  small: 7,\n  xsmall: 5,\n  xxsmall: 1,\n};\n\n@Component({\n  tag: \"calcite-pagination\",\n  styleUrl: \"pagination.scss\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  assetsDirs: [\"assets\"],\n})\nexport class Pagination\n  implements LocalizedComponent, LocalizedComponent, LoadableComponent, T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, number values are displayed with a group separator corresponding to the language and country format.\n   */\n  @Prop({ reflect: true }) groupSeparator = false;\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: PaginationMessages;\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<PaginationMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /**\n   * Specifies the Unicode numeral system used by the component for localization.\n   */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /** Specifies the number of items per page. */\n  @Prop({ mutable: true, reflect: true }) pageSize = 20;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the starting item number. */\n  @Prop({ mutable: true, reflect: true }) startItem = 1;\n\n  /** Specifies the total number of items. */\n  @Prop({ reflect: true }) totalItems = 0;\n\n  @Watch(\"totalItems\")\n  @Watch(\"pageSize\")\n  handleTotalPages(): void {\n    if (this.pageSize < 1) {\n      this.pageSize = 1;\n    }\n    this.totalPages = this.totalItems / this.pageSize;\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalcitePaginationElement;\n\n  @State() defaultMessages: PaginationMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleWatcher(): void {\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n  }\n\n  @State() maxItems = maxItemBreakpoints.xxsmall;\n\n  @State() totalPages: number;\n\n  @State() lastStartItem: number;\n\n  @Watch(\"totalItems\")\n  @Watch(\"pageSize\")\n  @Watch(\"totalPages\")\n  handleLastStartItemChange(): void {\n    const { totalItems, pageSize, totalPages } = this;\n\n    this.lastStartItem =\n      (totalItems % pageSize === 0 ? totalItems - pageSize : Math.floor(totalPages) * pageSize) + 1;\n  }\n\n  @State() isXXSmall: boolean;\n\n  @Watch(\"maxItems\")\n  handleIsXXSmall(): void {\n    this.isXXSmall = this.maxItems === maxItemBreakpoints.xxsmall;\n  }\n\n  private resizeObserver = createObserver(\"resize\", (entries) =>\n    entries.forEach(this.resizeHandler)\n  );\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the selected page changes.\n   */\n  @Event({ cancelable: false }) calcitePaginationChange: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n    this.resizeObserver?.observe(this.el);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    this.handleTotalPages();\n    this.handleLastStartItemChange();\n    this.handleIsXXSmall();\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n    this.setMaxItemsToBreakpoint(this.el.clientWidth);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.el.focus();\n  }\n\n  /** Go to the next page of results. */\n  @Method()\n  async nextPage(): Promise<void> {\n    this.startItem = Math.min(this.lastStartItem, this.startItem + this.pageSize);\n  }\n\n  /** Go to the previous page of results. */\n  @Method()\n  async previousPage(): Promise<void> {\n    this.startItem = Math.max(1, this.startItem - this.pageSize);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  private setMaxItemsToBreakpoint(width: number): void {\n    if (!breakpoints || !width) {\n      return;\n    }\n\n    if (width >= breakpoints.width.medium) {\n      this.maxItems = maxItemBreakpoints.large;\n      return;\n    }\n\n    if (width >= breakpoints.width.small) {\n      this.maxItems = maxItemBreakpoints.medium;\n      return;\n    }\n\n    if (width >= breakpoints.width.xsmall) {\n      this.maxItems = maxItemBreakpoints.small;\n      return;\n    }\n\n    if (width >= breakpoints.width.xxsmall) {\n      this.maxItems = maxItemBreakpoints.xsmall;\n      return;\n    }\n\n    this.maxItems = maxItemBreakpoints.xxsmall;\n  }\n\n  private resizeHandler = ({ contentRect: { width } }: ResizeObserverEntry): void =>\n    this.setMaxItemsToBreakpoint(width);\n\n  private firstClicked = (): void => {\n    this.startItem = 1;\n    this.emitUpdate();\n  };\n\n  private lastClicked = (): void => {\n    this.startItem = this.lastStartItem;\n    this.emitUpdate();\n  };\n\n  private previousClicked = async (): Promise<void> => {\n    await this.previousPage();\n    this.emitUpdate();\n  };\n\n  private nextClicked = async (): Promise<void> => {\n    await this.nextPage();\n    this.emitUpdate();\n  };\n\n  private showStartEllipsis() {\n    return (\n      this.totalPages > this.maxItems &&\n      Math.floor(this.startItem / this.pageSize) >\n        this.maxItems - firstAndLastPageCount - ellipsisCount\n    );\n  }\n\n  private showEndEllipsis() {\n    return (\n      this.totalPages > this.maxItems &&\n      (this.totalItems - this.startItem) / this.pageSize >\n        this.maxItems - firstAndLastPageCount - (ellipsisCount - 1)\n    );\n  }\n\n  private emitUpdate() {\n    this.calcitePaginationChange.emit();\n  }\n\n  private handlePageClick = (event: Event) => {\n    const target = event.target as HTMLButtonElement;\n    this.startItem = parseInt(target.value, 10);\n    this.emitUpdate();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  renderEllipsis(type: \"start\" | \"end\"): VNode {\n    return (\n      <span class={CSS.ellipsis} data-test-ellipsis={type} key={type}>\n        &hellip;\n      </span>\n    );\n  }\n\n  renderItems(): VNode[] {\n    const { totalItems, pageSize, startItem, maxItems, totalPages, lastStartItem, isXXSmall } =\n      this;\n\n    const items: VNode[] = [];\n\n    if (isXXSmall) {\n      items.push(this.renderPage(startItem));\n      return items;\n    }\n\n    const renderFirstPage = totalItems > pageSize;\n    const renderStartEllipsis = this.showStartEllipsis();\n    const renderEndEllipsis = this.showEndEllipsis();\n\n    if (renderFirstPage) {\n      items.push(this.renderPage(1));\n    }\n\n    if (renderStartEllipsis) {\n      items.push(this.renderEllipsis(\"start\"));\n    }\n\n    const remainingItems =\n      maxItems -\n      firstAndLastPageCount -\n      (renderEndEllipsis ? 1 : 0) -\n      (renderStartEllipsis ? 1 : 0);\n\n    let end: number;\n    let nextStart: number;\n\n    // if we don't need ellipses render the whole set\n    if (totalPages - 1 <= remainingItems) {\n      nextStart = 1 + pageSize;\n      end = lastStartItem - pageSize;\n    } else {\n      // if we're within max pages of page 1\n      if (startItem / pageSize < remainingItems) {\n        nextStart = 1 + pageSize;\n        end = 1 + remainingItems * pageSize;\n      } else {\n        // if we're within max pages of last page\n        if (startItem + remainingItems * pageSize >= totalItems) {\n          nextStart = lastStartItem - remainingItems * pageSize;\n          end = lastStartItem - pageSize;\n        } else {\n          // if we're within the center pages\n          nextStart = startItem - pageSize * ((remainingItems - 1) / 2);\n          end = startItem + pageSize * ((remainingItems - 1) / 2);\n        }\n      }\n    }\n\n    for (let i = 0; i < remainingItems && nextStart <= end; i++) {\n      items.push(this.renderPage(nextStart));\n      nextStart = nextStart + pageSize;\n    }\n\n    if (renderEndEllipsis) {\n      items.push(this.renderEllipsis(\"end\"));\n    }\n\n    items.push(this.renderPage(lastStartItem));\n\n    return items;\n  }\n\n  renderPage(start: number): VNode {\n    const { pageSize } = this;\n    const page = Math.floor(start / pageSize) + (pageSize === 1 ? 0 : 1);\n\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n\n    const displayedPage = numberStringFormatter.localize(page.toString());\n    const selected = start === this.startItem;\n\n    return (\n      <button\n        aria-current={selected ? \"page\" : \"false\"}\n        class={{\n          [CSS.page]: true,\n          [CSS.selected]: selected,\n        }}\n        onClick={this.handlePageClick}\n        value={start}\n      >\n        {displayedPage}\n      </button>\n    );\n  }\n\n  renderPreviousChevron(): VNode {\n    const { pageSize, startItem, messages } = this;\n\n    const disabled = pageSize === 1 ? startItem <= pageSize : startItem < pageSize;\n\n    return (\n      <button\n        aria-label={messages.previous}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        data-test-chevron=\"previous\"\n        disabled={disabled}\n        key=\"previous\"\n        onClick={this.previousClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.previous} scale={getIconScale(this.scale)} />\n      </button>\n    );\n  }\n\n  renderNextChevron(): VNode {\n    const { totalItems, pageSize, startItem, messages } = this;\n\n    const disabled =\n      pageSize === 1 ? startItem + pageSize > totalItems : startItem + pageSize > totalItems;\n\n    return (\n      <button\n        aria-label={messages.next}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        data-test-chevron=\"next\"\n        disabled={disabled}\n        key=\"next-button\"\n        onClick={this.nextClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.next} scale={getIconScale(this.scale)} />\n      </button>\n    );\n  }\n\n  renderFirstChevron(): VNode {\n    const { messages, startItem, isXXSmall } = this;\n\n    const disabled = startItem === 1;\n\n    return isXXSmall ? (\n      <button\n        aria-label={messages.first}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        disabled={disabled}\n        key=\"first-button\"\n        onClick={this.firstClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.first} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  renderLastChevron(): VNode {\n    const { messages, startItem, isXXSmall, lastStartItem } = this;\n\n    const disabled = startItem === lastStartItem;\n\n    return isXXSmall ? (\n      <button\n        aria-label={messages.last}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        disabled={disabled}\n        key=\"last-button\"\n        onClick={this.lastClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.last} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  render(): VNode {\n    return (\n      <Fragment>\n        {this.renderFirstChevron()}\n        {this.renderPreviousChevron()}\n        {this.renderItems()}\n        {this.renderNextChevron()}\n        {this.renderLastChevron()}\n      </Fragment>\n    );\n  }\n}\n"],"version":3}
+{"file":"pagination.js","mappings":"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","names":[],"sources":["src/components/pagination/resources.ts","../calcite-design-tokens/dist/es6/global.js","src/utils/responsive.ts","src/components/pagination/pagination.scss?tag=calcite-pagination&encapsulation=shadow","src/components/pagination/pagination.tsx"],"sourcesContent":["export const CSS = {\n  page: \"page\",\n  selected: \"selected\",\n  chevron: \"chevron\",\n  disabled: \"disabled\",\n  ellipsis: \"ellipsis\",\n};\n\nexport const ICONS = {\n  next: \"chevron-right\",\n  previous: \"chevron-left\",\n  first: \"chevron-start\",\n  last: \"chevron-end\",\n};\n","/**\n * Do not edit directly\n * Generated on Wed, 13 Dec 2023 18:59:39 GMT\n */\n\nexport const calciteBorderWidthNone = \"0\";\nexport const calciteBorderWidthSm = \"1px\";\nexport const calciteBorderWidthMd = \"2px\";\nexport const calciteBorderWidthLg = \"4px\";\nexport const calciteCornerRadius = \"0\";\nexport const calciteCornerRadiusSharp = \"0\";\nexport const calciteCornerRadiusRound = \"4px\";\nexport const calciteCornerRadiusPill = \"100%\";\nexport const calciteColorBackground = {\"light\":\"#f8f8f8\",\"dark\":\"#353535\"};\nexport const calciteColorBackgroundNone = \"rgba(#ffffff, 0%)\";\nexport const calciteColorForeground1 = {\"light\":\"#ffffff\",\"dark\":\"#2b2b2b\"};\nexport const calciteColorForeground2 = {\"light\":\"#f3f3f3\",\"dark\":\"#202020\"};\nexport const calciteColorForeground3 = {\"light\":\"#eaeaea\",\"dark\":\"#151515\"};\nexport const calciteColorForegroundCurrent = {\"light\":\"#c7eaff\",\"dark\":\"#214155\"};\nexport const calciteColorTransparent = {\"light\":\"rgba(0, 0, 0, 0%)\",\"dark\":\"rgba(255, 255, 255, 0%)\"};\nexport const calciteColorTransparentHover = {\"light\":\"rgba(0, 0, 0, 4%)\",\"dark\":\"rgba(255, 255, 255, 4%)\"};\nexport const calciteColorTransparentPress = {\"light\":\"rgba(0, 0, 0, 8%)\",\"dark\":\"rgba(255, 255, 255, 8%)\"};\nexport const calciteColorTransparentScrim = {\"light\":\"rgba(255, 255, 255, 85%)\",\"dark\":\"rgba(0, 0, 0, 85%)\"};\nexport const calciteColorTransparentTint = {\"light\":\"rgba(255, 255, 255, 80%)\",\"dark\":\"rgba(43, 43, 43, 80%)\"};\nexport const calciteColorBrand = {\"light\":\"#007ac2\",\"dark\":\"#009af2\"};\nexport const calciteColorBrandHover = {\"light\":\"#00619b\",\"dark\":\"#007ac2\"};\nexport const calciteColorBrandPress = {\"light\":\"#004874\",\"dark\":\"#00619b\"};\nexport const calciteColorBrandUnderline = {\"light\":\"rgba(0, 97, 155, 40%)\",\"dark\":\"rgba(0, 160, 255, 40%)\"};\nexport const calciteColorStatusInfo = {\"light\":\"#00619b\",\"dark\":\"#00A0FF\"};\nexport const calciteColorStatusInfoHover = {\"light\":\"#004874\",\"dark\":\"#3db8ff\"};\nexport const calciteColorStatusInfoPress = {\"light\":\"#00304d\",\"dark\":\"#009af2\"};\nexport const calciteColorStatusSuccess = {\"light\":\"#35ac46\",\"dark\":\"#36DA43\"};\nexport const calciteColorStatusSuccessHover = {\"light\":\"#288835\",\"dark\":\"#3bed52\"};\nexport const calciteColorStatusSuccessPress = {\"light\":\"#1a6324\",\"dark\":\"#00b81b\"};\nexport const calciteColorStatusWarning = {\"light\":\"#edd317\",\"dark\":\"#FFC900\"};\nexport const calciteColorStatusWarningHover = {\"light\":\"#d9bc00\",\"dark\":\"#ffee33\"};\nexport const calciteColorStatusWarningPress = {\"light\":\"#bfa200\",\"dark\":\"#f5d000\"};\nexport const calciteColorStatusDanger = {\"light\":\"#d83020\",\"dark\":\"#FE583E\"};\nexport const calciteColorStatusDangerHover = {\"light\":\"#a82b1e\",\"dark\":\"#ff0015\"};\nexport const calciteColorStatusDangerPress = {\"light\":\"#7c1d13\",\"dark\":\"#d90012\"};\nexport const calciteColorInverse = {\"light\":\"#353535\",\"dark\":\"#f8f8f8\"};\nexport const calciteColorInverseHover = {\"light\":\"#2b2b2b\",\"dark\":\"#ffffff\"};\nexport const calciteColorInversePress = {\"light\":\"#202020\",\"dark\":\"#f3f3f3\"};\nexport const calciteColorText1 = {\"light\":\"#151515\",\"dark\":\"#ffffff\"};\nexport const calciteColorText2 = {\"light\":\"#4a4a4a\",\"dark\":\"#bfbfbf\"};\nexport const calciteColorText3 = {\"light\":\"#6a6a6a\",\"dark\":\"#9f9f9f\"};\nexport const calciteColorTextInverse = {\"light\":\"#ffffff\",\"dark\":\"#151515\"};\nexport const calciteColorTextLink = {\"light\":\"#00619b\",\"dark\":\"#00A0FF\"};\nexport const calciteColorBorder1 = {\"light\":\"#cacaca\",\"dark\":\"#555555\"};\nexport const calciteColorBorder2 = {\"light\":\"#d4d4d4\",\"dark\":\"#4a4a4a\"};\nexport const calciteColorBorder3 = {\"light\":\"#dfdfdf\",\"dark\":\"#404040\"};\nexport const calciteColorBorderInput = {\"light\":\"#949494\",\"dark\":\"#757575\"};\nexport const calciteColorBorderGhost = {\"light\":\"rgba(0, 0, 0, 30%)\",\"dark\":\"rgba(117, 117, 117, 30%)\"};\nexport const calciteColorBorderWhite = {\"light\":\"#ffffff\",\"dark\":\"#f8f8f8\"};\nexport const calciteContainerSizeHeightXxs = {\"min\":\"0\",\"max\":\"154px\"}; // Small handheld devices and mini-windows\nexport const calciteContainerSizeHeightXs = {\"min\":\"155px\",\"max\":\"328px\"}; // Handheld devices\nexport const calciteContainerSizeHeightSm = {\"min\":\"329px\",\"max\":\"504px\"}; // Small tablets\nexport const calciteContainerSizeHeightMd = {\"min\":\"505px\",\"max\":\"678px\"}; // Small laptops\nexport const calciteContainerSizeHeightLg = {\"min\":\"679px\",\"max\":\"854px\"}; // Large laptops and desktop computers\nexport const calciteContainerSizeHeightXl = {\"min\":\"855px\"}; // Projectors and televisions\nexport const calciteContainerSizeWidthXxs = {\"min\":\"0\",\"max\":\"320px\"}; // Small handheld devices and mini-windows\nexport const calciteContainerSizeWidthXs = {\"min\":\"321px\",\"max\":\"476px\"}; // Handheld devices\nexport const calciteContainerSizeWidthSm = {\"min\":\"477px\",\"max\":\"768px\"}; // Small tablets\nexport const calciteContainerSizeWidthMd = {\"min\":\"769px\",\"max\":\"1152px\"}; // Small laptops\nexport const calciteContainerSizeWidthLg = {\"min\":\"1153px\",\"max\":\"1440px\"}; // Large laptops and desktop computers\nexport const calciteContainerSizeWidthXl = {\"min\":\"1441px\"}; // Projectors and televisions\nexport const calciteContainerSizeMargin = \"24px\";\nexport const calciteContainerSizeGutter = \"16px\";\nexport const calciteContainerSizeContentFluid = \"100%\"; // for fluid grid widths\nexport const calciteContainerSizeContentFixed = \"1440px\"; // only for lg breakpoint fixed grid width\nexport const calciteFontFamily = \"Avenir Next LT Pro\";\nexport const calciteFontFamilyCode = \"Monaco\";\nexport const calciteFontWeightLight = \"300\"; // For Avenir Next World (secondary font family)\nexport const calciteFontWeightNormal = \"400\"; // For backwards compatibility only. This token will be removed from the published tokens in the next major in favor of the more descriptive word \"regular\"\nexport const calciteFontWeightRegular = \"400\";\nexport const calciteFontWeightMedium = \"500\";\nexport const calciteFontWeightSemibold = \"600\";\nexport const calciteFontWeightBold = \"700\";\nexport const calciteFontSizeXs = \"10px\";\nexport const calciteFontSizeSm = \"12px\";\nexport const calciteFontSize = \"14px\";\nexport const calciteFontSizeMd = \"16px\";\nexport const calciteFontSizeLg = \"18px\";\nexport const calciteFontSizeXl = \"20px\";\nexport const calciteFontSizeXxl = \"24px\";\nexport const calciteFontStyleEmphasis = \"italic\"; // used in ratings\nexport const calciteFontLineHeightFixedSm = \"12px\";\nexport const calciteFontLineHeightFixedBase = \"16px\";\nexport const calciteFontLineHeightFixedLg = \"20px\";\nexport const calciteFontLineHeightFixedXl = \"24px\";\nexport const calciteFontLineHeightRelative = \"auto\"; // 1\nexport const calciteFontLineHeightRelativeTight = \"125%\"; // 1.25\nexport const calciteFontLineHeightRelativeSnug = \"137.5%\"; // 1.375\nexport const calciteFontLineHeightRelativeNormal = \"150%\"; // 1.5\nexport const calciteFontLineHeightRelativeRelaxed = \"162.5%\"; // 1.625\nexport const calciteFontLineHeightRelativeLoose = \"200%\"; // 2\nexport const calciteFontLetterSpacingTight = \"-0.4\";\nexport const calciteFontLetterSpacingNormal = \"0\";\nexport const calciteFontLetterSpacingWide = \"0.4\";\nexport const calciteFontParagraphSpacingNormal = \"4px\";\nexport const calciteFontTextDecorationNone = \"none\";\nexport const calciteFontTextDecorationUnderline = \"underline\";\nexport const calciteFontTextCaseNone = \"none\";\nexport const calciteFontTextCaseUppercase = \"uppercase\";\nexport const calciteFontTextCaseLowercase = \"lowercase\";\nexport const calciteFontTextCaseCapitalize = \"capitalize\";\nexport const calciteOpacityLight = \"40%\";\nexport const calciteOpacityHalf = \"50%\";\nexport const calciteOpacityDark = \"85%\";\nexport const calciteOpacityFull = \"100%\";\nexport const calciteOpacityDisabled = \"50%\";\nexport const calciteShadowNone = {\"x\":\"0\",\"y\":\"0\",\"blur\":\"0\",\"spread\":\"0\",\"color\":\"rgba(#000000, 0%)\"};\nexport const calciteShadowSm = [{\"x\":\"0\",\"y\":\"2\",\"blur\":\"8\",\"spread\":\"0\",\"color\":\"rgba(#000000, 4%)\"},{\"x\":\"0\",\"y\":\"4\",\"blur\":\"16\",\"spread\":\"0\",\"color\":\"rgba(#000000, 8%)\"}];\nexport const calciteShadowMd = [{\"x\":\"0\",\"y\":\"4\",\"blur\":\"20\",\"spread\":\"0\",\"color\":\"rgba(#000000, 8%)\"},{\"x\":\"0\",\"y\":\"12\",\"blur\":\"32\",\"spread\":\"-2\",\"color\":\"rgba(#000000, 10%)\"}];\nexport const calciteSizePx = \"1px\";\nexport const calciteSizeXxxs = \"2px\";\nexport const calciteSizeXxs = \"4px\";\nexport const calciteSizeXs = \"6px\";\nexport const calciteSizeSm = \"8px\";\nexport const calciteSizeSmPlus = \"10px\";\nexport const calciteSizeMd = \"12px\";\nexport const calciteSizeMdPlus = \"14px\";\nexport const calciteSizeLg = \"16px\";\nexport const calciteSizeXl = \"20px\";\nexport const calciteSizeXxl = \"24px\";\nexport const calciteSizeXxxl = \"32px\";\nexport const calciteSpacingPx = \"1px\";\nexport const calciteSpacingBase = \"2px\";\nexport const calciteSpacingXxs = \"4px\";\nexport const calciteSpacingXs = \"6px\";\nexport const calciteSpacingSm = \"8px\";\nexport const calciteSpacingMd = \"12px\";\nexport const calciteSpacingLg = \"14px\";\nexport const calciteSpacingXl = \"16px\";\nexport const calciteSpacingXxl = \"20px\";\nexport const calciteSpacingXxxl = \"32px\";\nexport const calciteTypography = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyLightMinus3h = {\"fontSize\":\"10px\",\"fontWeight\":\"300\",\"lineHeight\":\"12px\"};\nexport const calciteTypographyLightMinus2h = {\"fontSize\":\"12px\",\"fontWeight\":\"300\"};\nexport const calciteTypographyLightMinus1h = {\"fontWeight\":\"300\"};\nexport const calciteTypographyLight0h = {\"fontSize\":\"16px\",\"fontWeight\":\"300\",\"lineHeight\":\"20px\"};\nexport const calciteTypographyLight1h = {\"fontSize\":\"18px\",\"fontWeight\":\"300\",\"lineHeight\":\"24px\"};\nexport const calciteTypographyRegularMinus3h = {\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyRegularMinus2h = {\"fontSize\":\"12px\"};\nexport const calciteTypographyRegularMinus1h = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyRegular0h = {\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyRegular1h = {\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyMediumMinus3h = {\"fontWeight\":\"500\",\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyMediumMinus2h = {\"fontWeight\":\"500\",\"fontSize\":\"12px\"};\nexport const calciteTypographyMediumMinus1h = {\"fontWeight\":\"500\"};\nexport const calciteTypographyMedium0h = {\"fontWeight\":\"500\",\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyMedium1h = {\"fontWeight\":\"500\",\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyBoldMinus3h = {\"fontWeight\":\"600\",\"lineHeight\":\"12px\",\"fontSize\":\"10px\"};\nexport const calciteTypographyBoldMinus2h = {\"fontWeight\":\"600\",\"fontSize\":\"12px\"};\nexport const calciteTypographyBoldMinus1h = {\"fontWeight\":\"600\"};\nexport const calciteTypographyBold0h = {\"fontWeight\":\"600\",\"lineHeight\":\"20px\",\"fontSize\":\"16px\"};\nexport const calciteTypographyBold1h = {\"fontWeight\":\"600\",\"lineHeight\":\"24px\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapLight0 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapLight1 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapLight2 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapLight3 = {\"fontWeight\":\"300\",\"lineHeight\":\"125%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapLightMinus2 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapLightMinus1 = {\"fontWeight\":\"300\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapRegular0 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapRegular1 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapRegular2 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapRegular3 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapRegularMinus2 = {\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapRegularMinus1 = {\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapMedium0 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapMedium1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapMedium2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapMedium3 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapMediumMinus2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapMediumMinus1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyWrapBold0 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyWrapBold1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyWrapBold2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyWrapBold3 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyWrapBoldMinus2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteTypographyWrapBoldMinus1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyDisplay1 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyHierarchyDisplay2 = {\"fontWeight\":\"600\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyHierarchyHeading1 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"24px\"};\nexport const calciteTypographyHierarchyHeading2 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"20px\"};\nexport const calciteTypographyHierarchyHeading3 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"18px\"};\nexport const calciteTypographyHierarchyHeading4 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\",\"fontSize\":\"16px\"};\nexport const calciteTypographyHierarchyHeading5 = {\"fontWeight\":\"500\",\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyBodySnug = {\"lineHeight\":\"137.5%\"};\nexport const calciteTypographyHierarchyBody = {\"fontFamily\":\"Avenir Next LT Pro\",\"fontSize\":\"14px\",\"fontWeight\":\"400\",\"letterSpacing\":\"0\",\"lineHeight\":\"16px\",\"paragraphSpacing\":\"4px\",\"textCase\":\"none\",\"textDecoration\":\"none\"};\nexport const calciteTypographyHierarchyOverline = {\"lineHeight\":\"12px\",\"textCase\":\"uppercase\",\"fontWeight\":\"700\"};\nexport const calciteTypographyHierarchyCaption = {\"lineHeight\":\"137.5%\",\"fontSize\":\"12px\"};\nexport const calciteZIndexDeep = \"-999999\";\nexport const calciteZIndex = \"1\";\nexport const calciteZIndexSticky = \"300\";\nexport const calciteZIndexHeader = \"400\";\nexport const calciteZIndexToast = \"500\";\nexport const calciteZIndexDropdown = \"600\";\nexport const calciteZIndexOverlay = \"700\";\nexport const calciteZIndexModal = \"800\";\nexport const calciteZIndexPopup = \"900\";\nexport const calciteZIndexTooltip = \"901\";\n","import {\n  calciteContainerSizeWidthLg,\n  calciteContainerSizeWidthMd,\n  calciteContainerSizeWidthSm,\n  calciteContainerSizeWidthXs,\n  calciteContainerSizeWidthXxs,\n} from \"@esri/calcite-design-tokens/dist/es6/global\";\n\nexport interface Breakpoints {\n  width: {\n    large: number;\n    medium: number;\n    small: number;\n    xsmall: number;\n    xxsmall: number;\n  };\n}\n\n/**\n * A breakpoints lookup object.\n */\nexport const breakpoints: Breakpoints = {\n  width: {\n    large: cssLengthToNumber(calciteContainerSizeWidthLg.max),\n    medium: cssLengthToNumber(calciteContainerSizeWidthMd.max),\n    small: cssLengthToNumber(calciteContainerSizeWidthSm.max),\n    xsmall: cssLengthToNumber(calciteContainerSizeWidthXs.max),\n    xxsmall: cssLengthToNumber(calciteContainerSizeWidthXxs.max),\n  },\n};\n\nfunction cssLengthToNumber(length: string): number {\n  return parseInt(length);\n}\n",":host {\n  @apply flex;\n  writing-mode: horizontal-tb;\n}\n\n:host([scale=\"s\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-n2h h-6 px-1;\n    min-inline-size: theme(\"width.6\");\n  }\n}\n\n:host([scale=\"m\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-n1h h-8 px-2;\n    min-inline-size: theme(\"width.8\");\n  }\n}\n\n:host([scale=\"l\"]) {\n  & .chevron,\n  & .page,\n  & .ellipsis {\n    @apply text-0h h-11;\n    min-inline-size: theme(\"width.11\");\n  }\n\n  & .chevron {\n    @apply px-2.5;\n  }\n\n  & .page,\n  & .ellipsis {\n    @apply px-3;\n  }\n}\n\n// focus styles\n:host button {\n  @apply focus-base;\n  &:focus {\n    @apply focus-inset;\n  }\n}\n\n.chevron,\n.page,\n.ellipsis {\n  @apply p-0\n    m-0\n    text-0h\n    text-color-3\n    font-inherit\n    box-border\n    flex\n    items-center\n    border-none\n    border-opacity-0\n    justify-center\n    align-baseline\n    bg-transparent;\n}\n\n.chevron,\n.page {\n  @apply cursor-pointer;\n  border-block: 2px solid transparent;\n\n  &:hover {\n    @apply text-color-1 transition-default;\n  }\n}\n\n.page {\n  &:hover {\n    @apply border-b-color-2;\n  }\n  &.selected {\n    @apply text-color-1 border-b-color-brand font-medium;\n  }\n}\n\n.chevron {\n  &:hover {\n    @apply bg-foreground-2;\n    color: theme(\"backgroundColor.brand\");\n  }\n  &:active {\n    @apply bg-foreground-3;\n  }\n  &.disabled {\n    @apply pointer-events-none bg-transparent;\n    & > calcite-icon {\n      @apply opacity-disabled;\n    }\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Fragment,\n  h,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport {\n  connectLocalized,\n  disconnectLocalized,\n  LocalizedComponent,\n  NumberingSystem,\n  numberStringFormatter,\n} from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Scale } from \"../interfaces\";\nimport { PaginationMessages } from \"./assets/pagination/t9n\";\nimport { CSS, ICONS } from \"./resources\";\nimport { createObserver } from \"../../utils/observers\";\nimport { breakpoints } from \"../../utils/responsive\";\nimport { getIconScale } from \"../../utils/component\";\n\nexport interface PaginationDetail {\n  start: number;\n  totalItems: number;\n  startItem: number;\n}\n\nconst firstAndLastPageCount = 2;\nconst ellipsisCount = 2;\n\nconst maxItemBreakpoints = {\n  large: 11,\n  medium: 9,\n  small: 7,\n  xsmall: 5,\n  xxsmall: 1,\n};\n\n@Component({\n  tag: \"calcite-pagination\",\n  styleUrl: \"pagination.scss\",\n  shadow: {\n    delegatesFocus: true,\n  },\n  assetsDirs: [\"assets\"],\n})\nexport class Pagination\n  implements LocalizedComponent, LocalizedComponent, LoadableComponent, T9nComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Public Properties\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * When `true`, number values are displayed with a group separator corresponding to the language and country format.\n   */\n  @Prop({ reflect: true }) groupSeparator = false;\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: PaginationMessages;\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<PaginationMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  /**\n   * Specifies the Unicode numeral system used by the component for localization.\n   */\n  @Prop() numberingSystem: NumberingSystem;\n\n  /** Specifies the number of items per page. */\n  @Prop({ mutable: true, reflect: true }) pageSize = 20;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the starting item number. */\n  @Prop({ mutable: true, reflect: true }) startItem = 1;\n\n  /** Specifies the total number of items. */\n  @Prop({ reflect: true }) totalItems = 0;\n\n  @Watch(\"totalItems\")\n  @Watch(\"pageSize\")\n  handleTotalPages(): void {\n    if (this.pageSize < 1) {\n      this.pageSize = 1;\n    }\n    this.totalPages = this.totalItems / this.pageSize;\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Properties\n  //\n  // --------------------------------------------------------------------------\n\n  @Element() el: HTMLCalcitePaginationElement;\n\n  @State() defaultMessages: PaginationMessages;\n\n  @State() effectiveLocale = \"\";\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleWatcher(): void {\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n  }\n\n  @State() maxItems = maxItemBreakpoints.xxsmall;\n\n  @State() totalPages: number;\n\n  @State() lastStartItem: number;\n\n  @Watch(\"totalItems\")\n  @Watch(\"pageSize\")\n  @Watch(\"totalPages\")\n  handleLastStartItemChange(): void {\n    const { totalItems, pageSize, totalPages } = this;\n\n    this.lastStartItem =\n      (totalItems % pageSize === 0 ? totalItems - pageSize : Math.floor(totalPages) * pageSize) + 1;\n  }\n\n  @State() isXXSmall: boolean;\n\n  @Watch(\"maxItems\")\n  handleIsXXSmall(): void {\n    this.isXXSmall = this.maxItems === maxItemBreakpoints.xxsmall;\n  }\n\n  private resizeObserver = createObserver(\"resize\", (entries) =>\n    entries.forEach(this.resizeHandler)\n  );\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /**\n   * Emits when the selected page changes.\n   */\n  @Event({ cancelable: false }) calcitePaginationChange: EventEmitter<void>;\n\n  // --------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  // --------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n    this.resizeObserver?.observe(this.el);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    await setUpMessages(this);\n    setUpLoadableComponent(this);\n    this.handleTotalPages();\n    this.handleLastStartItemChange();\n    this.handleIsXXSmall();\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n    this.setMaxItemsToBreakpoint(this.el.clientWidth);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n    this.resizeObserver?.disconnect();\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  // --------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n    this.el.focus();\n  }\n\n  /** Go to the next page of results. */\n  @Method()\n  async nextPage(): Promise<void> {\n    this.startItem = Math.min(this.lastStartItem, this.startItem + this.pageSize);\n  }\n\n  /** Go to the previous page of results. */\n  @Method()\n  async previousPage(): Promise<void> {\n    this.startItem = Math.max(1, this.startItem - this.pageSize);\n  }\n\n  // --------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  // --------------------------------------------------------------------------\n\n  private setMaxItemsToBreakpoint(width: number): void {\n    if (!breakpoints || !width) {\n      return;\n    }\n\n    if (width >= breakpoints.width.medium) {\n      this.maxItems = maxItemBreakpoints.large;\n      return;\n    }\n\n    if (width >= breakpoints.width.small) {\n      this.maxItems = maxItemBreakpoints.medium;\n      return;\n    }\n\n    if (width >= breakpoints.width.xsmall) {\n      this.maxItems = maxItemBreakpoints.small;\n      return;\n    }\n\n    if (width >= breakpoints.width.xxsmall) {\n      this.maxItems = maxItemBreakpoints.xsmall;\n      return;\n    }\n\n    this.maxItems = maxItemBreakpoints.xxsmall;\n  }\n\n  private resizeHandler = ({ contentRect: { width } }: ResizeObserverEntry): void =>\n    this.setMaxItemsToBreakpoint(width);\n\n  private firstClicked = (): void => {\n    this.startItem = 1;\n    this.emitUpdate();\n  };\n\n  private lastClicked = (): void => {\n    this.startItem = this.lastStartItem;\n    this.emitUpdate();\n  };\n\n  private previousClicked = async (): Promise<void> => {\n    await this.previousPage();\n    this.emitUpdate();\n  };\n\n  private nextClicked = async (): Promise<void> => {\n    await this.nextPage();\n    this.emitUpdate();\n  };\n\n  private showStartEllipsis() {\n    return (\n      this.totalPages > this.maxItems &&\n      Math.floor(this.startItem / this.pageSize) >\n        this.maxItems - firstAndLastPageCount - ellipsisCount\n    );\n  }\n\n  private showEndEllipsis() {\n    return (\n      this.totalPages > this.maxItems &&\n      (this.totalItems - this.startItem) / this.pageSize >\n        this.maxItems - firstAndLastPageCount - (ellipsisCount - 1)\n    );\n  }\n\n  private emitUpdate() {\n    this.calcitePaginationChange.emit();\n  }\n\n  private handlePageClick = (event: Event) => {\n    const target = event.target as HTMLButtonElement;\n    this.startItem = parseInt(target.value, 10);\n    this.emitUpdate();\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Render Methods\n  //\n  //--------------------------------------------------------------------------\n\n  renderEllipsis(type: \"start\" | \"end\"): VNode {\n    return (\n      <span class={CSS.ellipsis} data-test-ellipsis={type} key={type}>\n        &hellip;\n      </span>\n    );\n  }\n\n  renderItems(): VNode[] {\n    const { totalItems, pageSize, startItem, maxItems, totalPages, lastStartItem, isXXSmall } =\n      this;\n\n    const items: VNode[] = [];\n\n    if (isXXSmall) {\n      items.push(this.renderPage(startItem));\n      return items;\n    }\n\n    const renderFirstPage = totalItems > pageSize;\n    const renderStartEllipsis = this.showStartEllipsis();\n    const renderEndEllipsis = this.showEndEllipsis();\n\n    if (renderFirstPage) {\n      items.push(this.renderPage(1));\n    }\n\n    if (renderStartEllipsis) {\n      items.push(this.renderEllipsis(\"start\"));\n    }\n\n    const remainingItems =\n      maxItems -\n      firstAndLastPageCount -\n      (renderEndEllipsis ? 1 : 0) -\n      (renderStartEllipsis ? 1 : 0);\n\n    let end: number;\n    let nextStart: number;\n\n    // if we don't need ellipses render the whole set\n    if (totalPages - 1 <= remainingItems) {\n      nextStart = 1 + pageSize;\n      end = lastStartItem - pageSize;\n    } else {\n      // if we're within max pages of page 1\n      if (startItem / pageSize < remainingItems) {\n        nextStart = 1 + pageSize;\n        end = 1 + remainingItems * pageSize;\n      } else {\n        // if we're within max pages of last page\n        if (startItem + remainingItems * pageSize >= totalItems) {\n          nextStart = lastStartItem - remainingItems * pageSize;\n          end = lastStartItem - pageSize;\n        } else {\n          // if we're within the center pages\n          nextStart = startItem - pageSize * ((remainingItems - 1) / 2);\n          end = startItem + pageSize * ((remainingItems - 1) / 2);\n        }\n      }\n    }\n\n    for (let i = 0; i < remainingItems && nextStart <= end; i++) {\n      items.push(this.renderPage(nextStart));\n      nextStart = nextStart + pageSize;\n    }\n\n    if (renderEndEllipsis) {\n      items.push(this.renderEllipsis(\"end\"));\n    }\n\n    items.push(this.renderPage(lastStartItem));\n\n    return items;\n  }\n\n  renderPage(start: number): VNode {\n    const { pageSize } = this;\n    const page = Math.floor(start / pageSize) + (pageSize === 1 ? 0 : 1);\n\n    numberStringFormatter.numberFormatOptions = {\n      locale: this.effectiveLocale,\n      numberingSystem: this.numberingSystem,\n      useGrouping: this.groupSeparator,\n    };\n\n    const displayedPage = numberStringFormatter.localize(page.toString());\n    const selected = start === this.startItem;\n\n    return (\n      <button\n        aria-current={selected ? \"page\" : \"false\"}\n        class={{\n          [CSS.page]: true,\n          [CSS.selected]: selected,\n        }}\n        onClick={this.handlePageClick}\n        value={start}\n      >\n        {displayedPage}\n      </button>\n    );\n  }\n\n  renderPreviousChevron(): VNode {\n    const { pageSize, startItem, messages } = this;\n\n    const disabled = pageSize === 1 ? startItem <= pageSize : startItem < pageSize;\n\n    return (\n      <button\n        aria-label={messages.previous}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        data-test-chevron=\"previous\"\n        disabled={disabled}\n        key=\"previous\"\n        onClick={this.previousClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.previous} scale={getIconScale(this.scale)} />\n      </button>\n    );\n  }\n\n  renderNextChevron(): VNode {\n    const { totalItems, pageSize, startItem, messages } = this;\n\n    const disabled =\n      pageSize === 1 ? startItem + pageSize > totalItems : startItem + pageSize > totalItems;\n\n    return (\n      <button\n        aria-label={messages.next}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        data-test-chevron=\"next\"\n        disabled={disabled}\n        key=\"next-button\"\n        onClick={this.nextClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.next} scale={getIconScale(this.scale)} />\n      </button>\n    );\n  }\n\n  renderFirstChevron(): VNode {\n    const { messages, startItem, isXXSmall } = this;\n\n    const disabled = startItem === 1;\n\n    return isXXSmall ? (\n      <button\n        aria-label={messages.first}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        disabled={disabled}\n        key=\"first-button\"\n        onClick={this.firstClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.first} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  renderLastChevron(): VNode {\n    const { messages, startItem, isXXSmall, lastStartItem } = this;\n\n    const disabled = startItem === lastStartItem;\n\n    return isXXSmall ? (\n      <button\n        aria-label={messages.last}\n        class={{\n          [CSS.chevron]: true,\n          [CSS.disabled]: disabled,\n        }}\n        disabled={disabled}\n        key=\"last-button\"\n        onClick={this.lastClicked}\n      >\n        <calcite-icon flipRtl icon={ICONS.last} scale={getIconScale(this.scale)} />\n      </button>\n    ) : null;\n  }\n\n  render(): VNode {\n    return (\n      <Fragment>\n        {this.renderFirstChevron()}\n        {this.renderPreviousChevron()}\n        {this.renderItems()}\n        {this.renderNextChevron()}\n        {this.renderLastChevron()}\n      </Fragment>\n    );\n  }\n}\n"],"version":3}

package/dist/components/panel.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
 import { d as slotChangeHasAssignedElement, s as slotChangeGetAssignedElements, f as focusFirstTabbable, t as toAriaBoolean } from './dom.js';

package/dist/components/pick-list-item.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, createEvent, h, Fragment } from '@stencil/core/internal/client';
 import { c as connectConditionalSlotComponent, d as disconnectConditionalSlotComponent } from './conditionalSlot.js';

package/dist/components/pl.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/popover.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } from '@stencil/core/internal/client';
 import { f as filterComputedPlacements, c as connectFloatingUI, d as defaultOffsetDistance, a as disconnectFloatingUI, r as reposition, F as FloatingCSS } from './floating-ui.js';

package/dist/components/progress.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { a as getElementDir } from './dom.js';

package/dist/components/pt-br.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/pt.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/resources.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 const autoMode = "calcite-mode-auto";
 const darkMode = "calcite-mode-dark";

package/dist/components/resources2.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 var KindIcons;
 (function (KindIcons) {

package/dist/components/resources3.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 const CSS = {
     container: "container",

package/dist/components/resources4.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 const CSS = {
     sticky: "sticky-pos",

package/dist/components/resources5.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 const CSS = {
     heading: "heading",

package/dist/components/ro.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/ru.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { d as dayjs } from './calcite-input-time-picker.js';
 

package/dist/components/scrim.js

@@ -1,7 +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.1.0-next.6
+ * v2.1.0-next.7
  */
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { c as connectLocalized, d as disconnectLocalized } from './locale.js';