generated:catalog.entry.rate-picker.title
generated:catalog.entry.rate-picker.description
@xngui/components/rate-picker@xngui/components/rate-pickerchrome:demo.section
chrome:demo.preview
import { Component } from '@angular/core';
import { XForm } from '@xngui/components/form';
import { XRatePicker } from '@xngui/components/rate-picker';
import { XIcon } from '@xngui/icons';
@Component({
selector: 'app-example',
imports: [XForm, XRatePicker, XIcon],
templateUrl: './rate-picker.component.html',
})
export class ExampleComponent {}
chrome:demo.events.title
chrome:demo.events.empty
chrome:demo.api.title
x-rate-picker
chrome:demo.api.col.property
chrome:demo.api.col.type
chrome:demo.api.col.default
chrome:demo.api.col.description
maxnumber—Maximum star count — defaults to `5` when unset.
precisionXRatePickerPrecision1Minimum selectable increment — `1` for whole stars or `0.5` for half stars.
allowClearbooleantrueRe-clicking or double-tapping the active rating clears the value when true.
variantXVariant—Highlight color role for filled icons — falls back to XConfigService when unset.
sizeXSize—Visual size tier — falls back to XConfigService when unset.
densityXDensity—Spacing offsets — orthogonal to `size`; falls back to XConfigService when unset.
labelstring''Visible label text above the stars.
descriptionstring''Optional helper text under the label.
ariaLabelstring—Accessible name when no visible `label` is provided.
namestring''Native form control `name` attribute.
controlIdstring—Native `id` on the focusable control; falls back to `name`, then a generated id.
disabledbooleanfalsePrevents interaction and sets `aria-disabled` on the control surface.
readonlybooleanfalseValue-only input — user cannot change when true.
invalidbooleanfalseMarks the control invalid for styling and ARIA.
requiredbooleanfalseMarks the control as required for validation and ARIA.