import { CSSResultGroup } from "lit"; import { SigveloElement } from "@mcp-b/wc-support/base/sigvelo-element"; //#region src/components/number/number.d.ts /** * * * @summary Outputs a formatted number with support for currency, percentages, and units. * @tag sigvelo-number * @documentation https://design-system.sigvelo.com/docs/components/number * @status stable * @since 1.0 * * @example Default * ```html * * ``` * * @example Grouping * The formatter groups numbers with thousands separators by default. To turn it off, set the `grouping` attribute to `never`. * * ```html *
* ``` * * @example Currency * To format currency, set `type="currency"` and apply the appropriate ISO 4217 code to the `currency` attribute. * * ```html *
*
* * ``` * * @example Percentages * To format a percentage, set `type="percent"`. * * ```html *
*
*
* ``` * * @example Units * You can format a variety of different units. Possible values can be found here. * * ```html *
*
*
*
*
*
*
*
*
* ``` * * Use the `unit-display` attribute to change how units are output. Possible values include `narrow`, `short`, and `long`. * * ```html *
*
*
* ``` * * @example Localization * Set the `lang` attribute on the element to change the language. * * ```html *
*
* * ``` * * **Note:** This component also updates based on the page's language, which can be set using ``. */ declare class SigveloNumber extends SigveloElement { static styles: CSSResultGroup; private localize; /** The number to format. */ number: number; /** The formatting style to use. */ type: "decimal" | "currency" | "percent" | "unit"; /** * The currency to use when formatting currency. Must be an ISO 4217 currency code, e.g. "EUR" for euro. If not * provided, USD will be assumed. */ currency: string; /** How to display the currency in currency formatting. */ currencyDisplay: "code" | "symbol" | "narrowSymbol" | "name"; /** In many locales, accounting format means to wrap the number with parentheses instead of appending a minus sign. */ currencySign: "standard" | "accounting"; /** * The unit to use in unit formatting. [Possible values can be found here.](https://tc39.es/ecma402/#table-sanctioned-single-unit-identifiers) * There is no default value. If the style is `unit`, this option must be provided. */ unit: string; /** The unit formatting style to use in unit formatting. */ unitDisplay: "narrow" | "short" | "long"; /** * The minimum number of integer digits to use. A value with a smaller number of integer digits than this number will * be left-padded with zeros (to the specified length) when formatted. Possible values are from `1` to `21`. The * default is `1`. */ minimumIntegerDigits: number; /** The minimum number of fraction digits to use. Possible values are from `0` to `20`. */ minimumFractionDigits: number; /** The maximum number of fraction digits to use. Possible values are from `0` to `20`. */ maximumFractionDigits: number; /** The minimum number of significant digits to use. Possible values are from `1` to `21`; the default is `1`. */ minimumSignificantDigits: number; /** The maximum number of significant digits to use. Possible values are from `1` to `21`; the default is `21`. */ maximumSignificantDigits: number; /** Specifies how rounding conflicts will be resolved. */ roundingPriority: "auto" | "morePrecision" | "lessPrecision"; /** * Indicates the increment at which rounding should take place relative to the calculated rounding magnitude. Possible * values are `1`, `2`, `5`, `10`, `20`, `25`, `50`, `100`, `200`, `250`, `500`, `1000`, `2000`, `2500`, and `5000`. * Cannot be mixed with significant-digits rounding or any setting of `roundingPriority` other than auto. */ roundingIncrement: "1" | "2" | "5" | "10" | "20" | "25" | "50" | "100" | "200" | "250" | "500" | "1000" | "2000" | "2500" | "5000"; /** How decimals should be rounded. [See this page for more details.](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat#roundingmode) */ roundingMode: "ceil" | "floor" | "expand" | "trunc" | "halfCeil" | "halfFloor" | "halfExpand" | "halfTrunc" | "halfEven"; /** The strategy for displaying trailing zeros on whole numbers. */ trailingZeroDisplay: "auto" | "stripIfInteger"; /** The formatting that should be displayed for the number. */ notation: "standard" | "scientific" | "engineering" | "compact"; /** Only used when `notation` is `compact`. */ compactDisplay: "short" | "long"; /** Whether to use grouping separators, such as thousands separators or thousand/lakh/crore separators. */ grouping: "always" | "never" | "auto" | "min2"; /** When to display the sign for the number. */ signDisplay: "auto" | "always" | "exceptZero" | "negative" | "never"; render(): string; } declare global { interface HTMLElementTagNameMap { "sigvelo-number": SigveloNumber; } } //#endregion export { SigveloNumber as t };