@arcgis/charts-components 5.0.0-next.13 → 5.0.0-next.131

package/dist/model/mixins/utils/tooltips.d.ts

@@ -1,37 +1,37 @@
 import { ChartConfig } from '../../../utils';
 /**
  * Gets the visibility of the data tooltips.
- * @param config The chart configuration object
- * @param seriesIndex The index of the series.
- * @returns {boolean}
- * @remarks
- * a. If the seriesIndex is provided, the visibility for that series will be returned. Otherwise, the visibility of the first series will be returned.
- * b. If the visibility is not set on the series, the default value of `true` will be returned.
+ * - If the seriesIndex is provided, the visibility for that series will be returned. Otherwise, the visibility of the first series will be returned.
+ * - If the visibility is not set on the series, the default value of `true` will be returned.
+ *
+ * @param config - The chart configuration object
+ * @param seriesIndex - The index of the series.
  */
 export declare const getDataTooltipVisibility: (config: ChartConfig, seriesIndex?: number) => boolean;
 /**
  * Sets the visibility of the data tooltips.
- * @param config The chart configuration object
- * @param visibility The visibility of the data tooltips.
- * @param seriesIndex The index of the series.
- * @remarks If the seriesIndex is provided, the visibility will be set for that series only. Otherwise, the visibility will be set for all series.
+ *
+ * **Note**: If the seriesIndex is provided, the visibility will be set for that series only. Otherwise, the visibility will be set for all series.
+ *
+ * @param config - The chart configuration object
+ * @param visibility - The visibility of the data tooltips.
+ * @param seriesIndex - The index of the series.
  */
 export declare const setDataTooltipVisibility: (config: ChartConfig, visibility: boolean, seriesIndex?: number) => void;
 /**
  * Gets the setting of the `dataTooltipReverseColor` property.
- * @param config The chart configuration object
- * @param seriesIndex The index of the series.
- * @returns {boolean}
- * @remarks
- * a. If the seriesIndex is provided, the dataTooltipReverseColor for that series will be returned. Otherwise, the same property of the first series will be returned.
- * b. If the dataTooltipReverseColor is not set on the series, the default value of `false` will be returned.
+ * - If the seriesIndex is provided, the dataTooltipReverseColor for that series will be returned. Otherwise, the same property of the first series will be returned.
+ * - If the dataTooltipReverseColor is not set on the series, the default value of `false` will be returned.
+ *
+ * @param config - The chart configuration object
+ * @param seriesIndex - The index of the series
  */
 export declare const getDataTooltipReverseColor: (config: ChartConfig, seriesIndex?: number) => boolean;
 /**
+ * **Note**: If the seriesIndex is provided, the reverse color will be set for that series only. Otherwise, the reverse color will be set for all series.
  *
- * @param config The chart configuration object
- * @param reverseColor Indicator of whether to reverse the color.
- * @param seriesIndex The index of the series to set the reverse color.
- * @remarks If the seriesIndex is provided, the reverse color will be set for that series only. Otherwise, the reverse color will be set for all series.
+ * @param config - The chart configuration object
+ * @param reverseColor - Indicator of whether to reverse the color.
+ * @param seriesIndex - The index of the series to set the reverse color.
  */
 export declare const setDataTooltipReverseColor: (config: ChartConfig, reverseColor: boolean, seriesIndex?: number) => void;

package/dist/model/pie-chart-model/pie-chart-legend-model.d.ts

@@ -1,47 +1,61 @@
 import { ModelWithLegend } from '../mixins/model-with-legend';
+import { MixinInstances } from '../shared/utils';
 export declare abstract class PieChartLegendModel extends ModelWithLegend {
     /**
      * Gets the setting for the display of numerical value in the legend items.
-     * @returns {boolean}
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
      */
     getDisplayNumericValue(): boolean;
     /**
      * Sets the setting for the display of numerical value in the legend items.
-     * @param displayNumericValue The setting for the display of numerical value in the legend items
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
+     *
+     * @param displayNumericValue - The setting for the display of numerical value in the legend items
      */
     setDisplayNumericValue(displayNumericValue: boolean): void;
     /**
      * Gets the setting for the display of percentage in the legend items.
-     * @returns {boolean}
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
      */
     getDisplayPercentage(): boolean;
     /**
      * Sets the setting for the display of percentage in the legend items.
-     * @param displayPercentage The setting for the display of percentage in the legend items
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
+     *
+     * @param displayPercentage - The setting for the display of percentage in the legend items
      */
     setDisplayPercentage(displayPercentage: boolean): void;
     /**
      * Gets the maximum width in pixel for the legend item labels.
-     * @returns {number}
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
      */
     getLabelMaxWidth(): number;
     /**
      * Sets the maximum width in pixel for the legend item labels.
-     * @param labelMaxWidth The maximum width in pixel for the legend item labels
-     * @remarks
-     * This setting is only applicable to pie charts.
+     *
+     * **Note**: This setting is only applicable to pie charts.
+     *
+     * @param labelMaxWidth - The maximum width in pixel for the legend item labels
+     */
+    setLabelMaxWidth(labelMaxWidth: number | undefined): void;
+    /**
+     * The maximum width in pixel for the legend value labels.
+     * @returns {number}
+     */
+    get valueLabelMaxWidth(): number;
+    set valueLabelMaxWidth(valueLabelMaxWidth: number | undefined);
+    /**
+     * Whether to display the category in the legend.
      */
-    setLabelMaxWidth(labelMaxWidth: number): void;
+    get displayCategory(): boolean;
+    set displayCategory(displayCategory: boolean);
 }
-export interface PieChartLegendModel extends ModelWithLegend {
+declare const pieChartLegendMixins: readonly [typeof ModelWithLegend];
+export interface PieChartLegendModel extends MixinInstances<typeof pieChartLegendMixins> {
 }
+export {};

package/dist/model/pie-chart-model/pie-chart-model.d.ts

@@ -1,10 +1,17 @@
-import { Color, ISimpleLineSymbol, WebChart, WebChartPieChartGroupSlice, WebChartPieChartSlice, WebChartStatisticType } from '../../spec';
-import { ChartConfig, ChartTypes } from '../../utils';
 import { ChartModel } from '../chart-model/chart-model';
 import { ModelParams } from '../interfaces/chart-interfaces';
 import { LayerInfo, ModelTypes, PieChartDataSortingKinds, PieChartSlicesDisplay, PieChartDataModes } from '../interfaces/common';
-import { ModelWithColorMatch, ModelWithDataLabels, ModelWithTooltips } from '../mixins';
+import { ModelWithTooltips } from '../mixins';
+import { WithColorMatch } from '../properties/color-match';
+import { WithDataLabelsVisibility } from '../properties/data-labels/data-labels-visibility';
+import { WithDataLabelsSymbol } from '../properties/data-labels/data-labels-symbol';
+import { MixinInstances } from '../shared/utils';
 import { PieChartLegendModel } from './pie-chart-legend-model';
+import { ChartConfig } from '../../utils/types/index';
+import { WebChart, WebChartPieChartGroupSlice, WebChartPieChartSlice } from '../../spec/web-chart';
+import { WebChartStatisticType } from '../../spec/chart-object-literals';
+import { ChartTypes } from '../../utils/misc/index';
+import { Color, ISimpleLineSymbol } from '../../spec/rest-js-types';
 export declare class PieChartModel extends ChartModel {
     /**
      * Current configuration used for the pie chart
@@ -12,19 +19,14 @@ export declare class PieChartModel extends ChartModel {
     protected _config: ChartConfig<typeof ModelTypes.PieChart, WebChart>;
     protected _chartType: ChartTypes;
     /**
-     * Protected property to hold the pie chart data mode (Category or Fields)
-     *
-     * `category` - The chart will use values from the category field to determine each slice.
-     *
-     * `fields` - The chart will use aggregated values from the numeric fields to determine each slice.
-     *
-     * @category Protected
+     * Protected property to hold the pie chart data mode
+     * - `category`: the chart will use values from the category field to determine each slice.
+     * - `fields`: the chart will use aggregated values from the numeric fields to determine each slice.
      */
     protected _mode: PieChartDataModes;
     protected layerInfo: LayerInfo;
     /**
-     * Array of hidden grouped slice ids
-     * @category Private
+     * Array of hidden grouped slice ids.
      */
     private _groupedSliceIds;
     setup(params: ModelParams<ChartConfig<typeof ModelTypes.PieChart>>): Promise<void>;
@@ -45,13 +47,13 @@ export declare class PieChartModel extends ChartModel {
     set aggregationType(aggregationType: WebChartStatisticType);
     /**
      * Gets the sort order for the pie chart.
-     * @returns {PieChartDataSortingKinds}
      */
     getSortOrder(): PieChartDataSortingKinds;
     /**
      * Sets the sort order for the pie chart.
-     * @param {PieChartDataSortingKinds} sortOrder The sort order.
-     * @param {string[]} orderByList The list of category values.
+     *
+     * @param sortOrder - The sort order.
+     * @param orderByList - The list of category values.
      */
     setSortOrder(sortOrder: PieChartDataSortingKinds, orderByList?: string[]): void;
     /**
@@ -68,14 +70,14 @@ export declare class PieChartModel extends ChartModel {
     set mode(mode: PieChartDataModes);
     /**
      * Gets the list of the category values for the chart.
-     * @returns {string[]}
      */
     getCustomSortValues(): Promise<string[]>;
     /**
      * Moves the custom sort values in-place for the order by list in the config.
      * **Note:** This method should be only used when the sort order is set to `customSort`.
-     * @param {number} fromIndex The index to move the custom sort item from.
-     * @param {number} toIndex The index to move the category item to.
+     *
+     * @param fromIndex - The index to move the custom sort item from.
+     * @param toIndex - The index to move the category item to.
      */
     moveCustomSortValuesInOrderByList(fromIndex: number, toIndex: number): void;
     /**
@@ -126,32 +128,34 @@ export declare class PieChartModel extends ChartModel {
     protected generateDefaultConfig(): Omit<typeof this._config, "iLayer">;
     /**
      * Gets the original name of the slice based on the slice index.
-     * @param {number} sliceIndex - The index of the slice.
-     * @returns {Date | number | string | null | undefined}
+     *
+     * @param sliceIndex - The index of the slice.
      */
     getOriginalSliceName(sliceIndex: number): Date | number | string | null | undefined;
     /**
      * Gets the name of the slice based on the slice index. If the index is out of bounds, this function will return `undefined`.
-     * @param {number} sliceIndex The index of the slice.
-     * @returns {string | undefined}
+     *
+     * @param sliceIndex - The index of the slice.
      */
     getSliceName(sliceIndex: number): string | undefined;
     /**
      * Sets name of the slice based on the slice index.
-     * @param {string} name The name for the slice.
-     * @param {number} sliceIndex The index of the slice.
+     *
+     * @param name - The name for the slice.
+     * @param sliceIndex - The index of the slice.
      */
     setSliceName(name: string, sliceIndex: number): void;
     /**
      * Gets the color of the slice based on the slice index. If the index is out of bounds, this function will return `undefined`.
-     * @param {number} sliceIndex The index of the slice.
-     * @returns {Color | undefined}
+     *
+     * @param sliceIndex - The index of the slice.
      */
     getSliceColor(sliceIndex: number): Color | undefined;
     /**
      * Sets the color of the slice based on the slice index.
-     * @param {Color | undefined} color The color for the slice.
-     * @param {number} sliceIndex The index of the slice.
+     *
+     * @param color - The color for the slice.
+     * @param sliceIndex - The index of the slice.
      */
     setSliceColor(color: Color | undefined, sliceIndex: number): void;
     /**
@@ -161,25 +165,25 @@ export declare class PieChartModel extends ChartModel {
     set orderOfSlices(order: string[] | undefined);
     /**
      * Moves a series from one index in the series array to another.
-     * @param {number} fromIndex Index to move the series from.
-     * @param {number} toIndex Index to move the series to.
+     *
+     * @param fromIndex - Index to move the series from.
+     * @param toIndex - Index to move the series to.
      */
     moveSeries(fromIndex: number, toIndex: number): void;
     /**
      * Gets the slice id for a given slice index. If the index is out of bounds, this function will return `undefined`.
-     * @param {number} sliceIndex The index of the slice.
-     * @returns {string | undefined}
+     *
+     * @param sliceIndex - The index of the slice.
      */
     getSliceId(sliceIndex: number): string | undefined;
     /**
      * Gets the slice index for a given slice id. If the `sliceId` is not found, this function will return `undefined`.
-     * @param {string} sliceId The id of the slice.
-     * @returns {number | undefined}
+     *
+     * @param sliceId - The id of the slice.
      */
     getSliceIndex(sliceId: string): number | undefined;
     /**
      * Gets the length of the slices array.
-     * @returns {number}
      */
     getSlicesLength(): number;
     /**
@@ -188,7 +192,6 @@ export declare class PieChartModel extends ChartModel {
     resetSlices(): void;
     /**
      * Returns whether the series styling is able to be reset.
-     * @returns {boolean}
      */
     resetAvailable(): boolean;
     /**
@@ -206,21 +209,42 @@ export declare class PieChartModel extends ChartModel {
      */
     get endAngle(): number | null | undefined;
     set endAngle(angle: number | null | undefined);
+    /**
+     * Whether to display the category on the data label.
+     * **Note:** If the setting is not found in the config, it will default to `true`.
+     */
+    get displayCategoryOnDataLabel(): boolean;
+    set displayCategoryOnDataLabel(display: boolean);
     /**
      * Display category value on tooltip setting from the chart config.
-     * @remarks If the setting is not found in the config, it will default to `true`.
+     *
+     * **Note**: If the setting is not found in the config, it will default to `true`.
      */
     get displayCategoryValueOnTooltip(): boolean;
     set displayCategoryValueOnTooltip(display: boolean);
+    /**
+     * Whether to display the numeric value on the data label.
+     * **Note:** If the setting is not found in the config, it will default to `true`.
+     */
+    get displayNumericValueOnDataLabel(): boolean;
+    set displayNumericValueOnDataLabel(display: boolean);
+    /**
+     * Whether to display the percentage on the data label.
+     * **Note:** If the setting is not found in the config, it will default to `true`.
+     */
+    get displayPercentageOnDataLabel(): boolean;
+    set displayPercentageOnDataLabel(display: boolean);
     /**
      * Display numeric value on tooltip setting from the chart config.
-     * @remarks If the setting is not found in the config, it will default to `true`.
+     *
+     * **Note**: If the setting is not found in the config, it will default to `true`.
      */
     get displayNumericValueOnTooltip(): boolean;
     set displayNumericValueOnTooltip(display: boolean);
     /**
      * Display percentage on tooltip setting from the chart config.
-     * @remarks If the setting is not found in the config, it will default to `true`.
+     *
+     * **Note**: If the setting is not found in the config, it will default to `true`.
      */
     get displayPercentageOnTooltip(): boolean;
     set displayPercentageOnTooltip(display: boolean);
@@ -266,10 +290,10 @@ export declare class PieChartModel extends ChartModel {
     set optimizeDataLabelsOverlapping(optimize: boolean | undefined);
     /**
      * Generate the proper chart title given the current config.
-     *
-     * @returns {string}
      */
     generateChartTitle(): string;
 }
-export interface PieChartModel extends PieChartLegendModel, ModelWithTooltips, ModelWithColorMatch, ModelWithDataLabels {
+declare const pieChartMixins: readonly [typeof PieChartLegendModel, typeof ModelWithTooltips, typeof WithColorMatch, typeof WithDataLabelsVisibility, typeof WithDataLabelsSymbol];
+export interface PieChartModel extends MixinInstances<typeof pieChartMixins> {
 }
+export {};

package/dist/model/pie-chart-model/utils/pie-chart-data.d.ts

@@ -19,10 +19,11 @@ export declare const getNumericFields: (config: ChartConfig<typeof ModelTypes.Pi
 export declare const getAggregationType: (config: ChartConfig<typeof ModelTypes.PieChart>, mode: PieChartDataModes) => WebChartStatisticType;
 /**
  * Gets the proper chart title given the current config.
- * @param {ChartConfig<typeof ModelTypes.PieChart>} props.config - The chart config.
- * @param {LayerInfo} props.layerInfo - The layer info.
- * @param {CommonStrings} props.commonStrings - The common strings.
- * @param {PieChartDataModes} props.mode - The pie chart data mode.
+ *
+ * @param props.config - The chart config.
+ * @param props.layerInfo - The layer info.
+ * @param props.commonStrings - The common strings.
+ * @param props.mode - The pie chart data mode.
  */
 export declare function getChartTitle(props: {
     config: ChartConfig<typeof ModelTypes.PieChart>;

package/dist/model/pie-chart-model/utils/pie-chart-legend.d.ts

@@ -1,65 +1,81 @@
 import { ChartConfig } from '../../../utils';
 /**
  * Gets the display of numerical value setting for the legend items from the chart config.
- * @param config The chart configuration object
- * @returns {boolean}
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param config - The chart configuration object
  */
 export declare const getDisplayNumericValue: (config: ChartConfig) => boolean;
 /**
  * Sets the display of numerical value setting for the legend items in the chart config.
- * @param displayNumericValue The setting for the display of numerical value in the legend
- * @param config The chart configuration object
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param displayNumericValue - The setting for the display of numerical value in the legend
+ * @param config - The chart configuration object
  */
 export declare const setDisplayNumericValue: (displayNumericValue: boolean, config: ChartConfig) => void;
 /**
  * Gets the display of category setting for the legend items from the chart config.
- * @param config The chart configuration object
- * @returns {boolean}
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param config - The chart configuration object
  */
 export declare const getDisplayCategory: (config: ChartConfig) => boolean;
 /**
  * Sets the display of category setting for the legend items in the chart config.
- * @param displayCategory The setting for the display of category in the legend
- * @param config The chart configuration object
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param displayCategory - The setting for the display of category in the legend
+ * @param config - The chart configuration object
  */
 export declare const setDisplayCategory: (displayCategory: boolean, config: ChartConfig) => void;
 /**
  * Gets the display of percentage setting for the legend items from the chart config.
- * @param config The chart configuration object
- * @returns {boolean}
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param config - The chart configuration object
  */
 export declare const getDisplayPercentage: (config: ChartConfig) => boolean;
 /**
  * Sets the display of percentage setting for the legend items in the chart config.
- * @param displayPercentage The setting for the display of percentage in the legend
- * @param config The chart configuration object
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param displayPercentage - The setting for the display of percentage in the legend
+ * @param config - The chart configuration object
  */
 export declare const setDisplayPercentage: (displayPercentage: boolean, config: ChartConfig) => void;
 /**
  * Gets the maximum width in pixel for the legend item labels from the chart config.
- * @param config The chart configuration object
- * @returns {number}
- * @remarks
- * This setting is only applicable to pie charts.
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param config - The chart configuration object
  */
 export declare const getLabelMaxWidth: (config: ChartConfig) => number;
 /**
  * Sets the maximum width in pixel for the legend item labels in the chart config.
- * @param displayPercentage The maximum width in pixel for the legend item labels
+ *
+ * **Note**: This setting is only applicable to pie charts.
+ *
+ * @param labelMaxWidth - The maximum width in pixel for the legend item labels
+ * @param config - The chart configuration object
+ */
+export declare const setLabelMaxWidth: (labelMaxWidth: number | undefined, config: ChartConfig) => void;
+/**
+ * Gets the maximum width in pixel for the legend value labels.
+ * @param config The chart configuration object
+ * @returns {number}
+ */
+export declare const getValueLabelMaxWidth: (config: ChartConfig) => number;
+/**
+ * Sets the maximum width in pixel for the legend value labels.
+ * @param valueLabelMaxWidth The maximum width in pixel for the legend value labels
  * @param config The chart configuration object
- * @remarks
- * This setting is only applicable to pie charts.
  */
-export declare const setLabelMaxWidth: (labelMaxWidth: number, config: ChartConfig) => void;
+export declare const setValueLabelMaxWidth: (valueLabelMaxWidth: number | undefined, config: ChartConfig) => void;