npm - @esri/calcite-components - Versions diffs - 1.0.0-next.605 → 1.0.0-next.606 - Mend

@esri/calcite-components 1.0.0-next.605 → 1.0.0-next.606

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

package/dist/collection/components/color-picker/color-picker.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 import { h } from "@stencil/core";
 import Color from "color";
@@ -23,12 +23,16 @@ export class ColorPicker {
     //
     //--------------------------------------------------------------------------
     /**
-     * When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.
+     * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.
      *
-     * When true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.
+     * When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
      */
     this.allowEmpty = false;
-    /** specify the appearance - solid (containing border), or minimal (no containing border) */
+    /**
+     * Specifies the appearance style of the component -
+     *
+     * `"solid"` (containing border) or `"minimal"` (no containing border).
+     */
     this.appearance = "solid";
     /**
      * Internal prop for advanced use-cases.
@@ -37,146 +41,141 @@ export class ColorPicker {
      */
     this.color = DEFAULT_COLOR;
     /**
-     * When true, disabled prevents user interaction.
+     * When `true`, interaction is prevented and the component is displayed with lower opacity.
      */
     this.disabled = false;
     /**
-     * The format of the value property.
+     * The format of `value`.
      *
-     * When "auto", the format will be inferred from `value` when set.
+     * When `"auto"`, the format will be inferred from `value` when set.
      *
      * @default "auto"
      */
     this.format = defaultFormat;
-    /** When true, hides the hex input */
+    /** When `true`, hides the Hex input. */
     this.hideHex = false;
-    /** When true, hides the RGB/HSV channel inputs */
+    /** When `true`, hides the RGB/HSV channel inputs. */
     this.hideChannels = false;
-    /** When true, hides the saved colors section */
+    /** When `true`, hides the saved colors section. */
     this.hideSaved = false;
     /**
-     * Label used for the blue channel
+     * Accessible name for the RGB section's blue channel.
      *
      * @default "B"
      */
     this.intlB = TEXT.b;
     /**
-     * Label used for the blue channel description
+     * Accessible name for the RGB section's blue channel description.
      *
      * @default "Blue"
      */
     this.intlBlue = TEXT.blue;
     /**
-     * Label used for the delete color button.
+     * Accessible name for the delete color button.
      *
      * @default "Delete color"
      */
     this.intlDeleteColor = TEXT.deleteColor;
     /**
-     * Label used for the green channel
+     * Accessible name for the RGB section's green channel.
      *
      * @default "G"
      */
     this.intlG = TEXT.g;
     /**
-     * Label used for the green channel description
+     * Accessible name for the RGB section's green channel description.
      *
      * @default "Green"
      */
     this.intlGreen = TEXT.green;
     /**
-     * Label used for the hue channel
+     * Accessible name for the HSV section's hue channel.
      *
      * @default "H"
      */
     this.intlH = TEXT.h;
     /**
-     * Label used for the HSV mode
+     * Accessible name for the HSV mode.
      *
      * @default "HSV"
      */
     this.intlHsv = TEXT.hsv;
     /**
-     * Label used for the hex input
+     * Accessible name for the Hex input.
      *
      * @default "Hex"
      */
     this.intlHex = TEXT.hex;
     /**
-     * Label used for the hue channel description
+     * Accessible name for the HSV section's hue channel description.
      *
      * @default "Hue"
      */
     this.intlHue = TEXT.hue;
     /**
-     * Label used for the hex input when there is no color selected.
+     * Accessible name for the Hex input when there is no color selected.
      *
      * @default "No color"
      */
     this.intlNoColor = TEXT.noColor;
     /**
-     * Label used for the red channel
+     * Accessible name for the RGB section's red channel.
      *
      * @default "R"
      */
     this.intlR = TEXT.r;
     /**
-     * Label used for the red channel description
+     * Accessible name for the RGB section's red channel description.
      *
      * @default "Red"
      */
     this.intlRed = TEXT.red;
     /**
-     * Label used for the RGB mode
+     * Accessible name for the RGB mode.
      *
      * @default "RGB"
      */
     this.intlRgb = TEXT.rgb;
     /**
-     * Label used for the saturation channel
+     * Accessible name for the HSV section's saturation channel.
      *
      * @default "S"
      */
     this.intlS = TEXT.s;
     /**
-     * Label used for the saturation channel description
+     * Accessible name for the HSV section's saturation channel description.
      *
      * @default "Saturation"
      */
     this.intlSaturation = TEXT.saturation;
     /**
-     * Label used for the save color button.
+     * Accessible name for the save color button.
      *
      * @default "Save color"
      */
     this.intlSaveColor = TEXT.saveColor;
     /**
-     * Label used for the saved colors section
+     * Accessible name for the saved colors section.
      *
      * @default "Saved"
      */
     this.intlSaved = TEXT.saved;
     /**
-     * Label used for the value channel
+     * Accessible name for the HSV section's value channel.
      *
      * @default "V"
      */
     this.intlV = TEXT.v;
     /**
-     * Label used for the
+     * Accessible name for the HSV section's value channel description.
      *
      * @default "Value"
      */
     this.intlValue = TEXT.value;
-    /**
-     * The scale of the color picker.
-     */
+    /** Specifies the size of the component. */
     this.scale = "m";
     /**
-     * The component's value.
-     *
-     * This value can be either a CSS color string,
-     * a RGB, HSL or HSV object.
+     * The component's value, where the value can be a CSS color string, or a RGB, HSL or HSV object.
      *
      * The type will be preserved as the color is updated.
      *
@@ -853,7 +852,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.\n\nWhen true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty."
+          "text": "When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.\n\nWhen `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`."
         },
         "attribute": "allow-empty",
         "reflect": true,
@@ -876,7 +875,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "specify the appearance - solid (containing border), or minimal (no containing border)"
+          "text": "Specifies the appearance style of the component -\n\n`\"solid\"` (containing border) or `\"minimal\"` (no containing border)."
         },
         "attribute": "appearance",
         "reflect": true,
@@ -918,7 +917,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, disabled prevents user interaction."
+          "text": "When `true`, interaction is prevented and the component is displayed with lower opacity."
         },
         "attribute": "disabled",
         "reflect": true,
@@ -944,7 +943,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"auto\""
             }],
-          "text": "The format of the value property.\n\nWhen \"auto\", the format will be inferred from `value` when set."
+          "text": "The format of `value`.\n\nWhen `\"auto\"`, the format will be inferred from `value` when set."
         },
         "attribute": "format",
         "reflect": true,
@@ -962,7 +961,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, hides the hex input"
+          "text": "When `true`, hides the Hex input."
         },
         "attribute": "hide-hex",
         "reflect": true,
@@ -980,7 +979,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, hides the RGB/HSV channel inputs"
+          "text": "When `true`, hides the RGB/HSV channel inputs."
         },
         "attribute": "hide-channels",
         "reflect": true,
@@ -998,7 +997,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When true, hides the saved colors section"
+          "text": "When `true`, hides the saved colors section."
         },
         "attribute": "hide-saved",
         "reflect": true,
@@ -1019,7 +1018,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"B\""
             }],
-          "text": "Label used for the blue channel"
+          "text": "Accessible name for the RGB section's blue channel."
         },
         "attribute": "intl-b",
         "reflect": false,
@@ -1040,7 +1039,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Blue\""
             }],
-          "text": "Label used for the blue channel description"
+          "text": "Accessible name for the RGB section's blue channel description."
         },
         "attribute": "intl-blue",
         "reflect": false,
@@ -1061,7 +1060,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Delete color\""
             }],
-          "text": "Label used for the delete color button."
+          "text": "Accessible name for the delete color button."
         },
         "attribute": "intl-delete-color",
         "reflect": false,
@@ -1082,7 +1081,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"G\""
             }],
-          "text": "Label used for the green channel"
+          "text": "Accessible name for the RGB section's green channel."
         },
         "attribute": "intl-g",
         "reflect": false,
@@ -1103,7 +1102,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Green\""
             }],
-          "text": "Label used for the green channel description"
+          "text": "Accessible name for the RGB section's green channel description."
         },
         "attribute": "intl-green",
         "reflect": false,
@@ -1124,7 +1123,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"H\""
             }],
-          "text": "Label used for the hue channel"
+          "text": "Accessible name for the HSV section's hue channel."
         },
         "attribute": "intl-h",
         "reflect": false,
@@ -1145,7 +1144,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"HSV\""
             }],
-          "text": "Label used for the HSV mode"
+          "text": "Accessible name for the HSV mode."
         },
         "attribute": "intl-hsv",
         "reflect": false,
@@ -1166,7 +1165,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Hex\""
             }],
-          "text": "Label used for the hex input"
+          "text": "Accessible name for the Hex input."
         },
         "attribute": "intl-hex",
         "reflect": false,
@@ -1187,7 +1186,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Hue\""
             }],
-          "text": "Label used for the hue channel description"
+          "text": "Accessible name for the HSV section's hue channel description."
         },
         "attribute": "intl-hue",
         "reflect": false,
@@ -1208,7 +1207,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"No color\""
             }],
-          "text": "Label used for the hex input when there is no color selected."
+          "text": "Accessible name for the Hex input when there is no color selected."
         },
         "attribute": "intl-no-color",
         "reflect": false,
@@ -1229,7 +1228,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"R\""
             }],
-          "text": "Label used for the red channel"
+          "text": "Accessible name for the RGB section's red channel."
         },
         "attribute": "intl-r",
         "reflect": false,
@@ -1250,7 +1249,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Red\""
             }],
-          "text": "Label used for the red channel description"
+          "text": "Accessible name for the RGB section's red channel description."
         },
         "attribute": "intl-red",
         "reflect": false,
@@ -1271,7 +1270,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"RGB\""
             }],
-          "text": "Label used for the RGB mode"
+          "text": "Accessible name for the RGB mode."
         },
         "attribute": "intl-rgb",
         "reflect": false,
@@ -1292,7 +1291,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"S\""
             }],
-          "text": "Label used for the saturation channel"
+          "text": "Accessible name for the HSV section's saturation channel."
         },
         "attribute": "intl-s",
         "reflect": false,
@@ -1313,7 +1312,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Saturation\""
             }],
-          "text": "Label used for the saturation channel description"
+          "text": "Accessible name for the HSV section's saturation channel description."
         },
         "attribute": "intl-saturation",
         "reflect": false,
@@ -1334,7 +1333,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Save color\""
             }],
-          "text": "Label used for the save color button."
+          "text": "Accessible name for the save color button."
         },
         "attribute": "intl-save-color",
         "reflect": false,
@@ -1355,7 +1354,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Saved\""
             }],
-          "text": "Label used for the saved colors section"
+          "text": "Accessible name for the saved colors section."
         },
         "attribute": "intl-saved",
         "reflect": false,
@@ -1376,7 +1375,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"V\""
             }],
-          "text": "Label used for the value channel"
+          "text": "Accessible name for the HSV section's value channel."
         },
         "attribute": "intl-v",
         "reflect": false,
@@ -1397,7 +1396,7 @@ export class ColorPicker {
               "name": "default",
               "text": "\"Value\""
             }],
-          "text": "Label used for the"
+          "text": "Accessible name for the HSV section's value channel description."
         },
         "attribute": "intl-value",
         "reflect": false,
@@ -1420,7 +1419,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "The scale of the color picker."
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true,
@@ -1438,7 +1437,7 @@ export class ColorPicker {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Storage ID for colors."
+          "text": "Specifies the storage ID for colors."
         },
         "attribute": "storage-id",
         "reflect": true
@@ -1491,7 +1490,7 @@ export class ColorPicker {
               "name": "see",
               "text": "[ColorValue](https://github.com/Esri/calcite-components/blob/master/src/components/color-picker/interfaces.ts#L10)"
             }],
-          "text": "The component's value.\n\nThis value can be either a CSS color string,\na RGB, HSL or HSV object.\n\nThe type will be preserved as the color is updated."
+          "text": "The component's value, where the value can be a CSS color string, or a RGB, HSL or HSV object.\n\nThe type will be preserved as the color is updated."
         },
         "attribute": "value",
         "reflect": false,
@@ -1537,7 +1536,7 @@ export class ColorPicker {
         "composed": true,
         "docs": {
           "tags": [],
-          "text": "Fires as the color value changes.\n\nThis is similar to the change event with the exception of dragging. When dragging the color field or hue slider thumb, this event fires as the thumb is moved."
+          "text": "Fires as the color value changes.\n\nSimilar to the `calciteColorPickerChange` event with the exception of dragging. When dragging the color field or hue slider thumb, this event fires as the thumb is moved."
         },
         "complexType": {
           "original": "void",

package/dist/collection/components/color-picker/resources.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 import Color from "color";
 export const CSS = {

package/dist/collection/components/color-picker/utils.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 export function rgbToHex(color) {
   const { r, g, b } = color;

package/dist/collection/components/color-picker-hex-input/color-picker-hex-input.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 import { h } from "@stencil/core";
 import { hexChar, isLonghandHex, isValidHex, normalizeHex, rgbToHex } from "../color-picker/utils";
@@ -18,29 +18,27 @@ export class ColorPickerHexInput {
     //
     //--------------------------------------------------------------------------
     /**
-     * When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.
+     * When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.
      *
-     * When true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty.
+     * When `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`.
      */
     this.allowEmpty = false;
     /**
-     * Label used for the hex input.
+     * Accessible name for the Hex input.
      *
      * @default "Hex"
      */
     this.intlHex = TEXT.hex;
     /**
-     * Label used for the hex input when there is no color selected.
+     * Accessible name for the Hex input when there is no color selected.
      *
      * @default "No color"
      */
     this.intlNoColor = TEXT.noColor;
-    /**
-     * The component's scale.
-     */
+    /** Specifies the size of the component. */
     this.scale = "m";
     /**
-     * The hex value.
+     * The Hex value.
      */
     this.value = normalizeHex(DEFAULT_COLOR.hex());
     this.onCalciteInternalInputBlur = () => {
@@ -213,7 +211,7 @@ export class ColorPickerHexInput {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.\n\nWhen true, clearing the input and blurring will restore the last valid color set. When false, it will set it to empty."
+          "text": "When `false`, an empty color (`null`) will be allowed as a `value`. Otherwise, a color value is enforced on the component.\n\nWhen `true`, a color value is enforced, and clearing the input or blurring will restore the last valid `value`. When `false`, an empty color (`null`) will be allowed as a `value`."
         },
         "attribute": "allow-empty",
         "reflect": false,
@@ -234,7 +232,7 @@ export class ColorPickerHexInput {
               "name": "default",
               "text": "\"Hex\""
             }],
-          "text": "Label used for the hex input."
+          "text": "Accessible name for the Hex input."
         },
         "attribute": "intl-hex",
         "reflect": false,
@@ -255,7 +253,7 @@ export class ColorPickerHexInput {
               "name": "default",
               "text": "\"No color\""
             }],
-          "text": "Label used for the hex input when there is no color selected."
+          "text": "Accessible name for the Hex input when there is no color selected."
         },
         "attribute": "intl-no-color",
         "reflect": false,
@@ -278,7 +276,7 @@ export class ColorPickerHexInput {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "The component's scale."
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true,
@@ -296,7 +294,7 @@ export class ColorPickerHexInput {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "The hex value."
+          "text": "The Hex value."
         },
         "attribute": "value",
         "reflect": true,

package/dist/collection/components/color-picker-hex-input/resources.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/color-picker-swatch/color-picker-swatch.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 import { h } from "@stencil/core";
 import Color from "color";
@@ -15,11 +15,11 @@ export class ColorPickerSwatch {
     //
     //--------------------------------------------------------------------------
     /**
-     * Used to display whether the swatch is active or not.
+     * When `true`, the component is active.
      */
     this.active = false;
     /**
-     * The component scale.
+     * Specifies the size of the component.
      */
     this.scale = "m";
   }
@@ -68,7 +68,7 @@ export class ColorPickerSwatch {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Used to display whether the swatch is active or not."
+          "text": "When `true`, the component is active."
         },
         "attribute": "active",
         "reflect": true,
@@ -111,7 +111,7 @@ export class ColorPickerSwatch {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "The component scale."
+          "text": "Specifies the size of the component."
         },
         "attribute": "scale",
         "reflect": true,

package/dist/collection/components/color-picker-swatch/resources.js CHANGED Viewed

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-next.605
+ * v1.0.0-next.606
  */
 export const CSS = {
   swatch: "swatch",

package/dist/collection/components/combobox/combobox.css CHANGED Viewed

@@ -96,7 +96,7 @@
 *
 * These properties can be overridden using the component's tag as selector.
 *
-* @prop --calcite-combobox-input-height: the height of the combobox input
+* @prop --calcite-combobox-input-height: Specifies the height of the component's input.
 */
 :host {
   position: relative;