@esri/calcite-components 1.0.0-next.674 → 1.0.0-next.676

package/dist/extras/docs-json.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2022-12-13T22:44:50",
+  "timestamp": "2022-12-14T17:00:18",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.20.0",
@@ -14370,38 +14370,11 @@
       "docs": "The `calcite-loader` component can act as a determinate or indeterminate loading indicator.",
       "docsTags": [],
       "usage": {
-        "Basic": "You can use the `active` attribute to toggle visibility:\n\n```html\n<calcite-loader text=\"Fetching data...\" active></calcite-loader>\n```\n",
+        "Basic": "You can use the `active` attribute to toggle visibility:\n\n```html\n<calcite-loader text=\"Fetching data...\"></calcite-loader>\n```\n",
         "Compact": "For instances when you don't have room for the full loader, you can use the smaller `inline` version of the loader. The inline version is meant to sit to the left of text:\n\n```html\n<p><calcite-loader inline></calcite-loader> Inline loader</p>\n```\n",
-        "Determinate": "If you can calculate your progress, it's best to use the determinate version of the loader. Update the `value` of the element when progress is made. This will display a progress bar along the perimeter of the loader showing 32% complete:\n\n```html\n<calcite-loader type=\"determinate\" value=\"32\" active></calcite-loader>\n```\n"
+        "Determinate": "If you can calculate your progress, it's best to use the determinate version of the loader. Update the `value` of the element when progress is made. This will display a progress bar along the perimeter of the loader showing 32% complete:\n\n```html\n<calcite-loader type=\"determinate\" value=\"32\"></calcite-loader>\n```\n"
       },
       "props": [
-        {
-          "name": "active",
-          "type": "boolean",
-          "mutable": false,
-          "attr": "active",
-          "reflectToAttr": true,
-          "docs": "When `true`, the component is active.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "use global `hidden` attribute instead."
-            },
-            {
-              "name": "mdn",
-              "text": "[hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)"
-            }
-          ],
-          "default": "false",
-          "deprecation": "use global `hidden` attribute instead.",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "inline",
           "type": "boolean",
@@ -14435,29 +14408,6 @@
           "optional": false,
           "required": true
         },
-        {
-          "name": "noPadding",
-          "type": "boolean",
-          "mutable": false,
-          "attr": "no-padding",
-          "reflectToAttr": true,
-          "docs": "Disables spacing around the component.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "Use `--calcite-loader-padding` CSS variable instead."
-            }
-          ],
-          "default": "false",
-          "deprecation": "Use `--calcite-loader-padding` CSS variable instead.",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "scale",
           "type": "\"l\" | \"m\" | \"s\"",
@@ -14549,6 +14499,11 @@
           "annotation": "prop",
           "docs": "Specifies the font size of the loading percentage when type is `\"determinate\"`."
         },
+        {
+          "name": "--calcite-loader-padding",
+          "annotation": "prop",
+          "docs": "Specifies the padding of the loader."
+        },
         {
           "name": "--calcite-loader-size",
           "annotation": "prop",
@@ -14557,7 +14512,7 @@
         {
           "name": "--calcite-loader-size-inline",
           "annotation": "prop",
-          "docs": "The width and height of an inline loader."
+          "docs": "The width and height of an inline loader"
         }
       ],
       "slots": [],
@@ -14617,34 +14572,11 @@
         }
       ],
       "usage": {
-        "Basic": "Customize the modal by passing your content into multiple named slots: `header` (title-area of the modal), `content` (main body of the modal), and up to three modal actions: primary, secondary, and back. Notice below we use the `aria-labelledby` attribute, relating it to the title of the modal. In order to ensure good accessibility, it's recommended that you use either an `aria-label` or `aria-labelledby` attribute so screen readers can infer what the subject matter of your modal is.\n\n```html\n<calcite-modal aria-labelledby=\"modal-title\" active>\n  <h3 slot=\"header\" id=\"modal-title\">Title of the modal</h3>\n  <div slot=\"content\">The actual content of the modal</div>\n  <calcite-button slot=\"back\" color=\"neutral\" appearance=\"outline\" icon=\"chevron-left\" width=\"full\">\n    Back\n  </calcite-button>\n  <calcite-button slot=\"secondary\" width=\"full\" appearance=\"outline\"> Cancel </calcite-button>\n  <calcite-button slot=\"primary\" width=\"full\"> Save </calcite-button>\n</calcite-modal>\n```\n",
-        "Open": "To open a modal, add the `active` prop. Once the opening animation is complete, the `calciteModalOpen` event will be fired.\n\nTo close the modal, simply remove the attribute. This will run your before close method (if provided, see below) and fire the `calciteModalClose` event after the animation and teardown is complete.\n\n```html\n<calcite-modal active></calcite-modal>\n```\n",
+        "Basic": "Customize the modal by passing your content into multiple named slots: `header` (title-area of the modal), `content` (main body of the modal), and up to three modal actions: primary, secondary, and back. Notice below we use the `aria-labelledby` attribute, relating it to the title of the modal. In order to ensure good accessibility, it's recommended that you use either an `aria-label` or `aria-labelledby` attribute so screen readers can infer what the subject matter of your modal is.\n\n```html\n<calcite-modal aria-labelledby=\"modal-title\" open>\n  <h3 slot=\"header\" id=\"modal-title\">Title of the modal</h3>\n  <div slot=\"content\">The actual content of the modal</div>\n  <calcite-button slot=\"back\" color=\"neutral\" appearance=\"outline\" icon=\"chevron-left\" width=\"full\">\n    Back\n  </calcite-button>\n  <calcite-button slot=\"secondary\" width=\"full\" appearance=\"outline\"> Cancel </calcite-button>\n  <calcite-button slot=\"primary\" width=\"full\"> Save </calcite-button>\n</calcite-modal>\n```\n",
+        "Open": "To open a modal, add the `active` prop. Once the opening animation is complete, the `calciteModalOpen` event will be fired.\n\nTo close the modal, simply remove the attribute. This will run your before close method (if provided, see below) and fire the `calciteModalClose` event after the animation and teardown is complete.\n\n```html\n<calcite-modal open></calcite-modal>\n```\n",
         "Reacting-before-close": "If you'd like to perform some actions prior to closing (ie. warning users they will lose their changes) you can pass a function to the `beforeClose` property. This method will be called prior to close and should return a [`Promise`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise):\n\n```js\nfunction beforeClose() {\n  return new Promise((resolve) => {\n    // do something async\n    resolve(); // this will trigger the close animation\n  });\n}\n\nconst modal = document.getElementById(\"my-modal\");\nmodal.beforeClose = beforeClose;\n```\n"
       },
       "props": [
-        {
-          "name": "active",
-          "type": "boolean",
-          "mutable": true,
-          "attr": "active",
-          "reflectToAttr": true,
-          "docs": "When `true`, the component is active.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "use `open` instead."
-            }
-          ],
-          "default": "false",
-          "deprecation": "use `open` instead.",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "backgroundColor",
           "type": "\"grey\" | \"white\"",
@@ -14821,29 +14753,6 @@
           "optional": false,
           "required": false
         },
-        {
-          "name": "noPadding",
-          "type": "boolean",
-          "mutable": false,
-          "attr": "no-padding",
-          "reflectToAttr": true,
-          "docs": "When `true`, disables spacing to the content area slot.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "Use `--calcite-modal-padding` CSS variable instead."
-            }
-          ],
-          "default": "false",
-          "deprecation": "Use `--calcite-modal-padding` CSS variable instead.",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "open",
           "type": "boolean",
@@ -14918,27 +14827,6 @@
         }
       ],
       "methods": [
-        {
-          "name": "focusElement",
-          "returns": {
-            "type": "Promise<void>",
-            "docs": ""
-          },
-          "signature": "focusElement(el?: HTMLElement) => Promise<void>",
-          "parameters": [],
-          "docs": "Focus the first interactive element.",
-          "docsTags": [
-            {
-              "name": "param",
-              "text": "el"
-            },
-            {
-              "name": "deprecated",
-              "text": "use `setFocus` instead."
-            }
-          ],
-          "deprecation": "use `setFocus` instead."
-        },
         {
           "name": "scrollContent",
           "returns": {
@@ -15023,25 +14911,10 @@
         }
       ],
       "styles": [
-        {
-          "name": "--calcite-modal-content-text",
-          "annotation": "prop",
-          "docs": "[Deprecated] The component content's font size."
-        },
         {
           "name": "--calcite-modal-padding",
           "annotation": "prop",
-          "docs": "[Deprecated] The padding around content area slot."
-        },
-        {
-          "name": "--calcite-modal-padding-large",
-          "annotation": "prop",
-          "docs": "[Deprecated] The left/right padding around items within the component."
-        },
-        {
-          "name": "--calcite-modal-title-text",
-          "annotation": "prop",
-          "docs": "[Deprecated] The component title's font size."
+          "docs": "Specifies the padding of the modal."
         },
         {
           "name": "--calcite-scrim-background",
@@ -15827,21 +15700,6 @@
               "text": "[PaginationDetail](https://github.com/Esri/calcite-components/blob/master/src/components/pagination/pagination.tsx#L23)"
             }
           ]
-        },
-        {
-          "event": "calcitePaginationUpdate",
-          "detail": "PaginationDetail",
-          "bubbles": true,
-          "cancelable": false,
-          "composed": true,
-          "docs": "Emits when the selected page changes.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "use calcitePaginationChange instead"
-            }
-          ],
-          "deprecation": "use calcitePaginationChange instead"
         }
       ],
       "listeners": [],

package/dist/loader/cdn.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.674
+ * v1.0.0-next.676
  */
 module.exports = require('../cjs/loader.cjs.js');
 module.exports.applyPolyfills = function() { return Promise.resolve() };

package/dist/loader/index.cjs.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.674
+ * v1.0.0-next.676
  */
 module.exports = require('../cjs/loader.cjs.js');
 module.exports.applyPolyfills = function() { return Promise.resolve() };

package/dist/loader/index.es2017.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.674
+ * v1.0.0-next.676
  */
 export * from '../esm/polyfills/index.js';
 export * from '../esm/loader.js';

package/dist/loader/index.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.674
+ * v1.0.0-next.676
  */
 (function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
 export * from '../esm/polyfills/index.js';

package/dist/types/components/loader/loader.d.ts

@@ -2,13 +2,6 @@ import { VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 export declare class Loader {
   el: HTMLCalciteLoaderElement;
-  /**
-   * When `true`, the component is active.
-   *
-   * @deprecated use global `hidden` attribute instead.
-   * @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
-   */
-  active: boolean;
   /** When `true`, displays smaller and appears to the left of the text. */
   inline: boolean;
   /** Accessible name for the component. */
@@ -26,12 +19,6 @@ export declare class Loader {
   value: number;
   /** Text that displays under the component's indicator. */
   text: string;
-  /**
-   * Disables spacing around the component.
-   *
-   * @deprecated Use `--calcite-loader-padding` CSS variable instead.
-   */
-  noPadding: boolean;
   render(): VNode;
   /**
    * Return the proper sizes based on the scale property

package/dist/types/components/modal/modal.d.ts

@@ -14,12 +14,6 @@ import { LoadableComponent } from "../../utils/loadable";
  */
 export declare class Modal implements ConditionalSlotComponent, OpenCloseComponent, FocusTrapComponent, LoadableComponent {
   el: HTMLCalciteModalElement;
-  /**
-   * When `true`, the component is active.
-   *
-   * @deprecated use `open` instead.
-   */
-  active: boolean;
   /** When `true`, displays and positions the component.  */
   open: boolean;
   /** Passes a function to run before the component closes. */
@@ -52,12 +46,6 @@ export declare class Modal implements ConditionalSlotComponent, OpenCloseCompone
   color: "red" | "blue";
   /** Sets the background color of the component's content. */
   backgroundColor: ModalBackgroundColor;
-  /**
-   * When `true`, disables spacing to the content area slot.
-   *
-   * @deprecated  Use `--calcite-modal-padding` CSS variable instead.
-   */
-  noPadding: boolean;
   componentWillLoad(): void;
   componentDidLoad(): void;
   connectedCallback(): void;
@@ -91,13 +79,6 @@ export declare class Modal implements ConditionalSlotComponent, OpenCloseCompone
   calciteModalBeforeOpen: EventEmitter<void>;
   /** Fires when the component is open and animation is complete. */
   calciteModalOpen: EventEmitter<void>;
-  /**
-   * Focus the first interactive element.
-   *
-   * @param el
-   * @deprecated use `setFocus` instead.
-   */
-  focusElement(el?: HTMLElement): Promise<void>;
   /**
    * Sets focus on the component.
    *
@@ -119,7 +100,6 @@ export declare class Modal implements ConditionalSlotComponent, OpenCloseCompone
   onOpen(): void;
   onBeforeClose(): void;
   onClose(): void;
-  activeHandler(value: boolean): void;
   toggleModal(value: boolean): Promise<void>;
   private openEnd;
   /** Open the modal */

package/dist/types/components/pagination/pagination.d.ts

@@ -38,12 +38,6 @@ export declare class Pagination implements LocalizedComponent {
   el: HTMLCalcitePaginationElement;
   effectiveLocale: string;
   effectiveLocaleWatcher(): void;
-  /**
-   * Emits when the selected page changes.
-   *
-   * @deprecated use calcitePaginationChange instead
-   */
-  calcitePaginationUpdate: EventEmitter<PaginationDetail>;
   /**
    * Emits when the selected page changes.
    *

package/dist/types/components.d.ts

@@ -2462,12 +2462,6 @@ export namespace Components {
         "heading": string;
     }
     interface CalciteLoader {
-        /**
-          * When `true`, the component is active.
-          * @deprecated use global `hidden` attribute instead.
-          * @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
-         */
-        "active": boolean;
         /**
           * When `true`, displays smaller and appears to the left of the text.
          */
@@ -2476,11 +2470,6 @@ export namespace Components {
           * Accessible name for the component.
          */
         "label": string;
-        /**
-          * Disables spacing around the component.
-          * @deprecated Use `--calcite-loader-padding` CSS variable instead.
-         */
-        "noPadding": boolean;
         /**
           * Specifies the size of the component.
          */
@@ -2499,11 +2488,6 @@ export namespace Components {
         "value": number;
     }
     interface CalciteModal {
-        /**
-          * When `true`, the component is active.
-          * @deprecated use `open` instead.
-         */
-        "active": boolean;
         /**
           * Sets the background color of the component's content.
          */
@@ -2536,12 +2520,6 @@ export namespace Components {
           * When `true`, prevents the component from expanding to the entire screen on mobile devices.
          */
         "docked": boolean;
-        /**
-          * Focus the first interactive element.
-          * @param el
-          * @deprecated use `setFocus` instead.
-         */
-        "focusElement": (el?: HTMLElement) => Promise<void>;
         /**
           * Sets the component to always be fullscreen (overrides `width`).
          */
@@ -2550,11 +2528,6 @@ export namespace Components {
           * Accessible name for the component's close button.
          */
         "intlClose": string;
-        /**
-          * When `true`, disables spacing to the content area slot.
-          * @deprecated Use `--calcite-modal-padding` CSS variable instead.
-         */
-        "noPadding": boolean;
         /**
           * When `true`, displays and positions the component.
          */
@@ -7478,12 +7451,6 @@ declare namespace LocalJSX {
         "heading"?: string;
     }
     interface CalciteLoader {
-        /**
-          * When `true`, the component is active.
-          * @deprecated use global `hidden` attribute instead.
-          * @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
-         */
-        "active"?: boolean;
         /**
           * When `true`, displays smaller and appears to the left of the text.
          */
@@ -7492,11 +7459,6 @@ declare namespace LocalJSX {
           * Accessible name for the component.
          */
         "label": string;
-        /**
-          * Disables spacing around the component.
-          * @deprecated Use `--calcite-loader-padding` CSS variable instead.
-         */
-        "noPadding"?: boolean;
         /**
           * Specifies the size of the component.
          */
@@ -7515,11 +7477,6 @@ declare namespace LocalJSX {
         "value"?: number;
     }
     interface CalciteModal {
-        /**
-          * When `true`, the component is active.
-          * @deprecated use `open` instead.
-         */
-        "active"?: boolean;
         /**
           * Sets the background color of the component's content.
          */
@@ -7560,11 +7517,6 @@ declare namespace LocalJSX {
           * Accessible name for the component's close button.
          */
         "intlClose"?: string;
-        /**
-          * When `true`, disables spacing to the content area slot.
-          * @deprecated Use `--calcite-modal-padding` CSS variable instead.
-         */
-        "noPadding"?: boolean;
         /**
           * Fires when the component is requested to be closed and before the closing transition begins.
          */
@@ -7689,11 +7641,6 @@ declare namespace LocalJSX {
           * @see [PaginationDetail](https://github.com/Esri/calcite-components/blob/master/src/components/pagination/pagination.tsx#L23)
          */
         "onCalcitePaginationChange"?: (event: CalcitePaginationCustomEvent<PaginationDetail>) => void;
-        /**
-          * Emits when the selected page changes.
-          * @deprecated use calcitePaginationChange instead
-         */
-        "onCalcitePaginationUpdate"?: (event: CalcitePaginationCustomEvent<PaginationDetail>) => void;
         /**
           * Specifies the size of the component.
          */

package/dist/types/preact.d.ts

@@ -241,8 +241,7 @@ declare module "preact/src/jsx" {
         "oncalciteInternalOptionGroupChange"?: (event: CustomEvent<any>) => void;
       }
 
-      "calcite-pagination": Omit<JSX.CalcitePagination, "onCalcitePaginationUpdate" | "onCalcitePaginationChange"> & JSXInternal.HTMLAttributes<HTMLCalcitePaginationElement> & {
-        "oncalcitePaginationUpdate"?: (event: CustomEvent<any>) => void;
+      "calcite-pagination": Omit<JSX.CalcitePagination, "onCalcitePaginationChange"> & JSXInternal.HTMLAttributes<HTMLCalcitePaginationElement> & {
         "oncalcitePaginationChange"?: (event: CustomEvent<any>) => void;
       }