index.d.ts 47 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241
  1. /**
  2. * @license Angular v20.1.0
  3. * (c) 2010-2025 Google LLC. https://angular.io/
  4. * License: MIT
  5. */
  6. import * as i0 from '@angular/core';
  7. import { ɵNavigation as _Navigation, ɵNavigationHistoryEntry as _NavigationHistoryEntry, ɵNavigationUpdateCurrentEntryOptions as _NavigationUpdateCurrentEntryOptions, ɵNavigationTransition as _NavigationTransition, ɵNavigationNavigateOptions as _NavigationNavigateOptions, ɵNavigationResult as _NavigationResult, ɵNavigationReloadOptions as _NavigationReloadOptions, ɵNavigationOptions as _NavigationOptions, ɵNavigateEvent as _NavigateEvent, ɵNavigationCurrentEntryChangeEvent as _NavigationCurrentEntryChangeEvent, OnDestroy, Version, Provider, InjectionToken, OnInit, OnChanges, SimpleChanges } from '@angular/core';
  8. export { DOCUMENT, ɵIMAGE_CONFIG as IMAGE_CONFIG, ɵImageConfig as ImageConfig } from '@angular/core';
  9. import { LocationStrategy } from './common_module.d.js';
  10. export { APP_BASE_HREF, AsyncPipe, CommonModule, CurrencyPipe, DATE_PIPE_DEFAULT_OPTIONS, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe, DatePipeConfig, DecimalPipe, I18nPluralPipe, I18nSelectPipe, JsonPipe, KeyValue, KeyValuePipe, Location, LowerCasePipe, NgClass, NgComponentOutlet, NgForOf as NgFor, NgForOf, NgForOfContext, NgIf, NgIfContext, NgLocaleLocalization, NgLocalization, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, PathLocationStrategy, PercentPipe, PopStateEvent, SlicePipe, TitleCasePipe, UpperCasePipe } from './common_module.d.js';
  11. import { PlatformLocation, LocationChangeListener } from './platform_location.d.js';
  12. export { BrowserPlatformLocation, LOCATION_INITIALIZED, LocationChangeEvent } from './platform_location.d.js';
  13. export { XhrFactory } from './xhr.d.js';
  14. import 'rxjs';
  15. declare function getDOM(): DomAdapter;
  16. declare function setRootDomAdapter(adapter: DomAdapter): void;
  17. /**
  18. * Provides DOM operations in an environment-agnostic way.
  19. *
  20. * @security Tread carefully! Interacting with the DOM directly is dangerous and
  21. * can introduce XSS risks.
  22. */
  23. declare abstract class DomAdapter {
  24. abstract dispatchEvent(el: any, evt: any): any;
  25. abstract readonly supportsDOMEvents: boolean;
  26. abstract remove(el: any): void;
  27. abstract createElement(tagName: any, doc?: any): HTMLElement;
  28. abstract createHtmlDocument(): Document;
  29. abstract getDefaultDocument(): Document;
  30. abstract isElementNode(node: any): boolean;
  31. abstract isShadowRoot(node: any): boolean;
  32. abstract onAndCancel(el: any, evt: any, listener: any, options?: any): Function;
  33. abstract getGlobalEventTarget(doc: Document, target: string): any;
  34. abstract getBaseHref(doc: Document): string | null;
  35. abstract resetBaseElement(): void;
  36. abstract getUserAgent(): string;
  37. abstract getCookie(name: string): string | null;
  38. }
  39. /**
  40. * This class wraps the platform Navigation API which allows server-specific and test
  41. * implementations.
  42. */
  43. declare abstract class PlatformNavigation implements _Navigation {
  44. abstract entries(): _NavigationHistoryEntry[];
  45. abstract currentEntry: _NavigationHistoryEntry | null;
  46. abstract updateCurrentEntry(options: _NavigationUpdateCurrentEntryOptions): void;
  47. abstract transition: _NavigationTransition | null;
  48. abstract canGoBack: boolean;
  49. abstract canGoForward: boolean;
  50. abstract navigate(url: string, options?: _NavigationNavigateOptions | undefined): _NavigationResult;
  51. abstract reload(options?: _NavigationReloadOptions | undefined): _NavigationResult;
  52. abstract traverseTo(key: string, options?: _NavigationOptions | undefined): _NavigationResult;
  53. abstract back(options?: _NavigationOptions | undefined): _NavigationResult;
  54. abstract forward(options?: _NavigationOptions | undefined): _NavigationResult;
  55. abstract onnavigate: ((this: _Navigation, ev: _NavigateEvent) => any) | null;
  56. abstract onnavigatesuccess: ((this: _Navigation, ev: Event) => any) | null;
  57. abstract onnavigateerror: ((this: _Navigation, ev: ErrorEvent) => any) | null;
  58. abstract oncurrententrychange: ((this: _Navigation, ev: _NavigationCurrentEntryChangeEvent) => any) | null;
  59. abstract addEventListener(type: unknown, listener: unknown, options?: unknown): void;
  60. abstract removeEventListener(type: unknown, listener: unknown, options?: unknown): void;
  61. abstract dispatchEvent(event: Event): boolean;
  62. static ɵfac: i0.ɵɵFactoryDeclaration<PlatformNavigation, never>;
  63. static ɵprov: i0.ɵɵInjectableDeclaration<PlatformNavigation>;
  64. }
  65. /**
  66. * @description
  67. * A {@link LocationStrategy} used to configure the {@link Location} service to
  68. * represent its state in the
  69. * [hash fragment](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax)
  70. * of the browser's URL.
  71. *
  72. * For instance, if you call `location.go('/foo')`, the browser's URL will become
  73. * `example.com#/foo`.
  74. *
  75. * @usageNotes
  76. *
  77. * ### Example
  78. *
  79. * {@example common/location/ts/hash_location_component.ts region='LocationComponent'}
  80. *
  81. * @publicApi
  82. */
  83. declare class HashLocationStrategy extends LocationStrategy implements OnDestroy {
  84. private _platformLocation;
  85. private _baseHref;
  86. private _removeListenerFns;
  87. constructor(_platformLocation: PlatformLocation, _baseHref?: string);
  88. /** @docs-private */
  89. ngOnDestroy(): void;
  90. onPopState(fn: LocationChangeListener): void;
  91. getBaseHref(): string;
  92. path(includeHash?: boolean): string;
  93. prepareExternalUrl(internal: string): string;
  94. pushState(state: any, title: string, path: string, queryParams: string): void;
  95. replaceState(state: any, title: string, path: string, queryParams: string): void;
  96. forward(): void;
  97. back(): void;
  98. getState(): unknown;
  99. historyGo(relativePosition?: number): void;
  100. static ɵfac: i0.ɵɵFactoryDeclaration<HashLocationStrategy, [null, { optional: true; }]>;
  101. static ɵprov: i0.ɵɵInjectableDeclaration<HashLocationStrategy>;
  102. }
  103. /**
  104. * @ngModule CommonModule
  105. * @description
  106. *
  107. * Formats a date according to locale rules.
  108. *
  109. * @param value The date to format, as a Date, or a number (milliseconds since UTC epoch)
  110. * or an [ISO date-time string](https://www.w3.org/TR/NOTE-datetime).
  111. * @param format The date-time components to include. See `DatePipe` for details.
  112. * @param locale A locale code for the locale format rules to use.
  113. * @param timezone The time zone. A time zone offset from GMT (such as `'+0430'`).
  114. * If not specified, uses host system settings.
  115. *
  116. * @returns The formatted date string.
  117. *
  118. * @see {@link DatePipe}
  119. * @see [Internationalization (i18n) Guide](guide/i18n)
  120. *
  121. * @publicApi
  122. */
  123. declare function formatDate(value: string | number | Date, format: string, locale: string, timezone?: string): string;
  124. /**
  125. * @ngModule CommonModule
  126. * @description
  127. *
  128. * Formats a number as currency using locale rules.
  129. *
  130. * @param value The number to format.
  131. * @param locale A locale code for the locale format rules to use.
  132. * @param currency A string containing the currency symbol or its name,
  133. * such as "$" or "Canadian Dollar". Used in output string, but does not affect the operation
  134. * of the function.
  135. * @param currencyCode The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217)
  136. * currency code, such as `USD` for the US dollar and `EUR` for the euro.
  137. * Used to determine the number of digits in the decimal part.
  138. * @param digitsInfo Decimal representation options, specified by a string in the following format:
  139. * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.
  140. *
  141. * @returns The formatted currency value.
  142. *
  143. * @see {@link formatNumber}
  144. * @see {@link DecimalPipe}
  145. * @see [Internationalization (i18n) Guide](guide/i18n)
  146. *
  147. * @publicApi
  148. */
  149. declare function formatCurrency(value: number, locale: string, currency: string, currencyCode?: string, digitsInfo?: string): string;
  150. /**
  151. * @ngModule CommonModule
  152. * @description
  153. *
  154. * Formats a number as a percentage according to locale rules.
  155. *
  156. * @param value The number to format.
  157. * @param locale A locale code for the locale format rules to use.
  158. * @param digitsInfo Decimal representation options, specified by a string in the following format:
  159. * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.
  160. *
  161. * @returns The formatted percentage value.
  162. *
  163. * @see {@link formatNumber}
  164. * @see {@link DecimalPipe}
  165. * @see [Internationalization (i18n) Guide](guide/i18n)
  166. * @publicApi
  167. *
  168. */
  169. declare function formatPercent(value: number, locale: string, digitsInfo?: string): string;
  170. /**
  171. * @ngModule CommonModule
  172. * @description
  173. *
  174. * Formats a number as text, with group sizing, separator, and other
  175. * parameters based on the locale.
  176. *
  177. * @param value The number to format.
  178. * @param locale A locale code for the locale format rules to use.
  179. * @param digitsInfo Decimal representation options, specified by a string in the following format:
  180. * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.
  181. *
  182. * @returns The formatted text string.
  183. * @see [Internationalization (i18n) Guide](guide/i18n)
  184. *
  185. * @publicApi
  186. */
  187. declare function formatNumber(value: number, locale: string, digitsInfo?: string): string;
  188. /**
  189. * Register global data to be used internally by Angular. See the
  190. * ["I18n guide"](guide/i18n/format-data-locale) to know how to import additional locale
  191. * data.
  192. *
  193. * The signature registerLocaleData(data: any, extraData?: any) is deprecated since v5.1
  194. *
  195. * @publicApi
  196. */
  197. declare function registerLocaleData(data: any, localeId?: string | any, extraData?: any): void;
  198. /**
  199. * Format styles that can be used to represent numbers.
  200. * @see {@link getLocaleNumberFormat}
  201. * @see [Internationalization (i18n) Guide](guide/i18n)
  202. *
  203. * @publicApi
  204. *
  205. * @deprecated `getLocaleNumberFormat` is deprecated
  206. */
  207. declare enum NumberFormatStyle {
  208. Decimal = 0,
  209. Percent = 1,
  210. Currency = 2,
  211. Scientific = 3
  212. }
  213. /**
  214. * Plurality cases used for translating plurals to different languages.
  215. *
  216. * @see {@link NgPlural}
  217. * @see {@link NgPluralCase}
  218. * @see [Internationalization (i18n) Guide](guide/i18n)
  219. *
  220. * @publicApi
  221. *
  222. * @deprecated `getLocalePluralCase` is deprecated
  223. */
  224. declare enum Plural {
  225. Zero = 0,
  226. One = 1,
  227. Two = 2,
  228. Few = 3,
  229. Many = 4,
  230. Other = 5
  231. }
  232. /**
  233. * Context-dependant translation forms for strings.
  234. * Typically the standalone version is for the nominative form of the word,
  235. * and the format version is used for the genitive case.
  236. * @see [CLDR website](http://cldr.unicode.org/translation/date-time-1/date-time#TOC-Standalone-vs.-Format-Styles)
  237. * @see [Internationalization (i18n) Guide](guide/i18n)
  238. *
  239. * @publicApi
  240. *
  241. * @deprecated locale data getters are deprecated
  242. */
  243. declare enum FormStyle {
  244. Format = 0,
  245. Standalone = 1
  246. }
  247. /**
  248. * String widths available for translations.
  249. * The specific character widths are locale-specific.
  250. * Examples are given for the word "Sunday" in English.
  251. *
  252. * @publicApi
  253. *
  254. * @deprecated locale data getters are deprecated
  255. */
  256. declare enum TranslationWidth {
  257. /** 1 character for `en-US`. For example: 'S' */
  258. Narrow = 0,
  259. /** 3 characters for `en-US`. For example: 'Sun' */
  260. Abbreviated = 1,
  261. /** Full length for `en-US`. For example: "Sunday" */
  262. Wide = 2,
  263. /** 2 characters for `en-US`, For example: "Su" */
  264. Short = 3
  265. }
  266. /**
  267. * String widths available for date-time formats.
  268. * The specific character widths are locale-specific.
  269. * Examples are given for `en-US`.
  270. *
  271. * @see {@link getLocaleDateFormat}
  272. * @see {@link getLocaleTimeFormat}
  273. * @see {@link getLocaleDateTimeFormat}
  274. * @see [Internationalization (i18n) Guide](guide/i18n)
  275. * @publicApi
  276. *
  277. * @deprecated 18.0
  278. * Date locale data getters are deprecated
  279. */
  280. declare enum FormatWidth {
  281. /**
  282. * For `en-US`, `'M/d/yy, h:mm a'`
  283. * (Example: `6/15/15, 9:03 AM`)
  284. */
  285. Short = 0,
  286. /**
  287. * For `en-US`, `'MMM d, y, h:mm:ss a'`
  288. * (Example: `Jun 15, 2015, 9:03:01 AM`)
  289. */
  290. Medium = 1,
  291. /**
  292. * For `en-US`, `'MMMM d, y, h:mm:ss a z'`
  293. * (Example: `June 15, 2015 at 9:03:01 AM GMT+1`)
  294. */
  295. Long = 2,
  296. /**
  297. * For `en-US`, `'EEEE, MMMM d, y, h:mm:ss a zzzz'`
  298. * (Example: `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00`)
  299. */
  300. Full = 3
  301. }
  302. /**
  303. * Symbols that can be used to replace placeholders in number patterns.
  304. * Examples are based on `en-US` values.
  305. *
  306. * @see {@link getLocaleNumberSymbol}
  307. * @see [Internationalization (i18n) Guide](guide/i18n)
  308. *
  309. * @publicApi
  310. *
  311. * @deprecated `getLocaleNumberSymbol` is deprecated
  312. *
  313. * @object-literal-as-enum
  314. */
  315. declare const NumberSymbol: {
  316. /**
  317. * Decimal separator.
  318. * For `en-US`, the dot character.
  319. * Example: 2,345`.`67
  320. */
  321. readonly Decimal: 0;
  322. /**
  323. * Grouping separator, typically for thousands.
  324. * For `en-US`, the comma character.
  325. * Example: 2`,`345.67
  326. */
  327. readonly Group: 1;
  328. /**
  329. * List-item separator.
  330. * Example: "one, two, and three"
  331. */
  332. readonly List: 2;
  333. /**
  334. * Sign for percentage (out of 100).
  335. * Example: 23.4%
  336. */
  337. readonly PercentSign: 3;
  338. /**
  339. * Sign for positive numbers.
  340. * Example: +23
  341. */
  342. readonly PlusSign: 4;
  343. /**
  344. * Sign for negative numbers.
  345. * Example: -23
  346. */
  347. readonly MinusSign: 5;
  348. /**
  349. * Computer notation for exponential value (n times a power of 10).
  350. * Example: 1.2E3
  351. */
  352. readonly Exponential: 6;
  353. /**
  354. * Human-readable format of exponential.
  355. * Example: 1.2x103
  356. */
  357. readonly SuperscriptingExponent: 7;
  358. /**
  359. * Sign for permille (out of 1000).
  360. * Example: 23.4‰
  361. */
  362. readonly PerMille: 8;
  363. /**
  364. * Infinity, can be used with plus and minus.
  365. * Example: ∞, +∞, -∞
  366. */
  367. readonly Infinity: 9;
  368. /**
  369. * Not a number.
  370. * Example: NaN
  371. */
  372. readonly NaN: 10;
  373. /**
  374. * Symbol used between time units.
  375. * Example: 10:52
  376. */
  377. readonly TimeSeparator: 11;
  378. /**
  379. * Decimal separator for currency values (fallback to `Decimal`).
  380. * Example: $2,345.67
  381. */
  382. readonly CurrencyDecimal: 12;
  383. /**
  384. * Group separator for currency values (fallback to `Group`).
  385. * Example: $2,345.67
  386. */
  387. readonly CurrencyGroup: 13;
  388. };
  389. type NumberSymbol = (typeof NumberSymbol)[keyof typeof NumberSymbol];
  390. /**
  391. * The value for each day of the week, based on the `en-US` locale
  392. *
  393. * @publicApi
  394. *
  395. * @deprecated Week locale getters are deprecated
  396. */
  397. declare enum WeekDay {
  398. Sunday = 0,
  399. Monday = 1,
  400. Tuesday = 2,
  401. Wednesday = 3,
  402. Thursday = 4,
  403. Friday = 5,
  404. Saturday = 6
  405. }
  406. /**
  407. * Retrieves the locale ID from the currently loaded locale.
  408. * The loaded locale could be, for example, a global one rather than a regional one.
  409. * @param locale A locale code, such as `fr-FR`.
  410. * @returns The locale code. For example, `fr`.
  411. * @see [Internationalization (i18n) Guide](guide/i18n)
  412. *
  413. * @publicApi
  414. *
  415. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  416. * This function serves no purpose when relying on the `Intl` API.
  417. */
  418. declare function getLocaleId(locale: string): string;
  419. /**
  420. * Retrieves day period strings for the given locale.
  421. *
  422. * @param locale A locale code for the locale format rules to use.
  423. * @param formStyle The required grammatical form.
  424. * @param width The required character width.
  425. * @returns An array of localized period strings. For example, `[AM, PM]` for `en-US`.
  426. * @see [Internationalization (i18n) Guide](guide/i18n)
  427. *
  428. * @publicApi
  429. *
  430. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  431. * Use `Intl.DateTimeFormat` for date formating instead.
  432. */
  433. declare function getLocaleDayPeriods(locale: string, formStyle: FormStyle, width: TranslationWidth): Readonly<[string, string]>;
  434. /**
  435. * Retrieves days of the week for the given locale, using the Gregorian calendar.
  436. *
  437. * @param locale A locale code for the locale format rules to use.
  438. * @param formStyle The required grammatical form.
  439. * @param width The required character width.
  440. * @returns An array of localized name strings.
  441. * For example,`[Sunday, Monday, ... Saturday]` for `en-US`.
  442. * @see [Internationalization (i18n) Guide](guide/i18n)
  443. *
  444. * @publicApi
  445. *
  446. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  447. * Use `Intl.DateTimeFormat` for date formating instead.
  448. */
  449. declare function getLocaleDayNames(locale: string, formStyle: FormStyle, width: TranslationWidth): ReadonlyArray<string>;
  450. /**
  451. * Retrieves months of the year for the given locale, using the Gregorian calendar.
  452. *
  453. * @param locale A locale code for the locale format rules to use.
  454. * @param formStyle The required grammatical form.
  455. * @param width The required character width.
  456. * @returns An array of localized name strings.
  457. * For example, `[January, February, ...]` for `en-US`.
  458. * @see [Internationalization (i18n) Guide](guide/i18n)
  459. *
  460. * @publicApi
  461. *
  462. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  463. * Use `Intl.DateTimeFormat` for date formating instead.
  464. */
  465. declare function getLocaleMonthNames(locale: string, formStyle: FormStyle, width: TranslationWidth): ReadonlyArray<string>;
  466. /**
  467. * Retrieves Gregorian-calendar eras for the given locale.
  468. * @param locale A locale code for the locale format rules to use.
  469. * @param width The required character width.
  470. * @returns An array of localized era strings.
  471. * For example, `[AD, BC]` for `en-US`.
  472. * @see [Internationalization (i18n) Guide](guide/i18n)
  473. *
  474. * @publicApi
  475. *
  476. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  477. * Use `Intl.DateTimeFormat` for date formating instead.
  478. */
  479. declare function getLocaleEraNames(locale: string, width: TranslationWidth): Readonly<[string, string]>;
  480. /**
  481. * Retrieves the first day of the week for the given locale.
  482. *
  483. * @param locale A locale code for the locale format rules to use.
  484. * @returns A day index number, using the 0-based week-day index for `en-US`
  485. * (Sunday = 0, Monday = 1, ...).
  486. * For example, for `fr-FR`, returns 1 to indicate that the first day is Monday.
  487. * @see [Internationalization (i18n) Guide](guide/i18n)
  488. *
  489. * @publicApi
  490. *
  491. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  492. * Intl's [`getWeekInfo`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getWeekInfo) has partial support (Chromium M99 & Safari 17).
  493. * You may want to rely on the following alternatives:
  494. * - Libraries like [`Luxon`](https://moment.github.io/luxon/#/) rely on `Intl` but fallback on the ISO 8601 definition (monday) if `getWeekInfo` is not supported.
  495. * - Other librairies like [`date-fns`](https://date-fns.org/), [`day.js`](https://day.js.org/en/) or [`weekstart`](https://www.npmjs.com/package/weekstart) library provide their own locale based data for the first day of the week.
  496. */
  497. declare function getLocaleFirstDayOfWeek(locale: string): WeekDay;
  498. /**
  499. * Range of week days that are considered the week-end for the given locale.
  500. *
  501. * @param locale A locale code for the locale format rules to use.
  502. * @returns The range of day values, `[startDay, endDay]`.
  503. * @see [Internationalization (i18n) Guide](guide/i18n)
  504. *
  505. * @publicApi
  506. *
  507. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  508. * Intl's [`getWeekInfo`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getWeekInfo) has partial support (Chromium M99 & Safari 17).
  509. * Libraries like [`Luxon`](https://moment.github.io/luxon/#/) rely on `Intl` but fallback on the ISO 8601 definition (Saturday+Sunday) if `getWeekInfo` is not supported .
  510. */
  511. declare function getLocaleWeekEndRange(locale: string): [WeekDay, WeekDay];
  512. /**
  513. * Retrieves a localized date-value formatting string.
  514. *
  515. * @param locale A locale code for the locale format rules to use.
  516. * @param width The format type.
  517. * @returns The localized formatting string.
  518. * @see {@link FormatWidth}
  519. * @see [Internationalization (i18n) Guide](guide/i18n)
  520. *
  521. * @publicApi
  522. *
  523. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  524. * Use `Intl.DateTimeFormat` for date formating instead.
  525. */
  526. declare function getLocaleDateFormat(locale: string, width: FormatWidth): string;
  527. /**
  528. * Retrieves a localized time-value formatting string.
  529. *
  530. * @param locale A locale code for the locale format rules to use.
  531. * @param width The format type.
  532. * @returns The localized formatting string.
  533. * @see {@link FormatWidth}
  534. * @see [Internationalization (i18n) Guide](guide/i18n)
  535. * @publicApi
  536. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  537. * Use `Intl.DateTimeFormat` for date formating instead.
  538. */
  539. declare function getLocaleTimeFormat(locale: string, width: FormatWidth): string;
  540. /**
  541. * Retrieves a localized date-time formatting string.
  542. *
  543. * @param locale A locale code for the locale format rules to use.
  544. * @param width The format type.
  545. * @returns The localized formatting string.
  546. * @see {@link FormatWidth}
  547. * @see [Internationalization (i18n) Guide](guide/i18n)
  548. *
  549. * @publicApi
  550. *
  551. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  552. * Use `Intl.DateTimeFormat` for date formating instead.
  553. */
  554. declare function getLocaleDateTimeFormat(locale: string, width: FormatWidth): string;
  555. /**
  556. * Retrieves a localized number symbol that can be used to replace placeholders in number formats.
  557. * @param locale The locale code.
  558. * @param symbol The symbol to localize. Must be one of `NumberSymbol`.
  559. * @returns The character for the localized symbol.
  560. * @see {@link NumberSymbol}
  561. * @see [Internationalization (i18n) Guide](guide/i18n)
  562. *
  563. * @publicApi
  564. *
  565. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  566. * Use `Intl.NumberFormat` to format numbers instead.
  567. */
  568. declare function getLocaleNumberSymbol(locale: string, symbol: NumberSymbol): string;
  569. /**
  570. * Retrieves a number format for a given locale.
  571. *
  572. * Numbers are formatted using patterns, like `#,###.00`. For example, the pattern `#,###.00`
  573. * when used to format the number 12345.678 could result in "12'345,678". That would happen if the
  574. * grouping separator for your language is an apostrophe, and the decimal separator is a comma.
  575. *
  576. * <b>Important:</b> The characters `.` `,` `0` `#` (and others below) are special placeholders
  577. * that stand for the decimal separator, and so on, and are NOT real characters.
  578. * You must NOT "translate" the placeholders. For example, don't change `.` to `,` even though in
  579. * your language the decimal point is written with a comma. The symbols should be replaced by the
  580. * local equivalents, using the appropriate `NumberSymbol` for your language.
  581. *
  582. * Here are the special characters used in number patterns:
  583. *
  584. * | Symbol | Meaning |
  585. * |--------|---------|
  586. * | . | Replaced automatically by the character used for the decimal point. |
  587. * | , | Replaced by the "grouping" (thousands) separator. |
  588. * | 0 | Replaced by a digit (or zero if there aren't enough digits). |
  589. * | # | Replaced by a digit (or nothing if there aren't enough). |
  590. * | ¤ | Replaced by a currency symbol, such as $ or USD. |
  591. * | % | Marks a percent format. The % symbol may change position, but must be retained. |
  592. * | E | Marks a scientific format. The E symbol may change position, but must be retained. |
  593. * | ' | Special characters used as literal characters are quoted with ASCII single quotes. |
  594. *
  595. * @param locale A locale code for the locale format rules to use.
  596. * @param type The type of numeric value to be formatted (such as `Decimal` or `Currency`.)
  597. * @returns The localized format string.
  598. * @see {@link NumberFormatStyle}
  599. * @see [CLDR website](http://cldr.unicode.org/translation/number-patterns)
  600. * @see [Internationalization (i18n) Guide](guide/i18n)
  601. *
  602. * @publicApi
  603. *
  604. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  605. * Let `Intl.NumberFormat` determine the number format instead
  606. */
  607. declare function getLocaleNumberFormat(locale: string, type: NumberFormatStyle): string;
  608. /**
  609. * Retrieves the symbol used to represent the currency for the main country
  610. * corresponding to a given locale. For example, '$' for `en-US`.
  611. *
  612. * @param locale A locale code for the locale format rules to use.
  613. * @returns The localized symbol character,
  614. * or `null` if the main country cannot be determined.
  615. * @see [Internationalization (i18n) Guide](guide/i18n)
  616. *
  617. * @publicApi
  618. *
  619. * @deprecated Use the `Intl` API to format a currency with from currency code
  620. */
  621. declare function getLocaleCurrencySymbol(locale: string): string | null;
  622. /**
  623. * Retrieves the name of the currency for the main country corresponding
  624. * to a given locale. For example, 'US Dollar' for `en-US`.
  625. * @param locale A locale code for the locale format rules to use.
  626. * @returns The currency name,
  627. * or `null` if the main country cannot be determined.
  628. * @see [Internationalization (i18n) Guide](guide/i18n)
  629. *
  630. * @publicApi
  631. *
  632. * @deprecated Use the `Intl` API to format a currency with from currency code
  633. */
  634. declare function getLocaleCurrencyName(locale: string): string | null;
  635. /**
  636. * Retrieves the default currency code for the given locale.
  637. *
  638. * The default is defined as the first currency which is still in use.
  639. *
  640. * @param locale The code of the locale whose currency code we want.
  641. * @returns The code of the default currency for the given locale.
  642. *
  643. * @publicApi
  644. *
  645. * @deprecated We recommend you create a map of locale to ISO 4217 currency codes.
  646. * Time relative currency data is provided by the CLDR project. See https://www.unicode.org/cldr/charts/44/supplemental/detailed_territory_currency_information.html
  647. */
  648. declare function getLocaleCurrencyCode(locale: string): string | null;
  649. /**
  650. * @publicApi
  651. *
  652. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  653. * Use `Intl.PluralRules` instead
  654. */
  655. declare const getLocalePluralCase: (locale: string) => (value: number) => Plural;
  656. /**
  657. * Retrieves locale-specific rules used to determine which day period to use
  658. * when more than one period is defined for a locale.
  659. *
  660. * There is a rule for each defined day period. The
  661. * first rule is applied to the first day period and so on.
  662. * Fall back to AM/PM when no rules are available.
  663. *
  664. * A rule can specify a period as time range, or as a single time value.
  665. *
  666. * This functionality is only available when you have loaded the full locale data.
  667. * See the ["I18n guide"](guide/i18n/format-data-locale).
  668. *
  669. * @param locale A locale code for the locale format rules to use.
  670. * @returns The rules for the locale, a single time value or array of *from-time, to-time*,
  671. * or null if no periods are available.
  672. *
  673. * @see {@link getLocaleExtraDayPeriods}
  674. * @see [Internationalization (i18n) Guide](guide/i18n)
  675. *
  676. * @publicApi
  677. *
  678. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  679. * Let `Intl.DateTimeFormat` determine the day period instead.
  680. */
  681. declare function getLocaleExtraDayPeriodRules(locale: string): (Time | [Time, Time])[];
  682. /**
  683. * Retrieves locale-specific day periods, which indicate roughly how a day is broken up
  684. * in different languages.
  685. * For example, for `en-US`, periods are morning, noon, afternoon, evening, and midnight.
  686. *
  687. * This functionality is only available when you have loaded the full locale data.
  688. * See the ["I18n guide"](guide/i18n/format-data-locale).
  689. *
  690. * @param locale A locale code for the locale format rules to use.
  691. * @param formStyle The required grammatical form.
  692. * @param width The required character width.
  693. * @returns The translated day-period strings.
  694. * @see {@link getLocaleExtraDayPeriodRules}
  695. * @see [Internationalization (i18n) Guide](guide/i18n)
  696. *
  697. * @publicApi
  698. *
  699. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  700. * To extract a day period use `Intl.DateTimeFormat` with the `dayPeriod` option instead.
  701. */
  702. declare function getLocaleExtraDayPeriods(locale: string, formStyle: FormStyle, width: TranslationWidth): string[];
  703. /**
  704. * Retrieves the writing direction of a specified locale
  705. * @param locale A locale code for the locale format rules to use.
  706. * @publicApi
  707. * @returns 'rtl' or 'ltr'
  708. * @see [Internationalization (i18n) Guide](guide/i18n)
  709. *
  710. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  711. * For dates and numbers, let `Intl.DateTimeFormat()` and `Intl.NumberFormat()` determine the writing direction.
  712. * The `Intl` alternative [`getTextInfo`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getTextInfo).
  713. * has only partial support (Chromium M99 & Safari 17).
  714. * 3rd party alternatives like [`rtl-detect`](https://www.npmjs.com/package/rtl-detect) can work around this issue.
  715. */
  716. declare function getLocaleDirection(locale: string): 'ltr' | 'rtl';
  717. /**
  718. * Represents a time value with hours and minutes.
  719. *
  720. * @publicApi
  721. *
  722. * @deprecated Locale date getters are deprecated
  723. */
  724. type Time = {
  725. hours: number;
  726. minutes: number;
  727. };
  728. /**
  729. * Retrieves the currency symbol for a given currency code.
  730. *
  731. * For example, for the default `en-US` locale, the code `USD` can
  732. * be represented by the narrow symbol `$` or the wide symbol `US$`.
  733. *
  734. * @param code The currency code.
  735. * @param format The format, `wide` or `narrow`.
  736. * @param locale A locale code for the locale format rules to use.
  737. *
  738. * @returns The symbol, or the currency code if no symbol is available.
  739. * @see [Internationalization (i18n) Guide](guide/i18n)
  740. *
  741. * @publicApi
  742. *
  743. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  744. * You can use `Intl.NumberFormat().formatToParts()` to extract the currency symbol.
  745. * For example: `Intl.NumberFormat('en', {style:'currency', currency: 'USD'}).formatToParts().find(part => part.type === 'currency').value`
  746. * returns `$` for USD currency code in the `en` locale.
  747. * Note: `US$` is a currency symbol for the `en-ca` locale but not the `en-us` locale.
  748. */
  749. declare function getCurrencySymbol(code: string, format: 'wide' | 'narrow', locale?: string): string;
  750. /**
  751. * Reports the number of decimal digits for a given currency.
  752. * The value depends upon the presence of cents in that particular currency.
  753. *
  754. * @param code The currency code.
  755. * @returns The number of decimal digits, typically 0 or 2.
  756. * @see [Internationalization (i18n) Guide](guide/i18n)
  757. *
  758. * @publicApi
  759. *
  760. * @deprecated Angular recommends relying on the `Intl` API for i18n.
  761. * This function should not be used anymore. Let `Intl.NumberFormat` determine the number of digits to display for the currency
  762. */
  763. declare function getNumberOfCurrencyDigits(code: string): number;
  764. declare function parseCookieValue(cookieStr: string, name: string): string | null;
  765. declare const PLATFORM_BROWSER_ID = "browser";
  766. declare const PLATFORM_SERVER_ID = "server";
  767. /**
  768. * Returns whether a platform id represents a browser platform.
  769. * @publicApi
  770. */
  771. declare function isPlatformBrowser(platformId: Object): boolean;
  772. /**
  773. * Returns whether a platform id represents a server platform.
  774. * @publicApi
  775. */
  776. declare function isPlatformServer(platformId: Object): boolean;
  777. /**
  778. * @module
  779. * @description
  780. * Entry point for all public APIs of the common package.
  781. */
  782. /**
  783. * @publicApi
  784. */
  785. declare const VERSION: Version;
  786. /**
  787. * Defines a scroll position manager. Implemented by `BrowserViewportScroller`.
  788. *
  789. * @publicApi
  790. */
  791. declare abstract class ViewportScroller {
  792. /** @nocollapse */
  793. static ɵprov: unknown;
  794. /**
  795. * Configures the top offset used when scrolling to an anchor.
  796. * @param offset A position in screen coordinates (a tuple with x and y values)
  797. * or a function that returns the top offset position.
  798. *
  799. */
  800. abstract setOffset(offset: [number, number] | (() => [number, number])): void;
  801. /**
  802. * Retrieves the current scroll position.
  803. * @returns A position in screen coordinates (a tuple with x and y values).
  804. */
  805. abstract getScrollPosition(): [number, number];
  806. /**
  807. * Scrolls to a specified position.
  808. * @param position A position in screen coordinates (a tuple with x and y values).
  809. */
  810. abstract scrollToPosition(position: [number, number], options?: ScrollOptions): void;
  811. /**
  812. * Scrolls to an anchor element.
  813. * @param anchor The ID of the anchor element.
  814. */
  815. abstract scrollToAnchor(anchor: string, options?: ScrollOptions): void;
  816. /**
  817. * Disables automatic scroll restoration provided by the browser.
  818. * See also [window.history.scrollRestoration
  819. * info](https://developers.google.com/web/updates/2015/09/history-api-scroll-restoration).
  820. */
  821. abstract setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void;
  822. }
  823. /**
  824. * Provides an empty implementation of the viewport scroller.
  825. */
  826. declare class NullViewportScroller implements ViewportScroller {
  827. /**
  828. * Empty implementation
  829. */
  830. setOffset(offset: [number, number] | (() => [number, number])): void;
  831. /**
  832. * Empty implementation
  833. */
  834. getScrollPosition(): [number, number];
  835. /**
  836. * Empty implementation
  837. */
  838. scrollToPosition(position: [number, number]): void;
  839. /**
  840. * Empty implementation
  841. */
  842. scrollToAnchor(anchor: string): void;
  843. /**
  844. * Empty implementation
  845. */
  846. setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void;
  847. }
  848. /**
  849. * Function that generates an ImageLoader for [Cloudflare Image
  850. * Resizing](https://developers.cloudflare.com/images/image-resizing/) and turns it into an Angular
  851. * provider. Note: Cloudflare has multiple image products - this provider is specifically for
  852. * Cloudflare Image Resizing; it will not work with Cloudflare Images or Cloudflare Polish.
  853. *
  854. * @param path Your domain name, e.g. https://mysite.com
  855. * @returns Provider that provides an ImageLoader function
  856. *
  857. * @publicApi
  858. */
  859. declare const provideCloudflareLoader: (path: string) => Provider[];
  860. /**
  861. * Config options recognized by the image loader function.
  862. *
  863. * @see {@link ImageLoader}
  864. * @see {@link NgOptimizedImage}
  865. * @publicApi
  866. */
  867. interface ImageLoaderConfig {
  868. /**
  869. * Image file name to be added to the image request URL.
  870. */
  871. src: string;
  872. /**
  873. * Width of the requested image (to be used when generating srcset).
  874. */
  875. width?: number;
  876. /**
  877. * Whether the loader should generate a URL for a small image placeholder instead of a full-sized
  878. * image.
  879. */
  880. isPlaceholder?: boolean;
  881. /**
  882. * Additional user-provided parameters for use by the ImageLoader.
  883. */
  884. loaderParams?: {
  885. [key: string]: any;
  886. };
  887. }
  888. /**
  889. * Represents an image loader function. Image loader functions are used by the
  890. * NgOptimizedImage directive to produce full image URL based on the image name and its width.
  891. *
  892. * @publicApi
  893. */
  894. type ImageLoader = (config: ImageLoaderConfig) => string;
  895. /**
  896. * Injection token that configures the image loader function.
  897. *
  898. * @see {@link ImageLoader}
  899. * @see {@link NgOptimizedImage}
  900. * @publicApi
  901. */
  902. declare const IMAGE_LOADER: InjectionToken<ImageLoader>;
  903. /**
  904. * Function that generates an ImageLoader for Cloudinary and turns it into an Angular provider.
  905. *
  906. * @param path Base URL of your Cloudinary images
  907. * This URL should match one of the following formats:
  908. * https://res.cloudinary.com/mysite
  909. * https://mysite.cloudinary.com
  910. * https://subdomain.mysite.com
  911. * @returns Set of providers to configure the Cloudinary loader.
  912. *
  913. * @publicApi
  914. */
  915. declare const provideCloudinaryLoader: (path: string) => Provider[];
  916. /**
  917. * Function that generates an ImageLoader for ImageKit and turns it into an Angular provider.
  918. *
  919. * @param path Base URL of your ImageKit images
  920. * This URL should match one of the following formats:
  921. * https://ik.imagekit.io/myaccount
  922. * https://subdomain.mysite.com
  923. * @returns Set of providers to configure the ImageKit loader.
  924. *
  925. * @publicApi
  926. */
  927. declare const provideImageKitLoader: (path: string) => Provider[];
  928. /**
  929. * Function that generates an ImageLoader for Imgix and turns it into an Angular provider.
  930. *
  931. * @param path path to the desired Imgix origin,
  932. * e.g. https://somepath.imgix.net or https://images.mysite.com
  933. * @returns Set of providers to configure the Imgix loader.
  934. *
  935. * @publicApi
  936. */
  937. declare const provideImgixLoader: (path: string) => Provider[];
  938. /**
  939. * Function that generates an ImageLoader for Netlify and turns it into an Angular provider.
  940. *
  941. * @param path optional URL of the desired Netlify site. Defaults to the current site.
  942. * @returns Set of providers to configure the Netlify loader.
  943. *
  944. * @publicApi
  945. */
  946. declare function provideNetlifyLoader(path?: string): Provider[];
  947. /**
  948. * Config options used in rendering placeholder images.
  949. *
  950. * @see {@link NgOptimizedImage}
  951. * @publicApi
  952. */
  953. interface ImagePlaceholderConfig {
  954. blur?: boolean;
  955. }
  956. /**
  957. * Directive that improves image loading performance by enforcing best practices.
  958. *
  959. * `NgOptimizedImage` ensures that the loading of the Largest Contentful Paint (LCP) image is
  960. * prioritized by:
  961. * - Automatically setting the `fetchpriority` attribute on the `<img>` tag
  962. * - Lazy loading non-priority images by default
  963. * - Automatically generating a preconnect link tag in the document head
  964. *
  965. * In addition, the directive:
  966. * - Generates appropriate asset URLs if a corresponding `ImageLoader` function is provided
  967. * - Automatically generates a srcset
  968. * - Requires that `width` and `height` are set
  969. * - Warns if `width` or `height` have been set incorrectly
  970. * - Warns if the image will be visually distorted when rendered
  971. *
  972. * @usageNotes
  973. * The `NgOptimizedImage` directive is marked as [standalone](guide/components/importing) and can
  974. * be imported directly.
  975. *
  976. * Follow the steps below to enable and use the directive:
  977. * 1. Import it into the necessary NgModule or a standalone Component.
  978. * 2. Optionally provide an `ImageLoader` if you use an image hosting service.
  979. * 3. Update the necessary `<img>` tags in templates and replace `src` attributes with `ngSrc`.
  980. * Using a `ngSrc` allows the directive to control when the `src` gets set, which triggers an image
  981. * download.
  982. *
  983. * Step 1: import the `NgOptimizedImage` directive.
  984. *
  985. * ```ts
  986. * import { NgOptimizedImage } from '@angular/common';
  987. *
  988. * // Include it into the necessary NgModule
  989. * @NgModule({
  990. * imports: [NgOptimizedImage],
  991. * })
  992. * class AppModule {}
  993. *
  994. * // ... or a standalone Component
  995. * @Component({
  996. * imports: [NgOptimizedImage],
  997. * })
  998. * class MyStandaloneComponent {}
  999. * ```
  1000. *
  1001. * Step 2: configure a loader.
  1002. *
  1003. * To use the **default loader**: no additional code changes are necessary. The URL returned by the
  1004. * generic loader will always match the value of "src". In other words, this loader applies no
  1005. * transformations to the resource URL and the value of the `ngSrc` attribute will be used as is.
  1006. *
  1007. * To use an existing loader for a **third-party image service**: add the provider factory for your
  1008. * chosen service to the `providers` array. In the example below, the Imgix loader is used:
  1009. *
  1010. * ```ts
  1011. * import {provideImgixLoader} from '@angular/common';
  1012. *
  1013. * // Call the function and add the result to the `providers` array:
  1014. * providers: [
  1015. * provideImgixLoader("https://my.base.url/"),
  1016. * ],
  1017. * ```
  1018. *
  1019. * The `NgOptimizedImage` directive provides the following functions:
  1020. * - `provideCloudflareLoader`
  1021. * - `provideCloudinaryLoader`
  1022. * - `provideImageKitLoader`
  1023. * - `provideImgixLoader`
  1024. *
  1025. * If you use a different image provider, you can create a custom loader function as described
  1026. * below.
  1027. *
  1028. * To use a **custom loader**: provide your loader function as a value for the `IMAGE_LOADER` DI
  1029. * token.
  1030. *
  1031. * ```ts
  1032. * import {IMAGE_LOADER, ImageLoaderConfig} from '@angular/common';
  1033. *
  1034. * // Configure the loader using the `IMAGE_LOADER` token.
  1035. * providers: [
  1036. * {
  1037. * provide: IMAGE_LOADER,
  1038. * useValue: (config: ImageLoaderConfig) => {
  1039. * return `https://example.com/${config.src}-${config.width}.jpg`;
  1040. * }
  1041. * },
  1042. * ],
  1043. * ```
  1044. *
  1045. * Step 3: update `<img>` tags in templates to use `ngSrc` instead of `src`.
  1046. *
  1047. * ```html
  1048. * <img ngSrc="logo.png" width="200" height="100">
  1049. * ```
  1050. *
  1051. * @publicApi
  1052. */
  1053. declare class NgOptimizedImage implements OnInit, OnChanges {
  1054. private imageLoader;
  1055. private config;
  1056. private renderer;
  1057. private imgElement;
  1058. private injector;
  1059. private lcpObserver?;
  1060. /**
  1061. * Calculate the rewritten `src` once and store it.
  1062. * This is needed to avoid repetitive calculations and make sure the directive cleanup in the
  1063. * `ngOnDestroy` does not rely on the `IMAGE_LOADER` logic (which in turn can rely on some other
  1064. * instance that might be already destroyed).
  1065. */
  1066. private _renderedSrc;
  1067. /**
  1068. * Name of the source image.
  1069. * Image name will be processed by the image loader and the final URL will be applied as the `src`
  1070. * property of the image.
  1071. */
  1072. ngSrc: string;
  1073. /**
  1074. * A comma separated list of width or density descriptors.
  1075. * The image name will be taken from `ngSrc` and combined with the list of width or density
  1076. * descriptors to generate the final `srcset` property of the image.
  1077. *
  1078. * Example:
  1079. * ```html
  1080. * <img ngSrc="hello.jpg" ngSrcset="100w, 200w" /> =>
  1081. * <img src="path/hello.jpg" srcset="path/hello.jpg?w=100 100w, path/hello.jpg?w=200 200w" />
  1082. * ```
  1083. */
  1084. ngSrcset: string;
  1085. /**
  1086. * The base `sizes` attribute passed through to the `<img>` element.
  1087. * Providing sizes causes the image to create an automatic responsive srcset.
  1088. */
  1089. sizes?: string;
  1090. /**
  1091. * For responsive images: the intrinsic width of the image in pixels.
  1092. * For fixed size images: the desired rendered width of the image in pixels.
  1093. */
  1094. width: number | undefined;
  1095. /**
  1096. * For responsive images: the intrinsic height of the image in pixels.
  1097. * For fixed size images: the desired rendered height of the image in pixels.
  1098. */
  1099. height: number | undefined;
  1100. /**
  1101. * The desired decoding behavior for the image. Defaults to `auto`
  1102. * if not explicitly set, matching native browser behavior.
  1103. *
  1104. * Use `async` to decode the image off the main thread (non-blocking),
  1105. * `sync` for immediate decoding (blocking), or `auto` to let the
  1106. * browser decide the optimal strategy.
  1107. *
  1108. * [Spec](https://html.spec.whatwg.org/multipage/images.html#image-decoding-hint)
  1109. */
  1110. decoding?: 'sync' | 'async' | 'auto';
  1111. /**
  1112. * The desired loading behavior (lazy, eager, or auto). Defaults to `lazy`,
  1113. * which is recommended for most images.
  1114. *
  1115. * Warning: Setting images as loading="eager" or loading="auto" marks them
  1116. * as non-priority images and can hurt loading performance. For images which
  1117. * may be the LCP element, use the `priority` attribute instead of `loading`.
  1118. */
  1119. loading?: 'lazy' | 'eager' | 'auto';
  1120. /**
  1121. * Indicates whether this image should have a high priority.
  1122. */
  1123. priority: boolean;
  1124. /**
  1125. * Data to pass through to custom loaders.
  1126. */
  1127. loaderParams?: {
  1128. [key: string]: any;
  1129. };
  1130. /**
  1131. * Disables automatic srcset generation for this image.
  1132. */
  1133. disableOptimizedSrcset: boolean;
  1134. /**
  1135. * Sets the image to "fill mode", which eliminates the height/width requirement and adds
  1136. * styles such that the image fills its containing element.
  1137. */
  1138. fill: boolean;
  1139. /**
  1140. * A URL or data URL for an image to be used as a placeholder while this image loads.
  1141. */
  1142. placeholder?: string | boolean;
  1143. /**
  1144. * Configuration object for placeholder settings. Options:
  1145. * * blur: Setting this to false disables the automatic CSS blur.
  1146. */
  1147. placeholderConfig?: ImagePlaceholderConfig;
  1148. constructor();
  1149. /** @docs-private */
  1150. ngOnInit(): void;
  1151. private setHostAttributes;
  1152. /** @docs-private */
  1153. ngOnChanges(changes: SimpleChanges): void;
  1154. private callImageLoader;
  1155. private getLoadingBehavior;
  1156. private getFetchPriority;
  1157. private getDecoding;
  1158. private getRewrittenSrc;
  1159. private getRewrittenSrcset;
  1160. private getAutomaticSrcset;
  1161. private getResponsiveSrcset;
  1162. private updateSrcAndSrcset;
  1163. private getFixedSrcset;
  1164. private shouldGenerateAutomaticSrcset;
  1165. /**
  1166. * Returns an image url formatted for use with the CSS background-image property. Expects one of:
  1167. * * A base64 encoded image, which is wrapped and passed through.
  1168. * * A boolean. If true, calls the image loader to generate a small placeholder url.
  1169. */
  1170. protected generatePlaceholder(placeholderInput: string | boolean): string | boolean | null;
  1171. /**
  1172. * Determines if blur should be applied, based on an optional boolean
  1173. * property `blur` within the optional configuration object `placeholderConfig`.
  1174. */
  1175. protected shouldBlurPlaceholder(placeholderConfig?: ImagePlaceholderConfig): boolean;
  1176. private removePlaceholderOnLoad;
  1177. private setHostAttribute;
  1178. static ɵfac: i0.ɵɵFactoryDeclaration<NgOptimizedImage, never>;
  1179. static ɵdir: i0.ɵɵDirectiveDeclaration<NgOptimizedImage, "img[ngSrc]", never, { "ngSrc": { "alias": "ngSrc"; "required": true; }; "ngSrcset": { "alias": "ngSrcset"; "required": false; }; "sizes": { "alias": "sizes"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "decoding": { "alias": "decoding"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "priority": { "alias": "priority"; "required": false; }; "loaderParams": { "alias": "loaderParams"; "required": false; }; "disableOptimizedSrcset": { "alias": "disableOptimizedSrcset"; "required": false; }; "fill": { "alias": "fill"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placeholderConfig": { "alias": "placeholderConfig"; "required": false; }; "src": { "alias": "src"; "required": false; }; "srcset": { "alias": "srcset"; "required": false; }; }, {}, never, never, true, never>;
  1180. static ngAcceptInputType_ngSrc: string | i0.ɵSafeValue;
  1181. static ngAcceptInputType_width: unknown;
  1182. static ngAcceptInputType_height: unknown;
  1183. static ngAcceptInputType_priority: unknown;
  1184. static ngAcceptInputType_disableOptimizedSrcset: unknown;
  1185. static ngAcceptInputType_fill: unknown;
  1186. static ngAcceptInputType_placeholder: boolean | string;
  1187. }
  1188. /**
  1189. * Injection token to configure which origins should be excluded
  1190. * from the preconnect checks. It can either be a single string or an array of strings
  1191. * to represent a group of origins, for example:
  1192. *
  1193. * ```ts
  1194. * {provide: PRECONNECT_CHECK_BLOCKLIST, useValue: 'https://your-domain.com'}
  1195. * ```
  1196. *
  1197. * or:
  1198. *
  1199. * ```ts
  1200. * {provide: PRECONNECT_CHECK_BLOCKLIST,
  1201. * useValue: ['https://your-domain-1.com', 'https://your-domain-2.com']}
  1202. * ```
  1203. *
  1204. * @publicApi
  1205. */
  1206. declare const PRECONNECT_CHECK_BLOCKLIST: InjectionToken<(string | string[])[]>;
  1207. /**
  1208. * Normalizes URL parameters by prepending with `?` if needed.
  1209. *
  1210. * @param params String of URL parameters.
  1211. *
  1212. * @returns The normalized URL parameters string.
  1213. */
  1214. declare function normalizeQueryParams(params: string): string;
  1215. export { FormStyle, FormatWidth, HashLocationStrategy, IMAGE_LOADER, LocationChangeListener, LocationStrategy, NgOptimizedImage, NumberFormatStyle, NumberSymbol, PRECONNECT_CHECK_BLOCKLIST, PlatformLocation, Plural, TranslationWidth, VERSION, ViewportScroller, WeekDay, formatCurrency, formatDate, formatNumber, formatPercent, getCurrencySymbol, getLocaleCurrencyCode, getLocaleCurrencyName, getLocaleCurrencySymbol, getLocaleDateFormat, getLocaleDateTimeFormat, getLocaleDayNames, getLocaleDayPeriods, getLocaleDirection, getLocaleEraNames, getLocaleExtraDayPeriodRules, getLocaleExtraDayPeriods, getLocaleFirstDayOfWeek, getLocaleId, getLocaleMonthNames, getLocaleNumberFormat, getLocaleNumberSymbol, getLocalePluralCase, getLocaleTimeFormat, getLocaleWeekEndRange, getNumberOfCurrencyDigits, isPlatformBrowser, isPlatformServer, provideCloudflareLoader, provideCloudinaryLoader, provideImageKitLoader, provideImgixLoader, provideNetlifyLoader, registerLocaleData, DomAdapter as ɵDomAdapter, NullViewportScroller as ɵNullViewportScroller, PLATFORM_BROWSER_ID as ɵPLATFORM_BROWSER_ID, PLATFORM_SERVER_ID as ɵPLATFORM_SERVER_ID, PlatformNavigation as ɵPlatformNavigation, getDOM as ɵgetDOM, normalizeQueryParams as ɵnormalizeQueryParams, parseCookieValue as ɵparseCookieValue, setRootDomAdapter as ɵsetRootDomAdapter };
  1216. export type { ImageLoader, ImageLoaderConfig, ImagePlaceholderConfig, Time };