Price Object
9.2.4
A description of this component is work in progress.
| Namn | Typ | Beskrivning |
|---|---|---|
className | string | Optional CSS class name. |
currency | "SEK" |
"EUR" | Currency of the price. Default is SEK. |
customAttribute | { attribute: string; value: string |
number } | Custom attribute for testing. Subcomponents will have this attribute suffixed with "-[ComponentName]". |
disabled | boolean | If true, the component is disabled. |
fontVariant | "h1" |
"h2" |
"h3" |
"h4" |
"subtitle1" |
"body1" |
"h1Small" | Typography variant styling applied to the price text. |
hidePricePrefix | boolean | When true, hides the prefix that appears before the price. |
leftAligned | boolean | Ensures price alignment to the left on small or zoomed-in viewports. |
locale | InputLanguage | Locale setting for formatting the price and points. |
pricePrefix | "from" |
"add" |
"addFrom" | Text prefix displayed before the price. |
priceType | "standard" |
"textSecondary" |
"lowPrice" | Defines the color for the price. |
sx | SxProps | Custom styles applied to the component. |
useFontVariantOnBothPriceAndPoints | boolean | When true, applies the fontVariant to both price and points. Defaults to false. |
wrapPrefixAndPrice | boolean | Wraps the price prefix and the price into separate lines, useful for long prefixes. |
npm install @sj-ab/component-library.ui.price-objectPrice Object har inbyggt stöd för att förbättra uppläsningen av priser för gravt synskadade användare med skärmläsare.
Komponenten ersätter automatiskt den synliga texten med en lite mer utförlig text utan förkortningar:
Detta görs genom att dölja den synliga texten med aria-hidden och lägga in dold text med <Typography variant="srOnly">
Alla utvecklare som uppdaterar PriceObject ansvarar för att också uppdatera uppläsningen!
Importer av Price Object
Repos med Price Object
Senaste installerade version av Price Object
Äldsta installerade version av Price Object