NativeScript/nativescript-core/ui/list-picker/list-picker-common.ts

import { View, CSSType } from "../core/view";
import { Property, CoercibleProperty } from "../core/properties";

export interface ItemsSource {
	length: number;
	getItem(index: number): any;
}

@CSSType("ListPicker")
export class ListPickerBase extends View {
	public selectedIndex: number;
	public items: any[] | ItemsSource;
	public isItemsSource: boolean;
	public textField: string;
	public valueField: string;
	public selectedValue: any;

	public _getItemAsString(index: number): any {
		let items = this.items;
		if (!items) {
			return " ";
		}

		let item = this.isItemsSource
			? (<ItemsSource>this.items).getItem(index)
			: this.items[index];

		return item === undefined || item === null
			? index + ""
			: this.parseItem(item);
	}

	private parseItem(item) {
		return this.textField ? item[this.textField] + "" : item + "";
	}

	public updateSelectedValue(index) {
		let newVal = null;
		if (index >= 0) {
			const item = this.items[index];

			newVal = this.valueField ? item[this.valueField] : item;
		}

		if (this.selectedValue !== newVal) {
			this.set("selectedValue", newVal);
		}
	}
}

ListPickerBase.prototype.recycleNativeView = "auto";

export const selectedIndexProperty = new CoercibleProperty<
	ListPickerBase,
	number
>({
	name: "selectedIndex",
	defaultValue: -1,
	valueConverter: (v) => parseInt(v),
	coerceValue: (target, value) => {
		let items = target.items;
		if (items) {
			let max = items.length - 1;
			if (value < 0) {
				value = 0;
			}
			if (value > max) {
				value = max;
			}
		} else {
			value = -1;
		}

		target.updateSelectedValue(value);

		return value;
	},
});
selectedIndexProperty.register(ListPickerBase);

export const itemsProperty = new Property<ListPickerBase, any[] | ItemsSource>({
	name: "items",
	valueChanged: (target, oldValue, newValue) => {
		let getItem = newValue && (<ItemsSource>newValue).getItem;
		target.isItemsSource = typeof getItem === "function";
	},
});
itemsProperty.register(ListPickerBase);

export const textFieldProperty = new Property<ListPickerBase, string>({
	name: "textField",
	defaultValue: "",
});
textFieldProperty.register(ListPickerBase);

export const valueFieldProperty = new Property<ListPickerBase, string>({
	name: "valueField",
	defaultValue: "",
});
valueFieldProperty.register(ListPickerBase);

export const selectedValueProperty = new Property<ListPickerBase, string>({
	name: "selectedValue",
	defaultValue: null,
});
selectedValueProperty.register(ListPickerBase);