npm - @esri/calcite-components - Versions diffs - 1.0.0-next.538 → 1.0.0-next.539 - Mend

@esri/calcite-components 1.0.0-next.538 → 1.0.0-next.539

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1068) hide show

package/dist/extras/docs-json.json CHANGED Viewed

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2022-07-20T21:34:30",
+  "timestamp": "2022-07-26T17:02:33",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.16.1",
@@ -19,7 +19,7 @@
         }
       ],
       "usage": {
-        "Basic": "```html\n<calcite-accordion>\n  <calcite-accordion-item item-title=\"Accordion Item\">Accordion Section Content </calcite-accordion-item>\n  <calcite-accordion-item item-title=\"Accordion Item 2\" active>Accordion Section Content </calcite-accordion-item>\n  <calcite-accordion-item item-title=\"Accordion Item 3\">Accordion Section Content </calcite-accordion-item>\n</calcite-accordion>\n```\n"
+        "Basic": "```html\n<calcite-accordion>\n  <calcite-accordion-item heading=\"Accordion Item\">Accordion Section Content </calcite-accordion-item>\n  <calcite-accordion-item heading=\"Accordion Item 2\" active>Accordion Section Content </calcite-accordion-item>\n  <calcite-accordion-item heading=\"Accordion Item 3\">Accordion Section Content </calcite-accordion-item>\n</calcite-accordion>\n```\n"
       },
       "props": [
         {
@@ -640,7 +640,7 @@
       "events": [
         {
           "event": "calciteActionClick",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -811,6 +811,28 @@
           "optional": true,
           "required": false
         },
+        {
+          "name": "layout",
+          "type": "\"horizontal\" | \"vertical\"",
+          "mutable": false,
+          "attr": "layout",
+          "reflectToAttr": true,
+          "docs": "The layout direction of the actions.",
+          "docsTags": [],
+          "default": "\"vertical\"",
+          "values": [
+            {
+              "value": "horizontal",
+              "type": "string"
+            },
+            {
+              "value": "vertical",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "overflowActionsDisabled",
           "type": "boolean",
@@ -896,7 +918,7 @@
       "events": [
         {
           "event": "calciteActionBarToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -905,7 +927,13 @@
         }
       ],
       "listeners": [],
-      "styles": [],
+      "styles": [
+        {
+          "name": "--calcite-action-bar-expanded-max-width",
+          "annotation": "prop",
+          "docs": "optionally specify the expanded max width of the action bar when in \"vertical\" layout."
+        }
+      ],
       "slots": [
         {
           "name": "",
@@ -1209,14 +1237,14 @@
         },
         {
           "name": "flipPlacements",
-          "type": "ComputedPlacement[]",
+          "type": "Placement[]",
           "mutable": false,
           "reflectToAttr": false,
           "docs": "Defines the available placements that can be used when a flip occurs.",
           "docsTags": [],
           "values": [
             {
-              "type": "ComputedPlacement[]"
+              "type": "Placement[]"
             }
           ],
           "optional": true,
@@ -1279,7 +1307,7 @@
         },
         {
           "name": "placement",
-          "type": "Placement | PlacementRtl | VariationRtl",
+          "type": "Placement | AutoPlacement | VariationPlacement | DeprecatedPlacement",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -1287,7 +1315,7 @@
           "docsTags": [
             {
               "name": "see",
-              "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
+              "text": "[LogicalPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/floating-ui.ts#L25)"
             }
           ],
           "default": "\"auto\"",
@@ -1296,10 +1324,13 @@
               "type": "Placement"
             },
             {
-              "type": "PlacementRtl"
+              "type": "AutoPlacement"
             },
             {
-              "type": "VariationRtl"
+              "type": "VariationPlacement"
+            },
+            {
+              "type": "DeprecatedPlacement"
             }
           ],
           "optional": false,
@@ -1351,7 +1382,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Emits when the `open` property has changed.",
+          "docs": "Emits when the `open` property has changed.\n\n**Note:**: The event payload is deprecated, please use the `open` property on the component instead",
           "docsTags": []
         }
       ],
@@ -1594,7 +1625,7 @@
       "events": [
         {
           "event": "calciteActionPadToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -1603,7 +1634,13 @@
         }
       ],
       "listeners": [],
-      "styles": [],
+      "styles": [
+        {
+          "name": "--calcite-action-pad-expanded-max-width",
+          "annotation": "prop",
+          "docs": "optionally specify the expanded max width of the action pad when in \"vertical\" layout."
+        }
+      ],
       "slots": [
         {
           "name": "",
@@ -1899,7 +1936,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -1908,7 +1945,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -1917,7 +1954,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -1926,7 +1963,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         }
       ],
@@ -2171,8 +2208,14 @@
           "attr": "disable-padding",
           "reflectToAttr": false,
           "docs": "When true, removes padding for the slotted content",
-          "docsTags": [],
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "Use `--calcite-block-padding` CSS variable instead."
+            }
+          ],
           "default": "false",
+          "deprecation": "Use `--calcite-block-padding` CSS variable instead.",
           "values": [
             {
               "type": "boolean"
@@ -2442,7 +2485,7 @@
       "events": [
         {
           "event": "calciteBlockToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -2638,7 +2681,7 @@
       "events": [
         {
           "event": "calciteBlockSectionToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -3353,7 +3396,7 @@
       "events": [
         {
           "event": "calciteCardSelect",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -3560,7 +3603,7 @@
       "events": [
         {
           "event": "calciteCheckboxChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -3843,7 +3886,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Emitted when the dismiss button is clicked",
+          "docs": "Emitted when the dismiss button is clicked\n\n**Note:**: The `el` event payload props is deprecated, please use the event's target/currentTarget instead",
           "docsTags": []
         }
       ],
@@ -4610,7 +4653,7 @@
       "events": [
         {
           "event": "calciteColorPickerChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -4619,7 +4662,7 @@
         },
         {
           "event": "calciteColorPickerInput",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -4827,7 +4870,7 @@
       "events": [
         {
           "event": "calciteColorPickerHexInputChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -5036,14 +5079,14 @@
         },
         {
           "name": "flipPlacements",
-          "type": "ComputedPlacement[]",
+          "type": "Placement[]",
           "mutable": false,
           "reflectToAttr": false,
           "docs": "Defines the available placements that can be used when a flip occurs.",
           "docsTags": [],
           "values": [
             {
-              "type": "ComputedPlacement[]"
+              "type": "Placement[]"
             }
           ],
           "optional": true,
@@ -5295,7 +5338,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -5304,7 +5347,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -5322,7 +5365,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Called when a selected item in the combobox is dismissed via its chip",
+          "docs": "Called when a selected item in the combobox is dismissed via its chip\n\n**Note:**: The event payload is deprecated, please use the `value` property on the component to determine removed value instead",
           "docsTags": []
         },
         {
@@ -5331,7 +5374,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -5349,7 +5392,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         },
         {
@@ -5619,7 +5662,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Emitted whenever the item is selected or unselected.",
+          "docs": "Emitted whenever the item is selected or unselected.\n\n**Note:**: The event's payload is deprecated, please use the event's target/currentTarget instead",
           "docsTags": []
         }
       ],
@@ -6393,7 +6436,7 @@
       "events": [
         {
           "event": "calciteDaySelect",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -6566,7 +6609,7 @@
       "events": [
         {
           "event": "calciteDatePickerActiveDateChange",
-          "detail": "any",
+          "detail": "Date",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -6575,7 +6618,7 @@
         },
         {
           "event": "calciteDatePickerSelect",
-          "detail": "any",
+          "detail": "Date",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -6931,14 +6974,14 @@
         },
         {
           "name": "flipPlacements",
-          "type": "ComputedPlacement[]",
+          "type": "Placement[]",
           "mutable": false,
           "reflectToAttr": false,
           "docs": "Defines the available placements that can be used when a flip occurs.",
           "docsTags": [],
           "values": [
             {
-              "type": "ComputedPlacement[]"
+              "type": "Placement[]"
             }
           ],
           "optional": true,
@@ -7002,7 +7045,7 @@
         },
         {
           "name": "placement",
-          "type": "\"bottom\" | \"bottom-end\" | \"bottom-leading\" | \"bottom-start\" | \"bottom-trailing\" | \"top\" | \"top-end\" | \"top-leading\" | \"top-start\" | \"top-trailing\"",
+          "type": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"top\" | \"top-end\" | \"top-start\"",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -7010,7 +7053,7 @@
           "docsTags": [
             {
               "name": "default",
-              "text": "\"bottom-leading\""
+              "text": "\"bottom-start\""
             }
           ],
           "default": "defaultMenuPlacement",
@@ -7023,18 +7066,10 @@
               "value": "bottom-end",
               "type": "string"
             },
-            {
-              "value": "bottom-leading",
-              "type": "string"
-            },
             {
               "value": "bottom-start",
               "type": "string"
             },
-            {
-              "value": "bottom-trailing",
-              "type": "string"
-            },
             {
               "value": "top",
               "type": "string"
@@ -7043,17 +7078,9 @@
               "value": "top-end",
               "type": "string"
             },
-            {
-              "value": "top-leading",
-              "type": "string"
-            },
             {
               "value": "top-start",
               "type": "string"
-            },
-            {
-              "value": "top-trailing",
-              "type": "string"
             }
           ],
           "optional": false,
@@ -7173,7 +7200,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -7182,7 +7209,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -7191,7 +7218,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -7200,7 +7227,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         },
         {
@@ -8238,7 +8265,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Emitted when the the handle is activated and the up or down arrow key is pressed.",
+          "docs": "Emitted when the the handle is activated and the up or down arrow key is pressed.\n\n**Note:**: The `handle` event payload prop is deprecated, please use the event's target/currentTarget instead",
           "docsTags": []
         }
       ],
@@ -9499,7 +9526,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Fires each time a new value is typed.",
+          "docs": "Fires each time a new value is typed.\n\n**Note:**: The `el` and `value` event payload props are deprecated, please use the event's target/currentTarget instead",
           "docsTags": []
         }
       ],
@@ -9641,14 +9668,14 @@
         },
         {
           "name": "flipPlacements",
-          "type": "ComputedPlacement[]",
+          "type": "Placement[]",
           "mutable": false,
           "reflectToAttr": false,
           "docs": "Defines the available placements that can be used when a flip occurs.",
           "docsTags": [],
           "values": [
             {
-              "type": "ComputedPlacement[]"
+              "type": "Placement[]"
             }
           ],
           "optional": true,
@@ -9915,7 +9942,7 @@
         },
         {
           "name": "placement",
-          "type": "\"bottom\" | \"bottom-end\" | \"bottom-leading\" | \"bottom-start\" | \"bottom-trailing\" | \"top\" | \"top-end\" | \"top-leading\" | \"top-start\" | \"top-trailing\"",
+          "type": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"top\" | \"top-end\" | \"top-start\"",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -9923,7 +9950,7 @@
           "docsTags": [
             {
               "name": "default",
-              "text": "\"bottom-leading\""
+              "text": "\"bottom-start\""
             }
           ],
           "default": "defaultMenuPlacement",
@@ -9936,18 +9963,10 @@
               "value": "bottom-end",
               "type": "string"
             },
-            {
-              "value": "bottom-leading",
-              "type": "string"
-            },
             {
               "value": "bottom-start",
               "type": "string"
             },
-            {
-              "value": "bottom-trailing",
-              "type": "string"
-            },
             {
               "value": "top",
               "type": "string"
@@ -9956,17 +9975,9 @@
               "value": "top-end",
               "type": "string"
             },
-            {
-              "value": "top-leading",
-              "type": "string"
-            },
             {
               "value": "top-start",
               "type": "string"
-            },
-            {
-              "value": "top-trailing",
-              "type": "string"
             }
           ],
           "optional": false,
@@ -10200,7 +10211,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -10209,7 +10220,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -10227,7 +10238,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -10236,7 +10247,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         }
       ],
@@ -11082,7 +11093,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Fires each time a new value is typed.",
+          "docs": "Fires each time a new value is typed.\n\n**Note:**: The `el` and `value` event payload props are deprecated, please use the event's target/currentTarget instead",
           "docsTags": []
         }
       ],
@@ -11362,7 +11373,7 @@
         },
         {
           "name": "placement",
-          "type": "Placement | PlacementRtl | VariationRtl",
+          "type": "Placement | AutoPlacement | VariationPlacement | DeprecatedPlacement",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -11370,7 +11381,7 @@
           "docsTags": [
             {
               "name": "see",
-              "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
+              "text": "[LogicalPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/floating-ui.ts#L25)"
             }
           ],
           "default": "\"auto\"",
@@ -11379,10 +11390,13 @@
               "type": "Placement"
             },
             {
-              "type": "PlacementRtl"
+              "type": "AutoPlacement"
+            },
+            {
+              "type": "VariationPlacement"
             },
             {
-              "type": "VariationRtl"
+              "type": "DeprecatedPlacement"
             }
           ],
           "optional": false,
@@ -11512,11 +11526,6 @@
           "capture": false,
           "passive": false
         },
-        {
-          "event": "keyup",
-          "capture": false,
-          "passive": false
-        },
         {
           "event": "calciteInternalTimePickerBlur",
           "capture": false,
@@ -12369,8 +12378,14 @@
           "attr": "no-padding",
           "reflectToAttr": false,
           "docs": "Disables spacing around the component.",
-          "docsTags": [],
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "Use `--calcite-loader-padding` CSS variable instead."
+            }
+          ],
           "default": "false",
+          "deprecation": "Use `--calcite-loader-padding` CSS variable instead.",
           "values": [
             {
               "type": "boolean"
@@ -12732,8 +12747,14 @@
           "attr": "no-padding",
           "reflectToAttr": false,
           "docs": "When true, disables spacing to the content area slot.",
-          "docsTags": [],
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "Use `--calcite-modal-padding` CSS variable instead."
+            }
+          ],
           "default": "false",
+          "deprecation": "Use `--calcite-modal-padding` CSS variable instead.",
           "values": [
             {
               "type": "boolean"
@@ -12881,7 +12902,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -12890,7 +12911,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -12899,7 +12920,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -12908,13 +12929,13 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         }
       ],
       "listeners": [
         {
-          "event": "keyup",
+          "event": "keydown",
           "target": "window",
           "capture": false,
           "passive": false
@@ -12924,27 +12945,27 @@
         {
           "name": "--calcite-modal-content-text",
           "annotation": "prop",
-          "docs": "The component content's font size."
+          "docs": "[Deprecated] The component content's font size."
         },
         {
           "name": "--calcite-modal-padding",
           "annotation": "prop",
-          "docs": "The top/bottom padding around items within the component."
+          "docs": "[Deprecated] The padding around content area slot."
         },
         {
           "name": "--calcite-modal-padding-large",
           "annotation": "prop",
-          "docs": "The left/right padding around items within the component."
+          "docs": "[Deprecated] The left/right padding around items within the component."
         },
         {
           "name": "--calcite-modal-title-text",
           "annotation": "prop",
-          "docs": "The component title's font size."
+          "docs": "[Deprecated] The component title's font size."
         },
         {
           "name": "--calcite-scrim-background",
           "annotation": "prop",
-          "docs": "The component's semi-transparent background color."
+          "docs": "[Deprecated] The component's semi-transparent background color."
         }
       ],
       "slots": [
@@ -13021,8 +13042,14 @@
           "attr": "active",
           "reflectToAttr": true,
           "docs": "When true, the component is active.",
-          "docsTags": [],
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "Use open instead."
+            }
+          ],
           "default": "false",
+          "deprecation": "Use open instead.",
           "values": [
             {
               "type": "boolean"
@@ -13142,6 +13169,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "open",
+          "type": "boolean",
+          "mutable": true,
+          "attr": "open",
+          "reflectToAttr": true,
+          "docs": "When true, the component is visible",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "scale",
           "type": "\"l\" | \"m\" | \"s\"",
@@ -13211,7 +13255,7 @@
       "events": [
         {
           "event": "calciteNoticeClose",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -13220,7 +13264,7 @@
         },
         {
           "event": "calciteNoticeOpen",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -13686,7 +13730,7 @@
         {
           "name": "closable",
           "type": "boolean",
-          "mutable": false,
+          "mutable": true,
           "attr": "closable",
           "reflectToAttr": true,
           "docs": "When true, displays a close button in the trailing side of the header",
@@ -13776,7 +13820,7 @@
         {
           "name": "dismissible",
           "type": "boolean",
-          "mutable": false,
+          "mutable": true,
           "attr": "dismissible",
           "reflectToAttr": true,
           "docs": "When true, a close button is added to the component.",
@@ -14058,7 +14102,7 @@
       "events": [
         {
           "event": "calcitePanelBackClick",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -14067,7 +14111,7 @@
         },
         {
           "event": "calcitePanelDismiss",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -14076,11 +14120,11 @@
         },
         {
           "event": "calcitePanelDismissedChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Fires when the close button is clicked.",
+          "docs": "Fires when there is a change to the `dismissed` property value .",
           "docsTags": [
             {
               "name": "deprecated",
@@ -14091,7 +14135,7 @@
         },
         {
           "event": "calcitePanelScroll",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -14942,14 +14986,14 @@
         },
         {
           "name": "flipPlacements",
-          "type": "ComputedPlacement[]",
+          "type": "Placement[]",
           "mutable": false,
           "reflectToAttr": false,
           "docs": "Defines the available placements that can be used when a flip occurs.",
           "docsTags": [],
           "values": [
             {
-              "type": "ComputedPlacement[]"
+              "type": "Placement[]"
             }
           ],
           "optional": true,
@@ -15126,7 +15170,7 @@
         },
         {
           "name": "placement",
-          "type": "Placement | PlacementRtl | VariationRtl",
+          "type": "Placement | AutoPlacement | VariationPlacement | DeprecatedPlacement",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -15134,7 +15178,7 @@
           "docsTags": [
             {
               "name": "see",
-              "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
+              "text": "[LogicalPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/floating-ui.ts#L25)"
             }
           ],
           "default": "defaultPopoverPlacement",
@@ -15143,10 +15187,13 @@
               "type": "Placement"
             },
             {
-              "type": "PlacementRtl"
+              "type": "AutoPlacement"
             },
             {
-              "type": "VariationRtl"
+              "type": "VariationPlacement"
+            },
+            {
+              "type": "DeprecatedPlacement"
             }
           ],
           "optional": false,
@@ -15154,7 +15201,7 @@
         },
         {
           "name": "referenceElement",
-          "type": "Element | string | ({ getBoundingClientRect: () => ClientRect | DOMRect; contextElement?: Element; })",
+          "type": "Element | VirtualElement | string",
           "mutable": false,
           "attr": "reference-element",
           "reflectToAttr": false,
@@ -15165,13 +15212,10 @@
               "type": "Element"
             },
             {
-              "type": "string"
+              "type": "VirtualElement"
             },
             {
-              "type": "({ getBoundingClientRect: () => ClientRect"
-            },
-            {
-              "type": "DOMRect; contextElement?: Element; })"
+              "type": "string"
             }
           ],
           "optional": false,
@@ -15247,7 +15291,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is requested to be closed and before the closing transition begins.",
           "docsTags": []
         },
         {
@@ -15256,7 +15300,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is added to the DOM but not rendered, and before the opening transition begins.",
           "docsTags": []
         },
         {
@@ -15265,7 +15309,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is closed and animation is complete.",
           "docsTags": []
         },
         {
@@ -15274,7 +15318,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "",
+          "docs": "Fires when the component is open and animation is complete.",
           "docsTags": []
         }
       ],
@@ -15676,7 +15720,7 @@
       "events": [
         {
           "event": "calciteRadioButtonChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -15845,7 +15889,7 @@
       "events": [
         {
           "event": "calciteRadioButtonGroupChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -16813,11 +16857,19 @@
         },
         {
           "name": "slot",
-          "text": "primary-panel - A slot for adding the leading `calcite-shell-panel`."
+          "text": "panel-start - A slot for adding the starting `calcite-shell-panel`."
         },
         {
           "name": "slot",
-          "text": "contextual-panel - A slot for adding the trailing `calcite-shell-panel`."
+          "text": "panel-end - A slot for adding the ending `calcite-shell-panel`."
+        },
+        {
+          "name": "slot",
+          "text": "primary-panel - [DEPRECATED] A slot for adding the leading `calcite-shell-panel`."
+        },
+        {
+          "name": "slot",
+          "text": "contextual-panel - [DEPRECATED] A slot for adding the trailing `calcite-shell-panel`."
         },
         {
           "name": "slot",
@@ -16825,10 +16877,10 @@
         }
       ],
       "usage": {
-        "Advanced": "Renders a shell with leading and trailing floating panels, action bar/pad, block, flow, tip manager, footer.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"primary-panel\" position=\"start\" detached>\n    <calcite-action-bar slot=\"action-bar\">\n      <calcite-action-group>\n        <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n        <calcite-action text=\"Layers\" active indicator icon=\"layers\"></calcite-action>\n      </calcite-action-group>\n      <calcite-action-group>\n        <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Layers\" indicator icon=\"layers\"></calcite-action>\n      </calcite-action-group>\n    </calcite-action-bar>\n    <calcite-block collapsible  heading=\"Primary Content\" summary=\"This is the primary.\">\n      <calcite-block-content>\n        <calcite-action text=\"Puppies\" text-enabled indicator icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Kittens\" text-enabled icon=\"save\"></calcite-action>\n        <calcite-action text=\"Birds?\" text-enabled icon=\"banana\"></calcite-action>\n      </calcite-block-content>\n    </calcite-block>\n    <calcite-block collapsible  heading=\"Additional Block\" summary=\"Baby shark doo doo doo doo.\">\n      <calcite-block-content>\n          <p>Cool thing.</p>\n      </calcite-block-content>\n    </calcite-block>\n  </calcite-shell-panel>\n\n   <calcite-shell-panel slot=\"contextual-panel\" position=\"end\" detached height-scale=\"l\">\n      <calcite-action-bar slot=\"action-bar\">\n        <calcite-action-group>\n          <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n          <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n          <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n        </calcite-action-group>\n        <calcite-action-group>\n          <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n          <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n          <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n        </calcite-action-group>\n        <calcite-action slot=\"bottom-actions\" text=\"Tips\" icon=\"lightbulb\"></calcite-action>\n      </calcite-action-bar>\n      <calcite-flow>\n        <calcite-panel heading=\"Layer settings\">\n          <calcite-block collapsible open heading=\"Contextual Content\" summary=\"Select goodness\">\n            <calcite-value-list multiple filter-enabled>\n              <calcite-value-list-item label=\"2018 Population Density (Esri)\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY\">\n                <calcite-action slot=\"actions-end\" icon=\"camera-flash-on\"></calcite-action>\n              </calcite-value-list-item>\n              <calcite-value-list-item label=\"2018 Population Density [Updated]\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY2\">\n                <calcite-action slot=\"actions-end\" icon=\"banana\"></calcite-action>\n              </calcite-value-list-item>\n              <calcite-value-list-item label=\"2018 Total Households (Esri)\" description=\"{TOTHH_CY}\" value=\"TOTHH_CY\">\n                <calcite-action slot=\"actions-end\" icon=\"person2\"></calcite-action>\n              </calcite-value-list-item>\n            </calcite-value-list>\n          </calcite-block>\n        </calcite-panel>\n      </calcite-flow>\n  </calcite-shell-panel>\n  <calcite-tip-manager slot=\"center-row\">\n    <calcite-tip heading=\"The Red Rocks and Blue Water\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of nature.\">\n    <calcite-tip heading=\"The Long Trees\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of trees.\">\n  </calcite-tip-manager>\n  <footer slot=\"footer\">Footer</footer>\n</calcite-shell>\n```\n",
+        "Advanced": "Renders a shell with leading and trailing floating panels, action bar/pad, block, flow, tip manager, footer.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"panel-start\" position=\"start\" detached>\n    <calcite-action-bar slot=\"action-bar\">\n      <calcite-action-group>\n        <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n        <calcite-action text=\"Layers\" active indicator icon=\"layers\"></calcite-action>\n      </calcite-action-group>\n      <calcite-action-group>\n        <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Layers\" indicator icon=\"layers\"></calcite-action>\n      </calcite-action-group>\n    </calcite-action-bar>\n    <calcite-block collapsible  heading=\"Primary Content\" summary=\"This is the primary.\">\n      <calcite-block-content>\n        <calcite-action text=\"Puppies\" text-enabled indicator icon=\"plus\"></calcite-action>\n        <calcite-action text=\"Kittens\" text-enabled icon=\"save\"></calcite-action>\n        <calcite-action text=\"Birds?\" text-enabled icon=\"banana\"></calcite-action>\n      </calcite-block-content>\n    </calcite-block>\n    <calcite-block collapsible  heading=\"Additional Block\" summary=\"Baby shark doo doo doo doo.\">\n      <calcite-block-content>\n          <p>Cool thing.</p>\n      </calcite-block-content>\n    </calcite-block>\n  </calcite-shell-panel>\n\n   <calcite-shell-panel slot=\"panel-end\" position=\"end\" detached height-scale=\"l\">\n      <calcite-action-bar slot=\"action-bar\">\n        <calcite-action-group>\n          <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n          <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n          <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n        </calcite-action-group>\n        <calcite-action-group>\n          <calcite-action text=\"Add\" icon=\"plus\"></calcite-action>\n          <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n          <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n        </calcite-action-group>\n        <calcite-action slot=\"bottom-actions\" text=\"Tips\" icon=\"lightbulb\"></calcite-action>\n      </calcite-action-bar>\n      <calcite-flow>\n        <calcite-panel heading=\"Layer settings\">\n          <calcite-block collapsible open heading=\"Contextual Content\" summary=\"Select goodness\">\n            <calcite-value-list multiple filter-enabled>\n              <calcite-value-list-item label=\"2018 Population Density (Esri)\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY\">\n                <calcite-action slot=\"actions-end\" icon=\"camera-flash-on\"></calcite-action>\n              </calcite-value-list-item>\n              <calcite-value-list-item label=\"2018 Population Density [Updated]\" description=\"{POPDENS_CY}\" value=\"POPDENS_CY2\">\n                <calcite-action slot=\"actions-end\" icon=\"banana\"></calcite-action>\n              </calcite-value-list-item>\n              <calcite-value-list-item label=\"2018 Total Households (Esri)\" description=\"{TOTHH_CY}\" value=\"TOTHH_CY\">\n                <calcite-action slot=\"actions-end\" icon=\"person2\"></calcite-action>\n              </calcite-value-list-item>\n            </calcite-value-list>\n          </calcite-block>\n        </calcite-panel>\n      </calcite-flow>\n  </calcite-shell-panel>\n  <calcite-tip-manager slot=\"center-row\">\n    <calcite-tip heading=\"The Red Rocks and Blue Water\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of nature.\">\n    <calcite-tip heading=\"The Long Trees\" thumbnail=\"https://placeimg.com/1000/600\" text-thumbnail=\"This is an image of trees.\">\n  </calcite-tip-manager>\n  <footer slot=\"footer\">Footer</footer>\n</calcite-shell>\n```\n",
         "Basic": "Renders a basic shell with a header and a footer.\n\n```html\n<calcite-shell>\n  <div slot=\"header\">\n    <header>\n      <h2>Shell Header: My App</h2>\n    </header>\n  </div>\n  <p>Shell Content</p>\n  <!-- insert map or fillable content here -->\n  <footer slot=\"footer\">Footer</footer>\n</calcite-shell>\n```\n",
-        "With-panel-and-action-bar": "Renders a single panel with actions in an action bar.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"primary-panel\" position=\"start\">\n    <img src=\"https://via.placeholder.com/300x200\" alt=\"placeholder\" />\n    <calcite-action-bar slot=\"action-bar\">\n      <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n      <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n      <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n    </calcite-action-bar>\n  </calcite-shell-panel>\n</calcite-shell>\n```\n",
-        "With-panels": "Renders a shell with a header and panels on the left and right sides of the app.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"primary-panel\" position=\"start\">\n    Leading panel! (on the left side, since this is a LTR app)\n  </calcite-shell-panel>\n  <calcite-shell-panel slot=\"contextual-panel\" position=\"end\"> Trailing panel! (right side) </calcite-shell-panel>\n  <calcite-shell-center-row slot=\"center-row\" position=\"end\" height-scale=\"m\">\n    Center Row! (center bottom)\n  </calcite-shell-center-row>\n  <div slot=\"header\">\n    <header>\n      <h2>Shell Header: My App</h2>\n    </header>\n  </div>\n  <p>Shell Content</p>\n  <!-- insert map or fillable content here -->\n</calcite-shell>\n```\n"
+        "With-panel-and-action-bar": "Renders a single panel with actions in an action bar.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"panel-start\" position=\"start\">\n    <img src=\"https://via.placeholder.com/300x200\" alt=\"placeholder\" />\n    <calcite-action-bar slot=\"action-bar\">\n      <calcite-action text=\"Add\" active icon=\"plus\"></calcite-action>\n      <calcite-action text=\"Save\" disabled icon=\"save\"></calcite-action>\n      <calcite-action text=\"Layers\" icon=\"layers\"></calcite-action>\n    </calcite-action-bar>\n  </calcite-shell-panel>\n</calcite-shell>\n```\n",
+        "With-panels": "Renders a shell with a header and panels on the left and right sides of the app.\n\n```html\n<calcite-shell>\n  <calcite-shell-panel slot=\"panel-start\" position=\"start\">\n    Leading panel! (on the left side, since this is a LTR app)\n  </calcite-shell-panel>\n  <calcite-shell-panel slot=\"panel-end\" position=\"end\"> Trailing panel! (right side) </calcite-shell-panel>\n  <calcite-shell-center-row slot=\"center-row\" position=\"end\" height-scale=\"m\">\n    Center Row! (center bottom)\n  </calcite-shell-center-row>\n  <div slot=\"header\">\n    <header>\n      <h2>Shell Header: My App</h2>\n    </header>\n  </div>\n  <p>Shell Content</p>\n  <!-- insert map or fillable content here -->\n</calcite-shell>\n```\n"
       },
       "props": [
         {
@@ -16870,7 +16922,7 @@
         },
         {
           "name": "contextual-panel",
-          "docs": "A slot for adding the trailing `calcite-shell-panel`."
+          "docs": "[DEPRECATED] A slot for adding the trailing `calcite-shell-panel`."
         },
         {
           "name": "footer",
@@ -16880,9 +16932,17 @@
           "name": "header",
           "docs": "A slot for adding header content. This content will be positioned at the top of the shell."
         },
+        {
+          "name": "panel-end",
+          "docs": "A slot for adding the ending `calcite-shell-panel`."
+        },
+        {
+          "name": "panel-start",
+          "docs": "A slot for adding the starting `calcite-shell-panel`."
+        },
         {
           "name": "primary-panel",
-          "docs": "A slot for adding the leading `calcite-shell-panel`."
+          "docs": "[DEPRECATED] A slot for adding the leading `calcite-shell-panel`."
         }
       ],
       "parts": [],
@@ -17168,7 +17228,7 @@
       "events": [
         {
           "event": "calciteShellPanelToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -17608,7 +17668,7 @@
       "events": [
         {
           "event": "calciteSliderChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -17617,7 +17677,7 @@
         },
         {
           "event": "calciteSliderInput",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -17626,7 +17686,7 @@
         },
         {
           "event": "calciteSliderUpdate",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -17798,7 +17858,7 @@
       "events": [
         {
           "event": "calciteListOrderChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -18153,7 +18213,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "fired when the primary button is clicked",
+          "docs": "fired when the primary button is clicked\n\n**Note:** The event payload is deprecated, please use separate mouse event listeners to get info about click.",
           "docsTags": []
         },
         {
@@ -18162,7 +18222,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "fired when the secondary button is clicked",
+          "docs": "fired when the secondary button is clicked\n\n**Note:** The event payload is deprecated, please use separate mouse event listeners to get info about click.",
           "docsTags": []
         }
       ],
@@ -18759,7 +18819,7 @@
           "bubbles": true,
           "cancelable": true,
           "composed": true,
-          "docs": "Fires when the checked value has changed.",
+          "docs": "Fires when the checked value has changed.\n\n**Note:** The event payload is deprecated, please use the `checked` property on the component instead",
           "docsTags": []
         }
       ],
@@ -19776,7 +19836,7 @@
       "events": [
         {
           "event": "calciteTileSelectChange",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -20463,7 +20523,7 @@
       "events": [
         {
           "event": "calciteTipDismiss",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -20722,7 +20782,7 @@
       "events": [
         {
           "event": "calciteTipManagerClose",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -20731,7 +20791,7 @@
         },
         {
           "event": "calciteTipManagerToggle",
-          "detail": "any",
+          "detail": "void",
           "bubbles": true,
           "cancelable": true,
           "composed": true,
@@ -20911,7 +20971,7 @@
         },
         {
           "name": "placement",
-          "type": "Placement | PlacementRtl | VariationRtl",
+          "type": "Placement | AutoPlacement | VariationPlacement | DeprecatedPlacement",
           "mutable": false,
           "attr": "placement",
           "reflectToAttr": true,
@@ -20919,7 +20979,7 @@
           "docsTags": [
             {
               "name": "see",
-              "text": "[PopperPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/popper.ts#L25)"
+              "text": "[LogicalPlacement](https://github.com/Esri/calcite-components/blob/master/src/utils/floating-ui.ts#L25)"
             }
           ],
           "default": "\"auto\"",
@@ -20928,10 +20988,13 @@
               "type": "Placement"
             },
             {
-              "type": "PlacementRtl"
+              "type": "AutoPlacement"
             },
             {
-              "type": "VariationRtl"
+              "type": "VariationPlacement"
+            },
+            {
+              "type": "DeprecatedPlacement"
             }
           ],
           "optional": false,
@@ -20939,7 +21002,7 @@
         },
         {
           "name": "referenceElement",
-          "type": "Element | string | ({ getBoundingClientRect: () => ClientRect | DOMRect; contextElement?: Element; })",
+          "type": "Element | VirtualElement | string",
           "mutable": false,
           "attr": "reference-element",
           "reflectToAttr": false,
@@ -20950,13 +21013,10 @@
               "type": "Element"
             },
             {
-              "type": "string"
-            },
-            {
-              "type": "({ getBoundingClientRect: () => ClientRect"
+              "type": "VirtualElement"
             },
             {
-              "type": "DOMRect; contextElement?: Element; })"
+              "type": "string"
             }
           ],
           "optional": false,