@esri/calcite-components 1.0.0-next.686 → 1.0.0-next.688

package/dist/extras/docs-json.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2022-12-15T21:18:46",
+  "timestamp": "2022-12-16T00:00:20",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.20.0",
@@ -267,6 +267,31 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "\"both\" | \"end\" | \"start\"",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "values": [
+            {
+              "value": "both",
+              "type": "string"
+            },
+            {
+              "value": "end",
+              "type": "string"
+            },
+            {
+              "value": "start",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "iconStart",
           "type": "string",
@@ -450,6 +475,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "indicator",
           "type": "boolean",
@@ -826,15 +868,10 @@
             "type": "Promise<void>",
             "docs": ""
           },
-          "signature": "setFocus(focusId?: \"expand-toggle\") => Promise<void>",
+          "signature": "setFocus() => Promise<void>",
           "parameters": [],
           "docs": "Sets focus on the component.",
-          "docsTags": [
-            {
-              "name": "param",
-              "text": "focusId"
-            }
-          ]
+          "docsTags": []
         }
       ],
       "events": [
@@ -1582,15 +1619,10 @@
             "type": "Promise<void>",
             "docs": ""
           },
-          "signature": "setFocus(focusId?: \"expand-toggle\") => Promise<void>",
+          "signature": "setFocus() => Promise<void>",
           "parameters": [],
           "docs": "Sets focus on the component.",
-          "docsTags": [
-            {
-              "name": "param",
-              "text": "focusId"
-            }
-          ]
+          "docsTags": []
         }
       ],
       "events": [
@@ -1741,9 +1773,26 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "kind",
-          "type": "\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\"",
+          "type": "\"brand\" | \"danger\" | \"info\" | \"inverse\" | \"neutral\" | \"success\" | \"warning\"",
           "mutable": false,
           "attr": "kind",
           "reflectToAttr": true,
@@ -1763,6 +1812,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -2665,11 +2722,11 @@
         }
       ],
       "usage": {
-        "Basic": "```html\n<calcite-button icon-start=\"plus\" color=\"red\">Go!</calcite-button>\n```\n",
+        "Basic": "```html\n<calcite-button icon-start=\"plus\">Go!</calcite-button>\n```\n",
         "Focusing": "You can programmatically focus a `calcite-button` with the `setFocus()` method:\n\n```html\n<div onclick=\"document.querySelector('#my-button').setFocus()\">Focus!</div>\n```\n",
         "Internals": "Any additional attributes set on `<calcite-button>` are passed to the internal `<a>` or `<button>` tag. For example, the first button below sets `target=\"_blank` On the internal `<a>`. The second button sets `type=\"submit\"` on the internal `<button>`.\n\n- ```html\n  <calcite-button href=\"https://github.com/esri/calcite-components\" target=\"_blank\">\n    Calcite Components on GitHub\n  </calcite-button>\n\n  <calcite-button type=\"submit\">Submit</calcite-button>\n  ```\n",
-        "With-icons": "```html\n<calcite-button appearance=\"solid\" icon-start=\"arrow-left\">Back</calcite-button>\n<calcite-button icon-end=\"map\" color=\"red\">Map Options</calcite-button>\n<calcite-button icon-end=\"plus\" appearance=\"outline\" color=\"inverse\">Add to favorites</calcite-button>\n```\n",
-        "With-loader-disabled": "```html\n<calcite-button loading color=\"neutral\">Fetching data...</calcite-button>\n<calcite-button disabled>Can't touch this</calcite-button>\n```\n",
+        "With-icons": "```html\n<calcite-button appearance=\"solid\" icon-start=\"arrow-left\">Back</calcite-button>\n<calcite-button icon-end=\"map\" kind=\"danger\">Delete Map Options</calcite-button>\n<calcite-button icon-end=\"plus\" appearance=\"outline-fill\" kind=\"inverse\">Add to favorites</calcite-button>\n```\n",
+        "With-loader-disabled": "```html\n<calcite-button loading kind=\"neutral\">Fetching data...</calcite-button>\n<calcite-button disabled>Can't touch this</calcite-button>\n```\n",
         "Within-form": "```html\n<form name=\"sign-up\">\n  <calcite-label>\n    First name\n    <calcite-input name=\"first-name\" required value=\"Jane\"></calcite-input>\n  </calcite-label>\n  <calcite-button type=\"reset\">I should reset the form (type reset)</calcite-button>\n  <calcite-button type=\"button\">I should not submit the form (type button)</calcite-button>\n  <calcite-button>Submit</calcite-button>\n</form>\n```\n"
       },
       "props": [
@@ -2713,7 +2770,7 @@
         },
         {
           "name": "appearance",
-          "type": "\"clear\" | \"minimal\" | \"outline\" | \"solid\" | \"transparent\"",
+          "type": "\"outline\" | \"outline-fill\" | \"solid\" | \"transparent\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
@@ -2722,15 +2779,11 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "clear",
-              "type": "string"
-            },
-            {
-              "value": "minimal",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "outline",
+              "value": "outline-fill",
               "type": "string"
             },
             {
@@ -2745,36 +2798,6 @@
           "optional": false,
           "required": false
         },
-        {
-          "name": "color",
-          "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
-          "mutable": false,
-          "attr": "color",
-          "reflectToAttr": true,
-          "docs": "Specifies the color of the component.",
-          "docsTags": [],
-          "default": "\"blue\"",
-          "values": [
-            {
-              "value": "blue",
-              "type": "string"
-            },
-            {
-              "value": "inverse",
-              "type": "string"
-            },
-            {
-              "value": "neutral",
-              "type": "string"
-            },
-            {
-              "value": "red",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "disabled",
           "type": "boolean",
@@ -2792,28 +2815,6 @@
           "optional": false,
           "required": false
         },
-        {
-          "name": "form",
-          "type": "string",
-          "mutable": false,
-          "attr": "form",
-          "reflectToAttr": false,
-          "docs": "The form ID to associate with the component.",
-          "docsTags": [
-            {
-              "name": "deprecated",
-              "text": "– The property is no longer needed if the component is placed inside a form."
-            }
-          ],
-          "deprecation": "– The property is no longer needed if the component is placed inside a form.",
-          "values": [
-            {
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "href",
           "type": "string",
@@ -2887,6 +2888,36 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "kind",
+          "type": "\"brand\" | \"danger\" | \"inverse\" | \"neutral\"",
+          "mutable": false,
+          "attr": "kind",
+          "reflectToAttr": true,
+          "docs": "Specifies the kind of the component (will apply to border and background if applicable).",
+          "docsTags": [],
+          "default": "\"brand\"",
+          "values": [
+            {
+              "value": "brand",
+              "type": "string"
+            },
+            {
+              "value": "danger",
+              "type": "string"
+            },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -3560,12 +3591,12 @@
         }
       ],
       "usage": {
-        "Basic": "```html\n<calcite-chip value=\"Global\" closable icon=\"globe\" appearance=\"clear\" color=\"green\">Global</calcite-chip>\n```\n"
+        "Basic": "```html\n<calcite-chip value=\"Global\" closable icon=\"globe\" appearance=\"outline\" kind=\"brand\">Global</calcite-chip>\n```\n"
       },
       "props": [
         {
           "name": "appearance",
-          "type": "\"solid\" | \"transparent\"",
+          "type": "\"outline\" | \"outline-fill\" | \"solid\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
@@ -3574,11 +3605,15 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "solid",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "transparent",
+              "value": "outline-fill",
+              "type": "string"
+            },
+            {
+              "value": "solid",
               "type": "string"
             }
           ],
@@ -3620,33 +3655,15 @@
           "required": false
         },
         {
-          "name": "color",
-          "type": "\"blue\" | \"green\" | \"grey\" | \"red\" | \"yellow\"",
+          "name": "icon",
+          "type": "string",
           "mutable": false,
-          "attr": "color",
+          "attr": "icon",
           "reflectToAttr": true,
-          "docs": "Specifies the color for the component.",
+          "docs": "Specifies an icon to display.",
           "docsTags": [],
-          "default": "\"grey\"",
           "values": [
             {
-              "value": "blue",
-              "type": "string"
-            },
-            {
-              "value": "green",
-              "type": "string"
-            },
-            {
-              "value": "grey",
-              "type": "string"
-            },
-            {
-              "value": "red",
-              "type": "string"
-            },
-            {
-              "value": "yellow",
               "type": "string"
             }
           ],
@@ -3654,33 +3671,43 @@
           "required": false
         },
         {
-          "name": "icon",
-          "type": "string",
+          "name": "iconFlipRtl",
+          "type": "boolean",
           "mutable": false,
-          "attr": "icon",
+          "attr": "icon-flip-rtl",
           "reflectToAttr": true,
-          "docs": "Specifies an icon to display.",
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
           "docsTags": [],
+          "default": "false",
           "values": [
             {
-              "type": "string"
+              "type": "boolean"
             }
           ],
           "optional": false,
           "required": false
         },
         {
-          "name": "iconFlipRtl",
-          "type": "boolean",
+          "name": "kind",
+          "type": "\"brand\" | \"inverse\" | \"neutral\"",
           "mutable": false,
-          "attr": "icon-flip-rtl",
+          "attr": "kind",
           "reflectToAttr": true,
-          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docs": "Specifies the kind of the component (will apply to border and background if applicable).",
           "docsTags": [],
-          "default": "false",
+          "default": "\"neutral\"",
           "values": [
             {
-              "type": "boolean"
+              "value": "brand",
+              "type": "string"
+            },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
             }
           ],
           "optional": false,
@@ -4877,6 +4904,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "placeholderIconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "placeholder-icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "scale",
           "type": "\"l\" | \"m\" | \"s\"",
@@ -5222,6 +5266,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "selected",
           "type": "boolean",
@@ -7152,53 +7213,23 @@
         "Loading-and-disabled": "Renders a `calcite-fab` that is loading and disabled.\n\n```html\n<calcite-fab loading disabled></calcite-fab>\n```\n",
         "With-text": "Renders a `calcite-fab` that displays text along side an icon and a tooltip label.\n\n```html\n<calcite-fab label=\"Performs my custom action\" text=\"Perform Action!\" text-enabled></calcite-fab>\n```\n"
       },
-      "props": [
-        {
-          "name": "appearance",
-          "type": "\"outline\" | \"solid\"",
-          "mutable": false,
-          "attr": "appearance",
-          "reflectToAttr": true,
-          "docs": "Specifies the appearance style of the component.",
-          "docsTags": [],
-          "default": "\"outline\"",
-          "values": [
-            {
-              "value": "outline",
-              "type": "string"
-            },
-            {
-              "value": "solid",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
+      "props": [
         {
-          "name": "color",
-          "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
+          "name": "appearance",
+          "type": "\"outline-fill\" | \"solid\"",
           "mutable": false,
-          "attr": "color",
+          "attr": "appearance",
           "reflectToAttr": true,
-          "docs": "Specifies the color of the component.",
+          "docs": "Specifies the appearance style of the component.",
           "docsTags": [],
-          "default": "\"neutral\"",
+          "default": "\"solid\"",
           "values": [
             {
-              "value": "blue",
-              "type": "string"
-            },
-            {
-              "value": "inverse",
-              "type": "string"
-            },
-            {
-              "value": "neutral",
+              "value": "outline-fill",
               "type": "string"
             },
             {
-              "value": "red",
+              "value": "solid",
               "type": "string"
             }
           ],
@@ -7244,6 +7275,53 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "kind",
+          "type": "\"brand\" | \"danger\" | \"inverse\" | \"neutral\"",
+          "mutable": false,
+          "attr": "kind",
+          "reflectToAttr": true,
+          "docs": "Specifies the kind of the component (will apply to border and background).",
+          "docsTags": [],
+          "default": "\"brand\"",
+          "values": [
+            {
+              "value": "brand",
+              "type": "string"
+            },
+            {
+              "value": "danger",
+              "type": "string"
+            },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -10374,6 +10452,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "scale",
           "type": "\"l\" | \"m\" | \"s\"",
@@ -13523,7 +13618,7 @@
         },
         {
           "name": "kind",
-          "type": "\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\"",
+          "type": "\"brand\" | \"danger\" | \"info\" | \"inverse\" | \"neutral\" | \"success\" | \"warning\"",
           "mutable": false,
           "attr": "kind",
           "reflectToAttr": true,
@@ -13542,6 +13637,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -13858,9 +13961,26 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "kind",
-          "type": "\"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\"",
+          "type": "\"brand\" | \"danger\" | \"info\" | \"inverse\" | \"neutral\" | \"success\" | \"warning\"",
           "mutable": false,
           "attr": "kind",
           "reflectToAttr": true,
@@ -13880,6 +14000,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -15390,6 +15518,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -18646,7 +18791,7 @@
       "props": [
         {
           "name": "appearance",
-          "type": "\"clear\" | \"minimal\" | \"outline\" | \"solid\" | \"transparent\"",
+          "type": "\"outline\" | \"outline-fill\" | \"solid\" | \"transparent\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
@@ -18655,15 +18800,11 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "clear",
-              "type": "string"
-            },
-            {
-              "value": "minimal",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "outline",
+              "value": "outline-fill",
               "type": "string"
             },
             {
@@ -18678,36 +18819,6 @@
           "optional": false,
           "required": false
         },
-        {
-          "name": "color",
-          "type": "\"blue\" | \"inverse\" | \"neutral\" | \"red\"",
-          "mutable": false,
-          "attr": "color",
-          "reflectToAttr": true,
-          "docs": "Specifies the color of the component.",
-          "docsTags": [],
-          "default": "\"blue\"",
-          "values": [
-            {
-              "value": "blue",
-              "type": "string"
-            },
-            {
-              "value": "inverse",
-              "type": "string"
-            },
-            {
-              "value": "neutral",
-              "type": "string"
-            },
-            {
-              "value": "red",
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "disabled",
           "type": "boolean",
@@ -18771,6 +18882,36 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "kind",
+          "type": "\"brand\" | \"danger\" | \"inverse\" | \"neutral\"",
+          "mutable": false,
+          "attr": "kind",
+          "reflectToAttr": true,
+          "docs": "Specifies the kind of the component (will apply to border and background if applicable).",
+          "docsTags": [],
+          "default": "\"brand\"",
+          "values": [
+            {
+              "value": "brand",
+              "type": "string"
+            },
+            {
+              "value": "danger",
+              "type": "string"
+            },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "loading",
           "type": "boolean",
@@ -19402,6 +19543,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "selected",
           "type": "boolean",
@@ -20330,6 +20488,23 @@
           ],
           "optional": false,
           "required": false
+        },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
         }
       ],
       "methods": [],
@@ -20482,6 +20657,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "inputAlignment",
           "type": "\"end\" | \"start\"",
@@ -22501,6 +22693,23 @@
           "optional": true,
           "required": false
         },
+        {
+          "name": "iconFlipRtl",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "icon-flip-rtl",
+          "reflectToAttr": true,
+          "docs": "When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`).",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "label",
           "type": "string",