javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(radio-group): add compareWith property (#28452)

Browse Source
This commit is contained in:
Shawn Taylor
2023-11-09 10:21:55 -05:00
committed by GitHub
parent 27c4d194c5
commit 0ae327f0e0
12 changed files with 266 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
core/src/components/select/select.tsx
View File

@ -1,7 +1,7 @@
import type { ComponentInterface, EventEmitter } from '@stencil/core';
import { Component, Element, Event, Host, Method, Prop, State, Watch, h, forceUpdate } from '@stencil/core';
import type { LegacyFormController, NotchController } from '@utils/forms';
import { createLegacyFormController, createNotchController } from '@utils/forms';
import { compareOptions, createLegacyFormController, createNotchController, isOptionSelected } from '@utils/forms';
import { findItemLabel, focusElement, getAriaLabel, renderHiddenInput, inheritAttributes } from '@utils/helpers';
import type { Attributes } from '@utils/helpers';
import { printIonWarning } from '@utils/logging';
@ -82,7 +82,10 @@ export class Select implements ComponentInterface {
@Prop({ reflect: true }) color?: Color;
/**
* A property name or function used to compare object values
* This property allows developers to specify a custom function or property
* name for comparing objects when determining the selected option in the
* ion-select. When not specified, the default behavior will use strict
* equality (===) for comparison.
*/
@Prop() compareWith?: string | SelectCompareFn | null;
@ -1076,21 +1079,6 @@ Developers can use the "legacy" property to continue using the legacy form marku
}
}
const isOptionSelected = (
currentValue: any[] | any,
compareValue: any,
compareWith?: string | SelectCompareFn | null
) => {
if (currentValue === undefined) {
return false;
}
if (Array.isArray(currentValue)) {
return currentValue.some((val) => compareOptions(val, compareValue, compareWith));
} else {
return compareOptions(currentValue, compareValue, compareWith);
}
};
const getOptionValue = (el: HTMLIonSelectOptionElement) => {
const value = el.value;
return value === undefined ? el.textContent || '' : value;
@ -1106,20 +1094,6 @@ const parseValue = (value: any) => {
return value.toString();
};
const compareOptions = (
currentValue: any,
compareValue: any,
compareWith?: string | SelectCompareFn | null
): boolean => {
if (typeof compareWith === 'function') {
return compareWith(currentValue, compareValue);
} else if (typeof compareWith === 'string') {
return currentValue[compareWith] === compareValue[compareWith];
} else {
return Array.isArray(compareValue) ? compareValue.includes(currentValue) : currentValue === compareValue;
}
};
const generateText = (
opts: HTMLIonSelectOptionElement[],
value: any | any[],