npm - @esri/calcite-components - Versions diffs - 1.0.0-next.687 → 1.0.0-next.688 - Mend

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

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 (692) hide show

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

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2022-12-15T23:00:13",
+  "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",
@@ -1731,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,
@@ -1753,6 +1812,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -2655,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": [
@@ -2703,7 +2770,7 @@
         },
         {
           "name": "appearance",
-          "type": "\"clear\" | \"minimal\" | \"outline\" | \"solid\" | \"transparent\"",
+          "type": "\"outline\" | \"outline-fill\" | \"solid\" | \"transparent\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
@@ -2712,15 +2779,11 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "clear",
-              "type": "string"
-            },
-            {
-              "value": "minimal",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "outline",
+              "value": "outline-fill",
               "type": "string"
             },
             {
@@ -2735,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",
@@ -2782,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",
@@ -2877,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",
@@ -3550,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,
@@ -3564,11 +3605,15 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "solid",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "transparent",
+              "value": "outline-fill",
+              "type": "string"
+            },
+            {
+              "value": "solid",
               "type": "string"
             }
           ],
@@ -3610,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"
             }
           ],
@@ -3644,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,
@@ -4867,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\"",
@@ -5212,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",
@@ -7145,16 +7216,16 @@
       "props": [
         {
           "name": "appearance",
-          "type": "\"outline\" | \"solid\"",
+          "type": "\"outline-fill\" | \"solid\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
           "docs": "Specifies the appearance style of the component.",
           "docsTags": [],
-          "default": "\"outline\"",
+          "default": "\"solid\"",
           "values": [
             {
-              "value": "outline",
+              "value": "outline-fill",
               "type": "string"
             },
             {
@@ -7165,36 +7236,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": "\"neutral\"",
-          "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",
@@ -7234,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",
@@ -10364,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\"",
@@ -13513,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,
@@ -13532,6 +13637,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -13848,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,
@@ -13870,6 +14000,14 @@
               "value": "info",
               "type": "string"
             },
+            {
+              "value": "inverse",
+              "type": "string"
+            },
+            {
+              "value": "neutral",
+              "type": "string"
+            },
             {
               "value": "success",
               "type": "string"
@@ -15380,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",
@@ -18636,7 +18791,7 @@
       "props": [
         {
           "name": "appearance",
-          "type": "\"clear\" | \"minimal\" | \"outline\" | \"solid\" | \"transparent\"",
+          "type": "\"outline\" | \"outline-fill\" | \"solid\" | \"transparent\"",
           "mutable": false,
           "attr": "appearance",
           "reflectToAttr": true,
@@ -18645,15 +18800,11 @@
           "default": "\"solid\"",
           "values": [
             {
-              "value": "clear",
-              "type": "string"
-            },
-            {
-              "value": "minimal",
+              "value": "outline",
               "type": "string"
             },
             {
-              "value": "outline",
+              "value": "outline-fill",
               "type": "string"
             },
             {
@@ -18668,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",
@@ -18761,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",
@@ -19392,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",
@@ -20320,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": [],
@@ -20472,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\"",
@@ -22491,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",