# v2 git bundle 8e102440868b7fe28e975ba4cc994bf26772de41 refs/heads/bundle 8e102440868b7fe28e975ba4cc994bf26772de41 HEAD PACKxUN#G)JDcZ1,d~AJEKO !<@'R5{.W}]W!=̲!rfa?zGOPaѩC$; q(L ,'GEH`v2Ad'{1Z ca}p>HmcPD^v Oo^#mUt&U.UObR/GfpUS;RyXjAN[% Aɠa+lҚP"~7?[)A`O*B78W6Ȩݖ+*Ie͍Ngƥ0sp%rL+ AUWg9Dܤ~V`DIVKEF{⮠{R 퉦:bΰir EDP()(UAIHaޚ Y  Sǰ!Hҁ BͭAusaPo+m/ȪbIFy'UJ@2ݍ~zn4\?NG*o\͑/$)m% rle6BZD#EF>C)"躹xJǽDUϺՕ`'# a e᛫f^x6 V6v=9A,$O{ؙdyGU%6^p!YUp&AJBe$Z=w6@:šR$  `u+N}Hi_ϯF*&|n9n9dd~y~4f9ZK+ y'BfMW6a&=+Eo' 9=BSz j\Kق鴆] %^Bɱ&r.p<˳PF߬z!s >3rI## fwff6B!y%1B ?4c 1v:c}<6!K ]bc?l>xSn@)昊:CUU5DK+qm׻uJx\x@U‰}AQ*0u|Qj4[B$=y!Y-%UulYi(鴨3`wÕjBcN=- m[I.[MA=M ȗ(WyeMbIVRB(Zu6<,V__C W@H[QY$)m4Eٶ=Lh֫oO ?m 2Р-5ǣ⻼i^v=>Dy7N3U,XPv$+k9xV@QL`hE|)4Yag+a%l}ۢ_V }aN:#xHD{Otc c\zaspt'rq dK4jVa:0#w<0L Vu#cp£v064b`[3 i丸%9xK}n)$ɯ?:9~Zcˠ5[2ɉST']!GIOdp#%rS}.d^xxtree 7d9cdc26ea0ed38bfe314660cee41a45c6b1f0df parent 5346d6d0c96a0d3c3ca5265a547bc15287bdc87c author skyai_dev 1757130761 +1000 committer skyai_dev 1757130761 +1000 Add landing pages library with comprehensive components and demos 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude 4xJtree ccb2158592ceba49d06740f80a99a3bb0faae9d1 parent 876eb301a0d004dfd6c7e550c1ab532832f97dbb author skyai_dev 1757014657 +1000 committer skyai_dev 1757014657 +1000 Add comprehensive library expansion with new components and demos - Add new libraries: ui-accessibility, ui-animations, ui-backgrounds, ui-code-display, ui-data-utils, ui-font-manager, hcl-studio - Add extensive layout components: gallery-grid, infinite-scroll-container, kanban-board, masonry, split-view, sticky-layout - Add comprehensive demo components for all new features - Update project configuration and dependencies - Expand component exports and routing structure - Add UI landing pages planning document 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude 4&;xAtree 12c695930832d906bb579313cc3588a011e57f35 parent 2f56ee01b38996376a067c4d1bae4046cbf2c4d9 author skyai_dev 1756952927 +1000 committer skyai_dev 1756952927 +1000 Restructure layout components architecture - Move layout components from layouts/ directory to components/layout/ - Reorganize divider component from data-display to layout category - Add comprehensive layout component collection including aspect-ratio, bento-grid, box, breakpoint-container, center, column, dashboard-shell, feed-layout, flex, grid-container, hstack, list-detail-layout, scroll-container, section, sidebar-layout, stack, supporting-pane-layout, tabs-container, and vstack - Update all demo components to match new layout structure - Refactor routing and index exports to reflect reorganized component architecture 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude ѨSnx"tree 3181f9e6ef3d8c77eb44cae64e20130ca665bfea parent 2bbbf1b9f10d8191187a00720db7b0322484f2c7 author skyai_dev 1756900452 +1000 committer skyai_dev 1756900452 +1000 Rename shared-ui to ui-design-system - More descriptive name for design system library - Update all imports and configurations - No functional changes 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude  (xptree c5d132ff1e6eeb7e96d99f8f7014695b90505e5c parent e9f975eb02be74f3221c21339be6db4cf7e58b1e author skyai_dev 1756900245 +1000 committer skyai_dev 1756900245 +1000 Add comprehensive UI component expansion - Add new components: enhanced-table, fab-menu, icon-button, snackbar, select, tag-input, bottom-navigation, stepper, command-palette, floating-toolbar, transfer-list - Refactor table-actions and select components - Update component styles and exports - Add corresponding demo components 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude oő?xSKn1)lEx$iD*H rf1cBzl8gD3AdÆ{P8|Z1V@ EC./J>eE.eL 9cPy9;jF5B%]O Y͎:r"odc\,(-r"fj-CgK!*|4HZoeh4x@ [%**E|k.rDGq7ד&w/?ucZĭA*$xĮPYKѕ M8'¡}5$'{34W[ۋ&7/$țHmե8MPTÒ` bX'Ő9gd;s>\;Ľ*Vg sr ℨ4(:hdG=a_FDphT vHݦZg0-Y1ϲ_߾%`? |\)AZ>~8frq~e+;Z zwN VVl+?e~b:xSAn0{lQ']K cEIoEQȕņ"r}HyB $=EٙYkWR^VsjqTN[j\ňCMtZ{ZoQ/e\,P˶^WM{R'ͤoRfOdUj˦w, 0ҋGknbDp.2OzrQDKNp(3B&pYvپ0'.Ӡr0KNz>`qXKz'Ƒ֧ ?fmA& 3v$;%i).l-r^Y4ģ8ؒBb4%޹2#mӑHcpov]dNn #K{ 38NgMQS[if Ey)ӨSr)0Z <(GT!Y6OvHcpxS9Mxsc{lzb6$O֚V+:.dh2N&}%gy2Sp0g @r0z8ޙYIk;d+Z*LBג+jU)t/%SѬa>Im/?Ow5HR7r"@aKGKegyNzNԽqE"rjD$ɿJطcEWDć\`,~I`UJ4xvVҧ&Lb βoMԭNuhQxtree 637c3214a91d68bab3dfcdd14aff20df085dac63 parent 59837227935cfb16ed5b8b0ccadb24115f7fffff author skyai_dev 1756849834 +1000 committer skyai_dev 1756849834 +1000 Fix SCSS semantic token variable errors across components - Replace incorrect semantic token names with correct ones: • $semantic-border-width-thin → $semantic-border-width-1 • $semantic-color-border-default → $semantic-color-border-primary • $semantic-spacing-content-* → $semantic-spacing-component-* • $semantic-typography-body-* → $semantic-typography-font-size-* • $semantic-typography-caption-* → $semantic-typography-font-size-* • $semantic-motion-easing-standard → $semantic-easing-standard • $semantic-color-surface-tertiary → $semantic-color-surface-secondary • Various hover color tokens → base color tokens - Fix typography map usage errors: • Replace heading map tokens with individual size tokens • $semantic-typography-heading-h* → $semantic-typography-heading-h*-size - Update affected components: • tooltip, divider, progress-circle, range-slider components • Related demo components and SCSS files 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude c5xQtree 794ddc18509a3b763ceba8406a555d2b827cba98 parent c803831f607e5932af9a59d688fea81fc399e337 author skyai_dev 1756841889 +1000 committer skyai_dev 1756841889 +1000 Add comprehensive component library and demo application Added extensive component library with feedback components (empty state, loading spinner, skeleton loader), enhanced form components (autocomplete, date picker, file upload, form field, time picker), navigation components (pagination), and overlay components (backdrop, drawer, modal, overlay container). Updated demo application with comprehensive showcase components and enhanced styling throughout the project. Excluded font files from repository to reduce size. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude m+PYxktree a717ee546366a9dc9ddb649dd9c4a1ad9ba433d0 parent cd3211101c0e67d9034b246cb2fe675b055c4b1b author skyai_dev 1756772644 +1000 committer skyai_dev 1756772644 +1000 Add comprehensive semantic design token system Implement complete semantic layer for all design tokens including typography, spacing, motion, colors, borders, shadows, z-index, opacity, and glass effects. Each semantic token maps base design tokens to contextual usage patterns for improved maintainability and developer experience. Features: - Complete semantic typography system with font weights, sizes, line heights, and letter spacing - Comprehensive spacing tokens for components, layouts, and interactions - Full motion system with durations, easing, transitions, and hover transforms - Semantic color system with individual access to all Material Design 3 colors - Border tokens with widths, radius, and styles for all use cases - Shadow system including standard and AI-themed shadows - Z-index layering system for proper stacking context - Opacity tokens for transparency and visibility states - Glass morphism tokens with blur, opacity, and theming support All semantic tokens provide direct access to base token values while offering meaningful contextual aliases for common UI patterns. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude  xQ 0 tmN&Et=ݘ-Ē91$~q$pcT<P(`0unćRm}R*W֛rL9ٞ眡,r#`|q;x340031QH(I++*c(\^º֮۫^eQXQ6)9+׾9x?_@$8jآ[O[c^mʩE|oIN32x31$g#l 4<Ja5gEC3ҤdĂLb ̵%O¬4oigwx340031QH,-ML++.HM+)f0sQdJ #J`PR!rʎpO0Uk_KR1*%.z0u 2JRS JN c*Nk$G2Ԝb{Si6C滢FԢbE; 'q+%( STx340031QH,-K/M,J+)fb뛑5Oo kx340031QH,-+I-JN-(/+)f5/2aޮ/U\}x340031QH,-OI)+)fڳ݀o7YN; x340031QH,-())+N-*LN+)fV+ZQ$ܰ3i]IHf[5aCzd??VvͅӢg^ U V[#||pxcڒy;P1k(Erx'100644 favicon.icoWaOuУ+04x8100644 animations-demo.component.tskTѐ?} da<Eͤx4100644 appbar-demo.component.ts;JQ~ ' )vx4100644 avatar-demo.component.tsm] 'l 6ٔs/wx3100644 badge-demo.component.tsul +<B̙`x4100644 button-demo.component.tsDMolD;#Ͻ.nx2100644 card-demo.component.ts}2Y [1zuuMx6100644 checkbox-demo.component.ts1J0|I3 Ob +reXx2100644 chip-demo.component.ts7 @+ 4S*Ytxj100644 column-demo.component.scssŮ[^o,*hO100644 column-demo.component.tsև&&$rч:Y5(rx|100644 dashboard-shell-demo.component.scssV]/$5|3100644 dashboard-shell-demo.component.ts}owyɷ ’4x8100644 data-utils-demo.component.tsQ+t_': & xt100644 date-picker-demo.component.scssfmIUF3KO 100644 date-picker-demo.component.tsnACTr`{hǿ&u~, x)100644 font-manager-demo.component.htmlE+&IĮJ 5\100644 font-manager-demo.component.scsscƋ'o)DYy100644 font-manager-demo.component.tsR .pˇ}100644 index.ts5 ]J8۫2{:s*FUx 100644 hero-sections-demo.component.html=nwGt?Z|100644 hero-sections-demo.component.scss\U+8-ؘ5ѣԐ100644 hero-sections-demo.component.spec.ts65, uVV100644 hero-sections-demo.component.tsF}_*WUqS_ޤxt100644 icon-button-demo.component.scss.{.QRcDb@)100644 icon-button-demo.component.tspgNE/lx3100644 input-demo.component.tsf{"%Dvϫ#x9100644 landing-faq-demo.component.tsV&&ھ{100644 landing-timeline-demo.component.ts>A>,G_w36 x2100644 list-demo.component.ts%/6T[p؛A8:'xl100644 masonry-demo.component.scsspX[W:jZI100644 masonry-demo.component.tsҞ6e"߀h/R7FG-x8100644 pagination-demo.component.ts%R/b/6H6Цx6100644 progress-demo.component.ts8orQGAp1M ^.x3100644 radio-demo.component.tsgLzgtN}&w 佤x4100644 search-demo.component.tss< rҲL'Cax4100644 select-demo.component.tsaoN^/I|m$xx100644 sticky-layout-demo.component.scss:w /+100644 sticky-layout-demo.component.ts/9u#y,u0*x4100644 switch-demo.component.tst9o)J˲7;x3100644 table-demo.component.ts[]7Ӛ,\.fC_x7100644 tag-input-demo.component.ts e W'N0Gx6100644 textarea-demo.component.ts36xID)i,/Gxt100644 time-picker-demo.component.scssfmIUF3KO 100644 time-picker-demo.component.ts" v10WC!xr,߬x,40000 layout-containers|WrN,"fxt100644 layout-container.component.scss^ZnmWYZcv?[100644 layout-container.component.tsǴe,<UQ")yŚ6.ݫx{100644 _colors.scss"fа.zGtl2}100644 _index.scssiDy:100644 _typography.scssdK &[Y *Kz3YxG40000 lib6rL̜~H|9 100644 public-api.ts'UdD\nD@ Iԣx340000 core}*_BX哺AM100644 hcl-studio.component.spec.ts( ]qWT!Qg100644 hcl-studio.component.ts8`8T4g!100644 hcl-studio.service.spec.tse1J(ĉp~>100644 hcl-studio.service.tsxYJʖARBe840000 modelsCH.) 4v؍bc]40000 themes^u|gᙧ'KT!xlx\100644 hcl-converter.tsO>tkBD100644 palette-generator.tsċH\5O2V(%x)100644 hcl.models.ts,UN=|$7f]w «xt100644 css-variable-manager.tsD򹉂N+0Adn$100644 theme-presets.tsgAg*Nru%100644 theme-storage.tsU㨪~oGa5xG40000 lib4iNGU!M:/5p100644 public-api.tssIײ.19,Y x%100644 shared-utils.component.spec.ts6V̳kS: 3}se100644 shared-utils.component.ts9#,Z(¶:ŧ100644 shared-utils.service.spec.tsHNQe/-)J b|100644 shared-utils.service.ts4FR/i !?lRxG40000 libǝN tݴ_]^100644 public-api.tsPIjA2,U-kx[40000 components@;ٷ40000 directivesbh jN{Z-40000 servicesZnYnwǭE40000 tokensm\ SH?b<100644 ui-accessibility.module.tscZ>M 7VX{100644 ui-accessibility.service.spec.tsR44@v[& ;100644 ui-accessibility.service.tsߋ`jmԜ?&0ks40000 utilities,ao(k[.bxR40000 screen-reader-onlyI O_A=s40000 skip-linksKG`rE$mO!!x_100644 index.tsŷ||i(4100644 screen-reader-only.component.tsJ7fo&)(8y2?%ͧxW100644 index.ts y{ͅ~N100644 skip-links.component.tsl.,*r\EAd$P!ΠxP40000 arrow-navigationt#?4`ۊ!+40000 focus-trapuKea|j=+oq@ x]100644 arrow-navigation.directive.tsװh\&_7+rO100644 index.tskT^,ВxS%xW100644 focus-trap.directive.tsf\<igkp^ 100644 index.ts"vl-hQDl(թzHY"5 x540000 a11y-configp/paA'>ySj>40000 focus-monitor `/Bj6LސT峋40000 high-contrast2] RnP :40000 keyboard-manageraQ3|LhRO:40000 live-announcer1YV-@T~?-)׽LxV100644 a11y-config.service.tsSd`qJnY@n100644 index.ts[8^|b0`8-EkCF#exX100644 focus-monitor.service.tsDڙ%sl @B100644 index.ts_Ys5*ڜ?Qi>ɂ#xX100644 high-contrast.service.ts`ZOOX;Q,N100644 index.ts~ivNyc#9& x[100644 index.tsLqHIe100644 keyboard-manager.service.ts$lTr8q}CgohV*$xY100644 index.ts$ε!NB X4100644 live-announcer.service.ts%4D+)Ԛ"x,100644 a11y-tokens.scsszxg{ҷ-崩Y"׫xt100644 a11y-utilities.scss؋idhQo100644 focus-visible.scss1ꇻ ,b6b100644 screen-reader.scssKRoǮ*fX #!4xh40000 libBqI_:|L12Wc100644 public-api.ts$2T$tyQhWd40000 styles[4{{MLUs2c& xb100644 animate.directive.tsMb+? {]5R100644 ui-animations.service.spec.ts %T~P! W%100644 ui-animations.service.tsH:&;85_^.Ũ;6 xo40000 animationsLCTawdVmN%36 100644 index.scssH#* *h SDISUK40000 mixinsE@yWj.P40000 utilitiesyBo iO`]bOd6] xV100644 _emphasis.scssh1\0v100644 _entrances.scssk< CK^@±'100644 _exits.scssa-*l tHRk4\ 100644 _transitions.scssMThŊTT0Cx2100644 _animation-mixins.scss)bDSTN>Хx5100644 _animation-utilities.scsstpfZ:e"Ĩxh40000 libVYkjus100644 public-api.tslN|gK}ćGM 40000 styleshOnF%-h-! xR40000 components@S2A~*F3"@40000 directivesrTAs7d#7s)40000 servicesT'S@A5m},ɃKQ>40000 types/xq[ae@d100644 index.tsO1s2mii!V#{Nx 100644 gradient-background.component.tsϜF6ЭtQ.,s100644 image-background.component.tsʠ9E4#)6<'100644 index.tsBP4Ӗ\tԆj-ޢB100644 pattern-background.component.ts9ܞ>MY100644 solid-background.component.tsO<Ȟ;/$k&0AflMxW100644 background.directive.tsdCAjJX;"<o100644 index.tsS}'e|z*2|#.xU100644 background.service.tsq{0d,I100644 index.ts䝫 H.gf~z܈$ xS100644 background.types.tsVUNz100644 index.tssZP C*ZgxĝxW100644 background-generator.tsoڇOEhů9)100644 index.tsCW .[ sFߠ x_100644 _animations.scssH>fà  @100644 _base.scssC͜( ^D100644 _mixins.scss')Ŵ1gUc”100644 index.scss@`Ablz O'b5Ax 100644 .package-lock.jsonFJL*lj<40000 @angularHX[L=St40000 @types#.$h+ݯoLN40000 prismjs~ x}S#ccg"Re40000 rxjs1}* s\_~s;\40000 tslib4J: YH0ut40000 zone.jsGKUKS6UtΜbvx@40000 commonV O-ӣ]z&'v40000 corevW8k:IX!x100755 LICENSEH)ecPۨ100755 README.md}Z7 A;g46100755 common_module.d-NEF7UaHr.d.tsD%hr<,f ]M40000 fesm2022'ﴺ&n=qs40000 http%%c!YFtr[100755 index.d.tsC>񑴾V{$w8 40000 locales,u13Wb8^x100755 module.d-CnjH8Dlt.d.tsVyrSd1u>b4100755 package.jsonz8r_+&T!0100755 platform_location.d-Lbv6Ueec.d.ts.#vy`n[40000 testingWۨ)  W06O|PX40000 upgrade­ನj?M_o-O100755 xhr.d-D_1kTQR5.d.tsh!ap'%:=x&100755 common.mjs$_{ky;8 B100755 common.mjs.map'>1~"6ah8E#&_%100755 common_module-Dx7dWex5.mjs;isj(2In +f100755 common_module-Dx7dWex5.mjs.map~m MқqPu/p100755 dom_tokens-rA0ACyx7.mjscq89 =D~܊100755 dom_tokens-rA0ACyx7.mjs.mapr2y687j:x;e100755 http.mjsksa[FvaB7%顼p100755 http.mjs.map@2ZM)@Ÿ40000 httpJ[D v8@n%]dZt100755 location-Dq4mJT-A.mjs;R51Q`W100755 location-Dq4mJT-A.mjs.map 9H3Ȅ100755 module-z3bvLlVg.mjs35 lϘ KnX100755 module-z3bvLlVg.mjs.mapRXz%<C v0%?H100755 platform_navigation-B45Jeakb.mjsbڀ?DדX"100755 platform_navigation-B45Jeakb.mjs.map,qG/ R100755 testing.mjs×'Pޥ'%1100755 testing.mjs.mapo'яÝU@100755 upgrade.mjs[ḌÓ&y:R Tv h100755 upgrade.mjs.map{xq gsHF/lG=100755 xhr-BfNfxNDv.mjs[-֕陪+$V100755 xhr-BfNfxNDv.mjs.mapb%=bSEn xD1u*xR100755 testing.mjs3>HS1 \5VC3100755 testing.mjs.map d/*Wj`Se[ШxH100755 index.d.ts8KR16]}W3R40000 testingT~ ձsN^ɺ{'cXOx&100755 index.d.ts)[-򔣲!$ŸmB5xh100755 af-NA.d.tsF6Svo.100755 af-NA.js=E@:3u+Q100755 af-NA.js.mapkTCH100755 af.d.tsH6~p{Srp8g%100755 af.js C4߅U<$100755 af.js.mapgP^gVMq"l100755 agq.d.tsmj㣅Lw XN100755 agq.js p!D b+des100755 agq.js.map.RLwv<100755 ak.d.tsY]a 3D_100755 ak.js8L}a@\E100755 ak.js.mapt3p X|GC100755 am.d.tsVm2!p;/h100755 am.js@P KEI`100755 am.js.map_'AC100755 ar-AE.d.tse/(,4:_100755 ar-AE.jstPzD100755 ar-IQ.d.tsah^2ubK100755 ar-IQ.js>v]`fW.&100755 ar-IQ.js.map$Yv[ #^~~100755 ar-JO.d.tsah^2ubK100755 ar-JO.js"/ear#vY{ W-100755 ar-JO.js.maphӏB%È100755 ar-KM.d.tsߦ;}I"\1;)100755 ar-KM.js"v0ߎay~100755 ar-KM.js.map魲0W~׍ak100755 ar-KW.d.tsah^2ubK100755 ar-KW.js@HϾI~2`cj100755 ar-KW.js.mapW B:4$/'p100755 ar-LB.d.ts쟇\ەn>100755 ar-LB.js8"uZM3w$Ka100755 ar-LB.js.mapl j־l,Ow P100755 ar-LY.d.tsah^2ubK100755 ar-LY.jsYhx˄bWty100755 ar-LY.js.mapiNϣb?=100755 ar-MA.d.tsah^2ubK100755 ar-MA.jshd9v-KW100755 ar-MA.js.mapaK.pd*}L100755 ar-MR.d.tsah^2ubK100755 ar-MR.jsR l s<߭100755 ar-MR.js.map2%JF+@F100755 ar-OM.d.tsah^2ubK100755 ar-OM.js⬪'>/}lw%R*ۆmH100755 ar-OM.js.mapv"@Vyz~#F@䰡100755 ar-PS.d.tsah^2ubK100755 ar-PS.js2©@}d:Թ: 100755 ar-PS.js.map C.">]3fEzipm 100755 ar-QA.d.tsah^2ubK100755 ar-QA.jsJ·}ߤ0100755 ar-QA.js.map4F T100755 ar-SA.d.tsah^2ubK100755 ar-SA.jsqQ"VHe},Q7cdA5100755 ar-SA.js.mapUvnӍ ο@AD)100755 ar-SD.d.tsah^2ubK100755 ar-SD.jsL{io100755 ar-SD.js.mapNFaV8K<(DB100755 ar-SO.d.tswItw W,8 }d100755 ar-SO.js$XGd#100755 ar-SO.js.mapHIVݒZJ؍vR}100755 ar-SS.d.ts"x" &w100755 ar-SS.jsƇ/# &>\F-0u 6100755 ar-SS.js.map(ejizU/Bɕ100755 ar-SY.d.tsah^2ubK100755 ar-SY.js}ӭUŚPVC100755 ar-SY.js.map+̰q@D{?100755 ar-TD.d.tsah^2ubK100755 ar-TD.jsg"]Ipʙyl100755 ar-TD.js.mapbȘȩ 9֩ڰ100755 ar-TN.js.map!}ˌX?6A100755 ar-YE.d.tsah^2ubK100755 ar-YE.js'1ϭоmH]jFۃal100755 ar-YE.js.mapeɀmX8M100755 ar.d.tsah^2ubK100755 ar.jsɎm ic3#P^>100755 ar.js.mapONbwnXs7$'(100755 as.d.ts^~V5&9xt@PD 100755 as.js8CӊD&RH100755 as.js.mapO˵MD!%100755 asa.d.tsp!Q{䌀-Q=100755 asa.js/Ih-m Ľ100755 asa.js.map~| q^]w100755 ast.d.tsN#ƪS@0QNW100755 ast.jsLȏYMpVL7}100755 ast.js.map|Jsk100755 az-Cyrl.d.ts',{+͸T}cjGy100755 az-Cyrl.js [KWPjh9iJr~̿100755 az-Cyrl.js.map? 4.*I 100755 az-Latn.d.tswmg?100755 az-Latn.js9ᕮLfh<8s,100755 az-Latn.js.mapq 7=k]qkI100755 az.d.tswmg?100755 az.js'ƍ^ x /-.100755 az.js.mapt>Iг Xap,A100755 bas.d.tsmj㣅Lw XN100755 bas.js7ØMFfarFEP100755 bas.js.mapyd𠬱':Ϻ100755 be-tarask.d.tsDUnV,/n`Y$100755 be-tarask.js=:`|6/utxP100755 be-tarask.js.map]Ky ;u4pǸ100755 be.d.tsDUnV,/n`Y$100755 be.jsK%/m(to3100755 be.js.map(mdEQd*100755 bem.d.tsdHP"#?cutbw100755 bem.js";J+0yyǔ100755 bem.js.mapr$P!֛/9100755 bez.d.tsp!Q{䌀-Q=100755 bez.js AP.}\F'j 100755 bez.js.mapS'µkdu100755 bg.d.ts3ϓ3WxN>­坐100755 bg.jstA,!CKЮ100755 bg.js.mapl 비ݳh|\100755 bm.d.tsmj㣅Lw XN100755 bm.jsU)+htjpS Q$100755 bm.js.map>kMkt/@f2 ^100755 bn-IN.d.tsФnDVk}ʸ޷XL100755 bn-IN.jsH.Ҿ3Y"52z100755 bn-IN.js.map%4XYߔ)t-100755 bn.d.tsФnDVk}ʸ޷XL100755 bn.js5dڡcݵ0)Ee}100755 bn.js.map" _䃼Cr_v8100755 bo-IN.d.tsmj㣅Lw XN100755 bo-IN.jsCI"*kQfP100755 bo-IN.js.mapsKi%DF}j0100755 bo.d.tsӑ`H(gY#Ca100755 bo.js1Kk lpX0_k100755 bo.js.mapvy! 1H3vE100755 br.d.tsUހ`M100755 br.jsMϜ8;v*100755 br.js.mapgtm3J˔ˎY100755 brx.d.ts^PPeW2a֮100755 brx.js#nC]n8i׏pg3100755 brx.js.mapj2Hu sX p6d100755 bs-Cyrl.d.ts%Ro(n100755 bs-Cyrl.jsbN!ݥ83cXph100755 bs-Cyrl.js.mapnQ3=HwG100755 bs-Latn.d.tsPڪ:^qwܽ5:r)100755 bs-Latn.jsPY|3[nɾDw3100755 bs-Latn.js.map|ZݼQIo,100755 bs.d.tsPڪ:^qwܽ5:r)100755 bs.jsu|&)Zvd E100755 bs.js.mapP&>_ΨFSN100755 ca-AD.d.ts@# Qz+U100755 ca-AD.js$IùC!zط&100755 ca-AD.js.maptfo0|M ?i100755 ca-ES-valencia.d.ts@# Qz+U100755 ca-ES-valencia.js26넍#S100755 ca-ES-valencia.js.mapjp*̂b 4C100755 ca-FR.d.ts!ſyb,m s100755 ca-FR.jszlS%2g9-6V100755 ca-FR.js.mapw@<'##B100755 ca-IT.d.ts@# Qz+U100755 ca-IT.js{͢J5ӏ~|100755 ca-IT.js.map&8aԁ٠IJl100755 ca.d.ts@# Qz+U100755 ca.js1;M5=ZBo8N[S100755 ca.js.mapj^U +/2100755 ccp-IN.d.ts&>/R t'rֿ:100755 ccp-IN.js 5`֩}ͺ%h100755 ccp-IN.js.mapCmA as100755 ccp.d.ts&>/R t'rֿ:100755 ccp.jsMb$oڣoa0g{ 100755 ccp.js.mapD RQE|\100755 ce.d.tsv <(q#̬ȟ100755 ce.js\jiz} 8*7U100755 ce.js.mapݶC ,V籾Yћ100755 ceb.d.tsmj㣅Lw XN100755 ceb.js&ˎw47BjkbD/100755 ceb.js.map. GRӐZ100755 cgg.d.tszhHy)ZU֌o100755 cgg.jsܗ0Zvvl100755 cgg.js.mapkxA+&w}P100755 chr.d.tsYyC3a0M/100755 chr.jsS*8P׸b|100755 chr.js.map* nfro100755 ckb-IR.d.ts[t\hhpN'100755 ckb-IR.jsL+Ssvle100755 ckb-IR.js.map݄,ד zU2s\100755 ckb.d.ts[t\hhpN'100755 ckb.jsHm:s jHw)}9100755 ckb.js.mapxKf{:چK100755 cs.d.tsr5#a l100755 cs.js rD!b/100755 cs.js.map}-4Nz~SNNh100755 cy.d.tscr7Bsh*\100755 cy.js"ӘF-n#100755 cy.js.map{jUcN>c׆IC100755 da-GL.d.tsUvӜ&*Pg100755 da-GL.jsq"[>5;iMP꙽100755 da-GL.js.map;M}ʂ\e1Ȣ_+100755 da.d.tsUvӜ&*Pg100755 da.js/.=!`P 100755 da.js.map2 M!EYƘA100755 dav.d.ts;Czo xCui5100755 dav.js0(sT5>/xqFyϋ(J100755 dav.js.mapb,p|]0*100755 de-AT.d.tsTܳ LPۉ֖{Ks100755 de-AT.jsŝmy|*PqY100755 de-AT.js.mapk )sa:#2w100755 de-BE.d.ts5.x(o<r100755 de-BE.jsnJUpH,l>100755 de-BE.js.mapMD_d4~6100755 de-CH.d.ts:\[$(7!9̠<100755 de-CH.jsffvA<100755 de-CH.js.map뎄%z100755 de-IT.d.ts5.x(o<r100755 de-IT.jsU(}arA-㾀.100755 de-IT.js.map/j$A\'q100755 de-LI.d.tsI|\Oe100755 de-LI.jssz跹 &T;jƣ!`100755 de-LI.js.mapA΂ }<=G'LW100755 de-LU.d.ts{>?2L#3hx!.100755 de-LU.js_#ry/°̝100755 de-LU.js.map'wQ^wЎa7Hl100755 de.d.ts5.x(o<r100755 de.js1pjУN8``^ʌ100755 de.js.map}MmU>1'"2100755 dje.d.tsmj㣅Lw XN100755 dje.js_SE4[CT+W$ӋK#100755 dje.js.map[ e[ aC100755 doi.d.ts{^+O҇|h{'NY100755 doi.js |&r100755 doi.js.map\5dwy@fn100755 dsb.d.tsr9dTe'2;100755 dsb.js>MXjJƶل}100755 dsb.js.mapaU< ׫{@? /E100755 dua.d.tsmj㣅Lw XN100755 dua.jsk*(tj*.C100755 dua.js.map$IPpuy}()100755 dyo.d.tsmj㣅Lw XN100755 dyo.js4"jD^ xY/100755 dyo.js.mapx$cLIR59vx#100755 dz.d.tsTEC!ͩl~100755 dz.jsc+?VH!100755 dz.js.map11Zn=7vZ100755 ebu.d.ts;Czo xCui5100755 ebu.jsĵk¸Yqx100755 ebu.js.map2aǓ4c̊"$uI100755 ee-TG.d.tsAA&.>NH100755 ee-TG.js,c+(f[>sii7100755 ee-TG.js.map;yArf&1Y)hs100755 ee.d.tsAA&.>NH100755 ee.jsg5Hي l#100755 ee.js.map~T}%100755 en-001.js.map2V8 *gĕ100755 en-150.d.tsmj㣅Lw XN100755 en-150.jsk a}ibXirf-C100755 en-150.js.map ܘG"ķ"r?ԜՐ 100755 en-AE.d.ts()QٸdC;ÀH100755 en-AE.js1cZX{{Hx100755 en-AE.js.maplY(S#eM׏ʨ100755 en-AG.d.tsxjX0D+zCr100755 en-AG.jsu$ltN2100755 en-AG.js.mapkߚzf7h^100755 en-AI.d.tsxjX0D+zCr100755 en-AI.js;2+c)`VJi^100755 en-AI.js.mapyykJظFcT\ 100755 en-AS.d.ts()QٸdC;ÀH100755 en-AS.jsC::8̻84M100755 en-AS.js.map-,YH.";|,Hm100755 en-AT.d.tsmj㣅Lw XN100755 en-AT.jsxTvقfJjM{m0100755 en-AT.js.mapl)aXssnyZ100755 en-AU.d.ts\U5ڛkϘ100755 en-BB.d.tsYxD>'Y#m-100755 en-BB.jsVxP#WY8+Y100755 en-BB.js.mapօJ܀!F7]v100755 en-BE.d.tsmj㣅Lw XN100755 en-BE.js*b%+{h ?100755 en-BE.js.mapJHlD쒗)RlH100755 en-BI.d.tsd/dY4:{%*100755 en-BS.js@4-uWK gerNSÑI100755 en-BS.js.map]l=PuJTKx100755 en-BW.d.ts(-:ZF=bm100755 en-BW.jsT*avy/m+100755 en-BW.js.mapy{=Ǩ8JVw:7100755 en-BZ.d.tsSvLbѥbWea6_~8[100755 en-BZ.js2&ִV8l~100755 en-BZ.js.mapU5=Rkw)= 100755 en-CA.d.ts׿D7cֶ100755 en-CA.js B)_pSdZl;f100755 en-CA.js.map6fw]y100755 en-CC.d.ts$)k8 ^[oi:*B1z100755 en-CC.jsS[K :d100755 en-CC.js.mappp8@v!#ܲ9100755 en-CH.d.tsmj㣅Lw XN100755 en-CH.jsR~j՜+nVo100755 en-CH.js.mapC ϥhiږ(QE100755 en-CK.d.tsBp5Da>xND`ߤGF100755 en-CK.jss9Fm;id100755 en-CK.js.mapteln100755 en-CM.d.tsmj㣅Lw XN100755 en-CM.jsyԠTwgW!RFK100755 en-CM.js.maprO]S+5A0100755 en-CX.d.ts$)k8 ^[oi:*B1z100755 en-CX.js0b`U* 2$$;100755 en-CX.js.mapWxIHFLǂ/100755 en-CY.d.tsmj㣅Lw XN100755 en-CY.jsCDpjDѬz100755 en-CY.js.mapm!&@+Cr100755 en-DE.d.tsmj㣅Lw XN100755 en-DE.jsdު`o'w)% [100755 en-DE.js.map^ /a5V،,m( 100755 en-DG.d.tsmj㣅Lw XN100755 en-DG.jsHi(5Uj;@r100755 en-DG.js.map KtC[6ɩW100755 en-DK.d.tsjn:ӹkCc100755 en-DK.jsN;|?f!100755 en-DK.js.map ? Y100755 en-DM.d.tsxjX0D+zCr100755 en-DM.jssS4ȺAWd100755 en-DM.js.map}j̋/fwOm100755 en-ER.d.ts |n4 oYʩk3100755 en-ER.jsF~sOzE7V _100755 en-ER.js.maps!x(~Lzc.V100755 en-FI.d.tsmj㣅Lw XN100755 en-FI.jsnvZ˪F"100755 en-FI.js.mapDk`f]sa fV100755 en-FJ.d.tsVhs5]&s100755 en-FJ.js{S(NO2]100755 en-FJ.js.map&%cDILl7:100755 en-FK.d.ts)H u5ƃud100755 en-FK.jsZd ]Գt100755 en-FK.js.mapb0@{:u4r8100755 en-FM.d.tsmj㣅Lw XN100755 en-FM.jstp#xRyvK K100755 en-FM.js.mapd sfۍନ100755 en-GB.d.tsmj㣅Lw XN100755 en-GB.jsʮJ|sBM[< U100755 en-GB.js.mapx(ޟ$ƿ8"e K100755 en-GD.d.tsxjX0D+zCr100755 en-GD.jsW䡼TO<%2xq100755 en-GD.js.map K,PRG]C1I C100755 en-GG.d.tsmj㣅Lw XN100755 en-GG.jsS-H%z}#&Ͳ100755 en-GG.js.map=LIrV: 100755 en-GH.d.tsY]a 3D_100755 en-GH.js_PSPE100755 en-GH.js.mapb%c`G" d100755 en-GI.d.tsTG9L%h"100755 en-GI.jso#Ox\S_gdǔ100755 en-GI.js.mapeF \zx}kmA100755 en-GM.d.ts`NX7\8UZEqZ( 100755 en-GM.jsYx*)JS*|100755 en-GM.js.mapvvsJ22fR100755 en-GU.d.ts()QٸdC;ÀH100755 en-GU.jsQOh{ۋk"100755 en-GU.js.map,퀤xhuڈB100755 en-GY.d.tsT{gVj<,DžgZ#100755 en-GY.js` !B@MUNQ#100755 en-GY.js.mapbZA:-`ϊ6100755 en-HK.d.tsmj㣅Lw XN100755 en-HK.jsЎH+@[x.HL 100755 en-HK.js.mapOi,"" kvY100755 en-IE.d.tsmj㣅Lw XN100755 en-IE.jsA^ _HA쁞俣z100755 en-IE.js.mapӕ'.S Gv100755 en-IL.d.tsmj㣅Lw XN100755 en-IL.js6<;M3hG6cI100755 en-IL.js.mapql)Rp\100755 en-IM.d.tsmj㣅Lw XN100755 en-IM.js0a ;&100755 en-IM.js.map?تS$X<3100755 en-IN.d.ts4u17eq100755 en-IN.js3F޶|㓆100755 en-IN.js.map;+Lc&3100755 en-IO.d.tsmj㣅Lw XN100755 en-IO.js8/A? h 100755 en-IO.js.map3Z+j\7=100755 en-JE.d.tsmj㣅Lw XN100755 en-JE.js6[ nv5x34*100755 en-JE.js.mapef-*<g8Z100755 en-JM.d.tskpwLs_]100755 en-JM.jsvz}F~HxgUa@100755 en-JM.js.maprwy*l{100755 en-KE.d.ts;Czo xCui5100755 en-KE.js5[SE)}MzE1i]j9100755 en-KE.js.map!Km33 100755 en-KI.d.ts$)k8 ^[oi:*B1z100755 en-KI.jsfDdٛ7\Y100755 en-KI.js.mapݢ tGt)|/#E5100755 en-KN.d.tsxjX0D+zCr100755 en-KN.jsrrFMdkf8100755 en-KN.js.mapUʧz!(%PUgc4|gY*100755 en-KY.d.tsJB1Obudap@100755 en-KY.jsOm ųY~Q_xo100755 en-KY.js.map{TqK@%ͳ100755 en-LC.d.tsxjX0D+zCr100755 en-LC.jsBY|Ƃ Տ100755 en-LC.js.map[;I|~l100755 en-LR.d.ts.;dUI[i.j9J=*$100755 en-LS.js[Qhf3H`:7100755 en-LS.js.mapұ)xluQ'[dg 100755 en-MG.d.ts^@2!r< 100755 en-MG.js^ј<&>CMG i100755 en-MG.js.map\KTN6"<503100755 en-MH.d.ts()QٸdC;ÀH100755 en-MH.jsraJ͡U/ݬL3'100755 en-MH.js.mapSo=tr29/F 100755 en-MO.d.tsfO={>濜}100755 en-MO.jse3E?b*5Cr~100755 en-MO.js.mapS- PGN100755 en-MP.d.ts()QٸdC;ÀH100755 en-MP.js?Ѳ8g x100755 en-MP.js.map-B<\^+AK$t100755 en-MS.d.tsxjX0D+zCr100755 en-MS.js̡QDXr{Z@+P100755 en-MS.js.mapvIȥkO*100755 en-MT.d.tsGz* OHxh100755 en-MT.js ykCKΫ_:100755 en-MT.js.mapܡV`. Յ/>100755 en-MU.d.tsQhF O!Rh100755 en-MU.jsL'# 100755 en-MU.js.map0t7fQυY%n100755 en-MV.d.ts{Ϛ 6g ȑWD~100755 en-MV.jsB(*ؤHȒ(100755 en-MV.js.map|A“[\100755 en-MW.d.tsY+U΃XЂI9b1F~!100755 en-MW.js|'1GG]sy=l`100755 en-MW.js.mapG|jՕ|A킡100755 en-MY.d.tsTT6gfLUJ!100755 en-MY.js@fCH!U100755 en-MY.js.mapHqtdMm ^M100755 en-NA.d.tslL']5w^ 8?P/100755 en-NA.js03t2q8[jcHf{#100755 en-NA.js.mapgmw@+^ 5Վ7vL100755 en-NF.d.ts$)k8 ^[oi:*B1z100755 en-NF.jsˋۉV><6#$,100755 en-NF.js.map^VåXtƭ100755 en-NG.d.ts4'-~>) c100755 en-NG.jsO0Rj]^ O@և%100755 en-NG.js.mapӦ crQ 4IR100755 en-NL.d.tsmj㣅Lw XN100755 en-NL.js$(iezSmI,q100755 en-NL.js.map%L\ug5zl100755 en-NR.d.ts$)k8 ^[oi:*B1z100755 en-NR.js4eַE{GS\)CF100755 en-NR.js.mapu[9&Lą lt100755 en-NU.d.tsBp5Da>xND`ߤGF100755 en-NU.jsY.TT>N9$(~ѻbx100755 en-NU.js.mapGO4=:Kd100755 en-NZ.d.tsBp5Da>xND`ߤGF100755 en-NZ.jsyw&IQ_;ͩ\100755 en-NZ.js.mapjFXsTU5100755 en-PG.d.ts.z23'S,G100755 en-PG.jsH&{-pZ#/^Fe100755 en-PG.js.mapcO5u4u~Pu',fb100755 en-PH.d.ts()QٸdC;ÀH100755 en-PH.jsѮq-gbr100755 en-PH.js.mapOFRߌ?TL2100755 en-PK.d.ts碫B.8JכHL100755 en-PK.js//TnŘ:100755 en-PK.js.map#UOuނ100755 en-PN.d.tsBp5Da>xND`ߤGF100755 en-PN.jsTW\}.+'}#J100755 en-PN.js.map `{v<5G,100755 en-PR.d.ts()QٸdC;ÀH100755 en-PR.jsg] Ձ^100755 en-PR.js.mapfU9~100755 en-PW.d.tsmj㣅Lw XN100755 en-PW.jsfQ}A!Cc̆100755 en-PW.js.map-hd8­n&100755 en-RW.d.tsщ\DxCpT100755 en-RW.js+Q؎pT[܉_a82100755 en-RW.js.map#'Vm 9{7յ100755 en-SB.d.tsTQ/EWUvxX0w100755 en-SB.jsܚA#NF#0J#100755 en-SB.js.mapp Q!MCIX100755 en-SC.d.tsF[x&Wk0d^100755 en-SC.js?U- !uƇKs100755 en-SE.d.ts腙Apg׸27+100755 en-SE.js/d^m[C/I100755 en-SE.js.mapS<qLl100755 en-SG.d.ts g3+|xJU 100755 en-SG.jsjSo!`"Шt100755 en-SG.js.mapUcF+|2±ͣ100755 en-SH.d.ts$ٛEqc100755 en-SH.js@K#wOHlg:100755 en-SH.js.map-baE8؞߃ul100755 en-SI.d.tsmj㣅Lw XN100755 en-SI.jsn@U\X0100755 en-SI.js.map++WPq#G100755 en-SL.d.tsd@wy7Gqi100755 en-SL.jscuA /5D100755 en-SL.js.mapu˜su']iK100755 en-SS.d.tsF6̈́SԽӁ100755 en-SS.jscoYت%,џ100755 en-SS.js.map}$sqp:B100755 en-SX.d.tsghzTwΓgxRR100755 en-SX.jsHr,LQ=ك>ָ100755 en-SX.js.mapj]JWOŤ.6y2100755 en-SZ.d.tsOSb>90P100755 en-SZ.js vKneMd1E2100755 en-SZ.js.map%'G:W_L 100755 en-TC.d.tsmj㣅Lw XN100755 en-TC.js)^~|k*]sDL100755 en-TC.js.map' P93;Vp'100755 en-TK.d.tsBp5Da>xND`ߤGF100755 en-TK.js]4?_Hh?,Z*C100755 en-TK.js.map2>e 34-:GB100755 en-TO.d.ts1 zb\qҋteDS100755 en-TO.jsQYEUzSgiPʙG100755 en-TO.js.mapec>λU_e100755 en-TT.d.ts|pP aT<(' 100755 en-TT.js`.8k˃s&jF100755 en-TT.js.map٫@sXÓּǻ100755 en-TV.d.ts$)k8 ^[oi:*B1z100755 en-TV.js P.??xi׹100755 en-TV.js.map,On`lT100755 en-TZ.d.tsp!Q{䌀-Q=100755 en-TZ.js Td@ON7100755 en-TZ.js.map{~]gvpD100755 en-UG.d.tszhHy)ZU֌o100755 en-UG.jsif@/#k Q)w 100755 en-UG.js.map>\ۂEqM( ר100755 en-UM.d.ts()QٸdC;ÀH100755 en-UM.js( B?4ڎ5100755 en-UM.js.mapD w\C('100755 en-VC.d.tsxjX0D+zCr100755 en-VC.jsի4؟VR2v100755 en-VC.js.map裛`%{I100755 en-VG.d.tsmj㣅Lw XN100755 en-VG.jseY%rH`0E}100755 en-VG.js.mapo*100755 en-WS.js.mapz2qN1i-100755 en-ZA.d.tsO>9J=*$100755 en-ZA.js܏V9N100755 en-ZA.js.map$ ޏ "~100755 en-ZM.d.tsdHP"#?cutbw100755 en-ZM.jsYu6^q Z100755 en-ZM.js.map, ,e1+#dnґ100755 en-ZW.d.tsmj㣅Lw XN100755 en-ZW.js&'n R@W100755 en-ZW.js.mapV5*EbԚ100755 en.d.ts()QٸdC;ÀH100755 en.js[ߝn }Nekc~"P100755 en.js.mapJ3هNd\K100755 eo.d.tsmj㣅Lw XN100755 eo.js_ zC7^ 100755 eo.js.map1^{S|{ T100755 es-419.d.tsddegН\Q|100755 es-419.js2ۈ,`+100755 es-419.js.mapmD`0'a?wv*100755 es-AR.d.tsK`a? ֑3YYu 100755 es-AR.jsuRa@ /100755 es-AR.js.mapg͕M{>>100755 es-BO.d.ts8lRI* ]F100755 es-BO.js8)}%ë.P100755 es-BO.js.mapri<5eP;j}QQy100755 es-BR.d.tsi˥uq _100755 es-BR.jsL),H8!a{V%100755 es-BR.js.map)gZX],yʩi100755 es-BZ.d.tsw~&V '@ŤA100755 es-BZ.jscRU|[ͱq[100755 es-BZ.js.mapH'SUhN?|$100755 es-CL.d.ts rt8 #u100755 es-CL.js[jU ğv( a[q,100755 es-CL.js.map0'ނSxg^9!100755 es-CO.d.ts[w0=̈́nsYw100755 es-CO.jsIz?g3p|100755 es-CO.js.map:c|>W"ƫ{%bY100755 es-CR.d.ts#Raftqђs100755 es-CR.js}\"  >|SO100755 es-CR.js.mapl)Zf$!CQ#={v100755 es-CU.d.tsVx(5ݤ+&+:<.%100755 es-CU.js"]zqk=sc100755 es-CU.js.mapi͈<1"3100755 es-DO.d.tsAbI;100755 es-DO.jsίb [-9@'100755 es-DO.js.map P5FUĦ100755 es-EA.d.tsw*3bL$` Q100755 es-EA.jsY63*F{s:mwY100755 es-EA.js.map3j mVHئ100755 es-EC.d.ts{" ܶ訽v)䄵100755 es-EC.jsmn@zyd}~Or"\.100755 es-EC.js.map*)j+100755 es-GQ.d.ts)mKWFE"4X0i100755 es-GQ.jsي8_v~tnR@U;|100755 es-GQ.js.mapH8htE c100755 es-GT.d.ts`MM=ܣ&/100755 es-GT.jsv|xB+гY100755 es-GT.js.map>6*F#jg$A_100755 es-PY.js.mapCodv`HvAea]100755 es-SV.d.ts{" ܶ訽v)䄵100755 es-SV.js=sarP.a?E;ߖ,100755 es-SV.js.mapַG??NZ׾]100755 es-US.d.ts c , Q: Y'100755 es-US.jsϘ툽.dTW& ]j 100755 es-US.js.mapF|<65Օ)`M=100755 es-UY.d.tsb 5j^-ќ߈}100755 es-UY.js9%*B@100755 es-UY.js.mapO^[qMvL2eH100755 es-VE.d.tssc2s/ ~G100755 es-VE.js$SYDϳ['/100755 es-VE.js.map3^Bx `sB̍Tl@100755 es.d.tsw*3bL$` Q100755 es.jss Ǩ6 ~]A};100755 es.js.mapR0_)=͆" 100755 et.d.ts,MEQ \100755 et.jsVC)uN\l.'@!e100755 et.js.mapQ`T;xsw@F100755 eu.d.ts^^G#qyUIʞ/100755 eu.js QҚ\D yOV100755 eu.js.map{TR܍u[100755 ewo.d.tsmj㣅Lw XN100755 ewo.js 3,ta MY.#x100755 ewo.js.map5|_2ƴDQA40000 extra "lc7Dv100755 fa-AF.d.tssL6,%L)>'b100755 fa-AF.jsbDCG(100755 fa-AF.js.map'!mEEf΄M100755 fa.d.tssL6,%L)>'b100755 fa.jsTd%.7 31s 100755 fa.js.mapO0_7:< Iu-0100755 ff-Adlm-BF.d.ts>NͣN$%JC:100755 ff-Adlm-BF.js^fP,9քNͣN$%JC:100755 ff-Adlm-CM.js(pc=ڒE/")#5SR100755 ff-Adlm-CM.js.map1 %k@lJB100755 ff-Adlm-GH.d.ts_wEf;100755 ff-Adlm-GH.js©Cj#DL]D100755 ff-Adlm-GH.js.map^-2?%{-5A100755 ff-Adlm-GM.d.tsE2mUhTVYlt躖100755 ff-Adlm-GM.js=whB's#i($ I100755 ff-Adlm-GM.js.map'[f[rJO,f100755 ff-Adlm-GW.d.ts>NͣN$%JC:100755 ff-Adlm-GW.js䪅O0q6Zz!9(!U3100755 ff-Adlm-GW.js.map-Bn]:< |100755 ff-Adlm-LR.d.tsNͣN$%JC:100755 ff-Adlm-NE.js_k9l@ ->8= bQ100755 ff-Adlm-NE.js.map'=m b+fyv^o3100755 ff-Adlm-NG.d.ts>NͣN$%JC:100755 ff-Adlm-NG.jsztZN6 p"؆100755 ff-Adlm-NG.js.map V3tQ$kcv100755 ff-Adlm-SL.d.ts7}EJB-] x100755 ff-Adlm-SL.jsF1kl8 2=i100755 ff-Adlm-SL.js.mapL1 J~L3vcz100755 ff-Adlm-SN.d.ts>NͣN$%JC:100755 ff-Adlm-SN.jsGE?P}͍wew100755 ff-Adlm-SN.js.map?8erFeaPĎq100755 ff-Adlm.d.ts\n)i>y5O $3.#100755 ff-Adlm.js[szߤY"Cpmf100755 ff-Adlm.js.mapKtz tɞJ100755 ff-CM.d.tshtR rHLJQ&100755 ff-CM.js tId01@L'h100755 ff-CM.js.mapM\/kX2L100755 ff-GN.d.ts;'4(}%Du100755 ff-GN.js V!;>xb1k7w*100755 ff-GN.js.mapy`8*eChp%0n\100755 ff-Latn-BF.d.tsmj㣅Lw XN100755 ff-Latn-BF.jsidkbZڟj!F100755 ff-Latn-BF.js.map:Ⳟ鈖]^~>6100755 ff-Latn-CM.d.tsmj㣅Lw XN100755 ff-Latn-CM.jsv&d&xd2L100755 ff-Latn-CM.js.mapOrI j7W-#I100755 ff-Latn-GH.d.tsY]a 3D_100755 ff-Latn-GH.js%esg.8j100755 ff-Latn-GH.js.mapzotQȦ2'TtNG100755 ff-Latn-GM.d.ts`NX7\8UZEqZ( 100755 ff-Latn-GM.jsgTs100755 ff-Latn-GM.js.mapÜyHB8ҼW100755 ff-Latn-GN.d.ts-oFG|$2,)g100755 ff-Latn-GN.js> ѣ/%d}::,100755 ff-Latn-GN.js.mapRedWYElHHp100755 ff-Latn-GW.d.tsmj㣅Lw XN100755 ff-Latn-GW.jsaq t&&;100755 ff-Latn-GW.js.map6]Bvq100755 ff-Latn-LR.d.ts.;dUI[i.jIH100755 ff-Latn-NE.d.tsmj㣅Lw XN100755 ff-Latn-NE.jsiXUl=<^d+100755 ff-Latn-NE.js.mapp:#c>bCv%100755 ff-Latn-NG.d.ts4'-~>) c100755 ff-Latn-NG.js p"I?sC100755 ff-Latn-NG.js.mapAI՞ / +tެ~\100755 ff-Latn-SL.d.tsd@wy7Gqi100755 ff-Latn-SL.js4G7 2<H #]1100755 ff-Latn-SL.js.map»W'a z'100755 ff-Latn.d.tsmj㣅Lw XN100755 ff-Latn.js .F`uRM100755 ff-Latn.js.map|MO|1cba,100755 ff-MR.d.ts0cD̏{jm|Z٥100755 ff-MR.js+!?ϰ @100755 ff-MR.js.map,I؎nRjT3ɕ100755 ff.d.tsmj㣅Lw XN100755 ff.js͓K100755 ff.js.map7a2m9Ol@Qt100755 fi.d.tsn26'AmHa100755 fi.js^`tۛ%1kWF100755 fi.js.mapiJ߱A)Z 100755 fil.d.tsI.'X̨AU<100755 fil.jsD$ӷߚ؇H9100755 fil.js.map>s!˘100755 fo-DK.d.tsWuL7c<"i3100755 fo-DK.js/WJUe:W100755 fo-DK.js.map ) O5Śzyg100755 fo.d.tsWuL7c<"i3100755 fo.js\8Kawin100755 fo.js.maplf$1T*k100755 fr-BE.d.ts@bo/Dg8j100755 fr-BE.jsv*#+Stf Q0g83100755 fr-BE.js.map-عU100755 fr-BF.d.ts@bo/Dg8j100755 fr-BF.jsm=#m`P'g}*{`pg100755 fr-BF.js.mapE\]ewSOyw100755 fr-BI.d.ts>/)Jef^100755 fr-BI.jsx6JώDB100755 fr-BI.js.map=5 l H}7x100755 fr-BJ.d.ts@bo/Dg8j100755 fr-BJ.js%u DkZap100755 fr-BJ.js.map?#(+np}U100755 fr-BL.d.ts@bo/Dg8j100755 fr-BL.js6d_F߁"zj:100755 fr-BL.js.mapWI;Mn>@100755 fr-CA.d.ts`%w%h %J^MEro100755 fr-CA.jsW݊~jߦ_ Eh100755 fr-CA.js.mapeUPjI100755 fr-CD.d.ts=)jD&M|0100755 fr-CD.jsB鋕ve100755 fr-CD.js.map@p3uÀ㍎Z|100755 fr-CF.d.ts@bo/Dg8j100755 fr-CF.js'IEQny"رܺ100755 fr-CF.js.map؁|΁rd-100755 fr-CG.d.ts@bo/Dg8j100755 fr-CG.jsSU[{ P?mr100755 fr-CG.js.mapШz#ډWGQ100755 fr-CH.d.ts@bo/Dg8j100755 fr-CH.js/p|_KB:0"\D100755 fr-CH.js.mapcc6dSgmt;b100755 fr-CI.d.ts@bo/Dg8j100755 fr-CI.js '1100755 fr-DJ.js.map>ŧIrO|w;Y100755 fr-DZ.d.tsQY Vm65N100755 fr-DZ.jsOQFIf^g4n-#hB^100755 fr-DZ.js.mapLx!} \p100755 fr-GA.d.ts@bo/Dg8j100755 fr-GA.jsr ?]! })100755 fr-GA.js.map} ev=U̓ ϋ100755 fr-GF.d.ts@bo/Dg8j100755 fr-GF.jsNj{#P-$\*k7-r100755 fr-GF.js.map5&OBSs m100755 fr-GN.d.ts `\kbDKuzpT100755 fr-GN.jsnӞ)?ڢ+݆Z100755 fr-GN.js.mapLb86n%Ӆ M100755 fr-GP.d.ts@bo/Dg8j100755 fr-GP.js͜w QU.P100755 fr-GP.js.map0@3֥Č100755 fr-GQ.d.ts@bo/Dg8j100755 fr-GQ.js~ /OWX100755 fr-GQ.js.map)L="FJfW100755 fr-HT.d.tspعFqt`100755 fr-HT.js2k3ZydR$100755 fr-HT.js.mapfҧ.'8Q\ST100755 fr-KM.d.tsp(.ѻ,)l100755 fr-KM.jsovE_P'$!100755 fr-KM.js.map~1CIM&]UAі100755 fr-LU.d.tsbe"Aa6H-100755 fr-LU.jsϷ&b#p}$H|^100755 fr-LU.js.maphcyRrE^ّ=p100755 fr-MA.d.ts@bo/Dg8j100755 fr-MA.js#d*ƉvaOmN]]-9t100755 fr-MA.js.map [u߹s/s100755 fr-MC.d.ts@bo/Dg8j100755 fr-MC.jsf F" ;CuOse100755 fr-MC.js.mapU7i7(b] 2ò˘xx100755 fr-MF.d.ts@bo/Dg8j100755 fr-MF.js-s-?ko"nG100755 fr-MF.js.map)a!o=ei3100755 fr-MG.d.tsQAzCkrXwF͙100755 fr-MG.jshb1:[<)~100755 fr-MG.js.mapv|dcWvuw100755 fr-ML.d.ts@bo/Dg8j100755 fr-ML.js!Ӧ1b8r~100755 fr-ML.js.map1Ή*ù:5&F100755 fr-MQ.d.ts@bo/Dg8j100755 fr-MQ.js]S | &100755 fr-MQ.js.map*)Mu3?100755 fr-MR.d.ts+wFZɉG100755 fr-MR.js.1Y4y4Ǡ0~100755 fr-MR.js.mapDV<lblF100755 fr-MU.d.ts/m\1M;HN~l100755 fr-MU.jsWkPn9\̫'S100755 fr-MU.js.mapB=!:2j]100755 fr-NC.d.ts@bo/Dg8j100755 fr-NC.js(Å#d!zE 100755 fr-NC.js.mapxXd[RGrז"`>qO100755 fr-NE.d.ts@bo/Dg8j100755 fr-NE.jsgW Zuzyh9L100755 fr-NE.js.mapbd[EH100755 fr-PF.d.ts@bo/Dg8j100755 fr-PF.jsGI;?O_2 1ج100755 fr-PF.js.mapl.did;AٱAs/100755 fr-PM.d.ts@bo/Dg8j100755 fr-PM.jsl-oOZ A, 1n100755 fr-PM.js.map[ PH 5Y100755 fr-RE.d.ts@bo/Dg8j100755 fr-RE.js\TtG#We|o{<100755 fr-RE.js.maphJ$cJ;l100755 fr-SY.jsϹS%^.G $vN100755 fr-SY.js.map gSeŷBY̟6j+100755 fr-TD.d.ts@bo/Dg8j100755 fr-TD.jsN4O׌T$gB &100755 fr-TD.js.mapkYQ5i[?,\b >100755 fr-TG.d.ts@bo/Dg8j100755 fr-TG.jsE שV U5100755 fr-TG.js.mapGHDϢJ1/100755 fr-TN.d.tsxY?|iď,100755 fr-TN.jsVjcZ-H?6p&H100755 fr-TN.js.mapŔ d3;"mZTP100755 fr-VU.d.ts›B7% @g`100755 fr-VU.js(%-ߋ\`L Y>100755 fr-VU.js.mapA@w3ˆΤ+ח100755 fr-WF.d.ts@bo/Dg8j100755 fr-WF.jsWu)j1100755 fr-WF.js.mapNSN~A5km100755 fr-YT.d.ts@bo/Dg8j100755 fr-YT.js@!qH>$T@100755 fr-YT.js.map"r]u^.zV*HN!100755 fr.d.ts@bo/Dg8j100755 fr.js&XɃ?DLeT100755 fr.js.map'j}ۜ;ު100755 fur.d.tsmj㣅Lw XN100755 fur.jshd= 7e$p[`100755 fur.js.mapEB1f鵮m˶1100755 fy.d.tsJQOq[u100755 ig.js.map?Uf&Xz)Fr100755 ii.d.tsӑ`H(gY#Ca100755 ii.js{n>Tu>[3 .100755 ii.js.mapwu?We100755 is.d.tsz]7(t/`qsRQ867100755 is.jsX3b衤Fb 100755 is.js.map턊I5!q݌& k'*100755 it-CH.d.ts]DS ш6100755 it-CH.jse3id IcUAxF100755 it-CH.js.map^cF%# {j100755 it-SM.d.ts]DS ш6100755 it-SM.jsȚo1.>𤓨100755 it-SM.js.map ֩Ԥ>JVBc100755 it-VA.d.ts]DS ш6100755 it-VA.jsz+,\\IfE[6100755 it-VA.js.mapn'!ٸ7=100755 it.d.ts]DS ш6100755 it.jsj?=~36{J100755 it.js.mapRp6S @FIrX100755 ja.d.ts,u ]8~ĮpB100755 ja.js̏Zf)?6VR100755 ja.js.mapa5/\̦d`b/@(C100755 jgo.d.tsmj㣅Lw XN100755 jgo.jsRp~ajLSHj[100755 jgo.js.map5CS+#D100755 jmc.js.map f^b|Iz"100755 jv.d.tsZ.A\ɵL100755 jv.jsvmF[ţͲ/-W100755 jv.js.map,9(a9(~100755 ka.d.ts'&qPbN100755 ka.js_Gdν?!+c100755 ka.js.mapKb}5VoQc100755 kab.d.tsf:>*:aJ@100755 kab.js*G"Ga100755 kab.js.map?[fm*K}Aֻ100755 kam.d.ts;Czo xCui5100755 kam.jsC זSq=Y6&100755 kam.js.mapnQtMGŕmO搏 100755 kde.d.tsp!Q{䌀-Q=100755 kde.jsoWR6@rz0100755 kde.js.mapj! folGPg100755 kea.d.tscv ^100755 kea.jsfg3 4100755 kea.js.map{1 ^!K޴100755 kgp.d.tsK 5샥+&PB100755 kgp.jsoɄ! )_␾=]100755 kgp.js.mapN`yel< x,100755 khq.d.tsmj㣅Lw XN100755 khq.jsYyI%bԣ\100755 khq.js.mapNqispϳ]om 100755 ki.d.ts;Czo xCui5100755 ki.jsjWH9{100755 ki.js.mapV:8{bpͨc100755 kk.d.ts/"jI0}8100755 kk.jssTY 5"=L100755 kk.js.map3z5R=):bZN5100755 kkj.d.tsmj㣅Lw XN100755 kkj.js][žk&N?K[I-i/100755 kkj.js.mapO?׀4e×!100755 kl.d.tsjn:ӹkCc100755 kl.js_ebG%*`>2100755 kl.js.map[6f\4100755 kln.d.ts;Czo xCui5100755 kln.jsL?G!Y 100755 kln.js.mapc[)45K100755 km.d.tsam_QꍭÏG4"100755 km.js(ď.?9 r100755 km.js.mapΕcQ UBU100755 kn.d.tsl\z{~i:&100755 kn.jsڄC>*"BGUÃ100755 kn.js.mapưcɌ{I nKǡ<&100755 ko-KP.d.tsF,C]߼Ӣ <4100755 ko-KP.js90 Իeҳ*100755 ko-KP.js.mapk^sny^hxmG100755 ko.d.tsF,C]߼Ӣ <4100755 ko.js8/Hpgen100755 ko.js.mapb2@fdcV]ʨDp100755 kok.d.ts^J36VQQPkr,.100755 kok.js%K&;: G100755 kok.js.map`Ϫ?%~Ci100755 ks-Arab.d.ts()QٸdC;ÀH100755 ks-Arab.jsb8J2\mzr100755 ks-Arab.js.map+bѕ{n>f؍%ḍu}D100755 ks-Deva.d.ts4u17eq100755 ks-Deva.jsq@UUeFo, 100755 ks-Deva.js.mapߧآcڅ?Sp100755 ks.d.ts()QٸdC;ÀH100755 ks.jsN1fHٚevG100755 ks.js.mapuO1\P=E<肩100755 ksb.d.tsp!Q{䌀-Q=100755 ksb.jsonZlWr100755 ksb.js.map0bbbj4]~x8100755 ksf.d.tsmj㣅Lw XN100755 ksf.jsiXEyݾ&^100755 ksf.js.mapi.~v(43sb {100755 ksh.d.tsmj㣅Lw XN100755 ksh.jsVha-{B rA^l100755 ksh.js.mapu9~x=HW;100755 kw.js.mapI],BGt>f100755 ky.d.tsU;A8o6 %:Ý100755 ky.js(ܝ4{:/4W\100755 ky.js.map*K|V1o44# r100755 lag.d.tsp!Q{䌀-Q=100755 lag.js߮̅*[dvCB7100755 lag.js.mapj,@ Tt㵳7ⷦ100755 lb.d.tspmͫUze100755 lb.js]+? -A8X100755 lb.js.map }KJmӱ4100755 lg.d.tszhHy)ZU֌o100755 lg.js6ْ9SP4F1F100755 lg.js.map6Xn\4"Y100755 lkt.d.ts4u17eq100755 lkt.jsk+]_#L@100755 lkt.js.map}__dFHg]100755 ln-AO.d.ts~;G6++:100755 ln-AO.jsdXUu\O7pzs0100755 ln-AO.js.map TQ=VH100755 ln-CF.d.tsçrSZx9Y?.rm100755 ln-CF.js5wp[Eܕn100755 ln-CF.js.mapL}^) ^Dry100755 ln-CG.d.tsçrSZx9Y?.rm100755 ln-CG.js7[ZWK_zҼ100755 ln-CG.js.map~ξ1v+100755 ln.d.tsçrSZx9Y?.rm100755 ln.jsV-~\+c Q?cW100755 ln.js.mapf-8 7m/v*_eG100755 lo.d.tsj0ULu|C100755 lo.jsCal5׿K58100755 lo.js.map{"bI`(qw(100755 lrc-IQ.d.ts[t\hhpN'100755 lrc-IQ.jsES˜QrECLxN100755 lrc-IQ.js.map_.(/(x4100755 lrc.d.ts[t\hhpN'100755 lrc.jsț{g7v&MSu)100755 lrc.js.map,k1蔷H100755 lt.d.tseX_˪Hr|rY;100755 lt.js\Q|؊bNX100755 lt.js.mapw+8a ‡+100755 lu.d.tsçrSZx9Y?.rm100755 lu.js("]g"Sp#100755 lu.js.mapDEC-0PU{;100755 luo.js.map;`9=N[.JQ100755 luy.d.ts;Czo xCui5100755 luy.js ,*zy100755 luy.js.mapxCR' Z_b100755 lv.d.ts3ިή݀<100755 lv.jsPaOxB^pWu2M 100755 lv.js.mapb!cL~j]9Mv100755 mai.d.ts4u17eq100755 mai.jsX/igtW!knU;100755 mai.js.mapŨ#vnS YH@100755 mas-TZ.d.ts-և)p[҂çd100755 mas-TZ.js~?8Z*eDE'ߞO_Z100755 mas-TZ.js.mapѫ&@^&WW0}@{100755 mas.d.ts;Czo xCui5100755 mas.jsWŜhjZ֯d_:100755 mas.js.maphӲYdڅב@+'t+100755 mer.d.ts;Czo xCui5100755 mer.js: .OfE"LÊo100755 mer.js.mapGqnEOu/h'=100755 mfe.d.tsQhF O!Rh100755 mfe.js!OG*ޥ100755 mfe.js.mapΩN /U[NZpr"Z100755 mg.d.ts^@2!r< 100755 mg.jsՀ肂AKo`l!iIn100755 mg.js.map^^U08]-V2"?100755 mgh.d.tsL B&FlDj>WI 100755 mgo.d.tsmj㣅Lw XN100755 mgo.js(!;G?7$W100755 mgo.js.map؟e:)jma\%100755 mi.d.tsP(z؍C$T y/g100755 mi.js" KѣM< 8k=100755 mi.js.mapNK܀N?VH100755 mk.d.ts3vMa'>Sy100755 mk.js;Q}³7.gKm100755 mk.js.map}soSn{g100755 ml.d.ts5JQ(vTGآIw100755 ml.jsW3/r䍒O 2100755 ml.js.mapT"0ÊzIT100755 mn.d.ts"l|D8ӱ100755 mn.jsŰM@;Hb100755 mn.js.mape3 uP$TO100755 mni-Beng.d.ts&n*賔8K5kš9100755 mni-Beng.jsN>#xLɸVn%n100755 mni-Beng.js.map. {iO-0UMv100755 mni.d.ts&n*賔8K5kš9100755 mni.jsJc`SSO:śV|=100755 mni.js.map%Y?? ֺ100755 mr.d.tsa8O36e\Ĭ100755 mr.js4P5 Jhkedi100755 mr.js.mapUJ#(Ę`V2100755 ms-BN.d.tsyܓ~ )-pÛe100755 ms-BN.jsדʛʙiR9uk;I#M100755 ms-BN.js.map['R%iŇK\)100755 ms-ID.d.ts0"k9ep100755 ms-ID.jsۋ;2cFR6100755 ms-ID.js.mapN\ILvr=Ď100755 ms-SG.d.ts#NаNe;4׈100755 ms-SG.jsY,.'Wliؔ}100755 ms-SG.js.mapAٙ|Om8100755 ms.d.ts| 'T̉+eF100755 ms.js=?CQwĝP@W100755 ms.js.map*p̺А5˧'V&L100755 mt.d.ts^~V5&9xt@PD 100755 mt.jsM53a1qƐ<100755 mt.js.map#p.L@/ܥb100755 mua.d.tsmj㣅Lw XN100755 mua.jsњpm&**!100755 mua.js.mapg*RXH=_~AFDR+(B100755 my.d.ts@*%!_ p(FI100755 my.js[_Ф|Z=L+@100755 my.js.mapEc7x<y1f+E&100755 mzn.d.tsYyC3a0M/100755 mzn.js3Z%0^?X2œx*<100755 mzn.js.maptUHYta%wJf100755 naq.d.tslL']5w^ 8?P/100755 naq.js<]'r.O7٘100755 naq.js.map˅!JHZy"Jk100755 nb-SJ.d.tsj ޲KS\Eܶ100755 nb-SJ.js嚬I^n4y100755 nb-SJ.js.map_cL[8X0sSyP100755 nb.d.tsj ޲KS\Eܶ100755 nb.jscV).Dv;ޔH100755 nb.js.mapIJi  IR &&"100755 nd.d.tsmj㣅Lw XN100755 nd.js`<#T1鹖100755 nd.js.map;aAgPvQ100755 nds-NL.d.tsmj㣅Lw XN100755 nds-NL.jsL@ 2AHr$0100755 nds-NL.js.mapUkYc3XRuyeH100755 nds.d.tsmj㣅Lw XN100755 nds.js7^ Udh T9100755 nds.js.map\;F ؠ\y1100755 ne-IN.d.tso((,1N ϛG100755 ne-IN.jsug |`zL M100755 ne-IN.js.map~&H1\jvT#h[f100755 ne.d.tso((,1N ϛG100755 ne.jsl=W$Jc100755 ne.js.mapWiS xk8d#100755 nl-AW.d.ts\.Ht100755 nl-BE.d.tsP&<{0CY"ol>100755 nl-BE.jsع% D\27w100755 nl-BE.js.mapūr%iMq/P0100755 nl-BQ.d.tsܦF ^Ǭ100755 nl-BQ.js_zW^EWAB2100755 nl-BQ.js.mappqIc E;100755 nl-SR.jsɸv)G)yㄖ-100755 nl-SR.js.mapHr)vǿDԆ100755 nl-SX.d.tszʕEol100755 nl-SX.js.iA >+Z100755 nl-SX.js.map]uh mP_X!3100755 nl.d.tsP&<{0CY"ol>100755 nl.jsbLrvl= qcθ:Bg100755 nl.js.map=8<4@J`100755 nmg.d.tsmj㣅Lw XN100755 nmg.js9ڇJ8xo.100755 nmg.js.maphXؙdjq100755 nn.d.ts8sUZԿ100755 nn.jslMy~zT":9u100755 nn.js.map;N8+2Q[100755 nnh.d.tsmj㣅Lw XN100755 nnh.js)Oc&cl9100755 nnh.js.mapFF)'_,1100755 no.d.tsj ޲KS\Eܶ100755 no.js>ajH13N#100755 no.js.mapVSBx@ϵ e100755 nus.d.tsF6̈́SԽӁ100755 nus.jslbu b3^uY/j !100755 nus.js.mapϺh9#.0F]g100755 nyn.d.tszhHy)ZU֌o100755 nyn.js4}Ll(w%uD100755 nyn.js.mapoeXPB(HHW100755 om-KE.js.mapaA2&{x5100755 om.d.tst>.ley100755 om.js*_A^7N:100755 om.js.mapEsrR 9nch100755 or.d.ts:hD4 g"l/a"R100755 or.js%ٲV)8-]xM100755 or.js.mapl [-Oi 恗0100755 os-RU.d.tsh2ಏތt_)100755 os-RU.js&tN%Lɮ100755 os-RU.js.map^xȮ}׭ c100755 os.d.tsJV{~~We100755 os.jsoZC&_*100755 os.js.mapf5۾_100755 pa-Arab.d.ts碫B.8JכHL100755 pa-Arab.js<Fgy7 _100755 pa-Arab.js.map75<י&vhLE100755 pa-Guru.d.tsJ<9.:94hbrJ100755 pa-Guru.jsX$Nꆼ2Pƙp7100755 pa-Guru.js.map0w9JBw`100755 pa.d.tsJ<9.:94hbrJ100755 pa.js3b Ayw-ߒt100755 pa.js.mapǕ#-ؐrVI"6100755 pcm.d.tsm80t^E?Mx100755 pcm.js1>Hy~wp100755 pcm.js.mapXZx 8W׺100755 pl.d.tsB]qQ( qt˕I7ӎ100755 pl.js@pڈQ-swR7q100755 pl.js.mapʑa8ŠBvA}S100755 ps-PK.d.tsK!fsm89kX߶KO100755 ps-PK.jshőeRPoq B100755 ps-PK.js.mapOA W/:100755 ps.d.ts~QѵPhvn100755 ps.js nݶ$j{100755 ps.js.mapk\O XF9N100755 pt-AO.d.tsx qMS|F:ho100755 pt-AO.js"ǹolJ#fcZR100755 pt-AO.js.map²V3Ѡ%100755 pt-CH.d.ts2/hEUS7`)y100755 pt-CH.jsoWШй!3A100755 pt-CH.js.mapQA΀it¿7!{.0100755 pt-CV.d.tsTk·:100755 pt-CV.jsHm!%0^TIgߊ100755 pt-CV.js.map2%XF" п%z:100755 pt-GQ.d.ts2/hEUS7`)y100755 pt-GQ.js*!soޭt]WaU100755 pt-GQ.js.mapi"UHPg@#^100755 pt-GW.d.ts2/hEUS7`)y100755 pt-GW.jsZPTmQ7100755 pt-GW.js.map ;cU 0%100755 pt-LU.d.tsv4z`I100755 pt-LU.jsT$h Qv100755 pt-LU.js.mapؙrjxϳ V>1A100755 pt-MO.d.tst99O100755 pt-MO.jsпduUT|nd"100755 pt-MO.js.mapUJ%:L[J100755 pt-MZ.d.ts$=YE~0ja3100755 pt-MZ.jsGOMrHp2G100755 pt-MZ.js.mapk6fA&؁/P>c2100755 pt-PT.d.ts2/hEUS7`)y100755 pt-PT.jsb.(PV%qݙ}Pz]k100755 pt-PT.js.mapwXx ^eRϣAgG100755 pt-ST.d.tsOOOFG O100755 pt-ST.jsExiXv@100755 pt-ST.js.map0EHwॣ=x100755 pt-TL.d.ts2/hEUS7`)y100755 pt-TL.jseIطD}̋𘦓 pt-TL.js.map_*”F:$lm100755 pt.d.tsC\S?o!Lw[100755 pt.jsla9mEңu=1 100755 pt.js.map6Ns~)Q=C100755 qu-BO.d.tsN3LL:}+1U100755 qu-BO.js)ET71QAY 100755 qu-BO.js.map`/#{%P0100755 qu-EC.d.tsј*JpQP{\WL100755 qu-EC.jsӘIB14100755 qu-EC.js.map̖%8#100755 qu.d.tsX&giQxԆ100755 qu.jsrZO{i޼M]7100755 qu.js.mapU+a100755 rn.js.maphӻ="`Yl100755 ro-MD.d.tsINq{100755 ro-MD.js.mapƒTD;\-6100755 ro.d.ts0^݋rӯosO:100755 ro.jsEn#HvT9100755 ro.js.mapU*NmaW>XX100755 rof.d.tsp!Q{䌀-Q=100755 rof.js "_Bv/F%3100755 rof.js.mapkGECR@&100755 ru-BY.d.ts/^L$R@B 100755 ru-BY.js i6R2\ S8100755 ru-BY.js.mapXf11:4Z#g9ܑ100755 ru-KG.d.ts z.CHe"H!Rt5100755 ru-KG.js /3)_O%il ֹ_100755 ru-KG.js.map)+d0YzSW,I9X100755 ru-KZ.d.tsc|EnN,g100755 ru-KZ.js9sTuK~88100755 ru-KZ.js.map) ̸ c{w V S100755 ru-MD.d.tsdJ,,^Kn+d100755 ru-MD.js^voGT"򄬫;B100755 ru-MD.js.map'BH,66 3100755 ru-UA.d.tsD1A g7q)100755 sc.js.map p5Ja5[100755 sd-Arab.d.tsv XLPrQ100755 so-ET.d.ts?*N},sm%a6q~100755 so-ET.js\Tpx<`+100755 so-ET.js.mapP_yIԦϙV|A100755 so-KE.d.ts+e|/8\xStt100755 so-KE.jsWZ:^\Rq1M100755 so-KE.js.map%5x )mDǠ1100755 so.d.tsNN5e3Ò c100755 so.jsïx$6ΰHiu100755 so.js.map Os?y< P𿽋100755 sq-MK.d.ts*ˎ;!36 Lj100755 sq-MK.js,ZK׏ ďAJ=100755 sq-MK.js.mapz&g7.E]100755 sq-XK.d.tsk$RaY!|K100755 sq-XK.js BP.E;k*100755 sq-XK.js.map.Ȑ>˙BEqߐ  100755 sq.d.tsk$RaY!|K100755 sq.jsܵb:7!B(>j100755 sq.js.map޻(+aQ ؒIػ100755 sr-Cyrl-BA.d.tsMR0"(2100755 sr-Cyrl-BA.js4Xx CDSCB 100755 sr-Cyrl-BA.js.map8+}ǫ[;B100755 sr-Cyrl-ME.d.tsMR0"(2100755 sr-Cyrl-ME.js5;T"257 100755 sr-Latn-XK.d.tsMR0"(2100755 sr-Latn-XK.js!zEY9iv>100755 sr-Latn-XK.js.maps]Y/f\Ϟv100755 sr-Latn.d.tsMR0"(2100755 sr-Latn.jsh{jBuW:x*100755 sr-Latn.js.map̀j}蕣BmM100755 sr.d.tsMR0"(2100755 sr.jsԊT C`82AVB100755 sr.js.mapK46J3WTܨ-t100755 su-Latn.d.ts[֢.!pۿr_EK100755 su-Latn.js1!"100755 su-Latn.js.mape`jxMşyM'T100755 su.d.ts[֢.!pۿr_EK100755 su.js;0vPDVId100755 su.js.mapgb 3 =o#o100755 sv-AX.d.ts3a}cփjHD;s100755 sv-AX.jsU)R",ɬS$/100755 sv-AX.js.map7Uhn/l100755 sv-FI.d.ts3a}cփjHD;s100755 sv-FI.jsOb1/82,/B100755 sv-FI.js.map[)󃓂( ] |ɭn100755 sv.d.ts3a}cփjHD;s100755 sv.jsT5ķCgruIr100755 sv.js.mapgkue~ :100755 sw-CD.d.ts9m~%&`5n~"100755 sw-CD.jsTkx҅e)>|.Z100755 sw-CD.js.mapmFj~&}3h.%n100755 sw-KE.d.tsTeb/C$u100755 sw-KE.jsqo?.H&4Wqʂ100755 sw-KE.js.mapSIzh8%'o100755 sw-UG.d.tsLLVn?h!#100755 teo-KE.d.ts":8} c2z100755 teo-KE.jsurJzHm?~Iΰ7=1W100755 teo-KE.js.mapobk 8>N|g100755 teo.d.tszhHy)ZU֌o100755 teo.js=Ek7}/o2tX .*100755 teo.js.mapSAt^m%100755 tg.d.tsR,4s+Ry100755 tg.jsa5[AT 6s100755 tg.js.map7Qd4'Qj0{100755 th.d.tsCb-|i.ڽѵz100755 th.js-—r(jV1100755 th.js.mapɬz~Wsbn100755 ti-ER.d.tsp|>NYY B-\\W100755 ti-ER.jsq@;LOwآ 05>100755 ti-ER.js.mapق6rS6vVzWSp100755 ti.d.tsV^^Թ#eSX100755 ti.jsmuwR1T/P{>100755 ti.js.map _s{E!)P,zK100755 tk.d.tsU$o^>߂ fDI 100755 tk.js]T^O%*]rqe100755 tk.js.map+P8rk:G100755 to.d.tsz 'W[FMH5`100755 to.js9d' Ѿ100755 to.js.mapcIDf/1EOdb100755 tr-CY.d.ts @ zIٳ9ۄ100755 tr-CY.jso/|w$X2 +ܰb100755 tr-CY.js.mapC)5#e?rr.100755 tr.d.ts @ zIٳ9ۄ100755 tr.js>cU"1jWF100755 tr.js.map.`>b< 100755 tt.d.tsY(V3zu=1@100755 tt.js;Xk&ٴ100755 tt.js.mapމ}ƩAk*6i100755 twq.d.tsmj㣅Lw XN100755 twq.jsTBdعᎥaq100755 twq.js.map) Q‘sp yb9100755 tzm.d.tsmj㣅Lw XN100755 tzm.jsi:+weRQXM100755 tzm.js.mapaׅ)>3|T98 100755 ug.d.ts[tMTt^;v4100755 ug.js-Px& Z/>100755 ug.js.mapǠht,Er'100755 uk.d.tsqpR0@3100755 uk.jswU[ .W|5100755 uk.js.map{(Z:qySipA100755 und.d.ts()QٸdC;ÀH100755 und.jsuO:g\u6yN100755 und.js.map(#7o='9LO100755 ur-IN.d.tsXY`Xݡ` 100755 ur-IN.jsع++-HHCQ]4100755 ur-IN.js.mapi !.k>Dvw100755 ur.d.tsBVL~K:sxPD100755 ur.js;**o!V9 h100755 ur.js.map>ת&/-100755 uz-Arab.d.tserоY;bw!K100755 uz-Arab.jsϥClGߡ100755 uz-Arab.js.map< 3yk꺴+100755 uz-Cyrl.d.tsdž3gB_ThʫK100755 uz-Cyrl.jsfbP-|Ѡ100755 uz-Cyrl.js.mapt<-dCt g100755 uz-Latn.d.tsSsY soiHt$100755 uz-Latn.js4ߕQF{100755 uz-Latn.js.mapTym؁;ނ6*100755 uz.d.tsSsY soiHt$100755 uz.jsx{nGjz1&b100755 uz.js.map|$U{)&B0qm100755 vai-Latn.d.ts.;dUI[i.jBZaԅ!100755 vai-Vaii.d.ts.;dUI[i.j9J=*$100755 xh.js4.2rd? ƅ100755 xh.js.map|q.{24:100755 xog.d.tszhHy)ZU֌o100755 xog.jsa+ \ gإ100755 xog.js.mapи\Ϫ]!l9wNQ100755 yav.d.tsmj㣅Lw XN100755 yav.jsni |)nsRZ?100755 yav.js.mapv:M~qN5`$100755 yi.d.tsmj㣅Lw XN100755 yi.jsTu׋ (100755 yi.js.map ̔R='W;@100755 yo-BJ.d.ts WQ100755 yo-BJ.jsla*`Rx=)100755 yo-BJ.js.mapIFB6ɡ M100755 yo.d.ts WQ100755 yo.jsNSc<Gj6#100755 yo.js.map4emnʹ2\p. ms100755 yrl-CO.d.tsd!fyw $100755 yrl-CO.js&6 ӽyr{'GS!100755 yrl-CO.js.map׶6L xmݶ(-100755 yrl-VE.d.tsd!fyw $100755 yrl-VE.js5T`m=m`wiB100755 yrl-VE.js.mapU%e?o!cg@eV`md100755 yrl.d.tsd!fyw $100755 yrl.jsm MPձ>S*G"_100755 yrl.js.mapR>EMa19r$_100755 yue-Hans.d.tsL_XU.oT2S100755 yue-Hans.js:jj4{w.:xrz100755 yue-Hans.js.map6CSaI4100755 yue-Hant.d.tsݝ4NJE?h.@}100755 yue-Hant.jsёW5TEne100755 yue-Hant.js.mapJ1w3@JB$@VI100755 yue.d.tsݝ4NJE?h.@}100755 yue.jss\ QS?100755 yue.js.mapKu\Х%ՈçjK100755 zgh.d.tsmj㣅Lw XN100755 zgh.jsHV6>>+ 100755 zgh.js.mapQ,^BF_fT&O100755 zh-Hans-HK.d.tsKq)!UO«-O100755 zh-Hans-HK.jspXܺBA100755 zh-Hans-HK.js.mapWҖmDD<ıΘ+3100755 zh-Hans-MO.d.ts)ͻI"-zv?WD100755 zh-Hans-MO.js2K2cUa Vk100755 zh-Hans-MO.js.mape s;%100755 zh-Hans-SG.d.tsmUG!`& 100755 zh-Hans-SG.jsm%gGT1100755 zh-Hans-SG.js.mapnAُV!䐷<'\vR100755 zh-Hans.d.ts]V;NF<aQ&100755 zh-Hans.jsZjNh*t١G:100755 zh-Hans.js.map"In,)H100755 zh-Hant-HK.d.ts~ ()꿃\,ؖ w100755 zh-Hant-HK.jskexLNHJ˞lq100755 zh-Hant-HK.js.map"a`ο4IjzB>!100755 zh-Hant-MO.d.ts)zP^RyG粽+UE100755 zh-Hant-MO.js{RtwB{=>(100755 zh-Hant-MO.js.mapH2W n{T &100755 zh-Hant.d.tsH 6xN:Ot_7100755 zh-Hant.js9gy"+!

==^%P100755 zu.js.map[Vp=KZAaxV100755 af-NA.d.tsDmrΨFFDҰb f100755 af-NA.js|$4=)100755 af-NA.js.mapUX }}h100755 af.d.tsDmrΨFFDҰb f100755 af.jsnϦڄQn100755 af.js.maphk8Z:Y100755 agq.d.ts2p-+U#\3jȧt{U100755 agq.js:Zl |9Z"100755 agq.js.mapUxAJ7*o7ڮiƣ100755 ak.d.ts2p-+U#\3jȧt{U100755 ak.js1O8qRL/6.JB!100755 ak.js.map|N#U,y꿘.^100755 am.d.tsDmrΨFFDҰb f100755 am.js}uW\ g]^100755 am.js.mapC6+g.&A100755 ar-AE.d.ts|ώ -":k100755 ar-AE.jsvU8l&s100755 ar-AE.js.mapgA e(vӇ:j100755 ar-BH.d.ts|ώ -":k100755 ar-BH.jsYlj'&)7,J&100755 ar-BH.js.mapQ޽tV&Y2oZ 100755 ar-DJ.d.ts|ώ -":k100755 ar-DJ.js/LR]Odw100755 ar-DJ.js.map!-iVp\>h46t100755 ar-DZ.d.ts|ώ -":k100755 ar-DZ.jsʯ4^=edD7 100755 ar-DZ.js.mapf̕"/1tnp3xE(:100755 ar-ER.js.map5N\-|0Z%(d+ )100755 ar-IL.d.ts|ώ -":k100755 ar-IL.jsHfmJ) HG?100755 ar-IL.js.map2tԓ2_ T7a100755 ar-IQ.d.ts|ώ -":k100755 ar-IQ.js|86݂$m#100755 ar-IQ.js.mapJ`t~D @ 'DU100755 ar-JO.d.ts|ώ -":k100755 ar-JO.jsY+lQ16`cQh100755 ar-JO.js.map+.ŲEܓC100755 ar-KM.d.ts|ώ -":k100755 ar-KM.js~FS\wlI100755 ar-KM.js.mapG SQȶEF*@,100755 ar-KW.d.ts|ώ -":k100755 ar-KW.jsM*LHExz15 >100755 ar-KW.js.mapH`q֋do{Аw100755 ar-LB.d.ts|ώ -":k100755 ar-LB.jsX].7znX100755 ar-LB.js.map.D<ۺd;M100755 ar-LY.d.ts|ώ -":k100755 ar-LY.js8buq;L100755 ar-LY.js.map)onJfkU100755 ar-MA.d.ts|ώ -":k100755 ar-MA.js#InЕR1mR100755 ar-MA.js.map8 pR'fS100755 ar-MR.d.ts|ώ -":k100755 ar-MR.js0Y~O;>100755 ar-MR.js.map3E8F)v PRCv100755 ar-OM.d.ts|ώ -":k100755 ar-OM.js=r0Bd,100755 ar-OM.js.map'a%-R*y;O{100755 ar-PS.d.ts|ώ -":k100755 ar-PS.js2tT ̱~ʳ?100755 ar-PS.js.map(3l*c:' m100755 ar-QA.d.ts|ώ -":k100755 ar-QA.js`3]<>tE 5100755 ar-QA.js.map|NӸcS100755 ar-SA.d.ts|ώ -":k100755 ar-SA.jsA$YΖbN~>V/100755 ar-SA.js.map7c,s|+s100755 ar-SD.d.ts|ώ -":k100755 ar-SD.jsssO}HQ100755 ar-SD.js.map (pwaմBm100755 ar-SO.d.ts|ώ -":k100755 ar-SO.jsbXfBE2d{)100755 ar-SO.js.mapfK|).9@^100755 ar-SS.d.ts|ώ -":k100755 ar-SS.jsl;T%ӑy߈;t=}N;100755 ar-SS.js.map(xX-H 6m100755 ar-SY.d.ts|ώ -":k100755 ar-SY.js qRb+z}~efI!b100755 ar-SY.js.mapS;H9Y 100755 ar-YE.d.ts|ώ -":k100755 ar-YE.jsM,$OmHUL100755 ar-YE.js.map͑3 .BYVS100755 ar.d.ts|ώ -":k100755 ar.js0Y kx-_4100755 ar.js.mapS?,Mu^qq100755 as.d.ts2p-+U#\3jȧt{U100755 as.js{#<pkj[MC100755 as.js.mapc) m 100755 asa.d.ts2p-+U#\3jȧt{U100755 asa.jsަ!/.zuD100755 asa.js.mapBOwYH.( 100755 ast.d.ts2p-+U#\3jȧt{U100755 ast.jsQU|) ρ悲100755 ast.js.map^+y vBeMGM100755 az-Cyrl.d.tsDmrΨFFDҰb f100755 az-Cyrl.js9Sbp">6@X@:100755 az-Cyrl.js.mapH^QE~100755 az-Latn.d.tsDmrΨFFDҰb f100755 az-Latn.jsԁ2(?^<100755 az-Latn.js.map9:%`$迄100755 az.d.tsDmrΨFFDҰb f100755 az.js #36?F?'p100755 az.js.map][K2OD>oZ100755 bas.d.ts2p-+U#\3jȧt{U100755 bas.js{⊞[jes 1100755 bas.js.mapni̇gbP31b":7100755 be-tarask.d.ts2p-+U#\3jȧt{U100755 be-tarask.js;u7[6l%<100755 be-tarask.js.mapD(ӎfWW100755 be.d.ts2p-+U#\3jȧt{U100755 be.js#?ɍ`4N'Y[v100755 be.js.mapN[100755 bg.jsi^ zrޠ100755 bg.js.map :'ZLVF[h|G100755 bm.d.ts2p-+U#\3jȧt{U100755 bm.jsՙ;= GQ8'100755 bm.js.mapNur5a=Ҧ:_100755 bn-IN.d.ts݃?fx^]]`yDe100755 bn-IN.jsU9Q=4uE+x100755 bn-IN.js.map)Qpßc3%5100755 bn.d.ts݃?fx^]]`yDe100755 bn.js,"!;E|Y100755 bn.js.map_ p-CJR7100755 bo-IN.d.ts2p-+U#\3jȧt{U100755 bo-IN.js= XT]륡QU100755 bo-IN.js.mapvf2m Y#|cNL100755 bo.d.ts2p-+U#\3jȧt{U100755 bo.jse.4A3!100755 bo.js.mapN[100755 bs-Latn.js& ՓUGv6,u!100755 bs-Latn.js.map$.0`!r100755 bs.d.ts~s'd`>N[100755 bs.js#`@0 [9T̯NT100755 bs.js.mapi=&N!k100755 ca-AD.d.tsDmrΨFFDҰb f100755 ca-AD.jsG1"q и/100755 ca-AD.js.mapn偠W"ȞJr$DPf100755 ca-ES-valencia.d.tsDmrΨFFDҰb f100755 ca-ES-valencia.js W-pK"L]100755 ca-ES-valencia.js.map(:2ݬN])I100755 ca-FR.d.tsDmrΨFFDҰb f100755 ca-FR.jsfXxM!!0100755 ca-FR.js.map7a35O+f100755 ca-IT.d.tsDmrΨFFDҰb f100755 ca-IT.jsFb4ϠRV1Gz100755 ca-IT.js.mapσ703)חTgQ100755 ca.d.tsDmrΨFFDҰb f100755 ca.js˧bR)XAoi-100755 ca.js.mapRxCO->[ 100755 ccp-IN.d.tsm"ZB8/XZ9100755 ccp-IN.js\G$7]eVRI100755 ccp-IN.js.mapDȁ"x%FLv100755 ccp.d.tsm"ZB8/XZ9100755 ccp.jseDJVG100755 ccp.js.mapS5!A٥i=bpAC100755 ce.d.ts2p-+U#\3jȧt{U100755 ce.jsVk-tĢBf&sN100755 ce.js.mapR1]杏c100755 ceb.d.ts2p-+U#\3jȧt{U100755 ceb.jsd@uk <100755 ceb.js.map/_,_- A100755 cgg.d.ts2p-+U#\3jȧt{U100755 cgg.jsɗ9PPKJs)MpA100755 cgg.js.mapL̼vfhtkbKp}L100755 chr.d.tsDmrΨFFDҰb f100755 chr.jsu^3AG gP 100755 chr.js.mapa9$O',XRFu;{100755 ckb-IR.d.ts2p-+U#\3jȧt{U100755 ckb-IR.jsVV %|?-: 100755 ckb-IR.js.mapqt!̠FZLѪ100755 ckb.d.ts2p-+U#\3jȧt{U100755 ckb.js:"%j{N5>lE}(yb100755 cs.js.mappW$ku r~mOW100755 cy.d.tsDmrΨFFDҰb f100755 cy.jsWj޲0i2dt~5\100755 cy.js.mappb^$3u/$100755 da-GL.d.tsDmrΨFFDҰb f100755 da-GL.js fHlj-2:%%E@100755 da-GL.js.map̥;BVZ8.V100755 da.d.tsDmrΨFFDҰb f100755 da.jsJ?&ue )-*ٿA100755 da.js.map$.wo< t=z1 5ŝ100755 dav.d.ts2p-+U#\3jȧt{U100755 dav.js;PnܳC:^@j)100755 dav.js.maponC1#um>% 6100755 de-AT.d.tsDmrΨFFDҰb f100755 de-AT.jsҝeʄ׾ykn100755 de-AT.js.mapɔE%JvG 6g100755 de-BE.d.tsDmrΨFFDҰb f100755 de-BE.jsÏm6&Q7ݭ{m100755 de-BE.js.map oy35)޾39100755 de-CH.d.tsDmrΨFFDҰb f100755 de-CH.jsFW) Ҙx.f100755 de-CH.js.mapޘڃ[!f <#100755 de-IT.d.tsDmrΨFFDҰb f100755 de-IT.jsūq.zd T100755 de-IT.js.map=O ZB100755 de-LI.d.tsDmrΨFFDҰb f100755 de-LI.jsB@uSL P[u 100755 de-LI.js.maph94!100755 de-LU.d.tsDmrΨFFDҰb f100755 de-LU.jsu aQS_knt100755 de-LU.js.map/Ng޸4kM100755 de.d.tsDmrΨFFDҰb f100755 de.jsxh "˖fW100755 de.js.map_&]&5Զ100755 dje.d.ts2p-+U#\3jȧt{U100755 dje.js]92 ,ʒ100755 dje.js.mapMq>v60aW100755 doi.d.ts2p-+U#\3jȧt{U100755 doi.jsqDtX ;<4hN100755 doi.js.mapl5 fY6C[wQCLް100755 dsb.d.ts2p-+U#\3jȧt{U100755 dsb.jsmc4 wdJf 100755 dsb.js.mapѽ]"$1OJCx100755 dua.d.ts2p-+U#\3jȧt{U100755 dua.jsRC,">[ V100755 dua.js.map[a^D*4e100755 dyo.d.ts2p-+U#\3jȧt{U100755 dyo.js(SI qiba100755 dyo.js.map0̟`\1.+҄Ӻb100755 dz.d.ts2p-+U#\3jȧt{U100755 dz.js64hriwiMT󯰣100755 dz.js.map T ;ű100755 ebu.d.ts2p-+U#\3jȧt{U100755 ebu.js9ʒYbX100755 ebu.js.mapv'|:.aZW##ڰ100755 ee-TG.d.tsm"ZB8/XZ9100755 ee-TG.jsPxEy[=100755 ee-TG.js.mapR\5 5|o100755 ee.d.tsm"ZB8/XZ9100755 ee.jsZwa\Ԝe4100755 ee.js.maph Qm }1X|ո100755 el-CY.d.ts݃?fx^]]`yDe100755 el-CY.jsa?W.wX4 100755 el-CY.js.mapBK~B#hszo100755 el.d.ts݃?fx^]]`yDe100755 el.jsMWqYZ}HZHF100755 el.js.map?wPWV P礃100755 en-001.d.tsDmrΨFFDҰb f100755 en-001.jsfZ*P6+r100755 en-AI.d.tsDmrΨFFDҰb f100755 en-AI.js[G>' w100755 en-AI.js.map!3#Ɇ100755 en-AS.d.tsDmrΨFFDҰb f100755 en-AS.js "^ "H/_Ȑ100755 en-AS.js.mapD}(QH]]b100755 en-AT.d.tsDmrΨFFDҰb f100755 en-AT.jsKJnߗ҆ #0100755 en-AT.js.map.3W b:M8C100755 en-AU.d.tsDmrΨFFDҰb f100755 en-AU.js`ld *hFd~u6100755 en-AU.js.mapY3*Bm.A#100755 en-BB.d.tsDmrΨFFDҰb f100755 en-BB.jsI2iدES100755 en-BB.js.mapR :[oK=clc+100755 en-BE.d.tsDmrΨFFDҰb f100755 en-BE.js䢄R5]`;twn%100755 en-BE.js.map/̃[a>1η100755 en-BI.d.tsDmrΨFFDҰb f100755 en-BI.jsul|w*8}~!`Y8100755 en-BI.js.map7i7WmTC8{f0S100755 en-BM.d.tsDmrΨFFDҰb f100755 en-BM.jsrQ7c4AMFLF100755 en-BM.js.mapm.&U ?9P"mn1100755 en-BS.d.tsDmrΨFFDҰb f100755 en-BS.jstmn5U(#@7e[100755 en-BS.js.mapu6%;\0e:100755 en-BW.d.tsDmrΨFFDҰb f100755 en-BW.jsoAmŤ 7P_{zz100755 en-BW.js.mapfX`Fb.&r<,100755 en-BZ.d.tsDmrΨFFDҰb f100755 en-BZ.js٠ amrK100755 en-BZ.js.mapDff/FL100755 en-CA.d.tsDmrΨFFDҰb f100755 en-CA.jsGvGxF`l100755 en-CA.js.map!]TZ`a6C:T100755 en-CC.d.tsDmrΨFFDҰb f100755 en-CC.jsfm?YD,%O@ʨt100755 en-CC.js.mapVtܨ+X100755 en-CH.d.tsDmrΨFFDҰb f100755 en-CH.js@+.`ʖ100755 en-CH.js.mapڌ]!YqwkI100755 en-CK.d.tsDmrΨFFDҰb f100755 en-CK.js(a uI100755 en-CK.js.mapjqN.S100755 en-CM.d.tsDmrΨFFDҰb f100755 en-CM.js1m~fBnckD$100755 en-CM.js.map,o6a1,[=)V100755 en-CX.d.tsDmrΨFFDҰb f100755 en-CX.js먯!BnD{100755 en-CX.js.mapu{r/??Uvj100755 en-CY.d.tsDmrΨFFDҰb f100755 en-CY.jsjI:/$P±<]AsY100755 en-CY.js.mapC:-t6MbCfG100755 en-DE.d.tsDmrΨFFDҰb f100755 en-DE.jsREί%Bs]MIc100755 en-DE.js.mapr&3A*ƒ8[100755 en-DG.d.tsDmrΨFFDҰb f100755 en-DG.js`6ˉܵ~r+100755 en-DG.js.mapٹ,<ݻXrjsz100755 en-DK.d.tsDmrΨFFDҰb f100755 en-DK.jsRL)H}ƌ!100755 en-DK.js.map~{,|zm,)—[100755 en-DM.d.tsDmrΨFFDҰb f100755 en-DM.js?t-Ix100755 en-DM.js.mapQ^uGC!7<100755 en-ER.d.tsDmrΨFFDҰb f100755 en-ER.jsxQ}le=Ca`E100755 en-ER.js.mapjw!C'100755 en-MT.d.tsDmrΨFFDҰb f100755 en-MT.jsΩuL=~^C.100755 en-MT.js.mapRQ(j4ʔ100755 en-MU.d.tsDmrΨFFDҰb f100755 en-MU.js.8'" s100755 en-MU.js.mapz,T[ [o7100755 en-MV.d.tsDmrΨFFDҰb f100755 en-MV.jsrl.`/Pi_D{100755 en-MV.js.map0k/s L~100755 en-MW.d.tsDmrΨFFDҰb f100755 en-MW.js=xqhBaC<100755 en-MW.js.map'( !MYsާeZu100755 en-MY.d.tsDmrΨFFDҰb f100755 en-MY.jsЋ;J˨r8 ]3M=100755 en-MY.js.mapmBaBxgqdكY100755 en-NA.d.tsDmrΨFFDҰb f100755 en-NA.jsa#C +E_100755 en-NA.js.mapRZI@Y^Z?x100755 en-NF.d.tsDmrΨFFDҰb f100755 en-NF.js1EN6r-&<1z>X100755 en-NF.js.mapLeT A|6:Zۯc{100755 en-NG.d.tsDmrΨFFDҰb f100755 en-NG.js r5$i{`h6#100755 en-NG.js.map4ff[6|N8100755 en-NL.d.tsDmrΨFFDҰb f100755 en-NL.jsnC<8;G>jc100755 en-NL.js.map0SjV4s3 100755 en-NR.d.tsDmrΨFFDҰb f100755 en-NR.js<:u4$6%x2Rwr100755 en-NR.js.map+Y`]@100755 en-NU.js.map D4I$3|100755 en-NZ.d.tsDmrΨFFDҰb f100755 en-NZ.jsF͸\ g;\f100755 en-NZ.js.mapC„,wdʥU100755 en-PG.d.tsDmrΨFFDҰb f100755 en-PG.js_ٰeT]-jC90100755 en-PG.js.map9oQ (T 100755 en-PH.d.tsDmrΨFFDҰb f100755 en-PH.js9rjGsw3!100755 en-PH.js.map]ɡY-gdFc100755 en-PK.d.tsDmrΨFFDҰb f100755 en-PK.jsV(WUĊ100755 en-PK.js.map~$mJpyI6V؊100755 en-PN.d.tsDmrΨFFDҰb f100755 en-PN.js?%MMM.lYdJ=9100755 en-PN.js.map9t2=?f&}C100755 en-PR.d.tsDmrΨFFDҰb f100755 en-PR.jsY/~CWE0[p_100755 en-PR.js.map8n3\̽Bp๗100755 en-PW.d.tsDmrΨFFDҰb f100755 en-PW.jsV+Y |=k[C100755 en-PW.js.map*I|YGS g100755 en-RW.d.tsDmrΨFFDҰb f100755 en-RW.jsŃ!*@%A7x100755 en-RW.js.map!Уn률X/]=#*100755 en-SB.d.tsDmrΨFFDҰb f100755 en-SB.jsL3F%mb}H100755 en-SB.js.mapj_m %g4G5100755 en-SC.d.tsDmrΨFFDҰb f100755 en-SC.js yzndbM٨ߓŔ100755 en-SC.js.mapgGq2.->F%[100755 en-SD.d.tsDmrΨFFDҰb f100755 en-SD.js8^l7pCҙA100755 en-SD.js.mapC@P+@I}LӺ>|100755 en-SE.d.tsDmrΨFFDҰb f100755 en-SE.jskE`ԔpIj100755 en-SE.js.map g% <3x$100755 en-SG.d.tsDmrΨFFDҰb f100755 en-SG.jsO|ОwKr4:=u["100755 en-SG.js.map+xFQoEﱿX100755 en-SH.d.tsDmrΨFFDҰb f100755 en-SH.jsڪO=h613T~-͟A100755 en-SH.js.mapOeobͷd,ɠ)100755 en-SI.d.tsDmrΨFFDҰb f100755 en-SI.js!~ܸS&rfl100755 en-SI.js.maps/ϚEεkUsXx?100755 en-SL.d.tsDmrΨFFDҰb f100755 en-SL.js懝vsM100755 en-SL.js.map[eh P(_D8100755 en-SS.d.tsDmrΨFFDҰb f100755 en-SS.jsbw?Rg100755 en-SS.js.mapT2#QچfYٮͥ100755 en-SX.d.tsDmrΨFFDҰb f100755 en-SX.js$sTۑ1WxʔiY~100755 en-SX.js.map%4vn$!100755 en-SZ.d.tsDmrΨFFDҰb f100755 en-SZ.jsОחT-Lw100755 en-SZ.js.mapbo=n{rsY\Q100755 en-TC.d.tsDmrΨFFDҰb f100755 en-TC.js7YRJ<"Bl100755 en-TC.js.map\Y S+VLP5100755 en-TK.d.tsDmrΨFFDҰb f100755 en-TK.js6eoOp&~`@100755 en-TK.js.map+9gԠ)II,100755 en-TO.d.tsDmrΨFFDҰb f100755 en-TO.jsdb5;҄100755 en-TO.js.map Ef.lm--tvg e, 100755 en-TT.d.tsDmrΨFFDҰb f100755 en-TT.jsA9rv100755 en-TT.js.mapb@*-cJ|j@100755 en-TV.d.tsDmrΨFFDҰb f100755 en-TV.jsP'30v49|m6100755 en-TV.js.map^L{M alNb2100755 en-TZ.d.tsDmrΨFFDҰb f100755 en-TZ.jsXMW jeF100755 en-TZ.js.map~O~9100755 en-UM.d.tsDmrΨFFDҰb f100755 en-UM.js͕ƩO݌N100755 en-UM.js.map1ò42r100755 en-VC.d.tsDmrΨFFDҰb f100755 en-VC.jsOdK~(C$100755 en-VC.js.map[ۦ}Ck5%100755 en-VG.d.tsDmrΨFFDҰb f100755 en-VG.jsC0ߣ^s+ܦg ~100755 en-VG.js.map'EwY3҉qT_100755 en-VI.d.tsDmrΨFFDҰb f100755 en-VI.jsi"C 5!100755 en-VI.js.map"^c+ i-ڀoqԖ100755 en-VU.d.tsDmrΨFFDҰb f100755 en-VU.jsA%xb_D=8l100755 en-VU.js.map&u=f*[>%&y100755 en-WS.d.tsDmrΨFFDҰb f100755 en-WS.js}lwC@G{100755 en-WS.js.mapEn ݨtXJ 100755 en-ZA.d.tsDmrΨFFDҰb f100755 en-ZA.js*vIQm7:F?P100755 en-ZA.js.mapQ!Tup100755 en-ZM.d.tsDmrΨFFDҰb f100755 en-ZM.js$%uHdG3<f100755 en-ZM.js.map^9↎/-:VÐ100755 en-ZW.d.tsDmrΨFFDҰb f100755 en-ZW.js]Au9`*t100755 en-ZW.js.map iQ2,׀7 100755 en.d.tsDmrΨFFDҰb f100755 en.js c3ÛK}gR%100755 en.js.mapt$̼sD6|100755 eo.d.ts2p-+U#\3jȧt{U100755 eo.js#+ $1r100755 eo.js.mapU&ḽ}JǦ100755 es-419.d.tsDmrΨFFDҰb f100755 es-419.js'# `N7__{100755 es-419.js.mapKEk~>e=u QC100755 es-GT.d.tsDmrΨFFDҰb f100755 es-GT.jsJc=<a=100755 es-GT.js.map/IjLT=(]8100755 es-HN.d.tsDmrΨFFDҰb f100755 es-HN.js-2jF|H>100755 es-HN.js.mapj&!]UL100755 es-IC.d.tsDmrΨFFDҰb f100755 es-IC.js`y|>'I100755 es-IC.js.map08HJ(1qۤt100755 es-MX.d.tsDmrΨFFDҰb f100755 es-MX.js9L4):^100755 es-MX.js.mappLJ&AL100755 es-NI.d.tsDmrΨFFDҰb f100755 es-NI.jss>Id >t100755 es-NI.js.mapDL(Os팞100755 es-PA.d.tsDmrΨFFDҰb f100755 es-PA.js0pLw&100755 es-PA.js.mapAda񵄤(6,100755 es-PE.d.tsDmrΨFFDҰb f100755 es-PE.jsfj"sU(100755 es-PE.js.map(O֬U!U %*100755 es-PH.d.tsDmrΨFFDҰb f100755 es-PH.jsL2GN플N[\vo100755 es-PH.js.map?gdJ9+]n{>W100755 es-PR.d.tsDmrΨFFDҰb f100755 es-PR.js6a֬CYR100755 es-PR.js.mapSn!: dB^K100755 es-PY.d.tsDmrΨFFDҰb f100755 es-PY.jsX (@s+sN100755 es-PY.js.mapK{/])T5U100755 es-SV.d.tsDmrΨFFDҰb f100755 es-SV.jsR^yḳlcsyBT100755 es-SV.js.map .LÞᕸAfzL100755 es-US.d.tsDmrΨFFDҰb f100755 es-US.js?ӐYߍ$,Eq_100755 es-US.js.map4 |jzwqa +Z%100755 es-UY.d.tsDmrΨFFDҰb f100755 es-UY.jsl؝)qv3M100755 es-UY.js.map CfR@F# ?ay100755 es-VE.d.tsDmrΨFFDҰb f100755 es-VE.js^I16[ _MS100755 es-VE.js.map=KYrSbQrM  Q100755 es.d.tsDmrΨFFDҰb f100755 es.jsyeh(JQߝ,F100755 es.js.map\aPu0ɢ>vWE5100755 et.d.tsDmrΨFFDҰb f100755 et.js?#vxSn100755 et.js.mapя-ְ100755 eu.d.tsDmrΨFFDҰb f100755 eu.jsoycgSp|wx100755 eu.js.mapܼ;`1;}100755 ewo.d.ts2p-+U#\3jȧt{U100755 ewo.jsX?Z[tt`Pw100755 ewo.js.map6b恭100755 ff-CM.js.map$ -[jBF%p100755 ff-GN.d.ts2p-+U#\3jȧt{U100755 ff-GN.js97@F;l Q100755 ff-GN.js.mapd6L%mu]B+34>100755 ff-Latn-BF.d.ts2p-+U#\3jȧt{U100755 ff-Latn-BF.js MJd(d1ÎF100755 ff-Latn-BF.js.map{2O8v?5?Z}}100755 ff-Latn-CM.d.ts2p-+U#\3jȧt{U100755 ff-Latn-CM.js0j-'100755 ff-Latn-CM.js.map5}؟h\]7 jj100755 ff-Latn-GH.d.ts2p-+U#\3jȧt{U100755 ff-Latn-GH.jspў"|100755 ff-Latn-GH.js.map稑4%jm&`Q[m100755 ff-Latn-GM.d.ts2p-+U#\3jȧt{U100755 ff-Latn-GM.jsѹI䛧ևe100755 ff-Latn-GM.js.map4h&{̍BzM 100755 ff-Latn-GN.d.ts2p-+U#\3jȧt{U100755 ff-Latn-GN.js xF>X`مf< 100755 ff-Latn-GN.js.map!˧.GI$a`2100755 ff-Latn-GW.d.ts2p-+U#\3jȧt{U100755 ff-Latn-GW.jshGT EFPJNaG100755 ff-Latn-GW.js.map&~M/OG꭬100755 ff-Latn-LR.d.ts2p-+U#\3jȧt{U100755 ff-Latn-LR.jsy)錩1"oNuzl100755 ff-Latn-LR.js.mapjyB=#]]X%h100755 ff-Latn-MR.d.ts2p-+U#\3jȧt{U100755 ff-Latn-MR.jsiAOEkj^ 100755 ff-Latn-MR.js.map HmQ6[ƹ100755 ff-Latn-NE.d.ts2p-+U#\3jȧt{U100755 ff-Latn-NE.jsW{|P034&p100755 ff-Latn-NE.js.map5r`l:.LJ100755 ff-Latn-NG.d.ts2p-+U#\3jȧt{U100755 ff-Latn-NG.js _ E ccV100755 ff-Latn-NG.js.map=ͪ/a.QD\lhS100755 ff-Latn-SL.d.ts2p-+U#\3jȧt{U100755 ff-Latn-SL.jsn٪U"'xqI6100755 ff-Latn-SL.js.map̿ItZC100755 ff-Latn.d.ts2p-+U#\3jȧt{U100755 ff-Latn.js@D' W#yI#100755 ff-Latn.js.maptɧ#áɲbU)/100755 ff-MR.d.ts2p-+U#\3jȧt{U100755 ff-MR.jsۇ `欏?1100755 ff-MR.js.mapqmuy100755 ff.d.ts2p-+U#\3jȧt{U100755 ff.jsp~F! xfsT 100755 ff.js.mapD ˞TVhF100755 fi.d.tsNʇBZ({Mq|:`100755 fi.js"ԇㅋHlw1 100755 fi.js.mapcL6G8 )100755 fil.d.tsDmrΨFFDҰb f100755 fil.js߀ EmCUڔ}EI100755 fil.js.mapHf@i΋vdw>_Q100755 fo-DK.d.ts2p-+U#\3jȧt{U100755 fo-DK.jsz7*}-ǧaE100755 fo-DK.js.map/ԚUQ”KMwjw_100755 fo.d.ts2p-+U#\3jȧt{U100755 fo.jsg"GeWHȶ>󨏗100755 fo.js.mapCT24b `$:E100755 fr-BE.d.tsDmrΨFFDҰb f100755 fr-BE.jsEoBjNS?FF~100755 fr-BE.js.map2`f$$9100755 fr-BF.d.tsDmrΨFFDҰb f100755 fr-BF.js:Q,X>100755 fr-BF.js.map5}r^I2100755 fr-BI.d.tsDmrΨFFDҰb f100755 fr-BI.js`R.]|a L 100755 fr-BI.js.mapӡYI}pR'100755 fr-BJ.d.tsDmrΨFFDҰb f100755 fr-BJ.jsERD+=K100755 fr-BJ.js.mapϜ `100755 fr-CD.js.map_-aebe<\L 100755 fr-CF.d.tsDmrΨFFDҰb f100755 fr-CF.jsZ^юJΚ(XBhA 2100755 fr-CF.js.map2^*jp`100755 fr-CG.d.tsDmrΨFFDҰb f100755 fr-CG.js+qlU@%100755 fr-CG.js.map)k 0$6 MBK100755 fr-CH.d.tsDmrΨFFDҰb f100755 fr-CH.js $Yx3100755 fr-CH.js.mapOS9<:8fa1y100755 fr-CI.d.tsDmrΨFFDҰb f100755 fr-CI.js=T, hbKVK8100755 fr-CI.js.map$Z @R7d100755 fr-CM.d.tsDmrΨFFDҰb f100755 fr-CM.js!,\NC`-v.g?x100755 fr-CM.js.map̸~Sh14wXSb100755 fr-DJ.d.tsDmrΨFFDҰb f100755 fr-DJ.jshQsԎK)RNS\Z100755 fr-DJ.js.map@Wx ]8R100755 fr-DZ.d.tsDmrΨFFDҰb f100755 fr-DZ.js -gSgd8100755 fr-DZ.js.maplN~JO:100755 fr-GA.d.tsDmrΨFFDҰb f100755 fr-GA.js̆8:jFb100755 fr-GA.js.mapF^UvE|F{100755 fr-GF.d.tsDmrΨFFDҰb f100755 fr-GF.jsZȓ\t] >&100755 fr-GF.js.map&/A`uySCL 1100755 fr-GN.d.tsDmrΨFFDҰb f100755 fr-GN.js<΅Uϙ}A90E 100755 fr-GN.js.mapiN&zKi100755 fr-GP.d.tsDmrΨFFDҰb f100755 fr-GP.js n';:u)D100755 fr-GP.js.mapL(<)Qo :100755 fr-GQ.d.tsDmrΨFFDҰb f100755 fr-GQ.js7?Uʃ 3RDp3n4100755 fr-GQ.js.map{갍QE>Cn100755 fr-HT.d.tsDmrΨFFDҰb f100755 fr-HT.jsv 0#QӢu100755 fr-HT.js.mapgO3IQi" 100755 fr-KM.d.tsDmrΨFFDҰb f100755 fr-KM.jspհ100755 fr-KM.js.map;` j$6ʒ+Kޙ100755 fr-LU.d.tsDmrΨFFDҰb f100755 fr-LU.js}:= m{100755 fr-LU.js.map,X̷{ -0jT100755 fr-MA.d.tsDmrΨFFDҰb f100755 fr-MA.js(V4}eX J7100755 fr-MA.js.map79K4f]mbYg@100755 fr-MC.d.tsDmrΨFFDҰb f100755 fr-MC.js0eRɷZq7NHŠx100755 fr-MC.js.map0W>i,a 100755 fr-MF.d.tsDmrΨFFDҰb f100755 fr-MF.js jG]wl?`100755 fr-MF.js.map G=ӓ vN=)100755 fr-MG.d.tsDmrΨFFDҰb f100755 fr-MG.js2Qࢄ=YUˆ 100755 fr-MG.js.mapSKCimd100755 fr-ML.d.tsDmrΨFFDҰb f100755 fr-ML.js*>ק5lZ [ B100755 fr-ML.js.mapnye{1V[W\UQHI100755 fr-MQ.d.tsDmrΨFFDҰb f100755 fr-MQ.js"NM˷Fc8100755 fr-MQ.js.mapw\- n@uAS.100755 fr-MR.d.tsDmrΨFFDҰb f100755 fr-MR.jsRmF7y]9.Aԙ100755 fr-MR.js.map6|~EhΉƙqnU100755 fr-MU.d.tsDmrΨFFDҰb f100755 fr-MU.js]]&DVU c#100755 fr-MU.js.map=&ɤK2d"t^v100755 fr-NC.d.tsDmrΨFFDҰb f100755 fr-NC.js76[N!(~@yj100755 fr-NC.js.map_.o`珽:&F100755 fr-NE.d.tsDmrΨFFDҰb f100755 fr-NE.js픳 ݧ?*H,\ =100755 fr-NE.js.mapGN7`r7ԑ^100755 fr-PF.d.tsDmrΨFFDҰb f100755 fr-PF.js6/fE蠲 100755 fr-PF.js.map ӟL3ku>)?Z100755 fr-PM.d.tsDmrΨFFDҰb f100755 fr-PM.js˓&nx 100755 fr-PM.js.mapʎ8AE,100755 fr-RE.d.tsDmrΨFFDҰb f100755 fr-RE.js`2T֥8^ARؑy100755 fr-RE.js.map+wuiE/j$N100755 fr-RW.d.tsDmrΨFFDҰb f100755 fr-RW.jsim8!NZc^vL100755 fr-RW.js.maptK(L[100755 fr-SC.d.tsDmrΨFFDҰb f100755 fr-SC.jsn"5TY100755 fr-SC.js.map6Xנni*AxU]"100755 fr-SN.d.tsDmrΨFFDҰb f100755 fr-SN.js[n!B יA޴O100755 fr-SN.js.map])Y)J=NO100755 fr-SY.d.tsDmrΨFFDҰb f100755 fr-SY.jsnłhG:B"_100755 fr-SY.js.mapi]%@)9DY Tu100755 fr-TD.d.tsDmrΨFFDҰb f100755 fr-TD.js[; b{u" j 100755 fr-TD.js.mapΎ#ז-QbqwA{100755 fr-TG.d.tsDmrΨFFDҰb f100755 fr-TG.js뫠!a3J "M~K100755 fr-TG.js.map%ShHT+vI100755 fr-TN.d.tsDmrΨFFDҰb f100755 fr-TN.jsfe #zW100755 fr-TN.js.mapz ObIpQw100755 fr-VU.d.tsDmrΨFFDҰb f100755 fr-VU.jszR&Ү$C100755 fr-VU.js.mapUFh ^|100755 fr-WF.d.tsDmrΨFFDҰb f100755 fr-WF.jsH#{ekr|100755 fr-WF.js.map4LG|ٛ|8100755 fr-YT.d.tsDmrΨFFDҰb f100755 fr-YT.jsyȋJb䊤D:+ZD100755 fr-YT.js.mapPgb=SH8U 100755 fr.d.tsDmrΨFFDҰb f100755 fr.jsB^26tA{`100755 fr.js.mapYii@UVkR<ݹV100755 fur.d.ts2p-+U#\3jȧt{U100755 fur.jsj絟Rn3n 100755 fur.js.map?˘زhZ_rS100755 fy.d.ts2p-+U#\3jȧt{U100755 fy.js{mC3@B100755 fy.js.mapGG hp gE100755 ga-GB.d.ts2p-+U#\3jȧt{U100755 ga-GB.jsD2S\_T Po)100755 ga-GB.js.map>o\[ KUp100755 ga.d.ts2p-+U#\3jȧt{U100755 ga.jsMEJXIGdYeR=AL100755 ga.js.map:&k=wUqQ100755 gd.d.ts2p-+U#\3jȧt{U100755 gd.js:R0jA_7ld100755 gd.js.mapśftv}R]100755 gl.d.tsDmrΨFFDҰb f100755 gl.jsHU6YRC=100755 gl.js.map4krV^i C100755 gsw-FR.d.tsDmrΨFFDҰb f100755 gsw-FR.jsA+mR\L100755 gsw-FR.js.map-, r’]100755 gsw-LI.d.tsDmrΨFFDҰb f100755 gsw-LI.jsi `S*`{+ 100755 gsw-LI.js.mapaqr5I100755 gsw.d.tsDmrΨFFDҰb f100755 gsw.jsBF*k100755 gsw.js.mapr,u2)Tf?100755 gu.d.tsDmrΨFFDҰb f100755 gu.js*XKd»S[<0100755 gu.js.map$2 'V/4~100755 guz.d.ts2p-+U#\3jȧt{U100755 guz.js zq)YC~+w100755 guz.js.mapZe?5 Ԋ*Wnp100755 gv.d.ts2p-+U#\3jȧt{U100755 gv.js*ЬH旍uD100755 gv.js.map'!8;("100755 ha-GH.d.ts2p-+U#\3jȧt{U100755 ha-GH.jsh%E}100755 ha-GH.js.mapNmJ59:100755 ha-NE.d.ts2p-+U#\3jȧt{U100755 ha-NE.jsS7-V b<Ⱦ弧100755 ha-NE.js.map6H3Z ʥɘs100755 ha.d.ts2p-+U#\3jȧt{U100755 ha.js1\`vOBa,100755 ha.js.mapՍUh!?100755 hsb.js.mapFT_ OϩUpF100755 hu.d.ts~s'd`>N[100755 hu.jsXGA`a/DtݩP100755 hu.js.map/ %@`DY912100755 hy.d.tsDmrΨFFDҰb f100755 hy.js"sWs100755 hy.js.mapNb f~}100755 ia.d.ts2p-+U#\3jȧt{U100755 ia.jsQoS`!PTV/hs0100755 ia.js.mapgKlyL8X100755 id.d.ts~s'd`>N[100755 id.js:A@$hgCmWˤaX0s100755 id.js.map9*?\o}A100755 ig.d.ts2p-+U#\3jȧt{U100755 ig.jsc|X @Ϛ݂100755 ig.js.mapO`@gw,d[100755 ii.d.ts2p-+U#\3jȧt{U100755 ii.jsE1$5Ӳp100755 ii.js.map=A˱'./u100755 is.d.tsDmrΨFFDҰb f100755 is.jsԭ9]jm!v.\O>Z#100755 is.js.map˨xsKIG100755 it-CH.d.tsDmrΨFFDҰb f100755 it-CH.jsO،z[M .100755 it-CH.js.mapb=HH~j:TYJYI100755 it-SM.d.tsDmrΨFFDҰb f100755 it-SM.jsHT`{3tՀo100755 it-SM.js.mapIsL,|4"100755 it-VA.d.tsDmrΨFFDҰb f100755 it-VA.js_Q3(v-eˮr100755 it-VA.js.map6HWe>N6gA(100755 it.d.tsDmrΨFFDҰb f100755 it.jsm%OZ&8:yFL100755 it.js.map9 ̻7%dsWV|100755 ja.d.ts~s'd`>N[100755 ja.jsmW`zQ9 m100755 ja.js.mapY=O BHOZ100755 jgo.d.ts2p-+U#\3jȧt{U100755 jgo.js|W^}.100755 jgo.js.mapӴeS'ސAmu100755 jmc.d.ts2p-+U#\3jȧt{U100755 jmc.js,[v!d&b!z100755 jmc.js.map eU|M'&}(w.100755 jv.d.ts2p-+U#\3jȧt{U100755 jv.js1gB8['ۥN =>c100755 jv.js.map5ؽ5Dq:n(G?100755 ka.d.tsDmrΨFFDҰb f100755 ka.jsSEN[100755 kgp.js FLҴ]eaM100755 kgp.js.mapsS_.;L100755 khq.d.ts2p-+U#\3jȧt{U100755 khq.js<Ôt ?1wS7100755 khq.js.map[ڷ efދU100755 ki.d.ts2p-+U#\3jȧt{U100755 ki.js.=e\Ѵ c100755 ki.js.map?EP&>O3100755 kk.d.tsDmrΨFFDҰb f100755 kk.jsC{]ta9 .,100755 kk.js.map-Ӫ̤ 0'wa%s]100755 kkj.d.ts2p-+U#\3jȧt{U100755 kkj.jsH7ThzUJ?K&N100755 kkj.js.mapU ^gQxMu|100755 kl.d.ts2p-+U#\3jȧt{U100755 kl.jsqyڌtI~.4Gg^>100755 kl.js.mapSSYIhw)ѪJ100755 kln.d.ts2p-+U#\3jȧt{U100755 kln.js𸏩}zrZ100755 kln.js.mapdLY:n w C100755 km.d.tsDmrΨFFDҰb f100755 km.jsR@k7Zo(l9,100755 km.js.map*0 '*9cظlu+100755 kn.d.tsDmrΨFFDҰb f100755 kn.js[I5d:C.100755 kn.js.map@6O6kmsȮ;t100755 ko-KP.d.ts~s'd`>N[100755 ko-KP.jsTG192Ի=@Nw100755 ko-KP.js.mapXi3MOD7qn4$g100755 ko.d.ts~s'd`>N[100755 ko.jsٝd rQhqq100755 ko.js.mapӞDCCcvrq V100755 kok.d.ts2p-+U#\3jȧt{U100755 kok.jsNyC`{'3>100755 kok.js.mapD-灨gh=100755 ks-Arab.d.ts2p-+U#\3jȧt{U100755 ks-Arab.js"h夋vaf100755 ks-Arab.js.map.խ^{'\p@G100755 ksh.js.map#.lDyN100755 ku.d.ts2p-+U#\3jȧt{U100755 ku.jsmtCRbP)s100755 ku.js.mapivp/uN^mϴoLt100755 kw.d.ts2p-+U#\3jȧt{U100755 kw.jsr Ӝ?˪ /)YAn100755 kw.js.map)(QUxF&."I!100755 ky.d.tsDmrΨFFDҰb f100755 ky.js2)*b|1“{ 100755 ky.js.mapʑgLߦgM100755 lag.d.ts2p-+U#\3jȧt{U100755 lag.jsZҊʧd6 O 100755 lag.js.maphIx;ί( s100755 lb.d.ts2p-+U#\3jȧt{U100755 lb.js$CbaOND%100755 lb.js.mapBJH'100755 ln-CF.js.mapᡕDfP #K|100755 ln-CG.d.ts2p-+U#\3jȧt{U100755 ln-CG.jslK}e\~;]]Ǟ~100755 ln-CG.js.map-wKg Дa100755 ln.d.ts2p-+U#\3jȧt{U100755 ln.js9lܝ(Wޮ100755 lo.js.mapa ?$V-;W100755 lrc-IQ.d.ts2p-+U#\3jȧt{U100755 lrc-IQ.js~[<)vP-|Y100755 lrc-IQ.js.map$df 100755 lrc.d.ts2p-+U#\3jȧt{U100755 lrc.jsm͊jIo#>O100755 lrc.js.map(]GKPhk̃`100755 lt.d.tsDmrΨFFDҰb f100755 lt.jsx!vW+c/mH100755 lt.js.map'^(JM⮖(100755 lu.d.ts2p-+U#\3jȧt{U100755 lu.jsQQ)}:100755 lu.js.map HBzώXZ5100755 luo.d.ts2p-+U#\3jȧt{U100755 luo.js.VY1pA'.=100755 luo.js.mapCRa[/100755 luy.d.ts2p-+U#\3jȧt{U100755 luy.js'\WGFsldgzxM100755 luy.js.mapEm 6ہ:Wӌ100755 lv.d.tsDmrΨFFDҰb f100755 lv.jsP^f94şb100755 lv.js.mapgy `T L100755 mai.d.ts2p-+U#\3jȧt{U100755 mai.jsudd!F>.#S8a100755 mai.js.mapziir?paf(ԡ100755 mas-TZ.d.ts2p-+U#\3jȧt{U100755 mas-TZ.jse ־0y100755 mas-TZ.js.mapl= m]}q!5I#Ƚ100755 mas.d.ts2p-+U#\3jȧt{U100755 mas.jsDmqqU1w&K100755 mas.js.mapWe{7A100755 mer.d.ts2p-+U#\3jȧt{U100755 mer.jsv;A`6mɢj±100755 mer.js.mapNQbS̬$N/lrR100755 mfe.d.ts2p-+U#\3jȧt{U100755 mfe.js0sz/y~J100755 mfe.js.map_g2hh1`بufA6/100755 mg.d.ts2p-+U#\3jȧt{U100755 mg.js6?WteZ100755 mg.js.mapb9>ƚUW6WV$100755 mgh.d.ts2p-+U#\3jȧt{U100755 mgh.jsJhS p#i-HEps100755 mi.d.ts2p-+U#\3jȧt{U100755 mi.jsLRrKQ=.(?'{100755 mi.js.mapZh09nO|100755 mk.d.tsNʇBZ({Mq|:`100755 mk.js;E"j V100755 mk.js.map '8u2B100755 ml.d.tsDmrΨFFDҰb f100755 ml.js<-i:*w=100755 ml.js.mapSѰ;Foc100755 mn.d.ts~s'd`>N[100755 mn.js7hbdzC%KEys100755 mn.js.mapȵ>F;0(;1š100755 mni-Beng.d.ts2p-+U#\3jȧt{U100755 mni-Beng.jsKj_>y*[d+100755 mni-Beng.js.mapzP!;v*sVa100755 mni.d.ts2p-+U#\3jȧt{U100755 mni.jsl׸ yH V100755 mni.js.map#-`%AgK l4100755 mr.d.tsDmrΨFFDҰb f100755 mr.js(?jFBo=7N!fg100755 mr.js.mapM ݝim1|100755 ms-BN.d.ts݃?fx^]]`yDe100755 ms-BN.jsAZ#{"]iX<100755 ms-BN.js.map#~M9tf+100755 ms-ID.d.ts݃?fx^]]`yDe100755 ms-ID.js-CP;N/}-;0100755 ms-ID.js.map`ZrO !,+{GS¦100755 ms-SG.d.ts݃?fx^]]`yDe100755 ms-SG.jsdlab'xNCI"/100755 ms-SG.js.map~՗ϡ100755 ms.d.ts݃?fx^]]`yDe100755 ms.js_V# GE#3x(100755 ms.js.mapz5B|eʂrL2100755 mt.d.ts2p-+U#\3jȧt{U100755 mt.jsN͖n%L/"100755 mt.js.mapLV]w.7GC100755 mua.d.ts2p-+U#\3jȧt{U100755 mua.jsL0OI5tz_A100755 mua.js.map}_<5M4 7,100755 my.d.ts~s'd`>N[100755 my.js+F0q-t100755 my.js.map|v4Ub͐\i!100755 mzn.d.ts2p-+U#\3jȧt{U100755 mzn.jsö, |sK]H100755 mzn.js.mapq B {"100755 naq.d.ts2p-+U#\3jȧt{U100755 naq.jsaJ*ܘLcu^`100755 naq.js.mapǘf" wH5oOJ100755 nb-SJ.d.tsNʇBZ({Mq|:`100755 nb-SJ.js!u5"$vCQy?_ ;100755 nb-SJ.js.map|e-lv)x 2;Cb100755 nb.d.tsNʇBZ({Mq|:`100755 nb.jssِRt'Ytĸ100755 nb.js.map؅d>Ĉ>ȷ100755 nd.d.ts2p-+U#\3jȧt{U100755 nd.js;.Vڻh3KF#100755 nd.js.mapBEg9{}x s100755 nds-NL.d.ts2p-+U#\3jȧt{U100755 nds-NL.js e2Zy2D҆ +100755 nds-NL.js.mapFLL(&:!100755 nds.d.ts2p-+U#\3jȧt{U100755 nds.jsCG}jg'zѫ100755 nds.js.map.gt1]5δWd100755 ne-IN.d.ts~s'd`>N[100755 ne-IN.jsC!_VFW 100755 ne-IN.js.maprC4`ZyJ100755 ne.d.ts~s'd`>N[100755 ne.js$1NdD_L}100755 ne.js.map{1Z꠼;Sv<100755 nl-AW.d.tsDmrΨFFDҰb f100755 nl-AW.js :\+ir<100755 nl-AW.js.map^>D\ܺB`W100755 nl-BE.d.tsDmrΨFFDҰb f100755 nl-BE.jsf6 KC tHw100755 nl-BE.js.map9#pg0E ⨝XA100755 nl-BQ.d.tsDmrΨFFDҰb f100755 nl-BQ.jsZ;WqXm՘9100755 nl-BQ.js.mapF-T+| A;82100755 nl-CW.d.tsDmrΨFFDҰb f100755 nl-CW.jsAg36D"100755 nl-CW.js.mapj?u$EvV 100755 nl-SR.d.tsDmrΨFFDҰb f100755 nl-SR.js7 }Xƿ100755 nl-SR.js.map+iݳUW9100755 nl-SX.d.tsDmrΨFFDҰb f100755 nl-SX.jsKUvӯnqU100755 nl-SX.js.mapZVՇbI– 8&>E100755 nl.d.tsDmrΨFFDҰb f100755 nl.js nW&pÕb100755 nl.js.map:Wl 6Ж!100755 nmg.d.ts2p-+U#\3jȧt{U100755 nmg.jsbz~100755 nmg.js.maplnhpT}100755 nn.d.tsNʇBZ({Mq|:`100755 nn.js-aף bQ$G100755 nn.js.mapkqM_ jje`',]/100755 nnh.d.ts2p-+U#\3jȧt{U100755 nnh.jsv0z8@HeWVc100755 nnh.js.mapo0WE 8NBx100755 no.d.tsNʇBZ({Mq|:`100755 no.jsf5{Ii>Hp100755 no.js.mapIV\MiˍW-100755 nus.d.ts2p-+U#\3jȧt{U100755 nus.jscwDY7"^R 100755 nus.js.mapl{!JFQ7{100755 nyn.d.ts2p-+U#\3jȧt{U100755 nyn.jsmz?bZwYq100755 nyn.js.map8@5/5!Yg^100755 om-KE.d.ts2p-+U#\3jȧt{U100755 om-KE.jsܠy  ol100755 om-KE.js.mapq$EtCwp100755 om.d.ts2p-+U#\3jȧt{U100755 om.js[@RY{ّ,?100755 om.js.mapX@`eLL100755 or.d.ts2p-+U#\3jȧt{U100755 or.jsV gܘ?;R*100755 or.js.map2=A9&ؚxSF#q100755 os-RU.d.ts2p-+U#\3jȧt{U100755 os-RU.js:+t3d7J8100755 os-RU.js.map櫱wj)AVQ100755 os.d.ts2p-+U#\3jȧt{U100755 os.js`Q*wqNWh100755 os.js.map4qe7e;E\100755 pa-Arab.d.ts2p-+U#\3jȧt{U100755 pa-Arab.js`l٢GZrYޚ{100755 pa-Arab.js.mapd_R& s100755 pa-Guru.d.tsDmrΨFFDҰb f100755 pa-Guru.js|K!On<100755 pa-Guru.js.mapUEiA9YB100755 pa.d.tsDmrΨFFDҰb f100755 pa.jsSjv3/bcH100755 pa.js.mapmnNcA=HQn{100755 pcm.d.ts2p-+U#\3jȧt{U100755 pcm.jsOqB^2jM*\100755 pcm.js.mapک*ꡞ2\Vkd100755 pl.d.tsDmrΨFFDҰb f100755 pl.jsSWc۱˥`=#100755 pl.js.map9I*CORRE8u3100755 ps-PK.d.ts2p-+U#\3jȧt{U100755 ps-PK.js{br!ylrtcT100755 ps-PK.js.map_H@18Yblk100755 ps.d.ts2p-+U#\3jȧt{U100755 ps.js_(Q/_PȨ 100755 ps.js.map-{ ?-Ěi& 100755 pt-AO.d.tsDmrΨFFDҰb f100755 pt-AO.jsENOC;颳 :100755 pt-AO.js.mapd yj) 100755 pt-CH.d.tsDmrΨFFDҰb f100755 pt-CH.js#2]2NL Q82:wZ5100755 pt-CH.js.map7ڰ̭mϤcnS.100755 pt-CV.d.tsDmrΨFFDҰb f100755 pt-CV.js9Lΰ+-$}100755 pt-CV.js.map^wE100755 pt-PT.d.tsDmrΨFFDҰb f100755 pt-PT.jsv  rh100755 pt-PT.js.mapkOPK =DO100755 pt-ST.d.tsDmrΨFFDҰb f100755 pt-ST.js4d:`i#100755 pt-ST.js.map?h >100755 pt-TL.d.tsDmrΨFFDҰb f100755 pt-TL.js fgQZMGۉܦG100755 pt-TL.js.map?|=1`mظ̫100755 pt.d.tsDmrΨFFDҰb f100755 pt.jsHH F 5`fިɵ100755 pt.js.map8{t!z~z0100755 qu-BO.d.ts2p-+U#\3jȧt{U100755 qu-BO.js8ȱ^*>JSTB100755 qu-BO.js.mapAH95B100755 qu-EC.d.ts2p-+U#\3jȧt{U100755 qu-EC.jsH4zJ!A-j100755 qu-EC.js.mapQj& b5x100755 qu.d.ts2p-+U#\3jȧt{U100755 qu.jsؕm: <;100755 qu.js.map󭭁fsi.{tWu100755 rm.d.ts2p-+U#\3jȧt{U100755 rm.js 飜C,sl o100755 rm.js.mapØʐS|^sd6?100755 rn.d.ts2p-+U#\3jȧt{U100755 rn.jswܹdXS#100755 rn.js.map AuGcO $100755 ro-MD.d.ts~s'd`>N[100755 ro-MD.js Iҥ-ծ ء0Y100755 ro-MD.js.map'&^n/¼ p=>^100755 ro.d.tsDmrΨFFDҰb f100755 ro.jsY.f=`|FyQ ¿100755 ro.js.mapѤGd3'vC]100755 rof.d.ts2p-+U#\3jȧt{U100755 rof.js xPUl]&tn=:E 100755 rof.js.map||0cIko100755 ru-BY.d.tsDmrΨFFDҰb f100755 ru-BY.jsT 82fQA/i'100755 ru-BY.js.map%6Ht#u100755 ru-KG.d.tsDmrΨFFDҰb f100755 ru-KG.js2>> ]ҫ#100755 ru-KG.js.mapggf}/-̀{՝eSE100755 ru-KZ.d.tsDmrΨFFDҰb f100755 ru-KZ.js):)Eח\ɆD100755 ru-KZ.js.mapl֣xIA¥r[100755 ru-MD.d.tsDmrΨFFDҰb f100755 ru-MD.jsI0X(Su,Ṋ100755 ru-MD.js.mapǛF/ A<#,100755 ru-UA.d.tsDmrΨFFDҰb f100755 ru-UA.js-PʱC^$.100755 ru-UA.js.map6ɏ^枈t8100755 ru.d.tsDmrΨFFDҰb f100755 ru.js+L*J"100755 ru.js.map7/ԮhE'_r100755 rw.d.ts2p-+U#\3jȧt{U100755 rw.jsVgN6YXPP-100755 rw.js.map@/`|%CٯL100755 rwk.d.ts2p-+U#\3jȧt{U100755 rwk.jshY٘Uu#8100755 rwk.js.map;d/7c:7Af_9#100755 sa.d.ts2p-+U#\3jȧt{U100755 sa.jsg9#d'8|VD100755 sa.js.map0xӏMGS3sv 100755 sah.d.ts2p-+U#\3jȧt{U100755 sah.js] ~ja;&du100755 sah.js.map+F>D/FsN7100755 saq.d.ts2p-+U#\3jȧt{U100755 saq.js[Ia'100755 saq.js.mapZ)a!>))100755 sat-Olck.d.ts2p-+U#\3jȧt{U100755 sat-Olck.jsf|l< KCy100755 sat-Olck.js.mapLe'ʳu+9100755 sat.d.ts2p-+U#\3jȧt{U100755 sat.jsEs> iIWH100755 sat.js.mapO<;Rj^6F100755 sbp.d.ts2p-+U#\3jȧt{U100755 sbp.js}BP0sM Eb100755 sbp.js.mapͪVq78S f) 100755 sc.d.ts2p-+U#\3jȧt{U100755 sc.js%{"Yv100755 sc.js.mapH!~\ib4^0 100755 sd-Arab.d.ts2p-+U#\3jȧt{U100755 sd-Arab.js9r_"3@d100755 sd-Arab.js.mapvtq _?:100755 sd-Deva.d.ts2p-+U#\3jȧt{U100755 sd-Deva.jso7M<ڥO.u/100755 sd-Deva.js.map'XA#:#m1f100755 sd.d.ts2p-+U#\3jȧt{U100755 sd.js'l\`9swQԿC.100755 sd.js.mapI{&jQHFϕ100755 se-FI.d.ts2p-+U#\3jȧt{U100755 se-FI.js-gn0^USu100755 se-FI.js.mapWuknЍ9!*T>100755 se-SE.d.ts2p-+U#\3jȧt{U100755 se-SE.jsv\ⷓS\~y100755 se-SE.js.mapoIh_ﭡ؏}g100755 se.d.ts2p-+U#\3jȧt{U100755 se.js)uw2g~ d100755 se.js.mapn@W0ئmqJ100755 seh.d.ts2p-+U#\3jȧt{U100755 seh.jsAޤSǍ`A100755 seh.js.map~OOHA3d*100755 ses.d.ts2p-+U#\3jȧt{U100755 ses.jsxe$Ҹ$>?8100755 ses.js.mapULP+u}b{'!E>>100755 sg.d.ts2p-+U#\3jȧt{U100755 sg.js'[D\PQ HNKdLm100755 sg.js.mappZ=ܚ R100755 shi-Latn.d.ts2p-+U#\3jȧt{U100755 shi-Latn.jsfV#_gtKp‹100755 shi-Latn.js.mapF#\.RMNy;l100755 shi.js.mapD | -q3W4 100755 si.d.tsDmrΨFFDҰb f100755 si.js{ iA=_qb100755 si.js.map$q=100755 sk.d.tsNʇBZ({Mq|:`100755 sk.js??ƪ 1100755 sk.js.map zEY :100755 sl.d.tsNʇBZ({Mq|:`100755 sl.jsT?(](100755 sl.js.map-f(q $Q}+:100755 smn.d.ts2p-+U#\3jȧt{U100755 smn.js PKR%Dbu;F100755 smn.js.mapSCd6۝mr@100755 sn.d.ts2p-+U#\3jȧt{U100755 sn.jsU=E'1100755 sn.js.map#HJfZ4! C100755 so-DJ.d.ts2p-+U#\3jȧt{U100755 so-DJ.js8j`+w~UĒ^r΁100755 so-DJ.js.map/JDZ*u100755 so-ET.d.ts2p-+U#\3jȧt{U100755 so-ET.jsL2Wd8O+100755 so-ET.js.map\&)\tBo4{͠100755 so-KE.d.ts2p-+U#\3jȧt{U100755 so-KE.jsqji*J0Ί100755 so-KE.js.mapBӽ hbQA,zT100755 so.d.ts2p-+U#\3jȧt{U100755 so.jsem\o[nR100755 so.js.mapC 5E=100755 sq-MK.d.tsDmrΨFFDҰb f100755 sq-MK.js jQYD șQS10%;(100755 sq-MK.js.mapXj+%UIa>=|100755 sq-XK.d.tsDmrΨFFDҰb f100755 sq-XK.jsK00skMxz100755 sq-XK.js.mapv̶K!tnQ jlA100755 sq.d.tsDmrΨFFDҰb f100755 sq.js[糏VF2|100755 sq.js.mapN SW恧x100755 sr-Cyrl-BA.d.tsDmrΨFFDҰb f100755 sr-Cyrl-BA.js ?XCUfH100755 sr.d.tsDmrΨFFDҰb f100755 sr.js˖=411A+p%䞢100755 sw-CD.js.mapVC8Z/ac100755 sw-KE.d.tsNʇBZ({Mq|:`100755 sw-KE.js;z>wnNڹA100755 sw-KE.js.map.V6MPK΋)@100755 sw-UG.d.tsNʇBZ({Mq|:`100755 sw-UG.js%ī(l3:N{100755 sw-UG.js.mapU$KLbZ"zV100755 sw.d.tsNʇBZ({Mq|:`100755 sw.jsqbdG:Bس2100755 sw.js.mapRs̖#8}YˇtP100755 ta-LK.d.tsDmrΨFFDҰb f100755 ta-LK.jsmvh8yGN100755 ta-LK.js.mapv6'\4nZ100755 ta-MY.d.tsDmrΨFFDҰb f100755 ta-MY.js_vMگzoN100755 ta-MY.js.map0B2'ZgJͤ!100755 ta-SG.d.tsDmrΨFFDҰb f100755 ta-SG.jsMiJV^@Oej100755 ta-SG.js.map*&AB$iw1100755 ta.d.tsDmrΨFFDҰb f100755 ta.js>e ^w䠰gWZ100755 ta.js.map a=~QU7z100755 te.d.ts~s'd`>N[100755 te.jsau z7u{"z100755 te.js.mapOMKS!^hJb|100755 teo-KE.d.ts2p-+U#\3jȧt{U100755 teo-KE.jseaKa4LA\Bڐ(100755 teo-KE.js.map9^ol0b\100755 teo.d.ts2p-+U#\3jȧt{U100755 teo.js{ed9F100755 teo.js.map7C\'Ʀ]Q@:)100755 tg.d.ts2p-+U#\3jȧt{U100755 tg.jsu ʼ8>Zo,z100755 tg.js.map@]޼҂Yu$iE100755 th.d.tsDmrΨFFDҰb f100755 th.js$ZIDW 0q~,&n100755 th.js.maph%]rkO0 C100755 ti-ER.d.ts2p-+U#\3jȧt{U100755 ti-ER.js%1RP)$ 100755 ti-ER.js.mapVO5%hG؊O100755 ti.d.ts2p-+U#\3jȧt{U100755 ti.js>f`i7B`ӓ6\100755 ti.js.mapQ2H4 K!H,N100755 tk.d.ts2p-+U#\3jȧt{U100755 tk.jsR,nfز}1+vLi\100755 tk.js.map\ :Su+z` 100755 to.d.ts2p-+U#\3jȧt{U100755 to.jstg0S:b100755 to.js.mapHAOV=^9tl100755 tr-CY.d.tsDmrΨFFDҰb f100755 tr-CY.jsј{]lX"e*vKquS100755 tr-CY.js.map4ߍg"x`OM ϼ100755 tr.d.tsDmrΨFFDҰb f100755 tr.jsUM-P9100755 tr.js.map3Ҧwvz%C100755 tt.d.ts2p-+U#\3jȧt{U100755 tt.jscn5Ҷ}m+100755 tt.js.mapC)i,ٝ2?`100755 twq.d.ts2p-+U#\3jȧt{U100755 twq.jsFҞraT,WrC1O100755 twq.js.mapL`LU/{0}?v100755 tzm.d.ts2p-+U#\3jȧt{U100755 tzm.js) 0ݯ100755 tzm.js.maplx1`Ϡ,H,I100755 ug.d.ts2p-+U#\3jȧt{U100755 ug.js:#^bE:{^/EN100755 ug.js.mapes4b輖g100755 uk.d.tsDmrΨFFDҰb f100755 uk.js FI$OSd`l100755 uk.js.map+,:}:u$)\9 t100755 und.d.tsDmrΨFFDҰb f100755 und.js)\m*g]4e100755 und.js.mapyB[c}t4S100755 ur-IN.d.tsDmrΨFFDҰb f100755 ur-IN.js+b l}=c9a100755 ur-IN.js.map1%8_U%100755 ur.d.tsDmrΨFFDҰb f100755 ur.jsGq<2ޗpS100755 ur.js.mapݲCa=100755 uz-Arab.d.ts2p-+U#\3jȧt{U100755 uz-Arab.js/+.rQ~G100755 uz-Arab.js.mapG\\ǫ9r'ݙVb100755 uz-Cyrl.d.ts~s'd`>N[100755 uz-Cyrl.jsaY:+kt͝- D-100755 uz-Cyrl.js.mapf ,#kݟ_F1-੯100755 uz-Latn.d.ts~s'd`>N[100755 uz-Latn.jsYBNso;8L0ͭ#100755 uz-Latn.js.map?݈lzJIќ"#!8100755 uz.d.ts~s'd`>N[100755 uz.jsF' ,wxu100755 uz.js.map9"u34exe:{100755 vai-Latn.d.ts2p-+U#\3jȧt{U100755 vai-Latn.jsZχ68dKBcprI100755 vai-Latn.js.map>WiGB@9߇100755 vai-Vaii.d.ts2p-+U#\3jȧt{U100755 vai-Vaii.js"-QMߺ100755 vai-Vaii.js.map9+ui2maǐen100755 vai.d.ts2p-+U#\3jȧt{U100755 vai.js1vnɭG;100755 vai.js.mapZf8%(p` {ڪ"100755 vi.d.tsDmrΨFFDҰb f100755 vi.jsQS.RQrvx7100755 vi.js.mapMʼ"qg-+"100755 vun.d.ts2p-+U#\3jȧt{U100755 vun.js TEGLGӕ100755 vun.js.mapiCQ*loG100755 wae.d.ts2p-+U#\3jȧt{U100755 wae.js ?OY=)o79100755 wae.js.map6'^D_rQ^ie100755 wo.d.ts2p-+U#\3jȧt{U100755 wo.js*YMI$!26100755 wo.js.mapj *)4100755 xh.d.ts2p-+U#\3jȧt{U100755 xh.jsGC],JYx=_100755 xh.js.map xQ*d -J100755 xog.d.ts2p-+U#\3jȧt{U100755 xog.js9B1hnXwEq+100755 xog.js.mapĈ@ ?Vՙ100755 yav.d.ts2p-+U#\3jȧt{U100755 yav.js!+ K1P XCs100755 yav.js.mapE488'”Ft͠100755 yi.d.ts2p-+U#\3jȧt{U100755 yi.js3.=+&zYK100755 yi.js.map%ӐZn$EW100755 yo-BJ.d.ts2p-+U#\3jȧt{U100755 yo-BJ.js:i9hlCu.100755 yo-BJ.js.map- [t9h|D100755 yo.d.ts2p-+U#\3jȧt{U100755 yo.jswݏ!E$"100755 yo.js.map (Vʴ"n100755 yrl-CO.d.ts~s'd`>N[100755 yrl-CO.js4x4t 100755 yrl-CO.js.mapÂZ~v0᝴Z)100755 yrl-VE.d.ts~s'd`>N[100755 yrl-VE.jsq[KK~ċ LV&w100755 yrl-VE.js.map,UxfmrϷe100755 yrl.d.ts~s'd`>N[100755 yrl.js0 }67i餸100755 yrl.js.map.et1A&100755 yue-Hans.d.ts~s'd`>N[100755 yue-Hans.js@aJ“kB ae100755 yue-Hans.js.mapKhQw@27100755 yue-Hant.d.ts~s'd`>N[100755 yue-Hant.js彐wA6.@9100755 yue-Hant.js.map&"+u:5r6I100755 yue.d.ts~s'd`>N[100755 yue.jsQ@]mJn#100755 yue.js.mapFZx9MS tՖA100755 zgh.d.ts2p-+U#\3jȧt{U100755 zgh.js$^!LZe>|=Wz100755 zgh.js.mapQ ~-t r';100755 zh-Hans-HK.d.tsDmrΨFFDҰb f100755 zh-Hans-HK.jsCtZ,Y`.GX100755 zh-Hans-HK.js.mappWj9䐎4D100755 zh-Hans-MO.d.tsDmrΨFFDҰb f100755 zh-Hans-MO.jsLyldq>100755 zh-Hans-MO.js.map9tMNQ+XO9gz5100755 zh-Hans-SG.d.tsDmrΨFFDҰb f100755 zh-Hans-SG.jsT 䶖3^ieG)ͭg {100755 zh-Hans-SG.js.mapK8 0dQ&q100755 zh-Hans.d.tsDmrΨFFDҰb f100755 zh-Hans.js8Qw3100755 zh-Hans.js.mapnCjuwE100755 zh-Hant-HK.d.ts~s'd`>N[100755 zh-Hant-HK.js΄^B5X):4b+100755 zh-Hant-HK.js.map- ^w胞(#Y100755 zh-Hant-MO.d.ts~s'd`>N[100755 zh-Hant-MO.js"4pnn5100755 zh-Hant-MO.js.mapB+ nu2!100755 zh-Hant.d.ts~s'd`>N[100755 zh-Hant.js?궇;:xiɭDM:H100755 zh-Hant.js.mapd2ůQg7t100755 zh.d.tsDmrΨFFDҰb f100755 zh.js숝Mn"q" 100755 zh.js.map/z{K#.;K6G100755 zu.d.tsm"ZB8/XZ9100755 zu.jsbW.?V,100755 zu.js.map;5aycaҳm"Zj% xO100755 af-NA.js] 'Ot9100755 af.jsՕkN~ًS4`100755 agq.jsgR'=Ñ帅(x100755 ak.js#UG >J!R100755 am.jsk M'H@xf٧100755 ar-AE.jsyW>5.^6|Ձ100755 ar-BH.jszT*Mjdr8C100755 ar-DJ.jsNlFʹ⭞100755 ar-DZ.jsK%f*҈]100755 ar-EG.jsGӼ_´Ta /100755 ar-EH.jsJ;WװX6_FHUK100755 ar-ER.jsAWDٙTC X!*100755 ar-IL.js6uTڴ{!VX֍5100755 ar-IQ.js5>ETqՀn@O100755 ar-JO.jsea?"#100755 ar-KM.jsA!qysRVFJB:$100755 ar-KW.js$Șk.oaŽP100755 ar-LB.js&S5)zQ@t100755 ar-LY.js6j%{APq=I6?w100755 ar-MA.jsC1Z%m򝐚sQa100755 ar-MR.js.;Fy/.1100755 ar-OM.js.YLSQ?Alp/100755 ar-PS.jsy-ˌ100755 ar-SY.js wt̮پKhJ100755 ar-TD.js⇰H0)^n>:0100755 ar-TN.js\6$ L|pU100755 ar-YE.js Y=}jz LN`100755 ar.jsh.Qp>d100755 as.js2&DY(֩s2100755 asa.js5WobJsIp $fϜ100755 ast.js-VqǗ}Idj'N100755 az-Cyrl.jsDAIJmyv%u=A ;100755 az-Latn.jsb-baI,'ӗ100755 az.js; *_s~100755 bas.jsL2(ScKث%100755 be-tarask.js?Q,r\K+2τ}100755 be.jsWW}~d_8pnG100755 bem.js&K /n/~sv'100755 bez.jsjn8 (RI L4100755 bg.jsixuJC$MO7HSIE100755 bm.js]!7'WL5'9|z100755 bn-IN.js{fZ"^ A `q100755 bn.jsIِюCB=_1100755 bo-IN.js}Ykw9!ul100755 bo.js9mA+jGqf100755 br.js- p*gkrlw100755 brx.js֋ a=% `>100755 bs-Cyrl.js1S8}ic(c) 100755 bs-Latn.jsR=R#o:ѩ100755 bs.jsx uBj6oH100755 ca-AD.js҂. SF ހHwJ100755 ca-ES-valencia.jsx>q/Y g !100755 ca-FR.js9xKf-@sA100755 ca-IT.jsyaU9>5d*GL100755 ca.jsv*ҊE8N*.} 100755 ccp-IN.jslg)|_RIRt100755 ccp.jsۻ #s1uSHl100755 ce.js/Ղߙ'7i7100755 ceb.js'1Fs1 x{>W100755 cgg.jsI<$E[w:2^100755 chr.jsmސR[3%\[100755 ckb-IR.jsw.dafGB100755 ckb.jsi8jzYMtWKD100755 cs.jst]XqGs3100755 cy.js3iTkD\+jg100755 da-GL.jsLן뭞3100755 da.js(tyF 9+KOJ100755 dav.js:n3]w[uXw˘?100755 de-AT.jsfUJwB#9=ڽX100755 de.jsJWu]74Y<uDb100755 dje.jsO O.)oO3i(100755 doi.jsbh|$yh100755 dsb.jsb5tBm(100755 dua.js {uQVXgs100755 en-AS.js@[ /b:1*&100755 en-AT.js>MС%toU9100755 en-BB.jsO痯J*˨n9100755 en-BE.js uSCg}#唡~L100755 en-BI.js[#"yT+GVH]rO100755 en-BM.jsVspֱ)Ǝ5s3T(X 100755 en-GB.jsʈU ]\찟)E100755 en-GD.js)\)d-,2)100755 en-GG.js ֊Ұ{%100755 en-GH.js>LP+!dO^fy100755 en-GI.js濒D4G$ ~100755 en-GM.js;P|/櫛Ќ`100755 en-GU.jsj*0w/'Xr~100755 en-GY.js}r-^҂&ay100755 en-HK.js6\UO6Gnp100755 en-IE.js  N=39SMZ a100755 en-IL.jsԨ6I\Yz100755 en-IM.jsĿ9qKOd,#QCr100755 en-IN.jsNwZd|3*r100755 en-IO.js~f^&6G}+100755 en-JE.jsPbQ7GIVO100755 en-JM.js'l 5_NI1I100755 en-KE.jsAAWt|-}`100755 en-KI.js~ HB'v100755 en-KN.js&8zw+100755 en-MG.jsDЋ^w⛠ t100755 en-MH.jsROOJӛvQ100755 en-MO.jsFJcz[;&&/b/100755 en-MP.js+o0xEK^@uR#100755 en-MS.js  H?100755 en-MT.js-"16B<4 t100755 en-MU.jsyCvD r100755 en-MV.jsZ<6p?100755 en-MW.jsv'P1HF Cz100755 en-MY.jsn:%Nbo&#[100755 en-NA.jsgWaMN֮g(?חs100755 en-NF.jsmmQN{(P{100755 en-NG.jsf."G(} OF100755 en-NL.jsCYLR]v)=100755 en-NR.js|eq>ԲhqӦf100755 en-NU.js Rj" pfbP100755 en-NZ.js?I9Dz4[[HPnG100755 en-PG.js?%X8WAˆ100755 en-PH.jsNjC5ʗh-24؞100755 en-PK.jsaĎǞD7F*so100755 en-PN.js[ܶ.7{o>s{u100755 en-PR.js/;5.$%_SH100755 en-PW.jsկkڿ$P100755 en-RW.js {V"z}100755 en-SZ.js&b4pNFs-Io100755 en-TC.js*#&wut5R3100755 en-TK.js+V]'w!BV+@100755 en-TO.jsc֞,Ք;100755 en-VC.js.6p򁁶^I}W100755 en-VG.js@P7e3-8ʧP100755 en-VI.jsPRmGU5:100755 en-VU.js Eb&JG100755 en-WS.js S|B b+)rxh100755 en-ZA.jsmV*YjyX@"*100755 en-ZM.jsOf?V@^!OD 100755 en-ZW.js%im 9'Ʃ#fS100755 en.jsqpy9ݾLf100755 eo.jsLɫ$n--Gw100755 es-419.js"b*+cNGzHb^Uˍ100755 es-AR.js}k󑺸2,2M100755 es-BO.jsփ[Kr:/=100755 es-BR.jsk ӬΙƧ100755 es-BZ.js Vj'=V\ –100755 es-CL.js@Ps+rв100755 es-CO.jsC7!"]Gm)100755 es-CR.js3YX^+%"h%100755 es-CU.jsx[$0!"6wՖBYo100755 es-DO.js.JDk,7/ T]h<~100755 es-EA.js &4`HRv4100755 es-EC.js yOCUnM˾LYb100755 es-GQ.js֍ J2Jd100755 es-GT.jsP \j:8)c#&100755 es-HN.js8Pj5J100755 es-IC.jsF:~zh 100755 es-MX.js޺+0x100755 es-NI.jsd'V} % 100755 es-PA.jsbb@a0QZ;100755 es-PE.js$n/҄/lxlՀ.F100755 es-PH.js*NЈ셻i$Y&+100755 es-PR.js;nFZ59a&X100755 es-PY.jsw@NbBĤ100755 es-SV.js0qwU$[100755 es-US.jsS.s؂n{o100755 es-UY.jsV,Ká^vkżWb100755 es-VE.js; E.n7Ƿ R100755 es.jsUpA?h100755 et.js)Vu.Zģ[] [100755 eu.js|Մ C! 9100755 ewo.js!I~ݶq˥100755 fa-AF.js'a<100755 fa.jsGRܘ-˩Ύ100755 ff-Adlm-BF.js&*.+\8m`Bs100755 ff-Adlm-CM.js9QS :pEp.100755 ff-Adlm-GH.jsa;.6K{?Q100755 ff-Adlm-GM.jsf !Ģ*^=6 100755 ff-Adlm-GW.jsT|6rv~~w100755 ff-Adlm-LR.js\t8ԞUG;B#100755 ff-Adlm-MR.js&} ht/ ͹]100755 ff-Adlm-NE.js::]0R z͌100755 ff-Adlm-NG.jszM[s  "100755 ff-Adlm-SL.jsM=$Su)s쪈100755 ff-Adlm-SN.js6_fLt`;Κ100755 ff-Adlm.js]xYgʄb쿐100755 ff-CM.js*_xҾ%G2100755 ff-GN.jsM)cXuB8lb100755 ff-Latn-BF.jsK`Xx㝽oU100755 ff-Latn-CM.js2r3n,0jݏ<{100755 ff-MR.jsARp<>)~9!o100755 ff.jsnPX^ љ7.v100755 fi.js^\ b%ǖ ^DW;;T100755 fil.js*&Z 팲˲100755 fo-DK.jstqOl4 Y3100755 fo.js's2l100755 fr-BE.jscJAފڷ~!W100755 fr-BF.jsQP.Ւ,lTALy100755 fr-BI.jsWl6100755 fr-CD.jsI?fHF,> V!dF100755 fr-CF.jsA Q$C#6UpJM100755 fr-CG.jsQF]"TOB. 100755 fr-CH.js f+a(Nˆ8+@'100755 fr-CI.jsJ Z!#3 x100755 fr-CM.js{[-ѪRe-%100755 fr-DJ.jsGE_9VPVu9Ճ100755 fr-DZ.js BN1pzӂnO4100755 fr-GA.jsϞр'1!?100755 fr-GF.jsMrMzxUp&T.100755 fr-GN.jsyS* ]go:Hrj100755 fr-GP.jss4tF`ڝ(\-100755 fr-GQ.jsD{G*?KߟĮ 100755 fr-HT.js$;XMa6Φ100755 fr-KM.js;¤H+r6-۸ʁkN100755 fr-LU.jsuM*LҌZ34u100755 fr-MA.jsJ+P)Dk7Mzbw100755 fr-MC.jsK l!哽p;z100755 fr-MF.js h^9RLsb֎jw100755 fr-MG.jshO^Z6Qߚ~V100755 fr-ML.jsL xT|t?100755 fr-MQ.js+h0湊0100755 fr-MR.jsEazDNJ17100755 fr-MU.jsv¾t,]BNO q100755 fr-NC.js ^X:)100755 fr-NE.js\_xe1֛34100755 fr-PF.js툡68%i}100755 fr-PM.js+4c+`o?H100755 fr-RE.jsfQ|Vp$+v\7b100755 fr-RW.js4(kcn\100755 fr-SC.jsD Qk,F;>cy100755 fr-TN.jsTŹgi)@s100755 fr-VU.js7'VG&6100755 fr-WF.js^rSZ^l8100755 fr-YT.jsn1s=O0`l100755 fr.jsbvEr2*Y 100755 fur.jsrm{UR̮\100755 fy.js"oa)@g`@:\=100755 ga-GB.jsguuq*PQ S9100755 ga.jsv}38;P 100755 gd.jsIc'_C7le100755 gl.jsLkzGzRFf I100755 gsw-FR.jsl0ШwSŽTص=100755 gsw-LI.jsa!RC Fq\mMK"100755 gsw.js 1HB3ڠ100755 gu.js Ks֫M*l.100755 guz.jsp5WwiKs100755 gv.jsd6OIwnV'100755 ha-GH.jsmn/XJ,er!mvǯVj]100755 ha-NE.jsp՞oS7100755 ha.js%wV*tLI100755 haw.jsY?F#C䱘ߚ100755 he.jsgL!+r1Abby100755 hi-Latn.js'MLMp;w8r+100755 hi.jsv)s$ޒdu&<LA100755 hr-BA.jsiݟЫ]100755 hr.jsqS:4yP*T100755 hsb.jsԾl j۶|U100755 hu.js%fIњ"cKyʤX100755 hy.js5JA.n|rve100755 ia.js\H^ <9N100755 id.jsV)a WG#100755 ig.jsSs4D7)8k100755 ii.jsSوQ^G? i$m\100755 is.jstA}.؛_.x(n100755 it-CH.jsC8  L }l100755 it-SM.jsl]@3=V~@?100755 it-VA.jsd\6x/Ϻ٤ kҩ100755 it.jsS35& w>f100755 ja.js6@W:~ B100755 jgo.js6v9/0ī#\W|100755 jmc.jsAf{g_100755 jv.jsB$&Ц+100755 ka.js_\m\qle100755 kab.jsD{n#100755 kam.jsqo*𶨱k:100755 kde.jsš;B ߂̄100755 kea.jsuRionf100755 kgp.jsPb`REx$100755 khq.jsa |VvQ06%100755 ki.js~@;[}GۗFwquL 100755 kk.jsp:㿑=S0AY100755 kkj.jsJT\0"65100755 kl.jsWlwҫYA1Wg100755 kln.js%]\(w100755 km.js8;lK֠t`100755 kn.jsǯ܍kk= W`Q100755 ko-KP.jsݼ:8a2誯&֣f100755 ko.jsW Ez.ugbᴉ)100755 kok.js=#Nد IL)p&100755 ks-Arab.jsR7<ޒGb100755 ks-Deva.js)IAr MQT1100755 ks.jsY~lZXϟCA100755 ksb.js ${93>40ȅYI100755 ksf.js6Rs+S|[Zqo100755 ksh.jsAkcm;_j׆\100755 ku.js\ 9j "*ݛ100755 kw.jsNM&S-,)100755 ky.jsngWaC]v|100755 lag.js&S=?Lz6^.e100755 lb.js),.:XR#l100755 lg.js%q{[)*tQ-y100755 lkt.jso-{ g:,lwו5100755 mai.jsyw=67Ȼ100755 mas-TZ.jsk@- iy^p100755 mas.js5gz100755 mer.jsN{AF3hFzc100755 mfe.jsp-[l i100755 mg.jsh$dE]a5CR100755 mgh.jsɿ1OwvxU=,/100755 mgo.js =nA lDEQѭ100755 mi.js85)"P100755 mk.js;n6FKߑ;i9W100755 ml.jsޅ0dW100755 mn.jsDC;iیg.F100755 mni-Beng.jsNF@tl!+100755 mni.js9-=kC+Tj100755 mr.js?Yn+SM""100755 ms-BN.js i4]ި 100755 ms-ID.js+*ʥ+)~j100755 ms-SG.jsׇQUkp<^rɋP100755 ms.jsB/b+74 Htr1V%100755 mt.js [D5/ 6100755 mua.js4z8Fy 100755 my.js`zW3gw100755 mzn.jsZ];C?^X100755 naq.js9 G':bp100755 nb-SJ.js3"jLg100755 nb.jslJXYe100755 nd.jsɼ:l{q*}c100755 nds-NL.jswQhƷ)Z%LUC100755 nds.js)d׃L^*y100755 ne-IN.js.K'KC8Ě -100755 ne.js@4T6 }9q100755 nl-AW.jṡWuX*>100755 nl-BE.jsB! ݹum100755 nl-BQ.jsXLQ1=`^{100755 nl-CW.js~"ˁJ3u3g1i100755 nl-SR.js\Д49˥2ҥ100755 nl-SX.js x쓪)C責100755 nl.jsb8w EAy-100755 nmg.jsjy%{ p8fJ100755 nn.jsʝ~ gxx100755 nnh.js|d=/ K: k1100755 no.js~ϴ2yXp1}CR 100755 nus.js|H^ꔹay100755 saq.js?5v?k100755 sat-Olck.jsN!S;(GG.)100755 sat.jsgm4BXМI100755 sbp.jsTj{;_ ǓY100755 sc.jsuҗ-a,8=x2100755 sd-Arab.jsѐ#%<oȨ+1_100755 sd-Deva.jsڤ2"7dbHX100755 sd.js2Xj }VyiLh100755 se-FI.js7`-Z7`qsQb100755 se-SE.js"PI/{ [F#100755 se.jsGM'{+`ā'C100755 seh.js9n|sBYγÑmAa?100755 ses.jsj,K^ bZC100755 sg.jstRJ)'0Nk>x)Ј2FI100755 so-KE.jsuu%;\/W100755 so.jsW3 BP6a|#@100755 sq-MK.js|TE饦Q9Iv100755 sq-XK.js3kwI#_lo5"S100755 sq.jsc<`cc8@p100755 sr-Cyrl-BA.jsESJf-7цO100755 sr-Cyrl-ME.jssy!h%}R100755 sr-Cyrl-XK.js @fFfd2R 100755 sr-Cyrl.jsmbs6100755 sr-Latn-BA.js$\ɢ\ {`@kk* 100755 sr-Latn-ME.js"yOJɩ100755 sr-Latn-XK.jsz7/dz)100755 sr-Latn.jsL|mޱ"ci100755 sr.jsƷןP^& 100755 su-Latn.js;ȗC!tTN100755 su.js¼\zƎ_P100755 sv-AX.js@93xgߒ<100755 sv-FI.jsOFH|$|U 100755 sv.jsQ.KL@tI.100755 sw-CD.jsq@;= @[j100755 sw-KE.js|gٙjHό0ۨ100755 sw-UG.jsF(̩Ny|L7100755 tr.jsB @ آu7100755 tt.js; ӭB? 5100755 twq.jsX,wC&a:W}\s100755 tzm.jseX9x&h %100755 ug.js'rD|EÆ,'P/Vv100755 uk.jsG+uYY CF<100755 und.js T{܎}}E1100755 ur-IN.jsťW100755 ur.jshTnDMO100755 uz-Arab.js !f(ƴ~: .m100755 uz-Cyrl.jsvG?r82V ϻN100755 uz-Latn.jsȻNbUN;{+100755 uz.js*S%| lc*100755 vai-Latn.jsP1( {F7H:100755 vai-Vaii.jstpqn(>-\W'RO Q100755 vai.jsP4l؎ڎ7)0r8100755 vi.jsmC whMqIp100755 vun.js CnEGs<ۿk۪100755 wae.js;Xws-9U100755 wo.jsc*Ll K yěk100755 xh.js}Nj2[q1*n100755 xog.js$gSB I:kl Ȅ100755 yav.jsx r`W/v;a100755 yi.js($6  p^ޟ100755 yo-BJ.js{m)ƀ\*4ǧq100755 yo.jsp a\*.|='|`100755 yrl-CO.jsR!r@05pWn 100755 yrl-VE.js_a6&hQ#Ӱ100755 yrl.js `M.TP[100755 yue-Hans.js{c"9)5wBԎAj100755 yue-Hant.jscZd8GB. '100755 yue.jsM|R^'YLjl[!100755 zgh.jsL0*!ړ100755 zh-Hans-HK.jspe<WHn_O100755 zh-Hans-MO.js|( ՚ڱS#100755 zh-Hans-SG.js!0k_;ucޮ{чp100755 zh-Hans.js"(FJ."TO"r100755 zh-Hant-HK.jsp7=F+Y8_[3|J100755 zh-Hant-MO.jsX[i}E,y,dx&100755 index.d.ts[yF NSejW0x&100755 index.d.tsgz%WR>5HH#x2100755 LICENSEH)ecPۨ100755 README.md}Z7 A;g46100755 event-dispatch-contract.min.jsx쥀諄07B'100755 event_dispatcher.d-K56StcHr.d.tsE.|?}40000 fesm2022m|dOQ100755 index.d.ts"fMni럵F100755 navigation_types.d-fAxd92YV.d.ts F .z8kC100755 package.json|/YoRl7s100755 untracked-BKcld_ew.mjs.mapMC\:ꋤcf~b9Θx100755 di.mjs8]~jtjb100755 di.mjs.map~k116*5jJʐO100755 event-dispatch.mjsN>M7T2nJ100755 event-dispatch.mjs.mapB cmoDF100755 signals.mjs ϳUW3ѝ& Ci100755 signals.mjs.map!($/ hJ@/2c xh40000 di.xk!Tv72e740000 event-dispatchF્UVHFye340000 signals2zS%~yrek>,x&100755 index.d.tsҔ|szQ`4x&100755 index.d.tsaŁkVMB.y>U@x&100755 index.d.ts(J|h"=/}DF0\Sx&100755 index.d.tsw~!f%_ s+4 xa40000 bundles9X!bw[&U';K100755 collection.json&'pP~{eBΟ 100755 migrations.json @7?`Rj%40000 ng-generate?y &ρ9,,cH lpf0x/40000 cleanup-unused-importsݕY qtJpf'_Z40000 control-flow-migration鳞)D²tRy40000 inject-migrationw3(fV{1e40000 output-migrationMmAy1؞v40000 route-lazy-loadingqsLvA͔gZG 40000 self-closing-tags-migrationm}g txf40000 signal-input-migration)ïØ#B"7$40000 signal-queries-migrationSVmi(.U40000 signals B:0M`b40000 standalone-migration'(mpNTƠx'100755 schema.json,@DWՇ0z~x'100755 schema.json褝HPupOTTwt/x'100755 schema.json^sM9Up}x'100755 schema.jsonmيm۳ x'100755 schema.jsonYY|5}4(`f!Q<* x'100755 schema.jsonϐpURE)ϧx'100755 schema.jsonN-uwcꃹnQx'100755 schema.json0P12?T?Hyzozx'100755 schema.json;rp0wќct{ۦOx'100755 schema.jsonNֹ3Ba4/Цx&100755 index.d.tsX1 *أNj$ffWx"40000 prismjs#k$㪳dx100644 LICENSEz&{$Q{+%z100644 README.mdEu2CH100644 components.d.ts100644 prism-al.min.jsQR0'*100644 prism-antlr4.jsFmcGNCP3ک:100644 prism-antlr4.min.js5-keκ 100644 prism-apacheconf.jsG8j]%O$'100644 prism-apacheconf.min.jsJ{ Nb100644 prism-apex.js۷iG7ovc100644 prism-apex.min.js .^ 100644 prism-aql.jsB̩nO8xJcE100644 prism-aql.min.jsYrQƔ) h100644 prism-arduino.js XIo VZ=100644 prism-arduino.min.js,u#btg6ikd100644 prism-arff.jsj6kU=: ׬e¥!UH100644 prism-armasm.js2!VqYa7]Vp100644 prism-armasm.min.jsbI20ﶛ>100644 prism-arturo.jsЛ^'\ʦ(TSKq100644 prism-arturo.min.js{ kng&y,100644 prism-asciidoc.js9unq+07U0{j#w100644 prism-asciidoc.min.jslLd`S\9{  100644 prism-asm6502.js/X6O~FNtl1p100644 prism-asm6502.min.js%\8]qP}=8)100644 prism-asmatmel.jsS.8S&arQ^E|100644 prism-asmatmel.min.jspdrH"3100644 prism-aspnet.jsH[/QP׵uњ100644 prism-aspnet.min.jsYߩI(WIF'W100644 prism-autohotkey.jshTlQK X~100644 prism-autohotkey.min.jsyjO3RN+υ[100644 prism-autoit.jsevPO "S.S100644 prism-autoit.min.js2& $w<-ׅ100644 prism-avisynth.js$듽*{&4if| %100644 prism-avisynth.min.jstE} < 3&wx100644 prism-avro-idl.js58o-жjm=9q|So100644 prism-avro-idl.min.js4#Q5ѐξMZ:{v100644 prism-awk.jsd,4 cA%*100644 prism-awk.min.jsĉ%ɉttx e)100644 prism-bash.jsm.8µ J"~Z1100644 prism-bash.min.jse;5V =100644 prism-basic.js*.JM Lˍ iM H100644 prism-basic.min.js4ZgAl100644 prism-batch.js@W1H~4 P"^100644 prism-batch.min.jsoǢ!"aO^&_100644 prism-bbcode.js^>-T6_9100644 prism-bbcode.min.jsL05? 4P%100644 prism-bbj.js@2CgA1W&Y100644 prism-bbj.min.jsJ9Vg)/ͽ100644 prism-bicep.jsr jpf.,645@X100644 prism-bicep.min.js:{ZTɃU8}Fkm100644 prism-birb.jsM]V $@Wtm100644 prism-birb.min.jsy͛oujbK100644 prism-bison.js֛fq\mܠqV[100644 prism-bison.min.jsU5qx#2O`u100644 prism-bnf.js߾9slL`HSR100644 prism-bnf.min.js2JИV5ec r&/100644 prism-bqn.js[į'O;%100644 prism-bqn.min.js:fUչԏUWx100644 prism-brainfuck.js?Q4Yo100644 prism-brainfuck.min.jsK<(cr100644 prism-brightscript.js^UɟxԶ:100644 prism-brightscript.min.js9 Uc'܊:f^X100644 prism-cilkcpp.min.js_rjPڼ_v(z5100644 prism-clike.js]kF c"-~100644 prism-clike.min.jszFduw),100644 prism-clojure.jsVfQ7× !8$X100644 prism-clojure.min.js`}iLkcu<Ä100644 prism-cmake.jsKqGf,cN٥_ՈªFu100644 prism-coq.min.jsO'uě,100644 prism-core.js"up\z&100644 prism-core.min.jsI @xcj@8jT100644 prism-cpp.js ݜU CGl100644 prism-cpp.min.js6L5ɥA100644 prism-crystal.js:;3#9PhW100644 prism-crystal.min.js\.YkJ[Ȳ D@100644 prism-csharp.js$1q~N* C 100644 prism-csharp.min.jsE kvm$_R100644 prism-cshtml.jsFCq =[6`100644 prism-cshtml.min.js.Zs"Vf w100644 prism-csp.js0j{4T7@ 100644 prism-csp.min.js23hנ_#s2100644 prism-css-extras.js٣T+F0ly100644 prism-css-extras.min.js Gi,7>}9\=100644 prism-css.jsF<4ϰitr90Le100644 prism-css.min.js:b@p[C 100644 prism-csv.jsQh<$G6Z(/v100644 prism-csv.min.js%iS7ن100644 prism-dataweave.jsR^Y\ۆ*_100644 prism-dataweave.min.jshgF`*r|100644 prism-dax.js_\']u}[100644 prism-dax.min.js'a`y 2e100644 prism-dhall.jsif.`" P_B&C100644 prism-docker.min.jsV"ph_KWh100644 prism-dot.js;[QPI8.ū100644 prism-dot.min.jsj$-4\J!hA#100644 prism-ebnf.js*C,쌰+D u100644 prism-ebnf.min.js4W.:]Z}^ 100644 prism-editorconfig.js){iԼ㼞i-(0100644 prism-editorconfig.min.jsٍh]aQpvd100644 prism-eiffel.jsΝ.skWR!b%"100644 prism-eiffel.min.jsQ<۹*DIpї-a100644 prism-ejs.jsY F#Yq@ -.Dp100644 prism-ejs.min.js۫yfEn[?100644 prism-elixir.js#'@ :SuN'100644 prism-elixir.min.js腹4#BEf4fg100644 prism-elm.js\U njEW'S/100644 prism-elm.min.jshYpse0O100644 prism-erb.js!|"ԡm>)100644 prism-erb.min.jsK؛FJ+l100644 prism-erlang.js̹* Y-100644 prism-erlang.min.jsm jÜf'100644 prism-etlua.jsa +TYuFl%100644 prism-etlua.min.jsCHEmLWk:100644 prism-excel-formula.js走1Fێ( N100644 prism-excel-formula.min.jsB-}r{d100644 prism-factor.js:s)JCm100644 prism-factor.min.js79^Řid[ 100644 prism-false.jsICW9 WG_|100644 prism-false.min.jsS=VF!Q (aa100644 prism-gap.min.jse.uM|uic%V100644 prism-gcode.jsǘiN(M /J100644 prism-gcode.min.jsTFMA%:ѯUa100644 prism-gdscript.js+AU$tQ100644 prism-gdscript.min.js饢2|>}BJ[;V6100644 prism-gedcom.js gqDQH;1EL!100644 prism-gedcom.min.jsoPl)}J100644 prism-gettext.jsYHEq6'[`100644 prism-gettext.min.jsBI!6=\.100644 prism-gherkin.js ,4\m1>!jz100644 prism-gherkin.min.js=rdw~[JS100644 prism-git.js6Z\w֖2CSa100644 prism-git.min.jsrf`aW#5-?T100644 prism-glsl.jsyEsa'100644 prism-glsl.min.jse[ M^'100644 prism-gml.jsc<*VVص[100644 prism-gml.min.jsBu%˯;`y=)100644 prism-gn.js_?nmW6ܿ#$100644 prism-groovy.jsR8CTtϷ9100644 prism-groovy.min.js"BV{ uݯ100644 prism-haml.js7`;eMuR+A100644 prism-haml.min.js{p".^c"v'100644 prism-handlebars.js\ǖ ϵd6_t100644 prism-handlebars.min.js{cE7KogC4f100644 prism-haskell.jsp{!~X6ɱ 100644 prism-haskell.min.jsGS~P44IBKW-100644 prism-haxe.js"rzX'Hy100644 prism-haxe.min.jsd/px100644 prism-hcl.jsFf!gkFm@Qr100644 prism-hcl.min.js.Щޯ҇ag L$100644 prism-hlsl.js=фMHFy%xgtI100644 prism-hlsl.min.js6Gx v[d)100644 prism-hoon.jsWpʱMoHT#ں100644 prism-hoon.min.jsHGrKnUͅ@100644 prism-hpkp.js[PdE?t`a100644 prism-hpkp.min.jsP`1X:\OÀ100644 prism-hsts.js'j7+CR3$$ {100644 prism-hsts.min.js? +!+27[100644 prism-http.jsNy$E*)wi5 [100644 prism-http.min.js{qТ]:[kΛWi100644 prism-ichigojam.js-G_CPu6\100644 prism-ichigojam.min.jsD]-6'oE:dX100644 prism-icon.jsJb y 9b100644 prism-icon.min.jsɰ-G:0t100644 prism-icu-message-format.js /^mn^ r|$*~100644 prism-icu-message-format.min.jsA&wѭ 2cyyH100644 prism-idris.js7:Z#NYjrt$100644 prism-idris.min.js^+'6`Z1100644 prism-iecst.js>ʈSZ=g 100644 prism-iecst.min.js'1UˍL7)100644 prism-ignore.js,fP!:qT}-100644 prism-ignore.min.jsjUHY`!wj100644 prism-inform7.jscץ=W鴰:100644 prism-inform7.min.jsUv100644 prism-ini.jsJ@ J$%UdEA7f100644 prism-ini.min.js~釽+NM#-w100644 prism-io.js;,uG"ޞo100644 prism-io.min.jsas.e,p100644 prism-j.jsj+rϊSf013Zfbh100644 prism-j.min.jsyKܖJ)ua100644 prism-java.js1T#(=j100644 prism-java.min.js<z5^ޮjJv100644 prism-javadoc.jsjy#T.^100644 prism-javadoc.min.js?)Si&:{h100644 prism-javadoclike.js},JhH}rQM100644 prism-javadoclike.min.jsBԑ'tXLe 100644 prism-javascript.js~larl͡'~r100644 prism-javascript.min.js"),As1*Mv9o100644 prism-javastacktrace.jș}[2֡,鲆100644 prism-javastacktrace.min.js YIƝӧg0^100644 prism-jexl.jsbh**xODqHA100644 prism-jexl.min.js7 >7.\\,_100644 prism-jolie.jskTdrzzٝ100644 prism-jolie.min.jsϥ ; $=K100644 prism-jq.js<0/2_Gωp100644 prism-jq.min.js}Pkau*2\100644 prism-js-extras.jsdů|9#@^s100644 prism-js-extras.min.js505rudy7100644 prism-js-templates.jsblnbvr- (100644 prism-js-templates.min.jsv!Y^MX @n100644 prism-jsdoc.js>S-#|p100644 prism-jsdoc.min.jss,9MC;EQv100644 prism-json.jsQxG44100644 prism-json.min.jsBV aYh#+100644 prism-json5.jsm]~{`J|100644 prism-json5.min.js5фb$'nv쨗100644 prism-jsonp.jsl2$ؼ\7 100644 prism-jsonp.min.js꾶&ztrt100644 prism-jsstacktrace.jsimF@(~]S100644 prism-jsstacktrace.min.js2Vvr}G|~s100644 prism-jsx.jsl-d$:)ȡY~jN100644 prism-jsx.min.js6/R pOr&100644 prism-julia.jsP,C1Gu]100644 prism-julia.min.jsw$XE5!EYEG &100644 prism-keepalived.jspD(vc100644 prism-keepalived.min.jsH)vKXq),[100644 prism-keyman.js.;+#A1jP)100644 prism-keyman.min.jsIhӿ5APؤ100644 prism-kotlin.js;EܿWv`r100644 prism-kotlin.min.jsxq"Tun1U100644 prism-kumir.jsgtgikU100644 prism-kumir.min.js:M;(0QzջC100644 prism-kusto.jsɼzLX]7g100644 prism-kusto.min.jsxe<辻} L100644 prism-latex.js#aF˃Mt100644 prism-latex.min.js8Psb6 I~6U100644 prism-latte.js݇z##^wwtx100644 prism-latte.min.js=160h|OM7100644 prism-less.js~;81")100644 prism-less.min.jsf}\wETNJ#100644 prism-lilypond.jsZL^DC'jkY4M100644 prism-lilypond.min.js [d-U4@G22100644 prism-linker-script.jsz Vהєy*kX100644 prism-linker-script.min.jsCʴIlT 100644 prism-liquid.js1t4iUK t 100644 prism-liquid.min.js)YT&jQ 100644 prism-lisp.js9/޲~ִޜ`-100644 prism-lisp.min.jsfK7gEVNx$100644 prism-livescript.js|f 8 9SK W100644 prism-livescript.min.js9r4PW7 H100644 prism-llvm.js竅\ѱNɃ 100644 prism-llvm.min.js<|檯"n(r100644 prism-log.jsMpW+r<]ɡ100644 prism-log.min.js;uR0'WN5)`100644 prism-lolcode.jsGy xeй%J100644 prism-lolcode.min.js=*jE4Qk&t100644 prism-lua.jsj9 7100644 prism-lua.min.js͔}Hw/T100644 prism-magma.jsI,!c^W&100644 prism-magma.min.jswCma~0c#gx100644 prism-makefile.jsd;UH!'X3b100644 prism-makefile.min.jsCx/B^Du3T׻100644 prism-markdown.jsCYg~100644 prism-markdown.min.js+Q_ F]100644 prism-markup-templating.js(UYb/ vU100644 prism-markup-templating.min.js:1_ ;Y100644 prism-markup.jsebK55%˓)Y100644 prism-markup.min.jsӚB/ؔ рO7|100644 prism-mata.jsj8r<-ÅvjDC|100644 prism-mata.min.js |gvbyN8-@\100644 prism-matlab.js̥Yuy{u9 qknrq100644 prism-matlab.min.jsө=+100644 prism-maxscript.js +!5 O\N(* 100644 prism-maxscript.min.jsK5y^v &[/q,100644 prism-mel.jsY&gERɳILQ$$100644 prism-mel.min.jsh TFA1100644 prism-mermaid.jsIPW*N]$m:100644 prism-mermaid.min.jsKCP)tGjy^100644 prism-metafont.jsPK}ԪUVӠt&-100644 prism-metafont.min.jsK˹7JJ+6100644 prism-mizar.jsES^=:%100644 prism-mizar.min.js8);aܥè^4i100644 prism-mongodb.jsN3zbj100644 prism-mongodb.min.js M@DnО100644 prism-monkey.jsŷ$wp#w100644 prism-monkey.min.jsY PQ ɺWJ$3B100644 prism-moonscript.js#14%SO,|100644 prism-moonscript.min.js?;Q׋l_%100644 prism-n1ql.js fAa{"ipb+100644 prism-n1ql.min.js$1Cb-< 9~7100755 prism-n4js.jsm?m4hJp100755 prism-n4js.min.js\ppyh100644 prism-nand2tetris-hdl.js)O)O'0dՈm8A100644 prism-nand2tetris-hdl.min.js߽GvM(Be100644 prism-naniscript.js̎K-4 l<}ޥGg100644 prism-naniscript.min.js]rWК{PǗ100644 prism-nasm.jsFq9b~Кv,⻯K100644 prism-nasm.min.js닭dww׌g100644 prism-neon.js}IEVٕLFM100644 prism-neon.min.jsWԞ100644 prism-nevod.js|L'H^100644 prism-nevod.min.jsMe'y|CbAl}100644 prism-nix.jsjv i%E|Y100644 prism-nix.min.js \vxm};v100644 prism-nsis.jsuZ0b8ͻg—100644 prism-nsis.min.jsq l;~i >\100644 prism-objectivec.js5I nME100644 prism-objectivec.min.js)sLq6<100644 prism-ocaml.js/; Y?)q"ٷFI100644 prism-ocaml.min.jsDz֓w!9}6U100644 prism-odin.js9 u5X,"!?100644 prism-odin.min.jsZp_?hHݒq2100644 prism-opencl.jsޅo0o mm100644 prism-opencl.min.jsLCi/!Svgw߼100644 prism-openqasm.js&PP,}E100644 prism-openqasm.min.js EÞܚ`)=b100644 prism-oz.js%͈ 䁲l100644 prism-oz.min.jsE&*yi).~`~100644 prism-parigp.jsIEGx:;dn z100644 prism-parigp.min.jsnO~HFvC7100644 prism-parser.jswq:ډE/6ʡ@*Tl100644 prism-parser.min.jsz¥W0cEUe100644 prism-pascal.js/\53'p 100644 prism-pascal.min.js?!i?Jޜ\|100644 prism-pascaligo.js~{%EIГE100644 prism-pascaligo.min.js4yG🆿100644 prism-pcaxis.jsZa"e?Sy>}100644 prism-pcaxis.min.jsNohc Eo3\uZ100644 prism-peoplecode.js A!bE3P<> K100644 prism-peoplecode.min.js'SOR100644 prism-perl.jsfA 3+Lp9W100644 prism-perl.min.jsqzت_100644 prism-php-extras.js*b TWkE{V6S100644 prism-php-extras.min.jsPj,!׭וhv)@100644 prism-php.jsyڳ_R,~jyQ3B100644 prism-php.min.jsJBpP{ng100644 prism-phpdoc.jswڪFyr^ ƋP100644 prism-phpdoc.min.jsk {q1$0)w100644 prism-plant-uml.jsp#EV߸^БZ100644 prism-plant-uml.min.js^6w*$Y(100644 prism-plsql.js{܅ŏ-3-E100644 prism-plsql.min.jshVUˣH03i100644 prism-powerquery.jsQ"fj4nE100644 prism-powerquery.min.js}w0Y}S6K100644 prism-powershell.jsS&.7w4fA:100644 prism-powershell.min.jsD.pA0w<100644 prism-processing.jsnfos^u100644 prism-processing.min.jsl׫VDKUF3100644 prism-prolog.js B;D6N.6100644 prism-prolog.min.jsS/hA%)BՊ100644 prism-promql.js/snzvIX9E{g̨100644 prism-promql.min.jsF%<2cehل&l-100644 prism-properties.jsO+ۛĠ6i100644 prism-properties.min.jsYvvV! B100644 prism-protobuf.jsWMaFaŐ$100644 prism-protobuf.min.jsǟF2}=~+0 100644 prism-psl.jszO6۴,qW\Жc 100644 prism-psl.min.js(d횆w' EH70100644 prism-pug.js ^}ə:m-α100644 prism-pug.min.js&R&_) Qr9100644 prism-puppet.js Ϳ/Zn!H100644 prism-puppet.min.jsk5B>OϽmk5ӑe100644 prism-pure.js:fAsX=F+ G }100644 prism-pure.min.js܅" ݘn!g4100644 prism-purebasic.js-IF?7.MAxp0_i100644 prism-purebasic.min.js˟igBvZ |100644 prism-rescript.js}dKގZ18100644 prism-rescript.min.js]foC ų#>ӁYe100644 prism-rest.jsO?l1:ĺ@NR&100644 prism-rest.min.js(ѿClH֮9$LC«100644 prism-rip.jsWK-#Z/d100644 prism-rip.min.jsB_vt~oբ F100644 prism-roboconf.jsX) GQ_M100644 prism-roboconf.min.js- I` :r6* 100644 prism-robotframework.js4Ru+yY唁.100644 prism-robotframework.min.js9QO8j]100644 prism-ruby.jsy%mϊKcQ9#a݁100644 prism-ruby.min.js|[*`0T9ȉ100644 prism-rust.js3`6|V4ʕqV100644 prism-rust.min.js|t/ B T4">100644 prism-sas.jso7̀6}7N90100644 prism-sas.min.jsÛɝ PPm100644 prism-sass.jsKlJ =cl4g8D100644 prism-sass.min.jsoJmαAI }x100644 prism-scala.js/.kPO?aClYR100644 prism-scala.min.jsV:g>*qi100644 prism-scheme.js$ /g(7 100644 prism-scheme.min.js*E=S)b5nw$NE100644 prism-scss.js 'aqqO .wj100644 prism-scss.min.jsaivQrX%3+H100644 prism-shell-session.jsgv}Q:GnO100644 prism-shell-session.min.jsG =ܒI.x.T100644 prism-smali.js=~aZ@<)*#f100644 prism-smali.min.jswkz ℟2O E100644 prism-smalltalk.js.vR$b0;^2~o'|Fd100644 prism-smalltalk.min.js2eK],ߴS@100644 prism-smarty.js=M>+i6100644 prism-smarty.min.js9wDfz~iaߛo100644 prism-sml.js}< rN39ĄRMF100644 prism-sml.min.jsaR ߝqs.2OV100644 prism-solidity.jss" a100644 prism-solidity.min.jsOA<< }~ 100644 prism-solution-file.jsxe_Gk100644 prism-solution-file.min.js1UG {n8o100644 prism-soy.jsTLa?;j%7u0x100644 prism-soy.min.js݀q n Ą[>}U100644 prism-sparql.js7 OL@/ 100644 prism-sparql.min.jsZ|kd*m)OjD 100644 prism-splunk-spl.js^/^(5 %G100644 prism-splunk-spl.min.js$m7#:e100644 prism-sqf.jsX=#/r9A8R100644 prism-sqf.min.js1ڋm^3Y100644 prism-sql.js D#]5100644 prism-sql.min.js%kOb˿&<6G%i-! p100644 prism-squirrel.jsc<]/ ZK6a;"100644 prism-squirrel.min.js_e C7؞VJ>!vj100644 prism-stan.jsʲݠ#~o* 100644 prism-stan.min.js]#`MN5 ÝY"100644 prism-stata.jsWleP;Zv0100644 prism-stata.min.js̿ KJ h*PYp100644 prism-stylus.js>qF K㥖h^q100644 prism-stylus.min.jsh-(TBPZ=*R100644 prism-supercollider.jsAwZzS #100644 prism-supercollider.min.jsR7gp^=a> 100644 prism-swift.js/nn_CLE}͔jʟL100644 prism-swift.min.jsF7{+Vq+,100644 prism-systemd.js@ MEP.Qk100644 prism-systemd.min.js%g/ܑl@d/P_100644 prism-t4-cs.jsῘc&,nLcxK100644 prism-t4-cs.min.js'nhv/ 100644 prism-t4-templating.jsn&䁫100644 prism-t4-templating.min.js6[I!3|kNj%100644 prism-t4-vb.jsuqcΔIS.a]6100644 prism-t4-vb.min.js#ݭQVG{M100644 prism-tap.js{%S`k100644 prism-tap.min.jseX[5ן&c kG100644 prism-tcl.js50XҹP d100644 prism-tcl.min.js'Š1:100644 prism-textile.js Wihw#;~100644 prism-textile.min.js^eH.*艙M100644 prism-toml.js^ fgJN8R2h~<100644 prism-toml.min.js |޳100644 prism-turtle.min.jsWmEjHywp A,m100644 prism-twig.jsYD-DTMtqs1100644 prism-twig.min.jsZdRPw a8Q3&n100644 prism-typescript.jsCq:7zˤq#_*Ls ?100644 prism-typescript.min.jsaq&Vmn30#>100644 prism-typoscript.jsAnݳ]{u ˡ~#100644 prism-typoscript.min.js;_⺝100644 prism-unrealscript.js7w]-9}e/&rR3100644 prism-unrealscript.min.js= ]a8100644 prism-uorazor.jsxnY'lkv95YK100644 prism-uorazor.min.js|}$w_rIDߓ{100644 prism-uri.jsX1;/MQ9100644 prism-uri.min.jsG+3b۷1Ki100644 prism-v.jso=kC4+100644 prism-v.min.js ZJVIK(:^Q100644 prism-vala.jseY#R 0F=X100644 prism-vala.min.jsku:U,F.0100644 prism-vbnet.js༑@E'WR,100644 prism-vbnet.min.jsM ;!100644 prism-velocity.js$/ʯ?"+100644 prism-velocity.min.jsVaQ2"S+100644 prism-verilog.jsQv,beȦ 100644 prism-verilog.min.js(R Ō%MWȯE9100644 prism-vhdl.jst&,'N9f100644 prism-vhdl.min.jsg= G]Y3h)100644 prism-vim.jsp7QYEm0_tny100644 prism-vim.min.jse&;pee[100644 prism-visual-basic.js +o4N_:$@ 100644 prism-visual-basic.min.jsыoR WUU4&~100644 prism-warpscript.jsD?I돩100644 prism-warpscript.min.jslJmtP3) z8100644 prism-wasm.jsG w=ݤV5E100644 prism-wasm.min.js*_GjhD+100644 prism-web-idl.jsȒ-F^_ 3100644 prism-web-idl.min.js.Ǜs,100644 prism-wgsl.jshqЫیE{100644 prism-wgsl.min.jsӷn(MvZ100644 prism-wiki.jsrˁ p5Hw$(100644 prism-wiki.min.jsAvM3[ !o100644 prism-wolfram.jsˎlo<:ݹ100644 prism-wolfram.min.jsWۑ*I VPN.100644 prism-wren.js40000 command-line1"~xv;6K40000 copy-to-clipboardh40000 download-button7l>$VhImX40000 file-highlightCo &$ s40000 filter-highlight-allvCⓠ K1T3>+40000 highlight-keywordswxv4K1 40000 inline-color)Ht},_JͅVt140000 jsonp-highlightF} USFEY{40000 keep-markupp`rde,ZEC]A 40000 line-highlight ' Q'^ D40000 line-numbers}k399jyw" 40000 match-bracesߑ83]@qs.<40000 normalize-whitespace`.i ,xd2?j40000 previewers yP D6 $f"440000 remove-initial-line-feed*XޔLJq3g40000 show-invisibles` m5 ,wC340000 show-languageFTn40000 toolbar]}ŹžEc (40000 treeviewA`_qy7&gC=w40000 unescaped-markupU JרIM40000 wpduԞRQ2ev x9100644 prism-autolinker.cssc $R1®S100644 prism-autolinker.jsS.*ܓS+<@N.xRs100644 prism-autolinker.min.css?~aC.V%Hxd100644 prism-keep-markup.js:A(:Z=5k100644 prism-line-highlight.min.jseCi,8GH0{f*Qٮ x1100644 prism-line-numbers.cssWpSW|gM3Y03@D100644 prism-line-numbers.jsq趖:0I#~100644 prism-line-numbers.min.csspFpZɤye>@100644 prism-line-numbers.min.jsvN[ˎɅEK>100644 prism-show-invisibles.min.jsb̔{4Nx{Ud'KVnxh100644 prism-show-language.jso(+rQWL?100644 prism-show-language.min.js/s Bs5Ag(H>(U2100644 prism-treeview.min.jsE ?3?ULѮ x!100644 prism-unescaped-markup.css;ݲ[vxǑ100644 prism-unescaped-markup.jsKXޫ~l100644 prism-unescaped-markup.min.cssŽPg d^100644 prism-unescaped-markup.min.jsBd퓚\?1Mܚ]s xU100644 prism-wpd.cssCZ |5100644 prism-wpd.jshrcF$>e100644 prism-wpd.min.cssCa-Og100644 prism-wpd.min.jsȋe5&LRwYv0YDz.x100644 prism-coy.css9g!IfU?Q4 100644 prism-coy.min.cssbI^VMCB 4"ګ100644 prism-dark.css>c HDJ/o100644 prism-dark.min.css咵ieZ!f100644 prism-funky.css!\nS<&b 100644 prism-funky.min.css.g AWl,-100644 prism-okaidia.cssEFiw100644 prism-okaidia.min.css A2qI ɞêU100644 prism-solarizedlight.csseX`荧;100644 prism-solarizedlight.min.cssϞU])5D?f100644 prism-tomorrow.css 8I=Ɣ bB100644 prism-tomorrow.min.cssU+QL/vr100644 prism-twilight.csscLk a,,(?100644 prism-twilight.min.css嘾eg ֐d/vg4lR100644 prism.css[2#t[$kZMg5100644 prism.min.cssLWk;ʫN1MtҨ|%xE100644 CHANGELOG.md h*Y"$4+100644 CODE_OF_CONDUCT.md6 $40000 fetchGXͻ}o"4{\t40000 operators2@6FIzY[100644 package.json w>W! h40000 srct8eޗ}H40000 testingG*wvA0fQg100644 tsconfig.json(HK\]38#U+S40000 webSocketL&W:6¨x(100644 package.json y7Q!#x(100644 package.json/5TTEr!"\^ x(100644 package.json0'6$/ b؇AҨ)xg100644 Rx.global.jsV4PX(\q40000 ajax1VdB 40000 fetchۊdp5r Շ6100644 index.ts4ha֠Ep^Q;40000 internalSi=y6@n?г!40000 operatorsIgN5Kѝ^d1W-u40000 testingXKPE(!~100644 tsconfig.base.json[!)W#100644 tsconfig.cjs.jsonKd"``N*ˊ100644 tsconfig.cjs.spec.jsonv`v}Ptu'100644 tsconfig.esm.jsonE«W=ZM}100644 tsconfig.esm5.jsonO:sU#TK{6100644 tsconfig.esm5.rollup.jsonأ&0eO'o͇_100644 tsconfig.types.jsonfIm1S-:s`D100644 tsconfig.types.spec.jsonwf-3JXة#9me_40000 webSocketvF] Cd,wҸ93x$100644 index.tsk]:UWe-Wv 4x$100644 index.ts'I^{.*w 100644 BehaviorSubject.tse@>r*,=100644 Notification.ts4LI9ktcs100644 NotificationFactories.ts] X Wl-:y100644 Observable.ts-&Mid ׉7yp100644 Operator.ts{ ^] p 2100644 lastValueFrom.ts>R|S2F״X40000 observablex?C!7@$&40000 operatorsIzh_c 40000 scheduledۛ}T cF.040000 schedulerDJ> 7Rqo()m40000 symbolom긙<4rS/DM40000 testing`A!GBp0$100644 types.ts.:V:?Lf .`Vr 100644 umd.tsWB|<340000 util"Zs )3e& x;100644 AjaxResponse.tsʑ[Ꟊ_he100644 ajax.tsbx1&8Bv100644 errors.ts612mC(~v(#100644 getXHRResponse.ts4I3v}100644 types.ts F d#S @MxLx5100644 ConnectableObservable.tsv:IF議K100644 bindCallback.tsW@+#L#V6W100644 bindCallbackInternals.tsJ@ r m`lY*100644 bindNodeCallback.tsr%PD7 j=Q9!100644 combineLatest.tsDo $/j100644 concat.ts8$E5YF7100644 connectable.tsF $^C-%zfbyQbߚ100644 defer.ts+ې׽^F'40000 dom8ŚmurD;"h8100644 empty.tsYZHF|{*N100644 forkJoin.tsAaÉC_hc6!100644 from.tsB-,Nua=100644 fromEvent.tsCs+l yQG100644 fromEventPattern.tsnp bM+%Q3 g100644 fromSubscribable.ts[l/@%5aig100644 generate.ts r밣e-<jl|gL100644 iif.tsE}T=z 100644 innerFrom.tsÅ,h.U⡆100644 interval.ts $`N.Zosi100644 merge.tsފ?>GP{&2`100644 never.tsϾޔF[q_` /R100644 of.ts5{xz۪qK:H100644 onErrorResumeNext.ts> ͯ(Zo100644 pairs.tsM *Ԉt 100644 partition.ts4&wY뚍J100644 race.tsrUPf߿i?100644 range.ts,)q8@>100644 throwError.tsX|ج/ DX100644 timer.tstX2/vҰ@؁@b100644 using.ts[+jƶbf*E3100644 zip.tsҭj¿\,Ɗ }/ xV100644 WebSocketSubject.ts^>$ ۣoh100644 animationFrames.ts88Q)e[$oxN]100644 fetch.tsG uXgO*;]9100644 webSocket.ts ]WNtshYVRDXxJ100644 OperatorSubscriber.tsY;{ kBOdgN100644 audit.tsb|^QHL ľ100644 auditTime.ts¾+a[cK100644 buffer.ts,љMhnOa}T100644 bufferCount.ts81U100644 bufferTime.tsC6i=F})100644 bufferToggle.ts9`t(D87100644 bufferWhen.tsd@ 񥋌9l0ٔbTջ100644 catchError.ts/M8z 2L100644 combineAll.tsAW)uJi3 q100644 combineLatest.ts?:cy탎;MG100644 combineLatestAll.tsCObcQ7.*nNH100644 combineLatestWith.tsb!<@ يlNY"100644 concat.tsYX7ӫ2yĸ100644 concatAll.tsOAּ1ezE}e100644 concatMap.tsmq=; U100644 concatMapTo.tsYw͚i6100644 concatWith.ts6"Grz\cu100644 connect.tsJk&100644 defaultIfEmpty.ts '~'w84LaȧD100644 delay.tsGi9wߓ۰Qmc100644 delayWhen.tsUP{51ؠ<PD6|100644 dematerialize.ts:N@<2$O)100644 distinct.tsp,#Z[ VA<>100644 distinctUntilChanged.ts]+e4=9100644 distinctUntilKeyChanged.tsY6 3`ղ100644 elementAt.tsGKP'Q 100644 endWith.tsCn[0aѣՋp100644 every.tskh8r100644 exhaust.tsA 8K$[1YoS100644 exhaustAll.tsJX^ $|. ^gÓեK100644 findIndex.tsuttō6 Տ100644 first.ts3zͽ.h100644 flatMap.tsyvKRR΅ݟj100644 groupBy.ts*0Kw׉I_100644 ignoreElements.tsԗzȗh(}I—,100644 isEmpty.ts]޹&~ f100644 joinAllInternals.tstnxz5t7gV>m100644 last.tsi2eYЍG100644 map.tssPCO&*100644 mapTo.ts?!STE100644 materialize.ts_b"rdȏƣ100644 max.ts/]]D܌]100644 merge.tss6Amo* 100644 mergeAll.tsQtP*c \b100644 mergeInternals.tsڳ?n˼!100644 mergeMap.ts[i߰Fk@100644 mergeMapTo.tseFVɜ!;ϛ?N>100644 mergeScan.ts F100644 mergeWith.ts&fGFLp,)100644 min.tsAМ!\`sHiЅ100644 multicast.tsN=/Cҙ(ɀEd: *100644 observeOn.ts7vk-H100644 onErrorResumeNextWith.tsUTh#"ا\$:g100644 pairwise.ts d Clb5"100644 partition.ts)TsXN'sw100644 pluck.ts ;kB5oW6q100644 publish.tsjBpVKmYK'3`b100644 publishBehavior.tsEKؽTb 100644 publishLast.ts#zDϩSs100644 publishReplay.tsGIN*f$%aO{t100644 race.ts͔7`\XRNl100644 single.tsYWl`cyM100644 skip.tsBJQxӒ%wTZT100644 skipLast.ts[Yl2b tȊԓ100644 skipUntil.tsNQRe(100644 skipWhile.ts7FK6100644 startWith.tsݵ+EߘVKS9}100644 subscribeOn.ts$ U&=lxQ|100644 switchAll.tsi˳2+s TL)100644 switchMap.ts {xI[@֪[a100644 switchMapTo.tsH90Ny3100644 switchScan.ts**px% RD*[*100644 take.tsNxԀ_>i100644 takeLast.ts-pb2"n7c100644 takeUntil.tsqAV<M\&4B100644 takeWhile.ts4n9^l{#100644 tap.tsbC]8yҧfUEmz100644 throttle.tsSEZEv=%u100644 throttleTime.ts2_dM(BtkX0100644 throwIfEmpty.tsvIz"/v~`i(ӫ100644 timeInterval.tsjX" ֝X G)'100644 timeout.tsc^on_(Y#A100644 timeoutWith.tsM ~+Wӵ$:7j6100644 timestamp.ts8ZI؀ o100644 toArray.ts&xG$Jv;,~AO100644 window.ts% .i}\𫆃100644 windowCount.ts$|%yNbB100644 windowTime.tsFVwc xQg=o100644 windowToggle.ts{_ir$eH{6100644 windowWhen.ts1^uKT100644 withLatestFrom.tslVVjdt=100644 zip.ts^2=j100644 zipAll.tsi|QU­!|4-100644 zipWith.ts"y8,)ٲF}FxPxO100644 scheduleArray.tsꏢB ̻y l100644 scheduleAsyncIterable.tsڠ4fnZP5BBn^6100644 scheduleIterable.tsYϯ'X1'< pQ100644 scheduleObservable.ts);P2?Ҧsw}q\1E100644 schedulePromise.ts!u9W/RG100644 scheduleReadableStreamLike.tsB"X/aqC>?HG 100644 queue.tsN!b͏-pkdaLbK100644 timeoutProvider.ts ^cZqI}E1100644 timerHandle.ts Dؽߘg1"ɰ}xP100644 iterator.tsu s- nO 100644 observable.ts3$\\p’S%lwA100644 TestMessage.tsGw[6g9~4|100644 TestScheduler.tsEg@PH@eh;mwl bx"100644 ArgumentOutOfRangeError.tsiKɉ 3100644 EmptyError.ts,^1Y&|:D100644 Immediate.tsTj/Zn+100644 NotFoundError.ts:S^:Z53;~100644 ObjectUnsubscribedError.ts^?[%4)6100644 SequenceError.tsH=Z-(*@&f5_3100644 UnsubscriptionError.ts} )oeM6 ]rr100644 applyMixins.ts|B2gmCt8a,ăձ100644 args.ts -*46kq֪100644 argsArgArrayOrObject.tsH; mJ2+b 's0100644 argsOrArgArray.ts ldлn-w2!]&100644 arrRemove.tsQlتRWıkWKnN100644 createErrorClass.tsT8Xd!Ó{z%100644 createObject.tsy/')yet100644 errorContext.tslOsibfrދ100644 executeSchedule.ts˙-@3ԔR100644 identity.ts ~9!ofIUx100644 isArrayLike.tsocMMaX~@ 100644 isAsyncIterable.ts7T_zB100644 isDate.ts MTKm\Ig0100644 isFunction.ts'u(u,ʬHiD100644 isInteropObservable.ts BgF{DŽ`3100644 isIterable.tsI+<>1lӑ`vf100644 isObservable.ts(" 1 b-NR100644 isPromise.ts Jn"I|!\w100644 isReadableStreamLike.tsZԉy~dZ100644 isScheduler.tsʴܣ$E\"ݼ 100644 lift.tsA:GBqP100644 mapOneOrManyArgs.tsBnvf*"100644 noop.ts #!K!~100644 not.ts^]~-;ً!-w<100644 pipe.tsiς/_D io⠇U100644 reportUnhandledError.tsٖc*MUj,B100644 subscribeToArray.ts )B6Ud#}+100644 throwUnobservableError.tsj^bὒ53M100755 long-stack-trace-zone.umd.min.jsy_R;.Z100755 mocha-patch.umd.jsvGqllàȔ100755 mocha-patch.umd.min.jskcb@YB0R[=L100755 proxy.umd.jsQʲ\SK-]9b100755 proxy.umd.min.jsH~_6#Դ100755 task-tracking.umd.jscGՔ:2Pju100755 task-tracking.umd.min.jsM ŘMx$bƺ4100755 webapis-media-query.umd.js5w|/2ȸh!|Ngy100755 webapis-media-query.umd.min.js{_+NAAZ1100755 webapis-notification.umd.js|Mv> 4B100755 webapis-notification.umd.min.js .r>׳H)h100755 webapis-rtc-peer-connection.umd.js@ !@TAh100755 webapis-rtc-peer-connection.umd.min.js ޅB@}91i100755 webapis-shadydom.umd.js@}r b100755 webapis-shadydom.umd.min.jsxWvÈs˾adZ100755 zone-patch-resize-observer.umd.jsj$7!s:ܱH툮N100755 zone-patch-resize-observer.umd.min.js Q&(]7*100755 zone-patch-rxjs-fake-async.umd.jsQʲ\SK-]9b100755 zone-patch-rxjs-fake-async.umd.min.jsH~_6<:100755 long-stack-trace-zone.js/=JBaG_=P!100755 long-stack-trace-zone.min.js;<'.H` 100755 mocha-patch.js;֍z/GHuX100755 mocha-patch.min.js<H"P#100755 proxy.js4XHcUDbX100755 proxy.min.js<\&eѯ\100755 sync-test.js^vԘ&ir9(J6ę100755 sync-test.min.js7{g`^Ep-xac100755 task-tracking.jsb^kV=GJ&100755 task-tracking.min.jsL79x(DzN100755 webapis-media-query.js'Mwh~|,66100755 webapis-shadydom.js4P ܔ&+t=Z100755 webapis-shadydom.min.js :bI 7iˉ100755 wtf.jsDY"21.M%Z100755 wtf.min.jsk/e.V 4 p7100755 zone-bluebird.jspwQ8ù8(.100755 zone-bluebird.min.js8Nv_y%>(+o100755 zone-error.js=8Qt=sl̙100755 zone-error.min.jsN杯XBm100755 zone-legacy.js DLT}[|-ױf100755 zone-legacy.min.jsvPgOzT.]T9c100755 zone-mix.jsq]t ;.,}100755 zone-mix.min.jsG(xC +g[N100755 zone-node.js5YDMgW6 GDY100755 zone-node.min.js4*u^䘧,tr100755 zone-patch-canvas.jsZtC[D~[7:MVg100755 zone-patch-cordova.min.jsOPc^G;zӉy100755 zone-patch-electron.js"rs5ؑ}¨  100755 zone-patch-electron.min.js4 Qe TO0n$100755 zone-patch-fetch.js+,4^l\6x`)100755 zone-patch-fetch.min.jsolY\L:.;V[100755 zone-patch-jsonp.js)Ty'I100755 zone-patch-jsonp.min.js]aQD^:%100755 zone-patch-message-port.js>i@]o100755 zone-patch-message-port.min.jsVV{T? ]100755 zone-patch-promise-test.jsxq %@7NݵE100755 zone-patch-promise-test.min.js٧2F+l*X2p100755 zone-patch-resize-observer.js9#=>S7Ac100755 zone-patch-resize-observer.min.jsM+,O0 Z100755 zone-patch-rxjs-fake-async.js4XHcUDbX100755 zone-patch-rxjs-fake-async.min.js<\&eѯ\100755 zone-patch-rxjs.jsWsusu @i{Z\.E100755 zone-patch-rxjs.min.jsXbɥ}Z+100755 zone-patch-socket-io.js~0:2Òk~+j100755 zone-patch-socket-io.min.jsZ< } aR'Йgq4(100755 zone-patch-user-media.jsswc֌j_LU100755 zone-patch-user-media.min.jsЅb ͞d100755 zone-testing.js}wN}]Fk͙Ɇ\100755 zone-testing.min.jsWwF*nW2100755 zone.js'Ts?W`<—100755 zone.min.jsRwaH&N xD100755 zone-impl.d.ts2 KU0R(ް100755 zone.api.extensions.d.tsx\KValU J9100755 zone.configurations.api.d.ts1b-~A>NR8100755 zone.d.ts m=;3[,g+ ̺Ix4100644 copy-button.directive.tsb9 eK: 87~~~txe100644 syntax-highlighter.service.tspENhpa PR?5t100644 theme.service.tsΑ.^&ưD%Q%xG40000 libh4$7Oa100644 transformation.ts)+ Ii>x{%LD100644 types.ts{ߐ2jMl`3y100644 ui-data-utils.component.spec.ts(CALyYԡz)OA<100644 ui-data-utils.component.tsvz-YAezit100644 ui-data-utils.service.spec.tsK=Fk&Y^8100644 ui-data-utils.service.tsl^ s4oV|/DC x31$ie:uhܥ'8u𠡁BAiRNfnbA^I1CTuN隊"QGE0S\RZozA3~RҿW;T(7xW40000 font-awesome622VG100644 shared-ui.service.tstpw]#;/}3T,!>xV100644 font-awesome.config.tsL37UF[ wdYo100644 index.tsmYHW(] &* x*40000 baser100644 _ai.scsse $,%= >EEtR~O$100644 _borders.scss.aI l&9`y 100644 _breakpoints.scssI.3"U3-100644 _colors.scss8NKMF@9100644 _motion.scssYY7©ffX=100644 _opacity.scssE;k(&8(100644 _shadows.scss>U8w͈ ^nR100644 _sizing.scsshYǘ^8#MI100644 _spacing.scss\@=7P6/s100644 _typography.scss^˰ʶ Rky:100644 _z-index.scssú340󹡫*Z100644 index.scss$ro,%s@ H,f x$100644 _index.scssB`VH=40000 componentsTEb;]G˙M100644 index.scssB`VH=40000 layoutse$%䒡1IvV40000 patterns48BfB`40000 utilitiesmxVvK`{;bj,|IH\tx100644 _base-buttons.scsssw~XFn"8ω/100644 _base-cards.scssOhڇƑZA,$100644 _base-forms.scssȹv~6Yx2'OB$ay100644 _base-navigation.scssOW7ie#/Lc̿100644 _index.scssӥ5]{_X˳'100644 _utility-components.scss舢QDjr/}CoxO100644 _content-containers.scssH!^krz100644 _dashboard-layouts.scssBB$100644 _grid-systems.scss@(1?Ei100644 _index.scss;w' JX@@`x100644 _layout-system.scssR\*r}4x[100644 _page-templates.scssnƚZ:қUsxw`100644 _responsive-layouts.scssݖmA)z qΠ x?100644 _content-patterns.scssK1)bw~8C3]n100644 _index.scssVq7nJ)Q}: Z100644 _interaction-patterns.scss2ދ 0100644 _glassantiqua.scssrRPslC3_100644 _iceland.scss< _L1kÍȥ100644 _inter.scss =@>jBz4100644 _josefin_sans.scss8Z }@ֆYp100644 _juliussansone.scsss`%#fڪ(m^Ԧ'100644 _karla.scssҸ;Ʈg|100644 _kollektif.scss$Fe6ٷ$Wt100644 _lato.scss({IUJP100644 _leaguespartan.scssBT}:gb/DC100644 _lexend.scssg\1eXc@100644 _librebaskerville.scss'Qw%'\r^il100644 _limelight.scssӆ5Hd6 F.100644 _lora.scss%yWtV\5Y*@100644 _manrope.scss]50a100644 _merriweather.scssqαꈠUc7%\ 100644 _metropolis.scssAW,jA?C100644 _monasans.scss/4} U?}b}'[(100644 _montserrat.scss,* Cuw;!100644 _nacelle.scssIx_Iv2`?cv`100644 _norwester.scss`k;L4100644 _notosans.scssoZCFǁy+100644 _nunito.scss~נ:33lRS9100644 _opensans.scss93G _1 -j^~@̉D100644 _oswald.scsso@ (*uUH100644 _outfit.scss?1sclʫ8wUO100644 _overused.scssv=]WבU"ޯ#100644 _playfair_display.scss\4Jpʫq(100644 _plusjakatasans.scsseW6M4Q100644 _poppins.scssT6~nVflIdP5100644 _questrial.scssveċr9ˌ|100644 _quicksand.scss F M*0=}!xq100644 _raleway.scssQ-DCNvYl100644 _roboto.scss vSX:KO2100644 _robotocondensed.scssS[Y}s(100644 _robotomono.scsso_Tx5Js100644 _robotoslab.scssF9LTwa%KY100644 _rubik.scss3JWgEJl(,n100644 _sacramento.scssc@02qZ,r100644 _satoshi.scss' Q݇ !s100644 _sifonn.scssZx7sDَ[100644 _sixcaps.scss@@qaB100644 _sora.scss)OpU<2054100644 _sourcesanspro.scss_E*lUͧW100644 _sourceserifpro.scssBӻj\z z100644 _spacegrotesk.scssh[Kv|Q5Ef,100644 _spacemono.scss-Ln呇(x1100644 _unbounded.scssU;d#}-h100644 _urbanist.scss?#T5~ t|цhb.)o100644 _vesperlibre.scssh6{XC/(E100644 _vollkorn.scss>cT-OZǶ_c6~er100644 _whisper.scss鑂CTKUH;100644 _worksans.scss67`(z j[1C100644 _zillaslab.scss`g8vmg-mkxx40000 borders-H]B 40000 colorsf´w 6EZ( u40000 glassY*ɘFJY100644 index.scss rAzIqJt40000 motion?1fs6V~].40000 opacity]iUkGJڠ40000 shadows5夅wgvfݝ40000 sizingZ p|Hnk*40000 spacingv{۰Z><:f;40000 typographyqȅQNX Rp40000 z-indexc,%!Ob#ixY100644 _index.scssLghܭj8[/:w100644 _semantic-borders.scss}00{r$L-"xy100644 _index.scss{E)&>~.N100644 _semantic-colors.scssn>*Wԇ100644 _state-colors.scssg,8uv3o{Q@P4Mx100644 _glass-borders.scsse[ئ;p<100644 _glass-mixins.scss"# D<~%^}`NL100644 _glass-surfaces.scssQ3ҥj=vvlgwKc100644 _glass-utilities.scss ;R}n100644 _index.scssMȢ[G%&_JxX100644 _index.scss_TcGJư08O100644 _semantic-motion.scss)zA;i"|, #0xY100644 _index.scss:g6Z8+iOz'100644 _semantic-opacity.scssq2QՇiB6]u"xY100644 _index.scss!l1kp'@100644 _semantic-shadows.scss1@{#:%2*e"xX100644 _index.scss.< g~[Vec100644 _semantic-sizing.scssm%(AWc ` i2!xY100644 _index.scss_me4JC!G[+=2dRj~ef sT*:& x_100644 font-loading-state.service.tskxDunj>4100644 font-theme.service.ts|ywcg,x7Jڟ?}100644 font-transition.service.tsr@.i7*WtNY׾h>Fx)100644 font-types.ts~)B`yZ9 xJ100644 content.interfaces.ts"?U2.SݼO)F100644 conversion.interfaces.ts)(i=p 7ILf100644 feature.interfaces.tsPSw|%Sh1100644 hero.interfaces.tsH&MIDib@{QK100644 index.tsǎƥr~JTB100644 navigation.interfaces.tsb/^ec"+{&u100644 shared.interfaces.ts ܓ3LI;DM100644 social-proof.interfaces.tsХiNpFw100644 templates.interfaces.ts/ݢ az\]W8x340031Q(N-)K/ON*c>WaB*cG⽜R!x31Ғ Լy 'V{q>8ZktMRRsuK3uS 3s]։I_6Y)!3stKJS2BBm*ݗ6V$Qʶ3 3RStKK2fko_SlCLLNZYRɰOnwj$sg&?PXW"b-R^/.)19;(4/}kj=M7dk;v<5+LOIM,.Id*VҶggU]]]kWXe|iZ.83=O$5 #R*<-lQARfZ:eb+6lJtsSN:wq٪|4W{2'1/%3/]At㣟+ʕ״>h2­x340031QrutuMaPI>ڬ cFGՏ !B]C=]*ž=2_\9v2/] 19;1=U/8?AI&-N]')U.xPpm%ӂwwYi"xBp$-+o+8jFMPSJ2r2 V*$,~OF{)$nĦ(?c5nMj]zắu&CT[w$S @w^~ x31Ҥd| 1{D"esL *s1uROۻ140031Q()NKLK,(*cx.㞥sNgAW\\ Qh;Sn {W1M {?x100644 app.component.spec.tsG^Mjkb c100644 app.component.tsiACesꎏo 6100644 app.config.ts lϧB; 1 100644 app.routes.ts9:5ˡFs7{ū40000 demos`.N"Gq2qQ40000 features护K, o 0wz#40000 sharedϩô$Zta|sPnxp100644 accordion-demo.component.scss,үP.rA6+8};100644 accordion-demo.component.tsNweܞoHR,xh100644 alert-demo.component.scssQ, &)X=1Z100644 alert-demo.component.tsmq4b"6`Jr&,xv100644 aspect-ratio-demo.component.scss,^ N'+ @100644 aspect-ratio-demo.component.tsl,A5ϱ#x /4xv100644 autocomplete-demo.component.scssH1M+p9100644 autocomplete-demo.component.ts)ϼĒv{c1Nxn100644 backdrop-demo.component.scssa2@hCuC(100644 backdrop-demo.component.tsux9՞o1qSM},xt100644 backgrounds-demo.component.scssrD& #VwJI 100644 backgrounds-demo.component.tso g߾m/"X-xr100644 bento-grid-demo.component.scssy,f-?0100644 bento-grid-demo.component.tsi8aɨ'K P+xd100644 box-demo.component.scssC(/!־P~#100644 box-demo.component.tsk%_@/KY_0'xy100644 breakpoint-container-demo.component.scssU@sk)ЬFĿ]100644 breakpoint-container-demo.component.ts>T=~u׸p7:xj100644 center-demo.component.scss穖"->~X100644 center-demo.component.ts]C/"U*Ӧxv100644 color-picker-demo.component.scssN!nJ9V50ȸo100644 color-picker-demo.component.tsdhjG;+t /-Jxp100644 container-demo.component.scssoie:/ԑfg=%100644 container-demo.component.tsc`en"_100644 conversion-demo.component.ts9ψ@E*^z.xj100644 drawer-demo.component.scss uOKa`Li4100644 drawer-demo.component.ts%B_ӚsQB^x+* xt100644 empty-state-demo.component.scsstxQv5}LMpCB100644 empty-state-demo.component.tspisH{Z5 ;0 xn100644 fab-menu-demo.component.scss4^Pz8}100644 fab-menu-demo.component.tsE¹ZX.,.U@L&+xt100644 feed-layout-demo.component.scss-=G#8{J\~-1100644 feed-layout-demo.component.tscW'P3IwC~+Bxt100644 file-upload-demo.component.scssxsUb100644 file-upload-demo.component.ts!!y \\U E .bxf100644 flex-demo.component.scss.$^ÇZ銮JQR100644 flex-demo.component.ts1S)A^`tb(¤xt100644 fontawesome-demo.component.scss7W Q)3!100644 fontawesome-demo.component.tstd+A{O㭺VD08xr100644 form-field-demo.component.scsstkP yը1r100644 form-field-demo.component.ts6ӏnXGEʔ[.xv100644 gallery-grid-demo.component.scsshanek֝ChO8100644 gallery-grid-demo.component.ts~h:pl-|L/nxt100644 grid-system-demo.component.scssE&pcW!S m _v100644 grid-system-demo.component.ts==TXPˎ-S,%xv100644 kanban-board-demo.component.scssL*Ȓ@4 @ 2L100644 kanban-board-demo.component.tsGv_J-13WU A-٦xy100644 landing-feature-grid-demo.component.scssxV5HyJɔ100644 landing-feature-grid-demo.component.ts.p"lzxT"c5ʢx}100644 landing-logo-cloud-demo.component.scssxV5HyJɔ100644 landing-logo-cloud-demo.component.tsKHwY1fW@y4x}100644 landing-statistics-demo.component.scssxV5HyJɔ100644 landing-statistics-demo.component.ts'Ӆu$tH5Pxy100644 landing-testimonials-demo.component.scssxV5HyJɔ100644 landing-testimonials-demo.component.tsb͆!}U#uπ 8x}100644 list-detail-layout-demo.component.scss^A=+ '1!100644 list-detail-layout-demo.component.tsKJVm+0c3xf100644 menu-demo.component.scssIQi}L/m Ҿkz100644 menu-demo.component.tsAʿݪo2<x*)xh100644 modal-demo.component.scssosMp}kk100644 modal-demo.component.ts ̯J Y9(xl100644 popover-demo.component.scss[a; `z3100644 popover-demo.component.ts@#"?6xh dɴor+Cxv100644 range-slider-demo.component.scsssLU]^p!)T100644 range-slider-demo.component.tsN+_"4ztj+xl100644 section-demo.component.scss^f6.uR&A100644 section-demo.component.ts OJ\ւUoyP;+xz100644 sidebar-layout-demo.component.scss<;i`BՑ]100644 sidebar-layout-demo.component.ts˷kB &Mݜ^OF2xn100644 snackbar-demo.component.scss#ycw%5_100644 snackbar-demo.component.tsf -L@As35YA$,Ъxj100644 spacer-demo.component.scss=]h$hZ1[NHmƏQ100644 spacer-demo.component.ts}sgVSG\A.)7xv100644 split-button-demo.component.scsso_c{'919穫eh6100644 split-button-demo.component.ts&+3OmM,/5xr100644 split-view-demo.component.scssQ|

xn100644 timeline-demo.component.scss9Zߨ;=NI$Ōw100644 package.json8vΌ*Yigh440000 srcɱ0D5،4Vc100644 tsconfig.lib.json#Yf/3Xۯ100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+Iux#100644 README.md+vQĠU*=8100644 ng-package.json2|ynq :Ѭщ100644 package.json8oY6W$AQ&40000 src뢩ņ̖p)Vy100644 tsconfig.lib.json#Yf/3Xۯ100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+ |[x#100644 README.md,ϻv>?Ց g100644 ng-package.jsonw0(wLC/تxj100644 inline-code.component.scss@DRoƾ3Bpmv 100644 inline-code.component.ts*RXY[S![w+3x#100644 README.md&r 神WF|YP(4hyuݳRS7BqQ29'l_ާarIB)%yiz9I+#LFnǦ(?c5nMj]zắu&CT]Wn=͵Wx&'[-vZx340031QrutuMaQytcʚK .-75(K-HLNLO*cxT#ZGt 6E]靾d7H|9[~:(%3D7;\ZScǎtRRR9rڽˤ_om4>ܱzl S :&Z ]GqAj2D[?|֓\ymr]mU3w x31$g TuYPWD4)'3Y7 S!2d 3[Wl WcxG40000 components|'لvBd (.40000 layouts>rFyp$Y@ mx40000 buttons3)#G?%$S40000 data-display"G"؅lleQ40000 feedback˒.!]$G{=a40000 formsOӆ^8pPX40000 layoutpFH>z5 \s*40000 media?ۼ} Sz40000 navigationx7V8s40000 overlays X-bt!Dpxw100644 fab-menu.component.scssbTđcATS9100644 fab-menu.component.tsv~F|&ln*o>100644 accordion.component.tsr1Xn&Zu!100644 index.tssû  )Z=5xw100644 carousel.component.scss\~4"J*r~100644 carousel.component.tsP"aFrL|k100644 index.tsz=83u4Lڹog6xy100644 index.ts{<̎ib~100644 tooltip.component.scssjhfU5FOwg^f100644 tooltip.component.tsb=3O+{A:xu100644 index.ts>ggطwt kQ;100644 tree-view.component.scss}NYhA1EǚXJ100644 tree-view.component.tsvZG}qtװ`&8e6xw100644 index.ts-%yǔ<*Ԗs$100644 snackbar.component.scsspV߿*>6VfHln\100644 snackbar.component.ts܇ZBk dDaaw14x}100644 index.tsڴ {̡HB7(100644 toast.component.scss=U-6v)- 100644 toast.component.tsI.']-k40000 select{_Xds38QN"40000 switchHy0$=4?40000 tag-inputtFՉU пM40000 time-picker7 TS ˿1D',2x`100644 select.component.scss"ݮ<=o100644 select.component.ts4lǸ]L(x{100644 index.tsBD%c'L{}}E+100644 switch.component.scss;)Zwe`'HGm ܆100644 switch.component.ts˾@ST7lKeG3xu100644 index.ts$#8"oay100644 tag-input.component.scssT$h+31vՆj"g)100644 tag-input.component.ts iFIFQ(4z xo100644 aspect-ratio.component.scss4Ї]stV"*W100644 aspect-ratio.component.ts^Ѯ/p~׆u;100644 index.tswF3pY nFVI=>x{100644 hstack.component.scssJY܎RHSf100644 hstack.component.tsz-z9&m7@100644 index.ts4P+*2ئ$Y~N4 xU100644 index.tsԋ:J(f ?;'100644 infinite-scroll-container.component.scssX5O [d>'׮jU100644 infinite-scroll-container.component.ts!Ҁk_X,ƬΧWbBD xo100644 index.ts/bnޮgUYS?100644 kanban-board.component.scssN_h?X^MEGoI100644 kanban-board.component.ts.&@O䁍8z:F xc100644 index.tso7xdM Ļi/100644 list-detail-layout.component.scssы9gX<1UǪ100644 list-detail-layout.component.tsDKw{4XÒL;"lN/=xy100644 index.ts|o=[:=SzRpp100644 masonry.component.scss&!e["횂;Sv100644 masonry.component.tsY<)S2/> 100644 spacer.component.scssT3o?Dž100644 spacer.component.tsE^کd-zį;gK$(8Exs100644 index.ts|C{ iĥF100644 split-view.component.scssi8 Pq$100644 split-view.component.tsBk.v/Bb[9Kxú;Bx}100644 index.tsIJlOƕ|^t100644 stack.component.scssSCA^^l@/i?21100644 stack.component.ts ],ylF?Q1Ϣ xm100644 index.tsqdWyg~8ҡqOm100644 sticky-layout.component.scss m2}W: 7100644 sticky-layout.component.tszƑbo-zd06<9d x[100644 index.tsVnhd9'WШݑ;c100644 supporting-pane-layout.component.scss"$[\GUhP۫100644 supporting-pane-layout.component.ts8t~lY|XnWXB xk100644 index.tsKkmqϺ40000 video-playerev;,py6xy100644 index.ts2"8cήJ0100644 stepper.component.scss9.K _dFy100644 stepper.component.tsXc CܯG/l5xu100644 index.ts 'aF$°LZI100644 tab-group.component.scss~g?[Cepw100644 tab-group.component.tsƚq:\@8æxy100644 index.ts\H+:rr(0>=G100644 popover.component.scss;"?.럺Mk100644 popover.component.tsC;;&bHɿN3ۣx#100644 README.md%C;Oʦ*100644 ng-package.json%;wIIw: D{O{q3100644 package.json#%~1|>gW>CS40000 src.&r=~>„0P~100644 tsconfig.lib.json#Yf/3Xۯ100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+sBx#100644 README.mdt%G"x N3100644 ng-package.json!XTE;0G100644 package.json%H΁OsV,*G40000 srcX-&I2ߴ8^100644 tsconfig.lib.jsonl)<Ff100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+~:txG40000 lib)F}#<.\Ra $100644 public-api.ts}P+og<>AxJ40000 components_IP]~Ro5 40000 interfacesFz?2mU k*/x40000 contents`5@]w40000 conversion˫5/B#40000 featuresBWR"[t6! LމNE40000 heroes}s Mc1E|xh100644 faq-section.component.scssW.B qWk=l $M|XsG100644 faq-section.component.tsB!5 ,v-<C100644 index.tsxRINU@100644 team-grid.component.scssOuזKd6 J100644 team-grid.component.tsL!7[`(@B[2100644 timeline-section.component.scssɩ`h D3L=Y100644 timeline-section.component.tsb@ my.υAGٮx!100644 contact-form.component.scssBMpݏ+aղa100644 contact-form.component.ts@3f|E100644 cta-section.component.scsspK[rq3>@O100644 cta-section.component.ts'`ߧNP$C'100644 index.tsIQE`ute;0100644 newsletter-signup.component.scssNco3$M{tfZp@c)100644 newsletter-signup.component.tsYHsF zu`RIR[q100644 pricing-table.component.scss[4N)cb100644 pricing-table.component.ts[ V~C6P xo100644 feature-grid.component.scssLQSݕ%m{100644 feature-grid.component.tstP)xk; 100644 index.tsgA&>ɭ|P ƕu1100644 hero-with-image.component.tsaT[ƚN &9Ȧ100644 index.tsKm75AD$x100644 index.ts2[ vZV;q)4U{100644 logo-cloud.component.scss2*ڶl~.100644 logo-cloud.component.tswȽ[a100644 statistics-display.component.scss|; [Bfۨ100644 statistics-display.component.tsJt[oe%R }o100644 testimonial-carousel.component.scssCn[oʹ[w100644 testimonial-carousel.component.ts8B}oզ)fxx100644 agency-template.component.scssA)+qW7 +u100644 agency-template.component.tsTX ;&`O0D[f100644 index.tsTsRj 9S079100644 product-template.component.scssВDF'zc100644 product-template.component.tsʒ\<8r1ip100644 saas-template.component.scss);d7&r1)x(100644 saas-template.component.tsTXc—*v`sx2eC ͬk?$X98];G |( P(M-.N+L)fx5vk J.< \zRhPX@nxLP%* xh40000 lib^?Z100644 public-api.ts%E|"!fT`:NQ40000 stylesA_5)f"Mu O@v(xG40000 libgV %D~~":100644 public-api.ts?;/U͏k Lxg-40000 demo-ui-essentials\fN85Y8,`eSθWpfbgJ^1Egʷ c.:ĸq*.hx8qH沪ƿ{B&wUH%:Nfh 7 x31ĂsΜWmMYq!ӹ|W-C3̼ u^=w'v\=/1: TUnbf^I1~dCyn^6I)N..f8Y ĹO%M53!jBqIeNjXُ?yoM3Ͻػ)J}x100644 app.component.spec.tsG^Mjkb c100644 app.component.tsiACesꎏo 6100644 app.config.ts[񴍂sێw100644 app.routes.ts9:5ˡFs7{ū40000 demos{T;դjT640000 featureskιwH0~vŁ40000 sharedϩô$Zta|䎄uѥx 100644 accessibility-demo.component.htmlL0ie7100644 accessibility-demo.component.scss`-DSWaKt(100644 accessibility-demo.component.spec.tswGC :f0?n100644 accessibility-demo.component.ts>BK 3Usp)1cx8100644 animations-demo.component.tsdPH.@7Q$/O(xv100644 code-display-demo.component.scssL5EKR ?100644 code-display-demo.component.tsf N2w8 Fm7- x8100644 data-utils-demo.component.tsPIL[ۻb9Hx100644 hcl-studio-demo.component.htmlPvV#1^MBZ100644 hcl-studio-demo.component.scss8Mcu-3 oy100644 hcl-studio-demo.component.spec.ts'F>o8zu,LE100644 hcl-studio-demo.component.ts{V\iʕE4[$xv100644 video-player-demo.component.scssQVI b5L 100644 video-player-demo.component.tsL~ėϳyC9l@/|x$40000 dashboard x =O6_ֹUb xW100644 dashboard.component.tsO}=Wu(al100644 dashboard.sidebar.component.scssȜsEAO3p5100644 dashboard.sidebar.component.tsS^XiZ6*[dEDxw100644 README.mdqRtƁ X=N100644 ng-package.json m D}840000 node_modulesk `UXdhnYl100644 package-lock.json&<) )i.100644 package.jsond* $|`^l(40000 src {.4;H( 6%L100644 tsconfig.lib.json#Yf/3Xۯ100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+zxG40000 libC8xW Q100644 public-api.ts׽iG ?N{HǣxS40000 componentsuSe;740000 directivesQ_-M>ёo- 9`P40000 servicestGwַL34}100644 ui-code-display.component.spec.tsINLFO5\Pkw2100644 ui-code-display.component.tsȞN/YЧ '+100644 ui-code-display.service.spec.tsτO.)ߪ6Z100644 ui-code-display.service.tsOd…r=3+;Qxr40000 code-blockR,L!h!9tǸ`J|40000 code-snippet-쨸\SrFyp$Y@7x40000 buttons}Eϭ'Ve!% 40000 data-display)H {;Xid40000 feedbackn@wtaˍ,=40000 formsOӆ^8pPX40000 layoutx=5Iϒʳ:%b40000 mediavE6hӸ |pt40000 navigationx7V8s40000 overlays&AVJn Հ$rxw100644 index.ts-T 18Qi100644 timeline.component.scssF0'z$B/ 2100644 timeline.component.tsy쯶{:3U7 x40000 alertR$p<^wxC440000 empty-state@3[?ج-\100644 index.tsحKI40000 loading-spinnerY p%5[{|Cq40000 progress-circlex|y)RV40000 skeleton-loadert}G VF:40000 snackbarPŅ$"]& = &100644 status-badge.component.scss=Q68}$ @S100644 status-badge.component.ts;%(R100644 theme-switcher.component.scsslUfCrsNw(V5100644 theme-switcher.component.tsv1D2ZEwĴt40000 toasta}Cͣ./+)V*- x;100644 bento-grid-item.component.ts~tw tN7[ 100644 bento-grid.component.scss{*!# >d100644 bento-grid.component.tsEJ,Q8רּϺ40000 video-player`nJku m~ۍ0 x}100644 index.ts&S~{ZL2&(S100644 modal.component.ts^{ލk VQKcT2MDx[˸Q 6j$T#00S&Ut>fPbK G- x$40000 dashboard1CC_q_7lvSxG40000 lib0S=AeNs!{M100644 public-api.ts%آyX". q4xG40000 components[*h>]_Ξb40000 layouts>rFyp$Y@ӣ8x|40000 aspect-ratioXnJ 1z1xW;Y 40000 bento-gridc&AyXe40000 boxi%ga40000 tab-groupf15wV%1jƇJ:%ux340031QH,LI-MIK-K++N..fYYijVr~օx3dt+.{xoLGRg(x4100644 layout-demo.component.tslƽD맵-xp100644 tree-view-demo.component.scssD%-w _BPV-݉100644 tree-view-demo.component.tsd!ww P]fT *x$40000 dashboards*F }:SxxO100644 _variables.scss1d£6w47@[ө40000 overridesn&v_VMIdnނ­ ԟ!\x[̴iB|o冴Bgn;z, xG40000 lib|iX\{-I2100644 public-api.tsg1ǵZW|rb, xG40000 components*LŕXb40000 layouts%x,j۸qh/I "x)40000 accordion=ƴ8^z 疞P X0r]*M<)H100644 index.tsO%;jV40000 listCv_QfP#52E40000 progressFؒڈ=o|z40000 tableuUR鲜 xAD40000 timelineR;*ձ7N40000 tooltip<{qb@tF"~40000 transfer-listʼn= %;݆/G[{_440000 tree-viewaݲ d !":jQmJlUxp40000 container랖U9BpF}߄40000 grid-system?#k?X100644 index.tsq.[Yx+40000 backdropiCQMVK 3G[40000 command-palette=B3c]&^خ z40000 drawer &\Mz ً 40000 floating-toolbar7}YIsT100644 index.tsΟ$T&<40000 modalF&¯ɤ40000 overlay-container'vt Ͷќ40000 popover3A,F羴dJ lxR}x340031QHLN/JMIK-K++N..fTdyLi׌v43}-o[*g^e>zM+gx340031QHI-*MIK-K++N..fx]۹!1ZSI3ģA(Ƚ LV'z& av>1(ɠx100644 bottom-navigation-demo.component.scssU7Rڤ奶7j|*100644 bottom-navigation-demo.component.ts|dc劈ϸd6XƱd4jx340031QH/-LN-MIK-K++N..fHrcYp!,W3$L5Y ֭Jz|\ //x|100644 command-palette-demo.component.scsszKΛAB=100644 command-palette-demo.component.tsXh)>/mtq,4P[~2?xp100644 container-demo.component.scssմv3- a.I100644 container-demo.component.tscxv100644 video-player-demo.component.scssI϶Eݚ~Y;100644 video-player-demo.component.tsL~ėϳyC9lq1Wx$40000 dashboard'jUOT"{3]!='*e rxG40000 lib|&%b100644 public-api.tsg1ǵZW|rp GxG40000 componentsmjGW40000 layoutsٽTG^w/Mi+ sx40000 buttonsl3O*RZa540000 data-display)a~3*`^ 40000 feedback{ʻQiR:;Udѽ40000 forms0U';M}cՌW&40000 layout{OhwB,&?˃40000 media+#jTpo540000 navigation]2i nHCcTSU4@40000 overlays\k^Sru$nxw100644 fab-menu.component.scss%%-R{100644 fab-menu.component.tsYfd\ ޒk(W100644 index.tsoW.iDIXe\N.5xq100644 icon-button.component.scssIZ6CDlOu~100644 icon-button.component.ts[Ѓ,[)`100644 index.ts.pm`#$K<=x{100644 avatar.component.scss" D;100644 avatar.component.tsI"ׂ 2 \S100644 index.ts8n˗5{GI3>x}100644 badge.component.scss-qub+ц100644 badge.component.ts*ҾúW; `Vg&100644 index.ts!n~EYla̺4x340031QHN,JK-K++N..fX)~ߑ%M_ݶ˾|m3/ */)f/aNvM%%;JGĭ*KId񐝲bj*b3x340031QHN,/-NK-K++N..fp45yu'H՞S'siSKI1ËVek6Q[}ą3ZK̼ =*[ ㇥LV_N_6x340031QH,K-K++N..f*3^ sibc[4c gaϠ_3RR+jo:ƆWEcO֫Jb6x340031QH,LI-K-K++N..fн<:j77~;l1?bN*ۥz\ ϪPy)z@5Abss/_i=y5 x340031QMLOM+IK-K-K++N..fz~hcD.gU+oHHgI1?)g_eۿNoo¢奤Vl߼-]z5gWLAxr100644 README.md"J G0X100644 index.tsغFٛӧů2.100644 list-container.component.scssƱX #)d.@0100644 list-container.component.ts9,6F'V\i4100644 list-examples.component.scssrbC/_a100644 list-examples.component.tsO)5}1mnm՗100644 list-item.component.scss9䛴#A-er;100644 list-item.component.tsThrmgq\: xo100644 index.tsO"~+_I100644 progress-bar.component.scss\~0gJ˯Dt '100644 progress-bar.component.tsPշCCg:x340031QHHKNM-ILIK-K++N..f8_ '33M2ӐƒbYς*}ׂ{,U >}Un۪e~,ݸj1 8xy100644 index.ts{<̎ib~100644 tooltip.component.scssr/j$NR=d:6]C$?D/9? ?/5D8 ~ YqPۄC=c_sH{ܶh=u#V͞3x xo100644 autocomplete.component.scssPvh6`Lo[|(I100644 autocomplete.component.ts ֖![1v100644 index.ts_OF店fnAz;xw100644 checkbox.component.scssGJ&=@3100644 checkbox.component.tsǞ'Vgc,orFg100644 index.ts<:Vx6 4˼8" x340031QH/-LN-K-K++N..f^Ʊ-'3~wXzhW[I1k5^f8ɹ#!2,Cy̩͟lJχjKIҍj臖@g;k9x340031QKI+)fX{Z{_>W_xށW aj JKtˋ Rs RJ@<|d*Զ+*/o*I(jER\\`صTtߙ|)W|&>|LHWs6#[_3IKbQj"-/zL{Rp=v҃I9[ [Ox2zY@Mf [n|x340031QKI+)fx'ɹA kߔ]C(1%3_7$?O/9? ?/5D8!-}8~9ըp6]˾YY/i 싺P'tV7Zdd毳T_vA1^]@ W xU) 53Ζa x340031QKI+)fJsb+"mra|w{B%楧d%'3*9gZRS)E\vƯ hWRtUnjOn4լx340031QKI+)fH_ݺٿvǿU85(9C7)H/9? ?/5D83]ak]7}lOО~3\#]H)TWLk7Ox`100644 select.component.scssV&ʒ#( J|7L .$100644 select.component.ts4lǸ]LB&x{100644 index.tsBD%c'L{}}E+100644 switch.component.scssMܾ̄NJz@bro100644 switch.component.ts˾@ST7lKeG7xu100644 index.ts$#8"oay100644 tag-input.component.scssļ嬖Yo ;lmpaB100644 tag-input.component.ts iFIFQ6xq100644 index.ts As)IAgÎ100644 time-picker.component.scsstOD\K}[I[ 100644 time-picker.component.ts?NyCGѽ8xp40000 container JPEnݧShغ40000 grid-system;l!{</. $:q100644 index.tsq.[<)S2/> 100644 spacer.component.scssj!&]ؼd܄Q100644 spacer.component.tsE^کd-zį;gK$(_5ʫxK100644 index.tsPWcF#qO_>Ϻ40000 video-player6ШE_D)3'åxE100644 README.md"J G0X40000 appbarRȂy KV>40000 bottom-navigationd}9Pֻ[7~gs40000 breadcrumbcݷRްp h100644 index.ts^8̴u C,4Y40000 menup@||ZϺ40000 paginationnQu}YkxCG_/8@V40000 stepper /Ba040000 tab-group>7x@JI{]DŽx{100644 appbar.component.scss)ȵ'؋ݛ100644 appbar.component.tsFXۚn 7c!J100644 index.ts?Rn!8E# bh6ת xe100644 bottom-navigation.component.scssN,ZҴ2/1{100644 bottom-navigation.component.tszAF蚔 T~(C100644 index.tsi7'?| \nʓ)sAQxs100644 breadcrumb.component.scss&͒!ķȊ3?ba-100644 breadcrumb.component.ts,M[e q100644 index.tsaN))"U}c~;exs100644 index.ts4n տƃ,100644 pagination.component.scssGRL!t<-!3y (!100644 pagination.component.tsM>g-E,arI&]H6xy100644 index.ts2"8cήJ0100644 stepper.component.scssũi> =R=Y100644 stepper.component.tsXc CܯG/l5x+40000 backdropx}qwPd40000 command-paletteYI06`_ꁗG40000 drawer0z4Mx=c40000 floating-toolbarf[྆>100644 index.tsΟ$T&<40000 modalJs)G40000 overlay-container2Hߏc+Dt40000 popover*tb@hx&z􅷨xw100644 backdrop.component.scssY!C2co ނ4100644 backdrop.component.ts.tL\!CفǵB+100644 index.tsu sn5Y5W72xK100644 command-palette-item.component.scss)N+$K<C100644 command-palette-item.component.tsD|W0LF+(x100644 command-palette.component.scssaa&I~2`˨'N9W100644 command-palette.component.ts5UHl$̍100644 command-palette.service.tssX|t7.P$100644 command-palette.types.ts;(WX(**^100644 global-keyboard.directive.ts_9 l$=100644 index.ts?L/b7{=x{100644 drawer.component.scssY]<&T ٔM 100644 drawer.component.tsގa8m Y100644 index.ts;#h-,QL( .j4 xg100644 floating-toolbar.component.scssDY ,7kZ`C,100644 floating-toolbar.component.tsom}uWkX* :100644 index.ts)x`-,2IБ ;Ǣx}100644 index.ts&S~{ZL6M?⪱ D>-5(;z l+Ps˼8uc7H\<J3#.TۛDbz#{r8@$n>M峱%e}[To'g"JvT̼&ZzT!3-Ыi-yB#nn$ؗܗǦ;HJc9޷wF)7lM-^_XeY{%@tZw'ֆ9uKe}[<+M3W.`Z%\{8 s7ON  Ww@'.|mMbģ$fAbSEf ߞ6NE$!.]0^p&2!4P:}κZG^ymNN)H([=l_XN^bݘӥ~T+/HjS8Sx340031Q(.,M*-)MIK-K++N..f:Zwv {?n'j[R0=j_>hv۾K/sx3100644 table-demo.component.ts2l۲铧 .5#bxx340031Q(O,.MIK-K++N..f]k?[Sp 1i[ç<~fGSI15v~]Y!:3k+Bip*x31⌤ĢEkU_Ma^-y'fɨ x340031QHI,HO,JK-K++)f0HY_|C:工 ug&%!,N..f8FYxCk.sp;zV=/j{jƬ|Ax31$6a)v ~g.~;纡BAiRNfnbA^I1^#Rfت{VPx31܂ԼbMuR]=o~-i,)gR a{C?}_x31ҒbrZ-Y7ةU$$d$V2DtXp{? RSSlg21({`|kUOk@3UH{ʇZYPZ_Zy9DL0n^,Q 6_NT7qykO^"XXpVl<]xk}u?DQ~YjЦb"jU~w'[|fcqa'x340031QH*-)K-K++N..fHix7_}uPӈ5ġ6qYMk76v{]$t#><%WvM^=PϬJ8U_\ QE{6sT6]Yû q9f*_]̼ J=c$ݨ:B=y܂T.uwW/&\Pbz&qڶ]֊/#:;(dBKhuv9=ՊQ%0eUtI:sk=6䮼\[b#`7B F/ x340031QKI+)fH'o!_eоw3Bd&%'3 XmcY_o!~m@K|Fq7}U'p6r&x31<եe1nhZ*[bQSXX0C)y_wOJQy_6DARbJz*vm΍Iݯ{TXD>9(f=wvkgiQ{|#\:85aɟ-dYgW+}wyW&X?!yߣ!)e)E ^FlPKO8r-Y驺y%y@s$Rl\{#D!3/%Bv=Xj24Mt Ĵ)T${-Vxfw|F40x31ĜԢ&3沭>r[_{Ss J*uKKRgؓ]!K߱6(d楤V3]T|GBLOLK-.K-bh͢P[ogMSh,(O/J-.M,JIeXW3QU&߼ ӚVQYZ 2hEɣ 1~%:-.BJuSSs RJ􊓋 >g&\|_Gzi+~m@ZK=&ED-Wj\T[\YZnۗ#m>;◄%o`r4+{pf_ˏlS #b9 'kU6{Uڲox340031QHI-*K-K++N..fvpwljy!A9Xbx}m]'&_? :3/%B&y-9k"c|{iQ6#x31Ғ܂ԒT NnxlBoK)7h%g&g'W0y]W(lzSnoU_[ZpaYfeюZV^z(DYJbI*LUެu'v CTe'0͵,\2pl^u@Ue0o/ Kyy=u=k_}140031QKI+)fxi>9}*v˿xUbPf^Ai C[׆؃M%yinU//JLgXی}Bghz1祧d~Wqґ;wܟ5|U iĢ ɟ4ugp`-[SsRK@1WW\\0#i׹_h4g\\):o^&97_:cXePgP2󾬍ZGd9[0((̅NUȑ.r?/+3}`].O xo100644 autocomplete.component.scssΌpѫxF`v6100644 autocomplete.component.tsJ s}xF100644 index.ts_OF店fnAzF<)S2/> 100644 spacer.component.scssL2ބ}WTϺ40000 video-player;1 FS$}%x$dx$40000 dashboard7Q܇i~0ׅ<xG40000 libۆ ղxY=j z100644 public-api.tsg1ǵZW|r"HxG40000 components` 1bR40000 layoutsٽTG^w/Mi:q ƣx100644 app.component.spec.tsG^Mjkb c100644 app.component.ts?ktxq[0100644 app.config.tsd+$Ӓx,/ 5100644 app.routes.ts9:5ˡFs7{ū40000 demosK2T(Y sKYɤ340000 featuresNՕ_.{Xq* |40000 sharedϩô$Zta|aqf_x40000 appbar-demoUCth: IҔ40000 autocomplete-demoCQip0S540000 avatar-demo8L1x,2`?40000 backdrop-demo6)6I '2sK/x 40000 badge-demovaBH40000 button-demo^zʐbb$AS40000 card-demoT-cc3P,O40000 carousel-demo;|o40000 layout-demo<:a3F`[1^040000 list-demoiDzSxxmES40000 loading-spinner-demo!fDRKj)Y4a 40000 menu-demo-lHviJRI40000 modal-demoG&6iC:xոhI40000 overlay-container-demo)\Mm~_+j40000 pagination-demo[fˆW{Ky]ăI40000 progress-demoiwV_J{1&40000 radio-demo$,tqh4aӒ40000 search-demoB@N6v#d?p .*da40000 skeleton-loader-demoan"9폲X40000 spacer-demo-H{gR40000 switch-demoMI(/R%I40000 table-demoߍbn,B^ 40000 time-picker-demo(exd/7ϗ[l40000 video-player-demoN+NǠmЯ}bEgHx4100644 appbar-demo.component.ts({Mvy' Xxv100644 autocomplete-demo.component.scss%5&kt100644 autocomplete-demo.component.ts7$!sr7bDy!f.x4100644 avatar-demo.component.tsP ;2"ĺlxn100644 backdrop-demo.component.scssN{W|1XyeOf݅100644 backdrop-demo.component.tsTWVePKfG,x3100644 badge-demo.component.ts:RiHDBu&"VSx4100644 button-demo.component.tsh4OKhHXTvx2100644 card-demo.component.tsm ~+.8:^LΡX xm100644 carousel-demo.component.scssC͙c/lo"۫100644 carousel-demo.component.ts vһofFޞ100644 index.ts@ҭB\պM2zo9>x6100644 checkbox-demo.component.tsWc !g0檨TϪQx2100644 chip-demo.component.ts0" fjVO:Exp100644 container-demo.component.scssT oDOp100644 container-demo.component.tsXGF;eEȗLj.xj100644 drawer-demo.component.scssVH;e]ǒ100644 drawer-demo.component.tshYWݻN,ЂU:}~,xt100644 empty-state-demo.component.scss/x gfyGҽ8100644 empty-state-demo.component.ts9iUbŝߑWVq1Uxt100644 file-upload-demo.component.scsscx,_ݸPn<@@100644 file-upload-demo.component.tsO7W!h.Ȥxt100644 fontawesome-demo.component.scssq RRϡ*R¼6zN5Aȣx3100644 input-demo.component.ts㰩 =Rڎ] s$gx4100644 layout-demo.component.ts\Ka /A]_L߾yx2100644 list-demo.component.tsZZsY)܀r |+lIWx|100644 loading-spinner-demo.component.scss93]ٱ K~`T100644 loading-spinner-demo.component.ts8~gZ 1/{ &.xf100644 menu-demo.component.scss#l3]pw'C_100644 menu-demo.component.tsZ"՚U(W[)pxh100644 modal-demo.component.scssJ[]ksj.h7u*100644 modal-demo.component.ts*k#Øfe1(Ԩx8100644 pagination-demo.component.tsJ=TY;f i2"xj100644 spacer-demo.component.scssi7meS rhr:100644 spacer-demo.component.ts[Dxyָ [ 9*x4100644 switch-demo.component.ts"=by!8s Klx3100644 table-demo.component.tsZ"l*D|7o->[Iqx$40000 dashboard'g4J7IPxG40000 lib](c" WD4100644 public-api.tsjJuI5̫8Q0}Q9xG40000 componentsT_NU2ly 40000 layoutsAHRU@{840000 data-display݋$~g,40000 feedback=ZwiK9W!5MB40000 forms66$1eDݖ40000 layoutYU\9=C40000 mediaR$c?WqwoLg_40000 navigationFU..P}},@B40000 overlays>8և#9\WlVH7lxu100644 index.ts 'aF$°LZI100644 tab-group.component.scssIv]=9L@Jx100644 tab-group.component.ts85qPyyߞx5ILx?100644 bento-grid-layout.component.scssIFKT۰100644 bento-grid-layout.component.tsZd;fə Ҹr%100644 dashboard-shell-layout.component.scssƮ()ςB{100644 dashboard-shell-layout.component.tsxd sYQS-ĚI100644 feed-layout.component.scsskE%Ĭ/ر]T7100644 feed-layout.component.ts|-kuh'4(7O7100644 grid-container.component.tsaO:W4!/&p!100644 index.ts&htT,Yu100644 kpi-card-layout.component.scss,Hީ_e(Ubz`100644 kpi-card-layout.component.tsm+-)[P1{_100644 list-detail-layout.component.scssʳ{a/D"VD XQv100644 list-detail-layout.component.ts**9{N51; =׶ˢ100644 loading-state-container.component.tsLCy100644 supporting-pane-layout.component.scss3-n~puh100644 supporting-pane-layout.component.tsX\!7~h @s100644 tab-container.component.ts femsVIH-1100644 widget-container.component.scssg>@#lY100644 widget-container.component.tsD`hSz.? B"2^100644 widget-grid-layout.component.scssXrKq1PH`yh׷100644 widget-grid-layout.component.ts9Z cx䶭nbO x_40000 demo-ui-essentialsapf1.炟,9WR40000 shared-uidI!]pȬ(40000 shared-utilsO+~Q>o F0J40000 ui-essentials;ԟnב~C*xq40000 appK/nLSи100644 index.htmlJe}ݒmƏ({^100644 main.ts54c1*۹100644 styles.scssr?yU=hx#100644 README.md7r&pu5Gpa100644 ng-package.jsonԔl P .$- B100644 package.jsonݺD Rel m40000 src5ܨre૱x[B:100644 tsconfig.lib.json#Yf/3Xۯ100644 tsconfig.lib.prod.jsonʬF;_E;pU100644 tsconfig.spec.json%Fw; cc8+ey? x*40000 baseI>]tbW40000 commonsѴT2"h-a}\h40000 fontfacesTu'-hQөW#100644 index.scssoָ"YvPN2V40000 semantic*K1]͌ϕX100644 tokens.scss] 'Q"l- \txY100644 _index.scsseSO.@WRw100644 _semantic-spacing.scssS9RA(b9|na>L4&xG40000 lib?QV)I޹H4l100644 public-api.tsk1eimMFԕ2lx%40000 componentsx340031QKM,/JKLgƻOb/%ъP%yE gEs^`ޒ[ji^Yqr~J*QJ*obGԜ WG_Wq'1~_fgaݗPEy9EzYy bq0a9_bK7gn'mw)ų>O+)Da`MKGߤ.) "6Hzx}AN0 E9E$vf$V%@Z5JbhNO ĊEXrj|/fO3wNEg?{he^o7.AwV3pMܠma_(_;{h(%IT LE=O 6ZkZ{6ljLSo45|MK}pp$x]Qn0  47kӡCc+O JP Lޝ|GLfDݒeTbYBL{--޾̪Qߙ\3uS 3 1W5?n*MFmYOxp?,VJT) Up+9fwGW~?bZ2Pgp9aN/\,y jÝ+a_&1\ѾQ?8_dL:sZ^^Xvq`LKV]zhK i0x2J>jQ{Zӑu5wâ -yNY/˻t3{& wuffitl jxoKdist/ .angular/ # Font files and directories *.woff *.woff2 *.eot *.ttf *.otf assets/fonts/ projects/demo-ui-essentials/public/fonts/ 1*xS# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files. # Compiled output /dist /tmp /out-tsc /bazel-out # Node /node_modules npm-debug.log yarn-error.log # IDEs and editors .idea/ .project .classpath .c9/ *.launch .settings/ *.sublime-workspace # Visual Studio Code .vscode/* !.vscode/settings.json !.vscode/tasks.json !.vscode/launch.json !.vscode/extensions.json .history/* # Miscellaneous /.angular/cache .sass-cache/ /connect.lock /coverage /libpeerconnection.log testem.log /typings # System files .DS_Store Thumbs.db # Font files - exclude large binary font assets /assets/fonts/ *.ttf *.otf *.woff *.woff2 *.eot mx1 1@>RkDt ^B,n2jmadZbAI=T3JpnU+ͧaw]cP.6(A\[u)AI,Ax1O0SȎZDC#b0X}wl 0tcy޽TR x$6 H^j&9R(Մ> 'ݶvXbJ{[mdWcPI %R4+ahh5e 9/&rFN-AO749USI}mh!Q~0P+7aaӶ.SnIΧ{ݣdrٚ@fVʋ4=TWGՔԵ%\e mlNa.筹w̶p Q׽״Y.)cS~{x<S^A6R4U`c7mC-~ܡQD5s4d_h%]Ftncj^*uQf+)QKOrY )|SCHU~W^jW ]pF.TRT%ej.DP ּڒ 1Ea :%.JkPY/*;St(4d|^ݘm%' ~F:~n .I`mY/OO;YzBVb~eT>"&M}pYˆ.a}T`GEW6ik_0z &Jwc@y?f ߜnO< 9jjK^7xG|}W''Zes͗g.'YQMx }/sHcz9#z!u4%tX_Wle65&\9~8欗IjsGՋO6Si1-ZG#.ueፋA~&IK>wN Op-e+wFj!XEql{}qF_O|3Ʈnơ `j]ߪKǝ9(Z_^v0VZKh[0&;]<ӌ*a8Y'Z?U-Vly458)gbҺʪ2AVtd`ϦXVP |h\*P>)ů. jBٜDW_+0e۠+1W'`;[GLO,9m|D!$ѯkKC6\4s5R7[іHW_z˙M,|3T0cASt]&:u>S"`Moj }xV_I!w\\ ,T%/5@%G3ݼb6 Kτ3DB@-zd8ZĥLuqz$r;<֖j.^  ^!۞%!R #l925CaM1M5@{"Ԙ6`"{Q&\b:5PY.33fHON&P'>};}nӗʹ&ȾDZC/ =uxM*|{!(cίS35}HI|U{$ V_ 8gs$IesS yW{S[_ȕN7n @W%] &R>}i=H $)}m~WOYSrÐP C,l^!hdDwzRq̝ƘoY"j0t?T2`BG2:fњo# Bܙ@)h (?Οq`08fQiI^JؐPt-(kݍ޵TC ,`ap/wa"23N{,I3~;#uՅ\&w:$]:yw\T{ 3m͟߾I$=DŽ"v9Nm5p[q)9QQ?!@Bm@ޅSk. 9_Q9RIIc .ɏN+_* >{?:XUZGso샷*ԙ3tk|-,xL%%ui-design-systemui-design-systemui-design-systemui-design-systemZ,ui-design-system": ["./dist/ui-design-systemMui-design-systemX Cui-design-system Cui-design-system Uui-design-systemN >ui-design-system qui-design-systemFui-design-system^,ui-design-system0ui-design-systemy}% x%1 0P*!8CQtqwӎ ^[MRMJ MݧO>>8x,N2Pڱb,Kώe_7Ű;{ޠ?R D0N7rǣ%ݷᡰXV HLG` 7+׋B1 1L yFnbz2+?N[ ׏p5C q\;c&aG"Zʉ;u"K'rtc9 vjBXѵvTRC&C(A?;pc2se/,|w&}=9)i੖" b욷]]qc>R=Đ8. ͫu^h˸v|, rj6,,lv ?efGY4=R'5z@O=mKTQC|!ķ@R,^|{\T{0bRab=,&4ZёF~]*aDS8t †(2V %K TNF(KT7{I%ᎧVxcE3 G N~wzzڋnJ݋Q-eyv Ҷ\a')&mRl'&w_q=e凝Rܚjt;C>Hi^}=d]{Ǚn\ 'xJh,a s9D{w9>Ԫ>voUziR=e}@c q` $)mF\asըnx]7=_x0|J%|brmN)Br)EsphlpkCc{?ߌx>uxWjxۮ j2MT苘):4&vH U򾉞gS<{/N-)t~fJrms5`fB *bvY`);qJމ5H 'TML ˍ'CwU\5-8 A2,b vu#acyO.ЊaRȥz0 yIf<3b/SO7Br9)PG?B ")PO=!hN퉬"MQ͕`&2rn msj 4NБan5C *E*m[ĞL;ߛd:ߛadӥ HM`hŽɞ* tUme` {9Yyd&Tcr @wv|SˁԻu1Z9O! =|\$/$f2 0n+*,̀6Ayd^NF˜t4v}MA COxH:Ul\Yz|Q ^kSÅ`ze#b^`.kA-1,ҚI/2:1@a1Nh=-Q{$zd&k΃X'z=znz@=5,{l_'P_MMf$"VzYΤ~sXB:j@/Ǯ}-GqKd楬^Lz !1^P]=s'=\~\ E 'KSS$Ku9G;ҽUbM[MakO0Ըl= AẅR.+w4RTY–㹽7lIG"[domBz,6F=V<6z<t΃bڰ_oX1nJϾ>ir7n8+]zНn 0lr =ɚa?0}+2Y2cAjN~,g#W11KjzRKo:YZnnBؽ)Y&D#i~˷1+vhө!?3iPo x !d)>ˬnZ٧D 4B p6ƺEHd*HHeZCpB ]j"Π5+D˩+> ׻~SYU4 Q6p@ȩJjP~Zyۘ5m*`s^Ӥ4/.__dOcAKz`i5j}V]rܿcp ,GG 8ہL,Œ.=$@t(pyh OYh$ZIgjmLB}Vu@k^U(m(iBr7XOЧ%zr L%kcȅ>UK5x $-`B(M"SʝˆNUAl[wf*A K/Ƹ2SFp}wJ7`e9 ?Z~B:ZSrVv(g1[,X=RWWYz@ E 05~ B$@!^s&YS XV2zV S36e53 GqNb1\ ,TJt+)w}yˇX3w"$#_PřhnEt<(*(aݗf =XpQI`s.M(O0Ά6l:V+o ar "/ؒL;vÞLDt0vON%ՎJ)ۘP?`_ԓ'`D. cx֔W:7I$w8i`|z).oUnD(cHwJӡptv̮EG{ eұ/X5$r{e/ghQR"d-}i)5 .>^uGC;?ɭ?QQQh-Thl@h|^M<'ZdsHE/l+ N~nB t#'_Hd,s,sf-5Nx`3{3XVz2Bl9k߀ D*W]n7~lt=?YQYQ~ q*t6ȟ]NQۤ YV)KVyokJi"vېu܌VJ-)Ү)B*Cr;>q:fؤ=SaL8frủ.B~FĖn 35/H7"R]:oq78w2Wcj}MpN(!1Crgzu#[92"v.W-v6ڳi;ERZn+%z?_iT‘xG I|dSl fBk,]a&XdKB; %HL-b^3ED*[ose06܅J Cgg!yn}߀:raxdjDn\ቮQH-?=eڙW{;Ց`a7770袖yz$Jj *K+,مxȬ"pAn1SעQ2%^[+4tԪ7  "*loOEB$=ZfUnӼ#`JZ"'$F48_&4`!Ǒ;|ڠg,U`r,٫/dj|\ 2b_F7.ΐ" IkE-$Jo]]J3B?)V>}˅'A7FMKfl`%]npUo)Zq: j)fܽMW|۬Џ֠_vG+c$6@gyƌ8E;n"ޒ*q GFJJ Yxoym:dցoZhcĈyY*Ջ27kędasƮi7L*62)Za0e(#]6_R#P꭪ [`Ph ()Gɧ;$4ZI&5ŀJJ6Ep&hUG 6ku]7Zy(Y'9T"yr8/`? zf;9ULo㌩c0.b%9.- YZ\Gldت(H"09v%BǼQ<TGRr=RPJ RJHG8ơ^7h]5 p mO7g*~''¾a[4x6)]4> ^ QFxl#N7#  Zu?<ŷgzmzkuv5BUV 2WEXj"R vm rĉM`k@$\LALڐ?pYfh&_4,0@^- ɋzC|EiFKdA*LW؉*\$ 7 2YU(O*Y񱡖?~"MCNPx(Eg_DAXs([Ê81T `OdVf\$d ]2XU{jBQӴiRJ&% & J{1/,t+HmΧ%|^P~>x4 (AN`:TOr+=}/4xxhe%l҅ha?OJj/"HO]YTލaVOSVg|o,a s.| v'.}@9B`bQ!g҆ZB ܼS|H+bE e}rw3EIe`:eM2}D5J=Q}^GLfe1HJ-bf _T#? ̞Y ]i(5v2@u&S\,(8AwI=2p-,X׭g+ˈq'l=DQACBh )$RM:R -QvL`ܦ]ro\ #L{khDipIxvBYj%|7-3.M{,cs?iV7~P5 _yPru km" Wړyݎ@VRj;!ՎV3*7D $R5g1pXY Y5xCJ/`6|4C'Ĝ#yR`|c9P4F#CcvLo+9W|]5lt0[7$N)nwH PçTџW2\ _?(QbՈ7-8AzoD` \QUwDyG3*64*:SMl.>T끟rvAXtzGsf*2QMWRk:[ Tc ]R 3Ŕ .H`DA~^JQ&Lŵ2ڟq9$_ɜa7X&~|&/2UîuvNYco鄪׸$J>şN+/b\-)S;čo!Jǀ'5ykQG6rO;-1JJ mry)kUu2E^~ȉn r3UG4YftFO5ZF_{8zF.qn,UYGf@i;Ďzӗ&Lg8WLUQ% 5Z-uT~MGI1L4cWqa/K*"Ò?ak].+Bz}A5˜<#ޝ_GODb%-SwcLI1eD> ^ *K?$`߃A9Pg_w_󅭆e?C+C7L0+}9?D9gf\WvLCk*((݂摝P1>A 譆TE᠑;ѣQH);= H"snĈ-@MN# 9(w1[{Dk*SPAh5B=3p9*N/NbO3FAhge;LT | T] #FOr>ע.dlª飻U%bc k3TygtӨ vǎMNצ(a6axWnS9S 9Y iJ |Zj}.y:dqt%$T378z V %mI%!V;2S?-Nk.-LʕTÝSӂÝkxr ep'!?L h /keUAa4Wj;AN?5+O%-F3Ҽo/IkT'81b܈:9PN2.lD7T2jå!̬l!&/at2dʐ{jixK5))D5&[h2mϭjQpcDNکZ f:kTҎ0X 8 *6+rdcB*|^:@A -pXE uJKF1B1>B$%|E ZS,v[s3nE̋?6^nM>{h@Dj`0\j^N9AZIF3aB{vM 'p1[, flxCѱ3BKaA(?|1w`iO'l=exhSa_Jiv3-{!p] 9-=encOǏIHҊ߾A $Rd"O^ϳ%٫śr1O$T`p׃;J.*w֊=`)77TW4 ȍ.|^'kudrRvy)Ef wbQ)6aWvLzuǝSmDٌȀh㔌Cʝ(KEŇ֮MAxWQaN\/KM\K8ټvN͚`\8LcYVmW7NXfOޥA-@}+ᖗ3 EB)|h'!%xrcWRV³j2|:A+!%Ҳ'f>N7פ SX"I|s{|~8Řh2aQMM/p\eメj8yYg |!_|d»$ ;5伇3H^;[.imG߸ޢxҿeubi34@(2*WZ-oX 0( [xE# UiCodeDisplay This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.2.0. ## Code scaffolding Angular CLI includes powerful code scaffolding tools. To generate a new component, run: ```bash ng generate component component-name ``` For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run: ```bash ng generate --help ``` ## Building To build the library, run: ```bash ng build ui-code-display ``` This command will compile your project, and the build artifacts will be placed in the `dist/` directory. ### Publishing the Library Once the project is built, you can publish your library by following these steps: 1. Navigate to the `dist` directory: ```bash cd dist/ui-code-display ``` 2. Run the `npm publish` command to publish your library to the npm registry: ```bash npm publish ``` ## Running unit tests To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command: ```bash ng test ``` ## Running end-to-end tests For end-to-end (e2e) testing, run: ```bash ng e2e ``` Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs. ## Additional Resources For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page. GxeN02\$F$VmAeFJqKc,*,Q1qI: 1Y}.ưZՆ8OwhW"u``)B4X*?\%`0ŝq Ǵ@{!@ޙf)#HKff]xI|>K{k2͆썵kJ%:l4@E'vE@$ c1~> f|\/)֥xw U^WYGOAf q<&ÛgX6Bז'$yu=OMe^1VDa:8O?_b)x4 # HclStudio hcl-studio hcl-studioUxŽWY!8#(5%$3x# Fb0_$?j&_ x: # UiBackgrounds backgrounds backgroundsfRx6 # UiDataUtils data-utils data-utilsJxŽKY!8#(5%4s# Fb0G4s3F)d.?j&}GxŽ[@Y!4'1/%3/= 1=x#iFnHd3FYt!~LVP)x7 # UiEssentia  ui-essentia ui-essentiaL x {{ ctaPrimary.text }} ` }) ``` #### Design System Integration ```scss @use 'ui-design-system/src/styles/tokens' as tokens; @use 'ui-design-system/src/styles/mixins' as mixins; .hero-section { @include mixins.section-padding(); background: linear-gradient( 135deg, tokens.$color-primary-500, tokens.$color-primary-700 ); &__title { @include mixins.typography-display-large(); color: tokens.$color-text-on-primary; margin-bottom: tokens.$spacing-content-medium; } &__subtitle { @include mixins.typography-body-large(); color: tokens.$color-text-on-primary-muted; } } ``` ### Demo Implementation - Create `hero-sections-demo` component - Showcase all hero variants - Include interactive configuration panel - Demonstrate responsive behavior ### Deliverables 1. Library project structure 2. Three hero components with full functionality 3. Comprehensive demo page 4. Unit tests for all components 5. Documentation with usage examples --- ## Phase 2: Feature Sections & Social Proof ### Objective Build components for showcasing product features and establishing credibility. ### Timeline: 3-4 weeks ### Components to Implement #### 2.1 FeatureGrid Component ```typescript interface FeatureGridConfig { features: FeatureItem[]; columns: 2 | 3 | 4; iconStyle: 'outline' | 'filled' | 'duotone'; layout: 'card' | 'minimal' | 'centered'; } interface FeatureItem { icon: string; // FontAwesome icon name title: string; description: string; link?: { text: string; url: string; }; } ``` **Integration:** - Use `ui-essentials` Card component as base - Apply `ui-design-system` grid system - Integrate FontAwesome icons - Add hover animations from `ui-animations` #### 2.2 FeatureShowcase Component ```typescript interface FeatureShowcaseConfig { features: FeatureShowcaseItem[]; alternateLayout: boolean; imageAspectRatio: '16:9' | '4:3' | '1:1'; } interface FeatureShowcaseItem { title: string; description: string; image: string; benefits?: string[]; cta?: CTAButton; } ``` **Features:** - Alternating left/right layouts - Image lazy loading - Smooth scroll animations - Responsive stacking #### 2.3 TestimonialCarousel Component ```typescript interface TestimonialCarouselConfig { testimonials: Testimonial[]; autoplay: boolean; showAvatars: boolean; variant: 'card' | 'quote' | 'minimal'; } interface Testimonial { quote: string; author: string; title?: string; company?: string; avatar?: string; rating?: number; } ``` **Integration:** - Extend existing carousel functionality - Use `ui-essentials` Avatar component - Apply smooth transitions from `ui-animations` - Implement touch/swipe gestures #### 2.4 LogoCloud Component ```typescript interface LogoCloudConfig { logos: CompanyLogo[]; layout: 'grid' | 'marquee' | 'carousel'; grayscale: boolean; hoverEffects: boolean; } interface CompanyLogo { name: string; logo: string; url?: string; width?: number; } ``` #### 2.5 StatisticsDisplay Component ```typescript interface StatisticsDisplayConfig { stats: StatisticItem[]; layout: 'horizontal' | 'grid' | 'centered'; animateNumbers: boolean; backgroundVariant: 'transparent' | 'subtle' | 'accent'; } interface StatisticItem { value: string | number; label: string; suffix?: string; prefix?: string; description?: string; } ``` ### Styling Architecture ```scss // Feature components base styles .feature-grid { @include mixins.responsive-grid( $mobile: 1, $tablet: 2, $desktop: var(--columns, 3) ); gap: tokens.$spacing-content-large; &__item { @include mixins.card-base(); padding: tokens.$spacing-content-medium; border-radius: tokens.$border-radius-large; &:hover { @include mixins.elevation-hover(); transform: translateY(-2px); transition: tokens.$transition-medium; } } &__icon { width: 48px; height: 48px; color: tokens.$color-primary-500; margin-bottom: tokens.$spacing-element-medium; } &__title { @include mixins.typography-heading-small(); margin-bottom: tokens.$spacing-element-small; } &__description { @include mixins.typography-body-medium(); color: tokens.$color-text-secondary; } } ``` ### Demo Implementation - `feature-sections-demo` with grid and showcase variants - `social-proof-demo` with testimonials and logos - Interactive configuration panels - Performance optimization examples --- ## Phase 3: Conversion & Call-to-Action ### Objective Implement high-converting components focused on user actions and conversions. ### Timeline: 3-4 weeks ### Components to Implement #### 3.1 CTASection Component ```typescript interface CTASectionConfig { title: string; description?: string; ctaPrimary: CTAButton; ctaSecondary?: CTAButton; backgroundType: 'gradient' | 'pattern' | 'image' | 'solid'; urgency?: UrgencyConfig; } interface UrgencyConfig { type: 'countdown' | 'limited-offer' | 'social-proof'; text: string; endDate?: Date; remaining?: number; } ``` **Features:** - Multiple background variants - Urgency indicators - A/B testing data attributes - Conversion tracking hooks #### 3.2 PricingTable Component ```typescript interface PricingTableConfig { plans: PricingPlan[]; billingToggle: BillingToggle; featuresComparison: boolean; highlightedPlan?: string; } interface PricingPlan { id: string; name: string; price: PriceStructure; features: PricingFeature[]; cta: CTAButton; badge?: string; popular?: boolean; } interface PriceStructure { monthly: number; yearly: number; currency: string; suffix?: string; // per user, per month, etc. } ``` **Integration:** - Use `ui-essentials` Table component for feature comparison - Implement smooth toggle animations - Apply pricing card hover effects - Include form validation for CTAs #### 3.3 NewsletterSignup Component ```typescript interface NewsletterSignupConfig { title: string; description?: string; placeholder: string; ctaText: string; privacyText?: string; successMessage: string; variant: 'inline' | 'modal' | 'sidebar' | 'footer'; } ``` **Features:** - Email validation - GDPR compliance options - Success/error states - Integration with email services #### 3.4 ContactForm Component ```typescript interface ContactFormConfig { fields: FormField[]; submitText: string; successMessage: string; layout: 'single-column' | 'two-column' | 'inline'; validation: ValidationRules; } interface FormField { type: 'text' | 'email' | 'tel' | 'textarea' | 'select' | 'checkbox'; name: string; label: string; placeholder?: string; required: boolean; options?: SelectOption[]; } ``` **Integration:** - Extend `ui-essentials` form components - Apply `shared-utils` validation - Include accessibility features - Support for custom field types ### Advanced Styling ```scss // CTA Section with gradient backgrounds .cta-section { @include mixins.section-padding(); position: relative; overflow: hidden; &--gradient { background: linear-gradient( 135deg, tokens.$color-primary-500 0%, tokens.$color-primary-700 50%, tokens.$color-accent-500 100% ); } &--pattern { background-color: tokens.$color-surface-secondary; background-image: url('data:image/svg+xml,...'); // Pattern SVG background-size: 60px 60px; } &__content { position: relative; z-index: 2; max-width: 800px; margin: 0 auto; text-align: center; } &__title { @include mixins.typography-display-medium(); color: tokens.$color-text-on-primary; margin-bottom: tokens.$spacing-content-medium; } } // Pricing table responsive design .pricing-table { @include mixins.responsive-grid( $mobile: 1, $tablet: 2, $desktop: 3 ); gap: tokens.$spacing-content-medium; &__plan { @include mixins.card-elevated(); position: relative; padding: tokens.$spacing-content-large; border-radius: tokens.$border-radius-large; &--popular { border: 2px solid tokens.$color-primary-500; transform: scale(1.05); &::before { content: 'Most Popular'; position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: tokens.$color-primary-500; color: tokens.$color-text-on-primary; padding: tokens.$spacing-element-small tokens.$spacing-element-medium; border-radius: tokens.$border-radius-medium; font-size: tokens.$font-size-small; font-weight: tokens.$font-weight-semibold; } } } } ``` --- ## Phase 4: Navigation & Footer ### Objective Create comprehensive navigation and footer systems for complete website layouts. ### Timeline: 2-3 weeks ### Components to Implement #### 4.1 LandingHeader Component ```typescript interface LandingHeaderConfig { logo: LogoConfig; navigation: NavigationItem[]; cta?: CTAButton; variant: 'transparent' | 'solid' | 'blur'; sticky: boolean; mobileBreakpoint: number; } interface LogoConfig { src?: string; text?: string; href: string; width?: number; height?: number; } interface NavigationItem { label: string; href?: string; children?: NavigationItem[]; megaMenu?: MegaMenuConfig; } ``` **Features:** - Smooth scroll spy - Mobile hamburger menu - Transparent/solid transitions - Mega menu support #### 4.2 MegaMenu Component ```typescript interface MegaMenuConfig { columns: MegaMenuColumn[]; width: 'container' | 'full' | 'auto'; showOnHover: boolean; } interface MegaMenuColumn { title?: string; items: NavigationItem[]; featured?: FeaturedContent; } ``` #### 4.3 FooterSection Component ```typescript interface FooterSectionConfig { columns: FooterColumn[]; newsletter?: NewsletterSignupConfig; socialLinks?: SocialLink[]; copyright: string; logo?: LogoConfig; variant: 'simple' | 'comprehensive' | 'minimal'; } interface FooterColumn { title: string; links: FooterLink[]; } interface FooterLink { text: string; href: string; external?: boolean; } ``` #### 4.4 StickyNavbar Component ```typescript interface StickyNavbarConfig extends LandingHeaderConfig { hideOnScroll: boolean; showAfter: number; // pixels shrinkOnScroll: boolean; } ``` ### Navigation Styling ```scss .landing-header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; transition: tokens.$transition-medium; &--transparent { background: transparent; backdrop-filter: blur(10px); } &--solid { background: tokens.$color-surface-primary; box-shadow: tokens.$shadow-small; } &__container { @include mixins.container-max-width(); display: flex; align-items: center; justify-content: space-between; padding: tokens.$spacing-element-medium tokens.$spacing-container; } &__nav { display: flex; align-items: center; gap: tokens.$spacing-element-large; @media (max-width: tokens.$breakpoint-tablet) { display: none; } } &__nav-item { @include mixins.typography-body-medium(); color: tokens.$color-text-primary; text-decoration: none; position: relative; padding: tokens.$spacing-element-small 0; &:hover { color: tokens.$color-primary-500; } &::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: tokens.$color-primary-500; transition: width tokens.$transition-fast; } &:hover::after { width: 100%; } } } ``` --- ## Phase 5: Content Sections & Templates ### Objective Complete the library with supplementary content components and ready-to-use page templates. ### Timeline: 4-5 weeks ### Components to Implement #### 5.1 Content Components ##### FAQSection Component ```typescript interface FAQSectionConfig { title: string; description?: string; faqs: FAQItem[]; searchable: boolean; categories?: string[]; } interface FAQItem { id: string; question: string; answer: string; category?: string; } ``` ##### TeamGrid Component ```typescript interface TeamGridConfig { title: string; members: TeamMember[]; columns: 2 | 3 | 4; showSocial: boolean; } interface TeamMember { name: string; role: string; bio?: string; avatar: string; social?: SocialLinks; } ``` ##### TimelineSection Component ```typescript interface TimelineSectionConfig { title: string; events: TimelineEvent[]; orientation: 'vertical' | 'horizontal'; variant: 'minimal' | 'detailed' | 'milestone'; } interface TimelineEvent { date: string; title: string; description: string; image?: string; milestone?: boolean; } ``` #### 5.2 Page Templates ##### SaaSLandingPage Template ```typescript interface SaaSLandingPageConfig { hero: HeroSectionConfig; features: FeatureGridConfig; socialProof: TestimonialCarouselConfig; pricing: PricingTableConfig; cta: CTASectionConfig; footer: FooterSectionConfig; } ``` **Template Structure:** 1. Header with transparent navigation 2. Hero section with product demo 3. Feature showcase (3-column grid) 4. Social proof (testimonials + logo cloud) 5. Pricing section 6. FAQ section 7. Final CTA section 8. Comprehensive footer ##### ProductLandingPage Template ```typescript interface ProductLandingPageConfig { hero: HeroWithImageConfig; features: FeatureShowcaseConfig; gallery: ProductGallery; reviews: ReviewSection; purchase: PurchaseSection; } ``` ##### AgencyLandingPage Template ```typescript interface AgencyLandingPageConfig { hero: HeroSectionConfig; services: FeatureGridConfig; portfolio: PortfolioSection; team: TeamGridConfig; testimonials: TestimonialCarouselConfig; contact: ContactFormConfig; } ``` ### Template Implementation ```typescript @Component({ selector: 'ui-saas-landing-page', template: `

`, styleUrls: ['./saas-landing-page.component.scss'] }) export class SaaSLandingPageComponent { @Input() config!: SaaSLandingPageConfig; } ``` ## Technical Specifications ### Performance Requirements - Lazy loading for all images - Code splitting by component category - Tree-shakeable exports - Optimal bundle size (<50kb per component category) - Lighthouse score >90 for demo pages ### Accessibility Standards - WCAG 2.1 AA compliance - Proper ARIA labels and roles - Keyboard navigation support - Screen reader optimization - Color contrast ratios >4.5:1 ### Browser Support - Chrome/Edge 90+ - Firefox 88+ - Safari 14+ - Mobile browsers (iOS Safari, Chrome Mobile) ### Testing Strategy - Unit tests: >90% coverage - Component integration tests - Visual regression tests - Performance benchmarks - Accessibility automated testing ### Documentation Requirements - Storybook integration - API documentation with examples - Usage guidelines - Design system integration guide - Migration guides ## Integration Checklist ### Design System Integration - [ ] Import design tokens correctly - [ ] Use consistent spacing hierarchy - [ ] Apply typography scale - [ ] Implement color system - [ ] Follow component naming conventions ### UI Essentials Integration - [ ] Extend existing components where applicable - [ ] Reuse layout components (Container, Flex, Grid) - [ ] Apply consistent button styles - [ ] Use existing form components - [ ] Maintain consistent component API patterns ### Animation Integration - [ ] Apply entrance animations - [ ] Add hover/interaction effects - [ ] Implement scroll-triggered animations - [ ] Use consistent easing curves - [ ] Optimize for performance ### Utilities Integration - [ ] Use shared validation logic - [ ] Apply common helper functions - [ ] Implement consistent error handling - [ ] Use shared interfaces where applicable ## Success Metrics ### Development Metrics - All components implement consistent APIs - 100% TypeScript coverage - Zero accessibility violations - Performance budgets met - Documentation completeness ### Usage Metrics - Component adoption rate - Bundle size impact - Build time impact - Developer satisfaction scores - Community contributions ## Conclusion This implementation plan provides a structured approach to building a comprehensive ui-landing-pages library that integrates seamlessly with the existing SSuite ecosystem. By following this phased approach, the team can deliver value incrementally while maintaining high quality standards and consistency across all components. The resulting library will enable rapid development of professional landing pages and marketing websites while ensuring accessibility, performance, and maintainability standards are met.}%ڽ x\B# UI Landing Pages Library Implementation Plan ## Executive Summary This document outlines the implementation strategy for creating a comprehensive `ui-landing-pages` library within the SSuite Angular workspace. The library will provide production-ready components specifically designed for building modern websites and landing pages, leveraging Angular 19 features and integrating seamlessly with existing libraries: `ui-design-system`, `ui-essentials`, `ui-animations`, `ui-backgrounds`, `ui-code-display`, and `shared-utils`. ## Technical Foundation ### Angular 19 Requirements - **Standalone Components**: All components will be standalone (no NgModules) - **Control Flow Syntax**: Use `@if`, `@for`, `@switch` (not `*ngIf`, `*ngFor`) - **Signals**: Prefer signals over observables for state management - **Inject Function**: Use `inject()` function over constructor injection - **OnPush Change Detection**: Default for all components - **@defer**: Implement lazy loading where appropriate ### Design System Integration #### Token Import Path ```scss // Correct import path for semantic tokens @use '../../../../../ui-design-system/src/styles/semantic/index' as *; ``` #### Typography Strategy The design system provides comprehensive typography tokens as maps and single values: - **Headings**: Use `$semantic-typography-heading-h1` through `h5` (maps) - **Body Text**: Use `$semantic-typography-body-large/medium/small` (maps) - **Component Text**: Use `$semantic-typography-button-*` variants (maps) #### Component Architecture Principles - **NO hardcoded values**: All styling must use semantic tokens - **BEM methodology**: Consistent class naming convention - **Component composition**: Leverage existing `ui-essentials` components - **Accessibility first**: WCAG 2.1 AA compliance required ## Architecture Overview ### Library Structure ``` projects/ui-landing-pages/ ├── src/ │ ├── lib/ │ │ ├── components/ │ │ │ ├── heroes/ # Hero section components │ │ │ ├── features/ # Feature showcase components │ │ │ ├── social-proof/ # Testimonials, logos, stats │ │ │ ├── conversion/ # CTAs, pricing, forms │ │ │ ├── navigation/ # Headers, menus, footers │ │ │ ├── content/ # FAQ, team, timeline │ │ │ └── templates/ # Complete page templates │ │ ├── services/ # Landing page utilities │ │ ├── interfaces/ # TypeScript interfaces │ │ └── directives/ # Reusable directives │ ├── public-api.ts │ └── test.ts ├── ng-package.json ├── package.json ├── tsconfig.lib.json ├── tsconfig.lib.prod.json ├── tsconfig.spec.json └── README.md ``` ### Component Naming Convention All components follow the pattern: `ui-lp-[component-name]` - Prefix: `ui-lp-` (ui landing pages) - Examples: `ui-lp-hero`, `ui-lp-feature-grid`, `ui-lp-pricing-table` ## Implementation Phases --- ## Phase 1: Foundation & Hero Components ### Objective Establish library foundation and implement essential hero section components using Angular 19 best practices. ### Components to Implement #### 1.1 HeroSection Component (`ui-lp-hero`) **TypeScript Implementation**: ```typescript import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ButtonComponent } from 'ui-essentials'; import { ContainerComponent } from 'ui-essentials'; import { AnimationDirective } from 'ui-animations'; export interface HeroConfig { title: string; subtitle?: string; ctaPrimary?: CTAButton; ctaSecondary?: CTAButton; backgroundType?: 'solid' | 'gradient' | 'image' | 'video' | 'animated'; alignment?: 'left' | 'center' | 'right'; minHeight?: 'full' | 'large' | 'medium'; animationType?: 'fade' | 'slide' | 'zoom'; } export interface CTAButton { text: string; variant: 'primary' | 'secondary' | 'outline'; size?: 'sm' | 'md' | 'lg'; icon?: string; action: () => void; } @Component({ selector: 'ui-lp-hero', standalone: true, imports: [CommonModule, ButtonComponent, ContainerComponent, AnimationDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `

{{ config().title }}

@if (config().subtitle) {

{{ config().subtitle }}

} @if (config().ctaPrimary || config().ctaSecondary) {
@if (config().ctaPrimary) { {{ config().ctaPrimary.text }} } @if (config().ctaSecondary) { {{ config().ctaSecondary.text }} }
}
@if (config().backgroundType === 'animated') { }
`, styleUrl: './hero-section.component.scss' }) export class HeroSectionComponent { config = signal({ title: '', alignment: 'center', backgroundType: 'solid', minHeight: 'large' }); @Input() set configuration(value: HeroConfig) { this.config.set(value); } @Output() ctaClicked = new EventEmitter(); handleCTAClick(cta: CTAButton): void { cta.action(); this.ctaClicked.emit(cta); } } ``` **SCSS Implementation**: ```scss @use '../../../../../ui-design-system/src/styles/semantic/index' as *; .ui-lp-hero { position: relative; display: flex; align-items: center; width: 100%; // Min Height Variants &--full { min-height: 100vh; } &--large { min-height: 80vh; } &--medium { min-height: 60vh; } // Background Variants &--solid { background: $semantic-color-surface-primary; } &--gradient { background: linear-gradient( 135deg, $semantic-color-primary, $semantic-color-secondary ); } &--animated { background: $semantic-color-surface-primary; overflow: hidden; } // Content Container &__content { position: relative; z-index: $semantic-z-index-dropdown; padding: $semantic-spacing-layout-section-lg 0; } // Alignment Variants &--left &__content { text-align: left; } &--center &__content { text-align: center; margin: 0 auto; max-width: 800px; } &--right &__content { text-align: right; } // Typography &__title { font-family: map-get($semantic-typography-heading-h1, font-family); font-size: map-get($semantic-typography-heading-h1, font-size); font-weight: map-get($semantic-typography-heading-h1, font-weight); line-height: map-get($semantic-typography-heading-h1, line-height); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-content-heading; .ui-lp-hero--gradient &, .ui-lp-hero--image & { color: $semantic-color-on-primary; } } &__subtitle { font-family: map-get($semantic-typography-body-large, font-family); font-size: map-get($semantic-typography-body-large, font-size); font-weight: map-get($semantic-typography-body-large, font-weight); line-height: map-get($semantic-typography-body-large, line-height); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-content-paragraph; .ui-lp-hero--gradient &, .ui-lp-hero--image & { color: $semantic-color-on-primary; opacity: $semantic-opacity-subtle; } } &__actions { display: flex; gap: $semantic-spacing-component-md; margin-top: $semantic-spacing-layout-section-sm; .ui-lp-hero--center & { justify-content: center; } .ui-lp-hero--right & { justify-content: flex-end; } } // Animated Background &__animated-bg { position: absolute; inset: 0; background: linear-gradient( -45deg, $semantic-color-primary, $semantic-color-secondary, $semantic-color-primary, $semantic-color-secondary ); background-size: 400% 400%; animation: gradientShift 15s ease infinite; z-index: $semantic-z-index-dropdown - 1; } // Responsive Design @media (max-width: $semantic-breakpoint-md - 1) { &--full { min-height: 100svh; // Use small viewport height for mobile } &__title { font-family: map-get($semantic-typography-heading-h2, font-family); font-size: map-get($semantic-typography-heading-h2, font-size); font-weight: map-get($semantic-typography-heading-h2, font-weight); line-height: map-get($semantic-typography-heading-h2, line-height); } &__actions { flex-direction: column; align-items: stretch; } } @media (max-width: $semantic-breakpoint-sm - 1) { &__title { font-family: map-get($semantic-typography-heading-h3, font-family); font-size: map-get($semantic-typography-heading-h3, font-size); font-weight: map-get($semantic-typography-heading-h3, font-weight); line-height: map-get($semantic-typography-heading-h3, line-height); } &__subtitle { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); } } } // Keyframes for animated background @keyframes gradientShift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } ``` #### 1.2 HeroWithImage Component (`ui-lp-hero-image`) Similar structure with image handling capabilities, lazy loading, and responsive image optimization. #### 1.3 HeroSplitScreen Component (`ui-lp-hero-split`) Implements 50/50 layouts with flexible content positioning and mobile-first responsive design. ### Integration with Existing Libraries **UI Essentials Components**: - `ButtonComponent` for CTAs - `ContainerComponent` for responsive layout - `ImageComponent` for optimized image loading - `FlexComponent` for flexible layouts **UI Animations**: - `AnimationDirective` for entrance effects - `ScrollTriggerDirective` for scroll-based animations - `ParallaxDirective` for depth effects **UI Backgrounds**: - `GradientBackgroundComponent` for dynamic backgrounds - `ParticleBackgroundComponent` for animated effects - `VideoBackgroundComponent` for video backgrounds --- ## Phase 2: Feature Sections & Social Proof ### Components to Implement #### 2.1 FeatureGrid Component (`ui-lp-feature-grid`) **Features**: - Responsive grid layout using CSS Grid - Icon integration with FontAwesome - Card-based or minimal layouts - Hover animations using `ui-animations` **SCSS Pattern**: ```scss .ui-lp-feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: $semantic-spacing-grid-gap-lg; &__item { padding: $semantic-spacing-component-lg; background: $semantic-color-surface-elevated; border-radius: $semantic-border-card-radius; box-shadow: $semantic-shadow-card-rest; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; &:hover { box-shadow: $semantic-shadow-card-hover; transform: translateY(-2px); } } &__icon { font-size: $semantic-sizing-icon-navigation; color: $semantic-color-primary; margin-bottom: $semantic-spacing-component-md; } &__title { font-family: map-get($semantic-typography-heading-h4, font-family); font-size: map-get($semantic-typography-heading-h4, font-size); font-weight: map-get($semantic-typography-heading-h4, font-weight); line-height: map-get($semantic-typography-heading-h4, line-height); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-sm; } &__description { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); color: $semantic-color-text-secondary; } } ``` #### 2.2 TestimonialCarousel Component (`ui-lp-testimonials`) Leverages existing carousel functionality with custom testimonial card design. #### 2.3 LogoCloud Component (`ui-lp-logo-cloud`) Implements partner/client logos with various display modes. #### 2.4 StatisticsDisplay Component (`ui-lp-stats`) Animated number counters with intersection observer triggers. --- ## Phase 3: Conversion Components ### Components to Implement #### 3.1 PricingTable Component (`ui-lp-pricing`) **Features**: - Monthly/yearly toggle with smooth transitions - Popular plan highlighting - Feature comparison matrix - Responsive card layout **Angular Implementation Pattern**: ```typescript import { Component, Input, signal, computed } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SwitchComponent } from 'ui-essentials'; import { TableComponent } from 'ui-essentials'; @Component({ selector: 'ui-lp-pricing', standalone: true, imports: [CommonModule, SwitchComponent, TableComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

{{ title }}

@if (showBillingToggle) {
Monthly Yearly @if (yearlySavings) { Save {{ yearlySavings }}% }
}
@for (plan of plans(); track plan.id) {
@if (plan.badge) {
{{ plan.badge }}
}

{{ plan.name }}

{{ plan.currency }} {{ currentPrice(plan) }} /{{ isYearly() ? 'year' : 'month' }}
    @for (feature of plan.features; track feature.id) {
  • @if (feature.included) { } @else { } {{ feature.text }}
    • }
{{ plan.ctaText || 'Get Started' }}
}
` }) export class PricingTableComponent { @Input() plans = signal([]); @Input() title = 'Choose Your Plan'; @Input() showBillingToggle = true; @Input() yearlySavings = 20; isYearly = signal(false); currentPrice = computed(() => (plan: PricingPlan) => { return this.isYearly() ? plan.yearlyPrice : plan.monthlyPrice; }); selectPlan(plan: PricingPlan): void { // Implementation } } ``` #### 3.2 CTASection Component (`ui-lp-cta`) High-converting call-to-action sections with urgency indicators. #### 3.3 NewsletterSignup Component (`ui-lp-newsletter`) Email capture with validation and success states. --- ## Phase 4: Navigation & Layout ### Components to Implement #### 4.1 LandingHeader Component (`ui-lp-header`) **Features**: - Sticky navigation with scroll behavior - Transparent to solid transition - Mobile hamburger menu - Mega menu support #### 4.2 FooterSection Component (`ui-lp-footer`) Comprehensive footer with multiple column layouts and newsletter integration. --- ## Phase 5: Content & Templates ### Content Components #### 5.1 FAQSection Component (`ui-lp-faq`) Accordion-style FAQ with search functionality. #### 5.2 TeamGrid Component (`ui-lp-team`) Team member cards with social links. #### 5.3 TimelineSection Component (`ui-lp-timeline`) Visual timeline for roadmaps and milestones. ### Page Templates #### 5.4 Complete Landing Page Templates Pre-built templates combining all components: - **SaaS Landing Page**: Hero → Features → Social Proof → Pricing → CTA - **Product Landing Page**: Hero → Product Showcase → Reviews → Purchase - **Agency Landing Page**: Hero → Services → Portfolio → Team → Contact --- ## Technical Implementation Guidelines ### Performance Optimization - **Lazy Loading**: Use `@defer` for below-fold components - **Image Optimization**: Implement responsive images with srcset - **Bundle Size**: Tree-shakeable exports, <50kb per component - **Critical CSS**: Inline critical styles for above-fold content ### Accessibility Requirements - **ARIA Labels**: Proper semantic HTML and ARIA attributes - **Keyboard Navigation**: Full keyboard support with visible focus - **Screen Readers**: Meaningful alt text and announcements - **Color Contrast**: Minimum 4.5:1 ratio for text ### Testing Strategy ```typescript // Example test structure describe('HeroSectionComponent', () => { let component: HeroSectionComponent; let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ imports: [HeroSectionComponent] }).compileComponents(); fixture = TestBed.createComponent(HeroSectionComponent); component = fixture.componentInstance; }); it('should apply correct alignment class', () => { component.configuration = { title: 'Test', alignment: 'left' }; fixture.detectChanges(); const element = fixture.nativeElement.querySelector('.ui-lp-hero'); expect(element).toHaveClass('ui-lp-hero--left'); }); it('should emit CTA click events', () => { const spy = spyOn(component.ctaClicked, 'emit'); const mockCTA = { text: 'Click', variant: 'primary' as const, action: () => {} }; component.handleCTAClick(mockCTA); expect(spy).toHaveBeenCalledWith(mockCTA); }); }); ``` ### Demo Application Integration Each component will have a comprehensive demo in `demo-ui-essentials`: ```typescript // demos.routes.ts addition @case ("landing-hero") { } @case ("landing-features") { } @case ("landing-pricing") { } // ... etc ``` ### Build Configuration ```json // ng-package.json { "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", "dest": "../../dist/ui-landing-pages", "lib": { "entryFile": "src/public-api.ts" } } ``` --- ## Quality Assurance Checklist ### Design System Compliance - [ ] All colors from `$semantic-color-*` tokens only - [ ] All spacing from `$semantic-spacing-*` tokens only - [ ] Typography using `map-get()` for map tokens - [ ] Shadows from `$semantic-shadow-*` tokens only - [ ] Borders from `$semantic-border-*` tokens only - [ ] No hardcoded values anywhere ### Angular 19 Standards - [ ] Standalone components throughout - [ ] New control flow syntax (@if, @for, @switch) - [ ] Signals for state management - [ ] OnPush change detection - [ ] Proper TypeScript typing ### Component Quality - [ ] BEM class naming convention - [ ] Responsive design implemented - [ ] Accessibility standards met - [ ] Unit tests with >90% coverage - [ ] Demo component created - [ ] Public API exports added ### Integration - [ ] Works with existing ui-essentials components - [ ] Leverages ui-animations directives - [ ] Uses ui-backgrounds where applicable - [ ] Follows workspace patterns --- ## Implementation Timeline ### Week 1-2: Foundation Setup - Library scaffolding and configuration - Hero components (3 variants) - Basic demo application integration ### Week 3-4: Feature Components - Feature grid and showcase - Social proof components - Statistics and counters ### Week 5-6: Conversion Components - Pricing tables - CTA sections - Newsletter signup - Contact forms ### Week 7: Navigation & Layout - Landing page header - Footer variations - Sticky navigation ### Week 8-9: Content & Templates - FAQ, Team, Timeline components - Complete page templates - Documentation ### Week 10: Polish & Optimization - Performance optimization - Accessibility audit - Final testing - Documentation completion --- ## Success Metrics ### Development Metrics - 100% TypeScript coverage - Zero accessibility violations - All components use semantic tokens - Bundle size under 200kb total - Lighthouse score >95 ### Quality Metrics - All components have demos - Unit test coverage >90% - Documentation complete - No hardcoded values - Consistent API patterns --- ## Conclusion This implementation plan provides a comprehensive roadmap for building a production-ready `ui-landing-pages` library that: - Leverages Angular 19's latest features - Strictly adheres to the design token system - Integrates seamlessly with existing SSuite libraries - Provides high-quality, accessible components - Enables rapid landing page development The library will empower developers to create professional, performant landing pages while maintaining consistency with the SSuite design system and development standards.KNdxO8ilT:,졅[C)EG,INZWXحgl'CZ~z~Yl>pR,",F_R IN 2ITnX|/  [Lѷ}EPØ,4g(OVrHb'$Jo*鏻 #֤󚍨(*X!; MGk7]-7Xjyc[KE *[,#*/.ifnAI`Q[%t8G<4Cţe<8']YF0,Z_9$v7Ջ]Lyި@&"ho3zMsᨀR5x2 7 y*MC"-ȔU8&ʐڔӅl8ѩJ~с8GTzaJ0EU8 ՝WJt\oJ6!lU蹹njڜ*db4?μUsas49DX g*w].aߘ0ED+<4ORzr_3]O1$[tww|:gW7_o]nV>7HKb7=Pt?굪2԰$PQ-W S虿TsGb5Ծl|\a}ᥖXbkd3<*Xu?Kɸ_wLzNO6'/ހ&~mhpm2dU\]O] j2x [ʺPonpfrfHpO𻚭˯Gg߈e+O1c*w?U7B1f`7Դ^9F c2n1>O+򩢭:њQ}87Ϝz4#t˗ C0"#eՁ~SG~+|~ݫ_M8ioꀾ!~s fdMWk*wF?a 1օ:om8oG323UtOS loi#ߐb◇3 = Q?ޘ9ca'w orx,[a1;B-W-0 xygo3 landing-pages@ landing-page% landing-pageR, landing-pageA landing-page!m landing-pageA landing-page3#3.x[~@BgqFbQjniҶϱq0fN>ϡe PAL(Oh<{}y,\ \\U  Txh//ui-design-systemj=ui-design-system$ design-systemui-design-system}ui-design-systemQiui-design-systemui-design-system:xmOF3IG4 ֖*PuUKc_gݝ:im`?aϽ8>; {ߟƽ`836dC>R0 ˱xRH0 ,O 23>y> _0 ~;O%Xh0hưgtkYz2̊ԐYi2I,[["*p ϓ.LC28]+2$Aݗç^+8] [Cn *,^`BcX12IR*PT`7y[RD,$MIIm|at[k)4g(y<<|4cq ($R$|?:=ƂcHErP)@$GE  iP /$]n4P)`r!4 U +OJGؘ>~u`Qpx&e!AY9&˂9i3/U6jEӼpb4ϼ̱vUhGЁ  H;~J׋WrVAGetȽTt?ф7H8明쉜$+ PY g4WHqӔ%r:iAg>T5/POBՖZPF3 A4sD#W=߇c!k09rNzyp* ؗ+ lqPb * eGɶ9u&s TReB1;,5wEx[ ckG~S K9c\I|4̓ϺlFawuګRHPIb:K)sedaALh{QS,p'Y T-յd%v~6Qk)Yk^ @гg>~Hk F(Ӱ̣V|yʶhvm2|j ?Y꫖̥w+_zR~4{p2QWOfMk@Zo.9 ?t4_7j ë5I{=UjĘY"ڻ٢Yc;bRwn\F*Us2C bNC[Kf{eZ`M5_Dzqe ]bO+-Es暹gt(Q^G&k~wxoe :bo㷺kh#n}]b+#z`ǿ-hJa''\=L?ep{/̳g$1~ڑ^`szBq,{;D2D`E2i,ZUE:-Py3G )e,G;GI~CU3g3WE  tL۩]\!?wA Z/ZOiq M.D+;x~2b]煶B*_opMO? Ohct}+o&9_֌{XFr=vLzzmӸrȦxxGxRooș1O$ݴ? Kud v,U= ֶS=_e;࢖B4lB Yq='fچ~P2Z1' ]1=Qv/:w7lFhIY{|( cJe,J%Dm03w̎% ݏ;LX込9/k}[FA0? @Kiw *J7i$.@Vrz{:.99Ga(?ŸxQzJuD{D[}۶Q x1A!ڽݭm_s:/SEZA1?#Ң9Xn͌>w4k[_3!+n 2 [?vv3ϟ|0U3VZx`ZZmA$YqRI`[\3;-+HVG2W'\J=G=^;rL ?`Y S@mXxFmZiy'Yh+jgyƵu+HSNz@\4`%E px\B bN~TzzS8q?cs4DGhD:>Y?|E>1z"u3quJز.z,PX=Q(^jؙVz.6qy1ۣ6=/=Q!΢xУ!;ЇWh7SA(;0E,@?}+9 ʩgIJ%>z#~'7`D5Fd_^n}%8O3`D$![񾚟dyqHhy9̱K\q/KcZ];*l}X~HNM%sUf7;B c QөugdOJ^)9%w;D!ۄ_I4I,= s~fL4*jԙ]On7[~Qg0d{` j? Ӗ?%tçGᄲfBn~w3T,M/˯SG@ayݴ4ڲ׬Kv߃[%j5Qe_s~`+@ 7Šv5%n1NCst $0`׼+#ڥ e}>v:[2?,_ύb/c O֪h0,KU׶zt[UFZmam$[48@aI§֘P-0 .ҎHA\dQ#4't ɟ7i&y@oJ| ~worΎP&{RԂL ĉ$ gf`+g~')IkQ9,݅KYzWߖU%cJWt7%/CShؼ'D_} ?[ w5C1Y29Nfu_;0SxCDCќ|-92]3+,U07xdșjt'cmblW 2~^9꿞Gi}xe .[pD@H9/7@< 65Md 8i {V18ÃnȕY_a /vb^r*tU\n]Τ^=JȲdԛF9$G;cg%e. `Bbt a.U֛'D¬VU"8_0l rŗdf=/#I?:Uu*'>˚mϛqbYvTz$ɾQtLJrcįGʦ+'sC5ٕ~,+Av n}M0m˷ Ofc`E?EyRJz@ޅs$7acigد|X/1-xvï{9yl_rlb( vXvSjnd϶LsPbZCXS}p$$*S?&/;)b_+3M~Ahd2Hūן3z>[_NϢ;Y%73;NJnԨC5@nᵈ@}ŤEvZf,-a]GJ֌ls}zUj/IvcZ%\W;:sRu;p#d.(too\}N:LxGwԹfJb ;N,/+b-1H@֢Zw^,+o+@o-ݞx@W$OwL#MI]7 |Ɂ?p]ʹ,' ±@TW/_282jLgg\!k+:_|C%v\HVo{"ڥi~ oyFMϠze]֏y"B/:?F +N})wTy-PS`[r!f)uJyoT^VKni]GŠ5LJV톚MŐ _휟oɞJ?CXJ$d3y =)y(*Q8AXB>3%N΅X%5iw»$i)q@`B3^N/g8ANH{JS3OBcS&Lo&4AȈӕK̴gקld.ΗDx i\b??)”10l؍EKWfZqU1 &3['l0UP?'>J(5/3;8 +tU}"~H5pTS) [ QNDJ %̞== ҋXN7E#fy `K 1߭be?~{.z?aNZ~eiuHUxUe_u k,WuذAMAifB  uLaͅ&-^0,ey$%"V ]Ft#5[Ōܷ-P,Z0rX򂡧jB`G{ao Մfݶ vKOi/;VEfs]Ny-ߕLiR]kZz}$DT輸 >boe9 k}FYlUqص|ơg-E)|G$gCNEAPm,&@e5.;.u *p%nn!+㤨B6EW{J달٫ҙWg 'qw;"W`<.ǁjUƿE/bMnOf yzA~^rN)q\N\8}{}*f%c/k^gKB!_pmAƹ$>'{v^kv˨ [j̲[1n.k[7HW_[\>I{\yH.ԏ;<;7Yz-PQSZ*E`mڨ0b,vUeGxF% U Ͳ5׸_)9RS0Sg)Wy!F[w.0 7wiԱhLtlm?X_jt=D~ʏt(~kb3]-]sj~5ˠ5LOwklǕRx^L[@)Qa!-*M!kӨ>?G<_']`x!?djl8Ŵjw{(Oa&iV!Zw1q™lA8s͞ lUVh3/>u~tܞ"X/2YRW'յ>)QʕA镆OAH̰twEMUn PCPx366MDcn2ζ}{ߖ? @ h`8[I9LZ3@(pɋgiblߘwD HVZUk D+axsk5m6Ȳ-o陰am۟+M?mWۃ,X;WOݫX6Xmo>z=e9_)tT2 Іm|D.G-ȱjctC~u[b{x7ץ^*7y CZgEI- v}osz܎;/7{oJ4>9G/)]3?b6La[$,lQk~7gyv柼<-)N9.-4dټ~X}b흪M0= @/x(9H:S3{redUzGcl^.KŰ^M؃}t@e pݝRs\}IwZ`92W\(zǣ&*RMg>_.8#%EmU}3_"cᦺl)P[90._#:(WfQ-P78ig)kxQ OԸDKL^!(_#14Ayfz8K֨CT;۪іU_},<(/ |7fb?ՖE1nj?]nuC;uq;Mru˺jRT}e) ;TtIALDYfsu#2n 3kO ũQqJ\.msDlP ȥzzX;?S=x PK-5dq@;dJ:3a\ Ǽb6eQS"M3_qћ'0ϲ,{pXMzQ4PlGMGw,ĶVMm}~( H[$VZ36P9%s]6^x)3V j!}8#ϊBGc/ lc[|gO;nqjVBӭl'4uEcڙ0< Ц "w;l̉%L4!#SY7 >RfJ=tu8PU=Jp883Ƀ8e_Mpu)mK%ptT5f2$x4E q鋣#_Xb|o,!0u+fjޚ_l6EeYg3cgҲy.Ks2?|rkDPTib9_[uKxL,AW^YpלO[qtjczH9x4|orHpe(7c'2=b|]<$wS|%y^в^o< Ve)^ ᛁEP9t|7{ =x'oVXC ڞM{uBkG}v"濟܀|C<<9E՜sq qW؜ޡb&=Tٮ>덦 b6.w50Τ5ʴ6JXmdK[Mp?MĹJ'h? ˬSkfo[R$zW%COM=GOfF)i*VYt9ao: 2pv`=p|20Ƚ6ZHѭ1ai\E"JntMseef(Ի́90{-ex9t~\Z8б:^mZbq8_"k^!K=<ڥy7.Eltzb9<0D{4(M+.v>zBi[ mמu! HV5-c4;NWN:p(t=oq#"agέ~D_qqwّ't۶<>efB[ !Sl7jn`NZk kP:"c2:Qۢsb*d~PN|O΍rFAnsOX]ˁPҞԙ͞ #^St!*1gIΔQq&BW}5i>-l2ę' ȉ`<@H9UcGcP`V}VXYTVaHQz7^쪡Df=lׇO@K$ps72]9vÃQkl{%Z)9yUsz¦]9$l|Oi5_[J="VC̙Ņ-+|>EsJʨ7&jP=eӫAy0T c- Fw8Awƽ_sl5^mXˇzS ayZB춛 8%w!یg5ȀʊUEt/H~ϭĎ,C%XQ!@Xq%7!@%]6v5)"JKA8^ vI>s ]`akgN^6kn)d8FWk;ҹN.$|?鵀9R G4XuKq7Vڔfbcr5:d+ cf7u҄GYsu {{U8Lcǽ^>VO"4i~czqnK[1ĚT\1rWxA8 Y`m\𖭝t }e W |};S !7"l=)M}kOJ;h^#;Uh+}׀akXd aSP2Xl}xwk;mA'ŜkEߊm\Μ/KʾnO%k: ϰM 0}{\S3-'ڬt2;CȆ`Md FESvAm2;->Lhi;V3Tn._Xկ^]p("}GՋ2yg(or[憟5*!2?VaCn NάuA pӒF (M rؖ dA]xim~jǏ\8Q 䩻9gE<NW,-`#Nx_|MjzǙ4- 3%(g4sgMvQF8& 4I.U/ ӫB8ЋK>#7ZlVfޯOH_7Ҙa\nfv$ +rwַغ,hوUw_~CeN1 W},.UCZɹO7 gM/wڬ3έ>pS>Ӯuvo~vF?g1p0I |M>[9ڸ (zRiшCgUkkhB%wB ul'gJ;궱?z͈h=-2s˸~b 07LY2q5P qCܑ  ٝA#&O Ԧpl>B s1 Ʋ;ƭVgarQˋnxEihF﹙LpZk:j@Jw$9mڙ <ܒӂ!efl`lJj[I/:^y%ѯTo|pfr͎yxYEVn0s |.#t&ElṄ]GLL@\Alte 0, %ika/)nu& !2>-&45@{:/4R&d&1Bp[5,uVt9Ȟ6N0~mA*H^Z_#;QdK>zǧ. 3O=h OXTd:ꮳ;XQj ';C=uxӃZfc2Zԛ@ڋA^ýWf"ib]QwtAЃA1v27ݠӗXx [l~k钃 F1CxMmLaZ[ cGZ<$691VbW1!@%Hvt!XƏCЏt`n4yQH"{ kPZ"E hR RXz| * GݭBly2F/tW7Xҏq{x9 [ٞIe/,lzumH";WAUPUfְOhAu:/$.3݃}?x>,q|v4]ܥ ?@kCM⚅3TV̈K(3[wCu7۰x+L"lzs^s.|{>[ziyÖg/>Z~C#==D Hl,HVh;E!=tSX(͂-:~-K2Ffw j} ßb@O}SwI2=$IlDghm u:AEE .U74A/gz <Jh>c?*ɮFeիtPPdkE44wqg3 '3 ܊+Xns6HSzVb X5%;S;r'ʔ_=']cm;^w'Dc߃sk fK~ p߯jv%nПp4;+ujz];mM_b.:p! 4whޅxQnQ24AV{Ms~E#{K< yiךt*Y&(MMjUr)mſ2 -e?H2^ orN}Xtݍ:åU7f.xCuۍ-׎\[BM+r(tS|6WI_sbB~7tAя]23%ݮ2Ww/Qk-(Ty4):U}&-jTXUxʹU-o]zU3*'{/?zOH0hq |dsn+no4hOr6Tm =M8k c%V%rXeyX--9U̖)CN 8g㏕x#"7_lp޴B2!.렅QEɣ &[6z6Ikd&n ]ٮڲ#*@6TZWnU5~w:'R5LqWXGSK?q.γ 6 +]MJ٢tO|@97i=<2?Vb;pe9yJ'RܻFG|7/.Mt?}2pzSOjTr+fPc)W3 yca?7r#H:~@47VRfg#EI@Ѳ "%aoWW$3RMvfVd)AsT;2(HwSnj)}8bv{}*0ŰhMe D6qm+WAџ32,Bt PR蓄;d*԰@(^ +bCOcONk>߭zzZgN$j[MKa5uߥu>'} JE/=⓽(7+C|V \$^ jR$xP5!-j ! M{VvgY_fYG)yeqQ}7Epe͗wwDfĪe,- dj莮N+2NŁZ$*LހgjR2_]p.7>鶈jLxyU# E܆n@MhV-ήṽ> _,:TV{:=z sf#os&a&S \ƻ˯GxirUl:)ɯa!@-F02dZڢ6c~8Z,;0WFO*K 2KAaګAti^9\j/ªR:ӫ57iɲՅnͭAHp,U _4VnkE+v:{BˮvS(i\?9N3rݘ^ oۧsBz-1[j82#>uV2,ݒơJ ^.ꛎd|{d2NeԀP9 ?BĖ Č ]P'\a5sld F[LZx#lLe1G\×Rʤۆ`C(NP+8PO Q!'=^q,V%V`C@WN xPe)8TTp{ULZ@$݆іfBcj*jȂ' ntVpq?џx<󭪤uNvlUn-zc푫֬vEp'3clI ! TEۗERvi21b;_ҋe7=,W0A%ggo;v+ljD |-݆Kvl;Xwj19m*#qt1tS(\It oDn5^i~@]Y]qt5!PۯB8A| ]. hxqECIdDEAJiz7Ƴ6 n<;%I vPfhkb0#$(͘痻g_7 I]pP{y ƴZEwT"t k\?Kpsi$oWwB_/lS T ɞa+:R@6ywz~:70wc9ކ5{\Fǣ=[ ]xl1#a{~,5 U7ҐTR6qw뮐AY5mG9lCpͮP/_[/)_Xf$W2c݅xfshwe{p;ݴش.F;P64wV[ c?*:ZVwzhArOF&TW`hR{ !XosZ#ƦGԌr3'}3 @}k'";uv'ɦ &>1.K6Rya^*]% n-W.sJqS7C$5Ⱦ~= u|D[d7-(1&v;w+|#GB "zfjm6/GPhTtCw~ 7jʬ7h)IUL䫄|:||1f9B fw[68ܬʞi_eݳ"!Qqё\ NelR;rɍƕV7[j]?˃dTcg7|[{( *5) fZSnqrFWx1ϐen@K4Ckc{Fkʶwڀ$P:پamiv~1^UZ}kbMw9=b+7R?uP?w7"ezj-?0u m9bo=c 6% u+H8,hLup&{ߍneQctZ竄/ETI;W~hq!20$vse9$3\7_%ָW9UU/b'~"'my祓gƔO$|ŭb$#gKoXѴ .0#,ܴz,Y 2rU7٨ʠe.yTYg+RLTQr%]^ot1iC^܌pǮ| ۛe$ܐ5!Y&s# RpRX0KJ .ȂL5(S/+|2X|O~=yf"x -hgآD[4y>KgTY>GKw=8d`ӧ+:ϱdIRt2gcj뀛wthxWuwYvk KBwVqv%{$J@]NBd?H)W˒'{ӥ^)8R,$ԋ-t6skB^_23캖7e(MO#*ݼ<; m8"/2H@uWoۤ vR画ǩtڃ<8'<ޥGTF\c{g97\kR;lOVξԧsBښc1b݀Fu[(rڶ5fJji}lqͭ!ԴBPSZl CH}cWBSI-xY3_"_p5N2#l&9^u9 e"̙W;X6LhSݵTs5#p6 u6Dz팖Jwj7?L#F /!1|7wB[%e"^KZ6}=aJw@ ڭq7gR**+hbYGz^ rrMV7:qNs6/^^h, $: X@dDDJlRɦK U*}oi|ս7Xdbe.7#E]h֙:b X,;Ba )a`"Ʒ~c<++k/"G/hN0P誢.@,6.2=_ܫ|?XX`^_/2hK&͂#jrInfeyA B鞧J;b85NCYsi $N".C8jfyoNlَ(shoT\{EIBھPڵTJڲsoCcc ?`{$_rO6e 1ٚMuB|ݡ*B L兾-@]6fCY$7P<87*<& k${@c^/=_5!%G97V̌ș; m uzz#+/z'zMδY' Z@ygL%QE{%{=0n/2F{9=dWλ3Y=S#-`Db9%nw6ejMr5[2kQ!cl{Ze*mfE#<'WoCL]1w4TB?ޕcxCImf,ˑmi6ܲc:~+.)3ZMoQZ6o:r9s2~wޑnL65Boh6w' g97G29ݨmI]80-pV_=~.=P֫AuMh$@Y_8b*,qRwpe47eH!>N bu\ † RʓU[l ሾjϏ82[N8T7sJƫR,S4ƙsSt(nC{`MpАNgƌjRUEg۝ B nu-W+:_&}]^vM4(|){Жdpv9f;meE bI+l%X>kȖd\ydLx+>q{ޏ|7L;IzY,wg" U~Y$-)lKxwFP`23JpʞpݱGLĮzOc z;7Idj`lӤaV<+t{&Um_F+EAyq='gM4̳쪊X)8c9h熣qCǫ8TFClN g(-sKVm)t~{с_鍢.<.OHEf)mU3Ka<6E܎vUQ[cy } =N_̯s!- G]mlj/D3N0g=2vl0LTVۈLVgYvXoٮ[^%W\Q@^0r1ÐR%Ӵ}CÎ&Gŀ7x.;5T ˷32'gt;5ۚG/W0~D~a$]8_A ūh&}n)pCeik2Bո 5^MpT9*鸄GNds7sT:0Y" 2U0C :U L{|1XO v&,LJg8V;AGv|jJAqB<-jU~&1+C٬KeRVH`q} 9` i;ӎ6{* ;ȗbo؝<啦DPnH~6V䁫.!V@Nl i'?z/v_\?~c׎OG(~ya@@>Ө9 vՆ"G>WtQw(ԕJṋ/a{$%"+cm:ώl8 UoDH`EeۡN 'LՔF.EwޛRmGs~͓/[?2;~vd v~ ~y$u礉φ-fCIf?w {_f4&:lo{jvb{A1`tl~6nd0Vs|] l _lFubd)p~/k\u W&4 b\rMɃIJR9vVٽ>&gґk^@=dx%Zxn1B,ۅJ-Y zDŒ^ZGkT0l15oDtw * F^N()CY#)>G`Eo-ʎzx v BXIyqK&zVb1him g? fI`kTly&sKc+η?m#jD'=\H' sL7JKP:kezV,"u0}+d_f`szv 0ݪ&I׌hK.\d:#lxD2H}B_dξ[:vnJKoڸvlvm}}p ntE[SVF?gE@>+ņ\%l"6hC_?2:u?-̈́ s.=Kb~2;n(VqL|)||~u3aź7-{8,-Fu]5޲;JuV{a ѧxsBI(67]IlD~w?ڏ ;<cv;x{N~] ºV?ku`4PP8}.kJf#mu8U3\/rBxh,GL:_5XVJ}( [sM,:I>j>!yڳmOPF\p!.zh4(ܵ=m|1BiɏFM߽o|P wԳeETzMb;h8Zf3NQ$j5 FI3uY9r0<@_u²38t#?jKQBaTTCMB-kJH7ͦ)`ڌrH][(`8)8oIפs9rP ;x dM`k<X>k^a m;5ݧ! &NIF6c7*Vn[ƒ~(i<'ldJf6$o]<A>kJV?ne<}*EsX! : 5lkKg?.NkضY̎v+/BaX,(cebF L[g(Q2:.rz;Vc'V{.ۏsӞ~;*} rB_S=!^"Ԝr&<4m|!۟m'KOGZfǜjwҏN`o.2{9 Q ہ굦H&EIe $)qWH6a-ƍ# EM~ͭA۝2F|^l׍pD?T}M/3qdsc&~$gYӝZta"{J=)YE!Y]~aT8ʸk3vڡ xr~%]g_f:vayl2$]F -#(l]a$$-TrA-1qȨa18qQoH|=3md>TwqܕoɄMP¤h<)@Ʊq i!t)pW4\ q@kޝT`׃n=1@@%grj d> 4I4o򟷑˩o6~sl<_ciCyqnj_ƽd1 P'q0!izr9\niqt6C4˸o!}4& ^>7h )+|n4*7{gF#]TԽBeKZҌz +z=l3t`45PY_cHϥ88/jgGٟ.$p\4)O5M.r J1z( mvk1ƛe5"CF5TXVՊݷŗ䔾xnܕ7>OKkl{E3l ~`E2u*.sPx jj8^B+l]'Zl"Sanaku=ъ8J\n~Ǩ;Su}BO}^cfh͏⁳}/&y4CZmnxAؒn=MW$e_nuv;>aY뱙B|ZyrM3@/-Sאo]'+ ?c_gxh%}JlC\YyͰOeX<0w4m1g[h@ne/.*(}'SoKCL XX*Nf7"&^b< {|g_U'1?IgYS戛upG: LͣLx5.`@ NsHu7RA~mDں3z5OG?` a^A#=N&k4赜ZTTBe)3l:̖'hnQ${ʬx)* `y'O@@? ƞXo_DQ @^0} 9GiLH 0$B.x8%<i"#|Xཎݟ+vm-mkYOZnΣSw=0?'stn-,s;يt@@oZnԤ澚cs+{ícA芗P{"8{>ѳ5@#GUkK[(dC5P*y {yM!D+Vu=VZ uvnj{t^-YAni[+v#Ԓֆ^|`*rL׉I" fT#_e@͆l7jkSZFRSDZz'y]qKo=DSg^t* Wmk<[#'L؝)v8c-Qmg鮴Vzb 2<|%aMҝd@>TM`%z ސw,mP:4ekPev88m&%Km#=lf^3jl!ǹ$m5cu-kRoeʞ3~zZOc DG^\[ofofqx1>H9>]V"5(4]ay:HZѮ ʹKe}ޗb%NaPtNm't)ĶRw $= JJme{ sA0NjsըMc3i6V|\z_hH]<9:$Xusz44vo*Y,pMƓ b2h_-hǯgV+*2Bc `eaOvM{ȶ)H]b4KPו,D=A6SaS̄R Y°5XQ~Aզw\F8}O4駔™ ]YĥLć:8 lV,*[93!UR=4)^(Ӯ Y ){NjgrϊrQH;S7MrS"GsI{8 O ^lqi$r|S ɯ,2t5˸_> ґA>`m[M}@bcT_i#S;lJZv`qֆ-EM9k[^|_O433oF b'{f.dN0ҭʵ,wîF($a׻ gńBxObbb78:r@=kx9_8ص>U;{;_㼦OxU^Da<4ڄv5OWsqVQ0sXf.=Z^+:vmv,0!/57M6C3,?Ni oX_+L$SH^!IgއDAxC~IUyJi_C0w {'P']7x뾜MD ~. 86)x>OFbC#1im=XKA ӟӟ9i?giپ-}\)㓞Yax ոxkۜڄ*D.Hn6g¦;9ϴV;Y:p4b900/Gj bR_?aoߛ2p@1^ Az+0 yHc?/i^Ge}YG-C#.WQ"}wF+Ɔ6DRPB1&AC^/ؐ({&_l8E1ԿqO>۽$> c7kd#N'N;@^#MqQZEϨ!h"PG& .鍻 uEϚl(h=|>[0B_N*(A !\ 7cT AʄZl A٩~#97ca> M-#iK>pg G.6w~D dEdfs_]]IO=ͳth2Q o)O^$rS o{ ZhdLW۬fCE1V2ލw؁{>nL<7'=]= > mhMXSݕ @xDAsXPv lѳ6SiT%J56FYFC3=HY_k2{(]-nEP٬݀hi|8$fJgh]/}mg[ ֡ɺku:\:;rĂS4zfΞs6|./<}X_ "}ϬӇtz'rk+逡TuC QDm!E/5؊sz?rrdZ!J/ I'hz41,WD&>r|Q5gmԇHK@:iފ\ğ|뎙rH_Fdl `5I%#8#w2@˺D#wbGԕg2f _y}5[:Y|褁/P'vk8@3A#D4P&t譯4.o?.nn|~Ro^Վm r~#,C@ԝI:>Z$wr}U+8f?X5?|{Ȁ3ǯ4?oI<5R}K\NE0s!Tq(ߕlqqv4T!k~<ەƻs47,D?"FO #2K Rv=M¹Ѿ/?I}._eyonTnat^U趋O"Sf/H~Q!mM&U9(~I)hXd,gnĶf~_;!~} _9|٣!^a^Rdy$Q`|wpM[S5l f W6IIIeFo%^O"Os|=\@Zt<D'x<W07g;[ʴy1E:ѶPYj5X+xQ}lDٱ@>c;'ͤ|a +*'`>zYᘨ:  P3[? 36zѦqRmX.W(>;`3m+}c.ܯƼH.Vc! Vl:u|xƿ@ߺ+ZP_]xUFB+IeN5#=FS@#eVU=)35ev8.`v5LqmkKbMz8zt[}@ٮ͈\;3an6GׂDek2lCV--IѠ5]CXBq2HYB C"]W0o3ԙA~|^ ?{ks3b#N2H:V$9?F6XhA6|Dov2w_Y2j Kd"8L;f"McHz4Ašcɿ "j-kʘ5`Puqȫ;ZdBea(rxOp>m0ɡ~E;m%/2g|/h \T gnt)izx څ($ߍܦ6H:쌇b,BUzCٙS O25. rfi|/p+IXCu.Mٵlxij%V <яD˴ N%@A3('W/uJʳhuf RkäĮ)3Ip :щ|P; ^Q{$g{t%KKk Cxwujf\z!M)l6d* /1=^(n 4G:}MAѕ2 d::p>\:-^KKD!r8QlH$gmۭ]Eңu .zE" mie#C>wYƺvp)XyshSiR2/X  㑝@HQLR;M ]r/3٠="17A8H6νemMv|˄H~z3;4> /_. 򇡁G_yl/icj` <.&rxl#N+z} `A󰀏ο8v_ث,i\ 68fPNN,$LW㤍x5s6+LgmVߦɅ_>*f L֎BJ&}}R"B3[Ĥdhmo$XubVǍ zuKځ}} ?Sz ybdI[y;٪U"vTQ*FY([֣*KZd ior[6-6 O88U>~ьq^ݽus cMMS|C>j^O,JɷkS,\5@[@0e_k"1#ힸ(V2}x6YQ=g%K2]L)bҤۂ)ҸgbjOBM3efϴјw -%k[3e" Ҝ1DblYMn˃o q ADFިhsVuo߶2Nr03n99um|>yWߐ<)5'x:2:)۳=z4ﻶ?xs=PChXAj< mZ`~D۱~E` ,"r1%=ڂV[WAv'yrd[3M+z:JQ8i}D[T9<K;!䞂v|r<3NqEVZgmvk4o+v*,zC}8n:W7q'.b@T͂pٍݭf z$nǻzP5ｺ%=Ulrv0ϼ74ԛ;gu]o^[E>&v ý@pw4ꔈ z0\7Lka` }IߧȞfQfHGzH8a~k Kv^$5lU;EXƃ&uҩ#3g')a{}!\lNοVfgZ/x|QErץǫn@'eaJF&R7J.֣Z*^H顉V$G-t" _ [cboRb 5^e(=D"+1F(XO20!ZB2PSnpW3i@MdD0m=r‘{Q3PT+Q5` t{ըÍ'#XcǸqza'ަUJJiIg΢3vSƒx&, q`Pa?춷4HrL&1h9mBA;z rAmaj>ӝR=sGT^0T,>LdCp+˅LF`Oj+:M03W G2&"\r5 JW5.0T^:;ynCYuw] /Pmꡤ*'9d.۽qcjG+ 6e1苞ӻe{<٦.xz=:KݘPp3OBM^Hhr>x~Չ.9݂"N Mեz a^:F!_+&f,Zo쨓Fuu 5[`>2K2s$2TKbxcf{^tAo=^g?$)8y!x{&,6Aoh۞{KbjWN_Ifv E;g?ӔZb)t bPϊ?|>6},@dYǻ@u7t7|HOPbAIJiD쑌#i˸UnT#8zN˄!xSUt`LtuºoGq^e 6,=Wf,2^'|dA &&iyw~QSЮbσX{6~O}<U{}N_UN; r_HK3;w9-]1*aV.7^٘S~Vkz 0v~YPF9Pc V/0f1N;9v,pYڏSE/5PY\zUĥG{3LQ'%1o\%C24Qr#F+q{ZpUeDP-=.nt!{妚w`2촍1ƊcnxE`gK>.|~xs:ܻ}:pKQhxȯ4WmocBA`-$D-=xc6FKB5 idcӠ]:^-H`vM"hן>Xɖ)lswE62@cm6vE%P63b=Ȑ)ӂ*׎h!6{=Oy 釡J'TV|vŢ۩KuE!{ryr SZDݹv4AofNŇ:Z_we}V7.uÈMD~p}w#w˚Y$i dj’7!9p)L!LM=4no͍|]}0\kZGR AM)Cڈ@Ah>4xG0 cGuY`4ȳ4u6_B"m\|DTwF4&|F ]2:]F)kD~Xz"ݨϸ1L59к/qH1H4tŃoܧj2kybx!(6r)!Q#ti!&(|;[v ʄ3V)c^s-eTQ6L$54ٔ(Z &8&*G^xaؼ4+ʙ+FcIfeNIHq>g+ޅrFjjjuGDsw\ țh߅퓍_?0g r סk<kJm. FWQF'mʇY7]xma'n a`0k[ F1T7A;W 8A»ms]~Jah`ڵ;=a/ma%¶SHMl1z֣&ԡ*޶zIbMz`>0ܔ1>;/Ƌ^g$T N0rWЫ @Ea 5/Eԙd̦AO/nw}u*sTӎh>i᥆p lKӽ`vOX"ICPQhco]]FD`ʸގ]\KX{m`R""}K;k`Mjj&>yE9W0+EL &X{TH(Dpt<6wn~o]UiClR#А#LS Al␟>i޵q>O ɽᓝXr"e(-Ɉt$lQnQo*Oh1[Ѣ^DyNQɬ*Dp};1~{MKsDIʴfKaiBL̛֡k/W;qDC`e^g5(}Yn]Zp^~>텭sx>osО>~^&"(ŐDN OG->OYe-SW|'z@#|#+='vzj< sp!k9B$}NENWa 2QՎ@աLHj2z_$?as2^8itoL9r \aȂ'':}%fA=,h"5=sjj9] [̉vXGNva60Pd @;L6~Kxʾ¼t[HEq/}k`%%.joViy+|r1mt`s5-$1o{ucLK$֊Ȑ%R ,ץ[&nj]q2\d~7ã!>R1۪_:wg/\!ځ4O {/fe$l+/k/Kvݽ֏Q{}ˊG"K3AdHi94F;G-{?ۈCWOt `C=\5U& FhF?CALi{>K $g^/4hw0~CyAIɟ fiwWBϚ< ՐMoࠬox Nֶ3OLs 0Gc?@58Hл/(3D[dHQ(g`Мcl* [CBwixʬpU::Hْ{M%p`Er<&)3]:O(^z-ߴcgk㉻_얛>Y34rG&iHY<w5UP` J8THؖw+)7Vr 3MndN/m?a7 yO}1WԳ2~EQoo/> _zƻ%Cx,wq-ƻJƠiwF IxLEB_u5)jPvOq0mOV8;fǜ9e ofuQޢ.&rE<:;"3vzqg*۳nkƆ֨.Qw5Jӫp6X x;^JA+{W;S<;: ;~7'18r^f}HlVO7gV6͇F?_RmBb ޛ5% %{,R- v$@:ʹЊP}^nfLur"}nipu`"rgxavD\}QS;c}6GF&޵3{!㾣L"?1z]|U~G' ǐ˱3NϬ`.cpCz,:-TM/fuܩ\gb+*Pfha^ X<ق~y?p9}%]܄^|w#}G!#iSl J!+֜Xmx&WawYO#q2E"ZO] Vµ*6ܚ.FI\M{pόm1u#~+>u"ߗ>"3*?KBJ! -N[xDP) sę?2;$ s*G h_ïfyŵ}( >`hZFL#j<%n#QJM;JC/]5'Yw7Ft hKǍWVw6L0|σa n@kS+!jgs \7 %#ukUH#d7uNvغ.wݹEVIUI7ȹNt7pGj_ݶAT]-7݉ҽK?_b^ d.!zOG^5zt20I[Z%b/7_M1w'E-oPU&R{+[&xWF :Eg9sMM?GB-Z GA·d&dj8=p0-g*C`@,C )stR; ud jus:j8J}A,E9Jg~Ð$Q; ϩnlB^𹓛oFNу*\8 B\5F\b=ZJ vȬ?KW@fՙHc<@H^??GȀ$tC-nȗ~V2P'uazR9+KOtdylGb1<9)q"{|8꟤O ~QsWK:CM±B|ҏU=(GsE詵ŞSs Lx685W 9} Sz^$|H94QBm|h"6þy i D&%^<G:i zlOZm knbYඛa3C}Nqye`ݳnբ(AoCO%OGә0J\z}|y$n7uיȷ4n෿A{OVCVcym Krƚ"tWHH`\SM5CAsR AWa&*CU$VzRW,D!iK~Eg80ΤݍCyw(zmQ/u|R뾼b5VAp Ez5ɹڦhmLkF5yRRgYGXޏWgdX[-4qݨ>v#v%seݠWf^]QΦk'P5DiVs'z̼0  XXnf BhF 4`ebdv&isE:'>Ve8g^\ ^M`[Bu3^0_ iWuDd{C`F?=7f-̝Fp_'̄w`ZCجUg-b^$(uy .T!)FG7ę.Gk='%\}L8do?(= pKQ[ysFW5GlLĬRb.T1yi$d6)lAeo}{Z"/j10 :Bzu2SZ:#S%t+yKy.lx8C: ]m|f}Nw[?^gXU~Ud0+ڇx##Iv~bG|ψ.|̗nNɦPa)R[FIWKH\!:,Xs' XđإTti?1)~(дrT|:5BC:gzY%ae"jNjjē0(* g޷Fż֬i\p}~1aj)>'4>;v}!v CgcvHAnqRelX[Ѱ2Ri\ :ӽ&ˌgVC2BQtf:'g}E4uXۙ.,3'ŬwI{O≺s*6L'O A?fPkVНZ F2AMR'2v@Slglmئ1vsPg)3*ݰ,-6?Q?2N/TTʣy~|/ `_Sa? +LRDme$6'I+٦l,̮i >oIqtDIzlm<3t M$y`xl0y?NpA)7@~7|IU# R[OժmСh'-R TVW *.E7 훪u'yxiN7cGbtnCT} Sݒ 5ݼEG$wXY^g<pQȌ)6FZ0\P"&ɼۨX6Q~K${Äuwwt`~;|l*@$ZOZAݨ >ݟŶ=gNʋuvvmZLG9?%}墜8J"~]hs#A" t\SvR"+SI]7Pf#՜F2 !<| #C^_/ir퍸vq]C'k8x"'x*鎸;( i-\JX6H~>[ K\,Bmgj"c[w-MB 7[;>#x<<\t/y~"Dt@kӾτB=2͑6q vŌ6 E"i_K57K鶙γIp>?N6pOc'Z2ps/ou?hWocsN+W=HҔEr EEfFd b碍填va[sP\oKӷӾ@?Aܝt吝YadڬXqpV9k d6:>:}]O`j\4,&ĒW',􋷙1j˕(6ť.>A 42Gd+A͂ޣL%m ܴ3mU{B[K^X~{l :y{dz.sǟ }TJX}!Nt́( )D_ȿw^o!ja :bWF۪) 6XUYL[^I^ cjdƦW#VeC[PؒWvOxᧂF[x=>ۢʈ(W.s6%3#+4[aƻ^vUaD3[\ $td=MLt/netQoߺ;6fY-VF `ӣo9bK1F9 ٟ ;ͥrP! tE :2{u0LNX?;m.JImb)(b*뎩5_ja>B.ϱLu91zZ {Y/y~f!4˩.li:s0:uxE6:P~h]{K SnVi5+T63 L9%uC;ŵc9~eڈ*S)ak)Ĕb0|p$_YDVWmSޥB}jӂ8+>7HQv7l4|)A=qkt]M׊~9wWF4J|uK ǹ_jo!g 6oJ}aWں+nwǧA>Q- "r#6:YcطŬlg.qFUk?i_#DăXs&Q3E>U?I_cu]~#o9 <|m&3}8P-ks4Cui\ 6q~6lHիUbܒx0vƼŅ61J:xj t>c3KQө W)oݖX+U^t2j3䌎 w#շM_ԃa"6jRt0g|g[_D*)]:|HmW` {jT}oUCW羀urYŒSCxՠ͸C͡fM1Š|?@}'|LWxYVo,ҫ@/c&dGu&Esו*iu'Iq6[\|p#쭘3l_΄yps $MM X@  B.>K|aNGXmnb'lD#p.|DovToݹrFOt+رOdbZNBu9&& |t}vIʽ_8:.; ,AGWS &/zAX^XxFB΀ݻ"awY?`F~'UB3}'l$`1>PSu:MB݁_I)L҂٠Q J[j'l;J*ˠW>ߦ?*KP N0RЁk5Yvܚ<<$&ړ5&J$MfsIUx%‰˝z(ՃLlWWsMQ \ ѐAZ.gnRaf88[hhxgɍIG4^@|Tphߝq ]ّPT^G+kɓ#ԝ>CKКӄnKn2L#g BZ#꣠0W4׶PuKmͯ6ףJ=W8X0=eBOz$il$>OɤՀ]% !^1gF O`)Uj u"bC{~ ӔzY+sR<>_FК+Y֮'dU9W6$sCɘ_.;0;]i`A&ѢEJP}b[]爺$w>_8476 ~>F3GeC?νw͟[@ۧee(~_wDm}YO:\pښqTtFuҳ큳amdhcS4kh_̻yTr`MfAgל !AU3c>z =7u챕Ygd<.]{uUE}6i:VbxU5pϤ*dWcҚ.Fa;S_hPNRB{ئJƳpZE_TQGC<) @z3?am{]eF<QTpDRz.( `&t?N[P( e"tNaPi%D.*<=S^l^M4R%B%2NE$zq<-7řfq߈\ +¾gyN81|PUn>$sݘDWiN} 7k} %&p`pfo"rݟmxg.s/x?VBfbCgLup PSre?Ǖ1*Тɇ$`EC5Wä d;V]g\tveF |s/Ȃ *0d ^l:Vp4w6ΰV 8[WWV)jy[iAzleACCEZMAL%[1xWz;jF s5o.m)3ꔿ7(=8}{3TlÅ8݆̦o9ɡ'WV XMƭeoK̨I%XGQ8lx\|aXr2 Am!F_?o"}unY`\{g PR݌MiM *~*Fҍ႟qyeSHtenW\a-,j$)޿RDZP*(h zLuA~?}n,}/BĕHErB*G'ᒂ^ζҙݡHҝ8TԖ2b%&#j.x"[;{F~-$FS+]5VuvGy_9{W_8w [pϴ:>+B5akm;=~9:lϧ_emCAS%$ ~jLfGXgAxjb/G98ɽD;><@KJ/1O<6ɸҮ͝=%}AMQBޤݍ86sw1S`GLj;'*,ħs2{_rqDO Ǹw v wnív\wM T1_s"6{3vvdpJjoTP*Ž-pl>.jkNWV(HdHVs%g{V0sRK\^ذ@GopSB.[q^;z`6|i:}υj}&U~!-`&Oa~l+Ӗ=۳ECEhyg8|Sus?e#H Ӝ0rMnp~iF㭅/-uD5*C{4pC0`gȸx%~S8| ȳ KC?/.1>m0_ca@ÈoKo-ŋP9zO ֔( ii=:tTR ?7=e{9}i/֡fFMp&AMV-X+3fuL?y%,b$qbRmQ5PMAR?)MzȦy&MSoA5m _2Bu6YWS!yF0mW.ڔU*j|`,2Qd}/qrNMD IQ9 jc@ ׿a.&K&ZyE*&iTKJ ޵Üj8حx=cO{޷]UG0,NyY;3 %R1Ǐw,EIר|o_8BB1^0b* E%ya?|#tMiȈa5jaݰBqK;KtiM0>a-'r4l6%yFv{d_;$\BQoj=nB&D',WPYk< dvCo5[ZXgA^P\ fb&"z;AVe s@no4X)PrzXyN"", Ŷ?W+C=kpGmVDW>|TrwppP`6qXum$4nͽuqo.hX0լ`nrn's-< :R*`FlY1}__Rxs){ /ۂ-KI3D Lh9h-ދyM ]rdNMSk}s*lrkPz^V<ASh,jJ E/C0AG]D0,iuyr*mQEe% /d5> B<ՊlovV^"FS/DIjwX()Cxޚxu,Gȹr晍Rۏ3jHHC-/ϮdoX\> {#tOw/B @0kZu :&;/*Sw\Y@ilRxٰmWgM),̣a7=K{!swK{Ǘ0 +\ ې|#Ic[zn6Vg1SE1MCx9u}E Edz03>ͶFq{#,ގT𘿮lMϭP1޷4(Zr]bh6z}fA@W't>haQ+F! ~-̠/nh) +- rqn|φNrO?CE~W.B4v-~5'{˄[nJ-M~0-FXxkx ۟ASmL߯mgosq؂N;4qUo=%7^pQH/J|G7ݔG5s>}ZD8>,ño`$>0T64:-]ZtV*F3wEW0 fmYI3==1aT&1 Pw(?=p׬ژ5b;'l.]lz;"$+sb&vs-8.|(z!vO." !g Hv]/!ExGΑ-oӹ)ܮ#k~["pp(qᏋ9*zLl6tA4E7 BcWb=ϖ/\IQV\ Pu]]#EVAmXIA"/i/V]oĬ˭F4V?l[YltsWZ-ө՛NtyyavopuI>/ ȋG[Ź@/zVEf>"|^"X'*k^[[hb5Sq/PQyWFi.;3 Eҗgb}Sx^Fݱn3{tYUS?֔6ŁٹFFwG(Xy"x©ozzޟ4E)unnAG%t6tj$7BbCi>a!aE,&a'_;}? >]nj1,Tcv~\)GB})}zl++CJx5WQ44UZ8wt;PiFt CTR`] I]r5ڙ='](Yzߡˋف+h+2zX6ö(#f2iB4E7Z5g&L3ɢׅ@wAЗ^P,_@6*~&I`bэz'ӣ/Zlh~HeQҬoԙt*/Fbx43gh8zRUg:dFk,Ӈgzm3 A qR>c0X@:iL\A4v 62Pj*ONw;p̫>#˾=cItl-pЬWuTqtЖRDiJzLŹ0]p̓6,?yл_bOׯ60DDJo D޷;/U~ݯ`f\]sFKñdثܜ&܁}ݦ;/Qm;fVhԖSVaik;"#3펗7un ,sMe2, w2܆Ơ(0߿] ,^7#gͨf񁇀RhBqK# 0r- 2<Eǟyg%@cfBwCO6+RUBrV>eЫxA/`K/FtJWVLŚ-k6,4^:er5XwXB=:F^P dڝŴDPF":s#|!}@t]CO"zRHCb;r˨/s6a mj0;PI k51n#kp4,[TbmOrn}~ѭ;GgtJ░'!@VϹ3-Q 3j{_ Kإ|2G|ήڮO/^1¢ %DXJ؎M*ypiJhwHh#AF^QfU_o 삏J).(KIHн: GD7%2 ÿ05SR]Vp-Ԝ_l6 VZNVjm&+{C!Mcf<>qLYa/?[oU xdoŐ|0{Z8oJHݟ/rչ4\>6g?b㧹Ȭ7g`ÜA<kYn .r>WqجH}7 S(,W;x lJUrĴrtBi9.n.F˿ҲDs^A') CI՝wRa8pSΠ>T|+XMÆYǬ8p{D,6X&}. ,Vz!~fo<6<`l3h[%*.^kP=r ) nT59LeK%^uW7| ̕g ?POP>.o ӴHIWRE}Z"匮C5tE?Ttmq:e9z| 8 up(z9u)%?HP H)z}Z3-tՠtB^ʂI pXa9$#z~Փv}{[)~MX5:0F $5f5DT滨5&1tjSE8֤q@~~-P)rG=P*Ey5q\%c|8˽(s$*J(u~ZoNP;Xb]hSxb\(cXQR<qMoKKjy5E3Kt \A= 4eW_eF]l$~d8ؠ7̛C7:ݢCPtӴƬWi&ԝU$ =k/ _ֿlV%S! &~pĂt㵸kJ&ITZ$bc#8G3%1F*z 6;8F|b A[OViӱQi+~s=p.C6بw'"^3,nP, a~xǮkD^𾘦tѐ"s^uOJ 83iF4W|F΢%\p1!TE>mj5;EJ Y3s×/[,~+wqBss ^ g5zC%{Y ^`f:>N u|20&Ic qۍ+NXY!2\B̌1NJjsOtяX69 U>}껂'yԮ]$IiDn[CVT2tdkuOJazݴUzs:ss;iEC[CE?HpT & :Vެ*ڼXWΔrQYdէiCxu ɏ?%\[ PҷϨm.2o)ךDvJFåuzRtx/1&ȳP# {J&wBvݙº۪`=CYZ* ?WpEwTv-+2> 4(Ar3@yw/C+,ڪOƫ`on2cIs%4EkzM L.Ts]5pҧdP7pGĮa#-b&=Q H|ƭ {F z\* |k2F`Le޶kC{;24%m)?2)^N43eIsNZ 1'h}!~fݕ V~C,ͪsFue]{aԯU 1wZ[N8XaE8ЂWQ"Pv85-bȂO Y? #~.OlXFgӱ#LE^ZvYHyړxt۳UT'z`[M#ktk5a/ٛe>}}n(!$0Yy_`P: ;J|36^n)}oneIo`.nHdN҅ŨJⱷX/VAĄսd*Mkшt]2bK}sC/7q?; 醽_^r ]?Nw5|mX$"*1ӛ)hDVO]#&;%Vg$mk1>5 j㴶,Uw.o'5Du H׼4I2Q6Syw`iJT(~u Z*P-)iDY.͵Em5[R8o=*%ncG[=մVgGi":Q-~.5XVgtxAێ> E`TG]n0;"9{@Lto ovI'̲խj< qoͫqG5tgH P澏VE*|#|,(17(L;/V4:.$6˫n#QuFOjYrQD3=E'hF04A pۊ] {A׳W,@ Kܠ k|0\ɺNUtgӻa$=7k+m! VAQM;x0ky[3WS˰(8 @~E2JFȶ G錥Lj@dVx _|Ϡ FX=o+܎fIxMu}r^o:Dž$U7K<3f/+"5MLy2t-4K k|X\$"6mG '6bNyM9!%9I~'I-0'ylZ [Y,j*V zM4Ѕ4~u̍(#E:u1^qvxd6hk7%XbC_Ē}˛_)Ѡ#F3\HÑ5?dn Rxbk-g15#'E4HtSkHRM~@m:aFW6`*l{؄<},`Э9''z!o)(Yg0(?X/pK]SaQ8Q[fؖ+::9_fmzVg4MT>j"0'50b%aPgYYח<+> nQq s~g!Yn2X=9Wrs0~9ȹd~` 9`Ŗyd0]mE] Ww"EOXQ;@giZaT*,yḭF^= @i}P qY5QXLjޢ:ujRROm6k C5)\T|lOTRB1+v/ JgM6ȒA%"߳&+ gƹ%1y*9в  '@{m7DI.&uY%骗P1N|X}6ֆ4vy-"r  քEAAH no(WPH$pI!-4fv>ufVhl ,ӷ> K?k94w0w 94W9B Qa|ArO1˵5p.Gq._0v$/,O?fm" `[o!Wa{m6y) uTw %ϧ{]ޞW/X;,jU?WHN`z* eeDž,+i%4|՜is6$KmH+>qɫқU}wqr{5mGչt|?uӅ< wF%A1>|EN҄zpoQo E d=>-BybkZfc~"o3zfacxiArZ|T3'V] +WYb,nn2šSBWFS&ФĮ-U3l7i4^8n5qiu!_yDjC?8$l6װz3j0[$U|MeE hl͔wK4g^]6Wl^j=}Ė|O6 hUлo7:i79.;woUH$4zbXḭAU#uL&ى/t7=K8,DM6F4zdՆ(UB*6æ'ؘ?&⟗ݽ+AɂS8ŔU EVb| nj6v^1,˺n{.X=ĉ1{ 6Kuc?APi3&A0VohL =X+Q̷~f3V~67OihKN.wbbQnhX ,z@^OVH]YP穈p̾\B!YC>iq] b?Fs@.w+l*f%c|w|8h9HiI󱿈6[n%t2z}Ax1ynBтĵ7@ˮ5{I% ݖ٧s^hrsxʻ'{~;.he`G/;ڵMXH3|zp%NFf^-&Y3lSL­uW&} Ҳg71`s}tq_x9ȧx4< 0J朩vBcՑcӃBHTqC]xQg5lhqs5hwO&ںl{$aGj1XWy.ķ_lwg]P IDk|:vW#yc}{qsvFt&UՈtwuW Ij^n̰aRx_I%قg+|+-ՋuěsR0v "6`%xE>s5lŘ7){9m]ivgŸtqEB/H2\-_+Ts~Bß UnY֠+ب{:]`$~%ԐhDiU= 5Q, Ӂ~t8GEb%HbM/0d$QVkGtˣY`xHDv0W%Sp3M6Xc^C3fAQxo%my2C]F]|ld y0X]ŞGEj±?k8wft`;nBG8uE'3ClF>l:Yn6(z?!Rp"f[MshV(u~=&WͯNGz/{G^] x|^$i 0}lF-X} Å<"[7InQwTB&暵fx"aM >B G;@;eXUaZIE&E2[ɀikِ>j(¡pF{h$,5 پ t%PF^"\߀w/KX,n8M󜢦0:HVvSȁm#Dƶ{GL3CnCnWTO׀TqbhiRU?/(&! @B~*o!#ݿe%H%:ZꯚBhAVL7 B=&ڈ.dnRW0̤y^q'CIwGcm%Z:pq`@sR|jȿۗ")F,돸 #Ko%r'L0oN$Kju ̆Uͣ5U?rmY!z. ƽUcUS kuf1_ϥ K+ iW:4j^J]!a{D?}ei>ҖNpGg/Yu̪bZtKcD=Q~ گ4H3l@/6:!`{3cG7f _)L^Tݥׯ[e KުN~@3}o`]B絕)Vszf\I: x͹̌z:UV– c`\dKܬ y-~vtmOygJ'03F*WFHakԥ38u. e7p=QG̠0tt,wJOXu:Τk, z[<_ Lo}>Al"h "  2%kT oJ᷎Om4~7 $k,5ӥ#Fx굚 W ٵ^}YКx2ʘ$i\ %[|0tT{Z jwak+ lwB'g4~',/Ɣ9ٶҰ|HVόNFMa ԩٺUoUI`g.J/74ʂ`u88~wg \Fp o%PSc:OGbh x \СrgFG'95wc\??B轢녰y[%ekE_8?m%@?0=E:~Öe<6Zf:Bg*3-{z; #\Lx7O3ɏ| kW/+EЗfw7{kߜF=9պJGL}9aҭjَs|UXqadYo>K\?U,jxZ:Xı2zK'/5@9Q=2 nƬtt$eٲ<9|bގa/h,3:sǖpbϹj\lm>5PO;P^]֑%ǛF_)(*+ URJؓaک%"IH8XSHanM\l-H4Y+5lтmOQVXGh~ ')$Cl ̹(Prd|__.&F+n'PsU(\mYCJ9.{9us8xU{'tvlSm L0ɘ}$S1&T!, #Rq œUٝ~;Otu2LJ~!+`ߌ+ ^s? OFH \^D:(5w; ?7U[v!eZNgq8O(915lG jPPk5 v_y%/TP@ AB&ս=r"Woy`y44)8* B5VMG!g|n+V1fn&3CNϫC]Ew8JfyMٍì;~ NLqؚ;]=E3OZ?6‡1{Qc6-g:naGѰڬO ӟ]Dd-q<RkU<:3olz~l6KCYW+yH"]Q;:paz~Kإhq?*KP"(l꽾 ެ:fh#zԃMԩ#'*#0 A!mf8`8pS`E CUH͝$ Zc4zu.< a/R R6݉dۖkrt8,05*,k.nE ׊>6$H+MYϓXIJYAUeK?Je@#kc}B_U迗ڴZ:gGMSWmonH1ACUuk2lbhڜyAqeK?M|3W]]z}<&[Y`"ׯ8YC Y@ =W\RV`mFb:V>!J4Ku[&\evՍbiN]e5[$liUi8]9r/mc[9*)\w h&ӟ͇{"_|Aw/O^:A& (u^5*X]Y啺en_0aFoz rk%tOW:*^AӅ{VI;'I(Q~C2|r2iGq,5=#)Kae^} 5{~ux۟,% o}9;OJ8Sg>w|эJzefd$Õ:+d.2Za1OstJtlm?-q8`W3'k,|OP0$+['N/JjA$"a㰱S|b;rQ8w2G|`m~ Oh|f,?hۼ~^"|0#0~I1+T>s~bBlȖrD1__Q̛֑0|lԡܴ*bc-t/l3:Ok ?h;f p[+cpׅC0[#BJO %dվ;fsK.ժ#Ӊ(f6hgUי3#c sO `ٚ09E`0@|;p{hty 5$jP Kh3#\#TJ-FK=Ny4WA AGSѯz!^Iq+]avZ#!Rv\ՅP,& Tw4:!odX/R,%SsӰ%lcZw7w.L!91O7)Cn0MŷyT&/;Z֔ݩ # &gھSE;+EoD bWeNe-!2ٚ)U}kuKP-gWCz5x}鲱ϲ!Q[s3vC l$Qfo5-Y[>i{#+QL;D8(CsfKuv GHZ؝Fјjc<46 6$zA=knevޤMq/eǦ6vNшʟBS*K͵}VllYGaVԪ1L_̃v]aKw6.'7wAޛB@OA@ HS+cט#0țC]f]{fImo/0_2hL4+4 i=A{n,9&T ڭ؎Û Whpe+ݒh`Z:& T(j)o%)NDEw@å:4PW̆GRBǏb9s⫏')|is=wCuMvOZOO3"ˀi й1PvFb: "B_!< nՏmн,v@_bQ?*VOGNHxx2s#X{W_<@~tI!8xfݤhFL#[ {`= ON=H,w}_5wYFv<߫1\`<}Y yCZ_.jt2%x Qh˓яUru@YYcP^lq^phfb _MW+al~p\O3:2AvXQ0OjԴ~BYȱA\)DG^TW}ԎeQxVivHHǕZO4Tb 7n#-&o0_? uVu#|n[0hq(wqD_ց\>KYjx-YKXS:խfZщtӻe|}Xd4xIZA|FNؕ D`M^Dk1S6=X2oYҝ،ARoU/'f%zY4i'j@lGrՋvX:yq'D `>Ѻnr@>tMh/5pߟ7]hϽXD=%TaK"Yu mzGuvBW5VS2Czd5vh]U5_/q+݂OnJ/H(rg4»HA[Aelj{^5R&Jؓ6ޣh]α#Qʪ;A E^mov;71 04=5vtEm+,U<;bb%m)QC#7\D8HΐߘttR??mJ΀k~n!_ йWQpU2{9Zr1iPc]0AE[\61X'hQ{l-UZU7[tV0v_EJS|"dm3F 5(L^w+ߺyAJTtJ")cl"p$3 +JIgZWb_弥pfc)&{c@X=鶻n_`Ѡ/滴_qoC~pC!'0e S )6xNmkPD%?gqT/=Ma|JD<@q?@xa۩40< Zgk>?1m]H݌Y AC]ZmsYf-H l ;qU8Szb禜 ⟻VbCLT*ycYu(l[{ ?$f7-33,1"YXEī٢Dr#Se'bg+xϠ (Arkfxß`:`DۨJ,Mj*9p9wfMX2`%ewZU gɌ?^L⺛Tي}Ie|.EHt҈4?c{ Ks.^e1y۸rrTs@RG=/8O'60W]؃j]jL`t6`! <$i/50fj@';y+2oȭ32/g6"އ)_|= Erx~N6b(E/IC{}l%6ĜrEq.S9f+́59bw_Mp|M{4psŰ] ߙ?'gTAu~>mjA^ꭔh{ oJ MI׼jfvGNq[xJR%ik&{;:dƌU zڄc*:{n \&X+z+ZZBTL<7=.(9,%cJs4Sjh$i|`4r?z& j ix$+ juIѵMs+)|zYfu]^_!@sbq'{gЀF9{Xp[h jS3Mky+\TvFm^w u.D0Su0PbHz J_6‡w;w/?Χ9T];1=erӫ`/Ċ7}-((y@Kz?`7gg(S%|5H!ga\]Mb$hX&լXRqW-4bCoT_ υ~SL*ДL(_ѫ 񢟻$zq,2N "m2\G1gk}mfs}[ ]9RROcNӐ5!AuAEJ o(h%RraAGKWՍ0v9=&yPgebȔ}x9D]*x7 Â3w}v~Pϋ1/n&wO҉k ܀,@ R1wŐ!ӶY c@x{걇Jc>-G cqGOz-f(fЙ7Ie:ʚWsQp{y_e D]JpwݸG4~!ݟ 4]tSkG uA+vp̭ҳY  |\vW}[ee!(ٰGV֡^]%}S&ОuRswg(ft[2 c0;. @}}[HYί(BYf' Nװe[h)mJZUHE``m[#dSM9O${[ѫXs84ļ';!Yȗs,* JnV_ DZFR `SX*N؟N_D[ b?42rj^Nm.z~ۙ uQp8Th1mZ2Xޱ-DYhHNMojk WDKT]_QY}.هs Vj f[ ,>e=z4qL›a`Sɱ#K[[E.%qFgҳ:47wb?dAkE,v#roC'kMʹf֞SY]9d@ 786-|}~(V ainH*P-U/ț=CɁai[%27jx8`rB4 O['C*?-(=W?^H\Z~TABJDTY]_>{ QYK%lޖl;f;V`&n`vq{7،duf);Oo~BN,b`c%4tySUHj 0zj%i%6nhTlzM&s=(`Ir. ݬnp|m_-$bP:Fy(Uãe#+_ |x[і@tmbKHblTV7ĕ[9æw.nrSx V4Iլj!ۚD~K~bo46NsObM?Obx6+t*hfz {"Sy`ӌ_8dO@kOÔ pM3>W^.0ݻYV/zJd-KEwQcֺ;9*5SOX/ގ|00E.JZ{Ɖc%+?>O o++ oSU""Av״:_YwL+14+}z}\cstͫvRs 9ivjth ]>c|bWBѿS豄rOc3zJNe-~|0dG :hҤ`֔{YH%߉CX-'N4--sl̟3(tgGCP}?ay1I jM$i0A9ټ0ȃrH^/@// CU=Wms  3{{RGEuugC Ym}xGzMuꎿRan?ԫ.|_1qVl1pة@~eZ}x; 5Eľ:aMg:q*ѓ l苈uD\Z^'N;lQvQt2PMq!]؞Ti5'Od]8OŻQ-/ܩ=hC=M-vyDƶR%hx#3ثuk2498-l8#sn,/083w Ob/td E~Np/:+<{v71 E͛l5LG+/J-pi]|DПxoxPYb3?*hvɶ{n*6B霼 c`Y+vxܶ[@EG"Uߨr}ʦlUyBJ[iY#GRIhKzkֶrg%efmQs+'sT1KgYV&gb`c 2Iz^ieL _޿ ߯eu5`qѸuGx{*])ʮ&-z,P׮6vvH;JZtXݟfϴ'|g<]FNUfU>-\[/fCvku ~$-}R >>a઎wnV)M׺>_0Tמn{=m{0nx~f*D$R,Lݥm2se>"1BCiu?Tk=h)[igO,Zʸi{M[G:?y[`DVؑ)e}bWz4 &Ge#yM,hÆcC}M3Gi|a9QL!]OdVW :ZJ@_^Y~p 8Mb|y`&mRYlQJh}7̢_=g-*)]PvFMVj4D$ف}G7ߠϭww?㌬oV\/輏9"fޕEEa0yPrs=g(uH` m49P=&~6I26[t.xmD !e_/4诛x~yQ3< ՟7{C&zW`f`|Ч^ʺ5Mnp\H1a+N̜) {cxBcNIܶ]8Ԗ̾@n0qN]8.7K|X !0}X -KR6%F+:JvtKRfBXPJ7,^MOE(TWVSkJ ^B__.` Yr^U$uh5!Qr\dw)[TM jIe6#}xVI¬G|jXf2Nڽm?˟k$]j/訄崸u9 ->:wIs;J7%%s|Aa=hr팡}Ǥs/n9_cK'Z2fPEGb #hx>]=-Z%+dO;\*BtU%UL;*1gM Yv'5q®FjTކ}\{C "gːіsVmDČЌLzܑɞ[nS,xE ~Ӛ 9S8Fplt#ָt"|@ԕĿNr ^y~r5-\b|c㗓O~] ~9ʠ@}[.k_uD9P >i9|gkRWfàd= `Ww l@,όܻ^Y|jG|>f"UB߈m6WXQοTUt=SX%snU%]_sIa`$\? aⅴ?1(vRVx|g4<. 7 쉖+?W#_sp^TEzV Fs=]mYS嚔ъw$٫mmDnG,l:aHbܢ뮼F[* z6z6 .p{BKŵ($Ag~!\SR 9̓KIz\~Yz- 7K0wU4a?H_g=1oUaj =N aT\"*RJCrTgI#a[i]_;+ ;D7"(`8K^7$ᓮ{р[7 ~׺N 掟<.E%-<>bW([ hEq e^u桰׺r +$D[B]Y qL4]^,Ş0 ,{+Nz{DX%gij؍S'3lݦ#`F`Xj !4icڬ21䃍*,h5c_`JY{!%; :YG5WKc^=,,2bCTUެ78pGrnLY}y )H\C>7n#/AJଢ=!LBwO}M|4A+˽bBT#)Y`ͪ3Y\&-x>ZVQ9Q"ұkKC6EpJafOzTQhut#9mdnsR/8ySEZfy^w3ZuZ;+F*XD{GɅ=5c:+kZk2<;lWgӰ3]-VRυD1pB<,]ڟKPG^NHm4̬i[tb6 ԾMbKyܹ{#ýEYK٫_zYAyvB_9n`"|nC hmO;ܔphǘܷDYz 2nc2SLAgLEl!SUI!5k-~zHrlaLN>=j-wVv9#ox5`?Bo6f\,X hkh\k"⒭ɝh,ͱDZ" ~,M#? fu^2WӗUFԒO noW\7ܡJKB֣\EmNtIFhZ;V(.tr3ghAyoPV}RaV$S\=R$1U%-[6 IAPL>rP]`PU&@L$զ;\} \c7ڦjSe[_Yi^}*Pc9꣗;zg~2J/8k8>;`s휜h ˡ&Qs]^[EcM&$6CCNH¤$|踧:hhrKFHdu a#Z*mU) ՠ-t7S1ި 8~]QN< +lT !u,YZePWwLU_۹P髁ASBN/0|kewREp&42Osv{qJ.;>Q#CҊ0[4H#٘`,8wژ~6b{-L+=Ax@¯7}kQ6x.iX2hkԻKE]aQ55h]/޺ wpO(t*F=q2-!:|إ|M'[y $NDBR^Eo(w#(6W B+= LY~'}ju~GOl?3bi޾}RpH8ENDգaC!F"֖;(E0º5ϋI3ݜN,3c/A+eܖ⼩'cZUτ? ֪Đkɀ1)&”EzP8+x4TS,EvwV :uuy2u6(-ku :sxAxc~QpOnpا֝!}_Z'O=5|ZF|fk NeAG$؞O͒ r'8Vtjt̉#%k2_3%e 0Xt/'ϹP>~5pKᤪ *?iy:˾Ir}R^ίR<(ilަ1R[f;\`QMӳY(mmEvQ_iQm/HcYbMZ_H?7KJu}]t~+g*;рQ 5(7zj4Sg愃Vg2&zJ*;URs':5K}gV%+ X,I8CNتq +ٸ~VU!^n6IB(y6 "Uw9^#hkuKsTX 7ғRz3zBv$Bpm&Ȝ^+ zBƮ,Άɩu6|*P\P ƕ}i@[qM@_%pf|KvS0#-6dt]2\OڒmiHh o? .cƧ̷[܄H72=i [/+:ξ.t=8| lm`=~sUPu Hm>p{W)d"p/:=œccɊ?nˁU۩a q(A|Q{'/Wޢ'{ H-~NP{c6 %j#8I\K46۔5HLRz{-qH g.an;z7=4o~7-{nSM]*Xk:lוራiͶifLŮPaᐓ:c7&UYw3%#R#@[,<48%J.J BM9ɜ-Ύ63h֟uSƻMz!LYoWۻjD?絖 ?>| @ :m67Xg8'6{A;Z)iXu*$ɶ(?vE ~.`Q_Vz=[H~S=a<|WSzp5 ܶu͢/n4~F5g.LUN[F朵Ѩڸ-,~vl>P.WrR=|ߣl'gOQ[hh~·L-E~y>>ᢉ>}n*sG a#_8̈^~ǥZv+#(ohءV>TsT_KAn==V, iMCes?_՚bk~\}ڽ!O>}Pom5F Z0fddcc=r3MȰ"[YV7y+°K)m ^䞣 kXE w+Wuq> S\y#ES9/%FKQ?Eyǝ _`66,ty#NHCpt[o,FbM_SF-0=kS-'vV2LV/9krOg~>?%K1uDCqQo2>W#=䠣n_>_~mգf2:⻉@ <uHFݸ^64d9UwrVO^Cy@ayb_?hX{jz mĮRNϔ;s"އ>=#yn*0Pvo%Jl#;hN d9:كu\%hS>b>ٴ i֛RZe\D=M.2+p;yңH_g:Tѝa SB qYx,Gk!ťA`Cnt3ẓ̌ںE*V>g,\]\'UOKW$]AZ%J+vtS[T})X=oCWY,g!oe`Xo=;HِBrQUA5 ]OOix2%,2&߽e;Z|;0CZvy~uR i@$H^G國#WOĻʤXzVuyus\"Oa] r{,P\k>5xSdg4&Q0K⮐n;O E2zB9a>rn}W@Gb0qZ˙~D o Ny) \ ^l'b53#zmrzÍr;O&4H j糍QIKoZ#qjI%/KC=[l11xɟ0Poa=쐄LEFSմf,VwY*u$ޜm ׶*XoBd[Prgɿ?cҧ _!<g ֺjw1 ÎHj@ՐI.v N- /gTk:3UH[b1L٨uH jlvLagɠ8XMwGlhGCWBM߭7kyo; v>|rB >>7vm|{Ĉ% hȟu2n~!~%>ECVHJAnOWP܌9ڣZ2 ; *Vؓ"Qv0Zva̡]{H#rEmT?"_H^cZ%@ܘHܛ#Ɡ/\ޖi{?"yi|ź=hBT&cg@:&Cn M2q %\YzkIH_;0̊FZ 16yB-W@E w5w/Pa79EHio\*$i*'JַXv_p7ԋЦ9_ U~7gM LS8y-ߧ}6nSf8dW3V{{qJcua7 Ka%Hmf3p5Ȇ:AQPS|@/L= Ndce=ȾK#vt2+ʼ!U\Y:vz1Wx9Q*7y2m,#WDKĻ[[6;knu\q(#\)&.7"]f3;Qߌ!tVͼK-۝#R2Bh! 3UN?Ӗo|ev#kύ/py:7L.&\zfCZzTm}_L {ga'Hj-*bo!m./`4o;?"~<{LS0  >A"oE] h;/Ø5 %bt^GjnM4=eB]u?/&ѣY2Ũ;8lc[xLoЖ;kp~D =sabf rQ~Υ}X"T{7)nʌЏ8 ؝۱uTx+wOk6]Р?ՕK|`%.?Pʗ%7M#]}6/-)N{A7jdK7ҁ6NO|V8E:/$ 2BerJ6)Ec3I:Wa`6&=Ȧ\_mԢWRbQKK%:C9J" t`1LyM/?e0 6|9g\;J~2@lFpGiٸD=?=, fP{S\⽟=߇o|[꽠+g w3Bw:ΎKf]Ch*maBfSD-h`:ִ 7K9+pmr!rj0dOĸh箥Z7 __!G/Dc#BǍ*~$Ҫ};dO!Fu#`_S >;l[@àԣ5Zs ݽeϛofӱݠ4SId*oR^heQ=/1MV뢌~B 7<"Ln[Ai P^G>xX{In'dMNԘmtjkZ"jrU鑛l7~hVcX$[ VOi<̐l>8%Hb= /ꏱF/'͚<5Aä&s<=z ?%BFO3諽q} {n=` 1M"yOgE?끠=A>}~'-}+ɍMimې(n،#cBȽ 3J}BZ&xTh[ͯ6I! b3sVpx݅JQ7F!uMA&c9_7hmJ-:v ;S`-$k 0Ά0\# UPݤ|_LAR^(Pzn#ZeUvghV#E7r0/|2OD69x`>V/A 0T,>6Pݺ+&,g2pa=7pnQYn^6ź^Kdoe9bʑ|52MZPi83)jo'Z*48U*?`x1tEN2Yqv~G4wixxwnJ5Dz{V,A4HJS]o?QNhJ AmEȓZ2 Έ݂ӏ+{v ox T^3=b) UAŴfPB`-L+;0 2wqJ?ݽ}xg@,jO<~A旞ۏalVV= \^|Уp~T7nhN|{Nkxw(y]oާ)1j*xϧ8-vRz s:[fLs'H.4vkݵ1;$2iH5qה΢c ,O|N>rK^~|Be[ d$'59ףhَ8jO挺"b̕0KrW$Hn EUQ.E/v{j ɹfK/oB ʽKe^>6GQ>[cu;SSg=d0%a- C ͤ~YУr0Bj/˟/!wqUe( ~Vm1]1SxEB:A(xKSGćz|ulRQZӧ67qn*ȶ%ulV2ch/WtoDS8S .4S$cvme:}n7*ZPbzrt5l=M;{+-4l5mgbfGno`5$-iORhC#=-xR .g%/@l˷p %k Ioy,fWYdQgNhyvEg)zpe{@*ÿ ҹ j,~gƳ\럦KnPD%ȜX[еL|V;eYtdՖ9[SD(H7nI,BC w9% viOPfLReZ: ] *bkr]a2p[ y+`)?'/ o} t.w|B#Gw 8ݬv0v޼\"ٓ]4ظIzzǠ0նz0 X-bɌ4w'Xr׏yV zM{cߊ.Xy#8=s_~dh_I?#_E3=OO[M{9PT!"3TB\ l`判n,D`wiɪw3Wr=_nʪSa)j3so*&_M{?[1_O\O@` f sm"sHhC/5ZMm:KCقO։אY-Xn?oDZ }R,!rt_.#vW%p97}%u>r<דy7!qE--ʬ jD,eBC{b2ף/ VÚEI/$WCZ5~Lu֯ 0MnUlKh Z*0hvM­~,g^\ffE{=//HRyx5n/_?Wf,SbaGlRIx80LArJ-m7>h-f %Ӻj&=zt!9'*Ir6!9V?~P^+KX߂ޞ k)K3vmymr;ZFTG46 b{^a*)8c~'G4ZîKye'6?svl3S hy[h~L~Z!xX9.po$̥uꀢ6[H&Vf= WDFkdb,ڵは{\n #붇 QK='_sx`ŞB*P[}U6S}UC\y"VpMygjxhqV\Qe0[o!;<3M1y9C|[t $D3\zoE7FC7@&H-Xzvy@hױz` =3K'R$ݷpjԢ]v,Ƞ;b'yW m%7Z(kc߳[aНvWf 3AީY(JnAW%^g 2PlDHd|WuιFAr1g&O ȶr@}F;X7)9Ddm6M^Fqp5gr(!7 y|1fdH r 5pȃpaJ!`riO6X+ co5{d 4k$tZJ[ WYPhrUMe5j^\n @URL{:Bp24$RʯOQ&z*rcnS>O>Z^ҷ[݌a ݩRso1=:O+RTu'L\] euU')fkD&4N&5g-CS&KU!.[hK:"[by?K4L|Aq ů~ƻшwӔuVR}z wD{6f74 AVQӘfMa6-m>1_0jt_#,kO*$5K>#L6>5S}-r|SNu>[ZFSD+'6EK@49<^dY³v^F m`<˱+߬H Qe,(YK i4:xAf"q#ƾꎕZєt?-Ƣͤ͖C[۹@ Aȍ'\u[ ¶ ;Clɻ Cem]m#gk+0 MoР[bNd-OQcCmq-Ԉ?$JBY4R'he]|A+ 7,A} +.|󦲽@^k^PP'AIzM,כ+vlc;X~tV>'AlIGV,5e{/$j~',Ui `LTB,%l2Z;3w.F,; SĜxOz蓽'){n<)<ϱN5 Sr[Ȇ/57OY|QU/0Y۲8j jrU'Ueh3]"(!RgkfH*3Ƨb}ZV 7*65o솭E z[۵mKբ~rSu⮟xX?gW@'E7X.ru#.dUoBKoI-:Mo~|^~*kR0!k5]C=~JN'W>xTaݥ4; (]Ceۉ DA*m;*os fNM̳BЋyToL):430e^Ooрp/QAJ>f#H]R25ږNjjqh#KVȬ,%mPP#8Ql?C4j@{O( 8ǹNEvj WjUcg7} Uqt5v@ݲ[̡b)#t F|Ow\NoltVNLjb3ɗ(fN YK`|Cꇾ&PMcNn'sSQOT|YJNlMEeZ4GXinagiʲˇ1K'USqm6͵,\{2: (2+ P5MCضx$!Qm6ADžejS0Uu|3\Acncmj @ϴCQ<'xsMe5G/ -55$Y 邚 E/VD-ޱvLw]+eWt>|~-[4K?@~}Lg\7P l`Ia=$$v=J3m5פC53-hG $`&. Tmtۨ|"ux$ HU%1L6&d{6nLV@i& j& ?bڋZ ^&ͭe\WѸZzy LKEC Q59W-j}p~KӲ era7RdW{CקZw>ݍa4dnM}Z1ۣLI)H>@O<w+@zmLaQidPa{iu \mCܶylVG )nv֨_ؤW(.:'z6?huU0/cXqH)bcT,iP@z9e=CB|Q!TV=27)sUt@AsPSz_(5j!2NV K"Tzf[Zq2Fƺ:!F6F-V"㚡8lbN4o7Xfn /67aߠV6X>ī^-];+?.Eg-qωOĹwzxxPA~MY\up\Gvݥ綱"p' zZc=>T^߰3ؤŠɲ|E|Iwa/j% c[^qU΄e`a\¥3p{}.έ ZOpfo$yBDx: ]z s5al4 <:^k6A?p8f-%}頱Ʊ-ͩkJww[rVVo.6#Bʅ\ Yzf1辩 C:Q^І8xu5=ǰUUJ0ǃc7bS\3 1&v%$˦ag(,8h.&K,lp<{B_u~Y[5M`Wqk<\pQK:},FjUԹ_< =ex73O^~NͿaN˧&ǜ3o<)=-٣ngSS~f<O-ك.(uc6Ad.cc;|٬h.&kۄn'ZjJIUld鞂õN!>IC=B/upnit[fJi[0=} Ks}{P|G9(&$~OTJݨ}5H =۝L[E̥aVa mH{1rld^-P^"oeG,j~@y]ehJ͑h*vBS ɉUoptcK°.B9̈́`&KY‰e15 mNAO)Ͽ@nk.hz㱾lkөDByY7[03fHͤqf趺YDk\%ƙ+5{ka5,}҂?]WM3.hN70 w@*h9X^:ס-2HA 9g-mX96Ӫ6/q^7hrrlhT] 4_I5rCPvA/-+-P~8X]Nņ8 d»G(ɥǀ ;]X.2Wt-C+-e $)/TqZaV$=GrnS^Ti[#UʛN*U-vƙW@*ίEۮp>{TF\mӣ);} կ׹@YbztduGȞ)-Gu- j3ոfLF{dӰ3]teMR:{Σ+A/ne([v ]<^Rݫv?L,+ {y7 'gمWY: 0xTq|cojsSV3Meqja=7DKD&a8\k\Yzy\s? \u!+,;QYr掟kG<ҭ:-w%]5pxsVՔAfp,l:ZfNvZvF$;5O>0f6![J7vSV `plNXwWwêTNFeit :z~K6Mڜ5ji%!Nh S5RKӁيH6<6-$Z'ed@θ j2~O&-BggM^yW YflwLrzWQ=z!{ 87&Wo P&qCᘬԍb'5iɎ^1(UfA{U}WC} m*y?\N/u? ϳѳ:8ͅtuW+5eM Ao3j#tKEc6t.m@qD+h"T0g͎P6ݮ-?Wcf[j [:]>oh7y:n˜z7YNkZtR ^'`q ϴƋC_iJD_ H. oڒ'D: /u`/4I@H"9tH/TL[| G,YZХFLGKW!Z1w]ʔg>" D'nC.FG@m(md1y'DCZ$AGT=?Rl4N.am=3on"tL7'⹓A:K{R~q\]Q؎gno  hCL5&54M:n !uk =[9ԋf|mFs7Ty:i 1v 2F//0v<ե"/o.ajr~0Rf,KVW7Jrw7K-?/.Wv_f۲1P>Ι/_j#N:o9+~T񝏳9Oezw;K³JȓIv/ɐCq R5i Zm: kqĺ?Mg<3خT8=#mTĽ2 x30S{W;])-/+LL?*>~u!Fj#GgZ{!$\=5G!Ct{+7NͽxO6v6bˡ7s>9sZ81I6tlf e45#qߊKceu:&-ICȊDS!Nj2&![e׋Ԍ f3V.[4Ot+. ~Lu]Y4bۉÁ[Dj#/%#d6Y&.)x jG ;we%KE.p؄ά=iLj)]yo ju:m: !D&72K)8ZlNi=p[u0|ͽw_y[bznpxPUDk1.s*e&N'.O`_;Tr*2Zv^l {PcOz4fzM;0㨈~C+S uY+{c't"ﶹ-` AT*{Rw]v!o6z rE,ܨکH;Mυ Ϯe&ꝏ${;X{x~4+0Bδ;@E#gjnqs/A-Rӽbʅ֒0~}QwZ.wzΟxRzոl(k'sO>_)4˵dp.^~{&ձlATǧ $tpB7^"ӿ}>%owTT$F--^}c-:ܔz`{n~./A$2;/ hk?&Tjِݛn\ {h1}g=U8E3?]Bu /C Rii{'𣜃1Cu5fQ>-y^b]|C_h'w]RdDw@cƚ%ۆj%`xklKj8Ú2uP;XҾOI&lФs ~btD~GcY? ~eC$so?#p hбud ]9݋:\i{ۏhH}\ C?1}J|mt56^=VD:j'"SQÿnj(q &Ϸ*&IۋV|{*6]}QܡLyؔ:"&W \#{5)}o̠_BngBo+?BQ%^8q 轾)\4hNz^s'ձ8RTcKĖZ)nd&3{]t,X [%xb|Q?u7"i{om8AZ,K/JcC+u4p^nROKres6 )%vH[/ɚh5(Fޱjswr~H$c@~k/7'pi_ݐV1 _葻^hm\ơՁԱ9 Z m׎lva^^>8x 3(#k"Thm$Q}ÈM;6K-aK2Lw\Y2:pr_b夑lXM~~4!E?w]RP Nɿ 8!}T(]#{G; ΪN@'0Tfxv>A_I{V5Β/Y=t䅻WyčKEoW{ra<;^=xj8T2:3-M69k>fΔf^=>t뇞ЩFl7|. `?Z~5*]bӵ'"v%Ҝ6[!y]*p݋яӽCMnnʂy)xrfUqcӃxPXl4_ QP\'E--\O %!ބڲsw˚&J6Q dht+rK7X$+[5-n;k<H 3$ ]\[1i5Uh[ hC{?8C4{p S?ㅮ4}xE?ڳk8^|li-X(:Vعs]Zըu_ָ=dP .glQϴ+#7Un Q`|(kǜe_ܜ>#;t@?++[\?+ dU(Zgɲl*⍚ͮ.^\xͺ:7z/ד>xì(v?,@EOq6n.D][M u`Z&YxV tmFwj=ܩޮZ(^R]^>@̌_^wUqr#B7p~gYr/ kث~L:C}iuj~{(}mNˬ-W̰SeM6 wy>Lz2Ă_ \ȽnP(Q=N +!3XK wĠXKΐ80&M(Vj1m/2~8)K</ B:J$XWYoK8-|]ǢCӘ{g߬WnX+j] n. jy*ҾE3FmkI24sN UTöX4=:S] ol.^ RQ#6i?W9?3ReW`癎:. /сMKS5 tX=5IU˶fE) M9 {rשTza"H;O:C'ߎg|\?$bӟqY@Fܰ?LW L9l_uQbҞh-rQ6[S+L45{}ed)֟fm:zyɷ'^A3ss|A_#^2~ӯ'ϫ^ȚNM80% ^(mYh'[1X/xC='v'J>oÄs[OFnV%ᡔ)r78`Tp;[RnQHCnY5\\^²B]AW++vV8Ʈ^S mc}{E[vQ`ޤu^hK9Qr"O t>oyON t]>BBVKokYsM'Ko2eٚ/@JA}E\sy5JCi(3' +rje{54W'B}Y#W'g8|R 2ka17Q5+UcKbzAoQzv u`uf 'zTkAi|BJ%lʃxm, EC&JDPЎ&%)[%j,MF¹l٫qbqdi6񡜔xzG2LSuc_m٬o|# |x|)2Z*t]'u͗"v=p8&r)5# 4=I:ж^8o7bR& Æ[LǠ璵K|F~7+3sXb`ZJ5NCVHyK/l'7KMc#Wt=雅:ay:#/  )oKP2Y]֗|*ɷh[{J<1^I7^zs7!:)? BNjVAɕ= |OH@vGW4wgnR T؍fb?=kكJ >u>C{$_ɯ_B%,uD43GȴLJ9R,~95!ij,fn6&a wҺd}lhcƣC++c}<.3,)F[> f o Px[>hq>TՒ8 $*+,:y;=/$Raڰ8x5IR ]Zjxgԟj[?:2a.^ ,E{@ϗ V~-;w\K^h}R!:mvW o[iug&yN{b&ʒcb$qt׽~xrVq1mGFEWux/ w؝]fh1Ic3/#_w f#WS'4 "`zPmS7(nĀ5#H-c6d-/fQ%&*˦Ng>!j4P1k; Һ}xVgNx6%!ggͦ,qp"P3\;Z a{5z;x~׊] R2ݺ19ZM`\A MwݪԂV ءw}y)ɏ |P쥣FGCSH%ۙ/*;L}WOHNkngͩ7y?[LMH3Jsfn,5:JGWDA6l2ɷ}k5w'dQnyqQǡ<"*IBZAN:E=.ם*kx*7 di#mu sW-JLZ3wɞjUH7 =:dӅuy:}r´.nL}IUOnNB/h-aF]bls#(Wܕ_T7|=p[V}]q1tЫ'!kBu>4SRk`evv0Ys(9lR56)uav`󓠶\VFn^iI0{"tJ?vaG K?OϏg &;~Q]bfU>|^WE8s,hvX ˭"wd t4Qmh6Bji6jaUa׃-q y7hgܥ@mBy9ȿ iq 561P2[?v=6y+#6{{"·?W7pnށ7dJml˜X5X5 H7TJ>;LE ;ʸ2dԑP*'T,r4%hy1FPO4@wAʋla|(|e\ ]آg~B#mi vJԩ>]4fe}n8l% SV3LCfds&$}GozcCgɜt/@st_ʞl^ <֘54G5Ovy vpѩRA: V+[;:-"6(K ߣ<݇ w:JHt}㘒*gMX`v^M2滛{$J(p7N"`Аw>Ѐsz 9L8vmegwufp7Wl̥zkXП,14OtUx )o7l.`vKoH 4S͵ Y@Я6O5A}iUpCɵ-i.Se+x,YtD:I!C)ЉժOlHM6}m6Y}.{SpurA75Ud uw}whJ! XWYxG\DUU|INPۧa%v M LKaTj0\sn7vSܰYݎrqkN_%jg_os~{^YwАJ"w m9Շda]EN ?|8cwyf ӽC{9!?3 4 V w)d I5注֭eIll*/xb:}~S= ﰵUaL[<;x:1t~:{Hp^g7K\=?0IMKhnh/RAm_lvi[F$eTC0 !WXY"83/ou-/(= ~D ~A%ک8AkJڗziRs=$*xU7QCW/tF^v,* ki99~/r|Y7s>vQK?&u[]?EUH῔e]ZBDl[,rNҕ!3vf̉.Xd*O8N04g.P$ܴnzyo! [؇jķ\5-hB=vj ٵŒ$ո՞%(=XWU*6("_`ȇc&# !o Ke'g M ՜F[z;lZMX4TiEҼ<[qjϧ,كSP6&*.-b4T}H9eְ{p q\1#"yFO % q9(=o2=C㓟sE6|r^^Z;?#G.z%(B.YPjhxu>)Fіen,6)5ib*lQG0v0Z#&T7Z#&?/q'9eR/detٛ$gX5rkBQlX>1T'U>[q4g.OKc ËVS^ww8}G:Y R*4~7Úoq?bڌw4қL̰tav-xh0nct#'kJ$i˛VNw`7?nĀsşGߩ- OsyY/ iljX,)fΰR ˥Q: [tָkwŪgue rAraDO89@pq:R 쳾ͪBRk%wR&3:ku05>VKk~]=\K=]cO$Єb.qYQq!cY؎>PU<c jG!_1||Z0c UUdIv?MCt UN'7+ BGkĸeɤ^jrϪ]h [Cbn

)z*@}]͡_5ZSnm{ш  bZ[}&14cVk&uJHuyIm_}rϭ"Cu&]697͈r`ߟB{5>4[<֦>9UbN,BfN>Iv:Oxj[7lk%|q(nXdo{gNY U&i88 pnE zN i_vٿ4/L˕F/E ߔ} ~NXIt#h2'%:.$28-lvU+I@ QK$֠ncX=oQ1(8V A!NW'y[}p*V}2VF;k@`P?nC?asOS|}-``۷oR1zcoA+Zv[ `ꕵݖz88 c^HKٷT8(m|7=%Bax&x"c4Mȍˣ 5ACH}z1#jyb/N!t>ٗ@SFC^ŖVgmK#jnƒ \TN$僒$C륩mRCYM`w=YSR/0?E|#j~V>'G|hdTD7jT9LѲwjE x6+Iݏ2t nfvkZt[(X7ԪtAo =Fo)T _Gvas#.8..= GCXRI혩 kL#vm&V4$ƖjEZ7[l֦z-iBb{>_Х|PMPUGa3W Ζ-5TTi" *-0 ۤ7$լ=xפȔg3n;@%gkHZZKSP#.ΤǾ~= {[Mš@Zi\1꣠i`WѸ.d4O2>kTVBLhr; Q4ޓoLᄢ$$FhH/X`5Ng:l^5!нaTG=xa}L|CxTIq@2KzSEUq :oRo~hxoۮ~=H ;o£=7== 1(4! _]ݯ3Q0wwBД-yD@+6 IG1r U]FF1ng-nl:ݒםhʡq,os, t 9*uVXLFLLI[I(9O; \ tC_ |%x8~:/b1薟๞M^āq5+P|;BwXo'(z#/1^@h +x41~+@+r4maJG_$,7h@ x9KЗ*$FC#w?^/"+Eao#w8.1R&?2DO /Lbܷœ?fhD3oѡ ҮGSCۙ(3 (zhZ W hM\.˨Rkr8{LWOF^;{ٝ`ɗweD U]xylS&2pbgG|Zu Rn& l(%& m<תu~-l¶MkqGf̭#ה~Bm6{*8\ =*?uI2k/٬jΔePj0rɋۆQ /g918I*6]RGPEzΌLIG|]*`l ntÓ}5gՑTd$nq$L^pz~wO ;"e$&uIhdi F \|8>])5ԖkFb I-{@K?IU3 OqۜfO 1$v\BH~/4H^\\^JnU'loUV;7kʒ: G{cfԚ 6 +(tv˻3y's' _ `oXG(E~ߕ BzO2֡O&%]66' ?r6#bbKg旣hړv+lĨchZ6U~nF}x}ÏCgG+[Hݾ+ {pjZ*4N8 mOd` X`:0~gMbJ e\'I-=?*Ba"]`as(}¼8fa Xqq9haB9K3lk2[ ;>J)usYPܤe|/&iojM%iOs]-3s^j9~1kEâ'ohebac9#Hb@\udM5nZ5a6ѝŬv!ڱP.7p{>&G^?Ъ%KZW!?H| ##.3#Jx5Dr^mnJmfѡᴵ i4] $$K\ȭa'^aob]w?ymˏ[}ʦn.>&0 Hn^WKUoj+"Yh1Ke{+QIinikvg@r\TtA`yE'hJF>E?1'nEnpinˮ=nRUn|+slxw0!ki 1Ʒ2Z]'tXzh9mƒ8djԚq䖅$ݦ}69=kF8VҞ0&m WUN ˑ1'٢OjEҞ!Tq%3j9:BW]ki'ܫ&T-iUn!I^g_۪HeQ8,_Kf@tU*3zn)TC7: SJê䲳lo[ UuEC͌g(|9] X;*MC1K5wE*5)KlM=wckf6˅ѱۖ [r>i@w)}oGÝ"OHck7DFCR lym9A9`!'^¹ٲKڕmz^Bݕ[2Fy+6 K.XY !YKP}*IG d)q]LKY@+Fͪq%}9 傄op2ZP m1Z}d|k!ߢ-tq=+mE ;ku,+-Ͱ\2[vDU7Lym}ë=`uۿF*+?s GdC7uĖz6'y;-T3Ԓer.\RvO}nm>d¢#VݶޑclFbW=7j}Gs=t%Q7hm{_F[)?d Ko{.k㒣{QH)w*7pcnc OqNo;ڌvFJp}Ȯ kiv?v fl]X#L!ltԖ3dVGLJ~UQDϨ0L tx"h땗 `$7o*tTRWi0+/Hlz~F hQ.TC&¨j Hu+Vݕp_߇Ӓ^df~`}K;#H'[j=EmEGa"l_k_jƲ:pݮ 3M Qɖ3۾ojU^۴@7>YJ(Iaw9jT] s_EfRU㘸yOItG+᫣=RSw0yڏ8 aSyL>YkAYWorG9̅ܦ H碛/~S'wu NkS\vnYu6I zqz$c^]jdUJCXyX^fcވ⺶Z:V0+q~cp9(c D5(]ShsτWƻ5.Bb ZUn؂)Fy4[+is.ˮ+3 G*m5-utk2D_h2bke|w#R~kVRm#/f;hLXnZv`sEe'셾' mYJ*`hOR[,6N։p&qMܫФ樷* Os{PY5#}g<xX=r*"o 0^S;c,q?kbR5sŗzՃlCJ)TL0lh+@"gLo'q <\Aw~lyYIv{;_4;rfrV>rȬ-&N MOW&{]Z.'P[rP]A6n i]؛'mBm;5cSʱ!yx;ɺEаSuc9;L_i#-p7`sb߀hhMZfDvIVU# 7mRU8?6u㪨"7:I&[]djJg['lMd=g=k<:J 3 UqRnaT@^-{N#>ݼ.ߞ"}{\SB<ظQ=s kp,'Ɠ]^@^^|;G$7m:yGP,ҫǠ.ì5Ɖ&5IN)iq_Mܦ:) ȝZ\Tk\ 3sɽ9W<-}N+.OSo96شؖʽfgv>%}+B7 jv S 65J9KwONTWA0j%LM[u}yP~oa:YGƏ }Y8hѯ1/ͺūZf:Y~= @B(OyCy~WSC' >b܁002?m1`v1;kl}[BYni5쩔HouwlI,&af ^|s hz7y-xm"PKdyaIiԥ ZJgMvl>ro[XhN:LkgSq:5YY-$ )}WUH q| 8#|WPf/wv"3$Ҩ7ùrZu+Ǚ=Jz -Z$܇ݙZ^m9ʪ̔HrlMqG[Dɡ~id!|ʽ{q^Pyv'?/^Y]GP}i,܃>n-"=n ^o/"~ZA1--ֻS %JKscCRqwSjŢ mD'x#'!C[ 7>RDwH> @twyM zkqFǁJ\b H\ӀX{FL{`7(feTvFݭy?$2ʁ);W> dv|{:Q(E2s&?pS\}Wޢ-mA|-^*EhE]*|iu퀟WuCLk.zm}glq5M|zo#2s|YRV#߱BEYI;ȧdy5A%_o_1}ċ k"M;rIӅcl\?l*j H8x9>_5$i5zW*兏3#gv}-;k/`$vyTCN:A-1۴4쀓#U̚.>mw:!fO"ӊȉ6(U$@vpE=q)ٸ7PVyF}.\| ɕ;cjU,‚f SvFvSf2?:C[vTѴ&׉ ctcP`ݫL ՚Q &9QԮʬU3IMf %FwmGGQ\uBJ>Vf27SIh:JNGT:Sml՞G%n/OUhu5(LPQ9O kn(٬KUQr/lmZ9eLCU. ڬ`ġVf.+Nލg]T_9ic䅩=*mHMo}3/\Y й¿ыC.?C<ٿ,`o/}Ep.|s4aE{YV-#^М8}WV{GpHFˇ~Wu2ΎYt5L Ӡk6~e fԶLr~ϫ?b}0V1WuOO)3!1wRmvtj wyh$S }(9.y4*L@a|M1A=$^1dk "y#쯜U|߲STSJ5m01 7kT0lP8Qq7ՠ{l=VsNg/ Tz= eܖ9?A{^u>ŲQ[R׶ԂTH܋TwTSlSvRUs1z! aFJWgea?@\Ye+~Fgqae4B[xr+jk]JX]tgӕ!#8kx6<$adGa7m{pN'L¹ErWot2l3՝f^v [DЬ0fOZ;"~3k^.07o/Mf8' ?vYʳ7=G>VUbvU@=sVKWirt?vJBYHr)w_{Gd~w9Ev 4|@zM061Hr(twV<6iM_Zx\ҕ)pwٵ0WQch$;FokT꠲l_# U@ @Q%1~*T!vF\Qn,T Z-J\3Qe htH<Km㤚M]JA~سj}XU}S<=c1[o)/VC>4zs6a;ݕZ\F_2ብV.5-Z~~_b]ͩ2YW{</doV W!(ًgJL?JFZM=:sߝp%Gըf$e9+Fp;yyBu,Ǒ|@U[`9e7Ğa1ΟnX V:ʢߒOu]ԭ|`Dvy7VcRn}}{p^ĊfX{Rg>@i~OowFC 9}aM7F;n2dw qv!8e܎0PȽ\>*bl՘W|K>dac*y?ş=0 "_޵ݗ!Jqr.ɇ]]96+*nуABs=H߾CIʩ}h{`,>f;sL~' yXn[3,sax,JvE3 ިt~Zd{b~?5|nx|K ouh:C@;@5t[~B:%:R`@>$<^9~9a.mQJ)ڏ>B%~].O%2Mo6t~^^=J],3R"xx=`v9ml 息]Iwe'2l>eT$-bz[|1VYt3L3F"&+wHZо%V8 ͧ,][&Iʦ]7I /[X-1H&,Ɔ:O-KS{G8_Xrġ+@N $|(0aϯwC[?yq2P>?_(sKih셔̆}xFzP 1f3oѡ@wjR S@+ {{9+4tc '(.\"\@i=ZEUAs~M2#PP%Qu Wmxgմ5^Fa՚@ ݮNuf;`SFNݖXۃߢh%)tYyEFG:&!^FEAݓKؙ&5z4>t [  εⰒN[&5ri klk4Qۺ?A'=A ދ; sJs%:#>~I=XL{;r#Uzo?&%TaK9;zs_g_ gӉl T &taΎ aR_ON)@эzg*#qk8ڋ Q/ xcbaKTFHȪs/Bjj10=_w(P>/+d,O֌"q݉Z(VXoSm#BǖЊ%Rr(Hj5q{bwcÅiqWa5]2UOt3Xh9DiYO 3N  @tZ LfjW#v#MԱ4J>O0+sQ*OmcRmeWغrW-> :N#}C%!_q—;oG '*XoET^@Nݠf=SJ%=vƐq0C3޴V6䣄ajO>9.Մ~@w>d[䄜=(m,ϔB) ?L*IխCzj۵nH٪!Sq;%LE]-ꯔ'Kxz(J) o|}e)8',[AYn!{0)FF8#F,F: KxI޷C-!.`y/[L_wHƞmr=Scmg.5x]-d|@46! 䩙N-KgA2r{YƐnW$a^(S _^4# ..V~hdm- ͖'/G6P6Am;ﵒoBɯ0h0TH݉حVLlLf0fj\b)3Jr2'2ĂoX6W^߁iyHߗ~IF./Ⱦ|w^EkJ!%YFJ> &}U u&Ñtg~hftY`9̏/S@AMK??S>Q~ i釅-b>EY`\iBP`iyPecxfs, Zt=]5K˕I?e[}`Y#7#g~D\`!*l ~v W7Sp\F{n z!O9 ȹW|O"e<nqOD~^*?jr0D5"0^>r\.k o&ћD-t.  4\oF>Er8r=21dL! `vo!0zY:C[=*:Ko *u52+țndmz .1GH = uT|A38g^ =Fw;K $?H/t2MJĮ|Ύ˦| x-#=nCT:r[&n7_7QjǙA򱫫lgwV;,DtO!y !cLje_?98[0ټ{3Boٲ%l燆emYN爟 =dGdџ>Oad nA%ͿìϧƫiρFbC ֈK"m'NS-9+bW Wwny"K:=k)M-tfK%2U|.|֐sy 8+A 6lbVs8_J8(윊W؎6*r8*ʰ}LB3ܔawCWxN2T?PuќY;{x'|yg |ab_N^T0aMj ;HK#6GToTqt\kզP`Juw|920/{DXЙ d`:Hvd/t#_ 5>H qL*Ao]s~M5ff#IԈwj0$:AlU)mŠh-"'|&Q\.zzk$@R[a עNڞEhKXkjQt9;)e8 j פc=B>ﷄ sAEbs fJ?nD0]R4Sc %dYX>3D 1#rcѫV^F4Z4qܶ7?r˯ flQ[#Y"d{جup9;+iаA˚;q_ Jy$fКu+p?i /H]1^/@_-2I~djR#6?izލ.߈.*MCf̮Vjwik5%AR OJbd`m¶GǾ]c~tNJ[_@Hvs=,ٽ֎R#R߮KmFNdk|VU˃P HFVUA17S\&X,"V,YSnӗNG<TZ_b{ .&n]x㩸A2:t6*6Zԗw9Kfd!'+&uO<12S\djX*2[zI_b6"mE=&0R­vWΠ'鎺U1vP{lӚݓap,p=8*..Z ZE֜2&;Lji|3J'7Pr]݊ira7:KkaLͦmm#i#"4n7N[Z 8VkkI䩕JMIKF rio=꿞Pfƿw'ݥdV$en--E]˨jUu)A 3 257&Z%|83#ROX 9TSQx>?濚i&|]= {[~_4Rg|ۖʶ؏Œ굎p똎o&$^y. 'FʈYl{+|.CmQu^=i.LXf|gSfr(*UHgԭn68$S(p7 m4 r\T1aj\r>7co]zD/ZҮE-EkT-fю'hYq=72Ixi"a<:~jl'fZXx8|[/EY8P ˧#7;մݨJajMNө,c7IBFO&]|9Itz*pvhsTeP#wMZS2&_zO]l/VSW)#_Ujװ6Uo^݆۞RcŷDRhyO-͕!i!~X|HufHe0imc&jn5)*ut fQ7"%xO [ԝY(a.f1dome뿐_-eou(rF& 2D rZ@X+NuIt|IpnJP?POQ:eo(P AB9T4 _Y9N;G^M:OZ%782c_sW㣪S=ڷ&3٤.!R/T8/[Og~Jv t{'r?= 5{9|xf"C A?);}}L%r)!_΋/A@;gǤ׹݇vmS/x %|>M"__~ĻVWrNܿY[P0 ]'f봑x)zuQ7:3|fPn9)z]^2x{EWEe4\9L?#fԂI FqͪZbkZiem.`Y?)iBѫk֜6F%"9|F]420F|D c*X_| 8~|>Qڒ MlWϜM'8:3;Pmtw[=a: ق5/~@ nӇ~?Gˡ)2oJTCs6h^:Y%KAEi_@5ԛr'TSg6ou=@D+ u(8>a@/TvpHc7ac- i"'dtF̜/]9 lv G+0W >ƞ 6M_A=Z:<UN0bOV/Q {j"'jaZ%E8ZrbT}W-MThYmuYVOtY* *OxTwoACLpȁF\h۪n:^KA4騵xW*Cw?fn/zG&eɋI4jѢ>U"6zQnoJ\m@ȵf> |jhV̗ hӼZyN86J͖զ+Zfmʹwa`QӤSNg=Ӟ)M׍6vSj]./׍[oB+Z.Txvۑe | OԑV?tV9r D܃󄠏絢k$6'Ứ{633D\vA0~pwgZ r \ԋ k}O渌b0Om8#9LrwŇGP*9rtLd:u'~ʞX'EsOx*8W+#$r.iOqF)nJBϏa0|qzbKsnkޢ {)}qJgSQH>Z2h~{.xG5O˿it٦YAgipSKܩh]%Oq(}IKKC8y]UYj.ܗ\:pXz`8\ Цr0Q?k설hs/޶n_w%ĚI 5q*s?{g#o#^ zIŏ!3eaAuvq{YNN-7*P+1y"'5ޜ1ڄhh݉Pz)0B4KnQ_v(ɀb,AoR\gF!#;o\"{Z,W@QF=dbVF -e;FIw #Nm J=|{g.Uﺢܞ7pL&n<,,:0k% 7#-xvۆ!iZ#;q%K](NͽҐH7Kp /In9%tĸI c<0P$SS< ez ACSA,9r`^rzsc,-!?xam }>[8Ϭ#=;ILw]N<{X={Ǽ'r(:*h]>=;0hNWe|XB?/=Q1 N\\{Ithl#4HClR" {^.գ5ja-q, Tڍݵ \sXՓO}u5.nXM.^m[JI {`*h7i*Nh/D\I?9'0t 5),6 &룠Q@Oq#0̧` xچgDez媂~/E .;%Mut)9q3tY^QpN SKݔ=ϛV ㊘.iMEgաS7Qa̬m-\n1Lm-5dan>)aΞ}>~h,ݳ9v%CWf |`vT!H'͵s%}=!.X]dL\^_F)J_ f^mEe xӗ}b)d[Y%K86١oeft,Q-}ܒ2DsJa+XH}:0'٘t*2o`|C:ъn-\V\VCɚUBݧźy\`08GEI쎻}rHkju7ґYN/Q?s|QH'bkڥ#'fV 9AF,v=X\@ H؆Iy_&,lZ-0:l(JYw5cX/;tkpfO@8nW\谻/ZdZ[&w<)_ hw~5-y^T=þ/^T+G#; ǂ;jk>s/kˣ= "U v&6+!V^2y GyZM93s)4U?E!n/#Jtb(S%1Y] ,2imsaJnzq/vQĪQ-⺕jY46r}saݙjF/ k9(yc/ʃVf19:KVUo0B{NT\{WGF(׋I>-wMu lC`m9a0E=5G͵<40\{V꫱(]~>c6;7r: -JlWmcHbeu62J6ׂAjylgj!(m/MςޡzN?K9Po@&W 5 6$mW 36$Js'E[1Ѡf(CrԿz+0Cڨkdi:<,f{ Bͮupb-wmVmvޏ&jBMTHɦВ[͂NUW{ۓW ]߆>N "!gPKxm9ߗr# Ν eY>uVJX)!ȼmJe|$#~?ZHMl* uo9R2;|fa|Kcrf1ɿ2"?fۄf}uR`Չ<]JLh upCbyh1crU*~h9b CPs-gbTg?!$t|NZX]5[uv`hs&^&)$t!<^5 ĔݒbX'OdifG?dۛK{@Kuv4q2:}/͗,@75;Y2yϏ+1n 2p!p^:my'}iaںd-HUMlabVhU,lNfZ2 5.3AҲSO4&͖'Rp}.ĆF>usj&}f䣼a7Y>ʕm:nOQq \t-L/.4}&M.3;Jʎ=hJbR fvW+~` 1IAyo ^j#Zݭ 1}\OvP} ^@.|( P#1He;>lt yXBޕʬKxb0'GiED*|pfSӢŢpuLV!OIckx(>Y0J6vmW 4O~(ɶcSf2?:C[vhZĄzK1[\A Ղ">'/<'32xػ HЦqX<t= ~^M3"C3m jq  դ7!&i+t??wyyW we?sc!_@ߋ#Z_]ۗ1%Fwm J {B}B'] : 5SIh:JNnh*é6>aW7dB?8%4#"eԳ*^)l?r^ڋ;O<֞+G̫|_>2j sE!HxF&F{>K>ADq!M>}j *@wڡOYDC`7ڮ-vcRf5J4XwErHBݨ(O1)6c8Rl?5zȸejNjNYOuNiCV *'ZejB,j3UF+̨lVObG+Jx`Lp. pMK >'ߪYk"uvs|nOQ=p[] [ cIZ MNwiQ=?ƉQN% hԘ~=yQ\*栀 Cg'J8(W``<q՚-,K)GYiWILn}[01&7 NNS豻H*OϵS*g  bCx 5:hM:"5{ΰhMA X65۟c{ndt,lI(Y"QӱрzipUS%D7rUq4puY p݂k{ݯx>2}{3 Or+h} (8DF"jD࿺oyEiWΐucOO,:^x`ɕ4᝵xĺyQuuF!8%P|~S]~D03'_O" >#>"GDQ Lopt5+٨zK >/ĚvGXjduVST~ڤsSMaHfy**b*p:O6W@CVwI|!A7~[!$fM\wơbZ6&?4Օ_L.͎P+tjJH >lΟP/J~IEF9U+zEpXq_ Dì {]5UA,RT[Į*;WB:QZFEMQĵ?< R>xyprismjs": "^1.30.0A* -prismjs": "^1.26.5",o000prismAl26.)3prismjs/-/prismjs-1.26AO$UAUZTa7hQ2KY5L7AmtSiqxlhWxb4ina0yd8hNbl4TWuqnv/pFP0nDMb3YrfSBf4hJVGLh2YEIBfKaBW/9UEl6Ia61>>>>WismAl35rismjs/-/prismjs-1.31I%VDEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxwO99HE-xM}Le<<^r}B xQCh*e͉K̕ l+JVBnre5@%QFcF iʗ!nιeGy9sv;ynp4WMoD2%Bi7˫;( &}oDqѲ}/hx3KK/ QXE ?R1g:>"}8$MʶāA*S&V~+w[9vʦKŎe:!ߡKt8RqoF!psQ1%yšY@#2Yi> x{ 7'kFԍ]r3y.;Q|ENy֑[`x+LXdM5&mM#9Urbtk)$1q[dRd:60J%Фr;a4_0|D'&&#Eۋ?p( n&iРj-PXh':nkv=n^^d3Z-Xlzծ mM*nRVh9mjc6/{?nj3:Z#68[2,LsVH}! by^yZɂn %<[vNcKL/A㑙VxTn0+Cږk~GZZˌ4+G]rzʲf?2lsPZ NWDpH;}vڪc9~G(Cp-\F2{ /@XYXUㄧVZP`E/+VnY5j0%Bh%ܼZ,<6ɱ3<$k/o2\<[I\CDa|R&U"QNYӐh(RQ/˭Pe Р,2Kq-^t]0UI,I]2_3Y+8ײ\IRwįo߾>?~難ߞ9mr\od|}] !rPPSH.,Mgy/أ (X6"#l׿b"#fW|>GwQSs90.b@1*E? |yvޯ_bԜ Q( hYXTIDWܘNYVe.غlQ#5@p#4NYV 7T!h!]7:mf!c3aaPy <6aR/0qaq9ls xHZ= 8|}Lʊm } pD/MAy5l,5=;'[=mQ!֩zU z,2ߡ/A;0'!LѽD D2,Os^ĀvMGXE?VE\egkqoCrf$mR탧g77 2NU)wPiß⤷=A0nm۲R~.WsGؚAFr~qwbtĵE ~2p;~vjY6DN<)1B矰hBݘ52݅mOm"~=093= zbDOqW40(:D Pe79'qXFg ¡6،2lBB jz5;.E5웚t]KJ1/HEEY?9Q Z^a.g|$ Ce+kg(AOE5g<&g}X2~M#%^vf>bH;옌8d&le^oGwnH`,$M}vfUc7m2/Bs"_9A w\@va`Cqz˧ce˜52N[:$8`GU' Ҡ0d +#*ieP[=x̚jQ@}o8 8 aQʷٲZnN 5D[}*)}&z:@:0F<\=JNIv,v[0 #94<44Ǔf&4yQ} ? ңZx{e'Py`&TZD"ؽѸQxbr/mwI.ז#@lD}8Mi͈hPfڥýy^0T g=#^>7@c$f g(|K|>T ]@0D[r:4V>]8CqFmd_۴J1_gXVUu' AgaV<Ӂu.,H1Š|ܢǗP/=fT&ѴAhٙ|@k7fƺoi`G浊IWu(ZF_T߿v܈2DEX5*Ț03\uݵjbI^Y%['e/Z{3UHgLȿjeh3&h7`-#DK'yU1`AѼ?e2uf6ZVg آ4rq,b5꿚C=?K+xgTM ԧ$ҼZTA/Rˮ)Rm#?@WwJ%}mN+"hXK<%\u56mq(~1 =S;ɢ}!PiƉlkT_^L :MA12SOY }[+3a)Z%,{=VզKC,}ns`^fzbF^:-ޖGNCP+69r"S `AOSr:\=Muq+q UQDR6FM4¿"O4)vU#k$1 T RDe*$cw"XNzn3 y4R!?6,ۄ^1xi\ q8Xn̂A,sO׆仩o3TrE4͡F+pk.o+1cT@\m- }f}V.X?:5 FKke{۴1iÚUen'SQ݌jgڼGQ{]%HŊсሡG hy^[E 1\6?-ò*X{S.:'\^nTA8vڇOT?*DF١rl,"^,14M1[8w~qG|Ujk L;\ALO4݂ᖡ 􅢥 ݒfGKy3S&%~) t_:nMFI mfƦ}lN%V7(٦gfJy4Cڴ&A.!G8ZDz"䧂jקts1/M+yx_@S}Ň`rrJ ۍO}29TuZagό֚@Uplw/[RgP;#Psj_$ BF sOG/齺o_#OSJR{+Ec܂6h9FEV(:y7T 'YNʹ ['VMlT}C-N=iRWmD] ֎]':O`z:CfAj^s@ =ոaLJ~Wi q53Y2NvRYSw`m4A{!)Q&n0EPH1wXֳ|ړ65Q"CGOT&G-ڴ&WNX:jJsWBMRK |[h1mu3_5szU&ޣ"c7EWM8o9nQ2S{S9o♫,XjK|[0Jkt Jf)z0__~}m|xkfۼnjrTh.OTL@2_`am՗bSv-Z0}:l0`J_5t 1C1zM\Pi&CBD,&T}q(OS#gB 3PFD9 c?\Ʀy|Y5w R$dis.X1ķ$.7 XSUE zCF o)ݢt5$H)͆w9xY~ZapDƈkxbGGI{k~>f(Ƒ{rͶp'LL5ai;3H^VcPNͰqz7.Ҩ»T5!ĮђR =K¿ɑGR薣I]ؠ;",,4EA>} }ڳv#Ɋu$mr+hi?ZFz9LZ;bgnwW% s CS,ңWm$AS8}9$ y:}=XQ4dQ/E# w4'jΗ"(f;fBQ֖\&SG })(tu_;Sp2rBSSkw=7uԶ\DaԗY[ EȔtK,ίxA,JE BĽَ/Yw~!.ksKx%M!oNu ȝD5w ;MxjqTkD am[ X`Kd:SŮsh1~})]jAmg0tGE5< X0O]FY78a ▮aP+vv2WI>>4 N5(~[?7=KI kO3./4 Hv,yր߂/> \c &R.EwH,4jYc9L4;솕;Nw[yS+3[b}n˔7a[yhܘ^ج%݈J) :n^1z"^Qro-:Uz^"S!ZD]s4,>~h9*$@9}kj|ҭn?n{u[U j"Nep:c6otZzoA2Tx{};Ɇ UX9W mڏ| ;eC ,XkcɧVB-&luS|sF '_is5Z抰X'wI]zކ _6^+bm2@X(_\UgSApk>eb[_MOv1Jp#EB>29[el)ȶڋبTKE-b}qmRnaRp6Fd;+Oy/41IS[WED˴C7 .[n`LT $ocFj6?W +ƘMyv:ڤ_['SR x,{ "$schema": "../../node_modules/ng-packagr/ng-package.schema.json", "dest": "../../dist/ui-design-system", "lib": { "entryFile": "src/public-api.ts" }, "assets": [ "src/styles/**/*.scss" ] }ٜ?3`x̸qB,wbiInrNfj^\3&Zox̸qBobrrjqqfRfNfI\3&Z *x̸qBoNb^Jf^nAbzj\3&Z OPxxqB,gqFbQjni4J~kx] hcl-studiom8K_p xa nimationsm8FL/x` backgroundsm8UdSx` code-displal9Rwx` data-utilsm8Krx` font-managerm8\/=sxetilsf6 }8x] ui-essentialsf6 } gxy{ "name": "ui-animations", "version": "0.0.1", "description": "CSS animation library with Angular services and directives for programmatic control", "keywords": ["angular", "animations", "css", "ui", "transitions"], "peerDependencies": { "@angular/common": "^19.2.0", "@angular/core": "^19.2.0" }, "dependencies": { "tslib": "^2.3.0" }, "sideEffects": false } cvx"{ "name": "hcl-studio㣮 xDx%{ "name": "ui-backgroundL xxkc([ͥdTZ[\Y\;QJfo ,xkc(YͥdTZ\W3QRv T\x'{ "name": "ui-font-managerB Pxkc(SͥdT[:QRv 9x{ "name": "shared-uti QGx{ "name": "shared-ui xxQKAA)/17UJA)$C79'35dL9 1e )xaimport { ComponentFixture, TestBed } from '@angular/core/testing'; import { AccessibilityDemoComponent } from './accessibility-demo.component'; describe('AccessibilityDemoComponent', () => { let component: AccessibilityDemoComponent; let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ imports: [AccessibilityDemoComponent] }) .compileComponents(); fixture = TestBed.createComponent(AccessibilityDemoComponent); component = fixture.componentInstance; fixture.detectChanges(); }); it('should create', () => { expect(component).toBeTruthy(); }); }); ϑ+xǺe_TiIsNfj^BBZQ~~"PP7,nŕZ\W`kPͥZ[RR šcd12.i-xyM+HclStudioDemoComponent } from './hcl-studio HclStudio) HclStudio/ HclStudiog HclStudioW HclStudioO,#x:uGjQ~pjrIf~^Kjns~nA~^j^BBZQ~~Pn1TzYdMWj'K3 3 |f\ ӟ6 xe_pFbQjJhIfNs~nA~^j^BBZQ~~1XZ$ SnŕZ\dĵ(Ɍ(8IxVZ}!.4 l|\%  vxmM0UiCodeDisplayComponent } from './ui-code-display} UiCodeDisplay% UiCodeDisplay+ UiCodeDisplay c UiCodeDisplay|S UiCodeDisplay/5x{M,UiDataUtilsComponent } from './ui-data-utils} UiDataUtils% UiDataUtils+ UiDataUtils c UiDataUtils|S UiDataUtils0 *xmM0UiFontManagerComponent } from './ui-font-manager} UiFontManager% UiFontManager+ UiFontManager c UiFontManager|S UiFontManager55ܱ xM 0D) ޫHQİj0mJR)a c K_}ČwDh/,D/lYG+k$[mrs^\A&SϰYeNc9UII7kB9 OD3}׵AtxUn0+@ɀ Wy!"@1r |`$bB II{dv!3Kl.5{ĥBC+7_ n)yW]l© R-o^0ȚR,)쾟bkWcxy>lz濙r`V Lʝ,˥ے9YqŮT[%Yp⨛EҗIiSl@gxǫL*іZq&EI.|JX%G3x"ûKx-q"MۊC=4ąםSؙɱjU5.ĦLm :kpΖI,Uh:T:B"Bϝ&YHM)MYC`?>KI!w peŠ -*NDdEp =uUH>K@rI@Q֪36U?h<.Q$|n ͂p4{0x>,L>BԈU1 Wn/xzEi{2ǹK ]|Mzku!S %Ml_F Rw}T?7it@I b'ý3dm9#2KbzBg+Sܛ‰>bCeo zc5(2$zz F\smps^k@ ~B>wAюpJ-њ'fr9 ~OqyeL! GxZ=۸֫?fWs/1ߺ4c6;xWKo7W/Ѯ!')2b/8EA펴WJV }pJ}HgR*/ `jئ@8V=3 T8[]10R,Ts7V|b"+^?u) K2F:Xls0Gf?a\Ƃo/:ܟ2}4sX=aoBe|B3OSzaARÝ*쿵ͭMU#a\J;ٱ~Zq /g7)GSq!zh 3sX,C9,8}B؁ B`B( y!\':UGv6hк^gC˕sI[cS)KrSkĨv'ڀ1&Rۉ 8lLa^Ï?O-"#"Y5"ay\FcE¶;αƮ;ssLl:QְdfqWSbg7c&m6RDǑmq$UTL:YjKſ2S&am{?tq'Mp3w/1ZyA wye^awM"Uܿ.+ҞY/k{.ݕx5p?Q' ֓}P{n9MσQ4Yǔ.IUWrzto@ |Wû6gɆbYWl/Qm^#\ ڗOeoj\kz[!8`Eoty/bl"`xXKo6WKO=fFlEhdR#%!){v{e&7kH|3Aw%-PX ^Bq'(cuaF|GōJ]2+b`KynGWW0K4q^FFu-J L&V4IAs/K0Y'iXh00SK ~W3h'5T`x+(ܐQR UDe8[j~7br)Ha=KY{lU\` ▓(;\>]nbZU4k`'^T+nhzY9w,r7rz=Lg`0X^3Y5h.;W)*^Ҙ!<7l5=,ٕark4*ƫUGr!޴E{AZ=ГkQ[ t@<ݐhR².ée`"ZkZG[th0;ΓGw`i{M'SAqsQmׁaæ iQ֭oQTrZtr'oҒ}e鋬xYMs6W I,Ns8ęIΩ$$!!%{$A$N僇D V=B2h"xטM 8l*.3J+S"}cs$9g`N1 x#pqE V̘Q] "5%AfiX恴}|JGOI7LLTDx6MScff3bEq=DΌ1z/ WK< .R'V%g*rrq#Q&4LdsYKwtf% 'ODExX(JY 9OI&c\>CP{Y:s=f8WAoȽ}rx:$c9VaInDP# %J -R|(^irR(Eh־=QihnЋENb K l ќԬ`*bn HᄄF(!9`Q7HG3F^p  `25jS@bhJ >[x1.hv=?~v0Ka1":_I-܃+(ӌ(fڭX͌Bc='KRd v rXJqe`g~) ә%hxmef !.ӆuގ͉xJзo(`d__0ORڛ4 #t4j"lt"DoXZpʔl6.:¦>9(T֡[kH`~\a V`P Zj-Fr5ֶl!z4.vZi9h*As6OrEIۣ"UU')+t5fe;\j@wж˨&n 7.K;.P@eǠV(Y[W[f*·͚Wg7*+n :9*MOmc,ře0!]w$}5t2YF- ?BATM)Wuݳ<=s1K9XC798@`By4F{$Mk(u7Y8g/"{sYEW<Ȧ)ZUŜ KO}A 5x@xq7=tQ BLQZc}-|j716Ox{aM[Ž]гQmu_Q8t9ݼ؀J_[ֻD1@62 y[O1*J\m[I!"%QT@}$IZ_`Si~{5f'!̠_DMWᦃ-Ìf5c՘lr9ȭC_ͮC xZ[o#~ -wQAYqvuc(ɎrFCrp$Nd~}EM,]Ȇ'GrTLS.wdbƎlIW9͝0&Rs!{/.oފJW|tyA+>R _y^JBM?ZrIbUAמ)5Ӧ^kZ)KHNYٟSB>E^^&q]VL5\E.AgL 7"0xS;3/\d0 r{l ɺAm=͋_9X>祇R2y?~ri{p::u#IU|E[0o8n|g,X΀G{J RnhHZm39!%{YN _ID}sR-X]dN 98rD JDsW䩫70^rWrBew A4ie5&hHuu \0QɇSJ-EvgU0F΁y`.:EQnPL_R#^ j{j#eFV<ө+CZtH6炤KNL;dZd&`pNi')^r@~f"DO:yop;}x~m D[fڞ*c}D+ސ_κS-nedYS0w xX(3rn{9cḊ+Ԏpqlϖ4,@PƝ!vZdh;MtOF'@ $w{{=7[Q@m7zFp_?IvspԷ<TmiKDh6 <뮴w,mn~pkMb#ZA^=6]nOI{mC8ۻ >#ŭ[ZƯI2RPjdaeS=b"#**TS)7 兙0< Qq +: #?N:(teg/h1HL/,§x`_ISflpl1tɕu<}} E(t.9_dY$ʥ:ЛN< 8*+Q@b;-x-6G ?$]JyGMi(&sPTvJ²P_ C|߸f{Z)M lͪGmhG`;%6S[*)k\eYLxƖܽsVׅ2{D[j#jġhWukww % ^̒7#}dd"g4 u }=IuOࠥq=4wV IlukFu55Ų&wnRi\wy(w"FNNNȟ߸IN.ojSeXX(%]{X*S[VbI}5\R`c-KhN.][Rۅ20m>RGi+HKE ӂ}ız;X==;/ytp]'LU[+lj|t8"[fg x-D+lf޲w /-8$y64xYs6_dB2ՑNoӑ+>S{&wXv_L "Xs.>HCyH$hwo/J!y 'W*z3!3)$7˜${;+UjvE2brGDͥ;RȚ]|tIFdA]"J&q!nY1;xX' ʜ{;,LϘusVXG^ܞߗRxvPrj}wd!2W | v~nQܘc0PlvMsZU~g+9E>J.S' %:dynUy[XYD6(;yޒ)SDs;iY<*'_+QpcQ-܎;PuЏcbHh A鍈F8qf} Zgapb6FߥV@uǴȠ$j1 a1}LxI7Bty5oMU`֦ڂ2K߼! #f?L&k4A x ņHw0$8(Ȳ-]aieC}oaD&pb*+!+xFU?}o'G,? $, |hR1LQ;%/-/R} NXa( J9qm.Uq w)R｢9ŜqEjtseWJ*ݡ1SFe:?ӧ`xj6ac(p|YJ,\$;qھE!je2[j%0j!M{,*f1vNFnCO.԰CWPloKSz)kB1O I 3%-TQ}F<|^AoMǥx[`.a`0qfGC?q]EmTXBXg i!p?#MC@LzǬ׎g}U4Mާ_GiWaK` $@/:|-):}$x͝0 2-㱰nųՖf T{]VΜZU n3SnӒgb)j]w3Ej_k;Bx?r]*"0͒cT?fy_4  '*xqҙ _𩣂c|BWLPkg'+njX[+}|m~ŋ]*h:\ hrV9cTRͺCjn+uX6H}MӷȾN{]Ct̾XWs|FLNcQT67DkHEf`YkO1X9lyp[?8$a^aZ{sXŗ{G1[IŽG'3j'. +::!p_,xb{I7o+>Et;)[SWK?V/lҩnӶxX[sF~ϯ80XJb>$8!)Jlh ki/w=+;.EtB_<|.߹}l<Rw8h ch=!ȉ#2eBQ:rP7Tה#LVIr8!)(qޓK}`"Ŕe4;GhW[{ZNsC ,tؔh L|gϞu{OЁ{IҔ*uF}n]I6eдz>պ;Gg%&Q5ˁœΖXi^IGL%WTm8XARg>Ql"BF!<ڙ)YK8 C4jYwѳ>zb[_FrzZC.R/RT6<;2>`Gm#3ᄋ um ~8%}66J_TKC;u4ك:hgwOjcqz-hK/.d̈l.P>Aމ J#lZneQ,@tK(Fh=DRچɶlL&I[AċfVv3fNR\GpٱaSZUQH|!rJx3ku:sǔU.⒗:^MZ!ȷKUqY4hd,_ȸhܡ\X#6I&jFHDx]Y37Q*Zmy@?kAT:4sړ}Pi쭃8=ь!ra.xZeL71] 6W '6_m櫰DKQxW:V KT!K- ԡeVύU<-$| }|e&D UojVwYJoe%LG~帡UЈțK!UmbWo0?]J! u2#G7vZxZ%o%T4k*yL:5m6aB+1sXvaoX{HgdWN-*cne{ϫߙ.ӸBYs7=k w&N{J '&`.8^B j25H δKb1YBk WR-wId]&e &r4st|)WJap:h^+Ə=+xamk y2{g/t!xA 0Ebv9@W]'qHzF EJ&'" •F+89ܝB6UFc$HQf5eO֖:3at)E3s|Z;ڧVA]ps2 I[hm{q89=U80ٝzX7mnB&|Mud]jyiinxmn0@wĈogԽK*cpjlgB*Ôdw8p9$} Kw$6 &Kusq]W~T!8i_B핃WS+$9J+A[Q&(7{?4*2jPcA-Xlaﲰ*MOWV|H”?"GUl=e>^" kNycս? xx[Ȳ>'3IIKRRsK2JJS1%| P2r2RKSQJ* Bѱ@~-H:94%$Q3Q@ ,Z&W\WR2vxUn0 + zz+ ТE۰-1Y$i0Gvb'v=>Ҕ]D6DAnk^wQ$Y@ʚh4^G% YnS:P5"Ȥ!+MFHނ5iINlMW1Esq-YǢ2R5z4FѤO}Ϳ(;ɬh :Om cM؝?N3eH Ō]VN+WOgoz!{[-ď* P 2oo߃Tz[- K*6=D#*X Z<64 ߡ*4b@OA.R7mF):8t@Me"baxK@Tv2w* դiJGrdƤI*Ƒ1%|5UR$0igr@63PGE0U̗E|cJ`m %(I8S"lR"q̘mdLeVzd|?WW߮N.v@y'ŭ-|FzpĥyC< ͞jj]]F ٢z8N`"m C8NVyڼPp̢9?4Cx{c\&ĢE'c`̜5 {x8q |eoyj4U8rs}4i Ax8qȉ\zԏզZ<1~}4 mx8qZӬ==Zny Dh  x+7$5VR%~j3?[} x-x+.Ő*@ߖ_?[] O1x+Tϙ!A?[ɦ x:00 %6  % h6(0` $I'J J I'SEF H L M PSK cDF H L L QQTZw bFE F F F H L L QQV\cbFI'J M M F F H H L QQVYafms{*SSQM M M L L H L L QQV\fi qv{יK cZVVVVP P P P P QQVYafmq{ XZ\\\VVVVVP P QQV\ai qv{ ǁ_\\\\\VVVVVVYafmq{ bddb\\\\[ [ [ [ aai qv{ ĥbFggebbbbaa_ _ ai mqv :igggeebbaadi mqv{ hQhhhhhhhhhhu u u u 按 Ո Ո Ո ǁE7&S  {*%q- bF'y ~y*{Y'% |{6 j)'| ~{wK))&} }   {w [++)!!  О l ~{w l!,++& 7! !: ~wwr{!,,,+Ֆ%!!!$ [ {wry%ȱ--,,&o###!!!!#l ~wrn%ش..-,, j} &#%!$!#" I ~wrk&...--&!%%$%## О ~wro)/....- S)%$$%#&!*6 |ro,///...'#˱'%'&$ |wt-0///...=e'''&!]& | | |0000///.%''*'  | |00000///.*#㙿** О |70000000//# **  & S00000000/-$ʽ$ ! 6o1000000000!X!] I1100000000+} !  [ 11100000000 !z"! l"11111000000+ %#! |#111110000000! m%#" #111111100000*&'%"! +11111100000e$O''%#"  l o)111110000(&)''#"! a S&11110000X:+)''%#"!I=%011100''+))'%#:)$01110:"-,++)'&"011&'Ĺ,,)  !+1!*$-+  #}$x m m??????????( @ J'I I J'\DF H L QUvlF jF DH L OSXbk wRKPL L L H L OS]fpzه UXYUUP P P OSXbkt~ Ș\^^ZZVVV V]fpy qvfaa]]Z] ] bkt~ hggccbbf l q y ŝg%hchchce`g^k[k[xY~ W~ W U U\ ~ y(%\  zzA( l }v)xY*%lפֿ骎骙⧠צО zr:p+*} ʹyZ }wsI,+% T""! G ztyZ.,-"i$#!!"!K }tlj ..,$$$$%#Ӏ }tmz#//.. Tv$%%%; }tq%0///)!鷴(%%Գ zt&00/// >#B*) G* }z'000//%(( */0100/ +$#Ӏ  -1/1000%  /111100-#!11111100$##! +11101/1+  &%" "j(110111!$)'#!` Y%0010-l()'%"L >%010##t,*& ; +%/+),!*$'H%>$Ã????(  @(FNW)Q J I J Q_s㙆 [XTR Vi| cyda_e r i+] g>f { beforeEach(async () => { await TestBed.configureTestingModule({ imports: [AppComponent], }).compileComponents(); }); it('should create the app', () => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.componentInstance; expect(app).toBeTruthy(); }); it(`should have the 'demo-ui-essentials' title`, () => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.componentInstance; expect(app.title).toEqual('demo-ui-essentials'); }); it('should render title', () => { const fixture = TestBed.createComponent(AppComponent); fixture.detectChanges(); const compiled = fixture.nativeElement as HTMLElement; expect(compiled.querySelector('h1')?.textContent).toContain('Hello, demo-ui-essentials'); }); });  ` }) export class AppComponent { title = 'demo-ui-essentials'; } 5sʺPx;iBMBӀDEmx;i’0f&#ؓ0JSx?import { ApplicationConfig, provideZoneChangeDetection, importProvidersFrom } from '@angular/core'; import { provideRouter } from '@angular/router'; import { UiAccessibilityModule } from 'ui-accessibility'; import { routes } from './app.routes'; export const appConfig: ApplicationConfig = { providers: [ provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes), importProvidersFrom( UiAccessibilityModule.forRoot({ announcer: { defaultPoliteness: 'polite', defaultDuration: 4000, enabled: true }, focusManagement: { trapFocus: true, restoreFocus: true, focusVisibleEnabled: true }, keyboard: { enableShortcuts: true, enableArrowNavigation: true }, skipLinks: { enabled: true, position: 'top', links: [ { href: '#main', text: 'Skip to main content' }, { href: '#nav', text: 'Skip to navigation' } ] }, accessibility: { respectReducedMotion: true, respectHighContrast: true, injectAccessibilityStyles: true, addBodyClasses: true }, development: { warnings: true, logging: true } }) ) ] }; \LxJ ('9../../../ui-accessibility/src/lib/ui-accessibility.moduleK .*%xϵiDoS'HMf*(/LI /-I-(QŚ\\xMimport { Routes } from '@angular/router'; export const routes: Routes = []; >#hx<*ottom-navigation-demoW#zLCPmmand-palette-demo8<'W5)a|^쪗40000 container-demo4t_.cYC[OƚO&B6C:'̼z #V|~Penhanced-table-demo9kހ0zhbU40000 fab-menu-demoỹ}ޮ໧f2)loating-toolbar-demo7[,٢Ϯ$6$con-button-democ2(%!1Yj/T!nackbar-demog6XKrKt„CX>;E?_:x Y{L40000 stepper-demoqa# b>4Q97=RΥM$ 40000 tag-input-demo! 8Njڨ'qdnjT^:>9nm/%ansfer-list-demojǽ83 COU|4x{ɿMɬL"LW9jcZ=-=krYgx*c?ҫ ¼zf4| 8J9xV9 7[&>[RY!XT940000 alert-demo)Bkp[/gIDܑN>#&- #uC:ZQ8NjBXoA٧Mm-fD^s̘z ㈥;m6ld$y=>@?N@Y.=;e.?ZQaT$340000 container-demoOj~2k N޼7iʴb}{оY40000 drawer-demoo%~$ZG40000 empty-state-demo[ř[Mzbl40000 enhanced-table-demohn_%zFYap֊v40000 fab-menu-demo= rơ3lUFzh040000 file-upload-demo%a4 v_] 40000 floating-toolbar-dCemoK NB4oT`W40000 fontawesome-demoA} iM/1(0?[qFwATxLq40000 grid-system-demo&` Pl{W9Fg@Dqru0 ܞ9Sy.ܓm~ 40000 modal-demoE.=zIr隲{TiC\N8ȽHW B=[_3 0_*zVl6c2!IBΓe"ŔoRjtpOih8FY-f40000 spacer-demoDoG^40000 split-button-demo"͎tӃ]ۖ40000 stepper-demo۔(IHKY! `PGyX_Mmm40000 toast-demow@CiB_Rb~40000 tooltip-demoao=|-H,# iR-?d.%9/& u40000 tree-view-demoً9(X 40000 video-player-demoz&֏xraa38x;{%spect-ratio-demoUs^|D7CMSs?CՑt#ento-grid-demowus 09[xޮ!8Pox-demo<87B9640000 breakpoint-container-demo^!eX)BcMk@#Dyenter-demosOJVҡOlumn-demo܃t ]p/l.`'shboard-shell-demop" CipLW` Z;B;ip:e8%. 40000 divider-demo߾R%-Nection-demoMx|d @40000 sidebar-layout-demo.(.Ǻd:ack-demoW~lIjJOZeY|./upporting-pane-layout-demo)DQLso=s{Tr S&bs-container-demoo U:~o ~ ['U ƸR=$2|s ,V](Jxs-40000 accessibility-demomL:ZF22. U#nimations-demo\^)Ψ 2}0HN#ckgrounds-demoQnmWn$de-display-demo_RǔYH ~!a-utils-demo\ؠXeu}6Bz`]< kPHSi"-manager-demov+Y1੢oԄ{|\%allery-grid-democMv-=}U5_$hcl-studio-demot<]ekó[. *1finite-scroll-container-demo2 B2lCGQ +&kanban-board-demo);cWaS9Vz_Ɠ asonry-demok=jMQ_R*[Relect-demo"o):;O~S B #plit-view-demo،_b3&=@ S&ticky-layout-demon?''V䉲cSAJ+ኲy!n5O 40000 hero-sections-demon4d,M)d&΀?anding-faq-demor kڙ7[q40000 landing-feature-grid-demo䩰R =v"9j[O40000 landing-footer-demosn$}ļ]40000 landing-header-demoz9ޕOm_40000 landing-logo-cloud-demo\ 0fPm A?40000 landing-statistics-demoq- xI%/)40000 landing-team-demox>+aVۀW-qa&T40000 landing-templates-demoiK3d |/n40000 la\nding-testimonials-demor !zS0;zb40000 landing-timeline-demoDQKG~X>P *G֫U:\Hix4 N6oast-demov8Y8'G-k&3%,x/ Nrc\  ݙuP6&k&Rx 8i+Vs}ٙ 1 x$!

UI Accessibility Library Demo

Interactive examples of accessibility features with WCAG 2.1 Level AA compliance.

This page demonstrates various accessibility features. Use keyboard shortcuts: Ctrl+Shift+A to make announcements, Ctrl+M to toggle modal.

Accessibility Preferences

High Contrast: {{ currentPreferences.prefersHighContrast ? 'Enabled' : 'Disabled' }}

Reduced Motion: {{ currentPreferences.prefersReducedMotion ? 'Enabled' : 'Disabled' }}

Color Scheme: {{ currentPreferences.colorScheme || 'Not detected' }}

Refresh Preferences

Live Announcements

Make Announcement Sequence Announcement
Success Message Error Message Loading Message Simulate Validation

Focus Management

Focus via Keyboard Focus via Mouse Focus via Program

Focus Trap

{{ trapEnabled ? 'Disable' : 'Enable' }} Focus Trap

Focus Trap Container {{ trapEnabled ? '(Active)' : '(Inactive)' }}

When enabled, Tab navigation will be trapped within this container.

Trapped Button 1 Trapped Button 2

Vertical Navigation (Use ↑↓ arrows):

    @for (item of navigationItems; track item.id) {
  • {{ item.label }}
    • }

Grid Navigation (Use ↑↓←→ arrows, 3 columns):

@for (item of gridItems; track item.id) { }
Open Modal @if (showModal) {
}

Screen Reader Components

Screen Reader Only Text:

This text is visible. This text is only for screen readers. This text is visible again.

Focusable Screen Reader Text:

This text becomes visible when focused (try tabbing through the page).

Dynamic Status Messages:

Form submitted successfully! Error: Please check your input.

Keyboard Shortcuts

Ctrl + Shift + A
Make announcement
Ctrl + M
Toggle modal
Tab / Shift + Tab
Navigate through interactive elements
Arrow Keys
Navigate within lists and grids (when focused)
Home / End
Jump to first/last item in navigable containers
Escape
Close modal or exit focus trap

End of accessibility demo. This demo showcases WCAG 2.1 Level AA compliant accessibility features using semantic design tokens.

f?Ox"k@use '../../../../../ui-design-system/src/styles/semantic/index' as *; .accessibility-demo { padding: $semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; font-family: system-ui, -apple-system, sans-serif; line-height: 1.5; } .demo-header { text-align: center; margin-bottom: $semantic-spacing-component-lg * 2; h1 { color: #1a1a1a; font-size: 2rem; font-weight: 600; margin-bottom: $semantic-spacing-component-lg; } p { color: #666; font-size: 1.125rem; } } .demo-section { margin-bottom: $semantic-spacing-component-lg * 2; padding: $semantic-spacing-component-md $semantic-spacing-component-md; background: #f8f9fa; border-radius: 8px; border: 1px solid #e0e0e0; h2 { color: #1a1a1a; font-size: 1.5rem; font-weight: 600; margin-bottom: $semantic-spacing-component-lg; border-bottom: 2px solid #007bff; padding-bottom: $semantic-spacing-component-md / 2; } h3 { color: #1a1a1a; font-size: 1.25rem; font-weight: 600; margin: $semantic-spacing-component-lg 0 $semantic-spacing-component-lg / 2 0; } } // Preferences Display .preferences-display { display: flex; flex-direction: column; gap: $semantic-spacing-component-sm; padding: $semantic-spacing-component-md; background: #fff; border-radius: 4px; border: 1px solid #e0e0e0; p { margin: 0; font-size: 1rem; color: #666; } } // Demo Controls .demo-controls { display: flex; flex-direction: column; gap: $semantic-spacing-component-md; } .input-group { display: flex; flex-direction: column; gap: $semantic-spacing-component-sm; label { font-weight: 500; color: #1a1a1a; font-size: 1rem; } } .button-group { display: flex; gap: $semantic-spacing-component-sm; flex-wrap: wrap; align-items: center; } .demo-input { padding: $semantic-spacing-component-md $semantic-spacing-component-md; border: 1px solid #ccc; border-radius: 4px; background: #fff; color: #1a1a1a; font-size: 1rem; transition: border-color 0.15s ease-out; &:focus { outline: 2px solid #007bff; outline-offset: 2px; border-color: #007bff; } &::placeholder { color: #999; } } .demo-select { @extend .demo-input; cursor: pointer; } .demo-textarea { @extend .demo-input; min-height: 80px; resize: vertical; } // Focus Demo .focus-demo { display: flex; flex-direction: column; gap: $semantic-spacing-component-md; } // Focus Trap Demo .trap-controls { margin-bottom: $semantic-spacing-component-lg; } .focus-trap-container { padding: $semantic-spacing-component-md * 1.5; border: 2px dashed #e0e0e0; border-radius: 8px; background: #fff; display: flex; flex-direction: column; gap: $semantic-spacing-component-md; transition: all 0.3s ease-out; &.trap-enabled { border-color: #007bff; background: #f0f8ff; box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25); } h3 { margin-top: 0; color: #1a1a1a; } p { color: #666; margin: 0; } } // Navigation Demo .navigation-demo { display: flex; flex-direction: column; gap: $semantic-spacing-component-lg; } .navigation-list { list-style: none; padding: 0; margin: 0; border: 1px solid #e0e0e0; border-radius: 4px; overflow: hidden; li { padding: $semantic-spacing-component-md $semantic-spacing-component-md; background: #fff; border-bottom: 1px solid #e0e0e0; cursor: pointer; transition: all 0.15s ease-out; color: #1a1a1a; &:last-child { border-bottom: none; } &:hover { background: #f5f5f5; } &:focus { outline: 2px solid #007bff; outline-offset: -2px; background: #f0f8ff; } &.disabled { opacity: 0.6; cursor: not-allowed; color: #999; } } } .navigation-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: $semantic-spacing-component-sm; padding: $semantic-spacing-component-md; border: 1px solid #e0e0e0; border-radius: 4px; background: #fff; .grid-item { padding: $semantic-spacing-component-md; border: 1px solid #ccc; border-radius: 4px; background: #e9ecef; color: #495057; cursor: pointer; transition: all 0.15s ease-out; font-size: 0.875rem; &:hover:not(:disabled) { background: #dee2e6; } &:focus { outline: 2px solid #007bff; outline-offset: 2px; } &:disabled { opacity: 0.6; cursor: not-allowed; background: #f8f9fa; color: #999; } } } // Modal Demo .modal-backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; animation: fadeIn 0.3s ease-out; } .modal-content { background: #fff; border-radius: 12px; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); min-width: 400px; max-width: 600px; max-height: 80vh; overflow: hidden; animation: slideIn 0.3s ease-out; .modal-header { padding: $semantic-spacing-component-md $semantic-spacing-component-md; background: #f8f9fa; border-bottom: 1px solid #e0e0e0; display: flex; justify-content: space-between; align-items: center; h3 { margin: 0; color: #1a1a1a; } .modal-close { background: none; border: none; font-size: 24px; cursor: pointer; color: #666; padding: 4px 8px; border-radius: 4px; transition: all 0.15s ease-out; &:hover { background: #f5f5f5; color: #1a1a1a; } &:focus { outline: 2px solid #007bff; outline-offset: 2px; } } } .modal-body { padding: $semantic-spacing-component-md * 1.5; p { color: #666; margin-bottom: $semantic-spacing-component-lg; } .demo-input { width: 100%; margin-bottom: $semantic-spacing-component-lg; } } .modal-footer { padding: $semantic-spacing-component-md $semantic-spacing-component-md; background: #f8f9fa; border-top: 1px solid #e0e0e0; display: flex; gap: $semantic-spacing-component-sm; justify-content: flex-end; } } // Screen Reader Demo .sr-demo { display: flex; flex-direction: column; gap: $semantic-spacing-component-md; p { color: #666; margin: $semantic-spacing-component-lg / 2 0; } } .status-demo { display: flex; flex-direction: column; gap: $semantic-spacing-component-sm; } // Keyboard Shortcuts .shortcuts-info { background: #f5f5f5; padding: $semantic-spacing-component-md; border-radius: 4px; border: 1px solid #e0e0e0; } .shortcuts-list { display: grid; grid-template-columns: 200px 1fr; gap: $semantic-spacing-component-sm $semantic-spacing-component-md; margin: 0; dt { font-weight: 500; color: #1a1a1a; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: 0.875rem; background: #e9ecef; padding: 4px 8px; border-radius: 4px; text-align: center; } dd { margin: 0; color: #666; display: flex; align-items: center; } } // Footer .demo-footer { text-align: center; padding: $semantic-spacing-component-md * 2; border-top: 1px solid #e0e0e0; margin-top: $semantic-spacing-component-lg * 2; p { color: #666; font-size: 0.875rem; margin: 0; } } // Animations @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes slideIn { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } // Responsive Design @media (max-width: 768px) { .accessibility-demo { padding: $semantic-spacing-component-md / 2; } .demo-section { padding: $semantic-spacing-component-md / 2; } .button-group { flex-direction: column; align-items: stretch; } .navigation-grid { grid-template-columns: repeat(2, 1fr); } .shortcuts-list { grid-template-columns: 1fr; gap: $semantic-spacing-component-sm; dt { text-align: left; } } .modal-content { min-width: 90vw; margin: $semantic-spacing-component-md; } } // High Contrast Mode Support @media (prefers-contrast: high) { .demo-section { border-color: ButtonText; } .focus-trap-container.trap-enabled { border-color: Highlight; } .navigation-list li:focus { outline-color: Highlight; } .grid-item:focus { outline-color: Highlight; } } // Reduced Motion Support @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01s !important; transition-duration: 0.01s !important; } }dxnimport { Component, OnInit, OnDestroy, ViewChild, ElementRef, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { UiAccessibilityModule } from '../../../../../ui-accessibility/src/lib/ui-accessibility.module'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/button.component'; import { LiveAnnouncerService } from '../../../../../ui-accessibility/src/lib/services/live-announcer/live-announcer.service'; import { FocusMonitorService } from '../../../../../ui-accessibility/src/lib/services/focus-monitor/focus-monitor.service'; import { KeyboardManagerService } from '../../../../../ui-accessibility/src/lib/services/keyboard-manager/keyboard-manager.service'; import { HighContrastService } from '../../../../../ui-accessibility/src/lib/services/high-contrast/high-contrast.service'; import { A11yConfigService } from '../../../../../ui-accessibility/src/lib/services/a11y-config/a11y-config.service'; @Component({ selector: 'app-accessibility-demo', imports: [ CommonModule, FormsModule, UiAccessibilityModule, ButtonComponent ], templateUrl: './accessibility-demo.component.html', styleUrl: './accessibility-demo.component.scss' }) export class AccessibilityDemoComponent implements OnInit, OnDestroy { private liveAnnouncer = inject(LiveAnnouncerService); private focusMonitor = inject(FocusMonitorService); private keyboardManager = inject(KeyboardManagerService); private highContrast = inject(HighContrastService); private a11yConfig = inject(A11yConfigService); @ViewChild('trapContainer') trapContainer!: ElementRef; @ViewChild('monitoredInput') monitoredInput!: ElementRef; // Demo state trapEnabled = false; showModal = false; currentPreferences: any = {}; focusOrigin = ''; announcementText = 'Hello, this is a test announcement!'; selectedPoliteness: 'polite' | 'assertive' = 'polite'; // Navigation demo items navigationItems = [ { id: 1, label: 'Profile Settings', disabled: false }, { id: 2, label: 'Account Details', disabled: false }, { id: 3, label: 'Privacy Controls', disabled: true }, { id: 4, label: 'Notifications', disabled: false }, { id: 5, label: 'Security Options', disabled: false } ]; // Grid navigation items gridItems = Array.from({ length: 12 }, (_, i) => ({ id: i + 1, label: `Item ${i + 1}`, disabled: i === 5 // Make item 6 disabled })); ngOnInit(): void { this.setupKeyboardShortcuts(); this.setupFocusMonitoring(); this.getCurrentPreferences(); } ngOnDestroy(): void { this.keyboardManager.unregisterAll(); } private setupKeyboardShortcuts(): void { // Global shortcuts this.keyboardManager.registerGlobalShortcut('announce', { key: 'a', ctrlKey: true, shiftKey: true, description: 'Make announcement', handler: () => this.makeAnnouncement() }); this.keyboardManager.registerGlobalShortcut('toggleModal', { key: 'm', ctrlKey: true, description: 'Toggle modal', handler: () => this.toggleModal() }); } private setupFocusMonitoring(): void { // Monitor focus on the input field setTimeout(() => { if (this.monitoredInput) { this.focusMonitor.monitor(this.monitoredInput).subscribe(focusEvent => { this.focusOrigin = focusEvent.origin || 'none'; if (focusEvent.origin) { this.liveAnnouncer.announce( `Input focused via ${focusEvent.origin}`, 'polite' ); } }); } }, 100); } private getCurrentPreferences(): void { this.currentPreferences = this.highContrast.getCurrentPreferences(); } // Demo actions makeAnnouncement(): void { this.liveAnnouncer.announce(this.announcementText, this.selectedPoliteness); } makeSequenceAnnouncement(): void { const messages = [ 'Starting process...', 'Processing data...', 'Validating information...', 'Process completed successfully!' ]; this.liveAnnouncer.announceSequence(messages, 'polite', 1500); } toggleFocusTrap(): void { this.trapEnabled = !this.trapEnabled; this.liveAnnouncer.announce( `Focus trap ${this.trapEnabled ? 'enabled' : 'disabled'}`, 'assertive' ); } toggleModal(): void { this.showModal = !this.showModal; if (this.showModal) { this.liveAnnouncer.announce('Modal opened', 'assertive'); } else { this.liveAnnouncer.announce('Modal closed', 'assertive'); } } focusViaKeyboard(): void { if (this.monitoredInput) { this.focusMonitor.focusVia(this.monitoredInput, 'keyboard'); } } focusViaMouse(): void { if (this.monitoredInput) { this.focusMonitor.focusVia(this.monitoredInput, 'mouse'); } } focusViaProgram(): void { if (this.monitoredInput) { this.focusMonitor.focusVia(this.monitoredInput, 'program'); } } onNavigationChange(event: any): void { this.liveAnnouncer.announce( `Navigated to ${this.navigationItems[event.nextIndex]?.label}`, 'polite' ); } onGridNavigationChange(event: any): void { this.liveAnnouncer.announce( `Navigated to ${this.gridItems[event.nextIndex]?.label}`, 'polite' ); } announceError(): void { this.liveAnnouncer.announce( 'Error: Please fix the required fields before continuing', 'assertive' ); } announceSuccess(): void { this.liveAnnouncer.announce( 'Success: Your changes have been saved', 'polite' ); } announceLoading(): void { this.liveAnnouncer.announce( 'Loading content, please wait...', 'polite' ); } refreshPreferences(): void { this.getCurrentPreferences(); this.liveAnnouncer.announce('Accessibility preferences updated', 'polite'); } simulateFormValidation(): void { // Simulate a form validation scenario this.liveAnnouncer.announce('Validating form...', 'polite'); setTimeout(() => { this.liveAnnouncer.announce( 'Form validation complete. 2 errors found.', 'assertive' ); }, 2000); } } |x{g@gn[.}}܂PO̤̜̒J|D^j^IBb^BqjQY&P+kr&OfYc^^~i^rjQ0D[~rio~^fI>{b Gfzs~^IQbq a%P8-3*UV^>uk.T׻StkJKJ2ƥ5[ofbaLx[ms6_w#ijI\zKھN'S"! DpR߳ HQ"eK~I{sԖb8q>sO=@*0cxQxt,G;5kJAl_갴\1vۈ@ŒN/ma $Wkb%6$yU,ØJxL/X7 \ϒ84ٻ{"H7Ǝ}9aƜmO wO-@iA]踋!7}n`vo[B-/ƊEhqP\e3n>T:`j$Cp5/Đ*i *ʼnVYB+}uzrʤ; wY"%Nv-̲ljkVZep耰A- %:P0*t3|bȉ`T\Gq2 ,ܠ^M,'ܛ!X#n++ߚ[Ӳ.PJR:oȁTX K#d> I)/B%{#^~rưeCCtqlNӄM0\B9XAjOwe 7((BiĖ+ (!e&>/-hS6Jyu vAG7(uAahA)N&NiRɸ5¤nzNVQ-J$E6>[l鰷'G>uQ0|}2d@$ $S;:C9m'Bgp#J-8"?B>PnZh7樥c"6y\Z$;nU!j66G B>Jrs@-!Nг6BJTG \PyAY&+VeR΢Ȝr̓Bj+/3ۣ%Ss="9/3 ; $pW0²'/wY`kDd{_2J#w:O_UsΡj:טj2pvz &ܑfmΕW(j&_)cK 2XvE7rWN-Ucұ¨]D "%m$%_ӘηvZ+ E}VEl3qO" AZrjejއ:5I/ r*[3;Q`G85E$?^Bz-.¦1e {4Hwmco@𳘮Z [Sƹ\q|:M}#mD|ά.ˠ#]kd xn]ݽK ;;z R-|T(A5֓ŶU!)R*XQP*2mt>[f8&tG|μߩ>E=kîb}Y;L6Ii<4{qXaNw9~gqdSnO˘Wi {"kŘ_JDnw熬aX.D4 7B 8^ -]\u yя՝z{o.~Piv9#$sB|tq/Sq?İyNawyU+*zweaJX ,zt~1GNЋL;ޓ.4R Sxr˯/raQZ}6wRbg-}hfl\o`EY%+B\eQ0zqJ5].e7k UYv+|v@j\B.;} ݳx]* ,Svlu}=[X5[ᬕIdǭӡYc.\i9de拀sx8/cIbG9`o4=kWTH,Nt%9SYܘVFk_xn@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-bottom-navigation { // Core Structure display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: $semantic-z-index-dropdown; align-items: center; justify-content: space-around; // Layout & Spacing padding: $semantic-spacing-component-sm; min-height: $semantic-sizing-touch-target; // Visual Design background: $semantic-color-surface-primary; border-top: $semantic-border-width-1 solid $semantic-color-border-primary; box-shadow: $semantic-shadow-elevation-3; // Transitions transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; // Size Variants &--sm { min-height: $semantic-sizing-button-height-sm; padding: $semantic-spacing-component-xs; } &--md { min-height: $semantic-sizing-touch-target; padding: $semantic-spacing-component-sm; } &--lg { min-height: $semantic-sizing-button-height-lg; padding: $semantic-spacing-component-md; } // Variant Styles &--primary { background: $semantic-color-primary; border-top-color: $semantic-color-primary; color: $semantic-color-on-primary; .ui-bottom-navigation__item { color: $semantic-color-on-primary; &--active { background: rgba(255, 255, 255, 0.1); } &:hover:not(&--active) { background: rgba(255, 255, 255, 0.05); } } } &--secondary { background: $semantic-color-secondary; border-top-color: $semantic-color-secondary; color: $semantic-color-on-secondary; .ui-bottom-navigation__item { color: $semantic-color-on-secondary; &--active { background: rgba(255, 255, 255, 0.1); } &:hover:not(&--active) { background: rgba(255, 255, 255, 0.05); } } } // Elevated variant &--elevated { box-shadow: $semantic-shadow-elevation-4; } // Hidden variant for dynamic showing/hiding &--hidden { transform: translateY(100%); } // BEM Element - Navigation Item &__item { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; min-width: $semantic-sizing-touch-minimum; min-height: $semantic-sizing-touch-minimum; padding: $semantic-spacing-component-xs; border-radius: $semantic-border-radius-sm; cursor: pointer; text-decoration: none; color: $semantic-color-text-secondary; // Typography font-family: map-get($semantic-typography-caption, font-family); font-size: map-get($semantic-typography-caption, font-size); font-weight: map-get($semantic-typography-caption, font-weight); line-height: map-get($semantic-typography-caption, line-height); // Transitions transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; // Interactive States &:hover:not(&--disabled):not(&--active) { background: $semantic-color-surface-elevated; color: $semantic-color-text-primary; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &:active:not(&--disabled) { transform: scale(0.98); } // Active State &--active { background: $semantic-color-interactive-primary; color: $semantic-color-primary; font-weight: $semantic-typography-font-weight-semibold; } // Disabled State &--disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } // Badge modifier &--has-badge { position: relative; } } // BEM Element - Icon &__icon { display: flex; align-items: center; justify-content: center; width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; margin-bottom: $semantic-spacing-content-line-tight; // Icon sizing variants .ui-bottom-navigation--sm & { width: $semantic-sizing-icon-inline; height: $semantic-sizing-icon-inline; } .ui-bottom-navigation--lg & { width: $semantic-sizing-icon-button; height: $semantic-sizing-icon-button; } } // BEM Element - Label &__label { text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; // Typography variants by size .ui-bottom-navigation--sm & { font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } .ui-bottom-navigation--lg & { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); } } // BEM Element - Badge &__badge { position: absolute; top: -$semantic-spacing-component-xs; right: -$semantic-spacing-component-xs; min-width: $semantic-sizing-icon-inline; height: $semantic-sizing-icon-inline; display: flex; align-items: center; justify-content: center; background: $semantic-color-danger; color: $semantic-color-on-danger; border-radius: $semantic-border-radius-full; padding: 0 $semantic-spacing-component-xs; // Typography font-family: map-get($semantic-typography-caption, font-family); font-size: map-get($semantic-typography-caption, font-size); font-weight: $semantic-typography-font-weight-semibold; line-height: map-get($semantic-typography-caption, line-height); // Hide if no content &:empty { min-width: 8px; height: 8px; padding: 0; } } // Responsive Design @media (max-width: $semantic-breakpoint-sm - 1) { padding: $semantic-spacing-component-xs; .ui-bottom-navigation__item { padding: $semantic-spacing-component-xs * 0.5; } .ui-bottom-navigation__label { font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } } @media (max-width: $semantic-breakpoint-md - 1) { // Ensure touch targets remain accessible on tablets .ui-bottom-navigation__item { min-height: $semantic-sizing-touch-target; } } }VxU 53@use ' 9' as *; .demo-container { Mlayout-section-md; max-width: 1200px; margin: 0 auto; } .demo-section { M#layout-section-lg; h3 { / heading-h3L< heading-h3 heading-h3 > heading-h35  O)heading; } h4 { / heading-h4L< heading-h4 heading-h4 > heading-h45  O)heading; } p { / + `( < *5  O)Gparagraph; } } .demo-row { display: flex; flex-wrap: wrap; gap@egrid-gap-md; align-items: flex-start; } .toast-wrapper { flex: 0 0 auto; } .controls-section { M#Olayout-section-md; } .button-group { display: flex; flex-wrap: wrap; gap@%P".lg; } .demo-button { display: inline-flex; gap@interactive-button-padding-yAinteractive-button-padding-x; 2T button-radius;   *button`(button-medium, font-size); -utton *button-medium, line-height);  cOdmd; &:hover { ! button-hovN$surface-secondary; } ! ; .+outline-offset: 2px; } &:active { ! button-rest; px); } (=5 border-1L  &:hover {  L  hover;N5 1 secondary; &:hover { / "hover; } } &--warning {Q! warning; 1 on-warning; border-1warning; &:hover {  warning; "!hover; } } &--danger {QZ1danger; &:hover {  danger; "?hover; } } } .toast-container { position: fixed; top@layout-section-md; right@layout-section-md7modal; display: flex; flex-direction: column; gap@% ax-width: 400px; width: 100%; M .ui-toast { pointer-events: auto; } } .stats-section { margin-top@layout-section-md; 'lg;  border%subtle; P "card-radius; } .stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: $semantic-L grid-gap-md; M%#lg; } .stat-item { display: flex between; %^ %subtle; P -} .stat-label { , + `( size); I *line-height);  } .stat-value { ,labe`(label, font-size); < *label, line-height); L 0} // Responsive Design @media (max-width: calc(px)) { .demo-container { glayout-section-sm; } .demo-row { flex-direction: column; } .toast-container { top@layout-section-sm; right@layout-section-sm; left@layout-section-sm; max-width: none; } .button-group { flex-direction: column; } .stats-grid { grid-te4mplate-columns: 1fr; } } @media (max-width: calc(px)) { .demo-container { 6layout-section-xs; } .toast-container { top@layout-section-xs; right@layout-section-xs; left@layout-section-xs; } }.x_ 51Osnackbar`*B=layout-section-md; left: 50%; transform: translateX(-50%);modal; max-width: 90vw; width: auto; min-width: 300pxBmdA lg; gap@$: border% secondary; P )lg+4; // Typography , + `( size); I *line-height);  O>normaq[ |Amd; / `(y *i * 20md+mdAlgolg; /largeL<large"large >.large, line-height); } // Color Variant'>5 border-1L } &--success {Q! success; 1 on-success; border-1success; } &--warning {Q! warning; 1 on-warning; border-1warning; } &--danger {QZ1danger; } &--info {Q!info; 1 on-info; border-16info; } // Position Variants &--top { top@@layout-section-md; bottom: auto; } &--left { left@Nlayout-section-md; transform: translateX(0); } &--right { right@layout-section-md; left: auto; transform: translateX(0); } // Animation States &--entering { opacity: 0;  transform: translateX(-50%) translateY(20px); } &--exiting { opacity: 0; transform: translateX(-50%) translatfeY(20px); } // BEM Elements &__content { flex: 1; min-width: 0; &--multiline/&ntent-line-tight 0; } } &__message { color: inherit; margin: 0; overflow-wrap: break-word; } &__actionsM gap@ argin-left@$T flex-shrink: 0; } &__action { background: transparent; border: none1P Gransition: background-color* JDUse inherited text color with opacity for actions color: inherit41medium; &:hover { background-color/1) -color/M2); } } &__dismiss { background: transparent; border: none1P F margin-left@$ color: inherit;O 6transition: background-color* G &:hover { background-color/1) -color/2)NIcon styling &__icon { flex-shrink: 0; color: inherit; font-size"Fbottom@layout-section-sm; left@layout-section-sm; right@layout-section-sm; transform: translateX(0); max-width: none; &--left, &--right { left: $semantic-spNlayout-section-sm; right@0layout-section-sm; transform: translateX(0:3^ bottom@layout-section-xs; left@layout-section-xs; right@layout-section-xs; / `(y *i * # &__actions { margin-left@ gap@} } }.N!sxVk#U'6mҤڦiO[{ٞB v4s Lf9'OJ_|W/",  ʾzΙt2I ӆ9w~ww^fkjS+1~bPVbELVah5ڲp29Mqx+jsh떉[Z5P#] ܴCH[ݕ{BFC^Os݇_bxM7 ^<$\5Níd)_z"i3S)w))w)dzخ/SI)ʮv?N w6) /! MP:DHә-YAu_|$nT/Ć;4m8ŋWAb 뜶{3NV[qcFpeeX wOH6Xm?z ƗHQ6K' .b7n{ y: ?sɩCoC6TaOHj gbW߃{1A\d1]΢5&ᖢپ7 ϴ,K'XWjnAF ln.Ob[* A%䂲\Ń7,E margin: 0Tk R  border: noneZ5EO*Xi > } } .demo-info {Q'C-' ul { margin: 0; padding-leftqnmd; li { . family); ^I,a. '"= `b%n strong { - <[ } } } } // Responsive adjustments @media (max-width: $semantic-breakpoint-md - 1F@)p column { ` 3} } @media (max-width: $semantic-breakpoint-sm - 17` md; } .demo-section {&0 h2 { 7;`* Jc5} h3 { L`* 5PcJ} } }ax309?Glg) h2:2N< 2 E2QG2xBEO I7P  elevation-1 border-bottom8 paddingnW2lg; align-items: flex-start; &--spaced { around; .demo-example { min-width: 200px; text-align: center; } } } .demo-example { display: flexOU!?U i@input-radius; min-height: 120px; position: relative; h4:P: 0 0q 0; text-align: center; }P6k \3Tk R  &:hover:not(:disabled)K + q:not(:disabled) {{ #P . 7  P@ L &:hover:not(:disabled)A%p  } } } .demo-log {Q'KecondW' input-radiusA)+md; max-height: 300px; overflow-y: auto/md; &__empty1Utertiary; text-align: center; font-style: italic; margin: 0; } &__entry { display: flex; gap: $seman ` ` xs; border-bottom8 G &:last-child { border-bottom: none; } } &__timefont-family-mono\.caption, font-size#Ftertiary; flex-shrink: 0; min-width: 80px; } &__message1 body-smallNAsmall < body-smallQ> body-smalA)2} } // Responsive design @media (max-width: 768px7` md 51 align-items: stretch; &--spaced { 2 } } .demo-example { min-height: auto; ` md; } .demo-section"` vmd; } } // Ensure positioned FAB menus are visible above demo content :host { position: relative; z-index: 1; })x93.~+ h2 { font-size: 2-sizec!!bold; } h3 { font-size: -sizeX -}>lgAS I* radius-lg; P elevation-1; } .demoJ3i&pmd'p} .demo-item { ` mdP( iPradius-md; overflow: hidden; box-sizing: border-box; h4 { font-size: 4-sizeX list-item!"medium; } p { font-size:  font-size-sm"= `Eactions { display: flexQp #pE%mdP(variantZ$ radius-md` xs1?k R  border: noneZ$ font-size:  font-size-sm2medium b-in-out; &:hover *-hover;M "elevation-2; } ` 3  P@ > primary; 1 1p % } } } .demo-info { font-size:  font-size-smPP tertiary;!n*list-item; } .form-demo { display: gridQp8} .demo-input { width: 100%; box-sizing: border-boxA)Nhradius-md; font-size:  font-size-mdPP@ T/ K'-in-out; &:focus { outline: none 1box-shadow: 0 0 0 2px -container; } &:disabled #pdisabled"4disabled; cursor: not-allowed; } &--error { #error; !$error-container; } &--success { #success; !tertiary-container; } } .demo-textarea { @extend .demo-input; min-height: 100px; resize: vertical; } .demo-select { Y @extend .demo-input; cursor: pointer; } .demo-checkbox, .demo-radio { display: flexUpXline-normal; cursor: pointer; input { margin: 0; } label { font-size:  font-size-sm/:cursor: pointer; } } .validation-demo { display: gridQp E%mdP(variantZ$radius-md; } .form-status { ` NE font-family: 'JetBrains Mono', 'Consolas', monospace; font-size: font-size-xs; } .code-demo {Q'variantB*radius>,md;!n  pre8'JetBrains Mono', 'Consolas', monospace; font-size:  font-size-xs"= `Foverflow-x: auto; margin: 0; } } .layout-demo { display: gridQp} // Ensure form fields are properly contained ui-form-field { display: block; width: 100%; box-sizing: border-box; } /R/ Responsive adjustments @media (max-width: $semantic-breakpoint-md - 1) { .demo?*pm; } }ƭ|xj0,9/index9?+ h2 {. font-sizeo -size; #layout-lg; border-bottom: 1a& h3 {!} font-sizeo 3-size; -lg; margin-toOlayout-lg; } h4 {. font-size -size; 3?Axl; &:last-child { margin-bottom: 0; } } .demo-column%0!lg; } .demo-itemQ order: 1a1 radius-md;'^ &:hover {|7} } .demo-controls%0! +lgf> radius-lg; border: 1a .control-row;lg; flex-wrap: wrap/end; } .control-group { display: flex;!!6xs; min-width: 150px; label { font-sizesize-sm; font-weightweight-medium; -f} input[type="range"] { width: 100%; } input[type="checkbox"] { margin-rightxs; } select { 'xs border: 1a-  " radius-sm;+^ - font-sizesize-sm; &:focus { S';   }"; + } } } } .demo-interactive-resultQ  xl;'^> radius-lg; border: 2px dashe! } .demo-formQ 4^> radius-lg; border: 1a .form-row { -lg radius-md; border: 1a@ .event-list { max-height: 200px; overflow-y: auto; 3T'&^ "radius-sm; border: 1a" .event-item { font-size size-xs;  }'xs 0; border-bottom: 1a  } } } button {Q*sm# border: 1a- " radius-sm; &^ V+ font-size size-sm; cursor: pointer; ;easing-standard; &:hover<4} &:focus { S';  }(0$semantic-breakpoint-md - 1]7)layout-md; } .demo-controls .control=h .control-group { min-width: auto; } } } @media (max-width: $semantic-breakpoint-sm - 1]7layout-sm; } .demo-item {Q2}2X!x~0+9/index9Gsm)Emd[   0; } Z "lg 0; border-bottom: 1a- 6 F} "md 0; } } .demo-sub- xlf> radius-lg; border: 1a- "!xl; flex-wrap: wrap/1lg; } .demo-item { flex: 1; min-width: 300pxS^1a- +>radius-md; } .vertical-stepper-container { max-width: 400pxS^1a- +"radius-md; } .interactive-exampleQ  xl;'^`- + radius-lg/)lg; } .demo-controls { display: flex; ) margin-toplg)!$ > ?radius-sm; flex-wrap: wrap; } .demo-button { display: flexQ<xs] P"brand: &brand-primary; border: non% radius-sm; a-  l #brand-secondary;-' 26D brand-primary,0$^} fa-icon { font-size: $semantic-sizing-icon-inline; } } .step-info { margin-toplg)!6radius-sm; border-left: 4abrand-primary; p { % line-tight 0;^4] 5i},margin-bottom: 0; } strong { - font-weightweight-semibold; }(!3item { min-width: auto; } .demo-controls#) .demo-button { justify-content .vertical-stepper-container { max-width: none; } } @media (max-width: 480px) { .demo-subsection, .demo-item, .interactive-example {QEh2 {6 3, font-size)}h3 {6^  } }ޖU1xR0. @import "3"?Amd) h2 { # 0;^/oG xl; h3 { -md 0;^/o K } h4 { 7c*  &} } .demo-description { margin: 0 0lg 0; aI ) 4- s * O} "!m &--vertical { 9>} } .demo-item { flex: 1; min-width: 0; } .demo-controls$@  +lg)!$ >-)card-radius; label { display: flexcenter 'xs; cursor: pointer; ^/label<labea=label_ >label9F input[type="checkbox"] { margin: 0; } &:hover { ; event-^I- +card] } .demo-no-events { margin: 0+ 0; text-align: center; *"font-style: italic; } .demo-eventQ  xs 0; Q a1] 4 4s * line-height); P  &:last-of-type {  } strong {; font-weightIweight-semibold; } } .demo-event-time { display: block; margin-topxs; *c*f 3f *f7 5;caption, line-height); } .demo-clear-events { margin-top$%xs' >-  a- utton-small Asmall Asmall0 Csmall, line-height); } c &:hover +elevated{8X' } &:focusPN-gsm; } /! .demo-controls0)} } @media (max-width: 480[K .demo-section { #9md; } .demo-event-log { max-height: 200px; } }Ax0n5 :QNM?3/%b$ExY]o:}ϯHݶAs7ۢh[,%&"Iz Eɒ%7k%3ÙÉJg8ZҙƷLfVtktJ"0H?Q5Tgu'KGtNTnN(A-ûDײ7 ?:B@|@ThgCawCde"#!1SLub@%+̱t]Ga ox,~8V%Q=x*w 2}{59x #T/aȜjwȻVa]uۼ$O؅ky}}K-=Zքyf?=r%r[.ϑr*l,ʟA˥_ *T&iΰ~F`*0.j1@鿧;a}cԛ Z+[w߫j2q{e\b#P/ MQcyC"s`O1ҥ%M# 2=vhkXM3B^>/_%5|`b`+8X?* < X˻".x1w#U :VDzxT(d86|5_@pe?Xe C uQq dV|1<˦ t>krZ 6ߜĖ_cmOnc^p(fjzfx)Lɤ߂?[!ۻ<䴵Xm?!}rRc(}YTI {Islj:9'\MgClF0p14zc8Zзu?b鋸WFMyG`Q$Mqr&">(Yd)ym3ŹHbv!`^ !?>H{PM4]x7ͽ!{qs iY(D$ =Arg#X)._W9Ј6S?7 fafNU @+Yx-:P.ӥC~?\/Xd|ĕw4ٯ*l\}5 ūo; /n%}ǟ3e $MA3RlE:,n.xMB]6(߸5X$ -KA6p*c^2oB!(6jnRǃV4h0Y;{PZU@V%^EinuoPTw2DOvVS8ߖ*^[?Ua6, MmNCNk檍dU/غx%import { Component, ElementRef, ViewChild } from '@angular/core'; import { CommonModule } from '@angular/common'; import { UiAnimationsService } from '../../../../../ui-animations/src/lib/ui-animations.service'; import { AnimateDirective } from '../../../../../ui-animations/src/lib/animate.directive'; @Component({ selector: 'app-animations-demo', standalone: true, imports: [CommonModule, AnimateDirective], template: `

UI Animations Demo

Entrance Animations

Fade In

Basic fade in animation

Fade In Up

Fade in with upward movement

Slide In Up

Slide in from bottom

Zoom In

Scale up animation

Emphasis Animations

Click buttons above to animate me!

Animation Directive Examples

Hover to Animate

Uses directive with hover trigger

Click to Animate

Uses directive with click trigger

Animation Service Examples

Animation Service Target
`, styles: [` .animations-demo { padding: 2rem; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: 3rem; h3 { margin-bottom: 1.5rem; color: #333; border-bottom: 2px solid #007bff; padding-bottom: 0.5rem; } } .animation-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; margin-bottom: 2rem; } .demo-card { padding: 1.5rem; border: 1px solid #ddd; border-radius: 8px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); transition: transform 0.2s ease; h4 { margin: 0 0 0.5rem 0; font-size: 1.2rem; } p { margin: 0; opacity: 0.9; } &:hover { transform: translateY(-2px); } } .demo-button { padding: 0.75rem 1.5rem; border: none; border-radius: 6px; background: #007bff; color: white; cursor: pointer; font-size: 1rem; transition: background-color 0.2s ease; &:hover { background: #0056b3; } } .demo-target { padding: 2rem; border: 2px dashed #007bff; border-radius: 8px; text-align: center; font-size: 1.2rem; font-weight: bold; background: #f8f9fa; margin-top: 1rem; } .service-target { background: linear-gradient(45deg, #ff6b6b, #4ecdc4); color: white; border: none; } .service-controls { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; } /* Responsive */ @media (max-width: 768px) { .animation-grid { grid-template-columns: 1fr; } .service-controls { justify-content: center; } } `] }) export class AnimationsDemoComponent { @ViewChild('animationTarget', { static: true }) animationTarget!: ElementRef; @ViewChild('serviceTarget', { static: true }) serviceTarget!: ElementRef; constructor(private animationService: UiAnimationsService) {} animateElement(animationType: string) { const element = this.animationTarget.nativeElement; const animationClass = `animate-${animationType}`; // Remove any existing animation classes first element.className = element.className.replace(/animate-\w+/g, ''); // Add animation class this.animationService.animateOnce(element, animationClass); } serviceAnimate(animationClass: string) { const element = this.serviceTarget.nativeElement; // Remove any existing animation classes first element.className = element.className.replace(/animate-\w+/g, ''); // Add animation class with service this.animationService.animateOnce(element, animationClass); } }mJ`hxe`B;Ry%yśu׉ž ⿵ x_[import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { AppbarComponent } from '../../../../../ui-essentials/src/lib/components/navigation/appbar/appbar.component'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faBars, faSearch, faUser, faHeart, faBell, faCog, faShoppingCart, faHome, faArrowLeft, faPlus, faShare, faEllipsisV, faSun, faMoon } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-appbar-demo', standalone: true, imports: [ CommonModule, AppbarComponent, FontAwesomeModule ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Appbar Component Showcase

Appbar Variants

Compact

Compact Appbar

Standard

Standard Appbar
JS

Large

Large Appbar with More Space

Prominent

SkyUI
Prominent Design System

Elevation & Position

Elevated

Elevated Appbar

Not Elevated

Flat Appbar

Slot Configurations

Left Icon + Title + Right Avatar

Home User avatar

Left Logo + Title + Right Menu

App
Dashboard

Left Avatar + Title + Right Icon

UI
Profile Settings

Multiple Right Elements

Multi-Action Bar

Real-world Examples

E-commerce App

ShopMart
3

Social Media App

SocialHub
Feed

Settings Page

Account Settings

Interactive Demo

Customize the appbar below by toggling different options:

@if (demoConfig().slots.leftIcon) { } @if (demoConfig().slots.leftLogo) {
Demo
} {{ demoConfig().title }} @if (demoConfig().slots.rightIcon) { } @if (demoConfig().slots.rightAvatar) {
DU
} @if (demoConfig().slots.rightMenu) {
}
@if (lastAction()) {
Last action: {{ lastAction() }}
}

Code Examples

Basic Appbar:

<ui-appbar 
  variant="standard" 
  [slots]="{title: true, leftIcon: true, rightIcon: true}"
  [elevated]="false">
  <fa-icon [icon]="faBars" slot="left-icon"></fa-icon>
  <span slot="title">My App</span>
  <fa-icon [icon]="faSearch" slot="right-icon"></fa-icon>
</ui-appbar>

Appbar with Logo and Avatar:

<ui-appbar 
  variant="standard" 
  [slots]="{title: true, leftLogo: true, rightAvatar: true}"
  [elevated]="true">
  <div slot="left-logo" style="font-weight: 600;">
    MyBrand
  </div>
  <span slot="title">Dashboard</span>
  <img slot="right-avatar" src="avatar.jpg" 
       style="width: 32px; height: 32px; border-radius: 50%;">
</ui-appbar>

Appbar with Multiple Actions:

<ui-appbar 
  variant="standard" 
  [slots]="{title: true, leftIcon: true, rightMenu: true}"
  [elevated]="false">
  <fa-icon [icon]="faArrowLeft" slot="left-icon"></fa-icon>
  <span slot="title">Settings</span>
  <div slot="right-menu" style="display: flex; gap: 1rem;">
    <fa-icon [icon]="faSearch"></fa-icon>
    <fa-icon [icon]="faEllipsisV"></fa-icon>
  </div>
</ui-appbar>
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } fa-icon { transition: color 0.2s ease; } fa-icon:hover { color: #007bff; } label { font-size: 0.875rem; user-select: none; } input[type="checkbox"] { margin: 0; } select { font-size: 0.875rem; } `] }) export class AppbarDemoComponent { // State signals isDarkMode = signal(false); lastAction = signal(''); // Demo configuration demoConfig = signal({ variant: 'standard' as any, elevated: false, title: 'Interactive Demo', slots: { leftIcon: true, leftLogo: false, leftAvatar: false, title: true, rightIcon: true, rightLogo: false, rightAvatar: false, rightMenu: false } }); // Font Awesome icons faBars = faBars; faSearch = faSearch; faUser = faUser; faHeart = faHeart; faBell = faBell; faCog = faCog; faShoppingCart = faShoppingCart; faHome = faHome; faArrowLeft = faArrowLeft; faPlus = faPlus; faShare = faShare; faEllipsisV = faEllipsisV; faSun = faSun; faMoon = faMoon; handleAction(action: string): void { this.lastAction.set(`${action} clicked at ${new Date().toLocaleTimeString()}`); console.log(`Appbar action: ${action}`); } toggleTheme(): void { this.isDarkMode.update(current => !current); this.handleAction(`Theme switched to ${this.isDarkMode() ? 'dark' : 'light'} mode`); } handleImageError(event: Event): void { const target = event.target as HTMLImageElement; target.style.display = 'none'; const fallback = document.createElement('div'); fallback.style.width = '32px'; fallback.style.height = '32px'; fallback.style.borderRadius = '50%'; fallback.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)'; fallback.style.display = 'flex'; fallback.style.alignItems = 'center'; fallback.style.justifyContent = 'center'; fallback.style.color = 'white'; fallback.style.fontWeight = '500'; fallback.style.fontSize = '12px'; fallback.textContent = 'U'; target.parentNode?.insertBefore(fallback, target); } updateDemoConfig(key: string, event: Event): void { const target = event.target as HTMLInputElement; const value = target.checked; this.demoConfig.update(config => ({ ...config, [key]: value })); } updateDemoSlot(slotName: string, event: Event): void { const target = event.target as HTMLInputElement; const checked = target.checked; this.demoConfig.update(config => ({ ...config, slots: { ...config.slots, [slotName]: checked } })); } updateDemoVariant(event: Event): void { const target = event.target as HTMLSelectElement; const variant = target.value as any; this.demoConfig.update(config => ({ ...config, variant, title: variant.charAt(0).toUpperCase() + variant.slice(1) + ' Demo' })); } }tlmx6 6/-xL"import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { AspectRatioComponent } from '../../../../../ui-essentials/src/lib/components/layout/aspect-ratio'; @Component({ selector: 'ui-aspect-ratio-demo', standalone: true, imports: [CommonModule, AspectRatioComponent], template: `

Aspect Ratio Demo

Components for maintaining consistent aspect ratios across responsive content.

Aspect Ratio Presets

@for (preset of presets; track preset.ratio) {

{{ preset.label }}

{{ preset.ratio }} ({{ preset.description }})
}

Custom Aspect Ratios

@for (custom of customRatios; track custom.ratio) {

{{ custom.label }}

{{ custom.ratio }}
}

Size Variants

@for (size of sizes; track size) {

Size: {{ size }}

{{ size }} size
}

Style Variants

@for (variant of variants; track variant) {

{{ variant | titlecase }}

{{ variant }} variant @if (variant === 'interactive') { Click me! }
}

Image Examples

Square Image

Square demo image

Video Aspect

Video aspect demo image

Portrait Image

Portrait demo image

Loading State

Loading

Dynamic Loading

Content Centering

Fill Container

Fills entire container

Centered Content

I'm centered!

Interactive Examples

Click Counter

{{ clickCount }}
Click to increment
`, styleUrl: './aspect-ratio-demo.component.scss' }) export class AspectRatioDemoComponent { presets = [ { ratio: 'square' as const, label: 'Square', description: '1:1' }, { ratio: 'video' as const, label: 'Video', description: '16:9' }, { ratio: 'cinema' as const, label: 'Cinema', description: '21:9' }, { ratio: 'photo' as const, label: 'Photo', description: '3:2' }, { ratio: 'portrait' as const, label: 'Portrait', description: '3:4' }, { ratio: 'golden' as const, label: 'Golden', description: '1.618:1' } ]; customRatios = [ { ratio: '4/3', label: 'Custom 4:3' }, { ratio: '75%', label: 'Custom 75%' }, { ratio: '1.33', label: 'Custom 1.33' }, { ratio: '125%', label: 'Custom 125%' } ]; sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'elevated', 'bordered', 'interactive'] as const; clickCount = 0; isLoading = false; private colors = [ 'linear-gradient(45deg, #667eea, #764ba2)', 'linear-gradient(135deg, #f093fb, #f5576c)', 'linear-gradient(45deg, #4facfe, #00f2fe)', 'linear-gradient(135deg, #43e97b, #38f9d7)', 'linear-gradient(45deg, #fa709a, #fee140)', 'linear-gradient(135deg, #a8edea, #fed6e3)', 'linear-gradient(45deg, #ffecd2, #fcb69f)', 'linear-gradient(135deg, #ff9a9e, #fecfef)' ]; getRandomColor(): string { return this.colors[Math.floor(Math.random() * this.colors.length)]; } handleInteractiveClick(event: MouseEvent): void { console.log('Interactive aspect ratio clicked', event); } incrementCounter(): void { this.clickCount++; } toggleLoading(): void { this.isLoading = !this.isLoading; } }Px0@use '../../../../../ui-design-system/src/styles/semantic/index' as *; .demo-container { padding: 32px; max-width: 1200px; margin: 0 auto; h2 { color: $semantic-color-text-primary; font-size: 32px; margin-bottom: 48px; border-bottom: $semantic-border-width-1 solid $semantic-color-border-primary; padding-bottom: 16px; } h3 { color: $semantic-color-text-primary; font-size: 24px; margin-bottom: 32px; } h4 { color: $semantic-color-text-primary; font-size: 20px; margin-bottom: 16px; } } .demo-section { margin-bottom: 64px; padding: 32px; background: $semantic-color-surface-primary; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-lg; box-shadow: $semantic-shadow-elevation-1; } .demo-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; align-items: start; } .demo-item { display: flex; flex-direction: column; gap: 12px; > label { font-weight: 500; color: $semantic-color-text-secondary; font-size: 14px; } } .demo-form { .form-values { margin-top: 32px; padding: 16px; background: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-md; border: $semantic-border-width-1 solid $semantic-color-border-subtle; h4 { margin-bottom: 12px; } pre { background: $semantic-color-background; padding: 12px; border-radius: $semantic-border-radius-sm; border: $semantic-border-width-1 solid $semantic-color-border-primary; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: 12px; color: $semantic-color-text-primary; overflow-x: auto; margin-bottom: 12px; } p { margin: 0; color: $semantic-color-text-secondary; font-size: 14px; } } } .event-log { margin-top: 32px; .log-container { max-height: 300px; overflow-y: auto; background: $semantic-color-background; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-md; margin-bottom: 16px; } .log-entry { display: grid; grid-template-columns: 120px 1fr auto; gap: 12px; padding: 8px 12px; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; font-size: 12px; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; &:last-child { border-bottom: none; } .log-event { font-weight: 500; color: $semantic-color-brand-primary; } .log-data { color: $semantic-color-text-primary; overflow-wrap: break-word; } .log-time { color: $semantic-color-text-tertiary; font-size: 11px; } } .clear-log-btn { padding: 8px 12px; background: $semantic-color-surface-secondary; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; color: $semantic-color-text-secondary; font-size: 12px; cursor: pointer; transition: all 0.2s ease; &:hover { background: $semantic-color-surface-elevated; border-color: $semantic-color-border-focus; } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } } // Responsive design @media (max-width: 1024px - 1) { .demo-row { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 24px; } } @media (max-width: 768px - 1) { .demo-container { padding: 24px; } .demo-section { padding: 24px; } .demo-row { grid-template-columns: 1fr; gap: 24px; } .event-log { .log-entry { grid-template-columns: 1fr; gap: 8px; .log-time { text-align: right; } } } }qū>x Rn(gqFbQjniFUn~Lx5uimport { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ReactiveFormsModule, FormControl, FormGroup } from '@angular/forms'; import { AutocompleteComponent, AutocompleteOption } from '../../../../../ui-essentials/src/lib/components/forms/autocomplete/autocomplete.component'; @Component({ selector: 'ui-autocomplete-demo', standalone: true, imports: [CommonModule, ReactiveFormsModule, AutocompleteComponent], template: `

Autocomplete Demo

Sizes

Variants

With Labels & Helper Text

States

Error State

Advanced Features

Behavior Options

Reactive Forms Integration

Form Values:

{{ demoForm.value | json }}

Form Valid: {{ demoForm.valid }}

Event Monitoring

Event Log:

@for (event of eventLog(); track event.id) {
{{ event.type }} {{ event.data }} {{ event.time }}
}
`, styleUrl: './autocomplete-demo.component.scss' }) export class AutocompleteDemoComponent { // Form for reactive forms demo demoForm = new FormGroup({ favoriteCountry: new FormControl(''), preferredLanguage: new FormControl('') }); // Event logging private _eventLog = signal>([]); eventLog = this._eventLog.asReadonly(); private eventCounter = 0; // Sample data countries: AutocompleteOption[] = [ { value: 'us', label: 'United States' }, { value: 'ca', label: 'Canada' }, { value: 'gb', label: 'United Kingdom' }, { value: 'de', label: 'Germany' }, { value: 'fr', label: 'France' }, { value: 'it', label: 'Italy' }, { value: 'es', label: 'Spain' }, { value: 'jp', label: 'Japan' }, { value: 'kr', label: 'South Korea' }, { value: 'cn', label: 'China' }, { value: 'in', label: 'India' }, { value: 'au', label: 'Australia' }, { value: 'br', label: 'Brazil' }, { value: 'mx', label: 'Mexico' }, { value: 'ru', label: 'Russia' }, { value: 'za', label: 'South Africa' }, { value: 'ng', label: 'Nigeria' }, { value: 'eg', label: 'Egypt' } ]; programmingLanguages: AutocompleteOption[] = [ { value: 'typescript', label: 'TypeScript' }, { value: 'javascript', label: 'JavaScript' }, { value: 'python', label: 'Python' }, { value: 'java', label: 'Java' }, { value: 'csharp', label: 'C#' }, { value: 'cpp', label: 'C++' }, { value: 'go', label: 'Go' }, { value: 'rust', label: 'Rust' }, { value: 'swift', label: 'Swift' }, { value: 'kotlin', label: 'Kotlin' }, { value: 'php', label: 'PHP' }, { value: 'ruby', label: 'Ruby' }, { value: 'scala', label: 'Scala' }, { value: 'dart', label: 'Dart' } ]; users: AutocompleteOption[] = [ { value: '1', label: 'John Doe', secondaryText: 'john.doe@example.com' }, { value: '2', label: 'Jane Smith', secondaryText: 'jane.smith@example.com' }, { value: '3', label: 'Bob Johnson', secondaryText: 'bob.johnson@example.com' }, { value: '4', label: 'Alice Brown', secondaryText: 'alice.brown@example.com' }, { value: '5', label: 'Charlie Wilson', secondaryText: 'charlie.wilson@example.com' }, { value: '6', label: 'Diana Davis', secondaryText: 'diana.davis@example.com' }, { value: '7', label: 'Eve Miller', secondaryText: 'eve.miller@example.com' }, { value: '8', label: 'Frank Garcia', secondaryText: 'frank.garcia@example.com' } ]; fruits: AutocompleteOption[] = [ { value: 'apple', label: 'Apple' }, { value: 'banana', label: 'Banana' }, { value: 'orange', label: 'Orange' }, { value: 'grape', label: 'Grape' }, { value: 'strawberry', label: 'Strawberry' }, { value: 'blueberry', label: 'Blueberry' }, { value: 'pineapple', label: 'Pineapple' }, { value: 'mango', label: 'Mango' }, { value: 'kiwi', label: 'Kiwi' }, { value: 'peach', label: 'Peach' }, { value: 'cherry', label: 'Cherry' }, { value: 'watermelon', label: 'Watermelon' } ]; // Custom filter function startsWithFilter = (option: AutocompleteOption, query: string): boolean => { return option.label.toLowerCase().startsWith(query.toLowerCase()); }; onValueChange(source: string, value: any): void { console.log(`Value changed (${source}):`, value); } onOptionSelected(option: AutocompleteOption): void { console.log('Option selected:', option); } logEvent(type: string, data: any): void { const entry = { id: ++this.eventCounter, type, data: typeof data === 'object' ? JSON.stringify(data) : String(data), time: new Date().toLocaleTimeString() }; const currentLog = this._eventLog(); this._eventLog.set([entry, ...currentLog.slice(0, 19)]); // Keep last 20 events } clearEventLog(): void { this._eventLog.set([]); this.eventCounter = 0; } }8lx~Aq+ # x Mimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { AvatarComponent } from '../../../../../ui-essentials/src/lib/components/data-display/avatar/avatar.component'; interface Activity { user: string; action: string; time: string; status?: 'online' | 'offline' | 'away' | 'busy'; } @Component({ selector: 'ui-avatar-demo', standalone: true, imports: [ CommonModule, AvatarComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Avatar Component Showcase

Size Variants

XS (24px)

SM (32px)

MD (40px)

LG (48px)

XL (64px)

XXL (80px)

With Images

John Doe

Jane Smith

Alex Rodriguez

Fallback (Broken URL)

Status Indicators

Online

Offline

Away

Busy

Notification Badges

3 notifications

99+ notifications

Online + Badge

Premium User

Shape Variants

Circle (Default)

Square

Rounded Square

Color Variants

Primary

Secondary

Success

Warning

Danger

Activity List Example

Recent Activity

@for (activity of activities; track activity.user) {
{{ activity.user }}
{{ activity.action }}
{{ activity.time }}
}

User List Example

@for (user of userProfiles; track user.id) {

{{ user.name }}

{{ user.role }}

{{ user.email }}

Last seen
{{ user.lastSeen }}
}

Special States

Loading

Empty Name

Single Character

No Name

Avatar Group Example

@for (member of teamMembers; track member.name; let i = $index) { }
+{{ teamMembers.length }} members

Usage Examples

Basic Avatar:

<ui-avatar 
  size="md" 
  name="Current User"
  status="online">
</ui-avatar>

Avatar with Image:

<ui-avatar 
  size="lg"
  name="John Doe"
  imageUrl="https://example.com/avatar.jpg"
  altText="John's profile picture"
  status="away"
  badge="5">
</ui-avatar>

Custom Styled Avatar:

<ui-avatar 
  size="xl"
  name="Admin User"
  color="primary"
  shape="rounded"
  badge="⭐"
  [loading]="false">
</ui-avatar>

Interactive Example

Size: {{ interactiveSize }}
Status: {{ interactiveStatus || 'none' }}
Badge: {{ interactiveBadge || 'none' }}
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } `] }) export class AvatarDemoComponent { activities: Activity[] = [ { user: 'Alice Johnson', action: 'Updated the project documentation and added new API endpoints', time: '2 min ago', status: 'online' }, { user: 'Bob Smith', action: 'Completed code review for the authentication module', time: '15 min ago', status: 'away' }, { user: 'Carol Williams', action: 'Created new user interface mockups for the dashboard', time: '1 hour ago', status: 'online' }, { user: 'David Brown', action: 'Fixed critical bug in the payment processing system', time: '2 hours ago', status: 'busy' }, { user: 'Eve Davis', action: 'Deployed version 2.1.0 to production environment', time: '3 hours ago', status: 'offline' } ]; userProfiles = [ { id: 1, name: 'Alice Johnson', role: 'Senior Developer', email: 'alice@company.com', status: 'online' as const, notifications: 3, lastSeen: '2 min ago', avatar: 'https://images.unsplash.com/photo-1494790108755-2616b612b786?w=150&h=150&fit=crop&crop=face' }, { id: 2, name: 'Bob Smith', role: 'Product Manager', email: 'bob@company.com', status: 'away' as const, notifications: 0, lastSeen: '15 min ago', avatar: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=150&h=150&fit=crop&crop=face' }, { id: 3, name: 'Carol Williams', role: 'UX Designer', email: 'carol@company.com', status: 'online' as const, notifications: 12, lastSeen: 'Just now', avatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=150&h=150&fit=crop&crop=face' } ]; teamMembers = [ { name: 'Alex Chen', status: 'online' as const, avatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=150&h=150&fit=crop&crop=face' }, { name: 'Maria Garcia', status: 'away' as const, avatar: 'https://images.unsplash.com/photo-1517841905240-472988babdf9?w=150&h=150&fit=crop&crop=face' }, { name: 'James Wilson', status: 'busy' as const, avatar: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=150&h=150&fit=crop&crop=face' }, { name: 'Sarah Kim', status: 'online' as const, avatar: 'https://images.unsplash.com/photo-1534751516642-a1af1ef26a56?w=150&h=150&fit=crop&crop=face' }, ]; // Interactive demo properties interactiveSize: any = 'lg'; interactiveStatus: any = 'online'; interactiveBadge = '3'; private statusCycle: any[] = ['online', 'away', 'busy', 'offline', null]; private statusIndex = 0; private sizeCycle: any[] = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl']; private sizeIndex = 3; // Start with 'lg' cycleStatus(): void { this.statusIndex = (this.statusIndex + 1) % this.statusCycle.length; this.interactiveStatus = this.statusCycle[this.statusIndex]; } toggleBadge(): void { if (this.interactiveBadge) { this.interactiveBadge = ''; } else { this.interactiveBadge = Math.floor(Math.random() * 99 + 1).toString(); } } cycleSize(): void { this.sizeIndex = (this.sizeIndex + 1) % this.sizeCycle.length; this.interactiveSize = this.sizeCycle[this.sizeIndex]; } }G5lxg&_(1x&@use '../../../../../ui-design-system/src/styles/semantic/index' as tokens; .demo-container { padding: tokens.$semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: tokens.$semantic-spacing-layout-lg; padding: tokens.$semantic-spacing-component-md; background: tokens.$semantic-color-surface-primary; border: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-primary; border-radius: tokens.$semantic-border-radius-md; box-shadow: tokens.$semantic-shadow-elevation-1; h3 { margin: 0 0 tokens.$semantic-spacing-content-paragraph 0; font-size: tokens.$semantic-typography-heading-h3-size; color: tokens.$semantic-color-text-primary; } } .demo-row { display: flex; gap: tokens.$semantic-spacing-component-sm; flex-wrap: wrap; margin-bottom: tokens.$semantic-spacing-content-paragraph; } .demo-controls { display: flex; align-items: center; gap: tokens.$semantic-spacing-component-md; margin-bottom: tokens.$semantic-spacing-content-paragraph; flex-wrap: wrap; label { font-size: tokens.$semantic-typography-font-size-md; color: tokens.$semantic-color-text-primary; font-weight: tokens.$semantic-typography-font-weight-medium; min-width: 100px; } input[type="range"] { flex: 1; min-width: 200px; max-width: 300px; margin: 0 tokens.$semantic-spacing-component-sm; } } .demo-button { padding: tokens.$semantic-spacing-component-sm tokens.$semantic-spacing-component-md; background: tokens.$semantic-color-primary; color: tokens.$semantic-color-on-primary; border: none; border-radius: tokens.$semantic-border-radius-sm; font-size: tokens.$semantic-typography-font-size-md; cursor: pointer; transition: all tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease; &:hover { background: tokens.$semantic-color-primary-hover; box-shadow: tokens.$semantic-shadow-elevation-2; } &:active { transform: translateY(1px); box-shadow: tokens.$semantic-shadow-elevation-1; } &--secondary { background: tokens.$semantic-color-surface-secondary; color: tokens.$semantic-color-text-primary; border: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-primary; &:hover { background: tokens.$semantic-color-surface-secondary; } } } // Backdrop content styles .backdrop-content { background: tokens.$semantic-color-surface-primary; padding: tokens.$semantic-spacing-component-lg; border-radius: tokens.$semantic-border-radius-md; box-shadow: tokens.$semantic-shadow-elevation-4; text-align: center; max-width: 400px; margin: 0 auto; h4 { margin: 0 0 tokens.$semantic-spacing-content-paragraph 0; font-size: tokens.$semantic-typography-heading-h4-size; color: tokens.$semantic-color-text-primary; } p { margin: 0 0 tokens.$semantic-spacing-content-paragraph 0; font-size: tokens.$semantic-typography-font-size-md; color: tokens.$semantic-color-text-secondary; } &--glass { background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: tokens.$semantic-border-width-1 solid rgba(255, 255, 255, 0.2); } &--large { max-width: 600px; padding: tokens.$semantic-spacing-component-xl; } &--small { max-width: 300px; padding: tokens.$semantic-spacing-component-md; } } // Event log styles .demo-log { background: tokens.$semantic-color-surface-secondary; border: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-md; max-height: 200px; overflow-y: auto; margin-bottom: tokens.$semantic-spacing-content-paragraph; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; } .log-entry { font-size: tokens.$semantic-typography-font-size-sm; color: tokens.$semantic-color-text-primary; padding: tokens.$semantic-spacing-component-xs 0; border-bottom: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-subtle; &:last-child { border-bottom: none; } &--empty { color: tokens.$semantic-color-text-tertiary; font-style: italic; text-align: center; border-bottom: none; } } // Dark mode support :host-context(.dark-theme) { .backdrop-content { &--glass { background: rgba(0, 0, 0, 0.8); border: tokens.$semantic-border-width-1 solid rgba(255, 255, 255, 0.1); } } } // Responsive design @media (max-width: #{tokens.$semantic-breakpoint-md - 1px}) { .demo-container { padding: tokens.$semantic-spacing-layout-sm; } .demo-section { padding: tokens.$semantic-spacing-component-sm; } .backdrop-content { margin: tokens.$semantic-spacing-layout-sm; padding: tokens.$semantic-spacing-component-md; &--large, &--small { max-width: none; padding: tokens.$semantic-spacing-component-md; } } .demo-controls { flex-direction: column; align-items: stretch; input[type="range"] { min-width: auto; } } } @media (max-width: #{tokens.$semantic-breakpoint-sm - 1px}) { .demo-row { flex-direction: column; } .demo-button { width: 100%; text-align: center; } }P`gxyIs(gqFbQjniF-"U̽x]%import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BackdropComponent } from '../../../../../ui-essentials/src/lib/components/overlays/backdrop/backdrop.component'; @Component({ selector: 'ui-backdrop-demo', standalone: true, imports: [CommonModule, BackdropComponent], template: `

Backdrop Demo

Basic Backdrop

Variants

@for (variant of variants; track variant) { }
@if (currentVariant) {

{{ currentVariant | titlecase }} Backdrop

Click backdrop to close

 }

Blur Effect

Blur Backdrop

Notice the blur effect behind this content

Opacity Control

Opacity: {{ currentOpacity }}

Adjust the opacity using the slider above

Z-Index & Stacking

First Backdrop (z-index: 1000)

This is behind the second backdrop

Second Backdrop (z-index: 1010)

This is in front of the first backdrop

Non-clickable Backdrop

Non-clickable Backdrop

This backdrop cannot be clicked to close

Event Log

@for (event of eventLog; track $index) {
{{ event }}
} @empty {
No events yet. Interact with backdrops above.
}
`, styleUrl: './backdrop-demo.component.scss' }) export class BackdropDemoComponent { // Basic backdrop showBasicBackdrop = false; // Variant backdrop variants = ['default', 'blur', 'dark', 'light'] as const; currentVariant: typeof this.variants[number] | null = null; showVariant = false; // Blur backdrop showBlurBackdrop = false; // Opacity backdrop showOpacityBackdrop = false; currentOpacity = 0.5; // Stacked backdrops showFirstBackdrop = false; showSecondBackdrop = false; // Non-clickable backdrop showNonClickableBackdrop = false; // Event log eventLog: string[] = []; toggleBasicBackdrop(): void { this.showBasicBackdrop = !this.showBasicBackdrop; this.logEvent(`Basic backdrop ${this.showBasicBackdrop ? 'opened' : 'closed'}`); } showVariantBackdrop(variant: typeof this.variants[number]): void { this.currentVariant = variant; this.showVariant = true; this.logEvent(`${variant} backdrop opened`); } handleVariantVisibilityChange(visible: boolean): void { this.showVariant = visible; if (!visible && this.currentVariant) { this.logEvent(`${this.currentVariant} backdrop closed`); this.currentVariant = null; } } toggleBlurBackdrop(): void { this.showBlurBackdrop = !this.showBlurBackdrop; this.logEvent(`Blur backdrop ${this.showBlurBackdrop ? 'opened' : 'closed'}`); } updateOpacity(event: Event): void { const target = event.target as HTMLInputElement; this.currentOpacity = parseFloat(target.value); } toggleOpacityBackdrop(): void { this.showOpacityBackdrop = !this.showOpacityBackdrop; this.logEvent(`Opacity backdrop ${this.showOpacityBackdrop ? 'opened' : 'closed'} with opacity ${this.currentOpacity}`); } showStackedBackdrops(): void { this.showFirstBackdrop = true; this.showSecondBackdrop = true; this.logEvent('Stacked backdrops opened'); } hideStackedBackdrops(): void { this.showFirstBackdrop = false; this.showSecondBackdrop = false; this.logEvent('Stacked backdrops closed'); } handleStackedBackdropChange(visible: boolean): void { if (!visible) { this.hideStackedBackdrops(); } } toggleNonClickableBackdrop(): void { this.showNonClickableBackdrop = !this.showNonClickableBackdrop; this.logEvent(`Non-clickable backdrop ${this.showNonClickableBackdrop ? 'opened' : 'closed'}`); } handleBackdropClick(message: string): void { this.logEvent(message); } private logEvent(message: string): void { const timestamp = new Date().toLocaleTimeString(); this.eventLog.unshift(`[${timestamp}] ${message}`); // Keep only last 10 events if (this.eventLog.length > 10) { this.eventLog = this.eventLog.slice(0, 10); } } clearEventLog(): void { this.eventLog = []; this.logEvent('Event log cleared'); } }ojkxuk¶U x@use 'ui-design-system/src/styles' as ui; .backgrounds-demo { padding: 2rem; max-width: 1200px; margin: 0 auto; .demo-header { text-align: center; margin-bottom: 3rem; h1 { font-size: 3rem; font-weight: 700; color: var(--primary-900, #1e293b); margin-bottom: 1rem; } p { font-size: 1.2rem; color: var(--neutral-600, #64748b); } } .demo-section { margin-bottom: 4rem; h2 { font-size: 2rem; font-weight: 600; color: var(--primary-800, #334155); margin-bottom: 2rem; border-bottom: 2px solid var(--primary-200, #e2e8f0); padding-bottom: 0.5rem; } } .example-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; margin-bottom: 2rem; } .demo-card { padding: 2rem; border-radius: 1rem; min-height: 200px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: white; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease, box-shadow 0.3s ease; &:hover { transform: translateY(-5px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); } h3 { font-size: 1.5rem; font-weight: 600; margin-bottom: 1rem; } p { font-size: 1rem; opacity: 0.9; line-height: 1.5; } } .pattern-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; } .pattern-demo { aspect-ratio: 1; border-radius: 0.5rem; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); transition: transform 0.2s ease; &:hover { transform: scale(1.05); } .pattern-name { background: rgba(0, 0, 0, 0.7); color: white; padding: 0.5rem 1rem; border-radius: 0.25rem; font-size: 0.875rem; font-weight: 500; text-transform: capitalize; } } .gradient-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; } .gradient-demo { aspect-ratio: 16/9; border-radius: 1rem; display: flex; align-items: center; justify-content: center; color: white; font-size: 1.2rem; font-weight: 600; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1); transition: transform 0.3s ease; &:hover { transform: translateY(-3px); } } .interactive-demo { padding: 3rem; border-radius: 1rem; min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: white; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15); position: relative; transition: all 0.5s ease; .controls { display: flex; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; justify-content: center; } h3 { font-size: 2rem; margin-bottom: 1rem; } p { font-size: 1.1rem; opacity: 0.9; } } .fullscreen-controls { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; align-items: center; } .action-btn { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border: none; padding: 1rem 2rem; border-radius: 0.5rem; font-weight: 600; font-size: 1rem; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3); &:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(102, 126, 234, 0.4); } &:active { transform: translateY(0); } } .preset-btn { background: rgba(255, 255, 255, 0.1); border: 2px solid rgba(255, 255, 255, 0.2); color: var(--primary-700, #475569); padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-weight: 500; cursor: pointer; transition: all 0.3s ease; backdrop-filter: blur(10px); &:hover { background: rgba(255, 255, 255, 0.2); border-color: rgba(255, 255, 255, 0.4); transform: translateY(-1px); } &:active { transform: translateY(0); } } } // Responsive adjustments @media (max-width: 768px) { .backgrounds-demo { padding: 1rem; .demo-header h1 { font-size: 2rem; } .example-grid { grid-template-columns: 1fr; } .pattern-grid { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); } .gradient-grid { grid-template-columns: 1fr; } .interactive-demo { padding: 2rem; .controls { flex-direction: column; width: 100%; } } .fullscreen-controls { flex-direction: column; } } } // Dark mode support @media (prefers-color-scheme: dark) { .backgrounds-demo { .demo-header h1 { color: var(--neutral-100, #f8fafc); } .demo-section h2 { color: var(--neutral-200, #e2e8f0); border-bottom-color: var(--primary-700, #475569); } .preset-btn { color: var(--neutral-200, #e2e8f0); } } } // High contrast mode @media (prefers-contrast: high) { .backgrounds-demo { .demo-card, .pattern-demo, .gradient-demo, .interactive-demo { border: 2px solid rgba(0, 0, 0, 0.8); } } } // Reduced motion @media (prefers-reduced-motion: reduce) { .backgrounds-demo { * { transition: none !important; animation: none !important; } } }t#x..@use '../../../../../}7x#import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BackgroundDirective } from '../../../../../ui-backgrounds/src/lib/directives/background.directive'; import { SolidBackgroundComponent } from '../../../../../ui-backgrounds/src/lib/components/backgrounds/solid-background.component'; import { GradientBackgroundComponent } from '../../../../../ui-backgrounds/src/lib/components/backgrounds/gradient-background.component'; import { PatternBackgroundComponent } from '../../../../../ui-backgrounds/src/lib/components/backgrounds/pattern-background.component'; import { ImageBackgroundComponent } from '../../../../../ui-backgrounds/src/lib/components/backgrounds/image-background.component'; import { LinearGradientConfig, PatternConfig, SolidBackgroundConfig } from '../../../../../ui-backgrounds/src/lib/types/background.types'; import { BackgroundService } from '../../../../../ui-backgrounds/src/lib/services/background.service'; @Component({ selector: 'app-backgrounds-demo', standalone: true, imports: [ CommonModule, BackgroundDirective, SolidBackgroundComponent, GradientBackgroundComponent, PatternBackgroundComponent, ImageBackgroundComponent ], template: `

UI Backgrounds Demo

Explore different background types and configurations

Background Directive Examples

Solid Background

Using the background directive with solid color

Linear Gradient

Beautiful gradient backgrounds

Pattern Background

Geometric patterns

Background Components

Solid Component

Green background using component

Gradient Component

Purple to cyan gradient

Pattern Component

Orange dots pattern

Pattern Showcase

{{ pattern }}

Gradient Types

Linear Gradient Radial Gradient Conic Gradient

Interactive Background

Interactive Background Demo

Click buttons to change the background

Full Screen Backgrounds

`, styleUrl: './backgrounds-demo.component.scss' }) export class BackgroundsDemoComponent { private readonly backgroundService = signal(new BackgroundService()); private fullScreenBackgroundId = signal(null); // Configuration signals solidConfig = signal({ type: 'solid', color: '#3b82f6' }); gradientConfig = signal({ type: 'linear-gradient', direction: 'to bottom right', colors: [ { color: '#ec4899' }, { color: '#8b5cf6' } ] }); patternConfig = signal({ type: 'pattern', pattern: 'grid', primaryColor: '#1f2937', secondaryColor: 'transparent', size: 20, opacity: 0.3 }); interactiveConfig = signal(this.solidConfig()); // Pattern list for showcase patterns = [ 'dots', 'grid', 'stripes', 'diagonal-stripes', 'chevron', 'waves', 'circles', 'checkerboard' ]; // Preset configurations presetConfigs = [ { name: 'Ocean', config: { type: 'linear-gradient' as const, direction: 'to bottom', colors: [{ color: '#667eea' }, { color: '#764ba2' }] } }, { name: 'Sunset', config: { type: 'linear-gradient' as const, direction: 'to right', colors: [{ color: '#ff6b6b' }, { color: '#feca57' }] } }, { name: 'Forest', config: { type: 'solid' as const, color: '#10b981' } }, { name: 'Dots', config: { type: 'pattern' as const, pattern: 'dots' as const, primaryColor: '#6366f1', secondaryColor: 'transparent', size: 25, opacity: 0.6 } } ]; // Full screen presets fullScreenPresets = [ { name: 'Purple Mesh', config: { type: 'linear-gradient' as const, direction: 'to bottom right', colors: [{ color: '#667eea' }, { color: '#764ba2' }, { color: '#f093fb' }] } }, { name: 'Geometric', config: { type: 'pattern' as const, pattern: 'chevron' as const, primaryColor: '#1f2937', secondaryColor: 'transparent', size: 40, opacity: 0.1 } } ]; getPatternConfig(pattern: string): PatternConfig { return { type: 'pattern', pattern: pattern as any, primaryColor: '#6366f1', secondaryColor: 'transparent', size: 25, opacity: 0.4 }; } setInteractiveConfig(preset: any) { this.interactiveConfig.set(preset.config); } toggleFullScreenBackground() { const currentId = this.fullScreenBackgroundId(); if (currentId) { this.backgroundService().removeBackground(currentId); this.fullScreenBackgroundId.set(null); } } setFullScreenBackground(preset: any) { // Remove existing full screen background const currentId = this.fullScreenBackgroundId(); if (currentId) { this.backgroundService().removeBackground(currentId); } // Add new full screen background const id = this.backgroundService().applyFullScreenBackground(preset.config, { zIndex: -1 }); this.fullScreenBackgroundId.set(id); } hasFullScreenBg() { return this.fullScreenBackgroundId() !== null; } }'bN 'xqBSbrvzQ~i^KfQjrIfYXɵ,|& #Eeɩ s~^Zf:Hbqg# $(!㙛V!(?WA4S7 .Wn<;ximport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BadgeComponent } from '../../../../../ui-essentials/src/lib/components/data-display/badge/badge.component'; @Component({ selector: 'ui-badge-demo', standalone: true, imports: [ CommonModule, BadgeComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Badge Component Showcase

Size Variants

Extra Small

XS

Small

Small

Medium

Medium

Large

Large

Color Variants

Default Primary Secondary Success Warning Danger Info

Shape Variants

Pill Shape

Pill

Rounded

Rounded

Square

Square

Dot Badges

Usage Examples

Basic Badge:

<ui-badge variant="success" size="md">
  Active
</ui-badge>

Dot Badge:

<ui-badge 
  variant="warning"
  [isDot]="true"
  ariaLabel="Warning status">
</ui-badge>

Custom Shape:

<ui-badge 
  variant="danger"
  shape="square"
  size="lg"
  title="Critical status">
  Critical
</ui-badge>
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } `] }) export class BadgeDemoComponent { // Simple demo with no interactive functionality for now }W.jxRsµτE YxS import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BentoGridComponent, BentoGridItemComponent } from 'ui-essentials'; @Component({ selector: 'ui-bento-grid-demo', standalone: true, imports: [CommonModule, BentoGridComponent, BentoGridItemComponent], template: `

Bento Grid Demo

Basic Bento Grid

Basic grid item with regular content. This is a featured item that spans 2 columns and 2 rows. Another regular item without header. This item spans 2 columns wide. This item spans 2 rows tall. Regular item Regular item Large featured item spanning 3 columns and 2 rows. Regular item Regular item

Fixed Column Grids

4 Columns

Item 1 Item 2 (2 cols) Item 3 Item 4 Item 5 (3 cols) Item 6

6 Columns

@for (item of sixColumnItems; track item.id) { {{ item.content }} }

Gap Sizes

@for (gap of gaps; track gap) {

Gap: {{ gap }}

Item A Item B Item C Item D (2 cols) Item E
}

Featured Item Sizes

2×1 featured item Regular Regular 2×2 featured item Regular Regular Regular 3×2 featured item Regular Regular

Interactive Items

Interactive primary item Wide interactive item Featured interactive item Static item Static item @if (lastClicked) {

Last clicked: {{ lastClicked }}

}

Row Heights

@for (rowHeight of rowHeights; track rowHeight) {

Rows: {{ rowHeight }}

Small content Longer content that might need more space depending on the row height setting. Tall item Wide item
}
`, styleUrl: './bento-grid-demo.component.scss' }) export class BentoGridDemoComponent { gaps = ['xs', 'sm', 'md', 'lg'] as const; rowHeights = ['sm', 'md', 'lg'] as const; lastClicked = ''; sixColumnItems = [ { id: 1, colSpan: 2, rowSpan: 1, variant: 'primary', header: 'Wide', content: '2×1 item' }, { id: 2, colSpan: 1, rowSpan: 2, variant: 'secondary', header: 'Tall', content: '1×2 item' }, { id: 3, colSpan: 1, rowSpan: 1, variant: 'default', header: '', content: 'Regular' }, { id: 4, colSpan: 2, rowSpan: 1, variant: 'elevated', header: 'Featured', content: '2×1 item' }, { id: 5, colSpan: 1, rowSpan: 1, variant: 'default', header: '', content: 'Regular' }, { id: 6, colSpan: 3, rowSpan: 1, variant: 'primary', header: 'Extra Wide', content: '3×1 item' }, { id: 7, colSpan: 1, rowSpan: 1, variant: 'default', header: '', content: 'Regular' }, { id: 8, colSpan: 2, rowSpan: 2, variant: 'elevated', header: 'Large', content: '2×2 featured' }, { id: 9, colSpan: 1, rowSpan: 1, variant: 'default', header: '', content: 'Regular' }, { id: 10, colSpan: 1, rowSpan: 1, variant: 'default', header: '', content: 'Regular' }, ] as const; handleItemClick(type: string): void { this.lastClicked = type; console.log('Bento grid item clicked:', type); } }cjoIx-nKG'P8A\A?U x@use '../../../../../ui-design-system/src/styles/semantic/index' as *; .demo-container { padding: $semantic-spacing-layout-section-md; max-width: 1200px; margin: 0 auto; h2 { font-family: map-get($semantic-typography-heading-h2, font-family); font-size: map-get($semantic-typography-heading-h2, font-size); font-weight: map-get($semantic-typography-heading-h2, font-weight); line-height: map-get($semantic-typography-heading-h2, line-height); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-layout-section-lg; } } .demo-section { margin-bottom: $semantic-spacing-layout-section-xl; h3 { font-family: map-get($semantic-typography-heading-h3, font-family); font-size: map-get($semantic-typography-heading-h3, font-size); font-weight: map-get($semantic-typography-heading-h3, font-weight); line-height: map-get($semantic-typography-heading-h3, line-height); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-layout-section-md; } h4 { font-family: map-get($semantic-typography-heading-h4, font-family); font-size: map-get($semantic-typography-heading-h4, font-size); font-weight: map-get($semantic-typography-heading-h4, font-weight); line-height: map-get($semantic-typography-heading-h4, line-height); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-sm; } } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: $semantic-spacing-grid-gap-lg; } .demo-column { display: flex; flex-direction: column; gap: $semantic-spacing-layout-section-md; } .demo-item { padding: $semantic-spacing-component-lg; border: $semantic-border-width-1 solid $semantic-color-border-secondary; border-radius: $semantic-border-card-radius; background: $semantic-color-surface-primary; } .demo-controls { display: flex; gap: $semantic-spacing-component-sm; margin-bottom: $semantic-spacing-component-md; flex-wrap: wrap; } .demo-button { padding: $semantic-spacing-interactive-button-padding-y $semantic-spacing-interactive-button-padding-x; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-button-radius; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-family: map-get($semantic-typography-button-medium, font-family); font-size: map-get($semantic-typography-button-medium, font-size); font-weight: map-get($semantic-typography-button-medium, font-weight); line-height: map-get($semantic-typography-button-medium, line-height); cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; min-height: $semantic-sizing-button-height-md; &:hover { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } } // Responsive Design @media (max-width: ($semantic-breakpoint-lg - 1)) { .demo-grid { grid-template-columns: 1fr; } } @media (max-width: ($semantic-breakpoint-md - 1)) { .demo-container { padding: $semantic-spacing-layout-section-sm; } .demo-section { margin-bottom: $semantic-spacing-layout-section-lg; } .demo-item { padding: $semantic-spacing-component-md; } } @media (max-width: ($semantic-breakpoint-sm - 1)) { .demo-controls { flex-direction: column; } .demo-button { width: 100%; } }%Rx+cH-bottom: 120px; // Extra space to accommodate bottom navigation examples9Flg; } .demo-rowz7,lg; flex-wrap: wrap; &--vertical { ?#@md; } } .demo-item { flex: 1; min-width: 300px; h4 {&j 2 3OF} } .demo-bottom-nav-container { position: relative; height: 80px( secondaryoradius-md; overflow: hidden; a-md; // Override the fixed positioning for demo purposes :deep(.ui-bottom-navigation) { position: absolute !important?; bottom: 0; left: 0; right: 0; } } .demo-info {'elevatedCubtle$ radius-sm; M -marginpmd 0; p { margin: 0 0qxs 0. * body-medium<body , body-mediumQ>bodyN Y &:last-child { margin-bottom: 0; } strong { font-weight: 1font-weight-semibold; 0 } }hOy K  border: none5g b // Typography ,  : &:hover { box-shadow: $semantic-shadow-button-hover h &:active { box-shadow: $semantic-shadow-button-rest; transform: translateY(1px); } &.active { backgrounecond+ #secondary; } } // Responsive adjustments @media (max-width: $semantic-breakpoint-sm - 1) { .demo-row { flex-direction:P /} .demo-item { min-width: auto; } ^(*Xx[:ElgvJcontent-heading; } } .demo-row { display: flex; align-items: center%.>n 3, line-height); 2!"content-heading; border-bottom1/ padding+ } h4 {? 2!. sm; }:5layout-section-md; flex-wrap: wrap; } .demo-column'<.ui-tree-view { max-height: 300px; overflow-y: auto;Se1=prim' Q$ " text-primary i+  R# = & } } .demo-info { margin-top$. sm;N'*!border-left: 4px primary; 1small ; ody-small ; ody-small. =ody-small, line-height)  text-secondary; strong { 2"5 Design )md< 4+( .demo-column { min-width: unset justify-content: center; } }$0rxR͎0VZnUov b)U%N N$ǎliYp@*gH9 x8p↓hoXf~S~I^yu \dw|\ka(3F&Bl`3.+)+3/\MT (3IJ С9E1R~if@"f*(MӘwy3ȦBNTjY0'CXntt-W]F60~1%@h ㅅΡL6[MZwgM<\зiH 뎆Zᜳ{qc)Y(y dQ3zZWN^}P˖HJiZnnKmXٗvS$xV'import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faHome, faSearch, faUser, faHeart, faCog, faShoppingCart, faBell, faBookmark } from '@fortawesome/free-solid-svg-icons'; import { BottomNavigationComponent, BottomNavigationItem } from '../../../../../ui-essentials/src/lib/components/navigation/bottom-navigation'; @Component({ selector: 'ui-bottom-navigation-demo', standalone: true, imports: [CommonModule, BottomNavigationComponent, FontAwesomeModule], template: `

Bottom Navigation Demo

Sizes

@for (size of sizes; track size) {

{{ size.toUpperCase() }} Size

}

Variants

@for (variant of variants; track variant) {

{{ variant.charAt(0).toUpperCase() + variant.slice(1) }} Variant

}

With Badges

States

Elevated

With Disabled Item

Interactive Example

Active Item: {{ getActiveItemLabel() }}

Click Count: {{ clickCount }}

Last Clicked: {{ lastClickedItem || 'None' }}

`, styleUrl: './bottom-navigation-demo.component.scss' }) export class BottomNavigationDemoComponent { // FontAwesome icons faHome = faHome; faSearch = faSearch; faUser = faUser; faHeart = faHeart; faCog = faCog; faShoppingCart = faShoppingCart; faBell = faBell; faBookmark = faBookmark; // Demo data sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'primary', 'secondary'] as const; // Active item tracking for different variants activeItemIds: Record = { sm: 'home', md: 'home', lg: 'home', default: 'home', primary: 'home', secondary: 'home' }; badgeActiveItemId = 'home'; elevatedActiveItemId = 'home'; disabledActiveItemId = 'home'; interactiveActiveItemId = 'home'; // Interactive demo state clickCount = 0; lastClickedItem = ''; isHidden = false; heartBadgeCount = 3; // Item configurations basicItems: BottomNavigationItem[] = [ { id: 'home', label: 'Home', icon: 'home' }, { id: 'search', label: 'Search', icon: 'search' }, { id: 'profile', label: 'Profile', icon: 'profile' }, { id: 'settings', label: 'Settings', icon: 'settings' } ]; itemsWithBadges: BottomNavigationItem[] = [ { id: 'home', label: 'Home', icon: 'home' }, { id: 'cart', label: 'Cart', icon: 'cart', badge: 2 }, { id: 'notifications', label: 'Alerts', icon: 'notifications', badge: '99+' }, { id: 'saved', label: 'Saved', icon: 'saved', badge: 15 }, { id: 'profile', label: 'Profile', icon: 'profile' } ]; itemsWithDisabled: BottomNavigationItem[] = [ { id: 'home', label: 'Home', icon: 'home' }, { id: 'search', label: 'Search', icon: 'search', disabled: true }, { id: 'profile', label: 'Profile', icon: 'profile' }, { id: 'settings', label: 'Settings', icon: 'settings' } ]; get interactiveItems(): BottomNavigationItem[] { return [ { id: 'home', label: 'Home', icon: 'home' }, { id: 'search', label: 'Search', icon: 'search' }, { id: 'favorites', label: 'Favorites', icon: 'favorites', badge: this.heartBadgeCount > 0 ? this.heartBadgeCount : undefined }, { id: 'profile', label: 'Profile', icon: 'profile' } ]; } handleActiveItemChange(context: string, itemId: string): void { this.activeItemIds[context] = itemId; } handleItemClick(item: BottomNavigationItem): void { console.log('Item clicked:', item); } handleInteractiveItemChange(itemId: string): void { this.interactiveActiveItemId = itemId; } handleInteractiveItemClick(item: BottomNavigationItem): void { this.clickCount++; this.lastClickedItem = item.label; console.log('Interactive item clicked:', item); } getActiveItemLabel(): string { const activeItem = this.interactiveItems.find(item => item.id === this.interactiveActiveItemId); return activeItem?.label || 'None'; } toggleHidden(): void { this.isHidden = !this.isHidden; // In a real implementation, you would update the hidden property of the navigation // For demo purposes, this just toggles a state variable } incrementBadge(): void { this.heartBadgeCount++; } }űx>import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BoxComponent } from '../../../../../ui-essentials/src/lib/components/layout/box'; @Component({ selector: 'ui-box-demo', standalone: true, imports: [CommonModule, BoxComponent], template: `

Box Component Demo

Padding Utilities

@for (spacing of spacings; track spacing) {

p="{{ spacing }}"

Content with {{ spacing }} padding
}

Directional Padding

px="lg" (horizontal)

Horizontal padding

py="lg" (vertical)

Vertical padding

pt="xl" pb="sm"

Mixed padding

Margin Utilities

@for (spacing of marginSpacings; track spacing) { m="{{ spacing }}" }

Display Options

display="flex"

Item 1
Item 2
Item 3

display="grid"

A
B
C
D

display="inline-block"

Box 1 Box 2 Box 3

Visual Styles

Basic

Basic box

With Border

Bordered box

Rounded

Rounded box

With Shadow

Shadow box

All Styles

Full styled

Complex Layout Example

Card Header
Left column content with some text that wraps nicely.
Right column with border and padding.
Footer with top border only
`, styleUrl: './box-demo.component.scss' }) export class BoxDemoComponent { spacings = ['xs', 'sm', 'md', 'lg', 'xl'] as const; marginSpacings = ['xs', 'sm', 'md', 'lg'] as const; }Vx'import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { BreakpointContainerComponent } from '../../../../../ui-essentials/src/lib/components/layout/breakpoint-container'; @Component({ selector: 'ui-breakpoint-container-demo', standalone: true, imports: [CommonModule, BreakpointContainerComponent], template: `

Breakpoint Container Demo

This component shows/hides content based on screen size. Resize your browser to see the effects.

Basic Visibility Controls

Always Visible

Always visible content

Mobile Only (< 768px)

Only visible on mobile devices

Tablet Only (768px - 1024px)

Only visible on tablets

Desktop Only (≥ 1024px)

Only visible on desktop

Hidden Variants

Mobile Hidden

Hidden on mobile (< 768px)

Tablet Hidden

Hidden on tablets (768px - 1024px)

Desktop Hidden

Hidden on desktop (≥ 1024px)

Screen Size Based

Mobile Screen (< 640px)

Mobile screen size only

Tablet Screen (640px - 1024px)

Tablet screen size only

Desktop Screen (≥ 1024px)

Desktop screen size only

Range Based Visibility

Small to Medium (640px - 768px)

Visible between small and medium breakpoints

Medium to Large (768px - 1024px)

Visible between medium and large breakpoints

Custom Breakpoint Rules

Show from Small (≥ 640px)

Visible from small breakpoint and up

Hide from Medium (≥ 768px)

Hidden from medium breakpoint and up

Show from Large (≥ 1024px)

Visible from large breakpoint and up

Display Types

Block Display (Default)

Block display (default)

Inline Display

This is inline text with desktop-only inline content continuing after.

Flex Display

Flex Item 1
Flex Item 2

Print Media

Print Hidden

This content is hidden when printing

Print Only

This content only appears when printing

Interactive Test

Current viewport info: Resize your browser window to test different breakpoints.

📱 Mobile Screen (< 640px)
📟 Tablet Screen (640px - 1024px)
🖥️ Desktop Screen (≥ 1024px)

Test Instructions:

  • Resize your browser window to see different content appear/disappear
  • Try the print preview to see print-specific content
  • Different display types maintain their layout characteristics
`, styleUrl: './breakpoint-container-demo.component.scss' }) export class BreakpointContainerDemoComponent {},> x]nimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { CardComponent, GlassVariant } from '../../../../../ui-essentials/src/lib/components/data-display/card/card.component'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/button.component'; @Component({ selector: 'ui-card-demo', standalone: true, imports: [ CommonModule, CardComponent, ButtonComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Card Component Showcase

Card Variants

Elevated Card

Default elevated card with shadow

This is the most common card variant with a subtle elevation that lifts it above the surface.

Action

Filled Card

Card with background color

Filled cards use background color to separate content from the surrounding surface.

Action

Outlined Card

Card with border emphasis

Outlined cards use borders to separate content while maintaining a clean appearance.

Action

Size Variants

Small Card

Compact card for minimal content.

Small

Medium Card

Standard card size for most use cases with balanced spacing.

Medium

Large Card

Spacious card for detailed content with generous padding and larger typography.

Large

Elevation Variants

None

No shadow
Small

Subtle shadow
Medium

Moderate shadow
Large

Prominent shadow
Extra Large

Deep shadow

Corner Radius Variants

No Radius

Sharp corners
Small

Subtle rounding
Medium

Standard rounding
Large

Generous rounding
Full

Circle

Interactive States

Clickable Card

Click me!

This card responds to clicks and has hover effects. Try clicking or focusing with keyboard.

Disabled Card

Cannot interact

This card is disabled and cannot be interacted with.

Disabled

Glass Effect Variants

Glass morphism effects using semantic design tokens from the shared-ui library. Each variant offers different levels of transparency and blur effects.

Translucent Glass

Ultra-light transparency

Barely visible background with subtle blur effect for minimal visual interference. Perfect for overlays that need to preserve background visibility.

Translucent

Light Glass

Gentle transparency

Gentle glass effect that maintains excellent readability while adding modern depth. Ideal for cards that need subtle separation from background.

Light

Medium Glass

Balanced effect

Perfect balance between visibility and glass morphism effect. The most versatile variant suitable for most interface components.

Medium

Heavy Glass

Strong presence

Prominent glass effect with substantial background presence. Great for important UI elements that need to stand out prominently.

Heavy

Frosted Glass

Maximum opacity with enhanced blur

Nearly opaque with enhanced blur for a true frosted glass appearance. Perfect for modals, overlays, and primary interface panels.

Frosted

Interactive Glass Cards

Glass effects with full interactivity, smooth animations, and hover states.

Clickable Light Glass

Interactive with smooth animations

Click me! Light glass variant with full interactivity and animation support. Features hover effects and touch feedback.

Clickable Heavy Glass

Strong glass with responsive feedback

Heavy glass variant combining strong visual presence with responsive interactions. Perfect for call-to-action cards and important interactive elements.

Balanced Interactive Glass

Medium glass with keyboard navigation

Medium glass effect with complete accessibility support including keyboard navigation, focus states, and screen reader compatibility.

Glass Implementation Details

Enhanced Glass System: All glass effects now use semantic design tokens from the shared-ui library, ensuring consistent theming, better performance, and improved browser compatibility.

  • Semantic Tokens: Uses @include glass-{{ '{' }}variant{{ '}' }}(true) mixins
  • Animation Support: Built-in smooth transitions and hover effects
  • Accessibility: Proper focus states and keyboard navigation
  • Browser Support: Automatic fallbacks for older browsers
  • Performance: Optimized with will-change and isolation

Background Layer Cards

Gradient Background

Beautiful gradient overlay

This card has a gradient background layer that creates visual depth and interest.

Action

Pattern Background

Custom pattern design

Click me! Cards can have complex patterns and remain fully interactive with proper layering.

Usage Examples

Basic Card:

<ui-card variant="elevated" size="md" elevation="sm" radius="md">
  <div slot="header">
    <h4>Card Title</h4>
    <p>Card subtitle</p>
  </div>
  <p>Card content goes here</p>
  <div slot="footer">
    <ui-button variant="filled">Action</ui-button>
  </div>
</ui-card>

Interactive Card:

<ui-card 
  variant="elevated" 
  [clickable]="true"
  (cardClick)="handleCardClick($event)">
  <p>Click me!</p>
</ui-card>

Glass Effect Card:

<ui-card 
  variant="elevated" 
  [glass]="true"
  glassVariant="medium"
  elevation="md"
  radius="lg">
  <p>Glass morphism effect with semantic tokens</p>
</ui-card>

Glass Variant Examples:

<!-- All glass variants using semantic design tokens -->
<ui-card [glass]="true" glassVariant="translucent">Ultra-light transparency</ui-card>
<ui-card [glass]="true" glassVariant="light">Gentle glass effect</ui-card>
<ui-card [glass]="true" glassVariant="medium">Balanced glass morphism</ui-card>
<ui-card [glass]="true" glassVariant="heavy">Strong visual presence</ui-card>
<ui-card [glass]="true" glassVariant="frosted">Maximum opacity with blur</ui-card>

Interactive Glass Card:

<ui-card 
  variant="elevated" 
  [glass]="true"
  glassVariant="light"
  [clickable]="true"
  (cardClick)="handleCardClick($event)"
  elevation="lg"
  radius="lg">
  <p>Clickable glass card with animations</p>
</ui-card>

Background Layer Card:

<ui-card 
  variant="elevated" 
  [hasBackgroundLayer]="true"
  [hasHeader]="true">
  <div slot="background">
    <!-- Background content -->
  </div>
  <div slot="header">
    <h4>Card with Background</h4>
  </div>
  <p>Content over background</p>
</ui-card>

Interactive Actions

@if (lastAction) {
Last action: {{ lastAction }}
}
Reset Demo Show Alert
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } `] }) export class CardDemoComponent { lastAction: string = ''; handleClick(buttonType: string): void { this.lastAction = `Button clicked: ${buttonType}`; console.log(`Button clicked: ${buttonType}`); } handleCardClick(cardType: string): void { this.lastAction = `Card clicked: ${cardType}`; console.log(`Card clicked: ${cardType}`); } showAlert(message: string): void { alert(message); this.lastAction = 'Alert shown'; } resetDemo(): void { this.lastAction = ''; console.log('Demo reset'); } },wx`}c import { TextP&text-button.component'; import { GhostP%ghost-button.component'; import { FabJfab.component'; import { SimplePsimple-button.component'; import { faDownload, faPlus, faShare, faHeart, faBookmark, faEdit, faTrash, ffaSave, faArrowRight, faArrowLeft, faSearch, faUpload } from '@fortawesome/free-solid-svg-icons]!button?aButtonComponent, TextButtonComponent, GhostButtonComponent, FabComponent, SimpleButtonY+ Filled ButtI Filled Button$PW3VW+P= $ filled H & filledn !2 filled0I PW3VW+P=3t [loading]="true">LoadingW+[fullWidth]="false">Full WidthW $ Tonal ButtI Tonal Button$PW3VW+P=, small tona !tonal@ . tonaln !tonal, tonal0I PW3gap: 1rem; flex-wrap: wrap;"> tonal1t tonal" [loading]="true">LoadingW $ Outlined ButtIOutlined Button$PW3VW+P=?small outlined $H & outlinedn !$ $ outlined0I PW3gap: 1rem; flex-wrap: wrap;"> (3t [loading]="true">LoadingW $ Text Button 00A Text Button$PW3VW+P= text-button&small text')">SmallMediumLarge A PW37gap: 1rem; flex-wrap: wrap;"> LoadingSmallMediumLarge A PW38gap: 1rem; flex-wrap: wrap;"> LoadingFull Width 💡

Carousel Component Demo

Size Variants

Small

Medium

Large

Variant Types

Image Carousel

Card Carousel

Content Carousel

Transition Effects

Slide

Fade

Scale

Indicator Styles

Dots

Bars

Thumbnails

Special Features

Autoplay

No Loop

Disabled

Interactive Example

Current slide: {{ currentSlide + 1 }} of {{ interactiveItems.length }}

@if (lastClickedItem) {

Last clicked: {{ lastClickedItem.title }}

}
`, styleUrl: './carousel-demo.component.scss' }) export class CarouselDemoComponent { currentSlide = 0; lastClickedItem: CarouselItem | null = null; imageItems: CarouselItem[] = [ { id: 1, imageUrl: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&h=400&fit=crop', title: 'Mountain Landscape', subtitle: 'Serene mountain views' }, { id: 2, imageUrl: 'https://images.unsplash.com/photo-1501594907352-04cda38ebc29?w=800&h=400&fit=crop', title: 'Ocean Waves', subtitle: 'Peaceful ocean scenery' }, { id: 3, imageUrl: 'https://images.unsplash.com/photo-1441974231531-c6227db76b6e?w=800&h=400&fit=crop', title: 'Forest Path', subtitle: 'Mystical forest trail' }, { id: 4, imageUrl: 'https://images.unsplash.com/photo-1501436513145-30f24e19fcc4?w=800&h=400&fit=crop', title: 'Desert Sunset', subtitle: 'Golden desert landscape' } ]; cardItems: CarouselItem[] = [ { id: 1, imageUrl: 'https://images.unsplash.com/photo-1460925895917-afdab827c52f?w=400&h=200&fit=crop', title: 'Analytics Dashboard', subtitle: 'Data Visualization', content: 'Powerful analytics tools to understand your business metrics and make data-driven decisions.' }, { id: 2, imageUrl: 'https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=400&h=200&fit=crop', title: 'Team Collaboration', subtitle: 'Productivity Tools', content: 'Enhanced collaboration features to keep your team connected and productive from anywhere.' }, { id: 3, imageUrl: 'https://images.unsplash.com/photo-1563207153-f403bf289096?w=400&h=200&fit=crop', title: 'Mobile Experience', subtitle: 'Cross-Platform', content: 'Seamless experience across all devices with our responsive design and mobile optimization.' } ]; contentItems: CarouselItem[] = [ { id: 1, title: 'Welcome to Our Platform', subtitle: 'Getting Started Guide', content: 'Discover amazing features and capabilities that will transform the way you work and collaborate with your team.' }, { id: 2, title: 'Advanced Features', subtitle: 'Power User Tips', content: 'Unlock the full potential of our platform with advanced features designed for professional workflows.' }, { id: 3, title: 'Success Stories', subtitle: 'Customer Testimonials', content: 'Join thousands of satisfied customers who have achieved remarkable results using our solutions.' } ]; thumbnailItems: CarouselItem[] = [ { id: 1, imageUrl: 'https://images.unsplash.com/photo-1517180102446-f3ece451e9d8?w=800&h=400&fit=crop', thumbnail: 'https://images.unsplash.com/photo-1517180102446-f3ece451e9d8?w=100&h=60&fit=crop', title: 'Urban Architecture', subtitle: 'Modern city design' }, { id: 2, imageUrl: 'https://images.unsplash.com/photo-1449824913935-59a10b8d2000?w=800&h=400&fit=crop', thumbnail: 'https://images.unsplash.com/photo-1449824913935-59a10b8d2000?w=100&h=60&fit=crop', title: 'Natural Beauty', subtitle: 'Landscape photography' }, { id: 3, imageUrl: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&h=400&fit=crop', thumbnail: 'https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=100&h=60&fit=crop', title: 'Mountain Vista', subtitle: 'Alpine scenery' } ]; interactiveItems: CarouselItem[] = [ { id: 1, imageUrl: 'https://images.unsplash.com/photo-1557804506-669a67965ba0?w=400&h=200&fit=crop', title: 'Project Alpha', subtitle: 'Innovation Hub', content: 'Revolutionary project management tools designed to streamline your workflow and boost productivity.' }, { id: 2, imageUrl: 'https://images.unsplash.com/photo-1552664730-d307ca884978?w=400&h=200&fit=crop', title: 'Team Dynamics', subtitle: 'Collaboration Suite', content: 'Advanced collaboration features that bring teams together, regardless of location or time zone.' }, { id: 3, imageUrl: 'https://images.unsplash.com/photo-1504384308090-c894fdcc538d?w=400&h=200&fit=crop', title: 'Data Insights', subtitle: 'Analytics Platform', content: 'Comprehensive analytics and reporting tools to help you make informed business decisions.' } ]; handleSlideChange(index: number): void { this.currentSlide = index; console.log('Slide changed to:', index); } handleItemClick(event: {item: CarouselItem, index: number}): void { this.lastClickedItem = event.item; console.log('Item clicked:', event); } }z3ئjx7x«5 x*export * from './carousel-demo.component';=xF@use "../../../../../ui-design-system/src/styles/semantic" as *; // ========================================================================== // VIDEO PLAYER DEMO COMPONENT // ========================================================================== // Demonstration component showcasing all video player variants and capabilities // ========================================================================== .video-player-demo { padding: $semantic-spacing-layout-lg; max-width: 1200px; margin: 0 auto; h2 { color: $semantic-color-text-primary; font-family: map-get($semantic-typography-heading-h1, font-family); font-size: map-get($semantic-typography-heading-h1, font-size); font-weight: map-get($semantic-typography-heading-h1, font-weight); line-height: map-get($semantic-typography-heading-h1, line-height); margin-bottom: $semantic-spacing-layout-section-sm; border-bottom: 2px solid $semantic-color-primary; padding-bottom: $semantic-spacing-component-xs; } h3 { color: $semantic-color-text-secondary; font-family: map-get($semantic-typography-heading-h2, font-family); font-size: map-get($semantic-typography-heading-h2, font-size); font-weight: map-get($semantic-typography-heading-h2, font-weight); line-height: map-get($semantic-typography-heading-h2, line-height); margin-bottom: $semantic-spacing-content-heading; } h4 { color: $semantic-color-text-tertiary; font-family: map-get($semantic-typography-heading-h3, font-family); font-size: map-get($semantic-typography-heading-h3, font-size); font-weight: map-get($semantic-typography-heading-h3, font-weight); line-height: map-get($semantic-typography-heading-h3, line-height); margin-bottom: $semantic-spacing-content-paragraph; } .demo-section { border: 1px solid $semantic-color-border-primary; border-radius: $semantic-border-radius-lg; padding: $semantic-spacing-component-xl; background: $semantic-color-surface-secondary; margin-bottom: $semantic-spacing-layout-md; &:last-child { margin-bottom: 0; } } .variant-demo { margin-bottom: $semantic-spacing-component-lg; &:last-child { margin-bottom: 0; } } .player-container { border: 1px solid $semantic-color-border-secondary; border-radius: $semantic-border-radius-md; overflow: hidden; margin-bottom: $semantic-spacing-component-md; background: $semantic-color-surface-primary; } .demo-description { margin-bottom: $semantic-spacing-content-heading; color: $semantic-color-text-tertiary; font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); } .controls-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: $semantic-spacing-component-md; margin-bottom: $semantic-spacing-component-lg; padding: $semantic-spacing-component-md; background: $semantic-color-surface-container; border-radius: $semantic-border-radius-md; } .control-label { display: flex; align-items: center; gap: $semantic-spacing-component-xs; cursor: pointer; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); user-select: none; color: $semantic-color-text-primary; input[type="checkbox"] { margin: 0; accent-color: $semantic-color-primary; } } .select-controls { display: flex; gap: $semantic-spacing-component-lg; margin-bottom: $semantic-spacing-component-lg; flex-wrap: wrap; } .select-label { display: flex; align-items: center; gap: $semantic-spacing-component-xs; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); color: $semantic-color-text-primary; } .demo-select { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; border: 1px solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); &:focus { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } } .event-display { margin-top: $semantic-spacing-component-md; padding: $semantic-spacing-component-md; background: $semantic-color-primary-container; border: 1px solid $semantic-color-primary; border-radius: $semantic-border-radius-sm; color: $semantic-color-text-primary; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } .code-examples { background: $semantic-color-surface-container; padding: $semantic-spacing-component-xl; border-radius: $semantic-border-radius-md; border-left: 4px solid $semantic-color-primary; } .code-example { margin-bottom: $semantic-spacing-component-lg; &:last-child { margin-bottom: 0; } h4 { margin-bottom: $semantic-spacing-component-sm; } pre { background: $semantic-color-surface-primary; padding: $semantic-spacing-component-md; border-radius: $semantic-border-radius-sm; overflow-x: auto; border: 1px solid $semantic-color-border-secondary; code { font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace; font-size: map-get($semantic-typography-code-block, font-size); line-height: map-get($semantic-typography-code-block, line-height); color: $semantic-color-text-primary; } } } } // Responsive adjustments @media (max-width: 768px) { .video-player-demo { padding: $semantic-spacing-layout-md; .controls-grid { grid-template-columns: 1fr; } .select-controls { flex-direction: column; gap: $semantic-spacing-component-md; } } }!8Gxit(gqFbQjniF)RQximport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { CenterComponent } from '../../../../../ui-essentials/src/lib/components/layout/center'; @Component({ selector: 'ui-center-demo', standalone: true, imports: [CommonModule, CenterComponent], template: `

Center Demo

Center Axis

Both Axes (Default)

Centered Both Ways

Horizontal Only

Centered Horizontally

Vertical Only

Centered Vertically

Max Width Constraints

Small (640px)

This content is constrained to a maximum width of 640px and will be centered within its container. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.

Medium (768px)

This content is constrained to a maximum width of 768px and will be centered within its container. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Large (1024px)

This content is constrained to a maximum width of 1024px and will be centered within its container. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

Spacing

Small Padding

Small Padding

Medium Padding

Medium Padding

Large Padding

Large Padding

Inline Center

Here is some text with an inline centered element in the middle of the paragraph.

Practical Examples

Card Layout

Welcome Message

This card is centered with constrained width for better readability.

Loading State

Loading...

Hero Section

Hero Title

A compelling hero message that's perfectly centered and constrained for optimal reading.
`, styleUrl: './center-demo.component.scss' }) export class CenterDemoComponent {}xFimport { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { SearchBarComponent, SearchSuggestion } from '../../../../../ui-essentials/src/lib/components/forms/search/search-bar.component'; import { faSearch, faMicrophone, faCamera, faFilter, faUser, faFile, faFolder, faTag, faHeart, faStar } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-search-demo', standalone: true, imports: [ CommonModule, FormsModule, SearchBarComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Search Bar Component Showcase

Basic Search Bars

Size Variants

Style Variants

With Icons

With Suggestions

States

Advanced Features

Interactive Controls

@if (lastAction()) {
Last action: {{ lastAction() }}
}

Code Examples

Basic Usage:

<ui-search-bar 
  placeholder="Search..."
  [(ngModel)]="searchValue"
  (searchChange)="onSearchChange($event)"
  (searchSubmit)="onSearchSubmit($event)">
</ui-search-bar>

With Suggestions:

<ui-search-bar 
  placeholder="Search with suggestions..."
  [suggestions]="suggestions"
  [(ngModel)]="searchValue"
  (suggestionSelect)="onSuggestionSelect($event)">
</ui-search-bar>

With Icons:

<ui-search-bar 
  placeholder="Search with icons..."
  [leadingIcon]="faSearch"
  [trailingIcons]="iconButtons"
  variant="filled"
  size="lg"
  (trailingIconClick)="onIconClick($event)">
</ui-search-bar>

Current Values

{{ getCurrentValues() }}
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(279, 14%, 35%); font-size: 1.2rem; margin-bottom: 0.5rem; } pre { margin: 0; font-family: 'Courier New', monospace; font-size: 0.9rem; line-height: 1.4; } code { color: hsl(279, 14%, 15%); } section { border: 1px solid #e9ecef; padding: 1.5rem; border-radius: 8px; background: #ffffff; } button:hover { opacity: 0.9; transform: translateY(-1px); } `] }) export class SearchDemoComponent { // FontAwesome icons protected readonly faSearch = faSearch; protected readonly faMicrophone = faMicrophone; protected readonly faCamera = faCamera; protected readonly faFilter = faFilter; protected readonly faUser = faUser; protected readonly faFile = faFile; protected readonly faFolder = faFolder; protected readonly faTag = faTag; protected readonly faHeart = faHeart; protected readonly faStar = faStar; // Basic search values basicSearch1 = signal(''); basicSearch2 = signal(''); basicSearch3 = signal(''); // Size variants sizeSmall = signal(''); sizeMedium = signal(''); sizeLarge = signal(''); // Variant styles variantOutlined = signal(''); variantFilled = signal(''); variantElevated = signal(''); // Icon searches iconSearch1 = signal(''); iconSearch2 = signal(''); iconSearch3 = signal(''); // Suggestion searches suggestionSearch1 = signal(''); suggestionSearch2 = signal(''); // State searches stateDisabled = signal('Disabled value'); stateReadonly = signal('Readonly value'); stateError = signal(''); stateHelper = signal(''); // Advanced searches advancedSearch1 = signal(''); advancedSearch2 = signal(''); advancedSearch3 = signal(''); // Control states globalDisabled = signal(false); lastAction = signal(''); // Icon configurations basicTrailingIcons = [ { id: 'mic', icon: faMicrophone, label: 'Voice search', disabled: false } ]; multipleTrailingIcons = [ { id: 'mic', icon: faMicrophone, label: 'Voice search', disabled: false }, { id: 'camera', icon: faCamera, label: 'Image search', disabled: false }, { id: 'filter', icon: faFilter, label: 'Filter results', disabled: false } ]; // Search suggestions suggestions: SearchSuggestion[] = [ { id: '1', text: 'Angular components', icon: faFile }, { id: '2', text: 'TypeScript interfaces', icon: faFile }, { id: '3', text: 'SCSS mixins', icon: faFile }, { id: '4', text: 'Design tokens', icon: faTag }, { id: '5', text: 'Material Design', icon: faHeart }, { id: '6', text: 'Component library', icon: faFolder }, { id: '7', text: 'UI patterns', icon: faStar }, { id: '8', text: 'Accessibility guidelines', icon: faFile } ]; categorizedSuggestions: SearchSuggestion[] = [ { id: '1', text: 'User profile', category: 'Users', icon: faUser }, { id: '2', text: 'Project documentation', category: 'Files', icon: faFile }, { id: '3', text: 'Design system', category: 'Files', icon: faFolder }, { id: '4', text: 'Component library', category: 'Code', icon: faTag }, { id: '5', text: 'UI components', category: 'Code', icon: faTag }, { id: '6', text: 'Admin settings', category: 'Settings', icon: faFilter } ]; onSearchChange(searchId: string, value: string): void { this.lastAction.set(`Search changed: ${searchId} = "${value}"`); console.log(`Search ${searchId} changed:`, value); } onSearchSubmit(searchId: string, value: string): void { this.lastAction.set(`Search submitted: ${searchId} = "${value}"`); console.log(`Search ${searchId} submitted:`, value); } onSuggestionSelect(suggestion: SearchSuggestion): void { this.lastAction.set(`Suggestion selected: "${suggestion.text}" (${suggestion.id})`); console.log('Suggestion selected:', suggestion); } onTrailingIconClick(iconData: {id: string, icon: any}): void { this.lastAction.set(`Icon clicked: ${iconData.id}`); console.log('Trailing icon clicked:', iconData); } clearAllSearches(): void { this.basicSearch1.set(''); this.basicSearch2.set(''); this.basicSearch3.set(''); this.sizeSmall.set(''); this.sizeMedium.set(''); this.sizeLarge.set(''); this.variantOutlined.set(''); this.variantFilled.set(''); this.variantElevated.set(''); this.iconSearch1.set(''); this.iconSearch2.set(''); this.iconSearch3.set(''); this.suggestionSearch1.set(''); this.suggestionSearch2.set(''); this.stateError.set(''); this.stateHelper.set(''); this.advancedSearch1.set(''); this.advancedSearch2.set(''); this.advancedSearch3.set(''); this.lastAction.set('All searches cleared'); } fillSampleSearches(): void { this.basicSearch1.set('Sample search'); this.basicSearch2.set('Labeled search'); this.basicSearch3.set('Required search'); this.sizeSmall.set('Small'); this.sizeMedium.set('Medium'); this.sizeLarge.set('Large'); this.variantOutlined.set('Outlined'); this.variantFilled.set('Filled'); this.variantElevated.set('Elevated'); this.iconSearch1.set('User search'); this.iconSearch2.set('Voice search'); this.iconSearch3.set('Multi-icon search'); this.suggestionSearch1.set('Angular'); this.suggestionSearch2.set('Design'); this.stateError.set('Error text'); this.stateHelper.set('Helper text'); this.advancedSearch1.set('Advanced'); this.advancedSearch2.set('Focused'); this.advancedSearch3.set('Limited'); this.lastAction.set('All searches filled with sample data'); } toggleStates(): void { this.globalDisabled.update(disabled => !disabled); this.lastAction.set(`Global state: ${this.globalDisabled() ? 'disabled' : 'enabled'}`); } getCurrentValues(): string { const values = { basic: { search1: this.basicSearch1(), search2: this.basicSearch2(), search3: this.basicSearch3() }, sizes: { small: this.sizeSmall(), medium: this.sizeMedium(), large: this.sizeLarge() }, variants: { outlined: this.variantOutlined(), filled: this.variantFilled(), elevated: this.variantElevated() }, icons: { icon1: this.iconSearch1(), icon2: this.iconSearch2(), icon3: this.iconSearch3() }, suggestions: { suggestion1: this.suggestionSearch1(), suggestion2: this.suggestionSearch2() }, states: { disabled: this.stateDisabled(), readonly: this.stateReadonly(), error: this.stateError(), helper: this.stateHelper() }, advanced: { advanced1: this.advancedSearch1(), advanced2: this.advancedSearch2(), advanced3: this.advancedSearch3() }, controls: { globalDisabled: this.globalDisabled(), lastAction: this.lastAction() } }; return JSON.stringify(values, null, 2); } }x 鄌dCheckboxComponent?checkbox/checkbox.component!checkboxPCheckbox[{Checkbox1Checkbox@@Basic Checkboxejr:checkbox label="Accept terms and conditions" 7basicChecked1" (checkboxChange)="onCheckbox`%P checkbox aubscribe to newsletter" description="Receive updates about our products and services7basicChecked2" (checkboxChange)="onCheckboxv6*checkbox label="Remember me" 7basicChecked3" (checkboxChange)="onCheckboxz checkbox mall checkbox" 5checkboxChange)="onCheckbox+68checkbox label="Medium checkbox (default)" IcheckboxChange)="onCheckbox 6-checkbox label="Large checkbox"  5checkboxChange)="onCheckbox \ColorA?Colorp z.checkbox label="Primary variant"  primaryOvariantPrimary" (checkboxChange)="onCheckboxChange('variant-primary!P checkbox condary variant"   secondarySvariantSecondary" (checkboxChange)="onCheckboxChange('variant-secondary!P checkbox uccess variant"  successOvariantSuccess" (checkboxChange)="onCheckboxChange('variant-success!P.checkbox label="Warning variant"  warningOvariantWarning" (checkboxChange)="onCheckboxChange('variant-warning!P-checkbox label="Danger variant"  dangerLvariantDanger" (checkboxChange)="onCheckboxChange('variant-dange" $<1checkbox label="Disabled unchecked" /E Unchecked /checkbox label="Disabled checked" /EChecked -checkbox label="Required field" 8FRequired" (checkboxChange)="onCheckboxChange('state-requir )*checkbox label="Error state" _'checkboxChange)="onCheckbox4 $ With DescripHDescrip/vcheckbox label="Marketing emails" description="Receive promotional emails and special offers" BdescChecked1" (checkboxChange)="onCheckboxChange('descqPcheckbox label="Product updates" description="Get notified about new features and product announcementsBdescChecked2" (checkboxChange)="onCheckboxChange('descP checkbox [curity alerts" description="Important notifications about your account security9BdescChecked3" (checkboxChange)="onCheckboxChange('descQheckAll  Check All A%_ uncheckAll  Uncheck All A$ eDisabled Sele!selection: {{ lastSele!Xcheckbox label="Accept terms" [(ngModel)]="isAccepted" (checkboxChange)="onAccept&checkbox#& Description%rcheckbox label="Marketing emails" description="Receive promotional content" variant="success" size="lg" [(ngModel)]=!"emailOptIn"> </ui-checkbox#!Required Field%rcheckbox label="I agree to terms" [required]="true" state="error" [(ngModel)]="agreedToTerms"> </ui-checkbox>&=CheckboxDemoComponent { // Basic checkboxes basicChecked1)16basicChecked2 = signal(true); basicChecked3)1-)31-boolean>(true); sizeLarge)1Q // Color variants variantPrimary = signal(true); variantSecondary)18variantSuccess = signal(true); variantWarning)1 variantDanger)1# // States stateDisabledUncheck'1;stateDisabledChecked = signal(true); stateRequir'1 stateError)1& // With descriptions descChecked1)1KdescChecked2 = signal(true); descChecked3 = signal(true1I Selection .5onCheckboxChange(checkboxId: string, checked: booleana8BSelection.set(`${checkboxId}: ${checked ? 'checked' : 'unchecked'}7Checkbox ${checkboxId} changed:`, checked); } checkAll(): void { // Update all non-disabled checkboxes to checked this.basicChecked1.set(true); this.basicChecked2.set(true); this.basicChecked3.set(true); this.sizeSmall.set(true); this.sizeMedium.set(true >true); this.variantPrimary.set(true); this.variantSecondary.set(true); this.variantSuccess.set(true); this.variWantWarning.set(true); this.variantDanger.set(true); this.stateRequired.set(true|?true); this.descChecked1.set(true); this.descChecked2.set(true); this.descChecked3.set(true); this.lastSelection.set('All checkboxes checked'); } uncheckAll(): void { // Update all non-disabled checkboxes to unchecked this.basicChecked1.set(false); this.basicChecked2.set(false); this.basicChecked3.set(false); this.sizeSmall.set(false ); this.sizeMedium.set(false >false); this.variantPrimary.set(false); this.variantSecondary.set(false); this.variantSuccess.set(false); this.^variantWarning.set(false); this.variantDanger.set(false); this.stateRequired.set(false|?false); this.descChecked1.set(false); this.descChecked2.set(false); this.descChecked3.set(false); this.lasBtSelection.set('All checkboxes unchecked'); } toggleDisabled(a8@;Selection.set(`Global disabled Aenabled' : 'dis7A[checked1: this.basicChecked1(), checked2: this.basicChecked2(), checked3: this.basicChecked3() }, s Bprimary: this.variantPrimary(), secondary: this.variantSecondary(), success: this.variantSuccess(), war?ning: this.variantWarning(), danger: this.variantDangerD,Unchecked: this.stateDisabledUnchecked(), disabledChecked: this.stateDisabledChecked(), required: this.stateRequiredkD$ }, descriptions: { desc1: this.descChecked1(), desc2: this.descChecked2(), desc3: this.descCheckedKEZSelection: this.lastSeleEM"nxka|͸Aq!e*VxaDimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ChipComponent } from '../../../../../ui-essentials/src/lib/components/data-display/chip/chip.component'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/button.component'; import { faHeart, faUser, faStar, faTag, faHome, faEnvelope, faPhone, faMapMarker, faCalendar, faCog, faTimes, faPlus, faCheck } from '@fortawesome/free-solid-svg-icons'; interface ChipData { id: string; label: string; selected: boolean; disabled: boolean; } @Component({ selector: 'ui-chip-demo', standalone: true, imports: [ CommonModule, ChipComponent, ButtonComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

Chip Component Showcase

Chip Variants

Selected State

Size Variants

With Icons

Corner Radius Variants

Chips with Icons

Leading Icons

Trailing Icons

With Avatars

Removable Chips

@for (tag of removableTags; track tag.id) { }

Removable with Icons

@for (tagWithIcon of removableTagsWithIcons; track tagWithIcon.id) { }
Add Tags Back

Interactive Selection

Click chips to toggle selection:

@for (item of selectableItems; track item.id) { }

Selected: {{ getSelectedItems() }}

Clear Selection

Chip States

Interactive States

Non-interactive (Labels)

Chip Sets

Horizontal Scrolling Set

Wrapped Set

Usage Examples

Basic Chip:

<ui-chip 
  variant="filled" 
  label="Basic Chip"
  [clickable]="true"
  (chipClick)="handleClick($event)">
</ui-chip>

Chip with Icon:

<ui-chip 
  variant="outlined"
  label="Home"
  [leadingIcon]="faHome"
  [clickable]="true"
  (chipClick)="goHome()">
</ui-chip>

Removable Chip:

<ui-chip 
  variant="filled"
  label="Tag Name"
  [removable]="true"
  [closeIcon]="faTimes"
  (chipRemove)="removeTag($event)">
</ui-chip>

Chip with Avatar:

<ui-chip 
  variant="outlined"
  label="John Doe"
  avatar="path/to/avatar.jpg"
  avatarAlt="John Doe"
  [clickable]="true"
  (chipClick)="viewProfile('john')">
</ui-chip>

Interactive Actions

@if (lastAction) {
Last action: {{ lastAction }}
}
Reset Demo Show Alert
`, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } `] }) export class ChipDemoComponent { lastAction: string = ''; // FontAwesome icons faHeart = faHeart; faUser = faUser; faStar = faStar; faTag = faTag; faHome = faHome; faEnvelope = faEnvelope; faPhone = faPhone; faMapMarker = faMapMarker; faCalendar = faCalendar; faCog = faCog; faTimes = faTimes; faPlus = faPlus; faCheck = faCheck; removableTags: ChipData[] = [ { id: 'react', label: 'React', selected: false, disabled: false }, { id: 'angular', label: 'Angular', selected: false, disabled: false }, { id: 'vue', label: 'Vue.js', selected: false, disabled: false }, { id: 'svelte', label: 'Svelte', selected: false, disabled: false } ]; removableTagsWithIcons: any[] = [ { id: 'home-tag', label: 'Home', icon: faHome }, { id: 'email-tag', label: 'Email', icon: faEnvelope }, { id: 'star-tag', label: 'Starred', icon: faStar } ]; selectableItems: ChipData[] = [ { id: 'option1', label: 'Option 1', selected: false, disabled: false }, { id: 'option2', label: 'Option 2', selected: true, disabled: false }, { id: 'option3', label: 'Option 3', selected: false, disabled: false }, { id: 'option4', label: 'Option 4', selected: false, disabled: false }, { id: 'option5', label: 'Disabled', selected: false, disabled: true } ]; private originalRemovableTags = [...this.removableTags]; private originalRemovableTagsWithIcons = [...this.removableTagsWithIcons]; handleChipClick(chipId: string): void { this.lastAction = `Chip clicked: ${chipId}`; console.log(`Chip clicked: ${chipId}`); } removeTag(tagId: string): void { this.removableTags = this.removableTags.filter(tag => tag.id !== tagId); this.lastAction = `Tag removed: ${tagId}`; console.log(`Tag removed: ${tagId}`); } removeTagWithIcon(tagId: string): void { this.removableTagsWithIcons = this.removableTagsWithIcons.filter(tag => tag.id !== tagId); this.lastAction = `Tag with icon removed: ${tagId}`; console.log(`Tag with icon removed: ${tagId}`); } addTags(): void { this.removableTags = [...this.originalRemovableTags]; this.removableTagsWithIcons = [...this.originalRemovableTagsWithIcons]; this.lastAction = 'Tags restored'; console.log('Tags restored'); } toggleSelection(itemId: string): void { const item = this.selectableItems.find(i => i.id === itemId); if (item && !item.disabled) { item.selected = !item.selected; this.lastAction = `Selection toggled: ${itemId} (${item.selected ? 'selected' : 'deselected'})`; console.log(`Selection toggled: ${itemId}`, item.selected); } } getSelectedItems(): string { return this.selectableItems .filter(item => item.selected) .map(item => item.label) .join(', ') || 'None'; } clearSelection(): void { this.selectableItems.forEach(item => { if (!item.disabled) { item.selected = false; } }); this.lastAction = 'Selection cleared'; console.log('Selection cleared'); } showAlert(message: string): void { alert(message); this.lastAction = 'Alert shown'; } resetDemo(): void { this.lastAction = ''; this.clearSelection(); this.addTags(); console.log('Demo reset'); } }Qpox{xq•73 9Ev@x@import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { CodeSnippetComponent } from '../../../../../ui-code-display/src/lib/components/code-snippet/code-snippet.component'; import { InlineCodeComponent } from '../../../../../ui-code-display/src/lib/components/inline-code/inline-code.component'; import { CodeBlockComponent } from '../../../../../ui-code-display/src/lib/components/code-block/code-block.component'; import { CodeTheme, CodeThemeService } from '../../../../../ui-code-display/src/lib/services/theme.service'; @Component({ selector: 'app-code-display-demo', standalone: true, imports: [ CommonModule, CodeSnippetComponent, InlineCodeComponent, CodeBlockComponent ], template: `

Code Display Components Demo

Theme Selector

@for (theme of themes; track theme) { }

Inline Code

Use to output to the console.

Install dependencies with

Code Snippet

Code Block

Different Sizes

Small

Medium (Default)

Large

Different Languages

Python

JSON

HTML

`, styleUrl: './code-display-demo.component.scss' }) export class CodeDisplayDemoComponent { constructor(private themeService: CodeThemeService) { this.themes = this.themeService.getAvailableThemes(); this.currentTheme = this.themeService.theme; } readonly themes: any[]; readonly currentTheme: any; readonly typescriptCode = `import { Component } from '@angular/core'; @Component({ selector: 'app-example', template: \`

{{ title }}

{{ description }}

\` }) export class ExampleComponent { title = 'Hello World'; description = 'This is a demo component'; }`; readonly cssCode = `.container { max-width: 1200px; margin: 0 auto; padding: 2rem; h1 { color: var(--primary-color); font-size: 2rem; margin-bottom: 1rem; } p { line-height: 1.6; color: var(--text-color); } }`; readonly shortCode = `const greeting = 'Hello, World!'; console.log(greeting);`; readonly pythonCode = `def fibonacci(n): if n <= 1: return n return fibonacci(n-1) + fibonacci(n-2) # Generate first 10 Fibonacci numbers for i in range(10): print(f"F({i}) = {fibonacci(i)}")`; readonly jsonCode = `{ "name": "ui-code-display", "version": "1.0.0", "description": "Code display components for Angular", "dependencies": { "@angular/core": "^19.0.0", "prismjs": "^1.30.0" }, "keywords": [ "angular", "code", "syntax-highlighting", "prism" ] }`; readonly htmlCode = `

Card Title

This is the card content.

Action
`; setTheme(theme: CodeTheme): void { this.themeService.setTheme(theme); } }0 QONx;F}Bs~Jjp^fAAjs~nA~^j^ć": PyldYhHFjnjpjQYfr*WBZQ~zin2PP7% 'rrBm+qxF/@use "../../../../../../ui-design-system/src/styles/semantic" as *; .ui-enhanced-table-container { position: relative; width: 100%; background: $semantic-color-surface-primary; border-radius: $semantic-border-card-radius; box-shadow: $semantic-shadow-elevation-1; overflow: hidden; // Variants &--striped { .ui-enhanced-table__row:nth-child(even), .ui-enhanced-table__virtual-row:nth-child(even) { background: $semantic-color-surface-secondary; } } &--bordered { border: $semantic-border-width-1 solid $semantic-color-border-primary; .ui-enhanced-table__header-cell, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { border-right: $semantic-border-width-1 solid $semantic-color-border-subtle; } } &--minimal { box-shadow: none; border-radius: 0; .ui-enhanced-table__header { border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; } } // Size variants &--compact { .ui-enhanced-table__header-cell, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; font-size: map-get($semantic-typography-body-small, font-size); line-height: map-get($semantic-typography-body-small, line-height); } } &--comfortable { .ui-enhanced-table__header-cell, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { padding: $semantic-spacing-component-lg $semantic-spacing-component-md; font-size: map-get($semantic-typography-body-large, font-size); line-height: map-get($semantic-typography-body-large, line-height); } } // States &--sticky-header { .ui-enhanced-table__header { position: sticky; top: 0; z-index: $semantic-z-index-dropdown; background: $semantic-color-surface-elevated; box-shadow: $semantic-shadow-elevation-1; } } &--loading { pointer-events: none; .ui-enhanced-table__loading-overlay { opacity: 1; visibility: visible; } } &--virtual { .ui-enhanced-table__scroll-container { overflow-y: auto; } } } // Filter Row .ui-enhanced-table__filter-row { display: flex; background: $semantic-color-surface-secondary; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; padding: $semantic-spacing-component-sm 0; gap: $semantic-spacing-component-xs; } .ui-enhanced-table__filter-cell { padding: 0 $semantic-spacing-component-sm; flex-shrink: 0; } .ui-enhanced-table__filter-input, .ui-enhanced-table__filter-select { width: 100%; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-input-radius; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-size: map-get($semantic-typography-body-small, font-size); font-family: map-get($semantic-typography-body-small, font-family); line-height: map-get($semantic-typography-body-small, line-height); transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; &:focus { outline: none; border-color: $semantic-color-focus; box-shadow: 0 0 0 2px $semantic-color-focus; } &::placeholder { color: $semantic-color-text-tertiary; } } // Scroll Container .ui-enhanced-table__scroll-container { position: relative; overflow-x: auto; max-height: 600px; } // Header .ui-enhanced-table__header { background: $semantic-color-surface-elevated; border-bottom: $semantic-border-width-2 solid $semantic-color-border-primary; } .ui-enhanced-table__header-row { display: flex; min-width: 100%; } .ui-enhanced-table__header-cell { position: relative; display: flex; align-items: center; justify-content: space-between; padding: $semantic-spacing-component-md; background: $semantic-color-surface-elevated; border-right: $semantic-border-width-1 solid $semantic-color-border-subtle; font-weight: $semantic-typography-font-weight-semibold; font-size: map-get($semantic-typography-body-medium, font-size); font-family: map-get($semantic-typography-body-medium, font-family); line-height: map-get($semantic-typography-body-medium, line-height); color: $semantic-color-text-primary; flex-shrink: 0; user-select: none; &--sortable { cursor: pointer; transition: background-color $semantic-motion-duration-fast $semantic-motion-easing-ease; &:hover { background: $semantic-color-surface-secondary; } } &--sorted { background: $semantic-color-surface-secondary; } &--draggable { cursor: grab; &:active { cursor: grabbing; } } &:last-child { border-right: none; } } .ui-enhanced-table__header-content { display: flex; align-items: center; gap: $semantic-spacing-component-xs; flex: 1; } .ui-enhanced-table__header-text { font-weight: $semantic-typography-font-weight-semibold; } .ui-enhanced-table__sort-indicators { display: flex; flex-direction: column; gap: 2px; } .ui-enhanced-table__sort-indicator { display: inline-flex; align-items: center; font-size: 12px; color: $semantic-color-primary; font-weight: $semantic-typography-font-weight-bold; sup { font-size: 8px; margin-left: 2px; } &[data-direction="asc"] { color: $semantic-color-success; } &[data-direction="desc"] { color: $semantic-color-danger; } } // Resize Handle .ui-enhanced-table__resize-handle { position: absolute; top: 0; right: 0; width: 4px; height: 100%; background: transparent; cursor: col-resize; z-index: 1; &::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2px; height: 20px; background: $semantic-color-border-secondary; opacity: 0; transition: opacity $semantic-motion-duration-fast $semantic-motion-easing-ease; } &:hover::before { opacity: 1; } } // Virtual Viewport .ui-enhanced-table__virtual-viewport { position: relative; overflow-y: auto; } // Rows (Traditional and Virtual) .ui-enhanced-table__body { background: $semantic-color-surface-primary; } .ui-enhanced-table__row, .ui-enhanced-table__virtual-row { display: flex; min-width: 100%; transition: background-color $semantic-motion-duration-fast $semantic-motion-easing-ease; &--hover:hover { background: $semantic-color-surface-secondary; } &--selected { background: rgba($semantic-color-primary, 0.1); border-left: 3px solid $semantic-color-primary; } &--striped { background: $semantic-color-surface-secondary; } } // Cells .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { display: flex; align-items: center; padding: $semantic-spacing-component-md; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; font-size: map-get($semantic-typography-body-medium, font-size); font-family: map-get($semantic-typography-body-medium, font-family); line-height: map-get($semantic-typography-body-medium, line-height); color: $semantic-color-text-primary; flex-shrink: 0; overflow: hidden; } .ui-enhanced-table__cell-content { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } // Empty State .ui-enhanced-table__empty-row { display: flex; justify-content: center; padding: $semantic-spacing-layout-section-lg; } .ui-enhanced-table__empty-cell { text-align: center; } .ui-enhanced-table__empty-content { display: flex; flex-direction: column; align-items: center; gap: $semantic-spacing-component-md; } .ui-enhanced-table__empty-text { font-size: map-get($semantic-typography-body-large, font-size); font-family: map-get($semantic-typography-body-large, font-family); color: $semantic-color-text-tertiary; } // Loading Overlay .ui-enhanced-table__loading-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba($semantic-color-backdrop, 0.5); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: $semantic-spacing-component-md; opacity: 0; visibility: hidden; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; z-index: $semantic-z-index-overlay; backdrop-filter: blur(2px); } .ui-enhanced-table__loading-spinner { width: 32px; height: 32px; border: 3px solid $semantic-color-border-subtle; border-top: 3px solid $semantic-color-primary; border-radius: 50%; animation: spin 1s linear infinite; } .ui-enhanced-table__loading-text { font-size: map-get($semantic-typography-body-medium, font-size); font-family: map-get($semantic-typography-body-medium, font-family); color: $semantic-color-text-primary; font-weight: $semantic-typography-font-weight-medium; } // Column Reorder Ghost .ui-enhanced-table__column-ghost { position: fixed; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; background: $semantic-color-primary; color: $semantic-color-on-primary; border-radius: $semantic-border-input-radius; font-size: map-get($semantic-typography-body-small, font-size); font-family: map-get($semantic-typography-body-small, font-family); font-weight: $semantic-typography-font-weight-medium; box-shadow: $semantic-shadow-elevation-3; pointer-events: none; z-index: $semantic-z-index-modal; transform: translate(-50%, -100%); opacity: 0.9; } // Animations @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Responsive Design @media (max-width: 768px) { .ui-enhanced-table-container { font-size: map-get($semantic-typography-body-small, font-size); .ui-enhanced-table__header-cell, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { padding: $semantic-spacing-component-sm; } .ui-enhanced-table__filter-row { padding: $semantic-spacing-component-xs 0; } .ui-enhanced-table__resize-handle { width: 8px; // Larger touch target } } .ui-enhanced-table__scroll-container { overflow-x: scroll; -webkit-overflow-scrolling: touch; } } // Accessibility @media (prefers-reduced-motion: reduce) { .ui-enhanced-table__header-cell, .ui-enhanced-table__row, .ui-enhanced-table__virtual-row, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell, .ui-enhanced-table__filter-input, .ui-enhanced-table__filter-select, .ui-enhanced-table__loading-overlay, .ui-enhanced-table__resize-handle::before { transition-duration: 0ms; animation-duration: 0ms; } .ui-enhanced-table__loading-spinner { animation: none; } } // High contrast mode @media (prefers-contrast: high) { .ui-enhanced-table-container { border: $semantic-border-width-2 solid $semantic-color-text-primary; } .ui-enhanced-table__header-cell, .ui-enhanced-table__cell, .ui-enhanced-table__virtual-cell { border-color: $semantic-color-text-primary; } .ui-enhanced-table__filter-input, .ui-enhanced-table__filter-select { border-color: $semantic-color-text-primary; } } // Print styles @media print { .ui-enhanced-table-container { box-shadow: none; border: $semantic-border-width-1 solid $semantic-color-text-primary; } .ui-enhanced-table__filter-row, .ui-enhanced-table__loading-overlay, .ui-enhanced-table__resize-handle, .ui-enhanced-table__column-ghost { display: none !important; } .ui-enhanced-table__header { background: white !important; } .ui-enhanced-table__row, .ui-enhanced-table__virtual-row { break-inside: avoid; } } // Focus management for keyboard navigation .ui-enhanced-table__header-cell:focus-visible, .ui-enhanced-table__row:focus-visible, .ui-enhanced-table__virtual-row:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: -2px; }Tx;?ngqFbQjniF 9}XxZ{o8?bλ$Ԗ&i7n6i=nsuCDBRҜ=(ɏ-bIf83!C"a),"o1.\I<4^$8e$.`V0eIke!a}/azuTxEIGg!mC*]"]H N{GNѸH%jƒl=D(a® eG9G@@BDȸȲ<[@Q|͙X8O('! e}J>laڮIvP6mb3| U$"|p>P8%ALYg$?I)@QzɽG8=#Fsz+r%1+&|p K+,P[>dBab$r !ܰ3~I`2F}MfP W3Z\4A$Tk ;I|QmKRY]ޡɝ*iPn &sx6R*Pp=\B)ju_T&d.CH 0c_v:>07;& btPq? &, b7Xw6n.W88"a6NQaGZT$yQJxWujSYv?ꯘarN،ζ/y~8G]Tm&' +D=4N6,4`:iU;tbiڞ}vL1K72^,\Oo0` (M Bz*Uw0e+r7kY~^7N17 O])T)X'a#($I'2JRa H]Gp=8L0'H 4Mmb>ɍwp2 a|=v{ oL~q'{'h4y Fb_Jn^*oAbqЩ@띓i[XKiN^bڇ83F*pQfWnVuyd\_Mq_nuCyV(tNFMBܟ$Fӷzݮ;~MaTR]PN;V'(Ǟk8KT.УĐ6+j8MQ8\6aÚ!5Śh6"]O GwBa/~z'?kXPcv(?Vc p^=oņv.X#[O$"JA -#1rRu x &X 6˳^o=6CN Ya_іLEF6Vz=F=vj6l&aA;b#SĢ)0ܑ ͏d!67h65ҴZ/MҸ>b9m^хpW1-ƍS}o[ >?bc<:2"cl )ѣXEE-! ŚU/>*Uq\ѐ,X^-(_ln99Z?%ISᔆ IX`[ ]NWCCW پpKAyEMaތ7;1Y="X<-ߙ7j{[+~R#V8Ea2i)_`$ x6O~'@"`+jxxj#/OcO/4m^HyGϫ)+"5mjՋmSrJ^xUZݦQf"maY k&Wj5 e"|TRY-+6 IT``l#oz{L3A,仏IackR*A!EJ(I)={1E]NP }S% f;n"y$802NηUQt]WOE8OHzZe &W ,\!pܺYjmxpvnT5a%C̎SŽ.%dG ƺ Ӑ̀LAbLGD'C.Rۖ*1>?*F 3IE_SR) 9ս~mgUKG]Topg+`~Jk D@SնZ4g90f,?骁``KePfa؅ZNx .demo-container { max-width: 1200px; margin: 0 auto; padding: 2rem; } .demo-section { margin-bottom: 3rem; h3 { margin-bottom: 1.5rem; color: #333; border-bottom: 2px solid #e0e0e0; padding-bottom: 0.5rem; } } .demo-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; margin-bottom: 2rem; } .demo-card { border: 1px solid #e0e0e0; border-radius: 8px; padding: 1.5rem; background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); h4 { margin-top: 0; margin-bottom: 1rem; color: #555; font-size: 1.1rem; font-weight: 600; } h5 { margin-top: 1.5rem; margin-bottom: 0.5rem; color: #666; font-size: 1rem; font-weight: 600; } } .demo-content { border: 1px solid #f0f0f0; padding: 1rem; background: #fafafa; border-radius: 4px; min-height: 200px; p { margin-bottom: 1rem; line-height: 1.6; text-align: justify; &:last-child { margin-bottom: 0; } } ul { margin: 1rem 0; padding-left: 1.5rem; li { margin-bottom: 0.5rem; line-height: 1.5; } } } .demo-note { background: #e3f2fd; border: 1px solid #90caf9; border-radius: 4px; padding: 1rem; margin-bottom: 1rem; color: #1565c0; font-style: italic; } .demo-controls { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; padding: 1rem; background: #f5f5f5; border-radius: 8px; border: 1px solid #e0e0e0; label { display: flex; flex-direction: column; gap: 0.25rem; font-weight: 600; color: #333; &:has(input[type="checkbox"]) { flex-direction: row; align-items: center; gap: 0.5rem; } } } .demo-select { padding: 0.5rem; border: 1px solid #ccc; border-radius: 4px; background: white; font-size: 0.9rem; &:focus { outline: 2px solid #2196f3; outline-offset: 2px; } } // Responsive adjustments @media (max-width: 768px) { .demo-container { padding: 1rem; } .demo-row { grid-template-columns: 1fr; gap: 1rem; } .demo-card { padding: 1rem; } .demo-controls { flex-direction: column; label { &:has(input[type="checkbox"]) { flex-direction: row; } } } }:˾xaimport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { ColumnComponent } from '../../../../../ui-essentials/src/lib/components/layout/column'; @Component({ selector: 'ui-column-demo', standalone: true, imports: [CommonModule, FormsModule, ColumnComponent], template: `

Column Layout Demo

Column Counts

@for (count of columnCounts; track count) {

{{ count }} Column{{ count !== '1' ? 's' : '' }}

{{ sampleText }}
}

Gap Sizes (2 Columns)

@for (gap of gaps; track gap) {

Gap: {{ gap }}

{{ shortText }}
}

Column Rules (3 Columns)

@for (rule of rules; track rule) {

Rule: {{ rule }}

{{ mediumText }}
}

Fill Types (3 Columns)

@for (fill of fills; track fill) {

Fill: {{ fill }}

{{ variableText }}
}

Responsive Layout

Resize your browser to see responsive column behavior

Responsive 4-Column Layout

Section 1

{{ sampleText }}

Section 2

{{ shortText }}

Section 3

{{ mediumText }}

Section 4

{{ variableText }}

Article Layout Example

The Future of Web Development

{{ longText }}

{{ mediumText }}

Key Benefits
  • Improved readability through better text flow
  • Enhanced visual hierarchy with column structures
  • Responsive design that adapts to screen sizes
  • Better content organization for long-form text

{{ shortText }}

Interactive Example

Interactive Column Layout

{{ sampleText }}

{{ mediumText }}

{{ shortText }}
`, styleUrl: './column-demo.component.scss' }) export class ColumnDemoComponent { columnCounts = ['1', '2', '3', '4', '5', '6'] as const; gaps = ['xs', 'sm', 'md', 'lg', 'xl'] as const; rules = ['none', 'solid', 'dashed', 'dotted'] as const; fills = ['auto', 'balance', 'balance-all'] as const; // Interactive controls selectedCount = '3' as const; selectedGap = 'md' as const; selectedRule = 'solid' as const; selectedResponsive = true; // Sample text content shortText = "This is a short paragraph to demonstrate column layout behavior with minimal text content."; mediumText = "This is a medium-length paragraph that provides a good example of how text flows within column layouts. It contains enough content to show wrapping and distribution across multiple columns while remaining readable."; sampleText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."; longText = "Web development has evolved significantly over the past decade, with new frameworks, tools, and methodologies emerging to help developers create more efficient and maintainable applications. Modern web development practices emphasize component-based architecture, responsive design, and accessibility as core principles. The adoption of TypeScript has brought static typing to JavaScript, reducing runtime errors and improving developer productivity. CSS Grid and Flexbox have revolutionized layout design, making it easier to create complex, responsive layouts without relying on external frameworks."; variableText = "This text demonstrates variable length content. Some paragraphs are longer, others shorter. This variation helps test how well the column layout handles different content lengths and maintains visual balance across columns."; }F̋Fx||+ sJI5Q1&e? xDimport { Component, OnInit, OnDestroy, ViewChild, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Router } from '@angular/router'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faHome, faCog, faUser, faSearch, faFile, faEdit, faEye, faTools, faQuestion, faPlus, faSave, faCopy, faPaste, faUndo, faRedo, faKeyboard, faPalette, faRocket } from '@fortawesome/free-solid-svg-icons'; import { Command, CommandCategory, CommandExecutionContext, CommandPaletteComponent, CommandPaletteService, createShortcuts, GlobalKeyboardDirective } from '../../../../../ui-essentials/src/lib/components/overlays/command-palette'; @Component({ selector: 'ui-command-palette-demo', standalone: true, imports: [ CommonModule, FontAwesomeModule, CommandPaletteComponent, GlobalKeyboardDirective ], template: `

Command Palette Demo

A powerful command palette for quick navigation and actions. Press Ctrl+K (or ⌘K on Mac) to open.

Quick Start

Configuration

Features

Keyboard Navigation

Full keyboard support with arrow keys, Enter, and Escape

Fuzzy Search

Intelligent search with typo tolerance and keyword matching

Quick Actions

Execute commands instantly with global keyboard shortcuts

Categorization

Organize commands by category for better discoverability

Recent Commands

Track and show recently used commands for quick access

Context Aware

Commands can be shown or hidden based on application state

Usage Statistics

{{ registeredCommandsCount }}
Registered Commands
{{ recentCommandsCount }}
Recent Commands
{{ executionCount }}
Commands Executed

Keyboard Shortcuts

Ctrl + K Open Command Palette
↑ / ↓ Navigate Results
Enter Execute Selected Command
Esc Close Palette
Tab Navigate Results (Alternative)
/ Quick Search
`, styleUrl: './command-palette-demo.component.scss' }) export class CommandPaletteDemoComponent implements OnInit, OnDestroy { @ViewChild('commandPalette') commandPalette!: CommandPaletteComponent; private router = inject(Router); private commandService = inject(CommandPaletteService); // Icons readonly faPalette = faPalette; readonly faKeyboard = faKeyboard; readonly faPlus = faPlus; readonly faSearch = faSearch; readonly faRocket = faRocket; readonly faCog = faCog; readonly faCopy = faCopy; readonly faEye = faEye; readonly faHome = faHome; readonly faUser = faUser; readonly faFile = faFile; readonly faEdit = faEdit; readonly faTools = faTools; readonly faQuestion = faQuestion; readonly faSave = faSave; readonly faUndo = faUndo; readonly faRedo = faRedo; readonly faPaste = faPaste; // Component state paletteSize: 'md' | 'lg' | 'xl' = 'lg'; executionCount = 0; config = { showCategories: true, showShortcuts: true, showRecent: true, maxResults: 20, recentLimit: 5 }; globalShortcuts = [ createShortcuts().commandPalette(), createShortcuts().quickSearch(), createShortcuts().create('/', { preventDefault: true }) ]; get registeredCommandsCount(): number { return this.commandService.commands().length; } get recentCommandsCount(): number { return this.commandService.recentCommands().length; } ngOnInit(): void { this.registerSampleCommands(); this.applyConfig(); } ngOnDestroy(): void { // Clean up registered commands this.commandService.clearCommands(); } openCommandPalette(): void { this.commandPalette.open(); } handleGlobalShortcut(event: any): void { const shortcut = event.shortcut; if (shortcut.key === 'k' && (shortcut.ctrlKey || shortcut.metaKey)) { this.commandPalette.toggle(); } else if (shortcut.key === '/') { this.commandPalette.open(); } } registerSampleCommands(): void { const sampleCommands: Command[] = [ // Navigation Commands { id: 'nav-home', title: 'Go Home', description: 'Navigate to the home page', icon: faHome, category: CommandCategory.NAVIGATION, keywords: ['home', 'dashboard', 'main'], shortcut: ['Ctrl', 'H'], handler: () => this.showToast('Navigating to home...'), order: 1 }, { id: 'nav-profile', title: 'View Profile', description: 'Go to user profile page', icon: faUser, category: CommandCategory.NAVIGATION, keywords: ['profile', 'user', 'account'], handler: () => this.showToast('Opening profile...'), order: 2 }, { id: 'nav-settings', title: 'Open Settings', description: 'Access application settings', icon: faCog, category: CommandCategory.SETTINGS, keywords: ['settings', 'preferences', 'config'], shortcut: ['Ctrl', ','], handler: () => this.showToast('Opening settings...'), order: 1 }, // File Commands { id: 'file-new', title: 'New File', description: 'Create a new file', icon: faFile, category: CommandCategory.FILE, keywords: ['new', 'create', 'file', 'document'], shortcut: ['Ctrl', 'N'], handler: () => this.showToast('Creating new file...'), order: 1 }, { id: 'file-save', title: 'Save File', description: 'Save the current file', icon: faSave, category: CommandCategory.FILE, keywords: ['save', 'file', 'document'], shortcut: ['Ctrl', 'S'], handler: () => this.showToast('Saving file...'), order: 2 }, // Edit Commands { id: 'edit-copy', title: 'Copy', description: 'Copy selected content', icon: faCopy, category: CommandCategory.EDIT, keywords: ['copy', 'clipboard'], shortcut: ['Ctrl', 'C'], handler: () => this.showToast('Content copied!'), order: 1 }, { id: 'edit-paste', title: 'Paste', description: 'Paste from clipboard', icon: faPaste, category: CommandCategory.EDIT, keywords: ['paste', 'clipboard'], shortcut: ['Ctrl', 'V'], handler: () => this.showToast('Content pasted!'), order: 2 }, { id: 'edit-undo', title: 'Undo', description: 'Undo last action', icon: faUndo, category: CommandCategory.EDIT, keywords: ['undo', 'revert'], shortcut: ['Ctrl', 'Z'], handler: () => this.showToast('Action undone!'), order: 3 }, { id: 'edit-redo', title: 'Redo', description: 'Redo last undone action', icon: faRedo, category: CommandCategory.EDIT, keywords: ['redo', 'repeat'], shortcut: ['Ctrl', 'Y'], handler: () => this.showToast('Action redone!'), order: 4 }, // Search Commands { id: 'search-global', title: 'Global Search', description: 'Search across all content', icon: faSearch, category: CommandCategory.SEARCH, keywords: ['search', 'find', 'global'], shortcut: ['Ctrl', 'Shift', 'F'], handler: () => this.showToast('Opening global search...'), order: 1 }, // Tools Commands { id: 'tools-theme', title: 'Toggle Theme', description: 'Switch between light and dark theme', icon: faTools, category: CommandCategory.TOOLS, keywords: ['theme', 'dark', 'light', 'toggle'], handler: () => this.showToast('Theme toggled!'), order: 1 }, // Help Commands { id: 'help-docs', title: 'Documentation', description: 'Open help documentation', icon: faQuestion, category: CommandCategory.HELP, keywords: ['help', 'docs', 'documentation'], handler: () => this.showToast('Opening documentation...'), order: 1 }, // Action Commands { id: 'action-refresh', title: 'Refresh Page', description: 'Reload the current page', icon: faRocket, category: CommandCategory.ACTIONS, keywords: ['refresh', 'reload', 'update'], shortcut: ['F5'], handler: () => this.showToast('Page refreshed!'), order: 1 } ]; this.commandService.registerCommands(sampleCommands); } clearCommands(): void { this.commandService.clearCommands(); this.commandService.clearRecentCommands(); } updateConfig(key: string, event: Event): void { const target = event.target as HTMLInputElement; let value: any = target.type === 'checkbox' ? target.checked : target.type === 'number' ? parseInt(target.value, 10) : target.value; (this.config as any)[key] = value; this.applyConfig(); } updatePaletteSize(event: Event): void { const target = event.target as HTMLSelectElement; this.paletteSize = target.value as 'md' | 'lg' | 'xl'; } private applyConfig(): void { this.commandService.updateConfig({ showCategories: this.config.showCategories, showShortcuts: this.config.showShortcuts, showRecent: this.config.showRecent, maxResults: this.config.maxResults, recentLimit: this.config.recentLimit }); } onPaletteOpened(): void { console.log('Command palette opened'); } onPaletteClosed(): void { console.log('Command palette closed'); } onCommandExecuted(event: { commandId: string; context: CommandExecutionContext }): void { this.executionCount++; console.log('Command executed:', event); } private showToast(message: string): void { // Simple toast implementation for demo const toast = document.createElement('div'); toast.className = 'demo-toast'; toast.textContent = message; toast.style.cssText = ` position: fixed; top: 20px; right: 20px; background: #333; color: white; padding: 12px 24px; border-radius: 6px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); z-index: 10000; font-size: 14px; animation: slideIn 0.3s ease; `; document.body.appendChild(toast); setTimeout(() => { toast.style.animation = 'slideOut 0.3s ease forwards'; setTimeout(() => document.body.removeChild(toast), 300); }, 3000); } }8x@use '../../../../../ui-design-system/src/styles/semantic/index' as *; .demo-wrapper { padding: $semantic-spacing-layout-md; width: 100%; max-width: 100%; overflow-x: hidden; // Prevent horizontal overflow box-sizing: border-box; } .demo-section { margin-bottom: $semantic-spacing-layout-xl; width: 100%; overflow-x: hidden; // Prevent horizontal overflow h2 { margin-bottom: $semantic-spacing-layout-md; color: $semantic-color-text-primary; font-size: 1.5rem; font-weight: 600; text-align: center; } h3 { margin-bottom: $semantic-spacing-component-lg; color: $semantic-color-text-primary; font-size: 1.25rem; font-weight: 600; } h4 { margin-bottom: $semantic-spacing-component-sm; color: $semantic-color-text-secondary; font-size: 1.125rem; font-weight: 500; } } .demo-containers-showcase { display: flex; flex-direction: column; gap: $semantic-spacing-component-lg; margin-bottom: $semantic-spacing-layout-lg; width: 100%; max-width: 100%; overflow-x: hidden; // Prevent horizontal overflow box-sizing: border-box; // Ensure all child containers are properly constrained .ui-container { max-width: min(100%, var(--container-max-width, 100%)); margin-left: auto; margin-right: auto; } } .demo-container-wrapper { width: 100%; display: flex; flex-direction: column; align-items: center; // Center the containers overflow-x: hidden; // Prevent horizontal overflow } .demo-label { font-size: 0.875rem; color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-xs; text-align: center; font-weight: 500; } .demo-container-outline { border: 2px dashed $semantic-color-border-subtle; background: rgba($semantic-color-container-primary, 0.05); max-width: 100%; // Ensure containers don't overflow their parent box-sizing: border-box; // Include padding and border in width calculation margin: 0 auto; // Center the container position: relative; // For proper positioning context // Ensure proper centering &.ui-container { margin-left: auto; margin-right: auto; } &.demo-container-tall { min-height: 150px; } } .demo-content { color: $semantic-color-text-primary; text-align: center; padding: $semantic-spacing-component-sm; width: 100%; max-width: 100%; box-sizing: border-box; overflow-wrap: break-word; // Handle long text properly word-wrap: break-word; &.hero-content { h2 { margin-bottom: $semantic-spacing-component-sm; color: $semantic-color-text-primary; } p { color: $semantic-color-text-secondary; font-size: 1.125rem; } } } .demo-variant-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: $semantic-spacing-grid-gap-lg; } .demo-variant-item { display: flex; flex-direction: column; } .demo-flex-item { background: $semantic-color-container-secondary; color: $semantic-color-on-container-secondary; padding: $semantic-spacing-component-sm; border-radius: $semantic-border-radius-sm; text-align: center; font-weight: 500; width: 100%; // Ensure flex items take full width max-width: 100%; box-sizing: border-box; flex-shrink: 0; // Prevent shrinking } .demo-grid-item { background: $semantic-color-container-tertiary; color: $semantic-color-on-container-tertiary; padding: $semantic-spacing-component-sm; border-radius: $semantic-border-radius-sm; text-align: center; font-weight: 500; min-height: 60px; display: flex; align-items: center; justify-content: center; } .demo-paragraph { margin-bottom: $semantic-spacing-component-sm; color: $semantic-color-text-primary; line-height: 1.5; &:last-child { margin-bottom: 0; } } .demo-wide-content { white-space: nowrap; color: $semantic-color-text-primary; padding: $semantic-spacing-component-sm; } // Feature cards styling :host ::ng-deep { .demo-section ui-container[variant="card"] { h3 { margin-bottom: $semantic-spacing-component-sm; color: $semantic-color-text-primary; font-size: 1.125rem; font-weight: 500; } p { color: $semantic-color-text-secondary; line-height: 1.5; margin: 0; } } } // Additional container demo specific styles .demo-containers-showcase { // Ensure containers behave properly .ui-container { position: relative; } // Size-specific constraints to prevent overflow .ui-container--xs { --container-max-width: 475px; } .ui-container--sm { --container-max-width: 640px; } .ui-container--md { --container-max-width: 768px; } .ui-container--lg { --container-max-width: 1024px; } .ui-container--xl { --container-max-width: 1280px; } .ui-container--2xl { --container-max-width: 1536px; } .ui-container--full { --container-max-width: 100%; } // Fix flex container alignment issues .ui-container--flex { align-items: stretch; // Default to stretch for consistent layout &:not(.ui-container--flex-center):not(.ui-container--flex-start):not(.ui-container--flex-end) { align-items: stretch; // Force default alignment for flex containers } } } @media (max-width: 1024px) { // Force smaller containers on tablet .demo-containers-showcase .ui-container { max-width: min(100%, var(--container-max-width, 100%)) !important; } } @media (max-width: 768px) { .demo-variant-grid { grid-template-columns: 1fr; gap: $semantic-spacing-component-lg; } .demo-containers-showcase { gap: $semantic-spacing-component-md; // Force all containers to be full width on mobile .ui-container { max-width: 100% !important; width: 100% !important; } } .demo-wrapper { padding: $semantic-spacing-component-md; } }.~qx{{Gw(gqFbQjniF}bW#x_(import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ContainerComponent } from '../../../../../ui-essentials/src/lib/components/layout/container/container.component'; import { GridSystemComponent } from '../../../../../ui-essentials/src/lib/components/layout/grid-system/grid-system.component'; @Component({ selector: 'ui-container-demo', standalone: true, imports: [CommonModule, ContainerComponent, GridSystemComponent], template: `

Container Demo

Size Variants

@for (size of sizes; track size) {
{{ size }} (max-width: {{ getMaxWidth(size) }})
{{ size }} container content
}

Container Variants

Default Container

Basic container with standard padding and centering

Card Container

Card-style container with background, border, and shadow

Section Container

Section container with larger vertical padding for page sections

Hero Container

Hero Section

Large padding and centered content for hero sections

Flex Container Variants

Flex Column (Default)

Item 1
Item 2
Item 3

Flex Row

Item 1
Item 2
Item 3

Flex Center

Centered
Content

Flex Space Between

Start
End

Grid Container Variants

Grid Auto

@for (item of getGridItems(6); track $index) {
{{ item }}
}

Grid 3 Columns

@for (item of getGridItems(6); track $index) {
{{ item }}
}

Padding Variants

@for (padding of paddingSizes; track padding) {

Padding: {{ padding }}

{{ padding }} padding content
}

Background Variants

@for (bg of backgrounds; track bg) {

Background: {{ bg }}

{{ bg }} background
}

Scrollable Containers

Vertical Scroll

@for (item of getLongContent(); track $index) {

{{ item }}

}

Horizontal Scroll

This is a very long line of content that will cause horizontal scrolling when it exceeds the container width. Keep reading to see the scroll behavior in action.

Real World Example

Product Features

Discover what makes our product special

@for (feature of features; track feature.title) {

{{ feature.title }}

{{ feature.description }}

 }
`, styleUrl: './container-demo.component.scss' }) export class ContainerDemoComponent { sizes: ('xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | 'full')[] = ['xs', 'sm', 'md', 'lg', 'xl', '2xl', 'full']; paddingSizes: ('xs' | 'sm' | 'md' | 'lg' | 'xl' | 'none')[] = ['xs', 'sm', 'md', 'lg', 'xl', 'none']; backgrounds: ('transparent' | 'surface' | 'surface-secondary' | 'surface-elevated')[] = [ 'transparent', 'surface', 'surface-secondary', 'surface-elevated' ]; features = [ { title: 'Fast', description: 'Lightning-fast performance optimized for speed' }, { title: 'Secure', description: 'Enterprise-grade security built from the ground up' }, { title: 'Scalable', description: 'Grows with your business needs seamlessly' }, { title: 'Reliable', description: '99.9% uptime guaranteed with redundant systems' }, { title: 'Easy to Use', description: 'Intuitive interface designed for productivity' }, { title: 'Supported', description: '24/7 customer support when you need it' } ]; getMaxWidth(size: string): string { const sizes: Record = { 'xs': '475px', 'sm': '640px', 'md': '768px', 'lg': '1024px', 'xl': '1280px', '2xl': '1536px', 'full': 'none' }; return sizes[size] || 'auto'; } getGridItems(count: number): string[] { return Array.from({ length: count }, (_, i) => `Item ${i + 1}`); } getLongContent(): string[] { return [ 'This is paragraph 1 with some content to demonstrate vertical scrolling.', 'This is paragraph 2 with more content to show how the container handles overflow.', 'This is paragraph 3 continuing the demonstration of scrollable content.', 'This is paragraph 4 adding even more content to ensure scrolling is needed.', 'This is paragraph 5 with the final bit of content to complete the demo.', 'This is paragraph 6 making sure we have enough content for scroll.', 'This is paragraph 7 - almost done with our scrollable content demo.', 'This is paragraph 8 - the last paragraph in our scrollable demo.' ]; } }BزmxpB䣌73SZIx @use '../../../../../ui-design-system/src/styles/semantic' as semantic; .conversion-demo { min-height: 100vh; background: semantic.$semantic-color-surface-primary; } .demo-section { padding: semantic.$semantic-spacing-layout-section-lg semantic.$semantic-spacing-container-card-padding; &:first-child { text-align: center; background: linear-gradient(135deg, semantic.$semantic-color-primary-container 0%, semantic.$semantic-color-tertiary-container 100%); border-bottom: 1px solid semantic.$semantic-color-border-subtle; } &:not(:first-child) { border-bottom: 1px solid semantic.$semantic-color-border-subtle; } } .demo-title { font-size: 3rem; font-weight: 600; color: semantic.$semantic-color-text-primary; margin-bottom: semantic.$semantic-spacing-content-paragraph; } .demo-description { font-size: 1.125rem; color: semantic.$semantic-color-text-secondary; max-width: 600px; margin: 0 auto; line-height: 1.6; } .demo-section-title { font-size: 1.875rem; font-weight: 600; color: semantic.$semantic-color-text-primary; margin-bottom: semantic.$semantic-spacing-content-paragraph; text-align: center; } .demo-section-description { font-size: 1.125rem; color: semantic.$semantic-color-text-secondary; text-align: center; max-width: 800px; margin: 0 auto semantic.$semantic-spacing-component-xl auto; line-height: 1.6; } .demo-example { margin-bottom: semantic.$semantic-spacing-layout-section-sm; &:last-child { margin-bottom: 0; } } .demo-example-title { font-size: 1.5rem; font-weight: 500; color: semantic.$semantic-color-text-primary; margin-bottom: semantic.$semantic-spacing-content-paragraph; text-align: center; } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: semantic.$semantic-spacing-component-xl; margin-bottom: semantic.$semantic-spacing-layout-section-sm; @media (max-width: 768px) { grid-template-columns: 1fr; gap: semantic.$semantic-spacing-content-paragraph; } } .footer-demo { background: semantic.$semantic-color-primary; padding: semantic.$semantic-spacing-component-xl; border-radius: 0.5rem; color: semantic.$semantic-color-on-primary; } // Component spacing adjustments :host ::ng-deep { ui-cta-section { margin-bottom: semantic.$semantic-spacing-content-paragraph; } ui-pricing-table { margin-bottom: semantic.$semantic-spacing-content-paragraph; } ui-newsletter-signup { margin-bottom: semantic.$semantic-spacing-content-paragraph; } ui-contact-form { margin-bottom: semantic.$semantic-spacing-content-paragraph; } } // Responsive adjustments @media (max-width: 768px) { .demo-section { padding: semantic.$semantic-spacing-layout-section-sm semantic.$semantic-spacing-container-card-padding; } .demo-title { font-size: 2.25rem; } .demo-section-title { font-size: 1.875rem; } .demo-grid { grid-template-columns: 1fr; } } @media (max-width: 480px) { .demo-section { padding: semantic.$semantic-spacing-layout-section-xs semantic.$semantic-spacing-container-card-padding; } .demo-title { font-size: 1.875rem; } .demo-section-title { font-size: 1.5rem; } .demo-example-title { font-size: 1.25rem; } }ax'import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; // Temporarily commented out until ui-landing-pages is built // import { // CTASectionComponent, // PricingTableComponent, // NewsletterSignupComponent, // ContactFormComponent // } from 'ui-landing-pages'; // import { // CTASectionConfig, // PricingTableConfig, // NewsletterSignupConfig, // ContactFormConfig // } from 'ui-landing-pages'; @Component({ selector: 'app-conversion-demo', standalone: true, imports: [ CommonModule, // Temporarily commented out until ui-landing-pages is built // CTASectionComponent, // PricingTableComponent, // NewsletterSignupComponent, // ContactFormComponent ], template: `

Conversion Components Demo

Phase 3 components focused on user actions and conversions, including CTAs, pricing tables, newsletter signups, and contact forms.

🚧 Under Construction: This demo is temporarily disabled while the ui-landing-pages library is being built.

`, styleUrls: ['./conversion-demo.component.scss'] }) export class ConversionDemoComponent { // CTA Section Configurations // Temporarily commented out until ui-landing-pages is built /* ctaConfigGradient: CTASectionConfig = { title: "Transform Your Business Today", description: "Join thousands of companies already using our platform to accelerate growth and increase efficiency.", backgroundType: 'gradient', ctaPrimary: { text: 'Start Free Trial', variant: 'filled', action: () => console.log('Primary CTA clicked') }, ctaSecondary: { text: 'Watch Demo', variant: 'outlined', action: () => console.log('Secondary CTA clicked') }, urgency: { type: 'countdown', text: 'Limited Time Offer Ends In:', endDate: new Date(Date.now() + 5 * 24 * 60 * 60 * 1000) // 5 days from now } }; ctaConfigPattern: CTASectionConfig = { title: "Don't Miss Out on This Exclusive Deal", description: "Get 50% off your first year and unlock premium features.", backgroundType: 'pattern', ctaPrimary: { text: 'Claim Offer Now', variant: 'filled', action: () => console.log('Pattern CTA clicked') }, urgency: { type: 'limited-offer', text: 'Flash Sale', remaining: 12 } }; ctaConfigSolid: CTASectionConfig = { title: "Join Over 10,000 Happy Customers", description: "See why businesses trust us with their most important processes.", backgroundType: 'solid', ctaPrimary: { text: 'Get Started', variant: 'filled', action: () => console.log('Solid CTA clicked') }, urgency: { type: 'social-proof', text: '🔥 142 people signed up in the last 24 hours' } }; // Pricing Table Configuration pricingConfig: PricingTableConfig = { billingToggle: { monthlyLabel: 'Monthly', yearlyLabel: 'Yearly', discountText: 'Save 20%' }, featuresComparison: true, highlightedPlan: 'pro', plans: [ { id: 'starter', name: 'Starter', description: 'Perfect for small teams getting started', price: { monthly: 29, yearly: 24, currency: '$', suffix: '/month' }, features: [ { name: 'Up to 5 team members', included: true }, { name: '10GB storage', included: true }, { name: 'Basic reporting', included: true }, { name: 'Email support', included: true }, { name: 'Advanced analytics', included: false }, { name: 'API access', included: false }, { name: 'Priority support', included: false } ], cta: { text: 'Start Free Trial', action: () => console.log('Starter plan selected') } }, { id: 'pro', name: 'Professional', description: 'Best for growing businesses', badge: 'Most Popular', popular: true, price: { monthly: 79, yearly: 63, currency: '$', suffix: '/month' }, features: [ { name: 'Up to 25 team members', included: true }, { name: '100GB storage', included: true }, { name: 'Advanced reporting', included: true, highlight: true }, { name: 'Email & chat support', included: true }, { name: 'Advanced analytics', included: true, highlight: true }, { name: 'API access', included: true }, { name: 'Priority support', included: false } ], cta: { text: 'Start Free Trial', action: () => console.log('Pro plan selected') } }, { id: 'enterprise', name: 'Enterprise', description: 'For large organizations with custom needs', price: { monthly: 199, yearly: 159, currency: '$', suffix: '/month' }, features: [ { name: 'Unlimited team members', included: true }, { name: 'Unlimited storage', included: true }, { name: 'Custom reporting', included: true }, { name: '24/7 phone support', included: true }, { name: 'Advanced analytics', included: true }, { name: 'Full API access', included: true }, { name: 'Priority support', included: true, highlight: true } ], cta: { text: 'Contact Sales', variant: 'outlined', action: () => console.log('Enterprise plan selected') } } ] }; // Newsletter Signup Configurations newsletterConfigInline: NewsletterSignupConfig = { title: "Stay Updated with Our Newsletter", description: "Get the latest insights, tips, and updates delivered to your inbox.", placeholder: "Enter your email address", ctaText: "Subscribe", variant: 'inline', successMessage: "Thanks for subscribing! Check your email for confirmation." }; newsletterConfigModal: NewsletterSignupConfig = { title: "Join Our Community", description: "Be the first to know about new features and exclusive content.", placeholder: "Your email address", ctaText: "Join Now", variant: 'modal', successMessage: "Welcome aboard! You're now part of our community." }; newsletterConfigFooter: NewsletterSignupConfig = { title: "Newsletter Signup", description: "Weekly insights and updates from our team.", placeholder: "Email address", ctaText: "Sign Up", variant: 'footer', showPrivacyCheckbox: true, privacyText: "We respect your privacy and will never spam you.", successMessage: "Successfully subscribed! Welcome to our newsletter." }; // Contact Form Configurations contactConfigTwoColumn: ContactFormConfig = { title: "Get in Touch", description: "We'd love to hear from you. Send us a message and we'll respond as soon as possible.", layout: 'two-column', submitText: 'Send Message', successMessage: "Thank you for your message! We'll get back to you within 24 hours.", validation: {}, fields: [ { type: 'text', name: 'firstName', label: 'First Name', placeholder: 'John', required: true }, { type: 'text', name: 'lastName', label: 'Last Name', placeholder: 'Doe', required: true }, { type: 'email', name: 'email', label: 'Email', placeholder: 'john@example.com', required: true }, { type: 'tel', name: 'phone', label: 'Phone Number', placeholder: '+1 (555) 123-4567', required: false }, { type: 'select', name: 'subject', label: 'Subject', required: true, options: [ { value: 'general', label: 'General Inquiry' }, { value: 'support', label: 'Technical Support' }, { value: 'sales', label: 'Sales Question' }, { value: 'partnership', label: 'Partnership' } ] }, { type: 'textarea', name: 'message', label: 'Message', placeholder: 'Tell us more about your inquiry...', required: true, rows: 5 } ] }; contactConfigSingleColumn: ContactFormConfig = { title: "Quick Contact", layout: 'single-column', submitText: 'Submit', successMessage: "Message sent successfully!", validation: {}, fields: [ { type: 'text', name: 'name', label: 'Full Name', required: true }, { type: 'email', name: 'email', label: 'Email Address', required: true }, { type: 'textarea', name: 'message', label: 'Your Message', required: true, rows: 4 }, { type: 'checkbox', name: 'newsletter', label: 'Subscribe to our newsletter for updates', required: false } ] }; contactConfigInline: ContactFormConfig = { layout: 'inline', submitText: 'Contact Us', successMessage: "We'll be in touch soon!", validation: {}, fields: [ { type: 'text', name: 'name', label: 'Name', placeholder: 'Your name', required: true }, { type: 'email', name: 'email', label: 'Email', placeholder: 'your@email.com', required: true }, { type: 'text', name: 'company', label: 'Company', placeholder: 'Your company', required: false } ] }; onNewsletterSignup(data: any) { console.log('Newsletter signup:', data); } onContactFormSubmit(data: any) { console.log('Contact form submission:', data); } */ }{xd.demo-container { padding: 24px; max-width: 1400px; margin: 0 auto; } .demo-section { margin-bottom: 48px; h3 { margin-bottom: 24px; font-size: 1.5rem; font-weight: 600; color: #2d3748; border-bottom: 2px solid #e2e8f0; padding-bottom: 8px; } } .demo-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 24px; margin-bottom: 24px; } .demo-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); h4 { background: #f7fafc; padding: 16px; margin: 0; font-size: 1.1rem; font-weight: 600; color: #2d3748; border-bottom: 1px solid #e2e8f0; } } .dashboard-demo-container { height: 400px; overflow: hidden; border: 1px solid #e2e8f0; background: #f8f9fa; &--interactive { height: 600px; border: 2px solid #4299e1; border-radius: 8px; margin-top: 16px; } } .demo-controls { display: flex; flex-wrap: wrap; gap: 16px; padding: 20px; background: #f8f9fa; border: 1px solid #e2e8f0; border-radius: 8px; margin-bottom: 16px; label { display: flex; flex-direction: column; gap: 4px; font-size: 0.875rem; font-weight: 500; color: #4a5568; select, input[type="checkbox"] { padding: 4px 8px; border: 1px solid #d2d6dc; border-radius: 4px; font-size: 0.875rem; &:focus { outline: 2px solid #4299e1; outline-offset: 2px; } } input[type="checkbox"] { width: auto; margin-top: 4px; } } } // Demo content styling for dashboard shell slots .demo-content { padding: 20px; h4, h5 { margin-top: 0; margin-bottom: 16px; color: #2d3748; } p { margin-bottom: 16px; line-height: 1.6; color: #4a5568; } ul { margin-bottom: 16px; li { margin-bottom: 8px; line-height: 1.5; color: #4a5568; } } } // Sidebar demo styling nav[slot="sidebar"] { h5 { margin: 0 0 16px 0; font-size: 1rem; font-weight: 600; color: #2d3748; } h6 { margin: 16px 0 8px 0; font-size: 0.875rem; font-weight: 600; color: #4a5568; text-transform: uppercase; letter-spacing: 0.05em; } ul { list-style: none; margin: 0; padding: 0; li { margin-bottom: 8px; span { display: block; padding: 8px 12px; border-radius: 6px; cursor: pointer; transition: all 0.2s ease; color: #4a5568; &:hover { background: #edf2f7; color: #2d3748; } &.active { background: #4299e1; color: white; font-weight: 500; } } } } .sidebar-section { margin-top: 24px; padding-top: 16px; border-top: 1px solid #e2e8f0; } } // Demo buttons .demo-button { background: #4299e1; color: white; border: none; padding: 8px 16px; border-radius: 6px; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease; margin-right: 8px; margin-bottom: 8px; &:hover { background: #3182ce; } &:focus { outline: 2px solid #4299e1; outline-offset: 2px; } &.primary { background: #38a169; &:hover { background: #2f855a; } } } .demo-button-sm { background: transparent; color: #4a5568; border: 1px solid #e2e8f0; padding: 4px 8px; border-radius: 4px; font-size: 0.875rem; cursor: pointer; transition: all 0.2s ease; &:hover { background: #f7fafc; border-color: #cbd5e0; } &:focus { outline: 2px solid #4299e1; outline-offset: 2px; } } // Content area styling .content-area { background: #f8f9fa; padding: 20px; border-radius: 8px; margin: 16px 0; } .metric-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; margin-top: 16px; } .metric-card { background: #ffffff; padding: 16px; border-radius: 6px; text-align: center; font-weight: 500; color: #2d3748; border: 1px solid #e2e8f0; } .chart-placeholder { background: #ffffff; padding: 40px; border-radius: 6px; text-align: center; color: #a0aec0; font-size: 1.125rem; border: 1px solid #e2e8f0; margin-top: 16px; } .user-list, .project-list { background: #ffffff; border-radius: 6px; border: 1px solid #e2e8f0; margin-top: 16px; } .user-item, .project-item { padding: 12px 16px; border-bottom: 1px solid #f1f5f9; color: #4a5568; &:last-child { border-bottom: none; } &:hover { background: #f8f9fa; } } .settings-groups { background: #ffffff; padding: 20px; border-radius: 6px; border: 1px solid #e2e8f0; margin-top: 16px; } .setting-group { margin-bottom: 20px; &:last-child { margin-bottom: 0; } h6 { margin: 0 0 8px 0; font-size: 0.875rem; font-weight: 600; color: #2d3748; } label { display: flex; align-items: center; gap: 8px; color: #4a5568; font-size: 0.875rem; cursor: pointer; input[type="checkbox"] { margin: 0; } } } .action-buttons { margin-top: 24px; padding-top: 16px; border-top: 1px solid #e2e8f0; } // Notification styling .notification-item { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: #ebf8ff; border: 1px solid #bee3f8; border-radius: 6px; color: #2b6cb0; font-size: 0.875rem; .dismiss-btn { background: none; border: none; color: #2b6cb0; cursor: pointer; font-size: 1.125rem; padding: 0; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; &:hover { background: #bee3f8; border-radius: 50%; } } } // Footer styling .footer-detailed { display: flex; justify-content: space-between; width: 100%; .footer-section { display: flex; flex-direction: column; gap: 4px; } } // Usage information .usage-info { background: #f8f9fa; padding: 24px; border-radius: 8px; border: 1px solid #e2e8f0; h4 { margin-top: 0; margin-bottom: 16px; color: #2d3748; font-size: 1.125rem; } ul { margin-bottom: 24px; li { margin-bottom: 8px; line-height: 1.6; color: #4a5568; } } code { background: #edf2f7; padding: 2px 6px; border-radius: 4px; font-family: 'Monaco', 'Consolas', monospace; font-size: 0.875rem; color: #2d3748; } } // Responsive adjustments @media (max-width: 768px) { .demo-row { grid-template-columns: 1fr; } .dashboard-demo-container { &--interactive { height: 500px; } } .demo-controls { flex-direction: column; gap: 12px; label { flex-direction: row; align-items: center; justify-content: space-between; } } } @media (max-width: 480px) { .demo-container { padding: 16px; } .dashboard-demo-container { height: 300px; &--interactive { height: 400px; } } }#Ds xUimport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { DashboardShellComponent } from '../../../../../ui-essentials/src/lib/components/layout/dashboard-shell/dashboard-shell.component'; @Component({ selector: 'ui-dashboard-shell-demo', standalone: true, imports: [CommonModule, FormsModule, DashboardShellComponent], template: `

Dashboard Shell Demo

Visual Variants

@for (variant of variants; track variant) {

{{ variant | titlecase }}

{{ variant | titlecase }} App

🌙 🔔 👤

📢 Welcome to {{ variant }} variant!

Main Content

This is the main content area for {{ variant }} dashboard variant.

© 2024 Dashboard App
}

Size Configurations

@for (config of sizeConfigs; track config.name) {

{{ config.name }}

{{ config.name }} Dashboard

🔍 📱

{{ config.name }} Content

Sidebar: {{ config.sidebarWidth }}, Header: {{ config.headerHeight }}, Footer: {{ config.footerVariant }}

{{ config.name }} Footer v1.0.0
}

Layout Options

No Footer

Clean Dashboard

🎨

Clean Layout

Dashboard without footer for cleaner appearance.

Minimal UI

Minimal App

⚡

Minimal Interface

Streamlined dashboard without breadcrumbs and notifications.

Minimal

Interactive Dashboard

Interactive Dashboard

@if (hasNewNotifications) {
🎉 New feature available! Click to explore the {{ activeSection }} section.
}

{{ activeSection | titlecase }} Section

Current configuration:

  • Variant: {{ interactiveVariant }}
  • Sidebar Width: {{ interactiveSidebarWidth }}
  • Header Height: {{ interactiveHeaderHeight }}
  • Footer Variant: {{ interactiveFooterVariant }}
  • Sidebar Collapsed: {{ interactiveSidebarCollapsed ? 'Yes' : 'No' }}
  • Theme: {{ isDarkTheme ? 'Dark' : 'Light' }}
{{ activeSection | titlecase }} Content
@switch (activeSection) { @case ('dashboard') {

📈 Welcome to your dashboard overview. Here you can see key metrics and quick actions.

Total Users: 1,234
Active Projects: 42
Revenue: $12,345
} @case ('analytics') {

📊 Analytics and reporting section. View detailed insights about your application usage.

📈 Chart Placeholder
} @case ('users') {

👥 User management section. Manage user accounts, permissions, and profiles.

John Doe - Admin
Jane Smith - User
Bob Johnson - Manager
} @case ('projects') {

💼 Project management section. Track and manage your ongoing projects.

🚀 Website Redesign - In Progress
📱 Mobile App - Planning
🔧 API Integration - Completed
} @case ('settings') {

⚙️ Application settings and configuration options.

Appearance
Notifications
} @default {

Select a section from the sidebar to view its content.

} }
@if (interactiveFooterVariant === 'detailed') {
© 2024 Interactive Dashboard Version 1.2.3
Last Updated: {{ lastUpdated }} Status: {{ connectionStatus }}
} @else if (interactiveFooterVariant === 'standard') { © 2024 Interactive Dashboard - v1.2.3 Status: {{ connectionStatus }} } @else { © 2024 Dashboard }

Usage Information

Key Features:

  • 🏗️ Complete application shell structure
  • 📱 Mobile-responsive with hamburger menu
  • 🎨 Multiple visual variants (default, bordered, elevated)
  • 📏 Configurable sizing for header, sidebar, and footer
  • 🧭 Integrated breadcrumbs navigation
  • 🔔 Notifications area with live region support
  • ♿ Full accessibility support with ARIA labels
  • 🎛️ Flexible content projection slots
  • ⚡ Event emitters for user interactions

Content Projection Slots:

  • slot="header" - Header title and branding
  • slot="header-actions" - Theme switcher, notifications, user menu
  • slot="sidebar" - Main navigation content
  • slot="breadcrumbs" - Breadcrumb navigation
  • slot="notifications" - System notifications and alerts
  • slot="footer" - Footer content and links
  • Default slot - Main page content
`, styleUrl: './dashboard-shell-demo.component.scss' }) export class DashboardShellDemoComponent { variants = ['default', 'bordered', 'elevated'] as const; sizeConfigs = [ { name: 'Compact', sidebarWidth: 'sm' as const, headerHeight: 'sm' as const, footerVariant: 'minimal' as const }, { name: 'Standard', sidebarWidth: 'md' as const, headerHeight: 'md' as const, footerVariant: 'standard' as const }, { name: 'Spacious', sidebarWidth: 'lg' as const, headerHeight: 'lg' as const, footerVariant: 'detailed' as const } ]; // Interactive demo properties interactiveVariant: 'default' | 'bordered' | 'elevated' = 'default'; interactiveSidebarWidth: 'sm' | 'md' | 'lg' = 'md'; interactiveHeaderHeight: 'sm' | 'md' | 'lg' = 'md'; interactiveFooterVariant: 'minimal' | 'standard' | 'detailed' = 'standard'; interactiveSidebarCollapsed = false; interactiveMobileMenuOpen = false; interactiveShowFooter = true; interactiveShowBreadcrumbs = true; interactiveShowNotifications = true; // Demo state activeSection = 'dashboard'; isDarkTheme = false; notificationCount = 3; hasNewNotifications = true; emailNotifications = true; lastUpdated = new Date().toLocaleTimeString(); connectionStatus = 'Connected'; handleSidebarToggle(collapsed: boolean): void { this.interactiveSidebarCollapsed = collapsed; console.log('Sidebar toggled:', collapsed); } handleMobileMenuToggle(open: boolean): void { this.interactiveMobileMenuOpen = open; console.log('Mobile menu toggled:', open); } handleMobileBackdropClick(): void { this.interactiveMobileMenuOpen = false; console.log('Mobile backdrop clicked - closing menu'); } toggleSidebar(): void { this.interactiveSidebarCollapsed = !this.interactiveSidebarCollapsed; } toggleTheme(): void { this.isDarkTheme = !this.isDarkTheme; console.log('Theme toggled:', this.isDarkTheme ? 'dark' : 'light'); } showNotification(): void { this.notificationCount++; this.hasNewNotifications = true; console.log('New notification added'); } dismissNotification(): void { this.hasNewNotifications = false; console.log('Notification dismissed'); } setActiveSection(section: string): void { this.activeSection = section; this.lastUpdated = new Date().toLocaleTimeString(); console.log('Active section changed to:', section); } performAction(action: string): void { console.log('Action performed:', action); this.lastUpdated = new Date().toLocaleTimeString(); switch (action) { case 'save': this.connectionStatus = 'Saving...'; setTimeout(() => { this.connectionStatus = 'Saved'; setTimeout(() => this.connectionStatus = 'Connected', 2000); }, 1000); break; case 'refresh': this.connectionStatus = 'Refreshing...'; setTimeout(() => this.connectionStatus = 'Connected', 1500); break; case 'new': case 'export': case 'cancel': // Handle other actions break; } } }& }xc H SidebarLayoutIsidebar-layout/sidebar-layout+sidebar-layoutBC SidebarLayoutESidebar LayoutPosition ?Position VariantsqC~+9 Left Sidebar (Default) :idebar- sidebar-layout position="left"k$ d(h5>Left . "
  • #
  • #
  • - O/ 2ain Content Area`0- with left sidebar navigationp/  :idebar- sidebar-layout position="right"k$ d(h5>Right PanelQuick A!Fp2 Recent Item1 Help`2P@2ain Content Area`0- with right sidebar panelp/ $'Content area with {{ variant }} sidebarh7 :idebar- 7sidebar-layout [collapsed]="true" collapseMode="collaps@ d( h5>Nav :idebar- 6sidebar-layout [collapsed]="true" collapseMode="hiddenA7` d(h5>Hidden SidebarLeft' right">Right\Width.Width" z xl">Extra a:O /Collapsed">  G Collapse Mode. CollapseMode"collapsed">Collapsed'hidden">Hidden'overlay">Overlay;"$sidebar-demo-container sidebar"-;sidebar-layout [position]="interactivePosition<#)Width" o*#!collapsed]="interactive$'collapseMode]="interactiveCollapseMode"/ ` d(Interactive Sidebar(naA"$ User1#*
  • ❓ Help`2P_ n.09%emo`0@Use the controls above to test different sidebar configurations:q0!Positionq1Position?1%Widthq1:1*0L2" Collapsed?1% Collapse Modeq1 CollapseMode?1Ooo&O (click)="toggleCollapse()" class="demo-buttonA',Collapsed ? 'Expand' : 'Collapse' }} Sidebar&%_ q %Hsidebar-layoutI&JSidebarLayoutDemoComponent { widths = ['sm', 'md', 'lg', 'xl'] as const;FIAK,2Position: 'left' | 'right' = 'left'; interactiveK| 'xlK2KG:L SCollapseMode: 'hidden' | 'collapsed' | 'overlay' = 'collapsed'; toggleCollapseO-Collapsed = !this.interactiveCollapsed; } };:P xfimport { Component, ChangeDetectionStrategy, signal, computed } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { FilterConfig, SortConfig, GroupByResult } from '../../../../../ui-data-utils/src/lib/types'; import { sortBy, sortByMultiple } from '../../../../../ui-data-utils/src/lib/sorting'; import { filterBy, filterByMultiple, searchFilter } from '../../../../../ui-data-utils/src/lib/filtering'; import { getPaginationRange, paginate } from '../../../../../ui-data-utils/src/lib/pagination'; import { aggregate, groupBy, pivot, pluck, unique } from '../../../../../ui-data-utils/src/lib/transformation'; interface SampleData { id: number; name: string; department: string; salary: number; hireDate: string; active: boolean; skills: string[]; } @Component({ selector: 'ui-data-utils-demo', standalone: true, imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    UI Data Utils Demo

    Comprehensive demonstration of data manipulation utilities

    Sample Employee Data ({{ sampleData.length }} records)

    Raw Data Preview:

    {{ getSampleDataPreview() }}

    🔄 Sorting Utilities

    Single Property Sort

    {{ getSortedDataPreview() }}

    Multi-column Sort

    Department → Salary → Name

    {{ getMultiSortedDataPreview() }}

    🔍 Filtering Utilities

    Search Filter

    {{ getSearchFilteredDataPreview() }}

    Property Filters

    {{ getPropertyFilteredDataPreview() }}

    📄 Pagination Utilities

    of {{ paginationResult().totalPages }}
    Page Navigation: @for (page of pageRange(); track page) { @if (page === 'ellipsis') { ... } @else { } }

    Showing: {{ getItemRangeText() }}

    {{ getPaginatedDataPreview() }}

    🔄 Transformation Utilities

    Group By Department

    {{ getGroupedDataPreview() }}

    Salary Statistics by Department

    {{ getAggregationPreview() }}

    Extract Names & Salaries

    {{ getPluckedDataPreview() }}

    Pivot: Department vs Active Status

    {{ getPivotDataPreview() }}

    🔄 Combined Operations

    Demonstrate chaining multiple operations: Filter → Sort → Paginate

    Pipeline: {{ sampleData.length }} records → {{ combinedFiltered().length }} filtered → {{ combinedSorted().length }} sorted → {{ combinedPaginated().data.length }} on page {{ combinedPaginated().page }} 

    {{ getCombinedResultPreview() }}

    📊 Performance & Statistics

    Total Records

    {{ sampleData.length }}

    Departments

    {{ getDepartmentCount() }}

    Avg Salary

    {{ getAverageSalary() }}

    Active Employees

    {{ getActiveCount() }}%

    💻 Code Examples

    Sorting Examples:

    // Single sort
const sorted = sortBy(data, {{ '{' }} key: 'salary', direction: 'desc', dataType: 'number' {{ '}' }});

// Multi-column sort  
const multiSorted = sortByMultiple(data, {{ '{' }}
  sorts: [
    {{ '{' }} key: 'department', direction: 'asc', dataType: 'string' {{ '}' }},
    {{ '{' }} key: 'salary', direction: 'desc', dataType: 'number' {{ '}' }}
  ]
{{ '}' }});

    Filtering Examples:

    // Property filter
const filtered = filterBy(data, {{ '{' }}
  key: 'salary',
  operator: 'greater_than',
  value: 50000,
  dataType: 'number'
{{ '}' }});

// Search across multiple properties
const searched = searchFilter(data, 'engineer', ['name', 'department']);

    Pagination Examples:

    // Paginate data
const paginatedResult = paginate(data, {{ '{' }} page: 1, pageSize: 10 {{ '}' }});

// Get page range for UI
const range = getPaginationRange(currentPage, totalPages, 7);

    Transformation Examples:

    // Group by property
const groups = groupBy(data, 'department');

// Aggregate values
const stats = aggregate(data, 'salary', ['sum', 'avg', 'min', 'max']);

// Extract specific properties
const names = pluck(data, ['name', 'salary']);

    📚 Library Information

    UI Data Utils Features:

    🔄 Sorting
    • Single & multi-column sorting
    • Type-aware comparisons
    • Stable sort algorithms
    • Custom comparator functions
    🔍 Filtering
    • Multiple filter operators
    • Search across properties
    • Complex filter combinations
    • Type-specific filtering
    📄 Pagination
    • Client-side pagination
    • Page range calculations
    • Pagination metadata
    • Navigation utilities
    🔄 Transformation
    • Group by operations
    • Data aggregations
    • Property extraction
    • Pivot tables
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 1rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(279, 14%, 35%); font-size: 1.2rem; margin-bottom: 0.5rem; } h5 { color: hsl(279, 14%, 45%); font-size: 1rem; margin-bottom: 0.5rem; } section { border: 1px solid #e9ecef; padding: 1.5rem; border-radius: 8px; background: #ffffff; } pre { margin: 0; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: 0.85rem; line-height: 1.4; } code { color: hsl(279, 14%, 15%); } button:hover:not(:disabled) { opacity: 0.8; } button:disabled { opacity: 0.5; cursor: not-allowed; } input, select { border: 1px solid #ccc; border-radius: 4px; padding: 0.25rem; } label { font-weight: 500; } `] }) export class DataUtilsDemoComponent { // Sample data sampleData: SampleData[] = [ { id: 1, name: 'Alice Johnson', department: 'Engineering', salary: 95000, hireDate: '2022-01-15', active: true, skills: ['JavaScript', 'Angular', 'TypeScript'] }, { id: 2, name: 'Bob Smith', department: 'Marketing', salary: 65000, hireDate: '2021-03-22', active: true, skills: ['SEO', 'Content Marketing'] }, { id: 3, name: 'Charlie Brown', department: 'Engineering', salary: 87000, hireDate: '2023-02-10', active: false, skills: ['React', 'Node.js'] }, { id: 4, name: 'Diana Davis', department: 'Sales', salary: 72000, hireDate: '2020-11-05', active: true, skills: ['CRM', 'Negotiation'] }, { id: 5, name: 'Eve Wilson', department: 'Engineering', salary: 102000, hireDate: '2021-08-18', active: true, skills: ['Python', 'Machine Learning'] }, { id: 6, name: 'Frank Miller', department: 'HR', salary: 58000, hireDate: '2022-05-30', active: false, skills: ['Recruiting', 'Employee Relations'] }, { id: 7, name: 'Grace Lee', department: 'Marketing', salary: 69000, hireDate: '2023-01-12', active: true, skills: ['Brand Management', 'Social Media'] }, { id: 8, name: 'Henry Taylor', department: 'Sales', salary: 78000, hireDate: '2021-12-03', active: true, skills: ['Sales Strategy', 'Lead Generation'] }, { id: 9, name: 'Ivy Chen', department: 'Engineering', salary: 91000, hireDate: '2022-09-14', active: true, skills: ['Vue.js', 'GraphQL'] }, { id: 10, name: 'Jack White', department: 'HR', salary: 62000, hireDate: '2020-04-25', active: false, skills: ['Payroll', 'Benefits Administration'] } ]; // Sorting controls sortField = signal('name'); sortDesc = signal(false); // Filtering controls searchTerm = signal(''); filterDepartment = signal(''); minSalary = signal(null); // Pagination controls currentPage = signal(1); pageSize = signal(5); // Combined demo controls combinedActiveFilter = signal(''); combinedSortField = signal('name'); combinedSortDesc = signal(false); // Computed data sortedData = computed(() => { const config: SortConfig = { key: this.sortField(), direction: this.sortDesc() ? 'desc' : 'asc', dataType: this.getDataType(this.sortField()) }; return sortBy(this.sampleData, config); }); multiSortedData = computed(() => { return sortByMultiple(this.sampleData, { sorts: [ { key: 'department', direction: 'asc', dataType: 'string' }, { key: 'salary', direction: 'desc', dataType: 'number' }, { key: 'name', direction: 'asc', dataType: 'string' } ] }); }); searchFilteredData = computed(() => { if (!this.searchTerm()) return this.sampleData; return searchFilter(this.sampleData, this.searchTerm(), ['name', 'department']); }); propertyFilteredData = computed(() => { let filtered = this.sampleData; const filters: FilterConfig[] = []; if (this.filterDepartment()) { filters.push({ key: 'department', operator: 'equals', value: this.filterDepartment(), dataType: 'string' }); } if (this.minSalary() !== null) { filters.push({ key: 'salary', operator: 'greater_than_equal', value: this.minSalary(), dataType: 'number' }); } return filters.length > 0 ? filterByMultiple(filtered, filters) : filtered; }); paginationResult = computed(() => { return paginate(this.sampleData, { page: this.currentPage(), pageSize: this.pageSize() }); }); pageRange = computed(() => { return getPaginationRange(this.currentPage(), this.paginationResult().totalPages, 7); }); // Combined operations combinedFiltered = computed(() => { if (!this.combinedActiveFilter()) return this.sampleData; return filterBy(this.sampleData, { key: 'active', operator: 'equals', value: this.combinedActiveFilter() === 'true', dataType: 'boolean' }); }); combinedSorted = computed(() => { return sortBy(this.combinedFiltered(), { key: this.combinedSortField(), direction: this.combinedSortDesc() ? 'desc' : 'asc', dataType: this.getDataType(this.combinedSortField()) }); }); combinedPaginated = computed(() => { return paginate(this.combinedSorted(), { page: 1, pageSize: 5 }); }); // Helper methods private getDataType(key: keyof SampleData): 'string' | 'number' | 'date' | 'boolean' { switch (key) { case 'salary': case 'id': return 'number'; case 'hireDate': return 'date'; case 'active': return 'boolean'; default: return 'string'; } } getSampleDataPreview(): string { return JSON.stringify(this.sampleData.slice(0, 3), null, 2); } getSortedDataPreview(): string { return JSON.stringify(this.sortedData().slice(0, 3).map((item: SampleData) => ({ name: item.name, [this.sortField()]: item[this.sortField()] })), null, 2); } getMultiSortedDataPreview(): string { return JSON.stringify(this.multiSortedData().slice(0, 4).map((item: SampleData) => ({ name: item.name, department: item.department, salary: item.salary })), null, 2); } getSearchFilteredDataPreview(): string { return JSON.stringify(this.searchFilteredData().slice(0, 3).map((item: SampleData) => ({ name: item.name, department: item.department })), null, 2); } getPropertyFilteredDataPreview(): string { return JSON.stringify(this.propertyFilteredData().slice(0, 3).map((item: SampleData) => ({ name: item.name, department: item.department, salary: item.salary })), null, 2); } getPaginatedDataPreview(): string { return JSON.stringify(this.paginationResult().data.map((item: SampleData) => ({ name: item.name, department: item.department })), null, 2); } getGroupedDataPreview(): string { const grouped = groupBy(this.sampleData, 'department'); return JSON.stringify(grouped.map((group: GroupByResult) => ({ department: group.key, count: group.count, employees: group.items.map((emp: SampleData) => emp.name) })), null, 2); } getAggregationPreview(): string { const grouped = groupBy(this.sampleData, 'department'); const result = grouped.map((group: GroupByResult) => ({ department: group.key, ...aggregate(group.items, 'salary', ['sum', 'avg', 'min', 'max', 'count']) })); return JSON.stringify(result, null, 2); } getPluckedDataPreview(): string { const plucked = pluck(this.sampleData, ['name', 'salary']); return JSON.stringify(plucked.slice(0, 5), null, 2); } getPivotDataPreview(): string { const pivotData = this.sampleData.map(emp => ({ department: emp.department, status: emp.active ? 'Active' : 'Inactive', count: 1 })); const pivotResult = pivot(pivotData, 'department', 'status', 'count', 'sum'); return JSON.stringify(pivotResult, null, 2); } getCombinedResultPreview(): string { return JSON.stringify(this.combinedPaginated().data.map((item: SampleData) => ({ name: item.name, department: item.department, salary: item.salary, active: item.active })), null, 2); } getItemRangeText(): string { const result = this.paginationResult(); if (result.totalItems === 0) return '0 of 0'; return `${result.startIndex + 1}-${result.endIndex + 1} of ${result.totalItems}`; } getDepartmentCount(): number { return unique(this.sampleData, 'department').length; } getAverageSalary(): string { const avg = aggregate(this.sampleData, 'salary', ['avg']); return '$' + Math.round(avg['avg'] || 0).toLocaleString(); } getActiveCount(): number { const activeCount = this.sampleData.filter(emp => emp.active).length; return Math.round((activeCount / this.sampleData.length) * 100); } // Event handlers applySingleSort(): void { // Triggers computed update } applySearchFilter(): void { // Triggers computed update } applyPropertyFilter(): void { // Triggers computed update } updatePagination(): void { // Ensure page is within bounds const maxPage = this.paginationResult().totalPages; if (this.currentPage() > maxPage) { this.currentPage.set(maxPage || 1); } } previousPage(): void { if (this.paginationResult().hasPrevious) { this.currentPage.update(page => page - 1); } } nextPage(): void { if (this.paginationResult().hasNext) { this.currentPage.update(page => page + 1); } } goToPage(page: number | string): void { if (typeof page === 'number') { this.currentPage.set(page); } } updateCombinedDemo(): void { // Triggers computed update } }&xUP=K1:KwUᎮ(؂"(-pB0\"U:;JvADp?a>y7ˏZ$TR "(bJMcʱKw}j',$+*$K1aP %°%1xsCSEE$ 5y$"gYTWЌjɂĽoWwi5NkO UIA3cP5_;h*,.پUfgA0> >x.demo-container { padding: 2rem; max-width: 1200px; margin: 0 auto; h2 { margin-bottom: 1.5rem; font-size: 1.875rem; } } .demo-section { margin-bottom: 3rem; h3 { margin-bottom: 1rem; font-size: 1.25rem; border-bottom: 1px solid #e5e7eb; padding-bottom: 0.5rem; } } .demo-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; } .demo-item { h4 { margin-bottom: 0.75rem; font-size: 1rem; font-weight: 500; color: #6b7280; } } .demo-interactive { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: 0.5rem; background: #f9fafb; } .demo-output { h4 { margin-bottom: 0.5rem; font-size: 1rem; } p { color: #6b7280; margin-bottom: 0.25rem; font-size: 0.875rem; } } .demo-form { padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: 0.5rem; background: #ffffff; } .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-bottom: 1.5rem; } .form-actions { display: flex; gap: 0.75rem; margin-bottom: 1.5rem; } .submit-btn, .reset-btn { padding: 0.5rem 1rem; border-radius: 0.375rem; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease; } .submit-btn { background: #3b82f6; color: white; border: 1px solid #3b82f6; &:hover:not(:disabled) { background: #2563eb; border-color: #2563eb; } &:disabled { opacity: 0.6; cursor: not-allowed; } } .reset-btn { background: transparent; color: #6b7280; border: 1px solid #d1d5db; &:hover { background: #f3f4f6; color: #374151; } } .form-status { background: #f3f4f6; padding: 0.75rem; border-radius: 0.375rem; p { margin-bottom: 0.5rem; font-size: 0.875rem; &:last-child { margin-bottom: 0; } } pre { background: #e5e7eb; padding: 0.5rem; border-radius: 0.25rem; font-size: 0.75rem; overflow-x: auto; } } @media (max-width: 768px) { .demo-row { grid-template-columns: 1fr; } .demo-interactive { grid-template-columns: 1fr; } .form-row { grid-template-columns: 1fr; } }"xR!import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { DatePickerComponent } from '../../../../../ui-essentials/src/lib/components/forms/date-picker/date-picker.component'; @Component({ selector: 'ui-date-picker-demo', standalone: true, imports: [CommonModule, FormsModule, DatePickerComponent], template: `

    Date Picker Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size | uppercase }}

    }

    Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }}

    }

    States

    Default

    Error

    Success

    Warning

    Features

    Required Field

    Disabled

    Not Clearable

    Date Range Limits

    Interactive Example

    Selected Date:

    {{ interactiveValue ? formatDate(interactiveValue) : 'No date selected' }}

    Change count: {{ changeCount }}

    Form Integration

    Form Valid: {{ demoForm.valid }}

    Form Values:

    {{ formValues | json }}
    `, styleUrl: './date-picker-demo.component.scss' }) export class DatePickerDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['outlined', 'filled', 'underlined'] as const; sampleValues: Record = { sm: null, md: null, lg: null }; variantValues: Record = { outlined: null, filled: null, underlined: null }; stateValues: Record = { default: null, error: null, success: new Date(), warning: null }; featureValues: Record = { required: null, disabled: new Date(), notClearable: null, limited: null }; interactiveValue: Date | null = null; changeCount = 0; formValues = { startDate: null as Date | null, endDate: null as Date | null }; // Date limits for demo minDate = new Date(2024, 0, 1); // January 1, 2024 maxDate = new Date(2024, 11, 31); // December 31, 2024 onDateChange(date: Date | null): void { this.changeCount++; console.log('Date changed:', date); } onSubmit(): void { console.log('Form submitted:', this.formValues); alert('Form submitted! Check console for values.'); } resetForm(form: any): void { form.resetForm(); this.formValues = { startDate: null, endDate: null }; } formatDate(date: Date): string { return date.toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }); } }2xo6 ǟsЗg?5e{S.Fl+DɦLA"e'K_:M7VgluWeˢOb:[s[abhetU@=6#?,7߁/ʘޝ5{E2FASQ+v{uР(s>5>%GDTn3e]9 H"eUFASQ欟lmGZR哆aW{j*˨wv&E`%BŒyZ%rݶۅy{TLeyG\lmz DlS4pQ?BH!ȟd۵۪Xa@2I`SoZ+Mj2jg{+M~uqB Y&+򥸫zy|K2S+93eTIW7w8[3Ç xnj8{{-d-JzE)˨tf?*3}U/N)͜e=XX5nCT~añ~lxq1."]|S쟭k~C<7(;Ts! teihz\퉂 Ydk ~&5v0Sen0n%r*U~VǍ3D=HF9I\¥aD2I^n'hQ;>"͡g҅$*mޡK+2i0Ѝ4Zi%l`9nĴ*3ֽڴѢy"Ӯ0ޅsEGiIM>4p Ήp:kN[3\RU?RE Қ m!%s#vSl66IM}ݽ AlrM{ew!9Q .Ef>r,=˃o[ îrG۩mΆ|\k &nrZ=MLO!Z<~Q}>iUF qyd+HvnH[Q^1tWTga5 jX]&]2 ԯНlC`_W/|7NOYּ~WdN+<٨8)U0}9OҢ({?^~hKF.b HC:Yy8GoT@,\U`nTM#2 $1I*vY(2((tQyTeM"*6G+W9ʤ*0& %z*6dtप 1P1J:{ 虑Ҩis3GQeMMdF"IF5,=ql%U(-P&aQQTi1bi`*rJ RTbv&&ATTDbbU@<5qfQ4%BJ5 "gJbGh.&$TMD,]HM#(:,:"^­hfna!+: /%c Pj62b?/A Ͷ;~-3_؅̬enïef4n!Dt)37#x\PaOj|u'3w7*ɟ]̼bE430J?>[&п R5FF)n^d|c^E)H[pk 3aTz8ݽHQ81Ι3sg~/_[p֚B Dv:o;pN '7{WQ>sݨA"؀h`Q38pIZ^ެVfeCux9o4Gtextareatextarea-demo>$ infinite-0) infinite-0 infinite-`/,1w asonrymasonry-demo>4 onversion "app-conversion-demo> } >)??@??CK??Cl???D??Da??$jEo??EA alleryGridF??GDG>?#ConversionDemoComponent, LandingFAQ1?LandingFeatureGridDemoComponent, LandingTestimonialsDemoComponent, LandingLogoCloudDemoComponent, LandingStatisticsDemoComponent, LandingHeader1?=LandingFooterDemoComponent, LandingTeamDemoComponent, Landing, LandingTemplates1?&LandingTemplatesDemoComponent, LandingA, LandingTeamDemoComponent, LandingFooterDemoComponent, LandingHeALandingStatistics1?RLandingFeatureGridDemoComponent, LandingTestimonialsDemoComponent, LandingLogoClouoF)*G\G~]Y @xkws,B|Y6=eܢ8U, 1x4QHw $! q#`$'@u(~#BxrL?ӕH %x$9?  Circle circle-demo/progress-circle RangeSlidrange-slider-demo/range-sli1 Dividivider-demo/divi1 Tooltiptooltip-demo/tooltip  progress-circle  circle-demo>x( import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { DividerComponent } from '../../../../../ui-essentials/src/lib/components/layout'; @Component({ selector: 'ui-divider-demo', standalone: true, imports: [CommonModule, DividerComponent], template: `

    Divider Demo

    Orientation

    Content above

    Content below

    Left content

    Right content

    Style Variants

    Solid divider

    Dashed divider

    Dotted divider

    Thickness

    Thin divider

    Default thickness

    Thick divider

    With Content

    OR Section Break More Content

    Combined Examples

    Dashed Thin Dotted Thick

    Vertical Examples

    Item 1 Item 2 Item 3 Item 4
    `, styleUrl: './divider-demo.component.scss' }) export class DividerDemoComponent {}2s$6x[!5Wj<ҤdĂ̍Ky\}xC_import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faExclamationTriangle, faCheckCircle, faInfoCircle } from '@fortawesome/free-solid-svg-icons'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons'; import { ModalComponent } from '../../../../../ui-essentials/src/lib/components/overlays/modal'; @Component({ selector: 'ui-modal-demo', standalone: true, imports: [CommonModule, FormsModule, FontAwesomeModule, ButtonComponent, ModalComponent], template: `

    Modal Demo

    Basic Usage

    Open Basic Modal

    Sizes

    Small Modal Medium Modal Large Modal XL Modal Fullscreen Modal

    Variants

    Default Warning Danger Success

    Configuration Options

    No Header With Footer No Padding Not Closable

    Interactive Features

    Loading Modal Scrollable Content Form Modal

    Try It Yourself

    Open Custom Modal

    Event Log

    @for (event of eventLog; track $index) {
    {{ event }}
    } @if (eventLog.length === 0) {
    No events yet...
    }
    Clear Log

    This is a basic modal with default settings.

    You can close it by clicking the X button, pressing Escape, or clicking outside the modal.

    This is a small modal (400px width).

    This is a medium modal (600px width) - the default size.

    This is a large modal (800px width).

    Perfect for forms, detailed content, or complex interfaces.

    This is an extra large modal (1000px width).

    Use this for very complex interfaces or wide content.

    This modal takes up the entire screen.

    Perfect for complex applications or immersive experiences.

    This is the default modal variant.

    Are you sure you want to continue? This action cannot be undone.

    Cancel Continue

    This will permanently delete the item. This action cannot be undone.

    Cancel Delete

    Your changes have been saved successfully!

    Close

    Modal without header

    This modal doesn't have a header section.

    Close

    This modal has a footer with buttons aligned between start and end.

    Help
    Cancel Save

    This content spans the full width
    with no padding constraints.

    This modal cannot be closed by clicking the X, pressing Escape, or clicking the backdrop.

    You must use the Close button below.

    Close

    Long Content

    @for (item of longContent; track $index) {

    {{ item }}

    }
    Cancel Submit

    This modal is configured based on your selections:

    • Size: {{ customConfig.size }}
    • Variant: {{ customConfig.variant }}
    • Closable: {{ customConfig.closable ? 'Yes' : 'No' }}
    • Backdrop Closable: {{ customConfig.backdropClosable ? 'Yes' : 'No' }}
    • Show Header: {{ customConfig.showHeader ? 'Yes' : 'No' }}
    • Show Footer: {{ customConfig.showFooter ? 'Yes' : 'No' }}
    @if (customConfig.showFooter) { Close }     `, styleUrl: './modal-demo.component.scss' }) export class ModalDemoComponent { // Icons readonly faExclamationTriangle = faExclamationTriangle; readonly faCheckCircle = faCheckCircle; readonly faInfoCircle = faInfoCircle; // Modal states basicModal = signal(false); smallModal = signal(false); mediumModal = signal(false); largeModal = signal(false); xlModal = signal(false); fullscreenModal = signal(false); defaultModal = signal(false); warningModal = signal(false); dangerModal = signal(false); successModal = signal(false); noHeaderModal = signal(false); noFooterModal = signal(false); noPaddingModal = signal(false); notClosableModal = signal(false); loadingModal = signal(false); scrollableModal = signal(false); formModal = signal(false); customModal = signal(false); // Demo data eventLog: string[] = []; customConfig = { size: 'md' as any, variant: 'default' as any, closable: true, backdropClosable: true, showHeader: true, showFooter: false }; formData = { name: '', email: '', message: '' }; longContent = Array.from({ length: 50 }, (_, i) => `This is paragraph ${i + 1}. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.` ); // Simulate loading constructor() { setTimeout(() => { if (this.loadingModal()) { this.loadingModal.set(false); this.logEvent('Loading completed'); } }, 3000); } logEvent(event: string): void { const timestamp = new Date().toLocaleTimeString(); this.eventLog.unshift(`[${timestamp}] ${event}`); if (this.eventLog.length > 10) { this.eventLog = this.eventLog.slice(0, 10); } } clearEventLog(): void { this.eventLog = []; } handleFormSubmit(): void { this.logEvent(`Form submitted: ${JSON.stringify(this.formData)}`); this.formModal.set(false); // Reset form this.formData = { name: '', email: '', message: '' }; } }Zq.xy頇@Bars, faUser, faCog, faHome, faChartLine, faEnvelope, faQuestion K, DrawerN3 public-api!drawergDrawerEDrawerDrawer%Bars% Open Basic Drawer - &Position?Position G eftDrawer.set(true)">Left Drawer-#rightDrawer.set(true)">Right Drawer-topDrawer.set(true)">Top Drawer-%bottomDrawer.set(true)">Bottom Drawer- &Drawer.set(true)">Small Drawer-%mediumDrawer.set(true)">Medium Drawer-#largeDrawer.set(true)">Large Drawer-xlDrawer.set(true)">XL Drawer- &-DrawerBwithFooterDrawer. MDrawer C&persistentDrawer.set(true)">Persistent-0)- Drawer Drawer.set(true)">Loading Drawer-scrollableDrawer( K-navigationDrawer.set(true)">Navigation Drawer- &- `\Position88 position" left">Left  right">Right top">Top bottom">Bottom r @VW + @%persistent"> Persistent :$Drawer.set(true)">Open Custom Drawer- &3Drawer -->

    Content below can still have its own padding}+6drawer>

    It stays open until explicitly closed and doesn't block inter action with the rest of the page1navigation menus that should remain visible.

    persistentDrawer&,4 Drawer     |%Home% Home |% ChartLine% Dashboard |%User% Profile |%Envelope% Messages |%Cog% Settings `, styleUrl: './drawer&;&DrawerQ;(Bars = faBars; readonly faUser = faUser; readonly faCog = faCog; readonly faHome = faHome; readonly faChartLine = faChartLine; readonly faEnvelope = faEnvelope; readonly faQuestionCircle = faQuestionCircle; // Drawer states basicDrawer =< leftDrawer< rightDrawer< topDrawer< bottomDrawer< smallDrawer< mediumDrawer< largeDrawer<xlDrawer<noHeaderDrawer<withFooterDrawer<= Drawer<persistentDrawer<= Drawer< loadingDrawer=Drawer<navigationDrawer >Drawer?>nposition: 'lef>f, persistent: falsee?&Drawer()) { this.loadingDrawer5A{}|#Ex[xqC8o~Jbs~nA~^j^BBZQ~FEҤdĂL?;/FxyÆ@Bars, faUser, faCog, faHome, faChartLine, faEnvelope, faQuestion MDrawer^^drawergDrawer-EDrawerwDrawer/'%Bars Open Basic DrawerXDPosition? PositionsE!leftDrawer.set(true)">Left Drawer-#rightDrawer.set(true)">Right Drawer-topDrawer.set(true)">Top Drawer-%bottomDrawer.set(true)">Bottom Drawer$Drawer.set(true)">Small Drawer-%mediumDrawer.set(true)">Medium Drawer-#largeDrawer.set(true)">Large Drawer-xlDrawer.set(true)">XL Drawer$DrawerBwithFooterDrawerMDrawer# C%persistentDrawer.set(true)">Persisten.notClosableDrawerv Drawer.set(true)">Loading Drawer- Drawer K-navigationDrawer.set(true)">Navigation Drawer$| x \Position 8 position" left">Left ' right">Right 'top">Top ' bottom">Botto x \_ +_@%persistent"> Persistent <*customDrawer.set(true)">Open Custom Drawer$k3Drawer --> Ideal for detailed content, forms&.drawer>

    Content below can still have its own padding +6drawer>

    It stays open until explicitly closed and doesn't block interlaction with the rest of the page.

    Perfect for navigation menus that should remain visible.

    ApersistentDrawer5&,4 Drawer     %Home Home % ChartLine Dashboard %User Profile %Envelope Messages %Cog Settings f, persistent: false?&Drawer()) { this.loadingDrawer@{}]Zx!

    Empty State Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size }} size

    }

    Variants

    Default

    Search

    Error

    Loading

    Success

    States

    Normal

    Disabled

    No Action

    Custom Content

    This is custom content projected into the empty state component. You can add any HTML or Angular components here.

    With Content Projection

    Interactive Example

    Action clicked: {{ lastAction || 'None' }}

    Click count: {{ clickCount }}

    • `, styleUrl: './empty-state-demo.component.scss' }) export class EmptyStateDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'search', 'error', 'loading', 'success'] as const; clickCount = 0; lastAction: string | null = null; handleDemoClick(action: string): void { this.clickCount++; this.lastAction = action; console.log('Empty state action clicked:', action); } }I =jQx;yŽ^*Jxzz*ap\ѼJZ r9ͺ%ce5 xjRimport { Component, ChangeDetectionStrategy, OnInit, TemplateRef, ViewChild, AfterViewInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { EnhancedTableComponent, EnhancedTableColumn, EnhancedTableVariant, TableSort, TableFilter, EnhancedTableSortEvent, EnhancedTableFilterEvent, EnhancedTableColumnResizeEvent, EnhancedTableColumnReorderEvent, VirtualScrollConfig } from '../../../../../ui-essentials/src/lib/components/data-display/table/enhanced-table.component'; import { StatusBadgeComponent } from '../../../../../ui-essentials/src/lib/components/feedback/status-badge.component'; interface Employee { id: number; name: string; email: string; department: string; position: string; salary: number; status: 'active' | 'inactive' | 'pending'; joinDate: string; performance: number; location: string; } @Component({ selector: 'ui-enhanced-table-demo', standalone: true, imports: [ CommonModule, FormsModule, EnhancedTableComponent, StatusBadgeComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Enhanced Table Component Showcase

    Enterprise-grade data table with virtual scrolling, column resizing/reordering, and advanced filtering.

    Basic Enhanced Table

    Table Variants

    Striped Enhanced Table

    Bordered Enhanced Table

    Minimal Enhanced Table

    Virtual Scrolling ({{ largeDataset.length.toLocaleString() }} Records)

    Virtual scrolling efficiently handles large datasets by only rendering visible rows. Performance metrics are displayed below the table.

    @if (performanceMetrics) {

    Performance Metrics:

    Render Time: {{ performanceMetrics.renderTime }}ms
    Sort Time: {{ performanceMetrics.sortTime }}ms
    Filter Time: {{ performanceMetrics.filterTime }}ms
    Visible Rows: {{ performanceMetrics.visibleRows }}
    }

    Advanced Features with Custom Cell Templates

    {{ value | titlecase }} {{ value | currency:'USD':'symbol':'1.0-0' }}
    {{ value }}%

    Interactive Column Configuration

    Usage Examples

    Basic Enhanced Table:

    <ui-enhanced-table 
  [data]="employees"
  [columns]="columns"
  variant="default"
  [enableColumnResize]="true"
  [enableColumnReorder]="true"
  [showFilters]="true"
  [height]="500"
  (sort)="handleSort($event)"
  (filter)="handleFilter($event)">
</ui-enhanced-table>

    With Virtual Scrolling:

    <ui-enhanced-table 
  [data]="largeDataset"
  [columns]="columns"
  [virtualScrollConfig]="{{ '{' }} 
    enabled: true, 
    itemHeight: 48, 
    bufferSize: 10 
  {{ '}' }}"
  [height]="600">
</ui-enhanced-table>

    Column Configuration:

    columns: EnhancedTableColumn[] = [
  {{ '{' }} 
    key: 'name', 
    label: 'Name', 
    width: 150,
    sortable: true,
    filterable: true,
    filterType: 'text',
    resizable: true,
    draggable: true
  {{ '}' }},
  {{ '{' }} 
    key: 'salary', 
    label: 'Salary', 
    width: 120,
    sortable: true,
    filterable: true,
    filterType: 'number',
    resizable: true
  {{ '}' }}
];

    Interactive Demo Controls

    @if (lastAction) {
    Last Action: {{ lastAction }}
    }
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } label { cursor: pointer; font-weight: 500; } input[type="checkbox"] { cursor: pointer; } `] }) export class EnhancedTableDemoComponent implements OnInit, AfterViewInit { @ViewChild('statusTemplate') statusTemplate!: TemplateRef; @ViewChild('salaryTemplate') salaryTemplate!: TemplateRef; @ViewChild('performanceTemplate') performanceTemplate!: TemplateRef; @ViewChild('actionsTemplate') actionsTemplate!: TemplateRef; // Demo state lastAction = ''; performanceMetrics: any = null; // Configuration enableResize = true; enableReorder = true; showTableFilters = true; enableVirtual = false; // Cell templates cellTemplates: Record> = {}; // Virtual scroll config virtualConfig: VirtualScrollConfig = { enabled: true, itemHeight: 48, buffer: 10 }; configVirtualConfig: VirtualScrollConfig = { enabled: false, itemHeight: 48, buffer: 10 }; // Sample data smallDataset: Employee[] = []; largeDataset: Employee[] = []; configDataset: Employee[] = []; // Column definitions basicColumns: EnhancedTableColumn[] = [ { key: 'name', label: 'Name', width: 150, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'email', label: 'Email', width: 200, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'department', label: 'Department', width: 140, sortable: true, filterable: true, filterType: 'select', filterOptions: this.getDepartmentOptions(), resizable: true, draggable: true }, { key: 'position', label: 'Position', width: 160, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'joinDate', label: 'Join Date', width: 120, sortable: true, filterable: true, filterType: 'date', resizable: true, draggable: true } ]; performanceColumns: EnhancedTableColumn[] = [ { key: 'name', label: 'Name', width: 120, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true, sticky: true }, { key: 'department', label: 'Department', width: 120, sortable: true, filterable: true, filterType: 'select', filterOptions: this.getDepartmentOptions(), resizable: true, draggable: true }, { key: 'position', label: 'Position', width: 140, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'salary', label: 'Salary', width: 100, sortable: true, filterable: true, filterType: 'number', resizable: true, draggable: true, align: 'right' }, { key: 'performance', label: 'Performance', width: 120, sortable: true, filterable: true, filterType: 'number', resizable: true, draggable: true }, { key: 'location', label: 'Location', width: 120, sortable: true, filterable: true, filterType: 'select', filterOptions: this.getLocationOptions(), resizable: true, draggable: true } ]; advancedColumns: EnhancedTableColumn[] = [ { key: 'name', label: 'Name', width: 150, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'email', label: 'Email', width: 200, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'status', label: 'Status', width: 100, sortable: true, filterable: true, filterType: 'select', filterOptions: this.getStatusOptions(), resizable: true, draggable: true, align: 'center' }, { key: 'salary', label: 'Salary', width: 120, sortable: true, filterable: true, filterType: 'number', resizable: true, draggable: true, align: 'right' }, { key: 'performance', label: 'Performance', width: 140, sortable: true, filterable: true, filterType: 'number', resizable: true, draggable: true }, { key: 'actions', label: 'Actions', width: 100, resizable: true, align: 'center' } ]; configColumns: EnhancedTableColumn[] = [ { key: 'name', label: 'Name', width: 150, sortable: true, filterable: true, filterType: 'text', resizable: true, draggable: true }, { key: 'department', label: 'Department', width: 140, sortable: true, filterable: true, filterType: 'select', filterOptions: this.getDepartmentOptions(), resizable: true, draggable: true }, { key: 'salary', label: 'Salary', width: 120, sortable: true, filterable: true, filterType: 'number', resizable: true, draggable: true, align: 'right' }, { key: 'joinDate', label: 'Join Date', width: 120, sortable: true, filterable: true, filterType: 'date', resizable: true, draggable: true } ]; ngOnInit(): void { this.initializeData(); } ngAfterViewInit(): void { // Set up cell templates after view init setTimeout(() => { this.cellTemplates = { 'status': this.statusTemplate, 'salary': this.salaryTemplate, 'performance': this.performanceTemplate, 'actions': this.actionsTemplate }; }); } // Event handlers handleSort(event: EnhancedTableSortEvent): void { this.lastAction = `Sorted by ${event.sorting.map(s => `${s.column} (${s.direction})`).join(', ')}`; console.log('Sort event:', event); } handleFilter(event: EnhancedTableFilterEvent): void { this.lastAction = `Filtered: ${event.filters.length} filters active`; console.log('Filter event:', event); } handleColumnResize(event: EnhancedTableColumnResizeEvent): void { this.lastAction = `Resized column "${event.column}" to ${event.width}px`; console.log('Column resize event:', event); } handleColumnReorder(event: EnhancedTableColumnReorderEvent): void { this.lastAction = `Reordered columns from index ${event.fromIndex} to ${event.toIndex}`; console.log('Column reorder event:', event); } handleRowClick(event: {row: Employee, index: number}): void { this.lastAction = `Clicked row: ${event.row.name} (index: ${event.index})`; console.log('Row click:', event); } editEmployee(employee: Employee): void { this.lastAction = `Editing employee: ${employee.name}`; console.log('Edit employee:', employee); } // Configuration updates updateTableConfig(): void { this.configVirtualConfig = { ...this.configVirtualConfig, enabled: this.enableVirtual }; this.lastAction = `Updated table configuration`; } // Template helpers getStatusVariant(status: string): 'success' | 'warning' | 'danger' | 'info' | 'neutral' | 'primary' | 'secondary' { switch (status?.toLowerCase()) { case 'active': return 'success'; case 'pending': return 'warning'; case 'inactive': return 'danger'; default: return 'neutral'; } } getPerformanceColor(performance: number): string { if (performance >= 90) return '#28a745'; if (performance >= 80) return '#17a2b8'; if (performance >= 70) return '#ffc107'; return '#dc3545'; } // Filter options getDepartmentOptions() { return [ { label: 'Engineering', value: 'Engineering' }, { label: 'Marketing', value: 'Marketing' }, { label: 'Sales', value: 'Sales' }, { label: 'HR', value: 'HR' }, { label: 'Finance', value: 'Finance' } ]; } getStatusOptions() { return [ { label: 'Active', value: 'active' }, { label: 'Inactive', value: 'inactive' }, { label: 'Pending', value: 'pending' } ]; } getLocationOptions() { return [ { label: 'New York', value: 'New York' }, { label: 'San Francisco', value: 'San Francisco' }, { label: 'London', value: 'London' }, { label: 'Toronto', value: 'Toronto' }, { label: 'Sydney', value: 'Sydney' } ]; } // Demo actions addRandomEmployee(): void { const names = ['John Doe', 'Jane Smith', 'Mike Johnson', 'Sarah Wilson', 'Tom Anderson', 'Lisa Brown', 'David Clark', 'Emma Davis']; const departments = ['Engineering', 'Marketing', 'Sales', 'HR', 'Finance']; const positions = ['Manager', 'Developer', 'Analyst', 'Coordinator', 'Specialist']; const statuses: ('active' | 'inactive' | 'pending')[] = ['active', 'inactive', 'pending']; const locations = ['New York', 'San Francisco', 'London', 'Toronto', 'Sydney']; const newEmployee: Employee = { id: Math.max(...this.smallDataset.map(e => e.id), 0) + 1, name: names[Math.floor(Math.random() * names.length)], email: `user${Date.now()}@company.com`, department: departments[Math.floor(Math.random() * departments.length)], position: positions[Math.floor(Math.random() * positions.length)], salary: Math.floor(Math.random() * 100000) + 50000, status: statuses[Math.floor(Math.random() * statuses.length)], joinDate: new Date(2020 + Math.floor(Math.random() * 5), Math.floor(Math.random() * 12), Math.floor(Math.random() * 28) + 1).toISOString().split('T')[0], performance: Math.floor(Math.random() * 41) + 60, location: locations[Math.floor(Math.random() * locations.length)] }; this.smallDataset = [...this.smallDataset, newEmployee]; this.configDataset = [...this.configDataset, newEmployee]; this.lastAction = `Added new employee: ${newEmployee.name}`; } generateLargeDataset(): void { this.largeDataset = this.createLargeDataset(10000); this.performanceMetrics = { renderTime: Math.floor(Math.random() * 50) + 10, sortTime: 0, filterTime: 0, visibleRows: Math.min(10, this.largeDataset.length) }; this.lastAction = `Generated ${this.largeDataset.length.toLocaleString()} employee records`; } clearAllEmployees(): void { this.smallDataset = []; this.largeDataset = []; this.configDataset = []; this.performanceMetrics = null; this.lastAction = 'Cleared all employee data'; } resetDemo(): void { this.initializeData(); this.lastAction = 'Demo reset to initial state'; } // Data generation private initializeData(): void { this.smallDataset = this.createSmallDataset(); this.configDataset = [...this.smallDataset]; this.largeDataset = this.createLargeDataset(50000); this.performanceMetrics = { renderTime: Math.floor(Math.random() * 30) + 10, sortTime: 0, filterTime: 0, visibleRows: Math.min(10, this.largeDataset.length) }; } private createSmallDataset(): Employee[] { return [ { id: 1, name: 'Alice Johnson', email: 'alice.johnson@company.com', department: 'Engineering', position: 'Senior Developer', salary: 95000, status: 'active', joinDate: '2022-01-15', performance: 92, location: 'San Francisco' }, { id: 2, name: 'Bob Smith', email: 'bob.smith@company.com', department: 'Marketing', position: 'Marketing Manager', salary: 78000, status: 'active', joinDate: '2021-06-10', performance: 85, location: 'New York' }, { id: 3, name: 'Carol Williams', email: 'carol.williams@company.com', department: 'Sales', position: 'Sales Representative', salary: 65000, status: 'pending', joinDate: '2023-03-22', performance: 78, location: 'London' }, { id: 4, name: 'David Brown', email: 'david.brown@company.com', department: 'HR', position: 'HR Specialist', salary: 58000, status: 'active', joinDate: '2022-08-05', performance: 88, location: 'Toronto' }, { id: 5, name: 'Eve Davis', email: 'eve.davis@company.com', department: 'Finance', position: 'Financial Analyst', salary: 72000, status: 'active', joinDate: '2021-11-18', performance: 91, location: 'Sydney' }, { id: 6, name: 'Frank Miller', email: 'frank.miller@company.com', department: 'Engineering', position: 'DevOps Engineer', salary: 88000, status: 'inactive', joinDate: '2020-04-12', performance: 82, location: 'San Francisco' } ]; } private createLargeDataset(count: number): Employee[] { const dataset: Employee[] = []; const firstNames = ['Alice', 'Bob', 'Carol', 'David', 'Eve', 'Frank', 'Grace', 'Henry', 'Ivy', 'Jack']; const lastNames = ['Johnson', 'Smith', 'Williams', 'Brown', 'Davis', 'Miller', 'Wilson', 'Moore', 'Taylor', 'Anderson']; const departments = ['Engineering', 'Marketing', 'Sales', 'HR', 'Finance']; const positions = ['Manager', 'Senior Developer', 'Developer', 'Analyst', 'Coordinator', 'Specialist', 'Representative']; const statuses: ('active' | 'inactive' | 'pending')[] = ['active', 'inactive', 'pending']; const locations = ['New York', 'San Francisco', 'London', 'Toronto', 'Sydney']; for (let i = 0; i < count; i++) { const firstName = firstNames[Math.floor(Math.random() * firstNames.length)]; const lastName = lastNames[Math.floor(Math.random() * lastNames.length)]; dataset.push({ id: i + 1000, name: `${firstName} ${lastName}`, email: `${firstName.toLowerCase()}.${lastName.toLowerCase()}@company.com`, department: departments[Math.floor(Math.random() * departments.length)], position: positions[Math.floor(Math.random() * positions.length)], salary: Math.floor(Math.random() * 100000) + 50000, status: statuses[Math.floor(Math.random() * statuses.length)], joinDate: new Date(2020 + Math.floor(Math.random() * 5), Math.floor(Math.random() * 12), Math.floor(Math.random() * 28) + 1).toISOString().split('T')[0], performance: Math.floor(Math.random() * 41) + 60, location: locations[Math.floor(Math.random() * locations.length)] }); } return dataset; } deleteEmployee(id: number): void { this.smallDataset = this.smallDataset.filter(emp => emp.id !== id); this.configDataset = this.configDataset.filter(emp => emp.id !== id); this.lastAction = `Deleted employee with ID: ${id}`; } }ɚ;x"Tݭ-TemplateRef, ViewChildZRTablNC )TableAction, TableActionsOB 3table-actions.component'; import type { TableColumnX9 +table.component'; import type { TableSortEvU< )interface User46-!role: string; lastLogin: string_ D&(, TableActionsE{

    Sizes

    @for (size of sizes; track size) {

    {{ size | titlecase }}

    }

    Color Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }}

    }

    Direction Variants

    @for (direction of directions; track direction) {

    {{ direction | titlecase }}

    }

    Fixed Positions

    These examples show fixed positioning variants (click to activate):

    @for (position of positions; track position) { }
    @if (activePositionDemo) { }

    States

    Disabled

    No Backdrop

    Stay Open

    Advanced Examples

    Mixed Item Variants

    Large Menu with Icons

    Event Log

    @if (eventLog.length === 0) {

    No events yet. Interact with the FAB menus above.

    } @else { @for (event of eventLog.slice(-10); track $index) {
    {{ event.timestamp | date:'HH:mm:ss' }} {{ event.message }}
    } }
    `, styleUrl: './fab-menu-demo.component.scss' }) export class FabMenuDemoComponent { sizes: FabMenuSize[] = ['sm', 'md', 'lg']; variants: FabMenuVariant[] = ['primary', 'secondary', 'success', 'danger']; directions: FabMenuDirection[] = ['up', 'down', 'left', 'right']; positions: FabMenuPosition[] = ['bottom-right', 'bottom-left', 'top-right', 'top-left']; activePositionDemo: FabMenuPosition | null = null; eventLog: Array<{timestamp: Date, message: string}> = []; // Icons (using simple text for demo - could be replaced with FontAwesome or other icon library) plusIcon = '+'; closeIcon = '×'; menuIcon = '☰'; settingsIcon = '⚙'; appsIcon = '⊞'; basicMenuItems: FabMenuItem[] = [ { id: 'action1', label: 'Action 1', icon: '📝' }, { id: 'action2', label: 'Action 2', icon: '📁' }, { id: 'action3', label: 'Action 3', icon: '📊' } ]; positionMenuItems: FabMenuItem[] = [ { id: 'close', label: 'Close Menu', icon: '×' }, { id: 'home', label: 'Go Home', icon: '🏠' }, { id: 'profile', label: 'Profile', icon: '👤' }, { id: 'settings', label: 'Settings', icon: '⚙' } ]; mixedMenuItems: FabMenuItem[] = [ { id: 'save', label: 'Save', variant: 'success', icon: '💾' }, { id: 'edit', label: 'Edit', variant: 'primary', icon: '✏️' }, { id: 'delete', label: 'Delete', variant: 'danger', icon: '🗑️' }, { id: 'disabled', label: 'Disabled', disabled: true, icon: '🚫' } ]; iconMenuItems: FabMenuItem[] = [ { id: 'email', label: 'Email', icon: '📧' }, { id: 'calendar', label: 'Calendar', icon: '📅' }, { id: 'documents', label: 'Documents', icon: '📄' }, { id: 'photos', label: 'Photos', icon: '📸' }, { id: 'music', label: 'Music', icon: '🎵' }, { id: 'videos', label: 'Videos', icon: '🎬' } ]; getVariantMenuItems(variant: FabMenuVariant): FabMenuItem[] { return [ { id: `${variant}1`, label: `${variant} Item 1`, variant }, { id: `${variant}2`, label: `${variant} Item 2`, variant }, { id: `${variant}3`, label: `${variant} Item 3`, variant } ]; } handleItemClick(event: {item: FabMenuItem, event: Event}): void { this.logEvent(`Item clicked: ${event.item.label} (${event.item.id})`); } togglePositionDemo(position: FabMenuPosition): void { if (this.activePositionDemo === position) { this.activePositionDemo = null; this.logEvent(`Closed ${position} positioned menu`); } else { this.activePositionDemo = position; this.logEvent(`Opened ${position} positioned menu`); } } handlePositionItemClick(event: {item: FabMenuItem, event: Event}): void { if (event.item.id === 'close') { this.activePositionDemo = null; this.logEvent('Closed positioned menu via menu item'); } else { this.logEvent(`Position menu item clicked: ${event.item.label}`); } } onMenuOpened(): void { this.logEvent('Menu opened'); } onMenuClosed(): void { this.logEvent('Menu closed'); } logEvent(message: string): void { this.eventLog.push({ timestamp: new Date(), message }); } clearLog(): void { this.eventLog = []; this.logEvent('Event log cleared'); } }ɓ&x/ import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { FeedLayoutComponent, FeedItem } from 'ui-essentials'; interface DemoFeedItem extends FeedItem { title: string; content: string; timestamp: Date; author: string; likes: number; type: 'text' | 'image' | 'video'; } @Component({ selector: 'ui-feed-layout-demo', standalone: true, imports: [CommonModule, FormsModule, FeedLayoutComponent], template: `

    Feed Layout Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size | titlecase }}

    @for (item of sampleItems.slice(0, 2); track item.id) {
    {{ item.author }} {{ item.timestamp | date:'short' }}
    {{ item.title }}

    {{ item.content }}

    }
    }

    Interactive Feed with Infinite Scroll

    @for (item of feedItems(); track item.id) {
    {{ item.author }} {{ item.type }} {{ item.timestamp | date:'short' }}
    {{ item.title }}

    {{ item.content }}

    }
    📝

    No posts yet

    Be the first to share something!

    States

    Loading State

    @for (item of sampleItems.slice(0, 1); track item.id) {
    {{ item.author }}
    {{ item.title }}

    {{ item.content }}

    }

    Error State

    Empty State

    📭

    No content available

    Usage Statistics

    Total Items: {{ feedItems().length }}
    Load More Calls: {{ loadMoreCount }}
    Refresh Calls: {{ refreshCount }}
    `, styleUrl: './feed-layout-demo.component.scss' }) export class FeedLayoutDemoComponent { sizes = ['sm', 'md', 'lg'] as const; protected readonly feedItems = signal([]); protected readonly isLoading = signal(false); protected readonly hasError = signal(false); protected errorMessage = ''; protected enableRefreshControl = true; protected loadMoreCount = 0; protected refreshCount = 0; protected sampleItems: DemoFeedItem[] = [ { id: '1', title: 'Getting Started with Angular 19', content: 'Angular 19 brings exciting new features including improved SSR, better performance, and enhanced developer experience.', timestamp: new Date(Date.now() - 3600000), author: 'Sarah Chen', likes: 42, type: 'text' }, { id: '2', title: 'Building Responsive Layouts', content: 'Learn how to create flexible, mobile-first designs that work beautifully across all devices.', timestamp: new Date(Date.now() - 7200000), author: 'Mike Rodriguez', likes: 28, type: 'image' }, { id: '3', title: 'TypeScript Best Practices', content: 'Discover advanced TypeScript patterns and techniques to write more maintainable code.', timestamp: new Date(Date.now() - 10800000), author: 'Alex Kim', likes: 35, type: 'video' } ]; constructor() { this.addSampleContent(); } loadMoreItems(): void { if (this.isLoading() || this.hasError()) return; this.loadMoreCount++; this.isLoading.set(true); // Simulate API call delay setTimeout(() => { const currentItems = this.feedItems(); const nextBatch = this.generateItems(3, currentItems.length); this.feedItems.set([...currentItems, ...nextBatch]); this.isLoading.set(false); }, 1500); } refreshFeed(): void { this.refreshCount++; this.isLoading.set(true); this.hasError.set(false); // Simulate refresh delay setTimeout(() => { const newItems = this.generateItems(5, 0); this.feedItems.set(newItems); this.isLoading.set(false); }, 1000); } retryLoad(): void { this.hasError.set(false); this.loadMoreItems(); } resetFeed(): void { this.feedItems.set([]); this.hasError.set(false); this.isLoading.set(false); this.loadMoreCount = 0; this.refreshCount = 0; this.addSampleContent(); } toggleError(): void { if (this.hasError()) { this.hasError.set(false); this.errorMessage = ''; } else { this.hasError.set(true); this.errorMessage = 'Failed to load more content. Please check your connection.'; } } toggleLike(item: DemoFeedItem): void { const items = this.feedItems(); const index = items.findIndex(i => i.id === item.id); if (index !== -1) { const updatedItems = [...items]; updatedItems[index] = { ...item, likes: item.likes > 0 ? 0 : 1 }; this.feedItems.set(updatedItems); } } addSampleContent(): void { const items = this.generateItems(5, 0); this.feedItems.set(items); } private generateItems(count: number, startId: number): DemoFeedItem[] { const contentTemplates = [ { title: 'Web Development Trends', content: 'Exploring the latest trends in modern web development and what they mean for developers.', author: 'Jane Doe', type: 'text' as const }, { title: 'UI/UX Design Principles', content: 'Understanding the fundamental principles that make great user interfaces and experiences.', author: 'John Smith', type: 'image' as const }, { title: 'Performance Optimization', content: 'Tips and techniques for optimizing web application performance and user experience.', author: 'Emma Wilson', type: 'video' as const }, { title: 'Accessibility Matters', content: 'Why web accessibility is crucial and how to implement it in your projects.', author: 'David Brown', type: 'text' as const }, { title: 'Mobile-First Design', content: 'Best practices for designing mobile-first responsive web applications.', author: 'Lisa Garcia', type: 'image' as const } ]; return Array.from({ length: count }, (_, index) => { const template = contentTemplates[index % contentTemplates.length]; const id = startId + index + 1; return { id: id.toString(), title: `${template.title} #${id}`, content: template.content, timestamp: new Date(Date.now() - (index + 1) * 1800000), author: template.author, likes: Math.floor(Math.random() * 50), type: template.type }; }); } }\gXx3:import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { FileUploadComponent, UploadedFile } from '../../../../../ui-essentials/src/lib/components/forms/file-upload/file-upload.component'; @Component({ selector: 'ui-file-upload-demo', standalone: true, imports: [CommonModule, ReactiveFormsModule, FileUploadComponent], template: `

    File Upload Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size.toUpperCase() }} Size

    File upload with {{ size }} sizing.

    }

    Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }} Variant

    File upload with {{ variant }} styling.

    }

    File Type Restrictions

    Images Only

    Accepts only image files (JPEG, PNG, GIF, WebP).

    Documents Only

    Accepts PDF, Word, and Excel documents.

    Size & File Limits

    Size Limit (5MB)

    Maximum file size of 5MB per file.

    File Count Limit

    Maximum of 3 files can be selected.

    Single File

    Only one file can be selected.

    States

    Disabled State

    File upload in disabled state.

    Error State

    File upload showing error state.

    Success State

    File upload showing success state.

    Reactive Form Integration

    Form with Validation

    File upload integrated with Angular reactive forms and validation.

    Form Status: {{ uploadForm.status }} | Form Valid: {{ uploadForm.valid }} | Files Count: {{ uploadForm.get('files')?.value?.length || 0 }}
    @if (submittedFiles.length > 0) {
    Submitted Files:
    @for (file of submittedFiles; track file.id) {
    {{ file.name }}
    {{ formatFileSize(file.size) }}
    }
    }

    Event Handling

    Event Monitoring

    Monitor file upload events in real-time.

    Recent Events:
    @if (recentEvents.length === 0) {

    No events yet. Add or remove files to see events.

    } @else { @for (event of recentEvents.slice(-5).reverse(); track $index) {
    {{ event.type }}: {{ event.fileName }}
    {{ event.timestamp | date:'medium' }}
    } }

    Usage Example

    {{ codeExample }}
    `, styleUrl: './file-upload-demo.component.scss' }) export class FileUploadDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['outlined', 'filled', 'underlined'] as const; uploadForm = new FormGroup({ files: new FormControl([], [Validators.required]) }); submittedFiles: UploadedFile[] = []; recentEvents: Array<{type: string, fileName: string, timestamp: Date}> = []; readonly codeExample = `import { FileUploadComponent, UploadedFile } from '../../../../../ui-essentials/src/lib/components/forms/file-upload/file-upload.component'; // Basic usage // With reactive forms // Event handling onFilesSelected(files: UploadedFile[]): void { console.log('Selected files:', files); files.forEach(file => { console.log(file.name, file.size, file.type); }); }`; onFilesSelected(context: string, files: UploadedFile[]): void { console.log(`Files selected in ${context}:`, files); } onFormFilesSelected(files: UploadedFile[]): void { this.uploadForm.patchValue({ files }); this.uploadForm.get('files')?.markAsTouched(); } onEventFilesSelected(files: UploadedFile[]): void { this.addEvent('filesSelected', `${files.length} files total`); } onFileAdded(file: UploadedFile): void { this.addEvent('fileAdded', file.name); } onFileRemoved(file: UploadedFile): void { this.addEvent('fileRemoved', file.name); } private addEvent(type: string, fileName: string): void { this.recentEvents.push({ type, fileName, timestamp: new Date() }); } onSubmit(): void { if (this.uploadForm.valid) { this.submittedFiles = this.uploadForm.get('files')?.value || []; console.log('Form submitted with files:', this.submittedFiles); } } resetForm(): void { this.uploadForm.reset(); this.uploadForm.get('files')?.setValue([]); this.submittedFiles = []; } getFormFieldState(fieldName: string): 'default' | 'error' | 'success' { const control = this.uploadForm.get(fieldName); if (control?.invalid && control?.touched) { return 'error'; } if (control?.valid && control?.value?.length > 0) { return 'success'; } return 'default'; } getFormFieldError(fieldName: string): string { const control = this.uploadForm.get(fieldName); if (control?.invalid && control?.touched) { if (control.errors?.['required']) { return 'Please select at least one file'; } } return ''; } formatFileSize(bytes: number): string { if (bytes === 0) return '0 Bytes'; const k = 1024; const sizes = ['Bytes', 'KB', 'MB', 'GB']; const i = Math.floor(Math.log(bytes) / Math.log(k)); return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]; } }Sx;1mwn==ߌ73>U-M-.N+L)\Hºx!%@use '../../../../../ui-design-system/src/styles/semantic' as *; .demo-container { padding: $semantic-spacing-component-lg; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: $semantic-spacing-layout-section-xl; h3 { font-family: map-get($semantic-typography-heading-h3, font-family); font-size: map-get($semantic-typography-heading-h3, font-size); font-weight: map-get($semantic-typography-heading-h3, font-weight); line-height: map-get($semantic-typography-heading-h3, line-height); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-md; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; padding-bottom: $semantic-spacing-component-sm; } h4 { font-family: map-get($semantic-typography-heading-h4, font-family); font-size: map-get($semantic-typography-heading-h4, font-size); font-weight: map-get($semantic-typography-heading-h4, font-weight); line-height: map-get($semantic-typography-heading-h4, line-height); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-sm; } p { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-md; } } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: $semantic-spacing-grid-gap-lg; margin-bottom: $semantic-spacing-layout-section-md; } .demo-item { padding: $semantic-spacing-component-md; background: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-md; border: $semantic-border-width-1 solid $semantic-color-border-subtle; } .demo-controls { display: flex; flex-wrap: wrap; gap: $semantic-spacing-component-sm; margin-bottom: $semantic-spacing-component-lg; padding: $semantic-spacing-component-md; background: $semantic-color-surface-elevated; border-radius: $semantic-border-radius-md; border: $semantic-border-width-1 solid $semantic-color-border-subtle; button { padding: $semantic-spacing-interactive-button-padding-y $semantic-spacing-interactive-button-padding-x; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; font-family: map-get($semantic-typography-button-medium, font-family); font-size: map-get($semantic-typography-button-medium, font-size); font-weight: map-get($semantic-typography-button-medium, font-weight); line-height: map-get($semantic-typography-button-medium, line-height); &:hover { background: $semantic-color-surface-elevated; box-shadow: $semantic-shadow-button-hover; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &.active { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; } &:disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } } } .selection-info { margin-top: $semantic-spacing-component-lg; padding: $semantic-spacing-component-md; background: $semantic-color-surface-elevated; border-radius: $semantic-border-radius-md; border: $semantic-border-width-1 solid $semantic-color-border-subtle; p { font-weight: $semantic-typography-font-weight-semibold; margin-bottom: $semantic-spacing-component-sm; } ul { list-style: none; padding: 0; margin: 0; li { padding: $semantic-spacing-content-line-tight 0; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); &:last-child { border-bottom: none; } } } } .event-log { background: $semantic-color-surface-elevated; border-radius: $semantic-border-radius-md; border: $semantic-border-width-1 solid $semantic-color-border-subtle; overflow: hidden; .event-controls { padding: $semantic-spacing-component-md; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; background: $semantic-color-surface-secondary; button { padding: $semantic-spacing-interactive-button-padding-y $semantic-spacing-interactive-button-padding-x; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; font-family: map-get($semantic-typography-button-small, font-family); font-size: map-get($semantic-typography-button-small, font-size); font-weight: map-get($semantic-typography-button-small, font-weight); line-height: map-get($semantic-typography-button-small, line-height); &:hover { background: $semantic-color-surface-elevated; box-shadow: $semantic-shadow-button-hover; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } } } .event-list { max-height: 300px; overflow-y: auto; .no-events { padding: $semantic-spacing-component-lg; text-align: center; color: $semantic-color-text-tertiary; font-style: italic; } .event-item { display: grid; grid-template-columns: 120px 1fr auto; gap: $semantic-spacing-component-sm; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; border-bottom: $semantic-border-width-1 solid $semantic-color-border-subtle; &:last-child { border-bottom: none; } .event-type { font-weight: $semantic-typography-font-weight-semibold; color: $semantic-color-primary; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); line-height: map-get($semantic-typography-body-small, line-height); } .event-details { color: $semantic-color-text-primary; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } .event-time { color: $semantic-color-text-tertiary; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); white-space: nowrap; } } } } // Responsive Design @media (max-width: $semantic-breakpoint-md - 1) { .demo-container { padding: $semantic-spacing-component-md; } .demo-grid { grid-template-columns: 1fr; gap: $semantic-spacing-grid-gap-md; } .demo-controls { flex-direction: column; align-items: stretch; button { width: 100%; text-align: center; } } .event-item { grid-template-columns: 1fr; gap: $semantic-spacing-content-line-tight; .event-time { justify-self: end; grid-row: 1; grid-column: 1; } .event-type { grid-row: 2; grid-column: 1; } .event-details { grid-row: 3; grid-column: 1; } } } @media (max-width: $semantic-breakpoint-sm - 1) { .demo-container { padding: $semantic-spacing-component-sm; } .demo-section { margin-bottom: $semantic-spacing-layout-section-md; } },0hx C9/index98sm}) h1 {!O !smo  ,  < md; h2 {!O +?lg; font-size: $base-typography-font-size-xl; } h3 {6lg 0p @md 0; font-size: $base-typography-font-size-lg; } p {=81line-height: $base-typography-line-height-relaxed"O &} } .theme-controls { display: flex\flex-wrap: wrap; } .theme-btnQ*%6*button-width $semantic-border-button-style #7 button-radius; 13 '[cursor: pointer; font-size: $base-typography-font-size-sm; text-transform: capitalize; o   easing-standard; &:hover { 6C #brand-primary; } &.active { brand-primaryon-brand-primary; ? "brand-primary; } p %outline: $semantic-border-focus-width 2} }O]\x1C*!Glg; h3 { /0 0* 0~ , 07 * O @5:} .demo-split-container { height: 400px; >/ ?econd 20 } .demo-panel-content. &height: 100%; h4 {_3h* .. CO >/!p {_81 N 3 Y 3 @>'ntent-paragraph&--primary { *&--secondary { *M&--elevated { :Helevation-1; } } .demo-controls { display: flex3B3 button { !S  &on-primary; border: none; $&button-radius; cursor: pointer^5  - N / / W  5 hover; }  40( } &--secondary { # econdary; :on-secondary; } &--success { $ ccess; 7on-success; } &--danger { " danger; 6on-danger; } } } .demo-info. &container; J 3* p {_3@>'  p margin-bottom: 0; }strong0=~/ }!6xM .demo-section .demo-split-container { height: 300px; } .demo-section .demo-controls { gap: $semxs; button { +xspb1+-- C } } } }|pxiimport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FlexComponent } from '../../../../../ui-essentials/src/lib/components/layout/flex'; @Component({ selector: 'ui-flex-demo', standalone: true, imports: [CommonModule, FlexComponent], template: `

    Flex Component Demo

    Flex Direction

    @for (direction of directions; track direction) {

    direction="{{ direction }}"

    1
    2
    3
    }

    Justify Content

    @for (justify of justifyOptions; track justify) {

    justify="{{ justify }}"

    A
    B
    C
    }

    Align Items

    @for (align of alignOptions; track align) {

    align="{{ align }}"

    Small
    Medium
    Large item with more content
    }

    Flex Wrap

    @for (wrapOption of wrapOptions; track wrapOption) {

    wrap="{{ wrapOption }}"

    @for (item of manyItems; track item) {
    {{ item }}
    }
    }

    Gap Spacing

    @for (gap of gapSizes; track gap) {

    gap="{{ gap }}"

    1
    2
    3
    }

    Complex Layout Examples

    Centered Card Layout

    Centered Card

    This card is perfectly centered using flexbox.

    Navigation Layout

    Brand
    Home
    About
    Contact

    Responsive Card Grid

    @for (card of cards; track card.id) {
    {{ card.title }}

    {{ card.content }}

    }

    Sidebar Layout

    Sidebar
    Main Content

    This is the main content area that grows to fill the available space.

    Size Variants

    Full Width

    Full Width Container

    Inline Flex

    Before text
    A
    B
     After text
    `, styleUrl: './flex-demo.component.scss' }) export class FlexDemoComponent { directions = ['row', 'row-reverse', 'column', 'column-reverse'] as const; justifyOptions = ['start', 'end', 'center', 'between', 'around', 'evenly'] as const; alignOptions = ['start', 'end', 'center', 'baseline', 'stretch'] as const; wrapOptions = ['nowrap', 'wrap', 'wrap-reverse'] as const; gapSizes = ['xs', 'sm', 'md', 'lg', 'xl'] as const; manyItems = Array.from({ length: 12 }, (_, i) => `Item ${i + 1}`); cards = [ { id: 1, title: 'Card 1', content: 'This is the first card with some content.' }, { id: 2, title: 'Card 2', content: 'This is the second card with different content.' }, { id: 3, title: 'Card 3', content: 'This is the third card with more content.' }, { id: 4, title: 'Card 4', content: 'This is the fourth card with additional content.' }, { id: 5, title: 'Card 5', content: 'This is the fifth card with extra content.' }, { id: 6, title: 'Card 6', content: 'This is the sixth card with final content.' }, ]; }R-$x 675d'HStackComponent, StackComponent, VStackhH!stack6'StackComponent, VStackComponent, HStackEStack Components DemoItem 1? item">Item 2?)item">Item 3  Stack Row!6 Stack (Row)!$ui-stack direction="row" spacing="md! item">Item 1? item">Item 2?)item">Item 3  VStack Varia;VStack (Vertical Stack)!"spacing of spacings; track spacing{{ spacing }} spacingvstack [spacing]="spacing" item">Item A# item">Item B# item">Item C\vstack>!4 HStack Varia;HStack (Horizontal Stack)!8"spacing of spacings; track spacing{{ spacing }} spacinghstack [spacing]="spacing" item">Item A# item">Item B# item">Item C\hstack>!4 Alignment ?Alignment Optiona0  

    VStack Alignment

    ment-example alignmentAh5>align="{{ align }}" item z#-item medium">Medium Item-item large">Large Item Here/ui-vstack> | } ~

    HStack Alignment

    ment-example alignmentAh5>align="{{ align }}" item z#- item medium">Medium
    Two lines-(item large">Large
    Item
    Three lines/ui-hstack> | } ~N >Justify Optiona @#

    HStack Justify (full width) !4Divider ? With Dividera0  

    VStack with Dividersui-vstack [divider]="true"> !item">Section One !item">Section Two !3item">Section Three ~

    HStack with Dividersui-hstack [divider]="true"> !item">Left !item">Center !+item">Right ~NResponsive Example!6Responsive Behavior

    The HStack below converts to a VStack on small screens:

    Item 1 item">Item 2 item">Item 3 &item">Item 4 section-header">Header Section %item">Left Column !item">Item 2 !Qitem">Item 3 !item">Right Column !item">Item B !Citem">Item C 8section-footer">Footer Section px,<@use "../../../../../../shared-ui/src/styles/semantic/index" as *; .ui-fab-menu { position: relative; display: inline-flex; z-index: $semantic-z-index-dropdown; // Position variants &--bottom-right { position: fixed; bottom: $semantic-spacing-layout-section-md; right: $semantic-spacing-layout-section-md; } &--bottom-left { position: fixed; bottom: $semantic-spacing-layout-section-md; left: $semantic-spacing-layout-section-md; } &--top-right { position: fixed; top: $semantic-spacing-layout-section-md; right: $semantic-spacing-layout-section-md; } &--top-left { position: fixed; top: $semantic-spacing-layout-section-md; left: $semantic-spacing-layout-section-md; } // Size variants &--sm { .ui-fab-menu__trigger { width: $semantic-sizing-button-height-sm; height: $semantic-sizing-button-height-sm; .ui-fab-menu__trigger-icon { width: $semantic-sizing-icon-button; height: $semantic-sizing-icon-button; font-size: map-get($semantic-typography-body-small, font-size); } } .ui-fab-menu__item { min-height: $semantic-sizing-button-height-sm; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } } &--md { .ui-fab-menu__trigger { width: $semantic-sizing-button-height-md; height: $semantic-sizing-button-height-md; .ui-fab-menu__trigger-icon { width: $semantic-sizing-icon-button; height: $semantic-sizing-icon-button; font-size: map-get($semantic-typography-body-medium, font-size); } } .ui-fab-menu__item { min-height: $semantic-sizing-button-height-md; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); } } &--lg { .ui-fab-menu__trigger { width: $semantic-sizing-button-height-lg; height: $semantic-sizing-button-height-lg; .ui-fab-menu__trigger-icon { width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; font-size: map-get($semantic-typography-body-large, font-size); } } .ui-fab-menu__item { min-height: $semantic-sizing-button-height-lg; padding: $semantic-spacing-component-md $semantic-spacing-component-lg; font-family: map-get($semantic-typography-body-large, font-family); font-size: map-get($semantic-typography-body-large, font-size); font-weight: map-get($semantic-typography-body-large, font-weight); line-height: map-get($semantic-typography-body-large, line-height); } } // Direction variants &--up { .ui-fab-menu__items { flex-direction: column-reverse; bottom: 100%; margin-bottom: $semantic-spacing-component-sm; } .ui-fab-menu__item { transform-origin: center bottom; } } &--down { .ui-fab-menu__items { flex-direction: column; top: 100%; margin-top: $semantic-spacing-component-sm; } .ui-fab-menu__item { transform-origin: center top; } } &--left { .ui-fab-menu__items { flex-direction: row-reverse; right: 100%; margin-right: $semantic-spacing-component-sm; align-items: center; } .ui-fab-menu__item { transform-origin: right center; } } &--right { .ui-fab-menu__items { flex-direction: row; left: 100%; margin-left: $semantic-spacing-component-sm; align-items: center; } .ui-fab-menu__item { transform-origin: left center; } } // State variants &--disabled { .ui-fab-menu__trigger { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } } &--animating { pointer-events: none; } } .ui-fab-menu__trigger { position: relative; display: flex; align-items: center; justify-content: center; border: $semantic-border-width-1 solid transparent; border-radius: $semantic-border-radius-full; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; box-shadow: $semantic-shadow-elevation-2; overflow: hidden; // Color variants &--primary { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; &:hover:not([disabled]) { box-shadow: $semantic-shadow-elevation-3; } } &--secondary { background: $semantic-color-secondary; color: $semantic-color-on-secondary; border-color: $semantic-color-secondary; &:hover:not([disabled]) { box-shadow: $semantic-shadow-elevation-3; } } &--success { background: $semantic-color-success; color: $semantic-color-on-success; border-color: $semantic-color-success; &:hover:not([disabled]) { box-shadow: $semantic-shadow-elevation-3; } } &--danger { background: $semantic-color-danger; color: $semantic-color-on-danger; border-color: $semantic-color-danger; &:hover:not([disabled]) { box-shadow: $semantic-shadow-elevation-3; } } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &:active:not([disabled]) { transform: scale(0.95); box-shadow: $semantic-shadow-elevation-1; } &--active { transform: rotate(45deg); } .ui-fab-menu__trigger-icon { display: flex; align-items: center; justify-content: center; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; &--close { transform: rotate(-45deg); } } .ui-fab-menu__trigger-ripple { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: inherit; overflow: hidden; &::after { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: currentColor; transform: translate(-50%, -50%); opacity: 0; transition: all $semantic-motion-duration-normal $semantic-motion-easing-ease; } .ui-fab-menu__trigger:active & { &::after { width: 100%; height: 100%; opacity: $semantic-opacity-subtle; } } } } .ui-fab-menu__items { position: absolute; display: flex; gap: $semantic-spacing-component-xs; pointer-events: none; z-index: 1; .ui-fab-menu--open & { pointer-events: auto; } } .ui-fab-menu__item { position: relative; display: flex; align-items: center; gap: $semantic-spacing-component-xs; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-md; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; box-shadow: $semantic-shadow-elevation-1; transform: scale(0); opacity: 0; overflow: hidden; white-space: nowrap; .ui-fab-menu--open & { transform: scale(1); opacity: 1; @for $i from 1 through 10 { &:nth-child(#{$i}) { transition-delay: #{($i - 1) * 50ms}; } } } .ui-fab-menu--animating:not(.ui-fab-menu--open) & { transition-delay: 0ms; } // Color variants &--primary { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; } &--secondary { background: $semantic-color-secondary; color: $semantic-color-on-secondary; border-color: $semantic-color-secondary; } &--success { background: $semantic-color-success; color: $semantic-color-on-success; border-color: $semantic-color-success; } &--danger { background: $semantic-color-danger; color: $semantic-color-on-danger; border-color: $semantic-color-danger; } &:hover:not([disabled]) { box-shadow: $semantic-shadow-elevation-2; transform: scale(1.05); } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &:active:not([disabled]) { transform: scale(0.98); box-shadow: $semantic-shadow-elevation-1; } &--disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } .ui-fab-menu__item-icon { display: flex; align-items: center; justify-content: center; width: $semantic-sizing-icon-inline; height: $semantic-sizing-icon-inline; flex-shrink: 0; } .ui-fab-menu__item-label { font-weight: $semantic-typography-font-weight-medium; } .ui-fab-menu__item-ripple { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: inherit; overflow: hidden; &::after { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: currentColor; transform: translate(-50%, -50%); opacity: 0; transition: all $semantic-motion-duration-normal $semantic-motion-easing-ease; } .ui-fab-menu__item:active & { &::after { width: 100%; height: 100%; opacity: $semantic-opacity-subtle; } } } } .ui-fab-menu__backdrop { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: $semantic-color-backdrop; backdrop-filter: blur(2px); z-index: -1; opacity: 0; transition: opacity $semantic-motion-duration-fast $semantic-motion-easing-ease; .ui-fab-menu--open & { opacity: 1; } } // Responsive design @media (max-width: 768px) { .ui-fab-menu { &--bottom-right, &--bottom-left, &--top-right, &--top-left { margin: $semantic-spacing-component-sm; } } .ui-fab-menu__item { .ui-fab-menu__item-label { font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); } } } // High contrast mode support @media (prefers-contrast: high) { .ui-fab-menu__trigger, .ui-fab-menu__item { border-width: $semantic-border-width-2; } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .ui-fab-menu__trigger, .ui-fab-menu__item, .ui-fab-menu__backdrop, .ui-fab-menu__trigger-icon, .ui-fab-menu__trigger-ripple::after, .ui-fab-menu__item-ripple::after { transition-duration: 0ms; animation-duration: 0ms; } .ui-fab-menu__item { .ui-fab-menu--open & { transition-delay: 0ms; } } }68sQxYYui-design-system!, {x$Ocard-radius $semantic-border-card-radius 0 0; } &__title { margin: 0 0 0; .heading-h4, font-family); ,heading-h4, font-size); .heading-h4, font-weight); . heading-h4 7=5} // Search &__search { position: relative; * 5} &__search-icon$Jinteractive-input-padding-x; top: 50%; transform: translateY(-50%)1Gtext-tertiary; z-index: 1; } &__search-input { width: 100%# nput-height-md; ninteractive-input-padding-y calc($semantic-spacing-interactive-input-padding-x * 3) interactive-input-padding-y calc($semantic-spacing-interactive-input-padding-x * 2.5); box-sizing: border-box; "\C\ $input-radius; .input, font-family); ,input, font-size); .input, font-weight); .input 7= R &::placeholder { !;text-tertiary; } &:focus { outline: none; ")border-focus; box-shadow: 0 0 0 2px} &:disabled { !urface-secondary; !text*} } &__search-clear$ Qinteractive-input-padding-x; top: 50%; transform: translateY(-50%); 1 touch-minimum#Qtouch-minimum; padding: 0; background: transparent; border: none$sm; )text-secondary; cursor: pointer; p#NR &:hover:not(:disabled) { !urface-secondary; != } &:focus { 2 } &:disabled { !text*&} } // Select All &__select-alln#3}' cursor: pointer; .label, font-family); ,label, font-size); .label, font-weight); .labe7Vtext-secondary; input[type="checkbox"] { margin: 0; } &:hover { !=> } } // List Container &__list-container { flex: 1.u# 6; } &__list { flex: 1; overflow-y: auto; += min-height: 200px; max-height: 400px; &:focus { 2< outline-offset: -2px; } } // List Items &__itemn#3}''. + "\!$sm; cursor: poi WT &:last-child { margin-bottom: 0; } &:hover:not(&--disabled) { !urface-secondary; ")border-secondary; } &:focus { 23 outline-offset: -2px; } &--selected { !urface-elevated; " != } &--disabled { !)$} } &__checkbox { margin: 0 $_ &__item-label { flex: 1; min-width: 0; word-wrap: break-word; } &__empty { )} text-align: center1text-tertiary; .caption, font-family); ,caption, font-size); .caption, font-weight); .Gcaption, line-height); } // Controls &__controls { order: 2;p#  ; gap C#%md 0 $ &__control-btn { 1*#~padding: 0; ! \1 \ $button-radius; "primary; cursor: pointer; p#NVF'button-rest; &:hover:not(:disabled' button-hove Y(-1px); } &:focus { 2" } &:active:not(:disabled) {%Y(0); !!'button-rest; } &:disabled { !urface-secondary; "border-secondary; !text,7box-shadow: none; } } // Footer &__footer { )' border-top + secondary;"urface-secondary; .caption, font-family); ,caption, font-size); .caption, font-weight); .caption 7=text-secondary; text-align: center; } // Size Vtransfer-list__panel {@6J M .ui-transfer-list__header {,!} .ui-transfer-list__title {@1 heading-h5|> heading-h5> heading-h5 @ heading-h5 & .ui-transfer-list__search-input {^ 5input-height-sm; } .ui-transfer-list__item {.' } .ui-transfer-list__control-btn`/ '"} .ui-transfer-list__footer {S@+} &--lg { .ui-transfer-list__panel { + .ui-transfer-list__header {,} !} .ui-transfer-list__title {@1 heading-h3|> heading-h3> heading-h3 @ heading-h3 & .ui-transfer-list__search-input {^ 5input-height-lg; } .ui-transfer-list__item {,=%} .ui-transfer-list__control-btn`// '/ "} .ui-transfer-list__footer {,^ ' } } // Responsive Design q(  ; gap@ 4; .ui-transfer-list__controls { order: 2;  '} .ui-transfer-list__panel { &--source { order: 1; } &--target { order: 3; } G} .ui-transfer-list__list { max-height: 300px; } } q(480px) { gap "; .ui-transfer-list__header {,!} .ui-transfer-list__title {@1 heading-h5|> heading-h5> heading-h5 @ heading-h5 & .ui-transfer-list__search-input {^ input-height-sm#interactive-input-padding-y calc($semantic-spacing-interactive-input-padding-x * 2.5) $semantic- interactive-input-padding-y calc($semantic-spacing-interactive-input-padding-x * 2); box-sizing: border-bo'x; } .ui-transfer-list__item {.' } .ui-transfer-list__control-btn`/ '^} .ui-transfer-list__list { max-height: 250px; min-height: 150px; } } }Sx[ i9P@oast { // Core Structure display: flex; position: relativen:width: 100%; max-width: 400px; // Layout & Spacing -0% // Visual Design Q& elevated; 9o /'3; // Typography ,}  // Transitions ,normal!$"52 .#max-width: 320px;q4 #5Bmd { // Default styles already applied above } &--lg { 12_ .% max-width: 480px;q&!// Color Variants &--primary { 0/)left-width: 4px; .ui-toast__icon@  } .ui-toast__title@  } } &--success { 0"=success; border-left-width: 4px; .ui-toast__icon@ (success; } .ui-toast__title@ %success; } } &--warning { 0"=warning; border-left-width: 4px; .ui-toast__icon@ (warning; } .ui-toast__title@ $warning; } } &--danger { 0"xi,P/ag-input { display: flex; flex-wrap: wrap; -position: relative; // Layout & Spacing P2P2x; 0#min-o, md; // Visual Design Q17o   // Typography C (_ G3_ *_  , // Transitions transition: border-color<, box-shadow@$"min-o, sm; 123.!v/ #5 .ui-tag-input__input)8 # )/%G } &--md { // Already defined above } &--lg { min-o,52_ ".!v .ui-tag-input__input)-* } // Style Variants &--outlined {(:o } &--filled { !74!ubtle; } // State Variants>E" .ui-tag-input__input { ",} } &--error { 0" error; &:focus-within {,error; box-shadow: 0 0 0 2px rgba($semantic-color-danger, 0.2); } } // Interactive States &:not(.ui-tag-input--disabled) { &:hover {7} &:focus-within {% rgba(4, 0.2); } } // Tags Container &__tags { wrap: wrap)>6} // Input Element &__input { border: none;">120px margin: 0;!} /_ ғ6H KH // Tag Item (using existing chip component) &__tag { .ui-chip } // Max Tags Reached Indicator &--max-reached { .ui-tag-input__input { display: none; } } // Focus Management &__focus-trap opacity: 0# top: -1px; left: -1px; } 1./7px) { .ui-tag-input__input { min-width: 80px; } } } // Error Message .ui-tag-input-error { margin-top: $semdanger; , $3 $# P* $* $ n$1} // Help Text .ui-tag-input-help { margin-top) * $3 $# P* $* $ n$}|x09.Pree-viewT"blockz>7@ >subtle3'XAB/o3 (@o{/o.k6-*// Typography already set above for medium;@s) .ui-tree-view__node--selected { QK on &--second~(8secondary; .ui-tree-view__node--selected { Q econdary;5on-secondary; } } // Tree Node &__node {1(ntent-line-tight; margin-bottom: 2px/*fast! // Node statesH} &--selected { Q2  !mediumMhabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none-v/} // Tree Node Content &__node-content {1 MAllow text truncation } // Expand/Collapse Button &__expand-button {Nc+heighth'argin-!, order: noneF))*fast!J3x[--expanded { transform: rotate(90deg); } &--leaf { cursor: default3`  )font-size-lg; &:hover { H!: } } } // Node Icon &__node-icon { widthk $heightk +!+7 +i .ui-tree-view__node--selected & { color: inherit; } } // Node Label &__node-label !text-overflow: ellipsis; white-space: nowrap; } // Children Container &__children { margin-left: $semantic-spa"layout-section-sm; border-left8subtle; padding-left\sm; &--hidden { display: none; } } // Loading State &__loading {N%5 +"} // Empty State &__empty {N%lg1 7tyle: italic; } // Root level adjustments & > .ui-tree-view__node { &:first-child { margin-top: 0; } 2 &:last-child { margin-bottom: 0; }4($semantic-breakpoint-md - 1)),0 .ui-tree-view__children { margin-left padding-left&>} } @media (max-width: ($semantic-breakpoint-sm - 1)) {=4o3 (@o{/o.X .ui-tree-view__node&C 2$} } }^qx'9/OalerS\D margin-bottomsm; gap: 16px9subtleZ1#fastu12:7o3 (@o{/o.29PT/r K u %aler 'K*T/rRaler 'aler RT/r ~ 2aler '~ 0  aler (~ 0 T/r u %aler Baler ( &T/r O /aler 'O } .ui-aler (O u1.25rem; // Increased froml  for better visibility heading-h41 ( heading-h4< heading-h4@* heading-h4O35邔m xaNimport { Component, ViewChild, AfterViewInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { FloatingToolbarComponent, ToolbarAction, FloatingToolbarConfig } from '../../../../../ui-essentials/src/lib/components/overlays/floating-toolbar/floating-toolbar.component'; @Component({ selector: 'ui-floating-toolbar-demo', standalone: true, imports: [CommonModule, FormsModule, FloatingToolbarComponent], template: `

    Floating Toolbar Demo

    Size Variants

    @for (size of sizes; track size) {
    }

    Style Variants

    @for (variant of variants; track variant) {
    }

    Position Variants

    @for (position of positions; track position) { }

    Context-Sensitive Actions

    Select this text to see a text editing toolbar with cut, copy, paste, and formatting options. The toolbar will appear automatically when you make a selection.

    Demo Image

    Right-click the image for image editing options

    Auto-Hide Behavior

    Custom Actions

    Action Log:

    @for (logEntry of actionLog; track $index) {
    {{ logEntry }}
    } @if (actionLog.length === 0) {
    No actions performed yet...
    }

    Interactive Examples

    Editable Text with Formatting Toolbar

    This is an editable text area. Select text to see formatting options in the floating toolbar.

    Bold text, italic text, and underlined text are supported.

    Data Table with Row Actions

    @for (user of sampleUsers; track user.id) { }
    Name Email Status Actions
    {{ user.name }} {{ user.email }} {{ user.status }}

    Configuration Options

    `, styleUrl: './floating-toolbar-demo.component.scss' }) export class FloatingToolbarDemoComponent implements AfterViewInit { @ViewChild('floatingToolbar') floatingToolbar!: FloatingToolbarComponent; @ViewChild('textSelectionToolbar') textSelectionToolbar!: FloatingToolbarComponent; // Demo Data sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'elevated', 'floating', 'compact', 'contextual'] as const; positions = ['top', 'bottom', 'left', 'right'] as const; sampleUsers = [ { id: 1, name: 'Alice Johnson', email: 'alice@example.com', status: 'Active' }, { id: 2, name: 'Bob Smith', email: 'bob@example.com', status: 'Pending' }, { id: 3, name: 'Carol Davis', email: 'carol@example.com', status: 'Inactive' }, ]; // Demo State actionLog: string[] = []; selectedUserId: number | null = null; currentConfig: FloatingToolbarConfig = { visible: false, size: 'md', variant: 'default', position: 'top', autoHide: false, hideDelay: 3000, backdrop: false, escapeClosable: true, label: '', showLabel: false, showShortcuts: false }; demoConfig = { backdrop: false, autoHide: false, escapeClosable: true }; currentActions: ToolbarAction[] = []; // Action Sets basicActions: ToolbarAction[] = [ { id: 'edit', label: 'Edit', icon: 'fas fa-edit', callback: (action, event) => this.logAction('Edit clicked') }, { id: 'delete', label: 'Delete', icon: 'fas fa-trash', callback: (action, event) => this.logAction('Delete clicked') }, { id: 'share', label: 'Share', icon: 'fas fa-share', callback: (action, event) => this.logAction('Share clicked') } ]; textActions: ToolbarAction[] = [ { id: 'cut', label: 'Cut', icon: 'fas fa-cut', shortcut: 'Ctrl+X', callback: (action, event) => this.executeTextAction('cut') }, { id: 'copy', label: 'Copy', icon: 'fas fa-copy', shortcut: 'Ctrl+C', callback: (action, event) => this.executeTextAction('copy') }, { id: 'paste', label: 'Paste', icon: 'fas fa-paste', shortcut: 'Ctrl+V', callback: (action, event) => this.executeTextAction('paste') }, { id: 'divider1', label: '', divider: true }, { id: 'bold', label: 'Bold', icon: 'fas fa-bold', shortcut: 'Ctrl+B', callback: (action, event) => this.executeTextAction('bold') }, { id: 'italic', label: 'Italic', icon: 'fas fa-italic', shortcut: 'Ctrl+I', callback: (action, event) => this.executeTextAction('italic') }, { id: 'underline', label: 'Underline', icon: 'fas fa-underline', shortcut: 'Ctrl+U', callback: (action, event) => this.executeTextAction('underline') } ]; imageActions: ToolbarAction[] = [ { id: 'resize', label: 'Resize', icon: 'fas fa-expand-arrows-alt', callback: (action, event) => this.logAction('Resize image') }, { id: 'crop', label: 'Crop', icon: 'fas fa-crop', callback: (action, event) => this.logAction('Crop image') }, { id: 'filters', label: 'Filters', icon: 'fas fa-filter', callback: (action, event) => this.logAction('Apply filters') }, { id: 'divider2', label: '', divider: true }, { id: 'download', label: 'Download', icon: 'fas fa-download', callback: (action, event) => this.logAction('Download image') } ]; customActions: ToolbarAction[] = [ { id: 'action1', label: 'Action 1', icon: 'fas fa-star', tooltip: 'This is action 1', callback: (action, event) => this.logAction('Custom Action 1 executed') }, { id: 'action2', label: 'Action 2', icon: 'fas fa-heart', tooltip: 'This is action 2 with a longer tooltip', disabled: false, callback: (action, event) => this.logAction('Custom Action 2 executed') }, { id: 'divider3', label: '', divider: true }, { id: 'action3', label: 'Disabled Action', icon: 'fas fa-ban', disabled: true, tooltip: 'This action is disabled', callback: (action, event) => this.logAction('This should not execute') }, { id: 'action4', label: 'Toggle Action', icon: 'fas fa-toggle-on', callback: (action, event) => this.toggleAction(action) } ]; userActions: ToolbarAction[] = [ { id: 'view', label: 'View Details', icon: 'fas fa-eye', callback: (action, event) => this.logAction('View user details') }, { id: 'edit-user', label: 'Edit User', icon: 'fas fa-edit', callback: (action, event) => this.logAction('Edit user') }, { id: 'delete-user', label: 'Delete User', icon: 'fas fa-trash', callback: (action, event) => this.logAction('Delete user') } ]; ngAfterViewInit(): void { // Setup text selection toolbar this.setupTextSelectionToolbar(); } showToolbar(id: string, triggerElement: HTMLElement, config: Partial): void { console.log('Demo: showToolbar called', { id, config, basicActions: this.basicActions }); this.currentConfig = { ...this.currentConfig, ...config, visible: true }; this.currentActions = [...this.basicActions]; console.log('Demo: config and actions set', { currentConfig: this.currentConfig, currentActions: this.currentActions }); this.floatingToolbar.setAnchorElement(triggerElement); } showAutoHideToolbar(triggerElement: HTMLElement): void { this.currentConfig = { ...this.currentConfig, visible: true, autoHide: true, hideDelay: 3000, label: 'Auto-hide in 3 seconds' }; this.currentActions = [...this.basicActions]; this.floatingToolbar.setAnchorElement(triggerElement); } showCustomActionsToolbar(triggerElement: HTMLElement): void { this.currentConfig = { ...this.currentConfig, visible: true, autoHide: false, showShortcuts: true, label: 'Custom Actions' }; this.currentActions = [...this.customActions]; this.floatingToolbar.setAnchorElement(triggerElement); } showContextualToolbar(event: MouseEvent, actions: ToolbarAction[], context: string): void { event.preventDefault(); // Create temporary anchor at mouse position const tempAnchor = { getBoundingClientRect: () => ({ top: event.clientY, left: event.clientX, right: event.clientX, bottom: event.clientY, width: 0, height: 0 } as DOMRect) } as HTMLElement; this.currentConfig = { ...this.currentConfig, visible: true, variant: 'contextual', position: 'bottom', autoHide: true, hideDelay: 5000, label: `${context} actions` }; this.currentActions = [...actions]; this.floatingToolbar.setAnchorElement(tempAnchor); } showConfigurableToolbar(triggerElement: HTMLElement): void { this.currentConfig = { ...this.currentConfig, ...this.demoConfig, visible: true, label: 'Configured Toolbar' }; this.currentActions = [...this.basicActions]; this.floatingToolbar.setAnchorElement(triggerElement); } updateDemoConfig(): void { // Update the demo configuration Object.assign(this.currentConfig, this.demoConfig); } handleTextSelection(element: HTMLElement): void { const selection = window.getSelection(); if (selection && selection.toString().trim()) { const range = selection.getRangeAt(0); const rect = range.getBoundingClientRect(); if (rect.width > 0 && rect.height > 0) { // Create anchor at selection const selectionAnchor = { getBoundingClientRect: () => rect } as HTMLElement; this.textSelectionToolbar.setAnchorElement(selectionAnchor); this.textSelectionToolbar.show(); } } else { this.textSelectionToolbar.hide(); } } selectUser(userId: number, rowElement: HTMLElement): void { this.selectedUserId = userId; } showUserActions(event: Event, rowElement: HTMLElement, user: any): void { event.stopPropagation(); this.currentConfig = { ...this.currentConfig, visible: true, variant: 'elevated', position: 'left', label: `Actions for ${user.name}` }; this.currentActions = [...this.userActions]; this.floatingToolbar.setAnchorElement(rowElement); } onActionClicked(event: { action: ToolbarAction; event: Event }): void { this.logAction(`Action clicked: ${event.action.label}`); } onTextActionClicked(event: { action: ToolbarAction; event: Event }): void { this.logAction(`Text action: ${event.action.label}`); } onToolbarVisibilityChange(visible: boolean): void { this.currentConfig.visible = visible; } onToolbarHidden(): void { this.logAction('Toolbar hidden'); } executeTextAction(command: string): void { try { document.execCommand(command, false); this.logAction(`Text formatting: ${command}`); } catch (error) { this.logAction(`Text formatting failed: ${command}`); } } toggleAction(action: ToolbarAction): void { const isToggled = action.icon === 'fas fa-toggle-on'; action.icon = isToggled ? 'fas fa-toggle-off' : 'fas fa-toggle-on'; this.logAction(`Toggle action: ${isToggled ? 'OFF' : 'ON'}`); } private setupTextSelectionToolbar(): void { document.addEventListener('selectionchange', () => { const selection = window.getSelection(); if (!selection || !selection.toString().trim()) { this.textSelectionToolbar.hide(); } }); } getConfigValue(key: K): NonNullable { const defaultValues: Required = { size: 'md', variant: 'default', position: 'top', autoPosition: true, visible: false, actions: [], context: undefined as any, trigger: 'manual', autoHide: false, hideDelay: 3000, showAnimation: 'slide-fade', backdrop: false, backdropClosable: true, escapeClosable: true, offset: 12, label: '', showLabel: false, showShortcuts: false }; const value = this.currentConfig[key]; return (value !== undefined ? value : defaultValues[key]) as NonNullable; } private logAction(message: string): void { const timestamp = new Date().toLocaleTimeString(); this.actionLog.unshift(`[${timestamp}] ${message}`); // Keep only the last 10 entries if (this.actionLog.length > 10) { this.actionLog = this.actionLog.slice(0, 10); } } }1xn

    UI Font Manager Demo

    Dynamically load Google Fonts and switch between font themes with smooth transitions. Select a font preset to apply it globally to the entire application.

    Font Preset Selection

    Choose from curated font combinations. The selected preset will be applied to the entire application.

    Currently Applied: {{currentPreset.name}}

    Sans-serif: {{currentPreset.fonts.sans}}
    Serif: {{currentPreset.fonts.serif}}
    Monospace: {{currentPreset.fonts.mono}}
    Display: {{currentPreset.fonts.display}}

    Typography Preview

    See how the selected fonts look in a real application context.

    Display Heading (H1)

    Sans-serif Heading (H2)

    Serif Heading (H3)

    This is a paragraph using the sans-serif font. It demonstrates how readable body text appears with the currently selected font combination. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    "This is a quote using the serif font, which often provides better readability for longer text passages and adds elegance to quoted content." 
    // Code example with monospace font
function applyFontTheme(theme) {
  document.documentElement.style.setProperty('--font-family-sans', theme.sans);
  document.documentElement.style.setProperty('--font-family-serif', theme.serif);
  document.documentElement.style.setProperty('--font-family-mono', theme.mono);
}
    Current fonts: Sans (var(--font-family-sans)) | Serif (var(--font-family-serif)) | Mono (var(--font-family-mono)) | Display (var(--font-family-display))

    Available Font Presets

    {{preset.name}}

    {{preset.description}}

    Sans: {{preset.fonts.sans}}
    Serif: {{preset.fonts.serif}}
    Mono: {{preset.fonts.mono}}
    Display: {{preset.fonts.display}}

    Popular Individual Fonts

    Load individual fonts to test and preview them.

    Event Log

    {{event.time}} {{event.message}}
    ?x".demo-container { padding: 2rem; max-width: 1200px; margin: 0 auto; } .demo-description { font-size: 1.1rem; color: #666; margin-bottom: 2rem; line-height: 1.6; } .demo-section { margin: 3rem 0; padding: 2rem; border: 1px solid #e0e0e0; border-radius: 12px; background: #fafafa; h2, h3 { margin-top: 0; color: #333; } h2 { font-size: 1.5rem; margin-bottom: 1.5rem; } h3 { font-size: 1.25rem; margin-bottom: 1rem; } } // Loading State Display .state-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem; margin-top: 1rem; } .state-item { padding: 1rem; background: white; border-radius: 8px; border-left: 4px solid #2196F3; strong { color: #333; display: block; margin-bottom: 0.5rem; } .loading { color: #FF9800; font-weight: 500; } .idle { color: #4CAF50; font-weight: 500; } } // Manual Font Controls .font-controls { margin-top: 1rem; } .font-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 1rem; } .font-button { position: relative; padding: 1rem; border: 2px solid #e0e0e0; border-radius: 8px; background: white; cursor: pointer; transition: all 0.3s ease; font-size: 0.9rem; &:hover { border-color: #2196F3; background: #f5f5f5; } &.loaded { border-color: #4CAF50; background: #e8f5e8; color: #2e7d32; font-weight: 500; } } .load-status { position: absolute; top: 0.5rem; right: 0.5rem; color: #4CAF50; font-weight: bold; } // Transition Controls .transition-controls { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; margin-top: 1rem; } .transition-btn { padding: 1rem; border: 2px solid #2196F3; border-radius: 8px; background: white; color: #2196F3; cursor: pointer; transition: all 0.3s ease; font-weight: 500; &:hover { background: #2196F3; color: white; } &.scale { border-color: #FF9800; color: #FF9800; &:hover { background: #FF9800; color: white; } } &.typewriter { border-color: #9C27B0; color: #9C27B0; &:hover { background: #9C27B0; color: white; } } } // Typography Showcase .typography-showcase { display: grid; gap: 2rem; margin-top: 1.5rem; } .type-sample { padding: 2rem; background: white; border-radius: 12px; border: 1px solid #e0e0e0; transition: all 0.3s ease; h1, h2, h3, h4 { margin: 0 0 1rem 0; line-height: 1.3; } h1 { font-size: 2.5rem; font-weight: 700; } h2 { font-size: 2rem; font-weight: 600; } h3 { font-size: 1.75rem; font-weight: 500; } h4 { font-size: 1.5rem; font-weight: 500; } p { line-height: 1.6; margin-bottom: 1rem; } pre { background: #f5f5f5; padding: 1rem; border-radius: 8px; overflow-x: auto; margin: 1rem 0; code { font-size: 0.9rem; line-height: 1.5; } } } .font-info { font-size: 0.8rem; color: #666; font-style: italic; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e0e0e0; } // Available Themes .themes-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem; margin-top: 1.5rem; } .theme-card { padding: 1.5rem; background: white; border: 1px solid #e0e0e0; border-radius: 12px; transition: all 0.3s ease; &:hover { border-color: #2196F3; box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1); } h4 { margin: 0 0 0.5rem 0; color: #333; font-size: 1.1rem; } } .theme-description { color: #666; font-size: 0.9rem; margin-bottom: 1rem; line-height: 1.4; } .theme-fonts { margin-bottom: 1.5rem; } .theme-font { display: flex; justify-content: space-between; padding: 0.25rem 0; font-size: 0.85rem; strong { color: #333; min-width: 60px; } & + .theme-font { border-top: 1px solid #f0f0f0; } } .apply-theme-btn { width: 100%; padding: 0.75rem; border: 1px solid #2196F3; border-radius: 6px; background: #2196F3; color: white; cursor: pointer; transition: all 0.3s ease; font-weight: 500; &:hover { background: #1976D2; border-color: #1976D2; } } // Event Log .event-log { max-height: 300px; overflow-y: auto; background: white; border: 1px solid #e0e0e0; border-radius: 8px; padding: 1rem; } .event-item { display: flex; gap: 1rem; padding: 0.5rem 0; font-size: 0.9rem; border-bottom: 1px solid #f0f0f0; &:last-child { border-bottom: none; } &.success { color: #4CAF50; } &.error { color: #f44336; } &.info { color: #2196F3; } } .event-time { color: #666; font-size: 0.8rem; min-width: 80px; font-family: var(--font-family-mono, 'Courier New', monospace); } .event-message { flex: 1; } // Font Preset Controls .preset-controls { display: flex; flex-direction: column; gap: 1.5rem; margin-top: 1rem; } .preset-selector { label { display: block; margin-bottom: 0.5rem; font-weight: 600; color: #333; } select { width: 100%; padding: 0.75rem; border: 2px solid #e0e0e0; border-radius: 8px; font-size: 1rem; background: white; transition: border-color 0.3s ease; &:focus { outline: none; border-color: #2196F3; } &:disabled { opacity: 0.6; cursor: not-allowed; } } } .transition-selector { display: flex; gap: 1rem; align-items: end; flex-wrap: wrap; label { font-weight: 600; color: #333; margin-bottom: 0.5rem; display: block; } select { padding: 0.5rem; border: 1px solid #ccc; border-radius: 6px; font-size: 0.9rem; min-width: 120px; } } .apply-btn { padding: 0.75rem 1.5rem; background: #2196F3; color: white; border: none; border-radius: 8px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; white-space: nowrap; &:hover:not(:disabled) { background: #1976D2; transform: translateY(-2px); } &:disabled { opacity: 0.6; cursor: not-allowed; transform: none; } } // Current Preset Display .current-preset { margin-top: 2rem; padding: 1.5rem; background: #e8f5e8; border: 1px solid #4CAF50; border-radius: 12px; h4 { margin: 0 0 1rem 0; color: #2e7d32; font-size: 1.1rem; } } .preset-fonts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.5rem; } .font-assignment { display: flex; justify-content: space-between; padding: 0.5rem; background: white; border-radius: 6px; font-size: 0.9rem; .font-type { font-weight: 600; color: #333; } .font-name { color: #666; font-style: italic; } } // Theme card active state .theme-card.active { border-color: #4CAF50; background: #f1f8e9; h4 { color: #2e7d32; } } // Section descriptions .preset-description, .preview-description, .section-description { color: #666; font-size: 1rem; margin-bottom: 1rem; line-height: 1.5; } // Font transition animations :global(html.font-transition-fade) { * { transition: font-family 0.8s ease-in-out; } } :global(html.font-transition-scale) { * { transition: font-family 0.6s ease-in-out, transform 0.6s ease-in-out; } body { transform: scale(1.02); transition: transform 0.3s ease-in-out; } &.font-transition-scale body { transform: scale(1); } } :global(html.font-transition-typewriter) { * { transition: font-family 0.5s steps(10, end); } } // Enhanced blockquote styling blockquote { margin: 1.5rem 0; padding: 1rem 1.5rem; border-left: 4px solid #2196F3; background: #f8f9fa; font-style: italic; position: relative; &::before { content: '"'; font-size: 3rem; color: #2196F3; position: absolute; top: -0.5rem; left: 1rem; opacity: 0.3; } } // Responsive Design @media (max-width: 768px) { .demo-container { padding: 1rem; } .demo-section { padding: 1.5rem; } .font-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); } .transition-controls { grid-template-columns: 1fr; } .themes-grid { grid-template-columns: 1fr; } .state-info { grid-template-columns: 1fr; } .type-sample { padding: 1.5rem; h1 { font-size: 2rem; } h2 { font-size: 1.75rem; } h3 { font-size: 1.5rem; } h4 { font-size: 1.25rem; } } .preset-controls { gap: 1rem; } .transition-selector { flex-direction: column; align-items: stretch; gap: 1rem; select, .apply-btn { width: 100%; } } .preset-fonts { grid-template-columns: 1fr; } }Ncx>import { Component, OnInit, OnDestroy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { Subject, takeUntil } from 'rxjs'; // Mock font combinations since ui-font-manager is not yet available const FONT_COMBINATIONS = { 'Modern Clean': { sans: 'Inter', serif: 'Playfair Display', mono: 'JetBrains Mono', display: 'Inter' }, 'Classic Editorial': { sans: 'Source Sans Pro', serif: 'Lora', mono: 'Source Code Pro', display: 'Source Sans Pro' }, 'Friendly Modern': { sans: 'Poppins', serif: 'Merriweather', mono: 'Fira Code', display: 'Poppins' }, 'Professional': { sans: 'Roboto', serif: 'EB Garamond', mono: 'Roboto Mono', display: 'Roboto' } }; @Component({ selector: 'app-font-manager-demo', standalone: true, imports: [CommonModule, FormsModule], template: `

    UI Font Manager Demo

    Dynamically load Google Fonts and switch between font themes with smooth transitions. Select a font preset to apply it globally to the entire application.

    Font Preset Selection

    Choose from curated font combinations. The selected preset will be applied to the entire application.

    Currently Applied: {{currentPreset.name}}

    Sans-serif: {{currentPreset.fonts.sans}}
    Serif: {{currentPreset.fonts.serif}}
    Monospace: {{currentPreset.fonts.mono}}
    Display: {{currentPreset.fonts.display}}

    Typography Preview

    See how the selected fonts look in a real application context.

    Display Heading (H1)

    Sans-serif Heading (H2)

    Serif Heading (H3)

    This is a paragraph using the sans-serif font. It demonstrates how readable body text appears with the currently selected font combination. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    "This is a quote using the serif font, which often provides better readability for longer text passages and adds elegance to quoted content."
    Current fonts: Sans (var(--font-family-sans)) | Serif (var(--font-family-serif)) | Mono (var(--font-family-mono)) | Display (var(--font-family-display))

    Available Font Presets

    {{preset.name}}

    {{preset.description}}

    Sans: {{preset.fonts.sans}}
    Serif: {{preset.fonts.serif}}
    Mono: {{preset.fonts.mono}}
    Display: {{preset.fonts.display}}

    Popular Individual Fonts

    Load individual fonts to test and preview them.

    Event Log

    {{event.time}} {{event.message}}
    `, styleUrl: './font-manager-demo.component.scss' }) export class FontManagerDemoComponent implements OnInit, OnDestroy { popularFonts = ['Inter', 'Roboto', 'Playfair Display', 'JetBrains Mono', 'Montserrat', 'Lora']; loadedFonts = new Set(); // Font preset management fontPresets = [ { key: 'modern-clean', name: 'Modern Clean', description: 'Contemporary and minimal design with Inter and Playfair Display', fonts: FONT_COMBINATIONS['Modern Clean'] }, { key: 'classic-editorial', name: 'Classic Editorial', description: 'Traditional publishing style with Source Sans Pro and Lora', fonts: FONT_COMBINATIONS['Classic Editorial'] }, { key: 'friendly-modern', name: 'Friendly Modern', description: 'Approachable and warm with Poppins and Merriweather', fonts: FONT_COMBINATIONS['Friendly Modern'] }, { key: 'professional', name: 'Professional', description: 'Corporate and reliable with Roboto and EB Garamond', fonts: FONT_COMBINATIONS['Professional'] }, { key: 'system', name: 'System Default', description: 'Use system fonts for optimal performance', fonts: { sans: 'system-ui', serif: 'ui-serif', mono: 'ui-monospace', display: 'system-ui' } } ]; selectedPreset: string = ''; selectedTransition: 'fade' | 'scale' | 'typewriter' = 'fade'; currentPreset: any = null; eventLog: Array<{time: string, message: string, type: 'success' | 'error' | 'info'}> = []; private destroy$ = new Subject(); constructor() {} ngOnInit(): void { this.logEvent('Component initialized', 'info'); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } onThemeChanged(themeName: string): void { this.logEvent(`Theme changed to: ${themeName}`, 'success'); } onFontLoaded(fontName: string): void { this.logEvent(`Font loaded: ${fontName}`, 'success'); this.loadedFonts.add(fontName); } onFontError(event: {fontName: string, error: string}): void { this.logEvent(`Font error - ${event.fontName}: ${event.error}`, 'error'); } loadSingleFont(fontName: string): void { this.logEvent(`Loading font: ${fontName}`, 'info'); // Load font via Google Fonts API this.loadGoogleFont(fontName); this.loadedFonts.add(fontName); this.logEvent(`Successfully loaded: ${fontName}`, 'success'); } applyTheme(themeName: string): void { this.logEvent(`Applying theme: ${themeName}`, 'info'); this.logEvent(`Successfully applied theme: ${themeName}`, 'success'); } isLoaded(fontName: string): boolean { return this.loadedFonts.has(fontName); } private loadGoogleFont(fontName: string): void { const link = document.createElement('link'); link.href = `https://fonts.googleapis.com/css2?family=${fontName.replace(' ', '+')}&display=swap`; link.rel = 'stylesheet'; document.head.appendChild(link); } onPresetChange(event: Event): void { const target = event.target as HTMLSelectElement; this.selectedPreset = target.value; if (this.selectedPreset) { const preset = this.fontPresets.find(p => p.key === this.selectedPreset); if (preset) { this.logEvent(`Selected preset: ${preset.name}`, 'info'); } } } applyPreset(presetKey: string): void { const preset = this.fontPresets.find(p => p.key === presetKey); if (!preset) { this.logEvent(`Preset not found: ${presetKey}`, 'error'); return; } this.selectedPreset = presetKey; this.logEvent(`Applying preset: ${preset.name}`, 'info'); // Apply fonts to document root for global effect this.applyFontsGlobally(preset.fonts); this.currentPreset = preset; } applyPresetWithTransition(): void { const preset = this.fontPresets.find(p => p.key === this.selectedPreset); if (!preset) return; this.logEvent(`Applying preset "${preset.name}" with ${this.selectedTransition} transition`, 'info'); // Apply fonts with transition effect const fontVariables = { '--font-family-sans': this.buildGlobalFontStack(preset.fonts.sans), '--font-family-serif': this.buildGlobalFontStack(preset.fonts.serif), '--font-family-mono': this.buildGlobalFontStack(preset.fonts.mono), '--font-family-display': this.buildGlobalFontStack(preset.fonts.display) }; this.applyFontsWithTransition(fontVariables, this.selectedTransition); this.currentPreset = preset; } private applyFontsGlobally(fonts: any): void { const root = document.documentElement; // Set CSS custom properties on the document root root.style.setProperty('--font-family-sans', this.buildGlobalFontStack(fonts.sans)); root.style.setProperty('--font-family-serif', this.buildGlobalFontStack(fonts.serif)); root.style.setProperty('--font-family-mono', this.buildGlobalFontStack(fonts.mono)); root.style.setProperty('--font-family-display', this.buildGlobalFontStack(fonts.display)); // Also load the fonts if they're Google Fonts if (fonts.sans && fonts.sans !== 'system-ui') { this.loadSingleFont(fonts.sans); } if (fonts.serif && fonts.serif !== 'ui-serif') { this.loadSingleFont(fonts.serif); } if (fonts.mono && fonts.mono !== 'ui-monospace') { this.loadSingleFont(fonts.mono); } if (fonts.display && fonts.display !== 'system-ui') { this.loadSingleFont(fonts.display); } this.logEvent(`Applied fonts globally to document root`, 'success'); } private applyFontsWithTransition(fontVariables: Record, transitionType: 'fade' | 'scale' | 'typewriter'): void { const root = document.documentElement; // Add transition class root.classList.add(`font-transition-${transitionType}`); // Apply font changes Object.entries(fontVariables).forEach(([property, value]) => { root.style.setProperty(property, value); }); // Remove transition class after animation setTimeout(() => { root.classList.remove(`font-transition-${transitionType}`); this.logEvent(`${transitionType} transition completed`, 'success'); }, 1000); } private buildGlobalFontStack(fontName: string): string { // Handle system fonts if (fontName === 'system-ui') { return 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'; } if (fontName === 'ui-serif') { return 'ui-serif, Georgia, Cambria, "Times New Roman", Times, serif'; } if (fontName === 'ui-monospace') { return 'ui-monospace, SFMono-Regular, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'; } // For Google Fonts, add appropriate fallbacks const fontMap: Record = { 'Inter': `"Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif`, 'Roboto': `"Roboto", Arial, Helvetica, sans-serif`, 'Poppins': `"Poppins", Arial, Helvetica, sans-serif`, 'Source Sans Pro': `"Source Sans Pro", Arial, Helvetica, sans-serif`, 'Montserrat': `"Montserrat", Arial, Helvetica, sans-serif`, 'Playfair Display': `"Playfair Display", Georgia, "Times New Roman", serif`, 'Lora': `"Lora", Georgia, "Times New Roman", serif`, 'Merriweather': `"Merriweather", Georgia, "Times New Roman", serif`, 'EB Garamond': `"EB Garamond", Georgia, "Times New Roman", serif`, 'JetBrains Mono': `"JetBrains Mono", Consolas, Monaco, "Courier New", monospace`, 'Source Code Pro': `"Source Code Pro", Consolas, Monaco, "Courier New", monospace`, 'Fira Code': `"Fira Code", Consolas, Monaco, "Courier New", monospace`, 'Roboto Mono': `"Roboto Mono", Consolas, Monaco, "Courier New", monospace`, 'Oswald': `"Oswald", Impact, "Arial Black", sans-serif`, 'Raleway': `"Raleway", Arial, Helvetica, sans-serif` }; return fontMap[fontName] || `"${fontName}", sans-serif`; } private logEvent(message: string, type: 'success' | 'error' | 'info'): void { const time = new Date().toLocaleTimeString(); this.eventLog.push({ time, message, type }); // Keep only last 50 events if (this.eventLog.length > 50) { this.eventLog = this.eventLog.slice(-50); } } }bkx.export * from './font-manager-demo.component';zYxu@import "../../../../../ui-design-system/src/styles/semantic"; .demo-container { padding: 2rem; max-width: 1200px; margin: 0 auto; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; } h2 { color: #2c3e50; font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid #6366f1; padding-bottom: 0.5rem; } h3 { color: #374151; font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: #6b7280; font-size: 1.125rem; margin-bottom: 0.75rem; } // Sections .demo-section { border: 1px solid #e5e7eb; border-radius: 8px; padding: 1.5rem; margin-bottom: 2rem; background: #ffffff; } .intro-section { border: 1px solid #e5e7eb; border-radius: 8px; padding: 1.5rem; margin-bottom: 2rem; background: #f8fafc; p { margin-bottom: 1rem; color: #6b7280; } } .info-box { display: flex; align-items: center; gap: 0.75rem; padding: 1rem; background: #dbeafe; border-radius: 6px; border-left: 4px solid #3b82f6; .info-icon { color: #3b82f6; } span { color: #1f2937; } } // Icon Grid .icon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin: 1rem 0; } .icon-example { display: flex; flex-direction: column; align-items: center; padding: 1rem; border: 1px solid #e5e7eb; border-radius: 6px; background: #ffffff; cursor: pointer; transition: all 0.2s ease; &:hover { background: #f3f4f6; border-color: #6366f1; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } .icon-name { font-weight: 600; color: #1f2937; margin: 0.5rem 0 0.25rem; font-family: 'JetBrains Mono', 'Courier New', monospace; } .icon-usage { font-size: 0.875rem; color: #6b7280; text-align: center; margin-bottom: 0.5rem; } code { font-size: 0.75rem; background: #f3f4f6; padding: 0.25rem 0.5rem; border-radius: 4px; color: #6b7280; font-family: 'JetBrains Mono', 'Courier New', monospace; text-align: center; } } // Size Demo .size-demo { display: flex; flex-direction: column; gap: 1rem; } .size-row { display: flex; align-items: center; gap: 1rem; padding: 0.5rem; background: #f8fafc; border-radius: 6px; .size-label { font-weight: 600; min-width: 30px; color: #1f2937; } fa-icon { color: #6366f1; min-width: 80px; text-align: center; } code { background: #ffffff; padding: 0.25rem 0.5rem; border-radius: 4px; color: #6b7280; font-family: 'JetBrains Mono', 'Courier New', monospace; font-size: 0.875rem; } } // Styling Demo .styling-demo { display: flex; flex-direction: column; gap: 2rem; } .style-example { padding: 1rem; background: #f8fafc; border-radius: 6px; h4 { margin-bottom: 1rem; } } .color-row, .animation-row { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; fa-icon { flex-shrink: 0; } } // Use Cases .use-cases { display: flex; flex-direction: column; gap: 2rem; } .use-case { padding: 1rem; background: #f8fafc; border-radius: 6px; } .nav-example { display: flex; gap: 2rem; align-items: center; flex-wrap: wrap; fa-icon { margin-right: 0.5rem; color: #6366f1; } } .action-buttons { display: flex; gap: 1rem; flex-wrap: wrap; } .status-row { display: flex; gap: 2rem; flex-wrap: wrap; } .status-item { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; border-radius: 6px; &.success { background: #dcfce7; color: #166534; fa-icon { color: #22c55e; } } &.warning { background: #fef3c7; color: #92400e; fa-icon { color: #f59e0b; } } &.error { background: #fee2e2; color: #991b1b; fa-icon { color: #ef4444; } } &.info { background: #dbeafe; color: #1e40af; fa-icon { color: #3b82f6; } } } // Code Examples .code-examples { display: flex; flex-direction: column; gap: 1rem; } .code-example { padding: 1rem; background: #f8fafc; border-radius: 6px; h4 { margin-bottom: 0.5rem; color: #6366f1; } pre { margin: 0; background: #ffffff; padding: 1rem; border-radius: 4px; overflow-x: auto; border: 1px solid #e5e7eb; code { font-family: 'JetBrains Mono', 'Courier New', monospace; color: #1f2937; font-size: 0.875rem; line-height: 1.5; } } } // Selected Icon Details .selected-icon { background: #ede9fe; border-color: #6366f1; } .icon-details { display: flex; gap: 2rem; margin-bottom: 1.5rem; align-items: flex-start; @media (max-width: 768px) { flex-direction: column; align-items: center; text-align: center; gap: 1rem; } } .icon-display { flex-shrink: 0; padding: 2rem; background: #ffffff; border-radius: 8px; border: 2px solid #6366f1; fa-icon { color: #6366f1; } } .icon-info { flex: 1; h4 { color: #5b21b6; font-size: 1.5rem; margin-bottom: 1rem; font-family: 'JetBrains Mono', 'Courier New', monospace; } p { margin-bottom: 0.75rem; color: #1f2937; } } .copy-code { display: flex; align-items: center; gap: 1rem; padding: 1rem; background: #ffffff; border-radius: 6px; border: 1px solid #e5e7eb; code { flex: 1; background: none; color: #1f2937; font-family: 'JetBrains Mono', 'Courier New', monospace; font-size: 0.875rem; } } // Interactive Demo .action-feedback { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; padding: 1rem; background: #dbeafe; border-radius: 6px; border-left: 4px solid #3b82f6; fa-icon { color: #3b82f6; } span { color: #1f2937; } } .interactive-buttons { display: flex; gap: 1rem; flex-wrap: wrap; } // Best Practices .best-practices { display: flex; flex-direction: column; gap: 1.5rem; } .practice-item { display: flex; gap: 1rem; padding: 1rem; background: #ffffff; border-radius: 6px; border: 1px solid #e5e7eb; .practice-icon { flex-shrink: 0; margin-top: 0.25rem; &.success { color: #22c55e; } &.warning { color: #f59e0b; } } .practice-content { flex: 1; h4 { color: #1f2937; margin-bottom: 0.5rem; } p { color: #6b7280; margin-bottom: 0.75rem; line-height: 1.5; } code { background: #f3f4f6; padding: 0.25rem 0.5rem; border-radius: 4px; color: #374151; font-family: 'JetBrains Mono', 'Courier New', monospace; font-size: 0.875rem; } } } // Quick Reference .reference-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; } .reference-category { padding: 1rem; background: #ffffff; border-radius: 6px; border: 1px solid #e5e7eb; h4 { color: #6366f1; margin-bottom: 1rem; font-weight: 600; } } .reference-list { display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.875rem; line-height: 1.4; code { background: #f3f4f6; padding: 0.25rem 0.5rem; border-radius: 4px; color: #6366f1; font-family: 'JetBrains Mono', 'Courier New', monospace; font-weight: 600; margin-right: 0.5rem; } } // Responsive Design @media (max-width: 768px) { .demo-container { padding: 1rem; } .icon-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.75rem; } .action-buttons, .interactive-buttons { flex-direction: column; align-items: stretch; } .nav-example { flex-direction: column; align-items: flex-start; gap: 1rem; } .status-row { flex-direction: column; gap: 1rem; } .size-row { flex-direction: column; align-items: flex-start; gap: 0.5rem; } .color-row, .animation-row { justify-content: center; } }adxjngqFbQjniF _y[ؼ xUSimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FaIconComponent } from '@fortawesome/angular-fontawesome'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/button.component'; import { // Solid icons from shared-ui faUser, faHome, faCog, faSearch, faPlus, faEdit, faTrash, faSave, faCancel, faCheck, faTimes, faArrowLeft, faArrowRight, faChevronLeft, faChevronRight, faChevronUp, faChevronDown, faBars, faEllipsisV, faEye, faEyeSlash, faDownload, faUpload, faRefresh, faSpinner, faExclamationTriangle, faInfoCircle, faCheckCircle, faTimesCircle, faEnvelope } from '@fortawesome/free-solid-svg-icons'; import { // Regular icons from shared-ui faHeart, faBookmark, faComment, faThumbsUp } from '@fortawesome/free-regular-svg-icons'; import { // Brand icons from shared-ui faGithub, faTwitter, faLinkedin, faGoogle } from '@fortawesome/free-brands-svg-icons'; @Component({ selector: 'ui-fontawesome-demo', standalone: true, imports: [ CommonModule, FaIconComponent, ButtonComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Font Awesome Icons Showcase

    Font Awesome Integration

    This demo showcases the Font Awesome icons available in the shared-ui library. Icons are pre-configured and ready to use across the application.

    Available Categories: Solid, Regular, and Brand icons from Font Awesome

    Basic Usage

    faUser fa-icon [icon]="faUser"
    faHome fa-icon [icon]="faHome"
    faCog fa-icon [icon]="faCog"

    Icon Sizes

    xs: size="xs"
    sm: size="sm"
    lg: size="lg"
    2x: size="2x"
    3x: size="3x"

    Solid Icons (free-solid-svg-icons)

    Most commonly used icons for UI elements, actions, and navigation.

    faUser User profiles, accounts
    faHome Home navigation
    faCog Settings
    faSearch Search functionality
    faPlus Add new items
    faEdit Edit content
    faTrash Delete items
    faSave Save changes
    faCheck Confirm, success
    faTimes Close, dismiss
    faArrowLeft Back navigation
    faArrowRight Forward navigation
    faDownload Download files
    faUpload Upload files
    faRefresh Refresh content
    faSpinner Loading states

    Regular Icons (free-regular-svg-icons)

    Outlined versions of icons, great for secondary actions and states.

    faHeart Favorites, likes
    faBookmark Saved items
    faComment Comments
    faThumbsUp Approval

    Brand Icons (free-brands-svg-icons)

    Social media and company logos for external integrations.

    faGithub GitHub integration
    faTwitter Twitter sharing
    faLinkedin LinkedIn integration
    faGoogle Google services

    Icon Styling & Transformations

    Colors

    style="color: #dc3545;"

    Different Sizes

    size="lg", size="2x", size="3x"

    Common Use Cases

    Navigation

    Home
    Profile
    Settings
    Search

    Action Buttons

    Add Item Edit Delete Save

    Status Indicators

    Success
    Warning
    Error
    Info

    Implementation Examples

    1. Import the Icon

    import { faUser } from '@fortawesome/free-solid-svg-icons';

    2. Add to Component

    export class MyComponent {
  faUser = faUser;
  faHome = faHome;
  faCog = faCog;
}

    3. Basic Icon Usage

    <fa-icon [icon]="faUser"></fa-icon>
<fa-icon [icon]="faHome" size="lg"></fa-icon>
<fa-icon [icon]="faCog" size="2x"></fa-icon>

    4. Styled Icons

    <fa-icon 
  [icon]="faHeart" 
  size="2x" 
  style="color: #dc3545;">
</fa-icon>

    5. Icons in Buttons

    <ui-button 
  variant="filled" 
  [icon]="faPlus" 
  iconPosition="left">
  Add Item
</ui-button>

    6. Navigation with Icons

    <nav class="nav-menu">
  <a href="/home">
    <fa-icon [icon]="faHome"></fa-icon> Home
  </a>
  <a href="/profile">
    <fa-icon [icon]="faUser"></fa-icon> Profile
  </a>
</nav>

    7. Status Messages

    <div class="status-success">
  <fa-icon [icon]="faCheckCircle"></fa-icon>
  Operation completed successfully!
</div>

<div class="status-error">
  <fa-icon [icon]="faTimesCircle"></fa-icon>
  Something went wrong.
</div>

    8. Loading States

    <div class="loading-container">
  <fa-icon [icon]="faSpinner"></fa-icon>
  Loading...
</div>

<ui-button 
  [disabled]="isLoading" 
  [icon]="isLoading ? faSpinner : faSave">
  {{ isLoading ? 'Saving...' : 'Save' }}
</ui-button>

    Best Practices

    Import Only What You Need

    Only import the specific icons you're using to keep bundle size small.

    import { faUser, faHome } from '@fortawesome/free-solid-svg-icons';

    Use Semantic Naming

    Choose icons that clearly represent their function or meaning.

    faTrash for delete, faEdit for edit, faPlus for add

    Consistent Sizing

    Use consistent icon sizes throughout your application.

    size="sm" for inline text, size="lg" for buttons

    Accessibility

    Add aria-labels for screen readers when icons convey important information.

    <fa-icon [icon]="faUser" aria-label="User profile"></fa-icon>

    Quick Reference

    Actions

    faPlus - Add/Create faEdit - Edit/Modify faTrash - Delete/Remove faSave - Save/Confirm faCancel - Cancel/Dismiss faRefresh - Reload/Update

    Navigation

    faHome - Home page faArrowLeft - Go back faArrowRight - Go forward faChevronUp - Expand up faChevronDown - Expand down faBars - Menu toggle

    Status

    faCheckCircle - Success faTimesCircle - Error faExclamationTriangle - Warning faInfoCircle - Information faSpinner - Loading

    User Interface

    faUser - User/Profile faCog - Settings faSearch - Search faEye - View/Show faEyeSlash - Hide faDownload - Download

    Interactive Demo

    Refresh Demo Download Examples View Source
    @if (lastAction) {
    {{ lastAction }}
    }
    `, styleUrl: './fontawesome-demo.component.scss' }) export class FontAwesomeDemoComponent { lastAction: string = ''; isLoading: boolean = false; // Export icons for template use faInfoCircle = faInfoCircle; faUser = faUser; faHome = faHome; faCog = faCog; faSearch = faSearch; faPlus = faPlus; faEdit = faEdit; faTrash = faTrash; faSave = faSave; faCancel = faCancel; faCheck = faCheck; faTimes = faTimes; faArrowLeft = faArrowLeft; faArrowRight = faArrowRight; faChevronLeft = faChevronLeft; faChevronRight = faChevronRight; faChevronUp = faChevronUp; faChevronDown = faChevronDown; faBars = faBars; faEllipsisV = faEllipsisV; faEye = faEye; faEyeSlash = faEyeSlash; faDownload = faDownload; faUpload = faUpload; faRefresh = faRefresh; faSpinner = faSpinner; faExclamationTriangle = faExclamationTriangle; faCheckCircle = faCheckCircle; faTimesCircle = faTimesCircle; faEnvelope = faEnvelope; // Regular icons faHeart = faHeart; faBookmark = faBookmark; faComment = faComment; faThumbsUp = faThumbsUp; // Brand icons faGithub = faGithub; faTwitter = faTwitter; faLinkedin = faLinkedin; faGoogle = faGoogle; refreshDemo(): void { this.lastAction = 'Demo refreshed - all selections cleared'; console.log('Demo refreshed'); } downloadDemo(): void { this.lastAction = 'Demo download initiated (simulated)'; console.log('Download demo'); } viewSource(): void { this.lastAction = 'Opening source code (simulated)'; console.log('View source'); } }1װn:x[qj C* xSimport { Component, OnInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormControl, FormGroup, ReactiveFormsModule, Validators, AbstractControl, ValidationErrors } from '@angular/forms'; import { FormFieldComponent } from '../../../../../ui-essentials/src/lib/components/forms/form-field/form-field.component'; @Component({ selector: 'ui-form-field-demo', standalone: true, imports: [CommonModule, ReactiveFormsModule, FormFieldComponent], template: `

    Form Field Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size.toUpperCase() }} Size

    Form field with {{ size }} sizing.

    }

    Layout Options

    Vertical Layout (Default)

    Standard vertical layout with label above the control.

    Horizontal Layout

    Horizontal layout with label beside the control.

    Compact Layout

    Compact spacing for tighter layouts.

    States

    Default State

    Normal state with no validation.

    Error State

    Error state with error message.

    Success State

    Success state with success message.

    Warning State

    Warning state with warning message.

    Info State

    Info state with informational message.

    Disabled State

    Disabled field with disabled styling.

    Required and Optional Fields

    Required Field

    Field marked as required with asterisk.

    Optional Field

    Field marked as optional with (optional) text.

    Input Types

    Text Input

    Email Input

    Number Input

    Textarea

    Select

    Checkbox Group

    Character Count

    With Character Counter

    Shows character count with maximum limit.

    Hint Text

    With Hint

    Additional helpful information with icon.

    Reactive Form Integration

    Form with Validation

    Form fields with Angular reactive form validation.

    Form Status: {{ validationForm.status }}
    Form Valid: {{ validationForm.valid }}
    Form Touched: {{ validationForm.touched }}
    Form Dirty: {{ validationForm.dirty }}

    Usage Example

    {{ codeExample }}
    `, styleUrl: './form-field-demo.component.scss' }) export class FormFieldDemoComponent implements OnInit { sizes = ['sm', 'md', 'lg'] as const; characterCountText = ''; validationForm = new FormGroup({ name: new FormControl('', [Validators.required, Validators.minLength(2)]), email: new FormControl('', [Validators.required, Validators.email]), password: new FormControl('', [Validators.required, Validators.minLength(8)]), age: new FormControl('', [Validators.min(18), Validators.max(100)]), website: new FormControl('', [this.urlValidator]), bio: new FormControl('', [Validators.maxLength(200)]) }); validationMessages = { required: 'This field is required', email: 'Please enter a valid email address', minlength: 'This field is too short', maxlength: 'This field is too long', min: 'Value is too low', max: 'Value is too high', url: 'Please enter a valid URL', custom: 'Custom validation error' }; readonly codeExample = `import { FormFieldComponent } from '../../../../../ui-essentials/src/lib/components/forms/form-field/form-field.component'; // Basic usage // With validation messages // Horizontal layout
    // Custom states `; ngOnInit(): void { // Watch form changes for demo purposes this.validationForm.valueChanges.subscribe(() => { // Update demo display if needed }); } updateCharacterCount(event: Event): void { const input = event.target as HTMLInputElement; this.characterCountText = input.value; } isFieldInvalid(fieldName: string): boolean { const field = this.validationForm.get(fieldName); return field ? field.invalid && (field.dirty || field.touched) : false; } isFieldValid(fieldName: string): boolean { const field = this.validationForm.get(fieldName); return field ? field.valid && field.value && (field.dirty || field.touched) : false; } getFieldValue(fieldName: string): any { return this.validationForm.get(fieldName)?.value; } markAllTouched(): void { this.validationForm.markAllAsTouched(); } resetValidationForm(): void { this.validationForm.reset(); Object.keys(this.validationForm.controls).forEach(key => { this.validationForm.get(key)?.setErrors(null); }); } fillSampleData(): void { this.validationForm.patchValue({ name: 'John Doe', email: 'john.doe@example.com', password: 'SecurePass123!', age: "30", website: 'https://johndoe.com', bio: 'Software developer with 10 years of experience in web development.' }); this.validationForm.markAllAsTouched(); } // Custom URL validator private urlValidator(control: AbstractControl): ValidationErrors | null { if (!control.value) return null; try { new URL(control.value); return null; } catch { return { url: true }; } } }Axqr .#e

    Gallery Grid Demo

    A responsive media grid with lightbox functionality for organizing and displaying images.

    Column Variants

    @for (columnCount of columnVariants; track columnCount) {

    {{ columnCount }} Columns

    }

    Gap Sizes

    @for (gap of gapSizes; track gap) {

    {{ gap | titlecase }} Gap

    }

    Object Fit Options

    @for (fit of objectFitOptions; track fit) {

    {{ fit | titlecase }} Fit

    }

    Auto-fit Responsive

    Automatically adjusts columns based on available space (resize window to see effect):

    Masonry Layout

    Items align to top with varying heights:

    Interactive Features

    @if (selectedItems.length > 0) {

    Selected Items: {{ selectedItems.length }}

      @for (item of selectedItems; track item.id) {
    • {{ item.title || item.alt || 'Item ' + item.id }}
      • }
    }

    Empty State

    Loading State

    Event Log

    @if (eventLog.length === 0) {

    No events yet. Interact with the gallery above to see events.

    } @else { @for (event of eventLog; track event.id) {
    {{ event.type }} {{ event.details }} {{ event.timestamp | date:'HH:mm:ss' }}
    } }
    `, styleUrl: './gallery-grid-demo.component.scss' }) export class GalleryGridDemoComponent { columnVariants = [2, 3, 4] as const; gapSizes = ['sm', 'md', 'lg'] as const; objectFitOptions = ['cover', 'contain', 'fill'] as const; showOverlay = true; showZoomIndicator = true; selectionEnabled = false; selectedItems: GalleryGridItem[] = []; eventLog: Array<{id: number; type: string; details: string; timestamp: Date}> = []; sampleItems: GalleryGridItem[] = [ { id: 1, src: 'https://picsum.photos/400/300?random=1', thumbnail: 'https://picsum.photos/200/150?random=1', alt: 'Sample image 1', title: 'Mountain Landscape', caption: 'Beautiful mountain vista at sunset' }, { id: 2, src: 'https://picsum.photos/400/300?random=2', thumbnail: 'https://picsum.photos/200/150?random=2', alt: 'Sample image 2', title: 'Ocean Waves', caption: 'Crashing waves on a sandy beach' }, { id: 3, src: 'https://picsum.photos/400/300?random=3', thumbnail: 'https://picsum.photos/200/150?random=3', alt: 'Sample image 3', title: 'Forest Path', caption: 'Winding trail through dense woods' }, { id: 4, src: 'https://picsum.photos/400/300?random=4', thumbnail: 'https://picsum.photos/200/150?random=4', alt: 'Sample image 4', title: 'City Skyline', caption: 'Urban architecture at night' }, { id: 5, src: 'https://picsum.photos/400/300?random=5', thumbnail: 'https://picsum.photos/200/150?random=5', alt: 'Sample image 5', title: 'Desert Dunes', caption: 'Rolling sand dunes in morning light' }, { id: 6, src: 'https://picsum.photos/400/300?random=6', thumbnail: 'https://picsum.photos/200/150?random=6', alt: 'Sample image 6', title: 'Lake Reflection', caption: 'Mirror-like water surface' }, { id: 7, src: 'https://picsum.photos/400/300?random=7', thumbnail: 'https://picsum.photos/200/150?random=7', alt: 'Sample image 7', title: 'Flower Field', caption: 'Colorful wildflowers in bloom' }, { id: 8, src: 'https://picsum.photos/400/300?random=8', thumbnail: 'https://picsum.photos/200/150?random=8', alt: 'Sample image 8', title: 'Snow Peaks', caption: 'Snow-capped mountain range' } ]; landscapeItems: GalleryGridItem[] = [ { id: 'l1', src: 'https://picsum.photos/800/400?random=11', thumbnail: 'https://picsum.photos/200/100?random=11', alt: 'Landscape image 1', title: 'Wide Landscape', caption: 'Panoramic view' }, { id: 'l2', src: 'https://picsum.photos/800/400?random=12', thumbnail: 'https://picsum.photos/200/100?random=12', alt: 'Landscape image 2', title: 'River Valley', caption: 'Flowing water through hills' }, { id: 'l3', src: 'https://picsum.photos/800/400?random=13', thumbnail: 'https://picsum.photos/200/100?random=13', alt: 'Landscape image 3', title: 'Coastal View', caption: 'Rocky coastline' } ]; masonryItems: GalleryGridItem[] = [ { id: 'm1', src: 'https://picsum.photos/300/400?random=21', thumbnail: 'https://picsum.photos/150/200?random=21', alt: 'Tall image 1', title: 'Portrait 1' }, { id: 'm2', src: 'https://picsum.photos/300/200?random=22', thumbnail: 'https://picsum.photos/150/100?random=22', alt: 'Wide image 1', title: 'Landscape 1' }, { id: 'm3', src: 'https://picsum.photos/300/500?random=23', thumbnail: 'https://picsum.photos/150/250?random=23', alt: 'Very tall image', title: 'Portrait 2' }, { id: 'm4', src: 'https://picsum.photos/300/300?random=24', thumbnail: 'https://picsum.photos/150/150?random=24', alt: 'Square image', title: 'Square 1' }, { id: 'm5', src: 'https://picsum.photos/300/350?random=25', thumbnail: 'https://picsum.photos/150/175?random=25', alt: 'Tall image 2', title: 'Portrait 3' }, { id: 'm6', src: 'https://picsum.photos/300/250?random=26', thumbnail: 'https://picsum.photos/150/125?random=26', alt: 'Medium image', title: 'Landscape 2' } ]; interactiveItems: GalleryGridItem[] = this.sampleItems.slice(0, 8).map(item => ({ ...item, selected: false })); loadingItems: GalleryGridItem[] = [ { id: 'loading1', src: 'https://picsum.photos/400/300?random=31', thumbnail: 'https://picsum.photos/200/150?random=31', alt: 'Loading image 1', title: 'Loading Item 1', loading: true }, { id: 'loading2', src: 'https://picsum.photos/400/300?random=32', thumbnail: 'https://picsum.photos/200/150?random=32', alt: 'Loading image 2', title: 'Loading Item 2', loading: true }, { id: 'loading3', src: 'https://picsum.photos/400/300?random=33', thumbnail: 'https://picsum.photos/200/150?random=33', alt: 'Loading image 3', title: 'Loaded Item', loading: false } ]; private eventCounter = 0; toggleOverlay(): void { this.showOverlay = !this.showOverlay; } toggleZoomIndicator(): void { this.showZoomIndicator = !this.showZoomIndicator; } toggleSelection(): void { this.selectionEnabled = !this.selectionEnabled; if (!this.selectionEnabled) { this.deselectAll(); } } selectAll(): void { this.interactiveItems.forEach(item => item.selected = true); this.updateSelectedItems(); } deselectAll(): void { this.interactiveItems.forEach(item => item.selected = false); this.updateSelectedItems(); } handleItemClick(event: { item: GalleryGridItem; event: MouseEvent }): void { this.addEvent('Item Click', `Clicked item: ${event.item.title || event.item.id}`); if (this.selectionEnabled) { event.item.selected = !event.item.selected; this.updateSelectedItems(); this.addEvent('Item Selection', `${event.item.selected ? 'Selected' : 'Deselected'} item: ${event.item.title || event.item.id}`); } } handleItemSelect(item: GalleryGridItem): void { this.updateSelectedItems(); this.addEvent('Item Select', `Selected item: ${item.title || item.id}`); } handleImageLoad(event: { item: GalleryGridItem; event: Event }): void { this.addEvent('Image Load', `Loaded image: ${event.item.title || event.item.id}`); } handleImageError(event: { item: GalleryGridItem; event: Event }): void { this.addEvent('Image Error', `Failed to load image: ${event.item.title || event.item.id}`); } clearEventLog(): void { this.eventLog = []; } private updateSelectedItems(): void { this.selectedItems = this.interactiveItems.filter(item => item.selected); } private addEvent(type: string, details: string): void { this.eventLog.unshift({ id: ++this.eventCounter, type, details, timestamp: new Date() }); // Keep only the last 20 events if (this.eventLog.length > 20) { this.eventLog = this.eventLog.slice(0, 20); } } }f񓸭x*'import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { GridContainerComponent } from 'ui-essentials'; @Component({ selector: 'ui-grid-container-demo', standalone: true, imports: [CommonModule, FormsModule, GridContainerComponent], template: `

    GridContainer Demo

    Advanced CSS Grid wrapper with template areas support, responsive column/row definitions, and auto-placement algorithms.

    Basic Grid Layouts

    Auto-fit Grid (Responsive)

    @for (item of basicItems; track item.id) {
    {{ item.label }}
    }

    Fixed 3-Column Grid

    @for (item of basicItems; track item.id) {
    {{ item.label }}
    }

    Gap Sizes

    @for (gap of gaps; track gap) {

    {{ gap }} Gap

    @for (item of shortItems; track item.id) {
    {{ item.label }}
    }
    }

    Column Layouts

    @for (colCount of columnCounts; track colCount) {

    {{ colCount }} Columns

    @for (item of getItemsForColumns(colCount); track item.id) {
    {{ item.label }}
    }
    }

    Auto Grid Types

    Auto-fit (Items stretch to fill space)

    @for (item of autoItems; track item.id) {
    {{ item.label }}
    }

    Auto-fill (Empty columns maintained)

    @for (item of autoItems; track item.id) {
    {{ item.label }}
    }

    Advanced Features

    Dense Grid (Auto-placement fills gaps)

    Wide Item (2 cols)
    Item 1
    Tall Item
    Item 2
    Item 3
    Extra Wide (3 cols)
    Item 4
    Item 5

    Grid with Template Areas

    Header
    Sidebar
    Main Content
    Aside
    Footer

    Alignment Options

    Justify Content: Center

    Item 1
    Item 2

    Align Items: Center

    Centered
    Items
    Vertically

    Row Modes

    @for (rowMode of rowModes; track rowMode) {

    {{ rowMode }} Rows

    @if (rowMode === 'min-content') { Short } @else if (rowMode === 'max-content') { This is longer content to demonstrate max-content behavior } @else { Content for {{ rowMode }} }
    Item 2
    Item 3
    }

    Interactive Grid Builder

    @for (item of interactiveItems; track item.id) {
    {{ item.label }} @if (item.span > 1) { ({{ item.span }} cols) } @if (item.rowSpan > 1) { ({{ item.rowSpan }} rows) }
    }
    `, styleUrl: './grid-container-demo.component.scss' }) export class GridContainerDemoComponent { gaps = ['sm', 'md', 'lg'] as const; columnCounts = [1, 2, 3, 4, 5, 6] as const; allColumns = [1, 2, 3, 4, 5, 6, 'auto-fit', 'auto-fill'] as const; rowModes = ['auto', 'equal', 'min-content', 'max-content'] as const; basicItems = [ { id: 1, label: 'Item 1' }, { id: 2, label: 'Item 2' }, { id: 3, label: 'Item 3' }, { id: 4, label: 'Item 4' }, { id: 5, label: 'Item 5' }, { id: 6, label: 'Item 6' }, { id: 7, label: 'Item 7' }, { id: 8, label: 'Item 8' } ]; shortItems = [ { id: 1, label: 'A' }, { id: 2, label: 'B' }, { id: 3, label: 'C' } ]; autoItems = [ { id: 1, label: 'Auto Item 1' }, { id: 2, label: 'Auto Item 2' }, { id: 3, label: 'Auto Item 3' }, { id: 4, label: 'Auto Item 4' } ]; interactiveConfig = { columns: 'auto-fit' as const, gap: 'md' as const, dense: false }; interactiveItems = [ { id: 1, label: 'Regular', variant: 'primary', span: 1, rowSpan: 1 }, { id: 2, label: 'Wide', variant: 'secondary', span: 2, rowSpan: 1 }, { id: 3, label: 'Tall', variant: 'success', span: 1, rowSpan: 2 }, { id: 4, label: 'Extra Wide', variant: 'info', span: 3, rowSpan: 1 }, { id: 5, label: 'Normal', variant: 'warning', span: 1, rowSpan: 1 }, { id: 6, label: 'Regular', variant: 'danger', span: 1, rowSpan: 1 }, { id: 7, label: 'Wide', variant: 'primary', span: 2, rowSpan: 1 }, { id: 8, label: 'Normal', variant: 'secondary', span: 1, rowSpan: 1 } ]; getItemsForColumns(colCount: number) { const count = Math.min(colCount * 2, this.basicItems.length); return this.basicItems.slice(0, count); } }]jxW@use '../../../../../ui-design-system/src/styles/semantic' as tokens; .demo-container { padding: tokens.$semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: tokens.$semantic-spacing-layout-lg; h3 { margin-bottom: tokens.$semantic-spacing-component-md; color: tokens.$semantic-color-text-primary; font-size: 1.25rem; font-weight: 600; } h4 { margin-bottom: tokens.$semantic-spacing-component-sm; color: tokens.$semantic-color-text-secondary; font-size: 1.125rem; font-weight: 500; } p { color: tokens.$semantic-color-text-secondary; margin-bottom: tokens.$semantic-spacing-component-md; } } .demo-row { display: flex; flex-wrap: wrap; gap: tokens.$semantic-spacing-layout-md; } .demo-grid-container { flex: 1; min-width: 300px; margin-bottom: tokens.$semantic-spacing-layout-sm; } .demo-grid { border: 2px dashed tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-md; padding: tokens.$semantic-spacing-component-md; &--fixed-height { min-height: 200px; } } .demo-grid-item { background: tokens.$semantic-color-container-primary; color: tokens.$semantic-color-on-container-primary; padding: tokens.$semantic-spacing-component-sm; border-radius: tokens.$semantic-border-radius-sm; text-align: center; font-weight: 500; min-height: 60px; display: flex; align-items: center; justify-content: center; &--small { width: 80px; height: 40px; min-height: auto; } } @media (max-width: 768px) { .demo-row { flex-direction: column; } .demo-grid-container { min-width: auto; } }SP25x[w(gqFbQjniFf6I[x%import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { GridSystemComponent } from '../../../../../ui-essentials/src/lib/components/layout/grid-system/grid-system.component'; @Component({ selector: 'ui-grid-system-demo', standalone: true, imports: [CommonModule, GridSystemComponent], template: `

    Grid System Demo

    Column Variants

    @for (cols of columnVariants; track cols) {

    {{ cols }} Columns

    @for (item of getItems(getItemCount(cols)); track $index) {
    {{ $index + 1 }}
    }
    }

    Gap Sizes

    @for (gap of gapSizes; track gap) {

    Gap: {{ gap }}

    @for (item of getItems(6); track $index) {
    {{ $index + 1 }}
    }
    }

    Auto Layout

    Auto-fit (items stretch to fill)

    @for (item of getItems(4); track $index) {
    Auto-fit {{ $index + 1 }}
    }

    Auto-fill (creates empty columns)

    @for (item of getItems(4); track $index) {
    Auto-fill {{ $index + 1 }}
    }

    Alignment Options

    Justify Items: Center

    @for (item of getItems(6); track $index) {
    {{ $index + 1 }}
    }

    Align Items: Center

    @for (item of getItems(6); track $index) {
    {{ $index + 1 }}
    }

    Custom Grid Template

    Custom Columns: 200px 1fr 100px

    Fixed 200px
    Flexible 1fr
    Fixed 100px

    Responsive Grid

    Resize the window to see responsive behavior

    @for (item of getItems(24); track $index) {
    {{ $index + 1 }}
    }
    `, styleUrl: './grid-system-demo.component.scss' }) export class GridSystemDemoComponent { columnVariants: (1 | 2 | 3 | 4 | 6 | 12)[] = [1, 2, 3, 4, 6, 12]; gapSizes: ('xs' | 'sm' | 'md' | 'lg' | 'xl')[] = ['xs', 'sm', 'md', 'lg', 'xl']; getItems(count: number): number[] { return Array.from({ length: count }, (_, i) => i + 1); } getItemCount(cols: number | string): number { if (typeof cols === 'number') { return Math.min(cols * 2, 12); } return 6; } }f0jhxCu¶7 x"zf=LxIm]h() x

    hcl-studio-demo works!

    n Sx*P/** * HCL Studio Demo Styles * Showcases dynamic theming using CSS custom properties */ .hcl-studio-demo { padding: 2rem; background: var(--color-surface); color: var(--color-on-surface); min-height: 100vh; transition: background-color 0.3s ease, color 0.3s ease; } // ========================================================================== // HEADER STYLES // ========================================================================== .demo-header { text-align: center; margin-bottom: 3rem; padding: 2rem; background: var(--color-surface-container); border-radius: 1rem; h1 { margin: 0 0 0.5rem 0; color: var(--color-primary); font-size: 2.5rem; font-weight: 600; } p { margin: 0; color: var(--color-on-surface-variant); font-size: 1.2rem; } } // ========================================================================== // CURRENT THEME INFO // ========================================================================== .current-theme-info { margin-bottom: 2rem; padding: 1.5rem; background: var(--color-surface-high); border-radius: 0.5rem; border: 1px solid var(--color-outline-variant); h3 { margin: 0 0 1rem 0; color: var(--color-on-surface); } .color-swatches { display: flex; gap: 1rem; .swatch { flex: 1; padding: 1rem; border-radius: 0.5rem; text-align: center; color: white; font-weight: 600; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); span { font-size: 0.9rem; } } } } // ========================================================================== // MODE CONTROLS // ========================================================================== .mode-controls { margin-bottom: 2rem; text-align: center; .mode-toggle-btn { padding: 0.75rem 2rem; border: 2px solid var(--color-outline); border-radius: 2rem; background: var(--color-surface); color: var(--color-on-surface); font-size: 1rem; font-weight: 600; cursor: pointer; transition: all 0.3s ease; &:hover { background: var(--color-surface-high); border-color: var(--color-primary); } &.dark { background: var(--color-primary); color: var(--color-on-primary); border-color: var(--color-primary); } } } // ========================================================================== // THEMES SECTION // ========================================================================== .themes-section { margin-bottom: 3rem; h3 { margin: 0 0 1.5rem 0; color: var(--color-on-surface); font-size: 1.5rem; } .theme-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; .theme-card { padding: 1rem; background: var(--color-surface-container); border: 2px solid var(--color-outline-variant); border-radius: 0.75rem; cursor: pointer; transition: all 0.3s ease; &:hover { border-color: var(--color-primary); transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } &.active { border-color: var(--color-primary); background: var(--color-primary-container); .theme-name { color: var(--color-on-primary-container); font-weight: 600; } } .theme-preview { display: flex; height: 40px; border-radius: 0.5rem; overflow: hidden; margin-bottom: 0.75rem; .color-strip { flex: 1; } } .theme-name { display: block; text-align: center; color: var(--color-on-surface); font-size: 0.9rem; font-weight: 500; } } } } // ========================================================================== // CUSTOM THEME SECTION // ========================================================================== .custom-theme-section { margin-bottom: 3rem; padding: 2rem; background: var(--color-surface-high); border-radius: 1rem; border: 1px solid var(--color-outline-variant); h3 { margin: 0 0 1.5rem 0; color: var(--color-on-surface); font-size: 1.5rem; } .custom-inputs { display: grid; gap: 1.5rem; margin-bottom: 2rem; @media (min-width: 768px) { grid-template-columns: repeat(3, 1fr); } .color-input-group { label { display: block; margin-bottom: 0.5rem; color: var(--color-on-surface); font-weight: 600; font-size: 0.9rem; } input[type="color"] { width: 50px; height: 40px; border: 2px solid var(--color-outline); border-radius: 0.5rem; margin-right: 0.5rem; cursor: pointer; } input[type="text"] { flex: 1; padding: 0.75rem; border: 2px solid var(--color-outline); border-radius: 0.5rem; background: var(--color-surface); color: var(--color-on-surface); font-size: 1rem; &:focus { outline: none; border-color: var(--color-primary); } } } } .custom-actions { display: flex; gap: 1rem; margin-bottom: 2rem; button { padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-size: 1rem; font-weight: 600; cursor: pointer; transition: all 0.3s ease; &.preview-btn { background: var(--color-secondary); color: var(--color-on-secondary); border: none; &:hover { opacity: 0.9; transform: translateY(-1px); } } &.apply-btn { background: var(--color-primary); color: var(--color-on-primary); border: none; &:hover { opacity: 0.9; transform: translateY(-1px); } } } } .color-preview { h4 { margin: 0 0 1rem 0; color: var(--color-on-surface); } .preview-swatches { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 0.5rem; .preview-swatch { padding: 0.75rem 0.5rem; border-radius: 0.5rem; text-align: center; font-size: 0.8rem; font-weight: 600; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); } } } } // ========================================================================== // DEMO COMPONENTS // ========================================================================== .demo-components { h3 { margin: 0 0 1.5rem 0; color: var(--color-on-surface); font-size: 1.5rem; } .component-showcase { display: grid; gap: 2rem; @media (min-width: 768px) { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); } .showcase-section { padding: 1.5rem; background: var(--color-surface-container); border-radius: 0.75rem; border: 1px solid var(--color-outline-variant); h4 { margin: 0 0 1rem 0; color: var(--color-on-surface); font-size: 1.2rem; } // Button Styles .button-group { display: flex; flex-direction: column; gap: 0.75rem; button { padding: 0.75rem 1.5rem; border-radius: 0.5rem; font-size: 1rem; font-weight: 600; cursor: pointer; border: none; transition: all 0.3s ease; &.btn-primary { background: var(--color-primary); color: var(--color-on-primary); &:hover { opacity: 0.9; transform: translateY(-1px); } } &.btn-secondary { background: var(--color-secondary); color: var(--color-on-secondary); &:hover { opacity: 0.9; transform: translateY(-1px); } } &.btn-tertiary { background: var(--color-tertiary); color: var(--color-on-tertiary); &:hover { opacity: 0.9; transform: translateY(-1px); } } } } // Card Styles .card-group { display: flex; flex-direction: column; gap: 1rem; .demo-card { padding: 1.5rem; border-radius: 0.5rem; &.primary { background: var(--color-primary-container); color: var(--color-on-primary-container); } &.secondary { background: var(--color-secondary-container); color: var(--color-on-secondary-container); } h5 { margin: 0 0 0.5rem 0; font-size: 1.1rem; } p { margin: 0; opacity: 0.8; } } } // Surface Styles .surface-group { display: flex; flex-direction: column; gap: 1rem; .demo-surface { padding: 1rem; border-radius: 0.5rem; text-align: center; font-weight: 600; &.surface-low { background: var(--color-surface-low); color: var(--color-on-surface); } &.surface-container { background: var(--color-surface-container); color: var(--color-on-surface); } &.surface-high { background: var(--color-surface-high); color: var(--color-on-surface); } } } } } } // ========================================================================== // RESPONSIVE ADJUSTMENTS // ========================================================================== @media (max-width: 768px) { .hcl-studio-demo { padding: 1rem; } .demo-header { padding: 1.5rem; h1 { font-size: 2rem; } p { font-size: 1rem; } } .theme-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } .custom-inputs { grid-template-columns: 1fr !important; } .custom-actions { flex-direction: column; } } // ========================================================================== // TRANSITIONS FOR SMOOTH THEME CHANGES // ========================================================================== * { transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease; }@x#import { Component, OnInit, OnDestroy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { BrandColors, ThemePreview } from '../../../../../hcl-studio/src/lib/models/hcl.models'; import { HCLStudioService } from '../../../../../hcl-studio/src/lib/hcl-studio.service'; import { HCLConverter } from '../../../../../hcl-studio/src/lib/core/hcl-converter'; import { DEFAULT_THEMES } from '../../../../../hcl-studio/src/lib/themes/theme-presets'; @Component({ selector: 'app-hcl-studio-demo', standalone: true, imports: [CommonModule, FormsModule], template: `

    HCL Studio Demo

    Dynamic theme switching using HCL color space

    Current Theme: {{ currentTheme.name }}

    Primary
    Secondary
    Tertiary

    Built-in Themes

    {{ theme.name }}

    Create Custom Theme

    Generated Palette Preview

    {{ color.key }}

    Theme Demo Components

    Buttons

    Cards

    Primary Card

    This card uses primary colors

    Secondary Card

    This card uses secondary colors

    Surface Variations

    Surface Low
    Surface Container
    Surface High
    `, styleUrls: ['./hcl-studio-demo.component.scss'] }) export class HclStudioDemoComponent implements OnInit, OnDestroy { private destroy$ = new Subject(); // State availableThemes: ThemePreview[] = []; currentTheme: ThemePreview | null = null; isDarkMode = false; // Custom theme inputs customColors: BrandColors = { primary: '#6750A4', secondary: '#625B71', tertiary: '#7D5260' }; colorPreview: { [key: string]: string } | null = null; constructor(private hclStudio: HCLStudioService) {} ngOnInit(): void { // Initialize HCL Studio with default themes this.hclStudio.initialize({ themes: DEFAULT_THEMES, defaultTheme: 'material-purple', autoMode: false }); // Subscribe to theme changes this.hclStudio.themeState$ .pipe(takeUntil(this.destroy$)) .subscribe((state: any) => { this.availableThemes = state.availableThemes; if (state.currentTheme) { this.currentTheme = { id: state.currentTheme.config.id, name: state.currentTheme.config.name, description: state.currentTheme.config.description, primary: state.currentTheme.config.colors.primary, secondary: state.currentTheme.config.colors.secondary, tertiary: state.currentTheme.config.colors.tertiary }; } }); // Subscribe to mode changes this.hclStudio.currentMode$ .pipe(takeUntil(this.destroy$)) .subscribe((mode: string) => { this.isDarkMode = mode === 'dark'; }); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } switchTheme(themeId: string): void { this.hclStudio.switchTheme(themeId); } toggleMode(): void { this.hclStudio.toggleMode(); } previewCustomTheme(): void { try { this.colorPreview = this.hclStudio.generateColorPreview(this.customColors); } catch (error) { console.warn('Failed to generate color preview:', error); this.colorPreview = null; } } applyCustomTheme(): void { const customTheme = this.hclStudio.createCustomTheme( 'custom-theme', 'My Custom Theme', this.customColors, 'User-created custom theme' ); this.hclStudio.switchTheme('custom-theme'); } getContrastColor(backgroundColor: string): string { try { const ratio1 = HCLConverter.getContrastRatio(backgroundColor, '#000000'); const ratio2 = HCLConverter.getContrastRatio(backgroundColor, '#FFFFFF'); return ratio1 > ratio2 ? '#000000' : '#FFFFFF'; } catch { return '#000000'; } } },x xkw2E=WfnA~QBOpIiJf~pjQYfrH1'$>5,PZZ;%8@q+K-*I-sRKJRSRKjҊs3rt6[od%Z\XY\%7?%u| y8Dx

    Hero Components Demo

    Basic Hero Section

    A gradient hero with centered content and dual CTAs

    Light Hero Section

    Clean design with left-aligned content

    Animated Background Hero

    Full height with animated gradient background

    Hero With Image

    Split layout with image on the right

    Hero Image - Different Layout

    Image on left with gradient background

    Split Screen Hero - Text

    50/50 split with text content on both sides

    Split Screen Hero - Mixed Media

    60/40 split with text and image content

    ּ8xs.hero-demo { h2 { margin-bottom: 2rem; text-align: center; color: var(--semantic-color-text-primary); } .demo-section { margin-bottom: 3rem; h3 { margin-bottom: 0.5rem; color: var(--semantic-color-text-primary); font-size: 1.2rem; font-weight: 600; } p { margin-bottom: 1rem; color: var(--semantic-color-text-secondary); font-size: 0.9rem; padding: 0 1rem; background: var(--semantic-color-surface-elevated); border-radius: 0.5rem; padding: 0.75rem 1rem; border-left: 3px solid var(--semantic-color-primary); } } } // Ensure demo sections don't interfere with hero component styles .demo-section { position: relative; overflow: hidden; border-radius: 0.5rem; box-shadow: var(--semantic-shadow-card-rest); &:hover { box-shadow: var(--semantic-shadow-card-hover); } }s1Rx@import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { HeroSectionComponent, HeroWithImageComponent, HeroSplitScreenComponent } from 'ui-landing-pages'; import { HeroConfig, HeroImageConfig, HeroSplitConfig, CTAButton } from 'ui-landing-pages'; @Component({ selector: 'app-hero-sections-demo', imports: [ CommonModule, HeroSectionComponent, HeroWithImageComponent, HeroSplitScreenComponent ], templateUrl: './hero-sections-demo.component.html', styleUrl: './hero-sections-demo.component.scss' }) export class HeroSectionsDemoComponent { // Hero Section Configs basicHeroConfig: HeroConfig = { title: 'Build Amazing Landing Pages', subtitle: 'Create stunning websites with our comprehensive component library', alignment: 'center', backgroundType: 'gradient', minHeight: 'large', ctaPrimary: { text: 'Get Started', variant: 'filled', action: () => console.log('Primary CTA clicked') }, ctaSecondary: { text: 'Learn More', variant: 'outlined', action: () => console.log('Secondary CTA clicked') } }; lightHeroConfig: HeroConfig = { title: 'Clean & Modern Design', subtitle: 'Designed for the modern web', alignment: 'left', backgroundType: 'solid', minHeight: 'medium', ctaPrimary: { text: 'Explore Features', variant: 'filled', action: () => console.log('Explore clicked') } }; darkHeroConfig: HeroConfig = { title: 'Dark Mode Ready', subtitle: 'Perfect for dark interfaces', alignment: 'right', backgroundType: 'animated', minHeight: 'full', ctaPrimary: { text: 'Try Dark Mode', variant: 'filled', action: () => console.log('Dark mode clicked') } }; // Hero With Image Configs splitImageConfig: HeroImageConfig = { title: 'Hero with Image', subtitle: 'Perfect split layout', alignment: 'left', backgroundType: 'solid', minHeight: 'large', imageUrl: 'https://images.unsplash.com/photo-1551434678-e076c223a692?ixlib=rb-4.0.3&auto=format&fit=crop&w=600&q=80', imageAlt: 'Team collaboration', imagePosition: 'right', imageMobile: 'below', ctaPrimary: { text: 'Start Building', variant: 'filled', action: () => console.log('Start building clicked') } }; overlayImageConfig: HeroImageConfig = { title: 'Overlay Hero Style', subtitle: 'Text over image', alignment: 'center', backgroundType: 'gradient', minHeight: 'full', imageUrl: 'https://images.unsplash.com/photo-1557804506-669a67965ba0?ixlib=rb-4.0.3&auto=format&fit=crop&w=1200&q=80', imageAlt: 'Modern office space', imagePosition: 'left', imageMobile: 'above', ctaPrimary: { text: 'View Gallery', variant: 'filled', action: () => console.log('View gallery clicked') }, ctaSecondary: { text: 'Learn More', variant: 'outlined', action: () => console.log('Learn more clicked') } }; // Hero Split Screen Configs textSplitConfig: HeroSplitConfig = { title: 'Split Screen Hero', subtitle: 'Powerful dual-content layout', alignment: 'center', backgroundType: 'solid', minHeight: 'large', splitRatio: '50-50', leftContent: { type: 'text', content: '

    Powerful Features

    Everything you need to build professional landing pages with our comprehensive component library.

    ' }, rightContent: { type: 'text', content: '

    Easy to Use

    Drop-in components that work seamlessly with your existing Angular applications.

    ' } }; mediaSplitConfig: HeroSplitConfig = { title: 'Media Split Hero', subtitle: 'Text and image combination', alignment: 'left', backgroundType: 'gradient', minHeight: 'large', splitRatio: '60-40', leftContent: { type: 'text', content: '

    See It In Action

    Watch our components come to life with interactive examples and real-world use cases.

    ' }, rightContent: { type: 'image', content: 'https://images.unsplash.com/photo-1460925895917-afdab827c52f?ixlib=rb-4.0.3&auto=format&fit=crop&w=600&q=80' } }; onCtaClick(message: string): void { console.log(message); // In a real app, you might navigate to a different route or open a modal } } l}xU// Demo-specific styles for the icon button showcase :host { display: block; } // Danger button styling for destructive actions demo ::ng-deep .danger-button { &.ui-icon-button--outlined { color: #dc3545; border-color: #dc3545; &:hover:not(:disabled) { background-color: rgba(220, 53, 69, 0.1); border-color: #dc3545; } &:focus-visible { outline-color: #dc3545; } } }d:x$import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { IconButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/icon-button/icon-button.component'; import { faHeart, faBookmark, faShare, faDownload, faEdit, faTrash, faSave, faSearch, faPlus, faMinus, faHome, faUser, faCog, faClose, faCheck, faChevronLeft, faChevronRight, faEllipsisV, faStar } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-icon-button-demo', standalone: true, imports: [ CommonModule, IconButtonComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Icon Button Component Showcase

    Size Variants

    Filled Variant

    Tonal Variant

    Outlined Variant

    States

    Star button pressed state: {{ isPressed ? 'ON' : 'OFF' }}

    Navigation Examples

    Destructive Actions

    Use outlined variant for destructive actions to reduce accidental clicks

    Interaction Test

    Total clicks: {{ clickCount }}

    Last clicked: {{ lastClicked || 'None' }}

    `, styleUrl: './icon-button-demo.component.scss' }) export class IconButtonDemoComponent { // FontAwesome icons faHeart = faHeart; faBookmark = faBookmark; faShare = faShare; faDownload = faDownload; faEdit = faEdit; faTrash = faTrash; faSave = faSave; faSearch = faSearch; faPlus = faPlus; faMinus = faMinus; faHome = faHome; faUser = faUser; faCog = faCog; faClose = faClose; faCheck = faCheck; faChevronLeft = faChevronLeft; faChevronRight = faChevronRight; faEllipsisV = faEllipsisV; faStar = faStar; // Demo state clickCount = 0; lastClicked = ''; isPressed = false; handleClick(action: string): void { this.clickCount++; this.lastClicked = action; console.log('Icon button clicked:', action); } togglePressed(): void { this.isPressed = !this.isPressed; this.handleClick(`toggle star ${this.isPressed ? 'on' : 'off'}`); } }KRo#xg@import "../../../../../ui-design-system/src/styles/semantic"; // Tokens available globally via main application styles .demo-container { padding: $semantic-spacing-layout-md; h2 { margin-bottom: $semantic-spacing-component-sm; color: $semantic-color-text-primary; font-size: $base-typography-font-size-xl; } p { margin-bottom: $semantic-spacing-layout-lg; color: $semantic-color-text-secondary; font-size: $base-typography-font-size-md; } } .demo-section { margin-bottom: $semantic-spacing-layout-xl; h3 { margin-bottom: $semantic-spacing-component-md; color: $semantic-color-text-primary; font-size: $base-typography-font-size-lg; border-bottom: $semantic-border-divider-width solid $semantic-color-border-subtle; padding-bottom: $semantic-spacing-component-xs; } } .demo-row { display: flex; gap: $semantic-spacing-component-lg; flex-wrap: wrap; align-items: flex-start; } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: $semantic-spacing-component-lg; } .demo-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: $semantic-spacing-component-md; margin-bottom: $semantic-spacing-layout-lg; } .demo-item { display: flex; flex-direction: column; align-items: center; gap: $semantic-spacing-component-sm; .ui-image-container { cursor: pointer; &:hover { transform: translateY(-2px); box-shadow: $semantic-shadow-elevation-3; } } } .demo-label { font-size: $base-typography-font-size-sm; color: $semantic-color-text-secondary; font-weight: $base-typography-font-weight-medium; text-align: center; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; background: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-sm; border: $semantic-border-divider-width solid $semantic-color-border-subtle; } // Custom styling for hero image demo .hero-image { position: relative; [slot='caption'] { display: flex; flex-direction: column; gap: $semantic-spacing-component-xs; h4 { margin: 0; font-size: $base-typography-font-size-md; font-weight: $base-typography-font-weight-semibold; } p { margin: 0; font-size: $base-typography-font-size-sm; opacity: 0.9; } } } // Retry button styling .retry-btn { margin-top: $semantic-spacing-component-xs; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; background: $semantic-color-interactive-primary; color: $semantic-color-text-inverse; border: none; border-radius: $semantic-border-radius-sm; font-size: $base-typography-font-size-xs; cursor: pointer; transition: background-color $semantic-duration-fast $semantic-easing-standard; &:hover { background-color: $semantic-color-surface-interactive; } &:focus-visible { outline: 2px solid $semantic-color-focus-ring; outline-offset: 2px; } } // Event log styling .event-log { background: $semantic-color-surface-secondary; border: $semantic-border-divider-width solid $semantic-color-border-subtle; border-radius: $semantic-border-radius-md; padding: $semantic-spacing-component-md; font-family: monospace; font-size: $base-typography-font-size-xs; max-height: 200px; overflow-y: auto; } .event-item { display: flex; gap: $semantic-spacing-component-sm; margin-bottom: $semantic-spacing-component-xs; &:last-child { margin-bottom: 0; } } .event-time { color: $semantic-color-text-tertiary; min-width: 60px; } .event-type { color: $semantic-color-interactive-primary; font-weight: $base-typography-font-weight-medium; min-width: 80px; } .event-message { color: $semantic-color-text-secondary; flex: 1; } // Responsive design @media (max-width: $semantic-sizing-breakpoint-tablet - 1) { .demo-row { gap: $semantic-spacing-component-md; } .demo-grid { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: $semantic-spacing-component-md; } .demo-gallery { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } } @media (max-width: $semantic-sizing-breakpoint-mobile - 1) { .demo-container { padding: $semantic-spacing-layout-sm; } .demo-section { margin-bottom: $semantic-spacing-layout-lg; } .demo-row { flex-direction: column; gap: $semantic-spacing-component-md; align-items: center; } .demo-grid { grid-template-columns: 1fr; } .demo-gallery { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } .event-log { font-size: $base-typography-font-size-xs; } }O:v&xe%$@use ' 3 /index' as *;x>`max-width: 1200px; margin: 0 auto; h2 { font-size: $semantic-typography-heading-h2-size/#)ntent-heading; font-weight: $semanticEbold; } h3 { font-size: $semantic-typography-heading-h3-size/#+ntent-paragraph; font-weight: $semanticsemibolDlg)lg n prim? width-1  'lg; )1T3& #ntent-heading; } .demo-item { . n 9 &width-1 primary /; h4 { font-size: $semantic-typography-heading-h4-size/#+ntent-list-item; font-weight: $semantic"!} p { font-size: $semantic.O n %%ntent-paragraph; } } .demo-actionsg /&ntent-paragraph; align-items: center ' ntent-heading)md n variant /} .demo-button { ( A; " on-primaryi Msemantic.O font-weight: $semantic" all $semantic-motion motion-easing-ease-in-out; ;  primary-hover; +2; } A  &--secondary {  n primary/mwidth-1 primary; &:hover {  n 9 . } } } .demo-info { font-size: $semantic.O ) #ntent-list-item; } .file-list-demo %ntent-paragraph)md n 9  'mwidth-1  h5 { font-size: $semantic.$ #+ntent-list-item; font-weight: $semanticsemibold; } .file-item;justify-content: space-between; align-items: center; '  n  primary; >/%ntent-line-normal; &:last-child { margin-bottom: 0; } .file-info { font-size: $semantic-typography-fo<O ).} .file-size { font-size: $semantic. 0  } } } .code-demo )variantiwidth-1  X ntent-paragraph; pre { font-family: 'JetBrains Mono', 'Consolas', monospace; font-size: $semantic-typography-font-?n ( overflow-x: auto; margin: 0; } }7Pd(sx0%$@use ' 3 /index' as *;x82lg; max-width: 1200px; margin: 0 auto; h2 {:$semantic-typography-heading-h2-size;&  border-bottom: 1 7ntent-paragraph; } h3 {!n 2 font-size: $semantic-typography-heading-h3-size;(ntent-heading;  J -Jestartontent-line-normal)md; border: 1  - n Kprimary; min-width: 100px; p { margin: 0; font-size: $semantic.md"n  font-weight: $semantic"} &:hover { border-` primary; +1; } } .demo-controlsg 7 +lg)lg n 9  !lg; border: 1  .control-group_9min-width: 120px; label { font-size: $semantic.O font-weight: $semantic"-} input[type="range"] { width: 100%; min-width: 150px; } input[type="checkbox"] { margin-right: # } select { ' % border: 1  primary; >/  n  primary; -' semantic.sm; &:focus { ' primary;  border-`)primary; } } } button { 'sm!\ border: 1  primary; >)md;  primaryonsemantic.O font-weight: $semantic" transition: all $semantic-motion *" &:hover:not(:disabled) {  primary-hover; border-` primary-hover/2; } &:focus { ' primary; J } &:disabled { opacity: 0.38; cursor: not-allowed;  n 9 border-`0 H } } } .demo-interactive-result { display: flex; justify-content2l n primary +lg; border: 2px dasheq !5 breakpoint-mdB} o< .demo-controls^H2 .control-group { min-width: auto; }% breakpoint-smJZ .demo-row { justify-content: center; } .demo-item { min-width: 80px; } }4Yx:QugqFbQjniF!Jw=_x-$#G@lS4 h4Y4.@column+K: 1; min-width: 300px; } .demo-accordion-container { max-width: 600px;Imd8 { ' s/ 2~ k { q& p) j--primary { qP  on-primi)P ; &:hover { qP ); opacity: 0.9; } } }e>!sm)  h5 { margin: 0 0!p xs 0 s } } .code-example {p'T #%md; font-family@  family-mono;  ,xs; [ +overflow-x: auto; white-space: pre-wrap; X p &sm; } .sample-content { line-height@ -line-height-relaxed; p { margin: 0 0!p sm 0; &:last-child { ! } } ul { margin: 0 0!p = lg; &:last-child {  } } li {(@ s; &:last-child { . } } } .icon-demo { display: inline-flex4@ s; P ; A8e'} .demo-column { min-width: auto[sm;/item .; } }'nV@xn$ @import "3"; .carousel-demo {  .demo-section {&§ion-md; &:last-child {  } } .section-title { /xl> 4semibold; line-height@ line-height-normal;.$) .section-description { /md> 4normal; line-height@ line-height-relaxed;!$) .carousel-container {&h .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)){X/ .feature-card { q&&container; border-radius: 12px; !b $  .feature-title {0 1md; @ 2semibold; line-height@ line-height-normal$[ "%@)sm; } .feature-description {0 5@ B 0normal; line-height@ line-height-normal$"%@\ "} .feature-example { q&variant  8px; !'\ b $*econdary; .example-label { 1 0xs; @ 2normal; line-height@ line-height-normal; 0 '@ os; text-transform: uppercase; letter-spacing: 0.5px; } .example-content { 1 4@ B 0normal; line-height@ line-height-normal; "  .code-snippet { q& container^ ( border-radius: 8px; !X W font-family: 'Roboto Mono', monospace; font-size: 0.875rem; line-height: 1.4;.overflow-x: auto; } } YiN=x$9?%! lg; h2 { % 2-size> 4 semibold; on-surfac( border-bottom outlinx+@A h3 { %D ; on-surfac(`"flex-wrap: wrap%md; *sm; } .config-panel {p'outlinA,lg)lg; .config-rowK#\ $#@\ 'flex-wrap: wrap; &:last-child { V"p }on-surface; N}- white-space: nowrap outline on-surface/ 6@  min-width: 125: 0; accent-P ; } } } .event-log {p'outlinA2#%-md; max-height: 200px; overflow-y: auto; #p -md; font-family: 'Courier New', monospace;  0 .event-item ,xs 0;on-surface-variant=/Qoutline-variant; &:last-child { border-bottom: none; } } } .navn0@sm)md!p ' cursor: pointer; ;motion-easing-ease;  on-surface; #p xs; &:hover { q&variant;P ; } &:active { q&Ncontainer; } fa-icon { width: 20px; color: inherit; } span { /md> >},768pxe7p} .demo-row {`!8align-items: stretch; } .config-panel .config-row {`!align-items: stretch{'Hsm; label { justify-content: space-between; } select%z)=6x$$~`1$!7Qbase-typography-font-size-2xl; font-weight: $base-typography-font-weight-boldG h3 {&`7Tbase-typography-font-size-lg; font-weight: $base-typography-font-weight-semibold=l`} } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))`RT ui-empty-state { width: 100%; height: auto; } } .demo-label { margin1 0 0 0 0; text-align: center; font-size: $baseK +font-weight: $baseZ "Gtext-transform: uppercase; letter-spacing: 0.05em; } .demo-output { X E#% t#Z p { margin: 0 0!*content-line-tight 0; font-size: $baseK @  &:last-child {  } strong {#[ } } // Responsive DX1024px) { .demo-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)){sm;/768pxeFJ .demo-grid { grid-template-columns: 1fr; } .demo-section {& 69 xj$@use "9"@>` max-width: 8= h3 {. K lgO!p dsm; flex-wrap: wrap; } .positions-grid { display: grid; grid-template-columns: repeat(2, 1fr)% xl; max-width: 400px; margin1md 0; } .demo-button { (= %sP ; on-primary; border: nonA2cursor: pointer;  ,"md; transition: background-color ; &:hover { qP } &:focus-visible { z 'focus; } } .demo-text { [  *>md; text-decoration: underline; cursor: help; &:hoverP I; } } .demo-icon { width: 24px; height: 24px; border-radius: 50%o(   0#font-weight: bold; cursor: help; + &:hover { q& )} } p { margin: 0; + * md; } // Responsive adjustments6) /positions-grid { grid-template-columns: 1fr{' h<4w .demo-row {`!align-items: flex-start{' sm; } }m5xZ9/index9  layout-md;S(A h2 { n+5G!content-headinpH !*!ntent-line-normal; } h3 { n+)4-siz@(@ P X align-items: flex-start; 8|9n T+P  margin-toP  } .config 8 /%flex-wrap: wrap; &:last-child {  margin-toP - justify-content: flex-start; } label! 1sm; n+o:xs; \. &:first-child { min-width: 80px; 2 } } select ,'-)sm; & primary; n+  &:focus { outline: 2: $ outline-offset: 2px; border- : + transform: scale(1.1); } +&flex-start; label:first-child%N5prim[=3" [Monaco', 'Menlo', 'Ubuntu Mono >} .event-item { ' 9 : #+  &:last-child { } &:first-child { n+. } }6#px1 9/index9 +V%=%section-lg; h3 { font-family  family-sans;% lgBline-h` line-height-tight; n text-primaryA'@u$semantic-border-width-1border-secondary2`align-items: flex-start; -P } .demo-results { ' 9$semantic-border-width-1border-secondary+md; p { font-family  family-sans;% R 6normal; line-h` line-height-normal; ntext-primary; margin1  strong { @ptext-primary; }  adjustments %&5! } > } }ƸMxzF#} .demo-column { display: flex; !#lg; > div { display: flex; !! ospanZ}'>h7xTKsTŵ[R섴PIk7 yPF) ƺ/$6a˰gt l ,tXbw++BaFwsrʭIIy]x6OEd+Ψ_'e =v<ȍ^/Hp$<~G]r6Ե+w? Y01gFtK#{ʡ<~.fss/ r)U=Nw+i!jlܨʘ~1.aTwmͤf_b:"}O3q=`:E"yjCzz1ɽ/qDp׼xM-ⶈ).8#xR*!Qm/dwjhrx𴹁|4=@B2|clj S}mCRQ + &acr*̋D[9m|!kY ̚5H_-i@aKRq7Qy_ޭ0!hU>6E{!r*"[bWH>`o>=BRDCե֜CIꈋ8_>\ڀʱjosziv>ڹR +) ӹf Z9DkM9(`t BZ'O"7mHaTBഞ00gAC2>>gFnFy2/eߤ/>|_).h8h,zW`TμJf(p"S5 qq-[$?uKVa٧jkENW,YH7XV|se:LMtk=ivqvg+YoEx%$@use ' , /index' as *;q>`max-width: 1200px; margin: 0 auto; h2 { font-size: $semantic-typography-heading-h2-size|"  R!content-heading; font-weight: $semantic-typography-font-weight-bold; } h3 { font-size: $semantic-typography-headin g-h3-size|"  R!-content-paragraph; font-weight: $semantic$?lg )lg; 'prim8 width-1( 'lg; )1T3&layou)content-headin %  Jwidth-1primary /; h4 { font-size: $semantic-typography-heading-h4-size|"  R!-content-list-item; font-weight: $semantic"!} p { font-size: $semantic/-R!'content-paragraph; } } .demo-actions` /ntent-paragraph; R!content-heading )  $variant /} .demo-button { i primary;  on-primaryb Msemantic/font-weight: $semantic" Wall $semantic-motion-duration-fast $semantic-motion-easing-ease-in-out; &:hover { primary-hover; +2; } A  &--secondary { &primary|"  ? width-1 primary;  1info { font-size: $semantic/8) #ntent-list-item; } .file-list-demo %ntent-paragraph )  7?!md; width-1& h5 { font-size: $semantic/  R!-content-list-item; font-weight: $semantic$G} .file-item { display: flex; justify-content: space-between  & primary; )`P#content-line-normal;  0 } .file-info { font-size: $semantic/~  .} .file-size { font-size: $semantic ~ )  } } } .code-demo )variant; width-1( X ntent-paragraph; pre { font-family: 'JetBrains Mono', 'Consolas', monospace; font-size: $semantic-typography-font- -&overflow-x: auto; margin: 0; } }'=]x&$28}%plgC.J E on-surface'plg; border-bottom outline; padding _ V?xl;yB8E on-surface'p 3} } .demo-row { display: flex; flex-wrap: wrap_ !psm; } .config-panel { @ border: 1pxoutli-lg;( .config-row /_ %_  flex-wrap: wrap 2" } labelL=8#on-surface; display: flex; + o/ white-space: nowrap; } select { L border: 1px outline; )s3 on-surface;N;Tmin-width: 120px; } input[type="checkbox"] { margin: 0; accent-Q $ event-log { @ border: 1pxoutli-3#x-height: 200px; overflow-y: auto'_ %font-family: 'Courier New', monospace2 .event-item { *0A*on-surface-variant; border-bottom: 1pxoutline-variant ?border-bottom: none; } } } .nav-item { display: flex; -sm;(md!&s c;  on-surface' /E ; } &:active_ +Lcontainer; } fa-icon { width: 20px; color: inherit; } span' md; :8} } // Responsive design @media (max-width: 768px) { A'} .demo-row { flex-direction: column; align-items: stretch; } .config-panel .config-row { flex-direction: c#olumn; align-items: stretch; sm; label { (2} select { min-width: auto; } } }Ϊxw+import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ImageContainerComponent, ImageContainerSize, ImageContainerAspectRatio, ImageContainerObjectFit, ImageContainerShape } from '../../../../../ui-essentials/src/lib/components/data-display/image-container/image-container.component'; import { BadgeComponent } from '../../../../../ui-essentials/src/lib/components/data-display/badge/badge.component'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faRefresh, faHeart, faPlay } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-image-container-demo', standalone: true, imports: [CommonModule, ImageContainerComponent, BadgeComponent, FontAwesomeModule], template: `

    Image Container Demo

    A flexible image container with lazy loading, aspect ratios, and various display options.

    Sizes

    @for (size of sizes; track size) {
    {{ size }}
    }

    Aspect Ratios

    @for (ratio of aspectRatios; track ratio) {
    {{ ratio }}
    }

    Object Fit

    @for (fit of objectFits; track fit) {
    {{ fit }}
    }

    Shapes

    @for (shape of shapes; track shape) {
    {{ shape }}
    }

    Loading States

    Loading
    Custom Error
    Error State
    Eager Load

    Interactive Features

    Play Video
    With Overlay
    With Caption

    Advanced Examples

     Profile Avatar

    Custom Caption Content

    With additional styled elements

    Featured
    Hero Banner

    Responsive Gallery

    @for (image of galleryImages; track image.id; let i = $index) {
    {{ image.title }}
    }
    @if (eventLog.length > 0) {

    Event Log

    @for (event of eventLog.slice(-5); track event.id) {
    {{ event.time | date:'HH:mm:ss' }} {{ event.type }} {{ event.message }}
    }
    }
    `, styleUrl: './image-container-demo.component.scss' }) export class ImageContainerDemoComponent { // Icons faRefresh = faRefresh; faHeart = faHeart; faPlay = faPlay; // Demo data sizes: ImageContainerSize[] = ['sm', 'md', 'lg', 'xl']; aspectRatios: ImageContainerAspectRatio[] = ['1/1', '4/3', '16/9', '3/2', '2/1', '3/4', '9/16']; objectFits: ImageContainerObjectFit[] = ['contain', 'cover', 'fill', 'scale-down']; shapes: ImageContainerShape[] = ['square', 'rounded', 'circle']; // Sample images (using placeholder service) sampleImages = { landscape: 'https://picsum.photos/800/600?random=1', portrait: 'https://picsum.photos/600/800?random=2', square: 'https://picsum.photos/600/600?random=3' }; galleryImages = [ { id: 1, url: 'https://picsum.photos/400/400?random=10', title: 'Nature', alt: 'Beautiful nature scene' }, { id: 2, url: 'https://picsum.photos/400/300?random=11', title: 'Architecture', alt: 'Modern building' }, { id: 3, url: 'https://picsum.photos/400/500?random=12', title: 'Portrait', alt: 'Person portrait' }, { id: 4, url: 'https://picsum.photos/400/400?random=13', title: 'Urban', alt: 'City landscape' }, { id: 5, url: 'https://picsum.photos/400/300?random=14', title: 'Technology', alt: 'Tech equipment' }, { id: 6, url: 'https://picsum.photos/400/400?random=15', title: 'Abstract', alt: 'Abstract art' } ]; // Event tracking eventLog: Array<{id: number, type: string, message: string, time: Date}> = []; private eventId = 1; handleImageClick(context: string): void { this.logEvent('click', `Image clicked in ${context} context`); } handleGalleryClick(image: any, index: number): void { this.logEvent('gallery-click', `Gallery image "${image.title}" clicked (index ${index})`); } handleImageLoad(imageId: number): void { this.logEvent('load', `Image ${imageId} loaded successfully`); } handleImageError(imageId: number): void { this.logEvent('error', `Image ${imageId} failed to load`); } retryImage(event: Event): void { event.stopPropagation(); this.logEvent('retry', 'Retry button clicked for failed image'); // In a real implementation, this would retry loading the image } private logEvent(type: string, message: string): void { this.eventLog.push({ id: this.eventId++, type, message, time: new Date() }); // Keep only last 20 events if (this.eventLog.length > 20) { this.eventLog.splice(0, this.eventLog.length - 20); } } }ρPxv6l.dw{wk@0x1export * from './image-container-demo.component';\6xQ 0 7a0wO52۔4NwmZA|SO,ŹlQVWthiUK֓C'e}?Pn50.y@&rQ E7$+Jl' sd'f:覸f+xc}M:d ES'!]ȆrH;W_4lFx %H#vxAimport { Component, TemplateRef, ViewChild, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { InfiniteScrollContainerComponent, InfiniteScrollEvent, InfiniteScrollConfig } from 'ui-essentials'; interface DemoItem { id: number; title: string; description: string; timestamp: Date; category: string; } @Component({ selector: 'ui-infinite-scroll-container-demo', standalone: true, imports: [CommonModule, InfiniteScrollContainerComponent], template: `

    Infinite Scroll Container Demo

    Basic Infinite Scroll (Content Projection)

    @for (item of basicItems(); track item.id) {

    {{ item.title }}

    {{ item.description }}

    {{ item.timestamp | date:'short' }} - {{ item.category }}
    }

    Template-Based Rendering

    #{{ item.id }} {{ item.category }}

    {{ item.title }}

    {{ item.description }}

    Index: {{ index }} | {{ item.timestamp | date:'short' }}

    Bidirectional Infinite Scroll

    Message {{ item.id }}

    {{ item.description }}

    {{ item.timestamp | date:'short' }}

    Custom Loading & Error Templates

    {{ item.title.charAt(0) }}

    {{ item.title }}

    {{ item.description }}

    {{ getTimeAgo(item.timestamp) }}
    Loading amazing content...
    ⚠️

    Oops! Something went wrong

    {{ error }}
    🎉

    That's all folks!

    You've reached the end of our amazing content.

    Configuration Options

    {{ index + 1 }}

    {{ item.title }}

    {{ item.description }}

    API Methods

    `, styleUrl: './infinite-scroll-container-demo.component.scss' }) export class InfiniteScrollContainerDemoComponent { @ViewChild('itemTemplate') itemTemplate!: TemplateRef; // Basic example basicItems = signal([]); basicLoading = signal(false); basicHasMore = signal(true); private basicPage = 1; // Template example templateItems = signal([]); templateLoading = signal(false); templateHasMore = signal(true); private templatePage = 1; templateConfig: InfiniteScrollConfig = { threshold: 100, debounceTime: 150, itemHeight: 120 }; // Bidirectional example bidirectionalItems = signal([]); bidirectionalLoadingUp = signal(false); bidirectionalLoadingDown = signal(false); bidirectionalHasMore = signal(true); private bidirectionalTopPage = 0; private bidirectionalBottomPage = 1; bidirectionalConfig: InfiniteScrollConfig = { threshold: 50, debounceTime: 200 }; // Custom templates example customItems = signal([]); customLoading = signal(false); customHasMore = signal(true); customError = signal(undefined); private customPage = 1; private customFailCount = 0; customConfig: InfiniteScrollConfig = { threshold: 150, debounceTime: 100 }; // Configuration example configItems = signal([]); configLoading = signal(false); configHasMore = signal(true); private configPage = 1; // Configuration controls threshold = signal(200); debounceTime = signal(300); disableScroll = signal(false); currentConfig = signal({ threshold: 200, debounceTime: 300, disabled: false }); constructor() { // Initialize with some data this.loadInitialData(); } // Track by function for template rendering trackByFn = (index: number, item: DemoItem) => item.id; // Basic example methods loadMoreBasic(event: InfiniteScrollEvent): void { if (this.basicLoading()) return; this.basicLoading.set(true); // Simulate API call setTimeout(() => { const newItems = this.generateItems(this.basicPage * 20, 20, 'basic'); this.basicItems.update(items => [...items, ...newItems]); this.basicPage++; this.basicLoading.set(false); // Stop loading after 5 pages if (this.basicPage > 5) { this.basicHasMore.set(false); } }, 1000); } // Template example methods loadMoreTemplate(event: InfiniteScrollEvent): void { if (this.templateLoading()) return; this.templateLoading.set(true); setTimeout(() => { const newItems = this.generateItems(this.templatePage * 15, 15, 'template'); this.templateItems.update(items => [...items, ...newItems]); this.templatePage++; this.templateLoading.set(false); if (this.templatePage > 6) { this.templateHasMore.set(false); } }, 800); } // Bidirectional example methods loadMoreBidirectional(event: InfiniteScrollEvent): void { if (event.direction === 'down') { this.loadMoreBidirectionalDown(); } else { this.loadMoreBidirectionalUp(); } } private loadMoreBidirectionalDown(): void { if (this.bidirectionalLoadingDown()) return; this.bidirectionalLoadingDown.set(true); setTimeout(() => { const newItems = this.generateItems(this.bidirectionalBottomPage * 10, 10, 'chat'); this.bidirectionalItems.update(items => [...items, ...newItems]); this.bidirectionalBottomPage++; this.bidirectionalLoadingDown.set(false); }, 600); } private loadMoreBidirectionalUp(): void { if (this.bidirectionalLoadingUp()) return; this.bidirectionalLoadingUp.set(true); setTimeout(() => { const startId = this.bidirectionalTopPage * 10; const newItems = this.generateItems(startId, 10, 'history'); this.bidirectionalItems.update(items => [...newItems, ...items]); this.bidirectionalTopPage--; this.bidirectionalLoadingUp.set(false); }, 800); } // Custom templates example methods loadMoreCustom(event: InfiniteScrollEvent): void { if (this.customLoading()) return; this.customLoading.set(true); this.customError.set(undefined); // Simulate occasional failures const shouldFail = Math.random() < 0.3 && this.customFailCount < 2; setTimeout(() => { if (shouldFail) { this.customError.set('Network error: Failed to load more items'); this.customLoading.set(false); this.customFailCount++; } else { const newItems = this.generateItems(this.customPage * 12, 12, 'custom'); this.customItems.update(items => [...items, ...newItems]); this.customPage++; this.customLoading.set(false); if (this.customPage > 4) { this.customHasMore.set(false); } } }, 1200); } retryCustom(): void { this.loadMoreCustom({ direction: 'down', currentIndex: 0, scrollPosition: 0 }); } // Configuration example methods loadMoreConfig(event: InfiniteScrollEvent): void { if (this.configLoading()) return; this.configLoading.set(true); setTimeout(() => { const newItems = this.generateItems(this.configPage * 10, 10, 'config'); this.configItems.update(items => [...items, ...newItems]); this.configPage++; this.configLoading.set(false); if (this.configPage > 10) { this.configHasMore.set(false); } }, 500); } // Configuration controls toggleDisabled(event: Event): void { const disabled = (event.target as HTMLInputElement).checked; this.disableScroll.set(disabled); this.updateCurrentConfig(); } updateThreshold(event: Event): void { const value = parseInt((event.target as HTMLInputElement).value); this.threshold.set(value); this.updateCurrentConfig(); } updateDebounceTime(event: Event): void { const value = parseInt((event.target as HTMLInputElement).value); this.debounceTime.set(value); this.updateCurrentConfig(); } private updateCurrentConfig(): void { this.currentConfig.set({ threshold: this.threshold(), debounceTime: this.debounceTime(), disabled: this.disableScroll() }); } // API methods - These would be called on component references scrollToTop(): void { console.log('Scroll to top - would call component method'); } scrollToBottom(): void { console.log('Scroll to bottom - would call component method'); } scrollToIndex(index: number): void { console.log(`Scroll to index ${index} - would call component method`); } resetApiScroll(): void { console.log('Reset scroll - would call component method'); } // Utility methods getTimeAgo(date: Date): string { const now = new Date(); const diff = now.getTime() - date.getTime(); const minutes = Math.floor(diff / (1000 * 60)); if (minutes < 1) return 'Just now'; if (minutes < 60) return `${minutes}m ago`; if (minutes < 1440) return `${Math.floor(minutes / 60)}h ago`; return `${Math.floor(minutes / 1440)}d ago`; } private loadInitialData(): void { // Load initial data for all examples this.basicItems.set(this.generateItems(1, 20, 'basic')); this.templateItems.set(this.generateItems(1, 15, 'template')); this.bidirectionalItems.set(this.generateItems(1, 20, 'chat')); this.customItems.set(this.generateItems(1, 12, 'custom')); this.configItems.set(this.generateItems(1, 10, 'config')); } private generateItems(startId: number, count: number, type: string): DemoItem[] { const categories = ['Technology', 'Science', 'Arts', 'Sports', 'Travel', 'Food', 'Music', 'Literature']; return Array.from({ length: count }, (_, i) => ({ id: startId + i, title: `${type.charAt(0).toUpperCase() + type.slice(1)} Item ${startId + i}`, description: `This is a sample description for ${type} item ${startId + i}. It contains some interesting content that demonstrates the infinite scroll functionality.`, timestamp: new Date(Date.now() - Math.random() * 86400000 * 30), // Random date within last 30 days category: categories[Math.floor(Math.random() * categories.length)] })); } }}F^ x\ import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { TextInputComponent } from '../../../../../ui-essentials/src/lib/components/forms/input/text-input.component'; import { TextareaComponent } from '../../../../../ui-essentials/src/lib/components/forms/input/textarea.component'; import { InputWrapperComponent } from '../../../../../ui-essentials/src/lib/components/forms/input/input-wrapper.component'; import { faSearch, faEnvelope, faEdit } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-input-demo', standalone: true, imports: [ CommonModule, FormsModule, TextInputComponent, TextareaComponent, InputWrapperComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Input Component Showcase

    Text Input Variants

    Outlined (Default)

    Filled

    Underlined

    Input Types

    Input States

    Inputs with Icons and Features

    Special States

    Character Limit

    Textarea Variants

    Basic Textareas

    Textarea Variants

    Textarea with Features

    Textarea States

    Input Wrapper (Dynamic)

    Usage Examples

    Basic Text Input:

    <ui-text-input
  label="Email"
  placeholder="Enter your email"
  type="email"
  variant="outlined"
  size="md"
  [(ngModel)]="email"
  (inputChange)="handleEmailChange($event)">
</ui-text-input>

    Text Input with Icons:

    <ui-text-input
  label="Search"
  placeholder="Search products..."
  type="search"
  variant="filled"
  [prefixIcon]="faSearch"
  [clearable]="true"
  [(ngModel)]="searchTerm"
  (inputChange)="handleSearch($event)">
</ui-text-input>

    Textarea:

    <ui-textarea
  label="Message"
  placeholder="Enter your message..."
  variant="outlined"
  [rows]="4"
  [maxLength]="500"
  [showCharacterCount]="true"
  [(ngModel)]="message"
  (textareaChange)="handleMessageChange($event)">
</ui-textarea>

    Input Wrapper:

    <ui-input-wrapper
  [mode]="inputMode"
  label="Dynamic Input"
  placeholder="Switches between input and textarea"
  variant="outlined"
  [prefixIcon]="faEdit"
  [(ngModel)]="content"
  (inputChange)="handleContentChange($event)">
</ui-input-wrapper>

    Interactive Actions

    @if (lastChangedInput()) {
    Last changed: {{ lastChangedInput() }} = "{{ lastChangedValue() }}"
    }

    Current Values

    {{ getValuesAsJson() }}
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } button { transition: all 0.2s ease-in-out; } button:hover { opacity: 0.9; transform: translateY(-1px); } label { display: flex; align-items: center; gap: 0.5rem; font-weight: 500; cursor: pointer; } `] }) export class InputDemoComponent { textValues: Record = {}; lastChangedInput = signal(''); lastChangedValue = signal(''); isLoading = signal(false); useTextarea = signal(false); // FontAwesome icons readonly faSearch = faSearch; readonly faEnvelope = faEnvelope; readonly faEdit = faEdit; handleInputChange(inputName: string, value: string): void { this.textValues[inputName] = value; this.lastChangedInput.set(inputName); this.lastChangedValue.set(value); console.log(`Input changed: ${inputName} = "${value}"`); } handleClear(inputName: string): void { this.textValues[inputName] = ''; this.lastChangedInput.set(inputName); this.lastChangedValue.set('(cleared)'); console.log(`Input cleared: ${inputName}`); } toggleLoading(): void { this.isLoading.set(!this.isLoading()); console.log(`Loading state: ${this.isLoading() ? 'started' : 'stopped'}`); } toggleInputMode(): void { this.useTextarea.set(!this.useTextarea()); console.log(`Input mode: ${this.useTextarea() ? 'textarea' : 'input'}`); } fillSampleData(): void { this.textValues = { 'outlined-md': 'Sample outlined text', 'email': 'user@example.com', 'search': 'sample search query', 'prefix-icon': 'search with icon', 'textarea-md': 'This is a sample message\nin a textarea component\nwith multiple lines.', 'wrapper': 'Dynamic wrapper content' }; this.lastChangedInput.set('multiple'); this.lastChangedValue.set('(sample data filled)'); console.log('Sample data filled'); } clearAllInputs(): void { this.textValues = {}; this.lastChangedInput.set('all'); this.lastChangedValue.set('(cleared)'); console.log('All inputs cleared'); } getValuesAsJson(): string { return JSON.stringify(this.textValues, null, 2); } }ul8xqN 'ObL8 hrx)import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { KanbanBoardComponent, KanbanColumn, KanbanItem, KanbanDragEvent } from 'ui-essentials'; @Component({ selector: 'ui-kanban-board-demo', standalone: true, imports: [CommonModule, KanbanBoardComponent], template: `

    Kanban Board Layout Demo

    Sizes

    Small

    Medium (Default)

    Large

    Full Featured Kanban Board

    States

    Disabled

    Column with Limits

    Interactive Events

    Event Log:

    @for (event of eventLog(); track event.id) {
    {{ event.type }}: {{ event.message }} {{ event.timestamp | date:'medium' }}
    }
    `, styleUrl: './kanban-board-demo.component.scss' }) export class KanbanBoardDemoComponent { eventLog = signal>([]); basicColumns(): KanbanColumn[] { return [ { id: 'todo', title: 'To Do', items: [ { id: '1', title: 'Design homepage', description: 'Create wireframes and mockups' }, { id: '2', title: 'Setup database', priority: 'high' } ] }, { id: 'in-progress', title: 'In Progress', items: [ { id: '3', title: 'Build API endpoints', priority: 'medium', assignee: 'John' } ] }, { id: 'done', title: 'Done', items: [ { id: '4', title: 'Project setup', description: 'Initialize repository and dependencies' } ] } ]; } fullColumns(): KanbanColumn[] { return [ { id: 'backlog', title: 'Backlog', items: [ { id: 'item-1', title: 'User Authentication System', description: 'Implement login, registration, and password reset functionality', priority: 'high', tags: ['backend', 'security', 'user-management'], assignee: 'Sarah Connor', dueDate: new Date(2024, 11, 15) }, { id: 'item-2', title: 'Dashboard Analytics', description: 'Create comprehensive analytics dashboard with charts and metrics', priority: 'medium', tags: ['frontend', 'analytics', 'charts'], assignee: 'John Doe', dueDate: new Date(2024, 11, 20) }, { id: 'item-3', title: 'Mobile Responsiveness', description: 'Ensure all pages work correctly on mobile devices', priority: 'low', tags: ['frontend', 'responsive', 'css'], assignee: 'Jane Smith' } ] }, { id: 'todo', title: 'To Do', items: [ { id: 'item-4', title: 'API Rate Limiting', description: 'Implement rate limiting for API endpoints to prevent abuse', priority: 'high', tags: ['backend', 'security', 'performance'], assignee: 'Bob Wilson', dueDate: new Date(2024, 11, 10) }, { id: 'item-5', title: 'Email Notifications', description: 'Set up email notification system for important events', priority: 'medium', tags: ['backend', 'email', 'notifications'], assignee: 'Alice Brown' } ] }, { id: 'in-progress', title: 'In Progress', items: [ { id: 'item-6', title: 'Database Optimization', description: 'Optimize database queries and add proper indexing', priority: 'high', tags: ['database', 'performance', 'optimization'], assignee: 'Mike Johnson', dueDate: new Date(2024, 11, 8) } ] }, { id: 'review', title: 'In Review', items: [ { id: 'item-7', title: 'Unit Test Coverage', description: 'Increase unit test coverage to 90%', priority: 'medium', tags: ['testing', 'quality', 'coverage'], assignee: 'Lisa Davis', dueDate: new Date(2024, 11, 12) } ] }, { id: 'done', title: 'Done', items: [ { id: 'item-8', title: 'Project Setup', description: 'Initialize project structure and dependencies', priority: 'high', tags: ['setup', 'infrastructure'], assignee: 'Team Lead' }, { id: 'item-9', title: 'Design System', description: 'Create component library and design tokens', priority: 'medium', tags: ['design', 'components', 'ui'], assignee: 'Design Team' } ] } ]; } limitedColumns(): KanbanColumn[] { return [ { id: 'todo', title: 'To Do', items: [ { id: '1', title: 'Task 1' }, { id: '2', title: 'Task 2' } ] }, { id: 'limited', title: 'Limited (Max 2)', maxItems: 2, items: [ { id: '3', title: 'Limited Task 1' }, { id: '4', title: 'Limited Task 2' } ] }, { id: 'done', title: 'Done', items: [] } ]; } interactiveColumns(): KanbanColumn[] { return [ { id: 'new', title: 'New', items: [ { id: 'i1', title: 'Interactive Item 1', description: 'Click me or drag me!' }, { id: 'i2', title: 'Interactive Item 2', priority: 'high', assignee: 'You' } ] }, { id: 'active', title: 'Active', items: [ { id: 'i3', title: 'Interactive Item 3', priority: 'medium' } ] }, { id: 'complete', title: 'Complete', items: [] } ]; } onItemMoved(event: KanbanDragEvent): void { this.logEvent('Item Moved', `"${event.item.title}" moved from "${event.fromColumn}" to "${event.toColumn}"` ); // In a real application, you would update your data here console.log('Item moved:', event); } onItemClicked(event: { item: KanbanItem; columnId: string }): void { this.logEvent('Item Clicked', `"${event.item.title}" clicked in column "${event.columnId}"` ); console.log('Item clicked:', event); } private logEvent(type: string, message: string): void { const currentLog = this.eventLog(); const newEvent = { id: Date.now().toString(), type, message, timestamp: new Date() }; // Keep only the last 10 events const updatedLog = [newEvent, ...currentLog].slice(0, 10); this.eventLog.set(updatedLog); } }òxMimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FAQSectionComponent, FAQConfig } from 'ui-landing-pages'; @Component({ selector: 'app-landing-faq-demo', standalone: true, imports: [CommonModule, FAQSectionComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    FAQ Section Demo

    Interactive FAQ component with accordion functionality and search.

    🚧 Under Construction: This demo is temporarily disabled while the ui-landing-pages library is being built.

    Bordered Theme

    Minimal Theme

    Multiple Expand Enabled

    -->
    `, styles: [` .demo-container { max-width: 1200px; margin: 0 auto; padding: 2rem; } .demo-header { text-align: center; margin-bottom: 3rem; } .demo-header h1 { font-size: 2.5rem; margin-bottom: 1rem; color: #1a1a1a; } .demo-header p { font-size: 1.125rem; color: #666; } .demo-section { margin-bottom: 4rem; } .demo-section h2 { font-size: 1.5rem; margin-bottom: 1.5rem; color: #333; border-bottom: 2px solid #e0e0e0; padding-bottom: 0.5rem; } `] }) export class LandingFAQDemoComponent { defaultConfig: FAQConfig = { title: 'Frequently Asked Questions', subtitle: 'Find answers to common questions about our platform', searchEnabled: true, expandMultiple: false, theme: 'default', items: [ { id: '1', question: 'What is included in the free plan?', answer: 'The free plan includes up to 5 projects, 2GB storage, and basic support. Perfect for getting started with small projects.' }, { id: '2', question: 'Can I upgrade or downgrade my plan at any time?', answer: 'Yes, you can change your plan at any time. Upgrades take effect immediately, while downgrades take effect at the next billing cycle.' }, { id: '3', question: 'Is my data secure?', answer: 'Absolutely. We use enterprise-grade encryption, regular security audits, and comply with SOC 2 Type II standards to protect your data.' }, { id: '4', question: 'Do you offer customer support?', answer: 'Yes! We provide 24/7 email support for all users, with priority phone support available for Pro and Enterprise customers.' }, { id: '5', question: 'Can I cancel my subscription anytime?', answer: 'Yes, you can cancel your subscription at any time. Your account will remain active until the end of your current billing period.' } ] }; borderedConfig: FAQConfig = { ...this.defaultConfig, title: 'Product Questions', subtitle: 'Everything you need to know about our product features', theme: 'bordered', items: [ { id: '6', question: 'How do I integrate with third-party services?', answer: 'Our platform offers REST APIs, webhooks, and pre-built integrations with popular services like Slack, GitHub, and Zapier.' }, { id: '7', question: 'What file formats do you support?', answer: 'We support all major file formats including PDF, Word, Excel, PowerPoint, images (PNG, JPG, SVG), and various code files.' }, { id: '8', question: 'Is there a mobile app available?', answer: 'Yes! Our mobile apps are available for both iOS and Android, with full feature parity to the web application.' } ] }; minimalConfig: FAQConfig = { ...this.defaultConfig, title: 'Technical FAQ', subtitle: 'Answers to technical questions', theme: 'minimal', searchEnabled: false, items: [ { id: '9', question: 'What are your API rate limits?', answer: 'Free accounts: 100 requests/hour. Pro accounts: 1,000 requests/hour. Enterprise: Custom limits based on your needs.' }, { id: '10', question: 'Do you provide webhooks?', answer: 'Yes, we support webhooks for real-time event notifications. You can configure them in your dashboard settings.' }, { id: '11', question: 'What programming languages do you support?', answer: 'We provide SDKs for JavaScript, Python, Ruby, PHP, Go, and .NET. REST APIs are available for any language.' } ] }; multipleExpandConfig: FAQConfig = { ...this.defaultConfig, title: 'Detailed FAQ', subtitle: 'Comprehensive answers to all your questions', expandMultiple: true, items: [ { id: '12', question: 'How does billing work?', answer: 'Billing is processed monthly or annually based on your preference. You can view detailed invoices in your account dashboard and update payment methods anytime.' }, { id: '13', question: 'Can I export my data?', answer: 'Yes, you can export all your data in various formats (CSV, JSON, XML) at any time. Enterprise customers also get automated backup options.' }, { id: '14', question: 'What happens if I exceed my plan limits?', answer: 'If you approach your limits, we\'ll notify you in advance. You can either upgrade your plan or purchase additional resources as needed.' } ] }; } _vxUێ0}WVJ ^O/34*^4Qv+! śݭFxS*C4``%UeJ@X㕳$~k9pqlEB!Ѵ΂%"f1kesa#W2)g"1șK\GLy3 V<е?кڋxb<o稇ȃ',e1s,xtBHY3C%i]'z?īc8N)/@҃iC_>äɺRG%USK.}907}ximport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FeatureGridComponent, FeatureGridConfig, FeatureItem } from 'ui-landing-pages'; @Component({ selector: 'app-landing-feature-grid-demo', standalone: true, imports: [CommonModule, FeatureGridComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Feature Grid Component

    Showcase features in responsive grid layouts with icons, images, and links

    Basic Grid

    Card Variant

    Minimal Variant

    List Layout

    Configuration

    {{ configExample }}
    `, styleUrl: './landing-feature-grid-demo.component.scss' }) export class LandingFeatureGridDemoComponent { private sampleFeatures: FeatureItem[] = [ { id: 'security', title: 'Advanced Security', description: 'Enterprise-grade security with end-to-end encryption and compliance certifications.', icon: 'shield-alt', iconType: 'fa', link: { url: '#security', text: 'Learn more', target: '_self' } }, { id: 'performance', title: 'Lightning Fast', description: 'Optimized for speed with CDN delivery and smart caching mechanisms.', icon: 'bolt', iconType: 'fa', link: { url: '#performance', text: 'View benchmarks', target: '_self' } }, { id: 'analytics', title: 'Smart Analytics', description: 'Gain insights with real-time analytics and customizable dashboards.', icon: 'chart-line', iconType: 'fa', link: { url: '#analytics', text: 'Explore features', target: '_self' } }, { id: 'support', title: '24/7 Support', description: 'Get help whenever you need it with our dedicated support team.', icon: 'headset', iconType: 'fa', link: { url: '#support', text: 'Contact us', target: '_self' } } ]; basicConfig: FeatureGridConfig = { title: 'Why Choose Our Platform', subtitle: 'Discover the features that make us different', features: this.sampleFeatures, layout: 'grid', columns: 'auto', variant: 'card', showIcons: true, spacing: 'normal' }; cardConfig: FeatureGridConfig = { title: 'Platform Features', features: this.sampleFeatures, layout: 'grid', columns: 2, variant: 'card', showIcons: true, spacing: 'loose' }; minimalConfig: FeatureGridConfig = { features: this.sampleFeatures.slice(0, 3), layout: 'grid', columns: 3, variant: 'minimal', showIcons: true, spacing: 'tight' }; listConfig: FeatureGridConfig = { title: 'Core Capabilities', features: this.sampleFeatures.slice(0, 3), layout: 'list', variant: 'minimal', showIcons: true, spacing: 'normal' }; configExample = `const featureGridConfig: FeatureGridConfig = { title: 'Why Choose Our Platform', subtitle: 'Discover the features that make us different', features: [ { id: 'security', title: 'Advanced Security', description: 'Enterprise-grade security with end-to-end encryption.', icon: 'shield-alt', iconType: 'fa', link: { url: '#security', text: 'Learn more' } } // ... more features ], layout: 'grid', columns: 'auto', variant: 'card', showIcons: true, spacing: 'normal' };`; }8zx%Rimport { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FooterSectionComponent, FooterConfig, FooterLink } from 'ui-landing-pages'; import { ButtonComponent } from 'ui-essentials'; import { VStackComponent } from 'ui-essentials'; import { SectionComponent } from 'ui-essentials'; @Component({ selector: 'app-landing-footer-demo', standalone: true, imports: [CommonModule, FooterSectionComponent, ButtonComponent, VStackComponent, SectionComponent], template: `

    Landing Footer - Light Theme

    Comprehensive footer with multiple columns, newsletter signup, and social links.

    Landing Footer - Dark Theme

    Dark theme footer with company branding and legal links.

    Landing Footer - Minimal

    Simple footer with just essential links and copyright.

    Configuration Options

    Theme: {{ lightFooterConfig().theme }} Show Divider: {{ lightFooterConfig().showDivider ? 'ON' : 'OFF' }} Add Column Remove Column
    `, styles: [` .demo-controls { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; } .demo-control { min-width: 150px; } :host { display: block; padding-bottom: 2rem; } `] }) export class LandingFooterDemoComponent { lightFooterConfig = signal({ logo: { text: 'UI Suite', url: '/' }, columns: [ { id: 'product', title: 'Product', items: [ { id: 'features', label: 'Features', route: '/features' }, { id: 'pricing', label: 'Pricing', route: '/pricing' }, { id: 'integrations', label: 'Integrations', route: '/integrations' }, { id: 'api', label: 'API', route: '/api' } ] }, { id: 'company', title: 'Company', items: [ { id: 'about', label: 'About Us', route: '/about' }, { id: 'careers', label: 'Careers', route: '/careers', badge: '5 open' }, { id: 'blog', label: 'Blog', route: '/blog' }, { id: 'press', label: 'Press', route: '/press' } ] }, { id: 'resources', title: 'Resources', items: [ { id: 'docs', label: 'Documentation', route: '/docs' }, { id: 'guides', label: 'Guides', route: '/guides' }, { id: 'help', label: 'Help Center', route: '/help' }, { id: 'community', label: 'Community', url: 'https://discord.gg/example', target: '_blank' } ] }, { id: 'legal', title: 'Legal', items: [ { id: 'privacy', label: 'Privacy Policy', route: '/privacy' }, { id: 'terms', label: 'Terms of Service', route: '/terms' }, { id: 'cookies', label: 'Cookie Policy', route: '/cookies' }, { id: 'gdpr', label: 'GDPR', route: '/gdpr' } ] } ], newsletter: { title: 'Stay Updated', description: 'Get the latest news and updates delivered to your inbox.', placeholder: 'Enter your email', buttonText: 'Subscribe', onSubmit: (email: string) => { console.log('Newsletter signup:', email); } }, socialLinks: [ { id: 'twitter', platform: 'twitter', url: 'https://twitter.com/example' }, { id: 'facebook', platform: 'facebook', url: 'https://facebook.com/example' }, { id: 'linkedin', platform: 'linkedin', url: 'https://linkedin.com/company/example' }, { id: 'github', platform: 'github', url: 'https://github.com/example' } ], copyright: '© 2024 UI Suite. All rights reserved.', legalLinks: [ { id: 'privacy', label: 'Privacy', route: '/privacy' }, { id: 'terms', label: 'Terms', route: '/terms' }, { id: 'cookies', label: 'Cookies', route: '/cookies' } ], theme: 'light', showDivider: true }); darkFooterConfig = signal({ logo: { text: 'Dark UI Pro', url: '/' }, columns: [ { id: 'solutions', title: 'Solutions', items: [ { id: 'enterprise', label: 'Enterprise', route: '/enterprise' }, { id: 'startups', label: 'Startups', route: '/startups' }, { id: 'agencies', label: 'Agencies', route: '/agencies' }, { id: 'developers', label: 'Developers', route: '/developers' } ] }, { id: 'support', title: 'Support', items: [ { id: 'contact', label: 'Contact Us', route: '/contact' }, { id: 'chat', label: 'Live Chat', action: () => alert('Chat opened!') }, { id: 'tickets', label: 'Support Tickets', route: '/support' }, { id: 'status', label: 'System Status', url: 'https://status.example.com', target: '_blank' } ] }, { id: 'developers', title: 'Developers', items: [ { id: 'api-docs', label: 'API Documentation', route: '/api-docs' }, { id: 'sdk', label: 'SDK', route: '/sdk' }, { id: 'webhooks', label: 'Webhooks', route: '/webhooks' }, { id: 'changelog', label: 'Changelog', route: '/changelog' } ] } ], newsletter: { title: 'Developer Newsletter', description: 'Weekly updates on new features, API changes, and developer resources.', placeholder: 'developer@company.com', buttonText: 'Join', onSubmit: (email: string) => { console.log('Developer newsletter signup:', email); } }, socialLinks: [ { id: 'github', platform: 'github', url: 'https://github.com/example' }, { id: 'twitter', platform: 'twitter', url: 'https://twitter.com/example' }, { id: 'youtube', platform: 'youtube', url: 'https://youtube.com/example' } ], copyright: '© 2024 Dark UI Pro. Built with ❤️ by developers.', legalLinks: [ { id: 'privacy', label: 'Privacy Policy', route: '/privacy' }, { id: 'terms', label: 'Terms of Service', route: '/terms' }, { id: 'security', label: 'Security', route: '/security' } ], theme: 'dark', showDivider: true }); minimalFooterConfig = signal({ columns: [ { id: 'quick-links', title: 'Quick Links', items: [ { id: 'home', label: 'Home', route: '/' }, { id: 'about', label: 'About', route: '/about' }, { id: 'contact', label: 'Contact', route: '/contact' } ] } ], copyright: '© 2024 Minimal Footer Example', legalLinks: [ { id: 'privacy', label: 'Privacy', route: '/privacy' }, { id: 'terms', label: 'Terms', route: '/terms' } ], theme: 'light', showDivider: false }); toggleTheme(): void { const current = this.lightFooterConfig(); this.lightFooterConfig.set({ ...current, theme: current.theme === 'light' ? 'dark' : 'light' }); } toggleDivider(): void { const current = this.lightFooterConfig(); this.lightFooterConfig.set({ ...current, showDivider: !current.showDivider }); } addColumn(): void { const current = this.lightFooterConfig(); const newColumn = { id: `column-${current.columns.length + 1}`, title: `Column ${current.columns.length + 1}`, items: [ { id: `item-1`, label: 'Item 1', route: '/item-1' }, { id: `item-2`, label: 'Item 2', route: '/item-2' } ] }; this.lightFooterConfig.set({ ...current, columns: [...current.columns, newColumn] }); } removeColumn(): void { const current = this.lightFooterConfig(); if (current.columns.length > 1) { this.lightFooterConfig.set({ ...current, columns: current.columns.slice(0, -1) }); } } onLinkClicked(link: FooterLink): void { console.log('Footer link clicked:', link); } onNewsletterSubmitted(email: string): void { console.log('Newsletter submitted:', email); alert(`Newsletter subscription for: ${email}`); } } {xRimport { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { LandingHeaderComponent, CTAButton, LandingHeaderConfig, NavigationItem } from 'ui-landing-pages'; import { ButtonComponent, VStackComponent, SectionComponent } from 'ui-essentials'; @Component({ selector: 'app-landing-header-demo', standalone: true, imports: [CommonModule, LandingHeaderComponent, ButtonComponent, VStackComponent, SectionComponent], template: `

    Landing Header - Light Theme

    Sticky navigation header with transparent background that becomes solid on scroll.

    Landing Header - Dark Theme

    Dark theme version with logo and mega menu navigation.

    Landing Header - With Dropdown Menu

    Header with dropdown navigation and badges.

    Configuration Options

    Toggle Transparent: {{ lightHeaderConfig().transparent ? 'ON' : 'OFF' }} Toggle Sticky: {{ lightHeaderConfig().sticky ? 'ON' : 'OFF' }} Toggle Mobile Menu: {{ lightHeaderConfig().showMobileMenu ? 'ON' : 'OFF' }}

    Scroll Content

    Scroll to see header behavior

    More Content

    Keep scrolling...
    `, styles: [` .demo-controls { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; } .demo-control { min-width: 200px; } :host { display: block; padding-bottom: 2rem; } `] }) export class LandingHeaderDemoComponent { lightHeaderConfig = signal({ logo: { text: 'UI Suite', url: '/' }, navigation: [ { id: 'home', label: 'Home', route: '/', }, { id: 'features', label: 'Features', route: '/features', }, { id: 'pricing', label: 'Pricing', route: '/pricing', }, { id: 'about', label: 'About', route: '/about', }, { id: 'contact', label: 'Contact', route: '/contact', } ], ctaButton: { text: 'Get Started', variant: 'filled', size: 'medium', action: () => alert('CTA clicked!') }, transparent: true, sticky: true, showMobileMenu: true, maxWidth: 'xl', theme: 'light' }); darkHeaderConfig = signal({ logo: { text: 'Dark UI', url: '/' }, navigation: [ { id: 'products', label: 'Products', route: '/products', }, { id: 'solutions', label: 'Solutions', route: '/solutions', }, { id: 'resources', label: 'Resources', route: '/resources', }, { id: 'company', label: 'Company', route: '/company', } ], ctaButton: { text: 'Start Free Trial', variant: 'filled', size: 'medium', icon: '🚀', action: () => alert('Free trial started!') }, transparent: false, sticky: true, showMobileMenu: true, maxWidth: 'xl', theme: 'dark' }); dropdownHeaderConfig = signal({ logo: { text: 'Dropdown Demo', url: '/' }, navigation: [ { id: 'home', label: 'Home', route: '/', }, { id: 'products', label: 'Products', children: [ { id: 'ui-kit', label: 'UI Kit', route: '/products/ui-kit', badge: 'New' }, { id: 'components', label: 'Components', route: '/products/components', }, { id: 'templates', label: 'Templates', route: '/products/templates', badge: 'Pro' } ] }, { id: 'docs', label: 'Documentation', children: [ { id: 'getting-started', label: 'Getting Started', route: '/docs/getting-started', }, { id: 'api', label: 'API Reference', route: '/docs/api', }, { id: 'examples', label: 'Examples', route: '/docs/examples', } ] }, { id: 'support', label: 'Support', route: '/support', badge: '24/7' } ], ctaButton: { text: 'Contact Sales', variant: 'tonal', size: 'medium', action: () => alert('Contact sales clicked!') }, transparent: false, sticky: true, showMobileMenu: true, maxWidth: 'xl', theme: 'light' }); toggleTransparent(): void { const current = this.lightHeaderConfig(); this.lightHeaderConfig.set({ ...current, transparent: !current.transparent }); } toggleSticky(): void { const current = this.lightHeaderConfig(); this.lightHeaderConfig.set({ ...current, sticky: !current.sticky }); } toggleMobileMenu(): void { const current = this.lightHeaderConfig(); this.lightHeaderConfig.set({ ...current, showMobileMenu: !current.showMobileMenu }); } onNavigationClicked(item: NavigationItem): void { console.log('Navigation clicked:', item); } onCTAClicked(cta: CTAButton): void { console.log('CTA clicked:', cta); } }Y7zxqimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { LogoCloudComponent, LogoCloudConfig, LogoItem } from 'ui-landing-pages'; @Component({ selector: 'app-landing-logo-cloud-demo', standalone: true, imports: [CommonModule, LogoCloudComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Logo Cloud Component

    Display partner and client logos in various layouts

    Row Layout

    Grid Layout

    Marquee Layout

    Configuration

    {{ configExample }}
    `, styleUrl: './landing-logo-cloud-demo.component.scss' }) export class LandingLogoCloudDemoComponent { private sampleLogos: LogoItem[] = [ { id: 'google', name: 'Google', logo: 'https://upload.wikimedia.org/wikipedia/commons/2/2f/Google_2015_logo.svg', url: 'https://google.com', grayscale: false }, { id: 'microsoft', name: 'Microsoft', logo: 'https://upload.wikimedia.org/wikipedia/commons/9/96/Microsoft_logo_%282012%29.svg', url: 'https://microsoft.com', grayscale: false }, { id: 'amazon', name: 'Amazon', logo: 'https://upload.wikimedia.org/wikipedia/commons/a/a9/Amazon_logo.svg', url: 'https://amazon.com', grayscale: false }, { id: 'apple', name: 'Apple', logo: 'https://upload.wikimedia.org/wikipedia/commons/f/fa/Apple_logo_black.svg', url: 'https://apple.com', grayscale: false }, { id: 'netflix', name: 'Netflix', logo: 'https://upload.wikimedia.org/wikipedia/commons/0/08/Netflix_2015_logo.svg', url: 'https://netflix.com', grayscale: false }, { id: 'spotify', name: 'Spotify', logo: 'https://upload.wikimedia.org/wikipedia/commons/1/19/Spotify_logo_without_text.svg', url: 'https://spotify.com', grayscale: false } ]; rowConfig: LogoCloudConfig = { title: 'Trusted by Industry Leaders', subtitle: 'Join thousands of companies using our platform', logos: this.sampleLogos, layout: 'row', itemsPerRow: 5, grayscale: true, hoverEffect: true, maxHeight: 60 }; gridConfig: LogoCloudConfig = { title: 'Our Partners', logos: this.sampleLogos, layout: 'grid', itemsPerRow: 4, grayscale: true, hoverEffect: true, maxHeight: 80 }; marqueeConfig: LogoCloudConfig = { title: 'Continuous Partnership', subtitle: 'Seamlessly scrolling partner showcase', logos: this.sampleLogos, layout: 'marquee', grayscale: true, hoverEffect: true, maxHeight: 70 }; configExample = `const logoCloudConfig: LogoCloudConfig = { title: 'Trusted by Industry Leaders', subtitle: 'Join thousands of companies using our platform', logos: [ { id: 'google', name: 'Google', logo: 'path/to/google-logo.svg', url: 'https://google.com', grayscale: false } // ... more logos ], layout: 'row', itemsPerRow: 5, grayscale: true, hoverEffect: true, maxHeight: 60 };`; }ߋxwimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { StatisticsDisplayComponent, StatisticsConfig, StatisticItem } from 'ui-landing-pages'; @Component({ selector: 'app-landing-statistics-demo', standalone: true, imports: [CommonModule, StatisticsDisplayComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Statistics Display Component

    Showcase key metrics with animated counters and various layouts

    Row Layout - Minimal

    Grid Layout - Card Variant

    Primary Background

    Highlighted Variant

    Configuration

    {{ configExample }}
    `, styleUrl: './landing-statistics-demo.component.scss' }) export class LandingStatisticsDemoComponent { private sampleStatistics: StatisticItem[] = [ { id: 'users', value: 150000, label: 'Active Users', suffix: '+', description: 'Growing every day', icon: 'users', animateValue: true }, { id: 'projects', value: 25000, label: 'Projects Created', suffix: '+', description: 'Successful deployments', icon: 'chart-bar', animateValue: true }, { id: 'uptime', value: 99.9, label: 'Uptime', suffix: '%', description: 'Reliable service', icon: 'arrow-up', animateValue: true }, { id: 'support', value: '24/7', label: 'Support Available', description: 'Round-the-clock assistance', icon: 'headset', animateValue: false } ]; rowConfig: StatisticsConfig = { title: 'Platform Performance', subtitle: 'See how we\'re making a difference', statistics: this.sampleStatistics, layout: 'row', variant: 'minimal', animateOnScroll: true, backgroundColor: 'transparent' }; cardConfig: StatisticsConfig = { title: 'Success Metrics', statistics: this.sampleStatistics, layout: 'grid', variant: 'card', animateOnScroll: true, backgroundColor: 'surface' }; primaryConfig: StatisticsConfig = { title: 'Key Achievements', subtitle: 'Numbers that matter to our community', statistics: this.sampleStatistics.slice(0, 3), layout: 'row', variant: 'minimal', animateOnScroll: true, backgroundColor: 'primary' }; highlightedConfig: StatisticsConfig = { title: 'Performance Indicators', statistics: this.sampleStatistics, layout: 'grid', variant: 'highlighted', animateOnScroll: true, backgroundColor: 'transparent' }; configExample = `const statisticsConfig: StatisticsConfig = { title: 'Platform Performance', subtitle: 'See how we're making a difference', statistics: [ { id: 'users', value: 150000, label: 'Active Users', suffix: '+', description: 'Growing every day', icon: 'users', animateValue: true } // ... more statistics ], layout: 'row', variant: 'minimal', animateOnScroll: true, backgroundColor: 'transparent' };`; }8Ixnimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { TeamGridComponent, TeamConfig } from 'ui-landing-pages'; @Component({ selector: 'app-landing-team-demo', standalone: true, imports: [CommonModule, TeamGridComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Team Grid Demo

    Showcase your team members with professional cards and social links.

    3 Column Layout (Default)

    2 Column Layout

    4 Column Layout

    Without Bio Text

    `, styles: [` .demo-container { max-width: 1200px; margin: 0 auto; padding: 2rem; } .demo-header { text-align: center; margin-bottom: 3rem; } .demo-header h1 { font-size: 2.5rem; margin-bottom: 1rem; color: #1a1a1a; } .demo-header p { font-size: 1.125rem; color: #666; } .demo-section { margin-bottom: 4rem; } .demo-section h2 { font-size: 1.5rem; margin-bottom: 1.5rem; color: #333; border-bottom: 2px solid #e0e0e0; padding-bottom: 0.5rem; } `] }) export class LandingTeamDemoComponent { threeColumnConfig: TeamConfig = { title: 'Meet Our Amazing Team', subtitle: 'The talented professionals who make our success possible', columns: 3, showSocial: true, showBio: true, members: [ { id: '1', name: 'Sarah Johnson', role: 'CEO & Founder', bio: 'Visionary leader with 15+ years in tech, driving innovation and growth across multiple successful ventures.', image: 'https://images.unsplash.com/photo-1494790108755-2616b612b5ff?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/sarahjohnson', twitter: 'https://twitter.com/sarahjohnson', email: 'sarah@company.com' } }, { id: '2', name: 'Michael Chen', role: 'Chief Technology Officer', bio: 'Full-stack engineer and architect, passionate about building scalable systems and mentoring developers.', image: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/michaelchen', github: 'https://github.com/mchen', twitter: 'https://twitter.com/michaelchen', email: 'michael@company.com' } }, { id: '3', name: 'Emily Rodriguez', role: 'Head of Design', bio: 'Creative problem-solver specializing in user experience design and building design systems that scale.', image: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/emilyrodriguez', website: 'https://emilydesigns.com', email: 'emily@company.com' } } ] }; twoColumnConfig: TeamConfig = { title: 'Leadership Team', subtitle: 'The executives guiding our company forward', columns: 2, showSocial: true, showBio: true, members: [ { id: '4', name: 'David Park', role: 'VP of Sales', bio: 'Results-driven sales leader with a proven track record of building high-performing teams and exceeding revenue targets.', image: 'https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/davidpark', email: 'david@company.com' } }, { id: '5', name: 'Lisa Thompson', role: 'VP of Marketing', bio: 'Strategic marketer focused on brand building, digital growth, and creating authentic connections with our community.', image: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/lisathompson', twitter: 'https://twitter.com/lisathompson', email: 'lisa@company.com' } } ] }; fourColumnConfig: TeamConfig = { title: 'Engineering Team', subtitle: 'The brilliant minds behind our technology', columns: 4, showSocial: true, showBio: true, members: [ { id: '6', name: 'Alex Kim', role: 'Senior Frontend Developer', bio: 'React specialist with a passion for creating beautiful, accessible user interfaces.', image: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=300&h=300&fit=crop&crop=face', social: { github: 'https://github.com/alexkim', linkedin: 'https://linkedin.com/in/alexkim' } }, { id: '7', name: 'Maria Santos', role: 'Backend Engineer', bio: 'Database optimization expert and API architecture enthusiast.', image: 'https://images.unsplash.com/photo-1517841905240-472988babdf9?w=300&h=300&fit=crop&crop=face', social: { github: 'https://github.com/mariasantos', linkedin: 'https://linkedin.com/in/mariasantos' } }, { id: '8', name: 'James Wilson', role: 'DevOps Engineer', bio: 'Cloud infrastructure specialist ensuring reliable, scalable deployments.', image: 'https://images.unsplash.com/photo-1519244703995-f4e0f30006d5?w=300&h=300&fit=crop&crop=face', social: { github: 'https://github.com/jameswilson', linkedin: 'https://linkedin.com/in/jameswilson' } }, { id: '9', name: 'Sophie Brown', role: 'QA Engineer', bio: 'Quality assurance expert dedicated to delivering bug-free user experiences.', image: 'https://images.unsplash.com/photo-1487412720507-e7ab37603c6f?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/sophiebrown', email: 'sophie@company.com' } } ] }; noBioConfig: TeamConfig = { title: 'Advisory Board', subtitle: 'Industry experts guiding our strategic direction', columns: 3, showSocial: true, showBio: false, members: [ { id: '10', name: 'Robert Anderson', role: 'Strategic Advisor', image: 'https://images.unsplash.com/photo-1560250097-0b93528c311a?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/robertanderson' } }, { id: '11', name: 'Jennifer Lee', role: 'Technology Advisor', image: 'https://images.unsplash.com/photo-1573496359142-b8d87734a5a2?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/jenniferlee', website: 'https://jenniferlee.tech' } }, { id: '12', name: 'Marcus Johnson', role: 'Business Advisor', image: 'https://images.unsplash.com/photo-1556157382-97eda2d62296?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/marcusjohnson', email: 'marcus@advisor.com' } } ] }; }.XVx.4import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SaaSTemplateComponent } from '../../../../../ui-landing-pages/src/lib/components/templates/saas-template.component'; import { ProductTemplateComponent } from '../../../../../ui-landing-pages/src/lib/components/templates/product-template.component'; import { AgencyTemplateComponent } from '../../../../../ui-landing-pages/src/lib/components/templates/agency-template.component'; import { AgencyTemplateConfig, ProductTemplateConfig, SaaSTemplateConfig } from '../../../../../ui-landing-pages/src/lib/interfaces/templates.interfaces'; @Component({ selector: 'app-landing-templates-demo', standalone: true, imports: [CommonModule, SaaSTemplateComponent, ProductTemplateComponent, AgencyTemplateComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Landing Page Templates Demo

    Complete, production-ready landing page templates for different business types.

    @switch (activeTemplate) { @case ('saas') { } @case ('product') { } @case ('agency') { } }
    `, styles: [` .demo-container { min-height: 100vh; } .demo-header { text-align: center; padding: 3rem 2rem; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; } .demo-header h1 { font-size: 2.5rem; margin-bottom: 1rem; } .demo-header p { font-size: 1.125rem; opacity: 0.9; } .demo-navigation { display: flex; justify-content: center; gap: 1rem; padding: 2rem; background: #f8f9fa; border-bottom: 1px solid #e9ecef; } .demo-navigation button { padding: 0.75rem 1.5rem; border: 2px solid #6c757d; background: white; color: #6c757d; border-radius: 0.5rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; } .demo-navigation button:hover { background: #6c757d; color: white; } .demo-navigation button.active { background: #007bff; border-color: #007bff; color: white; } .template-container { min-height: calc(100vh - 200px); } @media (max-width: 768px) { .demo-navigation { flex-direction: column; align-items: center; } .demo-navigation button { width: 200px; } } `] }) export class LandingTemplatesDemoComponent { activeTemplate: 'saas' | 'product' | 'agency' = 'saas'; setActiveTemplate(template: 'saas' | 'product' | 'agency'): void { this.activeTemplate = template; } saasConfig: SaaSTemplateConfig = { hero: { title: 'Build Amazing SaaS Applications', subtitle: 'The complete toolkit for modern software development with enterprise-grade security and scalability.', ctaPrimary: { text: 'Start Free Trial', variant: 'tonal', size: 'large', action: () => console.log('Start trial clicked') }, ctaSecondary: { text: 'View Demo', variant: 'outlined', size: 'large', action: () => console.log('View demo clicked') }, alignment: 'center', backgroundType: 'gradient', minHeight: 'full' }, features: { title: 'Why Choose Our Platform', subtitle: 'Everything you need to build, deploy, and scale your applications', features: [ { id: '1', title: 'Lightning Fast Performance', description: 'Optimized architecture delivers sub-second response times and 99.99% uptime.', icon: 'rocket' }, { id: '2', title: 'Enterprise Security', description: 'SOC 2 compliant with end-to-end encryption and advanced threat protection.', icon: 'shield' }, { id: '3', title: 'Seamless Integrations', description: 'Connect with 100+ popular tools through our robust API and webhooks.', icon: 'plug' } ] }, socialProof: { title: 'Trusted by Industry Leaders', statistics: [ { id: '1', label: 'Active Users', value: '50,000+' }, { id: '2', label: 'Countries', value: '120+' }, { id: '3', label: 'Uptime', value: '99.99%' }, { id: '4', label: 'Support Rating', value: '4.9/5' } ] }, testimonials: { title: 'What Our Customers Say', testimonials: [ { id: '1', content: 'This platform transformed our development workflow. We ship features 3x faster now.', name: 'Sarah Chen', title: 'CTO at TechCorp', avatar: 'https://images.unsplash.com/photo-1494790108755-2616b612b5ff?w=100&h=100&fit=crop&crop=face' } ] }, pricing: { billingToggle: { monthlyLabel: 'Monthly', yearlyLabel: 'Yearly', discountText: 'Save 20%' }, featuresComparison: false, plans: [ { id: '1', name: 'Starter', price: { monthly: 29, yearly: 290, currency: 'USD', suffix: 'per user' }, features: [ { name: '5 Projects', included: true }, { name: '10GB Storage', included: true }, { name: 'Email Support', included: true } ], cta: { text: 'Get Started', variant: 'filled', action: () => console.log('Starter plan selected') } } ] }, faq: { title: 'Frequently Asked Questions', items: [ { id: '1', question: 'Can I cancel my subscription anytime?', answer: 'Yes, you can cancel your subscription at any time with no penalties.' } ] }, cta: { title: 'Ready to Get Started?', subtitle: 'Join thousands of developers building the future', ctaPrimary: { text: 'Start Free Trial', variant: 'filled', action: () => console.log('Start trial clicked') }, backgroundType: 'gradient' } }; productConfig: ProductTemplateConfig = { hero: { title: 'Introducing the Future of Productivity', subtitle: 'Revolutionary new product that will transform how you work and collaborate.', ctaPrimary: { text: 'Order Now', variant: 'tonal', size: 'large', action: () => console.log('Order now clicked') }, ctaSecondary: { text: 'Learn More', variant: 'tonal', size: 'large', action: () => console.log('Learn more clicked') }, alignment: 'left', backgroundType: 'image', minHeight: 'large' }, features: { title: 'Key Features', subtitle: 'Designed with you in mind', features: [ { id: '1', title: 'Intuitive Design', description: 'Beautiful interface that anyone can use without training.', icon: 'star' }, { id: '2', title: 'Premium Materials', description: 'Built with the finest materials for durability and style.', icon: 'check' } ] }, testimonials: { title: 'Customer Reviews', testimonials: [ { id: '1', content: 'This product exceeded all my expectations. Highly recommended!', name: 'Mike Johnson', title: 'Verified Customer', rating: 5 } ] }, pricing: { billingToggle: { monthlyLabel: 'One-time', yearlyLabel: 'Bundle', discountText: 'Best Value' }, featuresComparison: false, plans: [ { id: '1', name: 'Standard Edition', price: { monthly: 199, yearly: 199, currency: 'USD', suffix: 'one-time' }, features: [ { name: '2-Year Warranty', included: true }, { name: 'Free Shipping', included: true } ], cta: { text: 'Order Now', variant: 'filled', action: () => console.log('Product ordered') } } ] }, cta: { title: 'Start Your Journey', subtitle: 'Order now and get free shipping worldwide', ctaPrimary: { text: 'Order Now', variant: 'filled', action: () => console.log('Order now clicked') }, backgroundType: 'gradient' } }; agencyConfig: AgencyTemplateConfig = { hero: { title: 'Your Vision, Our Expertise', subtitle: 'We create exceptional digital experiences that drive results for businesses of all sizes.', ctaPrimary: { text: 'Start Project', variant: 'tonal', size: 'large', action: () => console.log('Start project clicked') }, ctaSecondary: { text: 'View Portfolio', variant: 'outlined', size: 'large', action: () => console.log('View portfolio clicked') }, alignment: 'left', backgroundType: 'gradient', minHeight: 'large' }, services: { title: 'Our Services', subtitle: 'Comprehensive solutions for your digital needs', features: [ { id: '1', title: 'Web Development', description: 'Custom websites and web applications built with modern technologies.', icon: 'code' }, { id: '2', title: 'UI/UX Design', description: 'User-centered design that converts visitors into customers.', icon: 'palette' }, { id: '3', title: 'Digital Marketing', description: 'Strategic campaigns that grow your online presence.', icon: 'megaphone' } ] }, team: { title: 'Meet Our Team', subtitle: 'The talented individuals behind our success', members: [ { id: '1', name: 'Alex Rivera', role: 'Creative Director', bio: 'Award-winning designer with 10+ years of experience in digital creativity.', image: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=300&h=300&fit=crop&crop=face', social: { linkedin: 'https://linkedin.com/in/alexrivera' } } ], columns: 3, showSocial: true, showBio: true }, timeline: { title: 'Our Journey', subtitle: 'Milestones that define our growth', items: [ { id: '1', title: 'Agency Founded', description: 'Started with a mission to help businesses succeed online.', date: '2018', status: 'completed', icon: 'rocket' }, { id: '2', title: '100+ Happy Clients', description: 'Reached major milestone serving clients across industries.', date: '2020', status: 'completed', icon: 'star' }, { id: '3', title: 'Award Recognition', description: 'Won Best Digital Agency award from Industry Association.', date: '2022', status: 'current', icon: 'check', badge: 'Latest' } ], orientation: 'vertical', showDates: true }, testimonials: { title: 'Client Success Stories', subtitle: 'What our partners say about working with us', testimonials: [ { id: '1', content: 'Working with this agency was a game-changer for our business. They delivered beyond our expectations.', name: 'Emma Watson', title: 'CEO at StartupXYZ', avatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100&h=100&fit=crop&crop=face' } ] }, cta: { title: 'Ready to Start Your Project?', subtitle: 'Let\'s discuss how we can bring your vision to life', ctaPrimary: { text: 'Get Started', variant: 'filled', action: () => console.log('Get started clicked') }, backgroundType: 'gradient' } }; }eY`xyimport { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; // Temporarily commented out until ui-landing-pages is built // import { TestimonialCarouselComponent, TestimonialCarouselConfig, TestimonialItem } from 'ui-landing-pages'; // Placeholder types interface TestimonialItem { id: string; name: string; title: string; company: string; content: string; rating: number; avatar: string; verified: boolean; } interface TestimonialCarouselConfig { title?: string; subtitle?: string; testimonials: TestimonialItem[]; autoPlay?: boolean; autoPlayDelay?: number; showDots?: boolean; showNavigation?: boolean; itemsPerView?: number; variant?: 'card' | 'quote' | 'minimal'; showRatings?: boolean; } @Component({ selector: 'app-landing-testimonials-demo', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Testimonial Carousel Component

    Display customer testimonials with carousel navigation and various styles

    Component Preview Unavailable

    The TestimonialCarouselComponent will be available once the ui-landing-pages library is built.

    This demo will show:

    • • Single Item Carousel
    • • Multi-Item Carousel
    • • Quote Variant
    • • Minimal Variant

    Configuration Example

    {{ configExample }}
    `, styleUrl: './landing-testimonials-demo.component.scss' }) export class LandingTestimonialsDemoComponent { private sampleTestimonials: TestimonialItem[] = [ { id: 'sarah-chen', name: 'Sarah Chen', title: 'CTO', company: 'TechCorp', content: 'This platform transformed our development workflow. The intuitive design and powerful features helped us deliver projects 40% faster.', rating: 5, avatar: 'https://images.unsplash.com/photo-1494790108755-2616b612b977?w=100&h=100&fit=crop&crop=face', verified: true }, { id: 'marcus-rodriguez', name: 'Marcus Rodriguez', title: 'Lead Developer', company: 'StartupXYZ', content: 'Outstanding performance and reliability. The support team is incredibly responsive and knowledgeable.', rating: 5, avatar: 'https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100&h=100&fit=crop&crop=face', verified: true }, { id: 'emily-watson', name: 'Emily Watson', title: 'Product Manager', company: 'InnovateLabs', content: 'The analytics features provided insights we never had before. Our team productivity increased significantly.', rating: 4, avatar: 'https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=100&h=100&fit=crop&crop=face', verified: false }, { id: 'david-kim', name: 'David Kim', title: 'Software Engineer', company: 'CodeCrafters', content: 'Clean interface, excellent documentation, and seamless integration. Everything just works as expected.', rating: 5, avatar: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop&crop=face', verified: true }, { id: 'lisa-thompson', name: 'Lisa Thompson', title: 'Engineering Director', company: 'ScaleTech', content: 'Scalable solution that grows with our needs. The performance optimization features are game-changing.', rating: 5, avatar: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?w=100&h=100&fit=crop&crop=face', verified: true } ]; singleConfig: TestimonialCarouselConfig = { title: 'What Our Customers Say', subtitle: 'Trusted by thousands of developers worldwide', testimonials: this.sampleTestimonials, autoPlay: true, autoPlayDelay: 5000, showDots: true, showNavigation: true, itemsPerView: 1, variant: 'card', showRatings: true }; multiConfig: TestimonialCarouselConfig = { title: 'Customer Success Stories', testimonials: this.sampleTestimonials, autoPlay: false, showDots: true, showNavigation: true, itemsPerView: 2, variant: 'card', showRatings: true }; quoteConfig: TestimonialCarouselConfig = { title: 'Featured Reviews', testimonials: this.sampleTestimonials.slice(0, 3), autoPlay: true, autoPlayDelay: 6000, showDots: true, showNavigation: false, itemsPerView: 1, variant: 'quote', showRatings: true }; minimalConfig: TestimonialCarouselConfig = { testimonials: this.sampleTestimonials.slice(0, 3), autoPlay: false, showDots: true, showNavigation: true, itemsPerView: 1, variant: 'minimal', showRatings: false }; configExample = `const testimonialConfig: TestimonialCarouselConfig = { title: 'What Our Customers Say', subtitle: 'Trusted by thousands of developers worldwide', testimonials: [ { id: 'sarah-chen', name: 'Sarah Chen', title: 'CTO', company: 'TechCorp', content: 'This platform transformed our workflow...', rating: 5, avatar: 'path/to/avatar.jpg', verified: true } // ... more testimonials ], autoPlay: true, autoPlayDelay: 5000, showDots: true, showNavigation: true, itemsPerView: 1, variant: 'card', showRatings: true };`; }?x "import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { TimelineConfig, TimelineSectionComponent } from "../../../../../ui-landing-pages/src/public-api"; @Component({ selector: 'app-landing-timeline-demo', standalone: true, imports: [CommonModule, TimelineSectionComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Timeline Demo

    Visual timeline components for roadmaps, company history, and project milestones.

    Vertical Timeline (Default)

    Horizontal Timeline

    Minimal Theme

    Connected Theme

    Product Roadmap

    `, styles: [` .demo-container { max-width: 1200px; margin: 0 auto; padding: 2rem; } .demo-header { text-align: center; margin-bottom: 3rem; } .demo-header h1 { font-size: 2.5rem; margin-bottom: 1rem; color: #1a1a1a; } .demo-header p { font-size: 1.125rem; color: #666; } .demo-section { margin-bottom: 4rem; } .demo-section h2 { font-size: 1.5rem; margin-bottom: 1.5rem; color: #333; border-bottom: 2px solid #e0e0e0; padding-bottom: 0.5rem; } `] }) export class LandingTimelineDemoComponent { verticalConfig: TimelineConfig = { title: 'Our Company Journey', subtitle: 'Key milestones that shaped our growth', orientation: 'vertical', theme: 'default', showDates: true, items: [ { id: '1', title: 'Company Founded', description: 'Started with a vision to revolutionize how teams collaborate and build software together.', date: 'January 2020', status: 'completed', icon: 'rocket' }, { id: '2', title: 'First Product Launch', description: 'Launched our MVP with core features that solve real problems for development teams.', date: 'June 2020', status: 'completed', icon: 'star' }, { id: '3', title: 'Series A Funding', description: 'Secured $5M in Series A funding to accelerate product development and team growth.', date: 'March 2021', status: 'completed', icon: 'check' }, { id: '4', title: '10,000 Active Users', description: 'Reached a major milestone with 10,000+ active users across 50+ countries worldwide.', date: 'September 2021', status: 'completed', icon: 'star' }, { id: '5', title: 'Major Platform Update', description: 'Released version 2.0 with advanced automation, better performance, and new integrations.', date: 'December 2022', status: 'current', icon: 'rocket', badge: 'Current' }, { id: '6', title: 'International Expansion', description: 'Planning to open offices in Europe and Asia to better serve our global customer base.', date: 'Q2 2024', status: 'upcoming' } ] }; horizontalConfig: TimelineConfig = { title: 'Development Process', subtitle: 'Our structured approach to building great products', orientation: 'horizontal', theme: 'default', showDates: false, items: [ { id: '7', title: 'Research & Discovery', description: 'Understanding user needs through interviews, surveys, and market analysis.', status: 'completed', icon: 'check' }, { id: '8', title: 'Design & Prototyping', description: 'Creating wireframes, mockups, and interactive prototypes for validation.', status: 'completed', icon: 'check' }, { id: '9', title: 'Development', description: 'Building features with clean code, automated testing, and continuous integration.', status: 'current', icon: 'rocket' }, { id: '10', title: 'Testing & QA', description: 'Comprehensive testing across devices, browsers, and user scenarios.', status: 'upcoming' }, { id: '11', title: 'Launch & Monitor', description: 'Deploying to production and monitoring performance and user feedback.', status: 'upcoming' } ] }; minimalConfig: TimelineConfig = { title: 'Project Milestones', subtitle: 'Clean and simple timeline presentation', orientation: 'vertical', theme: 'minimal', showDates: true, items: [ { id: '12', title: 'Project Kickoff', description: 'Initial team meeting and project scope definition.', date: 'Week 1', status: 'completed' }, { id: '13', title: 'Requirements Gathering', description: 'Detailed analysis of user requirements and technical specifications.', date: 'Week 2-3', status: 'completed' }, { id: '14', title: 'Architecture Planning', description: 'System design and technology stack selection.', date: 'Week 4', status: 'current' }, { id: '15', title: 'Implementation', description: 'Core development phase with iterative releases.', date: 'Week 5-12', status: 'upcoming' } ] }; connectedConfig: TimelineConfig = { title: 'Feature Evolution', subtitle: 'How our features have evolved over time', orientation: 'vertical', theme: 'connected', showDates: true, items: [ { id: '16', title: 'Basic Dashboard', description: 'Simple dashboard with essential metrics and basic user management.', date: 'v1.0', status: 'completed', icon: 'check' }, { id: '17', title: 'Advanced Analytics', description: 'Added detailed analytics, custom reports, and data visualization tools.', date: 'v1.5', status: 'completed', icon: 'check' }, { id: '18', title: 'Team Collaboration', description: 'Introduced real-time collaboration features, comments, and notification system.', date: 'v2.0', status: 'completed', icon: 'check' }, { id: '19', title: 'AI-Powered Insights', description: 'Implementing machine learning algorithms for predictive analytics and smart recommendations.', date: 'v2.5', status: 'current', icon: 'rocket', badge: 'In Progress' } ] }; roadmapConfig: TimelineConfig = { title: '2024 Product Roadmap', subtitle: 'Exciting features and improvements coming soon', orientation: 'horizontal', theme: 'default', showDates: true, items: [ { id: '20', title: 'Mobile App', description: 'Native iOS and Android applications with offline support.', date: 'Q1 2024', status: 'completed', icon: 'check' }, { id: '21', title: 'API v3', description: 'Complete API overhaul with GraphQL support and improved performance.', date: 'Q2 2024', status: 'current', icon: 'rocket' }, { id: '22', title: 'Enterprise Features', description: 'SSO, advanced permissions, audit logs, and compliance tools.', date: 'Q3 2024', status: 'upcoming', badge: 'Coming Soon' }, { id: '23', title: 'Global Expansion', description: 'Multi-language support, regional data centers, and local partnerships.', date: 'Q4 2024', status: 'upcoming' } ] }; }dY xO import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ListItemComponent } from '../../../../../ui-essentials/src/lib/components/data-display/list/list-item.component'; import { ListContainerComponent } from '../../../../../ui-essentials/src/lib/components/data-display/list/list-container.component'; import { ListItemData } from '../../../../../ui-essentials/src/lib/components/data-display/list/list-item.component'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faInbox, faStar, faPaperPlane, faEdit, faArchive, faTrash, faPhone, faComment, faPlay, faDownload, faCheck, faChevronRight, faPlus, faMinus } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-list-demo', standalone: true, imports: [ CommonModule, ListItemComponent, ListContainerComponent, FontAwesomeModule ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    List Component Showcase

    Basic Lists - Size Variants

    Small (sm)

    @for (item of navigationItems; track item.primary) { }

    Medium (md)

    @for (item of navigationItems; track item.primary) { }

    Large (lg)

    @for (item of navigationItems; track item.primary) { }

    Multi-line Lists

    Two Lines

    @for (item of twoLineItems; track item.primary) { }

    Three Lines

    @for (item of threeLineItems; track item.primary) {
    }

    Lists with Avatars

    Contacts - Avatar + One Line

    @for (item of contactItems; track item.primary) {
    }

    Messages - Avatar + Two Lines

    @for (item of messageItems; track item.primary) { 2h }

    Lists with Media

    Music - Media + Two Lines

    @for (item of musicItems; track item.primary) {
    3:42
    }

    Videos - Media + Three Lines

    @for (item of videoItems; track item.primary) {
    4.8
    }

    Interactive Demo

    Click items to interact with them:

    @for (item of interactiveItems(); track item.primary) {
    @if (item.selected) { Enabled } @else if (item.disabled) { Disabled } @else { Click to enable }
    }

    Usage Examples

    Basic List with Icons:

    <ui-list-container elevation="sm" spacing="xs" [rounded]="true">
  <ui-list-item 
    [data]="{primary: 'Inbox'}"
    size="md"
    lines="one"
    variant="text">
    <fa-icon [icon]="faInbox" slot="trailing"></fa-icon>
  </ui-list-item>
</ui-list-container>

    List with Avatar and Actions:

    <ui-list-container elevation="md" spacing="sm" [rounded]="true">
  <ui-list-item 
    [data]="{
      primary: 'John Doe',
      secondary: 'john@example.com',
      avatarSrc: 'avatar.jpg'
    }"
    size="lg"
    lines="two"
    variant="avatar">
    <button slot="trailing" (click)="call()">
      <fa-icon [icon]="faPhone"></fa-icon>
    </button>
  </ui-list-item>
</ui-list-container>
    @if (lastAction()) {
    Action: {{ lastAction() }}
    }
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; margin-top: 2rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; margin-top: 1rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 12px; padding: 1.5rem; background: hsl(286, 20%, 99%); margin-bottom: 2rem; } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; white-space: pre-wrap; } code { font-family: 'JetBrains Mono', 'Fira Code', 'Monaco', 'Courier New', monospace; color: #d63384; } button { transition: all 0.15s ease; } button:hover { transform: translateY(-1px); } button:active { transform: translateY(0); } fa-icon { transition: color 0.2s ease; } `] }) export class ListDemoComponent { // State signals lastAction = signal(''); // Demo data navigationItems: ListItemData[] = [ { primary: 'Inbox' }, { primary: 'Starred' }, { primary: 'Sent' }, { primary: 'Drafts' }, { primary: 'Archive' }, { primary: 'Trash' } ]; twoLineItems: ListItemData[] = [ { primary: 'Review Design System Updates', secondary: 'Check new component specifications and design tokens' }, { primary: 'Team Standup Meeting', secondary: 'Daily sync with development and design teams' }, { primary: 'Code Review - Authentication', secondary: 'Review pull request #247 for OAuth integration' } ]; threeLineItems: ListItemData[] = [ { primary: 'Angular 19 Migration', secondary: 'Upgrade project to latest Angular version with control flow', tertiary: 'Estimated completion: Next Sprint • Priority: High' }, { primary: 'Design System Documentation', secondary: 'Create comprehensive documentation for all components', tertiary: 'Status: In Progress • Assigned: Design Team' } ]; contactItems: ListItemData[] = [ { primary: 'Sarah Wilson', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=sarah', avatarAlt: 'Sarah Wilson avatar' }, { primary: 'Alex Chen', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=alex', avatarAlt: 'Alex Chen avatar' }, { primary: 'Mike Rodriguez', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=mike', avatarAlt: 'Mike Rodriguez avatar' } ]; messageItems: ListItemData[] = [ { primary: 'John Doe', secondary: 'Hey! How\'s the new component library coming along?', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=john', avatarAlt: 'John Doe avatar' }, { primary: 'Jane Smith', secondary: 'The design tokens look great. Ready for review when you are.', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=jane', avatarAlt: 'Jane Smith avatar' } ]; musicItems: ListItemData[] = [ { primary: 'Bohemian Rhapsody', secondary: 'Queen • A Night at the Opera', mediaSrc: 'https://picsum.photos/80/80?random=1', mediaAlt: 'Album cover' }, { primary: 'Hotel California', secondary: 'Eagles • Hotel California', mediaSrc: 'https://picsum.photos/80/80?random=2', mediaAlt: 'Album cover' } ]; videoItems: ListItemData[] = [ { primary: 'Angular Fundamentals', secondary: 'Complete guide to modern Angular development', tertiary: 'Duration: 2h 30m • Updated: Today • 1.2M views', mediaSrc: 'https://picsum.photos/80/80?random=5', mediaAlt: 'Video thumbnail' } ]; interactiveItems = signal([ { primary: 'Email Notifications', secondary: 'Receive emails about important updates', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=email', selected: false, disabled: false }, { primary: 'SMS Alerts', secondary: 'Get text messages for urgent notifications', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=sms', selected: true, disabled: false }, { primary: 'Marketing Communications', secondary: 'Promotional offers and product updates', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=marketing', selected: false, disabled: true } ]); // Font Awesome icons faInbox = faInbox; faStar = faStar; faPaperPlane = faPaperPlane; faEdit = faEdit; faArchive = faArchive; faTrash = faTrash; faPhone = faPhone; faComment = faComment; faPlay = faPlay; faDownload = faDownload; faCheck = faCheck; faChevronRight = faChevronRight; faPlus = faPlus; faMinus = faMinus; // Helper methods getIconForItem(itemName: string): any { const iconMap: { [key: string]: any } = { 'Inbox': faInbox, 'Starred': faStar, 'Sent': faPaperPlane, 'Drafts': faEdit, 'Archive': faArchive, 'Trash': faTrash }; return iconMap[itemName] || faInbox; } // Event handlers handleAction(action: string, item?: string): void { const message = item ? `${action} action on "${item}" at ${new Date().toLocaleTimeString()}` : `${action} action at ${new Date().toLocaleTimeString()}`; this.lastAction.set(message); console.log(`List action: ${action}`, item); // Clear the message after 3 seconds setTimeout(() => this.lastAction.set(''), 3000); } toggleInteractiveItem(itemName: string): void { this.interactiveItems.update(items => items.map(item => { if (item.primary === itemName && !item.disabled) { return { ...item, selected: !item.selected }; } return item; }) ); this.handleAction('toggle', itemName); } }*x4q< \ >%%yy%: \  hKbI"鞛32ʄx?$import { Component, ViewChild, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ListDetailLayoutComponent } from '../../../../../ui-essentials/src/lib/components/layout/list-detail-layout/list-detail-layout.component'; interface DemoItem { id: number; title: string; subtitle: string; description: string; status: 'active' | 'pending' | 'completed'; category: string; date: string; } @Component({ selector: 'ui-list-detail-layout-demo', standalone: true, imports: [CommonModule, ListDetailLayoutComponent], template: `

    List Detail Layout Demo

    Master-detail pattern with resizable panes and mobile-adaptive behavior

    Size Variants

    @for (size of sizes; track size) {

    {{ size | titlecase }} Size

    Items ({{ size }})

    @for (item of demoItems(); track item.id) {
    {{ item.title }}

    {{ item.subtitle }}

    {{ item.status }}
    }
    @if (selectedItems[size]) {

    {{ selectedItems[size].title }}

    {{ selectedItems[size].category }}

    Subtitle: {{ selectedItems[size].subtitle }}

    Status: {{ selectedItems[size].status }}

    Date: {{ selectedItems[size].date }}

    Description

    {{ selectedItems[size].description }}

    }
    📋

    No Item Selected

    Choose an item from the list to view its details
    }

    Style Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }} Style

    {{ variant | titlecase }} List

    @for (item of demoItems().slice(0, 3); track item.id) {
    {{ item.title }}

    {{ item.subtitle }}

    }
    @if (selectedItems[variant]) {

    {{ selectedItems[variant].title }}

    {{ selectedItems[variant].description }}

    }
    }

    Interactive Features

    Interactive List

    @for (item of demoItems(); track item.id) {
    {{ item.title }}

    {{ item.subtitle }}

    {{ item.status }}
    }
    @if (selectedItems['interactive']) {

    {{ selectedItems['interactive'].title }}

    {{ selectedItems['interactive'].category }}

    {{ selectedItems['interactive'].description }}

    {{ selectedItems['interactive'].status }}
    {{ selectedItems['interactive'].category }}
    {{ selectedItems['interactive'].date }}
    }
    🎯

    Ready to Explore

    Select any item to see the interactive features in action

    Event Log

    @for (event of eventLog(); track $index) {
    {{ event.timestamp }} {{ event.type }} {{ event.data }}
    }
    `, styleUrl: './list-detail-layout-demo.component.scss' }) export class ListDetailLayoutDemoComponent { @ViewChild('interactiveLayout') interactiveLayout?: ListDetailLayoutComponent; sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'bordered', 'elevated'] as const; selectedItems: Record = { sm: null, md: null, lg: null, default: null, bordered: null, elevated: null, interactive: null }; interactiveFeatures = { resizable: true, showEmptyState: true, showMobileNavigation: true, loading: false }; demoItems = signal([ { id: 1, title: 'Project Alpha', subtitle: 'High-priority initiative', description: 'A comprehensive project focused on improving user experience and system performance. This initiative involves multiple teams and requires careful coordination across different departments.', status: 'active', category: 'Development', date: '2024-01-15' }, { id: 2, title: 'Database Migration', subtitle: 'Critical infrastructure update', description: 'Migration of legacy database systems to modern cloud infrastructure. This project includes data validation, performance optimization, and minimal downtime deployment strategies.', status: 'pending', category: 'Infrastructure', date: '2024-02-01' }, { id: 3, title: 'UI Component Library', subtitle: 'Design system implementation', description: 'Development of a comprehensive UI component library to ensure consistency across all applications. Includes documentation, testing, and integration guidelines.', status: 'completed', category: 'Design', date: '2024-01-28' }, { id: 4, title: 'Security Audit', subtitle: 'Annual security review', description: 'Comprehensive security audit covering all systems, applications, and infrastructure. Includes penetration testing, vulnerability assessment, and compliance verification.', status: 'active', category: 'Security', date: '2024-02-10' }, { id: 5, title: 'Mobile App Redesign', subtitle: 'User interface overhaul', description: 'Complete redesign of the mobile application focusing on improved usability, modern design patterns, and enhanced accessibility features.', status: 'pending', category: 'Mobile', date: '2024-03-01' } ]); eventLog = signal>([]); selectItem(context: string, item: DemoItem): void { this.selectedItems[context] = item; this.logEvent('selection', `Selected: ${item.title} (${context})`); } clearSelection(context: string): void { this.selectedItems[context] = null; this.logEvent('selection', `Cleared selection (${context})`); } handleSelectionChange(context: string, item: DemoItem | null): void { this.selectedItems[context] = item; this.logEvent('selectionChanged', item ? `Item selected: ${item.title}` : 'Selection cleared'); } handleMobileNavigation(event: any): void { this.logEvent('mobileNavigation', `Navigated to: ${event.view} (has selection: ${event.hasSelection})`); } handlePanelResize(event: any): void { this.logEvent('panelResize', `List width: ${event.listWidth}px`); } handleAction(action: string, item: DemoItem): void { this.logEvent('action', `${action} action on: ${item.title}`); } toggleFeature(feature: keyof typeof this.interactiveFeatures, event: Event): void { const target = event.target as HTMLInputElement; this.interactiveFeatures[feature] = target.checked; this.logEvent('feature', `${feature}: ${target.checked ? 'enabled' : 'disabled'}`); } private logEvent(type: string, data: string): void { const timestamp = new Date().toLocaleTimeString(); const events = this.eventLog(); events.unshift({ timestamp, type, data }); // Keep only last 10 events if (events.length > 10) { events.splice(10); } this.eventLog.set([...events]); } } x||h%Σ˷5ub}!x .demo-container { max-width: 1200px; margin: 0 auto; padding: 2rem; } .demo-section { margin-bottom: 3rem; h2 { font-size: 1.875rem; color: #1f2937; margin-bottom: 1.5rem; } h3 { font-size: 1.5rem; color: #1f2937; margin-bottom: 1rem; border-bottom: 1px solid #d1d5db; padding-bottom: 0.75rem; } h4 { font-size: 1.25rem; color: #1f2937; margin-bottom: 0.5rem; } h5 { font-size: 1.125rem; color: #1f2937; margin-bottom: 0.25rem; } } .demo-row { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; } .demo-item { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 0.75rem; border: 1px solid #e5e7eb; border-radius: 0.375rem; background: #ffffff; min-width: 120px; p { font-size: 0.875rem; color: #6b7280; margin: 0; text-align: center; text-transform: capitalize; } } .demo-interactive { padding: 1rem; border: 1px solid #d1d5db; border-radius: 0.5rem; background: #f9fafb; .demo-controls { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid #e5e7eb; label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.875rem; color: #1f2937; font-weight: 500; select { padding: 0.25rem 0.5rem; border: 1px solid #d1d5db; border-radius: 0.25rem; background: #ffffff; color: #1f2937; font-size: 0.875rem; &:focus { outline: 2px solid #3b82f6; outline-offset: 2px; border-color: #3b82f6; } } input[type="checkbox"] { margin-right: 0.25rem; } } } .demo-result { display: flex; justify-content: center; align-items: center; min-height: 120px; background: #ffffff; border: 1px dashed #d1d5db; border-radius: 0.375rem; } p { text-align: center; margin-top: 0.5rem; font-size: 0.875rem; color: #6b7280; } } .demo-usage { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; } .usage-example { padding: 0.75rem; border: 1px solid #d1d5db; border-radius: 0.375rem; background: #ffffff; .demo-button { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; background: #6366f1; color: #ffffff; border: none; border-radius: 0.375rem; font-size: 1rem; cursor: pointer; transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); &:hover:not(:disabled) { background: #5855eb; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); } &:disabled { opacity: 0.6; cursor: not-allowed; } &:focus-visible { outline: 2px solid #3b82f6; outline-offset: 2px; } } .page-loading-example, .processing-example { min-height: 150px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0.75rem; padding: 0.75rem; border: 1px solid #e5e7eb; border-radius: 0.25rem; background: #f9fafb; .page-content, .process-result { text-align: center; p { margin: 0.5rem 0; color: #6b7280; } button { padding: 0.25rem 0.5rem; background: #64748b; color: #ffffff; border: none; border-radius: 0.25rem; font-size: 0.875rem; cursor: pointer; transition: background 150ms cubic-bezier(0.4, 0, 0.2, 1); &:hover { background: #475569; } &:focus-visible { outline: 2px solid #3b82f6; outline-offset: 2px; } } } } } // Responsive breakpoints @media (max-width: 768px) { .demo-container { padding: 1rem; } .demo-row { gap: 0.75rem; } .demo-item { min-width: 100px; padding: 0.5rem; } .demo-interactive .demo-controls { flex-direction: column; align-items: flex-start; label { width: 100%; select { width: 100%; } } } .demo-usage { grid-template-columns: 1fr; } }̱x"import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { LoadingSpinnerComponent } from '../../../../../ui-essentials/src/lib/components/feedback/loading-spinner'; @Component({ selector: 'ui-loading-spinner-demo', standalone: true, imports: [CommonModule, FormsModule, LoadingSpinnerComponent], template: `

    Loading Spinner Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size }}

    }

    Types

    @for (type of types; track type) {

    {{ type }}

    }

    Colors

    @for (variant of variants; track variant) {

    {{ variant }}

    }

    Speeds

    @for (speed of speeds; track speed) {

    {{ speed }}

    }

    With Labels

    With Label

    Processing

    Uploading

    States

    Normal

    Disabled

    Interactive

    @if (clickCount > 0) {

    Spinner clicked: {{ clickCount }} times

    }

    Common Usage Examples

    Loading Button

    Page Loading

    @if (pageLoading) { } @else {
    Page Content

    This is the loaded content.

    }

    Data Processing

    @if (processing) { } @else {

    ✅ Data processed successfully!

    }
    `, styleUrl: './loading-spinner-demo.component.scss' }) export class LoadingSpinnerDemoComponent { sizes = ['sm', 'md', 'lg'] as const; types = ['spin', 'dots', 'pulse', 'bars'] as const; variants = ['primary', 'secondary', 'accent', 'success', 'warning', 'danger', 'info'] as const; speeds = ['slow', 'normal', 'fast'] as const; // Interactive demo state selectedSize = 'md' as const; selectedType = 'spin' as const; selectedVariant = 'primary' as const; selectedSpeed = 'normal' as const; showInteractiveLabel = false; isDisabled = false; interactiveLabel = 'Loading'; clickCount = 0; // Usage examples state isLoading = false; pageLoading = false; processing = false; handleSpinnerClick(event: MouseEvent): void { if (!this.isDisabled) { this.clickCount++; console.log('Spinner clicked', event); } } simulateLoading(): void { this.isLoading = true; setTimeout(() => { this.isLoading = false; }, 2000); } simulatePageLoad(): void { this.pageLoading = true; setTimeout(() => { this.pageLoading = false; }, 3000); } simulateProcessing(): void { this.processing = true; setTimeout(() => { this.processing = false; }, 2500); } }pq~xu&LԼĜ⍿)G "x'.demo-container { .demo-section { margin-bottom: 2rem; h3 { margin-bottom: 1rem; color: #333; } .demo-row { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); .demo-item { &.full-width { grid-column: 1 / -1; } h4 { margin-bottom: 0.5rem; color: #555; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.5px; } } } } }@FVx)(import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { MasonryComponent } from 'ui-essentials'; @Component({ selector: 'ui-masonry-demo', standalone: true, imports: [CommonModule, MasonryComponent], template: `

    Masonry Layout Demo

    Pinterest-style dynamic grid layout that arranges items in columns with optimal vertical spacing.

    Column Count

    @for (columns of columnCounts; track columns) {

    {{ columns }} Columns

    @for (item of sampleItems.slice(0, 8); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }
    }

    Auto Responsive

    Auto Fit (250px min width)

    @for (item of sampleItems.slice(0, 12); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }

    Auto Fill (200px min width)

    @for (item of sampleItems.slice(0, 12); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }

    Gap Sizes

    @for (gap of gaps; track gap) {

    Gap: {{ gap }}

    @for (item of sampleItems.slice(0, 6); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }
    }

    Padding Options

    @for (padding of paddings; track padding) {

    Padding: {{ padding }}

    @for (item of sampleItems.slice(0, 6); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }
    }

    Alignment

    @for (alignment of alignments; track alignment) {

    Align: {{ alignment }}

    @for (item of sampleItems.slice(0, 4); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }
    }

    Item Variants

    Mixed Item Sizes

    Compact Item

    Compact padding for dense layouts

    Comfortable Item

    Standard comfortable padding for most use cases

    Spacious Item

    Extra padding for premium content

    Full Bleed Item

    No padding for full-width content

    @for (item of sampleItems.slice(0, 6); track item.id) {
    {{ item.title }}

    {{ item.content }}

    }

    Pinterest-style Gallery

    @for (item of extendedItems; track item.id) {
    {{ item.title }}

    {{ item.content }}

    }
    `, styleUrl: './masonry-demo.component.scss' }) export class MasonryDemoComponent { columnCounts = [2, 3, 4] as const; gaps = ['sm', 'md', 'lg'] as const; paddings = ['none', 'sm', 'md', 'lg'] as const; alignments = ['start', 'center', 'end'] as const; sampleItems = [ { id: 1, title: 'Card 1', content: 'Short content', height: 120 }, { id: 2, title: 'Card 2', content: 'Medium length content with more details', height: 180 }, { id: 3, title: 'Card 3', content: 'Brief', height: 100 }, { id: 4, title: 'Card 4', content: 'Longer content with multiple lines of text to demonstrate variable heights', height: 220 }, { id: 5, title: 'Card 5', content: 'Standard content', height: 140 }, { id: 6, title: 'Card 6', content: 'Extended content with even more text to show how masonry handles varying content lengths', height: 260 }, { id: 7, title: 'Card 7', content: 'Compact', height: 90 }, { id: 8, title: 'Card 8', content: 'Regular content block', height: 160 }, { id: 9, title: 'Card 9', content: 'Another piece of content', height: 130 }, { id: 10, title: 'Card 10', content: 'Different sized content', height: 200 }, { id: 11, title: 'Card 11', content: 'Small content', height: 110 }, { id: 12, title: 'Card 12', content: 'Large content with lots of text and information', height: 240 } ]; extendedItems = [ { id: 1, title: 'Ocean Waves', content: 'Beautiful ocean scenery with crashing waves', height: 180, background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' }, { id: 2, title: 'Mountain Vista', content: 'Majestic mountain range at sunset', height: 220, background: 'linear-gradient(135deg, #f093fb 0%, #f5576c 100%)' }, { id: 3, title: 'Forest Path', content: 'Winding path through dense forest', height: 160, background: 'linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)' }, { id: 4, title: 'Desert Dunes', content: 'Golden sand dunes stretching to horizon', height: 200, background: 'linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)' }, { id: 5, title: 'City Skyline', content: 'Modern city with glowing lights', height: 140, background: 'linear-gradient(135deg, #fa709a 0%, #fee140 100%)' }, { id: 6, title: 'Northern Lights', content: 'Aurora borealis dancing across night sky', height: 250, background: 'linear-gradient(135deg, #a8edea 0%, #fed6e3 100%)' }, { id: 7, title: 'Tropical Beach', content: 'Palm trees and crystal clear water', height: 180, background: 'linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%)' }, { id: 8, title: 'Snow Peaks', content: 'Snow-capped mountain peaks', height: 190, background: 'linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 100%)' }, { id: 9, title: 'Autumn Leaves', content: 'Colorful fall foliage', height: 170, background: 'linear-gradient(135deg, #fad0c4 0%, #fad0c4 1%, #ffd1ff 100%)' }, { id: 10, title: 'Starry Night', content: 'Countless stars in clear night sky', height: 210, background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' }, { id: 11, title: 'Wildflowers', content: 'Field of colorful wildflowers', height: 150, background: 'linear-gradient(135deg, #ff9a9e 0%, #fecfef 50%, #fecfef 100%)' }, { id: 12, title: 'Waterfall', content: 'Powerful waterfall cascading down rocks', height: 230, background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' } ]; }䬸xW@use "../../../../../ui-design-system/src/styles/tokens" as *; // Tokens available globally via main application styles // ========================================================================== // MENU DEMO COMPONENT // ========================================================================== // Demonstration component showcasing all menu variants and capabilities // ========================================================================== .menu-demo { padding: $semantic-spacing-component-xl; max-width: 1400px; margin: 0 auto; h2 { font-size: 2rem; font-weight: 600; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-layout-lg; text-align: center; border-bottom: 2px solid $semantic-color-interactive-primary; padding-bottom: $semantic-spacing-component-sm; } } .demo-section { margin-bottom: $semantic-spacing-layout-xl; border: 1px solid $semantic-color-border-secondary; border-radius: $semantic-border-radius-lg; padding: $semantic-spacing-component-xl; background: $semantic-color-surface-elevated; h3 { font-size: 1.5rem; font-weight: 500; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-xl; padding-bottom: $semantic-spacing-component-sm; border-bottom: 2px solid $semantic-color-border-secondary; } } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: $semantic-spacing-component-xl; margin-bottom: $semantic-spacing-layout-md; } .demo-item { h4 { font-size: 1rem; font-weight: 500; color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-md; text-align: center; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; background-color: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-sm; } } .demo-single { max-width: 800px; margin: 0 auto; h4 { font-size: 1rem; font-weight: 500; color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-md; text-align: center; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; background-color: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-sm; } } // ========================================================================== // USAGE EXAMPLES SECTION // ========================================================================== .usage-examples { background: $semantic-color-surface-secondary; padding: $semantic-spacing-component-xl; border-radius: $semantic-border-radius-md; border-left: 4px solid $semantic-color-interactive-primary; h4 { font-size: 1rem; font-weight: 600; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-sm; margin-top: $semantic-spacing-component-lg; text-align: left; padding: 0; background: none; &:first-child { margin-top: 0; } } pre { background: $semantic-color-surface-primary; padding: $semantic-spacing-component-md; border-radius: $semantic-border-radius-sm; overflow-x: auto; margin: $semantic-spacing-component-sm 0 $semantic-spacing-component-lg 0; border: 1px solid $semantic-color-border-secondary; } code { font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace; font-size: 0.875rem; line-height: 1.5; color: $semantic-color-text-primary; } } // ========================================================================== // INTERACTIVE DEMO SECTION // ========================================================================== .interactive-demo { display: flex; flex-direction: column; align-items: center; gap: $semantic-spacing-component-lg; } .demo-feedback { padding: $semantic-spacing-component-md; background: $semantic-color-container-primary; color: $semantic-color-on-container-primary; border-radius: $semantic-border-radius-md; border: 1px solid $semantic-color-border-secondary; text-align: center; strong { font-weight: 600; } } // ========================================================================== // RESPONSIVE DESIGN // ========================================================================== @media (max-width: 768px) { .menu-demo { padding: $semantic-spacing-component-lg; h2 { font-size: 1.5rem; } } .demo-grid { grid-template-columns: 1fr; gap: $semantic-spacing-component-lg; } .demo-section { padding: $semantic-spacing-component-lg; h3 { font-size: 1.25rem; } } .usage-examples { padding: $semantic-spacing-component-lg; pre { font-size: 0.75rem; } } } @media (max-width: 480px) { .menu-demo { padding: $semantic-spacing-component-md; } .demo-section { padding: $semantic-spacing-component-md; } .demo-grid { gap: $semantic-spacing-component-md; } } // ========================================================================== // ACCESSIBILITY ENHANCEMENTS // ========================================================================== // Focus indicators for better keyboard navigation .menu-demo { .demo-section:focus-within { outline: 2px solid $semantic-color-border-focus; outline-offset: 4px; border-radius: $semantic-border-radius-md; } } // High contrast mode support @media (prefers-contrast: high) { .demo-section { border: 2px solid $semantic-color-border-primary; } .demo-feedback { border: 2px solid $semantic-color-border-primary; } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .menu-demo * { transition: none; animation: none; } }nC6x[Pw(gqFbQjniFf1MCh xy-(semantic/index0B2R LIST EXAMPLES΃listUk list-examples*2$ } } .exampleF;? exampleOexample-item { .o%^X%} } .example-single { max-width: 60TTRAILING SLOT COMPONENTSq Q4action-button { background: none; border: none; tertiary; cursor: pointer*s- +1transition: all 0.15s ease-in-out; &:hover {/ interactiveQ"^ } &:focusL2px; } i /4px; } } .timestamp { font-size: 0.75rem; etertiary; font-weight: 400; } .play-button { width: 32px; height: 32px; border-radius: 50%; $  Don-brand-primary; border: none; cursor: pointer; display: flexjustify-content: center; transition: all 0.15s ease-in-out; &:hover { transform: scale(1.05); box-shadow: $seman(tic-shadow-elevation-1; } &:focusL2px; } i ^2px; margin-left: 2px; // Optical alignment for play icon } } .rating { display: flex2 micro-tight;  warning; ] b i 4px; } } .select-button { $   on-brand-primary; border: none*$1 '_ bDcursor: pointer; transition: all 0.15s ease-in-out; &:hover {''interactive-secondary; } &:focusL2px; } } .text-success { success;/listLBF.examplex[example-section { Q*md 4"listL5example-grid {&dlist-examples { button:focus, .action-button:focus, .play-button:focus, .select-button:focusL2px; / )@@4action-button, .play-button, .select-button { + W/action-button, .play-button, .select-buttonn6} .play-button:hover { transform: none; } }n x'd؛import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { faUser, faHome, faCog, faEnvelope, faDownload, faShare, faFileExport, faChartBar, faChartLine, faFileAlt, faShieldAlt, faDatabase, faTrash, faStar, faBolt, faInfoCircle, faExclamationTriangle, faFolder, faCirclePlus, faFolderOpen, faEdit, faSave, faTachometerAlt, faProjectDiagram, faPlayCircle, faCheckCircle, faArchive, faCalendarWeek, faCalendarAlt, faCalendar, faSlidersH, faPalette, faBell, faQuestionCircle, faSignOutAlt, faBox, faConciergeBell, faCircle, faRefresh, faToggleOn } from '@fortawesome/free-solid-svg-icons'; import { faAngular, faGithub } from '@fortawesome/free-brands-svg-icons'; import { MenuItemComponent } from '../../../../../ui-essentials/src/lib/components/navigation/menu/menu-item.component'; import { MenuContainerComponent } from '../../../../../ui-essentials/src/lib/components/navigation/menu/menu-container.component'; import { MenuSubmenuComponent } from '../../../../../ui-essentials/src/lib/components/navigation/menu/menu-submenu.component'; import { MenuItemData } from '../../../../../ui-essentials/src/lib/components/navigation/menu/menu-item.component'; @Component({ selector: 'ui-menu-demo', standalone: true, imports: [ CommonModule, MenuItemComponent, MenuContainerComponent, MenuSubmenuComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Menu Component Showcase

    Basic Menu Items

    Text Only - Different Sizes

    Menu States

    Icons and Variants

    Left Icons

    Right Icons

    Circular Icons

    Circle Icons - Left

    Circle Icons - Right

    Menu Variants

    Color Variants

    With Dividers

    Collapsible Submenus

    Navigation Menu

    User Menu

    Horizontal Menu

    Navigation Bar Style

    Layout Options

    Dense Menu

    Scrollable Menu

    @for (item of scrollableItems; track item.id) { }

    Menu with Links

    External Links

    Usage Examples

    Basic Menu Item:

    {{ '<' }}ui-menu-item 
  [data]="{{ '{' }} label: 'Menu Item', icon: faHome {{ '}' }}"
  iconPosition="left"
  variant="primary"
  (itemClick)="handleClick($event)"{{ '>' }}
{{ '<' }}/ui-menu-item{{ '>' }}

    Menu with Submenu:

    {{ '<' }}ui-menu-submenu 
  [parentItem]="{{ '{' }} label: 'Parent', hasSubmenu: true {{ '}' }}"
  [isOpen]="submenuOpen"
  (submenuToggled)="toggleSubmenu($event)"{{ '>' }}
  
  {{ '<' }}ui-menu-item [data]="childItem1"{{ '>' }}{{ '<' }}/ui-menu-item{{ '>' }}
  {{ '<' }}ui-menu-item [data]="childItem2"{{ '>' }}{{ '<' }}/ui-menu-item{{ '>' }}
{{ '<' }}/ui-menu-submenu{{ '>' }}

    Menu Container:

    {{ '<' }}ui-menu-container 
  elevation="md"
  spacing="sm"
  [rounded]="true"
  [scrollable]="true"
  maxHeight="300px"{{ '>' }}
  
  {{ '<' }}!-- Menu items here --{{ '>' }}
{{ '<' }}/ui-menu-container{{ '>' }}

    Interactive Actions

    @if (lastClickedItem) {
    Last clicked: {{ lastClickedItem }}
    }
    `, styleUrls: ['./menu-demo.component.scss'] }) export class MenuDemoComponent { // FontAwesome icons faUser = faUser; faHome = faHome; faCog = faCog; faEnvelope = faEnvelope; faDownload = faDownload; faShare = faShare; faFileExport = faFileExport; faChartBar = faChartBar; faChartLine = faChartLine; faFileAlt = faFileAlt; faShieldAlt = faShieldAlt; faDatabase = faDatabase; faTrash = faTrash; faStar = faStar; faBolt = faBolt; faInfoCircle = faInfoCircle; faExclamationTriangle = faExclamationTriangle; faFolder = faFolder; faCirclePlus = faCirclePlus; faFolderOpen = faFolderOpen; faEdit = faEdit; faSave = faSave; faTachometerAlt = faTachometerAlt; faProjectDiagram = faProjectDiagram; faPlayCircle = faPlayCircle; faCheckCircle = faCheckCircle; faArchive = faArchive; faCalendarWeek = faCalendarWeek; faCalendarAlt = faCalendarAlt; faCalendar = faCalendar; faSlidersH = faSlidersH; faPalette = faPalette; faBell = faBell; faQuestionCircle = faQuestionCircle; faSignOutAlt = faSignOutAlt; faBox = faBox; faConciergeBell = faConciergeBell; faCircle = faCircle; faRefresh = faRefresh; faToggleOn = faToggleOn; faAngular = faAngular; faGithub = faGithub; lastClickedItem: string = ''; submenuStates: Record = { projects: false, reports: false, preferences: false }; scrollableItems: MenuItemData[] = Array.from({ length: 15 }, (_, i) => ({ id: `item-${i + 1}`, label: `Scrollable Item ${i + 1}`, icon: this.faCircle })); handleMenuClick(action: string, item: MenuItemData): void { this.lastClickedItem = `${action} (${item.label})`; console.log(`Menu clicked: ${action}`, item); } toggleSubmenu(key: string, event: { item: MenuItemData; isOpen: boolean }): void { this.submenuStates[key] = event.isOpen; console.log(`Submenu ${key} ${event.isOpen ? 'opened' : 'closed'}`); } showAlert(message: string): void { alert(message); this.lastClickedItem = 'Alert shown'; } toggleDemoState(): void { // Toggle all submenus Object.keys(this.submenuStates).forEach(key => { this.submenuStates[key] = !this.submenuStates[key]; }); this.lastClickedItem = 'Demo state toggled'; } resetDemo(): void { this.lastClickedItem = ''; this.submenuStates = { projects: false, reports: false, preferences: false }; console.log('Demo reset'); } }Y'b5x[~Q u|SJJ3Rs RJ I`i YWx p@use '../../../../../shared-ui/src/styles/semantic/index' as *; .demo-container { padding: $semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: $semantic-spacing-layout-xl; h2 { color: $semantic-color-on-surface; font-size: $semantic-typography-heading-h2-size; margin-bottom: $semantic-spacing-content-heading; border-bottom: 1px solid $semantic-color-outline; padding-bottom: $semantic-spacing-content-line-normal; } h3 { color: $semantic-color-on-surface; font-size: $semantic-typography-heading-h4-size; margin-bottom: $semantic-spacing-component-lg; } } .demo-row { display: flex; flex-wrap: wrap; gap: $semantic-spacing-component-sm; align-items: flex-start; @media (max-width: 768px) { flex-direction: column; align-items: stretch; } } .config-panel { background: $semantic-color-surface-variant; border: 1px solid $semantic-color-outline; border-radius: $semantic-border-radius-md; padding: $semantic-spacing-component-lg; margin-top: $semantic-spacing-component-lg; } .config-row { display: flex; align-items: center; gap: $semantic-spacing-component-md; margin-bottom: $semantic-spacing-component-md; flex-wrap: wrap; &:last-child { margin-bottom: 0; margin-top: $semantic-spacing-component-lg; justify-content: flex-start; } label { font-size: $semantic-typography-font-size-sm; color: $semantic-color-on-surface; display: flex; align-items: center; gap: $semantic-spacing-component-xs; white-space: nowrap; &:first-child { min-width: 80px; font-weight: $semantic-typography-font-weight-medium; } } select { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; border: 1px solid $semantic-color-outline; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-on-surface; font-size: $semantic-typography-font-size-sm; min-width: 120px; &:focus { outline: 2px solid $semantic-color-primary; outline-offset: 2px; border-color: $semantic-color-primary; } } input[type="checkbox"] { accent-color: $semantic-color-primary; transform: scale(1.1); } @media (max-width: 768px) { flex-direction: column; align-items: flex-start; label:first-child { min-width: auto; } } } .event-log { background: $semantic-color-surface-primary; border: 1px solid $semantic-color-outline; border-radius: $semantic-border-radius-md; padding: $semantic-spacing-component-md; max-height: 300px; overflow-y: auto; margin-bottom: $semantic-spacing-component-md; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: $semantic-typography-font-size-sm; } .event-item { padding: $semantic-spacing-component-xs 0; border-bottom: 1px solid $semantic-color-outline-variant; color: $semantic-color-on-surface-variant; &:last-child { border-bottom: none; } &:first-child { color: $semantic-color-on-surface; font-weight: $semantic-typography-font-weight-medium; } }U*봰x@use '../../../../../ui-design-system/src/styles/semantic/index' as tokens; .demo-container { padding: tokens.$semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; h2 { font-size: tokens.$semantic-typography-heading-h2-size; color: tokens.$semantic-color-text-primary; margin-bottom: tokens.$semantic-spacing-content-heading; border-bottom: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-subtle; padding-bottom: tokens.$semantic-spacing-content-paragraph; } h3 { font-size: tokens.$semantic-typography-heading-h3-size; color: tokens.$semantic-color-text-primary; margin-bottom: tokens.$semantic-spacing-content-paragraph; } } .demo-section { margin-bottom: tokens.$semantic-spacing-layout-lg; &:last-child { margin-bottom: 0; } } .demo-row { display: flex; flex-wrap: wrap; gap: tokens.$semantic-spacing-component-sm; margin-bottom: tokens.$semantic-spacing-content-paragraph; } .demo-button { display: inline-flex; align-items: center; justify-content: center; min-height: tokens.$semantic-sizing-button-height-md; padding: tokens.$semantic-spacing-component-sm tokens.$semantic-spacing-component-md; // Visual design background: tokens.$semantic-color-primary; color: tokens.$semantic-color-on-primary; border: none; border-radius: tokens.$semantic-border-radius-md; box-shadow: tokens.$semantic-shadow-button-rest; // Typography font-size: tokens.$semantic-typography-font-size-md; font-weight: tokens.$semantic-typography-font-weight-medium; text-decoration: none; white-space: nowrap; // Transitions transition: background-color tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease, box-shadow tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease, transform tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease; // Cursor cursor: pointer; user-select: none; // Interactive states &:hover { background: tokens.$semantic-color-primary-hover; box-shadow: tokens.$semantic-shadow-button-hover; transform: translateY(-1px); } &:focus-visible { outline: 2px solid tokens.$semantic-color-focus; outline-offset: 2px; } &:active { background: tokens.$semantic-color-primary-pressed; box-shadow: tokens.$semantic-shadow-button-active; transform: translateY(0); } &:disabled { background: tokens.$semantic-color-surface-disabled; color: tokens.$semantic-color-text-disabled; box-shadow: none; cursor: not-allowed; transform: none; } } .demo-stats { display: flex; flex-direction: column; gap: tokens.$semantic-spacing-component-xs; p { font-size: tokens.$semantic-typography-font-size-md; color: tokens.$semantic-color-text-secondary; margin: 0; &:before { content: "📊 "; margin-right: tokens.$semantic-spacing-component-xs; } } } .overlay-content { padding: tokens.$semantic-spacing-component-lg; text-align: center; h3 { font-size: tokens.$semantic-typography-heading-h3-size; color: tokens.$semantic-color-text-primary; margin: 0 0 tokens.$semantic-spacing-content-paragraph 0; } p { font-size: tokens.$semantic-typography-font-size-md; color: tokens.$semantic-color-text-secondary; margin: 0 0 tokens.$semantic-spacing-content-heading 0; line-height: 1.5; } button { display: inline-flex; align-items: center; justify-content: center; min-height: tokens.$semantic-sizing-button-height-md; padding: tokens.$semantic-spacing-component-sm tokens.$semantic-spacing-component-lg; // Visual design background: tokens.$semantic-color-secondary; color: tokens.$semantic-color-on-secondary; border: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-primary; border-radius: tokens.$semantic-border-radius-md; box-shadow: tokens.$semantic-shadow-button-rest; // Typography font-size: tokens.$semantic-typography-font-size-md; font-weight: tokens.$semantic-typography-font-weight-medium; // Transitions transition: background-color tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease, border-color tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease, box-shadow tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease, transform tokens.$semantic-motion-duration-fast tokens.$semantic-motion-easing-ease; cursor: pointer; &:hover { background: tokens.$semantic-color-secondary-hover; border-color: tokens.$semantic-color-border-primary; box-shadow: tokens.$semantic-shadow-button-hover; transform: translateY(-1px); } &:focus-visible { outline: 2px solid tokens.$semantic-color-focus; outline-offset: 2px; } &:active { background: tokens.$semantic-color-secondary-pressed; box-shadow: tokens.$semantic-shadow-button-active; transform: translateY(0); } } } .focus-trap-demo { display: flex; flex-direction: column; gap: tokens.$semantic-spacing-component-sm; align-items: center; button, input { min-height: tokens.$semantic-sizing-input-height-md; padding: tokens.$semantic-spacing-component-sm tokens.$semantic-spacing-component-md; border: tokens.$semantic-border-width-1 solid tokens.$semantic-color-border-primary; border-radius: tokens.$semantic-border-radius-md; font-size: tokens.$semantic-typography-font-size-md; &:focus-visible { outline: 2px solid tokens.$semantic-color-focus; outline-offset: 2px; } } input { background: tokens.$semantic-color-surface-secondary; color: tokens.$semantic-color-text-primary; &::placeholder { color: tokens.$semantic-color-text-tertiary; } } button { background: tokens.$semantic-color-tertiary; color: tokens.$semantic-color-on-tertiary; cursor: pointer; &:hover { background: tokens.$semantic-color-secondary-hover; } &:last-child { background: tokens.$semantic-color-danger; color: tokens.$semantic-color-on-danger; &:hover { background: tokens.$semantic-color-primary-hover; } } } } // Responsive Design @media (max-width: #{tokens.$semantic-breakpoint-md - 1px}) { .demo-container { padding: tokens.$semantic-spacing-layout-sm; } .demo-row { flex-direction: column; align-items: stretch; } .demo-button { width: 100%; } } @media (max-width: #{tokens.$semantic-breakpoint-sm - 1px}) { .overlay-content { padding: tokens.$semantic-spacing-component-md; } .focus-trap-demo { button, input { width: 100%; } } }xk1k:A8#(5E4s})Sx0import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { OverlayContainerComponent } from '../../../../../ui-essentials/src/lib/components/overlays/overlay-container/overlay-container.component'; @Component({ selector: 'ui-overlay-container-demo', standalone: true, imports: [CommonModule, OverlayContainerComponent], template: `

    Overlay Container Demo

    Positions

    @for (position of positions; track position) { }

    Sizes

    @for (size of sizes; track size) { }

    Variants

    @for (variant of variants; track variant) { }

    Features

    Offset Positioning

    Stats

    Overlays shown: {{ overlayCount }}

    Backdrop clicks: {{ backdropClickCount }}

    ESC key presses: {{ escapeCount }}

    {{ currentOverlay.title }}

    {{ currentOverlay.description }}

    @if (currentOverlay.focusTrap) {
    } @else { }
    `, styleUrl: './overlay-container-demo.component.scss' }) export class OverlayContainerDemoComponent { positions = ['center', 'top', 'bottom', 'left', 'right', 'top-left', 'top-right', 'bottom-left', 'bottom-right'] as const; sizes = ['auto', 'sm', 'md', 'lg', 'xl', 'fullscreen'] as const; variants = ['default', 'elevated', 'floating', 'modal', 'popover'] as const; // Stats overlayCount = 0; backdropClickCount = 0; escapeCount = 0; // Current overlay state currentOverlay = { visible: false, position: 'center' as typeof this.positions[number], size: 'auto' as typeof this.sizes[number], variant: 'default' as typeof this.variants[number], showBackdrop: true, backdropBlur: false, focusTrap: false, escapeClosable: true, offsetX: 0, offsetY: 0, title: 'Overlay Title', description: 'This is an overlay container demonstration.' }; showOverlay(position: typeof this.positions[number], size: typeof this.sizes[number], variant: typeof this.variants[number]): void { this.currentOverlay = { ...this.currentOverlay, visible: true, position, size, variant, showBackdrop: true, backdropBlur: false, focusTrap: false, escapeClosable: true, offsetX: 0, offsetY: 0, title: `${variant} Overlay`, description: `Position: ${position}, Size: ${size}, Variant: ${variant}` }; this.overlayCount++; } showFeatureOverlay(feature: string): void { let config = { visible: true, position: 'center' as const, size: 'md' as const, variant: 'default' as const, showBackdrop: true, backdropBlur: false, focusTrap: false, escapeClosable: true, offsetX: 0, offsetY: 0, title: 'Feature Demo', description: 'Demonstrating overlay features.' }; switch (feature) { case 'no-backdrop': config.showBackdrop = false; config.title = 'No Backdrop'; config.description = 'This overlay has no backdrop.'; break; case 'backdrop-blur': config.backdropBlur = true; config.title = 'Backdrop Blur'; config.description = 'This overlay has a blurred backdrop effect.'; break; case 'focus-trap': config.focusTrap = true; config.title = 'Focus Trap'; config.description = 'Try pressing Tab - focus is trapped within this overlay.'; break; case 'no-escape': config.escapeClosable = false; config.title = 'No ESC Close'; config.description = 'ESC key will not close this overlay.'; break; } this.currentOverlay = { ...this.currentOverlay, ...config }; this.overlayCount++; } showOffsetOverlay(): void { this.currentOverlay = { ...this.currentOverlay, visible: true, position: 'top-right', size: 'sm', variant: 'floating', showBackdrop: false, backdropBlur: false, focusTrap: false, escapeClosable: true, offsetX: -20, offsetY: 20, title: 'Offset Overlay', description: 'This overlay is positioned with X and Y offsets.' }; this.overlayCount++; } closeOverlay(): void { this.currentOverlay.visible = false; } handleVisibilityChange(visible: boolean): void { this.currentOverlay.visible = visible; } handleBackdropClick(): void { this.backdropClickCount++; console.log('Backdrop clicked'); } handleEscapePress(): void { this.escapeCount++; console.log('ESC key pressed'); } }:LxAzimport { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { PaginationComponent } from '../../../../../ui-essentials/src/lib/components/navigation/pagination/pagination.component'; @Component({ selector: 'ui-pagination-demo', standalone: true, imports: [CommonModule, PaginationComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Pagination Component Showcase

    Sizes

    Small

    Medium (Default)

    Large

    Alignment

    Left Aligned

    Center Aligned (Default)

    Right Aligned

    With Page Information

    Basic Page Info

    With Items Count

    Without Info

    Compact Style

    Compact Pagination

    Compact with Labels

    Different Page Counts

    Few Pages (5 total)

    Many Pages (50 total)

    Limited Visible Pages (maxVisible=5)

    Labels and States

    With Navigation Labels

    Custom ARIA Labels

    Disabled State

    Interactive Pagination

    Controlled Pagination

    @if (lastPageChange) {
    Last page change: {{ lastPageChange }}
    }

    Usage Examples

    Basic Pagination:

    <ui-pagination
  [currentPage]="currentPage"
  [totalPages]="totalPages"
  (pageChange)="onPageChange($event)">
</ui-pagination>

    With Item Information:

    <ui-pagination
  [currentPage]="currentPage"
  [totalPages]="totalPages"
  [totalItems]="totalItems"
  [itemsPerPage]="itemsPerPage"
  [showInfo]="true"
  (pageChange)="onPageChange($event)">
</ui-pagination>

    Compact with Labels:

    <ui-pagination
  [currentPage]="currentPage"
  [totalPages]="totalPages"
  [compact]="true"
  [showLabels]="true"
  size="sm"
  alignment="left"
  previousLabel="Back"
  nextLabel="Forward"
  (pageChange)="onPageChange($event)">
</ui-pagination>

    Customized Pagination:

    <ui-pagination
  [currentPage]="currentPage"
  [totalPages]="totalPages"
  [maxVisible]="5"
  size="lg"
  alignment="center"
  ariaLabel="Search results pagination"
  [showInfo]="true"
  (pageChange)="handlePageChange($event)">
</ui-pagination>

    Edge Cases

    Single Page

    Two Pages

    Large Dataset (1000+ pages)

    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } button:hover { background: #f0f0f0 !important; } button:active { background: #e0e0e0 !important; } `] }) export class PaginationDemoComponent { // Size variants currentPageSmall = signal(2); currentPageMedium = signal(3); currentPageLarge = signal(4); // Alignment variants currentPageLeft = signal(1); currentPageCenter = signal(5); currentPageRight = signal(8); // Info variants currentPageInfo = signal(3); currentPageItems = signal(2); currentPageNoInfo = signal(6); // Compact variants currentPageCompact = signal(4); currentPageCompactLabels = signal(2); // Different counts currentPageFew = signal(3); currentPageMany = signal(25); currentPageLimited = signal(15); // Labels and states currentPageLabels = signal(1); currentPageAria = signal(1); currentPageDisabled = signal(5); // Interactive currentPageInteractive = signal(1); totalPagesInteractive = signal(20); totalItemsInteractive = signal(387); // Edge cases currentPageTwo = signal(1); currentPageLargeDataset = signal(234); // Constants for edge cases totalPagesOne = signal(1); currentPageOne = signal(1); totalPagesTwo = signal(2); totalPagesLargeDataset = signal(1247); // Demo data totalPagesDemo = signal(12); totalPagesFew = signal(5); totalPagesMany = signal(50); totalItemsDemo = 234; itemsPerPageDemo = 20; totalPagesItems = signal(Math.ceil(this.totalItemsDemo / this.itemsPerPageDemo)); // Interactive state lastPageChange: string = ''; onPageChange(event: any, type: string): void { this.lastPageChange = `${type}: Page ${event.previousPage} → ${event.page}`; console.log(`Page changed in ${type}:`, event); // Update the appropriate signal based on type switch (type) { case 'small': this.currentPageSmall.set(event.page); break; case 'medium': this.currentPageMedium.set(event.page); break; case 'large': this.currentPageLarge.set(event.page); break; case 'left': this.currentPageLeft.set(event.page); break; case 'center': this.currentPageCenter.set(event.page); break; case 'right': this.currentPageRight.set(event.page); break; case 'info': this.currentPageInfo.set(event.page); break; case 'items': this.currentPageItems.set(event.page); break; case 'no-info': this.currentPageNoInfo.set(event.page); break; case 'compact': this.currentPageCompact.set(event.page); break; case 'compact-labels': this.currentPageCompactLabels.set(event.page); break; case 'few': this.currentPageFew.set(event.page); break; case 'many': this.currentPageMany.set(event.page); break; case 'limited': this.currentPageLimited.set(event.page); break; case 'labels': this.currentPageLabels.set(event.page); break; case 'aria': this.currentPageAria.set(event.page); break; case 'two': this.currentPageTwo.set(event.page); break; case 'large-dataset': this.currentPageLargeDataset.set(event.page); break; } } onInteractivePageChange(event: any): void { this.currentPageInteractive.set(event.page); this.lastPageChange = `Interactive: Page ${event.previousPage} → ${event.page}`; } // Interactive controls goToFirstPage(): void { this.currentPageInteractive.set(1); this.lastPageChange = 'Programmatically navigated to first page'; } goToLastPage(): void { this.currentPageInteractive.set(this.totalPagesInteractive()); this.lastPageChange = 'Programmatically navigated to last page'; } jumpToMiddle(): void { const middle = Math.ceil(this.totalPagesInteractive() / 2); this.currentPageInteractive.set(middle); this.lastPageChange = `Programmatically jumped to middle page (${middle})`; } resetInteractive(): void { this.currentPageInteractive.set(1); this.lastPageChange = 'Interactive pagination reset'; } }Olxkmf8]'aix~&@use "../../../../../ui-design-system/src/styles/semantic/index" as *; .popover-demo { padding: $semantic-spacing-layout-section-xs; &__section { margin-bottom: $semantic-spacing-layout-section-sm; &:last-child { margin-bottom: 0; } } &__title { font-size: map-get($semantic-typography-heading-h3, font-size); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-content-heading; padding-bottom: $semantic-spacing-content-list-item; border-bottom: $semantic-border-card-width solid $semantic-color-border-subtle; } &__subtitle { font-size: map-get($semantic-typography-heading-h4, font-size); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-content-paragraph; } &__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: $semantic-spacing-layout-section-xs; margin-bottom: $semantic-spacing-layout-section-xs; } &__row { display: flex; flex-wrap: wrap; gap: $semantic-spacing-layout-section-xs; margin-bottom: $semantic-spacing-layout-section-xs; align-items: center; &--center { justify-content: center; min-height: 200px; padding: $semantic-spacing-layout-section-xs; border: 2px dashed $semantic-color-border-subtle; border-radius: $semantic-border-radius-lg; } &--positions { display: grid; grid-template-columns: 1fr auto 1fr; grid-template-rows: auto auto auto; gap: $semantic-spacing-component-lg; align-items: center; justify-items: center; min-height: 300px; padding: $semantic-spacing-layout-section-xs; border: 2px dashed $semantic-color-border-subtle; border-radius: $semantic-border-radius-lg; } } &__trigger-button { padding: $semantic-spacing-component-sm $semantic-spacing-component-md; border: $semantic-border-card-width solid $semantic-color-border-primary; border-radius: $semantic-border-radius-md; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-size: $semantic-typography-font-size-md; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; min-width: 120px; &:hover { background: $semantic-color-surface-secondary; border-color: $semantic-color-border-focus; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &--primary { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; &:hover { background: $semantic-color-primary-hover; border-color: $semantic-color-primary-hover; } } &--small { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; font-size: $semantic-typography-font-size-sm; min-width: 100px; } &--large { padding: $semantic-spacing-component-md $semantic-spacing-component-lg; font-size: $semantic-typography-font-size-lg; min-width: 140px; } } &__stats { display: flex; gap: $semantic-spacing-content-paragraph; margin-top: $semantic-spacing-content-paragraph; font-size: $semantic-typography-font-size-sm; color: $semantic-color-text-secondary; } &__code-example { margin-top: $semantic-spacing-content-heading; padding: $semantic-spacing-component-md; background: $semantic-color-surface-secondary; border: $semantic-border-card-width solid $semantic-color-border-subtle; border-radius: $semantic-border-radius-md; font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: $semantic-typography-font-size-sm; color: $semantic-color-text-secondary; overflow-x: auto; } // Position grid layout &__position-top-start { grid-column: 1; grid-row: 1; } &__position-top { grid-column: 2; grid-row: 1; } &__position-top-end { grid-column: 3; grid-row: 1; } &__position-left { grid-column: 1; grid-row: 2; } &__position-center { grid-column: 2; grid-row: 2; } &__position-right { grid-column: 3; grid-row: 2; } &__position-bottom-start { grid-column: 1; grid-row: 3; } &__position-bottom { grid-column: 2; grid-row: 3; } &__position-bottom-end { grid-column: 3; grid-row: 3; } // Custom popover content styles .popover-content { &__menu { min-width: 200px; .menu-item { display: block; width: 100%; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; border: none; background: transparent; color: $semantic-color-text-primary; font-size: $semantic-typography-font-size-sm; text-align: left; cursor: pointer; transition: background-color $semantic-motion-duration-fast $semantic-motion-easing-ease; &:hover { background: $semantic-color-surface-secondary; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: -2px; } &--divider { border-bottom: $semantic-border-card-width solid $semantic-color-border-subtle; margin-bottom: $semantic-spacing-content-line-tight; padding-bottom: $semantic-spacing-content-line-tight; } } } &__form { min-width: 280px; .form-group { margin-bottom: $semantic-spacing-content-paragraph; &:last-child { margin-bottom: 0; } } label { display: block; font-size: $semantic-typography-font-size-sm; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-content-line-tight; font-weight: $semantic-typography-font-weight-medium; } input, textarea { width: 100%; padding: $semantic-spacing-component-sm; border: $semantic-border-card-width solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-size: $semantic-typography-font-size-sm; transition: border-color $semantic-motion-duration-fast $semantic-motion-easing-ease; &:focus { outline: none; border-color: $semantic-color-focus; box-shadow: 0 0 0 1px $semantic-color-focus; } &::placeholder { color: $semantic-color-text-tertiary; } } textarea { resize: vertical; min-height: 80px; } } &__card { min-width: 300px; max-width: 400px; .card-header { display: flex; align-items: center; gap: $semantic-spacing-content-list-item; margin-bottom: $semantic-spacing-content-list-item; .avatar { width: 40px; height: 40px; border-radius: $semantic-border-radius-full; background: $semantic-color-primary; color: $semantic-color-on-primary; display: flex; align-items: center; justify-content: center; font-weight: $semantic-typography-font-weight-semibold; } .user-info { .name { font-weight: $semantic-typography-font-weight-medium; font-size: $semantic-typography-font-size-md; color: $semantic-color-text-primary; } .role { font-size: $semantic-typography-font-size-xs; color: $semantic-color-text-secondary; } } } .card-content { font-size: $semantic-typography-font-size-sm; color: $semantic-color-text-secondary; line-height: $semantic-typography-line-height-relaxed; margin-bottom: $semantic-spacing-content-paragraph; } .card-actions { display: flex; gap: $semantic-spacing-content-list-item; button { flex: 1; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; border: $semantic-border-card-width solid $semantic-color-border-primary; border-radius: $semantic-border-radius-sm; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; font-size: $semantic-typography-font-size-xs; cursor: pointer; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; &:hover { background: $semantic-color-surface-secondary; } &.primary { background: $semantic-color-primary; color: $semantic-color-on-primary; border-color: $semantic-color-primary; &:hover { background: $semantic-color-primary-hover; } } } } } &__tooltip { max-width: 200px; font-size: $semantic-typography-font-size-xs; line-height: $semantic-typography-line-height-normal; } } // Responsive design @media (max-width: $semantic-breakpoint-md - 1) { &__grid { grid-template-columns: 1fr; } &__row { flex-direction: column; align-items: stretch; &--positions { grid-template-columns: 1fr; grid-template-rows: repeat(9, auto); gap: $semantic-spacing-component-sm; min-height: auto; } } &__position-top-start, &__position-top, &__position-top-end, &__position-left, &__position-center, &__position-right, &__position-bottom-start, &__position-bottom, &__position-bottom-end { grid-column: 1; } } }bd xWKlEVv<8IbE&!HU 0;$D q@B@Rܩĩ*\rPهGHr̿yt/SYV.e^R!DTC*e%U$I$P WEh DG7``IE "xGjrڮW$rH_a{O˂" XKEVKM;5,RMlCJ!GZdf"6Fk) ?D| Av ,R\"Ats|dH=YXzWr7po,5?7uُeO᛾ \ E>7C0,{6G6]j8ȦFP.+`c!J& *˄!~,X1C%(ԒtO3(xv,Iu0@nJyR.XZwЍ:n4{|m7v)¢@*U,O"uBK7| ŹX s`z: SVUV<}|pŃn E?PQECo- W#CrTDmZLd-:,O-MjYk4jIǃ5>qxfj]ѿ0]桬+lS=yg!)|@,<= B(1L ]S+̑'erVJ鸦mXUS t~ K3$N 7 Zc.6k͝o'`zĊjz&1 hTw!4QОX+2,ީ&Hk;Psm4wZ.U'-MUk JMCY;de,JJ] n1@օ ;0J9db"&kdD/Fּ k_#<&78]ݛDש!6 Ȅ.c ͙g%By8I'JS#t8R:YoV@Q(ݨZ]1|曄@G{{>^Juڊhxl&!?}˝#mADApSx86Ð<;A- fu`2o"o/"ЬȶjLwuc[)"8o-^7(TY6PPSޞuA ֿ2擇kK69o;/9y%ml5~7L{3'`ka){+1FFp+S$_\0wN.8?~Y1!w6uձ K_ӨąY#(RMQH-pk&VM_%ŋJJTc. M7=Ӆg brm͢eh "oH Fr-8{N;ik~ný9 %ptizؾ1j{[66{ۺ 38pS;2m{Avhw&][ludi+%ٽٟW_wZK1xxύCtxg(gqFbQjniFH5^xWKlEVJ'iMR{qN-VpZQֻu*FC+ r=p.{8"!8#ڻG"_WһZH&S]x] C36NBH[j#1~4,jSC#l KP;avtB9y nG/ڧn ScP!9џ5Xg)T@9Rvy+ιќ-e%&LW3Kt`*a*glA7JY:aYk2e3zٟQĜC56anaGzJJԢ@3 VIu*m8)OnR^IzFhn^KD{{*}ŒEFVs(誄M$x)"_l#KBCq}}[Fp0k22CSOKkl>_F֏m0%+m"kB:@sh,δR`2AfIy^˵Aaõؤסt<9]* I׷/ 3g-t+)BTPЏ;Ұ&E;9NB$L-R͂]rZ`9Ȋ(TR=QPEWc`9qKRbtB cgOXy^=ıji#Z 3>sP@xڃ VcG}9EլZp>YЕP;ދf֠u#\:`x>mPw"g5T-VHۆAoI\)( v9?jd}'TYUn-}BTW [kG3ahב"W< 7BB aKeU4H}Uw.9~>&ߪ_`'x;Gs ?/2 ~y -v\[7P _{}cۋm$m-HņKl,~/sHxdFyC%|5OT*iI-\fik*!#q~.fm53UۂitbX 3 T rg(F'$Ip;_{)^ @ї>'? rw(Yr333 i 9I)fq#߆dFAFlipӈܑi,HgED$Xp/4(-, Մ?Oe%%`04/>B!&(BzJDo06eyt$퐷sy! gsP}Ӭ3 l?zǰG.{YHh}K)-"IEL"Mayhb> w~<#?V|Vp47C2 L[Q 0E!ڥ$'MaBr-G9˦3& $ #&I9W&d[i!fgOX5?k-"j!Kn <@9M几8:y%~70*bifwP.2~C>*@i <8ϓ,bκ$S;޼ Tc/}Dy O(ADN_ a!VwN%7vSny^lJ" @g4 XTB5˒"FDDwta NܭBȞaS1#w\͆HAPڕ_zzqժP՗ab)al?TVN5 u7f=3۴bNK\z9_ ^[;nZ,[[Tm^궗84 FS/zDoAU_KYY*IҴ,hQb )^kNE(fXQꨧYLܓzRs.ٴ!>A7-\#[V߫Z6q嵀IDZǬD^iUÜ-ŀOŕ$Sffgqror'r XO|. PuLUTPB-Ž{ʢJ4Ma^՛)XKbOp 8-@쵓TmiD'lDfBf08_ U Eo>Y<"r1dQֶ'F$_$ UZ,-7"@`QDX4~ʢ|#(E&}^U\[X a"dsɬh& JlUu5flIN TjSr5,"4 4j !"i][BXoԗnZEr5wm)6K{Bd vC/ɲNŪߓ_`8f?\mi:dVEUGr/v-W%v]rn( @pJ>;]e:b\vmEJiN(A1{@ȢF֍,m$Ux\x? H s*3y2 i'ۤȈ:}ڐma?>1.1걉uE{g/t9iƨZ5]=jMW%9 Է^Dj]0g*ʖ$VɔFϚ`m%xhfNU@UpEGе*<ϒi1KV1^'>`K)ϵ H QqÙ X4!jC`U2!e m,YY&y J g͚ƶUOEi#“"p9A/>!4%w,{aL=M$Jl2(  `nx^%'āb) [ k S.X/7oqP#9(PtD/颊,|T{QDd'1 ﬢOY "!rU]Sec}Ev8[`_]l0ɗULeC#DȄcDͳ[Bs;~8)E5B3T]Ryl2#zh͌Oc P  <$yv,pCĿa>`-[NMǚ"GɵF%W;ե']ou_f+,du\ٿRy35C$lF$J8 {L8Σ$@m49z0 - JOdn)Um)"8_2||4G&̝`SJE9N` Q z%0d998ygC+scT. !2p3<)ϓFK\0F|+\AEDĨH|\!y$c'óݛ"LBRL"z3a(?G)'JGpXa.6+(nwA)>뒮\5K`y2g!-7,Mҕ[xvkjE:[51ygלUY]ZhMbb+Cc 2`O0@ @tv4fALĶDn0Y4"дAuGO8ɚV.9bջR7Lqfg_Zބi Pk3H#ڄ9Uڤȫ:0@7]o1%.+~"$)=2;pK@O|y'><'GΗAϸ]3ԗzՕ5/?N&O/r&< ynGzD2klԖHܴݧRjHzƔX)xj:_߳hKF` l/$Km"1%`K$ǢilZ@y솜`=ȤA*=PF\ ]- j ({F0'k,K#W/oI\DѸT~ Ǡ.ڀg M*$RMR_7ef~eH"6}L~ry I)-]6!u!cyŒ#@+,}+L(؝E{e8LKހ$ ޸J'D\BVoʫM6S22I <&"vWWR]hllL  IxN1#=:LB1*FɩX|anm_1D2u"6W%ݓyUDܻ0enf; ѡK{MȘ,Y$PDŕ)2dk0ՔhHTOEee%ni=MTT̸8E Z;% JfYEn|Zs3$1`2MR`$r yd-'b("w LMGJhE\OJ9&K%h#`@ 80vƞe!;|@{1a5u Qpxq@Wn ]0-z jYNMn|k,œk NYYGowY;Rx||+Vߺj5-0k|2 7&e \x%"import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { ProgressCircleComponent } from '../../../../../ui-essentials/src/lib/components/feedback/progress-circle/progress-circle.component'; @Component({ selector: 'ui-progress-circle-demo', standalone: true, imports: [CommonModule, FormsModule, ProgressCircleComponent], template: `

    Progress Circle Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size }}

    }

    Variants

    @for (variant of variants; track variant) {

    {{ variant }}

    }

    Stroke Width

    @for (stroke of strokes; track stroke) {

    {{ stroke }}

    }

    States

    Default

    Disabled

    Indeterminate

    Complete

    Label Variations

    No Label

    Percentage

    Fraction

    ✓

    Custom Content

    Interactive

    Animation Demo

    Animated Progress

    `, styleUrl: './progress-circle-demo.component.scss' }) export class ProgressCircleDemoComponent { sizes = ['sm', 'md', 'lg', 'xl'] as const; variants = ['primary', 'secondary', 'success', 'warning', 'danger', 'info'] as const; strokes = ['thin', 'default', 'thick', 'extra-thick'] as const; // Interactive demo state interactiveValue = signal(75); interactiveSize = signal<'sm' | 'md' | 'lg' | 'xl'>('lg'); interactiveVariant = signal<'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info'>('primary'); interactiveShowLabel = signal(true); interactiveIndeterminate = signal(false); // Animation demo state animatedValue = signal(0); progressRunning = signal(false); private animationInterval: any; updateValue(event: Event): void { const target = event.target as HTMLInputElement; this.interactiveValue.set(parseInt(target.value, 10)); } updateSize(event: Event): void { const target = event.target as HTMLSelectElement; this.interactiveSize.set(target.value as any); } updateVariant(event: Event): void { const target = event.target as HTMLSelectElement; this.interactiveVariant.set(target.value as any); } toggleLabel(event: Event): void { const target = event.target as HTMLInputElement; this.interactiveShowLabel.set(target.checked); } toggleIndeterminate(event: Event): void { const target = event.target as HTMLInputElement; this.interactiveIndeterminate.set(target.checked); } startProgress(): void { if (this.progressRunning()) return; this.progressRunning.set(true); this.animatedValue.set(0); this.animationInterval = setInterval(() => { const currentValue = this.animatedValue(); if (currentValue >= 100) { this.stopProgress(); return; } this.animatedValue.set(currentValue + 2); }, 100); } resetProgress(): void { this.stopProgress(); this.animatedValue.set(0); } private stopProgress(): void { if (this.animationInterval) { clearInterval(this.animationInterval); this.animationInterval = null; } this.progressRunning.set(false); } ngOnDestroy(): void { this.stopProgress(); } }ʃյ xO*import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { ProgressBarComponent } from '../../../../../ui-essentials/src/lib/components/data-display/progress/progress-bar.component'; @Component({ selector: 'ui-progress-demo', standalone: true, imports: [ CommonModule, FormsModule, ProgressBarComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Progress Bar Component Showcase

    Basic Progress Bars

    Color Variants

    Progress Bar Types

    Striped and Animated Progress Bars

    Progress Bar States

    Size and Variant Combinations

    Small Size Variants

    Large Size Variants

    Progress Bars without Labels

    Interactive Demo

    {{ demoProgress }}%
    {{ demoBuffer }}%

    Live Preview:

    Usage Examples

    Basic Progress Bar:

    <ui-progress-bar 
  label="Download Progress"
  size="md"
  variant="primary"
  [progress]="75"
  helperText="3 of 4 files downloaded">
</ui-progress-bar>

    Indeterminate Progress:

    <ui-progress-bar 
  label="Loading..."
  progressType="indeterminate"
  variant="primary"
  [animated]="true"
  helperText="Please wait while we process your request">
</ui-progress-bar>

    Buffer Progress:

    <ui-progress-bar 
  label="Video Loading"
  progressType="buffer"
  [progress]="currentProgress"
  [buffer]="bufferProgress"
  variant="secondary"
  helperText="Buffering video content">
</ui-progress-bar>

    Striped Animated Progress:

    <ui-progress-bar 
  label="Upload Progress"
  [progress]="uploadPercent"
  variant="success"
  [striped]="true"
  [animated]="true"
  size="lg"
  helperText="Uploading files...">
</ui-progress-bar>

    Programmatic Control Example

    Current Progress: {{ programmableValue() }}% | Status: {{ progressStatus() }}
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } select, input[type="checkbox"], input[type="range"] { cursor: pointer; } label { cursor: pointer; } button:hover { opacity: 0.9; } button:active { transform: scale(0.98); } `] }) export class ProgressDemoComponent { // Animated progress values determinateProgress = signal(35); bufferProgress = signal(25); bufferValue = signal(65); // Interactive demo properties demoProgress = 60; demoBuffer = 80; demoSize: 'sm' | 'md' | 'lg' = 'md'; demoVariant: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' = 'primary'; demoType: 'determinate' | 'indeterminate' | 'buffer' = 'determinate'; demoStriped = false; demoAnimated = false; demoShowPercentage = true; demoDisabled = false; // Programmable progress programmableValue = signal(0); progressStatus = signal('Ready'); private progressInterval: any; private isPaused = false; ngOnInit(): void { // Start some animated progress bars this.animateProgress(); } ngOnDestroy(): void { if (this.progressInterval) { clearInterval(this.progressInterval); } } private animateProgress(): void { // Animate the determinate progress setInterval(() => { const current = this.determinateProgress(); const next = (current + 1) % 101; this.determinateProgress.set(next); }, 100); // Animate the buffer progress setInterval(() => { const currentBuffer = this.bufferValue(); const currentProgress = this.bufferProgress(); const nextBuffer = (currentBuffer + 0.5) % 101; const nextProgress = Math.min(nextBuffer - 20, 100); this.bufferValue.set(nextBuffer); this.bufferProgress.set(Math.max(0, nextProgress)); }, 150); } startDemo(): void { this.demoProgress = 0; let progress = 0; const interval = setInterval(() => { progress += Math.random() * 3; this.demoProgress = Math.min(100, progress); if (progress >= 100) { clearInterval(interval); } }, 100); } resetDemo(): void { this.demoProgress = 0; this.demoBuffer = 0; this.demoSize = 'md'; this.demoVariant = 'primary'; this.demoType = 'determinate'; this.demoStriped = false; this.demoAnimated = false; this.demoShowPercentage = true; this.demoDisabled = false; } simulateProgress(): void { if (this.progressInterval) { clearInterval(this.progressInterval); } this.isPaused = false; this.progressStatus.set('Processing...'); this.progressInterval = setInterval(() => { if (!this.isPaused) { const current = this.programmableValue(); if (current < 100) { this.programmableValue.set(current + Math.random() * 2); } else { this.progressStatus.set('Complete!'); clearInterval(this.progressInterval); } } }, 50); } pauseProgress(): void { this.isPaused = !this.isPaused; this.progressStatus.set(this.isPaused ? 'Paused' : 'Processing...'); } resetProgrammable(): void { if (this.progressInterval) { clearInterval(this.progressInterval); } this.programmableValue.set(0); this.progressStatus.set('Ready'); this.isPaused = false; } completeProgress(): void { if (this.progressInterval) { clearInterval(this.progressInterval); } this.programmableValue.set(100); this.progressStatus.set('Complete!'); this.isPaused = false; } }y#ncx:q| uW.'q xYQimport { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { RadioButtonComponent } from '../../../../../ui-essentials/src/lib/components/forms/radio/radio-button.component'; import { RadioGroupComponent } from '../../../../../ui-essentials/src/lib/components/forms/radio/radio-group.component'; import { RadioButtonData } from '../../../../../ui-essentials/src/lib/components/forms/radio/radio-button.component'; @Component({ selector: 'ui-radio-demo', standalone: true, imports: [ CommonModule, FormsModule, RadioButtonComponent, RadioGroupComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Radio Button Component Showcase

    Basic Radio Buttons

    Individual Radio Buttons

    Radio Group

    Size Variants

    Small (sm)

    Medium (md) - Default

    Large (lg)

    Color Variants

    Primary (Default)

    Secondary

    Success

    Warning

    Danger

    Orientation

    Vertical (Default)

    Horizontal

    Radio Buttons with Descriptions

    Radio Button States

    Disabled Group

    Individual Disabled Options

    Error State

    With Helper Text

    Dense Layout

    Normal Spacing

    Dense Spacing

    Usage Examples

    Basic Radio Group:

    <ui-radio-group
  label="Choose an option"
  [options]="options"
  name="radio-group"
  [(ngModel)]="selectedValue"
  (selectionChange)="onSelectionChange($event)">
</ui-radio-group>

    Individual Radio Button:

    <ui-radio-button
  value="option1"
  label="Option 1"
  name="radio-name"
  size="md"
  variant="primary"
  [(ngModel)]="selectedValue"
  (selectionChange)="onSelectionChange($event)">
</ui-radio-button>

    With Descriptions:

    <ui-radio-group
  label="Subscription Plans"
  [options]="[
    {{ '{' }}
      value: 'basic',
      label: 'Basic Plan',
      description: 'Perfect for individuals'
    {{ '}' }},
    {{ '{' }}
      value: 'pro',
      label: 'Pro Plan', 
      description: 'For small teams'
    {{ '}' }}
  ]"
  name="subscription"
  [(ngModel)]="plan">
</ui-radio-group>

    Horizontal Layout:

    <ui-radio-group
  label="Payment Method"
  [options]="paymentOptions"
  orientation="horizontal"
  name="payment"
  [(ngModel)]="paymentMethod">
</ui-radio-group>

    Interactive Controls

    @if (lastSelection()) {
    Last selection: {{ lastSelection() }}
    }

    Current Values

    {{ getCurrentValues() }}
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } button { transition: all 0.2s ease-in-out; } button:hover { opacity: 0.9; transform: translateY(-1px); } `] }) export class RadioDemoComponent { // Basic selections basicSelection = ''; groupSelection = ''; // Size selections sizeSelections: Record = { 'sm': '', 'md': '', 'lg': '' }; // Variant selections variantSelections: Record = { 'primary': '', 'secondary': '', 'success': '', 'warning': '', 'danger': '' }; // Orientation selections orientationSelections: Record = { 'vertical': '', 'horizontal': '' }; // Other selections planSelection = ''; disabledSelection = ''; errorSelection = ''; notificationSelection = ''; // Dense selections denseSelections: Record = { 'normal': '', 'dense': '' }; // Signals for reactive state lastSelection = signal(''); globalDisabled = signal(false); // Option data basicOptions: RadioButtonData[] = [ { value: 'basic1', label: 'Basic Option 1' }, { value: 'basic2', label: 'Basic Option 2' }, { value: 'basic3', label: 'Basic Option 3' } ]; sizeOptions: RadioButtonData[] = [ { value: 'size1', label: 'First Choice' }, { value: 'size2', label: 'Second Choice' }, { value: 'size3', label: 'Third Choice' } ]; colorOptions: RadioButtonData[] = [ { value: 'color1', label: 'Red' }, { value: 'color2', label: 'Blue' }, { value: 'color3', label: 'Green' } ]; orientationOptions: RadioButtonData[] = [ { value: 'orient1', label: 'Option A' }, { value: 'orient2', label: 'Option B' }, { value: 'orient3', label: 'Option C' }, { value: 'orient4', label: 'Option D' } ]; planOptions: RadioButtonData[] = [ { value: 'basic', label: 'Basic Plan', description: 'Perfect for individuals and small projects. Includes 5GB storage and basic support.' }, { value: 'pro', label: 'Professional Plan', description: 'Great for small teams. Includes 50GB storage, priority support, and advanced features.' }, { value: 'enterprise', label: 'Enterprise Plan', description: 'For large organizations. Unlimited storage, 24/7 support, and custom integrations.' } ]; stateOptions: RadioButtonData[] = [ { value: 'state1', label: 'Option 1' }, { value: 'state2', label: 'Option 2' }, { value: 'state3', label: 'Option 3' } ]; disabledOptions: RadioButtonData[] = [ { value: 'available1', label: 'Available Option 1' }, { value: 'disabled1', label: 'Disabled Option', disabled: true }, { value: 'available2', label: 'Available Option 2' }, { value: 'disabled2', label: 'Another Disabled Option', disabled: true } ]; errorOptions: RadioButtonData[] = [ { value: 'error1', label: 'Option 1' }, { value: 'error2', label: 'Option 2' }, { value: 'error3', label: 'Option 3' } ]; notificationOptions: RadioButtonData[] = [ { value: 'email', label: 'Email notifications' }, { value: 'sms', label: 'SMS notifications' }, { value: 'push', label: 'Push notifications' }, { value: 'none', label: 'No notifications' } ]; denseOptions: RadioButtonData[] = [ { value: 'dense1', label: 'Compact Option 1' }, { value: 'dense2', label: 'Compact Option 2' }, { value: 'dense3', label: 'Compact Option 3' }, { value: 'dense4', label: 'Compact Option 4' } ]; handleSelectionChange(group: string, value: string): void { this.lastSelection.set(`${group}: ${value}`); console.log(`Selection changed in ${group}: ${value}`); } handleSizeSelection(size: string, value: string): void { this.sizeSelections[size] = value; this.handleSelectionChange(`size-${size}`, value); } handleVariantSelection(variant: string, value: string): void { this.variantSelections[variant] = value; this.handleSelectionChange(`variant-${variant}`, value); } handleOrientationSelection(orientation: string, value: string): void { this.orientationSelections[orientation] = value; this.handleSelectionChange(`orientation-${orientation}`, value); } handleDenseSelection(type: string, value: string): void { this.denseSelections[type] = value; this.handleSelectionChange(`dense-${type}`, value); } resetAllSelections(): void { this.basicSelection = ''; this.groupSelection = ''; this.planSelection = ''; this.disabledSelection = ''; this.errorSelection = ''; this.notificationSelection = ''; Object.keys(this.sizeSelections).forEach(key => { this.sizeSelections[key] = ''; }); Object.keys(this.variantSelections).forEach(key => { this.variantSelections[key] = ''; }); Object.keys(this.orientationSelections).forEach(key => { this.orientationSelections[key] = ''; }); Object.keys(this.denseSelections).forEach(key => { this.denseSelections[key] = ''; }); this.lastSelection.set('All selections reset'); console.log('All selections reset'); } fillSampleSelections(): void { this.basicSelection = 'option2'; this.groupSelection = 'basic2'; this.planSelection = 'pro'; this.notificationSelection = 'email'; this.sizeSelections['md'] = 'size2'; this.variantSelections['primary'] = 'color1'; this.orientationSelections['horizontal'] = 'orient3'; this.denseSelections['dense'] = 'dense2'; this.lastSelection.set('Sample selections filled'); console.log('Sample selections filled'); } toggleDisabled(): void { this.globalDisabled.set(!this.globalDisabled()); this.lastSelection.set(`All controls ${this.globalDisabled() ? 'disabled' : 'enabled'}`); console.log(`Global disabled state: ${this.globalDisabled()}`); } getCurrentValues(): string { const values = { basic: this.basicSelection, group: this.groupSelection, plan: this.planSelection, disabled: this.disabledSelection, error: this.errorSelection, notification: this.notificationSelection, sizes: this.sizeSelections, variants: this.variantSelections, orientations: this.orientationSelections, dense: this.denseSelections }; return JSON.stringify(values, null, 2); } }.}gxq!R\ A)N%%yyy%: \3ʻ$$rM

    Range Slider Demo

    Sizes

    @for (size of sizes; track size) {
    }

    Variants

    @for (variant of variants; track variant) {
    }

    States

    Range Configurations

    Tick Marks

    Interactive Configuration

    Form Integration

    Form Values:

    {{ getFormValues() | json }}

    Event Handling

    Event Log:

    @for (event of eventLog(); track $index) {
    {{ event }}
    }
    `, styleUrl: './range-slider-demo.component.scss' }) export class RangeSliderDemoComponent { private fb = new FormBuilder(); sizes = ['sm', 'md', 'lg'] as const; variants = ['primary', 'secondary', 'success', 'warning', 'danger'] as const; // Interactive demo state interactiveValue = signal(50); interactiveMin = signal(0); interactiveMax = signal(100); interactiveStep = signal(1); interactiveSize = signal<'sm' | 'md' | 'lg'>('md'); interactiveVariant = signal<'primary' | 'secondary' | 'success' | 'warning' | 'danger'>('primary'); interactiveShowValue = signal(true); interactiveDisabled = signal(false); // Event demo state eventSliderValue = signal(25); eventLog = signal([]); // Tick mark configurations basicTicks: RangeSliderTickMark[] = [ { value: 0 }, { value: 25 }, { value: 50 }, { value: 75 }, { value: 100 } ]; labeledTicks: RangeSliderTickMark[] = [ { value: 0, label: 'Min' }, { value: 1, label: 'Low' }, { value: 2, label: 'Med' }, { value: 3, label: 'High' }, { value: 4, label: 'Very High' }, { value: 5, label: 'Max' } ]; majorMinorTicks: RangeSliderTickMark[] = [ { value: 0, label: '0%', major: true }, { value: 25, major: false }, { value: 50, label: '50%', major: true }, { value: 75, major: false }, { value: 100, label: '100%', major: true } ]; temperatureTicks: RangeSliderTickMark[] = [ { value: 16, label: '16°' }, { value: 18, label: '18°' }, { value: 20, label: '20°' }, { value: 22, label: '22°' }, { value: 24, label: '24°' }, { value: 26, label: '26°' }, { value: 28, label: '28°' }, { value: 30, label: '30°' } ]; // Form setup demoForm: FormGroup = this.fb.group({ volume: [75], brightness: [128], temperature: [22] }); // Interactive controls updateMin(event: Event): void { const target = event.target as HTMLInputElement; const newMin = parseInt(target.value, 10); this.interactiveMin.set(newMin); // Adjust value if it's now below min if (this.interactiveValue() < newMin) { this.interactiveValue.set(newMin); } } updateMax(event: Event): void { const target = event.target as HTMLInputElement; const newMax = parseInt(target.value, 10); this.interactiveMax.set(newMax); // Adjust value if it's now above max if (this.interactiveValue() > newMax) { this.interactiveValue.set(newMax); } } updateStep(event: Event): void { const target = event.target as HTMLSelectElement; this.interactiveStep.set(parseFloat(target.value)); } updateSize(event: Event): void { const target = event.target as HTMLSelectElement; this.interactiveSize.set(target.value as any); } updateVariant(event: Event): void { const target = event.target as HTMLSelectElement; this.interactiveVariant.set(target.value as any); } toggleShowValue(event: Event): void { const target = event.target as HTMLInputElement; this.interactiveShowValue.set(target.checked); } toggleDisabled(event: Event): void { const target = event.target as HTMLInputElement; this.interactiveDisabled.set(target.checked); } onInteractiveValueChange(value: number): void { this.interactiveValue.set(value); } // Event handlers onValueChange(value: number): void { this.eventSliderValue.set(value); this.addEventLog(`Value changed: ${value}`); } onSlideStart(value: number): void { this.addEventLog(`Slide started at: ${value}`); } onSlideEnd(value: number): void { this.addEventLog(`Slide ended at: ${value}`); } onSliderFocus(): void { this.addEventLog('Slider focused'); } onSliderBlur(): void { this.addEventLog('Slider blurred'); } private addEventLog(message: string): void { const timestamp = new Date().toLocaleTimeString(); const newLog = `[${timestamp}] ${message}`; this.eventLog.update(log => [newLog, ...log.slice(0, 9)]); // Keep last 10 events } clearEventLog(): void { this.eventLog.set([]); } getFormValues(): any { return this.demoForm.value; } }:yx>@use '../../../../../../ui-design-system/src/styles/semantic/index' as *; .ui-gallery-grid { // Core Structure display: grid; position: relative; width: 100%; // Layout & Spacing gap: $semantic-spacing-grid-gap-md; padding: $semantic-spacing-component-md; // Visual Design background: $semantic-color-surface-primary; border-radius: $semantic-border-radius-md; // Grid Sizing Variants &--columns-1 { grid-template-columns: 1fr; } &--columns-2 { grid-template-columns: repeat(2, 1fr); } &--columns-3 { grid-template-columns: repeat(3, 1fr); } &--columns-4 { grid-template-columns: repeat(4, 1fr); } &--columns-5 { grid-template-columns: repeat(5, 1fr); } &--columns-6 { grid-template-columns: repeat(6, 1fr); } // Gap Size Variants &--gap-sm { gap: $semantic-spacing-grid-gap-sm; } &--gap-md { gap: $semantic-spacing-grid-gap-md; } &--gap-lg { gap: $semantic-spacing-grid-gap-lg; } // Responsive Grid Auto-fit &--auto-fit { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } // Masonry-style layout option &--masonry { grid-auto-rows: min-content; align-items: start; } // Gallery Item &__item { position: relative; overflow: hidden; border-radius: $semantic-border-radius-md; background: $semantic-color-surface-secondary; border: $semantic-border-width-1 solid $semantic-color-border-subtle; transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease; cursor: pointer; // Interactive States &:hover { transform: translateY(-2px); box-shadow: $semantic-shadow-elevation-3; border-color: $semantic-color-border-primary; } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &:active { transform: translateY(0); box-shadow: $semantic-shadow-elevation-1; } // Loading State &--loading { opacity: $semantic-opacity-subtle; pointer-events: none; &::after { content: ''; position: absolute; top: 50%; left: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px; border: 2px solid $semantic-color-border-subtle; border-top-color: $semantic-color-primary; border-radius: $semantic-border-radius-full; animation: ui-gallery-grid-spin 1s linear infinite; } } // Selected State &--selected { border-color: $semantic-color-primary; box-shadow: $semantic-shadow-elevation-2; &::before { content: ''; position: absolute; top: $semantic-spacing-component-xs; right: $semantic-spacing-component-xs; width: 20px; height: 20px; background: $semantic-color-primary; border-radius: $semantic-border-radius-full; z-index: 2; } &::after { content: '✓'; position: absolute; top: $semantic-spacing-component-xs; right: $semantic-spacing-component-xs; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; color: $semantic-color-on-primary; font-size: $semantic-typography-font-size-xs; font-weight: $semantic-typography-font-weight-bold; z-index: 3; } } } // Image within gallery item &__image { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform $semantic-motion-duration-fast $semantic-motion-easing-ease; &--contain { object-fit: contain; } &--fill { object-fit: fill; } &--scale-down { object-fit: scale-down; } } // Overlay for additional information &__overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent); color: $semantic-color-text-inverse; padding: $semantic-spacing-component-md; opacity: 0; transform: translateY(100%); transition: all $semantic-motion-duration-normal $semantic-motion-easing-ease; .ui-gallery-grid__item:hover & { opacity: 1; transform: translateY(0); } } // Overlay content &__title { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: $semantic-typography-font-weight-semibold; line-height: map-get($semantic-typography-body-medium, line-height); color: $semantic-color-text-inverse; margin-bottom: $semantic-spacing-content-line-tight; } &__caption { font-family: map-get($semantic-typography-body-small, font-family); font-size: map-get($semantic-typography-body-small, font-size); font-weight: map-get($semantic-typography-body-small, font-weight); line-height: map-get($semantic-typography-body-small, line-height); color: $semantic-color-text-inverse; opacity: $semantic-opacity-subtle; } // Lightbox trigger indicator &__zoom-indicator { position: absolute; top: $semantic-spacing-component-xs; left: $semantic-spacing-component-xs; width: 24px; height: 24px; background: rgba(0, 0, 0, 0.6); color: $semantic-color-text-inverse; border-radius: $semantic-border-radius-sm; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity $semantic-motion-duration-fast $semantic-motion-easing-ease; z-index: 2; .ui-gallery-grid__item:hover & { opacity: 1; } svg { width: 16px; height: 16px; fill: currentColor; } } // Empty state &__empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: $semantic-spacing-layout-section-lg; color: $semantic-color-text-secondary; text-align: center; &-icon { width: 48px; height: 48px; margin-bottom: $semantic-spacing-component-md; opacity: $semantic-opacity-subtle; } &-text { font-family: map-get($semantic-typography-body-medium, font-family); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); } } // Responsive Design @media (max-width: $semantic-breakpoint-lg - 1) { &--columns-6 { grid-template-columns: repeat(4, 1fr); } &--columns-5 { grid-template-columns: repeat(3, 1fr); } } @media (max-width: $semantic-breakpoint-md - 1) { padding: $semantic-spacing-component-sm; gap: $semantic-spacing-grid-gap-sm; &--columns-6, &--columns-5, &--columns-4 { grid-template-columns: repeat(2, 1fr); } &--columns-3 { grid-template-columns: repeat(2, 1fr); } } @media (max-width: $semantic-breakpoint-sm - 1) { padding: $semantic-spacing-component-xs; &--columns-6, &--columns-5, &--columns-4, &--columns-3, &--columns-2 { grid-template-columns: 1fr; } &--auto-fit { grid-template-columns: 1fr; } } } // Loading animation keyframes @keyframes ui-gallery-grid-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }jG9gOxE ;8Oinfinite-scroll-container[" flex-direction: column5overflow: auto; height: 100%; // Base styling @ FbGprimary; // Scrollbar styling scrollbar-width: thin; scrollbar?  econdaryf&# &::-webkit-scrollbar { width)2; } &::-webkit-scrollbar-track { > wu !*sm; } &::-webkit-scrollbar-thumb { >  u !sm; &:hover { < "} // Direction variants &--direction-down { // Default styling - no specific changes needed } &--direction-up {7 // Reverse flex direction for up-loading scenarios/-reverse; } &--direction-both { // Both directions supported - default styling } // State variants &--loading, { cursor: wait; } &--disabled { disabled; } &--has-fixed-height { // Optimizations for fixed-height items .ui-infinite-scroll-container__item { O flex-shrink: 0; } } // Content area &__content { flex: 1; 4Imin-height: 0; // Allow shrinking } // Individual items &__item { 4G // Ensure proper spacing between items & + & { margin-to5sm; } } // Loading indicators &__loader { 6%lg; > wu !%sm; &--top { order: -1.;8} &--bottom { order: 999; margin-to.:} } // Default loading content &__default-loader { . sm; J4O  -Osecondary; } // Loading spinner &__spinner { display: inline-block; width: $semantic-sizing-icon-inline; hei#ght: $semantic-sizing-icon-inline; 9border-radius: 50%; 1 3"animation: ui-infinite-scroll-spinDslow linear infinite; } // End of content indicator &__end { 6%lg; margin-to.} &__default-end,@ wu !sm; J/caption(captionKcaption>captionN0terti!} // Error state &__error { 6%lg; margin-to.} &__default-error { 45. sm;*lg; > wUerror; k + J4O  -Oprim/} &__retry-button { display: inline-flexJWinteractive-button-padding-y#interactive-button-padding-x; > - border: none; k +sm; J0 utton-small)uttonNCuttonEutton cursor: pointerk0T-:hover:not(:disabled) { < 1? 0--1px); } &:active:not(:disabled)qbn disabled { Vdisabled; cursor: not-allowed; } } // Focus styles &:focus-visible { 2E} // Smooth scrolling behavior &:not(&--disabled) { scroll-behavior: smooth; } // High contrast mode support @m2edia (prefers-contrast: high) { &__loader { B__default-end { B} // Reduced motion support @media (prefers-reduced-motion: reduce) { scroll-behavior: auto; &__spinner {  animation: none; } &__retry-button { transition: none; &:hover:not(:disabled) { tr ansform: none active:not(:disabled) { transform: none; } } } // Print styles @media print { height: auto; overflow: visible; &__loader, &__error, &__retry-button { display: none; } } } // Keyframes for spi@nner animation @keyframes ui-infinite-scroll-spin { from { ~0 } to { transform: rotate(360deg); } }Cx$,import { Component, TemplateRef, ViewChild } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ScrollContainerComponent, ScrollVirtualConfig } from '../../../../../ui-essentials/src/lib/components/layout/scroll-container/scroll-container.component'; @Component({ selector: 'ui-scroll-container-demo', standalone: true, imports: [CommonModule, ScrollContainerComponent], template: `

    ScrollContainer Demo

    Basic Vertical Scrolling

    @for (item of longContent; track item; let i = $index) {

    {{ i + 1 }}. {{ item }}

    }

    Scroll events: Top reached {{ topCount }} times, Bottom reached {{ bottomCount }} times

    Direction Variants

    Vertical

    @for (item of shortContent; track item; let i = $index) {

    {{ i + 1 }}. {{ item }}

    }

    Horizontal

    @for (item of horizontalItems; track item) {
    {{ item }}
    }

    Both Directions

    @for (row of tableData; track row.id) { }
    {{ row.id }} {{ row.name }} {{ row.description }} {{ row.value }} {{ row.status }}

    Scrollbar Visibility

    @for (visibility of scrollbarOptions; track visibility) {

    {{ visibility | titlecase }}

    @for (item of shortContent; track item; let i = $index) {

    {{ i + 1 }}. {{ item }}

    }
    }

    Virtual Scrolling

    Virtual scrolling with {{ largeDataset.length }} items (only visible items are rendered)

    Scroll Controls & Smooth Scrolling

    @for (item of longContent; track item; let i = $index) {

    {{ i + 1 }}. {{ item }}

    }

    Scroll Position Restoration

    Scroll position is saved and restored automatically (uses sessionStorage)

    @for (item of longContent; track item; let i = $index) {

    {{ i + 1 }}. {{ item }}

    }

    Interactive Example

    Current scroll position: {{ currentScrollPosition.top }}px (top), {{ currentScrollPosition.left }}px (left)

    Is scrolling: {{ isScrolling ? 'Yes' : 'No' }}

    @for (item of gridData; track item.id) {

    Item {{ item.id }}

    {{ item.content }}

    }
    Item {{ index + 1 }}: {{ item.name }} - {{ item.description }}
    `, styleUrl: './scroll-container-demo.component.scss' }) export class ScrollContainerDemoComponent { @ViewChild('controllableScroll') controllableScroll!: ScrollContainerComponent; @ViewChild('itemTemplate') itemTemplate!: TemplateRef; // Content data longContent = [ 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.', 'Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', 'Ut enim ad minim veniam, quis nostrud exercitation ullamco.', 'Duis aute irure dolor in reprehenderit in voluptate velit esse.', 'Excepteur sint occaecat cupidatat non proident, sunt in culpa.', 'Qui officia deserunt mollit anim id est laborum.', 'At vero eos et accusamus et iusto odio dignissimos ducimus.', 'Et harum quidem rerum facilis est et expedita distinctio.', 'Nam libero tempore, cum soluta nobis est eligendi optio.', 'Temporibus autem quibusdam et aut officiis debitis aut rerum.', 'Itaque earum rerum hic tenetur a sapiente delectus.', 'Ut aut reiciendis voluptatibus maiores alias consequatur.', 'Sed ut perspiciatis unde omnis iste natus error sit.', 'Voluptatem accusantium doloremque laudantium, totam rem.', 'Aperiam, eaque ipsa quae ab illo inventore veritatis.', 'Quasi architecto beatae vitae dicta sunt explicabo.', 'Nemo enim ipsam voluptatem quia voluptas sit aspernatur.', 'Neque porro quisquam est, qui dolorem ipsum quia dolor.', 'Consectetur, adipisci velit, sed quia non numquam eius.', 'Modi tempora incidunt ut labore et dolore magnam.' ]; shortContent = this.longContent.slice(0, 8); horizontalItems = [ 'Item 1', 'Item 2', 'Item 3', 'Item 4', 'Item 5', 'Item 6', 'Item 7', 'Item 8', 'Item 9', 'Item 10' ]; tableData = Array.from({ length: 20 }, (_, i) => ({ id: i + 1, name: `Row ${i + 1}`, description: `Description for row ${i + 1} with some longer text`, value: Math.floor(Math.random() * 1000), status: i % 3 === 0 ? 'Active' : i % 3 === 1 ? 'Pending' : 'Inactive' })); // Virtual scrolling data largeDataset = Array.from({ length: 10000 }, (_, i) => ({ id: i + 1, name: `Item ${i + 1}`, description: `This is a description for item number ${i + 1}. It contains some sample text to demonstrate virtual scrolling.` })); virtualConfig: ScrollVirtualConfig = { itemHeight: 60, bufferSize: 5, enabled: true }; gridData = Array.from({ length: 50 }, (_, i) => ({ id: i + 1, content: `Grid item content ${i + 1} with some descriptive text that makes it interesting.` })); // Options scrollbarOptions = ['auto', 'always', 'never'] as const; // State topCount = 0; bottomCount = 0; smoothScrollEnabled = false; currentScrollPosition = { top: 0, left: 0 }; isScrolling = false; // Event handlers onScroll(position: any): void { // Handle scroll event if needed } onReachedTop(): void { this.topCount++; } onReachedBottom(): void { this.bottomCount++; } updateScrollPosition(position: any): void { this.currentScrollPosition = position; } onScrollStart(): void { this.isScrolling = true; } onScrollEnd(): void { this.isScrolling = false; } // Control methods scrollToTop(): void { this.controllableScroll?.scrollToTop(); } scrollToBottom(): void { this.controllableScroll?.scrollToBottom(); } scrollToMiddle(): void { this.controllableScroll?.scrollTo({ top: 1000 }); } toggleSmoothScroll(): void { this.smoothScrollEnabled = !this.smoothScrollEnabled; } // Virtual scrolling trackByItem(item: any): any { return item.id; } }4۾xqimport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SectionComponent } from '../../../../../ui-essentials/src/lib/components/layout/section/section.component'; @Component({ selector: 'ui-section-demo', standalone: true, imports: [CommonModule, SectionComponent], template: `

    Section Component Demo

    Spacing Variants

    @for (spacing of spacings; track spacing) {

    {{ spacing }} spacing

    Section with {{ spacing }} spacing

    This section demonstrates the {{ spacing }} spacing variant with consistent vertical padding.
    }

    Background Variants

    @for (background of backgrounds; track background) {

    {{ background }} background

    {{ background | titlecase }} Background Section

    This section demonstrates the {{ background }} background variant.
    }

    Text Alignment

    @for (align of alignments; track align) {

    {{ align }} aligned

    {{ align | titlecase }} Aligned Content

    This section content is aligned to the {{ align }}.
    }

    Width Variants

    Contained (default)

    Contained Section

    This section is contained with max-width and centered margins.

    Full Width

    Full Width Section

    This section spans the full width of its container without constraints.

    Accessibility Features

    With ARIA label

    Accessible Section

    This section includes proper ARIA labeling for screen readers.

    Real-world Examples

    Hero Section

    Welcome to Our Platform

    This is a hero section with extra large spacing and centered content.

    Content Section

    About Our Services

    This is a standard content section with large spacing and transparent background.

    • Feature one with detailed description
    • Feature two with comprehensive details
    • Feature three with full specifications

    Footer Section

    Contact Information

    This footer section spans full width with contained inner content.
    `, styleUrl: './section-demo.component.scss' }) export class SectionDemoComponent { spacings = ['xs', 'sm', 'md', 'lg', 'xl'] as const; backgrounds = ['transparent', 'surface', 'surface-secondary', 'surface-elevated'] as const; alignments = ['start', 'center', 'end'] as const; }\25x@)import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { SelectComponent, SelectOption } from '../../../../../ui-essentials/src/lib/components/forms/select/select.component'; @Component({ selector: 'ui-select-demo', standalone: true, imports: [ CommonModule, FormsModule, SelectComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Select Component Showcase

    Basic Select

    Size Variants

    Style Variants

    States and Validation

    Full Width

    Complex Options with Disabled Items

    Interactive Controls

    @if (lastSelection()) {
    Last selection: {{ lastSelection() }}
    }

    Code Examples

    Basic Usage:

    <ui-select 
  label="Choose a country"
  placeholder="Select a country"
  [options]="countryOptions"
  [(ngModel)]="selectedCountry"
  (valueChange)="onCountryChange($event)">
</ui-select>

    With Helper Text:

    <ui-select 
  label="Framework"
  placeholder="Select framework"
  helperText="Choose your preferred frontend framework"
  size="large"
  variant="filled"
  [options]="frameworks"
  [(ngModel)]="selectedFramework">
</ui-select>

    Required with Error State:

    <ui-select 
  label="Required field"
  [required]="true"
  errorText="Please select an option"
  [options]="options"
  [(ngModel)]="selectedValue">
</ui-select>

    Options Format:

    const options: SelectOption[] = [
  {{ '{' }} value: 'option1', label: 'Option 1' {{ '}' }},
  {{ '{' }} value: 'option2', label: 'Option 2' {{ '}' }},
  {{ '{' }} value: 'option3', label: 'Option 3 (Disabled)', disabled: true {{ '}' }}
];

    Current Values

    {{ getCurrentValues() }}
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(279, 14%, 35%); font-size: 1.2rem; margin-bottom: 0.5rem; } pre { margin: 0; font-family: 'Courier New', monospace; font-size: 0.9rem; line-height: 1.4; } code { color: hsl(279, 14%, 15%); } section { border: 1px solid #e9ecef; padding: 1.5rem; border-radius: 8px; background: #ffffff; } button:hover { opacity: 0.9; transform: translateY(-1px); } `] }) export class SelectDemoComponent { // Basic selects basicSelect1 = signal(''); basicSelect2 = signal('en'); basicSelect3 = signal(''); // Size variants sizeSmall = signal(''); sizeMedium = signal('medium'); sizeLarge = signal(''); // Style variants variantOutlined = signal(''); variantFilled = signal('filled'); // States stateDisabled = signal('disabled'); stateRequired = signal(''); stateError = signal(''); stateHelper = signal(''); // Full width fullWidthSelect = signal(''); // Complex selects complexSelect1 = signal(''); complexSelect2 = signal('medium'); // Control states globalDisabled = signal(false); lastSelection = signal(''); // Option arrays countryOptions: SelectOption[] = [ { value: 'us', label: 'United States' }, { value: 'ca', label: 'Canada' }, { value: 'uk', label: 'United Kingdom' }, { value: 'de', label: 'Germany' }, { value: 'fr', label: 'France' }, { value: 'jp', label: 'Japan' }, { value: 'au', label: 'Australia' } ]; languageOptions: SelectOption[] = [ { value: 'en', label: 'English' }, { value: 'es', label: 'Spanish' }, { value: 'fr', label: 'French' }, { value: 'de', label: 'German' }, { value: 'it', label: 'Italian' }, { value: 'pt', label: 'Portuguese' }, { value: 'zh', label: 'Chinese' } ]; frameworkOptions: SelectOption[] = [ { value: 'angular', label: 'Angular' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue.js' }, { value: 'svelte', label: 'Svelte' }, { value: 'solid', label: 'SolidJS' } ]; sizeOptions: SelectOption[] = [ { value: 'small', label: 'Small Size' }, { value: 'medium', label: 'Medium Size' }, { value: 'large', label: 'Large Size' } ]; variantOptions: SelectOption[] = [ { value: 'outlined', label: 'Outlined Style' }, { value: 'filled', label: 'Filled Style' } ]; stateOptions: SelectOption[] = [ { value: 'active', label: 'Active' }, { value: 'inactive', label: 'Inactive' }, { value: 'pending', label: 'Pending' } ]; fullWidthOptions: SelectOption[] = [ { value: 'option1', label: 'This is a full width select option' }, { value: 'option2', label: 'Another full width option with longer text' }, { value: 'option3', label: 'Third option demonstrating full width behavior' } ]; roleOptions: SelectOption[] = [ { value: 'user', label: 'User' }, { value: 'moderator', label: 'Moderator' }, { value: 'admin', label: 'Administrator' }, { value: 'super-admin', label: 'Super Administrator', disabled: true }, { value: 'guest', label: 'Guest', disabled: true } ]; priorityOptions: SelectOption[] = [ { value: 'low', label: 'Low Priority' }, { value: 'medium', label: 'Medium Priority' }, { value: 'high', label: 'High Priority' }, { value: 'urgent', label: 'Urgent' }, { value: 'critical', label: 'Critical', disabled: true } ]; onSelectionChange(selectId: string, value: any): void { const selectedOption = this.findOptionByValue(value); const displayValue = selectedOption ? selectedOption.label : value; this.lastSelection.set(`${selectId}: ${displayValue} (${value})`); console.log(`Select ${selectId} changed:`, value); } private findOptionByValue(value: any): SelectOption | undefined { const allOptions = [ ...this.countryOptions, ...this.languageOptions, ...this.frameworkOptions, ...this.sizeOptions, ...this.variantOptions, ...this.stateOptions, ...this.fullWidthOptions, ...this.roleOptions, ...this.priorityOptions ]; return allOptions.find(option => option.value === value); } setDefaultValues(): void { this.basicSelect1.set('us'); this.basicSelect2.set('en'); this.basicSelect3.set('angular'); this.sizeSmall.set('small'); this.sizeMedium.set('medium'); this.sizeLarge.set('large'); this.variantOutlined.set('outlined'); this.variantFilled.set('filled'); this.stateRequired.set('active'); this.stateError.set('pending'); this.stateHelper.set('inactive'); this.fullWidthSelect.set('option2'); this.complexSelect1.set('admin'); this.complexSelect2.set('high'); this.lastSelection.set('All selects set to default values'); } clearAllSelections(): void { this.basicSelect1.set(''); this.basicSelect2.set(''); this.basicSelect3.set(''); this.sizeSmall.set(''); this.sizeMedium.set(''); this.sizeLarge.set(''); this.variantOutlined.set(''); this.variantFilled.set(''); this.stateRequired.set(''); this.stateError.set(''); this.stateHelper.set(''); this.fullWidthSelect.set(''); this.complexSelect1.set(''); this.complexSelect2.set(''); this.lastSelection.set('All selections cleared'); } toggleDisabled(): void { this.globalDisabled.update(disabled => !disabled); this.lastSelection.set(`Global disabled: ${this.globalDisabled() ? 'enabled' : 'disabled'}`); } getCurrentValues(): string { const values = { basic: { country: this.basicSelect1(), language: this.basicSelect2(), framework: this.basicSelect3() }, sizes: { small: this.sizeSmall(), medium: this.sizeMedium(), large: this.sizeLarge() }, variants: { outlined: this.variantOutlined(), filled: this.variantFilled() }, states: { disabled: this.stateDisabled(), required: this.stateRequired(), error: this.stateError(), helper: this.stateHelper() }, layout: { fullWidth: this.fullWidthSelect() }, complex: { roles: this.complexSelect1(), priority: this.complexSelect2() }, controls: { globalDisabled: this.globalDisabled(), lastSelection: this.lastSelection() } }; return JSON.stringify(values, null, 2); } }ak"ةux||h vdF\~lI[)) x[.demo-container { padding: 2rem; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: 3rem; h3 { font-size: 1.5rem; color: #1f2937; margin-bottom: 1rem; border-bottom: 1px solid #d1d5db; padding-bottom: 0.5rem; } } .demo-subsection { margin-bottom: 1.5rem; h4 { font-size: 1.125rem; color: #4b5563; margin-bottom: 0.75rem; } } .demo-row { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; } .demo-column { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1rem; } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-bottom: 1rem; } .demo-item { display: flex; flex-direction: column; gap: 0.5rem; padding: 1rem; background: #f9fafb; border-radius: 0.5rem; border: 1px solid #e5e7eb; label { font-size: 0.75rem; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: 0.5px; } } .demo-interactive { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.75rem; padding: 1.5rem; .demo-controls { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #e5e7eb; .toggle-button { background: #3b82f6; color: white; border: none; border-radius: 0.5rem; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; &:hover { background: #2563eb; transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); } &:active { transform: translateY(0); } } label { display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; color: #6b7280; select { background: #ffffff; border: 1px solid #d1d5db; border-radius: 0.25rem; padding: 0.25rem; font-size: 0.875rem; color: #1f2937; &:focus { outline: 2px solid #3b82f6; outline-offset: 2px; } } } } .demo-content { min-height: 400px; .real-content { h3 { font-size: 1.5rem; color: #1f2937; margin-bottom: 0.5rem; } .meta { font-size: 0.875rem; color: #9ca3af; margin-bottom: 1rem; } img { width: 100%; max-width: 400px; height: auto; border-radius: 0.5rem; margin-bottom: 1rem; } p { font-size: 1rem; line-height: 1.5; color: #1f2937; margin-bottom: 0.75rem; } } } } .best-practices { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.5rem; padding: 1.5rem; ul { list-style: none; padding: 0; margin: 0; li { font-size: 1rem; color: #1f2937; margin-bottom: 0.75rem; padding-left: 1rem; position: relative; &::before { content: '✓'; position: absolute; left: 0; color: #10b981; font-weight: bold; } strong { color: #1f2937; font-weight: 600; } } } } .code-examples { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; .code-example { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 0.5rem; padding: 1rem; h4 { font-size: 0.875rem; color: #6b7280; margin-bottom: 0.5rem; text-transform: uppercase; letter-spacing: 0.5px; } pre { background: #ffffff; border-radius: 0.25rem; padding: 0.5rem; margin: 0; overflow-x: auto; code { font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace; font-size: 0.875rem; color: #1f2937; white-space: pre; line-height: 1.4; } } } } // Responsive adjustments @media (max-width: 768px) { .demo-container { padding: 1rem; } .demo-row { flex-direction: column; } .demo-grid { grid-template-columns: 1fr; } .demo-interactive .demo-controls { flex-direction: column; align-items: flex-start; gap: 0.5rem; } .code-examples { grid-template-columns: 1fr; } } // Dark mode adjustments (if needed in the future) @media (prefers-color-scheme: dark) { .demo-item { background: #374151; border-color: #4b5563; label { color: #9ca3af; } } .demo-interactive { background: #374151; border-color: #4b5563; .demo-controls label select { background: #4b5563; border-color: #6b7280; color: #f3f4f6; } } .best-practices { background: #374151; border-color: #4b5563; ul li { color: #f3f4f6; strong { color: #f3f4f6; } } } .code-examples .code-example { background: #374151; border-color: #4b5563; h4 { color: #9ca3af; } pre { background: #4b5563; code { color: #f3f4f6; } } } .demo-section h3 { color: #f3f4f6; border-color: #6b7280; } .demo-subsection h4 { color: #d1d5db; } }꼹x-import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { SKELETON_COMPONENTS } from '../../../../../ui-essentials/src/lib/components/feedback/skeleton-loader/skeleton-loader.component'; @Component({ selector: 'ui-skeleton-loader-demo', standalone: true, imports: [CommonModule, FormsModule, ...SKELETON_COMPONENTS], template: `

    Skeleton Loader Demo

    Skeleton loaders provide visual placeholders while content is loading, improving perceived performance and user experience.

    Sizes

    @for (size of sizes; track size) {
    }

    Shapes

    @for (shape of shapes; track shape) {
    }

    Animation Types

    @for (animation of animations; track animation) {
    }

    Width Variants

    @for (width of widths; track width) {
    }

    Pre-built Components

    Text Block

    Profile

    Card

    Article

    Table Rows

    @for (row of [1,2,3]; track row) { }

    Skeleton Groups

    Vertical Group

    Horizontal Group

    Grid Group

    Interactive Loading Simulation

    @if (isLoading) { } @else {

    Sample Article Title

    Published on January 15, 2024 by John Doe

    Sample image

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

    Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

    }

    Best Practices

    • Match Content Structure: Skeleton shapes should closely match the final content layout
    • Use Appropriate Animations: Shimmer for fast loading, pulse for slower operations
    • Respect Accessibility: Include proper ARIA labels and roles
    • Consider Performance: Reduce animation complexity on low-performance devices
    • Maintain Consistency: Use consistent skeleton patterns across your application

    Code Examples

    Basic Skeleton

    <ui-skeleton-loader shape="text" size="md"></ui-skeleton-loader>

    Profile Skeleton

    <ui-skeleton-profile avatarSize="lg"></ui-skeleton-profile>

    Custom Group

    <ui-skeleton-group variant="horizontal">
  <ui-skeleton-loader shape="avatar" size="sm"></ui-skeleton-loader>
  <ui-skeleton-loader shape="text" width="w-75"></ui-skeleton-loader>
</ui-skeleton-group>
    `, styleUrl: './skeleton-loader-demo.component.scss' }) export class SkeletonLoaderDemoComponent { sizes = ['xs', 'sm', 'md', 'lg', 'xl'] as const; shapes = ['text', 'heading', 'avatar', 'card', 'button', 'image', 'circle', 'rounded', 'square'] as const; animations = ['shimmer', 'pulse', 'wave'] as const; widths = ['w-25', 'w-50', 'w-75', 'w-full'] as const; isLoading = true; selectedAnimation = 'shimmer' as any; toggleLoading(): void { this.isLoading = !this.isLoading; } onAnimationChange(): void { // Force re-render by toggling loading state if (this.isLoading) { this.isLoading = false; setTimeout(() => { this.isLoading = true; }, 50); } } }dk'x?r·:#˹x import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SnackbarAction, SnackbarComponent } from '../../../../../ui-essentials/src/lib/components/feedback/snackbar/snackbar.component'; @Component({ selector: 'ui-snackbar-demo', standalone: true, imports: [CommonModule, SnackbarComponent], template: `

    Snackbar Demo

    Sizes

    @for (size of sizes; track size) { }

    Variants

    @for (variant of variants; track variant) { }

    With Actions

    Positions

    @for (position of positions; track position) { }

    Click buttons to see snackbars in different positions

    Interactive Examples

    @for (snackbar of activeSnackbars; track snackbar.id) { }

    Demo Status

    Active snackbars: {{ activeSnackbars.length }}

    Total shown: {{ totalShown }}

    Last action: {{ lastAction || 'None' }}

    `, styleUrl: './snackbar-demo.component.scss' }) export class SnackbarDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'primary', 'success', 'warning', 'danger', 'info'] as const; positions = [ 'bottom-center', 'bottom-left', 'bottom-right', 'top-center', 'top-left', 'top-right' ] as const; activeSnackbars: any[] = []; totalShown = 0; lastAction = ''; singleAction: SnackbarAction[] = [ { label: 'UNDO', handler: () => this.handleDemoAction('Undo clicked') } ]; multipleActions: SnackbarAction[] = [ { label: 'RETRY', handler: () => this.handleDemoAction('Retry clicked') }, { label: 'SETTINGS', handler: () => this.handleDemoAction('Settings clicked') } ]; showPositionDemo(position: string): void { this.addSnackbar({ message: `Snackbar at ${position}`, variant: 'primary', position: position as any, showIcon: true, autoDismiss: true, duration: 3000 }); } showSuccessSnackbar(): void { this.addSnackbar({ message: 'Operation completed successfully!', variant: 'success', showIcon: true, actions: this.singleAction }); } showWarningSnackbar(): void { this.addSnackbar({ message: 'Warning: This action cannot be undone', variant: 'warning', showIcon: true, autoDismiss: false }); } showErrorSnackbar(): void { this.addSnackbar({ message: 'Error: Failed to save changes', variant: 'danger', showIcon: true, actions: this.multipleActions, autoDismiss: false }); } showActionSnackbar(): void { this.addSnackbar({ message: 'File moved to trash', variant: 'default', actions: [ { label: 'UNDO', handler: () => { this.handleDemoAction('File restored'); this.removeSnackbar(this.activeSnackbars[this.activeSnackbars.length - 1]?.id); } } ], duration: 6000 }); } private addSnackbar(config: any): void { const snackbar = { id: Date.now() + Math.random(), size: 'md', position: 'bottom-center', autoDismiss: true, duration: 4000, showIcon: false, actions: [], ...config }; this.activeSnackbars.push(snackbar); this.totalShown++; } removeSnackbar(id: number): void { this.activeSnackbars = this.activeSnackbars.filter(s => s.id !== id); } handleActionClick(action: SnackbarAction, snackbarId: number): void { this.lastAction = `${action.label} clicked on snackbar ${snackbarId}`; } private handleDemoAction(action: string): void { this.lastAction = action; } }޸xc@use '../../../../../ui-design-system/src/styles/semantic' as tokens; .demo-container { padding: tokens.$semantic-spacing-layout-md; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: tokens.$semantic-spacing-layout-lg; h3 { margin-bottom: tokens.$semantic-spacing-component-md; color: tokens.$semantic-color-text-primary; font-size: 1.25rem; font-weight: 600; } h4 { margin-bottom: tokens.$semantic-spacing-component-sm; color: tokens.$semantic-color-text-secondary; font-size: 1.125rem; font-weight: 500; } p { color: tokens.$semantic-color-text-secondary; margin-bottom: tokens.$semantic-spacing-component-md; } } .demo-row { display: flex; flex-wrap: wrap; gap: tokens.$semantic-spacing-layout-md; } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: tokens.$semantic-spacing-layout-md; } .demo-spacer-container { display: flex; flex-direction: column; align-items: center; min-width: 200px; margin-bottom: tokens.$semantic-spacing-component-lg; } .demo-direction-container { padding: tokens.$semantic-spacing-component-md; border: 1px solid tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-md; } .demo-horizontal-container { display: flex; align-items: center; border: 2px dashed tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-sm; min-height: 60px; } .demo-vertical-container { display: flex; flex-direction: column; align-items: center; border: 2px dashed tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-sm; min-height: 160px; } .demo-flex-container { margin-bottom: tokens.$semantic-spacing-component-lg; } .demo-flex-row { display: flex; align-items: center; border: 2px dashed tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-sm; min-height: 60px; width: 100%; } .demo-flex-column { display: flex; flex-direction: column; align-items: center; border: 2px dashed tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-sm; height: 200px; width: 100%; } .demo-box { background: tokens.$semantic-color-container-primary; color: tokens.$semantic-color-on-container-primary; padding: tokens.$semantic-spacing-component-sm; border-radius: tokens.$semantic-border-radius-sm; font-weight: 500; min-width: 60px; text-align: center; } .demo-label { font-size: 0.875rem; color: tokens.$semantic-color-text-secondary; margin-bottom: tokens.$semantic-spacing-component-xs; text-align: center; font-weight: 500; } .demo-card { background: tokens.$semantic-color-surface-primary; border: 1px solid tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-md; padding: tokens.$semantic-spacing-component-lg; max-width: 400px; .demo-card-header { font-weight: 600; color: tokens.$semantic-color-text-primary; font-size: 1.125rem; } .demo-card-content { color: tokens.$semantic-color-text-secondary; line-height: 1.5; } .demo-card-actions { display: flex; align-items: center; } } .demo-button { background: tokens.$semantic-color-surface-secondary; color: tokens.$semantic-color-text-primary; border: 1px solid tokens.$semantic-color-border-subtle; border-radius: tokens.$semantic-border-radius-sm; padding: tokens.$semantic-spacing-component-sm tokens.$semantic-spacing-component-md; font-size: 0.875rem; cursor: pointer; &--primary { background: tokens.$semantic-color-container-primary; color: tokens.$semantic-color-on-container-primary; border-color: tokens.$semantic-color-container-primary; } &:hover { opacity: 0.9; } } @media (max-width: 768px) { .demo-row { flex-direction: column; } .demo-grid { grid-template-columns: 1fr; } .demo-spacer-container { min-width: auto; } }z *x8Uq(gqFbQjniFrJUx_import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SpacerComponent } from '../../../../../ui-essentials/src/lib/components/layout/spacer/spacer.component'; @Component({ selector: 'ui-spacer-demo', standalone: true, imports: [CommonModule, SpacerComponent], template: `

    Spacer Demo

    Size Variants

    Spacers with debug mode enabled to show spacing

    @for (size of sizes; track size) {
    {{ size }}
    A
    B
    }

    Directional Spacing

    Horizontal Spacing

    Left
    Right

    Vertical Spacing

    Top
    Bottom

    Component Spacing Variants

    Semantic spacing tokens for different component contexts

    @for (variant of componentVariants; track variant) {
    {{ variant }}
    A
    B
    }

    Layout Spacing Variants

    Semantic spacing tokens for layout elements

    @for (variant of layoutVariants; track variant) {
    {{ variant }}
    Section A
    Section B
    }

    Flexible Spacer

    Spacer that grows to fill available space

    Horizontal Flexible

    Left
    Right

    Vertical Flexible

    Top
    Bottom

    Custom Spacing

    Custom Width: 100px
    A
    B
    Custom Height: 80px
    Top
    Bottom

    Real World Usage

    Card Layout with Spacers

    Header Content
    Main content goes here with proper spacing
    `, styleUrl: './spacer-demo.component.scss' }) export class SpacerDemoComponent { sizes: ('xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl')[] = ['xs', 'sm', 'md', 'lg', 'xl', '2xl', '3xl']; componentVariants: ('component-xs' | 'component-sm' | 'component-md' | 'component-lg' | 'component-xl')[] = [ 'component-xs', 'component-sm', 'component-md', 'component-lg', 'component-xl' ]; layoutVariants: ('layout-xs' | 'layout-sm' | 'layout-md' | 'layout-lg' | 'layout-xl')[] = [ 'layout-xs', 'layout-sm', 'layout-md', 'layout-lg', 'layout-xl' ]; }%jmxop`¦5pxY_o6bZ7; %)P%ka$&JKH9iݑLɲ86V0uGOgi#9MaDexh2͂(͘7pu&8g]=KƗtfzpsW|WAO^dUmtʂQƘ/Sc_>D_WJIiK̒bܿLJT@fQ idpa` 1}tޕQ{L0DB:yz"ޗ4al +lyH:P^rҖ^\L{˧!4sGH[eH2өQ3=]x]@bjZb)9R.VĘʝ-WsD'|-T[g'n= gXY(>$JPKø TҺ{ ]aX"΢ yXy}E"RՀ4jW!F%ECgFMG57 T,ׯKr4 fTHNۙoj,U*:/o@gH87Ƒ,TV}#Ǐߚ)MZnl.\sQ$xY/import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SplitViewComponent, PanelConfig, ResizeEvent } from 'ui-essentials'; @Component({ selector: 'ui-split-view-demo', standalone: true, imports: [CommonModule, SplitViewComponent], template: `

    Split View / Resizable Panels Demo

    Basic Horizontal Split

    Left Panel

    This is the left panel content. Drag the divider to resize!

    You can add any content here including forms, lists, or other components.

    Right Panel

    This is the right panel content.

    Panels maintain their content during resize operations.

    Usage: Drag the vertical divider to resize panels horizontally.

    Basic Vertical Split

    Top Panel

    This is the top panel in a vertical split layout.

    Bottom Panel

    This is the bottom panel. The divider can be dragged vertically.

    Usage: Drag the horizontal divider to resize panels vertically.

    Three Panel Layout

    Sidebar

    Navigation or menu content

    Main Content

    Primary content area with the most space.

    This panel takes up the majority of the available space.

    Details Panel

    Additional information or tools

    Features: Multiple panels with programmatic collapse/expand controls.

    Size Variants

    Small Size

    Small Split View

    Compact layout with reduced spacing.

    Right Panel

    Smaller padding and gaps.

    Large Size

    Large Split View

    Spacious layout with generous spacing and padding.

    Perfect for complex layouts requiring more visual breathing room.

    Right Panel

    Enhanced spacing creates a more luxurious feel.

    Sizes: sm (compact), md (default), lg (spacious) - affects padding and spacing.

    Panel Size Constraints

    Constrained Panel

    Min: 150px, Max: 400px

    Try resizing - this panel has size constraints!

    Flexible Panel

    No constraints - adapts to available space.

    Constraints: Left panel has min-width of 150px and max-width of 400px.

    Disabled State

    Disabled Split View

    Resizing is disabled - dividers cannot be dragged.

    Static Panel

    All interaction is disabled when the component is in disabled state.

    Disabled: All resize functionality is disabled.

    Nested Split Views

    Left Panel

    This is the outer left panel.

    Nested Top

    This is a nested split view inside the right panel.

    Nested Bottom

    Fully functional nested resizable panels.

    Nesting: Split views can be nested to create complex layouts.

    Resize Events

    Last Resize Event: {{ lastResizeEvent || 'None' }}

    Resize Count: {{ resizeCount }}

    `, styleUrl: './split-view-demo.component.scss' }) export class SplitViewDemoComponent { resizeCount = 0; lastResizeEvent = ''; // Basic horizontal panels basicHorizontalPanels: PanelConfig[] = [ { id: 'left-panel', size: '40%' }, { id: 'right-panel', size: '60%' } ]; // Basic vertical panels basicVerticalPanels: PanelConfig[] = [ { id: 'top-panel', size: '30%' }, { id: 'bottom-panel', size: '70%' } ]; // Three panel layout threePanelLayout: PanelConfig[] = [ { id: 'sidebar', size: '250px', minSize: 200, maxSize: 400, variant: 'secondary' }, { id: 'main-content', size: '1fr', variant: 'primary' }, { id: 'details-panel', size: '300px', minSize: 250, maxSize: 500, variant: 'elevated' } ]; // Size variant panels sizeVariantPanels: PanelConfig[] = [ { id: 'size-left', size: '50%' }, { id: 'size-right', size: '50%' } ]; sizeVariantPanels2: PanelConfig[] = [ { id: 'size-left-lg', size: '40%' }, { id: 'size-right-lg', size: '60%' } ]; // Constrained panels constrainedPanels: PanelConfig[] = [ { id: 'constrained-left', size: '300px', minSize: 150, maxSize: 400 }, { id: 'constrained-right', size: '1fr' } ]; // Nested panels outerNestedPanels: PanelConfig[] = [ { id: 'outer-left', size: '30%' }, { id: 'outer-right', size: '70%' } ]; innerNestedPanels: PanelConfig[] = [ { id: 'inner-top', size: '40%' }, { id: 'inner-bottom', size: '60%' } ]; onPanelResized(event: ResizeEvent): void { this.resizeCount++; this.lastResizeEvent = `Panel ${event.panelId} resized to ${Math.round(event.newSize)}px (${event.direction})`; console.log('Panel resized:', event); } collapsePanel(panelId: string): void { const panel = this.threePanelLayout.find(p => p.id === panelId); if (panel) { panel.collapsed = true; } } expandPanel(panelId: string): void { const panel = this.threePanelLayout.find(p => p.id === panelId); if (panel) { panel.collapsed = false; } } resetThreePanelSizes(): void { this.threePanelLayout = [ { id: 'sidebar', size: '250px', minSize: 200, maxSize: 400, variant: 'secondary' }, { id: 'main-content', size: '1fr', variant: 'primary' }, { id: 'details-panel', size: '300px', minSize: 250, maxSize: 500, variant: 'elevated' } ]; } }̿x?1import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faPlay, faUndo } from '@fortawesome/free-solid-svg-icons'; import { StepperComponent, StepperStep } from '../../../../../ui-essentials/src/lib/components/navigation/stepper'; @Component({ selector: 'ui-stepper-demo', standalone: true, imports: [CommonModule, StepperComponent, FontAwesomeModule], template: `

    Stepper Demo

    Orientation

    Horizontal Stepper

    Vertical Stepper

    Sizes

    @for (size of sizes; track size) {

    {{ size }} Size

    }

    Variants

    Default

    Outlined

    Dense Layout

    Normal

    Dense

    Step States

    All States

    Navigation Modes

    Linear (Default)

    Non-Linear

    Interactive Example

    Current Step: {{ getCurrentStepInfo() }}

    Completed Steps: {{ getCompletedStepsCount() }}

    Last Action: {{ lastAction }}

    `, styleUrl: './stepper-demo.component.scss' }) export class StepperDemoComponent { sizes = ['sm', 'md', 'lg'] as const; playIcon = faPlay; resetIcon = faUndo; lastAction = 'None'; // Horizontal stepper data horizontalSteps: StepperStep[] = [ { id: 'h1', title: 'Account Info', description: 'Enter your personal details', current: true }, { id: 'h2', title: 'Verification', description: 'Verify your email address' }, { id: 'h3', title: 'Preferences', description: 'Set up your preferences' }, { id: 'h4', title: 'Complete', description: 'Account setup finished' } ]; // Vertical stepper data verticalSteps: StepperStep[] = [ { id: 'v1', title: 'Project Setup', description: 'Initialize your new project', completed: true }, { id: 'v2', title: 'Configuration', description: 'Configure project settings', current: true }, { id: 'v3', title: 'Dependencies', description: 'Install required dependencies' }, { id: 'v4', title: 'Testing', description: 'Run initial tests' }, { id: 'v5', title: 'Deployment', description: 'Deploy to production' } ]; // Size demonstration sizeSteps: StepperStep[] = [ { id: 's1', title: 'Step 1', completed: true }, { id: 's2', title: 'Step 2', current: true }, { id: 's3', title: 'Step 3' } ]; // Variant demonstration variantSteps: StepperStep[] = [ { id: 'var1', title: 'Design', completed: true }, { id: 'var2', title: 'Development', current: true }, { id: 'var3', title: 'Testing' }, { id: 'var4', title: 'Launch' } ]; // Dense demonstration denseSteps: StepperStep[] = [ { id: 'd1', title: 'Upload', completed: true }, { id: 'd2', title: 'Process', current: true }, { id: 'd3', title: 'Review' }, { id: 'd4', title: 'Publish' } ]; // State demonstration stateSteps: StepperStep[] = [ { id: 'st1', title: 'Completed', description: 'This step is done', completed: true }, { id: 'st2', title: 'Current', description: 'Currently active step', current: true }, { id: 'st3', title: 'Error', description: 'This step has an error', error: true }, { id: 'st4', title: 'Disabled', description: 'This step is disabled', disabled: true }, { id: 'st5', title: 'Pending', description: 'This step is pending' } ]; // Linear stepper linearSteps: StepperStep[] = [ { id: 'l1', title: 'Start', description: 'Begin the process', current: true }, { id: 'l2', title: 'Middle', description: 'Continue the process' }, { id: 'l3', title: 'End', description: 'Finish the process' } ]; // Non-linear stepper nonLinearSteps: StepperStep[] = [ { id: 'nl1', title: 'Overview', description: 'Click any step', completed: true }, { id: 'nl2', title: 'Details', description: 'Add more information', current: true }, { id: 'nl3', title: 'Review', description: 'Check your work' } ]; // Interactive example interactiveSteps: StepperStep[] = [ { id: 'i1', title: 'Planning', description: 'Plan your approach', current: true }, { id: 'i2', title: 'Implementation', description: 'Build the solution' }, { id: 'i3', title: 'Testing', description: 'Test thoroughly' }, { id: 'i4', title: 'Deployment', description: 'Go live' } ]; onStepClick(type: string, event: {step: StepperStep, index: number}): void { this.lastAction = `${type}: Clicked step "${event.step.title}" (index ${event.index})`; console.log(`${type} stepper - Step clicked:`, event); } onStepChange(type: string, event: {step: StepperStep, index: number}): void { this.lastAction = `${type}: Changed to step "${event.step.title}" (index ${event.index})`; console.log(`${type} stepper - Step changed:`, event); } nextLinearStep(): void { const currentIndex = this.linearSteps.findIndex(step => step.current); if (currentIndex >= 0 && currentIndex < this.linearSteps.length - 1) { // Mark current as completed this.linearSteps[currentIndex].completed = true; this.linearSteps[currentIndex].current = false; // Move to next this.linearSteps[currentIndex + 1].current = true; this.lastAction = `Linear: Advanced to step ${currentIndex + 2}`; } } resetLinearStepper(): void { this.linearSteps.forEach((step, index) => { step.current = index === 0; step.completed = false; step.error = false; }); this.lastAction = 'Linear: Reset to beginning'; } onInteractiveStepClick(event: {step: StepperStep, index: number}): void { this.lastAction = `Interactive: Clicked "${event.step.title}"`; } onInteractiveStepChange(event: {step: StepperStep, index: number}): void { this.lastAction = `Interactive: Changed to "${event.step.title}"`; } markCurrentCompleted(): void { const currentStep = this.interactiveSteps.find(step => step.current); if (currentStep) { currentStep.completed = true; currentStep.error = false; this.lastAction = `Interactive: Marked "${currentStep.title}" as completed`; } } markCurrentError(): void { const currentStep = this.interactiveSteps.find(step => step.current); if (currentStep) { currentStep.error = true; currentStep.completed = false; this.lastAction = `Interactive: Marked "${currentStep.title}" as error`; } } nextInteractiveStep(): void { const currentIndex = this.interactiveSteps.findIndex(step => step.current); if (currentIndex >= 0 && currentIndex < this.interactiveSteps.length - 1) { // Mark current as completed if not in error if (!this.interactiveSteps[currentIndex].error) { this.interactiveSteps[currentIndex].completed = true; } this.interactiveSteps[currentIndex].current = false; // Move to next this.interactiveSteps[currentIndex + 1].current = true; this.lastAction = `Interactive: Advanced to step ${currentIndex + 2}`; } } resetInteractiveStepper(): void { this.interactiveSteps.forEach((step, index) => { step.current = index === 0; step.completed = false; step.error = false; }); this.lastAction = 'Interactive: Reset to beginning'; } getCurrentStepInfo(): string { const currentStep = this.interactiveSteps.find(step => step.current); return currentStep ? `${currentStep.title} (${this.interactiveSteps.indexOf(currentStep) + 1} of ${this.interactiveSteps.length})` : 'None'; } getCompletedStepsCount(): number { return this.interactiveSteps.filter(step => step.completed).length; } }qx 2.demo-container { padding: 2rem; max-width: 1200px; margin: 0 auto; } .demo-section { margin-bottom: 3rem; h3 { margin-bottom: 1.5rem; padding-bottom: 0.5rem; border-bottom: 1px solid #e0e0e0; } h4 { margin-bottom: 1rem; font-size: 1.1rem; } } .demo-scroll-container { height: 400px; overflow-y: auto; border: 2px solid #f0f0f0; border-radius: 8px; position: relative; background: linear-gradient(to bottom, #fafafa, #f0f0f0); } .demo-content-spacer { padding: 2rem; min-height: 600px; p { margin-bottom: 2rem; text-align: center; font-weight: 500; } } .demo-filler { height: 100px; margin: 1rem 0; background: linear-gradient(135deg, #e3f2fd, #bbdefb); border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 500; color: #1976d2; } .demo-content { padding: 1rem 2rem; background: #fff; border-radius: 4px; font-weight: 500; text-align: center; color: #333; } .demo-content-small { padding: 0.75rem 1.5rem; background: #fff; border-radius: 4px; font-weight: 500; text-align: center; color: #333; font-size: 0.9rem; } .demo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; margin-top: 1rem; } .demo-row { display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 1rem; } .demo-variant-example { padding: 1.5rem; border: 1px solid #e0e0e0; border-radius: 8px; background: #fafafa; position: relative; min-height: 120px; h4 { position: absolute; top: 0.5rem; left: 1rem; margin: 0; font-size: 0.9rem; color: #666; } } .demo-effect-example { padding: 1.5rem; border: 1px solid #e0e0e0; border-radius: 8px; background: linear-gradient(135deg, #f8f9fa, #e9ecef); position: relative; min-height: 120px; h4 { position: absolute; top: 0.5rem; left: 1rem; margin: 0; font-size: 0.9rem; color: #666; } } .demo-controls { display: flex; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; label { display: flex; flex-direction: column; gap: 0.5rem; font-weight: 500; select { padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px; min-width: 120px; } input[type="checkbox"] { width: 18px; height: 18px; } } } .demo-preview { height: 300px; border: 2px dashed #ddd; border-radius: 8px; position: relative; overflow: auto; background: linear-gradient(45deg, #f9f9f9 25%, transparent 25%), linear-gradient(-45deg, #f9f9f9 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f9f9f9 75%), linear-gradient(-45deg, transparent 75%, #f9f9f9 75%); background-size: 20px 20px; background-position: 0 0, 0 10px, 10px -10px, -10px 0px; } @media (max-width: 768px) { .demo-container { padding: 1rem; } .demo-grid { grid-template-columns: 1fr; } .demo-row { flex-direction: column; } .demo-controls { flex-direction: column; label { flex-direction: row; align-items: center; select { min-width: auto; flex: 1; } } } }Y5ximport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { StickyLayoutComponent } from 'ui-essentials'; @Component({ selector: 'ui-sticky-layout-demo', standalone: true, imports: [CommonModule, FormsModule, StickyLayoutComponent], template: `

    Sticky Layout Demo

    Scroll down to see the sticky positioning in action.

    Position Variants

    Sticky Top Header

    Scroll down to see sticky positioning...

    Content area 1
    Content area 2
    Content area 3
    Content area 4
    Content area 5
    Sticky Bottom Footer

    Variant Styles

    @for (variant of variants; track variant.name) {

    {{ variant.name }}

    {{ variant.name }} Sticky
    }

    Offset Variants

    @for (offset of offsets; track offset) {
    Offset: {{ offset }}
    }

    Background & Effects

    Blur Effect

    Blurred Background

    Backdrop

    Backdrop Filter

    Floating

    Floating Style

    Toolbar

    Toolbar Style

    Size Variants

    @for (size of sizes; track size) {
    Size: {{ size }}
    }

    Interactive Example

    Dynamic Sticky Layout
    `, styleUrl: './sticky-layout-demo.component.scss' }) export class StickyLayoutDemoComponent { positions = ['top', 'bottom', 'left', 'right'] as const; offsets = ['xs', 'sm', 'md', 'lg', 'xl'] as const; sizes = ['auto', 'full', 'content'] as const; variantOptions = ['default', 'header', 'sidebar', 'footer', 'floating', 'toolbar'] as const; variants = [ { name: 'Header', variant: 'header' as const, position: 'top' as const, shadow: true, background: 'surface' as const }, { name: 'Sidebar', variant: 'sidebar' as const, position: 'left' as const, shadow: false, background: 'surface-secondary' as const }, { name: 'Footer', variant: 'footer' as const, position: 'bottom' as const, shadow: true, background: 'surface' as const }, { name: 'Floating', variant: 'floating' as const, position: 'top' as const, shadow: true, background: 'surface-elevated' as const }, { name: 'Toolbar', variant: 'toolbar' as const, position: 'top' as const, shadow: true, background: 'surface-elevated' as const } ]; // Interactive controls selectedPosition: typeof this.positions[number] = 'top'; selectedVariant: typeof this.variantOptions[number] = 'header'; enableShadow = true; enableBorder = false; enableBlur = false; updateConfig(): void { console.log('Sticky layout config updated:', { position: this.selectedPosition, variant: this.selectedVariant, shadow: this.enableShadow, border: this.enableBorder, blur: this.enableBlur }); } }ۑx\1import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { SupportingPaneLayoutComponent } from 'ui-essentials'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faHome, faCog, faUser, faChartBar, faFileText, faBell, faBookmark, faTag, faCalendar, faComment } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-supporting-pane-layout-demo', standalone: true, imports: [CommonModule, FormsModule, SupportingPaneLayoutComponent, FontAwesomeModule], template: `

    Supporting Pane Layout Demo

    A layout component with main content and a collapsible supporting pane for additional information, tools, or navigation.

    Position Variants

    Right Position (Default)

    Main Content Area

    This is the primary content area where your main application content would be displayed.

    Analytics Dashboard

    Key metrics and performance indicators would be shown here.

    Recent Documents

    A list of recently accessed or modified documents.

    Quick Settings

    Notifications
    Profile Settings
    Saved Items
    Tools

    Left Position

    Main Content Area

    Content area with supporting pane on the left side.

    Messages

    Recent messages and communications.

    Tags & Categories

    Design
    Development
    Marketing
    Research
    Categories

    Size Variants

    Size: {{ selectedSize.toUpperCase() }}

    The supporting pane width changes based on the selected size variant.

    Supporting Information

    Pane size: {{ selectedSize }}

    Current size: {{ selectedSize.toUpperCase() }}
    Responsive: Yes
    Collapsible: Yes
    Size: {{ selectedSize.toUpperCase() }}

    Visual Variants

    Variant: {{ selectedVariant | titlecase }}

    Different visual styles for the supporting pane.

    Visual Style

    Current variant: {{ selectedVariant }}

    Variant Demo

    {{ selectedVariant | titlecase }} variant applied

    This demonstrates the {{ selectedVariant }} visual styling.

    {{ selectedVariant | titlecase }} Style

    Features & Options

    Features Demo

    This demo shows various configuration options:

    • Sticky Pane: {{ stickyPane ? 'Enabled' : 'Disabled' }}
    • Always Visible: {{ alwaysVisible ? 'Enabled' : 'Disabled' }}
    • Show Footer: {{ showFooter ? 'Enabled' : 'Disabled' }}

    Content Block {{ i }}

    This is example content to demonstrate scrolling behavior when sticky pane is enabled.

    Configuration

    Sticky: {{ stickyPane ? 'Yes' : 'No' }}
    Always Visible: {{ alwaysVisible ? 'Yes' : 'No' }}
    Footer: {{ showFooter ? 'Shown' : 'Hidden' }}
    Events: {{ eventCount }} triggered
    Options
    Last event: {{ lastEvent }}
    `, styleUrl: './supporting-pane-layout-demo.component.scss' }) export class SupportingPaneLayoutDemoComponent { // FontAwesome icons faHome = faHome; faCog = faCog; faUser = faUser; faChartBar = faChartBar; faFileText = faFileText; faBell = faBell; faBookmark = faBookmark; faTag = faTag; faCalendar = faCalendar; faComment = faComment; // Demo state sizes = ['sm', 'md', 'lg', 'xl'] as const; variants = ['default', 'bordered', 'elevated', 'subtle'] as const; selectedSize: 'sm' | 'md' | 'lg' | 'xl' = 'md'; selectedVariant: 'default' | 'bordered' | 'elevated' | 'subtle' = 'default'; // Pane collapsed states rightPaneCollapsed = false; leftPaneCollapsed = false; sizePaneCollapsed = false; variantPaneCollapsed = false; featuresPaneCollapsed = false; // Feature options stickyPane = false; alwaysVisible = false; showFooter = false; // Event tracking eventCount = 0; lastEvent = 'None'; onPaneCollapsed(): void { this.eventCount++; this.lastEvent = 'Pane Collapsed'; console.log('Supporting pane collapsed'); } onPaneExpanded(): void { this.eventCount++; this.lastEvent = 'Pane Expanded'; console.log('Supporting pane expanded'); } }op1x?+import { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormControl, FormGroup, ReactiveFormsModule, Validators, FormsModule } from '@angular/forms'; import { SwitchComponent } from '../../../../../ui-essentials/src/lib/components/forms/switch/switch.component'; @Component({ selector: 'ui-switch-demo', standalone: true, imports: [ CommonModule, ReactiveFormsModule, FormsModule, SwitchComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Switch Component Showcase

    Basic Switches

    Variants

    States

    Size Comparison

    Switches without Labels

    Small
    Medium
    Large

    With Helper Text

    Reactive Forms Integration

    Form Values:

    {{ getFormValues() }}

    Usage Examples

    Basic Switch:

    <ui-switch 
  label="Enable feature"
  size="md"
  variant="primary"
  (switchChange)="onToggle($event)">
</ui-switch>

    Switch with Helper Text:

    <ui-switch 
  label="Email Notifications"
  helperText="Receive updates via email"
  variant="success"
  [ngModel]="emailEnabled"
  (switchChange)="toggleEmail($event)">
</ui-switch>

    Reactive Form Switch:

    <ui-switch 
  formControlName="agreement"
  label="I agree to terms"
  variant="primary"
  [required]="true">
</ui-switch>

    Switch without Label:

    <ui-switch 
  size="lg"
  variant="secondary"
  ariaLabel="Toggle feature"
  (switchChange)="handleToggle($event)">
</ui-switch>

    Interactive Demo

    Live Preview:

    Current state: {{ demoCheckedValue ? 'ON' : 'OFF' }}
    @if (lastAction()) {
    Last Action: {{ lastAction() }}
    }
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } select, input[type="checkbox"] { cursor: pointer; } label { cursor: pointer; } `] }) export class SwitchDemoComponent { lastAction = signal(''); // Template values for ngModel binding preCheckedValue = true; autoSaveValue = true; // Interactive demo properties demoSizeValue: 'sm' | 'md' | 'lg' = 'md'; demoVariantValue: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' = 'primary'; demoDisabledValue = false; demoRequiredValue = false; demoWithHelperValue = false; demoCheckedValue = false; // Reactive form settingsForm = new FormGroup({ notifications: new FormControl(false), newsletter: new FormControl(true), analytics: new FormControl(false, [Validators.requiredTrue]), marketing: new FormControl(false) }); handleToggle(switchName: string, checked: boolean): void { const action = `${switchName}: ${checked ? 'ON' : 'OFF'}`; this.lastAction.set(action); console.log(`Switch toggled - ${action}`); } handleDemoToggle(checked: boolean): void { this.demoCheckedValue = checked; this.handleToggle('Interactive Demo', checked); } getFormValues(): string { const values = this.settingsForm.value; return JSON.stringify(values, null, 2); } resetForm(): void { this.settingsForm.reset({ notifications: false, newsletter: false, analytics: false, marketing: false }); this.lastAction.set('Form reset to default values'); } toggleAllSwitches(): void { const allEnabled = Object.values(this.settingsForm.value).every(val => val === true); const newState = !allEnabled; this.settingsForm.patchValue({ notifications: newState, newsletter: newState, analytics: newState, marketing: newState }); this.lastAction.set(`All switches turned ${newState ? 'ON' : 'OFF'}`); } }+ilbxR~@f;(Mx/import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { TabsContainerComponent, Tab } from '../../../../../ui-essentials/src/lib/components/layout/tabs-container/tabs-container.component'; @Component({ selector: 'ui-tabs-container-demo', standalone: true, imports: [CommonModule, FormsModule, TabsContainerComponent], template: `

    Tabs Container Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size | titlecase }} Size

    Content for {{ size }} tabs. Use tab selection to see different content.
    }

    Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }} Variant

    {{ variant | titlecase }} variant tabs with different styling approaches.
    }

    Tab Positions

    @for (position of positions; track position) {

    {{ position | titlecase }} Position

    Tabs positioned {{ position }} with appropriate navigation layout.
    }

    Closeable Tabs

    Closeable tabs demo - try closing tabs with the × button. Some tabs cannot be closed.

    Close tabs by clicking the × button. Some tabs cannot be closed.

    Tabs with Icons

    Tabs with icons provide visual context and better user experience.

    Scrollable Tabs

    Scrollable tabs for when you have many tabs that exceed container width.

    Use scroll controls when tabs overflow the container width.

    Reorderable Tabs

    Drag and drop reorderable tabs - try dragging tabs to rearrange them.

    Drag tabs to reorder them. Order changes: {{ reorderCount() }}

    Lazy Loading

    Lazy loading tabs optimize performance by loading content only when needed.

    Lazy tabs only load content when first selected.

    Disabled States

    Disabled tabs prevent user interaction while maintaining visual hierarchy.

    Disabled tabs cannot be selected or interacted with.

    Interactive Example

    Interactive demo with configurable options - use controls above to customize behavior.

    Current tab: {{ activeTab() || 'None' }}

    Tab selections: {{ tabSelectCount() }}

    `, styleUrl: './tabs-container-demo.component.scss' }) export class TabsContainerDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['default', 'filled', 'pills', 'underlined'] as const; positions = ['top', 'bottom', 'left', 'right'] as const; // Demo state activeTab = signal(''); tabSelectCount = signal(0); reorderCount = signal(0); // Interactive demo controls interactiveSize: 'sm' | 'md' | 'lg' = 'md'; interactiveVariant: 'default' | 'filled' | 'pills' | 'underlined' = 'default'; interactivePosition: 'top' | 'bottom' | 'left' | 'right' = 'top'; interactiveScrollable = false; interactiveReorderable = false; // Tab collections private _closeableTabs = signal([ { id: 'doc1', label: 'Document 1', closeable: true }, { id: 'doc2', label: 'Document 2', closeable: true }, { id: 'doc3', label: 'Important Doc', closeable: false }, { id: 'doc4', label: 'Temp File', closeable: true } ]); private _reorderableTabs = signal([ { id: 'order1', label: 'First' }, { id: 'order2', label: 'Second' }, { id: 'order3', label: 'Third' }, { id: 'order4', label: 'Fourth' } ]); private _interactiveTabs = signal([ { id: 'int1', label: 'Tab One', closeable: true, icon: '1️⃣' }, { id: 'int2', label: 'Tab Two', closeable: true, icon: '2️⃣' }, { id: 'int3', label: 'Tab Three', closeable: false, icon: '3️⃣' }, { id: 'int4', label: 'Tab Four', closeable: true, icon: '4️⃣' } ]); basicTabs(): Tab[] { return [ { id: 'tab1', label: 'Tab 1' }, { id: 'tab2', label: 'Tab 2' }, { id: 'tab3', label: 'Tab 3' } ]; } iconTabs(): Tab[] { return [ { id: 'home', label: 'Home', icon: '🏠' }, { id: 'settings', label: 'Settings', icon: '⚙️' }, { id: 'profile', label: 'Profile', icon: '👤' }, { id: 'notifications', label: 'Notifications', icon: '🔔' } ]; } manyTabs(): Tab[] { return Array.from({ length: 12 }, (_, i) => ({ id: `many${i + 1}`, label: `Tab ${i + 1}`, closeable: i > 2 })); } lazyTabs(): Tab[] { return [ { id: 'eager', label: 'Eager Load', lazyLoad: false }, { id: 'lazy1', label: 'Lazy Tab 1', lazyLoad: true }, { id: 'lazy2', label: 'Lazy Tab 2', lazyLoad: true } ]; } disabledTabs(): Tab[] { return [ { id: 'enabled1', label: 'Enabled' }, { id: 'disabled', label: 'Disabled', disabled: true }, { id: 'enabled2', label: 'Also Enabled' } ]; } closeableTabs = this._closeableTabs.asReadonly(); reorderableTabs = this._reorderableTabs.asReadonly(); interactiveTabs = this._interactiveTabs.asReadonly(); handleTabSelect(context: string, tabId: string): void { console.log(`Tab selected in ${context}:`, tabId); this.activeTab.set(tabId); this.tabSelectCount.update(count => count + 1); } handleTabClose(tabId: string): void { console.log('Tab closed:', tabId); this._closeableTabs.update(tabs => tabs.filter(tab => tab.id !== tabId)); } handleTabsReorder(newTabs: Tab[]): void { console.log('Tabs reordered:', newTabs); this._reorderableTabs.set(newTabs); this.reorderCount.update(count => count + 1); } handleInteractiveTabClose(tabId: string): void { console.log('Interactive tab closed:', tabId); this._interactiveTabs.update(tabs => tabs.filter(tab => tab.id !== tabId)); } handleInteractiveTabsReorder(newTabs: Tab[]): void { console.log('Interactive tabs reordered:', newTabs); this._interactiveTabs.set(newTabs); } updateInteractiveConfig(): void { // Trigger change detection for interactive demo console.log('Interactive config updated:', { size: this.interactiveSize, variant: this.interactiveVariant, position: this.interactivePosition, scrollable: this.interactiveScrollable, reorderable: this.interactiveReorderable }); } }>xG7import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { TagInputComponent } from '../../../../../ui-essentials/src/lib/components/forms/tag-input/tag-input.component'; import { ButtonComponent } from '../../../../../ui-essentials/src/lib/components/buttons/button.component'; import { faTag, faPlus, faTimes, faRefresh } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-tag-input-demo', standalone: true, imports: [ CommonModule, ReactiveFormsModule, TagInputComponent, ButtonComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Tag Input Component Showcase

    Basic Variants

    Outlined (Default)

    Filled

    Size Variants

    Small

    Medium (Default)

    Large

    Configuration Options

    Max Tags (3)

    Max Tag Length (10)

    Allow Duplicates

    No Trimming

    States

    Normal

    Disabled

    Read Only

    With Error

    Form Integration

    Reactive Form Example

    Skills (Optional)

    Submit Form Reset
    @if (formSubmitted) {
    Form Submitted!
    Tags: {{ formData.tags?.join(', ') || 'None' }}
    Skills: {{ formData.skills?.join(', ') || 'None' }}
    }

    Programmatic Control

    Add Random Tag Clear All Add Multiple Get as String

    Usage Examples

    Basic Usage:

    <ui-tag-input 
  placeholder="Add tags..."
  (tagAdd)="onTagAdd($event)"
  (tagRemove)="onTagRemove($event)">
</ui-tag-input>

    With Constraints:

    <ui-tag-input 
  placeholder="Add up to 5 tags"
  [maxTags]="5"
  [maxTagLength]="20"
  [allowDuplicates]="false"
  helpText="Each tag can be up to 20 characters"
  (maxTagsReached)="onMaxTags()"
  (duplicateTag)="onDuplicate($event)">
</ui-tag-input>

    Form Integration:

    <form [formGroup]="myForm">
  <ui-tag-input 
    formControlName="tags"
    placeholder="Required tags"
    [errorMessage]="getFieldError('tags')">
  </ui-tag-input>
</form>

    Custom Separators:

    <ui-tag-input 
  placeholder="Use space or dash to separate"
  [separators]="[' ', '-']"
  helpText="Tags separated by space or dash">
</ui-tag-input>

    Event Log

    @if (lastAction) {
    Last action: {{ lastAction }}
    }
    Clear Log Show Alert
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(287, 12%, 35%); font-size: 1.125rem; margin-bottom: 0.75rem; } section { border: 1px solid hsl(289, 14%, 90%); border-radius: 8px; padding: 1.5rem; background: hsl(286, 20%, 99%); } .demo-tag-input { width: 100%; max-width: 500px; } pre { font-size: 0.875rem; line-height: 1.5; margin: 0.5rem 0; } code { font-family: 'JetBrains Mono', monospace; color: #d63384; } `] }) export class TagInputDemoComponent { lastAction: string = ''; // FontAwesome icons faTag = faTag; faPlus = faPlus; faTimes = faTimes; faRefresh = faRefresh; // Form demoForm = new FormGroup({ tags: new FormControl([], [ Validators.required, this.minTagsValidator(2) ]), skills: new FormControl([]) }); formSubmitted = false; formData: { tags?: string[]; skills?: string[] } = {}; // Predefined tags for programmatic control predefinedTags = [ 'JavaScript', 'TypeScript', 'Angular', 'React', 'Vue', 'HTML', 'CSS', 'SCSS', 'Node.js', 'Python', 'Java', 'Design', 'Frontend', 'Backend', 'Fullstack' ]; // Event handlers handleTagAdd(source: string, tag: string): void { this.lastAction = `Tag added (${source}): "${tag}"`; console.log(`Tag added (${source}):`, tag); } handleTagRemove(source: string, event: { tag: string; index: number }): void { this.lastAction = `Tag removed (${source}): "${event.tag}" at index ${event.index}`; console.log(`Tag removed (${source}):`, event); } handleDuplicateTag(source: string, tag: string): void { this.lastAction = `Duplicate tag attempted (${source}): "${tag}"`; console.log(`Duplicate tag attempted (${source}):`, tag); } handleValidationError(source: string, error: { tag: string; error: string }): void { this.lastAction = `Validation error (${source}): "${error.tag}" - ${error.error}`; console.log(`Validation error (${source}):`, error); } handleMaxTagsReached(source: string): void { this.lastAction = `Maximum tags reached (${source})`; console.log(`Maximum tags reached (${source})`); } // Form methods minTagsValidator(min: number) { return (control: any) => { const tags = control.value; if (!tags || tags.length < min) { return { minTags: { required: min, actual: tags?.length || 0 } }; } return null; }; } getFormFieldError(fieldName: string): string | undefined { const field = this.demoForm.get(fieldName); if (field && field.invalid && (field.dirty || field.touched)) { const errors = field.errors; if (errors?.['required']) { return 'This field is required'; } if (errors?.['minTags']) { return `At least ${errors['minTags'].required} tags are required`; } } return undefined; } handleFormSubmit(): void { if (this.demoForm.valid) { const formValue = this.demoForm.value; this.formData = { tags: formValue.tags || [], skills: formValue.skills || [] }; this.formSubmitted = true; this.lastAction = 'Form submitted successfully'; console.log('Form submitted:', this.formData); } else { this.lastAction = 'Form submission failed - validation errors'; console.log('Form invalid:', this.demoForm.errors); } } resetForm(): void { this.demoForm.reset(); this.formSubmitted = false; this.formData = {}; this.lastAction = 'Form reset'; console.log('Form reset'); } // Programmatic control methods addPredefinedTag(tagInput: TagInputComponent): void { const randomTag = this.predefinedTags[Math.floor(Math.random() * this.predefinedTags.length)]; const success = tagInput.addTagProgrammatically(randomTag); this.lastAction = success ? `Programmatically added: "${randomTag}"` : `Failed to add: "${randomTag}"`; console.log('Add predefined tag result:', success, randomTag); } clearProgrammaticInput(tagInput: TagInputComponent): void { tagInput.clear(); this.lastAction = 'Programmatically cleared all tags'; console.log('Cleared programmatic input'); } addMultipleTags(tagInput: TagInputComponent): void { const tagsToAdd = ['HTML', 'CSS', 'JavaScript']; let addedCount = 0; tagsToAdd.forEach(tag => { if (tagInput.addTagProgrammatically(tag)) { addedCount++; } }); this.lastAction = `Programmatically added ${addedCount}/${tagsToAdd.length} tags`; console.log(`Added ${addedCount} multiple tags`); } getTagsAsString(tagInput: TagInputComponent): void { const tagsString = tagInput.getTagsAsString(); this.lastAction = `Tags as string: "${tagsString}"`; alert(`Current tags: ${tagsString || 'None'}`); console.log('Tags as string:', tagsString); } // Utility methods clearEventLog(): void { this.lastAction = ''; } showAlert(message: string): void { alert(message); this.lastAction = 'Alert shown'; } }~ x"Qݮimport { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { TextareaComponent } from '../../../../../ui-essentials/src/lib/components/forms/input/textarea.component'; import { faComment, faEdit, faEnvelope } from '@fortawesome/free-solid-svg-icons'; @Component({ selector: 'ui-textarea-demo', standalone: true, imports: [ CommonModule, FormsModule, TextareaComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Textarea Component Showcase

    Basic Textarea

    Size Variants

    Style Variants

    States and Validation

    Interactive States

    Character Limits and Counters

    Rows and Resize Options

    Icons and Clearable Features

    Interactive Controls

    @if (lastChange()) {
    Last change: {{ lastChange() }}
    }

    Code Examples

    Basic Usage:

    <ui-textarea 
  label="Message"
  placeholder="Enter your message..."
  [(ngModel)]="message"
  (textareaChange)="onMessageChange($event)">
</ui-textarea>

    With Character Limit:

    <ui-textarea 
  label="Tweet"
  placeholder="What's happening?"
  [maxLength]="280"
  [showCharacterCount]="true"
  size="lg"
  [(ngModel)]="tweetText">
</ui-textarea>

    Auto-resize with Validation:

    <ui-textarea 
  label="Feedback"
  [required]="true"
  [autoResize]="true"
  [clearable]="true"
  state="error"
  errorMessage="Please provide feedback"
  [prefixIcon]="faComment"
  [(ngModel)]="feedback">
</ui-textarea>

    Resize Options:

    // Resize options:
resize="none"       // No resize
resize="vertical"   // Vertical only (default)
resize="horizontal" // Horizontal only
resize="both"       // Both directions

    Current Values

    {{ getCurrentValues() }}
    `, styles: [` h2 { color: hsl(279, 14%, 11%); font-size: 2rem; margin-bottom: 2rem; border-bottom: 2px solid hsl(258, 100%, 47%); padding-bottom: 0.5rem; } h3 { color: hsl(279, 14%, 25%); font-size: 1.5rem; margin-bottom: 1rem; } h4 { color: hsl(279, 14%, 35%); font-size: 1.2rem; margin-bottom: 0.5rem; } pre { margin: 0; font-family: 'Courier New', monospace; font-size: 0.9rem; line-height: 1.4; } code { color: hsl(279, 14%, 15%); } section { border: 1px solid #e9ecef; padding: 1.5rem; border-radius: 8px; background: #ffffff; } button:hover { opacity: 0.9; transform: translateY(-1px); } `] }) export class TextareaDemoComponent { // FontAwesome icons readonly faComment = faComment; readonly faEdit = faEdit; readonly faEnvelope = faEnvelope; // Basic textareas basicTextarea1 = signal(''); basicTextarea2 = signal(''); basicTextarea3 = signal('This is pre-filled content that demonstrates how the textarea looks with existing text.'); // Size variants sizeSmall = signal(''); sizeMedium = signal(''); sizeLarge = signal(''); // Style variants variantOutlined = signal(''); variantFilled = signal(''); variantUnderlined = signal(''); // States stateDefault = signal(''); stateSuccess = signal('Great job on completing this form!'); stateWarning = signal('Please review this content carefully.'); stateError = signal('This content has some issues.'); // Interactive states stateDisabled = signal('This content cannot be edited'); stateReadonly = signal('This is read-only information that you can view but not modify'); stateRequired = signal(''); stateLoading = signal(''); // Character limits charLimit1 = signal(''); charLimit2 = signal(''); charLimit3 = signal(''); // Rows and resize rowsCompact = signal(''); rowsExpanded = signal(''); autoResizeTextarea = signal('Start typing and watch this textarea grow automatically as you add more content...'); horizontalResize = signal(''); bothResize = signal(''); // Icons and clearable iconPrefix = signal(''); iconSuffix = signal(''); clearableTextarea = signal('You can clear this text by clicking the X button'); // Control states globalDisabled = signal(false); lastChange = signal(''); onTextareaChange(textareaId: string, value: string): void { const preview = value.length > 50 ? value.substring(0, 50) + '...' : value; this.lastChange.set(`${textareaId}: "${preview}" (${value.length} chars)`); console.log(`Textarea ${textareaId} changed:`, value); } onClear(textareaId: string): void { this.lastChange.set(`${textareaId}: cleared`); console.log(`Textarea ${textareaId} cleared`); } fillSampleText(): void { const sampleTexts = [ 'This is sample text for demonstration purposes.', 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.', 'Here is some example content to show how the textarea handles different amounts of text.', 'Sample content with multiple lines.\nSecond line of content.\nThird line for testing.', 'Short text', 'A longer piece of sample text that demonstrates how the textarea component handles various lengths of content and provides a good example for testing purposes.' ]; this.basicTextarea1.set(sampleTexts[0]); this.basicTextarea2.set(sampleTexts[1]); this.sizeSmall.set(sampleTexts[4]); this.sizeMedium.set(sampleTexts[2]); this.sizeLarge.set(sampleTexts[5]); this.variantOutlined.set(sampleTexts[0]); this.variantFilled.set(sampleTexts[1]); this.variantUnderlined.set(sampleTexts[2]); this.stateDefault.set(sampleTexts[3]); this.stateRequired.set(sampleTexts[0]); this.stateLoading.set(sampleTexts[1]); this.charLimit1.set('Sample text within limit'); this.charLimit2.set('This is a tweet-style message that fits within the character limit.'); this.charLimit3.set(sampleTexts[5]); this.rowsCompact.set('Compact'); this.rowsExpanded.set(sampleTexts[3]); this.iconPrefix.set('Comment with icon'); this.iconSuffix.set('Email content here'); this.clearableTextarea.set('This text can be cleared'); this.lastChange.set('All textareas filled with sample text'); } clearAllTextareas(): void { this.basicTextarea1.set(''); this.basicTextarea2.set(''); this.sizeSmall.set(''); this.sizeMedium.set(''); this.sizeLarge.set(''); this.variantOutlined.set(''); this.variantFilled.set(''); this.variantUnderlined.set(''); this.stateDefault.set(''); this.stateRequired.set(''); this.stateLoading.set(''); this.charLimit1.set(''); this.charLimit2.set(''); this.charLimit3.set(''); this.rowsCompact.set(''); this.rowsExpanded.set(''); this.autoResizeTextarea.set(''); this.horizontalResize.set(''); this.bothResize.set(''); this.iconPrefix.set(''); this.iconSuffix.set(''); this.clearableTextarea.set(''); this.lastChange.set('All textareas cleared'); } toggleDisabled(): void { this.globalDisabled.update(disabled => !disabled); this.lastChange.set(`Global disabled: ${this.globalDisabled() ? 'enabled' : 'disabled'}`); } getCurrentValues(): string { const values = { basic: { textarea1: this.basicTextarea1(), textarea2: this.basicTextarea2(), textarea3: this.basicTextarea3() }, sizes: { small: this.sizeSmall(), medium: this.sizeMedium(), large: this.sizeLarge() }, variants: { outlined: this.variantOutlined(), filled: this.variantFilled(), underlined: this.variantUnderlined() }, states: { default: this.stateDefault(), success: this.stateSuccess(), warning: this.stateWarning(), error: this.stateError(), disabled: this.stateDisabled(), readonly: this.stateReadonly(), required: this.stateRequired(), loading: this.stateLoading() }, characterLimits: { limit100: this.charLimit1(), limit280: this.charLimit2(), limit1000: this.charLimit3() }, rowsAndResize: { compact: this.rowsCompact(), expanded: this.rowsExpanded(), autoResize: this.autoResizeTextarea(), horizontal: this.horizontalResize(), both: this.bothResize() }, iconsAndClearable: { prefix: this.iconPrefix(), suffix: this.iconSuffix(), clearable: this.clearableTextarea() }, controls: { globalDisabled: this.globalDisabled(), lastChange: this.lastChange() } }; return JSON.stringify(values, null, 2); } }cFfx 1import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { TimePickerComponent, TimeValue } from '../../../../../ui-essentials/src/lib/components/forms/time-picker/time-picker.component'; @Component({ selector: 'ui-time-picker-demo', standalone: true, imports: [CommonModule, FormsModule, TimePickerComponent], template: `

    Time Picker Demo

    Sizes

    @for (size of sizes; track size) {

    {{ size | uppercase }}

    }

    Variants

    @for (variant of variants; track variant) {

    {{ variant | titlecase }}

    }

    Time Formats

    12-Hour Format

    24-Hour Format

    With Seconds

    Custom Steps

    States

    Default

    Error

    Success

    Warning

    Features

    Required Field

    Disabled

    Not Clearable

    With Presets

    Interactive Example

    Selected Time:

    {{ interactiveValue ? formatTime(interactiveValue) : 'No time selected' }}

    24-hour format: {{ interactiveValue ? format24Hour(interactiveValue) : 'N/A' }}

    Change count: {{ changeCount }}

    Form Integration

    Form Valid: {{ demoForm.valid }}

    Form Values:

    {{ formValues | json }}
    `, styleUrl: './time-picker-demo.component.scss' }) export class TimePickerDemoComponent { sizes = ['sm', 'md', 'lg'] as const; variants = ['outlined', 'filled', 'underlined'] as const; sampleValues: Record = { sm: null, md: null, lg: null }; variantValues: Record = { outlined: null, filled: null, underlined: null }; formatValues: Record = { twelve: null, twentyFour: null, withSeconds: null, customSteps: null }; stateValues: Record = { default: null, error: null, success: { hours: 9, minutes: 30, seconds: 0 }, warning: null }; featureValues: Record = { required: null, disabled: { hours: 12, minutes: 0, seconds: 0 }, notClearable: null, presets: null }; interactiveValue: TimeValue | null = null; changeCount = 0; formValues = { startTime: null as TimeValue | null, endTime: null as TimeValue | null, breakTime: null as TimeValue | null, duration: null as TimeValue | null }; // Preset times for demo presetTimes = [ { label: '9:00 AM', value: { hours: 9, minutes: 0, seconds: 0 } }, { label: '12:00 PM', value: { hours: 12, minutes: 0, seconds: 0 } }, { label: '1:00 PM', value: { hours: 13, minutes: 0, seconds: 0 } }, { label: '5:00 PM', value: { hours: 17, minutes: 0, seconds: 0 } } ]; breakPresets = [ { label: '15 min', value: { hours: 0, minutes: 15, seconds: 0 } }, { label: '30 min', value: { hours: 0, minutes: 30, seconds: 0 } }, { label: '1 hour', value: { hours: 1, minutes: 0, seconds: 0 } } ]; onTimeChange(time: TimeValue | null): void { this.changeCount++; console.log('Time changed:', time); } onSubmit(): void { console.log('Form submitted:', this.formValues); alert('Form submitted! Check console for values.'); } resetForm(form: any): void { form.resetForm(); this.formValues = { startTime: null, endTime: null, breakTime: null, duration: null }; } formatTime(time: TimeValue): string { const hours = time.hours; const displayHour = hours === 0 ? 12 : hours > 12 ? hours - 12 : hours; const period = hours >= 12 ? 'PM' : 'AM'; const minutes = time.minutes.toString().padStart(2, '0'); if (time.seconds !== undefined && time.seconds > 0) { const seconds = time.seconds.toString().padStart(2, '0'); return `${displayHour}:${minutes}:${seconds} ${period}`; } return `${displayHour}:${minutes} ${period}`; } format24Hour(time: TimeValue): string { const hours = time.hours.toString().padStart(2, '0'); const minutes = time.minutes.toString().padStart(2, '0'); if (time.seconds !== undefined && time.seconds > 0) { const seconds = time.seconds.toString().padStart(2, '0'); return `${hours}:${minutes}:${seconds}`; } return `${hours}:${minutes}`; } }JxXYS#7~Wtærl0&Te䅢bF4D9gye0ᴊڮ, Zh rn֡Z#9#\ zqrY!1kwvZO;r&S i$mn G#0*Y QoS{F1'xp;8zаj: j8$ i{$[it=R(F4Ť(ɞZ+B"±b~$.G`!م'B ChOq.yq5+v=hKbjָ~C4 le=OCy񸇖f;KǽUA;]rwre?e[E0?mCFbÉF!<@$% ׉_T3:" 7!Y9Ʉ5Gm0B"G[CM !i1X~r] DOie/ y&ɖD({qJ^.x-ǒC/Csk6H!峒#Eqb7ieϝAYA#V,"jZ^-|RH,oA#;e+Rυx(v=Aϖ:av|Zq Cl6JBRM! Rex̩WvCzimwj];RBAza58 5>HB̗.҆nDy X1^yj6XZ\+'Ț r*fZfB1OqJG7爮nvw胛\8 a>v0mhF5 ɴe)J%D& XE"iTB]NnϏ_WYnSk{8;TxummqnX=7? x2g24,C `v1$1(8  Q<a"edgPt+2%g^\[cxhFu*L{33`WNw=%ȗ(8R:QDaI0bTW;p"&Qc*Fv26+絼 *VdVt}oλMݙ7a!\}[:` :4J8b'޶-￐L_s}H{5+w nlBl0?Z DUJi9M]xO`$-h楌$cM M9'azb&T׺S;FoOo2|Y&ZpK'TUG a+l,V. D~pG 6D2Mbam34A4`#iYWn +wP^`GkέxKǥB:{-I0dT5QU,ٯ8C'74Bb1mǴ3;UV乺ˇŊ&cխG25ǡuz ^l${Â687aC\㚚U5,y[- Gp'Yy5 ]+E7ONגφ >c١!hO_V^xXA8쾻/'ky;u>ِTO(űV Ճ?1ihar 8!}OŊmd]%;_U!:bF`.:xYo6_q͋$۵ON4H7,][1HCTRw]dx;>R2) ^l^&L#dOʸLx7QC+4w?rMDƉ%v8oYe\T=Ჿɬ8_r-Su̒N X(e'luϫBc/j8jxdQ=RM` 1Ob  Ur \=Z|C +PgpD zO#\d\d7p:Ɵ;B& 1+ s Q(YQCٜk@\̬8rg!\8Ŕ`p57ʻJuRШ`m`4-.g@O}. !<MyևK<@^kt3ݧ>\oN88(>ܑ Nh$`rں2Mic4'ZN>]!1;9oa'kBgxk'{2G4M;{ŏ;)UfG_l&2&H|>x?7zg"IJ:tqk|2#n5Xn9,>w& 4}'APf݆: AohT&(WraaPDqGٰv$肍OZ")+I&XL(*~gXZ$5#KorFDH%\-tPM, JLڎ=}9N3 \,ʾ>e1X②2:MdFn91Sµӱg\6kkX~L=&J| g "Dt*",v'BxRb0=)IT+l;;yImRIxZc!2K?)@$vg[]*>xUn1y|mQ6 oXe nHm\͹;E v/|J\W7Q^˲SZfb7!lMp9,* ;3}.V6]k &޸4lΤtHٖJq;ie d&smbK6پ=w<+uNq_JaF(kƧROxZG4w龵=Ki;&*an6et31} Q oNgzޗJ&0Jx#|և{[N`bS bҵLzS*jҘLdj,+ĉ1(b9nx $Xfl IFUKf^eS4Gó?oȠF-X!ḌdGӍ6φˮ zW!;|q;}6kusΙTM3\6lj+z[Dr-.R{e }}bʜڡ*V9!ׯ02hUo;Z-|^=k\u $xdfB۝'Npڜ' o ExdfB۝R2KK3uSSJ2s'.4ܜ' fCxBimport { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { TooltipComponent } from '../../../../../ui-essentials/src/public-api'; @Component({ selector: 'ui-tooltip-demo', standalone: true, imports: [CommonModule, TooltipComponent], template: `

    Tooltip Demo

    Positions

    Sizes

    Triggers

    Different Elements

    Hover me
    ?

    States

    Custom Delay

    Interactive

    Show count: {{ showCount }} | Hide count: {{ hideCount }}

    `, styleUrl: './tooltip-demo.component.scss' }) export class TooltipDemoComponent { showCount = 0; hideCount = 0; handleTooltipShow(): void { this.showCount++; console.log('Tooltip shown', this.showCount); } handleTooltipHide(): void { this.hideCount++; console.log('Tooltip hidden', this.hideCount); } }#xZ5import { Component, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { TransferListComponent, TransferListItem } from '../../../../../ui-essentials/src/lib/components/data-display/transfer-list/transfer-list.component'; @Component({ selector: 'ui-transfer-list-demo', standalone: true, imports: [CommonModule, TransferListComponent], template: `

    Transfer List Demo

    Basic Transfer List

    Select items from the source list and transfer them to the target list using the control buttons.

    Size Variants

    Small

    Medium (Default)

    Large

    Configuration Options

    With Disabled Items

    Some items can be disabled and cannot be selected or transferred.

    Large Dataset

    Transfer list with a large number of items to test performance and search functionality.

    Custom Labels & Accessibility

    Event Log

    @if (eventLog().length === 0) {

    No events logged yet. Interact with the transfer lists above to see events.

    } @else { @for (event of eventLog(); track $index) {
    {{ event.type }}: {{ event.message }} {{ event.timestamp | date:'short' }}
    } } @if (eventLog().length > 0) { }
    `, styleUrl: './transfer-list-demo.component.scss' }) export class TransferListDemoComponent { // Basic example data basicSourceItems = signal([ { id: 1, label: 'Apple' }, { id: 2, label: 'Banana' }, { id: 3, label: 'Cherry' }, { id: 4, label: 'Date' }, { id: 5, label: 'Elderberry' }, { id: 6, label: 'Fig' }, { id: 7, label: 'Grape' }, { id: 8, label: 'Honeydew' } ]); basicTargetItems = signal([ { id: 9, label: 'Orange' }, { id: 10, label: 'Pear' } ]); // Size variant data sizeSourceItems = signal([ { id: 'size1', label: 'Item 1' }, { id: 'size2', label: 'Item 2' }, { id: 'size3', label: 'Item 3' } ]); sizeTargetItems = signal([ { id: 'size4', label: 'Item 4' } ]); // Configuration example data configSourceItems = signal([ { id: 'config1', label: 'Configuration Option 1' }, { id: 'config2', label: 'Configuration Option 2' }, { id: 'config3', label: 'Configuration Option 3' }, { id: 'config4', label: 'Configuration Option 4' }, { id: 'config5', label: 'Configuration Option 5' } ]); configTargetItems = signal([]); // Configuration toggles showSearch = signal(true); showSelectAll = signal(true); showCheckboxes = signal(true); showMoveAll = signal(true); isDisabled = signal(false); // Disabled items example disabledSourceItems = signal([ { id: 'dis1', label: 'Regular Item 1' }, { id: 'dis2', label: 'Disabled Item', disabled: true }, { id: 'dis3', label: 'Regular Item 2' }, { id: 'dis4', label: 'Another Disabled Item', disabled: true }, { id: 'dis5', label: 'Regular Item 3' } ]); disabledTargetItems = signal([]); // Large dataset largeSourceItems = signal(this.generateLargeDataset()); largeTargetItems = signal([]); // Custom labels example customSourceItems = signal([ { id: 'perm1', label: 'Read Users', data: { permission: 'users:read' } }, { id: 'perm2', label: 'Write Users', data: { permission: 'users:write' } }, { id: 'perm3', label: 'Delete Users', data: { permission: 'users:delete' } }, { id: 'perm4', label: 'Read Posts', data: { permission: 'posts:read' } }, { id: 'perm5', label: 'Write Posts', data: { permission: 'posts:write' } }, { id: 'perm6', label: 'Delete Posts', data: { permission: 'posts:delete' } }, { id: 'perm7', label: 'Manage Settings', data: { permission: 'settings:manage' } }, { id: 'perm8', label: 'View Analytics', data: { permission: 'analytics:view' } } ]); customTargetItems = signal([]); // Event logging eventLog = signal>([]); // Generate large dataset for performance testing private generateLargeDataset(): TransferListItem[] { const items: TransferListItem[] = []; const categories = ['Documents', 'Images', 'Videos', 'Audio', 'Archives', 'Code']; const types = ['Personal', 'Work', 'Project', 'Backup', 'Temp']; for (let i = 1; i <= 100; i++) { const category = categories[i % categories.length]; const type = types[i % types.length]; items.push({ id: `large${i}`, label: `${category} - ${type} File ${i.toString().padStart(3, '0')}`, data: { category, type, index: i } }); } return items; } // Event handlers for basic example onBasicSourceChange(items: TransferListItem[]) { this.basicSourceItems.set(items); this.logEvent('Source Change', `Basic source now has ${items.length} items`); } onBasicTargetChange(items: TransferListItem[]) { this.basicTargetItems.set(items); this.logEvent('Target Change', `Basic target now has ${items.length} items`); } // Event handlers for configuration example onConfigSourceChange(items: TransferListItem[]) { this.configSourceItems.set(items); this.logEvent('Config Source Change', `Config source now has ${items.length} items`); } onConfigTargetChange(items: TransferListItem[]) { this.configTargetItems.set(items); this.logEvent('Config Target Change', `Config target now has ${items.length} items`); } // Event handlers for disabled items example onDisabledSourceChange(items: TransferListItem[]) { this.disabledSourceItems.set(items); this.logEvent('Disabled Source Change', `Disabled source now has ${items.length} items`); } onDisabledTargetChange(items: TransferListItem[]) { this.disabledTargetItems.set(items); this.logEvent('Disabled Target Change', `Disabled target now has ${items.length} items`); } // Event handlers for large dataset example onLargeSourceChange(items: TransferListItem[]) { this.largeSourceItems.set(items); this.logEvent('Large Source Change', `Large source now has ${items.length} items`); } onLargeTargetChange(items: TransferListItem[]) { this.largeTargetItems.set(items); this.logEvent('Large Target Change', `Large target now has ${items.length} items`); } // Event handlers for custom example onCustomSourceChange(items: TransferListItem[]) { this.customSourceItems.set(items); this.logEvent('Custom Source Change', `Custom source now has ${items.length} items`); } onCustomTargetChange(items: TransferListItem[]) { this.customTargetItems.set(items); this.logEvent('Custom Target Change', `Custom target now has ${items.length} items`); } // Item move event handler onItemMove(event: { item: TransferListItem; from: 'source' | 'target'; to: 'source' | 'target' }) { this.logEvent('Item Move', `Moved "${event.item.label}" from ${event.from} to ${event.to}`); } // Configuration toggle methods toggleSearch() { this.showSearch.update(value => !value); this.logEvent('Config Change', `Search ${this.showSearch() ? 'enabled' : 'disabled'}`); } toggleSelectAll() { this.showSelectAll.update(value => !value); this.logEvent('Config Change', `Select All ${this.showSelectAll() ? 'enabled' : 'disabled'}`); } toggleCheckboxes() { this.showCheckboxes.update(value => !value); this.logEvent('Config Change', `Checkboxes ${this.showCheckboxes() ? 'enabled' : 'disabled'}`); } toggleMoveAll() { this.showMoveAll.update(value => !value); this.logEvent('Config Change', `Move All buttons ${this.showMoveAll() ? 'enabled' : 'disabled'}`); } toggleDisabled() { this.isDisabled.update(value => !value); this.logEvent('Config Change', `Component ${this.isDisabled() ? 'disabled' : 'enabled'}`); } // Event logging private logEvent(type: string, message: string) { this.eventLog.update(log => [ { type, message, timestamp: new Date() }, ...log.slice(0, 9) // Keep only the last 10 events ]); } clearEventLog() { this.eventLog.set([]); } }x0yfxZO۸ϧ`rdL$EL6mñh$ "d:az@{HJ)QGKF,C= R E%(x:hrLO%Ee-}Nȟ)#C9Pl}gW|Ǣj|"E /w8mEX!e1 @n)4sc|!Nb2,1:È$,8AcD&M'Ǝi3>3)-H п7"As~ޓ ,$](Y/$h-~7kW9 4nQ:mf9 \71g,-/X\H~)?z.$u 9.́[(b :XyS`;\RB})tByooWd~ϖ˸Z͆_#1 fnڞxFE}ybq);g%GáHԘT݅L"x?lJ&XsґL#ɤFZǂu1FxI#)At vB! +zz#-IѠD=b;p -+Ia)w-`guW][#.;ߗX˕8I&;Rf&xWKr{ЂƐ[o7A_QHMλ0](a*I݋T,81}H{sZڈs8}E!FHK>h㌓ezTw3&8(elA\F6~OLU-`Hs۳c6m2ud53&yxNp,L}.oH}"s}(-H$-lOmq0xݴ4k]~mް{.H.?$n&PF0z׮Lᬞm-K% ,HOuԤJoiVys\%ԭﺏysg ԫJ紺$UM\UN9UJrPXd',c%-VsvO߾ 3sWP`}_(Uy0(ܟێEһBthJ>̌PU4V,0fkb馝P=@P7tNvv Ψl(88(l7 8 ^~a&n#o\0QABpRCex*Vk% ӆY2/_m KHQǿ ˃bU}ֶ⎱`8&hhTdKU4HrՃ K]G]vJq9tN< !?0*%ucm[U)|[txVnJhs8e1BJ2A`Bұ."h0Pk5Lpև]T:?0v|AfJW#iX;7XXψLmu[S&ZY툹R8w.1a.1@xm)䝜K0 ^LҥXm+vkw͈+ zԭ| nF3t|N5Y\ԟ,Je)z~WB_9 ET}ۧdLY<7LreښsK-:U+G{6}lJ$;}ٚXO0l˕'`Dz!ep@XU1y|s|4x&xB_~FFieel xHmimport { Component, ChangeDetectionStrategy, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; import { VideoPlayerComponent, VideoSource, VideoTrack, VideoPlayerSize, VideoPlayerVariant } from '../../../../../ui-essentials/src/lib/components/media/video-player/video-player.component'; @Component({ selector: 'app-video-player-demo', standalone: true, imports: [ CommonModule, VideoPlayerComponent ], changeDetection: ChangeDetectionStrategy.OnPush, template: `

    Video Player Component Showcase

    Video Player Variants

    Default Player

    Minimal Player

    Theater Player

    Size Variants

    Small (sm)

    Medium (md) - Default

    Large (lg)

    Feature Demonstrations

    Player with Subtitles

    Autoplay Player (Muted)

    Player without Volume Control

    Disabled Player

    Interactive Demo

    Customize the video player below by toggling different options:

    @if (lastEvent()) {
    Last event: {{ lastEvent() }}
    }

    Real-world Examples

    Course Video Player

    Typical setup for educational content with subtitles and chapter markers

    Product Demo Player

    Autoplay setup for product demonstrations and marketing content

    Media Gallery Player

    Compact player for media galleries and previews

    Error Handling

    Invalid Video Source

    Demonstrates error handling when video fails to load

    Code Examples

    Basic Video Player:

    <ui-video-player
  [sources]="videoSources"
  poster="poster-image.jpg"
  [showControls]="true"
  ariaLabel="Demo video player">
</ui-video-player>

    Video Player with Subtitles:

    <ui-video-player
  [sources]="videoSources"
  [tracks]="subtitleTracks"
  poster="poster-image.jpg"
  size="lg"
  [showControls]="true"
  [allowFullscreen]="true"
  (play)="onVideoPlay()"
  (pause)="onVideoPause()">
</ui-video-player>

    Autoplay Video (Marketing/Demo):

    <ui-video-player
  [sources]="videoSources"
  variant="minimal"
  size="md"
  [autoplay]="true"
  [muted]="true"
  [loop]="true"
  [showVolumeControl]="false"
  [allowFullscreen]="false">
</ui-video-player>
    `, styleUrl: './video-player-demo.component.scss' }) export class VideoPlayerDemoComponent { // State signals lastEvent = signal(''); // Demo video sources - using sample videos from the web basicVideoSources = signal([ { src: 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4', type: 'video/mp4', quality: '1080p', label: 'HD' }, { src: 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.webm', type: 'video/webm', quality: '1080p', label: 'HD WebM' } ]); errorVideoSources = signal([ { src: 'https://invalid-url.example.com/nonexistent.mp4', type: 'video/mp4', quality: '1080p', label: 'Invalid Source' } ]); videoTracks = signal([ { src: 'data:text/vtt;base64,V0VCVlRUCgowMDowMDowMC4wMDAgLS0+IDAwOjAwOjA1LjAwMAo8Zm9udCBjb2xvcj0iI2ZmZmZmZiI+U2FtcGxlIHN1YnRpdGxlIHRleHQ8L2ZvbnQ+CgowMDowMDowNS4wMDAgLS0+IDAwOjAwOjEwLjAwMAo8Zm9udCBjb2xvcj0iI2ZmZmZmZiI+VGhpcyBpcyBhIGRlbW9uc3RyYXRpb24gb2Ygc3VidGl0bGVzPC9mb250Pg==', kind: 'subtitles', srclang: 'en', label: 'English', default: true } ]); // Demo configuration demoConfig = signal({ size: 'md' as VideoPlayerSize, variant: 'default' as VideoPlayerVariant, autoplay: false, loop: false, showControls: true, showVolumeControl: true, allowFullscreen: true, disabled: false, poster: 'https://images.unsplash.com/photo-1574717024653-61fd2cf4d44d?w=800&h=450&fit=crop' }); handleVideoEvent(event: string): void { this.lastEvent.set(`${event} at ${new Date().toLocaleTimeString()}`); console.log(`Video event: ${event}`); } handleTimeUpdate(time: number): void { // Only log significant time updates to avoid console spam if (Math.floor(time) % 10 === 0) { console.log(`Time update: ${this.formatTime(time)}`); } } handleVolumeChange(volume: number): void { this.lastEvent.set(`Volume changed to ${Math.round(volume * 100)}% at ${new Date().toLocaleTimeString()}`); console.log(`Volume changed: ${volume}`); } handleFullscreenChange(isFullscreen: boolean): void { this.lastEvent.set(`${isFullscreen ? 'Entered' : 'Exited'} fullscreen at ${new Date().toLocaleTimeString()}`); console.log(`Fullscreen: ${isFullscreen}`); } handleVideoError(event: Event): void { this.lastEvent.set(`Video error occurred at ${new Date().toLocaleTimeString()}`); console.error('Video error:', event); } updateDemoConfig(key: string, event: Event): void { const target = event.target as HTMLInputElement; const value = target.checked; this.demoConfig.update(config => ({ ...config, [key]: value })); } updateDemoSize(event: Event): void { const target = event.target as HTMLSelectElement; const size = target.value as VideoPlayerSize; this.demoConfig.update(config => ({ ...config, size })); } updateDemoVariant(event: Event): void { const target = event.target as HTMLSelectElement; const variant = target.value as VideoPlayerVariant; this.demoConfig.update(config => ({ ...config, variant })); } private formatTime(seconds: number): string { if (isNaN(seconds)) return '0:00'; const minutes = Math.floor(seconds / 60); const secs = Math.floor(seconds % 60); return `${minutes}:${secs.toString().padStart(2, '0')}`; } }S` x4qD L-8\x!rk^Cl cɑn#USxZmo7_ ,w8SwvcDN0Pj%e[W߼풒Wp|8YEڠTA}U-Ϻ-+ݎ ךw{6p+{Ҵm9趟H ˛`xTv=:.: .zADt<:>nM97)5տٺt/w.p>yжEE ;|:ޔ`_,A5ˬJi~oȺt!N66-fP3䃞67 ÉVW%^T 6wjN[z, Lo_ZlPq+S+rV6NpYۺV{ИfշfJqck\\^`]ZPX.rSS9] ޵̃y%4^ؤ5X lqvk w^҂nꩋ({aa7'2Ik>MZ ~n*Gf3gIK3 FV\E/ {yI/ƻM[cy6p$ڙ5 G$1?%zUշOSVW~bTىChZ<n+yB$cez ChqRߎ|$V2@{BxUSA9Qo;\yx:걂~3:QO鲪 `ܽ<и)Q-o?|W."qxʜ4? p U7w]1ۉlXjlZ6vi(z,uONꀷ֔^|9 pӏo ~豛 rGޟ7 ޡy*6!`zN2wSFm:=J)UCဓ'W5`%澀ïoJu Hz(ወFN%ak0G)Ea߾4jӦW2u74;I;$6uH܁q1lԉow+Cwߓk_4 #.-r@&_@" H1b0y՜d0 0 Z$|0 HhP*BlޘtfA4ep>obNdHĤ̘d52IA7QΠ.[!ATmbwz/P gE1Љ -Q$Ș~pq:Z 5  7[P[15Y![u<C%=Wdl"lIiQ(c|  sͷ6p3@S=v\QvHlHc[hː&.IlG9RvO6ژrm% i-3!־mjPF8XHb>С5aDPP?YB|+'2KI.n02_[-RX ӳ"|\ !Q+l*\uR>eÂJ'T˸T\:Mp8-L`[CßHI(;*"2?1Ӭů+RYZUF% }91nlN'6Nb`-~͓mAp"ej.~ע%|v3hiv*ɔ-|^". kPyTe >EW}\X:tA.!vL>>xG?Ѝ"} > (R[ KI .yB^h"wV'R:㦝'ro8j׳U?mQ!OLl,'M?b̞-&;V9w9>ïNWP=dBZA I_lyj_0zEXxPLX faNewspaper=, faCircleDot, faColumns, faFolderOpen, faDesktop, faListUl(DemoRoutes, A faCircleDot = faCircleDot; faColumns = faColumns; faFolderOpen = faFolderOpen; faDesktop = faDesktop; faNewspaper = f!aNewspaper; faListUl = faListUliaspect-ratio", "Aspect RatioF$8bento-grid", "Bento Gridt!0box", "Box (Padding/Margin)#/9breakpoint-container", "Breakpoint Container", this.faEyeQ 6enter", "Center (Content Alignment)", this.faCircleDotQ &olumn", "Column Layout", this.faColumnA 5"($*eed-layout", "Feed Layout", this.faNewspap! flex", "Flex (Flexbox Container)"2!O grid-container", "Grid Containert!0@4-detail-layout", "List Detail Layout", this.faListUl #croll-container", "Scroll Container00supporting-pane-layout", "Supporting Pane Layout79section", "Section (Semantic Wrapper)", this.faLayerGroup +idebar-layout", "Sidebar Layout", this.faBa1!!Bstack", "Stack (VStack/HStack)03abs-container", "Tabs Container", this.faFolderOpenQ3dashboard-shell", "Dashboard Shell", this.faDesktop{"(%}c7x3{M͏K6gM>/%, խ gcxs}6͏U6gd|Xd'RrHlΒ)J0 &CxoX`,, faArrowDown, faThumbtack, 8 faArrowDown = faArrowDown; faThumbtack = faThumbtack9allery-grid", "Gallery Grid/$Iinfinite-scroll-container", "Infinite Scroll Container", this.faArrowDown!kanban-board", "Kanban Board#7%Smasonry", "Masonry Layout\%0%*plit-view", "Split View / Resizable Panels#0'M1sticky-layout", "Sticky Layout", this.faThumbtack!'cessibility", "Accessability+nimations", "Animati+hcl-studio", "HCL Theme++-manager", "Font Manager+data-utils", "Data Util+code-display", "Code Display+ } +k S~x.`g- // Landing?"ndingChildren = [ 1conversion", "Conversion9#/$landing-feature-grid", "Feature Grid9#/$landing-testimonials", "Testimonials+- landing-logo-cloud", "Logo Cloud+04landing-statistics", "Statistics", this.faCaretUp), 1landing-faq", "FAQ+0landing-team", "Team+0landing-,&3landing-templates", "Templates", this.faCaretUp), ^landing", "Landing-landingChildren); - .backgrounds", "Backgrounds/Ȟx>yCmG97YQԖy6 2rk$ŘOe;8x|j7浛CX86ֲNVl!ܵG$ټXLe8wKf?';~NDxA:> 3, faCircleNotch, faSliders, faMinus, faInfoCircle /scroll-container.component faCircleNotch = faCircleNotch; faSliders = faSliders; faMinus = faMinus; faInfoCircle = faInfoCircle; menuItems: any l-range-slider", "Range Slider", this.faSliders-e divider", "Divider", this.faMinu &tooltip", "Tooltip", this.faInfoCircle-xEC7progress-circle", "Progress Circle", this.faCircleNotch-xwB[xL@use '../../../../../ui-design-system/src/styles/semantic' as semantic; .sidebar-container { padding: 1rem 0; .menu-item-wrapper { margin-bottom: 0.25rem; .parent-menu-item { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1rem; cursor: pointer; border-radius: 8px; margin: 0 0.5rem; transition: background-color 0.2s ease; &:hover { background-color: semantic.$semantic-color-surface-interactive; } .parent-content { display: flex; align-items: center; gap: 0.75rem; .parent-icon { font-size: 1rem; color: semantic.$semantic-color-text-secondary; } .parent-label { font-weight: 500; color: semantic.$semantic-color-text-primary; font-size: 0.875rem; } } .chevron-icon { font-size: 0.75rem; color: semantic.$semantic-color-text-tertiary; transition: transform 0.2s ease; } } .children-container { margin-left: 1rem; padding-left: 1rem; border-left: 2px solid semantic.$semantic-color-border-secondary; margin-top: 0.25rem; ::ng-deep .child-menu-item { margin-bottom: 0.125rem; ui-menu-item { --menu-item-padding: 0.5rem 1rem; --menu-item-font-size: 0.8125rem; } } } } }=k@xkC #,.Vx̽{(gqFbQjniF>VJx4import { Component, EventEmitter, Output, Input, OnInit } from '@angular/core'; import { CommonModule } from '@angular/common'; import { MenuContainerComponent, MenuSubmenuComponent, MenuItemComponent, MenuItemData } from '../../../../../ui-essentials/src/lib/components/navigation/menu'; export interface SidebarMenuItem extends MenuItemData { children?: SidebarMenuItem[]; expanded?: boolean; isParent?: boolean; } @Component({ selector: 'skyui-dashboard-sidebar', standalone: true, imports: [ CommonModule, MenuContainerComponent, MenuSubmenuComponent, MenuItemComponent ], template: ` @for(item of data; track item.id) { @if(item.isParent && item.children) { @for(child of item.children; track child.id) { } } @else { } } `, styleUrls: ['./dashboard.sidebar.component.scss'] }) export class DashboardSidebarComponent implements OnInit { @Input() data: SidebarMenuItem[] = []; @Input() set active(value: string) { this.setActive(value) } @Output() selected = new EventEmitter(); handleMenuClick(id: string): void { this.setActive(id); this.selected.emit(id); } setActive(id: string): void { this.setActiveRecursive(this.data, id); } private setActiveRecursive(items: SidebarMenuItem[], id: string): void { items.forEach(item => { item.active = item.id === id; if (item.children) { this.setActiveRecursive(item.children, id); } }); } getActiveMenuItem(): SidebarMenuItem | undefined { return this.getActiveMenuItemRecursive(this.data); } private getActiveMenuItemRecursive(items: SidebarMenuItem[]): SidebarMenuItem | undefined { for (const item of items) { if (item.active) return item; if (item.children) { const found = this.getActiveMenuItemRecursive(item.children); if (found) return found; } } return undefined; } clearSelection(): void { this.clearSelectionRecursive(this.data); } private clearSelectionRecursive(items: SidebarMenuItem[]): void { items.forEach(item => { item.active = false; if (item.children) { this.clearSelectionRecursive(item.children); } }); } toggleExpanded(item: SidebarMenuItem): void { if (item.isParent) { item.expanded = !item.expanded; } } getMenuItemData(item: SidebarMenuItem): MenuItemData { return { id: item.id, label: item.label, icon: item.icon, active: item.active, hasSubmenu: item.isParent && !!item.children, disabled: item.disabled }; } onSubmenuToggled(event: { item: MenuItemData; isOpen: boolean }): void { const sidebarItem = this.findItemById(this.data, event.item.id || ''); if (sidebarItem && sidebarItem.isParent) { sidebarItem.expanded = event.isOpen; } } private findItemById(items: SidebarMenuItem[], id: string): SidebarMenuItem | undefined { for (const item of items) { if (item.id === id) return item; if (item.children) { const found = this.findItemById(item.children, id); if (found) return found; } } return undefined; } ngOnInit(): void { } }/[YxmT݊@eQz~Fmƫ쮺""NI:Δ$mRz2W#x)>>I|s9_~ 1kbX P#L\iǵns8tri_>u(kDFFGC<}AaNlFuƚ\biшɨ*kx:]rB>됚\nmBI@`dd;0`ňv9^0_ڿc).}C&3P쩼H kOcqm;WkKWa<ᛶSa|4Ԁ9O>w.}pĽXl$]7[C>9Y\<?KX,zz,.Y),0#ǮA.W\4nh3ţuO^؍߶ CZªT"2)o*3exJG6eWNqTVP#BW 0TA h˘j3 T*%XEق\nW՛ϕMc@&R2>p[C?J$bϛQ(ʲtJrMوpsK߯k޳l}x[/7[nfϼPx8// Layout Container Component - Main application shell layout .ui-layout-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; box-sizing: border-box; overflow: hidden; display: flex; flex-wrap: nowrap; flex-direction: column; align-items: stretch; flex-flow: column; // Top navigation bar &__top-bar { order: 1; flex: 0 0 64px; // Standard app bar height box-sizing: border-box; overflow: hidden; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); position: relative; } // Main content wrapper &__centre-wrapper { width: 100%; box-sizing: border-box; position: relative; order: 2; flex: 1; overflow: hidden; min-height: 0; display: flex; flex-wrap: nowrap; flex-direction: row; align-items: stretch; // Left sidebar navigation .left-navigation { order: 1; flex: 0 0 64px; // Collapsed sidebar width overflow: hidden; position: relative; box-sizing: border-box; height: 100%; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); // Navigation states &--hide { flex: 0 0 0; } &--rail { flex: 0 0 80px; // Rail navigation width } &--full { flex: 0 0 320px; // Expanded sidebar width } } // Main content area .main-body { order: 2; flex: 1; overflow: hidden; min-height: 0; box-sizing: border-box; position: relative; display: flex; flex-wrap: nowrap; flex-direction: column; align-items: stretch; // Inner header section &__header { order: 1; flex: 0 0 0; box-sizing: border-box; overflow: hidden; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); width: 100%; position: relative; } // Inner content body &__body { order: 2; flex: 1; overflow: hidden; min-height: 0; box-sizing: border-box; } // Inner footer section &__footer { order: 3; flex: 0 0 0; box-sizing: border-box; overflow: hidden; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); width: 100%; position: relative; } } // Right sidebar navigation .right-navigation { order: 3; flex: 0 0 320px; // Right sidebar width overflow: hidden; position: relative; box-sizing: border-box; height: 100%; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); // Right navigation states &--hide { flex: 0 0 0; } &--show { flex: 0 0 320px; // Shown right sidebar width } } } // Bottom bar section &__bottom-bar { order: 3; flex: 0 0 0; overflow: hidden; box-sizing: border-box; transition: all 300ms cubic-bezier(0.2, 0.0, 0, 1.0); } // Responsive design for smaller screens @media (max-width: 768px) { &__centre-wrapper { .left-navigation { &--full { flex: 0 0 280px; // Smaller full width on mobile } } .right-navigation { &--show { flex: 0 0 280px; // Smaller right sidebar on mobile } } } } // Mobile breakpoint - stack navigation vertically @media (max-width: 640px) { &__centre-wrapper { flex-direction: column; .left-navigation, .right-navigation { &--full, &--show { flex: 0 0 64px; // Navigation becomes horizontal bar on mobile } } } } } :Uxvimport { Component, ChangeDetectionStrategy, input, computed } from '@angular/core'; export type NavigationState = 'hide' | 'rail' | 'full'; export type SidebarState = 'hide' | 'show'; @Component({ selector: 'ui-layout-container', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, styleUrl: './layout-container.component.scss', template: `
    ` }) export class LayoutContainerComponent { // Input signals for layout configuration leftNavigationState = input('rail'); rightNavigationState = input('hide'); // Show/hide inputs showTopBar = input(false); showInnerHeader = input(false); showInnerFooter = input(false); showBottomBar = input(false); // Size inputs (in pixels) - with sensible defaults topBarHeight = input(64); innerHeaderHeight = input(56); innerFooterHeight = input(48); bottomBarHeight = input(56); // Custom width overrides customLeftWidth = input(null); customRightWidth = input(null); // Computed CSS classes for navigation states leftNavigationClasses = computed(() => { const state = this.leftNavigationState(); return `left-navigation--${state}`; }); rightNavigationClasses = computed(() => { const state = this.rightNavigationState(); return `right-navigation--${state}`; }); // Computed widths based on state and custom overrides leftNavigationWidth = computed(() => { const customWidth = this.customLeftWidth(); if (customWidth !== null) return customWidth; const state = this.leftNavigationState(); switch (state) { case 'hide': return 0; case 'rail': return 81; case 'full': return 320; default: return 64; } }); rightNavigationWidth = computed(() => { const customWidth = this.customRightWidth(); if (customWidth !== null) return customWidth; const state = this.rightNavigationState(); switch (state) { case 'hide': return 0; case 'show': return 320; default: return 0; } }); // Computed effective heights (0 when hidden, configured height when shown) effectiveTopBarHeight = computed(() => { return this.showTopBar() ? this.topBarHeight() : 0; }); effectiveInnerHeaderHeight = computed(() => { return this.showInnerHeader() ? this.innerHeaderHeight() : 0; }); effectiveInnerFooterHeight = computed(() => { return this.showInnerFooter() ? this.innerFooterHeight() : 0; }); effectiveBottomBarHeight = computed(() => { return this.showBottomBar() ? this.bottomBarHeight() : 0; }); }-t x. DemoUiEssentials bximport { bootstrapApplication } from '@angular/platform-browser'; import { appConfig } from './app/app.config'; import { AppComponent } from './app/app.component'; bootstrapApplication(AppComponent, appConfig) .catch((err) => console.error(err)); .Xx!// ========================================================================== // SKYUI PROJECT VARIABLES // ========================================================================== // Project-specific variable overrides that build upon the shared-ui token system // Import order: base tokens → semantic tokens → project overrides // NOTE: Semantic tokens are imported in styles.scss and available here // ========================================================================== // ========================================================================== // FONT FAMILY OVERRIDES // ========================================================================== // Override base font families to use Comfortaa $base-typography-font-family-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; $base-typography-font-family-display: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; @import '../../../shared-ui/src/styles/semantic'; // These overrides will cascade through all semantic typography tokens // that use $base-typography-font-family-sans and $base-typography-font-family-display // ========================================================================== // PROJECT-SPECIFIC OVERRIDES // ========================================================================== // Custom values that override semantic tokens for SkyUI project needs // Use semantic tokens as base values to maintain design system consistency // BRAND CUSTOMIZATION // Override brand colors while maintaining semantic structure $skyui-brand-primary: $semantic-color-brand-primary !default; $skyui-brand-secondary: $semantic-color-brand-secondary !default; $skyui-brand-accent: $semantic-color-brand-tertiary !default; // SURFACE CUSTOMIZATION // Project-specific surface treatments $skyui-surface-elevated: $semantic-color-surface-elevated !default; $skyui-surface-sunken: $semantic-color-surface-sunken !default; $skyui-surface-interactive: $semantic-color-surface-interactive !default; // TYPOGRAPHY SCALE ADJUSTMENTS // Semantic typography tokens can be overridden for project-specific needs $skyui-heading-display: $semantic-typography-heading-display !default; $skyui-heading-h1: $semantic-typography-heading-h1 !default; $skyui-heading-h2: $semantic-typography-heading-h2 !default; $skyui-body-large: $semantic-typography-body-large !default; $skyui-body-medium: $semantic-typography-body-medium !default; // SPACING CUSTOMIZATION // Build on semantic spacing tokens $skyui-space-component: $semantic-spacing-component-md !default; $skyui-space-layout: $semantic-spacing-layout-lg !default; $skyui-space-section: $semantic-spacing-section-xl !default; // INTERACTIVE ELEMENTS // Button and form element customizations $skyui-interactive-primary: $semantic-color-interactive-primary !default; $skyui-interactive-secondary: $semantic-color-interactive-secondary !default; $skyui-border-radius-component: $semantic-border-radius-md !default; $skyui-border-radius-container: $semantic-border-radius-lg !default; // ELEVATION & SHADOWS // Project-specific shadow treatments $skyui-shadow-elevated: $semantic-shadow-elevated !default; $skyui-shadow-floating: $semantic-shadow-floating !default; // ========================================================================== // COMPONENT-SPECIFIC OVERRIDES // ========================================================================== // Variables for specific component customizations // Dashboard specific $skyui-dashboard-grid-gap: $semantic-spacing-layout-md !default; $skyui-dashboard-card-padding: $semantic-spacing-component-lg !default; // Navigation specific $skyui-nav-height: 64px !default; $skyui-sidebar-width: 280px !default; $skyui-sidebar-collapsed-width: 72px !default; // Form specific $skyui-input-border-radius: $semantic-border-radius-sm !default; $skyui-input-padding: $semantic-spacing-component-sm !default;DJlx@ui-design-systemI x/$// ========================================================================== // SKYUI COLOR OVERRIDES // ========================================================================== // Project-specific color customizations built on semantic color tokens // Extends the shared design system with SkyUI-specific color patterns // ========================================================================== // ========================================================================== // THEME COLOR UTILITIES // ========================================================================== // Utility classes for applying semantic colors consistently .skyui-color { // Brand color utilities &--brand-primary { color: $semantic-color-brand-primary; } &--brand-secondary { color: $semantic-color-brand-secondary; } &--brand-accent { color: $semantic-color-brand-accent; } // Text color utilities &--text-primary { color: $semantic-color-text-primary; } &--text-secondary { color: $semantic-color-text-secondary; } &--text-tertiary { color: $semantic-color-text-tertiary; } &--text-inverse { color: $semantic-color-text-inverse; } // Feedback colors &--success { color: $semantic-color-success; } &--warning { color: $semantic-color-warning; } &--danger { color: $semantic-color-danger; } &--info { color: $semantic-color-info; } } // ========================================================================== // BACKGROUND COLOR UTILITIES // ========================================================================== // Background color utilities using semantic tokens .skyui-bg { // Surface backgrounds &--surface-primary { background-color: $semantic-color-surface-primary; } &--surface-secondary { background-color: $semantic-color-surface-secondary; } &--surface-elevated { background-color: $semantic-color-surface-elevated; } &--surface-sunken { background-color: $semantic-color-surface-sunken; } &--surface-interactive { background-color: $semantic-color-surface-interactive; &:hover { background-color: var(--color-surface-interactive-hover, $semantic-color-surface-interactive); filter: brightness(0.95); } } // Brand backgrounds &--brand-primary { background-color: $semantic-color-brand-primary; color: $semantic-color-on-brand-primary; } &--brand-secondary { background-color: $semantic-color-brand-secondary; color: $semantic-color-on-brand-secondary; } // Container backgrounds &--container-primary { background-color: $semantic-color-container-primary; color: $semantic-color-on-container-primary; } &--container-secondary { background-color: $semantic-color-container-secondary; color: $semantic-color-on-container-secondary; } // Feedback backgrounds &--success { background-color: var(--color-success-light, $semantic-color-success); filter: brightness(1.4) saturate(0.6); color: var(--color-success-dark, $semantic-color-success); border: 1px solid var(--color-success-border, $semantic-color-success); } &--warning { background-color: var(--color-warning-light, $semantic-color-warning); filter: brightness(1.4) saturate(0.6); color: var(--color-warning-dark, $semantic-color-warning); border: 1px solid var(--color-warning-border, $semantic-color-warning); } &--danger { background-color: var(--color-danger-light, $semantic-color-danger); filter: brightness(1.4) saturate(0.6); color: var(--color-danger-dark, $semantic-color-danger); border: 1px solid var(--color-danger-border, $semantic-color-danger); } &--info { background-color: var(--color-info-light, $semantic-color-info); filter: brightness(1.4) saturate(0.6); color: var(--color-info-dark, $semantic-color-info); border: 1px solid var(--color-info-border, $semantic-color-info); } } // ========================================================================== // BORDER COLOR UTILITIES // ========================================================================== // Border color utilities using semantic border tokens .skyui-border { // Standard borders &--primary { border-color: $semantic-color-border-primary; } &--secondary { border-color: $semantic-color-border-secondary; } &--focus { border-color: $semantic-color-border-focus; outline: none; } &--error { border-color: $semantic-color-border-error; } &--disabled { border-color: $semantic-color-border-disabled; } // Border styles &--solid { border-style: solid; border-width: 1px; } &--dashed { border-style: dashed; border-width: 1px; } &--thick { border-width: 2px; } } // ========================================================================== // INTERACTIVE STATE COLORS // ========================================================================== // Color variations for interactive elements .skyui-interactive { // Primary interactive states &--primary { color: $semantic-color-interactive-primary; &:hover { color: var(--color-primary-hover, $semantic-color-interactive-primary); } &:active { color: var(--color-primary-active, $semantic-color-interactive-primary); } &:focus { color: $semantic-color-interactive-primary; outline: 2px solid $semantic-color-focus-ring; outline-offset: 2px; } } // Secondary interactive states &--secondary { color: $semantic-color-interactive-secondary; &:hover { color: var(--color-secondary-hover, $semantic-color-interactive-secondary); } &:active { color: var(--color-secondary-active, $semantic-color-interactive-secondary); } } // Tertiary interactive states &--tertiary { color: $semantic-color-interactive-tertiary; &:hover { color: var(--color-tertiary-hover, $semantic-color-interactive-tertiary); } &:active { color: var(--color-tertiary-active, $semantic-color-interactive-tertiary); } } // Neutral interactive states &--neutral { color: $semantic-color-text-secondary; &:hover { color: $semantic-color-text-primary; } } } // ========================================================================== // COMPONENT-SPECIFIC COLORS // ========================================================================== // Color patterns for specific SkyUI components // Dashboard specific colors .skyui-dashboard { &__card { background-color: $semantic-color-surface-elevated; border: 1px solid $semantic-color-border-secondary; box-shadow: $semantic-shadow-elevated; &:hover { box-shadow: $semantic-shadow-floating; } } &__metric { &--positive { color: $semantic-color-success; } &--negative { color: $semantic-color-danger; } &--neutral { color: $semantic-color-text-secondary; } } } // Navigation specific colors .skyui-navigation { &__item { color: $semantic-color-text-secondary; &:hover { color: $semantic-color-text-primary; background-color: $semantic-color-surface-interactive; } &.active { color: $semantic-color-brand-primary; background-color: var(--color-brand-primary-light, $semantic-color-brand-primary); font-weight: $base-typography-font-weight-medium; } } &__divider { background-color: $semantic-color-border-secondary; } } // Form specific colors .skyui-form { &__input { background-color: $semantic-color-surface-primary; border-color: $semantic-color-border-secondary; color: $semantic-color-text-primary; &:focus { border-color: $semantic-color-border-focus; box-shadow: 0 0 0 3px $semantic-color-focus-ring; } &.error { border-color: $semantic-color-border-error; } &:disabled { background-color: $semantic-color-surface-disabled; border-color: $semantic-color-border-disabled; color: $semantic-color-text-disabled; } } &__label { color: $semantic-color-text-primary; &.required { &::after { color: $semantic-color-danger; } } } } // ========================================================================== // STATUS AND NOTIFICATION COLORS // ========================================================================== // Color patterns for status indicators and notifications .skyui-status { &--online { color: $semantic-color-success; &::before { content: '●'; margin-right: $semantic-spacing-component-2xs; } } &--offline { color: $semantic-color-danger; &::before { content: '●'; margin-right: $semantic-spacing-component-2xs; } } &--pending { color: $semantic-color-warning; &::before { content: '●'; margin-right: $semantic-spacing-component-2xs; } } &--inactive { color: $semantic-color-text-tertiary; &::before { content: '●'; margin-right: $semantic-spacing-component-2xs; } } }AA!x// ========================================================================== // SKYUI OVERRIDES INDEX // ========================================================================== // Centralized import for all SkyUI project overrides // Import order maintains proper cascade and dependency resolution // ========================================================================== // Typography overrides - semantic typography token extensions @import 'typography'; // Color overrides - semantic color token extensions @import 'colors';XxH// ========================================================================== // SKYUI TYPOGRAPHY OVERRIDES // ========================================================================== // Project-specific typography customizations built on semantic typography tokens // Extends the shared design system with SkyUI-specific typography patterns // ========================================================================== // Typography utility mixins that use semantic tokens @mixin apply-typography($typography-map) { font-family: map-get($typography-map, font-family); font-size: map-get($typography-map, font-size); font-weight: map-get($typography-map, font-weight); line-height: map-get($typography-map, line-height); letter-spacing: map-get($typography-map, letter-spacing); } // ========================================================================== // HEADING STYLES // ========================================================================== // Custom heading treatments that build on semantic typography .skyui-heading { // Display heading for hero sections &--display { @include apply-typography($semantic-typography-heading-display); color: $semantic-color-text-primary; // Project-specific enhancements text-align: center; margin-bottom: $semantic-spacing-component-xl; @media (max-width: $base-breakpoint-md) { font-size: $base-typography-font-size-2xl; } } // Primary headings &--h1 { @include apply-typography($semantic-typography-heading-h1); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-lg; // SkyUI specific styling position: relative; &::after { content: ''; position: absolute; bottom: -#{$semantic-spacing-component-xs}; left: 0; width: 60px; height: 3px; background-color: $semantic-color-brand-primary; } } // Secondary headings &--h2 { @include apply-typography($semantic-typography-heading-h2); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-md; margin-top: $semantic-spacing-component-xl; } // Tertiary headings &--h3 { @include apply-typography($semantic-typography-heading-h3); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-sm; margin-top: $semantic-spacing-component-lg; } // Quaternary headings &--h4 { @include apply-typography($semantic-typography-heading-h4); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-xs; margin-top: $semantic-spacing-component-md; } } // ========================================================================== // BODY TEXT STYLES // ========================================================================== // Content text styles using semantic typography tokens .skyui-text { // Large body text for important content &--large { @include apply-typography($semantic-typography-body-large); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-md; } // Standard body text &--medium { @include apply-typography($semantic-typography-body-medium); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-sm; } // Small body text for captions, etc. &--small { @include apply-typography($semantic-typography-body-small); color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-xs; } // Caption text &--caption { @include apply-typography($semantic-typography-caption); color: $semantic-color-text-tertiary; } // Muted/secondary text &--muted { color: $semantic-color-text-secondary; } // Emphasized text &--emphasis { color: $semantic-color-brand-primary; font-weight: $base-typography-font-weight-medium; } } // ========================================================================== // INTERACTIVE TEXT STYLES // ========================================================================== // Text styles for buttons, links, and interactive elements .skyui-interactive-text { // Button text styles &--button-large { @include apply-typography($semantic-typography-button-large); text-transform: uppercase; } &--button-medium { @include apply-typography($semantic-typography-button-medium); text-transform: uppercase; } &--button-small { @include apply-typography($semantic-typography-button-small); text-transform: uppercase; } // Link styles &--link { @include apply-typography($semantic-typography-body-medium); color: $semantic-color-interactive-primary; text-decoration: none; &:hover { color: var(--color-primary-hover, $semantic-color-interactive-primary); filter: brightness(0.9); text-decoration: underline; } &:focus { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } } // Navigation text &--nav-primary { @include apply-typography($semantic-typography-nav-primary); color: $semantic-color-text-primary; &.active { color: $semantic-color-brand-primary; font-weight: $base-typography-font-weight-semibold; } } &--nav-secondary { @include apply-typography($semantic-typography-nav-secondary); color: $semantic-color-text-secondary; } } // ========================================================================== // FORM TEXT STYLES // ========================================================================== // Text styles for form elements using semantic tokens .skyui-form-text { // Labels &--label { @include apply-typography($semantic-typography-label); color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-xs; display: block; &.required::after { content: ' *'; color: $semantic-color-danger; } } // Input text &--input { @include apply-typography($semantic-typography-input); color: $semantic-color-text-primary; &::placeholder { @include apply-typography($semantic-typography-placeholder); color: $semantic-color-text-tertiary; } } // Help text &--help { @include apply-typography($semantic-typography-caption); color: $semantic-color-text-secondary; margin-top: $semantic-spacing-component-xs; } // Error text &--error { @include apply-typography($semantic-typography-caption); color: $semantic-color-danger; margin-top: $semantic-spacing-component-xs; } } // ========================================================================== // CODE TEXT STYLES // ========================================================================== // Code and monospace text styles .skyui-code { // Inline code &--inline { @include apply-typography($semantic-typography-code-inline); background-color: $semantic-color-surface-secondary; color: $semantic-color-text-primary; padding: $semantic-spacing-component-2xs $semantic-spacing-component-xs; border-radius: $semantic-border-radius-sm; border: 1px solid $semantic-color-border-secondary; } // Code block &--block { @include apply-typography($semantic-typography-code-block); background-color: $semantic-color-surface-sunken; color: $semantic-color-text-primary; padding: $semantic-spacing-component-md; border-radius: $semantic-border-radius-md; border: 1px solid $semantic-color-border-secondary; overflow-x: auto; white-space: pre; } }KÇ䱢x! /* You can add global styles to this file, and also import other style files */ // Set font paths before importing fontfaces $inter-font-path: "/fonts/inter/" !default; $comfortaa-font-path: "/fonts/comfortaa/" !default; // Import specific fonts we need for the demo @import '../../ui-design-system/src/styles/fontfaces/inter'; @import '../../ui-design-system/src/styles/fontfaces/comfortaa'; // Import project variables (which now has semantic tokens available) @import 'scss/_variables'; // Import UI Animations @import '../../ui-animations/src/styles/index'; html { height: 100%; font-size: 16px; // Base font size for rem calculations // Define default CSS custom properties for fonts // These can be overridden by the font manager --font-family-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --font-family-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif; --font-family-mono: ui-monospace, SFMono-Regular, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --font-family-display: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; } body { margin: 0; padding: 0; height: 100%; background-color: $semantic-color-surface-primary; color: $semantic-color-text-primary; // Apply base typography using CSS custom properties first, then fallback to semantic tokens font-family: var(--font-family-sans, map-get($semantic-typography-body-medium, font-family)); font-size: map-get($semantic-typography-body-medium, font-size); font-weight: map-get($semantic-typography-body-medium, font-weight); line-height: map-get($semantic-typography-body-medium, line-height); // Improve text rendering -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; // Support font transitions transition: font-family 0.3s ease-in-out; } // Global typography classes that respect font variables h1, h2, h3, h4, h5, h6 { font-family: var(--font-family-display, var(--font-family-sans)); transition: font-family 0.3s ease-in-out; } // Serif elements blockquote, .serif { font-family: var(--font-family-serif); transition: font-family 0.3s ease-in-out; } // Monospace elements code, pre, kbd, samp, .mono { font-family: var(--font-family-mono); transition: font-family 0.3s ease-in-out; } // Sans-serif elements .sans { font-family: var(--font-family-sans); transition: font-family 0.3s ease-in-out; } // Display elements .display { font-family: var(--font-family-display); transition: font-family 0.3s ease-in-out; } s/x[(c #gqFbQjnidF]$^&cdsM,['O~ĪϖS#S-0Fx2 ui-design-system%-ui-design-system[!Lex0!q5xO/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ { "extends": "../../tsconfig.json", "compilerOptions": { "outDir": "../../out-tsc/app", "types": [] }, "files": [ "src/main.ts" ], "include": [ "src/**/*.d.ts" ] } 9̋x'^/** * ========================================================================== * HCL COLOR CONVERTER * ========================================================================== * Accurate color space conversions between RGB, LAB, and HCL * Based on CIE LAB color space for perceptual uniformity * ========================================================================== */ import { RGB, LAB, HCL } from '../models/hcl.models'; export class HCLConverter { // ========================================================================== // RGB ↔ HCL CONVERSIONS // ========================================================================== /** * Convert RGB to HCL color space * @param r Red component (0-255) * @param g Green component (0-255) * @param b Blue component (0-255) * @returns HCL color */ static rgbToHcl(r: number, g: number, b: number): HCL { const lab = this.rgbToLab(r, g, b); return this.labToHcl(lab.l, lab.a, lab.b); } /** * Convert HCL to RGB color space * @param h Hue (0-360) * @param c Chroma (0-100+) * @param l Lightness (0-100) * @returns RGB color */ static hclToRgb(h: number, c: number, l: number): RGB { const lab = this.hclToLab(h, c, l); return this.labToRgb(lab.l, lab.a, lab.b); } // ========================================================================== // HEX CONVERSIONS // ========================================================================== /** * Convert hex string to HCL * @param hex Hex color string (#RRGGBB or #RGB) * @returns HCL color */ static hexToHcl(hex: string): HCL { const rgb = this.hexToRgb(hex); return this.rgbToHcl(rgb.r, rgb.g, rgb.b); } /** * Convert HCL to hex string * @param h Hue (0-360) * @param c Chroma (0-100+) * @param l Lightness (0-100) * @returns Hex color string */ static hclToHex(h: number, c: number, l: number): string { const rgb = this.hclToRgb(h, c, l); return this.rgbToHex(rgb.r, rgb.g, rgb.b); } // ========================================================================== // RGB ↔ LAB CONVERSIONS (via XYZ) // ========================================================================== /** * Convert RGB to LAB color space * @param r Red component (0-255) * @param g Green component (0-255) * @param b Blue component (0-255) * @returns LAB color */ static rgbToLab(r: number, g: number, b: number): LAB { // Convert RGB to XYZ first let rNorm = r / 255; let gNorm = g / 255; let bNorm = b / 255; // Apply gamma correction (sRGB) rNorm = rNorm > 0.04045 ? Math.pow((rNorm + 0.055) / 1.055, 2.4) : rNorm / 12.92; gNorm = gNorm > 0.04045 ? Math.pow((gNorm + 0.055) / 1.055, 2.4) : gNorm / 12.92; bNorm = bNorm > 0.04045 ? Math.pow((bNorm + 0.055) / 1.055, 2.4) : bNorm / 12.92; // Convert to XYZ using sRGB matrix let x = rNorm * 0.4124564 + gNorm * 0.3575761 + bNorm * 0.1804375; let y = rNorm * 0.2126729 + gNorm * 0.7151522 + bNorm * 0.0721750; let z = rNorm * 0.0193339 + gNorm * 0.1191920 + bNorm * 0.9503041; // Normalize by D65 illuminant x = x / 0.95047; y = y / 1.00000; z = z / 1.08883; // Convert XYZ to LAB const fx = x > 0.008856 ? Math.pow(x, 1/3) : (7.787 * x + 16/116); const fy = y > 0.008856 ? Math.pow(y, 1/3) : (7.787 * y + 16/116); const fz = z > 0.008856 ? Math.pow(z, 1/3) : (7.787 * z + 16/116); const l = (116 * fy) - 16; const a = 500 * (fx - fy); const bValue = 200 * (fy - fz); return { l: Math.max(0, Math.min(100, l)), a, b: bValue }; } /** * Convert LAB to RGB color space * @param l Lightness (0-100) * @param a Green-Red axis * @param b Blue-Yellow axis * @returns RGB color */ static labToRgb(l: number, a: number, b: number): RGB { // Convert LAB to XYZ const fy = (l + 16) / 116; const fx = a / 500 + fy; const fz = fy - b / 200; const x = (fx > 0.206897 ? Math.pow(fx, 3) : (fx - 16/116) / 7.787) * 0.95047; const y = (fy > 0.206897 ? Math.pow(fy, 3) : (fy - 16/116) / 7.787) * 1.00000; const z = (fz > 0.206897 ? Math.pow(fz, 3) : (fz - 16/116) / 7.787) * 1.08883; // Convert XYZ to RGB let r = x * 3.2404542 + y * -1.5371385 + z * -0.4985314; let g = x * -0.9692660 + y * 1.8760108 + z * 0.0415560; let b2 = x * 0.0556434 + y * -0.2040259 + z * 1.0572252; // Apply inverse gamma correction r = r > 0.0031308 ? 1.055 * Math.pow(r, 1/2.4) - 0.055 : 12.92 * r; g = g > 0.0031308 ? 1.055 * Math.pow(g, 1/2.4) - 0.055 : 12.92 * g; b2 = b2 > 0.0031308 ? 1.055 * Math.pow(b2, 1/2.4) - 0.055 : 12.92 * b2; // Clamp to valid RGB range const rFinal = Math.max(0, Math.min(255, Math.round(r * 255))); const gFinal = Math.max(0, Math.min(255, Math.round(g * 255))); const bFinal = Math.max(0, Math.min(255, Math.round(b2 * 255))); return { r: rFinal, g: gFinal, b: bFinal }; } // ========================================================================== // LAB ↔ HCL CONVERSIONS // ========================================================================== /** * Convert LAB to HCL (cylindrical representation) * @param l Lightness (0-100) * @param a Green-Red axis * @param b Blue-Yellow axis * @returns HCL color */ static labToHcl(l: number, a: number, b: number): HCL { const c = Math.sqrt(a * a + b * b); let h = Math.atan2(b, a) * (180 / Math.PI); // Normalize hue to 0-360 if (h < 0) h += 360; return { h: isNaN(h) ? 0 : h, c: isNaN(c) ? 0 : c, l: Math.max(0, Math.min(100, l)) }; } /** * Convert HCL to LAB color space * @param h Hue (0-360) * @param c Chroma (0-100+) * @param l Lightness (0-100) * @returns LAB color */ static hclToLab(h: number, c: number, l: number): LAB { const hRad = (h * Math.PI) / 180; const a = c * Math.cos(hRad); const b = c * Math.sin(hRad); return { l, a, b }; } // ========================================================================== // HEX UTILITY METHODS // ========================================================================== /** * Convert hex string to RGB * @param hex Hex color string * @returns RGB color */ static hexToRgb(hex: string): RGB { // Remove # if present hex = hex.replace('#', ''); // Handle 3-digit hex if (hex.length === 3) { hex = hex.split('').map(h => h + h).join(''); } if (hex.length !== 6) { throw new Error(`Invalid hex color: ${hex}`); } const r = parseInt(hex.substr(0, 2), 16); const g = parseInt(hex.substr(2, 2), 16); const b = parseInt(hex.substr(4, 2), 16); return { r, g, b }; } /** * Convert RGB to hex string * @param r Red component (0-255) * @param g Green component (0-255) * @param b Blue component (0-255) * @returns Hex color string */ static rgbToHex(r: number, g: number, b: number): string { const toHex = (n: number) => { const hex = Math.max(0, Math.min(255, Math.round(n))).toString(16); return hex.length === 1 ? '0' + hex : hex; }; return `#${toHex(r)}${toHex(g)}${toHex(b)}`; } // ========================================================================== // COLOR MANIPULATION METHODS // ========================================================================== /** * Adjust lightness of a color * @param hex Original color * @param amount Lightness adjustment (-100 to 100) * @returns Adjusted color */ static adjustLightness(hex: string, amount: number): string { const hcl = this.hexToHcl(hex); const newL = Math.max(0, Math.min(100, hcl.l + amount)); return this.hclToHex(hcl.h, hcl.c, newL); } /** * Adjust chroma (saturation) of a color * @param hex Original color * @param amount Chroma adjustment (-100 to 100) * @returns Adjusted color */ static adjustChroma(hex: string, amount: number): string { const hcl = this.hexToHcl(hex); const newC = Math.max(0, hcl.c + amount); return this.hclToHex(hcl.h, newC, hcl.l); } /** * Adjust hue of a color * @param hex Original color * @param amount Hue adjustment in degrees (-360 to 360) * @returns Adjusted color */ static adjustHue(hex: string, amount: number): string { const hcl = this.hexToHcl(hex); let newH = hcl.h + amount; // Normalize hue to 0-360 while (newH < 0) newH += 360; while (newH >= 360) newH -= 360; return this.hclToHex(newH, hcl.c, hcl.l); } // ========================================================================== // VALIDATION METHODS // ========================================================================== /** * Validate if a string is a valid hex color * @param hex Color string to validate * @returns True if valid hex color */ static isValidHex(hex: string): boolean { try { const normalizedHex = hex.replace('#', ''); return /^[0-9A-Fa-f]{3}$|^[0-9A-Fa-f]{6}$/.test(normalizedHex); } catch { return false; } } /** * Calculate relative luminance of a color (for contrast calculation) * @param hex Hex color string * @returns Relative luminance (0-1) */ static getRelativeLuminance(hex: string): number { const rgb = this.hexToRgb(hex); const [r, g, b] = [rgb.r, rgb.g, rgb.b].map(c => { c = c / 255; return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4); }); return 0.2126 * r + 0.7152 * g + 0.0722 * b; } /** * Calculate contrast ratio between two colors * @param color1 First color * @param color2 Second color * @returns Contrast ratio (1-21) */ static getContrastRatio(color1: string, color2: string): number { const lum1 = this.getRelativeLuminance(color1); const lum2 = this.getRelativeLuminance(color2); const lighter = Math.max(lum1, lum2); const darker = Math.min(lum1, lum2); return (lighter + 0.05) / (darker + 0.05); } }Xٴx$1/** * ========================================================================== * PALETTE GENERATOR * ========================================================================== * Generate Material Design 3 compliant color palettes using HCL color space * Creates perceptually uniform tonal variations with proper contrast ratios * ========================================================================== */ import { HCLConverter } from './hcl-converter'; import { TonalPalette, MaterialPalette, BrandColors, HCL } from '../models/hcl.models'; export class PaletteGenerator { // ========================================================================== // MATERIAL DESIGN 3 TONE LEVELS // ========================================================================== private static readonly TONE_LEVELS = [0, 4, 5, 6, 10, 12, 15, 17, 20, 22, 25, 30, 35, 40, 50, 60, 70, 80, 87, 90, 92, 94, 95, 96, 98, 99, 100] as const; // ========================================================================== // MAIN PALETTE GENERATION // ========================================================================== /** * Generate complete Material Design 3 palette from brand colors * @param brandColors Primary, secondary, tertiary seed colors * @param mode Light or dark mode * @returns Complete Material Design 3 palette */ static generateMaterialPalette(brandColors: BrandColors, mode: 'light' | 'dark' = 'light'): MaterialPalette { return { primary: this.generateTonalPalette(brandColors.primary), secondary: this.generateTonalPalette(brandColors.secondary), tertiary: this.generateTonalPalette(brandColors.tertiary), neutral: this.generateNeutralPalette(brandColors.primary), neutralVariant: this.generateNeutralVariantPalette(brandColors.primary), error: this.generateTonalPalette(brandColors.error || '#B3261E') // Material Design default error }; } /** * Generate tonal palette from seed color * @param seedColor Hex color string * @returns Tonal palette with all tone levels */ static generateTonalPalette(seedColor: string): TonalPalette { const seedHcl = HCLConverter.hexToHcl(seedColor); // Create palette object with all tone levels const palette = {} as TonalPalette; this.TONE_LEVELS.forEach(tone => { palette[tone as keyof TonalPalette] = this.generateTone(seedHcl, tone); }); return palette; } /** * Generate neutral palette from primary color * @param primaryColor Primary seed color * @returns Neutral tonal palette */ static generateNeutralPalette(primaryColor: string): TonalPalette { const primaryHcl = HCLConverter.hexToHcl(primaryColor); // Create neutral variation with reduced chroma and adjusted hue const neutralHcl: HCL = { h: primaryHcl.h, c: Math.min(primaryHcl.c * 0.08, 8), // Very low chroma for neutral l: primaryHcl.l }; const palette = {} as TonalPalette; this.TONE_LEVELS.forEach(tone => { palette[tone as keyof TonalPalette] = this.generateTone(neutralHcl, tone); }); return palette; } /** * Generate neutral variant palette from primary color * @param primaryColor Primary seed color * @returns Neutral variant tonal palette */ static generateNeutralVariantPalette(primaryColor: string): TonalPalette { const primaryHcl = HCLConverter.hexToHcl(primaryColor); // Create neutral variant with slightly more chroma than neutral const neutralVariantHcl: HCL = { h: primaryHcl.h, c: Math.min(primaryHcl.c * 0.16, 16), // Low chroma but higher than neutral l: primaryHcl.l }; const palette = {} as TonalPalette; this.TONE_LEVELS.forEach(tone => { palette[tone as keyof TonalPalette] = this.generateTone(neutralVariantHcl, tone); }); return palette; } // ========================================================================== // TONE GENERATION // ========================================================================== /** * Generate specific tone from HCL seed * @param seedHcl Seed color in HCL space * @param tone Target tone level (0-100) * @returns Hex color string */ private static generateTone(seedHcl: HCL, tone: number): string { // Apply tone-specific chroma adjustments for better visual consistency const chromaMultiplier = this.getChromaMultiplier(tone); const adjustedChroma = seedHcl.c * chromaMultiplier; // Create tone with adjusted lightness and chroma const toneHcl: HCL = { h: seedHcl.h, c: Math.max(0, adjustedChroma), l: tone }; return HCLConverter.hclToHex(toneHcl.h, toneHcl.c, toneHcl.l); } /** * Get chroma multiplier based on tone level * Reduces chroma at very light and very dark tones for better visual balance * @param tone Tone level (0-100) * @returns Chroma multiplier (0-1) */ private static getChromaMultiplier(tone: number): number { // Reduce chroma at extreme lightness values if (tone <= 10) return 0.6 + (tone / 10) * 0.3; // 0.6 to 0.9 if (tone >= 90) return 1.1 - ((tone - 90) / 10) * 0.5; // 1.1 to 0.6 if (tone >= 80) return 1.0 + ((tone - 80) / 10) * 0.1; // 1.0 to 1.1 // Full chroma in middle ranges return 1.0; } // ========================================================================== // COLOR HARMONIES // ========================================================================== /** * Generate complementary color from seed * @param seedColor Seed color * @returns Complementary color */ static generateComplementary(seedColor: string): string { const hcl = HCLConverter.hexToHcl(seedColor); const compHue = (hcl.h + 180) % 360; return HCLConverter.hclToHex(compHue, hcl.c, hcl.l); } /** * Generate analogous colors from seed * @param seedColor Seed color * @param count Number of analogous colors to generate * @returns Array of analogous colors */ static generateAnalogous(seedColor: string, count: number = 3): string[] { const hcl = HCLConverter.hexToHcl(seedColor); const colors: string[] = []; const step = 30; // 30-degree steps for (let i = 0; i < count; i++) { const hue = (hcl.h + (i - Math.floor(count / 2)) * step) % 360; const adjustedHue = hue < 0 ? hue + 360 : hue; colors.push(HCLConverter.hclToHex(adjustedHue, hcl.c, hcl.l)); } return colors; } /** * Generate triadic colors from seed * @param seedColor Seed color * @returns Array of triadic colors (including original) */ static generateTriadic(seedColor: string): string[] { const hcl = HCLConverter.hexToHcl(seedColor); return [ seedColor, HCLConverter.hclToHex((hcl.h + 120) % 360, hcl.c, hcl.l), HCLConverter.hclToHex((hcl.h + 240) % 360, hcl.c, hcl.l) ]; } /** * Generate tetradic colors from seed * @param seedColor Seed color * @returns Array of tetradic colors */ static generateTetradic(seedColor: string): string[] { const hcl = HCLConverter.hexToHcl(seedColor); return [ seedColor, HCLConverter.hclToHex((hcl.h + 90) % 360, hcl.c, hcl.l), HCLConverter.hclToHex((hcl.h + 180) % 360, hcl.c, hcl.l), HCLConverter.hclToHex((hcl.h + 270) % 360, hcl.c, hcl.l) ]; } // ========================================================================== // ACCESSIBILITY HELPERS // ========================================================================== /** * Ensure minimum contrast ratio for text readability * @param backgroundColor Background color * @param textColor Text color * @param minRatio Minimum contrast ratio (default: 4.5 for WCAG AA) * @returns Adjusted text color */ static ensureContrast(backgroundColor: string, textColor: string, minRatio: number = 4.5): string { const currentRatio = HCLConverter.getContrastRatio(backgroundColor, textColor); if (currentRatio >= minRatio) { return textColor; // Already meets contrast requirements } const textHcl = HCLConverter.hexToHcl(textColor); const backgroundLuminance = HCLConverter.getRelativeLuminance(backgroundColor); // Adjust lightness to meet contrast requirements let adjustedL = textHcl.l; let bestColor = textColor; let bestRatio = currentRatio; // Try both lighter and darker variations for (let lightness = 0; lightness <= 100; lightness += 5) { const testColor = HCLConverter.hclToHex(textHcl.h, textHcl.c, lightness); const testRatio = HCLConverter.getContrastRatio(backgroundColor, testColor); if (testRatio >= minRatio && testRatio > bestRatio) { bestColor = testColor; bestRatio = testRatio; adjustedL = lightness; } } return bestColor; } /** * Get optimal text color (black or white) for background * @param backgroundColor Background color * @returns Optimal text color (#000000 or #FFFFFF) */ static getOptimalTextColor(backgroundColor: string): string { const blackRatio = HCLConverter.getContrastRatio(backgroundColor, '#000000'); const whiteRatio = HCLConverter.getContrastRatio(backgroundColor, '#FFFFFF'); return blackRatio > whiteRatio ? '#000000' : '#FFFFFF'; } // ========================================================================== // PALETTE UTILITIES // ========================================================================== /** * Get primary tone for specific use case * @param palette Tonal palette * @param usage Usage context ('main', 'container', 'on-container', etc.) * @param mode Light or dark mode * @returns Appropriate tone */ static getPrimaryTone(palette: TonalPalette, usage: 'main' | 'container' | 'on-container' | 'surface', mode: 'light' | 'dark' = 'light'): string { if (mode === 'light') { switch (usage) { case 'main': return palette[40]; case 'container': return palette[90]; case 'on-container': return palette[10]; case 'surface': return palette[98]; default: return palette[40]; } } else { switch (usage) { case 'main': return palette[80]; case 'container': return palette[30]; case 'on-container': return palette[90]; case 'surface': return palette[10]; default: return palette[80]; } } } /** * Validate palette for accessibility and visual consistency * @param palette Material palette to validate * @returns Validation results */ static validatePalette(palette: MaterialPalette): { isValid: boolean; issues: string[] } { const issues: string[] = []; // Check contrast ratios for common combinations const primaryMain = palette.primary[40]; const primaryContainer = palette.primary[90]; const onPrimary = palette.primary[100]; const onPrimaryContainer = palette.primary[10]; // Validate primary combinations const primaryContrastRatio = HCLConverter.getContrastRatio(primaryMain, onPrimary); if (primaryContrastRatio < 4.5) { issues.push(`Primary contrast ratio too low: ${primaryContrastRatio.toFixed(2)}`); } const containerContrastRatio = HCLConverter.getContrastRatio(primaryContainer, onPrimaryContainer); if (containerContrastRatio < 4.5) { issues.push(`Container contrast ratio too low: ${containerContrastRatio.toFixed(2)}`); } // Additional checks could be added here (color difference, chroma consistency, etc.) return { isValid: issues.length === 0, issues }; } // ========================================================================== // PREVIEW GENERATION // ========================================================================== /** * Generate color preview for theme selection UI * @param brandColors Brand colors * @returns Preview color object */ static generateColorPreview(brandColors: BrandColors): { [key: string]: string } { const palette = this.generateMaterialPalette(brandColors); return { 'Primary': palette.primary[40], 'Primary Container': palette.primary[90], 'Secondary': palette.secondary[40], 'Secondary Container': palette.secondary[90], 'Tertiary': palette.tertiary[40], 'Tertiary Container': palette.tertiary[90], 'Surface': palette.neutral[98], 'Surface Container': palette.neutral[94] }; } }:( x(import { Component } from '@angular/core'; @Component({ selector: 'lib-hcl-studio', imports: [], template: `

    hcl-studio works!

    `, styles: `` }) export class HclStudioComponent { } aDxlimport { TestBed } from '@angular/core/testing'; import { UiAccessibilityService } from './ui-accessibility.service'; describe('UiAccessibilityService', () => { let service: UiAccessibilityService; beforeEach(() => { TestBed.configureTestingModule({}); service = TestBed.inject(UiAccessibilityService); }); it('should be created', () => { expect(service).toBeTruthy(); }); });  xiWpFbQjJhIfNqpjQYfrBBZQ~~1XR$W VJI-N.LJPG>q"72` 2w c<*cyxZ>(nimationsService } from './ui-animationsl nimations$ nimationsg nimations4_!bx`=+CodeDisplayService } from './ui-code-displak CodeDispla$ CodeDisplag CodeDispla3`s"QxZ=(DataUtilsService } from './ui-data-utilsl DataUtils# DataUtilsf DataUtils4_Q x:xd=,FontManagerService } from './ui-font-managerl FontManager# FontManagerf FontManager4_$o\xi;DHclStudioService } from './hcl-studio.service'; describe('HclStudio! HclStudiod HclStudio!_%Ҿx.9/** * ========================================================================== * HCL STUDIO SERVICE * ========================================================================== * Main service for HCL-based color palette generation and theme management * Provides complete theme switching, persistence, and reactive updates * ========================================================================== */ import { Injectable } from '@angular/core'; import { BehaviorSubject, Observable } from 'rxjs'; import { ThemeConfig, Theme, BrandColors, MaterialPalette, ThemePreview, ThemeCollection, ThemeState, HCLStudioOptions, ColorValidation } from './models/hcl.models'; import { PaletteGenerator } from './core/palette-generator'; import { HCLConverter } from './core/hcl-converter'; import { CSSVariableManager } from './themes/css-variable-manager'; import { ThemeStorage } from './themes/theme-storage'; @Injectable({ providedIn: 'root' }) export class HCLStudioService { // ========================================================================== // REACTIVE STATE // ========================================================================== private _themeState$ = new BehaviorSubject({ currentTheme: null, availableThemes: [], mode: 'light', isInitialized: false }); private _currentMode$ = new BehaviorSubject<'light' | 'dark'>('light'); // Public observables public readonly themeState$: Observable = this._themeState$.asObservable(); public readonly currentMode$: Observable<'light' | 'dark'> = this._currentMode$.asObservable(); // ========================================================================== // PRIVATE STATE // ========================================================================== private builtInThemes = new Map(); private customThemes = new Map(); private currentTheme: Theme | null = null; private currentMode: 'light' | 'dark' = 'light'; private options: HCLStudioOptions = {}; // ========================================================================== // INITIALIZATION // ========================================================================== /** * Initialize HCL Studio with options and themes * @param options Initialization options */ initialize(options: HCLStudioOptions = {}): void { this.options = { autoMode: false, storageKey: 'hcl-studio', validation: { enableContrastCheck: true, enableColorBlindCheck: false, minContrastRatio: 4.5 }, ...options }; // Load built-in themes if provided if (options.themes) { this.registerThemes(options.themes); } // Load custom themes from storage this.loadCustomThemesFromStorage(); // Restore user's last theme and mode this.restoreUserPreferences(); // Apply default theme if specified if (options.defaultTheme) { if (typeof options.defaultTheme === 'string') { this.switchTheme(options.defaultTheme); } else { this.applyThemeConfig(options.defaultTheme); } } // Set up system theme detection if enabled if (options.autoMode) { this.setupAutoModeDetection(); } this.updateThemeState(); this.markAsInitialized(); } /** * Quick initialize with brand colors * @param brandColors Primary, secondary, tertiary colors * @param mode Initial mode */ initializeWithColors(brandColors: BrandColors, mode: 'light' | 'dark' = 'light'): void { const themeConfig: ThemeConfig = { id: 'brand-theme', name: 'Brand Theme', colors: brandColors, mode, createdAt: new Date() }; this.initialize({ defaultTheme: themeConfig, autoMode: false }); } // ========================================================================== // THEME MANAGEMENT // ========================================================================== /** * Register multiple themes * @param themes Theme collection */ registerThemes(themes: ThemeCollection): void { Object.entries(themes).forEach(([id, config]) => { const themeConfig: ThemeConfig = { id, ...config }; const theme = this.createCompleteTheme(themeConfig); this.builtInThemes.set(id, theme); }); this.updateThemeState(); } /** * Create and save custom theme * @param id Theme identifier * @param name Theme display name * @param brandColors Brand colors * @param description Optional description * @returns Created theme */ createCustomTheme(id: string, name: string, brandColors: BrandColors, description?: string): Theme { const themeConfig: ThemeConfig = { id, name, colors: brandColors, description, createdAt: new Date() }; const theme = this.createCompleteTheme(themeConfig); this.customThemes.set(id, theme); // Save to storage ThemeStorage.saveCustomTheme(themeConfig); this.updateThemeState(); return theme; } /** * Switch to different theme * @param themeId Theme identifier * @param mode Optional mode override */ switchTheme(themeId: string, mode?: 'light' | 'dark'): void { const theme = this.getTheme(themeId); if (!theme) { console.warn(`Theme not found: ${themeId}`); return; } this.currentTheme = theme; if (mode) { this.currentMode = mode; this._currentMode$.next(mode); ThemeStorage.saveCurrentMode(mode); } // Apply the palette const palette = this.currentMode === 'light' ? theme.lightPalette : theme.darkPalette; CSSVariableManager.applyPaletteWithTransition(palette, this.currentMode); // Save preference ThemeStorage.saveCurrentTheme(themeId); this.updateThemeState(); } /** * Apply theme configuration directly * @param themeConfig Theme configuration */ applyThemeConfig(themeConfig: ThemeConfig): void { const theme = this.createCompleteTheme(themeConfig); this.currentTheme = theme; const resolvedMode = themeConfig.mode === 'auto' ? this.currentMode : (themeConfig.mode || this.currentMode); const palette = resolvedMode === 'light' ? theme.lightPalette : theme.darkPalette; CSSVariableManager.applyPaletteWithTransition(palette, resolvedMode); this.currentMode = resolvedMode; this._currentMode$.next(resolvedMode); this.updateThemeState(); } /** * Toggle between light and dark mode */ toggleMode(): void { const newMode = this.currentMode === 'light' ? 'dark' : 'light'; this.switchMode(newMode); } /** * Switch to specific mode * @param mode Target mode */ switchMode(mode: 'light' | 'dark'): void { if (this.currentMode === mode) return; this.currentMode = mode; this._currentMode$.next(mode); if (this.currentTheme) { const palette = mode === 'light' ? this.currentTheme.lightPalette : this.currentTheme.darkPalette; CSSVariableManager.applyPaletteWithTransition(palette, mode); } ThemeStorage.saveCurrentMode(mode); this.updateThemeState(); } // ========================================================================== // COLOR UTILITIES // ========================================================================== /** * Generate color preview for theme selection * @param brandColors Brand colors * @returns Preview color object */ generateColorPreview(brandColors: BrandColors): { [key: string]: string } { return PaletteGenerator.generateColorPreview(brandColors); } /** * Validate color format and accessibility * @param color Color string to validate * @returns Validation results */ validateColor(color: string): ColorValidation { const warnings: string[] = []; const recommendations: string[] = []; // Check format validity if (!HCLConverter.isValidHex(color)) { warnings.push('Invalid hex color format'); return { isValid: false, warnings, recommendations }; } // Check if color is too light/dark for accessibility const hcl = HCLConverter.hexToHcl(color); if (hcl.l < 10) { warnings.push('Color may be too dark for some use cases'); recommendations.push('Consider using lighter tones for better contrast'); } if (hcl.l > 90) { warnings.push('Color may be too light for some use cases'); recommendations.push('Consider using darker tones for better contrast'); } // Check chroma levels if (hcl.c < 10) { recommendations.push('Low chroma - color may appear washed out'); } if (hcl.c > 80) { recommendations.push('High chroma - consider reducing saturation for better balance'); } return { isValid: warnings.length === 0, warnings, recommendations: recommendations.length > 0 ? recommendations : undefined }; } // ========================================================================== // GETTERS // ========================================================================== /** * Get current theme state * @returns Current theme state */ getCurrentThemeState(): ThemeState { return this._themeState$.value; } /** * Get current theme * @returns Current theme or null */ getCurrentTheme(): Theme | null { return this.currentTheme; } /** * Get current mode * @returns Current mode */ getCurrentMode(): 'light' | 'dark' { return this.currentMode; } /** * Get all available themes * @returns Array of theme previews */ getAvailableThemes(): ThemePreview[] { const themes: ThemePreview[] = []; // Add built-in themes this.builtInThemes.forEach(theme => { themes.push({ id: theme.config.id, name: theme.config.name, description: theme.config.description, primary: theme.config.colors.primary, secondary: theme.config.colors.secondary, tertiary: theme.config.colors.tertiary }); }); // Add custom themes this.customThemes.forEach(theme => { themes.push({ id: theme.config.id, name: theme.config.name, description: theme.config.description, primary: theme.config.colors.primary, secondary: theme.config.colors.secondary, tertiary: theme.config.colors.tertiary }); }); return themes; } /** * Check if service is initialized * @returns True if initialized */ isInitialized(): boolean { return this._themeState$.value.isInitialized; } // ========================================================================== // IMPORT/EXPORT // ========================================================================== /** * Export theme configuration * @param themeId Theme to export * @returns JSON string or null */ exportTheme(themeId: string): string | null { return ThemeStorage.exportTheme(themeId); } /** * Import theme from JSON * @param jsonString Theme JSON data * @returns Imported theme or null */ importTheme(jsonString: string): ThemeConfig | null { const imported = ThemeStorage.importTheme(jsonString); if (imported) { // Reload custom themes to include the new one this.loadCustomThemesFromStorage(); this.updateThemeState(); } return imported; } // ========================================================================== // PRIVATE METHODS // ========================================================================== /** * Create complete theme with both light and dark palettes * @param config Theme configuration * @returns Complete theme */ private createCompleteTheme(config: ThemeConfig): Theme { const lightPalette = PaletteGenerator.generateMaterialPalette(config.colors, 'light'); const darkPalette = PaletteGenerator.generateMaterialPalette(config.colors, 'dark'); const lightCSSVariables = CSSVariableManager.generateCSSVariables(lightPalette, 'light'); const darkCSSVariables = CSSVariableManager.generateCSSVariables(darkPalette, 'dark'); return { config, lightPalette, darkPalette, cssVariables: lightCSSVariables // Default to light mode variables }; } /** * Get theme by ID (checks both built-in and custom) * @param themeId Theme identifier * @returns Theme or null */ private getTheme(themeId: string): Theme | null { return this.builtInThemes.get(themeId) || this.customThemes.get(themeId) || null; } /** * Load custom themes from storage */ private loadCustomThemesFromStorage(): void { const customThemes = ThemeStorage.getCustomThemes(); Object.values(customThemes).forEach(config => { const theme = this.createCompleteTheme(config); this.customThemes.set(config.id, theme); }); } /** * Restore user's theme preferences */ private restoreUserPreferences(): void { const savedThemeId = ThemeStorage.getCurrentTheme(); const savedMode = ThemeStorage.getCurrentMode(); this.currentMode = savedMode; this._currentMode$.next(savedMode); if (savedThemeId && this.getTheme(savedThemeId)) { this.switchTheme(savedThemeId, savedMode); } } /** * Set up automatic mode detection based on system preference */ private setupAutoModeDetection(): void { if (typeof window !== 'undefined' && window.matchMedia) { const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)'); const handleChange = (e: MediaQueryListEvent) => { const systemMode = e.matches ? 'dark' : 'light'; this.switchMode(systemMode); }; // Set initial mode const initialSystemMode = mediaQuery.matches ? 'dark' : 'light'; this.switchMode(initialSystemMode); // Listen for changes mediaQuery.addEventListener('change', handleChange); } } /** * Update reactive theme state */ private updateThemeState(): void { const state: ThemeState = { currentTheme: this.currentTheme, availableThemes: this.getAvailableThemes(), mode: this.currentMode, isInitialized: this._themeState$.value.isInitialized }; this._themeState$.next(state); } /** * Mark service as initialized */ private markAsInitialized(): void { const currentState = this._themeState$.value; this._themeState$.next({ ...currentState, isInitialized: true }); } }ƭ>x /** * ========================================================================== * HCL STUDIO - TYPE DEFINITIONS * ========================================================================== * Core interfaces and types for HCL color manipulation and theme management * ========================================================================== */ // ========================================================================== // COLOR TYPES // ========================================================================== /** * HCL color representation */ export interface HCL { /** Hue (0-360 degrees) */ h: number; /** Chroma (0-100+) */ c: number; /** Lightness (0-100) */ l: number; } /** * RGB color representation */ export interface RGB { /** Red (0-255) */ r: number; /** Green (0-255) */ g: number; /** Blue (0-255) */ b: number; } /** * LAB color representation (intermediate for HCL conversion) */ export interface LAB { /** Lightness (0-100) */ l: number; /** Green-Red axis (-128 to 127) */ a: number; /** Blue-Yellow axis (-128 to 127) */ b: number; } // ========================================================================== // PALETTE TYPES // ========================================================================== /** * Tonal palette with Material Design 3 tone levels */ export interface TonalPalette { 0: string; 4: string; 5: string; 6: string; 10: string; 12: string; 15: string; 17: string; 20: string; 22: string; 25: string; 30: string; 35: string; 40: string; 50: string; 60: string; 70: string; 80: string; 87: string; 90: string; 92: string; 94: string; 95: string; 96: string; 98: string; 99: string; 100: string; } /** * Complete Material Design 3 color palette */ export interface MaterialPalette { primary: TonalPalette; secondary: TonalPalette; tertiary: TonalPalette; neutral: TonalPalette; neutralVariant: TonalPalette; error: TonalPalette; } /** * Brand seed colors */ export interface BrandColors { primary: string; secondary: string; tertiary: string; error?: string; } // ========================================================================== // THEME TYPES // ========================================================================== /** * Theme configuration */ export interface ThemeConfig { id: string; name: string; colors: BrandColors; mode?: 'light' | 'dark' | 'auto'; createdAt?: Date; description?: string; } /** * Complete theme with generated palettes */ export interface Theme { config: ThemeConfig; lightPalette: MaterialPalette; darkPalette: MaterialPalette; cssVariables: CSSVariables; } /** * CSS custom properties mapping */ export interface CSSVariables { [key: string]: string; } /** * Theme preview information */ export interface ThemePreview { id: string; name: string; description?: string; primary: string; secondary: string; tertiary: string; } /** * Theme collection */ export interface ThemeCollection { [themeId: string]: Omit; } // ========================================================================== // VALIDATION TYPES // ========================================================================== /** * Color validation result */ export interface ColorValidation { isValid: boolean; warnings: string[]; recommendations?: string[]; accessibility?: AccessibilityInfo; } /** * Accessibility information */ export interface AccessibilityInfo { contrastRatio: number; wcagLevel: 'AA' | 'AAA' | 'fail'; colorBlindSafe: boolean; } // ========================================================================== // SERVICE CONFIGURATION TYPES // ========================================================================== /** * HCL Studio initialization options */ export interface HCLStudioOptions { /** Default theme to apply */ defaultTheme?: string | ThemeConfig; /** Enable automatic mode switching based on system preference */ autoMode?: boolean; /** Storage key for theme persistence */ storageKey?: string; /** Custom theme presets */ themes?: ThemeCollection; /** Validation options */ validation?: { enableContrastCheck: boolean; enableColorBlindCheck: boolean; minContrastRatio: number; }; } /** * Theme state for reactive updates */ export interface ThemeState { currentTheme: Theme | null; availableThemes: ThemePreview[]; mode: 'light' | 'dark'; isInitialized: boolean; } // ========================================================================== // UTILITY TYPES // ========================================================================== /** * Color format types */ export type ColorFormat = 'hex' | 'rgb' | 'hsl' | 'hcl'; /** * Mode switching options */ export type ThemeMode = 'light' | 'dark' | 'auto'; /** * Contrast levels for WCAG compliance */ export type ContrastLevel = 'AA' | 'AAA'; /** * Color harmony types */ export type ColorHarmony = 'complementary' | 'analogous' | 'triadic' | 'tetradic' | 'monochromatic';3x|4/** * ========================================================================== * CSS VARIABLE MANAGER * ========================================================================== * Manages CSS custom properties for dynamic theme switching * Maps Material Design 3 palette to existing design system variables * ========================================================================== */ import { MaterialPalette, CSSVariables } from '../models/hcl.models'; import { PaletteGenerator } from '../core/palette-generator'; export class CSSVariableManager { // ========================================================================== // VARIABLE MAPPING // ========================================================================== /** * Generate CSS variables from Material Design 3 palette * @param palette Material palette * @param mode Light or dark mode * @returns CSS variables object */ static generateCSSVariables(palette: MaterialPalette, mode: 'light' | 'dark' = 'light'): CSSVariables { const variables: CSSVariables = {}; // ========================================================================== // PRIMARY COLORS // ========================================================================== variables['--color-primary-key'] = palette.primary[40]; variables['--color-primary'] = PaletteGenerator.getPrimaryTone(palette.primary, 'main', mode); variables['--color-on-primary'] = mode === 'light' ? palette.primary[100] : palette.primary[20]; variables['--color-primary-container'] = PaletteGenerator.getPrimaryTone(palette.primary, 'container', mode); variables['--color-on-primary-container'] = PaletteGenerator.getPrimaryTone(palette.primary, 'on-container', mode); variables['--color-inverse-primary'] = mode === 'light' ? palette.primary[80] : palette.primary[40]; // ========================================================================== // SECONDARY COLORS // ========================================================================== variables['--color-secondary-key'] = palette.secondary[40]; variables['--color-secondary'] = mode === 'light' ? palette.secondary[40] : palette.secondary[80]; variables['--color-on-secondary'] = mode === 'light' ? palette.secondary[100] : palette.secondary[20]; variables['--color-secondary-container'] = mode === 'light' ? palette.secondary[90] : palette.secondary[30]; variables['--color-on-secondary-container'] = mode === 'light' ? palette.secondary[10] : palette.secondary[90]; // ========================================================================== // TERTIARY COLORS // ========================================================================== variables['--color-tertiary-key'] = palette.tertiary[40]; variables['--color-tertiary'] = mode === 'light' ? palette.tertiary[40] : palette.tertiary[80]; variables['--color-on-tertiary'] = mode === 'light' ? palette.tertiary[100] : palette.tertiary[20]; variables['--color-tertiary-container'] = mode === 'light' ? palette.tertiary[90] : palette.tertiary[30]; variables['--color-on-tertiary-container'] = mode === 'light' ? palette.tertiary[10] : palette.tertiary[90]; // ========================================================================== // ERROR COLORS // ========================================================================== variables['--color-error-key'] = palette.error[40]; variables['--color-error'] = mode === 'light' ? palette.error[40] : palette.error[80]; variables['--color-on-error'] = mode === 'light' ? palette.error[100] : palette.error[20]; variables['--color-error-container'] = mode === 'light' ? palette.error[90] : palette.error[30]; variables['--color-on-error-container'] = mode === 'light' ? palette.error[10] : palette.error[90]; // ========================================================================== // NEUTRAL COLORS // ========================================================================== variables['--color-neutral-key'] = palette.neutral[10]; variables['--color-neutral'] = mode === 'light' ? palette.neutral[25] : palette.neutral[80]; variables['--color-neutral-variant-key'] = palette.neutralVariant[15]; variables['--color-neutral-variant'] = mode === 'light' ? palette.neutralVariant[30] : palette.neutralVariant[70]; // ========================================================================== // SURFACE COLORS (The most important for your existing system) // ========================================================================== if (mode === 'light') { variables['--color-surface'] = palette.neutral[99]; variables['--color-surface-bright'] = palette.neutral[99]; variables['--color-surface-dim'] = palette.neutral[87]; variables['--color-on-surface'] = palette.neutral[10]; variables['--color-surface-lowest'] = palette.neutral[100]; variables['--color-surface-low'] = palette.neutral[96]; variables['--color-surface-container'] = palette.neutral[94]; variables['--color-surface-high'] = palette.neutral[92]; variables['--color-surface-highest'] = palette.neutral[90]; variables['--color-surface-variant'] = palette.neutralVariant[90]; variables['--color-on-surface-variant'] = palette.neutralVariant[30]; variables['--color-inverse-surface'] = palette.neutral[20]; variables['--color-inverse-on-surface'] = palette.neutral[95]; } else { variables['--color-surface'] = palette.neutral[10]; variables['--color-surface-bright'] = palette.neutral[20]; variables['--color-surface-dim'] = palette.neutral[6]; variables['--color-on-surface'] = palette.neutral[90]; variables['--color-surface-lowest'] = palette.neutral[0]; variables['--color-surface-low'] = palette.neutral[4]; variables['--color-surface-container'] = palette.neutral[12]; variables['--color-surface-high'] = palette.neutral[17]; variables['--color-surface-highest'] = palette.neutral[22]; variables['--color-surface-variant'] = palette.neutralVariant[30]; variables['--color-on-surface-variant'] = palette.neutralVariant[80]; variables['--color-inverse-surface'] = palette.neutral[90]; variables['--color-inverse-on-surface'] = palette.neutral[20]; } // ========================================================================== // BACKGROUND COLORS // ========================================================================== variables['--color-background'] = variables['--color-surface']; variables['--color-on-background'] = variables['--color-on-surface']; // ========================================================================== // OUTLINE COLORS // ========================================================================== variables['--color-outline'] = mode === 'light' ? palette.neutralVariant[50] : palette.neutralVariant[60]; variables['--color-outline-variant'] = mode === 'light' ? palette.neutralVariant[80] : palette.neutralVariant[30]; // ========================================================================== // UTILITY COLORS // ========================================================================== variables['--color-shadow'] = '#000000'; variables['--color-surface-tint'] = variables['--color-primary']; variables['--color-scrim'] = '#000000'; return variables; } // ========================================================================== // APPLY METHODS // ========================================================================== /** * Apply CSS variables to document root * @param variables CSS variables to apply */ static applyVariables(variables: CSSVariables): void { const root = document.documentElement; Object.entries(variables).forEach(([property, value]) => { root.style.setProperty(property, value); }); } /** * Apply palette to document root * @param palette Material palette * @param mode Light or dark mode */ static applyPalette(palette: MaterialPalette, mode: 'light' | 'dark' = 'light'): void { const variables = this.generateCSSVariables(palette, mode); this.applyVariables(variables); } /** * Remove all theme-related CSS variables */ static clearVariables(): void { const root = document.documentElement; const variableNames = this.getAllVariableNames(); variableNames.forEach(name => { root.style.removeProperty(name); }); } // ========================================================================== // UTILITY METHODS // ========================================================================== /** * Get all CSS variable names managed by HCL Studio * @returns Array of CSS variable names */ private static getAllVariableNames(): string[] { return [ // Primary '--color-primary-key', '--color-primary', '--color-on-primary', '--color-primary-container', '--color-on-primary-container', '--color-inverse-primary', // Secondary '--color-secondary-key', '--color-secondary', '--color-on-secondary', '--color-secondary-container', '--color-on-secondary-container', // Tertiary '--color-tertiary-key', '--color-tertiary', '--color-on-tertiary', '--color-tertiary-container', '--color-on-tertiary-container', // Error '--color-error-key', '--color-error', '--color-on-error', '--color-error-container', '--color-on-error-container', // Neutral '--color-neutral-key', '--color-neutral', '--color-neutral-variant-key', '--color-neutral-variant', // Surface '--color-surface', '--color-surface-bright', '--color-surface-dim', '--color-on-surface', '--color-surface-lowest', '--color-surface-low', '--color-surface-container', '--color-surface-high', '--color-surface-highest', '--color-surface-variant', '--color-on-surface-variant', '--color-inverse-surface', '--color-inverse-on-surface', // Background '--color-background', '--color-on-background', // Outline '--color-outline', '--color-outline-variant', // Utility '--color-shadow', '--color-surface-tint', '--color-scrim' ]; } /** * Get current CSS variable value * @param variableName CSS variable name (with or without --) * @returns Current variable value */ static getCurrentVariableValue(variableName: string): string { const name = variableName.startsWith('--') ? variableName : `--${variableName}`; return getComputedStyle(document.documentElement).getPropertyValue(name).trim(); } /** * Check if dark mode is currently active * @returns True if dark mode is active */ static isDarkModeActive(): boolean { // Check if surface color is dark (low lightness) const surfaceColor = this.getCurrentVariableValue('--color-surface'); if (!surfaceColor) return false; try { // Simple check: if surface is closer to black than white, it's dark mode const surfaceHex = surfaceColor.startsWith('#') ? surfaceColor : '#FFFFFF'; const surfaceRgb = this.hexToRgb(surfaceHex); const brightness = (surfaceRgb.r * 299 + surfaceRgb.g * 587 + surfaceRgb.b * 114) / 1000; return brightness < 128; } catch { return false; } } /** * Simple hex to RGB conversion for utility * @param hex Hex color * @returns RGB values */ private static hexToRgb(hex: string): { r: number, g: number, b: number } { const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); return result ? { r: parseInt(result[1], 16), g: parseInt(result[2], 16), b: parseInt(result[3], 16) } : { r: 0, g: 0, b: 0 }; } // ========================================================================== // ANIMATION SUPPORT // ========================================================================== /** * Apply variables with smooth transition * @param variables CSS variables to apply * @param duration Transition duration in milliseconds */ static applyVariablesWithTransition(variables: CSSVariables, duration: number = 300): void { const root = document.documentElement; // Add transition for smooth theme changes const transitionProperties = Object.keys(variables).join(', '); root.style.setProperty('transition', `${transitionProperties} ${duration}ms ease-in-out`); // Apply variables this.applyVariables(variables); // Remove transition after animation completes setTimeout(() => { root.style.removeProperty('transition'); }, duration); } /** * Apply palette with smooth transition * @param palette Material palette * @param mode Light or dark mode * @param duration Transition duration in milliseconds */ static applyPaletteWithTransition(palette: MaterialPalette, mode: 'light' | 'dark' = 'light', duration: number = 300): void { const variables = this.generateCSSVariables(palette, mode); this.applyVariablesWithTransition(variables, duration); } }xNx#+/** * ========================================================================== * DEFAULT THEME PRESETS * ========================================================================== * Built-in theme configurations with carefully selected color combinations * Provides professionally designed themes for immediate use * ========================================================================== */ import { ThemeCollection } from '../models/hcl.models'; /** * Default theme collection with professionally curated color combinations */ export const DEFAULT_THEMES: ThemeCollection = { // ========================================================================== // MATERIAL DESIGN THEMES // ========================================================================== 'material-purple': { name: 'Material Purple', description: 'Classic Material Design purple theme', colors: { primary: '#6750A4', secondary: '#625B71', tertiary: '#7D5260' } }, 'material-blue': { name: 'Material Blue', description: 'Material Design blue theme', colors: { primary: '#1976D2', secondary: '#455A64', tertiary: '#7B1FA2' } }, 'material-green': { name: 'Material Green', description: 'Material Design green theme', colors: { primary: '#2E7D32', secondary: '#5D4037', tertiary: '#1976D2' } }, // ========================================================================== // CORPORATE/BUSINESS THEMES // ========================================================================== 'corporate-blue': { name: 'Corporate Blue', description: 'Professional blue theme for business applications', colors: { primary: '#1565C0', secondary: '#37474F', tertiary: '#5E35B1' } }, 'executive': { name: 'Executive', description: 'Sophisticated theme with navy and gold accents', colors: { primary: '#263238', secondary: '#455A64', tertiary: '#FF8F00' } }, 'modern-corporate': { name: 'Modern Corporate', description: 'Contemporary corporate theme with teal accents', colors: { primary: '#00695C', secondary: '#424242', tertiary: '#7B1FA2' } }, // ========================================================================== // NATURE-INSPIRED THEMES // ========================================================================== 'forest': { name: 'Forest', description: 'Deep greens inspired by forest landscapes', colors: { primary: '#2E7D32', secondary: '#5D4037', tertiary: '#FF6F00' } }, 'ocean': { name: 'Ocean', description: 'Cool blues and teals reminiscent of ocean depths', colors: { primary: '#006064', secondary: '#263238', tertiary: '#00ACC1' } }, 'sunset': { name: 'Sunset', description: 'Warm oranges and deep purples of a sunset sky', colors: { primary: '#FF6F00', secondary: '#5D4037', tertiary: '#7B1FA2' } }, 'lavender': { name: 'Lavender Fields', description: 'Soft purples and greens inspired by lavender fields', colors: { primary: '#7E57C2', secondary: '#689F38', tertiary: '#8BC34A' } }, // ========================================================================== // VIBRANT/CREATIVE THEMES // ========================================================================== 'electric': { name: 'Electric', description: 'High-energy theme with electric blues and purples', colors: { primary: '#3F51B5', secondary: '#9C27B0', tertiary: '#00BCD4' } }, 'neon': { name: 'Neon', description: 'Bold neon-inspired theme for creative applications', colors: { primary: '#E91E63', secondary: '#9C27B0', tertiary: '#00BCD4' } }, 'cyberpunk': { name: 'Cyberpunk', description: 'Futuristic theme with cyan and magenta accents', colors: { primary: '#00E5FF', secondary: '#263238', tertiary: '#FF1744' } }, // ========================================================================== // WARM/COZY THEMES // ========================================================================== 'autumn': { name: 'Autumn', description: 'Warm autumn colors with orange and brown tones', colors: { primary: '#FF5722', secondary: '#5D4037', tertiary: '#FF9800' } }, 'coffee': { name: 'Coffee House', description: 'Rich browns and warm tones for a cozy feel', colors: { primary: '#5D4037', secondary: '#8D6E63', tertiary: '#FF8F00' } }, 'golden': { name: 'Golden', description: 'Luxurious theme with gold and deep blue accents', colors: { primary: '#FF8F00', secondary: '#1565C0', tertiary: '#7B1FA2' } }, // ========================================================================== // MONOCHROMATIC THEMES // ========================================================================== 'midnight': { name: 'Midnight', description: 'Dark theme with subtle blue undertones', colors: { primary: '#1A237E', secondary: '#283593', tertiary: '#3F51B5' } }, 'slate': { name: 'Slate', description: 'Sophisticated grays with blue-gray undertones', colors: { primary: '#455A64', secondary: '#607D8B', tertiary: '#90A4AE' } }, 'charcoal': { name: 'Charcoal', description: 'Dark charcoal theme with minimal color accents', colors: { primary: '#263238', secondary: '#37474F', tertiary: '#546E7A' } }, // ========================================================================== // PASTEL/SOFT THEMES // ========================================================================== 'soft-pink': { name: 'Soft Pink', description: 'Gentle theme with soft pink and lavender tones', colors: { primary: '#AD1457', secondary: '#7B1FA2', tertiary: '#512DA8' } }, 'mint': { name: 'Mint', description: 'Fresh theme with mint greens and soft blues', colors: { primary: '#00695C', secondary: '#00838F', tertiary: '#0277BD' } }, 'cream': { name: 'Cream', description: 'Warm, soft theme with cream and beige tones', colors: { primary: '#8D6E63', secondary: '#A1887F', tertiary: '#FF8A65' } }, // ========================================================================== // HIGH CONTRAST THEMES // ========================================================================== 'high-contrast': { name: 'High Contrast', description: 'Maximum contrast theme for accessibility', colors: { primary: '#000000', secondary: '#424242', tertiary: '#757575' } }, 'accessibility': { name: 'Accessibility', description: 'Optimized for maximum readability and contrast', colors: { primary: '#1565C0', secondary: '#0D47A1', tertiary: '#1A237E' } } }; /** * Get theme by category */ export const getThemesByCategory = () => { return { material: ['material-purple', 'material-blue', 'material-green'], corporate: ['corporate-blue', 'executive', 'modern-corporate'], nature: ['forest', 'ocean', 'sunset', 'lavender'], vibrant: ['electric', 'neon', 'cyberpunk'], warm: ['autumn', 'coffee', 'golden'], monochrome: ['midnight', 'slate', 'charcoal'], pastel: ['soft-pink', 'mint', 'cream'], accessibility: ['high-contrast', 'accessibility'] }; }; /** * Get recommended themes for specific use cases */ export const getRecommendedThemes = () => { return { business: ['corporate-blue', 'executive', 'modern-corporate', 'slate'], creative: ['electric', 'neon', 'cyberpunk', 'sunset'], healthcare: ['soft-pink', 'mint', 'ocean', 'accessibility'], finance: ['corporate-blue', 'executive', 'charcoal', 'midnight'], education: ['material-blue', 'forest', 'accessibility', 'mint'], ecommerce: ['material-purple', 'golden', 'sunset', 'electric'], dashboard: ['corporate-blue', 'slate', 'midnight', 'accessibility'], mobile: ['material-purple', 'material-blue', 'ocean', 'neon'] }; }; /** * Get theme metadata * @param themeId Theme identifier * @returns Theme metadata or null */ export const getThemeMetadata = (themeId: string) => { const theme = DEFAULT_THEMES[themeId]; if (!theme) return null; const categories = getThemesByCategory(); const recommendations = getRecommendedThemes(); // Find which category this theme belongs to let category = 'other'; for (const [cat, themes] of Object.entries(categories)) { if (themes.includes(themeId)) { category = cat; break; } } // Find recommended use cases const useCases: string[] = []; for (const [useCase, themes] of Object.entries(recommendations)) { if (themes.includes(themeId)) { useCases.push(useCase); } } return { ...theme, category, useCases, id: themeId }; };_%Vx./** * ========================================================================== * THEME STORAGE SERVICE * ========================================================================== * Handles persistence of themes and user preferences using localStorage * Provides backup and import/export functionality * ========================================================================== */ import { ThemeConfig, ThemeCollection } from '../models/hcl.models'; export class ThemeStorage { private static readonly STORAGE_KEYS = { CURRENT_THEME: 'hcl-studio-current-theme', CURRENT_MODE: 'hcl-studio-current-mode', CUSTOM_THEMES: 'hcl-studio-custom-themes', USER_PREFERENCES: 'hcl-studio-preferences' } as const; // ========================================================================== // CURRENT THEME PERSISTENCE // ========================================================================== /** * Save current theme ID * @param themeId Theme identifier */ static saveCurrentTheme(themeId: string): void { try { localStorage.setItem(this.STORAGE_KEYS.CURRENT_THEME, themeId); } catch (error) { console.warn('Failed to save current theme:', error); } } /** * Get current theme ID * @returns Current theme ID or null */ static getCurrentTheme(): string | null { try { return localStorage.getItem(this.STORAGE_KEYS.CURRENT_THEME); } catch (error) { console.warn('Failed to get current theme:', error); return null; } } /** * Save current mode (light/dark) * @param mode Current mode */ static saveCurrentMode(mode: 'light' | 'dark'): void { try { localStorage.setItem(this.STORAGE_KEYS.CURRENT_MODE, mode); } catch (error) { console.warn('Failed to save current mode:', error); } } /** * Get current mode * @returns Current mode or 'light' as default */ static getCurrentMode(): 'light' | 'dark' { try { const mode = localStorage.getItem(this.STORAGE_KEYS.CURRENT_MODE); return mode === 'dark' ? 'dark' : 'light'; } catch (error) { console.warn('Failed to get current mode:', error); return 'light'; } } // ========================================================================== // CUSTOM THEMES MANAGEMENT // ========================================================================== /** * Save a custom theme * @param themeConfig Theme configuration */ static saveCustomTheme(themeConfig: ThemeConfig): void { try { const customThemes = this.getCustomThemes(); customThemes[themeConfig.id] = { ...themeConfig, createdAt: themeConfig.createdAt || new Date() }; localStorage.setItem(this.STORAGE_KEYS.CUSTOM_THEMES, JSON.stringify(customThemes)); } catch (error) { console.warn('Failed to save custom theme:', error); } } /** * Get all custom themes * @returns Custom themes collection */ static getCustomThemes(): { [id: string]: ThemeConfig } { try { const stored = localStorage.getItem(this.STORAGE_KEYS.CUSTOM_THEMES); return stored ? JSON.parse(stored) : {}; } catch (error) { console.warn('Failed to get custom themes:', error); return {}; } } /** * Get specific custom theme * @param themeId Theme ID * @returns Theme configuration or null */ static getCustomTheme(themeId: string): ThemeConfig | null { const customThemes = this.getCustomThemes(); return customThemes[themeId] || null; } /** * Delete custom theme * @param themeId Theme ID to delete */ static deleteCustomTheme(themeId: string): void { try { const customThemes = this.getCustomThemes(); delete customThemes[themeId]; localStorage.setItem(this.STORAGE_KEYS.CUSTOM_THEMES, JSON.stringify(customThemes)); } catch (error) { console.warn('Failed to delete custom theme:', error); } } /** * Check if theme is custom (user-created) * @param themeId Theme ID * @returns True if theme is custom */ static isCustomTheme(themeId: string): boolean { const customThemes = this.getCustomThemes(); return themeId in customThemes; } // ========================================================================== // USER PREFERENCES // ========================================================================== /** * Save user preferences * @param preferences User preference object */ static savePreferences(preferences: any): void { try { localStorage.setItem(this.STORAGE_KEYS.USER_PREFERENCES, JSON.stringify(preferences)); } catch (error) { console.warn('Failed to save preferences:', error); } } /** * Get user preferences * @returns User preferences or default object */ static getPreferences(): any { try { const stored = localStorage.getItem(this.STORAGE_KEYS.USER_PREFERENCES); return stored ? JSON.parse(stored) : { autoMode: false, transitionDuration: 300, enableSystemTheme: true }; } catch (error) { console.warn('Failed to get preferences:', error); return { autoMode: false, transitionDuration: 300, enableSystemTheme: true }; } } // ========================================================================== // IMPORT/EXPORT FUNCTIONALITY // ========================================================================== /** * Export theme configuration as JSON string * @param themeId Theme ID to export * @returns JSON string or null if theme not found */ static exportTheme(themeId: string): string | null { const customTheme = this.getCustomTheme(themeId); if (!customTheme) return null; const exportData = { version: '1.0', exportDate: new Date().toISOString(), theme: customTheme }; return JSON.stringify(exportData, null, 2); } /** * Import theme from JSON string * @param jsonString JSON theme data * @returns Imported theme config or null if invalid */ static importTheme(jsonString: string): ThemeConfig | null { try { const importData = JSON.parse(jsonString); // Validate import data structure if (!importData.theme || !importData.theme.id || !importData.theme.name || !importData.theme.colors) { throw new Error('Invalid theme format'); } const themeConfig: ThemeConfig = { ...importData.theme, createdAt: new Date(), description: importData.theme.description || 'Imported theme' }; // Check for ID conflicts and rename if necessary const existingThemes = this.getCustomThemes(); if (existingThemes[themeConfig.id]) { themeConfig.id = this.generateUniqueId(themeConfig.id, existingThemes); } // Save imported theme this.saveCustomTheme(themeConfig); return themeConfig; } catch (error) { console.warn('Failed to import theme:', error); return null; } } /** * Export all custom themes * @returns JSON string with all custom themes */ static exportAllThemes(): string { const customThemes = this.getCustomThemes(); const exportData = { version: '1.0', exportDate: new Date().toISOString(), themes: customThemes }; return JSON.stringify(exportData, null, 2); } /** * Import multiple themes from JSON string * @param jsonString JSON data with multiple themes * @returns Array of imported theme IDs */ static importMultipleThemes(jsonString: string): string[] { try { const importData = JSON.parse(jsonString); const importedIds: string[] = []; if (!importData.themes) { throw new Error('Invalid multi-theme format'); } const existingThemes = this.getCustomThemes(); Object.values(importData.themes).forEach((theme: any) => { if (theme.id && theme.name && theme.colors) { let themeConfig: ThemeConfig = { ...theme, createdAt: new Date(), description: theme.description || 'Imported theme' }; // Handle ID conflicts if (existingThemes[themeConfig.id]) { themeConfig.id = this.generateUniqueId(themeConfig.id, existingThemes); } this.saveCustomTheme(themeConfig); importedIds.push(themeConfig.id); } }); return importedIds; } catch (error) { console.warn('Failed to import multiple themes:', error); return []; } } // ========================================================================== // UTILITY METHODS // ========================================================================== /** * Generate unique theme ID to avoid conflicts * @param baseId Base theme ID * @param existingThemes Existing themes to check against * @returns Unique theme ID */ private static generateUniqueId(baseId: string, existingThemes: { [id: string]: any }): string { let counter = 1; let newId = `${baseId}-${counter}`; while (existingThemes[newId]) { counter++; newId = `${baseId}-${counter}`; } return newId; } /** * Clear all stored data (reset to defaults) */ static clearAllData(): void { try { Object.values(this.STORAGE_KEYS).forEach(key => { localStorage.removeItem(key); }); } catch (error) { console.warn('Failed to clear storage data:', error); } } /** * Get storage usage information * @returns Storage usage stats */ static getStorageInfo(): { customThemes: number; totalSize: number; isAvailable: boolean } { try { const customThemes = Object.keys(this.getCustomThemes()).length; let totalSize = 0; Object.values(this.STORAGE_KEYS).forEach(key => { const item = localStorage.getItem(key); if (item) { totalSize += item.length; } }); return { customThemes, totalSize, isAvailable: true }; } catch (error) { return { customThemes: 0, totalSize: 0, isAvailable: false }; } } /** * Check if localStorage is available * @returns True if localStorage is available */ static isStorageAvailable(): boolean { try { const test = 'hcl-studio-test'; localStorage.setItem(test, test); localStorage.removeItem(test); return true; } catch { return false; } } /** * Create backup of all theme data * @returns Backup data object */ static createBackup(): any { return { version: '1.0', backupDate: new Date().toISOString(), currentTheme: this.getCurrentTheme(), currentMode: this.getCurrentMode(), customThemes: this.getCustomThemes(), preferences: this.getPreferences() }; } /** * Restore from backup data * @param backupData Backup data object * @returns True if restore was successful */ static restoreFromBackup(backupData: any): boolean { try { if (backupData.currentTheme) { this.saveCurrentTheme(backupData.currentTheme); } if (backupData.currentMode) { this.saveCurrentMode(backupData.currentMode); } if (backupData.customThemes) { localStorage.setItem(this.STORAGE_KEYS.CUSTOM_THEMES, JSON.stringify(backupData.customThemes)); } if (backupData.preferences) { this.savePreferences(backupData.preferences); } return true; } catch (error) { console.warn('Failed to restore from backup:', error); return false; } } }ϲx}/* * Public API Surface of ui-essentials */ // ========================================================================== // BUTTON COMPONENTS // ========================================================================== export { ButtonComponent, ButtonVariant, ButtonSize, IconPosition } from './lib/components/buttons/button.component'; export { TextButtonComponent } from './lib/components/buttons/text-button.component'; export { GhostButtonComponent } from './lib/components/buttons/ghost-button.component'; export { FabComponent } from './lib/components/buttons/fab.component'; export * from './lib/components/buttons/fab-menu'; export * from './lib/components/buttons/icon-button'; export * from './lib/components/buttons/split-button'; // ========================================================================== // FORM COMPONENTS // ========================================================================== export { TextInputComponent, TextInputSize, TextInputVariant, TextInputType, TextInputState } from './lib/components/forms/input/text-input.component'; export { TextareaComponent } from './lib/components/forms/input/textarea.component'; export * from './lib/components/forms/checkbox'; export * from './lib/components/forms/radio'; export * from './lib/components/forms/search'; export * from './lib/components/forms/switch'; export { SelectComponent } from './lib/components/forms/select/select.component'; export * from './lib/components/forms/autocomplete'; export * from './lib/components/forms/date-picker'; export * from './lib/components/forms/time-picker'; export * from './lib/components/forms/file-upload'; export * from './lib/components/forms/form-field'; export * from './lib/components/forms/range-slider'; export * from './lib/components/forms/color-picker'; export * from './lib/components/forms/tag-input'; // ========================================================================== // DATA DISPLAY COMPONENTS // ========================================================================== export * from './lib/components/data-display/index'; // ========================================================================== // NAVIGATION COMPONENTS // ========================================================================== export * from './lib/components/navigation/index'; // ========================================================================== // MEDIA COMPONENTS // ========================================================================== export * from './lib/components/media/index'; // ========================================================================== // FEEDBACK COMPONENTS // ========================================================================== export * from './lib/components/feedback/index'; // ========================================================================== // OVERLAY COMPONENTS // ========================================================================== export * from './lib/components/overlays/index'; // ========================================================================== // LAYOUT COMPONENTS // ========================================================================== export * from './lib/components/layout/index'; // Layout Components (avoiding conflicts with navigation tab components) // Layout components removed for recreation export { LoadingStateContainerComponent } from './lib/layouts/loading-state-container.component'; export type { LoadingState, ErrorState } from './lib/layouts/loading-state-container.component'; // Split View Component Types export type { PanelConfig, ResizeEvent, SplitDirection, SplitSize, PanelVariant } from './lib/components/layout/split-view/split-view.component'; xUN@c0#JQ#ҰfUKIJ@krh/0In}'p7 ]sr?_'5CmN4ZLO<b铝 [s 4IX$9P<@f[EV%L2CЌf5 F&qab_eqs%}HS7aV@f7?F.n%Q@Fc څv.e1 RqIXX|C/nu]އ$?`5]wCm/ѿ8Qx@j*x?}?Fm}}܂Լb" ;(5$3?or4k8&l[؃빀 r2K2Sa(TsV(9 y9yi: AřUe@:#\2l:MaE@SkҊss2'aP*)-گ`n SsxC+// Layout components removed for recreation[c^/SnjgExοyF KeWx?!5 x import { Component } from '@angular/core'; @Component({ selector: 'lib-ui-data-utils', imports: [], template: `

    ui-data-utils works!

    `, styles: `` }) export class UiDataUtilsComponent { } ?Flxxq[qFbQj@R* -)v-K+Q!+j xoimport { Injectable } from '@angular/core'; @Injectable({ providedIn: 'root' }) export class UiAccessibilityService { constructor() { } } *^1nx8!;8#(5%$3xb"PB>xb CodeDisplan"GYaxb DataUtilso!@x8!#8#(5%4sb9Hxw/* * Public API Surface of shared-utils */ export * from './lib/shared-utils.service'; export * from './lib/shared-utils.component'; ^,ǹx&{ "name": "ui-accessibility", "version": "0.0.1", "description": "Comprehensive accessibility utilities for Angular applications with semantic token integration", "keywords": ["angular", "accessibility", "a11y", "wcag", "focus-management", "screen-reader", "semantic-tokens"], "peerDependencies": { "@angular/common": "^19.2.0", "@angular/core": "^19.2.0", "rxjs": "~7.8.0" }, "dependencies": { "tslib": "^2.3.0" }, "sideEffects": false } .9#x/export * from './screen-reader-only.component';׽x=import { Component, Input } from '@angular/core'; import { CommonModule } from '@angular/common'; @Component({ selector: 'ui-screen-reader-only', standalone: true, imports: [CommonModule], template: ` `, styles: [` .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .sr-only-focusable { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .sr-only-focusable:focus, .sr-only-focusable:active { position: static; width: auto; height: auto; padding: 0.5rem 1rem; margin: 0; overflow: visible; clip: auto; white-space: normal; background: var(--a11y-skip-link-bg, #fff); color: var(--a11y-skip-link-color, #000); border: 1px solid var(--a11y-skip-link-border, #007bff); border-radius: 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); z-index: 10000; } .status-message { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .status-message.status-visible { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; padding: 0.5rem 1rem; margin: 4px 0; background: var(--a11y-skip-link-bg, #fff); border-left: 4px solid var(--a11y-focus-color, #007bff); border-radius: 0 4px 4px 0; } .status-message.status-error { border-left-color: var(--a11y-error-color, #dc3545); } .status-message.status-success { border-left-color: var(--a11y-success-color, #28a745); } .status-message.status-warning { border-left-color: var(--a11y-warning-color, #ffc107); } .instructions { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } @media (prefers-contrast: high) { .sr-only-focusable:focus, .sr-only-focusable:active { background: ButtonFace; color: ButtonText; border-color: ButtonText; } .status-message.status-visible { background: ButtonFace; color: ButtonText; border-color: ButtonText; } } `] }) export class ScreenReaderOnlyComponent { @Input() type: 'default' | 'focusable' | 'status' | 'instructions' = 'default'; @Input() statusType?: 'error' | 'success' | 'warning'; @Input() visible = false; @Input() ariaLive?: 'polite' | 'assertive' | 'off'; @Input() ariaAtomic?: 'true' | 'false'; @Input() role?: string; /** * Get CSS classes based on component configuration */ getClasses(): string { const classes: string[] = []; switch (this.type) { case 'focusable': classes.push('sr-only-focusable'); break; case 'status': classes.push('status-message'); if (this.visible) { classes.push('status-visible'); } if (this.statusType) { classes.push(`status-${this.statusType}`); } break; case 'instructions': classes.push('instructions'); break; default: classes.push('sr-only'); break; } return classes.join(' '); } }ux'export * from './skip-links.component'; ͸ximport { Component, Input, OnInit, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; import { A11yConfigService } from '../../services/a11y-config'; export interface SkipLink { href: string; text: string; ariaLabel?: string; } @Component({ selector: 'ui-skip-links', standalone: true, imports: [CommonModule], template: ` `, styles: [` .skip-links { position: fixed; top: 0; left: 0; z-index: 10000; } .skip-links--after-header { position: relative; display: block; background: var(--a11y-skip-link-bg, #fff); border-bottom: 1px solid var(--a11y-skip-link-border, #ccc); padding: 0.5rem; } .skip-link { position: absolute; top: -40px; left: 6px; background: var(--a11y-skip-link-bg, #fff); color: var(--a11y-skip-link-color, #000); padding: 0.5rem 1rem; text-decoration: none; border: 1px solid var(--a11y-skip-link-border, #007bff); border-radius: 4px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); opacity: 0; pointer-events: none; transform: translateY(-10px); transition: all 0.15s ease-out; font-weight: 500; white-space: nowrap; } .skip-link:focus { top: 6px; opacity: 1; pointer-events: auto; transform: translateY(0); outline: 2px solid var(--a11y-focus-color, #007bff); outline-offset: 2px; } .skip-link:nth-child(2):focus { top: 50px; } .skip-link:nth-child(3):focus { top: 94px; } .skip-link:nth-child(4):focus { top: 138px; } .skip-links--after-header .skip-link { position: static; display: inline-block; margin-right: 1rem; opacity: 1; pointer-events: auto; transform: none; transition: background-color 0.15s ease-out; } .skip-links--after-header .skip-link:hover, .skip-links--after-header .skip-link:focus { background-color: var(--a11y-focus-ring-color, rgba(0, 123, 255, 0.1)); } @media (prefers-contrast: high) { .skip-link { background: ButtonFace; color: ButtonText; border-color: ButtonText; outline-color: Highlight; } } @media (prefers-reduced-motion: reduce) { .skip-link { transition-duration: 0.01s; } } `] }) export class SkipLinksComponent implements OnInit { private config = inject(A11yConfigService); @Input() skipLinks: SkipLink[] = []; @Input() position: 'top' | 'after-header' = 'top'; @Input() showOnFocus = true; ngOnInit(): void { // Use default links from config if none provided if (this.skipLinks.length === 0) { const configLinks = this.config.getSection('skipLinks').links; if (configLinks) { this.skipLinks = configLinks.map(link => ({ href: link.href, text: link.text, ariaLabel: `Skip to ${link.text.toLowerCase()}` })); } } // Use position from config if not explicitly set if (this.position === 'top') { const configPosition = this.config.getSection('skipLinks').position; if (configPosition) { this.position = configPosition; } } } /** * Handle skip link click to ensure proper focus management */ handleSkipLinkClick(event: Event, href: string): void { event.preventDefault(); const targetId = href.replace('#', ''); const targetElement = document.getElementById(targetId); if (targetElement) { // Set tabindex to make element focusable if it's not naturally focusable const originalTabIndex = targetElement.getAttribute('tabindex'); if (!this.isFocusable(targetElement)) { targetElement.setAttribute('tabindex', '-1'); } // Focus the target element targetElement.focus(); // Scroll to the element targetElement.scrollIntoView({ behavior: 'smooth', block: 'start' }); // Restore original tabindex after focus if (originalTabIndex === null && !this.isFocusable(targetElement)) { setTimeout(() => { targetElement.removeAttribute('tabindex'); }, 100); } this.config.log('Skip link activated', { href, targetId }); } else { this.config.warn('Skip link target not found', { href, targetId }); } } /** * Check if an element is naturally focusable */ private isFocusable(element: HTMLElement): boolean { const focusableSelectors = [ 'a[href]', 'button', 'textarea', 'input[type="text"]', 'input[type="radio"]', 'input[type="checkbox"]', 'select', '[tabindex]:not([tabindex="-1"])' ]; return focusableSelectors.some(selector => element.matches(selector)) || element.getAttribute('contenteditable') === 'true'; } }wdپx(import { Directive, ElementRef, Input, OnDestroy, OnInit, Output, EventEmitter, NgZone, inject } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { A11yConfigService } from '../../services/a11y-config'; export type NavigationDirection = 'horizontal' | 'vertical' | 'both' | 'grid'; export interface NavigationEvent { direction: 'up' | 'down' | 'left' | 'right' | 'home' | 'end'; currentIndex: number; nextIndex: number; event: KeyboardEvent; } @Directive({ selector: '[uiArrowNavigation]', standalone: true, exportAs: 'uiArrowNavigation' }) export class ArrowNavigationDirective implements OnInit, OnDestroy { private elementRef = inject(ElementRef); private ngZone = inject(NgZone); private config = inject(A11yConfigService); @Input('uiArrowNavigation') direction: NavigationDirection = 'vertical'; @Input() wrap = true; @Input() skipDisabled = true; @Input() itemSelector = '[tabindex]:not([tabindex="-1"]), button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled])'; @Input() gridColumns?: number; @Output() navigationChange = new EventEmitter(); private destroy$ = new Subject(); private navigableItems: HTMLElement[] = []; private currentIndex = 0; private isGridNavigation = false; ngOnInit(): void { if (this.config.isEnabled('keyboard.enableArrowNavigation')) { this.setupNavigation(); } } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } /** * Navigate to a specific index */ navigateToIndex(index: number): void { this.updateNavigableItems(); if (index >= 0 && index < this.navigableItems.length) { this.currentIndex = index; this.focusCurrentItem(); } } /** * Navigate to the first item */ navigateToFirst(): void { this.navigateToIndex(0); } /** * Navigate to the last item */ navigateToLast(): void { this.updateNavigableItems(); this.navigateToIndex(this.navigableItems.length - 1); } /** * Get the current navigation index */ getCurrentIndex(): number { return this.currentIndex; } /** * Get the total number of navigable items */ getItemCount(): number { this.updateNavigableItems(); return this.navigableItems.length; } /** * Set up navigation listeners */ private setupNavigation(): void { if (typeof document === 'undefined') return; this.isGridNavigation = this.direction === 'grid'; this.updateNavigableItems(); this.setupKeyboardListeners(); this.setupFocusTracking(); } /** * Update the list of navigable items */ private updateNavigableItems(): void { const container = this.elementRef.nativeElement; const items = Array.from( container.querySelectorAll(this.itemSelector) ) as HTMLElement[]; this.navigableItems = this.skipDisabled ? items.filter((item: HTMLElement) => !this.isDisabled(item)) : items; // Update current index if current item is no longer available if (this.currentIndex >= this.navigableItems.length) { this.currentIndex = Math.max(0, this.navigableItems.length - 1); } } /** * Set up keyboard event listeners */ private setupKeyboardListeners(): void { this.ngZone.runOutsideAngular(() => { fromEvent(this.elementRef.nativeElement, 'keydown').pipe( takeUntil(this.destroy$) ).subscribe(event => { this.handleKeyDown(event); }); // Update items when DOM changes const observer = new MutationObserver(() => { this.updateNavigableItems(); }); observer.observe(this.elementRef.nativeElement, { childList: true, subtree: true, attributes: true, attributeFilter: ['disabled', 'tabindex', 'hidden'] }); this.destroy$.subscribe(() => observer.disconnect()); }); } /** * Set up focus tracking to maintain current index */ private setupFocusTracking(): void { this.ngZone.runOutsideAngular(() => { fromEvent(this.elementRef.nativeElement, 'focusin').pipe( takeUntil(this.destroy$) ).subscribe((event) => { const focusEvent = event as FocusEvent; const target = focusEvent.target as HTMLElement; const index = this.navigableItems.indexOf(target); if (index >= 0) { this.currentIndex = index; } }); }); } /** * Handle keyboard navigation */ private handleKeyDown(event: KeyboardEvent): void { if (this.navigableItems.length === 0) return; const { key } = event; let nextIndex = this.currentIndex; let direction: NavigationEvent['direction'] | null = null; switch (key) { case 'ArrowUp': direction = 'up'; nextIndex = this.isGridNavigation ? this.getGridIndex('up') : this.getVerticalIndex('up'); break; case 'ArrowDown': direction = 'down'; nextIndex = this.isGridNavigation ? this.getGridIndex('down') : this.getVerticalIndex('down'); break; case 'ArrowLeft': direction = 'left'; nextIndex = this.isGridNavigation ? this.getGridIndex('left') : this.getHorizontalIndex('left'); break; case 'ArrowRight': direction = 'right'; nextIndex = this.isGridNavigation ? this.getGridIndex('right') : this.getHorizontalIndex('right'); break; case 'Home': direction = 'home'; nextIndex = 0; break; case 'End': direction = 'end'; nextIndex = this.navigableItems.length - 1; break; default: return; // Don't handle other keys } if (direction && this.shouldHandleNavigation(key)) { event.preventDefault(); event.stopPropagation(); const navigationEvent: NavigationEvent = { direction, currentIndex: this.currentIndex, nextIndex, event }; this.ngZone.run(() => { this.navigationChange.emit(navigationEvent); }); if (nextIndex !== this.currentIndex && nextIndex >= 0 && nextIndex < this.navigableItems.length) { this.currentIndex = nextIndex; this.focusCurrentItem(); } } } /** * Check if we should handle this navigation key */ private shouldHandleNavigation(key: string): boolean { switch (this.direction) { case 'horizontal': return ['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(key); case 'vertical': return ['ArrowUp', 'ArrowDown', 'Home', 'End'].includes(key); case 'both': case 'grid': return ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(key); default: return false; } } /** * Get next index for vertical navigation */ private getVerticalIndex(direction: 'up' | 'down'): number { const delta = direction === 'up' ? -1 : 1; let nextIndex = this.currentIndex + delta; if (this.wrap) { if (nextIndex < 0) { nextIndex = this.navigableItems.length - 1; } else if (nextIndex >= this.navigableItems.length) { nextIndex = 0; } } else { nextIndex = Math.max(0, Math.min(this.navigableItems.length - 1, nextIndex)); } return nextIndex; } /** * Get next index for horizontal navigation */ private getHorizontalIndex(direction: 'left' | 'right'): number { const delta = direction === 'left' ? -1 : 1; let nextIndex = this.currentIndex + delta; if (this.wrap) { if (nextIndex < 0) { nextIndex = this.navigableItems.length - 1; } else if (nextIndex >= this.navigableItems.length) { nextIndex = 0; } } else { nextIndex = Math.max(0, Math.min(this.navigableItems.length - 1, nextIndex)); } return nextIndex; } /** * Get next index for grid navigation */ private getGridIndex(direction: 'up' | 'down' | 'left' | 'right'): number { if (!this.gridColumns) { // Fallback to regular navigation if no columns specified return direction === 'up' || direction === 'down' ? this.getVerticalIndex(direction as 'up' | 'down') : this.getHorizontalIndex(direction as 'left' | 'right'); } const currentRow = Math.floor(this.currentIndex / this.gridColumns); const currentCol = this.currentIndex % this.gridColumns; let nextIndex = this.currentIndex; switch (direction) { case 'up': if (currentRow > 0) { nextIndex = (currentRow - 1) * this.gridColumns + currentCol; } else if (this.wrap) { const lastRow = Math.floor((this.navigableItems.length - 1) / this.gridColumns); nextIndex = Math.min(lastRow * this.gridColumns + currentCol, this.navigableItems.length - 1); } break; case 'down': const nextRow = currentRow + 1; const nextRowIndex = nextRow * this.gridColumns + currentCol; if (nextRowIndex < this.navigableItems.length) { nextIndex = nextRowIndex; } else if (this.wrap) { nextIndex = currentCol < this.navigableItems.length ? currentCol : 0; } break; case 'left': if (currentCol > 0) { nextIndex = this.currentIndex - 1; } else if (this.wrap) { const lastInRow = Math.min((currentRow + 1) * this.gridColumns - 1, this.navigableItems.length - 1); nextIndex = lastInRow; } break; case 'right': if (currentCol < this.gridColumns - 1 && this.currentIndex + 1 < this.navigableItems.length) { nextIndex = this.currentIndex + 1; } else if (this.wrap) { nextIndex = currentRow * this.gridColumns; } break; } return nextIndex; } /** * Focus the current item */ private focusCurrentItem(): void { if (this.navigableItems[this.currentIndex]) { this.navigableItems[this.currentIndex].focus(); } } /** * Check if an item is disabled */ private isDisabled(item: HTMLElement): boolean { return item.hasAttribute('disabled') || item.getAttribute('aria-disabled') === 'true' || item.tabIndex === -1; } }Ω#x-export * from './arrow-navigation.directive';p<x$import { Directive, ElementRef, Input, OnDestroy, OnInit, NgZone, inject } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { A11yConfigService } from '../../services/a11y-config'; @Directive({ selector: '[uiFocusTrap]', standalone: true, exportAs: 'uiFocusTrap' }) export class FocusTrapDirective implements OnInit, OnDestroy { private elementRef = inject(ElementRef); private ngZone = inject(NgZone); private config = inject(A11yConfigService); @Input('uiFocusTrap') enabled = true; @Input() autoFocus = true; @Input() restoreFocus = true; private destroy$ = new Subject(); private previouslyFocusedElement: HTMLElement | null = null; private focusableElements: HTMLElement[] = []; private firstFocusable: HTMLElement | null = null; private lastFocusable: HTMLElement | null = null; ngOnInit(): void { if (this.enabled) { this.setupFocusTrap(); } } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); if (this.restoreFocus && this.previouslyFocusedElement) { this.previouslyFocusedElement.focus(); } } /** * Enable the focus trap */ enable(): void { this.enabled = true; this.setupFocusTrap(); } /** * Disable the focus trap */ disable(): void { this.enabled = false; this.destroy$.next(); if (this.restoreFocus && this.previouslyFocusedElement) { this.previouslyFocusedElement.focus(); } } /** * Manually focus the first focusable element */ focusFirst(): void { this.updateFocusableElements(); if (this.firstFocusable) { this.firstFocusable.focus(); } } /** * Manually focus the last focusable element */ focusLast(): void { this.updateFocusableElements(); if (this.lastFocusable) { this.lastFocusable.focus(); } } /** * Set up the focus trap */ private setupFocusTrap(): void { if (!this.enabled || typeof document === 'undefined') return; // Store the currently focused element to restore later this.previouslyFocusedElement = document.activeElement as HTMLElement; // Set up the trap setTimeout(() => { this.updateFocusableElements(); this.setupKeyboardListeners(); if (this.autoFocus) { this.focusFirst(); } }, 0); } /** * Update the list of focusable elements */ private updateFocusableElements(): void { const container = this.elementRef.nativeElement; const focusableSelectors = [ 'a[href]:not([disabled])', 'button:not([disabled])', 'textarea:not([disabled])', 'input:not([disabled])', 'select:not([disabled])', '[tabindex]:not([tabindex="-1"]):not([disabled])', '[contenteditable="true"]:not([disabled])', 'audio[controls]:not([disabled])', 'video[controls]:not([disabled])', 'iframe:not([disabled])', 'object:not([disabled])', 'embed:not([disabled])', 'area[href]:not([disabled])', 'summary:not([disabled])' ].join(', '); const elements = container.querySelectorAll(focusableSelectors); this.focusableElements = Array.from(elements) .filter((element) => { const htmlElement = element as HTMLElement; // Filter out hidden elements return ( htmlElement.offsetWidth > 0 || htmlElement.offsetHeight > 0 || htmlElement.getClientRects().length > 0 ); }) as HTMLElement[]; this.firstFocusable = this.focusableElements[0] || null; this.lastFocusable = this.focusableElements[this.focusableElements.length - 1] || null; } /** * Set up keyboard event listeners */ private setupKeyboardListeners(): void { this.ngZone.runOutsideAngular(() => { fromEvent(document, 'keydown').pipe( takeUntil(this.destroy$) ).subscribe(event => { if (event.key === 'Tab') { this.handleTabKey(event); } }); // Update focusable elements when DOM changes const observer = new MutationObserver(() => { this.updateFocusableElements(); }); observer.observe(this.elementRef.nativeElement, { childList: true, subtree: true, attributes: true, attributeFilter: ['tabindex', 'disabled', 'hidden'] }); // Clean up observer this.destroy$.subscribe(() => observer.disconnect()); }); } /** * Handle Tab key press */ private handleTabKey(event: KeyboardEvent): void { if (!this.enabled || this.focusableElements.length === 0) return; // Check if focus is within our trap const activeElement = document.activeElement as HTMLElement; const isWithinTrap = this.elementRef.nativeElement.contains(activeElement); if (!isWithinTrap) { // Focus escaped the trap, bring it back event.preventDefault(); this.focusFirst(); return; } // Handle normal tab navigation within trap if (event.shiftKey) { // Shift + Tab (backward) if (activeElement === this.firstFocusable) { event.preventDefault(); this.focusLast(); } } else { // Tab (forward) if (activeElement === this.lastFocusable) { event.preventDefault(); this.focusFirst(); } } } }{ܷx'export * from './focus-trap.directive'; xLimport { Injectable, InjectionToken } from '@angular/core'; export interface A11yConfiguration { // Live announcer settings announcer?: { defaultPoliteness?: 'polite' | 'assertive'; defaultDuration?: number; enabled?: boolean; }; // Focus management settings focusManagement?: { trapFocus?: boolean; restoreFocus?: boolean; focusVisibleEnabled?: boolean; focusOriginDetection?: boolean; }; // Keyboard navigation settings keyboard?: { enableShortcuts?: boolean; enableArrowNavigation?: boolean; enableRovingTabindex?: boolean; customShortcuts?: Array<{ key: string; ctrlKey?: boolean; shiftKey?: boolean; altKey?: boolean; description?: string; }>; }; // Skip links settings skipLinks?: { enabled?: boolean; position?: 'top' | 'after-header'; showOnFocus?: boolean; links?: Array<{ href: string; text: string; }>; }; // Auto-enhancement settings autoEnhancement?: { enabled?: boolean; enhanceComponents?: string[]; // Component selectors to enhance addAriaAttributes?: boolean; addKeyboardSupport?: boolean; addFocusManagement?: boolean; }; // High contrast and reduced motion accessibility?: { respectReducedMotion?: boolean; respectHighContrast?: boolean; injectAccessibilityStyles?: boolean; addBodyClasses?: boolean; }; // Development settings development?: { warnings?: boolean; logging?: boolean; accessibilityAuditing?: boolean; }; } export const DEFAULT_A11Y_CONFIG: Required = { announcer: { defaultPoliteness: 'polite', defaultDuration: 4000, enabled: true }, focusManagement: { trapFocus: true, restoreFocus: true, focusVisibleEnabled: true, focusOriginDetection: true }, keyboard: { enableShortcuts: true, enableArrowNavigation: true, enableRovingTabindex: true, customShortcuts: [] }, skipLinks: { enabled: true, position: 'top', showOnFocus: true, links: [ { href: '#main', text: 'Skip to main content' }, { href: '#navigation', text: 'Skip to navigation' } ] }, autoEnhancement: { enabled: false, enhanceComponents: [], addAriaAttributes: true, addKeyboardSupport: true, addFocusManagement: true }, accessibility: { respectReducedMotion: true, respectHighContrast: true, injectAccessibilityStyles: true, addBodyClasses: true }, development: { warnings: true, logging: false, accessibilityAuditing: false } }; export const A11Y_CONFIG = new InjectionToken('A11Y_CONFIG'); @Injectable({ providedIn: 'root' }) export class A11yConfigService { private config: Required; constructor() { this.config = { ...DEFAULT_A11Y_CONFIG }; } /** * Update the configuration */ updateConfig(config: Partial): void { this.config = this.mergeConfig(this.config, config); } /** * Get the current configuration */ getConfig(): Required { return { ...this.config }; } /** * Get a specific configuration section */ getSection(section: K): Required[K] { return this.config[section]; } /** * Check if a feature is enabled */ isEnabled(feature: string): boolean { const parts = feature.split('.'); let current: any = this.config; for (const part of parts) { if (current && typeof current === 'object' && part in current) { current = current[part]; } else { return false; } } return current === true; } /** * Log a message if logging is enabled */ log(message: string, ...args: any[]): void { if (this.config.development.logging) { console.log(`[A11y]`, message, ...args); } } /** * Log a warning if warnings are enabled */ warn(message: string, ...args: any[]): void { if (this.config.development.warnings) { console.warn(`[A11y Warning]`, message, ...args); } } /** * Log an error */ error(message: string, ...args: any[]): void { console.error(`[A11y Error]`, message, ...args); } /** * Deep merge configuration objects */ private mergeConfig( base: Required, override: Partial ): Required { const result = { ...base }; for (const key in override) { const value = override[key as keyof A11yConfiguration]; if (value !== undefined) { if (typeof value === 'object' && !Array.isArray(value) && value !== null) { (result as any)[key] = this.mergeObjects( (result as any)[key] || {}, value ); } else { (result as any)[key] = value; } } } return result; } /** * Deep merge objects */ private mergeObjects(base: any, override: any): any { const result = { ...base }; for (const key in override) { const value = override[key]; if (value !== undefined) { if (typeof value === 'object' && !Array.isArray(value) && value !== null) { result[key] = this.mergeObjects(result[key] || {}, value); } else { result[key] = value; } } } return result; } }Sx&export * from './a11y-config.service';q ſximport { Injectable, NgZone, OnDestroy, ElementRef } from '@angular/core'; import { Observable, Subject, fromEvent, merge } from 'rxjs'; import { takeUntil, map, distinctUntilChanged } from 'rxjs/operators'; export type FocusOrigin = 'keyboard' | 'mouse' | 'touch' | 'program' | null; export interface FocusMonitorOptions { detectSubtleFocusChanges?: boolean; checkChildren?: boolean; } export interface FocusEvent { origin: FocusOrigin; event: Event | null; } @Injectable({ providedIn: 'root' }) export class FocusMonitorService implements OnDestroy { private destroy$ = new Subject(); private currentFocusOrigin: FocusOrigin = null; private lastFocusOrigin: FocusOrigin = null; private lastTouchTarget: EventTarget | null = null; private monitoredElements = new Map; unlisten: () => void; }>(); constructor(private ngZone: NgZone) { this.setupGlobalListeners(); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); // Clean up all monitored elements this.monitoredElements.forEach((info) => info.unlisten()); this.monitoredElements.clear(); } /** * Monitor focus changes on an element */ monitor( element: Element | ElementRef, options: FocusMonitorOptions = {} ): Observable { const elementToMonitor = element instanceof ElementRef ? element.nativeElement : element; if (this.monitoredElements.has(elementToMonitor)) { return this.monitoredElements.get(elementToMonitor)!.subject.asObservable(); } const subject = new Subject(); const focusHandler = (event: FocusEvent) => { subject.next(event); }; const blurHandler = () => { subject.next({ origin: null, event: null }); }; // Set up event listeners const focusListener = this.ngZone.runOutsideAngular(() => { return fromEvent(elementToMonitor, 'focus', { capture: true }).pipe( takeUntil(this.destroy$), map((event: Event) => ({ origin: this.currentFocusOrigin, event })) ).subscribe(focusHandler); }); const blurListener = this.ngZone.runOutsideAngular(() => { return fromEvent(elementToMonitor, 'blur', { capture: true }).pipe( takeUntil(this.destroy$) ).subscribe(blurHandler); }); const unlisten = () => { focusListener.unsubscribe(); blurListener.unsubscribe(); subject.complete(); }; this.monitoredElements.set(elementToMonitor, { subject, unlisten }); return subject.asObservable().pipe( distinctUntilChanged((x, y) => x.origin === y.origin) ); } /** * Stop monitoring focus changes on an element */ stopMonitoring(element: Element | ElementRef): void { const elementToStop = element instanceof ElementRef ? element.nativeElement : element; const info = this.monitoredElements.get(elementToStop); if (info) { info.unlisten(); this.monitoredElements.delete(elementToStop); } } /** * Focus an element and mark it as programmatically focused */ focusVia(element: Element | ElementRef, origin: FocusOrigin): void { const elementToFocus = element instanceof ElementRef ? element.nativeElement : element; this.setOrigin(origin); if (typeof (elementToFocus as any).focus === 'function') { (elementToFocus as HTMLElement).focus(); } } /** * Get the current focus origin */ getCurrentFocusOrigin(): FocusOrigin { return this.currentFocusOrigin; } /** * Set the focus origin for the next focus event */ private setOrigin(origin: FocusOrigin): void { this.currentFocusOrigin = origin; this.lastFocusOrigin = origin; } /** * Set up global event listeners to detect focus origin */ private setupGlobalListeners(): void { if (typeof document === 'undefined') return; this.ngZone.runOutsideAngular(() => { // Mouse events merge( fromEvent(document, 'mousedown', { capture: true }), fromEvent(document, 'mouseup', { capture: true }) ).pipe( takeUntil(this.destroy$) ).subscribe(() => { this.setOrigin('mouse'); }); // Keyboard events fromEvent(document, 'keydown', { capture: true }).pipe( takeUntil(this.destroy$) ).subscribe((event) => { const keyEvent = event as KeyboardEvent; // Only set keyboard origin for navigation keys if (this.isNavigationKey(keyEvent.key)) { this.setOrigin('keyboard'); } }); // Touch events fromEvent(document, 'touchstart', { capture: true }).pipe( takeUntil(this.destroy$) ).subscribe((event) => { const touchEvent = event as TouchEvent; this.lastTouchTarget = touchEvent.target; this.setOrigin('touch'); }); // Focus events that might be programmatic fromEvent(document, 'focus', { capture: true }).pipe( takeUntil(this.destroy$) ).subscribe((event) => { // If we don't have an origin, assume it's programmatic if (this.currentFocusOrigin === null) { this.setOrigin('program'); } // Reset origin after a short delay setTimeout(() => { this.currentFocusOrigin = null; }, 1); }); }); } /** * Check if a key is a navigation key */ private isNavigationKey(key: string): boolean { const navigationKeys = [ 'Tab', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End', 'PageUp', 'PageDown', 'Enter', ' ', 'Escape' ]; return navigationKeys.includes(key); } }(^x(export * from './focus-monitor.service';!(;ximport { Injectable, OnDestroy, signal } from '@angular/core'; import { Observable, fromEvent, Subject } from 'rxjs'; import { takeUntil, map, startWith, distinctUntilChanged } from 'rxjs/operators'; export interface AccessibilityPreferences { prefersReducedMotion: boolean; prefersHighContrast: boolean; prefersDarkMode: boolean; prefersReducedTransparency: boolean; } @Injectable({ providedIn: 'root' }) export class HighContrastService implements OnDestroy { private destroy$ = new Subject(); // Reactive signals for preferences readonly prefersReducedMotion = signal(false); readonly prefersHighContrast = signal(false); readonly prefersDarkMode = signal(false); readonly prefersReducedTransparency = signal(false); // Media query lists private reducedMotionQuery?: MediaQueryList; private highContrastQuery?: MediaQueryList; private darkModeQuery?: MediaQueryList; private reducedTransparencyQuery?: MediaQueryList; constructor() { this.setupMediaQueries(); this.updatePreferences(); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } /** * Get all accessibility preferences as an observable */ getPreferences$(): Observable { if (typeof window === 'undefined') { return new Observable(subscriber => { subscriber.next({ prefersReducedMotion: false, prefersHighContrast: false, prefersDarkMode: false, prefersReducedTransparency: false }); }); } return fromEvent(window, 'change').pipe( takeUntil(this.destroy$), startWith(null), map(() => this.getCurrentPreferences()), distinctUntilChanged((prev, curr) => prev.prefersReducedMotion === curr.prefersReducedMotion && prev.prefersHighContrast === curr.prefersHighContrast && prev.prefersDarkMode === curr.prefersDarkMode && prev.prefersReducedTransparency === curr.prefersReducedTransparency ) ); } /** * Get current accessibility preferences */ getCurrentPreferences(): AccessibilityPreferences { return { prefersReducedMotion: this.prefersReducedMotion(), prefersHighContrast: this.prefersHighContrast(), prefersDarkMode: this.prefersDarkMode(), prefersReducedTransparency: this.prefersReducedTransparency() }; } /** * Apply CSS classes to document body based on preferences */ applyPreferencesToBody(): void { if (typeof document === 'undefined') return; const body = document.body; // Remove existing classes body.classList.remove( 'prefers-reduced-motion', 'prefers-high-contrast', 'prefers-dark-mode', 'prefers-reduced-transparency' ); // Add classes based on current preferences if (this.prefersReducedMotion()) { body.classList.add('prefers-reduced-motion'); } if (this.prefersHighContrast()) { body.classList.add('prefers-high-contrast'); } if (this.prefersDarkMode()) { body.classList.add('prefers-dark-mode'); } if (this.prefersReducedTransparency()) { body.classList.add('prefers-reduced-transparency'); } } /** * Get CSS custom properties for motion duration based on reduced motion preference */ getMotionDuration(normalDuration: string, reducedDuration = '0.01s'): string { return this.prefersReducedMotion() ? reducedDuration : normalDuration; } /** * Get appropriate animation timing based on reduced motion preference */ getAnimationConfig(normal: any, reduced: any = { duration: '0.01s', easing: 'linear' }): any { return this.prefersReducedMotion() ? reduced : normal; } /** * Check if user prefers reduced motion and return appropriate CSS */ getReducedMotionCSS(): string { if (this.prefersReducedMotion()) { return ` *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } `; } return ''; } /** * Setup media query listeners */ private setupMediaQueries(): void { if (typeof window === 'undefined') return; // Reduced motion this.reducedMotionQuery = window.matchMedia('(prefers-reduced-motion: reduce)'); this.reducedMotionQuery.addEventListener('change', () => { this.updatePreferences(); this.applyPreferencesToBody(); }); // High contrast this.highContrastQuery = window.matchMedia('(prefers-contrast: high)'); this.highContrastQuery.addEventListener('change', () => { this.updatePreferences(); this.applyPreferencesToBody(); }); // Dark mode this.darkModeQuery = window.matchMedia('(prefers-color-scheme: dark)'); this.darkModeQuery.addEventListener('change', () => { this.updatePreferences(); this.applyPreferencesToBody(); }); // Reduced transparency this.reducedTransparencyQuery = window.matchMedia('(prefers-reduced-transparency: reduce)'); this.reducedTransparencyQuery.addEventListener('change', () => { this.updatePreferences(); this.applyPreferencesToBody(); }); // Apply initial preferences this.applyPreferencesToBody(); } /** * Update preference signals */ private updatePreferences(): void { this.prefersReducedMotion.set(this.reducedMotionQuery?.matches ?? false); this.prefersHighContrast.set(this.highContrastQuery?.matches ?? false); this.prefersDarkMode.set(this.darkModeQuery?.matches ?? false); this.prefersReducedTransparency.set(this.reducedTransparencyQuery?.matches ?? false); } /** * Create a style element with reduced motion CSS */ injectReducedMotionStyles(): void { if (typeof document === 'undefined') return; const existingStyle = document.getElementById('a11y-reduced-motion'); if (existingStyle) return; const style = document.createElement('style'); style.id = 'a11y-reduced-motion'; style.textContent = ` @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } @media (prefers-contrast: high) { * { text-shadow: none !important; box-shadow: none !important; } } `; document.head.appendChild(style); } }nlmx(export * from './high-contrast.service';!x+export * from './keyboard-manager.service';M?xlimport { Injectable, NgZone, OnDestroy } from '@angular/core'; import { fromEvent, Subject } from 'rxjs'; import { takeUntil, filter } from 'rxjs/operators'; export interface KeyboardShortcut { key: string; ctrlKey?: boolean; shiftKey?: boolean; altKey?: boolean; metaKey?: boolean; preventDefault?: boolean; stopPropagation?: boolean; description?: string; handler: (event: KeyboardEvent) => void; } export interface KeyboardShortcutRegistration { id: string; shortcut: KeyboardShortcut; element?: Element; priority?: number; } @Injectable({ providedIn: 'root' }) export class KeyboardManagerService implements OnDestroy { private destroy$ = new Subject(); private shortcuts = new Map(); private globalShortcuts: KeyboardShortcutRegistration[] = []; private elementShortcuts = new Map(); constructor(private ngZone: NgZone) { this.setupGlobalListener(); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); this.shortcuts.clear(); this.globalShortcuts.length = 0; this.elementShortcuts.clear(); } /** * Register a global keyboard shortcut */ registerGlobalShortcut( id: string, shortcut: KeyboardShortcut, priority = 0 ): void { const registration: KeyboardShortcutRegistration = { id, shortcut, priority }; this.shortcuts.set(id, registration); this.globalShortcuts.push(registration); // Sort by priority (higher priority first) this.globalShortcuts.sort((a, b) => (b.priority || 0) - (a.priority || 0)); } /** * Register a keyboard shortcut for a specific element */ registerElementShortcut( id: string, element: Element, shortcut: KeyboardShortcut, priority = 0 ): void { const registration: KeyboardShortcutRegistration = { id, shortcut, element, priority }; this.shortcuts.set(id, registration); if (!this.elementShortcuts.has(element)) { this.elementShortcuts.set(element, []); this.setupElementListener(element); } const elementShortcuts = this.elementShortcuts.get(element)!; elementShortcuts.push(registration); // Sort by priority (higher priority first) elementShortcuts.sort((a, b) => (b.priority || 0) - (a.priority || 0)); } /** * Unregister a keyboard shortcut */ unregisterShortcut(id: string): void { const registration = this.shortcuts.get(id); if (!registration) return; if (registration.element) { // Remove from element shortcuts const elementShortcuts = this.elementShortcuts.get(registration.element); if (elementShortcuts) { const index = elementShortcuts.findIndex(s => s.id === id); if (index >= 0) { elementShortcuts.splice(index, 1); } // Clean up if no shortcuts left for this element if (elementShortcuts.length === 0) { this.elementShortcuts.delete(registration.element); } } } else { // Remove from global shortcuts const index = this.globalShortcuts.findIndex(s => s.id === id); if (index >= 0) { this.globalShortcuts.splice(index, 1); } } this.shortcuts.delete(id); } /** * Get all registered shortcuts */ getShortcuts(): KeyboardShortcutRegistration[] { return Array.from(this.shortcuts.values()); } /** * Get shortcuts for a specific element */ getElementShortcuts(element: Element): KeyboardShortcutRegistration[] { return this.elementShortcuts.get(element) || []; } /** * Get global shortcuts */ getGlobalShortcuts(): KeyboardShortcutRegistration[] { return [...this.globalShortcuts]; } /** * Unregister all keyboard shortcuts */ unregisterAll(): void { this.shortcuts.clear(); this.globalShortcuts.length = 0; this.elementShortcuts.clear(); } /** * Check if a keyboard event matches a shortcut */ private matchesShortcut(event: KeyboardEvent, shortcut: KeyboardShortcut): boolean { if (event.key.toLowerCase() !== shortcut.key.toLowerCase()) { return false; } return ( !!event.ctrlKey === !!shortcut.ctrlKey && !!event.shiftKey === !!shortcut.shiftKey && !!event.altKey === !!shortcut.altKey && !!event.metaKey === !!shortcut.metaKey ); } /** * Handle keyboard event for shortcuts */ private handleKeyboardEvent( event: KeyboardEvent, shortcuts: KeyboardShortcutRegistration[] ): boolean { for (const registration of shortcuts) { if (this.matchesShortcut(event, registration.shortcut)) { if (registration.shortcut.preventDefault) { event.preventDefault(); } if (registration.shortcut.stopPropagation) { event.stopPropagation(); } this.ngZone.run(() => { registration.shortcut.handler(event); }); return true; // Shortcut handled } } return false; // No shortcut matched } /** * Set up global keyboard event listener */ private setupGlobalListener(): void { if (typeof document === 'undefined') return; this.ngZone.runOutsideAngular(() => { fromEvent(document, 'keydown').pipe( takeUntil(this.destroy$), filter(event => this.globalShortcuts.length > 0) ).subscribe(event => { this.handleKeyboardEvent(event, this.globalShortcuts); }); }); } /** * Set up keyboard event listener for a specific element */ private setupElementListener(element: Element): void { this.ngZone.runOutsideAngular(() => { fromEvent(element, 'keydown').pipe( takeUntil(this.destroy$) ).subscribe(event => { const shortcuts = this.elementShortcuts.get(element) || []; this.handleKeyboardEvent(event, shortcuts); }); }); } /** * Create a shortcut description for display purposes */ static getShortcutDescription(shortcut: KeyboardShortcut): string { if (shortcut.description) { return shortcut.description; } const parts: string[] = []; if (shortcut.ctrlKey) parts.push('Ctrl'); if (shortcut.altKey) parts.push('Alt'); if (shortcut.shiftKey) parts.push('Shift'); if (shortcut.metaKey) parts.push('Meta'); parts.push(shortcut.key.toUpperCase()); return parts.join(' + '); } }O;*x)export * from './live-announcer.service';.x>import { Injectable, OnDestroy } from '@angular/core'; export type AriaLivePoliteness = 'off' | 'polite' | 'assertive'; export interface LiveAnnouncementConfig { politeness?: AriaLivePoliteness; duration?: number; clearPrevious?: boolean; } @Injectable({ providedIn: 'root' }) export class LiveAnnouncerService implements OnDestroy { private liveElement?: HTMLElement; private timeouts: Map = new Map(); constructor() { this.createLiveElement(); } ngOnDestroy(): void { this.timeouts.forEach(timeout => clearTimeout(timeout)); this.removeLiveElement(); } /** * Announces a message to screen readers */ announce( message: string, politeness: AriaLivePoliteness = 'polite', duration?: number ): void { this.announceWithConfig(message, { politeness, duration, clearPrevious: true }); } /** * Announces a message with full configuration options */ announceWithConfig(message: string, config: LiveAnnouncementConfig = {}): void { const { politeness = 'polite', duration = 4000, clearPrevious = true } = config; if (!this.liveElement) { this.createLiveElement(); } if (!this.liveElement) return; // Clear any existing timeout for this politeness level if (this.timeouts.has(politeness)) { clearTimeout(this.timeouts.get(politeness)); } // Clear previous message if requested if (clearPrevious) { this.liveElement.textContent = ''; } // Set the politeness level this.liveElement.setAttribute('aria-live', politeness); // Announce the message setTimeout(() => { if (this.liveElement) { this.liveElement.textContent = message; } }, 100); // Clear the message after the specified duration if (duration > 0) { const timeoutId = setTimeout(() => { if (this.liveElement) { this.liveElement.textContent = ''; } this.timeouts.delete(politeness); }, duration); this.timeouts.set(politeness, timeoutId); } } /** * Clears all current announcements */ clear(): void { if (this.liveElement) { this.liveElement.textContent = ''; } this.timeouts.forEach(timeout => clearTimeout(timeout)); this.timeouts.clear(); } /** * Announces multiple messages with delays between them */ announceSequence( messages: string[], politeness: AriaLivePoliteness = 'polite', delayBetween = 1000 ): void { messages.forEach((message, index) => { setTimeout(() => { this.announce(message, politeness); }, index * delayBetween); }); } /** * Creates the live region element */ private createLiveElement(): void { if (typeof document === 'undefined') return; // Remove existing element if it exists this.removeLiveElement(); // Create new live region this.liveElement = document.createElement('div'); this.liveElement.setAttribute('aria-live', 'polite'); this.liveElement.setAttribute('aria-atomic', 'true'); this.liveElement.setAttribute('id', 'a11y-live-announcer'); // Make it invisible but still accessible to screen readers this.liveElement.style.position = 'absolute'; this.liveElement.style.left = '-10000px'; this.liveElement.style.width = '1px'; this.liveElement.style.height = '1px'; this.liveElement.style.overflow = 'hidden'; document.body.appendChild(this.liveElement); } /** * Removes the live region element */ private removeLiveElement(): void { const existing = document.getElementById('a11y-live-announcer'); if (existing) { existing.remove(); } this.liveElement = undefined; } }xH// ========================================================================== // ACCESSIBILITY TOKENS // ========================================================================== // Import semantic tokens for accessibility features // ========================================================================== // Import semantic tokens from design system @use 'ui-design-system/src/styles/semantic/colors' as colors; @use 'ui-design-system/src/styles/semantic/motion' as motion; @use 'ui-design-system/src/styles/semantic/spacing' as spacing; @use 'ui-design-system/src/styles/semantic/shadows' as shadows; @use 'ui-design-system/src/styles/semantic/borders' as borders; @use 'ui-design-system/src/styles/semantic/typography' as typography; // FOCUS INDICATOR TOKENS $a11y-focus-color: colors.$semantic-color-focus !default; $a11y-focus-ring-color: colors.$semantic-color-focus-ring !default; $a11y-focus-ring-width: borders.$semantic-border-focus-width !default; $a11y-focus-shadow: shadows.$semantic-shadow-input-focus !default; $a11y-focus-transition-duration: motion.$semantic-motion-duration-fast !default; $a11y-focus-transition-timing: motion.$semantic-motion-easing-ease-out !default; // SKIP LINKS TOKENS $a11y-skip-link-bg: colors.$semantic-color-surface-primary !default; $a11y-skip-link-color: colors.$semantic-color-text-primary !default; $a11y-skip-link-border: colors.$semantic-color-border-focus !default; $a11y-skip-link-padding-x: spacing.$semantic-spacing-interactive-button-padding-x !default; $a11y-skip-link-padding-y: spacing.$semantic-spacing-interactive-button-padding-y !default; $a11y-skip-link-border-radius: borders.$semantic-border-radius-md !default; $a11y-skip-link-shadow: shadows.$semantic-shadow-button-focus !default; $a11y-skip-link-z-index: 10000 !default; // SCREEN READER ONLY TOKENS $a11y-sr-only-position: absolute !default; $a11y-sr-only-width: 1px !default; $a11y-sr-only-height: 1px !default; $a11y-sr-only-margin: -1px !default; $a11y-sr-only-padding: 0 !default; $a11y-sr-only-overflow: hidden !default; $a11y-sr-only-clip: rect(0, 0, 0, 0) !default; $a11y-sr-only-border: 0 !default; // HIGH CONTRAST MODE TOKENS $a11y-high-contrast-border-color: ButtonText !default; $a11y-high-contrast-bg-color: ButtonFace !default; $a11y-high-contrast-text-color: ButtonText !default; $a11y-high-contrast-focus-color: Highlight !default; // REDUCED MOTION TOKENS $a11y-reduced-motion-duration: motion.$semantic-motion-duration-instant !default; $a11y-reduced-motion-easing: motion.$semantic-motion-easing-linear !default; // TOUCH TARGET TOKENS $a11y-min-touch-target: spacing.$semantic-spacing-interactive-touch-target !default; // LIVE REGION TOKENS $a11y-live-region-position: absolute !default; $a11y-live-region-left: -10000px !default; $a11y-live-region-width: 1px !default; $a11y-live-region-height: 1px !default; $a11y-live-region-overflow: hidden !default; // ERROR AND SUCCESS COLORS FOR HIGH CONTRAST $a11y-error-color: colors.$semantic-color-error !default; $a11y-success-color: colors.$semantic-color-success !default; $a11y-warning-color: colors.$semantic-color-warning !default; // ANIMATION TOKENS FOR ACCESSIBILITY $a11y-animation-fade-duration: motion.$semantic-motion-duration-normal !default; $a11y-animation-slide-duration: motion.$semantic-motion-duration-normal !default; $a11y-animation-scale-duration: motion.$semantic-motion-duration-fast !default; // FOCUS TRAP TOKENS $a11y-focus-trap-outline-color: colors.$semantic-color-focus !default; $a11y-focus-trap-outline-width: 2px !default; $a11y-focus-trap-outline-style: solid !default; $a11y-focus-trap-outline-offset: 2px !default;Ax import { NgModule, ModuleWithProviders, inject, APP_INITIALIZER } from '@angular/core'; import { CommonModule } from '@angular/common'; // Services import { LiveAnnouncerService } from './services/live-announcer'; import { FocusMonitorService } from './services/focus-monitor'; import { KeyboardManagerService } from './services/keyboard-manager'; import { HighContrastService } from './services/high-contrast'; import { A11yConfigService, A11yConfiguration, A11Y_CONFIG } from './services/a11y-config'; // Directives import { FocusTrapDirective } from './directives/focus-trap'; import { ArrowNavigationDirective } from './directives/arrow-navigation'; // Components import { SkipLinksComponent } from './components/skip-links'; import { ScreenReaderOnlyComponent } from './components/screen-reader-only'; const DIRECTIVES = [ FocusTrapDirective, ArrowNavigationDirective ]; const COMPONENTS = [ SkipLinksComponent, ScreenReaderOnlyComponent ]; /** * Initialize accessibility features based on configuration */ export function initializeA11y( config: A11yConfigService, highContrast: HighContrastService ): () => void { return () => { // Apply body classes for accessibility preferences if (config.isEnabled('accessibility.addBodyClasses')) { highContrast.applyPreferencesToBody(); } // Inject accessibility styles if (config.isEnabled('accessibility.injectAccessibilityStyles')) { highContrast.injectReducedMotionStyles(); } // Log initialization config.log('UI Accessibility module initialized', config.getConfig()); }; } @NgModule({ declarations: [], imports: [ CommonModule, ...DIRECTIVES, ...COMPONENTS ], exports: [ ...DIRECTIVES, ...COMPONENTS ] }) export class UiAccessibilityModule { static forRoot(config?: Partial): ModuleWithProviders { return { ngModule: UiAccessibilityModule, providers: [ // Core services LiveAnnouncerService, FocusMonitorService, KeyboardManagerService, HighContrastService, A11yConfigService, // Configuration { provide: A11Y_CONFIG, useValue: config || {} }, // Initialize accessibility features { provide: APP_INITIALIZER, useFactory: initializeA11y, deps: [A11yConfigService, HighContrastService], multi: true } ] }; } static forChild(): ModuleWithProviders { return { ngModule: UiAccessibilityModule, providers: [] }; } constructor() { // Module loaded if (typeof console !== 'undefined') { console.log('🔍 UI Accessibility module loaded'); } } }ۻx+// ========================================================================== // ACCESSIBILITY UTILITIES // ========================================================================== // Main accessibility utility file that imports all utilities // ========================================================================== @use '../tokens/a11y-tokens' as tokens; // Import all utility modules @forward 'focus-visible'; @forward 'screen-reader'; // Skip links styles .skip-links { position: fixed; top: 0; left: 0; z-index: tokens.$a11y-skip-link-z-index; .skip-link { position: absolute; top: -40px; left: 6px; background: tokens.$a11y-skip-link-bg; color: tokens.$a11y-skip-link-color; padding: tokens.$a11y-skip-link-padding-y tokens.$a11y-skip-link-padding-x; text-decoration: none; border: 1px solid tokens.$a11y-skip-link-border; border-radius: tokens.$a11y-skip-link-border-radius; box-shadow: tokens.$a11y-skip-link-shadow; opacity: 0; pointer-events: none; transform: translateY(-10px); transition: all tokens.$a11y-focus-transition-duration tokens.$a11y-focus-transition-timing; &:focus { top: 6px; opacity: 1; pointer-events: auto; transform: translateY(0); } // Multiple skip links positioning &:nth-child(2):focus { top: 50px; } &:nth-child(3):focus { top: 94px; } } } // Touch target sizing .touch-target { min-height: tokens.$a11y-min-touch-target; min-width: tokens.$a11y-min-touch-target; display: inline-flex; align-items: center; justify-content: center; } // Error announcements .error-announcement { @extend .sr-only; &.error-visible { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; color: tokens.$a11y-error-color; font-weight: 600; margin-top: 4px; } } // Loading announcements .loading-announcement { @extend .sr-only; } // Keyboard navigation indicators .keyboard-navigation { // Hide mouse focus indicators when using keyboard navigation &.using-mouse { * { &:focus:not(:focus-visible) { outline: none; box-shadow: none; } } } // Enhanced focus indicators when using keyboard &.using-keyboard { *:focus-visible { outline: 2px solid tokens.$a11y-focus-color; outline-offset: 2px; } } } // High contrast mode utilities @media (prefers-contrast: high) { .high-contrast-border { border: 1px solid tokens.$a11y-high-contrast-border-color !important; } .high-contrast-bg { background: tokens.$a11y-high-contrast-bg-color !important; color: tokens.$a11y-high-contrast-text-color !important; } // Remove shadows and transparency in high contrast * { text-shadow: none !important; box-shadow: none !important; } // Ensure sufficient contrast for interactive elements button, [role="button"], a, input, select, textarea { border: 1px solid tokens.$a11y-high-contrast-border-color; } } // Reduced motion utilities @media (prefers-reduced-motion: reduce) { .respect-reduced-motion { * { animation-duration: tokens.$a11y-reduced-motion-duration !important; animation-iteration-count: 1 !important; transition-duration: tokens.$a11y-reduced-motion-duration !important; scroll-behavior: auto !important; } } } // ARIA live region styling .aria-live-region { @extend .live-region; &.aria-live-assertive { speak: literal; } &.aria-live-polite { speak: spell-out; } } // Focus management utilities .focus-within-highlight { &:focus-within { outline: 1px solid tokens.$a11y-focus-color; outline-offset: 2px; } } // Accessible hide/show animations @keyframes fadeInA11y { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeOutA11y { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-10px); } } .fade-in-a11y { animation: fadeInA11y tokens.$a11y-animation-fade-duration tokens.$a11y-focus-transition-timing; } .fade-out-a11y { animation: fadeOutA11y tokens.$a11y-animation-fade-duration tokens.$a11y-focus-transition-timing; } // Respect reduced motion for animations @media (prefers-reduced-motion: reduce) { .fade-in-a11y, .fade-out-a11y { animation-duration: tokens.$a11y-reduced-motion-duration; animation-timing-function: tokens.$a11y-reduced-motion-easing; } } // Arrow navigation visual indicators (dev mode) .arrow-navigation-active { &.arrow-navigation-debug { position: relative; &::before { content: '← ↑ ↓ → Arrow Navigation'; position: absolute; top: -20px; right: 0; font-size: 12px; color: tokens.$a11y-focus-color; background: tokens.$a11y-skip-link-bg; padding: 2px 6px; border-radius: 3px; z-index: 1000; pointer-events: none; } } // Highlight navigable items [tabindex="0"] { position: relative; &::after { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; border: 1px dashed tokens.$a11y-focus-color; pointer-events: none; opacity: 0.3; } } }ܿx// ========================================================================== // FOCUS VISIBLE UTILITIES // ========================================================================== // Focus management styles using semantic tokens // ========================================================================== @use '../tokens/a11y-tokens' as tokens; // Base focus visible styles .focus-visible, :focus-visible { outline: tokens.$a11y-focus-trap-outline-width tokens.$a11y-focus-trap-outline-style tokens.$a11y-focus-outline-color; outline-offset: tokens.$a11y-focus-trap-outline-offset; transition: outline-color tokens.$a11y-focus-transition-duration tokens.$a11y-focus-transition-timing; } // Remove default focus outline for mouse users :focus:not(:focus-visible) { outline: none; box-shadow: none; } // Focus ring for interactive elements .focus-ring { position: relative; &:focus-visible::after { content: ''; position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; border: tokens.$a11y-focus-ring-width solid tokens.$a11y-focus-color; border-radius: inherit; pointer-events: none; transition: opacity tokens.$a11y-focus-transition-duration tokens.$a11y-focus-transition-timing; opacity: 1; } &:not(:focus-visible)::after { opacity: 0; } } // Focus styles for buttons .btn-focus-visible, button:focus-visible, [role="button"]:focus-visible { outline: tokens.$a11y-focus-trap-outline-width solid tokens.$a11y-focus-color; outline-offset: 2px; box-shadow: tokens.$a11y-focus-shadow; } // Focus styles for form inputs .input-focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { border-color: tokens.$a11y-focus-color; box-shadow: tokens.$a11y-focus-shadow; outline: none; } // Focus styles for links .link-focus-visible, a:focus-visible { outline: tokens.$a11y-focus-trap-outline-width solid tokens.$a11y-focus-color; outline-offset: 2px; text-decoration: underline; } // High contrast mode support @media (prefers-contrast: high) { .focus-visible, :focus-visible { outline-color: tokens.$a11y-high-contrast-focus-color; outline-width: 3px; } .focus-ring:focus-visible::after { border-color: tokens.$a11y-high-contrast-focus-color; border-width: 3px; } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .focus-visible, :focus-visible, .focus-ring::after { transition-duration: tokens.$a11y-reduced-motion-duration; transition-timing-function: tokens.$a11y-reduced-motion-easing; } } // Focus trap container styles .focus-trap-container { position: relative; &.focus-trap-active { isolation: isolate; } // Visual indicator for focus trap (dev mode) &.focus-trap-debug { &::before { content: 'Focus Trap Active'; position: absolute; top: -20px; left: 0; font-size: 12px; color: tokens.$a11y-focus-color; background: tokens.$a11y-skip-link-bg; padding: 2px 6px; border-radius: 3px; z-index: 1000; } } } // Skip to content on focus trap .focus-trap-skip { position: absolute; top: -40px; left: 0; background: tokens.$a11y-skip-link-bg; color: tokens.$a11y-skip-link-color; padding: tokens.$a11y-skip-link-padding-y tokens.$a11y-skip-link-padding-x; text-decoration: none; border: 1px solid tokens.$a11y-skip-link-border; border-radius: tokens.$a11y-skip-link-border-radius; z-index: tokens.$a11y-skip-link-z-index; opacity: 0; pointer-events: none; transform: translateY(-10px); transition: all tokens.$a11y-focus-transition-duration tokens.$a11y-focus-transition-timing; &:focus { opacity: 1; pointer-events: auto; transform: translateY(0); box-shadow: tokens.$a11y-skip-link-shadow; } }}줷xw// ========================================================================== // SCREEN READER UTILITIES // ========================================================================== // Screen reader specific styles using semantic tokens // ========================================================================== @use '../tokens/a11y-tokens' as tokens; // Screen reader only - visually hidden but accessible .sr-only { position: tokens.$a11y-sr-only-position; width: tokens.$a11y-sr-only-width; height: tokens.$a11y-sr-only-height; padding: tokens.$a11y-sr-only-padding; margin: tokens.$a11y-sr-only-margin; overflow: tokens.$a11y-sr-only-overflow; clip: tokens.$a11y-sr-only-clip; white-space: nowrap; border: tokens.$a11y-sr-only-border; } // Screen reader only that becomes visible on focus .sr-only-focusable { @extend .sr-only; &:focus, &:active { position: static; width: auto; height: auto; padding: tokens.$a11y-skip-link-padding-y tokens.$a11y-skip-link-padding-x; margin: 0; overflow: visible; clip: auto; white-space: normal; background: tokens.$a11y-skip-link-bg; color: tokens.$a11y-skip-link-color; border: 1px solid tokens.$a11y-skip-link-border; border-radius: tokens.$a11y-skip-link-border-radius; box-shadow: tokens.$a11y-skip-link-shadow; z-index: tokens.$a11y-skip-link-z-index; } } // Live region for screen reader announcements .live-region { position: tokens.$a11y-live-region-position; left: tokens.$a11y-live-region-left; width: tokens.$a11y-live-region-width; height: tokens.$a11y-live-region-height; overflow: tokens.$a11y-live-region-overflow; } // Status message styling .status-message { @extend .sr-only; &.status-visible { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; padding: tokens.$a11y-skip-link-padding-y tokens.$a11y-skip-link-padding-x; margin: 4px 0; background: tokens.$a11y-skip-link-bg; border-left: 4px solid tokens.$a11y-focus-color; border-radius: 0 tokens.$a11y-skip-link-border-radius tokens.$a11y-skip-link-border-radius 0; } &.status-error { border-left-color: tokens.$a11y-error-color; } &.status-success { border-left-color: tokens.$a11y-success-color; } &.status-warning { border-left-color: tokens.$a11y-warning-color; } } // Screen reader instructions .sr-instructions { @extend .sr-only; // Common instruction patterns &.sr-required::after { content: ' (required)'; } &.sr-optional::after { content: ' (optional)'; } &.sr-expanded::after { content: ' (expanded)'; } &.sr-collapsed::after { content: ' (collapsed)'; } &.sr-selected::after { content: ' (selected)'; } &.sr-current::after { content: ' (current)'; } } // Accessible hide/show with transitions .a11y-hide { opacity: 0; pointer-events: none; transform: scale(0.95); transition: opacity tokens.$a11y-animation-fade-duration tokens.$a11y-focus-transition-timing, transform tokens.$a11y-animation-scale-duration tokens.$a11y-focus-transition-timing; // Still accessible to screen readers when hidden &:not(.a11y-hide-completely) { position: absolute; left: -9999px; } // Completely hidden including from screen readers &.a11y-hide-completely { display: none; } } .a11y-show { opacity: 1; pointer-events: auto; transform: scale(1); transition: opacity tokens.$a11y-animation-fade-duration tokens.$a11y-focus-transition-timing, transform tokens.$a11y-animation-scale-duration tokens.$a11y-focus-transition-timing; } // High contrast mode adjustments @media (prefers-contrast: high) { .sr-only-focusable:focus, .sr-only-focusable:active { background: tokens.$a11y-high-contrast-bg-color; color: tokens.$a11y-high-contrast-text-color; border-color: tokens.$a11y-high-contrast-border-color; } .status-message.status-visible { background: tokens.$a11y-high-contrast-bg-color; color: tokens.$a11y-high-contrast-text-color; border-color: tokens.$a11y-high-contrast-border-color; } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .a11y-hide, .a11y-show, .sr-only-focusable { transition-duration: tokens.$a11y-reduced-motion-duration; transition-timing-function: tokens.$a11y-reduced-motion-easing; } }٭$xK/* * Public API Surface of ui-code-display */ // Components export * from './lib/components/code-snippet/code-snippet.component'; export * from './lib/components/inline-code/inline-code.component'; export * from './lib/components/code-block/code-block.component'; // Directives export * from './lib/directives/copy-button.directive'; // Services export * from './lib/services/syntax-highlighter.service'; export * from './lib/services/theme.service'; // Legacy exports (to be removed) export * from './lib/ui-code-display.service'; export * from './lib/ui-code-display.component'; Xx!accessibility */ // Main module>ui-accessibility.modulN/live-announcer';^focus-monitor';^keyboard-manager';^ high-contras a11y-config2 focus-trap';>/ arrow-navigation';/0 skip-links';>!screen-reader-only';`CT`xjbackgrounds */ // Type= types/indexO.index2index';/0index'; // Util=utils/index'; xx{import { Directive, ElementRef, Input, OnInit, OnDestroy } from '@angular/core'; import { UiAnimationsService } from './ui-animations.service'; @Directive({ selector: '[uiAnimate]', standalone: true }) export class AnimateDirective implements OnInit, OnDestroy { @Input('uiAnimate') animationClass: string = ''; @Input() animationTrigger: 'immediate' | 'hover' | 'click' | 'manual' = 'immediate'; @Input() animationOnce: boolean = false; private hoverHandler?: () => void; private clickHandler?: () => void; constructor( private elementRef: ElementRef, private animationService: UiAnimationsService ) {} ngOnInit() { if (this.animationTrigger === 'immediate') { this.animate(); } else if (this.animationTrigger === 'hover') { this.setupHoverTrigger(); } else if (this.animationTrigger === 'click') { this.setupClickTrigger(); } } ngOnDestroy() { if (this.hoverHandler) { this.elementRef.nativeElement.removeEventListener('mouseenter', this.hoverHandler); } if (this.clickHandler) { this.elementRef.nativeElement.removeEventListener('click', this.clickHandler); } } private setupHoverTrigger() { this.hoverHandler = () => this.animate(); this.elementRef.nativeElement.addEventListener('mouseenter', this.hoverHandler); } private setupClickTrigger() { this.clickHandler = () => this.animate(); this.elementRef.nativeElement.addEventListener('click', this.clickHandler); } private animate() { if (!this.animationClass) return; if (this.animationOnce) { this.animationService.animateOnce(this.elementRef.nativeElement, this.animationClass); } else { this.animationService.animate(this.elementRef.nativeElement, this.animationClass); } } /** * Manually trigger animation (for manual trigger mode) */ public trigger() { this.animate(); } }}Pximport { Injectable } from '@angular/core'; @Injectable({ providedIn: 'root' }) export class UiAnimationsService { /** * Add animation class to element with optional completion callback */ animate(element: HTMLElement, animationClass: string, onComplete?: () => void): Promise { return new Promise((resolve) => { const handleAnimationEnd = () => { element.removeEventListener('animationend', handleAnimationEnd); if (onComplete) onComplete(); resolve(); }; element.addEventListener('animationend', handleAnimationEnd); element.classList.add(animationClass); }); } /** * Remove animation class from element */ removeAnimation(element: HTMLElement, animationClass: string): void { element.classList.remove(animationClass); } /** * Add animation class and automatically remove it after completion */ animateOnce(element: HTMLElement, animationClass: string): Promise { return this.animate(element, animationClass, () => { this.removeAnimation(element, animationClass); }); } /** * Check if element has animation class */ hasAnimation(element: HTMLElement, animationClass: string): boolean { return element.classList.contains(animationClass); } }x{/* * Public API Surface of ui-animations */ export * from './lib/ui-animations.service'; export * from './lib/animate.directive';c+xL // Emphasis Animations // Attention-grabbing animations for highlighting elements // Bounce @keyframes bounce { 0%, 20%, 53%, 80%, 100% { transform: translateY(0); } 40%, 43% { transform: translateY(-24px); } 70% { transform: translateY(-8px); } 90% { transform: translateY(-4px); } } .animate-bounce { animation: bounce 0.6s ease-in-out; } // Shake @keyframes shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); } 20%, 40%, 60%, 80% { transform: translateX(4px); } } .animate-shake { animation: shake 0.6s ease-in-out; } // Pulse @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.05); } 100% { transform: scale(1); } } .animate-pulse { animation: pulse 0.6s ease-in-out infinite; } // Flash @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .animate-flash { animation: flash 0.6s ease-in-out; } // Wobble @keyframes wobble { 0% { transform: translateX(0%); } 15% { transform: translateX(-25%) rotate(-5deg); } 30% { transform: translateX(20%) rotate(3deg); } 45% { transform: translateX(-15%) rotate(-3deg); } 60% { transform: translateX(10%) rotate(2deg); } 75% { transform: translateX(-5%) rotate(-1deg); } 100% { transform: translateX(0%); } } .animate-wobble { animation: wobble 0.6s ease-in-out; } // Swing @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .animate-swing { animation: swing 0.6s ease-in-out; transform-origin: top center; } // Rubber Band @keyframes rubberBand { 0% { transform: scaleX(1); } 30% { transform: scaleX(1.25) scaleY(0.75); } 40% { transform: scaleX(0.75) scaleY(1.25); } 50% { transform: scaleX(1.15) scaleY(0.85); } 65% { transform: scaleX(0.95) scaleY(1.05); } 75% { transform: scaleX(1.05) scaleY(0.95); } 100% { transform: scaleX(1) scaleY(1); } } .animate-rubber-band { animation: rubberBand 0.6s ease-in-out; } // Tada @keyframes tada { 0% { transform: scaleX(1) scaleY(1); } 10%, 20% { transform: scaleX(0.9) scaleY(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { transform: scaleX(1.1) scaleY(1.1) rotate(3deg); } 40%, 60%, 80% { transform: scaleX(1.1) scaleY(1.1) rotate(-3deg); } 100% { transform: scaleX(1) scaleY(1) rotate(0); } } .animate-tada { animation: tada 0.6s ease-in-out; } // Heartbeat @keyframes heartbeat { 0% { transform: scale(1); } 14% { transform: scale(1.3); } 28% { transform: scale(1); } 42% { transform: scale(1.3); } 70% { transform: scale(1); } } .animate-heartbeat { animation: heartbeat 0.6s ease-in-out infinite; } // Jello @keyframes jello { 11.1% { transform: skewX(-12.5deg) skewY(-12.5deg); } 22.2% { transform: skewX(6.25deg) skewY(6.25deg); } 33.3% { transform: skewX(-3.125deg) skewY(-3.125deg); } 44.4% { transform: skewX(1.5625deg) skewY(1.5625deg); } 55.5% { transform: skewX(-0.78125deg) skewY(-0.78125deg); } 66.6% { transform: skewX(0.390625deg) skewY(0.390625deg); } 77.7% { transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } 88.8% { transform: skewX(0.09765625deg) skewY(0.09765625deg); } 100% { transform: skewX(0) skewY(0); } } .animate-jello { animation: jello 0.6s ease-in-out; transform-origin: center; }>x#// Entrance Animations // Elements appearing/entering the view // Fade In @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .animate-fade-in { animation: fadeIn 0.3s ease-out; } // Fade In Up @keyframes fadeInUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-up { animation: fadeInUp 0.3s ease-out; } // Fade In Down @keyframes fadeInDown { from { opacity: 0; transform: translateY(-24px); } to { opacity: 1; transform: translateY(0); } } .animate-fade-in-down { animation: fadeInDown 0.3s ease-out; } // Fade In Left @keyframes fadeInLeft { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: translateX(0); } } .animate-fade-in-left { animation: fadeInLeft 0.3s ease-out; } // Fade In Right @keyframes fadeInRight { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: translateX(0); } } .animate-fade-in-right { animation: fadeInRight 0.3s ease-out; } // Slide In Up @keyframes slideInUp { from { transform: translateY(100%); } to { transform: translateY(0); } } .animate-slide-in-up { animation: slideInUp 0.3s ease-out; } // Slide In Down @keyframes slideInDown { from { transform: translateY(-100%); } to { transform: translateY(0); } } .animate-slide-in-down { animation: slideInDown 0.3s ease-out; } // Zoom In @keyframes zoomIn { from { opacity: 0; transform: scale(0.3); } to { opacity: 1; transform: scale(1); } } .animate-zoom-in { animation: zoomIn 0.3s ease-out; } // Scale Up @keyframes scaleUp { from { transform: scale(0); } to { transform: scale(1); } } .animate-scale-up { animation: scaleUp 0.15s ease-out; } // Rotate In @keyframes rotateIn { from { opacity: 0; transform: rotate(-200deg); } to { opacity: 1; transform: rotate(0); } } .animate-rotate-in { animation: rotateIn 0.3s ease-out; }F겄xB// Exit Animations // Elements disappearing/leaving the view // Fade Out @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .animate-fade-out { animation: fadeOut 0.3s ease-in; } // Fade Out Up @keyframes fadeOutUp { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-24px); } } .animate-fade-out-up { animation: fadeOutUp 0.3s ease-in; } // Fade Out Down @keyframes fadeOutDown { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(24px); } } .animate-fade-out-down { animation: fadeOutDown 0.3s ease-in; } // Fade Out Left @keyframes fadeOutLeft { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(-24px); } } .animate-fade-out-left { animation: fadeOutLeft 0.3s ease-in; } // Fade Out Right @keyframes fadeOutRight { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(24px); } } .animate-fade-out-right { animation: fadeOutRight 0.3s ease-in; } // Slide Out Up @keyframes slideOutUp { from { transform: translateY(0); } to { transform: translateY(-100%); } } .animate-slide-out-up { animation: slideOutUp 0.3s ease-in; } // Slide Out Down @keyframes slideOutDown { from { transform: translateY(0); } to { transform: translateY(100%); } } .animate-slide-out-down { animation: slideOutDown 0.3s ease-in; } // Zoom Out @keyframes zoomOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.3); } } .animate-zoom-out { animation: zoomOut 0.3s ease-in; } // Scale Down @keyframes scaleDown { from { transform: scale(1); } to { transform: scale(0); } } .animate-scale-down { animation: scaleDown 0.15s ease-in; } // Rotate Out @keyframes rotateOut { from { opacity: 1; transform: rotate(0); } to { opacity: 0; transform: rotate(200deg); } } .animate-rotate-out { animation: rotateOut 0.3s ease-in; }7W9xn// Base Transitions // Smooth transitions for common properties // Transition utilities .transition-all { transition: all 0.3s ease; } .transition-opacity { transition: opacity 0.3s ease; } .transition-transform { transition: transform 0.3s ease; } .transition-colors { transition: color, background-color, border-color 0.3s ease; } // Transition durations .transition-fast { transition-duration: 0.15s; } .transition-normal { transition-duration: 0.3s; } .transition-slow { transition-duration: 0.6s; } // Transition timing functions .transition-linear { transition-timing-function: linear; } .transition-ease-in { transition-timing-function: ease-in; } .transition-ease-out { transition-timing-function: ease-out; } .transition-ease-in-out { transition-timing-function: ease-in-out; } .transition-bounce { transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }"n', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { 'class': 'ui-background ui-background--gradient' } }) export class GradientBackgroundComponent implements OnInit, OnDestroy, OnChanges { private readonly elementRef = inject(ElementRef); private readonly backgroundService = inject(BackgroundService); private backgroundId?: string; @Input() type: 'linear' | 'radial' | 'conic' = 'linear'; @Input() colors: string[] = ['#000000', '#ffffff']; @Input() direction?: GradientDirection | string; @Input() shape?: 'circle' | 'ellipse'; @Input() size?: 'closest-side' | 'closest-corner' | 'farthest-side' | 'farthest-corner'; @Input() position?: string; @Input() angle?: string | number; @Input() colorStops?: ColorStop[]; @Input() fullScreen = false; @Input() zIndex?: number; ngOnInit(): void { this.applyBackground(); } ngOnChanges(changes: SimpleChanges): void { const relevantChanges = ['type', 'colors', 'direction', 'shape', 'size', 'position', 'angle', 'colorStops', 'fullScreen', 'zIndex']; if (relevantChanges.some(key => changes[key])) { this.applyBackground(); } } ngOnDestroy(): void { if (this.backgroundId) { this.backgroundService.removeBackground(this.backgroundId); } } private applyBackground(): void { if (this.backgroundId) { this.backgroundService.removeBackground(this.backgroundId); } const colorStops = this.colorStops || this.colors.map(color => ({ color })); let config: LinearGradientConfig | RadialGradientConfig | ConicGradientConfig; switch (this.type) { case 'linear': config = { type: 'linear-gradient', direction: this.direction, colors: colorStops }; break; case 'radial': config = { type: 'radial-gradient', shape: this.shape, size: this.size, position: this.position, colors: colorStops }; break; case 'conic': config = { type: 'conic-gradient', angle: this.angle, position: this.position, colors: colorStops }; break; } if (this.fullScreen) { this.backgroundId = this.backgroundService.applyFullScreenBackground(config, { zIndex: this.zIndex || -1 }); } else { this.backgroundId = this.backgroundService.applyBackground( this.elementRef.nativeElement, config ); } // Update host class this.elementRef.nativeElement.classList.add(`ui-background--${this.type}-gradient`); } }3(`xxImageBackgroundConfigimageimage~Image{ required: true }) url!: string; @Input() size: 'auto' | 'cover' | 'contain' | string = 'cover'; @Input() position = 'center'; @Input() repeat: 'repeat' | 'repeat-x' | 'repeat-y' | 'no-repeat' = 'no-repeat'; @Input() attachment?: 'scroll' | 'fix%ed' | 'local'; @Input() opacity = 1 urlrepeat', 'attachment', 'opacity(!this.url) { return X anfig: ImageBackgroundConfig = { type: 'image', url: this.url, size: this.size, %Zrepeat: this.repeat, attachment: this.attachment, opacity: this.opacity }; 2 } }Д!xPatternConfig, PatternTypepatternOpattern0PatternK) pattern: PatternType = 'dots'; @Input() primaryColor = '#000000'; @Input() secondaryColor = '#ffffff'; @Input() size: string | number = 20B1pattern', 'primaryColor', 'secondaryColor', 'sizeI3]PatternConfig = { type: 'pattern', pattern: this.pattern, primaryColor: this.primaryColor, secondaryColor: this.secondaryColorXN // Update host class !?.classList.add(`ui-background--pattern-${this.pattern}`); } }ڶ] Dx<SolidsolidOsolid0SolidK) color = '#000000'ZBif (changes['color'] || changes['fullScreen'] || changes['zIndex']ۓ]Solid"solid', color: this.color>Ba xCexport * from './solid-background.component'; export * from './gradient-background.component'; export * from './pattern-background.component'; export * from './image-background.component';SBٴx$export * from './backgrounds/index'; x $import { Directive, Input, OnInit, OnDestroy, OnChanges, SimpleChanges, ElementRef, inject } from '@angular/core'; import { BackgroundConfig, BackgroundOptions } from '../types/background.types'; import { BackgroundService } from '../services/background.service'; @Directive({ selector: '[uiBackground]', standalone: true }) export class BackgroundDirective implements OnInit, OnDestroy, OnChanges { private readonly elementRef = inject(ElementRef); private readonly backgroundService = inject(BackgroundService); private backgroundId?: string; @Input('uiBackground') config?: BackgroundConfig; @Input() backgroundOptions?: Partial; @Input() backgroundDisabled = false; ngOnInit(): void { this.applyBackground(); } ngOnChanges(changes: SimpleChanges): void { if (changes['config'] || changes['backgroundOptions'] || changes['backgroundDisabled']) { if (this.backgroundDisabled) { this.removeBackground(); } else { this.applyBackground(); } } } ngOnDestroy(): void { this.removeBackground(); } private applyBackground(): void { if (!this.config || this.backgroundDisabled) { return; } // Remove existing background if present this.removeBackground(); // Apply new background this.backgroundId = this.backgroundService.applyBackground( this.elementRef.nativeElement, this.config ); // Add base CSS class for styling this.elementRef.nativeElement.classList.add('ui-background'); // Add specific CSS classes based on configuration this.addTypeClasses(); } private removeBackground(): void { if (this.backgroundId) { this.backgroundService.removeBackground(this.backgroundId); this.backgroundId = undefined; } // Remove CSS classes this.removeTypeClasses(); this.elementRef.nativeElement.classList.remove('ui-background'); } private addTypeClasses(): void { if (!this.config) return; const element = this.elementRef.nativeElement; element.classList.add(`ui-background--${this.config.type}`); // Add additional classes based on type switch (this.config.type) { case 'linear-gradient': case 'radial-gradient': case 'conic-gradient': element.classList.add('ui-background--gradient'); break; case 'pattern': element.classList.add('ui-background--pattern'); if (this.config.pattern) { element.classList.add(`ui-background--pattern-${this.config.pattern}`); } break; case 'image': element.classList.add('ui-background--image'); break; case 'animated': element.classList.add('ui-background--animated'); break; case 'glass': element.classList.add('ui-background--glass'); break; } } private removeTypeClasses(): void { if (!this.config) return; const element = this.elementRef.nativeElement; const classesToRemove: string[] = []; element.classList.forEach((cls: string) => { if (cls.startsWith('ui-background--')) { classesToRemove.push(cls); } }); classesToRemove.forEach(cls => element.classList.remove(cls)); } }]&x'export * from './background.directive'; Դxkimport { Injectable, signal, computed } from '@angular/core'; import { BackgroundConfig, BackgroundOptions, BackgroundState } from '../types/background.types'; import { BackgroundGenerator } from '../utils/background-generator'; @Injectable({ providedIn: 'root' }) export class BackgroundService { private _activeBackgrounds = signal>(new Map()); // Public computed signals readonly activeBackgrounds = computed(() => Array.from(this._activeBackgrounds().values())); readonly hasActiveBackgrounds = computed(() => this._activeBackgrounds().size > 0); /** * Apply a background to an element */ applyBackground(element: HTMLElement, config: BackgroundConfig, id?: string): string { const backgroundId = id || this.generateId(); const styles = BackgroundGenerator.generateCss(config); // Apply styles to element Object.entries(styles).forEach(([property, value]) => { element.style.setProperty(property, value); }); // Add to active backgrounds this._activeBackgrounds.update(backgrounds => { const newMap = new Map(backgrounds); newMap.set(backgroundId, { active: true, config, element }); return newMap; }); return backgroundId; } /** * Apply a full-screen background */ applyFullScreenBackground(config: BackgroundConfig, options?: Partial): string { const backgroundId = this.generateId(); const element = this.createFullScreenElement(options); const styles = BackgroundGenerator.generateCss(config); Object.entries(styles).forEach(([property, value]) => { element.style.setProperty(property, value); }); document.body.appendChild(element); this._activeBackgrounds.update(backgrounds => { const newMap = new Map(backgrounds); newMap.set(backgroundId, { active: true, config, element }); return newMap; }); return backgroundId; } /** * Update an existing background */ updateBackground(id: string, config: BackgroundConfig): boolean { const backgroundState = this._activeBackgrounds().get(id); if (!backgroundState || !backgroundState.element) { return false; } const styles = BackgroundGenerator.generateCss(config); Object.entries(styles).forEach(([property, value]) => { backgroundState.element!.style.setProperty(property, value); }); this._activeBackgrounds.update(backgrounds => { const newMap = new Map(backgrounds); const existing = newMap.get(id); if (existing) { existing.config = config; newMap.set(id, existing); } return newMap; }); return true; } /** * Remove a background */ removeBackground(id: string): boolean { const backgroundState = this._activeBackgrounds().get(id); if (!backgroundState) { return false; } // Remove full-screen element if it was created by this service if (backgroundState.element?.classList.contains('ui-background-fullscreen')) { backgroundState.element.remove(); } else if (backgroundState.element) { // Clear inline styles for regular elements this.clearElementStyles(backgroundState.element); } this._activeBackgrounds.update(backgrounds => { const newMap = new Map(backgrounds); newMap.delete(id); return newMap; }); return true; } /** * Remove all backgrounds */ removeAllBackgrounds(): void { this._activeBackgrounds().forEach((state, id) => { this.removeBackground(id); }); } /** * Get background state */ getBackground(id: string): BackgroundState | undefined { return this._activeBackgrounds().get(id); } /** * Generate CSS for a configuration without applying it */ generateCss(config: BackgroundConfig): { [key: string]: string } { return BackgroundGenerator.generateCss(config); } /** * Generate a background ID */ private generateId(): string { return `bg-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`; } /** * Create a full-screen background element */ private createFullScreenElement(options?: Partial): HTMLElement { const element = document.createElement('div'); element.className = `ui-background-fullscreen ${options?.className || ''}`.trim(); // Base full-screen styles element.style.position = 'fixed'; element.style.top = '0'; element.style.left = '0'; element.style.width = '100%'; element.style.height = '100%'; element.style.pointerEvents = 'none'; element.style.zIndex = (options?.zIndex || -1).toString(); return element; } /** * Clear background-related styles from an element */ private clearElementStyles(element: HTMLElement): void { const propertiesToClear = [ 'background', 'background-image', 'background-color', 'background-size', 'background-position', 'background-repeat', 'background-attachment', 'backdrop-filter', 'opacity', 'animation' ]; propertiesToClear.forEach(property => { element.style.removeProperty(property); }); } }| x%export * from './background.service';f x9 export type BackgroundType = | 'solid' | 'linear-gradient' | 'radial-gradient' | 'conic-gradient' | 'pattern' | 'image' | 'animated' | 'mesh' | 'noise' | 'glass'; export type PatternType = | 'dots' | 'grid' | 'stripes' | 'diagonal-stripes' | 'chevron' | 'waves' | 'hexagon' | 'triangles' | 'checkerboard' | 'circles' | 'crosshatch' | 'polka-dots'; export type GradientDirection = | 'to-top' | 'to-top-right' | 'to-right' | 'to-bottom-right' | 'to-bottom' | 'to-bottom-left' | 'to-left' | 'to-top-left'; export interface ColorStop { color: string; position?: string | number; } export interface SolidBackgroundConfig { type: 'solid'; color: string; } export interface LinearGradientConfig { type: 'linear-gradient'; direction?: GradientDirection | string; colors: ColorStop[]; } export interface RadialGradientConfig { type: 'radial-gradient'; shape?: 'circle' | 'ellipse'; size?: 'closest-side' | 'closest-corner' | 'farthest-side' | 'farthest-corner'; position?: string; colors: ColorStop[]; } export interface ConicGradientConfig { type: 'conic-gradient'; angle?: string | number; position?: string; colors: ColorStop[]; } export interface PatternConfig { type: 'pattern'; pattern: PatternType; primaryColor?: string; secondaryColor?: string; size?: string | number; opacity?: number; } export interface ImageBackgroundConfig { type: 'image'; url: string; size?: 'auto' | 'cover' | 'contain' | string; position?: string; repeat?: 'repeat' | 'repeat-x' | 'repeat-y' | 'no-repeat'; attachment?: 'scroll' | 'fixed' | 'local'; opacity?: number; } export interface AnimatedBackgroundConfig { type: 'animated'; baseConfig: LinearGradientConfig | RadialGradientConfig | ConicGradientConfig | PatternConfig; duration?: string; timing?: string; iteration?: 'infinite' | number; } export interface MeshGradientConfig { type: 'mesh'; colors: string[]; complexity?: 'low' | 'medium' | 'high'; seed?: number; } export interface NoiseConfig { type: 'noise'; baseColor?: string; intensity?: number; scale?: number; opacity?: number; } export interface GlassConfig { type: 'glass'; backdrop?: 'blur' | 'saturate' | 'both'; intensity?: number; tint?: string; opacity?: number; } export type BackgroundConfig = | SolidBackgroundConfig | LinearGradientConfig | RadialGradientConfig | ConicGradientConfig | PatternConfig | ImageBackgroundConfig | AnimatedBackgroundConfig | MeshGradientConfig | NoiseConfig | GlassConfig; export interface BackgroundOptions { config: BackgroundConfig; zIndex?: number; fullScreen?: boolean; responsive?: boolean; className?: string; } export interface BackgroundState { active: boolean; config?: BackgroundConfig; element?: HTMLElement; }S=x#export * from './background.types';B Jx($import { BackgroundConfig, ColorStop, LinearGradientConfig, RadialGradientConfig, ConicGradientConfig, PatternConfig, ImageBackgroundConfig, SolidBackgroundConfig, AnimatedBackgroundConfig, MeshGradientConfig, NoiseConfig, GlassConfig } from '../types/background.types'; export class BackgroundGenerator { static generateCss(config: BackgroundConfig): { [key: string]: string } { switch (config.type) { case 'solid': return this.generateSolid(config); case 'linear-gradient': return this.generateLinearGradient(config); case 'radial-gradient': return this.generateRadialGradient(config); case 'conic-gradient': return this.generateConicGradient(config); case 'pattern': return this.generatePattern(config); case 'image': return this.generateImage(config); case 'animated': return this.generateAnimated(config); case 'mesh': return this.generateMesh(config); case 'noise': return this.generateNoise(config); case 'glass': return this.generateGlass(config); default: return { background: 'transparent' }; } } private static generateSolid(config: SolidBackgroundConfig): { [key: string]: string } { return { background: config.color, 'background-size': 'cover', 'background-position': 'center', 'background-repeat': 'no-repeat' }; } private static generateLinearGradient(config: LinearGradientConfig): { [key: string]: string } { const direction = config.direction || 'to bottom'; const colorStops = this.formatColorStops(config.colors); return { background: `linear-gradient(${direction}, ${colorStops})`, 'background-size': 'cover', 'background-position': 'center', 'background-repeat': 'no-repeat' }; } private static generateRadialGradient(config: RadialGradientConfig): { [key: string]: string } { const shape = config.shape || 'ellipse'; const size = config.size || 'farthest-corner'; const position = config.position || 'center'; const colorStops = this.formatColorStops(config.colors); return { background: `radial-gradient(${shape} ${size} at ${position}, ${colorStops})`, 'background-size': 'cover', 'background-position': 'center', 'background-repeat': 'no-repeat' }; } private static generateConicGradient(config: ConicGradientConfig): { [key: string]: string } { const angle = config.angle ? `from ${config.angle}deg` : ''; const position = config.position ? `at ${config.position}` : ''; const colorStops = this.formatColorStops(config.colors); return { background: `conic-gradient(${angle} ${position}, ${colorStops})`, 'background-size': 'cover', 'background-position': 'center', 'background-repeat': 'no-repeat' }; } private static generatePattern(config: PatternConfig): { [key: string]: string } { const primaryColor = config.primaryColor || '#000000'; const secondaryColor = config.secondaryColor || '#ffffff'; const size = typeof config.size === 'number' ? `${config.size}px` : (config.size || '20px'); const opacity = config.opacity || 1; const patternCss = this.getPatternCss(config.pattern, primaryColor, secondaryColor, size); return { background: patternCss, opacity: opacity.toString(), 'background-size': size, 'background-repeat': 'repeat' }; } private static generateImage(config: ImageBackgroundConfig): { [key: string]: string } { const styles: { [key: string]: string } = { 'background-image': `url(${config.url})`, 'background-size': config.size || 'cover', 'background-position': config.position || 'center', 'background-repeat': config.repeat || 'no-repeat' }; if (config.attachment) { styles['background-attachment'] = config.attachment; } if (config.opacity !== undefined) { styles['opacity'] = config.opacity.toString(); } return styles; } private static generateAnimated(config: AnimatedBackgroundConfig): { [key: string]: string } { const baseStyles = this.generateCss(config.baseConfig); const duration = config.duration || '5s'; const timing = config.timing || 'ease-in-out'; const iteration = config.iteration === 'infinite' ? 'infinite' : (config.iteration || 1).toString(); return { ...baseStyles, animation: `background-animation ${duration} ${timing} ${iteration}`, }; } private static generateMesh(config: MeshGradientConfig): { [key: string]: string } { // Generate mesh gradient using multiple radial gradients const colors = config.colors; const complexity = config.complexity || 'medium'; // Create multiple overlapping radial gradients const gradients = this.generateMeshGradients(colors, complexity); return { background: gradients.join(', '), 'background-size': '400% 400%', animation: 'mesh-animation 15s ease infinite' }; } private static generateNoise(config: NoiseConfig): { [key: string]: string } { const baseColor = config.baseColor || '#000000'; const intensity = config.intensity || 0.5; const scale = config.scale || 100; const opacity = config.opacity || 1; // Create noise effect using CSS filters and patterns return { background: baseColor, 'background-image': `url("data:image/svg+xml,%3Csvg viewBox='0 0 ${scale} ${scale}' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='${intensity}'/%3E%3C/svg%3E")`, opacity: opacity.toString() }; } private static generateGlass(config: GlassConfig): { [key: string]: string } { const intensity = config.intensity || 10; const tint = config.tint || 'rgba(255, 255, 255, 0.1)'; const opacity = config.opacity || 0.8; const styles: { [key: string]: string } = { background: tint, opacity: opacity.toString(), 'backdrop-filter': `blur(${intensity}px)` }; if (config.backdrop === 'saturate' || config.backdrop === 'both') { styles['backdrop-filter'] += ` saturate(150%)`; } return styles; } private static formatColorStops(colors: ColorStop[]): string { return colors.map(stop => { if (stop.position !== undefined) { const position = typeof stop.position === 'number' ? `${stop.position}%` : stop.position; return `${stop.color} ${position}`; } return stop.color; }).join(', '); } private static getPatternCss(pattern: string, primary: string, secondary: string, size: string): string { const patterns: { [key: string]: string } = { 'dots': `radial-gradient(circle, ${primary} 20%, transparent 20%)`, 'grid': `linear-gradient(${primary} 1px, transparent 1px), linear-gradient(90deg, ${primary} 1px, transparent 1px)`, 'stripes': `linear-gradient(45deg, ${primary} 25%, transparent 25%, transparent 50%, ${primary} 50%, ${primary} 75%, transparent 75%)`, 'diagonal-stripes': `linear-gradient(45deg, ${primary} 25%, transparent 25%, transparent 50%, ${primary} 50%, ${primary} 75%, transparent 75%)`, 'chevron': `linear-gradient(45deg, ${primary} 25%, transparent 25%), linear-gradient(-45deg, ${primary} 25%, transparent 25%)`, 'waves': `radial-gradient(circle at 50% 100%, transparent 40%, ${primary} 40%, ${primary} 60%, transparent 60%)`, 'hexagon': `radial-gradient(circle at 50% 0%, transparent 40%, ${primary} 40%, ${primary} 60%, transparent 60%)`, 'triangles': `linear-gradient(60deg, ${primary} 25%, transparent 25%), linear-gradient(120deg, ${primary} 25%, transparent 25%)`, 'checkerboard': `linear-gradient(45deg, ${primary} 25%, transparent 25%, transparent 75%, ${primary} 75%), linear-gradient(45deg, ${primary} 25%, transparent 25%, transparent 75%, ${primary} 75%)`, 'circles': `radial-gradient(circle, ${primary} 40%, transparent 40%)`, 'crosshatch': `linear-gradient(0deg, ${primary} 1px, transparent 1px), linear-gradient(90deg, ${primary} 1px, transparent 1px), linear-gradient(45deg, ${primary} 1px, transparent 1px), linear-gradient(-45deg, ${primary} 1px, transparent 1px)`, 'polka-dots': `radial-gradient(circle, ${primary} 25%, transparent 25%)` }; return patterns[pattern] || patterns['dots']; } private static generateMeshGradients(colors: string[], complexity: string): string[] { const gradientCount = complexity === 'high' ? 6 : complexity === 'medium' ? 4 : 2; const gradients: string[] = []; for (let i = 0; i < gradientCount; i++) { const color1 = colors[i % colors.length]; const color2 = colors[(i + 1) % colors.length]; const x = Math.random() * 100; const y = Math.random() * 100; const size = 50 + Math.random() * 50; gradients.push( `radial-gradient(${size}% ${size}% at ${x}% ${y}%, ${color1}, transparent)` ); } return gradients; } }ɷx'export * from './background-generator'; ۳lx=22.0.0" }, "peerDependencies": { "@angular/core": "19.2.14", "rxjs": "^6.5.3 || ^7.4.0" } }, "node_modules/@angular/core": { "version": "19.2.14", "resolved": "https://registry.npmjs.org/@angular/core/-/core-19.2.14.tgz", "integrity": "sha512-EVErpW9tGqJ/wNcAN3G/ErH8pHCJ8mM1E6bsJ8UJIpDTZkpqqYjBMtZS9YWH5n3KwUd1tAkAB2w8FK125AjDUQ==", "peer": true, "dependencies": { "tslib": "^2.3.0" }, "engines": { "node": "^18.19.1 || ^20.11.1 || >=22.0.0" }, "peerDependencies": { "rxjs": "^6.5.3 || ^7.4.0", "zone.js": "~0.15.0" } }, "node_modules/@types/prismjs": { "version": "1.26.5", "resolved": "https://registry.npmjs.org/@types/prismjs/-/prismjs-1.26.5.tgz", "integrity": "sha512-AUZTa7hQ2KY5L7AmtSiqxlhWxb4ina0yd8hNbl4TWuqnv/pFP0nDMb3YrfSBf4hJVGLh2YEIBfKaBW/9UEl6IQ==", "peer": true }, "node_modules/prismjs": { "version": "1.30.0", "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.30.0.tgz", "integrity": "sha512-DEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxw==", "peer": true, "engines": { "node": ">=6" } }, "node_modules/rxjs": { "version": "7.8.2", "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz", "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==", "peer": true, "dependencies": { "tslib": "^2.1.0" } }, "node_modules/tslib": { "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==" }, "node_modules/zone.js": { "version": "0.15.1", "resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz", "integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==", "peer": true } } } =o+xvG  2HxB8q"; _!}, }, "sideEffects": false } k>Gxu MIT License Copyright (c) Microsoft Corporation. Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE Dh_xz+MIT LICENSE Copyright (c) 2012 Lea Verou ?MNM3JF: J all[2KI-L}GNI THE SOFTWARE. .m% xYPThe MIT License Copyright (c) 2010-2025 Google LLC. https://angular.dev/license)=x(Angular ======= The sources for this package are in the main [Angular](https://github.com/angular/angular) repo. Please file issues and pull requests against that repo. Usage information and reference details can be found in [Angular documentation](https://angular.dev/overview). License: MIT i*x/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import * as i0 from '@angular/core'; import { InjectionToken, OnDestroy, DoCheck, ElementRef, Renderer2, OnChanges, Type, Injector, NgModuleFactory, ViewContainerRef, SimpleChanges, NgIterable, TrackByFunction, TemplateRef, IterableDiffers, KeyValueDiffers, PipeTransform, ChangeDetectorRef } from '@angular/core'; import { SubscriptionLike, Observable, Subscribable } from 'rxjs'; import { LocationChangeListener, PlatformLocation } from './platform_location.d-Lbv6Ueec.js'; /** * Enables the `Location` service to read route state from the browser's URL. * Angular provides two strategies: * `HashLocationStrategy` and `PathLocationStrategy`. * * Applications should use the `Router` or `Location` services to * interact with application route state. * * For instance, `HashLocationStrategy` produces URLs like * http://example.com/#/foo, * and `PathLocationStrategy` produces * http://example.com/foo as an equivalent URL. * * See these two classes for more. * * @publicApi */ declare abstract class LocationStrategy { abstract path(includeHash?: boolean): string; abstract prepareExternalUrl(internal: string): string; abstract getState(): unknown; abstract pushState(state: any, title: string, url: string, queryParams: string): void; abstract replaceState(state: any, title: string, url: string, queryParams: string): void; abstract forward(): void; abstract back(): void; historyGo?(relativePosition: number): void; abstract onPopState(fn: LocationChangeListener): void; abstract getBaseHref(): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * A predefined DI token for the base href * to be used with the `PathLocationStrategy`. * The base href is the URL prefix that should be preserved when generating * and recognizing URLs. * * @usageNotes * * The following example shows how to use this token to configure the root app injector * with a base href value, so that the DI framework can supply the dependency anywhere in the app. * * ```ts * import {NgModule} from '@angular/core'; * import {APP_BASE_HREF} from '@angular/common'; * * @NgModule({ * providers: [{provide: APP_BASE_HREF, useValue: '/my/app'}] * }) * class AppModule {} * ``` * * @publicApi */ declare const APP_BASE_HREF: InjectionToken; /** * @description * A {@link LocationStrategy} used to configure the {@link Location} service to * represent its state in the * [path](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) of the * browser's URL. * * If you're using `PathLocationStrategy`, you may provide a {@link APP_BASE_HREF} * or add a `` element to the document to override the default. * * For instance, if you provide an `APP_BASE_HREF` of `'/my/app/'` and call * `location.go('/foo')`, the browser's URL will become * `example.com/my/app/foo`. To ensure all relative URIs resolve correctly, * the `` and/or `APP_BASE_HREF` should end with a `/`. * * Similarly, if you add `` to the document and call * `location.go('/foo')`, the browser's URL will become * `example.com/my/app/foo`. * * Note that when using `PathLocationStrategy`, neither the query nor * the fragment in the `` will be preserved, as outlined * by the [RFC](https://tools.ietf.org/html/rfc3986#section-5.2.2). * * @usageNotes * * ### Example * * {@example common/location/ts/path_location_component.ts region='LocationComponent'} * * @publicApi */ declare class PathLocationStrategy extends LocationStrategy implements OnDestroy { private _platformLocation; private _baseHref; private _removeListenerFns; constructor(_platformLocation: PlatformLocation, href?: string); /** @docs-private */ ngOnDestroy(): void; onPopState(fn: LocationChangeListener): void; getBaseHref(): string; prepareExternalUrl(internal: string): string; path(includeHash?: boolean): string; pushState(state: any, title: string, url: string, queryParams: string): void; replaceState(state: any, title: string, url: string, queryParams: string): void; forward(): void; back(): void; getState(): unknown; historyGo(relativePosition?: number): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** @publicApi */ interface PopStateEvent { pop?: boolean; state?: any; type?: string; url?: string; } /** * @description * * A service that applications can use to interact with a browser's URL. * * Depending on the `LocationStrategy` used, `Location` persists * to the URL's path or the URL's hash segment. * * @usageNotes * * It's better to use the `Router.navigate()` service to trigger route changes. Use * `Location` only if you need to interact with or create normalized URLs outside of * routing. * * `Location` is responsible for normalizing the URL against the application's base href. * A normalized URL is absolute from the URL host, includes the application's base href, and has no * trailing slash: * - `/my/app/user/123` is normalized * - `my/app/user/123` **is not** normalized * - `/my/app/user/123/` **is not** normalized * * ### Example * * {@example common/location/ts/path_location_component.ts region='LocationComponent'} * * @publicApi */ declare class Location implements OnDestroy { constructor(locationStrategy: LocationStrategy); /** @docs-private */ ngOnDestroy(): void; /** * Normalizes the URL path for this location. * * @param includeHash True to include an anchor fragment in the path. * * @returns The normalized URL path. */ path(includeHash?: boolean): string; /** * Reports the current state of the location history. * @returns The current value of the `history.state` object. */ getState(): unknown; /** * Normalizes the given path and compares to the current normalized path. * * @param path The given URL path. * @param query Query parameters. * * @returns True if the given URL path is equal to the current normalized path, false * otherwise. */ isCurrentPathEqualTo(path: string, query?: string): boolean; /** * Normalizes a URL path by stripping any trailing slashes. * * @param url String representing a URL. * * @returns The normalized URL string. */ normalize(url: string): string; /** * Normalizes an external URL path. * If the given URL doesn't begin with a leading slash (`'/'`), adds one * before normalizing. Adds a hash if `HashLocationStrategy` is * in use, or the `APP_BASE_HREF` if the `PathLocationStrategy` is in use. * * @param url String representing a URL. * * @returns A normalized platform-specific URL. */ prepareExternalUrl(url: string): string; /** * Changes the browser's URL to a normalized version of a given URL, and pushes a * new item onto the platform's history. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. * */ go(path: string, query?: string, state?: any): void; /** * Changes the browser's URL to a normalized version of the given URL, and replaces * the top item on the platform's history stack. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. */ replaceState(path: string, query?: string, state?: any): void; /** * Navigates forward in the platform's history. */ forward(): void; /** * Navigates back in the platform's history. */ back(): void; /** * Navigate to a specific page from session history, identified by its relative position to the * current page. * * @param relativePosition Position of the target page in the history relative to the current * page. * A negative value moves backwards, a positive value moves forwards, e.g. `location.historyGo(2)` * moves forward two pages and `location.historyGo(-2)` moves back two pages. When we try to go * beyond what's stored in the history session, we stay in the current page. Same behaviour occurs * when `relativePosition` equals 0. * @see https://developer.mozilla.org/en-US/docs/Web/API/History_API#Moving_to_a_specific_point_in_history */ historyGo(relativePosition?: number): void; /** * Registers a URL change listener. Use to catch updates performed by the Angular * framework that are not detectible through "popstate" or "hashchange" events. * * @param fn The change handler function, which take a URL and a location history state. * @returns A function that, when executed, unregisters a URL change listener. */ onUrlChange(fn: (url: string, state: unknown) => void): VoidFunction; /** * Subscribes to the platform's `popState` events. * * Note: `Location.go()` does not trigger the `popState` event in the browser. Use * `Location.onUrlChange()` to subscribe to URL changes instead. * * @param value Event that is triggered when the state history changes. * @param exception The exception to throw. * * @see [onpopstate](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate) * * @returns Subscribed events. */ subscribe(onNext: (value: PopStateEvent) => void, onThrow?: ((exception: any) => void) | null, onReturn?: (() => void) | null): SubscriptionLike; /** * Normalizes URL parameters by prepending with `?` if needed. * * @param params String of URL parameters. * * @returns The normalized URL parameters string. */ static normalizeQueryParams: (params: string) => string; /** * Joins two parts of a URL with a slash if needed. * * @param start URL string * @param end URL string * * * @returns The joined URL string. */ static joinWithSlash: (start: string, end: string) => string; /** * Removes a trailing slash from a URL string if needed. * Looks for the first occurrence of either `#`, `?`, or the end of the * line as `/` characters and removes the trailing slash if one exists. * * @param url URL string. * * @returns The URL string, modified if needed. */ static stripTrailingSlash: (url: string) => string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * @publicApi */ declare abstract class NgLocalization { abstract getPluralCategory(value: any, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * Returns the plural case based on the locale * * @publicApi */ declare class NgLocaleLocalization extends NgLocalization { protected locale: string; constructor(locale: string); getPluralCategory(value: any, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵprov: i0.ɵɵInjectableDeclaration; } /** * @ngModule CommonModule * * @usageNotes * ```html * ... * * ... * ``` * * For more simple use cases you can use the [class bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly. * It doesn't require importing a directive. * * ```html * ... * * ... * * ... * * ... * ``` * @description * * Adds and removes CSS classes on an HTML element. * * The CSS classes are updated as follows, depending on the type of the expression evaluation: * - `string` - the CSS classes listed in the string (space delimited) are added, * - `Array` - the CSS classes declared as Array elements are added, * - `Object` - keys are CSS classes that get added when the expression given in the value * evaluates to a truthy value, otherwise they are removed. * * * @see [Class bindings](/guide/templates/binding#css-class-and-style-property-bindings) * * @publicApi */ declare class NgClass implements DoCheck { private _ngEl; private _renderer; private initialClasses; private rawClass; private stateMap; constructor(_ngEl: ElementRef, _renderer: Renderer2); set klass(value: string); set ngClass(value: string | string[] | Set | { [klass: string]: any; } | null | undefined); ngDoCheck(): void; private _updateState; private _applyStateDiff; private _toggleClass; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * Instantiates a {@link /api/core/Component Component} type and inserts its Host View into the current View. * `NgComponentOutlet` provides a declarative approach for dynamic component creation. * * `NgComponentOutlet` requires a component type, if a falsy value is set the view will clear and * any existing component will be destroyed. * * @usageNotes * * ### Fine tune control * * You can control the component creation process by using the following optional attributes: * * * `ngComponentOutletInputs`: Optional component inputs object, which will be bind to the * component. * * * `ngComponentOutletInjector`: Optional custom {@link Injector} that will be used as parent for * the Component. Defaults to the injector of the current view container. * * * `ngComponentOutletContent`: Optional list of projectable nodes to insert into the content * section of the component, if it exists. * * * `ngComponentOutletNgModule`: Optional NgModule class reference to allow loading another * module dynamically, then loading a component from that module. * * * `ngComponentOutletNgModuleFactory`: Deprecated config option that allows providing optional * NgModule factory to allow loading another module dynamically, then loading a component from that * module. Use `ngComponentOutletNgModule` instead. * * ### Syntax * * Simple * ```html * * ``` * * With inputs * ```html * * * ``` * * Customized injector/content * ```html * * * ``` * * Customized NgModule reference * ```html * * * ``` * * ### A simple example * * {@example common/ngComponentOutlet/ts/module.ts region='SimpleExample'} * * A more complete example with additional options: * * {@example common/ngComponentOutlet/ts/module.ts region='CompleteExample'} * * @publicApi * @ngModule CommonModule */ declare class NgComponentOutlet implements OnChanges, DoCheck, OnDestroy { private _viewContainerRef; /** Component that should be rendered in the outlet. */ ngComponentOutlet: Type | null; ngComponentOutletInputs?: Record; ngComponentOutletInjector?: Injector; ngComponentOutletContent?: any[][]; ngComponentOutletNgModule?: Type; /** * @deprecated This input is deprecated, use `ngComponentOutletNgModule` instead. */ ngComponentOutletNgModuleFactory?: NgModuleFactory; private _componentRef; private _moduleRef; /** * A helper data structure that allows us to track inputs that were part of the * ngComponentOutletInputs expression. Tracking inputs is necessary for proper removal of ones * that are no longer referenced. */ private _inputsUsed; /** * Gets the instance of the currently-rendered component. * Will be null if no component has been rendered. */ get componentInstance(): T | null; constructor(_viewContainerRef: ViewContainerRef); private _needToReCreateNgModuleInstance; private _needToReCreateComponentInstance; /** @docs-private */ ngOnChanges(changes: SimpleChanges): void; /** @docs-private */ ngDoCheck(): void; /** @docs-private */ ngOnDestroy(): void; private _applyInputStateDiff; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngComponentOutlet]", ["ngComponentOutlet"], { "ngComponentOutlet": { "alias": "ngComponentOutlet"; "required": false; }; "ngComponentOutletInputs": { "alias": "ngComponentOutletInputs"; "required": false; }; "ngComponentOutletInjector": { "alias": "ngComponentOutletInjector"; "required": false; }; "ngComponentOutletContent": { "alias": "ngComponentOutletContent"; "required": false; }; "ngComponentOutletNgModule": { "alias": "ngComponentOutletNgModule"; "required": false; }; "ngComponentOutletNgModuleFactory": { "alias": "ngComponentOutletNgModuleFactory"; "required": false; }; }, {}, never, never, true, never>; } /** * @publicApi */ declare class NgForOfContext = NgIterable> { /** Reference to the current item from the collection. */ $implicit: T; /** * The value of the iterable expression. Useful when the expression is * more complex then a property access, for example when using the async pipe * (`userStreams | async`). */ ngForOf: U; /** Returns an index of the current item in the collection. */ index: number; /** Returns total amount of items in the collection. */ count: number; constructor( /** Reference to the current item from the collection. */ $implicit: T, /** * The value of the iterable expression. Useful when the expression is * more complex then a property access, for example when using the async pipe * (`userStreams | async`). */ ngForOf: U, /** Returns an index of the current item in the collection. */ index: number, /** Returns total amount of items in the collection. */ count: number); get first(): boolean; get last(): boolean; get even(): boolean; get odd(): boolean; } /** * A [structural directive](guide/directives/structural-directives) that renders * a template for each item in a collection. * The directive is placed on an element, which becomes the parent * of the cloned templates. * * The `ngForOf` directive is generally used in the * [shorthand form](guide/directives/structural-directives#asterisk) `*ngFor`. * In this form, the template to be rendered for each iteration is the content * of an anchor element containing the directive. * * The following example shows the shorthand syntax with some options, * contained in an `
  • ` element. * * ```html *
  • ...
    • * ``` * * The shorthand form expands into a long form that uses the `ngForOf` selector * on an `` element. * The content of the `` element is the `
  • ` element that held the * short-form directive. * * Here is the expanded version of the short-form example. * * ```html * *
  • ...
    • *     * ``` * * Angular automatically expands the shorthand syntax as it compiles the template. * The context for each embedded view is logically merged to the current component * context according to its lexical position. * * When using the shorthand syntax, Angular allows only [one structural directive * on an element](guide/directives/structural-directives#one-per-element). * If you want to iterate conditionally, for example, * put the `*ngIf` on a container element that wraps the `*ngFor` element. * For further discussion, see * [Structural Directives](guide/directives/structural-directives#one-per-element). * * @usageNotes * * ### Local variables * * `NgForOf` provides exported values that can be aliased to local variables. * For example: * * ```html *
  • * {{i}}/{{users.length}}. {{user}} default *
    • * ``` * * The following exported values can be aliased to local variables: * * - `$implicit: T`: The value of the individual items in the iterable (`ngForOf`). * - `ngForOf: NgIterable`: The value of the iterable expression. Useful when the expression is * more complex then a property access, for example when using the async pipe (`userStreams | * async`). * - `index: number`: The index of the current item in the iterable. * - `count: number`: The length of the iterable. * - `first: boolean`: True when the item is the first item in the iterable. * - `last: boolean`: True when the item is the last item in the iterable. * - `even: boolean`: True when the item has an even index in the iterable. * - `odd: boolean`: True when the item has an odd index in the iterable. * * ### Change propagation * * When the contents of the iterator changes, `NgForOf` makes the corresponding changes to the DOM: * * * When an item is added, a new instance of the template is added to the DOM. * * When an item is removed, its template instance is removed from the DOM. * * When items are reordered, their respective templates are reordered in the DOM. * * Angular uses object identity to track insertions and deletions within the iterator and reproduce * those changes in the DOM. This has important implications for animations and any stateful * controls that are present, such as `` elements that accept user input. Inserted rows can * be animated in, deleted rows can be animated out, and unchanged rows retain any unsaved state * such as user input. * For more on animations, see [Transitions and Triggers](guide/animations/transition-and-triggers). * * The identities of elements in the iterator can change while the data does not. * This can happen, for example, if the iterator is produced from an RPC to the server, and that * RPC is re-run. Even if the data hasn't changed, the second response produces objects with * different identities, and Angular must tear down the entire DOM and rebuild it (as if all old * elements were deleted and all new elements inserted). * * To avoid this expensive operation, you can customize the default tracking algorithm. * by supplying the `trackBy` option to `NgForOf`. * `trackBy` takes a function that has two arguments: `index` and `item`. * If `trackBy` is given, Angular tracks changes by the return value of the function. * * @see [Structural Directives](guide/directives/structural-directives) * @ngModule CommonModule * @publicApi */ declare class NgForOf = NgIterable> implements DoCheck { private _viewContainer; private _template; private _differs; /** * The value of the iterable expression, which can be used as a * [template input variable](guide/directives/structural-directives#shorthand). */ set ngForOf(ngForOf: (U & NgIterable) | undefined | null); /** * Specifies a custom `TrackByFunction` to compute the identity of items in an iterable. * * If a custom `TrackByFunction` is not provided, `NgForOf` will use the item's [object * identity](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) * as the key. * * `NgForOf` uses the computed key to associate items in an iterable with DOM elements * it produces for these items. * * A custom `TrackByFunction` is useful to provide good user experience in cases when items in an * iterable rendered using `NgForOf` have a natural identifier (for example, custom ID or a * primary key), and this iterable could be updated with new object instances that still * represent the same underlying entity (for example, when data is re-fetched from the server, * and the iterable is recreated and re-rendered, but most of the data is still the same). * * @see {@link TrackByFunction} */ set ngForTrackBy(fn: TrackByFunction); get ngForTrackBy(): TrackByFunction; private _ngForOf; private _ngForOfDirty; private _differ; private _trackByFn; constructor(_viewContainer: ViewContainerRef, _template: TemplateRef>, _differs: IterableDiffers); /** * A reference to the template that is stamped out for each item in the iterable. * @see [template reference variable](guide/templates/variables#template-reference-variables) */ set ngForTemplate(value: TemplateRef>); /** * Applies the changes when needed. * @docs-private */ ngDoCheck(): void; private _applyChanges; /** * Asserts the correct type of the context for the template that `NgForOf` will render. * * The presence of this method is a signal to the Ivy template type-check compiler that the * `NgForOf` structural directive renders its template with a specific context type. */ static ngTemplateContextGuard>(dir: NgForOf, ctx: any): ctx is NgForOfContext; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngFor][ngForOf]", never, { "ngForOf": { "alias": "ngForOf"; "required": false; }; "ngForTrackBy": { "alias": "ngForTrackBy"; "required": false; }; "ngForTemplate": { "alias": "ngForTemplate"; "required": false; }; }, {}, never, never, true, never>; } /** * A structural directive that conditionally includes a template based on the value of * an expression coerced to Boolean. * When the expression evaluates to true, Angular renders the template * provided in a `then` clause, and when false or null, * Angular renders the template provided in an optional `else` clause. The default * template for the `else` clause is blank. * * A [shorthand form](guide/directives/structural-directives#asterisk) of the directive, * `*ngIf="condition"`, is generally used, provided * as an attribute of the anchor element for the inserted template. * Angular expands this into a more explicit version, in which the anchor element * is contained in an `` element. * * Simple form with shorthand syntax: * * ```html *
    Content to render when condition is true.
    * ``` * * Simple form with expanded syntax: * * ```html *
    Content to render when condition is * true.
     * ``` * * Form with an "else" block: * * ```html *
    Content to render when condition is true.
    * Content to render when condition is false. * ``` * * Shorthand form with "then" and "else" blocks: * * ```html *
    * Content to render when condition is true. * Content to render when condition is false. * ``` * * Form with storing the value locally: * * ```html *
    {{value}}
    * Content to render when value is null. * ``` * * @usageNotes * * The `*ngIf` directive is most commonly used to conditionally show an inline template, * as seen in the following example. * The default `else` template is blank. * * {@example common/ngIf/ts/module.ts region='NgIfSimple'} * * ### Showing an alternative template using `else` * * To display a template when `expression` evaluates to false, use an `else` template * binding as shown in the following example. * The `else` binding points to an `` element labeled `#elseBlock`. * The template can be defined anywhere in the component view, but is typically placed right after * `ngIf` for readability. * * {@example common/ngIf/ts/module.ts region='NgIfElse'} * * ### Using an external `then` template * * In the previous example, the then-clause template is specified inline, as the content of the * tag that contains the `ngIf` directive. You can also specify a template that is defined * externally, by referencing a labeled `` element. When you do this, you can * change which template to use at runtime, as shown in the following example. * * {@example common/ngIf/ts/module.ts region='NgIfThenElse'} * * ### Storing a conditional result in a variable * * You might want to show a set of properties from the same object. If you are waiting * for asynchronous data, the object can be undefined. * In this case, you can use `ngIf` and store the result of the condition in a local * variable as shown in the following example. * * {@example common/ngIf/ts/module.ts region='NgIfAs'} * * This code uses only one `AsyncPipe`, so only one subscription is created. * The conditional statement stores the result of `userStream|async` in the local variable `user`. * You can then bind the local `user` repeatedly. * * The conditional displays the data only if `userStream` returns a value, * so you don't need to use the * safe-navigation-operator (`?.`) * to guard against null values when accessing properties. * You can display an alternative template while waiting for the data. * * ### Shorthand syntax * * The shorthand syntax `*ngIf` expands into two separate template specifications * for the "then" and "else" clauses. For example, consider the following shorthand statement, * that is meant to show a loading page while waiting for data to be loaded. * * ```html *
    * ... *
    * * *
    Loading...
    *     * ``` * * You can see that the "else" clause references the `` * with the `#loading` label, and the template for the "then" clause * is provided as the content of the anchor element. * * However, when Angular expands the shorthand syntax, it creates * another `` tag, with `ngIf` and `ngIfElse` directives. * The anchor element containing the template for the "then" clause becomes * the content of this unlabeled `` tag. * * ```html * *
    * ... *
    *     * * *
    Loading...
    *     * ``` * * The presence of the implicit template object has implications for the nesting of * structural directives. For more on this subject, see * [Structural Directives](guide/directives/structural-directives#one-per-element). * * @ngModule CommonModule * @publicApi */ declare class NgIf { private _viewContainer; private _context; private _thenTemplateRef; private _elseTemplateRef; private _thenViewRef; private _elseViewRef; constructor(_viewContainer: ViewContainerRef, templateRef: TemplateRef>); /** * The Boolean expression to evaluate as the condition for showing a template. */ set ngIf(condition: T); /** * A template to show if the condition expression evaluates to true. */ set ngIfThen(templateRef: TemplateRef> | null); /** * A template to show if the condition expression evaluates to false. */ set ngIfElse(templateRef: TemplateRef> | null); private _updateView; /** * Assert the correct type of the expression bound to the `ngIf` input within the template. * * The presence of this static field is a signal to the Ivy template type check compiler that * when the `NgIf` structural directive renders its template, the type of the expression bound * to `ngIf` should be narrowed in some way. For `NgIf`, the binding expression itself is used to * narrow its type, which allows the strictNullChecks feature of TypeScript to work with `NgIf`. */ static ngTemplateGuard_ngIf: 'binding'; /** * Asserts the correct type of the context for the template that `NgIf` will render. * * The presence of this method is a signal to the Ivy template type-check compiler that the * `NgIf` structural directive renders its template with a specific context type. */ static ngTemplateContextGuard(dir: NgIf, ctx: any): ctx is NgIfContext>; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngIf]", never, { "ngIf": { "alias": "ngIf"; "required": false; }; "ngIfThen": { "alias": "ngIfThen"; "required": false; }; "ngIfElse": { "alias": "ngIfElse"; "required": false; }; }, {}, never, never, true, never>; } /** * @publicApi */ declare class NgIfContext { $implicit: T; ngIf: T; } /** * @ngModule CommonModule * * @description * * Inserts an embedded view from a prepared `TemplateRef`. * * You can attach a context object to the `EmbeddedViewRef` by setting `[ngTemplateOutletContext]`. * `[ngTemplateOutletContext]` should be an object, the object's keys will be available for binding * by the local template `let` declarations. * * @usageNotes * ```html * * ``` * * Using the key `$implicit` in the context object will set its value as default. * * ### Example * * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'} * * @publicApi */ declare class NgTemplateOutlet implements OnChanges { private _viewContainerRef; private _viewRef; /** * A context object to attach to the {@link EmbeddedViewRef}. This should be an * object, the object's keys will be available for binding by the local template `let` * declarations. * Using the key `$implicit` in the context object will set its value as default. */ ngTemplateOutletContext: C | null; /** * A string defining the template reference and optionally the context object for the template. */ ngTemplateOutlet: TemplateRef | null; /** Injector to be used within the embedded view. */ ngTemplateOutletInjector: Injector | null; constructor(_viewContainerRef: ViewContainerRef); ngOnChanges(changes: SimpleChanges): void; /** * We need to re-create existing embedded view if either is true: * - the outlet changed. * - the injector changed. */ private _shouldRecreateView; /** * For a given outlet instance, we create a proxy object that delegates * to the user-specified context. This allows changing, or swapping out * the context object completely without having to destroy/re-create the view. */ private _createContextForwardProxy; static ɵfac: i0.ɵɵFactoryDeclaration, never>; static ɵdir: i0.ɵɵDirectiveDeclaration, "[ngTemplateOutlet]", never, { "ngTemplateOutletContext": { "alias": "ngTemplateOutletContext"; "required": false; }; "ngTemplateOutlet": { "alias": "ngTemplateOutlet"; "required": false; }; "ngTemplateOutletInjector": { "alias": "ngTemplateOutletInjector"; "required": false; }; }, {}, never, never, true, never>; } /** * @ngModule CommonModule * * @usageNotes * * Set the width of the containing element to a pixel value returned by an expression. * * ```html * ... * ``` * * Set a collection of style values using an expression that returns key-value pairs. * * ```html * ... * ``` * * For more simple use cases you can use the [style bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly. * It doesn't require importing a directive. * * Set the font of the containing element to the result of an expression. * * ```html * ... * ``` * * @description * * An attribute directive that updates styles for the containing HTML element. * Sets one or more style properties, specified as colon-separated key-value pairs. * The key is a style name, with an optional `.` suffix * (such as 'top.px', 'font-style.em'). * The value is an expression to be evaluated. * The resulting non-null value, expressed in the given unit, * is assigned to the given style property. * If the result of evaluation is null, the corresponding style is removed. * * @see [Style bindings](/guide/templates/binding#css-class-and-style-property-bindings) * * @publicApi */ declare class NgStyle implements DoCheck { private _ngEl; private _differs; private _renderer; private _ngStyle; private _differ; constructor(_ngEl: ElementRef, _differs: KeyValueDiffers, _renderer: Renderer2); set ngStyle(values: { [klass: string]: any; } | null | undefined); ngDoCheck(): void; private _setStyle; private _applyChanges; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } declare class SwitchView { private _viewContainerRef; private _templateRef; private _created; constructor(_viewContainerRef: ViewContainerRef, _templateRef: TemplateRef); create(): void; destroy(): void; enforceState(created: boolean): void; } /** * @ngModule CommonModule * * @description * The `[ngSwitch]` directive on a container specifies an expression to match against. * The expressions to match are provided by `ngSwitchCase` directives on views within the container. * - Every view that matches is rendered. * - If there are no matches, a view with the `ngSwitchDefault` directive is rendered. * - Elements within the `[NgSwitch]` statement but outside of any `NgSwitchCase` * or `ngSwitchDefault` directive are preserved at the location. * * @usageNotes * Define a container element for the directive, and specify the switch expression * to match against as an attribute: * * ```html * * ``` * * Within the container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ```html * * ... * ... * ... * * ``` * * ### Usage Examples * * The following example shows how to use more than one case to display the same view: * * ```html * * * ... * ... * ... * * ... * * ``` * * The following example shows how cases can be nested: * ```html * * ... * ... * ... * * * * * * ... * * ``` * * @publicApi * @see {@link NgSwitchCase} * @see {@link NgSwitchDefault} * @see [Structural Directives](guide/directives/structural-directives) * */ declare class NgSwitch { private _defaultViews; private _defaultUsed; private _caseCount; private _lastCaseCheckIndex; private _lastCasesMatched; private _ngSwitch; set ngSwitch(newValue: any); private _updateDefaultCases; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * Provides a switch case expression to match against an enclosing `ngSwitch` expression. * When the expressions match, the given `NgSwitchCase` template is rendered. * If multiple match expressions match the switch expression value, all of them are displayed. * * @usageNotes * * Within a switch container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ```html * * ... * ... * ... * * ``` * * Each switch-case statement contains an in-line HTML template or template reference * that defines the subtree to be selected if the value of the match expression * matches the value of the switch expression. * * As of Angular v17 the NgSwitch directive uses strict equality comparison (`===`) instead of * loose equality (`==`) to match different cases. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchDefault} * */ declare class NgSwitchCase implements DoCheck { private ngSwitch; private _view; /** * Stores the HTML template to be selected on match. */ ngSwitchCase: any; constructor(viewContainer: ViewContainerRef, templateRef: TemplateRef, ngSwitch: NgSwitch); /** * Performs case matching. For internal use only. * @docs-private */ ngDoCheck(): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * * Creates a view that is rendered when no `NgSwitchCase` expressions * match the `NgSwitch` expression. * This statement should be the final case in an `NgSwitch`. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchCase} * */ declare class NgSwitchDefault { constructor(viewContainer: ViewContainerRef, templateRef: TemplateRef, ngSwitch: NgSwitch); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @usageNotes * ```html * * there is nothing * there is one * there are a few * * ``` * * @description * * Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization. * * Displays DOM sub-trees that match the switch expression value, or failing that, DOM sub-trees * that match the switch expression's pluralization category. * * To use this directive you must provide a container element that sets the `[ngPlural]` attribute * to a switch expression. Inner elements with a `[ngPluralCase]` will display based on their * expression: * - if `[ngPluralCase]` is set to a value starting with `=`, it will only display if the value * matches the switch expression exactly, * - otherwise, the view will be treated as a "category match", and will only display if exact * value matches aren't found and the value maps to its category for the defined locale. * * See http://cldr.unicode.org/index/cldr-spec/plural-rules * * @publicApi */ declare class NgPlural { private _localization; private _activeView?; private _caseViews; constructor(_localization: NgLocalization); set ngPlural(value: number); addCase(value: string, switchView: SwitchView): void; private _updateView; private _clearViews; private _activateView; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * * @description * * Creates a view that will be added/removed from the parent {@link NgPlural} when the * given expression matches the plural expression according to CLDR rules. * * @usageNotes * ```html * * ... * ... * *``` * * See {@link NgPlural} for more details and example. * * @publicApi */ declare class NgPluralCase { value: string; constructor(value: string, template: TemplateRef, viewContainer: ViewContainerRef, ngPlural: NgPlural); static ɵfac: i0.ɵɵFactoryDeclaration; static ɵdir: i0.ɵɵDirectiveDeclaration; } /** * @ngModule CommonModule * @description * * Unwraps a value from an asynchronous primitive. * * The `async` pipe subscribes to an `Observable` or `Promise` and returns the latest value it has * emitted. When a new value is emitted, the `async` pipe marks the component to be checked for * changes. When the component gets destroyed, the `async` pipe unsubscribes automatically to avoid * potential memory leaks. When the reference of the expression changes, the `async` pipe * automatically unsubscribes from the old `Observable` or `Promise` and subscribes to the new one. * * @usageNotes * * ### Examples * * This example binds a `Promise` to the view. Clicking the `Resolve` button resolves the * promise. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipePromise'} * * It's also possible to use `async` with Observables. The example below binds the `time` Observable * to the view. The Observable continuously updates the view with the current time. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipeObservable'} * * @publicApi */ declare class AsyncPipe implements OnDestroy, PipeTransform { private _ref; private _latestValue; private markForCheckOnValueUpdate; private _subscription; private _obj; private _strategy; constructor(ref: ChangeDetectorRef); ngOnDestroy(): void; transform(obj: Observable | Subscribable | Promise): T | null; transform(obj: null | undefined): null; transform(obj: Observable | Subscribable | Promise | null | undefined): T | null; private _subscribe; private _selectStrategy; private _dispose; private _updateLatestValue; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * Transforms text to all lower case. * * @see {@link UpperCasePipe} * @see {@link TitleCasePipe} * @usageNotes * * The following example defines a view that allows the user to enter * text, and then uses the pipe to convert the input text to all lower case. * * {@example common/pipes/ts/lowerupper_pipe.ts region='LowerUpperPipe'} * * @ngModule CommonModule * @publicApi */ declare class LowerCasePipe implements PipeTransform { /** * @param value The string to transform to lower case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * Transforms text to title case. * Capitalizes the first letter of each word and transforms the * rest of the word to lower case. * Words are delimited by any whitespace character, such as a space, tab, or line-feed character. * * @see {@link LowerCasePipe} * @see {@link UpperCasePipe} * * @usageNotes * The following example shows the result of transforming various strings into title case. * * {@example common/pipes/ts/titlecase_pipe.ts region='TitleCasePipe'} * * @ngModule CommonModule * @publicApi */ declare class TitleCasePipe implements PipeTransform { /** * @param value The string to transform to title case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * Transforms text to all upper case. * @see {@link LowerCasePipe} * @see {@link TitleCasePipe} * * @ngModule CommonModule * @publicApi */ declare class UpperCasePipe implements PipeTransform { /** * @param value The string to transform to upper case. */ transform(value: string): string; transform(value: null | undefined): null; transform(value: string | null | undefined): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Converts a value into its JSON-format representation. Useful for debugging. * * @usageNotes * * The following component uses a JSON pipe to convert an object * to JSON format, and displays the string in both formats for comparison. * * {@example common/pipes/ts/json_pipe.ts region='JsonPipe'} * * @publicApi */ declare class JsonPipe implements PipeTransform { /** * @param value A value of any type to convert into a JSON-format string. */ transform(value: any): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Creates a new `Array` or `String` containing a subset (slice) of the elements. * * @usageNotes * * All behavior is based on the expected behavior of the JavaScript API `Array.prototype.slice()` * and `String.prototype.slice()`. * * When operating on an `Array`, the returned `Array` is always a copy even when all * the elements are being returned. * * When operating on a blank value, the pipe returns the blank value. * * ### List Example * * This `ngFor` example: * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_list'} * * produces the following: * * ```html *
  • b
    • *
  • c
    • * ``` * * ### String Examples * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_string'} * * @publicApi */ declare class SlicePipe implements PipeTransform { /** * @param value a list or a string to be sliced. * @param start the starting index of the subset to return: * - **a positive integer**: return the item at `start` index and all items after * in the list or string expression. * - **a negative integer**: return the item at `start` index from the end and all items after * in the list or string expression. * - **if positive and greater than the size of the expression**: return an empty list or * string. * - **if negative and greater than the size of the expression**: return entire list or string. * @param end the ending index of the subset to return: * - **omitted**: return all items until the end. * - **if positive**: return all items before `end` index of the list or string. * - **if negative**: return all items before `end` index from the end of the list or string. */ transform(value: ReadonlyArray, start: number, end?: number): Array; transform(value: null | undefined, start: number, end?: number): null; transform(value: ReadonlyArray | null | undefined, start: number, end?: number): Array | null; transform(value: string, start: number, end?: number): string; transform(value: string | null | undefined, start: number, end?: number): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Formats a value according to digit options and locale rules. * Locale determines group sizing and separator, * decimal point character, and other locale-specific configurations. * * @see {@link formatNumber} * * @usageNotes * * ### digitsInfo * * The value's decimal representation is specified by the `digitsInfo` * parameter, written in the following format:
    * * ``` * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits} * ``` * * - `minIntegerDigits`: * The minimum number of integer digits before the decimal point. * Default is 1. * * - `minFractionDigits`: * The minimum number of digits after the decimal point. * Default is 0. * * - `maxFractionDigits`: * The maximum number of digits after the decimal point. * Default is 3. * * If the formatted value is truncated it will be rounded using the "to-nearest" method: * * ``` * {{3.6 | number: '1.0-0'}} * * * {{-3.6 | number:'1.0-0'}} * * ``` * * ### locale * * `locale` will format a value according to locale rules. * Locale determines group sizing and separator, * decimal point character, and other locale-specific configurations. * * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default. * * See [Setting your app locale](guide/i18n/locale-id). * * ### Example * * The following code shows how the pipe transforms values * according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/number_pipe.ts region='NumberPipe'} * * @publicApi */ declare class DecimalPipe implements PipeTransform { private _locale; constructor(_locale: string); /** * @param value The value to be formatted. * @param digitsInfo Sets digit and decimal representation. * [See more](#digitsinfo). * @param locale Specifies what locale format rules to use. * [See more](#locale). */ transform(value: number | string, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Transforms a number to a percentage * string, formatted according to locale rules that determine group sizing and * separator, decimal-point character, and other locale-specific * configurations. * * @see {@link formatPercent} * * @usageNotes * The following code shows how the pipe transforms numbers * into text strings, according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/percent_pipe.ts region='PercentPipe'} * * @publicApi */ declare class PercentPipe implements PipeTransform { private _locale; constructor(_locale: string); transform(value: number | string, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Transforms a number to a currency string, formatted according to locale rules * that determine group sizing and separator, decimal-point character, * and other locale-specific configurations. * * * @see {@link getCurrencySymbol} * @see {@link formatCurrency} * * @usageNotes * The following code shows how the pipe transforms numbers * into text strings, according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/currency_pipe.ts region='CurrencyPipe'} * * @publicApi */ declare class CurrencyPipe implements PipeTransform { private _locale; private _defaultCurrencyCode; constructor(_locale: string, _defaultCurrencyCode?: string); /** * * @param value The number to be formatted as currency. * @param currencyCode The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) currency code, * such as `USD` for the US dollar and `EUR` for the euro. The default currency code can be * configured using the `DEFAULT_CURRENCY_CODE` injection token. * @param display The format for the currency indicator. One of the following: * - `code`: Show the code (such as `USD`). * - `symbol`(default): Show the symbol (such as `$`). * - `symbol-narrow`: Use the narrow symbol for locales that have two symbols for their * currency. * For example, the Canadian dollar CAD has the symbol `CA$` and the symbol-narrow `$`. If the * locale has no narrow symbol, uses the standard symbol for the locale. * - String: Use the given string value instead of a code or a symbol. * For example, an empty string will suppress the currency & symbol. * - Boolean (marked deprecated in v5): `true` for symbol and false for `code`. * * @param digitsInfo Decimal representation options, specified by a string * in the following format:
    * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. * - `minIntegerDigits`: The minimum number of integer digits before the decimal point. * Default is `1`. * - `minFractionDigits`: The minimum number of digits after the decimal point. * Default is `2`. * - `maxFractionDigits`: The maximum number of digits after the decimal point. * Default is `2`. * If not provided, the number will be formatted with the proper amount of digits, * depending on what the [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) specifies. * For example, the Canadian dollar has 2 digits, whereas the Chilean peso has none. * @param locale A locale code for the locale format rules to use. * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default. * See [Setting your app locale](guide/i18n/locale-id). */ transform(value: number | string, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): string | null; transform(value: null | undefined, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): null; transform(value: number | string | null | undefined, currencyCode?: string, display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean, digitsInfo?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * An interface that describes the date pipe configuration, which can be provided using the * `DATE_PIPE_DEFAULT_OPTIONS` token. * * @see {@link DATE_PIPE_DEFAULT_OPTIONS} * * @publicApi */ interface DatePipeConfig { dateFormat?: string; timezone?: string; } /** * Optionally-provided default timezone to use for all instances of `DatePipe` (such as `'+0430'`). * If the value isn't provided, the `DatePipe` will use the end-user's local system timezone. * * @deprecated use DATE_PIPE_DEFAULT_OPTIONS token to configure DatePipe */ declare const DATE_PIPE_DEFAULT_TIMEZONE: InjectionToken; /** * DI token that allows to provide default configuration for the `DatePipe` instances in an * application. The value is an object which can include the following fields: * - `dateFormat`: configures the default date format. If not provided, the `DatePipe` * will use the 'mediumDate' as a value. * - `timezone`: configures the default timezone. If not provided, the `DatePipe` will * use the end-user's local system timezone. * * @see {@link DatePipeConfig} * * @usageNotes * * Various date pipe default values can be overwritten by providing this token with * the value that has this interface. * * For example: * * Override the default date format by providing a value using the token: * ```ts * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {dateFormat: 'shortDate'}} * ] * ``` * * Override the default timezone by providing a value using the token: * ```ts * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {timezone: '-1200'}} * ] * ``` */ declare const DATE_PIPE_DEFAULT_OPTIONS: InjectionToken; /** * @ngModule CommonModule * @description * * Formats a date value according to locale rules. * * `DatePipe` is executed only when it detects a pure change to the input value. * A pure change is either a change to a primitive input value * (such as `String`, `Number`, `Boolean`, or `Symbol`), * or a changed object reference (such as `Date`, `Array`, `Function`, or `Object`). * * Note that mutating a `Date` object does not cause the pipe to be rendered again. * To ensure that the pipe is executed, you must create a new `Date` object. * * Only the `en-US` locale data comes with Angular. To localize dates * in another language, you must import the corresponding locale data. * See the [I18n guide](guide/i18n/format-data-locale) for more information. * * The time zone of the formatted value can be specified either by passing it in as the second * parameter of the pipe, or by setting the default through the `DATE_PIPE_DEFAULT_OPTIONS` * injection token. The value that is passed in as the second parameter takes precedence over * the one defined using the injection token. * * @see {@link formatDate} * * * @usageNotes * * The result of this pipe is not reevaluated when the input is mutated. To avoid the need to * reformat the date on every change-detection cycle, treat the date as an immutable object * and change the reference when the pipe needs to run again. * * ### Pre-defined format options * * | Option | Equivalent to | Examples (given in `en-US` locale) | * |---------------|-------------------------------------|-------------------------------------------------| * | `'short'` | `'M/d/yy, h:mm a'` | `6/15/15, 9:03 AM` | * | `'medium'` | `'MMM d, y, h:mm:ss a'` | `Jun 15, 2015, 9:03:01 AM` | * | `'long'` | `'MMMM d, y, h:mm:ss a z'` | `June 15, 2015 at 9:03:01 AM GMT+1` | * | `'full'` | `'EEEE, MMMM d, y, h:mm:ss a zzzz'` | `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00` | * | `'shortDate'` | `'M/d/yy'`S | `6/15/15` | * | `'mediumDate'`| `'MMM d, y'` | `Jun 15, 2015` | * | `'longDate'` | `'MMMM d, y'` | `June 15, 2015` | * | `'fullDate'` | `'EEEE, MMMM d, y'` | `Monday, June 15, 2015` | * | `'shortTime'` | `'h:mm a'` | `9:03 AM` | * | `'mediumTime'`| `'h:mm:ss a'` | `9:03:01 AM` | * | `'longTime'` | `'h:mm:ss a z'` | `9:03:01 AM GMT+1` | * | `'fullTime'` | `'h:mm:ss a zzzz'` | `9:03:01 AM GMT+01:00` | * * ### Custom format options * * You can construct a format string using symbols to specify the components * of a date-time value, as described in the following table. * Format details depend on the locale. * Fields marked with (*) are only available in the extra data set for the given locale. * * | Field type | Format | Description | Example Value | * |-------------------------|-------------|---------------------------------------------------------------|------------------------------------------------------------| * | Era | G, GG & GGG | Abbreviated | AD | * | | GGGG | Wide | Anno Domini | * | | GGGGG | Narrow | A | * | Year | y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | * | | yy | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | * | | yyy | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | * | | yyyy | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | * | ISO Week-numbering year | Y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | * | | YY | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | * | | YYY | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | * | | YYYY | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | * | Month | M | Numeric: 1 digit | 9, 12 | * | | MM | Numeric: 2 digits + zero padded | 09, 12 | * | | MMM | Abbreviated | Sep | * | | MMMM | Wide | September | * | | MMMMM | Narrow | S | * | Month standalone | L | Numeric: 1 digit | 9, 12 | * | | LL | Numeric: 2 digits + zero padded | 09, 12 | * | | LLL | Abbreviated | Sep | * | | LLLL | Wide | September | * | | LLLLL | Narrow | S | * | ISO Week of year | w | Numeric: minimum digits | 1... 53 | * | | ww | Numeric: 2 digits + zero padded | 01... 53 | * | Week of month | W | Numeric: 1 digit | 1... 5 | * | Day of month | d | Numeric: minimum digits | 1 | * | | dd | Numeric: 2 digits + zero padded | 01 | * | Week day | E, EE & EEE | Abbreviated | Tue | * | | EEEE | Wide | Tuesday | * | | EEEEE | Narrow | T | * | | EEEEEE | Short | Tu | * | Week day standalone | c, cc | Numeric: 1 digit | 2 | * | | ccc | Abbreviated | Tue | * | | cccc | Wide | Tuesday | * | | ccccc | Narrow | T | * | | cccccc | Short | Tu | * | Period | a, aa & aaa | Abbreviated | am/pm or AM/PM | * | | aaaa | Wide (fallback to `a` when missing) | ante meridiem/post meridiem | * | | aaaaa | Narrow | a/p | * | Period* | B, BB & BBB | Abbreviated | mid. | * | | BBBB | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | * | | BBBBB | Narrow | md | * | Period standalone* | b, bb & bbb | Abbreviated | mid. | * | | bbbb | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | * | | bbbbb | Narrow | md | * | Hour 1-12 | h | Numeric: minimum digits | 1, 12 | * | | hh | Numeric: 2 digits + zero padded | 01, 12 | * | Hour 0-23 | H | Numeric: minimum digits | 0, 23 | * | | HH | Numeric: 2 digits + zero padded | 00, 23 | * | Minute | m | Numeric: minimum digits | 8, 59 | * | | mm | Numeric: 2 digits + zero padded | 08, 59 | * | Second | s | Numeric: minimum digits | 0... 59 | * | | ss | Numeric: 2 digits + zero padded | 00... 59 | * | Fractional seconds | S | Numeric: 1 digit | 0... 9 | * | | SS | Numeric: 2 digits + zero padded | 00... 99 | * | | SSS | Numeric: 3 digits + zero padded (= milliseconds) | 000... 999 | * | Zone | z, zz & zzz | Short specific non location format (fallback to O) | GMT-8 | * | | zzzz | Long specific non location format (fallback to OOOO) | GMT-08:00 | * | | Z, ZZ & ZZZ | ISO8601 basic format | -0800 | * | | ZZZZ | Long localized GMT format | GMT-8:00 | * | | ZZZZZ | ISO8601 extended format + Z indicator for offset 0 (= XXXXX) | -08:00 | * | | O, OO & OOO | Short localized GMT format | GMT-8 | * | | OOOO | Long localized GMT format | GMT-08:00 | * * * ### Format examples * * These examples transform a date into various formats, * assuming that `dateObj` is a JavaScript `Date` object for * year: 2015, month: 6, day: 15, hour: 21, minute: 43, second: 11, * given in the local time for the `en-US` locale. * * ``` * {{ dateObj | date }} // output is 'Jun 15, 2015' * {{ dateObj | date:'medium' }} // output is 'Jun 15, 2015, 9:43:11 PM' * {{ dateObj | date:'shortTime' }} // output is '9:43 PM' * {{ dateObj | date:'mm:ss' }} // output is '43:11' * {{ dateObj | date:"MMM dd, yyyy 'at' hh:mm a" }} // output is 'Jun 15, 2015 at 09:43 PM' * ``` * * ### Usage example * * The following component uses a date pipe to display the current date in different formats. * * ```angular-ts * @Component({ * selector: 'date-pipe', * template: `
    *

    Today is {{today | date}}

    *

    Or if you prefer, {{today | date:'fullDate'}}

    *

    The time is {{today | date:'h:mm a z'}}

    *
    ` * }) * // Get the current date and time as a date-time value. * export class DatePipeComponent { * today: number = Date.now(); * } * ``` * * @publicApi */ declare class DatePipe implements PipeTransform { private locale; private defaultTimezone?; private defaultOptions?; constructor(locale: string, defaultTimezone?: string | null | undefined, defaultOptions?: (DatePipeConfig | null) | undefined); /** * @param value The date expression: a `Date` object, a number * (milliseconds since UTC epoch), or an ISO string (https://www.w3.org/TR/NOTE-datetime). * @param format The date/time components to include, using predefined options or a * custom format string. When not provided, the `DatePipe` looks for the value using the * `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads the `dateFormat` property). * If the token is not configured, the `mediumDate` is used as a value. * @param timezone A timezone offset (such as `'+0430'`). When not provided, the `DatePipe` * looks for the value using the `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads * the `timezone` property). If the token is not configured, the end-user's local system * timezone is used as a value. * @param locale A locale code for the locale format rules to use. * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default. * See [Setting your app locale](guide/i18n/locale-id). * * @see {@link DATE_PIPE_DEFAULT_OPTIONS} * * @returns A date string in the desired format. */ transform(value: Date | string | number, format?: string, timezone?: string, locale?: string): string | null; transform(value: null | undefined, format?: string, timezone?: string, locale?: string): null; transform(value: Date | string | number | null | undefined, format?: string, timezone?: string, locale?: string): string | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Maps a value to a string that pluralizes the value according to locale rules. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nPluralPipeComponent'} * * @publicApi */ declare class I18nPluralPipe implements PipeTransform { private _localization; constructor(_localization: NgLocalization); /** * @param value the number to be formatted * @param pluralMap an object that mimics the ICU format, see * https://unicode-org.github.io/icu/userguide/format_parse/messages/. * @param locale a `string` defining the locale to use (uses the current {@link LOCALE_ID} by * default). */ transform(value: number | null | undefined, pluralMap: { [count: string]: string; }, locale?: string): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * @ngModule CommonModule * @description * * Generic selector that displays the string that matches the current value. * * If none of the keys of the `mapping` match the `value`, then the content * of the `other` key is returned when present, otherwise an empty string is returned. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nSelectPipeComponent'} * * @publicApi */ declare class I18nSelectPipe implements PipeTransform { /** * @param value a string to be internationalized. * @param mapping an object that indicates the text that should be displayed * for different values of the provided `value`. */ transform(value: string | null | undefined, mapping: { [key: string]: string; }): string; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * A key value pair. * Usually used to represent the key value pairs from a Map or Object. * * @publicApi */ interface KeyValue { key: K; value: V; } /** * @ngModule CommonModule * @description * * Transforms Object or Map into an array of key value pairs. * * The output array will be ordered by keys. * By default the comparator will be by Unicode point value. * You can optionally pass a compareFn if your keys are complex types. * Passing `null` as the compareFn will use natural ordering of the input. * * @usageNotes * ### Examples * * This examples show how an Object or a Map can be iterated by ngFor with the use of this * keyvalue pipe. * * {@example common/pipes/ts/keyvalue_pipe.ts region='KeyValuePipe'} * * @publicApi */ declare class KeyValuePipe implements PipeTransform { private readonly differs; constructor(differs: KeyValueDiffers); private differ; private keyValues; private compareFn; transform(input: ReadonlyMap, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array>; transform(input: Record, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array>; transform(input: Record | ReadonlyMap, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array>; transform(input: null | undefined, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): null; transform(input: ReadonlyMap | null | undefined, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array> | null; transform(input: Record | null | undefined, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array> | null; transform(input: Record | ReadonlyMap | null | undefined, compareFn?: ((a: KeyValue, b: KeyValue) => number) | null): Array> | null; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵpipe: i0.ɵɵPipeDeclaration; } /** * Exports all the basic Angular directives and pipes, * such as `NgIf`, `NgForOf`, `DecimalPipe`, and so on. * Re-exported by `BrowserModule`, which is included automatically in the root * `AppModule` when you create a new app with the CLI `new` command. * * @publicApi */ declare class CommonModule { static ɵfac: i0.ɵɵFactoryDeclaration; static ɵmod: i0.ɵɵNgModuleDeclaration; static ɵinj: i0.ɵɵInjectorDeclaration; } export { APP_BASE_HREF, AsyncPipe, CommonModule, CurrencyPipe, DATE_PIPE_DEFAULT_OPTIONS, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe, DecimalPipe, I18nPluralPipe, I18nSelectPipe, JsonPipe, KeyValuePipe, Location, LocationStrategy, LowerCasePipe, NgClass, NgComponentOutlet, NgForOf, NgForOfContext, NgIf, NgIfContext, NgLocaleLocalization, NgLocalization, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, PathLocationStrategy, PercentPipe, SlicePipe, TitleCasePipe, UpperCasePipe }; export type { DatePipeConfig, KeyValue, PopStateEvent }; H'ĺ,x/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ export { AsyncPipe, CommonModule, CurrencyPipe, DATE_PIPE_DEFAULT_OPTIONS, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe, DecimalPipe, FormStyle, FormatWidth, HashLocationStrategy, I18nPluralPipe, I18nSelectPipe, JsonPipe, KeyValuePipe, LowerCasePipe, NgClass, NgComponentOutlet, NgForOf as NgFor, NgForOf, NgForOfContext, NgIf, NgIfContext, NgLocaleLocalization, NgLocalization, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, NumberFormatStyle, NumberSymbol, PercentPipe, Plural, SlicePipe, TitleCasePipe, TranslationWidth, UpperCasePipe, 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 } from './common_module-Dx7dWex5.mjs'; import * as i0 from '@angular/core'; import { ɵregisterLocaleData as _registerLocaleData, Version, ɵɵdefineInjectable as __defineInjectable, inject, InjectionToken, ɵRuntimeError as _RuntimeError, ɵformatRuntimeError as _formatRuntimeError, PLATFORM_ID, Injectable, ɵIMAGE_CONFIG as _IMAGE_CONFIG, Renderer2, ElementRef, Injector, DestroyRef, ɵperformanceMarkFeature as _performanceMarkFeature, NgZone, ApplicationRef, booleanAttribute, numberAttribute, ChangeDetectorRef, ɵIMAGE_CONFIG_DEFAULTS as _IMAGE_CONFIG_DEFAULTS, ɵunwrapSafeValue as _unwrapSafeValue, Input, Directive } from '@angular/core'; export { ɵIMAGE_CONFIG as IMAGE_CONFIG } from '@angular/core'; import { isPlatformBrowser } from './xhr-BfNfxNDv.mjs'; export { XhrFactory, isPlatformServer, PLATFORM_BROWSER_ID as ɵPLATFORM_BROWSER_ID, PLATFORM_SERVER_ID as ɵPLATFORM_SERVER_ID, parseCookieValue as ɵparseCookieValue } from './xhr-BfNfxNDv.mjs'; import { DOCUMENT } from './dom_tokens-rA0ACyx7.mjs'; export { APP_BASE_HREF, BrowserPlatformLocation, LOCATION_INITIALIZED, Location, LocationStrategy, PathLocationStrategy, PlatformLocation, DomAdapter as ɵDomAdapter, getDOM as ɵgetDOM, normalizeQueryParams as ɵnormalizeQueryParams, setRootDomAdapter as ɵsetRootDomAdapter } from './location-Dq4mJT-A.mjs'; export { PlatformNavigation as ɵPlatformNavigation } from './platform_navigation-B45Jeakb.mjs'; import 'rxjs'; /** * Register global data to be used internally by Angular. See the * ["I18n guide"](guide/i18n/format-data-locale) to know how to import additional locale * data. * * The signature registerLocaleData(data: any, extraData?: any) is deprecated since v5.1 * * @publicApi */ function registerLocaleData(data, localeId, extraData) { return _registerLocaleData(data, localeId, extraData); } /** * @module * @description * Entry point for all public APIs of the common package. */ /** * @publicApi */ const VERSION = new Version('19.2.14'); /** * Defines a scroll position manager. Implemented by `BrowserViewportScroller`. * * @publicApi */ class ViewportScroller { // De-sugared tree-shakable injection // See #23917 /** @nocollapse */ static ɵprov = /** @pureOrBreakMyCode */ /* @__PURE__ */ __defineInjectable({ token: ViewportScroller, providedIn: 'root', factory: () => typeof ngServerMode !== 'undefined' && ngServerMode ? new NullViewportScroller() : new BrowserViewportScroller(inject(DOCUMENT), window), }); } /** * Manages the scroll position for a browser window. */ class BrowserViewportScroller { document; window; offset = () => [0, 0]; constructor(document, window) { this.document = document; this.window = window; } /** * Configures the top offset used when scrolling to an anchor. * @param offset A position in screen coordinates (a tuple with x and y values) * or a function that returns the top offset position. * */ setOffset(offset) { if (Array.isArray(offset)) { this.offset = () => offset; } else { this.offset = offset; } } /** * Retrieves the current scroll position. * @returns The position in screen coordinates. */ getScrollPosition() { return [this.window.scrollX, this.window.scrollY]; } /** * Sets the scroll position. * @param position The new position in screen coordinates. */ scrollToPosition(position) { this.window.scrollTo(position[0], position[1]); } /** * Scrolls to an element and attempts to focus the element. * * Note that the function name here is misleading in that the target string may be an ID for a * non-anchor element. * * @param target The ID of an element or name of the anchor. * * @see https://html.spec.whatwg.org/#the-indicated-part-of-the-document * @see https://html.spec.whatwg.org/#scroll-to-fragid */ scrollToAnchor(target) { const elSelected = findAnchorFromDocument(this.document, target); if (elSelected) { this.scrollToElement(elSelected); // After scrolling to the element, the spec dictates that we follow the focus steps for the // target. Rather than following the robust steps, simply attempt focus. // // @see https://html.spec.whatwg.org/#get-the-focusable-area // @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/focus // @see https://html.spec.whatwg.org/#focusable-area elSelected.focus(); } } /** * Disables automatic scroll restoration provided by the browser. */ setHistoryScrollRestoration(scrollRestoration) { this.window.history.scrollRestoration = scrollRestoration; } /** * Scrolls to an element using the native offset and the specified offset set on this scroller. * * The offset can be used when we know that there is a floating header and scrolling naively to an * element (ex: `scrollIntoView`) leaves the element hidden behind the floating header. */ scrollToElement(el) { const rect = el.getBoundingClientRect(); const left = rect.left + this.window.pageXOffset; const top = rect.top + this.window.pageYOffset; const offset = this.offset(); this.window.scrollTo(left - offset[0], top - offset[1]); } } function findAnchorFromDocument(document, target) { const documentResult = document.getElementById(target) || document.getElementsByName(target)[0]; if (documentResult) { return documentResult; } // `getElementById` and `getElementsByName` won't pierce through the shadow DOM so we // have to traverse the DOM manually and do the lookup through the shadow roots. if (typeof document.createTreeWalker === 'function' && document.body && typeof document.body.attachShadow === 'function') { const treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT); let currentNode = treeWalker.currentNode; while (currentNode) { const shadowRoot = currentNode.shadowRoot; if (shadowRoot) { // Note that `ShadowRoot` doesn't support `getElementsByName` // so we have to fall back to `querySelector`. const result = shadowRoot.getElementById(target) || shadowRoot.querySelector(`[name="${target}"]`); if (result) { return result; } } currentNode = treeWalker.nextNode(); } } return null; } /** * Provides an empty implementation of the viewport scroller. */ class NullViewportScroller { /** * Empty implementation */ setOffset(offset) { } /** * Empty implementation */ getScrollPosition() { return [0, 0]; } /** * Empty implementation */ scrollToPosition(position) { } /** * Empty implementation */ scrollToAnchor(anchor) { } /** * Empty implementation */ setHistoryScrollRestoration(scrollRestoration) { } } /** * Value (out of 100) of the requested quality for placeholder images. */ const PLACEHOLDER_QUALITY = '20'; // Converts a string that represents a URL into a URL class instance. function getUrl(src, win) { // Don't use a base URL is the URL is absolute. return isAbsoluteUrl(src) ? new URL(src) : new URL(src, win.location.href); } // Checks whether a URL is absolute (i.e. starts with `http://` or `https://`). function isAbsoluteUrl(src) { return /^https?:\/\//.test(src); } // Given a URL, extract the hostname part. // If a URL is a relative one - the URL is returned as is. function extractHostname(url) { return isAbsoluteUrl(url) ? new URL(url).hostname : url; } function isValidPath(path) { const isString = typeof path === 'string'; if (!isString || path.trim() === '') { return false; } // Calling new URL() will throw if the path string is malformed try { const url = new URL(path); return true; } catch { return false; } } function normalizePath(path) { return path.endsWith('/') ? path.slice(0, -1) : path; } function normalizeSrc(src) { return src.startsWith('/') ? src.slice(1) : src; } /** * Noop image loader that does no transformation to the original src and just returns it as is. * This loader is used as a default one if more specific logic is not provided in an app config. * * @see {@link ImageLoader} * @see {@link NgOptimizedImage} */ const noopImageLoader = (config) => config.src; /** * Injection token that configures the image loader function. * * @see {@link ImageLoader} * @see {@link NgOptimizedImage} * @publicApi */ const IMAGE_LOADER = new InjectionToken(ngDevMode ? 'ImageLoader' : '', { providedIn: 'root', factory: () => noopImageLoader, }); /** * Internal helper function that makes it easier to introduce custom image loaders for the * `NgOptimizedImage` directive. It is enough to specify a URL builder function to obtain full DI * configuration for a given loader: a DI token corresponding to the actual loader function, plus DI * tokens managing preconnect check functionality. * @param buildUrlFn a function returning a full URL based on loader's configuration * @param exampleUrls example of full URLs for a given loader (used in error messages) * @returns a set of DI providers corresponding to the configured image loader */ function createImageLoader(buildUrlFn, exampleUrls) { return function provideImageLoader(path) { if (!isValidPath(path)) { throwInvalidPathError(path, exampleUrls || []); } // The trailing / is stripped (if provided) to make URL construction (concatenation) easier in // the individual loader functions. path = normalizePath(path); const loaderFn = (config) => { if (isAbsoluteUrl(config.src)) { // Image loader functions expect an image file name (e.g. `my-image.png`) // or a relative path + a file name (e.g. `/a/b/c/my-image.png`) as an input, // so the final absolute URL can be constructed. // When an absolute URL is provided instead - the loader can not // build a final URL, thus the error is thrown to indicate that. throwUnexpectedAbsoluteUrlError(path, config.src); } return buildUrlFn(path, { ...config, src: normalizeSrc(config.src) }); }; const providers = [{ provide: IMAGE_LOADER, useValue: loaderFn }]; return providers; }; } function throwInvalidPathError(path, exampleUrls) { throw new _RuntimeError(2959 /* RuntimeErrorCode.INVALID_LOADER_ARGUMENTS */, ngDevMode && `Image loader has detected an invalid path (\`${path}\`). ` + `To fix this, supply a path using one of the following formats: ${exampleUrls.join(' or ')}`); } function throwUnexpectedAbsoluteUrlError(path, url) { throw new _RuntimeError(2959 /* RuntimeErrorCode.INVALID_LOADER_ARGUMENTS */, ngDevMode && `Image loader has detected a \`\` tag with an invalid \`ngSrc\` attribute: ${url}. ` + `This image loader expects \`ngSrc\` to be a relative URL - ` + `however the provided value is an absolute URL. ` + `To fix this, provide \`ngSrc\` as a path relative to the base URL ` + `configured for this loader (\`${path}\`).`); } /** * Function that generates an ImageLoader for [Cloudflare Image * Resizing](https://developers.cloudflare.com/images/image-resizing/) and turns it into an Angular * provider. Note: Cloudflare has multiple image products - this provider is specifically for * Cloudflare Image Resizing; it will not work with Cloudflare Images or Cloudflare Polish. * * @param path Your domain name, e.g. https://mysite.com * @returns Provider that provides an ImageLoader function * * @publicApi */ const provideCloudflareLoader = createImageLoader(createCloudflareUrl, ngDevMode ? ['https:///cdn-cgi/image//'] : undefined); function createCloudflareUrl(path, config) { let params = `format=auto`; if (config.width) { params += `,width=${config.width}`; } // When requesting a placeholder image we ask for a low quality image to reduce the load time. if (config.isPlaceholder) { params += `,quality=${PLACEHOLDER_QUALITY}`; } // Cloudflare image URLs format: // https://developers.cloudflare.com/images/image-resizing/url-format/ return `${path}/cdn-cgi/image/${params}/${config.src}`; } /** * Name and URL tester for Cloudinary. */ const cloudinaryLoaderInfo = { name: 'Cloudinary', testUrl: isCloudinaryUrl, }; const CLOUDINARY_LOADER_REGEX = /https?\:\/\/[^\/]+\.cloudinary\.com\/.+/; /** * Tests whether a URL is from Cloudinary CDN. */ function isCloudinaryUrl(url) { return CLOUDINARY_LOADER_REGEX.test(url); } /** * Function that generates an ImageLoader for Cloudinary and turns it into an Angular provider. * * @param path Base URL of your Cloudinary images * This URL should match one of the following formats: * https://res.cloudinary.com/mysite * https://mysite.cloudinary.com * https://subdomain.mysite.com * @returns Set of providers to configure the Cloudinary loader. * * @publicApi */ const provideCloudinaryLoader = createImageLoader(createCloudinaryUrl, ngDevMode ? [ 'https://res.cloudinary.com/mysite', 'https://mysite.cloudinary.com', 'https://subdomain.mysite.com', ] : undefined); function createCloudinaryUrl(path, config) { // Cloudinary image URLformat: // https://cloudinary.com/documentation/image_transformations#transformation_url_structure // Example of a Cloudinary image URL: // https://res.cloudinary.com/mysite/image/upload/c_scale,f_auto,q_auto,w_600/marketing/tile-topics-m.png // For a placeholder image, we use the lowest image setting available to reduce the load time // else we use the auto size const quality = config.isPlaceholder ? 'q_auto:low' : 'q_auto'; let params = `f_auto,${quality}`; if (config.width) { params += `,w_${config.width}`; } if (config.loaderParams?.['rounded']) { params += `,r_max`; } return `${path}/image/upload/${params}/${config.src}`; } /** * Name and URL tester for ImageKit. */ const imageKitLoaderInfo = { name: 'ImageKit', testUrl: isImageKitUrl, }; const IMAGE_KIT_LOADER_REGEX = /https?\:\/\/[^\/]+\.imagekit\.io\/.+/; /** * Tests whether a URL is from ImageKit CDN. */ function isImageKitUrl(url) { return IMAGE_KIT_LOADER_REGEX.test(url); } /** * Function that generates an ImageLoader for ImageKit and turns it into an Angular provider. * * @param path Base URL of your ImageKit images * This URL should match one of the following formats: * https://ik.imagekit.io/myaccount * https://subdomain.mysite.com * @returns Set of providers to configure the ImageKit loader. * * @publicApi */ const provideImageKitLoader = createImageLoader(createImagekitUrl, ngDevMode ? ['https://ik.imagekit.io/mysite', 'https://subdomain.mysite.com'] : undefined); function createImagekitUrl(path, config) { // Example of an ImageKit image URL: // https://ik.imagekit.io/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg const { src, width } = config; const params = []; if (width) { params.push(`w-${width}`); } // When requesting a placeholder image we ask for a low quality image to reduce the load time. if (config.isPlaceholder) { params.push(`q-${PLACEHOLDER_QUALITY}`); } const urlSegments = params.length ? [path, `tr:${params.join(',')}`, src] : [path, src]; const url = new URL(urlSegments.join('/')); return url.href; } /** * Name and URL tester for Imgix. */ const imgixLoaderInfo = { name: 'Imgix', testUrl: isImgixUrl, }; const IMGIX_LOADER_REGEX = /https?\:\/\/[^\/]+\.imgix\.net\/.+/; /** * Tests whether a URL is from Imgix CDN. */ function isImgixUrl(url) { return IMGIX_LOADER_REGEX.test(url); } /** * Function that generates an ImageLoader for Imgix and turns it into an Angular provider. * * @param path path to the desired Imgix origin, * e.g. https://somepath.imgix.net or https://images.mysite.com * @returns Set of providers to configure the Imgix loader. * * @publicApi */ const provideImgixLoader = createImageLoader(createImgixUrl, ngDevMode ? ['https://somepath.imgix.net/'] : undefined); function createImgixUrl(path, config) { const url = new URL(`${path}/${config.src}`); // This setting ensures the smallest allowable format is set. url.searchParams.set('auto', 'format'); if (config.width) { url.searchParams.set('w', config.width.toString()); } // When requesting a placeholder image we ask a low quality image to reduce the load time. if (config.isPlaceholder) { url.searchParams.set('q', PLACEHOLDER_QUALITY); } return url.href; } /** * Name and URL tester for Netlify. */ const netlifyLoaderInfo = { name: 'Netlify', testUrl: isNetlifyUrl, }; const NETLIFY_LOADER_REGEX = /https?\:\/\/[^\/]+\.netlify\.app\/.+/; /** * Tests whether a URL is from a Netlify site. This won't catch sites with a custom domain, * but it's a good start for sites in development. This is only used to warn users who haven't * configured an image loader. */ function isNetlifyUrl(url) { return NETLIFY_LOADER_REGEX.test(url); } /** * Function that generates an ImageLoader for Netlify and turns it into an Angular provider. * * @param path optional URL of the desired Netlify site. Defaults to the current site. * @returns Set of providers to configure the Netlify loader. * * @publicApi */ function provideNetlifyLoader(path) { if (path && !isValidPath(path)) { throw new _RuntimeError(2959 /* RuntimeErrorCode.INVALID_LOADER_ARGUMENTS */, ngDevMode && `Image loader has detected an invalid path (\`${path}\`). ` + `To fix this, supply either the full URL to the Netlify site, or leave it empty to use the current site.`); } if (path) { const url = new URL(path); path = url.origin; } const loaderFn = (config) => { return createNetlifyUrl(config, path); }; const providers = [{ provide: IMAGE_LOADER, useValue: loaderFn }]; return providers; } const validParams = new Map([ ['height', 'h'], ['fit', 'fit'], ['quality', 'q'], ['q', 'q'], ['position', 'position'], ]); function createNetlifyUrl(config, path) { // Note: `path` can be undefined, in which case we use a fake one to construct a `URL` instance. const url = new URL(path ?? 'https://a/'); url.pathname = '/.netlify/images'; if (!isAbsoluteUrl(config.src) && !config.src.startsWith('/')) { config.src = '/' + config.src; } url.searchParams.set('url', config.src); if (config.width) { url.searchParams.set('w', config.width.toString()); } // When requesting a placeholder image we ask for a low quality image to reduce the load time. // If the quality is specified in the loader config - always use provided value. const configQuality = config.loaderParams?.['quality'] ?? config.loaderParams?.['q']; if (config.isPlaceholder && !configQuality) { url.searchParams.set('q', PLACEHOLDER_QUALITY); } for (const [param, value] of Object.entries(config.loaderParams ?? {})) { if (validParams.has(param)) { url.searchParams.set(validParams.get(param), value.toString()); } else { if (ngDevMode) { console.warn(_formatRuntimeError(2959 /* RuntimeErrorCode.INVALID_LOADER_ARGUMENTS */, `The Netlify image loader has detected an \`\` tag with the unsupported attribute "\`${param}\`".`)); } } } // The "a" hostname is used for relative URLs, so we can remove it from the final URL. return url.hostname === 'a' ? url.href.replace(url.origin, '') : url.href; } // Assembles directive details string, useful for error messages. function imgDirectiveDetails(ngSrc, includeNgSrc = true) { const ngSrcInfo = includeNgSrc ? `(activated on an element with the \`ngSrc="${ngSrc}"\`) ` : ''; return `The NgOptimizedImage directive ${ngSrcInfo}has detected that`; } /** * Asserts that the application is in development mode. Throws an error if the application is in * production mode. This assert can be used to make sure that there is no dev-mode code invoked in * the prod mode accidentally. */ function assertDevMode(checkName) { if (!ngDevMode) { throw new _RuntimeError(2958 /* RuntimeErrorCode.UNEXPECTED_DEV_MODE_CHECK_IN_PROD_MODE */, `Unexpected invocation of the ${checkName} in the prod mode. ` + `Please make sure that the prod mode is enabled for production builds.`); } } /** * Observer that detects whether an image with `NgOptimizedImage` * is treated as a Largest Contentful Paint (LCP) element. If so, * asserts that the image has the `priority` attribute. * * Note: this is a dev-mode only class and it does not appear in prod bundles, * thus there is no `ngDevMode` use in the code. * * Based on https://web.dev/lcp/#measure-lcp-in-javascript. */ class LCPImageObserver { // Map of full image URLs -> original `ngSrc` values. images = new Map(); window = null; observer = null; constructor() { const isBrowser = isPlatformBrowser(inject(PLATFORM_ID)); assertDevMode('LCP checker'); const win = inject(DOCUMENT).defaultView; if (isBrowser && typeof PerformanceObserver !== 'undefined') { this.window = win; this.observer = this.initPerformanceObserver(); } } /** * Inits PerformanceObserver and subscribes to LCP events. * Based on https://web.dev/lcp/#measure-lcp-in-javascript */ initPerformanceObserver() { const observer = new PerformanceObserver((entryList) => { const entries = entryList.getEntries(); if (entries.length === 0) return; // We use the latest entry produced by the `PerformanceObserver` as the best // signal on which element is actually an LCP one. As an example, the first image to load on // a page, by virtue of being the only thing on the page so far, is often a LCP candidate // and gets reported by PerformanceObserver, but isn't necessarily the LCP element. const lcpElement = entries[entries.length - 1]; // Cast to `any` due to missing `element` on the `LargestContentfulPaint` type of entry. // See https://developer.mozilla.org/en-US/docs/Web/API/LargestContentfulPaint const imgSrc = lcpElement.element?.src ?? ''; // Exclude `data:` and `blob:` URLs, since they are not supported by the directive. if (imgSrc.startsWith('data:') || imgSrc.startsWith('blob:')) return; const img = this.images.get(imgSrc); if (!img) return; if (!img.priority && !img.alreadyWarnedPriority) { img.alreadyWarnedPriority = true; logMissingPriorityError(imgSrc); } if (img.modified && !img.alreadyWarnedModified) { img.alreadyWarnedModified = true; logModifiedWarning(imgSrc); } }); observer.observe({ type: 'largest-contentful-paint', buffered: true }); return observer; } registerImage(rewrittenSrc, originalNgSrc, isPriority) { if (!this.observer) return; const newObservedImageState = { priority: isPriority, modified: false, alreadyWarnedModified: false, alreadyWarnedPriority: false, }; this.images.set(getUrl(rewrittenSrc, this.window).href, newObservedImageState); } unregisterImage(rewrittenSrc) { if (!this.observer) return; this.images.delete(getUrl(rewrittenSrc, this.window).href); } updateImage(originalSrc, newSrc) { if (!this.observer) return; const originalUrl = getUrl(originalSrc, this.window).href; const img = this.images.get(originalUrl); if (img) { img.modified = true; this.images.set(getUrl(newSrc, this.window).href, img); this.images.delete(originalUrl); } } ngOnDestroy() { if (!this.observer) return; this.observer.disconnect(); this.images.clear(); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LCPImageObserver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LCPImageObserver, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LCPImageObserver, decorators: [{ type: Injectable, args: [{ providedIn: 'root' }] }], ctorParameters: () => [] }); function logMissingPriorityError(ngSrc) { const directiveDetails = imgDirectiveDetails(ngSrc); console.error(_formatRuntimeError(2955 /* RuntimeErrorCode.LCP_IMG_MISSING_PRIORITY */, `${directiveDetails} this image is the Largest Contentful Paint (LCP) ` + `element but was not marked "priority". This image should be marked ` + `"priority" in order to prioritize its loading. ` + `To fix this, add the "priority" attribute.`)); } function logModifiedWarning(ngSrc) { const directiveDetails = imgDirectiveDetails(ngSrc); console.warn(_formatRuntimeError(2964 /* RuntimeErrorCode.LCP_IMG_NGSRC_MODIFIED */, `${directiveDetails} this image is the Largest Contentful Paint (LCP) ` + `element and has had its "ngSrc" attribute modified. This can cause ` + `slower loading performance. It is recommended not to modify the "ngSrc" ` + `property on any image which could be the LCP element.`)); } // Set of origins that are always excluded from the preconnect checks. const INTERNAL_PRECONNECT_CHECK_BLOCKLIST = new Set(['localhost', '127.0.0.1', '0.0.0.0']); /** * Injection token to configure which origins should be excluded * from the preconnect checks. It can either be a single string or an array of strings * to represent a group of origins, for example: * * ```ts * {provide: PRECONNECT_CHECK_BLOCKLIST, useValue: 'https://your-domain.com'} * ``` * * or: * * ```ts * {provide: PRECONNECT_CHECK_BLOCKLIST, * useValue: ['https://your-domain-1.com', 'https://your-domain-2.com']} * ``` * * @publicApi */ const PRECONNECT_CHECK_BLOCKLIST = new InjectionToken(ngDevMode ? 'PRECONNECT_CHECK_BLOCKLIST' : ''); /** * Contains the logic to detect whether an image, marked with the "priority" attribute * has a corresponding `` tag in the `document.head`. * * Note: this is a dev-mode only class, which should not appear in prod bundles, * thus there is no `ngDevMode` use in the code. */ class PreconnectLinkChecker { document = inject(DOCUMENT); /** * Set of tags found on this page. * The `null` value indicates that there was no DOM query operation performed. */ preconnectLinks = null; /* * Keep track of all already seen origin URLs to avoid repeating the same check. */ alreadySeen = new Set(); window = this.document.defaultView; blocklist = new Set(INTERNAL_PRECONNECT_CHECK_BLOCKLIST); constructor() { assertDevMode('preconnect link checker'); const blocklist = inject(PRECONNECT_CHECK_BLOCKLIST, { optional: true }); if (blocklist) { this.populateBlocklist(blocklist); } } populateBlocklist(origins) { if (Array.isArray(origins)) { deepForEach(origins, (origin) => { this.blocklist.add(extractHostname(origin)); }); } else { this.blocklist.add(extractHostname(origins)); } } /** * Checks that a preconnect resource hint exists in the head for the * given src. * * @param rewrittenSrc src formatted with loader * @param originalNgSrc ngSrc value */ assertPreconnect(rewrittenSrc, originalNgSrc) { if (typeof ngServerMode !== 'undefined' && ngServerMode) return; const imgUrl = getUrl(rewrittenSrc, this.window); if (this.blocklist.has(imgUrl.hostname) || this.alreadySeen.has(imgUrl.origin)) return; // Register this origin as seen, so we don't check it again later. this.alreadySeen.add(imgUrl.origin); // Note: we query for preconnect links only *once* and cache the results // for the entire lifespan of an application, since it's unlikely that the // list would change frequently. This allows to make sure there are no // performance implications of making extra DOM lookups for each image. this.preconnectLinks ??= this.queryPreconnectLinks(); if (!this.preconnectLinks.has(imgUrl.origin)) { console.warn(_formatRuntimeError(2956 /* RuntimeErrorCode.PRIORITY_IMG_MISSING_PRECONNECT_TAG */, `${imgDirectiveDetails(originalNgSrc)} there is no preconnect tag present for this ` + `image. Preconnecting to the origin(s) that serve priority images ensures that these ` + `images are delivered as soon as possible. To fix this, please add the following ` + `element into the of the document:\n` + ` `)); } } queryPreconnectLinks() { const preconnectUrls = new Set(); const links = this.document.querySelectorAll('link[rel=preconnect]'); for (const link of links) { const url = getUrl(link.href, this.window); preconnectUrls.add(url.origin); } return preconnectUrls; } ngOnDestroy() { this.preconnectLinks?.clear(); this.alreadySeen.clear(); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreconnectLinkChecker, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreconnectLinkChecker, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreconnectLinkChecker, decorators: [{ type: Injectable, args: [{ providedIn: 'root' }] }], ctorParameters: () => [] }); /** * Invokes a callback for each element in the array. Also invokes a callback * recursively for each nested array. */ function deepForEach(input, fn) { for (let value of input) { Array.isArray(value) ? deepForEach(value, fn) : fn(value); } } /** * In SSR scenarios, a preload `` element is generated for priority images. * Having a large number of preload tags may negatively affect the performance, * so we warn developers (by throwing an error) if the number of preloaded images * is above a certain threshold. This const specifies this threshold. */ const DEFAULT_PRELOADED_IMAGES_LIMIT = 5; /** * Helps to keep track of priority images that already have a corresponding * preload tag (to avoid generating multiple preload tags with the same URL). * * This Set tracks the original src passed into the `ngSrc` input not the src after it has been * run through the specified `IMAGE_LOADER`. */ const PRELOADED_IMAGES = new InjectionToken(typeof ngDevMode === 'undefined' || ngDevMode ? 'NG_OPTIMIZED_PRELOADED_IMAGES' : '', { providedIn: 'root', factory: () => new Set(), }); /** * @description Contains the logic needed to track and add preload link tags to the `` tag. It * will also track what images have already had preload link tags added so as to not duplicate link * tags. * * In dev mode this service will validate that the number of preloaded images does not exceed the * configured default preloaded images limit: {@link DEFAULT_PRELOADED_IMAGES_LIMIT}. */ class PreloadLinkCreator { preloadedImages = inject(PRELOADED_IMAGES); document = inject(DOCUMENT); errorShown = false; /** * @description Add a preload `` to the `` of the `index.html` that is served from the * server while using Angular Universal and SSR to kick off image loads for high priority images. * * The `sizes` (passed in from the user) and `srcset` (parsed and formatted from `ngSrcset`) * properties used to set the corresponding attributes, `imagesizes` and `imagesrcset` * respectively, on the preload `` tag so that the correctly sized image is preloaded from * the CDN. * * {@link https://web.dev/preload-responsive-images/#imagesrcset-and-imagesizes} * * @param renderer The `Renderer2` passed in from the directive * @param src The original src of the image that is set on the `ngSrc` input. * @param srcset The parsed and formatted srcset created from the `ngSrcset` input * @param sizes The value of the `sizes` attribute passed in to the `` tag */ createPreloadLinkTag(renderer, src, srcset, sizes) { if (ngDevMode && !this.errorShown && this.preloadedImages.size >= DEFAULT_PRELOADED_IMAGES_LIMIT) { this.errorShown = true; console.warn(_formatRuntimeError(2961 /* RuntimeErrorCode.TOO_MANY_PRELOADED_IMAGES */, `The \`NgOptimizedImage\` directive has detected that more than ` + `${DEFAULT_PRELOADED_IMAGES_LIMIT} images were marked as priority. ` + `This might negatively affect an overall performance of the page. ` + `To fix this, remove the "priority" attribute from images with less priority.`)); } if (this.preloadedImages.has(src)) { return; } this.preloadedImages.add(src); const preload = renderer.createElement('link'); renderer.setAttribute(preload, 'as', 'image'); renderer.setAttribute(preload, 'href', src); renderer.setAttribute(preload, 'rel', 'preload'); renderer.setAttribute(preload, 'fetchpriority', 'high'); if (sizes) { renderer.setAttribute(preload, 'imageSizes', sizes); } if (srcset) { renderer.setAttribute(preload, 'imageSrcset', srcset); } renderer.appendChild(this.document.head, preload); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreloadLinkCreator, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreloadLinkCreator, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PreloadLinkCreator, decorators: [{ type: Injectable, args: [{ providedIn: 'root' }] }] }); /** * When a Base64-encoded image is passed as an input to the `NgOptimizedImage` directive, * an error is thrown. The image content (as a string) might be very long, thus making * it hard to read an error message if the entire string is included. This const defines * the number of characters that should be included into the error message. The rest * of the content is truncated. */ const BASE64_IMG_MAX_LENGTH_IN_ERROR = 50; /** * RegExpr to determine whether a src in a srcset is using width descriptors. * Should match something like: "100w, 200w". */ const VALID_WIDTH_DESCRIPTOR_SRCSET = /^((\s*\d+w\s*(,|$)){1,})$/; /** * RegExpr to determine whether a src in a srcset is using density descriptors. * Should match something like: "1x, 2x, 50x". Also supports decimals like "1.5x, 1.50x". */ const VALID_DENSITY_DESCRIPTOR_SRCSET = /^((\s*\d+(\.\d+)?x\s*(,|$)){1,})$/; /** * Srcset values with a density descriptor higher than this value will actively * throw an error. Such densities are not permitted as they cause image sizes * to be unreasonably large and slow down LCP. */ const ABSOLUTE_SRCSET_DENSITY_CAP = 3; /** * Used only in error message text to communicate best practices, as we will * only throw based on the slightly more conservative ABSOLUTE_SRCSET_DENSITY_CAP. */ const RECOMMENDED_SRCSET_DENSITY_CAP = 2; /** * Used in generating automatic density-based srcsets */ const DENSITY_SRCSET_MULTIPLIERS = [1, 2]; /** * Used to determine which breakpoints to use on full-width images */ const VIEWPORT_BREAKPOINT_CUTOFF = 640; /** * Used to determine whether two aspect ratios are similar in value. */ const ASPECT_RATIO_TOLERANCE = 0.1; /** * Used to determine whether the image has been requested at an overly * large size compared to the actual rendered image size (after taking * into account a typical device pixel ratio). In pixels. */ const OVERSIZED_IMAGE_TOLERANCE = 1000; /** * Used to limit automatic srcset generation of very large sources for * fixed-size images. In pixels. */ const FIXED_SRCSET_WIDTH_LIMIT = 1920; const FIXED_SRCSET_HEIGHT_LIMIT = 1080; /** * Default blur radius of the CSS filter used on placeholder images, in pixels */ const PLACEHOLDER_BLUR_AMOUNT = 15; /** * Placeholder dimension (height or width) limit in pixels. Angular produces a warning * when this limit is crossed. */ const PLACEHOLDER_DIMENSION_LIMIT = 1000; /** * Used to warn or error when the user provides an overly large dataURL for the placeholder * attribute. * Character count of Base64 images is 1 character per byte, and base64 encoding is approximately * 33% larger than base images, so 4000 characters is around 3KB on disk and 10000 characters is * around 7.7KB. Experimentally, 4000 characters is about 20x20px in PNG or medium-quality JPEG * format, and 10,000 is around 50x50px, but there's quite a bit of variation depending on how the * image is saved. */ const DATA_URL_WARN_LIMIT = 4000; const DATA_URL_ERROR_LIMIT = 10000; /** Info about built-in loaders we can test for. */ const BUILT_IN_LOADERS = [ imgixLoaderInfo, imageKitLoaderInfo, cloudinaryLoaderInfo, netlifyLoaderInfo, ]; /** * Threshold for the PRIORITY_TRUE_COUNT */ const PRIORITY_COUNT_THRESHOLD = 10; /** * This count is used to log a devMode warning * when the count of directive instances with priority=true * exceeds the threshold PRIORITY_COUNT_THRESHOLD */ let IMGS_WITH_PRIORITY_ATTR_COUNT = 0; /** * Directive that improves image loading performance by enforcing best practices. * * `NgOptimizedImage` ensures that the loading of the Largest Contentful Paint (LCP) image is * prioritized by: * - Automatically setting the `fetchpriority` attribute on the `` tag * - Lazy loading non-priority images by default * - Automatically generating a preconnect link tag in the document head * * In addition, the directive: * - Generates appropriate asset URLs if a corresponding `ImageLoader` function is provided * - Automatically generates a srcset * - Requires that `width` and `height` are set * - Warns if `width` or `height` have been set incorrectly * - Warns if the image will be visually distorted when rendered * * @usageNotes * The `NgOptimizedImage` directive is marked as [standalone](guide/components/importing) and can * be imported directly. * * Follow the steps below to enable and use the directive: * 1. Import it into the necessary NgModule or a standalone Component. * 2. Optionally provide an `ImageLoader` if you use an image hosting service. * 3. Update the necessary `` tags in templates and replace `src` attributes with `ngSrc`. * Using a `ngSrc` allows the directive to control when the `src` gets set, which triggers an image * download. * * Step 1: import the `NgOptimizedImage` directive. * * ```ts * import { NgOptimizedImage } from '@angular/common'; * * // Include it into the necessary NgModule * @NgModule({ * imports: [NgOptimizedImage], * }) * class AppModule {} * * // ... or a standalone Component * @Component({ * imports: [NgOptimizedImage], * }) * class MyStandaloneComponent {} * ``` * * Step 2: configure a loader. * * To use the **default loader**: no additional code changes are necessary. The URL returned by the * generic loader will always match the value of "src". In other words, this loader applies no * transformations to the resource URL and the value of the `ngSrc` attribute will be used as is. * * To use an existing loader for a **third-party image service**: add the provider factory for your * chosen service to the `providers` array. In the example below, the Imgix loader is used: * * ```ts * import {provideImgixLoader} from '@angular/common'; * * // Call the function and add the result to the `providers` array: * providers: [ * provideImgixLoader("https://my.base.url/"), * ], * ``` * * The `NgOptimizedImage` directive provides the following functions: * - `provideCloudflareLoader` * - `provideCloudinaryLoader` * - `provideImageKitLoader` * - `provideImgixLoader` * * If you use a different image provider, you can create a custom loader function as described * below. * * To use a **custom loader**: provide your loader function as a value for the `IMAGE_LOADER` DI * token. * * ```ts * import {IMAGE_LOADER, ImageLoaderConfig} from '@angular/common'; * * // Configure the loader using the `IMAGE_LOADER` token. * providers: [ * { * provide: IMAGE_LOADER, * useValue: (config: ImageLoaderConfig) => { * return `https://example.com/${config.src}-${config.width}.jpg`; * } * }, * ], * ``` * * Step 3: update `` tags in templates to use `ngSrc` instead of `src`. * * ```html * * ``` * * @publicApi */ class NgOptimizedImage { imageLoader = inject(IMAGE_LOADER); config = processConfig(inject(_IMAGE_CONFIG)); renderer = inject(Renderer2); imgElement = inject(ElementRef).nativeElement; injector = inject(Injector); // An LCP image observer should be injected only in development mode. // Do not assign it to `null` to avoid having a redundant property in the production bundle. lcpObserver; /** * Calculate the rewritten `src` once and store it. * This is needed to avoid repetitive calculations and make sure the directive cleanup in the * `ngOnDestroy` does not rely on the `IMAGE_LOADER` logic (which in turn can rely on some other * instance that might be already destroyed). */ _renderedSrc = null; /** * Name of the source image. * Image name will be processed by the image loader and the final URL will be applied as the `src` * property of the image. */ ngSrc; /** * A comma separated list of width or density descriptors. * The image name will be taken from `ngSrc` and combined with the list of width or density * descriptors to generate the final `srcset` property of the image. * * Example: * ```html * => * * ``` */ ngSrcset; /** * The base `sizes` attribute passed through to the `` element. * Providing sizes causes the image to create an automatic responsive srcset. */ sizes; /** * For responsive images: the intrinsic width of the image in pixels. * For fixed size images: the desired rendered width of the image in pixels. */ width; /** * For responsive images: the intrinsic height of the image in pixels. * For fixed size images: the desired rendered height of the image in pixels. */ height; /** * The desired loading behavior (lazy, eager, or auto). Defaults to `lazy`, * which is recommended for most images. * * Warning: Setting images as loading="eager" or loading="auto" marks them * as non-priority images and can hurt loading performance. For images which * may be the LCP element, use the `priority` attribute instead of `loading`. */ loading; /** * Indicates whether this image should have a high priority. */ priority = false; /** * Data to pass through to custom loaders. */ loaderParams; /** * Disables automatic srcset generation for this image. */ disableOptimizedSrcset = false; /** * Sets the image to "fill mode", which eliminates the height/width requirement and adds * styles such that the image fills its containing element. */ fill = false; /** * A URL or data URL for an image to be used as a placeholder while this image loads. */ placeholder; /** * Configuration object for placeholder settings. Options: * * blur: Setting this to false disables the automatic CSS blur. */ placeholderConfig; /** * Value of the `src` attribute if set on the host `` element. * This input is exclusively read to assert that `src` is not set in conflict * with `ngSrc` and that images don't start to load until a lazy loading strategy is set. * @internal */ src; /** * Value of the `srcset` attribute if set on the host `` element. * This input is exclusively read to assert that `srcset` is not set in conflict * with `ngSrcset` and that images don't start to load until a lazy loading strategy is set. * @internal */ srcset; constructor() { if (ngDevMode) { this.lcpObserver = this.injector.get(LCPImageObserver); // Using `DestroyRef` to avoid having an empty `ngOnDestroy` method since this // is only run in development mode. const destroyRef = inject(DestroyRef); destroyRef.onDestroy(() => { if (!this.priority && this._renderedSrc !== null) { this.lcpObserver.unregisterImage(this._renderedSrc); } }); } } /** @docs-private */ ngOnInit() { _performanceMarkFeature('NgOptimizedImage'); if (ngDevMode) { const ngZone = this.injector.get(NgZone); assertNonEmptyInput(this, 'ngSrc', this.ngSrc); assertValidNgSrcset(this, this.ngSrcset); assertNoConflictingSrc(this); if (this.ngSrcset) { assertNoConflictingSrcset(this); } assertNotBase64Image(this); assertNotBlobUrl(this); if (this.fill) { assertEmptyWidthAndHeight(this); // This leaves the Angular zone to avoid triggering unnecessary change detection cycles when // `load` tasks are invoked on images. ngZone.runOutsideAngular(() => assertNonZeroRenderedHeight(this, this.imgElement, this.renderer)); } else { assertNonEmptyWidthAndHeight(this); if (this.height !== undefined) { assertGreaterThanZero(this, this.height, 'height'); } if (this.width !== undefined) { assertGreaterThanZero(this, this.width, 'width'); } // Only check for distorted images when not in fill mode, where // images may be intentionally stretched, cropped or letterboxed. ngZone.runOutsideAngular(() => assertNoImageDistortion(this, this.imgElement, this.renderer)); } assertValidLoadingInput(this); if (!this.ngSrcset) { assertNoComplexSizes(this); } assertValidPlaceholder(this, this.imageLoader); assertNotMissingBuiltInLoader(this.ngSrc, this.imageLoader); assertNoNgSrcsetWithoutLoader(this, this.imageLoader); assertNoLoaderParamsWithoutLoader(this, this.imageLoader); ngZone.runOutsideAngular(() => { this.lcpObserver.registerImage(this.getRewrittenSrc(), this.ngSrc, this.priority); }); if (this.priority) { const checker = this.injector.get(PreconnectLinkChecker); checker.assertPreconnect(this.getRewrittenSrc(), this.ngSrc); if (typeof ngServerMode !== 'undefined' && !ngServerMode) { const applicationRef = this.injector.get(ApplicationRef); assetPriorityCountBelowThreshold(applicationRef); } } } if (this.placeholder) { this.removePlaceholderOnLoad(this.imgElement); } this.setHostAttributes(); } setHostAttributes() { // Must set width/height explicitly in case they are bound (in which case they will // only be reflected and not found by the browser) if (this.fill) { this.sizes ||= '100vw'; } else { this.setHostAttribute('width', this.width.toString()); this.setHostAttribute('height', this.height.toString()); } this.setHostAttribute('loading', this.getLoadingBehavior()); this.setHostAttribute('fetchpriority', this.getFetchPriority()); // The `data-ng-img` attribute flags an image as using the directive, to allow // for analysis of the directive's performance. this.setHostAttribute('ng-img', 'true'); // The `src` and `srcset` attributes should be set last since other attributes // could affect the image's loading behavior. const rewrittenSrcset = this.updateSrcAndSrcset(); if (this.sizes) { if (this.getLoadingBehavior() === 'lazy') { this.setHostAttribute('sizes', 'auto, ' + this.sizes); } else { this.setHostAttribute('sizes', this.sizes); } } else { if (this.ngSrcset && VALID_WIDTH_DESCRIPTOR_SRCSET.test(this.ngSrcset) && this.getLoadingBehavior() === 'lazy') { this.setHostAttribute('sizes', 'auto, 100vw'); } } if (typeof ngServerMode !== 'undefined' && ngServerMode && this.priority) { const preloadLinkCreator = this.injector.get(PreloadLinkCreator); preloadLinkCreator.createPreloadLinkTag(this.renderer, this.getRewrittenSrc(), rewrittenSrcset, this.sizes); } } /** @docs-private */ ngOnChanges(changes) { if (ngDevMode) { assertNoPostInitInputChange(this, changes, [ 'ngSrcset', 'width', 'height', 'priority', 'fill', 'loading', 'sizes', 'loaderParams', 'disableOptimizedSrcset', ]); } if (changes['ngSrc'] && !changes['ngSrc'].isFirstChange()) { const oldSrc = this._renderedSrc; this.updateSrcAndSrcset(true); if (ngDevMode) { const newSrc = this._renderedSrc; if (oldSrc && newSrc && oldSrc !== newSrc) { const ngZone = this.injector.get(NgZone); ngZone.runOutsideAngular(() => { this.lcpObserver.updateImage(oldSrc, newSrc); }); } } } if (ngDevMode && changes['placeholder']?.currentValue && typeof ngServerMode !== 'undefined' && !ngServerMode) { assertPlaceholderDimensions(this, this.imgElement); } } callImageLoader(configWithoutCustomParams) { let augmentedConfig = configWithoutCustomParams; if (this.loaderParams) { augmentedConfig.loaderParams = this.loaderParams; } return this.imageLoader(augmentedConfig); } getLoadingBehavior() { if (!this.priority && this.loading !== undefined) { return this.loading; } return this.priority ? 'eager' : 'lazy'; } getFetchPriority() { return this.priority ? 'high' : 'auto'; } getRewrittenSrc() { // ImageLoaderConfig supports setting a width property. However, we're not setting width here // because if the developer uses rendered width instead of intrinsic width in the HTML width // attribute, the image requested may be too small for 2x+ screens. if (!this._renderedSrc) { const imgConfig = { src: this.ngSrc }; // Cache calculated image src to reuse it later in the code. this._renderedSrc = this.callImageLoader(imgConfig); } return this._renderedSrc; } getRewrittenSrcset() { const widthSrcSet = VALID_WIDTH_DESCRIPTOR_SRCSET.test(this.ngSrcset); const finalSrcs = this.ngSrcset .split(',') .filter((src) => src !== '') .map((srcStr) => { srcStr = srcStr.trim(); const width = widthSrcSet ? parseFloat(srcStr) : parseFloat(srcStr) * this.width; return `${this.callImageLoader({ src: this.ngSrc, width })} ${srcStr}`; }); return finalSrcs.join(', '); } getAutomaticSrcset() { if (this.sizes) { return this.getResponsiveSrcset(); } else { return this.getFixedSrcset(); } } getResponsiveSrcset() { const { breakpoints } = this.config; let filteredBreakpoints = breakpoints; if (this.sizes?.trim() === '100vw') { // Since this is a full-screen-width image, our srcset only needs to include // breakpoints with full viewport widths. filteredBreakpoints = breakpoints.filter((bp) => bp >= VIEWPORT_BREAKPOINT_CUTOFF); } const finalSrcs = filteredBreakpoints.map((bp) => `${this.callImageLoader({ src: this.ngSrc, width: bp })} ${bp}w`); return finalSrcs.join(', '); } updateSrcAndSrcset(forceSrcRecalc = false) { if (forceSrcRecalc) { // Reset cached value, so that the followup `getRewrittenSrc()` call // will recalculate it and update the cache. this._renderedSrc = null; } const rewrittenSrc = this.getRewrittenSrc(); this.setHostAttribute('src', rewrittenSrc); let rewrittenSrcset = undefined; if (this.ngSrcset) { rewrittenSrcset = this.getRewrittenSrcset(); } else if (this.shouldGenerateAutomaticSrcset()) { rewrittenSrcset = this.getAutomaticSrcset(); } if (rewrittenSrcset) { this.setHostAttribute('srcset', rewrittenSrcset); } return rewrittenSrcset; } getFixedSrcset() { const finalSrcs = DENSITY_SRCSET_MULTIPLIERS.map((multiplier) => `${this.callImageLoader({ src: this.ngSrc, width: this.width * multiplier, })} ${multiplier}x`); return finalSrcs.join(', '); } shouldGenerateAutomaticSrcset() { let oversizedImage = false; if (!this.sizes) { oversizedImage = this.width > FIXED_SRCSET_WIDTH_LIMIT || this.height > FIXED_SRCSET_HEIGHT_LIMIT; } return (!this.disableOptimizedSrcset && !this.srcset && this.imageLoader !== noopImageLoader && !oversizedImage); } /** * Returns an image url formatted for use with the CSS background-image property. Expects one of: * * A base64 encoded image, which is wrapped and passed through. * * A boolean. If true, calls the image loader to generate a small placeholder url. */ generatePlaceholder(placeholderInput) { const { placeholderResolution } = this.config; if (placeholderInput === true) { return `url(${this.callImageLoader({ src: this.ngSrc, width: placeholderResolution, isPlaceholder: true, })})`; } else if (typeof placeholderInput === 'string') { return `url(${placeholderInput})`; } return null; } /** * Determines if blur should be applied, based on an optional boolean * property `blur` within the optional configuration object `placeholderConfig`. */ shouldBlurPlaceholder(placeholderConfig) { if (!placeholderConfig || !placeholderConfig.hasOwnProperty('blur')) { return true; } return Boolean(placeholderConfig.blur); } removePlaceholderOnLoad(img) { const callback = () => { const changeDetectorRef = this.injector.get(ChangeDetectorRef); removeLoadListenerFn(); removeErrorListenerFn(); this.placeholder = false; changeDetectorRef.markForCheck(); }; const removeLoadListenerFn = this.renderer.listen(img, 'load', callback); const removeErrorListenerFn = this.renderer.listen(img, 'error', callback); callOnLoadIfImageIsLoaded(img, callback); } setHostAttribute(name, value) { this.renderer.setAttribute(this.imgElement, name, value); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgOptimizedImage, deps: [], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.14", type: NgOptimizedImage, isStandalone: true, selector: "img[ngSrc]", inputs: { ngSrc: ["ngSrc", "ngSrc", unwrapSafeUrl], ngSrcset: "ngSrcset", sizes: "sizes", width: ["width", "width", numberAttribute], height: ["height", "height", numberAttribute], loading: "loading", priority: ["priority", "priority", booleanAttribute], loaderParams: "loaderParams", disableOptimizedSrcset: ["disableOptimizedSrcset", "disableOptimizedSrcset", booleanAttribute], fill: ["fill", "fill", booleanAttribute], placeholder: ["placeholder", "placeholder", booleanOrUrlAttribute], placeholderConfig: "placeholderConfig", src: "src", srcset: "srcset" }, host: { properties: { "style.position": "fill ? \"absolute\" : null", "style.width": "fill ? \"100%\" : null", "style.height": "fill ? \"100%\" : null", "style.inset": "fill ? \"0\" : null", "style.background-size": "placeholder ? \"cover\" : null", "style.background-position": "placeholder ? \"50% 50%\" : null", "style.background-repeat": "placeholder ? \"no-repeat\" : null", "style.background-image": "placeholder ? generatePlaceholder(placeholder) : null", "style.filter": "placeholder && shouldBlurPlaceholder(placeholderConfig) ? \"blur(15px)\" : null" } }, usesOnChanges: true, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgOptimizedImage, decorators: [{ type: Directive, args: [{ selector: 'img[ngSrc]', host: { '[style.position]': 'fill ? "absolute" : null', '[style.width]': 'fill ? "100%" : null', '[style.height]': 'fill ? "100%" : null', '[style.inset]': 'fill ? "0" : null', '[style.background-size]': 'placeholder ? "cover" : null', '[style.background-position]': 'placeholder ? "50% 50%" : null', '[style.background-repeat]': 'placeholder ? "no-repeat" : null', '[style.background-image]': 'placeholder ? generatePlaceholder(placeholder) : null', '[style.filter]': `placeholder && shouldBlurPlaceholder(placeholderConfig) ? "blur(${PLACEHOLDER_BLUR_AMOUNT}px)" : null`, }, }] }], ctorParameters: () => [], propDecorators: { ngSrc: [{ type: Input, args: [{ required: true, transform: unwrapSafeUrl }] }], ngSrcset: [{ type: Input }], sizes: [{ type: Input }], width: [{ type: Input, args: [{ transform: numberAttribute }] }], height: [{ type: Input, args: [{ transform: numberAttribute }] }], loading: [{ type: Input }], priority: [{ type: Input, args: [{ transform: booleanAttribute }] }], loaderParams: [{ type: Input }], disableOptimizedSrcset: [{ type: Input, args: [{ transform: booleanAttribute }] }], fill: [{ type: Input, args: [{ transform: booleanAttribute }] }], placeholder: [{ type: Input, args: [{ transform: booleanOrUrlAttribute }] }], placeholderConfig: [{ type: Input }], src: [{ type: Input }], srcset: [{ type: Input }] } }); /***** Helpers *****/ /** * Sorts provided config breakpoints and uses defaults. */ function processConfig(config) { let sortedBreakpoints = {}; if (config.breakpoints) { sortedBreakpoints.breakpoints = config.breakpoints.sort((a, b) => a - b); } return Object.assign({}, _IMAGE_CONFIG_DEFAULTS, config, sortedBreakpoints); } /***** Assert functions *****/ /** * Verifies that there is no `src` set on a host element. */ function assertNoConflictingSrc(dir) { if (dir.src) { throw new _RuntimeError(2950 /* RuntimeErrorCode.UNEXPECTED_SRC_ATTR */, `${imgDirectiveDetails(dir.ngSrc)} both \`src\` and \`ngSrc\` have been set. ` + `Supplying both of these attributes breaks lazy loading. ` + `The NgOptimizedImage directive sets \`src\` itself based on the value of \`ngSrc\`. ` + `To fix this, please remove the \`src\` attribute.`); } } /** * Verifies that there is no `srcset` set on a host element. */ function assertNoConflictingSrcset(dir) { if (dir.srcset) { throw new _RuntimeError(2951 /* RuntimeErrorCode.UNEXPECTED_SRCSET_ATTR */, `${imgDirectiveDetails(dir.ngSrc)} both \`srcset\` and \`ngSrcset\` have been set. ` + `Supplying both of these attributes breaks lazy loading. ` + `The NgOptimizedImage directive sets \`srcset\` itself based on the value of ` + `\`ngSrcset\`. To fix this, please remove the \`srcset\` attribute.`); } } /** * Verifies that the `ngSrc` is not a Base64-encoded image. */ function assertNotBase64Image(dir) { let ngSrc = dir.ngSrc.trim(); if (ngSrc.startsWith('data:')) { if (ngSrc.length > BASE64_IMG_MAX_LENGTH_IN_ERROR) { ngSrc = ngSrc.substring(0, BASE64_IMG_MAX_LENGTH_IN_ERROR) + '...'; } throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc, false)} \`ngSrc\` is a Base64-encoded string ` + `(${ngSrc}). NgOptimizedImage does not support Base64-encoded strings. ` + `To fix this, disable the NgOptimizedImage directive for this element ` + `by removing \`ngSrc\` and using a standard \`src\` attribute instead.`); } } /** * Verifies that the 'sizes' only includes responsive valueb$s. */ function assertNoComplexSizes(dir) { let sizes = dir.sizes; if (sizes?.match(/((\)|,)\s|^)\d+px/)) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc, false)} \`sizes\` was set to a string including ` + `pixel values. For automatic \`srcset\` generation, \`sizes\` must only include responsive ` + `values, such as \`sizes="50vw"\` or \`sizes="(min-width: 768px) 50vw, 100vw"\`. ` + `To fix this, modify the \`sizes\` attribute, or provide your own \`ngSrcset\` value directly.`); } } function assertValidPlaceholder(dir, imageLoader) { assertNoPlaceholderConfigWithoutPlaceholder(dir); assertNoRelativePlaceholderWithoutLoader(dir, imageLoader); assertNoOversizedDataUrl(dir); } /** * Verifies that placeholderConfig isn't being used without placeholder */ function assertNoPlaceholderConfigWithoutPlaceholder(dir) { if (dir.placeholderConfig && !dir.placeholder) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc, false)} \`placeholderConfig\` options were provided for an ` + `image that does not use the \`placeholder\` attribute, and will have no effect.`); } } /** * Warns if a relative URL placeholder is specified, but no loader is present to provide the small * image. */ function assertNoRelativePlaceholderWithoutLoader(dir, imageLoader) { if (dir.placeholder === true && imageLoader === noopImageLoader) { throw new _RuntimeError(2963 /* RuntimeErrorCode.MISSING_NECESSARY_LOADER */, `${imgDirectiveDetails(dir.ngSrc)} the \`placeholder\` attribute is set to true but ` + `no image loader is configured (i.e. the default one is being used), ` + `which would result in the same image being used for the primary image and its placeholder. ` + `To fix this, provide a loader or remove the \`placeholder\` attribute from the image.`); } } /** * Warns or throws an error if an oversized dataURL placeholder is provided. */ function assertNoOversizedDataUrl(dir) { if (dir.placeholder && typeof dir.placeholder === 'string' && dir.placeholder.startsWith('data:')) { if (dir.placeholder.length > DATA_URL_ERROR_LIMIT) { throw new _RuntimeError(2965 /* RuntimeErrorCode.OVERSIZED_PLACEHOLDER */, `${imgDirectiveDetails(dir.ngSrc)} the \`placeholder\` attribute is set to a data URL which is longer ` + `than ${DATA_URL_ERROR_LIMIT} characters. This is strongly discouraged, as large inline placeholders ` + `directly increase the bundle size of Angular and hurt page load performance. To fix this, generate ` + `a smaller data URL placeholder.`); } if (dir.placeholder.length > DATA_URL_WARN_LIMIT) { console.warn(_formatRuntimeError(2965 /* RuntimeErrorCode.OVERSIZED_PLACEHOLDER */, `${imgDirectiveDetails(dir.ngSrc)} the \`placeholder\` attribute is set to a data URL which is longer ` + `than ${DATA_URL_WARN_LIMIT} characters. This is discouraged, as large inline placeholders ` + `directly increase the bundle size of Angular and hurt page load performance. For better loading performance, ` + `generate a smaller data URL placeholder.`)); } } } /** * Verifies that the `ngSrc` is not a Blob URL. */ function assertNotBlobUrl(dir) { const ngSrc = dir.ngSrc.trim(); if (ngSrc.startsWith('blob:')) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} \`ngSrc\` was set to a blob URL (${ngSrc}). ` + `Blob URLs are not supported by the NgOptimizedImage directive. ` + `To fix this, disable the NgOptimizedImage directive for this element ` + `by removing \`ngSrc\` and using a regular \`src\` attribute instead.`); } } /** * Verifies that the input is set to a non-empty string. */ function assertNonEmptyInput(dir, name, value) { const isString = typeof value === 'string'; const isEmptyString = isString && value.trim() === ''; if (!isString || isEmptyString) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} \`${name}\` has an invalid value ` + `(\`${value}\`). To fix this, change the value to a non-empty string.`); } } /** * Verifies that the `ngSrcset` is in a valid format, e.g. "100w, 200w" or "1x, 2x". */ function assertValidNgSrcset(dir, value) { if (value == null) return; assertNonEmptyInput(dir, 'ngSrcset', value); const stringVal = value; const isValidWidthDescriptor = VALID_WIDTH_DESCRIPTOR_SRCSET.test(stringVal); const isValidDensityDescriptor = VALID_DENSITY_DESCRIPTOR_SRCSET.test(stringVal); if (isValidDensityDescriptor) { assertUnderDensityCap(dir, stringVal); } const isValidSrcset = isValidWidthDescriptor || isValidDensityDescriptor; if (!isValidSrcset) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} \`ngSrcset\` has an invalid value (\`${value}\`). ` + `To fix this, supply \`ngSrcset\` using a comma-separated list of one or more width ` + `descriptors (e.g. "100w, 200w") or density descriptors (e.g. "1x, 2x").`); } } function assertUnderDensityCap(dir, value) { const underDensityCap = value .split(',') .every((num) => num === '' || parseFloat(num) <= ABSOLUTE_SRCSET_DENSITY_CAP); if (!underDensityCap) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the \`ngSrcset\` contains an unsupported image density:` + `\`${value}\`. NgOptimizedImage generally recommends a max image density of ` + `${RECOMMENDED_SRCSET_DENSITY_CAP}x but supports image densities up to ` + `${ABSOLUTE_SRCSET_DENSITY_CAP}x. The human eye cannot distinguish between image densities ` + `greater than ${RECOMMENDED_SRCSET_DENSITY_CAP}x - which makes them unnecessary for ` + `most use cases. Images that will be pinch-zoomed are typically the primary use case for ` + `${ABSOLUTE_SRCSET_DENSITY_CAP}x images. Please remove the high density descriptor and try again.`); } } /** * Creates a `RuntimeError` instance to represent a situation when an input is set after * the directive has initialized. */ function postInitInputChangeError(dir, inputName) { let reason; if (inputName === 'width' || inputName === 'height') { reason = `Changing \`${inputName}\` may result in different attribute value ` + `applied to the underlying image element and cause layout shifts on a page.`; } else { reason = `Changing the \`${inputName}\` would have no effect on the underlying ` + `image element, because the resource loading has already occurred.`; } return new _RuntimeError(2953 /* RuntimeErrorCode.UNEXPECTED_INPUT_CHANGE */, `${imgDirectiveDetails(dir.ngSrc)} \`${inputName}\` was updated after initialization. ` + `The NgOptimizedImage directive will not react to this input change. ${reason} ` + `To fix this, either switch \`${inputName}\` to a static value ` + `or wrap the image element in an @if that is gated on the necessary value.`); } /** * Verify that none of the listed inputs has changed. */ function assertNoPostInitInputChange(dir, changes, inputs) { inputs.forEach((input) => { const isUpdated = changes.hasOwnProperty(input); if (isUpdated && !changes[input].isFirstChange()) { if (input === 'ngSrc') { // When the `ngSrc` input changes, we detect that only in the // `ngOnChanges` hook, thus the `ngSrc` is already set. We use // `ngSrc` in the error message, so we use a previous value, but // not the updated one in it. dir = { ngSrc: changes[input].previousValue }; } throw postInitInputChangeError(dir, input); } }); } /** * Verifies that a specified input is a number greater than 0. */ function assertGreaterThanZero(dir, inputValue, inputName) { const validNumber = typeof inputValue === 'number' && inputValue > 0; const validString = typeof inputValue === 'string' && /^\d+$/.test(inputValue.trim()) && parseInt(inputValue) > 0; if (!validNumber && !validString) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} \`${inputName}\` has an invalid value. ` + `To fix this, provide \`${inputName}\` as a number greater than 0.`); } } /** * Verifies that the rendered image is not visually distorted. Effectively this is checking: * - Whether the "width" and "height" attributes reflect the actual dimensions of the image. * - Whether image styling is "correct" (see below for a longer explanation). */ function assertNoImageDistortion(dir, img, renderer) { const callback = () => { removeLoadListenerFn(); removeErrorListenerFn(); const computedStyle = window.getComputedStyle(img); let renderedWidth = parseFloat(computedStyle.getPropertyValue('width')); let renderedHeight = parseFloat(computedStyle.getPropertyValue('height')); const boxSizing = computedStyle.getPropertyValue('box-sizing'); if (boxSizing === 'border-box') { const paddingTop = computedStyle.getPropertyValue('padding-top'); const paddingRight = computedStyle.getPropertyValue('padding-right'); const paddingBottom = computedStyle.getPropertyValue('padding-bottom'); const paddingLeft = computedStyle.getPropertyValue('padding-left'); renderedWidth -= parseFloat(paddingRight) + parseFloat(paddingLeft); renderedHeight -= parseFloat(paddingTop) + parseFloat(paddingBottom); } const renderedAspectRatio = renderedWidth / renderedHeight; const nonZeroRenderedDimensions = renderedWidth !== 0 && renderedHeight !== 0; const intrinsicWidth = img.naturalWidth; const intrinsicHeight = img.naturalHeight; const intrinsicAspectRatio = intrinsicWidth / intrinsicHeight; const suppliedWidth = dir.width; const suppliedHeight = dir.height; const suppliedAspectRatio = suppliedWidth / suppliedHeight; // Tolerance is used to account for the impact of subpixel rendering. // Due to subpixel rendering, the rendered, intrinsic, and supplied // aspect ratios of a correctly configured image may not exactly match. // For example, a `width=4030 height=3020` image might have a rendered // size of "1062w, 796.48h". (An aspect ratio of 1.334... vs. 1.333...) const inaccurateDimensions = Math.abs(suppliedAspectRatio - intrinsicAspectRatio) > ASPECT_RATIO_TOLERANCE; const stylingDistortion = nonZeroRenderedDimensions && Math.abs(intrinsicAspectRatio - renderedAspectRatio) > ASPECT_RATIO_TOLERANCE; if (inaccurateDimensions) { console.warn(_formatRuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the aspect ratio of the image does not match ` + `the aspect ratio indicated by the width and height attributes. ` + `\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h ` + `(aspect-ratio: ${round(intrinsicAspectRatio)}). \nSupplied width and height attributes: ` + `${suppliedWidth}w x ${suppliedHeight}h (aspect-ratio: ${round(suppliedAspectRatio)}). ` + `\nTo fix this, update the width and height attributes.`)); } else if (stylingDistortion) { console.warn(_formatRuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the aspect ratio of the rendered image ` + `does not match the image's intrinsic aspect ratio. ` + `\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h ` + `(aspect-ratio: ${round(intrinsicAspectRatio)}). \nRendered image size: ` + `${renderedWidth}w x ${renderedHeight}h (aspect-ratio: ` + `${round(renderedAspectRatio)}). \nThis issue can occur if "width" and "height" ` + `attributes are added to an image without updating the corresponding ` + `image styling. To fix this, adjust image styling. In most cases, ` + `adding "height: auto" or "width: auto" to the image styling will fix ` + `this issue.`)); } else if (!dir.ngSrcset && nonZeroRenderedDimensions) { // If `ngSrcset` hasn't been set, sanity check the intrinsic size. const recommendedWidth = RECOMMENDED_SRCSET_DENSITY_CAP * renderedWidth; const recommendedHeight = RECOMMENDED_SRCSET_DENSITY_CAP * renderedHeight; const oversizedWidth = intrinsicWidth - recommendedWidth >= OVERSIZED_IMAGE_TOLERANCE; const oversizedHeight = intrinsicHeight - recommendedHeight >= OVERSIZED_IMAGE_TOLERANCE; if (oversizedWidth || oversizedHeight) { console.warn(_formatRuntimeError(2960 /* RuntimeErrorCode.OVERSIZED_IMAGE */, `${imgDirectiveDetails(dir.ngSrc)} the intrinsic image is significantly ` + `larger than necessary. ` + `\nRendered image size: ${renderedWidth}w x ${renderedHeight}h. ` + `\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h. ` + `\nRecommended intrinsic image size: ${recommendedWidth}w x ${recommendedHeight}h. ` + `\nNote: Recommended intrinsic image size is calculated assuming a maximum DPR of ` + `${RECOMMENDED_SRCSET_DENSITY_CAP}. To improve loading time, resize the image ` + `or consider using the "ngSrcset" and "sizes" attributes.`)); } } }; const removeLoadListenerFn = renderer.listen(img, 'load', callback); // We only listen to the `error` event to remove the `load` event listener because it will not be // fired if the image fails to load. This is done to prevent memory leaks in development mode // because image elements aren't garbage-collected properly. It happens because zone.js stores the // event listener directly on the element and closures capture `dir`. const removeErrorListenerFn = renderer.listen(img, 'error', () => { removeLoadListenerFn(); removeErrorListenerFn(); }); callOnLoadIfImageIsLoaded(img, callback); } /** * Verifies that a specified input is set. */ function assertNonEmptyWidthAndHeight(dir) { let missingAttributes = []; if (dir.width === undefined) missingAttributes.push('width'); if (dir.height === undefined) missingAttributes.push('height'); if (missingAttributes.length > 0) { throw new _RuntimeError(2954 /* RuntimeErrorCode.REQUIRED_INPUT_MISSING */, `${imgDirectiveDetails(dir.ngSrc)} these required attributes ` + `are missing: ${missingAttributes.map((attr) => `"${attr}"`).join(', ')}. ` + `Including "width" and "height" attributes will prevent image-related layout shifts. ` + `To fix this, include "width" and "height" attributes on the image tag or turn on ` + `"fill" mode with the \`fill\` attribute.`); } } /** * Verifies that width and height are not set. Used in fill mode, where those attributes don't make * sense. */ function assertEmptyWidthAndHeight(dir) { if (dir.width || dir.height) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the attributes \`height\` and/or \`width\` are present ` + `along with the \`fill\` attribute. Because \`fill\` mode causes an image to fill its containing ` + `element, the size attributes have no effect and should be removed.`); } } /** * Verifies that the rendered image has a nonzero height. If the image is in fill mode, provides * guidance that this can be caused by the containing element's CSS position property. */ function assertNonZeroRenderedHeight(dir, img, renderer) { const callback = () => { removeLoadListenerFn(); removeErrorListenerFn(); const renderedHeight = img.clientHeight; if (dir.fill && renderedHeight === 0) { console.warn(_formatRuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the height of the fill-mode image is zero. ` + `This is likely because the containing element does not have the CSS 'position' ` + `property set to one of the following: "relative", "fixed", or "absolute". ` + `To fix this problem, make sure the container element has the CSS 'position' ` + `property defined and the height of the element is not zero.`)); } }; const removeLoadListenerFn = renderer.listen(img, 'load', callback); // See comments in the `assertNoImageDistortion`. const removeErrorListenerFn = renderer.listen(img, 'error', () => { removeLoadListenerFn(); removeErrorListenerFn(); }); callOnLoadIfImageIsLoaded(img, callback); } /** * Verifies that the `loading` attribute is set to a valid input & * is not used on priority images. */ function assertValidLoadingInput(dir) { if (dir.loading && dir.priority) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the \`loading\` attribute ` + `was used on an image that was marked "priority". ` + `Setting \`loading\` on priority images is not allowed ` + `because these images will always be eagerly loaded. ` + `To fix this, remove the “loading” attribute from the priority image.`); } const validInputs = ['auto', 'eager', 'lazy']; if (typeof dir.loading === 'string' && !validInputs.includes(dir.loading)) { throw new _RuntimeError(2952 /* RuntimeErrorCode.INVALID_INPUT */, `${imgDirectiveDetails(dir.ngSrc)} the \`loading\` attribute ` + `has an invalid value (\`${dir.loading}\`). ` + `To fix this, provide a valid value ("lazy", "eager", or "auto").`); } } /** * Warns if NOT using a loader (falling back to the generic loader) and * the image appears to be hosted on one of the image CDNs for which * we do have a built-in image loader. Suggests switching to the * built-in loader. * * @param ngSrc Value of the ngSrc attribute * @param imageLoader ImageLoader provided */ function assertNotMissingBuiltInLoader(ngSrc, imageLoader) { if (imageLoader === noopImageLoader) { let builtInLoaderName = ''; for (const loader of BUILT_IN_LOADERS) { if (loader.testUrl(ngSrc)) { builtInLoaderName = loader.name; break; } } if (builtInLoaderName) { console.warn(_formatRuntimeError(2962 /* RuntimeErrorCode.MISSING_BUILTIN_LOADER */, `NgOptimizedImage: It looks like your images may be hosted on the ` + `${builtInLoaderName} CDN, but your app is not using Angular's ` + `built-in loader for that CDN. We recommend switching to use ` + `the built-in by calling \`provide${builtInLoaderName}Loader()\` ` + `in your \`providers\` and passing it your instance's base URL. ` + `If you don't want to use the built-in loader, define a custom ` + `loader function using IMAGE_LOADER to silence this warning.`)); } } } /** * Warns if ngSrcset is present and no loader is configured (i.e. the default one is being used). */ function assertNoNgSrcsetWithoutLoader(dir, imageLoader) { if (dir.ngSrcset && imageLoader === noopImageLoader) { console.warn(_formatRuntimeError(2963 /* RuntimeErrorCode.MISSING_NECESSARY_LOADER */, `${imgDirectiveDetails(dir.ngSrc)} the \`ngSrcset\` attribute is present but ` + `no image loader is configured (i.e. the default one is being used), ` + `which would result in the same image being used for all configured sizes. ` + `To fix this, provide a loader or remove the \`ngSrcset\` attribute from the image.`)); } } /** * Warns if loaderParams is present and no loader is configured (i.e. the default one is being * used). */ function assertNoLoaderParamsWithoutLoader(dir, imageLoader) { if (dir.loaderParams && imageLoader === noopImageLoader) { console.warn(_formatRuntimeError(2963 /* RuntimeErrorCode.MISSING_NECESSARY_LOADER */, `${imgDirectiveDetails(dir.ngSrc)} the \`loaderParams\` attribute is present but ` + `no image loader is configured (i.e. the default one is being used), ` + `which means that the loaderParams data will not be consumed and will not affect the URL. ` + `To fix this, provide a custom loader or remove the \`loaderParams\` attribute from the image.`)); } } /** * Warns if the priority attribute is used too often on page load */ async function assetPriorityCountBelowThreshold(appRef) { if (IMGS_WITH_PRIORITY_ATTR_COUNT === 0) { IMGS_WITH_PRIORITY_ATTR_COUNT++; await appRef.whenStable(); if (IMGS_WITH_PRIORITY_ATTR_COUNT > PRIORITY_COUNT_THRESHOLD) { console.warn(_formatRuntimeError(2966 /* RuntimeErrorCode.TOO_MANY_PRIORITY_ATTRIBUTES */, `NgOptimizedImage: The "priority" attribute is set to true more than ${PRIORITY_COUNT_THRESHOLD} times (${IMGS_WITH_PRIORITY_ATTR_COUNT} times). ` + `Marking too many images as "high" priority can hurt your application's LCP (https://web.dev/lcp). ` + `"Priority" should only be set on the image expected to be the page's LCP element.`)); } } else { IMGS_WITH_PRIORITY_ATTR_COUNT++; } } /** * Warns if placeholder's dimension are over a threshold. * * This assert function is meant to only run on the browser. */ function assertPlaceholderDimensions(dir, imgElement) { const computedStyle = window.getComputedStyle(imgElement); let renderedWidth = parseFloat(computedStyle.getPropertyValue('width')); let renderedHeight = parseFloat(computedStyle.getPropertyValue('height')); if (renderedWidth > PLACEHOLDER_DIMENSION_LIMIT || renderedHeight > PLACEHOLDER_DIMENSION_LIMIT) { console.warn(_formatRuntimeError(2967 /* RuntimeErrorCode.PLACEHOLDER_DIMENSION_LIMIT_EXCEEDED */, `${imgDirectiveDetails(dir.ngSrc)} it uses a placeholder image, but at least one ` + `of the dimensions attribute (height or width) exceeds the limit of ${PLACEHOLDER_DIMENSION_LIMIT}px. ` + `To fix this, use a smaller image as a placeholder.`)); } } function callOnLoadIfImageIsLoaded(img, callback) { // https://html.spec.whatwg.org/multipage/embedded-content.html#dom-img-complete // The spec defines that `complete` is truthy once its request state is fully available. // The image may already be available if it’s loaded from the browser cache. // In that case, the `load` event will not fire at all, meaning that all setup // callbacks listening for the `load` event will not be invoked. // In Safari, there is a known behavior where the `complete` property of an // `HTMLImageElement` may sometimes return `true` even when the image is not fully loaded. // Checking both `img.complete` and `img.naturalWidth` is the most reliable way to // determine if an image has been fully loaded, especially in browsers where the // `complete` property may return `true` prematurely. if (img.complete && img.naturalWidth) { callback(); } } function round(input) { return Number.isInteger(input) ? input : input.toFixed(2); } // Transform function to handle SafeValue input for ngSrc. This doesn't do any sanitization, // as that is not needed for img.src and img.srcset. This transform is purely for compatibility. function unwrapSafeUrl(value) { if (typeof value === 'string') { return value; } return _unwrapSafeValue(value); } // Transform function to handle inputs which may be booleans, strings, or string representations // of boolean values. Used for the placeholder attribute. function booleanOrUrlAttribute(value) { if (typeof value === 'string' && value !== 'true' && value !== 'false' && value !== '') { return value; } return booleanAttribute(value); } export { DOCUMENT, IMAGE_LOADER, NgOptimizedImage, PRECONNECT_CHECK_BLOCKLIST, VERSION, ViewportScroller, isPlatformBrowser, provideCloudflareLoader, provideCloudinaryLoader, provideImageKitLoader, provideImgixLoader, provideNetlifyLoader, registerLocaleData, NullViewportScroller as ɵNullViewportScroller }; //# sourceMappingURL=common.mjs.map e㴤Fx{"version":3,"file":"common.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/locale_data.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/version.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/viewport_scroller.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/constants.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/url.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/image_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/cloudflare_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/cloudinary_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/imagekit_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/imgix_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/image_loaders/netlify_loader.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/error_helper.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/asserts.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/lcp_image_observer.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/preconnect_link_checker.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/tokens.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/preload-link-creator.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_optimized_image/ng_optimized_image.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {ɵregisterLocaleData} from '@angular/core';\n\n/**\n * Register global data to be used internally by Angular. See the\n * [\"I18n guide\"](guide/i18n/format-data-locale) to know how to import additional locale\n * data.\n *\n * The signature registerLocaleData(data: any, extraData?: any) is deprecated since v5.1\n *\n * @publicApi\n */\nexport function registerLocaleData(data: any, localeId?: string | any, extraData?: any): void {\n return ɵregisterLocaleData(data, localeId, extraData);\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n/**\n * @module\n * @description\n * Entry point for all public APIs of the common package.\n */\n\nimport {Version} from '@angular/core';\n\n/**\n * @publicApi\n */\nexport const VERSION = new Version('19.2.14');\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {inject, ɵɵdefineInjectable} from '@angular/core';\n\nimport {DOCUMENT} from './dom_tokens';\n\n/**\n * Defines a scroll position manager. Implemented by `BrowserViewportScroller`.\n *\n * @publicApi\n */\nexport abstract class ViewportScroller {\n // De-sugared tree-shakable injection\n // See #23917\n /** @nocollapse */\n static ɵprov = /** @pureOrBreakMyCode */ /* @__PURE__ */ ɵɵdefineInjectable({\n token: ViewportScroller,\n providedIn: 'root',\n factory: () =>\n typeof ngServerMode !== 'undefined' && ngServerMode\n ? new NullViewportScroller()\n : new BrowserViewportScroller(inject(DOCUMENT), window),\n });\n\n /**\n * Configures the top offset used when scrolling to an anchor.\n * @param offset A position in screen coordinates (a tuple with x and y values)\n * or a function that returns the top offset position.\n *\n */\n abstract setOffset(offset: [number, number] | (() => [number, number])): void;\n\n /**\n * Retrieves the current scroll position.\n * @returns A position in screen coordinates (a tuple with x and y values).\n */\n abstract getScrollPosition(): [number, number];\n\n /**\n * Scrolls to a specified position.\n * @param position A position in screen coordinates (a tuple with x and y values).\n */\n abstract scrollToPosition(position: [number, number]): void;\n\n /**\n * Scrolls to an anchor element.\n * @param anchor The ID of the anchor element.\n */\n abstract scrollToAnchor(anchor: string): void;\n\n /**\n * Disables automatic scroll restoration provided by the browser.\n * See also [window.history.scrollRestoration\n * info](https://developers.google.com/web/updates/2015/09/history-api-scroll-restoration).\n */\n abstract setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void;\n}\n\n/**\n * Manages the scroll position for a browser window.\n */\nexport class BrowserViewportScroller implements ViewportScroller {\n private offset: () => [number, number] = () => [0, 0];\n\n constructor(\n private document: Document,\n private window: Window,\n ) {}\n\n /**\n * Configures the top offset used when scrolling to an anchor.\n * @param offset A position in screen coordinates (a tuple with x and y values)\n * or a function that returns the top offset position.\n *\n */\n setOffset(offset: [number, number] | (() => [number, number])): void {\n if (Array.isArray(offset)) {\n this.offset = () => offset;\n } else {\n this.offset = offset;\n }\n }\n\n /**\n * Retrieves the current scroll position.\n * @returns The position in screen coordinates.\n */\n getScrollPosition(): [number, number] {\n return [this.window.scrollX, this.window.scrollY];\n }\n\n /**\n * Sets the scroll position.\n * @param position The new position in screen coordinates.\n */\n scrollToPosition(position: [number, number]): void {\n this.window.scrollTo(position[0], position[1]);\n }\n\n /**\n * Scrolls to an element and attempts to focus the element.\n *\n * Note that the function name here is misleading in that the target string may be an ID for a\n * non-anchor element.\n *\n * @param target The ID of an element or name of the anchor.\n *\n * @see https://html.spec.whatwg.org/#the-indicated-part-of-the-document\n * @see https://html.spec.whatwg.org/#scroll-to-fragid\n */\n scrollToAnchor(target: string): void {\n const elSelected = findAnchorFromDocument(this.document, target);\n\n if (elSelected) {\n this.scrollToElement(elSelected);\n // After scrolling to the element, the spec dictates that we follow the focus steps for the\n // target. Rather than following the robust steps, simply attempt focus.\n //\n // @see https://html.spec.whatwg.org/#get-the-focusable-area\n // @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLOrForeignElement/focus\n // @see https://html.spec.whatwg.org/#focusable-area\n elSelected.focus();\n }\n }\n\n /**\n * Disables automatic scroll restoration provided by the browser.\n */\n setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void {\n this.window.history.scrollRestoration = scrollRestoration;\n }\n\n /**\n * Scrolls to an element using the native offset and the specified offset set on this scroller.\n *\n * The offset can be used when we know that there is a floating header and scrolling naively to an\n * element (ex: `scrollIntoView`) leaves the element hidden behind the floating header.\n */\n private scrollToElement(el: HTMLElement): void {\n const rect = el.getBoundingClientRect();\n const left = rect.left + this.window.pageXOffset;\n const top = rect.top + this.window.pageYOffset;\n const offset = this.offset();\n this.window.scrollTo(left - offset[0], top - offset[1]);\n }\n}\n\nfunction findAnchorFromDocument(document: Document, target: string): HTMLElement | null {\n const documentResult = document.getElementById(target) || document.getElementsByName(target)[0];\n\n if (documentResult) {\n return documentResult;\n }\n\n // `getElementById` and `getElementsByName` won't pierce through the shadow DOM so we\n // have to traverse the DOM manually and do the lookup through the shadow roots.\n if (\n typeof document.createTreeWalker === 'function' &&\n document.body &&\n typeof document.body.attachShadow === 'function'\n ) {\n const treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT);\n let currentNode = treeWalker.currentNode as HTMLElement | null;\n\n while (currentNode) {\n const shadowRoot = currentNode.shadowRoot;\n\n if (shadowRoot) {\n // Note that `ShadowRoot` doesn't support `getElementsByName`\n // so we have to fall back to `querySelector`.\n const result =\n shadowRoot.getElementById(target) || shadowRoot.querySelector(`[name=\"${target}\"]`);\n if (result) {\n return result;\n }\n }\n\n currentNode = treeWalker.nextNode() as HTMLElement | null;\n }\n }\n\n return null;\n}\n\n/**\n * Provides an empty implementation of the viewport scroller.\n */\nexport class NullViewportScroller implements ViewportScroller {\n /**\n * Empty implementation\n */\n setOffset(offset: [number, number] | (() => [number, number])): void {}\n\n /**\n * Empty implementation\n */\n getScrollPosition(): [number, number] {\n return [0, 0];\n }\n\n /**\n * Empty implementation\n */\n scrollToPosition(position: [number, number]): void {}\n\n /**\n * Empty implementation\n */\n scrollToAnchor(anchor: string): void {}\n\n /**\n * Empty implementation\n */\n setHistoryScrollRestoration(scrollRestoration: 'auto' | 'manual'): void {}\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n/**\n * Value (out of 100) of the requested quality for placeholder images.\n */\nexport const PLACEHOLDER_QUALITY = '20';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n// Converts a string that represents a URL into a URL class instance.\nexport function getUrl(src: string, win: Window): URL {\n // Don't use a base URL is the URL is absolute.\n return isAbsoluteUrl(src) ? new URL(src) : new URL(src, win.location.href);\n}\n\n// Checks whether a URL is absolute (i.e. starts with `http://` or `https://`).\nexport function isAbsoluteUrl(src: string): boolean {\n return /^https?:\\/\\//.test(src);\n}\n\n// Given a URL, extract the hostname part.\n// If a URL is a relative one - the URL is returned as is.\nexport function extractHostname(url: string): string {\n return isAbsoluteUrl(url) ? new URL(url).hostname : url;\n}\n\nexport function isValidPath(path: unknown): boolean {\n const isString = typeof path === 'string';\n\n if (!isString || path.trim() === '') {\n return false;\n }\n\n // Calling new URL() will throw if the path string is malformed\n try {\n const url = new URL(path);\n return true;\n } catch {\n return false;\n }\n}\n\nexport function normalizePath(path: string): string {\n return path.endsWith('/') ? path.slice(0, -1) : path;\n}\n\nexport function normalizeSrc(src: string): string {\n return src.startsWith('/') ? src.slice(1) : src;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {InjectionToken, Provider, ɵRuntimeError as RuntimeError} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../../../errors';\nimport {isAbsoluteUrl, isValidPath, normalizePath, normalizeSrc} from '../url';\n\n/**\n * Config options recognized by the image loader function.\n *\n * @see {@link ImageLoader}\n * @see {@link NgOptimizedImage}\n * @publicApi\n */\nexport interface ImageLoaderConfig {\n /**\n * Image file name to be added to the image request URL.\n */\n src: string;\n /**\n * Width of the requested image (to be used when generating srcset).\n */\n width?: number;\n /**\n * Whether the loader should generate a URL for a small image placeholder instead of a full-sized\n * image.\n */\n isPlaceholder?: boolean;\n /**\n * Additional user-provided parameters for use by the ImageLoader.\n */\n loaderParams?: {[key: string]: any};\n}\n\n/**\n * Represents an image loader function. Image loader functions are used by the\n * NgOptimizedImage directive to produce full image URL based on the image name and its width.\n *\n * @publicApi\n */\nexport type ImageLoader = (config: ImageLoaderConfig) => string;\n\n/**\n * Noop image loader that does no transformation to the original src and just returns it as is.\n * This loader is used as a default one if more specific logic is not provided in an app config.\n *\n * @see {@link ImageLoader}\n * @see {@link NgOptimizedImage}\n */\nexport const noopImageLoader = (config: ImageLoaderConfig) => config.src;\n\n/**\n * Metadata about the image loader.\n */\nexport type ImageLoaderInfo = {\n name: string;\n testUrl: (url: string) => boolean;\n};\n\n/**\n * Injection token that configures the image loader function.\n *\n * @see {@link ImageLoader}\n * @see {@link NgOptimizedImage}\n * @publicApi\n */\nexport const IMAGE_LOADER = new InjectionToken(ngDevMode ? 'ImageLoader' : '', {\n providedIn: 'root',\n factory: () => noopImageLoader,\n});\n\n/**\n * Internal helper function that makes it easier to introduce custom image loaders for the\n * `NgOptimizedImage` directive. It is enough to specify a URL builder function to obtain full DI\n * configuration for a given loader: a DI token corresponding to the actual loader function, plus DI\n * tokens managing preconnect check functionality.\n * @param buildUrlFn a function returning a full URL based on loader's configuration\n * @param exampleUrls example of full URLs for a given loader (used in error messages)\n * @returns a set of DI providers corresponding to the configured image loader\n */\nexport function createImageLoader(\n buildUrlFn: (path: string, config: ImageLoaderConfig) => string,\n exampleUrls?: string[],\n) {\n return function provideImageLoader(path: string) {\n if (!isValidPath(path)) {\n throwInvalidPathError(path, exampleUrls || []);\n }\n\n // The trailing / is stripped (if provided) to make URL construction (concatenation) easier in\n // the individual loader functions.\n path = normalizePath(path);\n\n const loaderFn = (config: ImageLoaderConfig) => {\n if (isAbsoluteUrl(config.src)) {\n // Image loader functions expect an image file name (e.g. `my-image.png`)\n // or a relative path + a file name (e.g. `/a/b/c/my-image.png`) as an input,\n // so the final absolute URL can be constructed.\n // When an absolute URL is provided instead - the loader can not\n // build a final URL, thus the error is thrown to indicate that.\n throwUnexpectedAbsoluteUrlError(path, config.src);\n }\n\n return buildUrlFn(path, {...config, src: normalizeSrc(config.src)});\n };\n\n const providers: Provider[] = [{provide: IMAGE_LOADER, useValue: loaderFn}];\n return providers;\n };\n}\n\nfunction throwInvalidPathError(path: unknown, exampleUrls: string[]): never {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_LOADER_ARGUMENTS,\n ngDevMode &&\n `Image loader has detected an invalid path (\\`${path}\\`). ` +\n `To fix this, supply a path using one of the following formats: ${exampleUrls.join(\n ' or ',\n )}`,\n );\n}\n\nfunction throwUnexpectedAbsoluteUrlError(path: string, url: string): never {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_LOADER_ARGUMENTS,\n ngDevMode &&\n `Image loader has detected a \\`\\` tag with an invalid \\`ngSrc\\` attribute: ${url}. ` +\n `This image loader expects \\`ngSrc\\` to be a relative URL - ` +\n `however the provided value is an absolute URL. ` +\n `To fix this, provide \\`ngSrc\\` as a path relative to the base URL ` +\n `configured for this loader (\\`${path}\\`).`,\n );\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Provider} from '@angular/core';\nimport {PLACEHOLDER_QUALITY} from './constants';\nimport {createImageLoader, ImageLoaderConfig} from './image_loader';\n\n/**\n * Function that generates an ImageLoader for [Cloudflare Image\n * Resizing](https://developers.cloudflare.com/images/image-resizing/) and turns it into an Angular\n * provider. Note: Cloudflare has multiple image products - this provider is specifically for\n * Cloudflare Image Resizing; it will not work with Cloudflare Images or Cloudflare Polish.\n *\n * @param path Your domain name, e.g. https://mysite.com\n * @returns Provider that provides an ImageLoader function\n *\n * @publicApi\n */\nexport const provideCloudflareLoader: (path: string) => Provider[] = createImageLoader(\n createCloudflareUrl,\n ngDevMode ? ['https:///cdn-cgi/image//'] : undefined,\n);\n\nfunction createCloudflareUrl(path: string, config: ImageLoaderConfig) {\n let params = `format=auto`;\n if (config.width) {\n params += `,width=${config.width}`;\n }\n\n // When requesting a placeholder image we ask for a low quality image to reduce the load time.\n if (config.isPlaceholder) {\n params += `,quality=${PLACEHOLDER_QUALITY}`;\n }\n\n // Cloudflare image URLs format:\n // https://developers.cloudflare.com/images/image-resizing/url-format/\n return `${path}/cdn-cgi/image/${params}/${config.src}`;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Provider} from '@angular/core';\nimport {createImageLoader, ImageLoaderConfig, ImageLoaderInfo} from './image_loader';\n\n/**\n * Name and URL tester for Cloudinary.\n */\nexport const cloudinaryLoaderInfo: ImageLoaderInfo = {\n name: 'Cloudinary',\n testUrl: isCloudinaryUrl,\n};\n\nconst CLOUDINARY_LOADER_REGEX = /https?\\:\\/\\/[^\\/]+\\.cloudinary\\.com\\/.+/;\n/**\n * Tests whether a URL is from Cloudinary CDN.\n */\nfunction isCloudinaryUrl(url: string): boolean {\n return CLOUDINARY_LOADER_REGEX.test(url);\n}\n\n/**\n * Function that generates an ImageLoader for Cloudinary and turns it into an Angular provider.\n *\n * @param path Base URL of your Cloudinary images\n * This URL should match one of the following formats:\n * https://res.cloudinary.com/mysite\n * https://mysite.cloudinary.com\n * https://subdomain.mysite.com\n * @returns Set of providers to configure the Cloudinary loader.\n *\n * @publicApi\n */\nexport const provideCloudinaryLoader: (path: string) => Provider[] = createImageLoader(\n createCloudinaryUrl,\n ngDevMode\n ? [\n 'https://res.cloudinary.com/mysite',\n 'https://mysite.cloudinary.com',\n 'https://subdomain.mysite.com',\n ]\n : undefined,\n);\n\nfunction createCloudinaryUrl(path: string, config: ImageLoaderConfig) {\n // Cloudinary image URLformat:\n // https://cloudinary.com/documentation/image_transformations#transformation_url_structure\n // Example of a Cloudinary image URL:\n // https://res.cloudinary.com/mysite/image/upload/c_scale,f_auto,q_auto,w_600/marketing/tile-topics-m.png\n\n // For a placeholder image, we use the lowest image setting available to reduce the load time\n // else we use the auto size\n const quality = config.isPlaceholder ? 'q_auto:low' : 'q_auto';\n\n let params = `f_auto,${quality}`;\n if (config.width) {\n params += `,w_${config.width}`;\n }\n\n if (config.loaderParams?.['rounded']) {\n params += `,r_max`;\n }\n\n return `${path}/image/upload/${params}/${config.src}`;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Provider} from '@angular/core';\nimport {PLACEHOLDER_QUALITY} from './constants';\nimport {createImageLoader, ImageLoaderConfig, ImageLoaderInfo} from './image_loader';\n\n/**\n * Name and URL tester for ImageKit.\n */\nexport const imageKitLoaderInfo: ImageLoaderInfo = {\n name: 'ImageKit',\n testUrl: isImageKitUrl,\n};\n\nconst IMAGE_KIT_LOADER_REGEX = /https?\\:\\/\\/[^\\/]+\\.imagekit\\.io\\/.+/;\n/**\n * Tests whether a URL is from ImageKit CDN.\n */\nfunction isImageKitUrl(url: string): boolean {\n return IMAGE_KIT_LOADER_REGEX.test(url);\n}\n\n/**\n * Function that generates an ImageLoader for ImageKit and turns it into an Angular provider.\n *\n * @param path Base URL of your ImageKit images\n * This URL should match one of the following formats:\n * https://ik.imagekit.io/myaccount\n * https://subdomain.mysite.com\n * @returns Set of providers to configure the ImageKit loader.\n *\n * @publicApi\n */\nexport const provideImageKitLoader: (path: string) => Provider[] = createImageLoader(\n createImagekitUrl,\n ngDevMode ? ['https://ik.imagekit.io/mysite', 'https://subdomain.mysite.com'] : undefined,\n);\n\nexport function createImagekitUrl(path: string, config: ImageLoaderConfig): string {\n // Example of an ImageKit image URL:\n // https://ik.imagekit.io/demo/tr:w-300,h-300/medium_cafe_B1iTdD0C.jpg\n const {src, width} = config;\n const params: string[] = [];\n\n if (width) {\n params.push(`w-${width}`);\n }\n\n // When requesting a placeholder image we ask for a low quality image to reduce the load time.\n if (config.isPlaceholder) {\n params.push(`q-${PLACEHOLDER_QUALITY}`);\n }\n\n const urlSegments = params.length ? [path, `tr:${params.join(',')}`, src] : [path, src];\n const url = new URL(urlSegments.join('/'));\n return url.href;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Provider} from '@angular/core';\nimport {PLACEHOLDER_QUALITY} from './constants';\nimport {createImageLoader, ImageLoaderConfig, ImageLoaderInfo} from './image_loader';\n\n/**\n * Name and URL tester for Imgix.\n */\nexport const imgixLoaderInfo: ImageLoaderInfo = {\n name: 'Imgix',\n testUrl: isImgixUrl,\n};\n\nconst IMGIX_LOADER_REGEX = /https?\\:\\/\\/[^\\/]+\\.imgix\\.net\\/.+/;\n/**\n * Tests whether a URL is from Imgix CDN.\n */\nfunction isImgixUrl(url: string): boolean {\n return IMGIX_LOADER_REGEX.test(url);\n}\n\n/**\n * Function that generates an ImageLoader for Imgix and turns it into an Angular provider.\n *\n * @param path path to the desired Imgix origin,\n * e.g. https://somepath.imgix.net or https://images.mysite.com\n * @returns Set of providers to configure the Imgix loader.\n *\n * @publicApi\n */\nexport const provideImgixLoader: (path: string) => Provider[] = createImageLoader(\n createImgixUrl,\n ngDevMode ? ['https://somepath.imgix.net/'] : undefined,\n);\n\nfunction createImgixUrl(path: string, config: ImageLoaderConfig) {\n const url = new URL(`${path}/${config.src}`);\n // This setting ensures the smallest allowable format is set.\n url.searchParams.set('auto', 'format');\n if (config.width) {\n url.searchParams.set('w', config.width.toString());\n }\n\n // When requesting a placeholder image we ask a low quality image to reduce the load time.\n if (config.isPlaceholder) {\n url.searchParams.set('q', PLACEHOLDER_QUALITY);\n }\n return url.href;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Provider,\n ɵformatRuntimeError as formatRuntimeError,\n ɵRuntimeError as RuntimeError,\n} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../../../errors';\nimport {isAbsoluteUrl, isValidPath} from '../url';\n\nimport {IMAGE_LOADER, ImageLoaderConfig, ImageLoaderInfo} from './image_loader';\nimport {PLACEHOLDER_QUALITY} from './constants';\n\n/**\n * Name and URL tester for Netlify.\n */\nexport const netlifyLoaderInfo: ImageLoaderInfo = {\n name: 'Netlify',\n testUrl: isNetlifyUrl,\n};\n\nconst NETLIFY_LOADER_REGEX = /https?\\:\\/\\/[^\\/]+\\.netlify\\.app\\/.+/;\n\n/**\n * Tests whether a URL is from a Netlify site. This won't catch sites with a custom domain,\n * but it's a good start for sites in development. This is only used to warn users who haven't\n * configured an image loader.\n */\nfunction isNetlifyUrl(url: string): boolean {\n return NETLIFY_LOADER_REGEX.test(url);\n}\n\n/**\n * Function that generates an ImageLoader for Netlify and turns it into an Angular provider.\n *\n * @param path optional URL of the desired Netlify site. Defaults to the current site.\n * @returns Set of providers to configure the Netlify loader.\n *\n * @publicApi\n */\nexport function provideNetlifyLoader(path?: string) {\n if (path && !isValidPath(path)) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_LOADER_ARGUMENTS,\n ngDevMode &&\n `Image loader has detected an invalid path (\\`${path}\\`). ` +\n `To fix this, supply either the full URL to the Netlify site, or leave it empty to use the current site.`,\n );\n }\n\n if (path) {\n const url = new URL(path);\n path = url.origin;\n }\n\n const loaderFn = (config: ImageLoaderConfig) => {\n return createNetlifyUrl(config, path);\n };\n\n const providers: Provider[] = [{provide: IMAGE_LOADER, useValue: loaderFn}];\n return providers;\n}\n\nconst validParams = new Map([\n ['height', 'h'],\n ['fit', 'fit'],\n ['quality', 'q'],\n ['q', 'q'],\n ['position', 'position'],\n]);\n\nfunction createNetlifyUrl(config: ImageLoaderConfig, path?: string) {\n // Note: `path` can be undefined, in which case we use a fake one to construct a `URL` instance.\n const url = new URL(path ?? 'https://a/');\n url.pathname = '/.netlify/images';\n\n if (!isAbsoluteUrl(config.src) && !config.src.startsWith('/')) {\n config.src = '/' + config.src;\n }\n\n url.searchParams.set('url', config.src);\n\n if (config.width) {\n url.searchParams.set('w', config.width.toString());\n }\n\n // When requesting a placeholder image we ask for a low quality image to reduce the load time.\n // If the quality is specified in the loader config - always use provided value.\n const configQuality = config.loaderParams?.['quality'] ?? config.loaderParams?.['q'];\n if (config.isPlaceholder && !configQuality) {\n url.searchParams.set('q', PLACEHOLDER_QUALITY);\n }\n\n for (const [param, value] of Object.entries(config.loaderParams ?? {})) {\n if (validParams.has(param)) {\n url.searchParams.set(validParams.get(param)!, value.toString());\n } else {\n if (ngDevMode) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.INVALID_LOADER_ARGUMENTS,\n `The Netlify image loader has detected an \\`\\` tag with the unsupported attribute \"\\`${param}\\`\".`,\n ),\n );\n }\n }\n }\n // The \"a\" hostname is used for relative URLs, so we can remove it from the final URL.\n return url.hostname === 'a' ? url.href.replace(url.origin, '') : url.href;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n// Assembles directive details string, useful for error messages.\nexport function imgDirectiveDetails(ngSrc: string, includeNgSrc = true) {\n const ngSrcInfo = includeNgSrc\n ? `(activated on an element with the \\`ngSrc=\"${ngSrc}\"\\`) `\n : '';\n return `The NgOptimizedImage directive ${ngSrcInfo}has detected that`;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {ɵRuntimeError as RuntimeError} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../../errors';\n\n/**\n * Asserts that the application is in development mode. Throws an error if the application is in\n * production mode. This assert can be used to make sure that there is no dev-mode code invoked in\n * the prod mode accidentally.\n */\nexport function assertDevMode(checkName: string) {\n if (!ngDevMode) {\n throw new RuntimeError(\n RuntimeErrorCode.UNEXPECTED_DEV_MODE_CHECK_IN_PROD_MODE,\n `Unexpected invocation of the ${checkName} in the prod mode. ` +\n `Please make sure that the prod mode is enabled for production builds.`,\n );\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n inject,\n Injectable,\n OnDestroy,\n ɵformatRuntimeError as formatRuntimeError,\n PLATFORM_ID,\n} from '@angular/core';\n\nimport {DOCUMENT} from '../../dom_tokens';\nimport {RuntimeErrorCode} from '../../errors';\n\nimport {assertDevMode} from './asserts';\nimport {imgDirectiveDetails} from './error_helper';\nimport {getUrl} from './url';\nimport {isPlatformBrowser} from '../../platform_id';\n\ninterface ObservedImageState {\n priority: boolean;\n modified: boolean;\n alreadyWarnedPriority: boolean;\n alreadyWarnedModified: boolean;\n}\n\n/**\n * Observer that detects whether an image with `NgOptimizedImage`\n * is treated as a Largest Contentful Paint (LCP) element. If so,\n * asserts that the image has the `priority` attribute.\n *\n * Note: this is a dev-mode only class and it does not appear in prod bundles,\n * thus there is no `ngDevMode` use in the code.\n *\n * Based on https://web.dev/lcp/#measure-lcp-in-javascript.\n */\n@Injectable({providedIn: 'root'})\nexport class LCPImageObserver implements OnDestroy {\n // Map of full image URLs -> original `ngSrc` values.\n private images = new Map();\n\n private window: Window | null = null;\n private observer: PerformanceObserver | null = null;\n\n constructor() {\n const isBrowser = isPlatformBrowser(inject(PLATFORM_ID));\n assertDevMode('LCP checker');\n const win = inject(DOCUMENT).defaultView;\n if (isBrowser && typeof PerformanceObserver !== 'undefined') {\n this.window = win;\n this.observer = this.initPerformanceObserver();\n }\n }\n\n /**\n * Inits PerformanceObserver and subscribes to LCP events.\n * Based on https://web.dev/lcp/#measure-lcp-in-javascript\n */\n private initPerformanceObserver(): PerformanceObserver {\n const observer = new PerformanceObserver((entryList) => {\n const entries = entryList.getEntries();\n if (entries.length === 0) return;\n // We use the latest entry produced by the `PerformanceObserver` as the best\n // signal on which element is actually an LCP one. As an example, the first image to load on\n // a page, by virtue of being the only thing on the page so far, is often a LCP candidate\n // and gets reported by PerformanceObserver, but isn't necessarily the LCP element.\n const lcpElement = entries[entries.length - 1];\n\n // Cast to `any` due to missing `element` on the `LargestContentfulPaint` type of entry.\n // See https://developer.mozilla.org/en-US/docs/Web/API/LargestContentfulPaint\n const imgSrc = (lcpElement as any).element?.src ?? '';\n\n // Exclude `data:` and `blob:` URLs, since they are not supported by the directive.\n if (imgSrc.startsWith('data:') || imgSrc.startsWith('blob:')) return;\n\n const img = this.images.get(imgSrc);\n if (!img) return;\n if (!img.priority && !img.alreadyWarnedPriority) {\n img.alreadyWarnedPriority = true;\n logMissingPriorityError(imgSrc);\n }\n if (img.modified && !img.alreadyWarnedModified) {\n img.alreadyWarnedModified = true;\n logModifiedWarning(imgSrc);\n }\n });\n observer.observe({type: 'largest-contentful-paint', buffered: true});\n return observer;\n }\n\n registerImage(rewrittenSrc: string, originalNgSrc: string, isPriority: boolean) {\n if (!this.observer) return;\n const newObservedImageState: ObservedImageState = {\n priority: isPriority,\n modified: false,\n alreadyWarnedModified: false,\n alreadyWarnedPriority: false,\n };\n this.images.set(getUrl(rewrittenSrc, this.window!).href, newObservedImageState);\n }\n\n unregisterImage(rewrittenSrc: string) {\n if (!this.observer) return;\n this.images.delete(getUrl(rewrittenSrc, this.window!).href);\n }\n\n updateImage(originalSrc: string, newSrc: string) {\n if (!this.observer) return;\n const originalUrl = getUrl(originalSrc, this.window!).href;\n const img = this.images.get(originalUrl);\n if (img) {\n img.modified = true;\n this.images.set(getUrl(newSrc, this.window!).href, img);\n this.images.delete(originalUrl);\n }\n }\n\n ngOnDestroy() {\n if (!this.observer) return;\n this.observer.disconnect();\n this.images.clear();\n }\n}\n\nfunction logMissingPriorityError(ngSrc: string) {\n const directiveDetails = imgDirectiveDetails(ngSrc);\n console.error(\n formatRuntimeError(\n RuntimeErrorCode.LCP_IMG_MISSING_PRIORITY,\n `${directiveDetails} this image is the Largest Contentful Paint (LCP) ` +\n `element but was not marked \"priority\". This image should be marked ` +\n `\"priority\" in order to prioritize its loading. ` +\n `To fix this, add the \"priority\" attribute.`,\n ),\n );\n}\n\nfunction logModifiedWarning(ngSrc: string) {\n const directiveDetails = imgDirectiveDetails(ngSrc);\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.LCP_IMG_NGSRC_MODIFIED,\n `${directiveDetails} this image is the Largest Contentful Paint (LCP) ` +\n `element and has had its \"ngSrc\" attribute modified. This can cause ` +\n `slower loading performance. It is recommended not to modify the \"ngSrc\" ` +\n `property on any image which could be the LCP element.`,\n ),\n );\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n inject,\n Injectable,\n InjectionToken,\n ɵformatRuntimeError as formatRuntimeError,\n} from '@angular/core';\n\nimport {DOCUMENT} from '../../dom_tokens';\nimport {RuntimeErrorCode} from '../../errors';\n\nimport {assertDevMode} from './asserts';\nimport {imgDirectiveDetails} from './error_helper';\nimport {extractHostname, getUrl} from './url';\n\n// Set of origins that are always excluded from the preconnect checks.\nconst INTERNAL_PRECONNECT_CHECK_BLOCKLIST = new Set(['localhost', '127.0.0.1', '0.0.0.0']);\n\n/**\n * Injection token to configure which origins should be excluded\n * from the preconnect checks. It can either be a single string or an array of strings\n * to represent a group of origins, for example:\n *\n * ```ts\n * {provide: PRECONNECT_CHECK_BLOCKLIST, useValue: 'https://your-domain.com'}\n * ```\n *\n * or:\n *\n * ```ts\n * {provide: PRECONNECT_CHECK_BLOCKLIST,\n * useValue: ['https://your-domain-1.com', 'https://your-domain-2.com']}\n * ```\n *\n * @publicApi\n */\nexport const PRECONNECT_CHECK_BLOCKLIST = new InjectionToken>(\n ngDevMode ? 'PRECONNECT_CHECK_BLOCKLIST' : '',\n);\n\n/**\n * Contains the logic to detect whether an image, marked with the \"priority\" attribute\n * has a corresponding `` tag in the `document.head`.\n *\n * Note: this is a dev-mode only class, which should not appear in prod bundles,\n * thus there is no `ngDevMode` use in the code.\n */\n@Injectable({providedIn: 'root'})\nexport class PreconnectLinkChecker {\n private document = inject(DOCUMENT);\n\n /**\n * Set of tags found on this page.\n * The `null` value indicates that there was no DOM query operation performed.\n */\n private preconnectLinks: Set | null = null;\n\n /*\n * Keep track of all already seen origin URLs to avoid repeating the same check.\n */\n private alreadySeen = new Set();\n\n private window: Window | null = this.document.defaultView;\n\n private blocklist = new Set(INTERNAL_PRECONNECT_CHECK_BLOCKLIST);\n\n constructor() {\n assertDevMode('preconnect link checker');\n const blocklist = inject(PRECONNECT_CHECK_BLOCKLIST, {optional: true});\n if (blocklist) {\n this.populateBlocklist(blocklist);\n }\n }\n\n private populateBlocklist(origins: Array | string) {\n if (Array.isArray(origins)) {\n deepForEach(origins, (origin) => {\n this.blocklist.add(extractHostname(origin));\n });\n } else {\n this.blocklist.add(extractHostname(origins));\n }\n }\n\n /**\n * Checks that a preconnect resource hint exists in the head for the\n * given src.\n *\n * @param rewrittenSrc src formatted with loader\n * @param originalNgSrc ngSrc value\n */\n assertPreconnect(rewrittenSrc: string, originalNgSrc: string): void {\n if (typeof ngServerMode !== 'undefined' && ngServerMode) return;\n\n const imgUrl = getUrl(rewrittenSrc, this.window!);\n if (this.blocklist.has(imgUrl.hostname) || this.alreadySeen.has(imgUrl.origin)) return;\n\n // Register this origin as seen, so we don't check it again later.\n this.alreadySeen.add(imgUrl.origin);\n\n // Note: we query for preconnect links only *once* and cache the results\n // for the entire lifespan of an application, since it's unlikely that the\n // list would change frequently. This allows to make sure there are no\n // performance implications of making extra DOM lookups for each image.\n this.preconnectLinks ??= this.queryPreconnectLinks();\n\n if (!this.preconnectLinks.has(imgUrl.origin)) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.PRIORITY_IMG_MISSING_PRECONNECT_TAG,\n `${imgDirectiveDetails(originalNgSrc)} there is no preconnect tag present for this ` +\n `image. Preconnecting to the origin(s) that serve priority images ensures that these ` +\n `images are delivered as soon as possible. To fix this, please add the following ` +\n `element into the of the document:\\n` +\n ` `,\n ),\n );\n }\n }\n\n private queryPreconnectLinks(): Set {\n const preconnectUrls = new Set();\n const links = this.document.querySelectorAll('link[rel=preconnect]');\n for (const link of links) {\n const url = getUrl(link.href, this.window!);\n preconnectUrls.add(url.origin);\n }\n return preconnectUrls;\n }\n\n ngOnDestroy() {\n this.preconnectLinks?.clear();\n this.alreadySeen.clear();\n }\n}\n\n/**\n * Invokes a callback for each element in the array. Also invokes a callback\n * recursively for each nested array.\n */\nfunction deepForEach(input: (T | any[])[], fn: (value: T) => void): void {\n for (let value of input) {\n Array.isArray(value) ? deepForEach(value, fn) : fn(value);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {InjectionToken} from '@angular/core';\n\n/**\n * In SSR scenarios, a preload `` element is generated for priority images.\n * Having a large number of preload tags may negatively affect the performance,\n * so we warn developers (by throwing an error) if the number of preloaded images\n * is above a certain threshold. This const specifies this threshold.\n */\nexport const DEFAULT_PRELOADED_IMAGES_LIMIT = 5;\n\n/**\n * Helps to keep track of priority images that already have a corresponding\n * preload tag (to avoid generating multiple preload tags with the same URL).\n *\n * This Set tracks the original src passed into the `ngSrc` input not the src after it has been\n * run through the specified `IMAGE_LOADER`.\n */\nexport const PRELOADED_IMAGES = new InjectionToken>(\n typeof ngDevMode === 'undefined' || ngDevMode ? 'NG_OPTIMIZED_PRELOADED_IMAGES' : '',\n {\n providedIn: 'root',\n factory: () => new Set(),\n },\n);\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n inject,\n Injectable,\n Renderer2,\n ɵformatRuntimeError as formatRuntimeError,\n} from '@angular/core';\nimport {DOCUMENT} from '../../dom_tokens';\nimport {RuntimeErrorCode} from '../../errors';\n\nimport {DEFAULT_PRELOADED_IMAGES_LIMIT, PRELOADED_IMAGES} from './tokens';\n\n/**\n * @description Contains the logic needed to track and add preload link tags to the `` tag. It\n * will also track what images have already had preload link tags added so as to not duplicate link\n * tags.\n *\n * In dev mode this service will validate that the number of preloaded images does not exceed the\n * configured default preloaded images limit: {@link DEFAULT_PRELOADED_IMAGES_LIMIT}.\n */\n@Injectable({providedIn: 'root'})\nexport class PreloadLinkCreator {\n private readonly preloadedImages = inject(PRELOADED_IMAGES);\n private readonly document = inject(DOCUMENT);\n private errorShown = false;\n\n /**\n * @description Add a preload `` to the `` of the `index.html` that is served from the\n * server while using Angular Universal and SSR to kick off image loads for high priority images.\n *\n * The `sizes` (passed in from the user) and `srcset` (parsed and formatted from `ngSrcset`)\n * properties used to set the corresponding attributes, `imagesizes` and `imagesrcset`\n * respectively, on the preload `` tag so that the correctly sized image is preloaded from\n * the CDN.\n *\n * {@link https://web.dev/preload-responsive-images/#imagesrcset-and-imagesizes}\n *\n * @param renderer The `Renderer2` passed in from the directive\n * @param src The original src of the image that is set on the `ngSrc` input.\n * @param srcset The parsed and formatted srcset created from the `ngSrcset` input\n * @param sizes The value of the `sizes` attribute passed in to the `` tag\n */\n createPreloadLinkTag(renderer: Renderer2, src: string, srcset?: string, sizes?: string): void {\n if (\n ngDevMode &&\n !this.errorShown &&\n this.preloadedImages.size >= DEFAULT_PRELOADED_IMAGES_LIMIT\n ) {\n this.errorShown = true;\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.TOO_MANY_PRELOADED_IMAGES,\n `The \\`NgOptimizedImage\\` directive has detected that more than ` +\n `${DEFAULT_PRELOADED_IMAGES_LIMIT} images were marked as priority. ` +\n `This might negatively affect an overall performance of the page. ` +\n `To fix this, remove the \"priority\" attribute from images with less priority.`,\n ),\n );\n }\n\n if (this.preloadedImages.has(src)) {\n return;\n }\n\n this.preloadedImages.add(src);\n\n const preload = renderer.createElement('link');\n renderer.setAttribute(preload, 'as', 'image');\n renderer.setAttribute(preload, 'href', src);\n renderer.setAttribute(preload, 'rel', 'preload');\n renderer.setAttribute(preload, 'fetchpriority', 'high');\n\n if (sizes) {\n renderer.setAttribute(preload, 'imageSizes', sizes);\n }\n\n if (srcset) {\n renderer.setAttribute(preload, 'imageSrcset', srcset);\n }\n\n renderer.appendChild(this.document.head, preload);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n ApplicationRef,\n booleanAttribute,\n ChangeDetectorRef,\n DestroyRef,\n Directive,\n ElementRef,\n ɵformatRuntimeError as formatRuntimeError,\n ɵIMAGE_CONFIG as IMAGE_CONFIG,\n ɵIMAGE_CONFIG_DEFAULTS as IMAGE_CONFIG_DEFAULTS,\n ɵImageConfig as ImageConfig,\n inject,\n Injector,\n Input,\n NgZone,\n numberAttribute,\n OnChanges,\n OnInit,\n ɵperformanceMarkFeature as performanceMarkFeature,\n Renderer2,\n ɵRuntimeError as RuntimeError,\n ɵSafeValue as SafeValue,\n SimpleChanges,\n ɵunwrapSafeValue as unwrapSafeValue,\n} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../../errors';\n\nimport {imgDirectiveDetails} from './error_helper';\nimport {cloudinaryLoaderInfo} from './image_loaders/cloudinary_loader';\nimport {\n IMAGE_LOADER,\n ImageLoader,\n ImageLoaderConfig,\n noopImageLoader,\n} from './image_loaders/image_loader';\nimport {imageKitLoaderInfo} from './image_loaders/imagekit_loader';\nimport {imgixLoaderInfo} from './image_loaders/imgix_loader';\nimport {netlifyLoaderInfo} from './image_loaders/netlify_loader';\nimport {LCPImageObserver} from './lcp_image_observer';\nimport {PreconnectLinkChecker} from './preconnect_link_checker';\nimport {PreloadLinkCreator} from './preload-link-creator';\n\n/**\n * When a Base64-encoded image is passed as an input to the `NgOptimizedImage` directive,\n * an error is thrown. The image content (as a string) might be very long, thus making\n * it hard to read an error message if the entire string is included. This const defines\n * the number of characters that should be included into the error message. The rest\n * of the content is truncated.\n */\nconst BASE64_IMG_MAX_LENGTH_IN_ERROR = 50;\n\n/**\n * RegExpr to determine whether a src in a srcset is using width descriptors.\n * Should match something like: \"100w, 200w\".\n */\nconst VALID_WIDTH_DESCRIPTOR_SRCSET = /^((\\s*\\d+w\\s*(,|$)){1,})$/;\n\n/**\n * RegExpr to determine whether a src in a srcset is using density descriptors.\n * Should match something like: \"1x, 2x, 50x\". Also supports decimals like \"1.5x, 1.50x\".\n */\nconst VALID_DENSITY_DESCRIPTOR_SRCSET = /^((\\s*\\d+(\\.\\d+)?x\\s*(,|$)){1,})$/;\n\n/**\n * Srcset values with a density descriptor higher than this value will actively\n * throw an error. Such densities are not permitted as they cause image sizes\n * to be unreasonably large and slow down LCP.\n */\nexport const ABSOLUTE_SRCSET_DENSITY_CAP = 3;\n\n/**\n * Used only in error message text to communicate best practices, as we will\n * only throw based on the slightly more conservative ABSOLUTE_SRCSET_DENSITY_CAP.\n */\nexport const RECOMMENDED_SRCSET_DENSITY_CAP = 2;\n\n/**\n * Used in generating automatic density-based srcsets\n */\nconst DENSITY_SRCSET_MULTIPLIERS = [1, 2];\n\n/**\n * Used to determine which breakpoints to use on full-width images\n */\nconst VIEWPORT_BREAKPOINT_CUTOFF = 640;\n/**\n * Used to determine whether two aspect ratios are similar in value.\n */\nconst ASPECT_RATIO_TOLERANCE = 0.1;\n\n/**\n * Used to determine whether the image has been requested at an overly\n * large size compared to the actual rendered image size (after taking\n * into account a typical device pixel ratio). In pixels.\n */\nconst OVERSIZED_IMAGE_TOLERANCE = 1000;\n\n/**\n * Used to limit automatic srcset generation of very large sources for\n * fixed-size images. In pixels.\n */\nconst FIXED_SRCSET_WIDTH_LIMIT = 1920;\nconst FIXED_SRCSET_HEIGHT_LIMIT = 1080;\n\n/**\n * Default blur radius of the CSS filter used on placeholder images, in pixels\n */\nexport const PLACEHOLDER_BLUR_AMOUNT = 15;\n\n/**\n * Placeholder dimension (height or width) limit in pixels. Angular produces a warning\n * when this limit is crossed.\n */\nconst PLACEHOLDER_DIMENSION_LIMIT = 1000;\n\n/**\n * Used to warn or error when the user provides an overly large dataURL for the placeholder\n * attribute.\n * Character count of Base64 images is 1 character per byte, and base64 encoding is approximately\n * 33% larger than base images, so 4000 characters is around 3KB on disk and 10000 characters is\n * around 7.7KB. Experimentally, 4000 characters is about 20x20px in PNG or medium-quality JPEG\n * format, and 10,000 is around 50x50px, but there's quite a bit of variation depending on how the\n * image is saved.\n */\nexport const DATA_URL_WARN_LIMIT = 4000;\nexport const DATA_URL_ERROR_LIMIT = 10000;\n\n/** Info about built-in loaders we can test for. */\nexport const BUILT_IN_LOADERS = [\n imgixLoaderInfo,\n imageKitLoaderInfo,\n cloudinaryLoaderInfo,\n netlifyLoaderInfo,\n];\n\n/**\n * Threshold for the PRIORITY_TRUE_COUNT\n */\nconst PRIORITY_COUNT_THRESHOLD = 10;\n\n/**\n * This count is used to log a devMode warning\n * when the count of directive instances with priority=true\n * exceeds the threshold PRIORITY_COUNT_THRESHOLD\n */\nlet IMGS_WITH_PRIORITY_ATTR_COUNT = 0;\n\n/**\n * This function is for testing purpose.\n */\nexport function resetImagePriorityCount() {\n IMGS_WITH_PRIORITY_ATTR_COUNT = 0;\n}\n\n/**\n * Config options used in rendering placeholder images.\n *\n * @see {@link NgOptimizedImage}\n * @publicApi\n */\nexport interface ImagePlaceholderConfig {\n blur?: boolean;\n}\n\n/**\n * Directive that improves image loading performance by enforcing best practices.\n *\n * `NgOptimizedImage` ensures that the loading of the Largest Contentful Paint (LCP) image is\n * prioritized by:\n * - Automatically setting the `fetchpriority` attribute on the `` tag\n * - Lazy loading non-priority images by default\n * - Automatically generating a preconnect link tag in the document head\n *\n * In addition, the directive:\n * - Generates appropriate asset URLs if a corresponding `ImageLoader` function is provided\n * - Automatically generates a srcset\n * - Requires that `width` and `height` are set\n * - Warns if `width` or `height` have been set incorrectly\n * - Warns if the image will be visually distorted when rendered\n *\n * @usageNotes\n * The `NgOptimizedImage` directive is marked as [standalone](guide/components/importing) and can\n * be imported directly.\n *\n * Follow the steps below to enable and use the directive:\n * 1. Import it into the necessary NgModule or a standalone Component.\n * 2. Optionally provide an `ImageLoader` if you use an image hosting service.\n * 3. Update the necessary `` tags in templates and replace `src` attributes with `ngSrc`.\n * Using a `ngSrc` allows the directive to control when the `src` gets set, which triggers an image\n * download.\n *\n * Step 1: import the `NgOptimizedImage` directive.\n *\n * ```ts\n * import { NgOptimizedImage } from '@angular/common';\n *\n * // Include it into the necessary NgModule\n * @NgModule({\n * imports: [NgOptimizedImage],\n * })\n * class AppModule {}\n *\n * // ... or a standalone Component\n * @Component({\n * imports: [NgOptimizedImage],\n * })\n * class MyStandaloneComponent {}\n * ```\n *\n * Step 2: configure a loader.\n *\n * To use the **default loader**: no additional code changes are necessary. The URL returned by the\n * generic loader will always match the value of \"src\". In other words, this loader applies no\n * transformations to the resource URL and the value of the `ngSrc` attribute will be used as is.\n *\n * To use an existing loader for a **third-party image service**: add the provider factory for your\n * chosen service to the `providers` array. In the example below, the Imgix loader is used:\n *\n * ```ts\n * import {provideImgixLoader} from '@angular/common';\n *\n * // Call the function and add the result to the `providers` array:\n * providers: [\n * provideImgixLoader(\"https://my.base.url/\"),\n * ],\n * ```\n *\n * The `NgOptimizedImage` directive provides the following functions:\n * - `provideCloudflareLoader`\n * - `provideCloudinaryLoader`\n * - `provideImageKitLoader`\n * - `provideImgixLoader`\n *\n * If you use a different image provider, you can create a custom loader function as described\n * below.\n *\n * To use a **custom loader**: provide your loader function as a value for the `IMAGE_LOADER` DI\n * token.\n *\n * ```ts\n * import {IMAGE_LOADER, ImageLoaderConfig} from '@angular/common';\n *\n * // Configure the loader using the `IMAGE_LOADER` token.\n * providers: [\n * {\n * provide: IMAGE_LOADER,\n * useValue: (config: ImageLoaderConfig) => {\n * return `https://example.com/${config.src}-${config.width}.jpg`;\n * }\n * },\n * ],\n * ```\n *\n * Step 3: update `` tags in templates to use `ngSrc` instead of `src`.\n *\n * ```html\n * \n * ```\n *\n * @publicApi\n */\n@Directive({\n selector: 'img[ngSrc]',\n host: {\n '[style.position]': 'fill ? \"absolute\" : null',\n '[style.width]': 'fill ? \"100%\" : null',\n '[style.height]': 'fill ? \"100%\" : null',\n '[style.inset]': 'fill ? \"0\" : null',\n '[style.background-size]': 'placeholder ? \"cover\" : null',\n '[style.background-position]': 'placeholder ? \"50% 50%\" : null',\n '[style.background-repeat]': 'placeholder ? \"no-repeat\" : null',\n '[style.background-image]': 'placeholder ? generatePlaceholder(placeholder) : null',\n '[style.filter]': `placeholder && shouldBlurPlaceholder(placeholderConfig) ? \"blur(${PLACEHOLDER_BLUR_AMOUNT}px)\" : null`,\n },\n})\nexport class NgOptimizedImage implements OnInit, OnChanges {\n private imageLoader = inject(IMAGE_LOADER);\n private config: ImageConfig = processConfig(inject(IMAGE_CONFIG));\n private renderer = inject(Renderer2);\n private imgElement: HTMLImageElement = inject(ElementRef).nativeElement;\n private injector = inject(Injector);\n\n // An LCP image observer should be injected only in development mode.\n // Do not assign it to `null` to avoid having a redundant property in the production bundle.\n private lcpObserver?: LCPImageObserver;\n\n /**\n * Calculate the rewritten `src` once and store it.\n * This is needed to avoid repetitive calculations and make sure the directive cleanup in the\n * `ngOnDestroy` does not rely on the `IMAGE_LOADER` logic (which in turn can rely on some other\n * instance that might be already destroyed).\n */\n private _renderedSrc: string | null = null;\n\n /**\n * Name of the source image.\n * Image name will be processed by the image loader and the final URL will be applied as the `src`\n * property of the image.\n */\n @Input({required: true, transform: unwrapSafeUrl}) ngSrc!: string;\n\n /**\n * A comma separated list of width or density descriptors.\n * The image name will be taken from `ngSrc` and combined with the list of width or density\n * descriptors to generate the final `srcset` property of the image.\n *\n * Example:\n * ```html\n * =>\n * \n * ```\n */\n @Input() ngSrcset!: string;\n\n /**\n * The base `sizes` attribute passed through to the `` element.\n * Providing sizes causes the image to create an automatic responsive srcset.\n */\n @Input() sizes?: string;\n\n /**\n * For responsive images: the intrinsic width of the image in pixels.\n * For fixed size images: the desired rendered width of the image in pixels.\n */\n @Input({transform: numberAttribute}) width: number | undefined;\n\n /**\n * For responsive images: the intrinsic height of the image in pixels.\n * For fixed size images: the desired rendered height of the image in pixels.\n */\n @Input({transform: numberAttribute}) height: number | undefined;\n\n /**\n * The desired loading behavior (lazy, eager, or auto). Defaults to `lazy`,\n * which is recommended for most images.\n *\n * Warning: Setting images as loading=\"eager\" or loading=\"auto\" marks them\n * as non-priority images and can hurt loading performance. For images which\n * may be the LCP element, use the `priority` attribute instead of `loading`.\n */\n @Input() loading?: 'lazy' | 'eager' | 'auto';\n\n /**\n * Indicates whether this image should have a high priority.\n */\n @Input({transform: booleanAttribute}) priority = false;\n\n /**\n * Data to pass through to custom loaders.\n */\n @Input() loaderParams?: {[key: string]: any};\n\n /**\n * Disables automatic srcset generation for this image.\n */\n @Input({transform: booleanAttribute}) disableOptimizedSrcset = false;\n\n /**\n * Sets the image to \"fill mode\", which eliminates the height/width requirement and adds\n * styles such that the image fills its containing element.\n */\n @Input({transform: booleanAttribute}) fill = false;\n\n /**\n * A URL or data URL for an image to be used as a placeholder while this image loads.\n */\n @Input({transform: booleanOrUrlAttribute}) placeholder?: string | boolean;\n\n /**\n * Configuration object for placeholder settings. Options:\n * * blur: Setting this to false disables the automatic CSS blur.\n */\n @Input() placeholderConfig?: ImagePlaceholderConfig;\n\n /**\n * Value of the `src` attribute if set on the host `` element.\n * This input is exclusively read to assert that `src` is not set in conflict\n * with `ngSrc` and that images don't start to load until a lazy loading strategy is set.\n * @internal\n */\n @Input() src?: string;\n\n /**\n * Value of the `srcset` attribute if set on the host `` element.\n * This input is exclusively read to assert that `srcset` is not set in conflict\n * with `ngSrcset` and that images don't start to load until a lazy loading strategy is set.\n * @internal\n */\n @Input() srcset?: string;\n\n constructor() {\n if (ngDevMode) {\n this.lcpObserver = this.injector.get(LCPImageObserver);\n\n // Using `DestroyRef` to avoid having an empty `ngOnDestroy` method since this\n // is only run in development mode.\n const destroyRef = inject(DestroyRef);\n destroyRef.onDestroy(() => {\n if (!this.priority && this._renderedSrc !== null) {\n this.lcpObserver!.unregisterImage(this._renderedSrc);\n }\n });\n }\n }\n\n /** @docs-private */\n ngOnInit() {\n performanceMarkFeature('NgOptimizedImage');\n\n if (ngDevMode) {\n const ngZone = this.injector.get(NgZone);\n assertNonEmptyInput(this, 'ngSrc', this.ngSrc);\n assertValidNgSrcset(this, this.ngSrcset);\n assertNoConflictingSrc(this);\n if (this.ngSrcset) {\n assertNoConflictingSrcset(this);\n }\n assertNotBase64Image(this);\n assertNotBlobUrl(this);\n if (this.fill) {\n assertEmptyWidthAndHeight(this);\n // This leaves the Angular zone to avoid triggering unnecessary change detection cycles when\n // `load` tasks are invoked on images.\n ngZone.runOutsideAngular(() =>\n assertNonZeroRenderedHeight(this, this.imgElement, this.renderer),\n );\n } else {\n assertNonEmptyWidthAndHeight(this);\n if (this.height !== undefined) {\n assertGreaterThanZero(this, this.height, 'height');\n }\n if (this.width !== undefined) {\n assertGreaterThanZero(this, this.width, 'width');\n }\n // Only check for distorted images when not in fill mode, where\n // images may be intentionally stretched, cropped or letterboxed.\n ngZone.runOutsideAngular(() =>\n assertNoImageDistortion(this, this.imgElement, this.renderer),\n );\n }\n assertValidLoadingInput(this);\n if (!this.ngSrcset) {\n assertNoComplexSizes(this);\n }\n assertValidPlaceholder(this, this.imageLoader);\n assertNotMissingBuiltInLoader(this.ngSrc, this.imageLoader);\n assertNoNgSrcsetWithoutLoader(this, this.imageLoader);\n assertNoLoaderParamsWithoutLoader(this, this.imageLoader);\n\n ngZone.runOutsideAngular(() => {\n this.lcpObserver!.registerImage(this.getRewrittenSrc(), this.ngSrc, this.priority);\n });\n\n if (this.priority) {\n const checker = this.injector.get(PreconnectLinkChecker);\n checker.assertPreconnect(this.getRewrittenSrc(), this.ngSrc);\n\n if (typeof ngServerMode !== 'undefined' && !ngServerMode) {\n const applicationRef = this.injector.get(ApplicationRef);\n assetPriorityCountBelowThreshold(applicationRef);\n }\n }\n }\n if (this.placeholder) {\n this.removePlaceholderOnLoad(this.imgElement);\n }\n this.setHostAttributes();\n }\n\n private setHostAttributes() {\n // Must set width/height explicitly in case they are bound (in which case they will\n // only be reflected and not found by the browser)\n if (this.fill) {\n this.sizes ||= '100vw';\n } else {\n this.setHostAttribute('width', this.width!.toString());\n this.setHostAttribute('height', this.height!.toString());\n }\n\n this.setHostAttribute('loading', this.getLoadingBehavior());\n this.setHostAttribute('fetchpriority', this.getFetchPriority());\n\n // The `data-ng-img` attribute flags an image as using the directive, to allow\n // for analysis of the directive's performance.\n this.setHostAttribute('ng-img', 'true');\n\n // The `src` and `srcset` attributes should be set last since other attributes\n // could affect the image's loading behavior.\n const rewrittenSrcset = this.updateSrcAndSrcset();\n\n if (this.sizes) {\n if (this.getLoadingBehavior() === 'lazy') {\n this.setHostAttribute('sizes', 'auto, ' + this.sizes);\n } else {\n this.setHostAttribute('sizes', this.sizes);\n }\n } else {\n if (\n this.ngSrcset &&\n VALID_WIDTH_DESCRIPTOR_SRCSET.test(this.ngSrcset) &&\n this.getLoadingBehavior() === 'lazy'\n ) {\n this.setHostAttribute('sizes', 'auto, 100vw');\n }\n }\n\n if (typeof ngServerMode !== 'undefined' && ngServerMode && this.priority) {\n const preloadLinkCreator = this.injector.get(PreloadLinkCreator);\n preloadLinkCreator.createPreloadLinkTag(\n this.renderer,\n this.getRewrittenSrc(),\n rewrittenSrcset,\n this.sizes,\n );\n }\n }\n\n /** @docs-private */\n ngOnChanges(changes: SimpleChanges) {\n if (ngDevMode) {\n assertNoPostInitInputChange(this, changes, [\n 'ngSrcset',\n 'width',\n 'height',\n 'priority',\n 'fill',\n 'loading',\n 'sizes',\n 'loaderParams',\n 'disableOptimizedSrcset',\n ]);\n }\n if (changes['ngSrc'] && !changes['ngSrc'].isFirstChange()) {\n const oldSrc = this._renderedSrc;\n this.updateSrcAndSrcset(true);\n\n if (ngDevMode) {\n const newSrc = this._renderedSrc;\n if (oldSrc && newSrc && oldSrc !== newSrc) {\n const ngZone = this.injector.get(NgZone);\n ngZone.runOutsideAngular(() => {\n this.lcpObserver!.updateImage(oldSrc, newSrc);\n });\n }\n }\n }\n\n if (\n ngDevMode &&\n changes['placeholder']?.currentValue &&\n typeof ngServerMode !== 'undefined' &&\n !ngServerMode\n ) {\n assertPlaceholderDimensions(this, this.imgElement);\n }\n }\n\n private callImageLoader(\n configWithoutCustomParams: Omit,\n ): string {\n let augmentedConfig: ImageLoaderConfig = configWithoutCustomParams;\n if (this.loaderParams) {\n augmentedConfig.loaderParams = this.loaderParams;\n }\n return this.imageLoader(augmentedConfig);\n }\n\n private getLoadingBehavior(): string {\n if (!this.priority && this.loading !== undefined) {\n return this.loading;\n }\n return this.priority ? 'eager' : 'lazy';\n }\n\n private getFetchPriority(): string {\n return this.priority ? 'high' : 'auto';\n }\n\n private getRewrittenSrc(): string {\n // ImageLoaderConfig supports setting a width property. However, we're not setting width here\n // because if the developer uses rendered width instead of intrinsic width in the HTML width\n // attribute, the image requested may be too small for 2x+ screens.\n if (!this._renderedSrc) {\n const imgConfig = {src: this.ngSrc};\n // Cache calculated image src to reuse it later in the code.\n this._renderedSrc = this.callImageLoader(imgConfig);\n }\n return this._renderedSrc;\n }\n\n private getRewrittenSrcset(): string {\n const widthSrcSet = VALID_WIDTH_DESCRIPTOR_SRCSET.test(this.ngSrcset);\n const finalSrcs = this.ngSrcset\n .split(',')\n .filter((src) => src !== '')\n .map((srcStr) => {\n srcStr = srcStr.trim();\n const width = widthSrcSet ? parseFloat(srcStr) : parseFloat(srcStr) * this.width!;\n return `${this.callImageLoader({src: this.ngSrc, width})} ${srcStr}`;\n });\n return finalSrcs.join(', ');\n }\n\n private getAutomaticSrcset(): string {\n if (this.sizes) {\n return this.getResponsiveSrcset();\n } else {\n return this.getFixedSrcset();\n }\n }\n\n private getResponsiveSrcset(): string {\n const {breakpoints} = this.config;\n\n let filteredBreakpoints = breakpoints!;\n if (this.sizes?.trim() === '100vw') {\n // Since this is a full-screen-width image, our srcset only needs to include\n // breakpoints with full viewport widths.\n filteredBreakpoints = breakpoints!.filter((bp) => bp >= VIEWPORT_BREAKPOINT_CUTOFF);\n }\n\n const finalSrcs = filteredBreakpoints.map(\n (bp) => `${this.callImageLoader({src: this.ngSrc, width: bp})} ${bp}w`,\n );\n return finalSrcs.join(', ');\n }\n\n private updateSrcAndSrcset(forceSrcRecalc = false): string | undefined {\n if (forceSrcRecalc) {\n // Reset cached value, so that the followup `getRewrittenSrc()` call\n // will recalculate it and update the cache.\n this._renderedSrc = null;\n }\n\n const rewrittenSrc = this.getRewrittenSrc();\n this.setHostAttribute('src', rewrittenSrc);\n\n let rewrittenSrcset: string | undefined = undefined;\n if (this.ngSrcset) {\n rewrittenSrcset = this.getRewrittenSrcset();\n } else if (this.shouldGenerateAutomaticSrcset()) {\n rewrittenSrcset = this.getAutomaticSrcset();\n }\n\n if (rewrittenSrcset) {\n this.setHostAttribute('srcset', rewrittenSrcset);\n }\n return rewrittenSrcset;\n }\n\n private getFixedSrcset(): string {\n const finalSrcs = DENSITY_SRCSET_MULTIPLIERS.map(\n (multiplier) =>\n `${this.callImageLoader({\n src: this.ngSrc,\n width: this.width! * multiplier,\n })} ${multiplier}x`,\n );\n return finalSrcs.join(', ');\n }\n\n private shouldGenerateAutomaticSrcset(): boolean {\n let oversizedImage = false;\n if (!this.sizes) {\n oversizedImage =\n this.width! > FIXED_SRCSET_WIDTH_LIMIT || this.height! > FIXED_SRCSET_HEIGHT_LIMIT;\n }\n return (\n !this.disableOptimizedSrcset &&\n !this.srcset &&\n this.imageLoader !== noopImageLoader &&\n !oversizedImage\n );\n }\n\n /**\n * Returns an image url formatted for use with the CSS background-image property. Expects one of:\n * * A base64 encoded image, which is wrapped and passed through.\n * * A boolean. If true, calls the image loader to generate a small placeholder url.\n */\n private generatePlaceholder(placeholderInput: string | boolean): string | boolean | null {\n const {placeholderResolution} = this.config;\n if (placeholderInput === true) {\n return `url(${this.callImageLoader({\n src: this.ngSrc,\n width: placeholderResolution,\n isPlaceholder: true,\n })})`;\n } else if (typeof placeholderInput === 'string') {\n return `url(${placeholderInput})`;\n }\n return null;\n }\n\n /**\n * Determines if blur should be applied, based on an optional boolean\n * property `blur` within the optional configuration object `placeholderConfig`.\n */\n private shouldBlurPlaceholder(placeholderConfig?: ImagePlaceholderConfig): boolean {\n if (!placeholderConfig || !placeholderConfig.hasOwnProperty('blur')) {\n return true;\n }\n return Boolean(placeholderConfig.blur);\n }\n\n private removePlaceholderOnLoad(img: HTMLImageElement): void {\n const callback = () => {\n const changeDetectorRef = this.injector.get(ChangeDetectorRef);\n removeLoadListenerFn();\n removeErrorListenerFn();\n this.placeholder = false;\n changeDetectorRef.markForCheck();\n };\n\n const removeLoadListenerFn = this.renderer.listen(img, 'load', callback);\n const removeErrorListenerFn = this.renderer.listen(img, 'error', callback);\n\n callOnLoadIfImageIsLoaded(img, callback);\n }\n\n private setHostAttribute(name: string, value: string): void {\n this.renderer.setAttribute(this.imgElement, name, value);\n }\n}\n\n/***** Helpers *****/\n\n/**\n * Sorts provided config breakpoints and uses defaults.\n */\nfunction processConfig(config: ImageConfig): ImageConfig {\n let sortedBreakpoints: {breakpoints?: number[]} = {};\n if (config.breakpoints) {\n sortedBreakpoints.breakpoints = config.breakpoints.sort((a, b) => a - b);\n }\n return Object.assign({}, IMAGE_CONFIG_DEFAULTS, config, sortedBreakpoints);\n}\n\n/***** Assert functions *****/\n\n/**\n * Verifies that there is no `src` set on a host element.\n */\nfunction assertNoConflictingSrc(dir: NgOptimizedImage) {\n if (dir.src) {\n throw new RuntimeError(\n RuntimeErrorCode.UNEXPECTED_SRC_ATTR,\n `${imgDirectiveDetails(dir.ngSrc)} both \\`src\\` and \\`ngSrc\\` have been set. ` +\n `Supplying both of these attributes breaks lazy loading. ` +\n `The NgOptimizedImage directive sets \\`src\\` itself based on the value of \\`ngSrc\\`. ` +\n `To fix this, please remove the \\`src\\` attribute.`,\n );\n }\n}\n\n/**\n * Verifies that there is no `srcset` set on a host element.\n */\nfunction assertNoConflictingSrcset(dir: NgOptimizedImage) {\n if (dir.srcset) {\n throw new RuntimeError(\n RuntimeErrorCode.UNEXPECTED_SRCSET_ATTR,\n `${imgDirectiveDetails(dir.ngSrc)} both \\`srcset\\` and \\`ngSrcset\\` have been set. ` +\n `Supplying both of these attributes breaks lazy loading. ` +\n `The NgOptimizedImage directive sets \\`srcset\\` itself based on the value of ` +\n `\\`ngSrcset\\`. To fix this, please remove the \\`srcset\\` attribute.`,\n );\n }\n}\n\n/**\n * Verifies that the `ngSrc` is not a Base64-encoded image.\n */\nfunction assertNotBase64Image(dir: NgOptimizedImage) {\n let ngSrc = dir.ngSrc.trim();\n if (ngSrc.startsWith('data:')) {\n if (ngSrc.length > BASE64_IMG_MAX_LENGTH_IN_ERROR) {\n ngSrc = ngSrc.substring(0, BASE64_IMG_MAX_LENGTH_IN_ERROR) + '...';\n }\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc, false)} \\`ngSrc\\` is a Base64-encoded string ` +\n `(${ngSrc}). NgOptimizedImage does not support Base64-encoded strings. ` +\n `To fix this, disable the NgOptimizedImage directive for this element ` +\n `by removing \\`ngSrc\\` and using a standard \\`src\\` attribute instead.`,\n );\n }\n}\n\n/**\n * Verifies that the 'sizes' only includes responsive values.\n */\nfunction assertNoComplexSizes(dir: NgOptimizedImage) {\n let sizes = dir.sizes;\n if (sizes?.match(/((\\)|,)\\s|^)\\d+px/)) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc, false)} \\`sizes\\` was set to a string including ` +\n `pixel values. For automatic \\`srcset\\` generation, \\`sizes\\` must only include responsive ` +\n `values, such as \\`sizes=\"50vw\"\\` or \\`sizes=\"(min-width: 768px) 50vw, 100vw\"\\`. ` +\n `To fix this, modify the \\`sizes\\` attribute, or provide your own \\`ngSrcset\\` value directly.`,\n );\n }\n}\n\nfunction assertValidPlaceholder(dir: NgOptimizedImage, imageLoader: ImageLoader) {\n assertNoPlaceholderConfigWithoutPlaceholder(dir);\n assertNoRelativePlaceholderWithoutLoader(dir, imageLoader);\n assertNoOversizedDataUrl(dir);\n}\n\n/**\n * Verifies that placeholderConfig isn't being used without placeholder\n */\nfunction assertNoPlaceholderConfigWithoutPlaceholder(dir: NgOptimizedImage) {\n if (dir.placeholderConfig && !dir.placeholder) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(\n dir.ngSrc,\n false,\n )} \\`placeholderConfig\\` options were provided for an ` +\n `image that does not use the \\`placeholder\\` attribute, and will have no effect.`,\n );\n }\n}\n\n/**\n * Warns if a relative URL placeholder is specified, but no loader is present to provide the small\n * image.\n */\nfunction assertNoRelativePlaceholderWithoutLoader(dir: NgOptimizedImage, imageLoader: ImageLoader) {\n if (dir.placeholder === true && imageLoader === noopImageLoader) {\n throw new RuntimeError(\n RuntimeErrorCode.MISSING_NECESSARY_LOADER,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`placeholder\\` attribute is set to true but ` +\n `no image loader is configured (i.e. the default one is being used), ` +\n `which would result in the same image being used for the primary image and its placeholder. ` +\n `To fix this, provide a loader or remove the \\`placeholder\\` attribute from the image.`,\n );\n }\n}\n\n/**\n * Warns or throws an error if an oversized dataURL placeholder is provided.\n */\nfunction assertNoOversizedDataUrl(dir: NgOptimizedImage) {\n if (\n dir.placeholder &&\n typeof dir.placeholder === 'string' &&\n dir.placeholder.startsWith('data:')\n ) {\n if (dir.placeholder.length > DATA_URL_ERROR_LIMIT) {\n throw new RuntimeError(\n RuntimeErrorCode.OVERSIZED_PLACEHOLDER,\n `${imgDirectiveDetails(\n dir.ngSrc,\n )} the \\`placeholder\\` attribute is set to a data URL which is longer ` +\n `than ${DATA_URL_ERROR_LIMIT} characters. This is strongly discouraged, as large inline placeholders ` +\n `directly increase the bundle size of Angular and hurt page load performance. To fix this, generate ` +\n `a smaller data URL placeholder.`,\n );\n }\n if (dir.placeholder.length > DATA_URL_WARN_LIMIT) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.OVERSIZED_PLACEHOLDER,\n `${imgDirectiveDetails(\n dir.ngSrc,\n )} the \\`placeholder\\` attribute is set to a data URL which is longer ` +\n `than ${DATA_URL_WARN_LIMIT} characters. This is discouraged, as large inline placeholders ` +\n `directly increase the bundle size of Angular and hurt page load performance. For better loading performance, ` +\n `generate a smaller data URL placeholder.`,\n ),\n );\n }\n }\n}\n\n/**\n * Verifies that the `ngSrc` is not a Blob URL.\n */\nfunction assertNotBlobUrl(dir: NgOptimizedImage) {\n const ngSrc = dir.ngSrc.trim();\n if (ngSrc.startsWith('blob:')) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} \\`ngSrc\\` was set to a blob URL (${ngSrc}). ` +\n `Blob URLs are not supported by the NgOptimizedImage directive. ` +\n `To fix this, disable the NgOptimizedImage directive for this element ` +\n `by removing \\`ngSrc\\` and using a regular \\`src\\` attribute instead.`,\n );\n }\n}\n\n/**\n * Verifies that the input is set to a non-empty string.\n */\nfunction assertNonEmptyInput(dir: NgOptimizedImage, name: string, value: unknown) {\n const isString = typeof value === 'string';\n const isEmptyString = isString && value.trim() === '';\n if (!isString || isEmptyString) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} \\`${name}\\` has an invalid value ` +\n `(\\`${value}\\`). To fix this, change the value to a non-empty string.`,\n );\n }\n}\n\n/**\n * Verifies that the `ngSrcset` is in a valid format, e.g. \"100w, 200w\" or \"1x, 2x\".\n */\nexport function assertValidNgSrcset(dir: NgOptimizedImage, value: unknown) {\n if (value == null) return;\n assertNonEmptyInput(dir, 'ngSrcset', value);\n const stringVal = value as string;\n const isValidWidthDescriptor = VALID_WIDTH_DESCRIPTOR_SRCSET.test(stringVal);\n const isValidDensityDescriptor = VALID_DENSITY_DESCRIPTOR_SRCSET.test(stringVal);\n\n if (isValidDensityDescriptor) {\n assertUnderDensityCap(dir, stringVal);\n }\n\n const isValidSrcset = isValidWidthDescriptor || isValidDensityDescriptor;\n if (!isValidSrcset) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} \\`ngSrcset\\` has an invalid value (\\`${value}\\`). ` +\n `To fix this, supply \\`ngSrcset\\` using a comma-separated list of one or more width ` +\n `descriptors (e.g. \"100w, 200w\") or density descriptors (e.g. \"1x, 2x\").`,\n );\n }\n}\n\nfunction assertUnderDensityCap(dir: NgOptimizedImage, value: string) {\n const underDensityCap = value\n .split(',')\n .every((num) => num === '' || parseFloat(num) <= ABSOLUTE_SRCSET_DENSITY_CAP);\n if (!underDensityCap) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`ngSrcset\\` contains an unsupported image density:` +\n `\\`${value}\\`. NgOptimizedImage generally recommends a max image density of ` +\n `${RECOMMENDED_SRCSET_DENSITY_CAP}x but supports image densities up to ` +\n `${ABSOLUTE_SRCSET_DENSITY_CAP}x. The human eye cannot distinguish between image densities ` +\n `greater than ${RECOMMENDED_SRCSET_DENSITY_CAP}x - which makes them unnecessary for ` +\n `most use cases. Images that will be pinch-zoomed are typically the primary use case for ` +\n `${ABSOLUTE_SRCSET_DENSITY_CAP}x images. Please remove the high density descriptor and try again.`,\n );\n }\n}\n\n/**\n * Creates a `RuntimeError` instance to represent a situation when an input is set after\n * the directive has initialized.\n */\nfunction postInitInputChangeError(dir: NgOptimizedImage, inputName: string): {} {\n let reason!: string;\n if (inputName === 'width' || inputName === 'height') {\n reason =\n `Changing \\`${inputName}\\` may result in different attribute value ` +\n `applied to the underlying image element and cause layout shifts on a page.`;\n } else {\n reason =\n `Changing the \\`${inputName}\\` would have no effect on the underlying ` +\n `image element, because the resource loading has already occurred.`;\n }\n return new RuntimeError(\n RuntimeErrorCode.UNEXPECTED_INPUT_CHANGE,\n `${imgDirectiveDetails(dir.ngSrc)} \\`${inputName}\\` was updated after initialization. ` +\n `The NgOptimizedImage directive will not react to this input change. ${reason} ` +\n `To fix this, either switch \\`${inputName}\\` to a static value ` +\n `or wrap the image element in an @if that is gated on the necessary value.`,\n );\n}\n\n/**\n * Verify that none of the listed inputs has changed.\n */\nfunction assertNoPostInitInputChange(\n dir: NgOptimizedImage,\n changes: SimpleChanges,\n inputs: string[],\n) {\n inputs.forEach((input) => {\n const isUpdated = changes.hasOwnProperty(input);\n if (isUpdated && !changes[input].isFirstChange()) {\n if (input === 'ngSrc') {\n // When the `ngSrc` input changes, we detect that only in the\n // `ngOnChanges` hook, thus the `ngSrc` is already set. We use\n // `ngSrc` in the error message, so we use a previous value, but\n // not the updated one in it.\n dir = {ngSrc: changes[input].previousValue} as NgOptimizedImage;\n }\n throw postInitInputChangeError(dir, input);\n }\n });\n}\n\n/**\n * Verifies that a specified input is a number greater than 0.\n */\nfunction assertGreaterThanZero(dir: NgOptimizedImage, inputValue: unknown, inputName: string) {\n const validNumber = typeof inputValue === 'number' && inputValue > 0;\n const validString =\n typeof inputValue === 'string' && /^\\d+$/.test(inputValue.trim()) && parseInt(inputValue) > 0;\n if (!validNumber && !validString) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} \\`${inputName}\\` has an invalid value. ` +\n `To fix this, provide \\`${inputName}\\` as a number greater than 0.`,\n );\n }\n}\n\n/**\n * Verifies that the rendered image is not visually distorted. Effectively this is checking:\n * - Whether the \"width\" and \"height\" attributes reflect the actual dimensions of the image.\n * - Whether image styling is \"correct\" (see below for a longer explanation).\n */\nfunction assertNoImageDistortion(\n dir: NgOptimizedImage,\n img: HTMLImageElement,\n renderer: Renderer2,\n) {\n const callback = () => {\n removeLoadListenerFn();\n removeErrorListenerFn();\n const computedStyle = window.getComputedStyle(img);\n let renderedWidth = parseFloat(computedStyle.getPropertyValue('width'));\n let renderedHeight = parseFloat(computedStyle.getPropertyValue('height'));\n const boxSizing = computedStyle.getPropertyValue('box-sizing');\n\n if (boxSizing === 'border-box') {\n const paddingTop = computedStyle.getPropertyValue('padding-top');\n const paddingRight = computedStyle.getPropertyValue('padding-right');\n const paddingBottom = computedStyle.getPropertyValue('padding-bottom');\n const paddingLeft = computedStyle.getPropertyValue('padding-left');\n renderedWidth -= parseFloat(paddingRight) + parseFloat(paddingLeft);\n renderedHeight -= parseFloat(paddingTop) + parseFloat(paddingBottom);\n }\n\n const renderedAspectRatio = renderedWidth / renderedHeight;\n const nonZeroRenderedDimensions = renderedWidth !== 0 && renderedHeight !== 0;\n\n const intrinsicWidth = img.naturalWidth;\n const intrinsicHeight = img.naturalHeight;\n const intrinsicAspectRatio = intrinsicWidth / intrinsicHeight;\n\n const suppliedWidth = dir.width!;\n const suppliedHeight = dir.height!;\n const suppliedAspectRatio = suppliedWidth / suppliedHeight;\n\n // Tolerance is used to account for the impact of subpixel rendering.\n // Due to subpixel rendering, the rendered, intrinsic, and supplied\n // aspect ratios of a correctly configured image may not exactly match.\n // For example, a `width=4030 height=3020` image might have a rendered\n // size of \"1062w, 796.48h\". (An aspect ratio of 1.334... vs. 1.333...)\n const inaccurateDimensions =\n Math.abs(suppliedAspectRatio - intrinsicAspectRatio) > ASPECT_RATIO_TOLERANCE;\n const stylingDistortion =\n nonZeroRenderedDimensions &&\n Math.abs(intrinsicAspectRatio - renderedAspectRatio) > ASPECT_RATIO_TOLERANCE;\n\n if (inaccurateDimensions) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the aspect ratio of the image does not match ` +\n `the aspect ratio indicated by the width and height attributes. ` +\n `\\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h ` +\n `(aspect-ratio: ${round(\n intrinsicAspectRatio,\n )}). \\nSupplied width and height attributes: ` +\n `${suppliedWidth}w x ${suppliedHeight}h (aspect-ratio: ${round(\n suppliedAspectRatio,\n )}). ` +\n `\\nTo fix this, update the width and height attributes.`,\n ),\n );\n } else if (stylingDistortion) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the aspect ratio of the rendered image ` +\n `does not match the image's intrinsic aspect ratio. ` +\n `\\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h ` +\n `(aspect-ratio: ${round(intrinsicAspectRatio)}). \\nRendered image size: ` +\n `${renderedWidth}w x ${renderedHeight}h (aspect-ratio: ` +\n `${round(renderedAspectRatio)}). \\nThis issue can occur if \"width\" and \"height\" ` +\n `attributes are added to an image without updating the corresponding ` +\n `image styling. To fix this, adjust image styling. In most cases, ` +\n `adding \"height: auto\" or \"width: auto\" to the image styling will fix ` +\n `this issue.`,\n ),\n );\n } else if (!dir.ngSrcset && nonZeroRenderedDimensions) {\n // If `ngSrcset` hasn't been set, sanity check the intrinsic size.\n const recommendedWidth = RECOMMENDED_SRCSET_DENSITY_CAP * renderedWidth;\n const recommendedHeight = RECOMMENDED_SRCSET_DENSITY_CAP * renderedHeight;\n const oversizedWidth = intrinsicWidth - recommendedWidth >= OVERSIZED_IMAGE_TOLERANCE;\n const oversizedHeight = intrinsicHeight - recommendedHeight >= OVERSIZED_IMAGE_TOLERANCE;\n if (oversizedWidth || oversizedHeight) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.OVERSIZED_IMAGE,\n `${imgDirectiveDetails(dir.ngSrc)} the intrinsic image is significantly ` +\n `larger than necessary. ` +\n `\\nRendered image size: ${renderedWidth}w x ${renderedHeight}h. ` +\n `\\nIntrinsic image size: ${intrinsicWidth}w x ${intrinsicHeight}h. ` +\n `\\nRecommended intrinsic image size: ${recommendedWidth}w x ${recommendedHeight}h. ` +\n `\\nNote: Recommended intrinsic image size is calculated assuming a maximum DPR of ` +\n `${RECOMMENDED_SRCSET_DENSITY_CAP}. To improve loading time, resize the image ` +\n `or consider using the \"ngSrcset\" and \"sizes\" attributes.`,\n ),\n );\n }\n }\n };\n\n const removeLoadListenerFn = renderer.listen(img, 'load', callback);\n\n // We only listen to the `error` event to remove the `load` event listener because it will not be\n // fired if the image fails to load. This is done to prevent memory leaks in development mode\n // because image elements aren't garbage-collected properly. It happens because zone.js stores the\n // event listener directly on the element and closures capture `dir`.\n const removeErrorListenerFn = renderer.listen(img, 'error', () => {\n removeLoadListenerFn();\n removeErrorListenerFn();\n });\n\n callOnLoadIfImageIsLoaded(img, callback);\n}\n\n/**\n * Verifies that a specified input is set.\n */\nfunction assertNonEmptyWidthAndHeight(dir: NgOptimizedImage) {\n let missingAttributes = [];\n if (dir.width === undefined) missingAttributes.push('width');\n if (dir.height === undefined) missingAttributes.push('height');\n if (missingAttributes.length > 0) {\n throw new RuntimeError(\n RuntimeErrorCode.REQUIRED_INPUT_MISSING,\n `${imgDirectiveDetails(dir.ngSrc)} these required attributes ` +\n `are missing: ${missingAttributes.map((attr) => `\"${attr}\"`).join(', ')}. ` +\n `Including \"width\" and \"height\" attributes will prevent image-related layout shifts. ` +\n `To fix this, include \"width\" and \"height\" attributes on the image tag or turn on ` +\n `\"fill\" mode with the \\`fill\\` attribute.`,\n );\n }\n}\n\n/**\n * Verifies that width and height are not set. Used in fill mode, where those attributes don't make\n * sense.\n */\nfunction assertEmptyWidthAndHeight(dir: NgOptimizedImage) {\n if (dir.width || dir.height) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the attributes \\`height\\` and/or \\`width\\` are present ` +\n `along with the \\`fill\\` attribute. Because \\`fill\\` mode causes an image to fill its containing ` +\n `element, the size attributes have no effect and should be removed.`,\n );\n }\n}\n\n/**\n * Verifies that the rendered image has a nonzero height. If the image is in fill mode, provides\n * guidance that this can be caused by the containing element's CSS position property.\n */\nfunction assertNonZeroRenderedHeight(\n dir: NgOptimizedImage,\n img: HTMLImageElement,\n renderer: Renderer2,\n) {\n const callback = () => {\n removeLoadListenerFn();\n removeErrorListenerFn();\n const renderedHeight = img.clientHeight;\n if (dir.fill && renderedHeight === 0) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the height of the fill-mode image is zero. ` +\n `This is likely because the containing element does not have the CSS 'position' ` +\n `property set to one of the following: \"relative\", \"fixed\", or \"absolute\". ` +\n `To fix this problem, make sure the container element has the CSS 'position' ` +\n `property defined and the height of the element is not zero.`,\n ),\n );\n }\n };\n\n const removeLoadListenerFn = renderer.listen(img, 'load', callback);\n\n // See comments in the `assertNoImageDistortion`.\n const removeErrorListenerFn = renderer.listen(img, 'error', () => {\n removeLoadListenerFn();\n removeErrorListenerFn();\n });\n\n callOnLoadIfImageIsLoaded(img, callback);\n}\n\n/**\n * Verifies that the `loading` attribute is set to a valid input &\n * is not used on priority images.\n */\nfunction assertValidLoadingInput(dir: NgOptimizedImage) {\n if (dir.loading && dir.priority) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`loading\\` attribute ` +\n `was used on an image that was marked \"priority\". ` +\n `Setting \\`loading\\` on priority images is not allowed ` +\n `because these images will always be eagerly loaded. ` +\n `To fix this, remove the “loading” attribute from the priority image.`,\n );\n }\n const validInputs = ['auto', 'eager', 'lazy'];\n if (typeof dir.loading === 'string' && !validInputs.includes(dir.loading)) {\n throw new RuntimeError(\n RuntimeErrorCode.INVALID_INPUT,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`loading\\` attribute ` +\n `has an invalid value (\\`${dir.loading}\\`). ` +\n `To fix this, provide a valid value (\"lazy\", \"eager\", or \"auto\").`,\n );\n }\n}\n\n/**\n * Warns if NOT using a loader (falling back to the generic loader) and\n * the image appears to be hosted on one of the image CDNs for which\n * we do have a built-in image loader. Suggests switching to the\n * built-in loader.\n *\n * @param ngSrc Value of the ngSrc attribute\n * @param imageLoader ImageLoader provided\n */\nfunction assertNotMissingBuiltInLoader(ngSrc: string, imageLoader: ImageLoader) {\n if (imageLoader === noopImageLoader) {\n let builtInLoaderName = '';\n for (const loader of BUILT_IN_LOADERS) {\n if (loader.testUrl(ngSrc)) {\n builtInLoaderName = loader.name;\n break;\n }\n }\n if (builtInLoaderName) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.MISSING_BUILTIN_LOADER,\n `NgOptimizedImage: It looks like your images may be hosted on the ` +\n `${builtInLoaderName} CDN, but your app is not using Angular's ` +\n `built-in loader for that CDN. We recommend switching to use ` +\n `the built-in by calling \\`provide${builtInLoaderName}Loader()\\` ` +\n `in your \\`providers\\` and passing it your instance's base URL. ` +\n `If you don't want to use the built-in loader, define a custom ` +\n `loader function using IMAGE_LOADER to silence this warning.`,\n ),\n );\n }\n }\n}\n\n/**\n * Warns if ngSrcset is present and no loader is configured (i.e. the default one is being used).\n */\nfunction assertNoNgSrcsetWithoutLoader(dir: NgOptimizedImage, imageLoader: ImageLoader) {\n if (dir.ngSrcset && imageLoader === noopImageLoader) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.MISSING_NECESSARY_LOADER,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`ngSrcset\\` attribute is present but ` +\n `no image loader is configured (i.e. the default one is being used), ` +\n `which would result in the same image being used for all configured sizes. ` +\n `To fix this, provide a loader or remove the \\`ngSrcset\\` attribute from the image.`,\n ),\n );\n }\n}\n\n/**\n * Warns if loaderParams is present and no loader is configured (i.e. the default one is being\n * used).\n */\nfunction assertNoLoaderParamsWithoutLoader(dir: NgOptimizedImage, imageLoader: ImageLoader) {\n if (dir.loaderParams && imageLoader === noopImageLoader) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.MISSING_NECESSARY_LOADER,\n `${imgDirectiveDetails(dir.ngSrc)} the \\`loaderParams\\` attribute is present but ` +\n `no image loader is configured (i.e. the default one is being used), ` +\n `which means that the loaderParams data will not be consumed and will not affect the URL. ` +\n `To fix this, provide a custom loader or remove the \\`loaderParams\\` attribute from the image.`,\n ),\n );\n }\n}\n\n/**\n * Warns if the priority attribute is used too often on page load\n */\nasync function assetPriorityCountBelowThreshold(appRef: ApplicationRef) {\n if (IMGS_WITH_PRIORITY_ATTR_COUNT === 0) {\n IMGS_WITH_PRIORITY_ATTR_COUNT++;\n await appRef.whenStable();\n if (IMGS_WITH_PRIORITY_ATTR_COUNT > PRIORITY_COUNT_THRESHOLD) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.TOO_MANY_PRIORITY_ATTRIBUTES,\n `NgOptimizedImage: The \"priority\" attribute is set to true more than ${PRIORITY_COUNT_THRESHOLD} times (${IMGS_WITH_PRIORITY_ATTR_COUNT} times). ` +\n `Marking too many images as \"high\" priority can hurt your application's LCP (https://web.dev/lcp). ` +\n `\"Priority\" should only be set on the image expected to be the page's LCP element.`,\n ),\n );\n }\n } else {\n IMGS_WITH_PRIORITY_ATTR_COUNT++;\n }\n}\n\n/**\n * Warns if placeholder's dimension are over a threshold.\n *\n * This assert function is meant to only run on the browser.\n */\nfunction assertPlaceholderDimensions(dir: NgOptimizedImage, imgElement: HTMLImageElement) {\n const computedStyle = window.getComputedStyle(imgElement);\n let renderedWidth = parseFloat(computedStyle.getPropertyValue('width'));\n let renderedHeight = parseFloat(computedStyle.getPropertyValue('height'));\n\n if (renderedWidth > PLACEHOLDER_DIMENSION_LIMIT || renderedHeight > PLACEHOLDER_DIMENSION_LIMIT) {\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.PLACEHOLDER_DIMENSION_LIMIT_EXCEEDED,\n `${imgDirectiveDetails(dir.ngSrc)} it uses a placeholder image, but at least one ` +\n `of the dimensions attribute (height or width) exceeds the limit of ${PLACEHOLDER_DIMENSION_LIMIT}px. ` +\n `To fix this, use a smaller image as a placeholder.`,\n ),\n );\n }\n}\n\nfunction callOnLoadIfImageIsLoaded(img: HTMLImageElement, callback: VoidFunction): void {\n // https://html.spec.whatwg.org/multipage/embedded-content.html#dom-img-complete\n // The spec defines that `complete` is truthy once its request state is fully available.\n // The image may already be available if it’s loaded from the browser cache.\n // In that case, the `load` event will not fire at all, meaning that all setup\n // callbacks listening for the `load` event will not be invoked.\n // In Safari, there is a known behavior where the `complete` property of an\n // `HTMLImageElement` may sometimes return `true` even when the image is not fully loaded.\n // Checking both `img.complete` and `img.naturalWidth` is the most reliable way to\n // determine if an image has been fully loaded, especially in browsers where the\n // `complete` property may return `true` prematurely.\n if (img.complete && img.naturalWidth) {\n callback();\n }\n}\n\nfunction round(input: number): number | string {\n return Number.isInteger(input) ? input : input.toFixed(2);\n}\n\n// Transform function to handle SafeValue input for ngSrc. This doesn't do any sanitization,\n// as that is not needed for img.src and img.srcset. This transform is purely for compatibility.\nfunction unwrapSafeUrl(value: string | SafeValue): string {\n if (typeof value === 'string') {\n return value;\n }\n return unwrapSafeValue(value);\n}\n\n// Transform function to handle inputs which may be booleans, strings, or string representations\n// of boolean values. Used for the placeholder attribute.\nexport function booleanOrUrlAttribute(value: boolean | string): boolean | string {\n if (typeof value === 'string' && value !== 'true' && value !== 'false' && value !== '') {\n return value;\n }\n return booleanAttribute(value);\n}\n"],"names":["ɵregisterLocaleData","ɵɵdefineInjectable","RuntimeError","formatRuntimeError","IMAGE_CONFIG","performanceMarkFeature","IMAGE_CONFIG_DEFAULTS","unwrapSafeValue"],"mappings":";;;;;;;;;;;;;;;;;AAUA;;;;;;;;AAQG;SACa,kBAAkB,CAAC,IAAS,EAAE,QAAuB,EAAE,SAAe,EAAA;IACpF,OAAOA,mBAAmB,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,CAAC;AACvD;;ACbA;;;;AAIG;AAIH;;AAEG;MACU,OAAO,GAAG,IAAI,OAAO,CAAC,mBAAmB;;ACPtD;;;;AAIG;MACmB,gBAAgB,CAAA;;;;IAIpC,OAAO,KAAK,6CAA6CC,kBAAkB,CAAC;AAC1E,QAAA,KAAK,EAAE,gBAAgB;AACvB,QAAA,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE,MACP,OAAO,YAAY,KAAK,WAAW,IAAI;cACnC,IAAI,oBAAoB;cACxB,IAAI,uBAAuB,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;AAC5D,KAAA,CAAC;;AAoCJ;;AAEG;MACU,uBAAuB,CAAA;AAIxB,IAAA,QAAA;AACA,IAAA,MAAA;IAJF,MAAM,GAA2B,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;IAErD,WACU,CAAA,QAAkB,EAClB,MAAc,EAAA;QADd,IAAQ,CAAA,QAAA,GAAR,QAAQ;QACR,IAAM,CAAA,MAAA,GAAN,MAAM;;AAGhB;;;;;AAKG;AACH,IAAA,SAAS,CAAC,MAAmD,EAAA;AAC3D,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;AACzB,YAAA,IAAI,CAAC,MAAM,GAAG,MAAM,MAAM;;aACrB;AACL,YAAA,IAAI,CAAC,MAAM,GAAG,MAAM;;;AAIxB;;;AAGG;IACH,iBAAiB,GAAA;AACf,QAAA,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;;AAGnD;;;AAGG;AACH,IAAA,gBAAgB,CAAC,QAA0B,EAAA;AACzC,QAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;;AAGhD;;;;;;;;;;AAUG;AACH,IAAA,cAAc,CAAC,MAAc,EAAA;QAC3B,MAAM,UAAU,GAAG,sBAAsB,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC;QAEhE,IAAI,UAAU,EAAE;AACd,YAAA,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC;;;;;;;YAOhC,UAAU,CAAC,KAAK,EAAE;;;AAItB;;AAEG;AACH,IAAA,2BAA2B,CAAC,iBAAoC,EAAA;QAC9D,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,iBAAiB,GAAG,iBAAiB;;AAG3D;;;;;AAKG;AACK,IAAA,eAAe,CAAC,EAAe,EAAA;AACrC,QAAA,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE;QACvC,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW;QAChD,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,WAAW;AAC9C,QAAA,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE;AAC5B,QAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,EAAE,GAAG,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;;AAE1D;AAED,SAAS,sBAAsB,CAAC,QAAkB,EAAE,MAAc,EAAA;AAChE,IAAA,MAAM,cAAc,GAAG,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,IAAI,QAAQ,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAE/F,IAAI,cAAc,EAAE;AAClB,QAAA,OAAO,cAAc;;;;AAKvB,IAAA,IACE,OAAO,QAAQ,CAAC,gBAAgB,KAAK,UAAU;AAC/C,QAAA,QAAQ,CAAC,IAAI;QACb,OAAO,QAAQ,CAAC,IAAI,CAAC,YAAY,KAAK,UAAU,EAChD;AACA,QAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC;AACpF,QAAA,IAAI,WAAW,GAAG,UAAU,CAAC,WAAiC;QAE9D,OAAO,WAAW,EAAE;AAClB,YAAA,MAAM,UAAU,GAAG,WAAW,CAAC,UAAU;YAEzC,IAAI,UAAU,EAAE;;;AAGd,gBAAA,MAAM,MAAM,GACV,UAAU,CAAC,cAAc,CAAC,MAAM,CAAC,IAAI,UAAU,CAAC,aAAa,CAAC,UAAU,MAAM,CAAA,EAAA,CAAI,CAAC;gBACrF,IAAI,MAAM,EAAE;AACV,oBAAA,OAAO,MAAM;;;AAIjB,YAAA,WAAW,GAAG,UAAU,CAAC,QAAQ,EAAwB;;;AAI7D,IAAA,OAAO,IAAI;AACb;AAEA;;AAEG;MACU,oBAAoB,CAAA;AAC/B;;AAEG;IACH,SAAS,CAAC,MAAmD,EAAA;AAE7D;;AAEG;IACH,iBAAiB,GAAA;AACf,QAAA,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;;AAGf;;AAEG;IACH,gBAAgB,CAAC,QAA0B,EAAA;AAE3C;;AAEG;IACH,cAAc,CAAC,MAAc,EAAA;AAE7B;;AAEG;IACH,2BAA2B,CAAC,iBAAoC,EAAA;AACjE;;ACpND;;AAEG;AACI,MAAM,mBAAmB,GAAG,IAAI;;ACHvC;AACgB,SAAA,MAAM,CAAC,GAAW,EAAE,GAAW,EAAA;;IAE7C,OAAO,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC;AAC5E;AAEA;AACM,SAAU,aAAa,CAAC,GAAW,EAAA;AACvC,IAAA,OAAO,cAAc,CAAC,IAAI,CAAC,GAAG,CAAC;AACjC;AAEA;AACA;AACM,SAAU,eAAe,CAAC,GAAW,EAAA;AACzC,IAAA,OAAO,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,GAAG,GAAG;AACzD;AAEM,SAAU,WAAW,CAAC,IAAa,EAAA;AACvC,IAAA,MAAM,QAAQ,GAAG,OAAO,IAAI,KAAK,QAAQ;IAEzC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;AACnC,QAAA,OAAO,KAAK;;;AAId,IAAA,IAAI;AACF,QAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC;AACzB,QAAA,OAAO,IAAI;;AACX,IAAA,MAAM;AACN,QAAA,OAAO,KAAK;;AAEhB;AAEM,SAAU,aAAa,CAAC,IAAY,EAAA;IACxC,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,IAAI;AACtD;AAEM,SAAU,YAAY,CAAC,GAAW,EAAA;AACtC,IAAA,OAAO,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,GAAG;AACjD;;ACCA;;;;;;AAMG;AACI,MAAM,eAAe,GAAG,CAAC,MAAyB,KAAK,MAAM,CAAC,GAAG;AAUxE;;;;;;AAMG;AACU,MAAA,YAAY,GAAG,IAAI,cAAc,CAAc,SAAS,GAAG,aAAa,GAAG,EAAE,EAAE;AAC1F,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,OAAO,EAAE,MAAM,eAAe;AAC/B,CAAA;AAED;;;;;;;;AAQG;AACa,SAAA,iBAAiB,CAC/B,UAA+D,EAC/D,WAAsB,EAAA;IAEtB,OAAO,SAAS,kBAAkB,CAAC,IAAY,EAAA;AAC7C,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;AACtB,YAAA,qBAAqB,CAAC,IAAI,EAAE,WAAW,IAAI,EAAE,CAAC;;;;AAKhD,QAAA,IAAI,GAAG,aAAa,CAAC,IAAI,CAAC;AAE1B,QAAA,MAAM,QAAQ,GAAG,CAAC,MAAyB,KAAI;AAC7C,YAAA,IAAI,aAAa,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;;;;;;AAM7B,gBAAA,+BAA+B,CAAC,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC;;AAGnD,YAAA,OAAO,UAAU,CAAC,IAAI,EAAE,EAAC,GAAG,MAAM,EAAE,GAAG,EAAE,YAAY,CAAC,MAAM,CAAC,GAAG,CAAC,EAAC,CAAC;AACrE,SAAC;AAED,QAAA,MAAM,SAAS,GAAe,CAAC,EAAC,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAC,CAAC;AAC3E,QAAA,OAAO,SAAS;AAClB,KAAC;AACH;AAEA,SAAS,qBAAqB,CAAC,IAAa,EAAE,WAAqB,EAAA;IACjE,MAAM,IAAIC,aAAY,CAAA,IAAA,kDAEpB,SAAS;AACP,QAAA,CAAA,6CAAA,EAAgD,IAAI,CAAO,KAAA,CAAA;YACzD,CAAkE,+DAAA,EAAA,WAAW,CAAC,IAAI,CAChF,MAAM,CACP,CAAA,CAAE,CACR;AACH;AAEA,SAAS,+BAA+B,CAAC,IAAY,EAAE,GAAW,EAAA;IAChE,MAAM,IAAIA,aAAY,CAAA,IAAA,kDAEpB,SAAS;AACP,QAAA,CAAA,+EAAA,EAAkF,GAAG,CAAI,EAAA,CAAA;YACvF,CAA6D,2DAAA,CAAA;YAC7D,CAAiD,+CAAA,CAAA;YACjD,CAAoE,kEAAA,CAAA;YACpE,CAAiC,8BAAA,EAAA,IAAI,CAAM,IAAA,CAAA,CAChD;AACH;;AC9HA;;;;;;;;;;AAUG;MACU,uBAAuB,GAAiC,iBAAiB,CACpF,mBAAmB,EACnB,SAAS,GAAG,CAAC,uDAAuD,CAAC,GAAG,SAAS;AAGnF,SAAS,mBAAmB,CAAC,IAAY,EAAE,MAAyB,EAAA;IAClE,IAAI,MAAM,GAAG,CAAA,WAAA,CAAa;AAC1B,IAAA,IAAI,MAAM,CAAC,KAAK,EAAE;AAChB,QAAA,MAAM,IAAI,CAAU,OAAA,EAAA,MAAM,CAAC,KAAK,EAAE;;;AAIpC,IAAA,IAAI,MAAM,CAAC,aAAa,EAAE;AACxB,QAAA,MAAM,IAAI,CAAA,SAAA,EAAY,mBAAmB,CAAA,CAAE;;;;IAK7C,OAAO,CAAA,EAAG,IAAI,CAAkB,eAAA,EAAA,MAAM,IAAI,MAAM,CAAC,GAAG,CAAA,CAAE;AACxD;;AC/BA;;AAEG;AACI,MAAM,oBAAoB,GAAoB;AACnD,IAAA,IAAI,EAAE,YAAY;AAClB,IAAA,OAAO,EAAE,eAAe;CACzB;AAED,MAAM,uBAAuB,GAAG,yCAAyC;AACzE;;AAEG;AACH,SAAS,eAAe,CAAC,GAAW,EAAA;AAClC,IAAA,OAAO,uBAAuB,CAAC,IAAI,CAAC,GAAG,CAAC;AAC1C;AAEA;;;;;;;;;;;AAWG;MACU,uBAAuB,GAAiC,iBAAiB,CACpF,mBAAmB,EACnB;AACE,MAAE;QACE,mCAAmC;QACnC,+BAA+B;QAC/B,8BAA8B;AAC/B;MACD,SAAS;AAGf,SAAS,mBAAmB,CAAC,IAAY,EAAE,MAAyB,EAAA;;;;;;;AAQlE,IAAA,MAAM,OAAO,GAAG,MAAM,CAAC,aAAa,GAAG,YAAY,GAAG,QAAQ;AAE9D,IAAA,IAAI,MAAM,GAAG,CAAU,OAAA,EAAA,OAAO,EAAE;AAChC,IAAA,IAAI,MAAM,CAAC,KAAK,EAAE;AAChB,QAAA,MAAM,IAAI,CAAM,GAAA,EAAA,MAAM,CAAC,KAAK,EAAE;;IAGhC,IAAI,MAAM,CAAC,YAAY,GAAG,SAAS,CAAC,EAAE;QACpC,MAAM,IAAI,QAAQ;;IAGpB,OAAO,CAAA,EAAG,IAAI,CAAiB,cAAA,EAAA,MAAM,IAAI,MAAM,CAAC,GAAG,CAAA,CAAE;AACvD;;AC1DA;;AAEG;AACI,MAAM,kBAAkB,GAAoB;AACjD,IAAA,IAAI,EAAE,UAAU;AAChB,IAAA,OAAO,EAAE,aAAa;CACvB;AAED,MAAM,sBAAsB,GAAG,sCAAsC;AACrE;;AAEG;AACH,SAAS,aAAa,CAAC,GAAW,EAAA;AAChC,IAAA,OAAO,sBAAsB,CAAC,IAAI,CAAC,GAAG,CAAC;AACzC;AAEA;;;;;;;;;;AAUG;MACU,qBAAqB,GAAiC,iBAAiB,CAClF,iBAAiB,EACjB,SAAS,GAAG,CAAC,+BAA+B,EAAE,8BAA8B,CAAC,GAAG,SAAS;AAG3E,SAAA,iBAAiB,CAAC,IAAY,EAAE,MAAyB,EAAA;;;AAGvE,IAAA,MAAM,EAAC,GAAG,EAAE,KAAK,EAAC,GAAG,MAAM;IAC3B,MAAM,MAAM,GAAa,EAAE;IAE3B,IAAI,KAAK,EAAE;AACT,QAAA,MAAM,CAAC,IAAI,CAAC,KAAK,KAAK,CAAA,CAAE,CAAC;;;AAI3B,IAAA,IAAI,MAAM,CAAC,aAAa,EAAE;AACxB,QAAA,MAAM,CAAC,IAAI,CAAC,KAAK,mBAAmB,CAAA,CAAE,CAAC;;AAGzC,IAAA,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,EAAE,CAAA,GAAA,EAAM,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA,CAAE,EAAE,GAAG,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC;AACvF,IAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAC1C,OAAO,GAAG,CAAC,IAAI;AACjB;;AClDA;;AAEG;AACI,MAAM,eAAe,GAAoB;AAC9C,IAAA,IAAI,EAAE,OAAO;AACb,IAAA,OAAO,EAAE,UAAU;CACpB;AAED,MAAM,kBAAkB,GAAG,oCAAoC;AAC/D;;AAEG;AACH,SAAS,UAAU,CAAC,GAAW,EAAA;AAC7B,IAAA,OAAO,kBAAkB,CAAC,IAAI,CAAC,GAAG,CAAC;AACrC;AAEA;;;;;;;;AAQG;MACU,kBAAkB,GAAiC,iBAAiB,CAC/E,cAAc,EACd,SAAS,GAAG,CAAC,6BAA6B,CAAC,GAAG,SAAS;AAGzD,SAAS,cAAc,CAAC,IAAY,EAAE,MAAyB,EAAA;AAC7D,IAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,MAAM,CAAC,GAAG,CAAA,CAAE,CAAC;;IAE5C,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC;AACtC,IAAA,IAAI,MAAM,CAAC,KAAK,EAAE;AAChB,QAAA,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;;;AAIpD,IAAA,IAAI,MAAM,CAAC,aAAa,EAAE;QACxB,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,mBAAmB,CAAC;;IAEhD,OAAO,GAAG,CAAC,IAAI;AACjB;;ACnCA;;AAEG;AACI,MAAM,iBAAiB,GAAoB;AAChD,IAAA,IAAI,EAAE,SAAS;AACf,IAAA,OAAO,EAAE,YAAY;CACtB;AAED,MAAM,oBAAoB,GAAG,sCAAsC;AAEnE;;;;AAIG;AACH,SAAS,YAAY,CAAC,GAAW,EAAA;AAC/B,IAAA,OAAO,oBAAoB,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC;AAEA;;;;;;;AAOG;AACG,SAAU,oBAAoB,CAAC,IAAa,EAAA;IAChD,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE;QAC9B,MAAM,IAAIA,aAAY,CAAA,IAAA,kDAEpB,SAAS;AACP,YAAA,CAAA,6CAAA,EAAgD,IAAI,CAAO,KAAA,CAAA;AACzD,gBAAA,CAAA,uGAAA,CAAyG,CAC9G;;IAGH,IAAI,IAAI,EAAE;AACR,QAAA,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC;AACzB,QAAA,IAAI,GAAG,GAAG,CAAC,MAAM;;AAGnB,IAAA,MAAM,QAAQ,GAAG,CAAC,MAAyB,KAAI;AAC7C,QAAA,OAAO,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC;AACvC,KAAC;AAED,IAAA,MAAM,SAAS,GAAe,CAAC,EAAC,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAC,CAAC;AAC3E,IAAA,OAAO,SAAS;AAClB;AAEA,MAAM,WAAW,GAAG,IAAI,GAAG,CAAiB;IAC1C,CAAC,QAAQ,EAAE,GAAG,CAAC;IACf,CAAC,KAAK,EAAE,KAAK,CAAC;IACd,CAAC,SAAS,EAAE,GAAG,CAAC;IAChB,CAAC,GAAG,EAAE,GAAG,CAAC;IACV,CAAC,UAAU,EAAE,UAAU,CAAC;AACzB,CAAA,CAAC;AAEF,SAAS,gBAAgB,CAAC,MAAyB,EAAE,IAAa,EAAA;;IAEhE,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,IAAI,YAAY,CAAC;AACzC,IAAA,GAAG,CAAC,QAAQ,GAAG,kBAAkB;AAEjC,IAAA,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;QAC7D,MAAM,CAAC,GAAG,GAAG,GAAG,GAAG,MAAM,CAAC,GAAG;;IAG/B,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC;AAEvC,IAAA,IAAI,MAAM,CAAC,KAAK,EAAE;AAChB,QAAA,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;;;;AAKpD,IAAA,MAAM,aAAa,GAAG,MAAM,CAAC,YAAY,GAAG,SAAS,CAAC,IAAI,MAAM,CAAC,YAAY,GAAG,GAAG,CAAC;AACpF,IAAA,IAAI,MAAM,CAAC,aAAa,IAAI,CAAC,aAAa,EAAE;QAC1C,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,mBAAmB,CAAC;;AAGhD,IAAA,KAAK,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,YAAY,IAAI,EAAE,CAAC,EAAE;AACtE,QAAA,IAAI,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;AAC1B,YAAA,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAE,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC;;aAC1D;YACL,IAAI,SAAS,EAAE;gBACb,OAAO,CAAC,IAAI,CACVC,mBAAkB,CAAA,IAAA,kDAEhB,4FAA4F,KAAK,CAAA,IAAA,CAAM,CACxG,CACF;;;;;IAKP,OAAO,GAAG,CAAC,QAAQ,KAAK,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,IAAI;AAC3E;;AC5GA;SACgB,mBAAmB,CAAC,KAAa,EAAE,YAAY,GAAG,IAAI,EAAA;IACpE,MAAM,SAAS,GAAG;UACd,CAAoD,iDAAA,EAAA,KAAK,CAAO,KAAA;UAChE,EAAE;IACN,OAAO,CAAA,+BAAA,EAAkC,SAAS,CAAA,iBAAA,CAAmB;AACvE;;ACFA;;;;AAIG;AACG,SAAU,aAAa,CAAC,SAAiB,EAAA;IAC7C,IAAI,CAAC,SAAS,EAAE;AACd,QAAA,MAAM,IAAID,aAAY,CAEpB,IAAA,gEAAA,CAAA,6BAAA,EAAgC,SAAS,CAAqB,mBAAA,CAAA;AAC5D,YAAA,CAAA,qEAAA,CAAuE,CAC1E;;AAEL;;ACMA;;;;;;;;;AASG;MAEU,gBAAgB,CAAA;;AAEnB,IAAA,MAAM,GAAG,IAAI,GAAG,EAA8B;IAE9C,MAAM,GAAkB,IAAI;IAC5B,QAAQ,GAA+B,IAAI;AAEnD,IAAA,WAAA,GAAA;QACE,MAAM,SAAS,GAAG,iBAAiB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACxD,aAAa,CAAC,aAAa,CAAC;QAC5B,MAAM,GAAG,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,WAAW;AACxC,QAAA,IAAI,SAAS,IAAI,OAAO,mBAAmB,KAAK,WAAW,EAAE;AAC3D,YAAA,IAAI,CAAC,MAAM,GAAG,GAAG;AACjB,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,uBAAuB,EAAE;;;AAIlD;;;AAGG;IACK,uBAAuB,GAAA;QAC7B,MAAM,QAAQ,GAAG,IAAI,mBAAmB,CAAC,CAAC,SAAS,KAAI;AACrD,YAAA,MAAM,OAAO,GAAG,SAAS,CAAC,UAAU,EAAE;AACtC,YAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC;gBAAE;;;;;YAK1B,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;;;YAI9C,MAAM,MAAM,GAAI,UAAkB,CAAC,OAAO,EAAE,GAAG,IAAI,EAAE;;AAGrD,YAAA,IAAI,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC;gBAAE;YAE9D,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC;AACnC,YAAA,IAAI,CAAC,GAAG;gBAAE;YACV,IAAI,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,GAAG,CAAC,qBAAqB,EAAE;AAC/C,gBAAA,GAAG,CAAC,qBAAqB,GAAG,IAAI;gBAChC,uBAAuB,CAAC,MAAM,CAAC;;YAEjC,IAAI,GAAG,CAAC,QAAQ,IAAI,CAAC,GAAG,CAAC,qBAAqB,EAAE;AAC9C,gBAAA,GAAG,CAAC,qBAAqB,GAAG,IAAI;gBAChC,kBAAkB,CAAC,MAAM,CAAC;;AAE9B,SAAC,CAAC;AACF,QAAA,QAAQ,CAAC,OAAO,CAAC,EAAC,IAAI,EAAE,0BAA0B,EAAE,QAAQ,EAAE,IAAI,EAAC,CAAC;AACpE,QAAA,OAAO,QAAQ;;AAGjB,IAAA,aAAa,CAAC,YAAoB,EAAE,aAAqB,EAAE,UAAmB,EAAA;QAC5E,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;AACpB,QAAA,MAAM,qBAAqB,GAAuB;AAChD,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,QAAQ,EAAE,KAAK;AACf,YAAA,qBAAqB,EAAE,KAAK;AAC5B,YAAA,qBAAqB,EAAE,KAAK;SAC7B;AACD,QAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,CAAC,MAAO,CAAC,CAAC,IAAI,EAAE,qBAAqB,CAAC;;AAGjF,IAAA,eAAe,CAAC,YAAoB,EAAA;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;AACpB,QAAA,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE,IAAI,CAAC,MAAO,CAAC,CAAC,IAAI,CAAC;;IAG7D,WAAW,CAAC,WAAmB,EAAE,MAAc,EAAA;QAC7C,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;AACpB,QAAA,MAAM,WAAW,GAAG,MAAM,CAAC,WAAW,EAAE,IAAI,CAAC,MAAO,CAAC,CAAC,IAAI;QAC1D,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC;QACxC,IAAI,GAAG,EAAE;AACP,YAAA,GAAG,CAAC,QAAQ,GAAG,IAAI;AACnB,YAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,MAAO,CAAC,CAAC,IAAI,EAAE,GAAG,CAAC;AACvD,YAAA,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;;;IAInC,WAAW,GAAA;QACT,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE;AACpB,QAAA,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE;AAC1B,QAAA,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;;kHAnFV,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,gBAAgB,cADJ,MAAM,EAAA,CAAA;;sGAClB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAD5B,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;AAwFhC,SAAS,uBAAuB,CAAC,KAAa,EAAA;AAC5C,IAAA,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,CAAC;AACnD,IAAA,OAAO,CAAC,KAAK,CACXC,mBAAkB,CAEhB,IAAA,kDAAA,CAAA,EAAG,gBAAgB,CAAoD,kDAAA,CAAA;QACrE,CAAqE,mEAAA,CAAA;QACrE,CAAiD,+CAAA,CAAA;QACjD,CAA4C,0CAAA,CAAA,CAC/C,CACF;AACH;AAEA,SAAS,kBAAkB,CAAC,KAAa,EAAA;AACvC,IAAA,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,CAAC;AACnD,IAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,gDAAA,CAAA,EAAG,gBAAgB,CAAoD,kDAAA,CAAA;QACrE,CAAqE,mEAAA,CAAA;QACrE,CAA0E,wEAAA,CAAA;QAC1E,CAAuD,qDAAA,CAAA,CAC1D,CACF;AACH;;ACnIA;AACA,MAAM,mCAAmC,GAAG,IAAI,GAAG,CAAC,CAAC,WAAW,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC;AAE1F;;;;;;;;;;;;;;;;;AAiBG;AACU,MAAA,0BAA0B,GAAG,IAAI,cAAc,CAC1D,SAAS,GAAG,4BAA4B,GAAG,EAAE;AAG/C;;;;;;AAMG;MAEU,qBAAqB,CAAA;AACxB,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAEnC;;;AAGG;IACK,eAAe,GAAuB,IAAI;AAElD;;AAEG;AACK,IAAA,WAAW,GAAG,IAAI,GAAG,EAAU;AAE/B,IAAA,MAAM,GAAkB,IAAI,CAAC,QAAQ,CAAC,WAAW;AAEjD,IAAA,SAAS,GAAG,IAAI,GAAG,CAAS,mCAAmC,CAAC;AAExE,IAAA,WAAA,GAAA;QACE,aAAa,CAAC,yBAAyB,CAAC;AACxC,QAAA,MAAM,SAAS,GAAG,MAAM,CAAC,0BAA0B,EAAE,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC;QACtE,IAAI,SAAS,EAAE;AACb,YAAA,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC;;;AAI7B,IAAA,iBAAiB,CAAC,OAA0C,EAAA;AAClE,QAAA,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;AAC1B,YAAA,WAAW,CAAC,OAAO,EAAE,CAAC,MAAM,KAAI;gBAC9B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;AAC7C,aAAC,CAAC;;aACG;YACL,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;;;AAIhD;;;;;;AAMG;IACH,gBAAgB,CAAC,YAAoB,EAAE,aAAqB,EAAA;AAC1D,QAAA,IAAI,OAAO,YAAY,KAAK,WAAW,IAAI,YAAY;YAAE;QAEzD,MAAM,MAAM,GAAG,MAAM,CAAC,YAAY,EAAE,IAAI,CAAC,MAAO,CAAC;QACjD,IAAI,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC;YAAE;;QAGhF,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC;;;;;AAMnC,QAAA,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,oBAAoB,EAAE;AAEpD,QAAA,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;YAC5C,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAAA,IAAA,6DAEhB,GAAG,mBAAmB,CAAC,aAAa,CAAC,CAA+C,6CAAA,CAAA;gBAClF,CAAsF,oFAAA,CAAA;gBACtF,CAAkF,gFAAA,CAAA;gBAClF,CAA4C,0CAAA,CAAA;AAC5C,gBAAA,CAAA,+BAAA,EAAkC,MAAM,CAAC,MAAM,CAAI,EAAA,CAAA,CACtD,CACF;;;IAIG,oBAAoB,GAAA;AAC1B,QAAA,MAAM,cAAc,GAAG,IAAI,GAAG,EAAU;QACxC,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,gBAAgB,CAAkB,sBAAsB,CAAC;AACrF,QAAA,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;AACxB,YAAA,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,MAAO,CAAC;AAC3C,YAAA,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC;;AAEhC,QAAA,OAAO,cAAc;;IAGvB,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,eAAe,EAAE,KAAK,EAAE;AAC7B,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;;kHApFf,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAArB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,cADT,MAAM,EAAA,CAAA;;sGAClB,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBADjC,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;AAyFhC;;;AAGG;AACH,SAAS,WAAW,CAAI,KAAoB,EAAE,EAAsB,EAAA;AAClE,IAAA,KAAK,IAAI,KAAK,IAAI,KAAK,EAAE;QACvB,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,KAAK,EAAE,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC;;AAE7D;;AC7IA;;;;;AAKG;AACI,MAAM,8BAA8B,GAAG,CAAC;AAE/C;;;;;;AAMG;AACI,MAAM,gBAAgB,GAAG,IAAI,cAAc,CAChD,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,GAAG,+BAA+B,GAAG,EAAE,EACpF;AACE,IAAA,UAAU,EAAE,MAAM;AAClB,IAAA,OAAO,EAAE,MAAM,IAAI,GAAG,EAAU;AACjC,CAAA,CACF;;ACZD;;;;;;;AAOG;MAEU,kBAAkB,CAAA;AACZ,IAAA,eAAe,GAAG,MAAM,CAAC,gBAAgB,CAAC;AAC1C,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;IACpC,UAAU,GAAG,KAAK;AAE1B;;;;;;;;;;;;;;;AAeG;AACH,IAAA,oBAAoB,CAAC,QAAmB,EAAE,GAAW,EAAE,MAAe,EAAE,KAAc,EAAA;AACpF,QAAA,IACE,SAAS;YACT,CAAC,IAAI,CAAC,UAAU;AAChB,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,IAAI,8BAA8B,EAC3D;AACA,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI;AACtB,YAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,wDAEhB,CAAiE,+DAAA,CAAA;AAC/D,gBAAA,CAAA,EAAG,8BAA8B,CAAmC,iCAAA,CAAA;gBACpE,CAAmE,iEAAA,CAAA;gBACnE,CAA8E,4EAAA,CAAA,CACjF,CACF;;QAGH,IAAI,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;YACjC;;AAGF,QAAA,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;QAE7B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;QAC9C,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,EAAE,OAAO,CAAC;QAC7C,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,MAAM,EAAE,GAAG,CAAC;QAC3C,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,CAAC;QAChD,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,eAAe,EAAE,MAAM,CAAC;QAEvD,IAAI,KAAK,EAAE;YACT,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,YAAY,EAAE,KAAK,CAAC;;QAGrD,IAAI,MAAM,EAAE;YACV,QAAQ,CAAC,YAAY,CAAC,OAAO,EAAE,aAAa,EAAE,MAAM,CAAC;;QAGvD,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;;kHA3DxC,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAlB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,kBAAkB,cADN,MAAM,EAAA,CAAA;;sGAClB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAD9B,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;;ACwBhC;;;;;;AAMG;AACH,MAAM,8BAA8B,GAAG,EAAE;AAEzC;;;AAGG;AACH,MAAM,6BAA6B,GAAG,2BAA2B;AAEjE;;;AAGG;AACH,MAAM,+BAA+B,GAAG,mCAAmC;AAE3E;;;;AAIG;AACI,MAAM,2BAA2B,GAAG,CAAC;AAE5C;;;AAGG;AACI,MAAM,8BAA8B,GAAG,CAAC;AAE/C;;AAEG;AACH,MAAM,0BAA0B,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;AAEzC;;AAEG;AACH,MAAM,0BAA0B,GAAG,GAAG;AACtC;;AAEG;AACH,MAAM,sBAAsB,GAAG,GAAG;AAElC;;;;AAIG;AACH,MAAM,yBAAyB,GAAG,IAAI;AAEtC;;;AAGG;AACH,MAAM,wBAAwB,GAAG,IAAI;AACrC,MAAM,yBAAyB,GAAG,IAAI;AAEtC;;AAEG;AACI,MAAM,uBAAuB,GAAG,EAAE;AAEzC;;;AAGG;AACH,MAAM,2BAA2B,GAAG,IAAI;AAExC;;;;;;;;AAQG;AACI,MAAM,mBAAmB,GAAG,IAAI;AAChC,MAAM,oBAAoB,GAAG,KAAK;AAEzC;AACO,MAAM,gBAAgB,GAAG;IAC9B,eAAe;IACf,kBAAkB;IAClB,oBAAoB;IACpB,iBAAiB;CAClB;AAED;;AAEG;AACH,MAAM,wBAAwB,GAAG,EAAE;AAEnC;;;;AAIG;AACH,IAAI,6BAA6B,GAAG,CAAC;AAmBrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgGG;MAeU,gBAAgB,CAAA;AACnB,IAAA,WAAW,GAAG,MAAM,CAAC,YAAY,CAAC;IAClC,MAAM,GAAgB,aAAa,CAAC,MAAM,CAACC,aAAY,CAAC,CAAC;AACzD,IAAA,QAAQ,GAAG,MAAM,CAAC,SAAS,CAAC;AAC5B,IAAA,UAAU,GAAqB,MAAM,CAAC,UAAU,CAAC,CAAC,aAAa;AAC/D,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;;;AAI3B,IAAA,WAAW;AAEnB;;;;;AAKG;IACK,YAAY,GAAkB,IAAI;AAE1C;;;;AAIG;AACgD,IAAA,KAAK;AAExD;;;;;;;;;;AAUG;AACM,IAAA,QAAQ;AAEjB;;;AAGG;AACM,IAAA,KAAK;AAEd;;;AAGG;AACkC,IAAA,KAAK;AAE1C;;;AAGG;AACkC,IAAA,MAAM;AAE3C;;;;;;;AAOG;AACM,IAAA,OAAO;AAEhB;;AAEG;IACmC,QAAQ,GAAG,KAAK;AAEtD;;AAEG;AACM,IAAA,YAAY;AAErB;;AAEG;IACmC,sBAAsB,GAAG,KAAK;AAEpE;;;AAGG;IACmC,IAAI,GAAG,KAAK;AAElD;;AAEG;AACwC,IAAA,WAAW;AAEtD;;;AAGG;AACM,IAAA,iBAAiB;AAE1B;;;;;AAKG;AACM,IAAA,GAAG;AAEZ;;;;;AAKG;AACM,IAAA,MAAM;AAEf,IAAA,WAAA,GAAA;QACE,IAAI,SAAS,EAAE;YACb,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,gBAAgB,CAAC;;;AAItD,YAAA,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;AACrC,YAAA,UAAU,CAAC,SAAS,CAAC,MAAK;gBACxB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,EAAE;oBAChD,IAAI,CAAC,WAAY,CAAC,eAAe,CAAC,IAAI,CAAC,YAAY,CAAC;;AAExD,aAAC,CAAC;;;;IAKN,QAAQ,GAAA;QACNC,uBAAsB,CAAC,kBAAkB,CAAC;QAE1C,IAAI,SAAS,EAAE;YACb,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC;YACxC,mBAAmB,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC;AAC9C,YAAA,mBAAmB,CAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC;YACxC,sBAAsB,CAAC,IAAI,CAAC;AAC5B,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,yBAAyB,CAAC,IAAI,CAAC;;YAEjC,oBAAoB,CAAC,IAAI,CAAC;YAC1B,gBAAgB,CAAC,IAAI,CAAC;AACtB,YAAA,IAAI,IAAI,CAAC,IAAI,EAAE;gBACb,yBAAyB,CAAC,IAAI,CAAC;;;AAG/B,gBAAA,MAAM,CAAC,iBAAiB,CAAC,MACvB,2BAA2B,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAClE;;iBACI;gBACL,4BAA4B,CAAC,IAAI,CAAC;AAClC,gBAAA,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;oBAC7B,qBAAqB,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,CAAC;;AAEpD,gBAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;oBAC5B,qBAAqB,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC;;;;AAIlD,gBAAA,MAAM,CAAC,iBAAiB,CAAC,MACvB,uBAAuB,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAC9D;;YAEH,uBAAuB,CAAC,IAAI,CAAC;AAC7B,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,oBAAoB,CAAC,IAAI,CAAC;;AAE5B,YAAA,sBAAsB,CAAC,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC;YAC9C,6BAA6B,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;AAC3D,YAAA,6BAA6B,CAAC,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC;AACrD,YAAA,iCAAiC,CAAC,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC;AAEzD,YAAA,MAAM,CAAC,iBAAiB,CAAC,MAAK;AAC5B,gBAAA,IAAI,CAAC,WAAY,CAAC,aAAa,CAAC,IAAI,CAAC,eAAe,EAAE,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC;AACpF,aAAC,CAAC;AAEF,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,qBAAqB,CAAC;AACxD,gBAAA,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,eAAe,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC;gBAE5D,IAAI,OAAO,YAAY,KAAK,WAAW,IAAI,CAAC,YAAY,EAAE;oBACxD,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,cAAc,CAAC;oBACxD,gCAAgC,CAAC,cAAc,CAAC;;;;AAItD,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,YAAA,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC,UAAU,CAAC;;QAE/C,IAAI,CAAC,iBAAiB,EAAE;;IAGlB,iBAAiB,GAAA;;;AAGvB,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;AACb,YAAA,IAAI,CAAC,KAAK,KAAK,OAAO;;aACjB;AACL,YAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,KAAM,CAAC,QAAQ,EAAE,CAAC;AACtD,YAAA,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAO,CAAC,QAAQ,EAAE,CAAC;;QAG1D,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC3D,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,IAAI,CAAC,gBAAgB,EAAE,CAAC;;;AAI/D,QAAA,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,MAAM,CAAC;;;AAIvC,QAAA,MAAM,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE;AAEjD,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,IAAI,IAAI,CAAC,kBAAkB,EAAE,KAAK,MAAM,EAAE;gBACxC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC;;iBAChD;gBACL,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC;;;aAEvC;YACL,IACE,IAAI,CAAC,QAAQ;AACb,gBAAA,6BAA6B,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjD,gBAAA,IAAI,CAAC,kBAAkB,EAAE,KAAK,MAAM,EACpC;AACA,gBAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,aAAa,CAAC;;;QAIjD,IAAI,OAAO,YAAY,KAAK,WAAW,IAAI,YAAY,IAAI,IAAI,CAAC,QAAQ,EAAE;YACxE,MAAM,kBAAkB,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,kBAAkB,CAAC;AAChE,YAAA,kBAAkB,CAAC,oBAAoB,CACrC,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,eAAe,EAAE,EACtB,eAAe,EACf,IAAI,CAAC,KAAK,CACX;;;;AAKL,IAAA,WAAW,CAAC,OAAsB,EAAA;QAChC,IAAI,SAAS,EAAE;AACb,YAAA,2BAA2B,CAAC,IAAI,EAAE,OAAO,EAAE;gBACzC,UAAU;gBACV,OAAO;gBACP,QAAQ;gBACR,UAAU;gBACV,MAAM;gBACN,SAAS;gBACT,OAAO;gBACP,cAAc;gBACd,wBAAwB;AACzB,aAAA,CAAC;;AAEJ,QAAA,IAAI,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,aAAa,EAAE,EAAE;AACzD,YAAA,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY;AAChC,YAAA,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC;YAE7B,IAAI,SAAS,EAAE;AACb,gBAAA,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY;gBAChC,IAAI,MAAM,IAAI,MAAM,IAAI,MAAM,KAAK,MAAM,EAAE;oBACzC,MAAM,MAAM,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC;AACxC,oBAAA,MAAM,CAAC,iBAAiB,CAAC,MAAK;wBAC5B,IAAI,CAAC,WAAY,CAAC,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC;AAC/C,qBAAC,CAAC;;;;AAKR,QAAA,IACE,SAAS;AACT,YAAA,OAAO,CAAC,aAAa,CAAC,EAAE,YAAY;YACpC,OAAO,YAAY,KAAK,WAAW;YACnC,CAAC,YAAY,EACb;AACA,YAAA,2BAA2B,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC;;;AAI9C,IAAA,eAAe,CACrB,yBAAkE,EAAA;QAElE,IAAI,eAAe,GAAsB,yBAAyB;AAClE,QAAA,IAAI,IAAI,CAAC,YAAY,EAAE;AACrB,YAAA,eAAe,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY;;AAElD,QAAA,OAAO,IAAI,CAAC,WAAW,CAAC,eAAe,CAAC;;IAGlC,kBAAkB,GAAA;QACxB,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,KAAK,SAAS,EAAE;YAChD,OAAO,IAAI,CAAC,OAAO;;QAErB,OAAO,IAAI,CAAC,QAAQ,GAAG,OAAO,GAAG,MAAM;;IAGjC,gBAAgB,GAAA;QACtB,OAAO,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,MAAM;;IAGhC,eAAe,GAAA;;;;AAIrB,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,MAAM,SAAS,GAAG,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAC;;YAEnC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC;;QAErD,OAAO,IAAI,CAAC,YAAY;;IAGlB,kBAAkB,GAAA;QACxB,MAAM,WAAW,GAAG,6BAA6B,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;AACrE,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC;aACpB,KAAK,CAAC,GAAG;aACT,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,KAAK,EAAE;AAC1B,aAAA,GAAG,CAAC,CAAC,MAAM,KAAI;AACd,YAAA,MAAM,GAAG,MAAM,CAAC,IAAI,EAAE;YACtB,MAAM,KAAK,GAAG,WAAW,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG,UAAU,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,KAAM;AACjF,YAAA,OAAO,GAAG,IAAI,CAAC,eAAe,CAAC,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAC,CAAC,CAAI,CAAA,EAAA,MAAM,EAAE;AACtE,SAAC,CAAC;AACJ,QAAA,OAAO,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGrB,kBAAkB,GAAA;AACxB,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACd,YAAA,OAAO,IAAI,CAAC,mBAAmB,EAAE;;aAC5B;AACL,YAAA,OAAO,IAAI,CAAC,cAAc,EAAE;;;IAIxB,mBAAmB,GAAA;AACzB,QAAA,MAAM,EAAC,WAAW,EAAC,GAAG,IAAI,CAAC,MAAM;QAEjC,IAAI,mBAAmB,GAAG,WAAY;QACtC,IAAI,IAAI,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,OAAO,EAAE;;;AAGlC,YAAA,mBAAmB,GAAG,WAAY,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,0BAA0B,CAAC;;AAGrF,QAAA,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,CACvC,CAAC,EAAE,KAAK,CAAG,EAAA,IAAI,CAAC,eAAe,CAAC,EAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,EAAC,CAAC,CAAA,CAAA,EAAI,EAAE,CAAA,CAAA,CAAG,CACvE;AACD,QAAA,OAAO,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGrB,kBAAkB,CAAC,cAAc,GAAG,KAAK,EAAA;QAC/C,IAAI,cAAc,EAAE;;;AAGlB,YAAA,IAAI,CAAC,YAAY,GAAG,IAAI;;AAG1B,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE;AAC3C,QAAA,IAAI,CAAC,gBAAgB,CAAC,KAAK,EAAE,YAAY,CAAC;QAE1C,IAAI,eAAe,GAAuB,SAAS;AACnD,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,YAAA,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE;;AACtC,aAAA,IAAI,IAAI,CAAC,6BAA6B,EAAE,EAAE;AAC/C,YAAA,eAAe,GAAG,IAAI,CAAC,kBAAkB,EAAE;;QAG7C,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,CAAC,gBAAgB,CAAC,QAAQ,EAAE,eAAe,CAAC;;AAElD,QAAA,OAAO,eAAe;;IAGhB,cAAc,GAAA;AACpB,QAAA,MAAM,SAAS,GAAG,0BAA0B,CAAC,GAAG,CAC9C,CAAC,UAAU,KACT,CAAA,EAAG,IAAI,CAAC,eAAe,CAAC;YACtB,GAAG,EAAE,IAAI,CAAC,KAAK;AACf,YAAA,KAAK,EAAE,IAAI,CAAC,KAAM,GAAG,UAAU;AAChC,SAAA,CAAC,CAAI,CAAA,EAAA,UAAU,CAAG,CAAA,CAAA,CACtB;AACD,QAAA,OAAO,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGrB,6BAA6B,GAAA;QACnC,IAAI,cAAc,GAAG,KAAK;AAC1B,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,cAAc;gBACZ,IAAI,CAAC,KAAM,GAAG,wBAAwB,IAAI,IAAI,CAAC,MAAO,GAAG,yBAAyB;;AAEtF,QAAA,QACE,CAAC,IAAI,CAAC,sBAAsB;YAC5B,CAAC,IAAI,CAAC,MAAM;YACZ,IAAI,CAAC,WAAW,KAAK,eAAe;YACpC,CAAC,cAAc;;AAInB;;;;AAIG;AACK,IAAA,mBAAmB,CAAC,gBAAkC,EAAA;AAC5D,QAAA,MAAM,EAAC,qBAAqB,EAAC,GAAG,IAAI,CAAC,MAAM;AAC3C,QAAA,IAAI,gBAAgB,KAAK,IAAI,EAAE;AAC7B,YAAA,OAAO,CAAO,IAAA,EAAA,IAAI,CAAC,eAAe,CAAC;gBACjC,GAAG,EAAE,IAAI,CAAC,KAAK;AACf,gBAAA,KAAK,EAAE,qBAAqB;AAC5B,gBAAA,aAAa,EAAE,IAAI;AACpB,aAAA,CAAC,GAAG;;AACA,aAAA,IAAI,OAAO,gBAAgB,KAAK,QAAQ,EAAE;YAC/C,OAAO,CAAA,IAAA,EAAO,gBAAgB,CAAA,CAAA,CAAG;;AAEnC,QAAA,OAAO,IAAI;;AAGb;;;AAGG;AACK,IAAA,qBAAqB,CAAC,iBAA0C,EAAA;QACtE,IAAI,CAAC,iBAAiB,IAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE;AACnE,YAAA,OAAO,IAAI;;AAEb,QAAA,OAAO,OAAO,CAAC,iBAAiB,CAAC,IAAI,CAAC;;AAGhC,IAAA,uBAAuB,CAAC,GAAqB,EAAA;QACnD,MAAM,QAAQ,GAAG,MAAK;YACpB,MAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,iBAAiB,CAAC;AAC9D,YAAA,oBAAoB,EAAE;AACtB,YAAA,qBAAqB,EAAE;AACvB,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK;YACxB,iBAAiB,CAAC,YAAY,EAAE;AAClC,SAAC;AAED,QAAA,MAAM,oBAAoB,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC;AACxE,QAAA,MAAM,qBAAqB,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,EAAE,QAAQ,CAAC;AAE1E,QAAA,yBAAyB,CAAC,GAAG,EAAE,QAAQ,CAAC;;IAGlC,gBAAgB,CAAC,IAAY,EAAE,KAAa,EAAA;AAClD,QAAA,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC;;kHA9b/C,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,IAAA,EAAA,gBAAgB,EAskCpB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,aAAa,CArhCD,EAAA,QAAA,EAAA,UAAA,EAAA,KAAA,EAAA,OAAA,EAAA,KAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,eAAe,CAMf,EAAA,MAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,eAAe,CAef,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,CAAA,UAAA,EAAA,UAAA,EAAA,gBAAgB,CAUhB,EAAA,YAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,CAAA,wBAAA,EAAA,wBAAA,EAAA,gBAAgB,CAMhB,EAAA,IAAA,EAAA,CAAA,MAAA,EAAA,MAAA,EAAA,gBAAgB,+CAy/BrB,qBAAqB,CAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,GAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,gBAAA,EAAA,4BAAA,EAAA,aAAA,EAAA,wBAAA,EAAA,cAAA,EAAA,wBAAA,EAAA,aAAA,EAAA,qBAAA,EAAA,uBAAA,EAAA,gCAAA,EAAA,2BAAA,EAAA,kCAAA,EAAA,yBAAA,EAAA,oCAAA,EAAA,wBAAA,EAAA,uDAAA,EAAA,cAAA,EAAA,iFAAA,EAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGA/kCxB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAd5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACtB,oBAAA,IAAI,EAAE;AACJ,wBAAA,kBAAkB,EAAE,0BAA0B;AAC9C,wBAAA,eAAe,EAAE,sBAAsB;AACvC,wBAAA,gBAAgB,EAAE,sBAAsB;AACxC,wBAAA,eAAe,EAAE,mBAAmB;AACpC,wBAAA,yBAAyB,EAAE,8BAA8B;AACzD,wBAAA,6BAA6B,EAAE,gCAAgC;AAC/D,wBAAA,2BAA2B,EAAE,kCAAkC;AAC/D,wBAAA,0BAA0B,EAAE,uDAAuD;wBACnF,gBAAgB,EAAE,CAAmE,gEAAA,EAAA,uBAAuB,CAAa,WAAA,CAAA;AAC1H,qBAAA;AACF,iBAAA;wDAyBoD,KAAK,EAAA,CAAA;sBAAvD,KAAK;AAAC,gBAAA,IAAA,EAAA,CAAA,EAAC,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC;gBAaxC,QAAQ,EAAA,CAAA;sBAAhB;gBAMQ,KAAK,EAAA,CAAA;sBAAb;gBAMoC,KAAK,EAAA,CAAA;sBAAzC,KAAK;uBAAC,EAAC,SAAS,EAAE,eAAe,EAAC;gBAME,MAAM,EAAA,CAAA;sBAA1C,KAAK;uBAAC,EAAC,SAAS,EAAE,eAAe,EAAC;gBAU1B,OAAO,EAAA,CAAA;sBAAf;gBAKqC,QAAQ,EAAA,CAAA;sBAA7C,KAAK;uBAAC,EAAC,SAAS,EAAE,gBAAgB,EAAC;gBAK3B,YAAY,EAAA,CAAA;sBAApB;gBAKqC,sBAAsB,EAAA,CAAA;sBAA3D,KAAK;uBAAC,EAAC,SAAS,EAAE,gBAAgB,EAAC;gBAME,IAAI,EAAA,CAAA;sBAAzC,KAAK;uBAAC,EAAC,SAAS,EAAE,gBAAgB,EAAC;gBAKO,WAAW,EAAA,CAAA;sBAArD,KAAK;uBAAC,EAAC,SAAS,EAAE,qBAAqB,EAAC;gBAMhC,iBAAiB,EAAA,CAAA;sBAAzB;gBAQQ,GAAG,EAAA,CAAA;sBAAX;gBAQQ,MAAM,EAAA,CAAA;sBAAd;;AAiVH;AAEA;;AAEG;AACH,SAAS,aAAa,CAAC,MAAmB,EAAA;IACxC,IAAI,iBAAiB,GAA6B,EAAE;AACpD,IAAA,IAAI,MAAM,CAAC,WAAW,EAAE;QACtB,iBAAiB,CAAC,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;;AAE1E,IAAA,OAAO,MAAM,CAAC,MAAM,CAAC,EAAE,EAAEC,sBAAqB,EAAE,MAAM,EAAE,iBAAiB,CAAC;AAC5E;AAEA;AAEA;;AAEG;AACH,SAAS,sBAAsB,CAAC,GAAqB,EAAA;AACnD,IAAA,IAAI,GAAG,CAAC,GAAG,EAAE;QACX,MAAM,IAAIJ,aAAY,CAAA,IAAA,6CAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA6C,2CAAA,CAAA;YAC5E,CAA0D,wDAAA,CAAA;YAC1D,CAAsF,oFAAA,CAAA;AACtF,YAAA,CAAA,iDAAA,CAAmD,CACtD;;AAEL;AAEA;;AAEG;AACH,SAAS,yBAAyB,CAAC,GAAqB,EAAA;AACtD,IAAA,IAAI,GAAG,CAAC,MAAM,EAAE;QACd,MAAM,IAAIA,aAAY,CAAA,IAAA,gDAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAmD,iDAAA,CAAA;YAClF,CAA0D,wDAAA,CAAA;YAC1D,CAA8E,4EAAA,CAAA;AAC9E,YAAA,CAAA,kEAAA,CAAoE,CACvE;;AAEL;AAEA;;AAEG;AACH,SAAS,oBAAoB,CAAC,GAAqB,EAAA;IACjD,IAAI,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE;AAC5B,IAAA,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;AAC7B,QAAA,IAAI,KAAK,CAAC,MAAM,GAAG,8BAA8B,EAAE;YACjD,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,8BAA8B,CAAC,GAAG,KAAK;;AAEpE,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,CAAwC,sCAAA,CAAA;AAC9E,YAAA,CAAA,CAAA,EAAI,KAAK,CAA+D,6DAAA,CAAA;YACxE,CAAuE,qEAAA,CAAA;AACvE,YAAA,CAAA,qEAAA,CAAuE,CAC1E;;AAEL;AAEA;;AAEG;AACH,SAAS,oBAAoB,CAAC,GAAqB,EAAA;AACjD,IAAA,IAAI,KAAK,GAAG,GAAG,CAAC,KAAK;AACrB,IAAA,IAAI,KAAK,EAAE,KAAK,CAAC,mBAAmB,CAAC,EAAE;AACrC,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,CAA2C,yCAAA,CAAA;YACjF,CAA4F,0FAAA,CAAA;YAC5F,CAAkF,gFAAA,CAAA;AAClF,YAAA,CAAA,6FAAA,CAA+F,CAClG;;AAEL;AAEA,SAAS,sBAAsB,CAAC,GAAqB,EAAE,WAAwB,EAAA;IAC7E,2CF2AA2C,CAAC,GAAG,CAAC;AAChD,IAAA,wCAAwC,CAAC,GAAG,EAAE,WAAW,CAAC;IAC1D,wBAAwB,CAAC,GAAG,CAAC;AAC/B;AAEA;;AAEG;AACH,SAAS,2CAA2C,CAAC,GAAqB,EAAA;IACxE,IAAI,GAAG,CAAC,iBAAiB,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE;AAC7C,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CACpB,GAAG,CAAC,KAAK,EACT,KAAK,CACN,CAAsD,oDAAA,CAAA;AACrD,YAAA,CAAA,+EAAA,CAAiF,CACpF;;AAEL;AAEA;;;AAGG;AACH,SAAS,wCAAwC,CAAC,GAAqB,EAAE,WAAwB,EAAA;IAC/F,IAAI,GAAG,CAAC,WAAW,KAAK,IAAI,IAAI,WAAW,KAAK,eAAe,EAAE;QAC/D,MAAM,IAAIA,aAAY,CAAA,IAAA,kDAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAoD,kDAAA,CAAA;YACnF,CAAsE,oEAAA,CAAA;YACtE,CAA6F,2FAAA,CAAA;AAC7F,YAAA,CAAA,qFAAA,CAAuF,CAC1F;;AAEL;AAEA;;AAEG;AACH,SAAS,wBAAwB,CAAC,GAAqB,EAAA;IACrD,IACE,GAAG,CAAC,WAAW;AACf,QAAA,OAAO,GAAG,CAAC,WAAW,KAAK,QAAQ;QACnC,GAAG,CAAC,WAAW,CAAC,UAAU,CAAC,OAAO,CAAC,EACnC;QACA,IAAI,GAAG,CAAC,WAAW,CAAC,MAAM,GAAG,oBAAoB,EAAE;YACjD,MAAM,IAAIA,aAAY,CAAA,IAAA,+CAEpB,CAAG,EAAA,mBAAmB,CACpB,GAAG,CAAC,KAAK,CACV,CAAsE,oEAAA,CAAA;AACrE,gBAAA,CAAA,KAAA,EAAQ,oBAAoB,CAA0E,wEAAA,CAAA;gBACtG,CAAqG,mGAAA,CAAA;AACrG,gBAAA,CAAA,+BAAA,CAAiC,CACpC;;QAEH,IAAI,GAAG,CAAC,WAAW,CAAC,MAAM,GAAG,mBAAmB,EAAE;AAChD,YAAA,OAAO,CAAC,IAAI,CACVC,mBAAkB,CAEhB,IAAA,+CAAA,CAAA,EAAG,mBAAmB,CACpB,GAAG,CAAC,KAAK,CACV,CAAsE,oEAAA,CAAA;AACrE,gBAAA,CAAA,KAAA,EAAQ,mBAAmB,CAAiE,+DAAA,CAAA;gBAC5F,CAA+G,6GAAA,CAAA;gBAC/G,CAA0C,wCAAA,CAAA,CAC7C,CACF;;;AAGP;AAEA;;AAEG;AACH,SAAS,gBAAgB,CAAC,GAAqB,EAAA;IAC7C,MAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI,EAAE;AAC9B,IAAA,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,EAAE;AAC7B,QAAA,MAAM,IAAID,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAqC,kCAAA,EAAA,KAAK,CAAK,GAAA,CAAA;YAC9E,CAAiE,+DAAA,CAAA;YACjE,CAAuE,qEAAA,CAAA;AACvE,YAAA,CAAA,oEAAA,CAAsE,CACzE;;AAEL;AAEA;;AAEG;AACH,SAAS,mBAAmB,CAAC,GAAqB,EAAE,IAAY,EAAE,KAAc,EAAA;AAC9E,IAAA,MAAM,QAAQ,GAAG,OAAO,KAAK,KAAK,QAAQ;IAC1C,MAAM,aAAa,GAAG,QAAQ,IAAI,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE;AACrD,IAAA,IAAI,CAAC,QAAQ,IAAI,aAAa,EAAE;AAC9B,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAM,GAAA,EAAA,IAAI,CAA0B,wBAAA,CAAA;YACnE,CAAM,GAAA,EAAA,KAAK,CAA2D,yDAAA,CAAA,CACzE;;AAEL;AAEA;;AAEG;AACa,SAAA,mBAAmB,CAAC,GAAqB,EAAE,KAAc,EAAA;IACvE,IAAI,KAAK,IAAI,IAAI;QAAE;AACnB,IAAA,mBAAmB,CAAC,GAAG,EAAE,UAAU,EAAE,KAAK,CAAC;IAC3C,MAAM,SAAS,GAAG,KAAe;IACjC,MAAM,sBAAsB,GAAG,6BAA6B,CAAC,IAAI,CAAC,SAAS,CAAC;IAC5E,MAAM,wBAAwB,GAAG,+BAA+B,CAAC,IAAI,CAAC,SAAS,CAAC;IAEhF,IAAI,wBAAwB,EAAE;AAC5B,QAAA,qBAAqB,CAAC,GAAG,EAAE,SAAS,CAAC;;AAGvC,IAAA,MAAM,aAAa,GAAG,sBAAsB,IAAI,wBAAwB;IACxE,IAAI,CAAC,aAAa,EAAE;AAClB,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAyC,sCAAA,EAAA,KAAK,CAAO,KAAA,CAAA;YACpF,CAAqF,mFAAA,CAAA;AACrF,YAAA,CAAA,uEAAA,CAAyE,CAC5E;;AAEL;AAEA,SAAS,qBAAqB,CAAC,GAAqB,EAAE,KAAa,EAAA;IACjE,MAAM,eAAe,GAAG;SACrB,KAAK,CAAC,GAAG;AACT,SAAA,KAAK,CAAC,CAAC,GAAG,KAAK,GAAG,KAAK,EAAE,IAAI,UAAU,CAAC,GAAG,CAAC,IAAI,2BAA2B,CAAC;IAC/E,IAAI,CAAC,eAAe,EAAE;QACpB,MAAM,IAAIA,aAAY,CAAA,IAAA,uCAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA0D,wDAAA,CAAA;AACzF,YAAA,CAAA,EAAA,EAAK,KAAK,CAAmE,iEAAA,CAAA;AAC7E,YAAA,CAAA,EAAG,8BAA8B,CAAuC,qCAAA,CAAA;AACxE,YAAA,CAAA,EAAG,2BAA2B,CAA8D,4DAAA,CAAA;AAC5F,YAAA,CAAA,aAAA,EAAgB,8BAA8B,CAAuC,qCAAA,CAAA;YACrF,CAA0F,wFAAA,CAAA;YAC1F,CAAG,EAAA,2BAA2B,CAAoE,kEAAA,CAAA,CACrG;;AAEL;AAEA;;;AAGG;AACH,SAAS,wBAAwB,CAAC,GAAqB,EAAE,SAAiB,EAAA;AACxE,IAAA,IAAI,MAAe;IACnB,IAAI,SAAS,KAAK,OAAO,IAAI,SAAS,KAAK,QAAQ,EAAE;QACnD,MAAM;AACJ,YAAA,CAAA,WAAA,EAAc,SAAS,CAA6C,2CAAA,CAAA;AACpE,gBAAA,CAAA,0EAAA,CAA4E;;SACzE;QACL,MAAM;AACJ,YAAA,CAAA,eAAA,EAAkB,SAAS,CAA4C,0CAAA,CAAA;AACvE,gBAAA,CAAA,iEAAA,CAAmE;;AAEvE,IAAA,OAAO,IAAIA,aAAY,CAErB,IAAA,iDAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAM,GAAA,EAAA,SAAS,CAAuC,qCAAA,CAAA;AACrF,QAAA,CAAA,oEAAA,EAAuE,MAAM,CAAG,CAAA,CAAA;AAChF,QAAA,CAAA,6BAAA,EAAgC,SAAS,CAAuB,qBAAA,CAAA;AAChE,QAAA,CAAA,yEAAA,CAA2E,CAC9E;AACH;AAEA;;AAEG;AACH,SAAS,2BAA2B,CAClC,GAAqB,EACrB,OAAsB,EACtB,MAAgB,EAAA;AAEhB,IAAA,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;QACvB,MAAM,SAAS,GAAG,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC;QAC/C,IAAI,SAAS,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,aAAa,EAAE,EAAE;AAChD,YAAA,IAAI,KAAK,KAAK,OAAO,EAAE;;;;;gBAKrB,GAAG,GAAG,EAAC,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC,aAAa,EAAqB;;AAEjE,YAAA,MAAM,wBAAwB,CAAC,GAAG,EAAE,KAAK,CAAC;;AAE9C,KAAC,CAAC;AACJ;AAEA;;AAEG;AACH,SAAS,qBAAqB,CAAC,GAAqB,EAAE,UAAmB,EAAE,SAAiB,EAAA;IAC1F,MAAM,WAAW,GAAG,OAAO,UAAU,KAAK,QAAQ,IAAI,UAAU,GAAG,CAAC;IACpE,MAAM,WAAW,GACf,OAAO,UAAU,KAAK,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,IAAI,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC;AAC/F,IAAA,IAAI,CAAC,WAAW,IAAI,CAAC,WAAW,EAAE;AAChC,QAAA,MAAM,IAAIA,aAAY,CAEpB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAM,GAAA,EAAA,SAAS,CAA2B,yBAAA,CAAA;YACzE,CAA0B,uBAAA,EAAA,SAAS,CAAgC,8BAAA,CAAA,CACtE;;AAEL;AAEA;;;;AAIG;AACH,SAAS,uBAAuB,CAC9B,GAAqB,EACrB,GAAqB,EACrB,QAAmB,EAAA;IAEnB,MAAM,QAAQ,GAAG,MAAK;AACpB,QAAA,oBAAoB,EAAE;AACtB,QAAA,qBAAqB,EAAE;QACvB,MAAM,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,GAAG,CAAC;QAClD,IAAI,aAAa,GAAG,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;QACvE,IAAI,cAAc,GAAG,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QACzE,MAAM,SAAS,GAAG,aAAa,CAAC,gBAAgB,CAAC,YAAY,CAAC;AAE9D,QAAA,IAAI,SAAS,KAAK,YAAY,EAAE;YAC9B,MAAM,UAAU,GAAG,aAAa,CAAC,gBAAgB,CAAC,aAAa,CAAC;YAChE,MAAM,YAAY,GAAG,aAAa,CAAC,gBAAgB,CAAC,eAAe,CAAC;YACpE,MAAM,aAAa,GAAG,aAAa,CAAC,gBAAgB,CAAC,gBAAgB,CAAC;YACtE,MAAM,WAAW,GAAG,aAAa,CAAC,gBAAgB,CAAC,cAAc,CAAC;YAClE,aAAa,IAAI,UAAU,CAAC,YAAY,CAAC,GAAG,UAAU,CAAC,WAAW,CAAC;YACnE,cAAc,IAAI,UAAU,CAAC,UAAU,CAAC,GAAG,UAAU,CAAC,aAAa,CAAC;;AAGtE,QAAA,MAAM,mBAAmB,GAAG,aAAa,GAAG,cAAc;QAC1D,MAAM,yBAAyB,GAAG,aAAa,KAAK,CAAC,IAAI,cAAc,KAAK,CAAC;AAE7E,QAAA,MAAM,cAAc,GAAG,GAAG,CAAC,YAAY;AACvC,QAAA,MAAM,eAAe,GAAG,GAAG,CAAC,aAAa;AACzC,QAAA,MAAM,oBAAoB,GAAG,cAAc,GAAG,eAAe;AAE7D,QAAA,MAAM,aAAa,GAAG,GAAG,CAAC,KAAM;AAChC,QAAA,MAAM,cAAc,GAAG,GAAG,CAAC,MAAO;AAClC,QAAA,MAAM,mBAAmB,GAAG,aAAa,GAAG,cAAc;;;;;;AAO1D,QAAA,MAAM,oBAAoB,GACxB,IAAI,CAAC,GAAG,CAAC,mBAAmB,GAAG,oBAAoB,CAAC,GAAG,sBAAsB;QAC/E,MAAM,iBAAiB,GACrB,yBAAyB;YACzB,IAAI,CAAC,GAAG,CAAC,oBAAoB,GAAG,mBAAmB,CAAC,GAAG,sBAAsB;QAE/E,IAAI,oBAAoB,EAAE;AACxB,YAAA,OAAO,CAAC,IAAI,CACVC,mBAAkB,CAEhB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAgD,8CAAA,CAAA;gBAC/E,CAAiE,+DAAA,CAAA;gBACjE,CAA2B,wBAAA,EAAA,cAAc,CAAO,IAAA,EAAA,eAAe,CAAI,EAAA,CAAA;AACnE,gBAAA,CAAA,eAAA,EAAkB,KAAK,CACrB,oBAAoB,CACrB,CAA6C,2CAAA,CAAA;gBAC9C,CAAG,EAAA,aAAa,OAAO,cAAc,CAAA,iBAAA,EAAoB,KAAK,CAC5D,mBAAmB,CACpB,CAAK,GAAA,CAAA;gBACN,CAAwD,sDAAA,CAAA,CAC3D,CACF;;aACI,IAAI,iBAAiB,EAAE;AAC5B,YAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA0C,wCAAA,CAAA;gBACzE,CAAqD,mDAAA,CAAA;gBACrD,CAA2B,wBAAA,EAAA,cAAc,CAAO,IAAA,EAAA,eAAe,CAAI,EAAA,CAAA;AACnE,gBAAA,CAAA,eAAA,EAAkB,KAAK,CAAC,oBAAoB,CAAC,CAA4B,0BAAA,CAAA;gBACzE,CAAG,EAAA,aAAa,CAAO,IAAA,EAAA,cAAc,CAAmB,iBAAA,CAAA;AACxD,gBAAA,CAAA,EAAG,KAAK,CAAC,mBAAmB,CAAC,CAAoD,kDAAA,CAAA;gBACjF,CAAsE,oEAAA,CAAA;gBACtE,CAAmE,iEAAA,CAAA;gBACnE,CAAuE,qEAAA,CAAA;gBACvE,CAAa,WAAA,CAAA,CAChB,CACF;;AACI,aAAA,IAAI,CAAC,GAAG,CAAC,QAAQ,IAAI,yBAAyB,EAAE;;AAErD,YAAA,MAAM,gBAAgB,GAAG,8BAA8B,GAAG,aAAa;AACvE,YAAA,MAAM,iBAAiB,GAAG,8BAA8B,GAAG,cAAc;AACzE,YAAA,MAAM,cAAc,GAAG,cAAc,GAAG,gBAAgB,IAAI,yBAAyB;AACrF,YAAA,MAAM,eAAe,GAAG,eAAe,GAAG,iBAAiB,IAAI,yBAAyB;AACxF,YAAA,IAAI,cAAc,IAAI,eAAe,EAAE;AACrC,gBAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,yCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAwC,sCAAA,CAAA;oBACvE,CAAyB,uBAAA,CAAA;oBACzB,CAA0B,uBAAA,EAAA,aAAa,CAAO,IAAA,EAAA,cAAc,CAAK,GAAA,CAAA;oBACjE,CAA2B,wBAAA,EAAA,cAAc,CAAO,IAAA,EAAA,eAAe,CAAK,GAAA,CAAA;oBACpE,CAAuC,oCAAA,EAAA,gBAAgB,CAAO,IAAA,EAAA,iBAAiB,CAAK,GAAA,CAAA;oBACpF,CAAmF,iFAAA,CAAA;AACnF,oBAAA,CAAA,EAAG,8BAA8B,CAA8C,4CAAA,CAAA;oBAC/E,CAA0D,wDAAA,CAAA,CAC7D,CACF;;;AAGP,KAAC;AAED,IAAA,MAAM,oBAAoB,GAAG,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC;;;;;IAMnE,MAAM,qBAAqB,GAAG,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,EAAE,MAAK;AAC/D,QAAA,oBAAoB,EAAE;AACtB,QAAA,qBAAqB,EAAE;AACzB,KAAC,CAAC;AAEF,IAAA,yBAAyB,CAAC,GAAG,EAAE,QAAQ,CAAC;AAC1C;AAEA;;AAEG;AACH,SAAS,4BAA4B,CAAC,GAAqB,EAAA;IACzD,IAAI,iBAAiB,GAAG,EAAE;AAC1B,IAAA,IAAI,GAAG,CAAC,KAAK,KAAK,SAAS;AAAE,QAAA,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC;AAC5D,IAAA,IAAI,GAAG,CAAC,MAAM,KAAK,SAAS;AAAE,QAAA,iBAAiB,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC9D,IAAA,IAAI,iBAAiB,CAAC,MAAM,GAAG,CAAC,EAAE;QAChC,MAAM,IAAID,aAAY,CAAA,IAAA,gDAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA6B,2BAAA,CAAA;AAC5D,YAAA,CAAA,aAAA,EAAgB,iBAAiB,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,CAAI,CAAA,EAAA,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAI,EAAA,CAAA;YAC3E,CAAsF,oFAAA,CAAA;YACtF,CAAmF,iFAAA,CAAA;AACnF,YAAA,CAAA,wCAAA,CAA0C,CAC7C;;AAEL;AAEA;;;AAGG;AACH,SAAS,yBAAyB,CAAC,GAAqB,EAAA;IACtD,IAAI,GAAG,CAAC,KAAK,IAAI,GAAG,CAAC,MAAM,EAAE;QAC3B,MAAM,IAAIA,aAAY,CAAA,IAAA,uCAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA0D,wDAAA,CAAA;YACzF,CAAkG,gGAAA,CAAA;AAClG,YAAA,CAAA,kEAAA,CAAoE,CACvE;;AAEL;AAEA;;;AAGG;AACH,SAAS,2BAA2B,CAClC,GAAqB,EACrB,GAAqB,EACrB,QAAmB,EAAA;IAEnB,MAAM,QAAQ,GAAG,MAAK;AACpB,QAAA,oBAAoB,EAAE;AACtB,QAAA,qBAAqB,EAAE;AACvB,QAAA,MAAM,cAAc,GAAG,GAAG,CAAC,YAAY;QACvC,IAAI,GAAG,CAAC,IAAI,IAAI,cAAc,KAAK,CAAC,EAAE;AACpC,YAAA,OAAO,CAAC,IAAI,CACVC,mBAAkB,CAEhB,IAAA,uCAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA8C,4CAAA,CAAA;gBAC7E,CAAiF,+EAAA,CAAA;gBACjF,CAA4E,0EAAA,CAAA;gBAC5E,CAA8E,4EAAA,CAAA;gBAC9E,CAA6D,2DAAA,CAAA,CAChE,CACF;;AAEL,KAAC;AAED,IAAA,MAAM,oBAAoB,GAAG,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC;;IAGnE,MAAM,qBAAqB,GAAG,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,EAAE,MAAK;AAC/D,QAAA,oBAAoB,EAAE;AACtB,QAAA,qBAAqB,EAAE;AACzB,KAAC,CAAC;AAEF,IAAA,yBAAyB,CAAC,GAAG,EAAE,QAAQ,CAAC;AAC1C;AAEA;;;AAGG;AACH,SAAS,uBAAuB,CAAC,GAAqB,EAAA;IACpD,IAAI,GAAG,CAAC,OAAO,IAAI,GAAG,CAAC,QAAQ,EAAE;QAC/B,MAAM,IAAID,aAAY,CAAA,IAAA,uCAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA6B,2BAAA,CAAA;YAC5D,CAAmD,iDAAA,CAAA;YACnD,CAAwD,sDAAA,CAAA;YACxD,CAAsD,oDAAA,CAAA;AACtD,YAAA,CAAA,oEAAA,CAAsE,CACzE;;IAEH,MAAM,WAAW,GAAG,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC;AAC7C,IAAA,IAAI,OAAO,GAAG,CAAC,OAAO,KAAK,QAAQ,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;QACzE,MAAM,IAAIA,aAAY,CAAA,IAAA,uCAEpB,CAAG,EAAA,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA6B,2BAAA,CAAA;YAC5D,CAA2B,wBAAA,EAAA,GAAG,CAAC,OAAO,CAAO,KAAA,CAAA;AAC7C,YAAA,CAAA,gEAAA,CAAkE,CACrE;;AAEL;AAEA;;;;;;;;AAQG;AACH,SAAS,6BAA6B,CAAC,KAAa,EAAE,WAAwB,EAAA;AAC5E,IAAA,IAAI,WAAW,KAAK,eAAe,EAAE;QACnC,IAAI,iBAAiB,GAAG,EAAE;AAC1B,QAAA,KAAK,MAAM,MAAM,IAAI,gBAAgB,EAAE;AACrC,YAAA,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;AACzB,gBAAA,iBAAiB,GAAG,MAAM,CAAC,IAAI;gBAC/B;;;QAGJ,IAAI,iBAAiB,EAAE;AACrB,YAAA,OAAO,CAAC,IAAI,CACVC,mBAAkB,qDAEhB,CAAmE,iEAAA,CAAA;AACjE,gBAAA,CAAA,EAAG,iBAAiB,CAA4C,0CAAA,CAAA;gBAChE,CAA8D,4DAAA,CAAA;AAC9D,gBAAA,CAAA,iCAAA,EAAoC,iBAAiB,CAAa,WAAA,CAAA;gBAClE,CAAiE,+DAAA,CAAA;gBACjE,CAAgE,8DAAA,CAAA;gBAChE,CAA6D,2DAAA,CAAA,CAChE,CACF;;;AAGP;AAEA;;AAEG;AACH,SAAS,6BAA6B,CAAC,GAAqB,EAAE,WAAwB,EAAA;IACpF,IAAI,GAAG,CAAC,QAAQ,IAAI,WAAW,KAAK,eAAe,EAAE;AACnD,QAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,kDAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAA6C,2CAAA,CAAA;YAC5E,CAAsE,oEAAA,CAAA;YACtE,CAA4E,0EAAA,CAAA;YAC5E,CAAoF,kFAAA,CAAA,CACvF,CACF;;AAEL;AAEA;;;AAGG;AACH,SAAS,iCAAiC,CAAC,GAAqB,EAAE,WAAwB,EAAA;IACxF,IAAI,GAAG,CAAC,YAAY,IAAI,WAAW,KAAK,eAAe,EAAE;AACvD,QAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,kDAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAiD,+CAAA,CAAA;YAChF,CAAsE,oEAAA,CAAA;YACtE,CAA2F,yFAAA,CAAA;YAC3F,CAA+F,6FAAA,CAAA,CAClG,CACF;;AAEL;AAEA;;AAEG;AACH,eAAe,gCAAgC,CAAC,MAAsB,EAAA;AACpE,IAAA,IAAI,6BAA6B,KAAK,CAAC,EAAE;AACvC,QAAA,6BAA6B,EAAE;AAC/B,QAAA,MAAM,MAAM,CAAC,UAAU,EAAE;AACzB,QAAA,IAAI,6BAA6B,GAAG,wBAAwB,EAAE;YAC5D,OAAO,CAAC,IAAI,CACVA,mBAAkB,2DAEhB,CAAuE,oEAAA,EAAA,wBAAwB,CAAW,QAAA,EAAA,6BAA6B,CAAW,SAAA,CAAA;gBAChJ,CAAoG,kGAAA,CAAA;gBACpG,CAAmF,iFAAA,CAAA,CACtF,CACF;;;SAEE;AACL,QAAA,6BAA6B,EAAE;;AAEnC;AAEA;;;;AAIG;AACH,SAAS,2BAA2B,CAAC,GAAqB,EAAE,UAA4B,EAAA;IACtF,MAAM,aAAa,GAAG,MAAM,CAAC,gBAAgB,CAAC,UAAU,CAAC;IACzD,IAAI,aAAa,GAAG,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACvE,IAAI,cAAc,GAAG,UAAU,CAAC,aAAa,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAEzE,IAAI,aAAa,GAAG,2BAA2B,IAAI,cAAc,GAAG,2BAA2B,EAAE;AAC/F,QAAA,OAAO,CAAC,IAAI,CACVA,mBAAkB,CAEhB,IAAA,8DAAA,CAAA,EAAG,mBAAmB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAiD,+CAAA,CAAA;AAChF,YAAA,CAAA,mEAAA,EAAsE,2BAA2B,CAAM,IAAA,CAAA;YACvG,CAAoD,kDAAA,CAAA,CACvD,CACF;;AAEL;AAEA,SAAS,yBAAyB,CAAC,GAAqB,EAAE,QAAsB,EAAA;;;;;;;;;;;IAW9E,IAAI,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,YAAY,EAAE;AACpC,QAAA,QAAQ,EAAE;;AAEd;AAEA,SAAS,KAAK,CAAC,KAAa,EAAA;AAC1B,IAAA,OAAO,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC3D;AAEA;AACA;AACA,SAAS,aAAa,CAAC,KAAyB,EAAA;AAC9C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,QAAA,OAAO,KAAK;;AAEd,IAAA,OAAOI,gBAAe,CAAC,KAAK,CAAC;AAC/B;AAEA;AACA;AACM,SAAU,qBAAqB,CAAC,KAAuB,EAAA;AAC3D,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,MAAM,IAAI,KAAK,KAAK,OAAO,IAAI,KAAK,KAAK,EAAE,EAAE;AACtF,QAAA,OAAO,KAAK;;AAEd,IAAA,OAAO,gBAAgB,CAAC,KAAK,CAAC;AAChC;;;;"}%dx/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import * as i0 from '@angular/core'; import { Optional, Inject, Injectable, ɵgetLocalePluralCase as _getLocalePluralCase, ɵfindLocaleData as _findLocaleData, ɵLocaleDataIndex as _LocaleDataIndex, ɵgetLocaleCurrencyCode as _getLocaleCurrencyCode, LOCALE_ID, ɵstringify as _stringify, Input, Directive, createNgModule, NgModuleRef, ɵRuntimeError as _RuntimeError, Host, Attribute, RendererStyleFlags2, ɵisPromise as _isPromise, ɵisSubscribable as _isSubscribable, untracked, Pipe, InjectionToken, DEFAULT_CURRENCY_CODE, NgModule } from '@angular/core'; import { LocationStrategy, joinWithSlash, normalizeQueryParams, PlatformLocation, APP_BASE_HREF } from './location-Dq4mJT-A.mjs'; /** * @description * A {@link LocationStrategy} used to configure the {@link Location} service to * represent its state in the * [hash fragment](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) * of the browser's URL. * * For instance, if you call `location.go('/foo')`, the browser's URL will become * `example.com#/foo`. * * @usageNotes * * ### Example * * {@example common/location/ts/hash_location_component.ts region='LocationComponent'} * * @publicApi */ class HashLocationStrategy extends LocationStrategy { _platformLocation; _baseHref = ''; _removeListenerFns = []; constructor(_platformLocation, _baseHref) { super(); this._platformLocation = _platformLocation; if (_baseHref != null) { this._baseHref = _baseHref; } } /** @docs-private */ ngOnDestroy() { while (this._removeListenerFns.length) { this._removeListenerFns.pop()(); } } onPopState(fn) { this._removeListenerFns.push(this._platformLocation.onPopState(fn), this._platformLocation.onHashChange(fn)); } getBaseHref() { return this._baseHref; } path(includeHash = false) { // the hash value is always prefixed with a `#` // and if it is empty then it will stay empty const path = this._platformLocation.hash ?? '#'; return path.length > 0 ? path.substring(1) : path; } prepareExternalUrl(internal) { const url = joinWithSlash(this._baseHref, internal); return url.length > 0 ? '#' + url : url; } pushState(state, title, path, queryParams) { const url = this.prepareExternalUrl(path + normalizeQueryParams(queryParams)) || this._platformLocation.pathname; this._platformLocation.pushState(state, title, url); } replaceState(state, title, path, queryParams) { const url = this.prepareExternalUrl(path + normalizeQueryParams(queryParams)) || this._platformLocation.pathname; this._platformLocation.replaceState(state, title, url); } forward() { this._platformLocation.forward(); } back() { this._platformLocation.back(); } getState() { return this._platformLocation.getState(); } historyGo(relativePosition = 0) { this._platformLocation.historyGo?.(relativePosition); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HashLocationStrategy, deps: [{ token: PlatformLocation }, { token: APP_BASE_HREF, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HashLocationStrategy }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HashLocationStrategy, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: PlatformLocation }, { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_BASE_HREF] }] }] }); /** @internal */ const CURRENCIES_EN = { "ADP": [undefined, undefined, 0], "AFN": [undefined, "؋", 0], "ALL": [undefined, undefined, 0], "AMD": [undefined, "֏", 2], "AOA": [undefined, "Kz"], "ARS": [undefined, "$"], "AUD": ["A$", "$"], "AZN": [undefined, "₼"], "BAM": [undefined, "KM"], "BBD": [undefined, "$"], "BDT": [undefined, "৳"], "BHD": [undefined, undefined, 3], "BIF": [undefined, undefined, 0], "BMD": [undefined, "$"], "BND": [undefined, "$"], "BOB": [undefined, "Bs"], "BRL": ["R$"], "BSD": [undefined, "$"], "BWP": [undefined, "P"], "BYN": [undefined, undefined, 2], "BYR": [undefined, undefined, 0], "BZD": [undefined, "$"], "CAD": ["CA$", "$", 2], "CHF": [undefined, undefined, 2], "CLF": [undefined, undefined, 4], "CLP": [undefined, "$", 0], "CNY": ["CN¥", "¥"], "COP": [undefined, "$", 2], "CRC": [undefined, "₡", 2], "CUC": [undefined, "$"], "CUP": [undefined, "$"], "CZK": [undefined, "Kč", 2], "DJF": [undefined, undefined, 0], "DKK": [undefined, "kr", 2], "DOP": [undefined, "$"], "EGP": [undefined, "E£"], "ESP": [undefined, "₧", 0], "EUR": ["€"], "FJD": [undefined, "$"], "FKP": [undefined, "£"], "GBP": ["£"], "GEL": [undefined, "₾"], "GHS": [undefined, "GH₵"], "GIP": [undefined, "£"], "GNF": [undefined, "FG", 0], "GTQ": [undefined, "Q"], "GYD": [undefined, "$", 2], "HKD": ["HK$", "$"], "HNL": [undefined, "L"], "HRK": [undefined, "kn"], "HUF": [undefined, "Ft", 2], "IDR": [undefined, "Rp", 2], "ILS": ["₪"], "INR": ["₹"], "IQD": [undefined, undefined, 0], "IRR": [undefined, undefined, 0], "ISK": [undefined, "kr", 0], "ITL": [undefined, undefined, 0], "JMD": [undefined, "$"], "JOD": [undefined, undefined, 3], "JPY": ["¥", undefined, 0], "KHR": [undefined, "៛"], "KMF": [undefined, "CF", 0], "KPW": [undefined, "₩", 0], "KRW": ["₩", undefined, 0], "KWD": [undefined, undefined, 3], "KYD": [undefined, "$"], "KZT": [undefined, "₸"], "LAK": [undefined, "₭", 0], "LBP": [undefined, "L£", 0], "LKR": [undefined, "Rs"], "LRD": [undefined, "$"], "LTL": [undefined, "Lt"], "LUF": [undefined, undefined, 0], "LVL": [undefined, "Ls"], "LYD": [undefined, undefined, 3], "MGA": [undefined, "Ar", 0], "MGF": [undefined, undefined, 0], "MMK": [undefined, "K", 0], "MNT": [undefined, "₮", 2], "MRO": [undefined, undefined, 0], "MUR": [undefined, "Rs", 2], "MXN": ["MX$", "$"], "MYR": [undefined, "RM"], "NAD": [undefined, "$"], "NGN": [undefined, "₦"], "NIO": [undefined, "C$"], "NOK": [undefined, "kr", 2], "NPR": [undefined, "Rs"], "NZD": ["NZ$", "$"], "OMR": [undefined, undefined, 3], "PHP": ["₱"], "PKR": [undefined, "Rs", 2], "PLN": [undefined, "zł"], "PYG": [undefined, "₲", 0], "RON": [undefined, "lei"], "RSD": [undefined, undefined, 0], "RUB": [undefined, "₽"], "RWF": [undefined, "RF", 0], "SBD": [undefined, "$"], "SEK": [undefined, "kr", 2], "SGD": [undefined, "$"], "SHP": [undefined, "£"], "SLE": [undefined, undefined, 2], "SLL": [undefined, undefined, 0], "SOS": [undefined, undefined, 0], "SRD": [undefined, "$"], "SSP": [undefined, "£"], "STD": [undefined, undefined, 0], "STN": [undefined, "Db"], "SYP": [undefined, "£", 0], "THB": [undefined, "฿"], "TMM": [undefined, undefined, 0], "TND": [undefined, undefined, 3], "TOP": [undefined, "T$"], "TRL": [undefined, undefined, 0], "TRY": [undefined, "₺"], "TTD": [undefined, "$"], "TWD": ["NT$", "$", 2], "TZS": [undefined, undefined, 2], "UAH": [undefined, "₴"], "UGX": [undefined, undefined, 0], "USD": ["$"], "UYI": [undefined, undefined, 0], "UYU": [undefined, "$"], "UYW": [undefined, undefined, 4], "UZS": [undefined, undefined, 2], "VEF": [undefined, "Bs", 2], "VND": ["₫", undefined, 0], "VUV": [undefined, undefined, 0], "XAF": ["FCFA", undefined, 0], "XCD": ["EC$", "$"], "XOF": ["F CFA", undefined, 0], "XPF": ["CFPF", undefined, 0], "XXX": ["¤"], "YER": [undefined, undefined, 0], "ZAR": [undefined, "R"], "ZMK": [undefined, undefined, 0], "ZMW": [undefined, "ZK"], "ZWD": [undefined, undefined, 0] }; /** * Format styles that can be used to represent numbers. * @see {@link getLocaleNumberFormat} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated `getLocaleNumberFormat` is deprecated */ var NumberFormatStyle; (function (NumberFormatStyle) { NumberFormatStyle[NumberFormatStyle["Decimal"] = 0] = "Decimal"; NumberFormatStyle[NumberFormatStyle["Percent"] = 1] = "Percent"; NumberFormatStyle[NumberFormatStyle["Currency"] = 2] = "Currency"; NumberFormatStyle[NumberFormatStyle["Scientific"] = 3] = "Scientific"; })(NumberFormatStyle || (NumberFormatStyle = {})); /** * Plurality cases used for translating plurals to different languages. * * @see {@link NgPlural} * @see {@link NgPluralCase} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated `getLocalePluralCase` is deprecated */ var Plural; (function (Plural) { Plural[Plural["Zero"] = 0] = "Zero"; Plural[Plural["One"] = 1] = "One"; Plural[Plural["Two"] = 2] = "Two"; Plural[Plural["Few"] = 3] = "Few"; Plural[Plural["Many"] = 4] = "Many"; Plural[Plural["Other"] = 5] = "Other"; })(Plural || (Plural = {})); /** * Context-dependant translation forms for strings. * Typically the standalone version is for the nominative form of the word, * and the format version is used for the genitive case. * @see [CLDR website](http://cldr.unicode.org/translation/date-time-1/date-time#TOC-Standalone-vs.-Format-Styles) * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated locale data getters are deprecated */ var FormStyle; (function (FormStyle) { FormStyle[FormStyle["Format"] = 0] = "Format"; FormStyle[FormStyle["Standalone"] = 1] = "Standalone"; })(FormStyle || (FormStyle = {})); /** * String widths available for translations. * The specific character widths are locale-specific. * Examples are given for the word "Sunday" in English. * * @publicApi * * @deprecated locale data getters are deprecated */ var TranslationWidth; (function (TranslationWidth) { /** 1 character for `en-US`. For example: 'S' */ TranslationWidth[TranslationWidth["Narrow"] = 0] = "Narrow"; /** 3 characters for `en-US`. For example: 'Sun' */ TranslationWidth[TranslationWidth["Abbreviated"] = 1] = "Abbreviated"; /** Full length for `en-US`. For example: "Sunday" */ TranslationWidth[TranslationWidth["Wide"] = 2] = "Wide"; /** 2 characters for `en-US`, For example: "Su" */ TranslationWidth[TranslationWidth["Short"] = 3] = "Short"; })(TranslationWidth || (TranslationWidth = {})); /** * String widths available for date-time formats. * The specific character widths are locale-specific. * Examples are given for `en-US`. * * @see {@link getLocaleDateFormat} * @see {@link getLocaleTimeFormat} * @see {@link getLocaleDateTimeFormat} * @see [Internationalization (i18n) Guide](guide/i18n) * @publicApi * * @deprecated Date locale data getters are deprecated */ var FormatWidth; (function (FormatWidth) { /** * For `en-US`, `'M/d/yy, h:mm a'` * (Example: `6/15/15, 9:03 AM`) */ FormatWidth[FormatWidth["Short"] = 0] = "Short"; /** * For `en-US`, `'MMM d, y, h:mm:ss a'` * (Example: `Jun 15, 2015, 9:03:01 AM`) */ FormatWidth[FormatWidth["Medium"] = 1] = "Medium"; /** * For `en-US`, `'MMMM d, y, h:mm:ss a z'` * (Example: `June 15, 2015 at 9:03:01 AM GMT+1`) */ FormatWidth[FormatWidth["Long"] = 2] = "Long"; /** * For `en-US`, `'EEEE, MMMM d, y, h:mm:ss a zzzz'` * (Example: `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00`) */ FormatWidth[FormatWidth["Full"] = 3] = "Full"; })(FormatWidth || (FormatWidth = {})); // This needs to be an object literal, rather than an enum, because TypeScript 5.4+ // doesn't allow numeric keys and we have `Infinity` and `NaN`. /** * Symbols that can be used to replace placeholders in number patterns. * Examples are based on `en-US` values. * * @see {@link getLocaleNumberSymbol} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated `getLocaleNumberSymbol` is deprecated * * @object-literal-as-enum */ const NumberSymbol = { /** * Decimal separator. * For `en-US`, the dot character. * Example: 2,345`.`67 */ Decimal: 0, /** * Grouping separator, typically for thousands. * For `en-US`, the comma character. * Example: 2`,`345.67 */ Group: 1, /** * List-item separator. * Example: "one, two, and three" */ List: 2, /** * Sign for percentage (out of 100). * Example: 23.4% */ PercentSign: 3, /** * Sign for positive numbers. * Example: +23 */ PlusSign: 4, /** * Sign for negative numbers. * Example: -23 */ MinusSign: 5, /** * Computer notation for exponential value (n times a power of 10). * Example: 1.2E3 */ Exponential: 6, /** * Human-readable format of exponential. * Example: 1.2x103 */ SuperscriptingExponent: 7, /** * Sign for permille (out of 1000). * Example: 23.4‰ */ PerMille: 8, /** * Infinity, can be used with plus and minus. * Example: ∞, +∞, -∞ */ Infinity: 9, /** * Not a number. * Example: NaN */ NaN: 10, /** * Symbol used between time units. * Example: 10:52 */ TimeSeparator: 11, /** * Decimal separator for currency values (fallback to `Decimal`). * Example: $2,345.67 */ CurrencyDecimal: 12, /** * Group separator for currency values (fallback to `Group`). * Example: $2,345.67 */ CurrencyGroup: 13, }; /** * The value for each day of the week, based on the `en-US` locale * * @publicApi * * @deprecated Week locale getters are deprecated */ var WeekDay; (function (WeekDay) { WeekDay[WeekDay["Sunday"] = 0] = "Sunday"; WeekDay[WeekDay["Monday"] = 1] = "Monday"; WeekDay[WeekDay["Tuesday"] = 2] = "Tuesday"; WeekDay[WeekDay["Wednesday"] = 3] = "Wednesday"; WeekDay[WeekDay["Thursday"] = 4] = "Thursday"; WeekDay[WeekDay["Friday"] = 5] = "Friday"; WeekDay[WeekDay["Saturday"] = 6] = "Saturday"; })(WeekDay || (WeekDay = {})); /** * Retrieves the locale ID from the currently loaded locale. * The loaded locale could be, for example, a global one rather than a regional one. * @param locale A locale code, such as `fr-FR`. * @returns The locale code. For example, `fr`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * This function serves no purpose when relying on the `Intl` API. */ function getLocaleId(locale) { return _findLocaleData(locale)[_LocaleDataIndex.LocaleId]; } /** * Retrieves day period strings for the given locale. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized period strings. For example, `[AM, PM]` for `en-US`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleDayPeriods(locale, formStyle, width) { const data = _findLocaleData(locale); const amPmData = [ data[_LocaleDataIndex.DayPeriodsFormat], data[_LocaleDataIndex.DayPeriodsStandalone], ]; const amPm = getLastDefinedValue(amPmData, formStyle); return getLastDefinedValue(amPm, width); } /** * Retrieves days of the week for the given locale, using the Gregorian calendar. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized name strings. * For example,`[Sunday, Monday, ... Saturday]` for `en-US`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleDayNames(locale, formStyle, width) { const data = _findLocaleData(locale); const daysData = [ data[_LocaleDataIndex.DaysFormat], data[_LocaleDataIndex.DaysStandalone], ]; const days = getLastDefinedValue(daysData, formStyle); return getLastDefinedValue(days, width); } /** * Retrieves months of the year for the given locale, using the Gregorian calendar. * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns An array of localized name strings. * For example, `[January, February, ...]` for `en-US`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleMonthNames(locale, formStyle, width) { const data = _findLocaleData(locale); const monthsData = [ data[_LocaleDataIndex.MonthsFormat], data[_LocaleDataIndex.MonthsStandalone], ]; const months = getLastDefinedValue(monthsData, formStyle); return getLastDefinedValue(months, width); } /** * Retrieves Gregorian-calendar eras for the given locale. * @param locale A locale code for the locale format rules to use. * @param width The required character width. * @returns An array of localized era strings. * For example, `[AD, BC]` for `en-US`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleEraNames(locale, width) { const data = _findLocaleData(locale); const erasData = data[_LocaleDataIndex.Eras]; return getLastDefinedValue(erasData, width); } /** * Retrieves the first day of the week for the given locale. * * @param locale A locale code for the locale format rules to use. * @returns A day index number, using the 0-based week-day index for `en-US` * (Sunday = 0, Monday = 1, ...). * For example, for `fr-FR`, returns 1 to indicate that the first day is Monday. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * 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). * You may want to rely on the following alternatives: * - Libraries like [`Luxon`](https://moment.github.io/luxon/#/) rely on `Intl` but fallback on the ISO 8601 definition (monday) if `getWeekInfo` is not supported. * - 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. */ function getLocaleFirstDayOfWeek(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.FirstDayOfWeek]; } /** * Range of week days that are considered the week-end for the given locale. * * @param locale A locale code for the locale format rules to use. * @returns The range of day values, `[startDay, endDay]`. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * 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). * 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 . */ function getLocaleWeekEndRange(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.WeekendRange]; } /** * Retrieves a localized date-value formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleDateFormat(locale, width) { const data = _findLocaleData(locale); return getLastDefinedValue(data[_LocaleDataIndex.DateFormat], width); } /** * Retrieves a localized time-value formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](guide/i18n) * @publicApi * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleTimeFormat(locale, width) { const data = _findLocaleData(locale); return getLastDefinedValue(data[_LocaleDataIndex.TimeFormat], width); } /** * Retrieves a localized date-time formatting string. * * @param locale A locale code for the locale format rules to use. * @param width The format type. * @returns The localized formatting string. * @see {@link FormatWidth} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.DateTimeFormat` for date formating instead. */ function getLocaleDateTimeFormat(locale, width) { const data = _findLocaleData(locale); const dateTimeFormatData = data[_LocaleDataIndex.DateTimeFormat]; return getLastDefinedValue(dateTimeFormatData, width); } /** * Retrieves a localized number symbol that can be used to replace placeholders in number formats. * @param locale The locale code. * @param symbol The symbol to localize. Must be one of `NumberSymbol`. * @returns The character for the localized symbol. * @see {@link NumberSymbol} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.NumberFormat` to format numbers instead. */ function getLocaleNumberSymbol(locale, symbol) { const data = _findLocaleData(locale); const res = data[_LocaleDataIndex.NumberSymbols][symbol]; if (typeof res === 'undefined') { if (symbol === NumberSymbol.CurrencyDecimal) { return data[_LocaleDataIndex.NumberSymbols][NumberSymbol.Decimal]; } else if (symbol === NumberSymbol.CurrencyGroup) { return data[_LocaleDataIndex.NumberSymbols][NumberSymbol.Group]; } } return res; } /** * Retrieves a number format for a given locale. * * Numbers are formatted using patterns, like `#,###.00`. For example, the pattern `#,###.00` * when used to format the number 12345.678 could result in "12'345,678". That would happen if the * grouping separator for your language is an apostrophe, and the decimal separator is a comma. * * Important: The characters `.` `,` `0` `#` (and others below) are special placeholders * that stand for the decimal separator, and so on, and are NOT real characters. * You must NOT "translate" the placeholders. For example, don't change `.` to `,` even though in * your language the decimal point is written with a comma. The symbols should be replaced by the * local equivalents, using the appropriate `NumberSymbol` for your language. * * Here are the special characters used in number patterns: * * | Symbol | Meaning | * |--------|---------| * | . | Replaced automatically by the character used for the decimal point. | * | , | Replaced by the "grouping" (thousands) separator. | * | 0 | Replaced by a digit (or zero if there aren't enough digits). | * | # | Replaced by a digit (or nothing if there aren't enough). | * | ¤ | Replaced by a currency symbol, such as $ or USD. | * | % | Marks a percent format. The % symbol may change position, but must be retained. | * | E | Marks a scientific format. The E symbol may change position, but must be retained. | * | ' | Special characters used as literal characters are quoted with ASCII single quotes. | * * @param locale A locale code for the locale format rules to use. * @param type The type of numeric value to be formatted (such as `Decimal` or `Currency`.) * @returns The localized format string. * @see {@link NumberFormatStyle} * @see [CLDR website](http://cldr.unicode.org/translation/number-patterns) * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Let `Intl.NumberFormat` determine the number format instead */ function getLocaleNumberFormat(locale, type) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.NumberFormats][type]; } /** * Retrieves the symbol used to represent the currency for the main country * corresponding to a given locale. For example, '$' for `en-US`. * * @param locale A locale code for the locale format rules to use. * @returns The localized symbol character, * or `null` if the main country cannot be determined. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Use the `Intl` API to format a currency with from currency code */ function getLocaleCurrencySymbol(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.CurrencySymbol] || null; } /** * Retrieves the name of the currency for the main country corresponding * to a given locale. For example, 'US Dollar' for `en-US`. * @param locale A locale code for the locale format rules to use. * @returns The currency name, * or `null` if the main country cannot be determined. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Use the `Intl` API to format a currency with from currency code */ function getLocaleCurrencyName(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.CurrencyName] || null; } /** * Retrieves the default currency code for the given locale. * * The default is defined as the first currency which is still in use. * * @param locale The code of the locale whose currency code we want. * @returns The code of the default currency for the given locale. * * @publicApi * * @deprecated We recommend you create a map of locale to ISO 4217 currency codes. * Time relative currency data is provided by the CLDR project. See https://www.unicode.org/cldr/charts/44/supplemental/detailed_territory_currency_information.html */ function getLocaleCurrencyCode(locale) { return _getLocaleCurrencyCode(locale); } /** * Retrieves the currency values for a given locale. * @param locale A locale code for the locale format rules to use. * @returns The currency values. * @see [Internationalization (i18n) Guide](guide/i18n) */ function getLocaleCurrencies(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.Currencies]; } /** * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Use `Intl.PluralRules` instead */ const getLocalePluralCase = _getLocalePluralCase; function checkFullData(data) { if (!data[_LocaleDataIndex.ExtraData]) { throw new Error(`Missing extra locale data for the locale "${data[_LocaleDataIndex.LocaleId]}". Use "registerLocaleData" to load new data. See the "I18n guide" on angular.io to know more.`); } } /** * Retrieves locale-specific rules used to determine which day period to use * when more than one period is defined for a locale. * * There is a rule for each defined day period. The * first rule is applied to the first day period and so on. * Fall back to AM/PM when no rules are available. * * A rule can specify a period as time range, or as a single time value. * * This functionality is only available when you have loaded the full locale data. * See the ["I18n guide"](guide/i18n/format-data-locale). * * @param locale A locale code for the locale format rules to use. * @returns The rules for the locale, a single time value or array of *from-time, to-time*, * or null if no periods are available. * * @see {@link getLocaleExtraDayPeriods} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * Let `Intl.DateTimeFormat` determine the day period instead. */ function getLocaleExtraDayPeriodRules(locale) { const data = _findLocaleData(locale); checkFullData(data); const rules = data[_LocaleDataIndex.ExtraData][2 /* ɵExtraLocaleDataIndex.ExtraDayPeriodsRules */] || []; return rules.map((rule) => { if (typeof rule === 'string') { return extractTime(rule); } return [extractTime(rule[0]), extractTime(rule[1])]; }); } /** * Retrieves locale-specific day periods, which indicate roughly how a day is broken up * in different languages. * For example, for `en-US`, periods are morning, noon, afternoon, evening, and midnight. * * This functionality is only available when you have loaded the full locale data. * See the ["I18n guide"](guide/i18n/format-data-locale). * * @param locale A locale code for the locale format rules to use. * @param formStyle The required grammatical form. * @param width The required character width. * @returns The translated day-period strings. * @see {@link getLocaleExtraDayPeriodRules} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * To extract a day period use `Intl.DateTimeFormat` with the `dayPeriod` option instead. */ function getLocaleExtraDayPeriods(locale, formStyle, width) { const data = _findLocaleData(locale); checkFullData(data); const dayPeriodsData = [ data[_LocaleDataIndex.ExtraData][0 /* ɵExtraLocaleDataIndex.ExtraDayPeriodFormats */], data[_LocaleDataIndex.ExtraData][1 /* ɵExtraLocaleDataIndex.ExtraDayPeriodStandalone */], ]; const dayPeriods = getLastDefinedValue(dayPeriodsData, formStyle) || []; return getLastDefinedValue(dayPeriods, width) || []; } /** * Retrieves the writing direction of a specified locale * @param locale A locale code for the locale format rules to use. * @publicApi * @returns 'rtl' or 'ltr' * @see [Internationalization (i18n) Guide](guide/i18n) * * @deprecated Angular recommends relying on the `Intl` API for i18n. * For dates and numbers, let `Intl.DateTimeFormat()` and `Intl.NumberFormat()` determine the writing direction. * The `Intl` alternative [`getTextInfo`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getTextInfo). * has only partial support (Chromium M99 & Safari 17). * 3rd party alternatives like [`rtl-detect`](https://www.npmjs.com/package/rtl-detect) can work around this issue. */ function getLocaleDirection(locale) { const data = _findLocaleData(locale); return data[_LocaleDataIndex.Directionality]; } /** * Retrieves the first value that is defined in an array, going backwards from an index position. * * To avoid repeating the same data (as when the "format" and "standalone" forms are the same) * add the first value to the locale data arrays, and add other values only if they are different. * * @param data The data array to retrieve from. * @param index A 0-based index into the array to start from. * @returns The value immediately before the given index position. * @see [Internationalization (i18n) Guide](guide/i18n) * */ function getLastDefinedValue(data, index) { for (let i = index; i > -1; i--) { if (typeof data[i] !== 'undefined') { return data[i]; } } throw new Error('Locale data API: locale data undefined'); } /** * Extracts the hours and minutes from a string like "15:45" */ function extractTime(time) { const [h, m] = time.split(':'); return { hours: +h, minutes: +m }; } /** * Retrieves the currency symbol for a given currency code. * * For example, for the default `en-US` locale, the code `USD` can * be represented by the narrow symbol `$` or the wide symbol `US$`. * * @param code The currency code. * @param format The format, `wide` or `narrow`. * @param locale A locale code for the locale format rules to use. * * @returns The symbol, or the currency code if no symbol is available. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * You can use `Intl.NumberFormat().formatToParts()` to extract the currency symbol. * For example: `Intl.NumberFormat('en', {style:'currency', currency: 'USD'}).formatToParts().find(part => part.type === 'currency').value` * returns `$` for USD currency code in the `en` locale. * Note: `US$` is a currency symbol for the `en-ca` locale but not the `en-us` locale. */ function getCurrencySymbol(code, format, locale = 'en') { const currency = getLocaleCurrencies(locale)[code] || CURRENCIES_EN[code] || []; const symbolNarrow = currency[1 /* ɵCurrencyIndex.SymbolNarrow */]; if (format === 'narrow' && typeof symbolNarrow === 'string') { return symbolNarrow; } return currency[0 /* ɵCurrencyIndex.Symbol */] || code; } // Most currencies have cents, that's why the default is 2 const DEFAULT_NB_OF_CURRENCY_DIGITS = 2; /** * Reports the number of decimal digits for a given currency. * The value depends upon the presence of cents in that particular currency. * * @param code The currency code. * @returns The number of decimal digits, typically 0 or 2. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi * * @deprecated Angular recommends relying on the `Intl` API for i18n. * This function should not be used anymore. Let `Intl.NumberFormat` determine the number of digits to display for the currency */ function getNumberOfCurrencyDigits(code) { let digits; const currency = CURRENCIES_EN[code]; if (currency) { digits = currency[2 /* ɵCurrencyIndex.NbOfDigits */]; } return typeof digits === 'number' ? digits : DEFAULT_NB_OF_CURRENCY_DIGITS; } const ISO8601_DATE_REGEX = /^(\d{4,})-?(\d\d)-?(\d\d)(?:T(\d\d)(?::?(\d\d)(?::?(\d\d)(?:\.(\d+))?)?)?(Z|([+-])(\d\d):?(\d\d))?)?$/; // 1 2 3 4 5 6 7 8 9 10 11 const NAMED_FORMATS = {}; const DATE_FORMATS_SPLIT = /((?:[^BEGHLMOSWYZabcdhmswyz']+)|(?:'(?:[^']|'')*')|(?:G{1,5}|y{1,4}|Y{1,4}|M{1,5}|L{1,5}|w{1,2}|W{1}|d{1,2}|E{1,6}|c{1,6}|a{1,5}|b{1,5}|B{1,5}|h{1,2}|H{1,2}|m{1,2}|s{1,2}|S{1,3}|z{1,4}|Z{1,5}|O{1,4}))([\s\S]*)/; /** * @ngModule CommonModule * @description * * Formats a date according to locale rules. * * @param value The date to format, as a Date, or a number (milliseconds since UTC epoch) * or an [ISO date-time string](https://www.w3.org/TR/NOTE-datetime). * @param format The date-time components to include. See `DatePipe` for details. * @param locale A locale code for the locale format rules to use. * @param timezone The time zone. A time zone offset from GMT (such as `'+0430'`). * If not specified, uses host system settings. * * @returns The formatted date string. * * @see {@link DatePipe} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi */ function formatDate(value, format, locale, timezone) { let date = toDate(value); const namedFormat = getNamedFormat(locale, format); format = namedFormat || format; let parts = []; let match; while (format) { match = DATE_FORMATS_SPLIT.exec(format); if (match) { parts = parts.concat(match.slice(1)); const part = parts.pop(); if (!part) { break; } format = part; } else { parts.push(format); break; } } let dateTimezoneOffset = date.getTimezoneOffset(); if (timezone) { dateTimezoneOffset = timezoneToOffset(timezone, dateTimezoneOffset); date = convertTimezoneToLocal(date, timezone); } let text = ''; parts.forEach((value) => { const dateFormatter = getDateFormatter(value); text += dateFormatter ? dateFormatter(date, locale, dateTimezoneOffset) : value === "''" ? "'" : value.replace(/(^'|'$)/g, '').replace(/''/g, "'"); }); return text; } /** * Create a new Date object with the given date value, and the time set to midnight. * * We cannot use `new Date(year, month, date)` because it maps years between 0 and 99 to 1900-1999. * See: https://github.com/angular/angular/issues/40377 * * Note that this function returns a Date object whose time is midnight in the current locale's * timezone. In the future we might want to change this to be midnight in UTC, but this would be a * considerable breaking change. */ function createDate(year, month, date) { // The `newDate` is set to midnight (UTC) on January 1st 1970. // - In PST this will be December 31st 1969 at 4pm. // - In GMT this will be January 1st 1970 at 1am. // Note that they even have different years, dates and months! const newDate = new Date(0); // `setFullYear()` allows years like 0001 to be set correctly. This function does not // change the internal time of the date. // Consider calling `setFullYear(2019, 8, 20)` (September 20, 2019). // - In PST this will now be September 20, 2019 at 4pm // - In GMT this will now be September 20, 2019 at 1am newDate.setFullYear(year, month, date); // We want the final date to be at local midnight, so we reset the time. // - In PST this will now be September 20, 2019 at 12am // - In GMT this will now be September 20, 2019 at 12am newDate.setHours(0, 0, 0); return newDate; } function getNamedFormat(locale, format) { const localeId = getLocaleId(locale); NAMED_FORMATS[localeId] ??= {}; if (NAMED_FORMATS[localeId][format]) { return NAMED_FORMATS[localeId][format]; } let formatValue = ''; switch (format) { case 'shortDate': formatValue = getLocaleDateFormat(locale, FormatWidth.Short); break; case 'mediumDate': formatValue = getLocaleDateFormat(locale, FormatWidth.Medium); break; case 'longDate': formatValue = getLocaleDateFormat(locale, FormatWidth.Long); break; case 'fullDate': formatValue = getLocaleDateFormat(locale, FormatWidth.Full); break; case 'shortTime': formatValue = getLocaleTimeFormat(locale, FormatWidth.Short); break; case 'mediumTime': formatValue = getLocaleTimeFormat(locale, FormatWidth.Medium); break; case 'longTime': formatValue = getLocaleTimeFormat(locale, FormatWidth.Long); break; case 'fullTime': formatValue = getLocaleTimeFormat(locale, FormatWidth.Full); break; case 'short': const shortTime = getNamedFormat(locale, 'shortTime'); const shortDate = getNamedFormat(locale, 'shortDate'); formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Short), [ shortTime, shortDate, ]); break; case 'medium': const mediumTime = getNamedFormat(locale, 'mediumTime'); const mediumDate = getNamedFormat(locale, 'mediumDate'); formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Medium), [ mediumTime, mediumDate, ]); break; case 'long': const longTime = getNamedFormat(locale, 'longTime'); const longDate = getNamedFormat(locale, 'longDate'); formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Long), [ longTime, longDate, ]); break; case 'full': const fullTime = getNamedFormat(locale, 'fullTime'); const fullDate = getNamedFormat(locale, 'fullDate'); formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Full), [ fullTime, fullDate, ]); break; } if (formatValue) { NAMED_FORMATS[localeId][format] = formatValue; } return formatValue; } function formatDateTime(str, opt_values) { if (opt_values) { str = str.replace(/\{([^}]+)}/g, function (match, key) { return opt_values != null && key in opt_values ? opt_values[key] : match; }); } return str; } function padNumber(num, digits, minusSign = '-', trim, negWrap) { let neg = ''; if (num < 0 || (negWrap && num <= 0)) { if (negWrap) { num = -num + 1; } else { num = -num; neg = minusSign; } } let strNum = String(num); while (strNum.length < digits) { strNum = '0' + strNum; } if (trim) { strNum = strNum.slice(strNum.length - digits); } return neg + strNum; } function formatFractionalSeconds(milliseconds, digits) { const strMs = padNumber(milliseconds, 3); return strMs.substring(0, digits); } /** * Returns a date formatter that transforms a date into its locale digit representation */ function dateGetter(name, size, offset = 0, trim = false, negWrap = false) { return function (date, locale) { let part = getDatePart(name, date); if (offset > 0 || part > -offset) { part += offset; } if (name === 3 /* DateType.Hours */) { if (part === 0 && offset === -12) { part = 12; } } else if (name === 6 /* DateType.FractionalSeconds */) { return formatFractionalSeconds(part, size); } const localeMinus = getLocaleNumberSymbol(locale, NumberSymbol.MinusSign); return padNumber(part, size, localeMinus, trim, negWrap); }; } function getDatePart(part, date) { switch (part) { case 0 /* DateType.FullYear */: return date.getFullYear(); case 1 /* DateType.Month */: return date.getMonth(); case 2 /* DateType.Date */: return date.getDate(); case 3 /* DateType.Hours */: return date.getHours(); case 4 /* DateType.Minutes */: return date.getMinutes(); case 5 /* DateType.Seconds */: return date.getSeconds(); case 6 /* DateType.FractionalSeconds */: return date.getMilliseconds(); case 7 /* DateType.Day */: return date.getDay(); default: throw new Error(`Unknown DateType value "${part}".`); } } /** * Returns a date formatter that transforms a date into its locale string representation */ function dateStrGetter(name, width, form = FormStyle.Format, extended = false) { return function (date, locale) { return getDateTranslation(date, locale, name, width, form, extended); }; } /** * Returns the locale translation of a date for a given form, type and width */ function getDateTranslation(date, locale, name, width, form, extended) { switch (name) { case 2 /* TranslationType.Months */: return getLocaleMonthNames(locale, form, width)[date.getMonth()]; case 1 /* TranslationType.Days */: return getLocaleDayNames(locale, form, width)[date.getDay()]; case 0 /* TranslationType.DayPeriods */: const currentHours = date.getHours(); const currentMinutes = date.getMinutes(); if (extended) { const rules = getLocaleExtraDayPeriodRules(locale); const dayPeriods = getLocaleExtraDayPeriods(locale, form, width); const index = rules.findIndex((rule) => { if (Array.isArray(rule)) { // morning, afternoon, evening, night const [from, to] = rule; const afterFrom = currentHours >= from.hours && currentMinutes >= from.minutes; const beforeTo = currentHours < to.hours || (currentHours === to.hours && currentMinutes < to.minutes); // We must account for normal rules that span a period during the day (e.g. 6am-9am) // where `from` is less (earlier) than `to`. But also rules that span midnight (e.g. // 10pm - 5am) where `from` is greater (later!) than `to`. // // In the first case the current time must be BOTH after `from` AND before `to` // (e.g. 8am is after 6am AND before 10am). // // In the second case the current time must be EITHER after `from` OR before `to` // (e.g. 4am is before 5am but not after 10pm; and 11pm is not before 5am but it is // after 10pm). if (from.hours < to.hours) { if (afterFrom && beforeTo) { return true; } } else if (afterFrom || beforeTo) { return true; } } else { // noon or midnight if (rule.hours === currentHours && rule.minutes === currentMinutes) { return true; } } return false; }); if (index !== -1) { return dayPeriods[index]; } } // if no rules for the day periods, we use am/pm by default return getLocaleDayPeriods(locale, form, width)[currentHours < 12 ? 0 : 1]; case 3 /* TranslationType.Eras */: return getLocaleEraNames(locale, width)[date.getFullYear() <= 0 ? 0 : 1]; default: // This default case is not needed by TypeScript compiler, as the switch is exhaustive. // However Closure Compiler does not understand that and reports an error in typed mode. // The `throw new Error` below works around the problem, and the unexpected: never variable // makes sure tsc still checks this code is unreachable. const unexpected = name; throw new Error(`unexpected translation type ${unexpected}`); } } /** * Returns a date formatter that transforms a date and an offset into a timezone with ISO8601 or * GMT format depending on the width (eg: short = +0430, short:GMT = GMT+4, long = GMT+04:30, * extended = +04:30) */ function timeZoneGetter(width) { return function (date, locale, offset) { const zone = -1 * offset; const minusSign = getLocaleNumberSymbol(locale, NumberSymbol.MinusSign); const hours = zone > 0 ? Math.floor(zone / 60) : Math.ceil(zone / 60); switch (width) { case 0 /* ZoneWidth.Short */: return ((zone >= 0 ? '+' : '') + padNumber(hours, 2, minusSign) + padNumber(Math.abs(zone % 60), 2, minusSign)); case 1 /* ZoneWidth.ShortGMT */: return 'GMT' + (zone >= 0 ? '+' : '') + padNumber(hours, 1, minusSign); case 2 /* ZoneWidth.Long */: return ('GMT' + (zone >= 0 ? '+' : '') + padNumber(hours, 2, minusSign) + ':' + padNumber(Math.abs(zone % 60), 2, minusSign)); case 3 /* ZoneWidth.Extended */: if (offset === 0) { return 'Z'; } else { return ((zone >= 0 ? '+' : '') + padNumber(hours, 2, minusSign) + ':' + padNumber(Math.abs(zone % 60), 2, minusSign)); } default: throw new Error(`Unknown zone width "${width}"`); } }; } const JANUARY = 0; const THURSDAY = 4; function getFirstThursdayOfYear(year) { const firstDayOfYear = createDate(year, JANUARY, 1).getDay(); return createDate(year, 0, 1 + (firstDayOfYear <= THURSDAY ? THURSDAY : THURSDAY + 7) - firstDayOfYear); } /** * ISO Week starts on day 1 (Monday) and ends with day 0 (Sunday) */ function getThursdayThisIsoWeek(datetime) { // getDay returns 0-6 range with sunday as 0. const currentDay = datetime.getDay(); // On a Sunday, read the previous Thursday since ISO weeks start on Monday. const deltaToThursday = currentDay === 0 ? -3 : THURSDAY - currentDay; return createDate(datetime.getFullYear(), datetime.getMonth(), datetime.getDate() + deltaToThursday); } function weekGetter(size, monthBased = false) { return function (date, locale) { let result; if (monthBased) { const nbDaysBefore1stDayOfMonth = new Date(date.getFullYear(), date.getMonth(), 1).getDay() - 1; const today = date.getDate(); result = 1 + Math.floor((today + nbDaysBefore1stDayOfMonth) / 7); } else { const thisThurs = getThursdayThisIsoWeek(date); // Some days of a year are part of next year according to ISO 8601. // Compute the firstThurs from the year of this week's Thursday const firstThurs = getFirstThursdayOfYear(thisThurs.getFullYear()); const diff = thisThurs.getTime() - firstThurs.getTime(); result = 1 + Math.round(diff / 6.048e8); // 6.048e8 ms per week } return padNumber(result, size, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign)); }; } /** * Returns a date formatter that provides the week-numbering year for the input date. */ function weekNumberingYearGetter(size, trim = false) { return function (date, locale) { const thisThurs = getThursdayThisIsoWeek(date); const weekNumberingYear = thisThurs.getFullYear(); return padNumber(weekNumberingYear, size, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign), trim); }; } const DATE_FORMATS = {}; // Based on CLDR formats: // See complete list: http://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table // See also explanations: http://cldr.unicode.org/translation/date-time // TODO(ocombe): support all missing cldr formats: U, Q, D, F, e, j, J, C, A, v, V, X, x function getDateFormatter(format) { if (DATE_FORMATS[format]) { return DATE_FORMATS[format]; } let formatter; switch (format) { // Era name (AD/BC) case 'G': case 'GG': case 'GGG': formatter = dateStrGetter(3 /* TranslationType.Eras */, TranslationWidth.Abbreviated); break; case 'GGGG': formatter = dateStrGetter(3 /* TranslationType.Eras */, TranslationWidth.Wide); break; case 'GGGGG': formatter = dateStrGetter(3 /* TranslationType.Eras */, TranslationWidth.Narrow); break; // 1 digit representation of the year, e.g. (AD 1 => 1, AD 199 => 199) case 'y': formatter = dateGetter(0 /* DateType.FullYear */, 1, 0, false, true); break; // 2 digit representation of the year, padded (00-99). (e.g. AD 2001 => 01, AD 2010 => 10) case 'yy': formatter = dateGetter(0 /* DateType.FullYear */, 2, 0, true, true); break; // 3 digit representation of the year, padded (000-999). (e.g. AD 2001 => 01, AD 2010 => 10) case 'yyy': formatter = dateGetter(0 /* DateType.FullYear */, 3, 0, false, true); break; // 4 digit representation of the year (e.g. AD 1 => 0001, AD 2010 => 2010) case 'yyyy': formatter = dateGetter(0 /* DateType.FullYear */, 4, 0, false, true); break; // 1 digit representation of the week-numbering year, e.g. (AD 1 => 1, AD 199 => 199) case 'Y': formatter = weekNumberingYearGetter(1); break; // 2 digit representation of the week-numbering year, padded (00-99). (e.g. AD 2001 => 01, AD // 2010 => 10) case 'YY': formatter = weekNumberingYearGetter(2, true); break; // 3 digit representation of the week-numbering year, padded (000-999). (e.g. AD 1 => 001, AD // 2010 => 2010) case 'YYY': formatter = weekNumberingYearGetter(3); break; // 4 digit representation of the week-numbering year (e.g. AD 1 => 0001, AD 2010 => 2010) case 'YYYY': formatter = weekNumberingYearGetter(4); break; // Month of the year (1-12), numeric case 'M': case 'L': formatter = dateGetter(1 /* DateType.Month */, 1, 1); break; case 'MM': case 'LL': formatter = dateGetter(1 /* DateType.Month */, 2, 1); break; // Month of the year (January, ...), string, format case 'MMM': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Abbreviated); break; case 'MMMM': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Wide); break; case 'MMMMM': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Narrow); break; // Month of the year (January, ...), string, standalone case 'LLL': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Abbreviated, FormStyle.Standalone); break; case 'LLLL': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Wide, FormStyle.Standalone); break; case 'LLLLL': formatter = dateStrGetter(2 /* TranslationType.Months */, TranslationWidth.Narrow, FormStyle.Standalone); break; // Week of the year (1, ... 52) case 'w': formatter = weekGetter(1); break; case 'ww': formatter = weekGetter(2); break; // Week of the month (1, ...) case 'W': formatter = weekGetter(1, true); break; // Day of the month (1-31) case 'd': formatter = dateGetter(2 /* DateType.Date */, 1); break; case 'dd': formatter = dateGetter(2 /* DateType.Date */, 2); break; // Day of the Week StandAlone (1, 1, Mon, Monday, M, Mo) case 'c': case 'cc': formatter = dateGetter(7 /* DateType.Day */, 1); break; case 'ccc': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Abbreviated, FormStyle.Standalone); break; case 'cccc': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Wide, FormStyle.Standalone); break; case 'ccccc': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Narrow, FormStyle.Standalone); break; case 'cccccc': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Short, FormStyle.Standalone); break; // Day of the Week case 'E': case 'EE': case 'EEE': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Abbreviated); break; case 'EEEE': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Wide); break; case 'EEEEE': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Narrow); break; case 'EEEEEE': formatter = dateStrGetter(1 /* TranslationType.Days */, TranslationWidth.Short); break; // Generic period of the day (am-pm) case 'a': case 'aa': case 'aaa': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Abbreviated); break; case 'aaaa': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Wide); break; case 'aaaaa': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Narrow); break; // Extended period of the day (midnight, at night, ...), standalone case 'b': case 'bb': case 'bbb': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Abbreviated, FormStyle.Standalone, true); break; case 'bbbb': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Wide, FormStyle.Standalone, true); break; case 'bbbbb': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Narrow, FormStyle.Standalone, true); break; // Extended period of the day (midnight, night, ...), standalone case 'B': case 'BB': case 'BBB': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Abbreviated, FormStyle.Format, true); break; case 'BBBB': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Wide, FormStyle.Format, true); break; case 'BBBBB': formatter = dateStrGetter(0 /* TranslationType.DayPeriods */, TranslationWidth.Narrow, FormStyle.Format, true); break; // Hour in AM/PM, (1-12) case 'h': formatter = dateGetter(3 /* DateType.Hours */, 1, -12); break; case 'hh': formatter = dateGetter(3 /* DateType.Hours */, 2, -12); break; // Hour of the day (0-23) case 'H': formatter = dateGetter(3 /* DateType.Hours */, 1); break; // Hour in day, padded (00-23) case 'HH': formatter = dateGetter(3 /* DateType.Hours */, 2); break; // Minute of the hour (0-59) case 'm': formatter = dateGetter(4 /* DateType.Minutes */, 1); break; case 'mm': formatter = dateGetter(4 /* DateType.Minutes */, 2); break; // Second of the minute (0-59) case 's': formatter = dateGetter(5 /* DateType.Seconds */, 1); break; case 'ss': formatter = dateGetter(5 /* DateType.Seconds */, 2); break; // Fractional second case 'S': formatter = dateGetter(6 /* DateType.FractionalSeconds */, 1); break; case 'SS': formatter = dateGetter(6 /* DateType.FractionalSeconds */, 2); break; case 'SSS': formatter = dateGetter(6 /* DateType.FractionalSeconds */, 3); break; // Timezone ISO8601 short format (-0430) case 'Z': case 'ZZ': case 'ZZZ': formatter = timeZoneGetter(0 /* ZoneWidth.Short */); break; // Timezone ISO8601 extended format (-04:30) case 'ZZZZZ': formatter = timeZoneGetter(3 /* ZoneWidth.Extended */); break; // Timezone GMT short format (GMT+4) case 'O': case 'OO': case 'OOO': // Should be location, but fallback to format O instead because we don't have the data yet case 'z': case 'zz': case 'zzz': formatter = timeZoneGetter(1 /* ZoneWidth.ShortGMT */); break; // Timezone GMT long format (GMT+0430) case 'OOOO': case 'ZZZZ': // Should be location, but fallback to format O instead because we don't have the data yet case 'zzzz': formatter = timeZoneGetter(2 /* ZoneWidth.Long */); break; default: return null; } DATE_FORMATS[format] = formatter; return formatter; } function timezoneToOffset(timezone, fallback) { // Support: IE 11 only, Edge 13-15+ // IE/Edge do not "understand" colon (`:`) in timezone timezone = timezone.replace(/:/g, ''); const requestedTimezoneOffset = Date.parse('Jan 01, 1970 00:00:00 ' + timezone) / 60000; return isNaN(requestedTimezoneOffset) ? fallback : requestedTimezoneOffset; } function addDateMinutes(date, minutes) { date = new Date(date.getTime()); date.setMinutes(date.getMinutes() + minutes); return date; } function convertTimezoneToLocal(date, timezone, reverse) { const reverseValue = -1 ; const dateTimezoneOffset = date.getTimezoneOffset(); const timezoneOffset = timezoneToOffset(timezone, dateTimezoneOffset); return addDateMinutes(date, reverseValue * (timezoneOffset - dateTimezoneOffset)); } /** * Converts a value to date. * * Supported input formats: * - `Date` * - number: timestamp * - string: numeric (e.g. "1234"), ISO and date strings in a format supported by * [Date.parse()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse). * Note: ISO strings without time return a date without timeoffset. * * Throws if unable to convert to a date. */ function toDate(value) { if (isDate(value)) { return value; } if (typeof value === 'number' && !isNaN(value)) { return new Date(value); } if (typeof value === 'string') { value = value.trim(); if (/^(\d{4}(-\d{1,2}(-\d{1,2})?)?)$/.test(value)) { /* For ISO Strings without time the day, month and year must be extracted from the ISO String before Date creation to avoid time offset and errors in the new Date. If we only replace '-' with ',' in the ISO String ("2015,01,01"), and try to create a new date, some browsers (e.g. IE 9) will throw an invalid Date error. If we leave the '-' ("2015-01-01") and try to create a new Date("2015-01-01") the timeoffset is applied. Note: ISO months are 0 for January, 1 for February, ... */ const [y, m = 1, d = 1] = value.split('-').map((val) => +val); return createDate(y, m - 1, d); } const parsedNb = parseFloat(value); // any string that only contains numbers, like "1234" but not like "1234hello" if (!isNaN(value - parsedNb)) { return new Date(parsedNb); } let match; if ((match = value.match(ISO8601_DATE_REGEX))) { return isoStringToDate(match); } } const date = new Date(value); if (!isDate(date)) { throw new Error(`Unable to convert "${value}" into a date`); } return date; } /** * Converts a date in ISO8601 to a Date. * Used instead of `Date.parse` because of browser discrepancies. */ function isoStringToDate(match) { const date = new Date(0); let tzHour = 0; let tzMin = 0; // match[8] means that the string contains "Z" (UTC) or a timezone like "+01:00" or "+0100" const dateSetter = match[8] ? date.setUTCFullYear : date.setFullYear; const timeSetter = match[8] ? date.setUTCHours : date.setHours; // if there is a timezone defined like "+01:00" or "+0100" if (match[9]) { tzHour = Number(match[9] + match[10]); tzMin = Number(match[9] + match[11]); } dateSetter.call(date, Number(match[1]), Number(match[2]) - 1, Number(match[3])); const h = Number(match[4] || 0) - tzHour; const m = Number(match[5] || 0) - tzMin; const s = Number(match[6] || 0); // The ECMAScript specification (https://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.11) // defines that `DateTime` milliseconds should always be rounded down, so that `999.9ms` // becomes `999ms`. const ms = Math.floor(parseFloat('0.' + (match[7] || 0)) * 1000); timeSetter.call(date, h, m, s, ms); return date; } function isDate(value) { return value instanceof Date && !isNaN(value.valueOf()); } const NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/; const MAX_DIGITS = 22; const DECIMAL_SEP = '.'; const ZERO_CHAR = '0'; const PATTERN_SEP = ';'; const GROUP_SEP = ','; const DIGIT_CHAR = '#'; const CURRENCY_CHAR = '¤'; const PERCENT_CHAR = '%'; /** * Transforms a number to a locale string based on a style and a format. */ function formatNumberToLocaleString(value, pattern, locale, groupSymbol, decimalSymbol, digitsInfo, isPercent = false) { let formattedText = ''; let isZero = false; if (!isFinite(value)) { formattedText = getLocaleNumberSymbol(locale, NumberSymbol.Infinity); } else { let parsedNumber = parseNumber(value); if (isPercent) { parsedNumber = toPercent(parsedNumber); } let minInt = pattern.minInt; let minFraction = pattern.minFrac; let maxFraction = pattern.maxFrac; if (digitsInfo) { const parts = digitsInfo.match(NUMBER_FORMAT_REGEXP); if (parts === null) { throw new Error(`${digitsInfo} is not a valid digit info`); } const minIntPart = parts[1]; const minFractionPart = parts[3]; const maxFractionPart = parts[5]; if (minIntPart != null) { minInt = parseIntAutoRadix(minIntPart); } if (minFractionPart != null) { minFraction = parseIntAutoRadix(minFractionPart); } if (maxFractionPart != null) { maxFraction = parseIntAutoRadix(maxFractionPart); } else if (minFractionPart != null && minFraction > maxFraction) { maxFraction = minFraction; } } roundNumber(parsedNumber, minFraction, maxFraction); let digits = parsedNumber.digits; let integerLen = parsedNumber.integerLen; const exponent = parsedNumber.exponent; let decimals = []; isZero = digits.every((d) => !d); // pad zeros for small numbers for (; integerLen < minInt; integerLen++) { digits.unshift(0); } // pad zeros for small numbers for (; integerLen < 0; integerLen++) { digits.unshift(0); } // extract decimals digits if (integerLen > 0) { decimals = digits.splice(integerLen, digits.length); } else { decimals = digits; digits = [0]; } // format the integer digits with grouping separators const groups = []; if (digits.length >= pattern.lgSize) { groups.unshift(digits.splice(-pattern.lgSize, digits.length).join('')); } while (digits.length > pattern.gSize) { groups.unshift(digits.splice(-pattern.gSize, digits.length).join('')); } if (digits.length) { groups.unshift(digits.join('')); } formattedText = groups.join(getLocaleNumberSymbol(locale, groupSymbol)); // append the decimal digits if (decimals.length) { formattedText += getLocaleNumberSymbol(locale, decimalSymbol) + decimals.join(''); } if (exponent) { formattedText += getLocaleNumberSymbol(locale, NumberSymbol.Exponential) + '+' + exponent; } } if (value < 0 && !isZero) { formattedText = pattern.negPre + formattedText + pattern.negSuf; } else { formattedText = pattern.posPre + formattedText + pattern.posSuf; } return formattedText; } /** * @ngModule CommonModule * @description * * Formats a number as currency using locale rules. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param currency A string containing the currency symbol or its name, * such as "$" or "Canadian Dollar". Used in output string, but does not affect the operation * of the function. * @param currencyCode The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) * currency code, such as `USD` for the US dollar and `EUR` for the euro. * Used to determine the number of digits in the decimal part. * @param digitsInfo Decimal representation options, specified by a string in the following format: * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details. * * @returns The formatted currency value. * * @see {@link formatNumber} * @see {@link DecimalPipe} * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi */ function formatCurrency(value, locale, currency, currencyCode, digitsInfo) { const format = getLocaleNumberFormat(locale, NumberFormatStyle.Currency); const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign)); pattern.minFrac = getNumberOfCurrencyDigits(currencyCode); pattern.maxFrac = pattern.minFrac; const res = formatNumberToLocaleString(value, pattern, locale, NumberSymbol.CurrencyGroup, NumberSymbol.CurrencyDecimal, digitsInfo); return (res .replace(CURRENCY_CHAR, currency) // if we have 2 time the currency character, the second one is ignored .replace(CURRENCY_CHAR, '') // If there is a spacing between currency character and the value and // the currency character is suppressed by passing an empty string, the // spacing character would remain as part of the string. Then we // should remove it. .trim()); } /** * @ngModule CommonModule * @description * * Formats a number as a percentage according to locale rules. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param digitsInfo Decimal representation options, specified by a string in the following format: * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details. * * @returns The formatted percentage value. * * @see {@link formatNumber} * @see {@link DecimalPipe} * @see [Internationalization (i18n) Guide](guide/i18n) * @publicApi * */ function formatPercent(value, locale, digitsInfo) { const format = getLocaleNumberFormat(locale, NumberFormatStyle.Percent); const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign)); const res = formatNumberToLocaleString(value, pattern, locale, NumberSymbol.Group, NumberSymbol.Decimal, digitsInfo, true); return res.replace(new RegExp(PERCENT_CHAR, 'g'), getLocaleNumberSymbol(locale, NumberSymbol.PercentSign)); } /** * @ngModule CommonModule * @description * * Formats a number as text, with group sizing, separator, and other * parameters based on the locale. * * @param value The number to format. * @param locale A locale code for the locale format rules to use. * @param digitsInfo Decimal representation options, specified by a string in the following format: * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details. * * @returns The formatted text string. * @see [Internationalization (i18n) Guide](guide/i18n) * * @publicApi */ function formatNumber(value, locale, digitsInfo) { const format = getLocaleNumberFormat(locale, NumberFormatStyle.Decimal); const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign)); return formatNumberToLocaleString(value, pattern, locale, NumberSymbol.Group, NumberSymbol.Decimal, digitsInfo); } function parseNumberFormat(format, minusSign = '-') { const p = { minInt: 1, minFrac: 0, maxFrac: 0, posPre: '', posSuf: '', negPre: '', negSuf: '', gSize: 0, lgSize: 0, }; const patternParts = format.split(PATTERN_SEP); const positive = patternParts[0]; const negative = patternParts[1]; const positiveParts = positive.indexOf(DECIMAL_SEP) !== -1 ? positive.split(DECIMAL_SEP) : [ positive.substring(0, positive.lastIndexOf(ZERO_CHAR) + 1), positive.substring(positive.lastIndexOf(ZERO_CHAR) + 1), ], integer = positiveParts[0], fraction = positiveParts[1] || ''; p.posPre = integer.substring(0, integer.indexOf(DIGIT_CHAR)); for (let i = 0; i < fraction.length; i++) { const ch = fraction.charAt(i); if (ch === ZERO_CHAR) { p.minFrac = p.maxFrac = i + 1; } else if (ch === DIGIT_CHAR) { p.maxFrac = i + 1; } else { p.posSuf += ch; } } const groups = integer.split(GROUP_SEP); p.gSize = groups[1] ? groups[1].length : 0; p.lgSize = groups[2] || groups[1] ? (groups[2] || groups[1]).length : 0; if (negative) { const trunkLen = positive.length - p.posPre.length - p.posSuf.length, pos = negative.indexOf(DIGIT_CHAR); p.negPre = negative.substring(0, pos).replace(/'/g, ''); p.negSuf = negative.slice(pos + trunkLen).replace(/'/g, ''); } else { p.negPre = minusSign + p.posPre; p.negSuf = p.posSuf; } return p; } // Transforms a parsed number into a percentage by multiplying it by 100 function toPercent(parsedNumber) { // if the number is 0, don't do anything if (parsedNumber.digits[0] === 0) { return parsedNumber; } // Getting the current number of decimals const fractionLen = parsedNumber.digits.length - parsedNumber.integerLen; if (parsedNumber.exponent) { parsedNumber.exponent += 2; } else { if (fractionLen === 0) { parsedNumber.digits.push(0, 0); } else if (fractionLen === 1) { parsedNumber.digits.push(0); } parsedNumber.integerLen += 2; } return parsedNumber; } /** * Parses a number. * Significant bits of this parse algorithm came from https://github.com/MikeMcl/big.js/ */ function parseNumber(num) { let numStr = Math.abs(num) + ''; let exponent = 0, digits, integerLen; let i, j, zeros; // Decimal point? if ((integerLen = numStr.indexOf(DECIMAL_SEP)) > -1) { numStr = numStr.replace(DECIMAL_SEP, ''); } // Exponential form? if ((i = numStr.search(/e/i)) > 0) { // Work out the exponent. if (integerLen < 0) integerLen = i; integerLen += +numStr.slice(i + 1); numStr = numStr.substring(0, i); } else if (integerLen < 0) { // There was no decimal point or exponent so it is an integer. integerLen = numStr.length; } // Count the number of leading zeros. for (i = 0; numStr.charAt(i) === ZERO_CHAR; i++) { /* empty */ } if (i === (zeros = numStr.length)) { // The digits are all zero. digits = [0]; integerLen = 1; } else { // Count the number of trailing zeros zeros--; while (numStr.charAt(zeros) === ZERO_CHAR) zeros--; // Trailing zeros are insignificant so ignore them integerLen -= i; digits = []; // Convert string to array of digits without leading/trailing zeros. for (j = 0; i <= zeros; i++, j++) { digits[j] = Number(numStr.charAt(i)); } } // If the number overflows the maximum allowed digits then use an exponent. if (integerLen > MAX_DIGITS) { digits = digits.splice(0, MAX_DIGITS - 1); exponent = integerLen - 1; integerLen = 1; } return { digits, exponent, integerLen }; } /** * Round the parsed number to the specified number of decimal places * This function changes the parsedNumber in-place */ function roundNumber(parsedNumber, minFrac, maxFrac) { if (minFrac > maxFrac) { throw new Error(`The minimum number of digits after fraction (${minFrac}) is higher than the maximum (${maxFrac}).`); } let digits = parsedNumber.digits; let fractionLen = digits.length - parsedNumber.integerLen; const fractionSize = Math.min(Math.max(minFrac, fractionLen), maxFrac); // The index of the digit to where rounding is to occur let roundAt = fractionSize + parsedNumber.integerLen; let digit = digits[roundAt]; if (roundAt > 0) { // Drop fractional digits beyond `roundAt` digits.splice(Math.max(parsedNumber.integerLen, roundAt)); // Set non-fractional digits beyond `roundAt` to 0 for (let j = roundAt; j < digits.length; j++) { digits[j] = 0; } } else { // We rounded to zero so reset the parsedNumber fractionLen = Math.max(0, fractionLen); parsedNumber.integerLen = 1; digits.length = Math.max(1, (roundAt = fractionSize + 1)); digits[0] = 0; for (let i = 1; i < roundAt; i++) digits[i] = 0; } if (digit >= 5) { if (roundAt - 1 < 0) { for (let k = 0; k > roundAt; k--) { digits.unshift(0); parsedNumber.integerLen++; } digits.unshift(1); parsedNumber.integerLen++; } else { digits[roundAt - 1]++; } } // Pad out with zeros to get the required fraction length for (; fractionLen < Math.max(0, fractionSize); fractionLen++) digits.push(0); let dropTrailingZeros = fractionSize !== 0; // Minimal length = nb of decimals required + current nb of integers // Any number besides that is optional and can be removed if it's a trailing 0 const minLen = minFrac + parsedNumber.integerLen; // Do any carrying, e.g. a digit was rounded up to 10 const carry = digits.reduceRight(function (carry, d, i, digits) { d = d + carry; digits[i] = d < 10 ? d : d - 10; // d % 10 if (dropTrailingZeros) { // Do not keep meaningless fractional trailing zeros (e.g. 15.52000 --> 15.52) if (digits[i] === 0 && i >= minLen) { digits.pop(); } else { dropTrailingZeros = false; } } return d >= 10 ? 1 : 0; // Math.floor(d / 10); }, 0); if (carry) { digits.unshift(carry); parsedNumber.integerLen++; } } function parseIntAutoRadix(text) { const result = parseInt(text); if (isNaN(result)) { throw new Error('Invalid integer literal when parsing ' + text); } return result; } /** * @publicApi */ class NgLocalization { static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocalization, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocalization, providedIn: 'root', useFactory: (locale) => new NgLocaleLocalization(locale), deps: [{ token: LOCALE_ID }] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocalization, decorators: [{ type: Injectable, args: [{ providedIn: 'root', useFactory: (locale) => new NgLocaleLocalization(locale), deps: [LOCALE_ID], }] }] }); /** * Returns the plural category for a given value. * - "=value" when the case exists, * - the plural category otherwise */ function getPluralCategory(value, cases, ngLocalization, locale) { let key = `=${value}`; if (cases.indexOf(key) > -1) { return key; } key = ngLocalization.getPluralCategory(value, locale); if (cases.indexOf(key) > -1) { return key; } if (cases.indexOf('other') > -1) { return 'other'; } throw new Error(`No plural message found for value "${value}"`); } /** * Returns the plural case based on the locale * * @publicApi */ class NgLocaleLocalization extends NgLocalization { locale; constructor(locale) { super(); this.locale = locale; } getPluralCategory(value, locale) { const plural = getLocalePluralCase(locale || this.locale)(value); switch (plural) { case Plural.Zero: return 'zero'; case Plural.One: return 'one'; case Plural.Two: return 'two'; case Plural.Few: return 'few'; case Plural.Many: return 'many'; default: return 'other'; } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocaleLocalization, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocaleLocalization }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgLocaleLocalization, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [LOCALE_ID] }] }] }); const WS_REGEXP = /\s+/; const EMPTY_ARRAY = []; /** * @ngModule CommonModule * * @usageNotes * ```html * ... * * ... * ``` * * For more simple use cases you can use the [class bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly. * It doesn't require importing a directive. * * ```html * ... * * ... * * ... * * ... * ``` * @description * * Adds and removes CSS classes on an HTML element. * * The CSS classes are updated as follows, depending on the type of the expression evaluation: * - `string` - the CSS classes listed in the string (space delimited) are added, * - `Array` - the CSS classes declared as Array elements are added, * - `Object` - keys are CSS classes that get added when the expression given in the value * evaluates to a truthy value, otherwise they are removed. * * * @see [Class bindings](/guide/templates/binding#css-class-and-style-property-bindings) * * @publicApi */ class NgClass { _ngEl; _renderer; initialClasses = EMPTY_ARRAY; rawClass; stateMap = new Map(); constructor(_ngEl, _renderer) { this._ngEl = _ngEl; this._renderer = _renderer; } set klass(value) { this.initialClasses = value != null ? value.trim().split(WS_REGEXP) : EMPTY_ARRAY; } set ngClass(value) { this.rawClass = typeof value === 'string' ? value.trim().split(WS_REGEXP) : value; } /* The NgClass directive uses the custom change detection algorithm for its inputs. The custom algorithm is necessary since inputs are represented as complex object or arrays that need to be deeply-compared. This algorithm is perf-sensitive since NgClass is used very frequently and its poor performance might negatively impact runtime performance of the entire change detection cycle. The design of this algorithm is making sure that: - there is no unnecessary DOM manipulation (CSS classes are added / removed from the DOM only when needed), even if references to bound objects change; - there is no memory allocation if nothing changes (even relatively modest memory allocation during the change detection cycle can result in GC pauses for some of the CD cycles). The algorithm works by iterating over the set of bound classes, staring with [class] binding and then going over [ngClass] binding. For each CSS class name: - check if it was seen before (this information is tracked in the state map) and if its value changed; - mark it as "touched" - names that are not marked are not present in the latest set of binding and we can remove such class name from the internal data structures; After iteration over all the CSS class names we've got data structure with all the information necessary to synchronize changes to the DOM - it is enough to iterate over the state map, flush changes to the DOM and reset internal data structures so those are ready for the next change detection cycle. */ ngDoCheck() { // classes from the [class] binding for (const klass of this.initialClasses) { this._updateState(klass, true); } // classes from the [ngClass] binding const rawClass = this.rawClass; if (Array.isArray(rawClass) || rawClass instanceof Set) { for (const klass of rawClass) { this._updateState(klass, true); } } else if (rawClass != null) { for (const klass of Object.keys(rawClass)) { this._updateState(klass, Boolean(rawClass[klass])); } } this._applyStateDiff(); } _updateState(klass, nextEnabled) { const state = this.stateMap.get(klass); if (state !== undefined) { if (state.enabled !== nextEnabled) { state.changed = true; state.enabled = nextEnabled; } state.touched = true; } else { this.stateMap.set(klass, { enabled: nextEnabled, changed: true, touched: true }); } } _applyStateDiff() { for (const stateEntry of this.stateMap) { const klass = stateEntry[0]; const state = stateEntry[1]; if (state.changed) { this._toggleClass(klass, state.enabled); state.changed = false; } else if (!state.touched) { // A class that was previously active got removed from the new collection of classes - // remove from the DOM as well. if (state.enabled) { this._toggleClass(klass, false); } this.stateMap.delete(klass); } state.touched = false; } } _toggleClass(klass, enabled) { if (ngDevMode) { if (typeof klass !== 'string') { throw new Error(`NgClass can only toggle CSS classes expressed as strings, got ${_stringify(klass)}`); } } klass = klass.trim(); if (klass.length > 0) { klass.split(WS_REGEXP).forEach((klass) => { if (enabled) { this._renderer.addClass(this._ngEl.nativeElement, klass); } else { this._renderer.removeClass(this._ngEl.nativeElement, klass); } }); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgClass, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgClass, isStandalone: true, selector: "[ngClass]", inputs: { klass: ["class", "klass"], ngClass: "ngClass" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgClass, decorators: [{ type: Directive, args: [{ selector: '[ngClass]', }] }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { klass: [{ type: Input, args: ['class'] }], ngClass: [{ type: Input, args: ['ngClass'] }] } }); /** * Instantiates a {@link /api/core/Component Component} type and inserts its Host View into the current View. * `NgComponentOutlet` provides a declarative approach for dynamic component creation. * * `NgComponentOutlet` requires a component type, if a falsy value is set the view will clear and * any existing component will be destroyed. * * @usageNotes * * ### Fine tune control * * You can control the component creation process by using the following optional attributes: * * * `ngComponentOutletInputs`: Optional component inputs object, which will be bind to the * component. * * * `ngComponentOutletInjector`: Optional custom {@link Injector} that will be used as parent for * the Component. Defaults to the injector of the current view container. * * * `ngComponentOutletContent`: Optional list of projectable nodes to insert into the content * section of the component, if it exists. * * * `ngComponentOutletNgModule`: Optional NgModule class reference to allow loading another * module dynamically, then loading a component from that module. * * * `ngComponentOutletNgModuleFactory`: Deprecated config option that allows providing optional * NgModule factory to allow loading another module dynamically, then loading a component from that * module. Use `ngComponentOutletNgModule` instead. * * ### Syntax * * Simple * ```html * * ``` * * With inputs * ```html * * * ``` * * Customized injector/content * ```html * * * ``` * * Customized NgModule reference * ```html * * * ``` * * ### A simple example * * {@example common/ngComponentOutlet/ts/module.ts region='SimpleExample'} * * A more complete example with additional options: * * {@example common/ngComponentOutlet/ts/module.ts region='CompleteExample'} * * @publicApi * @ngModule CommonModule */ class NgComponentOutlet { _viewContainerRef; // TODO(crisbeto): this should be `Type`, but doing so broke a few // targets in a TGP so we need to do it in a major version. /** Component that should be rendered in the outlet. */ ngComponentOutlet = null; ngComponentOutletInputs; ngComponentOutletInjector; ngComponentOutletContent; ngComponentOutletNgModule; /** * @deprecated This input is deprecated, use `ngComponentOutletNgModule` instead. */ ngComponentOutletNgModuleFactory; _componentRef; _moduleRef; /** * A helper data structure that allows us to track inputs that were part of the * ngComponentOutletInputs expression. Tracking inputs is necessary for proper removal of ones * that are no longer referenced. */ _inputsUsed = new Map(); /** * Gets the instance of the currently-rendered component. * Will be null if no component has been rendered. */ get componentInstance() { return this._componentRef?.instance ?? null; } constructor(_viewContainerRef) { this._viewContainerRef = _viewContainerRef; } _needToReCreateNgModuleInstance(changes) { // Note: square brackets property accessor is safe for Closure compiler optimizations (the // `changes` argument of the `ngOnChanges` lifecycle hook retains the names of the fields that // were changed). return (changes['ngComponentOutletNgModule'] !== undefined || changes['ngComponentOutletNgModuleFactory'] !== undefined); } _needToReCreateComponentInstance(changes) { // Note: square brackets property accessor is safe for Closure compiler optimizations (the // `changes` argument of the `ngOnChanges` lifecycle hook retains the names of the fields that // were changed). return (changes['ngComponentOutlet'] !== undefined || changes['ngComponentOutletContent'] !== undefined || changes['ngComponentOutletInjector'] !== undefined || this._needToReCreateNgModuleInstance(changes)); } /** @docs-private */ ngOnChanges(changes) { if (this._needToReCreateComponentInstance(changes)) { this._viewContainerRef.clear(); this._inputsUsed.clear(); this._componentRef = undefined; if (this.ngComponentOutlet) { const injector = this.ngComponentOutletInjector || this._viewContainerRef.parentInjector; if (this._needToReCreateNgModuleInstance(changes)) { this._moduleRef?.destroy(); if (this.ngComponentOutletNgModule) { this._moduleRef = createNgModule(this.ngComponentOutletNgModule, getParentInjector(injector)); } else if (this.ngComponentOutletNgModuleFactory) { this._moduleRef = this.ngComponentOutletNgModuleFactory.create(getParentInjector(injector)); } else { this._moduleRef = undefined; } } this._componentRef = this._viewContainerRef.createComponent(this.ngComponentOutlet, { injector, ngModuleRef: this._moduleRef, projectableNodes: this.ngComponentOutletContent, }); } } } /** @docs-private */ ngDoCheck() { if (this._componentRef) { if (this.ngComponentOutletInputs) { for (const inputName of Object.keys(this.ngComponentOutletInputs)) { this._inputsUsed.set(inputName, true); } } this._applyInputStateDiff(this._componentRef); } } /** @docs-private */ ngOnDestroy() { this._moduleRef?.destroy(); } _applyInputStateDiff(componentRef) { for (const [inputName, touched] of this._inputsUsed) { if (!touched) { // The input that was previously active no longer exists and needs to be set to undefined. componentRef.setInput(inputName, undefined); this._inputsUsed.delete(inputName); } else { // Since touched is true, it can be asserted that the inputs object is not empty. componentRef.setInput(inputName, this.ngComponentOutletInputs[inputName]); this._inputsUsed.set(inputName, false); } } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgComponentOutlet, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgComponentOutlet, isStandalone: true, selector: "[ngComponentOutlet]", inputs: { ngComponentOutlet: "ngComponentOutlet", ngComponentOutletInputs: "ngComponentOutletInputs", ngComponentOutletInjector: "ngComponentOutletInjector", ngComponentOutletContent: "ngComponentOutletContent", ngComponentOutletNgModule: "ngComponentOutletNgModule", ngComponentOutletNgModuleFactory: "ngComponentOutletNgModuleFactory" }, exportAs: ["ngComponentOutlet"], usesOnChanges: true, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgComponentOutlet, decorators: [{ type: Directive, args: [{ selector: '[ngComponentOutlet]', exportAs: 'ngComponentOutlet', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { ngComponentOutlet: [{ type: Input }], ngComponentOutletInputs: [{ type: Input }], ngComponentOutletInjector: [{ type: Input }], ngComponentOutletContent: [{ type: Input }], ngComponentOutletNgModule: [{ type: Input }], ngComponentOutletNgModuleFactory: [{ type: Input }] } }); // Helper function that returns an Injector instance of a parent NgModule. function getParentInjector(injector) { const parentNgModule = injector.get(NgModuleRef); return parentNgModule.injector; } /** * @publicApi */ class NgForOfContext { $implicit; ngForOf; index; count; constructor( /** Reference to the current item from the collection. */ $implicit, /** * The value of the iterable expression. Useful when the expression is * more complex then a property access, for example when using the async pipe * (`userStreams | async`). */ ngForOf, /** Returns an index of the current item in the collection. */ index, /** Returns total amount of items in the collection. */ count) { this.$implicit = $implicit; this.ngForOf = ngForOf; this.index = index; this.count = count; } // Indicates whether this is the first item in the collection. get first() { return this.index === 0; } // Indicates whether this is the last item in the collection. get last() { return this.index === this.count - 1; } // Indicates whether an index of this item in the collection is even. get even() { return this.index % 2 === 0; } // Indicates whether an index of this item in the collection is odd. get odd() { return !this.even; } } /** * A [structural directive](guide/directives/structural-directives) that renders * a template for each item in a collection. * The directive is placed on an element, which becomes the parent * of the cloned templates. * * The `ngForOf` directive is generally used in the * [shorthand form](guide/directives/structural-directives#asterisk) `*ngFor`. * In this form, the template to be rendered for each iteration is the content * of an anchor element containing the directive. * * The following example shows the shorthand syntax with some options, * contained in an `
  • ` element. * * ```html *
  • ...
    • * ``` * * The shorthand form expands into a long form that uses the `ngForOf` selector * on an `` element. * The content of the `` element is the `
  • ` element that held the * short-form directive. * * Here is the expanded version of the short-form example. * * ```html * *
  • ...
    • *     * ``` * * Angular automatically expands the shorthand syntax as it compiles the template. * The context for each embedded view is logically merged to the current component * context according to its lexical position. * * When using the shorthand syntax, Angular allows only [one structural directive * on an element](guide/directives/structural-directives#one-per-element). * If you want to iterate conditionally, for example, * put the `*ngIf` on a container element that wraps the `*ngFor` element. * For further discussion, see * [Structural Directives](guide/directives/structural-directives#one-per-element). * * @usageNotes * * ### Local variables * * `NgForOf` provides exported values that can be aliased to local variables. * For example: * * ```html *
  • * {{i}}/{{users.length}}. {{user}} default *
    • * ``` * * The following exported values can be aliased to local variables: * * - `$implicit: T`: The value of the individual items in the iterable (`ngForOf`). * - `ngForOf: NgIterable`: The value of the iterable expression. Useful when the expression is * more complex then a property access, for example when using the async pipe (`userStreams | * async`). * - `index: number`: The index of the current item in the iterable. * - `count: number`: The length of the iterable. * - `first: boolean`: True when the item is the first item in the iterable. * - `last: boolean`: True when the item is the last item in the iterable. * - `even: boolean`: True when the item has an even index in the iterable. * - `odd: boolean`: True when the item has an odd index in the iterable. * * ### Change propagation * * When the contents of the iterator changes, `NgForOf` makes the corresponding changes to the DOM: * * * When an item is added, a new instance of the template is added to the DOM. * * When an item is removed, its template instance is removed from the DOM. * * When items are reordered, their respective templates are reordered in the DOM. * * Angular uses object identity to track insertions and deletions within the iterator and reproduce * those changes in the DOM. This has important implications for animations and any stateful * controls that are present, such as `` elements that accept user input. Inserted rows can * be animated in, deleted rows can be animated out, and unchanged rows retain any unsaved state * such as user input. * For more on animations, see [Transitions and Triggers](guide/animations/transition-and-triggers). * * The identities of elements in the iterator can change while the data does not. * This can happen, for example, if the iterator is produced from an RPC to the server, and that * RPC is re-run. Even if the data hasn't changed, the second response produces objects with * different identities, and Angular must tear down the entire DOM and rebuild it (as if all old * elements were deleted and all new elements inserted). * * To avoid this expensive operation, you can customize the default tracking algorithm. * by supplying the `trackBy` option to `NgForOf`. * `trackBy` takes a function that has two arguments: `index` and `item`. * If `trackBy` is given, Angular tracks changes by the return value of the function. * * @see [Structural Directives](guide/directives/structural-directives) * @ngModule CommonModule * @publicApi */ class NgForOf { _viewContainer; _template; _differs; /** * The value of the iterable expression, which can be used as a * [template input variable](guide/directives/structural-directives#shorthand). */ set ngForOf(ngForOf) { this._ngForOf = ngForOf; this._ngForOfDirty = true; } /** * Specifies a custom `TrackByFunction` to compute the identity of items in an iterable. * * If a custom `TrackByFunction` is not provided, `NgForOf` will use the item's [object * identity](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) * as the key. * * `NgForOf` uses the computed key to associate items in an iterable with DOM elements * it produces for these items. * * A custom `TrackByFunction` is useful to provide good user experience in cases when items in an * iterable rendered using `NgForOf` have a natural identifier (for example, custom ID or a * primary key), and this iterable could be updated with new object instances that still * represent the same underlying entity (for example, when data is re-fetched from the server, * and the iterable is recreated and re-rendered, but most of the data is still the same). * * @see {@link TrackByFunction} */ set ngForTrackBy(fn) { if ((typeof ngDevMode === 'undefined' || ngDevMode) && fn != null && typeof fn !== 'function') { console.warn(`trackBy must be a function, but received ${JSON.stringify(fn)}. ` + `See https://angular.io/api/common/NgForOf#change-propagation for more information.`); } this._trackByFn = fn; } get ngForTrackBy() { return this._trackByFn; } _ngForOf = null; _ngForOfDirty = true; _differ = null; // waiting for microsoft/typescript#43662 to allow the return type `TrackByFunction|undefined` for // the getter _trackByFn; constructor(_viewContainer, _template, _differs) { this._viewContainer = _viewContainer; this._template = _template; this._differs = _differs; } /** * A reference to the template that is stamped out for each item in the iterable. * @see [template reference variable](guide/templates/variables#template-reference-variables) */ set ngForTemplate(value) { // TODO(TS2.1): make TemplateRef>> once we move to TS v2.1 // The current type is too restrictive; a template that just uses index, for example, // should be acceptable. if (value) { this._template = value; } } /** * Applies the changes when needed. * @docs-private */ ngDoCheck() { if (this._ngForOfDirty) { this._ngForOfDirty = false; // React on ngForOf changes only once all inputs have been initialized const value = this._ngForOf; if (!this._differ && value) { if (typeof ngDevMode === 'undefined' || ngDevMode) { try { // CAUTION: this logic is duplicated for production mode below, as the try-catch // is only present in development builds. this._differ = this._differs.find(value).create(this.ngForTrackBy); } catch { let errorMessage = `Cannot find a differ supporting object '${value}' of type '` + `${getTypeName(value)}'. NgFor only supports binding to Iterables, such as Arrays.`; if (typeof value === 'object') { errorMessage += ' Did you mean to use the keyvalue pipe?'; } throw new _RuntimeError(-2200 /* RuntimeErrorCode.NG_FOR_MISSING_DIFFER */, errorMessage); } } else { // CAUTION: this logic is duplicated for development mode above, as the try-catch // is only present in development builds. this._differ = this._differs.find(value).create(this.ngForTrackBy); } } } if (this._differ) { const changes = this._differ.diff(this._ngForOf); if (changes) this._applyChanges(changes); } } _applyChanges(changes) { const viewContainer = this._viewContainer; changes.forEachOperation((item, adjustedPreviousIndex, currentIndex) => { if (item.previousIndex == null) { // NgForOf is never "null" or "undefined" here because the differ detected // that a new item needs to be inserted from the iterable. This implies that // there is an iterable value for "_ngForOf". viewContainer.createEmbeddedView(this._template, new NgForOfContext(item.item, this._ngForOf, -1, -1), currentIndex === null ? undefined : currentIndex); } else if (currentIndex == null) { viewContainer.remove(adjustedPreviousIndex === null ? undefined : adjustedPreviousIndex); } else if (adjustedPreviousIndex !== null) { const view = viewContainer.get(adjustedPreviousIndex); viewContainer.move(view, currentIndex); applyViewChange(view, item); } }); for (let i = 0, ilen = viewContainer.length; i < ilen; i++) { const viewRef = viewContainer.get(i); const context = viewRef.context; context.index = i; context.count = ilen; context.ngForOf = this._ngForOf; } changes.forEachIdentityChange((record) => { const viewRef = viewContainer.get(record.currentIndex); applyViewChange(viewRef, record); }); } /** * Asserts the correct type of the context for the template that `NgForOf` will render. * * The presence of this method is a signal to the Ivy template type-check compiler that the * `NgForOf` structural directive renders its template with a specific context type. */ static ngTemplateContextGuard(dir, ctx) { return true; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgForOf, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }, { token: i0.IterableDiffers }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgForOf, isStandalone: true, selector: "[ngFor][ngForOf]", inputs: { ngForOf: "ngForOf", ngForTrackBy: "ngForTrackBy", ngForTemplate: "ngForTemplate" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgForOf, decorators: [{ type: Directive, args: [{ selector: '[ngFor][ngForOf]', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }, { type: i0.IterableDiffers }], propDecorators: { ngForOf: [{ type: Input }], ngForTrackBy: [{ type: Input }], ngForTemplate: [{ type: Input }] } }); function applyViewChange(view, record) { view.context.$implicit = record.item; } function getTypeName(type) { return type['name'] || typeof type; } /** * A structural directive that conditionally includes a template based on the value of * an expression coerced to Boolean. * When the expression evaluates to true, Angular renders the template * provided in a `then` clause, and when false or null, * Angular renders the template provided in an optional `else` clause. The default * template for the `else` clause is blank. * * A [shorthand form](guide/directives/structural-directives#asterisk) of the directive, * `*ngIf="condition"`, is generally used, provided * as an attribute of the anchor element for the inserted template. * Angular expands this into a more explicit version, in which the anchor element * is contained in an `` element. * * Simple form with shorthand syntax: * * ```html *
    Content to render when condition is true.
    * ``` * * Simple form with expanded syntax: * * ```html *
    Content to render when condition is * true.
     * ``` * * Form with an "else" block: * * ```html *
    Content to render when condition is true.
    * Content to render when condition is false. * ``` * * Shorthand form with "then" and "else" blocks: * * ```html *
    * Content to render when condition is true. * Content to render when condition is false. * ``` * * Form with storing the value locally: * * ```html *
    {{value}}
    * Content to render when value is null. * ``` * * @usageNotes * * The `*ngIf` directive is most commonly used to conditionally show an inline template, * as seen in the following example. * The default `else` template is blank. * * {@example common/ngIf/ts/module.ts region='NgIfSimple'} * * ### Showing an alternative template using `else` * * To display a template when `expression` evaluates to false, use an `else` template * binding as shown in the following example. * The `else` binding points to an `` element labeled `#elseBlock`. * The template can be defined anywhere in the component view, but is typically placed right after * `ngIf` for readability. * * {@example common/ngIf/ts/module.ts region='NgIfElse'} * * ### Using an external `then` template * * In the previous example, the then-clause template is specified inline, as the content of the * tag that contains the `ngIf` directive. You can also specify a template that is defined * externally, by referencing a labeled `` element. When you do this, you can * change which template to use at runtime, as shown in the following example. * * {@example common/ngIf/ts/module.ts region='NgIfThenElse'} * * ### Storing a conditional result in a variable * * You might want to show a set of properties from the same object. If you are waiting * for asynchronous data, the object can be undefined. * In this case, you can use `ngIf` and store the result of the condition in a local * variable as shown in the following example. * * {@example common/ngIf/ts/module.ts region='NgIfAs'} * * This code uses only one `AsyncPipe`, so only one subscription is created. * The conditional statement stores the result of `userStream|async` in the local variable `user`. * You can then bind the local `user` repeatedly. * * The conditional displays the data only if `userStream` returns a value, * so you don't need to use the * safe-navigation-operator (`?.`) * to guard against null values when accessing properties. * You can display an alternative template while waiting for the data. * * ### Shorthand syntax * * The shorthand syntax `*ngIf` expands into two separate template specifications * for the "then" and "else" clauses. For example, consider the following shorthand statement, * that is meant to show a loading page while waiting for data to be loaded. * * ```html *
    * ... *
    * * *
    Loading...
    *     * ``` * * You can see that the "else" clause references the `` * with the `#loading` label, and the template for the "then" clause * is provided as the content of the anchor element. * * However, when Angular expands the shorthand syntax, it creates * another `` tag, with `ngIf` and `ngIfElse` directives. * The anchor element containing the template for the "then" clause becomes * the content of this unlabeled `` tag. * * ```html * *
    * ... *
    *     * * *
    Loading...
    *     * ``` * * The presence of the implicit template object has implications for the nesting of * structural directives. For more on this subject, see * [Structural Directives](guide/directives/structural-directives#one-per-element). * * @ngModule CommonModule * @publicApi */ class NgIf { _viewContainer; _context = new NgIfContext(); _thenTemplateRef = null; _elseTemplateRef = null; _thenViewRef = null; _elseViewRef = null; constructor(_viewContainer, templateRef) { this._viewContainer = _viewContainer; this._thenTemplateRef = templateRef; } /** * The Boolean expression to evaluate as the condition for showing a template. */ set ngIf(condition) { this._context.$implicit = this._context.ngIf = condition; this._updateView(); } /** * A template to show if the condition expression evaluates to true. */ set ngIfThen(templateRef) { assertTemplate(templateRef, (typeof ngDevMode === 'undefined' || ngDevMode) && 'ngIfThen'); this._thenTemplateRef = templateRef; this._thenViewRef = null; // clear previous view if any. this._updateView(); } /** * A template to show if the condition expression evaluates to false. */ set ngIfElse(templateRef) { assertTemplate(templateRef, (typeof ngDevMode === 'undefined' || ngDevMode) && 'ngIfElse'); this._elseTemplateRef = templateRef; this._elseViewRef = null; // clear previous view if any. this._updateView(); } _updateView() { if (this._context.$implicit) { if (!this._thenViewRef) { this._viewContainer.clear(); this._elseViewRef = null; if (this._thenTemplateRef) { this._thenViewRef = this._viewContainer.createEmbeddedView(this._thenTemplateRef, this._context); } } } else { if (!this._elseViewRef) { this._viewContainer.clear(); this._thenViewRef = null; if (this._elseTemplateRef) { this._elseViewRef = this._viewContainer.createEmbeddedView(this._elseTemplateRef, this._context); } } } } /** @internal */ static ngIfUseIfTypeGuard; /** * Assert the correct type of the expression bound to the `ngIf` input within the template. * * The presence of this static field is a signal to the Ivy template type check compiler that * when the `NgIf` structural directive renders its template, the type of the expression bound * to `ngIf` should be narrowed in some way. For `NgIf`, the binding expression itself is used to * narrow its type, which allows the strictNullChecks feature of TypeScript to work with `NgIf`. */ static ngTemplateGuard_ngIf; /** * Asserts the correct type of the context for the template that `NgIf` will render. * * The presence of this method is a signal to the Ivy template type-check compiler that the * `NgIf` structural directive renders its template with a specific context type. */ static ngTemplateContextGuard(dir, ctx) { return true; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgIf, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgIf, isStandalone: true, selector: "[ngIf]", inputs: { ngIf: "ngIf", ngIfThen: "ngIfThen", ngIfElse: "ngIfElse" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgIf, decorators: [{ type: Directive, args: [{ selector: '[ngIf]', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }], propDecorators: { ngIf: [{ type: Input }], ngIfThen: [{ type: Input }], ngIfElse: [{ type: Input }] } }); /** * @publicApi */ class NgIfContext { $implicit = null; ngIf = null; } function assertTemplate(templateRef, property) { if (templateRef && !templateRef.createEmbeddedView) { throw new _RuntimeError(2020 /* RuntimeErrorCode.NG_IF_NOT_A_TEMPLATE_REF */, (typeof ngDevMode === 'undefined' || ngDevMode) && `${property} must be a TemplateRef, but received '${_stringify(templateRef)}'.`); } } class SwitchView { _viewContainerRef; _templateRef; _created = false; constructor(_viewContainerRef, _templateRef) { this._viewContainerRef = _viewContainerRef; this._templateRef = _templateRef; } create() { this._created = true; this._viewContainerRef.createEmbeddedView(this._templateRef); } destroy() { this._created = false; this._viewContainerRef.clear(); } enforceState(created) { if (created && !this._created) { this.create(); } else if (!created && this._created) { this.destroy(); } } } /** * @ngModule CommonModule * * @description * The `[ngSwitch]` directive on a container specifies an expression to match against. * The expressions to match are provided by `ngSwitchCase` directives on views within the container. * - Every view that matches is rendered. * - If there are no matches, a view with the `ngSwitchDefault` directive is rendered. * - Elements within the `[NgSwitch]` statement but outside of any `NgSwitchCase` * or `ngSwitchDefault` directive are preserved at the location. * * @usageNotes * Define a container element for the directive, and specify the switch expression * to match against as an attribute: * * ```html * * ``` * * Within the container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ```html * * ... * ... * ... * * ``` * * ### Usage Examples * * The following example shows how to use more than one case to display the same view: * * ```html * * * ... * ... * ... * * ... * * ``` * * The following example shows how cases can be nested: * ```html * * ... * ... * ... * * * * * * ... * * ``` * * @publicApi * @see {@link NgSwitchCase} * @see {@link NgSwitchDefault} * @see [Structural Directives](guide/directives/structural-directives) * */ class NgSwitch { _defaultViews = []; _defaultUsed = false; _caseCount = 0; _lastCaseCheckIndex = 0; _lastCasesMatched = false; _ngSwitch; set ngSwitch(newValue) { this._ngSwitch = newValue; if (this._caseCount === 0) { this._updateDefaultCases(true); } } /** @internal */ _addCase() { return this._caseCount++; } /** @internal */ _addDefault(view) { this._defaultViews.push(view); } /** @internal */ _matchCase(value) { const matched = value === this._ngSwitch; this._lastCasesMatched ||= matched; this._lastCaseCheckIndex++; if (this._lastCaseCheckIndex === this._caseCount) { this._updateDefaultCases(!this._lastCasesMatched); this._lastCaseCheckIndex = 0; this._lastCasesMatched = false; } return matched; } _updateDefaultCases(useDefault) { if (this._defaultViews.length > 0 && useDefault !== this._defaultUsed) { this._defaultUsed = useDefault; for (const defaultView of this._defaultViews) { defaultView.enforceState(useDefault); } } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitch, deps: [], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgSwitch, isStandalone: true, selector: "[ngSwitch]", inputs: { ngSwitch: "ngSwitch" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitch, decorators: [{ type: Directive, args: [{ selector: '[ngSwitch]', }] }], propDecorators: { ngSwitch: [{ type: Input }] } }); /** * @ngModule CommonModule * * @description * Provides a switch case expression to match against an enclosing `ngSwitch` expression. * When the expressions match, the given `NgSwitchCase` template is rendered. * If multiple match expressions match the switch expression value, all of them are displayed. * * @usageNotes * * Within a switch container, `*ngSwitchCase` statements specify the match expressions * as attributes. Include `*ngSwitchDefault` as the final case. * * ```html * * ... * ... * ... * * ``` * * Each switch-case statement contains an in-line HTML template or template reference * that defines the subtree to be selected if the value of the match expression * matches the value of the switch expression. * * As of Angular v17 the NgSwitch directive uses strict equality comparison (`===`) instead of * loose equality (`==`) to match different cases. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchDefault} * */ class NgSwitchCase { ngSwitch; _view; /** * Stores the HTML template to be selected on match. */ ngSwitchCase; constructor(viewContainer, templateRef, ngSwitch) { this.ngSwitch = ngSwitch; if ((typeof ngDevMode === 'undefined' || ngDevMode) && !ngSwitch) { throwNgSwitchProviderNotFoundError('ngSwitchCase', 'NgSwitchCase'); } ngSwitch._addCase(); this._view = new SwitchView(viewContainer, templateRef); } /** * Performs case matching. For internal use only. * @docs-private */ ngDoCheck() { this._view.enforceState(this.ngSwitch._matchCase(this.ngSwitchCase)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitchCase, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }, { token: NgSwitch, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgSwitchCase, isStandalone: true, selector: "[ngSwitchCase]", inputs: { ngSwitchCase: "ngSwitchCase" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitchCase, decorators: [{ type: Directive, args: [{ selector: '[ngSwitchCase]', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }, { type: NgSwitch, decorators: [{ type: Optional }, { type: Host }] }], propDecorators: { ngSwitchCase: [{ type: Input }] } }); /** * @ngModule CommonModule * * @description * * Creates a view that is rendered when no `NgSwitchCase` expressions * match the `NgSwitch` expression. * This statement should be the final case in an `NgSwitch`. * * @publicApi * @see {@link NgSwitch} * @see {@link NgSwitchCase} * */ class NgSwitchDefault { constructor(viewContainer, templateRef, ngSwitch) { if ((typeof ngDevMode === 'undefined' || ngDevMode) && !ngSwitch) { throwNgSwitchProviderNotFoundError('ngSwitchDefault', 'NgSwitchDefault'); } ngSwitch._addDefault(new SwitchView(viewContainer, templateRef)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitchDefault, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }, { token: NgSwitch, host: true, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgSwitchDefault, isStandalone: true, selector: "[ngSwitchDefault]", ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgSwitchDefault, decorators: [{ type: Directive, args: [{ selector: '[ngSwitchDefault]', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }, { type: NgSwitch, decorators: [{ type: Optional }, { type: Host }] }] }); function throwNgSwitchProviderNotFoundError(attrName, directiveName) { throw new _RuntimeError(2000 /* RuntimeErrorCode.PARENT_NG_SWITCH_NOT_FOUND */, `An element with the "${attrName}" attribute ` + `(matching the "${directiveName}" directive) must be located inside an element with the "ngSwitch" attribute ` + `(matching "NgSwitch" directive)`); } /** * @ngModule CommonModule * * @usageNotes * ```html * * there is nothing * there is one * there are a few * * ``` * * @description * * Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization. * * Displays DOM sub-trees that match the switch expression value, or failing that, DOM sub-trees * that match the switch expression's pluralization category. * * To use this directive you must provide a container element that sets the `[ngPlural]` attribute * to a switch expression. Inner elements with a `[ngPluralCase]` will display based on their * expression: * - if `[ngPluralCase]` is set to a value starting with `=`, it will only display if the value * matches the switch expression exactly, * - otherwise, the view will be treated as a "category match", and will only display if exact * value matches aren't found and the value maps to its category for the defined locale. * * See http://cldr.unicode.org/index/cldr-spec/plural-rules * * @publicApi */ class NgPlural { _localization; _activeView; _caseViews = {}; constructor(_localization) { this._localization = _localization; } set ngPlural(value) { this._updateView(value); } addCase(value, switchView) { this._caseViews[value] = switchView; } _updateView(switchValue) { this._clearViews(); const cases = Object.keys(this._caseViews); const key = getPluralCategory(switchValue, cases, this._localization); this._activateView(this._caseViews[key]); } _clearViews() { if (this._activeView) this._activeView.destroy(); } _activateView(view) { if (view) { this._activeView = view; this._activeView.create(); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgPlural, deps: [{ token: NgLocalization }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgPlural, isStandalone: true, selector: "[ngPlural]", inputs: { ngPlural: "ngPlural" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgPlural, decorators: [{ type: Directive, args: [{ selector: '[ngPlural]', }] }], ctorParameters: () => [{ type: NgLocalization }], propDecorators: { ngPlural: [{ type: Input }] } }); /** * @ngModule CommonModule * * @description * * Creates a view that will be added/removed from the parent {@link NgPlural} when the * given expression matches the plural expression according to CLDR rules. * * @usageNotes * ```html * * ... * ... * *``` * * See {@link NgPlural} for more details and example. * * @publicApi */ class NgPluralCase { value; constructor(value, template, viewContainer, ngPlural) { this.value = value; const isANumber = !isNaN(Number(value)); ngPlural.addCase(isANumber ? `=${value}` : value, new SwitchView(viewContainer, template)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgPluralCase, deps: [{ token: 'ngPluralCase', attribute: true }, { token: i0.TemplateRef }, { token: i0.ViewContainerRef }, { token: NgPlural, host: true }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgPluralCase, isStandalone: true, selector: "[ngPluralCase]", ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgPluralCase, decorators: [{ type: Directive, args: [{ selector: '[ngPluralCase]', }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Attribute, args: ['ngPluralCase'] }] }, { type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: NgPlural, decorators: [{ type: Host }] }] }); /** * @ngModule CommonModule * * @usageNotes * * Set the width of the containing element to a pixel value returned by an expression. * * ```html * ... * ``` * * Set a collection of style values using an expression that returns key-value pairs. * * ```html * ... * ``` * * For more simple use cases you can use the [style bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly. * It doesn't require importing a directive. * * Set the font of the containing element to the result of an expression. * * ```html * ... * ``` * * @description * * An attribute directive that updates styles for the containing HTML element. * Sets one or more style properties, specified as colon-separated key-value pairs. * The key is a style name, with an optional `.` suffix * (such as 'top.px', 'font-style.em'). * The value is an expression to be evaluated. * The resulting non-null value, expressed in the given unit, * is assigned to the given style property. * If the result of evaluation is null, the corresponding style is removed. * * @see [Style bindings](/guide/templates/binding#css-class-and-style-property-bindings) * * @publicApi */ class NgStyle { _ngEl; _differs; _renderer; _ngStyle = null; _differ = null; constructor(_ngEl, _differs, _renderer) { this._ngEl = _ngEl; this._differs = _differs; this._renderer = _renderer; } set ngStyle(values) { this._ngStyle = values; if (!this._differ && values) { this._differ = this._differs.find(values).create(); } } ngDoCheck() { if (this._differ) { const changes = this._differ.diff(this._ngStyle); if (changes) { this._applyChanges(changes); } } } _setStyle(nameAndUnit, value) { const [name, unit] = nameAndUnit.split('.'); const flags = name.indexOf('-') === -1 ? undefined : RendererStyleFlags2.DashCase; if (value != null) { this._renderer.setStyle(this._ngEl.nativeElement, name, unit ? `${value}${unit}` : value, flags); } else { this._renderer.removeStyle(this._ngEl.nativeElement, name, flags); } } _applyChanges(changes) { changes.forEachRemovedItem((record) => this._setStyle(record.key, null)); changes.forEachAddedItem((record) => this._setStyle(record.key, record.currentValue)); changes.forEachChangedItem((record) => this._setStyle(record.key, record.currentValue)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgStyle, deps: [{ token: i0.ElementRef }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgStyle, isStandalone: true, selector: "[ngStyle]", inputs: { ngStyle: "ngStyle" }, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgStyle, decorators: [{ type: Directive, args: [{ selector: '[ngStyle]', }] }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }], propDecorators: { ngStyle: [{ type: Input, args: ['ngStyle'] }] } }); /** * @ngModule CommonModule * * @description * * Inserts an embedded view from a prepared `TemplateRef`. * * You can attach a context object to the `EmbeddedViewRef` by setting `[ngTemplateOutletContext]`. * `[ngTemplateOutletContext]` should be an object, the object's keys will be available for binding * by the local template `let` declarations. * * @usageNotes * ```html * * ``` * * Using the key `$implicit` in the context object will set its value as default. * * ### Example * * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'} * * @publicApi */ class NgTemplateOutlet { _viewContainerRef; _viewRef = null; /** * A context object to attach to the {@link EmbeddedViewRef}. This should be an * object, the object's keys will be available for binding by the local template `let` * declarations. * Using the key `$implicit` in the context object will set its value as default. */ ngTemplateOutletContext = null; /** * A string defining the template reference and optionally the context object for the template. */ ngTemplateOutlet = null; /** Injector to be used within the embedded view. */ ngTemplateOutletInjector = null; constructor(_viewContainerRef) { this._viewContainerRef = _viewContainerRef; } ngOnChanges(changes) { if (this._shouldRecreateView(changes)) { const viewContainerRef = this._viewContainerRef; if (this._viewRef) { viewContainerRef.remove(viewContainerRef.indexOf(this._viewRef)); } // If there is no outlet, clear the destroyed view ref. if (!this.ngTemplateOutlet) { this._viewRef = null; return; } // Create a context forward `Proxy` that will always bind to the user-specified context, // without having to destroy and re-create views whenever the context changes. const viewContext = this._createContextForwardProxy(); this._viewRef = viewContainerRef.createEmbeddedView(this.ngTemplateOutlet, viewContext, { injector: this.ngTemplateOutletInjector ?? undefined, }); } } /** * We need to re-create existing embedded view if either is true: * - the outlet changed. * - the injector changed. */ _shouldRecreateView(changes) { return !!changes['ngTemplateOutlet'] || !!changes['ngTemplateOutletInjector']; } /** * For a given outlet instance, we create a proxy object that delegates * to the user-specified context. This allows changing, or swapping out * the context object completely without having to destroy/re-create the view. */ _createContextForwardProxy() { return new Proxy({}, { set: (_target, prop, newValue) => { if (!this.ngTemplateOutletContext) { return false; } return Reflect.set(this.ngTemplateOutletContext, prop, newValue); }, get: (_target, prop, receiver) => { if (!this.ngTemplateOutletContext) { return undefined; } return Reflect.get(this.ngTemplateOutletContext, prop, receiver); }, }); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgTemplateOutlet, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.14", type: NgTemplateOutlet, isStandalone: true, selector: "[ngTemplateOutlet]", inputs: { ngTemplateOutletContext: "ngTemplateOutletContext", ngTemplateOutlet: "ngTemplateOutlet", ngTemplateOutletInjector: "ngTemplateOutletInjector" }, usesOnChanges: true, ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgTemplateOutlet, decorators: [{ type: Directive, args: [{ selector: '[ngTemplateOutlet]', }] }], ctorParameters: () => [{ type: i0.ViewContainerRef }], propDecorators: { ngTemplateOutletContext: [{ type: Input }], ngTemplateOutlet: [{ type: Input }], ngTemplateOutletInjector: [{ type: Input }] } }); /** * A collection of Angular directives that are likely to be used in each and every Angular * application. */ const COMMON_DIRECTIVES = [ NgClass, NgComponentOutlet, NgForOf, NgIf, NgTemplateOutlet, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgPlural, NgPluralCase, ]; function invalidPipeArgumentError(type, value) { return new _RuntimeError(2100 /* RuntimeErrorCode.INVALID_PIPE_ARGUMENT */, ngDevMode && `InvalidPipeArgument: '${value}' for pipe '${_stringify(type)}'`); } class SubscribableStrategy { createSubscription(async, updateLatestValue) { // Subscription can be side-effectful, and we don't want any signal reads which happen in the // side effect of the subscription to be tracked by a component's template when that // subscription is triggered via the async pipe. So we wrap the subscription in `untracked` to // decouple from the current reactive context. // // `untracked` also prevents signal _writes_ which happen in the subscription side effect from // being treated as signal writes during the template evaluation (which throws errors). return untracked(() => async.subscribe({ next: updateLatestValue, error: (e) => { throw e; }, })); } dispose(subscription) { // See the comment in `createSubscription` above on the use of `untracked`. untracked(() => subscription.unsubscribe()); } } class PromiseStrategy { createSubscription(async, updateLatestValue) { // According to the promise specification, promises are not cancellable by default. // Once a promise is created, it will either resolve or reject, and it doesn't // provide a built-in mechanism to cancel it. // There may be situations where a promise is provided, and it either resolves after // the pipe has been destroyed or never resolves at all. If the promise never // resolves — potentially due to factors beyond our control, such as third-party // libraries — this can lead to a memory leak. // When we use `async.then(updateLatestValue)`, the engine captures a reference to the // `updateLatestValue` function. This allows the promise to invoke that function when it // resolves. In this case, the promise directly captures a reference to the // `updateLatestValue` function. If the promise resolves later, it retains a reference // to the original `updateLatestValue`, meaning that even if the context where // `updateLatestValue` was defined has been destroyed, the function reference remains in memory. // This can lead to memory leaks if `updateLatestValue` is no longer needed or if it holds // onto resources that should be released. // When we do `async.then(v => ...)` the promise captures a reference to the lambda // function (the arrow function). // When we assign `updateLatestValue = null` within the context of an `unsubscribe` function, // we're changing the reference of `updateLatestValue` in the current scope to `null`. // The lambda will no longer have access to it after the assignment, effectively // preventing any further calls to the original function and allowing it to be garbage collected. async.then( // Using optional chaining because we may have set it to `null`; since the promise // is async, the view might be destroyed by the time the promise resolves. (v) => updateLatestValue?.(v), (e) => { throw e; }); return { unsubscribe: () => { updateLatestValue = null; }, }; } dispose(subscription) { subscription.unsubscribe(); } } const _promiseStrategy = new PromiseStrategy(); const _subscribableStrategy = new SubscribableStrategy(); /** * @ngModule CommonModule * @description * * Unwraps a value from an asynchronous primitive. * * The `async` pipe subscribes to an `Observable` or `Promise` and returns the latest value it has * emitted. When a new value is emitted, the `async` pipe marks the component to be checked for * changes. When the component gets destroyed, the `async` pipe unsubscribes automatically to avoid * potential memory leaks. When the reference of the expression changes, the `async` pipe * automatically unsubscribes from the old `Observable` or `Promise` and subscribes to the new one. * * @usageNotes * * ### Examples * * This example binds a `Promise` to the view. Clicking the `Resolve` button resolves the * promise. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipePromise'} * * It's also possible to use `async` with Observables. The example below binds the `time` Observable * to the view. The Observable continuously updates the view with the current time. * * {@example common/pipes/ts/async_pipe.ts region='AsyncPipeObservable'} * * @publicApi */ class AsyncPipe { _ref; _latestValue = null; markForCheckOnValueUpdate = true; _subscription = null; _obj = null; _strategy = null; constructor(ref) { // Assign `ref` into `this._ref` manually instead of declaring `_ref` in the constructor // parameter list, as the type of `this._ref` includes `null` unlike the type of `ref`. this._ref = ref; } ngOnDestroy() { if (this._subscription) { this._dispose(); } // Clear the `ChangeDetectorRef` and its association with the view data, to mitigate // potential memory leaks in Observables that could otherwise cause the view data to // be retained. // https://github.com/angular/angular/issues/17624 this._ref = null; } transform(obj) { if (!this._obj) { if (obj) { try { // Only call `markForCheck` if the value is updated asynchronously. // Synchronous updates _during_ subscription should not wastefully mark for check - // this value is already going to be returned from the transform function. this.markForCheckOnValueUpdate = false; this._subscribe(obj); } finally { this.markForCheckOnValueUpdate = true; } } return this._latestValue; } if (obj !== this._obj) { this._dispose(); return this.transform(obj); } return this._latestValue; } _subscribe(obj) { this._obj = obj; this._strategy = this._selectStrategy(obj); this._subscription = this._strategy.createSubscription(obj, (value) => this._updateLatestValue(obj, value)); } _selectStrategy(obj) { if (_isPromise(obj)) { return _promiseStrategy; } if (_isSubscribable(obj)) { return _subscribableStrategy; } throw invalidPipeArgumentError(AsyncPipe, obj); } _dispose() { // Note: `dispose` is only called if a subscription has been initialized before, indicating // that `this._strategy` is also available. this._strategy.dispose(this._subscription); this._latestValue = null; this._subscription = null; this._obj = null; } _updateLatestValue(async, value) { if (async === this._obj) { this._latestValue = value; if (this.markForCheckOnValueUpdate) { this._ref?.markForCheck(); } } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncPipe, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: AsyncPipe, isStandalone: true, name: "async", pure: false }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AsyncPipe, decorators: [{ type: Pipe, args: [{ name: 'async', pure: false, }] }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] }); /** * Transforms text to all lower case. * * @see {@link UpperCasePipe} * @see {@link TitleCasePipe} * @usageNotes * * The following example defines a view that allows the user to enter * text, and then uses the pipe to convert the input text to all lower case. * * {@example common/pipes/ts/lowerupper_pipe.ts region='LowerUpperPipe'} * * @ngModule CommonModule * @publicApi */ class LowerCasePipe { transform(value) { if (value == null) return null; if (typeof value !== 'string') { throw invalidPipeArgumentError(LowerCasePipe, value); } return value.toLowerCase(); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LowerCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: LowerCasePipe, isStandalone: true, name: "lowercase" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LowerCasePipe, decorators: [{ type: Pipe, args: [{ name: 'lowercase', }] }] }); // // Regex below matches any Unicode word and number compatible with ES5. In ES2018 the same result // can be achieved by using /[0-9\p{L}]\S*/gu and also known as Unicode Property Escapes // (https://2ality.com/2017/07/regexp-unicode-property-escapes.html). Since there is no // transpilation of this functionality down to ES5 without external tool, the only solution is // to use already transpiled form. Example can be found here - // https://mothereff.in/regexpu#input=var+regex+%3D+%2F%5B0-9%5Cp%7BL%7D%5D%5CS*%2Fgu%3B%0A%0A&unicodePropertyEscape=1 // const unicodeWordMatch = /(?:[0-9A-Za-z\xAA\xB5\xBA\xC0-\xD6\xD8-\xF6\xF8-\u02C1\u02C6-\u02D1\u02E0-\u02E4\u02EC\u02EE\u0370-\u0374\u0376\u0377\u037A-\u037D\u037F\u0386\u0388-\u038A\u038C\u038E-\u03A1\u03A3-\u03F5\u03F7-\u0481\u048A-\u052F\u0531-\u0556\u0559\u0560-\u0588\u05D0-\u05EA\u05EF-\u05F2\u0620-\u064A\u066E\u066F\u0671-\u06D3\u06D5\u06E5\u06E6\u06EE\u06EF\u06FA-\u06FC\u06FF\u0710\u0712-\u072F\u074D-\u07A5\u07B1\u07CA-\u07EA\u07F4\u07F5\u07FA\u0800-\u0815\u081A\u0824\u0828\u0840-\u0858\u0860-\u086A\u0870-\u0887\u0889-\u088E\u08A0-\u08C9\u0904-\u0939\u093D\u0950\u0958-\u0961\u0971-\u0980\u0985-\u098C\u098F\u0990\u0993-\u09A8\u09AA-\u09B0\u09B2\u09B6-\u09B9\u09BD\u09CE\u09DC\u09DD\u09DF-\u09E1\u09F0\u09F1\u09FC\u0A05-\u0A0A\u0A0F\u0A10\u0A13-\u0A28\u0A2A-\u0A30\u0A32\u0A33\u0A35\u0A36\u0A38\u0A39\u0A59-\u0A5C\u0A5E\u0A72-\u0A74\u0A85-\u0A8D\u0A8F-\u0A91\u0A93-\u0AA8\u0AAA-\u0AB0\u0AB2\u0AB3\u0AB5-\u0AB9\u0ABD\u0AD0\u0AE0\u0AE1\u0AF9\u0B05-\u0B0C\u0B0F\u0B10\u0B13-\u0B28\u0B2A-\u0B30\u0B32\u0B33\u0B35-\u0B39\u0B3D\u0B5C\u0B5D\u0B5F-\u0B61\u0B71\u0B83\u0B85-\u0B8A\u0B8E-\u0B90\u0B92-\u0B95\u0B99\u0B9A\u0B9C\u0B9E\u0B9F\u0BA3\u0BA4\u0BA8-\u0BAA\u0BAE-\u0BB9\u0BD0\u0C05-\u0C0C\u0C0E-\u0C10\u0C12-\u0C28\u0C2A-\u0C39\u0C3D\u0C58-\u0C5A\u0C5D\u0C60\u0C61\u0C80\u0C85-\u0C8C\u0C8E-\u0C90\u0C92-\u0CA8\u0CAA-\u0CB3\u0CB5-\u0CB9\u0CBD\u0CDD\u0CDE\u0CE0\u0CE1\u0CF1\u0CF2\u0D04-\u0D0C\u0D0E-\u0D10\u0D12-\u0D3A\u0D3D\u0D4E\u0D54-\u0D56\u0D5F-\u0D61\u0D7A-\u0D7F\u0D85-\u0D96\u0D9A-\u0DB1\u0DB3-\u0DBB\u0DBD\u0DC0-\u0DC6\u0E01-\u0E30\u0E32\u0E33\u0E40-\u0E46\u0E81\u0E82\u0E84\u0E86-\u0E8A\u0E8C-\u0EA3\u0EA5\u0EA7-\u0EB0\u0EB2\u0EB3\u0EBD\u0EC0-\u0EC4\u0EC6\u0EDC-\u0EDF\u0F00\u0F40-\u0F47\u0F49-\u0F6C\u0F88-\u0F8C\u1000-\u102A\u103F\u1050-\u1055\u105A-\u105D\u1061\u1065\u1066\u106E-\u1070\u1075-\u1081\u108E\u10A0-\u10C5\u10C7\u10CD\u10D0-\u10FA\u10FC-\u1248\u124A-\u124D\u1250-\u1256\u1258\u125A-\u125D\u1260-\u1288\u128A-\u128D\u1290-\u12B0\u12B2-\u12B5\u12B8-\u12BE\u12C0\u12C2-\u12C5\u12C8-\u12D6\u12D8-\u1310\u1312-\u1315\u1318-\u135A\u1380-\u138F\u13A0-\u13F5\u13F8-\u13FD\u1401-\u166C\u166F-\u167F\u1681-\u169A\u16A0-\u16EA\u16F1-\u16F8\u1700-\u1711\u171F-\u1731\u1740-\u1751\u1760-\u176C\u176E-\u1770\u1780-\u17B3\u17D7\u17DC\u1820-\u1878\u1880-\u1884\u1887-\u18A8\u18AA\u18B0-\u18F5\u1900-\u191E\u1950-\u196D\u1970-\u1974\u1980-\u19AB\u19B0-\u19C9\u1A00-\u1A16\u1A20-\u1A54\u1AA7\u1B05-\u1B33\u1B45-\u1B4C\u1B83-\u1BA0\u1BAE\u1BAF\u1BBA-\u1BE5\u1C00-\u1C23\u1C4D-\u1C4F\u1C5A-\u1C7D\u1C80-\u1C88\u1C90-\u1CBA\u1CBD-\u1CBF\u1CE9-\u1CEC\u1CEE-\u1CF3\u1CF5\u1CF6\u1CFA\u1D00-\u1DBF\u1E00-\u1F15\u1F18-\u1F1D\u1F20-\u1F45\u1F48-\u1F4D\u1F50-\u1F57\u1F59\u1F5B\u1F5D\u1F5F-\u1F7D\u1F80-\u1FB4\u1FB6-\u1FBC\u1FBE\u1FC2-\u1FC4\u1FC6-\u1FCC\u1FD0-\u1FD3\u1FD6-\u1FDB\u1FE0-\u1FEC\u1FF2-\u1FF4\u1FF6-\u1FFC\u2071\u207F\u2090-\u209C\u2102\u2107\u210A-\u2113\u2115\u2119-\u211D\u2124\u2126\u2128\u212A-\u212D\u212F-\u2139\u213C-\u213F\u2145-\u2149\u214E\u2183\u2184\u2C00-\u2CE4\u2CEB-\u2CEE\u2CF2\u2CF3\u2D00-\u2D25\u2D27\u2D2D\u2D30-\u2D67\u2D6F\u2D80-\u2D96\u2DA0-\u2DA6\u2DA8-\u2DAE\u2DB0-\u2DB6\u2DB8-\u2DBE\u2DC0-\u2DC6\u2DC8-\u2DCE\u2DD0-\u2DD6\u2DD8-\u2DDE\u2E2F\u3005\u3006\u3031-\u3035\u303B\u303C\u3041-\u3096\u309D-\u309F\u30A1-\u30FA\u30FC-\u30FF\u3105-\u312F\u3131-\u318E\u31A0-\u31BF\u31F0-\u31FF\u3400-\u4DBF\u4E00-\uA48C\uA4D0-\uA4FD\uA500-\uA60C\uA610-\uA61F\uA62A\uA62B\uA640-\uA66E\uA67F-\uA69D\uA6A0-\uA6E5\uA717-\uA71F\uA722-\uA788\uA78B-\uA7CA\uA7D0\uA7D1\uA7D3\uA7D5-\uA7D9\uA7F2-\uA801\uA803-\uA805\uA807-\uA80A\uA80C-\uA822\uA840-\uA873\uA882-\uA8B3\uA8F2-\uA8F7\uA8FB\uA8FD\uA8FE\uA90A-\uA925\uA930-\uA946\uA960-\uA97C\uA984-\uA9B2\uA9CF\uA9E0-\uA9E4\uA9E6-\uA9EF\uA9FA-\uA9FE\uAA00-\uAA28\uAA40-\uAA42\uAA44-\uAA4B\uAA60-\uAA76\uAA7A\uAA7E-\uAAAF\uAAB1\uAAB5\uAAB6\uAAB9-\uAABD\uAAC0\uAAC2\uAADB-\uAADD\uAAE0-\uAAEA\uAAF2-\uAAF4\uAB01-\uAB06\uAB09-\uAB0E\uAB11-\uAB16\uAB20-\uAB26\uAB28-\uAB2E\uAB30-\uAB5A\uAB5C-\uAB69\uAB70-\uABE2\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFA6D\uFA70-\uFAD9\uFB00-\uFB06\uFB13-\uFB17\uFB1D\uFB1F-\uFB28\uFB2A-\uFB36\uFB38-\uFB3C\uFB3E\uFB40\uFB41\uFB43\uFB44\uFB46-\uFBB1\uFBD3-\uFD3D\uFD50-\uFD8F\uFD92-\uFDC7\uFDF0-\uFDFB\uFE70-\uFE74\uFE76-\uFEFC\uFF21-\uFF3A\uFF41-\uFF5A\uFF66-\uFFBE\uFFC2-\uFFC7\uFFCA-\uFFCF\uFFD2-\uFFD7\uFFDA-\uFFDC]|\uD800[\uDC00-\uDC0B\uDC0D-\uDC26\uDC28-\uDC3A\uDC3C\uDC3D\uDC3F-\uDC4D\uDC50-\uDC5D\uDC80-\uDCFA\uDE80-\uDE9C\uDEA0-\uDED0\uDF00-\uDF1F\uDF2D-\uDF40\uDF42-\uDF49\uDF50-\uDF75\uDF80-\uDF9D\uDFA0-\uDFC3\uDFC8-\uDFCF]|\uD801[\uDC00-\uDC9D\uDCB0-\uDCD3\uDCD8-\uDCFB\uDD00-\uDD27\uDD30-\uDD63\uDD70-\uDD7A\uDD7C-\uDD8A\uDD8C-\uDD92\uDD94\uDD95\uDD97-\uDDA1\uDDA3-\uDDB1\uDDB3-\uDDB9\uDDBB\uDDBC\uDE00-\uDF36\uDF40-\uDF55\uDF60-\uDF67\uDF80-\uDF85\uDF87-\uDFB0\uDFB2-\uDFBA]|\uD802[\uDC00-\uDC05\uDC08\uDC0A-\uDC35\uDC37\uDC38\uDC3C\uDC3F-\uDC55\uDC60-\uDC76\uDC80-\uDC9E\uDCE0-\uDCF2\uDCF4\uDCF5\uDD00-\uDD15\uDD20-\uDD39\uDD80-\uDDB7\uDDBE\uDDBF\uDE00\uDE10-\uDE13\uDE15-\uDE17\uDE19-\uDE35\uDE60-\uDE7C\uDE80-\uDE9C\uDEC0-\uDEC7\uDEC9-\uDEE4\uDF00-\uDF35\uDF40-\uDF55\uDF60-\uDF72\uDF80-\uDF91]|\uD803[\uDC00-\uDC48\uDC80-\uDCB2\uDCC0-\uDCF2\uDD00-\uDD23\uDE80-\uDEA9\uDEB0\uDEB1\uDF00-\uDF1C\uDF27\uDF30-\uDF45\uDF70-\uDF81\uDFB0-\uDFC4\uDFE0-\uDFF6]|\uD804[\uDC03-\uDC37\uDC71\uDC72\uDC75\uDC83-\uDCAF\uDCD0-\uDCE8\uDD03-\uDD26\uDD44\uDD47\uDD50-\uDD72\uDD76\uDD83-\uDDB2\uDDC1-\uDDC4\uDDDA\uDDDC\uDE00-\uDE11\uDE13-\uDE2B\uDE80-\uDE86\uDE88\uDE8A-\uDE8D\uDE8F-\uDE9D\uDE9F-\uDEA8\uDEB0-\uDEDE\uDF05-\uDF0C\uDF0F\uDF10\uDF13-\uDF28\uDF2A-\uDF30\uDF32\uDF33\uDF35-\uDF39\uDF3D\uDF50\uDF5D-\uDF61]|\uD805[\uDC00-\uDC34\uDC47-\uDC4A\uDC5F-\uDC61\uDC80-\uDCAF\uDCC4\uDCC5\uDCC7\uDD80-\uDDAE\uDDD8-\uDDDB\uDE00-\uDE2F\uDE44\uDE80-\uDEAA\uDEB8\uDF00-\uDF1A\uDF40-\uDF46]|\uD806[\uDC00-\uDC2B\uDCA0-\uDCDF\uDCFF-\uDD06\uDD09\uDD0C-\uDD13\uDD15\uDD16\uDD18-\uDD2F\uDD3F\uDD41\uDDA0-\uDDA7\uDDAA-\uDDD0\uDDE1\uDDE3\uDE00\uDE0B-\uDE32\uDE3A\uDE50\uDE5C-\uDE89\uDE9D\uDEB0-\uDEF8]|\uD807[\uDC00-\uDC08\uDC0A-\uDC2E\uDC40\uDC72-\uDC8F\uDD00-\uDD06\uDD08\uDD09\uDD0B-\uDD30\uDD46\uDD60-\uDD65\uDD67\uDD68\uDD6A-\uDD89\uDD98\uDEE0-\uDEF2\uDFB0]|\uD808[\uDC00-\uDF99]|\uD809[\uDC80-\uDD43]|\uD80B[\uDF90-\uDFF0]|[\uD80C\uD81C-\uD820\uD822\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879\uD880-\uD883][\uDC00-\uDFFF]|\uD80D[\uDC00-\uDC2E]|\uD811[\uDC00-\uDE46]|\uD81A[\uDC00-\uDE38\uDE40-\uDE5E\uDE70-\uDEBE\uDED0-\uDEED\uDF00-\uDF2F\uDF40-\uDF43\uDF63-\uDF77\uDF7D-\uDF8F]|\uD81B[\uDE40-\uDE7F\uDF00-\uDF4A\uDF50\uDF93-\uDF9F\uDFE0\uDFE1\uDFE3]|\uD821[\uDC00-\uDFF7]|\uD823[\uDC00-\uDCD5\uDD00-\uDD08]|\uD82B[\uDFF0-\uDFF3\uDFF5-\uDFFB\uDFFD\uDFFE]|\uD82C[\uDC00-\uDD22\uDD50-\uDD52\uDD64-\uDD67\uDD70-\uDEFB]|\uD82F[\uDC00-\uDC6A\uDC70-\uDC7C\uDC80-\uDC88\uDC90-\uDC99]|\uD835[\uDC00-\uDC54\uDC56-\uDC9C\uDC9E\uDC9F\uDCA2\uDCA5\uDCA6\uDCA9-\uDCAC\uDCAE-\uDCB9\uDCBB\uDCBD-\uDCC3\uDCC5-\uDD05\uDD07-\uDD0A\uDD0D-\uDD14\uDD16-\uDD1C\uDD1E-\uDD39\uDD3B-\uDD3E\uDD40-\uDD44\uDD46\uDD4A-\uDD50\uDD52-\uDEA5\uDEA8-\uDEC0\uDEC2-\uDEDA\uDEDC-\uDEFA\uDEFC-\uDF14\uDF16-\uDF34\uDF36-\uDF4E\uDF50-\uDF6E\uDF70-\uDF88\uDF8A-\uDFA8\uDFAA-\uDFC2\uDFC4-\uDFCB]|\uD837[\uDF00-\uDF1E]|\uD838[\uDD00-\uDD2C\uDD37-\uDD3D\uDD4E\uDE90-\uDEAD\uDEC0-\uDEEB]|\uD839[\uDFE0-\uDFE6\uDFE8-\uDFEB\uDFED\uDFEE\uDFF0-\uDFFE]|\uD83A[\uDC00-\uDCC4\uDD00-\uDD43\uDD4B]|\uD83B[\uDE00-\uDE03\uDE05-\uDE1F\uDE21\uDE22\uDE24\uDE27\uDE29-\uDE32\uDE34-\uDE37\uDE39\uDE3B\uDE42\uDE47\uDE49\uDE4B\uDE4D-\uDE4F\uDE51\uDE52\uDE54\uDE57\uDE59\uDE5B\uDE5D\uDE5F\uDE61\uDE62\uDE64\uDE67-\uDE6A\uDE6C-\uDE72\uDE74-\uDE77\uDE79-\uDE7C\uDE7E\uDE80-\uDE89\uDE8B-\uDE9B\uDEA1-\uDEA3\uDEA5-\uDEA9\uDEAB-\uDEBB]|\uD869[\uDC00-\uDEDF\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF38\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|\uD87E[\uDC00-\uDE1D]|\uD884[\uDC00-\uDF4A])\S*/g; /** * Transforms text to title case. * Capitalizes the first letter of each word and transforms the * rest of the word to lower case. * Words are delimited by any whitespace character, such as a space, tab, or line-feed character. * * @see {@link LowerCasePipe} * @see {@link UpperCasePipe} * * @usageNotes * The following example shows the result of transforming various strings into title case. * * {@example common/pipes/ts/titlecase_pipe.ts region='TitleCasePipe'} * * @ngModule CommonModule * @publicApi */ class TitleCasePipe { transform(value) { if (value == null) return null; if (typeof value !== 'string') { throw invalidPipeArgumentError(TitleCasePipe, value); } return value.replace(unicodeWordMatch, (txt) => txt[0].toUpperCase() + txt.slice(1).toLowerCase()); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: TitleCasePipe, isStandalone: true, name: "titlecase" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleCasePipe, decorators: [{ type: Pipe, args: [{ name: 'titlecase', }] }] }); /** * Transforms text to all upper case. * @see {@link LowerCasePipe} * @see {@link TitleCasePipe} * * @ngModule CommonModule * @publicApi */ class UpperCasePipe { transform(value) { if (value == null) return null; if (typeof value !== 'string') { throw invalidPipeArgumentError(UpperCasePipe, value); } return value.toUpperCase(); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpperCasePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: UpperCasePipe, isStandalone: true, name: "uppercase" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpperCasePipe, decorators: [{ type: Pipe, args: [{ name: 'uppercase', }] }] }); /** * The default date format of Angular date pipe, which corresponds to the following format: * `'MMM d,y'` (e.g. `Jun 15, 2015`) */ const DEFAULT_DATE_FORMAT = 'mediumDate'; /** * Optionally-provided default timezone to use for all instances of `DatePipe` (such as `'+0430'`). * If the value isn't provided, the `DatePipe` will use the end-user's local system timezone. * * @deprecated use DATE_PIPE_DEFAULT_OPTIONS token to configure DatePipe */ const DATE_PIPE_DEFAULT_TIMEZONE = new InjectionToken(ngDevMode ? 'DATE_PIPE_DEFAULT_TIMEZONE' : ''); /** * DI token that allows to provide default configuration for the `DatePipe` instances in an * application. The value is an object which can include the following fields: * - `dateFormat`: configures the default date format. If not provided, the `DatePipe` * will use the 'mediumDate' as a value. * - `timezone`: configures the default timezone. If not provided, the `DatePipe` will * use the end-user's local system timezone. * * @see {@link DatePipeConfig} * * @usageNotes * * Various date pipe default values can be overwritten by providing this token with * the value that has this interface. * * For example: * * Override the default date format by providing a value using the token: * ```ts * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {dateFormat: 'shortDate'}} * ] * ``` * * Override the default timezone by providing a value using the token: * ```ts * providers: [ * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {timezone: '-1200'}} * ] * ``` */ const DATE_PIPE_DEFAULT_OPTIONS = new InjectionToken(ngDevMode ? 'DATE_PIPE_DEFAULT_OPTIONS' : ''); /** * @ngModule CommonModule * @description * * Formats a date value according to locale rules. * * `DatePipe` is executed only when it detects a pure change to the input value. * A pure change is either a change to a primitive input value * (such as `String`, `Number`, `Boolean`, or `Symbol`), * or a changed object reference (such as `Date`, `Array`, `Function`, or `Object`). * * Note that mutating a `Date` object does not cause the pipe to be rendered again. * To ensure that the pipe is executed, you must create a new `Date` object. * * Only the `en-US` locale data comes with Angular. To localize dates * in another language, you must import the corresponding locale data. * See the [I18n guide](guide/i18n/format-data-locale) for more information. * * The time zone of the formatted value can be specified either by passing it in as the second * parameter of the pipe, or by setting the default through the `DATE_PIPE_DEFAULT_OPTIONS` * injection token. The value that is passed in as the second parameter takes precedence over * the one defined using the injection token. * * @see {@link formatDate} * * * @usageNotes * * The result of this pipe is not reevaluated when the input is mutated. To avoid the need to * reformat the date on every change-detection cycle, treat the date as an immutable object * and change the reference when the pipe needs to run again. * * ### Pre-defined format options * * | Option | Equivalent to | Examples (given in `en-US` locale) | * |---------------|-------------------------------------|-------------------------------------------------| * | `'short'` | `'M/d/yy, h:mm a'` | `6/15/15, 9:03 AM` | * | `'medium'` | `'MMM d, y, h:mm:ss a'` | `Jun 15, 2015, 9:03:01 AM` | * | `'long'` | `'MMMM d, y, h:mm:ss a z'` | `June 15, 2015 at 9:03:01 AM GMT+1` | * | `'full'` | `'EEEE, MMMM d, y, h:mm:ss a zzzz'` | `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00` | * | `'shortDate'` | `'M/d/yy'` | `6/15/15` | * | `'mediumDate'`| `'MMM d, y'` | `Jun 15, 2015` | * | `'longDate'` | `'MMMM d, y'` | `June 15, 2015` | * | `'fullDate'` | `'EEEE, MMMM d, y'` | `Monday, June 15, 2015` | * | `'shortTime'` | `'h:mm a'` | `9:03 AM` | * | `'mediumTime'`| `'h:mm:ss a'` | `9:03:01 AM` | * | `'longTime'` | `'h:mm:ss a z'` | `9:03:01 AM GMT+1` | * | `'fullTime'` | `'h:mm:ss a zzzz'` | `9:03:01 AM GMT+01:00` | * * ### Custom format options * * You can construct a format string using symbols to specify the components * of a date-time value, as described in the following table. * Format details depend on the locale. * Fields marked with (*) are only available in the extra data set for the given locale. * * | Field type | Format | Description | Example Value | * |-------------------------|-------------|---------------------------------------------------------------|------------------------------------------------------------| * | Era | G, GG & GGG | Abbreviated | AD | * | | GGGG | Wide | Anno Domini | * | | GGGGG | Narrow | A | * | Year | y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | * | | yy | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | * | | yyy | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | * | | yyyy | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | * | ISO Week-numbering year | Y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 | * | | YY | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 | * | | YYY | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 | * | | YYYY | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 | * | Month | M | Numeric: 1 digit | 9, 12 | * | | MM | Numeric: 2 digits + zero padded | 09, 12 | * | | MMM | Abbreviated | Sep | * | | MMMM | Wide | September | * | | MMMMM | Narrow | S | * | Month standalone | L | Numeric: 1 digit | 9, 12 | * | | LL | Numeric: 2 digits + zero padded | 09, 12 | * | | LLL | Abbreviated | Sep | * | | LLLL | Wide | September | * | | LLLLL | Narrow | S | * | ISO Week of year | w | Numeric: minimum digits | 1... 53 | * | | ww | Numeric: 2 digits + zero padded | 01... 53 | * | Week of month | W | Numeric: 1 digit | 1... 5 | * | Day of month | d | Numeric: minimum digits | 1 | * | | dd | Numeric: 2 digits + zero padded | 01 | * | Week day | E, EE & EEE | Abbreviated | Tue | * | | EEEE | Wide | Tuesday | * | | EEEEE | Narrow | T | * | | EEEEEE | Short | Tu | * | Week day standalone | c, cc | Numeric: 1 digit | 2 | * | | ccc | Abbreviated | Tue | * | | cccc | Wide | Tuesday | * | | ccccc | Narrow | T | * | | cccccc | Short | Tu | * | Period | a, aa & aaa | Abbreviated | am/pm or AM/PM | * | | aaaa | Wide (fallback to `a` when missing) | ante meridiem/post meridiem | * | | aaaaa | Narrow | a/p | * | Period* | B, BB & BBB | Abbreviated | mid. | * | | BBBB | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | * | | BBBBB | Narrow | md | * | Period standalone* | b, bb & bbb | Abbreviated | mid. | * | | bbbb | Wide | am, pm, midnight, noon, morning, afternoon, evening, night | * | | bbbbb | Narrow | md | * | Hour 1-12 | h | Numeric: minimum digits | 1, 12 | * | | hh | Numeric: 2 digits + zero padded | 01, 12 | * | Hour 0-23 | H | Numeric: minimum digits | 0, 23 | * | | HH | Numeric: 2 digits + zero padded | 00, 23 | * | Minute | m | Numeric: minimum digits | 8, 59 | * | | mm | Numeric: 2 digits + zero padded | 08, 59 | * | Second | s | Numeric: minimum digits | 0... 59 | * | | ss | Numeric: 2 digits + zero padded | 00... 59 | * | Fractional seconds | S | Numeric: 1 digit | 0... 9 | * | | SS | Numeric: 2 digits + zero padded | 00... 99 | * | | SSS | Numeric: 3 digits + zero padded (= milliseconds) | 000... 999 | * | Zone | z, zz & zzz | Short specific non location format (fallback to O) | GMT-8 | * | | zzzz | Long specific non location format (fallback to OOOO) | GMT-08:00 | * | | Z, ZZ & ZZZ | ISO8601 basic format | -0800 | * | | ZZZZ | Long localized GMT format | GMT-8:00 | * | | ZZZZZ | ISO8601 extended format + Z indicator for offset 0 (= XXXXX) | -08:00 | * | | O, OO & OOO | Short localized GMT format | GMT-8 | * | | OOOO | Long localized GMT format | GMT-08:00 | * * * ### Format examples * * These examples transform a date into various formats, * assuming that `dateObj` is a JavaScript `Date` object for * year: 2015, month: 6, day: 15, hour: 21, minute: 43, second: 11, * given in the local time for the `en-US` locale. * * ``` * {{ dateObj | date }} // output is 'Jun 15, 2015' * {{ dateObj | date:'medium' }} // output is 'Jun 15, 2015, 9:43:11 PM' * {{ dateObj | date:'shortTime' }} // output is '9:43 PM' * {{ dateObj | date:'mm:ss' }} // output is '43:11' * {{ dateObj | date:"MMM dd, yyyy 'at' hh:mm a" }} // output is 'Jun 15, 2015 at 09:43 PM' * ``` * * ### Usage example * * The following component uses a date pipe to display the current date in different formats. * * ```angular-ts * @Component({ * selector: 'date-pipe', * template: `
    *

    Today is {{today | date}}

    *

    Or if you prefer, {{today | date:'fullDate'}}

    *

    The time is {{today | date:'h:mm a z'}}

    *
    ` * }) * // Get the current date and time as a date-time value. * export class DatePipeComponent { * today: number = Date.now(); * } * ``` * * @publicApi */ class DatePipe { locale; defaultTimezone; defaultOptions; constructor(locale, defaultTimezone, defaultOptions) { this.locale = locale; this.defaultTimezone = defaultTimezone; this.defaultOptions = defaultOptions; } transform(value, format, timezone, locale) { if (value == null || value === '' || value !== value) return null; try { const _format = format ?? this.defaultOptions?.dateFormat ?? DEFAULT_DATE_FORMAT; const _timezone = timezone ?? this.defaultOptions?.timezone ?? this.defaultTimezone ?? undefined; return formatDate(value, _format, locale || this.locale, _timezone); } catch (error) { throw invalidPipeArgumentError(DatePipe, error.message); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DatePipe, deps: [{ token: LOCALE_ID }, { token: DATE_PIPE_DEFAULT_TIMEZONE, optional: true }, { token: DATE_PIPE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: DatePipe, isStandalone: true, name: "date" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DatePipe, decorators: [{ type: Pipe, args: [{ name: 'date', }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [LOCALE_ID] }] }, { type: undefined, decorators: [{ type: Inject, args: [DATE_PIPE_DEFAULT_TIMEZONE] }, { type: Optional }] }, { type: undefined, decorators: [{ type: Inject, args: [DATE_PIPE_DEFAULT_OPTIONS] }, { type: Optional }] }] }); const _INTERPOLATION_REGEXP = /#/g; /** * @ngModule CommonModule * @description * * Maps a value to a string that pluralizes the value according to locale rules. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nPluralPipeComponent'} * * @publicApi */ class I18nPluralPipe { _localization; constructor(_localization) { this._localization = _localization; } /** * @param value the number to be formatted * @param pluralMap an object that mimics the ICU format, see * https://unicode-org.github.io/icu/userguide/format_parse/messages/. * @param locale a `string` defining the locale to use (uses the current {@link LOCALE_ID} by * default). */ transform(value, pluralMap, locale) { if (value == null) return ''; if (typeof pluralMap !== 'object' || pluralMap === null) { throw invalidPipeArgumentError(I18nPluralPipe, pluralMap); } const key = getPluralCategory(value, Object.keys(pluralMap), this._localization, locale); return pluralMap[key].replace(_INTERPOLATION_REGEXP, value.toString()); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: I18nPluralPipe, deps: [{ token: NgLocalization }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: I18nPluralPipe, isStandalone: true, name: "i18nPlural" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: I18nPluralPipe, decorators: [{ type: Pipe, args: [{ name: 'i18nPlural', }] }], ctorParameters: () => [{ type: NgLocalization }] }); /** * @ngModule CommonModule * @description * * Generic selector that displays the string that matches the current value. * * If none of the keys of the `mapping` match the `value`, then the content * of the `other` key is returned when present, otherwise an empty string is returned. * * @usageNotes * * ### Example * * {@example common/pipes/ts/i18n_pipe.ts region='I18nSelectPipeComponent'} * * @publicApi */ class I18nSelectPipe { /** * @param value a string to be internationalized. * @param mapping an object that indicates the text that should be displayed * for different values of the provided `value`. */ transform(value, mapping) { if (value == null) return ''; if (typeof mapping !== 'object' || typeof value !== 'string') { throw invalidPipeArgumentError(I18nSelectPipe, mapping); } if (mapping.hasOwnProperty(value)) { return mapping[value]; } if (mapping.hasOwnProperty('other')) { return mapping['other']; } return ''; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: I18nSelectPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: I18nSelectPipe, isStandalone: true, name: "i18nSelect" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: I18nSelectPipe, decorators: [{ type: Pipe, args: [{ name: 'i18nSelect', }] }] }); /** * @ngModule CommonModule * @description * * Converts a value into its JSON-format representation. Useful for debugging. * * @usageNotes * * The following component uses a JSON pipe to convert an object * to JSON format, and displays the string in both formats for comparison. * * {@example common/pipes/ts/json_pipe.ts region='JsonPipe'} * * @publicApi */ class JsonPipe { /** * @param value A value of any type to convert into a JSON-format string. */ transform(value) { return JSON.stringify(value, null, 2); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: JsonPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: JsonPipe, isStandalone: true, name: "json", pure: false }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: JsonPipe, decorators: [{ type: Pipe, args: [{ name: 'json', pure: false, }] }] }); function makeKeyValuePair(key, value) { return { key: key, value: value }; } /** * @ngModule CommonModule * @description * * Transforms Object or Map into an array of key value pairs. * * The output array will be ordered by keys. * By default the comparator will be by Unicode point value. * You can optionally pass a compareFn if your keys are complex types. * Passing `null` as the compareFn will use natural ordering of the input. * * @usageNotes * ### Examples * * This examples show how an Object or a Map can be iterated by ngFor with the use of this * keyvalue pipe. * * {@example common/pipes/ts/keyvalue_pipe.ts region='KeyValuePipe'} * * @publicApi */ class KeyValuePipe { differs; constructor(differs) { this.differs = differs; } differ; keyValues = []; compareFn = defaultComparator; transform(input, compareFn = defaultComparator) { if (!input || (!(input instanceof Map) && typeof input !== 'object')) { return null; } // make a differ for whatever type we've been passed in this.differ ??= this.differs.find(input).create(); const differChanges = this.differ.diff(input); const compareFnChanged = compareFn !== this.compareFn; if (differChanges) { this.keyValues = []; differChanges.forEachItem((r) => { this.keyValues.push(makeKeyValuePair(r.key, r.currentValue)); }); } if (differChanges || compareFnChanged) { if (compareFn) { this.keyValues.sort(compareFn); } this.compareFn = compareFn; } return this.keyValues; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: KeyValuePipe, deps: [{ token: i0.KeyValueDiffers }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: KeyValuePipe, isStandalone: true, name: "keyvalue", pure: false }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: KeyValuePipe, decorators: [{ type: Pipe, args: [{ name: 'keyvalue', pure: false, }] }], ctorParameters: () => [{ type: i0.KeyValueDiffers }] }); function defaultComparator(keyValueA, keyValueB) { const a = keyValueA.key; const b = keyValueB.key; // If both keys are the same, return 0 (no sorting needed). if (a === b) return 0; // If one of the keys is `null` or `undefined`, place it at the end of the sort. if (a == null) return 1; // `a` comes after `b`. if (b == null) return -1; // `b` comes after `a`. // If both keys are strings, compare them lexicographically. if (typeof a == 'string' && typeof b == 'string') { return a < b ? -1 : 1; } // If both keys are numbers, sort them numerically. if (typeof a == 'number' && typeof b == 'number') { return a - b; } // If both keys are booleans, sort `false` before `true`. if (typeof a == 'boolean' && typeof b == 'boolean') { return a < b ? -1 : 1; } // Fallback case: if keys are of different types, compare their string representations. const aString = String(a); const bString = String(b); // Compare the string representations lexicographically. return aString == bString ? 0 : aString < bString ? -1 : 1; } /** * @ngModule CommonModule * @description * * Formats a value according to digit options and locale rules. * Locale determines group sizing and separator, * decimal point character, and other locale-specific configurations. * * @see {@link formatNumber} * * @usageNotes * * ### digitsInfo * * The value's decimal representation is specified by the `digitsInfo` * parameter, written in the following format:
    * * ``` * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits} * ``` * * - `minIntegerDigits`: * The minimum number of integer digits before the decimal point. * Default is 1. * * - `minFractionDigits`: * The minimum number of digits after the decimal point. * Default is 0. * * - `maxFractionDigits`: * The maximum number of digits after the decimal point. * Default is 3. * * If the formatted value is truncated it will be rounded using the "to-nearest" method: * * ``` * {{3.6 | number: '1.0-0'}} * * * {{-3.6 | number:'1.0-0'}} * * ``` * * ### locale * * `locale` will format a value according to locale rules. * Locale determines group sizing and separator, * decimal point character, and other locale-specific configurations. * * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default. * * See [Setting your app locale](guide/i18n/locale-id). * * ### Example * * The following code shows how the pipe transforms values * according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/number_pipe.ts region='NumberPipe'} * * @publicApi */ class DecimalPipe { _locale; constructor(_locale) { this._locale = _locale; } transform(value, digitsInfo, locale) { if (!isValue(value)) return null; locale ||= this._locale; try { const num = strToNumber(value); return formatNumber(num, locale, digitsInfo); } catch (error) { throw invalidPipeArgumentError(DecimalPipe, error.message); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DecimalPipe, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: DecimalPipe, isStandalone: true, name: "number" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DecimalPipe, decorators: [{ type: Pipe, args: [{ name: 'number', }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [LOCALE_ID] }] }] }); /** * @ngModule CommonModule * @description * * Transforms a number to a percentage * string, formatted according to locale rules that determine group sizing and * separator, decimal-point character, and other locale-specific * configurations. * * @see {@link formatPercent} * * @usageNotes * The following code shows how the pipe transforms numbers * into text strings, according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/percent_pipe.ts region='PercentPipe'} * * @publicApi */ class PercentPipe { _locale; constructor(_locale) { this._locale = _locale; } /** * * @param value The number to be formatted as a percentage. * @param digitsInfo Decimal representation options, specified by a string * in the following format:
    * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}. * - `minIntegerDigits`: The minimum number of integer digits before the decimal point. * Default is `1`. * - `minFractionDigits`: The minimum number of digits after the decimal point. * Default is `0`. * - `maxFractionDigits`: The maximum number of digits after the decimal point. * Default is `0`. * @param locale A locale code for the locale format rules to use. * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default. * See [Setting your app locale](guide/i18n/locale-id). */ transform(value, digitsInfo, locale) { if (!isValue(value)) return null; locale ||= this._locale; try { const num = strToNumber(value); return formatPercent(num, locale, digitsInfo); } catch (error) { throw invalidPipeArgumentError(PercentPipe, error.message); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version:"$ "19.2.14", ngImport: i0, type: PercentPipe, deps: [{ token: LOCALE_ID }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: PercentPipe, isStandalone: true, name: "percent" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PercentPipe, decorators: [{ type: Pipe, args: [{ name: 'percent', }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [LOCALE_ID] }] }] }); /** * @ngModule CommonModule * @description * * Transforms a number to a currency string, formatted according to locale rules * that determine group sizing and separator, decimal-point character, * and other locale-specific configurations. * * * @see {@link getCurrencySymbol} * @see {@link formatCurrency} * * @usageNotes * The following code shows how the pipe transforms numbers * into text strings, according to various format specifications, * where the caller's default locale is `en-US`. * * {@example common/pipes/ts/currency_pipe.ts region='CurrencyPipe'} * * @publicApi */ class CurrencyPipe { _locale; _defaultCurrencyCode; constructor(_locale, _defaultCurrencyCode = 'USD') { this._locale = _locale; this._defaultCurrencyCode = _defaultCurrencyCode; } transform(value, currencyCode = this._defaultCurrencyCode, display = 'symbol', digitsInfo, locale) { if (!isValue(value)) return null; locale ||= this._locale; if (typeof display === 'boolean') { if ((typeof ngDevMode === 'undefined' || ngDevMode) && console && console.warn) { console.warn(`Warning: the currency pipe has been changed in Angular v5. The symbolDisplay option (third parameter) is now a string instead of a boolean. The accepted values are "code", "symbol" or "symbol-narrow".`); } display = display ? 'symbol' : 'code'; } let currency = currencyCode || this._defaultCurrencyCode; if (display !== 'code') { if (display === 'symbol' || display === 'symbol-narrow') { currency = getCurrencySymbol(currency, display === 'symbol' ? 'wide' : 'narrow', locale); } else { currency = display; } } try { const num = strToNumber(value); return formatCurrency(num, locale, currency, currencyCode, digitsInfo); } catch (error) { throw invalidPipeArgumentError(CurrencyPipe, error.message); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CurrencyPipe, deps: [{ token: LOCALE_ID }, { token: DEFAULT_CURRENCY_CODE }], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: CurrencyPipe, isStandalone: true, name: "currency" }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CurrencyPipe, decorators: [{ type: Pipe, args: [{ name: 'currency', }] }], ctorParameters: () => [{ type: undefined, decorators: [{ type: Inject, args: [LOCALE_ID] }] }, { type: undefined, decorators: [{ type: Inject, args: [DEFAULT_CURRENCY_CODE] }] }] }); function isValue(value) { return !(value == null || value === '' || value !== value); } /** * Transforms a string into a number (if needed). */ function strToNumber(value) { // Convert strings to numbers if (typeof value === 'string' && !isNaN(Number(value) - parseFloat(value))) { return Number(value); } if (typeof value !== 'number') { throw new Error(`${value} is not a number`); } return value; } /** * @ngModule CommonModule * @description * * Creates a new `Array` or `String` containing a subset (slice) of the elements. * * @usageNotes * * All behavior is based on the expected behavior of the JavaScript API `Array.prototype.slice()` * and `String.prototype.slice()`. * * When operating on an `Array`, the returned `Array` is always a copy even when all * the elements are being returned. * * When operating on a blank value, the pipe returns the blank value. * * ### List Example * * This `ngFor` example: * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_list'} * * produces the following: * * ```html *
  • b
    • *
  • c
    • * ``` * * ### String Examples * * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_string'} * * @publicApi */ class SlicePipe { transform(value, start, end) { if (value == null) return null; const supports = typeof value === 'string' || Array.isArray(value); if (!supports) { throw invalidPipeArgumentError(SlicePipe, value); } return value.slice(start, end); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SlicePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: SlicePipe, isStandalone: true, name: "slice", pure: false }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SlicePipe, decorators: [{ type: Pipe, args: [{ name: 'slice', pure: false, }] }] }); /** * @module * @description * This module provides a set of common Pipes. */ /** * A collection of Angular pipes that are likely to be used in each and every application. */ const COMMON_PIPES = [ AsyncPipe, UpperCasePipe, LowerCasePipe, JsonPipe, SlicePipe, DecimalPipe, PercentPipe, TitleCasePipe, CurrencyPipe, DatePipe, I18nPluralPipe, I18nSelectPipe, KeyValuePipe, ]; // Note: This does not contain the location providers, // as they need some platform specific implementations to work. /** * Exports all the basic Angular directives and pipes, * such as `NgIf`, `NgForOf`, `DecimalPipe`, and so on. * Re-exported by `BrowserModule`, which is included automatically in the root * `AppModule` when you create a new app with the CLI `new` command. * * @publicApi */ class CommonModule { static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CommonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: CommonModule, imports: [NgClass, NgComponentOutlet, NgForOf, NgIf, NgTemplateOutlet, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgPlural, NgPluralCase, AsyncPipe, UpperCasePipe, LowerCasePipe, JsonPipe, SlicePipe, DecimalPipe, PercentPipe, TitleCasePipe, CurrencyPipe, DatePipe, I18nPluralPipe, I18nSelectPipe, KeyValuePipe], exports: [NgClass, NgComponentOutlet, NgForOf, NgIf, NgTemplateOutlet, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgPlural, NgPluralCase, AsyncPipe, UpperCasePipe, LowerCasePipe, JsonPipe, SlicePipe, DecimalPipe, PercentPipe, TitleCasePipe, CurrencyPipe, DatePipe, I18nPluralPipe, I18nSelectPipe, KeyValuePipe] }); static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CommonModule }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CommonModule, decorators: [{ type: NgModule, args: [{ imports: [COMMON_DIRECTIVES, COMMON_PIPES], exports: [COMMON_DIRECTIVES, COMMON_PIPES], }] }] }); export { AsyncPipe, CommonModule, CurrencyPipe, DATE_PIPE_DEFAULT_OPTIONS, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe, DecimalPipe, FormStyle, FormatWidth, HashLocationStrategy, I18nPluralPipe, I18nSelectPipe, JsonPipe, KeyValuePipe, LowerCasePipe, NgClass, NgComponentOutlet, NgForOf, NgForOfContext, NgIf, NgIfContext, NgLocaleLocalization, NgLocalization, NgPlural, NgPluralCase, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, NumberFormatStyle, NumberSymbol, PercentPipe, Plural, SlicePipe, TitleCasePipe, TranslationWidth, UpperCasePipe, 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 }; //# sourceMappingURL=common_module-Dx7dWex5.mjs.map 8ɔx{"version":3,"file":"common_module-Dx7dWex5.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/location/hash_location_strategy.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/currencies.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/locale_data_api.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/format_date.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/format_number.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/i18n/localization.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_class.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_component_outlet.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_for_of.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_if.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_switch.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_plural.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_style.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/ng_template_outlet.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/directives/index.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/invalid_pipe_argument_error.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/async_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/case_conversion_pipes.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/date_pipe_config.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/date_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/i18n_plural_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/i18n_select_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/json_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/keyvalue_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/number_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/slice_pipe.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/pipes/index.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/common_module.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Inject, Injectable, OnDestroy, Optional} from '@angular/core';\n\nimport {APP_BASE_HREF, LocationStrategy} from './location_strategy';\nimport {LocationChangeListener, PlatformLocation} from './platform_location';\nimport {joinWithSlash, normalizeQueryParams} from './util';\n\n/**\n * @description\n * A {@link LocationStrategy} used to configure the {@link Location} service to\n * represent its state in the\n * [hash fragment](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax)\n * of the browser's URL.\n *\n * For instance, if you call `location.go('/foo')`, the browser's URL will become\n * `example.com#/foo`.\n *\n * @usageNotes\n *\n * ### Example\n *\n * {@example common/location/ts/hash_location_component.ts region='LocationComponent'}\n *\n * @publicApi\n */\n@Injectable()\nexport class HashLocationStrategy extends LocationStrategy implements OnDestroy {\n private _baseHref: string = '';\n private _removeListenerFns: (() => void)[] = [];\n\n constructor(\n private _platformLocation: PlatformLocation,\n @Optional() @Inject(APP_BASE_HREF) _baseHref?: string,\n ) {\n super();\n if (_baseHref != null) {\n this._baseHref = _baseHref;\n }\n }\n\n /** @docs-private */\n ngOnDestroy(): void {\n while (this._removeListenerFns.length) {\n this._removeListenerFns.pop()!();\n }\n }\n\n override onPopState(fn: LocationChangeListener): void {\n this._removeListenerFns.push(\n this._platformLocation.onPopState(fn),\n this._platformLocation.onHashChange(fn),\n );\n }\n\n override getBaseHref(): string {\n return this._baseHref;\n }\n\n override path(includeHash: boolean = false): string {\n // the hash value is always prefixed with a `#`\n // and if it is empty then it will stay empty\n const path = this._platformLocation.hash ?? '#';\n\n return path.length > 0 ? path.substring(1) : path;\n }\n\n override prepareExternalUrl(internal: string): string {\n const url = joinWithSlash(this._baseHref, internal);\n return url.length > 0 ? '#' + url : url;\n }\n\n override pushState(state: any, title: string, path: string, queryParams: string) {\n const url =\n this.prepareExternalUrl(path + normalizeQueryParams(queryParams)) ||\n this._platformLocation.pathname;\n this._platformLocation.pushState(state, title, url);\n }\n\n override replaceState(state: any, title: string, path: string, queryParams: string) {\n const url =\n this.prepareExternalUrl(path + normalizeQueryParams(queryParams)) ||\n this._platformLocation.pathname;\n this._platformLocation.replaceState(state, title, url);\n }\n\n override forward(): void {\n this._platformLocation.forward();\n }\n\n override back(): void {\n this._platformLocation.back();\n }\n\n override getState(): unknown {\n return this._platformLocation.getState();\n }\n\n override historyGo(relativePosition: number = 0): void {\n this._platformLocation.historyGo?.(relativePosition);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n// THIS CODE IS GENERATED - DO NOT MODIFY.\nexport type CurrenciesSymbols = [string] | [string | undefined, string];\n\n/** @internal */\nexport const CURRENCIES_EN: {[code: string]: CurrenciesSymbols | [string | undefined, string | undefined, number]} = {\"ADP\":[undefined,undefined,0],\"AFN\":[undefined,\"؋\",0],\"ALL\":[undefined,undefined,0],\"AMD\":[undefined,\"֏\",2],\"AOA\":[undefined,\"Kz\"],\"ARS\":[undefined,\"$\"],\"AUD\":[\"A$\",\"$\"],\"AZN\":[undefined,\"₼\"],\"BAM\":[undefined,\"KM\"],\"BBD\":[undefined,\"$\"],\"BDT\":[undefined,\"৳\"],\"BHD\":[undefined,undefined,3],\"BIF\":[undefined,undefined,0],\"BMD\":[undefined,\"$\"],\"BND\":[undefined,\"$\"],\"BOB\":[undefined,\"Bs\"],\"BRL\":[\"R$\"],\"BSD\":[undefined,\"$\"],\"BWP\":[undefined,\"P\"],\"BYN\":[undefined,undefined,2],\"BYR\":[undefined,undefined,0],\"BZD\":[undefined,\"$\"],\"CAD\":[\"CA$\",\"$\",2],\"CHF\":[undefined,undefined,2],\"CLF\":[undefined,undefined,4],\"CLP\":[undefined,\"$\",0],\"CNY\":[\"CN¥\",\"¥\"],\"COP\":[undefined,\"$\",2],\"CRC\":[undefined,\"₡\",2],\"CUC\":[undefined,\"$\"],\"CUP\":[undefined,\"$\"],\"CZK\":[undefined,\"Kč\",2],\"DJF\":[undefined,undefined,0],\"DKK\":[undefined,\"kr\",2],\"DOP\":[undefined,\"$\"],\"EGP\":[undefined,\"E£\"],\"ESP\":[undefined,\"₧\",0],\"EUR\":[\"€\"],\"FJD\":[undefined,\"$\"],\"FKP\":[undefined,\"£\"],\"GBP\":[\"£\"],\"GEL\":[undefined,\"₾\"],\"GHS\":[undefined,\"GH₵\"],\"GIP\":[undefined,\"£\"],\"GNF\":[undefined,\"FG\",0],\"GTQ\":[undefined,\"Q\"],\"GYD\":[undefined,\"$\",2],\"HKD\":[\"HK$\",\"$\"],\"HNL\":[undefined,\"L\"],\"HRK\":[undefined,\"kn\"],\"HUF\":[undefined,\"Ft\",2],\"IDR\":[undefined,\"Rp\",2],\"ILS\":[\"₪\"],\"INR\":[\"₹\"],\"IQD\":[undefined,undefined,0],\"IRR\":[undefined,undefined,0],\"ISK\":[undefined,\"kr\",0],\"ITL\":[undefined,undefined,0],\"JMD\":[undefined,\"$\"],\"JOD\":[undefined,undefined,3],\"JPY\":[\"¥\",undefined,0],\"KHR\":[undefined,\"៛\"],\"KMF\":[undefined,\"CF\",0],\"KPW\":[undefined,\"₩\",0],\"KRW\":[\"₩\",undefined,0],\"KWD\":[undefined,undefined,3],\"KYD\":[undefined,\"$\"],\"KZT\":[undefined,\"₸\"],\"LAK\":[undefined,\"₭\",0],\"LBP\":[undefined,\"L£\",0],\"LKR\":[undefined,\"Rs\"],\"LRD\":[undefined,\"$\"],\"LTL\":[undefined,\"Lt\"],\"LUF\":[undefined,undefined,0],\"LVL\":[undefined,\"Ls\"],\"LYD\":[undefined,undefined,3],\"MGA\":[undefined,\"Ar\",0],\"MGF\":[undefined,undefined,0],\"MMK\":[undefined,\"K\",0],\"MNT\":[undefined,\"₮\",2],\"MRO\":[undefined,undefined,0],\"MUR\":[undefined,\"Rs\",2],\"MXN\":[\"MX$\",\"$\"],\"MYR\":[undefined,\"RM\"],\"NAD\":[undefined,\"$\"],\"NGN\":[undefined,\"₦\"],\"NIO\":[undefined,\"C$\"],\"NOK\":[undefined,\"kr\",2],\"NPR\":[undefined,\"Rs\"],\"NZD\":[\"NZ$\",\"$\"],\"OMR\":[undefined,undefined,3],\"PHP\":[\"₱\"],\"PKR\":[undefined,\"Rs\",2],\"PLN\":[undefined,\"zł\"],\"PYG\":[undefined,\"₲\",0],\"RON\":[undefined,\"lei\"],\"RSD\":[undefined,undefined,0],\"RUB\":[undefined,\"₽\"],\"RWF\":[undefined,\"RF\",0],\"SBD\":[undefined,\"$\"],\"SEK\":[undefined,\"kr\",2],\"SGD\":[undefined,\"$\"],\"SHP\":[undefined,\"£\"],\"SLE\":[undefined,undefined,2],\"SLL\":[undefined,undefined,0],\"SOS\":[undefined,undefined,0],\"SRD\":[undefined,\"$\"],\"SSP\":[undefined,\"£\"],\"STD\":[undefined,undefined,0],\"STN\":[undefined,\"Db\"],\"SYP\":[undefined,\"£\",0],\"THB\":[undefined,\"฿\"],\"TMM\":[undefined,undefined,0],\"TND\":[undefined,undefined,3],\"TOP\":[undefined,\"T$\"],\"TRL\":[undefined,undefined,0],\"TRY\":[undefined,\"₺\"],\"TTD\":[undefined,\"$\"],\"TWD\":[\"NT$\",\"$\",2],\"TZS\":[undefined,undefined,2],\"UAH\":[undefined,\"₴\"],\"UGX\":[undefined,undefined,0],\"USD\":[\"$\"],\"UYI\":[undefined,undefined,0],\"UYU\":[undefined,\"$\"],\"UYW\":[undefined,undefined,4],\"UZS\":[undefined,undefined,2],\"VEF\":[undefined,\"Bs\",2],\"VND\":[\"₫\",undefined,0],\"VUV\":[undefined,undefined,0],\"XAF\":[\"FCFA\",undefined,0],\"XCD\":[\"EC$\",\"$\"],\"XOF\":[\"F CFA\",undefined,0],\"XPF\":[\"CFPF\",undefined,0],\"XXX\":[\"¤\"],\"YER\":[undefined,undefined,0],\"ZAR\":[undefined,\"R\"],\"ZMK\":[undefined,undefined,0],\"ZMW\":[undefined,\"ZK\"],\"ZWD\":[undefined,undefined,0]};\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n ɵCurrencyIndex,\n ɵExtraLocaleDataIndex,\n ɵfindLocaleData,\n ɵgetLocaleCurrencyCode,\n ɵgetLocalePluralCase,\n ɵLocaleDataIndex,\n} from '@angular/core';\n\nimport {CURRENCIES_EN, CurrenciesSymbols} from './currencies';\n\n/**\n * Format styles that can be used to represent numbers.\n * @see {@link getLocaleNumberFormat}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated `getLocaleNumberFormat` is deprecated\n */\nexport enum NumberFormatStyle {\n Decimal,\n Percent,\n Currency,\n Scientific,\n}\n\n/**\n * Plurality cases used for translating plurals to different languages.\n *\n * @see {@link NgPlural}\n * @see {@link NgPluralCase}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated `getLocalePluralCase` is deprecated\n */\nexport enum Plural {\n Zero = 0,\n One = 1,\n Two = 2,\n Few = 3,\n Many = 4,\n Other = 5,\n}\n\n/**\n * Context-dependant translation forms for strings.\n * Typically the standalone version is for the nominative form of the word,\n * and the format version is used for the genitive case.\n * @see [CLDR website](http://cldr.unicode.org/translation/date-time-1/date-time#TOC-Standalone-vs.-Format-Styles)\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated locale data getters are deprecated\n */\nexport enum FormStyle {\n Format,\n Standalone,\n}\n\n/**\n * String widths available for translations.\n * The specific character widths are locale-specific.\n * Examples are given for the word \"Sunday\" in English.\n *\n * @publicApi\n *\n * @deprecated locale data getters are deprecated\n */\nexport enum TranslationWidth {\n /** 1 character for `en-US`. For example: 'S' */\n Narrow,\n /** 3 characters for `en-US`. For example: 'Sun' */\n Abbreviated,\n /** Full length for `en-US`. For example: \"Sunday\" */\n Wide,\n /** 2 characters for `en-US`, For example: \"Su\" */\n Short,\n}\n\n/**\n * String widths available for date-time formats.\n * The specific character widths are locale-specific.\n * Examples are given for `en-US`.\n *\n * @see {@link getLocaleDateFormat}\n * @see {@link getLocaleTimeFormat}\n * @see {@link getLocaleDateTimeFormat}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n * @publicApi\n *\n * @deprecated Date locale data getters are deprecated\n */\nexport enum FormatWidth {\n /**\n * For `en-US`, `'M/d/yy, h:mm a'`\n * (Example: `6/15/15, 9:03 AM`)\n */\n Short,\n /**\n * For `en-US`, `'MMM d, y, h:mm:ss a'`\n * (Example: `Jun 15, 2015, 9:03:01 AM`)\n */\n Medium,\n /**\n * For `en-US`, `'MMMM d, y, h:mm:ss a z'`\n * (Example: `June 15, 2015 at 9:03:01 AM GMT+1`)\n */\n Long,\n /**\n * For `en-US`, `'EEEE, MMMM d, y, h:mm:ss a zzzz'`\n * (Example: `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00`)\n */\n Full,\n}\n\n// This needs to be an object literal, rather than an enum, because TypeScript 5.4+\n// doesn't allow numeric keys and we have `Infinity` and `NaN`.\n/**\n * Symbols that can be used to replace placeholders in number patterns.\n * Examples are based on `en-US` values.\n *\n * @see {@link getLocaleNumberSymbol}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated `getLocaleNumberSymbol` is deprecated\n *\n * @object-literal-as-enum\n */\nexport const NumberSymbol = {\n /**\n * Decimal separator.\n * For `en-US`, the dot character.\n * Example: 2,345`.`67\n */\n Decimal: 0,\n /**\n * Grouping separator, typically for thousands.\n * For `en-US`, the comma character.\n * Example: 2`,`345.67\n */\n Group: 1,\n /**\n * List-item separator.\n * Example: \"one, two, and three\"\n */\n List: 2,\n /**\n * Sign for percentage (out of 100).\n * Example: 23.4%\n */\n PercentSign: 3,\n /**\n * Sign for positive numbers.\n * Example: +23\n */\n PlusSign: 4,\n /**\n * Sign for negative numbers.\n * Example: -23\n */\n MinusSign: 5,\n /**\n * Computer notation for exponential value (n times a power of 10).\n * Example: 1.2E3\n */\n Exponential: 6,\n /**\n * Human-readable format of exponential.\n * Example: 1.2x103\n */\n SuperscriptingExponent: 7,\n /**\n * Sign for permille (out of 1000).\n * Example: 23.4‰\n */\n PerMille: 8,\n /**\n * Infinity, can be used with plus and minus.\n * Example: ∞, +∞, -∞\n */\n Infinity: 9,\n /**\n * Not a number.\n * Example: NaN\n */\n NaN: 10,\n /**\n * Symbol used between time units.\n * Example: 10:52\n */\n TimeSeparator: 11,\n /**\n * Decimal separator for currency values (fallback to `Decimal`).\n * Example: $2,345.67\n */\n CurrencyDecimal: 12,\n /**\n * Group separator for currency values (fallback to `Group`).\n * Example: $2,345.67\n */\n CurrencyGroup: 13,\n} as const;\n\nexport type NumberSymbol = (typeof NumberSymbol)[keyof typeof NumberSymbol];\n\n/**\n * The value for each day of the week, based on the `en-US` locale\n *\n * @publicApi\n *\n * @deprecated Week locale getters are deprecated\n */\nexport enum WeekDay {\n Sunday = 0,\n Monday,\n Tuesday,\n Wednesday,\n Thursday,\n Friday,\n Saturday,\n}\n\n/**\n * Retrieves the locale ID from the currently loaded locale.\n * The loaded locale could be, for example, a global one rather than a regional one.\n * @param locale A locale code, such as `fr-FR`.\n * @returns The locale code. For example, `fr`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * This function serves no purpose when relying on the `Intl` API.\n */\nexport function getLocaleId(locale: string): string {\n return ɵfindLocaleData(locale)[ɵLocaleDataIndex.LocaleId];\n}\n\n/**\n * Retrieves day period strings for the given locale.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param formStyle The required grammatical form.\n * @param width The required character width.\n * @returns An array of localized period strings. For example, `[AM, PM]` for `en-US`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleDayPeriods(\n locale: string,\n formStyle: FormStyle,\n width: TranslationWidth,\n): Readonly<[string, string]> {\n const data = ɵfindLocaleData(locale);\n const amPmData = <[string, string][][]>[\n data[ɵLocaleDataIndex.DayPeriodsFormat],\n data[ɵLocaleDataIndex.DayPeriodsStandalone],\n ];\n const amPm = getLastDefinedValue(amPmData, formStyle);\n return getLastDefinedValue(amPm, width);\n}\n\n/**\n * Retrieves days of the week for the given locale, using the Gregorian calendar.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param formStyle The required grammatical form.\n * @param width The required character width.\n * @returns An array of localized name strings.\n * For example,`[Sunday, Monday, ... Saturday]` for `en-US`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleDayNames(\n locale: string,\n formStyle: FormStyle,\n width: TranslationWidth,\n): ReadonlyArray {\n const data = ɵfindLocaleData(locale);\n const daysData = [\n data[ɵLocaleDataIndex.DaysFormat],\n data[ɵLocaleDataIndex.DaysStandalone],\n ];\n const days = getLastDefinedValue(daysData, formStyle);\n return getLastDefinedValue(days, width);\n}\n\n/**\n * Retrieves months of the year for the given locale, using the Gregorian calendar.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param formStyle The required grammatical form.\n * @param width The required character width.\n * @returns An array of localized name strings.\n * For example, `[January, February, ...]` for `en-US`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleMonthNames(\n locale: string,\n formStyle: FormStyle,\n width: TranslationWidth,\n): ReadonlyArray {\n const data = ɵfindLocaleData(locale);\n const monthsData = [\n data[ɵLocaleDataIndex.MonthsFormat],\n data[ɵLocaleDataIndex.MonthsStandalone],\n ];\n const months = getLastDefinedValue(monthsData, formStyle);\n return getLastDefinedValue(months, width);\n}\n\n/**\n * Retrieves Gregorian-calendar eras for the given locale.\n * @param locale A locale code for the locale format rules to use.\n * @param width The required character width.\n\n * @returns An array of localized era strings.\n * For example, `[AD, BC]` for `en-US`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleEraNames(\n locale: string,\n width: TranslationWidth,\n): Readonly<[string, string]> {\n const data = ɵfindLocaleData(locale);\n const erasData = <[string, string][]>data[ɵLocaleDataIndex.Eras];\n return getLastDefinedValue(erasData, width);\n}\n\n/**\n * Retrieves the first day of the week for the given locale.\n *\n * @param locale A locale code for the locale format rules to use.\n * @returns A day index number, using the 0-based week-day index for `en-US`\n * (Sunday = 0, Monday = 1, ...).\n * For example, for `fr-FR`, returns 1 to indicate that the first day is Monday.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * 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).\n * You may want to rely on the following alternatives:\n * - Libraries like [`Luxon`](https://moment.github.io/luxon/#/) rely on `Intl` but fallback on the ISO 8601 definition (monday) if `getWeekInfo` is not supported.\n * - 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.\n */\nexport function getLocaleFirstDayOfWeek(locale: string): WeekDay {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.FirstDayOfWeek];\n}\n\n/**\n * Range of week days that are considered the week-end for the given locale.\n *\n * @param locale A locale code for the locale format rules to use.\n * @returns The range of day values, `[startDay, endDay]`.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * 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).\n * 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 .\n */\nexport function getLocaleWeekEndRange(locale: string): [WeekDay, WeekDay] {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.WeekendRange];\n}\n\n/**\n * Retrieves a localized date-value formatting string.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param width The format type.\n * @returns The localized formatting string.\n * @see {@link FormatWidth}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleDateFormat(locale: string, width: FormatWidth): string {\n const data = ɵfindLocaleData(locale);\n return getLastDefinedValue(data[ɵLocaleDataIndex.DateFormat], width);\n}\n\n/**\n * Retrieves a localized time-value formatting string.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param width The format type.\n * @returns The localized formatting string.\n * @see {@link FormatWidth}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n\n * @publicApi\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleTimeFormat(locale: string, width: FormatWidth): string {\n const data = ɵfindLocaleData(locale);\n return getLastDefinedValue(data[ɵLocaleDataIndex.TimeFormat], width);\n}\n\n/**\n * Retrieves a localized date-time formatting string.\n *\n * @param locale A locale code for the locale format rules to use.\n * @param width The format type.\n * @returns The localized formatting string.\n * @see {@link FormatWidth}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.DateTimeFormat` for date formating instead.\n */\nexport function getLocaleDateTimeFormat(locale: string, width: FormatWidth): string {\n const data = ɵfindLocaleData(locale);\n const dateTimeFormatData = data[ɵLocaleDataIndex.DateTimeFormat];\n return getLastDefinedValue(dateTimeFormatData, width);\n}\n\n/**\n * Retrieves a localized number symbol that can be used to replace placeholders in number formats.\n * @param locale The locale code.\n * @param symbol The symbol to localize. Must be one of `NumberSymbol`.\n * @returns The character for the localized symbol.\n * @see {@link NumberSymbol}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.NumberFormat` to format numbers instead.\n */\nexport function getLocaleNumberSymbol(locale: string, symbol: NumberSymbol): string {\n const data = ɵfindLocaleData(locale);\n const res = data[ɵLocaleDataIndex.NumberSymbols][symbol];\n if (typeof res === 'undefined') {\n if (symbol === NumberSymbol.CurrencyDecimal) {\n return data[ɵLocaleDataIndex.NumberSymbols][NumberSymbol.Decimal];\n } else if (symbol === NumberSymbol.CurrencyGroup) {\n return data[ɵLocaleDataIndex.NumberSymbols][NumberSymbol.Group];\n }\n }\n return res;\n}\n\n/**\n * Retrieves a number format for a given locale.\n *\n * Numbers are formatted using patterns, like `#,###.00`. For example, the pattern `#,###.00`\n * when used to format the number 12345.678 could result in \"12'345,678\". That would happen if the\n * grouping separator for your language is an apostrophe, and the decimal separator is a comma.\n *\n * Important: The characters `.` `,` `0` `#` (and others below) are special placeholders\n * that stand for the decimal separator, and so on, and are NOT real characters.\n * You must NOT \"translate\" the placeholders. For example, don't change `.` to `,` even though in\n * your language the decimal point is written with a comma. The symbols should be replaced by the\n * local equivalents, using the appropriate `NumberSymbol` for your language.\n *\n * Here are the special characters used in number patterns:\n *\n * | Symbol | Meaning |\n * |--------|---------|\n * | . | Replaced automatically by the character used for the decimal point. |\n * | , | Replaced by the \"grouping\" (thousands) separator. |\n * | 0 | Replaced by a digit (or zero if there aren't enough digits). |\n * | # | Replaced by a digit (or nothing if there aren't enough). |\n * | ¤ | Replaced by a currency symbol, such as $ or USD. |\n * | % | Marks a percent format. The % symbol may change position, but must be retained. |\n * | E | Marks a scientific format. The E symbol may change position, but must be retained. |\n * | ' | Special characters used as literal characters are quoted with ASCII single quotes. |\n *\n * @param locale A locale code for the locale format rules to use.\n * @param type The type of numeric value to be formatted (such as `Decimal` or `Currency`.)\n * @returns The localized format string.\n * @see {@link NumberFormatStyle}\n * @see [CLDR website](http://cldr.unicode.org/translation/number-patterns)\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Let `Intl.NumberFormat` determine the number format instead\n */\nexport function getLocaleNumberFormat(locale: string, type: NumberFormatStyle): string {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.NumberFormats][type];\n}\n\n/**\n * Retrieves the symbol used to represent the currency for the main country\n * corresponding to a given locale. For example, '$' for `en-US`.\n *\n * @param locale A locale code for the locale format rules to use.\n * @returns The localized symbol character,\n * or `null` if the main country cannot be determined.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Use the `Intl` API to format a currency with from currency code\n */\nexport function getLocaleCurrencySymbol(locale: string): string | null {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.CurrencySymbol] || null;\n}\n\n/**\n * Retrieves the name of the currency for the main country corresponding\n * to a given locale. For example, 'US Dollar' for `en-US`.\n * @param locale A locale code for the locale format rules to use.\n * @returns The currency name,\n * or `null` if the main country cannot be determined.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Use the `Intl` API to format a currency with from currency code\n */\nexport function getLocaleCurrencyName(locale: string): string | null {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.CurrencyName] || null;\n}\n\n/**\n * Retrieves the default currency code for the given locale.\n *\n * The default is defined as the first currency which is still in use.\n *\n * @param locale The code of the locale whose currency code we want.\n * @returns The code of the default currency for the given locale.\n *\n * @publicApi\n *\n * @deprecated We recommend you create a map of locale to ISO 4217 currency codes.\n * Time relative currency data is provided by the CLDR project. See https://www.unicode.org/cldr/charts/44/supplemental/detailed_territory_currency_information.html\n */\nexport function getLocaleCurrencyCode(locale: string): string | null {\n return ɵgetLocaleCurrencyCode(locale);\n}\n\n/**\n * Retrieves the currency values for a given locale.\n * @param locale A locale code for the locale format rules to use.\n * @returns The currency values.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n */\nfunction getLocaleCurrencies(locale: string): {[code: string]: CurrenciesSymbols} {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.Currencies];\n}\n\n/**\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Use `Intl.PluralRules` instead\n */\nexport const getLocalePluralCase: (locale: string) => (value: number) => Plural =\n ɵgetLocalePluralCase;\n\nfunction checkFullData(data: any) {\n if (!data[ɵLocaleDataIndex.ExtraData]) {\n throw new Error(\n `Missing extra locale data for the locale \"${\n data[ɵLocaleDataIndex.LocaleId]\n }\". Use \"registerLocaleData\" to load new data. See the \"I18n guide\" on angular.io to know more.`,\n );\n }\n}\n\n/**\n * Retrieves locale-specific rules used to determine which day period to use\n * when more than one period is defined for a locale.\n *\n * There is a rule for each defined day period. The\n * first rule is applied to the first day period and so on.\n * Fall back to AM/PM when no rules are available.\n *\n * A rule can specify a period as time range, or as a single time value.\n *\n * This functionality is only available when you have loaded the full locale data.\n * See the [\"I18n guide\"](guide/i18n/format-data-locale).\n *\n * @param locale A locale code for the locale format rules to use.\n * @returns The rules for the locale, a single time value or array of *from-time, to-time*,\n * or null if no periods are available.\n *\n * @see {@link getLocaleExtraDayPeriods}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * Let `Intl.DateTimeFormat` determine the day period instead.\n */\nexport function getLocaleExtraDayPeriodRules(locale: string): (Time | [Time, Time])[] {\n const data = ɵfindLocaleData(locale);\n checkFullData(data);\n const rules = data[ɵLocaleDataIndex.ExtraData][ɵExtraLocaleDataIndex.ExtraDayPeriodsRules] || [];\n return rules.map((rule: string | [string, string]) => {\n if (typeof rule === 'string') {\n return extractTime(rule);\n }\n return [extractTime(rule[0]), extractTime(rule[1])];\n });\n}\n\n/**\n * Retrieves locale-specific day periods, which indicate roughly how a day is broken up\n * in different languages.\n * For example, for `en-US`, periods are morning, noon, afternoon, evening, and midnight.\n *\n * This functionality is only available when you have loaded the full locale data.\n * See the [\"I18n guide\"](guide/i18n/format-data-locale).\n *\n * @param locale A locale code for the locale format rules to use.\n * @param formStyle The required grammatical form.\n * @param width The required character width.\n * @returns The translated day-period strings.\n * @see {@link getLocaleExtraDayPeriodRules}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * To extract a day period use `Intl.DateTimeFormat` with the `dayPeriod` option instead.\n */\nexport function getLocaleExtraDayPeriods(\n locale: string,\n formStyle: FormStyle,\n width: TranslationWidth,\n): string[] {\n const data = ɵfindLocaleData(locale);\n checkFullData(data);\n const dayPeriodsData = [\n data[ɵLocaleDataIndex.ExtraData][ɵExtraLocaleDataIndex.ExtraDayPeriodFormats],\n data[ɵLocaleDataIndex.ExtraData][ɵExtraLocaleDataIndex.ExtraDayPeriodStandalone],\n ];\n const dayPeriods = getLastDefinedValue(dayPeriodsData, formStyle) || [];\n return getLastDefinedValue(dayPeriods, width) || [];\n}\n\n/**\n * Retrieves the writing direction of a specified locale\n * @param locale A locale code for the locale format rules to use.\n * @publicApi\n * @returns 'rtl' or 'ltr'\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * For dates and numbers, let `Intl.DateTimeFormat()` and `Intl.NumberFormat()` determine the writing direction.\n * The `Intl` alternative [`getTextInfo`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale/getTextInfo).\n * has only partial support (Chromium M99 & Safari 17).\n * 3rd party alternatives like [`rtl-detect`](https://www.npmjs.com/package/rtl-detect) can work around this issue.\n */\nexport function getLocaleDirection(locale: string): 'ltr' | 'rtl' {\n const data = ɵfindLocaleData(locale);\n return data[ɵLocaleDataIndex.Directionality];\n}\n\n/**\n * Retrieves the first value that is defined in an array, going backwards from an index position.\n *\n * To avoid repeating the same data (as when the \"format\" and \"standalone\" forms are the same)\n * add the first value to the locale data arrays, and add other values only if they are different.\n *\n * @param data The data array to retrieve from.\n * @param index A 0-based index into the array to start from.\n * @returns The value immediately before the given index position.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n */\nfunction getLastDefinedValue(data: T[], index: number): T {\n for (let i = index; i > -1; i--) {\n if (typeof data[i] !== 'undefined') {\n return data[i];\n }\n }\n throw new Error('Locale data API: locale data undefined');\n}\n\n/**\n * Represents a time value with hours and minutes.\n *\n * @publicApi\n *\n * @deprecated Locale date getters are deprecated\n */\nexport type Time = {\n hours: number;\n minutes: number;\n};\n\n/**\n * Extracts the hours and minutes from a string like \"15:45\"\n */\nfunction extractTime(time: string): Time {\n const [h, m] = time.split(':');\n return {hours: +h, minutes: +m};\n}\n\n/**\n * Retrieves the currency symbol for a given currency code.\n *\n * For example, for the default `en-US` locale, the code `USD` can\n * be represented by the narrow symbol `$` or the wide symbol `US$`.\n *\n * @param code The currency code.\n * @param format The format, `wide` or `narrow`.\n * @param locale A locale code for the locale format rules to use.\n *\n * @returns The symbol, or the currency code if no symbol is available.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * You can use `Intl.NumberFormat().formatToParts()` to extract the currency symbol.\n * For example: `Intl.NumberFormat('en', {style:'currency', currency: 'USD'}).formatToParts().find(part => part.type === 'currency').value`\n * returns `$` for USD currency code in the `en` locale.\n * Note: `US$` is a currency symbol for the `en-ca` locale but not the `en-us` locale.\n */\nexport function getCurrencySymbol(code: string, format: 'wide' | 'narrow', locale = 'en'): string {\n const currency = getLocaleCurrencies(locale)[code] || CURRENCIES_EN[code] || [];\n const symbolNarrow = currency[ɵCurrencyIndex.SymbolNarrow];\n\n if (format === 'narrow' && typeof symbolNarrow === 'string') {\n return symbolNarrow;\n }\n\n return currency[ɵCurrencyIndex.Symbol] || code;\n}\n\n// Most currencies have cents, that's why the default is 2\nconst DEFAULT_NB_OF_CURRENCY_DIGITS = 2;\n\n/**\n * Reports the number of decimal digits for a given currency.\n * The value depends upon the presence of cents in that particular currency.\n *\n * @param code The currency code.\n * @returns The number of decimal digits, typically 0 or 2.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n *\n * @deprecated Angular recommends relying on the `Intl` API for i18n.\n * This function should not be used anymore. Let `Intl.NumberFormat` determine the number of digits to display for the currency\n */\nexport function getNumberOfCurrencyDigits(code: string): number {\n let digits;\n const currency = CURRENCIES_EN[code];\n if (currency) {\n digits = currency[ɵCurrencyIndex.NbOfDigits];\n }\n return typeof digits === 'number' ? digits : DEFAULT_NB_OF_CURRENCY_DIGITS;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n FormatWidth,\n FormStyle,\n getLocaleDateFormat,\n getLocaleDateTimeFormat,\n getLocaleDayNames,\n getLocaleDayPeriods,\n getLocaleEraNames,\n getLocaleExtraDayPeriodRules,\n getLocaleExtraDayPeriods,\n getLocaleId,\n getLocaleMonthNames,\n getLocaleNumberSymbol,\n getLocaleTimeFormat,\n NumberSymbol,\n Time,\n TranslationWidth,\n} from './locale_data_api';\n\nexport const ISO8601_DATE_REGEX =\n /^(\\d{4,})-?(\\d\\d)-?(\\d\\d)(?:T(\\d\\d)(?::?(\\d\\d)(?::?(\\d\\d)(?:\\.(\\d+))?)?)?(Z|([+-])(\\d\\d):?(\\d\\d))?)?$/;\n// 1 2 3 4 5 6 7 8 9 10 11\nconst NAMED_FORMATS: {[localeId: string]: {[format: string]: string}} = {};\nconst DATE_FORMATS_SPLIT =\n /((?:[^BEGHLMOSWYZabcdhmswyz']+)|(?:'(?:[^']|'')*')|(?:G{1,5}|y{1,4}|Y{1,4}|M{1,5}|L{1,5}|w{1,2}|W{1}|d{1,2}|E{1,6}|c{1,6}|a{1,5}|b{1,5}|B{1,5}|h{1,2}|H{1,2}|m{1,2}|s{1,2}|S{1,3}|z{1,4}|Z{1,5}|O{1,4}))([\\s\\S]*)/;\n\nconst enum ZoneWidth {\n Short,\n ShortGMT,\n Long,\n Extended,\n}\n\nconst enum DateType {\n FullYear,\n Month,\n Date,\n Hours,\n Minutes,\n Seconds,\n FractionalSeconds,\n Day,\n}\n\nconst enum TranslationType {\n DayPeriods,\n Days,\n Months,\n Eras,\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a date according to locale rules.\n *\n * @param value The date to format, as a Date, or a number (milliseconds since UTC epoch)\n * or an [ISO date-time string](https://www.w3.org/TR/NOTE-datetime).\n * @param format The date-time components to include. See `DatePipe` for details.\n * @param locale A locale code for the locale format rules to use.\n * @param timezone The time zone. A time zone offset from GMT (such as `'+0430'`).\n * If not specified, uses host system settings.\n *\n * @returns The formatted date string.\n *\n * @see {@link DatePipe}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n */\nexport function formatDate(\n value: string | number | Date,\n format: string,\n locale: string,\n timezone?: string,\n): string {\n let date = toDate(value);\n const namedFormat = getNamedFormat(locale, format);\n format = namedFormat || format;\n\n let parts: string[] = [];\n let match;\n while (format) {\n match = DATE_FORMATS_SPLIT.exec(format);\n if (match) {\n parts = parts.concat(match.slice(1));\n const part = parts.pop();\n if (!part) {\n break;\n }\n format = part;\n } else {\n parts.push(format);\n break;\n }\n }\n\n let dateTimezoneOffset = date.getTimezoneOffset();\n if (timezone) {\n dateTimezoneOffset = timezoneToOffset(timezone, dateTimezoneOffset);\n date = convertTimezoneToLocal(date, timezone, true);\n }\n\n let text = '';\n parts.forEach((value) => {\n const dateFormatter = getDateFormatter(value);\n text += dateFormatter\n ? dateFormatter(date, locale, dateTimezoneOffset)\n : value === \"''\"\n ? \"'\"\n : value.replace(/(^'|'$)/g, '').replace(/''/g, \"'\");\n });\n\n return text;\n}\n\n/**\n * Create a new Date object with the given date value, and the time set to midnight.\n *\n * We cannot use `new Date(year, month, date)` because it maps years between 0 and 99 to 1900-1999.\n * See: https://github.com/angular/angular/issues/40377\n *\n * Note that this function returns a Date object whose time is midnight in the current locale's\n * timezone. In the future we might want to change this to be midnight in UTC, but this would be a\n * considerable breaking change.\n */\nfunction createDate(year: number, month: number, date: number): Date {\n // The `newDate` is set to midnight (UTC) on January 1st 1970.\n // - In PST this will be December 31st 1969 at 4pm.\n // - In GMT this will be January 1st 1970 at 1am.\n // Note that they even have different years, dates and months!\n const newDate = new Date(0);\n\n // `setFullYear()` allows years like 0001 to be set correctly. This function does not\n // change the internal time of the date.\n // Consider calling `setFullYear(2019, 8, 20)` (September 20, 2019).\n // - In PST this will now be September 20, 2019 at 4pm\n // - In GMT this will now be September 20, 2019 at 1am\n\n newDate.setFullYear(year, month, date);\n // We want the final date to be at local midnight, so we reset the time.\n // - In PST this will now be September 20, 2019 at 12am\n // - In GMT this will now be September 20, 2019 at 12am\n newDate.setHours(0, 0, 0);\n\n return newDate;\n}\n\nfunction getNamedFormat(locale: string, format: string): string {\n const localeId = getLocaleId(locale);\n NAMED_FORMATS[localeId] ??= {};\n\n if (NAMED_FORMATS[localeId][format]) {\n return NAMED_FORMATS[localeId][format];\n }\n\n let formatValue = '';\n switch (format) {\n case 'shortDate':\n formatValue = getLocaleDateFormat(locale, FormatWidth.Short);\n break;\n case 'mediumDate':\n formatValue = getLocaleDateFormat(locale, FormatWidth.Medium);\n break;\n case 'longDate':\n formatValue = getLocaleDateFormat(locale, FormatWidth.Long);\n break;\n case 'fullDate':\n formatValue = getLocaleDateFormat(locale, FormatWidth.Full);\n break;\n case 'shortTime':\n formatValue = getLocaleTimeFormat(locale, FormatWidth.Short);\n break;\n case 'mediumTime':\n formatValue = getLocaleTimeFormat(locale, FormatWidth.Medium);\n break;\n case 'longTime':\n formatValue = getLocaleTimeFormat(locale, FormatWidth.Long);\n break;\n case 'fullTime':\n formatValue = getLocaleTimeFormat(locale, FormatWidth.Full);\n break;\n case 'short':\n const shortTime = getNamedFormat(locale, 'shortTime');\n const shortDate = getNamedFormat(locale, 'shortDate');\n formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Short), [\n shortTime,\n shortDate,\n ]);\n break;\n case 'medium':\n const mediumTime = getNamedFormat(locale, 'mediumTime');\n const mediumDate = getNamedFormat(locale, 'mediumDate');\n formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Medium), [\n mediumTime,\n mediumDate,\n ]);\n break;\n case 'long':\n const longTime = getNamedFormat(locale, 'longTime');\n const longDate = getNamedFormat(locale, 'longDate');\n formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Long), [\n longTime,\n longDate,\n ]);\n break;\n case 'full':\n const fullTime = getNamedFormat(locale, 'fullTime');\n const fullDate = getNamedFormat(locale, 'fullDate');\n formatValue = formatDateTime(getLocaleDateTimeFormat(locale, FormatWidth.Full), [\n fullTime,\n fullDate,\n ]);\n break;\n }\n if (formatValue) {\n NAMED_FORMATS[localeId][format] = formatValue;\n }\n return formatValue;\n}\n\nfunction formatDateTime(str: string, opt_values: string[]) {\n if (opt_values) {\n str = str.replace(/\\{([^}]+)}/g, function (match, key) {\n return opt_values != null && key in opt_values ? opt_values[key] : match;\n });\n }\n return str;\n}\n\nfunction padNumber(\n num: number,\n digits: number,\n minusSign = '-',\n trim?: boolean,\n negWrap?: boolean,\n): string {\n let neg = '';\n if (num < 0 || (negWrap && num <= 0)) {\n if (negWrap) {\n num = -num + 1;\n } else {\n num = -num;\n neg = minusSign;\n }\n }\n let strNum = String(num);\n while (strNum.length < digits) {\n strNum = '0' + strNum;\n }\n if (trim) {\n strNum = strNum.slice(strNum.length - digits);\n }\n return neg + strNum;\n}\n\nfunction formatFractionalSeconds(milliseconds: number, digits: number): string {\n const strMs = padNumber(milliseconds, 3);\n return strMs.substring(0, digits);\n}\n\n/**\n * Returns a date formatter that transforms a date into its locale digit representation\n */\nfunction dateGetter(\n name: DateType,\n size: number,\n offset: number = 0,\n trim = false,\n negWrap = false,\n): DateFormatter {\n return function (date: Date, locale: string): string {\n let part = getDatePart(name, date);\n if (offset > 0 || part > -offset) {\n part += offset;\n }\n\n if (name === DateType.Hours) {\n if (part === 0 && offset === -12) {\n part = 12;\n }\n } else if (name === DateType.FractionalSeconds) {\n return formatFractionalSeconds(part, size);\n }\n\n const localeMinus = getLocaleNumberSymbol(locale, NumberSymbol.MinusSign);\n return padNumber(part, size, localeMinus, trim, negWrap);\n };\n}\n\nfunction getDatePart(part: DateType, date: Date): number {\n switch (part) {\n case DateType.FullYear:\n return date.getFullYear();\n case DateType.Month:\n return date.getMonth();\n case DateType.Date:\n return date.getDate();\n case DateType.Hours:\n return date.getHours();\n case DateType.Minutes:\n return date.getMinutes();\n case DateType.Seconds:\n return date.getSeconds();\n case DateType.FractionalSeconds:\n return date.getMilliseconds();\n case DateType.Day:\n return date.getDay();\n default:\n throw new Error(`Unknown DateType value \"${part}\".`);\n }\n}\n\n/**\n * Returns a date formatter that transforms a date into its locale string representation\n */\nfunction dateStrGetter(\n name: TranslationType,\n width: TranslationWidth,\n form: FormStyle = FormStyle.Format,\n extended = false,\n): DateFormatter {\n return function (date: Date, locale: string): string {\n return getDateTranslation(date, locale, name, width, form, extended);\n };\n}\n\n/**\n * Returns the locale translation of a date for a given form, type and width\n */\nfunction getDateTranslation(\n date: Date,\n locale: string,\n name: TranslationType,\n width: TranslationWidth,\n form: FormStyle,\n extended: boolean,\n) {\n switch (name) {\n case TranslationType.Months:\n return getLocaleMonthNames(locale, form, width)[date.getMonth()];\n case TranslationType.Days:\n return getLocaleDayNames(locale, form, width)[date.getDay()];\n case TranslationType.DayPeriods:\n const currentHours = date.getHours();\n const currentMinutes = date.getMinutes();\n if (extended) {\n const rules = getLocaleExtraDayPeriodRules(locale);\n const dayPeriods = getLocaleExtraDayPeriods(locale, form, width);\n const index = rules.findIndex((rule) => {\n if (Array.isArray(rule)) {\n // morning, afternoon, evening, night\n const [from, to] = rule;\n const afterFrom = currentHours >= from.hours && currentMinutes >= from.minutes;\n const beforeTo =\n currentHours < to.hours || (currentHours === to.hours && currentMinutes < to.minutes);\n // We must account for normal rules that span a period during the day (e.g. 6am-9am)\n // where `from` is less (earlier) than `to`. But also rules that span midnight (e.g.\n // 10pm - 5am) where `from` is greater (later!) than `to`.\n //\n // In the first case the current time must be BOTH after `from` AND before `to`\n // (e.g. 8am is after 6am AND before 10am).\n //\n // In the second case the current time must be EITHER after `from` OR before `to`\n // (e.g. 4am is before 5am but not after 10pm; and 11pm is not before 5am but it is\n // after 10pm).\n if (from.hours < to.hours) {\n if (afterFrom && beforeTo) {\n return true;\n }\n } else if (afterFrom || beforeTo) {\n return true;\n }\n } else {\n // noon or midnight\n if (rule.hours === currentHours && rule.minutes === currentMinutes) {\n return true;\n }\n }\n return false;\n });\n if (index !== -1) {\n return dayPeriods[index];\n }\n }\n // if no rules for the day periods, we use am/pm by default\n return getLocaleDayPeriods(locale, form, width)[currentHours < 12 ? 0 : 1];\n case TranslationType.Eras:\n return getLocaleEraNames(locale, width)[date.getFullYear() <= 0 ? 0 : 1];\n default:\n // This default case is not needed by TypeScript compiler, as the switch is exhaustive.\n // However Closure Compiler does not understand that and reports an error in typed mode.\n // The `throw new Error` below works around the problem, and the unexpected: never variable\n // makes sure tsc still checks this code is unreachable.\n const unexpected: never = name;\n throw new Error(`unexpected translation type ${unexpected}`);\n }\n}\n\n/**\n * Returns a date formatter that transforms a date and an offset into a timezone with ISO8601 or\n * GMT format depending on the width (eg: short = +0430, short:GMT = GMT+4, long = GMT+04:30,\n * extended = +04:30)\n */\nfunction timeZoneGetter(width: ZoneWidth): DateFormatter {\n return function (date: Date, locale: string, offset: number) {\n const zone = -1 * offset;\n const minusSign = getLocaleNumberSymbol(locale, NumberSymbol.MinusSign);\n const hours = zone > 0 ? Math.floor(zone / 60) : Math.ceil(zone / 60);\n switch (width) {\n case ZoneWidth.Short:\n return (\n (zone >= 0 ? '+' : '') +\n padNumber(hours, 2, minusSign) +\n padNumber(Math.abs(zone % 60), 2, minusSign)\n );\n case ZoneWidth.ShortGMT:\n return 'GMT' + (zone >= 0 ? '+' : '') + padNumber(hours, 1, minusSign);\n case ZoneWidth.Long:\n return (\n 'GMT' +\n (zone >= 0 ? '+' : '') +\n padNumber(hours, 2, minusSign) +\n ':' +\n padNumber(Math.abs(zone % 60), 2, minusSign)\n );\n case ZoneWidth.Extended:\n if (offset === 0) {\n return 'Z';\n } else {\n return (\n (zone >= 0 ? '+' : '') +\n padNumber(hours, 2, minusSign) +\n ':' +\n padNumber(Math.abs(zone % 60), 2, minusSign)\n );\n }\n default:\n throw new Error(`Unknown zone width \"${width}\"`);\n }\n };\n}\n\nconst JANUARY = 0;\nconst THURSDAY = 4;\nfunction getFirstThursdayOfYear(year: number) {\n const firstDayOfYear = createDate(year, JANUARY, 1).getDay();\n return createDate(\n year,\n 0,\n 1 + (firstDayOfYear <= THURSDAY ? THURSDAY : THURSDAY + 7) - firstDayOfYear,\n );\n}\n\n/**\n * ISO Week starts on day 1 (Monday) and ends with day 0 (Sunday)\n */\nexport function getThursdayThisIsoWeek(datetime: Date) {\n // getDay returns 0-6 range with sunday as 0.\n const currentDay = datetime.getDay();\n\n // On a Sunday, read the previous Thursday since ISO weeks start on Monday.\n const deltaToThursday = currentDay === 0 ? -3 : THURSDAY - currentDay;\n\n return createDate(\n datetime.getFullYear(),\n datetime.getMonth(),\n datetime.getDate() + deltaToThursday,\n );\n}\n\nfunction weekGetter(size: number, monthBased = false): DateFormatter {\n return function (date: Date, locale: string) {\n let result;\n if (monthBased) {\n const nbDaysBefore1stDayOfMonth =\n new Date(date.getFullYear(), date.getMonth(), 1).getDay() - 1;\n const today = date.getDate();\n result = 1 + Math.floor((today + nbDaysBefore1stDayOfMonth) / 7);\n } else {\n const thisThurs = getThursdayThisIsoWeek(date);\n // Some days of a year are part of next year according to ISO 8601.\n // Compute the firstThurs from the year of this week's Thursday\n const firstThurs = getFirstThursdayOfYear(thisThurs.getFullYear());\n const diff = thisThurs.getTime() - firstThurs.getTime();\n result = 1 + Math.round(diff / 6.048e8); // 6.048e8 ms per week\n }\n\n return padNumber(result, size, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign));\n };\n}\n\n/**\n * Returns a date formatter that provides the week-numbering year for the input date.\n */\nfunction weekNumberingYearGetter(size: number, trim = false): DateFormatter {\n return function (date: Date, locale: string) {\n const thisThurs = getThursdayThisIsoWeek(date);\n const weekNumberingYear = thisThurs.getFullYear();\n return padNumber(\n weekNumberingYear,\n size,\n getLocaleNumberSymbol(locale, NumberSymbol.MinusSign),\n trim,\n );\n };\n}\n\ntype DateFormatter = (date: Date, locale: string, offset: number) => string;\n\nconst DATE_FORMATS: {[format: string]: DateFormatter} = {};\n\n// Based on CLDR formats:\n// See complete list: http://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table\n// See also explanations: http://cldr.unicode.org/translation/date-time\n// TODO(ocombe): support all missing cldr formats: U, Q, D, F, e, j, J, C, A, v, V, X, x\nfunction getDateFormatter(format: string): DateFormatter | null {\n if (DATE_FORMATS[format]) {\n return DATE_FORMATS[format];\n }\n let formatter;\n switch (format) {\n // Era name (AD/BC)\n case 'G':\n case 'GG':\n case 'GGG':\n formatter = dateStrGetter(TranslationType.Eras, TranslationWidth.Abbreviated);\n break;\n case 'GGGG':\n formatter = dateStrGetter(TranslationType.Eras, TranslationWidth.Wide);\n break;\n case 'GGGGG':\n formatter = dateStrGetter(TranslationType.Eras, TranslationWidth.Narrow);\n break;\n\n // 1 digit representation of the year, e.g. (AD 1 => 1, AD 199 => 199)\n case 'y':\n formatter = dateGetter(DateType.FullYear, 1, 0, false, true);\n break;\n // 2 digit representation of the year, padded (00-99). (e.g. AD 2001 => 01, AD 2010 => 10)\n case 'yy':\n formatter = dateGetter(DateType.FullYear, 2, 0, true, true);\n break;\n // 3 digit representation of the year, padded (000-999). (e.g. AD 2001 => 01, AD 2010 => 10)\n case 'yyy':\n formatter = dateGetter(DateType.FullYear, 3, 0, false, true);\n break;\n // 4 digit representation of the year (e.g. AD 1 => 0001, AD 2010 => 2010)\n case 'yyyy':\n formatter = dateGetter(DateType.FullYear, 4, 0, false, true);\n break;\n\n // 1 digit representation of the week-numbering year, e.g. (AD 1 => 1, AD 199 => 199)\n case 'Y':\n formatter = weekNumberingYearGetter(1);\n break;\n // 2 digit representation of the week-numbering year, padded (00-99). (e.g. AD 2001 => 01, AD\n // 2010 => 10)\n case 'YY':\n formatter = weekNumberingYearGetter(2, true);\n break;\n // 3 digit representation of the week-numbering year, padded (000-999). (e.g. AD 1 => 001, AD\n // 2010 => 2010)\n case 'YYY':\n formatter = weekNumberingYearGetter(3);\n break;\n // 4 digit representation of the week-numbering year (e.g. AD 1 => 0001, AD 2010 => 2010)\n case 'YYYY':\n formatter = weekNumberingYearGetter(4);\n break;\n\n // Month of the year (1-12), numeric\n case 'M':\n case 'L':\n formatter = dateGetter(DateType.Month, 1, 1);\n break;\n case 'MM':\n case 'LL':\n formatter = dateGetter(DateType.Month, 2, 1);\n break;\n\n // Month of the year (January, ...), string, format\n case 'MMM':\n formatter = dateStrGetter(TranslationType.Months, TranslationWidth.Abbreviated);\n break;\n case 'MMMM':\n formatter = dateStrGetter(TranslationType.Months, TranslationWidth.Wide);\n break;\n case 'MMMMM':\n formatter = dateStrGetter(TranslationType.Months, TranslationWidth.Narrow);\n break;\n\n // Month of the year (January, ...), string, standalone\n case 'LLL':\n formatter = dateStrGetter(\n TranslationType.Months,\n TranslationWidth.Abbreviated,\n FormStyle.Standalone,\n );\n break;\n case 'LLLL':\n formatter = dateStrGetter(\n TranslationType.Months,\n TranslationWidth.Wide,\n FormStyle.Standalone,\n );\n break;\n case 'LLLLL':\n formatter = dateStrGetter(\n TranslationType.Months,\n TranslationWidth.Narrow,\n FormStyle.Standalone,\n );\n break;\n\n // Week of the year (1, ... 52)\n case 'w':\n formatter = weekGetter(1);\n break;\n case 'ww':\n formatter = weekGetter(2);\n break;\n\n // Week of the month (1, ...)\n case 'W':\n formatter = weekGetter(1, true);\n break;\n\n // Day of the month (1-31)\n case 'd':\n formatter = dateGetter(DateType.Date, 1);\n break;\n case 'dd':\n formatter = dateGetter(DateType.Date, 2);\n break;\n\n // Day of the Week StandAlone (1, 1, Mon, Monday, M, Mo)\n case 'c':\n case 'cc':\n formatter = dateGetter(DateType.Day, 1);\n break;\n case 'ccc':\n formatter = dateStrGetter(\n TranslationType.Days,\n TranslationWidth.Abbreviated,\n FormStyle.Standalone,\n );\n break;\n case 'cccc':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Wide, FormStyle.Standalone);\n break;\n case 'ccccc':\n formatter = dateStrGetter(\n TranslationType.Days,\n TranslationWidth.Narrow,\n FormStyle.Standalone,\n );\n break;\n case 'cccccc':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Short, FormStyle.Standalone);\n break;\n\n // Day of the Week\n case 'E':\n case 'EE':\n case 'EEE':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Abbreviated);\n break;\n case 'EEEE':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Wide);\n break;\n case 'EEEEE':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Narrow);\n break;\n case 'EEEEEE':\n formatter = dateStrGetter(TranslationType.Days, TranslationWidth.Short);\n break;\n\n // Generic period of the day (am-pm)\n case 'a':\n case 'aa':\n case 'aaa':\n formatter = dateStrGetter(TranslationType.DayPeriods, TranslationWidth.Abbreviated);\n break;\n case 'aaaa':\n formatter = dateStrGetter(TranslationType.DayPeriods, TranslationWidth.Wide);\n break;\n case 'aaaaa':\n formatter = dateStrGetter(TranslationType.DayPeriods, TranslationWidth.Narrow);\n break;\n\n // Extended period of the day (midnight, at night, ...), standalone\n case 'b':\n case 'bb':\n case 'bbb':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Abbreviated,\n FormStyle.Standalone,\n true,\n );\n break;\n case 'bbbb':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Wide,\n FormStyle.Standalone,\n true,\n );\n break;\n case 'bbbbb':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Narrow,\n FormStyle.Standalone,\n true,\n );\n break;\n\n // Extended period of the day (midnight, night, ...), standalone\n case 'B':\n case 'BB':\n case 'BBB':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Abbreviated,\n FormStyle.Format,\n true,\n );\n break;\n case 'BBBB':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Wide,\n FormStyle.Format,\n true,\n );\n break;\n case 'BBBBB':\n formatter = dateStrGetter(\n TranslationType.DayPeriods,\n TranslationWidth.Narrow,\n FormStyle.Format,\n true,\n );\n break;\n\n // Hour in AM/PM, (1-12)\n case 'h':\n formatter = dateGetter(DateType.Hours, 1, -12);\n break;\n case 'hh':\n formatter = dateGetter(DateType.Hours, 2, -12);\n break;\n\n // Hour of the day (0-23)\n case 'H':\n formatter = dateGetter(DateType.Hours, 1);\n break;\n // Hour in day, padded (00-23)\n case 'HH':\n formatter = dateGetter(DateType.Hours, 2);\n break;\n\n // Minute of the hour (0-59)\n case 'm':\n formatter = dateGetter(DateType.Minutes, 1);\n break;\n case 'mm':\n formatter = dateGetter(DateType.Minutes, 2);\n break;\n\n // Second of the minute (0-59)\n case 's':\n formatter = dateGetter(DateType.Seconds, 1);\n break;\n case 'ss':\n formatter = dateGetter(DateType.Seconds, 2);\n break;\n\n // Fractional second\n case 'S':\n formatter = dateGetter(DateType.FractionalSeconds, 1);\n break;\n case 'SS':\n formatter = dateGetter(DateType.FractionalSeconds, 2);\n break;\n case 'SSS':\n formatter = dateGetter(DateType.FractionalSeconds, 3);\n break;\n\n // Timezone ISO8601 short format (-0430)\n case 'Z':\n case 'ZZ':\n case 'ZZZ':\n formatter = timeZoneGetter(ZoneWidth.Short);\n break;\n // Timezone ISO8601 extended format (-04:30)\n case 'ZZZZZ':\n formatter = timeZoneGetter(ZoneWidth.Extended);\n break;\n\n // Timezone GMT short format (GMT+4)\n case 'O':\n case 'OO':\n case 'OOO':\n // Should be location, but fallback to format O instead because we don't have the data yet\n case 'z':\n case 'zz':\n case 'zzz':\n formatter = timeZoneGetter(ZoneWidth.ShortGMT);\n break;\n // Timezone GMT long format (GMT+0430)\n case 'OOOO':\n case 'ZZZZ':\n // Should be location, but fallback to format O instead because we don't have the data yet\n case 'zzzz':\n formatter = timeZoneGetter(ZoneWidth.Long);\n break;\n default:\n return null;\n }\n DATE_FORMATS[format] = formatter;\n return formatter;\n}\n\nfunction timezoneToOffset(timezone: string, fallback: number): number {\n // Support: IE 11 only, Edge 13-15+\n // IE/Edge do not \"understand\" colon (`:`) in timezone\n timezone = timezone.replace(/:/g, '');\n const requestedTimezoneOffset = Date.parse('Jan 01, 1970 00:00:00 ' + timezone) / 60000;\n return isNaN(requestedTimezoneOffset) ? fallback : requestedTimezoneOffset;\n}\n\nfunction addDateMinutes(date: Date, minutes: number) {\n date = new Date(date.getTime());\n date.setMinutes(date.getMinutes() + minutes);\n return date;\n}\n\nfunction convertTimezoneToLocal(date: Date, timezone: string, reverse: boolean): Date {\n const reverseValue = reverse ? -1 : 1;\n const dateTimezoneOffset = date.getTimezoneOffset();\n const timezoneOffset = timezoneToOffset(timezone, dateTimezoneOffset);\n return addDateMinutes(date, reverseValue * (timezoneOffset - dateTimezoneOffset));\n}\n\n/**\n * Converts a value to date.\n *\n * Supported input formats:\n * - `Date`\n * - number: timestamp\n * - string: numeric (e.g. \"1234\"), ISO and date strings in a format supported by\n * [Date.parse()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse).\n * Note: ISO strings without time return a date without timeoffset.\n *\n * Throws if unable to convert to a date.\n */\nexport function toDate(value: string | number | Date): Date {\n if (isDate(value)) {\n return value;\n }\n\n if (typeof value === 'number' && !isNaN(value)) {\n return new Date(value);\n }\n\n if (typeof value === 'string') {\n value = value.trim();\n\n if (/^(\\d{4}(-\\d{1,2}(-\\d{1,2})?)?)$/.test(value)) {\n /* For ISO Strings without time the day, month and year must be extracted from the ISO String\n before Date creation to avoid time offset and errors in the new Date.\n If we only replace '-' with ',' in the ISO String (\"2015,01,01\"), and try to create a new\n date, some browsers (e.g. IE 9) will throw an invalid Date error.\n If we leave the '-' (\"2015-01-01\") and try to create a new Date(\"2015-01-01\") the timeoffset\n is applied.\n Note: ISO months are 0 for January, 1 for February, ... */\n const [y, m = 1, d = 1] = value.split('-').map((val: string) => +val);\n return createDate(y, m - 1, d);\n }\n\n const parsedNb = parseFloat(value);\n\n // any string that only contains numbers, like \"1234\" but not like \"1234hello\"\n if (!isNaN((value as any) - parsedNb)) {\n return new Date(parsedNb);\n }\n\n let match: RegExpMatchArray | null;\n if ((match = value.match(ISO8601_DATE_REGEX))) {\n return isoStringToDate(match);\n }\n }\n\n const date = new Date(value as any);\n if (!isDate(date)) {\n throw new Error(`Unable to convert \"${value}\" into a date`);\n }\n return date;\n}\n\n/**\n * Converts a date in ISO8601 to a Date.\n * Used instead of `Date.parse` because of browser discrepancies.\n */\nexport function isoStringToDate(match: RegExpMatchArray): Date {\n const date = new Date(0);\n let tzHour = 0;\n let tzMin = 0;\n\n // match[8] means that the string contains \"Z\" (UTC) or a timezone like \"+01:00\" or \"+0100\"\n const dateSetter = match[8] ? date.setUTCFullYear : date.setFullYear;\n const timeSetter = match[8] ? date.setUTCHours : date.setHours;\n\n // if there is a timezone defined like \"+01:00\" or \"+0100\"\n if (match[9]) {\n tzHour = Number(match[9] + match[10]);\n tzMin = Number(match[9] + match[11]);\n }\n dateSetter.call(date, Number(match[1]), Number(match[2]) - 1, Number(match[3]));\n const h = Number(match[4] || 0) - tzHour;\n const m = Number(match[5] || 0) - tzMin;\n const s = Number(match[6] || 0);\n // The ECMAScript specification (https://www.ecma-international.org/ecma-262/5.1/#sec-15.9.1.11)\n // defines that `DateTime` milliseconds should always be rounded down, so that `999.9ms`\n // becomes `999ms`.\n const ms = Math.floor(parseFloat('0.' + (match[7] || 0)) * 1000);\n timeSetter.call(date, h, m, s, ms);\n return date;\n}\n\nexport function isDate(value: any): value is Date {\n return value instanceof Date && !isNaN(value.valueOf());\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n getLocaleNumberFormat,\n getLocaleNumberSymbol,\n getNumberOfCurrencyDigits,\n NumberFormatStyle,\n NumberSymbol,\n} from './locale_data_api';\n\nexport const NUMBER_FORMAT_REGEXP = /^(\\d+)?\\.((\\d+)(-(\\d+))?)?$/;\nconst MAX_DIGITS = 22;\nconst DECIMAL_SEP = '.';\nconst ZERO_CHAR = '0';\nconst PATTERN_SEP = ';';\nconst GROUP_SEP = ',';\nconst DIGIT_CHAR = '#';\nconst CURRENCY_CHAR = '¤';\nconst PERCENT_CHAR = '%';\n\n/**\n * Transforms a number to a locale string based on a style and a format.\n */\nfunction formatNumberToLocaleString(\n value: number,\n pattern: ParsedNumberFormat,\n locale: string,\n groupSymbol: NumberSymbol,\n decimalSymbol: NumberSymbol,\n digitsInfo?: string,\n isPercent = false,\n): string {\n let formattedText = '';\n let isZero = false;\n\n if (!isFinite(value)) {\n formattedText = getLocaleNumberSymbol(locale, NumberSymbol.Infinity);\n } else {\n let parsedNumber = parseNumber(value);\n\n if (isPercent) {\n parsedNumber = toPercent(parsedNumber);\n }\n\n let minInt = pattern.minInt;\n let minFraction = pattern.minFrac;\n let maxFraction = pattern.maxFrac;\n\n if (digitsInfo) {\n const parts = digitsInfo.match(NUMBER_FORMAT_REGEXP);\n if (parts === null) {\n throw new Error(`${digitsInfo} is not a valid digit info`);\n }\n const minIntPart = parts[1];\n const minFractionPart = parts[3];\n const maxFractionPart = parts[5];\n if (minIntPart != null) {\n minInt = parseIntAutoRadix(minIntPart);\n }\n if (minFractionPart != null) {\n minFraction = parseIntAutoRadix(minFractionPart);\n }\n if (maxFractionPart != null) {\n maxFraction = parseIntAutoRadix(maxFractionPart);\n } else if (minFractionPart != null && minFraction > maxFraction) {\n maxFraction = minFraction;\n }\n }\n\n roundNumber(parsedNumber, minFraction, maxFraction);\n\n let digits = parsedNumber.digits;\n let integerLen = parsedNumber.integerLen;\n const exponent = parsedNumber.exponent;\n let decimals = [];\n isZero = digits.every((d) => !d);\n\n // pad zeros for small numbers\n for (; integerLen < minInt; integerLen++) {\n digits.unshift(0);\n }\n\n // pad zeros for small numbers\n for (; integerLen < 0; integerLen++) {\n digits.unshift(0);\n }\n\n // extract decimals digits\n if (integerLen > 0) {\n decimals = digits.splice(integerLen, digits.length);\n } else {\n decimals = digits;\n digits = [0];\n }\n\n // format the integer digits with grouping separators\n const groups = [];\n if (digits.length >= pattern.lgSize) {\n groups.unshift(digits.splice(-pattern.lgSize, digits.length).join(''));\n }\n\n while (digits.length > pattern.gSize) {\n groups.unshift(digits.splice(-pattern.gSize, digits.length).join(''));\n }\n\n if (digits.length) {\n groups.unshift(digits.join(''));\n }\n\n formattedText = groups.join(getLocaleNumberSymbol(locale, groupSymbol));\n\n // append the decimal digits\n if (decimals.length) {\n formattedText += getLocaleNumberSymbol(locale, decimalSymbol) + decimals.join('');\n }\n\n if (exponent) {\n formattedText += getLocaleNumberSymbol(locale, NumberSymbol.Exponential) + '+' + exponent;\n }\n }\n\n if (value < 0 && !isZero) {\n formattedText = pattern.negPre + formattedText + pattern.negSuf;\n } else {\n formattedText = pattern.posPre + formattedText + pattern.posSuf;\n }\n\n return formattedText;\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a number as currency using locale rules.\n *\n * @param value The number to format.\n * @param locale A locale code for the locale format rules to use.\n * @param currency A string containing the currency symbol or its name,\n * such as \"$\" or \"Canadian Dollar\". Used in output string, but does not affect the operation\n * of the function.\n * @param currencyCode The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217)\n * currency code, such as `USD` for the US dollar and `EUR` for the euro.\n * Used to determine the number of digits in the decimal part.\n * @param digitsInfo Decimal representation options, specified by a string in the following format:\n * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.\n *\n * @returns The formatted currency value.\n *\n * @see {@link formatNumber}\n * @see {@link DecimalPipe}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n */\nexport function formatCurrency(\n value: number,\n locale: string,\n currency: string,\n currencyCode?: string,\n digitsInfo?: string,\n): string {\n const format = getLocaleNumberFormat(locale, NumberFormatStyle.Currency);\n const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign));\n\n pattern.minFrac = getNumberOfCurrencyDigits(currencyCode!);\n pattern.maxFrac = pattern.minFrac;\n\n const res = formatNumberToLocaleString(\n value,\n pattern,\n locale,\n NumberSymbol.CurrencyGroup,\n NumberSymbol.CurrencyDecimal,\n digitsInfo,\n );\n return (\n res\n .replace(CURRENCY_CHAR, currency)\n // if we have 2 time the currency character, the second one is ignored\n .replace(CURRENCY_CHAR, '')\n // If there is a spacing between currency character and the value and\n // the currency character is suppressed by passing an empty string, the\n // spacing character would remain as part of the string. Then we\n // should remove it.\n .trim()\n );\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a number as a percentage according to locale rules.\n *\n * @param value The number to format.\n * @param locale A locale code for the locale format rules to use.\n * @param digitsInfo Decimal representation options, specified by a string in the following format:\n * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.\n *\n * @returns The formatted percentage value.\n *\n * @see {@link formatNumber}\n * @see {@link DecimalPipe}\n * @see [Internationalization (i18n) Guide](guide/i18n)\n * @publicApi\n *\n */\nexport function formatPercent(value: number, locale: string, digitsInfo?: string): string {\n const format = getLocaleNumberFormat(locale, NumberFormatStyle.Percent);\n const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign));\n const res = formatNumberToLocaleString(\n value,\n pattern,\n locale,\n NumberSymbol.Group,\n NumberSymbol.Decimal,\n digitsInfo,\n true,\n );\n return res.replace(\n new RegExp(PERCENT_CHAR, 'g'),\n getLocaleNumberSymbol(locale, NumberSymbol.PercentSign),\n );\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a number as text, with group sizing, separator, and other\n * parameters based on the locale.\n *\n * @param value The number to format.\n * @param locale A locale code for the locale format rules to use.\n * @param digitsInfo Decimal representation options, specified by a string in the following format:\n * `{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}`. See `DecimalPipe` for more details.\n *\n * @returns The formatted text string.\n * @see [Internationalization (i18n) Guide](guide/i18n)\n *\n * @publicApi\n */\nexport function formatNumber(value: number, locale: string, digitsInfo?: string): string {\n const format = getLocaleNumberFormat(locale, NumberFormatStyle.Decimal);\n const pattern = parseNumberFormat(format, getLocaleNumberSymbol(locale, NumberSymbol.MinusSign));\n return formatNumberToLocaleString(\n value,\n pattern,\n locale,\n NumberSymbol.Group,\n NumberSymbol.Decimal,\n digitsInfo,\n );\n}\n\ninterface ParsedNumberFormat {\n minInt: number;\n // the minimum number of digits required in the fraction part of the number\n minFrac: number;\n // the maximum number of digits required in the fraction part of the number\n maxFrac: number;\n // the prefix for a positive number\n posPre: string;\n // the suffix for a positive number\n posSuf: string;\n // the prefix for a negative number (e.g. `-` or `(`))\n negPre: string;\n // the suffix for a negative number (e.g. `)`)\n negSuf: string;\n // number of digits in each group of separated digits\n gSize: number;\n // number of digits in the last group of digits before the decimal separator\n lgSize: number;\n}\n\nfunction parseNumberFormat(format: string, minusSign = '-'): ParsedNumberFormat {\n const p = {\n minInt: 1,\n minFrac: 0,\n maxFrac: 0,\n posPre: '',\n posSuf: '',\n negPre: '',\n negSuf: '',\n gSize: 0,\n lgSize: 0,\n };\n\n const patternParts = format.split(PATTERN_SEP);\n const positive = patternParts[0];\n const negative = patternParts[1];\n\n const positiveParts =\n positive.indexOf(DECIMAL_SEP) !== -1\n ? positive.split(DECIMAL_SEP)\n : [\n positive.substring(0, positive.lastIndexOf(ZERO_CHAR) + 1),\n positive.substring(positive.lastIndexOf(ZERO_CHAR) + 1),\n ],\n integer = positiveParts[0],\n fraction = positiveParts[1] || '';\n\n p.posPre = integer.substring(0, integer.indexOf(DIGIT_CHAR));\n\n for (let i = 0; i < fraction.length; i++) {\n const ch = fraction.charAt(i);\n if (ch === ZERO_CHAR) {\n p.minFrac = p.maxFrac = i + 1;\n } else if (ch === DIGIT_CHAR) {\n p.maxFrac = i + 1;\n } else {\n p.posSuf += ch;\n }\n }\n\n const groups = integer.split(GROUP_SEP);\n p.gSize = groups[1] ? groups[1].length : 0;\n p.lgSize = groups[2] || groups[1] ? (groups[2] || groups[1]).length : 0;\n\n if (negative) {\n const trunkLen = positive.length - p.posPre.length - p.posSuf.length,\n pos = negative.indexOf(DIGIT_CHAR);\n\n p.negPre = negative.substring(0, pos).replace(/'/g, '');\n p.negSuf = negative.slice(pos + trunkLen).replace(/'/g, '');\n } else {\n p.negPre = minusSign + p.posPre;\n p.negSuf = p.posSuf;\n }\n\n return p;\n}\n\ninterface ParsedNumber {\n // an array of digits containing leading zeros as necessary\n digits: number[];\n // the exponent for numbers that would need more than `MAX_DIGITS` digits in `d`\n exponent: number;\n // the number of the digits in `d` that are to the left of the decimal point\n integerLen: number;\n}\n\n// Transforms a parsed number into a percentage by multiplying it by 100\nfunction toPercent(parsedNumber: ParsedNumber): ParsedNumber {\n // if the number is 0, don't do anything\n if (parsedNumber.digits[0] === 0) {\n return parsedNumber;\n }\n\n // Getting the current number of decimals\n const fractionLen = parsedNumber.digits.length - parsedNumber.integerLen;\n if (parsedNumber.exponent) {\n parsedNumber.exponent += 2;\n } else {\n if (fractionLen === 0) {\n parsedNumber.digits.push(0, 0);\n } else if (fractionLen === 1) {\n parsedNumber.digits.push(0);\n }\n parsedNumber.integerLen += 2;\n }\n\n return parsedNumber;\n}\n\n/**\n * Parses a number.\n * Significant bits of this parse algorithm came from https://github.com/MikeMcl/big.js/\n */\nfunction parseNumber(num: number): ParsedNumber {\n let numStr = Math.abs(num) + '';\n let exponent = 0,\n digits,\n integerLen;\n let i, j, zeros;\n\n // Decimal point?\n if ((integerLen = numStr.indexOf(DECIMAL_SEP)) > -1) {\n numStr = numStr.replace(DECIMAL_SEP, '');\n }\n\n // Exponential form?\n if ((i = numStr.search(/e/i)) > 0) {\n // Work out the exponent.\n if (integerLen < 0) integerLen = i;\n integerLen += +numStr.slice(i + 1);\n numStr = numStr.substring(0, i);\n } else if (integerLen < 0) {\n // There was no decimal point or exponent so it is an integer.\n integerLen = numStr.length;\n }\n\n // Count the number of leading zeros.\n for (i = 0; numStr.charAt(i) === ZERO_CHAR; i++) {\n /* empty */\n }\n\n if (i === (zeros = numStr.length)) {\n // The digits are all zero.\n digits = [0];\n integerLen = 1;\n } else {\n // Count the number of trailing zeros\n zeros--;\n while (numStr.charAt(zeros) === ZERO_CHAR) zeros--;\n\n // Trailing zeros are insignificant so ignore them\n integerLen -= i;\n digits = [];\n // Convert string to array of digits without leading/trailing zeros.\n for (j = 0; i <= zeros; i++, j++) {\n digits[j] = Number(numStr.charAt(i));\n }\n }\n\n // If the number overflows the maximum allowed digits then use an exponent.\n if (integerLen > MAX_DIGITS) {\n digits = digits.splice(0, MAX_DIGITS - 1);\n exponent = integerLen - 1;\n integerLen = 1;\n }\n\n return {digits, exponent, integerLen};\n}\n\n/**\n * Round the parsed number to the specified number of decimal places\n * This function changes the parsedNumber in-place\n */\nfunction roundNumber(parsedNumber: ParsedNumber, minFrac: number, maxFrac: number) {\n if (minFrac > maxFrac) {\n throw new Error(\n `The minimum number of digits after fraction (${minFrac}) is higher than the maximum (${maxFrac}).`,\n );\n }\n\n let digits = parsedNumber.digits;\n let fractionLen = digits.length - parsedNumber.integerLen;\n const fractionSize = Math.min(Math.max(minFrac, fractionLen), maxFrac);\n\n // The index of the digit to where rounding is to occur\n let roundAt = fractionSize + parsedNumber.integerLen;\n let digit = digits[roundAt];\n\n if (roundAt > 0) {\n // Drop fractional digits beyond `roundAt`\n digits.splice(Math.max(parsedNumber.integerLen, roundAt));\n\n // Set non-fractional digits beyond `roundAt` to 0\n for (let j = roundAt; j < digits.length; j++) {\n digits[j] = 0;\n }\n } else {\n // We rounded to zero so reset the parsedNumber\n fractionLen = Math.max(0, fractionLen);\n parsedNumber.integerLen = 1;\n digits.length = Math.max(1, (roundAt = fractionSize + 1));\n digits[0] = 0;\n for (let i = 1; i < roundAt; i++) digits[i] = 0;\n }\n\n if (digit >= 5) {\n if (roundAt - 1 < 0) {\n for (let k = 0; k > roundAt; k--) {\n digits.unshift(0);\n parsedNumber.integerLen++;\n }\n digits.unshift(1);\n parsedNumber.integerLen++;\n } else {\n digits[roundAt - 1]++;\n }\n }\n\n // Pad out with zeros to get the required fraction length\n for (; fractionLen < Math.max(0, fractionSize); fractionLen++) digits.push(0);\n\n let dropTrailingZeros = fractionSize !== 0;\n // Minimal length = nb of decimals required + current nb of integers\n // Any number besides that is optional and can be removed if it's a trailing 0\n const minLen = minFrac + parsedNumber.integerLen;\n // Do any carrying, e.g. a digit was rounded up to 10\n const carry = digits.reduceRight(function (carry, d, i, digits) {\n d = d + carry;\n digits[i] = d < 10 ? d : d - 10; // d % 10\n if (dropTrailingZeros) {\n // Do not keep meaningless fractional trailing zeros (e.g. 15.52000 --> 15.52)\n if (digits[i] === 0 && i >= minLen) {\n digits.pop();\n } else {\n dropTrailingZeros = false;\n }\n }\n return d >= 10 ? 1 : 0; // Math.floor(d / 10);\n }, 0);\n if (carry) {\n digits.unshift(carry);\n parsedNumber.integerLen++;\n }\n}\n\nexport function parseIntAutoRadix(text: string): number {\n const result: number = parseInt(text);\n if (isNaN(result)) {\n throw new Error('Invalid integer literal when parsing ' + text);\n }\n return result;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Inject, Injectable, LOCALE_ID} from '@angular/core';\n\nimport {getLocalePluralCase, Plural} from './locale_data_api';\n\n/**\n * @publicApi\n */\n@Injectable({\n providedIn: 'root',\n useFactory: (locale: string) => new NgLocaleLocalization(locale),\n deps: [LOCALE_ID],\n})\nexport abstract class NgLocalization {\n abstract getPluralCategory(value: any, locale?: string): string;\n}\n\n/**\n * Returns the plural category for a given value.\n * - \"=value\" when the case exists,\n * - the plural category otherwise\n */\nexport function getPluralCategory(\n value: number,\n cases: string[],\n ngLocalization: NgLocalization,\n locale?: string,\n): string {\n let key = `=${value}`;\n\n if (cases.indexOf(key) > -1) {\n return key;\n }\n\n key = ngLocalization.getPluralCategory(value, locale);\n\n if (cases.indexOf(key) > -1) {\n return key;\n }\n\n if (cases.indexOf('other') > -1) {\n return 'other';\n }\n\n throw new Error(`No plural message found for value \"${value}\"`);\n}\n\n/**\n * Returns the plural case based on the locale\n *\n * @publicApi\n */\n@Injectable()\nexport class NgLocaleLocalization extends NgLocalization {\n constructor(@Inject(LOCALE_ID) protected locale: string) {\n super();\n }\n\n override getPluralCategory(value: any, locale?: string): string {\n const plural = getLocalePluralCase(locale || this.locale)(value);\n\n switch (plural) {\n case Plural.Zero:\n return 'zero';\n case Plural.One:\n return 'one';\n case Plural.Two:\n return 'two';\n case Plural.Few:\n return 'few';\n case Plural.Many:\n return 'many';\n default:\n return 'other';\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Input,\n Renderer2,\n ɵstringify as stringify,\n} from '@angular/core';\n\ntype NgClassSupportedTypes = string[] | Set | {[klass: string]: any} | null | undefined;\n\nconst WS_REGEXP = /\\s+/;\n\nconst EMPTY_ARRAY: string[] = [];\n\n/**\n * Represents internal object used to track state of each CSS class. There are 3 different (boolean)\n * flags that, combined together, indicate state of a given CSS class:\n * - enabled: indicates if a class should be present in the DOM (true) or not (false);\n * - changed: tracks if a class was toggled (added or removed) during the custom dirty-checking\n * process; changed classes must be synchronized with the DOM;\n * - touched: tracks if a class is present in the current object bound to the class / ngClass input;\n * classes that are not present any more can be removed from the internal data structures;\n */\ninterface CssClassState {\n // PERF: could use a bit mask to represent state as all fields are boolean flags\n enabled: boolean;\n changed: boolean;\n touched: boolean;\n}\n\n/**\n * @ngModule CommonModule\n *\n * @usageNotes\n * ```html\n * ...\n *\n * ...\n * ```\n *\n * For more simple use cases you can use the [class bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly.\n * It doesn't require importing a directive.\n *\n * ```html\n * ...\n *\n * ...\n *\n * ...\n *\n * ...\n * ```\n * @description\n *\n * Adds and removes CSS classes on an HTML element.\n *\n * The CSS classes are updated as follows, depending on the type of the expression evaluation:\n * - `string` - the CSS classes listed in the string (space delimited) are added,\n * - `Array` - the CSS classes declared as Array elements are added,\n * - `Object` - keys are CSS classes that get added when the expression given in the value\n * evaluates to a truthy value, otherwise they are removed.\n *\n *\n * @see [Class bindings](/guide/templates/binding#css-class-and-style-property-bindings)\n *\n * @publicApi\n */\n@Directive({\n selector: '[ngClass]',\n})\nexport class NgClass implements DoCheck {\n private initialClasses = EMPTY_ARRAY;\n private rawClass: NgClassSupportedTypes;\n\n private stateMap = new Map();\n\n constructor(\n private _ngEl: ElementRef,\n private _renderer: Renderer2,\n ) {}\n\n @Input('class')\n set klass(value: string) {\n this.initialClasses = value != null ? value.trim().split(WS_REGEXP) : EMPTY_ARRAY;\n }\n\n @Input('ngClass')\n set ngClass(value: string | string[] | Set | {[klass: string]: any} | null | undefined) {\n this.rawClass = typeof value === 'string' ? value.trim().split(WS_REGEXP) : value;\n }\n\n /*\n The NgClass directive uses the custom change detection algorithm for its inputs. The custom\n algorithm is necessary since inputs are represented as complex object or arrays that need to be\n deeply-compared.\n\n This algorithm is perf-sensitive since NgClass is used very frequently and its poor performance\n might negatively impact runtime performance of the entire change detection cycle. The design of\n this algorithm is making sure that:\n - there is no unnecessary DOM manipulation (CSS classes are added / removed from the DOM only when\n needed), even if references to bound objects change;\n - there is no memory allocation if nothing changes (even relatively modest memory allocation\n during the change detection cycle can result in GC pauses for some of the CD cycles).\n\n The algorithm works by iterating over the set of bound classes, staring with [class] binding and\n then going over [ngClass] binding. For each CSS class name:\n - check if it was seen before (this information is tracked in the state map) and if its value\n changed;\n - mark it as \"touched\" - names that are not marked are not present in the latest set of binding\n and we can remove such class name from the internal data structures;\n\n After iteration over all the CSS class names we've got data structure with all the information\n necessary to synchronize changes to the DOM - it is enough to iterate over the state map, flush\n changes to the DOM and reset internal data structures so those are ready for the next change\n detection cycle.\n */\n ngDoCheck(): void {\n // classes from the [class] binding\n for (const klass of this.initialClasses) {\n this._updateState(klass, true);\n }\n\n // classes from the [ngClass] binding\n const rawClass = this.rawClass;\n if (Array.isArray(rawClass) || rawClass instanceof Set) {\n for (const klass of rawClass) {\n this._updateState(klass, true);\n }\n } else if (rawClass != null) {\n for (const klass of Object.keys(rawClass)) {\n this._updateState(klass, Boolean(rawClass[klass]));\n }\n }\n\n this._applyStateDiff();\n }\n\n private _updateState(klass: string, nextEnabled: boolean) {\n const state = this.stateMap.get(klass);\n if (state !== undefined) {\n if (state.enabled !== nextEnabled) {\n state.changed = true;\n state.enabled = nextEnabled;\n }\n state.touched = true;\n } else {\n this.stateMap.set(klass, {enabled: nextEnabled, changed: true, touched: true});\n }\n }\n\n private _applyStateDiff() {\n for (const stateEntry of this.stateMap) {\n const klass = stateEntry[0];\n const state = stateEntry[1];\n\n if (state.changed) {\n this._toggleClass(klass, state.enabled);\n state.changed = false;\n } else if (!state.touched) {\n // A class that was previously active got removed from the new collection of classes -\n // remove from the DOM as well.\n if (state.enabled) {\n this._toggleClass(klass, false);\n }\n this.stateMap.delete(klass);\n }\n\n state.touched = false;\n }\n }\n\n private _toggleClass(klass: string, enabled: boolean): void {\n if (ngDevMode) {\n if (typeof klass !== 'string') {\n throw new Error(\n `NgClass can only toggle CSS classes expressed as strings, got ${stringify(klass)}`,\n );\n }\n }\n klass = klass.trim();\n if (klass.length > 0) {\n klass.split(WS_REGEXP).forEach((klass) => {\n if (enabled) {\n this._renderer.addClass(this._ngEl.nativeElement, klass);\n } else {\n this._renderer.removeClass(this._ngEl.nativeElement, klass);\n }\n });\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n ComponentRef,\n createNgModule,\n Directive,\n DoCheck,\n Injector,\n Input,\n NgModuleFactory,\n NgModuleRef,\n OnChanges,\n OnDestroy,\n SimpleChanges,\n Type,\n ViewContainerRef,\n} from '@angular/core';\n\n/**\n * Instantiates a {@link /api/core/Component Component} type and inserts its Host View into the current View.\n * `NgComponentOutlet` provides a declarative approach for dynamic component creation.\n *\n * `NgComponentOutlet` requires a component type, if a falsy value is set the view will clear and\n * any existing component will be destroyed.\n *\n * @usageNotes\n *\n * ### Fine tune control\n *\n * You can control the component creation process by using the following optional attributes:\n *\n * * `ngComponentOutletInputs`: Optional component inputs object, which will be bind to the\n * component.\n *\n * * `ngComponentOutletInjector`: Optional custom {@link Injector} that will be used as parent for\n * the Component. Defaults to the injector of the current view container.\n *\n * * `ngComponentOutletContent`: Optional list of projectable nodes to insert into the content\n * section of the component, if it exists.\n *\n * * `ngComponentOutletNgModule`: Optional NgModule class reference to allow loading another\n * module dynamically, then loading a component from that module.\n *\n * * `ngComponentOutletNgModuleFactory`: Deprecated config option that allows providing optional\n * NgModule factory to allow loading another module dynamically, then loading a component from that\n * module. Use `ngComponentOutletNgModule` instead.\n *\n * ### Syntax\n *\n * Simple\n * ```html\n * \n * ```\n *\n * With inputs\n * ```html\n * \n * \n * ```\n *\n * Customized injector/content\n * ```html\n * \n * \n * ```\n *\n * Customized NgModule reference\n * ```html\n * \n * \n * ```\n *\n * ### A simple example\n *\n * {@example common/ngComponentOutlet/ts/module.ts region='SimpleExample'}\n *\n * A more complete example with additional options:\n *\n * {@example common/ngComponentOutlet/ts/module.ts region='CompleteExample'}\n *\n * @publicApi\n * @ngModule CommonModule\n */\n@Directive({\n selector: '[ngComponentOutlet]',\n exportAs: 'ngComponentOutlet',\n})\nexport class NgComponentOutlet implements OnChanges, DoCheck, OnDestroy {\n // TODO(crisbeto): this should be `Type`, but doing so broke a few\n // targets in a TGP so we need to do it in a major version.\n /** Component that should be rendered in the outlet. */\n @Input() ngComponentOutlet: Type | null = null;\n\n @Input() ngComponentOutletInputs?: Record;\n @Input() ngComponentOutletInjector?: Injector;\n @Input() ngComponentOutletContent?: any[][];\n\n @Input() ngComponentOutletNgModule?: Type;\n /**\n * @deprecated This input is deprecated, use `ngComponentOutletNgModule` instead.\n */\n @Input() ngComponentOutletNgModuleFactory?: NgModuleFactory;\n\n private _componentRef: ComponentRef | undefined;\n private _moduleRef: NgModuleRef | undefined;\n\n /**\n * A helper data structure that allows us to track inputs that were part of the\n * ngComponentOutletInputs expression. Tracking inputs is necessary for proper removal of ones\n * that are no longer referenced.\n */\n private _inputsUsed = new Map();\n\n /**\n * Gets the instance of the currently-rendered component.\n * Will be null if no component has been rendered.\n */\n get componentInstance(): T | null {\n return this._componentRef?.instance ?? null;\n }\n\n constructor(private _viewContainerRef: ViewContainerRef) {}\n\n private _needToReCreateNgModuleInstance(changes: SimpleChanges): boolean {\n // Note: square brackets property accessor is safe for Closure compiler optimizations (the\n // `changes` argument of the `ngOnChanges` lifecycle hook retains the names of the fields that\n // were changed).\n return (\n changes['ngComponentOutletNgModule'] !== undefined ||\n changes['ngComponentOutletNgModuleFactory'] !== undefined\n );\n }\n\n private _needToReCreateComponentInstance(changes: SimpleChanges): boolean {\n // Note: square brackets property accessor is safe for Closure compiler optimizations (the\n // `changes` argument of the `ngOnChanges` lifecycle hook retains the names of the fields that\n // were changed).\n return (\n changes['ngComponentOutlet'] !== undefined ||\n changes['ngComponentOutletContent'] !== undefined ||\n changes['ngComponentOutletInjector'] !== undefined ||\n this._needToReCreateNgModuleInstance(changes)\n );\n }\n\n /** @docs-private */\n ngOnChanges(changes: SimpleChanges) {\n if (this._needToReCreateComponentInstance(changes)) {\n this._viewContainerRef.clear();\n this._inputsUsed.clear();\n this._componentRef = undefined;\n\n if (this.ngComponentOutlet) {\n const injector = this.ngComponentOutletInjector || this._viewContainerRef.parentInjector;\n\n if (this._needToReCreateNgModuleInstance(changes)) {\n this._moduleRef?.destroy();\n\n if (this.ngComponentOutletNgModule) {\n this._moduleRef = createNgModule(\n this.ngComponentOutletNgModule,\n getParentInjector(injector),\n );\n } else if (this.ngComponentOutletNgModuleFactory) {\n this._moduleRef = this.ngComponentOutletNgModuleFactory.create(\n getParentInjector(injector),\n );\n } else {\n this._moduleRef = undefined;\n }\n }\n\n this._componentRef = this._viewContainerRef.createComponent(this.ngComponentOutlet, {\n injector,\n ngModuleRef: this._moduleRef,\n projectableNodes: this.ngComponentOutletContent,\n });\n }\n }\n }\n\n /** @docs-private */\n ngDoCheck() {\n if (this._componentRef) {\n if (this.ngComponentOutletInputs) {\n for (const inputName of Object.keys(this.ngComponentOutletInputs)) {\n this._inputsUsed.set(inputName, true);\n }\n }\n\n this._applyInputStateDiff(this._componentRef);\n }\n }\n\n /** @docs-private */\n ngOnDestroy() {\n this._moduleRef?.destroy();\n }\n\n private _applyInputStateDiff(componentRef: ComponentRef) {\n for (const [inputName, touched] of this._inputsUsed) {\n if (!touched) {\n // The input that was previously active no longer exists and needs to be set to undefined.\n componentRef.setInput(inputName, undefined);\n this._inputsUsed.delete(inputName);\n } else {\n // Since touched is true, it can be asserted that the inputs object is not empty.\n componentRef.setInput(inputName, this.ngComponentOutletInputs![inputName]);\n this._inputsUsed.set(inputName, false);\n }\n }\n }\n}\n\n// Helper function that returns an Injector instance of a parent NgModule.\nfunction getParentInjector(injector: Injector): Injector {\n const parentNgModule = injector.get(NgModuleRef);\n return parentNgModule.injector;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Directive,\n DoCheck,\n EmbeddedViewRef,\n Input,\n IterableChangeRecord,\n IterableChanges,\n IterableDiffer,\n IterableDiffers,\n NgIterable,\n ɵRuntimeError as RuntimeError,\n TemplateRef,\n TrackByFunction,\n ViewContainerRef,\n} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../errors';\n\n/**\n * @publicApi\n */\nexport class NgForOfContext = NgIterable> {\n constructor(\n /** Reference to the current item from the collection. */\n public $implicit: T,\n\n /**\n * The value of the iterable expression. Useful when the expression is\n * more complex then a property access, for example when using the async pipe\n * (`userStreams | async`).\n */\n public ngForOf: U,\n\n /** Returns an index of the current item in the collection. */\n public index: number,\n\n /** Returns total amount of items in the collection. */\n public count: number,\n ) {}\n\n // Indicates whether this is the first item in the collection.\n get first(): boolean {\n return this.index === 0;\n }\n\n // Indicates whether this is the last item in the collection.\n get last(): boolean {\n return this.index === this.count - 1;\n }\n\n // Indicates whether an index of this item in the collection is even.\n get even(): boolean {\n return this.index % 2 === 0;\n }\n\n // Indicates whether an index of this item in the collection is odd.\n get odd(): boolean {\n return !this.even;\n }\n}\n\n/**\n * A [structural directive](guide/directives/structural-directives) that renders\n * a template for each item in a collection.\n * The directive is placed on an element, which becomes the parent\n * of the cloned templates.\n *\n * The `ngForOf` directive is generally used in the\n * [shorthand form](guide/directives/structural-directives#asterisk) `*ngFor`.\n * In this form, the template to be rendered for each iteration is the content\n * of an anchor element containing the directive.\n *\n * The following example shows the shorthand syntax with some options,\n * contained in an `
  • ` element.\n *\n * ```html\n *
  • ...
    • \n * ```\n *\n * The shorthand form expands into a long form that uses the `ngForOf` selector\n * on an `` element.\n * The content of the `` element is the `
  • ` element that held the\n * short-form directive.\n *\n * Here is the expanded version of the short-form example.\n *\n * ```html\n * \n *
  • ...
    • \n *     \n * ```\n *\n * Angular automatically expands the shorthand syntax as it compiles the template.\n * The context for each embedded view is logically merged to the current component\n * context according to its lexical position.\n *\n * When using the shorthand syntax, Angular allows only [one structural directive\n * on an element](guide/directives/structural-directives#one-per-element).\n * If you want to iterate conditionally, for example,\n * put the `*ngIf` on a container element that wraps the `*ngFor` element.\n * For further discussion, see\n * [Structural Directives](guide/directives/structural-directives#one-per-element).\n *\n * @usageNotes\n *\n * ### Local variables\n *\n * `NgForOf` provides exported values that can be aliased to local variables.\n * For example:\n *\n * ```html\n *
  • \n * {{i}}/{{users.length}}. {{user}} default\n *
    • \n * ```\n *\n * The following exported values can be aliased to local variables:\n *\n * - `$implicit: T`: The value of the individual items in the iterable (`ngForOf`).\n * - `ngForOf: NgIterable`: The value of the iterable expression. Useful when the expression is\n * more complex then a property access, for example when using the async pipe (`userStreams |\n * async`).\n * - `index: number`: The index of the current item in the iterable.\n * - `count: number`: The length of the iterable.\n * - `first: boolean`: True when the item is the first item in the iterable.\n * - `last: boolean`: True when the item is the last item in the iterable.\n * - `even: boolean`: True when the item has an even index in the iterable.\n * - `odd: boolean`: True when the item has an odd index in the iterable.\n *\n * ### Change propagation\n *\n * When the contents of the iterator changes, `NgForOf` makes the corresponding changes to the DOM:\n *\n * * When an item is added, a new instance of the template is added to the DOM.\n * * When an item is removed, its template instance is removed from the DOM.\n * * When items are reordered, their respective templates are reordered in the DOM.\n *\n * Angular uses object identity to track insertions and deletions within the iterator and reproduce\n * those changes in the DOM. This has important implications for animations and any stateful\n * controls that are present, such as `` elements that accept user input. Inserted rows can\n * be animated in, deleted rows can be animated out, and unchanged rows retain any unsaved state\n * such as user input.\n * For more on animations, see [Transitions and Triggers](guide/animations/transition-and-triggers).\n *\n * The identities of elements in the iterator can change while the data does not.\n * This can happen, for example, if the iterator is produced from an RPC to the server, and that\n * RPC is re-run. Even if the data hasn't changed, the second response produces objects with\n * different identities, and Angular must tear down the entire DOM and rebuild it (as if all old\n * elements were deleted and all new elements inserted).\n *\n * To avoid this expensive operation, you can customize the default tracking algorithm.\n * by supplying the `trackBy` option to `NgForOf`.\n * `trackBy` takes a function that has two arguments: `index` and `item`.\n * If `trackBy` is given, Angular tracks changes by the return value of the function.\n *\n * @see [Structural Directives](guide/directives/structural-directives)\n * @ngModule CommonModule\n * @publicApi\n */\n@Directive({\n selector: '[ngFor][ngForOf]',\n})\nexport class NgForOf = NgIterable> implements DoCheck {\n /**\n * The value of the iterable expression, which can be used as a\n * [template input variable](guide/directives/structural-directives#shorthand).\n */\n @Input()\n set ngForOf(ngForOf: (U & NgIterable) | undefined | null) {\n this._ngForOf = ngForOf;\n this._ngForOfDirty = true;\n }\n /**\n * Specifies a custom `TrackByFunction` to compute the identity of items in an iterable.\n *\n * If a custom `TrackByFunction` is not provided, `NgForOf` will use the item's [object\n * identity](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is)\n * as the key.\n *\n * `NgForOf` uses the computed key to associate items in an iterable with DOM elements\n * it produces for these items.\n *\n * A custom `TrackByFunction` is useful to provide good user experience in cases when items in an\n * iterable rendered using `NgForOf` have a natural identifier (for example, custom ID or a\n * primary key), and this iterable could be updated with new object instances that still\n * represent the same underlying entity (for example, when data is re-fetched from the server,\n * and the iterable is recreated and re-rendered, but most of the data is still the same).\n *\n * @see {@link TrackByFunction}\n */\n @Input()\n set ngForTrackBy(fn: TrackByFunction) {\n if ((typeof ngDevMode === 'undefined' || ngDevMode) && fn != null && typeof fn !== 'function') {\n console.warn(\n `trackBy must be a function, but received ${JSON.stringify(fn)}. ` +\n `See https://angular.io/api/common/NgForOf#change-propagation for more information.`,\n );\n }\n this._trackByFn = fn;\n }\n\n get ngForTrackBy(): TrackByFunction {\n return this._trackByFn;\n }\n\n private _ngForOf: U | undefined | null = null;\n private _ngForOfDirty: boolean = true;\n private _differ: IterableDiffer | null = null;\n // waiting for microsoft/typescript#43662 to allow the return type `TrackByFunction|undefined` for\n // the getter\n private _trackByFn!: TrackByFunction;\n\n constructor(\n private _viewContainer: ViewContainerRef,\n private _template: TemplateRef>,\n private _differs: IterableDiffers,\n ) {}\n\n /**\n * A reference to the template that is stamped out for each item in the iterable.\n * @see [template reference variable](guide/templates/variables#template-reference-variables)\n */\n @Input()\n set ngForTemplate(value: TemplateRef>) {\n // TODO(TS2.1): make TemplateRef>> once we move to TS v2.1\n // The current type is too restrictive; a template that just uses index, for example,\n // should be acceptable.\n if (value) {\n this._template = value;\n }\n }\n\n /**\n * Applies the changes when needed.\n * @docs-private\n */\n ngDoCheck(): void {\n if (this._ngForOfDirty) {\n this._ngForOfDirty = false;\n // React on ngForOf changes only once all inputs have been initialized\n const value = this._ngForOf;\n if (!this._differ && value) {\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n try {\n // CAUTION: this logic is duplicated for production mode below, as the try-catch\n // is only present in development builds.\n this._differ = this._differs.find(value).create(this.ngForTrackBy);\n } catch {\n let errorMessage =\n `Cannot find a differ supporting object '${value}' of type '` +\n `${getTypeName(value)}'. NgFor only supports binding to Iterables, such as Arrays.`;\n if (typeof value === 'object') {\n errorMessage += ' Did you mean to use the keyvalue pipe?';\n }\n throw new RuntimeError(RuntimeErrorCode.NG_FOR_MISSING_DIFFER, errorMessage);\n }\n } else {\n // CAUTION: this logic is duplicated for development mode above, as the try-catch\n // is only present in development builds.\n this._differ = this._differs.find(value).create(this.ngForTrackBy);\n }\n }\n }\n if (this._differ) {\n const changes = this._differ.diff(this._ngForOf);\n if (changes) this._applyChanges(changes);\n }\n }\n\n private _applyChanges(changes: IterableChanges) {\n const viewContainer = this._viewContainer;\n changes.forEachOperation(\n (\n item: IterableChangeRecord,\n adjustedPreviousIndex: number | null,\n currentIndex: number | null,\n ) => {\n if (item.previousIndex == null) {\n // NgForOf is never \"null\" or \"undefined\" here because the differ detected\n // that a new item needs to be inserted from the iterable. This implies that\n // there is an iterable value for \"_ngForOf\".\n viewContainer.createEmbeddedView(\n this._template,\n new NgForOfContext(item.item, this._ngForOf!, -1, -1),\n currentIndex === null ? undefined : currentIndex,\n );\n } else if (currentIndex == null) {\n viewContainer.remove(adjustedPreviousIndex === null ? undefined : adjustedPreviousIndex);\n } else if (adjustedPreviousIndex !== null) {\n const view = viewContainer.get(adjustedPreviousIndex)!;\n viewContainer.move(view, currentIndex);\n applyViewChange(view as EmbeddedViewRef>, item);\n }\n },\n );\n\n for (let i = 0, ilen = viewContainer.length; i < ilen; i++) {\n const viewRef = >>viewContainer.get(i);\n const context = viewRef.context;\n context.index = i;\n context.count = ilen;\n context.ngForOf = this._ngForOf!;\n }\n\n changes.forEachIdentityChange((record: any) => {\n const viewRef = >>viewContainer.get(record.currentIndex);\n applyViewChange(viewRef, record);\n });\n }\n\n /**\n * Asserts the correct type of the context for the template that `NgForOf` will render.\n *\n * The presence of this method is a signal to the Ivy template type-check compiler that the\n * `NgForOf` structural directive renders its template with a specific context type.\n */\n static ngTemplateContextGuard>(\n dir: NgForOf,\n ctx: any,\n ): ctx is NgForOfContext {\n return true;\n }\n}\n\n// Also export the `NgForOf` class as `NgFor` to improve the DX for\n// cases when the directive is used as standalone, so the class name\n// matches the CSS selector (*ngFor).\nexport {NgForOf as NgFor};\n\nfunction applyViewChange(\n view: EmbeddedViewRef>,\n record: IterableChangeRecord,\n) {\n view.context.$implicit = record.item;\n}\n\nfunction getTypeName(type: any): string {\n return type['name'] || typeof type;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Directive,\n EmbeddedViewRef,\n Input,\n TemplateRef,\n ViewContainerRef,\n ɵstringify as stringify,\n ɵRuntimeError as RuntimeError,\n} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../errors';\n\n/**\n * A structural directive that conditionally includes a template based on the value of\n * an expression coerced to Boolean.\n * When the expression evaluates to true, Angular renders the template\n * provided in a `then` clause, and when false or null,\n * Angular renders the template provided in an optional `else` clause. The default\n * template for the `else` clause is blank.\n *\n * A [shorthand form](guide/directives/structural-directives#asterisk) of the directive,\n * `*ngIf=\"condition\"`, is generally used, provided\n * as an attribute of the anchor element for the inserted template.\n * Angular expands this into a more explicit version, in which the anchor element\n * is contained in an `` element.\n *\n * Simple form with shorthand syntax:\n *\n * ```html\n *
    Content to render when condition is true.
    \n * ```\n *\n * Simple form with expanded syntax:\n *\n * ```html\n *
    Content to render when condition is\n * true.
    \n * ```\n *\n * Form with an \"else\" block:\n *\n * ```html\n *
    Content to render when condition is true.
    \n * Content to render when condition is false.\n * ```\n *\n * Shorthand form with \"then\" and \"else\" blocks:\n *\n * ```html\n *
    \n * Content to render when condition is true.\n * Content to render when condition is false.\n * ```\n *\n * Form with storing the value locally:\n *\n * ```html\n *
    {{value}}
    \n * Content to render when value is null.\n * ```\n *\n * @usageNotes\n *\n * The `*ngIf` directive is most commonly used to conditionally show an inline template,\n * as seen in the following example.\n * The default `else` template is blank.\n *\n * {@example common/ngIf/ts/module.ts region='NgIfSimple'}\n *\n * ### Showing an alternative template using `else`\n *\n * To display a template when `expression` evaluates to false, use an `else` template\n * binding as shown in the following example.\n * The `else` binding points to an `` element labeled `#elseBlock`.\n * The template can be defined anywhere in the component view, but is typically placed right after\n * `ngIf` for readability.\n *\n * {@example common/ngIf/ts/module.ts region='NgIfElse'}\n *\n * ### Using an external `then` template\n *\n * In the previous example, the then-clause template is specified inline, as the content of the\n * tag that contains the `ngIf` directive. You can also specify a template that is defined\n * externally, by referencing a labeled `` element. When you do this, you can\n * change which template to use at runtime, as shown in the following example.\n *\n * {@example common/ngIf/ts/module.ts region='NgIfThenElse'}\n *\n * ### Storing a conditional result in a variable\n *\n * You might want to show a set of properties from the same object. If you are waiting\n * for asynchronous data, the object can be undefined.\n * In this case, you can use `ngIf` and store the result of the condition in a local\n * variable as shown in the following example.\n *\n * {@example common/ngIf/ts/module.ts region='NgIfAs'}\n *\n * This code uses only one `AsyncPipe`, so only one subscription is created.\n * The conditional statement stores the result of `userStream|async` in the local variable `user`.\n * You can then bind the local `user` repeatedly.\n *\n * The conditional displays the data only if `userStream` returns a value,\n * so you don't need to use the\n * safe-navigation-operator (`?.`)\n * to guard against null values when accessing properties.\n * You can display an alternative template while waiting for the data.\n *\n * ### Shorthand syntax\n *\n * The shorthand syntax `*ngIf` expands into two separate template specifications\n * for the \"then\" and \"else\" clauses. For example, consider the following shorthand statement,\n * that is meant to show a loading page while waiting for data to be loaded.\n *\n * ```html\n *
    \n * ...\n *
    \n *\n * \n *
    Loading...
    \n *     \n * ```\n *\n * You can see that the \"else\" clause references the ``\n * with the `#loading` label, and the template for the \"then\" clause\n * is provided as the content of the anchor element.\n *\n * However, when Angular expands the shorthand syntax, it creates\n * another `` tag, with `ngIf` and `ngIfElse` directives.\n * The anchor element containing the template for the \"then\" clause becomes\n * the content of this unlabeled `` tag.\n *\n * ```html\n * \n *
    \n * ...\n *
    \n *     \n *\n * \n *
    Loading...
    \n *     \n * ```\n *\n * The presence of the implicit template object has implications for the nesting of\n * structural directives. For more on this subject, see\n * [Structural Directives](guide/directives/structural-directives#one-per-element).\n *\n * @ngModule CommonModule\n * @publicApi\n */\n@Directive({\n selector: '[ngIf]',\n})\nexport class NgIf {\n private _context: NgIfContext = new NgIfContext();\n private _thenTemplateRef: TemplateRef> | null = null;\n private _elseTemplateRef: TemplateRef> | null = null;\n private _thenViewRef: EmbeddedViewRef> | null = null;\n private _elseViewRef: EmbeddedViewRef> | null = null;\n\n constructor(\n private _viewContainer: ViewContainerRef,\n templateRef: TemplateRef>,\n ) {\n this._thenTemplateRef = templateRef;\n }\n\n /**\n * The Boolean expression to evaluate as the condition for showing a template.\n */\n @Input()\n set ngIf(condition: T) {\n this._context.$implicit = this._context.ngIf = condition;\n this._updateView();\n }\n\n /**\n * A template to show if the condition expression evaluates to true.\n */\n @Input()\n set ngIfThen(templateRef: TemplateRef> | null) {\n assertTemplate(templateRef, (typeof ngDevMode === 'undefined' || ngDevMode) && 'ngIfThen');\n this._thenTemplateRef = templateRef;\n this._thenViewRef = null; // clear previous view if any.\n this._updateView();\n }\n\n /**\n * A template to show if the condition expression evaluates to false.\n */\n @Input()\n set ngIfElse(templateRef: TemplateRef> | null) {\n assertTemplate(templateRef, (typeof ngDevMode === 'undefined' || ngDevMode) && 'ngIfElse');\n this._elseTemplateRef = templateRef;\n this._elseViewRef = null; // clear previous view if any.\n this._updateView();\n }\n\n private _updateView() {\n if (this._context.$implicit) {\n if (!this._thenViewRef) {\n this._viewContainer.clear();\n this._elseViewRef = null;\n if (this._thenTemplateRef) {\n this._thenViewRef = this._viewContainer.createEmbeddedView(\n this._thenTemplateRef,\n this._context,\n );\n }\n }\n } else {\n if (!this._elseViewRef) {\n this._viewContainer.clear();\n this._thenViewRef = null;\n if (this._elseTemplateRef) {\n this._elseViewRef = this._viewContainer.createEmbeddedView(\n this._elseTemplateRef,\n this._context,\n );\n }\n }\n }\n }\n\n /** @internal */\n public static ngIfUseIfTypeGuard: void;\n\n /**\n * Assert the correct type of the expression bound to the `ngIf` input within the template.\n *\n * The presence of this static field is a signal to the Ivy template type check compiler that\n * when the `NgIf` structural directive renders its template, the type of the expression bound\n * to `ngIf` should be narrowed in some way. For `NgIf`, the binding expression itself is used to\n * narrow its type, which allows the strictNullChecks feature of TypeScript to work with `NgIf`.\n */\n static ngTemplateGuard_ngIf: 'binding';\n\n /**\n * Asserts the correct type of the context for the template that `NgIf` will render.\n *\n * The presence of this method is a signal to the Ivy template type-check compiler that the\n * `NgIf` structural directive renders its template with a specific context type.\n */\n static ngTemplateContextGuard(\n dir: NgIf,\n ctx: any,\n ): ctx is NgIfContext> {\n return true;\n }\n}\n\n/**\n * @publicApi\n */\nexport class NgIfContext {\n public $implicit: T = null!;\n public ngIf: T = null!;\n}\n\nfunction assertTemplate(\n templateRef: TemplateRef | null,\n property: string | false | null,\n): void {\n if (templateRef && !templateRef.createEmbeddedView) {\n throw new RuntimeError(\n RuntimeErrorCode.NG_IF_NOT_A_TEMPLATE_REF,\n (typeof ngDevMode === 'undefined' || ngDevMode) &&\n `${property} must be a TemplateRef, but received '${stringify(templateRef)}'.`,\n );\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Directive,\n DoCheck,\n Host,\n Input,\n Optional,\n ɵRuntimeError as RuntimeError,\n TemplateRef,\n ViewContainerRef,\n} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../errors';\n\nexport class SwitchView {\n private _created = false;\n\n constructor(\n private _viewContainerRef: ViewContainerRef,\n private _templateRef: TemplateRef,\n ) {}\n\n create(): void {\n this._created = true;\n this._viewContainerRef.createEmbeddedView(this._templateRef);\n }\n\n destroy(): void {\n this._created = false;\n this._viewContainerRef.clear();\n }\n\n enforceState(created: boolean) {\n if (created && !this._created) {\n this.create();\n } else if (!created && this._created) {\n this.destroy();\n }\n }\n}\n\n/**\n * @ngModule CommonModule\n *\n * @description\n * The `[ngSwitch]` directive on a container specifies an expression to match against.\n * The expressions to match are provided by `ngSwitchCase` directives on views within the container.\n * - Every view that matches is rendered.\n * - If there are no matches, a view with the `ngSwitchDefault` directive is rendered.\n * - Elements within the `[NgSwitch]` statement but outside of any `NgSwitchCase`\n * or `ngSwitchDefault` directive are preserved at the location.\n *\n * @usageNotes\n * Define a container element for the directive, and specify the switch expression\n * to match against as an attribute:\n *\n * ```html\n * \n * ```\n *\n * Within the container, `*ngSwitchCase` statements specify the match expressions\n * as attributes. Include `*ngSwitchDefault` as the final case.\n *\n * ```html\n * \n * ...\n * ...\n * ...\n * \n * ```\n *\n * ### Usage Examples\n *\n * The following example shows how to use more than one case to display the same view:\n *\n * ```html\n * \n * \n * ...\n * ...\n * ...\n * \n * ...\n * \n * ```\n *\n * The following example shows how cases can be nested:\n * ```html\n * \n * ...\n * ...\n * ...\n * \n * \n * \n * \n * \n * ...\n * \n * ```\n *\n * @publicApi\n * @see {@link NgSwitchCase}\n * @see {@link NgSwitchDefault}\n * @see [Structural Directives](guide/directives/structural-directives)\n *\n */\n@Directive({\n selector: '[ngSwitch]',\n})\nexport class NgSwitch {\n private _defaultViews: SwitchView[] = [];\n private _defaultUsed = false;\n private _caseCount = 0;\n private _lastCaseCheckIndex = 0;\n private _lastCasesMatched = false;\n private _ngSwitch: any;\n\n @Input()\n set ngSwitch(newValue: any) {\n this._ngSwitch = newValue;\n if (this._caseCount === 0) {\n this._updateDefaultCases(true);\n }\n }\n\n /** @internal */\n _addCase(): number {\n return this._caseCount++;\n }\n\n /** @internal */\n _addDefault(view: SwitchView) {\n this._defaultViews.push(view);\n }\n\n /** @internal */\n _matchCase(value: any): boolean {\n const matched = value === this._ngSwitch;\n this._lastCasesMatched ||= matched;\n this._lastCaseCheckIndex++;\n if (this._lastCaseCheckIndex === this._caseCount) {\n this._updateDefaultCases(!this._lastCasesMatched);\n this._lastCaseCheckIndex = 0;\n this._lastCasesMatched = false;\n }\n return matched;\n }\n\n private _updateDefaultCases(useDefault: boolean) {\n if (this._defaultViews.length > 0 && useDefault !== this._defaultUsed) {\n this._defaultUsed = useDefault;\n for (const defaultView of this._defaultViews) {\n defaultView.enforceState(useDefault);\n }\n }\n }\n}\n\n/**\n * @ngModule CommonModule\n *\n * @description\n * Provides a switch case expression to match against an enclosing `ngSwitch` expression.\n * When the expressions match, the given `NgSwitchCase` template is rendered.\n * If multiple match expressions match the switch expression value, all of them are displayed.\n *\n * @usageNotes\n *\n * Within a switch container, `*ngSwitchCase` statements specify the match expressions\n * as attributes. Include `*ngSwitchDefault` as the final case.\n *\n * ```html\n * \n * ...\n * ...\n * ...\n * \n * ```\n *\n * Each switch-case statement contains an in-line HTML template or template reference\n * that defines the subtree to be selected if the value of the match expression\n * matches the value of the switch expression.\n *\n * As of Angular v17 the NgSwitch directive uses strict equality comparison (`===`) instead of\n * loose equality (`==`) to match different cases.\n *\n * @publicApi\n * @see {@link NgSwitch}\n * @see {@link NgSwitchDefault}\n *\n */\n@Directive({\n selector: '[ngSwitchCase]',\n})\nexport class NgSwitchCase implements DoCheck {\n private _view: SwitchView;\n /**\n * Stores the HTML template to be selected on match.\n */\n @Input() ngSwitchCase: any;\n\n constructor(\n viewContainer: ViewContainerRef,\n templateRef: TemplateRef,\n @Optional() @Host() private ngSwitch: NgSwitch,\n ) {\n if ((typeof ngDevMode === 'undefined' || ngDevMode) && !ngSwitch) {\n throwNgSwitchProviderNotFoundError('ngSwitchCase', 'NgSwitchCase');\n }\n\n ngSwitch._addCase();\n this._view = new SwitchView(viewContainer, templateRef);\n }\n\n /**\n * Performs case matching. For internal use only.\n * @docs-private\n */\n ngDoCheck() {\n this._view.enforceState(this.ngSwitch._matchCase(this.ngSwitchCase));\n }\n}\n\n/**\n * @ngModule CommonModule\n *\n * @description\n *\n * Creates a view that is rendered when no `NgSwitchCase` expressions\n * match the `NgSwitch` expression.\n * This statement should be the final case in an `NgSwitch`.\n *\n * @publicApi\n * @see {@link NgSwitch}\n * @see {@link NgSwitchCase}\n *\n */\n@Directive({\n selector: '[ngSwitchDefault]',\n})\nexport class NgSwitchDefault {\n constructor(\n viewContainer: ViewContainerRef,\n templateRef: TemplateRef,\n @Optional() @Host() ngSwitch: NgSwitch,\n ) {\n if ((typeof ngDevMode === 'undefined' || ngDevMode) && !ngSwitch) {\n throwNgSwitchProviderNotFoundError('ngSwitchDefault', 'NgSwitchDefault');\n }\n\n ngSwitch._addDefault(new SwitchView(viewContainer, templateRef));\n }\n}\n\nfunction throwNgSwitchProviderNotFoundError(attrName: string, directiveName: string): never {\n throw new RuntimeError(\n RuntimeErrorCode.PARENT_NG_SWITCH_NOT_FOUND,\n `An element with the \"${attrName}\" attribute ` +\n `(matching the \"${directiveName}\" directive) must be located inside an element with the \"ngSwitch\" attribute ` +\n `(matching \"NgSwitch\" directive)`,\n );\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Attribute, Directive, Host, Input, TemplateRef, ViewContainerRef} from '@angular/core';\n\nimport {getPluralCategory, NgLocalization} from '../i18n/localization';\n\nimport {SwitchView} from './ng_switch';\n\n/**\n * @ngModule CommonModule\n *\n * @usageNotes\n * ```html\n * \n * there is nothing\n * there is one\n * there are a few\n * \n * ```\n *\n * @description\n *\n * Adds / removes DOM sub-trees based on a numeric value. Tailored for pluralization.\n *\n * Displays DOM sub-trees that match the switch expression value, or failing that, DOM sub-trees\n * that match the switch expression's pluralization category.\n *\n * To use this directive you must provide a container element that sets the `[ngPlural]` attribute\n * to a switch expression. Inner elements with a `[ngPluralCase]` will display based on their\n * expression:\n * - if `[ngPluralCase]` is set to a value starting with `=`, it will only display if the value\n * matches the switch expression exactly,\n * - otherwise, the view will be treated as a \"category match\", and will only display if exact\n * value matches aren't found and the value maps to its category for the defined locale.\n *\n * See http://cldr.unicode.org/index/cldr-spec/plural-rules\n *\n * @publicApi\n */\n@Directive({\n selector: '[ngPlural]',\n})\nexport class NgPlural {\n private _activeView?: SwitchView;\n private _caseViews: {[k: string]: SwitchView} = {};\n\n constructor(private _localization: NgLocalization) {}\n\n @Input()\n set ngPlural(value: number) {\n this._updateView(value);\n }\n\n addCase(value: string, switchView: SwitchView): void {\n this._caseViews[value] = switchView;\n }\n\n private _updateView(switchValue: number): void {\n this._clearViews();\n\n const cases = Object.keys(this._caseViews);\n const key = getPluralCategory(switchValue, cases, this._localization);\n this._activateView(this._caseViews[key]);\n }\n\n private _clearViews() {\n if (this._activeView) this._activeView.destroy();\n }\n\n private _activateView(view: SwitchView) {\n if (view) {\n this._activeView = view;\n this._activeView.create();\n }\n }\n}\n\n/**\n * @ngModule CommonModule\n *\n * @description\n *\n * Creates a view that will be added/removed from the parent {@link NgPlural} when the\n * given expression matches the plural expression according to CLDR rules.\n *\n * @usageNotes\n * ```html\n * \n * ...\n * ...\n * \n *```\n *\n * See {@link NgPlural} for more details and example.\n *\n * @publicApi\n */\n@Directive({\n selector: '[ngPluralCase]',\n})\nexport class NgPluralCase {\n constructor(\n @Attribute('ngPluralCase') public value: string,\n template: TemplateRef,\n viewContainer: ViewContainerRef,\n @Host() ngPlural: NgPlural,\n ) {\n const isANumber: boolean = !isNaN(Number(value));\n ngPlural.addCase(isANumber ? `=${value}` : value, new SwitchView(viewContainer, template));\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Input,\n KeyValueChanges,\n KeyValueDiffer,\n KeyValueDiffers,\n Renderer2,\n RendererStyleFlags2,\n} from '@angular/core';\n\n/**\n * @ngModule CommonModule\n *\n * @usageNotes\n *\n * Set the width of the containing element to a pixel value returned by an expression.\n *\n * ```html\n * ...\n * ```\n *\n * Set a collection of style values using an expression that returns key-value pairs.\n *\n * ```html\n * ...\n * ```\n *\n * For more simple use cases you can use the [style bindings](/guide/templates/binding#css-class-and-style-property-bindings) directly.\n * It doesn't require importing a directive.\n *\n * Set the font of the containing element to the result of an expression.\n *\n * ```html\n * ...\n * ```\n *\n * @description\n *\n * An attribute directive that updates styles for the containing HTML element.\n * Sets one or more style properties, specified as colon-separated key-value pairs.\n * The key is a style name, with an optional `.` suffix\n * (such as 'top.px', 'font-style.em').\n * The value is an expression to be evaluated.\n * The resulting non-null value, expressed in the given unit,\n * is assigned to the given style property.\n * If the result of evaluation is null, the corresponding style is removed.\n *\n * @see [Style bindings](/guide/templates/binding#css-class-and-style-property-bindings)\n *\n * @publicApi\n */\n@Directive({\n selector: '[ngStyle]',\n})\nexport class NgStyle implements DoCheck {\n private _ngStyle: {[key: string]: string} | null | undefined = null;\n private _differ: KeyValueDiffer | null = null;\n\n constructor(\n private _ngEl: ElementRef,\n private _differs: KeyValueDiffers,\n private _renderer: Renderer2,\n ) {}\n\n @Input('ngStyle')\n set ngStyle(values: {[klass: string]: any} | null | undefined) {\n this._ngStyle = values;\n if (!this._differ && values) {\n this._differ = this._differs.find(values).create();\n }\n }\n\n ngDoCheck() {\n if (this._differ) {\n const changes = this._differ.diff(this._ngStyle!);\n if (changes) {\n this._applyChanges(changes);\n }\n }\n }\n\n private _setStyle(nameAndUnit: string, value: string | number | null | undefined): void {\n const [name, unit] = nameAndUnit.split('.');\n const flags = name.indexOf('-') === -1 ? undefined : (RendererStyleFlags2.DashCase as number);\n\n if (value != null) {\n this._renderer.setStyle(\n this._ngEl.nativeElement,\n name,\n unit ? `${value}${unit}` : value,\n flags,\n );\n } else {\n this._renderer.removeStyle(this._ngEl.nativeElement, name, flags);\n }\n }\n\n private _applyChanges(changes: KeyValueChanges): void {\n changes.forEachRemovedItem((record) => this._setStyle(record.key, null));\n changes.forEachAddedItem((record) => this._setStyle(record.key, record.currentValue));\n changes.forEachChangedItem((record) => this._setStyle(record.key, record.currentValue));\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Directive,\n EmbeddedViewRef,\n Injector,\n Input,\n OnChanges,\n SimpleChange,\n SimpleChanges,\n TemplateRef,\n ViewContainerRef,\n} from '@angular/core';\n\n/**\n * @ngModule CommonModule\n *\n * @description\n *\n * Inserts an embedded view from a prepared `TemplateRef`.\n *\n * You can attach a context object to the `EmbeddedViewRef` by setting `[ngTemplateOutletContext]`.\n * `[ngTemplateOutletContext]` should be an object, the object's keys will be available for binding\n * by the local template `let` declarations.\n *\n * @usageNotes\n * ```html\n * \n * ```\n *\n * Using the key `$implicit` in the context object will set its value as default.\n *\n * ### Example\n *\n * {@example common/ngTemplateOutlet/ts/module.ts region='NgTemplateOutlet'}\n *\n * @publicApi\n */\n@Directive({\n selector: '[ngTemplateOutlet]',\n})\nexport class NgTemplateOutlet implements OnChanges {\n private _viewRef: EmbeddedViewRef | null = null;\n\n /**\n * A context object to attach to the {@link EmbeddedViewRef}. This should be an\n * object, the object's keys will be available for binding by the local template `let`\n * declarations.\n * Using the key `$implicit` in the context object will set its value as default.\n */\n @Input() public ngTemplateOutletContext: C | null = null;\n\n /**\n * A string defining the template reference and optionally the context object for the template.\n */\n @Input() public ngTemplateOutlet: TemplateRef | null = null;\n\n /** Injector to be used within the embedded view. */\n @Input() public ngTemplateOutletInjector: Injector | null = null;\n\n constructor(private _viewContainerRef: ViewContainerRef) {}\n\n ngOnChanges(changes: SimpleChanges) {\n if (this._shouldRecreateView(changes)) {\n const viewContainerRef = this._viewContainerRef;\n\n if (this._viewRef) {\n viewContainerRef.remove(viewContainerRef.indexOf(this._viewRef));\n }\n\n // If there is no outlet, clear the destroyed view ref.\n if (!this.ngTemplateOutlet) {\n this._viewRef = null;\n return;\n }\n\n // Create a context forward `Proxy` that will always bind to the user-specified context,\n // without having to destroy and re-create views whenever the context changes.\n const viewContext = this._createContextForwardProxy();\n this._viewRef = viewContainerRef.createEmbeddedView(this.ngTemplateOutlet, viewContext, {\n injector: this.ngTemplateOutletInjector ?? undefined,\n });\n }\n }\n\n /**\n * We need to re-create existing embedded view if either is true:\n * - the outlet changed.\n * - the injector changed.\n */\n private _shouldRecreateView(changes: SimpleChanges): boolean {\n return !!changes['ngTemplateOutlet'] || !!changes['ngTemplateOutletInjector'];\n }\n\n /**\n * For a given outlet instance, we create a proxy object that delegates\n * to the user-specified context. This allows changing, or swapping out\n * the context object completely without having to destroy/re-create the view.\n */\n private _createContextForwardProxy(): C {\n return new Proxy(\n {},\n {\n set: (_target, prop, newValue) => {\n if (!this.ngTemplateOutletContext) {\n return false;\n }\n return Reflect.set(this.ngTemplateOutletContext, prop, newValue);\n },\n get: (_target, prop, receiver) => {\n if (!this.ngTemplateOutletContext) {\n return undefined;\n }\n return Reflect.get(this.ngTemplateOutletContext, prop, receiver);\n },\n },\n );\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Provider} from '@angular/core';\n\nimport {NgClass} from './ng_class';\nimport {NgComponentOutlet} from './ng_component_outlet';\nimport {NgFor, NgForOf, NgForOfContext} from './ng_for_of';\nimport {NgIf, NgIfContext} from './ng_if';\nimport {NgPlural, NgPluralCase} from './ng_plural';\nimport {NgStyle} from './ng_style';\nimport {NgSwitch, NgSwitchCase, NgSwitchDefault} from './ng_switch';\nimport {NgTemplateOutlet} from './ng_template_outlet';\n\nexport {\n NgClass,\n NgComponentOutlet,\n NgFor,\n NgForOf,\n NgForOfContext,\n NgIf,\n NgIfContext,\n NgPlural,\n NgPluralCase,\n NgStyle,\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault,\n NgTemplateOutlet,\n};\n\n/**\n * A collection of Angular directives that are likely to be used in each and every Angular\n * application.\n */\nexport const COMMON_DIRECTIVES: Provider[] = [\n NgClass,\n NgComponentOutlet,\n NgForOf,\n NgIf,\n NgTemplateOutlet,\n NgStyle,\n NgSwitch,\n NgSwitchCase,\n NgSwitchDefault,\n NgPlural,\n NgPluralCase,\n];\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Type, ɵRuntimeError as RuntimeError, ɵstringify as stringify} from '@angular/core';\n\nimport {RuntimeErrorCode} from '../errors';\n\nexport function invalidPipeArgumentError(type: Type, value: Object) {\n return new RuntimeError(\n RuntimeErrorCode.INVALID_PIPE_ARGUMENT,\n ngDevMode && `InvalidPipeArgument: '${value}' for pipe '${stringify(type)}'`,\n );\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n ChangeDetectorRef,\n EventEmitter,\n OnDestroy,\n Pipe,\n PipeTransform,\n untracked,\n ɵisPromise,\n ɵisSubscribable,\n} from '@angular/core';\nimport type {Observable, Subscribable, Unsubscribable} from 'rxjs';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\ninterface SubscriptionStrategy {\n createSubscription(\n async: Subscribable | Promise,\n updateLatestValue: any,\n ): Unsubscribable | Promise;\n dispose(subscription: Unsubscribable | Promise): void;\n}\n\nclass SubscribableStrategy implements SubscriptionStrategy {\n createSubscription(async: Subscribable, updateLatestValue: any): Unsubscribable {\n // Subscription can be side-effectful, and we don't want any signal reads which happen in the\n // side effect of the subscription to be tracked by a component's template when that\n // subscription is triggered via the async pipe. So we wrap the subscription in `untracked` to\n // decouple from the current reactive context.\n //\n // `untracked` also prevents signal _writes_ which happen in the subscription side effect from\n // being treated as signal writes during the template evaluation (which throws errors).\n return untracked(() =>\n async.subscribe({\n next: updateLatestValue,\n error: (e: any) => {\n throw e;\n },\n }),\n );\n }\n\n dispose(subscription: Unsubscribable): void {\n // See the comment in `createSubscription` above on the use of `untracked`.\n untracked(() => subscription.unsubscribe());\n }\n}\n\nclass PromiseStrategy implements SubscriptionStrategy {\n createSubscription(\n async: Promise,\n updateLatestValue: ((v: any) => any) | null,\n ): Unsubscribable {\n // According to the promise specification, promises are not cancellable by default.\n // Once a promise is created, it will either resolve or reject, and it doesn't\n // provide a built-in mechanism to cancel it.\n // There may be situations where a promise is provided, and it either resolves after\n // the pipe has been destroyed or never resolves at all. If the promise never\n // resolves — potentially due to factors beyond our control, such as third-party\n // libraries — this can lead to a memory leak.\n // When we use `async.then(updateLatestValue)`, the engine captures a reference to the\n // `updateLatestValue` function. This allows the promise to invoke that function when it\n // resolves. In this case, the promise directly captures a reference to the\n // `updateLatestValue` function. If the promise resolves later, it retains a reference\n // to the original `updateLatestValue`, meaning that even if the context where\n // `updateLatestValue` was defined has been destroyed, the function reference remains in memory.\n // This can lead to memory leaks if `updateLatestValue` is no longer needed or if it holds\n // onto resources that should be released.\n // When we do `async.then(v => ...)` the promise captures a reference to the lambda\n // function (the arrow function).\n // When we assign `updateLatestValue = null` within the context of an `unsubscribe` function,\n // we're changing the reference of `updateLatestValue` in the current scope to `null`.\n // The lambda will no longer have access to it after the assignment, effectively\n // preventing any further calls to the original function and allowing it to be garbage collected.\n async.then(\n // Using optional chaining because we may have set it to `null`; since the promise\n // is async, the view might be destroyed by the time the promise resolves.\n (v) => updateLatestValue?.(v),\n (e) => {\n throw e;\n },\n );\n return {\n unsubscribe: () => {\n updateLatestValue = null;\n },\n };\n }\n\n dispose(subscription: Unsubscribable): void {\n subscription.unsubscribe();\n }\n}\n\nconst _promiseStrategy = new PromiseStrategy();\nconst _subscribableStrategy = new SubscribableStrategy();\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Unwraps a value from an asynchronous primitive.\n *\n * The `async` pipe subscribes to an `Observable` or `Promise` and returns the latest value it has\n * emitted. When a new value is emitted, the `async` pipe marks the component to be checked for\n * changes. When the component gets destroyed, the `async` pipe unsubscribes automatically to avoid\n * potential memory leaks. When the reference of the expression changes, the `async` pipe\n * automatically unsubscribes from the old `Observable` or `Promise` and subscribes to the new one.\n *\n * @usageNotes\n *\n * ### Examples\n *\n * This example binds a `Promise` to the view. Clicking the `Resolve` button resolves the\n * promise.\n *\n * {@example common/pipes/ts/async_pipe.ts region='AsyncPipePromise'}\n *\n * It's also possible to use `async` with Observables. The example below binds the `time` Observable\n * to the view. The Observable continuously updates the view with the current time.\n *\n * {@example common/pipes/ts/async_pipe.ts region='AsyncPipeObservable'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'async',\n pure: false,\n})\nexport class AsyncPipe implements OnDestroy, PipeTransform {\n private _ref: ChangeDetectorRef | null;\n private _latestValue: any = null;\n private markForCheckOnValueUpdate = true;\n\n private _subscription: Unsubscribable | Promise | null = null;\n private _obj: Subscribable | Promise | EventEmitter | null = null;\n private _strategy: SubscriptionStrategy | null = null;\n\n constructor(ref: ChangeDetectorRef) {\n // Assign `ref` into `this._ref` manually instead of declaring `_ref` in the constructor\n // parameter list, as the type of `this._ref` includes `null` unlike the type of `ref`.\n this._ref = ref;\n }\n\n ngOnDestroy(): void {\n if (this._subscription) {\n this._dispose();\n }\n // Clear the `ChangeDetectorRef` and its association with the view data, to mitigate\n // potential memory leaks in Observables that could otherwise cause the view data to\n // be retained.\n // https://github.com/angular/angular/issues/17624\n this._ref = null;\n }\n\n // NOTE(@benlesh): Because Observable has deprecated a few call patterns for `subscribe`,\n // TypeScript has a hard time matching Observable to Subscribable, for more information\n // see https://github.com/microsoft/TypeScript/issues/43643\n\n transform(obj: Observable | Subscribable | Promise): T | null;\n transform(obj: null | undefined): null;\n transform(obj: Observable | Subscribable | Promise | null | undefined): T | null;\n transform(obj: Observable | Subscribable | Promise | null | undefined): T | null {\n if (!this._obj) {\n if (obj) {\n try {\n // Only call `markForCheck` if the value is updated asynchronously.\n // Synchronous updates _during_ subscription should not wastefully mark for check -\n // this value is already going to be returned from the transform function.\n this.markForCheckOnValueUpdate = false;\n this._subscribe(obj);\n } finally {\n this.markForCheckOnValueUpdate = true;\n }\n }\n return this._latestValue;\n }\n\n if (obj !== this._obj) {\n this._dispose();\n return this.transform(obj);\n }\n\n return this._latestValue;\n }\n\n private _subscribe(obj: Subscribable | Promise | EventEmitter): void {\n this._obj = obj;\n this._strategy = this._selectStrategy(obj);\n this._subscription = this._strategy.createSubscription(obj, (value: Object) =>\n this._updateLatestValue(obj, value),\n );\n }\n\n private _selectStrategy(\n obj: Subscribable | Promise | EventEmitter,\n ): SubscriptionStrategy {\n if (ɵisPromise(obj)) {\n return _promiseStrategy;\n }\n\n if (ɵisSubscribable(obj)) {\n return _subscribableStrategy;\n }\n\n throw invalidPipeArgumentError(AsyncPipe, obj);\n }\n\n private _dispose(): void {\n // Note: `dispose` is only called if a subscription has been initialized before, indicating\n // that `this._strategy` is also available.\n this._strategy!.dispose(this._subscription!);\n this._latestValue = null;\n this._subscription = null;\n this._obj = null;\n }\n\n private _updateLatestValue(async: any, value: Object): void {\n if (async === this._obj) {\n this._latestValue = value;\n if (this.markForCheckOnValueUpdate) {\n this._ref?.markForCheck();\n }\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Pipe, PipeTransform} from '@angular/core';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\n/**\n * Transforms text to all lower case.\n *\n * @see {@link UpperCasePipe}\n * @see {@link TitleCasePipe}\n * @usageNotes\n *\n * The following example defines a view that allows the user to enter\n * text, and then uses the pipe to convert the input text to all lower case.\n *\n * {@example common/pipes/ts/lowerupper_pipe.ts region='LowerUpperPipe'}\n *\n * @ngModule CommonModule\n * @publicApi\n */\n@Pipe({\n name: 'lowercase',\n})\nexport class LowerCasePipe implements PipeTransform {\n /**\n * @param value The string to transform to lower case.\n */\n transform(value: string): string;\n transform(value: null | undefined): null;\n transform(value: string | null | undefined): string | null;\n transform(value: string | null | undefined): string | null {\n if (value == null) return null;\n if (typeof value !== 'string') {\n throw invalidPipeArgumentError(LowerCasePipe, value);\n }\n return value.toLowerCase();\n }\n}\n\n//\n// Regex below matches any Unicode word and number compatible with ES5. In ES2018 the same result\n// can be achieved by using /[0-9\\p{L}]\\S*/gu and also known as Unicode Property Escapes\n// (https://2ality.com/2017/07/regexp-unicode-property-escapes.html). Since there is no\n// transpilation of this functionality down to ES5 without external tool, the only solution is\n// to use already transpiled form. Example can be found here -\n// https://mothereff.in/regexpu#input=var+regex+%3D+%2F%5B0-9%5Cp%7BL%7D%5D%5CS*%2Fgu%3B%0A%0A&unicodePropertyEscape=1\n//\n\nconst unicodeWordMatch =\n /(?:[0-9A-Za-z\\xAA\\xB5\\xBA\\xC0-\\xD6\\xD8-\\xF6\\xF8-\\u02C1\\u02C6-\\u02D1\\u02E0-\\u02E4\\u02EC\\u02EE\\u0370-\\u0374\\u0376\\u0377\\u037A-\\u037D\\u037F\\u0386\\u0388-\\u038A\\u038C\\u038E-\\u03A1\\u03A3-\\u03F5\\u03F7-\\u0481\\u048A-\\u052F\\u0531-\\u0556\\u0559\\u0560-\\u0588\\u05D0-\\u05EA\\u05EF-\\u05F2\\u0620-\\u064A\\u066E\\u066F\\u0671-\\u06D3\\u06D5\\u06E5\\u06E6\\u06EE\\u06EF\\u06FA-\\u06FC\\u06FF\\u0710\\u0712-\\u072F\\u074D-\\u07A5\\u07B1\\u07CA-\\u07EA\\u07F4\\u07F5\\u07FA\\u0800-\\u0815\\u081A\\u0824\\u0828\\u0840-\\u0858\\u0860-\\u086A\\u0870-\\u0887\\u0889-\\u088E\\u08A0-\\u08C9\\u0904-\\u0939\\u093D\\u0950\\u0958-\\u0961\\u0971-\\u0980\\u0985-\\u098C\\u098F\\u0990\\u0993-\\u09A8\\u09AA-\\u09B0\\u09B2\\u09B6-\\u09B9\\u09BD\\u09CE\\u09DC\\u09DD\\u09DF-\\u09E1\\u09F0\\u09F1\\u09FC\\u0A05-\\u0A0A\\u0A0F\\u0A10\\u0A13-\\u0A28\\u0A2A-\\u0A30\\u0A32\\u0A33\\u0A35\\u0A36\\u0A38\\u0A39\\u0A59-\\u0A5C\\u0A5E\\u0A72-\\u0A74\\u0A85-\\u0A8D\\u0A8F-\\u0A91\\u0A93-\\u0AA8\\u0AAA-\\u0AB0\\u0AB2\\u0AB3\\u0AB5-\\u0AB9\\u0ABD\\u0AD0\\u0AE0\\u0AE1\\u0AF9\\u0B05-\\u0B0C\\u0B0F\\u0B10\\u0B13-\\u0B28\\u0B2A-\\u0B30\\u0B32\\u0B33\\u0B35-\\u0B39\\u0B3D\\u0B5C\\u0B5D\\u0B5F-\\u0B61\\u0B71\\u0B83\\u0B85-\\u0B8A\\u0B8E-\\u0B90\\u0B92-\\u0B95\\u0B99\\u0B9A\\u0B9C\\u0B9E\\u0B9F\\u0BA3\\u0BA4\\u0BA8-\\u0BAA\\u0BAE-\\u0BB9\\u0BD0\\u0C05-\\u0C0C\\u0C0E-\\u0C10\\u0C12-\\u0C28\\u0C2A-\\u0C39\\u0C3D\\u0C58-\\u0C5A\\u0C5D\\u0C60\\u0C61\\u0C80\\u0C85-\\u0C8C\\u0C8E-\\u0C90\\u0C92-\\u0CA8\\u0CAA-\\u0CB3\\u0CB5-\\u0CB9\\u0CBD\\u0CDD\\u0CDE\\u0CE0\\u0CE1\\u0CF1\\u0CF2\\u0D04-\\u0D0C\\u0D0E-\\u0D10\\u0D12-\\u0D3A\\u0D3D\\u0D4E\\u0D54-\\u0D56\\u0D5F-\\u0D61\\u0D7A-\\u0D7F\\u0D85-\\u0D96\\u0D9A-\\u0DB1\\u0DB3-\\u0DBB\\u0DBD\\u0DC0-\\u0DC6\\u0E01-\\u0E30\\u0E32\\u0E33\\u0E40-\\u0E46\\u0E81\\u0E82\\u0E84\\u0E86-\\u0E8A\\u0E8C-\\u0EA3\\u0EA5\\u0EA7-\\u0EB0\\u0EB2\\u0EB3\\u0EBD\\u0EC0-\\u0EC4\\u0EC6\\u0EDC-\\u0EDF\\u0F00\\u0F40-\\u0F47\\u0F49-\\u0F6C\\u0F88-\\u0F8C\\u1000-\\u102A\\u103F\\u1050-\\u1055\\u105A-\\u105D\\u1061\\u1065\\u1066\\u106E-\\u1070\\u1075-\\u1081\\u108E\\u10A0-\\u10C5\\u10C7\\u10CD\\u10D0-\\u10FA\\u10FC-\\u1248\\u124A-\\u124D\\u1250-\\u1256\\u1258\\u125A-\\u125D\\u1260-\\u1288\\u128A-\\u128D\\u1290-\\u12B0\\u12B2-\\u12B5\\u12B8-\\u12BE\\u12C0\\u12C2-\\u12C5\\u12C8-\\u12D6\\u12D8-\\u1310\\u1312-\\u1315\\u1318-\\u135A\\u1380-\\u138F\\u13A0-\\u13F5\\u13F8-\\u13FD\\u1401-\\u166C\\u166F-\\u167F\\u1681-\\u169A\\u16A0-\\u16EA\\u16F1-\\u16F8\\u1700-\\u1711\\u171F-\\u1731\\u1740-\\u1751\\u1760-\\u176C\\u176E-\\u1770\\u1780-\\u17B3\\u17D7\\u17DC\\u1820-\\u1878\\u1880-\\u1884\\u1887-\\u18A8\\u18AA\\u18B0-\\u18F5\\u1900-\\u191E\\u1950-\\u196D\\u1970-\\u1974\\u1980-\\u19AB\\u19B0-\\u19C9\\u1A00-\\u1A16\\u1A20-\\u1A54\\u1AA7\\u1B05-\\u1B33\\u1B45-\\u1B4C\\u1B83-\\u1BA0\\u1BAE\\u1BAF\\u1BBA-\\u1BE5\\u1C00-\\u1C23\\u1C4D-\\u1C4F\\u1C5A-\\u1C7D\\u1C80-\\u1C88\\u1C90-\\u1CBA\\u1CBD-\\u1CBF\\u1CE9-\\u1CEC\\u1CEE-\\u1CF3\\u1CF5\\u1CF6\\u1CFA\\u1D00-\\u1DBF\\u1E00-\\u1F15\\u1F18-\\u1F1D\\u1F20-\\u1F45\\u1F48-\\u1F4D\\u1F50-\\u1F57\\u1F59\\u1F5B\\u1F5D\\u1F5F-\\u1F7D\\u1F80-\\u1FB4\\u1FB6-\\u1FBC\\u1FBE\\u1FC2-\\u1FC4\\u1FC6-\\u1FCC\\u1FD0-\\u1FD3\\u1FD6-\\u1FDB\\u1FE0-\\u1FEC\\u1FF2-\\u1FF4\\u1FF6-\\u1FFC\\u2071\\u207F\\u2090-\\u209C\\u2102\\u2107\\u210A-\\u2113\\u2115\\u2119-\\u211D\\u2124\\u2126\\u2128\\u212A-\\u212D\\u212F-\\u2139\\u213C-\\u213F\\u2145-\\u2149\\u214E\\u2183\\u2184\\u2C00-\\u2CE4\\u2CEB-\\u2CEE\\u2CF2\\u2CF3\\u2D00-\\u2D25\\u2D27\\u2D2D\\u2D30-\\u2D67\\u2D6F\\u2D80-\\u2D96\\u2DA0-\\u2DA6\\u2DA8-\\u2DAE\\u2DB0-\\u2DB6\\u2DB8-\\u2DBE\\u2DC0-\\u2DC6\\u2DC8-\\u2DCE\\u2DD0-\\u2DD6\\u2DD8-\\u2DDE\\u2E2F\\u3005\\u3006\\u3031-\\u3035\\u303B\\u303C\\u3041-\\u3096\\u309D-\\u309F\\u30A1-\\u30FA\\u30FC-\\u30FF\\u3105-\\u312F\\u3131-\\u318E\\u31A0-\\u31BF\\u31F0-\\u31FF\\u3400-\\u4DBF\\u4E00-\\uA48C\\uA4D0-\\uA4FD\\uA500-\\uA60C\\uA610-\\uA61F\\uA62A\\uA62B\\uA640-\\uA66E\\uA67F-\\uA69D\\uA6A0-\\uA6E5\\uA717-\\uA71F\\uA722-\\uA788\\uA78B-\\uA7CA\\uA7D0\\uA7D1\\uA7D3\\uA7D5-\\uA7D9\\uA7F2-\\uA801\\uA803-\\uA805\\uA807-\\uA80A\\uA80C-\\uA822\\uA840-\\uA873\\uA882-\\uA8B3\\uA8F2-\\uA8F7\\uA8FB\\uA8FD\\uA8FE\\uA90A-\\uA925\\uA930-\\uA946\\uA960-\\uA97C\\uA984-\\uA9B2\\uA9CF\\uA9E0-\\uA9E4\\uA9E6-\\uA9EF\\uA9FA-\\uA9FE\\uAA00-\\uAA28\\uAA40-\\uAA42\\uAA44-\\uAA4B\\uAA60-\\uAA76\\uAA7A\\uAA7E-\\uAAAF\\uAAB1\\uAAB5\\uAAB6\\uAAB9-\\uAABD\\uAAC0\\uAAC2\\uAADB-\\uAADD\\uAAE0-\\uAAEA\\uAAF2-\\uAAF4\\uAB01-\\uAB06\\uAB09-\\uAB0E\\uAB11-\\uAB16\\uAB20-\\uAB26\\uAB28-\\uAB2E\\uAB30-\\uAB5A\\uAB5C-\\uAB69\\uAB70-\\uABE2\\uAC00-\\uD7A3\\uD7B0-\\uD7C6\\uD7CB-\\uD7FB\\uF900-\\uFA6D\\uFA70-\\uFAD9\\uFB00-\\uFB06\\uFB13-\\uFB17\\uFB1D\\uFB1F-\\uFB28\\uFB2A-\\uFB36\\uFB38-\\uFB3C\\uFB3E\\uFB40\\uFB41\\uFB43\\uFB44\\uFB46-\\uFBB1\\uFBD3-\\uFD3D\\uFD50-\\uFD8F\\uFD92-\\uFDC7\\uFDF0-\\uFDFB\\uFE70-\\uFE74\\uFE76-\\uFEFC\\uFF21-\\uFF3A\\uFF41-\\uFF5A\\uFF66-\\uFFBE\\uFFC2-\\uFFC7\\uFFCA-\\uFFCF\\uFFD2-\\uFFD7\\uFFDA-\\uFFDC]|\\uD800[\\uDC00-\\uDC0B\\uDC0D-\\uDC26\\uDC28-\\uDC3A\\uDC3C\\uDC3D\\uDC3F-\\uDC4D\\uDC50-\\uDC5D\\uDC80-\\uDCFA\\uDE80-\\uDE9C\\uDEA0-\\uDED0\\uDF00-\\uDF1F\\uDF2D-\\uDF40\\uDF42-\\uDF49\\uDF50-\\uDF75\\uDF80-\\uDF9D\\uDFA0-\\uDFC3\\uDFC8-\\uDFCF]|\\uD801[\\uDC00-\\uDC9D\\uDCB0-\\uDCD3\\uDCD8-\\uDCFB\\uDD00-\\uDD27\\uDD30-\\uDD63\\uDD70-\\uDD7A\\uDD7C-\\uDD8A\\uDD8C-\\uDD92\\uDD94\\uDD95\\uDD97-\\uDDA1\\uDDA3-\\uDDB1\\uDDB3-\\uDDB9\\uDDBB\\uDDBC\\uDE00-\\uDF36\\uDF40-\\uDF55\\uDF60-\\uDF67\\uDF80-\\uDF85\\uDF87-\\uDFB0\\uDFB2-\\uDFBA]|\\uD802[\\uDC00-\\uDC05\\uDC08\\uDC0A-\\uDC35\\uDC37\\uDC38\\uDC3C\\uDC3F-\\uDC55\\uDC60-\\uDC76\\uDC80-\\uDC9E\\uDCE0-\\uDCF2\\uDCF4\\uDCF5\\uDD00-\\uDD15\\uDD20-\\uDD39\\uDD80-\\uDDB7\\uDDBE\\uDDBF\\uDE00\\uDE10-\\uDE13\\uDE15-\\uDE17\\uDE19-\\uDE35\\uDE60-\\uDE7C\\uDE80-\\uDE9C\\uDEC0-\\uDEC7\\uDEC9-\\uDEE4\\uDF00-\\uDF35\\uDF40-\\uDF55\\uDF60-\\uDF72\\uDF80-\\uDF91]|\\uD803[\\uDC00-\\uDC48\\uDC80-\\uDCB2\\uDCC0-\\uDCF2\\uDD00-\\uDD23\\uDE80-\\uDEA9\\uDEB0\\uDEB1\\uDF00-\\uDF1C\\uDF27\\uDF30-\\uDF45\\uDF70-\\uDF81\\uDFB0-\\uDFC4\\uDFE0-\\uDFF6]|\\uD804[\\uDC03-\\uDC37\\uDC71\\uDC72\\uDC75\\uDC83-\\uDCAF\\uDCD0-\\uDCE8\\uDD03-\\uDD26\\uDD44\\uDD47\\uDD50-\\uDD72\\uDD76\\uDD83-\\uDDB2\\uDDC1-\\uDDC4\\uDDDA\\uDDDC\\uDE00-\\uDE11\\uDE13-\\uDE2B\\uDE80-\\uDE86\\uDE88\\uDE8A-\\uDE8D\\uDE8F-\\uDE9D\\uDE9F-\\uDEA8\\uDEB0-\\uDEDE\\uDF05-\\uDF0C\\uDF0F\\uDF10\\uDF13-\\uDF28\\uDF2A-\\uDF30\\uDF32\\uDF33\\uDF35-\\uDF39\\uDF3D\\uDF50\\uDF5D-\\uDF61]|\\uD805[\\uDC00-\\uDC34\\uDC47-\\uDC4A\\uDC5F-\\uDC61\\uDC80-\\uDCAF\\uDCC4\\uDCC5\\uDCC7\\uDD80-\\uDDAE\\uDDD8-\\uDDDB\\uDE00-\\uDE2F\\uDE44\\uDE80-\\uDEAA\\uDEB8\\uDF00-\\uDF1A\\uDF40-\\uDF46]|\\uD806[\\uDC00-\\uDC2B\\uDCA0-\\uDCDF\\uDCFF-\\uDD06\\uDD09\\uDD0C-\\uDD13\\uDD15\\uDD16\\uDD18-\\uDD2F\\uDD3F\\uDD41\\uDDA0-\\uDDA7\\uDDAA-\\uDDD0\\uDDE1\\uDDE3\\uDE00\\uDE0B-\\uDE32\\uDE3A\\uDE50\\uDE5C-\\uDE89\\uDE9D\\uDEB0-\\uDEF8]|\\uD807[\\uDC00-\\uDC08\\uDC0A-\\uDC2E\\uDC40\\uDC72-\\uDC8F\\uDD00-\\uDD06\\uDD08\\uDD09\\uDD0B-\\uDD30\\uDD46\\uDD60-\\uDD65\\uDD67\\uDD68\\uDD6A-\\uDD89\\uDD98\\uDEE0-\\uDEF2\\uDFB0]|\\uD808[\\uDC00-\\uDF99]|\\uD809[\\uDC80-\\uDD43]|\\uD80B[\\uDF90-\\uDFF0]|[\\uD80C\\uD81C-\\uD820\\uD822\\uD840-\\uD868\\uD86A-\\uD86C\\uD86F-\\uD872\\uD874-\\uD879\\uD880-\\uD883][\\uDC00-\\uDFFF]|\\uD80D[\\uDC00-\\uDC2E]|\\uD811[\\uDC00-\\uDE46]|\\uD81A[\\uDC00-\\uDE38\\uDE40-\\uDE5E\\uDE70-\\uDEBE\\uDED0-\\uDEED\\uDF00-\\uDF2F\\uDF40-\\uDF43\\uDF63-\\uDF77\\uDF7D-\\uDF8F]|\\uD81B[\\uDE40-\\uDE7F\\uDF00-\\uDF4A\\uDF50\\uDF93-\\uDF9F\\uDFE0\\uDFE1\\uDFE3]|\\uD821[\\uDC00-\\uDFF7]|\\uD823[\\uDC00-\\uDCD5\\uDD00-\\uDD08]|\\uD82B[\\uDFF0-\\uDFF3\\uDFF5-\\uDFFB\\uDFFD\\uDFFE]|\\uD82C[\\uDC00-\\uDD22\\uDD50-\\uDD52\\uDD64-\\uDD67\\uDD70-\\uDEFB]|\\uD82F[\\uDC00-\\uDC6A\\uDC70-\\uDC7C\\uDC80-\\uDC88\\uDC90-\\uDC99]|\\uD835[\\uDC00-\\uDC54\\uDC56-\\uDC9C\\uDC9E\\uDC9F\\uDCA2\\uDCA5\\uDCA6\\uDCA9-\\uDCAC\\uDCAE-\\uDCB9\\uDCBB\\uDCBD-\\uDCC3\\uDCC5-\\uDD05\\uDD07-\\uDD0A\\uDD0D-\\uDD14\\uDD16-\\uDD1C\\uDD1E-\\uDD39\\uDD3B-\\uDD3E\\uDD40-\\uDD44\\uDD46\\uDD4A-\\uDD50\\uDD52-\\uDEA5\\uDEA8-\\uDEC0\\uDEC2-\\uDEDA\\uDEDC-\\uDEFA\\uDEFC-\\uDF14\\uDF16-\\uDF34\\uDF36-\\uDF4E\\uDF50-\\uDF6E\\uDF70-\\uDF88\\uDF8A-\\uDFA8\\uDFAA-\\uDFC2\\uDFC4-\\uDFCB]|\\uD837[\\uDF00-\\uDF1E]|\\uD838[\\uDD00-\\uDD2C\\uDD37-\\uDD3D\\uDD4E\\uDE90-\\uDEAD\\uDEC0-\\uDEEB]|\\uD839[\\uDFE0-\\uDFE6\\uDFE8-\\uDFEB\\uDFED\\uDFEE\\uDFF0-\\uDFFE]|\\uD83A[\\uDC00-\\uDCC4\\uDD00-\\uDD43\\uDD4B]|\\uD83B[\\uDE00-\\uDE03\\uDE05-\\uDE1F\\uDE21\\uDE22\\uDE24\\uDE27\\uDE29-\\uDE32\\uDE34-\\uDE37\\uDE39\\uDE3B\\uDE42\\uDE47\\uDE49\\uDE4B\\uDE4D-\\uDE4F\\uDE51\\uDE52\\uDE54\\uDE57\\uDE59\\uDE5B\\uDE5D\\uDE5F\\uDE61\\uDE62\\uDE64\\uDE67-\\uDE6A\\uDE6C-\\uDE72\\uDE74-\\uDE77\\uDE79-\\uDE7C\\uDE7E\\uDE80-\\uDE89\\uDE8B-\\uDE9B\\uDEA1-\\uDEA3\\uDEA5-\\uDEA9\\uDEAB-\\uDEBB]|\\uD869[\\uDC00-\\uDEDF\\uDF00-\\uDFFF]|\\uD86D[\\uDC00-\\uDF38\\uDF40-\\uDFFF]|\\uD86E[\\uDC00-\\uDC1D\\uDC20-\\uDFFF]|\\uD873[\\uDC00-\\uDEA1\\uDEB0-\\uDFFF]|\\uD87A[\\uDC00-\\uDFE0]|\\uD87E[\\uDC00-\\uDE1D]|\\uD884[\\uDC00-\\uDF4A])\\S*/g;\n\n/**\n * Transforms text to title case.\n * Capitalizes the first letter of each word and transforms the\n * rest of the word to lower case.\n * Words are delimited by any whitespace character, such as a space, tab, or line-feed character.\n *\n * @see {@link LowerCasePipe}\n * @see {@link UpperCasePipe}\n *\n * @usageNotes\n * The following example shows the result of transforming various strings into title case.\n *\n * {@example common/pipes/ts/titlecase_pipe.ts region='TitleCasePipe'}\n *\n * @ngModule CommonModule\n * @publicApi\n */\n@Pipe({\n name: 'titlecase',\n})\nexport class TitleCasePipe implements PipeTransform {\n /**\n * @param value The string to transform to title case.\n */\n transform(value: string): string;\n transform(value: null | undefined): null;\n transform(value: string | null | undefined): string | null;\n transform(value: string | null | undefined): string | null {\n if (value == null) return null;\n if (typeof value !== 'string') {\n throw invalidPipeArgumentError(TitleCasePipe, value);\n }\n\n return value.replace(\n unicodeWordMatch,\n (txt) => txt[0].toUpperCase() + txt.slice(1).toLowerCase(),\n );\n }\n}\n\n/**\n * Transforms text to all upper case.\n * @see {@link LowerCasePipe}\n * @see {@link TitleCasePipe}\n *\n * @ngModule CommonModule\n * @publicApi\n */\n@Pipe({\n name: 'uppercase',\n})\nexport class UpperCasePipe implements PipeTransform {\n /**\n * @param value The string to transform to upper case.\n */\n transform(value: string): string;\n transform(value: null | undefined): null;\n transform(value: string | null | undefined): string | null;\n transform(value: string | null | undefined): string | null {\n if (value == null) return null;\n if (typeof value !== 'string') {\n throw invalidPipeArgumentError(UpperCasePipe, value);\n }\n return value.toUpperCase();\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n/**\n * An interface that describes the date pipe configuration, which can be provided using the\n * `DATE_PIPE_DEFAULT_OPTIONS` token.\n *\n * @see {@link DATE_PIPE_DEFAULT_OPTIONS}\n *\n * @publicApi\n */\nexport interface DatePipeConfig {\n dateFormat?: string;\n timezone?: string;\n}\n\n/**\n * The default date format of Angular date pipe, which corresponds to the following format:\n * `'MMM d,y'` (e.g. `Jun 15, 2015`)\n */\nexport const DEFAULT_DATE_FORMAT = 'mediumDate';\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Inject, InjectionToken, LOCALE_ID, Optional, Pipe, PipeTransform} from '@angular/core';\n\nimport {formatDate} from '../i18n/format_date';\n\nimport {DatePipeConfig, DEFAULT_DATE_FORMAT} from './date_pipe_config';\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\n/**\n * Optionally-provided default timezone to use for all instances of `DatePipe` (such as `'+0430'`).\n * If the value isn't provided, the `DatePipe` will use the end-user's local system timezone.\n *\n * @deprecated use DATE_PIPE_DEFAULT_OPTIONS token to configure DatePipe\n */\nexport const DATE_PIPE_DEFAULT_TIMEZONE = new InjectionToken(\n ngDevMode ? 'DATE_PIPE_DEFAULT_TIMEZONE' : '',\n);\n\n/**\n * DI token that allows to provide default configuration for the `DatePipe` instances in an\n * application. The value is an object which can include the following fields:\n * - `dateFormat`: configures the default date format. If not provided, the `DatePipe`\n * will use the 'mediumDate' as a value.\n * - `timezone`: configures the default timezone. If not provided, the `DatePipe` will\n * use the end-user's local system timezone.\n *\n * @see {@link DatePipeConfig}\n *\n * @usageNotes\n *\n * Various date pipe default values can be overwritten by providing this token with\n * the value that has this interface.\n *\n * For example:\n *\n * Override the default date format by providing a value using the token:\n * ```ts\n * providers: [\n * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {dateFormat: 'shortDate'}}\n * ]\n * ```\n *\n * Override the default timezone by providing a value using the token:\n * ```ts\n * providers: [\n * {provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: {timezone: '-1200'}}\n * ]\n * ```\n */\nexport const DATE_PIPE_DEFAULT_OPTIONS = new InjectionToken(\n ngDevMode ? 'DATE_PIPE_DEFAULT_OPTIONS' : '',\n);\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a date value according to locale rules.\n *\n * `DatePipe` is executed only when it detects a pure change to the input value.\n * A pure change is either a change to a primitive input value\n * (such as `String`, `Number`, `Boolean`, or `Symbol`),\n * or a changed object reference (such as `Date`, `Array`, `Function`, or `Object`).\n *\n * Note that mutating a `Date` object does not cause the pipe to be rendered again.\n * To ensure that the pipe is executed, you must create a new `Date` object.\n *\n * Only the `en-US` locale data comes with Angular. To localize dates\n * in another language, you must import the corresponding locale data.\n * See the [I18n guide](guide/i18n/format-data-locale) for more information.\n *\n * The time zone of the formatted value can be specified either by passing it in as the second\n * parameter of the pipe, or by setting the default through the `DATE_PIPE_DEFAULT_OPTIONS`\n * injection token. The value that is passed in as the second parameter takes precedence over\n * the one defined using the injection token.\n *\n * @see {@link formatDate}\n *\n *\n * @usageNotes\n *\n * The result of this pipe is not reevaluated when the input is mutated. To avoid the need to\n * reformat the date on every change-detection cycle, treat the date as an immutable object\n * and change the reference when the pipe needs to run again.\n *\n * ### Pre-defined format options\n *\n * | Option | Equivalent to | Examples (given in `en-US` locale) |\n * |---------------|-------------------------------------|-------------------------------------------------|\n * | `'short'` | `'M/d/yy, h:mm a'` | `6/15/15, 9:03 AM` |\n * | `'medium'` | `'MMM d, y, h:mm:ss a'` | `Jun 15, 2015, 9:03:01 AM` |\n * | `'long'` | `'MMMM d, y, h:mm:ss a z'` | `June 15, 2015 at 9:03:01 AM GMT+1` |\n * | `'full'` | `'EEEE, MMMM d, y, h:mm:ss a zzzz'` | `Monday, June 15, 2015 at 9:03:01 AM GMT+01:00` |\n * | `'shortDate'` | `'M/d/yy'` | `6/15/15` |\n * | `'mediumDate'`| `'MMM d, y'` | `Jun 15, 2015` |\n * | `'longDate'` | `'MMMM d, y'` | `June 15, 2015` |\n * | `'fullDate'` | `'EEEE, MMMM d, y'` | `Monday, June 15, 2015` |\n * | `'shortTime'` | `'h:mm a'` | `9:03 AM` |\n * | `'mediumTime'`| `'h:mm:ss a'` | `9:03:01 AM` |\n * | `'longTime'` | `'h:mm:ss a z'` | `9:03:01 AM GMT+1` |\n * | `'fullTime'` | `'h:mm:ss a zzzz'` | `9:03:01 AM GMT+01:00` |\n *\n * ### Custom format options\n *\n * You can construct a format string using symbols to specify the components\n * of a date-time value, as described in the following table.\n * Format details depend on the locale.\n * Fields marked with (*) are only available in the extra data set for the given locale.\n *\n * | Field type | Format | Description | Example Value |\n * |-------------------------|-------------|---------------------------------------------------------------|------------------------------------------------------------|\n * | Era | G, GG & GGG | Abbreviated | AD |\n * | | GGGG | Wide | Anno Domini |\n * | | GGGGG | Narrow | A |\n * | Year | y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 |\n * | | yy | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 |\n * | | yyy | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 |\n * | | yyyy | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 |\n * | ISO Week-numbering year | Y | Numeric: minimum digits | 2, 20, 201, 2017, 20173 |\n * | | YY | Numeric: 2 digits + zero padded | 02, 20, 01, 17, 73 |\n * | | YYY | Numeric: 3 digits + zero padded | 002, 020, 201, 2017, 20173 |\n * | | YYYY | Numeric: 4 digits or more + zero padded | 0002, 0020, 0201, 2017, 20173 |\n * | Month | M | Numeric: 1 digit | 9, 12 |\n * | | MM | Numeric: 2 digits + zero padded | 09, 12 |\n * | | MMM | Abbreviated | Sep |\n * | | MMMM | Wide | September |\n * | | MMMMM | Narrow | S |\n * | Month standalone | L | Numeric: 1 digit | 9, 12 |\n * | | LL | Numeric: 2 digits + zero padded | 09, 12 |\n * | | LLL | Abbreviated | Sep |\n * | | LLLL | Wide | September |\n * | | LLLLL | Narrow | S |\n * | ISO Week of year | w | Numeric: minimum digits | 1... 53 |\n * | | ww | Numeric: 2 digits + zero padded | 01... 53 |\n * | Week of month | W | Numeric: 1 digit | 1... 5 |\n * | Day of month | d | Numeric: minimum digits | 1 |\n * | | dd | Numeric: 2 digits + zero padded | 01 |\n * | Week day | E, EE & EEE | Abbreviated | Tue |\n * | | EEEE | Wide | Tuesday |\n * | | EEEEE | Narrow | T |\n * | | EEEEEE | Short | Tu |\n * | Week day standalone | c, cc | Numeric: 1 digit | 2 |\n * | | ccc | Abbreviated | Tue |\n * | | cccc | Wide | Tuesday |\n * | | ccccc | Narrow | T |\n * | | cccccc | Short | Tu |\n * | Period | a, aa & aaa | Abbreviated | am/pm or AM/PM |\n * | | aaaa | Wide (fallback to `a` when missing) | ante meridiem/post meridiem |\n * | | aaaaa | Narrow | a/p |\n * | Period* | B, BB & BBB | Abbreviated | mid. |\n * | | BBBB | Wide | am, pm, midnight, noon, morning, afternoon, evening, night |\n * | | BBBBB | Narrow | md |\n * | Period standalone* | b, bb & bbb | Abbreviated | mid. |\n * | | bbbb | Wide | am, pm, midnight, noon, morning, afternoon, evening, night |\n * | | bbbbb | Narrow | md |\n * | Hour 1-12 | h | Numeric: minimum digits | 1, 12 |\n * | | hh | Numeric: 2 digits + zero padded | 01, 12 |\n * | Hour 0-23 | H | Numeric: minimum digits | 0, 23 |\n * | | HH | Numeric: 2 digits + zero padded | 00, 23 |\n * | Minute | m | Numeric: minimum digits | 8, 59 |\n * | | mm | Numeric: 2 digits + zero padded | 08, 59 |\n * | Second | s | Numeric: minimum digits | 0... 59 |\n * | | ss | Numeric: 2 digits + zero padded | 00... 59 |\n * | Fractional seconds | S | Numeric: 1 digit | 0... 9 |\n * | | SS | Numeric: 2 digits + zero padded | 00... 99 |\n * | | SSS | Numeric: 3 digits + zero padded (= milliseconds) | 000... 999 |\n * | Zone | z, zz & zzz | Short specific non location format (fallback to O) | GMT-8 |\n * | | zzzz | Long specific non location format (fallback to OOOO) | GMT-08:00 |\n * | | Z, ZZ & ZZZ | ISO8601 basic format | -0800 |\n * | | ZZZZ | Long localized GMT format | GMT-8:00 |\n * | | ZZZZZ | ISO8601 extended format + Z indicator for offset 0 (= XXXXX) | -08:00 |\n * | | O, OO & OOO | Short localized GMT format | GMT-8 |\n * | | OOOO | Long localized GMT format | GMT-08:00 |\n *\n *\n * ### Format examples\n *\n * These examples transform a date into various formats,\n * assuming that `dateObj` is a JavaScript `Date` object for\n * year: 2015, month: 6, day: 15, hour: 21, minute: 43, second: 11,\n * given in the local time for the `en-US` locale.\n *\n * ```\n * {{ dateObj | date }} // output is 'Jun 15, 2015'\n * {{ dateObj | date:'medium' }} // output is 'Jun 15, 2015, 9:43:11 PM'\n * {{ dateObj | date:'shortTime' }} // output is '9:43 PM'\n * {{ dateObj | date:'mm:ss' }} // output is '43:11'\n * {{ dateObj | date:\"MMM dd, yyyy 'at' hh:mm a\" }} // output is 'Jun 15, 2015 at 09:43 PM'\n * ```\n *\n * ### Usage example\n *\n * The following component uses a date pipe to display the current date in different formats.\n *\n * ```angular-ts\n * @Component({\n * selector: 'date-pipe',\n * template: `
    \n *

    Today is {{today | date}}

    \n *

    Or if you prefer, {{today | date:'fullDate'}}

    \n *

    The time is {{today | date:'h:mm a z'}}

    \n *
    `\n * })\n * // Get the current date and time as a date-time value.\n * export class DatePipeComponent {\n * today: number = Date.now();\n * }\n * ```\n *\n * @publicApi\n */\n@Pipe({\n name: 'date',\n})\nexport class DatePipe implements PipeTransform {\n constructor(\n @Inject(LOCALE_ID) private locale: string,\n @Inject(DATE_PIPE_DEFAULT_TIMEZONE) @Optional() private defaultTimezone?: string | null,\n @Inject(DATE_PIPE_DEFAULT_OPTIONS) @Optional() private defaultOptions?: DatePipeConfig | null,\n ) {}\n\n /**\n * @param value The date expression: a `Date` object, a number\n * (milliseconds since UTC epoch), or an ISO string (https://www.w3.org/TR/NOTE-datetime).\n * @param format The date/time components to include, using predefined options or a\n * custom format string. When not provided, the `DatePipe` looks for the value using the\n * `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads the `dateFormat` property).\n * If the token is not configured, the `mediumDate` is used as a value.\n * @param timezone A timezone offset (such as `'+0430'`). When not provided, the `DatePipe`\n * looks for the value using the `DATE_PIPE_DEFAULT_OPTIONS` injection token (and reads\n * the `timezone` property). If the token is not configured, the end-user's local system\n * timezone is used as a value.\n * @param locale A locale code for the locale format rules to use.\n * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default.\n * See [Setting your app locale](guide/i18n/locale-id).\n *\n * @see {@link DATE_PIPE_DEFAULT_OPTIONS}\n *\n * @returns A date string in the desired format.\n */\n transform(\n value: Date | string | number,\n format?: string,\n timezone?: string,\n locale?: string,\n ): string | null;\n transform(value: null | undefined, format?: string, timezone?: string, locale?: string): null;\n transform(\n value: Date | string | number | null | undefined,\n format?: string,\n timezone?: string,\n locale?: string,\n ): string | null;\n transform(\n value: Date | string | number | null | undefined,\n format?: string,\n timezone?: string,\n locale?: string,\n ): string | null {\n if (value == null || value === '' || value !== value) return null;\n\n try {\n const _format = format ?? this.defaultOptions?.dateFormat ?? DEFAULT_DATE_FORMAT;\n const _timezone =\n timezone ?? this.defaultOptions?.timezone ?? this.defaultTimezone ?? undefined;\n return formatDate(value, _format, locale || this.locale, _timezone);\n } catch (error) {\n throw invalidPipeArgumentError(DatePipe, (error as Error).message);\n }\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Pipe, PipeTransform} from '@angular/core';\n\nimport {getPluralCategory, NgLocalization} from '../i18n/localization';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\nconst _INTERPOLATION_REGEXP: RegExp = /#/g;\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Maps a value to a string that pluralizes the value according to locale rules.\n *\n * @usageNotes\n *\n * ### Example\n *\n * {@example common/pipes/ts/i18n_pipe.ts region='I18nPluralPipeComponent'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'i18nPlural',\n})\nexport class I18nPluralPipe implements PipeTransform {\n constructor(private _localization: NgLocalization) {}\n\n /**\n * @param value the number to be formatted\n * @param pluralMap an object that mimics the ICU format, see\n * https://unicode-org.github.io/icu/userguide/format_parse/messages/.\n * @param locale a `string` defining the locale to use (uses the current {@link LOCALE_ID} by\n * default).\n */\n transform(\n value: number | null | undefined,\n pluralMap: {[count: string]: string},\n locale?: string,\n ): string {\n if (value == null) return '';\n\n if (typeof pluralMap !== 'object' || pluralMap === null) {\n throw invalidPipeArgumentError(I18nPluralPipe, pluralMap);\n }\n\n const key = getPluralCategory(value, Object.keys(pluralMap), this._localization, locale);\n\n return pluralMap[key].replace(_INTERPOLATION_REGEXP, value.toString());\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Pipe, PipeTransform} from '@angular/core';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Generic selector that displays the string that matches the current value.\n *\n * If none of the keys of the `mapping` match the `value`, then the content\n * of the `other` key is returned when present, otherwise an empty string is returned.\n *\n * @usageNotes\n *\n * ### Example\n *\n * {@example common/pipes/ts/i18n_pipe.ts region='I18nSelectPipeComponent'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'i18nSelect',\n})\nexport class I18nSelectPipe implements PipeTransform {\n /**\n * @param value a string to be internationalized.\n * @param mapping an object that indicates the text that should be displayed\n * for different values of the provided `value`.\n */\n transform(value: string | null | undefined, mapping: {[key: string]: string}): string {\n if (value == null) return '';\n\n if (typeof mapping !== 'object' || typeof value !== 'string') {\n throw invalidPipeArgumentError(I18nSelectPipe, mapping);\n }\n\n if (mapping.hasOwnProperty(value)) {\n return mapping[value];\n }\n\n if (mapping.hasOwnProperty('other')) {\n return mapping['other'];\n }\n\n return '';\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Pipe, PipeTransform} from '@angular/core';\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Converts a value into its JSON-format representation. Useful for debugging.\n *\n * @usageNotes\n *\n * The following component uses a JSON pipe to convert an object\n * to JSON format, and displays the string in both formats for comparison.\n *\n * {@example common/pipes/ts/json_pipe.ts region='JsonPipe'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'json',\n pure: false,\n})\nexport class JsonPipe implements PipeTransform {\n /**\n * @param value A value of any type to convert into a JSON-format string.\n */\n transform(value: any): string {\n return JSON.stringify(value, null, 2);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n KeyValueChangeRecord,\n KeyValueChanges,\n KeyValueDiffer,\n KeyValueDiffers,\n Pipe,\n PipeTransform,\n} from '@angular/core';\n\nfunction makeKeyValuePair(key: K, value: V): KeyValue {\n return {key: key, value: value};\n}\n\n/**\n * A key value pair.\n * Usually used to represent the key value pairs from a Map or Object.\n *\n * @publicApi\n */\nexport interface KeyValue {\n key: K;\n value: V;\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Transforms Object or Map into an array of key value pairs.\n *\n * The output array will be ordered by keys.\n * By default the comparator will be by Unicode point value.\n * You can optionally pass a compareFn if your keys are complex types.\n * Passing `null` as the compareFn will use natural ordering of the input.\n *\n * @usageNotes\n * ### Examples\n *\n * This examples show how an Object or a Map can be iterated by ngFor with the use of this\n * keyvalue pipe.\n *\n * {@example common/pipes/ts/keyvalue_pipe.ts region='KeyValuePipe'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'keyvalue',\n pure: false,\n})\nexport class KeyValuePipe implements PipeTransform {\n constructor(private readonly differs: KeyValueDiffers) {}\n\n private differ!: KeyValueDiffer;\n private keyValues: Array> = [];\n private compareFn: ((a: KeyValue, b: KeyValue) => number) | null =\n defaultComparator;\n\n /*\n * NOTE: when the `input` value is a simple Record object, the keys are extracted with\n * Object.keys(). This means that even if the `input` type is Record the keys are\n * compared/returned as `string`s.\n */\n transform(\n input: ReadonlyMap,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array>;\n transform(\n input: Record,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array>;\n transform(\n input: Record | ReadonlyMap,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array>;\n transform(\n input: null | undefined,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): null;\n transform(\n input: ReadonlyMap | null | undefined,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array> | null;\n transform(\n input: Record | null | undefined,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array> | null;\n transform(\n input: Record | ReadonlyMap | null | undefined,\n compareFn?: ((a: KeyValue, b: KeyValue) => number) | null,\n ): Array> | null;\n transform(\n input: undefined | null | {[key: string]: V; [key: number]: V} | ReadonlyMap,\n compareFn: ((a: KeyValue, b: KeyValue) => number) | null = defaultComparator,\n ): Array> | null {\n if (!input || (!(input instanceof Map) && typeof input !== 'object')) {\n return null;\n }\n\n // make a differ for whatever type we've been passed in\n this.differ ??= this.differs.find(input).create();\n\n const differChanges: KeyValueChanges | null = this.differ.diff(input as any);\n const compareFnChanged = compareFn !== this.compareFn;\n\n if (differChanges) {\n this.keyValues = [];\n differChanges.forEachItem((r: KeyValueChangeRecord) => {\n this.keyValues.push(makeKeyValuePair(r.key, r.currentValue!));\n });\n }\n if (differChanges || compareFnChanged) {\n if (compareFn) {\n this.keyValues.sort(compareFn);\n }\n this.compareFn = compareFn;\n }\n return this.keyValues;\n }\n}\n\nexport function defaultComparator(\n keyValueA: KeyValue,\n keyValueB: KeyValue,\n): number {\n const a = keyValueA.key;\n const b = keyValueB.key;\n // If both keys are the same, return 0 (no sorting needed).\n if (a === b) return 0;\n // If one of the keys is `null` or `undefined`, place it at the end of the sort.\n if (a == null) return 1; // `a` comes after `b`.\n if (b == null) return -1; // `b` comes after `a`.\n // If both keys are strings, compare them lexicographically.\n if (typeof a == 'string' && typeof b == 'string') {\n return a < b ? -1 : 1;\n }\n // If both keys are numbers, sort them numerically.\n if (typeof a == 'number' && typeof b == 'number') {\n return a - b;\n }\n // If both keys are booleans, sort `false` before `true`.\n if (typeof a == 'boolean' && typeof b == 'boolean') {\n return a < b ? -1 : 1;\n }\n // Fallback case: if keys are of different types, compare their string representations.\n const aString = String(a);\n const bString = String(b);\n // Compare the string representations lexicographically.\n return aString == bString ? 0 : aString < bString ? -1 : 1;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {DEFAULT_CURRENCY_CODE, Inject, LOCALE_ID, Pipe, PipeTransform} from '@angular/core';\n\nimport {formatCurrency, formatNumber, formatPercent} from '../i18n/format_number';\nimport {getCurrencySymbol} from '../i18n/locale_data_api';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Formats a value according to digit options and locale rules.\n * Locale determines group sizing and separator,\n * decimal point character, and other locale-specific configurations.\n *\n * @see {@link formatNumber}\n *\n * @usageNotes\n *\n * ### digitsInfo\n *\n * The value's decimal representation is specified by the `digitsInfo`\n * parameter, written in the following format:
    \n *\n * ```\n * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}\n * ```\n *\n * - `minIntegerDigits`:\n * The minimum number of integer digits before the decimal point.\n * Default is 1.\n *\n * - `minFractionDigits`:\n * The minimum number of digits after the decimal point.\n * Default is 0.\n *\n * - `maxFractionDigits`:\n * The maximum number of digits after the decimal point.\n * Default is 3.\n *\n * If the formatted value is truncated it will be rounded using the \"to-nearest\" method:\n *\n * ```\n * {{3.6 | number: '1.0-0'}}\n * \n *\n * {{-3.6 | number:'1.0-0'}}\n * \n * ```\n *\n * ### locale\n *\n * `locale` will format a value according to locale rules.\n * Locale determines group sizing and separator,\n * decimal point character, and other locale-specific configurations.\n *\n * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default.\n *\n * See [Setting your app locale](guide/i18n/locale-id).\n *\n * ### Example\n *\n * The following code shows how the pipe transforms values\n * according to various format specifications,\n * where the caller's default locale is `en-US`.\n *\n * {@example common/pipes/ts/number_pipe.ts region='NumberPipe'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'number',\n})\nexport class DecimalPipe implements PipeTransform {\n constructor(@Inject(LOCALE_ID) private _locale: string) {}\n\n /**\n * @param value The value to be formatted.\n * @param digitsInfo Sets digit and decimal representation.\n * [See more](#digitsinfo).\n * @param locale Specifies what locale format rules to use.\n * [See more](#locale).\n */\n transform(value: number | string, digitsInfo?: string, locale?: string): string | null;\n transform(value: null | undefined, digitsInfo?: string, locale?: string): null;\n transform(\n value: number | string | null | undefined,\n digitsInfo?: string,\n locale?: string,\n ): string | null;\n transform(\n value: number | string | null | undefined,\n digitsInfo?: string,\n locale?: string,\n ): string | null {\n if (!isValue(value)) return null;\n\n locale ||= this._locale;\n\n try {\n const num = strToNumber(value);\n return formatNumber(num, locale, digitsInfo);\n } catch (error) {\n throw invalidPipeArgumentError(DecimalPipe, (error as Error).message);\n }\n }\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Transforms a number to a percentage\n * string, formatted according to locale rules that determine group sizing and\n * separator, decimal-point character, and other locale-specific\n * configurations.\n *\n * @see {@link formatPercent}\n *\n * @usageNotes\n * The following code shows how the pipe transforms numbers\n * into text strings, according to various format specifications,\n * where the caller's default locale is `en-US`.\n *\n * {@example common/pipes/ts/percent_pipe.ts region='PercentPipe'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'percent',\n})\nexport class PercentPipe implements PipeTransform {\n constructor(@Inject(LOCALE_ID) private _locale: string) {}\n\n transform(value: number | string, digitsInfo?: string, locale?: string): string | null;\n transform(value: null | undefined, digitsInfo?: string, locale?: string): null;\n transform(\n value: number | string | null | undefined,\n digitsInfo?: string,\n locale?: string,\n ): string | null;\n /**\n *\n * @param value The number to be formatted as a percentage.\n * @param digitsInfo Decimal representation options, specified by a string\n * in the following format:
    \n * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}.\n * - `minIntegerDigits`: The minimum number of integer digits before the decimal point.\n * Default is `1`.\n * - `minFractionDigits`: The minimum number of digits after the decimal point.\n * Default is `0`.\n * - `maxFractionDigits`: The maximum number of digits after the decimal point.\n * Default is `0`.\n * @param locale A locale code for the locale format rules to use.\n * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default.\n * See [Setting your app locale](guide/i18n/locale-id).\n */\n transform(\n value: number | string | null | undefined,\n digitsInfo?: string,\n locale?: string,\n ): string | null {\n if (!isValue(value)) return null;\n locale ||= this._locale;\n try {\n const num = strToNumber(value);\n return formatPercent(num, locale, digitsInfo);\n } catch (error) {\n throw invalidPipeArgumentError(PercentPipe, (error as Error).message);\n }\n }\n}\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Transforms a number to a currency string, formatted according to locale rules\n * that determine group sizing and separator, decimal-point character,\n * and other locale-specific configurations.\n *\n *\n * @see {@link getCurrencySymbol}\n * @see {@link formatCurrency}\n *\n * @usageNotes\n * The following code shows how the pipe transforms numbers\n * into text strings, according to various format specifications,\n * where the caller's default locale is `en-US`.\n *\n * {@example common/pipes/ts/currency_pipe.ts region='CurrencyPipe'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'currency',\n})\nexport class CurrencyPipe implements PipeTransform {\n constructor(\n @Inject(LOCALE_ID) private _locale: string,\n @Inject(DEFAULT_CURRENCY_CODE) private _defaultCurrencyCode: string = 'USD',\n ) {}\n /**\n *\n * @param value The number to be formatted as currency.\n * @param currencyCode The [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) currency code,\n * such as `USD` for the US dollar and `EUR` for the euro. The default currency code can be\n * configured using the `DEFAULT_CURRENCY_CODE` injection token.\n * @param display The format for the currency indicator. One of the following:\n * - `code`: Show the code (such as `USD`).\n * - `symbol`(default): Show the symbol (such as `$`).\n * - `symbol-narrow`: Use the narrow symbol for locales that have two symbols for their\n * currency.\n * For example, the Canadian dollar CAD has the symbol `CA$` and the symbol-narrow `$`. If the\n * locale has no narrow symbol, uses the standard symbol for the locale.\n * - String: Use the given string value instead of a code or a symbol.\n * For example, an empty string will suppress the currency & symbol.\n * - Boolean (marked deprecated in v5): `true` for symbol and false for `code`.\n *\n * @param digitsInfo Decimal representation options, specified by a string\n * in the following format:
    \n * {minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}.\n * - `minIntegerDigits`: The minimum number of integer digits before the decimal point.\n * Default is `1`.\n * - `minFractionDigits`: The minimum number of digits after the decimal point.\n * Default is `2`.\n * - `maxFractionDigits`: The maximum number of digits after the decimal point.\n * Default is `2`.\n * If not provided, the number will be formatted with the proper amount of digits,\n * depending on what the [ISO 4217](https://en.wikipedia.org/wiki/ISO_4217) specifies.\n * For example, the Canadian dollar has 2 digits, whereas the Chilean peso has none.\n * @param locale A locale code for the locale format rules to use.\n * When not supplied, uses the value of `LOCALE_ID`, which is `en-US` by default.\n * See [Setting your app locale](guide/i18n/locale-id).\n */\n transform(\n value: number | string,\n currencyCode?: string,\n display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean,\n digitsInfo?: string,\n locale?: string,\n ): string | null;\n transform(\n value: null | undefined,\n currencyCode?: string,\n display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean,\n digitsInfo?: string,\n locale?: string,\n ): null;\n transform(\n value: number | string | null | undefined,\n currencyCode?: string,\n display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean,\n digitsInfo?: string,\n locale?: string,\n ): string | null;\n transform(\n value: number | string | null | undefined,\n currencyCode: string = this._defaultCurrencyCode,\n display: 'code' | 'symbol' | 'symbol-narrow' | string | boolean = 'symbol',\n digitsInfo?: string,\n locale?: string,\n ): string | null {\n if (!isValue(value)) return null;\n\n locale ||= this._locale;\n\n if (typeof display === 'boolean') {\n if ((typeof ngDevMode === 'undefined' || ngDevMode) && console && console.warn) {\n console.warn(\n `Warning: the currency pipe has been changed in Angular v5. The symbolDisplay option (third parameter) is now a string instead of a boolean. The accepted values are \"code\", \"symbol\" or \"symbol-narrow\".`,\n );\n }\n display = display ? 'symbol' : 'code';\n }\n\n let currency: string = currencyCode || this._defaultCurrencyCode;\n if (display !== 'code') {\n if (display === 'symbol' || display === 'symbol-narrow') {\n currency = getCurrencySymbol(currency, display === 'symbol' ? 'wide' : 'narrow', locale);\n } else {\n currency = display;\n }\n }\n\n try {\n const num = strToNumber(value);\n return formatCurrency(num, locale, currency, currencyCode, digitsInfo);\n } catch (error) {\n throw invalidPipeArgumentError(CurrencyPipe, (error as Error).message);\n }\n }\n}\n\nfunction isValue(value: number | string | null | undefined): value is number | string {\n return !(value == null || value === '' || value !== value);\n}\n\n/**\n * Transforms a string into a number (if needed).\n */\nfunction strToNumber(value: number | string): number {\n // Convert strings to numbers\n if (typeof value === 'string' && !isNaN(Number(value) - parseFloat(value))) {\n return Number(value);\n }\n if (typeof value !== 'number') {\n throw new Error(`${value} is not a number`);\n }\n return value;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Pipe, PipeTransform} from '@angular/core';\n\nimport {invalidPipeArgumentError} from './invalid_pipe_argument_error';\n\n/**\n * @ngModule CommonModule\n * @description\n *\n * Creates a new `Array` or `String` containing a subset (slice) of the elements.\n *\n * @usageNotes\n *\n * All behavior is based on the expected behavior of the JavaScript API `Array.prototype.slice()`\n * and `String.prototype.slice()`.\n *\n * When operating on an `Array`, the returned `Array` is always a copy even when all\n * the elements are being returned.\n *\n * When operating on a blank value, the pipe returns the blank value.\n *\n * ### List Example\n *\n * This `ngFor` example:\n *\n * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_list'}\n *\n * produces the following:\n *\n * ```html\n *
  • b
    • \n *
  • c
    • \n * ```\n *\n * ### String Examples\n *\n * {@example common/pipes/ts/slice_pipe.ts region='SlicePipe_string'}\n *\n * @publicApi\n */\n@Pipe({\n name: 'slice',\n pure: false,\n})\nexport class SlicePipe implements PipeTransform {\n /**\n * @param value a list or a string to be sliced.\n * @param start the starting index of the subset to return:\n * - **a positive integer**: return the item at `start` index and all items after\n * in the list or string expression.\n * - **a negative integer**: return the item at `start` index from the end and all items after\n * in the list or string expression.\n * - **if positive and greater than the size of the expression**: return an empty list or\n * string.\n * - **if negative and greater than the size of the expression**: return entire list or string.\n * @param end the ending index of the subset to return:\n * - **omitted**: return all items until the end.\n * - **if positive**: return all items before `end` index of the list or string.\n * - **if negative**: return all items before `end` index from the end of the list or string.\n */\n transform(value: ReadonlyArray, start: number, end?: number): Array;\n transform(value: null | undefined, start: number, end?: number): null;\n transform(\n value: ReadonlyArray | null | undefined,\n start: number,\n end?: number,\n ): Array | null;\n transform(value: string, start: number, end?: number): string;\n transform(value: string | null | undefined, start: number, end?: number): string | null;\n transform(\n value: ReadonlyArray | string | null | undefined,\n start: number,\n end?: number,\n ): Array | string | null {\n if (value == null) return null;\n\n const supports = typeof value === 'string' || Array.isArray(value);\n\n if (!supports) {\n throw invalidPipeArgumentError(SlicePipe, value);\n }\n\n return value.slice(start, end);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n/**\n * @module\n * @description\n * This module provides a set of common Pipes.\n */\nimport {AsyncPipe} from './async_pipe';\nimport {LowerCasePipe, TitleCasePipe, UpperCasePipe} from './case_conversion_pipes';\nimport {DATE_PIPE_DEFAULT_OPTIONS, DATE_PIPE_DEFAULT_TIMEZONE, DatePipe} from './date_pipe';\nimport {DatePipeConfig} from './date_pipe_config';\nimport {I18nPluralPipe} from './i18n_plural_pipe';\nimport {I18nSelectPipe} from './i18n_select_pipe';\nimport {JsonPipe} from './json_pipe';\nimport {KeyValue, KeyValuePipe} from './keyvalue_pipe';\nimport {CurrencyPipe, DecimalPipe, PercentPipe} from './number_pipe';\nimport {SlicePipe} from './slice_pipe';\n\nexport {\n AsyncPipe,\n CurrencyPipe,\n DATE_PIPE_DEFAULT_OPTIONS,\n DATE_PIPE_DEFAULT_TIMEZONE,\n DatePipe,\n DatePipeConfig,\n DecimalPipe,\n I18nPluralPipe,\n I18nSelectPipe,\n JsonPipe,\n KeyValue,\n KeyValuePipe,\n LowerCasePipe,\n PercentPipe,\n SlicePipe,\n TitleCasePipe,\n UpperCasePipe,\n};\n\n/**\n * A collection of Angular pipes that are likely to be used in each and every application.\n */\nexport const COMMON_PIPES = [\n AsyncPipe,\n UpperCasePipe,\n LowerCasePipe,\n JsonPipe,\n SlicePipe,\n DecimalPipe,\n PercentPipe,\n TitleCasePipe,\n CurrencyPipe,\n DatePipe,\n I18nPluralPipe,\n I18nSelectPipe,\n KeyValuePipe,\n];\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {NgModule} from '@angular/core';\n\nimport {COMMON_DIRECTIVES} from './directives/index';\nimport {COMMON_PIPES} from './pipes/index';\n\n// Note: This does not contain the location providers,\n// as they need some platform specific implementations to work.\n/**\n * Exports all the basic Angular directives and pipes,\n * such as `NgIf`, `NgForOf`, `DecimalPipe`, and so on.\n * Re-exported by `BrowserModule`, which is included automatically in the root\n * `AppModule` when you create a new app with the CLI `new` command.\n *\n * @publicApi\n */\n@NgModule({\n imports: [COMMON_DIRECTIVES, COMMON_PIPES],\n exports: [COMMON_DIRECTIVES, COMMON_PIPES],\n})\nexport class CommonModule {}\n"],"names":["ɵfindLocaleData","ɵLocaleDataIndex","ɵgetLocaleCurrencyCode","ɵgetLocalePluralCase","stringify","RuntimeError","i1.NgLocalization","ɵisPromise","ɵisSubscribable","i1.NgClass","i2.NgComponentOutlet","i3.NgForOf","i4.NgIf","i5.NgTemplateOutlet","i6.NgStyle","i7.NgSwitch","i7.NgSwitchCase","i7.NgSwitchDefault","i8.NgPlural","i8.NgPluralCase","i9.AsyncPipe","i10.UpperCasePipe","i10.LowerCasePipe","i11.JsonPipe","i12.SlicePipe","i13.DecimalPipe","i13.PercentPipe","i10.TitleCasePipe","i13.CurrencyPipe","i14.DatePipe","i15.I18nPluralPipe","i16.I18nSelectPipe","i17.KeyValuePipe"],"mappings":";;;;;;;;;;AAcA;;;;;;;;;;;;;;;;;AAiBG;AAEG,MAAO,oBAAqB,SAAQ,gBAAgB,CAAA;AAK9C,IAAA,iBAAA;IAJF,SAAS,GAAW,EAAE;IACtB,kBAAkB,GAAmB,EAAE;IAE/C,WACU,CAAA,iBAAmC,EACR,SAAkB,EAAA;AAErD,QAAA,KAAK,EAAE;QAHC,IAAiB,CAAA,iBAAA,GAAjB,iBAAiB;AAIzB,QAAA,IAAI,SAAS,IAAI,IAAI,EAAE;AACrB,YAAA,IAAI,CAAC,SAAS,GAAG,SAAS;;;;IAK9B,WAAW,GAAA;AACT,QAAA,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE;AACrC,YAAA,IAAI,CAAC,kBAAkB,CAAC,GAAG,EAAG,EAAE;;;AAI3B,IAAA,UAAU,CAAC,EAA0B,EAAA;QAC5C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAC1B,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,EAAE,CAAC,EACrC,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,EAAE,CAAC,CACxC;;IAGM,WAAW,GAAA;QAClB,OAAO,IAAI,CAAC,SAAS;;IAGd,IAAI,CAAC,cAAuB,KAAK,EAAA;;;QAGxC,MAAM,IAAI,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,IAAI,GAAG;AAE/C,QAAA,OAAO,IAAI,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,IAAI;;AAG1C,IAAA,kBAAkB,CAAC,QAAgB,EAAA;QAC1C,MAAM,GAAG,GAAG,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC;AACnD,QAAA,OAAO,GAAG,CAAC,MAAM,GAAG,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG;;AAGhC,IAAA,SAAS,CAAC,KAAU,EAAE,KAAa,EAAE,IAAY,EAAE,WAAmB,EAAA;AAC7E,QAAA,MAAM,GAAG,GACP,IAAI,CAAC,kBAAkB,CAAC,IAAI,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;AACjE,YAAA,IAAI,CAAC,iBAAiB,CAAC,QAAQ;QACjC,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC;;AAG5C,IAAA,YAAY,CAAC,KAAU,EAAE,KAAa,EAAE,IAAY,EAAE,WAAmB,EAAA;AAChF,QAAA,MAAM,GAAG,GACP,IAAI,CAAC,kBAAkB,CAAC,IAAI,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;AACjE,YAAA,IAAI,CAAC,iBAAiB,CAAC,QAAQ;QACjC,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC;;IAG/C,OAAO,GAAA;AACd,QAAA,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE;;IAGzB,IAAI,GAAA;AACX,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE;;IAGtB,QAAQ,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE;;IAGjC,SAAS,CAAC,mBAA2B,CAAC,EAAA;QAC7C,IAAI,CAAC,iBAAiB,CAAC,SAAS,GAAG,gBAAgB,CAAC;;AAxE3C,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,+CAMT,aAAa,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHANxB,oBAAoB,EAAA,CAAA;;sGAApB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC;;0BAOI;;0BAAY,MAAM;2BAAC,aAAa;;;AC5BrC;AACO,MAAM,aAAa,GAA2F,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,IAAI,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,KAAK,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,KAAK,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,MAAM,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,KAAK,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,OAAO,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,MAAM,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,GAAG,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC,SAAS,EAAC,SAAS,EAAC,CAAC,CAAC,EAAC;;ACOl6G;;;;;;;;AAQG;IACS;AAAZ,CAAA,UAAY,iBAAiB,EAAA;AAC3B,IAAA,iBAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAO;AACP,IAAA,iBAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAO;AACP,IAAA,iBAAA,CAAA,iBAAA,CAAA,UAAA,CAAA,GAAA,CAAA,CAAA,GAAA,UAAQ;AACR,IAAA,iBAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,GAAA,CAAA,CAAA,GAAA,YAAU;AACZ,CAAC,EALW,iBAAiB,KAAjB,iBAAiB,GAK5B,EAAA,CAAA,CAAA;AAED;;;;;;;;;;AAUG;IACS;AAAZ,CAAA,UAAY,MAAM,EAAA;AAChB,IAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAQ;AACR,IAAA,MAAA,CAAA,MAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,GAAA,KAAO;AACP,IAAA,MAAA,CAAA,MAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,GAAA,KAAO;AACP,IAAA,MAAA,CAAA,MAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,GAAA,KAAO;AACP,IAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAQ;AACR,IAAA,MAAA,CAAA,MAAA,CAAA,OAAA,CAAA,GAAA,CAAA,CAAA,GAAA,OAAS;AACX,CAAC,EAPW,MAAM,KAAN,MAAM,GAOjB,EAAA,CAAA,CAAA;AAED;;;;;;;;;;AAUG;IACS;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,SAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAM;AACN,IAAA,SAAA,CAAA,SAAA,CAAA,YAAA,CAAA,GAAA,CAAA,CAAA,GAAA,YAAU;AACZ,CAAC,EAHW,SAAS,KAAT,SAAS,GAGpB,EAAA,CAAA,CAAA;AAED;;;;;;;;AAQG;IACS;AAAZ,CAAA,UAAY,gBAAgB,EAAA;;AAE1B,IAAA,gBAAA,CAAA,gBAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAM;;AAEN,IAAA,gBAAA,CAAA,gBAAA,CAAA,aAAA,CAAA,GAAA,CAAA,CAAA,GAAA,aAAW;;AAEX,IAAA,gBAAA,CAAA,gBAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAI;;AAEJ,IAAA,gBAAA,CAAA,gBAAA,CAAA,OAAA,CAAA,GAAA,CAAA,CAAA,GAAA,OAAK;AACP,CAAC,EATW,gBAAgB,KAAhB,gBAAgB,GAS3B,EAAA,CAAA,CAAA;AAED;;;;;;;;;;;;AAYG;IACS;AAAZ,CAAA,UAAY,WAAW,EAAA;AACrB;;;AAGG;AACH,IAAA,WAAA,CAAA,WAAA,CAAA,OAAA,CAAA,GAAA,CAAA,CAAA,GAAA,OAAK;AACL;;;AAGG;AACH,IAAA,WAAA,CAAA,WAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAM;AACN;;;AAGG;AACH,IAAA,WAAA,CAAA,WAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAI;AACJ;;;AAGG;AACH,IAAA,WAAA,CAAA,WAAA,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAI;AACN,CAAC,EArBW,WAAW,KAAX,WAAW,GAqBtB,EAAA,CAAA,CAAA;AAED;AACA;AACA;;;;;;;;;;;;AAYG;AACU,MAAA,YAAY,GAAG;AAC1B;;;;AAIG;AACH,IAAA,OAAO,EAAE,CAAC;AACV;;;;AAIG;AACH,IAAA,KAAK,EAAE,CAAC;AACR;;;AAGG;AACH,IAAA,IAAI,EAAE,CAAC;AACP;;;AAGG;AACH,IAAA,WAAW,EAAE,CAAC;AACd;;;AAGG;AACH,IAAA,QAAQ,EAAE,CAAC;AACX;;;AAGG;AACH,IAAA,SAAS,EAAE,CAAC;AACZ;;;AAGG;AACH,IAAA,WAAW,EAAE,CAAC;AACd;;;AAGG;AACH,IAAA,sBAAsB,EAAE,CAAC;AACzB;;;AAGG;AACH,IAAA,QAAQ,EAAE,CAAC;AACX;;;AAGG;AACH,IAAA,QAAQ,EAAE,CAAC;AACX;;;AAGG;AACH,IAAA,GAAG,EAAE,EAAE;AACP;;;AAGG;AACH,IAAA,aAAa,EAAE,EAAE;AACjB;;;AAGG;AACH,IAAA,eAAe,EAAE,EAAE;AACnB;;;AAGG;AACH,IAAA,aAAa,EAAE,EAAE;;AAKnB;;;;;;AAMG;IACS;AAAZ,CAAA,UAAY,OAAO,EAAA;AACjB,IAAA,OAAA,CAAA,OAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAU;AACV,IAAA,OAAA,CAAA,OAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAM;AACN,IAAA,OAAA,CAAA,OAAA,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAO;AACP,IAAA,OAAA,CAAA,OAAA,CAAA,WAAA,CAAA,GAAA,CAAA,CAAA,GAAA,WAAS;AACT,IAAA,OAAA,CAAA,OAAA,CAAA,UAAA,CAAA,GAAA,CAAA,CAAA,GAAA,UAAQ;AACR,IAAA,OAAA,CAAA,OAAA,CAAA,QAAA,CAAA,GAAA,CAAA,CAAA,GAAA,QAAM;AACN,IAAA,OAAA,CAAA,OAAA,CAAA,UAAA,CAAA,GAAA,CAAA,CAAA,GAAA,UAAQ;AACV,CAAC,EARW,OAAO,KAAP,OAAO,GAQlB,EAAA,CAAA,CAAA;AAED;;;;;;;;;;;AAWG;AACG,SAAU,WAAW,CAAC,MAAc,EAAA;IACxC,OAAOA,eAAe,CAAC,MAAM,CAAC,CAACC,gBAAgB,CAAC,QAAQ,CAAC;AAC3D;AAEA;;;;;;;;;;;;;AAaG;SACa,mBAAmB,CACjC,MAAc,EACd,SAAoB,EACpB,KAAuB,EAAA;AAEvB,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,MAAM,QAAQ,GAAyB;AACrC,QAAA,IAAI,CAACC,gBAAgB,CAAC,gBAAgB,CAAC;AACvC,QAAA,IAAI,CAACA,gBAAgB,CAAC,oBAAoB,CAAC;KAC5C;IACD,MAAM,IAAI,GAAG,mBAAmB,CAAC,QAAQ,EAAE,SAAS,CAAC;AACrD,IAAA,OAAO,mBAAmB,CAAC,IAAI,EAAE,KAAK,CAAC;AACzC;AAEA;;;;;;;;;;;;;;AAcG;SACa,iBAAiB,CAC/B,MAAc,EACd,SAAoB,EACpB,KAAuB,EAAA;AAEvB,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,MAAM,QAAQ,GAAiB;AAC7B,QAAA,IAAI,CAACC,gBAAgB,CAAC,UAAU,CAAC;AACjC,QAAA,IAAI,CAACA,gBAAgB,CAAC,cAAc,CAAC;KACtC;IACD,MAAM,IAAI,GAAG,mBAAmB,CAAC,QAAQ,EAAE,SAAS,CAAC;AACrD,IAAA,OAAO,mBAAmB,CAAC,IAAI,EAAE,KAAK,CAAC;AACzC;AAEA;;;;;;;;;;;;;;AAcG;SACa,mBAAmB,CACjC,MAAc,EACd,SAAoB,EACpB,KAAuB,EAAA;AAEvB,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,MAAM,UAAU,GAAiB;AAC/B,QAAA,IAAI,CAACC,gBAAgB,CAAC,YAAY,CAAC;AACnC,QAAA,IAAI,CAACA,gBAAgB,CAAC,gBAAgB,CAAC;KACxC;IACD,MAAM,MAAM,GAAG,mBAAmB,CAAC,UAAU,EAAE,SAAS,CAAC;AACzD,IAAA,OAAO,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC;AAC3C;AAEA;;;;;;;;;;;;;AAaG;AACa,SAAA,iBAAiB,CAC/B,MAAc,EACd,KAAuB,EAAA;AAEvB,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,MAAM,QAAQ,GAAuB,IAAI,CAACC,gBAAgB,CAAC,IAAI,CAAC;AAChE,IAAA,OAAO,mBAAmB,CAAC,QAAQ,EAAE,KAAK,CAAC;AAC7C;AAEA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,uBAAuB,CAAC,MAAc,EAAA;AACpD,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,OAAO,IAAI,CAACC,gBAAgB,CAAC,cAAc,CAAC;AAC9C;AAEA;;;;;;;;;;;;AAYG;AACG,SAAU,qBAAqB,CAAC,MAAc,EAAA;AAClD,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,OAAO,IAAI,CAACC,gBAAgB,CAAC,YAAY,CAAC;AAC5C;AAEA;;;;;;;;;;;;;AAaG;AACa,SAAA,mBAAmB,CAAC,MAAc,EAAE,KAAkB,EAAA;AACpE,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,OAAO,mBAAmB,CAAC,IAAI,CAACC,gBAAgB,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC;AACtE;AAEA;;;;;;;;;;;;AAYG;AACa,SAAA,mBAAmB,CAAC,MAAc,EAAE,KAAkB,EAAA;AACpE,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,OAAO,mBAAmB,CAAC,IAAI,CAACC,gBAAgB,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC;AACtE;AAEA;;;;;;;;;;;;;AAaG;AACa,SAAA,uBAAuB,CAAC,MAAc,EAAE,KAAkB,EAAA;AACxE,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,MAAM,kBAAkB,GAAa,IAAI,CAACC,gBAAgB,CAAC,cAAc,CAAC;AAC1E,IAAA,OAAO,mBAAmB,CAAC,kBAAkB,EAAE,KAAK,CAAC;AACvD;AAEA;;;;;;;;;;;;AAYG;AACa,SAAA,qBAAqB,CAAC,MAAc,EAAE,MAAoB,EAAA;AACxE,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,MAAM,GAAG,GAAG,IAAI,CAACC,gBAAgB,CAAC,aAAa,CAAC,CAAC,MAAM,CAAC;AACxD,IAAA,IAAI,OAAO,GAAG,KAAK,WAAW,EAAE;AAC9B,QAAA,IAAI,MAAM,KAAK,YAAY,CAAC,eAAe,EAAE;YAC3C,OAAO,IAAI,CAACA,gBAAgB,CAAC,aAAa,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC;;AAC5D,aAAA,IAAI,MAAM,KAAK,YAAY,CAAC,aAAa,EAAE;YAChD,OAAO,IAAI,CAACA,gBAAgB,CAAC,aAAa,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC;;;AAGnE,IAAA,OAAO,GAAG;AACZ;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCG;AACa,SAAA,qBAAqB,CAAC,MAAc,EAAE,IAAuB,EAAA;AAC3E,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,OAAO,IAAI,CAACC,gBAAgB,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC;AACnD;AAEA;;;;;;;;;;;;AAYG;AACG,SAAU,uBAAuB,CAAC,MAAc,EAAA;AACpD,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,OAAO,IAAI,CAACC,gBAAgB,CAAC,cAAc,CAAC,IAAI,IAAI;AACtD;AAEA;;;;;;;;;;;AAWG;AACG,SAAU,qBAAqB,CAAC,MAAc,EAAA;AAClD,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,OAAO,IAAI,CAACC,gBAAgB,CAAC,YAAY,CAAC,IAAI,IAAI;AACpD;AAEA;;;;;;;;;;;;AAYG;AACG,SAAU,qBAAqB,CAAC,MAAc,EAAA;AAClD,IAAA,OAAOC,sBAAsB,CAAC,MAAM,CAAC;AACvC;AAEA;;;;;AAKG;AACH,SAAS,mBAAmB,CAAC,MAAc,EAAA;AACzC,IAAA,MAAM,IAAI,GAAGF,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,OAAO,IAAI,CAACC,gBAAgB,CAAC,UAAU,CAAC;AAC1C;AAEA;;;;;AAKG;AACI,MAAM,mBAAmB,GAC9BE;AAEF,SAAS,aAAa,CAAC,IAAS,EAAA;IAC9B,IAAI,CAAC,IAAI,CAACF,gBAAgB,CAAC,SAAS,CAAC,EAAE;AACrC,QAAA,MAAM,IAAI,KAAK,CACb,CAAA,0CAAA,EACE,IAAI,CAACA,gBAAgB,CAAC,QAAQ,CAChC,CAAgG,8FAAA,CAAA,CACjG;;AAEL;AAEA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACG,SAAU,4BAA4B,CAAC,MAAc,EAAA;AACzD,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,aAAa,CAAC,IAAI,CAAC;IACnB,MAAM,KAAK,GAAG,IAAI,CAACC,gBAAgB,CAAC,SAAS,CAAC,CAAA,CAAA,kDAA4C,IAAI,EAAE;AAChG,IAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAA+B,KAAI;AACnD,QAAA,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;AAC5B,YAAA,OAAO,WAAW,CAAC,IAAI,CAAC;;AAE1B,QAAA,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AACrD,KAAC,CAAC;AACJ;AAEA;;;;;;;;;;;;;;;;;;;AAmBG;SACa,wBAAwB,CACtC,MAAc,EACd,SAAoB,EACpB,KAAuB,EAAA;AAEvB,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;IACpC,aAAa,CAAC,IAAI,CAAC;AACnB,IAAA,MAAM,cAAc,GAAiB;AACnC,QAAA,IAAI,CAACC,gBAAgB,CAAC,SAAS,CAAC,CAA6C,CAAA,mDAAA;AAC7E,QAAA,IAAI,CAACA,gBAAgB,CAAC,SAAS,CAAC,CAAgD,CAAA,sDAAA;KACjF;IACD,MAAM,UAAU,GAAG,mBAAmB,CAAC,cAAc,EAAE,SAAS,CAAC,IAAI,EAAE;IACvE,OAAO,mBAAmB,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,EAAE;AACrD;AAEA;;;;;;;;;;;;AAYG;AACG,SAAU,kBAAkB,CAAC,MAAc,EAAA;AAC/C,IAAA,MAAM,IAAI,GAAGD,eAAe,CAAC,MAAM,CAAC;AACpC,IAAA,OAAO,IAAI,CAACC,gBAAgB,CAAC,cAAc,CAAC;AAC9C;AAEA;;;;;;;;;;;AAWG;AACH,SAAS,mBAAmB,CAAI,IAAS,EAAE,KAAa,EAAA;AACtD,IAAA,KAAK,IAAI,CAAC,GAAG,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,EAAE,EAAE;QAC/B,IAAI,OAAO,IAAI,CAAC,CAAC,CAAC,KAAK,WAAW,EAAE;AAClC,YAAA,OAAO,IAAI,CAAC,CAAC,CAAC;;;AAGlB,IAAA,MAAM,IAAI,KAAK,CAAC,wCAAwC,CAAC;AAC3D;AAcA;;AAEG;AACH,SAAS,WAAW,CAAC,IAAY,EAAA;AAC/B,IAAA,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;IAC9B,OAAO,EAAC,KAAK,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,EAAC;AACjC;AAEA;;;;;;;;;;;;;;;;;;;;AAoBG;AACG,SAAU,iBAAiB,CAAC,IAAY,EAAE,MAAyB,EAAE,MAAM,GAAG,IAAI,EAAA;AACtF,IAAA,MAAM,QAAQ,GAAG,mBAAmB,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,IAAI,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE;AAC/E,IAAA,MAAM,YAAY,GAAG,QAAQ,CAAA,CAAA,mCAA6B;IAE1D,IAAI,MAAM,KAAK,QAAQ,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE;AAC3D,QAAA,OAAO,YAAY;;AAGrB,IAAA,OAAO,QAAQ,CAAA,CAAA,6BAAuB,IAAI,IAAI;AAChD;AAEA;AACA,MAAM,6BAA6B,GAAG,CAAC;AAEvC;;;;;;;;;;;;AAYG;AACG,SAAU,yBAAyB,CAAC,IAAY,EAAA;AACpD,IAAA,IAAI,MAAM;AACV,IAAA,MAAM,QAAQ,GAAG,aAAa,CAAC,IAAI,CAAC;IACpC,IAAI,QAAQ,EAAE;QACZ,MAAM,GAAG,QAAQ,CAAA,CAAA,iCAA2B;;AAE9C,IAAA,OAAO,OAAO,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG,6BAA6B;AAC5E;;AChwBO,MAAM,kBAAkB,GAC7B,uGAAuG;AACzG;AACA,MAAM,aAAa,GAAqD,EAAE;AAC1E,MAAM,kBAAkB,GACtB,mNAAmN;AA2BrN;;;;;;;;;;;;;;;;;;;AAmBG;AACG,SAAU,UAAU,CACxB,KAA6B,EAC7B,MAAc,EACd,MAAc,EACd,QAAiB,EAAA;AAEjB,IAAA,IAAI,IAAI,GAAG,MAAM,CAAC,KAAK,CAAC;IACxB,MAAM,WAAW,GAAG,cAAc,CAAC,MAAM,EAAE,MAAM,CAAC;AAClD,IAAA,MAAM,GAAG,WAAW,IAAI,MAAM;IAE9B,IAAI,KAAK,GAAa,EAAE;AACxB,IAAA,IAAI,KAAK;IACT,OAAO,MAAM,EAAE;AACb,QAAA,KAAK,GAAG,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC;QACvC,IAAI,KAAK,EAAE;AACT,YAAA,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACpC,YAAA,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE;YACxB,IAAI,CAAC,IAAI,EAAE;gBACT;;YAEF,MAAM,GAAG,IAAI;;aACR;AACL,YAAA,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;YAClB;;;AAIJ,IAAA,IAAI,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE;IACjD,IAAI,QAAQ,EAAE;AACZ,QAAA,kBAAkB,GAAG,gBAAgB,CAAC,QAAQ,EAAE,kBAAkB,CAAC;QACnE,IAAI,GAAG,sBAAsB,CAAC,IAAI,EAAE,QAAc,CAAC;;IAGrD,IAAI,IAAI,GAAG,EAAE;AACb,IAAA,KAAK,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;AACtB,QAAA,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC;AAC7C,QAAA,IAAI,IAAI;cACJ,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,kBAAkB;cAC9C,KAAK,KAAK;AACV,kBAAE;AACF,kBAAE,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;AACzD,KAAC,CAAC;AAEF,IAAA,OAAO,IAAI;AACb;AAEA;;;;;;;;;AASG;AACH,SAAS,UAAU,CAAC,IAAY,EAAE,KAAa,EAAE,IAAY,EAAA;;;;;AAK3D,IAAA,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC;;;;;;IAQ3B,OAAO,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC;;;;IAItC,OAAO,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;AAEzB,IAAA,OAAO,OAAO;AAChB;AAEA,SAAS,cAAc,CAAC,MAAc,EAAE,MAAc,EAAA;AACpD,IAAA,MAAM,QAAQ,GAAG,WAAW,CAAC,MAAM,CAAC;AACpC,IAAA,aAAa,CAAC,QAAQ,CAAC,KAAK,EAAE;IAE9B,IAAI,aAAa,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,EAAE;AACnC,QAAA,OAAO,aAAa,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC;;IAGxC,IAAI,WAAW,GAAG,EAAE;IACpB,QAAQ,MAAM;AACZ,QAAA,KAAK,WAAW;YACd,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC;YAC5D;AACF,QAAA,KAAK,YAAY;YACf,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC;YAC7D;AACF,QAAA,KAAK,UAAU;YACb,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC;YAC3D;AACF,QAAA,KAAK,UAAU;YACb,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC;YAC3D;AACF,QAAA,KAAK,WAAW;YACd,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC;YAC5D;AACF,QAAA,KAAK,YAAY;YACf,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC;YAC7D;AACF,QAAA,KAAK,UAAU;YACb,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC;YAC3D;AACF,QAAA,KAAK,UAAU;YACb,WAAW,GAAG,mBAAmB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC;YAC3D;AACF,QAAA,KAAK,OAAO;YACV,MAAM,SAAS,GAAG,cAAc,CAAC,MAAM,EAAE,WAAW,CAAC;YACrD,MAAM,SAAS,GAAG,cAAc,CAAC,MAAM,EAAE,WAAW,CAAC;YACrD,WAAW,GAAG,cAAc,CAAC,uBAAuB,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,CAAC,EAAE;gBAC/E,SAAS;gBACT,SAAS;AACV,aAAA,CAAC;YACF;AACF,QAAA,KAAK,QAAQ;YACX,MAAM,UAAU,GAAG,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC;YACvD,MAAM,UAAU,GAAG,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC;YACvD,WAAW,GAAG,cAAc,CAAC,uBAAuB,CAAC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,EAAE;gBAChF,UAAU;gBACV,UAAU;AACX,aAAA,CAAC;YACF;AACF,QAAA,KAAK,MAAM;YACT,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,EAAE,UAAU,CAAC;YACnD,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,EAAE,UAAU,CAAC;YACnD,WAAW,GAAG,cAAc,CAAC,uBAAuB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC,EAAE;gBAC9E,QAAQ;gBACR,QAAQ;AACT,aAAA,CAAC;YACF;AACF,QAAA,KAAK,MAAM;YACT,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,EAAE,UAAU,CAAC;YACnD,MAAM,QAAQ,GAAG,cAAc,CAAC,MAAM,EAAE,UAAU,CAAC;YACnD,WAAW,GAAG,cAAc,CAAC,uBAAuB,CAAC,MAAM,EAAE,WAAW,CAAC,IAAI,CAAC,EAAE;gBAC9E,QAAQ;gBACR,QAAQ;AACT,aAAA,CAAC;YACF;;IAEJ,IAAI,WAAW,EAAE;QACf,aAAa,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,GAAG,WAAW;;AAE/C,IAAA,OAAO,WAAW;AACpB;AAEA,SAAS,cAAc,CAAC,GAAW,EAAE,UAAoB,EAAA;IACvD,IAAI,UAAU,EAAE;QACd,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,aAAa,EAAE,UAAU,KAAK,EAAE,GAAG,EAAA;AACnD,YAAA,OAAO,UAAU,IAAI,IAAI,IAAI,GAAG,IAAI,UAAU,GAAG,UAAU,CAAC,GAAG,CAAC,GAAG,KAAK;AAC1E,SAAC,CAAC;;AAEJ,IAAA,OAAO,GAAG;AACZ;AAEA,SAAS,SAAS,CAChB,GAAW,EACX,MAAc,EACd,SAAS,GAAG,GAAG,EACf,IAAc,EACd,OAAiB,EAAA;IAEjB,IAAI,GAAG,GAAG,EAAE;AACZ,IAAA,IAAI,GAAG,GAAG,CAAC,KAAK,OAAO,IAAI,GAAG,IAAI,CAAC,CAAC,EAAE;QACpC,IAAI,OAAO,EAAE;AACX,YAAA,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;;aACT;YACL,GAAG,GAAG,CAAC,GAAG;YACV,GAAG,GAAG,SAAS;;;AAGnB,IAAA,IAAI,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC;AACxB,IAAA,OAAO,MAAM,CAAC,MAAM,GAAG,MAAM,EAAE;AAC7B,QAAA,MAAM,GAAG,GAAG,GAAG,MAAM;;IAEvB,IAAI,IAAI,EAAE;QACR,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;;IAE/C,OAAO,GAAG,GAAG,MAAM;AACrB;AAEA,SAAS,uBAAuB,CAAC,YAAoB,EAAE,MAAc,EAAA;IACnE,MAAM,KAAK,GAAG,SAAS,CAAC,YAAY,EAAE,CAAC,CAAC;IACxC,OAAO,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,MAAM,CAAC;AACnC;AAEA;;AAEG;AACH,SAAS,UAAU,CACjB,IAAc,EACd,IAAY,EACZ,MAAA,GAAiB,CAAC,EAClB,IAAI,GAAG,KAAK,EACZ,OAAO,GAAG,KAAK,EAAA;IAEf,OAAO,UAAU,IAAU,EAAE,MAAc,EAAA;QACzC,IAAI,IAAI,GAAG,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC;QAClC,IAAI,MAAM,GAAG,CAAC,IAAI,IAAI,GAAG,CAAC,MAAM,EAAE;YAChC,IAAI,IAAI,MAAM;;QAGhB,IAAI,IAAI,KAAmB,CAAA,uBAAE;YAC3B,IAAI,IAAI,KAAK,CAAC,IAAI,MAAM,KAAK,GAAG,EAAE;gBAChC,IAAI,GAAG,EAAE;;;aAEN,IAAI,IAAI,KAA+B,CAAA,mCAAE;AAC9C,YAAA,OAAO,uBAAuB,CAAC,IAAI,EAAE,IAAI,CAAC;;QAG5C,MAAM,WAAW,GAAG,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC;AACzE,QAAA,OAAO,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,CAAC;AAC1D,KAAC;AACH;AAEA,SAAS,WAAW,CAAC,IAAc,EAAE,IAAU,EAAA;IAC7C,QAAQ,IAAI;AACV,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,WAAW,EAAE;AAC3B,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,QAAQ,EAAE;AACxB,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,OAAO,EAAE;AACvB,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,QAAQ,EAAE;AACxB,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AAC1B,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AAC1B,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,eAAe,EAAE;AAC/B,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,IAAI,CAAC,MAAM,EAAE;AACtB,QAAA;AACE,YAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,IAAI,CAAA,EAAA,CAAI,CAAC;;AAE1D;AAEA;;AAEG;AACH,SAAS,aAAa,CACpB,IAAqB,EACrB,KAAuB,EACvB,IAAkB,GAAA,SAAS,CAAC,MAAM,EAClC,QAAQ,GAAG,KAAK,EAAA;IAEhB,OAAO,UAAU,IAAU,EAAE,MAAc,EAAA;AACzC,QAAA,OAAO,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,CAAC;AACtE,KAAC;AACH;AAEA;;AAEG;AACH,SAAS,kBAAkB,CACzB,IAAU,EACV,MAAc,EACd,IAAqB,EACrB,KAAuB,EACvB,IAAe,EACf,QAAiB,EAAA;IAEjB,QAAQ,IAAI;AACV,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,mBAAmB,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;AAClE,QAAA,KAAA,CAAA;AACE,YAAA,OAAO,iBAAiB,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;AAC9D,QAAA,KAAA,CAAA;AACE,YAAA,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,EAAE;AACpC,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE;YACxC,IAAI,QAAQ,EAAE;AACZ,gBAAA,MAAM,KAAK,GAAG,4BAA4B,CAAC,MAAM,CAAC;gBAClD,MAAM,UAAU,GAAG,wBAAwB,CAAC,MAAM,EAAE,IAAI,EAAE,KAAK,CAAC;gBAChE,MAAM,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,KAAI;AACrC,oBAAA,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;;AAEvB,wBAAA,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,IAAI;AACvB,wBAAA,MAAM,SAAS,GAAG,YAAY,IAAI,IAAI,CAAC,KAAK,IAAI,cAAc,IAAI,IAAI,CAAC,OAAO;wBAC9E,MAAM,QAAQ,GACZ,YAAY,GAAG,EAAE,CAAC,KAAK,KAAK,YAAY,KAAK,EAAE,CAAC,KAAK,IAAI,cAAc,GAAG,EAAE,CAAC,OAAO,CAAC;;;;;;;;;;;wBAWvF,IAAI,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK,EAAE;AACzB,4BAAA,IAAI,SAAS,IAAI,QAAQ,EAAE;AACzB,gCAAA,OAAO,IAAI;;;AAER,6BAAA,IAAI,SAAS,IAAI,QAAQ,EAAE;AAChC,4BAAA,OAAO,IAAI;;;yBAER;;AAEL,wBAAA,IAAI,IAAI,CAAC,KAAK,KAAK,YAAY,IAAI,IAAI,CAAC,OAAO,KAAK,cAAc,EAAE;AAClE,4BAAA,OAAO,IAAI;;;AAGf,oBAAA,OAAO,KAAK;AACd,iBAAC,CAAC;AACF,gBAAA,IAAI,KAAK,KAAK,EAAE,EAAE;AAChB,oBAAA,OAAO,UAAU,CAAC,KAAK,CAAC;;;;YAI5B,OAAO,mBAAmB,CAAC,MAAM,EAAE,IAAI,EAAoB,KAAK,CAAC,CAAC,YAAY,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;AAC9F,QAAA,KAAA,CAAA;YACE,OAAO,iBAAiB,CAAC,MAAM,EAAoB,KAAK,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAC5F,QAAA;;;;;YAKE,MAAM,UAAU,GAAU,IAAI;AAC9B,YAAA,MAAM,IAAI,KAAK,CAAC,+BAA+B,UAAU,CAAA,CAAE,CAAC;;AAElE;AAEA;;;;AAIG;AACH,SAAS,cAAc,CAAC,KAAgB,EAAA;AACtC,IAAA,OAAO,UAAU,IAAU,EAAE,MAAc,EAAE,MAAc,EAAA;AACzD,QAAA,MAAM,IAAI,GAAG,EAAE,GAAG,MAAM;QACxB,MAAM,SAAS,GAAG,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC;QACvE,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC;QACrE,QAAQ,KAAK;AACX,YAAA,KAAA,CAAA;AACE,gBAAA,QACE,CAAC,IAAI,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;AACrB,oBAAA,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,SAAS,CAAC;AAC9B,oBAAA,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC;AAEhD,YAAA,KAAA,CAAA;gBACE,OAAO,KAAK,IAAI,IAAI,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,SAAS,CAAC;AACxE,YAAA,KAAA,CAAA;AACE,gBAAA,QACE,KAAK;qBACJ,IAAI,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACtB,oBAAA,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,SAAS,CAAC;oBAC9B,GAAG;AACH,oBAAA,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC;AAEhD,YAAA,KAAA,CAAA;AACE,gBAAA,IAAI,MAAM,KAAK,CAAC,EAAE;AAChB,oBAAA,OAAO,GAAG;;qBACL;AACL,oBAAA,QACE,CAAC,IAAI,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;AACrB,wBAAA,SAAS,CAAC,KAAK,EAAE,CAAC,EAAE,SAAS,CAAC;wBAC9B,GAAG;AACH,wBAAA,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,CAAC;;AAGlD,YAAA;AACE,gBAAA,MAAM,IAAI,KAAK,CAAC,uBAAuB,KAAK,CAAA,CAAA,CAAG,CAAC;;AAEtD,KAAC;AACH;AAEA,MAAM,OAAO,GAAG,CAAC;AACjB,MAAM,QAAQ,GAAG,CAAC;AAClB,SAAS,sBAAsB,CAAC,IAAY,EAAA;AAC1C,IAAA,MAAM,cAAc,GAAG,UAAU,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE;IAC5D,OAAO,UAAU,CACf,IAAI,EACJ,CAAC,EACD,CAAC,IAAI,cAAc,IAAI,QAAQ,GAAG,QAAQ,GAAG,QAAQ,GAAG,CAAC,CAAC,GAAG,cAAc,CAC5E;AACH;AAEA;;AAEG;AACG,SAAU,sBAAsB,CAAC,QAAc,EAAA;;AAEnD,IAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,MAAM,EAAE;;AAGpC,IAAA,MAAM,eAAe,GAAG,UAAU,KAAK,CAAC,GAAG,EAAE,GAAG,QAAQ,GAAG,UAAU;AAErE,IAAA,OAAO,UAAU,CACf,QAAQ,CAAC,WAAW,EAAE,EACtB,QAAQ,CAAC,QAAQ,EAAE,EACnB,QAAQ,CAAC,OAAO,EAAE,GAAG,eAAe,CACrC;AACH;AAEA,SAAS,UAAU,CAAC,IAAY,EAAE,UAAU,GAAG,KAAK,EAAA;IAClD,OAAO,UAAU,IAAU,EAAE,MAAc,EAAA;AACzC,QAAA,IAAI,MAAM;QACV,IAAI,UAAU,EAAE;YACd,MAAM,yBAAyB,GAC7B,IAAI,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,CAAC;AAC/D,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,EAAE;AAC5B,YAAA,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,KAAK,GAAG,yBAAyB,IAAI,CAAC,CAAC;;aAC3D;AACL,YAAA,MAAM,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC;;;YAG9C,MAAM,UAAU,GAAG,sBAAsB,CAAC,SAAS,CAAC,WAAW,EAAE,CAAC;YAClE,MAAM,IAAI,GAAG,SAAS,CAAC,OAAO,EAAE,GAAG,UAAU,CAAC,OAAO,EAAE;AACvD,YAAA,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,OAAO,CAAC,CAAC;;AAG1C,QAAA,OAAO,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;AACvF,KAAC;AACH;AAEA;;AAEG;AACH,SAAS,uBAAuB,CAAC,IAAY,EAAE,IAAI,GAAG,KAAK,EAAA;IACzD,OAAO,UAAU,IAAU,EAAE,MAAc,EAAA;AACzC,QAAA,MAAM,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC;AAC9C,QAAA,MAAM,iBAAiB,GAAG,SAAS,CAAC,WAAW,EAAE;AACjD,QAAA,OAAO,SAAS,CACd,iBAAiB,EACjB,IAAI,EACJ,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,EACrD,IAAI,CACL;AACH,KAAC;AACH;AAIA,MAAM,YAAY,GAAsC,EAAE;AAE1D;AACA;AACA;AACA;AACA,SAAS,gBAAgB,CAAC,MAAc,EAAA;AACtC,IAAA,IAAI,YAAY,CAAC,MAAM,CAAC,EAAE;AACxB,QAAA,OAAO,YAAY,CAAC,MAAM,CAAC;;AAE7B,IAAA,IAAI,SAAS;IACb,QAAQ,MAAM;;AAEZ,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,WAAW,CAAC;YAC7E;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,IAAI,CAAC;YACtE;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,MAAM,CAAC;YACxE;;AAGF,QAAA,KAAK,GAAG;YACN,SAAS,GAAG,UAAU,CAAA,CAAA,0BAAoB,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC;YAC5D;;AAEF,QAAA,KAAK,IAAI;YACP,SAAS,GAAG,UAAU,CAAA,CAAA,0BAAoB,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC;YAC3D;;AAEF,QAAA,KAAK,KAAK;YACR,SAAS,GAAG,UAAU,CAAA,CAAA,0BAAoB,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC;YAC5D;;AAEF,QAAA,KAAK,MAAM;YACT,SAAS,GAAG,UAAU,CAAA,CAAA,0BAAoB,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC;YAC5D;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,uBAAuB,CAAC,CAAC,CAAC;YACtC;;;AAGF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,uBAAuB,CAAC,CAAC,EAAE,IAAI,CAAC;YAC5C;;;AAGF,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,uBAAuB,CAAC,CAAC,CAAC;YACtC;;AAEF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,uBAAuB,CAAC,CAAC,CAAC;YACtC;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAA,CAAA,uBAAiB,CAAC,EAAE,CAAC,CAAC;YAC5C;AACF,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAA,CAAA,uBAAiB,CAAC,EAAE,CAAC,CAAC;YAC5C;;AAGF,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,+BAAyB,gBAAgB,CAAC,WAAW,CAAC;YAC/E;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,+BAAyB,gBAAgB,CAAC,IAAI,CAAC;YACxE;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,+BAAyB,gBAAgB,CAAC,MAAM,CAAC;YAC1E;;AAGF,QAAA,KAAK,KAAK;YACR,SAAS,GAAG,aAAa,CAAA,CAAA,+BAEvB,gBAAgB,CAAC,WAAW,EAC5B,SAAS,CAAC,UAAU,CACrB;YACD;AACF,QAAA,KAAK,MAAM;YACT,SAAS,GAAG,aAAa,CAAA,CAAA,+BAEvB,gBAAgB,CAAC,IAAI,EACrB,SAAS,CAAC,UAAU,CACrB;YACD;AACF,QAAA,KAAK,OAAO;YACV,SAAS,GAAG,aAAa,CAAA,CAAA,+BAEvB,gBAAgB,CAAC,MAAM,EACvB,SAAS,CAAC,UAAU,CACrB;YACD;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAC,CAAC,CAAC;YACzB;AACF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAC,CAAC,CAAC;YACzB;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAC,CAAC,EAAE,IAAI,CAAC;YAC/B;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAgB,CAAA,sBAAA,CAAC,CAAC;YACxC;AACF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAgB,CAAA,sBAAA,CAAC,CAAC;YACxC;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAe,CAAA,qBAAA,CAAC,CAAC;YACvC;AACF,QAAA,KAAK,KAAK;YACR,SAAS,GAAG,aAAa,CAAA,CAAA,6BAEvB,gBAAgB,CAAC,WAAW,EAC5B,SAAS,CAAC,UAAU,CACrB;YACD;AACF,QAAA,KAAK,MAAM;YACT,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,IAAI,EAAE,SAAS,CAAC,UAAU,CAAC;YAC5F;AACF,QAAA,KAAK,OAAO;YACV,SAAS,GAAG,aAAa,CAAA,CAAA,6BAEvB,gBAAgB,CAAC,MAAM,EACvB,SAAS,CAAC,UAAU,CACrB;YACD;AACF,QAAA,KAAK,QAAQ;YACX,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,KAAK,EAAE,SAAS,CAAC,UAAU,CAAC;YAC7F;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,WAAW,CAAC;YAC7E;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,IAAI,CAAC;YACtE;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,MAAM,CAAC;YACxE;AACF,QAAA,KAAK,QAAQ;AACX,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,6BAAuB,gBAAgB,CAAC,KAAK,CAAC;YACvE;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,mCAA6B,gBAAgB,CAAC,WAAW,CAAC;YACnF;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,mCAA6B,gBAAgB,CAAC,IAAI,CAAC;YAC5E;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAAA,CAAA,mCAA6B,gBAAgB,CAAC,MAAM,CAAC;YAC9E;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,WAAW,EAC5B,SAAS,CAAC,UAAU,EACpB,IAAI,CACL;YACD;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,IAAI,EACrB,SAAS,CAAC,UAAU,EACpB,IAAI,CACL;YACD;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,MAAM,EACvB,SAAS,CAAC,UAAU,EACpB,IAAI,CACL;YACD;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,WAAW,EAC5B,SAAS,CAAC,MAAM,EAChB,IAAI,CACL;YACD;AACF,QAAA,KAAK,MAAM;AACT,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,IAAI,EACrB,SAAS,CAAC,MAAM,EAChB,IAAI,CACL;YACD;AACF,QAAA,KAAK,OAAO;AACV,YAAA,SAAS,GAAG,aAAa,CAEvB,CAAA,mCAAA,gBAAgB,CAAC,MAAM,EACvB,SAAS,CAAC,MAAM,EAChB,IAAI,CACL;YACD;;AAGF,QAAA,KAAK,GAAG;YACN,SAAS,GAAG,UAAU,CAAiB,CAAA,uBAAA,CAAC,EAAE,GAAG,CAAC;YAC9C;AACF,QAAA,KAAK,IAAI;YACP,SAAS,GAAG,UAAU,CAAiB,CAAA,uBAAA,CAAC,EAAE,GAAG,CAAC;YAC9C;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAiB,CAAA,uBAAA,CAAC,CAAC;YACzC;;AAEF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAiB,CAAA,uBAAA,CAAC,CAAC;YACzC;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAmB,CAAA,yBAAA,CAAC,CAAC;YAC3C;AACF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAmB,CAAA,yBAAA,CAAC,CAAC;YAC3C;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAAmB,CAAA,yBAAA,CAAC,CAAC;YAC3C;AACF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAAmB,CAAA,yBAAA,CAAC,CAAC;YAC3C;;AAGF,QAAA,KAAK,GAAG;AACN,YAAA,SAAS,GAAG,UAAU,CAA6B,CAAA,mCAAA,CAAC,CAAC;YACrD;AACF,QAAA,KAAK,IAAI;AACP,YAAA,SAAS,GAAG,UAAU,CAA6B,CAAA,mCAAA,CAAC,CAAC;YACrD;AACF,QAAA,KAAK,KAAK;AACR,YAAA,SAAS,GAAG,UAAU,CAA6B,CAAA,mCAAA,CAAC,CAAC;YACrD;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;YACR,SAAS,GAAG,cAAc,CAAA,CAAA,uBAAiB;YAC3C;;AAEF,QAAA,KAAK,OAAO;YACV,SAAS,GAAG,cAAc,CAAA,CAAA,0BAAoB;YAC9C;;AAGF,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;;AAEV,QAAA,KAAK,GAAG;AACR,QAAA,KAAK,IAAI;AACT,QAAA,KAAK,KAAK;YACR,SAAS,GAAG,cAAc,CAAA,CAAA,0BAAoB;YAC9C;;AAEF,QAAA,KAAK,MAAM;AACX,QAAA,KAAK,MAAM;;AAEX,QAAA,KAAK,MAAM;YACT,SAAS,GAAG,cAAc,CAAA,CAAA,sBAAgB;YAC1C;AACF,QAAA;AACE,YAAA,OAAO,IAAI;;AAEf,IAAA,YAAY,CAAC,MAAM,CAAC,GAAG,SAAS;AAChC,IAAA,OAAO,SAAS;AAClB;AAEA,SAAS,gBAAgB,CAAC,QAAgB,EAAE,QAAgB,EAAA;;;IAG1D,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;AACrC,IAAA,MAAM,uBAAuB,GAAG,IAAI,CAAC,KAAK,CAAC,wBAAwB,GAAG,QAAQ,CAAC,GAAG,KAAK;AACvF,IAAA,OAAO,KAAK,CAAC,uBAAuB,CAAC,GAAG,QAAQ,GAAG,uBAAuB;AAC5E;AAEA,SAAS,cAAc,CAAC,IAAU,EAAE,OAAe,EAAA;IACjD,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;IAC/B,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,OAAO,CAAC;AAC5C,IAAA,OAAO,IAAI;AACb;AAEA,SAAS,sBAAsB,CAAC,IAAU,EAAE,QAAgB,EAAE,OAAgB,EAAA;AAC5E,IAAA,MAAM,YAAY,GAAa,EAAE,CAAI;AACrC,IAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE;IACnD,MAAM,cAAc,GAAG,gBAAgB,CAAC,QAAQ,EAAE,kBAAkB,CAAC;AACrE,IAAA,OAAO,cAAc,CAAC,IAAI,EAAE,YAAY,IAAI,cAAc,GAAG,kBAAkB,CAAC,CAAC;AACnF;AAEA;;;;;;;;;;;AAWG;AACG,SAAU,MAAM,CAAC,KAA6B,EAAA;AAClD,IAAA,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE;AACjB,QAAA,OAAO,KAAK;;IAGd,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;AAC9C,QAAA,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC;;AAGxB,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,QAAA,KAAK,GAAG,KAAK,CAAC,IAAI,EAAE;AAEpB,QAAA,IAAI,iCAAiC,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;AACjD;;;;;;AAM0D;AAC1D,YAAA,MAAM,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAW,KAAK,CAAC,GAAG,CAAC;YACrE,OAAO,UAAU,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;;AAGhC,QAAA,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,CAAC;;QAGlC,IAAI,CAAC,KAAK,CAAE,KAAa,GAAG,QAAQ,CAAC,EAAE;AACrC,YAAA,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC;;AAG3B,QAAA,IAAI,KAA8B;QAClC,KAAK,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,kBAAkB,CAAC,GAAG;AAC7C,YAAA,OAAO,eAAe,CAAC,KAAK,CAAC;;;AAIjC,IAAA,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,KAAY,CAAC;AACnC,IAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;AACjB,QAAA,MAAM,IAAI,KAAK,CAAC,sBAAsB,KAAK,CAAA,aAAA,CAAe,CAAC;;AAE7D,IAAA,OAAO,IAAI;AACb;AAEA;;;AAGG;AACG,SAAU,eAAe,CAAC,KAAuB,EAAA;AACrD,IAAA,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC;IACxB,IAAI,MAAM,GAAG,CAAC;IACd,IAAI,KAAK,GAAG,CAAC;;AAGb,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,WAAW;AACpE,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ;;AAG9D,IAAA,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE;AACZ,QAAA,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;AACrC,QAAA,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,EAAE,CAAC,CAAC;;AAEtC,IAAA,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;AAC/E,IAAA,MAAM,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,MAAM;AACxC,IAAA,MAAM,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK;IACvC,MAAM,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;;;;IAI/B,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;AAChE,IAAA,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;AAClC,IAAA,OAAO,IAAI;AACb;AAEM,SAAU,MAAM,CAAC,KAAU,EAAA;AAC/B,IAAA,OAAO,KAAK,YAAY,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;AACzD;;ACh6BO,MAAM,oBAAoB,GAAG,6BAA6B;AACjE,MAAM,UAAU,GAAG,EAAE;AACrB,MAAM,WAAW,GAAG,GAAG;AACvB,MAAM,SAAS,GAAG,GAAG;AACrB,MAAM,WAAW,GAAG,GAAG;AACvB,MAAM,SAAS,GAAG,GAAG;AACrB,MAAM,UAAU,GAAG,GAAG;AACtB,MAAM,aAAa,GAAG,GAAG;AACzB,MAAM,YAAY,GAAG,GAAG;AAExB;;AAEG;AACH,SAAS,0BAA0B,CACjC,KAAa,EACb,OAA2B,EAC3B,MAAc,EACd,WAAyB,EACzB,aAA2B,EAC3B,UAAmB,EACnB,SAAS,GAAG,KAAK,EAAA;IAEjB,IAAI,aAAa,GAAG,EAAE;IACtB,IAAI,MAAM,GAAG,KAAK;AAElB,IAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACpB,aAAa,GAAG,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC;;SAC/D;AACL,QAAA,IAAI,YAAY,GAAG,WAAW,CAAC,KAAK,CAAC;QAErC,IAAI,SAAS,EAAE;AACb,YAAA,YAAY,GAAG,SAAS,CAAC,YAAY,CAAC;;AAGxC,QAAA,IAAI,MAAM,GAAG,OAAO,CAAC,MAAM;AAC3B,QAAA,IAAI,WAAW,GAAG,OAAO,CAAC,OAAO;AACjC,QAAA,IAAI,WAAW,GAAG,OAAO,CAAC,OAAO;QAEjC,IAAI,UAAU,EAAE;YACd,MAAM,KAAK,GAAG,UAAU,CAAC,KAAK,CAAC,oBAAoB,CAAC;AACpD,YAAA,IAAI,KAAK,KAAK,IAAI,EAAE;AAClB,gBAAA,MAAM,IAAI,KAAK,CAAC,GAAG,UAAU,CAAA,0BAAA,CAA4B,CAAC;;AAE5D,YAAA,MAAM,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC;AAC3B,YAAA,MAAM,eAAe,GAAG,KAAK,CAAC,CAAC,CAAC;AAChC,YAAA,MAAM,eAAe,GAAG,KAAK,CAAC,CAAC,CAAC;AAChC,YAAA,IAAI,UAAU,IAAI,IAAI,EAAE;AACtB,gBAAA,MAAM,GAAG,iBAAiB,CAAC,UAAU,CAAC;;AAExC,YAAA,IAAI,eAAe,IAAI,IAAI,EAAE;AAC3B,gBAAA,WAAW,GAAG,iBAAiB,CAAC,eAAe,CAAC;;AAElD,YAAA,IAAI,eAAe,IAAI,IAAI,EAAE;AAC3B,gBAAA,WAAW,GAAG,iBAAiB,CAAC,eAAe,CAAC;;iBAC3C,IAAI,eAAe,IAAI,IAAI,IAAI,WAAW,GAAG,WAAW,EAAE;gBAC/D,WAAW,GAAG,WAAW;;;AAI7B,QAAA,WAAW,CAAC,YAAY,EAAE,WAAW,EAAE,WAAW,CAAC;AAEnD,QAAA,IAAI,MAAM,GAAG,YAAY,CAAC,MAAM;AAChC,QAAA,IAAI,UAAU,GAAG,YAAY,CAAC,UAAU;AACxC,QAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,QAAQ;QACtC,IAAI,QAAQ,GAAG,EAAE;AACjB,QAAA,MAAM,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;;AAGhC,QAAA,OAAO,UAAU,GAAG,MAAM,EAAE,UAAU,EAAE,EAAE;AACxC,YAAA,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;;;AAInB,QAAA,OAAO,UAAU,GAAG,CAAC,EAAE,UAAU,EAAE,EAAE;AACnC,YAAA,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;;;AAInB,QAAA,IAAI,UAAU,GAAG,CAAC,EAAE;YAClB,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,MAAM,CAAC;;aAC9C;YACL,QAAQ,GAAG,MAAM;AACjB,YAAA,MAAM,GAAG,CAAC,CAAC,CAAC;;;QAId,MAAM,MAAM,GAAG,EAAE;QACjB,IAAI,MAAM,CAAC,MAAM,IAAI,OAAO,CAAC,MAAM,EAAE;YACnC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;;QAGxE,OAAO,MAAM,CAAC,MAAM,GAAG,OAAO,CAAC,KAAK,EAAE;YACpC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;;AAGvE,QAAA,IAAI,MAAM,CAAC,MAAM,EAAE;YACjB,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;;AAGjC,QAAA,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,qBAAqB,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;;AAGvE,QAAA,IAAI,QAAQ,CAAC,MAAM,EAAE;AACnB,YAAA,aAAa,IAAI,qBAAqB,CAAC,MAAM,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;;QAGnF,IAAI,QAAQ,EAAE;AACZ,YAAA,aAAa,IAAI,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,WAAW,CAAC,GAAG,GAAG,GAAG,QAAQ;;;AAI7F,IAAA,IAAI,KAAK,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE;QACxB,aAAa,GAAG,OAAO,CAAC,MAAM,GAAG,aAAa,GAAG,OAAO,CAAC,MAAM;;SAC1D;QACL,aAAa,GAAG,OAAO,CAAC,MAAM,GAAG,aAAa,GAAG,OAAO,CAAC,MAAM;;AAGjE,IAAA,OAAO,aAAa;AACtB;AAEA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACG,SAAU,cAAc,CAC5B,KAAa,EACb,MAAc,EACd,QAAgB,EAChB,YAAqB,EACrB,UAAmB,EAAA;IAEnB,MAAM,MAAM,GAAG,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,CAAC,QAAQ,CAAC;AACxE,IAAA,MAAM,OAAO,GAAG,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;AAEhG,IAAA,OAAO,CAAC,OAAO,GAAG,yBAAyB,CAAC,YAAa,CAAC;AAC1D,IAAA,OAAO,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO;IAEjC,MAAM,GAAG,GAAG,0BAA0B,CACpC,KAAK,EACL,OAAO,EACP,MAAM,EACN,YAAY,CAAC,aAAa,EAC1B,YAAY,CAAC,eAAe,EAC5B,UAAU,CACX;AACD,IAAA,QACE;AACG,SAAA,OAAO,CAAC,aAAa,EAAE,QAAQ;;AAE/B,SAAA,OAAO,CAAC,aAAa,EAAE,EAAE;;;;;SAKzB,IAAI,EAAE;AAEb;AAEA;;;;;;;;;;;;;;;;;;AAkBG;SACa,aAAa,CAAC,KAAa,EAAE,MAAc,EAAE,UAAmB,EAAA;IAC9E,MAAM,MAAM,GAAG,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,CAAC,OAAO,CAAC;AACvE,IAAA,MAAM,OAAO,GAAG,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAChG,MAAM,GAAG,GAAG,0BAA0B,CACpC,KAAK,EACL,OAAO,EACP,MAAM,EACN,YAAY,CAAC,KAAK,EAClB,YAAY,CAAC,OAAO,EACpB,UAAU,EACV,IAAI,CACL;IACD,OAAO,GAAG,CAAC,OAAO,CAChB,IAAI,MAAM,CAAC,YAAY,EAAE,GAAG,CAAC,EAC7B,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,WAAW,CAAC,CACxD;AACH;AAEA;;;;;;;;;;;;;;;;AAgBG;SACa,YAAY,CAAC,KAAa,EAAE,MAAc,EAAE,UAAmB,EAAA;IAC7E,MAAM,MAAM,GAAG,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,CAAC,OAAO,CAAC;AACvE,IAAA,MAAM,OAAO,GAAG,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,CAAC,MAAM,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;AAChG,IAAA,OAAO,0BAA0B,CAC/B,KAAK,EACL,OAAO,EACP,MAAM,EACN,YAAY,CAAC,KAAK,EAClB,YAAY,CAAC,OAAO,EACpB,UAAU,CACX;AACH;AAsBA,SAAS,iBAAiB,CAAC,MAAc,EAAE,SAAS,GAAG,GAAG,EAAA;AACxD,IAAA,MAAM,CAAC,GAAG;AACR,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,KAAK,EAAE,CAAC;AACR,QAAA,MAAM,EAAE,CAAC;KACV;IAED,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,WAAW,CAAC;AAC9C,IAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,CAAC,CAAC;AAChC,IAAA,MAAM,QAAQ,GAAG,YAAY,CAAC,CAAC,CAAC;IAEhC,MAAM,aAAa,GACf,QAAQ,CAAC,OAAO,CAAC,WAAW,CAAC,KAAK;AAChC,UAAE,QAAQ,CAAC,KAAK,CAAC,WAAW;AAC5B,UAAE;AACE,YAAA,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;YAC1D,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;AACxD,SAAA,EACP,OAAO,GAAG,aAAa,CAAC,CAAC,CAAC,EAC1B,QAAQ,GAAG,aAAa,CAAC,CAAC,CAAC,IAAI,EAAE;AAEnC,IAAA,CAAC,CAAC,MAAM,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC;AAE5D,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACxC,MAAM,EAAE,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7B,QAAA,IAAI,EAAE,KAAK,SAAS,EAAE;YACpB,CAAC,CAAC,OAAO,GAAG,CAAC,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC;;AACxB,aAAA,IAAI,EAAE,KAAK,UAAU,EAAE;AAC5B,YAAA,CAAC,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC;;aACZ;AACL,YAAA,CAAC,CAAC,MAAM,IAAI,EAAE;;;IAIlB,MAAM,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC;IACvC,CAAC,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC;AAC1C,IAAA,CAAC,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,CAAC;IAEvE,IAAI,QAAQ,EAAE;QACZ,MAAM,QAAQ,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,EAClE,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC;AAEpC,QAAA,CAAC,CAAC,MAAM,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;AACvD,QAAA,CAAC,CAAC,MAAM,GAAG,QAAQ,CAAC,KAAK,CAAC,GAAG,GAAG,QAAQ,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;;SACtD;QACL,CAAC,CAAC,MAAM,GAAG,SAAS,GAAG,CAAC,CAAC,MAAM;AAC/B,QAAA,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,MAAM;;AAGrB,IAAA,OAAO,CAAC;AACV;AAWA;AACA,SAAS,SAAS,CAAC,YAA0B,EAAA;;IAE3C,IAAI,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE;AAChC,QAAA,OAAO,YAAY;;;IAIrB,MAAM,WAAW,GAAG,YAAY,CAAC,MAAM,CAAC,MAAM,GAAG,YAAY,CAAC,UAAU;AACxE,IAAA,IAAI,YAAY,CAAC,QAAQ,EAAE;AACzB,QAAA,YAAY,CAAC,QAAQ,IAAI,CAAC;;SACrB;AACL,QAAA,IAAI,WAAW,KAAK,CAAC,EAAE;YACrB,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC;;AACzB,aAAA,IAAI,WAAW,KAAK,CAAC,EAAE;AAC5B,YAAA,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;;AAE7B,QAAA,YAAY,CAAC,UAAU,IAAI,CAAC;;AAG9B,IAAA,OAAO,YAAY;AACrB;AAEA;;;AAGG;AACH,SAAS,WAAW,CAAC,GAAW,EAAA;IAC9B,IAAI,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE;AAC/B,IAAA,IAAI,QAAQ,GAAG,CAAC,EACd,MAAM,EACN,UAAU;AACZ,IAAA,IAAI,CAAC,EAAE,CAAC,EAAE,KAAK;;AAGf,IAAA,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,EAAE,EAAE;QACnD,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,EAAE,EAAE,CAAC;;;AAI1C,IAAA,IAAI,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;;QAEjC,IAAI,UAAU,GAAG,CAAC;YAAE,UAAU,GAAG,CAAC;QAClC,UAAU,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC;QAClC,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;;AAC1B,SAAA,IAAI,UAAU,GAAG,CAAC,EAAE;;AAEzB,QAAA,UAAU,GAAG,MAAM,CAAC,MAAM;;;AAI5B,IAAA,KAAK,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE,CAAC,EAAE,EAAE;;;IAIjD,IAAI,CAAC,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,EAAE;;AAEjC,QAAA,MAAM,GAAG,CAAC,CAAC,CAAC;QACZ,UAAU,GAAG,CAAC;;SACT;;AAEL,QAAA,KAAK,EAAE;AACP,QAAA,OAAO,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,SAAS;AAAE,YAAA,KAAK,EAAE;;QAGlD,UAAU,IAAI,CAAC;QACf,MAAM,GAAG,EAAE;;AAEX,QAAA,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;AAChC,YAAA,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;;;;AAKxC,IAAA,IAAI,UAAU,GAAG,UAAU,EAAE;QAC3B,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC;AACzC,QAAA,QAAQ,GAAG,UAAU,GAAG,CAAC;QACzB,UAAU,GAAG,CAAC;;AAGhB,IAAA,OAAO,EAAC,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAC;AACvC;AAEA;;;AAGG;AACH,SAAS,WAAW,CAAC,YAA0B,EAAE,OAAe,EAAE,OAAe,EAAA;AAC/E,IAAA,IAAI,OAAO,GAAG,OAAO,EAAE;QACrB,MAAM,IAAI,KAAK,CACb,CAAA,6CAAA,EAAgD,OAAO,CAAiC,8BAAA,EAAA,OAAO,CAAI,EAAA,CAAA,CACpG;;AAGH,IAAA,IAAI,MAAM,GAAG,YAAY,CAAC,MAAM;IAChC,IAAI,WAAW,GAAG,MAAM,CAAC,MAAM,GAAG,YAAY,CAAC,UAAU;AACzD,IAAA,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,CAAC,EAAE,OAAO,CAAC;;AAGtE,IAAA,IAAI,OAAO,GAAG,YAAY,GAAG,YAAY,CAAC,UAAU;AACpD,IAAA,IAAI,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC;AAE3B,IAAA,IAAI,OAAO,GAAG,CAAC,EAAE;;AAEf,QAAA,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;;AAGzD,QAAA,KAAK,IAAI,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AAC5C,YAAA,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC;;;SAEV;;QAEL,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,CAAC;AACtC,QAAA,YAAY,CAAC,UAAU,GAAG,CAAC;AAC3B,QAAA,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,OAAO,GAAG,YAAY,GAAG,CAAC,EAAE;AACzD,QAAA,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC;QACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,EAAE;AAAE,YAAA,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC;;AAGjD,IAAA,IAAI,KAAK,IAAI,CAAC,EAAE;AACd,QAAA,IAAI,OAAO,GAAG,CAAC,GAAG,CAAC,EAAE;AACnB,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,EAAE,CAAC,EAAE,EAAE;AAChC,gBAAA,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;gBACjB,YAAY,CAAC,UAAU,EAAE;;AAE3B,YAAA,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;YACjB,YAAY,CAAC,UAAU,EAAE;;aACpB;AACL,YAAA,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,EAAE;;;;AAKzB,IAAA,OAAO,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,CAAC,EAAE,WAAW,EAAE;AAAE,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;AAE7E,IAAA,IAAI,iBAAiB,GAAG,YAAY,KAAK,CAAC;;;AAG1C,IAAA,MAAM,MAAM,GAAG,OAAO,GAAG,YAAY,CAAC,UAAU;;AAEhD,IAAA,MAAM,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC,UAAU,KAAK,EAAE,CAd[AC,EAAE,CAAC,EAAE,MAAM,EAAA;AAC5D,QAAA,CAAC,GAAG,CAAC,GAAG,KAAK;AACb,QAAA,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;QAChC,IAAI,iBAAiB,EAAE;;YAErB,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,MAAM,EAAE;gBAClC,MAAM,CAAC,GAAG,EAAE;;iBACP;gBACL,iBAAiB,GAAG,KAAK;;;AAG7B,QAAA,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;KACxB,EAAE,CAAC,CAAC;IACL,IAAI,KAAK,EAAE;AACT,QAAA,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;QACrB,YAAY,CAAC,UAAU,EAAE;;AAE7B;AAEM,SAAU,iBAAiB,CAAC,IAAY,EAAA;AAC5C,IAAA,MAAM,MAAM,GAAW,QAAQ,CAAC,IAAI,CAAC;AACrC,IAAA,IAAI,KAAK,CAAC,MAAM,CAAC,EAAE;AACjB,QAAA,MAAM,IAAI,KAAK,CAAC,uCAAuC,GAAG,IAAI,CAAC;;AAEjE,IAAA,OAAO,MAAM;AACf;;ACtfA;;AAEG;MAMmB,cAAc,CAAA;kHAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AAAd,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,EAJtB,UAAA,EAAA,MAAM,EACN,UAAA,EAAA,CAAC,MAAc,KAAK,IAAI,oBAAoB,CAAC,MAAM,CAAC,kBACzD,SAAS,EAAA,CAAA,EAAA,CAAA;;sGAEI,cAAc,EAAA,UAAA,EAAA,CAAA;kBALnC,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE,MAAM;oBAClB,UAAU,EAAE,CAAC,MAAc,KAAK,IAAI,oBAAoB,CAAC,MAAM,CAAC;oBAChE,IAAI,EAAE,CAAC,SAAS,CAAC;AAClB,iBAAA;;AAKD;;;;AAIG;AACG,SAAU,iBAAiB,CAC/B,KAAa,EACb,KAAe,EACf,cAA8B,EAC9B,MAAe,EAAA;AAEf,IAAA,IAAI,GAAG,GAAG,CAAI,CAAA,EAAA,KAAK,EAAE;IAErB,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE;AAC3B,QAAA,OAAO,GAAG;;IAGZ,GAAG,GAAG,cAAc,CAAC,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC;IAErD,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE;AAC3B,QAAA,OAAO,GAAG;;IAGZ,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE;AAC/B,QAAA,OAAO,OAAO;;AAGhB,IAAA,MAAM,IAAI,KAAK,CAAC,sCAAsC,KAAK,CAAA,CAAA,CAAG,CAAC;AACjE;AAEA;;;;AAIG;AAEG,MAAO,oBAAqB,SAAQ,cAAc,CAAA;AACb,IAAA,MAAA;AAAzC,IAAA,WAAA,CAAyC,MAAc,EAAA;AACrD,QAAA,KAAK,EAAE;QADgC,IAAM,CAAA,MAAA,GAAN,MAAM;;IAItC,iBAAiB,CAAC,KAAU,EAAE,MAAe,EAAA;AACpD,QAAA,MAAM,MAAM,GAAG,mBAAmB,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC;QAEhE,QAAQ,MAAM;YACZ,KAAK,MAAM,CAAC,IAAI;AACd,gBAAA,OAAO,MAAM;YACf,KAAK,MAAM,CAAC,GAAG;AACb,gBAAA,OAAO,KAAK;YACd,KAAK,MAAM,CAAC,GAAG;AACb,gBAAA,OAAO,KAAK;YACd,KAAK,MAAM,CAAC,GAAG;AACb,gBAAA,OAAO,KAAK;YACd,KAAK,MAAM,CAAC,IAAI;AACd,gBAAA,OAAO,MAAM;AACf,YAAA;AACE,gBAAA,OAAO,OAAO;;;AApBT,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,kBACX,SAAS,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHADlB,oBAAoB,EAAA,CAAA;;sGAApB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC;;0BAEc,MAAM;2BAAC,SAAS;;;AC3C/B,MAAM,SAAS,GAAG,KAAK;AAEvB,MAAM,WAAW,GAAa,EAAE;AAkBhC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCG;MAIU,OAAO,CAAA;AAOR,IAAA,KAAA;AACA,IAAA,SAAA;IAPF,cAAc,GAAG,WAAW;AAC5B,IAAA,QAAQ;AAER,IAAA,QAAQ,GAAG,IAAI,GAAG,EAAyB;IAEnD,WACU,CAAA,KAAiB,EACjB,SAAoB,EAAA;QADpB,IAAK,CAAA,KAAA,GAAL,KAAK;QACL,IAAS,CAAA,SAAA,GAAT,SAAS;;IAGnB,IACI,KAAK,CAAC,KAAa,EAAA;QACrB,IAAI,CAAC,cAAc,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,WAAW;;IAGnF,IACI,OAAO,CAAC,KAAkF,EAAA;QAC5F,IAAI,CAAC,QAAQ,GAAG,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,KAAK;;AAGnF;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;IACH,SAAS,GAAA;;AAEP,QAAA,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,cAAc,EAAE;AACvC,YAAA,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC;;;AAIhC,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ;QAC9B,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,YAAY,GAAG,EAAE;AACtD,YAAA,KAAK,MAAM,KAAK,IAAI,QAAQ,EAAE;AAC5B,gBAAA,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC;;;AAE3B,aAAA,IAAI,QAAQ,IAAI,IAAI,EAAE;YAC3B,KAAK,MAAM,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;AACzC,gBAAA,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;;;QAItD,IAAI,CAAC,eAAe,EAAE;;IAGhB,YAAY,CAAC,KAAa,EAAE,WAAoB,EAAA;QACtD,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC;AACtC,QAAA,IAAI,KAAK,KAAK,SAAS,EAAE;AACvB,YAAA,IAAI,KAAK,CAAC,OAAO,KAAK,WAAW,EAAE;AACjC,gBAAA,KAAK,CAAC,OAAO,GAAG,IAAI;AACpB,gBAAA,KAAK,CAAC,OAAO,GAAG,WAAW;;AAE7B,YAAA,KAAK,CAAC,OAAO,GAAG,IAAI;;aACf;YACL,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,EAAC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;;;IAI1E,eAAe,GAAA;AACrB,QAAA,KAAK,MAAM,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AACtC,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,CAAC,CAAC;AAC3B,YAAA,MAAM,KAAK,GAAG,UAAU,CAAC,CAAC,CAAC;AAE3B,YAAA,IAAI,KAAK,CAAC,OAAO,EAAE;gBACjB,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC;AACvC,gBAAA,KAAK,CAAC,OAAO,GAAG,KAAK;;AAChB,iBAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;;;AAGzB,gBAAA,IAAI,KAAK,CAAC,OAAO,EAAE;AACjB,oBAAA,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC;;AAEjC,gBAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC;;AAG7B,YAAA,KAAK,CAAC,OAAO,GAAG,KAAK;;;IAIjB,YAAY,CAAC,KAAa,EAAE,OAAgB,EAAA;QAClD,IAAI,SAAS,EAAE;AACb,YAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;gBAC7B,MAAM,IAAI,KAAK,CACb,CAAiE,8DAAA,EAAAG,UAAS,CAAC,KAAK,CAAC,CAAE,CAAA,CACpF;;;AAGL,QAAA,KAAK,GAAG,KAAK,CAAC,IAAI,EAAE;AACpB,QAAA,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YACpB,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KAAI;gBACvC,IAAI,OAAO,EAAE;AACX,oBAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC;;qBACnD;AACL,oBAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC;;AAE/D,aAAC,CAAC;;;kHArHK,OAAO,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAP,OAAO,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,CAAA,OAAA,EAAA,OAAA,CAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAP,OAAO,EAAA,UAAA,EAAA,CAAA;kBAHnB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,WAAW;AACtB,iBAAA;uGAaK,KAAK,EAAA,CAAA;sBADR,KAAK;uBAAC,OAAO;gBAMV,OAAO,EAAA,CAAA;sBADV,KAAK;uBAAC,SAAS;;;ACtElB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEG;MAKU,iBAAiB,CAAA;AAkCR,IAAA,iBAAA;;;;IA9BX,iBAAiB,GAAqB,IAAI;AAE1C,IAAA,uBAAuB;AACvB,IAAA,yBAAyB;AACzB,IAAA,wBAAwB;AAExB,IAAA,yBAAyB;AAClC;;AAEG;AACM,IAAA,gCAAgC;AAEjC,IAAA,aAAa;AACb,IAAA,UAAU;AAElB;;;;AAIG;AACK,IAAA,WAAW,GAAG,IAAI,GAAG,EAAmB;AAEhD;;;AAGG;AACH,IAAA,IAAI,iBAAiB,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,aAAa,EAAE,QAAQ,IAAI,IAAI;;AAG7C,IAAA,WAAA,CAAoB,iBAAmC,EAAA;QAAnC,IAAiB,CAAA,iBAAA,GAAjB,iBAAiB;;AAE7B,IAAA,+BAA+B,CAAC,OAAsB,EAAA;;;;AAI5D,QAAA,QACE,OAAO,CAAC,2BAA2B,CAAC,KAAK,SAAS;AAClD,YAAA,OAAO,CAAC,kCAAkC,CAAC,KAAK,SAAS;;AAIrD,IAAA,gCAAgC,CAAC,OAAsB,EAAA;;;;AAI7D,QAAA,QACE,OAAO,CAAC,mBAAmB,CAAC,KAAK,SAAS;AAC1C,YAAA,OAAO,CAAC,0BAA0B,CAAC,KAAK,SAAS;AACjD,YAAA,OAAO,CAAC,2BAA2B,CAAC,KAAK,SAAS;AAClD,YAAA,IAAI,CAAC,+BAA+B,CAAC,OAAO,CAAC;;;AAKjD,IAAA,WAAW,CAAC,OAAsB,EAAA;AAChC,QAAA,IAAI,IAAI,CAAC,gCAAgC,CAAC,OAAO,CAAC,EAAE;AAClD,YAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE;AAC9B,YAAA,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE;AACxB,YAAA,IAAI,CAAC,aAAa,GAAG,SAAS;AAE9B,YAAA,IAAI,IAAI,CAAC,iBAAiB,EAAE;gBAC1B,MAAM,QAAQ,GAAG,IAAI,CAAC,yBAAyB,IAAI,IAAI,CAAC,iBAAiB,CAAC,cAAc;AAExF,gBAAA,IAAI,IAAI,CAAC,+BAA+B,CAAC,OAAO,CAAC,EAAE;AACjD,oBAAA,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;AAE1B,oBAAA,IAAI,IAAI,CAAC,yBAAyB,EAAE;AAClC,wBAAA,IAAI,CAAC,UAAU,GAAG,cAAc,CAC9B,IAAI,CAAC,yBAAyB,EAC9B,iBAAiB,CAAC,QAAQ,CAAC,CAC5B;;AACI,yBAAA,IAAI,IAAI,CAAC,gCAAgC,EAAE;AAChD,wBAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,gCAAgC,CAAC,MAAM,CAC5D,iBAAiB,CAAC,QAAQ,CAAC,CAC5B;;yBACI;AACL,wBAAA,IAAI,CAAC,UAAU,GAAG,SAAS;;;AAI/B,gBAAA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,iBAAiB,CAAC,eAAe,CAAC,IAAI,CAAC,iBAAiB,EAAE;oBAClF,QAAQ;oBACR,WAAW,EAAE,IAAI,CAAC,UAAU;oBAC5B,gBAAgB,EAAE,IAAI,CAAC,wBAAwB;AAChD,iBAAA,CAAC;;;;;IAMR,SAAS,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,IAAI,IAAI,CAAC,uBAAuB,EAAE;AAChC,gBAAA,KAAK,MAAM,SAAS,IAAI,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,uBAAuB,CAAC,EAAE;oBACjE,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC;;;AAIzC,YAAA,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC;;;;IAKjD,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE;;AAGpB,IAAA,oBAAoB,CAAC,YAAmC,EAAA;QAC9D,KAAK,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE;YACnD,IAAI,CAAC,OAAO,EAAE;;AAEZ,gBAAA,YAAY,CAAC,QAAQ,CAAC,SAAS,EAAE,SAAS,CAAC;AAC3C,gBAAA,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC;;iBAC7B;;AAEL,gBAAA,YAAY,CAAC,QAAQ,CAAC,SAAS,EAAE,IAAI,CAAC,uBAAwB,CAAC,SAAS,CAAC,CAAC;gBAC1E,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,CAAC;;;;kHAzHjC,iBAAiB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,uBAAA,EAAA,yBAAA,EAAA,yBAAA,EAAA,2BAAA,EAAA,wBAAA,EAAA,0BAAA,EAAA,yBAAA,EAAA,2BAAA,EAAA,gCAAA,EAAA,kCAAA,EAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,qBAAqB;AAC/B,oBAAA,QAAQ,EAAE,mBAAmB;AAC9B,iBAAA;qFAKU,iBAAiB,EAAA,CAAA;sBAAzB;gBAEQ,uBAAuB,EAAA,CAAA;sBAA/B;gBACQ,yBAAyB,EAAA,CAAA;sBAAjC;gBACQ,wBAAwB,EAAA,CAAA;sBAAhC;gBAEQ,yBAAyB,EAAA,CAAA;sBAAjC;gBAIQ,gCAAgC,EAAA,CAAA;sBAAxC;;AAiHH;AACA,SAAS,iBAAiB,CAAC,QAAkB,EAAA;IAC3C,MAAM,cAAc,GAAG,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC;IAChD,OAAO,cAAc,CAAC,QAAQ;AAChC;;AC1MA;;AAEG;MACU,cAAc,CAAA;AAGhB,IAAA,SAAA;AAOA,IAAA,OAAA;AAGA,IAAA,KAAA;AAGA,IAAA,KAAA;AAfT,IAAA,WAAA;;IAES,SAAY;AAEnB;;;;AAIG;IACI,OAAU;;IAGV,KAAa;;IAGb,KAAa,EAAA;QAbb,IAAS,CAAA,SAAA,GAAT,SAAS;QAOT,IAAO,CAAA,OAAA,GAAP,OAAO;QAGP,IAAK,CAAA,KAAA,GAAL,KAAK;QAGL,IAAK,CAAA,KAAA,GAAL,KAAK;;;AAId,IAAA,IAAI,KAAK,GAAA;AACP,QAAA,OAAO,IAAI,CAAC,KAAK,KAAK,CAAC;;;AAIzB,IAAA,IAAI,IAAI,GAAA;QACN,OAAO,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,GAAG,CAAC;;;AAItC,IAAA,IAAI,IAAI,GAAA;AACN,QAAA,OAAO,IAAI,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC;;;AAI7B,IAAA,IAAI,GAAG,GAAA;AACL,QAAA,OAAO,CAAC,IAAI,CAAC,IAAI;;AAEpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiGG;MAIU,OAAO,CAAA;AAmDR,IAAA,cAAA;AACA,IAAA,SAAA;AACA,IAAA,QAAA;AApDV;;;AAGG;IACH,IACI,OAAO,CAAC,OAA+C,EAAA;AACzD,QAAA,IAAI,CAAC,QAAQ,GAAG,OAAO;AACvB,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI;;AAE3B;;;;;;;;;;;;;;;;;AAiBG;IACH,IACI,YAAY,CAAC,EAAsB,EAAA;AACrC,QAAA,IAAI,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAK,EAAE,IAAI,IAAI,IAAI,OAAO,EAAE,KAAK,UAAU,EAAE;YAC7F,OAAO,CAAC,IAAI,CACV,CAA4C,yCAAA,EAAA,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,CAAI,EAAA,CAAA;AAChE,gBAAA,CAAA,kFAAA,CAAoF,CACvF;;AAEH,QAAA,IAAI,CAAC,UAAU,GAAG,EAAE;;AAGtB,IAAA,IAAI,YAAY,GAAA;QACd,OAAO,IAAI,CAAC,UAAU;;IAGhB,QAAQ,GAAyB,IAAI;IACrC,aAAa,GAAY,IAAI;IAC7B,OAAO,GAA6B,IAAI;;;AAGxC,IAAA,UAAU;AAElB,IAAA,WAAA,CACU,cAAgC,EAChC,SAA4C,EAC5C,QAAyB,EAAA;QAFzB,IAAc,CAAA,cAAA,GAAd,cAAc;QACd,IAAS,CAAA,SAAA,GAAT,SAAS;QACT,IAAQ,CAAA,QAAA,GAAR,QAAQ;;AAGlB;;;AAGG;IACH,IACI,aAAa,CAAC,KAAwC,EAAA;;;;QAIxD,IAAI,KAAK,EAAE;AACT,YAAA,IAAI,CAAC,SAAS,GAAG,KAAK;;;AAI1B;;;AAGG;IACH,SAAS,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;AACtB,YAAA,IAAI,CAAC,aAAa,GAAG,KAAK;;AAE1B,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ;AAC3B,YAAA,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK,EAAE;AAC1B,gBAAA,IAAI,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,EAAE;AACjD,oBAAA,IAAI;;;AAGF,wBAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;;AAClE,oBAAA,MAAM;AACN,wBAAA,IAAI,YAAY,GACd,CAA2C,wCAAA,EAAA,KAAK,CAAa,WAAA,CAAA;AAC7D,4BAAA,CAAA,EAAG,WAAW,CAAC,KAAK,CAAC,8DAA8D;AACrF,wBAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;4BAC7B,YAAY,IAAI,yCAAyC;;AAE3D,wBAAA,MAAM,IAAIC,aAAY,CAAyC,KAAA,+CAAA,YAAY,CAAC;;;qBAEzE;;;AAGL,oBAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC;;;;AAIxE,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;AAChD,YAAA,IAAI,OAAO;AAAE,gBAAA,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;;;AAIpC,IAAA,aAAa,CAAC,OAA2B,EAAA;AAC/C,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,cAAc;QACzC,OAAO,CAAC,gBAAgB,CACtB,CACE,IAA6B,EAC7B,qBAAoC,EACpC,YAA2B,KACzB;AACF,YAAA,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,EAAE;;;;AAI9B,gBAAA,aAAa,CAAC,kBAAkB,CAC9B,IAAI,CAAC,SAAS,EACd,IAAI,cAAc,CAAO,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,QAAS,EAAE,EAAE,EAAE,EAAE,CAAC,EAC3D,YAAY,KAAK,IAAI,GAAG,SAAS,GAAG,YAAY,CACjD;;AACI,iBAAA,IAAI,YAAY,IAAI,IAAI,EAAE;AAC/B,gBAAA,aAAa,CAAC,MAAM,CAAC,qBAAqB,KAAK,IAAI,GAAG,SAAS,GAAG,qBAAqB,CAAC;;AACnF,iBAAA,IAAI,qBAAqB,KAAK,IAAI,EAAE;gBACzC,MAAM,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC,qBAAqB,CAAE;AACtD,gBAAA,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC;AACtC,gBAAA,eAAe,CAAC,IAA6C,EAAE,IAAI,CAAC;;AAExE,SAAC,CACF;AAED,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE,EAAE;YAC1D,MAAM,OAAO,GAA0C,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;AAC3E,YAAA,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO;AAC/B,YAAA,OAAO,CAAC,KAAK,GAAG,CAAC;AACjB,YAAA,OAAO,CAAC,KAAK,GAAG,IAAI;AACpB,YAAA,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,QAAS;;AAGlC,QAAA,OAAO,CAAC,qBAAqB,CAAC,CAAC,MAAW,KAAI;YAC5C,MAAM,OAAO,GAA0C,aAAa,CAAC,GAAG,CAAC,MAAM,CAAC,YAAY,CAAC;AAC7F,YAAA,eAAe,CAAC,OAAO,EAAE,MAAM,CAAC;AAClC,SAAC,CAAC;;AAGJ;;;;;AAKG;AACH,IAAA,OAAO,sBAAsB,CAC3B,GAAkB,EAClB,GAAQ,EAAA;AAER,QAAA,OAAO,IAAI;;kHA9JF,OAAO,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,eAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAP,OAAO,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,YAAA,EAAA,cAAA,EAAA,aAAA,EAAA,eAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAP,OAAO,EAAA,UAAA,EAAA,CAAA;kBAHnB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,kBAAkB;AAC7B,iBAAA;6IAOK,OAAO,EAAA,CAAA;sBADV;gBAwBG,YAAY,EAAA,CAAA;sBADf;gBAiCG,aAAa,EAAA,CAAA;sBADhB;;AA2GH,SAAS,eAAe,CACtB,IAAwC,EACxC,MAA+B,EAAA;IAE/B,IAAI,CAAC,OAAO,CAAC,SAAS,GAAG,MAAM,CAAC,IAAI;AACtC;AAEA,SAAS,WAAW,CAAC,IAAS,EAAA;AAC5B,IAAA,OAAO,IAAI,CAAC,MAAM,CAAC,IAAI,OAAO,IAAI;AACpC;;ACtUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0IG;MAIU,IAAI,CAAA;AAQL,IAAA,cAAA;AAPF,IAAA,QAAQ,GAAmB,IAAI,WAAW,EAAK;IAC/C,gBAAgB,GAAuC,IAAI;IAC3D,gBAAgB,GAAuC,IAAI;IAC3D,YAAY,GAA2C,IAAI;IAC3D,YAAY,GAA2C,IAAI;IAEnE,WACU,CAAA,cAAgC,EACxC,WAAwC,EAAA;QADhC,IAAc,CAAA,cAAA,GAAd,cAAc;AAGtB,QAAA,IAAI,CAAC,gBAAgB,GAAG,WAAW;;AAGrC;;AAEG;IACH,IACI,IAAI,CAAC,SAAY,EAAA;AACnB,QAAA,IAAI,CAAC,QAAQ,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,GAAG,SAAS;QACxD,IAAI,CAAC,WAAW,EAAE;;AAGpB;;AAEG;IACH,IACI,QAAQ,CAAC,WAA+C,EAAA;AAC1D,QAAA,cAAc,CAAC,WAAW,EAAE,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAK,UAAU,CAAC;AAC1F,QAAA,IAAI,CAAC,gBAAgB,GAAG,WAAW;AACnC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QACzB,IAAI,CAAC,WAAW,EAAE;;AAGpB;;AAEG;IACH,IACI,QAAQ,CAAC,WAA+C,EAAA;AAC1D,QAAA,cAAc,CAAC,WAAW,EAAE,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAK,UAAU,CAAC;AAC1F,QAAA,IAAI,CAAC,gBAAgB,GAAG,WAAW;AACnC,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QACzB,IAAI,CAAC,WAAW,EAAE;;IAGZ,WAAW,GAAA;AACjB,QAAA,IAAI,IAAI,CAAC,QAAQ,CAAC,SAAS,EAAE;AAC3B,YAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;AACtB,gBAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;AAC3B,gBAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,gBAAA,IAAI,IAAI,CAAC,gBAAgB,EAAE;AACzB,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,kBAAkB,CACxD,IAAI,CAAC,gBAAgB,EACrB,IAAI,CAAC,QAAQ,CACd;;;;aAGA;AACL,YAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;AACtB,gBAAA,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;AAC3B,gBAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,gBAAA,IAAI,IAAI,CAAC,gBAAgB,EAAE;AACzB,oBAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,kBAAkB,CACxD,IAAI,CAAC,gBAAgB,EACrB,IAAI,CAAC,QAAQ,CACd;;;;;;IAOF,OAAO,kBAAkB;AAEhC;;;;;;;AAOG;IACH,OAAO,oBAAoB;AAE3B;;;;;AAKG;AACH,IAAA,OAAO,sBAAsB,CAC3B,GAAY,EACZ,GAAQ,EAAA;AAER,QAAA,OAAO,IAAI;;kHA9FF,IAAI,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAJ,IAAI,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAJ,IAAI,EAAA,UAAA,EAAA,CAAA;kBAHhB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,QAAQ;AACnB,iBAAA;+GAmBK,IAAI,EAAA,CAAA;sBADP;gBAUG,QAAQ,EAAA,CAAA;sBADX;gBAYG,QAAQ,EAAA,CAAA;sBADX;;AA6DH;;AAEG;MACU,WAAW,CAAA;IACf,SAAS,GAAM,IAAK;IACpB,IAAI,GAAM,IAAK;AACvB;AAED,SAAS,cAAc,CACrB,WAAoC,EACpC,QAA+B,EAAA;AAE/B,IAAA,IAAI,WAAW,IAAI,CAAC,WAAW,CAAC,kBAAkB,EAAE;QAClD,MAAM,IAAIA,aAAY,CAAA,IAAA,kDAEpB,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS;YAC5C,CAAG,EAAA,QAAQ,yCAAyCD,UAAS,CAAC,WAAW,CAAC,CAAA,EAAA,CAAI,CACjF;;AAEL;;MClQa,UAAU,CAAA;AAIX,IAAA,iBAAA;AACA,IAAA,YAAA;IAJF,QAAQ,GAAG,KAAK;IAExB,WACU,CAAA,iBAAmC,EACnC,YAAiC,EAAA;QADjC,IAAiB,CAAA,iBAAA,GAAjB,iBAAiB;QACjB,IAAY,CAAA,YAAA,GAAZ,YAAY;;IAGtB,MAAM,GAAA;AACJ,QAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;QACpB,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,IAAI,CAAC,YAAY,CAAC;;IAG9D,OAAO,GAAA;AACL,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;AACrB,QAAA,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE;;AAGhC,IAAA,YAAY,CAAC,OAAgB,EAAA;AAC3B,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAC7B,IAAI,CAAC,MAAM,EAAE;;AACR,aAAA,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,EAAE;YACpC,IAAI,CAAC,OAAO,EAAE;;;AAGnB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEG;MAIU,QAAQ,CAAA;IACX,aAAa,GAAiB,EAAE;IAChC,YAAY,GAAG,KAAK;IACpB,UAAU,GAAG,CAAC;IACd,mBAAmB,GAAG,CAAC;IACvB,iBAAiB,GAAG,KAAK;AACzB,IAAA,SAAS;IAEjB,IACI,QAAQ,CAAC,QAAa,EAAA;AACxB,QAAA,IAAI,CAAC,SAAS,GAAG,QAAQ;AACzB,QAAA,IAAI,IAAI,CAAC,UAAU,KAAK,CAAC,EAAE;AACzB,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;;;;IAKlC,QAAQ,GAAA;AACN,QAAA,OAAO,IAAI,CAAC,UAAU,EAAE;;;AAI1B,IAAA,WAAW,CAAC,IAAgB,EAAA;AAC1B,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC;;;AAI/B,IAAA,UAAU,CAAC,KAAU,EAAA;AACnB,QAAA,MAAM,OAAO,GAAG,KAAK,KAAK,IAAI,CAAC,SAAS;AACxC,QAAA,IAAI,CAAC,iBAAiB,KAAK,OAAO;QAClC,IAAI,CAAC,mBAAmB,EAAE;QAC1B,IAAI,IAAI,CAAC,mBAAmB,KAAK,IAAI,CAAC,UAAU,EAAE;YAChD,IAAI,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC;AACjD,YAAA,IAAI,CAAC,mBAAmB,GAAG,CAAC;AAC5B,YAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK;;AAEhC,QAAA,OAAO,OAAO;;AAGR,IAAA,mBAAmB,CAAC,UAAmB,EAAA;AAC7C,QAAA,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,KAAK,IAAI,CAAC,YAAY,EAAE;AACrE,YAAA,IAAI,CAAC,YAAY,GAAG,UAAU;AAC9B,YAAA,KAAK,MAAM,WAAW,IAAI,IAAI,CAAC,aAAa,EAAE;AAC5C,gBAAA,WAAW,CAAC,YAAY,CAAC,UAAU,CAAC;;;;kHA3C/B,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAHpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACvB,iBAAA;8BAUK,QAAQ,EAAA,CAAA;sBADX;;AAyCH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCG;MAIU,YAAY,CAAA;AAUO,IAAA,QAAA;AATtB,IAAA,KAAK;AACb;;AAEG;AACM,IAAA,YAAY;AAErB,IAAA,WAAA,CACE,aAA+B,EAC/B,WAAgC,EACJ,QAAkB,EAAA;QAAlB,IAAQ,CAAA,QAAA,GAAR,QAAQ;AAEpC,QAAA,IAAI,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAK,CAAC,QAAQ,EAAE;AAChE,YAAA,kCAAkC,CAAC,cAAc,EAAE,cAAc,CAAC;;QAGpE,QAAQ,CAAC,QAAQ,EAAE;QACnB,IAAI,CAAC,KAAK,GAAG,IAAI,UAAU,CAAC,aAAa,EAAE,WAAW,CAAC;;AAGzD;;;AAGG;IACH,SAAS,GAAA;AACP,QAAA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;kHAzB3D,YAAY,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,EAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAHxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC3B,iBAAA;;0BAWI;;0BAAY;yCALN,YAAY,EAAA,CAAA;sBAApB;;AAwBH;;;;;;;;;;;;;AAaG;MAIU,eAAe,CAAA;AAC1B,IAAA,WAAA,CACE,aAA+B,EAC/B,WAAgC,EACZ,QAAkB,EAAA;AAEtC,QAAA,IAAI,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAK,CAAC,QAAQ,EAAE;AAChE,YAAA,kCAAkC,CAAC,iBAAiB,EAAE,iBAAiB,CAAC;;QAG1E,QAAQ,CAAC,WAAW,CAAC,IAAI,UAAU,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;;kHAVvD,eAAe,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,EAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAf,eAAe,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAf,eAAe,EAAA,UAAA,EAAA,CAAA;kBAH3B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mBAAmB;AAC9B,iBAAA;;0BAKI;;0BAAY;;AAUjB,SAAS,kCAAkC,CAAC,QAAgB,EAAE,aAAqB,EAAA;AACjF,IAAA,MAAM,IAAIC,aAAY,CAEpB,IAAA,oDAAA,CAAA,qBAAA,EAAwB,QAAQ,CAAc,YAAA,CAAA;AAC5C,QAAA,CAAA,eAAA,EAAkB,aAAa,CAA+E,6EAAA,CAAA;AAC9G,QAAA,CAAA,+BAAA,CAAiC,CACpC;AACH;;AC/PA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BG;MAIU,QAAQ,CAAA;AAIC,IAAA,aAAA;AAHZ,IAAA,WAAW;IACX,UAAU,GAA8B,EAAE;AAElD,IAAA,WAAA,CAAoB,aAA6B,EAAA;QAA7B,IAAa,CAAA,aAAA,GAAb,aAAa;;IAEjC,IACI,QAAQ,CAAC,KAAa,EAAA;AACxB,QAAA,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;;IAGzB,OAAO,CAAC,KAAa,EAAE,UAAsB,EAAA;AAC3C,QAAA,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,UAAU;;AAG7B,IAAA,WAAW,CAAC,WAAmB,EAAA;QACrC,IAAI,CAAC,WAAW,EAAE;QAElB,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC;AAC1C,QAAA,MAAM,GAAG,GAAG,iBAAiB,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC;QACrE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;;IAGlC,WAAW,GAAA;QACjB,IAAI,IAAI,CAAC,WAAW;AAAE,YAAA,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE;;AAG1C,IAAA,aAAa,CAAC,IAAgB,EAAA;QACpC,IAAI,IAAI,EAAE;AACR,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI;AACvB,YAAA,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE;;;kHA9BlB,QAAQ,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAC,cAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAHpB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,YAAY;AACvB,iBAAA;gFAQK,QAAQ,EAAA,CAAA;sBADX;;AA6BH;;;;;;;;;;;;;;;;;;;AAmBG;MAIU,YAAY,CAAA;AAEa,IAAA,KAAA;AADpC,IAAA,WAAA,CACoC,KAAa,EAC/C,QAA6B,EAC7B,aAA+B,EACvB,QAAkB,EAAA;QAHQ,IAAK,CAAA,KAAA,GAAL,KAAK;QAKvC,MAAM,SAAS,GAAY,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAChD,QAAQ,CAAC,OAAO,CAAC,SAAS,GAAG,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,GAAG,KAAK,EAAE,IAAI,UAAU,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAC;;AARjF,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,YAAY,kBAEV,cAAc,EAAA,SAAA,EAAA,IAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,WAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAFhB,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAHxB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,gBAAgB;AAC3B,iBAAA;;0BAGI,SAAS;2BAAC,cAAc;;0BAGxB;;;AC5FL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCG;MAIU,OAAO,CAAA;AAKR,IAAA,KAAA;AACA,IAAA,QAAA;AACA,IAAA,SAAA;IANF,QAAQ,GAA+C,IAAI;IAC3D,OAAO,GAAmD,IAAI;AAEtE,IAAA,WAAA,CACU,KAAiB,EACjB,QAAyB,EACzB,SAAoB,EAAA;QAFpB,IAAK,CAAA,KAAA,GAAL,KAAK;QACL,IAAQ,CAAA,QAAA,GAAR,QAAQ;QACR,IAAS,CAAA,SAAA,GAAT,SAAS;;IAGnB,IACI,OAAO,CAAC,MAAiD,EAAA;AAC3D,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAM;AACtB,QAAA,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,MAAM,EAAE;AAC3B,YAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE;;;IAItD,SAAS,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AAChB,YAAA,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAS,CAAC;YACjD,IAAI,OAAO,EAAE;AACX,gBAAA,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC;;;;IAKzB,SAAS,CAAC,WAAmB,EAAE,KAAyC,EAAA;AAC9E,QAAA,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC;QAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,SAAS,GAAI,mBAAmB,CAAC,QAAmB;AAE7F,QAAA,IAAI,KAAK,IAAI,IAAI,EAAE;AACjB,YAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CACrB,IAAI,CAAC,KAAK,CAAC,aAAa,EACxB,IAAI,EACJ,IAAI,GAAG,CAAA,EAAG,KAAK,CAAA,EAAG,IAAI,CAAA,CAAE,GAAG,KAAK,EAChC,KAAK,CACN;;aACI;AACL,YAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,IAAI,EAAE,KAAK,CAAC;;;AAI7D,IAAA,aAAa,CAAC,OAAiD,EAAA;AACrE,QAAA,OAAO,CAAC,kBAAkB,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;QACxE,OAAO,CAAC,gBAAgB,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;QACrF,OAAO,CAAC,kBAAkB,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;;kHA9C9E,OAAO,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,eAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAP,OAAO,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAP,OAAO,EAAA,UAAA,EAAA,CAAA;kBAHnB,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,WAAW;AACtB,iBAAA;qIAYK,OAAO,EAAA,CAAA;sBADV,KAAK;uBAAC,SAAS;;;ACrDlB;;;;;;;;;;;;;;;;;;;;;;;AAuBG;MAIU,gBAAgB,CAAA;AAmBP,IAAA,iBAAA;IAlBZ,QAAQ,GAA8B,IAAI;AAElD;;;;;AAKG;IACa,uBAAuB,GAAa,IAAI;AAExD;;AAEG;IACa,gBAAgB,GAA0B,IAAI;;IAG9C,wBAAwB,GAAoB,IAAI;AAEhE,IAAA,WAAA,CAAoB,iBAAmC,EAAA;QAAnC,IAAiB,CAAA,iBAAA,GAAjB,iBAAiB;;AAErC,IAAA,WAAW,CAAC,OAAsB,EAAA;AAChC,QAAA,IAAI,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE;AACrC,YAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,iBAAiB;AAE/C,YAAA,IAAI,IAAI,CAAC,QAAQ,EAAE;AACjB,gBAAA,gBAAgB,CAAC,MAAM,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;;;AAIlE,YAAA,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;AAC1B,gBAAA,IAAI,CAAC,QAAQ,GAAG,IAAI;gBACpB;;;;AAKF,YAAA,MAAM,WAAW,GAAG,IAAI,CAAC,0BAA0B,EAAE;AACrD,YAAA,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,kBAAkB,CAAC,IAAI,CAAC,gBAAgB,EAAE,WAAW,EAAE;AACtF,gBAAA,QAAQ,EAAE,IAAI,CAAC,wBAAwB,IAAI,SAAS;AACrD,aAAA,CAAC;;;AAIN;;;;AAIG;AACK,IAAA,mBAAmB,CAAC,OAAsB,EAAA;AAChD,QAAA,OAAO,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,0BAA0B,CAAC;;AAG/E;;;;AAIG;IACK,0BAA0B,GAAA;AAChC,QAAA,OAAU,IAAI,KAAK,CACjB,EAAE,EACF;YACE,GAAG,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,KAAI;AAC/B,gBAAA,IAAI,CAAC,IAAI,CAAC,uBAAuB,EAAE;AACjC,oBAAA,OAAO,KAAK;;AAEd,gBAAA,OAAO,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,uBAAuB,EAAE,IAAI,EAAE,QAAQ,CAAC;aACjE;YACD,GAAG,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,KAAI;AAC/B,gBAAA,IAAI,CAAC,IAAI,CAAC,uBAAuB,EAAE;AACjC,oBAAA,OAAO,SAAS;;AAElB,gBAAA,OAAO,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,uBAAuB,EAAE,IAAI,EAAE,QAAQ,CAAC;aACjE;AACF,SAAA,CACF;;kHA3EQ,gBAAgB,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;sGAAhB,gBAAgB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,EAAA,uBAAA,EAAA,yBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,wBAAA,EAAA,0BAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;sGAAhB,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAH5B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,oBAAoB;AAC/B,iBAAA;qFAUiB,uBAAuB,EAAA,CAAA;sBAAtC;gBAKe,gBAAgB,EAAA,CAAA;sBAA/B;gBAGe,wBAAwB,EAAA,CAAA;sBAAvC;;;AC5BH;;;AAGG;AACI,MAAM,iBAAiB,GAAe;IAC3C,OAAO;IACP,iBAAiB;IACjB,OAAO;IACP,IAAI;IACJ,gBAAgB;IAChB,OAAO;IACP,QAAQ;IACR,YAAY;IACZ,eAAe;IACf,QAAQ;IACR,YAAY;CACb;;ACxCe,SAAA,wBAAwB,CAAC,IAAe,EAAE,KAAa,EAAA;AACrE,IAAA,OAAO,IAAID,aAAY,CAErB,IAAA,+CAAA,SAAS,IAAI,CAAyB,sBAAA,EAAA,KAAK,CAAe,YAAA,EAAAD,UAAS,CAAC,IAAI,CAAC,CAAA,CAAA,CAAG,CAC7E;AACH;;ACaA,MAAM,oBAAoB,CAAA;IACxB,kBAAkB,CAAC,KAAwB,EAAE,iBAAsB,EAAA;;;;;;;;QAQjE,OAAO,SAAS,CAAC,MACf,KAAK,CAAC,SAAS,CAAC;AACd,YAAA,IAAI,EAAE,iBAAiB;AACvB,YAAA,KAAK,EAAE,CAAC,CAAM,KAAI;AAChB,gBAAA,MAAM,CAAC;aACR;AACF,SAAA,CAAC,CACH;;AAGH,IAAA,OAAO,CAAC,YAA4B,EAAA;;QAElC,SAAS,CAAC,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC;;AAE9C;AAED,MAAM,eAAe,CAAA;IACnB,kBAAkB,CAChB,KAAmB,EACnB,iBAA2C,EAAA;;;;;;;;;;;;;;;;;;;;;;AAuB3C,QAAA,KAAK,CAAC,IAAI;;;AAGR,QAAA,CAAC,CAAC,KAAK,iBAAiB,GAAG,CAAC,CAAC,EAC7B,CAAC,CAAC,KAAI;AACJ,YAAA,MAAM,CAAC;AACT,SAAC,CACF;QACD,OAAO;YACL,WAAW,EAAE,MAAK;gBAChB,iBAAiB,GAAG,IAAI;aACzB;SACF;;AAGH,IAAA,OAAO,CAAC,YAA4B,EAAA;QAClC,YAAY,CAAC,WAAW,EAAE;;AAE7B;AAED,MAAM,gBAAgB,GAAG,IAAI,eAAe,EAAE;AAC9C,MAAM,qBAAqB,GAAG,IAAI,oBAAoB,EAAE;AAExD;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;MAKU,SAAS,CAAA;AACZ,IAAA,IAAI;IACJ,YAAY,GAAQ,IAAI;IACxB,yBAAyB,GAAG,IAAI;IAEhC,aAAa,GAAyC,IAAI;IAC1D,IAAI,GAAgE,IAAI;IACxE,SAAS,GAAgC,IAAI;AAErD,IAAA,WAAA,CAAY,GAAsB,EAAA;;;AAGhC,QAAA,IAAI,CAAC,IAAI,GAAG,GAAG;;IAGjB,WAAW,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,IAAI,CAAC,QAAQ,EAAE;;;;;;AAMjB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;;AAUlB,IAAA,SAAS,CAAI,GAAoE,EAAA;AAC/E,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,IAAI,GAAG,EAAE;AACP,gBAAA,IAAI;;;;AAIF,oBAAA,IAAI,CAAC,yBAAyB,GAAG,KAAK;AACtC,oBAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC;;wBACZ;AACR,oBAAA,IAAI,CAAC,yBAAyB,GAAG,IAAI;;;YAGzC,OAAO,IAAI,CAAC,YAAY;;AAG1B,QAAA,IAAI,GAAG,KAAK,IAAI,CAAC,IAAI,EAAE;YACrB,IAAI,CAAC,QAAQ,EAAE;AACf,YAAA,OAAO,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC;;QAG5B,OAAO,IAAI,CAAC,YAAY;;AAGlB,IAAA,UAAU,CAAC,GAAyD,EAAA;AAC1E,QAAA,IAAI,CAAC,IAAI,GAAG,GAAG;QACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC;QAC1C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,kBAAkB,CAAC,GAAG,EAAE,CAAC,KAAa,KACxE,IAAI,CAAC,kBAAkB,CAAC,GAAG,EAAE,KAAK,CAAC,CACpC;;AAGK,IAAA,eAAe,CACrB,GAAyD,EAAA;AAEzD,QAAA,IAAIG,UAAU,CAAC,GAAG,CAAC,EAAE;AACnB,YAAA,OAAO,gBAAgB;;AAGzB,QAAA,IAAIC,eAAe,CAAC,GAAG,CAAC,EAAE;AACxB,YAAA,OAAO,qBAAqB;;AAG9B,QAAA,MAAM,wBAAwB,CAAC,SAAS,EAAE,GAAG,CAAC;;IAGxC,QAAQ,GAAA;;;QAGd,IAAI,CAAC,SAAU,CAAC,OAAO,CAAC,IAAI,CAAC,aAAc,CAAC;AAC5C,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI;AACxB,QAAA,IAAI,CAAC,aAAa,GAAG,IAAI;AACzB,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;;IAGV,kBAAkB,CAAC,KAAU,EAAE,KAAa,EAAA;AAClD,QAAA,IAAI,KAAK,KAAK,IAAI,CAAC,IAAI,EAAE;AACvB,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,YAAA,IAAI,IAAI,CAAC,yBAAyB,EAAE;AAClC,gBAAA,IAAI,CAAC,IAAI,EAAE,YAAY,EAAE;;;;kHA5FpB,SAAS,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,KAAA,EAAA,CAAA;;sGAAT,SAAS,EAAA,UAAA,EAAA,CAAA;kBAJrB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,OAAO;AACb,oBAAA,IAAI,EAAE,KAAK;AACZ,iBAAA;;;AC3HD;;;;;;;;;;;;;;AAcG;MAIU,aAAa,CAAA;AAOxB,IAAA,SAAS,CAAC,KAAgC,EAAA;QACxC,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,IAAI;AAC9B,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,YAAA,MAAM,wBAAwB,CAAC,aAAa,EAAE,KAAK,CAAC;;AAEtD,QAAA,OAAO,KAAK,CAAC,WAAW,EAAE;;kHAZjB,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA;;sGAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBAHzB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,WAAW;AAClB,iBAAA;;AAiBD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,gBAAgB,GACpB,orPAAorP;AAEtrP;;;;;;;;;;;;;;;;AAgBG;MAIU,aAAa,CAAA;AAOxB,IAAA,SAAS,CAAC,KAAgC,EAAA;QACxC,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,IAAI;AAC9B,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,YAAA,MAAM,wBAAwB,CAAC,aAAa,EAAE,KAAK,CAAC;;AAGtD,QAAA,OAAO,KAAK,CAAC,OAAO,CAClB,gBAAgB,EAChB,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAC3D;;kHAhBQ,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA;;sGAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBAHzB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,WAAW;AAClB,iBAAA;;AAqBD;;;;;;;AAOG;MAIU,aAAa,CAAA;AAOxB,IAAA,SAAS,CAAC,KAAgC,EAAA;QACxC,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,IAAI;AAC9B,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,YAAA,MAAM,wBAAwB,CAAC,aAAa,EAAE,KAAK,CAAC;;AAEtD,QAAA,OAAO,KAAK,CAAC,WAAW,EAAE;;kHAZjB,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAb,aAAa,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA;;sGAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBAHzB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,WAAW;AAClB,iBAAA;;;ACvFD;;;AAGG;AACI,MAAM,mBAAmB,GAAG,YAAY;;ACV/C;;;;;AAKG;AACU,MAAA,0BAA0B,GAAG,IAAI,cAAc,CAC1D,SAAS,GAAG,4BAA4B,GAAG,EAAE;AAG/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BG;AACU,MAAA,yBAAyB,GAAG,IAAI,cAAc,CACzD,SAAS,GAAG,2BAA2B,GAAG,EAAE;AAG9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6JG;MAIU,QAAQ,CAAA;AAEU,IAAA,MAAA;AAC6B,IAAA,eAAA;AACD,IAAA,cAAA;AAHzD,IAAA,WAAA,CAC6B,MAAc,EACe,eAA+B,EAChC,cAAsC,EAAA;QAFlE,IAAM,CAAA,MAAA,GAAN,MAAM;QACuB,IAAe,CAAA,eAAA,GAAf,eAAe;QAChB,IAAc,CAAA,cAAA,GAAd,cAAc;;AAmCvE,IAAA,SAAS,CACP,KAAgD,EAChD,MAAe,EACf,QAAiB,EACjB,MAAe,EAAA;QAEf,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,EAAE,IAAI,KAAK,KAAK,KAAK;AAAE,YAAA,OAAO,IAAI;AAEjE,QAAA,IAAI;YACF,MAAM,OAAO,GAAG,MAAM,IAAI,IAAI,CAAC,cAAc,EAAE,UAAU,IAAI,mBAAmB;AAChF,YAAA,MAAM,SAAS,GACb,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE,QAAQ,IAAI,IAAI,CAAC,eAAe,IAAI,SAAS;AAChF,YAAA,OAAO,UAAU,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC;;QACnE,OAAO,KAAK,EAAE;YACd,MAAM,wBAAwB,CAAC,QAAQ,EAAG,KAAe,CAAC,OAAO,CAAC;;;AArD3D,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,QAAQ,EAET,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,SAAS,EACT,EAAA,EAAA,KAAA,EAAA,0BAA0B,6BAC1B,yBAAyB,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAJxB,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA;;sGAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAHpB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,MAAM;AACb,iBAAA;;0BAGI,MAAM;2BAAC,SAAS;;0BAChB,MAAM;2BAAC,0BAA0B;;0BAAG;;0BACpC,MAAM;2BAAC,yBAAyB;;0BAAG;;;ACnNxC,MAAM,qBAAqB,GAAW,IAAI;AAE1C;;;;;;;;;;;;;AAaG;MAIU,cAAc,CAAA;AACL,IAAA,aAAA;AAApB,IAAA,WAAA,CAAoB,aAA6B,EAAA;QAA7B,IAAa,CAAA,aAAA,GAAb,aAAa;;AAEjC;;;;;;AAMG;AACH,IAAA,SAAS,CACP,KAAgC,EAChC,SAAoC,EACpC,MAAe,EAAA;QAEf,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,EAAE;QAE5B,IAAI,OAAO,SAAS,KAAK,QAAQ,IAAI,SAAS,KAAK,IAAI,EAAE;AACvD,YAAA,MAAM,wBAAwB,CAAC,cAAc,EAAE,SAAS,CAAC;;AAG3D,QAAA,MAAM,GAAG,GAAG,iBAAiB,CAAC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,aAAa,EAAE,MAAM,CAAC;AAExF,QAAA,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,qBAAqB,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC;;kHAvB7D,cAAc,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAF,cAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA;;sGAAd,cAAc,EAAA,UAAA,EAAA,CAAA;kBAH1B,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,YAAY;AACnB,iBAAA;;;ACpBD;;;;;;;;;;;;;;;;AAgBG;MAIU,cAAc,CAAA;AACzB;;;;AAIG;IACH,SAAS,CAAC,KAAgC,EAAE,OAAgC,EAAA;QAC1E,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,EAAE;QAE5B,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC5D,YAAA,MAAM,wBAAwB,CAAC,cAAc,EAAE,OAAO,CAAC;;AAGzD,QAAA,IAAI,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE;AACjC,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC;;AAGvB,QAAA,IAAI,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE;AACnC,YAAA,OAAO,OAAO,CAAC,OAAO,CAAC;;AAGzB,QAAA,OAAO,EAAE;;kHArBA,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAd,cAAc,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA;;sGAAd,cAAc,EAAA,UAAA,EAAA,CAAA;kBAH1B,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,YAAY;AACnB,iBAAA;;;ACrBD;;;;;;;;;;;;;;AAcG;MAKU,QAAQ,CAAA;AACnB;;AAEG;AACH,IAAA,SAAS,CAAC,KAAU,EAAA;QAClB,OAAO,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;;kHAL5B,QAAQ,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAR,QAAQ,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,KAAA,EAAA,CAAA;;sGAAR,QAAQ,EAAA,UAAA,EAAA,CAAA;kBAJpB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,MAAM;AACZ,oBAAA,IAAI,EAAE,KAAK;AACZ,iBAAA;;;ACXD,SAAS,gBAAgB,CAAO,GAAM,EAAE,KAAQ,EAAA;IAC9C,OAAO,EAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAC;AACjC;AAaA;;;;;;;;;;;;;;;;;;;;AAoBG;MAKU,YAAY,CAAA;AACM,IAAA,OAAA;AAA7B,IAAA,WAAA,CAA6B,OAAwB,EAAA;QAAxB,IAAO,CAAA,OAAA,GAAP,OAAO;;AAE5B,IAAA,MAAM;IACN,SAAS,GAA8B,EAAE;IACzC,SAAS,GACf,iBAAiB;AAmCnB,IAAA,SAAS,CACP,KAAkF,EAClF,SAAA,GAAuE,iBAAiB,EAAA;AAExF,QAAA,IAAI,CAAC,KAAK,KAAK,EAAE,KAAK,YAAY,GAAG,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,EAAE;AACpE,YAAA,OAAO,IAAI;;;AAIb,QAAA,IAAI,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,EAAE;QAEjD,MAAM,aAAa,GAAiC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAY,CAAC;AAClF,QAAA,MAAM,gBAAgB,GAAG,SAAS,KAAK,IAAI,CAAC,SAAS;QAErD,IAAI,aAAa,EAAE;AACjB,YAAA,IAAI,CAAC,SAAS,GAAG,EAAE;AACnB,YAAA,aAAa,CAAC,WAAW,CAAC,CAAC,CAA6B,KAAI;AAC1D,gBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,YAAa,CAAC,CAAC;AAC/D,aAAC,CAAC;;AAEJ,QAAA,IAAI,aAAa,IAAI,gBAAgB,EAAE;YACrC,IAAI,SAAS,EAAE;AACb,gBAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC;;AAEhC,YAAA,IAAI,CAAC,SAAS,GAAG,SAAS;;QAE5B,OAAO,IAAI,CAAC,SAAS;;kHAnEZ,YAAY,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,eAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAZ,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,KAAA,EAAA,CAAA;;sGAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,UAAU;AAChB,oBAAA,IAAI,EAAE,KAAK;AACZ,iBAAA;;AAwEe,SAAA,iBAAiB,CAC/B,SAAyB,EACzB,SAAyB,EAAA;AAEzB,IAAA,MAAM,CAAC,GAAG,SAAS,CAAC,GAAG;AACvB,IAAA,MAAM,CAAC,GAAG,SAAS,CAAC,GAAG;;IAEvB,IAAI,CAAC,KAAK,CAAC;AAAE,QAAA,OAAO,CAAC;;IAErB,IAAI,CAAC,IAAI,IAAI;QAAE,OAAO,CAAC,CAAC;IACxB,IAAI,CAAC,IAAI,IAAI;AAAE,QAAA,OAAO,EAAE,CAAC;;IAEzB,IAAI,OAAO,CAAC,IAAI,QAAQ,IAAI,OAAO,CAAC,IAAI,QAAQ,EAAE;AAChD,QAAA,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC;;;IAGvB,IAAI,OAAO,CAAC,IAAI,QAAQ,IAAI,OAAO,CAAC,IAAI,QAAQ,EAAE;QAChD,OAAO,CAAC,GAAG,CAAC;;;IAGd,IAAI,OAAO,CAAC,IAAI,SAAS,IAAI,OAAO,CAAC,IAAI,SAAS,EAAE;AAClD,QAAA,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC;;;AAGvB,IAAA,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC;AACzB,IAAA,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAAC;;IAEzB,OAAO,OAAO,IAAI,OAAO,GAAG,CAAC,GAAG,OAAO,GAAG,OAAO,GAAG,EAAE,GAAG,CAAC;AAC5D;;AC7IA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DG;MAIU,WAAW,CAAA;AACiB,IAAA,OAAA;AAAvC,IAAA,WAAA,CAAuC,OAAe,EAAA;QAAf,IAAO,CAAA,OAAA,GAAP,OAAO;;AAgB9C,IAAA,SAAS,CACP,KAAyC,EACzC,UAAmB,EACnB,MAAe,EAAA;AAEf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;AAAE,YAAA,OAAO,IAAI;AAEhC,QAAA,MAAM,KAAK,IAAI,CAAC,OAAO;AAEvB,QAAA,IAAI;AACF,YAAA,MAAM,GAAG,GAAG,WAAW,CAAC,KAAK,CAAC;YAC9B,OAAO,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,UAAU,CAAC;;QAC5C,OAAO,KAAK,EAAE;YACd,MAAM,wBAAwB,CAAC,WAAW,EAAG,KAAe,CAAC,OAAO,CAAC;;;AA9B9D,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAW,kBACF,SAAS,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHADlB,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,QAAA,EAAA,CAAA;;sGAAX,WAAW,EAAA,UAAA,EAAA,CAAA;kBAHvB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,QAAQ;AACf,iBAAA;;0BAEc,MAAM;2BAAC,SAAS;;AAkC/B;;;;;;;;;;;;;;;;;;;AAmBG;MAIU,WAAW,CAAA;AACiB,IAAA,OAAA;AAAvC,IAAA,WAAA,CAAuC,OAAe,EAAA;QAAf,IAAO,CAAA,OAAA,GAAP,OAAO;;AAS9C;;;;;;;;;;;;;;;AAeG;AACH,IAAA,SAAS,CACP,KAAyC,EACzC,UAAmB,EACnB,MAAe,EAAA;AAEf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;AAAE,YAAA,OAAO,IAAI;AAChC,QAAA,MAAM,KAAK,IAAI,CAAC,OAAO;AACvB,QAAA,IAAI;AACF,YAAA,MAAM,GAAG,GAAG,WAAW,CAAC,KAAK,CAAC;YAC9B,OAAO,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,UAAU,CAAC;;QAC7C,OAAO,KAAK,EAAE;YACd,MAAM,wBAAwB,CAAC,WAAW,EAAG,KAAe,CAAC,OAAO,CAAC;;;AArC9D,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAW,kBACF,SAAS,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHADlB,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA;;sGAAX,WAAW,EAAA,UAAA,EAAA,CAAA;kBAHvB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,SAAS;AAChB,iBAAA;;0BAEc,MAAM;2BAAC,SAAS;;AAyC/B;;;;;;;;;;;;;;;;;;;;AAoBG;MAIU,YAAY,CAAA;AAEM,IAAA,OAAA;AACY,IAAA,oBAAA;IAFzC,WAC6B,CAAA,OAAe,EACH,oBAAA,GAA+B,KAAK,EAAA;QADhD,IAAO,CAAA,OAAA,GAAP,OAAO;QACK,IAAoB,CAAA,oBAAA,GAApB,oBAAoB;;AAwD7D,IAAA,SAAS,CACP,KAAyC,EACzC,YAAA,GAAuB,IAAI,CAAC,oBAAoB,EAChD,OAAkE,GAAA,QAAQ,EAC1E,UAAmB,EACnB,MAAe,EAAA;AAEf,QAAA,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;AAAE,YAAA,OAAO,IAAI;AAEhC,QAAA,MAAM,KAAK,IAAI,CAAC,OAAO;AAEvB,QAAA,IAAI,OAAO,OAAO,KAAK,SAAS,EAAE;AAChC,YAAA,IAAI,CAAC,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,KAAU,OAAO,IAAS,OAAO,CAAC,IAAI,EAAE;AACxF,gBAAA,OAAO,CAAC,IAAI,CACV,CAAA,wMAAA,CAA0M,CAC3M;;YAEH,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM;;AAGvC,QAAA,IAAI,QAAQ,GAAW,YAAY,IAAI,IAAI,CAAC,oBAAoB;AAChE,QAAA,IAAI,OAAO,KAAK,MAAM,EAAE;YACtB,IAAI,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,eAAe,EAAE;AACvD,gBAAA,QAAQ,GAAG,iBAAiB,CAAC,QAAQ,EAAE,OAAO,KAAK,QAAQ,GAAG,MAAM,GAAG,QAAQ,EAAE,MAAM,CAAC;;iBACnF;gBACL,QAAQ,GAAG,OAAO;;;AAItB,QAAA,IAAI;AACF,YAAA,MAAM,GAAG,GAAG,WAAW,CAAC,KAAK,CAAC;AAC9B,YAAA,OAAO,cAAc,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,CAAC;;QACtE,OAAO,KAAK,EAAE;YACd,MAAM,wBAAwB,CAAC,YAAY,EAAG,KAAe,CAAC,OAAO,CAAC;;;kHA5F/D,YAAY,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAEb,SAAS,EAAA,EAAA,EAAA,KAAA,EACT,qBAAqB,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAHpB,YAAY,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,UAAA,EAAA,CAAA;;sGAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAHxB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,UAAU;AACjB,iBAAA;;0BAGI,MAAM;2BAAC,SAAS;;0BAChB,MAAM;2BAAC,qBAAqB;;AA8FjC,SAAS,OAAO,CAAC,KAAyC,EAAA;AACxD,IAAA,OAAO,EAAE,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,EAAE,IAAI,KAAK,KAAK,KAAK,CAAC;AAC5D;AAEA;;AAEG;AACH,SAAS,WAAW,CAAC,KAAsB,EAAA;;AAEzC,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE;AAC1E,QAAA,OAAO,MAAM,CAAC,KAAK,CAAC;;AAEtB,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,QAAA,MAAM,IAAI,KAAK,CAAC,GAAG,KAAK,CAAA,gBAAA,CAAkB,CAAC;;AAE7C,IAAA,OAAO,KAAK;AACd;;AClTA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCG;MAKU,SAAS,CAAA;AAyBpB,IAAA,SAAS,CACP,KAAmD,EACnD,KAAa,EACb,GAAY,EAAA;QAEZ,IAAI,KAAK,IAAI,IAAI;AAAE,YAAA,OAAO,IAAI;AAE9B,QAAA,MAAM,QAAQ,GAAG,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;QAElE,IAAI,CAAC,QAAQ,EAAE;AACb,YAAA,MAAM,wBAAwB,CAAC,SAAS,EAAE,KAAK,CAAC;;QAGlD,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC;;kHAtCrB,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA;gHAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,OAAA,EAAA,IAAA,EAAA,KAAA,EAAA,CAAA;;sGAAT,SAAS,EAAA,UAAA,EAAA,CAAA;kBAJrB,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,OAAO;AACb,oBAAA,IAAI,EAAE,KAAK;AACZ,iBAAA;;;AC1CD;;;;AAIG;AAgCH;;AAEG;AACI,MAAM,YAAY,GAAG;IAC1B,SAAS;IACT,aAAa;IACb,aAAa;IACb,QAAQ;IACR,SAAS;IACT,WAAW;IACX,WAAW;IACX,aAAa;IACb,YAAY;IACZ,QAAQ;IACR,cAAc;IACd,cAAc;IACd,YAAY;CACb;;AChDD;AACA;AACA;;;;;;;AAOG;MAKU,YAAY,CAAA;kHAAZ,YAAY,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;mHAAZ,YAAY,EAAA,OAAA,EAAA,CAAAG,OAAA,EAAAC,iBAAA,EAAAC,OAAA,EAAAC,IAAA,EAAAC,gBAAA,EAAAC,OAAA,EAAAC,QAAA,EAAAC,YAAA,EAAAC,eAAA,EAAAC,QAAA,EAAAC,YAAA,EAAAC,SAAA,EAAAC,aAAA,EAAAC,aAAA,EAAAC,QAAA,EAAAC,SAAA,EAAAC,WAAA,EAAAC,WAAA,EAAAC,aAAA,EAAAC,YAAA,EAAAC,QAAA,EAAAC,cAAA,EAAAC,cAAA,EAAAC,YAAA,CAAA,EAAA,OAAA,EAAA,CAAAvB,OAAA,EAAAC,iBAAA,EAAAC,OAAA,EAAAC,IAAA,EAAAC,gBAAA,EAAAC,OAAA,EAAAC,QAAA,EAAAC,YAAA,EAAAC,eAAA,EAAAC,QAAA,EAAAC,YAAA,EAAAC,SAAA,EAAAC,aAAA,EAAAC,aAAA,EAAAC,QAAA,EAAAC,SAAA,EAAAC,WAAA,EAAAC,WAAA,EAAAC,aAAA,EAAAC,YAAA,EAAAC,QAAA,EAAAC,cAAA,EAAAC,cAAA,EAAAC,YAAA,CAAA,EAAA,CAAA;mHAAZ,YAAY,EAAA,CAAA;;sGAAZ,YAAY,EAAA,UAAA,EAAA,CAAA;kBAJxB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,OAAO,EAAE,CAAC,iBAAiB,EAAE,YAAY,CAAC;AAC1C,oBAAA,OAAO,EAAE,CAAC,iBAAiB,EAAE,YAAY,CAAC;AAC3C,iBAAA;;;;;"}/ x/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import { InjectionToken } from '@angular/core'; /** * A DI Token representing the main rendering context. * In a browser and SSR this is the DOM Document. * When using SSR, that document is created by [Domino](https://github.com/angular/domino). * * @publicApi */ const DOCUMENT = new InjectionToken(ngDevMode ? 'DocumentToken' : ''); export { DOCUMENT }; //# sourceMappingURL=dom_tokens-rA0ACyx7.mjs.map а6x`{"version":3,"file":"dom_tokens-rA0ACyx7.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/dom_tokens.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {InjectionToken} from '@angular/core';\n\n/**\n * A DI Token representing the main rendering context.\n * In a browser and SSR this is the DOM Document.\n * When using SSR, that document is created by [Domino](https://github.com/angular/domino).\n *\n * @publicApi\n */\nexport const DOCUMENT = new InjectionToken(ngDevMode ? 'DocumentToken' : '');\n"],"names":[],"mappings":";;;;;;;;AAUA;;;;;;AAMG;AACU,MAAA,QAAQ,GAAG,IAAI,cAAc,CAAW,SAAS,GAAG,eAAe,GAAG,EAAE;;;;"}BxxG/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import { HttpErrorResponse, HttpEventType, HttpClient, HttpHeaders, HttpParams, HttpRequest, HTTP_ROOT_INTERCEPTOR_FNS, HttpResponse } from './module-z3bvLlVg.mjs'; export { FetchBackend, HTTP_INTERCEPTORS, HttpBackend, HttpClientJsonpModule, HttpClientModule, HttpClientXsrfModule, HttpContext, HttpContextToken, HttpFeatureKind, HttpHandler, HttpHeaderResponse, HttpResponseBase, HttpStatusCode, HttpUrlEncodingCodec, HttpXhrBackend, HttpXsrfTokenExtractor, JsonpClientBackend, JsonpInterceptor, provideHttpClient, withFetch, withInterceptors, withInterceptorsFromDi, withJsonpSupport, withNoXsrfProtection, withRequestsMadeViaParent, withXsrfConfiguration, HttpInterceptorHandler as ɵHttpInterceptingHandler, HttpInterceptorHandler as ɵHttpInterceptorHandler, REQUESTS_CONTRIBUTE_TO_STABILITY as ɵREQUESTS_CONTRIBUTE_TO_STABILITY } from './module-z3bvLlVg.mjs'; import { assertInInjectionContext, inject, Injector, ɵResourceImpl as _ResourceImpl, linkedSignal, computed, ResourceStatus, signal, InjectionToken, APP_BOOTSTRAP_LISTENER, ɵperformanceMarkFeature as _performanceMarkFeature, ApplicationRef, TransferState, ɵRuntimeError as _RuntimeError, makeStateKey, ɵtruncateMiddle as _truncateMiddle, ɵformatRuntimeError as _formatRuntimeError } from '@angular/core'; import { of } from 'rxjs'; import { tap } from 'rxjs/operators'; import './xhr-BfNfxNDv.mjs'; import './dom_tokens-rA0ACyx7.mjs'; /** * `httpResource` makes a reactive HTTP request and exposes the request status and response value as * a `WritableResource`. By default, it assumes that the backend will return JSON data. To make a * request that expects a different kind of data, you can use a sub-constructor of `httpResource`, * such as `httpResource.text`. * * @experimental * @initializerApiFunction */ const httpResource = (() => { const jsonFn = makeHttpResourceFn('json'); jsonFn.arrayBuffer = makeHttpResourceFn('arraybuffer'); jsonFn.blob = makeHttpResourceFn('blob'); jsonFn.text = makeHttpResourceFn('text'); return jsonFn; })(); function makeHttpResourceFn(responseType) { return function httpResourceRef(request, options) { options?.injector || assertInInjectionContext(httpResource); const injector = options?.injector ?? inject(Injector); return new HttpResourceImpl(injector, () => normalizeRequest(request, responseType), options?.defaultValue, options?.parse, options?.equal); }; } function normalizeRequest(request, responseType) { let unwrappedRequest = typeof request === 'function' ? request() : request; if (unwrappedRequest === undefined) { return undefined; } else if (typeof unwrappedRequest === 'string') { unwrappedRequest = { url: unwrappedRequest }; } const headers = unwrappedRequest.headers instanceof HttpHeaders ? unwrappedRequest.headers : new HttpHeaders(unwrappedRequest.headers); const params = unwrappedRequest.params instanceof HttpParams ? unwrappedRequest.params : new HttpParams({ fromObject: unwrappedRequest.params }); return new HttpRequest(unwrappedRequest.method ?? 'GET', unwrappedRequest.url, unwrappedRequest.body ?? null, { headers, params, reportProgress: unwrappedRequest.reportProgress, withCredentials: unwrappedRequest.withCredentials, responseType, context: unwrappedRequest.context, transferCache: unwrappedRequest.transferCache, }); } class HttpResourceImpl extends _ResourceImpl { client; _headers = linkedSignal({ source: this.extRequest, computation: () => undefined, }); _progress = linkedSignal({ source: this.extRequest, computation: () => undefined, }); _statusCode = linkedSignal({ source: this.extRequest, computation: () => undefined, }); headers = computed(() => this.status() === ResourceStatus.Resolved || this.status() === ResourceStatus.Error ? this._headers() : undefined); progress = this._progress.asReadonly(); statusCode = this._statusCode.asReadonly(); constructor(injector, request, defaultValue, parse, equal) { super(request, ({ request, abortSignal }) => { let sub; // Track the abort listener so it can be removed if the Observable completes (as a memory // optimization). const onAbort = () => sub.unsubscribe(); abortSignal.addEventListener('abort', onAbort); // Start off stream as undefined. const stream = signal({ value: undefined }); let resolve; const promise = new Promise((r) => (resolve = r)); const send = (value) => { stream.set(value); resolve?.(stream); resolve = undefined; }; sub = this.client.request(request).subscribe({ next: (event) => { switch (event.type) { case HttpEventType.Response: this._headers.set(event.headers); this._statusCode.set(event.status); try { send({ value: parse ? parse(event.body) : event.body }); } catch (error) { send({ error }); } break; case HttpEventType.DownloadProgress: this._progress.set(event); break; } }, error: (error) => { if (error instanceof HttpErrorResponse) { this._headers.set(error.headers); this._statusCode.set(error.status); } send({ error }); abortSignal.removeEventListener('abort', onAbort); }, complete: () => { if (resolve) { send({ error: new Error('Resource completed before producing a value') }); } abortSignal.removeEventListener('abort', onAbort); }, }); return promise; }, defaultValue, equal, injector); this.client = injector.get(HttpClient); } } /** * If your application uses different HTTP origins to make API calls (via `HttpClient`) on the server and * on the client, the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token allows you to establish a mapping * between those origins, so that `HttpTransferCache` feature can recognize those requests as the same * ones and reuse the data cached on the server during hydration on the client. * * **Important note**: the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token should *only* be provided in * the *server* code of your application (typically in the `app.server.config.ts` script). Angular throws an * error if it detects that the token is defined while running on the client. * * @usageNotes * * When the same API endpoint is accessed via `http://internal-domain.com:8080` on the server and * via `https://external-domain.com` on the client, you can use the following configuration: * ```ts * // in app.server.config.ts * { * provide: HTTP_TRANSFER_CACHE_ORIGIN_MAP, * useValue: { * 'http://internal-domain.com:8080': 'https://external-domain.com' * } * } * ``` * * @publicApi */ const HTTP_TRANSFER_CACHE_ORIGIN_MAP = new InjectionToken(ngDevMode ? 'HTTP_TRANSFER_CACHE_ORIGIN_MAP' : ''); /** * Keys within cached response data structure. */ const BODY = 'b'; const HEADERS = 'h'; const STATUS = 's'; const STATUS_TEXT = 'st'; const REQ_URL = 'u'; const RESPONSE_TYPE = 'rt'; const CACHE_OPTIONS = new InjectionToken(ngDevMode ? 'HTTP_TRANSFER_STATE_CACHE_OPTIONS' : ''); /** * A list of allowed HTTP methods to cache. */ const ALLOWED_METHODS = ['GET', 'HEAD']; function transferCacheInterceptorFn(req, next) { const { isCacheActive, ...globalOptions } = inject(CACHE_OPTIONS); const { transferCache: requestOptions, method: requestMethod } = req; // In the following situations we do not want to cache the request if (!isCacheActive || requestOptions === false || // POST requests are allowed either globally or at request level (requestMethod === 'POST' && !globalOptions.includePostRequests && !requestOptions) || (requestMethod !== 'POST' && !ALLOWED_METHODS.includes(requestMethod)) || // Do not cache request that require authorization when includeRequestsWithAuthHeaders is falsey (!globalOptions.includeRequestsWithAuthHeaders && hasAuthHeaders(req)) || globalOptions.filter?.(req) === false) { return next(req); } const transferState = inject(TransferState); const originMap = inject(HTTP_TRANSFER_CACHE_ORIGIN_MAP, { optional: true, }); if (typeof ngServerMode !== 'undefined' && !ngServerMode && originMap) { throw new _RuntimeError(2803 /* RuntimeErrorCode.HTTP_ORIGIN_MAP_USED_IN_CLIENT */, ngDevMode && 'Angular detected that the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token is configured and ' + 'present in the client side code. Please ensure that this token is only provided in the ' + 'server code of the application.'); } const requestUrl = typeof ngServerMode !== 'undefined' && ngServerMode && originMap ? mapRequestOriginUrl(req.url, originMap) : req.url; const storeKey = makeCacheKey(req, requestUrl); const response = transferState.get(storeKey, null); let headersToInclude = globalOptions.includeHeaders; if (typeof requestOptions === 'object' && requestOptions.includeHeaders) { // Request-specific config takes precedence over the global config. headersToInclude = requestOptions.includeHeaders; } if (response) { const { [BODY]: undecodedBody, [RESPONSE_TYPE]: responseType, [HEADERS]: httpHeaders, [STATUS]: status, [STATUS_TEXT]: statusText, [REQ_URL]: url, } = response; // Request found in cache. Respond using it. let body = undecodedBody; switch (responseType) { case 'arraybuffer': body = new TextEncoder().encode(undecodedBody).buffer; break; case 'blob': body = new Blob([undecodedBody]); break; } // We want to warn users accessing a header provided from the cache // That HttpTransferCache alters the headers // The warning will be logged a single time by HttpHeaders instance let headers = new HttpHeaders(httpHeaders); if (typeof ngDevMode === 'undefined' || ngDevMode) { // Append extra logic in dev mode to produce a warning when a header // that was not transferred to the client is accessed in the code via `get` // and `has` calls. headers = appendMissingHeadersDetection(req.url, headers, headersToInclude ?? []); } return of(new HttpResponse({ body, headers, status, statusText, url, })); } // Request not found in cache. Make the request and cache it if on the server. return next(req).pipe(tap((event) => { if (event instanceof HttpResponse && typeof ngServerMode !== 'undefined' && ngServerMode) { transferState.set(storeKey, { [BODY]: event.body, [HEADERS]: getFilteredHeaders(event.headers, headersToInclude), [STATUS]: event.status, [STATUS_TEXT]: event.statusText, [REQ_URL]: requestUrl, [RESPONSE_TYPE]: req.responseType, }); } })); } /** @returns true when the requests contains autorization related headers. */ function hasAuthHeaders(req) { return req.headers.has('authorization') || req.headers.has('proxy-authorization'); } function getFilteredHeaders(headers, includeHeaders) { if (!includeHeaders) { return {}; } const headersMap = {}; for (const key of includeHeaders) { const values = headers.getAll(key); if (values !== null) { headersMap[key] = values; } } return headersMap; } function sortAndConcatParams(params) { return [...params.keys()] .sort() .map((k) => `${k}=${params.getAll(k)}`) .join('&'); } function makeCacheKey(request, mappedRequestUrl) { // make the params encoded same as a url so it's easy to identify const { params, method, responseType } = request; const encodedParams = sortAndConcatParams(params); let serializedBody = request.serializeBody(); if (serializedBody instanceof URLSearchParams) { serializedBody = sortAndConcatParams(serializedBody); } else if (typeof serializedBody !== 'string') { serializedBody = ''; } const key = [method, responseType, mappedRequestUrl, serializedBody, encodedParams].join('|'); const hash = generateHash(key); return makeStateKey(hash); } /** * A method that returns a hash representation of a string using a variant of DJB2 hash * algorithm. * * This is the same hashing logic that is used to generate component ids. */ function generateHash(value) { let hash = 0; for (const char of value) { hash = (Math.imul(31, hash) + char.charCodeAt(0)) << 0; } // Force positive number hash. // 2147483647 = equivalent of Integer.MAX_VALUE. hash += 2147483647 + 1; return hash.toString(); } /** * Returns the DI providers needed to enable HTTP transfer cache. * * By default, when using server rendering, requests are performed twice: once on the server and * other one on the browser. * * When these providers are added, requests performed on the server are cached and reused during the * bootstrapping of the application in the browser thus avoiding duplicate requests and reducing * load time. * */ function withHttpTransferCache(cacheOptions) { return [ { provide: CACHE_OPTIONS, useFactory: () => { _performanceMarkFeature('NgHttpTransferCache'); return { isCacheActive: true, ...cacheOptions }; }, }, { provide: HTTP_ROOT_INTERCEPTOR_FNS, useValue: transferCacheInterceptorFn, multi: true, }, { provide: APP_BOOTSTRAP_LISTENER, multi: true, useFactory: () => { const appRef = inject(ApplicationRef); const cacheState = inject(CACHE_OPTIONS); return () => { appRef.whenStable().then(() => { cacheState.isCacheActive = false; }); }; }, }, ]; } /** * This function will add a proxy to an HttpHeader to intercept calls to get/has * and log a warning if the header entry requested has been removed */ function appendMissingHeadersDetection(url, headers, headersToInclude) { const warningProduced = new Set(); return new Proxy(headers, { get(target, prop) { const value = Reflect.get(target, prop); const methods = new Set(['get', 'has', 'getAll']); if (typeof value !== 'function' || !methods.has(prop)) { return value; } return (headerName) => { // We log when the key has been removed and a warning hasn't been produced for the header const key = (prop + ':' + headerName).toLowerCase(); // e.g. `get:cache-control` if (!headersToInclude.includes(headerName) && !warningProduced.has(key)) { warningProduced.add(key); const truncatedUrl = _truncateMiddle(url); // TODO: create Error guide for this warning console.warn(_formatRuntimeError(2802 /* RuntimeErrorCode.HEADERS_ALTERED_BY_TRANSFER_CACHE */, `Angular detected that the \`${headerName}\` header is accessed, but the value of the header ` + `was not transferred from the server to the client by the HttpTransferCache. ` + `To include the value of the \`${headerName}\` header for the \`${truncatedUrl}\` request, ` + `use the \`includeHeaders\` list. The \`includeHeaders\` can be defined either ` + `on a request level by adding the \`transferCache\` parameter, or on an application ` + `level by adding the \`httpCacheTransfer.includeHeaders\` argument to the ` + `\`provideClientHydration()\` call. `)); } // invoking the original method return value.apply(target, [headerName]); }; }, }); } function mapRequestOriginUrl(url, originMap) { const origin = new URL(url, 'resolve://').origin; const mappedOrigin = originMap[origin]; if (!mappedOrigin) { return url; } if (typeof ngDevMode === 'undefined' || ngDevMode) { verifyMappedOrigin(mappedOrigin); } return url.replace(origin, mappedOrigin); } function verifyMappedOrigin(url) { if (new URL(url, 'resolve://').pathname !== '/') { throw new _RuntimeError(2804 /* RuntimeErrorCode.HTTP_ORIGIN_MAP_CONTAINS_PATH */, 'Angular detected a URL with a path segment in the value provided for the ' + `\`HTTP_TRANSFER_CACHE_ORIGIN_MAP\` token: ${url}. The map should only contain origins ` + 'without any other segments.'); } } export { HTTP_TRANSFER_CACHE_ORIGIN_MAP, HttpClient, HttpErrorResponse, HttpEventType, HttpHeaders, HttpParams, HttpRequest, HttpResponse, httpResource, HTTP_ROOT_INTERCEPTOR_FNS as ɵHTTP_ROOT_INTERCEPTOR_FNS, withHttpTransferCache as ɵwithHttpTransferCache }; //# sourceMappingURL=http.mjs.map b2ixF`{"version":3,"file":"http.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/src/resource.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/src/transfer_cache.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n Injector,\n Signal,\n ɵResourceImpl as ResourceImpl,\n inject,\n linkedSignal,\n assertInInjectionContext,\n signal,\n ResourceStatus,\n computed,\n Resource,\n WritableSignal,\n ResourceStreamItem,\n type ValueEqualityFn,\n} from '@angular/core';\nimport {Subscription} from 'rxjs';\n\nimport {HttpRequest} from './request';\nimport {HttpClient} from './client';\nimport {HttpErrorResponse, HttpEventType, HttpProgressEvent, HttpResponseBase} from './response';\nimport {HttpHeaders} from './headers';\nimport {HttpParams} from './params';\nimport {HttpResourceRef, HttpResourceOptions, HttpResourceRequest} from './resource_api';\n\n/**\n * Type for the `httpRequest` top-level function, which includes the call signatures for the JSON-\n * based `httpRequest` as well as sub-functions for `ArrayBuffer`, `Blob`, and `string` type\n * requests.\n *\n * @experimental\n */\nexport interface HttpResourceFn {\n /**\n * Create a `Resource` that fetches data with an HTTP GET request to the given URL.\n *\n * If a reactive function is passed for the URL, the resource will update when the URL changes via\n * signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed as JSON by default - use a sub-function of\n * `httpResource`, such as `httpResource.text()`, to parse the response differently.\n *\n * @experimental\n */\n (\n url: string | (() => string | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n /**\n * Create a `Resource` that fetches data with an HTTP GET request to the given URL.\n *\n * If a reactive function is passed for the URL, the resource will update when the URL changes via\n * signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed as JSON by default - use a sub-function of\n * `httpResource`, such as `httpResource.text()`, to parse the response differently.\n *\n * @experimental\n */\n (\n url: string | (() => string | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n\n /**\n * Create a `Resource` that fetches data with the configured HTTP request.\n *\n * If a reactive function is passed for the request, the resource will update when the request\n * changes via signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed as JSON by default - use a sub-function of\n * `httpResource`, such as `httpResource.text()`, to parse the response differently.\n *\n * @experimental\n */\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n /**\n * Create a `Resource` that fetches data with the configured HTTP request.\n *\n * If a reactive function is passed for the request, the resource will update when the request\n * changes via signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed as JSON by default - use a sub-function of\n * `httpResource`, such as `httpResource.text()`, to parse the response differently.\n *\n * @experimental\n */\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n\n /**\n * Create a `Resource` that fetches data with the configured HTTP request.\n *\n * If a reactive function is passed for the URL or request, the resource will update when the\n * URL or request changes via signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed into an `ArrayBuffer`.\n *\n * @experimental\n */\n arrayBuffer: {\n (\n url: string | (() => string | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n url: string | (() => string | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n };\n\n /**\n * Create a `Resource` that fetches data with the configured HTTP request.\n *\n * If a reactive function is passed for the URL or request, the resource will update when the\n * URL or request changes via signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed into a `Blob`.\n *\n * @experimental\n */\n blob: {\n (\n url: string | (() => string | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n url: string | (() => string | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n };\n\n /**\n * Create a `Resource` that fetches data with the configured HTTP request.\n *\n * If a reactive function is passed for the URL or request, the resource will update when the\n * URL or request changes via signals.\n *\n * Uses `HttpClient` to make requests and supports interceptors, testing, and the other features\n * of the `HttpClient` API. Data is parsed as a `string`.\n *\n * @experimental\n */\n text: {\n (\n url: string | (() => string | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n url: string | (() => string | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options: HttpResourceOptions & {defaultValue: NoInfer},\n ): HttpResourceRef;\n\n (\n request: HttpResourceRequest | (() => HttpResourceRequest | undefined),\n options?: HttpResourceOptions,\n ): HttpResourceRef;\n };\n}\n\n/**\n * `httpResource` makes a reactive HTTP request and exposes the request status and response value as\n * a `WritableResource`. By default, it assumes that the backend will return JSON data. To make a\n * request that expects a different kind of data, you can use a sub-constructor of `httpResource`,\n * such as `httpResource.text`.\n *\n * @experimental\n * @initializerApiFunction\n */\nexport const httpResource: HttpResourceFn = (() => {\n const jsonFn = makeHttpResourceFn('json') as HttpResourceFn;\n jsonFn.arrayBuffer = makeHttpResourceFn('arraybuffer');\n jsonFn.blob = makeHttpResourceFn('blob');\n jsonFn.text = makeHttpResourceFn('text');\n return jsonFn;\n})();\n\ntype RawRequestType =\n | string\n | (() => string | undefined)\n | HttpResourceRequest\n | (() => HttpResourceRequest | undefined);\n\nfunction makeHttpResourceFn(responseType: 'arraybuffer' | 'blob' | 'json' | 'text') {\n return function httpResourceRef(\n request: RawRequestType,\n options?: HttpResourceOptions,\n ): HttpResourceRef {\n options?.injector || assertInInjectionContext(httpResource);\n const injector = options?.injector ?? inject(Injector);\n return new HttpResourceImpl(\n injector,\n () => normalizeRequest(request, responseType),\n options?.defaultValue,\n options?.parse as (value: unknown) => TResult,\n options?.equal as ValueEqualityFn,\n ) as HttpResourceRef;\n };\n}\n\nfunction normalizeRequest(\n request: RawRequestType,\n responseType: 'arraybuffer' | 'blob' | 'json' | 'text',\n): HttpRequest | undefined {\n let unwrappedRequest = typeof request === 'function' ? request() : request;\n if (unwrappedRequest === undefined) {\n return undefined;\n } else if (typeof unwrappedRequest === 'string') {\n unwrappedRequest = {url: unwrappedRequest};\n }\n\n const headers =\n unwrappedRequest.headers instanceof HttpHeaders\n ? unwrappedRequest.headers\n : new HttpHeaders(\n unwrappedRequest.headers as\n | Record>\n | undefined,\n );\n\n const params =\n unwrappedRequest.params instanceof HttpParams\n ? unwrappedRequest.params\n : new HttpParams({fromObject: unwrappedRequest.params});\n\n return new HttpRequest(\n unwrappedRequest.method ?? 'GET',\n unwrappedRequest.url,\n unwrappedRequest.body ?? null,\n {\n headers,\n params,\n reportProgress: unwrappedRequest.reportProgress,\n withCredentials: unwrappedRequest.withCredentials,\n responseType,\n context: unwrappedRequest.context,\n transferCache: unwrappedRequest.transferCache,\n },\n );\n}\nclass HttpResourceImpl\n extends ResourceImpl | undefined>\n implements HttpResourceRef\n{\n private client!: HttpClient;\n private _headers = linkedSignal({\n source: this.extRequest,\n computation: () => undefined as HttpHeaders | undefined,\n });\n private _progress = linkedSignal({\n source: this.extRequest,\n computation: () => undefined as HttpProgressEvent | undefined,\n });\n private _statusCode = linkedSignal({\n source: this.extRequest,\n computation: () => undefined as number | undefined,\n });\n\n readonly headers = computed(() =>\n this.status() === ResourceStatus.Resolved || this.status() === ResourceStatus.Error\n ? this._headers()\n : undefined,\n );\n readonly progress = this._progress.asReadonly();\n readonly statusCode = this._statusCode.asReadonly();\n\n constructor(\n injector: Injector,\n request: () => HttpRequest | undefined,\n defaultValue: T,\n parse?: (value: unknown) => T,\n equal?: ValueEqualityFn,\n ) {\n super(\n request,\n ({request, abortSignal}) => {\n let sub: Subscription;\n\n // Track the abort listener so it can be removed if the Observable completes (as a memory\n // optimization).\n const onAbort = () => sub.unsubscribe();\n abortSignal.addEventListener('abort', onAbort);\n\n // Start off stream as undefined.\n const stream = signal>({value: undefined as T});\n let resolve: ((value: Signal>) => void) | undefined;\n const promise = new Promise>>((r) => (resolve = r));\n\n const send = (value: ResourceStreamItem): void => {\n stream.set(value);\n resolve?.(stream);\n resolve = undefined;\n };\n\n sub = this.client.request(request!).subscribe({\n next: (event) => {\n switch (event.type) {\n case HttpEventType.Response:\n this._headers.set(event.headers);\n this._statusCode.set(event.status);\n try {\n send({value: parse ? parse(event.body) : (event.body as T)});\n } catch (error) {\n send({error});\n }\n break;\n case HttpEventType.DownloadProgress:\n this._progress.set(event);\n break;\n }\n },\n error: (error) => {\n if (error instanceof HttpErrorResponse) {\n this._headers.set(error.headers);\n this._statusCode.set(error.status);\n }\n\n send({error});\n abortSignal.removeEventListener('abort', onAbort);\n },\n complete: () => {\n if (resolve) {\n send({error: new Error('Resource completed before producing a value')});\n }\n abortSignal.removeEventListener('abort', onAbort);\n },\n });\n\n return promise;\n },\n defaultValue,\n equal,\n injector,\n );\n this.client = injector.get(HttpClient);\n }\n\n // This is a type only override of the method\n declare hasValue: () => this is HttpResourceRef>;\n}\n\n/**\n * A `Resource` of the `HttpResponse` meant for use in `HttpResource` if we decide to go this route.\n *\n * TODO(alxhub): delete this if we decide we don't want it.\n */\nclass HttpResponseResource implements Resource {\n readonly status: Signal;\n readonly value: WritableSignal;\n readonly error: Signal;\n readonly isLoading: Signal;\n\n constructor(\n private parent: Resource,\n request: Signal,\n ) {\n this.status = computed(() => {\n // There are two kinds of errors which can occur in an HTTP request: HTTP errors or normal JS\n // errors. Since we have a response for HTTP errors, we report `Resolved` status even if the\n // overall request is considered to be in an Error state.\n if (parent.status() === ResourceStatus.Error) {\n return this.value() !== undefined ? ResourceStatus.Resolved : ResourceStatus.Error;\n }\n return parent.status();\n });\n this.error = computed(() => {\n // Filter out HTTP errors.\n return this.value() === undefined ? parent.error() : undefined;\n });\n this.value = linkedSignal({\n source: request,\n computation: () => undefined as HttpResponseBase | undefined,\n });\n this.isLoading = parent.isLoading;\n }\n\n hasValue(): this is Resource {\n return this.value() !== undefined;\n }\n\n reload(): boolean {\n // TODO: should you be able to reload this way?\n return this.parent.reload();\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n APP_BOOTSTRAP_LISTENER,\n ApplicationRef,\n inject,\n InjectionToken,\n makeStateKey,\n Provider,\n StateKey,\n TransferState,\n ɵformatRuntimeError as formatRuntimeError,\n ɵperformanceMarkFeature as performanceMarkFeature,\n ɵtruncateMiddle as truncateMiddle,\n ɵRuntimeError as RuntimeError,\n} from '@angular/core';\nimport {Observable, of} from 'rxjs';\nimport {tap} from 'rxjs/operators';\n\nimport {RuntimeErrorCode} from './errors';\nimport {HttpHeaders} from './headers';\nimport {HTTP_ROOT_INTERCEPTOR_FNS, HttpHandlerFn} from './interceptor';\nimport {HttpRequest} from './request';\nimport {HttpEvent, HttpResponse} from './response';\nimport {HttpParams} from './params';\n\n/**\n * Options to configure how TransferCache should be used to cache requests made via HttpClient.\n *\n * @param includeHeaders Specifies which headers should be included into cached responses. No\n * headers are included by default.\n * @param filter A function that receives a request as an argument and returns a boolean to indicate\n * whether a request should be included into the cache.\n * @param includePostRequests Enables caching for POST requests. By default, only GET and HEAD\n * requests are cached. This option can be enabled if POST requests are used to retrieve data\n * (for example using GraphQL).\n * @param includeRequestsWithAuthHeaders Enables caching of requests containing either `Authorization`\n * or `Proxy-Authorization` headers. By default, these requests are excluded from caching.\n *\n * @publicApi\n */\nexport type HttpTransferCacheOptions = {\n includeHeaders?: string[];\n filter?: (req: HttpRequest) => boolean;\n includePostRequests?: boolean;\n includeRequestsWithAuthHeaders?: boolean;\n};\n\n/**\n * If your application uses different HTTP origins to make API calls (via `HttpClient`) on the server and\n * on the client, the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token allows you to establish a mapping\n * between those origins, so that `HttpTransferCache` feature can recognize those requests as the same\n * ones and reuse the data cached on the server during hydration on the client.\n *\n * **Important note**: the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token should *only* be provided in\n * the *server* code of your application (typically in the `app.server.config.ts` script). Angular throws an\n * error if it detects that the token is defined while running on the client.\n *\n * @usageNotes\n *\n * When the same API endpoint is accessed via `http://internal-domain.com:8080` on the server and\n * via `https://external-domain.com` on the client, you can use the following configuration:\n * ```ts\n * // in app.server.config.ts\n * {\n * provide: HTTP_TRANSFER_CACHE_ORIGIN_MAP,\n * useValue: {\n * 'http://internal-domain.com:8080': 'https://external-domain.com'\n * }\n * }\n * ```\n *\n * @publicApi\n */\nexport const HTTP_TRANSFER_CACHE_ORIGIN_MAP = new InjectionToken>(\n ngDevMode ? 'HTTP_TRANSFER_CACHE_ORIGIN_MAP' : '',\n);\n\n/**\n * Keys within cached response data structure.\n */\n\nexport const BODY = 'b';\nexport const HEADERS = 'h';\nexport const STATUS = 's';\nexport const STATUS_TEXT = 'st';\nexport const REQ_URL = 'u';\nexport const RESPONSE_TYPE = 'rt';\n\ninterface TransferHttpResponse {\n /** body */\n [BODY]: any;\n /** headers */\n [HEADERS]: Record;\n /** status */\n [STATUS]?: number;\n /** statusText */\n [STATUS_TEXT]?: string;\n /** url */\n [REQ_URL]?: string;\n /** responseType */\n [RESPONSE_TYPE]?: HttpRequest['responseType'];\n}\n\ninterface CacheOptions extends HttpTransferCacheOptions {\n isCacheActive: boolean;\n}\n\nconst CACHE_OPTIONS = new InjectionToken(\n ngDevMode ? 'HTTP_TRANSFER_STATE_CACHE_OPTIONS' : '',\n);\n\n/**\n * A list of allowed HTTP methods to cache.\n */\nconst ALLOWED_METHODS = ['GET', 'HEAD'];\n\nexport function transferCacheInterceptorFn(\n req: HttpRequest,\n next: HttpHandlerFn,\n): Observable> {\n const {isCacheActive, ...globalOptions} = inject(CACHE_OPTIONS);\n const {transferCache: requestOptions, method: requestMethod} = req;\n\n // In the following situations we do not want to cache the request\n if (\n !isCacheActive ||\n requestOptions === false ||\n // POST requests are allowed either globally or at request level\n (requestMethod === 'POST' && !globalOptions.includePostRequests && !requestOptions) ||\n (requestMethod !== 'POST' && !ALLOWED_METHODS.includes(requestMethod)) ||\n // Do not cache request that require authorization when includeRequestsWithAuthHeaders is falsey\n (!globalOptions.includeRequestsWithAuthHeaders && hasAuthHeaders(req)) ||\n globalOptions.filter?.(req) === false\n ) {\n return next(req);\n }\n\n const transferState = inject(TransferState);\n\n const originMap: Record | null = inject(HTTP_TRANSFER_CACHE_ORIGIN_MAP, {\n optional: true,\n });\n\n if (typeof ngServerMode !== 'undefined' && !ngServerMode && originMap) {\n throw new RuntimeError(\n RuntimeErrorCode.HTTP_ORIGIN_MAP_USED_IN_CLIENT,\n ngDevMode &&\n 'Angular detected that the `HTTP_TRANSFER_CACHE_ORIGIN_MAP` token is configured and ' +\n 'present in the client side code. Please ensure that this token is only provided in the ' +\n 'server code of the application.',\n );\n }\n\n const requestUrl =\n typeof ngServerMode !== 'undefined' && ngServerMode && originMap\n ? mapRequestOriginUrl(req.url, originMap)\n : req.url;\n\n const storeKey = makeCacheKey(req, requestUrl);\n const response = transferState.get(storeKey, null);\n\n let headersToInclude = globalOptions.includeHeaders;\n if (typeof requestOptions === 'object' && requestOptions.includeHeaders) {\n // Request-specific config takes precedence over the global config.\n headersToInclude = requestOptions.includeHeaders;\n }\n\n if (response) {\n const {\n [BODY]: undecodedBody,\n [RESPONSE_TYPE]: responseType,\n [HEADERS]: httpHeaders,\n [STATUS]: status,\n [STATUS_TEXT]: statusText,\n [REQ_URL]: url,\n } = response;\n // Request found in cache. Respond using it.\n let body: ArrayBuffer | Blob | string | undefined = undecodedBody;\n\n switch (responseType) {\n case 'arraybuffer':\n body = new TextEncoder().encode(undecodedBody).buffer;\n break;\n case 'blob':\n body = new Blob([undecodedBody]);\n break;\n }\n\n // We want to warn users accessing a header provided from the cache\n // That HttpTransferCache alters the headers\n // The warning will be logged a single time by HttpHeaders instance\n let headers = new HttpHeaders(httpHeaders);\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n // Append extra logic in dev mode to produce a warning when a header\n // that was not transferred to the client is accessed in the code via `get`\n // and `has` calls.\n headers = appendMissingHeadersDetection(req.url, headers, headersToInclude ?? []);\n }\n\n return of(\n new HttpResponse({\n body,\n headers,\n status,\n statusText,\n url,\n }),\n );\n }\n\n // Request not found in cache. Make the request and cache it if on the server.\n return next(req).pipe(\n tap((event: HttpEvent) => {\n if (event instanceof HttpResponse && typeof ngServerMode !== 'undefined' && ngServerMode) {\n transferState.set(storeKey, {\n [BODY]: event.body,\n [HEADERS]: getFilteredHeaders(event.headers, headersToInclude),\n [STATUS]: event.status,\n [STATUS_TEXT]: event.statusText,\n [REQ_URL]: requestUrl,\n [RESPONSE_TYPE]: req.responseType,\n });\n }\n }),\n );\n}\n\n/** @returns true when the requests contains autorization related headers. */\nfunction hasAuthHeaders(req: HttpRequest): boolean {\n return req.headers.has('authorization') || req.headers.has('proxy-authorization');\n}\n\nfunction getFilteredHeaders(\n headers: HttpHeaders,\n includeHeaders: string[] | undefined,\n): Record {\n if (!includeHeaders) {\n return {};\n }\n\n const headersMap: Record = {};\n for (const key of includeHeaders) {\n const values = headers.getAll(key);\n if (values !== null) {\n headersMap[key] = values;\n }\n }\n\n return headersMap;\n}\n\nfunction sortAndConcatParams(params: HttpParams | URLSearchParams): string {\n return [...params.keys()]\n .sort()\n .map((k) => `${k}=${params.getAll(k)}`)\n .join('&');\n}\n\nfunction makeCacheKey(\n request: HttpRequest,\n mappedRequestUrl: string,\n): StateKey {\n // make the params encoded same as a url so it's easy to identify\n const {params, method, responseType} = request;\n const encodedParams = sortAndConcatParams(params);\n\n let serializedBody = request.serializeBody();\n if (serializedBody instanceof URLSearchParams) {\n serializedBody = sortAndConcatParams(serializedBody);\n } else if (typeof serializedBody !== 'string') {\n serializedBody = '';\n }\n\n const key = [method, responseType, mappedRequestUrl, serializedBody, encodedParams].join('|');\n const hash = generateHash(key);\n\n return makeStateKey(hash);\n}\n\n/**\n * A method that returns a hash representation of a string using a variant of DJB2 hash\n * algorithm.\n *\n * This is the same hashing logic that is used to generate component ids.\n */\nfunction generateHash(value: string): string {\n let hash = 0;\n\n for (const char of value) {\n hash = (Math.imul(31, hash) + char.charCodeAt(0)) << 0;\n }\n\n // Force positive number hash.\n // 2147483647 = equivalent of Integer.MAX_VALUE.\n hash += 2147483647 + 1;\n\n return hash.toString();\n}\n\n/**\n * Returns the DI providers needed to enable HTTP transfer cache.\n *\n * By default, when using server rendering, requests are performed twice: once on the server and\n * other one on the browser.\n *\n * When these providers are added, requests performed on the server are cached and reused during the\n * bootstrapping of the application in the browser thus avoiding duplicate requests and reducing\n * load time.\n *\n */\nexport function withHttpTransferCache(cacheOptions: HttpTransferCacheOptions): Provider[] {\n return [\n {\n provide: CACHE_OPTIONS,\n useFactory: (): CacheOptions => {\n performanceMarkFeature('NgHttpTransferCache');\n return {isCacheActive: true, ...cacheOptions};\n },\n },\n {\n provide: HTTP_ROOT_INTERCEPTOR_FNS,\n useValue: transferCacheInterceptorFn,\n multi: true,\n },\n {\n provide: APP_BOOTSTRAP_LISTENER,\n multi: true,\n useFactory: () => {\n const appRef = inject(ApplicationRef);\n const cacheState = inject(CACHE_OPTIONS);\n\n return () => {\n appRef.whenStable().then(() => {\n cacheState.isCacheActive = false;\n });\n };\n },\n },\n ];\n}\n\n/**\n * This function will add a proxy to an HttpHeader to intercept calls to get/has\n * and log a warning if the header entry requested has been removed\n */\nfunction appendMissingHeadersDetection(\n url: string,\n headers: HttpHeaders,\n headersToInclude: string[],\n): HttpHeaders {\n const warningProduced = new Set();\n return new Proxy(headers, {\n get(target: HttpHeaders, prop: keyof HttpHeaders): unknown {\n const value = Reflect.get(target, prop);\n const methods: Set = new Set(['get', 'has', 'getAll']);\n\n if (typeof value !== 'function' || !methods.has(prop)) {\n return value;\n }\n\n return (headerName: string) => {\n // We log when the key has been removed and a warning hasn't been produced for the header\n const key = (prop + ':' + headerName).toLowerCase(); // e.g. `get:cache-control`\n if (!headersToInclude.includes(headerName) && !warningProduced.has(key)) {\n warningProduced.add(key);\n const truncatedUrl = truncateMiddle(url);\n\n // TODO: create Error guide for this warning\n console.warn(\n formatRuntimeError(\n RuntimeErrorCode.HEADERS_ALTERED_BY_TRANSFER_CACHE,\n `Angular detected that the \\`${headerName}\\` header is accessed, but the value of the header ` +\n `was not transferred from the server to the client by the HttpTransferCache. ` +\n `To include the value of the \\`${headerName}\\` header for the \\`${truncatedUrl}\\` request, ` +\n `use the \\`includeHeaders\\` list. The \\`includeHeaders\\` can be defined either ` +\n `on a request level by adding the \\`transferCache\\` parameter, or on an application ` +\n `level by adding the \\`httpCacheTransfer.includeHeaders\\` argument to the ` +\n `\\`provideClientHydration()\\` call. `,\n ),\n );\n }\n\n // invoking the original method\n return (value as Function).apply(target, [headerName]);\n };\n },\n });\n}\n\nfunction mapRequestOriginUrl(url: string, originMap: Record): string {\n const origin = new URL(url, 'resolve://').origin;\n const mappedOrigin = originMap[origin];\n if (!mappedOrigin) {\n return url;\n }\n\n if (typeof ngDevMode === 'undefined' || ngDevMode) {\n verifyMappedOrigin(mappedOrigin);\n }\n\n return url.replace(origin, mappedOrigin);\n}\n\nfunction verifyMappedOrigin(url: string): void {\n if (new URL(url, 'resolve://').pathname !== '/') {\n throw new RuntimeError(\n RuntimeErrorCode.HTTP_ORIGIN_MAP_CONTAINS_PATH,\n 'Angular detected a URL with a path segment in the value provided for the ' +\n `\\`HTTP_TRANSFER_CACHE_ORIGIN_MAP\\` token: ${url}. The map should only contain origins ` +\n 'without any other segments.',\n );\n }\n}\n"],"names":["ResourceImpl","RuntimeError","performanceMarkFeature","truncateMiddle","formatRuntimeError"],"mappings":";;;;;;;;;;;;;;AAgNA;;;;;;;;AAQG;AACU,MAAA,YAAY,GAAmB,CAAC,MAAK;AAChD,IAAA,MAAM,MAAM,GAAG,kBAAkB,CAAU,MAAM,CAAmB;AACpE,IAAA,MAAM,CAAC,WAAW,GAAG,kBAAkB,CAAc,aAAa,CAAC;AACnE,IAAA,MAAM,CAAC,IAAI,GAAG,kBAAkB,CAAC,MAAM,CAAC;AACxC,IAAA,MAAM,CAAC,IAAI,GAAG,kBAAkB,CAAC,MAAM,CAAC;AACxC,IAAA,OAAO,MAAM;AACf,CAAC;AAQD,SAAS,kBAAkB,CAAO,YAAsD,EAAA;AACtF,IAAA,OAAO,SAAS,eAAe,CAC7B,OAAuB,EACvB,OAA4C,EAAA;AAE5C,QAAA,OAAO,EAAE,QAAQ,IAAI,wBAAwB,CAAC,YAAY,CAAC;QAC3D,MAAM,QAAQ,GAAG,OAAO,EAAE,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC;QACtD,OAAO,IAAI,gBAAgB,CACzB,QAAQ,EACR,MAAM,gBAAgB,CAAC,OAAO,EAAE,YAAY,CAAC,EAC7C,OAAO,EAAE,YAAY,EACrB,OAAO,EAAE,KAAoC,EAC7C,OAAO,EAAE,KAAiC,CACf;AAC/B,KAAC;AACH;AAEA,SAAS,gBAAgB,CACvB,OAAuB,EACvB,YAAsD,EAAA;AAEtD,IAAA,IAAI,gBAAgB,GAAG,OAAO,OAAO,KAAK,UAAU,GAAG,OAAO,EAAE,GAAG,OAAO;AAC1E,IAAA,IAAI,gBAAgB,KAAK,SAAS,EAAE;AAClC,QAAA,OAAO,SAAS;;AACX,SAAA,IAAI,OAAO,gBAAgB,KAAK,QAAQ,EAAE;AAC/C,QAAA,gBAAgB,GAAG,EAAC,GAAG,EAAE,gBAAgB,EAAC;;AAG5C,IAAA,MAAM,OAAO,GACX,gBAAgB,CAAC,OAAO,YAAY;UAChC,gBAAgB,CAAC;UACjB,IAAI,WAAW,CACb,gBAAgB,CAAC,OAEJ,CACd;AAEP,IAAA,MAAM,MAAM,GACV,gBAAgB,CAAC,MAAM,YAAY;UAC/B,gBAAgB,CAAC;AACnB,UAAE,IAAI,UAAU,CAAC,EAAC,UAAU,EAAE,gBAAgB,CAAC,MAAM,EAAC,CAAC;AAE3D,IAAA,OAAO,IAAI,WAAW,CACpB,gBAAgB,CAAC,MAAM,IAAI,KAAK,EAChC,gBAAgB,CAAC,GAAG,EACpB,gBAAgB,CAAC,IAAI,IAAI,IAAI,EAC7B;QACE,OAAO;QACP,MAAM;QACN,cAAc,EAAE,gBAAgB,CAAC,cAAc;QAC/C,eAAe,EAAE,gBAAgB,CAAC,eAAe;QACjD,YAAY;QACZ,OAAO,EAAE,gBAAgB,CAAC,OAAO;QACjC,aAAa,EAAE,gBAAgB,CAAC,aAAa;AAC9C,KAAA,CACF;AACH;AACA,MAAM,gBACJ,SAAQA,aAAiD,CAAA;AAGjD,IAAA,MAAM;IACN,QAAQ,GAAG,YAAY,CAAC;QAC9B,MAAM,EAAE,IAAI,CAAC,UAAU;AACvB,QAAA,WAAW,EAAE,MAAM,SAAoC;AACxD,KAAA,CAAC;IACM,SAAS,GAAG,YAAY,CAAC;QAC/B,MAAM,EAAE,IAAI,CAAC,UAAU;AACvB,QAAA,WAAW,EAAE,MAAM,SAA0C;AAC9D,KAAA,CAAC;IACM,WAAW,GAAG,YAAY,CAAC;QACjC,MAAM,EAAE,IAAI,CAAC,UAAU;AACvB,QAAA,WAAW,EAAE,MAAM,SAA+B;AACnD,KAAA,CAAC;IAEO,OAAO,GAAG,QAAQ,CAAC,MAC1B,IAAI,CAAC,MAAM,EAAE,KAAK,cAAc,CAAC,QAAQ,IAAI,IAAI,CAAC,MAAM,EAAE,KAAK,cAAc,CAAC;AAC5E,UAAE,IAAI,CAAC,QAAQ;UACb,SAAS,CACd;AACQ,IAAA,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE;AACtC,IAAA,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE;IAEnD,WACE,CAAA,QAAkB,EAClB,OAAyC,EACzC,YAAe,EACf,KAA6B,EAC7B,KAAgC,EAAA;QAEhC,KAAK,CACH,OAAO,EACP,CAAC,EAAC,OAAO,EAAE,WAAW,EAAC,KAAI;AACzB,YAAA,IAAI,GAAiB;;;YAIrB,MAAM,OAAO,GAAG,MAAM,GAAG,CAAC,WAAW,EAAE;AACvC,YAAA,WAAW,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC;;YAG9C,MAAM,MAAM,GAAG,MAAM,CAAwB,EAAC,KAAK,EAAE,SAAc,EAAC,CAAC;AACrE,YAAA,IAAI,OAAqE;AACzE,YAAA,MAAM,OAAO,GAAG,IAAI,OAAO,CAAgC,CAAC,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC,CAAC;AAEhF,YAAA,MAAM,IAAI,GAAG,CAAC,KAA4B,KAAU;AAClD,gBAAA,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC;AACjB,gBAAA,OAAO,GAAG,MAAM,CAAC;gBACjB,OAAO,GAAG,SAAS;AACrB,aAAC;YAED,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,OAAQ,CAAC,CAAC,SAAS,CAAC;AAC5C,gBAAA,IAAI,EAAE,CAAC,KAAK,KAAI;AACd,oBAAA,QAAQ,KAAK,CAAC,IAAI;wBAChB,KAAK,aAAa,CAAC,QAAQ;4BACzB,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC;4BAChC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC;AAClC,4BAAA,IAAI;gCACF,IAAI,CAAC,EAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,GAAI,KAAK,CAAC,IAAU,EAAC,CAAC;;4BAC5D,OAAO,KAAK,EAAE;AACd,gCAAA,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC;;4BAEf;wBACF,KAAK,aAAa,CAAC,gBAAgB;AACjC,4BAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC;4BACzB;;iBAEL;AACD,gBAAA,KAAK,EAAE,CAAC,KAAK,KAAI;AACf,oBAAA,IAAI,KAAK,YAAY,iBAAiB,EAAE;wBACtC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC;wBAChC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC;;AAGpC,oBAAA,IAAI,CAAC,EAAC,KAAK,EAAC,CAAC;AACb,oBAAA,WAAW,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC;iBAClD;gBACD,QAAQ,EAAE,MAAK;oBACb,IAAI,OAAO,EAAE;wBACX,IAAI,CAAC,EAAC,KAAK,EAAE,IAAI,KAAK,CAAC,6CAA6C,CAAC,EAAC,CAAC;;AAEzE,oBAAA,WAAW,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC;iBAClD;AACF,aAAA,CAAC;AAEF,YAAA,OAAO,OAAO;AAChB,SAAC,EACD,YAAY,EACZ,KAAK,EACL,QAAQ,CACT;QACD,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC;;AAKzC;;AC7UD;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AACU,MAAA,8BAA8B,GAAG,IAAI,cAAc,CAC9D,SAAS,GAAG,gCAAgC,GAAG,EAAE;AAGnD;;AAEG;AAEI,MAAM,IAAI,GAAG,GAAG;AAChB,MAAM,OAAO,GAAG,GAAG;AACnB,MAAM,MAAM,GAAG,GAAG;AAClB,MAAM,WAAW,GAAG,IAAI;AACxB,MAAM,OAAO,GAAG,GAAG;AACnB,MAAM,aAAa,GAAG,IAAI;AAqBjC,MAAM,aAAa,GAAG,IAAI,cAAc,CACtC,SAAS,GAAG,mCAAmC,GAAG,EAAE,CACrD;AAED;;AAEG;AACH,MAAM,eAAe,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC;AAEvB,SAAA,0BAA0B,CACxC,GAAyB,EACzB,IAAmB,EAAA;IAEnB,MAAM,EAAC,aAAa,EAAE,GAAG,aAAa,EAAC,GAAG,MAAM,CAAC,aAAa,CAAC;IAC/D,MAAM,EAAC,aAAa,EAAE,cAAc,EAAE,MAAM,EAAE,aAAa,EAAC,GAAG,GAAG;;AAGlE,IAAA,IACE,CAAC,aAAa;AACd,QAAA,cAAc,KAAK,KAAK;;SAEvB,aAAa,KAAK,MAAM,IAAI,CAAC,aAAa,CAAC,mBAAmB,IAAI,CAAC,cAAc,CAAC;SAClF,aAAa,KAAK,MAAM,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;;SAErE,CAAC,aAAa,CAAC,8BAA8B,IAAI,cAAc,CAAC,GAAG,CAAC,CAAC;QACtE,aAAa,CAAC,MAAM,GAAG,GAAG,CAAC,KAAK,KAAK,EACrC;AACA,QAAA,OAAO,IAAI,CAAC,GAAG,CAAC;;AAGlB,IAAA,MAAM,aAAa,GAAG,MAAM,CAAC,aAAa,CAAC;AAE3C,IAAA,MAAM,SAAS,GAAkC,MAAM,CAAC,8BAA8B,EAAE;AACtF,QAAA,QAAQ,EAAE,IAAI;AACf,KAAA,CAAC;IAEF,IAAI,OAAO,YAAY,KAAK,WAAW,IAAI,CAAC,YAAY,IAAI,SAAS,EAAE;QACrE,MAAM,IAAIC,aAAY,CAAA,IAAA,wDAEpB,SAAS;YACP,qFAAqF;gBACnF,yFAAyF;AACzF,gBAAA,iCAAiC,CACtC;;IAGH,MAAM,UAAU,GACd,OAAO,YAAY,KAAK,WAAW,IAAI,YAAY,IAAI;UACnD,mBAAmB,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS;AACxC,UAAE,GAAG,CAAC,GAAG;IAEb,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,EAAE,UAAU,CAAC;IAC9C,MAAM,QAAQ,GAAG,aAAa,CAAC,GAAG,CAAC,QAAQ,EAAE,IAAI,CAAC;AAElD,IAAA,IAAI,gBAAgB,GAAG,aAAa,CAAC,cAAc;IACnD,IAAI,OAAO,cAAc,KAAK,QAAQ,IAAI,cAAc,CAAC,cAAc,EAAE;;AAEvE,QAAA,gBAAgB,GAAG,cAAc,CAAC,cAAc;;IAGlD,IAAI,QAAQ,EAAE;AACZ,QAAA,MAAM,EACJ,CAAC,IAAI,GAAG,aAAa,EACrB,CAAC,aAAa,GAAG,YAAY,EAC7B,CAAC,OAAO,GAAG,WAAW,EACtB,CAAC,MAAM,GAAG,MAAM,EAChB,CAAC,WAAW,GAAG,UAAU,EACzB,CAAC,OAAO,GAAG,GAAG,GACf,GAAG,QAAQ;;QAEZ,IAAI,IAAI,GAA4C,aAAa;QAEjE,QAAQ,YAAY;AAClB,YAAA,KAAK,aAAa;gBAChB,IAAI,GAAG,IAAI,WAAW,EAAE,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,MAAM;gBACrD;AACF,YAAA,KAAK,MAAM;gBACT,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,aAAa,CAAC,CAAC;gBAChC;;;;;AAMJ,QAAA,IAAI,OAAO,GAAG,IAAI,WAAW,CAAC,WAAW,CAAC;AAC1C,QAAA,IAAI,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,EAAE;;;;AAIjD,YAAA,OAAO,GAAG,6BAA6B,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,EAAE,gBAAgB,IAAI,EAAE,CAAC;;AAGnF,QAAA,OAAO,EAAE,CACP,IAAI,YAAY,CAAC;YACf,IAAI;YACJ,OAAO;YACP,MAAM;YACN,UAAU;YACV,GAAG;AACJ,SAAA,CAAC,CACH;;;AAIH,IAAA,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CACnB,GAAG,CAAC,CAAC,KAAyB,KAAI;QAChC,IAAI,KAAK,YAAY,YAAY,IAAI,OAAO,YAAY,KAAK,WAAW,IAAI,YAAY,EAAE;AACxF,YAAA,aAAa,CAAC,GAAG,CAAuB,QAAQ,EAAE;AAChD,gBAAA,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI;gBAClB,CAAC,OAAO,GAAG,kBAAkB,CAAC,KAAK,CAAC,OAAO,EAAE,gBAAgB,CAAC;AAC9D,gBAAA,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM;AACtB,gBAAA,CAAC,WAAW,GAAG,KAAK,CAAC,UAAU;gBAC/B,CAAC,OAAO,GAAG,UAAU;AACrB,gBAAA,CAAC,aAAa,GAAG,GAAG,CAAC,YAAY;AAClC,aAAA,CAAC;;KAEL,CAAC,CACH;AACH;AAEA;AACA,SAAS,cAAc,CAAC,GAAyB,EAAA;AAC/C,IAAA,OAAO,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,qBAAqB,CAAC;AACnF;AAEA,SAAS,kBAAkB,CACzB,OAAoB,EACpB,cAAoC,EAAA;IAEpC,IAAI,CAAC,cAAc,EAAE;AACnB,QAAA,OAAO,EAAE;;IAGX,MAAM,UAAU,GAA6B,EAAE;AAC/C,IAAA,KAAK,MAAM,GAAG,IAAI,cAAc,EAAE;QAChC,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC;AAClC,QAAA,IAAI,MAAM,KAAK,IAAI,EAAE;AACnB,YAAA,UAAU,CAAC,GAAG,CAAC,GAAG,MAAM;;;AAI5B,IAAA,OAAO,UAAU;AACnB;AAEA,SAAS,mBAAmB,CAAC,MAAoC,EAAA;AAC/D,IAAA,OAAO,CAAC,GAAG,MAAM,CAAC,IAAI,EAAE;AACrB,SAAA,IAAI;AACJ,SAAA,GAAG,CAAC,CAAC,CAAC,KAAK,CAAG,EAAA,CAAC,CAAI,CAAA,EAAA,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;SACrC,IAAI,CAAC,GAAG,CAAC;AACd;AAEA,SAAS,YAAY,CACnB,OAAyB,EACzB,gBAAwB,EAAA;;IAGxB,MAAM,EAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAC,GAAG,OAAO;AAC9C,IAAA,MAAM,aAAa,GAAG,mBAAmB,CAAC,MAAM,CAAC;AAEjD,IAAA,IAAI,cAAc,GAAG,OAAO,CAAC,aAAa,EAAE;AAC5C,IAAA,IAAI,cAAc,YAAY,eAAe,EAAE;AAC7C,QAAA,cAAc,GAAG,mBAAmB,CAAC,cAAc,CAAC;;AAC/C,SAAA,IAAI,OAAO,cAAc,KAAK,QAAQ,EAAE;QAC7C,cAAc,GAAG,EAAE;;AAGrB,IAAA,MAAM,GAAG,GAAG,CAAC,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,aAAa,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;AAC7F,IAAA,MAAM,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC;AAE9B,IAAA,OAAO,YAAY,CAAC,IAAI,CAAC;AAC3B;AAEA;;;;;AAKG;AACH,SAAS,YAAY,CAAC,KAAa,EAAA;IACjC,IAAI,IAAI,GAAG,CAAC;AAEZ,IAAA,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;QACxB,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC;;;;AAKxD,IAAA,IAAI,IAAI,UAAU,GAAG,CAAC;AAEtB,IAAA,OAAO,IAAI,CAAC,QAAQ,EAAE;AACxB;AAEA;;;;;;;;;;AAUG;AACG,SAAU,qBAAqB,CAAC,YAAsC,EAAA;IAC1E,OAAO;AACL,QAAA;AACE,YAAA,OAAO,EAAE,aAAa;YACtB,UAAU,EAAE,MAAmB;gBAC7BC,uBAAsB,CAAC,qBAAqB,CAAC;gBAC7C,OAAO,EAAC,aAAa,EAAE,IAAI,EAAE,GAAG,YAAY,EAAC;aAC9C;AACF,SAAA;AACD,QAAA;AACE,YAAA,OAAO,EAAE,yBAAyB;AAClC,YAAA,QAAQ,EAAE,0BAA0B;AACpC,YAAA,KAAK,EAAE,IAAI;AACZ,SAAA;AACD,QAAA;AACE,YAAA,OAAO,EAAE,sBAAsB;AAC/B,YAAA,KAAK,EAAE,IAAI;YACX,UAAU,EAAE,MAAK;AACf,gBAAA,MAAM,MAAM,GAAG,MAAM,CAAC,cAAc,CAAC;AACrC,gBAAA,MAAM,UAAU,GAAG,MAAM,CAAC,aAAa,CAAC;AAExC,gBAAA,OAAO,MAAK;AACV,oBAAA,MAAM,CAAC,UAAU,EAAE,CAAC,IAAI,CAAC,MAAK;AAC5B,wBAAA,UAAU,CAAC,aAAa,GAAG,KAAK;AAClC,qBAAC,CAAC;AACJ,iBAAC;aACF;AACF,SAAA;KACF;AACH;AAEA;;;AAGG;AACH,SAAS,6BAA6B,CACpC,GAAW,EACX,OAAoB,EACpB,gBAA0B,EAAA;AAE1B,IAAA,MAAM,eAAe,GAAG,IAAI,GAAG,EAAE;AACjC,IAAA,OAAO,IAAI,KAAK,CAAc,OAAO,EAAE;QACrC,GAAG,CAAC,MAAmB,EAAE,IAAuB,EAAA;YAC9C,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,IAAI,CAAC;AACvC,YAAA,MAAM,OAAO,GAA2B,IAAI,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAEzE,YAAA,IAAI,OAAO,KAAK,KAAK,UAAU,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACrD,gBAAA,OAAO,KAAK;;YAGd,OAAO,CAAC,UAAkB,KAAI;;AAE5B,gBAAA,MAAM,GAAG,GAAG,CAAC,IAAI,GAAG,GAAG,GAAG,UAAU,EAAE,WAAW,EAAE,CAAC;AACpD,gBAAA,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;AACvE,oBAAA,eAAe,CAAC,GAAG,CAAC,GAAG,CAAC;AACxB,oBAAA,MAAM,YAAY,GAAGC,eAAc,CAAC,GAAG,CAAC;;AAGxC,oBAAA,OAAO,CAAC,IAAI,CACVC,mBAAkB,CAEhB,IAAA,2DAAA,CAAA,4BAAA,EAA+B,UAAU,CAAqD,mDAAA,CAAA;wBAC5F,CAA8E,4EAAA,CAAA;wBAC9E,CAAiC,8BAAA,EAAA,UAAU,CAAuB,oBAAA,EAAA,YAAY,CAAc,YAAA,CAAA;wBAC5F,CAAgF,8EAAA,CAAA;wBAChF,CAAqF,mFAAA,CAAA;wBACrF,CAA2E,yEAAA,CAAA;wBAC3E,CAAqC,mCAAA,CAAA,CACxC,CACF;;;gBAIH,OAAQ,KAAkB,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,UAAU,CAAC,CAAC;AACxD,aAAC;SACF;AACF,KAAA,CAAC;AACJ;AAEA,SAAS,mBAAmB,CAAC,GAAW,EAAE,SAAiC,EAAA;IACzE,MAAM,MAAM,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,MAAM;AAChD,IAAA,MAAM,YAAY,GAAG,SAAS,CAAC,MAAM,CAAC;IACtC,IAAI,CAAC,YAAY,EAAE;AACjB,QAAA,OAAO,GAAG;;AAGZ,IAAA,IAAI,OAAO,SAAS,KAAK,WAAW,IAAI,SAAS,EAAE;QACjD,kBAAkB,CAAC,YAAY,CAAC;;IAGlC,OAAO,GAAG,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC;AAC1C;AAEA,SAAS,kBAAkB,CAAC,GAAW,EAAA;AACrC,IAAA,IAAI,IAAI,GAAG,CAAC,GAAG,EAAE,YAAY,CAAC,CAAC,QAAQ,KAAK,GAAG,EAAE;QAC/C,MAAM,IAAIH,aAAY,CAAA,IAAA,uDAEpB,2EAA2E;AACzE,YAAA,CAAA,0CAAA,EAA6C,GAAG,CAAwC,sCAAA,CAAA;AACxF,YAAA,6BAA6B,CAChC;;AAEL;;;;"}`+xJ5/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import * as i0 from '@angular/core'; import { Injectable, NgModule } from '@angular/core'; import { Observable } from 'rxjs'; import { HttpHeaders, HttpResponse, HttpStatusCode, HttpErrorResponse, HttpEventType, HttpBackend, REQUESTS_CONTRIBUTE_TO_STABILITY, HttpClientModule } from '../module-z3bvLlVg.mjs'; import 'rxjs/operators'; import '../xhr-BfNfxNDv.mjs'; import '../dom_tokens-rA0ACyx7.mjs'; /** * Controller to be injected into tests, that allows for mocking and flushing * of requests. * * @publicApi */ class HttpTestingController { } /** * A mock requests that was received and is ready to be answered. * * This interface allows access to the underlying `HttpRequest`, and allows * responding with `HttpEvent`s or `HttpErrorResponse`s. * * @publicApi */ class TestRequest { request; observer; /** * Whether the request was cancelled after it was sent. */ get cancelled() { return this._cancelled; } /** * @internal set by `HttpClientTestingBackend` */ _cancelled = false; constructor(request, observer) { this.request = request; this.observer = observer; } /** * Resolve the request by returning a body plus additional HTTP information (such as response * headers) if provided. * If the request specifies an expected body type, the body is converted into the requested type. * Otherwise, the body is converted to `JSON` by default. * * Both successful and unsuccessful responses can be delivered via `flush()`. */ flush(body, opts = {}) { if (this.cancelled) { throw new Error(`Cannot flush a cancelled request.`); } const url = this.request.urlWithParams; const headers = opts.headers instanceof HttpHeaders ? opts.headers : new HttpHeaders(opts.headers); body = _maybeConvertBody(this.request.responseType, body); let statusText = opts.statusText; let status = opts.status !== undefined ? opts.status : HttpStatusCode.Ok; if (opts.status === undefined) { if (body === null) { status = HttpStatusCode.NoContent; statusText ||= 'No Content'; } else { statusText ||= 'OK'; } } if (statusText === undefined) { throw new Error('statusText is required when setting a custom status.'); } if (status >= 200 && status < 300) { this.observer.next(new HttpResponse({ body, headers, status, statusText, url })); this.observer.complete(); } else { this.observer.error(new HttpErrorResponse({ error: body, headers, status, statusText, url })); } } error(error, opts = {}) { if (this.cancelled) { throw new Error(`Cannot return an error for a cancelled request.`); } if (opts.status && opts.status >= 200 && opts.status < 300) { throw new Error(`error() called with a successful status.`); } const headers = opts.headers instanceof HttpHeaders ? opts.headers : new HttpHeaders(opts.headers); this.observer.error(new HttpErrorResponse({ error, headers, status: opts.status || 0, statusText: opts.statusText || '', url: this.request.urlWithParams, })); } /** * Deliver an arbitrary `HttpEvent` (such as a progress event) on the response stream for this * request. */ event(event) { if (this.cancelled) { throw new Error(`Cannot send events to a cancelled request.`); } this.observer.next(event); } } /** * Helper function to convert a response body to an ArrayBuffer. */ function _toArrayBufferBody(body) { if (typeof ArrayBuffer === 'undefined') { throw new Error('ArrayBuffer responses are not supported on this platform.'); } if (body instanceof ArrayBuffer) { return body; } throw new Error('Automatic conversion to ArrayBuffer is not supported for response type.'); } /** * Helper function to convert a response body to a Blob. */ function _toBlob(body) { if (typeof Blob === 'undefined') { throw new Error('Blob responses are not supported on this platform.'); } if (body instanceof Blob) { return body; } if (ArrayBuffer && body instanceof ArrayBuffer) { return new Blob([body]); } throw new Error('Automatic conversion to Blob is not supported for response type.'); } /** * Helper function to convert a response body to JSON data. */ function _toJsonBody(body, format = 'JSON') { if (typeof ArrayBuffer !== 'undefined' && body instanceof ArrayBuffer) { throw new Error(`Automatic conversion to ${format} is not supported for ArrayBuffers.`); } if (typeof Blob !== 'undefined' && body instanceof Blob) { throw new Error(`Automatic conversion to ${format} is not supported for Blobs.`); } if (typeof body === 'string' || typeof body === 'number' || typeof body === 'object' || typeof body === 'boolean' || Array.isArray(body)) { return body; } throw new Error(`Automatic conversion to ${format} is not supported for response type.`); } /** * Helper function to convert a response body to a string. */ function _toTextBody(body) { if (typeof body === 'string') { return body; } if (typeof ArrayBuffer !== 'undefined' && body instanceof ArrayBuffer) { throw new Error('Automatic conversion to text is not supported for ArrayBuffers.'); } if (typeof Blob !== 'undefined' && body instanceof Blob) { throw new Error('Automatic conversion to text is not supported for Blobs.'); } return JSON.stringify(_toJsonBody(body, 'text')); } /** * Convert a response body to the requested type. */ function _maybeConvertBody(responseType, body) { if (body === null) { return null; } switch (responseType) { case 'arraybuffer': return _toArrayBufferBody(body); case 'blob': return _toBlob(body); case 'json': return _toJsonBody(body); case 'text': return _toTextBody(body); default: throw new Error(`Unsupported responseType: ${responseType}`); } } /** * A testing backend for `HttpClient` which both acts as an `HttpBackend` * and as the `HttpTestingController`. * * `HttpClientTestingBackend` works by keeping a list of all open requests. * As requests come in, they're added to the list. Users can assert that specific * requests were made and then flush them. In the end, a verify() method asserts * that no unexpected requests were made. * * */ class HttpClientTestingBackend { /** * List of pending requests which have not yet been expected. */ open = []; /** * Used when checking if we need to throw the NOT_USING_FETCH_BACKEND_IN_SSR error */ isTestingBackend = true; /** * Handle an incoming request by queueing it in the list of open requests. */ handle(req) { return new Observable((observer) => { const testReq = new TestRequest(req, observer); this.open.push(testReq); observer.next({ type: HttpEventType.Sent }); return () => { testReq._cancelled = true; }; }); } /** * Helper function to search for requests in the list of open requests. */ _match(match) { if (typeof match === 'string') { return this.open.filter((testReq) => testReq.request.urlWithParams === match); } else if (typeof match === 'function') { return this.open.filter((testReq) => match(testReq.request)); } else { return this.open.filter((testReq) => (!match.method || testReq.request.method === match.method.toUpperCase()) && (!match.url || testReq.request.urlWithParams === match.url)); } } /** * Search for requests in the list of open requests, and return all that match * without asserting anything about the number of matches. */ match(match) { const results = this._match(match); results.forEach((result) => { const index = this.open.indexOf(result); if (index !== -1) { this.open.splice(index, 1); } }); return results; } /** * Expect that a single outstanding request matches the given matcher, and return * it. * * Requests returned through this API will no longer be in the list of open requests, * and thus will not match twice. */ expectOne(match, description) { description ||= this.descriptionFromMatcher(match); const matches = this.match(match); if (matches.length > 1) { throw new Error(`Expected one matching request for criteria "${description}", found ${matches.length} requests.`); } if (matches.length === 0) { let message = `Expected one matching request for criteria "${description}", found none.`; if (this.open.length > 0) { // Show the methods and URLs of open requests in the error, for convenience. const requests = this.open.map(describeRequest).join(', '); message += ` Requests received are: ${requests}.`; } throw new Error(message); } return matches[0]; } /** * Expect that no outstanding requests match the given matcher, and throw an error * if any do. */ expectNone(match, description) { description ||= this.descriptionFromMatcher(match); const matches = this.match(match); if (matches.length > 0) { throw new Error(`Expected zero matching requests for criteria "${description}", found ${matches.length}.`); } } /** * Validate that there are no outstanding requests. */ verify(opts = {}) { let open = this.open; // It's possible that some requests may be cancelled, and this is expected. // The user can ask to ignore open requests which have been cancelled. if (opts.ignoreCancelled) { open = open.filter((testReq) => !testReq.cancelled); } if (open.length > 0) { // Show the methods and URLs of open requests in the error, for convenience. const requests = open.map(describeRequest).join(', '); throw new Error(`Expected no open requests, found ${open.length}: ${requests}`); } } descriptionFromMatcher(matcher) { if (typeof matcher === 'string') { return `Match URL: ${matcher}`; } else if (typeof matcher === 'object') { const method = matcher.method || '(any)'; const url = matcher.url || '(any)'; return `Match method: ${method}, URL: ${url}`; } else { return `Match by function: ${matcher.name}`; } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingBackend, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingBackend }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingBackend, decorators: [{ type: Injectable }] }); function describeRequest(testRequest) { const url = testRequest.request.urlWithParams; const method = testRequest.request.method; return `${method} ${url}`; } function provideHttpClientTesting() { return [ HttpClientTestingBackend, { provide: HttpBackend, useExisting: HttpClientTestingBackend }, { provide: HttpTestingController, useExisting: HttpClientTestingBackend }, { provide: REQUESTS_CONTRIBUTE_TO_STABILITY, useValue: false }, ]; } /** * Configures `HttpClientTestingBackend` as the `HttpBackend` used by `HttpClient`. * * Inject `HttpTestingController` to expect and flush requests in your tests. * * @publicApi * * @deprecated Add `provideHttpClientTesting()` to your providers instead. */ class HttpClientTestingModule { static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingModule, imports: [HttpClientModule] }); static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingModule, providers: [provideHttpClientTesting()], imports: [HttpClientModule] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClientTestingModule, decorators: [{ type: NgModule, args: [{ imports: [HttpClientModule], providers: [provideHttpClientTesting()], }] }] }); export { HttpClientTestingModule, HttpTestingController, TestRequest, provideHttpClientTesting }; //# sourceMappingURL=testing.mjs.map L xo{"version":3,"file":"testing.mjs","sources":["../../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/testing/src/api.ts","../../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/testing/src/request.ts","../../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/testing/src/backend.ts","../../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/testing/src/provider.ts","../../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/http/testing/src/module.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {HttpRequest} from '../../index';\n\nimport {TestRequest} from './request';\n\n/**\n * Defines a matcher for requests based on URL, method, or both.\n *\n * @publicApi\n */\nexport interface RequestMatch {\n method?: string;\n url?: string;\n}\n\n/**\n * Controller to be injected into tests, that allows for mocking and flushing\n * of requests.\n *\n * @publicApi\n */\nexport abstract class HttpTestingController {\n /**\n * Search for requests that match the given parameter, without any expectations.\n */\n abstract match(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n ): TestRequest[];\n\n /**\n * Expect that a single request has been made which matches the given URL, and return its\n * mock.\n *\n * If no such request has been made, or more than one such request has been made, fail with an\n * error message including the given request description, if any.\n */\n abstract expectOne(url: string, description?: string): TestRequest;\n\n /**\n * Expect that a single request has been made which matches the given parameters, and return\n * its mock.\n *\n * If no such request has been made, or more than one such request has been made, fail with an\n * error message including the given request description, if any.\n */\n abstract expectOne(params: RequestMatch, description?: string): TestRequest;\n\n /**\n * Expect that a single request has been made which matches the given predicate function, and\n * return its mock.\n *\n * If no such request has been made, or more than one such request has been made, fail with an\n * error message including the given request description, if any.\n */\n abstract expectOne(\n matchFn: (req: HttpRequest) => boolean,\n description?: string,\n ): TestRequest;\n\n /**\n * Expect that a single request has been made which matches the given condition, and return\n * its mock.\n *\n * If no such request has been made, or more than one such request has been made, fail with an\n * error message including the given request description, if any.\n */\n abstract expectOne(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n description?: string,\n ): TestRequest;\n\n /**\n * Expect that no requests have been made which match the given URL.\n *\n * If a matching request has been made, fail with an error message including the given request\n * description, if any.\n */\n abstract expectNone(url: string, description?: string): void;\n\n /**\n * Expect that no requests have been made which match the given parameters.\n *\n * If a matching request has been made, fail with an error message including the given request\n * description, if any.\n */\n abstract expectNone(params: RequestMatch, description?: string): void;\n\n /**\n * Expect that no requests have been made which match the given predicate function.\n *\n * If a matching request has been made, fail with an error message including the given request\n * description, if any.\n */\n abstract expectNone(matchFn: (req: HttpRequest) => boolean, description?: string): void;\n\n /**\n * Expect that no requests have been made which match the given condition.\n *\n * If a matching request has been made, fail with an error message including the given request\n * description, if any.\n */\n abstract expectNone(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n description?: string,\n ): void;\n\n /**\n * Verify that no unmatched requests are outstanding.\n *\n * If any requests are outstanding, fail with an error message indicating which requests were not\n * handled.\n *\n * If `ignoreCancelled` is not set (the default), `verify()` will also fail if cancelled requests\n * were not explicitly matched.\n */\n abstract verify(opts?: {ignoreCancelled?: boolean}): void;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {\n HttpErrorResponse,\n HttpEvent,\n HttpHeaders,\n HttpRequest,\n HttpResponse,\n HttpStatusCode,\n} from '../../index';\nimport {Observer} from 'rxjs';\n\n/**\n * Type that describes options that can be used to create an error\n * in `TestRequest`.\n */\ntype TestRequestErrorOptions = {\n headers?: HttpHeaders | {[name: string]: string | string[]};\n status?: number;\n statusText?: string;\n};\n\n/**\n * A mock requests that was received and is ready to be answered.\n *\n * This interface allows access to the underlying `HttpRequest`, and allows\n * responding with `HttpEvent`s or `HttpErrorResponse`s.\n *\n * @publicApi\n */\nexport class TestRequest {\n /**\n * Whether the request was cancelled after it was sent.\n */\n get cancelled(): boolean {\n return this._cancelled;\n }\n\n /**\n * @internal set by `HttpClientTestingBackend`\n */\n _cancelled = false;\n\n constructor(\n public request: HttpRequest,\n private observer: Observer>,\n ) {}\n\n /**\n * Resolve the request by returning a body plus additional HTTP information (such as response\n * headers) if provided.\n * If the request specifies an expected body type, the body is converted into the requested type.\n * Otherwise, the body is converted to `JSON` by default.\n *\n * Both successful and unsuccessful responses can be delivered via `flush()`.\n */\n flush(\n body:\n | ArrayBuffer\n | Blob\n | boolean\n | string\n | number\n | Object\n | (boolean | string | number | Object | null)[]\n | null,\n opts: {\n headers?: HttpHeaders | {[name: string]: string | string[]};\n status?: number;\n statusText?: string;\n } = {},\n ): void {\n if (this.cancelled) {\n throw new Error(`Cannot flush a cancelled request.`);\n }\n const url = this.request.urlWithParams;\n const headers =\n opts.headers instanceof HttpHeaders ? opts.headers : new HttpHeaders(opts.headers);\n body = _maybeConvertBody(this.request.responseType, body);\n let statusText: string | undefined = opts.statusText;\n let status: number = opts.status !== undefined ? opts.status : HttpStatusCode.Ok;\n if (opts.status === undefined) {\n if (body === null) {\n status = HttpStatusCode.NoContent;\n statusText ||= 'No Content';\n } else {\n statusText ||= 'OK';\n }\n }\n if (statusText === undefined) {\n throw new Error('statusText is required when setting a custom status.');\n }\n if (status >= 200 && status < 300) {\n this.observer.next(new HttpResponse({body, headers, status, statusText, url}));\n this.observer.complete();\n } else {\n this.observer.error(new HttpErrorResponse({error: body, headers, status, statusText, url}));\n }\n }\n\n /**\n * Resolve the request by returning an `ErrorEvent` (e.g. simulating a network failure).\n * @deprecated Http requests never emit an `ErrorEvent`. Please specify a `ProgressEvent`.\n */\n error(error: ErrorEvent, opts?: TestRequestErrorOptions): void;\n /**\n * Resolve the request by returning an `ProgressEvent` (e.g. simulating a network failure).\n */\n error(error: ProgressEvent, opts?: TestRequestErrorOptions): void;\n error(error: ProgressEvent | ErrorEvent, opts: TestRequestErrorOptions = {}): void {\n if (this.cancelled) {\n throw new Error(`Cannot return an error for a cancelled request.`);\n }\n if (opts.status && opts.status >= 200 && opts.status < 300) {\n throw new Error(`error() called with a successful status.`);\n }\n const headers =\n opts.headers instanceof HttpHeaders ? opts.headers : new HttpHeaders(opts.headers);\n this.observer.error(\n new HttpErrorResponse({\n error,\n headers,\n status: opts.status || 0,\n statusText: opts.statusText || '',\n url: this.request.urlWithParams,\n }),\n );\n }\n\n /**\n * Deliver an arbitrary `HttpEvent` (such as a progress event) on the response stream for this\n * request.\n */\n event(event: HttpEvent): void {\n if (this.cancelled) {\n throw new Error(`Cannot send events to a cancelled request.`);\n }\n this.observer.next(event);\n }\n}\n\n/**\n * Helper function to convert a response body to an ArrayBuffer.\n */\nfunction _toArrayBufferBody(\n body: ArrayBuffer | Blob | string | number | Object | (string | number | Object | null)[],\n): ArrayBuffer {\n if (typeof ArrayBuffer === 'undefined') {\n throw new Error('ArrayBuffer responses are not supported on this platform.');\n }\n if (body instanceof ArrayBuffer) {\n return body;\n }\n throw new Error('Automatic conversion to ArrayBuffer is not supported for response type.');\n}\n\n/**\n * Helper function to convert a response body to a Blob.\n */\nfunction _toBlob(\n body: ArrayBuffer | Blob | string | number | Object | (string | number | Object | null)[],\n): Blob {\n if (typeof Blob === 'undefined') {\n throw new Error('Blob responses are not supported on this platform.');\n }\n if (body instanceof Blob) {\n return body;\n }\n if (ArrayBuffer && body instanceof ArrayBuffer) {\n return new Blob([body]);\n }\n throw new Error('Automatic conversion to Blob is not supported for response type.');\n}\n\n/**\n * Helper function to convert a response body to JSON data.\n */\nfunction _toJsonBody(\n body:\n | ArrayBuffer\n | Blob\n | boolean\n | string\n | number\n | Object\n | (boolean | string | number | Object | null)[],\n format: string = 'JSON',\n): Object | string | number | (Object | string | number)[] {\n if (typeof ArrayBuffer !== 'undefined' && body instanceof ArrayBuffer) {\n throw new Error(`Automatic conversion to ${format} is not supported for ArrayBuffers.`);\n }\n if (typeof Blob !== 'undefined' && body instanceof Blob) {\n throw new Error(`Automatic conversion to ${format} is not supported for Blobs.`);\n }\n if (\n typeof body === 'string' ||\n typeof body === 'number' ||\n typeof body === 'object' ||\n typeof body === 'boolean' ||\n Array.isArray(body)\n ) {\n return body;\n }\n throw new Error(`Automatic conversion to ${format} is not supported for response type.`);\n}\n\n/**\n * Helper function to convert a response body to a string.\n */\nfunction _toTextBody(\n body: ArrayBuffer | Blob | string | number | Object | (string | number | Object | null)[],\n): string {\n if (typeof body === 'string') {\n return body;\n }\n if (typeof ArrayBuffer !== 'undefined' && body instanceof ArrayBuffer) {\n throw new Error('Automatic conversion to text is not supported for ArrayBuffers.');\n }\n if (typeof Blob !== 'undefined' && body instanceof Blob) {\n throw new Error('Automatic conversion to text is not supported for Blobs.');\n }\n return JSON.stringify(_toJsonBody(body, 'text'));\n}\n\n/**\n * Convert a response body to the requested type.\n */\nfunction _maybeConvertBody(\n responseType: string,\n body: ArrayBuffer | Blob | string | number | Object | (string | number | Object | null)[] | null,\n): ArrayBuffer | Blob | string | number | Object | (string | number | Object | null)[] | null {\n if (body === null) {\n return null;\n }\n switch (responseType) {\n case 'arraybuffer':\n return _toArrayBufferBody(body);\n case 'blob':\n return _toBlob(body);\n case 'json':\n return _toJsonBody(body);\n case 'text':\n return _toTextBody(body);\n default:\n throw new Error(`Unsupported responseType: ${responseType}`);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {HttpBackend, HttpEvent, HttpEventType, HttpRequest} from '../../index';\nimport {Injectable} from '@angular/core';\nimport {Observable, Observer} from 'rxjs';\n\nimport {HttpTestingController, RequestMatch} from './api';\nimport {TestRequest} from './request';\n\n/**\n * A testing backend for `HttpClient` which both acts as an `HttpBackend`\n * and as the `HttpTestingController`.\n *\n * `HttpClientTestingBackend` works by keeping a list of all open requests.\n * As requests come in, they're added to the list. Users can assert that specific\n * requests were made and then flush them. In the end, a verify() method asserts\n * that no unexpected requests were made.\n *\n *\n */\n@Injectable()\nexport class HttpClientTestingBackend implements HttpBackend, HttpTestingController {\n /**\n * List of pending requests which have not yet been expected.\n */\n private open: TestRequest[] = [];\n\n /**\n * Used when checking if we need to throw the NOT_USING_FETCH_BACKEND_IN_SSR error\n */\n private isTestingBackend = true;\n\n /**\n * Handle an incoming request by queueing it in the list of open requests.\n */\n handle(req: HttpRequest): Observable> {\n return new Observable((observer: Observer) => {\n const testReq = new TestRequest(req, observer);\n this.open.push(testReq);\n observer.next({type: HttpEventType.Sent} as HttpEvent);\n return () => {\n testReq._cancelled = true;\n };\n });\n }\n\n /**\n * Helper function to search for requests in the list of open requests.\n */\n private _match(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n ): TestRequest[] {\n if (typeof match === 'string') {\n return this.open.filter((testReq) => testReq.request.urlWithParams === match);\n } else if (typeof match === 'function') {\n return this.open.filter((testReq) => match(testReq.request));\n } else {\n return this.open.filter(\n (testReq) =>\n (!match.method || testReq.request.method === match.method.toUpperCase()) &&\n (!match.url || testReq.request.urlWithParams === match.url),\n );\n }\n }\n\n /**\n * Search for requests in the list of open requests, and return all that match\n * without asserting anything about the number of matches.\n */\n match(match: string | RequestMatch | ((req: HttpRequest) => boolean)): TestRequest[] {\n const results = this._match(match);\n results.forEach((result) => {\n const index = this.open.indexOf(result);\n if (index !== -1) {\n this.open.splice(index, 1);\n }\n });\n return results;\n }\n\n /**\n * Expect that a single outstanding request matches the given matcher, and return\n * it.\n *\n * Requests returned through this API will no longer be in the list of open requests,\n * and thus will not match twice.\n */\n expectOne(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n description?: string,\n ): TestRequest {\n description ||= this.descriptionFromMatcher(match);\n const matches = this.match(match);\n if (matches.length > 1) {\n throw new Error(\n `Expected one matching request for criteria \"${description}\", found ${matches.length} requests.`,\n );\n }\n if (matches.length === 0) {\n let message = `Expected one matching request for criteria \"${description}\", found none.`;\n if (this.open.length > 0) {\n // Show the methods and URLs of open requests in the error, for convenience.\n const requests = this.open.map(describeRequest).join(', ');\n message += ` Requests received are: ${requests}.`;\n }\n throw new Error(message);\n }\n return matches[0];\n }\n\n /**\n * Expect that no outstanding requests match the given matcher, and throw an error\n * if any do.\n */\n expectNone(\n match: string | RequestMatch | ((req: HttpRequest) => boolean),\n description?: string,\n ): void {\n description ||= this.descriptionFromMatcher(match);\n const matches = this.match(match);\n if (matches.length > 0) {\n throw new Error(\n `Expected zero matching requests for criteria \"${description}\", found ${matches.length}.`,\n );\n }\n }\n\n /**\n * Validate that there are no outstanding requests.\n */\n verify(opts: {ignoreCancelled?: boolean} = {}): void {\n let open = this.open;\n // It's possible that some requests may be cancelled, and this is expected.\n // The user can ask to ignore open requests which have been cancelled.\n if (opts.ignoreCancelled) {\n open = open.filter((testReq) => !testReq.cancelled);\n }\n if (open.length > 0) {\n // Show the methods and URLs of open requests in the error, for convenience.\n const requests = open.map(describeRequest).join(', ');\n throw new Error(`Expected no open requests, found ${open.length}: ${requests}`);\n }\n }\n\n private descriptionFromMatcher(\n matcher: string | RequestMatch | ((req: HttpRequest) => boolean),\n ): string {\n if (typeof matcher === 'string') {\n return `Match URL: ${matcher}`;\n } else if (typeof matcher === 'object') {\n const method = matcher.method || '(any)';\n const url = matcher.url || '(any)';\n return `Match method: ${method}, URL: ${url}`;\n } else {\n return `Match by function: ${matcher.name}`;\n }\n }\n}\n\nfunction describeRequest(testRequest: TestRequest): string {\n const url = testRequest.request.urlWithParams;\n const method = testRequest.request.method;\n return `${method} ${url}`;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {HttpBackend, ɵREQUESTS_CONTRIBUTE_TO_STABILITY} from '../../index';\nimport {Provider} from '@angular/core';\n\nimport {HttpTestingController} from './api';\nimport {HttpClientTestingBackend} from './backend';\n\nexport function provideHttpClientTesting(): Provider[] {\n return [\n HttpClientTestingBackend,\n {provide: HttpBackend, useExisting: HttpClientTestingBackend},\n {provide: HttpTestingController, useExisting: HttpClientTestingBackend},\n {provide: ɵREQUESTS_CONTRIBUTE_TO_STABILITY, useValue: false},\n ];\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {HttpClientModule} from '../../index';\nimport {NgModule} from '@angular/core';\n\nimport {provideHttpClientTesting} from './provider';\n\n/**\n * Configures `HttpClientTestingBackend` as the `HttpBackend` used by `HttpClient`.\n *\n * Inject `HttpTestingController` to expect and flush requests in your tests.\n *\n * @publicApi\n *\n * @deprecated Add `provideHttpClientTesting()` to your providers instead.\n */\n@NgModule({\n imports: [HttpClientModule],\n providers: [provideHttpClientTesting()],\n})\nexport class HttpClientTestingModule {}\n"],"names":["ɵREQUESTS_CONTRIBUTE_TO_STABILITY"],"mappings":";;;;;;;;;;;;;;AAsBA;;;;;AAKG;MACmB,qBAAqB,CAAA;AA+F1C;;AC/FD;;;;;;;AAOG;MACU,WAAW,CAAA;AAcb,IAAA,OAAA;AACC,IAAA,QAAA;AAdV;;AAEG;AACH,IAAA,IAAI,SAAS,GAAA;QACX,OAAO,IAAI,CAAC,UAAU;;AAGxB;;AAEG;IACH,UAAU,GAAG,KAAK;IAElB,WACS,CAAA,OAAyB,EACxB,QAAkC,EAAA;QADnC,IAAO,CAAA,OAAA,GAAP,OAAO;QACN,IAAQ,CAAA,QAAA,GAAR,QAAQ;;AAGlB;;;;;;;AAOG;AACH,IAAA,KAAK,CACH,IAQQ,EACR,IAAA,GAII,EAAE,EAAA;AAEN,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,iCAAA,CAAmC,CAAC;;AAEtD,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa;QACtC,MAAM,OAAO,GACX,IAAI,CAAC,OAAO,YAAY,WAAW,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC;QACpF,IAAI,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,IAAI,CAAC;AACzD,QAAA,IAAI,UAAU,GAAuB,IAAI,CAAC,UAAU;AACpD,QAAA,IAAI,MAAM,GAAW,IAAI,CAAC,MAAM,KAAK,SAAS,GAAG,IAAI,CAAC,MAAM,GAAG,cAAc,CAAC,EAAE;AAChF,QAAA,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE;AAC7B,YAAA,IAAI,IAAI,KAAK,IAAI,EAAE;AACjB,gBAAA,MAAM,GAAG,cAAc,CAAC,SAAS;gBACjC,UAAU,KAAK,YAAY;;iBACtB;gBACL,UAAU,KAAK,IAAI;;;AAGvB,QAAA,IAAI,UAAU,KAAK,SAAS,EAAE;AAC5B,YAAA,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC;;QAEzE,IAAI,MAAM,IAAI,GAAG,IAAI,MAAM,GAAG,GAAG,EAAE;YACjC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,YAAY,CAAM,EAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAC,CAAC,CAAC;AACnF,YAAA,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE;;aACnB;YACL,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,iBAAiB,CAAC,EAAC,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,GAAG,EAAC,CAAC,CAAC;;;AAa/F,IAAA,KAAK,CAAC,KAAiC,EAAE,IAAA,GAAgC,EAAE,EAAA;AACzE,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,+CAAA,CAAiD,CAAC;;AAEpE,QAAA,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,MAAM,GAAG,GAAG,EAAE;AAC1D,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,wCAAA,CAA0C,CAAC;;QAE7D,MAAM,OAAO,GACX,IAAI,CAAC,OAAO,YAAY,WAAW,GAAG,IAAI,CAAC,OAAO,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC;AACpF,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CACjB,IAAI,iBAAiB,CAAC;YACpB,KAAK;YACL,OAAO;AACP,YAAA,MAAM,EAAE,IAAI,CAAC,MAAM,IAAI,CAAC;AACxB,YAAA,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,EAAE;AACjC,YAAA,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,aAAa;AAChC,SAAA,CAAC,CACH;;AAGH;;;AAGG;AACH,IAAA,KAAK,CAAC,KAAqB,EAAA;AACzB,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAClB,YAAA,MAAM,IAAI,KAAK,CAAC,CAAA,0CAAA,CAA4C,CAAC;;AAE/D,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;;AAE5B;AAED;;AAEG;AACH,SAAS,kBAAkB,CACzB,IAAyF,EAAA;AAEzF,IAAA,IAAI,OAAO,WAAW,KAAK,WAAW,EAAE;AACtC,QAAA,MAAM,IAAI,KAAK,CAAC,2DAA2D,CAAC;;AAE9E,IAAA,IAAI,IAAI,YAAY,WAAW,EAAE;AAC/B,QAAA,OAAO,IAAI;;AAEb,IAAA,MAAM,IAAI,KAAK,CAAC,yEAAyE,CAAC;AAC5F;AAEA;;AAEG;AACH,SAAS,OAAO,CACd,IAAyF,EAAA;AAEzF,IAAA,IAAI,OAAO,IAAI,KAAK,WAAW,EAAE;AAC/B,QAAA,MAAM,IAAI,KAAK,CAAC,oDAAoD,CAAC;;AAEvE,IAAA,IAAI,IAAI,YAAY,IAAI,EAAE;AACxB,QAAA,OAAO,IAAI;;AAEb,IAAA,IAAI,WAAW,IAAI,IAAI,YAAY,WAAW,EAAE;AAC9C,QAAA,OAAO,IAAI,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC;;AAEzB,IAAA,MAAM,IAAI,KAAK,CAAC,kEAAkE,CAAC;AACrF;AAEA;;AAEG;AACH,SAAS,WAAW,CAClB,IAOiD,EACjD,SAAiB,MAAM,EAAA;IAEvB,IAAI,OAAO,WAAW,KAAK,WAAW,IAAI,IAAI,YAAY,WAAW,EAAE;AACrE,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,MAAM,CAAA,mCAAA,CAAqC,CAAC;;IAEzF,IAAI,OAAO,IAAI,KAAK,WAAW,IAAI,IAAI,YAAY,IAAI,EAAE;AACvD,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,MAAM,CAAA,4BAAA,CAA8B,CAAC;;IAElF,IACE,OAAO,IAAI,KAAK,QAAQ;QACxB,OAAO,IAAI,KAAK,QAAQ;QACxB,OAAO,IAAI,KAAK,QAAQ;QACxB,OAAO,IAAI,KAAK,SAAS;AACzB,QAAA,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EACnB;AACA,QAAA,OAAO,IAAI;;AAEb,IAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,MAAM,CAAA,oCAAA,CAAsC,CAAC;AAC1F;AAEA;;AAEG;AACH,SAAS,WAAW,CAClB,IAAyF,EAAA;AAEzF,IAAA,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;AAC5B,QAAA,OAAO,IAAI;;IAEb,IAAI,OAAO,WAAW,KAAK,WAAW,IAAI,IAAI,YAAY,WAAW,EAAE;AACrE,QAAA,MAAM,IAAI,KAAK,CAAC,iEAAiE,CAAC;;IAEpF,IAAI,OAAO,IAAI,KAAK,WAAW,IAAI,IAAI,YAAY,IAAI,EAAE;AACvD,QAAA,MAAM,IAAI,KAAK,CAAC,0DAA0D,CAAC;;IAE7E,OAAO,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;AAClD;AAEA;;AAEG;AACH,SAAS,iBAAiB,CACxB,YAAoB,EACpB,IAAgG,EAAA;AAEhG,IAAA,IAAI,IAAI,KAAK,IAAI,EAAE;AACjB,QAAA,OAAO,IAAI;;IAEb,QAAQ,YAAY;AAClB,QAAA,KAAK,aAAa;AAChB,YAAA,OAAO,kBAAkB,CAAC,IAAI,CAAC;AACjC,QAAA,KAAK,MAAM;AACT,YAAA,OAAO,OAAO,CAAC,IAAI,CAAC;AACtB,QAAA,KAAK,MAAM;AACT,YAAA,OAAO,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,MAAM;AACT,YAAA,OAAO,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA;AACE,YAAA,MAAM,IAAI,KAAK,CAAC,6BAA6B,YAAY,CAAA,CAAE,CAAC;;AAElE;;AC7OA;;;;;;;;;;AAUG;MAEU,wBAAwB,CAAA;AACnC;;AAEG;IACK,IAAI,GAAkB,EAAE;AAEhC;;AAEG;IACK,gBAAgB,GAAG,IAAI;AAE/B;;AAEG;AACH,IAAA,MAAM,CAAC,GAAqB,EAAA;AAC1B,QAAA,OAAO,IAAI,UAAU,CAAC,CAAC,QAAuB,KAAI;YAChD,MAAM,OAAO,GAAG,IAAI,WAAW,CAAC,GAAG,EAAE,QAAQ,CAAC;AAC9C,YAAA,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;YACvB,QAAQ,CAAC,IAAI,CAAC,EAAC,IAAI,EAAE,aAAa,CAAC,IAAI,EAAmB,CAAC;AAC3D,YAAA,OAAO,MAAK;AACV,gBAAA,OAAO,CAAC,UAAU,GAAG,IAAI;AAC3B,aAAC;AACH,SAAC,CAAC;;AAGJ;;AAEG;AACK,IAAA,MAAM,CACZ,KAAmE,EAAA;AAEnE,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC7B,YAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK,OAAO,CAAC,OAAO,CAAC,aAAa,KAAK,KAAK,CAAC;;AACxE,aAAA,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE;AACtC,YAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;;aACvD;AACL,YAAA,OAAO,IAAI,CAAC,IAAI,CAAC,MAAM,CACrB,CAAC,OAAO,KACN,CAAC,CAAC,KAAK,CAAC,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM,CAAC,WAAW,EAAE;AACvE,iBAAC,CAAC,KAAK,CAAC,GAAG,IAAI,OAAO,CAAC,OAAO,CAAC,aAAa,KAAK,KAAK,CAAC,GAAG,CAAC,CAC9D;;;AAIL;;;AAGG;AACH,IAAA,KAAK,CAAC,KAAmE,EAAA;QACvE,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;AAClC,QAAA,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,KAAI;YACzB,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;AACvC,YAAA,IAAI,KAAK,KAAK,EAAE,EAAE;gBAChB,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;;AAE9B,SAAC,CAAC;AACF,QAAA,OAAO,OAAO;;AAGhB;;;;;;AAMG;IACH,SAAS,CACP,KAAmE,EACnE,WAAoB,EAAA;AAEpB,QAAA,WAAW,KAAK,IAAI,CAAC,sBAAsB,CAAC,KAAK,CAAC;QAClD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AACjC,QAAA,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YACtB,MAAM,IAAI,KAAK,CACb,CAA+C,4CAAA,EAAA,WAAW,CAAY,SAAA,EAAA,OAAO,CAAC,MAAM,CAAY,UAAA,CAAA,CACjG;;AAEH,QAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE;AACxB,YAAA,IAAI,OAAO,GAAG,CAA+C,4CAAA,EAAA,WAAW,gBAAgB;YACxF,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;;AAExB,gBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;AAC1D,gBAAA,OAAO,IAAI,CAAA,wBAAA,EAA2B,QAAQ,CAAA,CAAA,CAAG;;AAEnD,YAAA,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC;;AAE1B,QAAA,OAAO,OAAO,CAAC,CAAC,CAAC;;AAGnB;;;AAGG;IACH,UAAU,CACR,KAAmE,EACnE,WAAoB,EAAA;AAEpB,QAAA,WAAW,KAAK,IAAI,CAAC,sBAAsB,CAAC,KAAK,CAAC;QAClD,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AACjC,QAAA,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YACtB,MAAM,IAAI,KAAK,CACb,CAAiD,8CAAA,EAAA,WAAW,CAAY,SAAA,EAAA,OAAO,CAAC,MAAM,CAAG,CAAA,CAAA,CAC1F;;;AAIL;;AAEG;IACH,MAAM,CAAC,OAAoC,EAAE,EAAA;AAC3C,QAAA,IAAI,IAAI,GAAG,IAAI,CAAC,IAAI;;;AAGpB,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE;AACxB,YAAA,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC;;AAErD,QAAA,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;;AAEnB,YAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;YACrD,MAAM,IAAI,KAAK,CAAC,CAAoC,iCAAA,EAAA,IAAI,CAAC,MAAM,CAAK,EAAA,EAAA,QAAQ,CAAE,CAAA,CAAC;;;AAI3E,IAAA,sBAAsB,CAC5B,OAAqE,EAAA;AAErE,QAAA,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE;YAC/B,OAAO,CAAA,WAAA,EAAc,OAAO,CAAA,CAAE;;AACzB,aAAA,IAAI,OAAO,OAAO,KAAK,QAAQ,EAAE;AACtC,YAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,IAAI,OAAO;AACxC,YAAA,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,IAAI,OAAO;AAClC,YAAA,OAAO,CAAiB,cAAA,EAAA,MAAM,CAAU,OAAA,EAAA,GAAG,EAAE;;aACxC;AACL,YAAA,OAAO,CAAsB,mBAAA,EAAA,OAAO,CAAC,IAAI,EAAE;;;kHArIpC,wBAAwB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHAAxB,wBAAwB,EAAA,CAAA;;sGAAxB,wBAAwB,EAAA,UAAA,EAAA,CAAA;kBADpC;;AA2ID,SAAS,eAAe,CAAC,WAAwB,EAAA;AAC/C,IAAA,MAAM,GAAG,GAAG,WAAW,CAAC,OAAO,CAAC,aAAa;AAC7C,IAAA,MAAM,MAAM,GAAG,WAAW,CAAC,OAAO,CAAC,MAAM;AACzC,IAAA,OAAO,CAAG,EAAA,MAAM,CAAI,CAAA,EAAA,GAAG,EAAE;AAC3B;;SC3JgB,wBAAwB,GAAA;IACtC,OAAO;QACL,wBAAwB;AACxB,QAAA,EAAC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,wBAAwB,EAAC;AAC7D,QAAA,EAAC,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,wBAAwB,EAAC;AACvE,QAAA,EAAC,OAAO,EAAEA,gCAAiC,EAAE,QAAQ,EAAE,KAAK,EAAC;KAC9D;AACH;;ACRA;;;;;;;;AAQG;MAKU,uBAAuB,CAAA;kHAAvB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA;AAAvB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,YAHxB,gBAAgB,CAAA,EAAA,CAAA;AAGf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,uBAAuB,aAFvB,CAAC,wBAAwB,EAAE,CAAC,YAD7B,gBAAgB,CAAA,EAAA,CAAA;;sGAGf,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAJnC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,gBAAgB,CAAC;AAC3B,oBAAA,SAAS,EAAE,CAAC,wBAAwB,EAAE,CAAC;AACxC,iBAAA;;;;;"}Q x _ߠ/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import * as i0 from '@angular/core'; import { InjectionToken, inject, Injectable, Optional, Inject, ɵɵinject as __inject } from '@angular/core'; import { Subject } from 'rxjs'; import { DOCUMENT } from './dom_tokens-rA0ACyx7.mjs'; let _DOM = null; function getDOM() { return _DOM; } function setRootDomAdapter(adapter) { _DOM ??= adapter; } /** * Provides DOM operations in an environment-agnostic way. * * @security Tread carefully! Interacting with the DOM directly is dangerous and * can introduce XSS risks. */ class DomAdapter { } /** * This class should not be used directly by an application developer. Instead, use * {@link Location}. * * `PlatformLocation` encapsulates all calls to DOM APIs, which allows the Router to be * platform-agnostic. * This means that we can have different implementation of `PlatformLocation` for the different * platforms that Angular supports. For example, `@angular/platform-browser` provides an * implementation specific to the browser environment, while `@angular/platform-server` provides * one suitable for use with server-side rendering. * * The `PlatformLocation` class is used directly by all implementations of {@link LocationStrategy} * when they need to interact with the DOM APIs like pushState, popState, etc. * * {@link LocationStrategy} in turn is used by the {@link Location} service which is used directly * by the {@link /api/router/Router Router} in order to navigate between routes. Since all interactions between * {@link /api/router/Router Router} / * {@link Location} / {@link LocationStrategy} and DOM APIs flow through the `PlatformLocation` * class, they are all platform-agnostic. * * @publicApi */ class PlatformLocation { historyGo(relativePosition) { throw new Error(ngDevMode ? 'Not implemented' : ''); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PlatformLocation, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PlatformLocation, providedIn: 'platform', useFactory: () => inject(BrowserPlatformLocation) }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PlatformLocation, decorators: [{ type: Injectable, args: [{ providedIn: 'platform', useFactory: () => inject(BrowserPlatformLocation) }] }] }); /** * @description * Indicates when a location is initialized. * * @publicApi */ const LOCATION_INITIALIZED = new InjectionToken(ngDevMode ? 'Location Initialized' : ''); /** * `PlatformLocation` encapsulates all of the direct calls to platform APIs. * This class should not be used directly by an application developer. Instead, use * {@link Location}. * * @publicApi */ class BrowserPlatformLocation extends PlatformLocation { _location; _history; _doc = inject(DOCUMENT); constructor() { super(); this._location = window.location; this._history = window.history; } getBaseHrefFromDOM() { return getDOM().getBaseHref(this._doc); } onPopState(fn) { const window = getDOM().getGlobalEventTarget(this._doc, 'window'); window.addEventListener('popstate', fn, false); return () => window.removeEventListener('popstate', fn); } onHashChange(fn) { const window = getDOM().getGlobalEventTarget(this._doc, 'window'); window.addEventListener('hashchange', fn, false); return () => window.removeEventListener('hashchange', fn); } get href() { return this._location.href; } get protocol() { return this._location.protocol; } get hostname() { return this._location.hostname; } get port() { return this._location.port; } get pathname() { return this._location.pathname; } get search() { return this._location.search; } get hash() { return this._location.hash; } set pathname(newPath) { this._location.pathname = newPath; } pushState(state, title, url) { this._history.pushState(state, title, url); } replaceState(state, title, url) { this._history.replaceState(state, title, url); } forward() { this._history.forward(); } back() { this._history.back(); } historyGo(relativePosition = 0) { this._history.go(relativePosition); } getState() { return this._history.state; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BrowserPlatformLocation, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BrowserPlatformLocation, providedIn: 'platform', useFactory: () => new BrowserPlatformLocation() }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BrowserPlatformLocation, decorators: [{ type: Injectable, args: [{ providedIn: 'platform', useFactory: () => new BrowserPlatformLocation(), }] }], ctorParameters: () => [] }); /** * Joins two parts of a URL with a slash if needed. * * @param start URL string * @param end URL string * * * @returns The joined URL string. */ function joinWithSlash(start, end) { // If `start` is an empty string, return `end` as the result. if (!start) return end; // If `end` is an empty string, return `start` as the result. if (!end) return start; // If `start` ends with a slash, remove the leading slash from `end`. if (start.endsWith('/')) { return end.startsWith('/') ? start + end.slice(1) : start + end; } // If `start` doesn't end with a slash, add one if `end` doesn't start with a slash. return end.startsWith('/') ? start + end : `${start}/${end}`; } /** * Removes a trailing slash from a URL string if needed. * Looks for the first occurrence of either `#`, `?`, or the end of the * line as `/` characters and removes the trailing slash if one exists. * * @param url URL string. * * @returns The URL string, modified if needed. */ function stripTrailingSlash(url) { // Find the index of the first occurrence of `#`, `?`, or the end of the string. // This marks the start of the query string, fragment, or the end of the URL path. const pathEndIdx = url.search(/#|\?|$/); // Check if the character before `pathEndIdx` is a trailing slash. // If it is, remove the trailing slash and return the modified URL. // Otherwise, return the URL as is. return url[pathEndIdx - 1] === '/' ? url.slice(0, pathEndIdx - 1) + url.slice(pathEndIdx) : url; } /** * Normalizes URL parameters by prepending with `?` if needed. * * @param params String of URL parameters. * * @returns The normalized URL parameters string. */ function normalizeQueryParams(params) { return params && params[0] !== '?' ? `?${params}` : params; } /** * Enables the `Location` service to read route state from the browser's URL. * Angular provides two strategies: * `HashLocationStrategy` and `PathLocationStrategy`. * * Applications should use the `Router` or `Location` services to * interact with application route state. * * For instance, `HashLocationStrategy` produces URLs like * http://example.com/#/foo, * and `PathLocationStrategy` produces * http://example.com/foo as an equivalent URL. * * See these two classes for more. * * @publicApi */ class LocationStrategy { historyGo(relativePosition) { throw new Error(ngDevMode ? 'Not implemented' : ''); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LocationStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LocationStrategy, providedIn: 'root', useFactory: () => inject(PathLocationStrategy) }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LocationStrategy, decorators: [{ type: Injectable, args: [{ providedIn: 'root', useFactory: () => inject(PathLocationStrategy) }] }] }); /** * A predefined DI token for the base href * to be used with the `PathLocationStrategy`. * The base href is the URL prefix that should be preserved when generating * and recognizing URLs. * * @usageNotes * * The following example shows how to use this token to configure the root app injector * with a base href value, so that the DI framework can supply the dependency anywhere in the app. * * ```ts * import {NgModule} from '@angular/core'; * import {APP_BASE_HREF} from '@angular/common'; * * @NgModule({ * providers: [{provide: APP_BASE_HREF, useValue: '/my/app'}] * }) * class AppModule {} * ``` * * @publicApi */ const APP_BASE_HREF = new InjectionToken(ngDevMode ? 'appBaseHref' : ''); /** * @description * A {@link LocationStrategy} used to configure the {@link Location} service to * represent its state in the * [path](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) of the * browser's URL. * * If you're using `PathLocationStrategy`, you may provide a {@link APP_BASE_HREF} * or add a `` element to the document to override the default. * * For instance, if you provide an `APP_BASE_HREF` of `'/my/app/'` and call * `location.go('/foo')`, the browser's URL will become * `example.com/my/app/foo`. To ensure all relative URIs resolve correctly, * the `` and/or `APP_BASE_HREF` should end with a `/`. * * Similarly, if you add `` to the document and call * `location.go('/foo')`, the browser's URL will become * `example.com/my/app/foo`. * * Note that when using `PathLocationStrategy`, neither the query nor * the fragment in the `` will be preserved, as outlined * by the [RFC](https://tools.ietf.org/html/rfc3986#section-5.2.2). * * @usageNotes * * ### Example * * {@example common/location/ts/path_location_component.ts region='LocationComponent'} * * @publicApi */ class PathLocationStrategy extends LocationStrategy { _platformLocation; _baseHref; _removeListenerFns = []; constructor(_platformLocation, href) { super(); this._platformLocation = _platformLocation; this._baseHref = href ?? this._platformLocation.getBaseHrefFromDOM() ?? inject(DOCUMENT).location?.origin ?? ''; } /** @docs-private */ ngOnDestroy() { while (this._removeListenerFns.length) { this._removeListenerFns.pop()(); } } onPopState(fn) { this._removeListenerFns.push(this._platformLocation.onPopState(fn), this._platformLocation.onHashChange(fn)); } getBaseHref() { return this._baseHref; } prepareExternalUrl(internal) { return joinWithSlash(this._baseHref, internal); } path(includeHash = false) { const pathname = this._platformLocation.pathname + normalizeQueryParams(this._platformLocation.search); const hash = this._platformLocation.hash; return hash && includeHash ? `${pathname}${hash}` : pathname; } pushState(state, title, url, queryParams) { const externalUrl = this.prepareExternalUrl(url + normalizeQueryParams(queryParams)); this._platformLocation.pushState(state, title, externalUrl); } replaceState(state, title, url, queryParams) { const externalUrl = this.prepareExternalUrl(url + normalizeQueryParams(queryParams)); this._platformLocation.replaceState(state, title, externalUrl); } forward() { this._platformLocation.forward(); } back() { this._platformLocation.back(); } getState() { return this._platformLocation.getState(); } historyGo(relativePosition = 0) { this._platformLocation.historyGo?.(relativePosition); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PathLocationStrategy, deps: [{ token: PlatformLocation }, { token: APP_BASE_HREF, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PathLocationStrategy, providedIn: 'root' }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PathLocationStrategy, decorators: [{ type: Injectable, args: [{ providedIn: 'root' }] }], ctorParameters: () => [{ type: PlatformLocation }, { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [APP_BASE_HREF] }] }] }); /** * @description * * A service that applications can use to interact with a browser's URL. * * Depending on the `LocationStrategy` used, `Location` persists * to the URL's path or the URL's hash segment. * * @usageNotes * * It's better to use the `Router.navigate()` service to trigger route changes. Use * `Location` only if you need to interact with or create normalized URLs outside of * routing. * * `Location` is responsible for normalizing the URL against the application's base href. * A normalized URL is absolute from the URL host, includes the application's base href, and has no * trailing slash: * - `/my/app/user/123` is normalized * - `my/app/user/123` **is not** normalized * - `/my/app/user/123/` **is not** normalized * * ### Example * * {@example common/location/ts/path_location_component.ts region='LocationComponent'} * * @publicApi */ class Location { /** @internal */ _subject = new Subject(); /** @internal */ _basePath; /** @internal */ _locationStrategy; /** @internal */ _urlChangeListeners = []; /** @internal */ _urlChangeSubscription = null; constructor(locationStrategy) { this._locationStrategy = locationStrategy; const baseHref = this._locationStrategy.getBaseHref(); // Note: This class's interaction with base HREF does not fully follow the rules // outlined in the spec https://www.freesoft.org/CIE/RFC/1808/18.htm. // Instead of trying to fix individual bugs with more and more code, we should // investigate using the URL constructor and providing the base as a second // argument. // https://developer.mozilla.org/en-US/docs/Web/API/URL/URL#parameters this._basePath = _stripOrigin(stripTrailingSlash(_stripIndexHtml(baseHref))); this._locationStrategy.onPopState((ev) => { this._subject.next({ 'url': this.path(true), 'pop': true, 'state': ev.state, 'type': ev.type, }); }); } /** @docs-private */ ngOnDestroy() { this._urlChangeSubscription?.unsubscribe(); this._urlChangeListeners = []; } /** * Normalizes the URL path for this location. * * @param includeHash True to include an anchor fragment in the path. * * @returns The normalized URL path. */ // TODO: vsavkin. Remove the boolean flag and always include hash once the deprecated router is // removed. path(includeHash = false) { return this.normalize(this._locationStrategy.path(includeHash)); } /** * Reports the current state of the location history. * @returns The current value of the `history.state` object. */ getState() { return this._locationStrategy.getState(); } /** * Normalizes the given path and compares to the current normalized path. * * @param path The given URL path. * @param query Query parameters. * * @returns True if the given URL path is equal to the current normalized path, false * otherwise. */ isCurrentPathEqualTo(path, query = '') { return this.path() == this.normalize(path + normalizeQueryParams(query)); } /** * Normalizes a URL path by stripping any trailing slashes. * * @param url String representing a URL. * * @returns The normalized URL string. */ normalize(url) { return Location.stripTrailingSlash(_stripBasePath(this._basePath, _stripIndexHtml(url))); } /** * Normalizes an external URL path. * If the given URL doesn't begin with a leading slash (`'/'`), adds one * before normalizing. Adds a hash if `HashLocationStrategy` is * in use, or the `APP_BASE_HREF` if the `PathLocationStrategy` is in use. * * @param url String representing a URL. * * @returns A normalized platform-specific URL. */ prepareExternalUrl(url) { if (url && url[0] !== '/') { url = '/' + url; } return this._locationStrategy.prepareExternalUrl(url); } // TODO: rename this method to pushState /** * Changes the browser's URL to a normalized version of a given URL, and pushes a * new item onto the platform's history. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. * */ go(path, query = '', state = null) { this._locationStrategy.pushState(state, '', path, query); this._notifyUrlChangeListeners(this.prepareExternalUrl(path + normalizeQueryParams(query)), state); } /** * Changes the browser's URL to a normalized version of the given URL, and replaces * the top item on the platform's history stack. * * @param path URL path to normalize. * @param query Query parameters. * @param state Location history state. */ replaceState(path, query = '', state = null) { this._locationStrategy.replaceState(state, '', path, query); this._notifyUrlChangeListeners(this.prepareExternalUrl(path + normalizeQueryParams(query)), state); } /** * Navigates forward in the platform's history. */ forward() { this._locationStrategy.forward(); } /** * Navigates back in the platform's history. */ back() { this._locationStrategy.back(); } /** * Navigate to a specific page from session history, identified by its relative position to the * current page. * * @param relativePosition Position of the target page in the history relative to the current * page. * A negative value moves backwards, a positive value moves forwards, e.g. `location.historyGo(2)` * moves forward two pages and `location.historyGo(-2)` moves back two pages. When we try to go * beyond what's stored in the history session, we stay in the current page. Same behaviour occurs * when `relativePosition` equals 0. * @see https://developer.mozilla.org/en-US/docs/Web/API/History_API#Moving_to_a_specific_point_in_history */ historyGo(relativePosition = 0) { this._locationStrategy.historyGo?.(relativePosition); } /** * Registers a URL change listener. Use to catch updates performed by the Angular * framework that are not detectible through "popstate" or "hashchange" events. * * @param fn The change handler function, which take a URL and a location history state. * @returns A function that, when executed, unregisters a URL change listener. */ onUrlChange(fn) { this._urlChangeListeners.push(fn); this._urlChangeSubscription ??= this.subscribe((v) => { this._notifyUrlChangeListeners(v.url, v.state); }); return () => { const fnIndex = this._urlChangeListeners.indexOf(fn); this._urlChangeListeners.splice(fnIndex, 1); if (this._urlChangeListeners.length === 0) { this._urlChangeSubscription?.unsubscribe(); this._urlChangeSubscription = null; } }; } /** @internal */ _notifyUrlChangeListeners(url = '', state) { this._urlChangeListeners.forEach((fn) => fn(url, state)); } /** * Subscribes to the platform's `popState` events. * * Note: `Location.go()` does not trigger the `popState` event in the browser. Use * `Location.onUrlChange()` to subscribe to URL changes instead. * * @param value Event that is triggered when the state history changes. * @param exception The exception to throw. * * @see [onpopstate](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate) * * @returns Subscribed events. */ subscribe(onNext, onThrow, onReturn) { return this._subject.subscribe({ next: onNext, error: onThrow ?? undefined, complete: onReturn ?? undefined, }); } /** * Normalizes URL parameters by prepending with `?` if needed. * * @param params String of URL parameters. * * @returns The normalized URL parameters string. */ static normalizeQueryParams = normalizeQueryParams; /** * Joins two parts of a URL with a slash if needed. * * @param start URL string * @param end URL string * * * @returns The joined URL string. */ static joinWithSlash = joinWithSlash; /** * Removes a trailing slash from a URL string if needed. * Looks for the first occurrence of either `#`, `?`, or the end of the * line as `/` characters and removes the trailing slash if one exists. * * @param url URL string. * * @returns The URL string, modified if needed. */ static stripTrailingSlash = stripTrailingSlash; static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Location, deps: [{ token: LocationStrategy }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Location, providedIn: 'root', useFactory: createLocation }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: Location, decorators: [{ type: Injectable, args: [{ providedIn: 'root', // See #23917 useFactory: createLocation, }] }], ctorParameters: () => [{ type: LocationStrategy }] }); function createLocation() { return new Location(__inject(LocationStrategy)); } function _stripBasePath(basePath, url) { if (!basePath || !url.startsWith(basePath)) { return url; } const strippedUrl = url.substring(basePath.length); if (strippedUrl === '' || ['/', ';', '?', '#'].includes(strippedUrl[0])) { return strippedUrl; } return url; } function _stripIndexHtml(url) { return url.replace(/\/index.html$/, ''); } function _stripOrigin(baseHref) { // DO NOT REFACTOR! Previously, this check looked like this: // `/^(https?:)?\/\//.test(baseHref)`, but that resulted in // syntactically incorrect code after Closure Compiler minification. // This was likely caused by a bug in Closure Compiler, but // for now, the check is rewritten to use `new RegExp` instead. const isAbsoluteUrl = new RegExp('^(https?:)?//').test(baseHref); if (isAbsoluteUrl) { const [, pathname] = baseHref.split(/\/\/[^\/]+/); return pathname; } return baseHref; } export { APP_BASE_HREF, BrowserPlatformLocation, DomAdapter, LOCATION_INITIALIZED, Location, LocationStrategy, PathLocationStrategy, PlatformLocation, getDOM, joinWithSlash, normalizeQueryParams, setRootDomAdapter }; //# sourceMappingURL=location-Dq4mJT-A.mjs.map 8|Gxє.k{"version":3,"file":"location-Dq4mJT-A.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/dom_adapter.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/location/platform_location.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/location/util.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/location/location_strategy.ts","../../../../../darwin_arm64-fastbuild-ST-2d99d9656325/bin/packages/common/src/location/location.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nlet _DOM: DomAdapter = null!;\n\nexport function getDOM(): DomAdapter {\n return _DOM;\n}\n\nexport function setRootDomAdapter(adapter: DomAdapter) {\n _DOM ??= adapter;\n}\n\n/**\n * Provides DOM operations in an environment-agnostic way.\n *\n * @security Tread carefully! Interacting with the DOM directly is dangerous and\n * can introduce XSS risks.\n */\nexport abstract class DomAdapter {\n // Needs Domino-friendly test utility\n abstract dispatchEvent(el: any, evt: any): any;\n abstract readonly supportsDOMEvents: boolean;\n\n // Used by Meta\n abstract remove(el: any): void;\n abstract createElement(tagName: any, doc?: any): HTMLElement;\n abstract createHtmlDocument(): Document;\n abstract getDefaultDocument(): Document;\n\n // Used by By.css\n abstract isElementNode(node: any): boolean;\n\n // Used by Testability\n abstract isShadowRoot(node: any): boolean;\n\n // Used by KeyEventsPlugin\n abstract onAndCancel(el: any, evt: any, listener: any, options?: any): Function;\n\n // Used by PlatformLocation and ServerEventManagerPlugin\n abstract getGlobalEventTarget(doc: Document, target: string): any;\n\n // Used by PlatformLocation\n abstract getBaseHref(doc: Document): string | null;\n abstract resetBaseElement(): void;\n\n // TODO: remove dependency in DefaultValueAccessor\n abstract getUserAgent(): string;\n\n // Used in the legacy @angular/http package which has some usage in g3.\n abstract getCookie(name: string): string | null;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {inject, Injectable, InjectionToken} from '@angular/core';\n\nimport {getDOM} from '../dom_adapter';\nimport {DOCUMENT} from '../dom_tokens';\n\n/**\n * This class should not be used directly by an application developer. Instead, use\n * {@link Location}.\n *\n * `PlatformLocation` encapsulates all calls to DOM APIs, which allows the Router to be\n * platform-agnostic.\n * This means that we can have different implementation of `PlatformLocation` for the different\n * platforms that Angular supports. For example, `@angular/platform-browser` provides an\n * implementation specific to the browser environment, while `@angular/platform-server` provides\n * one suitable for use with server-side rendering.\n *\n * The `PlatformLocation` class is used directly by all implementations of {@link LocationStrategy}\n * when they need to interact with the DOM APIs like pushState, popState, etc.\n *\n * {@link LocationStrategy} in turn is used by the {@link Location} service which is used directly\n * by the {@link /api/router/Router Router} in order to navigate between routes. Since all interactions between\n * {@link /api/router/Router Router} /\n * {@link Location} / {@link LocationStrategy} and DOM APIs flow through the `PlatformLocation`\n * class, they are all platform-agnostic.\n *\n * @publicApi\n */\n@Injectable({providedIn: 'platform', useFactory: () => inject(BrowserPlatformLocation)})\nexport abstract class PlatformLocation {\n abstract getBaseHrefFromDOM(): string;\n abstract getState(): unknown;\n /**\n * Returns a function that, when executed, removes the `popstate` event handler.\n */\n abstract onPopState(fn: LocationChangeListener): VoidFunction;\n /**\n * Returns a function that, when executed, removes the `hashchange` event handler.\n */\n abstract onHashChange(fn: LocationChangeListener): VoidFunction;\n\n abstract get href(): string;\n abstract get protocol(): string;\n abstract get hostname(): string;\n abstract get port(): string;\n abstract get pathname(): string;\n abstract get search(): string;\n abstract get hash(): string;\n\n abstract replaceState(state: any, title: string, url: string): void;\n\n abstract pushState(state: any, title: string, url: string): void;\n\n abstract forward(): void;\n\n abstract back(): void;\n\n historyGo?(relativePosition: number): void {\n throw new Error(ngDevMode ? 'Not implemented' : '');\n }\n}\n\n/**\n * @description\n * Indicates when a location is initialized.\n *\n * @publicApi\n */\nexport const LOCATION_INITIALIZED = new InjectionToken>(\n ngDevMode ? 'Location Initialized' : '',\n);\n\n/**\n * @description\n * A serializable version of the event from `onPopState` or `onHashChange`\n *\n * @publicApi\n */\nexport interface LocationChangeEvent {\n type: string;\n state: any;\n}\n\n/**\n * @publicApi\n */\nexport interface LocationChangeListener {\n (event: LocationChangeEvent): any;\n}\n\n/**\n * `PlatformLocation` encapsulates all of the direct calls to platform APIs.\n * This class should not be used directly by an application developer. Instead, use\n * {@link Location}.\n *\n * @publicApi\n */\n@Injectable({\n providedIn: 'platform',\n useFactory: () => new BrowserPlatformLocation(),\n})\nexport class BrowserPlatformLocation extends PlatformLocation {\n private _location: Location;\n private _history: History;\n private _doc = inject(DOCUMENT);\n\n constructor() {\n super();\n this._location = window.location;\n this._history = window.history;\n }\n\n override getBaseHrefFromDOM(): string {\n return getDOM().getBaseHref(this._doc)!;\n }\n\n override onPopState(fn: LocationChangeListener): VoidFunction {\n const window = getDOM().getGlobalEventTarget(this._doc, 'window');\n window.addEventListener('popstate', fn, false);\n return () => window.removeEventListener('popstate', fn);\n }\n\n override onHashChange(fn: LocationChangeListener): VoidFunction {\n const window = getDOM().getGlobalEventTarget(this._doc, 'window');\n window.addEventListener('hashchange', fn, false);\n return () => window.removeEventListener('hashchange', fn);\n }\n\n override get href(): string {\n return this._location.href;\n }\n override get protocol(): string {\n return this._location.protocol;\n }\n override get hostname(): string {\n return this._location.hostname;\n }\n override get port(): string {\n return this._location.port;\n }\n override get pathname(): string {\n return this._location.pathname;\n }\n override get search(): string {\n return this._location.search;\n }\n override get hash(): string {\n return this._location.hash;\n }\n override set pathname(newPath: string) {\n this._location.pathname = newPath;\n }\n\n override pushState(state: any, title: string, url: string): void {\n this._history.pushState(state, title, url);\n }\n\n override replaceState(state: any, title: string, url: string): void {\n this._history.replaceState(state, title, url);\n }\n\n override forward(): void {\n this._history.forward();\n }\n\n override back(): void {\n this._history.back();\n }\n\n override historyGo(relativePosition: number = 0): void {\n this._history.go(relativePosition);\n }\n\n override getState(): unknown {\n return this._history.state;\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\n/**\n * Joins two parts of a URL with a slash if needed.\n *\n * @param start URL string\n * @param end URL string\n *\n *\n * @returns The joined URL string.\n */\nexport function joinWithSlash(start: string, end: string) {\n // If `start` is an empty string, return `end` as the result.\n if (!start) return end;\n // If `end` is an empty string, return `start` as the result.\n if (!end) return start;\n // If `start` ends with a slash, remove the leading slash from `end`.\n if (start.endsWith('/')) {\n return end.startsWith('/') ? start + end.slice(1) : start + end;\n }\n // If `start` doesn't end with a slash, add one if `end` doesn't start with a slash.\n return end.startsWith('/') ? start + end : `${start}/${end}`;\n}\n\n/**\n * Removes a trailing slash from a URL string if needed.\n * Looks for the first occurrence of either `#`, `?`, or the end of the\n * line as `/` characters and removes the trailing slash if one exists.\n *\n * @param url URL string.\n *\n * @returns The URL string, modified if needed.\n */\nexport function stripTrailingSlash(url: string): string {\n // Find the index of the first occurrence of `#`, `?`, or the end of the string.\n // This marks the start of the query string, fragment, or the end of the URL path.\n const pathEndIdx = url.search(/#|\\?|$/);\n // Check if the character before `pathEndIdx` is a trailing slash.\n // If it is, remove the trailing slash and return the modified URL.\n // Otherwise, return the URL as is.\n return url[pathEndIdx - 1] === '/' ? url.slice(0, pathEndIdx - 1) + url.slice(pathEndIdx) : url;\n}\n\n/**\n * Normalizes URL parameters by prepending with `?` if needed.\n *\n * @param params String of URL parameters.\n *\n * @returns The normalized URL parameters string.\n */\nexport function normalizeQueryParams(params: string): string {\n return params && params[0] !== '?' ? `?${params}` : params;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Inject, inject, Injectable, InjectionToken, OnDestroy, Optional} from '@angular/core';\n\nimport {DOCUMENT} from '../dom_tokens';\n\nimport {LocationChangeListener, PlatformLocation} from './platform_location';\nimport {joinWithSlash, normalizeQueryParams} from './util';\n\n/**\n * Enables the `Location` service to read route state from the browser's URL.\n * Angular provides two strategies:\n * `HashLocationStrategy` and `PathLocationStrategy`.\n *\n * Applications should use the `Router` or `Location` services to\n * interact with application route state.\n *\n * For instance, `HashLocationStrategy` produces URLs like\n * http://example.com/#/foo,\n * and `PathLocationStrategy` produces\n * http://example.com/foo as an equivalent URL.\n *\n * See these two classes for more.\n *\n * @publicApi\n */\n@Injectable({providedIn: 'root', useFactory: () => inject(PathLocationStrategy)})\nexport abstract class LocationStrategy {\n abstract path(includeHash?: boolean): string;\n abstract prepareExternalUrl(internal: string): string;\n abstract getState(): unknown;\n abstract pushState(state: any, title: string, url: string, queryParams: string): void;\n abstract replaceState(state: any, title: string, url: string, queryParams: string): void;\n abstract forward(): void;\n abstract back(): void;\n historyGo?(relativePosition: number): void {\n throw new Error(ngDevMode ? 'Not implemented' : '');\n }\n abstract onPopState(fn: LocationChangeListener): void;\n abstract getBaseHref(): string;\n}\n\n/**\n * A predefined DI token for the base href\n * to be used with the `PathLocationStrategy`.\n * The base href is the URL prefix that should be preserved when generating\n * and recognizing URLs.\n *\n * @usageNotes\n *\n * The following example shows how to use this token to configure the root app injector\n * with a base href value, so that the DI framework can supply the dependency anywhere in the app.\n *\n * ```ts\n * import {NgModule} from '@angular/core';\n * import {APP_BASE_HREF} from '@angular/common';\n *\n * @NgModule({\n * providers: [{provide: APP_BASE_HREF, useValue: '/my/app'}]\n * })\n * class AppModule {}\n * ```\n *\n * @publicApi\n */\nexport const APP_BASE_HREF = new InjectionToken(ngDevMode ? 'appBaseHref' : '');\n\n/**\n * @description\n * A {@link LocationStrategy} used to configure the {@link Location} service to\n * represent its state in the\n * [path](https://en.wikipedia.org/wiki/Uniform_Resource_Locator#Syntax) of the\n * browser's URL.\n *\n * If you're using `PathLocationStrategy`, you may provide a {@link APP_BASE_HREF}\n * or add a `` element to the document to override the default.\n *\n * For instance, if you provide an `APP_BASE_HREF` of `'/my/app/'` and call\n * `location.go('/foo')`, the browser's URL will become\n * `example.com/my/app/foo`. To ensure all relative URIs resolve correctly,\n * the `` and/or `APP_BASE_HREF` should end with a `/`.\n *\n * Similarly, if you add `` to the document and call\n * `location.go('/foo')`, the browser's URL will become\n * `example.com/my/app/foo`.\n *\n * Note that when using `PathLocationStrategy`, neither the query nor\n * the fragment in the `` will be preserved, as outlined\n * by the [RFC](https://tools.ietf.org/html/rfc3986#section-5.2.2).\n *\n * @usageNotes\n *\n * ### Example\n *\n * {@example common/location/ts/path_location_component.ts region='LocationComponent'}\n *\n * @publicApi\n */\n@Injectable({providedIn: 'root'})\nexport class PathLocationStrategy extends LocationStrategy implements OnDestroy {\n private _baseHref: string;\n private _removeListenerFns: (() => void)[] = [];\n\n constructor(\n private _platformLocation: PlatformLocation,\n @Optional() @Inject(APP_BASE_HREF) href?: string,\n ) {\n super();\n\n this._baseHref =\n href ??\n this._platformLocation.getBaseHrefFromDOM() ??\n inject(DOCUMENT).location?.origin ??\n '';\n }\n\n /** @docs-private */\n ngOnDestroy(): void {\n while (this._removeListenerFns.length) {\n this._removeListenerFns.pop()!();\n }\n }\n\n override onPopState(fn: LocationChangeListener): void {\n this._removeListenerFns.push(\n this._platformLocation.onPopState(fn),\n this._platformLocation.onHashChange(fn),\n );\n }\n\n override getBaseHref(): string {\n return this._baseHref;\n }\n\n override prepareExternalUrl(internal: string): string {\n return joinWithSlash(this._baseHref, internal);\n }\n\n override path(includeHash: boolean = false): string {\n const pathname =\n this._platformLocation.pathname + normalizeQueryParams(this._platformLocation.search);\n const hash = this._platformLocation.hash;\n return hash && includeHash ? `${pathname}${hash}` : pathname;\n }\n\n override pushState(state: any, title: string, url: string, queryParams: string) {\n const externalUrl = this.prepareExternalUrl(url + normalizeQueryParams(queryParams));\n this._platformLocation.pushState(state, title, externalUrl);\n }\n\n override replaceState(state: any, title: string, url: string, queryParams: string) {\n const externalUrl = this.prepareExternalUrl(url + normalizeQueryParams(queryParams));\n this._platformLocation.replaceState(state, title, externalUrl);\n }\n\n override forward(): void {\n this._platformLocation.forward();\n }\n\n override back(): void {\n this._platformLocation.back();\n }\n\n override getState(): unknown {\n return this._platformLocation.getState();\n }\n\n override historyGo(relativePosition: number = 0): void {\n this._platformLocation.historyGo?.(relativePosition);\n }\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Injectable, OnDestroy, ɵɵinject} from '@angular/core';\nimport {Subject, SubscriptionLike} from 'rxjs';\n\nimport {LocationStrategy} from './location_strategy';\nimport {joinWithSlash, normalizeQueryParams, stripTrailingSlash} from './util';\n\n/** @publicApi */\nexport interface PopStateEvent {\n pop?: boolean;\n state?: any;\n type?: string;\n url?: string;\n}\n\n/**\n * @description\n *\n * A service that applications can use to interact with a browser's URL.\n *\n * Depending on the `LocationStrategy` used, `Location` persists\n * to the URL's path or the URL's hash segment.\n *\n * @usageNotes\n *\n * It's better to use the `Router.navigate()` service to trigger route changes. Use\n * `Location` only if you need to interact with or create normalized URLs outside of\n * routing.\n *\n * `Location` is responsible for normalizing the URL against the application's base href.\n * A normalized URL is absolute from the URL host, includes the application's base href, and has no\n * trailing slash:\n * - `/my/app/user/123` is normalized\n * - `my/app/user/123` **is not** normalized\n * - `/my/app/user/123/` **is not** normalized\n *\n * ### Example\n *\n * {@example common/location/ts/path_location_component.ts region='LocationComponent'}\n *\n * @publicApi\n */\n@Injectable({\n providedIn: 'root',\n // See #23917\n useFactory: createLocation,\n})\nexport class Location implements OnDestroy {\n /** @internal */\n _subject = new Subject();\n /** @internal */\n _basePath: string;\n /** @internal */\n _locationStrategy: LocationStrategy;\n /** @internal */\n _urlChangeListeners: ((url: string, state: unknown) => void)[] = [];\n /** @internal */\n _urlChangeSubscription: SubscriptionLike | null = null;\n\n constructor(locationStrategy: LocationStrategy) {\n this._locationStrategy = locationStrategy;\n const baseHref = this._locationStrategy.getBaseHref();\n // Note: This class's interaction with base HREF does not fully follow the rules\n // outlined in the spec https://www.freesoft.org/CIE/RFC/1808/18.htm.\n // Instead of trying to fix individual bugs with more and more code, we should\n // investigate using the URL constructor and providing the base as a second\n // argument.\n // https://developer.mozilla.org/en-US/docs/Web/API/URL/URL#parameters\n this._basePath = _stripOrigin(stripTrailingSlash(_stripIndexHtml(baseHref)));\n this._locationStrategy.onPopState((ev) => {\n this._subject.next({\n 'url': this.path(true),\n 'pop': true,\n 'state': ev.state,\n 'type': ev.type,\n });\n });\n }\n\n /** @docs-private */\n ngOnDestroy(): void {\n this._urlChangeSubscription?.unsubscribe();\n this._urlChangeListeners = [];\n }\n\n /**\n * Normalizes the URL path for this location.\n *\n * @param includeHash True to include an anchor fragment in the path.\n *\n * @returns The normalized URL path.\n */\n // TODO: vsavkin. Remove the boolean flag and always include hash once the deprecated router is\n // removed.\n path(includeHash: boolean = false): string {\n return this.normalize(this._locationStrategy.path(includeHash));\n }\n\n /**\n * Reports the current state of the location history.\n * @returns The current value of the `history.state` object.\n */\n getState(): unknown {\n return this._locationStrategy.getState();\n }\n\n /**\n * Normalizes the given path and compares to the current normalized path.\n *\n * @param path The given URL path.\n * @param query Query parameters.\n *\n * @returns True if the given URL path is equal to the current normalized path, false\n * otherwise.\n */\n isCurrentPathEqualTo(path: string, query: string = ''): boolean {\n return this.path() == this.normalize(path + normalizeQueryParams(query));\n }\n\n /**\n * Normalizes a URL path by stripping any trailing slashes.\n *\n * @param url String representing a URL.\n *\n * @returns The normalized URL string.\n */\n normalize(url: string): string {\n return Location.stripTrailingSlash(_stripBasePath(this._basePath, _stripIndexHtml(url)));\n }\n\n /**\n * Normalizes an external URL path.\n * If the given URL doesn't begin with a leading slash (`'/'`), adds one\n * before normalizing. Adds a hash if `HashLocationStrategy` is\n * in use, or the `APP_BASE_HREF` if the `PathLocationStrategy` is in use.\n *\n * @param url String representing a URL.\n *\n * @returns A normalized platform-specific URL.\n */\n prepareExternalUrl(url: string): string {\n if (url && url[0] !== '/') {\n url = '/' + url;\n }\n return this._locationStrategy.prepareExternalUrl(url);\n }\n\n // TODO: rename this method to pushState\n /**\n * Changes the browser's URL to a normalized version of a given URL, and pushes a\n * new item onto the platform's history.\n *\n * @param path URL path to normalize.\n * @param query Query parameters.\n * @param state Location history state.\n *\n */\n go(path: string, query: string = '', state: any = null): void {\n this._locationStrategy.pushState(state, '', path, query);\n this._notifyUrlChangeListeners(\n this.prepareExternalUrl(path + normalizeQueryParams(query)),\n state,\n );\n }\n\n /**\n * Changes the browser's URL to a normalized version of the given URL, and replaces\n * the top item on the platform's history stack.\n *\n * @param path URL path to normalize.\n * @param query Query parameters.\n * @param state Location history state.\n */\n replaceState(path: string, query: string = '', state: any = null): void {\n this._locationStrategy.replaceState(state, '', path, query);\n this._notifyUrlChangeListeners(\n this.prepareExternalUrl(path + normalizeQueryParams(query)),\n state,\n );\n }\n\n /**\n * Navigates forward in the platform's history.\n */\n forward(): void {\n this._locationStrategy.forward();\n }\n\n /**\n * Navigates back in the platform's history.\n */\n back(): void {\n this._locationStrategy.back();\n }\n\n /**\n * Navigate to a specific page from session history, identified by its relative position to the\n * current page.\n *\n * @param relativePosition Position of the target page in the history relative to the current\n * page.\n * A negative value moves backwards, a positive value moves forwards, e.g. `location.historyGo(2)`\n * moves forward two pages and `location.historyGo(-2)` moves back two pages. When we try to go\n * beyond what's stored in the history session, we stay in the current page. Same behaviour occurs\n * when `relativePosition` equals 0.\n * @see https://developer.mozilla.org/en-US/docs/Web/API/History_API#Moving_to_a_specific_point_in_history\n */\n historyGo(relativePosition: number = 0): void {\n this._locationStrategy.historyGo?.(relativePosition);\n }\n\n /**\n * Registers a URL change listener. Use to catch updates performed by the Angular\n * framework that are not detectible through \"popstate\" or \"hashchange\" events.\n *\n * @param fn The change handler function, which take a URL and a location history state.\n * @returns A function that, when executed, unregisters a URL change listener.\n */\n onUrlChange(fn: (url: string, state: unknown) => void): VoidFunction {\n this._urlChangeListeners.push(fn);\n\n this._urlChangeSubscription ??= this.subscribe((v) => {\n this._notifyUrlChangeListeners(v.url, v.state);\n });\n\n return () => {\n const fnIndex = this._urlChangeListeners.indexOf(fn);\n this._urlChangeListeners.splice(fnIndex, 1);\n\n if (this._urlChangeListeners.length === 0) {\n this._urlChangeSubscription?.unsubscribe();\n this._urlChangeSubscription = null;\n }\n };\n }\n\n /** @internal */\n _notifyUrlChangeListeners(url: string = '', state: unknown) {\n this._urlChangeListeners.forEach((fn) => fn(url, state));\n }\n\n /**\n * Subscribes to the platform's `popState` events.\n *\n * Note: `Location.go()` does not trigger the `popState` event in the browser. Use\n * `Location.onUrlChange()` to subscribe to URL changes instead.\n *\n * @param value Event that is triggered when the state history changes.\n * @param exception The exception to throw.\n *\n * @see [onpopstate](https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onpopstate)\n *\n * @returns Subscribed events.\n */\n subscribe(\n onNext: (value: PopStateEvent) => void,\n onThrow?: ((exception: any) => void) | null,\n onReturn?: (() => void) | null,\n ): SubscriptionLike {\n return this._subject.subscribe({\n next: onNext,\n error: onThrow ?? undefined,\n complete: onReturn ?? undefined,\n });\n }\n\n /**\n * Normalizes URL parameters by prepending with `?` if needed.\n *\n * @param params String of URL parameters.\n *\n * @returns The normalized URL parameters string.\n */\n public static normalizeQueryParams: (params: string) => string = normalizeQueryParams;\n\n /**\n * Joins two parts of a URL with a slash if needed.\n *\n * @param start URL string\n * @param end URL string\n *\n *\n * @returns The joined URL string.\n */\n public static joinWithSlash: (start: string, end: string) => string = joinWithSlash;\n\n /**\n * Removes a trailing slash from a URL string if needed.\n * Looks for the first occurrence of either `#`, `?`, or the end of the\n * line as `/` characters and removes the trailing slash if one exists.\n *\n * @param url URL string.\n *\n * @returns The URL string, modified if needed.\n */\n public static stripTrailingSlash: (url: string) => string = stripTrailingSlash;\n}\n\nexport function createLocation() {\n return new Location(ɵɵinject(LocationStrategy as any));\n}\n\nfunction _stripBasePath(basePath: string, url: string): string {\n if (!basePath || !url.startsWith(basePath)) {\n return url;\n }\n const strippedUrl = url.substring(basePath.length);\n if (strippedUrl === '' || ['/', ';', '?', '#'].includes(strippedUrl[0])) {\n return strippedUrl;\n }\n return url;\n}\n\nfunction _stripIndexHtml(url: string): string {\n return url.replace(/\\/index.html$/, '');\n}\n\nfunction _stripOrigin(baseHref: string): string {\n // DO NOT REFACTOR! Previously, this check looked like this:\n // `/^(https?:)?\\/\\//.test(baseHref)`, but that resulted in\n // syntactically incorrect code after Closure Compiler minification.\n // This was likely caused by a bug in Closure Compiler, but\n // for now, the check is rewritten to use `new RegExp` instead.\n const isAbsoluteUrl = new RegExp('^(https?:)?//').test(baseHref);\n if (isAbsoluteUrl) {\n const [, pathname] = baseHref.split(/\\/\\/[^\\/]+/);\n return pathname;\n }\n return baseHref;\n}\n"],"names":["i1.LocationStrategy","ɵɵinject"],"mappings":";;;;;;;;;;;AAQA,IAAI,IAAI,GAAe,IAAK;SAEZ,MAAM,GAAA;AACpB,IAAA,OAAO,IAAI;AACb;AAEM,SAAU,iBAAiB,CAAC,OAAmB,EAAA;IACnD,IAAI,KAAK,OAAO;AAClB;AAEA;;;;;AAKG;MACmB,UAAU,CAAA;AAgC/B;;AC3CD;;;;;;;;;;;;;;;;;;;;;AAqBG;MAEmB,gBAAgB,CAAA;AA4BpC,IAAA,SAAS,CAAE,gBAAwB,EAAA;AACjC,QAAA,MAAM,IAAI,KAAK,CAAC,SAAS,GAAG,iBAAiB,GAAG,EAAE,CAAC;;kHA7BjC,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHAAhB,gBAAgB,EAAA,UAAA,EADb,UAAU,EAAc,UAAA,EAAA,MAAM,MAAM,CAAC,uBAAuB,CAAC,EAAA,CAAA;;sGAChE,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBADrC,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA,EAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC,uBAAuB,CAAC,EAAC;;AAkCvF;;;;;AAKG;AACU,MAAA,oBAAoB,GAAG,IAAI,cAAc,CACpD,SAAS,GAAG,sBAAsB,GAAG,EAAE;AAqBzC;;;;;;AAMG;AAKG,MAAO,uBAAwB,SAAQ,gBAAgB,CAAA;AACnD,IAAA,SAAS;AACT,IAAA,QAAQ;AACR,IAAA,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC;AAE/B,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;AACP,QAAA,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,QAAQ;AAChC,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC,OAAO;;IAGvB,kBAAkB,GAAA;QACzB,OAAO,MAAM,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAE;;AAGhC,IAAA,UAAU,CAAC,EAA0B,EAAA;AAC5C,QAAA,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC;QACjE,MAAM,CAAC,gBAAgB,CAAC,UAAU,EAAE,EAAE,EAAE,KAAK,CAAC;QAC9C,OAAO,MAAM,MAAM,CAAC,mBAAmB,CAAC,UAAU,EAAE,EAAE,CAAC;;AAGhD,IAAA,YAAY,CAAC,EAA0B,EAAA;AAC9C,QAAA,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC;QACjE,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,EAAE,EAAE,KAAK,CAAC;QAChD,OAAO,MAAM,MAAM,CAAC,mBAAmB,CAAC,YAAY,EAAE,EAAE,CAAC;;AAG3D,IAAA,IAAa,IAAI,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI;;AAE5B,IAAA,IAAa,QAAQ,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ;;AAEhC,IAAA,IAAa,QAAQ,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ;;AAEhC,IAAA,IAAa,IAAI,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI;;AAE5B,IAAA,IAAa,QAAQ,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,QAAQ;;AAEhC,IAAA,IAAa,MAAM,GAAA;AACjB,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM;;AAE9B,IAAA,IAAa,IAAI,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI;;IAE5B,IAAa,QAAQ,CAAC,OAAe,EAAA;AACnC,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,GAAG,OAAO;;AAG1B,IAAA,SAAS,CAAC,KAAU,EAAE,KAAa,EAAE,GAAW,EAAA;QACvD,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC;;AAGnC,IAAA,YAAY,CAAC,KAAU,EAAE,KAAa,EAAE,GAAW,EAAA;QAC1D,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,CAAC;;IAGtC,OAAO,GAAA;AACd,QAAA,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;;IAGhB,IAAI,GAAA;AACX,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;;IAGb,SAAS,CAAC,mBAA2B,CAAC,EAAA;AAC7C,QAAA,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,gBAAgB,CAAC;;IAG3B,QAAQ,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK;;kHAzEjB,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHAAvB,uBAAuB,EAAA,UAAA,EAHtB,UAAU,EACV,UAAA,EAAA,MAAM,IAAI,uBAAuB,EAAE,EAAA,CAAA;;sGAEpC,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBAJnC,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE,UAAU;AACtB,oBAAA,UAAU,EAAE,MAAM,IAA6B,uBAAA,EAAA;AAChD,iBAAA;;;ACnGD;;;;;;;;AAQG;AACa,SAAA,aAAa,CAAC,KAAa,EAAE,GAAW,EAAA;;AAEtD,IAAA,IAAI,CAAC,KAAK;AAAE,QAAA,OAAO,GAAG;;AAEtB,IAAA,IAAI,CAAC,GAAG;AAAE,QAAA,OAAO,KAAK;;AAEtB,IAAA,IAAI,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;QACvB,OAAO,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,GAAG;;;IAGjE,OAAO,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,KAAK,GAAG,GAAG,GAAG,CAAA,EAAG,KAAK,CAAI,CAAA,EAAA,GAAG,EAAE;AAC9D;AAEA;;;;;;;;AAQG;AACG,SAAU,kBAAkB,CAAC,GAAW,EAAA;;;IAG5C,MAAM,UAAU,GAAG,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC;;;;AAIvC,IAAA,OAAO,GAAG,CAAC,UAAU,GAAG,CAAC,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,UAAU,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,GAAG;AACjG;AAEA;;;;;;AAMG;AACG,SAAU,oBAAoB,CAAC,MAAc,EAAA;AACjD,IAAA,OAAO,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,GAAG,IAAI,MAAM,CAAA,CAAE,GAAG,MAAM;AAC5D;;AC3CA;;;;;;;;;;;;;;;;AAgBG;MAEmB,gBAAgB,CAAA;AAQpC,IAAA,SAAS,CAAE,gBAAwB,EAAA;AACjC,QAAA,MAAM,IAAI,KAAK,CAAC,SAAS,GAAG,iBAAiB,GAAG,EAAE,CAAC;;kHATjC,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHAAhB,gBAAgB,EAAA,UAAA,EADb,MAAM,EAAc,UAAA,EAAA,MAAM,MAAM,CAAC,oBAAoB,CAAC,EAAA,CAAA;;sGACzD,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBADrC,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA,EAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC,oBAAoB,CAAC,EAAC;;AAgBhF;;;;;;;;;;;;;;;;;;;;;;AAsBG;AACU,MAAA,aAAa,GAAG,IAAI,cAAc,CAAS,SAAS,GAAG,aAAa,GAAG,EAAE;AAEtF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BG;AAEG,MAAO,oBAAqB,SAAQ,gBAAgB,CAAA;AAK9C,IAAA,iBAAA;AAJF,IAAA,SAAS;IACT,kBAAkB,GAAmB,EAAE;IAE/C,WACU,CAAA,iBAAmC,EACR,IAAa,EAAA;AAEhD,QAAA,KAAK,EAAE;QAHC,IAAiB,CAAA,iBAAA,GAAjB,iBAAiB;AAKzB,QAAA,IAAI,CAAC,SAAS;YACZ,IAAI;AACJ,gBAAA,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE;AAC3C,gBAAA,MAAM,CAAC,QAAQ,CAAC,CAAC,QAAQ,EAAE,MAAM;AACjC,gBAAA,EAAE;;;IAIN,WAAW,GAAA;AACT,QAAA,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE;AACrC,YAAA,IAAI,CAAC,kBAAkB,CAAC,GAAG,EAAG,EAAE;;;AAI3B,IAAA,UAAU,CAAC,EAA0B,EAAA;QAC5C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAC1B,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,EAAE,CAAC,EACrC,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,EAAE,CAAC,CACxC;;IAGM,WAAW,GAAA;QAClB,OAAO,IAAI,CAAC,SAAS;;AAGd,IAAA,kBAAkB,CAAC,QAAgB,EAAA;QAC1C,OAAO,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC;;IAGvC,IAAI,CAAC,cAAuB,KAAK,EAAA;AACxC,QAAA,MAAM,QAAQ,GACZ,IAAI,CAAC,iBAAiB,CAAC,QAAQ,GAAG,oBAAoB,CAAC,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC;AACvF,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI;AACxC,QAAA,OAAO,IAAI,IAAI,WAAW,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAG,IAAI,CAAE,CAAA,GAAG,QAAQ;;AAGrD,IAAA,SAAS,CAAC,KAAU,EAAE,KAAa,EAAE,GAAW,EAAE,WAAmB,EAAA;AAC5E,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,kBAAkB,CAAC,GAAG,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;QACpF,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC;;AAGpD,IAAA,YAAY,CAAC,KAAU,EAAE,KAAa,EAAE,GAAW,EAAE,WAAmB,EAAA;AAC/E,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,kBAAkB,CAAC,GAAG,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;QACpF,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,WAAW,CAAC;;IAGvD,OAAO,GAAA;AACd,QAAA,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE;;IAGzB,IAAI,GAAA;AACX,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE;;IAGtB,QAAQ,GAAA;AACf,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE;;IAGjC,SAAS,CAAC,mBAA2B,CAAC,EAAA;QAC7C,IAAI,CAAC,iBAAiB,CAAC,SAAS,GAAG,gBAAgB,CAAC;;AArE3C,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,+CAMT,aAAa,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;AANxB,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,cADR,MAAM,EAAA,CAAA;;sGAClB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBADhC,UAAU;mBAAC,EAAC,UAAU,EAAE,MAAM,EAAC;;0BAO3B;;0BAAY,MAAM;2BAAC,aAAa;;;ACzFrC;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BG;MAMU,QAAQ,CAAA;;AAEnB,IAAA,QAAQ,GAAG,IAAI,OAAO,EAAiB;;AAEvC,IAAA,SAAS;;AAET,IAAA,iBAAiB;;IAEjB,mBAAmB,GAA8C,EAAE;;IAEnE,sBAAsB,GAA4B,IAAI;AAEtD,IAAA,WAAA,CAAY,gBAAkC,EAAA;AAC5C,QAAA,IAAI,CAAC,iBAAiB,GAAG,gBAAgB;QACzC,MAAM,QAAQ,GAAG,IAAI,CAAC,iBAAiB,CAAC,WAAW,EAAE;;;;;;;AAOrD,QAAA,IAAI,CAAC,SAAS,GAAG,YAAY,CAAC,kBAAkB,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC;QAC5E,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC,EAAE,KAAI;AACvC,YAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;AACjB,gBAAA,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;AACtB,gBAAA,KAAK,EAAE,IAAI;gBACX,OAAO,EAAE,EAAE,CAAC,KAAK;gBACjB,MAAM,EAAE,EAAE,CAAC,IAAI;AAChB,aAAA,CAAC;AACJ,SAAC,CAAC;;;IAIJ,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,sBAAsB,EAAE,WAAW,EAAE;AAC1C,QAAA,IAAI,CAAC,mBAAmB,GAAG,EAAE;;AAG/B;;;;;;AAMG;;;IAGH,IAAI,CAAC,cAAuB,KAAK,EAAA;AAC/B,QAAA,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;;AAGjE;;;AAGG;IACH,QAAQ,GAAA;AACN,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE;;AAG1C;;;;;;;;AAQG;AACH,IAAA,oBAAoB,CAAC,IAAY,EAAE,KAAA,GAAgB,EAAE,EAAA;AACnD,QAAA,OAAO,IAAI,CAAC,IAAI,EAAE,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;;AAG1E;;;;;;AAMG;AACH,IAAA,SAAS,CAAC,GAAW,EAAA;AACnB,QAAA,OAAO,QAAQ,CAAC,kBAAkB,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,EAAE,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC;;AAG1F;;;;;;;;;AASG;AACH,IAAA,kBAAkB,CAAC,GAAW,EAAA;QAC5B,IAAI,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG,EAAE;AACzB,YAAA,GAAG,GAAG,GAAG,GAAG,GAAG;;QAEjB,OAAO,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,GAAG,CAAC;;;AAIvD;;;;;;;;AAQG;AACH,IAAA,EAAE,CAAC,IAAY,EAAE,QAAgB,EAAE,EAAE,QAAa,IAAI,EAAA;AACpD,QAAA,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;AACxD,QAAA,IAAI,CAAC,yBAAyB,CAC5B,IAAI,CAAC,kBAAkB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC,EAC3D,KAAK,CACN;;AAGH;;;;;;;AAOG;AACH,IAAA,YAAY,CAAC,IAAY,EAAE,QAAgB,EAAE,EAAE,QAAa,IAAI,EAAA;AAC9D,QAAA,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;AAC3D,QAAA,IAAI,CAAC,yBAAyB,CAC5B,IAAI,CAAC,kBAAkB,CAAC,IAAI,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC,EAC3D,KAAK,CACN;;AAGH;;AAEG;IACH,OAAO,GAAA;AACL,QAAA,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE;;AAGlC;;AAEG;IACH,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE;;AAG/B;;;;;;;;;;;AAWG;IACH,SAAS,CAAC,mBAA2B,CAAC,EAAA;QACpC,IAAI,CAAC,iBAAiB,CAAC,SAAS,GAAG,gBAAgB,CAAC;;AAGtD;;;;;;AAMG;AACH,IAAA,WAAW,CAAC,EAAyC,EAAA;AACnD,QAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC;QAEjC,IAAI,CAAC,sBAAsB,KAAK,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAI;YACnD,IAAI,CAAC,yBAAyB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,KAAK,CAAC;AAChD,SAAC,CAAC;AAEF,QAAA,OAAO,MAAK;YACV,MAAM,OAAO,GAAG,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,EAAE,CAAC;YACpD,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC,CAAC;YAE3C,IAAI,IAAI,CAAC,mBAAmB,CAAC,MAAM,KAAK,CAAC,EAAE;AACzC,gBAAA,IAAI,CAAC,sBAAsB,EAAE,WAAW,EAAE;AAC1C,gBAAA,IAAI,CAAC,sBAAsB,GAAG,IAAI;;AAEtC,SAAC;;;AAIH,IAAA,yBAAyB,CAAC,GAAA,GAAc,EAAE,EAAE,KAAc,EAAA;AACxD,QAAA,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;;AAG1D;;;;;;;;;;;;AAYG;AACH,IAAA,SAAS,CACP,MAAsC,EACtC,OAA2C,EAC3C,QAA8B,EAAA;AAE9B,QAAA,OAAO,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;AAC7B,YAAA,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,OAAO,IAAI,SAAS;YAC3B,QAAQ,EAAE,QAAQ,IAAI,SAAS;AAChC,SAAA,CAAC;;AAGJ;;;;;;AAMG;AACI,IAAA,OAAO,oBAAoB,GAA+B,oBAAoB;AAErF;;;;;;;;AAQG;AACI,IAAA,OAAO,aAAa,GAA2C,aAAa;AAEnF;;;;;;;;AAQG;AACI,IAAA,OAAO,kBAAkB,GAA4B,kBAAkB;kHAxPnE,QAAQ,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAAA,gBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA;sHAAR,QAAQ,EAAA,UAAA,EAJP,MAAM,EAAA,UAAA,EAEN,cAAc,EAAA,CAAA;;sGAEf,QAAQ,EAAA,UAAA,EAAA,CAAA;kBALpB,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE,MAAM;;AAElB,oBAAA,UAAU,EAAE,cAAc;AAC3B,iBAAA;;SA4Pe,cAAc,GAAA;IAC5B,OAAO,IAAI,QAAQ,CAACC,QAAQ,CAAC,gBAAuB,CAAC,CAAC;AACxD;AAEA,SAAS,cAAc,CAAC,QAAgB,EAAE,GAAW,EAAA;IACnD,IAAI,CAAC,QAAQ,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;AAC1C,QAAA,OAAO,GAAG;;IAEZ,MAAM,WAAW,GAAG,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC;IAClD,IAAI,WAAW,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE;AACvE,QAAA,OAAO,WAAW;;AAEpB,IAAA,OAAO,GAAG;AACZ;AAEA,SAAS,eAAe,CAAC,GAAW,EAAA;IAClC,OAAO,GAAG,CAAC,OAAO,CAAC,eAAe,EAAE,EAAE,CAAC;AACzC;AAEA,SAAS,YAAY,CAAC,QAAgB,EAAA;;;;;;AAMpC,IAAA,MAAM,aAAa,GAAG,IAAI,MAAM,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC;IAChE,IAAI,aAAa,EAAE;QACjB,MAAM,GAAG,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC;AACjD,QAAA,OAAO,QAAQ;;AAEjB,IAAA,OAAO,QAAQ;AACjB;;;;"}y =x/** * @license Angular v19.2.14 * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import * as i0 from '@angular/core'; import { ɵRuntimeError as _RuntimeError, Injectable, inject, NgZone, DestroyRef, InjectionToken, ɵPendingTasksInternal as _PendingTasksInternal, PLATFORM_ID, ɵConsole as _Console, ɵformatRuntimeError as _formatRuntimeError, runInInjectionContext, Inject, makeEnvironmentProviders, NgModule } from '@angular/core'; import { concatMap, filter, map, finalize, switchMap } from 'rxjs/operators'; import { of, Observable, from } from 'rxjs'; import { isPlatformServer, XhrFactory, parseCookieValue } from './xhr-BfNfxNDv.mjs'; import { DOCUMENT } from './dom_tokens-rA0ACyx7.mjs'; /** * Transforms an `HttpRequest` into a stream of `HttpEvent`s, one of which will likely be a * `HttpResponse`. * * `HttpHandler` is injectable. When injected, the handler instance dispatches requests to the * first interceptor in the chain, which dispatches to the second, etc, eventually reaching the * `HttpBackend`. * * In an `HttpInterceptor`, the `HttpHandler` parameter is the next interceptor in the chain. * * @publicApi */ class HttpHandler { } /** * A final `HttpHandler` which will dispatch the request via browser HTTP APIs to a backend. * * Interceptors sit between the `HttpClient` interface and the `HttpBackend`. * * When injected, `HttpBackend` dispatches requests directly to the backend, without going * through the interceptor chain. * * @publicApi */ class HttpBackend { } /** * Represents the header configuration options for an HTTP request. * Instances are immutable. Modifying methods return a cloned * instance with the change. The original object is never changed. * * @publicApi */ class HttpHeaders { /** * Internal map of lowercase header names to values. */ headers; /** * Internal map of lowercased header names to the normalized * form of the name (the form seen first). */ normalizedNames = new Map(); /** * Complete the lazy initialization of this object (needed before reading). */ lazyInit; /** * Queued updates to be materialized the next initialization. */ lazyUpdate = null; /** Constructs a new HTTP header object with the given values.*/ constructor(headers) { if (!headers) { this.headers = new Map(); } else if (typeof headers === 'string') { this.lazyInit = () => { this.headers = new Map(); headers.split('\n').forEach((line) => { const index = line.indexOf(':'); if (index > 0) { const name = line.slice(0, index); const value = line.slice(index + 1).trim(); this.addHeaderEntry(name, value); } }); }; } else if (typeof Headers !== 'undefined' && headers instanceof Headers) { this.headers = new Map(); headers.forEach((value, name) => { this.addHeaderEntry(name, value); }); } else { this.lazyInit = () => { if (typeof ngDevMode === 'undefined' || ngDevMode) { assertValidHeaders(headers); } this.headers = new Map(); Object.entries(headers).forEach(([name, values]) => { this.setHeaderEntries(name, values); }); }; } } /** * Checks for existence of a given header. * * @param name The header name to check for existence. * * @returns True if the header exists, false otherwise. */ has(name) { this.init(); return this.headers.has(name.toLowerCase()); } /** * Retrieves the first value of a given header. * * @param name The header name. * * @returns The value string if the header exists, null otherwise */ get(name) { this.init(); const values = this.headers.get(name.toLowerCase()); return values && values.length > 0 ? values[0] : null; } /** * Retrieves the names of the headers. * * @returns A list of header names. */ keys() { this.init(); return Array.from(this.normalizedNames.values()); } /** * Retrieves a list of values for a given header. * * @param name The header name from which to retrieve values. * * @returns A string of values if the header exists, null otherwise. */ getAll(name) { this.init(); return this.headers.get(name.toLowerCase()) || null; } /** * Appends a new value to the existing set of values for a header * and returns them in a clone of the original instance. * * @param name The header name for which to append the values. * @param value The value to append. * * @returns A clone of the HTTP headers object with the value appended to the given header. */ append(name, value) { return this.clone({ name, value, op: 'a' }); } /** * Sets or modifies a value for a given header in a clone of the original instance. * If the header already exists, its value is replaced with the given value * in the returned object. * * @param name The header name. * @param value The value or values to set or override for the given header. * * @returns A clone of the HTTP headers object with the newly set header value. */ set(name, value) { return this.clone({ name, value, op: 's' }); } /** * Deletes values for a given header in a clone of the original instance. * * @param name The header name. * @param value The value or values to delete for the given header. * * @returns A clone of the HTTP headers object with the given value deleted. */ delete(name, value) { return this.clone({ name, value, op: 'd' }); } maybeSetNormalizedName(name, lcName) { if (!this.normalizedNames.has(lcName)) { this.normalizedNames.set(lcName, name); } } init() { if (!!this.lazyInit) { if (this.lazyInit instanceof HttpHeaders) { this.copyFrom(this.lazyInit); } else { this.lazyInit(); } this.lazyInit = null; if (!!this.lazyUpdate) { this.lazyUpdate.forEach((update) => this.applyUpdate(update)); this.lazyUpdate = null; } } } copyFrom(other) { other.init(); Array.from(other.headers.keys()).forEach((key) => { this.headers.set(key, other.headers.get(key)); this.normalizedNames.set(key, other.normalizedNames.get(key)); }); } clone(update) { const clone = new HttpHeaders(); clone.lazyInit = !!this.lazyInit && this.lazyInit instanceof HttpHeaders ? this.lazyInit : this; clone.lazyUpdate = (this.lazyUpdate || []).concat([update]); return clone; } applyUpdate(update) { const key = update.name.toLowerCase(); switch (update.op) { case 'a': case 's': let value = update.value; if (typeof value === 'string') { value = [value]; } if (value.length === 0) { return; } this.maybeSetNormalizedName(update.name, key); const base = (update.op === 'a' ? this.headers.get(key) : undefined) || []; base.push(...value); this.headers.set(key, base); break; case 'd': const toDelete = update.value; if (!toDelete) { this.headers.delete(key); this.normalizedNames.delete(key); } else { let existing = this.headers.get(key); if (!existing) { return; } existing = existing.filter((value) => toDelete.indexOf(value) === -1); if (existing.length === 0) { this.headers.delete(key); this.normalizedNames.delete(key); } else { this.headers.set(key, existing); } } break; } } addHeaderEntry(name, value) { const key = name.toLowerCase(); this.maybeSetNormalizedName(name, key); if (this.headers.has(key)) { this.headers.get(key).push(value); } else { this.headers.set(key, [value]); } } setHeaderEntries(name, values) { const headerValues = (Array.isArray(values) ? values : [values]).map((value) => value.toString()); const key = name.toLowerCase(); this.headers.set(key, headerValues); this.maybeSetNormalizedName(name, key); } /** * @internal */ forEach(fn) { this.init(); Array.from(this.normalizedNames.keys()).forEach((key) => fn(this.normalizedNames.get(key), this.headers.get(key))); } } /** * Verifies that the headers object has the right shape: the values * must be either strings, numbers or arrays. Throws an error if an invalid * header value is present. */ function assertValidHeaders(headers) { for (const [key, value] of Object.entries(headers)) { if (!(typeof value === 'string' || typeof value === 'number') && !Array.isArray(value)) { throw new Error(`Unexpected value of the \`${key}\` header provided. ` + `Expecting either a string, a number or an array, but got: \`${value}\`.`); } } } /** * Provides encoding and decoding of URL parameter and query-string values. * * Serializes and parses URL parameter keys and values to encode and decode them. * If you pass URL query parameters without encoding, * the query parameters can be misinterpreted at the receiving end. * * * @publicApi */ class HttpUrlEncodingCodec { /** * Encodes a key name for a URL parameter or query-string. * @param key The key name. * @returns The encoded key name. */ encodeKey(key) { return standardEncoding(key); } /** * Encodes the value of a URL parameter or query-string. * @param value The value. * @returns The encoded value. */ encodeValue(value) { return standardEncoding(value); } /** * Decodes an encoded URL parameter or query-string key. * @param key The encoded key name. * @returns The decoded key name. */ decodeKey(key) { return decodeURIComponent(key); } /** * Decodes an encoded URL parameter or query-string value. * @param value The encoded value. * @returns The decoded value. */ decodeValue(value) { return decodeURIComponent(value); } } function paramParser(rawParams, codec) { const map = new Map(); if (rawParams.length > 0) { // The `window.location.search` can be used while creating an instance of the `HttpParams` class // (e.g. `new HttpParams({ fromString: window.location.search })`). The `window.location.search` // may start with the `?` char, so we strip it if it's present. const params = rawParams.replace(/^\?/, '').split('&'); params.forEach((param) => { const eqIdx = param.indexOf('='); const [key, val] = eqIdx == -1 ? [codec.decodeKey(param), ''] : [codec.decodeKey(param.slice(0, eqIdx)), codec.decodeValue(param.slice(eqIdx + 1))]; const list = map.get(key) || []; list.push(val); map.set(key, list); }); } return map; } /** * Encode input string with standard encodeURIComponent and then un-encode specific characters. */ const STANDARD_ENCODING_REGEX = /%(\d[a-f0-9])/gi; const STANDARD_ENCODING_REPLACEMENTS = { '40': '@', '3A': ':', '24': '$', '2C': ',', '3B': ';', '3D': '=', '3F': '?', '2F': '/', }; function standardEncoding(v) { return encodeURIComponent(v).replace(STANDARD_ENCODING_REGEX, (s, t) => STANDARD_ENCODING_REPLACEMENTS[t] ?? s); } function valueToString(value) { return `${value}`; } /** * An HTTP request/response body that represents serialized parameters, * per the MIME type `application/x-www-form-urlencoded`. * * This class is immutable; all mutation operations return a new instance. * * @publicApi */ class HttpParams { map; encoder; updates = null; cloneFrom = null; constructor(options = {}) { this.encoder = options.encoder || new HttpUrlEncodingCodec(); if (options.fromString) { if (options.fromObject) { throw new _RuntimeError(2805 /* RuntimeErrorCode.CANNOT_SPECIFY_BOTH_FROM_STRING_AND_FROM_OBJECT */, ngDevMode && 'Cannot specify both fromString and fromObject.'); } this.map = paramParser(options.fromString, this.encoder); } else if (!!options.fromObject) { this.map = new Map(); Object.keys(options.fromObject).forEach((key) => { const value = options.fromObject[key]; // convert the values to strings const values = Array.isArray(value) ? value.map(valueToString) : [valueToString(value)]; this.map.set(key, values); }); } else { this.map = null; } } /** * Reports whether the body includes one or more values for a given parameter. * @param param The parameter name. * @returns True if the parameter has one or more values, * false if it has no value or is not present. */ has(param) { this.init(); return this.map.has(param); } /** * Retrieves the first value for a parameter. * @param param The parameter name. * @returns The first value of the given parameter, * or `null` if the parameter is not present. */ get(param) { this.init(); const res = this.map.get(param); return !!res ? res[0] : null; } /** * Retrieves all values for a parameter. * @param param The parameter name. * @returns All values in a string array, * or `null` if the parameter not present. */ getAll(param) { this.init(); return this.map.get(param) || null; } /** * Retrieves all the parameters for this body. * @returns The parameter names in a string array. */ keys() { this.init(); return Array.from(this.map.keys()); } /** * Appends a new value to existing values for a parameter. * @param param The parameter name. * @param value The new value to add. * @return A new body with the appended value. */ append(param, value) { return this.clone({ param, value, op: 'a' }); } /** * Constructs a new body with appended values for the given parameter name. * @param params parameters and values * @return A new body with the new value. */ appendAll(params) { const updates = []; Object.keys(params).forEach((param) => { const value = params[param]; if (Array.isArray(value)) { value.forEach((_value) => { updates.push({ param, value: _value, op: 'a' }); }); } else { updates.push({ param, value: value, op: 'a' }); } }); return this.clone(updates); } /** * Replaces the value for a parameter. * @param param The parameter name. * @param value The new value. * @return A new body with the new value. */ set(param, value) { return this.clone({ param, value, op: 's' }); } /** * Removes a given value or all values from a parameter. * @param param The parameter name. * @param value The value to remove, if provided. * @return A new body with the given value removed, or with all values * removed if no value is specified. */ delete(param, value) { return this.clone({ param, value, op: 'd' }); } /** * Serializes the body to an encoded string, where key-value pairs (separated by `=`) are * separated by `&`s. */ toString() { this.init(); return (this.keys() .map((key) => { const eKey = this.encoder.encodeKey(key); // `a: ['1']` produces `'a=1'` // `b: []` produces `''` // `c: ['1', '2']` produces `'c=1&c=2'` return this.map.get(key) .map((value) => eKey + '=' + this.encoder.encodeValue(value)) .join('&'); }) // filter out empty values because `b: []` produces `''` // which results in `a=1&&c=1&c=2` instead of `a=1&c=1&c=2` if we don't .filter((param) => param !== '') .join('&')); } clone(update) { const clone = new HttpParams({ encoder: this.encoder }); clone.cloneFrom = this.cloneFrom || this; clone.updates = (this.updates || []).concat(update); return clone; } init() { if (this.map === null) { this.map = new Map(); } if (this.cloneFrom !== null) { this.cloneFrom.init(); this.cloneFrom.keys().forEach((key) => this.map.set(key, this.cloneFrom.map.get(key))); this.updates.forEach((update) => { switch (update.op) { case 'a': case 's': const base = (update.op === 'a' ? this.map.get(update.param) : undefined) || []; base.push(valueToString(update.value)); this.map.set(update.param, base); break; case 'd': if (update.value !== undefined) { let base = this.map.get(update.param) || []; const idx = base.indexOf(valueToString(update.value)); if (idx !== -1) { base.splice(idx, 1); } if (base.length > 0) { this.map.set(update.param, base); } else { this.map.delete(update.param); } } else { this.map.delete(update.param); break; } } }); this.cloneFrom = this.updates = null; } } } /** * A token used to manipulate and access values stored in `HttpContext`. * * @publicApi */ class HttpContextToken { defaultValue; constructor(defaultValue) { this.defaultValue = defaultValue; } } /** * Http context stores arbitrary user defined values and ensures type safety without * actually knowing the types. It is backed by a `Map` and guarantees that keys do not clash. * * This context is mutable and is shared between cloned requests unless explicitly specified. * * @usageNotes * * ### Usage Example * * ```ts * // inside cache.interceptors.ts * export const IS_CACHE_ENABLED = new HttpContextToken(() => false); * * export class CacheInterceptor implements HttpInterceptor { * * intercept(req: HttpRequest, delegate: HttpHandler): Observable> { * if (req.context.get(IS_CACHE_ENABLED) === true) { * return ...; * } * return delegate.handle(req); * } * } * * // inside a service * * this.httpClient.get('/api/weather', { * context: new HttpContext().set(IS_CACHE_ENABLED, true) * }).subscribe(...); * ``` * * @publicApi */ class HttpContext { map = new Map(); /** * Store a value in the context. If a value is already present it will be overwritten. * * @param token The reference to an instance of `HttpContextToken`. * @param value The value to store. * * @returns A reference to itself for easy chaining. */ set(token, value) { this.map.set(token, value); return this; } /** * Retrieve the value associated with the given token. * * @param token The reference to an instance of `HttpContextToken`. * * @returns The stored value or default if one is defined. */ get(token) { if (!this.map.has(token)) { this.map.set(token, token.defaultValue()); } return this.map.get(token); } /** * Delete the value associated with the given token. * * @param token The reference to an instance of `HttpContextToken`. * * @returns A reference to itself for easy chaining. */ delete(token) { this.map.delete(token); return this; } /** * Checks for existence of a given token. * * @param token The reference to an instance of `HttpContextToken`. * * @returns True if the token exists, false otherwise. */ has(token) { return this.map.has(token); } /** * @returns a list of tokens currently stored in the context. */ keys() { return this.map.keys(); } } /** * Determine whether the given HTTP method may include a body. */ function mightHaveBody(method) { switch (method) { case 'DELETE': case 'GET': case 'HEAD': case 'OPTIONS': case 'JSONP': return false; default: return true; } } /** * Safely assert whether the given value is an ArrayBuffer. * * In some execution environments ArrayBuffer is not defined. */ function isArrayBuffer(value) { return typeof ArrayBuffer !== 'undefined' && value instanceof ArrayBuffer; } /** * Safely assert whether the given value is a Blob. * * In some execution environments Blob is not defined. */ function isBlob(value) { return typeof Blob !== 'undefined' && value instanceof Blob; } /** * Safely assert whether the given value is a FormData instance. * * In some execution environments FormData is not defined. */ function isFormData(value) { return typeof FormData !== 'undefined' && value instanceof FormData; } /** * Safely assert whether the given value is a URLSearchParams instance. * * In some execution environments URLSearchParams is not defined. */ function isUrlSearchParams(value) { return typeof URLSearchParams !== 'undefined' && value instanceof URLSearchParams; } /** * `Content-Type` is an HTTP header used to indicate the media type * (also known as MIME type) of the resource being sent to the client * or received from the server. */ const CONTENT_TYPE_HEADER = 'Content-Type'; /** * The `Accept` header is an HTTP request header that indicates the media types * (or content types) the client is willing to receive from the server. */ const ACCEPT_HEADER = 'Accept'; /** * `X-Request-URL` is a custom HTTP header used in older browser versions, * including Firefox (< 32), Chrome (< 37), Safari (< 8), and Internet Explorer, * to include the full URL of the request in cross-origin requests. */ const X_REQUEST_URL_HEADER = 'X-Request-URL'; /** * `text/plain` is a content type used to indicate that the content being * sent is plain text with no special formatting or structured data * like HTML, XML, or JSON. */ const TEXT_CONTENT_TYPE = 'text/plain'; /** * `application/json` is a content type used to indicate that the content * being sent is in the JSON format. */ const JSON_CONTENT_TYPE = 'application/json'; /** * `application/json, text/plain, *\/*` is a content negotiation string often seen in the * Accept header of HTTP requests. It indicates the types of content the client is willing * to accept from the server, with a preference for `application/json` and `text/plain`, * but also accepting any other type (*\/*). */ const ACCEPT_HEADER_VALUE = `${JSON_CONTENT_TYPE}, ${TEXT_CONTENT_TYPE}, */*`; /** * An outgoing HTTP request with an optional typed body. * * `HttpRequest` represents an outgoing request, including URL, method, * headers, body, and other request configuration options. Instances should be * assumed to be immutable. To modify a `HttpRequest`, the `clone` * method should be used. * * @publicApi */ class HttpRequest { url; /** * The request body, or `null` if one isn't set. * * Bodies are not enforced to be immutable, as they can include a reference to any * user-defined data type. However, interceptors should take care to preserve * idempotence by treating them as such. */ body = null; /** * Outgoing headers for this request. */ headers; /** * Shared and mutable context that can be used by interceptors */ context; /** * Whether this request should be made in a way that exposes progress events. * * Progress events are expensive (change detection runs on each event) and so * they should only be requested if the consumer intends to monitor them. * * Note: The `FetchBackend` doesn't support progress report on uploads. */ reportProgress = false; /** * Whether this request should be sent with outgoing credentials (cookies). */ withCredentials = false; /** * The expected response type of the server. * * This is used to parse the response appropriately before returning it to * the requestee. */ responseType = 'json'; /** * The outgoing HTTP request method. */ method; /** * Outgoing URL parameters. * * To pass a string representation of HTTP parameters in the URL-query-string format, * the `HttpParamsOptions`' `fromString` may be used. For example: * * ```ts * new HttpParams({fromString: 'angular=awesome'}) * ``` */ params; /** * The outgoing URL with all URL parameters set. */ urlWithParams; /** * The HttpTransferCache option for the request */ transferCache; constructor(method, url, third, fourth) { this.url = url; this.method = method.toUpperCase(); // Next, need to figure out which argument holds the HttpRequestInit // options, if any. let options; // Check whether a body argument is expected. The only valid way to omit // the body argument is to use a known no-body method like GET. if (mightHaveBody(this.method) || !!fourth) { // Body is the third argument, options are the fourth. this.body = third !== undefined ? third : null; options = fourth; } else { // No body required, options are the third argument. The body stays null. options = third; } // If options have been passed, interpret them. if (options) { // Normalize reportProgress and withCredentials. this.reportProgress = !!options.reportProgress; this.withCredentials = !!options.withCredentials; // Override default response type of 'json' if one is provided. if (!!options.responseType) { this.responseType = options.responseType; } // Override headers if they're provided. if (!!options.headers) { this.headers = options.headers; } if (!!options.context) { this.context = options.context; } if (!!options.params) { this.params = options.params; } // We do want to assign transferCache even if it's falsy (false is valid value) this.transferCache = options.transferCache; } // If no headers have been passed in, construct a new HttpHeaders instance. this.headers ??= new HttpHeaders(); // If no context have been passed in, construct a new HttpContext instance. this.context ??= new HttpContext(); // If no parameters have been passed in, construct a new HttpUrlEncodedParams instance. if (!this.params) { this.params = new HttpParams(); this.urlWithParams = url; } else { // Encode the parameters to a string in preparation for inclusion in the URL. const params = this.params.toString(); if (params.length === 0) { // No parameters, the visible URL is just the URL given at creation time. this.urlWithParams = url; } else { // Does the URL already have query parameters? Look for '?'. const qIdx = url.indexOf('?'); // There are 3 cases to handle: // 1) No existing parameters -> append '?' followed by params. // 2) '?' exists and is followed by existing query string -> // append '&' followed by params. // 3) '?' exists at the end of the url -> append params directly. // This basically amounts to determining the character, if any, with // which to join the URL and parameters. const sep = qIdx === -1 ? '?' : qIdx < url.length - 1 ? '&' : ''; this.urlWithParams = url + sep + params; } } } /** * Transform the free-form body into a serialized format suitable for * transmission to the server. */ serializeBody() { // If no body is present, no need to serialize it. if (this.body === null) { return null; } // Check whether the body is already in a serialized form. If so, // it can just be returned directly. if (typeof this.body === 'string' || isArrayBuffer(this.body) || isBlob(this.body) || isFormData(this.body) || isUrlSearchParams(this.body)) { return this.body; } // Check whether the body is an instance of HttpUrlEncodedParams. if (this.body instanceof HttpParams) { return this.body.toString(); } // Check whether the body is an object or array, and serialize with JSON if so. if (typeof this.body === 'object' || typeof this.body === 'boolean' || Array.isArray(this.body)) { return JSON.stringify(this.body); } // Fall back on toString() for everything else. return this.body.toString(); } /** * Examine the body and attempt to infer an appropriate MIME type * for it. * * If no such type can be inferred, this method will return `null`. */ detectContentTypeHeader() { // An empty body has no content type. if (this.body === null) { return null; } // FormData bodies rely on the browser's content type assignment. if (isFormData(this.body)) { return null; } // Blobs usually have their own content type. If it doesn't, then // no type can be inferred. if (isBlob(this.body)) { return this.body.type || null; } // Array buffers have unknown contents and thus no type can be inferred. if (isArrayBuffer(this.body)) { return null; } // Technically, strings could be a form of JSON data, but it's safe enough // to assume they're plain strings. if (typeof this.body === 'string') { return TEXT_CONTENT_TYPE; } // `HttpUrlEncodedParams` has its own content-type. if (this.body instanceof HttpParams) { return 'application/x-www-form-urlencoded;charset=UTF-8'; } // Arrays, objects, boolean and numbers will be encoded as JSON. if (typeof this.body === 'object' || typeof this.body === 'number' || typeof this.body === 'boolean') { return JSON_CONTENT_TYPE; } // No type could be inferred. return null; } clone(update = {}) { // For method, url, and responseType, take the current value unless // it is overridden in the update hash. const method = update.method || this.method; const url = update.url || this.url; const responseType = update.responseType || this.responseType; // Carefully handle the transferCache to differentiate between // `false` and `undefined` in the update args. const transferCache = update.transferCache ?? this.transferCache; // The body is somewhat special - a `null` value in update.body means // whatever current body is present is being overridden with an empty // body, whereas an `undefined` value in update.body implies no // override. const body = update.body !== undefined ? update.body : this.body; // Carefully handle the boolean options to differentiate between // `false` and `undefined` in the update args. const withCredentials = update.withCredentials ?? this.withCredentials; const reportProgress = update.reportProgress ?? this.reportProgress; // Headers and params may be appended to if `setHeaders` or // `setParams` are used. let headers = update.headers || this.headers; let params = update.params || this.params; // Pass on context if needed const context = update.context ?? this.context; // Check whether the caller has asked to add headers. if (update.setHeaders !== undefined) { // Set every requested header. headers = Object.keys(update.setHeaders).reduce((headers, name) => headers.set(name, update.setHeaders[name]), headers); } // Check whether the caller has asked to set params. if (update.setParams) { // Set every requested param. params = Object.keys(update.setParams).reduce((params, param) => params.set(param, update.setParams[param]), params); } // Finally, construct the new HttpRequest using the pieces from above. return new HttpRequest(method, url, body, { params, headers, context, reportProgress, responseType, withCredentials, transferCache, }); } } /** * Type enumeration for the different kinds of `HttpEvent`. * * @publicApi */ var HttpEventType; (function (HttpEventType) { /** * The request was sent out over the wire. */ HttpEventType[HttpEventType["Sent"] = 0] = "Sent"; /** * An upload progress event was received. * * Note: The `FetchBackend` doesn't support progress report on uploads. */ HttpEventType[HttpEventType["UploadProgress"] = 1] = "UploadProgress"; /** * The response status code and headers were received. */ HttpEventType[HttpEventType["ResponseHeader"] = 2] = "ResponseHeader"; /** * A download progress event was received. */ HttpEventType[HttpEventType["DownloadProgress"] = 3] = "DownloadProgress"; /** * The full response including the body was received. */ HttpEventType[HttpEventType["Response"] = 4] = "Response"; /** * A custom event from an interceptor or a backend. */ HttpEventType[HttpEventType["User"] = 5] = "User"; })(HttpEventType || (HttpEventType = {})); /** * Base class for both `HttpResponse` and `HttpHeaderResponse`. * * @publicApi */ class HttpResponseBase { /** * All response headers. */ headers; /** * Response status code. */ status; /** * Textual description of response status code, defaults to OK. * * Do not depend on this. */ statusText; /** * URL of the resource retrieved, or null if not available. */ url; /** * Whether the status code falls in the 2xx range. */ ok; /** * Type of the response, narrowed to either the full response or the header. */ type; /** * Super-constructor for all responses. * * The single parameter accepted is an initialization hash. Any properties * of the response passed there will override the default values. */ constructor(init, defaultStatus = 200, defaultStatusText = 'OK') { // If the hash has values passed, use them to initialize the response. // Otherwise use the default values. this.headers = init.headers || new HttpHeaders(); this.status = init.status !== undefined ? init.status : defaultStatus; this.statusText = init.statusText || defaultStatusText; this.url = init.url || null; // Cache the ok value to avoid defining a getter. this.ok = this.status >= 200 && this.status < 300; } } /** * A partial HTTP response which only includes the status and header data, * but no response body. * * `HttpHeaderResponse` is a `HttpEvent` available on the response * event stream, only when progress events are requested. * * @publicApi */ class HttpHeaderResponse extends HttpResponseBase { /** * Create a new `HttpHeaderResponse` with the given parameters. */ constructor(init = {}) { super(init); } type = HttpEventType.ResponseHeader; /** * Copy this `HttpHeaderResponse`, overriding its contents with the * given parameter hash. */ clone(update = {}) { // Perform a straightforward initialization of the new HttpHeaderResponse, // overriding the current parameters with new ones if given. return new HttpHeaderResponse({ headers: update.headers || this.headers, status: update.status !== undefined ? update.status : this.status, statusText: update.statusText || this.statusText, url: update.url || this.url || undefined, }); } } /** * A full HTTP response, including a typed response body (which may be `null` * if one was not returned). * * `HttpResponse` is a `HttpEvent` available on the response event * stream. * * @publicApi */ class HttpResponse extends HttpResponseBase { /** * The response body, or `null` if one was not returned. */ body; /** * Construct a new `HttpResponse`. */ constructor(init = {}) { super(init); this.body = init.body !== undefined ? init.body : null; } type = HttpEventType.Response; clone(update = {}) { return new HttpResponse({ body: update.body !== undefined ? update.body : this.body, headers: update.headers || this.headers, status: update.status !== undefined ? update.status : this.status, statusText: update.statusText || this.statusText, url: update.url || this.url || undefined, }); } } /** * A response that represents an error or failure, either from a * non-successful HTTP status, an error while executing the request, * or some other failure which occurred during the parsing of the response. * * Any error returned on the `Observable` response stream will be * wrapped in an `HttpErrorResponse` to provide additional context about * the state of the HTTP layer when the error occurred. The error property * will contain either a wrapped Error object or the error response returned * from the server. * * @publicApi */ class HttpErrorResponse extends HttpResponseBase { name = 'HttpErrorResponse'; message; error; /** * Errors are never okay, even when the status code is in the 2xx success range. */ ok = false; constructor(init) { // Initialize with a default status of 0 / Unknown Error. super(init, 0, 'Unknown Error'); // If the response was successful, then this was a parse error. Otherwise, it was // a protocol-level failure of some sort. Either the request failed in transit // or the server returned an unsuccessful status code. if (this.status >= 200 && this.status < 300) { this.message = `Http failure during parsing for ${init.url || '(unknown url)'}`; } else { this.message = `Http failure response for ${init.url || '(unknown url)'}: ${init.status} ${init.statusText}`; } this.error = init.error || null; } } /** * We use these constant to prevent pulling the whole HttpStatusCode enum * Those are the only ones referenced directly by the framework */ const HTTP_STATUS_CODE_OK = 200; const HTTP_STATUS_CODE_NO_CONTENT = 204; /** * Http status codes. * As per https://www.iana.org/assignments/http-status-codes/http-status-codes.xhtml * @publicApi */ var HttpStatusCode; (function (HttpStatusCode) { HttpStatusCode[HttpStatusCode["Continue"] = 100] = "Continue"; HttpStatusCode[HttpStatusCode["SwitchingProtocols"] = 101] = "SwitchingProtocols"; HttpStatusCode[HttpStatusCode["Processing"] = 102] = "Processing"; HttpStatusCode[HttpStatusCode["EarlyHints"] = 103] = "EarlyHints"; HttpStatusCode[HttpStatusCode["Ok"] = 200] = "Ok"; HttpStatusCode[HttpStatusCode["Created"] = 201] = "Created"; HttpStatusCode[HttpStatusCode["Accepted"] = 202] = "Accepted"; HttpStatusCode[HttpStatusCode["NonAuthoritativeInformation"] = 203] = "NonAuthoritativeInformation"; HttpStatusCode[HttpStatusCode["NoContent"] = 204] = "NoContent"; HttpStatusCode[HttpStatusCode["ResetContent"] = 205] = "ResetContent"; HttpStatusCode[HttpStatusCode["PartialContent"] = 206] = "PartialContent"; HttpStatusCode[HttpStatusCode["MultiStatus"] = 207] = "MultiStatus"; HttpStatusCode[HttpStatusCode["AlreadyReported"] = 208] = "AlreadyReported"; HttpStatusCode[HttpStatusCode["ImUsed"] = 226] = "ImUsed"; HttpStatusCode[HttpStatusCode["MultipleChoices"] = 300] = "MultipleChoices"; HttpStatusCode[HttpStatusCode["MovedPermanently"] = 301] = "MovedPermanently"; HttpStatusCode[HttpStatusCode["Found"] = 302] = "Found"; HttpStatusCode[HttpStatusCode["SeeOther"] = 303] = "SeeOther"; HttpStatusCode[HttpStatusCode["NotModified"] = 304] = "NotModified"; HttpStatusCode[HttpStatusCode["UseProxy"] = 305] = "UseProxy"; HttpStatusCode[HttpStatusCode["Unused"] = 306] = "Unused"; HttpStatusCode[HttpStatusCode["TemporaryRedirect"] = 307] = "TemporaryRedirect"; HttpStatusCode[HttpStatusCode["PermanentRedirect"] = 308] = "PermanentRedirect"; HttpStatusCode[HttpStatusCode["BadRequest"] = 400] = "BadRequest"; HttpStatusCode[HttpStatusCode["Unauthorized"] = 401] = "Unauthorized"; HttpStatusCode[HttpStatusCode["PaymentRequired"] = 402] = "PaymentRequired"; HttpStatusCode[HttpStatusCode["Forbidden"] = 403] = "Forbidden"; HttpStatusCode[HttpStatusCode["NotFound"] = 404] = "NotFound"; HttpStatusCode[HttpStatusCode["MethodNotAllowed"] = 405] = "MethodNotAllowed"; HttpStatusCode[HttpStatusCode["NotAcceptable"] = 406] = "NotAcceptable"; HttpStatusCode[HttpStatusCode["ProxyAuthenticationRequired"] = 407] = "ProxyAuthenticationRequired"; HttpStatusCode[HttpStatusCode["RequestTimeout"] = 408] = "RequestTimeout"; HttpStatusCode[HttpStatusCode["Conflict"] = 409] = "Conflict"; HttpStatusCode[HttpStatusCode["Gone"] = 410] = "Gone"; HttpStatusCode[HttpStatusCode["LengthRequired"] = 411] = "LengthRequired"; HttpStatusCode[HttpStatusCode["PreconditionFailed"] = 412] = "PreconditionFailed"; HttpStatusCode[HttpStatusCode["PayloadTooLarge"] = 413] = "PayloadTooLarge"; HttpStatusCode[HttpStatusCode["UriTooLong"] = 414] = "UriTooLong"; HttpStatusCode[HttpStatusCode["UnsupportedMediaType"] = 415] = "UnsupportedMediaType"; HttpStatusCode[HttpStatusCode["RangeNotSatisfiable"] = 416] = "RangeNotSatisfiable"; HttpStatusCode[HttpStatusCode["ExpectationFailed"] = 417] = "ExpectationFailed"; HttpStatusCode[HttpStatusCode["ImATeapot"] = 418] = "ImATeapot"; HttpStatusCode[HttpStatusCode["MisdirectedRequest"] = 421] = "MisdirectedRequest"; HttpStatusCode[HttpStatusCode["UnprocessableEntity"] = 422] = "UnprocessableEntity"; HttpStatusCode[HttpStatusCode["Locked"] = 423] = "Locked"; HttpStatusCode[HttpStatusCode["FailedDependency"] = 424] = "FailedDependency"; HttpStatusCode[HttpStatusCode["TooEarly"] = 425] = "TooEarly"; HttpStatusCode[HttpStatusCode["UpgradeRequired"] = 426] = "UpgradeRequired"; HttpStatusCode[HttpStatusCode["PreconditionRequired"] = 428] = "PreconditionRequired"; HttpStatusCode[HttpStatusCode["TooManyRequests"] = 429] = "TooManyRequests"; HttpStatusCode[HttpStatusCode["RequestHeaderFieldsTooLarge"] = 431] = "RequestHeaderFieldsTooLarge"; HttpStatusCode[HttpStatusCode["UnavailableForLegalReasons"] = 451] = "UnavailableForLegalReasons"; HttpStatusCode[HttpStatusCode["InternalServerError"] = 500] = "InternalServerError"; HttpStatusCode[HttpStatusCode["NotImplemented"] = 501] = "NotImplemented"; HttpStatusCode[HttpStatusCode["BadGateway"] = 502] = "BadGateway"; HttpStatusCode[HttpStatusCode["ServiceUnavailable"] = 503] = "ServiceUnavailable"; HttpStatusCode[HttpStatusCode["GatewayTimeout"] = 504] = "GatewayTimeout"; HttpStatusCode[HttpStatusCode["HttpVersionNotSupported"] = 505] = "HttpVersionNotSupported"; HttpStatusCode[HttpStatusCode["VariantAlsoNegotiates"] = 506] = "VariantAlsoNegotiates"; HttpStatusCode[HttpStatusCode["InsufficientStorage"] = 507] = "InsufficientStorage"; HttpStatusCode[HttpStatusCode["LoopDetected"] = 508] = "LoopDetected"; HttpStatusCode[HttpStatusCode["NotExtended"] = 510] = "NotExtended"; HttpStatusCode[HttpStatusCode["NetworkAuthenticationRequired"] = 511] = "NetworkAuthenticationRequired"; })(HttpStatusCode || (HttpStatusCode = {})); /** * Constructs an instance of `HttpRequestOptions` from a source `HttpMethodOptions` and * the given `body`. This function clones the object and adds the body. * * Note that the `responseType` *options* value is a String that identifies the * single data type of the response. * A single overload version of the method handles each response type. * The value of `responseType` cannot be a union, as the combined signature could imply. * */ function addBody(options, body) { return { body, headers: options.headers, context: options.context, observe: options.observe, params: options.params, reportProgress: options.reportProgress, responseType: options.responseType, withCredentials: options.withCredentials, transferCache: options.transferCache, }; } /** * Performs HTTP requests. * This service is available as an injectable class, with methods to perform HTTP requests. * Each request method has multiple signatures, and the return type varies based on * the signature that is called (mainly the values of `observe` and `responseType`). * * Note that the `responseType` *options* value is a String that identifies the * single data type of the response. * A single overload version of the method handles each response type. * The value of `responseType` cannot be a union, as the combined signature could imply. * * @usageNotes * * ### HTTP Request Example * * ```ts * // GET heroes whose name contains search term * searchHeroes(term: string): observable{ * * const params = new HttpParams({fromString: 'name=term'}); * return this.httpClient.request('GET', this.heroesUrl, {responseType:'json', params}); * } * ``` * * Alternatively, the parameter string can be used without invoking HttpParams * by directly joining to the URL. * ```ts * this.httpClient.request('GET', this.heroesUrl + '?' + 'name=term', {responseType:'json'}); * ``` * * * ### JSONP Example * ```ts * requestJsonp(url, callback = 'callback') { * return this.httpClient.jsonp(this.heroesURL, callback); * } * ``` * * ### PATCH Example * ```ts * // PATCH one of the heroes' name * patchHero (id: number, heroName: string): Observable<{}> { * const url = `${this.heroesUrl}/${id}`; // PATCH api/heroes/42 * return this.httpClient.patch(url, {name: heroName}, httpOptions) * .pipe(catchError(this.handleError('patchHero'))); * } * ``` * * @see [HTTP Guide](guide/http) * @see [HTTP Request](api/common/http/HttpRequest) * * @publicApi */ class HttpClient { handler; constructor(handler) { this.handler = handler; } /** * Constructs an observable for a generic HTTP request that, when subscribed, * fires the request through the chain of registered interceptors and on to the * server. * * You can pass an `HttpRequest` directly as the only parameter. In this case, * the call returns an observable of the raw `HttpEvent` stream. * * Alternatively you can pass an HTTP method as the first parameter, * a URL string as the second, and an options hash containing the request body as the third. * See `addBody()`. In this case, the specified `responseType` and `observe` options determine the * type of returned observable. * * The `responseType` value determines how a successful response body is parsed. * * If `responseType` is the default `json`, you can pass a type interface for the resulting * object as a type parameter to the call. * * The `observe` value determines the return type, according to what you are interested in * observing. * * An `observe` value of events returns an observable of the raw `HttpEvent` stream, including * progress events by default. * * An `observe` value of response returns an observable of `HttpResponse`, * where the `T` parameter depends on the `responseType` and any optionally provided type * parameter. * * An `observe` value of body returns an observable of `` with the same `T` body type. * */ request(first, url, options = {}) { let req; // First, check whether the primary argument is an instance of `HttpRequest`. if (first instanceof HttpRequest) { // It is. The other arguments must be undefined (per the signatures) and can be // ignored. req = first; } else { // It's a string, so it represents a URL. Construct a request based on it, // and incorporate the remaining arguments (assuming `GET` unless a method is // provided. // Figure out the headers. let headers = undefined; if (options.headers instanceof HttpHeaders) { headers = options.headers; } else { headers = new HttpHeaders(options.headers); } // Sort out parameters. let params = undefined; if (!!options.params) { if (options.params instanceof HttpParams) { params = options.params; } else { params = new HttpParams({ fromObject: options.params }); } } // Construct the request. req = new HttpRequest(first, url, options.body !== undefined ? options.body : null, { headers, context: options.context, params, reportProgress: options.reportProgress, // By default, JSON is assumed to be returned for all calls. responseType: options.responseType || 'json', withCredentials: options.withCredentials, transferCache: options.transferCache, }); } // Start with an Observable.of() the initial request, and run the handler (which // includes all interceptors) inside a concatMap(). This way, the handler runs // inside an Observable chain, which causes interceptors to be re-run on every // subscription (this also makes retries re-run the handler, including interceptors). const events$ = of(req).pipe(concatMap((req) => this.handler.handle(req))); // If coming via the API signature which accepts a previously constructed HttpRequest, // the only option is to get the event stream. Otherwise, return the event stream if // that is what was requested. if (first instanceof HttpRequest || options.observe === 'events') { return events$; } // The requested stream contains either the full response or the body. In either // case, the first step is to filter the event stream to extract a stream of // responses(s). const res$ = (events$.pipe(filter((event) => event instanceof HttpResponse))); // Decide which stream to return. switch (options.observe || 'body') { case 'body': // The requested stream is the body. Map the response stream to the response // body. This could be done more simply, but a misbehaving interceptor might // transform the response body into a different format and ignore the requested // responseType. Guard against this by validating that the response is of the // requested type. switch (req.responseType) { case 'arraybuffer': return res$.pipe(map((res) => { // Validate that the body is an ArrayBuffer. if (res.body !== null && !(res.body instanceof ArrayBuffer)) { throw new _RuntimeError(2806 /* RuntimeErrorCode.RESPONSE_IS_NOT_AN_ARRAY_BUFFER */, ngDevMode && 'Response is not an ArrayBuffer.'); } return res.body; })); case 'blob': return res$.pipe(map((res) => { // Validate that the body is a Blob. if (res.body !== null && !(res.body instanceof Blob)) { throw new _RuntimeError(2807 /* RuntimeErrorCode.RESPONSE_IS_NOT_A_BLOB */, ngDevMode && 'Response is not a Blob.'); } return res.body; })); case 'text': return res$.pipe(map((res) => { // Validate that the body is a string. if (res.body !== null && typeof res.body !== 'string') { throw new _RuntimeError(2808 /* RuntimeErrorCode.RESPONSE_IS_NOT_A_STRING */, ngDevMode && 'Response is not a string.'); } return res.body; })); case 'json': default: // No validation needed for JSON responses, as they can be of any type. return res$.pipe(map((res) => res.body)); } case 'response': // The response stream was requested directly, so return it. return res$; default: // Guard against new future observe types being added. throw new _RuntimeError(2809 /* RuntimeErrorCode.UNHANDLED_OBSERVE_TYPE */, ngDevMode && `Unreachable: unhandled observe type ${options.observe}}`); } } /** * Constructs an observable that, when subscribed, causes the configured * `DELETE` request to execute on the server. See the individual overloads for * details on the return type. * * @param url The endpoint URL. * @param options The HTTP options to send with the request. * */ delete(url, options = {}) { return this.request('DELETE', url, options); } /** * Constructs an observable that, when subscribed, causes the configured * `GET` request to execute on the server. See the individual overloads for * details on the return type. */ get(url, options = {}) { return this.request('GET', url, options); } /** * Constructs an observable that, when subscribed, causes the configured * `HEAD` request to execute on the server. The `HEAD` method returns * meta information about the resource without transferring the * resource itself. See the individual overloads for * details on the return type. */ head(url, options = {}) { return this.request('HEAD', url, options); } /** * Constructs an `Observable` that, when subscribed, causes a request with the special method * `JSONP` to be dispatched via the interceptor pipeline. * The [JSONP pattern](https://en.wikipedia.org/wiki/JSONP) works around limitations of certain * API endpoints that don't support newer, * and preferable [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) protocol. * JSONP treats the endpoint API as a JavaScript file and tricks the browser to process the * requests even if the API endpoint is not located on the same domain (origin) as the client-side * application making the request. * The endpoint API must support JSONP callback for JSONP requests to work. * The resource API returns the JSON response wrapped in a callback function. * You can pass the callback function name as one of the query parameters. * Note that JSONP requests can only be used with `GET` requests. * * @param url The resource URL. * @param callbackParam The callback function name. * */ jsonp(url, callbackParam) { return this.request('JSONP', url, { params: new HttpParams().append(callbackParam, 'JSONP_CALLBACK'), observe: 'body', responseType: 'json', }); } /** * Constructs an `Observable` that, when subscribed, causes the configured * `OPTIONS` request to execute on the server. This method allows the client * to determine the supported HTTP methods and other capabilities of an endpoint, * without implying a resource action. See the individual overloads for * details on the return type. */ options(url, options = {}) { return this.request('OPTIONS', url, options); } /** * Constructs an observable that, when subscribed, causes the configured * `PATCH` request to execute on the server. See the individual overloads for * details on the return type. */ patch(url, body, options = {}) { return this.request('PATCH', url, addBody(options, body)); } /** * Constructs an observable that, when subscribed, causes the configured * `POST` request to execute on the server. The server responds with the location of * the replaced resource. See the individual overloads for * details on the return type. */ post(url, body, options = {}) { return this.request('POST', url, addBody(options, body)); } /** * Constructs an observable that, when subscribed, causes the configured * `PUT` request to execute on the server. The `PUT` method replaces an existing resource * with a new set of values. * See the individual overloads for details on the return type. */ put(url, body, options = {}) { return this.request('PUT', url, addBody(options, body)); } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClient, deps: [{ token: HttpHandler }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClient }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpClient, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: HttpHandler }] }); const XSSI_PREFIX$1 = /^\)\]\}',?\n/; /** * Determine an appropriate URL for the response, by checking either * response url or the X-Request-URL header. */ function getResponseUrl$1(response) { if (response.url) { return response.url; } // stored as lowercase in the map const xRequestUrl = X_REQUEST_URL_HEADER.toLocaleLowerCase(); return response.headers.get(xRequestUrl); } /** * An internal injection token to reference `FetchBackend` implementation * in a tree-shakable way. */ const FETCH_BACKEND = new InjectionToken(typeof ngDevMode === 'undefined' || ngDevMode ? 'FETCH_BACKEND' : ''); /** * Uses `fetch` to send requests to a backend server. * * This `FetchBackend` requires the support of the * [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) which is available on all * supported browsers and on Node.js v18 or later. * * @see {@link HttpHandler} * * @publicApi */ class FetchBackend { // We use an arrow function to always reference the current global implementation of `fetch`. // This is helpful for cases when the global `fetch` implementation is modified by external code, // see https://github.com/angular/angular/issues/57527. fetchImpl = inject(FetchFactory, { optional: true })?.fetch ?? ((...args) => globalThis.fetch(...args)); ngZone = inject(NgZone); destroyRef = inject(DestroyRef); destroyed = false; constructor() { this.destroyRef.onDestroy(() => { this.destroyed = true; }); } handle(request) { return new Observable((observer) => { const aborter = new AbortController(); this.doRequest(request, aborter.signal, observer).then(noop, (error) => observer.error(new HttpErrorResponse({ error }))); return () => aborter.abort(); }); } async doRequest(request, signal, observer) { const init = this.createRequestInit(request); let response; try { // Run fetch outside of Angular zone. // This is due to Node.js fetch implementation (Undici) which uses a number of setTimeouts to check if // the response should eventually timeout which causes extra CD cycles every 500ms const fetchPromise = this.ngZone.runOutsideAngular(() => this.fetchImpl(request.urlWithParams, { signal, ...init })); // Make sure Zone.js doesn't trigger false-positive unhandled promise // error in case the Promise is rejected synchronously. See function // description for additional information. silenceSuperfluousUnhandledPromiseRejection(fetchPromise); // Send the `Sent` event before awaiting the response. observer.next({ type: HttpEventType.Sent }); response = await fetchPromise; } catch (error) { observer.error(new HttpErrorResponse({ error, status: error.status ?? 0, statusText: error.statusText, url: request.urlWithParams, headers: error.headers, })); return; } const headers = new HttpHeaders(response.headers); const statusText = response.statusText; const url = getResponseUrl$1(response) ?? request.urlWithParams; let status = response.status; let body = null; if (request.reportProgress) { observer.next(new HttpHeaderResponse({ headers, status, statusText, url })); } if (response.body) { // Read Progress const contentLength = response.headers.get('content-length'); const chunks = []; const reader = response.body.getReader(); let receivedLength = 0; let decoder; let partialText; // We have to check whether the Zone is defined in the global scope because this may be called // when the zone is nooped. const reqZone = typeof Zone !== 'undefined' && Zone.current; let canceled = false; // Perform response processing outside of Angular zone to // ensure no excessive change detection runs are executed // Here calling the async ReadableStreamDefaultReader.read() is responsible for triggering CD await this.ngZone.runOutsideAngular(async () => { while (true) { // Prevent reading chunks if the app is destroyed. Otherwise, we risk doing // unnecessary work or triggering side effects after teardown. // This may happen if the app was explicitly destroyed before $ // the response returned entirely. if (this.destroyed) { // Streams left in a pending state (due to `break` without cancel) may // continue consuming or holding onto data behind the scenes. // Calling `reader.cancel()` allows the browser or the underlying // system to release any network or memory resources associated with the stream. await reader.cancel(); canceled = true; break; } const { done, value } = await reader.read(); if (done) { break; } chunks.push(value); receivedLength += value.length; if (request.reportProgress) { partialText = request.responseType === 'text' ? (partialText ?? '') + (decoder ??= new TextDecoder()).decode(value, { stream: true }) : undefined; const reportProgress = () => observer.next({ type: HttpEventType.DownloadProgress, total: contentLength ? +contentLength : undefined, loaded: receivedLength, partialText, }); reqZone ? reqZone.run(reportProgress) : reportProgress(); } } }); // We need to manage the canceled state — because the Streams API does not // expose a direct `.state` property on the reader. // We need to `return` because `parseBody` may not be able to parse chunks // that were only partially read (due to cancellation caused by app destruction). if (canceled) { observer.complete(); return; } // Combine all chunks. const chunksAll = this.concatChunks(chunks, receivedLength); try { const contentType = response.headers.get(CONTENT_TYPE_HEADER) ?? ''; body = this.parseBody(request, chunksAll, contentType); } catch (error) { // Body loading or parsing failed observer.error(new HttpErrorResponse({ error, headers: new HttpHeaders(response.headers), status: response.status, statusText: response.statusText, url: getResponseUrl$1(response) ?? request.urlWithParams, })); return; } } // Same behavior as the XhrBackend if (status === 0) { status = body ? HTTP_STATUS_CODE_OK : 0; } // ok determines whether the response will be transmitted on the event or // error channel. Unsuccessful status codes (not 2xx) will always be errors, // but a successful status code can still result in an error if the user // asked for JSON data and the body cannot be parsed as such. const ok = status >= 200 && status < 300; if (ok) { observer.next(new HttpResponse({ body, headers, status, statusText, url, })); // The full body has been received and delivered, no further events // are possible. This request is complete. observer.complete(); } else { observer.error(new HttpErrorResponse({ error: body, headers, status, statusText, url, })); } } parseBody(request, binContent, contentType) { switch (request.responseType) { case 'json': // stripping the XSSI when present const text = new TextDecoder().decode(binContent).replace(XSSI_PREFIX$1, ''); return text === '' ? null : JSON.parse(text); case 'text': return new TextDecoder().decode(binContent); case 'blob': return new Blob([binContent], { type: contentType }); case 'arraybuffer': return binContent.buffer; } } createRequestInit(req) { // We could share some of this logic with the XhrBackend const headers = {}; const credentials = req.withCredentials ? 'include' : undefined; // Setting all the requested headers. req.headers.forEach((name, values) => (headers[name] = values.join(','))); // Add an Accept header if one isn't present already. if (!req.headers.has(ACCEPT_HEADER)) { headers[ACCEPT_HEADER] = ACCEPT_HEADER_VALUE; } // Auto-detect the Content-Type header if one isn't present already. if (!req.headers.has(CONTENT_TYPE_HEADER)) { const detectedType = req.detectContentTypeHeader(); // Sometimes Content-Type detection fails. if (detectedType !== null) { headers[CONTENT_TYPE_HEADER] = detectedType; } } return { body: req.serializeBody(), method: req.method, headers, credentials, }; } concatChunks(chunks, totalLength) { const chunksAll = new Uint8Array(totalLength); let position = 0; for (const chunk of chunks) { chunksAll.set(chunk, position); position += chunk.length; } return chunksAll; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FetchBackend, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FetchBackend }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FetchBackend, decorators: [{ type: Injectable }], ctorParameters: () => [] }); /** * Abstract class to provide a mocked implementation of `fetch()` */ class FetchFactory { } function noop() { } /** * Zone.js treats a rejected promise that has not yet been awaited * as an unhandled error. This function adds a noop `.then` to make * sure that Zone.js doesn't throw an error if the Promise is rejected * synchronously. */ function silenceSuperfluousUnhandledPromiseRejection(promise) { promise.then(noop, noop); } function interceptorChainEndFn(req, finalHandlerFn) { return finalHandlerFn(req); } /** * Constructs a `ChainedInterceptorFn` which adapts a legacy `HttpInterceptor` to the * `ChainedInterceptorFn` interface. */ function adaptLegacyInterceptorToChain(chainTailFn, interceptor) { return (initialRequest, finalHandlerFn) => interceptor.intercept(initialRequest, { handle: (downstreamRequest) => chainTailFn(downstreamRequest, finalHandlerFn), }); } /** * Constructs a `ChainedInterceptorFn` which wraps and invokes a functional interceptor in the given * injector. */ function chainedInterceptorFn(chainTailFn, interceptorFn, injector) { return (initialRequest, finalHandlerFn) => runInInjectionContext(injector, () => interceptorFn(initialRequest, (downstreamRequest) => chainTailFn(downstreamRequest, finalHandlerFn))); } /** * A multi-provider token that represents the array of registered * `HttpInterceptor` objects. * * @publicApi */ const HTTP_INTERCEPTORS = new InjectionToken(ngDevMode ? 'HTTP_INTERCEPTORS' : ''); /** * A multi-provided token of `HttpInterceptorFn`s. */ const HTTP_INTERCEPTOR_FNS = new InjectionToken(ngDevMode ? 'HTTP_INTERCEPTOR_FNS' : ''); /** * A multi-provided token of `HttpInterceptorFn`s that are only set in root. */ const HTTP_ROOT_INTERCEPTOR_FNS = new InjectionToken(ngDevMode ? 'HTTP_ROOT_INTERCEPTOR_FNS' : ''); // TODO(atscott): We need a larger discussion about stability and what should contribute to stability. // Should the whole interceptor chain contribute to stability or just the backend request #55075? // Should HttpClient contribute to stability automatically at all? const REQUESTS_CONTRIBUTE_TO_STABILITY = new InjectionToken(ngDevMode ? 'REQUESTS_CONTRIBUTE_TO_STABILITY' : '', { providedIn: 'root', factory: () => true }); /** * Creates an `HttpInterceptorFn` which lazily initializes an interceptor chain from the legacy * class-based interceptors and runs the request through it. */ function legacyInterceptorFnFactory() { let chain = null; return (req, handler) => { if (chain === null) { const interceptors = inject(HTTP_INTERCEPTORS, { optional: true }) ?? []; // Note: interceptors are wrapped right-to-left so that final execution order is // left-to-right. That is, if `interceptors` is the array `[a, b, c]`, we want to // produce a chain that is conceptually `c(b(a(end)))`, which we build from the inside // out. chain = interceptors.reduceRight(adaptLegacyInterceptorToChain, interceptorChainEndFn); } const pendingTasks = inject(_PendingTasksInternal); const contributeToStability = inject(REQUESTS_CONTRIBUTE_TO_STABILITY); if (contributeToStability) { const taskId = pendingTasks.add(); return chain(req, handler).pipe(finalize(() => pendingTasks.remove(taskId))); } else { return chain(req, handler); } }; } let fetchBackendWarningDisplayed = false; class HttpInterceptorHandler extends HttpHandler { backend; injector; chain = null; pendingTasks = inject(_PendingTasksInternal); contributeToStability = inject(REQUESTS_CONTRIBUTE_TO_STABILITY); constructor(backend, injector) { super(); this.backend = backend; this.injector = injector; // We strongly recommend using fetch backend for HTTP calls when SSR is used // for an application. The logic below checks if that's the case and produces // a warning otherwise. if ((typeof ngDevMode === 'undefined' || ngDevMode) && !fetchBackendWarningDisplayed) { const isServer = isPlatformServer(injector.get(PLATFORM_ID)); // This flag is necessary because provideHttpClientTesting() overrides the backend // even if `withFetch()` is used within the test. When the testing HTTP backend is provided, // no HTTP calls are actually performed during the test, so producing a warning would be // misleading. const isTestingBackend = this.backend.isTestingBackend; if (isServer && !(this.backend instanceof FetchBackend) && !isTestingBackend) { fetchBackendWarningDisplayed = true; injector .get(_Console) .warn(_formatRuntimeError(2801 /* RuntimeErrorCode.NOT_USING_FETCH_BACKEND_IN_SSR */, 'Angular detected that `HttpClient` is not configured ' + "to use `fetch` APIs. It's strongly recommended to " + 'enable `fetch` for applications that use Server-Side Rendering ' + 'for better performance and compatibility. ' + 'To enable `fetch`, add the `withFetch()` to the `provideHttpClient()` ' + 'call at the root of the application.')); } } } handle(initialRequest) { if (this.chain === null) { const dedupedInterceptorFns = Array.from(new Set([ ...this.injector.get(HTTP_INTERCEPTOR_FNS), ...this.injector.get(HTTP_ROOT_INTERCEPTOR_FNS, []), ])); // Note: interceptors are wrapped right-to-left so that final execution order is // left-to-right. That is, if `dedupedInterceptorFns` is the array `[a, b, c]`, we want to // produce a chain that is conceptually `c(b(a(end)))`, which we build from the inside // out. this.chain = dedupedInterceptorFns.reduceRight((nextSequencedFn, interceptorFn) => chainedInterceptorFn(nextSequencedFn, interceptorFn, this.injector), interceptorChainEndFn); } if (this.contributeToStability) { const taskId = this.pendingTasks.add(); return this.chain(initialRequest, (downstreamRequest) => this.backend.handle(downstreamRequest)).pipe(finalize(() => this.pendingTasks.remove(taskId))); } else { return this.chain(initialRequest, (downstreamRequest) => this.backend.handle(downstreamRequest)); } } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpInterceptorHandler, deps: [{ token: HttpBackend }, { token: i0.EnvironmentInjector }], target: i0.ɵɵFactoryTarget.Injectable }); static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpInterceptorHandler }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: HttpInterceptorHandler, decorators: [{ type: Injectable }], ctorParameters: () => [{ type: HttpBackend }, { type: i0.EnvironmentInjector }] }); // Every request made through JSONP needs a callback name that's unique across the // whole page. Each request is assigned an id and the callback name is constructed // from that. The next id to be assigned is tracked in a global variable here that // is shared among all applications on the page. let nextRequestId = 0; /** * When a pending T xK/****************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */ /* global Reflect, Promise, SuppressedError, Symbol, Iterator */ var extendStatics = function(d, b) { extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; return extendStatics(d, b); }; export function __extends(d, b) { if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); } export var __assign = function() { __assign = Object.assign || function __assign(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; } return __assign.apply(this, arguments); } export function __rest(s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; } export function __decorate(decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; } export function __param(paramIndex, decorator) { return function (target, key) { decorator(target, key, paramIndex); } } export function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) { function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; } var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value"; var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null; var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {}); var _, done = false; for (var i = decorators.length - 1; i >= 0; i--) { var context = {}; for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p]; for (var p in contextIn.access) context.access[p] = contextIn.access[p]; context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); }; var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context); if (kind === "accessor") { if (result === void 0) continue; if (result === null || typeof result !== "object") throw new TypeError("Object expected"); if (_ = accept(result.get)) descriptor.get = _; if (_ = accept(result.set)) descriptor.set = _; if (_ = accept(result.init)) initializers.unshift(_); } else if (_ = accept(result)) { if (kind === "field") initializers.unshift(_); else descriptor[key] = _; } } if (target) Object.defineProperty(target, contextIn.name, descriptor); done = true; }; export function __runInitializers(thisArg, initializers, value) { var useValue = arguments.length > 2; for (var i = 0; i < initializers.length; i++) { value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg); } return useValue ? value : void 0; }; export function __propKey(x) { return typeof x === "symbol" ? x : "".concat(x); }; export function __setFunctionName(f, name, prefix) { if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : ""; return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name }); }; export function __metadata(metadataKey, metadataValue) { if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue); } export function __awaiter(thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); } export function __generator(thisArg, body) { var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype); return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); while (g && (g = 0, op[0] && (_ = 0)), _) try { if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; if (y = 0, t) op = [op[0] & 2, t.value]; switch (op[0]) { case 0: case 1: t = op; break; case 4: _.label++; return { value: op[1], done: false }; case 5: _.label++; y = op[1]; op = [0]; continue; case 7: op = _.ops.pop(); _.trys.pop(); continue; default: if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } if (t[2]) _.ops.pop(); _.trys.pop(); continue; } op = body.call(thisArg, _); } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; } } export var __createBinding = Object.create ? (function(o, m, k, k2) { if (k2 === undefined) k2 = k; var desc = Object.getOwnPropertyDescriptor(m, k); if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { desc = { enumerable: true, get: function() { return m[k]; } }; } Object.defineProperty(o, k2, desc); }) : (function(o, m, k, k2) { if (k2 === undefined) k2 = k; o[k2] = m[k]; }); export function __exportStar(m, o) { for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p); } export function __values(o) { var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; if (m) return m.call(o); if (o && typeof o.length === "number") return { next: function () { if (o && i >= o.length) o = void 0; return { value: o && o[i++], done: !o }; } }; throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); } export function __read(o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; } /** @deprecated */ export function __spread() { for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); return ar; } /** @deprecated */ export function __spreadArrays() { for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; return r; } export function __spreadArray(to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); } export function __await(v) { return this instanceof __await ? (this.v = v, this) : new __await(v); } export function __asyncGenerator(thisArg, _arguments, generator) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var g = generator.apply(thisArg, _arguments || []), i, q = []; return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i; function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; } function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } } function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } } function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); } function fulfill(value) { resume("next", value); } function reject(value) { resume("throw", value); } function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); } } export function __asyncDelegator(o) { var i, p; return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i; function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; } } export function __asyncValues(o) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var m = o[Symbol.asyncIterator], i; return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i); function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; } function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); } } export function __makeTemplateObject(cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; }; var __setModuleDefault = Object.create ? (function(o, v) { Object.defineProperty(o, "default", { enumerable: true, value: v }); }) : function(o, v) { o["default"] = v; }; var ownKeys = function(o) { ownKeys = Object.getOwnPropertyNames || function (o) { var ar = []; for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k; return ar; }; return ownKeys(o); }; export function __importStar(mod) { if (mod && mod.__esModule) return mod; var result = {}; if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]); __setModuleDefault(result, mod); return result; } export function __importDefault(mod) { return (mod && mod.__esModule) ? mod : { default: mod }; } export function __classPrivateFieldGet(receiver, state, kind, f) { if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it"); return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver); } export function __classPrivateFieldSet(receiver, state, value, kind, f) { if (kind === "m") throw new TypeError("Private method is not writable"); if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value; } export function __classPrivateFieldIn(state, receiver) { if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object"); return typeof state === "function" ? receiver === state : state.has(receiver); } export function __addDisposableResource(env, value, async) { if (value !== null && value !== void 0) { if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected."); var dispose, inner; if (async) { if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); dispose = value[Symbol.asyncDispose]; } if (dispose === void 0) { if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); dispose = value[Symbol.dispose]; if (async) inner = dispose; } if (typeof dispose !== "function") throw new TypeError("Object not disposable."); if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } }; env.stack.push({ value: value, dispose: dispose, async: async }); } else if (async) { env.stack.push({ async: true }); } return value; } var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { var e = new Error(message); return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; export function __disposeResources(env) { function fail(e) { env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e; env.hasError = true; } var r, s = 0; function next() { while (r = env.stack.pop()) { try { if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next); if (r.dispose) { var result = r.dispose.call(r.value); if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); } else s |= 1; } catch (e) { fail(e); } } if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve(); if (env.hasError) throw env.error; } return next(); } export function __rewriteRelativeImportExtension(path, preserveJsx) { if (typeof path === "string" && /^\.\.?\//.test(path)) { return path.replace(/\.(tsx)$|((?:\.d)?)((?:\.[^./]+?)?)\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) { return tsx ? preserveJsx ? ".jsx" : ".js" : d && (!ext || !cm) ? m : (d + ext + "." + cm.toLowerCase() + "js"); }); } return path; } export default { __extends: __extends, __assign: __assign, __rest: __rest, __decorate: __decorate, __param: __param, __esDecorate: __esDecorate, __runInitializers: __runInitializers, __propKey: __propKey, __setFunctionName: __setFunctionName, __metadata: __metadata, __awaiter: __awaiter, __generator: __generator, __createBinding: __createBinding, __exportStar: __exportStar, __values: __values, __read: __read, __spread: __spread, __spreadArrays: __spreadArrays, __spreadArray: __spreadArray, __await: __await, __asyncGenerator: __asyncGenerator, __asyncDelegator: __asyncDelegator, __asyncValues: __asyncValues, __makeTemplateObject: __makeTemplateObject, __importStar: __importStar, __importDefault: __importDefault, __classPrivateFieldGet: __classPrivateFieldGet, __classPrivateFieldSet: __classPrivateFieldSet, __classPrivateFieldIn: __classPrivateFieldIn, __addDisposableResource: __addDisposableResource, __disposeResources: __disposeResources, __rewriteRelativeImportExtension: __rewriteRelativeImportExtension, }; nyݰxD/****************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */ /* global Reflect, Promise, SuppressedError, Symbol, Iterator */ var extendStatics = function(d, b) { extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; return extendStatics(d, b); }; export function __extends(d, b) { if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); } export var __assign = function() { __assign = Object.assign || function __assign(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; } return __assign.apply(this, arguments); } export function __rest(s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; } export function __decorate(decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; } export function __param(paramIndex, decorator) { return function (target, key) { decorator(target, key, paramIndex); } } export function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) { function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; } var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value"; var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null; var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {}); var _, done = false; for (var i = decorators.length - 1; i >= 0; i--) { var context = {}; for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p]; for (var p in contextIn.access) context.access[p] = contextIn.access[p]; context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); }; var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context); if (kind === "accessor") { if (result === void 0) continue; if (result === null || typeof result !== "object") throw new TypeError("Object expected"); if (_ = accept(result.get)) descriptor.get = _; if (_ = accept(result.set)) descriptor.set = _; if (_ = accept(result.init)) initializers.unshift(_); } else if (_ = accept(result)) { if (kind === "field") initializers.unshift(_); else descriptor[key] = _; } } if (target) Object.defineProperty(target, contextIn.name, descriptor); done = true; }; export function __runInitializers(thisArg, initializers, value) { var useValue = arguments.length > 2; for (var i = 0; i < initializers.length; i++) { value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg); } return useValue ? value : void 0; }; export function __propKey(x) { return typeof x === "symbol" ? x : "".concat(x); }; export function __setFunctionName(f, name, prefix) { if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : ""; return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name }); }; export function __metadata(metadataKey, metadataValue) { if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue); } export function __awaiter(thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); } export function __generator(thisArg, body) { var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype); return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); while (g && (g = 0, op[0] && (_ = 0)), _) try { if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; if (y = 0, t) op = [op[0] & 2, t.value]; switch (op[0]) { case 0: case 1: t = op; break; case 4: _.label++; return { value: op[1], done: false }; case 5: _.label++; y = op[1]; op = [0]; continue; case 7: op = _.ops.pop(); _.trys.pop(); continue; default: if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } if (t[2]) _.ops.pop(); _.trys.pop(); continue; } op = body.call(thisArg, _); } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; } } export var __createBinding = Object.create ? (function(o, m, k, k2) { if (k2 === undefined) k2 = k; var desc = Object.getOwnPropertyDescriptor(m, k); if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { desc = { enumerable: true, get: function() { return m[k]; } }; } Object.defineProperty(o, k2, desc); }) : (function(o, m, k, k2) { if (k2 === undefined) k2 = k; o[k2] = m[k]; }); export function __exportStar(m, o) { for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p); } export function __values(o) { var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; if (m) return m.call(o); if (o && typeof o.length === "number") return { next: function () { if (o && i >= o.length) o = void 0; return { value: o && o[i++], done: !o }; } }; throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); } export function __read(o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; } /** @deprecated */ export function __spread() { for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); return ar; } /** @deprecated */ export function __spreadArrays() { for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; return r; } export function __spreadArray(to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); } export function __await(v) { return this instanceof __await ? (this.v = v, this) : new __await(v); } export function __asyncGenerator(thisArg, _arguments, generator) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var g = generator.apply(thisArg, _arguments || []), i, q = []; return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i; function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; } function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } } function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } } function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); } function fulfill(value) { resume("next", value); } function reject(value) { resume("throw", value); } function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); } } export function __asyncDelegator(o) { var i, p; return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i; function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; } } export function __asyncValues(o) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var m = o[Symbol.asyncIterator], i; return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i); function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; } function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); } } export function __makeTemplateObject(cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; }; var __setModuleDefault = Object.create ? (function(o, v) { Object.defineProperty(o, "default", { enumerable: true, value: v }); }) : function(o, v) { o["default"] = v; }; var ownKeys = function(o) { ownKeys = Object.getOwnPropertyNames || function (o) { var ar = []; for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k; return ar; }; return ownKeys(o); }; export function __importStar(mod) { if (mod && mod.__esModule) return mod; var result = {}; if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]); __setModuleDefault(result, mod); return result; } export function __importDefault(mod) { return (mod && mod.__esModule) ? mod : { default: mod }; } export function __classPrivateFieldGet(receiver, state, kind, f) { if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it"); return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver); } export function __classPrivateFieldSet(receiver, state, value, kind, f) { if (kind === "m") throw new TypeError("Private method is not writable"); if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value; } export function __classPrivateFieldIn(state, receiver) { if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object"); return typeof state === "function" ? receiver === state : state.has(receiver); } export function __addDisposableResource(env, value, async) { if (value !== null && value !== void 0) { if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected."); var dispose, inner; if (async) { if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); dispose = value[Symbol.asyncDispose]; } if (dispose === void 0) { if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); dispose = value[Symbol.dispose]; if (async) inner = dispose; } if (typeof dispose !== "function") throw new TypeError("Object not disposable."); if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } }; env.stack.push({ value: value, dispose: dispose, async: async }); } else if (async) { env.stack.push({ async: true }); } return value; } var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { var e = new Error(message); return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; export function __disposeResources(env) { function fail(e) { env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e; env.hasError = true; } var r, s = 0; function next() { while (r = env.stack.pop()) { try { if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next); if (r.dispose) { var result = r.dispose.call(r.value); if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); } else s |= 1; } catch (e) { fail(e); } } if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve(); if (env.hasError) throw env.error; } return next(); } export function __rewriteRelativeImportExtension(path, preserveJsx) { if (typeof path === "string" && /^\.\.?\//.test(path)) { return path.replace(/\.(tsx)$|((?:\.d)?)((?:\.[^./]+?)?)\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) { return tsx ? preserveJsx ? ".jsx" : ".js" : d && (!ext || !cm) ? m : (d + ext + "." + cm.toLowerCase() + "js"); }); } return path; } export default { __extends, __assign, __rest, __decorate, __param, __esDecorate, __runInitializers, __propKey, __setFunctionName, __metadata, __awaiter, __generator, __createBinding, __exportStar, __values, __read, __spread, __spreadArrays, __spreadArray, __await, __asyncGenerator, __asyncDelegator, __asyncValues, __makeTemplateObject, __importStar, __importDefault, __classPrivateFieldGet, __classPrivateFieldSet, __classPrivateFieldIn, __addDisposableResource, __disposeResources, __rewriteRelativeImportExtension, }; ˺x - ` xV[/****************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */ /* global global, define, Symbol, Reflect, Promise, SuppressedError, Iterator */ var __extends; var __assign; var __rest; var __decorate; var __param; var __esDecorate; var __runInitializers; var __propKey; var __setFunctionName; var __metadata; var __awaiter; var __generator; var __exportStar; var __values; var __read; var __spread; var __spreadArrays; var __spreadArray; var __await; var __asyncGenerator; var __asyncDelegator; var __asyncValues; var __makeTemplateObject; var __importStar; var __importDefault; var __classPrivateFieldGet; var __classPrivateFieldSet; var __classPrivateFieldIn; var __createBinding; var __addDisposableResource; var __disposeResources; var __rewriteRelativeImportExtension; (function (factory) { var root = typeof global === "object" ? global : typeof self === "object" ? self : typeof this === "object" ? this : {}; if (typeof define === "function" && define.amd) { define("tslib", ["exports"], function (exports) { factory(createExporter(root, createExporter(exports))); }); } else if (typeof module === "object" && typeof module.exports === "object") { factory(createExporter(root, createExporter(module.exports))); } else { factory(createExporter(root)); } function createExporter(exports, previous) { if (exports !== root) { if (typeof Object.create === "function") { Object.defineProperty(exports, "__esModule", { value: true }); } else { exports.__esModule = true; } } return function (id, v) { return exports[id] = previous ? previous(id, v) : v; }; } }) (function (exporter) { var extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; __extends = function (d, b) { if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; __assign = Object.assign || function (t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; __rest = function (s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; }; __decorate = function (decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; }; __param = function (paramIndex, decorator) { return function (target, key) { decorator(target, key, paramIndex); } }; __esDecorate = function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) { function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; } var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value"; var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null; var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {}); var _, done = false; for (var i = decorators.length - 1; i >= 0; i--) { var context = {}; for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p]; for (var p in contextIn.access) context.access[p] = contextIn.access[p]; context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); }; var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context); if (kind === "accessor") { if (result === void 0) continue; if (result === null || typeof result !== "object") throw new TypeError("Object expected"); if (_ = accept(result.get)) descriptor.get = _; if (_ = accept(result.set)) descriptor.set = _; if (_ = accept(result.init)) initializers.unshift(_); } else if (_ = accept(result)) { if (kind === "field") initializers.unshift(_); else descriptor[key] = _; } } if (target) Object.defineProperty(target, contextIn.name, descriptor); done = true; }; __runInitializers = function (thisArg, initializers, value) { var useValue = arguments.length > 2; for (var i = 0; i < initializers.length; i++) { value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg); } return useValue ? value : void 0; }; __propKey = function (x) { return typeof x === "symbol" ? x : "".concat(x); }; __setFunctionName = function (f, name, prefix) { if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : ""; return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name }); }; __metadata = function (metadataKey, metadataValue) { if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue); }; __awaiter = function (thisArg, _arguments, P, generator) { function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } return new (P || (P = Promise))(function (resolve, reject) { function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } step((generator = generator.apply(thisArg, _arguments || [])).next()); }); }; __generator = function (thisArg, body) { var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype); return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; function verb(n) { return function (v) { return step([n, v]); }; } function step(op) { if (f) throw new TypeError("Generator is already executing."); while (g && (g = 0, op[0] && (_ = 0)), _) try { if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; if (y = 0, t) op = [op[0] & 2, t.value]; switch (op[0]) { case 0: case 1: t = op; break; case 4: _.label++; return { value: op[1], done: false }; case 5: _.label++; y = op[1]; op = [0]; continue; case 7: op = _.ops.pop(); _.trys.pop(); continue; default: if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } if (t[2]) _.ops.pop(); _.trys.pop(); continue; } op = body.call(thisArg, _); } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; } }; __exportStar = function(m, o) { for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p); }; __createBinding = Object.create ? (function(o, m, k, k2) { if (k2 === undefined) k2 = k; var desc = Object.getOwnPropertyDescriptor(m, k); if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) { desc = { enumerable: true, get: function() { return m[k]; } }; } Object.defineProperty(o, k2, desc); }) : (function(o, m, k, k2) { if (k2 === undefined) k2 = k; o[k2] = m[k]; }); __values = function (o) { var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0; if (m) return m.call(o); if (o && typeof o.length === "number") return { next: function () { if (o && i >= o.length) o = void 0; return { value: o && o[i++], done: !o }; } }; throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined."); }; __read = function (o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; }; /** @deprecated */ __spread = function () { for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); return ar; }; /** @deprecated */ __spreadArrays = function () { for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; for (var r = Array(s), k = 0, i = 0; i < il; i++) for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) r[k] = a[j]; return r; }; __spreadArray = function (to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); }; __await = function (v) { return this instanceof __await ? (this.v = v, this) : new __await(v); }; __asyncGenerator = function (thisArg, _arguments, generator) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var g = generator.apply(thisArg, _arguments || []), i, q = []; return i = Object.create((typeof AsyncIterator === "function" ? AsyncIterator : Object).prototype), verb("next"), verb("throw"), verb("return", awaitReturn), i[Symbol.asyncIterator] = function () { return this; }, i; function awaitReturn(f) { return function (v) { return Promise.resolve(v).then(f, reject); }; } function verb(n, f) { if (g[n]) { i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; if (f) i[n] = f(i[n]); } } function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } } function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); } function fulfill(value) { resume("next", value); } function reject(value) { resume("throw", value); } function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); } }; __asyncDelegator = function (o) { var i, p; return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i; function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; } }; __asyncValues = function (o) { if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined."); var m = o[Symbol.asyncIterator], i; return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i); function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; } function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); } }; __makeTemplateObject = function (cooked, raw) { if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; } return cooked; }; var __setModuleDefault = Object.create ? (function(o, v) { Object.defineProperty(o, "default", { enumerable: true, value: v }); }) : function(o, v) { o["default"] = v; }; var ownKeys = function(o) { ownKeys = Object.getOwnPropertyNames || function (o) { var ar = []; for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k; return ar; }; return ownKeys(o); }; __importStar = function (mod) { if (mod && mod.__esModule) return mod; var result = {}; if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]); __setModuleDefault(result, mod); return result; }; __importDefault = function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; __classPrivateFieldGet = function (receiver, state, kind, f) { if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it"); return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver); }; __classPrivateFieldSet = function (receiver, state, value, kind, f) { if (kind === "m") throw new TypeError("Private method is not writable"); if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter"); if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it"); return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value; }; __classPrivateFieldIn = function (state, receiver) { if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object"); return typeof state === "function" ? receiver === state : state.has(receiver); }; __addDisposableResource = function (env, value, async) { if (value !== null && value !== void 0) { if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected."); var dispose, inner; if (async) { if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined."); dispose = value[Symbol.asyncDispose]; } if (dispose === void 0) { if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined."); dispose = value[Symbol.dispose]; if (async) inner = dispose; } if (typeof dispose !== "function") throw new TypeError("Object not disposable."); if (inner) dispose = function() { try { inner.call(this); } catch (e) { return Promise.reject(e); } }; env.stack.push({ value: value, dispose: dispose, async: async }); } else if (async) { env.stack.push({ async: true }); } return value; }; var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { var e = new Error(message); return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; __disposeResources = function (env) { function fail(e) { env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e; env.hasError = true; } var r, s = 0; function next() { while (r = env.stack.pop()) { try { if (!r.async && s === 1) return s = 0, env.stack.push(r), Promise.resolve().then(next); if (r.dispose) { var result = r.dispose.call(r.value); if (r.async) return s |= 2, Promise.resolve(result).then(next, function(e) { fail(e); return next(); }); } else s |= 1; } catch (e) { fail(e); } } if (s === 1) return env.hasError ? Promise.reject(env.error) : Promise.resolve(); if (env.hasError) throw env.error; } return next(); }; __rewriteRelativeImportExtension = function (path, preserveJsx) { if (typeof path === "string" && /^\.\.?\//.test(path)) { return path.replace(/\.(tsx)$|((?:\.d)?)((?:\.[^./]+?)?)\.([cm]?)ts$/i, function (m, tsx, d, ext, cm) { return tsx ? preserveJsx ? ".jsx" : ".js" : d && (!ext || !cm) ? m : (d + ext + "." + cm.toLowerCase() + "js"); }); } return path; }; exporter("__extends", __extends); exporter("__assign", __assign); exporter("__rest", __rest); exporter("__decorate", __decorate); exporter("__param", __param); exporter("__esDecorate", __esDecorate); exporter("__runInitializers", __runInitializers); exporter("__propKey", __propKey); exporter("__setFunctionName", __setFunctionName); exporter("__metadata", __metadata); exporter("__awaiter", __awaiter); exporter("__generator", __generator); exporter("__exportStar", __exportStar); exporter("__createBinding", __createBinding); exporter("__values", __values); exporter("__read", __read); exporter("__spread", __spread); exporter("__spreadArrays", __spreadArrays); exporter("__spreadArray", __spreadArray); exporter("__await", __await); exporter("__asyncGenerator", __asyncGenerator); exporter("__asyncDelegator", __asyncDelegator); exporter("__asyncValues", __asyncValues); exporter("__makeTemplateObject", __makeTemplateObject); exporter("__importStar", __importStar); exporter("__importDefault", __importDefault); exporter("__classPrivateFieldGet", __classPrivateFieldGet); exporter("__classPrivateFieldSet", __classPrivateFieldSet); exporter("__classPrivateFieldIn", __classPrivateFieldIn); exporter("__addDisposableResource", __addDisposableResource); exporter("__disposeResources", __disposeResources); exporter("__rewriteRelativeImportExtension", __rewriteRelativeImportExtension); }); 0 && (module.exports = { __extends: __extends, __assign: __assign, __rest: __rest, __decorate: __decorate, __param: __param, __esDecorate: __esDecorate, __runInitializers: __runInitializers, __propKey: __propKey, __setFunctionName: __setFunctionName, __metadata: __metadata, __awaiter: __awaiter, __generator: __generator, __exportStar: __exportStar, __createBinding: __createBinding, __values: __values, __read: __read, __spread: __spread, __spreadArrays: __spreadArrays, __spreadArray: __spreadArray, __await: __await, __asyncGenerator: __asyncGenerator, __asyncDelegator: __asyncDelegator, __asyncValues: __asyncValues, __makeTemplateObject: __makeTemplateObject, __importStar: __importStar, __importDefault: __importDefault, __classPrivateFieldGet: __classPrivateFieldGet, __classPrivateFieldSet: __classPrivateFieldSet, __classPrivateFieldIn: __classPrivateFieldIn, __addDisposableResource: __addDisposableResource, __disposeResources: __disposeResources, __rewriteRelativeImportExtension: __rewriteRelativeImportExtension, }); R:x## [0.15.1](https://github.com/angular/angular/compare/zone.js-0.15.0...zone.js-0.15.1) (2025-05-22) ### Bug Fixes * **zone.js:** classes that extend Error should retain cause property ([#61599](https://github.com/angular/angular/issues/61599)) ([ad8931c](https://github.com/angular/angular/commit/ad8931cb4968b2bd25b05dcd3d856ec32e4d7145)) * **zone.js:** more robust check for promise-like objects ([#57388](https://github.com/angular/angular/issues/57388)) ([e608e6c](https://github.com/angular/angular/commit/e608e6cfbbc9fba7c74bfef72f102a502e951e6c)), closes [#57385](https://github.com/angular/angular/issues/57385) * **zone.js:** remove `abort` listener once fetch is settled ([#57882](https://github.com/angular/angular/issues/57882)) ([6976349](https://github.com/angular/angular/commit/69763491c3ffb576822b179af3363ec666d43bce)) # [0.15.0](https://github.com/angular/angular/compare/zone.js-0.14.10...zone.js-0.15.0) (2024-08-15) ### Bug Fixes * **zone.js:** Add support for addition jest functions. ([#57280](https://github.com/angular/angular/issues/57280)) ([e1240c6](https://github.com/angular/angular/commit/e1240c6f5d9a3d68ccef7ffbf0a0646ad1164cd8)), closes [#57277](https://github.com/angular/angular/issues/57277) * **zone.js:** Update the default behavior of fakeAsync to flush after the test ([#57240](https://github.com/angular/angular/issues/57240)) ([70e8b40](https://github.com/angular/angular/commit/70e8b40750e894bc1439713cd508d8bd9fafb7a4)) ### BREAKING CHANGES * **zone.js:** `fakeAsync` will now flush pending timers at the end of the given function by default. To opt-out of this, you can use `{flush: false}` in options parameter of `fakeAsync` ## [0.14.10](https://github.com/angular/angular/compare/zone.js-0.14.8...zone.js-0.14.10) (2024-08-05) ### Features * **zone.js:** Add 'flush' parameter option to fakeAsync to flush after the test ([#57137](https://github.com/angular/angular/issues/57137)) ([99d679d](https://github.com/angular/angular/commit/99d679d6061d731a04930824e92f247bb94f21e7)) ## [0.14.8](https://github.com/angular/angular/compare/zone.js-0.14.7...zone.js-0.14.8) (2024-07-17) ### Bug Fixes * **zone.js:** allow enabling default `beforeunload` handling ([#55875](https://github.com/angular/angular/issues/55875)) ([b8d5882](https://github.com/angular/angular/commit/b8d5882127a6e9944d30a7e0c87c2e2c59b352e6)), closes [#47579](https://github.com/angular/angular/issues/47579) * **zone.js:** support `Timeout.refresh` in Node.js ([#56852](https://github.com/angular/angular/issues/56852)) ([982f1b1](https://github.com/angular/angular/commit/982f1b125147e4292716f9524bef75423b70c71c)), closes [#56586](https://github.com/angular/angular/issues/56586) ## [0.14.7](https://github.com/angular/angular/compare/zone.js-0.14.6...zone.js-0.14.7) (2024-06-06) ### Bug Fixes * **zone.js:** do not mutate event listener options (may be readonly) ([#55796](https://github.com/angular/angular/issues/55796)) ([85c1719](https://github.com/angular/angular/commit/85c171920ae2b1861896fa6c2d5d7dc8f030a445)), closes [#54142](https://github.com/angular/angular/issues/54142) * **zone.js:** store remove abort listener on the scheduled task ([#56160](https://github.com/angular/angular/issues/56160)) ([4a3800a](https://github.com/angular/angular/commit/4a3800a6a0ae9d667dd961c6e4029c01c6819988)), closes [#56148](https://github.com/angular/angular/issues/56148) ## [0.14.6](https://github.com/angular/angular/compare/zone.js-0.14.4...zone.js-0.14.6) (2024-05-16) ### Bug Fixes * **zone.js:** add missing APIs to Node.js `fs` patch ([#54396](https://github.com/angular/angular/issues/54396)) ([9e07b62](https://github.com/angular/angular/commit/9e07b621ead050d27d36cde0549b01ac3f1e9e73)) * **zone.js:** correctly bundle `zone-patch-rxjs` ([#55826](https://github.com/angular/angular/issues/55826)) ([20a530a](https://github.com/angular/angular/commit/20a530acb6ca6efe73cb97c64e9d23a0f5d912c8)), closes [#55825](https://github.com/angular/angular/issues/55825) * **zone.js:** remove `abort` listener on a signal when actual event is removed ([#55339](https://github.com/angular/angular/issues/55339)) ([a9460d0](https://github.com/angular/angular/commit/a9460d08a0e95dcd8fcd0ea7eca8470af921bfe2)), closes [#54739](https://github.com/angular/angular/issues/54739) ## [0.14.5](https://github.com/angular/angular/compare/zone.js-0.14.4...zone.js-0.14.5) (2024-04-30) ### Bug Fixes * **zone.js:** Add 'declare' to each interface to prevent renaming ([#54966](https://github.com/angular/angular/issues/54966)) ([b3d045b](https://github.com/angular/angular/commit/b3d045b9a4383d97ea3c5d770d9413ffed35d760)) * **zone.js:** make sure fakeasync use the same id pool with native ([#54600](https://github.com/angular/angular/issues/54600)) ([ddbf6bb](https://github.com/angular/angular/commit/ddbf6bb038d101daf5280abbd2a0efaa0b7fd3a0)), closes [#54323](https://github.com/angular/angular/issues/54323) * **zone.js:** should not clear onhandler when remove capture listener ([#54602](https://github.com/angular/angular/issues/54602)) ([e44b077](https://github.com/angular/angular/commit/e44b077cbd4fc1ac16b3edd0fea758842ce6e29f)), closes [#54581](https://github.com/angular/angular/issues/54581) ## [0.14.4](https://github.com/angular/angular/compare/zone.js-0.14.3...zone.js-0.14.4) (2024-02-13) ### Bug Fixes * **zone.js:** add `__Zone_ignore_on_properties` to `ZoneGlobalConfigurations` ([#50737](https://github.com/angular/angular/issues/50737)) ([f87f058](https://github.com/angular/angular/commit/f87f058a69443d9427530c979b39e3630190a7fd)) * **zone.js:** patch `fs.realpath.native` as macrotask ([#54208](https://github.com/angular/angular/issues/54208)) ([19fae76](https://github.com/angular/angular/commit/19fae76bada7146e8993fb672b8d321fb08967f2)), closes [#45546](https://github.com/angular/angular/issues/45546) * **zone.js:** patch `Response` methods returned by `fetch` ([#50653](https://github.com/angular/angular/issues/50653)) ([260d3ed](https://github.com/angular/angular/commit/260d3ed0d91648d3ba75d7d9896f38195093c7e4)), closes [#50327](https://github.com/angular/angular/issues/50327) * **zone.js:** patch form-associated custom element callbacks ([#50686](https://github.com/angular/angular/issues/50686)) ([1c990cd](https://github.com/angular/angular/commit/1c990cdb2962fa879762d5e26f87f547a00e1795)) ## [0.14.3](https://github.com/angular/angular/compare/zone.js-0.14.2...zone.js-0.14.3) (2023-12-19) ### Bug Fixes * **zone.js:** handle fetch with AbortSignal ([#49595](https://github.com/angular/angular/issues/49595)) ([b06b24b](https://github.com/angular/angular/commit/b06b24b5049c07fbc18c76fd2a10e49fc93870be)) * **zone.js:** Promise.resolve(subPromise) should return subPromise ([#53423](https://github.com/angular/angular/issues/53423)) ([08b0c87](https://github.com/angular/angular/commit/08b0c87a948007e086a2c5a5c17ccca5fd7a24c4)), closes [/promisesaplus.com/#point-51](https://github.com//promisesaplus.com//issues/point-51) * **zone.js:** support addEventListener with signal option. ([#49595](https://github.com/angular/angular/issues/49595)) ([d4973ff](https://github.com/angular/angular/commit/d4973ff9b074f4db918f71163e79b7d112c309f5)), closes [#49591](https://github.com/angular/angular/issues/49591) ### Features * **zone.js:** implement Promise.withResolvers() ([#53514](https://github.com/angular/angular/issues/53514)) ([7a28f50](https://github.com/angular/angular/commit/7a28f50711535fcc285c7ee9021e8e7dc34a655d)) ## [0.14.2](https://github.com/angular/angular/compare/zone.js-0.14.1...zone.js-0.14.2) (2023-11-03) ### Bug Fixes * **zone.js:** disable wrapping unhandled promise error by default ([6d7eb35](https://github.com/angular/angular/commit/6d7eb3548c5fc3aedb4a52ff2010141343748e90)) ## [14.0.1](https://github.com/angular/angular/compare/zone.js-0.14.0...zone.js-14.0.1) (2023-10-25) ### Bug Fixes * **zone.js:** use `globalThis` instead of `global` and `window` ([#52367](https://github.com/angular/angular/issues/52367)) ([def719e](https://github.com/angular/angular/commit/def719e2cac50bbf1cda4a2c4bf96de2d4ba4bfd)) # [0.14.0](https://github.com/angular/angular/compare/zone.js-0.13.3...zone.js-0.14.0) (2023-09-14) ### Features * **zone.js:** remove legacy files and access to deep imports ([#51752](https://github.com/angular/angular/issues/51752)) ([a8efc60](https://github.com/angular/angular/commit/a8efc605ea9c3cf03d85b5c567218202e304fef9)) ### BREAKING CHANGES * **zone.js:** Deep and legacy `dist/` imports like `zone.js/bundles/zone-testing.js` and `zone.js/dist/zone` are no longer allowed. `zone-testing-bundle` and `zone-testing-node-bundle` are also no longer part of the package. The proper way to import `zone.js` and `zone.js/testing` is: ```js import 'zone.js'; import 'zone.js/testing'; ``` ## [0.13.3](https://github.com/angular/angular/compare/zone.js-0.13.2...zone.js-0.13.3) (2023-09-12) ### Bug Fixes * **zone.js:** rename `typings` conditional export to `types` ([#51737](https://github.com/angular/angular/issues/51737)) ([74755c4](https://github.com/angular/angular/commit/74755c4b5e6d4d62d2c81f35e6152bb8649fbb5c)) * **zone.js:** temporary allow deep imports ([#51737](https://github.com/angular/angular/issues/51737)) ([e86d6db](https://github.com/angular/angular/commit/e86d6dba27997cb2cad13c43ac5e94eeb7a67725)) ## [0.13.2](https://github.com/angular/angular/compare/zone.js-0.13.1...zone.js-0.13.2) (2023-09-07) ### Bug Fixes * **zone.js:** add conditional exports to zone.js package ([#51652](https://github.com/angular/angular/issues/51652)) ([4798ec4](https://github.com/angular/angular/commit/4798ec41668d47fd5e1504c61d96d5e56dcff345)) ## [v0.13.1](https://github.com/angular/angular/compare/zone.js-0.13.0...zone.js-v0.13.1) (2023-06-09) ### Bug Fixes * **zone.js:** enable monkey patching of the `queueMicrotask()` API in node.js ([#50467](https://github.com/angular/angular/issues/50467)) ([381cb98](https://github.com/angular/angular/commit/381cb982264d30e8c79e77e9186acd6da006e718)) * **zone.js:** enable monkey patching of the `queueMicrotask()` API in node.js ([#50530](https://github.com/angular/angular/issues/50530)) ([7837f71](https://github.com/angular/angular/commit/7837f7119f8cdfb0ae95551f48608f156985113a)) * **zone.js:** patch entire promise in node ([#50552](https://github.com/angular/angular/issues/50552)) ([cb31dbc](https://github.com/angular/angular/commit/cb31dbc75ca4141d61cec3ba6e60505198208a0a)), closes [#50513](https://github.com/angular/angular/issues/50513) [#50457](https://github.com/angular/angular/issues/50457) [#50414](https://github.com/angular/angular/issues/50414) [#49930](https://github.com/angular/angular/issues/49930) * **zone.js:** revert Mocha it.skip, describe.skip method patch ([#49329](https://github.com/angular/angular/issues/49329)) ([5a2b622](https://github.com/angular/angular/commit/5a2b6227b30a4d3f2090077e8881c753db00798c)) ### Features * **zone.js:** jest 29 should ignore uncaught error console log ([#49325](https://github.com/angular/angular/issues/49325)) ([bc412fd](https://github.com/angular/angular/commit/bc412fd537f965b20dce69232ef66f152962dc06)), closes [#49110](https://github.com/angular/angular/issues/49110) ### Reverts * Revert "fix(zone.js): enable monkey patching of the `queueMicrotask()` API in node.js (#50467)" (#50529) ([7567348](https://github.com/angular/angular/commit/7567348c54917b2f881d6c68d45f7c15d101954b)), closes [#50467](https://github.com/angular/angular/issues/50467) [#50529](https://github.com/angular/angular/issues/50529) [#50529](https://github.com/angular/angular/issues/50529) # [0.13](https://github.com/angular/angular/compare/zone.js-0.12.0...zone.js-0.13) (2023-02-28) ### Bug Fixes - **zone.js:** cancel tasks only when they are scheduled or running ([#46435](https://github.com/angular/angular/issues/46435)) ([b618b5a](https://github.com/angular/angular/commit/b618b5aa86138c900055c5496967e3348a7b98fc)), closes [#45711](https://github.com/angular/angular/issues/45711) - **zone.js:** Fix ConsoleTask interface typo ([#47090](https://github.com/angular/angular/issues/47090)) ([91954cf](https://github.com/angular/angular/commit/91954cf20e17a386d71cc8ea25d1d17b9ae1e31c)) - **zone.js:** zone-node only patch Promise.prototype.then ([#49144](https://github.com/angular/angular/issues/49144)) ([d1ac3aa](https://github.com/angular/angular/commit/d1ac3aa14e5d3c5415937199a6fb63437ddee0b8)), closes [#47872](https://github.com/angular/angular/issues/47872) # [0.12.0](https://github.com/angular/angular/compare/zone.js-0.11.8...zone.js-0.12.0) (2022-10-27) ### Bug Fixes - **zone.js:** cancel tasks only when they are scheduled or running ([#46435](https://github.com/angular/angular/issues/46435)) ([b618b5a](https://github.com/angular/angular/commit/b618b5aa86138c900055c5496967e3348a7b98fc)), closes [#45711](https://github.com/angular/angular/issues/45711) - **zone.js:** Fix ConsoleTask interface typo ([#47090](https://github.com/angular/angular/issues/47090)) ([91954cf](https://github.com/angular/angular/commit/91954cf20e17a386d71cc8ea25d1d17b9ae1e31c)) ## [0.11.8](https://github.com/angular/angular/compare/zone.js-0.11.7...zone.js-0.11.8) (2022-08-08) ### Features - **zone.js:** Update to the simpler Async Stack Tagging v2 API ([#46958](https://github.com/angular/angular/issues/46958)) ([f23232f](https://github.com/angular/angular/commit/f23232ff66559ddc28aec26d461355568c25530d)) ## [0.11.7](https://github.com/angular/angular/compare/zone.js-0.11.6...zone.js-0.11.7) (2022-07-20) ### Bug Fixes - **zone.js:** do not invoke jasmine done callback multiple times with `waitForAsync` ([4e77c7fbf38](https://github.com/angular/angular/commit/4e77c7fbf38f27741617303165068e1cb1ef6354)) ### Features - **zone.js:** add AsyncStackTaggingZoneSpec implementation ([#46693](https://github.com/angular/angular/issues/46693)) ([848a009](https://github.com/angular/angular/commit/848a00956e693ba8ab648c86cca034ed2e3c807c)) - **zone.js:** include jasmine `describe` block name when raising unexpected task error ([de86285](https://github.com/angular/angular/commit/de86285f2ee1c3a78489c8c40a15fc78f75e2620)) - **zone.js:** include zone name when sync-test zone reports tasks ([72c2567](https://github.com/angular/angular/commit/72c2567847c37b07e468a501a4b13edc791ae9ed)) ## [0.11.6](https://github.com/angular/angular/compare/zone.js-0.11.5...zone.js-0.11.6) (2022-06-02) ### Bug Fixes - **zone.js:** check if `process` is defined when patching the `GlobalErrors.install` ([#45392](https://github.com/angular/angular/issues/45392)) ([c7bcc1b](https://github.com/angular/angular/commit/c7bcc1b50182e5378756aa4528a24075b5be026e)), closes [#42260](https://github.com/angular/angular/issues/42260) - **zone.js:** in TaskTrackingZoneSpec track a periodic task until it is cancelled ([#45391](https://github.com/angular/angular/issues/45391)) ([f19b36f](https://github.com/angular/angular/commit/f19b36f462803b3b3b9410391c039649541b10bc)) - **zone.js:** read `Symbol.species` safely ([#45369](https://github.com/angular/angular/issues/45369)) ([e2eaac3](https://github.com/angular/angular/commit/e2eaac34b06a558145be41853f1d3585c1108880)) - **zone.js:** should ignore multiple resolve call ([#45283](https://github.com/angular/angular/issues/45283)) ([aebf165](https://github.com/angular/angular/commit/aebf165359ad6de5a8bacd9cb91651fc4175aaad)), closes [#44913](https://github.com/angular/angular/issues/44913) - **zone.js:** swallow the error when the element callback is not patchable ([#45400](https://github.com/angular/angular/issues/45400)) ([4ea70e3](https://github.com/angular/angular/commit/4ea70e36b998208302183f78088637f3de86323d)), closes [lwc/engine-core/src/framework/base-bridge-element.ts#L180-L186](https://github.com/lwc/engine-core/src/framework/base-bridge-element.ts/issues/L180-L186) [#42546](https://github.com/angular/angular/issues/42546) ### BREAKING CHANGES - **zone.js:** in TaskTrackingZoneSpec track a periodic task until it is cancelled The breaking change is scoped only to the plugin `zone.js/plugins/task-tracking`. If you used `TaskTrackingZoneSpec` and checked the pending macroTasks e.g. using `(this.ngZone as any)._inner ._parent._properties.TaskTrackingZone.getTasksFor('macroTask')`, then its behavior slightly changed for periodic macrotasks. For example, previously the `setInterval` macrotask was no longer tracked after its callback was executed for the first time. Now it's tracked until the task is explicitly cancelled, e.g with `clearInterval(id)`. ## [0.11.5](https://github.com/angular/angular/compare/zone.js-0.11.4...zone.js-0.11.5) (2022-03-03) ### Bug Fixes - **zone.js:** async-test should only call done once ([#45025](https://github.com/angular/angular/issues/45025)) ([dea7234](https://github.com/angular/angular/commit/dea7234a76f652c8e9d9b79719e2b170a5a50777)) - **zone.js:** defineProperties should also set symbol props ([#45098](https://github.com/angular/angular/issues/45098)) ([b437d12](https://github.com/angular/angular/commit/b437d1238d9006baa0cf749adbd7cc3270de3040)), closes [#44095](https://github.com/angular/angular/issues/44095) - **zone.js:** fix several test cases which trigger `done()` multiple times ([#45025](https://github.com/angular/angular/issues/45025)) ([d5565cc](https://github.com/angular/angular/commit/d5565ccdb4573a47eb329b09c6852c1ae39672a6)) - **zone.js:** only one listener should also re-throw an error correctly ([#41868](https://github.com/angular/angular/issues/41868)) ([299f92c](https://github.com/angular/angular/commit/299f92c3b62a43c94cff4a204f9e41c46a159efc)), closes [#41867](https://github.com/angular/angular/issues/41867) [/github.com/angular/angular/pull/41562#issuecomment-822696973](https://github.com//github.com/angular/angular/pull/41562/issues/issuecomment-822696973) - **zone.js:** patch global instead of Mocha object ([#45047](https://github.com/angular/angular/issues/45047)) ([8efbdb5](https://github.com/angular/angular/commit/8efbdb57c11a6c632f69d7e142a632b6a853fa46)), closes [#42834](https://github.com/angular/angular/issues/42834) - **zone.js:** should continue to execute listeners when throw error ([#41562](https://github.com/angular/angular/issues/41562)) ([008eaf3](https://github.com/angular/angular/commit/008eaf3b7df90b2cdd9c83e229d23d4014d6dbc9)), closes [#41522](https://github.com/angular/angular/issues/41522) - **zone.js:** update several flaky cases ([#41526](https://github.com/angular/angular/issues/41526)) ([25a83eb](https://github.com/angular/angular/commit/25a83eb264aa19fc4616cea45e04d790b9bcd777)), closes [#41434](https://github.com/angular/angular/issues/41434) ### Features - **zone.js:** add Promise.any() implementation ([#45064](https://github.com/angular/angular/issues/45064)) ([4d494d2](https://github.com/angular/angular/commit/4d494d24ccb69b40a477b0bccd97baf6af66accf)), closes [#44393](https://github.com/angular/angular/issues/44393) - **zone.js:** update electron patch to support electron/remote 14 ([#45073](https://github.com/angular/angular/issues/45073)) ([d65706a](https://github.com/angular/angular/commit/d65706a3b225ccb88d719478c19a379aef1b6047)), closes [#43346](https://github.com/angular/angular/issues/43346) ## [0.11.4](https://github.com/angular/angular/compare/zone.js-0.11.3...zone.js-0.11.4) (2021-02-10) ### Bug Fixes - **zone.js:** fesm2015 bundle should also be strict module. ([#40456](https://github.com/angular/angular/issues/40456)) ([f35f7c6](https://github.com/angular/angular/commit/f35f7c6)), closes [#40215](https://github.com/angular/angular/issues/40215) [#40215](https://github.com/angular/angular/issues/40215) - **zone.js:** fix typo in zone_externs ([#40348](https://github.com/angular/angular/issues/40348)) ([8116edb](https://github.com/angular/angular/commit/8116edb)) - **zone.js:** patch child method that overrides an already patched method ([#39850](https://github.com/angular/angular/issues/39850)) ([82e3f54](https://github.com/angular/angular/commit/82e3f54)) - **zone.js:** setTimeout patch should clean tasksByHandleId cache. ([#40586](https://github.com/angular/angular/issues/40586)) ([0652b29](https://github.com/angular/angular/commit/0652b29)), closes [#40387](https://github.com/angular/angular/issues/40387) - **zone.js:** update build tooling for latest changes in rules_nodejs ([#40710](https://github.com/angular/angular/issues/40710)) ([2827845](https://github.com/angular/angular/commit/2827845)) ### Features - **zone.js:** monkey patches queueMicrotask() ([#38904](https://github.com/angular/angular/issues/38904)) ([27358eb](https://github.com/angular/angular/commit/27358eb)), closes [#38863](https://github.com/angular/angular/issues/38863) ## [0.11.3](https://github.com/angular/angular/compare/zone.js-0.11.2...zone.js-0.11.3) (2020-10-27) ### Bug Fixes - **zone.js:** remove global declaration ([#37861](https://github.com/angular/angular/issues/37861)) ([90c0772](https://github.com/angular/angular/commit/90c0772)), closes [#37531](https://github.com/angular/angular/issues/37531) ## [0.11.2](https://github.com/angular/angular/compare/zone.js-0.11.0...zone.js-0.11.2) (2020-09-19) ### Bug Fixes - **zone.js:** jest getRealSystemTime should return native time ([#39127](https://github.com/angular/angular/issues/39127)) ([ffc3332](https://github.com/angular/angular/commit/ffc3332)) - **zone.js:** add missing types field in package.json ([#38585](https://github.com/angular/angular/issues/38585)) ([27cc56b](https://github.com/angular/angular/commit/27cc56b)), closes [#38584](https://github.com/angular/angular/issues/38584) - **zone.js:** defineProperty patch should not swallow error ([#37582](https://github.com/angular/angular/issues/37582)) ([45a73dd](https://github.com/angular/angular/commit/45a73dd)), closes [#37432](https://github.com/angular/angular/issues/37432) - **zone.js:** run tests in umd format ([#37582](https://github.com/angular/angular/issues/37582)) ([40096be](https://github.com/angular/angular/commit/40096be)) - **zone.js:** should have better backward compatibilities ([#38797](https://github.com/angular/angular/issues/38797)) ([a33d630](https://github.com/angular/angular/commit/a33d630)), closes [#38561](https://github.com/angular/angular/issues/38561) [#38669](https://github.com/angular/angular/issues/38669) - **zone.js:** should invoke xhr send task when no response error occurs ([#38836](https://github.com/angular/angular/issues/38836)) ([d92a0dd](https://github.com/angular/angular/commit/d92a0dd)), closes [#38795](https://github.com/angular/angular/issues/38795) - **zone.js:** zone.js toString patch should check typeof Promise is function ([#38350](https://github.com/angular/angular/issues/38350)) ([18e474f](https://github.com/angular/angular/commit/18e474f)), closes [#38361](https://github.com/angular/angular/issues/38361) ### Features - **zone.js:** add jest fakeTimers support ([#39016](https://github.com/angular/angular/issues/39016)) ([82d54fe](https://github.com/angular/angular/commit/82d54fe)), closes [#38851](https://github.com/angular/angular/issues/38851) ### Refactor - **zone.js:** refactor(zone.js): rename several internal apis in fake async zone spec ([#39127](https://github.com/angular/angular/issues/39127)) ([8a68669](https://github.com/angular/angular/commit/8a68669)) ### Build - **zone.js:** build(zone.js): zone.js should output esm format for fesm2015 bundles ([#39203](https://github.com/angular/angular/issues/39203)) ([822b838](https://github.com/angular/angular/commit/822b838)) ### BREAKING CHANGES - **zone.js:** ZoneJS no longer swallows errors produced by `Object.defineProperty` calls. Prior to this change, ZoneJS monkey patched `Object.defineProperty` and if there is an error (such as the property is not configurable or not writable) the patched logic swallowed it and only console.log was produced. This behavior used to hide real errors, so the logic is now updated to trigger original errors (if any). One exception where the patch remains in place is `document.registerElement` (to allow smooth transition for code/polyfills that rely on old behavior in legacy browsers). If your code relies on the old behavior (where errors were not thrown before), you may need to update the logic to handle the errors that are no longer masked by ZoneJS patch. ## [0.11.1](https://github.com/angular/angular/compare/zone.js-0.11.0...zone.js-0.11.1) (2020-08-19) ### Bug Fixes - **zone.js:** zone.js package.json should not include files/directories field ([#38528](https://github.com/angular/angular/issues/38528)) ([6b662d1](https://github.com/angular/angular/commit/6b662d1)), closes [#38526](https://github.com/angular/angular/issues/38526) [#38516](https://github.com/angular/angular/issues/38516) [#38513](https://github.com/angular/angular/issues/38513) # BREAKING CHANGES since Zone.js v0.11.1 Prior to `v0.11.1`, Zone.js provided two distribution bundle formats in the `dist` folder. They were (1) `ES5` bundle distributed as `zone.js` and (2) `ES2015` bundle distributed as `zone-evergreen.js`. These bundles are used for Angular's differential-loading mechanism. Prior to `v0.11.11` the following code ``` import 'zone.js'; ``` would load the `ES5` bundle from `dist/zone.js`. Starting with `v0.11.1`, Zone.js follows the [Angular Package Format](https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs), so the folder structure of the Zone.js bundles is updated to match `Angular Package Format`. So the same code ``` import 'zone.js'; ``` now loads the `ES2015` bundle instead. This is a breaking change for legacy browsers such as `IE11`. For backwards compatibility `zone.js` continues to distribute the same bundles under `dist`. To restore the old behavior change the `polyfills.ts` generated by `Angular CLI` to import like so: ``` import 'zone.js/dist/zone'; ``` # [0.11.0](https://github.com/angular/angular/compare/zone.js-0.10.3...zone.js-0.11.0) (2020-08-14) ### Bug Fixes - **zone.js:** add issue numbers of `[@types](https://github.com/types)/jasmine` to the test cases ([#34625](https://github.com/angular/angular/issues/34625)) ([41667de](https://github.com/angular/angular/commit/41667de)) - **zone.js:** clearTimeout/clearInterval should call on object global ([#37858](https://github.com/angular/angular/issues/37858)) ([a71f114](https://github.com/angular/angular/commit/a71f114)), closes [#37333](https://github.com/angular/angular/issues/37333) - **zone.js:** fix 2 bluebird test cases for each/mapSeries ([#36295](https://github.com/angular/angular/issues/36295)) ([b44f7b5](https://github.com/angular/angular/commit/b44f7b5)) - **zone.js:** patch nodejs EventEmtter.prototype.off ([#37863](https://github.com/angular/angular/issues/37863)) ([1822cbc](https://github.com/angular/angular/commit/1822cbc)), closes [#35473](https://github.com/angular/angular/issues/35473) - **zone.js:** remove unused Promise overwritten setter logic ([#36851](https://github.com/angular/angular/issues/36851)) ([31796e8](https://github.com/angular/angular/commit/31796e8)) - **zone.js:** should not try to patch fetch if it is not writable ([#36311](https://github.com/angular/angular/issues/36311)) ([416c786](https://github.com/angular/angular/commit/416c786)), closes [#36142](https://github.com/angular/angular/issues/36142) - **zone.js:** UNPATCHED_EVENTS and PASSIVE_EVENTS should be string[] not boolean ([#36258](https://github.com/angular/angular/issues/36258)) ([36e927a](https://github.com/angular/angular/commit/36e927a)) - **zone.js:** zone patch rxjs should return null \_unsubscribe correctly. ([#37091](https://github.com/angular/angular/issues/37091)) ([96aa14d](https://github.com/angular/angular/commit/96aa14d)), closes [#31684](https://github.com/angular/angular/issues/31684) - **zone.js:** zone.js patch jest should handle done correctly ([#36022](https://github.com/angular/angular/issues/36022)) ([4374931](https://github.com/angular/angular/commit/4374931)) ### Features - **zone.js:** move all zone optional bundles to plugins folders ([#36540](https://github.com/angular/angular/issues/36540)) ([b199ef6](https://github.com/angular/angular/commit/b199ef6)) - **zone.js:** move MutationObserver/FileReader to different module ([#31657](https://github.com/angular/angular/issues/31657)) ([253337d](https://github.com/angular/angular/commit/253337d)) - **zone.js:** patch jasmine.createSpyObj to make properties enumerable to be true ([#34624](https://github.com/angular/angular/issues/34624)) ([c2b4d92](https://github.com/angular/angular/commit/c2b4d92)), closes [#33657](https://github.com/angular/angular/issues/33657) - **zone.js:** upgrade zone.js to angular package format(APF) ([#36540](https://github.com/angular/angular/issues/36540)) ([583a9d3](https://github.com/angular/angular/commit/583a9d3)), closes [#35157](https://github.com/angular/angular/issues/35157) [/github.com/angular/angular-cli/blob/5376a8b1392ac7bd252782d8474161ce03a4d1cb/packages/schematics/angular/application/files/src/polyfills.ts.template#L55-L58](https://github.com//github.com/angular/angular-cli/blob/5376a8b1392ac7bd252782d8474161ce03a4d1cb/packages/schematics/angular/application/files/src/polyfills.ts.template/issues/L55-L58) ## [0.10.3](https://github.com/angular/angular/compare/zone.js-0.10.2...zone.js-0.10.3) (2020-02-27) ### Bug Fixes - **zone.js:** a path traversal attack in test ([#32392](https://github.com/angular/angular/issues/32392)) ([d498314](https://github.com/angular/angular/commit/d4983148508a7ddaeb095ab01db6b3bf995ee23f)) - **zone.js:** work around TS3.7 issue ([#33294](https://github.com/angular/angular/issues/33294)) ([0953642](https://github.com/angular/angular/commit/09536423e83892e716de13b2d14f12fff757f5a0)) - fixes typo of zone.js patch vrdisplaydisconnected property ([#33581](https://github.com/angular/angular/issues/33581)) ([71b8e27](https://github.com/angular/angular/commit/71b8e271b352b80519f1b8bbd786d78b49a2012b)), closes [#33579](https://github.com/angular/angular/issues/33579) - should also allow subclass Promise without Symbol.species ([#34533](https://github.com/angular/angular/issues/34533)) ([58b29f1](https://github.com/angular/angular/commit/58b29f1503a180fdfb8feb73a30d0c4448afad9a)) - **zone.js:** fix `zone-patch-rxjs` bundle to refer to `rxjs` (rather than include) it. ([#35983](https://github.com/angular/angular/issues/35983)) ([99ea5d7](https://github.com/angular/angular/commit/99ea5d7)), closes [#35878](https://github.com/angular/angular/issues/35878) - **zone.js:** Make `EventTarget` methods optional in `zone.js` extension API ([#35954](https://github.com/angular/angular/issues/35954)) ([5463462](https://github.com/angular/angular/commit/5463462)) - **zone.js:** zone.js patches rxjs should check null for unsubscribe ([#35990](https://github.com/angular/angular/issues/35990)) ([3fa8952](https://github.com/angular/angular/commit/3fa8952)), closes [#31687](https://github.com/angular/angular/issues/31687) [#31684](https://github.com/angular/angular/issues/31684) ### Features - implement Symbol.specics of Promise ([#34162](https://github.com/angular/angular/issues/34162)) ([539d8f0](https://github.com/angular/angular/commit/539d8f09e01fb4c577bc8a289d2e124360d4c6b1)), closes [#34105](https://github.com/angular/angular/issues/34105) [#33989](https://github.com/angular/angular/issues/33989) - define all zone.js configurations to typescript interfaces ([#35329](https://github.com/angular/angular/issues/35329)) ([03d88c7](https://github.com/angular/angular/commit/03d88c7965eb8b1310a1b50675fee66986a9ebac)) - add a temp solution to support passive event listeners. ([#34503](https://github.com/angular/angular/issues/34503)) ([f9d483e](https://github.com/angular/angular/commit/f9d483e76ea9992e3fe3e2b7c8c415c264de4679)) - add an tickOptions parameter with property processNewMacroTasksSynchronously. ([#33838](https://github.com/angular/angular/issues/33838)) ([17b862c](https://github.com/angular/angular/commit/17b862cf82a18490329d88b37d3e86e3245d5759)), closes [#33799](https://github.com/angular/angular/issues/33799) - add interface definitions which zone extends EventTarget ([#35304](https://github.com/angular/angular/issues/35304)) ([4acb676](https://github.com/angular/angular/commit/4acb676f2e9ba3a9ea33dd020e23534d702f988b)), closes [#35173](https://github.com/angular/angular/issues/35173) - make jasmine patch as zone module ([#34676](https://github.com/angular/angular/issues/34676)) ([e1160f1](https://github.com/angular/angular/commit/e1160f19beb2399581ae36aa498ec0dc23dfed53)) - make mocha a zone module. ([#34719](https://github.com/angular/angular/issues/34719)) ([332937e](https://github.com/angular/angular/commit/332937ef2471ab039cac1eceda42f80f94912f68)) - add basic jest support ([#35080](https://github.com/angular/angular/issues/35080)) ([daac33c](https://github.com/angular/angular/commit/daac33cdc84c6a882ec04c3009e6a230153716b0)) - **zone.js:** add a zone config to allow user disable wrapping uncaught promise rejection ([#35873](https://github.com/angular/angular/issues/35873)) ([8456c5e](https://github.com/angular/angular/commit/8456c5e)), closes [#27840](https://github.com/angular/angular/issues/27840) - **zone.js:** Monkey patch MessagePort.prototype onproperties ([#34610](https://github.com/angular/angular/issues/34610)) ([0f8e710](https://github.com/angular/angular/commit/0f8e710)) ### Performance Improvements - performance improvement for eventListeners ([#34613](https://github.com/angular/angular/issues/34613)) ([a3c7ab9](https://github.com/angular/angular/commit/a3c7ab99b79cd63965fcce847d35fb2314676f53)) ## [0.10.2](https://github.com/angular/angular/compare/zone.js-0.10.1...zone.js-0.10.2) (2019-08-13) ### Features - **zone.js:** support Promise.allSettled ([#31849](https://github.com/angular/angular/issues/31849)) ([96cbcd6](https://github.com/angular/angular/commit/96cbcd6)) ## [0.10.1](https://github.com/angular/angular/compare/zone.js-0.10.0...zone.js-0.10.1) (2019-08-02) ### Bug Fixes - **zone.js:** don't rely on global node typings outside of node/ directory ([#31783](https://github.com/angular/angular/issues/31783)) ([5c9a896](https://github.com/angular/angular/commit/5c9a896)) - **zone.js:** should expose some other internal intefaces ([#31866](https://github.com/angular/angular/issues/31866)) ([f5c605b](https://github.com/angular/angular/commit/f5c605b)) # [0.10.0](https://github.com/angular/angular/compare/7b3bcc2...174770e) (2019-07-26) ### Bug Fixes - **zone.js:** **load_patch and **symbol\_\_ should be in zone_extern for closure compiler ([#31350](https://github.com/angular/angular/issues/31350)) ([6b51ed2](https://github.com/angular/angular/commit/6b51ed2)) - **zone.js:** don't fire unhandledrejection if Zone handled error ([#31718](https://github.com/angular/angular/issues/31718)) ([c7542a1](https://github.com/angular/angular/commit/c7542a1)), closes [#31701](https://github.com/angular/angular/issues/31701) - **zone.js:** don't wrap uncaught promise error. ([#31443](https://github.com/angular/angular/issues/31443)) ([2bb9a65](https://github.com/angular/angular/commit/2bb9a65)), closes [#27840](https://github.com/angular/angular/issues/27840) - **zone.js:** fix zone for Jasmine 3.3. ([#31497](https://github.com/angular/angular/issues/31497)) ([c4c340a](https://github.com/angular/angular/commit/c4c340a)) - **zone.js:** handle MSPointer event correctly ([#31722](https://github.com/angular/angular/issues/31722)) ([2c402d5](https://github.com/angular/angular/commit/2c402d5)), closes [#31699](https://github.com/angular/angular/issues/31699) - **zone.js:** handle new api of electron 4 ([#31669](https://github.com/angular/angular/issues/31669)) ([a445826](https://github.com/angular/angular/commit/a445826)), closes [#31668](https://github.com/angular/angular/issues/31668) - **zone.js:** hook should set correct current zone ([#31642](https://github.com/angular/angular/issues/31642)) ([17b32b5](https://github.com/angular/angular/commit/17b32b5)), closes [#31641](https://github.com/angular/angular/issues/31641) - **zone.js:** move property patch to legacy ([#31660](https://github.com/angular/angular/issues/31660)) ([716af10](https://github.com/angular/angular/commit/716af10)), closes [#31659](https://github.com/angular/angular/issues/31659) - **zone.js:** patch shadydom ([#31717](https://github.com/angular/angular/issues/31717)) ([35a025f](https://github.com/angular/angular/commit/35a025f)), closes [#31686](https://github.com/angular/angular/issues/31686) - **zone.js:** restore definition of global ([#31453](https://github.com/angular/angular/issues/31453)) ([e6f1b04](https://github.com/angular/angular/commit/e6f1b04)), closes [/github.com/angular/zone.js/commit/71b93711806000d7788e79451478e20d6086aa8a#diff-dd469785fca8680a5b33b1e81c5cfd91R1420](https://github.com//github.com/angular/zone.js/commit/71b93711806000d7788e79451478e20d6086aa8a/issues/diff-dd469785fca8680a5b33b1e81c5cfd91R1420) - **zone.js:** should remove on symbol property after removeAllListeners ([#31644](https://github.com/angular/angular/issues/31644)) ([a182714](https://github.com/angular/angular/commit/a182714)), closes [#31643](https://github.com/angular/angular/issues/31643) - **zone.js:** update dart zone link ([#31646](https://github.com/angular/angular/issues/31646)) ([7f7033b](https://github.com/angular/angular/commit/7f7033b)), closes [#31645](https://github.com/angular/angular/issues/31645) - **zone.js:** zone-mix should import correct browser module ([#31628](https://github.com/angular/angular/issues/31628)) ([87ce4e9](https://github.com/angular/angular/commit/87ce4e9)), closes [#31626](https://github.com/angular/angular/issues/31626) ## [0.9.1](https://github.com/angular/zone.js/compare/v0.9.0...0.9.1) (2019-04-30) ### Bug Fixes - ensure that EventTarget is patched prior to legacy property descriptor patch ([#1214](https://github.com/angular/zone.js/issues/1214)) ([aca4728](https://github.com/angular/zone.js/commit/aca4728)) - fakeAsyncTest requestAnimationFrame should pass timestamp as parameter ([#1220](https://github.com/angular/zone.js/issues/1220)) ([62b8525](https://github.com/angular/zone.js/commit/62b8525)), closes [#1216](https://github.com/angular/zone.js/issues/1216) ### Features - add option to disable jasmine clock patch, also rename the flag of auto jump in FakeAsyncTest ([#1222](https://github.com/angular/zone.js/issues/1222)) ([10e1b0c](https://github.com/angular/zone.js/commit/10e1b0c)) # [0.9.0](https://github.com/angular/zone.js/compare/v0.8.29...0.9.0) (2019-03-12) ### Bug Fixes - **lint:** fix [#1168](https://github.com/angular/zone.js/issues/1168), remove unused = null code ([#1171](https://github.com/angular/zone.js/issues/1171)) ([917e2af](https://github.com/angular/zone.js/commit/917e2af)) - **test:** fix [#1155](https://github.com/angular/zone.js/issues/1155), try/catch modify error.message ([#1157](https://github.com/angular/zone.js/issues/1157)) ([7e983d1](https://github.com/angular/zone.js/commit/7e983d1)) - **test:** fix: make fakeAsync test spec timer id global ([d32e79b](https://github.com/angular/zone.js/commit/d32e79b)) - **build:** fix: closure related fixes ([2a8415d](https://github.com/angular/zone.js/commit/2a8415d)) - **compile:** fix: remove finally definition from Promise interface ([47dd3f4](https://github.com/angular/zone.js/commit/47dd3f4)) ### Doc - **doc:** [#1181](https://github.com/angular/zone.js/pull/1181), Fix the typo in timer module documentation ([8f78b55](https://github.com/angular/zone.js/commit/8f78b55)) - **doc:** [#1163](https://github.com/angular/zone.js/pull/1163), Update YouTube video link ([f171821](https://github.com/angular/zone.js/commit/f171821)) - **doc:** [#1151](https://github.com/angular/zone.js/pull/1151), Re-phrase the lines for better understanding ([2a6444b](https://github.com/angular/zone.js/commit/2a6444b)) - **doc:** [#1152](https://github.com/angular/zone.js/pull/1152), change the word TimerTask to MacroTask ([f3995de](https://github.com/angular/zone.js/commit/f3995de)) ### Features - **test:** add benchmark page ([#1076](https://github.com/angular/zone.js/issues/1076)) ([128649a](https://github.com/angular/zone.js/commit/128649a)) - **test:** test(promise): add test cases for Promise.all with sync then operation ([#1158](https://github.com/angular/zone.js/issues/1158)) ([0b44e83](https://github.com/angular/zone.js/commit/0b44e83)) - **test:** feat: add an option **zone_symbol**disableDatePatching to allow disabling Date patching ([c378f87](https://github.com/angular/zone.js/commit/c378f87)) ### Env - **env:** change BLACK_LISTED_EVENTS to DISABLE_EVENTS ([9c65d25](https://github.com/angular/zone.js/commit/9c65d25)) ### Build - **build:** build zone-evergreen.js in es2015, add terser minify support ([2ad936b](https://github.com/angular/zone.js/commit/2ad936b)) - **build:** upgrade to pass jasmine 3.3 test ([82dfd75](https://github.com/angular/zone.js/commit/82dfd75)) - **build:** upgrade to typescript 3.2.2 ([fcdd559](https://github.com/angular/zone.js/commit/fcdd559)) - **build:** separate zone.js into evergreen only and legacy included bundles ([ac3851e](https://github.com/angular/zone.js/commit/ac3851e)) - **build:** make legacy standalone bundle ([a5fe09b](https://github.com/angular/zone.js/commit/a5fe09b)) ## [0.8.29](https://github.com/angular/zone.js/compare/v0.8.28...0.8.29) (2019-01-22) ### Bug Fixes - **core:** fix for tests in angular repo ([fd069db](https://github.com/angular/zone.js/commit/fd069db)) ## [0.8.28](https://github.com/angular/zone.js/compare/v0.8.27...0.8.28) (2019-01-16) ### Bug Fixes - **jasmine:** patch jasmine beforeAll/afterAll ([9d27abc4](https://github.com/angular/zone.js/commit/9d27abc4)) ## [0.8.27](https://github.com/angular/zone.js/compare/v0.8.26...0.8.27) (2019-01-08) ### Bug Fixes - **bluebird:** fix [#1112](https://github.com/angular/zone.js/issues/1112), bluebird chained callback should return a Bluebird Promise ([#1114](https://github.com/angular/zone.js/issues/1114)) ([6ba3169](https://github.com/angular/zone.js/commit/6ba3169)) - **core:** fix [#1108](https://github.com/angular/zone.js/issues/1108), window.onerror should have (message, source, lineno, colno, error) signiture ([#1109](https://github.com/angular/zone.js/issues/1109)) ([49e0548](https://github.com/angular/zone.js/commit/49e0548)) - **core:** fix [#1153](https://github.com/angular/zone.js/issues/1153), ZoneTask.toString should always be a string ([#1166](https://github.com/angular/zone.js/issues/1166)) ([afa1363](https://github.com/angular/zone.js/commit/afa1363)) - **core:** fix interval will still run after cancelled error ([#1156](https://github.com/angular/zone.js/issues/1156)) ([eb72ff4](https://github.com/angular/zone.js/commit/eb72ff4)) - **core:** use then directly when promise is not patchable ([#1079](https://github.com/angular/zone.js/issues/1079)) ([d7e0a31](https://github.com/angular/zone.js/commit/d7e0a31)) - **duplicate:** fix [#1081](https://github.com/angular/zone.js/issues/1081), load patch should also check the duplicate flag ([#1121](https://github.com/angular/zone.js/issues/1121)) ([8ce5e33](https://github.com/angular/zone.js/commit/8ce5e33)) - **event:** fix [#1110](https://github.com/angular/zone.js/issues/1110), nodejs EventEmitter should support Symbol eventName ([#1113](https://github.com/angular/zone.js/issues/1113)) ([96420d6](https://github.com/angular/zone.js/commit/96420d6)) - **event:** should pass boolean to addEventListener if not support passive ([#1053](https://github.com/angular/zone.js/issues/1053)) ([e9536ec](https://github.com/angular/zone.js/commit/e9536ec)) - **format:** update clang-format to 1.2.3 ([f238908](https://github.com/angular/zone.js/commit/f238908)) - **memory:** Add protection against excessive on prop patching ([#1106](https://github.com/angular/zone.js/issues/1106)) ([875086f](https://github.com/angular/zone.js/commit/875086f)) - **node:** fix [#1164](https://github.com/angular/zone.js/issues/1164), don't patch uncaughtException to prevent endless loop ([#1170](https://github.com/angular/zone.js/issues/1170)) ([33a0ad6](https://github.com/angular/zone.js/commit/33a0ad6)) - **node:** node patched method should copy original delegate's symbol properties ([#1095](https://github.com/angular/zone.js/issues/1095)) ([0a2f6ff](https://github.com/angular/zone.js/commit/0a2f6ff)) - **onProperty:** user quoted access for \_\_Zone_ignore_on_properties ([#1134](https://github.com/angular/zone.js/issues/1134)) ([7201d44](https://github.com/angular/zone.js/commit/7201d44)) - **test:** karma-dist should test bundle under dist ([#1049](https://github.com/angular/zone.js/issues/1049)) ([0720d79](https://github.com/angular/zone.js/commit/0720d79)) - **tsc:** tsconfig.json strict:true ([915042d](https://github.com/angular/zone.js/commit/915042d)) - **xhr:** fix [#1072](https://github.com/angular/zone.js/issues/1072), should set scheduled flag to target ([#1074](https://github.com/angular/zone.js/issues/1074)) ([34c12e5](https://github.com/angular/zone.js/commit/34c12e5)) - **xhr:** should invoke xhr task after onload is triggered ([#1055](https://github.com/angular/zone.js/issues/1055)) ([2aab9c8](https://github.com/angular/zone.js/commit/2aab9c8)) ### Features - **build:** Upgrade to TypeScript 2.9 and rxjs6 ([#1122](https://github.com/angular/zone.js/issues/1122)) ([31fc127](https://github.com/angular/zone.js/commit/31fc127)) - **core:** upgrade to typescript 3.0.3 ([#1132](https://github.com/angular/zone.js/issues/1132)) ([60adc9c](https://github.com/angular/zone.js/commit/60adc9c)) - **Core:** fix [#910](https://github.com/angular/zone.js/issues/910), add a flag to allow user to ignore duplicate Zone error ([#1093](https://github.com/angular/zone.js/issues/1093)) ([a86c6d5](https://github.com/angular/zone.js/commit/a86c6d5)) - **custom-element:** patch customElement v1 APIs ([#1133](https://github.com/angular/zone.js/issues/1133)) ([427705f](https://github.com/angular/zone.js/commit/427705f)) - **error:** fix [#975](https://github.com/angular/zone.js/issues/975), can config how to load blacklist zone stack frames ([#1045](https://github.com/angular/zone.js/issues/1045)) ([ff3d545](https://github.com/angular/zone.js/commit/ff3d545)) - **fetch:** schedule macroTask when fetch ([#1075](https://github.com/angular/zone.js/issues/1075)) ([bf88c34](https://github.com/angular/zone.js/commit/bf88c34)) ## [0.8.26](https://github.com/angular/zone.js/compare/v0.8.25...0.8.26) (2018-04-08) ### Bug Fixes - **test:** fix [#1069](https://github.com/angular/zone.js/issues/1069), FakeDate should handle constructor parameter ([#1070](https://github.com/angular/zone.js/issues/1070)) ([b3fdd7e](https://github.com/angular/zone.js/commit/b3fdd7e)) ## [0.8.25](https://github.com/angular/zone.js/compare/v0.8.24...0.8.25) (2018-04-04) ### Bug Fixes - **test:** add async/fakeAsync into zone-testing bundle ([#1068](https://github.com/angular/zone.js/issues/1068)) ([3bdfdad](https://github.com/angular/zone.js/commit/3bdfdad)) ## [0.8.24](https://github.com/angular/zone.js/compare/v0.8.23...0.8.24) (2018-04-02) ### Bug Fixes - **test:** add flag to patch jasmine.clock, move fakeAsync/async into original bundle ([#1067](https://github.com/angular/zone.js/issues/1067)) ([389762c](https://github.com/angular/zone.js/commit/389762c)) ## [0.8.24](https://github.com/angular/zone.js/compare/v0.8.23...0.8.24) (2018-04-02) ### Bug Fixes - **test:** add flag to patch jasmine.clock, move fakeAsync/async into original bundle ([#1067](https://github.com/angular/zone.js/issues/1067)) ([389762c](https://github.com/angular/zone.js/commit/389762c)) ## [0.8.23](https://github.com/angular/zone.js/compare/v0.8.22...0.8.23) (2018-04-01) ### Bug Fixes - **test:** check setImmediate supports ([6c7e45b](https://github.com/angular/zone.js/commit/6c7e45b)) ## [0.8.22](https://github.com/angular/zone.js/compare/v0.8.21...0.8.22) (2018-03-31) ### Bug Fixes - **fakeAsync:** fix [#1050](https://github.com/angular/zone.js/issues/1050), should only reset patched Date.now until fakeAsync exit ([#1051](https://github.com/angular/zone.js/issues/1051)) ([e15d735](https://github.com/angular/zone.js/commit/e15d735)) - **fakeAsyncTest:** fix [#1061](https://github.com/angular/zone.js/issues/1061), fakeAsync should support setImmediate ([#1062](https://github.com/angular/zone.js/issues/1062)) ([66c6f97](https://github.com/angular/zone.js/commit/66c6f97)) ## [0.8.21](https://github.com/angular/zone.js/compare/v0.8.20...0.8.21) (2018-03-30) ### Bug Fixes - add OriginalDelegate prop to Function::toString ([#993](https://github.com/angular/zone.js/issues/993)) ([2dc7e5c](https://github.com/angular/zone.js/commit/2dc7e5c)) - **core:** fix [#1000](https://github.com/angular/zone.js/issues/1000), check target is null or not when patchOnProperty ([#1004](https://github.com/angular/zone.js/issues/1004)) ([5c139e5](https://github.com/angular/zone.js/commit/5c139e5)) - **core:** fix [#946](https://github.com/angular/zone.js/issues/946), don't patch promise if it is not writable ([#1041](https://github.com/angular/zone.js/issues/1041)) ([c8c5990](https://github.com/angular/zone.js/commit/c8c5990)) - **event:** fix [#1021](https://github.com/angular/zone.js/issues/1021), removeListener/removeAllListeners should return eventEmitter ([#1022](https://github.com/angular/zone.js/issues/1022)) ([ab72df6](https://github.com/angular/zone.js/commit/ab72df6)) - **fakeAsync:** fix [#1056](https://github.com/angular/zone.js/issues/1056), fakeAsync timerId should not be zero ([#1057](https://github.com/angular/zone.js/issues/1057)) ([68682cd](https://github.com/angular/zone.js/commit/68682cd)) - **jasmine:** fix [#1015](https://github.com/angular/zone.js/issues/1015), make jasmine patch compatible to jasmine 3.x ([#1016](https://github.com/angular/zone.js/issues/1016)) ([e1df4bc](https://github.com/angular/zone.js/commit/e1df4bc)) - **patch:** fix [#998](https://github.com/angular/zone.js/issues/998), patch mediaQuery for new Safari ([#1003](https://github.com/angular/zone.js/issues/1003)) ([c7c7db5](https://github.com/angular/zone.js/commit/c7c7db5)) - **proxy:** proxyZone should call onHasTask when change delegate ([#1030](https://github.com/angular/zone.js/issues/1030)) ([40b110d](https://github.com/angular/zone.js/commit/40b110d)) - **test:** fix mocha compatible issue ([#1028](https://github.com/angular/zone.js/issues/1028)) ([c554e9f](https://github.com/angular/zone.js/commit/c554e9f)) - **testing:** fix [#1032](https://github.com/angular/zone.js/issues/1032), fakeAsync should pass parameters correctly ([#1033](https://github.com/angular/zone.js/issues/1033)) ([eefe983](https://github.com/angular/zone.js/commit/eefe983)) ### Features - **bluebird:** fix [#921](https://github.com/angular/zone.js/issues/921), [#977](https://github.com/angular/zone.js/issues/977), support bluebird ([#1039](https://github.com/angular/zone.js/issues/1039)) ([438210c](https://github.com/angular/zone.js/commit/438210c)) - **build:** use yarn instead of npm ([#1025](https://github.com/angular/zone.js/issues/1025)) ([ebd348c](https://github.com/angular/zone.js/commit/ebd348c)) - **core:** fix [#996](https://github.com/angular/zone.js/issues/996), expose UncaughtPromiseError ([#1040](https://github.com/angular/zone.js/issues/1040)) ([7f178b1](https://github.com/angular/zone.js/commit/7f178b1)) - **jasmine:** support Date.now in fakeAsyncTest ([#1009](https://github.com/angular/zone.js/issues/1009)) ([f22065e](https://github.com/angular/zone.js/commit/f22065e)) - **jsonp:** provide a help method to patch jsonp ([#997](https://github.com/angular/zone.js/issues/997)) ([008fd43](https://github.com/angular/zone.js/commit/008fd43)) - **patch:** fix [#1011](https://github.com/angular/zone.js/issues/1011), patch ResizeObserver ([#1012](https://github.com/angular/zone.js/issues/1012)) ([8ee88da](https://github.com/angular/zone.js/commit/8ee88da)) - **patch:** fix [#828](https://github.com/angular/zone.js/issues/828), patch socket.io client ([b3db9f4](https://github.com/angular/zone.js/commit/b3db9f4)) - **promise:** support Promise.prototype.finally ([#1005](https://github.com/angular/zone.js/issues/1005)) ([6a1a830](https://github.com/angular/zone.js/commit/6a1a830)) - **rollup:** use new rollup config to prevent warning ([#1006](https://github.com/angular/zone.js/issues/1006)) ([6b6b38a](https://github.com/angular/zone.js/commit/6b6b38a)) - **test:** can handle non zone aware task in promise ([#1014](https://github.com/angular/zone.js/issues/1014)) ([6852f1d](https://github.com/angular/zone.js/commit/6852f1d)) - **test:** move async/fakeAsync from angular to zone.js ([#1048](https://github.com/angular/zone.js/issues/1048)) ([a4b42cd](https://github.com/angular/zone.js/commit/a4b42cd)) - **testing:** can display pending tasks info when test timeout in jasmine/mocha ([#1038](https://github.com/angular/zone.js/issues/1038)) ([57bc80c](https://github.com/angular/zone.js/commit/57bc80c)) ## [0.8.20](https://github.com/angular/zone.js/compare/v0.8.19...0.8.20) (2018-01-10) ### Bug Fixes - **core:** add comment for shorter var/function name ([67e8178](https://github.com/angular/zone.js/commit/67e8178)) - **core:** add file check script in travis build ([615a6c1](https://github.com/angular/zone.js/commit/615a6c1)) - **core:** add helper method in util.ts to shorter zone.wrap/scehduleMacroTask ([8293c37](https://github.com/angular/zone.js/commit/8293c37)) - **core:** add rxjs test ([31832a7](https://github.com/angular/zone.js/commit/31832a7)) - **core:** fix [#989](https://github.com/angular/zone.js/issues/989), remove unuse code, use shorter name to reduce bundle size ([73b0061](https://github.com/angular/zone.js/commit/73b0061)) - **core:** fix shorter name closure conflict ([00a4e31](https://github.com/angular/zone.js/commit/00a4e31)) - **core:** remove unreadable short names ([957351e](https://github.com/angular/zone.js/commit/957351e)) ## [0.8.18](https://github.com/angular/zone.js/compare/v0.8.17...0.8.18) (2017-09-27) ### Bug Fixes - **event:** EventTarget of SourceBuffer in samsung tv will have null context ([#904](https://github.com/angular/zone.js/issues/904)) ([8718e07](https://github.com/angular/zone.js/commit/8718e07)) - **event:** fix [#883](https://github.com/angular/zone.js/issues/883), fix RTCPeerConnection Safari event not triggered issue ([#905](https://github.com/angular/zone.js/issues/905)) ([6f74efb](https://github.com/angular/zone.js/commit/6f74efb)) - **event:** fix [#911](https://github.com/angular/zone.js/issues/911), in IE, event handler event maybe undefined ([#913](https://github.com/angular/zone.js/issues/913)) ([4ba5d97](https://github.com/angular/zone.js/commit/4ba5d97)) - **event:** should handle event.stopImmediatePropagration ([#903](https://github.com/angular/zone.js/issues/903)) ([dcc285a](https://github.com/angular/zone.js/commit/dcc285a)) - **patch:** patchOnProperty getter should return original listener ([#887](https://github.com/angular/zone.js/issues/887)) ([d4e5ae8](https://github.com/angular/zone.js/commit/d4e5ae8)) - **patch:** Worker should patch onProperties ([#915](https://github.com/angular/zone.js/issues/915)) ([418a583](https://github.com/angular/zone.js/commit/418a583)) - **promise:** can set native promise after loading zone.js ([#899](https://github.com/angular/zone.js/issues/899)) ([956c729](https://github.com/angular/zone.js/commit/956c729)) - **timer:** fix [#314](https://github.com/angular/zone.js/issues/314), setTimeout/interval should return original timerId ([#894](https://github.com/angular/zone.js/issues/894)) ([aec4bd4](https://github.com/angular/zone.js/commit/aec4bd4)) ### Features - **compile:** fix [#892](https://github.com/angular/zone.js/issues/892), upgrade to typescript 2.3.4, support for...of when build zone-node ([#897](https://github.com/angular/zone.js/issues/897)) ([e999593](https://github.com/angular/zone.js/commit/e999593)) - **spec:** log URL in error when attempting XHR from FakeAsyncTestZone ([#893](https://github.com/angular/zone.js/issues/893)) ([874bfdc](https://github.com/angular/zone.js/commit/874bfdc)) ## [0.8.17](https://github.com/angular/zone.js/compare/v0.8.16...0.8.17) (2017-08-23) ### Bug Fixes - readonly property should not be patched ([#860](https://github.com/angular/zone.js/issues/860)) ([7fbd655](https://github.com/angular/zone.js/commit/7fbd655)) - suppress closure warnings/errors ([#861](https://github.com/angular/zone.js/issues/861)) ([deae751](https://github.com/angular/zone.js/commit/deae751)) - **module:** fix [#875](https://github.com/angular/zone.js/issues/875), can disable requestAnimationFrame ([#876](https://github.com/angular/zone.js/issues/876)) ([fcf187c](https://github.com/angular/zone.js/commit/fcf187c)) - **node:** remove reference to 'noop' ([#865](https://github.com/angular/zone.js/issues/865)) ([4032ddf](https://github.com/angular/zone.js/commit/4032ddf)) - **patch:** fix [#869](https://github.com/angular/zone.js/issues/869), should not patch readonly method ([#871](https://github.com/angular/zone.js/issues/871)) ([31d38c1](https://github.com/angular/zone.js/commit/31d38c1)) - **rxjs:** asap should runGuarded to let error inZone ([#884](https://github.com/angular/zone.js/issues/884)) ([ce3f12f](https://github.com/angular/zone.js/commit/ce3f12f)) - **rxjs:** fix [#863](https://github.com/angular/zone.js/issues/863), fix asap scheduler issue, add testcases ([#848](https://github.com/angular/zone.js/issues/848)) ([cbc58c1](https://github.com/angular/zone.js/commit/cbc58c1)) - **spec:** fix flush() behavior in handling periodic timers ([#881](https://github.com/angular/zone.js/issues/881)) ([eed776c](https://github.com/angular/zone.js/commit/eed776c)) - **task:** fix closure compatibility issue with ZoneDelegate.\_updateTaskCount ([#878](https://github.com/angular/zone.js/issues/878)) ([a03b84b](https://github.com/angular/zone.js/commit/a03b84b)) ### Features - **cordova:** fix [#868](https://github.com/angular/zone.js/issues/868), patch cordova FileReader ([#879](https://github.com/angular/zone.js/issues/879)) ([b1e5970](https://github.com/angular/zone.js/commit/b1e5970)) - **onProperty:** fix [#875](https://github.com/angular/zone.js/issues/875), can disable patch specified onProperties ([#877](https://github.com/angular/zone.js/issues/877)) ([a733688](https://github.com/angular/zone.js/commit/a733688)) - **patch:** fix [#833](https://github.com/angular/zone.js/issues/833), add IntersectionObserver support ([#880](https://github.com/angular/zone.js/issues/880)) ([f27ff14](https://github.com/angular/zone.js/commit/f27ff14)) - **performance:** onProperty handler use global wrapFn, other performance improve. ([#872](https://github.com/angular/zone.js/issues/872)) ([a66595a](https://github.com/angular/zone.js/commit/a66595a)) - **performance:** reuse microTaskQueue native promise ([#874](https://github.com/angular/zone.js/issues/874)) ([7ee8bcd](https://github.com/angular/zone.js/commit/7ee8bcd)) - **spec:** add a 'tick' callback to flush() ([#866](https://github.com/angular/zone.js/issues/866)) ([02cd40e](https://github.com/angular/zone.js/commit/02cd40e)) ## [0.8.16](https://github.com/angular/zone.js/compare/v0.8.15...0.8.16) (2017-07-27) ### Bug Fixes - **console:** console.log in nodejs should run in root Zone ([#855](https://github.com/angular/zone.js/issues/855)) ([5900d3a](https://github.com/angular/zone.js/commit/5900d3a)) - **promise:** fix [#850](https://github.com/angular/zone.js/issues/850), check Promise.then writable ([#851](https://github.com/angular/zone.js/issues/851)) ([6e44cab](https://github.com/angular/zone.js/commit/6e44cab)) - **spec:** do not count requestAnimationFrame as a pending timer ([#854](https://github.com/angular/zone.js/issues/854)) ([eca04b0](https://github.com/angular/zone.js/commit/eca04b0)) ### Features - **spec:** add an option to FakeAsyncTestZoneSpec to flush periodic timers ([#857](https://github.com/angular/zone.js/issues/857)) ([5c5ca1a](https://github.com/angular/zone.js/commit/5c5ca1a)) ## [0.8.15](https://github.com/angular/zone.js/compare/v0.8.13...0.8.15) (2017-07-27) ### Features - **rxjs:** fix [#830](https://github.com/angular/zone.js/issues/830), monkey patch rxjs to make rxjs run in correct zone ([#843](https://github.com/angular/zone.js/issues/843)) ([1ed83d0](https://github.com/angular/zone.js/commit/1ed83d0)) ## [0.8.14](https://github.com/angular/zone.js/compare/v0.8.13...0.8.14) (2017-07-20) ### Bug Fixes - **event:** fix [#836](https://github.com/angular/zone.js/issues/836), handle event callback call removeEventListener case ([#839](https://github.com/angular/zone.js/issues/839)) ([f301fa2](https://github.com/angular/zone.js/commit/f301fa2)) - **event:** fix memory leak for once, add more test cases ([#841](https://github.com/angular/zone.js/issues/841)) ([2143d9c](https://github.com/angular/zone.js/commit/2143d9c)) - **task:** fix [#832](https://github.com/angular/zone.js/issues/832), fix [#835](https://github.com/angular/zone.js/issues/835), task.data should be an object ([#834](https://github.com/angular/zone.js/issues/834)) ([3a4bfbd](https://github.com/angular/zone.js/commit/3a4bfbd)) ### Features - **rxjs:** fix [#830](https://github.com/angular/zone.js/issues/830), monkey patch rxjs to make rxjs run in correct zone ([#843](https://github.com/angular/zone.js/issues/843)) ([1ed83d0](https://github.com/angular/zone.js/commit/1ed83d0)) ## [0.8.14](https://github.com/angular/zone.js/compare/v0.8.13...0.8.14) (2017-07-18) ### Bug Fixes - **event:** fix [#836](https://github.com/angular/zone.js/issues/836), handle event callback call removeEventListener case ([#839](https://github.com/angular/zone.js/issues/839)) ([f301fa2](https://github.com/angular/zone.js/commit/f301fa2)) - **event:** fix memory leak for once, add more test cases ([#841](https://github.com/angular/zone.js/issues/841)) ([2143d9c](https://github.com/angular/zone.js/commit/2143d9c)) - **task:** fix [#832](https://github.com/angular/zone.js/issues/832), fix [#835](https://github.com/angular/zone.js/issues/835), task.data should be an object ([#834](https://github.com/angular/zone.js/issues/834)) ([3a4bfbd](https://github.com/angular/zone.js/commit/3a4bfbd)) ## [0.8.13](https://github.com/angular/zone.js/compare/v0.8.12...0.8.13) (2017-07-12) ### Bug Fixes - **promise:** fix [#806](https://github.com/angular/zone.js/issues/806), remove duplicate consolelog ([#807](https://github.com/angular/zone.js/issues/807)) ([f439fe2](https://github.com/angular/zone.js/commit/f439fe2)) - **spec:** fakeAsyncTestSpec should handle requestAnimationFrame ([#805](https://github.com/angular/zone.js/issues/805)) ([8260f1d](https://github.com/angular/zone.js/commit/8260f1d)), closes [#804](https://github.com/angular/zone.js/issues/804) - **websocket:** fix [#824](https://github.com/angular/zone.js/issues/824), patch websocket onproperties correctly in PhantomJS ([#826](https://github.com/angular/zone.js/issues/826)) ([273cb85](https://github.com/angular/zone.js/commit/273cb85)) ### Features - **FakeAsyncTestZoneSpec:** FakeAsyncTestZoneSpec.flush() passes limit along to scheduler ([#831](https://github.com/angular/zone.js/issues/831)) ([667cd6f](https://github.com/angular/zone.js/commit/667cd6f)) ### Performance Improvements - **eventListener:** fix [#798](https://github.com/angular/zone.js/issues/798), improve EventTarget.addEventListener performance ([#812](https://github.com/angular/zone.js/issues/812)) ([b3a76d3](https://github.com/angular/zone.js/commit/b3a76d3)) ## [0.8.12](https://github.com/angular/zone.js/compare/v0.8.11...0.8.12) (2017-06-07) ### Bug Fixes - **doc:** fix [#793](https://github.com/angular/zone.js/issues/793), fix confuseing bluebird patch doc ([#794](https://github.com/angular/zone.js/issues/794)) ([0c5da04](https://github.com/angular/zone.js/commit/0c5da04)) - **patch:** fix [#791](https://github.com/angular/zone.js/issues/791), fix mediaQuery/Notification patch uses wrong global ([#792](https://github.com/angular/zone.js/issues/792)) ([67634ae](https://github.com/angular/zone.js/commit/67634ae)) - **toString:** fix [#802](https://github.com/angular/zone.js/issues/802), fix ios 9 MutationObserver toString error ([#803](https://github.com/angular/zone.js/issues/803)) ([68aa03e](https://github.com/angular/zone.js/commit/68aa03e)) - **xhr:** inner onreadystatechange should not triigger Zone callback ([#800](https://github.com/angular/zone.js/issues/800)) ([7bd1Y(418](https://github.com/angular/zone.js/commit/7bd1418)) ### Features - **patch:** fix [#696](https://github.com/angular/zone.js/issues/696), patch HTMLCanvasElement.toBlob as MacroTask ([#788](https://github.com/angular/zone.js/issues/788)) ([7ca3995](https://github.com/angular/zone.js/commit/7ca3995)) - **patch:** fix [#758](https://github.com/angular/zone.js/issues/758), patch cordova.exec success/error with zone.wrap ([#789](https://github.com/angular/zone.js/issues/789)) ([857929d](https://github.com/angular/zone.js/commit/857929d)) ## [0.8.11](https://github.com/angular/zone.js/compare/v0.8.10...0.8.11) (2017-05-19) ### Bug Fixes - **closure:** patchOnProperty with exact eventNames as possible ([#768](https://github.com/angular/zone.js/issues/768)) ([582ff7b](https://github.com/angular/zone.js/commit/582ff7b)) - **patch:** fix [#744](https://github.com/angular/zone.js/issues/744), add namespace to load patch name ([#774](https://github.com/angular/zone.js/issues/774)) ([89f990a](https://github.com/angular/zone.js/commit/89f990a)) - **task:** fix [#778](https://github.com/angular/zone.js/issues/778), sometimes task will run after being canceled ([#780](https://github.com/angular/zone.js/issues/780)) ([b7238c8](https://github.com/angular/zone.js/commit/b7238c8)) - **webcomponents:** fix [#782](https://github.com/angular/zone.js/issues/782), fix conflicts with shadydom of webcomponents ([#784](https://github.com/angular/zone.js/issues/784)) ([245f8e9](https://github.com/angular/zone.js/commit/245f8e9)) - **webpack:** access `process` through `_global` so that WebPack does not accidentally browserify ([#786](https://github.com/angular/zone.js/issues/786)) ([1919b36](https://github.com/angular/zone.js/commit/1919b36)) ## [0.8.10](https://github.com/angular/zone.js/compare/v0.8.9...0.8.10) (2017-05-03) ### Bug Fixes - **showError:** fix ignoreConsoleErrorUncaughtError may change during drain microtask ([#763](https://github.com/angular/zone.js/issues/763)) ([4baeb5c](https://github.com/angular/zone.js/commit/4baeb5c)) - **spec:** fix [#760](https://github.com/angular/zone.js/issues/760), fakeAsyncTestSpec should handle microtask with additional args ([#762](https://github.com/angular/zone.js/issues/762)) ([f8d17ac](https://github.com/angular/zone.js/commit/f8d17ac)) - Package Error stack rewriting as a separate bundle. ([#770](https://github.com/angular/zone.js/issues/770)) ([b5e33fd](https://github.com/angular/zone.js/commit/b5e33fd)) - **timer:** fix [#437](https://github.com/angular/zone.js/issues/437), [#744](https://github.com/angular/zone.js/issues/744), fix nativescript timer issue, fix nodejs v0.10.x timer issue ([#772](https://github.com/angular/zone.js/issues/772)) ([3218b5a](https://github.com/angular/zone.js/commit/3218b5a)) ### Features - make codebase more modular so that only parts of it can be loaded ([#748](https://github.com/angular/zone.js/issues/748)) ([e933cbd](https://github.com/angular/zone.js/commit/e933cbd)) - **patch:** load non standard api with new load module method ([#764](https://github.com/angular/zone.js/issues/764)) ([97c03b5](https://github.com/angular/zone.js/commit/97c03b5)) ## [0.8.9](https://github.com/angular/zone.js/compare/v0.8.8...0.8.9) (2017-04-25) ### Bug Fixes - **patch:** fix [#746](https://github.com/angular/zone.js/issues/746), check desc get is null and only patch window.resize additionally ([#747](https://github.com/angular/zone.js/issues/747)) ([e598310](https://github.com/angular/zone.js/commit/e598310)) ## [0.8.8](https://github.com/angular/zone.js/compare/v0.8.7...0.8.8) (2017-04-21) ### Bug Fixes - on handling broken in v0.8.7 ([fbe7b13](https://github.com/angular/zone.js/commit/fbe7b13)) ## [0.8.7](https://github.com/angular/zone.js/compare/v0.8.5...0.8.7) (2017-04-21) ### Bug Fixes - **doc:** fix typo in document, fix a typescript warning in test ([#732](https://github.com/angular/zone.js/issues/732)) ([55cf064](https://github.com/angular/zone.js/commit/55cf064)) - **error:** fix [#706](https://github.com/angular/zone.js/issues/706), handleError when onHasTask throw error ([#709](https://github.com/angular/zone.js/issues/709)) ([06d1ac0](https://github.com/angular/zone.js/commit/06d1ac0)) - **error:** remove throw in Error constructor to improve performance in IE11 ([#704](https://github.com/angular/zone.js/issues/704)) ([88d1a49](https://github.com/angular/zone.js/commit/88d1a49)), closes [#698](https://github.com/angular/zone.js/issues/698) - **listener:** fix [#616](https://github.com/angular/zone.js/issues/616), webdriver removeEventListener throw permission denied error ([#699](https://github.com/angular/zone.js/issues/699)) ([e02960d](https://github.com/angular/zone.js/commit/e02960d)) - **patch:** fix [#707](https://github.com/angular/zone.js/issues/707), should not try to patch non configurable property ([#717](https://github.com/angular/zone.js/issues/717)) ([e422fb1](https://github.com/angular/zone.js/commit/e422fb1)) - **patch:** fix [#708](https://github.com/angular/zone.js/issues/708), modify the canPatchDescriptor logic when browser don't provide onreadystatechange ([#711](https://github.com/angular/zone.js/issues/711)) ([7d4d07f](https://github.com/angular/zone.js/commit/7d4d07f)) - **patch:** fix [#719](https://github.com/angular/zone.js/issues/719), window onproperty callback this is undefined ([#723](https://github.com/angular/zone.js/issues/723)) ([160531b](https://github.com/angular/zone.js/commit/160531b)) - **task:** fix [#705](https://github.com/angular/zone.js/issues/705), don't json task.data to prevent cyclic error ([#712](https://github.com/angular/zone.js/issues/712)) ([92a39e2](https://github.com/angular/zone.js/commit/92a39e2)) - **test:** fix [#718](https://github.com/angular/zone.js/issues/718), use async test to do unhandle promise rejection test ([#726](https://github.com/angular/zone.js/issues/726)) ([0a06874](https://github.com/angular/zone.js/commit/0a06874)) - **test:** fix websocket test server will crash when test in chrome ([#733](https://github.com/angular/zone.js/issues/733)) ([5090cf9](https://github.com/angular/zone.js/commit/5090cf9)) - **toString:** fix [#666](https://github.com/angular/zone.js/issues/666), Zone patched method toString should like before patched ([#686](https://github.com/angular/zone.js/issues/686)) ([0d0ee53](https://github.com/angular/zone.js/commit/0d0ee53)) - resolve errors with closure ([#722](https://github.com/angular/zone.js/issues/722)) ([51e7ffe](https://github.com/angular/zone.js/commit/51e7ffe)) - **typo:** fix typo, remove extra semicolons, unify api doc ([#697](https://github.com/angular/zone.js/issues/697)) ([967a991](https://github.com/angular/zone.js/commit/967a991)) ### Features - **closure:** fix [#727](https://github.com/angular/zone.js/issues/727), add zone_externs.js for closure compiler ([#731](https://github.com/angular/zone.js/issues/731)) ([b60e9e6](https://github.com/angular/zone.js/commit/b60e9e6)) - **error:** Remove all Zone frames from stack ([#693](https://github.com/angular/zone.js/issues/693)) ([681a017](https://github.com/angular/zone.js/commit/681a017)) - **EventListenerOptions:** fix [#737](https://github.com/angular/zone.js/issues/737), add support to EventListenerOptions ([#738](https://github.com/angular/zone.js/issues/738)) ([a89830d](https://github.com/angular/zone.js/commit/a89830d)) - **patch:** fix [#499](https://github.com/angular/zone.js/issues/499), let promise instance toString active like native ([#734](https://github.com/angular/zone.js/issues/734)) ([2f11e67](https://github.com/angular/zone.js/commit/2f11e67)) ## [0.8.5](https://github.com/angular/zone.js/compare/v0.8.4...0.8.5) (2017-03-21) ### Bug Fixes - add support for subclassing of Errors ([81297ee](https://github.com/angular/zone.js/commit/81297ee)) - improve long-stack-trace stack format detection ([6010557](https://github.com/angular/zone.js/commit/6010557)) - remove left over console.log ([eeaab91](https://github.com/angular/zone.js/commit/eeaab91)) - **event:** fix [#667](https://github.com/angular/zone.js/issues/667), eventHandler should return result ([#682](https://github.com/angular/zone.js/issues/682)) ([5c4e24d](https://github.com/angular/zone.js/commit/5c4e24d)) - **jasmine:** modify jasmine test ifEnvSupports message ([#689](https://github.com/angular/zone.js/issues/689)) ([5635ac0](https://github.com/angular/zone.js/commit/5635ac0)) - **REVERT:** remove zone internal stack frames in error.stack ([#632](https://github.com/angular/zone.js/issues/632)) ([#690](https://github.com/angular/zone.js/issues/690)) ([291d5a0](https://github.com/angular/zone.js/commit/291d5a0)) ### Features - **dom:** fix [#664](https://github.com/angular/zone.js/issues/664), patch window,document,SVGElement onProperties ([#687](https://github.com/angular/zone.js/issues/687)) ([61aee2e](https://github.com/angular/zone.js/commit/61aee2e)) ## [0.8.4](https://github.com/angular/zone.js/compare/v0.8.3...0.8.4) (2017-03-16) ### Bug Fixes - correct declaration which breaks closure ([0e19304](https://github.com/angular/zone.js/commit/0e19304)) - stack rewriting now works with source maps ([bcd09a0](https://github.com/angular/zone.js/commit/bcd09a0)) ## [0.8.3](https://github.com/angular/zone.js/compare/v0.8.1...0.8.3) (2017-03-15) ### Bug Fixes - **zone:** consistent access to **symbol** to work with closure ([f742394](https://github.com/angular/zone.js/commit/f742394)) ## [0.8.2](https://github.com/angular/zone.js/compare/v0.8.1...0.8.2) (2017-03-14) ### Bug Fixes - **zone:** fix [#674](https://github.com/angular/zone.js/issues/674), handle error.stack readonly case ([#675](https://github.com/angular/zone.js/issues/675)) ([8322be8](https://github.com/angular/zone.js/commit/8322be8)) ## [0.8.1](https://github.com/angular/zone.js/compare/v0.8.0...0.8.1) (2017-03-13) ### Bug Fixes - **example:** Update counting.html ([#648](https://github.com/angular/zone.js/issues/648)) ([a63ae5f](https://github.com/angular/zone.js/commit/a63ae5f)) - **XHR:** fix [#671](https://github.com/angular/zone.js/issues/671), patch XMLHttpRequestEventTarget prototype ([300dc36](https://github.com/angular/zone.js/commit/300dc36)) ### Features - **error:** remove zone internal stack frames in error.stack ([#632](https://github.com/angular/zone.js/issues/632)) ([76fa891](https://github.com/angular/zone.js/commit/76fa891)) - **task:** add task lifecycle doc and testcases to explain task state transition. ([#651](https://github.com/angular/zone.js/issues/651)) ([ef39a44](https://github.com/angular/zone.js/commit/ef39a44)) # [0.8.0](https://github.com/angular/zone.js/compare/v0.7.8...0.8.0) (2017-03-10) ### Features - Upgrade TypeScript to v2.2.1 ## [0.7.8](https://github.com/angular/zone.js/compare/v0.7.6...0.7.8) (2017-03-10) ### Bug Fixes - **core:** remove debugger ([#639](https://github.com/angular/zone.js/issues/639)) ([0534b19](https://github.com/angular/zone.js/commit/0534b19)) - **error:** fix [#618](https://github.com/angular/zone.js/issues/618), ZoneAwareError should copy Error's static propeties ([#647](https://github.com/angular/zone.js/issues/647)) ([2d30914](https://github.com/angular/zone.js/commit/2d30914)) - **jasmine:** support "pending" `it` clauses with no test body ([96cb3d0](https://github.com/angular/zone.js/commit/96cb3d0)), closes [#659](https://github.com/angular/zone.js/issues/659) - **minification:** fix [#607](https://github.com/angular/zone.js/issues/607) to change catch variable name to error/err ([#609](https://github.com/angular/zone.js/issues/609)) ([33d0d8d](https://github.com/angular/zone.js/commit/33d0d8d)) - **node:** patch crypto as macroTask and add test cases for crypto, remove http patch ([#612](https://github.com/angular/zone.js/issues/612)) ([9e81037](https://github.com/angular/zone.js/commit/9e81037)) - **package:** use fixed version typescript,clang-format and jasmine ([#650](https://github.com/angular/zone.js/issues/650)) ([84459f1](https://github.com/angular/zone.js/commit/84459f1)) - **patch:** check timer patch return undefined ([#628](https://github.com/angular/zone.js/issues/628)) ([47962df](https://github.com/angular/zone.js/commit/47962df)) - **patch:** fix [#618](https://github.com/angular/zone.js/issues/618), use zoneSymbol as property name to avoid name conflict ([#645](https://github.com/angular/zone.js/issues/645)) ([fcd8be5](https://github.com/angular/zone.js/commit/fcd8be5)) - **task:** findEventTask should return Task array ([#633](https://github.com/angular/zone.js/issues/633)) ([14c7a6f](https://github.com/angular/zone.js/commit/14c7a6f)) - **task:** fix [#638](https://github.com/angular/zone.js/issues/638), eventTask/Periodical task should not be reset after cancel in running state ([#642](https://github.com/angular/zone.js/issues/642)) ([eb9250d](https://github.com/angular/zone.js/commit/eb9250d)) - **timers:** cleanup task reference when exception ([#637](https://github.com/angular/zone.js/issues/637)) ([2594940](https://github.com/angular/zone.js/commit/2594940)) - **webapi:** refactor webapi to not import util.ts directly ([8b2543e](https://github.com/angular/zone.js/commit/8b2543e)), closes [#652](https://github.com/angular/zone.js/issues/652) - **xhr:** fix [#657](https://github.com/angular/zone.js/issues/657), sometimes xhr will fire onreadystatechange with done twice ([#658](https://github.com/angular/zone.js/issues/658)) ([36c0899](https://github.com/angular/zone.js/commit/36c0899)) - **zonespec:** don't throw and exception when setInterval is called within a async test zone ([#641](https://github.com/angular/zone.js/issues/641)) ([c07560f](https://github.com/angular/zone.js/commit/c07560f)) ### Features - add Zone.root api ([#601](https://github.com/angular/zone.js/issues/601)) ([9818139](https://github.com/angular/zone.js/commit/9818139)) - allow tasks to be canceled and rescheduled on different zone in a zone delegate ([#629](https://github.com/angular/zone.js/issues/629)) ([76c6ebf](https://github.com/angular/zone.js/commit/76c6ebf)) - make fetch() zone-aware without triggering extra requests or uncatchable errors. ([#622](https://github.com/angular/zone.js/issues/622)) ([6731ad0](https://github.com/angular/zone.js/commit/6731ad0)) - **bluebird:** patch bluebird promise and treat it as microtask ([#655](https://github.com/angular/zone.js/issues/655)) ([e783bfa](https://github.com/angular/zone.js/commit/e783bfa)) - **electron/nw:** fix [#533](https://github.com/angular/zone.js/issues/533), in electron/nw.js, we may need to patch both browser API and nodejs API, so we need a zone-mix.js to contains both patched API. ([6d31734](https://github.com/angular/zone.js/commit/6d31734)) - **longStackTraceSpec:** handled promise rejection can also render longstacktrace ([#631](https://github.com/angular/zone.js/issues/631)) ([a4c6525](https://github.com/angular/zone.js/commit/a4c6525)) - **promise:** fix [#621](https://github.com/angular/zone.js/issues/621), add unhandledRejection handler and ignore consoleError ([#627](https://github.com/angular/zone.js/issues/627)) ([f3547cc](https://github.com/angular/zone.js/commit/f3547cc)) ## [0.7.6](https://github.com/angular/zone.js/compare/v0.7.4...0.7.6) (2017-01-17) ### Bug Fixes - **doc:** typo in comment and reformat README.md ([#590](https://github.com/angular/zone.js/issues/590)) ([95ad315](https://github.com/angular/zone.js/commit/95ad315)) - **ZoneAwareError:** Error should keep prototype chain and can be called without new ([82722c3](https://github.com/angular/zone.js/commit/82722c3)), closes [#546](https://github.com/angular/zone.js/issues/546) [#554](https://github.com/angular/zone.js/issues/554) [#555](https://github.com/angular/zone.js/issues/555) - [#536](https://github.com/angular/zone.js/issues/536), add notification api patch ([#599](https://github.com/angular/zone.js/issues/599)) ([83dfa97](https://github.com/angular/zone.js/commit/83dfa97)) - [#593](https://github.com/angular/zone.js/issues/593), only call removeAttribute when have the method ([#594](https://github.com/angular/zone.js/issues/594)) ([1401d60](https://github.com/angular/zone.js/commit/1401d60)) - [#595](https://github.com/angular/zone.js/issues/595), refactor ZoneAwareError property copy ([#597](https://github.com/angular/zone.js/issues/597)) ([f7330de](https://github.com/angular/zone.js/commit/f7330de)) - [#604](https://github.com/angular/zone.js/issues/604), sometimes setInterval test spec will fail on Android 4.4 ([#605](https://github.com/angular/zone.js/issues/605)) ([e3cd1f4](https://github.com/angular/zone.js/commit/e3cd1f4)) - add missing test MutationObserver ([5c7bc01](https://github.com/angular/zone.js/commit/5c7bc01)) - Promise.toString() to look like native function ([f854ce0](https://github.com/angular/zone.js/commit/f854ce0)) ## [0.7.5](https://github.com/angular/zone.js/compare/v0.7.4...0.7.5) (2017-01-12) ### Bug Fixes - patch fs methods as macrotask, add test cases of fs watcher ([#572](https://github.com/angular/zone.js/issues/572)) ([e1d3240](https://github.com/angular/zone.js/commit/e1d3240)) - fix [#577](https://github.com/angular/zone.js/issues/577), canPatchViaPropertyDescriptor test should add configurable to XMLHttpRequest.prototype ([#578](https://github.com/angular/zone.js/issues/578)) ([c297752](https://github.com/angular/zone.js/commit/c297752)) - fix [#551](https://github.com/angular/zone.js/issues/551), add toJSON to ZoneTask to prevent cyclic error ([#576](https://github.com/angular/zone.js/issues/576)) ([03d19f9](https://github.com/angular/zone.js/commit/03d19f9)) - fix [#574](https://github.com/angular/zone.js/issues/574), captureStackTrace will have additional stackframe from Zone will break binding.js ([#575](https://github.com/angular/zone.js/issues/575)) ([41f5306](https://github.com/angular/zone.js/commit/41f5306)) - fix [#569](https://github.com/angular/zone.js/issues/569), request will cause updateTaskCount failed if we call abort multipletimes ([#570](https://github.com/angular/zone.js/issues/570)) ([62f1449](https://github.com/angular/zone.js/commit/62f1449)) - add web-api.ts to patch mediaQuery ([#571](https://github.com/angular/zone.js/issues/571)) ([e92f934](https://github.com/angular/zone.js/commit/e92f934)) - fix [#584](https://github.com/angular/zone.js/issues/584), remove android 4.1~4.3, add no-ssl options to make android 4.4 pass test ([#586](https://github.com/angular/zone.js/issues/586)) ([7cd570e](https://github.com/angular/zone.js/commit/7cd570e)) - Fix [#532](https://github.com/angular/zone.js/issues/532), Fix [#566](https://github.com/angular/zone.js/issues/566), add tslint in ci, add tslint/format/test/karma in precommit of git ([#565](https://github.com/angular/zone.js/issues/565)) ([fb8d51c](https://github.com/angular/zone.js/commit/fb8d51c)) - docs(zone.ts): fix typo ([#583](https://github.com/angular/zone.js/issues/583)) ([ecbef87](https://github.com/angular/zone.js/commit/ecbef87)) - add missing test MutationObserver ([5c7bc01](https://github.com/angular/zone.js/commit/5c7bc01)) - Promise.toString() to look like native function ([f854ce0](https://github.com/angular/zone.js/commit/f854ce0)) - **ZoneAwareError:** Error should keep prototype chain and can be called without new ([82722c3](https://github.com/angular/zone.js/commit/82722c3)), closes [#546](https://github.com/angular/zone.js/issues/546) [#554](https://github.com/angular/zone.js/issues/554) [#555](https://github.com/angular/zone.js/issues/555) ## [0.7.4](https://github.com/angular/zone.js/compare/v0.7.1...0.7.4) (2016-12-31) ### Bug Fixes - add better Type safety ([610649b](https://github.com/angular/zone.js/commit/610649b)) - add missing test MutationObserver ([5c7bc01](https://github.com/angular/zone.js/commit/5c7bc01)) - correct currentZone passed into delegate methods ([dc12d8e](https://github.com/angular/zone.js/commit/dc12d8e)), closes [#587](https://github.com/angular/zone.js/issues/587) [#539](https://github.com/angular/zone.js/issues/539) - correct zone.min.js not including zone ([384f5ec](https://github.com/angular/zone.js/commit/384f5ec)) - Correct ZoneAwareError prototype chain ([ba7858c](https://github.com/angular/zone.js/commit/ba7858c)), closes [#546](https://github.com/angular/zone.js/issues/546) [#547](https://github.com/angular/zone.js/issues/547) - formatting issue. ([c70e9ec](https://github.com/angular/zone.js/commit/c70e9ec)) - inline event handler issue ([20b5a5d](https://github.com/angular/zone.js/commit/20b5a5d)), closes [#525](https://github.com/angular/zone.js/issues/525) [#540](https://github.com/angular/zone.js/issues/540) - parameterize `wrap` method on `Zone` ([#542](https://github.com/angular/zone.js/issues/542)) ([f522e1b](https://github.com/angular/zone.js/commit/f522e1b)) - **closure:** avoid property renaming on globals ([af14646](https://github.com/angular/zone.js/commit/af14646)) - Prevent adding listener for xhrhttprequest multiple times ([9509747](https://github.com/angular/zone.js/commit/9509747)), closes [#529](https://github.com/angular/zone.js/issues/529) [#527](https://github.com/angular/zone.js/issues/527) [#287](https://github.com/angular/zone.js/issues/287) [#530](https://github.com/angular/zone.js/issues/530) - Promise.toString() to look like native function ([f854ce0](https://github.com/angular/zone.js/commit/f854ce0)) - **closure:** Fix closure error suppression comment. ([#552](https://github.com/angular/zone.js/issues/552)) ([2643783](https://github.com/angular/zone.js/commit/2643783)) - Run tests on both the build as well as the dist folder ([#514](https://github.com/angular/zone.js/issues/514)) ([c0604f5](https://github.com/angular/zone.js/commit/c0604f5)) - support nw.js environment ([486010b](https://github.com/angular/zone.js/commit/486010b)), closes [#524](https://github.com/angular/zone.js/issues/524) ### Features - Patch captureStackTrace/prepareStackTrace to ZoneAwareError, patch process.nextTick, fix removeAllListeners bug ([#516](https://github.com/angular/zone.js/issues/516)) ([c36c0bc](https://github.com/angular/zone.js/commit/c36c0bc)), closes [#484](https://github.com/angular/zone.js/issues/484) [#491](https://github.com/angular/zone.js/issues/491) ## [0.7.1](https://github.com/angular/zone.js/compare/v0.7.0...v0.7.1) (2016-11-22) ### Bug Fixes - missing zone from the build file ([e961833](https://github.com/angular/zone.js/commit/e961833)) # [0.7.0](https://github.com/angular/zone.js/compare/0.6.25...v0.7.0) (2016-11-22) ### Bug Fixes - **node:** crash when calling listeners() for event with no listeners ([431f6f0](https://github.com/angular/zone.js/commit/431f6f0)) - support clearing the timeouts with numeric IDs ([fea6d68](https://github.com/angular/zone.js/commit/fea6d68)), closes [#461](https://github.com/angular/zone.js/issues/461) - **promise:** include stack trace in an unhandlerd promise ([#463](https://github.com/angular/zone.js/issues/463)) ([737f8d8](https://github.com/angular/zone.js/commit/737f8d8)) - **property-descriptor:** do not use document object in Safari web worker ([51f2e1f](https://github.com/angular/zone.js/commit/51f2e1f)) - Add WebSocket to the NO_EVENT_TARGET list to be patched as well ([#493](https://github.com/angular/zone.js/issues/493)) ([d8c15eb](https://github.com/angular/zone.js/commit/d8c15eb)) - fix wrong usage of == caught by closure compiler ([#510](https://github.com/angular/zone.js/issues/510)) ([d7d8eb5](https://github.com/angular/zone.js/commit/d7d8eb5)) - fluent interface for EventEmitter ([#475](https://github.com/angular/zone.js/issues/475)) ([c5130a6](https://github.com/angular/zone.js/commit/c5130a6)) - lint errors ([ed87c26](https://github.com/angular/zone.js/commit/ed87c26)) - make fetch promise patching safe ([16be7f9](https://github.com/angular/zone.js/commit/16be7f9)), closes [#451](https://github.com/angular/zone.js/issues/451) - Make the check for ZoneAwarePromise more stringent ([#495](https://github.com/angular/zone.js/issues/495)) ([c69df25](https://github.com/angular/zone.js/commit/c69df25)) - run all timers in passage of time in a single fakeAsync's tick call ([a85db4c](https://github.com/angular/zone.js/commit/a85db4c)), closes [#454](https://github.com/angular/zone.js/issues/454) - stop using class extends as it breaks rollup ([b52cf02](https://github.com/angular/zone.js/commit/b52cf02)) - use strict equality in scheduleQueueDrain ([#504](https://github.com/angular/zone.js/issues/504)) ([4b4249c](https://github.com/angular/zone.js/commit/4b4249c)) ### Features - add mocha support ([41a9047](https://github.com/angular/zone.js/commit/41a9047)) - **Error:** Rewrite Error stack frames to include zone ([e1c2a02](https://github.com/angular/zone.js/commit/e1c2a02)) ## [0.6.25](https://github.com/angular/zone.js/compare/0.6.24...0.6.25) (2016-09-20) ### Bug Fixes - **zonespecs:** revert unwrapping of zonespecs which actually require global ([#460](https://github.com/angular/zone.js/issues/460)) ([28a14f8](https://github.com/angular/zone.js/commit/28a14f8)) ## [0.6.24](https://github.com/angular/zone.js/compare/v0.6.23...0.6.24) (2016-09-19) ### Bug Fixes - **bundling:** switch to using umd bundles ([#457](https://github.com/angular/zone.js/issues/457)) ([8dd06e5](https://github.com/angular/zone.js/commit/8dd06e5)), closes [#456](https://github.com/angular/zone.js/issues/456) ## [0.6.23](https://github.com/angular/zone.js/compare/v0.6.22...v0.6.23) (2016-09-14) ### Bug Fixes - **fetch:** correct chrome not able to load about://blank ([3844435](https://github.com/angular/zone.js/commit/3844435)), closes [#444](https://github.com/angular/zone.js/issues/444) ## [0.6.22](https://github.com/angular/zone.js/compare/v0.6.21...v0.6.22) (2016-09-14) ### Bug Fixes - use fetch(about://blank) to prevent exception on MS Edge ([#442](https://github.com/angular/zone.js/issues/442)) ([8b81537](https://github.com/angular/zone.js/commit/8b81537)), closes [#436](https://github.com/angular/zone.js/issues/436) [#439](https://github.com/angular/zone.js/issues/439) ### Features - **node:** patch most fs methods ([#438](https://github.com/angular/zone.js/issues/438)) ([4c8a155](https://github.com/angular/zone.js/commit/4c8a155)) - **node:** patch outgoing http requests to capture the zone ([#430](https://github.com/angular/zone.js/issues/430)) ([100b82b](https://github.com/angular/zone.js/commit/100b82b)) ## [0.6.21](https://github.com/angular/zone.js/compare/v0.6.20...v0.6.21) (2016-09-11) ### Bug Fixes - proper detection of global in WebWorker ([0a7a155](https://github.com/angular/zone.js/commit/0a7a155)) ## [0.6.20](https://github.com/angular/zone.js/compare/v0.6.19...v0.6.20) (2016-09-10) ## [0.6.19](https://github.com/angular/zone.js/compare/v0.6.17...v0.6.19) (2016-09-10) ### Bug Fixes - provide a more useful error when configuring properties ([1fe4df0](https://github.com/angular/zone.js/commit/1fe4df0)) - **jasmine:** propagate all arguments of it/describe/etc... ([a85fd68](https://github.com/angular/zone.js/commit/a85fd68)) - **long-stack:** Safer writing of stack traces. ([6767ff5](https://github.com/angular/zone.js/commit/6767ff5)) - **promise:** support more aggressive optimization. ([#431](https://github.com/angular/zone.js/issues/431)) ([26fc3da](https://github.com/angular/zone.js/commit/26fc3da)) - **XHR:** Don't send sync XHR through ZONE ([6e2f13c](https://github.com/angular/zone.js/commit/6e2f13c)), closes [#377](https://github.com/angular/zone.js/issues/377) ### Features - assert that right ZoneAwarePromise is available ([#420](https://github.com/angular/zone.js/issues/420)) ([4c35e5b](https://github.com/angular/zone.js/commit/4c35e5b)) ## [0.6.17](https://github.com/angular/zone.js/compare/v0.6.15...v0.6.17) (2016-08-22) ### Bug Fixes - **browser:** use XMLHttpRequest.DONE constant on target instead of the global interface ([#395](https://github.com/angular/zone.js/issues/395)) ([3b4c20b](https://github.com/angular/zone.js/commit/3b4c20b)), closes [#394](https://github.com/angular/zone.js/issues/394) - **jasmine:** spelling error of 'describe' in jasmine patch prevented application of sync zone ([d38ccde](https://github.com/angular/zone.js/commit/d38ccde)), closes [#412](https://github.com/angular/zone.js/issues/412) - **patchProperty:** return null as the default value ([#413](https://github.com/angular/zone.js/issues/413)) ([396942b](https://github.com/angular/zone.js/commit/396942b)), closes [#319](https://github.com/angular/zone.js/issues/319) - IE10/11 timeout issues. ([382182c](https://github.com/angular/zone.js/commit/382182c)) ## [0.6.15](https://github.com/angular/zone.js/compare/v0.6.14...v0.6.15) (2016-08-19) ### Bug Fixes - broken build. ([#406](https://github.com/angular/zone.js/issues/406)) ([5e3c207](https://github.com/angular/zone.js/commit/5e3c207)) - **tasks:** do not drain the microtask queue early. ([ff88bb4](https://github.com/angular/zone.js/commit/ff88bb4)) - **tasks:** do not drain the microtask queue early. ([d4a1436](https://github.com/angular/zone.js/commit/d4a1436)) ## [0.6.14](https://github.com/angular/zone.js/compare/v0.6.13...v0.6.14) (2016-08-17) ### Features - **jasmine:** patch jasmine to understand zones. ([3a054be](https://github.com/angular/zone.js/commit/3a054be)) - **trackingZone:** Keep track of tasks to see outstanding tasks. ([4942b4a](https://github.com/angular/zone.js/commit/4942b4a)) ## [0.6.13](https://github.com/angular/zone.js/compare/v0.6.12...v0.6.13) (2016-08-15) ### Bug Fixes - **browser:** make Object.defineProperty patch safer ([#392](https://github.com/angular/zone.js/issues/392)) ([597c634](https://github.com/angular/zone.js/commit/597c634)), closes [#391](https://github.com/angular/zone.js/issues/391) - **browser:** patch Window when EventTarget is missing. ([#368](https://github.com/angular/zone.js/issues/368)) ([fcef80d](https://github.com/angular/zone.js/commit/fcef80d)), closes [#367](https://github.com/angular/zone.js/issues/367) - **browser:** patchTimer cancelAnimationFrame ([#353](https://github.com/angular/zone.js/issues/353)) ([bf77fbb](https://github.com/angular/zone.js/commit/bf77fbb)), closes [#326](https://github.com/angular/zone.js/issues/326) [Leaflet/Leaflet#4588](https://github.com/Leaflet/Leaflet/issues/4588) - **browser:** should not throw with frozen prototypes ([#351](https://github.com/angular/zone.js/issues/351)) ([27ca2a9](https://github.com/angular/zone.js/commit/27ca2a9)) - **build:** fix broken master due to setTimeout not returning a number on node ([d43b4b8](https://github.com/angular/zone.js/commit/d43b4b8)) - **doc:** Fixed the home page example. ([#348](https://github.com/angular/zone.js/issues/348)) ([9a0aa4a](https://github.com/angular/zone.js/commit/9a0aa4a)) - throw if trying to load zone more then once. ([6df5f93](https://github.com/angular/zone.js/commit/6df5f93)) - **fakeAsync:** throw error on rejected promisees. ([fd1dfcc](https://github.com/angular/zone.js/commit/fd1dfcc)) - **promise:** allow Promise subclassing ([dafad98](https://github.com/angular/zone.js/commit/dafad98)) - **XHR.responseBlob:** don't access XHR.responseBlob on old android webkit ([#329](https://github.com/angular/zone.js/issues/329)) ([ed69756](https://github.com/angular/zone.js/commit/ed69756)) ### Features - return timeout Id in ZoneTask.toString (fixes [#341](https://github.com/angular/zone.js/issues/341)) ([80ae6a8](https://github.com/angular/zone.js/commit/80ae6a8)), closes [#375](https://github.com/angular/zone.js/issues/375) - **jasmine:** Switch jasmine patch to use microtask and preserve zone. ([5f519de](https://github.com/angular/zone.js/commit/5f519de)) - **ProxySpec:** create a ProxySpec which can proxy to other ZoneSpecs. ([2d02e39](https://github.com/angular/zone.js/commit/2d02e39)) - **zone:** Add Zone.getZone api ([0621014](https://github.com/angular/zone.js/commit/0621014)) ## [0.6.12](https://github.com/angular/zone.js/compare/v0.6.11...v0.6.12) (2016-04-19) ### Bug Fixes - **property-descriptor:** do not fail for events without targets ([3a8deef](https://github.com/angular/zone.js/commit/3a8deef)) ### Features - Add a zone spec for fake async test zone. ([#330](https://github.com/angular/zone.js/issues/330)) ([34159b4](https://github.com/angular/zone.js/commit/34159b4)) ## [0.6.11](https://github.com/angular/zone.js/compare/v0.6.9...v0.6.11) (2016-04-14) ### Bug Fixes - Suppress closure compiler warnings about unknown 'process' variable. ([e125173](https://github.com/angular/zone.js/commit/e125173)), closes [#295](https://github.com/angular/zone.js/issues/295) - **setTimeout:** fix for [#290](https://github.com/angular/zone.js/issues/290), allow clearTimeout to be called in setTimeout callback ([a6967ad](https://github.com/angular/zone.js/commit/a6967ad)), closes [#301](https://github.com/angular/zone.js/issues/301) - **WebSocket patch:** fix WebSocket constants copy ([#299](https://github.com/angular/zone.js/issues/299)) ([5dc4339](https://github.com/angular/zone.js/commit/5dc4339)) - **xhr:** XHR macrotasks allow abort after XHR has completed ([#311](https://github.com/angular/zone.js/issues/311)) ([c70f011](https://github.com/angular/zone.js/commit/c70f011)) - **zone:** remove debugger statement ([#292](https://github.com/angular/zone.js/issues/292)) ([01cec16](https://github.com/angular/zone.js/commit/01cec16)) - window undefined in node environments ([f8d5dc7](https://github.com/angular/zone.js/commit/f8d5dc7)), closes [#305](https://github.com/angular/zone.js/issues/305) ### Features - **zonespec:** add a spec for synchronous tests ([#294](https://github.com/angular/zone.js/issues/294)) ([55da3d8](https://github.com/angular/zone.js/commit/55da3d8)) - node/node ([29fc5d2](https://github.com/angular/zone.js/commit/29fc5d2)) ## [0.6.9](https://github.com/angular/zone.js/compare/v0.6.5...v0.6.9) (2016-04-04) ### Bug Fixes - Allow calling clearTimeout from within the setTimeout callback ([a8ea55d](https://github.com/angular/zone.js/commit/a8ea55d)), closes [#302](https://github.com/angular/zone.js/issues/302) - Canceling already run task should not double decrement task counter ([faa3485](https://github.com/angular/zone.js/commit/faa3485)), closes [#290](https://github.com/angular/zone.js/issues/290) - **xhr:** don't throw on an xhr which is aborted before sending ([8827e1e](https://github.com/angular/zone.js/commit/8827e1e)) - **zone:** remove debugger statement ([d7c116b](https://github.com/angular/zone.js/commit/d7c116b)) ### Features - **zonespec:** add a spec for synchronous tests ([0a6a434](https://github.com/angular/zone.js/commit/0a6a434)) - treat XHRs as macrotasks ([fd39f97](https://github.com/angular/zone.js/commit/fd39f97)) ## [0.6.5](https://github.com/angular/zone.js/compare/v0.6.2...v0.6.5) (2016-03-21) ### Bug Fixes - disable safari 7 ([4a4d4f6](https://github.com/angular/zone.js/commit/4a4d4f6)) - **browser/utils:** calling removeEventListener twice with the same args should not cause errors ([1787339](https://github.com/angular/zone.js/commit/1787339)), closes [#283](https://github.com/angular/zone.js/issues/283) [#284](https://github.com/angular/zone.js/issues/284) - **patching:** call native cancel method ([5783663](https://github.com/angular/zone.js/commit/5783663)), closes [#278](https://github.com/angular/zone.js/issues/278) [#279](https://github.com/angular/zone.js/issues/279) - **utils:** add the ability to prevent the default action of onEvent (onclick, onpaste,etc..) by returning false. ([99940c3](https://github.com/angular/zone.js/commit/99940c3)), closes [#236](https://github.com/angular/zone.js/issues/236) - **WebSocket patch:** keep WebSocket constants ([f25b087](https://github.com/angular/zone.js/commit/f25b087)), closes [#267](https://github.com/angular/zone.js/issues/267) - **zonespec:** Do not crash on error if last task had no data ([0dba019](https://github.com/angular/zone.js/commit/0dba019)), closes [#281](https://github.com/angular/zone.js/issues/281) ### Features - **indexdb:** Added property patches and event target methods as well as tests for Indexed DB ([84a251f](https://github.com/angular/zone.js/commit/84a251f)), closes [#204](https://github.com/angular/zone.js/issues/204) - **zonespec:** add a spec for asynchronous tests ([aeeb05c](https://github.com/angular/zone.js/commit/aeeb05c)), closes [#275](https://github.com/angular/zone.js/issues/275) ## [0.6.2](https://github.com/angular/zone.js/compare/v0.6.1...v0.6.2) (2016-03-03) ## [0.6.1](https://github.com/angular/zone.js/compare/v0.6.0...v0.6.1) (2016-02-29) # [0.6.0](https://github.com/angular/zone.js/compare/v0.5.15...v0.6.0) (2016-02-29) ### Chores - **everything:** Major Zone Rewrite/Reimplementation ([63d4552](https://github.com/angular/zone.js/commit/63d4552)) ### BREAKING CHANGES - everything: This is a brand new implementation which is not backwards compatible. ## [0.5.15](https://github.com/angular/zone.js/compare/v0.5.14...v0.5.15) (2016-02-17) ### Bug Fixes - **WebWorker:** Patch WebSockets and XMLHttpRequest in WebWorker ([45a6bc1](https://github.com/angular/zone.js/commit/45a6bc1)), closes [#249](https://github.com/angular/zone.js/issues/249) - **WebWorker:** Patch WebSockets and XMLHttpRequest in WebWorker ([9041a3a](https://github.com/angular/zone.js/commit/9041a3a)), closes [#249](https://github.com/angular/zone.js/issues/249) ## [0.5.14](https://github.com/angular/zone.js/compare/v0.5.11...v0.5.14) (2016-02-11) ## [0.5.11](https://github.com/angular/zone.js/compare/v0.5.10...v0.5.11) (2016-01-27) ### Bug Fixes - correct incorrect example path in karma config ([b0a624d](https://github.com/angular/zone.js/commit/b0a624d)) - correct test relaying on jasmine timeout ([4f7d6ae](https://github.com/angular/zone.js/commit/4f7d6ae)) - **WebSocket:** don't patch EventTarget methods twice ([345e56c](https://github.com/angular/zone.js/commit/345e56c)), closes [#235](https://github.com/angular/zone.js/issues/235) ### Features - **wtf:** add wtf support to (set/clear)Timeout/Interval/Immediate ([6659fd5](https://github.com/angular/zone.js/commit/6659fd5)) ## [0.5.10](https://github.com/angular/zone.js/compare/v0.5.9...v0.5.10) (2015-12-11) ### Bug Fixes - **keys:** Do not use Symbol which are broken in Chrome 39.0.2171 (Dartium) ([c48301b](https://github.com/angular/zone.js/commit/c48301b)) - **Promise:** Make sure we check for native Promise before es6-promise gets a chance to polyfill ([fa18d4c](https://github.com/angular/zone.js/commit/fa18d4c)) ## [0.5.9](https://github.com/angular/zone.js/compare/v0.5.8...v0.5.9) (2015-12-09) ### Bug Fixes - **keys:** do not declare functions inside blocks ([d44d699](https://github.com/angular/zone.js/commit/d44d699)), closes [#194](https://github.com/angular/zone.js/issues/194) - **keys:** Symbol is being checked for type of function ([6714be6](https://github.com/angular/zone.js/commit/6714be6)) - **mutation-observe:** output of typeof operator should be string ([19703e3](https://github.com/angular/zone.js/commit/19703e3)) - **util:** origin addEventListener/removeEventListener should be called without eventListener ([26e7f51](https://github.com/angular/zone.js/commit/26e7f51)), closes [#198](https://github.com/angular/zone.js/issues/198) - **utils:** should have no effect when called addEventListener/removeEventListener without eventListener. ([5bcc6ae](https://github.com/angular/zone.js/commit/5bcc6ae)) ## [0.5.8](https://github.com/angular/zone.js/compare/v0.5.7...v0.5.8) (2015-10-06) ### Bug Fixes - **addEventListener:** when called from the global scope ([a23d61a](https://github.com/angular/zone.js/commit/a23d61a)), closes [#190](https://github.com/angular/zone.js/issues/190) - **EventTarget:** apply the patch even if `Window` is not defined ([32c6df9](https://github.com/angular/zone.js/commit/32c6df9)) ## [0.5.7](https://github.com/angular/zone.js/compare/v0.5.6...v0.5.7) (2015-09-29) ### Bug Fixes - **RequestAnimationFrame:** pass the timestamp to the callback ([79a37c0](https://github.com/angular/zone.js/commit/79a37c0)), closes [#187](https://github.com/angular/zone.js/issues/187) ## [0.5.6](https://github.com/angular/zone.js/compare/v0.5.5...v0.5.6) (2015-09-25) ### Bug Fixes - **Jasmine:** add support for jasmine 2 done.fail() ([1d4370b](https://github.com/angular/zone.js/commit/1d4370b)), closes [#180](https://github.com/angular/zone.js/issues/180) - **utils:** fixes event target patch in web workers ([ad5c0c8](https://github.com/angular/zone.js/commit/ad5c0c8)) ## [0.5.5](https://github.com/angular/zone.js/compare/v0.5.4...v0.5.5) (2015-09-11) ### Bug Fixes - **lib/utils:** adds compliant handling of useCapturing param for EventTarget methods ([dd2e1bf](https://github.com/angular/zone.js/commit/dd2e1bf)) - **lib/utils:** fixes incorrect behaviour when re-adding the same event listener fn ([1b804cf](https://github.com/angular/zone.js/commit/1b804cf)) - **longStackTraceZone:** modifies stackFramesFilter to exclude zone.js frames ([50ce9f3](https://github.com/angular/zone.js/commit/50ce9f3)) ### Features - **lib/core:** add/removeEventListener hooks ([1897440](https://github.com/angular/zone.js/commit/1897440)) - **lib/patch/file-reader:** zone-binds FileReader#onEventName listeners ([ce589b9](https://github.com/angular/zone.js/commit/ce589b9)), closes [#137](https://github.com/angular/zone.js/issues/137) ## [0.5.4](https://github.com/angular/zone.js/compare/v0.5.3...v0.5.4) (2015-08-31) ### Bug Fixes - js path in examples ([c7a2ed9](https://github.com/angular/zone.js/commit/c7a2ed9)) - **zone:** fix conflict with Polymer elements ([77b4c0d](https://github.com/angular/zone.js/commit/77b4c0d)) ### Features - **patch:** support requestAnimationFrame time loops ([3d6dc08](https://github.com/angular/zone.js/commit/3d6dc08)) ## [0.5.3](https://github.com/angular/zone.js/compare/v0.5.2...v0.5.3) (2015-08-21) ### Bug Fixes - **addEventListener patch:** ignore FunctionWrapper for IE11 & Edge dev tools ([3b0ca3f](https://github.com/angular/zone.js/commit/3b0ca3f)) - **utils:** event listener patches break when passed an object implementing EventListener ([af88ff8](https://github.com/angular/zone.js/commit/af88ff8)) - **WebWorker:** Fix patching in WebWorker ([2cc59d8](https://github.com/angular/zone.js/commit/2cc59d8)) ### Features - **zone.js:** support Android browser ([93b5555](https://github.com/angular/zone.js/commit/93b5555)) ## [0.5.2](https://github.com/angular/zone.js/compare/v0.5.1...v0.5.2) (2015-07-01) ### Bug Fixes - **jasmine patch:** forward timeout ([2dde717](https://github.com/angular/zone.js/commit/2dde717)) - **zone.bind:** throw an error if arg is not a function ([ee4262a](https://github.com/angular/zone.js/commit/ee4262a)) ## [0.5.1](https://github.com/angular/zone.js/compare/v0.5.0...v0.5.1) (2015-06-10) ### Bug Fixes - **PatchClass:** copy static properties ([b91f8fe](https://github.com/angular/zone.js/commit/b91f8fe)), closes [#127](https://github.com/angular/zone.js/issues/127) - **register-element:** add check for callback being own property of opts ([8bce00e](https://github.com/angular/zone.js/commit/8bce00e)), closes [#52](https://github.com/angular/zone.js/issues/52) ### Features - **fetch:** patch the fetch API ([4d3d524](https://github.com/angular/zone.js/commit/4d3d524)), closes [#108](https://github.com/angular/zone.js/issues/108) - **geolocation:** patch the API ([cd13da1](https://github.com/angular/zone.js/commit/cd13da1)), closes [#113](https://github.com/angular/zone.js/issues/113) - **jasmine:** export the jasmine patch ([639d5e7](https://github.com/angular/zone.js/commit/639d5e7)) - **test:** serve lib/ files instead of dist/ ([f835213](https://github.com/angular/zone.js/commit/f835213)) - **zone.js:** support IE9+ ([554fae0](https://github.com/angular/zone.js/commit/554fae0)) # [0.5.0](https://github.com/angular/zone.js/compare/v0.4.4...v0.5.0) (2015-05-08) ### Bug Fixes - always run jasmine's done callbacks for async tests in jasmine's zone ([b7f3d04](https://github.com/angular/zone.js/commit/b7f3d04)), closes [#91](https://github.com/angular/zone.js/issues/91) - don't fork new zones for callbacks from the root zone ([531d0ec](https://github.com/angular/zone.js/commit/531d0ec)), closes [#92](https://github.com/angular/zone.js/issues/92) - **MutationObserver:** executes hooks in the creation zone ([3122a48](https://github.com/angular/zone.js/commit/3122a48)) - **test:** fix an ineffective assertion ([d85d2cf](https://github.com/angular/zone.js/commit/d85d2cf)) - minor fixes ([18f5511](https://github.com/angular/zone.js/commit/18f5511)) ### Code Refactoring - split zone.js into CJS modules, add zone-microtask.js ([2e52900](https://github.com/angular/zone.js/commit/2e52900)) ### Features - **scheduling:** Prefer MutationObserver over Promise in FF ([038bdd9](https://github.com/angular/zone.js/commit/038bdd9)) - **scheduling:** Support Promise.then() fallbacks to enqueue a microtask ([74eff1c](https://github.com/angular/zone.js/commit/74eff1c)) - add isRootZone api ([bf925bf](https://github.com/angular/zone.js/commit/bf925bf)) - make root zone id to be 1 ([605e213](https://github.com/angular/zone.js/commit/605e213)) ### BREAKING CHANGES - New child zones are now created only from a async task that installed a custom zone. Previously even without a custom zone installed (e.g. LongStacktracesZone), we would spawn new child zones for all asynchronous events. This is undesirable and generally not useful. It does not make sense for us to create new zones for callbacks from the root zone since we care only about callbacks from installed custom zones. This reduces the overhead of zones. This primarily means that LongStackTraces zone won't be able to trace events back to Zone.init(), but instead the starting point will be the installation of the LongStacktracesZone. In all practical situations this should be sufficient. - zone.js as well as \*-zone.js files are moved from / to dist/ ## [0.4.4](https://github.com/angular/zone.js/compare/v0.4.3...v0.4.4) (2015-05-07) ### Bug Fixes - commonjs wrapper ([7b4fdde](https://github.com/angular/zone.js/commit/7b4fdde)), closes [#19](https://github.com/angular/zone.js/issues/19) - fork the zone in first example (README) ([7b6e8ed](https://github.com/angular/zone.js/commit/7b6e8ed)) - prevent aliasing original window reference ([63b42bd](https://github.com/angular/zone.js/commit/63b42bd)) - use strcit mode for the zone.js code only ([16855e5](https://github.com/angular/zone.js/commit/16855e5)) - **test:** use console.log rather than dump in tests ([490e6dd](https://github.com/angular/zone.js/commit/490e6dd)) - **websockets:** patch websockets via descriptors ([d725f46](https://github.com/angular/zone.js/commit/d725f46)), closes [#81](https://github.com/angular/zone.js/issues/81) - **websockets:** properly patch websockets in Safari 7.0 ([3ba6fa1](https://github.com/angular/zone.js/commit/3ba6fa1)), closes [#88](https://github.com/angular/zone.js/issues/88) - **websockets:** properly patch websockets on Safari 7.1 ([1799a20](https://github.com/angular/zone.js/commit/1799a20)) ### Features - add websockets example ([edb17d2](https://github.com/angular/zone.js/commit/edb17d2)) - log a warning if we suspect duplicate Zone install ([657f6fe](https://github.com/angular/zone.js/commit/657f6fe)) ## [0.4.3](https://github.com/angular/zone.js/compare/v0.4.2...v0.4.3) (2015-04-08) ### Bug Fixes - **zone:** keep argument[0] refs around. ([48573ff](https://github.com/angular/zone.js/commit/48573ff)) ## [0.4.2](https://github.com/angular/zone.js/compare/v0.4.1...v0.4.2) (2015-03-27) ### Bug Fixes - **zone.js:** don't make function declaration in block scope ([229fd8f](https://github.com/angular/zone.js/commit/229fd8f)), closes [#53](https://github.com/angular/zone.js/issues/53) [#54](https://github.com/angular/zone.js/issues/54) ### Features - **bindPromiseFn:** add bindPromiseFn method ([643f2ac](https://github.com/angular/zone.js/commit/643f2ac)), closes [#49](https://github.com/angular/zone.js/issues/49) - **lstz:** allow getLongStacktrace to be called with zero args ([26a4dc2](https://github.com/angular/zone.js/commit/26a4dc2)), closes [#47](https://github.com/angular/zone.js/issues/47) - **Zone:** add unique id to each zone ([fb338b6](https://github.com/angular/zone.js/commit/fb338b6)), closes [#45](https://github.com/angular/zone.js/issues/45) ## [0.4.1](https://github.com/angular/zone.js/compare/v0.4.0...v0.4.1) (2015-02-20) ### Bug Fixes - **patchViaPropertyDescriptor:** disable if properties are not configurable ([fb5e644](https://github.com/angular/zone.js/commit/fb5e644)), closes [#42](https://github.com/angular/zone.js/issues/42) # [0.4.0](https://github.com/angular/zone.js/compare/v0.3.0...v0.4.0) (2015-02-04) ### Bug Fixes - **WebSocket:** patch WebSocket instance ([7b8e1e6](https://github.com/angular/zone.js/commit/7b8e1e6)) # [0.3.0](https://github.com/angular/zone.js/compare/v0.2.4...v0.3.0) (2014-06-12) ### Bug Fixes - add events for webgl contexts ([4b6e411](https://github.com/angular/zone.js/commit/4b6e411)) - bind prototype chain callback of custom element descriptor ([136e518](https://github.com/angular/zone.js/commit/136e518)) - dequeue tasks from the zone that enqueued it ([f127fd4](https://github.com/angular/zone.js/commit/f127fd4)) - do not reconfig property descriptors of prototypes ([e9dfbed](https://github.com/angular/zone.js/commit/e9dfbed)) - patch property descriptors in Object.create ([7b7258b](https://github.com/angular/zone.js/commit/7b7258b)), closes [#24](https://github.com/angular/zone.js/issues/24) - support mozRequestAnimationFrame ([886f67d](https://github.com/angular/zone.js/commit/886f67d)) - wrap non-configurable custom element callbacks ([383b479](https://github.com/angular/zone.js/commit/383b479)), closes [#24](https://github.com/angular/zone.js/issues/24) - wrap Object.defineProperties ([f587f17](https://github.com/angular/zone.js/commit/f587f17)), closes [#24](https://github.com/angular/zone.js/issues/24) ## [0.2.4](https://github.com/angular/zone.js/compare/v0.2.3...v0.2.4) (2014-05-23) ## [0.2.3](https://github.com/angular/zone.js/compare/v0.2.2...v0.2.3) (2014-05-23) ### Bug Fixes - remove dump ([45fb7ba](https://github.com/angular/zone.js/commit/45fb7ba)) ## [0.2.2](https://github.com/angular/zone.js/compare/v0.2.1...v0.2.2) (2014-05-22) ### Bug Fixes - correctly detect support for document.registerElement ([ab1d487](https://github.com/angular/zone.js/commit/ab1d487)) - dont automagically dequeue on setInterval ([da99e15](https://github.com/angular/zone.js/commit/da99e15)) - fork should deep clone objects ([21b47ae](https://github.com/angular/zone.js/commit/21b47ae)) - support MutationObserver.disconnect ([ad711b8](https://github.com/angular/zone.js/commit/ad711b8)) ### Features - add stackFramesFilter to longStackTraceZone ([7133de0](https://github.com/angular/zone.js/commit/7133de0)) - expose hooks for enqueuing and dequing tasks ([ba72f34](https://github.com/angular/zone.js/commit/ba72f34)) - improve countingZone and example ([86328fb](https://github.com/angular/zone.js/commit/86328fb)) - support document.registerElement ([d3c785a](https://github.com/angular/zone.js/commit/d3c785a)), closes [#18](https://github.com/angular/zone.js/issues/18) ## [0.2.1](https://github.com/angular/zone.js/compare/v0.2.0...v0.2.1) (2014-04-24) ### Bug Fixes - add support for WebKitMutationObserver ([d1a2c8e](https://github.com/angular/zone.js/commit/d1a2c8e)) - preserve setters when wrapping XMLHttpRequest ([fb46688](https://github.com/angular/zone.js/commit/fb46688)), closes [#17](https://github.com/angular/zone.js/issues/17) # [0.2.0](https://github.com/angular/zone.js/compare/v0.1.1...v0.2.0) (2014-04-17) ### Bug Fixes - patch all properties on the proto chain ([b6d76f0](https://github.com/angular/zone.js/commit/b6d76f0)) - patch MutationObserver ([1c4e85e](https://github.com/angular/zone.js/commit/1c4e85e)) - wrap XMLHttpRequest when we cant patch protos ([76de58e](https://github.com/angular/zone.js/commit/76de58e)) ### Features - add exceptZone ([b134391](https://github.com/angular/zone.js/commit/b134391)) ## [0.1.1](https://github.com/angular/zone.js/compare/v0.1.0...v0.1.1) (2014-03-31) ### Features - add commonjs support ([0fe349e](https://github.com/angular/zone.js/commit/0fe349e)) # [0.1.0](https://github.com/angular/zone.js/compare/v0.0.0...v0.1.0) (2014-03-31) ### Bug Fixes - improve patching browsers with EventTarget ([7d3a8b1](https://github.com/angular/zone.js/commit/7d3a8b1)) - improve stacktrace capture on Safari ([46a6fbc](https://github.com/angular/zone.js/commit/46a6fbc)) - long stack trace test ([01ce3b3](https://github.com/angular/zone.js/commit/01ce3b3)) - prevent calling addEventListener on non-functions ([7acebca](https://github.com/angular/zone.js/commit/7acebca)) - throw if a zone does not define an onError hook ([81d5f49](https://github.com/angular/zone.js/commit/81d5f49)) - throw if a zone does not define an onError hook ([3485c1b](https://github.com/angular/zone.js/commit/3485c1b)) ### Features - add decorator syntax ([c6202a1](https://github.com/angular/zone.js/commit/c6202a1)) - add onZoneCreated hook ([f7badb6](https://github.com/angular/zone.js/commit/f7badb6)) - patch onclick in Chrome and Safari ([7205295](https://github.com/angular/zone.js/commit/7205295)) - refactor and test counting zone ([648a95d](https://github.com/angular/zone.js/commit/648a95d)) - support Promise ([091f44e](https://github.com/angular/zone.js/commit/091f44e)) # 0.0.0 (2013-09-18) H2Fxb/** @license The MIT License Copyright (c) 2010-2025 Google LLC. https://angular.dev/license Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ d-x># Zone.js [![CDNJS](https://img.shields.io/cdnjs/v/zone.js.svg)](https://cdnjs.com/libraries/zone.js) Implements _Zones_ for JavaScript, inspired by [Dart](https://dart.dev/articles/archive/zones). > If you're using zone.js via unpkg (i.e. using `https://unpkg.com/zone.js`) > and you're using any of the following libraries, make sure you import them first > * 'newrelic' as it patches global.Promise before zone.js does > * 'async-listener' as it patches global.setTimeout, global.setInterval before zone.js does > * 'continuation-local-storage' as it uses async-listener ## Development Status of Zone.js As Angular moves towards a zoneless application development model, Zone.js is no longer accepting new features, including additional patches for native platform APIs. The team will also not be accepting any low priority bug fixes. Any critical bug fixes that relate to Angular's direct use of Zone.js will still be accepted. While still a supported part of Angular, the Angular team strongly discourages using Zone.js outside of Angular application contexts. ## NEW Zone.js POST-v0.6.0 See the new API [here](./lib/zone.ts). Read up on [Zone Primer](https://docs.google.com/document/d/1F5Ug0jcrm031vhSMJEOgp1l-Is-Vf0UCNDY-LsQtAIY). ## BREAKING CHANGES since Zone.js v0.11.1 Prior to `v0.11.1`, Zone.js provided two distribution bundle formats in the `dist` folder. They were (1) `ES5` bundle distributed as `zone.js` and (2) `ES2015` bundle distributed as `zone-evergreen.js`. Both of these bundles were in `UMD` format, and are used for Angular's differential-loading mechanism. Starting with `v0.11.1`, Zone.js follows the [Angular Package Format](https://docs.google.com/document/d/1CZC2rcpxffTDfRDs6p1cfbmKNLA6x5O-NtkJglDaBVs). Therefor the new Zone.js file layout is: - `bundles`: `ES5` bundle in `UMD` format. - `fesm2015`: `ES5` bundle in `ESM` format. - `dist`: `ES5` bundle in `UMD` format. This directory is present to keep backward compatibility. If you are using `Angular CLI`, the `polyfills.ts` file will contain: ``` import 'zone.js/dist/zone'; ``` Starting with Zone.js `v0.11.1+` the import changes to: ``` import 'zone.js'; ``` Prior to `v0.11.1` the import would load the `ES5` bundle in `UMD` format from `dist/zone.js`. Starting with `v0.11.1` the import loads the `ES2015` bundle in `ESM` format instead. This is a breaking change for legacy browsers such as `IE11`. For backwards compatibility `zone.js` continues to distribute the same bundles under `dist`. To restore the old behavior import from the `dist` directory instead like so: ``` import 'zone.js/dist/zone'; ``` For details, please refer the [changelog](./CHANGELOG.md) and the [PR](https://github.com/angular/angular/pull/36540). ## What's a Zone? A Zone is an execution context that persists across async tasks. You can think of it as [thread-local storage](https://en.wikipedia.org/wiki/Thread-local_storage) for JavaScript VMs. See this video from ng-conf 2014 for a detailed explanation: [![screenshot of the zone.js presentation and ng-conf 2014](./presentation.png)](//www.youtube.com/watch?v=3IqtmUscE_U&t=150) ## See also * [async-listener](https://github.com/othiym23/async-listener) - a similar library for node * [Async stack traces in Chrome](https://www.html5rocks.com/en/tutorials/developertools/async-call-stack/) * [strongloop/zone](https://github.com/strongloop/zone) (Deprecated) * [vizone](https://github.com/gilbox/vizone) - control flow visualizer that uses zone.js ## Standard API support zone.js patched most standard web APIs (such as DOM events, `XMLHttpRequest`, ...) and nodejs APIs (`EventEmitter`, `fs`, ...), for more details, please see [STANDARD-APIS.md](STANDARD-APIS.md). ## Nonstandard API support We are adding support to some nonstandard APIs, such as MediaQuery and Notification. Please see [NON-STANDARD-APIS.md](NON-STANDARD-APIS.md) for more details. ## Examples You can find some samples to describe how to use zone.js in [SAMPLE.md](SAMPLE.md). ## Modules zone.js patches the async APIs described above, but those patches will have some overhead. Starting from zone.js v0.8.9, you can choose which web API module you want to patch. For more details, please see [MODULE.md](MODULE.md). ## Bundles Starting with `v0.11.0`, `zone.js` uses `Angular Package Format` for bundle distribution. (For backwards compatibility, all bundles can still be accessed from `dist` folder.) |Bundle|Summary| |---|---| |`zone.js`| The default bundle. Contains the most used APIs such as `setTimeout/Promise/EventTarget...`, it also supports differential loading by importing this bundle using `import zone.js`. In legacy browsers it includes some additional patches such as `registerElement` and `EventTarget` like APIs.| |`zone-testing.js`| The bundle for zone testing support of `jasmine` / `mocha` / `jest`. Also includes test utility functions `async` / `fakeAsync` / `sync`.| |`zone-node.js`|The NodeJS support bundle.| |`zone-mix.js`|A mixed bundle which supports both browser and NodeJS. Useful for mixed environment such as Electron.| |`zone-externs.js`|the API definitions for `closure compiler`.| Additional optional patches not included in the `zone.js` bundles which extend functionality. The additional bundles can be found under `zone.js/plugins` folder. To use these bundles, add the following code after importing zone.js bundle. ``` import 'zone.js'; // For example, import canvas patch import 'zone.js/plugins/zone-patch-canvas'; ``` |Patch|Summary| |---|---| |`webapis-media-query.js`|patch for `MediaQuery APIs`| |`webapis-notification.js`|patch for `Notification APIs`| |`webapis-rtc-peer-connection.js`|patch for `RTCPeerConnection APIs`| |`webapis-shadydom.js`|patch for `Shady DOM APIs`| |`zone-bluebird.js`|patch for `Bluebird APIs`| |`zone-error.js`|patch for `Error Global Object`, supports adding zone information to stack frame, and also removing unrelated stack frames from `zone.js` internally| |`zone-patch-canvas.js`|patch for `Canvas API`| |`zone-patch-cordova.js`|patch for `Cordova API`| |`zone-patch-electron.js`|patch for `Electron API`| |`zone-patch-fetch.js`|patch for `Fetch API`| |`zone-patch-jsonp.js`|helper utility for `jsonp API`| |`zone-patch-resize-observer.js`|patch for `ResizeObserver API`| |`zone-patch-rxjs.js`|patch for `rxjs API`| |`zone-patch-rxjs-fake-async.js`|patch for `rxjs fakeasync test`| |`zone-patch-socket-io.js`|patch for `socket-io`| |`zone-patch-user-media.js`|patch for `UserMedia API`| |`zone-patch-message-port.js`|patch for `MessagePort API`| ## License MITx:'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; var global$1 = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { var symbolPrefix = global$1['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } var __global = (typeof window !== 'undefined' && window) || (typeof self !== 'undefined' && self) || global; var AsyncTestZoneSpec = /** @class */ (function () { function AsyncTestZoneSpec(finishCallback, failCallback, namePrefix) { this._pendingMicroTasks = false; this._pendingMacroTasks = false; this._alreadyErrored = false; this._isSync = false; this._existingFinishTimer = null; this.entryFunction = null; this.runZone = Zone.current; this.unresolvedChainedPromiseCount = 0; this.supportWaitUnresolvedChainedPromise = false; this.finishCallback = finishCallback; this.failCallback = failCallback; this.name = 'asyncTestZone for ' + namePrefix; this.properties = { 'AsyncTestZoneSpec': this }; this.supportWaitUnresolvedChainedPromise = __global[__symbol__('supportWaitUnResolvedChainedPromise')] === true; } Object.defineProperty(AsyncTestZoneSpec, "symbolParentUnresolved", { // Needs to be a getter and not a plain property in order run this just-in-time. Otherwise // `__symbol__` would be evaluated during top-level execution prior to the Zone prefix being // changed for tests. get: function () { return __symbol__('parentUnresolved'); }, enumerable: false, configurable: true }); AsyncTestZoneSpec.prototype.isUnresolvedChainedPromisePending = function () { return this.unresolvedChainedPromiseCount > 0; }; AsyncTestZoneSpec.prototype._finishCallbackIfDone = function () { var _this = this; // NOTE: Technically the `onHasTask` could fire together with the initial synchronous // completion in `onInvoke`. `onHasTask` might call this method when it captured e.g. // microtasks in the proxy zone that now complete as part of this async zone run. // Consider the following scenario: // 1. A test `beforeEach` schedules a microtask in the ProxyZone. // 2. An actual empty `it` spec executes in the AsyncTestZone` (using e.g. `waitForAsync`). // 3. The `onInvoke` invokes `_finishCallbackIfDone` because the spec runs synchronously. // 4. We wait the scheduled timeout (see below) to account for unhandled promises. // 5. The microtask from (1) finishes and `onHasTask` is invoked. // --> We register a second `_finishCallbackIfDone` even though we have scheduled a timeout. // If the finish timeout from below is already scheduled, terminate the existing scheduled // finish invocation, avoiding calling `jasmine` `done` multiple times. *Note* that we would // want to schedule a new finish callback in case the task state changes again. if (this._existingFinishTimer !== null) { clearTimeout(this._existingFinishTimer); this._existingFinishTimer = null; } if (!(this._pendingMicroTasks || this._pendingMacroTasks || (this.supportWaitUnresolvedChainedPromise && this.isUnresolvedChainedPromisePending()))) { // We wait until the next tick because we would like to catch unhandled promises which could // cause test logic to be executed. In such cases we cannot finish with tasks pending then. this.runZone.run(function () { _this._existingFinishTimer = setTimeout(function () { if (!_this._alreadyErrored && !(_this._pendingMicroTasks || _this._pendingMacroTasks)) { _this.finishCallback(); } }, 0); }); } }; AsyncTestZoneSpec.prototype.patchPromiseForTest = function () { if (!this.supportWaitUnresolvedChainedPromise) { return; } var patchPromiseForTest = Promise[Zone.__symbol__('patchPromiseForTest')]; if (patchPromiseForTest) { patchPromiseForTest(); } }; AsyncTestZoneSpec.prototype.unPatchPromiseForTest = function () { if (!this.supportWaitUnresolvedChainedPromise) { return; } var unPatchPromiseForTest = Promise[Zone.__symbol__('unPatchPromiseForTest')]; if (unPatchPromiseForTest) { unPatchPromiseForTest(); } }; AsyncTestZoneSpec.prototype.onScheduleTask = function (delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } if (task.type === 'microTask' && task.data && task.data instanceof Promise) { // check whether the promise is a chained promise if (task.data[AsyncTestZoneSpec.symbolParentUnresolved] === true) { // chained promise is being scheduled this.unresolvedChainedPromiseCount--; } } return delegate.scheduleTask(target, task); }; AsyncTestZoneSpec.prototype.onInvokeTask = function (delegate, current, target, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.invokeTask(target, task, applyThis, applyArgs); }; AsyncTestZoneSpec.prototype.onCancelTask = function (delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.cancelTask(target, task); }; // Note - we need to use onInvoke at the moment to call finish when a test is // fully synchronous. TODO(juliemr): remove this when the logic for // onHasTask changes and it calls whenever the task queues are dirty. // updated by(JiaLiPassion), only call finish callback when no task // was scheduled/invoked/canceled. AsyncTestZoneSpec.prototype.onInvoke = function (parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { if (!this.entryFunction) { this.entryFunction = delegate; } try { this._isSync = true; return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } finally { // We need to check the delegate is the same as entryFunction or not. // Consider the following case. // // asyncTestZone.run(() => { // Here the delegate will be the entryFunction // Zone.current.run(() => { // Here the delegate will not be the entryFunction // }); // }); // // We only want to check whether there are async tasks scheduled // for the entry function. if (this._isSync && this.entryFunction === delegate) { this._finishCallbackIfDone(); } } }; AsyncTestZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { // Let the parent try to handle the error. var result = parentZoneDelegate.handleError(targetZone, error); if (result) { this.failCallback(error); this._alreadyErrored = true; } return false; }; AsyncTestZoneSpec.prototype.onHasTask = function (delegate, current, target, hasTaskState) { delegate.hasTask(target, hasTaskState); // We should only trigger finishCallback when the target zone is the AsyncTestZone // Consider the following cases. // // const childZone = asyncTestZone.fork({ // name: 'child', // onHasTask: ... // }); // // So we have nested zones declared the onHasTask hook, in this case, // the onHasTask will be triggered twice, and cause the finishCallbackIfDone() // is also be invoked twice. So we need to only trigger the finishCallbackIfDone() // when the current zone is the same as the target zone. if (current !== target) { return; } if (hasTaskState.change == 'microTask') { this._pendingMicroTasks = hasTaskState.microTask; this._finishCallbackIfDone(); } else if (hasTaskState.change == 'macroTask') { this._pendingMacroTasks = hasTaskState.macroTask; this._finishCallbackIfDone(); } }; return AsyncTestZoneSpec; }()); function patchAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['AsyncTestZoneSpec'] = AsyncTestZoneSpec; Zone.__load_patch('asynctest', function (global, Zone, api) { /** * Wraps a test function in an asynchronous test zone. The test will automatically * complete when all asynchronous calls within this zone are done. */ Zone[api.symbol('asyncTest')] = function asyncTest(fn) { // If we're running using the Jasmine test framework, adapt to call the 'done' // function when asynchronous activity is finished. if (global.jasmine) { // Not using an arrow function to preserve context passed from call site return function (done) { if (!done) { // if we run beforeEach in @angular/core/testing/testing_internal then we get no done // fake it here and assume sync. done = function () { }; done.fail = function (e) { throw e; }; } runInTestZone(fn, this, done, function (err) { if (typeof err === 'string') { return done.fail(new Error(err)); } else { done.fail(err); } }); }; } // Otherwise, return a promise which will resolve when asynchronous activity // is finished. This will be correctly consumed by the Mocha framework with // it('...', async(myFn)); or can be used in a custom framework. // Not using an arrow function to preserve context passed from call site return function () { var _this = this; return new Promise(function (finishCallback, failCallback) { runInTestZone(fn, _this, finishCallback, failCallback); }); }; }; function runInTestZone(fn, context, finishCallback, failCallback) { var currentZone = Zone.current; var AsyncTestZoneSpec = Zone['AsyncTestZoneSpec']; if (AsyncTestZoneSpec === undefined) { throw new Error('AsyncTestZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/async-test'); } var ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/proxy'); } var proxyZoneSpec = ProxyZoneSpec.get(); ProxyZoneSpec.assertPresent(); // We need to create the AsyncTestZoneSpec outside the ProxyZone. // If we do it in ProxyZone then we will get to infinite recursion. var proxyZone = Zone.current.getZoneWith('ProxyZoneSpec'); var previousDelegate = proxyZoneSpec.getDelegate(); proxyZone.parent.run(function () { var testZoneSpec = new AsyncTestZoneSpec(function () { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's // still this one. Otherwise, assume // it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(function () { finishCallback(); }); }, function (error) { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's sill this one. Otherwise, assume it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(function () { failCallback(error); }); }, 'test'); proxyZoneSpec.setDelegate(testZoneSpec); testZoneSpec.patchPromiseForTest(); }); return Zone.current.runGuarded(fn, context); } }); } patchAsyncTest(Zone); })); Ȝx-"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=globalThis;function n(n){return(e.__Zone_symbol_prefix||"__zone_symbol__")+n}var t="undefined"!=typeof window&&window||"undefined"!=typeof self&&self||global,i=function(){function e(e,i,s){this._pendingMicroTasks=!1,this._pendingMacroTasks=!1,this._alreadyErrored=!1,this._isSync=!1,this._existingFinishTimer=null,this.entryFunction=null,this.runZone=Zone.current,this.unresolvedChainedPromiseCount=0,this.supportWaitUnresolvedChainedPromise=!1,this.finishCallback=e,this.failCallback=i,this.name="asyncTestZone for "+s,this.properties={AsyncTestZoneSpec:this},this.supportWaitUnresolvedChainedPromise=!0===t[n("supportWaitUnResolvedChainedPromise")]}return Object.defineProperty(e,"symbolParentUnresolved",{get:function(){return n("parentUnresolved")},enumerable:!1,configurable:!0}),e.prototype.isUnresolvedChainedPromisePending=function(){return this.unresolvedChainedPromiseCount>0},e.prototype._finishCallbackIfDone=function(){var e=this;null!==this._existingFinishTimer&&(clearTimeout(this._existingFinishTimer),this._existingFinishTimer=null),this._pendingMicroTasks||this._pendingMacroTasks||this.supportWaitUnresolvedChainedPromise&&this.isUnresolvedChainedPromisePending()||this.runZone.run((function(){e._existingFinishTimer=setTimeout((function(){e._alreadyErrored||e._pendingMicroTasks||e._pendingMacroTasks||e.finishCallback()}),0)}))},e.prototype.patchPromiseForTest=function(){if(this.supportWaitUnresolvedChainedPromise){var e=Promise[Zone.__symbol__("patchPromiseForTest")];e&&e()}},e.prototype.unPatchPromiseForTest=function(){if(this.supportWaitUnresolvedChainedPromise){var e=Promise[Zone.__symbol__("unPatchPromiseForTest")];e&&e()}},e.prototype.onScheduleTask=function(n,t,i,s){return"eventTask"!==s.type&&(this._isSync=!1),"microTask"===s.type&&s.data&&s.data instanceof Promise&&!0===s.data[e.symbolParentUnresolved]&&this.unresolvedChainedPromiseCount--,n.scheduleTask(i,s)},e.prototype.onInvokeTask=function(e,n,t,i,s,o){return"eventTask"!==i.type&&(this._isSync=!1),e.invokeTask(t,i,s,o)},e.prototype.onCancelTask=function(e,n,t,i){return"eventTask"!==i.type&&(this._isSync=!1),e.cancelTask(t,i)},e.prototype.onInvoke=function(e,n,t,i,s,o,r){this.entryFunction||(this.entryFunction=i);try{return this._isSync=!0,e.invoke(t,i,s,o,r)}finally{this._isSync&&this.entryFunction===i&&this._finishCallbackIfDone()}},e.prototype.onHandleError=function(e,n,t,i){return e.handleError(t,i)&&(this.failCallback(i),this._alreadyErrored=!0),!1},e.prototype.onHasTask=function(e,n,t,i){e.hasTask(t,i),n===t&&("microTask"==i.change?(this._pendingMicroTasks=i.microTask,this._finishCallbackIfDone()):"macroTask"==i.change&&(this._pendingMacroTasks=i.macroTask,this._finishCallbackIfDone()))},e}();!function s(e){e.AsyncTestZoneSpec=i,e.__load_patch("asynctest",(function(e,n,t){function i(e,t,i,s){var o=n.current,r=n.AsyncTestZoneSpec;if(void 0===r)throw new Error("AsyncTestZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/async-test");var a=n.ProxyZoneSpec;if(!a)throw new Error("ProxyZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/proxy");var c=a.get();a.assertPresent();var u=n.current.getZoneWith("ProxyZoneSpec"),h=c.getDelegate();return u.parent.run((function(){var e=new r((function(){c.getDelegate()==e&&c.setDelegate(h),e.unPatchPromiseForTest(),o.run((function(){i()}))}),(function(n){c.getDelegate()==e&&c.setDelegate(h),e.unPatchPromiseForTest(),o.run((function(){s(n)}))}),"test");c.setDelegate(e),e.patchPromiseForTest()})),n.current.runGuarded(e,t)}n[t.symbol("asyncTest")]=function n(t){return e.jasmine?function(e){e||((e=function(){}).fail=function(e){throw e}),i(t,this,e,(function(n){if("string"==typeof n)return e.fail(new Error(n));e.fail(n)}))}:function(){var e=this;return new Promise((function(n,s){i(t,e,n,s)}))}}}))}(Zone)}));DExb'use strict'; var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) { if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { if (ar || !(i in from)) { if (!ar) ar = Array.prototype.slice.call(from, 0, i); ar[i] = from[i]; } } return to.concat(ar || Array.prototype.slice.call(from)); }; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; var global = (typeof window === 'object' && window) || (typeof self === 'object' && self) || globalThis.global; var OriginalDate = global.Date; // Since when we compile this file to `es2015`, and if we define // this `FakeDate` as `class FakeDate`, and then set `FakeDate.prototype` // there will be an error which is `Cannot assign to read only property 'prototype'` // so we need to use function implementation here. function FakeDate() { if (arguments.length === 0) { var d = new OriginalDate(); d.setTime(FakeDate.now()); return d; } else { var args = Array.prototype.slice.call(arguments); return new (OriginalDate.bind.apply(OriginalDate, __spreadArray([void 0], args, false)))(); } } FakeDate.now = function () { var fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncTestZoneSpec) { return fakeAsyncTestZoneSpec.getFakeSystemTime(); } return OriginalDate.now.apply(this, arguments); }; FakeDate.UTC = OriginalDate.UTC; FakeDate.parse = OriginalDate.parse; // keep a reference for zone patched timer function var patchedTimers; var timeoutCallback = function () { }; var Scheduler = /** @class */ (function () { function Scheduler() { // Scheduler queue with the tuple of end time and callback function - sorted by end time. this._schedulerQueue = []; // Current simulated time in millis. this._currentTickTime = 0; // Current fake system base time in millis. this._currentFakeBaseSystemTime = OriginalDate.now(); // track requeuePeriodicTimer this._currentTickRequeuePeriodicEntries = []; } Scheduler.getNextId = function () { var id = patchedTimers.nativeSetTimeout.call(global, timeoutCallback, 0); patchedTimers.nativeClearTimeout.call(global, id); if (typeof id === 'number') { return id; } // in NodeJS, we just use a number for fakeAsync, since it will not // conflict with native TimeoutId return Scheduler.nextNodeJSId++; }; Scheduler.prototype.getCurrentTickTime = function () { return this._currentTickTime; }; Scheduler.prototype.getFakeSystemTime = function () { return this._currentFakeBaseSystemTime + this._currentTickTime; }; Scheduler.prototype.setFakeBaseSystemTime = function (fakeBaseSystemTime) { this._currentFakeBaseSystemTime = fakeBaseSystemTime; }; Scheduler.prototype.getRealSystemTime = function () { return OriginalDate.now(); }; Scheduler.prototype.scheduleFunction = function (cb, delay, options) { options = __assign({ args: [], isPeriodic: false, isRequestAnimationFrame: false, id: -1, isRequeuePeriodic: false, }, options); var currentId = options.id < 0 ? Scheduler.nextId : options.id; Scheduler.nextId = Scheduler.getNextId(); var endTime = this._currentTickTime + delay; // Insert so that scheduler queue remains sorted by end time. var newEntry = { endTime: endTime, id: currentId, func: cb, args: options.args, delay: delay, isPeriodic: options.isPeriodic, isRequestAnimationFrame: options.isRequestAnimationFrame, }; if (options.isRequeuePeriodic) { this._currentTickRequeuePeriodicEntries.push(newEntry); } var i = 0; for (; i < this._schedulerQueue.length; i++) { var currentEntry = this._schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } this._schedulerQueue.splice(i, 0, newEntry); return currentId; }; Scheduler.prototype.removeScheduledFunctionWithId = function (id) { for (var i = 0; i < this._schedulerQueue.length; i++) { if (this._schedulerQueue[i].id == id) { this._schedulerQueue.splice(i, 1); break; } } }; Scheduler.prototype.removeAll = function () { this._schedulerQueue = []; }; Scheduler.prototype.getTimerCount = function () { return this._schedulerQueue.length; }; Scheduler.prototype.tickToNext = function (step, doTick, tickOptions) { if (step === void 0) { step = 1; } if (this._schedulerQueue.length < step) { return; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var targetTask = this._schedulerQueue[step - 1]; this.tick(targetTask.endTime - startTime, doTick, tickOptions); }; Scheduler.prototype.tick = function (millis, doTick, tickOptions) { if (millis === void 0) { millis = 0; } var finalTime = this._currentTickTime + millis; var lastCurrentTime = 0; tickOptions = Object.assign({ processNewMacroTasksSynchronously: true }, tickOptions); // we need to copy the schedulerQueue so nested timeout // will not be wrongly called in the current tick // https://github.com/angular/angular/issues/33799 var schedulerQueue = tickOptions.processNewMacroTasksSynchronously ? this._schedulerQueue : this._schedulerQueue.slice(); if (schedulerQueue.length === 0 && doTick) { doTick(millis); return; } while (schedulerQueue.length > 0) { // clear requeueEntries before each loop this._currentTickRequeuePeriodicEntries = []; var current = schedulerQueue[0]; if (finalTime < current.endTime) { // Done processing the queue since it's sorted by endTime. break; } else { // Time to run scheduled function. Remove it from the head of queue. var current_1 = schedulerQueue.shift(); if (!tickOptions.processNewMacroTasksSynchronously) { var idx = this._schedulerQueue.indexOf(current_1); if (idx >= 0) { this._schedulerQueue.splice(idx, 1); } } lastCurrentTime = this._currentTickTime; this._currentTickTime = current_1.endTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } var retval = current_1.func.apply(global, current_1.isRequestAnimationFrame ? [this._currentTickTime] : current_1.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } // check is there any requeue periodic entry is added in // current loop, if there is, we need to add to current loop if (!tickOptions.processNewMacroTasksSynchronously) { this._currentTickRequeuePeriodicEntries.forEach(function (newEntry) { var i = 0; for (; i < schedulerQueue.length; i++) { var currentEntry = schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } schedulerQueue.splice(i, 0, newEntry); }); } } } lastCurrentTime = this._currentTickTime; this._currentTickTime = finalTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } }; Scheduler.prototype.flushOnlyPendingTimers = function (doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick, { processNewMacroTasksSynchronously: false }); return this._currentTickTime - startTime; }; Scheduler.prototype.flush = function (limit, flushPeriodic, doTick) { if (limit === void 0) { limit = 20; } if (flushPeriodic === void 0) { flushPeriodic = false; } if (flushPeriodic) { return this.flushPeriodic(doTick); } else { return this.flushNonPeriodic(limit, doTick); } }; Scheduler.prototype.flushPeriodic = function (doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick); return this._currentTickTime - startTime; }; Scheduler.prototype.flushNonPeriodic = function (limit, doTick) { var startTime = this._currentTickTime; var lastCurrentTime = 0; var count = 0; while (this._schedulerQueue.length > 0) { count++; if (count > limit) { throw new Error('flush failed after reaching the limit of ' + limit + ' tasks. Does your code use a polling timeout?'); } // flush only non-periodic timers. // If the only remaining tasks are periodic(or requestAnimationFrame), finish flushing. if (this._schedulerQueue.filter(function (task) { return !task.isPeriodic && !task.isRequestAnimationFrame; }) .length === 0) { break; } var current = this._schedulerQueue.shift(); lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { // Update any secondary schedulers like Jasmine mock Date. doTick(this._currentTickTime - lastCurrentTime); } var retval = current.func.apply(global, current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } } return this._currentTickTime - startTime; }; // Next scheduler id. Scheduler.nextNodeJSId = 1; Scheduler.nextId = -1; return Scheduler; }()); var FakeAsyncTestZoneSpec = /** @class */ (function () { function FakeAsyncTestZoneSpec(namePrefix, trackPendingRequestAnimationFrame, macroTaskOptions) { if (trackPendingRequestAnimationFrame === void 0) { trackPendingRequestAnimationFrame = false; } this._scheduler = new Scheduler(); this._microtasks = []; this._lastError = null; this._uncaughtPromiseErrors = Promise[Zone.__symbol__('uncaughtPromiseErrors')]; this.pendingPeriodicTimers = []; this.pendingTimers = []; this.patchDateLocked = false; this.properties = { 'FakeAsyncTestZoneSpec': this }; this.trackPendingRequestAnimationFrame = trackPendingRequestAnimationFrame; this.macroTaskOptions = macroTaskOptions; this.name = 'fakeAsyncTestZone for ' + namePrefix; // in case user can't access the construction of FakeAsyncTestSpec // user can also define macroTaskOptions by define a global variable. if (!this.macroTaskOptions) { this.macroTaskOptions = global[Zone.__symbol__('FakeAsyncTestMacroTask')]; } } FakeAsyncTestZoneSpec.assertInZone = function () { if (Zone.current.get('FakeAsyncTestZoneSpec') == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } }; FakeAsyncTestZoneSpec.prototype._fnAndFlush = function (fn, completers) { var _this = this; return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } fn.apply(global, args); if (_this._lastError === null) { // Success if (completers.onSuccess != null) { completers.onSuccess.apply(global); } // Flush microtasks only on success. _this.flushMicrotasks(); } else { // Failure if (completers.onError != null) { completers.onError.apply(global); } } // Return true if there were no errors, false otherwise. return _this._lastError === null; }; }; FakeAsyncTestZoneSpec._removeTimer = function (timers, id) { var index = timers.indexOf(id); if (index > -1) { timers.splice(index, 1); } }; FakeAsyncTestZoneSpec.prototype._dequeueTimer = function (id) { var _this = this; return function () { FakeAsyncTestZoneSpec._removeTimer(_this.pendingTimers, id); }; }; FakeAsyncTestZoneSpec.prototype._requeuePeriodicTimer = function (fn, interval, args, id) { var _this = this; return function () { // Requeue the timer callback if it's not been canceled. if (_this.pendingPeriodicTimers.indexOf(id) !== -1) { _this._scheduler.scheduleFunction(fn, interval, { args: args, isPeriodic: true, id: id, isRequeuePeriodic: true, }); } }; }; FakeAsyncTestZoneSpec.prototype._dequeuePeriodicTimer = function (id) { var _this = this; return function () { FakeAsyncTestZoneSpec._removeTimer(_this.pendingPeriodicTimers, id); }; }; FakeAsyncTestZoneSpec.prototype._setTimeout = function (fn, delay, args, isTimer) { if (isTimer === void 0) { isTimer = true; } var removeTimerFn = this._dequeueTimer(Scheduler.nextId); // Queue the callback and dequeue the timer on success and error. var cb = this._fnAndFlush(fn, { onSuccess: removeTimerFn, onError: removeTimerFn }); var id = this._scheduler.scheduleFunction(cb, delay, { args: args, isRequestAnimationFrame: !isTimer }); if (isTimer) { this.pendingTimers.push(id); } return id; }; FakeAsyncTestZoneSpec.prototype._clearTimeout = function (id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); this._scheduler.removeScheduledFunctionWithId(id); }; FakeAsyncTestZoneSpec.prototype._setInterval = function (fn, interval, args) { var id = Scheduler.nextId; var completers = { onSuccess: null, onError: this._dequeuePeriodicTimer(id) }; var cb = this._fnAndFlush(fn, completers); // Use the callback created above to requeue on success. completers.onSuccess = this._requeuePeriodicTimer(cb, interval, args, id); // Queue the callback and dequeue the periodic timer only on error. this._scheduler.scheduleFunction(cb, interval, { args: args, isPeriodic: true }); this.pendingPeriodicTimers.push(id); return id; }; FakeAsyncTestZoneSpec.prototype._clearInterval = function (id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); this._scheduler.removeScheduledFunctionWithId(id); }; FakeAsyncTestZoneSpec.prototype._resetLastErrorAndThrow = function () { var error = this._lastError || this._uncaughtPromiseErrors[0]; this._uncaughtPromiseErrors.length = 0; this._lastError = null; throw error; }; FakeAsyncTestZoneSpec.prototype.getCurrentTickTime = function () { return this._scheduler.getCurrentTickTime(); }; FakeAsyncTestZoneSpec.prototype.getFakeSystemTime = function () { return this._scheduler.getFakeSystemTime(); }; FakeAsyncTestZoneSpec.prototype.setFakeBaseSystemTime = function (realTime) { this._scheduler.setFakeBaseSystemTime(realTime); }; FakeAsyncTestZoneSpec.prototype.getRealSystemTime = function () { return this._scheduler.getRealSystemTime(); }; FakeAsyncTestZoneSpec.patchDate = function () { if (!!global[Zone.__symbol__('disableDatePatching')]) { // we don't want to patch global Date // because in some case, global Date // is already being patched, we need to provide // an option to let user still use their // own version of Date. return; } if (global['Date'] === FakeDate) { // already patched return; } global['Date'] = FakeDate; FakeDate.prototype = OriginalDate.prototype; // try check and reset timers // because jasmine.clock().install() may // have replaced the global timer FakeAsyncTestZoneSpec.checkTimerPatch(); }; FakeAsyncTestZoneSpec.resetDate = function () { if (global['Date'] === FakeDate) { global['Date'] = OriginalDate; } }; FakeAsyncTestZoneSpec.checkTimerPatch = function () { if (!patchedTimers) { throw new Error('Expected timers to have been patched.'); } if (global.setTimeout !== patchedTimers.setTimeout) { global.setTimeout = patchedTimers.setTimeout; global.clearTimeout = patchedTimers.clearTimeout; } if (global.setInterval !== patchedTimers.setInterval) { global.setInterval = patchedTimers.setInterval; global.clearInterval = patchedTimers.clearInterval; } }; FakeAsyncTestZoneSpec.prototype.lockDatePatch = function () { this.patchDateLocked = true; FakeAsyncTestZoneSpec.patchDate(); }; FakeAsyncTestZoneSpec.prototype.unlockDatePatch = function () { this.patchDateLocked = false; FakeAsyncTestZoneSpec.resetDate(); }; FakeAsyncTestZoneSpec.prototype.tickToNext = function (steps, doTick, tickOptions) { if (steps === void 0) { steps = 1; } if (tickOptions === void 0) { tickOptions = { processNewMacroTasksSynchronously: true }; } if (steps <= 0) { return; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tickToNext(steps, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } }; FakeAsyncTestZoneSpec.prototype.tick = function (millis, doTick, tickOptions) { if (millis === void 0) { millis = 0; } if (tickOptions === void 0) { tickOptions = { processNewMacroTasksSynchronously: true }; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tick(millis, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } }; FakeAsyncTestZoneSpec.prototype.flushMicrotasks = function () { var _this = this; FakeAsyncTestZoneSpec.assertInZone(); var flushErrors = function () { if (_this._lastError !== null || _this._uncaughtPromiseErrors.length) { // If there is an error stop processing the microtask queue and rethrow the error. _this._resetLastErrorAndThrow(); } }; while (this._microtasks.length > 0) { var microtask = this._microtasks.shift(); microtask.func.apply(microtask.target, microtask.args); } flushErrors(); }; FakeAsyncTestZoneSpec.prototype.flush = function (limit, flushPeriodic, doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); var elapsed = this._scheduler.flush(limit, flushPeriodic, doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; }; FakeAsyncTestZoneSpec.prototype.flushOnlyPendingTimers = function (doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); var elapsed = this._scheduler.flushOnlyPendingTimers(doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; }; FakeAsyncTestZoneSpec.prototype.removeAllTimers = function () { FakeAsyncTestZoneSpec.assertInZone(); this._scheduler.removeAll(); this.pendingPeriodicTimers = []; this.pendingTimers = []; }; FakeAsyncTestZoneSpec.prototype.getTimerCount = function () { return this._scheduler.getTimerCount() + this._microtasks.length; }; FakeAsyncTestZoneSpec.prototype.onScheduleTask = function (delegate, current, target, task) { switch (task.type) { case 'microTask': var args = task.data && task.data.args; // should pass additional arguments to callback if have any // currently we know process.nextTick will have such additional // arguments var additionalArgs = void 0; if (args) { var callbackIndex = task.data.cbIdx; if (typeof args.length === 'number' && args.length > callbackIndex + 1) { additionalArgs = Array.prototype.slice.call(args, callbackIndex + 1); } } this._microtasks.push({ func: task.invoke, args: additionalArgs, target: task.data && task.data.target, }); break; case 'macroTask': switch (task.source) { case 'setTimeout': task.data['handleId'] = this._setTimeout(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'setImmediate': task.data['handleId'] = this._setTimeout(task.invoke, 0, Array.prototype.slice.call(task.data['args'], 1)); break; case 'setInterval': task.data['handleId'] = this._setInterval(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'XMLHttpRequest.send': throw new Error('Cannot make XHRs from within a fake async test. Request URL: ' + task.data['url']); case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': // Simulate a requestAnimationFrame by using a setTimeout with 16 ms. // (60 frames per second) task.data['handleId'] = this._setTimeout(task.invoke, 16, task.data['args'], this.trackPendingRequestAnimationFrame); break; default: // user can define which macroTask they want to support by passing // macroTaskOptions var macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { var args_1 = task.data && task.data['args']; var delay = args_1 && args_1.length > 1 ? args_1[1] : 0; var callbackArgs = macroTaskOption.callbackArgs ? macroTaskOption.callbackArgs : args_1; if (!!macroTaskOption.isPeriodic) { // periodic macroTask, use setInterval to simulate task.data['handleId'] = this._setInterval(task.invoke, delay, callbackArgs); task.data.isPeriodic = true; } else { // not periodic, use setTimeout to simulate task.data['handleId'] = this._setTimeout(task.invoke, delay, callbackArgs); } break; } throw new Error('Unknown macroTask scheduled in fake async test: ' + task.source); } break; case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; }; FakeAsyncTestZoneSpec.prototype.onCancelTask = function (delegate, current, target, task) { switch (task.source) { case 'setTimeout': case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': return this._clearTimeout(task.data['handleId']); case 'setInterval': return this._clearInterval(task.data['handleId']); default: // user can define which macroTask they want to support by passing // macroTaskOptions var macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { var handleId = task.data['handleId']; return macroTaskOption.isPeriodic ? this._clearInterval(handleId) : this._clearTimeout(handleId); } return delegate.cancelTask(target, task); } }; FakeAsyncTestZoneSpec.prototype.onInvoke = function (delegate, current, target, callback, applyThis, applyArgs, source) { try { FakeAsyncTestZoneSpec.patchDate(); return delegate.invoke(target, callback, applyThis, applyArgs, source); } finally { if (!this.patchDateLocked) { FakeAsyncTestZoneSpec.resetDate(); } } }; FakeAsyncTestZoneSpec.prototype.findMacroTaskOption = function (task) { if (!this.macroTaskOptions) { return null; } for (var i = 0; i < this.macroTaskOptions.length; i++) { var macroTaskOption = this.macroTaskOptions[i]; if (macroTaskOption.source === task.source) { return macroTaskOption; } } return null; }; FakeAsyncTestZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { // ComponentFixture has a special-case handling to detect FakeAsyncTestZoneSpec // and prevent rethrowing the error from the onError subscription since it's handled here. this._lastError = error; return false; // Don't propagate error to parent zone. }; return FakeAsyncTestZoneSpec; }()); var _fakeAsyncTestZoneSpec = null; function getProxyZoneSpec() { return Zone && Zone['ProxyZoneSpec']; } var _sharedProxyZoneSpec = null; var _sharedProxyZone = null; /** * Clears out the shared fake async zone for a test. * To be called in a global `beforeEach`. * * @experimental */ function resetFakeAsyncZone() { var _a, _b; if (_fakeAsyncTestZoneSpec) { _fakeAsyncTestZoneSpec.unlockDatePatch(); } _fakeAsyncTestZoneSpec = null; (_b = (_a = getProxyZoneSpec()) === null || _a === void 0 ? void 0 : _a.get()) === null || _b === void 0 ? void 0 : _b.resetDelegate(); _sharedProxyZoneSpec === null || _sharedProxyZoneSpec === void 0 ? void 0 : _sharedProxyZoneSpec.resetDelegate(); } /** * Wraps a function to be executed in the fakeAsync zone: * - microtasks are manually executed by calling `flushMicrotasks()`, * - timers are synchronous, `tick()` simulates the asynchronous passage of time. * * When flush is `false`, if there are any pending timers at the end of the function, * an exception will be thrown. * * Can be used to wrap inject() calls. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @param fn * @param options * flush: when true, will drain the macrotask queue after the test function completes. * @returns The function wrapped to be executed in the fakeAsync zone * * @experimental */ function fakeAsync(fn, options) { if (options === void 0) { options = {}; } var _a = options.flush, flush = _a === void 0 ? true : _a; // Not using an arrow function to preserve context passed from call site var fakeAsyncFn = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } var ProxyZoneSpec = getProxyZoneSpec(); if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the fakeAsync() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } var proxyZoneSpec = ProxyZoneSpec.assertPresent(); if (Zone.current.get('FakeAsyncTestZoneSpec')) { throw new Error('fakeAsync() calls can not be nested'); } try { // in case jasmine.clock init a fakeAsyncTestZoneSpec if (!_fakeAsyncTestZoneSpec) { var FakeAsyncTestZoneSpec_1 = Zone && Zone['FakeAsyncTestZoneSpec']; if (proxyZoneSpec.getDelegate() instanceof FakeAsyncTestZoneSpec_1) { throw new Error('fakeAsync() calls can not be nested'); } _fakeAsyncTestZoneSpec = new FakeAsyncTestZoneSpec_1(); } var res = void 0; var lastProxyZoneSpec = proxyZoneSpec.getDelegate(); proxyZoneSpec.setDelegate(_fakeAsyncTestZoneSpec); _fakeAsyncTestZoneSpec.lockDatePatch(); try { res = fn.apply(this, args); if (flush) { _fakeAsyncTestZoneSpec.flush(20, true); } else { flushMicrotasks(); } } finally { proxyZoneSpec.setDelegate(lastProxyZoneSpec); } if (!flush) { if (_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length > 0) { throw new Error("".concat(_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length, " ") + "periodic timer(s) still in the queue."); } if (_fakeAsyncTestZoneSpec.pendingTimers.length > 0) { throw new Error("".concat(_fakeAsyncTestZoneSpec.pendingTimers.length, " timer(s) still in the queue.")); } } return res; } finally { resetFakeAsyncZone(); } }; fakeAsyncFn.isFakeAsync = true; return fakeAsyncFn; } function _getFakeAsyncZoneSpec() { if (_fakeAsyncTestZoneSpec == null) { _fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (_fakeAsyncTestZoneSpec == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } return _fakeAsyncTestZoneSpec; } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone. * * The microtasks queue is drained at the very start of this function and after any timer * callback has been executed. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @experimental */ function tick(millis, ignoreNestedTimeout) { if (millis === void 0) { millis = 0; } if (ignoreNestedTimeout === void 0) { ignoreNestedTimeout = false; } _getFakeAsyncZoneSpec().tick(millis, null, ignoreNestedTimeout); } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone by * draining the macrotask queue until it is empty. The returned value is the milliseconds * of time that would have been elapsed. * * @param maxTurns * @returns The simulated time elapsed, in millis. * * @experimental */ function flush(maxTurns) { return _getFakeAsyncZoneSpec().flush(maxTurns); } /** * Discard all remaining periodic tasks. * * @experimental */ function discardPeriodicTasks() { var zoneSpec = _getFakeAsyncZoneSpec(); zoneSpec.pendingPeriodicTimers; zoneSpec.pendingPeriodicTimers.length = 0; } /** * Wraps a function to be executed in a shared ProxyZone. * * If no shared ProxyZone exists, one is created and reused for subsequent calls. * Useful for wrapping test setup (beforeEach) and test execution (it) when test * runner patching isn't available or desired for setting up the ProxyZone. * * @param fn The function to wrap. * @returns A function that executes the original function within the shared ProxyZone. * * @experimental */ function withProxyZone(fn) { var autoProxyFn = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } var proxyZoneSpec = getProxyZoneSpec(); if (proxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } var proxyZone = proxyZoneSpec.get() !== undefined ? Zone.current : getOrCreateRootProxy(); return proxyZone.run(fn, this, args); }; return autoProxyFn; } function getOrCreateRootProxy() { var ProxyZoneSpec = getProxyZoneSpec(); if (ProxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for withProxyZone but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } // Ensure the shared ProxyZoneSpec instance exists if (_sharedProxyZoneSpec === null) { _sharedProxyZoneSpec = new ProxyZoneSpec(); } _sharedProxyZone = Zone.root.fork(_sharedProxyZoneSpec); return _sharedProxyZone; } /** * Flush any pending microtasks. * * @experimental */ function flushMicrotasks() { _getFakeAsyncZoneSpec().flushMicrotasks(); } function patchFakeAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['FakeAsyncTestZoneSpec'] = FakeAsyncTestZoneSpec; Zone.__load_patch('fakeasync', function (global, Zone, api) { Zone[api.symbol('fakeAsyncTest')] = { resetFakeAsyncZone: resetFakeAsyncZone, flushMicrotasks: flushMicrotasks, discardPeriodicTasks: discardPeriodicTasks, tick: tick, flush: flush, fakeAsync: fakeAsync, withProxyZone: withProxyZone, }; }, true); patchedTimers = { setTimeout: global.setTimeout, setInterval: global.setInterval, clearTimeout: global.clearTimeout, clearInterval: global.clearInterval, nativeSetTimeout: global[Zone.__symbol__('setTimeout')], nativeClearTimeout: global[Zone.__symbol__('clearTimeout')], }; Scheduler.nextId = Scheduler.getNextId(); } patchFakeAsyncTest(Zone); })); M+x~ 'use strict'function patchSϘvar SU27N function S2!X_runZone = Zone.current; "name = '5-]S@J^J`k0c V_p_ct_ _cc ЈWCannot call ".concat(task.source, " from within a sync test (").concat(this.name, ").")f_cn n?p!p;u o ) Sx }());ޘ{SyncTestZoneSpec'] = Sx patchSyncTest(Zone); })); U)Kxk8"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var t,r=1,i=arguments.length;r * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ !function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e,t="object"==typeof window&&window||"object"==typeof self&&self||globalThis.global,r=t.Date;function i(){if(0===arguments.length){var e=new r;return e.setTime(i.now()),e}var t=Array.prototype.slice.call(arguments);return new(r.bind.apply(r,__spreadArray([void 0],t,!1)))}i.now=function(){var e=Zone.current.get("FakeAsyncTestZoneSpec");return e?e.getFakeSystemTime():r.now.apply(this,arguments)},i.UTC=r.UTC,i.parse=r.parse;var n=function(){},s=function(){function i(){this._schedulerQueue=[],this._currentTickTime=0,this._currentFakeBaseSystemTime=r.now(),this._currentTickRequeuePeriodicEntries=[]}return i.getNextId=function(){var r=e.nativeSetTimeout.call(t,n,0);return e.nativeClearTimeout.call(t,r),"number"==typeof r?r:i.nextNodeJSId++},i.prototype.getCurrentTickTime=function(){return this._currentTickTime},i.prototype.getFakeSystemTime=function(){return this._currentFakeBaseSystemTime+this._currentTickTime},i.prototype.setFakeBaseSystemTime=function(e){this._currentFakeBaseSystemTime=e},i.prototype.getRealSystemTime=function(){return r.now()},i.prototype.scheduleFunction=function(e,t,r){var n=(r=__assign({args:[],isPeriodic:!1,isRequestAnimationFrame:!1,id:-1,isRequeuePeriodic:!1},r)).id<0?i.nextId:r.id;i.nextId=i.getNextId();var s={endTime:this._currentTickTime+t,id:n,func:e,args:r.args,delay:t,isPeriodic:r.isPeriodic,isRequestAnimationFrame:r.isRequestAnimationFrame};r.isRequeuePeriodic&&this._currentTickRequeuePeriodicEntries.push(s);for(var o=0;o0&&(this._currentTickRequeuePeriodicEntries=[],!(n=0&&this._schedulerQueue.splice(c,1)}if(s=this._currentTickTime,this._currentTickTime=a.endTime,r&&r(this._currentTickTime-s),!a.func.apply(t,a.isRequestAnimationFrame?[this._currentTickTime]:a.args))break;i.processNewMacroTasksSynchronously||this._currentTickRequeuePeriodicEntries.forEach((function(e){for(var t=0;t0;){if(++s>e)throw new Error("flush failed after reaching the limit of "+e+" tasks. Does your code use a polling timeout?");if(0===this._schedulerQueue.filter((function(e){return!e.isPeriodic&&!e.isRequestAnimationFrame})).length)break;var o=this._schedulerQueue.shift();if(n=this._currentTickTime,this._currentTickTime=o.endTime,r&&r(this._currentTickTime-n),!o.func.apply(t,o.args))break}return this._currentTickTime-i},i.nextNodeJSId=1,i.nextId=-1,i}(),o=function(){function n(e,r,i){void 0===r&&(r=!1),this._scheduler=new s,this._microtasks=[],this._lastError=null,this._uncaughtPromiseErrors=Promise[Zone.__symbol__("uncaughtPromiseErrors")],this.pendingPeriodicTimers=[],this.pendingTimers=[],this.patchDateLocked=!1,this.properties={FakeAsyncTestZoneSpec:this},this.trackPendingRequestAnimationFrame=r,this.macroTaskOptions=i,this.name="fakeAsyncTestZone for "+e,this.macroTaskOptions||(this.macroTaskOptions=t[Zone.__symbol__("FakeAsyncTestMacroTask")])}return n.assertInZone=function(){if(null==Zone.current.get("FakeAsyncTestZoneSpec"))throw new Error("The code should be running in the fakeAsync zone to call this function")},n.prototype._fnAndFlush=function(e,r){var i=this;return function(){for(var n=[],s=0;s-1&&e.splice(r,1)},n.prototype._dequeueTimer=function(e){var t=this;return function(){n._removeTimer(t.pendingTimers,e)}},n.prototype._requeuePeriodicTimer=function(e,t,r,i){var n=this;return function(){-1!==n.pendingPeriodicTimers.indexOf(i)&&n._scheduler.scheduleFunction(e,t,{args:r,isPeriodic:!0,id:i,isRequeuePeriodic:!0})}},n.prototype._dequeuePeriodicTimer=function(e){var t=this;return function(){n._removeTimer(t.pendingPeriodicTimers,e)}},n.prototype._setTimeout=function(e,t,r,i){void 0===i&&(i=!0);var n=this._dequeueTimer(s.nextId),o=this._fnAndFlush(e,{onSuccess:n,onError:n}),a=this._scheduler.scheduleFunction(o,t,{args:r,isRequestAnimationFrame:!i});return i&&this.pendingTimers.push(a),a},n.prototype._clearTimeout=function(e){n._removeTimer(this.pendingTimers,e),this._scheduler.removeScheduledFunctionWithId(e)},n.prototype._setInterval=function(e,t,r){var i=s.nextId,n={onSuccess:null,onError:this._dequeuePeriodicTimer(i)},o=this._fnAndFlush(e,n);return n.onSuccess=this._requeuePeriodicTimer(o,t,r,i),this._scheduler.scheduleFunction(o,t,{args:r,isPeriodic:!0}),this.pendingPeriodicTimers.push(i),i},n.prototype._clearInterval=function(e){n._removeTimer(this.pendingPeriodicTimers,e),this._scheduler.removeScheduledFunctionWithId(e)},n.prototype._resetLastErrorAndThrow=function(){var e=this._lastError||this._uncaughtPromiseErrors[0];throw this._uncaughtPromiseErrors.length=0,this._lastError=null,e},n.prototype.getCurrentTickTime=function(){return this._scheduler.getCurrentTickTime()},n.prototype.getFakeSystemTime=function(){return this._scheduler.getFakeSystemTime()},n.prototype.setFakeBaseSystemTime=function(e){this._scheduler.setFakeBaseSystemTime(e)},n.prototype.getRealSystemTime=function(){return this._scheduler.getRealSystemTime()},n.patchDate=function(){t[Zone.__symbol__("disableDatePatching")]||t.Date!==i&&(t.Date=i,i.prototype=r.prototype,n.checkTimerPatch())},n.resetDate=function(){t.Date===i&&(t.Date=r)},n.checkTimerPatch=function(){if(!e)throw new Error("Expected timers to have been patched.");t.setTimeout!==e.setTimeout&&(t.setTimeout=e.setTimeout,t.clearTimeout=e.clearTimeout),t.setInterval!==e.setInterval&&(t.setInterval=e.setInterval,t.clearInterval=e.clearInterval)},n.prototype.lockDatePatch=function(){this.patchDateLocked=!0,n.patchDate()},n.prototype.unlockDatePatch=function(){this.patchDateLocked=!1,n.resetDate()},n.prototype.tickToNext=function(e,t,r){void 0===e&&(e=1),void 0===r&&(r={processNewMacroTasksSynchronously:!0}),e<=0||(n.assertInZone(),this.flushMicrotasks(),this._scheduler.tickToNext(e,t,r),null!==this._lastError&&this._resetLastErrorAndThrow())},n.prototype.tick=function(e,t,r){void 0===e&&(e=0),void 0===r&&(r={processNewMacroTasksSynchronously:!0}),n.assertInZone(),this.flushMicrotasks(),this._scheduler.tick(e,t,r),null!==this._lastError&&this._resetLastErrorAndThrow()},n.prototype.flushMicrotasks=function(){var e=this;for(n.assertInZone();this._microtasks.length>0;){var t=this._microtasks.shift();t.func.apply(t.target,t.args)}(null!==e._lastError||e._uncaughtPromiseErrors.length)&&e._resetLastErrorAndThrow()},n.prototype.flush=function(e,t,r){n.assertInZone(),this.flushMicrotasks();var i=this._scheduler.flush(e,t,r);return null!==this._lastError&&this._resetLastErrorAndThrow(),i},n.prototype.flushOnlyPendingTimers=function(e){n.assertInZone(),this.flushMicrotasks();var t=this._scheduler.flushOnlyPendingTimers(e);return null!==this._lastError&&this._resetLastErrorAndThrow(),t},n.prototype.removeAllTimers=function(){n.assertInZone(),this._scheduler.removeAll(),this.pendingPeriodicTimers=[],this.pendingTimers=[]},n.prototype.getTimerCount=function(){return this._scheduler.getTimerCount()+this._microtasks.length},n.prototype.onScheduleTask=function(e,t,r,i){switch(i.type){case"microTask":var n=i.data&&i.data.args,s=void 0;if(n){var o=i.data.cbIdx;"number"==typeof n.length&&n.length>o+1&&(s=Array.prototype.slice.call(n,o+1))}this._microtasks.push({func:i.invoke,args:s,target:i.data&&i.data.target});break;case"macroTask":switch(i.source){case"setTimeout":i.data.handleId=this._setTimeout(i.invoke,i.data.delay,Array.prototype.slice.call(i.data.args,2));break;case"setImmediate":i.data.handleId=this._setTimeout(i.invoke,0,Array.prototype.slice.call(i.data.args,1));break;case"setInterval":i.data.handleId=this._setInterval(i.invoke,i.data.delay,Array.prototype.slice.call(i.data.args,2));break;case"XMLHttpRequest.send":throw new Error("Cannot make XHRs from within a fake async test. Request URL: "+i.data.url);case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":i.data.handleId=this._setTimeout(i.invoke,16,i.data.args,this.trackPendingRequestAnimationFrame);break;default:var a=this.findMacroTaskOption(i);if(a){var c=i.data&&i.data.args,u=c&&c.length>1?c[1]:0,h=a.callbackArgs?a.callbackArgs:c;a.isPeriodic?(i.data.handleId=this._setInterval(i.invoke,u,h),i.data.isPeriodic=!0):i.data.handleId=this._setTimeout(i.invoke,u,h);break}throw new Error("Unknown macroTask scheduled in fake async test: "+i.source)}break;case"eventTask":i=e.scheduleTask(r,i)}return i},n.prototype.onCancelTask=function(e,t,r,i){switch(i.source){case"setTimeout":case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":return this._clearTimeout(i.data.handleId);case"setInterval":return this._clearInterval(i.data.handleId);default:var n=this.findMacroTaskOption(i);if(n){var s=i.data.handleId;return n.isPeriodic?this._clearInterval(s):this._clearTimeout(s)}return e.cancelTask(r,i)}},n.prototype.onInvoke=function(e,t,r,i,s,o,a){try{return n.patchDate(),e.invoke(r,i,s,o,a)}finally{this.patchDateLocked||n.resetDate()}},n.prototype.findMacroTaskOption=function(e){if(!this.macroTaskOptions)return null;for(var t=0;t0)throw new Error("".concat(a.pendingPeriodicTimers.length," ")+"periodic timer(s) still in the queue.");if(a.pendingTimers.length>0)throw new Error("".concat(a.pendingTimers.length," timer(s) still in the queue."))}return u}finally{h()}};return n.isFakeAsync=!0,n}function d(){if(null==a&&null==(a=Zone.current.get("FakeAsyncTestZoneSpec")))throw new Error("The code should be running in the fakeAsync zone to call this function");return a}function m(e,t){void 0===e&&(e=0),void 0===t&&(t=!1),d().tick(e,null,t)}function f(e){return d().flush(e)}function p(){d().pendingPeriodicTimers.length=0}function T(e){return function(){for(var t=[],r=0;r * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchJasmine(Zone) { Zone.__load_patch('jasmine', function (global, Zone, api) { var __extends = function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : ((__.prototype = b.prototype), new __()); }; // Patch jasmine's describe/it/beforeEach/afterEach functions so test code always runs // in a testZone (ProxyZone). (See: angular/zone.js#91 & angular/angular#10503) if (!Zone) throw new Error('Missing: zone.js'); if (typeof jest !== 'undefined') { // return if jasmine is a light implementation inside jest // in this case, we are running inside jest not jasmine return; } if (typeof jasmine == 'undefined' || jasmine['__zone_patch__']) { return; } jasmine['__zone_patch__'] = true; var SyncTestZoneSpec = Zone['SyncTestZoneSpec']; var ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!SyncTestZoneSpec) throw new Error('Missing: SyncTestZoneSpec'); if (!ProxyZoneSpec) throw new Error('Missing: ProxyZoneSpec'); var ambientZone = Zone.current; var symbol = Zone.__symbol__; // whether patch jasmine clock when in fakeAsync var disablePatchingJasmineClock = global[symbol('fakeAsyncDisablePatchingClock')] === true; // the original variable name fakeAsyncPatchLock is not accurate, so the name will be // fakeAsyncAutoFakeAsyncWhenClockPatched and if this enablePatchingJasmineClock is false, we // also automatically disable the auto jump into fakeAsync feature var enableAutoFakeAsyncWhenClockPatched = !disablePatchingJasmineClock && (global[symbol('fakeAsyncPatchLock')] === true || global[symbol('fakeAsyncAutoFakeAsyncWhenClockPatched')] === true); var ignoreUnhandledRejection = global[symbol('ignoreUnhandledRejection')] === true; if (!ignoreUnhandledRejection) { var globalErrors_1 = jasmine.GlobalErrors; if (globalErrors_1 && !jasmine[symbol('GlobalErrors')]) { jasmine[symbol('GlobalErrors')] = globalErrors_1; jasmine.GlobalErrors = function () { var instance = new globalErrors_1(); var originalInstall = instance.install; if (originalInstall && !instance[symbol('install')]) { instance[symbol('install')] = originalInstall; instance.install = function () { var isNode = typeof process !== 'undefined' && !!process.on; // Note: Jasmine checks internally if `process` and `process.on` is defined. // Otherwise, it installs the browser rejection handler through the // `global.addEventListener`. This code may be run in the browser environment where // `process` is not defined, and this will lead to a runtime exception since webpack 5 // removed automatic Node.js polyfills. Note, that events are named differently, it's // `unhandledRejection` in Node.js and `unhandledrejection` in the browser. var originalHandlers = isNode ? process.listeners('unhandledRejection') : global.eventListeners('unhandledrejection'); var result = originalInstall.apply(this, arguments); isNode ? process.removeAllListeners('unhandledRejection') : global.removeAllListeners('unhandledrejection'); if (originalHandlers) { originalHandlers.forEach(function (handler) { if (isNode) { process.on('unhandledRejection', handler); } else { global.addEventListener('unhandledrejection', handler); } }); } return result; }; } return instance; }; } } // Monkey patch all of the jasmine DSL so that each function runs in appropriate zone. var jasmineEnv = jasmine.getEnv(); ['describe', 'xdescribe', 'fdescribe'].forEach(function (methodName) { var originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[methodName] = function (description, specDefinitions) { return originalJasmineFn.call(this, description, wrapDescribeInZone(description, specDefinitions)); }; }); ['it', 'xit', 'fit'].forEach(function (methodName) { var originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (description, specDefinitions, timeout) { arguments[1] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); ['beforeEach', 'afterEach', 'beforeAll', 'afterAll'].forEach(function (methodName) { var originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (specDefinitions, timeout) { arguments[0] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); if (!disablePatchingJasmineClock) { // need to patch jasmine.clock().mockDate and jasmine.clock().tick() so // they can work properly in FakeAsyncTest var originalClockFn_1 = (jasmine[symbol('clock')] = jasmine['clock']); jasmine['clock'] = function () { var clock = originalClockFn_1.apply(this, arguments); if (!clock[symbol('patched')]) { clock[symbol('patched')] = symbol('patched'); var originalTick_1 = (clock[symbol('tick')] = clock.tick); clock.tick = function () { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { return fakeAsyncZoneSpec.tick.apply(fakeAsyncZoneSpec, arguments); } return originalTick_1.apply(this, arguments); }; var originalMockDate_1 = (clock[symbol('mockDate')] = clock.mockDate); clock.mockDate = function () { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { var dateTime = arguments.length > 0 ? arguments[0] : new Date(); return fakeAsyncZoneSpec.setFakeBaseSystemTime.apply(fakeAsyncZoneSpec, dateTime && typeof dateTime.getTime === 'function' ? [dateTime.getTime()] : arguments); } return originalMockDate_1.apply(this, arguments); }; // for auto go into fakeAsync feature, we need the flag to enable it if (enableAutoFakeAsyncWhenClockPatched) { ['install', 'uninstall'].forEach(function (methodName) { var originalClockFn = (clock[symbol(methodName)] = clock[methodName]); clock[methodName] = function () { var FakeAsyncTestZoneSpec = Zone['FakeAsyncTestZoneSpec']; if (FakeAsyncTestZoneSpec) { jasmine[symbol('clockInstalled')] = 'install' === methodName; return; } return originalClockFn.apply(this, arguments); }; }); } } return clock; }; } // monkey patch createSpyObj to make properties enumerable to true if (!jasmine[Zone.__symbol__('createSpyObj')]) { var originalCreateSpyObj_1 = jasmine.createSpyObj; jasmine[Zone.__symbol__('createSpyObj')] = originalCreateSpyObj_1; jasmine.createSpyObj = function () { var args = Array.prototype.slice.call(arguments); var propertyNames = args.length >= 3 ? args[2] : null; var spyObj; if (propertyNames) { var defineProperty_1 = Object.defineProperty; Object.defineProperty = function (obj, p, attributes) { return defineProperty_1.call(this, obj, p, __assign(__assign({}, attributes), { configurable: true, enumerable: true })); }; try { spyObj = originalCreateSpyObj_1.apply(this, args); } finally { Object.defineProperty = defineProperty_1; } } else { spyObj = originalCreateSpyObj_1.apply(this, args); } return spyObj; }; } /** * Gets a function wrapping the body of a Jasmine `describe` block to execute in a * synchronous-only zone. */ function wrapDescribeInZone(description, describeBody) { return function () { // Create a synchronous-only zone in which to run `describe` blocks in order to raise an // error if any asynchronous operations are attempted inside of a `describe`. var syncZone = ambientZone.fork(new SyncTestZoneSpec("jasmine.describe#".concat(description))); return syncZone.run(describeBody, this, arguments); }; } function runInTestZone(testBody, applyThis, queueRunner, done) { var isClockInstalled = !!jasmine[symbol('clockInstalled')]; queueRunner.testProxyZoneSpec; var testProxyZone = queueRunner.testProxyZone; if (isClockInstalled && enableAutoFakeAsyncWhenClockPatched) { // auto run a fakeAsync var fakeAsyncModule = Zone[Zone.__symbol__('fakeAsyncTest')]; if (fakeAsyncModule && typeof fakeAsyncModule.fakeAsync === 'function') { testBody = fakeAsyncModule.fakeAsync(testBody); } } if (done) { return testProxyZone.run(testBody, applyThis, [done]); } else { return testProxyZone.run(testBody, applyThis); } } /** * Gets a function wrapping the body of a Jasmine `it/beforeEach/afterEach` block to * execute in a ProxyZone zone. * This will run in `testProxyZone`. The `testProxyZone` will be reset by the `ZoneQueueRunner` */ function wrapTestInZone(testBody) { // The `done` callback is only passed through if the function expects at least one argument. // Note we have to make a function with correct number of arguments, otherwise jasmine will // think that all functions are sync or async. return (testBody && (testBody.length ? function (done) { return runInTestZone(testBody, this, this.queueRunner, done); } : function () { return runInTestZone(testBody, this, this.queueRunner); })); } var QueueRunner = jasmine.QueueRunner; jasmine.QueueRunner = (function (_super) { __extends(ZoneQueueRunner, _super); function ZoneQueueRunner(attrs) { var _this = this; if (attrs.onComplete) { attrs.onComplete = (function (fn) { return function () { // All functions are done, clear the test zone. _this.testProxyZone = null; _this.testProxyZoneSpec = null; ambientZone.scheduleMicroTask('jasmine.onComplete', fn); }; })(attrs.onComplete); } var nativeSetTimeout = global[Zone.__symbol__('setTimeout')]; var nativeClearTimeout = global[Zone.__symbol__('clearTimeout')]; if (nativeSetTimeout) { // should run setTimeout inside jasmine outside of zone attrs.timeout = { setTimeout: nativeSetTimeout ? nativeSetTimeout : global.setTimeout, clearTimeout: nativeClearTimeout ? nativeClearTimeout : global.clearTimeout, }; } // create a userContext to hold the queueRunner itself // so we can access the testProxy in it/xit/beforeEach ... if (jasmine.UserContext) { if (!attrs.userContext) { attrs.userContext = new jasmine.UserContext(); } attrs.userContext.queueRunner = this; } else { if (!attrs.userContext) { attrs.userContext = {}; } attrs.userContext.queueRunner = this; } // patch attrs.onException var onException = attrs.onException; attrs.onException = function (error) { if (error && error.message === 'Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.') { // jasmine timeout, we can make the error message more // reasonable to tell what tasks are pending var proxyZoneSpec = this && this.testProxyZoneSpec; if (proxyZoneSpec) { var pendingTasksInfo = proxyZoneSpec.getAndClearPendingTasksInfo(); try { // try catch here in case error.message is not writable error.message += pendingTasksInfo; } catch (err) { } } } if (onException) { onException.call(this, error); } }; _super.call(this, attrs); } ZoneQueueRunner.prototype.execute = function () { var _this = this; var zone = Zone.current; var isChildOfAmbientZone = false; while (zone) { if (zone === ambientZone) { isChildOfAmbientZone = true; break; } zone = zone.parent; } if (!isChildOfAmbientZone) throw new Error('Unexpected Zone: ' + Zone.current.name); // This is the zone which will be used for running individual tests. // It will be a proxy zone, so that the tests function can retroactively install // different zones. // Example: // - In beforeEach() do childZone = Zone.current.fork(...); // - In it() try to do fakeAsync(). The issue is that because the beforeEach forked the // zone outside of fakeAsync it will be able to escape the fakeAsync rules. // - Because ProxyZone is parent fo `childZone` fakeAsync can retroactively add // fakeAsync behavior to the childZone. this.testProxyZoneSpec = new ProxyZoneSpec(); this.testProxyZone = ambientZone.fork(this.testProxyZoneSpec); if (!Zone.currentTask) { // if we are not running in a task then if someone would register a // element.addEventListener and then calling element.click() the // addEventListener callback would think that it is the top most task and would // drain the microtask queue on element.click() which would be incorrect. // For this reason we always force a task when running jasmine tests. Zone.current.scheduleMicroTask('jasmine.execute().forceTask', function () { return QueueRunner.prototype.execute.call(_this); }); } else { _super.prototype.execute.call(this); } }; return ZoneQueueRunner; })(QueueRunner); }); } function patchJest(Zone) { Zone.__load_patch('jest', function (context, Zone, api) { if (typeof jest === 'undefined' || jest['__zone_patch__']) { return; } // From jest 29 and jest-preset-angular v13, the module transform logic // changed, and now jest-preset-angular use the use the tsconfig target // other than the hardcoded one, https://github.com/thymikee/jest-preset-angular/issues/2010 // But jest-angular-preset doesn't introduce the @babel/plugin-transform-async-to-generator // which is needed by angular since `async/await` still need to be transformed // to promise for ES2017+ target. // So for now, we disable to output the uncaught error console log for a temp solution, // until jest-preset-angular find a proper solution. Zone[api.symbol('ignoreConsoleErrorUncaughtError')] = true; jest['__zone_patch__'] = true; var ProxyZoneSpec = Zone['ProxyZoneSpec']; var SyncTestZoneSpec = Zone['SyncTestZoneSpec']; if (!ProxyZoneSpec) { throw new Error('Missing ProxyZoneSpec'); } var rootZone = Zone.current; var syncZone = rootZone.fork(new SyncTestZoneSpec('jest.describe')); var proxyZoneSpec = new ProxyZoneSpec(); var proxyZone = rootZone.fork(proxyZoneSpec); function wrapDescribeFactoryInZone(originalJestFn) { return function () { var tableArgs = []; for (var _i = 0; _i < arguments.length; _i++) { tableArgs[_i] = arguments[_i]; } var originalDescribeFn = originalJestFn.apply(this, tableArgs); return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } args[1] = wrapDescribeInZone(args[1]); return originalDescribeFn.apply(this, args); }; }; } function wrapTestFactoryInZone(originalJestFn) { return function () { var tableArgs = []; for (var _i = 0; _i < arguments.length; _i++) { tableArgs[_i] = arguments[_i]; } return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } args[1] = wrapTestInZone(args[1]); return originalJestFn.apply(this, tableArgs).apply(this, args); }; }; } /** * Gets a function wrapping the body of a jest `describe` block to execute in a * synchronous-only zone. */ function wrapDescribeInZone(describeBody) { return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } return syncZone.run(describeBody, this, args); }; } /** * Gets a function wrapping the body of a jest `it/beforeEach/afterEach` block to * execute in a ProxyZone zone. * This will run in the `proxyZone`. */ function wrapTestInZone(testBody, isTestFunc) { if (isTestFunc === void 0) { isTestFunc = false; } if (typeof testBody !== 'function') { return testBody; } var wrappedFunc = function () { if (Zone[api.symbol('useFakeTimersCalled')] === true && testBody && !testBody.isFakeAsync) { // jest.useFakeTimers is called, run into fakeAsyncTest automatically. var fakeAsyncModule = Zone[Zone.__symbol__('fakeAsyncTest')]; if (fakeAsyncModule && typeof fakeAsyncModule.fakeAsync === 'function') { testBody = fakeAsyncModule.fakeAsync(testBody); } } proxyZoneSpec.isTestFunc = isTestFunc; return proxyZone.run(testBody, null, arguments); }; // Update the length of wrappedFunc to be the same as the length of the testBody // So jest core can handle whether the test function has `done()` or not correctly Object.defineProperty(wrappedFunc, 'length', { configurable: true, writable: true, enumerable: false, }); wrappedFunc.length = testBody.length; return wrappedFunc; } ['describe', 'xdescribe', 'fdescribe'].forEach(function (methodName) { var originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } args[1] = wrapDescribeInZone(args[1]); return originalJestFn.apply(this, args); }; context[methodName].each = wrapDescribeFactoryInZone(originalJestFn.each); }); context.describe.only = context.fdescribe; context.describe.skip = context.xdescribe; ['it', 'xit', 'fit', 'test', 'xtest'].forEach(function (methodName) { var originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } args[1] = wrapTestInZone(args[1], true); return originalJestFn.apply(this, args); }; context[methodName].each = wrapTestFactoryInZone(originalJestFn.each); context[methodName].todo = originalJestFn.todo; context[methodName].failing = originalJestFn.failing; }); context.it.only = context.fit; context.it.skip = context.xit; context.test.only = context.fit; context.test.skip = context.xit; ['beforeEach', 'afterEach', 'beforeAll', 'afterAll'].forEach(function (methodName) { var originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } args[0] = wrapTestInZone(args[0]); return originalJestFn.apply(this, args); }; }); Zone.patchJestObject = function patchJestObject(Timer, isModern) { if (isModern === void 0) { isModern = false; } // check whether currently the test is inside fakeAsync() function isPatchingFakeTimer() { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); return !!fakeAsyncZoneSpec; } // check whether the current function is inside `test/it` or other methods // such as `describe/beforeEach` function isInTestFunc() { var proxyZoneSpec = Zone.current.get('ProxyZoneSpec'); return proxyZoneSpec && proxyZoneSpec.isTestFunc; } if (Timer[api.symbol('fakeTimers')]) { return; } Timer[api.symbol('fakeTimers')] = true; // patch jest fakeTimer internal method to make sure no console.warn print out api.patchMethod(Timer, '_checkFakeTimers', function (delegate) { return function (self, args) { if (isPatchingFakeTimer()) { return true; } else { return delegate.apply(self, args); } }; }); // patch useFakeTimers(), set useFakeTimersCalled flag, and make test auto run into fakeAsync api.patchMethod(Timer, 'useFakeTimers', function (delegate) { return function (self, args) { Zone[api.symbol('useFakeTimersCalled')] = true; if (isModern || isInTestFunc()) { return delegate.apply(self, args); } return self; }; }); // patch useRealTimers(), unset useFakeTimers flag api.patchMethod(Timer, 'useRealTimers', function (delegate) { return function (self, args) { Zone[api.symbol('useFakeTimersCalled')] = false; if (isModern || isInTestFunc()) { return delegate.apply(self, args); } return self; }; }); // patch setSystemTime(), call setCurrentRealTime() in the fakeAsyncTest api.patchMethod(Timer, 'setSystemTime', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec && isPatchingFakeTimer()) { fakeAsyncZoneSpec.setFakeBaseSystemTime(args[0]); } else { return delegate.apply(self, args); } }; }); // patch getSystemTime(), call getCurrentRealTime() in the fakeAsyncTest api.patchMethod(Timer, 'getRealSystemTime', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec && isPatchingFakeTimer()) { return fakeAsyncZoneSpec.getRealSystemTime(); } else { return delegate.apply(self, args); } }; }); // patch runAllTicks(), run all microTasks inside fakeAsync api.patchMethod(Timer, 'runAllTicks', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flushMicrotasks(); } else { return delegate.apply(self, args); } }; }); // patch runAllTimers(), run all macroTasks inside fakeAsync api.patchMethod(Timer, 'runAllTimers', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flush(100, true); } else { return delegate.apply(self, args); } }; }); // patch advanceTimersByTime(), call tick() in the fakeAsyncTest api.patchMethod(Timer, 'advanceTimersByTime', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.tick(args[0]); } else { return delegate.apply(self, args); } }; }); // patch runOnlyPendingTimers(), call flushOnlyPendingTimers() in the fakeAsyncTest api.patchMethod(Timer, 'runOnlyPendingTimers', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flushOnlyPendingTimers(); } else { return delegate.apply(self, args); } }; }); // patch advanceTimersToNextTimer(), call tickToNext() in the fakeAsyncTest api.patchMethod(Timer, 'advanceTimersToNextTimer', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.tickToNext(args[0]); } else { return delegate.apply(self, args); } }; }); // patch clearAllTimers(), call removeAllTimers() in the fakeAsyncTest api.patchMethod(Timer, 'clearAllTimers', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.removeAllTimers(); } else { return delegate.apply(self, args); } }; }); // patch getTimerCount(), call getTimerCount() in the fakeAsyncTest api.patchMethod(Timer, 'getTimerCount', function (delegate) { return function (self, args) { var fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { return fakeAsyncZoneSpec.getTimerCount(); } else { return delegate.apply(self, args); } }; }); }; }); } function patchMocha(Zone) { Zone.__load_patch('mocha', function (global, Zone) { var Mocha = global.Mocha; if (typeof Mocha === 'undefined') { // return if Mocha is not available, because now zone-testing // will load mocha patch with jasmine/jest patch return; } if (typeof Zone === 'undefined') { throw new Error('Missing Zone.js'); } var ProxyZoneSpec = Zone['ProxyZoneSpec']; var SyncTestZoneSpec = Zone['SyncTestZoneSpec']; if (!ProxyZoneSpec) { throw new Error('Missing ProxyZoneSpec'); } if (Mocha['__zone_patch__']) { throw new Error('"Mocha" has already been patched with "Zone".'); } Mocha['__zone_patch__'] = true; var rootZone = Zone.current; var syncZone = rootZone.fork(new SyncTestZoneSpec('Mocha.describe')); var testZone = null; var suiteZone = rootZone.fork(new ProxyZoneSpec()); var mochaOriginal = { after: global.after, afterEach: global.afterEach, before: global.before, beforeEach: global.beforeEach, describe: global.describe, it: global.it, }; function modifyArguments(args, syncTest, asyncTest) { var _loop_1 = function (i) { var arg = args[i]; if (typeof arg === 'function') { // The `done` callback is only passed through if the function expects at // least one argument. // Note we have to make a function with correct number of arguments, // otherwise mocha will // think that all functions are sync or async. args[i] = arg.length === 0 ? syncTest(arg) : asyncTest(arg); // Mocha uses toString to view the test body in the result list, make sure we return the // correct function body args[i].toString = function () { return arg.toString(); }; } }; for (var i = 0; i < args.length; i++) { _loop_1(i); } return args; } function wrapDescribeInZone(args) { var syncTest = function (fn) { return function () { return syncZone.run(fn, this, arguments); }; }; return modifyArguments(args, syncTest); } function wrapTestInZone(args) { var asyncTest = function (fn) { return function (done) { return testZone.run(fn, this, [done]); }; }; var syncTest = function (fn) { return function () { return testZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } function wrapSuiteInZone(args) { var asyncTest = function (fn) { return function (done) { return suiteZone.run(fn, this, [done]); }; }; var syncTest = function (fn) { return function () { return suiteZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } global.describe = global.suite = function () { return mochaOriginal.describe.apply(this, wrapDescribeInZone(arguments)); }; global.xdescribe = global.suite.skip = global.describe.skip = function () { return mochaOriginal.describe.skip.apply(this, wrapDescribeInZone(arguments)); }; global.describe.only = global.suite.only = function () { return mochaOriginal.describe.only.apply(this, wrapDescribeInZone(arguments)); }; global.it = global.specify = global.test = function () { return mochaOriginal.it.apply(this, wrapTestInZone(arguments)); }; global.xit = global.xspecify = global.it.skip = function () { return mochaOriginal.it.skip.apply(this, wrapTestInZone(arguments)); }; global.it.only = global.test.only = function () { return mochaOriginal.it.only.apply(this, wrapTestInZone(arguments)); }; global.after = global.suiteTeardown = function () { return mochaOriginal.after.apply(this, wrapSuiteInZone(arguments)); }; global.afterEach = global.teardown = function () { return mochaOriginal.afterEach.apply(this, wrapTestInZone(arguments)); }; global.before = global.suiteSetup = function () { return mochaOriginal.before.apply(this, wrapSuiteInZone(arguments)); }; global.beforeEach = global.setup = function () { return mochaOriginal.beforeEach.apply(this, wrapTestInZone(arguments)); }; (function (originalRunTest, originalRun) { Mocha.Runner.prototype.runTest = function (fn) { var _this = this; Zone.current.scheduleMicroTask('mocha.forceTask', function () { originalRunTest.call(_this, fn); }); }; Mocha.Runner.prototype.run = function (fn) { this.on('test', function (e) { testZone = rootZone.fork(new ProxyZoneSpec()); }); this.on('fail', function (test, err) { var proxyZoneSpec = testZone && testZone.get('ProxyZoneSpec'); if (proxyZoneSpec && err) { try { // try catch here in case err.message is not writable err.message += proxyZoneSpec.getAndClearPendingTasksInfo(); } catch (error) { } } }); return originalRun.call(this, fn); }; })(Mocha.Runner.prototype.runTest, Mocha.Runner.prototype.run); }); } var global$2 = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { var symbolPrefix = global$2['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } var __global = (typeof window !== 'undefined' && window) || (typeof self !== 'undefined' && self) || global; var AsyncTestZoneSpec = /** @class */ (function () { function AsyncTestZoneSpec(finishCallback, failCallback, namePrefix) { this._pendingMicroTasks = false; this._pendingMacroTasks = false; this._alreadyErrored = false; this._isSync = false; this._existingFinishTimer = null; this.entryFunction = null; this.runZone = Zone.current; this.unresolvedChainedPromiseCount = 0; this.supportWaitUnresolvedChainedPromise = false; this.finishCallback = finishCallback; this.failCallback = failCallback; this.name = 'asyncTestZone for ' + namePrefix; this.properties = { 'AsyncTestZoneSpec': this }; this.supportWaitUnresolvedChainedPromise = __global[__symbol__('supportWaitUnResolvedChainedPromise')] === true; } Object.defineProperty(AsyncTestZoneSpec, "symbolParentUnresolved", { // Needs to be a getter and not a plain property in order run this just-in-time. Otherwise // `__symbol__` would be evaluated during top-level execution prior to the Zone prefix being // changed for tests. get: function () { return __symbol__('parentUnresolved'); }, enumerable: false, configurable: true }); AsyncTestZoneSpec.prototype.isUnresolvedChainedPromisePending = function () { return this.unresolvedChainedPromiseCount > 0; }; AsyncTestZoneSpec.prototype._finishCallbackIfDone = function () { var _this = this; // NOTE: Technically the `onHasTask` could fire together with the initial synchronous // completion in `onInvoke`. `onHasTask` might call this method when it captured e.g. // microtasks in the proxy zone that now complete as part of this async zone run. // Consider the following scenario: // 1. A test `beforeEach` schedules a microtask in the ProxyZone. // 2. An actual empty `it` spec executes in the AsyncTestZone` (using e.g. `waitForAsync`). // 3. The `onInvoke` invokes `_finishCallbackIfDone` because the spec runs synchronously. // 4. We wait the scheduled timeout (see below) to account for unhandled promises. // 5. The microtask from (1) finishes and `onHasTask` is invoked. // --> We register a second `_finishCallbackIfDone` even though we have scheduled a timeout. // If the finish timeout from below is already scheduled, terminate the existing scheduled // finish invocation, avoiding calling `jasmine` `done` multiple times. *Note* that we would // want to schedule a new finish callback in case the task state changes again. if (this._existingFinishTimer !== null) { clearTimeout(this._existingFinishTimer); this._existingFinishTimer = null; } if (!(this._pendingMicroTasks || this._pendingMacroTasks || (this.supportWaitUnresolvedChainedPromise && this.isUnresolvedChainedPromisePending()))) { // We wait until the next tick because we would like to catch unhandled promises which could // cause test logic to be executed. In such cases we cannot finish with tasks pending then. this.runZone.run(function () { _this._existingFinishTimer = setTimeout(function () { if (!_this._alreadyErrored && !(_this._pendingMicroTasks || _this._pendingMacroTasks)) { _this.finishCallback(); } }, 0); }); } }; AsyncTestZoneSpec.prototype.patchPromiseForTest = function () { if (!this.supportWaitUnresolvedChainedPromise) { return; } var patchPromiseForTest = Promise[Zone.__symbol__('patchPromiseForTest')]; if (patchPromiseForTest) { patchPromiseForTest(); } }; AsyncTestZoneSpec.prototype.unPatchPromiseForTest = function () { if (!this.supportWaitUnresolvedChainedPromise) { return; } var unPatchPromiseForTest = Promise[Zone.__symbol__('unPatchPromiseForTest')]; if (unPatchPromiseForTest) { unPatchPromiseForTest(); } }; AsyncTestZoneSpec.prototype.onScheduleTask = function (delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } if (task.type === 'microTask' && task.data && task.data instanceof Promise) { // check whether the promise is a chained promise if (task.data[AsyncTestZoneSpec.symbolParentUnresolved] === true) { // chained promise is being scheduled this.unresolvedChainedPromiseCount--; } } return delegate.scheduleTask(target, task); }; AsyncTestZoneSpec.prototype.onInvokeTask = function (delegate, current, target, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.invokeTask(target, task, applyThis, applyArgs); }; AsyncTestZoneSpec.prototype.onCancelTask = function (delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.cancelTask(target, task); }; // Note - we need to use onInvoke at the moment to call finish when a test is // fully synchronous. TODO(juliemr): remove this when the logic for // onHasTask changes and it calls whenever the task queues are dirty. // updated by(JiaLiPassion), only call finish callback when no task // was scheduled/invoked/canceled. AsyncTestZoneSpec.prototype.onInvoke = function (parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { if (!this.entryFunction) { this.entryFunction = delegate; } try { this._isSync = true; return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } finally { // We need to check the delegate is the same as entryFunction or not. // Consider the following case. // // asyncTestZone.run(() => { // Here the delegate will be the entryFunction // Zone.current.run(() => { // Here the delegate will not be the entryFunction // }); // }); // // We only want to check whether there are async tasks scheduled // for the entry function. if (this._isSync && this.entryFunction === delegate) { this._finishCallbackIfDone(); } } }; AsyncTestZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { // Let the parent try to handle the error. var result = parentZoneDelegate.handleError(targetZone, error); if (result) { this.failCallback(error); this._alreadyErrored = true; } return false; }; AsyncTestZoneSpec.prototype.onHasTask = function (delegate, current, target, hasTaskState) { delegate.hasTask(target, hasTaskState); // We should only trigger finishCallback when the target zone is the AsyncTestZone // Consider the following cases. // // const childZone = asyncTestZone.fork({ // name: 'child', // onHasTask: ... // }); // // So we have nested zones declared the onHasTask hook, in this case, // the onHasTask will be triggered twice, and cause the finishCallbackIfDone() // is also be invoked twice. So we need to only trigger the finishCallbackIfDone() // when the current zone is the same as the target zone. if (current !== target) { return; } if (hasTaskState.change == 'microTask') { this._pendingMicroTasks = hasTaskState.microTask; this._finishCallbackIfDone(); } else if (hasTaskState.change == 'macroTask') { this._pendingMacroTasks = hasTaskState.macroTask; this._finishCallbackIfDone(); } }; return AsyncTestZoneSpec; }()); function patchAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['AsyncTestZoneSpec'] = AsyncTestZoneSpec; Zone.__load_patch('asynctest', function (global, Zone, api) { /** * Wraps a test function in an asynchronous test zone. The test will automatically * complete when all asynchronous calls within this zone are done. */ Zone[api.symbol('asyncTest')] = function asyncTest(fn) { // If we're running using the Jasmine test framework, adapt to call the 'done' // function when asynchronous activity is finished. if (global.jasmine) { // Not using an arrow function to preserve context passed from call site return function (done) { if (!done) { // if we run beforeEach in @angular/core/testing/testing_internal then we get no done // fake it here and assume sync. done = function () { }; done.fail = function (e) { throw e; }; } runInTestZone(fn, this, done, function (err) { if (typeof err === 'string') { return done.fail(new Error(err)); } else { done.fail(err); } }); }; } // Otherwise, return a promise which will resolve when asynchronous activity // is finished. This will be correctly consumed by the Mocha framework with // it('...', async(myFn)); or can be used in a custom framework. // Not using an arrow function to preserve context passed from call site return function () { var _this = this; return new Promise(function (finishCallback, failCallback) { runInTestZone(fn, _this, finishCallback, failCallback); }); }; }; function runInTestZone(fn, context, finishCallback, failCallback) { var currentZone = Zone.current; var AsyncTestZoneSpec = Zone['AsyncTestZoneSpec']; if (AsyncTestZoneSpec === undefined) { throw new Error('AsyncTestZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/async-test'); } var ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/proxy'); } var proxyZoneSpec = ProxyZoneSpec.get(); ProxyZoneSpec.assertPresent(); // We need to create the AsyncTestZoneSpec outside the ProxyZone. // If we do it in ProxyZone then we will get to infinite recursion. var proxyZone = Zone.current.getZoneWith('ProxyZoneSpec'); var previousDelegate = proxyZoneSpec.getDelegate(); proxyZone.parent.run(function () { var testZoneSpec = new AsyncTestZoneSpec(function () { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's // still this one. Otherwise, assume // it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(function () { finishCallback(); }); }, function (error) { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's sill this one. Otherwise, assume it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(function () { failCallback(error); }); }, 'test'); proxyZoneSpec.setDelegate(testZoneSpec); testZoneSpec.patchPromiseForTest(); }); return Zone.current.runGuarded(fn, context); } }); } var global$1 = (typeof window === 'object' && window) || (typeof self === 'object' && self) || globalThis.global; var OriginalDate = global$1.Date; // Since when we compile this file to `es2015`, and if we define // this `FakeDate` as `class FakeDate`, and then set `FakeDate.prototype` // there will be an error which is `Cannot assign to read only property 'prototype'` // so we need to use function implementation here. function FakeDate() { if (arguments.length === 0) { var d = new OriginalDate(); d.setTime(FakeDate.now()); return d; } else { var args = Array.prototype.slice.call(arguments); return new (OriginalDate.bind.apply(OriginalDate, __spreadArray([void 0], args, false)))(); } } FakeDate.now = function () { var fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncTestZoneSpec) { return fakeAsyncTestZoneSpec.getFakeSystemTime(); } return OriginalDate.now.apply(this, arguments); }; FakeDate.UTC = OriginalDate.UTC; FakeDate.parse = OriginalDate.parse; // keep a reference for zone patched timer function var patchedTimers; var timeoutCallback = function () { }; var Scheduler = /** @class */ (function () { function Scheduler() { // Scheduler queue with the tuple of end time and callback function - sorted by end time. this._schedulerQueue = []; // Current simulated time in millis. this._currentTickTime = 0; // Current fake system base time in millis. this._currentFakeBaseSystemTime = OriginalDate.now(); // track requeuePeriodicTimer this._currentTickRequeuePeriodicEntries = []; } Scheduler.getNextId = function () { var id = patchedTimers.nativeSetTimeout.call(global$1, timeoutCallback, 0); patchedTimers.nativeClearTimeout.call(global$1, id); if (typeof id === 'number') { return id; } // in NodeJS, we just use a number for fakeAsync, since it will not // conflict with native TimeoutId return Scheduler.nextNodeJSId++; }; Scheduler.prototype.getCurrentTickTime = function () { return this._currentTickTime; }; Scheduler.prototype.getFakeSystemTime = function () { return this._currentFakeBaseSystemTime + this._currentTickTime; }; Scheduler.prototype.setFakeBaseSystemTime = function (fakeBaseSystemTime) { this._currentFakeBaseSystemTime = fakeBaseSystemTime; }; Scheduler.prototype.getRealSystemTime = function () { return OriginalDate.now(); }; Scheduler.prototype.scheduleFunction = function (cb, delay, options) { options = __assign({ args: [], isPeriodic: false, isRequestAnimationFrame: false, id: -1, isRequeuePeriodic: false, }, options); var currentId = options.id < 0 ? Scheduler.nextId : options.id; Scheduler.nextId = Scheduler.getNextId(); var endTime = this._currentTickTime + delay; // Insert so that scheduler queue remains sorted by end time. var newEntry = { endTime: endTime, id: currentId, func: cb, args: options.args, delay: delay, isPeriodic: options.isPeriodic, isRequestAnimationFrame: options.isRequestAnimationFrame, }; if (options.isRequeuePeriodic) { this._currentTickRequeuePeriodicEntries.push(newEntry); } var i = 0; for (; i < this._schedulerQueue.length; i++) { var currentEntry = this._schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } this._schedulerQueue.splice(i, 0, newEntry); return currentId; }; Scheduler.prototype.removeScheduledFunctionWithId = function (id) { for (var i = 0; i < this._schedulerQueue.length; i++) { if (this._schedulerQueue[i].id == id) { this._schedulerQueue.splice(i, 1); break; } } }; Scheduler.prototype.removeAll = function () { this._schedulerQueue = []; }; Scheduler.prototype.getTimerCount = function () { return this._schedulerQueue.length; }; Scheduler.prototype.tickToNext = function (step, doTick, tickOptions) { if (step === void 0) { step = 1; } if (this._schedulerQueue.length < step) { return; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var targetTask = this._schedulerQueue[step - 1]; this.tick(targetTask.endTime - startTime, doTick, tickOptions); }; Scheduler.prototype.tick = function (millis, doTick, tickOptions) { if (millis === void 0) { millis = 0; } var finalTime = this._currentTickTime + millis; var lastCurrentTime = 0; tickOptions = Object.assign({ processNewMacroTasksSynchronously: true }, tickOptions); // we need to copy the schedulerQueue so nested timeout // will not be wrongly called in the current tick // https://github.com/angular/angular/issues/33799 var schedulerQueue = tickOptions.processNewMacroTasksSynchronously ? this._schedulerQueue : this._schedulerQueue.slice(); if (schedulerQueue.length === 0 && doTick) { doTick(millis); return; } while (schedulerQueue.length > 0) { // clear requeueEntries before each loop this._currentTickRequeuePeriodicEntries = []; var current = schedulerQueue[0]; if (finalTime < current.endTime) { // Done processing the queue since it's sorted by endTime. break; } else { // Time to run scheduled function. Remove it from the head of queue. var current_1 = schedulerQueue.shift(); if (!tickOptions.processNewMacroTasksSynchronously) { var idx = this._schedulerQueue.indexOf(current_1); if (idx >= 0) { this._schedulerQueue.splice(idx, 1); } } lastCurrentTime = this._currentTickTime; this._currentTickTime = current_1.endTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } var retval = current_1.func.apply(global$1, current_1.isRequestAnimationFrame ? [this._currentTickTime] : current_1.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } // check is there any requeue periodic entry is added in // current loop, if there is, we need to add to current loop if (!tickOptions.processNewMacroTasksSynchronously) { }ǂ8 this._currentTickRequeuePeriodicEntries.forEach(function (newEntry) { var i = 0; for (; i < schedulerQueue.length; i++) { var currentEntry = schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } schedulerQueue.splice(i, 0, newEntry); }); } } } lastCurrentTime = this._currentTickTime; this._currentTickTime = finalTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } }; Scheduler.prototype.flushOnlyPendingTimers = function (doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick, { processNewMacroTasksSynchronously: false }); return this._currentTickTime - startTime; }; Scheduler.prototype.flush = function (limit, flushPeriodic, doTick) { if (limit === void 0) { limit = 20; } if (flushPeriodic === void 0) { flushPeriodic = false; } if (flushPeriodic) { return this.flushPeriodic(doTick); } else { return this.flushNonPeriodic(limit, doTick); } }; Scheduler.prototype.flushPeriodic = function (doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. var startTime = this._currentTickTime; var lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick); return this._currentTickTime - startTime; }; Scheduler.prototype.flushNonPeriodic = function (limit, doTick) { var startTime = this._currentTickTime; var lastCurrentTime = 0; var count = 0; while (this._schedulerQueue.length > 0) { count++; if (count > limit) { throw new Error('flush failed after reaching the limit of ' + limit + ' tasks. Does your code use a polling timeout?'); } // flush only non-periodic timers. // If the only remaining tasks are periodic(or requestAnimationFrame), finish flushing. if (this._schedulerQueue.filter(function (task) { return !task.isPeriodic && !task.isRequestAnimationFrame; }) .length === 0) { break; } var current = this._schedulerQueue.shift(); lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { // Update any secondary schedulers like Jasmine mock Date. doTick(this._currentTickTime - lastCurrentTime); } var retval = current.func.apply(global$1, current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } } return this._currentTickTime - startTime; }; // Next scheduler id. Scheduler.nextNodeJSId = 1; Scheduler.nextId = -1; return Scheduler; }()); var FakeAsyncTestZoneSpec = /** @class */ (function () { function FakeAsyncTestZoneSpec(namePrefix, trackPendingRequestAnimationFrame, macroTaskOptions) { if (trackPendingRequestAnimationFrame === void 0) { trackPendingRequestAnimationFrame = false; } this._scheduler = new Scheduler(); this._microtasks = []; this._lastError = null; this._uncaughtPromiseErrors = Promise[Zone.__symbol__('uncaughtPromiseErrors')]; this.pendingPeriodicTimers = []; this.pendingTimers = []; this.patchDateLocked = false; this.properties = { 'FakeAsyncTestZoneSpec': this }; this.trackPendingRequestAnimationFrame = trackPendingRequestAnimationFrame; this.macroTaskOptions = macroTaskOptions; this.name = 'fakeAsyncTestZone for ' + namePrefix; // in case user can't access the construction of FakeAsyncTestSpec // user can also define macroTaskOptions by define a global variable. if (!this.macroTaskOptions) { this.macroTaskOptions = global$1[Zone.__symbol__('FakeAsyncTestMacroTask')]; } } FakeAsyncTestZoneSpec.assertInZone = function () { if (Zone.current.get('FakeAsyncTestZoneSpec') == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } }; FakeAsyncTestZoneSpec.prototype._fnAndFlush = function (fn, completers) { var _this = this; return function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } fn.apply(global$1, args); if (_this._lastError === null) { // Success if (completers.onSuccess != null) { completers.onSuccess.apply(global$1); } // Flush microtasks only on success. _this.flushMicrotasks(); } else { // Failure if (completers.onError != null) { completers.onError.apply(global$1); } } // Return true if there were no errors, false otherwise. return _this._lastError === null; }; }; FakeAsyncTestZoneSpec._removeTimer = function (timers, id) { var index = timers.indexOf(id); if (index > -1) { timers.splice(index, 1); } }; FakeAsyncTestZoneSpec.prototype._dequeueTimer = function (id) { var _this = this; return function () { FakeAsyncTestZoneSpec._removeTimer(_this.pendingTimers, id); }; }; FakeAsyncTestZoneSpec.prototype._requeuePeriodicTimer = function (fn, interval, args, id) { var _this = this; return function () { // Requeue the timer callback if it's not been canceled. if (_this.pendingPeriodicTimers.indexOf(id) !== -1) { _this._scheduler.scheduleFunction(fn, interval, { args: args, isPeriodic: true, id: id, isRequeuePeriodic: true, }); } }; }; FakeAsyncTestZoneSpec.prototype._dequeuePeriodicTimer = function (id) { var _this = this; return function () { FakeAsyncTestZoneSpec._removeTimer(_this.pendingPeriodicTimers, id); }; }; FakeAsyncTestZoneSpec.prototype._setTimeout = function (fn, delay, args, isTimer) { if (isTimer === void 0) { isTimer = true; } var removeTimerFn = this._dequeueTimer(Scheduler.nextId); // Queue the callback and dequeue the timer on success and error. var cb = this._fnAndFlush(fn, { onSuccess: removeTimerFn, onError: removeTimerFn }); var id = this._scheduler.scheduleFunction(cb, delay, { args: args, isRequestAnimationFrame: !isTimer }); if (isTimer) { this.pendingTimers.push(id); } return id; }; FakeAsyncTestZoneSpec.prototype._clearTimeout = function (id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); this._scheduler.removeScheduledFunctionWithId(id); }; FakeAsyncTestZoneSpec.prototype._setInterval = function (fn, interval, args) { var id = Scheduler.nextId; var completers = { onSuccess: null, onError: this._dequeuePeriodicTimer(id) }; var cb = this._fnAndFlush(fn, completers); // Use the callback created above to requeue on success. completers.onSuccess = this._requeuePeriodicTimer(cb, interval, args, id); // Queue the callback and dequeue the periodic timer only on error. this._scheduler.scheduleFunction(cb, interval, { args: args, isPeriodic: true }); this.pendingPeriodicTimers.push(id); return id; }; FakeAsyncTestZoneSpec.prototype._clearInterval = function (id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); this._scheduler.removeScheduledFunctionWithId(id); }; FakeAsyncTestZoneSpec.prototype._resetLastErrorAndThrow = function () { var error = this._lastError || this._uncaughtPromiseErrors[0]; this._uncaughtPromiseErrors.length = 0; this._lastError = null; throw error; }; FakeAsyncTestZoneSpec.prototype.getCurrentTickTime = function () { return this._scheduler.getCurrentTickTime(); }; FakeAsyncTestZoneSpec.prototype.getFakeSystemTime = function () { return this._scheduler.getFakeSystemTime(); }; FakeAsyncTestZoneSpec.prototype.setFakeBaseSystemTime = function (realTime) { this._scheduler.setFakeBaseSystemTime(realTime); }; FakeAsyncTestZoneSpec.prototype.getRealSystemTime = function () { return this._scheduler.getRealSystemTime(); }; FakeAsyncTestZoneSpec.patchDate = function () { if (!!global$1[Zone.__symbol__('disableDatePatching')]) { // we don't want to patch global Date // because in some case, global Date // is already being patched, we need to provide // an option to let user still use their // own version of Date. return; } if (global$1['Date'] === FakeDate) { // already patched return; } global$1['Date'] = FakeDate; FakeDate.prototype = OriginalDate.prototype; // try check and reset timers // because jasmine.clock().install() may // have replaced the global timer FakeAsyncTestZoneSpec.checkTimerPatch(); }; FakeAsyncTestZoneSpec.resetDate = function () { if (global$1['Date'] === FakeDate) { global$1['Date'] = OriginalDate; } }; FakeAsyncTestZoneSpec.checkTimerPatch = function () { if (!patchedTimers) { throw new Error('Expected timers to have been patched.'); } if (global$1.setTimeout !== patchedTimers.setTimeout) { global$1.setTimeout = patchedTimers.setTimeout; global$1.clearTimeout = patchedTimers.clearTimeout; } if (global$1.setInterval !== patchedTimers.setInterval) { global$1.setInterval = patchedTimers.setInterval; global$1.clearInterval = patchedTimers.clearInterval; } }; FakeAsyncTestZoneSpec.prototype.lockDatePatch = function () { this.patchDateLocked = true; FakeAsyncTestZoneSpec.patchDate(); }; FakeAsyncTestZoneSpec.prototype.unlockDatePatch = function () { this.patchDateLocked = false; FakeAsyncTestZoneSpec.resetDate(); }; FakeAsyncTestZoneSpec.prototype.tickToNext = function (steps, doTick, tickOptions) { if (steps === void 0) { steps = 1; } if (tickOptions === void 0) { tickOptions = { processNewMacroTasksSynchronously: true }; } if (steps <= 0) { return; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tickToNext(steps, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } }; FakeAsyncTestZoneSpec.prototype.tick = function (millis, doTick, tickOptions) { if (millis === void 0) { millis = 0; } if (tickOptions === void 0) { tickOptions = { processNewMacroTasksSynchronously: true }; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tick(millis, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } }; FakeAsyncTestZoneSpec.prototype.flushMicrotasks = function () { var _this = this; FakeAsyncTestZoneSpec.assertInZone(); var flushErrors = function () { if (_this._lastError !== null || _this._uncaughtPromiseErrors.length) { // If there is an error stop processing the microtask queue and rethrow the error. _this._resetLastErrorAndThrow(); } }; while (this._microtasks.length > 0) { var microtask = this._microtasks.shift(); microtask.func.apply(microtask.target, microtask.args); } flushErrors(); }; FakeAsyncTestZoneSpec.prototype.flush = function (limit, flushPeriodic, doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); var elapsed = this._scheduler.flush(limit, flushPeriodic, doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; }; FakeAsyncTestZoneSpec.prototype.flushOnlyPendingTimers = function (doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); var elapsed = this._scheduler.flushOnlyPendingTimers(doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; }; FakeAsyncTestZoneSpec.prototype.removeAllTimers = function () { FakeAsyncTestZoneSpec.assertInZone(); this._scheduler.removeAll(); this.pendingPeriodicTimers = []; this.pendingTimers = []; }; FakeAsyncTestZoneSpec.prototype.getTimerCount = function () { return this._scheduler.getTimerCount() + this._microtasks.length; }; FakeAsyncTestZoneSpec.prototype.onScheduleTask = function (delegate, current, target, task) { switch (task.type) { case 'microTask': var args = task.data && task.data.args; // should pass additional arguments to callback if have any // currently we know process.nextTick will have such additional // arguments var additionalArgs = void 0; if (args) { var callbackIndex = task.data.cbIdx; if (typeof args.length === 'number' && args.length > callbackIndex + 1) { additionalArgs = Array.prototype.slice.call(args, callbackIndex + 1); } } this._microtasks.push({ func: task.invoke, args: additionalArgs, target: task.data && task.data.target, }); break; case 'macroTask': switch (task.source) { case 'setTimeout': task.data['handleId'] = this._setTimeout(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'setImmediate': task.data['handleId'] = this._setTimeout(task.invoke, 0, Array.prototype.slice.call(task.data['args'], 1)); break; case 'setInterval': task.data['handleId'] = this._setInterval(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'XMLHttpRequest.send': throw new Error('Cannot make XHRs from within a fake async test. Request URL: ' + task.data['url']); case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': // Simulate a requestAnimationFrame by using a setTimeout with 16 ms. // (60 frames per second) task.data['handleId'] = this._setTimeout(task.invoke, 16, task.data['args'], this.trackPendingRequestAnimationFrame); break; default: // user can define which macroTask they want to support by passing // macroTaskOptions var macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { var args_1 = task.data && task.data['args']; var delay = args_1 && args_1.length > 1 ? args_1[1] : 0; var callbackArgs = macroTaskOption.callbackArgs ? macroTaskOption.callbackArgs : args_1; if (!!macroTaskOption.isPeriodic) { // periodic macroTask, use setInterval to simulate task.data['handleId'] = this._setInterval(task.invoke, delay, callbackArgs); task.data.isPeriodic = true; } else { // not periodic, use setTimeout to simulate task.data['handleId'] = this._setTimeout(task.invoke, delay, callbackArgs); } break; } throw new Error('Unknown macroTask scheduled in fake async test: ' + task.source); } break; case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; }; FakeAsyncTestZoneSpec.prototype.onCancelTask = function (delegate, current, target, task) { switch (task.source) { case 'setTimeout': case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': return this._clearTimeout(task.data['handleId']); case 'setInterval': return this._clearInterval(task.data['handleId']); default: // user can define which macroTask they want to support by passing // macroTaskOptions var macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { var handleId = task.data['handleId']; return macroTaskOption.isPeriodic ? this._clearInterval(handleId) : this._clearTimeout(handleId); } return delegate.cancelTask(target, task); } }; FakeAsyncTestZoneSpec.prototype.onInvoke = function (delegate, current, target, callback, applyThis, applyArgs, source) { try { FakeAsyncTestZoneSpec.patchDate(); return delegate.invoke(target, callback, applyThis, applyArgs, source); } finally { if (!this.patchDateLocked) { FakeAsyncTestZoneSpec.resetDate(); } } }; FakeAsyncTestZoneSpec.prototype.findMacroTaskOption = function (task) { if (!this.macroTaskOptions) { return null; } for (var i = 0; i < this.macroTaskOptions.length; i++) { var macroTaskOption = this.macroTaskOptions[i]; if (macroTaskOption.source === task.source) { return macroTaskOption; } } return null; }; FakeAsyncTestZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { // ComponentFixture has a special-case handling to detect FakeAsyncTestZoneSpec // and prevent rethrowing the error from the onError subscription since it's handled here. this._lastError = error; return false; // Don't propagate error to parent zone. }; return FakeAsyncTestZoneSpec; }()); var _fakeAsyncTestZoneSpec = null; function getProxyZoneSpec() { return Zone && Zone['ProxyZoneSpec']; } var _sharedProxyZoneSpec = null; var _sharedProxyZone = null; /** * Clears out the shared fake async zone for a test. * To be called in a global `beforeEach`. * * @experimental */ function resetFakeAsyncZone() { var _a, _b; if (_fakeAsyncTestZoneSpec) { _fakeAsyncTestZoneSpec.unlockDatePatch(); } _fakeAsyncTestZoneSpec = null; (_b = (_a = getProxyZoneSpec()) === null || _a === void 0 ? void 0 : _a.get()) === null || _b === void 0 ? void 0 : _b.resetDelegate(); _sharedProxyZoneSpec === null || _sharedProxyZoneSpec === void 0 ? void 0 : _sharedProxyZoneSpec.resetDelegate(); } /** * Wraps a function to be executed in the fakeAsync zone: * - microtasks are manually executed by calling `flushMicrotasks()`, * - timers are synchronous, `tick()` simulates the asynchronous passage of time. * * When flush is `false`, if there are any pending timers at the end of the function, * an exception will be thrown. * * Can be used to wrap inject() calls. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @param fn * @param options * flush: when true, will drain the macrotask queue after the test function completes. * @returns The function wrapped to be executed in the fakeAsync zone * * @experimental */ function fakeAsync(fn, options) { if (options === void 0) { options = {}; } var _a = options.flush, flush = _a === void 0 ? true : _a; // Not using an arrow function to preserve context passed from call site var fakeAsyncFn = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } var ProxyZoneSpec = getProxyZoneSpec(); if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the fakeAsync() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } var proxyZoneSpec = ProxyZoneSpec.assertPresent(); if (Zone.current.get('FakeAsyncTestZoneSpec')) { throw new Error('fakeAsync() calls can not be nested'); } try { // in case jasmine.clock init a fakeAsyncTestZoneSpec if (!_fakeAsyncTestZoneSpec) { var FakeAsyncTestZoneSpec_1 = Zone && Zone['FakeAsyncTestZoneSpec']; if (proxyZoneSpec.getDelegate() instanceof FakeAsyncTestZoneSpec_1) { throw new Error('fakeAsync() calls can not be nested'); } _fakeAsyncTestZoneSpec = new FakeAsyncTestZoneSpec_1(); } var res = void 0; var lastProxyZoneSpec = proxyZoneSpec.getDelegate(); proxyZoneSpec.setDelegate(_fakeAsyncTestZoneSpec); _fakeAsyncTestZoneSpec.lockDatePatch(); try { res = fn.apply(this, args); if (flush) { _fakeAsyncTestZoneSpec.flush(20, true); } else { flushMicrotasks(); } } finally { proxyZoneSpec.setDelegate(lastProxyZoneSpec); } if (!flush) { if (_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length > 0) { throw new Error("".concat(_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length, " ") + "periodic timer(s) still in the queue."); } if (_fakeAsyncTestZoneSpec.pendingTimers.length > 0) { throw new Error("".concat(_fakeAsyncTestZoneSpec.pendingTimers.length, " timer(s) still in the queue.")); } } return res; } finally { resetFakeAsyncZone(); } }; fakeAsyncFn.isFakeAsync = true; return fakeAsyncFn; } function _getFakeAsyncZoneSpec() { if (_fakeAsyncTestZoneSpec == null) { _fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (_fakeAsyncTestZoneSpec == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } return _fakeAsyncTestZoneSpec; } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone. * * The microtasks queue is drained at the very start of this function and after any timer * callback has been executed. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @experimental */ function tick(millis, ignoreNestedTimeout) { if (millis === void 0) { millis = 0; } if (ignoreNestedTimeout === void 0) { ignoreNestedTimeout = false; } _getFakeAsyncZoneSpec().tick(millis, null, ignoreNestedTimeout); } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone by * draining the macrotask queue until it is empty. The returned value is the milliseconds * of time that would have been elapsed. * * @param maxTurns * @returns The simulated time elapsed, in millis. * * @experimental */ function flush(maxTurns) { return _getFakeAsyncZoneSpec().flush(maxTurns); } /** * Discard all remaining periodic tasks. * * @experimental */ function discardPeriodicTasks() { var zoneSpec = _getFakeAsyncZoneSpec(); zoneSpec.pendingPeriodicTimers; zoneSpec.pendingPeriodicTimers.length = 0; } /** * Wraps a function to be executed in a shared ProxyZone. * * If no shared ProxyZone exists, one is created and reused for subsequent calls. * Useful for wrapping test setup (beforeEach) and test execution (it) when test * runner patching isn't available or desired for setting up the ProxyZone. * * @param fn The function to wrap. * @returns A function that executes the original function within the shared ProxyZone. * * @experimental */ function withProxyZone(fn) { var autoProxyFn = function () { var args = []; for (var _i = 0; _i < arguments.length; _i++) { args[_i] = arguments[_i]; } var proxyZoneSpec = getProxyZoneSpec(); if (proxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } var proxyZone = proxyZoneSpec.get() !== undefined ? Zone.current : getOrCreateRootProxy(); return proxyZone.run(fn, this, args); }; return autoProxyFn; } function getOrCreateRootProxy() { var ProxyZoneSpec = getProxyZoneSpec(); if (ProxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for withProxyZone but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } // Ensure the shared ProxyZoneSpec instance exists if (_sharedProxyZoneSpec === null) { _sharedProxyZoneSpec = new ProxyZoneSpec(); } _sharedProxyZone = Zone.root.fork(_sharedProxyZoneSpec); return _sharedProxyZone; } /** * Flush any pending microtasks. * * @experimental */ function flushMicrotasks() { _getFakeAsyncZoneSpec().flushMicrotasks(); } function patchFakeAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['FakeAsyncTestZoneSpec'] = FakeAsyncTestZoneSpec; Zone.__load_patch('fakeasync', function (global, Zone, api) { Zone[api.symbol('fakeAsyncTest')] = { resetFakeAsyncZone: resetFakeAsyncZone, flushMicrotasks: flushMicrotasks, discardPeriodicTasks: discardPeriodicTasks, tick: tick, flush: flush, fakeAsync: fakeAsync, withProxyZone: withProxyZone, }; }, true); patchedTimers = { setTimeout: global$1.setTimeout, setInterval: global$1.setInterval, clearTimeout: global$1.clearTimeout, clearInterval: global$1.clearInterval, nativeSetTimeout: global$1[Zone.__symbol__('setTimeout')], nativeClearTimeout: global$1[Zone.__symbol__('clearTimeout')], }; Scheduler.nextId = Scheduler.getNextId(); } /** * @fileoverview * @suppress {globalThis} */ function patchLongStackTrace(Zone) { var NEWLINE = '\n'; var IGNORE_FRAMES = {}; var creationTrace = '__creationTrace__'; var ERROR_TAG = 'STACKTRACE TRACKING'; var SEP_TAG = '__SEP_TAG__'; var sepTemplate = SEP_TAG + '@[native]'; var LongStackTrace = /** @class */ (function () { function LongStackTrace() { this.error = getStacktrace(); this.timestamp = new Date(); } return LongStackTrace; }()); function getStacktraceWithUncaughtError() { return new Error(ERROR_TAG); } function getStacktraceWithCaughtError() { try { throw getStacktraceWithUncaughtError(); } catch (err) { return err; } } // Some implementations of exception handling don't create a stack trace if the exception // isn't thrown, however it's faster not to actually throw the exception. var error = getStacktraceWithUncaughtError(); var caughtError = getStacktraceWithCaughtError(); var getStacktrace = error.stack ? getStacktraceWithUncaughtError : caughtError.stack ? getStacktraceWithCaughtError : getStacktraceWithUncaughtError; function getFrames(error) { return error.stack ? error.stack.split(NEWLINE) : []; } function addErrorStack(lines, error) { var trace = getFrames(error); for (var i = 0; i < trace.length; i++) { var frame = trace[i]; // Filter out the Frames which are part of stack capturing. if (!IGNORE_FRAMES.hasOwnProperty(frame)) { lines.push(trace[i]); } } } function renderLongStackTrace(frames, stack) { var longTrace = [stack ? stack.trim() : '']; if (frames) { var timestamp = new Date().getTime(); for (var i = 0; i < frames.length; i++) { var traceFrames = frames[i]; var lastTime = traceFrames.timestamp; var separator = "____________________Elapsed ".concat(timestamp - lastTime.getTime(), " ms; At: ").concat(lastTime); separator = separator.replace(/[^\w\d]/g, '_'); longTrace.push(sepTemplate.replace(SEP_TAG, separator)); addErrorStack(longTrace, traceFrames.error); timestamp = lastTime.getTime(); } } return longTrace.join(NEWLINE); } // if Error.stackTraceLimit is 0, means stack trace // is disabled, so we don't need to generate long stack trace // this will improve performance in some test(some test will // set stackTraceLimit to 0, https://github.com/angular/zone.js/issues/698 function stackTracesEnabled() { // Cast through any since this property only exists on Error in the nodejs // typings. return Error.stackTraceLimit > 0; } Zone['longStackTraceZoneSpec'] = { name: 'long-stack-trace', longStackTraceLimit: 10, // Max number of task to keep the stack trace for. // add a getLongStackTrace method in spec to // handle handled reject promise error. getLongStackTrace: function (error) { if (!error) { return undefined; } var trace = error[Zone.__symbol__('currentTaskTrace')]; if (!trace) { return error.stack; } return renderLongStackTrace(trace, error.stack); }, onScheduleTask: function (parentZoneDelegate, currentZone, targetZone, task) { if (stackTracesEnabled()) { var currentTask = Zone.currentTask; var trace = (currentTask && currentTask.data && currentTask.data[creationTrace]) || []; trace = [new LongStackTrace()].concat(trace); if (trace.length > this.longStackTraceLimit) { trace.length = this.longStackTraceLimit; } if (!task.data) task.data = {}; if (task.type === 'eventTask') { // Fix issue https://github.com/angular/zone.js/issues/1195, // For event task of browser, by default, all task will share a // singleton instance of data object, we should create a new one here // The cast to `any` is required to workaround a closure bug which wrongly applies // URL sanitization rules to .data access. task.data = __assign({}, task.data); } task.data[creationTrace] = trace; } return parentZoneDelegate.scheduleTask(targetZone, task); }, onHandleError: function (parentZoneDelegate, currentZone, targetZone, error) { if (stackTracesEnabled()) { var parentTask = Zone.currentTask || error.task; if (error instanceof Error && parentTask) { var longStack = renderLongStackTrace(parentTask.data && parentTask.data[creationTrace], error.stack); try { error.stack = error.longStack = longStack; } catch (err) { } } } return parentZoneDelegate.handleError(targetZone, error); }, }; function captureStackTraces(stackTraces, count) { if (count > 0) { stackTraces.push(getFrames(new LongStackTrace().error)); captureStackTraces(stackTraces, count - 1); } } function computeIgnoreFrames() { if (!stackTracesEnabled()) { return; } var frames = []; captureStackTraces(frames, 2); var frames1 = frames[0]; var frames2 = frames[1]; for (var i = 0; i < frames1.length; i++) { var frame1 = frames1[i]; if (frame1.indexOf(ERROR_TAG) == -1) { var match = frame1.match(/^\s*at\s+/); if (match) { sepTemplate = match[0] + SEP_TAG + ' (http://localhost)'; break; } } } for (var i = 0; i < frames1.length; i++) { var frame1 = frames1[i]; var frame2 = frames2[i]; if (frame1 === frame2) { IGNORE_FRAMES[frame1] = true; } else { break; } } } computeIgnoreFrames(); } var ProxyZoneSpec = /** @class */ (function () { function ProxyZoneSpec(defaultSpecDelegate) { if (defaultSpecDelegate === void 0) { defaultSpecDelegate = null; } this.name = 'ProxyZone'; this._delegateSpec = null; this.properties = { 'ProxyZoneSpec': this }; this.propertyKeys = null; this.lastTaskState = null; this.isNeedToTriggerHasTask = false; this.tasks = []; this.defaultSpecDelegate = defaultSpecDelegate; this.setDelegate(defaultSpecDelegate); } ProxyZoneSpec.get = function () { return Zone.current.get('ProxyZoneSpec'); }; ProxyZoneSpec.isLoaded = function () { return ProxyZoneSpec.get() instanceof ProxyZoneSpec; }; ProxyZoneSpec.assertPresent = function () { var spec = ProxyZoneSpec.get(); if (spec === undefined) { throw new Error("Expected to be running in 'ProxyZone', but it was not found."); } return spec; }; ProxyZoneSpec.prototype.setDelegate = function (delegateSpec) { var _this = this; var isNewDelegate = this._delegateSpec !== delegateSpec; this._delegateSpec = delegateSpec; this.propertyKeys && this.propertyKeys.forEach(function (key) { return delete _this.properties[key]; }); this.propertyKeys = null; if (delegateSpec && delegateSpec.properties) { this.propertyKeys = Object.keys(delegateSpec.properties); this.propertyKeys.forEach(function (k) { return (_this.properties[k] = delegateSpec.properties[k]); }); } // if a new delegateSpec was set, check if we need to trigger hasTask if (isNewDelegate && this.lastTaskState && (this.lastTaskState.macroTask || this.lastTaskState.microTask)) { this.isNeedToTriggerHasTask = true; } }; ProxyZoneSpec.prototype.getDelegate = function () { return this._delegateSpec; }; ProxyZoneSpec.prototype.resetDelegate = function () { this.getDelegate(); this.setDelegate(this.defaultSpecDelegate); }; ProxyZoneSpec.prototype.tryTriggerHasTask = function (parentZoneDelegate, currentZone, targetZone) { if (this.isNeedToTriggerHasTask && this.lastTaskState) { // last delegateSpec has microTask or macroTask // should call onHasTask in current delegateSpec this.isNeedToTriggerHasTask = false; this.onHasTask(parentZoneDelegate, currentZone, targetZone, this.lastTaskState); } }; ProxyZoneSpec.prototype.removeFromTasks = function (task) { if (!this.tasks) { return; } for (var i = 0; i < this.tasks.length; i++) { if (this.tasks[i] === task) { this.tasks.splice(i, 1); return; } } }; ProxyZoneSpec.prototype.getAndClearPendingTasksInfo = function () { if (this.tasks.length === 0) { return ''; } var taskInfo = this.tasks.map(function (task) { var dataInfo = task.data && Object.keys(task.data) .map(function (key) { return key + ':' + task.data[key]; }) .join(','); return "type: ".concat(task.type, ", source: ").concat(task.source, ", args: {").concat(dataInfo, "}"); }); var pendingTasksInfo = '--Pending async tasks are: [' + taskInfo + ']'; // clear tasks this.tasks = []; return pendingTasksInfo; }; ProxyZoneSpec.prototype.onFork = function (parentZoneDelegate, currentZone, targetZone, zoneSpec) { if (this._delegateSpec && this._delegateSpec.onFork) { return this._delegateSpec.onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec); } else { return parentZoneDelegate.fork(targetZone, zoneSpec); } }; ProxyZoneSpec.prototype.onIntercept = function (parentZoneDelegate, currentZone, targetZone, delegate, source) { if (this._delegateSpec && this._delegateSpec.onIntercept) { return this._delegateSpec.onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source); } else { return parentZoneDelegate.intercept(targetZone, delegate, source); } }; ProxyZoneSpec.prototype.onInvoke = function (parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvoke) { return this._delegateSpec.onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source); } else { return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } }; ProxyZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { if (this._delegateSpec && this._delegateSpec.onHandleError) { return this._delegateSpec.onHandleError(parentZoneDelegate, currentZone, targetZone, error); } else { return parentZoneDelegate.handleError(targetZone, error); } }; ProxyZoneSpec.prototype.onScheduleTask = function (parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.tasks.push(task); } if (this._delegateSpec && this._delegateSpec.onScheduleTask) { return this._delegateSpec.onScheduleTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.scheduleTask(targetZone, task); } }; ProxyZoneSpec.prototype.onInvokeTask = function (parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvokeTask) { return this._delegateSpec.onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs); } else { return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); } }; ProxyZoneSpec.prototype.onCancelTask = function (parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onCancelTask) { return this._delegateSpec.onCancelTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.cancelTask(targetZone, task); } }; ProxyZoneSpec.prototype.onHasTask = function (delegate, current, target, hasTaskState) { this.lastTaskState = hasTaskState; if (this._delegateSpec && this._delegateSpec.onHasTask) { this._delegateSpec.onHasTask(delegate, current, target, hasTaskState); } else { delegate.hasTask(target, hasTaskState); } }; return ProxyZoneSpec; }()); function patchProxyZoneSpec(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['ProxyZoneSpec'] = ProxyZoneSpec; } function patchSyncTest(Zone) { var SyncTestZoneSpec = /** @class */ (function () { function SyncTestZoneSpec(namePrefix) { this.runZone = Zone.current; this.name = 'syncTestZone for ' + namePrefix; } SyncTestZoneSpec.prototype.onScheduleTask = function (delegate, current, target, task) { switch (task.type) { case 'microTask': case 'macroTask': throw new Error("Cannot call ".concat(task.source, " from within a sync test (").concat(this.name, ").")); case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; }; return SyncTestZoneSpec; }()); // Export the class so that new instances can be created with proper // constructor params. Zone['SyncTestZoneSpec'] = SyncTestZoneSpec; } function patchPromiseTesting(Zone) { /** * Promise for async/fakeAsync zoneSpec test * can support async operation which not supported by zone.js * such as * it ('test jsonp in AsyncZone', async() => { * new Promise(res => { * jsonp(url, (data) => { * // success callback * res(data); * }); * }).then((jsonpResult) => { * // get jsonp result. * * // user will expect AsyncZoneSpec wait for * // then, but because jsonp is not zone aware * // AsyncZone will finish before then is called. * }); * }); */ Zone.__load_patch('promisefortest', function (global, Zone, api) { var symbolState = api.symbol('state'); var UNRESOLVED = null; var symbolParentUnresolved = api.symbol('parentUnresolved'); // patch Promise.prototype.then to keep an internal // number for tracking unresolved chained promise // we will decrease this number when the parent promise // being resolved/rejected and chained promise was // scheduled as a microTask. // so we can know such kind of chained promise still // not resolved in AsyncTestZone Promise[api.symbol('patchPromiseForTest')] = function patchPromiseForTest() { var oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { return; } oriThen = Promise[Zone.__symbol__('ZonePromiseThen')] = Promise.prototype.then; Promise.prototype.then = function () { var chained = oriThen.apply(this, arguments); if (this[symbolState] === UNRESOLVED) { // parent promise is unresolved. var asyncTestZoneSpec = Zone.current.get('AsyncTestZoneSpec'); if (asyncTestZoneSpec) { asyncTestZoneSpec.unresolvedChainedPromiseCount++; chained[symbolParentUnresolved] = true; } } return chained; }; }; Promise[api.symbol('unPatchPromiseForTest')] = function unpatchPromiseForTest() { // restore origin then var oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { Promise.prototype.then = oriThen; Promise[Zone.__symbol__('ZonePromiseThen')] = undefined; } }; }); } function rollupTesting(Zone) { patchLongStackTrace(Zone); patchProxyZoneSpec(Zone); patchSyncTest(Zone); patchJasmine(Zone); patchJest(Zone); patchMocha(Zone); patchAsyncTest(Zone); patchFakeAsyncTest(Zone); patchPromiseTesting(Zone); } rollupTesting(Zone); })); o>0x( mKpatchJasmine(Zone); })); 8 Gx= zUL})); tx'9 'use strict' }));  x+xt# 'use strict' Bluebird $bluebird7/:/ TODO: @JiaLiPassion, we can automatically patch bluebirdglobal.Promise = Bluebird, but sometimes in nodejs, // global.Promise is not Bluebird, and Bluebird is just be  // used by other libraries such as sequelize, so I think it is // safe to just expose a method to patch BluCebird explicitly var BLUEBIRD = 'bluebird'; ?_,BLUEBIRD)] = function patchBluebird(Bluebird u >method of Bluebird.prototype which not using `then` internallyf+bluebirdApis = ['then', 'spread', 'finally'!Y bluebirdApisfbapp|Bluebird.prototype, bapiq|fu2-e*argSelfEargArgs = argumentsa@new Bluebird(function (res, rejG$z:Promise.then',/ ]`& res(func.apply(argSelf, argArg&&)U p mjA!&&K| , V ](@D"@0};r|>שwindowF(function (event2%"event.detail && event.detail.reaso1g0? error && error.isHandledByZonуevent.preventDefaul  >event.stopImmediatePropagation+event.stopImmediatePropagationKK|0if (!function (reason, p2_reason && reason.isHandledByZonу listeners_1 =(x_ listeners_q 6// remove unhandledRejection listeners so the callbackA$will not be triggered$(x"nextTick@& listeners_1flistener) { return" listener);a |  -p!`4Bluebird.onPossiblyUnhandledRejection(function (e, p]`P runGuarded@& e.isHandledByoF)$|K}err.isHandledByE"p|onUnhandledError|override globalk@Promise = Bluebird patchBluebird(Zone); })); uxs"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var t,n=1,r=arguments.length;n * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ !function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=globalThis;function t(t){return(e.__Zone_symbol_prefix||"__zone_symbol__")+t}var n,r="undefined"!=typeof window&&window||"undefined"!=typeof self&&self||global,i=function(){function e(e,n,i){this._pendingMicroTasks=!1,this._pendingMacroTasks=!1,this._alreadyErrored=!1,this._isSync=!1,this._existingFinishTimer=null,this.entryFunction=null,this.runZone=Zone.current,this.unresolvedChainedPromiseCount=0,this.supportWaitUnresolvedChainedPromise=!1,this.finishCallback=e,this.failCallback=n,this.name="asyncTestZone for "+i,this.properties={AsyncTestZoneSpec:this},this.supportWaitUnresolvedChainedPromise=!0===r[t("supportWaitUnResolvedChainedPromise")]}return Object.defineProperty(e,"symbolParentUnresolved",{get:function(){return t("parentUnresolved")},enumerable:!1,configurable:!0}),e.prototype.isUnresolvedChainedPromisePending=function(){return this.unresolvedChainedPromiseCount>0},e.prototype._finishCallbackIfDone=function(){var e=this;null!==this._existingFinishTimer&&(clearTimeout(this._existingFinishTimer),this._existingFinishTimer=null),this._pendingMicroTasks||this._pendingMacroTasks||this.supportWaitUnresolvedChainedPromise&&this.isUnresolvedChainedPromisePending()||this.runZone.run((function(){e._existingFinishTimer=setTimeout((function(){e._alreadyErrored||e._pendingMicroTasks||e._pendingMacroTasks||e.finishCallback()}),0)}))},e.prototype.patchPromiseForTest=function(){if(this.supportWaitUnresolvedChainedPromise){var e=Promise[Zone.__symbol__("patchPromiseForTest")];e&&e()}},e.prototype.unPatchPromiseForTest=function(){if(this.supportWaitUnresolvedChainedPromise){var e=Promise[Zone.__symbol__("unPatchPromiseForTest")];e&&e()}},e.prototype.onScheduleTask=function(t,n,r,i){return"eventTask"!==i.type&&(this._isSync=!1),"microTask"===i.type&&i.data&&i.data instanceof Promise&&!0===i.data[e.symbolParentUnresolved]&&this.unresolvedChainedPromiseCount--,t.scheduleTask(r,i)},e.prototype.onInvokeTask=function(e,t,n,r,i,o){return"eventTask"!==r.type&&(this._isSync=!1),e.invokeTask(n,r,i,o)},e.prototype.onCancelTask=function(e,t,n,r){return"eventTask"!==r.type&&(this._isSync=!1),e.cancelTask(n,r)},e.prototype.onInvoke=function(e,t,n,r,i,o,s){this.entryFunction||(this.entryFunction=r);try{return this._isSync=!0,e.invoke(n,r,i,o,s)}finally{this._isSync&&this.entryFunction===r&&this._finishCallbackIfDone()}},e.prototype.onHandleError=function(e,t,n,r){return e.handleError(n,r)&&(this.failCallback(r),this._alreadyErrored=!0),!1},e.prototype.onHasTask=function(e,t,n,r){e.hasTask(n,r),t===n&&("microTask"==r.change?(this._pendingMicroTasks=r.microTask,this._finishCallbackIfDone()):"macroTask"==r.change&&(this._pendingMacroTasks=r.macroTask,this._finishCallbackIfDone()))},e}(),o="object"==typeof window&&window||"object"==typeof self&&self||globalThis.global,s=o.Date;function a(){if(0===arguments.length){var e=new s;return e.setTime(a.now()),e}var t=Array.prototype.slice.call(arguments);return new(s.bind.apply(s,__spreadArray([void 0],t,!1)))}a.now=function(){var e=Zone.current.get("FakeAsyncTestZoneSpec");return e?e.getFakeSystemTime():s.now.apply(this,arguments)},a.UTC=s.UTC,a.parse=s.parse;var c=function(){},u=function(){function e(){this._schedulerQueue=[],this._currentTickTime=0,this._currentFakeBaseSystemTime=s.now(),this._currentTickRequeuePeriodicEntries=[]}return e.getNextId=function(){var t=n.nativeSetTimeout.call(o,c,0);return n.nativeClearTimeout.call(o,t),"number"==typeof t?t:e.nextNodeJSId++},e.prototype.getCurrentTickTime=function(){return this._currentTickTime},e.prototype.getFakeSystemTime=function(){return this._currentFakeBaseSystemTime+this._currentTickTime},e.prototype.setFakeBaseSystemTime=function(e){this._currentFakeBaseSystemTime=e},e.prototype.getRealSystemTime=function(){return s.now()},e.prototype.scheduleFunction=function(t,n,r){var i=(r=__assign({args:[],isPeriodic:!1,isRequestAnimationFrame:!1,id:-1,isRequeuePeriodic:!1},r)).id<0?e.nextId:r.id;e.nextId=e.getNextId();var o={endTime:this._currentTickTime+n,id:i,func:t,args:r.args,delay:n,isPeriodic:r.isPeriodic,isRequestAnimationFrame:r.isRequestAnimationFrame};r.isRequeuePeriodic&&this._currentTickRequeuePeriodicEntries.push(o);for(var s=0;s0&&(this._currentTickRequeuePeriodicEntries=[],!(r=0&&this._schedulerQueue.splice(c,1)}if(i=this._currentTickTime,this._currentTickTime=a.endTime,t&&t(this._currentTickTime-i),!a.func.apply(o,a.isRequestAnimationFrame?[this._currentTickTime]:a.args))break;n.processNewMacroTasksSynchronously||this._currentTickRequeuePeriodicEntries.forEach((function(e){for(var t=0;t0;){if(++i>e)throw new Error("flush failed after reaching the limit of "+e+" tasks. Does your code use a polling timeout?");if(0===this._schedulerQueue.filter((function(e){return!e.isPeriodic&&!e.isRequestAnimationFrame})).length)break;var s=this._schedulerQueue.shift();if(r=this._currentTickTime,this._currentTickTime=s.endTime,t&&t(this._currentTickTime-r),!s.func.apply(o,s.args))break}return this._currentTickTime-n},e.nextNodeJSId=1,e.nextId=-1,e}(),l=function(){function e(e,t,n){void 0===t&&(t=!1),this._scheduler=new u,this._microtasks=[],this._lastError=null,this._uncaughtPromiseErrors=Promise[Zone.__symbol__("uncaughtPromiseErrors")],this.pendingPeriodicTimers=[],this.pendingTimers=[],this.patchDateLocked=!1,this.properties={FakeAsyncTestZoneSpec:this},this.trackPendingRequestAnimationFrame=t,this.macroTaskOptions=n,this.name="fakeAsyncTestZone for "+e,this.macroTaskOptions||(this.macroTaskOptions=o[Zone.__symbol__("FakeAsyncTestMacroTask")])}return e.assertInZone=function(){if(null==Zone.current.get("FakeAsyncTestZoneSpec"))throw new Error("The code should be running in the fakeAsync zone to call this function")},e.prototype._fnAndFlush=function(e,t){var n=this;return function(){for(var r=[],i=0;i-1&&e.splice(n,1)},e.prototype._dequeueTimer=function(t){var n=this;return function(){e._removeTimer(n.pendingTimers,t)}},e.prototype._requeuePeriodicTimer=function(e,t,n,r){var i=this;return function(){-1!==i.pendingPeriodicTimers.indexOf(r)&&i._scheduler.scheduleFunction(e,t,{args:n,isPeriodic:!0,id:r,isRequeuePeriodic:!0})}},e.prototype._dequeuePeriodicTimer=function(t){var n=this;return function(){e._removeTimer(n.pendingPeriodicTimers,t)}},e.prototype._setTimeout=function(e,t,n,r){void 0===r&&(r=!0);var i=this._dequeueTimer(u.nextId),o=this._fnAndFlush(e,{onSuccess:i,onError:i}),s=this._scheduler.scheduleFunction(o,t,{args:n,isRequestAnimationFrame:!r});return r&&this.pendingTimers.push(s),s},e.prototype._clearTimeout=function(t){e._removeTimer(this.pendingTimers,t),this._scheduler.removeScheduledFunctionWithId(t)},e.prototype._setInterval=function(e,t,n){var r=u.nextId,i={onSuccess:null,onError:this._dequeuePeriodicTimer(r)},o=this._fnAndFlush(e,i);return i.onSuccess=this._requeuePeriodicTimer(o,t,n,r),this._scheduler.scheduleFunction(o,t,{args:n,isPeriodic:!0}),this.pendingPeriodicTimers.push(r),r},e.prototype._clearInterval=function(t){e._removeTimer(this.pendingPeriodicTimers,t),this._scheduler.removeScheduledFunctionWithId(t)},e.prototype._resetLastErrorAndThrow=function(){var e=this._lastError||this._uncaughtPromiseErrors[0];throw this._uncaughtPromiseErrors.length=0,this._lastError=null,e},e.prototype.getCurrentTickTime=function(){return this._scheduler.getCurrentTickTime()},e.prototype.getFakeSystemTime=function(){return this._scheduler.getFakeSystemTime()},e.prototype.setFakeBaseSystemTime=function(e){this._scheduler.setFakeBaseSystemTime(e)},e.prototype.getRealSystemTime=function(){return this._scheduler.getRealSystemTime()},e.patchDate=function(){o[Zone.__symbol__("disableDatePatching")]||o.Date!==a&&(o.Date=a,a.prototype=s.prototype,e.checkTimerPatch())},e.resetDate=function(){o.Date===a&&(o.Date=s)},e.checkTimerPatch=function(){if(!n)throw new Error("Expected timers to have been patched.");o.setTimeout!==n.setTimeout&&(o.setTimeout=n.setTimeout,o.clearTimeout=n.clearTimeout),o.setInterval!==n.setInterval&&(o.setInterval=n.setInterval,o.clearInterval=n.clearInterval)},e.prototype.lockDatePatch=function(){this.patchDateLocked=!0,e.patchDate()},e.prototype.unlockDatePatch=function(){this.patchDateLocked=!1,e.resetDate()},e.prototype.tickToNext=function(t,n,r){void 0===t&&(t=1),void 0===r&&(r={processNewMacroTasksSynchronously:!0}),t<=0||(e.assertInZone(),this.flushMicrotasks(),this._scheduler.tickToNext(t,n,r),null!==this._lastError&&this._resetLastErrorAndThrow())},e.prototype.tick=function(t,n,r){void 0===t&&(t=0),void 0===r&&(r={processNewMacroTasksSynchronously:!0}),e.assertInZone(),this.flushMicrotasks(),this._scheduler.tick(t,n,r),null!==this._lastError&&this._resetLastErrorAndThrow()},e.prototype.flushMicrotasks=function(){var t=this;for(e.assertInZone();this._microtasks.length>0;){var n=this._microtasks.shift();n.func.apply(n.target,n.args)}(null!==t._lastError||t._uncaughtPromiseErrors.length)&&t._resetLastErrorAndThrow()},e.prototype.flush=function(t,n,r){e.assertInZone(),this.flushMicrotasks();var i=this._scheduler.flush(t,n,r);return null!==this._lastError&&this._resetLastErrorAndThrow(),i},e.prototype.flushOnlyPendingTimers=function(t){e.assertInZone(),this.flushMicrotasks();var n=this._scheduler.flushOnlyPendingTimers(t);return null!==this._lastError&&this._resetLastErrorAndThrow(),n},e.prototype.removeAllTimers=function(){e.assertInZone(),this._scheduler.removeAll(),this.pendingPeriodicTimers=[],this.pendingTimers=[]},e.prototype.getTimerCount=function(){return this._scheduler.getTimerCount()+this._microtasks.length},e.prototype.onScheduleTask=function(e,t,n,r){switch(r.type){case"microTask":var i=r.data&&r.data.args,o=void 0;if(i){var s=r.data.cbIdx;"number"==typeof i.length&&i.length>s+1&&(o=Array.prototype.slice.call(i,s+1))}this._microtasks.push({func:r.invoke,args:o,target:r.data&&r.data.target});break;case"macroTask":switch(r.source){case"setTimeout":r.data.handleId=this._setTimeout(r.invoke,r.data.delay,Array.prototype.slice.call(r.data.args,2));break;case"setImmediate":r.data.handleId=this._setTimeout(r.invoke,0,Array.prototype.slice.call(r.data.args,1));break;case"setInterval":r.data.handleId=this._setInterval(r.invoke,r.data.delay,Array.prototype.slice.call(r.data.args,2));break;case"XMLHttpRequest.send":throw new Error("Cannot make XHRs from within a fake async test. Request URL: "+r.data.url);case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":r.data.handleId=this._setTimeout(r.invoke,16,r.data.args,this.trackPendingRequestAnimationFrame);break;default:var a=this.findMacroTaskOption(r);if(a){var c=r.data&&r.data.args,u=c&&c.length>1?c[1]:0,l=a.callbackArgs?a.callbackArgs:c;a.isPeriodic?(r.data.handleId=this._setInterval(r.invoke,u,l),r.data.isPeriodic=!0):r.data.handleId=this._setTimeout(r.invoke,u,l);break}throw new Error("Unknown macroTask scheduled in fake async test: "+r.source)}break;case"eventTask":r=e.scheduleTask(n,r)}return r},e.prototype.onCancelTask=function(e,t,n,r){switch(r.source){case"setTimeout":case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":return this._clearTimeout(r.data.handleId);case"setInterval":return this._clearInterval(r.data.handleId);default:var i=this.findMacroTaskOption(r);if(i){var o=r.data.handleId;return i.isPeriodic?this._clearInterval(o):this._clearTimeout(o)}return e.cancelTask(n,r)}},e.prototype.onInvoke=function(t,n,r,i,o,s,a){try{return e.patchDate(),t.invoke(r,i,o,s,a)}finally{this.patchDateLocked||e.resetDate()}},e.prototype.findMacroTaskOption=function(e){if(!this.macroTaskOptions)return null;for(var t=0;t0)throw new Error("".concat(h.pendingPeriodicTimers.length," ")+"periodic timer(s) still in the queue.");if(h.pendingTimers.length>0)throw new Error("".concat(h.pendingTimers.length," timer(s) still in the queue."))}return a}finally{d()}};return i.isFakeAsync=!0,i}function m(){if(null==h&&null==(h=Zone.current.get("FakeAsyncTestZoneSpec")))throw new Error("The code should be running in the fakeAsync zone to call this function");return h}function T(e,t){void 0===e&&(e=0),void 0===t&&(t=!1),m().tick(e,null,t)}function _(e){return m().flush(e)}function k(){m().pendingPeriodicTimers.length=0}function g(e){return function(){for(var t=[],n=0;n0}function m(e,t){t>0&&(e.push(p((new s).error)),m(e,t-1))}e.longStackTraceZoneSpec={name:"long-stack-trace",longStackTraceLimit:10,getLongStackTrace:function(t){if(t){var n=t[e.__symbol__("currentTaskTrace")];return n?d(n,t.stack):t.stack}},onScheduleTask:function(t,r,i,o){if(y()){var a=e.currentTask,c=a&&a.data&&a.data[n]||[];(c=[new s].concat(c)).length>this.longStackTraceLimit&&(c.length=this.longStackTraceLimit),o.data||(o.data={}),"eventTask"===o.type&&(o.data=__assign({},o.data)),o.data[n]=c}return t.scheduleTask(i,o)},onHandleError:function(t,r,i,o){if(y()){var s=e.currentTask||o.task;if(o instanceof Error&&s){var a=d(s.data&&s.data[n],o.stack);try{o.stack=o.longStack=a}catch(e){}}}return t.handleError(i,o)}},function T(){if(y()){var e=[];m(e,2);for(var n=e[0],s=e[1],a=0;a0?arguments[0]:new Date;return e.setFakeBaseSystemTime.apply(e,n&&"function"==typeof n.getTime?[n.getTime()]:arguments)}return r.apply(this,arguments)},c&&["install","uninstall"].forEach((function(n){var r=e[s(n)]=e[n];e[n]=function(){if(!t.FakeAsyncTestZoneSpec)return r.apply(this,arguments);jasmine[s("clockInstalled")]="install"===n}}))}return e}}if(!jasmine[t.__symbol__("createSpyObj")]){var p=jasmine.createSpyObj;jasmine[t.__symbol__("createSpyObj")]=p,jasmine.createSpyObj=function(){var e,t=Array.prototype.slice.call(arguments);if(t.length>=3&&t[2]){var n=Object.defineProperty;Object.defineProperty=function(e,t,r){return n.call(this,e,t,__assign(__assign({},r),{configurable:!0,enumerable:!0}))};try{e=p.apply(this,t)}finally{Object.defineProperty=n}}else e=p.apply(this,t);return e}}var f=jasmine.QueueRunner;jasmine.QueueRunner=function(n){function r(r){var i,s=this;r.onComplete&&(r.onComplete=(i=r.onComplete,function(){s.testProxyZone=null,s.testProxyZoneSpec=null,o.scheduleMicroTask("jasmine.onComplete",i)}));var a=e[t.__symbol__("setTimeout")],c=e[t.__symbol__("clearTimeout")];a&&(r.timeout={setTimeout:a||e.setTimeout,clearTimeout:c||e.clearTimeout}),jasmine.UserContext?(r.userContext||(r.userContext=new jasmine.UserContext),r.userContext.queueRunner=this):(r.userContext||(r.userContext={}),r.userContext.queueRunner=this);var u=r.onException;r.onException=function(e){if(e&&"Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL."===e.message){var t=this&&this.testProxyZoneSpec;if(t){var n=t.getAndClearPendingTasksInfo();try{e.message+=n}catch(e){}}}u&&u.call(this,e)},n.call(this,r)}return function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);function r(){this.constructor=e}e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}(r,n),r.prototype.execute=function(){for(var e=this,r=t.current,s=!1;r;){if(r===o){s=!0;break}r=r.parent}if(!s)throw new Error("Unexpected Zone: "+t.current.name);this.testProxyZoneSpec=new i,this.testProxyZone=o.fork(this.testProxyZoneSpec),t.currentTask?n.prototype.execute.call(this):t.current.scheduleMicroTask("jasmine.execute().forceTask",(function(){return f.prototype.execute.call(e)}))},r}(f)}function d(e,n,r,i){var o=!!jasmine[s("clockInstalled")],a=r.testProxyZone;if(o&&c){var u=t[t.__symbol__("fakeAsyncTest")];u&&"function"==typeof u.fakeAsync&&(e=u.fakeAsync(e))}return i?a.run(e,n,[i]):a.run(e,n)}function y(e){return e&&(e.length?function(t){return d(e,this,this.queueRunner,t)}:function(){return d(e,this,this.queueRunner)})}}))}(e),function a(e){e.__load_patch("jest",(function(e,t,n){if("undefined"!=typeof jest&&!jest.__zone_patch__){t[n.symbol("ignoreConsoleErrorUncaughtError")]=!0,jest.__zone_patch__=!0;var r=t.ProxyZoneSpec,i=t.SyncTestZoneSpec;if(!r)throw new Error("Missing ProxyZoneSpec");var o=t.current,s=o.fork(new i("jest.describe")),a=new r,c=o.fork(a);["describe","xdescribe","fdescribe"].forEach((function(n){var r=e[n];e[t.__symbol__(n)]||(e[t.__symbol__(n)]=r,e[n]=function(){for(var e=[],t=0;t=3&&n[2]){var tKa8\ [naOna tbn);return e}}var h7b2t){function r(r){var ob%obGib(o)}));var a=e[n c=e[n>`cn e!n){var tl ;try{e.message+=tde te 0n){for(var t in n)n.hasOwnProperty(t)&&(e[t]=n[te67n?Object.create(n):(r.prototype=n.prototype,new r)}(r,tBf2n.current,s=!1;r;){if(r===ifBnf*o,this.testProxyZone=i.fork(e),n.currentTask?t?gn^gLh?g&e)}))},r}(h)}function y(e,t,r,o){var ig5i&&c){var u=n[n-h[&o?a.run(e,t,[o]):a.run(e,t)}function mh!;n){return y(e,this,this.queueRunner,n)}:function(){return y i! Zone)}));&ߢxy"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(t){for(var a,n=1,r=arguments.length;n * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){!function t(a){var n={},r="__creationTrace__",e="STACKTRACE TRACKING",c="__SEP_TAG__",i=c+"@[native]",o=function o(){this.error=h(),this.timestamp=new Date};function s(){return new Error(e)}function _(){try{throw s()}catch(t){return t}}var f=s(),u=_(),h=f.stack?s:u.stack?_:s;function l(t){return t.stack?t.stack.split("\n"):[]}function g(t,a){for(var r=l(a),e=0;e0}function d(t,a){a>0&&(t.push(l((new o).error)),d(t,a-1))}a.longStackTraceZoneSpec={name:"long-stack-trace",longStackTraceLimit:10,getLongStackTrace:function(t){if(t){var n=t[a.__symbol__("currentTaskTrace")];return n?k(n,t.stack):t.stack}},onScheduleTask:function(t,n,e,c){if(T()){var i=a.currentTask,s=i&&i.data&&i.data[r]||[];(s=[new o].concat(s)).length>this.longStackTraceLimit&&(s.length=this.longStackTraceLimit),c.data||(c.data={}),"eventTask"===c.type&&(c.data=__assign({},c.data)),c.data[r]=s}return t.scheduleTask(e,c)},onHandleError:function(t,n,e,c){if(T()){var i=a.currentTask||c.task;if(c instanceof Error&&i){var o=k(i.data&&i.data[r],c.stack);try{c.stack=c.longStack=o}catch(t){}}}return t.handleError(e,c)}},function p(){if(T()){var t=[];d(t,2);for(var a=t[0],r=t[1],o=0;o x E"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){!function n(t){t.__load_patch("mocha",(function(n,t){var e=n.Mocha;if(void 0!==e){if(void 0===t)throw new Error("Missing Zone.js");var r=t.ProxyZoneSpec,i=t.SyncTestZoneSpec;if(!r)throw new Error("Missing ProxyZoneSpec");if(e.__zone_patch__)throw new Error('"Mocha" has already been patched with "Zone".');e.__zone_patch__=!0;var o,u,c=t.current,f=c.fork(new i("Mocha.describe")),s=null,a=c.fork(new r),p={after:n.after,afterEach:n.afterEach,before:n.before,beforeEach:n.beforeEach,describe:n.describe,it:n.it};n.describe=n.suite=function(){return p.describe.apply(this,y(arguments))},n.xdescribe=n.suite.skip=n.describe.skip=function(){return p.describe.skip.apply(this,y(arguments))},n.describe.only=n.suite.only=function(){return p.describe.only.apply(this,y(arguments))},n.it=n.specify=n.test=function(){return p.it.apply(this,l(arguments))},n.xit=n.xspecify=n.it.skip=function(){return p.it.skip.apply(this,l(arguments))},n.it.only=n.test.only=function(){return p.it.only.apply(this,l(arguments))},n.after=n.suiteTeardown=function(){return p.after.apply(this,d(arguments))},n.afterEach=n.teardown=function(){return p.afterEach.apply(this,l(arguments))},n.before=n.suiteSetup=function(){return p.before.apply(this,d(arguments))},n.beforeEach=n.setup=function(){return p.beforeEach.apply(this,l(arguments))},o=e.Runner.prototype.runTest,u=e.Runner.prototype.run,e.Runner.prototype.runTest=function(n){var e=this;t.current.scheduleMicroTask("mocha.forceTask",(function(){o.call(e,n)}))},e.Runner.prototype.run=function(n){return this.on("test",(function(n){s=c.fork(new r)})),this.on("fail",(function(n,t){var e=s&&s.get("ProxyZoneSpec");if(e&&t)try{t.message+=e.getAndClearPendingTasksInfo()}catch(n){}})),u.call(this,n)}}function h(n,t,e){for(var r=function(r){var i=n[r];"function"==typeof i&&(n[r]=0===i.length?t(i):e(i),n[r].toString=function(){return i.toString()})},i=0;i * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; var ProxyZoneSpec = /** @class */ (function () { function ProxyZoneSpec(defaultSpecDelegate) { if (defaultSpecDelegate === void 0) { defaultSpecDelegate = null; } this.name = 'ProxyZone'; this._delegateSpec = null; this.properties = { 'ProxyZoneSpec': this }; this.propertyKeys = null; this.lastTaskState = null; this.isNeedToTriggerHasTask = false; this.tasks = []; this.defaultSpecDelegate = defaultSpecDelegate; this.setDelegate(defaultSpecDelegate); } ProxyZoneSpec.get = function () { return Zone.current.get('ProxyZoneSpec'); }; ProxyZoneSpec.isLoaded = function () { return ProxyZoneSpec.get() instanceof ProxyZoneSpec; }; ProxyZoneSpec.assertPresent = function () { var spec = ProxyZoneSpec.get(); if (spec === undefined) { throw new Error("Expected to be running in 'ProxyZone', but it was not found."); } return spec; }; ProxyZoneSpec.prototype.setDelegate = function (delegateSpec) { var _this = this; var isNewDelegate = this._delegateSpec !== delegateSpec; this._delegateSpec = delegateSpec; this.propertyKeys && this.propertyKeys.forEach(function (key) { return delete _this.properties[key]; }); this.propertyKeys = null; if (delegateSpec && delegateSpec.properties) { this.propertyKeys = Object.keys(delegateSpec.properties); this.propertyKeys.forEach(function (k) { return (_this.properties[k] = delegateSpec.properties[k]); }); } // if a new delegateSpec was set, check if we need to trigger hasTask if (isNewDelegate && this.lastTaskState && (this.lastTaskState.macroTask || this.lastTaskState.microTask)) { this.isNeedToTriggerHasTask = true; } }; ProxyZoneSpec.prototype.getDelegate = function () { return this._delegateSpec; }; ProxyZoneSpec.prototype.resetDelegate = function () { this.getDelegate(); this.setDelegate(this.defaultSpecDelegate); }; ProxyZoneSpec.prototype.tryTriggerHasTask = function (parentZoneDelegate, currentZone, targetZone) { if (this.isNeedToTriggerHasTask && this.lastTaskState) { // last delegateSpec has microTask or macroTask // should call onHasTask in current delegateSpec this.isNeedToTriggerHasTask = false; this.onHasTask(parentZoneDelegate, currentZone, targetZone, this.lastTaskState); } }; ProxyZoneSpec.prototype.removeFromTasks = function (task) { if (!this.tasks) { return; } for (var i = 0; i < this.tasks.length; i++) { if (this.tasks[i] === task) { this.tasks.splice(i, 1); return; } } }; ProxyZoneSpec.prototype.getAndClearPendingTasksInfo = function () { if (this.tasks.length === 0) { return ''; } var taskInfo = this.tasks.map(function (task) { var dataInfo = task.data && Object.keys(task.data) .map(function (key) { return key + ':' + task.data[key]; }) .join(','); return "type: ".concat(task.type, ", source: ").concat(task.source, ", args: {").concat(dataInfo, "}"); }); var pendingTasksInfo = '--Pending async tasks are: [' + taskInfo + ']'; // clear tasks this.tasks = []; return pendingTasksInfo; }; ProxyZoneSpec.prototype.onFork = function (parentZoneDelegate, currentZone, targetZone, zoneSpec) { if (this._delegateSpec && this._delegateSpec.onFork) { return this._delegateSpec.onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec); } else { return parentZoneDelegate.fork(targetZone, zoneSpec); } }; ProxyZoneSpec.prototype.onIntercept = function (parentZoneDelegate, currentZone, targetZone, delegate, source) { if (this._delegateSpec && this._delegateSpec.onIntercept) { return this._delegateSpec.onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source); } else { return parentZoneDelegate.intercept(targetZone, delegate, source); } }; ProxyZoneSpec.prototype.onInvoke = function (parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvoke) { return this._delegateSpec.onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source); } else { return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } }; ProxyZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { if (this._delegateSpec && this._delegateSpec.onHandleError) { return this._delegateSpec.onHandleError(parentZoneDelegate, currentZone, targetZone, error); } else { return parentZoneDelegate.handleError(targetZone, error); } }; ProxyZoneSpec.prototype.onScheduleTask = function (parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.tasks.push(task); } if (this._delegateSpec && this._delegateSpec.onScheduleTask) { return this._delegateSpec.onScheduleTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.scheduleTask(targetZone, task); } }; ProxyZoneSpec.prototype.onInvokeTask = function (parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvokeTask) { return this._delegateSpec.onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs); } else { return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); } }; ProxyZoneSpec.prototype.onCancelTask = function (parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onCancelTask) { return this._delegateSpec.onCancelTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.cancelTask(targetZone, task); } }; ProxyZoneSpec.prototype.onHasTask = function (delegate, current, target, hasTaskState) { this.lastTaskState = hasTaskState; if (this._delegateSpec && this._delegateSpec.onHasTask) { this._delegateSpec.onHasTask(delegate, current, target, hasTaskState); } else { delegate.hasTask(target, hasTaskState); } }; return ProxyZoneSpec; }()); function patchProxyZoneSpec(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['ProxyZoneSpec'] = ProxyZoneSpec; } patchProxyZoneSpec(Zone); })); 8γx"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=function(){function e(e){void 0===e&&(e=null),this.name="ProxyZone",this._delegateSpec=null,this.properties={ProxyZoneSpec:this},this.propertyKeys=null,this.lastTaskState=null,this.isNeedToTriggerHasTask=!1,this.tasks=[],this.defaultSpecDelegate=e,this.setDelegate(e)}return e.get=function(){return Zone.current.get("ProxyZoneSpec")},e.isLoaded=function(){return e.get()instanceof e},e.assertPresent=function(){var t=e.get();if(void 0===t)throw new Error("Expected to be running in 'ProxyZone', but it was not found.");return t},e.prototype.setDelegate=function(e){var t=this,s=this._delegateSpec!==e;this._delegateSpec=e,this.propertyKeys&&this.propertyKeys.forEach((function(e){return delete t.properties[e]})),this.propertyKeys=null,e&&e.properties&&(this.propertyKeys=Object.keys(e.properties),this.propertyKeys.forEach((function(s){return t.properties[s]=e.properties[s]}))),s&&this.lastTaskState&&(this.lastTaskState.macroTask||this.lastTaskState.microTask)&&(this.isNeedToTriggerHasTask=!0)},e.prototype.getDelegate=function(){return this._delegateSpec},e.prototype.resetDelegate=function(){this.getDelegate(),this.setDelegate(this.defaultSpecDelegate)},e.prototype.tryTriggerHasTask=function(e,t,s){this.isNeedToTriggerHasTask&&this.lastTaskState&&(this.isNeedToTriggerHasTask=!1,this.onHasTask(e,t,s,this.lastTaskState))},e.prototype.removeFromTasks=function(e){if(this.tasks)for(var t=0;t * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){!function n(e){var t=function(){function n(n){this.runZone=e.current,this.name="syncTestZone for "+n}return n.prototype.onScheduleTask=function(n,e,t,c){switch(c.type){case"microTask":case"macroTask":throw new Error("Cannot call ".concat(c.source," from within a sync test (").concat(this.name,")."));case"eventTask":c=n.scheduleTask(t,c)}return c},n}();e.SyncTestZoneSpec=t}(Zone)}));?Ծx~ 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; /** * A `TaskTrackingZoneSpec` allows one to track all outstanding Tasks. * * This is useful in tests. For example to see which tasks are preventing a test from completing * or an automated way of releasing all of the event listeners at the end of the test. */ var TaskTrackingZoneSpec = /** @class */ (function () { function TaskTrackingZoneSpec() { this.name = 'TaskTrackingZone'; this.microTasks = []; this.macroTasks = []; this.eventTasks = []; this.properties = { 'TaskTrackingZone': this }; } TaskTrackingZoneSpec.get = function () { return Zone.current.get('TaskTrackingZone'); }; TaskTrackingZoneSpec.prototype.getTasksFor = function (type) { switch (type) { case 'microTask': return this.microTasks; case 'macroTask': return this.macroTasks; case 'eventTask': return this.eventTasks; } throw new Error('Unknown task format: ' + type); }; TaskTrackingZoneSpec.prototype.onScheduleTask = function (parentZoneDelegate, currentZone, targetZone, task) { task['creationLocation'] = new Error("Task '".concat(task.type, "' from '").concat(task.source, "'.")); var tasks = this.getTasksFor(task.type); tasks.push(task); return parentZoneDelegate.scheduleTask(targetZone, task); }; TaskTrackingZoneSpec.prototype.onCancelTask = function (parentZoneDelegate, currentZone, targetZone, task) { var tasks = this.getTasksFor(task.type); for (var i = 0; i < tasks.length; i++) { if (tasks[i] == task) { tasks.splice(i, 1); break; } } return parentZoneDelegate.cancelTask(targetZone, task); }; TaskTrackingZoneSpec.prototype.onInvokeTask = function (parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { var _a; if (task.type === 'eventTask' || ((_a = task.data) === null || _a === void 0 ? void 0 : _a.isPeriodic)) return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); var tasks = this.getTasksFor(task.type); for (var i = 0; i < tasks.length; i++) { if (tasks[i] == task) { tasks.splice(i, 1); break; } } return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); }; TaskTrackingZoneSpec.prototype.clearEvents = function () { while (this.eventTasks.length) { Zone.current.cancelTask(this.eventTasks[0]); } }; return TaskTrackingZoneSpec; }()); function patchTaskTracking(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['TaskTrackingZoneSpec'] = TaskTrackingZoneSpec; } patchTaskTracking(Zone); })); ^Xxy"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=function(){function e(){this.name="TaskTrackingZone",this.microTasks=[],this.macroTasks=[],this.eventTasks=[],this.properties={TaskTrackingZone:this}}return e.get=function(){return Zone.current.get("TaskTrackingZone")},e.prototype.getTasksFor=function(e){switch(e){case"microTask":return this.microTasks;case"macroTask":return this.macroTasks;case"eventTask":return this.eventTasks}throw new Error("Unknown task format: "+e)},e.prototype.onScheduleTask=function(e,t,n,s){return s.creationLocation=new Error("Task '".concat(s.type,"' from '").concat(s.source,"'.")),this.getTasksFor(s.type).push(s),e.scheduleTask(n,s)},e.prototype.onCancelTask=function(e,t,n,s){for(var r=this.getTasksFor(s.type),o=0;o * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchMediaQuery(Zone) { Zone.__load_patch('mediaQuery', function (global, Zone, api) { function patchAddListener(proto) { api.patchMethod(proto, 'addListener', function (delegate) { return function (self, args) { var callback = args.length > 0 ? args[0] : null; if (typeof callback === 'function') { var wrapperedCallback = Zone.current.wrap(callback, 'MediaQuery'); callback[api.symbol('mediaQueryCallback')] = wrapperedCallback; return delegate.call(self, wrapperedCallback); } else { return delegate.apply(self, args); } }; }); } function patchRemoveListener(proto) { api.patchMethod(proto, 'removeListener', function (delegate) { return function (self, args) { var callback = args.length > 0 ? args[0] : null; if (typeof callback === 'function') { var wrapperedCallback = callback[api.symbol('mediaQueryCallback')]; if (wrapperedCallback) { return delegate.call(self, wrapperedCallback); } else { return delegate.apply(self, args); } } else { return delegate.apply(self, args); } }; }); } if (global['MediaQueryList']) { var proto = global['MediaQueryList'].prototype; patchAddListener(proto); patchRemoveListener(proto); } else if (global['matchMedia']) { api.patchMethod(global, 'matchMedia', function (delegate) { return function (self, args) { var mql = delegate.apply(self, args); if (mql) { // try to patch MediaQueryList.prototype var proto = Object.getPrototypeOf(mql); if (proto && proto['addListener']) { // try to patch proto, don't need to worry about patch // multiple times, because, api.patchEventTarget will check it patchAddListener(proto); patchRemoveListener(proto); patchAddListener(mql); patchRemoveListener(mql); } else if (mql['addListener']) { // proto not exists, or proto has no addListener method // try to patch mql instance patchAddListener(mql); patchRemoveListener(mql); } } return mql; }; }); } }); } patchMediaQuery(Zone); })); N}S@x"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(t){t.__load_patch("mediaQuery",(function(e,t,n){function r(e){n.patchMethod(e,"addListener",(function(e){return function(r,a){var i=a.length>0?a[0]:null;if("function"==typeof i){var u=t.current.wrap(i,"MediaQuery");return i[n.symbol("mediaQueryCallback")]=u,e.call(r,u)}return e.apply(r,a)}}))}function a(e){n.patchMethod(e,"removeListener",(function(e){return function(t,r){var a=r.length>0?r[0]:null;if("function"==typeof a){var i=a[n.symbol("mediaQueryCallback")];return i?e.call(t,i):e.apply(t,r)}return e.apply(t,r)}}))}if(e.MediaQueryList){var i=e.MediaQueryList.prototype;r(i),a(i)}else e.matchMedia&&n.patchMethod(e,"matchMedia",(function(e){return function(t,n){var i=e.apply(t,n);if(i){var u=Object.getPrototypeOf(i);u&&u.addListener?(r(u),a(u),r(i),a(i)):i.addListener&&(r(i),a(i))}return i}}))}))}(Zone)}));Ccx'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchResizeObserver(Zone) { Zone.__load_patch('ResizeObserver', function (global, Zone, api) { var ResizeObserver = global['ResizeObserver']; if (!ResizeObserver) { return; } var resizeObserverSymbol = api.symbol('ResizeObserver'); api.patchMethod(global, 'ResizeObserver', function (delegate) { return function (self, args) { var callback = args.length > 0 ? args[0] : null; if (callback) { args[0] = function (entries, observer) { var _this = this; var zones = {}; var currZone = Zone.current; for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) { var entry = entries_1[_i]; var zone = entry.target[resizeObserverSymbol]; if (!zone) { zone = currZone; } var zoneEntriesInfo = zones[zone.name]; if (!zoneEntriesInfo) { zones[zone.name] = zoneEntriesInfo = { entries: [], zone: zone }; } zoneEntriesInfo.entries.push(entry); } Object.keys(zones).forEach(function (zoneName) { var zoneEntriesInfo = zones[zoneName]; if (zoneEntriesInfo.zone !== Zone.current) { zoneEntriesInfo.zone.run(callback, _this, [zoneEntriesInfo.entries, observer], 'ResizeObserver'); } else { callback.call(_this, zoneEntriesInfo.entries, observer); } }); }; } return args.length > 0 ? new ResizeObserver(args[0]) : new ResizeObserver(); }; }); api.patchMethod(ResizeObserver.prototype, 'observe', function (delegate) { return function (self, args) { var target = args.length > 0 ? args[0] : null; if (!target) { return delegate.apply(self, args); } var targets = self[resizeObserverSymbol]; if (!targets) { targets = self[resizeObserverSymbol] = []; } targets.push(target); target[resizeObserverSymbol] = Zone.current; return delegate.apply(self, args); }; }); api.patchMethod(ResizeObserver.prototype, 'unobserve', function (delegate) { return function (self, args) { var target = args.length > 0 ? args[0] : null; if (!target) { return delegate.apply(self, args); } var targets = self[resizeObserverSymbol]; if (targets) { for (var i = 0; i < targets.length; i++) { if (targets[i] === target) { targets.splice(i, 1); break; } } } target[resizeObserverSymbol] = undefined; return delegate.apply(self, args); }; }); api.patchMethod(ResizeObserver.prototype, 'disconnect', function (delegate) { return function (self, args) { var targets = self[resizeObserverSymbol]; if (targets) { targets.forEach(function (target) { target[resizeObserverSymbol] = undefined; }); self[resizeObserverSymbol] = undefined; } return delegate.apply(self, args); }; }); }); } patchResizeObserver(Zone); })); {qx^! Notifications&$ notificationX2#Notification = global['Notification&Notification || !Notification.prototyp desc = Object.getOwnPropertyDescriptor(Notification.prototype, 'onerror'); if (!desc || !desc.configurable) {   )OnProperties(Notification.prototype, nullNotifications(Zone); })); #{>^xs!Canvas&$canvasX2-HTMLCanvasElement = global['HTMLCanvasElementtypeof HTMLCanvasElement !== 'undefined' && HTMLCanvasElement.prototype && HTMLCanvasElement.prototype.toBlob M /acroTask(HTMLCanvasElement.prototype, 'toBlob', )`F{ name: 'HTMLCanvasElement.toBlob', target: self, cbIdx: 0, args: args Canvas(Zone); })); m}wyxv!Jsonp&$jsonpX.// because jsonp is not a standard api, there are a lot of // implementations, so zone.js just provide a helper util to // patch the jsonp send and onSuccess/onError callback // the options is an object which contains  // - jsonp, the jsonp object which hold the send function // - sendFuncName, the name of the send function // - successFuncName, success func name // - failedFuncName, failed func name Zone[Zone3.__symbol__('jsonp')] = function patchJsonp(options 3if (!options || !options.jsonp || !options.sendFuncvar noop = function () {J[options.successFuncName, options.failedFuncName].forEach(function (method if (!method   var oriFunc = global[methodName] if (oriFunc `M _ methodName G@%task = global[api.symbol('jsonTask')]`if (task @ task.callback = delegate@ task.invok!U/*  +Object.defineProperty(global, methodName, {configurable: true,numerable: true,get: function ( @  function ( @ `&task = global[api.symbol('jsonpTask')]@Edelegate = global[api.symbol("jsonp".concat(methodName, "callback"))]@ if (task @ @ if (delegat!@ `task.callback = delegate@ @ @ global[api.symbol('jsonpTask')`@ @ !task.invoke.apply(this, arguments &@'@ if (delegat!@ `this, arguments@  &@ @ @ }, set: function"@ Cthis[api.symbol("jsonp".concat(methodName, "callback"))] = callback, M #options.jsonp, options.sendFuncName G`bglobal[api.symbol('jsonpTask')] = Zone.current.scheduleMacroTask('jsonp', noop, {}, function (task `/}, noop  Jsonp(Zone); })); PoxR"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){!function t(o){o.__load_patch("notification",(function(t,o,n){var e=t.Notification;if(e&&e.prototype){var i=Object.getOwnPropertyDescriptor(e.prototype,"onerror");i&&i.configurable&&n.patchOnProperties(e.prototype,null)}}))}(Zone)}));ݓPx 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchRtcPeerConnection(Zone) { Zone.__load_patch('RTCPeerConnection', function (global, Zone, api) { var RTCPeerConnection = global['RTCPeerConnection']; if (!RTCPeerConnection) { return; } var addSymbol = api.symbol('addEventListener'); var removeSymbol = api.symbol('removeEventListener'); RTCPeerConnection.prototype.addEventListener = RTCPeerConnection.prototype[addSymbol]; RTCPeerConnection.prototype.removeEventListener = RTCPeerConnection.prototype[removeSymbol]; // RTCPeerConnection extends EventTarget, so we must clear the symbol // to allow patch RTCPeerConnection.prototype.addEventListener again RTCPeerConnection.prototype[addSymbol] = null; RTCPeerConnection.prototype[removeSymbol] = null; api.patchEventTarget(global, api, [RTCPeerConnection.prototype], { useG: false }); }); } patchRtcPeerConnection(Zone); })); R"x,"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(t){t.__load_patch("RTCPeerConnection",(function(e,t,n){var o=e.RTCPeerConnection;if(o){var r=n.symbol("addEventListener"),p=n.symbol("removeEventListener");o.prototype.addEventListener=o.prototype[r],o.prototype.removeEventListener=o.prototype[p],o.prototype[r]=null,o.prototype[p]=null,n.patchEventTarget(e,n,[o.prototype],{useG:!1})}}))}(Zone)}));þ^x'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchShadyDom(Zone) { Zone.__load_patch('shadydom', function (global, Zone, api) { // https://github.com/angular/zone.js/issues/782 // in web components, shadydom will patch addEventListener/removeEventListener of // Node.prototype and WindowPrototype, this will have conflict with zone.js // so zone.js need to patch them again. var HTMLSlotElement = global.HTMLSlotElement; var prototypes = [ Object.getPrototypeOf(window), Node.prototype, Text.prototype, Element.prototype, HTMLElement.prototype, HTMLSlotElement && HTMLSlotElement.prototype, DocumentFragment.prototype, Document.prototype, ]; prototypes.forEach(function (proto) { if (proto && proto.hasOwnProperty('addEventListener')) { proto[Zone.__symbol__('addEventListener')] = null; proto[Zone.__symbol__('removeEventListener')] = null; api.patchEventTarget(global, api, [proto]); } }); }); } patchShadyDom(Zone); })); 'xy"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){!function t(e){e.__load_patch("shadydom",(function(t,e,o){var n=t.HTMLSlotElement;[Object.getPrototypeOf(window),Node.prototype,Text.prototype,Element.prototype,HTMLElement.prototype,n&&n.prototype,DocumentFragment.prototype,Document.prototype].forEach((function(n){n&&n.hasOwnProperty("addEventListener")&&(n[e.__symbol__("addEventListener")]=null,n[e.__symbol__("removeEventListener")]=null,o.patchEventTarget(t,o,[n]))}))}))}(Zone)}));LٰxP'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; /** * @fileoverview * @suppress {missingRequire} */ var _global = (typeof window === 'object' && window) || (typeof self === 'object' && self) || global; function patchWtf(Zone) { // Detect and setup WTF. var wtfTrace = null; var wtfEvents = null; var wtfEnabled = (function () { var wtf = _global['wtf']; if (wtf) { wtfTrace = wtf.trace; if (wtfTrace) { wtfEvents = wtfTrace.events; return true; } } return false; })(); var WtfZoneSpec = /** @class */ (function () { function WtfZoneSpec() { this.name = 'WTF'; } WtfZoneSpec.prototype.onFork = function (parentZoneDelegate, currentZone, targetZone, zoneSpec) { var retValue = parentZoneDelegate.fork(targetZone, zoneSpec); WtfZoneSpec.forkInstance(zonePathName(targetZone), retValue.name); return retValue; }; WtfZoneSpec.prototype.onInvoke = function (parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { var src = source || 'unknown'; var scope = WtfZoneSpec.invokeScope[src]; if (!scope) { scope = WtfZoneSpec.invokeScope[src] = wtfEvents.createScope("Zone:invoke:".concat(source, "(ascii zone)")); } return wtfTrace.leaveScope(scope(zonePathName(targetZone)), parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source)); }; WtfZoneSpec.prototype.onHandleError = function (parentZoneDelegate, currentZone, targetZone, error) { return parentZoneDelegate.handleError(targetZone, error); }; WtfZoneSpec.prototype.onScheduleTask = function (parentZoneDelegate, currentZone, targetZone, task) { var key = task.type + ':' + task.source; var instance = WtfZoneSpec.scheduleInstance[key]; if (!instance) { instance = WtfZoneSpec.scheduleInstance[key] = wtfEvents.createInstance("Zone:schedule:".concat(key, "(ascii zone, any data)")); } var retValue = parentZoneDelegate.scheduleTask(targetZone, task); instance(zonePathName(targetZone), shallowObj(task.data, 2)); return retValue; }; WtfZoneSpec.prototype.onInvokeTask = function (parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { var source = task.source; var scope = WtfZoneSpec.invokeTaskScope[source]; if (!scope) { scope = WtfZoneSpec.invokeTaskScope[source] = wtfEvents.createScope("Zone:invokeTask:".concat(source, "(ascii zone)")); } return wtfTrace.leaveScope(scope(zonePathName(targetZone)), parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs)); }; WtfZoneSpec.prototype.onCancelTask = function (parentZoneDelegate, currentZone, targetZone, task) { var key = task.source; var instance = WtfZoneSpec.cancelInstance[key]; if (!instance) { instance = WtfZoneSpec.cancelInstance[key] = wtfEvents.createInstance("Zone:cancel:".concat(key, "(ascii zone, any options)")); } var retValue = parentZoneDelegate.cancelTask(targetZone, task); instance(zonePathName(targetZone), shallowObj(task.data, 2)); return retValue; }; WtfZoneSpec.forkInstance = wtfEnabled ? wtfEvents.createInstance('Zone:fork(ascii zone, ascii newZone)') : null; WtfZoneSpec.scheduleInstance = {}; WtfZoneSpec.cancelInstance = {}; WtfZoneSpec.invokeScope = {}; WtfZoneSpec.invokeTaskScope = {}; return WtfZoneSpec; }()); function shallowObj(obj, depth) { if (!obj || !depth) return null; var out = {}; for (var key in obj) { if (obj.hasOwnProperty(key)) { // explicit : any due to https://github.com/microsoft/TypeScript/issues/33191 var value = obj[key]; switch (typeof value) { case 'object': var name_1 = value && value.constructor && value.constructor.name; value = name_1 == Object.name ? shallowObj(value, depth - 1) : name_1; break; case 'function': value = value.name || undefined; break; } out[key] = value; } } return out; } function zonePathName(zone) { var name = zone.name; var localZone = zone.parent; while (localZone != null) { name = localZone.name + '::' + name; localZone = localZone.parent; } return name; } Zone['wtfZoneSpec'] = !wtfEnabled ? null : new WtfZoneSpec(); } patchWtf(Zone); })); (e~x"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){var n="object"==typeof window&&window||"object"==typeof self&&self||global;!function e(o){var c,t=null,a=null,r=!(!(c=n.wtf)||!(t=c.trace)||(a=t.events,0)),i=function(){function n(){this.name="WTF"}return n.prototype.onFork=function(e,o,c,t){var a=e.fork(c,t);return n.forkInstance(u(c),a.name),a},n.prototype.onInvoke=function(e,o,c,r,i,s,f){var l=f||"unknown",p=n.invokeScope[l];return p||(p=n.invokeScope[l]=a.createScope("Zone:invoke:".concat(f,"(ascii zone)"))),t.leaveScope(p(u(c)),e.invoke(c,r,i,s,f))},n.prototype.onHandleError=function(n,e,o,c){return n.handleError(o,c)},n.prototype.onScheduleTask=function(e,o,c,t){var r=t.type+":"+t.source,i=n.scheduleInstance[r];i||(i=n.scheduleInstance[r]=a.createInstance("Zone:schedule:".concat(r,"(ascii zone, any data)")));var f=e.scheduleTask(c,t);return i(u(c),s(t.data,2)),f},n.prototype.onInvokeTask=function(e,o,c,r,i,s){var f=r.source,l=n.invokeTaskScope[f];return l||(l=n.invokeTaskScope[f]=a.createScope("Zone:invokeTask:".concat(f,"(ascii zone)"))),t.leaveScope(l(u(c)),e.invokeTask(c,r,i,s))},n.prototype.onCancelTask=function(e,o,c,t){var r=t.source,i=n.cancelInstance[r];i||(i=n.cancelInstance[r]=a.createInstance("Zone:cancel:".concat(r,"(ascii zone, any options)")));var f=e.cancelTask(c,t);return i(u(c),s(t.data,2)),f},n.forkInstance=r?a.createInstance("Zone:fork(ascii zone, ascii newZone)"):null,n.scheduleInstance={},n.cancelInstance={},n.invokeScope={},n.invokeTaskScope={},n}();function s(n,e){if(!n||!e)return null;var o={};for(var c in n)if(n.hasOwnProperty(c)){var t=n[c];switch(typeof t){case"object":var a=t&&t.constructor&&t.constructor.name;t=a==Object.name?s(t,e-1):a;break;case"function":t=t.name||void 0}o[c]=t}return o}function u(n){for(var e=n.name,o=n.parent;null!=o;)e=o.name+"::"+e,o=o.parent;return e}o.wtfZoneSpec=r?new i:null}(Zone)}));PYxo"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){!function n(e){e.__load_patch("bluebird",(function(n,e,o){e[e.__symbol__("bluebird")]=function t(i){["then","spread","finally"].forEach((function(n){o.patchMethod(i.prototype,n,(function(n){return function(o,t){for(var r=e.current,c=function(n){var e=t[n];"function"==typeof e&&(t[n]=function(){var n=this,o=arguments;return new i((function(t,i){r.scheduleMicroTask("Promise.then",(function(){try{t(e.apply(n,o))}catch(n){i(n)}}))}))})},d=0;d * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; /** * @fileoverview * @suppress {globalThis,undefinedVars} */ function patchError(Zone) { Zone.__load_patch('Error', function (global, Zone, api) { /* * This code patches Error so that: * - It ignores un-needed stack frames. * - It Shows the associated Zone for reach frame. */ var zoneJsInternalStackFramesSymbol = api.symbol('zoneJsInternalStackFrames'); var NativeError = (global[api.symbol('Error')] = global['Error']); // Store the frames which should be removed from the stack frames var zoneJsInternalStackFrames = {}; // We must find the frame where Error was created, otherwise we assume we don't understand stack var zoneAwareFrame1; var zoneAwareFrame2; var zoneAwareFrame1WithoutNew; var zoneAwareFrame2WithoutNew; var zoneAwareFrame3WithoutNew; global['Error'] = ZoneAwareError; var stackRewrite = 'stackRewrite'; var zoneJsInternalStackFramesPolicy = global['__Zone_Error_BlacklistedStackFrames_policy'] || global['__Zone_Error_ZoneJsInternalStackFrames_policy'] || 'default'; function buildZoneFrameNames(zoneFrame) { var zoneFrameName = { zoneName: zoneFrame.zone.name }; var result = zoneFrameName; while (zoneFrame.parent) { zoneFrame = zoneFrame.parent; var parentZoneFrameName = { zoneName: zoneFrame.zone.name }; zoneFrameName.parent = parentZoneFrameName; zoneFrameName = parentZoneFrameName; } return result; } function buildZoneAwareStackFrames(originalStack, zoneFrame, isZoneFrame) { if (isZoneFrame === void 0) { isZoneFrame = true; } var frames = originalStack.split('\n'); var i = 0; // Find the first frame while (!(frames[i] === zoneAwareFrame1 || frames[i] === zoneAwareFrame2 || frames[i] === zoneAwareFrame1WithoutNew || frames[i] === zoneAwareFrame2WithoutNew || frames[i] === zoneAwareFrame3WithoutNew) && i < frames.length) { i++; } for (; i < frames.length && zoneFrame; i++) { var frame = frames[i]; if (frame.trim()) { switch (zoneJsInternalStackFrames[frame]) { case 0 /* FrameType.zoneJsInternal */: frames.splice(i, 1); i--; break; case 1 /* FrameType.transition */: if (zoneFrame.parent) { // This is the special frame where zone changed. Print and process it accordingly zoneFrame = zoneFrame.parent; } else { zoneFrame = null; } frames.splice(i, 1); i--; break; default: frames[i] += isZoneFrame ? " [".concat(zoneFrame.zone.name, "]") : " [".concat(zoneFrame.zoneName, "]"); } } } return frames.join('\n'); } /** * This is ZoneAwareError which processes the stack frame and cleans up extra frames as well as * adds zone information to it. */ function ZoneAwareError() { var _this = this; // We always have to return native error otherwise the browser console will not work. var error = NativeError.apply(this, arguments); // Save original stack trace var originalStack = (error['originalStack'] = error.stack); // Process the stack trace and rewrite the frames. if (ZoneAwareError[stackRewrite] && originalStack) { var zoneFrame = api.currentZoneFrame(); if (zoneJsInternalStackFramesPolicy === 'lazy') { // don't handle stack trace now error[api.symbol('zoneFrameNames')] = buildZoneFrameNames(zoneFrame); } else if (zoneJsInternalStackFramesPolicy === 'default') { try { error.stack = error.zoneAwareStack = buildZoneAwareStackFrames(originalStack, zoneFrame); } catch (e) { // ignore as some browsers don't allow overriding of stack } } } if (this instanceof NativeError && this.constructor != NativeError) { // We got called with a `new` operator AND we are subclass of ZoneAwareError // in that case we have to copy all of our properties to `this`. Object.keys(error) .concat('stack', 'message', 'cause') .forEach(function (key) { var value = error[key]; if (value !== undefined) { try { _this[key] = value; } catch (e) { // ignore the assignment in case it is a setter and it throws. } } }); return this; } return error; } // Copy the prototype so that instanceof operator works as expected ZoneAwareError.prototype = NativeError.prototype; ZoneAwareError[zoneJsInternalStackFramesSymbol] = zoneJsInternalStackFrames; ZoneAwareError[stackRewrite] = false; var zoneAwareStackSymbol = api.symbol('zoneAwareStack'); // try to define zoneAwareStack property when zoneJsInternal frames policy is delay if (zoneJsInternalStackFramesPolicy === 'lazy') { Object.defineProperty(ZoneAwareError.prototype, 'zoneAwareStack', { configurable: true, enumerable: true, get: function () { if (!this[zoneAwareStackSymbol]) { this[zoneAwareStackSymbol] = buildZoneAwareStackFrames(this.originalStack, this[api.symbol('zoneFrameNames')], false); } return this[zoneAwareStackSymbol]; }, set: function (newStack) { this.originalStack = newStack; this[zoneAwareStackSymbol] = buildZoneAwareStackFrames(this.originalStack, this[api.symbol('zoneFrameNames')], false); }, }); } // those properties need special handling var specialPropertyNames = ['stackTraceLimit', 'captureStackTrace', 'prepareStackTrace']; // those properties of NativeError should be set to ZoneAwareError var nativeErrorProperties = Object.keys(NativeError); if (nativeErrorProperties) { nativeErrorProperties.forEach(function (prop) { if (specialPropertyNames.filter(function (sp) { return sp === prop; }).length === 0) { Object.defineProperty(ZoneAwareError, prop, { get: function () { return NativeError[prop]; }, set: function (value) { NativeError[prop] = value; }, }); } }); } if (NativeError.hasOwnProperty('stackTraceLimit')) { // Extend default stack limit as we will be removing few frames. NativeError.stackTraceLimit = Math.max(NativeError.stackTraceLimit, 15); // make sure that ZoneAwareError has the same property which forwards to NativeError. Object.defineProperty(ZoneAwareError, 'stackTraceLimit', { get: function () { return NativeError.stackTraceLimit; }, set: function (value) { return (NativeError.stackTraceLimit = value); }, }); } if (NativeError.hasOwnProperty('captureStackTrace')) { Object.defineProperty(ZoneAwareError, 'captureStackTrace', { // add named function here because we need to remove this // stack frame when prepareStackTrace below value: function zoneCaptureStackTrace(targetObject, constructorOpt) { NativeError.captureStackTrace(targetObject, constructorOpt); }, }); } var ZONE_CAPTURESTACKTRACE = 'zoneCaptureStackTrace'; Object.defineProperty(ZoneAwareError, 'prepareStackTrace', { get: function () { return NativeError.prepareStackTrace; }, set: function (value) { if (!value || typeof value !== 'function') { return (NativeError.prepareStackTrace = value); } return (NativeError.prepareStackTrace = function (error, structuredStackTrace) { // remove additional stack information from ZoneAwareError.captureStackTrace if (structuredStackTrace) { for (var i = 0; i < structuredStackTrace.length; i++) { var st = structuredStackTrace[i]; // remove the first function which name is zoneCaptureStackTrace if (st.getFunctionName() === ZONE_CAPTURESTACKTRACE) { structuredStackTrace.splice(i, 1); break; } } } return value.call(this, error, structuredStackTrace); }); }, }); if (zoneJsInternalStackFramesPolicy === 'disable') { // don't need to run detectZone to populate zoneJs internal stack frames return; } // Now we need to populate the `zoneJsInternalStackFrames` as well as find the // run/runGuarded/runTask frames. This is done by creating a detect zone and then threading // the execution through all of the above methods so that we can look at the stack trace and // find the frames of interest. var detectZone = Zone.current.fork({ name: 'detect', onHandleError: function (parentZD, current, target, error) { if (error.originalStack && Error === ZoneAwareError) { var frames_1 = error.originalStack.split(/\n/); var runFrame = false, runGuardedFrame = false, runTaskFrame = false; while (frames_1.length) { var frame = frames_1.shift(); // On safari it is possible to have stack frame with no line number. // This check makes sure that we don't filter frames on name only (must have // line number or exact equals to `ZoneAwareError`) if (/:\d+:\d+/.test(frame) || frame === 'ZoneAwareError') { // Get rid of the path so that we don't accidentally find function name in path. // In chrome the separator is `(` and `@` in FF and safari // Chrome: at Zone.run (zone.js:100) // Chrome: at Zone.run (http://localhost:9876/base/build/lib/zone.js:100:24) // FireFox: Zone.prototype.run@http://localhost:9876/base/build/lib/zone.js:101:24 // Safari: run@http://localhost:9876/base/build/lib/zone.js:101:24 var fnName = frame.split('(')[0].split('@')[0]; var frameType = 1 /* FrameType.transition */; if (fnName.indexOf('ZoneAwareError') !== -1) { if (fnName.indexOf('new ZoneAwareError') !== -1) { zoneAwareFrame1 = frame; zoneAwareFrame2 = frame.replace('new ZoneAwareError', 'new Error.ZoneAwareError'); } else { zoneAwareFrame1WithoutNew = frame; zoneAwareFrame2WithoutNew = frame.replace('Error.', ''); if (frame.indexOf('Error.ZoneAwareError') === -1) { zoneAwareFrame3WithoutNew = frame.replace('ZoneAwareError', 'Error.ZoneAwareError'); } } zoneJsInternalStackFrames[zoneAwareFrame2] = 0 /* FrameType.zoneJsInternal */; } if (fnName.indexOf('runGuarded') !== -1) { runGuardedFrame = true; } else if (fnName.indexOf('runTask') !== -1) { runTaskFrame = true; } else if (fnName.indexOf('run') !== -1) { runFrame = true; } else { frameType = 0 /* FrameType.zoneJsInternal */; } zoneJsInternalStackFrames[frame] = frameType; // Once we find all of the frames we can stop looking. if (runFrame && runGuardedFrame && runTaskFrame) { ZoneAwareError[stackRewrite] = true; break; } } } } return false; }, }); // carefully constructor a stack frame which contains all of the frames of interest which // need to be detected and marked as an internal zoneJs frame. var childDetectZone = detectZone.fork({ name: 'child', onScheduleTask: function (delegate, curr, target, task) { return delegate.scheduleTask(target, task); }, onInvokeTask: function (delegate, curr, target, task, applyThis, applyArgs) { return delegate.invokeTask(target, task, applyThis, applyArgs); }, onCancelTask: function (delegate, curr, target, task) { return delegate.cancelTask(target, task); }, onInvoke: function (delegate, curr, target, callback, applyThis, applyArgs, source) { return delegate.invoke(target, callback, applyThis, applyArgs, source); }, }); // we need to detect all zone related frames, it will // exceed default stackTraceLimit, so we set it to // larger number here, and restore it after detect finish. // We cast through any so we don't need to depend on nodejs typings. var originalStackTraceLimit = Error.stackTraceLimit; Error.stackTraceLimit = 100; // we schedule event/micro/macro task, and invoke them // when onSchedule, so we can get all stack traces for // all kinds of tasks with one error thrown. childDetectZone.run(function () { childDetectZone.runGuarded(function () { var fakeTransitionTo = function () { }; childDetectZone.scheduleEventTask(zoneJsInternalStackFramesSymbol, function () { childDetectZone.scheduleMacroTask(zoneJsInternalStackFramesSymbol, function () { childDetectZone.scheduleMicroTask(zoneJsInternalStackFramesSymbol, function () { throw new Error(); }, undefined, function (t) { t._transitionTo = fakeTransitionTo; t.invoke(); }); childDetectZone.scheduleMicroTask(zoneJsInternalStackFramesSymbol, function () { throw Error(); }, undefined, function (t) { t._transitionTo = fakeTransitionTo; t.invoke(); }); }, undefined, function (t) { t._transitionTo = fakeTransitionTo; t.invoke(); }, function () { }); }, undefined, function (t) { t._transitionTo = fakeTransitionTo; t.invoke(); }, function () { }); }); }); Error.stackTraceLimit = originalStackTraceLimit; }); } patchError(Zone); })); 4xO"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(r){"function"==typeof define&&define.amd?define(r):r()}((function(){!function r(e){e.__load_patch("Error",(function(r,e,n){var t,a,o,i,c,s=n.symbol("zoneJsInternalStackFrames"),u=r[n.symbol("Error")]=r.Error,f={};r.Error=d;var k="stackRewrite",l=r.__Zone_Error_BlacklistedStackFrames_policy||r.__Zone_Error_ZoneJsInternalStackFrames_policy||"default";function p(r,e,n){void 0===n&&(n=!0);for(var s=r.split("\n"),u=0;s[u]!==t&&s[u]!==a&&s[u]!==o&&s[u]!==i&&s[u]!==c&&u * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; /* * This is necessary for Chrome and Chrome mobile, to enable * things like redefining `createdCallback` on an element. */ var zoneSymbol; var _defineProperty; var _getOwnPropertyDescriptor; var _create; var unconfigurablesKey; function propertyPatch() { zoneSymbol = Zone.__symbol__; _defineProperty = Object[zoneSymbol('defineProperty')] = Object.defineProperty; _getOwnPropertyDescriptor = Object[zoneSymbol('getOwnPropertyDescriptor')] = Object.getOwnPropertyDescriptor; _create = Object.create; unconfigurablesKey = zoneSymbol('unconfigurables'); Object.defineProperty = function (obj, prop, desc) { if (isUnconfigurable(obj, prop)) { throw new TypeError("Cannot assign to read only property '" + prop + "' of " + obj); } var originalConfigurableFlag = desc.configurable; if (prop !== 'prototype') { desc = rewriteDescriptor(obj, prop, desc); } return _tryDefineProperty(obj, prop, desc, originalConfigurableFlag); }; Object.defineProperties = function (obj, props) { Object.keys(props).forEach(function (prop) { Object.defineProperty(obj, prop, props[prop]); }); for (var _i = 0, _a = Object.getOwnPropertySymbols(props); _i < _a.length; _i++) { var sym = _a[_i]; var desc = Object.getOwnPropertyDescriptor(props, sym); // Since `Object.getOwnPropertySymbols` returns *all* symbols, // including non-enumerable ones, retrieve property descriptor and check // enumerability there. Proceed with the rewrite only when a property is // enumerable to make the logic consistent with the way regular // properties are retrieved (via `Object.keys`, which respects // `enumerable: false` flag). More information: // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties#retrieval if (desc === null || desc === void 0 ? void 0 : desc.enumerable) { Object.defineProperty(obj, sym, props[sym]); } } return obj; }; Object.create = function (proto, propertiesObject) { if (typeof propertiesObject === 'object' && !Object.isFrozen(propertiesObject)) { Object.keys(propertiesObject).forEach(function (prop) { propertiesObject[prop] = rewriteDescriptor(proto, prop, propertiesObject[prop]); }); } return _create(proto, propertiesObject); }; Object.getOwnPropertyDescriptor = function (obj, prop) { var desc = _getOwnPropertyDescriptor(obj, prop); if (desc && isUnconfigurable(obj, prop)) { desc.configurable = false; } return desc; }; } function _redefineProperty(obj, prop, desc) { var originalConfigurableFlag = desc.configurable; desc = rewriteDescriptor(obj, prop, desc); return _tryDefineProperty(obj, prop, desc, originalConfigurableFlag); } function isUnconfigurable(obj, prop) { return obj && obj[unconfigurablesKey] && obj[unconfigurablesKey][prop]; } function rewriteDescriptor(obj, prop, desc) { // issue-927, if the desc is frozen, don't try to change the desc if (!Object.isFrozen(desc)) { desc.configurable = true; } if (!desc.configurable) { // issue-927, if the obj is frozen, don't try to set the desc to obj if (!obj[unconfigurablesKey] && !Object.isFrozen(obj)) { _defineProperty(obj, unconfigurablesKey, { writable: true, value: {} }); } if (obj[unconfigurablesKey]) { obj[unconfigurablesKey][prop] = true; } } return desc; } function _tryDefineProperty(obj, prop, desc, originalConfigurableFlag) { try { return _defineProperty(obj, prop, desc); } catch (error) { if (desc.configurable) { // In case of errors, when the configurable flag was likely set by rewriteDescriptor(), // let's retry with the original flag value if (typeof originalConfigurableFlag == 'undefined') { delete desc.configurable; } else { desc.configurable = originalConfigurableFlag; } try { return _defineProperty(obj, prop, desc); } catch (error) { var swallowError = false; if (prop === 'createdCallback' || prop === 'attachedCallback' || prop === 'detachedCallback' || prop === 'attributeChangedCallback') { // We only swallow the error in registerElement patch // this is the work around since some applications // fail if we throw the error swallowError = true; } if (!swallowError) { throw error; } // TODO: @JiaLiPassion, Some application such as `registerElement` patch // still need to swallow the error, in the future after these applications // are updated, the following logic can be removed. var descJson = null; try { descJson = JSON.stringify(desc); } catch (error) { descJson = desc.toString(); } console.log("Attempting to configure '".concat(prop, "' with descriptor '").concat(descJson, "' on object '").concat(obj, "' and got error, giving up: ").concat(error)); } } else { throw error; } } } function eventTargetLegacyPatch(_global, api) { var _a = api.getGlobalObjects(), eventNames = _a.eventNames, globalSources = _a.globalSources, zoneSymbolEventNames = _a.zoneSymbolEventNames, TRUE_STR = _a.TRUE_STR, FALSE_STR = _a.FALSE_STR, ZONE_SYMBOL_PREFIX = _a.ZONE_SYMBOL_PREFIX; var WTF_ISSUE_555 = 'Anchor,Area,Audio,BR,Base,BaseFont,Body,Button,Canvas,Content,DList,Directory,Div,Embed,FieldSet,Font,Form,Frame,FrameSet,HR,Head,Heading,Html,IFrame,Image,Input,Keygen,LI,Label,Legend,Link,Map,Marquee,Media,Menu,Meta,Meter,Mod,OList,Object,OptGroup,Option,Output,Paragraph,Pre,Progress,Quote,Script,Select,Source,Span,Style,TableCaption,TableCell,TableCol,Table,TableRow,TableSection,TextArea,Title,Track,UList,Unknown,Video'; var NO_EVENT_TARGET = 'ApplicationCache,EventSource,FileReader,InputMethodContext,MediaController,MessagePort,Node,Performance,SVGElementInstance,SharedWorker,TextTrack,TextTrackCue,TextTrackList,WebKitNamedFlow,Window,Worker,WorkerGlobalScope,XMLHttpRequest,XMLHttpRequestEventTarget,XMLHttpRequestUpload,IDBRequest,IDBOpenDBRequest,IDBDatabase,IDBTransaction,IDBCursor,DBIndex,WebSocket'.split(','); var EVENT_TARGET = 'EventTarget'; var apis = []; var isWtf = _global['wtf']; var WTF_ISSUE_555_ARRAY = WTF_ISSUE_555.split(','); if (isWtf) { // Workaround for: https://github.com/google/tracing-framework/issues/555 apis = WTF_ISSUE_555_ARRAY.map(function (v) { return 'HTML' + v + 'Element'; }).concat(NO_EVENT_TARGET); } else if (_global[EVENT_TARGET]) { apis.push(EVENT_TARGET); } else { // Note: EventTarget is not available in all browsers, // if it's not available, we instead patch the APIs in the IDL that inherit from EventTarget apis = NO_EVENT_TARGET; } var isDisableIECheck = _global['__Zone_disable_IE_check'] || false; var isEnableCrossContextCheck = _global['__Zone_enable_cross_context_check'] || false; var ieOrEdge = api.isIEOrEdge(); var ADD_EVENT_LISTENER_SOURCE = '.addEventListener:'; var FUNCTION_WRAPPER = '[object FunctionWrapper]'; var BROWSER_TOOLS = 'function __BROWSERTOOLS_CONSOLE_SAFEFUNC() { [native code] }'; var pointerEventsMap = { 'MSPointerCancel': 'pointercancel', 'MSPointerDown': 'pointerdown', 'MSPointerEnter': 'pointerenter', 'MSPointerHover': 'pointerhover', 'MSPointerLeave': 'pointerleave', 'MSPointerMove': 'pointermove', 'MSPointerOut': 'pointerout', 'MSPointerOver': 'pointerover', 'MSPointerUp': 'pointerup', }; // predefine all __zone_symbol__ + eventName + true/false string for (var i = 0; i < eventNames.length; i++) { var eventName = eventNames[i]; var falseEventName = eventName + FALSE_STR; var trueEventName = eventName + TRUE_STR; var symbol = ZONE_SYMBOL_PREFIX + falseEventName; var symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } // predefine all task.source string for (var i = 0; i < WTF_ISSUE_555_ARRAY.length; i++) { var target = WTF_ISSUE_555_ARRAY[i]; var targets = (globalSources[target] = {}); for (var j = 0; j < eventNames.length; j++) { var eventName = eventNames[j]; targets[eventName] = target + ADD_EVENT_LISTENER_SOURCE + eventName; } } var checkIEAndCrossContext = function (nativeDelegate, delegate, target, args) { if (!isDisableIECheck && ieOrEdge) { if (isEnableCrossContextCheck) { try { var testString = delegate.toString(); if (testString === FUNCTION_WRAPPER || testString == BROWSER_TOOLS) { nativeDelegate.apply(target, args); return false; } } catch (error) { nativeDelegate.apply(target, args); return false; } } else { var testString = delegate.toString(); if (testString === FUNCTION_WRAPPER || testString == BROWSER_TOOLS) { nativeDelegate.apply(target, args); return false; } } } else if (isEnableCrossContextCheck) { try { delegate.toString(); } catch (error) { nativeDelegate.apply(target, args); return false; } } return true; }; var apiTypes = []; for (var i = 0; i < apis.length; i++) { var type = _global[apis[i]]; apiTypes.push(type && type.prototype); } // vh is validateHandler to check event handler // is valid or not(for security check) api.patchEventTarget(_global, api, apiTypes, { vh: checkIEAndCrossContext, transferEventName: function (eventName) { var pointerEventName = pointerEventsMap[eventName]; return pointerEventName || eventName; }, }); Zone[api.symbol('patchEventTarget')] = !!_global[EVENT_TARGET]; return true; } // we have to patch the instance since the proto is non-configurable function apply(api, _global) { var _a = api.getGlobalObjects(), ADD_EVENT_LISTENER_STR = _a.ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR = _a.REMOVE_EVENT_LISTENER_STR; var WS = _global.WebSocket; // On Safari window.EventTarget doesn't exist so need to patch WS add/removeEventListener // On older Chrome, no need since EventTarget was already patched if (!_global.EventTarget) { api.patchEventTarget(_global, api, [WS.prototype]); } _global.WebSocket = function (x, y) { var socket = arguments.length > 1 ? new WS(x, y) : new WS(x); var proxySocket; var proxySocketProto; // Safari 7.0 has non-configurable own 'onmessage' and friends properties on the socket instance var onmessageDesc = api.ObjectGetOwnPropertyDescriptor(socket, 'onmessage'); if (onmessageDesc && onmessageDesc.configurable === false) { proxySocket = api.ObjectCreate(socket); // socket have own property descriptor 'onopen', 'onmessage', 'onclose', 'onerror' // but proxySocket not, so we will keep socket as prototype and pass it to // patchOnProperties method proxySocketProto = socket; [ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR, 'send', 'close'].forEach(function (propName) { proxySocket[propName] = function () { var args = api.ArraySlice.call(arguments); if (propName === ADD_EVENT_LISTENER_STR || propName === REMOVE_EVENT_LISTENER_STR) { var eventName = args.length > 0 ? args[0] : undefined; if (eventName) { var propertySymbol = Zone.__symbol__('ON_PROPERTY' + eventName); socket[propertySymbol] = proxySocket[propertySymbol]; } } return socket[propName].apply(socket, args); }; }); } else { // we can patch the real socket proxySocket = socket; } api.patchOnProperties(proxySocket, ['close', 'error', 'message', 'open'], proxySocketProto); return proxySocket; }; var globalWebSocket = _global['WebSocket']; for (var prop in WS) { globalWebSocket[prop] = WS[prop]; } } /** * @fileoverview * @suppress {globalThis} */ function propertyDescriptorLegacyPatch(api, _global) { var _a = api.getGlobalObjects(), isNode = _a.isNode, isMix = _a.isMix; if (isNode && !isMix) { return; } if (!canPatchViaPropertyDescriptor(api, _global)) { var supportsWebSocket = typeof WebSocket !== 'undefined'; // Safari, Android browsers (Jelly Bean) patchViaCapturingAllTheEvents(api); api.patchClass('XMLHttpRequest'); if (supportsWebSocket) { apply(api, _global); } Zone[api.symbol('patchEvents')] = true; } } function canPatchViaPropertyDescriptor(api, _global) { var _a = api.getGlobalObjects(), isBrowser = _a.isBrowser, isMix = _a.isMix; if ((isBrowser || isMix) && !api.ObjectGetOwnPropertyDescriptor(HTMLElement.prototype, 'onclick') && typeof Element !== 'undefined') { // WebKit https://bugs.webkit.org/show_bug.cgi?id=134364 // IDL interface attributes are not configurable var desc = api.ObjectGetOwnPropertyDescriptor(Element.prototype, 'onclick'); if (desc && !desc.configurable) return false; // try to use onclick to detect whether we can patch via propertyDescriptor // because XMLHttpRequest is not available in service worker if (desc) { api.ObjectDefineProperty(Element.prototype, 'onclick', { enumerable: true, configurable: true, get: function () { return true; }, }); var div = document.createElement('div'); var result = !!div.onclick; api.ObjectDefineProperty(Element.prototype, 'onclick', desc); return result; } } var XMLHttpRequest = _global['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return false; } var ON_READY_STATE_CHANGE = 'onreadystatechange'; var XMLHttpRequestPrototype = XMLHttpRequest.prototype; var xhrDesc = api.ObjectGetOwnPropertyDescriptor(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE); // add enumerable and configurable here because in opera // by default XMLHttpRequest.prototype.onreadystatechange is undefined // without adding enumerable and configurable will cause onreadystatechange // non-configurable // and if XMLHttpRequest.prototype.onreadystatechange is undefined, // we should set a real desc instead a fake one if (xhrDesc) { api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, { enumerable: true, configurable: true, get: function () { return true; }, }); var req = new XMLHttpRequest(); var result = !!req.onreadystatechange; // restore original desc api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, xhrDesc || {}); return result; } else { var SYMBOL_FAKE_ONREADYSTATECHANGE_1 = api.symbol('fake'); api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, { enumerable: true, configurable: true, get: function () { return this[SYMBOL_FAKE_ONREADYSTATECHANGE_1]; }, set: function (value) { this[SYMBOL_FAKE_ONREADYSTATECHANGE_1] = value; }, }); var req = new XMLHttpRequest(); var detectFunc = function () { }; req.onreadystatechange = detectFunc; var result = req[SYMBOL_FAKE_ONREADYSTATECHANGE_1] === detectFunc; req.onreadystatechange = null; return result; } } var globalEventHandlersEventNames = [ 'abort', 'animationcancel', 'animationend', 'animationiteration', 'auxclick', 'beforeinput', 'blur', 'cancel', 'canplay', 'canplaythrough', 'change', 'compositionstart', 'compositionupdate', 'compositionend', 'cuechange', 'click', 'close', 'contextmenu', 'curechange', 'dblclick', 'drag', 'dragend', 'dragenter', 'dragexit', 'dragleave', 'dragover', 'drop', 'durationchange', 'emptied', 'ended', 'error', 'focus', 'focusin', 'focusout', 'gotpointercapture', 'input', 'invalid', 'keydown', 'keypress', 'keyup', 'load', 'loadstart', 'loadeddata', 'loadedmetadata', 'lostpointercapture', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'mousewheel', 'orientationchange', 'pause', 'play', 'playing', 'pointercancel', 'pointerdown', 'pointerenter', 'pointerleave', 'pointerlockchange', 'mozpointerlockchange', 'webkitpointerlockerchange', 'pointerlockerror', 'mozpointerlockerror', 'webkitpointerlockerror', 'pointermove', 'pointout', 'pointerover', 'pointerup', 'progress', 'ratechange', 'reset', 'resize', 'scroll', 'seeked', 'seeking', 'select', 'selectionchange', 'selectstart', 'show', 'sort', 'stalled', 'submit', 'suspend', 'timeupdate', 'volumechange', 'touchcancel', 'touchmove', 'touchstart', 'touchend', 'transitioncancel', 'transitionend', 'waiting', 'wheel', ]; var documentEventNames = [ 'afterscriptexecute', 'beforescriptexecute', 'DOMContentLoaded', 'freeze', 'fullscreenchange', 'mozfullscreenchange', 'webkitfullscreenchange', 'msfullscreenchange', 'fullscreenerror', 'mozfullscreenerror', 'webkitfullscreenerror', 'msfullscreenerror', 'readystatechange', 'visibilitychange', 'resume', ]; var windowEventNames = [ 'absolutedeviceorientation', 'afterinput', 'afterprint', 'appinstalled', 'beforeinstallprompt', 'beforeprint', 'beforeunload', 'devicelight', 'devicemotion', 'deviceorientation', 'deviceorientationabsolute', 'deviceproximity', 'hashchange', 'languagechange', 'message', 'mozbeforepaint', 'offline', 'online', 'paint', 'pageshow', 'pagehide', 'popstate', 'rejectionhandled', 'storage', 'unhandledrejection', 'unload', 'userproximity', 'vrdisplayconnected', 'vrdisplaydisconnected', 'vrdisplaypresentchange', ]; var htmlElementEventNames = [ 'beforecopy', 'beforecut', 'beforepaste', 'copy', 'cut', 'paste', 'dragstart', 'loadend', 'animationstart', 'search', 'transitionrun', 'transitionstart', 'webkitanimationend', 'webkitanimationiteration', 'webkitanimationstart', 'webkittransitionend', ]; var ieElementEventNames = [ 'activate', 'afterupdate', 'ariarequest', 'beforeactivate', 'beforedeactivate', 'beforeeditfocus', 'beforeupdate', 'cellchange', 'controlselect', 'dataavailable', 'datasetchanged', 'datasetcomplete', 'errorupdate', 'filterchange', 'layoutcomplete', 'losecapture', 'move', 'moveend', 'movestart', 'propertychange', 'resizeend', 'resizestart', 'rowenter', 'rowexit', 'rowsdelete', 'rowsinserted', 'command', 'compassneedscalibration', 'deactivate', 'help', 'mscontentzoom', 'msmanipulationstatechanged', 'msgesturechange', 'msgesturedoubletap', 'msgestureend', 'msgesturehold', 'msgesturestart', 'msgesturetap', 'msgotpointercapture', 'msinertiastart', 'mslostpointercapture', 'mspointercancel', 'mspointerdown', 'mspointerenter', 'mspointerhover', 'mspointerleave', 'mspointermove', 'mspointerout', 'mspointerover', 'mspointerup', 'pointerout', 'mssitemodejumplistitemremoved', 'msthumbnailclick', 'stop', 'storagecommit', ]; var webglEventNames = ['webglcontextrestored', 'webglcontextlost', 'webglcontextcreationerror']; var formEventNames = ['autocomplete', 'autocompleteerror']; var detailEventNames = ['toggle']; var eventNames = __spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], globalEventHandlersEventNames, true), webglEventNames, true), formEventNames, true), detailEventNames, true), documentEventNames, true), windowEventNames, true), htmlElementEventNames, true), ieElementEventNames, true); // Whenever any eventListener fires, we check the eventListener target and all parents // for `onwhatever` properties and replace them with zone-bound functions // - Chrome (for now) function patchViaCapturingAllTheEvents(api) { var unboundKey = api.symbol('unbound'); var _loop_1 = function (i) { var property = eventNames[i]; var onproperty = 'on' + property; self.addEventListener(property, function (event) { var elt = event.target, bound, source; if (elt) { source = elt.constructor['name'] + '.' + onproperty; } else { source = 'unknown.' + onproperty; } while (elt) { if (elt[onproperty] && !elt[onproperty][unboundKey]) { bound = api.wrapWithCurrentZone(elt[onproperty], source); bound[unboundKey] = elt[onproperty]; elt[onproperty] = bound; } elt = elt.parentElement; } }, true); }; for (var i = 0; i < eventNames.length; i++) { _loop_1(i); } } function registerElementPatch(_global, api) { var _a = api.getGlobalObjects(), isBrowser = _a.isBrowser, isMix = _a.isMix; if ((!isBrowser && !isMix) || !('registerElement' in _global.document)) { return; } var callbacks = [ 'createdCallback', 'attachedCallback', 'detachedCallback', 'attributeChangedCallback', ]; api.patchCallbacks(api, document, 'Document', 'registerElement', callbacks); } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowserLegacy() { var _global = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {}; var symbolPrefix = _global['__Zone_symbol_prefix'] || '__zone_symbol__'; function __symbol__(name) { return symbolPrefix + name; } _global[__symbol__('legacyPatch')] = function () { var Zone = _global['Zone']; Zone.__load_patch('defineProperty', function (global, Zone, api) { api._redefineProperty = _redefineProperty; propertyPatch(); }); Zone.__load_patch('registerElement', function (global, Zone, api) { registerElementPatch(global, api); }); Zone.__load_patch('EventTargetLegacy', function (global, Zone, api) { eventTargetLegacyPatch(global, api); propertyDescriptorLegacyPatch(api, global); }); }; } patchBrowserLegacy(); })); 6x+)"use strict";var __spreadArray=this&&this.__spreadArray||function(e,t,r){if(r||2===arguments.length)for(var n,o=0,a=t.length;o * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e,t,r,n,o;function a(){e=Zone.__symbol__,t=Object[e("defineProperty")]=Object.defineProperty,r=Object[e("getOwnPropertyDescriptor")]=Object.getOwnPropertyDescriptor,n=Object.create,o=e("unconfigurables"),Object.defineProperty=function(e,t,r){if(c(e,t))throw new TypeError("Cannot assign to read only property '"+t+"' of "+e);var n=r.configurable;return"prototype"!==t&&(r=l(e,t,r)),s(e,t,r,n)},Object.defineProperties=function(e,t){Object.keys(t).forEach((function(r){Object.defineProperty(e,r,t[r])}));for(var r=0,n=Object.getOwnPropertySymbols(t);r1?new a(t,r):new a(t),s=e.ObjectGetOwnPropertyDescriptor(l,"onmessage");return s&&!1===s.configurable?(i=e.ObjectCreate(l),c=l,[n,o,"send","close"].forEach((function(t){i[t]=function(){var r=e.ArraySlice.call(arguments);if(t===n||t===o){var a=r.length>0?r[0]:void 0;if(a){var c=Zone.__symbol__("ON_PROPERTY"+a);l[c]=i[c]}}return l[t].apply(l,r)}}))):i=l,e.patchOnProperties(i,["close","error","message","open"],c),i};var i=t.WebSocket;for(var c in a)i[c]=a[c]}(e,t),Zone[e.symbol("patchEvents")]=!0}}var d=__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([],["abort","animationcancel","animationend","animationiteration","auxclick","beforeinput","blur","cancel","canplay","canplaythrough","change","compositionstart","compositionupdate","compositionend","cuechange","click","close","contextmenu","curechange","dblclick","drag","dragend","dragenter","dragexit","dragleave","dragover","drop","durationchange","emptied","ended","error","focus","focusin","focusout","gotpointercapture","input","invalid","keydown","keypress","keyup","load","loadstart","loadeddata","loadedmetadata","lostpointercapture","mousedown","mouseenter","mouseleave","mousemove","mouseout","mouseover","mouseup","mousewheel","orientationchange","pause","play","playing","pointercancel","pointerdown","pointerenter","pointerleave","pointerlockchange","mozpointerlockchange","webkitpointerlockerchange","pointerlockerror","mozpointerlockerror","webkitpointerlockerror","pointermove","pointout","pointerover","pointerup","progress","ratechange","reset","resize","scroll","seeked","seeking","select","selectionchange","selectstart","show","sort","stalled","submit","suspend","timeupdate","volumechange","touchcancel","touchmove","touchstart","touchend","transitioncancel","transitionend","waiting","wheel"],!0),["webglcontextrestored","webglcontextlost","webglcontextcreationerror"],!0),["autocomplete","autocompleteerror"],!0),["toggle"],!0),["afterscriptexecute","beforescriptexecute","DOMContentLoaded","freeze","fullscreenchange","mozfullscreenchange","webkitfullscreenchange","msfullscreenchange","fullscreenerror","mozfullscreenerror","webkitfullscreenerror","msfullscreenerror","readystatechange","visibilitychange","resume"],!0),["absolutedeviceorientation","afterinput","afterprint","appinstalled","beforeinstallprompt","beforeprint","beforeunload","devicelight","devicemotion","deviceorientation","deviceorientationabsolute","deviceproximity","hashchange","languagechange","message","mozbeforepaint","offline","online","paint","pageshow","pagehide","popstate","rejectionhandled","storage","unhandledrejection","unload","userproximity","vrdisplayconnected","vrdisplaydisconnected","vrdisplaypresentchange"],!0),["beforecopy","beforecut","beforepaste","copy","cut","paste","dragstart","loadend","animationstart","search","transitionrun","transitionstart","webkitanimationend","webkitanimationiteration","webkitanimationstart","webkittransitionend"],!0),["activate","afterupdate","ariarequest","beforeactivate","beforedeactivate","beforeeditfocus","beforeupdate","cellchange","controlselect","dataavailable","datasetchanged","datasetcomplete","errorupdate","filterchange","layoutcomplete","losecapture","move","moveend","movestart","propertychange","resizeend","resizestart","rowenter","rowexit","rowsdelete","rowsinserted","command","compassneedscalibration","deactivate","help","mscontentzoom","msmanipulationstatechanged","msgesturechange","msgesturedoubletap","msgestureend","msgesturehold","msgesturestart","msgesturetap","msgotpointercapture","msinertiastart","mslostpointercapture","mspointercancel","mspointerdown","mspointerenter","mspointerhover","mspointerleave","mspointermove","mspointerout","mspointerover","mspointerup","pointerout","mssitemodejumplistitemremoved","msthumbnailclick","stop","storagecommit"],!0);!function f(){var e="undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:{},t=e.__Zone_symbol_prefix||"__zone_symbol__";e[function r(e){return t+e}("legacyPatch")]=function(){var t=e.Zone;t.__load_patch("defineProperty",(function(e,t,r){r._redefineProperty=i,a()})),t.__load_patch("registerElement",(function(e,t,r){!function n(e,t){var r=t.getGlobalObjects();(r.isBrowser||r.isMix)&&"registerElement"in e.document&&t.patchCallbacks(t,document,"Document","registerElement",["createdCallback","attachedCallback","detachedCallback","attributeChangedCallback"])}(e,r)})),t.__load_patch("EventTargetLegacy",(function(e,t,r){p(e,r),u(r,e)}))}}()}));ղsQx'use strict'; var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; var global = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { var symbolPrefix = global['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } function initZone() { var performance = global['performance']; function mark(name) { performance && performance['mark'] && performance['mark'](name); } function performanceMeasure(name, label) { performance && performance['measure'] && performance['measure'](name, label); } mark('Zone'); var ZoneImpl = /** @class */ (function () { function ZoneImpl(parent, zoneSpec) { this._parent = parent; this._name = zoneSpec ? zoneSpec.name || 'unnamed' : ''; this._properties = (zoneSpec && zoneSpec.properties) || {}; this._zoneDelegate = new _ZoneDelegate(this, this._parent && this._parent._zoneDelegate, zoneSpec); } ZoneImpl.assertZonePatched = function () { if (global['Promise'] !== patches['ZoneAwarePromise']) { throw new Error('Zone.js has detected that ZoneAwarePromise `(window|global).Promise` ' + 'has been overwritten.\n' + 'Most likely cause is that a Promise polyfill has been loaded ' + 'after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. ' + 'If you must load one, do so before loading zone.js.)'); } }; Object.defineProperty(ZoneImpl, "root", { get: function () { var zone = ZoneImpl.current; while (zone.parent) { zone = zone.parent; } return zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl, "current", { get: function () { return _currentZoneFrame.zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl, "currentTask", { get: function () { return _currentTask; }, enumerable: false, configurable: true }); ZoneImpl.__load_patch = function (name, fn, ignoreDuplicate) { if (ignoreDuplicate === void 0) { ignoreDuplicate = false; } if (patches.hasOwnProperty(name)) { // `checkDuplicate` option is defined from global variable // so it works for all modules. // `ignoreDuplicate` can work for the specified module var checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (!ignoreDuplicate && checkDuplicate) { throw Error('Already loaded patch: ' + name); } } else if (!global['__Zone_disable_' + name]) { var perfName = 'Zone:' + name; mark(perfName); patches[name] = fn(global, ZoneImpl, _api); performanceMeasure(perfName, perfName); } }; Object.defineProperty(ZoneImpl.prototype, "parent", { get: function () { return this._parent; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl.prototype, "name", { get: function () { return this._name; }, enumerable: false, configurable: true }); ZoneImpl.prototype.get = function (key) { var zone = this.getZoneWith(key); if (zone) return zone._properties[key]; }; ZoneImpl.prototype.getZoneWith = function (key) { var current = this; while (current) { if (current._properties.hasOwnProperty(key)) { return current; } current = current._parent; } return null; }; ZoneImpl.prototype.fork = function (zoneSpec) { if (!zoneSpec) throw new Error('ZoneSpec required!'); return this._zoneDelegate.fork(this, zoneSpec); }; ZoneImpl.prototype.wrap = function (callback, source) { if (typeof callback !== 'function') { throw new Error('Expecting function got: ' + callback); } var _callback = this._zoneDelegate.intercept(this, callback, source); var zone = this; return function () { return zone.runGuarded(_callback, this, arguments, source); }; }; ZoneImpl.prototype.run = function (callback, applyThis, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } finally { _currentZoneFrame = _currentZoneFrame.parent; } }; ZoneImpl.prototype.runGuarded = function (callback, applyThis, applyArgs, source) { if (applyThis === void 0) { applyThis = null; } _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { _currentZoneFrame = _currentZoneFrame.parent; } }; ZoneImpl.prototype.runTask = function (task, applyThis, applyArgs) { if (task.zone != this) { throw new Error('A task can only be run in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); } var zoneTask = task; // https://github.com/angular/zone.js/issues/778, sometimes eventTask // will run in notScheduled(canceled) state, we should not try to // run such kind of task but just return var type = task.type, _a = task.data, _b = _a === void 0 ? {} : _a, _c = _b.isPeriodic, isPeriodic = _c === void 0 ? false : _c, _d = _b.isRefreshable, isRefreshable = _d === void 0 ? false : _d; if (task.state === notScheduled && (type === eventTask || type === macroTask)) { return; } var reEntryGuard = task.state != running; reEntryGuard && zoneTask._transitionTo(running, scheduled); var previousTask = _currentTask; _currentTask = zoneTask; _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { if (type == macroTask && task.data && !isPeriodic && !isRefreshable) { task.cancelFn = undefined; } try { return this._zoneDelegate.invokeTask(this, zoneTask, applyThis, applyArgs); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { // if the task's state is notScheduled or unknown, then it has already been cancelled // we should not reset the state to scheduled var state = task.state; if (state !== notScheduled && state !== unknown) { if (type == eventTask || isPeriodic || (isRefreshable && state === scheduling)) { reEntryGuard && zoneTask._transitionTo(scheduled, running, scheduling); } else { var zoneDelegates = zoneTask._zoneDelegates; this._updateTaskCount(zoneTask, -1); reEntryGuard && zoneTask._transitionTo(notScheduled, running, notScheduled); if (isRefreshable) { zoneTask._zoneDelegates = zoneDelegates; } } } _currentZoneFrame = _currentZoneFrame.parent; _currentTask = previousTask; } }; ZoneImpl.prototype.scheduleTask = function (task) { if (task.zone && task.zone !== this) { // check if the task was rescheduled, the newZone // should not be the children of the original zone var newZone = this; while (newZone) { if (newZone === task.zone) { throw Error("can not reschedule task to ".concat(this.name, " which is descendants of the original zone ").concat(task.zone.name)); } newZone = newZone.parent; } } task._transitionTo(scheduling, notScheduled); var zoneDelegates = []; task._zoneDelegates = zoneDelegates; task._zone = this; try { task = this._zoneDelegate.scheduleTask(this, task); } catch (err) { // should set task's state to unknown when scheduleTask throw error // because the err may from reschedule, so the fromState maybe notScheduled task._transitionTo(unknown, scheduling, notScheduled); // TODO: @JiaLiPassion, should we check the result from handleError? this._zoneDelegate.handleError(this, err); throw err; } if (task._zoneDelegates === zoneDelegates) { // we have to check because internally the delegate can reschedule the task. this._updateTaskCount(task, 1); } if (task.state == scheduling) { task._transitionTo(scheduled, scheduling); } return task; }; ZoneImpl.prototype.scheduleMicroTask = function (source, callback, data, customSchedule) { return this.scheduleTask(new ZoneTask(microTask, source, callback, data, customSchedule, undefined)); }; ZoneImpl.prototype.scheduleMacroTask = function (source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(macroTask, source, callback, data, customSchedule, customCancel)); }; ZoneImpl.prototype.scheduleEventTask = function (source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(eventTask, source, callback, data, customSchedule, customCancel)); }; ZoneImpl.prototype.cancelTask = function (task) { if (task.zone != this) throw new Error('A task can only be cancelled in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); if (task.state !== scheduled && task.state !== running) { return; } task._transitionTo(canceling, scheduled, running); try { this._zoneDelegate.cancelTask(this, task); } catch (err) { // if error occurs when cancelTask, transit the state to unknown task._transitionTo(unknown, canceling); this._zoneDelegate.handleError(this, err); throw err; } this._updateTaskCount(task, -1); task._transitionTo(notScheduled, canceling); task.runCount = -1; return task; }; ZoneImpl.prototype._updateTaskCount = function (task, count) { var zoneDelegates = task._zoneDelegates; if (count == -1) { task._zoneDelegates = null; } for (var i = 0; i < zoneDelegates.length; i++) { zoneDelegates[i]._updateTaskCount(task.type, count); } }; ZoneImpl.__symbol__ = __symbol__; return ZoneImpl; }()); var DELEGATE_ZS = { name: '', onHasTask: function (delegate, _, target, hasTaskState) { return delegate.hasTask(target, hasTaskState); }, onScheduleTask: function (delegate, _, target, task) { return delegate.scheduleTask(target, task); }, onInvokeTask: function (delegate, _, target, task, applyThis, applyArgs) { return delegate.invokeTask(target, task, applyThis, applyArgs); }, onCancelTask: function (delegate, _, target, task) { return delegate.cancelTask(target, task); }, }; var _ZoneDelegate = /** @class */ (function () { function _ZoneDelegate(zone, parentDelegate, zoneSpec) { this._taskCounts = { 'microTask': 0, 'macroTask': 0, 'eventTask': 0, }; this._zone = zone; this._parentDelegate = parentDelegate; this._forkZS = zoneSpec && (zoneSpec && zoneSpec.onFork ? zoneSpec : parentDelegate._forkZS); this._forkDlgt = zoneSpec && (zoneSpec.onFork ? parentDelegate : parentDelegate._forkDlgt); this._forkCurrZone = zoneSpec && (zoneSpec.onFork ? this._zone : parentDelegate._forkCurrZone); this._interceptZS = zoneSpec && (zoneSpec.onIntercept ? zoneSpec : parentDelegate._interceptZS); this._interceptDlgt = zoneSpec && (zoneSpec.onIntercept ? parentDelegate : parentDelegate._interceptDlgt); this._interceptCurrZone = zoneSpec && (zoneSpec.onIntercept ? this._zone : parentDelegate._interceptCurrZone); this._invokeZS = zoneSpec && (zoneSpec.onInvoke ? zoneSpec : parentDelegate._invokeZS); this._invokeDlgt = zoneSpec && (zoneSpec.onInvoke ? parentDelegate : parentDelegate._invokeDlgt); this._invokeCurrZone = zoneSpec && (zoneSpec.onInvoke ? this._zone : parentDelegate._invokeCurrZone); this._handleErrorZS = zoneSpec && (zoneSpec.onHandleError ? zoneSpec : parentDelegate._handleErrorZS); this._handleErrorDlgt = zoneSpec && (zoneSpec.onHandleError ? parentDelegate : parentDelegate._handleErrorDlgt); this._handleErrorCurrZone = zoneSpec && (zoneSpec.onHandleError ? this._zone : parentDelegate._handleErrorCurrZone); this._scheduleTaskZS = zoneSpec && (zoneSpec.onScheduleTask ? zoneSpec : parentDelegate._scheduleTaskZS); this._scheduleTaskDlgt = zoneSpec && (zoneSpec.onScheduleTask ? parentDelegate : parentDelegate._scheduleTaskDlgt); this._scheduleTaskCurrZone = zoneSpec && (zoneSpec.onScheduleTask ? this._zone : parentDelegate._scheduleTaskCurrZone); this._invokeTaskZS = zoneSpec && (zoneSpec.onInvokeTask ? zoneSpec : parentDelegate._invokeTaskZS); this._invokeTaskDlgt = zoneSpec && (zoneSpec.onInvokeTask ? parentDelegate : parentDelegate._invokeTaskDlgt); this._invokeTaskCurrZone = zoneSpec && (zoneSpec.onInvokeTask ? this._zone : parentDelegate._invokeTaskCurrZone); this._cancelTaskZS = zoneSpec && (zoneSpec.onCancelTask ? zoneSpec : parentDelegate._cancelTaskZS); this._cancelTaskDlgt = zoneSpec && (zoneSpec.onCancelTask ? parentDelegate : parentDelegate._cancelTaskDlgt); this._cancelTaskCurrZone = zoneSpec && (zoneSpec.onCancelTask ? this._zone : parentDelegate._cancelTaskCurrZone); this._hasTaskZS = null; this._hasTaskDlgt = null; this._hasTaskDlgtOwner = null; this._hasTaskCurrZone = null; var zoneSpecHasTask = zoneSpec && zoneSpec.onHasTask; var parentHasTask = parentDelegate && parentDelegate._hasTaskZS; if (zoneSpecHasTask || parentHasTask) { // If we need to report hasTask, than this ZS needs to do ref counting on tasks. In such // a case all task related interceptors must go through this ZD. We can't short circuit it. this._hasTaskZS = zoneSpecHasTask ? zoneSpec : DELEGATE_ZS; this._hasTaskDlgt = parentDelegate; this._hasTaskDlgtOwner = this; this._hasTaskCurrZone = this._zone; if (!zoneSpec.onScheduleTask) { this._scheduleTaskZS = DELEGATE_ZS; this._scheduleTaskDlgt = parentDelegate; this._scheduleTaskCurrZone = this._zone; } if (!zoneSpec.onInvokeTask) { this._invokeTaskZS = DELEGATE_ZS; this._invokeTaskDlgt = parentDelegate; this._invokeTaskCurrZone = this._zone; } if (!zoneSpec.onCancelTask) { this._cancelTaskZS = DELEGATE_ZS; this._cancelTaskDlgt = parentDelegate; this._cancelTaskCurrZone = this._zone; } } } Object.defineProperty(_ZoneDelegate.prototype, "zone", { get: function () { return this._zone; }, enumerable: false, configurable: true }); _ZoneDelegate.prototype.fork = function (targetZone, zoneSpec) { return this._forkZS ? this._forkZS.onFork(this._forkDlgt, this.zone, targetZone, zoneSpec) : new ZoneImpl(targetZone, zoneSpec); }; _ZoneDelegate.prototype.intercept = function (targetZone, callback, source) { return this._interceptZS ? this._interceptZS.onIntercept(this._interceptDlgt, this._interceptCurrZone, targetZone, callback, source) : callback; }; _ZoneDelegate.prototype.invoke = function (targetZone, callback, applyThis, applyArgs, source) { return this._invokeZS ? this._invokeZS.onInvoke(this._invokeDlgt, this._invokeCurrZone, targetZone, callback, applyThis, applyArgs, source) : callback.apply(applyThis, applyArgs); }; _ZoneDelegate.prototype.handleError = function (targetZone, error) { return this._handleErrorZS ? this._handleErrorZS.onHandleError(this._handleErrorDlgt, this._handleErrorCurrZone, targetZone, error) : true; }; _ZoneDelegate.prototype.scheduleTask = function (targetZone, task) { var returnTask = task; if (this._scheduleTaskZS) { if (this._hasTaskZS) { returnTask._zoneDelegates.push(this._hasTaskDlgtOwner); } returnTask = this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this._scheduleTaskCurrZone, targetZone, task); if (!returnTask) returnTask = task; } else { if (task.scheduleFn) { task.scheduleFn(task); } else if (task.type == microTask) { scheduleMicroTask(task); } else { throw new Error('Task is missing scheduleFn.'); } } return returnTask; }; _ZoneDelegate.prototype.invokeTask = function (targetZone, task, applyThis, applyArgs) { return this._invokeTaskZS ? this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt, this._invokeTaskCurrZone, targetZone, task, applyThis, applyArgs) : task.callback.apply(applyThis, applyArgs); }; _ZoneDelegate.prototype.cancelTask = function (targetZone, task) { var value; if (this._cancelTaskZS) { value = this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt, this._cancelTaskCurrZone, targetZone, task); } else { if (!task.cancelFn) { throw Error('Task is not cancelable'); } value = task.cancelFn(task); } return value; }; _ZoneDelegate.prototype.hasTask = function (targetZone, isEmpty) { // hasTask should not throw error so other ZoneDelegate // can still trigger hasTask callback try { this._hasTaskZS && this._hasTaskZS.onHasTask(this._hasTaskDlgt, this._hasTaskCurrZone, targetZone, isEmpty); } catch (err) { this.handleError(targetZone, err); } }; _ZoneDelegate.prototype._updateTaskCount = function (type, count) { var counts = this._taskCounts; var prev = counts[type]; var next = (counts[type] = prev + count); if (next < 0) { throw new Error('More tasks executed then were scheduled.'); } if (prev == 0 || next == 0) { var isEmpty = { microTask: counts['microTask'] > 0, macroTask: counts['macroTask'] > 0, eventTask: counts['eventTask'] > 0, change: type, }; this.hasTask(this._zone, isEmpty); } }; return _ZoneDelegate; }()); var ZoneTask = /** @class */ (function () { function ZoneTask(type, source, callback, options, scheduleFn, cancelFn) { this._zone = null; this.runCount = 0; this._zoneDelegates = null; this._state = 'notScheduled'; this.type = type; this.source = source; this.data = options; this.scheduleFn = scheduleFn; this.cancelFn = cancelFn; if (!callback) { throw new Error('callback is not defined'); } this.callback = callback; var self = this; // TODO: @JiaLiPassion options should have interface if (type === eventTask && options && options.useG) { this.invoke = ZoneTask.invokeTask; } else { this.invoke = function () { return ZoneTask.invokeTask.call(global, self, this, arguments); }; } } ZoneTask.invokeTask = function (task, target, args) { if (!task) { task = this; } _numberOfNestedTaskFrames++; try { task.runCount++; return task.zone.runTask(task, target, args); } finally { if (_numberOfNestedTaskFrames == 1) { drainMicroTaskQueue(); } _numberOfNestedTaskFrames--; } }; Object.defineProperty(ZoneTask.prototype, "zone", { get: function () { return this._zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneTask.prototype, "state", { get: function () { return this._state; }, enumerable: false, configurable: true }); ZoneTask.prototype.cancelScheduleRequest = function () { this._transitionTo(notScheduled, scheduling); }; ZoneTask.prototype._transitionTo = function (toState, fromState1, fromState2) { if (this._state === fromState1 || this._state === fromState2) { this._state = toState; if (toState == notScheduled) { this._zoneDelegates = null; } } else { throw new Error("".concat(this.type, " '").concat(this.source, "': can not transition to '").concat(toState, "', expecting state '").concat(fromState1, "'").concat(fromState2 ? " or '" + fromState2 + "'" : '', ", was '").concat(this._state, "'.")); } }; ZoneTask.prototype.toString = function () { if (this.data && typeof this.data.handleId !== 'undefined') { return this.data.handleId.toString(); } else { return Object.prototype.toString.call(this); } }; // add toJSON method to prevent cyclic error when // call JSON.stringify(zoneTask) ZoneTask.prototype.toJSON = function () { return { type: this.type, state: this.state, source: this.source, zone: this.zone.name, runCount: this.runCount, }; }; return ZoneTask; }()); ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// MICROTASK QUEUE ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// var symbolSetTimeout = __symbol__('setTimeout'); var symbolPromise = __symbol__('Promise'); var symbolThen = __symbol__('then'); var _microTaskQueue = []; var _isDrainingMicrotaskQueue = false; var nativeMicroTaskQueuePromise; function nativeScheduleMicroTask(func) { if (!nativeMicroTaskQueuePromise) { if (global[symbolPromise]) { nativeMicroTaskQueuePromise = global[symbolPromise].resolve(0); } } if (nativeMicroTaskQueuePromise) { var nativeThen = nativeMicroTaskQueuePromise[symbolThen]; if (!nativeThen) { // native Promise is not patchable, we need to use `then` directly // issue 1078 nativeThen = nativeMicroTaskQueuePromise['then']; } nativeThen.call(nativeMicroTaskQueuePromise, func); } else { global[symbolSetTimeout](func, 0); } } function scheduleMicroTask(task) { // if we are not running in any task, and there has not been anything scheduled // we must bootstrap the initial task creation by manually scheduling the drain if (_numberOfNestedTaskFrames === 0 && _microTaskQueue.length === 0) { // We are not running in Task, so we need to kickstart the microtask queue. nativeScheduleMicroTask(drainMicroTaskQueue); } task && _microTaskQueue.push(task); } function drainMicroTaskQueue() { if (!_isDrainingMicrotaskQueue) { _isDrainingMicrotaskQueue = true; while (_microTaskQueue.length) { var queue = _microTaskQueue; _microTaskQueue = []; for (var i = 0; i < queue.length; i++) { var task = queue[i]; try { task.zone.runTask(task, null, null); } catch (error) { _api.onUnhandledError(error); } } } _api.microtaskDrainDone(); _isDrainingMicrotaskQueue = false; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// BOOTSTRAP ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// var NO_ZONE = { name: 'NO ZONE' }; var notScheduled = 'notScheduled', scheduling = 'scheduling', scheduled = 'scheduled', running = 'running', canceling = 'canceling', unknown = 'unknown'; var microTask = 'microTask', macroTask = 'macroTask', eventTask = 'eventTask'; var patches = {}; var _api = { symbol: __symbol__, currentZoneFrame: function () { return _currentZoneFrame; }, onUnhandledError: noop, microtaskDrainDone: noop, scheduleMicroTask: scheduleMicroTask, showUncaughtError: function () { return !ZoneImpl[__symbol__('ignoreConsoleErrorUncaughtError')]; }, patchEventTarget: function () { return []; }, patchOnProperties: noop, patchMethod: function () { return noop; }, bindArguments: function () { return []; }, patchThen: function () { return noop; }, patchMacroTask: function () { return noop; }, patchEventPrototype: function () { return noop; }, isIEOrEdge: function () { return false; }, getGlobalObjects: function () { return undefined; }, ObjectDefineProperty: function () { return noop; }, ObjectGetOwnPropertyDescriptor: function () { return undefined; }, ObjectCreate: function () { return undefined; }, ArraySlice: function () { return []; }, patchClass: function () { return noop; }, wrapWithCurrentZone: function () { return noop; }, filterProperties: function () { return []; }, attachOriginToPatched: function () { return noop; }, _redefineProperty: function () { return noop; }, patchCallbacks: function () { return noop; }, nativeScheduleMicroTask: nativeScheduleMicroTask, }; var _currentZoneFrame = { parent: null, zone: new ZoneImpl(null, null) }; var _currentTask = null; var _numberOfNestedTaskFrames = 0; function noop() { } performanceMeasure('Zone', 'Zone'); return ZoneImpl; } /** * Suppress closure compiler errors about unknown 'Zone' variable * @fileoverview * @suppress {undefinedVars,globalThis,missingRequire} */ /// // issue #989, to reduce bundle size, use short name /** Object.getOwnPropertyDescriptor */ var ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; /** Object.defineProperty */ var ObjectDefineProperty = Object.defineProperty; /** Object.getPrototypeOf */ var ObjectGetPrototypeOf = Object.getPrototypeOf; /** Object.create */ var ObjectCreate = Object.create; /** Array.prototype.slice */ var ArraySlice = Array.prototype.slice; /** addEventListener string const */ var ADD_EVENT_LISTENER_STR = 'addEventListener'; /** removeEventListener string const */ var REMOVE_EVENT_LISTENER_STR = 'removeEventListener'; /** zoneSymbol addEventListener */ var ZONE_SYMBOL_ADD_EVENT_LISTENER = __symbol__(ADD_EVENT_LISTENER_STR); /** zoneSymbol removeEventListener */ var ZONE_SYMBOL_REMOVE_EVENT_LISTENER = __symbol__(REMOVE_EVENT_LISTENER_STR); /** true string const */ var TRUE_STR = 'true'; /** false string const */ var FALSE_STR = 'false'; /** Zone symbol prefix string const. */ var ZONE_SYMBOL_PREFIX = __symbol__(''); function wrapWithCurrentZone(callback, source) { return Zone.current.wrap(callback, source); } function scheduleMacroTaskWithCurrentZone(source, callback, data, customSchedule, customCancel) { return Zone.current.scheduleMacroTask(source, callback, data, customSchedule, customCancel); } var zoneSymbol = __symbol__; var isWindowExists = typeof window !== 'undefined'; var internalWindow = isWindowExists ? window : undefined; var _global = (isWindowExists && internalWindow) || globalThis; var REMOVE_ATTRIBUTE = 'removeAttribute'; function bindArguments(args, source) { for (var i = args.length - 1; i >= 0; i--) { if (typeof args[i] === 'function') { args[i] = wrapWithCurrentZone(args[i], source + '_' + i); } } return args; } function patchPrototype(prototype, fnNames) { var source = prototype.constructor['name']; var _loop_1 = function (i) { var name_1 = fnNames[i]; var delegate = prototype[name_1]; if (delegate) { var prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, name_1); if (!isPropertyWritable(prototypeDesc)) { return "continue"; } prototype[name_1] = (function (delegate) { var patched = function () { return delegate.apply(this, bindArguments(arguments, source + '.' + name_1)); }; attachOriginToPatched(patched, delegate); return patched; })(delegate); } }; for (var i = 0; i < fnNames.length; i++) { _loop_1(i); } } function isPropertyWritable(propertyDesc) { if (!propertyDesc) { return true; } if (propertyDesc.writable === false) { return false; } return !(typeof propertyDesc.get === 'function' && typeof propertyDesc.set === 'undefined'); } var isWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope; // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. var isNode = !('nw' in _global) && typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]'; var isBrowser = !isNode && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); // we are in electron of nw, so we are both browser and nodejs // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. var isMix = typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]' && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); var zoneSymbolEventNames$1 = {}; var enableBeforeunloadSymbol = zoneSymbol('enable_beforeunload'); var wrapFn = function (event) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } var eventNameSymbol = zoneSymbolEventNames$1[event.type]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[event.type] = zoneSymbol('ON_PROPERTY' + event.type); } var target = this || event.target || _global; var listener = target[eventNameSymbol]; var result; if (isBrowser && target === internalWindow && event.type === 'error') { // window.onerror have different signature // https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror#window.onerror // and onerror callback will prevent default when callback return true var errorEvent = event; result = listener && listener.call(this, errorEvent.message, errorEvent.filename, errorEvent.lineno, errorEvent.colno, errorEvent.error); if (result === true) { event.preventDefault(); } } else { result = listener && listener.apply(this, arguments); if ( // https://github.com/angular/angular/issues/47579 // https://www.w3.org/TR/2011/WD-html5-20110525/history.html#beforeunloadevent // This is the only specific case we should check for. The spec defines that the // `returnValue` attribute represents the message to show the user. When the event // is created, this attribute must be set to the empty string. event.type === 'beforeunload' && // To prevent any breaking changes resulting from this change, given that // it was already causing a significant number of failures in G3, we have hidden // that behavior behind a global configuration flag. Consumers can enable this // flag explicitly if they want the `beforeunload` event to be handled as defined // in the specification. _global[enableBeforeunloadSymbol] && // The IDL event definition is `attribute DOMString returnValue`, so we check whether // `typeof result` is a string. typeof result === 'string') { event.returnValue = result; } else if (result != undefined && !result) { event.preventDefault(); } } return result; }; function patchProperty(obj, prop, prototype) { var desc = ObjectGetOwnPropertyDescriptor(obj, prop); if (!desc && prototype) { // when patch window object, use prototype to check prop exist or not var prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, prop); if (prototypeDesc) { desc = { enumerable: true, configurable: true }; } } // if the descriptor not exists or is not configurable // just return if (!desc || !desc.configurable) { return; } var onPropPatchedSymbol = zoneSymbol('on' + prop + 'patched'); if (obj.hasOwnProperty(onPropPatchedSymbol) && obj[onPropPatchedSymbol]) { return; } // A property descriptor cannot have getter/setter and be writable // deleting the writable and value properties avoids this error: // // TypeError: property descriptors must not specify a value or be writable when a // getter or setter has been specified delete desc.writable; delete desc.value; var originalDescGet = desc.get; var originalDescSet = desc.set; // slice(2) cuz 'onclick' -> 'click', etc var eventName = prop.slice(2); var eventNameSymbol = zoneSymbolEventNames$1[eventName]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[eventName] = zoneSymbol('ON_PROPERTY' + eventName); } desc.set = function (newValue) { // In some versions of Windows, the `this` context may be undefined // in on-property callbacks. // To handle this edge case, we check if `this` is falsy and // fallback to `_global` if needed. var target = this; if (!target && obj === _global) { target = _global; } if (!target) { return; } var previousValue = target[eventNameSymbol]; if (typeof previousValue === 'function') { target.removeEventListener(eventName, wrapFn); } // https://github.com/angular/zone.js/issues/978 // If an inline handler (like `onload`) was defined before zone.js was loaded, // call the original descriptor's setter to clean it up. originalDescSet === null || originalDescSet === void 0 ? void 0 : originalDescSet.call(target, null); target[eventNameSymbol] = newValue; if (typeof newValue === 'function') { target.addEventListener(eventName, wrapFn, false); } }; // The getter would return undefined for unassigned properties but the default value of an // unassigned property is null desc.get = function () { // in some of windows's onproperty callback, this is undefined // so we need to check it var target = this; if (!target && obj === _global) { target = _global; } if (!target) { return null; } var listener = target[eventNameSymbol]; if (listener) { return listener; } else if (originalDescGet) { // result will be null when use inline event attribute, // such as // because the onclick function is internal raw uncompiled handler // the onclick will be evaluated when first time event was triggered or // the property is accessed, https://github.com/angular/zone.js/issues/525 // so we should use original native get to retrieve the handler var value = originalDescGet.call(this); if (value) { desc.set.call(this, value); if (typeof target[REMOVE_ATTRIBUTE] === 'function') { target.removeAttribute(prop); } return value; } } return null; }; ObjectDefineProperty(obj, prop, desc); obj[onPropPatchedSymbol] = true; } function patchOnProperties(obj, properties, prototype) { if (properties) { for (var i = 0; i < properties.length; i++) { patchProperty(obj, 'on' + properties[i], prototype); } } else { var onProperties = []; for (var prop in obj) { if (prop.slice(0, 2) == 'on') { onProperties.push(prop); } } for (var j = 0; j < onProperties.length; j++) { patchProperty(obj, onProperties[j], prototype); } } } var originalInstanceKey = zoneSymbol('originalInstance'); // wrap some native API on `window` function patchClass(className) { var OriginalClass = _global[className]; if (!OriginalClass) return; // keep original class in global _global[zoneSymbol(className)] = OriginalClass; _global[className] = function () { var a = bindArguments(arguments, className); switch (a.length) { case 0: this[originalInstanceKey] = new OriginalClass(); break; case 1: this[originalInstanceKey] = new OriginalClass(a[0]); break; case 2: this[originalInstanceKey] = new OriginalClass(a[0], a[1]); break; case 3: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2]); break; case 4: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2], a[3]); break; default: throw new Error('Arg list too long.'); } }; // attach original delegate to patched function attachOriginToPatched(_global[className], OriginalClass); var instance = new OriginalClass(function () { }); var prop; for (prop in instance) { // https://bugs.webkit.org/show_bug.cgi?id=44721 if (className === 'XMLHttpRequest' && prop === 'responseBlob') continue; (function (prop) { if (typeof instance[prop] === 'function') { _global[className].prototype[prop] = function () { return this[originalInstanceKey][prop].apply(this[originalInstanceKey], arguments); }; } else { ObjectDefineProperty(_global[className].prototype, prop, { set: function (fn) { if (typeof fn === 'function') { this[originalInstanceKey][prop] = wrapWithCurrentZone(fn, className + '.' + prop); // keep callback in wrapped function so we can // use it in Function.prototype.toString to return // the native one. attachOriginToPatched(this[originalInstanceKey][prop], fn); } else { this[originalInstanceKey][prop] = fn; } }, get: function () { return this[originalInstanceKey][prop]; }, }); } })(prop); } for (prop in OriginalClass) { if (prop !== 'prototype' && OriginalClass.hasOwnProperty(prop)) { _global[className][prop] = OriginalClass[prop]; } } } function copySymbolProperties(src, dest) { if (typeof Object.getOwnPropertySymbols !== 'function') { return; } var symbols = Object.getOwnPropertySymbols(src); symbols.forEach(function (symbol) { var desc = Object.getOwnPropertyDescriptor(src, symbol); Object.defineProperty(dest, symbol, { get: function () { return src[symbol]; }, set: function (value) { if (desc && (!desc.writable || typeof desc.set !== 'function')) { // if src[symbol] is not writable or not have a setter, just return return; } src[symbol] = value; }, enumerable: desc ? desc.enumerable : true, configurable: desc ? desc.configurable : true, }); }); } var shouldCopySymbolProperties = false; function setShouldCopySymbolProperties(flag) { shouldCopySymbolProperties = flag; } function patchMethod(target, name, patchFn) { var proto = target; while (proto && !proto.hasOwnProperty(name)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && target[name]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = target; } var delegateName = zoneSymbol(name); var delegate = null; if (proto && (!(delegate = proto[delegateName]) || !proto.hasOwnProperty(delegateName))) { delegate = proto[delegateName] = proto[name]; // check whether proto[name] is writable // some property is readonly in safari, such as HtmlCanvasElement.prototype.toBlob var desc = proto && ObjectGetOwnPropertyDescriptor(proto, name); if (isPropertyWritable(desc)) { var patchDelegate_1 = patchFn(delegate, delegateName, name); proto[name] = function () { return patchDelegate_1(this, arguments); }; attachOriginToPatched(proto[name], delegate); if (shouldCopySymbolProperties) { copySymbolProperties(delegate, proto[name]); } } } return delegate; } // TODO: @JiaLiPassion, support cancel task later if necessary function patchMacroTask(obj, funcName, metaCreator) { var setNative = null; function scheduleTask(task) { var data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, function (delegate) { return function (self, args) { var meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return scheduleMacroTaskWithCurrentZone(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }; }); } function patchMicroTask(obj, funcName, metaCreator) { var setNative = null; function scheduleTask(task) { var data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, function (delegate) { return function (self, args) { var meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return Zone.current.scheduleMicroTask(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }; }); } function attachOriginToPatched(patched, original) { patched[zoneSymbol('OriginalDelegate')] = original; } var isDetectedIEOrEdge = false; var ieOrEdge = false; function isIEOrEdge() { if (isDetectedIEOrEdge) { return ieOrEdge; } isDetectedIEOrEdge = true; try { var ua = internalWindow.navigator.userAgent; if (ua.indexOf('MSIE ') !== -1 || ua.indexOf('Trident/') !== -1 || ua.indexOf('Edge/') !== -1) { ieOrEdge = true; } } catch (error) { } return ieOrEdge; } function isFunction(value) { return typeof value === 'function'; } function isNumber(value) { return typeof value === 'number'; } /** * @fileoverview * @suppress {missingRequire} */ // an identifier to tell ZoneTask do not create a new invoke closure var OPTIMIZED_ZONE_EVENT_TASK_DATA = { useG: true, }; var zoneSymbolEventNames = {}; var globalSources = {}; var EVENT_NAME_SYMBOL_REGX = new RegExp('^' + ZONE_SYMBOL_PREFIX + '(\\w+)(true|false)$'); var IMMEDIATE_PROPAGATION_SYMBOL = zoneSymbol('propagationStopped'); function prepareEventNames(eventName, eventNameToString) { var falseEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + FALSE_STR; var trueEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + TRUE_STR; var symbol = ZONE_SYMBOL_PREFIX + falseEventName; var symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } function patchEventTarget(_global, api, apis, patchOptions) { var ADD_EVENT_LISTENER = (patchOptions && patchOptions.add) || ADD_EVENT_LISTENER_STR; var REMOVE_EVENT_LISTENER = (patchOptions && patchOptions.rm) || REMOVE_EVENT_LISTENER_STR; var LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.listeners) || 'eventListeners'; var REMOVE_ALL_LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.rmAll) || 'removeAllListeners'; var zoneSymbolAddEventListener = zoneSymbol(ADD_EVENT_LISTENER); var ADD_EVENT_LISTENER_SOURCE = '.' + ADD_EVENT_LISTENER + ':'; var PREPEND_EVENT_LISTENER = 'prependListener'; var PREPEND_EVENT_LISTENER_SOURCE = '.' + PREPEND_EVENT_LISTENER + ':'; var invokeTask = function (task, target, event) { // for better performance, check isRemoved which is set // by removeEventListener if (task.isRemoved) { return; } var delegate = task.callback; if (typeof delegate === 'object' && delegate.handleEvent) { // create the bind version of handleEvent when invoke task.callback = function (event) { return delegate.handleEvent(event); }; task.originalDelegate = delegate; } // invoke static task.invoke // need to try/catch error here, otherwise, the error in one event listener // will break the executions of the other event listeners. Also error will // not remove the event listener when `once` options is true. var error; try { task.invoke(task, target, [event]); } catch (err) { error = err; } var options = task.options; if (options && typeof options === 'object' && options.once) { // if options.once is true, after invoke once remove listener here // only browser need to do this, nodejs eventEmitter will cal removeListener // inside EventEmitter.once var delegate_1 = task.originalDelegate ? task.originalDelegate : task.callback; target[REMOVE_EVENT_LISTENER].call(target, event.type, delegate_1, options); } return error; }; function globalCallback(context, event, isCapture) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } // event.target is needed for Samsung TV and SourceBuffer // || global is needed https://github.com/angular/zone.js/issues/190 var target = context || event.target || _global; var tasks = target[zoneSymbolEventNames[event.type][isCapture ? TRUE_STR : FALSE_STR]]; if (tasks) { var errors = []; // invoke all tasks which attached to current target with given event.type and capture = false // for performance concern, if task.length === 1, just invoke if (tasks.length === 1) { var err = invokeTask(tasks[0], target, event); err && errors.push(err); } else { // https://github.com/angular/zone.js/issues/836 // copy the tasks array before invoke, to avoid // the callback will remove itself or other listener var copyTasks = tasks.slice(); for (var i = 0; i < copyTasks.length; i++) { if (event && event[IMMEDIATE_PROPAGATION_SYMBOL] === true) { break; } var err = invokeTask(copyTasks[i], target, event); err && errors.push(err); } } // Since there is only one error, we don't need to schedule microTask // to throw the error. if (errors.length === 1) { throw errors[0]; } else { var _loop_2 = function (i) { var err = errors[i]; api.nativeScheduleMicroTask(function () { throw err; }); }; for (var i = 0; i < errors.length; i++) { _loop_2(i); } } } } // global shared zoneAwareCallback to handle all event callback with capture = false var globalZoneAwareCallback = function (event) { return globalCallback(this, event, false); }; // global shared zoneAwareCallback to handle all event callback with capture = true var globalZoneAwareCaptureCallback = function (event) { return globalCallback(this, event, true); }; function patchEventTargetMethods(obj, patchOptions) { if (!obj) { return false; } var useGlobalCallback = true; if (patchOptions && patchOptions.useG !== undefined) { useGlobalCallback = patchOptions.useG; } var validateHandler = patchOptions && patchOptions.vh; var checkDuplicate = true; if (patchOptions && patchOptions.chkDup !== undefined) { checkDuplicate = patchOptions.chkDup; } var returnTarget = false; if (patchOptions && patchOptions.rt !== undefined) { returnTarget = patchOptions.rt; } var proto = obj; while (proto && !proto.hasOwnProperty(ADD_EVENT_LISTENER)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && obj[ADD_EVENT_LISTENER]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = obj; } if (!proto) { return false; } if (proto[zoneSymbolAddEventListener]) { return false; } var eventNameToString = patchOptions && patchOptions.eventNameToString; // We use a shared global `taskData` to pass data for `scheduleEventTask`, // eliminating the need to create a new object solely for passing data. // WARNING: This object has a static lifetime, meaning it is not created // each time `addEventListener` is called. It is instantiated only once // and captured by reference inside the `addEventListener` and // `removeEventListener` functions. Do not add any new properties to this // object, as doing so would necessitate maintaining the information // between `addEventListener` calls. var taskData = {}; var nativeAddEventListener = (proto[zoneSymbolAddEventListener] = proto[ADD_EVENT_LISTENER]); var nativeRemoveEventListener = (proto[zoneSymbol(REMOVE_EVENT_LISTENER)] = proto[REMOVE_EVENT_LISTENER]); var nativeListeners = (proto[zoneSymbol(LISTENERS_EVENT_LISTENER)] = proto[LISTENERS_EVENT_LISTENER]); var nativeRemoveAllListeners = (proto[zoneSymbol(REMOVE_ALL_LISTENERS_EVENT_LISTENER)] = proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER]); var nativePrependEventListener; if (patchOptions && patchOptions.prepend) { nativePrependEventListener = proto[zoneSymbol(patchOptions.prepend)] = proto[patchOptions.prepend]; } /** * This util function will build an option object with passive option * to handle all possible input from the user. */ function buildEventListenerOptions(options, passive) { if (!passive) { return options; } if (typeof options === 'boolean') { return { capture: options, passive: true }; } if (!options) { return { passive: true }; } if (typeof options === 'object' && options.passive !== false) { return __assign(__assign({}, options), { passive: true }); } return options; } var customScheduleGlobal = function (task) { // if there is already a task for the eventName + capture, // just return, because we use the shared globalZoneAwareCallback here. if (taskData.isExisting) { return; } return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options); }; /** * In the context of events and listeners, this function will be * called at the end by `cancelTask`, which, in turn, calls `task.cancelFn`. * Cancelling a task is primarily used to remove event listeners from * the task target. */ var customCancelGlobal = function (task) { // if task is not marked as isRemoved, this call is directly // from Zone.prototype.cancelTask, we should remove the task // from tasksList of target first if (!task.isRemoved) { var symbolEventNames = zoneSymbolEventNames[task.eventName]; var symbolEventName = void 0; if (symbolEventNames) { symbolEventName = symbolEventNames[task.capture ? TRUE_STR : FALSE_STR]; } var existingTasks = symbolEventName && task.target[symbolEventName]; if (existingTasks) { for (var i = 0; i < existingTasks.length; i++) { var existingTask = existingTasks[i]; if (existingTask === task) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check task.isRemoved = true; if (task.removeAbortListener) { task.removeAbortListener(); task.removeAbortListener = null; } if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target task.allRemoved = true; task.target[symbolEventName] = null; } break; } } } } // if all tasks for the eventName + capture have gone, // we will really remove the global event callback, // if not, return if (!task.allRemoved) { return; } return nativeRemoveEventListener.call(task.target, task.eventName, task.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, task.options); }; var customScheduleNonGlobal = function (task) { return nativeAddEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; var customSchedulePrepend = function (task) { return nativePrependEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; var customCancelNonGlobal = function (task) { return nativeRemoveEventListener.call(task.target, task.eventName, task.invoke, task.options); }; var customSchedule = useGlobalCallback ? customScheduleGlobal : customScheduleNonGlobal; var customCancel = useGlobalCallback ? customCancelGlobal : customCancelNonGlobal; var compareTaskCallbackVsDelegate = function (task, delegate) { var typeOfDelegate = typeof delegate; return ((typeOfDelegate === 'function' && task.callback === delegate) || (typeOfDelegate === 'object' && task.originalDelegate === delegate)); }; var compare = (patchOptions === null || patchOptions === void 0 ? void 0 : patchOptions.diff) || compareTaskCallbackVsDelegate; var unpatchedEvents = Zone[zoneSymbol('UNPATCHED_EVENTS')]; var passiveEvents = _global[zoneSymbol('PASSIVE_EVENTS')]; function copyEventListenerOptions(options) { if (typeof options === 'object' && options !== null) { // We need to destructure the target `options` object since it may // be frozen or sealed (possibly provided implicitly by a third-party // library), or its properties may be readonly. var newOptions = __assign({}, options); // The `signal` option was recently introduced, which caused regressions in // third-party scenarios where `AbortController` was directly provided to // `addEventListener` as options. For instance, in cases like // `document.addEventListener('keydown', callback, abortControllerInstance)`, // which is valid because `AbortController` includes a `signal` getter, spreading // `{...options}` wouldn't copy the `signal`. Additionally, using `Object.create` // isn't feasible since `AbortController` is a built-in object type, and attempting // to create a new object directly with it as the prototype might result in // unexpected behavior. if (options.signal) { newOptions.signal = options.signal; } return newOptions; } return options; } var makeAddListener = function (nativeListener, addSource, customScheduleFn, customCancelFn, returnTarget, prepend) { if (returnTarget === void 0) { returnTarget = false; } if (prepend === void 0) { prepend = false; } return function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var delegate = arguments[1]; if (!delegate) { return nativeListener.apply(this, arguments); } if (isNode && eventName === 'uncaughtException') { // don't patch uncaughtException of nodejs to prevent endless loop return nativeListener.apply(this, arguments); } // To improve `addEventListener` performance, we will create the callback // for the task later when the task is invoked. var isEventListenerObject = false; if (typeof delegate !== 'function') { // This checks whether the provided listener argument is an object with // a `handleEvent` method (since we can call `addEventListener` with a // function `event => ...` or with an object `{ handleEvent: event => ... }`). if (!delegate.handleEvent) { return nativeListener.apply(this, arguments); } isEventListenerObject = true; } if (validateHandler && !validateHandler(nativeListener, delegate, target, arguments)) { return; } var passive = !!passiveEvents && passiveEvents.indexOf(eventName) !== -1; var options = copyEventListenerOptions(buildEventListenerOptions(arguments[2], passive)); var signal = options === null || options === void 0 ? void 0 : options.signal; if (signal === null || signal === void 0 ? void 0 : signal.aborted) { // the signal is an aborted one, just return without attaching the event listener. return; } if (unpatchedEvents) { // check unpatched list for (var i = 0; i < unpatchedEvents.length; i++) { if (eventName === unpatchedEvents[i]) { if (passive) { return nativeListener.call(target, eventName, delegate, options); } else { return nativeListener.apply(this, arguments); } } } } var capture = !options ? false : typeof options === 'boolean' ? true : options.capture; var once = options && typeof options === 'object' ? options.once : false; var zone = Zone.current; var symbolEventNames = zoneSymbolEventNames[eventName]; if (!symbolEventNames) { prepareEventNames(eventName, eventNameToString); symbolEventNames = zoneSymbolEventNames[eventName]; } var symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; var existingTasks = target[symbolEventName]; var isExisting = false; if (existingTasks) { // already have task registered isExisting = true; if (checkDuplicate) { for (var i = 0; i < existingTasks.length; i++) { if (compare(existingTasks[i], delegate)) { // same callback, same capture, same event name, just return return; } } } } else { existingTasks = target[symbolEventName] = []; } var source; var constructorName = target.constructor['name']; var targetSource = globalSources[constructorName]; if (targetSource) { source = targetSource[eventName]; } if (!source) { source = constructorName + addSource + (eventNameToString ? eventNameToString(eventName) : eventName); } // In the code below, `options` should no longer be reassigned; instead, it // should only be mutated. This is because we pass that object to the native // `addEventListener`. // It's generally recommended to use the same object reference for options. // This ensures consistency and avoids potential issues. taskData.options = options; if (once) { // When using `addEventListener` with the `once` option, we don't pass // the `once` option directly to the native `addEventListener` method. // Instead, we keep the `once` setting and handle it ourselves. taskData.options.once = false; } taskData.target = target; taskData.capture = capture; taskData.eventName = eventName; taskData.isExisting = isExisting; var data = useGlobalCallback ? OPTIMIZED_ZONE_EVENT_TASK_DATA : undefined; // keep taskData into data to allow onScheduleEventTask to access the task information if (data) { data.taskData = taskData; } if (signal) { // When using `addEventListener` with the `signal` option, we don't pass // the `signal` option directly to the native `addEventListener` method. // Instead, we keep the `signal` setting and handle it ourselves. taskData.options.signal = undefined; } // The `scheduleEventTask` function will ultimately call `customScheduleGlobal`, // which in turn calls the native `addEventListener`. This is why `taskData.options` // is updated before scheduling the task, as `customScheduleGlobal` uses // `taskData.options` to pass it to the native `addEventListener`. var task = zone.scheduleEventTask(source, delegate, data, customScheduleFn, customCancelFn); if (signal) { // after task is scheduled, we need to store the signal back to task.options taskData.options.signal = signal; // Wrapping `task` in a weak reference would not prevent memory leaks. Weak references are // primarily used for preventing strong references cycles. `onAbort` is always reachable // as it's an event listener, so its closure retains a strong reference to the `task`. var onAbort_1 = function () { return task.zone.cancelTask(task); }; nativeListener.call(signal, 'abort', onAbort_1, { once: true }); // We need to remove the `abort` listener when the event listener is going to be removed, // as it creates a closure that captures `task`. This closure retains a reference to the // `task` object even after it goes out of scope, preventing `task` from being garbage // collected. task.removeAbortListener = function () { return signal.removeEventListener('abort', onAbort_1); }; } // should clear taskData.target to avoid memory leak // issue, https://github.com/angular/angular/issues/20442 taskData.target = null; // need to clear up taskData because it is a global object if (data) { data.taskData = null; } // have to save those information to task in case // application may call task.zone.cancelTask() directly if (once) { taskData.options.once = true; } if (typeof task.options !== 'boolean') { // We should save the options on the task (if it's an object) because // we'll be using `task.options` later when removing the event listener // and passing it back to `removeEventListener`. task.options = options; } task.target = target; task.capture = capture; task.eventName = eventName; if (isEventListenerObject) { // save original delegate for compare to check duplicate task.originalDelegate = delegate; } if (!prepend) { existingTasks.push(task); } else { existingTasks.unshift(task); } if (returnTarget) { return target; } }; }; proto[ADD_EVENT_LISTENER] = makeAddListener(nativeAddEventListener, ADD_EVENT_LISTENER_SOURCE, customSchedule, customCancel, returnTarget); if (nativePrependEventListener) { proto[PREPEND_EVENT_LISTENER] = makeAddListener(nativePrependEventListener, PREPEND_EVENT_LISTENER_SOURCE, customSchedulePrepend, customCancel, returnTarget, true); } proto[REMOVE_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var options = arguments[2]; var capture = !options ? false : typeof options === 'boolean' ? true : options.capture; var delegate = arguments[1]; if (!delegate) { return nativeRemoveEventListener.apply(this, arguments); } if (validateHandler && !validateHandler(nativeRemoveEventListener, delegate, target, arguments)) { return; } var symbolEventNames = zoneSymbolEventNames[eventName]; var symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; } var existingTasks = symbolEventName && target[symbolEventName]; // `existingTasks` may not exist if the `addEventListener` was called before // it was patched by zone.js. Please refer to the attached issue for // clarification, particularly after the `if` condition, before calling // the native `removeEventListener`. if (existingTasks) { for (var i = 0; i < existingTasks.length; i++) { var existingTask = existingTasks[i]; if (compare(existingTask, delegate)) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check existingTask.isRemoved = true; if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target existingTask.allRemoved = true; target[symbolEventName] = null; // in the target, we have an event listener which is added by on_property // such as target.onclick = function() {}, so we need to clear this internal // property too if all delegates with capture=false were removed // https:// github.com/angular/angular/issues/31643 // https://github.com/angular/angular/issues/54581 if (!capture && typeof eventName === 'string') { var onPropertySymbol = ZONE_SYMBOL_PREFIX + 'ON_PROPERTY' + eventName; target[onPropertySymbol] = null; } } // In all other conditions, when `addEventListener` is called after being // patched by zone.js, we would always find an event task on the `EventTarget`. // This will trigger `cancelFn` on the `existingTask`, leading to `customCancelGlobal`, // which ultimately removes an event listener and cleans up the abort listener // (if an `AbortSignal` was provided when scheduling a task). existingTask.zone.cancelTask(existingTask); if (returnTarget) { return target; } return; } } } // https://github.com/angular/zone.js/issues/930 // We may encounter a situation where the `addEventListener` was // called on the event target before zone.js is loaded, resulting // in no task being stored on the event target due to its invocation // of the native implementation. In this scenario, we simply need to // invoke the native `removeEventListener`. return nativeRemoveEventListener.apply(this, arguments); }; proto[LISTENERS_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var listeners = []; var tasks = findEventTasks(target, eventNameToString ? eventNameToString(eventName) : eventName); for (var i = 0; i < tasks.length; i++) { var task = tasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; listeners.push(delegate); } return listeners; }; proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (!eventName) { var keys = Object.keys(target); for (var i = 0; i < keys.length; i++) { var prop = keys[i]; var match = EVENT_NAME_SYMBOL_REGX.exec(prop); var evtName = match && match[1]; // in nodejs EventEmitter, removeListener event is // used for monitoring the removeListener call, // so just keep removeListener eventListener until // all other eventListeners are removed if (evtName && evtName !== 'removeListener') { this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, evtName); } } // remove removeListener listener finally this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, 'removeListener'); } else { if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var symbolEventNames = zoneSymbolEventNames[eventName]; if (symbolEventNames) { var symbolEventName = symbolEventNames[FALSE_STR]; var symbolCaptureEventName = symbolEventNames[TRUE_STR]; var tasks = target[symbolEventName]; var captureTasks = target[symbolCaptureEventName]; if (tasks) { var removeTasks = tasks.slice(); for (var i = 0; i < removeTasks.length; i++) { var task = removeTasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } if (captureTasks) { var removeTasks = captureTasks.slice(); for (var i = 0; i < removeTasks.length; i++) { var task = removeTasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } } } if (returnTarget) { return this; } }; // for native toString patch attachOriginToPatched(proto[ADD_EVENT_LISTENER], nativeAddEventListener); attachOriginToPatched(proto[REMOVE_EVENT_LISTENER], nativeRemoveEventListener); if (nativeRemoveAllListeners) { attachOriginToPatched(proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER], nativeRemoveAllListeners); } if (nativeListeners) { attachOriginToPatched(proto[LISTENERS_EVENT_LISTENER], nativeListeners); } return true; } var results = []; for (var i = 0; i < apis.length; i++) { results[i] = patchEventTargetMethods(apis[i], patchOptions); } return results; } function findEventTasks(target, eventName) { if (!eventName) { var foundTasks = []; for (var prop in target) { var match = EVENT_NAME_SYMBOL_REGX.exec(prop); var evtName = match && match[1]; if (evtName && (!eventName || evtName === eventName)) { var tasks = target[prop]; if (tasks) { for (var i = 0; i < tasks.length; i++) { foundTasks.push(tasks[i]); } } } } return foundTasks; } var symbolEventName = zoneSymbolEventNames[eventName]; if (!symbolEventName) { prepareEventNames(eventName); symbolEventName = zoneSymbolEventNames[eventName]; } var captureFalseTasks = target[symbolEventName[FALSE_STR]]; var captureTrueTasks = target[symbolEventName[TRUE_STR]]; if (!captureFalseTasks) { return captureTrueTasks ? captureTrueTasks.slice() : []; } else { return captureTrueTasks ? captureFalseTasks.concat(captureTrueTasks) : captureFalseTasks.slice(); } } function patchEventPrototype(global, api) { var Event = global['Event']; if (Event && Event.prototype) { api.patchMethod(Event.prototype, 'stopImmediatePropagation', function (delegate) { return function (self, args) { self[IMMEDIATE_PROPAGATION_SYMBOL] = true; // we need to call the native stopImmediatePropagation // in case in some hybrid application, some part of // application will be controlled by zone, some are not delegate && delegate.apply(self, args); }; }); } } /** * @fileoverview * @suppress {missingRequire} */ function patchQueueMicrotask(global, api) { api.patchMethod(global, 'queueMicrotask', function (delegate) { return function (self, args) { Zone.current.scheduleMicroTask('queueMicrotask', args[0]); }; }); } /** * @fileoverview * @suppress {missingRequire} */ var taskSymbol = zoneSymbol('zoneTask'); function patchTimer(window, setName, cancelName, nameSuffix) { var setNative = null; var clearNative = null; setName += nameSuffix; cancelName += nameSuffix; var tasksByHandleId = {}; function scheduleTask(task) { var data = task.data; data.args[0] = function () { return task.invoke.apply(this, arguments); }; var handleOrId = setNative.apply(window, data.args); // Whlist on Node.js when get can the ID by using `[Symbol.toPrimitive]()` we do // to this so that we do not cause potentally leaks when using `setTimeout` // since this can be periodic when using `.refresh`. if (isNumber(handleOrId)) { data.handleId = handleOrId; } else { data.handle = handleOrId; // On Node.js a timeout and interval can be restarted over and over again by using the `.refresh` method. data.isRefreshable = isFunction(handleOrId.refresh); } return task; } function clearTask(task) { var _a = task.data, handle = _a.handle, handleId = _a.handleId; return clearNative.call(window, handle !== null && handle !== void 0 ? handle : handleId); } setNative = patchMethod(window, setName, function (delegate) { return function (self, args) { var _a; if (isFunction(args[0])) { var options_1 = { isRefreshable: false, isPeriodic: nameSuffix === 'Interval', delay: nameSuffix === 'Timeout' || nameSuffix === 'Interval' ? args[1] || 0 : undefined, args: args, }; var callback_1 = args[0]; args[0] = function timer() { try { return callback_1.apply(this, arguments); } finally { // issue-934, task will be cancelled // even it is a periodic task such as // setInterval // https://github.com/angular/angular/issues/40387 // Cleanup tasksByHandleId should be handled before scheduleTask // Since some zoneSpec may intercept and doesn't trigger // scheduleFn(scheduleTask) provided here. var handle_1 = options_1.handle, handleId_1 = options_1.handleId, isPeriodic_1 = options_1.isPeriodic, isRefreshable_1 = options_1.isRefreshable; if (!isPeriodic_1 && !isRefreshable_1) { if (handleId_1) { // in non-nodejs env, we remove timerId // from local cache delete tasksByHandleId[handleId_1]; } else if (handle_1) { // Node returns complex objects as handleIds // we remove task reference from timer object handle_1[taskSymbol] = null; } } } }; var task_1 = scheduleMacroTaskWithCurrentZone(setName, args[0], options_1, scheduleTask, clearTask); if (!task_1) { return task_1; } // Node.js must additionally support the ref and unref functions. var _b = task_1.data, handleId = _b.handleId, handle = _b.handle, isRefreshable = _b.isRefreshable, isPeriodic = _b.isPeriodic; if (handleId) { // for non nodejs env, we save handleId: task // mapping in local cache for clearTimeout tasksByHandleId[handleId] = task_1; } else if (handle) { // for nodejs env, we save task // reference in timerId Object for clearTimeout handle[taskSymbol] = task_1; if (isRefreshable && !isPeriodic) { var originalRefresh_1 = handle.refresh; handle.refresh = function () { var zone = task_1.zone, state = task_1.state; if (state === 'notScheduled') { task_1._state = 'scheduled'; zone._updateTaskCount(task_1, 1); } else if (state === 'running') { task_1._state = 'scheduling'; } return originalRefresh_1.call(this); }; } } return (_a = handle !== null && handle !== void 0 ? handle : handleId) !== null && _a !== void 0 ? _a : task_1; } else { // cause an error by calling it directly. return delegate.apply(window, args); } }; }); clearNative = patchMethod(window, cancelName, function (delegate) { return function (self, args) { var id = args[0]; var task; if (isNumber(id)) { // non nodejs env. task = tasksByHandleId[id]; delete tasksByHandleId[id]; } else { // nodejs env ?? other environments. task = id === null || id === void 0 ? void 0 : id[taskSymbol]; if (task) { id[taskSymbol] = null; } else { task = id; } } if (task === null || task === void 0 ? void 0 : task.type) { if (task.cancelFn) { // Do not cancel already canceled functions task.zone.cancelTask(task); } } else { // cause an error by calling it directly. delegate.apply(window, args); } }; }); } function patchCustomElements(_global, api) { var _a = api.getGlobalObjects(), isBrowser = _a.isBrowser, isMix = _a.isMix; if ((!isBrowser && !isMix) || !_global['customElements'] || !('customElements' in _global)) { return; } // https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks var callbacks = [ 'connectedCallback', 'disconnectedCallback', 'adoptedCallback', 'attributeChangedCallback', 'formAssociatedCallback', 'formDisabledCallback', 'formResetCallback', 'formStateRestoreCallback', ]; api.patchCallbacks(api, _global.customElements, 'customElements', 'define', callbacks); } function eventTargetPatch(_global, api) { if (Zone[api.symbol('patchEventTarget')]) { // EventTarget is already patched. return; } var _a = api.getGlobalObjects(), eventNames = _a.eventNames, zoneSymbolEventNames = _a.zoneSymbolEventNames, TRUE_STR = _a.TRUE_STR, FALSE_STR = _a.FALSE_STR, ZONE_SYMBOL_PREFIX = _a.ZONE_SYMBOL_PREFIX; // predefine all __zone_symbol__ + eventName + true/false string for (var i = 0; i < eventNames.length; i++) { var eventName = eventNames[i]; var falseEventName = eventName + FALSE_STR; var trueEventName = eventName + TRUE_STR; var symbol = ZONE_SYMBOL_PREFIX + falseEventName; var symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } var EVENT_TARGET = _global['EventTarget']; if (!EVENT_TARGET || !EVENT_TARGET.prototype) { return; } api.patchEventTarget(_global, api, [EVENT_TARGET && EVENT_TARGET.prototype]); return true; } function patchEvent(global, api) { api.patchEventPrototype(global, api); } /** * @fileoverview * @suppress {globalThis} */ function filterProperties(target, onProperties, ignoreProperties) { if (!ignoreProperties || ignoreProperties.length === 0) { return onProperties; } var tip = ignoreProperties.filter(function (ip) { return ip.target === target; }); if (tip.length === 0) { return onProperties; } var targetIgnoreProperties = tip[0].ignoreProperties; return onProperties.filter(function (op) { return targetIgnoreProperties.indexOf(op) === -1; }); } function patchFilteredProperties(target, onProperties, ignoreProperties, prototype) { // check whether target is available, sometimes target will be undefined // because different browser or some 3rd party plugin. if (!target) { return; } var filteredProperties = filterProperties(target, onProperties, ignoreProperties); patchOnProperties(target, filteredProperties, prototype); } /** * Get all event name properties which the event name startsWith `on` * from the target object itself, inherited properties are not considered. */ function getOnEventNames(target) { return Object.getOwnPropertyNames(target) .filter(function (name) { return name.startsWith('on') && name.length > 2; }) .map(function (name) { return name.substring(2); }); } function propertyDescriptorPatch(api, _global) { if (isNode && !isMix) { return; } if (Zone[api.symbol('patchEvents')]) { // events are already been patched by legacy patch. return; } var ignoreProperties = _global['__Zone_ignore_on_properties']; // for browsers that we can patch the descriptor: Chrome & Firefox var patchTargets = []; if (isBrowser) { var internalWindow_1 = window; patchTargets = patchTargets.concat([ 'Document', 'SVGElement', 'Element', 'HTMLElement', 'HTMLBodyElement', 'HTMLMediaElement', 'HTMLFrameSetElement', 'HTMLFrameElement', 'HTMLIFrameElement', 'HTMLMarqueeElement', 'Worker', ]); var ignoreErrorProperties = []; // In older browsers like IE or Edge, event handler properties (e.g., `onclick`) // may not be defined directly on the `window` object but on its prototype (`WindowPrototype`). // To ensure complete coverage, we use the prototype when checking // for and patching these properties. patchFilteredProperties(internalWindow_1, getOnEventNames(internalWindow_1), ignoreProperties ? ignoreProperties.concat(ignoreErrorProperties) : ignoreProperties, ObjectGetPrototypeOf(internalWindow_1)); } patchTargets = patchTargets.concat([ 'XMLHttpRequest', 'XMLHttpRequestEventTarget', 'IDBIndex', 'IDBRequest', 'IDBOpenDBRequest', 'IDBDatabase', 'IDBTransaction', 'IDBCursor', 'WebSocket', ]); for (var i = 0; i < patchTargets.length; i++) { var target = _global[patchTargets[i]]; (target === null || target === void 0 ? void 0 : target.prototype) && patchFilteredProperties(target.prototype, getOnEventNames(target.prototype), ignoreProperties); } } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowser(Zone) { Zone.__load_patch('legacy', function (global) { var legacyPatch = global[Zone.__symbol__('legacyPatch')]; if (legacyPatch) { legacyPatch(); } }); Zone.__load_patch('timers', function (global) { var set = 'set'; var clear = 'clear'; patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); }); Zone.__load_patch('requestAnimationFrame', function (global) { patchTimer(global, 'request', 'cancel', 'AnimationFrame'); patchTimer(global, 'mozRequest', 'mozCancel', 'AnimationFrame'); patchTimer(global, 'webkitRequest', 'webkitCancel', 'AnimationFrame'); }); Zone.__load_patch('blocking', function (global, Zone) { var blockingMethods = ['alert', 'prompt', 'confirm']; for (var i = 0; i < blockingMethods.length; i++) { var name_2 = blockingMethods[i]; patchMethod(global, name_2, function (delegate, symbol, name) { return function (s, args) { return Zone.current.run(delegate, global, args, name); }; }); } }); Zone.__load_patch('EventTarget', function (global, Zone, api) { patchEvent(global, api); eventTargetPatch(global, api); // patch XMLHttpRequestEventTarget's addEventListener/removeEventListener var XMLHttpRequestEventTarget = global['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget && XMLHttpRequestEventTarget.prototype) { api.patchEventTarget(global, api, [XMLHttpRequestEventTarget.prototype]); } }); Zone.__load_patch('MutationObserver', function (global, Zone, api) { patchClass('MutationObserver'); patchClass('WebKitMutationObserver'); }); Zone.__load_patch('IntersectionObserver', function (global, Zone, api) { patchClass('IntersectionObserver'); }); Zone.__load_patch('FileReader', function (global, Zone, api) { patchClass('FileReader'); }); Zone.__load_patch('on_property', function (global, Zone, api) { propertyDescriptorPatch(api, global); }); Zone.__load_patch('customElements', function (global, Zone, api) { patchCustomElements(global, api); }); Zone.__load_patch('XHR', function (global, Zone) { // Treat XMLHttpRequest as a macrotask. patchXHR(global); var XHR_TASK = zoneSymbol('xhrTask'); var XHR_SYNC = zoneSymbol('xhrSync'); var XHR_LISTENER = zoneSymbol('xhrListener'); var XHR_SCHEDULED = zoneSymbol('xhrScheduled'); var XHR_URL = zoneSymbol('xhrURL'); var XHR_ERROR_BEFORE_SCHEDULED = zoneSymbol('xhrErrorBeforeScheduled'); function patchXHR(window) { var XMLHttpRequest = window['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return; } var XMLHttpRequestPrototype = XMLHttpRequest.prototype; function findPendingTask(target) { return target[XHR_TASK]; } var oriAddListener = XMLHttpRequestPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; var oriRemoveListener = XMLHttpRequestPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; if (!oriAddListener) { var XMLHttpRequestEventTarget_1 = window['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget_1) { var XMLHttpRequestEventTargetPrototype = XMLHttpRequestEventTarget_1.prototype; oriAddListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } } var READY_STATE_CHANGE = 'readystatechange'; var SCHEDULED = 'scheduled'; function scheduleTask(task) { var data = task.data; var target = data.target; target[XHR_SCHEDULED] = false; target[XHR_ERROR_BEFORE_SCHEDULED] = false; // remove existing event listener var listener = target[XHR_LISTENER]; if (!oriAddListener) { oriAddListener = target[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = target[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } if (listener) { oriRemoveListener.call(target, READY_STATE_CHANGE, listener); } var newListener = (target[XHR_LISTENER] = function () { if (target.readyState === target.DONE) { // sometimes on some browsers XMLHttpRequest will fire onreadystatechange with // readyState=4 multiple times, so we need to check task state here if (!data.aborted && target[XHR_SCHEDULED] && task.state === SCHEDULED) { // check whether the xhr has registered onload listener // if that is the case, the task should invoke after all // onload listeners finish. // Also if the request failed without response (status = 0), the load event handler // will not be triggered, in that case, we should also invoke the placeholder callback // to close the XMLHttpRequest::send macroTask. // https://github.com/angular/angular/issues/38795 var loadTasks = target[Zone.__symbol__('loadfalse')]; if (target.status !== 0 && loadTasks && loadTasks.length > 0) { var oriInvoke_1 = task.invoke; task.invoke = function () { // need to load the tasks again, because in other // load listener, they may remove themselves var loadTasks = target[Zone.__symbol__('loadfalse')]; for (var i = 0; i < loadTasks.length; i++) { if (loadTasks[i] === task) { loadTasks.splice(i, 1); } } if (!data.aborted && task.state === SCHEDULED) { oriInvoke_1.call(task); } }; loadTasks.push(task); } else { task.invoke(); } } else if (!data.aborted && target[XHR_SCHEDULED] === false) { // error occurs when xhr.send() target[XHR_ERROR_BEFORE_SCHEDULED] = true; } } }); oriAddListener.call(target, READY_STATE_CHANGE, newListener); var storedTask = target[XHR_TASK]; if (!storedTask) { target[XHR_TASK] = task; } sendNative.apply(target, data.args); target[XHR_SCHEDULED] = true; return task; } function placeholderCallback() { } function clearTask(task) { var data = task.data; // Note - ideally, we would call data.target.removeEventListener here, but it's too late // to prevent it from firing. So instead, we store info for the event listener. data.aborted = true; return abortNative.apply(data.target, data.args); } var openNative = patchMethod(XMLHttpRequestPrototype, 'open', function () { return function (self, args) { self[XHR_SYNC] = args[2] == false; self[XHR_URL] = args[1]; return openNative.apply(self, args); }; }); var XMLHTTPREQUEST_SOURCE = 'XMLHttpRequest.send'; var fetchTaskAborting = zoneSymbol('fetchTaskAborting'); var fetchTaskScheduling = zoneSymbol('fetchTaskScheduling'); var sendNative = patchMethod(XMLHttpRequestPrototype, 'send', function () { return function (self, args) { if (Zone.current[fetchTaskScheduling] === true) { // a fetch is scheduling, so we are using xhr to polyfill fetch // and because we already schedule macroTask for fetch, we should // not schedule a macroTask for xhr again return sendNative.apply(self, args); } if (self[XHR_SYNC]) { // if the XHR is sync there is no task to schedule, just execute the code. return sendNative.apply(self, args); } else { var options = { target: self, url: self[XHR_URL], isPeriodic: false, args: args, aborted: false, }; var task = scheduleMacroTaskWithCurrentZone(XMLHTTPREQUEST_SOURCE, placeholderCallback, options, scheduleTask, clearTask); if (self && self[XHR_ERROR_BEFORE_SCHEDULED] === true && !options.aborted && task.state === SCHEDULED) { // xhr request throw error when send // we should invoke task instead of leaving a scheduled // pending macroTask task.invoke(); } } }; }); var abortNative = patchMethod(XMLHttpRequestPrototype, 'abort', function () { return function (self, args) { var task = findPendingTask(self); if (task && typeof task.type == 'string') { // If the XHR has already completed, do nothing. // If the XHR has already been aborted, do nothing. // Fix #569, call abort multiple times before done will cause // macroTask task count be negative number if (task.cancelFn == null || (task.data && task.data.aborted)) { return; } task.zone.cancelTask(task); } else if (Zone.current[fetchTaskAborting] === true) { // the abort is called from fetch polyfill, we need to call native abort of XHR. return abortNative.apply(self, args); } // Otherwise, we are trying to abort an XHR which has not yet been sent, so there is no // task // to cancel. Do nothing. }; }); } }); Zone.__load_patch('geolocation', function (global) { /// GEO_LOCATION if (global['navigator'] && global['navigator'].geolocation) { patchPrototype(global['navigator'].geolocation, ['getCurrentPosition', 'watchPosition']); } }); Zone.__load_patch('PromiseRejectionEvent', function (global, Zone) { // handle unhandled promise rejection function findPromiseRejectionHandler(evtName) { return function (e) { var eventTasks = findEventTasks(global, evtName); eventTasks.forEach(function (eventTask) { // windows has added unhandledrejection event listener // trigger the event listener var PromiseRejectionEvent = global['PromiseRejectionEvent']; if (PromiseRejectionEvent) { var evt = new PromiseRejectionEvent(evtName, { promise: e.promise, reason: e.rejection, }); eventTask.invoke(evt); } }); }; } if (global['PromiseRejectionEvent']) { Zone[zoneSymbol('unhandledPromiseRejectionHandler')] = findPromiseRejectionHandler('unhandledrejection'); Zone[zoneSymbol('rejectionHandledHandler')] = findPromiseRejectionHandler('rejectionhandled'); } }); Zone.__load_patch('queueMicrotask', function (global, Zone, api) { patchQueueMicrotask(global, api); }); } function patchPromise(Zone) { Zone.__load_patch('ZoneAwarePromise', function (global, Zone, api) { var ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; var ObjectDefineProperty = Object.defineProperty; function readableObjectToString(obj) { if (obj && obj.toString === Object.prototype.toString) { var className = obj.constructor && obj.constructor.name; return (className ? className : '') + ': ' + JSON.stringify(obj); } return obj ? obj.toString() : Object.prototype.toString.call(obj); } var __symbol__ = api.symbol; var _uncaughtPromiseErrors = []; var isDisableWrappingUncaughtPromiseRejection = global[__symbol__('DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION')] !== false; var symbolPromise = __symbol__('Promise'); var symbolThen = __symbol__('then'); var creationTrace = '__creationTrace__'; api.onUnhandledError = function (e) { if (api.showUncaughtError()) { var rejection = e && e.rejection; if (rejection) { console.error('Unhandled Promise rejection:', rejection instanceof Error ? rejection.message : rejection, '; Zone:', e.zone.name, '; Task:', e.task && e.task.source, '; Value:', rejection, rejection instanceof Error ? rejection.stack : undefined); } else { console.error(e); } } }; api.microtaskDrainDone = function () { var _loop_3 = function () { var uncaughtPromiseError = _uncaughtPromiseErrors.shift(); try { uncaughtPromiseError.zone.runGuarded(function () { if (uncaughtPromiseError.throwOriginal) { throw uncaughtPromiseError.rejection; } throw uncaughtPromiseError; }); } catch (error) { handleUnhandledRejection(error); } }; while (_uncaughtPromiseErrors.length) { _loop_3(); } }; var UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL = __symbol__('unhandledPromiseRejectionHandler'); function handleUnhandledRejection(e) { api.onUnhandledError(e); try { var handler = Zone[UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL]; if (typeof handler === 'function') { handler.call(this, e); } } catch (err) { } } function isThenable(value) { return value && typeof value.then === 'function'; } function forwardResolution(value) { return value; } function forwardRejection(rejection) { return ZoneAwarePromise.reject(rejection); } var symbolState = __symbol__('state'); var symbolValue = __symbol__('value'); var symbolFinally = __symbol__('finally'); var symbolParentPromiseValue = __symbol__('parentPromiseValue'); var symbolParentPromiseState = __symbol__('parentPromiseState'); var source = 'Promise.then'; var UNRESOLVED = null; var RESOLVED = true; var REJECTED = false; var REJECTED_NO_CATCH = 0; function makeResolver(promise, state) { return function (v) { try { resolvePromise(promise, state, v); } catch (err) { resolvePromise(promise, false, err); } // Do not return value or you will break the Promise spec. }; } var once = function () { var wasCalled = false; return function wrapper(wrappedFunction) { return function () { if (wasCalled) { return; } wasCalled = true; wrappedFunction.apply(null, arguments); }; }; }; var TYPE_ERROR = 'Promise resolved with itself'; var CURRENT_TASK_TRACE_SYMBOL = __symbol__('currentTaskTrace'); // Promise Resolution function resolvePromise(promise, state, value) { var onceWrapper = once(); if (promise === value) { throw new TypeError(TYPE_ERROR); } if (promise[symbolState] === UNRESOLVED) { // should only get value.then once based on promise spec. var then = null; try { if (typeof value === 'object' || typeof value === 'function') { then = value && value.then; } } catch (err) { onceWrapper(function () { resolvePromise(promise, false, err); })(); return promise; } // if (value instanceof ZoneAwarePromise) { if (state !== REJECTED && value instanceof ZoneAwarePromise && value.hasOwnProperty(symbolState) && value.hasOwnProperty(symbolValue) && value[symbolState] !== UNRESOLVED) { clearRejectedNoCatch(value); resolvePromise(promise, value[symbolState], value[symbolValue]); } else if (state !== REJECTED && typeof then === 'function') { try { then.call(value, onceWrapper(makeResolver(promise, state)), onceWrapper(makeResolver(promise, false))); } catch (err) { onceWrapper(function () { resolvePromise(promise, false, err); })(); } } else { promise[symbolState] = state; var queue = promise[symbolValue]; promise[symbolValue] = value; if (promise[symbolFinally] === symbolFinally) { // the promise is generated by Promise.prototype.finally if (state === RESOLVED) { // the state is resolved, should ignore the value // and use parent promise value promise[symbolState] = promise[symbolParentPromiseState]; promise[symbolValue] = promise[symbolParentPromiseValue]; } } // record task information in value when error occurs, so we can // do some additional work such as render longStackTrace if (state === REJECTED && value instanceof Error) { // check if longStackTraceZone is here var trace = Zone.currentTask && Zone.currentTask.data && Zone.currentTask.data[creationTrace]; if (trace) { // only keep the long stack trace into error when in longStackTraceZone ObjectDefineProperty(value, CURRENT_TASK_TRACE_SYMBOL, { configurable: true, enumerable: false, writable: true, value: trace, }); } } for (var i = 0; i < queue.length;) { scheduleResolveOrReject(promise, queue[i++], queue[i++], queue[i++], queue[i++]); } if (queue.length == 0 && state == REJECTED) { promise[symbolState] = REJECTED_NO_CATCH; var uncaughtPromiseError = value; try { // Here we throws a new Error to print more readable error log // and if the value is not an error, zone.js builds an `Error` // Object here to attach the stack information. throw new Error('Uncaught (in promise): ' + readableObjectToString(value) + (value && value.stack ? '\n' + value.stack : '')); } catch (err) { uncaughtPromiseError = err; } if (isDisableWrappingUncaughtPromiseRejection) { // If disable wrapping uncaught promise reject // use the value instead of wrapping it. uncaughtPromiseError.throwOriginal = true; } uncaughtPromiseError.rejection = value; uncaughtPromiseError.promise = promise; uncaughtPromiseError.zone = Zone.current; uncaughtPromiseError.task = Zone.currentTask; _uncaughtPromiseErrors.push(uncaughtPromiseError); api.scheduleMicroTask(); // to make sure that it is running } } } // Resolving an already resolved promise is a noop. return promise; } var REJECTION_HANDLED_HANDLER = __symbol__('rejectionHandledHandler'); function clearRejectedNoCatch(promise) { if (promise[symbolState] === REJECTED_NO_CATCH) { // if the promise is rejected no catch status // and queue.length > 0, means there is a error handler // here to handle the rejected promise, we should trigger // windows.rejectionhandled eventHandler or nodejs rejectionHandled // eventHandler try { var handler = Zone[REJECTION_HANDLED_HANDLER]; if (handler && typeof handler === 'function') { handler.call(this, { rejection: promise[symbolValue], promise: promise }); } } catch (err) { } promise[symbolState] = REJECTED; for (var i = 0; i < _uncaughtPromiseErrors.length; i++) { if (promise === _uncaughtPromiseErrors[i].promise) { _uncaughtPromiseErrors.splice(i, 1); } } } } function scheduleResolveOrReject(promise, zone, chainPromise, onFulfilled, onRejected) { clearRejectedNoCatch(promise); var promiseState = promise[symbolState]; var delegate = promiseState ? typeof onFulfilled === 'function' ? onFulfilled : forwardResolution : typeof onRejected === 'function' ? onRejected : forwardRejection; zone.scheduleMicroTask(source, function () { try { var parentPromiseValue = promise[symbolValue]; var isFinallyPromise = !!chainPromise && symbolFinally === chainPromise[symbolFinally]; if (isFinallyPromise) { // if the promise is generated from finally call, keep parent promise's state and value chainPromise[symbolParentPromiseValue] = parentPromiseValue; chainPromise[symbolParentPromiseState] = promiseState; } // should not pass value to finally callback var value = zone.run(delegate, undefined, isFinallyPromise && delegate !== forwardRejection && delegate !== forwardResolution ? [] : [parentPromiseValue]); btresolvePromise(chainPromise, true, value); } catch (error) { // if error occurs, should always return this error resolvePromise(chainPromise, false, error); } }, chainPromise); } var ZONE_AWARE_PROMISE_TO_STRING = 'function ZoneAwarePromise() { [native code] }'; var noop = function () { }; var AggregateError = global.AggregateError; var ZoneAwarePromise = /** @class */ (function () { function ZoneAwarePromise(executor) { var promise = this; if (!(promise instanceof ZoneAwarePromise)) { throw new Error('Must be an instanceof Promise.'); } promise[symbolState] = UNRESOLVED; promise[symbolValue] = []; // queue; try { var onceWrapper = once(); executor && executor(onceWrapper(makeResolver(promise, RESOLVED)), onceWrapper(makeResolver(promise, REJECTED))); } catch (error) { resolvePromise(promise, false, error); } } ZoneAwarePromise.toString = function () { return ZONE_AWARE_PROMISE_TO_STRING; }; ZoneAwarePromise.resolve = function (value) { if (value instanceof ZoneAwarePromise) { return value; } return resolvePromise(new this(null), RESOLVED, value); }; ZoneAwarePromise.reject = function (error) { return resolvePromise(new this(null), REJECTED, error); }; ZoneAwarePromise.withResolvers = function () { var result = {}; result.promise = new ZoneAwarePromise(function (res, rej) { result.resolve = res; result.reject = rej; }); return result; }; ZoneAwarePromise.any = function (values) { if (!values || typeof values[Symbol.iterator] !== 'function') { return Promise.reject(new AggregateError([], 'All promises were rejected')); } var promises = []; var count = 0; try { for (var _i = 0, values_1 = values; _i < values_1.length; _i++) { var v = values_1[_i]; count++; promises.push(ZoneAwarePromise.resolve(v)); } } catch (err) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } if (count === 0) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } var finished = false; var errors = []; return new ZoneAwarePromise(function (resolve, reject) { for (var i = 0; i < promises.length; i++) { promises[i].then(function (v) { if (finished) { return; } finished = true; resolve(v); }, function (err) { errors.push(err); count--; if (count === 0) { finished = true; reject(new AggregateError(errors, 'All promises were rejected')); } }); } }); }; ZoneAwarePromise.race = function (values) { var resolve; var reject; var promise = new this(function (res, rej) { resolve = res; reject = rej; }); function onResolve(value) { resolve(value); } function onReject(error) { reject(error); } for (var _i = 0, values_2 = values; _i < values_2.length; _i++) { var value = values_2[_i]; if (!isThenable(value)) { value = this.resolve(value); } value.then(onResolve, onReject); } return promise; }; ZoneAwarePromise.all = function (values) { return ZoneAwarePromise.allWithCallback(values); }; ZoneAwarePromise.allSettled = function (values) { var P = this && this.prototype instanceof ZoneAwarePromise ? this : ZoneAwarePromise; return P.allWithCallback(values, { thenCallback: function (value) { return ({ status: 'fulfilled', value: value }); }, errorCallback: function (err) { return ({ status: 'rejected', reason: err }); }, }); }; ZoneAwarePromise.allWithCallback = function (values, callback) { var resolve; var reject; var promise = new this(function (res, rej) { resolve = res; reject = rej; }); // Start at 2 to prevent prematurely resolving if .then is called immediately. var unresolvedCount = 2; var valueIndex = 0; var resolvedValues = []; var _loop_4 = function (value) { if (!isThenable(value)) { value = this_1.resolve(value); } var curValueIndex = valueIndex; try { value.then(function (value) { resolvedValues[curValueIndex] = callback ? callback.thenCallback(value) : value; unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } }, function (err) { if (!callback) { reject(err); } else { resolvedValues[curValueIndex] = callback.errorCallback(err); unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } } }); } catch (thenErr) { reject(thenErr); } unresolvedCount++; valueIndex++; }; var this_1 = this; for (var _i = 0, values_3 = values; _i < values_3.length; _i++) { var value = values_3[_i]; _loop_4(value); } // Make the unresolvedCount zero-based again. unresolvedCount -= 2; if (unresolvedCount === 0) { resolve(resolvedValues); } return promise; }; Object.defineProperty(ZoneAwarePromise.prototype, Symbol.toStringTag, { get: function () { return 'Promise'; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneAwarePromise.prototype, Symbol.species, { get: function () { return ZoneAwarePromise; }, enumerable: false, configurable: true }); ZoneAwarePromise.prototype.then = function (onFulfilled, onRejected) { var _a; // We must read `Symbol.species` safely because `this` may be anything. For instance, `this` // may be an object without a prototype (created through `Object.create(null)`); thus // `this.constructor` will be undefined. One of the use cases is SystemJS creating // prototype-less objects (modules) via `Object.create(null)`. The SystemJS creates an empty // object and copies promise properties into that object (within the `getOrCreateLoad` // function). The zone.js then checks if the resolved value has the `then` method and // invokes it with the `value` context. Otherwise, this will throw an error: `TypeError: // Cannot read properties of undefined (reading 'Symbol(Symbol.species)')`. var C = (_a = this.constructor) === null || _a === void 0 ? void 0 : _a[Symbol.species]; if (!C || typeof C !== 'function') { C = this.constructor || ZoneAwarePromise; } var chainPromise = new C(noop); var zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFulfilled, onRejected); } else { scheduleResolveOrReject(this, zone, chainPromise, onFulfilled, onRejected); } return chainPromise; }; ZoneAwarePromise.prototype.catch = function (onRejected) { return this.then(null, onRejected); }; ZoneAwarePromise.prototype.finally = function (onFinally) { var _a; // See comment on the call to `then` about why thee `Symbol.species` is safely accessed. var C = (_a = this.constructor) === null || _a === void 0 ? void 0 : _a[Symbol.species]; if (!C || typeof C !== 'function') { C = ZoneAwarePromise; } var chainPromise = new C(noop); chainPromise[symbolFinally] = symbolFinally; var zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFinally, onFinally); } else { scheduleResolveOrReject(this, zone, chainPromise, onFinally, onFinally); } return chainPromise; }; return ZoneAwarePromise; }()); // Protect against aggressive optimizers dropping seemingly unused properties. // E.g. Closure Compiler in advanced mode. ZoneAwarePromise['resolve'] = ZoneAwarePromise.resolve; ZoneAwarePromise['reject'] = ZoneAwarePromise.reject; ZoneAwarePromise['race'] = ZoneAwarePromise.race; ZoneAwarePromise['all'] = ZoneAwarePromise.all; var NativePromise = (global[symbolPromise] = global['Promise']); global['Promise'] = ZoneAwarePromise; var symbolThenPatched = __symbol__('thenPatched'); function patchThen(Ctor) { var proto = Ctor.prototype; var prop = ObjectGetOwnPropertyDescriptor(proto, 'then'); if (prop && (prop.writable === false || !prop.configurable)) { // check Ctor.prototype.then propertyDescriptor is writable or not // in meteor env, writable is false, we should ignore such case return; } var originalThen = proto.then; // Keep a reference to the original method. proto[symbolThen] = originalThen; Ctor.prototype.then = function (onResolve, onReject) { var _this = this; var wrapped = new ZoneAwarePromise(function (resolve, reject) { originalThen.call(_this, resolve, reject); }); return wrapped.then(onResolve, onReject); }; Ctor[symbolThenPatched] = true; } api.patchThen = patchThen; function zoneify(fn) { return function (self, args) { var resultPromise = fn.apply(self, args); if (resultPromise instanceof ZoneAwarePromise) { return resultPromise; } var ctor = resultPromise.constructor; if (!ctor[symbolThenPatched]) { patchThen(ctor); } return resultPromise; }; } if (NativePromise) { patchThen(NativePromise); patchMethod(global, 'fetch', function (delegate) { return zoneify(delegate); }); } // This is not part of public API, but it is useful for tests, so we expose it. Promise[Zone.__symbol__('uncaughtPromiseErrors')] = _uncaughtPromiseErrors; return ZoneAwarePromise; }); } function patchToString(Zone) { // override Function.prototype.toString to make zone.js patched function // look like native function Zone.__load_patch('toString', function (global) { // patch Func.prototype.toString to let them look like native var originalFunctionToString = Function.prototype.toString; var ORIGINAL_DELEGATE_SYMBOL = zoneSymbol('OriginalDelegate'); var PROMISE_SYMBOL = zoneSymbol('Promise'); var ERROR_SYMBOL = zoneSymbol('Error'); var newFunctionToString = function toString() { if (typeof this === 'function') { var originalDelegate = this[ORIGINAL_DELEGATE_SYMBOL]; if (originalDelegate) { if (typeof originalDelegate === 'function') { return originalFunctionToString.call(originalDelegate); } else { return Object.prototype.toString.call(originalDelegate); } } if (this === Promise) { var nativePromise = global[PROMISE_SYMBOL]; if (nativePromise) { return originalFunctionToString.call(nativePromise); } } if (this === Error) { var nativeError = global[ERROR_SYMBOL]; if (nativeError) { return originalFunctionToString.call(nativeError); } } } return originalFunctionToString.call(this); }; newFunctionToString[ORIGINAL_DELEGATE_SYMBOL] = originalFunctionToString; Function.prototype.toString = newFunctionToString; // patch Object.prototype.toString to let them look like native var originalObjectToString = Object.prototype.toString; var PROMISE_OBJECT_TO_STRING = '[object Promise]'; Object.prototype.toString = function () { if (typeof Promise === 'function' && this instanceof Promise) { return PROMISE_OBJECT_TO_STRING; } return originalObjectToString.call(this); }; }); } function patchCallbacks(api, target, targetName, method, callbacks) { var symbol = Zone.__symbol__(method); if (target[symbol]) { return; } var nativeDelegate = (target[symbol] = target[method]); target[method] = function (name, opts, options) { if (opts && opts.prototype) { callbacks.forEach(function (callback) { var source = "".concat(targetName, ".").concat(method, "::") + callback; var prototype = opts.prototype; // Note: the `patchCallbacks` is used for patching the `document.registerElement` and // `customElements.define`. We explicitly wrap the patching code into try-catch since // callbacks may be already patched by other web components frameworks (e.g. LWC), and they // make those properties non-writable. This means that patching callback will throw an error // `cannot assign to read-only property`. See this code as an example: // https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/framework/base-bridge-element.ts#L180-L186 // We don't want to stop the application rendering if we couldn't patch some // callback, e.g. `attributeChangedCallback`. try { if (prototype.hasOwnProperty(callback)) { var descriptor = api.ObjectGetOwnPropertyDescriptor(prototype, callback); if (descriptor && descriptor.value) { descriptor.value = api.wrapWithCurrentZone(descriptor.value, source); api._redefineProperty(opts.prototype, callback, descriptor); } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } catch (_a) { // Note: we leave the catch block empty since there's no way to handle the error related // to non-writable property. } }); } return nativeDelegate.call(target, name, opts, options); }; api.attachOriginToPatched(target[method], nativeDelegate); } function patchUtil(Zone) { Zone.__load_patch('util', function (global, Zone, api) { // Collect native event names by looking at properties // on the global namespace, e.g. 'onclick'. var eventNames = getOnEventNames(global); api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; // In earlier version of zone.js (<0.9.0), we use env name `__zone_symbol__BLACK_LISTED_EVENTS` // to define which events will not be patched by `Zone.js`. In newer version (>=0.9.0), we // change the env name to `__zone_symbol__UNPATCHED_EVENTS` to keep the name consistent with // angular repo. The `__zone_symbol__BLACK_LISTED_EVENTS` is deprecated, but it is still be // supported for backwards compatibility. var SYMBOL_BLACK_LISTED_EVENTS = Zone.__symbol__('BLACK_LISTED_EVENTS'); var SYMBOL_UNPATCHED_EVENTS = Zone.__symbol__('UNPATCHED_EVENTS'); if (global[SYMBOL_UNPATCHED_EVENTS]) { global[SYMBOL_BLACK_LISTED_EVENTS] = global[SYMBOL_UNPATCHED_EVENTS]; } if (global[SYMBOL_BLACK_LISTED_EVENTS]) { Zone[SYMBOL_BLACK_LISTED_EVENTS] = Zone[SYMBOL_UNPATCHED_EVENTS] = global[SYMBOL_BLACK_LISTED_EVENTS]; } api.patchEventPrototype = patchEventPrototype; api.patchEventTarget = patchEventTarget; api.isIEOrEdge = isIEOrEdge; api.ObjectDefineProperty = ObjectDefineProperty; api.ObjectGetOwnPropertyDescriptor = ObjectGetOwnPropertyDescriptor; api.ObjectCreate = ObjectCreate; api.ArraySlice = ArraySlice; api.patchClass = patchClass; api.wrapWithCurrentZone = wrapWithCurrentZone; api.filterProperties = filterProperties; api.attachOriginToPatched = attachOriginToPatched; api._redefineProperty = Object.defineProperty; api.patchCallbacks = patchCallbacks; api.getGlobalObjects = function () { return ({ globalSources: globalSources, zoneSymbolEventNames: zoneSymbolEventNames, eventNames: eventNames, isBrowser: isBrowser, isMix: isMix, isNode: isNode, TRUE_STR: TRUE_STR, FALSE_STR: FALSE_STR, ZONE_SYMBOL_PREFIX: ZONE_SYMBOL_PREFIX, ADD_EVENT_LISTENER_STR: ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR: REMOVE_EVENT_LISTENER_STR, }); }; }); } function patchCommon(Zone) { patchPromise(Zone); patchToString(Zone); patchUtil(Zone); } function patchEvents(Zone) { Zone.__load_patch('EventEmitter', function (global, Zone, api) { // For EventEmitter var EE_ADD_LISTENER = 'addListener'; var EE_PREPEND_LISTENER = 'prependListener'; var EE_REMOVE_LISTENER = 'removeListener'; var EE_REMOVE_ALL_LISTENER = 'removeAllListeners'; var EE_LISTENERS = 'listeners'; var EE_ON = 'on'; var EE_OFF = 'off'; var compareTaskCallbackVsDelegate = function (task, delegate) { // same callback, same capture, same event name, just return return task.callback === delegate || task.callback.listener === delegate; }; var eventNameToString = function (eventName) { if (typeof eventName === 'string') { return eventName; } if (!eventName) { return ''; } return eventName.toString().replace('(', '_').replace(')', '_'); }; function patchEventEmitterMethods(obj) { var result = patchEventTarget(global, api, [obj], { useG: false, add: EE_ADD_LISTENER, rm: EE_REMOVE_LISTENER, prepend: EE_PREPEND_LISTENER, rmAll: EE_REMOVE_ALL_LISTENER, listeners: EE_LISTENERS, chkDup: false, rt: true, diff: compareTaskCallbackVsDelegate, eventNameToString: eventNameToString, }); if (result && result[0]) { obj[EE_ON] = obj[EE_ADD_LISTENER]; obj[EE_OFF] = obj[EE_REMOVE_LISTENER]; } } // EventEmitter var events; try { events = require('events'); } catch (err) { } if (events && events.EventEmitter) { patchEventEmitterMethods(events.EventEmitter.prototype); } }); } function patchFs(Zone) { Zone.__load_patch('fs', function (global, Zone, api) { var _a; var fs; try { fs = require('fs'); } catch (err) { } if (!fs) return; // watch, watchFile, unwatchFile has been patched // because EventEmitter has been patched var TO_PATCH_MACROTASK_METHODS = [ 'access', 'appendFile', 'chmod', 'chown', 'close', 'exists', 'fchmod', 'fchown', 'fdatasync', 'fstat', 'fsync', 'ftruncate', 'futimes', 'lchmod', 'lchown', 'lutimes', 'link', 'lstat', 'mkdir', 'mkdtemp', 'open', 'opendir', 'read', 'readdir', 'readFile', 'readlink', 'realpath', 'rename', 'rmdir', 'stat', 'symlink', 'truncate', 'unlink', 'utimes', 'write', 'writeFile', 'writev', ]; TO_PATCH_MACROTASK_METHODS.filter(function (name) { return !!fs[name] && typeof fs[name] === 'function'; }).forEach(function (name) { patchMacroTask(fs, name, function (self, args) { return { name: 'fs.' + name, args: args, cbIdx: args.length > 0 ? args.length - 1 : -1, target: self, }; }); }); var realpathOriginalDelegate = (_a = fs.realpath) === null || _a === void 0 ? void 0 : _a[api.symbol('OriginalDelegate')]; // This is the only specific method that should be additionally patched because the previous // `patchMacroTask` has overridden the `realpath` function and its `native` property. if (realpathOriginalDelegate === null || realpathOriginalDelegate === void 0 ? void 0 : realpathOriginalDelegate.native) { fs.realpath.native = realpathOriginalDelegate.native; patchMacroTask(fs.realpath, 'native', function (self, args) { return ({ args: args, target: self, cbIdx: args.length > 0 ? args.length - 1 : -1, name: 'fs.realpath.native', }); }); } }); } function patchNodeUtil(Zone) { Zone.__load_patch('node_util', function (global, Zone, api) { api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; setShouldCopySymbolProperties(true); }); } var set = 'set'; var clear = 'clear'; function patchNode(Zone) { patchNodeUtil(Zone); patchEvents(Zone); patchFs(Zone); Zone.__load_patch('node_timers', function (global, Zone) { // Timers var globalUseTimeoutFromTimer = false; try { var timers = require('timers'); var globalEqualTimersTimeout = global.setTimeout === timers.setTimeout; if (!globalEqualTimersTimeout && !isMix) { // 1. if isMix, then we are in mix environment such as Electron // we should only patch timers.setTimeout because global.setTimeout // have been patched // 2. if global.setTimeout not equal timers.setTimeout, check // whether global.setTimeout use timers.setTimeout or not var originSetTimeout_1 = timers.setTimeout; timers.setTimeout = function () { globalUseTimeoutFromTimer = true; return originSetTimeout_1.apply(this, arguments); }; var detectTimeout = global.setTimeout(function () { }, 100); clearTimeout(detectTimeout); timers.setTimeout = originSetTimeout_1; } patchTimer(timers, set, clear, 'Timeout'); patchTimer(timers, set, clear, 'Interval'); patchTimer(timers, set, clear, 'Immediate'); } catch (error) { // timers module not exists, for example, when we using nativeScript // timers is not available } if (isMix) { // if we are in mix environment, such as Electron, // the global.setTimeout has already been patched, // so we just patch timers.setTimeout return; } if (!globalUseTimeoutFromTimer) { // 1. global setTimeout equals timers setTimeout // 2. or global don't use timers setTimeout(maybe some other library patch setTimeout) // 3. or load timers module error happens, we should patch global setTimeout patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); } else { // global use timers setTimeout, but not equals // this happens when use nodejs v0.10.x, global setTimeout will // use a lazy load version of timers setTimeout // we should not double patch timer's setTimeout // so we only store the __symbol__ for consistency global[Zone.__symbol__('setTimeout')] = global.setTimeout; global[Zone.__symbol__('setInterval')] = global.setInterval; global[Zone.__symbol__('setImmediate')] = global.setImmediate; } }); // patch process related methods Zone.__load_patch('nextTick', function () { // patch nextTick as microTask patchMicroTask(process, 'nextTick', function (self, args) { return { name: 'process.nextTick', args: args, cbIdx: args.length > 0 && typeof args[0] === 'function' ? 0 : -1, target: process, }; }); }); Zone.__load_patch('handleUnhandledPromiseRejection', function (global, Zone, api) { Zone[api.symbol('unhandledPromiseRejectionHandler')] = findProcessPromiseRejectionHandler('unhandledRejection'); Zone[api.symbol('rejectionHandledHandler')] = findProcessPromiseRejectionHandler('rejectionHandled'); // handle unhandled promise rejection function findProcessPromiseRejectionHandler(evtName) { return function (e) { var eventTasks = findEventTasks(process, evtName); eventTasks.forEach(function (eventTask) { // process has added unhandledrejection event listener // trigger the event listener if (evtName === 'unhandledRejection') { eventTask.invoke(e.rejection, e.promise); } else if (evtName === 'rejectionHandled') { eventTask.invoke(e.promise); } }); }; } }); // Crypto Zone.__load_patch('crypto', function () { var crypto; try { crypto = require('crypto'); } catch (err) { } // use the generic patchMacroTask to patch crypto if (crypto) { var methodNames = ['randomBytes', 'pbkdf2']; methodNames.forEach(function (name) { patchMacroTask(crypto, name, function (self, args) { return { name: 'crypto.' + name, args: args, cbIdx: args.length > 0 && typeof args[args.length - 1] === 'function' ? args.length - 1 : -1, target: crypto, }; }); }); } }); Zone.__load_patch('console', function (global, Zone) { var consoleMethods = [ 'dir', 'log', 'info', 'error', 'warn', 'assert', 'debug', 'timeEnd', 'trace', ]; consoleMethods.forEach(function (m) { var originalMethod = (console[Zone.__symbol__(m)] = console[m]); if (originalMethod) { console[m] = function () { var args = ArraySlice.call(arguments); if (Zone.current === Zone.root) { return originalMethod.apply(this, args); } else { return Zone.root.run(originalMethod, this, args); } }; } }); }); Zone.__load_patch('queueMicrotask', function (global, Zone, api) { patchQueueMicrotask(global, api); }); } function loadZone() { var _a; // if global['Zone'] already exists (maybe zone.js was already loaded or // some other lib also registered a global object named Zone), we may need // to throw an error, but sometimes user may not want this error. // For example, // we have two web pages, page1 includes zone.js, page2 doesn't. // and the 1st time user load page1 and page2, everything work fine, // but when user load page2 again, error occurs because global['Zone'] already exists. // so we add a flag to let user choose whether to throw this error or not. // By default, if existing Zone is from zone.js, we will not throw the error. var global = globalThis; var checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (global['Zone'] && (checkDuplicate || typeof global['Zone'].__symbol__ !== 'function')) { throw new Error('Zone already loaded.'); } // Initialize global `Zone` constant. (_a = global['Zone']) !== null && _a !== void 0 ? _a : (global['Zone'] = initZone()); return global['Zone']; } var Zone$1 = loadZone(); patchCommon(Zone$1); patchBrowser(Zone$1); patchNode(Zone$1); })); ᚹ3x1웗 R 'use strict'uglobal, Wexports === 'object' && typeof module !== 'undefined' ? factory(require('rxjs')) : 8['rxjs'], factory) : (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.rxjs)); })(this, (function (rxjso6WRxJsqL$rxjs.(B98extSource = 'rxjs.Subscriber.next'; var errorSource = 'rxjs.Subscriber.error'; var completeSource = 'rxjs.Subscriber.complete'%ies =q$Tvar patchObservabld"%ObservablePrototype = rxjs.Observable%_symbolSubscribe = symbol('_subscribe1WS_subscribe = (ObservablePrototype[_symbolSubscribe] = ObservablePrototype._subscribies(rxjs.Observable.prototyp_zone: { value: null, writ! f _zoneSource: { value: null, writ! f#_zoneSubscribe: { value: null, writ! fsource:&hG"+` Y ?S!XNQ `J;*`JzoneSa  NXN subscribe:&hG"+this._zoneSubscriba)!` Y ?Subscriba "`J this.constructor === rxjs.Observ! e _subscriba "` to(thi!`eproto && proto._subscribaXNsubscriba)#?;*^ !subscriba)!``JzoneSubscribe = subscriba "``J zoneSubscribd* Pj%his._zone && this._zone !== Zone.curr`!&earDown_1 = this._zone.run(subscribe, A  : earDown_1# _1 =aN ) ^zone_1 !== Zone.currezone_1.run(tearDown_1, A  `@"e earDown_1;) _?# tearDown_1!&X?#`e subscribe;)?#_ "XN`subjectFactory:&"+` Y ?SubjectFactoryxNfactorq[  =aN `JzoneSubjectFactory1^zone && zone !== Zone.currzone.run(factory, A  "actory;)p d  NXNK`M"(rxjs.Observable.prototype, 'lift'~C6 observable = )0^observable.operatR`observable.operator._)S7Method(observable.operator, 'call', function (operatorDoperatorSelf, operatorAAy^6operatorSelf._zone && operatorSelf._zone !== Zone.curr >?peratorSelf._zone.run(operatorDelegate, operatorSelf, operatorA8>/peratorDelegate.apply(operatorSelf, operatorArgQ p.> bservable; patchSubscription!ies(rxjs.Subscription.prototyp_zone: { value: null, writ! f%_zoneUnsubscribe: { value: null, writ! f _unsubscribe:&"+3this._zoneUnsubscribe || this._zoneUnsubscribeClear Y ? Unsubscriba "` to(thi!`eproto && proto._unsubscribaXN unsubscriba)#?;*^ !unsubscriba)!``JzoneUnsubscribe = unsubscriba E2some operator such as `retryWhen`, the _unsubscrib( =// method will be set to null, so we need to set another flag1!`4o tell that we should return null instead of finding1!npМprototype chainq"`JzoneUnsubscribeClear "``JzoneUnsubscribeClearedyp `JzoneUnsubscribd* Pj%his._zone && this._zone !== Zone.curr zone.run(unsubscribe, A  p*e unsubscribe;)?#_ "XNK`patchSubscriber!$next = rxjs.Subscriber.prototype.nexp$rror = rxjs.Subscriber.prototype.err5+omplete = rxjs.Subscriber.prototype.completa{(rxjs.Subscriber.prototype, 'destination'hG"2Nstina`destina `J;&`JzoneDestination = destinaK0,// patch Subscriber.next to make sure it runADinto SubscriptionZone rxjs.Subscriber.prototype.next%oZ'(pCubscriptionZone =aN`+check Zone.currenAm,qual with this._zone(SubscriptionZone) or noA^1subscriptionZone && subscriptionZone !== currentZ_)e1subscriptionZone.run(next, this, arguments, nextSHV5enext;)Xdrxjs.Subscriber.prototype.error%oZ'(pCubscriptionZone =aN`+check Zone.currenAm,qual with this._zone(SubscriptionZone) or noA^1subscriptionZone && subscriptionZone !== currentZ_)e3subscriptionZone.run(error, this, arguments, errorSHV5eerro;*Xd!rxjs.Subscriber.prototype.completd&oZ'(pCubscriptionZone =aN`+check Zone.currenAm,qual with this._zone(SubscriptionZone) or noA^1subscriptionZone && subscriptionZone !== currentZ_)e9subscriptionZone.run(complete, this, arguments, completeSHV5ecompleteAP_opatchObservable( Subscription( Subscriber(patchRxJs(Zone); })); x`"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var t,n=1,r=arguments.length;n * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=globalThis;function t(t){return(e.__Zone_symbol_prefix||"__zone_symbol__")+t}function n(){var n=e.performance;function r(e){n&&n.mark&&n.mark(e)}function o(e,t){n&&n.measure&&n.measure(e,t)}r("Zone");var a,i=function(){function n(e,t){this._parent=e,this._name=t?t.name||"unnamed":"",this._properties=t&&t.properties||{},this._zoneDelegate=new s(this,this._parent&&this._parent._zoneDelegate,t)}return n.assertZonePatched=function(){if(e.Promise!==D.ZoneAwarePromise)throw new Error("Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.\nMost likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.)")},Object.defineProperty(n,"root",{get:function(){for(var e=n.current;e.parent;)e=e.parent;return e},enumerable:!1,configurable:!0}),Object.defineProperty(n,"current",{get:function(){return j.zone},enumerable:!1,configurable:!0}),Object.defineProperty(n,"currentTask",{get:function(){return C},enumerable:!1,configurable:!0}),n.__load_patch=function(a,i,c){if(void 0===c&&(c=!1),D.hasOwnProperty(a)){var s=!0===e[t("forceDuplicateZoneCheck")];if(!c&&s)throw Error("Already loaded patch: "+a)}else if(!e["__Zone_disable_"+a]){var u="Zone:"+a;r(u),D[a]=i(e,n,Z),o(u,u)}},Object.defineProperty(n.prototype,"parent",{get:function(){return this._parent},enumerable:!1,configurable:!0}),Object.defineProperty(n.prototype,"name",{get:function(){return this._name},enumerable:!1,configurable:!0}),n.prototype.get=function(e){var t=this.getZoneWith(e);if(t)return t._properties[e]},n.prototype.getZoneWith=function(e){for(var t=this;t;){if(t._properties.hasOwnProperty(e))return t;t=t._parent}return null},n.prototype.fork=function(e){if(!e)throw new Error("ZoneSpec required!");return this._zoneDelegate.fork(this,e)},n.prototype.wrap=function(e,t){if("function"!=typeof e)throw new Error("Expecting function got: "+e);var n=this._zoneDelegate.intercept(this,e,t),r=this;return function(){return r.runGuarded(n,this,arguments,t)}},n.prototype.run=function(e,t,n,r){j={parent:j,zone:this};try{return this._zoneDelegate.invoke(this,e,t,n,r)}finally{j=j.parent}},n.prototype.runGuarded=function(e,t,n,r){void 0===t&&(t=null),j={parent:j,zone:this};try{try{return this._zoneDelegate.invoke(this,e,t,n,r)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{j=j.parent}},n.prototype.runTask=function(e,t,n){if(e.zone!=this)throw new Error("A task can only be run in the zone of creation! (Creation: "+(e.zone||y).name+"; Execution: "+this.name+")");var r=e,o=e.type,a=e.data,i=void 0===a?{}:a,c=i.isPeriodic,s=void 0!==c&&c,u=i.isRefreshable,l=void 0!==u&&u;if(e.state!==k||o!==O&&o!==P){var f=e.state!=T;f&&r._transitionTo(T,b);var h=C;C=r,j={parent:j,zone:this};try{o!=P||!e.data||s||l||(e.cancelFn=void 0);try{return this._zoneDelegate.invokeTask(this,r,t,n)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{var p=e.state;if(p!==k&&p!==w)if(o==O||s||l&&p===m)f&&r._transitionTo(b,T,m);else{var v=r._zoneDelegates;this._updateTaskCount(r,-1),f&&r._transitionTo(k,T,k),l&&(r._zoneDelegates=v)}j=j.parent,C=h}}},n.prototype.scheduleTask=function(e){if(e.zone&&e.zone!==this)for(var t=this;t;){if(t===e.zone)throw Error("can not reschedule task to ".concat(this.name," which is descendants of the original zone ").concat(e.zone.name));t=t.parent}e._transitionTo(m,k);var n=[];e._zoneDelegates=n,e._zone=this;try{e=this._zoneDelegate.scheduleTask(this,e)}catch(t){throw e._transitionTo(w,m,k),this._zoneDelegate.handleError(this,t),t}return e._zoneDelegates===n&&this._updateTaskCount(e,1),e.state==m&&e._transitionTo(b,m),e},n.prototype.scheduleMicroTask=function(e,t,n,r){return this.scheduleTask(new u(S,e,t,n,r,void 0))},n.prototype.scheduleMacroTask=function(e,t,n,r,o){return this.scheduleTask(new u(P,e,t,n,r,o))},n.prototype.scheduleEventTask=function(e,t,n,r,o){return this.scheduleTask(new u(O,e,t,n,r,o))},n.prototype.cancelTask=function(e){if(e.zone!=this)throw new Error("A task can only be cancelled in the zone of creation! (Creation: "+(e.zone||y).name+"; Execution: "+this.name+")");if(e.state===b||e.state===T){e._transitionTo(E,b,T);try{this._zoneDelegate.cancelTask(this,e)}catch(t){throw e._transitionTo(w,E),this._zoneDelegate.handleError(this,t),t}return this._updateTaskCount(e,-1),e._transitionTo(k,E),e.runCount=-1,e}},n.prototype._updateTaskCount=function(e,t){var n=e._zoneDelegates;-1==t&&(e._zoneDelegates=null);for(var r=0;r0,macroTask:n.macroTask>0,eventTask:n.eventTask>0,change:e})},e}(),u=function(){function t(n,r,o,a,i,c){if(this._zone=null,this.runCount=0,this._zoneDelegates=null,this._state="notScheduled",this.type=n,this.source=r,this.data=a,this.scheduleFn=i,this.cancelFn=c,!o)throw new Error("callback is not defined");this.callback=o;var s=this;this.invoke=n===O&&a&&a.useG?t.invokeTask:function(){return t.invokeTask.call(e,s,this,arguments)}}return t.invokeTask=function(e,t,n){e||(e=this),z++;try{return e.runCount++,e.zone.runTask(e,t,n)}finally{1==z&&g(),z--}},Object.defineProperty(t.prototype,"zone",{get:function(){return this._zone},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"state",{get:function(){return this._state},enumerable:!1,configurable:!0}),t.prototype.cancelScheduleRequest=function(){this._transitionTo(k,m)},t.prototype._transitionTo=function(e,t,n){if(this._state!==t&&this._state!==n)throw new Error("".concat(this.type," '").concat(this.source,"': can not transition to '").concat(e,"', expecting state '").concat(t,"'").concat(n?" or '"+n+"'":"",", was '").concat(this._state,"'."));this._state=e,e==k&&(this._zoneDelegates=null)},t.prototype.toString=function(){return this.data&&void 0!==this.data.handleId?this.data.handleId.toString():Object.prototype.toString.call(this)},t.prototype.toJSON=function(){return{type:this.type,state:this.state,source:this.source,zone:this.zone.name,runCount:this.runCount}},t}(),l=t("setTimeout"),f=t("Promise"),h=t("then"),p=[],v=!1;function d(t){if(a||e[f]&&(a=e[f].resolve(0)),a){var n=a[h];n||(n=a.then),n.call(a,t)}else e[l](t,0)}function _(e){0===z&&0===p.length&&d(g),e&&p.push(e)}function g(){if(!v){for(v=!0;p.length;){var e=p;p=[];for(var t=0;t=0;n--)"function"==typeof e[n]&&(e[n]=d(e[n],t+"_"+n));return e}function T(e){return!e||!1!==e.writable&&!("function"==typeof e.get&&void 0===e.set)}var E="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope,w=!("nw"in m)&&void 0!==m.process&&"[object process]"===m.process.toString(),S=!w&&!E&&!(!y||!k.HTMLElement),P=void 0!==m.process&&"[object process]"===m.process.toString()&&!E&&!(!y||!k.HTMLElement),O={},D=g("enable_beforeunload"),Z=function(e){if(e=e||m.event){var t=O[e.type];t||(t=O[e.type]=g("ON_PROPERTY"+e.type));var n,r=this||e.target||m,o=r[t];return S&&r===k&&"error"===e.type?!0===(n=o&&o.call(this,e.message,e.filename,e.lineno,e.colno,e.error))&&e.preventDefault():(n=o&&o.apply(this,arguments),"beforeunload"===e.type&&m[D]&&"string"==typeof n?e.returnValue=n:null==n||n||e.preventDefault()),n}};function j(e,t,n){var a=r(e,t);if(!a&&n&&r(n,t)&&(a={enumerable:!0,configurable:!0}),a&&a.configurable){var i=g("on"+t+"patched");if(!e.hasOwnProperty(i)||!e[i]){delete a.writable,delete a.value;var c=a.get,s=a.set,u=t.slice(2),l=O[u];l||(l=O[u]=g("ON_PROPERTY"+u)),a.set=function(t){var n=this;n||e!==m||(n=m),n&&("function"==typeof n[l]&&n.removeEventListener(u,Z),null==s||s.call(n,null),n[l]=t,"function"==typeof t&&n.addEventListener(u,Z,!1))},a.get=function(){var n=this;if(n||e!==m||(n=m),!n)return null;var r=n[l];if(r)return r;if(c){var o=c.call(this);if(o)return a.set.call(this,o),"function"==typeof n.removeAttribute&&n.removeAttribute(t),o}return null},o(e,t,a),e[i]=!0}}}function C(e,t,n){if(t)for(var r=0;r=0&&"function"==typeof r[a.cbIdx]?_(a.name,r[a.cbIdx],a,o):e.apply(t,r)}}))}function A(e,t,n){var r=null;function o(e){var t=e.data;return t.args[t.cbIdx]=function(){e.invoke.apply(this,arguments)},r.apply(t.target,t.args),e}r=M(e,t,(function(e){return function(t,r){var a=n(t,r);return a.cbIdx>=0&&"function"==typeof r[a.cbIdx]?Zone.current.scheduleMicroTask(a.name,r[a.cbIdx],a,o):e.apply(t,r)}}))}function L(e,t){e[g("OriginalDelegate")]=t}var x=!1,H=!1;function F(){if(x)return H;x=!0;try{var e=k.navigator.userAgent;-1===e.indexOf("MSIE ")&&-1===e.indexOf("Trident/")&&-1===e.indexOf("Edge/")||(H=!0)}catch(e){}return H}function q(e){return"function"==typeof e}function G(e){return"number"==typeof e}var B={useG:!0},U={},W={},V=new RegExp("^"+v+"(\\w+)(true|false)$"),X=g("propagationStopped");function Y(e,t){var n=(t?t(e):e)+p,r=(t?t(e):e)+h,o=v+n,a=v+r;U[e]={},U[e][p]=o,U[e][h]=a}function J(e,t,n,r){var o=r&&r.add||s,i=r&&r.rm||u,c=r&&r.listeners||"eventListeners",l=r&&r.rmAll||"removeAllListeners",f=g(o),d="."+o+":",_="prependListener",y="."+_+":",k=function(e,t,n){if(!e.isRemoved){var r,o=e.callback;"object"==typeof o&&o.handleEvent&&(e.callback=function(e){return o.handleEvent(e)},e.originalDelegate=o);try{e.invoke(e,t,[n])}catch(e){r=e}var a=e.options;return a&&"object"==typeof a&&a.once&&t[i].call(t,n.type,e.originalDelegate?e.originalDelegate:e.callback,a),r}};function m(n,r,o){if(r=r||e.event){var a=n||r.target||e,i=a[U[r.type][o?h:p]];if(i){var c=[];if(1===i.length)(l=k(i[0],a,r))&&c.push(l);else for(var s=i.slice(),u=0;u2})).map((function(e){return e.substring(2)}))}function ie(e,t){if((!w||P)&&!Zone[e.symbol("patchEvents")]){var n=t.__Zone_ignore_on_properties,r=[];if(S){var o=window;r=r.concat(["Document","SVGElement","Element","HTMLElement","HTMLBodyElement","HTMLMediaElement","HTMLFrameSetElement","HTMLFrameElement","HTMLIFrameElement","HTMLMarqueeElement","Worker"]),oe(o,ae(o),n?n.concat([]):n,a(o))}r=r.concat(["XMLHttpRequest","XMLHttpRequestEventTarget","IDBIndex","IDBRequest","IDBOpenDBRequest","IDBDatabase","IDBTransaction","IDBCursor","WebSocket"]);for(var i=0;i0){var a=e.invoke;e.invoke=function(){for(var r=o[t.__symbol__("loadfalse")],i=0;i0?n.length-1:-1,target:t}}))}));var a=null===(r=o.realpath)||void 0===r?void 0:r[n.symbol("OriginalDelegate")];(null==a?void 0:a.native)&&(o.realpath.native=a.native,N(o.realpath,"native",(function(e,t){return{args:t,target:e,cbIdx:t.length>0?t.length-1:-1,name:"fs.realpath.native"}})))}}))}(e),e.__load_patch("node_timers",(function(e,t){var n=!1;try{var r=require("timers");if(e.setTimeout!==r.setTimeout&&!P){var o=r.setTimeout;r.setTimeout=function(){return n=!0,o.apply(this,arguments)};var a=e.setTimeout((function(){}),100);clearTimeout(a),r.setTimeout=o}te(r,se,ue,"Timeout"),te(r,se,ue,"Interval"),te(r,se,ue,"Immediate")}catch(e){}P||(n?(e[t.__symbol__("setTimeout")]=e.setTimeout,e[t.__symbol__("setInterval")]=e.setInterval,e[t.__symbol__("setImmediate")]=e.setImmediate):(te(e,se,ue,"Timeout"),te(e,se,ue,"Interval"),te(e,se,ue,"Immediate")))})),e.__load_patch("nextTick",(function(){A(process,"nextTick",(function(e,t){return{name:"process.nextTick",args:t,cbIdx:t.length>0&&"function"==typeof t[0]?0:-1,target:process}}))})),e.__load_patch("handleUnhandledPromiseRejection",(function(e,t,n){function r(e){return function(t){K(process,e).forEach((function(n){"unhandledRejection"===e?n.invoke(t.rejection,t.promise):"rejectionHandled"===e&&n.invoke(t.promise)}))}}t[n.symbol("unhandledPromiseRejectionHandler")]=r("unhandledRejection"),t[n.symbol("rejectionHandledHandler")]=r("rejectionHandled")})),e.__load_patch("crypto",(function(){var e;try{e=require("crypto")}catch(e){}e&&["randomBytes","pbkdf2"].forEach((function(t){N(e,t,(function(n,r){return{name:"crypto."+t,args:r,cbIdx:r.length>0&&"function"==typeof r[r.length-1]?r.length-1:-1,target:e}}))}))})),e.__load_patch("console",(function(e,t){["dir","log","info","error","warn","assert","debug","timeEnd","trace"].forEach((function(e){var n=console[t.__symbol__(e)]=console[e];n&&(console[e]=function(){var e=c.call(arguments);return t.current===t.root?n.apply(this,e):t.root.run(n,this,e)})}))})),e.__load_patch("queueMicrotask",(function(e,t,n){Q(e,n)}))}(le)}));,W0Jx'use strict'; var __assign = (this && this.__assign) || function () { __assign = Object.assign || function(t) { for (var s, i = 1, n = arguments.length; i < n; i++) { s = arguments[i]; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; } return t; }; return __assign.apply(this, arguments); }; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; var global = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { var symbolPrefix = global['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } function initZone() { var performance = global['performance']; function mark(name) { performance && performance['mark'] && performance['mark'](name); } function performanceMeasure(name, label) { performance && performance['measure'] && performance['measure'](name, label); } mark('Zone'); var ZoneImpl = /** @class */ (function () { function ZoneImpl(parent, zoneSpec) { this._parent = parent; this._name = zoneSpec ? zoneSpec.name || 'unnamed' : ''; this._properties = (zoneSpec && zoneSpec.properties) || {}; this._zoneDelegate = new _ZoneDelegate(this, this._parent && this._parent._zoneDelegate, zoneSpec); } ZoneImpl.assertZonePatched = function () { if (global['Promise'] !== patches['ZoneAwarePromise']) { throw new Error('Zone.js has detected that ZoneAwarePromise `(window|global).Promise` ' + 'has been overwritten.\n' + 'Most likely cause is that a Promise polyfill has been loaded ' + 'after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. ' + 'If you must load one, do so before loading zone.js.)'); } }; Object.defineProperty(ZoneImpl, "root", { get: function () { var zone = ZoneImpl.current; while (zone.parent) { zone = zone.parent; } return zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl, "current", { get: function () { return _currentZoneFrame.zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl, "currentTask", { get: function () { return _currentTask; }, enumerable: false, configurable: true }); ZoneImpl.__load_patch = function (name, fn, ignoreDuplicate) { if (ignoreDuplicate === void 0) { ignoreDuplicate = false; } if (patches.hasOwnProperty(name)) { // `checkDuplicate` option is defined from global variable // so it works for all modules. // `ignoreDuplicate` can work for the specified module var checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (!ignoreDuplicate && checkDuplicate) { throw Error('Already loaded patch: ' + name); } } else if (!global['__Zone_disable_' + name]) { var perfName = 'Zone:' + name; mark(perfName); patches[name] = fn(global, ZoneImpl, _api); performanceMeasure(perfName, perfName); } }; Object.defineProperty(ZoneImpl.prototype, "parent", { get: function () { return this._parent; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneImpl.prototype, "name", { get: function () { return this._name; }, enumerable: false, configurable: true }); ZoneImpl.prototype.get = function (key) { var zone = this.getZoneWith(key); if (zone) return zone._properties[key]; }; ZoneImpl.prototype.getZoneWith = function (key) { var current = this; while (current) { if (current._properties.hasOwnProperty(key)) { return current; } current = current._parent; } return null; }; ZoneImpl.prototype.fork = function (zoneSpec) { if (!zoneSpec) throw new Error('ZoneSpec required!'); return this._zoneDelegate.fork(this, zoneSpec); }; ZoneImpl.prototype.wrap = function (callback, source) { if (typeof callback !== 'function') { throw new Error('Expecting function got: ' + callback); } var _callback = this._zoneDelegate.intercept(this, callback, source); var zone = this; return function () { return zone.runGuarded(_callback, this, arguments, source); }; }; ZoneImpl.prototype.run = function (callback, applyThis, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } finally { _currentZoneFrame = _currentZoneFrame.parent; } }; ZoneImpl.prototype.runGuarded = function (callback, applyThis, applyArgs, source) { if (applyThis === void 0) { applyThis = null; } _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { _currentZoneFrame = _currentZoneFrame.parent; } }; ZoneImpl.prototype.runTask = function (task, applyThis, applyArgs) { if (task.zone != this) { throw new Error('A task can only be run in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); } var zoneTask = task; // https://github.com/angular/zone.js/issues/778, sometimes eventTask // will run in notScheduled(canceled) state, we should not try to // run such kind of task but just return var type = task.type, _a = task.data, _b = _a === void 0 ? {} : _a, _c = _b.isPeriodic, isPeriodic = _c === void 0 ? false : _c, _d = _b.isRefreshable, isRefreshable = _d === void 0 ? false : _d; if (task.state === notScheduled && (type === eventTask || type === macroTask)) { return; } var reEntryGuard = task.state != running; reEntryGuard && zoneTask._transitionTo(running, scheduled); var previousTask = _currentTask; _currentTask = zoneTask; _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { if (type == macroTask && task.data && !isPeriodic && !isRefreshable) { task.cancelFn = undefined; } try { return this._zoneDelegate.invokeTask(this, zoneTask, applyThis, applyArgs); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { // if the task's state is notScheduled or unknown, then it has already been cancelled // we should not reset the state to scheduled var state = task.state; if (state !== notScheduled && state !== unknown) { if (type == eventTask || isPeriodic || (isRefreshable && state === scheduling)) { reEntryGuard && zoneTask._transitionTo(scheduled, running, scheduling); } else { var zoneDelegates = zoneTask._zoneDelegates; this._updateTaskCount(zoneTask, -1); reEntryGuard && zoneTask._transitionTo(notScheduled, running, notScheduled); if (isRefreshable) { zoneTask._zoneDelegates = zoneDelegates; } } } _currentZoneFrame = _currentZoneFrame.parent; _currentTask = previousTask; } }; ZoneImpl.prototype.scheduleTask = function (task) { if (task.zone && task.zone !== this) { // check if the task was rescheduled, the newZone // should not be the children of the original zone var newZone = this; while (newZone) { if (newZone === task.zone) { throw Error("can not reschedule task to ".concat(this.name, " which is descendants of the original zone ").concat(task.zone.name)); } newZone = newZone.parent; } } task._transitionTo(scheduling, notScheduled); var zoneDelegates = []; task._zoneDelegates = zoneDelegates; task._zone = this; try { task = this._zoneDelegate.scheduleTask(this, task); } catch (err) { // should set task's state to unknown when scheduleTask throw error // because the err may from reschedule, so the fromState maybe notScheduled task._transitionTo(unknown, scheduling, notScheduled); // TODO: @JiaLiPassion, should we check the result from handleError? this._zoneDelegate.handleError(this, err); throw err; } if (task._zoneDelegates === zoneDelegates) { // we have to check because internally the delegate can reschedule the task. this._updateTaskCount(task, 1); } if (task.state == scheduling) { task._transitionTo(scheduled, scheduling); } return task; }; ZoneImpl.prototype.scheduleMicroTask = function (source, callback, data, customSchedule) { return this.scheduleTask(new ZoneTask(microTask, source, callback, data, customSchedule, undefined)); }; ZoneImpl.prototype.scheduleMacroTask = function (source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(macroTask, source, callback, data, customSchedule, customCancel)); }; ZoneImpl.prototype.scheduleEventTask = function (source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(eventTask, source, callback, data, customSchedule, customCancel)); }; ZoneImpl.prototype.cancelTask = function (task) { if (task.zone != this) throw new Error('A task can only be cancelled in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); if (task.state !== scheduled && task.state !== running) { return; } task._transitionTo(canceling, scheduled, running); try { this._zoneDelegate.cancelTask(this, task); } catch (err) { // if error occurs when cancelTask, transit the state to unknown task._transitionTo(unknown, canceling); this._zoneDelegate.handleError(this, err); throw err; } this._updateTaskCount(task, -1); task._transitionTo(notScheduled, canceling); task.runCount = -1; return task; }; ZoneImpl.prototype._updateTaskCount = function (task, count) { var zoneDelegates = task._zoneDelegates; if (count == -1) { task._zoneDelegates = null; } for (var i = 0; i < zoneDelegates.length; i++) { zoneDelegates[i]._updateTaskCount(task.type, count); } }; ZoneImpl.__symbol__ = __symbol__; return ZoneImpl; }()); var DELEGATE_ZS = { name: '', onHasTask: function (delegate, _, target, hasTaskState) { return delegate.hasTask(target, hasTaskState); }, onScheduleTask: function (delegate, _, target, task) { return delegate.scheduleTask(target, task); }, onInvokeTask: function (delegate, _, target, task, applyThis, applyArgs) { return delegate.invokeTask(target, task, applyThis, applyArgs); }, onCancelTask: function (delegate, _, target, task) { return delegate.cancelTask(target, task); }, }; var _ZoneDelegate = /** @class */ (function () { function _ZoneDelegate(zone, parentDelegate, zoneSpec) { this._taskCounts = { 'microTask': 0, 'macroTask': 0, 'eventTask': 0, }; this._zone = zone; this._parentDelegate = parentDelegate; this._forkZS = zoneSpec && (zoneSpec && zoneSpec.onFork ? zoneSpec : parentDelegate._forkZS); this._forkDlgt = zoneSpec && (zoneSpec.onFork ? parentDelegate : parentDelegate._forkDlgt); this._forkCurrZone = zoneSpec && (zoneSpec.onFork ? this._zone : parentDelegate._forkCurrZone); this._interceptZS = zoneSpec && (zoneSpec.onIntercept ? zoneSpec : parentDelegate._interceptZS); this._interceptDlgt = zoneSpec && (zoneSpec.onIntercept ? parentDelegate : parentDelegate._interceptDlgt); this._interceptCurrZone = zoneSpec && (zoneSpec.onIntercept ? this._zone : parentDelegate._interceptCurrZone); this._invokeZS = zoneSpec && (zoneSpec.onInvoke ? zoneSpec : parentDelegate._invokeZS); this._invokeDlgt = zoneSpec && (zoneSpec.onInvoke ? parentDelegate : parentDelegate._invokeDlgt); this._invokeCurrZone = zoneSpec && (zoneSpec.onInvoke ? this._zone : parentDelegate._invokeCurrZone); this._handleErrorZS = zoneSpec && (zoneSpec.onHandleError ? zoneSpec : parentDelegate._handleErrorZS); this._handleErrorDlgt = zoneSpec && (zoneSpec.onHandleError ? parentDelegate : parentDelegate._handleErrorDlgt); this._handleErrorCurrZone = zoneSpec && (zoneSpec.onHandleError ? this._zone : parentDelegate._handleErrorCurrZone); this._scheduleTaskZS = zoneSpec && (zoneSpec.onScheduleTask ? zoneSpec : parentDelegate._scheduleTaskZS); this._scheduleTaskDlgt = zoneSpec && (zoneSpec.onScheduleTask ? parentDelegate : parentDelegate._scheduleTaskDlgt); this._scheduleTaskCurrZone = zoneSpec && (zoneSpec.onScheduleTask ? this._zone : parentDelegate._scheduleTaskCurrZone); this._invokeTaskZS = zoneSpec && (zoneSpec.onInvokeTask ? zoneSpec : parentDelegate._invokeTaskZS); this._invokeTaskDlgt = zoneSpec && (zoneSpec.onInvokeTask ? parentDelegate : parentDelegate._invokeTaskDlgt); this._invokeTaskCurrZone = zoneSpec && (zoneSpec.onInvokeTask ? this._zone : parentDelegate._invokeTaskCurrZone); this._cancelTaskZS = zoneSpec && (zoneSpec.onCancelTask ? zoneSpec : parentDelegate._cancelTaskZS); this._cancelTaskDlgt = zoneSpec && (zoneSpec.onCancelTask ? parentDelegate : parentDelegate._cancelTaskDlgt); this._cancelTaskCurrZone = zoneSpec && (zoneSpec.onCancelTask ? this._zone : parentDelegate._cancelTaskCurrZone); this._hasTaskZS = null; this._hasTaskDlgt = null; this._hasTaskDlgtOwner = null; this._hasTaskCurrZone = null; var zoneSpecHasTask = zoneSpec && zoneSpec.onHasTask; var parentHasTask = parentDelegate && parentDelegate._hasTaskZS; if (zoneSpecHasTask || parentHasTask) { // If we need to report hasTask, than this ZS needs to do ref counting on tasks. In such // a case all task related interceptors must go through this ZD. We can't short circuit it. this._hasTaskZS = zoneSpecHasTask ? zoneSpec : DELEGATE_ZS; this._hasTaskDlgt = parentDelegate; this._hasTaskDlgtOwner = this; this._hasTaskCurrZone = this._zone; if (!zoneSpec.onScheduleTask) { this._scheduleTaskZS = DELEGATE_ZS; this._scheduleTaskDlgt = parentDelegate; this._scheduleTaskCurrZone = this._zone; } if (!zoneSpec.onInvokeTask) { this._invokeTaskZS = DELEGATE_ZS; this._invokeTaskDlgt = parentDelegate; this._invokeTaskCurrZone = this._zone; } if (!zoneSpec.onCancelTask) { this._cancelTaskZS = DELEGATE_ZS; this._cancelTaskDlgt = parentDelegate; this._cancelTaskCurrZone = this._zone; } } } Object.defineProperty(_ZoneDelegate.prototype, "zone", { get: function () { return this._zone; }, enumerable: false, configurable: true }); _ZoneDelegate.prototype.fork = function (targetZone, zoneSpec) { return this._forkZS ? this._forkZS.onFork(this._forkDlgt, this.zone, targetZone, zoneSpec) : new ZoneImpl(targetZone, zoneSpec); }; _ZoneDelegate.prototype.intercept = function (targetZone, callback, source) { return this._interceptZS ? this._interceptZS.onIntercept(this._interceptDlgt, this._interceptCurrZone, targetZone, callback, source) : callback; }; _ZoneDelegate.prototype.invoke = function (targetZone, callback, applyThis, applyArgs, source) { return this._invokeZS ? this._invokeZS.onInvoke(this._invokeDlgt, this._invokeCurrZone, targetZone, callback, applyThis, applyArgs, source) : callback.apply(applyThis, applyArgs); }; _ZoneDelegate.prototype.handleError = function (targetZone, error) { return this._handleErrorZS ? this._handleErrorZS.onHandleError(this._handleErrorDlgt, this._handleErrorCurrZone, targetZone, error) : true; }; _ZoneDelegate.prototype.scheduleTask = function (targetZone, task) { var returnTask = task; if (this._scheduleTaskZS) { if (this._hasTaskZS) { returnTask._zoneDelegates.push(this._hasTaskDlgtOwner); } returnTask = this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this._scheduleTaskCurrZone, targetZone, task); if (!returnTask) returnTask = task; } else { if (task.scheduleFn) { task.scheduleFn(task); } else if (task.type == microTask) { scheduleMicroTask(task); } else { throw new Error('Task is missing scheduleFn.'); } } return returnTask; }; _ZoneDelegate.prototype.invokeTask = function (targetZone, task, applyThis, applyArgs) { return this._invokeTaskZS ? this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt, this._invokeTaskCurrZone, targetZone, task, applyThis, applyArgs) : task.callback.apply(applyThis, applyArgs); }; _ZoneDelegate.prototype.cancelTask = function (targetZone, task) { var value; if (this._cancelTaskZS) { value = this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt, this._cancelTaskCurrZone, targetZone, task); } else { if (!task.cancelFn) { throw Error('Task is not cancelable'); } value = task.cancelFn(task); } return value; }; _ZoneDelegate.prototype.hasTask = function (targetZone, isEmpty) { // hasTask should not throw error so other ZoneDelegate // can still trigger hasTask callback try { this._hasTaskZS && this._hasTaskZS.onHasTask(this._hasTaskDlgt, this._hasTaskCurrZone, targetZone, isEmpty); } catch (err) { this.handleError(targetZone, err); } }; _ZoneDelegate.prototype._updateTaskCount = function (type, count) { var counts = this._taskCounts; var prev = counts[type]; var next = (counts[type] = prev + count); if (next < 0) { throw new Error('More tasks executed then were scheduled.'); } if (prev == 0 || next == 0) { var isEmpty = { microTask: counts['microTask'] > 0, macroTask: counts['macroTask'] > 0, eventTask: counts['eventTask'] > 0, change: type, }; this.hasTask(this._zone, isEmpty); } }; return _ZoneDelegate; }()); var ZoneTask = /** @class */ (function () { function ZoneTask(type, source, callback, options, scheduleFn, cancelFn) { this._zone = null; this.runCount = 0; this._zoneDelegates = null; this._state = 'notScheduled'; this.type = type; this.source = source; this.data = options; this.scheduleFn = scheduleFn; this.cancelFn = cancelFn; if (!callback) { throw new Error('callback is not defined'); } this.callback = callback; var self = this; // TODO: @JiaLiPassion options should have interface if (type === eventTask && options && options.useG) { this.invoke = ZoneTask.invokeTask; } else { this.invoke = function () { return ZoneTask.invokeTask.call(global, self, this, arguments); }; } } ZoneTask.invokeTask = function (task, target, args) { if (!task) { task = this; } _numberOfNestedTaskFrames++; try { task.runCount++; return task.zone.runTask(task, target, args); } finally { if (_numberOfNestedTaskFrames == 1) { drainMicroTaskQueue(); } _numberOfNestedTaskFrames--; } }; Object.defineProperty(ZoneTask.prototype, "zone", { get: function () { return this._zone; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneTask.prototype, "state", { get: function () { return this._state; }, enumerable: false, configurable: true }); ZoneTask.prototype.cancelScheduleRequest = function () { this._transitionTo(notScheduled, scheduling); }; ZoneTask.prototype._transitionTo = function (toState, fromState1, fromState2) { if (this._state === fromState1 || this._state === fromState2) { this._state = toState; if (toState == notScheduled) { this._zoneDelegates = null; } } else { throw new Error("".concat(this.type, " '").concat(this.source, "': can not transition to '").concat(toState, "', expecting state '").concat(fromState1, "'").concat(fromState2 ? " or '" + fromState2 + "'" : '', ", was '").concat(this._state, "'.")); } }; ZoneTask.prototype.toString = function () { if (this.data && typeof this.data.handleId !== 'undefined') { return this.data.handleId.toString(); } else { return Object.prototype.toString.call(this); } }; // add toJSON method to prevent cyclic error when // call JSON.stringify(zoneTask) ZoneTask.prototype.toJSON = function () { return { type: this.type, state: this.state, source: this.source, zone: this.zone.name, runCount: this.runCount, }; }; return ZoneTask; }()); ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// MICROTASK QUEUE ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// var symbolSetTimeout = __symbol__('setTimeout'); var symbolPromise = __symbol__('Promise'); var symbolThen = __symbol__('then'); var _microTaskQueue = []; var _isDrainingMicrotaskQueue = false; var nativeMicroTaskQueuePromise; function nativeScheduleMicroTask(func) { if (!nativeMicroTaskQueuePromise) { if (global[symbolPromise]) { nativeMicroTaskQueuePromise = global[symbolPromise].resolve(0); } } if (nativeMicroTaskQueuePromise) { var nativeThen = nativeMicroTaskQueuePromise[symbolThen]; if (!nativeThen) { // native Promise is not patchable, we need to use `then` directly // issue 1078 nativeThen = nativeMicroTaskQueuePromise['then']; } nativeThen.call(nativeMicroTaskQueuePromise, func); } else { global[symbolSetTimeout](func, 0); } } function scheduleMicroTask(task) { // if we are not running in any task, and there has not been anything scheduled // we must bootstrap the initial task creation by manually scheduling the drain if (_numberOfNestedTaskFrames === 0 && _microTaskQueue.length === 0) { // We are not running in Task, so we need to kickstart the microtask queue. nativeScheduleMicroTask(drainMicroTaskQueue); } task && _microTaskQueue.push(task); } function drainMicroTaskQueue() { if (!_isDrainingMicrotaskQueue) { _isDrainingMicrotaskQueue = true; while (_microTaskQueue.length) { var queue = _microTaskQueue; _microTaskQueue = []; for (var i = 0; i < queue.length; i++) { var task = queue[i]; try { task.zone.runTask(task, null, null); } catch (error) { _api.onUnhandledError(error); } } } _api.microtaskDrainDone(); _isDrainingMicrotaskQueue = false; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// BOOTSTRAP ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// var NO_ZONE = { name: 'NO ZONE' }; var notScheduled = 'notScheduled', scheduling = 'scheduling', scheduled = 'scheduled', running = 'running', canceling = 'canceling', unknown = 'unknown'; var microTask = 'microTask', macroTask = 'macroTask', eventTask = 'eventTask'; var patches = {}; var _api = { symbol: __symbol__, currentZoneFrame: function () { return _currentZoneFrame; }, onUnhandledError: noop, microtaskDrainDone: noop, scheduleMicroTask: scheduleMicroTask, showUncaughtError: function () { return !ZoneImpl[__symbol__('ignoreConsoleErrorUncaughtError')]; }, patchEventTarget: function () { return []; }, patchOnProperties: noop, patchMethod: function () { return noop; }, bindArguments: function () { return []; }, patchThen: function () { return noop; }, patchMacroTask: function () { return noop; }, patchEventPrototype: function () { return noop; }, isIEOrEdge: function () { return false; }, getGlobalObjects: function () { return undefined; }, ObjectDefineProperty: function () { return noop; }, ObjectGetOwnPropertyDescriptor: function () { return undefined; }, ObjectCreate: function () { return undefined; }, ArraySlice: function () { return []; }, patchClass: function () { return noop; }, wrapWithCurrentZone: function () { return noop; }, filterProperties: function () { return []; }, attachOriginToPatched: function () { return noop; }, _redefineProperty: function () { return noop; }, patchCallbacks: function () { return noop; }, nativeScheduleMicroTask: nativeScheduleMicroTask, }; var _currentZoneFrame = { parent: null, zone: new ZoneImpl(null, null) }; var _currentTask = null; var _numberOfNestedTaskFrames = 0; function noop() { } performanceMeasure('Zone', 'Zone'); return ZoneImpl; } function loadZone() { var _a; // if global['Zone'] already exists (maybe zone.js was already loaded or // some other lib also registered a global object named Zone), we may need // to throw an error, but sometimes user may not want this error. // For example, // we have two web pages, page1 includes zone.js, page2 doesn't. // and the 1st time user load page1 and page2, everything work fine, // but when user load page2 again, error occurs because global['Zone'] already exists. // so we add a flag to let user choose whether to throw this error or not. // By default, if existing Zone is from zone.js, we will not throw the error. var global = globalThis; var checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (global['Zone'] && (checkDuplicate || typeof global['Zone'].__symbol__ !== 'function')) { throw new Error('Zone already loaded.'); } // Initialize global `Zone` constant. (_a = global['Zone']) !== null && _a !== void 0 ? _a : (global['Zone'] = initZone()); return global['Zone']; } /** * Suppress closure compiler errors about unknown 'Zone' variable * @fileoverview * @suppress {undefinedVars,globalThis,missingRequire} */ /// // issue #989, to reduce bundle size, use short name /** Object.getOwnPropertyDescriptor */ var ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; /** Object.defineProperty */ var ObjectDefineProperty = Object.defineProperty; /** Object.getPrototypeOf */ var ObjectGetPrototypeOf = Object.getPrototypeOf; /** Object.create */ var ObjectCreate = Object.create; /** Array.prototype.slice */ var ArraySlice = Array.prototype.slice; /** addEventListener string const */ var ADD_EVENT_LISTENER_STR = 'addEventListener'; /** removeEventListener string const */ var REMOVE_EVENT_LISTENER_STR = 'removeEventListener'; /** zoneSymbol addEventListener */ var ZONE_SYMBOL_ADD_EVENT_LISTENER = __symbol__(ADD_EVENT_LISTENER_STR); /** zoneSymbol removeEventListener */ var ZONE_SYMBOL_REMOVE_EVENT_LISTENER = __symbol__(REMOVE_EVENT_LISTENER_STR); /** true string const */ var TRUE_STR = 'true'; /** false string const */ var FALSE_STR = 'false'; /** Zone symbol prefix string const. */ var ZONE_SYMBOL_PREFIX = __symbol__(''); function wrapWithCurrentZone(callback, source) { return Zone.current.wrap(callback, source); } function scheduleMacroTaskWithCurrentZone(source, callback, data, customSchedule, customCancel) { return Zone.current.scheduleMacroTask(source, callback, data, customSchedule, customCancel); } var zoneSymbol = __symbol__; var isWindowExists = typeof window !== 'undefined'; var internalWindow = isWindowExists ? window : undefined; var _global = (isWindowExists && internalWindow) || globalThis; var REMOVE_ATTRIBUTE = 'removeAttribute'; function bindArguments(args, source) { for (var i = args.length - 1; i >= 0; i--) { if (typeof args[i] === 'function') { args[i] = wrapWithCurrentZone(args[i], source + '_' + i); } } return args; } function patchPrototype(prototype, fnNames) { var source = prototype.constructor['name']; var _loop_1 = function (i) { var name_1 = fnNames[i]; var delegate = prototype[name_1]; if (delegate) { var prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, name_1); if (!isPropertyWritable(prototypeDesc)) { return "continue"; } prototype[name_1] = (function (delegate) { var patched = function () { return delegate.apply(this, bindArguments(arguments, source + '.' + name_1)); }; attachOriginToPatched(patched, delegate); return patched; })(delegate); } }; for (var i = 0; i < fnNames.length; i++) { _loop_1(i); } } function isPropertyWritable(propertyDesc) { if (!propertyDesc) { return true; } if (propertyDesc.writable === false) { return false; } return !(typeof propertyDesc.get === 'function' && typeof propertyDesc.set === 'undefined'); } var isWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope; // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. var isNode = !('nw' in _global) && typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]'; var isBrowser = !isNode && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); // we are in electron of nw, so we are both browser and nodejs // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. var isMix = typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]' && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); var zoneSymbolEventNames$1 = {}; var enableBeforeunloadSymbol = zoneSymbol('enable_beforeunload'); var wrapFn = function (event) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } var eventNameSymbol = zoneSymbolEventNames$1[event.type]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[event.type] = zoneSymbol('ON_PROPERTY' + event.type); } var target = this || event.target || _global; var listener = target[eventNameSymbol]; var result; if (isBrowser && target === internalWindow && event.type === 'error') { // window.onerror have different signature // https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror#window.onerror // and onerror callback will prevent default when callback return true var errorEvent = event; result = listener && listener.call(this, errorEvent.message, errorEvent.filename, errorEvent.lineno, errorEvent.colno, errorEvent.error); if (result === true) { event.preventDefault(); } } else { result = listener && listener.apply(this, arguments); if ( // https://github.com/angular/angular/issues/47579 // https://www.w3.org/TR/2011/WD-html5-20110525/history.html#beforeunloadevent // This is the only specific case we should check for. The spec defines that the // `returnValue` attribute represents the message to show the user. When the event // is created, this attribute must be set to the empty string. event.type === 'beforeunload' && // To prevent any breaking changes resulting from this change, given that // it was already causing a significant number of failures in G3, we have hidden // that behavior behind a global configuration flag. Consumers can enable this // flag explicitly if they want the `beforeunload` event to be handled as defined // in the specification. _global[enableBeforeunloadSymbol] && // The IDL event definition is `attribute DOMString returnValue`, so we check whether // `typeof result` is a string. typeof result === 'string') { event.returnValue = result; } else if (result != undefined && !result) { event.preventDefault(); } } return result; }; function patchProperty(obj, prop, prototype) { var desc = ObjectGetOwnPropertyDescriptor(obj, prop); if (!desc && prototype) { // when patch window object, use prototype to check prop exist or not var prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, prop); if (prototypeDesc) { desc = { enumerable: true, configurable: true }; } } // if the descriptor not exists or is not configurable // just return if (!desc || !desc.configurable) { return; } var onPropPatchedSymbol = zoneSymbol('on' + prop + 'patched'); if (obj.hasOwnProperty(onPropPatchedSymbol) && obj[onPropPatchedSymbol]) { return; } // A property descriptor cannot have getter/setter and be writable // deleting the writable and value properties avoids this error: // // TypeError: property descriptors must not specify a value or be writable when a // getter or setter has been specified delete desc.writable; delete desc.value; var originalDescGet = desc.get; var originalDescSet = desc.set; // slice(2) cuz 'onclick' -> 'click', etc var eventName = prop.slice(2); var eventNameSymbol = zoneSymbolEventNames$1[eventName]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[eventName] = zoneSymbol('ON_PROPERTY' + eventName); } desc.set = function (newValue) { // In some versions of Windows, the `this` context may be undefined // in on-property callbacks. // To handle this edge case, we check if `this` is falsy and // fallback to `_global` if needed. var target = this; if (!target && obj === _global) { target = _global; } if (!target) { return; } var previousValue = target[eventNameSymbol]; if (typeof previousValue === 'function') { target.removeEventListener(eventName, wrapFn); } // https://github.com/angular/zone.js/issues/978 // If an inline handler (like `onload`) was defined before zone.js was loaded, // call the original descriptor's setter to clean it up. originalDescSet === null || originalDescSet === void 0 ? void 0 : originalDescSet.call(target, null); target[eventNameSymbol] = newValue; if (typeof newValue === 'function') { target.addEventListener(eventName, wrapFn, false); } }; // The getter would return undefined for unassigned properties but the default value of an // unassigned property is null desc.get = function () { // in some of windows's onproperty callback, this is undefined // so we need to check it var target = this; if (!target && obj === _global) { target = _global; } if (!target) { return null; } var listener = target[eventNameSymbol]; if (listener) { return listener; } else if (originalDescGet) { // result will be null when use inline event attribute, // such as // because the onclick function is internal raw uncompiled handler // the onclick will be evaluated when first time event was triggered or // the property is accessed, https://github.com/angular/zone.js/issues/525 // so we should use original native get to retrieve the handler var value = originalDescGet.call(this); if (value) { desc.set.call(this, value); if (typeof target[REMOVE_ATTRIBUTE] === 'function') { target.removeAttribute(prop); } return value; } } return null; }; ObjectDefineProperty(obj, prop, desc); obj[onPropPatchedSymbol] = true; } function patchOnProperties(obj, properties, prototype) { if (properties) { for (var i = 0; i < properties.length; i++) { patchProperty(obj, 'on' + properties[i], prototype); } } else { var onProperties = []; for (var prop in obj) { if (prop.slice(0, 2) == 'on') { onProperties.push(prop); } } for (var j = 0; j < onProperties.length; j++) { patchProperty(obj, onProperties[j], prototype); } } } var originalInstanceKey = zoneSymbol('originalInstance'); // wrap some native API on `window` function patchClass(className) { var OriginalClass = _global[className]; if (!OriginalClass) return; // keep original class in global _global[zoneSymbol(className)] = OriginalClass; _global[className] = function () { var a = bindArguments(arguments, className); switch (a.length) { case 0: this[originalInstanceKey] = new OriginalClass(); break; case 1: this[originalInstanceKey] = new OriginalClass(a[0]); break; case 2: this[originalInstanceKey] = new OriginalClass(a[0], a[1]); break; case 3: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2]); break; case 4: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2], a[3]); break; default: throw new Error('Arg list too long.'); } }; // attach original delegate to patched function attachOriginToPatched(_global[className], OriginalClass); var instance = new OriginalClass(function () { }); var prop; for (prop in instance) { // https://bugs.webkit.org/show_bug.cgi?id=44721 if (className === 'XMLHttpRequest' && prop === 'responseBlob') continue; (function (prop) { if (typeof instance[prop] === 'function') { _global[className].prototype[prop] = function () { return this[originalInstanceKey][prop].apply(this[originalInstanceKey], arguments); }; } else { ObjectDefineProperty(_global[className].prototype, prop, { set: function (fn) { if (typeof fn === 'function') { this[originalInstanceKey][prop] = wrapWithCurrentZone(fn, className + '.' + prop); // keep callback in wrapped function so we can // use it in Function.prototype.toString to return // the native one. attachOriginToPatched(this[originalInstanceKey][prop], fn); } else { this[originalInstanceKey][prop] = fn; } }, get: function () { return this[originalInstanceKey][prop]; }, }); } })(prop); } for (prop in OriginalClass) { if (prop !== 'prototype' && OriginalClass.hasOwnProperty(prop)) { _global[className][prop] = OriginalClass[prop]; } } } function patchMethod(target, name, patchFn) { var proto = target; while (proto && !proto.hasOwnProperty(name)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && target[name]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = target; } var delegateName = zoneSymbol(name); var delegate = null; if (proto && (!(delegate = proto[delegateName]) || !proto.hasOwnProperty(delegateName))) { delegate = proto[delegateName] = proto[name]; // check whether proto[name] is writable // some property is readonly in safari, such as HtmlCanvasElement.prototype.toBlob var desc = proto && ObjectGetOwnPropertyDescriptor(proto, name); if (isPropertyWritable(desc)) { var patchDelegate_1 = patchFn(delegate, delegateName, name); proto[name] = function () { return patchDelegate_1(this, arguments); }; attachOriginToPatched(proto[name], delegate); } } return delegate; } // TODO: @JiaLiPassion, support cancel task later if necessary function patchMacroTask(obj, funcName, metaCreator) { var setNative = null; function scheduleTask(task) { var data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, function (delegate) { return function (self, args) { var meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return scheduleMacroTaskWithCurrentZone(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }; }); } function attachOriginToPatched(patched, original) { patched[zoneSymbol('OriginalDelegate')] = original; } var isDetectedIEOrEdge = false; var ieOrEdge = false; function isIEOrEdge() { if (isDetectedIEOrEdge) { return ieOrEdge; } isDetectedIEOrEdge = true; try { var ua = internalWindow.navigator.userAgent; if (ua.indexOf('MSIE ') !== -1 || ua.indexOf('Trident/') !== -1 || ua.indexOf('Edge/') !== -1) { ieOrEdge = true; } } catch (error) { } return ieOrEdge; } function isFunction(value) { return typeof value === 'function'; } function isNumber(value) { return typeof value === 'number'; } /** * @fileoverview * @suppress {missingRequire} */ // an identifier to tell ZoneTask do not create a new invoke closure var OPTIMIZED_ZONE_EVENT_TASK_DATA = { useG: true, }; var zoneSymbolEventNames = {}; var globalSources = {}; var EVENT_NAME_SYMBOL_REGX = new RegExp('^' + ZONE_SYMBOL_PREFIX + '(\\w+)(true|false)$'); var IMMEDIATE_PROPAGATION_SYMBOL = zoneSymbol('propagationStopped'); function prepareEventNames(eventName, eventNameToString) { var falseEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + FALSE_STR; var trueEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + TRUE_STR; var symbol = ZONE_SYMBOL_PREFIX + falseEventName; var symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } function patchEventTarget(_global, api, apis, patchOptions) { var ADD_EVENT_LISTENER = (patchOptions && patchOptions.add) || ADD_EVENT_LISTENER_STR; var REMOVE_EVENT_LISTENER = (patchOptions && patchOptions.rm) || REMOVE_EVENT_LISTENER_STR; var LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.listeners) || 'eventListeners'; var REMOVE_ALL_LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.rmAll) || 'removeAllListeners'; var zoneSymbolAddEventListener = zoneSymbol(ADD_EVENT_LISTENER); var ADD_EVENT_LISTENER_SOURCE = '.' + ADD_EVENT_LISTENER + ':'; var PREPEND_EVENT_LISTENER = 'prependListener'; var PREPEND_EVENT_LISTENER_SOURCE = '.' + PREPEND_EVENT_LISTENER + ':'; var invokeTask = function (task, target, event) { // for better performance, check isRemoved which is set // by removeEventListener if (task.isRemoved) { return; } var delegate = task.callback; if (typeof delegate === 'object' && delegate.handleEvent) { // create the bind version of handleEvent when invoke task.callback = function (event) { return delegate.handleEvent(event); }; task.originalDelegate = delegate; } // invoke static task.invoke // need to try/catch error here, otherwise, the error in one event listener // will break the executions of the other event listeners. Also error will // not remove the event listener when `once` options is true. var error; try { task.invoke(task, target, [event]); } catch (err) { error = err; } var options = task.options; if (options && typeof options === 'object' && options.once) { // if options.once is true, after invoke once remove listener here // only browser need to do this, nodejs eventEmitter will cal removeListener // inside EventEmitter.once var delegate_1 = task.originalDelegate ? task.originalDelegate : task.callback; target[REMOVE_EVENT_LISTENER].call(target, event.type, delegate_1, options); } return error; }; function globalCallback(context, event, isCapture) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } // event.target is needed for Samsung TV and SourceBuffer // || global is needed https://github.com/angular/zone.js/issues/190 var target = context || event.target || _global; var tasks = target[zoneSymbolEventNames[event.type][isCapture ? TRUE_STR : FALSE_STR]]; if (tasks) { var errors = []; // invoke all tasks which attached to current target with given event.type and capture = false // for performance concern, if task.length === 1, just invoke if (tasks.length === 1) { var err = invokeTask(tasks[0], target, event); err && errors.push(err); } else { // https://github.com/angular/zone.js/issues/836 // copy the tasks array before invoke, to avoid // the callback will remove itself or other listener var copyTasks = tasks.slice(); for (var i = 0; i < copyTasks.length; i++) { if (event && event[IMMEDIATE_PROPAGATION_SYMBOL] === true) { break; } var err = invokeTask(copyTasks[i], target, event); err && errors.push(err); } } // Since there is only one error, we don't need to schedule microTask // to throw the error. if (errors.length === 1) { throw errors[0]; } else { var _loop_2 = function (i) { var err = errors[i]; api.nativeScheduleMicroTask(function () { throw err; }); }; for (var i = 0; i < errors.length; i++) { _loop_2(i); } } } } // global shared zoneAwareCallback to handle all event callback with capture = false var globalZoneAwareCallback = function (event) { return globalCallback(this, event, false); }; // global shared zoneAwareCallback to handle all event callback with capture = true var globalZoneAwareCaptureCallback = function (event) { return globalCallback(this, event, true); }; function patchEventTargetMethods(obj, patchOptions) { if (!obj) { return false; } var useGlobalCallback = true; if (patchOptions && patchOptions.useG !== undefined) { useGlobalCallback = patchOptions.useG; } var validateHandler = patchOptions && patchOptions.vh; var checkDuplicate = true; if (patchOptions && patchOptions.chkDup !== undefined) { checkDuplicate = patchOptions.chkDup; } var returnTarget = false; if (patchOptions && patchOptions.rt !== undefined) { returnTarget = patchOptions.rt; } var proto = obj; while (proto && !proto.hasOwnProperty(ADD_EVENT_LISTENER)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && obj[ADD_EVENT_LISTENER]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = obj; } if (!proto) { return false; } if (proto[zoneSymbolAddEventListener]) { return false; } var eventNameToString = patchOptions && patchOptions.eventNameToString; // We use a shared global `taskData` to pass data for `scheduleEventTask`, // eliminating the need to create a new object solely for passing data. // WARNING: This object has a static lifetime, meaning it is not created // each time `addEventListener` is called. It is instantiated only once // and captured by reference inside the `addEventListener` and // `removeEventListener` functions. Do not add any new properties to this // object, as doing so would necessitate maintaining the information // between `addEventListener` calls. var taskData = {}; var nativeAddEventListener = (proto[zoneSymbolAddEventListener] = proto[ADD_EVENT_LISTENER]); var nativeRemoveEventListener = (proto[zoneSymbol(REMOVE_EVENT_LISTENER)] = proto[REMOVE_EVENT_LISTENER]); var nativeListeners = (proto[zoneSymbol(LISTENERS_EVENT_LISTENER)] = proto[LISTENERS_EVENT_LISTENER]); var nativeRemoveAllListeners = (proto[zoneSymbol(REMOVE_ALL_LISTENERS_EVENT_LISTENER)] = proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER]); var nativePrependEventListener; if (patchOptions && patchOptions.prepend) { nativePrependEventListener = proto[zoneSymbol(patchOptions.prepend)] = proto[patchOptions.prepend]; } /** * This util function will build an option object with passive option * to handle all possible input from the user. */ function buildEventListenerOptions(options, passive) { if (!passive) { return options; } if (typeof options === 'boolean') { return { capture: options, passive: true }; } if (!options) { return { passive: true }; } if (typeof options === 'object' && options.passive !== false) { return __assign(__assign({}, options), { passive: true }); } return options; } var customScheduleGlobal = function (task) { // if there is already a task for the eventName + capture, // just return, because we use the shared globalZoneAwareCallback here. if (taskData.isExisting) { return; } return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options); }; /** * In the context of events and listeners, this function will be * called at the end by `cancelTask`, which, in turn, calls `task.cancelFn`. * Cancelling a task is primarily used to remove event listeners from * the task target. */ var customCancelGlobal = function (task) { // if task is not marked as isRemoved, this call is directly // from Zone.prototype.cancelTask, we should remove the task // from tasksList of target first if (!task.isRemoved) { var symbolEventNames = zoneSymbolEventNames[task.eventName]; var symbolEventName = void 0; if (symbolEventNames) { symbolEventName = symbolEventNames[task.capture ? TRUE_STR : FALSE_STR]; } var existingTasks = symbolEventName && task.target[symbolEventName]; if (existingTasks) { for (var i = 0; i < existingTasks.length; i++) { var existingTask = existingTasks[i]; if (existingTask === task) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check task.isRemoved = true; if (task.removeAbortListener) { task.removeAbortListener(); task.removeAbortListener = null; } if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target task.allRemoved = true; task.target[symbolEventName] = null; } break; } } } } // if all tasks for the eventName + capture have gone, // we will really remove the global event callback, // if not, return if (!task.allRemoved) { return; } return nativeRemoveEventListener.call(task.target, task.eventName, task.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, task.options); }; var customScheduleNonGlobal = function (task) { return nativeAddEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; var customSchedulePrepend = function (task) { return nativePrependEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; var customCancelNonGlobal = function (task) { return nativeRemoveEventListener.call(task.target, task.eventName, task.invoke, task.options); }; var customSchedule = useGlobalCallback ? customScheduleGlobal : customScheduleNonGlobal; var customCancel = useGlobalCallback ? customCancelGlobal : customCancelNonGlobal; var compareTaskCallbackVsDelegate = function (task, delegate) { var typeOfDelegate = typeof delegate; return ((typeOfDelegate === 'function' && task.callback === delegate) || (typeOfDelegate === 'object' && task.originalDelegate === delegate)); }; var compare = (patchOptions === null || patchOptions === void 0 ? void 0 : patchOptions.diff) || compareTaskCallbackVsDelegate; var unpatchedEvents = Zone[zoneSymbol('UNPATCHED_EVENTS')]; var passiveEvents = _global[zoneSymbol('PASSIVE_EVENTS')]; function copyEventListenerOptions(options) { if (typeof options === 'object' && options !== null) { // We need to destructure the target `options` object since it may // be frozen or sealed (possibly provided implicitly by a third-party // library), or its properties may be readonly. var newOptions = __assign({}, options); // The `signal` option was recently introduced, which caused regressions in // third-party scenarios where `AbortController` was directly provided to // `addEventListener` as options. For instance, in cases like // `document.addEventListener('keydown', callback, abortControllerInstance)`, // which is valid because `AbortController` includes a `signal` getter, spreading // `{...options}` wouldn't copy the `signal`. Additionally, using `Object.create` // isn't feasible since `AbortController` is a built-in object type, and attempting // to create a new object directly with it as the prototype might result in // unexpected behavior. if (options.signal) { newOptions.signal = options.signal; } return newOptions; } return options; } var makeAddListener = function (nativeListener, addSource, customScheduleFn, customCancelFn, returnTarget, prepend) { if (returnTarget === void 0) { returnTarget = false; } if (prepend === void 0) { prepend = false; } return function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var delegate = arguments[1]; if (!delegate) { return nativeListener.apply(this, arguments); } if (isNode && eventName === 'uncaughtException') { // don't patch uncaughtException of nodejs to prevent endless loop return nativeListener.apply(this, arguments); } // To improve `addEventListener` performance, we will create the callback // for the task later when the task is invoked. var isEventListenerObject = false; if (typeof delegate !== 'function') { // This checks whether the provided listener argument is an object with // a `handleEvent` method (since we can call `addEventListener` with a // function `event => ...` or with an object `{ handleEvent: event => ... }`). if (!delegate.handleEvent) { return nativeListener.apply(this, arguments); } isEventListenerObject = true; } if (validateHandler && !validateHandler(nativeListener, delegate, target, arguments)) { return; } var passive = !!passiveEvents && passiveEvents.indexOf(eventName) !== -1; var options = copyEventListenerOptions(buildEventListenerOptions(arguments[2], passive)); var signal = options === null || options === void 0 ? void 0 : options.signal; if (signal === null || signal === void 0 ? void 0 : signal.aborted) { // the signal is an aborted one, just return without attaching the event listener. return; } if (unpatchedEvents) { // check unpatched list for (var i = 0; i < unpatchedEvents.length; i++) { if (eventName === unpatchedEvents[i]) { if (passive) { return nativeListener.call(target, eventName, delegate, options); } else { return nativeListener.apply(this, arguments); } } } } var capture = !options ? false : typeof options === 'boolean' ? true : options.capture; var once = options && typeof options === 'object' ? options.once : false; var zone = Zone.current; var symbolEventNames = zoneSymbolEventNames[eventName]; if (!symbolEventNames) { prepareEventNames(eventName, eventNameToString); symbolEventNames = zoneSymbolEventNames[eventName]; } var symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; var existingTasks = target[symbolEventName]; var isExisting = false; if (existingTasks) { // already have task registered isExisting = true; if (checkDuplicate) { for (var i = 0; i < existingTasks.length; i++) { if (compare(existingTasks[i], delegate)) { // same callback, same capture, same event name, just return return; } } } } else { existingTasks = target[symbolEventName] = []; } var source; var constructorName = target.constructor['name']; var targetSource = globalSources[constructorName]; if (targetSource) { source = targetSource[eventName]; } if (!source) { source = constructorName + addSource + (eventNameToString ? eventNameToString(eventName) : eventName); } // In the code below, `options` should no longer be reassigned; instead, it // should only be mutated. This is because we pass that object to the native // `addEventListener`. // It's generally recommended to use the same object reference for options. // This ensures consistency and avoids potential issues. taskData.options = options; if (once) { // When using `addEventListener` with the `once` option, we don't pass // the `once` option directly to the native `addEventListener` method. // Instead, we keep the `once` setting and handle it ourselves. taskData.options.once = false; } taskData.target = target; taskData.capture = capture; taskData.eventName = eventName; taskData.isExisting = isExisting; var data = useGlobalCallback ? OPTIMIZED_ZONE_EVENT_TASK_DATA : undefined; // keep taskData into data to allow onScheduleEventTask to access the task information if (data) { data.taskData = taskData; } if (signal) { // When using `addEventListener` with the `signal` option, we don't pass // the `signal` option directly to the native `addEventListener` method. // Instead, we keep the `signal` setting and handle it ourselves. taskData.options.signal = undefined; } // The `scheduleEventTask` function will ultimately call `customScheduleGlobal`, // which in turn calls the native `addEventListener`. This is why `taskData.options` // is updated before scheduling the task, as `customScheduleGlobal` uses // `taskData.options` to pass it to the native `addEventListener`. var task = zone.scheduleEventTask(source, delegate, data, customScheduleFn, customCancelFn); if (signal) { // after task is scheduled, we need to store the signal back to task.options taskData.options.signal = signal; // Wrapping `task` in a weak reference would not prevent memory leaks. Weak references are // primarily used for preventing strong references cycles. `onAbort` is always reachable // as it's an event listener, so its closure retains a strong reference to the `task`. var onAbort_1 = function () { return task.zone.cancelTask(task); }; nativeListener.call(signal, 'abort', onAbort_1, { once: true }); // We need to remove the `abort` listener when the event listener is going to be removed, // as it creates a closure that captures `task`. This closure retains a reference to the // `task` object even after it goes out of scope, preventing `task` from being garbage // collected. task.removeAbortListener = function () { return signal.removeEventListener('abort', onAbort_1); }; } // should clear taskData.target to avoid memory leak // issue, https://github.com/angular/angular/issues/20442 taskData.target = null; // need to clear up taskData because it is a global object if (data) { data.taskData = null; } // have to save those information to task in case // application may call task.zone.cancelTask() directly if (once) { taskData.options.once = true; } if (typeof task.options !== 'boolean') { // We should save the options on the task (if it's an object) because // we'll be using `task.options` later when removing the event listener // and passing it back to `removeEventListener`. task.options = options; } task.target = target; task.capture = capture; task.eventName = eventName; if (isEventListenerObject) { // save original delegate for compare to check duplicate task.originalDelegate = delegate; } if (!prepend) { existingTasks.push(task); } else { existingTasks.unshift(task); } if (returnTarget) { return target; } }; }; proto[ADD_EVENT_LISTENER] = makeAddListener(nativeAddEventListener, ADD_EVENT_LISTENER_SOURCE, customSchedule, customCancel, returnTarget); if (nativePrependEventListener) { proto[PREPEND_EVENT_LISTENER] = makeAddListener(nativePrependEventListener, PREPEND_EVENT_LISTENER_SOURCE, customSchedulePrepend, customCancel, returnTarget, true); } proto[REMOVE_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var options = arguments[2]; var capture = !options ? false : typeof options === 'boolean' ? true : options.capture; var delegate = arguments[1]; if (!delegate) { return nativeRemoveEventListener.apply(this, arguments); } if (validateHandler && !validateHandler(nativeRemoveEventListener, delegate, target, arguments)) { return; } var symbolEventNames = zoneSymbolEventNames[eventName]; var symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; } var existingTasks = symbolEventName && target[symbolEventName]; // `existingTasks` may not exist if the `addEventListener` was called before // it was patched by zone.js. Please refer to the attached issue for // clarification, particularly after the `if` condition, before calling // the native `removeEventListener`. if (existingTasks) { for (var i = 0; i < existingTasks.length; i++) { var existingTask = existingTasks[i]; if (compare(existingTask, delegate)) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check existingTask.isRemoved = true; if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target existingTask.allRemoved = true; target[symbolEventName] = null; // in the target, we have an event listener which is added by on_property // such as target.onclick = function() {}, so we need to clear this internal // property too if all delegates with capture=false were removed // https:// github.com/angular/angular/issues/31643 // https://github.com/angular/angular/issues/54581 if (!capture && typeof eventName === 'string') { var onPropertySymbol = ZONE_SYMBOL_PREFIX + 'ON_PROPERTY' + eventName; target[onPropertySymbol] = null; } } // In all other conditions, when `addEventListener` is called after being // patched by zone.js, we would always find an event task on the `EventTarget`. // This will trigger `cancelFn` on the `existingTask`, leading to `customCancelGlobal`, // which ultimately removes an event listener and cleans up the abort listener // (if an `AbortSignal` was provided when scheduling a task). existingTask.zone.cancelTask(existingTask); if (returnTarget) { return target; } return; } } } // https://github.com/angular/zone.js/issues/930 // We may encounter a situation where the `addEventListener` was // called on the event target before zone.js is loaded, resulting // in no task being stored on the event target due to its invocation // of the native implementation. In this scenario, we simply need to // invoke the native `removeEventListener`. return nativeRemoveEventListener.apply(this, arguments); }; proto[LISTENERS_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var listeners = []; var tasks = findEventTasks(target, eventNameToString ? eventNameToString(eventName) : eventName); for (var i = 0; i < tasks.length; i++) { var task = tasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; listeners.push(delegate); } return listeners; }; proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER] = function () { var target = this || _global; var eventName = arguments[0]; if (!eventName) { var keys = Object.keys(target); for (var i = 0; i < keys.length; i++) { var prop = keys[i]; var match = EVENT_NAME_SYMBOL_REGX.exec(prop); var evtName = match && match[1]; // in nodejs EventEmitter, removeListener event is // used for monitoring the removeListener call, // so just keep removeListener eventListener until // all other eventListeners are removed if (evtName && evtName !== 'removeListener') { this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, evtName); } } // remove removeListener listener finally this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, 'removeListener'); } else { if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } var symbolEventNames = zoneSymbolEventNames[eventName]; if (symbolEventNames) { var symbolEventName = symbolEventNames[FALSE_STR]; var symbolCaptureEventName = symbolEventNames[TRUE_STR]; var tasks = target[symbolEventName]; var captureTasks = target[symbolCaptureEventName]; if (tasks) { var removeTasks = tasks.slice(); for (var i = 0; i < removeTasks.length; i++) { var task = removeTasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } if (captureTasks) { var removeTasks = captureTasks.slice(); for (var i = 0; i < removeTasks.length; i++) { var task = removeTasks[i]; var delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } } } if (returnTarget) { return this; } }; // for native toString patch attachOriginToPatched(proto[ADD_EVENT_LISTENER], nativeAddEventListener); attachOriginToPatched(proto[REMOVE_EVENT_LISTENER], nativeRemoveEventListener); if (nativeRemoveAllListeners) { attachOriginToPatched(proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER], nativeRemoveAllListeners); } if (nativeListeners) { attachOriginToPatched(proto[LISTENERS_EVENT_LISTENER], nativeListeners); } return true; } var results = []; for (var i = 0; i < apis.length; i++) { results[i] = patchEventTargetMethods(apis[i], patchOptions); } return results; } function findEventTasks(target, eventName) { if (!eventName) { var foundTasks = []; for (var prop in target) { var match = EVENT_NAME_SYMBOL_REGX.exec(prop); var evtName = match && match[1]; if (evtName && (!eventName || evtName === eventName)) { var tasks = target[prop]; if (tasks) { for (var i = 0; i < tasks.length; i++) { foundTasks.push(tasks[i]); } } } } return foundTasks; } var symbolEventName = zoneSymbolEventNames[eventName]; if (!symbolEventName) { prepareEventNames(eventName); symbolEventName = zoneSymbolEventNames[eventName]; } var captureFalseTasks = target[symbolEventName[FALSE_STR]]; var captureTrueTasks = target[symbolEventName[TRUE_STR]]; if (!captureFalseTasks) { return captureTrueTasks ? captureTrueTasks.slice() : []; } else { return captureTrueTasks ? captureFalseTasks.concat(captureTrueTasks) : captureFalseTasks.slice(); } } function patchEventPrototype(global, api) { var Event = global['Event']; if (Event && Event.prototype) { api.patchMethod(Event.prototype, 'stopImmediatePropagation', function (delegate) { return function (self, args) { self[IMMEDIATE_PROPAGATION_SYMBOL] = true; // we need to call the native stopImmediatePropagation // in case in some hybrid application, some part of // application will be controlled by zone, some are not delegate && delegate.apply(self, args); }; }); } } /** * @fileoverview * @suppress {missingRequire} */ function patchQueueMicrotask(global, api) { api.patchMethod(global, 'queueMicrotask', function (delegate) { return function (self, args) { Zone.current.scheduleMicroTask('queueMicrotask', args[0]); }; }); } /** * @fileoverview * @suppress {missingRequire} */ var taskSymbol = zoneSymbol('zoneTask'); function patchTimer(window, setName, cancelName, nameSuffix) { var setNative = null; var clearNative = null; setName += nameSuffix; cancelName += nameSuffix; var tasksByHandleId = {}; function scheduleTask(task) { var data = task.data; data.args[0] = function () { return task.invoke.apply(this, arguments); }; var handleOrId = setNative.apply(window, data.args); // Whlist on Node.js when get can the ID by using `[Symbol.toPrimitive]()` we do // to this so that we do not cause potentally leaks when using `setTimeout` // since this can be periodic when using `.refresh`. if (isNumber(handleOrId)) { data.handleId = handleOrId; } else { data.handle = handleOrId; // On Node.js a timeout and interval can be restarted over and over again by using the `.refresh` method. data.isRefreshable = isFunction(handleOrId.refresh); } return task; } function clearTask(task) { var _a = task.data, handle = _a.handle, handleId = _a.handleId; return clearNative.call(window, handle !== null && handle !== void 0 ? handle : handleId); } setNative = patchMethod(window, setName, function (delegate) { return function (self, args) { var _a; if (isFunction(args[0])) { var options_1 = { isRefreshable: false, isPeriodic: nameSuffix === 'Interval', delay: nameSuffix === 'Timeout' || nameSuffix === 'Interval' ? args[1] || 0 : undefined, args: args, }; var callback_1 = args[0]; args[0] = function timer() { try { return callback_1.apply(this, arguments); } finally { // issue-934, task will be cancelled // even it is a periodic task such as // setInterval // https://github.com/angular/angular/issues/40387 // Cleanup tasksByHandleId should be handled before scheduleTask // Since some zoneSpec may intercept and doesn't trigger // scheduleFn(scheduleTask) provided here. var handle_1 = options_1.handle, handleId_1 = options_1.handleId, isPeriodic_1 = options_1.isPeriodic, isRefreshable_1 = options_1.isRefreshable; if (!isPeriodic_1 && !isRefreshable_1) { if (handleId_1) { // in non-nodejs env, we remove timerId // from local cache delete tasksByHandleId[handleId_1]; } else if (handle_1) { // Node returns complex objects as handleIds // we remove task reference from timer object handle_1[taskSymbol] = null; } } } }; var task_1 = scheduleMacroTaskWithCurrentZone(setName, args[0], options_1, scheduleTask, clearTask); if (!task_1) { return task_1; } // Node.js must additionally support the ref and unref functions. var _b = task_1.data, handleId = _b.handleId, handle = _b.handle, isRefreshable = _b.isRefreshable, isPeriodic = _b.isPeriodic; if (handleId) { // for non nodejs env, we save handleId: task // mapping in local cache for clearTimeout tasksByHandleId[handleId] = task_1; } else if (handle) { // for nodejs env, we save task // reference in timerId Object for clearTimeout handle[taskSymbol] = task_1; if (isRefreshable && !isPeriodic) { var originalRefresh_1 = handle.refresh; handle.refresh = function () { var zone = task_1.zone, state = task_1.state; if (state === 'notScheduled') { task_1._state = 'scheduled'; zone._updateTaskCount(task_1, 1); } else if (state === 'running') { task_1._state = 'scheduling'; } return originalRefresh_1.call(this); }; } } return (_a = handle !== null && handle !== void 0 ? handle : handleId) !== null && _a !== void 0 ? _a : task_1; } else { // cause an error by calling it directly. return delegate.apply(window, args); } }; }); clearNative = patchMethod(window, cancelName, function (delegate) { return function (self, args) { var id = args[0]; var task; if (isNumber(id)) { // non nodejs env. task = tasksByHandleId[id]; delete tasksByHandleId[id]; } else { // nodejs env ?? other environments. task = id === null || id === void 0 ? void 0 : id[taskSymbol]; if (task) { id[taskSymbol] = null; } else { task = id; } } if (task === null || task === void 0 ? void 0 : task.type) { if (task.cancelFn) { // Do not cancel already canceled functions task.zone.cancelTask(task); } } else { // cause an error by calling it directly. delegate.apply(window, args); } }; }); } function patchCustomElements(_global, api) { var _a = api.getGlobalObjects(), isBrowser = _a.isBrowser, isMix = _a.isMix; if ((!isBrowser && !isMix) || !_global['customElements'] || !('customElements' in _global)) { return; } // https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks var callbacks = [ 'connectedCallback', 'disconnectedCallback', 'adoptedCallback', 'attributeChangedCallback', 'formAssociatedCallback', 'formDisabledCallback', 'formResetCallback', 'formStateRestoreCallback', ]; api.patchCallbacks(api, _global.customElements, 'customElements', 'define', callbacks); } function eventTargetPatch(_global, api) { if (Zone[api.symbol('patchEventTarget')]) { // EventTarget is already patched. return; } var _a = api.getGlobalObjects(), eventNames = _a.eventNames, zoneSymbolEventNames = _a.zoneSymbolEventNames, TRUE_STR = _a.TRUE_STR, FALSE_STR = _a.FALSE_STR, ZONE_SYMBOL_PREFIX = _a.ZONE_SYMBOL_PREFIX; // predefine all __zone_symbol__ + eventName + true/false string for (var i = 0; i < eventNames.length; i++) { var eventName = eventNames[i]; var falseEventName = eventName + FALSE_STR; var trueEventName = eventName + TRUE_STR; var symbol = ZONE_SYMBOL_PREFIX + falseEventName; var symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } var EVENT_TARGET = _global['EventTarget']; if (!EVENT_TARGET || !EVENT_TARGET.prototype) { return; } api.patchEventTarget(_global, api, [EVENT_TARGET && EVENT_TARGET.prototype]); return true; } function patchEvent(global, api) { api.patchEventPrototype(global, api); } /** * @fileoverview * @suppress {globalThis} */ function filterProperties(target, onProperties, ignoreProperties) { if (!ignoreProperties || ignoreProperties.length === 0) { return onProperties; } var tip = ignoreProperties.filter(function (ip) { return ip.target === target; }); if (tip.length === 0) { return onProperties; } var targetIgnoreProperties = tip[0].ignoreProperties; return onProperties.filter(function (op) { return targetIgnoreProperties.indexOf(op) === -1; }); } function patchFilteredProperties(target, onProperties, ignoreProperties, prototype) { // check whether target is available, sometimes target will be undefined // because different browser or some 3rd party plugin. if (!target) { return; } var filteredProperties = filterProperties(target, onProperties, ignoreProperties); patchOnProperties(target, filteredProperties, prototype); } /** * Get all event name properties which the event name startsWith `on` * from the target object itself, inherited properties are not considered. */ function getOnEventNames(target) { return Object.getOwnPropertyNames(target) .filter(function (name) { return name.startsWith('on') && name.length > 2; }) .map(function (name) { return name.substring(2); }); } function propertyDescriptorPatch(api, _global) { if (isNode && !isMix) { return; } if (Zone[api.symbol('patchEvents')]) { // events are already been patched by legacy patch. return; } var ignoreProperties = _global['__Zone_ignore_on_properties']; // for browsers that we can patch the descriptor: Chrome & Firefox var patchTargets = []; if (isBrowser) { var internalWindow_1 = window; patchTargets = patchTargets.concat([ 'Document', 'SVGElement', 'Element', 'HTMLElement', 'HTMLBodyElement', 'HTMLMediaElement', 'HTMLFrameSetElement', 'HTMLFrameElement', 'HTMLIFrameElement', 'HTMLMarqueeElement', 'Worker', ]); var ignoreErrorProperties = []; // In older browsers like IE or Edge, event handler properties (e.g., `onclick`) // may not be defined directly on the `window` object but on its prototype (`WindowPrototype`). // To ensure complete coverage, we use the prototype when checking // for and patching these properties. patchFilteredProperties(internalWindow_1, getOnEventNames(internalWindow_1), ignoreProperties ? ignoreProperties.concat(ignoreErrorProperties) : ignoreProperties, ObjectGetPrototypeOf(internalWindow_1)); } patchTargets = patchTargets.concat([ 'XMLHttpRequest', 'XMLHttpRequestEventTarget', 'IDBIndex', 'IDBRequest', 'IDBOpenDBRequest', 'IDBDatabase', 'IDBTransaction', 'IDBCursor', 'WebSocket', ]); for (var i = 0; i < patchTargets.length; i++) { var target = _global[patchTargets[i]]; (target === null || target === void 0 ? void 0 : target.prototype) && patchFilteredProperties(target.prototype, getOnEventNames(target.prototype), ignoreProperties); } } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowser(Zone) { Zone.__load_patch('legacy', function (global) { var legacyPatch = global[Zone.__symbol__('legacyPatch')]; if (legacyPatch) { legacyPatch(); } }); Zone.__load_patch('timers', function (global) { var set = 'set'; var clear = 'clear'; patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); }); Zone.__load_patch('requestAnimationFrame', function (global) { patchTimer(global, 'request', 'cancel', 'AnimationFrame'); patchTimer(global, 'mozRequest', 'mozCancel', 'AnimationFrame'); patchTimer(global, 'webkitRequest', 'webkitCancel', 'AnimationFrame'); }); Zone.__load_patch('blocking', function (global, Zone) { var blockingMethods = ['alert', 'prompt', 'confirm']; for (var i = 0; i < blockingMethods.length; i++) { var name_2 = blockingMethods[i]; patchMethod(global, name_2, function (delegate, symbol, name) { return function (s, args) { return Zone.current.run(delegate, global, args, name); }; }); } }); Zone.__load_patch('EventTarget', function (global, Zone, api) { patchEvent(global, api); eventTargetPatch(global, api); // patch XMLHttpRequestEventTarget's addEventListener/removeEventListener var XMLHttpRequestEventTarget = global['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget && XMLHttpRequestEventTarget.prototype) { api.patchEventTarget(global, api, [XMLHttpRequestEventTarget.prototype]); } }); Zone.__load_patch('MutationObserver', function (global, Zone, api) { patchClass('MutationObserver'); patchClass('WebKitMutationObserver'); }); Zone.__load_patch('IntersectionObserver', function (global, Zone, api) { patchClass('IntersectionObserver'); }); Zone.__load_patch('FileReader', function (global, Zone, api) { patchClass('FileReader'); }); Zone.__load_patch('on_property', function (global, Zone, api) { propertyDescriptorPatch(api, global); }); Zone.__load_patch('customElements', function (global, Zone, api) { patchCustomElements(global, api); }); Zone.__load_patch('XHR', function (global, Zone) { // Treat XMLHttpRequest as a macrotask. patchXHR(global); var XHR_TASK = zoneSymbol('xhrTask'); var XHR_SYNC = zoneSymbol('xhrSync'); var XHR_LISTENER = zoneSymbol('xhrListener'); var XHR_SCHEDULED = zoneSymbol('xhrScheduled'); var XHR_URL = zoneSymbol('xhrURL'); var XHR_ERROR_BEFORE_SCHEDULED = zoneSymbol('xhrErrorBeforeScheduled'); function patchXHR(window) { var XMLHttpRequest = window['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return; } var XMLHttpRequestPrototype = XMLHttpRequest.prototype; function findPendingTask(target) { return target[XHR_TASK]; } var oriAddListener = XMLHttpRequestPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; var oriRemoveListener = XMLHttpRequestPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; if (!oriAddListener) { var XMLHttpRequestEventTarget_1 = window['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget_1) { var XMLHttpRequestEventTargetPrototype = XMLHttpRequestEventTarget_1.prototype; oriAddListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } } var READY_STATE_CHANGE = 'readystatechange'; var SCHEDULED = 'scheduled'; function scheduleTask(task) { var data = task.data; var target = data.target; target[XHR_SCHEDULED] = false; target[XHR_ERROR_BEFORE_SCHEDULED] = false; // remove existing event listener var listener = target[XHR_LISTENER]; if (!oriAddListener) { oriAddListener = target[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = target[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } if (listener) { oriRemoveListener.call(target, READY_STATE_CHANGE, listener); } var newListener = (target[XHR_LISTENER] = function () { if (target.readyState === target.DONE) { // sometimes on some browsers XMLHttpRequest will fire onreadystatechange with // readyState=4 multiple times, so we need to check task state here if (!data.aborted && target[XHR_SCHEDULED] && task.state === SCHEDULED) { // check whether the xhr has registered onload listener // if that is the case, the task should invoke after all // onload listeners finish. // Also if the request failed without response (status = 0), the load event handler // will not be triggered, in that case, we should also invoke the placeholder callback // to close the XMLHttpRequest::send macroTask. // https://github.com/angular/angular/issues/38795 var loadTasks = target[Zone.__symbol__('loadfalse')]; if (target.status !== 0 && loadTasks && loadTasks.length > 0) { var oriInvoke_1 = task.invoke; task.invoke = function () { // need to load the tasks again, because in other // load listener, they may remove themselves var loadTasks = target[Zone.__symbol__('loadfalse')]; for (var i = 0; i < loadTasks.length; i++) { if (loadTasks[i] === task) { loadTasks.splice(i, 1); } } if (!data.aborted && task.state === SCHEDULED) { oriInvoke_1.call(task); } }; loadTasks.push(task); } else { task.invoke(); } } else if (!data.aborted && target[XHR_SCHEDULED] === false) { // error occurs when xhr.send() target[XHR_ERROR_BEFORE_SCHEDULED] = true; } } }); oriAddListener.call(target, READY_STATE_CHANGE, newListener); var storedTask = target[XHR_TASK]; if (!storedTask) { target[XHR_TASK] = task; } sendNative.apply(target, data.args); target[XHR_SCHEDULED] = true; return task; } function placeholderCallback() { } function clearTask(task) { var data = task.data; // Note - ideally, we would call data.target.removeEventListener here, but it's too late // to prevent it from firing. So instead, we store info for the event listener. data.aborted = true; return abortNative.apply(data.target, data.args); } var openNative = patchMethod(XMLHttpRequestPrototype, 'open', function () { return function (self, args) { self[XHR_SYNC] = args[2] == false; self[XHR_URL] = args[1]; return openNative.apply(self, args); }; }); var XMLHTTPREQUEST_SOURCE = 'XMLHttpRequest.send'; var fetchTaskAborting = zoneSymbol('fetchTaskAborting'); var fetchTaskScheduling = zoneSymbol('fetchTaskScheduling'); var sendNative = patchMethod(XMLHttpRequestPrototype, 'send', function () { return function (self, args) { if (Zone.current[fetchTaskScheduling] === true) { // a fetch is scheduling, so we are using xhr to polyfill fetch // and because we already schedule macroTask for fetch, we should // not schedule a macroTask for xhr again return sendNative.apply(self, args); } if (self[XHR_SYNC]) { // if the XHR is sync there is no task to schedule, just execute the code. return sendNative.apply(self, args); } else { var options = { target: self, url: self[XHR_URL], isPeriodic: false, args: args, aborted: false, }; var task = scheduleMacroTaskWithCurrentZone(XMLHTTPREQUEST_SOURCE, placeholderCallback, options, scheduleTask, clearTask); if (self && self[XHR_ERROR_BEFORE_SCHEDULED] === true && !options.aborted && task.state === SCHEDULED) { // xhr request throw error when send // we should invoke task instead of leaving a scheduled // pending macroTask task.invoke(); } } }; }); var abortNative = patchMethod(XMLHttpRequestPrototype, 'abort', function () { return function (self, args) { var task = findPendingTask(self); if (task && typeof task.type == 'string') { // If the XHR has already completed, do nothing. // If the XHR has already been aborted, do nothing. // Fix #569, call abort multiple times before done will cause // macroTask task count be negative number if (task.cancelFn == null || (task.data && task.data.aborted)) { return; } task.zone.cancelTask(task); } else if (Zone.current[fetchTaskAborting] === true) { // the abort is called from fetch polyfill, we need to call native abort of XHR. return abortNative.apply(self, args); } // Otherwise, we are trying to abort an XHR which has not yet been sent, so there is no // task // to cancel. Do nothing. }; }); } }); Zone.__load_patch('geolocation', function (global) { /// GEO_LOCATION if (global['navigator'] && global['navigator'].geolocation) { patchPrototype(global['navigator'].geolocation, ['getCurrentPosition', 'watchPosition']); } }); Zone.__load_patch('PromiseRejectionEvent', function (global, Zone) { // handle unhandled promise rejection function findPromiseRejectionHandler(evtName) { return function (e) { var eventTasks = findEventTasks(global, evtName); eventTasks.forEach(function (eventTask) { // windows has added unhandledrejection event listener // trigger the event listener var PromiseRejectionEvent = global['PromiseRejectionEvent']; if (PromiseRejectionEvent) { var evt = new PromiseRejectionEvent(evtName, { promise: e.promise, reason: e.rejection, }); eventTask.invoke(evt); } }); }; } if (global['PromiseRejectionEvent']) { Zone[zoneSymbol('unhandledPromiseRejectionHandler')] = findPromiseRejectionHandler('unhandledrejection'); Zone[zoneSymbol('rejectionHandledHandler')] = findPromiseRejectionHandler('rejectionhandled'); } }); Zone.__load_patch('queueMicrotask', function (global, Zone, api) { patchQueueMicrotask(global, api); }); } function patchPromise(Zone) { Zone.__load_patch('ZoneAwarePromise', function (global, Zone, api) { var ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; var ObjectDefineProperty = Object.defineProperty; function readableObjectToString(obj) { if (obj && obj.toString === Object.prototype.toString) { var className = obj.constructor && obj.constructor.name; return (className ? className : '') + ': ' + JSON.stringify(obj); } return obj ? obj.toString() : Object.prototype.toString.call(obj); } var __symbol__ = api.symbol; var _uncaughtPromiseErrors = []; var isDisableWrappingUncaughtPromiseRejection = global[__symbol__('DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION')] !== false; var symbolPromise = __symbol__('Promise'); var symbolThen = __symbol__('then'); var creationTrace = '__creationTrace__'; api.onUnhandledError = function (e) { if (api.showUncaughtError()) { var rejection = e && e.rejection; if (rejection) { console.error('Unhandled Promise rejection:', rejection instanceof Error ? rejection.message : rejection, '; Zone:', e.zone.name, '; Task:', e.task && e.task.source, '; Value:', rejection, rejection instanceof Error ? rejection.stack : undefined); } else { console.error(e); } } }; api.microtaskDrainDone = function () { var _loop_3 = function () { var uncaughtPromiseError = _uncaughtPromiseErrors.shift(); try { uncaughtPromiseError.zone.runGuarded(function () { if (uncaughtPromiseError.throwOriginal) { throw uncaughtPromiseError.rejection; } throw uncaughtPromiseError; }); } catch (error) { handleUnhandledRejection(error); } }; while (_uncaughtPromiseErrors.length) { _loop_3(); } }; var UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL = __symbol__('unhandledPromiseRejectionHandler'); function handleUnhandledRejection(e) { api.onUnhandledError(e); try { var handler = Zone[UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL]; if (typeof handler === 'function') { handler.call(this, e); } } catch (err) { } } function isThenable(value) { return value && typeof value.then === 'function'; } function forwardResolution(value) { return value; } function forwardRejection(rejection) { return ZoneAwarePromise.reject(rejection); } var symbolState = __symbol__('state'); var symbolValue = __symbol__('value'); var symbolFinally = __symbol__('finally'); var symbolParentPromiseValue = __symbol__('parentPromiseValue'); var symbolParentPromiseState = __symbol__('parentPromiseState'); var source = 'Promise.then'; var UNRESOLVED = null; var RESOLVED = true; var REJECTED = false; var REJECTED_NO_CATCH = 0; function makeResolver(promise, state) { return function (v) { try { resolvePromise(promise, state, v); } catch (err) { resolvePromise(promise, false, err); } // Do not return value or you will break the Promise spec. }; } var once = function () { var wasCalled = false; return function wrapper(wrappedFunction) { return function () { if (wasCalled) { return; } wasCalled = true; wrappedFunction.apply(null, arguments); }; }; }; var TYPE_ERROR = 'Promise resolved with itself'; var CURRENT_TASK_TRACE_SYMBOL = __symbol__('currentTaskTrace'); // Promise Resolution function resolvePromise(promise, state, value) { var onceWrapper = once(); if (promise === value) { throw new TypeError(TYPE_ERROR); } if (promise[symbolState] === UNRESOLVED) { // should only get value.then once based on promise spec. var then = null; try { if (typeof value === 'object' || typeof value === 'function') { then = value && value.then; } } catch (err) { onceWrapper(function () { resolvePromise(promise, false, err); })(); return promise; } // if (value instanceof ZoneAwarePromise) { if (state !== REJECTED && value instanceof ZoneAwarePromise && value.hasOwnProperty(symbolState) && value.hasOwnProperty(symbolValue) && value[symbolState] !== UNRESOLVED) { clearRejectedNoCatch(value); resolvePromise(promise, value[symbolState], value[symbolValue]); } else if (state !== REJECTED && typeof then === 'function') { try { then.call(value, onceWrapper(makeResolver(promise, state)), onceWrapper(makeResolver(promise, false))); } catch (err) { onceWrapper(function () { resolvePromise(promise, false, err); })(); } } else { promise[symbolState] = state; var queue = promise[symbolValue]; promise[symbolValue] = value; if (promise[symbolFinally] === symbolFinally) { // the promise is generated by Promise.prototype.finally if (state === RESOLVED) { // the state is resolved, should ignore the value // and use parent promise value promise[symbolState] = promise[symbolParentPromiseState]; promise[symbolValue] = promise[symbolParentPromiseValue]; } } // record task information in value when error occurs, so we can // do some additional work such as render longStackTrace if (state === REJECTED && value instanceof Error) { // check if longStackTraceZone is here var trace = Zone.currentTask && Zone.currentTask.data && Zone.currentTask.data[creationTrace]; if (trace) { // only keep the long stack trace into error when in longStackTraceZone ObjectDefineProperty(value, CURRENT_TASK_TRACE_SYMBOL, { configurable: true, enumerable: false, writable: true, value: trace, }); } } for (var i = 0; i < queue.length;) { scheduleResolveOrReject(promise, queue[i++], queue[i++], queue[i++], queue[i++]); } if (queue.length == 0 && state == REJECTED) { promise[symbolState] = REJECTED_NO_CATCH; var uncaughtPromiseError = value; try { // Here we throws a new Error to print more readable error log // and if the value is not an error, zone.js builds an `Error` // Object here to attach the stack information. throw new Error('Uncaught (in promise): ' + readableObjectToString(value) + (value && value.stack ? '\n' + value.stack : '')); } catch (err) { uncaughtPromiseError = err; } if (isDisableWrappingUncaughtPromiseRejection) { // If disable wrapping uncaught promise reject // use the value instead of wrapping it. uncaughtPromiseError.throwOriginal = true; } uncaughtPromiseError.rejection = value; uncaughtPromiseError.promise = promise; uncaughtPromiseError.zone = Zone.current; uncaughtPromiseError.task = Zone.currentTask; _uncaughtPromiseErrors.push(uncaughtPromiseError); api.scheduleMicroTask(); // to make sure that it is running } } } // Resolving an already resolved promise is a noop. return promise; } var REJECTION_HANDLED_HANDLER = __symbol__('rejectionHandledHandler'); function clearRejectedNoCatch(promise) { if (promise[symbolState] === REJECTED_NO_CATCH) { // if the promise is rejected no catch status // and queue.length > 0, means there is a error handler // here to handle the rejected promise, we should trigger // windows.rejectionhandled eventHandler or nodejs rejectionHandled // eventHandler try { var handler = Zone[REJECTION_HANDLED_HANDLER]; if (handler && typeof handler === 'function') { handler.call(this, { rejection: promise[symbolValue], promise: promise }); } } catch (err) { } promise[symbolState] = REJECTED; for (var i = 0; i < _uncaughtPromiseErrors.length; i++) { if (promise === _uncaughtPromiseErrors[i].promise) { _uncaughtPromiseErrors.splice(i, 1); } } } } function scheduleResolveOrReject(promise, zone, chainPromise, onFulfilled, onRejected) { clearRejectedNoCatch(promise); var promiseState = promise[symbolState]; var delegate = promiseState ? typeof onFulfilled === 'function' ? onFulfilled : forwardResolution : typeof onRejected === 'function' ? onRejected : forwardRejection; zone.scheduleMicroTask(source, function () { try { var parentPromiseValue = promise[symbolValue]; var isFinallyPromise = !!chainPromise && symbolFinally === chainPromise[symbolFinally]; if (isFinallyPromise) { // if the promise is generated from finally call, keep parent promise's state and value chainPromise[symbolParentPromiseValue] = parentPromiseValue; chainPromise[symbolParentPromiseState] = promiseState; } // should not pass value to finally callback var value = zone.run(delegate, undefined, isFinallyPromise && delegate !== forwardRejection && delegate !== forwardResolution ? [] : [parentPromiseValue]); resolvePromise(chainPromise, true, value); } catch (error) { // if error occurs, should always return this error resolvePromise(chainPromise, false, error); } }, chainPromise); } var ZONE_AWARE_PROMISE_TO_STRING = 'function ZoneAwarePromise() { [native code] }'; var noop = function () { }; var AggregateError = global.AggregateError; var ZoneAwarePromise = /** @class */ (function () { function ZoneAwarePromise(executor) { var promise = this; if (!(promise instanceof ZoneAwarePromise)) { throw new Error('Must be an instanceof Promise.'); } promise[symbolState] = UNRESOLVED; promise[symbonTlValue] = []; // queue; try { var onceWrapper = once(); executor && executor(onceWrapper(makeResolver(promise, RESOLVED)), onceWrapper(makeResolver(promise, REJECTED))); } catch (error) { resolvePromise(promise, false, error); } } ZoneAwarePromise.toString = function () { return ZONE_AWARE_PROMISE_TO_STRING; }; ZoneAwarePromise.resolve = function (value) { if (value instanceof ZoneAwarePromise) { return value; } return resolvePromise(new this(null), RESOLVED, value); }; ZoneAwarePromise.reject = function (error) { return resolvePromise(new this(null), REJECTED, error); }; ZoneAwarePromise.withResolvers = function () { var result = {}; result.promise = new ZoneAwarePromise(function (res, rej) { result.resolve = res; result.reject = rej; }); return result; }; ZoneAwarePromise.any = function (values) { if (!values || typeof values[Symbol.iterator] !== 'function') { return Promise.reject(new AggregateError([], 'All promises were rejected')); } var promises = []; var count = 0; try { for (var _i = 0, values_1 = values; _i < values_1.length; _i++) { var v = values_1[_i]; count++; promises.push(ZoneAwarePromise.resolve(v)); } } catch (err) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } if (count === 0) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } var finished = false; var errors = []; return new ZoneAwarePromise(function (resolve, reject) { for (var i = 0; i < promises.length; i++) { promises[i].then(function (v) { if (finished) { return; } finished = true; resolve(v); }, function (err) { errors.push(err); count--; if (count === 0) { finished = true; reject(new AggregateError(errors, 'All promises were rejected')); } }); } }); }; ZoneAwarePromise.race = function (values) { var resolve; var reject; var promise = new this(function (res, rej) { resolve = res; reject = rej; }); function onResolve(value) { resolve(value); } function onReject(error) { reject(error); } for (var _i = 0, values_2 = values; _i < values_2.length; _i++) { var value = values_2[_i]; if (!isThenable(value)) { value = this.resolve(value); } value.then(onResolve, onReject); } return promise; }; ZoneAwarePromise.all = function (values) { return ZoneAwarePromise.allWithCallback(values); }; ZoneAwarePromise.allSettled = function (values) { var P = this && this.prototype instanceof ZoneAwarePromise ? this : ZoneAwarePromise; return P.allWithCallback(values, { thenCallback: function (value) { return ({ status: 'fulfilled', value: value }); }, errorCallback: function (err) { return ({ status: 'rejected', reason: err }); }, }); }; ZoneAwarePromise.allWithCallback = function (values, callback) { var resolve; var reject; var promise = new this(function (res, rej) { resolve = res; reject = rej; }); // Start at 2 to prevent prematurely resolving if .then is called immediately. var unresolvedCount = 2; var valueIndex = 0; var resolvedValues = []; var _loop_4 = function (value) { if (!isThenable(value)) { value = this_1.resolve(value); } var curValueIndex = valueIndex; try { value.then(function (value) { resolvedValues[curValueIndex] = callback ? callback.thenCallback(value) : value; unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } }, function (err) { if (!callback) { reject(err); } else { resolvedValues[curValueIndex] = callback.errorCallback(err); unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } } }); } catch (thenErr) { reject(thenErr); } unresolvedCount++; valueIndex++; }; var this_1 = this; for (var _i = 0, values_3 = values; _i < values_3.length; _i++) { var value = values_3[_i]; _loop_4(value); } // Make the unresolvedCount zero-based again. unresolvedCount -= 2; if (unresolvedCount === 0) { resolve(resolvedValues); } return promise; }; Object.defineProperty(ZoneAwarePromise.prototype, Symbol.toStringTag, { get: function () { return 'Promise'; }, enumerable: false, configurable: true }); Object.defineProperty(ZoneAwarePromise.prototype, Symbol.species, { get: function () { return ZoneAwarePromise; }, enumerable: false, configurable: true }); ZoneAwarePromise.prototype.then = function (onFulfilled, onRejected) { var _a; // We must read `Symbol.species` safely because `this` may be anything. For instance, `this` // may be an object without a prototype (created through `Object.create(null)`); thus // `this.constructor` will be undefined. One of the use cases is SystemJS creating // prototype-less objects (modules) via `Object.create(null)`. The SystemJS creates an empty // object and copies promise properties into that object (within the `getOrCreateLoad` // function). The zone.js then checks if the resolved value has the `then` method and // invokes it with the `value` context. Otherwise, this will throw an error: `TypeError: // Cannot read properties of undefined (reading 'Symbol(Symbol.species)')`. var C = (_a = this.constructor) === null || _a === void 0 ? void 0 : _a[Symbol.species]; if (!C || typeof C !== 'function') { C = this.constructor || ZoneAwarePromise; } var chainPromise = new C(noop); var zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFulfilled, onRejected); } else { scheduleResolveOrReject(this, zone, chainPromise, onFulfilled, onRejected); } return chainPromise; }; ZoneAwarePromise.prototype.catch = function (onRejected) { return this.then(null, onRejected); }; ZoneAwarePromise.prototype.finally = function (onFinally) { var _a; // See comment on the call to `then` about why thee `Symbol.species` is safely accessed. var C = (_a = this.constructor) === null || _a === void 0 ? void 0 : _a[Symbol.species]; if (!C || typeof C !== 'function') { C = ZoneAwarePromise; } var chainPromise = new C(noop); chainPromise[symbolFinally] = symbolFinally; var zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFinally, onFinally); } else { scheduleResolveOrReject(this, zone, chainPromise, onFinally, onFinally); } return chainPromise; }; return ZoneAwarePromise; }()); // Protect against aggressive optimizers dropping seemingly unused properties. // E.g. Closure Compiler in advanced mode. ZoneAwarePromise['resolve'] = ZoneAwarePromise.resolve; ZoneAwarePromise['reject'] = ZoneAwarePromise.reject; ZoneAwarePromise['race'] = ZoneAwarePromise.race; ZoneAwarePromise['all'] = ZoneAwarePromise.all; var NativePromise = (global[symbolPromise] = global['Promise']); global['Promise'] = ZoneAwarePromise; var symbolThenPatched = __symbol__('thenPatched'); function patchThen(Ctor) { var proto = Ctor.prototype; var prop = ObjectGetOwnPropertyDescriptor(proto, 'then'); if (prop && (prop.writable === false || !prop.configurable)) { // check Ctor.prototype.then propertyDescriptor is writable or not // in meteor env, writable is false, we should ignore such case return; } var originalThen = proto.then; // Keep a reference to the original method. proto[symbolThen] = originalThen; Ctor.prototype.then = function (onResolve, onReject) { var _this = this; var wrapped = new ZoneAwarePromise(function (resolve, reject) { originalThen.call(_this, resolve, reject); }); return wrapped.then(onResolve, onReject); }; Ctor[symbolThenPatched] = true; } api.patchThen = patchThen; function zoneify(fn) { return function (self, args) { var resultPromise = fn.apply(self, args); if (resultPromise instanceof ZoneAwarePromise) { return resultPromise; } var ctor = resultPromise.constructor; if (!ctor[symbolThenPatched]) { patchThen(ctor); } return resultPromise; }; } if (NativePromise) { patchThen(NativePromise); patchMethod(global, 'fetch', function (delegate) { return zoneify(delegate); }); } // This is not part of public API, but it is useful for tests, so we expose it. Promise[Zone.__symbol__('uncaughtPromiseErrors')] = _uncaughtPromiseErrors; return ZoneAwarePromise; }); } function patchToString(Zone) { // override Function.prototype.toString to make zone.js patched function // look like native function Zone.__load_patch('toString', function (global) { // patch Func.prototype.toString to let them look like native var originalFunctionToString = Function.prototype.toString; var ORIGINAL_DELEGATE_SYMBOL = zoneSymbol('OriginalDelegate'); var PROMISE_SYMBOL = zoneSymbol('Promise'); var ERROR_SYMBOL = zoneSymbol('Error'); var newFunctionToString = function toString() { if (typeof this === 'function') { var originalDelegate = this[ORIGINAL_DELEGATE_SYMBOL]; if (originalDelegate) { if (typeof originalDelegate === 'function') { return originalFunctionToString.call(originalDelegate); } else { return Object.prototype.toString.call(originalDelegate); } } if (this === Promise) { var nativePromise = global[PROMISE_SYMBOL]; if (nativePromise) { return originalFunctionToString.call(nativePromise); } } if (this === Error) { var nativeError = global[ERROR_SYMBOL]; if (nativeError) { return originalFunctionToString.call(nativeError); } } } return originalFunctionToString.call(this); }; newFunctionToString[ORIGINAL_DELEGATE_SYMBOL] = originalFunctionToString; Function.prototype.toString = newFunctionToString; // patch Object.prototype.toString to let them look like native var originalObjectToString = Object.prototype.toString; var PROMISE_OBJECT_TO_STRING = '[object Promise]'; Object.prototype.toString = function () { if (typeof Promise === 'function' && this instanceof Promise) { return PROMISE_OBJECT_TO_STRING; } return originalObjectToString.call(this); }; }); } function patchCallbacks(api, target, targetName, method, callbacks) { var symbol = Zone.__symbol__(method); if (target[symbol]) { return; } var nativeDelegate = (target[symbol] = target[method]); target[method] = function (name, opts, options) { if (opts && opts.prototype) { callbacks.forEach(function (callback) { var source = "".concat(targetName, ".").concat(method, "::") + callback; var prototype = opts.prototype; // Note: the `patchCallbacks` is used for patching the `document.registerElement` and // `customElements.define`. We explicitly wrap the patching code into try-catch since // callbacks may be already patched by other web components frameworks (e.g. LWC), and they // make those properties non-writable. This means that patching callback will throw an error // `cannot assign to read-only property`. See this code as an example: // https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/framework/base-bridge-element.ts#L180-L186 // We don't want to stop the application rendering if we couldn't patch some // callback, e.g. `attributeChangedCallback`. try { if (prototype.hasOwnProperty(callback)) { var descriptor = api.ObjectGetOwnPropertyDescriptor(prototype, callback); if (descriptor && descriptor.value) { descriptor.value = api.wrapWithCurrentZone(descriptor.value, source); api._redefineProperty(opts.prototype, callback, descriptor); } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } catch (_a) { // Note: we leave the catch block empty since there's no way to handle the error related // to non-writable property. } }); } return nativeDelegate.call(target, name, opts, options); }; api.attachOriginToPatched(target[method], nativeDelegate); } function patchUtil(Zone) { Zone.__load_patch('util', function (global, Zone, api) { // Collect native event names by looking at properties // on the global namespace, e.g. 'onclick'. var eventNames = getOnEventNames(global); api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; // In earlier version of zone.js (<0.9.0), we use env name `__zone_symbol__BLACK_LISTED_EVENTS` // to define which events will not be patched by `Zone.js`. In newer version (>=0.9.0), we // change the env name to `__zone_symbol__UNPATCHED_EVENTS` to keep the name consistent with // angular repo. The `__zone_symbol__BLACK_LISTED_EVENTS` is deprecated, but it is still be // supported for backwards compatibility. var SYMBOL_BLACK_LISTED_EVENTS = Zone.__symbol__('BLACK_LISTED_EVENTS'); var SYMBOL_UNPATCHED_EVENTS = Zone.__symbol__('UNPATCHED_EVENTS'); if (global[SYMBOL_UNPATCHED_EVENTS]) { global[SYMBOL_BLACK_LISTED_EVENTS] = global[SYMBOL_UNPATCHED_EVENTS]; } if (global[SYMBOL_BLACK_LISTED_EVENTS]) { Zone[SYMBOL_BLACK_LISTED_EVENTS] = Zone[SYMBOL_UNPATCHED_EVENTS] = global[SYMBOL_BLACK_LISTED_EVENTS]; } api.patchEventPrototype = patchEventPrototype; api.patchEventTarget = patchEventTarget; api.isIEOrEdge = isIEOrEdge; api.ObjectDefineProperty = ObjectDefineProperty; api.ObjectGetOwnPropertyDescriptor = ObjectGetOwnPropertyDescriptor; api.ObjectCreate = ObjectCreate; api.ArraySlice = ArraySlice; api.patchClass = patchClass; api.wrapWithCurrentZone = wrapWithCurrentZone; api.filterProperties = filterProperties; api.attachOriginToPatched = attachOriginToPatched; api._redefineProperty = Object.defineProperty; api.patchCallbacks = patchCallbacks; api.getGlobalObjects = function () { return ({ globalSources: globalSources, zoneSymbolEventNames: zoneSymbolEventNames, eventNames: eventNames, isBrowser: isBrowser, isMix: isMix, isNode: isNode, TRUE_STR: TRUE_STR, FALSE_STR: FALSE_STR, ZONE_SYMBOL_PREFIX: ZONE_SYMBOL_PREFIX, ADD_EVENT_LISTENER_STR: ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR: REMOVE_EVENT_LISTENER_STR, }); }; }); } function patchCommon(Zone) { patchPromise(Zone); patchToString(Zone); patchUtil(Zone); } var Zone$1 = loadZone(); patchCommon(Zone$1); patchBrowser(Zone$1); })); T[x`  ,  (֓"͓ "copySymbolProperties(src, dest) { QObject.getOwnPropertySymbols !a>>Os = Object.getOwnPropertySymbols(src); symbols.forEach(function (symbol1Object.g src, symbol % dest, symbol B src[symbolAset:/(^*desc && (!desc.writable || typeof desc.set "3if src[symbol] is not writable or not have a setter&2 src[symbol]~desc ? desc.enumerable h!desc ? desc.configurable : true, Q4var shouldCopySymbolPropertiesOsetShouldCopySymbolProperties(flag) { shouldCopySymbolProperties = flag!i0OhouldCopySymbolProperti! *copySymbolProperties(delegate, proto[name]a.!d .d/MiQ4l scheduleMicroTask 2// watch, watchFile, unwatchFile has been patched ߰dEventEmitter has been patched var TO_PATCH_MACROTASK_METHODS = [ 'access appendFilechmodchowncloseexistsfchmodfchown fdatasyncfstafsync ftruncatefutimeslchmodlchownlutimeslinklstamkdirmkdtempopenopendirreadreaddirreadFilereadlinkrealpathrenamermdirstasymlinktruncateunlinkutimeswrite writeFile>writev', ]; TO_PATCH_MACROTASK_METHODS+!C!!fs[name] && typeof fs[name] === 'function'; }).forEach(function (P3MacroTask(fs, name,v% n`name: 'fs.' + n`$-cbIdx: args.length > 0 ? args.length - 1 : -11 `%^6,realpathOriginalDelegate = (_a = fs.realpath|'*api.sm; Bmethod that should be additionally patched because the previous // `patchMacroTask` has overridden the `realpath` function and its `native` property. if (realpathOriginalDelegate === null || realpathOriginalDelegate === void 0 ? v$oid 0 : realpathOriginalDelegate.nat3fs.realpath.native = realpathOriginalDelegate.nativP3 MacroTask(fs.realpath, 'native',vpQ` %-cbIdx: args.length > 0 ? args.length - 1 : -11 name: 'fs.realpath.native',  }!SNodeH(node_I2.^ I#setShouldCopySymbolProperties(true)4var set = 'set'; Вa"Node(Zone) { patchNodeUtilSEventsSFs(Zonenode_`0Timers var globalUseTimeoutFromTimeryTimers = require('timers1WAglobalEqualTimersTimeout = global.setTimeout === timers.setTimeouK"globalEqualTimersTimeout && !isMix!<1. if isMix, then we are in mix environment such as Electrona # /only patch timers.setTimeout because global.set+r// have been patch#82. if global.setTimeout not equal timers.setTimeout, che[`-hether global.setTimeout use timers.setTimeou ?r$riginSetTimeout_1 = timers.setTimeou`timers.setTimeoutѷ& >tUseTimeoutFromTimerw@)e.8 SetTimeout_1qd6detectTimeout = global.setTimeout(function () { }, 100clearTimeout(detectTimeout$timers.setTimeout = originSetTimeout`r P3 imer(timers&0P3 imer(timers='0P3 imer(timersu$0#- _xD// timers module not exists, for example, when we using nativeScriptimers is not availableqisMix ,we are in mix environment, such as Electron,-e global.setTimeout has already been patched,"so we just patch timers.setTimeout> if (!globalUseTimeoutFromTime+0// 1. global setTimeout equals timers setTimeoutS2. or global don't use timers setTimeout(maybe some other library patch setTimeout)I3. or load timers module error happens, we should patch global setTimeout?3= ? 0P3= ?%0P3= ?0#U/// global use timers setTimeout, but not equals:is happens when use nodejs v0.10.x, global setTimeout will,use a lazy load version of timers setTimeout#double patch timer's setTimeout/so we only store the __symbol__ for consistency-t1Zone.__symbol__('setTimeout')] = global.setTimeou>t5Zone.__symbol__('setInterval')] = global.setInterval;-t3Zone.__symbol__('setImmediate')] = global.setImmedi@ // patch process related methods nextTick',QM< nextTick as mi!#patchMicroTask(process, 'nextTick',v%0 nname: 'process.nextTick'1  @cbIdx: args.length > 0 && typeof args[0] === 'function' ? 0 : -11 : proces_] handleUnhandledPromiseRejectionP. Zone[api.s=cess) #Rejection'); Zone[api.s[4cess Handled?cessafprocesM!Eproces8|ptName === 'unhandledReje8&  .rejection, e.pa3@)UevtName === 'rejectionHands$  .pa3@) p.p // Cryptocrypto',Qcrypto; "crypto = require('crypto0#-H// use the generic patchMacroTask to patch crypto if (crypto &methodNames = ['randomBytes', 'pbkdf2'methodNames.forEach(function (P3MacroTask(crypto, name,v%Pn@)name: 'crypto.' + n0\cbIdx: args.length > 0 && typeof args[args.length - 1] === 'function' ? args.length - 1 : -11  crypto1 `_)consoleP'consoleMethods = [ 'dirloginfoerrorwarnasserdebugtimeEndEtrace', ]; consoleMethods.forEach(function (m <2Method = (console[Zone.__symbol__(m)] = console[m]!^ originalMethoA` console[mqG"@)args = ArraySlice.call(U ^k === Zone.roo!!e.8Method.apply(this`Uo#e4.root.run(originalMethod, this` d!^ crollupMain() { var Zone = loadZone(); patchNode(Zone); // Node needs to come first.SB4 ; } rollupMain(); })); xp"use strict";var __assign=this&&this.__assign||function(){return __assign=Object.assign||function(e){for(var t,n=1,r=arguments.length;n * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){var e=globalThis;function t(t){return(e.__Zone_symbol_prefix||"__zone_symbol__")+t}function n(){var n=e.performance;function r(e){n&&n.mark&&n.mark(e)}function o(e,t){n&&n.measure&&n.measure(e,t)}r("Zone");var a,i=function(){function n(e,t){this._parent=e,this._name=t?t.name||"unnamed":"",this._properties=t&&t.properties||{},this._zoneDelegate=new c(this,this._parent&&this._parent._zoneDelegate,t)}return n.assertZonePatched=function(){if(e.Promise!==D.ZoneAwarePromise)throw new Error("Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.\nMost likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.)")},Object.defineProperty(n,"root",{get:function(){for(var e=n.current;e.parent;)e=e.parent;return e},enumerable:!1,configurable:!0}),Object.defineProperty(n,"current",{get:function(){return C.zone},enumerable:!1,configurable:!0}),Object.defineProperty(n,"currentTask",{get:function(){return j},enumerable:!1,configurable:!0}),n.__load_patch=function(a,i,s){if(void 0===s&&(s=!1),D.hasOwnProperty(a)){var c=!0===e[t("forceDuplicateZoneCheck")];if(!s&&c)throw Error("Already loaded patch: "+a)}else if(!e["__Zone_disable_"+a]){var u="Zone:"+a;r(u),D[a]=i(e,n,O),o(u,u)}},Object.defineProperty(n.prototype,"parent",{get:function(){return this._parent},enumerable:!1,configurable:!0}),Object.defineProperty(n.prototype,"name",{get:function(){return this._name},enumerable:!1,configurable:!0}),n.prototype.get=function(e){var t=this.getZoneWith(e);if(t)return t._properties[e]},n.prototype.getZoneWith=function(e){for(var t=this;t;){if(t._properties.hasOwnProperty(e))return t;t=t._parent}return null},n.prototype.fork=function(e){if(!e)throw new Error("ZoneSpec required!");return this._zoneDelegate.fork(this,e)},n.prototype.wrap=function(e,t){if("function"!=typeof e)throw new Error("Expecting function got: "+e);var n=this._zoneDelegate.intercept(this,e,t),r=this;return function(){return r.runGuarded(n,this,arguments,t)}},n.prototype.run=function(e,t,n,r){C={parent:C,zone:this};try{return this._zoneDelegate.invoke(this,e,t,n,r)}finally{C=C.parent}},n.prototype.runGuarded=function(e,t,n,r){void 0===t&&(t=null),C={parent:C,zone:this};try{try{return this._zoneDelegate.invoke(this,e,t,n,r)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{C=C.parent}},n.prototype.runTask=function(e,t,n){if(e.zone!=this)throw new Error("A task can only be run in the zone of creation! (Creation: "+(e.zone||k).name+"; Execution: "+this.name+")");var r=e,o=e.type,a=e.data,i=void 0===a?{}:a,s=i.isPeriodic,c=void 0!==s&&s,u=i.isRefreshable,l=void 0!==u&&u;if(e.state!==y||o!==Z&&o!==P){var f=e.state!=b;f&&r._transitionTo(b,m);var h=j;j=r,C={parent:C,zone:this};try{o!=P||!e.data||c||l||(e.cancelFn=void 0);try{return this._zoneDelegate.invokeTask(this,r,t,n)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{var p=e.state;if(p!==y&&p!==w)if(o==Z||c||l&&p===T)f&&r._transitionTo(m,b,T);else{var v=r._zoneDelegates;this._updateTaskCount(r,-1),f&&r._transitionTo(y,b,y),l&&(r._zoneDelegates=v)}C=C.parent,j=h}}},n.prototype.scheduleTask=function(e){if(e.zone&&e.zone!==this)for(var t=this;t;){if(t===e.zone)throw Error("can not reschedule task to ".concat(this.name," which is descendants of the original zone ").concat(e.zone.name));t=t.parent}e._transitionTo(T,y);var n=[];e._zoneDelegates=n,e._zone=this;try{e=this._zoneDelegate.scheduleTask(this,e)}catch(t){throw e._transitionTo(w,T,y),this._zoneDelegate.handleError(this,t),t}return e._zoneDelegates===n&&this._updateTaskCount(e,1),e.state==T&&e._transitionTo(m,T),e},n.prototype.scheduleMicroTask=function(e,t,n,r){return this.scheduleTask(new u(S,e,t,n,r,void 0))},n.prototype.scheduleMacroTask=function(e,t,n,r,o){return this.scheduleTask(new u(P,e,t,n,r,o))},n.prototype.scheduleEventTask=function(e,t,n,r,o){return this.scheduleTask(new u(Z,e,t,n,r,o))},n.prototype.cancelTask=function(e){if(e.zone!=this)throw new Error("A task can only be cancelled in the zone of creation! (Creation: "+(e.zone||k).name+"; Execution: "+this.name+")");if(e.state===m||e.state===b){e._transitionTo(E,m,b);try{this._zoneDelegate.cancelTask(this,e)}catch(t){throw e._transitionTo(w,E),this._zoneDelegate.handleError(this,t),t}return this._updateTaskCount(e,-1),e._transitionTo(y,E),e.runCount=-1,e}},n.prototype._updateTaskCount=function(e,t){var n=e._zoneDelegates;-1==t&&(e._zoneDelegates=null);for(var r=0;r0,macroTask:n.macroTask>0,eventTask:n.eventTask>0,change:e})},e}(),u=function(){function t(n,r,o,a,i,s){if(this._zone=null,this.runCount=0,this._zoneDelegates=null,this._state="notScheduled",this.type=n,this.source=r,this.data=a,this.scheduleFn=i,this.cancelFn=s,!o)throw new Error("callback is not defined");this.callback=o;var c=this;this.invoke=n===Z&&a&&a.useG?t.invokeTask:function(){return t.invokeTask.call(e,c,this,arguments)}}return t.invokeTask=function(e,t,n){e||(e=this),z++;try{return e.runCount++,e.zone.runTask(e,t,n)}finally{1==z&&g(),z--}},Object.defineProperty(t.prototype,"zone",{get:function(){return this._zone},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"state",{get:function(){return this._state},enumerable:!1,configurable:!0}),t.prototype.cancelScheduleRequest=function(){this._transitionTo(y,T)},t.prototype._transitionTo=function(e,t,n){if(this._state!==t&&this._state!==n)throw new Error("".concat(this.type," '").concat(this.source,"': can not transition to '").concat(e,"', expecting state '").concat(t,"'").concat(n?" or '"+n+"'":"",", was '").concat(this._state,"'."));this._state=e,e==y&&(this._zoneDelegates=null)},t.prototype.toString=function(){return this.data&&void 0!==this.data.handleId?this.data.handleId.toString():Object.prototype.toString.call(this)},t.prototype.toJSON=function(){return{type:this.type,state:this.state,source:this.source,zone:this.zone.name,runCount:this.runCount}},t}(),l=t("setTimeout"),f=t("Promise"),h=t("then"),p=[],v=!1;function d(t){if(a||e[f]&&(a=e[f].resolve(0)),a){var n=a[h];n||(n=a.then),n.call(a,t)}else e[l](t,0)}function _(e){0===z&&0===p.length&&d(g),e&&p.push(e)}function g(){if(!v){for(v=!0;p.length;){var e=p;p=[];for(var t=0;t=0;n--)"function"==typeof e[n]&&(e[n]=d(e[n],t+"_"+n));return e}function b(e){return!e||!1!==e.writable&&!("function"==typeof e.get&&void 0===e.set)}var E="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope,w=!("nw"in T)&&void 0!==T.process&&"[object process]"===T.process.toString(),S=!w&&!E&&!(!k||!y.HTMLElement),P=void 0!==T.process&&"[object process]"===T.process.toString()&&!E&&!(!k||!y.HTMLElement),Z={},D=g("enable_beforeunload"),O=function(e){if(e=e||T.event){var t=Z[e.type];t||(t=Z[e.type]=g("ON_PROPERTY"+e.type));var n,r=this||e.target||T,o=r[t];return S&&r===y&&"error"===e.type?!0===(n=o&&o.call(this,e.message,e.filename,e.lineno,e.colno,e.error))&&e.preventDefault():(n=o&&o.apply(this,arguments),"beforeunload"===e.type&&T[D]&&"string"==typeof n?e.returnValue=n:null==n||n||e.preventDefault()),n}};function C(e,t,n){var a=r(e,t);if(!a&&n&&r(n,t)&&(a={enumerable:!0,configurable:!0}),a&&a.configurable){var i=g("on"+t+"patched");if(!e.hasOwnProperty(i)||!e[i]){delete a.writable,delete a.value;var s=a.get,c=a.set,u=t.slice(2),l=Z[u];l||(l=Z[u]=g("ON_PROPERTY"+u)),a.set=function(t){var n=this;n||e!==T||(n=T),n&&("function"==typeof n[l]&&n.removeEventListener(u,O),null==c||c.call(n,null),n[l]=t,"function"==typeof t&&n.addEventListener(u,O,!1))},a.get=function(){var n=this;if(n||e!==T||(n=T),!n)return null;var r=n[l];if(r)return r;if(s){var o=s.call(this);if(o)return a.set.call(this,o),"function"==typeof n.removeAttribute&&n.removeAttribute(t),o}return null},o(e,t,a),e[i]=!0}}}function j(e,t,n){if(t)for(var r=0;r=0&&"function"==typeof r[a.cbIdx]?_(a.name,r[a.cbIdx],a,o):e.apply(t,r)}}))}function N(e,t){e[g("OriginalDelegate")]=t}var A=!1,L=!1;function H(){if(A)return L;A=!0;try{var e=y.navigator.userAgent;-1===e.indexOf("MSIE ")&&-1===e.indexOf("Trident/")&&-1===e.indexOf("Edge/")||(L=!0)}catch(e){}return L}function x(e){return"function"==typeof e}function F(e){return"number"==typeof e}var q={useG:!0},G={},W={},B=new RegExp("^"+v+"(\\w+)(true|false)$"),U=g("propagationStopped");function V(e,t){var n=(t?t(e):e)+p,r=(t?t(e):e)+h,o=v+n,a=v+r;G[e]={},G[e][p]=o,G[e][h]=a}function X(e,t,n,r){var o=r&&r.add||c,i=r&&r.rm||u,s=r&&r.listeners||"eventListeners",l=r&&r.rmAll||"removeAllListeners",f=g(o),d="."+o+":",_="prependListener",k="."+_+":",y=function(e,t,n){if(!e.isRemoved){var r,o=e.callback;"object"==typeof o&&o.handleEvent&&(e.callback=function(e){return o.handleEvent(e)},e.originalDelegate=o);try{e.invoke(e,t,[n])}catch(e){r=e}var a=e.options;return a&&"object"==typeof a&&a.once&&t[i].call(t,n.type,e.originalDelegate?e.originalDelegate:e.callback,a),r}};function T(n,r,o){if(r=r||e.event){var a=n||r.target||e,i=a[G[r.type][o?h:p]];if(i){var s=[];if(1===i.length)(l=y(i[0],a,r))&&s.push(l);else for(var c=i.slice(),u=0;u2})).map((function(e){return e.substring(2)}))}function oe(e,t){if((!w||P)&&!Zone[e.symbol("patchEvents")]){var n=t.__Zone_ignore_on_properties,r=[];if(S){var o=window;r=r.concat(["Document","SVGElement","Element","HTMLElement","HTMLBodyElement","HTMLMediaElement","HTMLFrameSetElement","HTMLFrameElement","HTMLIFrameElement","HTMLMarqueeElement","Worker"]),ne(o,re(o),n?n.concat([]):n,a(o))}r=r.concat(["XMLHttpRequest","XMLHttpRequestEventTarget","IDBIndex","IDBRequest","IDBOpenDBRequest","IDBDatabase","IDBTransaction","IDBCursor","WebSocket"]);for(var i=0;i0){var a=e.invoke;e.invoke=function(){for(var r=o[t.__symbol__("loadfalse")],i=0;iin/=a=Array.prototype.slice,s="true",c="false",u=t("");function l 0-f;0Ah=t,p0/v=p?window:void 0,d=p&&v||globalThis;function _0Cl1var 015g=!("nw"in d)&&void 0!==d1Ad.process.toString(),y=!g&&!k&&!(!p||!v.HTMLElement),m=void 0!==d18d.process.toString()&&!k&&!(!p||!v.HTMLElement),T={},b=h2@w=function(e){if(e=e||d.event){var t=T[e.type];t||(t=T[e.type]=h20d,o=r[t];return y&&r===v=3d[b3S9E(e,t,n){var i=r(e,t);if(!i&&n&&r(n,t)&&(i={enumerable:!0Ai&&i.configurable){var a=h4(;a)||!e[a]){delete i.writable,delete i.value;var s=i.get,c=i5%T[u];l||(l=T[u]=h("ON_PROPERTY"+u)),i:5#d||(n=dd57w5L w,!1))},i5%d||(n=d6Oim6bi),e[a]=!0}}}function Z6(E7&`i in e)"on"==i.slice(0,2)&&o.push(i);for(var a=0;a;.u(this,arguments)},z(o[t],s),S&&function e(t,nQ9QObject.getOwnPropertySymbols&&Object.getOwnPropertySymbols(t).forEach((function(enc'(t,e);Pvn,e[e]},set:function(n){(!r||r.writable&&"function"==typeof r.set)&&(t[e]=n)},enumerable:!r||r.enumerable,configurable:!r||r.confi)gurable})}))}(s,o[t])}return s}function P;D(e,t1U Vr){var i=n(t,r);return i.cbIdx>=0&&"function"==typeof r[i.cbIdx]?f(i.name,r[i.cbIdx],i<j;D(e,t1U Ar){var i=n(t,r);return i.cbIdx>=0&&"function"==typeof r[i.cbIdx]?N0icroTask(i.name,r[i.cbIdx],i<,z(e,t){e[h("OriginalDelegate")]=t}function O=(C=!CI={useG:!0},A={},N={},x=new RegExp("^"+u+"(\\w+)(true|false)$"),R=h> M?>c,r=(t?t(e):e)+s,o=u+n,i=u+r;A[e]={},A[e][c]=o,A[e][s]=i}function L(e,t,n,r){var o=r&&r.add||"addEventListener",a=r&&r.rm||"removeEventListener",l>"f>"4p=h(o),v="."+o+":",d="prependListener",_="."+d+":",kv=!0}if(!k||k(t,p,f,arguments)){var d=!!G&&-1!==G.indexOf(h),_H$d)),m=null==_?void 0:_.signal;if(!(null==m?void 0:m.aborted)){if(H)for(var T=0;T0?n.length-1:-1,target:t}}))}));var i=null===(r=o.realpath)||void 0===r?void 0:r[n.symbol("OriginalDelegate")];(null==i?void 0:i.native6)&&(o.realpath.native=i.native,P(o.realpath,"native",({args:t,target:e,cbIdx:t.length>0?t.length-1:-1,name:"fs.realpath.native"}})))}}))}(e),e.__load_patch("node_timers",(function(e,t){var n=!1;try{var r=require("timers");if(e.setTimeout!==r.setTimeout&&!m){var o=r.setTimeout;r.setTimeout=function(){return n=!0,3};var i=e.setTimeout((function(){}),100);clearTimeout(i),r.setTimeout=o}U(r,q,W,"Timeout"),U(r,q,W,"Interval"),U(r,q,W,"Immediate")}catch(e){}m||(n?(e[t.__symbol__("setTimeout")]=e.setTimeout,e[t.__symbol__("setInterval")]=e.setInterval,e[t.__symbol__("s\etImmediate")]=e.setImmediate):(U(e,q,W,"Timeout"),U(e,q,W,"Interval"),U(e,q,W,"Immediate")) ,nextTick",(function(){j(process,"nextTick",(`{name:"process.nextTick",args:t,cbIdx:t.length>0&&"function"==typeof t[0]?0:-1,target:process}}) handleU@",(function(e,t,n){function r(e){return function(t){F(process,e).forEach((function(n){"unhandledRejection"===e?n.invoke(t.rejecJtion,t.promise):"rejectionHandled"===e&&n.invoke(t.promise)}))}}t[n.symbol=&"r("unhandledRejection"),t[n.symbol~r("rejectionHandledcrypto",(function(){var e;try{e=require("crypto")}catch(e){}e&&["randomBytes","pbkdf2"].forEach((function(t){P(e,t,(function(n,r){return{name:"crypto."+t,args:r,cbIdx:r.length>0&&"function"==typeof r[r.length-1]?r.length-1:-1,target:e}}))}))})),e.__load_.console",(function(e,t){["dir","log","info","error","warn","assert","debug","timeEnd","trace"].forEach((function(e){var n=console[t.__symbol__(e)]=console[e];n&&(console[e]=function(){var e=a.call(arguments);return t.current===t.root?n.apply(this,e):t.root.run(n,this,e)})}7H(e,n)}))})(e),function i9cui=n.symbol,a=[],s=!1!==e[ic3i("Promise"),u=i dYaeea.length;)e()};var l=i=$mf_I.reject(e)}var v=i("state"),d=i("value"),_=i("finally"),k=i("parentPromiseValue"),g=i("parentPromiseState"),y=null,m=!0,T=!1;fKg&#S(e,t,n)}catch(t){S(e,!1,t)}}}var wgaEg Z=ih1S(e,r,i){var c=w();if(e===i)throw new TypeError(Ehh/ i&&"function"!=typeof i||(u=i&&ih%ShgT&&i instanceof I&&i.hasOwnProperty(v)&&i.hasOwnProperty(d)&&i[v]!==y)j(i),S(e,i[v],i[d]);else if(r!==T[i"i~i.Si-1i,e[_]===_&&r===m&&(e[v]=e[g],e[d]=e[k]),r===T&&i jfi,ZtjNzj3T){e[v]=0;var p=iki)+(i&&i.stack?"\n"+ik=i9l3aml.P=il%j(e){if(0===e[v]){try{var n=t[PlRgT;for(var r=0;rw a=new i(Oaw/a,n,r):z(this,s,a,n,r),awi=new o(O);i[_]=_;var ax*a,i,n,n):z(this,a,i,n,n),i},e}();I.resolve=I.resolve,I.reject=I.reject,I.race=I.race,I.all=I.all;var A=e[c]=e.Promise;e.Promise$=I;var N=i("thenPatched");function xRyIy.&N]=!0}}return n.patchThen=x,A&&(x(A),Da,I}))}(e),function s"{O>h("OriginalDelegate"),r=h("Promise"),o=h("Error"),i=function i{#a=this[n];if(a{ a?t.call(ak!a&|~i|"i;var a|a.call(this)}}))}(e)}()}));&>x8"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(t){"function"==typeof define&&define.amd?define(t):t()}((function(){!function t(n){n.__load_patch("canvas",(function(t,n,o){var e=t.HTMLCanvasElement;void 0!==e&&e.prototype&&e.prototype.toBlob&&o.patchMacroTask(e.prototype,"toBlob",(function(t,n){return{name:"HTMLCanvasElement.toBlob",target:t,cbIdx:0,args:n}}))}))}(Zone)}));x'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchCordova(Zone) { Zone.__load_patch('cordova', function (global, Zone, api) { if (global.cordova) { var SUCCESS_SOURCE_1 = 'cordova.exec.success'; var ERROR_SOURCE_1 = 'cordova.exec.error'; var FUNCTION_1 = 'function'; var nativeExec_1 = api.patchMethod(global.cordova, 'exec', function () { return function (self, args) { if (args.length > 0 && typeof args[0] === FUNCTION_1) { args[0] = Zone.current.wrap(args[0], SUCCESS_SOURCE_1); } if (args.length > 1 && typeof args[1] === FUNCTION_1) { args[1] = Zone.current.wrap(args[1], ERROR_SOURCE_1); } return nativeExec_1.apply(self, args); }; }); } }); Zone.__load_patch('cordova.FileReader', function (global, Zone) { if (global.cordova && typeof global['FileReader'] !== 'undefined') { document.addEventListener('deviceReady', function () { var FileReader = global['FileReader']; ['abort', 'error', 'load', 'loadstart', 'loadend', 'progress'].forEach(function (prop) { var eventNameSymbol = Zone.__symbol__('ON_PROPERTY' + prop); Object.defineProperty(FileReader.prototype, eventNameSymbol, { configurable: true, get: function () { return this._realReader && this._realReader[eventNameSymbol]; }, }); }); }); } }); } patchCordova(Zone); })); k+ xp v "', (global, Zone, api) => { p*const SUCCESS_SOURCE'const ERROR_SOURCE%9const FUNCTION = 'function'; const nativeExecU+() =>)s 3); M"s21); M"0* 6  } }); ,(global, Zone) => { p?&)() => { constt4G (prop) =>const NrW,/0V% !} }); } patchCordova(Zone); p:xT"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(o){o.__load_patch("cordova",(function(e,o,r){if(e.cordova)var n="function",t=r.patchMethod(e.cordova,"exec",(function(){return function(e,r){return r.length>0&&typeof r[0]===n&&(r[0]=o.current.wrap(r[0],"cordova.exec.success")),r.length>1&&typeof r[1]===n&&(r[1]=o.current.wrap(r[1],"cordova.exec.error")),t.apply(e,r)}}))})),o.__load_patch("cordova.FileReader",(function(e,o){e.cordova&&void 0!==e.FileReader&&document.addEventListener("deviceReady",(function(){var r=e.FileReader;["abort","error","load","loadstart","loadend","progress"].forEach((function(e){var n=o.__symbol__("ON_PROPERTY"+e);Object.defineProperty(r.prototype,n,{configurable:!0,get:function(){return this._realReader&&this._realReader[n]}})}))}))}))}(Zone)}));1BA8x(ufunction patchCordova(e){e.__load_patch("cordova",((e,o,r)=>{if(e.cordova){const t="cordova.exec.success",a="cordova.exec.error",c="function",d!()=>N/c~tca)),d.apply(e,r)}))}})),e$(e,o)=>GL ()=>{constS e=>{const tAtGK"t]}})}))}))}))}patchCordova(Zone);la/xz'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchElectron(Zone) { Zone.__load_patch('electron', function (global, Zone, api) { function patchArguments(target, name, source) { return api.patchMethod(target, name, function (delegate) { return function (self, args) { return delegate && delegate.apply(self, api.bindArguments(args, source)); }; }); } var _a = require('electron'), desktopCapturer = _a.desktopCapturer, shell = _a.shell, CallbacksRegistry = _a.CallbacksRegistry, ipcRenderer = _a.ipcRenderer; if (!CallbacksRegistry) { try { // Try to load CallbacksRegistry class from @electron/remote src // since from electron 14+, the CallbacksRegistry is moved to @electron/remote // package and not exported to outside, so this is a hack to patch CallbacksRegistry. CallbacksRegistry = require('@electron/remote/dist/src/renderer/callbacks-registry').CallbacksRegistry; } catch (err) { } } // patch api in renderer process directly // desktopCapturer if (desktopCapturer) { patchArguments(desktopCapturer, 'getSources', 'electron.desktopCapturer.getSources'); } // shell if (shell) { patchArguments(shell, 'openExternal', 'electron.shell.openExternal'); } // patch api in main process through CallbackRegistry if (!CallbacksRegistry) { if (ipcRenderer) { patchArguments(ipcRenderer, 'on', 'ipcRenderer.on'); } return; } patchArguments(CallbacksRegistry.prototype, 'add', 'CallbackRegistry.add'); }); } patchElectron(Zone); })); }0x"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(r){r.__load_patch("electron",(function(e,r,t){function n(e,r,n){return t.patchMethod(e,r,(function(e){return function(r,c){return e&&e.apply(r,t.bindArguments(c,n))}}))}var c=require("electron"),o=c.desktopCapturer,i=c.shell,a=c.CallbacksRegistry,l=c.ipcRenderer;if(!a)try{a=require("@electron/remote/dist/src/renderer/callbacks-registry").CallbacksRegistry}catch(e){}o&&n(o,"getSources","electron.desktopCapturer.getSources"),i&&n(i,"openExternal","electron.shell.openExternal"),a?n(a.prototype,"add","CallbackRegistry.add"):l&&n(l,"on","ipcRenderer.on")}))}(Zone)}));e xn'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; /** * @fileoverview * @suppress {missingRequire} */ function patchFetch(Zone) { Zone.__load_patch('fetch', function (global, Zone, api) { var fetch = global['fetch']; if (typeof fetch !== 'function') { return; } var originalFetch = global[api.symbol('fetch')]; if (originalFetch) { // restore unpatched fetch first fetch = originalFetch; } var ZoneAwarePromise = global.Promise; var symbolThenPatched = api.symbol('thenPatched'); var fetchTaskScheduling = api.symbol('fetchTaskScheduling'); var OriginalResponse = global.Response; var placeholder = function () { }; var createFetchTask = function (source, data, originalImpl, self, args, ac) { return new Promise(function (resolve, reject) { var task = Zone.current.scheduleMacroTask(source, placeholder, data, function () { // The promise object returned by the original implementation passed into the // function. This might be a `fetch` promise, `Response.prototype.json` promise, // etc. var implPromise; var zone = Zone.current; try { zone[fetchTaskScheduling] = true; implPromise = originalImpl.apply(self, args); } catch (error) { reject(error); return; } finally { zone[fetchTaskScheduling] = false; } if (!(implPromise instanceof ZoneAwarePromise)) { var ctor = implPromise.constructor; if (!ctor[symbolThenPatched]) { api.patchThen(ctor); } } implPromise.then(function (resource) { if (task.state !== 'notScheduled') { task.invoke(); } resolve(resource); }, function (error) { if (task.state !== 'notScheduled') { task.invoke(); } reject(error); }); }, function () { ac === null || ac === void 0 ? void 0 : ac.abort(); }); }); }; global['fetch'] = function () { var args = Array.prototype.slice.call(arguments); var options = args.length > 1 ? args[1] : {}; var signal = options === null || options === void 0 ? void 0 : options.signal; var ac = new AbortController(); var fetchSignal = ac.signal; options.signal = fetchSignal; args[1] = options; var onAbort; if (signal) { var nativeAddEventListener = signal[Zone.__symbol__('addEventListener')] || signal.addEventListener; onAbort = function () { return ac.abort(); }; nativeAddEventListener.call(signal, 'abort', onAbort, { once: true }); } return createFetchTask('fetch', { fetchArgs: args }, fetch, this, args, ac).finally(function () { // We need to be good citizens and remove the `abort` listener once // the fetch is settled. The `abort` listener may not be called at all, // which means the event listener closure would retain a reference to // the `ac` object even if it goes out of scope. Since browser's garbage // collectors work differently, some may not be smart enough to collect a signal. signal === null || signal === void 0 ? void 0 : signal.removeEventListener('abort', onAbort); }); }; if (OriginalResponse === null || OriginalResponse === void 0 ? void 0 : OriginalResponse.prototype) { // https://fetch.spec.whatwg.org/#body-mixin ['arrayBuffer', 'blob', 'formData', 'json', 'text'] // Safely check whether the method exists on the `Response` prototype before patching. .filter(function (method) { return typeof OriginalResponse.prototype[method] === 'function'; }) .forEach(function (method) { api.patchMethod(OriginalResponse.prototype, method, function (delegate) { return function (self, args) { return createFetchTask("Response.".concat(method), undefined, delegate, self, args, undefined); }; }); }); } }); } patchFetch(Zone); })); 17Dxr) function patchUserMediad$ getUserMedia. function wrapFunctionArgs(func,  return # B@2var wrappedArgs = api.bindArguments(args, func.nam #return func.apply(this, wrappedArgs XTnavigator = global['navigator']; if (navigator && navigator.getUserMediaAnavigator.getUserMedia = wrapFunctionArgs(navigator.getUserMedia)lUserMedia(Zone); })); [_x"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){!function n(t){t.__load_patch("fetch",(function(n,t,e){var o=n.fetch;if("function"==typeof o){var r=n[e.symbol("fetch")];r&&(o=r);var c=n.Promise,i=e.symbol("thenPatched"),f=e.symbol("fetchTaskScheduling"),a=n.Response,u=function(){},l=function(n,o,r,a,l,s){return new Promise((function(h,d){var p=t.current.scheduleMacroTask(n,u,o,(function(){var n,o=t.current;try{o[f]=!0,n=r.apply(a,l)}catch(n){return void d(n)}finally{o[f]=!1}if(!(n instanceof c)){var u=n.constructor;u[i]||e.patchThen(u)}n.then((function(n){"notScheduled"!==p.state&&p.invoke(),h(n)}),(function(n){"notScheduled"!==p.state&&p.invoke(),d(n)}))}),(function(){null==s||s.abort()}))}))};n.fetch=function(){var n,e=Array.prototype.slice.call(arguments),r=e.length>1?e[1]:{},c=null==r?void 0:r.signal,i=new AbortController;return r.signal=i.signal,e[1]=r,c&&(c[t.__symbol__("addEventListener")]||c.addEventListener).call(c,"abort",n=function(){return i.abort()},{once:!0}),l("fetch",{fetchArgs:e},o,this,e,i).finally((function(){null==c||c.removeEventListener("abort",n)}))},(null==a?void 0:a.prototype)&&["arrayBuffer","blob","formData","json","text"].filter((function(n){return"function"==typeof a.prototype[n]})).forEach((function(n){e.patchMethod(a.prototype,n,(function(t){return function(e,o){return l("Response.".concat(n),void 0,t,e,o,void 0)}}))}))}}))}(Zone)}));ow~DxO"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(n){"function"==typeof define&&define.amd?define(n):n()}((function(){!function n(o){o.__load_patch("jsonp",(function(n,o,c){o[o.__symbol__("jsonp")]=function e(t){if(t&&t.jsonp&&t.sendFuncName){var a=function(){};[t.successFuncName,t.failedFuncName].forEach((function(o){o&&(n[o]?c.patchMethod(n,o,(function(o){return function(e,t){var a=n[c.symbol("jsonTask")];return a?(a.callback=o,a.invoke.apply(e,t)):o.apply(e,t)}})):Object.defineProperty(n,o,{configurable:!0,enumerable:!0,get:function(){return function(){var e=n[c.symbol("jsonpTask")],t=n[c.symbol("jsonp".concat(o,"callback"))];return e?(t&&(e.callback=t),n[c.symbol("jsonpTask")]=void 0,e.invoke.apply(this,arguments)):t?t.apply(this,arguments):null}},set:function(n){this[c.symbol("jsonp".concat(o,"callback"))]=n}}))})),c.patchMethod(t.jsonp,t.sendFuncName,(function(e){return function(t,s){n[c.symbol("jsonpTask")]=o.current.scheduleMacroTask("jsonp",a,{},(function(n){return e.apply(t,s)}),a)}}))}}}))}(Zone)}));@6x`'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchMessagePort(Zone) { /** * Monkey patch `MessagePort.prototype.onmessage` and `MessagePort.prototype.onmessageerror` * properties to make the callback in the zone when the value are set. */ Zone.__load_patch('MessagePort', function (global, Zone, api) { var MessagePort = global['MessagePort']; if (typeof MessagePort !== 'undefined' && MessagePort.prototype) { api.patchOnProperties(MessagePort.prototype, ['message', 'messageerror']); } }); } patchMessagePort(Zone); })); ܶxv"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(o){o.__load_patch("MessagePort",(function(e,o,t){var n=e.MessagePort;void 0!==n&&n.prototype&&t.patchOnProperties(n.prototype,["message","messageerror"])}))}(Zone)}));}Cx 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchPromiseTesting(Zone) { /** * Promise for async/fakeAsync zoneSpec test * can support async operation which not supported by zone.js * such as * it ('test jsonp in AsyncZone', async() => { * new Promise(res => { * jsonp(url, (data) => { * // success callback * res(data); * }); * }).then((jsonpResult) => { * // get jsonp result. * * // user will expect AsyncZoneSpec wait for * // then, but because jsonp is not zone aware * // AsyncZone will finish before then is called. * }); * }); */ Zone.__load_patch('promisefortest', function (global, Zone, api) { var symbolState = api.symbol('state'); var UNRESOLVED = null; var symbolParentUnresolved = api.symbol('parentUnresolved'); // patch Promise.prototype.then to keep an internal // number for tracking unresolved chained promise // we will decrease this number when the parent promise // being resolved/rejected and chained promise was // scheduled as a microTask. // so we can know such kind of chained promise still // not resolved in AsyncTestZone Promise[api.symbol('patchPromiseForTest')] = function patchPromiseForTest() { var oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { return; } oriThen = Promise[Zone.__symbol__('ZonePromiseThen')] = Promise.prototype.then; Promise.prototype.then = function () { var chained = oriThen.apply(this, arguments); if (this[symbolState] === UNRESOLVED) { // parent promise is unresolved. var asyncTestZoneSpec = Zone.current.get('AsyncTestZoneSpec'); if (asyncTestZoneSpec) { asyncTestZoneSpec.unresolvedChainedPromiseCount++; chained[symbolParentUnresolved] = true; } } return chained; }; }; Promise[api.symbol('unPatchPromiseForTest')] = function unpatchPromiseForTest() { // restore origin then var oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { Promise.prototype.then = oriThen; Promise[Zone.__symbol__('ZonePromiseThen')] = undefined; } }; }); } patchPromiseTesting(Zone); })); \_5x_"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(o){o.__load_patch("promisefortest",(function(e,o,n){var s=n.symbol("state"),t=n.symbol("parentUnresolved");Promise[n.symbol("patchPromiseForTest")]=function e(){var n=Promise[o.__symbol__("ZonePromiseThen")];n||(n=Promise[o.__symbol__("ZonePromiseThen")]=Promise.prototype.then,Promise.prototype.then=function(){var e=n.apply(this,arguments);if(null===this[s]){var r=o.current.get("AsyncTestZoneSpec");r&&(r.unresolvedChainedPromiseCount++,e[t]=!0)}return e})},Promise[n.symbol("unPatchPromiseForTest")]=function e(){var n=Promise[o.__symbol__("ZonePromiseThen")];n&&(Promise.prototype.then=n,Promise[o.__symbol__("ZonePromiseThen")]=void 0)}}))}(Zone)}));2Vxo"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(n){n.__load_patch("ResizeObserver",(function(e,n,r){var t=e.ResizeObserver;if(t){var o=r.symbol("ResizeObserver");r.patchMethod(e,"ResizeObserver",(function(e){return function(e,r){var i=r.length>0?r[0]:null;return i&&(r[0]=function(e,r){for(var t=this,u={},a=n.current,c=0,f=e;c0?new t(r[0]):new t}})),r.patchMethod(t.prototype,"observe",(function(e){return function(r,t){var i=t.length>0?t[0]:null;if(!i)return e.apply(r,t);var u=r[o];return u||(u=r[o]=[]),u.push(i),i[o]=n.current,e.apply(r,t)}})),r.patchMethod(t.prototype,"unobserve",(function(e){return function(n,r){var t=r.length>0?r[0]:null;if(!t)return e.apply(n,r);var i=n[o];if(i)for(var u=0;u * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(require("rxjs")):"function"==typeof define&&define.amd?define(["rxjs"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).rxjs)}(this,(function(e){!function t(r){r.__load_patch("rxjs",(function(t,r,n){var i,o,u,s,c,b=r.__symbol__,a=Object.defineProperties;n.patchMethod(e.Observable.prototype,"lift",(function(e){return function(t,i){var o=e.apply(t,i);return o.operator&&(o.operator._zone=r.current,n.patchMethod(o.operator,"call",(function(e){return function(t,n){return t._zone&&t._zone!==r.current?t._zone.run(e,t,n):e.apply(t,n)}}))),o}})),o=(i=e.Observable.prototype)[b("_subscribe")]=i._subscribe,a(e.Observable.prototype,{_zone:{value:null,writable:!0,configurable:!0},_zoneSource:{value:null,writable:!0,configurable:!0},_zoneSubscribe:{value:null,writable:!0,configurable:!0},source:{configurable:!0,get:function(){return this._zoneSource},set:function(e){this._zone=r.current,this._zoneSource=e}},_subscribe:{configurable:!0,get:function(){if(this._zoneSubscribe)return this._zoneSubscribe;if(this.constructor===e.Observable)return o;var t=Object.getPrototypeOf(this);return t&&t._subscribe},set:function(e){this._zone=r.current,this._zoneSubscribe=e?function(){if(this._zone&&this._zone!==r.current){var t=this._zone.run(e,this,arguments);if("function"==typeof t){var n=this._zone;return function(){return n!==r.current?n.run(t,this,arguments):t.apply(this,arguments)}}return t}return e.apply(this,arguments)}:e}},subjectFactory:{get:function(){return this._zoneSubjectFactory},set:function(e){var t=this._zone;this._zoneSubjectFactory=function(){return t&&t!==r.current?t.run(e,this,arguments):e.apply(this,arguments)}}}}),a(e.Subscription.prototype,{_zone:{value:null,writable:!0,configurable:!0},_zoneUnsubscribe:{value:null,writable:!0,configurable:!0},_unsubscribe:{get:function(){if(this._zoneUnsubscribe||this._zoneUnsubscribeCleared)return this._zoneUnsubscribe;var e=Object.getPrototypeOf(this);return e&&e._unsubscribe},set:function(e){this._zone=r.current,e?(this._zoneUnsubscribeCleared=!1,this._zoneUnsubscribe=function(){return this._zone&&this._zone!==r.current?this._zone.run(e,this,arguments):e.apply(this,arguments)}):(this._zoneUnsubscribe=e,this._zoneUnsubscribeCleared=!0)}}}),u=e.Subscriber.prototype.next,s=e.Subscriber.prototype.error,c=e.Subscriber.prototype.complete,Object.defineProperty(e.Subscriber.prototype,"destination",{configurable:!0,get:function(){return this._zoneDestination},set:function(e){this._zone=r.current,this._zoneDestination=e}}),e.Subscriber.prototype.next=function(){var e=this._zone;return e&&e!==r.current?e.run(u,this,arguments,"rxjs.Subscriber.next"):u.apply(this,arguments)},e.Subscriber.prototype.error=function(){var e=this._zone;return e&&e!==r.current?e.run(s,this,arguments,"rxjs.Subscriber.error"):s.apply(this,arguments)},e.Subscriber.prototype.complete=function(){var e=this._zone;return e&&e!==r.current?e.run(c,this,arguments,"rxjs.Subscriber.complete"):c.call(this)}}))}(Zone)}));kʏ=Rx!'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ (function (factory) { typeof define === 'function' && define.amd ? define(factory) : factory(); })((function () { 'use strict'; function patchSocketIo(Zone) { Zone.__load_patch('socketio', function (global, Zone, api) { Zone[Zone.__symbol__('socketio')] = function patchSocketIO(io) { // patch io.Socket.prototype event listener related method api.patchEventTarget(global, api, [io.Socket.prototype], { useG: false, chkDup: false, rt: true, diff: function (task, delegate) { return task.callback === delegate; }, }); // also patch io.Socket.prototype.on/off/removeListener/removeAllListeners io.Socket.prototype.on = io.Socket.prototype.addEventListener; io.Socket.prototype.off = io.Socket.prototype.removeListener = io.Socket.prototype.removeAllListeners = io.Socket.prototype.removeEventListener; }; }); } patchSocketIo(Zone); })); w&xf"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(t){t.__load_patch("socketio",(function(e,t,o){t[t.__symbol__("socketio")]=function t(n){o.patchEventTarget(e,o,[n.Socket.prototype],{useG:!1,chkDup:!1,rt:!0,diff:function(e,t){return e.callback===t}}),n.Socket.prototype.on=n.Socket.prototype.addEventListener,n.Socket.prototype.off=n.Socket.prototype.removeListener=n.Socket.prototype.removeAllListeners=n.Socket.prototype.removeEventListener}}))}(Zone)}));l/x*"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */!function(e){"function"==typeof define&&define.amd?define(e):e()}((function(){!function e(n){n.__load_patch("getUserMedia",(function(e,n,t){var i=e.navigator;i&&i.getUserMedia&&(i.getUserMedia=function r(e){return function(){var n=Array.prototype.slice.call(arguments),i=t.bindArguments(n,e.name);return e.apply(this,i)}}(i.getUserMedia))}))}(Zone)}));!nFxm2'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ const global$1 = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { const symbolPrefix = global$1['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } const __global = (typeof window !== 'undefined' && window) || (typeof self !== 'undefined' && self) || global; class AsyncTestZoneSpec { finishCallback; failCallback; // Needs to be a getter and not a plain property in order run this just-in-time. Otherwise // `__symbol__` would be evaluated during top-level execution prior to the Zone prefix being // changed for tests. static get symbolParentUnresolved() { return __symbol__('parentUnresolved'); } _pendingMicroTasks = false; _pendingMacroTasks = false; _alreadyErrored = false; _isSync = false; _existingFinishTimer = null; entryFunction = null; runZone = Zone.current; unresolvedChainedPromiseCount = 0; supportWaitUnresolvedChainedPromise = false; constructor(finishCallback, failCallback, namePrefix) { this.finishCallback = finishCallback; this.failCallback = failCallback; this.name = 'asyncTestZone for ' + namePrefix; this.properties = { 'AsyncTestZoneSpec': this }; this.supportWaitUnresolvedChainedPromise = __global[__symbol__('supportWaitUnResolvedChainedPromise')] === true; } isUnresolvedChainedPromisePending() { return this.unresolvedChainedPromiseCount > 0; } _finishCallbackIfDone() { // NOTE: Technically the `onHasTask` could fire together with the initial synchronous // completion in `onInvoke`. `onHasTask` might call this method when it captured e.g. // microtasks in the proxy zone that now complete as part of this async zone run. // Consider the following scenario: // 1. A test `beforeEach` schedules a microtask in the ProxyZone. // 2. An actual empty `it` spec executes in the AsyncTestZone` (using e.g. `waitForAsync`). // 3. The `onInvoke` invokes `_finishCallbackIfDone` because the spec runs synchronously. // 4. We wait the scheduled timeout (see below) to account for unhandled promises. // 5. The microtask from (1) finishes and `onHasTask` is invoked. // --> We register a second `_finishCallbackIfDone` even though we have scheduled a timeout. // If the finish timeout from below is already scheduled, terminate the existing scheduled // finish invocation, avoiding calling `jasmine` `done` multiple times. *Note* that we would // want to schedule a new finish callback in case the task state changes again. if (this._existingFinishTimer !== null) { clearTimeout(this._existingFinishTimer); this._existingFinishTimer = null; } if (!(this._pendingMicroTasks || this._pendingMacroTasks || (this.supportWaitUnresolvedChainedPromise && this.isUnresolvedChainedPromisePending()))) { // We wait until the next tick because we would like to catch unhandled promises which could // cause test logic to be executed. In such cases we cannot finish with tasks pending then. this.runZone.run(() => { this._existingFinishTimer = setTimeout(() => { if (!this._alreadyErrored && !(this._pendingMicroTasks || this._pendingMacroTasks)) { this.finishCallback(); } }, 0); }); } } patchPromiseForTest() { if (!this.supportWaitUnresolvedChainedPromise) { return; } const patchPromiseForTest = Promise[Zone.__symbol__('patchPromiseForTest')]; if (patchPromiseForTest) { patchPromiseForTest(); } } unPatchPromiseForTest() { if (!this.supportWaitUnresolvedChainedPromise) { return; } const unPatchPromiseForTest = Promise[Zone.__symbol__('unPatchPromiseForTest')]; if (unPatchPromiseForTest) { unPatchPromiseForTest(); } } // ZoneSpec implementation below. name; properties; onScheduleTask(delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } if (task.type === 'microTask' && task.data && task.data instanceof Promise) { // check whether the promise is a chained promise if (task.data[AsyncTestZoneSpec.symbolParentUnresolved] === true) { // chained promise is being scheduled this.unresolvedChainedPromiseCount--; } } return delegate.scheduleTask(target, task); } onInvokeTask(delegate, current, target, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.invokeTask(target, task, applyThis, applyArgs); } onCancelTask(delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.cancelTask(target, task); } // Note - we need to use onInvoke at the moment to call finish when a test is // fully synchronous. TODO(juliemr): remove this when the logic for // onHasTask changes and it calls whenever the task queues are dirty. // updated by(JiaLiPassion), only call finish callback when no task // was scheduled/invoked/canceled. onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { if (!this.entryFunction) { this.entryFunction = delegate; } try { this._isSync = true; return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } finally { // We need to check the delegate is the same as entryFunction or not. // Consider the following case. // // asyncTestZone.run(() => { // Here the delegate will be the entryFunction // Zone.current.run(() => { // Here the delegate will not be the entryFunction // }); // }); // // We only want to check whether there are async tasks scheduled // for the entry function. if (this._isSync && this.entryFunction === delegate) { this._finishCallbackIfDone(); } } } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { // Let the parent try to handle the error. const result = parentZoneDelegate.handleError(targetZone, error); if (result) { this.failCallback(error); this._alreadyErrored = true; } return false; } onHasTask(delegate, current, target, hasTaskState) { delegate.hasTask(target, hasTaskState); // We should only trigger finishCallback when the target zone is the AsyncTestZone // Consider the following cases. // // const childZone = asyncTestZone.fork({ // name: 'child', // onHasTask: ... // }); // // So we have nested zones declared the onHasTask hook, in this case, // the onHasTask will be triggered twice, and cause the finishCallbackIfDone() // is also be invoked twice. So we need to only trigger the finishCallbackIfDone() // when the current zone is the same as the target zone. if (current !== target) { return; } if (hasTaskState.change == 'microTask') { this._pendingMicroTasks = hasTaskState.microTask; this._finishCallbackIfDone(); } else if (hasTaskState.change == 'macroTask') { this._pendingMacroTasks = hasTaskState.macroTask; this._finishCallbackIfDone(); } } } function patchAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['AsyncTestZoneSpec'] = AsyncTestZoneSpec; Zone.__load_patch('asynctest', (global, Zone, api) => { /** * Wraps a test function in an asynchronous test zone. The test will automatically * complete when all asynchronous calls within this zone are done. */ Zone[api.symbol('asyncTest')] = function asyncTest(fn) { // If we're running using the Jasmine test framework, adapt to call the 'done' // function when asynchronous activity is finished. if (global.jasmine) { // Not using an arrow function to preserve context passed from call site return function (done) { if (!done) { // if we run beforeEach in @angular/core/testing/testing_internal then we get no done // fake it here and assume sync. done = function () { }; done.fail = function (e) { throw e; }; } runInTestZone(fn, this, done, (err) => { if (typeof err === 'string') { return done.fail(new Error(err)); } else { done.fail(err); } }); }; } // Otherwise, return a promise which will resolve when asynchronous activity // is finished. This will be correctly consumed by the Mocha framework with // it('...', async(myFn)); or can be used in a custom framework. // Not using an arrow function to preserve context passed from call site return function () { return new Promise((finishCallback, failCallback) => { runInTestZone(fn, this, finishCallback, failCallback); }); }; }; function runInTestZone(fn, context, finishCallback, failCallback) { const currentZone = Zone.current; const AsyncTestZoneSpec = Zone['AsyncTestZoneSpec']; if (AsyncTestZoneSpec === undefined) { throw new Error('AsyncTestZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/async-test'); } const ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/proxy'); } const proxyZoneSpec = ProxyZoneSpec.get(); ProxyZoneSpec.assertPresent(); // We need to create the AsyncTestZoneSpec outside the ProxyZone. // If we do it in ProxyZone then we will get to infinite recursion. const proxyZone = Zone.current.getZoneWith('ProxyZoneSpec'); const previousDelegate = proxyZoneSpec.getDelegate(); proxyZone.parent.run(() => { const testZoneSpec = new AsyncTestZoneSpec(() => { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's // still this one. Otherwise, assume // it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(() => { finishCallback(); }); }, (error) => { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's sill this one. Otherwise, assume it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(() => { failCallback(error); }); }, 'test'); proxyZoneSpec.setDelegate(testZoneSpec); testZoneSpec.patchPromiseForTest(); }); return Zone.current.runGuarded(fn, context); } }); } patchAsyncTest(Zone); yl!{xSdv*function patchSyncTest(Zone) { class S-  constructor(} name = 'K) & name; :> switch (task.type%3case 'microTask': case 'macroTask':%~*h`Cannot call ${task.source} from within a sync test (${this.name}).`); case 'eventTask':%task =;*W%break; o return task j?SyncTestZoneSpec'] = SyncTestZoneSpec; } patchSyncTest(Zone); x "use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const global$1=globalThis;function __symbol__(e){return(global$1.__Zone_symbol_prefix||"__zone_symbol__")+e}const __global="undefined"!=typeof window&&window||"undefined"!=typeof self&&self||global;class AsyncTestZoneSpec{finishCallback;failCallback;static get symbolParentUnresolved(){return __symbol__("parentUnresolved")}_pendingMicroTasks=!1;_pendingMacroTasks=!1;_alreadyErrored=!1;_isSync=!1;_existingFinishTimer=null;entryFunction=null;runZone=Zone.current;unresolvedChainedPromiseCount=0;supportWaitUnresolvedChainedPromise=!1;constructor(e,n,s){this.finishCallback=e,this.failCallback=n,this.name="asyncTestZone for "+s,this.properties={AsyncTestZoneSpec:this},this.supportWaitUnresolvedChainedPromise=!0===__global[__symbol__("supportWaitUnResolvedChainedPromise")]}isUnresolvedChainedPromisePending(){return this.unresolvedChainedPromiseCount>0}_finishCallbackIfDone(){null!==this._existingFinishTimer&&(clearTimeout(this._existingFinishTimer),this._existingFinishTimer=null),this._pendingMicroTasks||this._pendingMacroTasks||this.supportWaitUnresolvedChainedPromise&&this.isUnresolvedChainedPromisePending()||this.runZone.run((()=>{this._existingFinishTimer=setTimeout((()=>{this._alreadyErrored||this._pendingMicroTasks||this._pendingMacroTasks||this.finishCallback()}),0)}))}patchPromiseForTest(){if(!this.supportWaitUnresolvedChainedPromise)return;const e=Promise[Zone.__symbol__("patchPromiseForTest")];e&&e()}unPatchPromiseForTest(){if(!this.supportWaitUnresolvedChainedPromise)return;const e=Promise[Zone.__symbol__("unPatchPromiseForTest")];e&&e()}name;properties;onScheduleTask(e,n,s,t){return"eventTask"!==t.type&&(this._isSync=!1),"microTask"===t.type&&t.data&&t.data instanceof Promise&&!0===t.data[AsyncTestZoneSpec.symbolParentUnresolved]&&this.unresolvedChainedPromiseCount--,e.scheduleTask(s,t)}onInvokeTask(e,n,s,t,i,o){return"eventTask"!==t.type&&(this._isSync=!1),e.invokeTask(s,t,i,o)}onCancelTask(e,n,s,t){return"eventTask"!==t.type&&(this._isSync=!1),e.cancelTask(s,t)}onInvoke(e,n,s,t,i,o,r){this.entryFunction||(this.entryFunction=t);try{return this._isSync=!0,e.invoke(s,t,i,o,r)}finally{this._isSync&&this.entryFunction===t&&this._finishCallbackIfDone()}}onHandleError(e,n,s,t){return e.handleError(s,t)&&(this.failCallback(t),this._alreadyErrored=!0),!1}onHasTask(e,n,s,t){e.hasTask(s,t),n===s&&("microTask"==t.change?(this._pendingMicroTasks=t.microTask,this._finishCallbackIfDone()):"macroTask"==t.change&&(this._pendingMacroTasks=t.macroTask,this._finishCallbackIfDone()))}}function patchAsyncTest(e){e.AsyncTestZoneSpec=AsyncTestZoneSpec,e.__load_patch("asynctest",((e,n,s)=>{function t(e,s,t,i){const o=n.current,r=n.AsyncTestZoneSpec;if(void 0===r)throw new Error("AsyncTestZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/async-test");const a=n.ProxyZoneSpec;if(!a)throw new Error("ProxyZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/proxy");const c=a.get();a.assertPresent();const l=n.current.getZoneWith("ProxyZoneSpec"),h=c.getDelegate();return l.parent.run((()=>{const e=new r((()=>{c.getDelegate()==e&&c.setDelegate(h),e.unPatchPromiseForTest(),o.run((()=>{t()}))}),(n=>{c.getDelegate()==e&&c.setDelegate(h),e.unPatchPromiseForTest(),o.run((()=>{i(n)}))}),"test");c.setDelegate(e),e.patchPromiseForTest()})),n.current.runGuarded(e,s)}n[s.symbol("asyncTest")]=function n(s){return e.jasmine?function(e){e||((e=function(){}).fail=function(e){throw e}),t(s,this,e,(n=>{if("string"==typeof n)return e.fail(new Error(n));e.fail(n)}))}:function(){return new Promise(((e,n)=>{t(s,this,e,n)}))}}}))}patchAsyncTest(Zone);}7xw~'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ const global = (typeof window === 'object' && window) || (typeof self === 'object' && self) || globalThis.global; const OriginalDate = global.Date; // Since when we compile this file to `es2015`, and if we define // this `FakeDate` as `class FakeDate`, and then set `FakeDate.prototype` // there will be an error which is `Cannot assign to read only property 'prototype'` // so we need to use function implementation here. function FakeDate() { if (arguments.length === 0) { const d = new OriginalDate(); d.setTime(FakeDate.now()); return d; } else { const args = Array.prototype.slice.call(arguments); return new OriginalDate(...args); } } FakeDate.now = function () { const fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncTestZoneSpec) { return fakeAsyncTestZoneSpec.getFakeSystemTime(); } return OriginalDate.now.apply(this, arguments); }; FakeDate.UTC = OriginalDate.UTC; FakeDate.parse = OriginalDate.parse; // keep a reference for zone patched timer function let patchedTimers; const timeoutCallback = function () { }; class Scheduler { // Next scheduler id. static nextNodeJSId = 1; static nextId = -1; // Scheduler queue with the tuple of end time and callback function - sorted by end time. _schedulerQueue = []; // Current simulated time in millis. _currentTickTime = 0; // Current fake system base time in millis. _currentFakeBaseSystemTime = OriginalDate.now(); // track requeuePeriodicTimer _currentTickRequeuePeriodicEntries = []; constructor() { } static getNextId() { const id = patchedTimers.nativeSetTimeout.call(global, timeoutCallback, 0); patchedTimers.nativeClearTimeout.call(global, id); if (typeof id === 'number') { return id; } // in NodeJS, we just use a number for fakeAsync, since it will not // conflict with native TimeoutId return Scheduler.nextNodeJSId++; } getCurrentTickTime() { return this._currentTickTime; } getFakeSystemTime() { return this._currentFakeBaseSystemTime + this._currentTickTime; } setFakeBaseSystemTime(fakeBaseSystemTime) { this._currentFakeBaseSystemTime = fakeBaseSystemTime; } getRealSystemTime() { return OriginalDate.now(); } scheduleFunction(cb, delay, options) { options = { ...{ args: [], isPeriodic: false, isRequestAnimationFrame: false, id: -1, isRequeuePeriodic: false, }, ...options, }; let currentId = options.id < 0 ? Scheduler.nextId : options.id; Scheduler.nextId = Scheduler.getNextId(); let endTime = this._currentTickTime + delay; // Insert so that scheduler queue remains sorted by end time. let newEntry = { endTime: endTime, id: currentId, func: cb, args: options.args, delay: delay, isPeriodic: options.isPeriodic, isRequestAnimationFrame: options.isRequestAnimationFrame, }; if (options.isRequeuePeriodic) { this._currentTickRequeuePeriodicEntries.push(newEntry); } let i = 0; for (; i < this._schedulerQueue.length; i++) { let currentEntry = this._schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } this._schedulerQueue.splice(i, 0, newEntry); return currentId; } removeScheduledFunctionWithId(id) { for (let i = 0; i < this._schedulerQueue.length; i++) { if (this._schedulerQueue[i].id == id) { this._schedulerQueue.splice(i, 1); break; } } } removeAll() { this._schedulerQueue = []; } getTimerCount() { return this._schedulerQueue.length; } tickToNext(step = 1, doTick, tickOptions) { if (this._schedulerQueue.length < step) { return; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const targetTask = this._schedulerQueue[step - 1]; this.tick(targetTask.endTime - startTime, doTick, tickOptions); } tick(millis = 0, doTick, tickOptions) { let finalTime = this._currentTickTime + millis; let lastCurrentTime = 0; tickOptions = Object.assign({ processNewMacroTasksSynchronously: true }, tickOptions); // we need to copy the schedulerQueue so nested timeout // will not be wrongly called in the current tick // https://github.com/angular/angular/issues/33799 const schedulerQueue = tickOptions.processNewMacroTasksSynchronously ? this._schedulerQueue : this._schedulerQueue.slice(); if (schedulerQueue.length === 0 && doTick) { doTick(millis); return; } while (schedulerQueue.length > 0) { // clear requeueEntries before each loop this._currentTickRequeuePeriodicEntries = []; let current = schedulerQueue[0]; if (finalTime < current.endTime) { // Done processing the queue since it's sorted by endTime. break; } else { // Time to run scheduled function. Remove it from the head of queue. let current = schedulerQueue.shift(); if (!tickOptions.processNewMacroTasksSynchronously) { const idx = this._schedulerQueue.indexOf(current); if (idx >= 0) { this._schedulerQueue.splice(idx, 1); } } lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } let retval = current.func.apply(global, current.isRequestAnimationFrame ? [this._currentTickTime] : current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } // check is there any requeue periodic entry is added in // current loop, if there is, we need to add to current loop if (!tickOptions.processNewMacroTasksSynchronously) { this._currentTickRequeuePeriodicEntries.forEach((newEntry) => { let i = 0; for (; i < schedulerQueue.length; i++) { const currentEntry = schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } schedulerQueue.splice(i, 0, newEntry); }); } } } lastCurrentTime = this._currentTickTime; this._currentTickTime = finalTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } } flushOnlyPendingTimers(doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick, { processNewMacroTasksSynchronously: false }); return this._currentTickTime - startTime; } flush(limit = 20, flushPeriodic = false, doTick) { if (flushPeriodic) { return this.flushPeriodic(doTick); } else { return this.flushNonPeriodic(limit, doTick); } } flushPeriodic(doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick); return this._currentTickTime - startTime; } flushNonPeriodic(limit, doTick) { const startTime = this._currentTickTime; let lastCurrentTime = 0; let count = 0; while (this._schedulerQueue.length > 0) { count++; if (count > limit) { throw new Error('flush failed after reaching the limit of ' + limit + ' tasks. Does your code use a polling timeout?'); } // flush only non-periodic timers. // If the only remaining tasks are periodic(or requestAnimationFrame), finish flushing. if (this._schedulerQueue.filter((task) => !task.isPeriodic && !task.isRequestAnimationFrame) .length === 0) { break; } const current = this._schedulerQueue.shift(); lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { // Update any secondary schedulers like Jasmine mock Date. doTick(this._currentTickTime - lastCurrentTime); } const retval = current.func.apply(global, current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } } return this._currentTickTime - startTime; } } class FakeAsyncTestZoneSpec { trackPendingRequestAnimationFrame; macroTaskOptions; static assertInZone() { if (Zone.current.get('FakeAsyncTestZoneSpec') == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } _scheduler = new Scheduler(); _microtasks = []; _lastError = null; _uncaughtPromiseErrors = Promise[Zone.__symbol__('uncaughtPromiseErrors')]; pendingPeriodicTimers = []; pendingTimers = []; patchDateLocked = false; constructor(namePrefix, trackPendingRequestAnimationFrame = false, macroTaskOptions) { this.trackPendingRequestAnimationFrame = trackPendingRequestAnimationFrame; this.macroTaskOptions = macroTaskOptions; this.name = 'fakeAsyncTestZone for ' + namePrefix; // in case user can't access the construction of FakeAsyncTestSpec // user can also define macroTaskOptions by define a global variable. if (!this.macroTaskOptions) { this.macroTaskOptions = global[Zone.__symbol__('FakeAsyncTestMacroTask')]; } } _fnAndFlush(fn, completers) { return (...args) => { fn.apply(global, args); if (this._lastError === null) { // Success if (completers.onSuccess != null) { completers.onSuccess.apply(global); } // Flush microtasks only on success. this.flushMicrotasks(); } else { // Failure if (completers.onError != null) { completers.onError.apply(global); } } // Return true if there were no errors, false otherwise. return this._lastError === null; }; } static _removeTimer(timers, id) { let index = timers.indexOf(id); if (index > -1) { timers.splice(index, 1); } } _dequeueTimer(id) { return () => { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); }; } _requeuePeriodicTimer(fn, interval, args, id) { return () => { // Requeue the timer callback if it's not been canceled. if (this.pendingPeriodicTimers.indexOf(id) !== -1) { this._scheduler.scheduleFunction(fn, interval, { args, isPeriodic: true, id, isRequeuePeriodic: true, }); } }; } _dequeuePeriodicTimer(id) { return () => { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); }; } _setTimeout(fn, delay, args, isTimer = true) { let removeTimerFn = this._dequeueTimer(Scheduler.nextId); // Queue the callback and dequeue the timer on success and error. let cb = this._fnAndFlush(fn, { onSuccess: removeTimerFn, onError: removeTimerFn }); let id = this._scheduler.scheduleFunction(cb, delay, { args, isRequestAnimationFrame: !isTimer }); if (isTimer) { this.pendingTimers.push(id); } return id; } _clearTimeout(id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); this._scheduler.removeScheduledFunctionWithId(id); } _setInterval(fn, interval, args) { let id = Scheduler.nextId; let completers = { onSuccess: null, onError: this._dequeuePeriodicTimer(id) }; let cb = this._fnAndFlush(fn, completers); // Use the callback created above to requeue on success. completers.onSuccess = this._requeuePeriodicTimer(cb, interval, args, id); // Queue the callback and dequeue the periodic timer only on error. this._scheduler.scheduleFunction(cb, interval, { args, isPeriodic: true }); this.pendingPeriodicTimers.push(id); return id; } _clearInterval(id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); this._scheduler.removeScheduledFunctionWithId(id); } _resetLastErrorAndThrow() { let error = this._lastError || this._uncaughtPromiseErrors[0]; this._uncaughtPromiseErrors.length = 0; this._lastError = null; throw error; } getCurrentTickTime() { return this._scheduler.getCurrentTickTime(); } getFakeSystemTime() { return this._scheduler.getFakeSystemTime(); } setFakeBaseSystemTime(realTime) { this._scheduler.setFakeBaseSystemTime(realTime); } getRealSystemTime() { return this._scheduler.getRealSystemTime(); } static patchDate() { if (!!global[Zone.__symbol__('disableDatePatching')]) { // we don't want to patch global Date // because in some case, global Date // is already being patched, we need to provide // an option to let user still use their // own version of Date. return; } if (global['Date'] === FakeDate) { // already patched return; } global['Date'] = FakeDate; FakeDate.prototype = OriginalDate.prototype; // try check and reset timers // because jasmine.clock().install() may // have replaced the global timer FakeAsyncTestZoneSpec.checkTimerPatch(); } static resetDate() { if (global['Date'] === FakeDate) { global['Date'] = OriginalDate; } } static checkTimerPatch() { if (!patchedTimers) { throw new Error('Expected timers to have been patched.'); } if (global.setTimeout !== patchedTimers.setTimeout) { global.setTimeout = patchedTimers.setTimeout; global.clearTimeout = patchedTimers.clearTimeout; } if (global.setInterval !== patchedTimers.setInterval) { global.setInterval = patchedTimers.setInterval; global.clearInterval = patchedTimers.clearInterval; } } lockDatePatch() { this.patchDateLocked = true; FakeAsyncTestZoneSpec.patchDate(); } unlockDatePatch() { this.patchDateLocked = false; FakeAsyncTestZoneSpec.resetDate(); } tickToNext(steps = 1, doTick, tickOptions = { processNewMacroTasksSynchronously: true }) { if (steps <= 0) { return; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tickToNext(steps, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } } tick(millis = 0, doTick, tickOptions = { processNewMacroTasksSynchronously: true }) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tick(millis, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } } flushMicrotasks() { FakeAsyncTestZoneSpec.assertInZone(); const flushErrors = () => { if (this._lastError !== null || this._uncaughtPromiseErrors.length) { // If there is an error stop processing the microtask queue and rethrow the error. this._resetLastErrorAndThrow(); } }; while (this._microtasks.length > 0) { let microtask = this._microtasks.shift(); microtask.func.apply(microtask.target, microtask.args); } flushErrors(); } flush(limit, flushPeriodic, doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); const elapsed = this._scheduler.flush(limit, flushPeriodic, doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; } flushOnlyPendingTimers(doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); const elapsed = this._scheduler.flushOnlyPendingTimers(doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; } removeAllTimers() { FakeAsyncTestZoneSpec.assertInZone(); this._scheduler.removeAll(); this.pendingPeriodicTimers = []; this.pendingTimers = []; } getTimerCount() { return this._scheduler.getTimerCount() + this._microtasks.length; } // ZoneSpec implementation below. name; properties = { 'FakeAsyncTestZoneSpec': this }; onScheduleTask(delegate, current, target, task) { switch (task.type) { case 'microTask': let args = task.data && task.data.args; // should pass additional arguments to callback if have any // currently we know process.nextTick will have such additional // arguments let additionalArgs; if (args) { let callbackIndex = task.data.cbIdx; if (typeof args.length === 'number' && args.length > callbackIndex + 1) { additionalArgs = Array.prototype.slice.call(args, callbackIndex + 1); } } this._microtasks.push({ func: task.invoke, args: additionalArgs, target: task.data && task.data.target, }); break; case 'macroTask': switch (task.source) { case 'setTimeout': task.data['handleId'] = this._setTimeout(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'setImmediate': task.data['handleId'] = this._setTimeout(task.invoke, 0, Array.prototype.slice.call(task.data['args'], 1)); break; case 'setInterval': task.data['handleId'] = this._setInterval(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'XMLHttpRequest.send': throw new Error('Cannot make XHRs from within a fake async test. Request URL: ' + task.data['url']); case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': // Simulate a requestAnimationFrame by using a setTimeout with 16 ms. // (60 frames per second) task.data['handleId'] = this._setTimeout(task.invoke, 16, task.data['args'], this.trackPendingRequestAnimationFrame); break; default: // user can define which macroTask they want to support by passing // macroTaskOptions const macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { const args = task.data && task.data['args']; const delay = args && args.length > 1 ? args[1] : 0; let callbackArgs = macroTaskOption.callbackArgs ? macroTaskOption.callbackArgs : args; if (!!macroTaskOption.isPeriodic) { // periodic macroTask, use setInterval to simulate task.data['handleId'] = this._setInterval(task.invoke, delay, callbackArgs); task.data.isPeriodic = true; } else { // not periodic, use setTimeout to simulate task.data['handleId'] = this._setTimeout(task.invoke, delay, callbackArgs); } break; } throw new Error('Unknown macroTask scheduled in fake async test: ' + task.source); } break; case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; } onCancelTask(delegate, current, target, task) { switch (task.source) { case 'setTimeout': case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': return this._clearTimeout(task.data['handleId']); case 'setInterval': return this._clearInterval(task.data['handleId']); default: // user can define which macroTask they want to support by passing // macroTaskOptions const macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { const handleId = task.data['handleId']; return macroTaskOption.isPeriodic ? this._clearInterval(handleId) : this._clearTimeout(handleId); } return delegate.cancelTask(target, task); } } onInvoke(delegate, current, target, callback, applyThis, applyArgs, source) { try { FakeAsyncTestZoneSpec.patchDate(); return delegate.invoke(target, callback, applyThis, applyArgs, source); } finally { if (!this.patchDateLocked) { FakeAsyncTestZoneSpec.resetDate(); } } } findMacroTaskOption(task) { if (!this.macroTaskOptions) { return null; } for (let i = 0; i < this.macroTaskOptions.length; i++) { const macroTaskOption = this.macroTaskOptions[i]; if (macroTaskOption.source === task.source) { return macroTaskOption; } } return null; } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { // ComponentFixture has a special-case handling to detect FakeAsyncTestZoneSpec // and prevent rethrowing the error from the onError subscription since it's handled here. this._lastError = error; return false; // Don't propagate error to parent zone. } } let _fakeAsyncTestZoneSpec = null; function getProxyZoneSpec() { return Zone && Zone['ProxyZoneSpec']; } let _sharedProxyZoneSpec = null; let _sharedProxyZone = null; /** * Clears out the shared fake async zone for a test. * To be called in a global `beforeEach`. * * @experimental */ function resetFakeAsyncZone() { if (_fakeAsyncTestZoneSpec) { _fakeAsyncTestZoneSpec.unlockDatePatch(); } _fakeAsyncTestZoneSpec = null; getProxyZoneSpec()?.get()?.resetDelegate(); _sharedProxyZoneSpec?.resetDelegate(); } /** * Wraps a function to be executed in the fakeAsync zone: * - microtasks are manually executed by calling `flushMicrotasks()`, * - timers are synchronous, `tick()` simulates the asynchronous passage of time. * * When flush is `false`, if there are any pending timers at the end of the function, * an exception will be thrown. * * Can be used to wrap inject() calls. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @param fn * @param options * flush: when true, will drain the macrotask queue after the test function completes. * @returns The function wrapped to be executed in the fakeAsync zone * * @experimental */ function fakeAsync(fn, options = {}) { const { flush = true } = options; // Not using an arrow function to preserve context passed from call site const fakeAsyncFn = function (...args) { const ProxyZoneSpec = getProxyZoneSpec(); if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the fakeAsync() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } const proxyZoneSpec = ProxyZoneSpec.assertPresent(); if (Zone.current.get('FakeAsyncTestZoneSpec')) { throw new Error('fakeAsync() calls can not be nested'); } try { // in case jasmine.clock init a fakeAsyncTestZoneSpec if (!_fakeAsyncTestZoneSpec) { const FakeAsyncTestZoneSpec = Zone && Zone['FakeAsyncTestZoneSpec']; if (proxyZoneSpec.getDelegate() instanceof FakeAsyncTestZoneSpec) { throw new Error('fakeAsync() calls can not be nested'); } _fakeAsyncTestZoneSpec = new FakeAsyncTestZoneSpec(); } let res; const lastProxyZoneSpec = proxyZoneSpec.getDelegate(); proxyZoneSpec.setDelegate(_fakeAsyncTestZoneSpec); _fakeAsyncTestZoneSpec.lockDatePatch(); try { res = fn.apply(this, args); if (flush) { _fakeAsyncTestZoneSpec.flush(20, true); } else { flushMicrotasks(); } } finally { proxyZoneSpec.setDelegate(lastProxyZoneSpec); } if (!flush) { if (_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length > 0) { throw new Error(`${_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length} ` + `periodic timer(s) still in the queue.`); } if (_fakeAsyncTestZoneSpec.pendingTimers.length > 0) { throw new Error(`${_fakeAsyncTestZoneSpec.pendingTimers.length} timer(s) still in the queue.`); } } return res; } finally { resetFakeAsyncZone(); } }; fakeAsyncFn.isFakeAsync = true; return fakeAsyncFn; } function _getFakeAsyncZoneSpec() { if (_fakeAsyncTestZoneSpec == null) { _fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (_fakeAsyncTestZoneSpec == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } return _fakeAsyncTestZoneSpec; } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone. * * The microtasks queue is drained at the very start of this function and after any timer * callback has been executed. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @experimental */ function tick(millis = 0, ignoreNestedTimeout = false) { _getFakeAsyncZoneSpec().tick(millis, null, ignoreNestedTimeout); } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone by * draining the macrotask queue until it is empty. The returned value is the milliseconds * of time that would have been elapsed. * * @param maxTurns * @returns The simulated time elapsed, in millis. * * @experimental */ function flush(maxTurns) { return _getFakeAsyncZoneSpec().flush(maxTurns); } /** * Discard all remaining periodic tasks. * * @experimental */ function discardPeriodicTasks() { const zoneSpec = _getFakeAsyncZoneSpec(); zoneSpec.pendingPeriodicTimers; zoneSpec.pendingPeriodicTimers.length = 0; } /** * Wraps a function to be executed in a shared ProxyZone. * * If no shared ProxyZone exists, one is created and reused for subsequent calls. * Useful for wrapping test setup (beforeEach) and test execution (it) when test * runner patching isn't available or desired for setting up the ProxyZone. * * @param fn The function to wrap. * @returns A function that executes the original function within the shared ProxyZone. * * @experimental */ function withProxyZone(fn) { const autoProxyFn = function (...args) { const proxyZoneSpec = getProxyZoneSpec(); if (proxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } const proxyZone = proxyZoneSpec.get() !== undefined ? Zone.current : getOrCreateRootProxy(); return proxyZone.run(fn, this, args); }; return autoProxyFn; } function getOrCreateRootProxy() { const ProxyZoneSpec = getProxyZoneSpec(); if (ProxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for withProxyZone but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } // Ensure the shared ProxyZoneSpec instance exists if (_sharedProxyZoneSpec === null) { _sharedProxyZoneSpec = new ProxyZoneSpec(); } _sharedProxyZone = Zone.root.fork(_sharedProxyZoneSpec); return _sharedProxyZone; } /** * Flush any pending microtasks. * * @experimental */ function flushMicrotasks() { _getFakeAsyncZoneSpec().flushMicrotasks(); } function patchFakeAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['FakeAsyncTestZoneSpec'] = FakeAsyncTestZoneSpec; Zone.__load_patch('fakeasync', (global, Zone, api) => { Zone[api.symbol('fakeAsyncTest')] = { resetFakeAsyncZone, flushMicrotasks, discardPeriodicTasks, tick, flush, fakeAsync, withProxyZone, }; }, true); patchedTimers = { setTimeout: global.setTimeout, setInterval: global.setInterval, clearTimeout: global.clearTimeout, clearInterval: global.clearInterval, nativeSetTimeout: global[Zone.__symbol__('setTimeout')], nativeClearTimeout: global[Zone.__symbol__('clearTimeout')], }; Scheduler.nextId = Scheduler.getNextId(); } patchFakeAsyncTest(Zone); hjx7s"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const global="object"==typeof window&&window||"object"==typeof self&&self||globalThis.global,OriginalDate=global.Date;function FakeDate(){if(0===arguments.length){const e=new OriginalDate;return e.setTime(FakeDate.now()),e}{const e=Array.prototype.slice.call(arguments);return new OriginalDate(...e)}}let patchedTimers;FakeDate.now=function(){const e=Zone.current.get("FakeAsyncTestZoneSpec");return e?e.getFakeSystemTime():OriginalDate.now.apply(this,arguments)},FakeDate.UTC=OriginalDate.UTC,FakeDate.parse=OriginalDate.parse;const timeoutCallback=function(){};class Scheduler{static nextNodeJSId=1;static nextId=-1;_schedulerQueue=[];_currentTickTime=0;_currentFakeBaseSystemTime=OriginalDate.now();_currentTickRequeuePeriodicEntries=[];constructor(){}static getNextId(){const e=patchedTimers.nativeSetTimeout.call(global,timeoutCallback,0);return patchedTimers.nativeClearTimeout.call(global,e),"number"==typeof e?e:Scheduler.nextNodeJSId++}getCurrentTickTime(){return this._currentTickTime}getFakeSystemTime(){return this._currentFakeBaseSystemTime+this._currentTickTime}setFakeBaseSystemTime(e){this._currentFakeBaseSystemTime=e}getRealSystemTime(){return OriginalDate.now()}scheduleFunction(e,t,s){let r=(s={args:[],isPeriodic:!1,isRequestAnimationFrame:!1,id:-1,isRequeuePeriodic:!1,...s}).id<0?Scheduler.nextId:s.id;Scheduler.nextId=Scheduler.getNextId();let n={endTime:this._currentTickTime+t,id:r,func:e,args:s.args,delay:t,isPeriodic:s.isPeriodic,isRequestAnimationFrame:s.isRequestAnimationFrame};s.isRequeuePeriodic&&this._currentTickRequeuePeriodicEntries.push(n);let i=0;for(;i0&&(this._currentTickRequeuePeriodicEntries=[],!(r=0&&this._schedulerQueue.splice(t,1)}if(n=this._currentTickTime,this._currentTickTime=e.endTime,t&&t(this._currentTickTime-n),!e.func.apply(global,e.isRequestAnimationFrame?[this._currentTickTime]:e.args))break;s.processNewMacroTasksSynchronously||this._currentTickRequeuePeriodicEntries.forEach((e=>{let t=0;for(;t0;){if(n++,n>e)throw new Error("flush failed after reaching the limit of "+e+" tasks. Does your code use a polling timeout?");if(0===this._schedulerQueue.filter((e=>!e.isPeriodic&&!e.isRequestAnimationFrame)).length)break;const s=this._schedulerQueue.shift();if(r=this._currentTickTime,this._currentTickTime=s.endTime,t&&t(this._currentTickTime-r),!s.func.apply(global,s.args))break}return this._currentTickTime-s}}class FakeAsyncTestZoneSpec{trackPendingRequestAnimationFrame;macroTaskOptions;static assertInZone(){if(null==Zone.current.get("FakeAsyncTestZoneSpec"))throw new Error("The code should be running in the fakeAsync zone to call this function")}_scheduler=new Scheduler;_microtasks=[];_lastError=null;_uncaughtPromiseErrors=Promise[Zone.__symbol__("uncaughtPromiseErrors")];pendingPeriodicTimers=[];pendingTimers=[];patchDateLocked=!1;constructor(e,t=!1,s){this.trackPendingRequestAnimationFrame=t,this.macroTaskOptions=s,this.name="fakeAsyncTestZone for "+e,this.macroTaskOptions||(this.macroTaskOptions=global[Zone.__symbol__("FakeAsyncTestMacroTask")])}_fnAndFlush(e,t){return(...s)=>(e.apply(global,s),null===this._lastError?(null!=t.onSuccess&&t.onSuccess.apply(global),this.flushMicrotasks()):null!=t.onError&&t.onError.apply(global),null===this._lastError)}static _removeTimer(e,t){let s=e.indexOf(t);s>-1&&e.splice(s,1)}_dequeueTimer(e){return()=>{FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers,e)}}_requeuePeriodicTimer(e,t,s,r){return()=>{-1!==this.pendingPeriodicTimers.indexOf(r)&&this._scheduler.scheduleFunction(e,t,{args:s,isPeriodic:!0,id:r,isRequeuePeriodic:!0})}}_dequeuePeriodicTimer(e){return()=>{FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers,e)}}_setTimeout(e,t,s,r=!0){let n=this._dequeueTimer(Scheduler.nextId),i=this._fnAndFlush(e,{onSuccess:n,onError:n}),a=this._scheduler.scheduleFunction(i,t,{args:s,isRequestAnimationFrame:!r});return r&&this.pendingTimers.push(a),a}_clearTimeout(e){FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers,e),this._scheduler.removeScheduledFunctionWithId(e)}_setInterval(e,t,s){let r=Scheduler.nextId,n={onSuccess:null,onError:this._dequeuePeriodicTimer(r)},i=this._fnAndFlush(e,n);return n.onSuccess=this._requeuePeriodicTimer(i,t,s,r),this._scheduler.scheduleFunction(i,t,{args:s,isPeriodic:!0}),this.pendingPeriodicTimers.push(r),r}_clearInterval(e){FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers,e),this._scheduler.removeScheduledFunctionWithId(e)}_resetLastErrorAndThrow(){let e=this._lastError||this._uncaughtPromiseErrors[0];throw this._uncaughtPromiseErrors.length=0,this._lastError=null,e}getCurrentTickTime(){return this._scheduler.getCurrentTickTime()}getFakeSystemTime(){return this._scheduler.getFakeSystemTime()}setFakeBaseSystemTime(e){this._scheduler.setFakeBaseSystemTime(e)}getRealSystemTime(){return this._scheduler.getRealSystemTime()}static patchDate(){global[Zone.__symbol__("disableDatePatching")]||global.Date!==FakeDate&&(global.Date=FakeDate,FakeDate.prototype=OriginalDate.prototype,FakeAsyncTestZoneSpec.checkTimerPatch())}static resetDate(){global.Date===FakeDate&&(global.Date=OriginalDate)}static checkTimerPatch(){if(!patchedTimers)throw new Error("Expected timers to have been patched.");global.setTimeout!==patchedTimers.setTimeout&&(global.setTimeout=patchedTimers.setTimeout,global.clearTimeout=patchedTimers.clearTimeout),global.setInterval!==patchedTimers.setInterval&&(global.setInterval=patchedTimers.setInterval,global.clearInterval=patchedTimers.clearInterval)}lockDatePatch(){this.patchDateLocked=!0,FakeAsyncTestZoneSpec.patchDate()}unlockDatePatch(){this.patchDateLocked=!1,FakeAsyncTestZoneSpec.resetDate()}tickToNext(e=1,t,s={processNewMacroTasksSynchronously:!0}){e<=0||(FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks(),this._scheduler.tickToNext(e,t,s),null!==this._lastError&&this._resetLastErrorAndThrow())}tick(e=0,t,s={processNewMacroTasksSynchronously:!0}){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks(),this._scheduler.tick(e,t,s),null!==this._lastError&&this._resetLastErrorAndThrow()}flushMicrotasks(){for(FakeAsyncTestZoneSpec.assertInZone();this._microtasks.length>0;){let e=this._microtasks.shift();e.func.apply(e.target,e.args)}(()=>{(null!==this._lastError||this._uncaughtPromiseErrors.length)&&this._resetLastErrorAndThrow()})()}flush(e,t,s){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks();const r=this._scheduler.flush(e,t,s);return null!==this._lastError&&this._resetLastErrorAndThrow(),r}flushOnlyPendingTimers(e){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks();const t=this._scheduler.flushOnlyPendingTimers(e);return null!==this._lastError&&this._resetLastErrorAndThrow(),t}removeAllTimers(){FakeAsyncTestZoneSpec.assertInZone(),this._scheduler.removeAll(),this.pendingPeriodicTimers=[],this.pendingTimers=[]}getTimerCount(){return this._scheduler.getTimerCount()+this._microtasks.length}name;properties={FakeAsyncTestZoneSpec:this};onScheduleTask(e,t,s,r){switch(r.type){case"microTask":let t,n=r.data&&r.data.args;if(n){let e=r.data.cbIdx;"number"==typeof n.length&&n.length>e+1&&(t=Array.prototype.slice.call(n,e+1))}this._microtasks.push({func:r.invoke,args:t,target:r.data&&r.data.target});break;case"macroTask":switch(r.source){case"setTimeout":r.data.handleId=this._setTimeout(r.invoke,r.data.delay,Array.prototype.slice.call(r.data.args,2));break;case"setImmediate":r.data.handleId=this._setTimeout(r.invoke,0,Array.prototype.slice.call(r.data.args,1));break;case"setInterval":r.data.handleId=this._setInterval(r.invoke,r.data.delay,Array.prototype.slice.call(r.data.args,2));break;case"XMLHttpRequest.send":throw new Error("Cannot make XHRs from within a fake async test. Request URL: "+r.data.url);case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":r.data.handleId=this._setTimeout(r.invoke,16,r.data.args,this.trackPendingRequestAnimationFrame);break;default:const e=this.findMacroTaskOption(r);if(e){const t=r.data&&r.data.args,s=t&&t.length>1?t[1]:0;let n=e.callbackArgs?e.callbackArgs:t;e.isPeriodic?(r.data.handleId=this._setInterval(r.invoke,s,n),r.data.isPeriodic=!0):r.data.handleId=this._setTimeout(r.invoke,s,n);break}throw new Error("Unknown macroTask scheduled in fake async test: "+r.source)}break;case"eventTask":r=e.scheduleTask(s,r)}return r}onCancelTask(e,t,s,r){switch(r.source){case"setTimeout":case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":return this._clearTimeout(r.data.handleId);case"setInterval":return this._clearInterval(r.data.handleId);default:const t=this.findMacroTaskOption(r);if(t){const e=r.data.handleId;return t.isPeriodic?this._clearInterval(e):this._clearTimeout(e)}return e.cancelTask(s,r)}}onInvoke(e,t,s,r,n,i,a){try{return FakeAsyncTestZoneSpec.patchDate(),e.invoke(s,r,n,i,a)}finally{this.patchDateLocked||FakeAsyncTestZoneSpec.resetDate()}}findMacroTaskOption(e){if(!this.macroTaskOptions)return null;for(let t=0;t0)throw new Error(`${_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length} periodic timer(s) still in the queue.`);if(_fakeAsyncTestZoneSpec.pendingTimers.length>0)throw new Error(`${_fakeAsyncTestZoneSpec.pendingTimers.length} timer(s) still in the queue.`)}return r}finally{resetFakeAsyncZone()}};return r.isFakeAsync=!0,r}function _getFakeAsyncZoneSpec(){if(null==_fakeAsyncTestZoneSpec&&(_fakeAsyncTestZoneSpec=Zone.current.get("FakeAsyncTestZoneSpec"),null==_fakeAsyncTestZoneSpec))throw new Error("The code should be running in the fakeAsync zone to call this function");return _fakeAsyncTestZoneSpec}function tick(e=0,t=!1){_getFakeAsyncZoneSpec().tick(e,null,t)}function flush(e){return _getFakeAsyncZoneSpec().flush(e)}function discardPeriodicTasks(){_getFakeAsyncZoneSpec().pendingPeriodicTimers.length=0}function withProxyZone(e){return function(...t){const s=getProxyZoneSpec();if(void 0===s)throw new Error("ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. Make sure that your environment includes zone-testing.js");return(void 0!==s.get()?Zone.current:getOrCreateRootProxy()).run(e,this,t)}}function getOrCreateRootProxy(){const e=getProxyZoneSpec();if(void 0===e)throw new Error("ProxyZoneSpec is needed for withProxyZone but could not be found. Make sure that your environment includes zone-testing.js");return null===_sharedProxyZoneSpec&&(_sharedProxyZoneSpec=new e),_sharedProxyZone=Zone.root.fork(_sharedProxyZoneSpec),_sharedProxyZone}function flushMicrotasks(){_getFakeAsyncZoneSpec().flushMicrotasks()}function patchFakeAsyncTest(e){e.FakeAsyncTestZoneSpec=FakeAsyncTestZoneSpec,e.__load_patch("fakeasync",((e,t,s)=>{t[s.symbol("fakeAsyncTest")]={resetFakeAsyncZone:resetFakeAsyncZone,flushMicrotasks:flushMicrotasks,discardPeriodicTasks:discardPeriodicTasks,tick:tick,flush:flush,fakeAsync:fakeAsync,withProxyZone:withProxyZone}}),!0),patchedTimers={setTimeout:global.setTimeout,setInterval:global.setInterval,clearTimeout:global.clearTimeout,clearInterval:global.clearInterval,nativeSetTimeout:global[e.__symbol__("setTimeout")],nativeClearTimeout:global[e.__symbol__("clearTimeout")]},Scheduler.nextId=Scheduler.getNextId()}patchFakeAsyncTest(Zone);==xE2'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchJasmine(Zone) { Zone.__load_patch('jasmine', (global, Zone, api) => { const __extends = function (d, b) { for (const p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : ((__.prototype = b.prototype), new __()); }; // Patch jasmine's describe/it/beforeEach/afterEach functions so test code always runs // in a testZone (ProxyZone). (See: angular/zone.js#91 & angular/angular#10503) if (!Zone) throw new Error('Missing: zone.js'); if (typeof jest !== 'undefined') { // return if jasmine is a light implementation inside jest // in this case, we are running inside jest not jasmine return; } if (typeof jasmine == 'undefined' || jasmine['__zone_patch__']) { return; } jasmine['__zone_patch__'] = true; const SyncTestZoneSpec = Zone['SyncTestZoneSpec']; const ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!SyncTestZoneSpec) throw new Error('Missing: SyncTestZoneSpec'); if (!ProxyZoneSpec) throw new Error('Missing: ProxyZoneSpec'); const ambientZone = Zone.current; const symbol = Zone.__symbol__; // whether patch jasmine clock when in fakeAsync const disablePatchingJasmineClock = global[symbol('fakeAsyncDisablePatchingClock')] === true; // the original variable name fakeAsyncPatchLock is not accurate, so the name will be // fakeAsyncAutoFakeAsyncWhenClockPatched and if this enablePatchingJasmineClock is false, we // also automatically disable the auto jump into fakeAsync feature const enableAutoFakeAsyncWhenClockPatched = !disablePatchingJasmineClock && (global[symbol('fakeAsyncPatchLock')] === true || global[symbol('fakeAsyncAutoFakeAsyncWhenClockPatched')] === true); const ignoreUnhandledRejection = global[symbol('ignoreUnhandledRejection')] === true; if (!ignoreUnhandledRejection) { const globalErrors = jasmine.GlobalErrors; if (globalErrors && !jasmine[symbol('GlobalErrors')]) { jasmine[symbol('GlobalErrors')] = globalErrors; jasmine.GlobalErrors = function () { const instance = new globalErrors(); const originalInstall = instance.install; if (originalInstall && !instance[symbol('install')]) { instance[symbol('install')] = originalInstall; instance.install = function () { const isNode = typeof process !== 'undefined' && !!process.on; // Note: Jasmine checks internally if `process` and `process.on` is defined. // Otherwise, it installs the browser rejection handler through the // `global.addEventListener`. This code may be run in the browser environment where // `process` is not defined, and this will lead to a runtime exception since webpack 5 // removed automatic Node.js polyfills. Note, that events are named differently, it's // `unhandledRejection` in Node.js and `unhandledrejection` in the browser. const originalHandlers = isNode ? process.listeners('unhandledRejection') : global.eventListeners('unhandledrejection'); const result = originalInstall.apply(this, arguments); isNode ? process.removeAllListeners('unhandledRejection') : global.removeAllListeners('unhandledrejection'); if (originalHandlers) { originalHandlers.forEach((handler) => { if (isNode) { process.on('unhandledRejection', handler); } else { global.addEventListener('unhandledrejection', handler); } }); } return result; }; } return instance; }; } } // Monkey patch all of the jasmine DSL so that each function runs in appropriate zone. const jasmineEnv = jasmine.getEnv(); ['describe', 'xdescribe', 'fdescribe'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[methodName] = function (description, specDefinitions) { return originalJasmineFn.call(this, description, wrapDescribeInZone(description, specDefinitions)); }; }); ['it', 'xit', 'fit'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (description, specDefinitions, timeout) { arguments[1] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); ['beforeEach', 'afterEach', 'beforeAll', 'afterAll'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (specDefinitions, timeout) { arguments[0] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); if (!disablePatchingJasmineClock) { // need to patch jasmine.clock().mockDate and jasmine.clock().tick() so // they can work properly in FakeAsyncTest const originalClockFn = (jasmine[symbol('clock')] = jasmine['clock']); jasmine['clock'] = function () { const clock = originalClockFn.apply(this, arguments); if (!clock[symbol('patched')]) { clock[symbol('patched')] = symbol('patched'); const originalTick = (clock[symbol('tick')] = clock.tick); clock.tick = function () { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { return fakeAsyncZoneSpec.tick.apply(fakeAsyncZoneSpec, arguments); } return originalTick.apply(this, arguments); }; const originalMockDate = (clock[symbol('mockDate')] = clock.mockDate); clock.mockDate = function () { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { const dateTime = arguments.length > 0 ? arguments[0] : new Date(); return fakeAsyncZoneSpec.setFakeBaseSystemTime.apply(fakeAsyncZoneSpec, dateTime && typeof dateTime.getTime === 'function' ? [dateTime.getTime()] : arguments); } return originalMockDate.apply(this, arguments); }; // for auto go into fakeAsync feature, we need the flag to enable it if (enableAutoFakeAsyncWhenClockPatched) { ['install', 'uninstall'].forEach((methodName) => { const originalClockFn = (clock[symbol(methodName)] = clock[methodName]); clock[methodName] = function () { const FakeAsyncTestZoneSpec = Zone['FakeAsyncTestZoneSpec']; if (FakeAsyncTestZoneSpec) { jasmine[symbol('clockInstalled')] = 'install' === methodName; return; } return originalClockFn.apply(this, arguments); }; }); } } return clock; }; } // monkey patch createSpyObj to make properties enumerable to true if (!jasmine[Zone.__symbol__('createSpyObj')]) { const originalCreateSpyObj = jasmine.createSpyObj; jasmine[Zone.__symbol__('createSpyObj')] = originalCreateSpyObj; jasmine.createSpyObj = function () { const args = Array.prototype.slice.call(arguments); const propertyNames = args.length >= 3 ? args[2] : null; let spyObj; if (propertyNames) { const defineProperty = Object.defineProperty; Object.defineProperty = function (obj, p, attributes) { return defineProperty.call(this, obj, p, { ...attributes, configurable: true, enumerable: true, }); }; try { spyObj = originalCreateSpyObj.apply(this, args); } finally { Object.defineProperty = defineProperty; } } else { spyObj = originalCreateSpyObj.apply(this, args); } return spyObj; }; } /** * Gets a function wrapping the body of a Jasmine `describe` block to execute in a * synchronous-only zone. */ function wrapDescribeInZone(description, describeBody) { return function () { // Create a synchronous-only zone in which to run `describe` blocks in order to raise an // error if any asynchronous operations are attempted inside of a `describe`. const syncZone = ambientZone.fork(new SyncTestZoneSpec(`jasmine.describe#${description}`)); return syncZone.run(describeBody, this, arguments); }; } function runInTestZone(testBody, applyThis, queueRunner, done) { const isClockInstalled = !!jasmine[symbol('clockInstalled')]; queueRunner.testProxyZoneSpec; const testProxyZone = queueRunner.testProxyZone; if (isClockInstalled && enableAutoFakeAsyncWhenClockPatched) { // auto run a fakeAsync const fakeAsyncModule = Zone[Zone.__symbol__('fakeAsyncTest')]; if (fakeAsyncModule && typeof fakeAsyncModule.fakeAsync === 'function') { testBody = fakeAsyncModule.fakeAsync(testBody); } } if (done) { return testProxyZone.run(testBody, applyThis, [done]); } else { return testProxyZone.run(testBody, applyThis); } } /** * Gets a function wrapping the body of a Jasmine `it/beforeEach/afterEach` block to * execute in a ProxyZone zone. * This will run in `testProxyZone`. The `testProxyZone` will be reset by the `ZoneQueueRunner` */ function wrapTestInZone(testBody) { // The `done` callback is only passed through if the function expects at least one argument. // Note we have to make a function with correct number of arguments, otherwise jasmine will // think that all functions are sync or async. return (testBody && (testBody.length ? function (done) { return runInTestZone(testBody, this, this.queueRunner, done); } : function () { return runInTestZone(testBody, this, this.queueRunner); })); } const QueueRunner = jasmine.QueueRunner; jasmine.QueueRunner = (function (_super) { __extends(ZoneQueueRunner, _super); function ZoneQueueRunner(attrs) { if (attrs.onComplete) { attrs.onComplete = ((fn) => () => { // All functions are done, clear the test zone. this.testProxyZone = null; this.testProxyZoneSpec = null; ambientZone.scheduleMicroTask('jasmine.onComplete', fn); })(attrs.onComplete); } const nativeSetTimeout = global[Zone.__symbol__('setTimeout')]; const nativeClearTimeout = global[Zone.__symbol__('clearTimeout')]; if (nativeSetTimeout) { // should run setTimeout inside jasmine outside of zone attrs.timeout = { setTimeout: nativeSetTimeout ? nativeSetTimeout : global.setTimeout, clearTimeout: nativeClearTimeout ? nativeClearTimeout : global.clearTimeout, }; } // create a userContext to hold the queueRunner itself // so we can access the testProxy in it/xit/beforeEach ... if (jasmine.UserContext) { if (!attrs.userContext) { attrs.userContext = new jasmine.UserContext(); } attrs.userContext.queueRunner = this; } else { if (!attrs.userContext) { attrs.userContext = {}; } attrs.userContext.queueRunner = this; } // patch attrs.onException const onException = attrs.onException; attrs.onException = function (error) { if (error && error.message === 'Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.') { // jasmine timeout, we can make the error message more // reasonable to tell what tasks are pending const proxyZoneSpec = this && this.testProxyZoneSpec; if (proxyZoneSpec) { const pendingTasksInfo = proxyZoneSpec.getAndClearPendingTasksInfo(); try { // try catch here in case error.message is not writable error.message += pendingTasksInfo; } catch (err) { } } } if (onException) { onException.call(this, error); } }; _super.call(this, attrs); } ZoneQueueRunner.prototype.execute = function () { let zone = Zone.current; let isChildOfAmbientZone = false; while (zone) { if (zone === ambientZone) { isChildOfAmbientZone = true; break; } zone = zone.parent; } if (!isChildOfAmbientZone) throw new Error('Unexpected Zone: ' + Zone.current.name); // This is the zone which will be used for running individual tests. // It will be a proxy zone, so that the tests function can retroactively install // different zones. // Example: // - In beforeEach() do childZone = Zone.current.fork(...); // - In it() try to do fakeAsync(). The issue is that because the beforeEach forked the // zone outside of fakeAsync it will be able to escape the fakeAsync rules. // - Because ProxyZone is parent fo `childZone` fakeAsync can retroactively add // fakeAsync behavior to the childZone. this.testProxyZoneSpec = new ProxyZoneSpec(); this.testProxyZone = ambientZone.fork(this.testProxyZoneSpec); if (!Zone.currentTask) { // if we are not running in a task then if someone would register a // element.addEventListener and then calling element.click() the // addEventListener callback would think that it is the top most task and would // drain the microtask queue on element.click() which would be incorrect. // For this reason we always force a task when running jasmine tests. Zone.current.scheduleMicroTask('jasmine.execute().forceTask', () => QueueRunner.prototype.execute.call(this)); } else { _super.prototype.execute.call(this); } }; return ZoneQueueRunner; })(QueueRunner); }); } patchJasmine(Zone); x'"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchJasmine(e){e.__load_patch("jasmine",((e,n,t)=>{if(!n)throw new Error("Missing: zone.js");if("undefined"!=typeof jest)return;if("undefined"==typeof jasmine||jasmine.__zone_patch__)return;jasmine.__zone_patch__=!0;const o=n.SyncTestZoneSpec,s=n.ProxyZoneSpec;if(!o)throw new Error("Missing: SyncTestZoneSpec");if(!s)throw new Error("Missing: ProxyZoneSpec");const r=n.current,c=n.__symbol__,i=!0===e[c("fakeAsyncDisablePatchingClock")],a=!i&&(!0===e[c("fakeAsyncPatchLock")]||!0===e[c("fakeAsyncAutoFakeAsyncWhenClockPatched")]);if(!0!==e[c("ignoreUnhandledRejection")]){const n=jasmine.GlobalErrors;n&&!jasmine[c("GlobalErrors")]&&(jasmine[c("GlobalErrors")]=n,jasmine.GlobalErrors=function(){const t=new n,o=t.install;return o&&!t[c("install")]&&(t[c("install")]=o,t.install=function(){const n="undefined"!=typeof process&&!!process.on,t=n?process.listeners("unhandledRejection"):e.eventListeners("unhandledrejection"),s=o.apply(this,arguments);return n?process.removeAllListeners("unhandledRejection"):e.removeAllListeners("unhandledrejection"),t&&t.forEach((t=>{n?process.on("unhandledRejection",t):e.addEventListener("unhandledrejection",t)})),s}),t})}const l=jasmine.getEnv();if(["describe","xdescribe","fdescribe"].forEach((e=>{let n=l[e];l[e]=function(e,t){return n.call(this,e,function s(e,n){return function(){return r.fork(new o(`jasmine.describe#${e}`)).run(n,this,arguments)}}(e,t))}})),["it","xit","fit"].forEach((e=>{let n=l[e];l[c(e)]=n,l[e]=function(e,t,o){return arguments[1]=p(t),n.apply(this,arguments)}})),["beforeEach","afterEach","beforeAll","afterAll"].forEach((e=>{let n=l[e];l[c(e)]=n,l[e]=function(e,t){return arguments[0]=p(e),n.apply(this,arguments)}})),!i){const e=jasmine[c("clock")]=jasmine.clock;jasmine.clock=function(){const t=e.apply(this,arguments);if(!t[c("patched")]){t[c("patched")]=c("patched");const e=t[c("tick")]=t.tick;t.tick=function(){const t=n.current.get("FakeAsyncTestZoneSpec");return t?t.tick.apply(t,arguments):e.apply(this,arguments)};const o=t[c("mockDate")]=t.mockDate;t.mockDate=function(){const e=n.current.get("FakeAsyncTestZoneSpec");if(e){const n=arguments.length>0?arguments[0]:new Date;return e.setFakeBaseSystemTime.apply(e,n&&"function"==typeof n.getTime?[n.getTime()]:arguments)}return o.apply(this,arguments)},a&&["install","uninstall"].forEach((e=>{const o=t[c(e)]=t[e];t[e]=function(){if(!n.FakeAsyncTestZoneSpec)return o.apply(this,arguments);jasmine[c("clockInstalled")]="install"===e}}))}return t}}if(!jasmine[n.__symbol__("createSpyObj")]){const e=jasmine.createSpyObj;jasmine[n.__symbol__("createSpyObj")]=e,jasmine.createSpyObj=function(){const n=Array.prototype.slice.call(arguments);let t;if(n.length>=3&&n[2]){const o=Object.defineProperty;Object.defineProperty=function(e,n,t){return o.call(this,e,n,{...t,configurable:!0,enumerable:!0})};try{t=e.apply(this,n)}finally{Object.defineProperty=o}}else t=e.apply(this,n);return t}}function u(e,t,o,s){const r=!!jasmine[c("clockInstalled")],i=o.testProxyZone;if(r&&a){const t=n[n.__symbol__("fakeAsyncTest")];t&&"function"==typeof t.fakeAsync&&(e=t.fakeAsync(e))}return s?i.run(e,t,[s]):i.run(e,t)}function p(e){return e&&(e.length?function(n){return u(e,this,this.queueRunner,n)}:function(){return u(e,this,this.queueRunner)})}const f=jasmine.QueueRunner;jasmine.QueueRunner=function(t){function o(o){o.onComplete&&(o.onComplete=(e=>()=>{this.testProxyZone=null,this.testProxyZoneSpec=null,r.scheduleMicroTask("jasmine.onComplete",e)})(o.onComplete));const s=e[n.__symbol__("setTimeout")],c=e[n.__symbol__("clearTimeout")];s&&(o.timeout={setTimeout:s||e.setTimeout,clearTimeout:c||e.clearTimeout}),jasmine.UserContext?(o.userContext||(o.userContext=new jasmine.UserContext),o.userContext.queueRunner=this):(o.userContext||(o.userContext={}),o.userContext.queueRunner=this);const i=o.onException;o.onException=function(e){if(e&&"Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL."===e.message){const n=this&&this.testProxyZoneSpec;if(n){const t=n.getAndClearPendingTasksInfo();try{e.message+=t}catch(e){}}}i&&i.call(this,e)},t.call(this,o)}return function(e,n){for(const t in n)n.hasOwnProperty(t)&&(e[t]=n[t]);function t(){this.constructor=e}e.prototype=null===n?Object.create(n):(t.prototype=n.prototype,new t)}(o,t),o.prototype.execute=function(){let e=n.current,o=!1;for(;e;){if(e===r){o=!0;break}e=e.parent}if(!o)throw new Error("Unexpected Zone: "+n.current.name);this.testProxyZoneSpec=new s,this.testProxyZone=r.fork(this.testProxyZoneSpec),n.currentTask?t.prototype.execute.call(this):n.current.scheduleMicroTask("jasmine.execute().forceTask",(()=>f.prototype.execute.call(this)))},o}(f)}))}patchJasmine(Zone);0G<x'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /** * @fileoverview * @suppress {globalThis} */ function patchLongStackTrace(Zone) { const NEWLINE = '\n'; const IGNORE_FRAMES = {}; const creationTrace = '__creationTrace__'; const ERROR_TAG = 'STACKTRACE TRACKING'; const SEP_TAG = '__SEP_TAG__'; let sepTemplate = SEP_TAG + '@[native]'; class LongStackTrace { error = getStacktrace(); timestamp = new Date(); } function getStacktraceWithUncaughtError() { return new Error(ERROR_TAG); } function getStacktraceWithCaughtError() { try { throw getStacktraceWithUncaughtError(); } catch (err) { return err; } } // Some implementations of exception handling don't create a stack trace if the exception // isn't thrown, however it's faster not to actually throw the exception. const error = getStacktraceWithUncaughtError(); const caughtError = getStacktraceWithCaughtError(); const getStacktrace = error.stack ? getStacktraceWithUncaughtError : caughtError.stack ? getStacktraceWithCaughtError : getStacktraceWithUncaughtError; function getFrames(error) { return error.stack ? error.stack.split(NEWLINE) : []; } function addErrorStack(lines, error) { let trace = getFrames(error); for (let i = 0; i < trace.length; i++) { const frame = trace[i]; // Filter out the Frames which are part of stack capturing. if (!IGNORE_FRAMES.hasOwnProperty(frame)) { lines.push(trace[i]); } } } function renderLongStackTrace(frames, stack) { const longTrace = [stack ? stack.trim() : '']; if (frames) { let timestamp = new Date().getTime(); for (let i = 0; i < frames.length; i++) { const traceFrames = frames[i]; const lastTime = traceFrames.timestamp; let separator = `____________________Elapsed ${timestamp - lastTime.getTime()} ms; At: ${lastTime}`; separator = separator.replace(/[^\w\d]/g, '_'); longTrace.push(sepTemplate.replace(SEP_TAG, separator)); addErrorStack(longTrace, traceFrames.error); timestamp = lastTime.getTime(); } } return longTrace.join(NEWLINE); } // if Error.stackTraceLimit is 0, means stack trace // is disabled, so we don't need to generate long stack trace // this will improve performance in some test(some test will // set stackTraceLimit to 0, https://github.com/angular/zone.js/issues/698 function stackTracesEnabled() { // Cast through any since this property only exists on Error in the nodejs // typings. return Error.stackTraceLimit > 0; } Zone['longStackTraceZoneSpec'] = { name: 'long-stack-trace', longStackTraceLimit: 10, // Max number of task to keep the stack trace for. // add a getLongStackTrace method in spec to // handle handled reject promise error. getLongStackTrace: function (error) { if (!error) { return undefined; } const trace = error[Zone.__symbol__('currentTaskTrace')]; if (!trace) { return error.stack; } return renderLongStackTrace(trace, error.stack); }, onScheduleTask: function (parentZoneDelegate, currentZone, targetZone, task) { if (stackTracesEnabled()) { const currentTask = Zone.currentTask; let trace = (currentTask && currentTask.data && currentTask.data[creationTrace]) || []; trace = [new LongStackTrace()].concat(trace); if (trace.length > this.longStackTraceLimit) { trace.length = this.longStackTraceLimit; } if (!task.data) task.data = {}; if (task.type === 'eventTask') { // Fix issue https://github.com/angular/zone.js/issues/1195, // For event task of browser, by default, all task will share a // singleton instance of data object, we should create a new one here // The cast to `any` is required to workaround a closure bug which wrongly applies // URL sanitization rules to .data access. task.data = { ...task.data }; } task.data[creationTrace] = trace; } return parentZoneDelegate.scheduleTask(targetZone, task); }, onHandleError: function (parentZoneDelegate, currentZone, targetZone, error) { if (stackTracesEnabled()) { const parentTask = Zone.currentTask || error.task; if (error instanceof Error && parentTask) { const longStack = renderLongStackTrace(parentTask.data && parentTask.data[creationTrace], error.stack); try { error.stack = error.longStack = longStack; } catch (err) { } } } return parentZoneDelegate.handleError(targetZone, error); }, }; function captureStackTraces(stackTraces, count) { if (count > 0) { stackTraces.push(getFrames(new LongStackTrace().error)); captureStackTraces(stackTraces, count - 1); } } function computeIgnoreFrames() { if (!stackTracesEnabled()) { return; } const frames = []; captureStackTraces(frames, 2); const frames1 = frames[0]; const frames2 = frames[1]; for (let i = 0; i < frames1.length; i++) { const frame1 = frames1[i]; if (frame1.indexOf(ERROR_TAG) == -1) { let match = frame1.match(/^\s*at\s+/); if (match) { sepTemplate = match[0] + SEP_TAG + ' (http://localhost)'; break; } } } for (let i = 0; i < frames1.length; i++) { const frame1 = frames1[i]; const frame2 = frames2[i]; if (frame1 === frame2) { IGNORE_FRAMES[frame1] = true; } else { break; } } } computeIgnoreFrames(); } patchLongStackTrace(Zone); 7wxx"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchLongStackTrace(t){const n={},e="__creationTrace__",a="STACKTRACE TRACKING",r="__SEP_TAG__";let c=r+"@[native]";class o{error=u();timestamp=new Date}function s(){return new Error(a)}function i(){try{throw s()}catch(t){return t}}const l=s(),_=i(),u=l.stack?s:_.stack?i:s;function f(t){return t.stack?t.stack.split("\n"):[]}function k(t,e){let a=f(e);for(let e=0;e0}function g(t,n){n>0&&(t.push(f((new o).error)),g(t,n-1))}t.longStackTraceZoneSpec={name:"long-stack-trace",longStackTraceLimit:10,getLongStackTrace:function(n){if(!n)return;const e=n[t.__symbol__("currentTaskTrace")];return e?h(e,n.stack):n.stack},onScheduleTask:function(n,a,r,c){if(T()){const n=t.currentTask;let a=n&&n.data&&n.data[e]||[];a=[new o].concat(a),a.length>this.longStackTraceLimit&&(a.length=this.longStackTraceLimit),c.data||(c.data={}),"eventTask"===c.type&&(c.data={...c.data}),c.data[e]=a}return n.scheduleTask(r,c)},onHandleError:function(n,a,r,c){if(T()){const n=t.currentTask||c.task;if(c instanceof Error&&n){const t=h(n.data&&n.data[e],c.stack);try{c.stack=c.longStack=t}catch(t){}}}return n.handleError(r,c)}},function d(){if(!T())return;const t=[];g(t,2);const e=t[0],o=t[1];for(let t=0;t * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchMocha(Zone) { Zone.__load_patch('mocha', (global, Zone) => { const Mocha = global.Mocha; if (typeof Mocha === 'undefined') { // return if Mocha is not available, because now zone-testing // will load mocha patch with jasmine/jest patch return; } if (typeof Zone === 'undefined') { throw new Error('Missing Zone.js'); } const ProxyZoneSpec = Zone['ProxyZoneSpec']; const SyncTestZoneSpec = Zone['SyncTestZoneSpec']; if (!ProxyZoneSpec) { throw new Error('Missing ProxyZoneSpec'); } if (Mocha['__zone_patch__']) { throw new Error('"Mocha" has already been patched with "Zone".'); } Mocha['__zone_patch__'] = true; const rootZone = Zone.current; const syncZone = rootZone.fork(new SyncTestZoneSpec('Mocha.describe')); let testZone = null; const suiteZone = rootZone.fork(new ProxyZoneSpec()); const mochaOriginal = { after: global.after, afterEach: global.afterEach, before: global.before, beforeEach: global.beforeEach, describe: global.describe, it: global.it, }; function modifyArguments(args, syncTest, asyncTest) { for (let i = 0; i < args.length; i++) { let arg = args[i]; if (typeof arg === 'function') { // The `done` callback is only passed through if the function expects at // least one argument. // Note we have to make a function with correct number of arguments, // otherwise mocha will // think that all functions are sync or async. args[i] = arg.length === 0 ? syncTest(arg) : asyncTest(arg); // Mocha uses toString to view the test body in the result list, make sure we return the // correct function body args[i].toString = function () { return arg.toString(); }; } } return args; } function wrapDescribeInZone(args) { const syncTest = function (fn) { return function () { return syncZone.run(fn, this, arguments); }; }; return modifyArguments(args, syncTest); } function wrapTestInZone(args) { const asyncTest = function (fn) { return function (done) { return testZone.run(fn, this, [done]); }; }; const syncTest = function (fn) { return function () { return testZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } function wrapSuiteInZone(args) { const asyncTest = function (fn) { return function (done) { return suiteZone.run(fn, this, [done]); }; }; const syncTest = function (fn) { return function () { return suiteZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } global.describe = global.suite = function () { return mochaOriginal.describe.apply(this, wrapDescribeInZone(arguments)); }; global.xdescribe = global.suite.skip = global.describe.skip = function () { return mochaOriginal.describe.skip.apply(this, wrapDescribeInZone(arguments)); }; global.describe.only = global.suite.only = function () { return mochaOriginal.describe.only.apply(this, wrapDescribeInZone(arguments)); }; global.it = global.specify = global.test = function () { return mochaOriginal.it.apply(this, wrapTestInZone(arguments)); }; global.xit = global.xspecify = global.it.skip = function () { return mochaOriginal.it.skip.apply(this, wrapTestInZone(arguments)); }; global.it.only = global.test.only = function () { return mochaOriginal.it.only.apply(this, wrapTestInZone(arguments)); }; global.after = global.suiteTeardown = function () { return mochaOriginal.after.apply(this, wrapSuiteInZone(arguments)); }; global.afterEach = global.teardown = function () { return mochaOriginal.afterEach.apply(this, wrapTestInZone(arguments)); }; global.before = global.suiteSetup = function () { return mochaOriginal.before.apply(this, wrapSuiteInZone(arguments)); }; global.beforeEach = global.setup = function () { return mochaOriginal.beforeEach.apply(this, wrapTestInZone(arguments)); }; ((originalRunTest, originalRun) => { Mocha.Runner.prototype.runTest = function (fn) { Zone.current.scheduleMicroTask('mocha.forceTask', () => { originalRunTest.call(this, fn); }); }; Mocha.Runner.prototype.run = function (fn) { this.on('test', (e) => { testZone = rootZone.fork(new ProxyZoneSpec()); }); this.on('fail', (test, err) => { const proxyZoneSpec = testZone && testZone.get('ProxyZoneSpec'); if (proxyZoneSpec && err) { try { // try catch here in case err.message is not writable err.message += proxyZoneSpec.getAndClearPendingTasksInfo(); } catch (error) { } } }); return originalRun.call(this, fn); }; })(Mocha.Runner.prototype.runTest, Mocha.Runner.prototype.run); }); } patchMocha(Zone); xa "use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchMocha(t){t.__load_patch("mocha",((t,n)=>{const e=t.Mocha;if(void 0===e)return;if(void 0===n)throw new Error("Missing Zone.js");const r=n.ProxyZoneSpec,o=n.SyncTestZoneSpec;if(!r)throw new Error("Missing ProxyZoneSpec");if(e.__zone_patch__)throw new Error('"Mocha" has already been patched with "Zone".');e.__zone_patch__=!0;const i=n.current,c=i.fork(new o("Mocha.describe"));let u=null;const s=i.fork(new r),f={after:t.after,afterEach:t.afterEach,before:t.before,beforeEach:t.beforeEach,describe:t.describe,it:t.it};function a(t,n,e){for(let r=0;r{y.call(this,t)}))},e.Runner.prototype.run=function(t){return this.on("test",(t=>{u=i.fork(new r)})),this.on("fail",((t,n)=>{const e=u&&u.get("ProxyZoneSpec");if(e&&n)try{n.message+=e.getAndClearPendingTasksInfo()}catch(t){}})),d.call(this,t)}}))}patchMocha(Zone);=ybx'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ class ProxyZoneSpec { defaultSpecDelegate; name = 'ProxyZone'; _delegateSpec = null; properties = { 'ProxyZoneSpec': this }; propertyKeys = null; lastTaskState = null; isNeedToTriggerHasTask = false; tasks = []; static get() { return Zone.current.get('ProxyZoneSpec'); } static isLoaded() { return ProxyZoneSpec.get() instanceof ProxyZoneSpec; } static assertPresent() { const spec = ProxyZoneSpec.get(); if (spec === undefined) { throw new Error(`Expected to be running in 'ProxyZone', but it was not found.`); } return spec; } constructor(defaultSpecDelegate = null) { this.defaultSpecDelegate = defaultSpecDelegate; this.setDelegate(defaultSpecDelegate); } setDelegate(delegateSpec) { const isNewDelegate = this._delegateSpec !== delegateSpec; this._delegateSpec = delegateSpec; this.propertyKeys && this.propertyKeys.forEach((key) => delete this.properties[key]); this.propertyKeys = null; if (delegateSpec && delegateSpec.properties) { this.propertyKeys = Object.keys(delegateSpec.properties); this.propertyKeys.forEach((k) => (this.properties[k] = delegateSpec.properties[k])); } // if a new delegateSpec was set, check if we need to trigger hasTask if (isNewDelegate && this.lastTaskState && (this.lastTaskState.macroTask || this.lastTaskState.microTask)) { this.isNeedToTriggerHasTask = true; } } getDelegate() { return this._delegateSpec; } resetDelegate() { this.getDelegate(); this.setDelegate(this.defaultSpecDelegate); } tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone) { if (this.isNeedToTriggerHasTask && this.lastTaskState) { // last delegateSpec has microTask or macroTask // should call onHasTask in current delegateSpec this.isNeedToTriggerHasTask = false; this.onHasTask(parentZoneDelegate, currentZone, targetZone, this.lastTaskState); } } removeFromTasks(task) { if (!this.tasks) { return; } for (let i = 0; i < this.tasks.length; i++) { if (this.tasks[i] === task) { this.tasks.splice(i, 1); return; } } } getAndClearPendingTasksInfo() { if (this.tasks.length === 0) { return ''; } const taskInfo = this.tasks.map((task) => { const dataInfo = task.data && Object.keys(task.data) .map((key) => { return key + ':' + task.data[key]; }) .join(','); return `type: ${task.type}, source: ${task.source}, args: {${dataInfo}}`; }); const pendingTasksInfo = '--Pending async tasks are: [' + taskInfo + ']'; // clear tasks this.tasks = []; return pendingTasksInfo; } onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec) { if (this._delegateSpec && this._delegateSpec.onFork) { return this._delegateSpec.onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec); } else { return parentZoneDelegate.fork(targetZone, zoneSpec); } } onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source) { if (this._delegateSpec && this._delegateSpec.onIntercept) { return this._delegateSpec.onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source); } else { return parentZoneDelegate.intercept(targetZone, delegate, source); } } onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvoke) { return this._delegateSpec.onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source); } else { return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { if (this._delegateSpec && this._delegateSpec.onHandleError) { return this._delegateSpec.onHandleError(parentZoneDelegate, currentZone, targetZone, error); } else { return parentZoneDelegate.handleError(targetZone, error); } } onScheduleTask(parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.tasks.push(task); } if (this._delegateSpec && this._delegateSpec.onScheduleTask) { return this._delegateSpec.onScheduleTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.scheduleTask(targetZone, task); } } onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvokeTask) { return this._delegateSpec.onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs); } else { return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); } } onCancelTask(parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onCancelTask) { return this._delegateSpec.onCancelTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.cancelTask(targetZone, task); } } onHasTask(delegate, current, target, hasTaskState) { this.lastTaskState = hasTaskState; if (this._delegateSpec && this._delegateSpec.onHasTask) { this._delegateSpec.onHasTask(delegate, current, target, hasTaskState); } else { delegate.hasTask(target, hasTaskState); } } } function patchProxyZoneSpec(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['ProxyZoneSpec'] = ProxyZoneSpec; } patchProxyZoneSpec(Zone); 3cx\ "use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */class ProxyZoneSpec{defaultSpecDelegate;name="ProxyZone";_delegateSpec=null;properties={ProxyZoneSpec:this};propertyKeys=null;lastTaskState=null;isNeedToTriggerHasTask=!1;tasks=[];static get(){return Zone.current.get("ProxyZoneSpec")}static isLoaded(){return ProxyZoneSpec.get()instanceof ProxyZoneSpec}static assertPresent(){const e=ProxyZoneSpec.get();if(void 0===e)throw new Error("Expected to be running in 'ProxyZone', but it was not found.");return e}constructor(e=null){this.defaultSpecDelegate=e,this.setDelegate(e)}setDelegate(e){const t=this._delegateSpec!==e;this._delegateSpec=e,this.propertyKeys&&this.propertyKeys.forEach((e=>delete this.properties[e])),this.propertyKeys=null,e&&e.properties&&(this.propertyKeys=Object.keys(e.properties),this.propertyKeys.forEach((t=>this.properties[t]=e.properties[t]))),t&&this.lastTaskState&&(this.lastTaskState.macroTask||this.lastTaskState.microTask)&&(this.isNeedToTriggerHasTask=!0)}getDelegate(){return this._delegateSpec}resetDelegate(){this.getDelegate(),this.setDelegate(this.defaultSpecDelegate)}tryTriggerHasTask(e,t,s){this.isNeedToTriggerHasTask&&this.lastTaskState&&(this.isNeedToTriggerHasTask=!1,this.onHasTask(e,t,s,this.lastTaskState))}removeFromTasks(e){if(this.tasks)for(let t=0;t{const t=e.data&&Object.keys(e.data).map((t=>t+":"+e.data[t])).join(",");return`type: ${e.type}, source: ${e.source}, args: {${t}}`}))+"]";return this.tasks=[],e}onFork(e,t,s,a){return this._delegateSpec&&this._delegateSpec.onFork?this._delegateSpec.onFork(e,t,s,a):e.fork(s,a)}onIntercept(e,t,s,a,r){return this._delegateSpec&&this._delegateSpec.onIntercept?this._delegateSpec.onIntercept(e,t,s,a,r):e.intercept(s,a,r)}onInvoke(e,t,s,a,r,o,n){return this.tryTriggerHasTask(e,t,s),this._delegateSpec&&this._delegateSpec.onInvoke?this._delegateSpec.onInvoke(e,t,s,a,r,o,n):e.invoke(s,a,r,o,n)}onHandleError(e,t,s,a){return this._delegateSpec&&this._delegateSpec.onHandleError?this._delegateSpec.onHandleError(e,t,s,a):e.handleError(s,a)}onScheduleTask(e,t,s,a){return"eventTask"!==a.type&&this.tasks.push(a),this._delegateSpec&&this._delegateSpec.onScheduleTask?this._delegateSpec.onScheduleTask(e,t,s,a):e.scheduleTask(s,a)}onInvokeTask(e,t,s,a,r,o){return"eventTask"!==a.type&&this.removeFromTasks(a),this.tryTriggerHasTask(e,t,s),this._delegateSpec&&this._delegateSpec.onInvokeTask?this._delegateSpec.onInvokeTask(e,t,s,a,r,o):e.invokeTask(s,a,r,o)}onCancelTask(e,t,s,a){return"eventTask"!==a.type&&this.removeFromTasks(a),this.tryTriggerHasTask(e,t,s),this._delegateSpec&&this._delegateSpec.onCancelTask?this._delegateSpec.onCancelTask(e,t,s,a):e.cancelTask(s,a)}onHasTask(e,t,s,a){this.lastTaskState=a,this._delegateSpec&&this._delegateSpec.onHasTask?this._delegateSpec.onHasTask(e,t,s,a):e.hasTask(s,a)}}function patchProxyZoneSpec(e){e.ProxyZoneSpec=ProxyZoneSpec}patchProxyZoneSpec(Zone);OIx2"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchSyncTest(e){e.SyncTestZoneSpec=class{runZone=e.current;constructor(e){this.name="syncTestZone for "+e}name;onScheduleTask(e,s,c,n){switch(n.type){case"microTask":case"macroTask":throw new Error(`Cannot call ${n.source} from within a sync test (${this.name}).`);case"eventTask":n=e.scheduleTask(c,n)}return n}}}patchSyncTest(Zone);<ടx 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /** * A `TaskTrackingZoneSpec` allows one to track all outstanding Tasks. * * This is useful in tests. For example to see which tasks are preventing a test from completing * or an automated way of releasing all of the event listeners at the end of the test. */ class TaskTrackingZoneSpec { name = 'TaskTrackingZone'; microTasks = []; macroTasks = []; eventTasks = []; properties = { 'TaskTrackingZone': this }; static get() { return Zone.current.get('TaskTrackingZone'); } getTasksFor(type) { switch (type) { case 'microTask': return this.microTasks; case 'macroTask': return this.macroTasks; case 'eventTask': return this.eventTasks; } throw new Error('Unknown task format: ' + type); } onScheduleTask(parentZoneDelegate, currentZone, targetZone, task) { task['creationLocation'] = new Error(`Task '${task.type}' from '${task.source}'.`); const tasks = this.getTasksFor(task.type); tasks.push(task); return parentZoneDelegate.scheduleTask(targetZone, task); } onCancelTask(parentZoneDelegate, currentZone, targetZone, task) { const tasks = this.getTasksFor(task.type); for (let i = 0; i < tasks.length; i++) { if (tasks[i] == task) { tasks.splice(i, 1); break; } } return parentZoneDelegate.cancelTask(targetZone, task); } onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { if (task.type === 'eventTask' || task.data?.isPeriodic) return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); const tasks = this.getTasksFor(task.type); for (let i = 0; i < tasks.length; i++) { if (tasks[i] == task) { tasks.splice(i, 1); break; } } return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); } clearEvents() { while (this.eventTasks.length) { Zone.current.cancelTask(this.eventTasks[0]); } } } function patchTaskTracking(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['TaskTrackingZoneSpec'] = TaskTrackingZoneSpec; } patchTaskTracking(Zone); RRJx^"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */class TaskTrackingZoneSpec{name="TaskTrackingZone";microTasks=[];macroTasks=[];eventTasks=[];properties={TaskTrackingZone:this};static get(){return Zone.current.get("TaskTrackingZone")}getTasksFor(e){switch(e){case"microTask":return this.microTasks;case"macroTask":return this.macroTasks;case"eventTask":return this.eventTasks}throw new Error("Unknown task format: "+e)}onScheduleTask(e,s,a,r){return r.creationLocation=new Error(`Task '${r.type}' from '${r.source}'.`),this.getTasksFor(r.type).push(r),e.scheduleTask(a,r)}onCancelTask(e,s,a,r){const t=this.getTasksFor(r.type);for(let e=0;e * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchMediaQuery(Zone) { Zone.__load_patch('mediaQuery', (global, Zone, api) => { function patchAddListener(proto) { api.patchMethod(proto, 'addListener', (delegate) => (self, args) => { const callback = args.length > 0 ? args[0] : null; if (typeof callback === 'function') { const wrapperedCallback = Zone.current.wrap(callback, 'MediaQuery'); callback[api.symbol('mediaQueryCallback')] = wrapperedCallback; return delegate.call(self, wrapperedCallback); } else { return delegate.apply(self, args); } }); } function patchRemoveListener(proto) { api.patchMethod(proto, 'removeListener', (delegate) => (self, args) => { const callback = args.length > 0 ? args[0] : null; if (typeof callback === 'function') { const wrapperedCallback = callback[api.symbol('mediaQueryCallback')]; if (wrapperedCallback) { return delegate.call(self, wrapperedCallback); } else { return delegate.apply(self, args); } } else { return delegate.apply(self, args); } }); } if (global['MediaQueryList']) { const proto = global['MediaQueryList'].prototype; patchAddListener(proto); patchRemoveListener(proto); } else if (global['matchMedia']) { api.patchMethod(global, 'matchMedia', (delegate) => (self, args) => { const mql = delegate.apply(self, args); if (mql) { // try to patch MediaQueryList.prototype const proto = Object.getPrototypeOf(mql); if (proto && proto['addListener']) { // try to patch proto, don't need to worry about patch // multiple times, because, api.patchEventTarget will check it patchAddListener(proto); patchRemoveListener(proto); patchAddListener(mql); patchRemoveListener(mql); } else if (mql['addListener']) { // proto not exists, or proto has no addListener method // try to patch mql instance patchAddListener(mql); patchRemoveListener(mql); } } return mql; }); } }); } patchMediaQuery(Zone); ae9xo"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchMediaQuery(e){e.__load_patch("mediaQuery",((e,t,a)=>{function n(e){a.patchMethod(e,"addListener",(e=>(n,r)=>{const c=r.length>0?r[0]:null;if("function"==typeof c){const r=t.current.wrap(c,"MediaQuery");return c[a.symbol("mediaQueryCallback")]=r,e.call(n,r)}return e.apply(n,r)}))}function r(e){a.patchMethod(e,"removeListener",(e=>(t,n)=>{const r=n.length>0?n[0]:null;if("function"==typeof r){const c=r[a.symbol("mediaQueryCallback")];return c?e.call(t,c):e.apply(t,n)}return e.apply(t,n)}))}if(e.MediaQueryList){const t=e.MediaQueryList.prototype;n(t),r(t)}else e.matchMedia&&a.patchMethod(e,"matchMedia",(e=>(t,a)=>{const c=e.apply(t,a);if(c){const e=Object.getPrototypeOf(c);e&&e.addListener?(n(e),r(e),n(c),r(c)):c.addListener&&(n(c),r(c))}return c}))}))}patchMediaQuery(Zone);{7&xh'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchNotifications(Zone) { Zone.__load_patch('notification', (global, Zone, api) => { const Notification = global['Notification']; if (!Notification || !Notification.prototype) { return; } const desc = Object.getOwnPropertyDescriptor(Notification.prototype, 'onerror'); if (!desc || !desc.configurable) { return; } api.patchOnProperties(Notification.prototype, null); }); } patchNotifications(Zone); F!@x|"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchNotifications(t){t.__load_patch("notification",((t,o,i)=>{const n=t.Notification;if(!n||!n.prototype)return;const r=Object.getOwnPropertyDescriptor(n.prototype,"onerror");r&&r.configurable&&i.patchOnProperties(n.prototype,null)}))}patchNotifications(Zone);1{Bx/'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchRtcPeerConnection(Zone) { Zone.__load_patch('RTCPeerConnection', (global, Zone, api) => { const RTCPeerConnection = global['RTCPeerConnection']; if (!RTCPeerConnection) { return; } const addSymbol = api.symbol('addEventListener'); const removeSymbol = api.symbol('removeEventListener'); RTCPeerConnection.prototype.addEventListener = RTCPeerConnection.prototype[addSymbol]; RTCPeerConnection.prototype.removeEventListener = RTCPeerConnection.prototype[removeSymbol]; // RTCPeerConnection extends EventTarget, so we must clear the symbol // to allow patch RTCPeerConnection.prototype.addEventListener again RTCPeerConnection.prototype[addSymbol] = null; RTCPeerConnection.prototype[removeSymbol] = null; api.patchEventTarget(global, api, [RTCPeerConnection.prototype], { useG: false }); }); } patchRtcPeerConnection(Zone); n` x "use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchRtcPeerConnection(e){e.__load_patch("RTCPeerConnection",((e,t,o)=>{const n=e.RTCPeerConnection;if(!n)return;const r=o.symbol("addEventListener"),p=o.symbol("removeEventListener");n.prototype.addEventListener=n.prototype[r],n.prototype.removeEventListener=n.prototype[p],n.prototype[r]=null,n.prototype[p]=null,o.patchEventTarget(e,o,[n.prototype],{useG:!1})}))}patchRtcPeerConnection(Zone);ĦbNx'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchShadyDom(Zone) { Zone.__load_patch('shadydom', (global, Zone, api) => { // https://github.com/angular/zone.js/issues/782 // in web components, shadydom will patch addEventListener/removeEventListener of // Node.prototype and WindowPrototype, this will have conflict with zone.js // so zone.js need to patch them again. const HTMLSlotElement = global.HTMLSlotElement; const prototypes = [ Object.getPrototypeOf(window), Node.prototype, Text.prototype, Element.prototype, HTMLElement.prototype, HTMLSlotElement && HTMLSlotElement.prototype, DocumentFragment.prototype, Document.prototype, ]; prototypes.forEach(function (proto) { if (proto && proto.hasOwnProperty('addEventListener')) { proto[Zone.__symbol__('addEventListener')] = null; proto[Zone.__symbol__('removeEventListener')] = null; api.patchEventTarget(global, api, [proto]); } }); }); } patchShadyDom(Zone); FY{ݼ#x<"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchShadyDom(t){t.__load_patch("shadydom",((t,e,o)=>{const n=t.HTMLSlotElement;[Object.getPrototypeOf(window),Node.prototype,Text.prototype,Element.prototype,HTMLElement.prototype,n&&n.prototype,DocumentFragment.prototype,Document.prototype].forEach((function(n){n&&n.hasOwnProperty("addEventListener")&&(n[e.__symbol__("addEventListener")]=null,n[e.__symbol__("removeEventListener")]=null,o.patchEventTarget(t,o,[n]))}))}))}patchShadyDom(Zone);ɁGxm'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /** * @fileoverview * @suppress {missingRequire} */ const _global = (typeof window === 'object' && window) || (typeof self === 'object' && self) || global; function patchWtf(Zone) { // Detect and setup WTF. let wtfTrace = null; let wtfEvents = null; const wtfEnabled = (function () { const wtf = _global['wtf']; if (wtf) { wtfTrace = wtf.trace; if (wtfTrace) { wtfEvents = wtfTrace.events; return true; } } return false; })(); class WtfZoneSpec { name = 'WTF'; static forkInstance = wtfEnabled ? wtfEvents.createInstance('Zone:fork(ascii zone, ascii newZone)') : null; static scheduleInstance = {}; static cancelInstance = {}; static invokeScope = {}; static invokeTaskScope = {}; onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec) { const retValue = parentZoneDelegate.fork(targetZone, zoneSpec); WtfZoneSpec.forkInstance(zonePathName(targetZone), retValue.name); return retValue; } onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { const src = source || 'unknown'; let scope = WtfZoneSpec.invokeScope[src]; if (!scope) { scope = WtfZoneSpec.invokeScope[src] = wtfEvents.createScope(`Zone:invoke:${source}(ascii zone)`); } return wtfTrace.leaveScope(scope(zonePathName(targetZone)), parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source)); } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { return parentZoneDelegate.handleError(targetZone, error); } onScheduleTask(parentZoneDelegate, currentZone, targetZone, task) { const key = task.type + ':' + task.source; let instance = WtfZoneSpec.scheduleInstance[key]; if (!instance) { instance = WtfZoneSpec.scheduleInstance[key] = wtfEvents.createInstance(`Zone:schedule:${key}(ascii zone, any data)`); } const retValue = parentZoneDelegate.scheduleTask(targetZone, task); instance(zonePathName(targetZone), shallowObj(task.data, 2)); return retValue; } onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { const source = task.source; let scope = WtfZoneSpec.invokeTaskScope[source]; if (!scope) { scope = WtfZoneSpec.invokeTaskScope[source] = wtfEvents.createScope(`Zone:invokeTask:${source}(ascii zone)`); } return wtfTrace.leaveScope(scope(zonePathName(targetZone)), parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs)); } onCancelTask(parentZoneDelegate, currentZone, targetZone, task) { const key = task.source; let instance = WtfZoneSpec.cancelInstance[key]; if (!instance) { instance = WtfZoneSpec.cancelInstance[key] = wtfEvents.createInstance(`Zone:cancel:${key}(ascii zone, any options)`); } const retValue = parentZoneDelegate.cancelTask(targetZone, task); instance(zonePathName(targetZone), shallowObj(task.data, 2)); return retValue; } } function shallowObj(obj, depth) { if (!obj || !depth) return null; const out = {}; for (const key in obj) { if (obj.hasOwnProperty(key)) { // explicit : any due to https://github.com/microsoft/TypeScript/issues/33191 let value = obj[key]; switch (typeof value) { case 'object': const name = value && value.constructor && value.constructor.name; value = name == Object.name ? shallowObj(value, depth - 1) : name; break; case 'function': value = value.name || undefined; break; } out[key] = value; } } return out; } function zonePathName(zone) { let name = zone.name; let localZone = zone.parent; while (localZone != null) { name = localZone.name + '::' + name; localZone = localZone.parent; } return name; } Zone['wtfZoneSpec'] = !wtfEnabled ? null : new WtfZoneSpec(); } patchWtf(Zone); txE"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const _global="object"==typeof window&&window||"object"==typeof self&&self||global;function patchWtf(e){let n=null,c=null;const o=function(){const e=_global.wtf;return!(!e||(n=e.trace,!n)||(c=n.events,0))}();class t{name="WTF";static forkInstance=o?c.createInstance("Zone:fork(ascii zone, ascii newZone)"):null;static scheduleInstance={};static cancelInstance={};static invokeScope={};static invokeTaskScope={};onFork(e,n,c,o){const a=e.fork(c,o);return t.forkInstance(s(c),a.name),a}onInvoke(e,o,a,r,l,i,u){const k=u||"unknown";let f=t.invokeScope[k];return f||(f=t.invokeScope[k]=c.createScope(`Zone:invoke:${u}(ascii zone)`)),n.leaveScope(f(s(a)),e.invoke(a,r,l,i,u))}onHandleError(e,n,c,o){return e.handleError(c,o)}onScheduleTask(e,n,o,r){const l=r.type+":"+r.source;let i=t.scheduleInstance[l];i||(i=t.scheduleInstance[l]=c.createInstance(`Zone:schedule:${l}(ascii zone, any data)`));const u=e.scheduleTask(o,r);return i(s(o),a(r.data,2)),u}onInvokeTask(e,o,a,r,l,i){const u=r.source;let k=t.invokeTaskScope[u];return k||(k=t.invokeTaskScope[u]=c.createScope(`Zone:invokeTask:${u}(ascii zone)`)),n.leaveScope(k(s(a)),e.invokeTask(a,r,l,i))}onCancelTask(e,n,o,r){const l=r.source;let i=t.cancelInstance[l];i||(i=t.cancelInstance[l]=c.createInstance(`Zone:cancel:${l}(ascii zone, any options)`));const u=e.cancelTask(o,r);return i(s(o),a(r.data,2)),u}}function a(e,n){if(!e||!n)return null;const c={};for(const o in e)if(e.hasOwnProperty(o)){let t=e[o];switch(typeof t){case"object":const e=t&&t.constructor&&t.constructor.name;t=e==Object.name?a(t,n-1):e;break;case"function":t=t.name||void 0}c[o]=t}return c}function s(e){let n=e.name,c=e.parent;for(;null!=c;)n=c.name+"::"+n,c=c.parent;return n}e.wtfZoneSpec=o?new t:null}patchWtf(Zone);rqxU'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchBluebird(Zone) { Zone.__load_patch('bluebird', (global, Zone, api) => { // TODO: @JiaLiPassion, we can automatically patch bluebird // if global.Promise = Bluebird, but sometimes in nodejs, // global.Promise is not Bluebird, and Bluebird is just be // used by other libraries such as sequelize, so I think it is // safe to just expose a method to patch Bluebird explicitly const BLUEBIRD = 'bluebird'; Zone[Zone.__symbol__(BLUEBIRD)] = function patchBluebird(Bluebird) { // patch method of Bluebird.prototype which not using `then` internally const bluebirdApis = ['then', 'spread', 'finally']; bluebirdApis.forEach((bapi) => { api.patchMethod(Bluebird.prototype, bapi, (delegate) => (self, args) => { const zone = Zone.current; for (let i = 0; i < args.length; i++) { const func = args[i]; if (typeof func === 'function') { args[i] = function () { const argSelf = this; const argArgs = arguments; return new Bluebird((res, rej) => { zone.scheduleMicroTask('Promise.then', () => { try { res(func.apply(argSelf, argArgs)); } catch (error) { rej(error); } }); }); }; } } return delegate.apply(self, args); }); }); if (typeof window !== 'undefined') { window.addEventListener('unhandledrejection', function (event) { const error = event.detail && event.detail.reason; if (error && error.isHandledByZone) { event.preventDefault(); if (typeof event.stopImmediatePropagation === 'function') { event.stopImmediatePropagation(); } } }); } else if (typeof process !== 'undefined') { process.on('unhandledRejection', (reason, p) => { if (reason && reason.isHandledByZone) { const listeners = process.listeners('unhandledRejection'); if (listeners) { // remove unhandledRejection listeners so the callback // will not be triggered. process.removeAllListeners('unhandledRejection'); process.nextTick(() => { listeners.forEach((listener) => process.on('unhandledRejection', listener)); }); } } }); } Bluebird.onPossiblyUnhandledRejection(function (e, promise) { try { Zone.current.runGuarded(() => { e.isHandledByZone = true; throw e; }); } catch (err) { err.isHandledByZone = false; api.onUnhandledError(err); } }); // override global promise global.Promise = Bluebird; }; }); } patchBluebird(Zone); ]߇Ox"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchBluebird(e){e.__load_patch("bluebird",((e,n,o)=>{n[n.__symbol__("bluebird")]=function t(d){["then","spread","finally"].forEach((e=>{o.patchMethod(d.prototype,e,(e=>(o,t)=>{const r=n.current;for(let e=0;e{r.scheduleMicroTask("Promise.then",(()=>{try{t(n.apply(e,o))}catch(e){d(e)}}))}))})}return e.apply(o,t)}))})),"undefined"!=typeof window?window.addEventListener("unhandledrejection",(function(e){const n=e.detail&&e.detail.reason;n&&n.isHandledByZone&&(e.preventDefault(),"function"==typeof e.stopImmediatePropagation&&e.stopImmediatePropagation())})):"undefined"!=typeof process&&process.on("unhandledRejection",((e,n)=>{if(e&&e.isHandledByZone){const e=process.listeners("unhandledRejection");e&&(process.removeAllListeners("unhandledRejection"),process.nextTick((()=>{e.forEach((e=>process.on("unhandledRejection",e)))})))}})),d.onPossiblyUnhandledRejection((function(e,t){try{n.current.runGuarded((()=>{throw e.isHandledByZone=!0,e}))}catch(e){e.isHandledByZone=!1,o.onUnhandledError(e)}})),e.Promise=d}}))}patchBluebird(Zone);CTxwC'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /** * @fileoverview * @suppress {globalThis,undefinedVars} */ function patchError(Zone) { Zone.__load_patch('Error', (global, Zone, api) => { /* * This code patches Error so that: * - It ignores un-needed stack frames. * - It Shows the associated Zone for reach frame. */ const zoneJsInternalStackFramesSymbol = api.symbol('zoneJsInternalStackFrames'); const NativeError = (global[api.symbol('Error')] = global['Error']); // Store the frames which should be removed from the stack frames const zoneJsInternalStackFrames = {}; // We must find the frame where Error was created, otherwise we assume we don't understand stack let zoneAwareFrame1; let zoneAwareFrame2; let zoneAwareFrame1WithoutNew; let zoneAwareFrame2WithoutNew; let zoneAwareFrame3WithoutNew; global['Error'] = ZoneAwareError; const stackRewrite = 'stackRewrite'; const zoneJsInternalStackFramesPolicy = global['__Zone_Error_BlacklistedStackFrames_policy'] || global['__Zone_Error_ZoneJsInternalStackFrames_policy'] || 'default'; function buildZoneFrameNames(zoneFrame) { let zoneFrameName = { zoneName: zoneFrame.zone.name }; let result = zoneFrameName; while (zoneFrame.parent) { zoneFrame = zoneFrame.parent; const parentZoneFrameName = { zoneName: zoneFrame.zone.name }; zoneFrameName.parent = parentZoneFrameName; zoneFrameName = parentZoneFrameName; } return result; } function buildZoneAwareStackFrames(originalStack, zoneFrame, isZoneFrame = true) { let frames = originalStack.split('\n'); let i = 0; // Find the first frame while (!(frames[i] === zoneAwareFrame1 || frames[i] === zoneAwareFrame2 || frames[i] === zoneAwareFrame1WithoutNew || frames[i] === zoneAwareFrame2WithoutNew || frames[i] === zoneAwareFrame3WithoutNew) && i < frames.length) { i++; } for (; i < frames.length && zoneFrame; i++) { let frame = frames[i]; if (frame.trim()) { switch (zoneJsInternalStackFrames[frame]) { case 0 /* FrameType.zoneJsInternal */: frames.splice(i, 1); i--; break; case 1 /* FrameType.transition */: if (zoneFrame.parent) { // This is the special frame where zone changed. Print and process it accordingly zoneFrame = zoneFrame.parent; } else { zoneFrame = null; } frames.splice(i, 1); i--; break; default: frames[i] += isZoneFrame ? ` [${zoneFrame.zone.name}]` : ` [${zoneFrame.zoneName}]`; } } } return frames.join('\n'); } /** * This is ZoneAwareError which processes the stack frame and cleans up extra frames as well as * adds zone information to it. */ function ZoneAwareError() { // We always have to return native error otherwise the browser console will not work. let error = NativeError.apply(this, arguments); // Save original stack trace const originalStack = (error['originalStack'] = error.stack); // Process the stack trace and rewrite the frames. if (ZoneAwareError[stackRewrite] && originalStack) { let zoneFrame = api.currentZoneFrame(); if (zoneJsInternalStackFramesPolicy === 'lazy') { // don't handle stack trace now error[api.symbol('zoneFrameNames')] = buildZoneFrameNames(zoneFrame); } else if (zoneJsInternalStackFramesPolicy === 'default') { try { error.stack = error.zoneAwareStack = buildZoneAwareStackFrames(originalStack, zoneFrame); } catch (e) { // ignore as some browsers don't allow overriding of stack } } } if (this instanceof NativeError && this.constructor != NativeError) { // We got called with a `new` operator AND we are subclass of ZoneAwareError // in that case we have to copy all of our properties to `this`. Object.keys(error) .concat('stack', 'message', 'cause') .forEach((key) => { const value = error[key]; if (value !== undefined) { try { this[key] = value; } catch (e) { // ignore the assignment in case it is a setter and it throws. } } }); return this; } return error; } // Copy the prototype so that instanceof operator works as expected ZoneAwareError.prototype = NativeError.prototype; ZoneAwareError[zoneJsInternalStackFramesSymbol] = zoneJsInternalStackFrames; ZoneAwareError[stackRewrite] = false; const zoneAwareStackSymbol = api.symbol('zoneAwareStack'); // try to define zoneAwareStack property when zoneJsInternal frames policy is delay if (zoneJsInternalStackFramesPolicy === 'lazy') { Object.defineProperty(ZoneAwareError.prototype, 'zoneAwareStack', { configurable: true, enumerable: true, get: function () { if (!this[zoneAwareStackSymbol]) { this[zoneAwareStackSymbol] = buildZoneAwareStackFrames(this.originalStack, this[api.symbol('zoneFrameNames')], false); } return this[zoneAwareStackSymbol]; }, set: function (newStack) { this.originalStack = newStack; this[zoneAwareStackSymbol] = buildZoneAwareStackFrames(this.originalStack, this[api.symbol('zoneFrameNames')], false); }, }); } // those properties need special handling const specialPropertyNames = ['stackTraceLimit', 'captureStackTrace', 'prepareStackTrace']; // those properties of NativeError should be set to ZoneAwareError const nativeErrorProperties = Object.keys(NativeError); if (nativeErrorProperties) { nativeErrorProperties.forEach((prop) => { if (specialPropertyNames.filter((sp) => sp === prop).length === 0) { Object.defineProperty(ZoneAwareError, prop, { get: function () { return NativeError[prop]; }, set: function (value) { NativeError[prop] = value; }, }); } }); } if (NativeError.hasOwnProperty('stackTraceLimit')) { // Extend default stack limit as we will be removing few frames. NativeError.stackTraceLimit = Math.max(NativeError.stackTraceLimit, 15); // make sure that ZoneAwareError has the same property which forwards to NativeError. Object.defineProperty(ZoneAwareError, 'stackTraceLimit', { get: function () { return NativeError.stackTraceLimit; }, set: function (value) { return (NativeError.stackTraceLimit = value); }, }); } if (NativeError.hasOwnProperty('captureStackTrace')) { Object.defineProperty(ZoneAwareError, 'captureStackTrace', { // add named function here because we need to remove this // stack frame when prepareStackTrace below value: function zoneCaptureStackTrace(targetObject, constructorOpt) { NativeError.captureStackTrace(targetObject, constructorOpt); }, }); } const ZONE_CAPTURESTACKTRACE = 'zoneCaptureStackTrace'; Object.defineProperty(ZoneAwareError, 'prepareStackTrace', { get: function () { return NativeError.prepareStackTrace; }, set: function (value) { if (!value || typeof value !== 'function') { return (NativeError.prepareStackTrace = value); } return (NativeError.prepareStackTrace = function (error, structuredStackTrace) { // remove additional stack information from ZoneAwareError.captureStackTrace if (structuredStackTrace) { for (let i = 0; i < structuredStackTrace.length; i++) { const st = structuredStackTrace[i]; // remove the first function which name is zoneCaptureStackTrace if (st.getFunctionName() === ZONE_CAPTURESTACKTRACE) { structuredStackTrace.splice(i, 1); break; } } } return value.call(this, error, structuredStackTrace); }); }, }); if (zoneJsInternalStackFramesPolicy === 'disable') { // don't need to run detectZone to populate zoneJs internal stack frames return; } // Now we need to populate the `zoneJsInternalStackFrames` as well as find the // run/runGuarded/runTask frames. This is done by creating a detect zone and then threading // the execution through all of the above methods so that we can look at the stack trace and // find the frames of interest. let detectZone = Zone.current.fork({ name: 'detect', onHandleError: function (parentZD, current, target, error) { if (error.originalStack && Error === ZoneAwareError) { let frames = error.originalStack.split(/\n/); let runFrame = false, runGuardedFrame = false, runTaskFrame = false; while (frames.length) { let frame = frames.shift(); // On safari it is possible to have stack frame with no line number. // This check makes sure that we don't filter frames on name only (must have // line number or exact equals to `ZoneAwareError`) if (/:\d+:\d+/.test(frame) || frame === 'ZoneAwareError') { // Get rid of the path so that we don't accidentally find function name in path. // In chrome the separator is `(` and `@` in FF and safari // Chrome: at Zone.run (zone.js:100) // Chrome: at Zone.run (http://localhost:9876/base/build/lib/zone.js:100:24) // FireFox: Zone.prototype.run@http://localhost:9876/base/build/lib/zone.js:101:24 // Safari: run@http://localhost:9876/base/build/lib/zone.js:101:24 let fnName = frame.split('(')[0].split('@')[0]; let frameType = 1 /* FrameType.transition */; if (fnName.indexOf('ZoneAwareError') !== -1) { if (fnName.indexOf('new ZoneAwareError') !== -1) { zoneAwareFrame1 = frame; zoneAwareFrame2 = frame.replace('new ZoneAwareError', 'new Error.ZoneAwareError'); } else { zoneAwareFrame1WithoutNew = frame; zoneAwareFrame2WithoutNew = frame.replace('Error.', ''); if (frame.indexOf('Error.ZoneAwareError') === -1) { zoneAwareFrame3WithoutNew = frame.replace('ZoneAwareError', 'Error.ZoneAwareError'); } } zoneJsInternalStackFrames[zoneAwareFrame2] = 0 /* FrameType.zoneJsInternal */; } if (fnName.indexOf('runGuarded') !== -1) { runGuardedFrame = true; } else if (fnName.indexOf('runTask') !== -1) { runTaskFrame = true; } else if (fnName.indexOf('run') !== -1) { runFrame = true; } else { frameType = 0 /* FrameType.zoneJsInternal */; } zoneJsInternalStackFrames[frame] = frameType; // Once we find all of the frames we can stop looking. if (runFrame && runGuardedFrame && runTaskFrame) { ZoneAwareError[stackRewrite] = true; break; } } } } return false; }, }); // carefully constructor a stack frame which contains all of the frames of interest which // need to be detected and marked as an internal zoneJs frame. const childDetectZone = detectZone.fork({ name: 'child', onScheduleTask: function (delegate, curr, target, task) { return delegate.scheduleTask(target, task); }, onInvokeTask: function (delegate, curr, target, task, applyThis, applyArgs) { return delegate.invokeTask(target, task, applyThis, applyArgs); }, onCancelTask: function (delegate, curr, target, task) { return delegate.cancelTask(target, task); }, onInvoke: function (delegate, curr, target, callback, applyThis, applyArgs, source) { return delegate.invoke(target, callback, applyThis, applyArgs, source); }, }); // we need to detect all zone related frames, it will // exceed default stackTraceLimit, so we set it to // larger number here, and restore it after detect finish. // We cast through any so we don't need to depend on nodejs typings. const originalStackTraceLimit = Error.stackTraceLimit; Error.stackTraceLimit = 100; // we schedule event/micro/macro task, and invoke them // when onSchedule, so we can get all stack traces for // all kinds of tasks with one error thrown. childDetectZone.run(() => { childDetectZone.runGuarded(() => { const fakeTransitionTo = () => { }; childDetectZone.scheduleEventTask(zoneJsInternalStackFramesSymbol, () => { childDetectZone.scheduleMacroTask(zoneJsInternalStackFramesSymbol, () => { childDetectZone.scheduleMicroTask(zoneJsInternalStackFramesSymbol, () => { throw new Error(); }, undefined, (t) => { t._transitionTo = fakeTransitionTo; t.invoke(); }); childDetectZone.scheduleMicroTask(zoneJsInternalStackFramesSymbol, () => { throw Error(); }, undefined, (t) => { t._transitionTo = fakeTransitionTo; t.invoke(); }); }, undefined, (t) => { t._transitionTo = fakeTransitionTo; t.invoke(); }, () => { }); }, undefined, (t) => { t._transitionTo = fakeTransitionTo; t.invoke(); }, () => { }); }); }); Error.stackTraceLimit = originalStackTraceLimit; }); } patchError(Zone); 7|nx]"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchError(e){e.__load_patch("Error",((e,r,t)=>{const n=t.symbol("zoneJsInternalStackFrames"),a=e[t.symbol("Error")]=e.Error,o={};let c,i,s,l,u;e.Error=h;const k="stackRewrite",f=e.__Zone_Error_BlacklistedStackFrames_policy||e.__Zone_Error_ZoneJsInternalStackFrames_policy||"default";function p(e,r,t=!0){let n=e.split("\n"),a=0;for(;n[a]!==c&&n[a]!==i&&n[a]!==s&&n[a]!==l&&n[a]!==u&&a{const t=e[r];if(void 0!==t)try{this[r]=t}catch(e){}})),this):e}h.prototype=a.prototype,h[n]=o,h[k]=!1;const m=t.symbol("zoneAwareStack");"lazy"===f&&Object.defineProperty(h.prototype,"zoneAwareStack",{configurable:!0,enumerable:!0,get:function(){return this[m]||(this[m]=p(this.originalStack,this[t.symbol("zoneFrameNames")],!1)),this[m]},set:function(e){this.originalStack=e,this[m]=p(this.originalStack,this[t.symbol("zoneFrameNames")],!1)}});const d=["stackTraceLimit","captureStackTrace","prepareStackTrace"],T=Object.keys(a);if(T&&T.forEach((e=>{0===d.filter((r=>r===e)).length&&Object.defineProperty(h,e,{get:function(){return a[e]},set:function(r){a[e]=r}})})),a.hasOwnProperty("stackTraceLimit")&&(a.stackTraceLimit=Math.max(a.stackTraceLimit,15),Object.defineProperty(h,"stackTraceLimit",{get:function(){return a.stackTraceLimit},set:function(e){return a.stackTraceLimit=e}})),a.hasOwnProperty("captureStackTrace")&&Object.defineProperty(h,"captureStackTrace",{value:function e(r,t){a.captureStackTrace(r,t)}}),Object.defineProperty(h,"prepareStackTrace",{get:function(){return a.prepareStackTrace},set:function(e){return a.prepareStackTrace=e&&"function"==typeof e?function(r,t){if(t)for(let e=0;e{E.runGuarded((()=>{const e=()=>{};E.scheduleEventTask(n,(()=>{E.scheduleMacroTask(n,(()=>{E.scheduleMicroTask(n,(()=>{throw new Error}),void 0,(r=>{r._transitionTo=e,r.invoke()})),E.scheduleMicroTask(n,(()=>{throw Error()}),void 0,(r=>{r._transitionTo=e,r.invoke()}))}),void 0,(r=>{r._transitionTo=e,r.invoke()}),(()=>{}))}),void 0,(r=>{r._transitionTo=e,r.invoke()}),(()=>{}))}))})),Error.stackTraceLimit=y}))}patchError(Zone);r x_9'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /* * This is necessary for Chrome and Chrome mobile, to enable * things like redefining `createdCallback` on an element. */ let zoneSymbol; let _defineProperty; let _getOwnPropertyDescriptor; let _create; let unconfigurablesKey; function propertyPatch() { zoneSymbol = Zone.__symbol__; _defineProperty = Object[zoneSymbol('defineProperty')] = Object.defineProperty; _getOwnPropertyDescriptor = Object[zoneSymbol('getOwnPropertyDescriptor')] = Object.getOwnPropertyDescriptor; _create = Object.create; unconfigurablesKey = zoneSymbol('unconfigurables'); Object.defineProperty = function (obj, prop, desc) { if (isUnconfigurable(obj, prop)) { throw new TypeError("Cannot assign to read only property '" + prop + "' of " + obj); } const originalConfigurableFlag = desc.configurable; if (prop !== 'prototype') { desc = rewriteDescriptor(obj, prop, desc); } return _tryDefineProperty(obj, prop, desc, originalConfigurableFlag); }; Object.defineProperties = function (obj, props) { Object.keys(props).forEach(function (prop) { Object.defineProperty(obj, prop, props[prop]); }); for (const sym of Object.getOwnPropertySymbols(props)) { const desc = Object.getOwnPropertyDescriptor(props, sym); // Since `Object.getOwnPropertySymbols` returns *all* symbols, // including non-enumerable ones, retrieve property descriptor and check // enumerability there. Proceed with the rewrite only when a property is // enumerable to make the logic consistent with the way regular // properties are retrieved (via `Object.keys`, which respects // `enumerable: false` flag). More information: // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties#retrieval if (desc?.enumerable) { Object.defineProperty(obj, sym, props[sym]); } } return obj; }; Object.create = function (proto, propertiesObject) { if (typeof propertiesObject === 'object' && !Object.isFrozen(propertiesObject)) { Object.keys(propertiesObject).forEach(function (prop) { propertiesObject[prop] = rewriteDescriptor(proto, prop, propertiesObject[prop]); }); } return _create(proto, propertiesObject); }; Object.getOwnPropertyDescriptor = function (obj, prop) { const desc = _getOwnPropertyDescriptor(obj, prop); if (desc && isUnconfigurable(obj, prop)) { desc.configurable = false; } return desc; }; } function _redefineProperty(obj, prop, desc) { const originalConfigurableFlag = desc.configurable; desc = rewriteDescriptor(obj, prop, desc); return _tryDefineProperty(obj, prop, desc, originalConfigurableFlag); } function isUnconfigurable(obj, prop) { return obj && obj[unconfigurablesKey] && obj[unconfigurablesKey][prop]; } function rewriteDescriptor(obj, prop, desc) { // issue-927, if the desc is frozen, don't try to change the desc if (!Object.isFrozen(desc)) { desc.configurable = true; } if (!desc.configurable) { // issue-927, if the obj is frozen, don't try to set the desc to obj if (!obj[unconfigurablesKey] && !Object.isFrozen(obj)) { _defineProperty(obj, unconfigurablesKey, { writable: true, value: {} }); } if (obj[unconfigurablesKey]) { obj[unconfigurablesKey][prop] = true; } } return desc; } function _tryDefineProperty(obj, prop, desc, originalConfigurableFlag) { try { return _defineProperty(obj, prop, desc); } catch (error) { if (desc.configurable) { // In case of errors, when the configurable flag was likely set by rewriteDescriptor(), // let's retry with the original flag value if (typeof originalConfigurableFlag == 'undefined') { delete desc.configurable; } else { desc.configurable = originalConfigurableFlag; } try { return _defineProperty(obj, prop, desc); } catch (error) { let swallowError = false; if (prop === 'createdCallback' || prop === 'attachedCallback' || prop === 'detachedCallback' || prop === 'attributeChangedCallback') { // We only swallow the error in registerElement patch // this is the work around since some applications // fail if we throw the error swallowError = true; } if (!swallowError) { throw error; } // TODO: @JiaLiPassion, Some application such as `registerElement` patch // still need to swallow the error, in the future after these applications // are updated, the following logic can be removed. let descJson = null; try { descJson = JSON.stringify(desc); } catch (error) { descJson = desc.toString(); } console.log(`Attempting to configure '${prop}' with descriptor '${descJson}' on object '${obj}' and got error, giving up: ${error}`); } } else { throw error; } } } function eventTargetLegacyPatch(_global, api) { const { eventNames, globalSources, zoneSymbolEventNames, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX } = api.getGlobalObjects(); const WTF_ISSUE_555 = 'Anchor,Area,Audio,BR,Base,BaseFont,Body,Button,Canvas,Content,DList,Directory,Div,Embed,FieldSet,Font,Form,Frame,FrameSet,HR,Head,Heading,Html,IFrame,Image,Input,Keygen,LI,Label,Legend,Link,Map,Marquee,Media,Menu,Meta,Meter,Mod,OList,Object,OptGroup,Option,Output,Paragraph,Pre,Progress,Quote,Script,Select,Source,Span,Style,TableCaption,TableCell,TableCol,Table,TableRow,TableSection,TextArea,Title,Track,UList,Unknown,Video'; const NO_EVENT_TARGET = 'ApplicationCache,EventSource,FileReader,InputMethodContext,MediaController,MessagePort,Node,Performance,SVGElementInstance,SharedWorker,TextTrack,TextTrackCue,TextTrackList,WebKitNamedFlow,Window,Worker,WorkerGlobalScope,XMLHttpRequest,XMLHttpRequestEventTarget,XMLHttpRequestUpload,IDBRequest,IDBOpenDBRequest,IDBDatabase,IDBTransaction,IDBCursor,DBIndex,WebSocket'.split(','); const EVENT_TARGET = 'EventTarget'; let apis = []; const isWtf = _global['wtf']; const WTF_ISSUE_555_ARRAY = WTF_ISSUE_555.split(','); if (isWtf) { // Workaround for: https://github.com/google/tracing-framework/issues/555 apis = WTF_ISSUE_555_ARRAY.map((v) => 'HTML' + v + 'Element').concat(NO_EVENT_TARGET); } else if (_global[EVENT_TARGET]) { apis.push(EVENT_TARGET); } else { // Note: EventTarget is not available in all browsers, // if it's not available, we instead patch the APIs in the IDL that inherit from EventTarget apis = NO_EVENT_TARGET; } const isDisableIECheck = _global['__Zone_disable_IE_check'] || false; const isEnableCrossContextCheck = _global['__Zone_enable_cross_context_check'] || false; const ieOrEdge = api.isIEOrEdge(); const ADD_EVENT_LISTENER_SOURCE = '.addEventListener:'; const FUNCTION_WRAPPER = '[object FunctionWrapper]'; const BROWSER_TOOLS = 'function __BROWSERTOOLS_CONSOLE_SAFEFUNC() { [native code] }'; const pointerEventsMap = { 'MSPointerCancel': 'pointercancel', 'MSPointerDown': 'pointerdown', 'MSPointerEnter': 'pointerenter', 'MSPointerHover': 'pointerhover', 'MSPointerLeave': 'pointerleave', 'MSPointerMove': 'pointermove', 'MSPointerOut': 'pointerout', 'MSPointerOver': 'pointerover', 'MSPointerUp': 'pointerup', }; // predefine all __zone_symbol__ + eventName + true/false string for (let i = 0; i < eventNames.length; i++) { const eventName = eventNames[i]; const falseEventName = eventName + FALSE_STR; const trueEventName = eventName + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } // predefine all task.source string for (let i = 0; i < WTF_ISSUE_555_ARRAY.length; i++) { const target = WTF_ISSUE_555_ARRAY[i]; const targets = (globalSources[target] = {}); for (let j = 0; j < eventNames.length; j++) { const eventName = eventNames[j]; targets[eventName] = target + ADD_EVENT_LISTENER_SOURCE + eventName; } } const checkIEAndCrossContext = function (nativeDelegate, delegate, target, args) { if (!isDisableIECheck && ieOrEdge) { if (isEnableCrossContextCheck) { try { const testString = delegate.toString(); if (testString === FUNCTION_WRAPPER || testString == BROWSER_TOOLS) { nativeDelegate.apply(target, args); return false; } } catch (error) { nativeDelegate.apply(target, args); return false; } } else { const testString = delegate.toString(); if (testString === FUNCTION_WRAPPER || testString == BROWSER_TOOLS) { nativeDelegate.apply(target, args); return false; } } } else if (isEnableCrossContextCheck) { try { delegate.toString(); } catch (error) { nativeDelegate.apply(target, args); return false; } } return true; }; const apiTypes = []; for (let i = 0; i < apis.length; i++) { const type = _global[apis[i]]; apiTypes.push(type && type.prototype); } // vh is validateHandler to check event handler // is valid or not(for security check) api.patchEventTarget(_global, api, apiTypes, { vh: checkIEAndCrossContext, transferEventName: (eventName) => { const pointerEventName = pointerEventsMap[eventName]; return pointerEventName || eventName; }, }); Zone[api.symbol('patchEventTarget')] = !!_global[EVENT_TARGET]; return true; } // we have to patch the instance since the proto is non-configurable function apply(api, _global) { const { ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR } = api.getGlobalObjects(); const WS = _global.WebSocket; // On Safari window.EventTarget doesn't exist so need to patch WS add/removeEventListener // On older Chrome, no need since EventTarget was already patched if (!_global.EventTarget) { api.patchEventTarget(_global, api, [WS.prototype]); } _global.WebSocket = function (x, y) { const socket = arguments.length > 1 ? new WS(x, y) : new WS(x); let proxySocket; let proxySocketProto; // Safari 7.0 has non-configurable own 'onmessage' and friends properties on the socket instance const onmessageDesc = api.ObjectGetOwnPropertyDescriptor(socket, 'onmessage'); if (onmessageDesc && onmessageDesc.configurable === false) { proxySocket = api.ObjectCreate(socket); // socket have own property descriptor 'onopen', 'onmessage', 'onclose', 'onerror' // but proxySocket not, so we will keep socket as prototype and pass it to // patchOnProperties method proxySocketProto = socket; [ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR, 'send', 'close'].forEach(function (propName) { proxySocket[propName] = function () { const args = api.ArraySlice.call(arguments); if (propName === ADD_EVENT_LISTENER_STR || propName === REMOVE_EVENT_LISTENER_STR) { const eventName = args.length > 0 ? args[0] : undefined; if (eventName) { const propertySymbol = Zone.__symbol__('ON_PROPERTY' + eventName); socket[propertySymbol] = proxySocket[propertySymbol]; } } return socket[propName].apply(socket, args); }; }); } else { // we can patch the real socket proxySocket = socket; } api.patchOnProperties(proxySocket, ['close', 'error', 'message', 'open'], proxySocketProto); return proxySocket; }; const globalWebSocket = _global['WebSocket']; for (const prop in WS) { globalWebSocket[prop] = WS[prop]; } } /** * @fileoverview * @suppress {globalThis} */ function propertyDescriptorLegacyPatch(api, _global) { const { isNode, isMix } = api.getGlobalObjects(); if (isNode && !isMix) { return; } if (!canPatchViaPropertyDescriptor(api, _global)) { const supportsWebSocket = typeof WebSocket !== 'undefined'; // Safari, Android browsers (Jelly Bean) patchViaCapturingAllTheEvents(api); api.patchClass('XMLHttpRequest'); if (supportsWebSocket) { apply(api, _global); } Zone[api.symbol('patchEvents')] = true; } } function canPatchViaPropertyDescriptor(api, _global) { const { isBrowser, isMix } = api.getGlobalObjects(); if ((isBrowser || isMix) && !api.ObjectGetOwnPropertyDescriptor(HTMLElement.prototype, 'onclick') && typeof Element !== 'undefined') { // WebKit https://bugs.webkit.org/show_bug.cgi?id=134364 // IDL interface attributes are not configurable const desc = api.ObjectGetOwnPropertyDescriptor(Element.prototype, 'onclick'); if (desc && !desc.configurable) return false; // try to use onclick to detect whether we can patch via propertyDescriptor // because XMLHttpRequest is not available in service worker if (desc) { api.ObjectDefineProperty(Element.prototype, 'onclick', { enumerable: true, configurable: true, get: function () { return true; }, }); const div = document.createElement('div'); const result = !!div.onclick; api.ObjectDefineProperty(Element.prototype, 'onclick', desc); return result; } } const XMLHttpRequest = _global['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return false; } const ON_READY_STATE_CHANGE = 'onreadystatechange'; const XMLHttpRequestPrototype = XMLHttpRequest.prototype; const xhrDesc = api.ObjectGetOwnPropertyDescriptor(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE); // add enumerable and configurable here because in opera // by default XMLHttpRequest.prototype.onreadystatechange is undefined // without adding enumerable and configurable will cause onreadystatechange // non-configurable // and if XMLHttpRequest.prototype.onreadystatechange is undefined, // we should set a real desc instead a fake one if (xhrDesc) { api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, { enumerable: true, configurable: true, get: function () { return true; }, }); const req = new XMLHttpRequest(); const result = !!req.onreadystatechange; // restore original desc api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, xhrDesc || {}); return result; } else { const SYMBOL_FAKE_ONREADYSTATECHANGE = api.symbol('fake'); api.ObjectDefineProperty(XMLHttpRequestPrototype, ON_READY_STATE_CHANGE, { enumerable: true, configurable: true, get: function () { return this[SYMBOL_FAKE_ONREADYSTATECHANGE]; }, set: function (value) { this[SYMBOL_FAKE_ONREADYSTATECHANGE] = value; }, }); const req = new XMLHttpRequest(); const detectFunc = () => { }; req.onreadystatechange = detectFunc; const result = req[SYMBOL_FAKE_ONREADYSTATECHANGE] === detectFunc; req.onreadystatechange = null; return result; } } const globalEventHandlersEventNames = [ 'abort', 'animationcancel', 'animationend', 'animationiteration', 'auxclick', 'beforeinput', 'blur', 'cancel', 'canplay', 'canplaythrough', 'change', 'compositionstart', 'compositionupdate', 'compositionend', 'cuechange', 'click', 'close', 'contextmenu', 'curechange', 'dblclick', 'drag', 'dragend', 'dragenter', 'dragexit', 'dragleave', 'dragover', 'drop', 'durationchange', 'emptied', 'ended', 'error', 'focus', 'focusin', 'focusout', 'gotpointercapture', 'input', 'invalid', 'keydown', 'keypress', 'keyup', 'load', 'loadstart', 'loadeddata', 'loadedmetadata', 'lostpointercapture', 'mousedown', 'mouseenter', 'mouseleave', 'mousemove', 'mouseout', 'mouseover', 'mouseup', 'mousewheel', 'orientationchange', 'pause', 'play', 'playing', 'pointercancel', 'pointerdown', 'pointerenter', 'pointerleave', 'pointerlockchange', 'mozpointerlockchange', 'webkitpointerlockerchange', 'pointerlockerror', 'mozpointerlockerror', 'webkitpointerlockerror', 'pointermove', 'pointout', 'pointerover', 'pointerup', 'progress', 'ratechange', 'reset', 'resize', 'scroll', 'seeked', 'seeking', 'select', 'selectionchange', 'selectstart', 'show', 'sort', 'stalled', 'submit', 'suspend', 'timeupdate', 'volumechange', 'touchcancel', 'touchmove', 'touchstart', 'touchend', 'transitioncancel', 'transitionend', 'waiting', 'wheel', ]; const documentEventNames = [ 'afterscriptexecute', 'beforescriptexecute', 'DOMContentLoaded', 'freeze', 'fullscreenchange', 'mozfullscreenchange', 'webkitfullscreenchange', 'msfullscreenchange', 'fullscreenerror', 'mozfullscreenerror', 'webkitfullscreenerror', 'msfullscreenerror', 'readystatechange', 'visibilitychange', 'resume', ]; const windowEventNames = [ 'absolutedeviceorientation', 'afterinput', 'afterprint', 'appinstalled', 'beforeinstallprompt', 'beforeprint', 'beforeunload', 'devicelight', 'devicemotion', 'deviceorientation', 'deviceorientationabsolute', 'deviceproximity', 'hashchange', 'languagechange', 'message', 'mozbeforepaint', 'offline', 'online', 'paint', 'pageshow', 'pagehide', 'popstate', 'rejectionhandled', 'storage', 'unhandledrejection', 'unload', 'userproximity', 'vrdisplayconnected', 'vrdisplaydisconnected', 'vrdisplaypresentchange', ]; const htmlElementEventNames = [ 'beforecopy', 'beforecut', 'beforepaste', 'copy', 'cut', 'paste', 'dragstart', 'loadend', 'animationstart', 'search', 'transitionrun', 'transitionstart', 'webkitanimationend', 'webkitanimationiteration', 'webkitanimationstart', 'webkittransitionend', ]; const ieElementEventNames = [ 'activate', 'afterupdate', 'ariarequest', 'beforeactivate', 'beforedeactivate', 'beforeeditfocus', 'beforeupdate', 'cellchange', 'controlselect', 'dataavailable', 'datasetchanged', 'datasetcomplete', 'errorupdate', 'filterchange', 'layoutcomplete', 'losecapture', 'move', 'moveend', 'movestart', 'propertychange', 'resizeend', 'resizestart', 'rowenter', 'rowexit', 'rowsdelete', 'rowsinserted', 'command', 'compassneedscalibration', 'deactivate', 'help', 'mscontentzoom', 'msmanipulationstatechanged', 'msgesturechange', 'msgesturedoubletap', 'msgestureend', 'msgesturehold', 'msgesturestart', 'msgesturetap', 'msgotpointercapture', 'msinertiastart', 'mslostpointercapture', 'mspointercancel', 'mspointerdown', 'mspointerenter', 'mspointerhover', 'mspointerleave', 'mspointermove', 'mspointerout', 'mspointerover', 'mspointerup', 'pointerout', 'mssitemodejumplistitemremoved', 'msthumbnailclick', 'stop', 'storagecommit', ]; const webglEventNames = ['webglcontextrestored', 'webglcontextlost', 'webglcontextcreationerror']; const formEventNames = ['autocomplete', 'autocompleteerror']; const detailEventNames = ['toggle']; const eventNames = [ ...globalEventHandlersEventNames, ...webglEventNames, ...formEventNames, ...detailEventNames, ...documentEventNames, ...windowEventNames, ...htmlElementEventNames, ...ieElementEventNames, ]; // Whenever any eventListener fires, we check the eventListener target and all parents // for `onwhatever` properties and replace them with zone-bound functions // - Chrome (for now) function patchViaCapturingAllTheEvents(api) { const unboundKey = api.symbol('unbound'); for (let i = 0; i < eventNames.length; i++) { const property = eventNames[i]; const onproperty = 'on' + property; self.addEventListener(property, function (event) { let elt = event.target, bound, source; if (elt) { source = elt.constructor['name'] + '.' + onproperty; } else { source = 'unknown.' + onproperty; } while (elt) { if (elt[onproperty] && !elt[onproperty][unboundKey]) { bound = api.wrapWithCurrentZone(elt[onproperty], source); bound[unboundKey] = elt[onproperty]; elt[onproperty] = bound; } elt = elt.parentElement; } }, true); } } function registerElementPatch(_global, api) { const { isBrowser, isMix } = api.getGlobalObjects(); if ((!isBrowser && !isMix) || !('registerElement' in _global.document)) { return; } const callbacks = [ 'createdCallback', 'attachedCallback', 'detachedCallback', 'attributeChangedCallback', ]; api.patchCallbacks(api, document, 'Document', 'registerElement', callbacks); } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowserLegacy() { const _global = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {}; const symbolPrefix = _global['__Zone_symbol_prefix'] || '__zone_symbol__'; function __symbol__(name) { return symbolPrefix + name; } _global[__symbol__('legacyPatch')] = function () { const Zone = _global['Zone']; Zone.__load_patch('defineProperty', (global, Zone, api) => { api._redefineProperty = _redefineProperty; propertyPatch(); }); Zone.__load_patch('registerElement', (global, Zone, api) => { registerElementPatch(global, api); }); Zone.__load_patch('EventTargetLegacy', (global, Zone, api) => { eventTargetLegacyPatch(global, api); propertyDescriptorLegacyPatch(api, global); }); }; } patchBrowserLegacy(); V$x+"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */let zoneSymbol,_defineProperty,_getOwnPropertyDescriptor,_create,unconfigurablesKey;function propertyPatch(){zoneSymbol=Zone.__symbol__,_defineProperty=Object[zoneSymbol("defineProperty")]=Object.defineProperty,_getOwnPropertyDescriptor=Object[zoneSymbol("getOwnPropertyDescriptor")]=Object.getOwnPropertyDescriptor,_create=Object.create,unconfigurablesKey=zoneSymbol("unconfigurables"),Object.defineProperty=function(e,t,n){if(isUnconfigurable(e,t))throw new TypeError("Cannot assign to read only property '"+t+"' of "+e);const r=n.configurable;return"prototype"!==t&&(n=rewriteDescriptor(e,t,n)),_tryDefineProperty(e,t,n,r)},Object.defineProperties=function(e,t){Object.keys(t).forEach((function(n){Object.defineProperty(e,n,t[n])}));for(const n of Object.getOwnPropertySymbols(t)){const r=Object.getOwnPropertyDescriptor(t,n);r?.enumerable&&Object.defineProperty(e,n,t[n])}return e},Object.create=function(e,t){return"object"!=typeof t||Object.isFrozen(t)||Object.keys(t).forEach((function(n){t[n]=rewriteDescriptor(e,n,t[n])})),_create(e,t)},Object.getOwnPropertyDescriptor=function(e,t){const n=_getOwnPropertyDescriptor(e,t);return n&&isUnconfigurable(e,t)&&(n.configurable=!1),n}}function _redefineProperty(e,t,n){const r=n.configurable;return _tryDefineProperty(e,t,n=rewriteDescriptor(e,t,n),r)}function isUnconfigurable(e,t){return e&&e[unconfigurablesKey]&&e[unconfigurablesKey][t]}function rewriteDescriptor(e,t,n){return Object.isFrozen(n)||(n.configurable=!0),n.configurable||(e[unconfigurablesKey]||Object.isFrozen(e)||_defineProperty(e,unconfigurablesKey,{writable:!0,value:{}}),e[unconfigurablesKey]&&(e[unconfigurablesKey][t]=!0)),n}function _tryDefineProperty(e,t,n,r){try{return _defineProperty(e,t,n)}catch(o){if(!n.configurable)throw o;void 0===r?delete n.configurable:n.configurable=r;try{return _defineProperty(e,t,n)}catch(r){let o=!1;if("createdCallback"!==t&&"attachedCallback"!==t&&"detachedCallback"!==t&&"attributeChangedCallback"!==t||(o=!0),!o)throw r;let a=null;try{a=JSON.stringify(n)}catch(e){a=n.toString()}console.log(`Attempting to configure '${t}' with descriptor '${a}' on object '${e}' and got error, giving up: ${r}`)}}}function eventTargetLegacyPatch(e,t){const{eventNames:n,globalSources:r,zoneSymbolEventNames:o,TRUE_STR:a,FALSE_STR:c,ZONE_SYMBOL_PREFIX:i}=t.getGlobalObjects(),s="ApplicationCache,EventSource,FileReader,InputMethodContext,MediaController,MessagePort,Node,Performance,SVGElementInstance,SharedWorker,TextTrack,TextTrackCue,TextTrackList,WebKitNamedFlow,Window,Worker,WorkerGlobalScope,XMLHttpRequest,XMLHttpRequestEventTarget,XMLHttpRequestUpload,IDBRequest,IDBOpenDBRequest,IDBDatabase,IDBTransaction,IDBCursor,DBIndex,WebSocket".split(","),l="EventTarget";let p=[];const u=e.wtf,d="Anchor,Area,Audio,BR,Base,BaseFont,Body,Button,Canvas,Content,DList,Directory,Div,Embed,FieldSet,Font,Form,Frame,FrameSet,HR,Head,Heading,Html,IFrame,Image,Input,Keygen,LI,Label,Legend,Link,Map,Marquee,Media,Menu,Meta,Meter,Mod,OList,Object,OptGroup,Option,Output,Paragraph,Pre,Progress,Quote,Script,Select,Source,Span,Style,TableCaption,TableCell,TableCol,Table,TableRow,TableSection,TextArea,Title,Track,UList,Unknown,Video".split(",");u?p=d.map((e=>"HTML"+e+"Element")).concat(s):e[l]?p.push(l):p=s;const g=e.__Zone_disable_IE_check||!1,m=e.__Zone_enable_cross_context_check||!1,f=t.isIEOrEdge(),b="[object FunctionWrapper]",y="function __BROWSERTOOLS_CONSOLE_SAFEFUNC() { [native code] }",h={MSPointerCancel:"pointercancel",MSPointerDown:"pointerdown",MSPointerEnter:"pointerenter",MSPointerHover:"pointerhover",MSPointerLeave:"pointerleave",MSPointerMove:"pointermove",MSPointerOut:"pointerout",MSPointerOver:"pointerover",MSPointerUp:"pointerup"};for(let e=0;eh[e]||e}),Zone[t.symbol("patchEventTarget")]=!!e[l],!0}function apply(e,t){const{ADD_EVENT_LISTENER_STR:n,REMOVE_EVENT_LISTENER_STR:r}=e.getGlobalObjects(),o=t.WebSocket;t.EventTarget||e.patchEventTarget(t,e,[o.prototype]),t.WebSocket=function(t,a){const c=arguments.length>1?new o(t,a):new o(t);let i,s;const l=e.ObjectGetOwnPropertyDescriptor(c,"onmessage");return l&&!1===l.configurable?(i=e.ObjectCreate(c),s=c,[n,r,"send","close"].forEach((function(t){i[t]=function(){const o=e.ArraySlice.call(arguments);if(t===n||t===r){const e=o.length>0?o[0]:void 0;if(e){const t=Zone.__symbol__("ON_PROPERTY"+e);c[t]=i[t]}}return c[t].apply(c,o)}}))):i=c,e.patchOnProperties(i,["close","error","message","open"],s),i};const a=t.WebSocket;for(const e in o)a[e]=o[e]}function propertyDescriptorLegacyPatch(e,t){const{isNode:n,isMix:r}=e.getGlobalObjects();if((!n||r)&&!canPatchViaPropertyDescriptor(e,t)){const n="undefined"!=typeof WebSocket;patchViaCapturingAllTheEvents(e),e.patchClass("XMLHttpRequest"),n&&apply(e,t),Zone[e.symbol("patchEvents")]=!0}}function canPatchViaPropertyDescriptor(e,t){const{isBrowser:n,isMix:r}=e.getGlobalObjects();if((n||r)&&!e.ObjectGetOwnPropertyDescriptor(HTMLElement.prototype,"onclick")&&"undefined"!=typeof Element){const t=e.ObjectGetOwnPropertyDescriptor(Element.prototype,"onclick");if(t&&!t.configurable)return!1;if(t){e.ObjectDefineProperty(Element.prototype,"onclick",{enumerable:!0,configurable:!0,get:function(){return!0}});const n=!!document.createElement("div").onclick;return e.ObjectDefineProperty(Element.prototype,"onclick",t),n}}const o=t.XMLHttpRequest;if(!o)return!1;const a="onreadystatechange",c=o.prototype,i=e.ObjectGetOwnPropertyDescriptor(c,a);if(i){e.ObjectDefineProperty(c,a,{enumerable:!0,configurable:!0,get:function(){return!0}});const t=!!(new o).onreadystatechange;return e.ObjectDefineProperty(c,a,i||{}),t}{const t=e.symbol("fake");e.ObjectDefineProperty(c,a,{enumerable:!0,configurable:!0,get:function(){return this[t]},set:function(e){this[t]=e}});const n=new o,r=()=>{};n.onreadystatechange=r;const i=n[t]===r;return n.onreadystatechange=null,i}}const globalEventHandlersEventNames=["abort","animationcancel","animationend","animationiteration","auxclick","beforeinput","blur","cancel","canplay","canplaythrough","change","compositionstart","compositionupdate","compositionend","cuechange","click","close","contextmenu","curechange","dblclick","drag","dragend","dragenter","dragexit","dragleave","dragover","drop","durationchange","emptied","ended","error","focus","focusin","focusout","gotpointercapture","input","invalid","keydown","keypress","keyup","load","loadstart","loadeddata","loadedmetadata","lostpointercapture","mousedown","mouseenter","mouseleave","mousemove","mouseout","mouseover","mouseup","mousewheel","orientationchange","pause","play","playing","pointercancel","pointerdown","pointerenter","pointerleave","pointerlockchange","mozpointerlockchange","webkitpointerlockerchange","pointerlockerror","mozpointerlockerror","webkitpointerlockerror","pointermove","pointout","pointerover","pointerup","progress","ratechange","reset","resize","scroll","seeked","seeking","select","selectionchange","selectstart","show","sort","stalled","submit","suspend","timeupdate","volumechange","touchcancel","touchmove","touchstart","touchend","transitioncancel","transitionend","waiting","wheel"],documentEventNames=["afterscriptexecute","beforescriptexecute","DOMContentLoaded","freeze","fullscreenchange","mozfullscreenchange","webkitfullscreenchange","msfullscreenchange","fullscreenerror","mozfullscreenerror","webkitfullscreenerror","msfullscreenerror","readystatechange","visibilitychange","resume"],windowEventNames=["absolutedeviceorientation","afterinput","afterprint","appinstalled","beforeinstallprompt","beforeprint","beforeunload","devicelight","devicemotion","deviceorientation","deviceorientationabsolute","deviceproximity","hashchange","languagechange","message","mozbeforepaint","offline","online","paint","pageshow","pagehide","popstate","rejectionhandled","storage","unhandledrejection","unload","userproximity","vrdisplayconnected","vrdisplaydisconnected","vrdisplaypresentchange"],htmlElementEventNames=["beforecopy","beforecut","beforepaste","copy","cut","paste","dragstart","loadend","animationstart","search","transitionrun","transitionstart","webkitanimationend","webkitanimationiteration","webkitanimationstart","webkittransitionend"],ieElementEventNames=["activate","afterupdate","ariarequest","beforeactivate","beforedeactivate","beforeeditfocus","beforeupdate","cellchange","controlselect","dataavailable","datasetchanged","datasetcomplete","errorupdate","filterchange","layoutcomplete","losecapture","move","moveend","movestart","propertychange","resizeend","resizestart","rowenter","rowexit","rowsdelete","rowsinserted","command","compassneedscalibration","deactivate","help","mscontentzoom","msmanipulationstatechanged","msgesturechange","msgesturedoubletap","msgestureend","msgesturehold","msgesturestart","msgesturetap","msgotpointercapture","msinertiastart","mslostpointercapture","mspointercancel","mspointerdown","mspointerenter","mspointerhover","mspointerleave","mspointermove","mspointerout","mspointerover","mspointerup","pointerout","mssitemodejumplistitemremoved","msthumbnailclick","stop","storagecommit"],webglEventNames=["webglcontextrestored","webglcontextlost","webglcontextcreationerror"],formEventNames=["autocomplete","autocompleteerror"],detailEventNames=["toggle"],eventNames=[...globalEventHandlersEventNames,...webglEventNames,...formEventNames,...detailEventNames,...documentEventNames,...windowEventNames,...htmlElementEventNames,...ieElementEventNames];function patchViaCapturingAllTheEvents(e){const t=e.symbol("unbound");for(let n=0;n{n._redefineProperty=_redefineProperty,propertyPatch()})),t.__load_patch("registerElement",((e,t,n)=>{registerElementPatch(e,n)})),t.__load_patch("EventTargetLegacy",((e,t,n)=>{eventTargetLegacyPatch(e,n),propertyDescriptorLegacyPatch(n,e)}))}}patchBrowserLegacy();Hx'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ const global = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { const symbolPrefix = global['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } function initZone() { const performance = global['performance']; function mark(name) { performance && performance['mark'] && performance['mark'](name); } function performanceMeasure(name, label) { performance && performance['measure'] && performance['measure'](name, label); } mark('Zone'); class ZoneImpl { static __symbol__ = __symbol__; static assertZonePatched() { if (global['Promise'] !== patches['ZoneAwarePromise']) { throw new Error('Zone.js has detected that ZoneAwarePromise `(window|global).Promise` ' + 'has been overwritten.\n' + 'Most likely cause is that a Promise polyfill has been loaded ' + 'after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. ' + 'If you must load one, do so before loading zone.js.)'); } } static get root() { let zone = ZoneImpl.current; while (zone.parent) { zone = zone.parent; } return zone; } static get current() { return _currentZoneFrame.zone; } static get currentTask() { return _currentTask; } static __load_patch(name, fn, ignoreDuplicate = false) { if (patches.hasOwnProperty(name)) { // `checkDuplicate` option is defined from global variable // so it works for all modules. // `ignoreDuplicate` can work for the specified module const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (!ignoreDuplicate && checkDuplicate) { throw Error('Already loaded patch: ' + name); } } else if (!global['__Zone_disable_' + name]) { const perfName = 'Zone:' + name; mark(perfName); patches[name] = fn(global, ZoneImpl, _api); performanceMeasure(perfName, perfName); } } get parent() { return this._parent; } get name() { return this._name; } _parent; _name; _properties; _zoneDelegate; constructor(parent, zoneSpec) { this._parent = parent; this._name = zoneSpec ? zoneSpec.name || 'unnamed' : ''; this._properties = (zoneSpec && zoneSpec.properties) || {}; this._zoneDelegate = new _ZoneDelegate(this, this._parent && this._parent._zoneDelegate, zoneSpec); } get(key) { const zone = this.getZoneWith(key); if (zone) return zone._properties[key]; } getZoneWith(key) { let current = this; while (current) { if (current._properties.hasOwnProperty(key)) { return current; } current = current._parent; } return null; } fork(zoneSpec) { if (!zoneSpec) throw new Error('ZoneSpec required!'); return this._zoneDelegate.fork(this, zoneSpec); } wrap(callback, source) { if (typeof callback !== 'function') { throw new Error('Expecting function got: ' + callback); } const _callback = this._zoneDelegate.intercept(this, callback, source); const zone = this; return function () { return zone.runGuarded(_callback, this, arguments, source); }; } run(callback, applyThis, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runGuarded(callback, applyThis = null, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runTask(task, applyThis, applyArgs) { if (task.zone != this) { throw new Error('A task can only be run in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); } const zoneTask = task; // https://github.com/angular/zone.js/issues/778, sometimes eventTask // will run in notScheduled(canceled) state, we should not try to // run such kind of task but just return const { type, data: { isPeriodic = false, isRefreshable = false } = {} } = task; if (task.state === notScheduled && (type === eventTask || type === macroTask)) { return; } const reEntryGuard = task.state != running; reEntryGuard && zoneTask._transitionTo(running, scheduled); const previousTask = _currentTask; _currentTask = zoneTask; _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { if (type == macroTask && task.data && !isPeriodic && !isRefreshable) { task.cancelFn = undefined; } try { return this._zoneDelegate.invokeTask(this, zoneTask, applyThis, applyArgs); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { // if the task's state is notScheduled or unknown, then it has already been cancelled // we should not reset the state to scheduled const state = task.state; if (state !== notScheduled && state !== unknown) { if (type == eventTask || isPeriodic || (isRefreshable && state === scheduling)) { reEntryGuard && zoneTask._transitionTo(scheduled, running, scheduling); } else { const zoneDelegates = zoneTask._zoneDelegates; this._updateTaskCount(zoneTask, -1); reEntryGuard && zoneTask._transitionTo(notScheduled, running, notScheduled); if (isRefreshable) { zoneTask._zoneDelegates = zoneDelegates; } } } _currentZoneFrame = _currentZoneFrame.parent; _currentTask = previousTask; } } scheduleTask(task) { if (task.zone && task.zone !== this) { // check if the task was rescheduled, the newZone // should not be the children of the original zone let newZone = this; while (newZone) { if (newZone === task.zone) { throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${task.zone.name}`); } newZone = newZone.parent; } } task._transitionTo(scheduling, notScheduled); const zoneDelegates = []; task._zoneDelegates = zoneDelegates; task._zone = this; try { task = this._zoneDelegate.scheduleTask(this, task); } catch (err) { // should set task's state to unknown when scheduleTask throw error // because the err may from reschedule, so the fromState maybe notScheduled task._transitionTo(unknown, scheduling, notScheduled); // TODO: @JiaLiPassion, should we check the result from handleError? this._zoneDelegate.handleError(this, err); throw err; } if (task._zoneDelegates === zoneDelegates) { // we have to check because internally the delegate can reschedule the task. this._updateTaskCount(task, 1); } if (task.state == scheduling) { task._transitionTo(scheduled, scheduling); } return task; } scheduleMicroTask(source, callback, data, customSchedule) { return this.scheduleTask(new ZoneTask(microTask, source, callback, data, customSchedule, undefined)); } scheduleMacroTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(macroTask, source, callback, data, customSchedule, customCancel)); } scheduleEventTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(eventTask, source, callback, data, customSchedule, customCancel)); } cancelTask(task) { if (task.zone != this) throw new Error('A task can only be cancelled in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); if (task.state !== scheduled && task.state !== running) { return; } task._transitionTo(canceling, scheduled, running); try { this._zoneDelegate.cancelTask(this, task); } catch (err) { // if error occurs when cancelTask, transit the state to unknown task._transitionTo(unknown, canceling); this._zoneDelegate.handleError(this, err); throw err; } this._updateTaskCount(task, -1); task._transitionTo(notScheduled, canceling); task.runCount = -1; return task; } _updateTaskCount(task, count) { const zoneDelegates = task._zoneDelegates; if (count == -1) { task._zoneDelegates = null; } for (let i = 0; i < zoneDelegates.length; i++) { zoneDelegates[i]._updateTaskCount(task.type, count); } } } const DELEGATE_ZS = { name: '', onHasTask: (delegate, _, target, hasTaskState) => delegate.hasTask(target, hasTaskState), onScheduleTask: (delegate, _, target, task) => delegate.scheduleTask(target, task), onInvokeTask: (delegate, _, target, task, applyThis, applyArgs) => delegate.invokeTask(target, task, applyThis, applyArgs), onCancelTask: (delegate, _, target, task) => delegate.cancelTask(target, task), }; class _ZoneDelegate { get zone() { return this._zone; } _zone; _taskCounts = { 'microTask': 0, 'macroTask': 0, 'eventTask': 0, }; _parentDelegate; _forkDlgt; _forkZS; _forkCurrZone; _interceptDlgt; _interceptZS; _interceptCurrZone; _invokeDlgt; _invokeZS; _invokeCurrZone; _handleErrorDlgt; _handleErrorZS; _handleErrorCurrZone; _scheduleTaskDlgt; _scheduleTaskZS; _scheduleTaskCurrZone; _invokeTaskDlgt; _invokeTaskZS; _invokeTaskCurrZone; _cancelTaskDlgt; _cancelTaskZS; _cancelTaskCurrZone; _hasTaskDlgt; _hasTaskDlgtOwner; _hasTaskZS; _hasTaskCurrZone; constructor(zone, parentDelegate, zoneSpec) { this._zone = zone; this._parentDelegate = parentDelegate; this._forkZS = zoneSpec && (zoneSpec && zoneSpec.onFork ? zoneSpec : parentDelegate._forkZS); this._forkDlgt = zoneSpec && (zoneSpec.onFork ? parentDelegate : parentDelegate._forkDlgt); this._forkCurrZone = zoneSpec && (zoneSpec.onFork ? this._zone : parentDelegate._forkCurrZone); this._interceptZS = zoneSpec && (zoneSpec.onIntercept ? zoneSpec : parentDelegate._interceptZS); this._interceptDlgt = zoneSpec && (zoneSpec.onIntercept ? parentDelegate : parentDelegate._interceptDlgt); this._interceptCurrZone = zoneSpec && (zoneSpec.onIntercept ? this._zone : parentDelegate._interceptCurrZone); this._invokeZS = zoneSpec && (zoneSpec.onInvoke ? zoneSpec : parentDelegate._invokeZS); this._invokeDlgt = zoneSpec && (zoneSpec.onInvoke ? parentDelegate : parentDelegate._invokeDlgt); this._invokeCurrZone = zoneSpec && (zoneSpec.onInvoke ? this._zone : parentDelegate._invokeCurrZone); this._handleErrorZS = zoneSpec && (zoneSpec.onHandleError ? zoneSpec : parentDelegate._handleErrorZS); this._handleErrorDlgt = zoneSpec && (zoneSpec.onHandleError ? parentDelegate : parentDelegate._handleErrorDlgt); this._handleErrorCurrZone = zoneSpec && (zoneSpec.onHandleError ? this._zone : parentDelegate._handleErrorCurrZone); this._scheduleTaskZS = zoneSpec && (zoneSpec.onScheduleTask ? zoneSpec : parentDelegate._scheduleTaskZS); this._scheduleTaskDlgt = zoneSpec && (zoneSpec.onScheduleTask ? parentDelegate : parentDelegate._scheduleTaskDlgt); this._scheduleTaskCurrZone = zoneSpec && (zoneSpec.onScheduleTask ? this._zone : parentDelegate._scheduleTaskCurrZone); this._invokeTaskZS = zoneSpec && (zoneSpec.onInvokeTask ? zoneSpec : parentDelegate._invokeTaskZS); this._invokeTaskDlgt = zoneSpec && (zoneSpec.onInvokeTask ? parentDelegate : parentDelegate._invokeTaskDlgt); this._invokeTaskCurrZone = zoneSpec && (zoneSpec.onInvokeTask ? this._zone : parentDelegate._invokeTaskCurrZone); this._cancelTaskZS = zoneSpec && (zoneSpec.onCancelTask ? zoneSpec : parentDelegate._cancelTaskZS); this._cancelTaskDlgt = zoneSpec && (zoneSpec.onCancelTask ? parentDelegate : parentDelegate._cancelTaskDlgt); this._cancelTaskCurrZone = zoneSpec && (zoneSpec.onCancelTask ? this._zone : parentDelegate._cancelTaskCurrZone); this._hasTaskZS = null; this._hasTaskDlgt = null; this._hasTaskDlgtOwner = null; this._hasTaskCurrZone = null; const zoneSpecHasTask = zoneSpec && zoneSpec.onHasTask; const parentHasTask = parentDelegate && parentDelegate._hasTaskZS; if (zoneSpecHasTask || parentHasTask) { // If we need to report hasTask, than this ZS needs to do ref counting on tasks. In such // a case all task related interceptors must go through this ZD. We can't short circuit it. this._hasTaskZS = zoneSpecHasTask ? zoneSpec : DELEGATE_ZS; this._hasTaskDlgt = parentDelegate; this._hasTaskDlgtOwner = this; this._hasTaskCurrZone = this._zone; if (!zoneSpec.onScheduleTask) { this._scheduleTaskZS = DELEGATE_ZS; this._scheduleTaskDlgt = parentDelegate; this._scheduleTaskCurrZone = this._zone; } if (!zoneSpec.onInvokeTask) { this._invokeTaskZS = DELEGATE_ZS; this._invokeTaskDlgt = parentDelegate; this._invokeTaskCurrZone = this._zone; } if (!zoneSpec.onCancelTask) { this._cancelTaskZS = DELEGATE_ZS; this._cancelTaskDlgt = parentDelegate; this._cancelTaskCurrZone = this._zone; } } } fork(targetZone, zoneSpec) { return this._forkZS ? this._forkZS.onFork(this._forkDlgt, this.zone, targetZone, zoneSpec) : new ZoneImpl(targetZone, zoneSpec); } intercept(targetZone, callback, source) { return this._interceptZS ? this._interceptZS.onIntercept(this._interceptDlgt, this._interceptCurrZone, targetZone, callback, source) : callback; } invoke(targetZone, callback, applyThis, applyArgs, source) { return this._invokeZS ? this._invokeZS.onInvoke(this._invokeDlgt, this._invokeCurrZone, targetZone, callback, applyThis, applyArgs, source) : callback.apply(applyThis, applyArgs); } handleError(targetZone, error) { return this._handleErrorZS ? this._handleErrorZS.onHandleError(this._handleErrorDlgt, this._handleErrorCurrZone, targetZone, error) : true; } scheduleTask(targetZone, task) { let returnTask = task; if (this._scheduleTaskZS) { if (this._hasTaskZS) { returnTask._zoneDelegates.push(this._hasTaskDlgtOwner); } returnTask = this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this._scheduleTaskCurrZone, targetZone, task); if (!returnTask) returnTask = task; } else { if (task.scheduleFn) { task.scheduleFn(task); } else if (task.type == microTask) { scheduleMicroTask(task); } else { throw new Error('Task is missing scheduleFn.'); } } return returnTask; } invokeTask(targetZone, task, applyThis, applyArgs) { return this._invokeTaskZS ? this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt, this._invokeTaskCurrZone, targetZone, task, applyThis, applyArgs) : task.callback.apply(applyThis, applyArgs); } cancelTask(targetZone, task) { let value; if (this._cancelTaskZS) { value = this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt, this._cancelTaskCurrZone, targetZone, task); } else { if (!task.cancelFn) { throw Error('Task is not cancelable'); } value = task.cancelFn(task); } return value; } hasTask(targetZone, isEmpty) { // hasTask should not throw error so other ZoneDelegate // can still trigger hasTask callback try { this._hasTaskZS && this._hasTaskZS.onHasTask(this._hasTaskDlgt, this._hasTaskCurrZone, targetZone, isEmpty); } catch (err) { this.handleError(targetZone, err); } } _updateTaskCount(type, count) { const counts = this._taskCounts; const prev = counts[type]; const next = (counts[type] = prev + count); if (next < 0) { throw new Error('More tasks executed then were scheduled.'); } if (prev == 0 || next == 0) { const isEmpty = { microTask: counts['microTask'] > 0, macroTask: counts['macroTask'] > 0, eventTask: counts['eventTask'] > 0, change: type, }; this.hasTask(this._zone, isEmpty); } } } class ZoneTask { type; source; invoke; callback; data; scheduleFn; cancelFn; _zone = null; runCount = 0; _zoneDelegates = null; _state = 'notScheduled'; constructor(type, source, callback, options, scheduleFn, cancelFn) { this.type = type; this.source = source; this.data = options; this.scheduleFn = scheduleFn; this.cancelFn = cancelFn; if (!callback) { throw new Error('callback is not defined'); } this.callback = callback; const self = this; // TODO: @JiaLiPassion options should have interface if (type === eventTask && options && options.useG) { this.invoke = ZoneTask.invokeTask; } else { this.invoke = function () { return ZoneTask.invokeTask.call(global, self, this, arguments); }; } } static invokeTask(task, target, args) { if (!task) { task = this; } _numberOfNestedTaskFrames++; try { task.runCount++; return task.zone.runTask(task, target, args); } finally { if (_numberOfNestedTaskFrames == 1) { drainMicroTaskQueue(); } _numberOfNestedTaskFrames--; } } get zone() { return this._zone; } get state() { return this._state; } cancelScheduleRequest() { this._transitionTo(notScheduled, scheduling); } _transitionTo(toState, fromState1, fromState2) { if (this._state === fromState1 || this._state === fromState2) { this._state = toState; if (toState == notScheduled) { this._zoneDelegates = null; } } else { throw new Error(`${this.type} '${this.source}': can not transition to '${toState}', expecting state '${fromState1}'${fromState2 ? " or '" + fromState2 + "'" : ''}, was '${this._state}'.`); } } toString() { if (this.data && typeof this.data.handleId !== 'undefined') { return this.data.handleId.toString(); } else { return Object.prototype.toString.call(this); } } // add toJSON method to prevent cyclic error when // call JSON.stringify(zoneTask) toJSON() { return { type: this.type, state: this.state, source: this.source, zone: this.zone.name, runCount: this.runCount, }; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// MICROTASK QUEUE ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const symbolSetTimeout = __symbol__('setTimeout'); const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); let _microTaskQueue = []; let _isDrainingMicrotaskQueue = false; let nativeMicroTaskQueuePromise; function nativeScheduleMicroTask(func) { if (!nativeMicroTaskQueuePromise) { if (global[symbolPromise]) { nativeMicroTaskQueuePromise = global[symbolPromise].resolve(0); } } if (nativeMicroTaskQueuePromise) { let nativeThen = nativeMicroTaskQueuePromise[symbolThen]; if (!nativeThen) { // native Promise is not patchable, we need to use `then` directly // issue 1078 nativeThen = nativeMicroTaskQueuePromise['then']; } nativeThen.call(nativeMicroTaskQueuePromise, func); } else { global[symbolSetTimeout](func, 0); } } function scheduleMicroTask(task) { // if we are not running in any task, and there has not been anything scheduled // we must bootstrap the initial task creation by manually scheduling the drain if (_numberOfNestedTaskFrames === 0 && _microTaskQueue.length === 0) { // We are not running in Task, so we need to kickstart the microtask queue. nativeScheduleMicroTask(drainMicroTaskQueue); } task && _microTaskQueue.push(task); } function drainMicroTaskQueue() { if (!_isDrainingMicrotaskQueue) { _isDrainingMicrotaskQueue = true; while (_microTaskQueue.length) { const queue = _microTaskQueue; _microTaskQueue = []; for (let i = 0; i < queue.length; i++) { const task = queue[i]; try { task.zone.runTask(task, null, null); } catch (error) { _api.onUnhandledError(error); } } } _api.microtaskDrainDone(); _isDrainingMicrotaskQueue = false; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// BOOTSTRAP ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const NO_ZONE = { name: 'NO ZONE' }; const notScheduled = 'notScheduled', scheduling = 'scheduling', scheduled = 'scheduled', running = 'running', canceling = 'canceling', unknown = 'unknown'; const microTask = 'microTask', macroTask = 'macroTask', eventTask = 'eventTask'; const patches = {}; const _api = { symbol: __symbol__, currentZoneFrame: () => _currentZoneFrame, onUnhandledError: noop, microtaskDrainDone: noop, scheduleMicroTask: scheduleMicroTask, showUncaughtError: () => !ZoneImpl[__symbol__('ignoreConsoleErrorUncaughtError')], patchEventTarget: () => [], patchOnProperties: noop, patchMethod: () => noop, bindArguments: () => [], patchThen: () => noop, patchMacroTask: () => noop, patchEventPrototype: () => noop, isIEOrEdge: () => false, getGlobalObjects: () => undefined, ObjectDefineProperty: () => noop, ObjectGetOwnPropertyDescriptor: () => undefined, ObjectCreate: () => undefined, ArraySlice: () => [], patchClass: () => noop, wrapWithCurrentZone: () => noop, filterProperties: () => [], attachOriginToPatched: () => noop, _redefineProperty: () => noop, patchCallbacks: () => noop, nativeScheduleMicroTask: nativeScheduleMicroTask, }; let _currentZoneFrame = { parent: null, zone: new ZoneImpl(null, null) }; let _currentTask = null; let _numberOfNestedTaskFrames = 0; function noop() { } performanceMeasure('Zone', 'Zone'); return ZoneImpl; } /** * Suppress closure compiler errors about unknown 'Zone' variable * @fileoverview * @suppress {undefinedVars,globalThis,missingRequire} */ /// // issue #989, to reduce bundle size, use short name /** Object.getOwnPropertyDescriptor */ const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; /** Object.defineProperty */ const ObjectDefineProperty = Object.defineProperty; /** Object.getPrototypeOf */ const ObjectGetPrototypeOf = Object.getPrototypeOf; /** Object.create */ const ObjectCreate = Object.create; /** Array.prototype.slice */ const ArraySlice = Array.prototype.slice; /** addEventListener string const */ const ADD_EVENT_LISTENER_STR = 'addEventListener'; /** removeEventListener string const */ const REMOVE_EVENT_LISTENER_STR = 'removeEventListener'; /** zoneSymbol addEventListener */ const ZONE_SYMBOL_ADD_EVENT_LISTENER = __symbol__(ADD_EVENT_LISTENER_STR); /** zoneSymbol removeEventListener */ const ZONE_SYMBOL_REMOVE_EVENT_LISTENER = __symbol__(REMOVE_EVENT_LISTENER_STR); /** true string const */ const TRUE_STR = 'true'; /** false string const */ const FALSE_STR = 'false'; /** Zone symbol prefix string const. */ const ZONE_SYMBOL_PREFIX = __symbol__(''); function wrapWithCurrentZone(callback, source) { return Zone.current.wrap(callback, source); } function scheduleMacroTaskWithCurrentZone(source, callback, data, customSchedule, customCancel) { return Zone.current.scheduleMacroTask(source, callback, data, customSchedule, customCancel); } const zoneSymbol = __symbol__; const isWindowExists = typeof window !== 'undefined'; const internalWindow = isWindowExists ? window : undefined; const _global = (isWindowExists && internalWindow) || globalThis; const REMOVE_ATTRIBUTE = 'removeAttribute'; function bindArguments(args, source) { for (let i = args.length - 1; i >= 0; i--) { if (typeof args[i] === 'function') { args[i] = wrapWithCurrentZone(args[i], source + '_' + i); } } return args; } function patchPrototype(prototype, fnNames) { const source = prototype.constructor['name']; for (let i = 0; i < fnNames.length; i++) { const name = fnNames[i]; const delegate = prototype[name]; if (delegate) { const prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, name); if (!isPropertyWritable(prototypeDesc)) { continue; } prototype[name] = ((delegate) => { const patched = function () { return delegate.apply(this, bindArguments(arguments, source + '.' + name)); }; attachOriginToPatched(patched, delegate); return patched; })(delegate); } } } function isPropertyWritable(propertyDesc) { if (!propertyDesc) { return true; } if (propertyDesc.writable === false) { return false; } return !(typeof propertyDesc.get === 'function' && typeof propertyDesc.set === 'undefined'); } const isWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope; // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isNode = !('nw' in _global) && typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]'; const isBrowser = !isNode && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); // we are in electron of nw, so we are both browser and nodejs // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isMix = typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]' && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); const zoneSymbolEventNames$1 = {}; const enableBeforeunloadSymbol = zoneSymbol('enable_beforeunload'); const wrapFn = function (event) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } let eventNameSymbol = zoneSymbolEventNames$1[event.type]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[event.type] = zoneSymbol('ON_PROPERTY' + event.type); } const target = this || event.target || _global; const listener = target[eventNameSymbol]; let result; if (isBrowser && target === internalWindow && event.type === 'error') { // window.onerror have different signature // https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror#window.onerror // and onerror callback will prevent default when callback return true const errorEvent = event; result = listener && listener.call(this, errorEvent.message, errorEvent.filename, errorEvent.lineno, errorEvent.colno, errorEvent.error); if (result === true) { event.preventDefault(); } } else { result = listener && listener.apply(this, arguments); if ( // https://github.com/angular/angular/issues/47579 // https://www.w3.org/TR/2011/WD-html5-20110525/history.html#beforeunloadevent // This is the only specific case we should check for. The spec defines that the // `returnValue` attribute represents the message to show the user. When the event // is created, this attribute must be set to the empty string. event.type === 'beforeunload' && // To prevent any breaking changes resulting from this change, given that // it was already causing a significant number of failures in G3, we have hidden // that behavior behind a global configuration flag. Consumers can enable this // flag explicitly if they want the `beforeunload` event to be handled as defined // in the specification. _global[enableBeforeunloadSymbol] && // The IDL event definition is `attribute DOMString returnValue`, so we check whether // `typeof result` is a string. typeof result === 'string') { event.returnValue = result; } else if (result != undefined && !result) { event.preventDefault(); } } return result; }; function patchProperty(obj, prop, prototype) { let desc = ObjectGetOwnPropertyDescriptor(obj, prop); if (!desc && prototype) { // when patch window object, use prototype to check prop exist or not const prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, prop); if (prototypeDesc) { desc = { enumerable: true, configurable: true }; } } // if the descriptor not exists or is not configurable // just return if (!desc || !desc.configurable) { return; } const onPropPatchedSymbol = zoneSymbol('on' + prop + 'patched'); if (obj.hasOwnProperty(onPropPatchedSymbol) && obj[onPropPatchedSymbol]) { return; } // A property descriptor cannot have getter/setter and be writable // deleting the writable and value properties avoids this error: // // TypeError: property descriptors must not specify a value or be writable when a // getter or setter has been specified delete desc.writable; delete desc.value; const originalDescGet = desc.get; const originalDescSet = desc.set; // slice(2) cuz 'onclick' -> 'click', etc const eventName = prop.slice(2); let eventNameSymbol = zoneSymbolEventNames$1[eventName]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[eventName] = zoneSymbol('ON_PROPERTY' + eventName); } desc.set = function (newValue) { // In some versions of Windows, the `this` context may be undefined // in on-property callbacks. // To handle this edge case, we check if `this` is falsy and // fallback to `_global` if needed. let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return; } const previousValue = target[eventNameSymbol]; if (typeof previousValue === 'function') { target.removeEventListener(eventName, wrapFn); } // https://github.com/angular/zone.js/issues/978 // If an inline handler (like `onload`) was defined before zone.js was loaded, // call the original descriptor's setter to clean it up. originalDescSet?.call(target, null); target[eventNameSymbol] = newValue; if (typeof newValue === 'function') { target.addEventListener(eventName, wrapFn, false); } }; // The getter would return undefined for unassigned properties but the default value of an // unassigned property is null desc.get = function () { // in some of windows's onproperty callback, this is undefined // so we need to check it let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return null; } const listener = target[eventNameSymbol]; if (listener) { return listener; } else if (originalDescGet) { // result will be null when use inline event attribute, // such as // because the onclick function is internal raw uncompiled handler // the onclick will be evaluated when first time event was triggered or // the property is accessed, https://github.com/angular/zone.js/issues/525 // so we should use original native get to retrieve the handler let value = originalDescGet.call(this); if (value) { desc.set.call(this, value); if (typeof target[REMOVE_ATTRIBUTE] === 'function') { target.removeAttribute(prop); } return value; } } return null; }; ObjectDefineProperty(obj, prop, desc); obj[onPropPatchedSymbol] = true; } function patchOnProperties(obj, properties, prototype) { if (properties) { for (let i = 0; i < properties.length; i++) { patchProperty(obj, 'on' + properties[i], prototype); } } else { const onProperties = []; for (const prop in obj) { if (prop.slice(0, 2) == 'on') { onProperties.push(prop); } } for (let j = 0; j < onProperties.length; j++) { patchProperty(obj, onProperties[j], prototype); } } } const originalInstanceKey = zoneSymbol('originalInstance'); // wrap some native API on `window` function patchClass(className) { const OriginalClass = _global[className]; if (!OriginalClass) return; // keep original class in global _global[zoneSymbol(className)] = OriginalClass; _global[className] = function () { const a = bindArguments(arguments, className); switch (a.length) { case 0: this[originalInstanceKey] = new OriginalClass(); break; case 1: this[originalInstanceKey] = new OriginalClass(a[0]); break; case 2: this[originalInstanceKey] = new OriginalClass(a[0], a[1]); break; case 3: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2]); break; case 4: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2], a[3]); break; default: throw new Error('Arg list too long.'); } }; // attach original delegate to patched function attachOriginToPatched(_global[className], OriginalClass); const instance = new OriginalClass(function () { }); let prop; for (prop in instance) { // https://bugs.webkit.org/show_bug.cgi?id=44721 if (className === 'XMLHttpRequest' && prop === 'responseBlob') continue; (function (prop) { if (typeof instance[prop] === 'function') { _global[className].prototype[prop] = function () { return this[originalInstanceKey][prop].apply(this[originalInstanceKey], arguments); }; } else { ObjectDefineProperty(_global[className].prototype, prop, { set: function (fn) { if (typeof fn === 'function') { this[originalInstanceKey][prop] = wrapWithCurrentZone(fn, className + '.' + prop); // keep callback in wrapped function so we can // use it in Function.prototype.toString to return // the native one. attachOriginToPatched(this[originalInstanceKey][prop], fn); } else { this[originalInstanceKey][prop] = fn; } }, get: function () { return this[originalInstanceKey][prop]; }, }); } })(prop); } for (prop in OriginalClass) { if (prop !== 'prototype' && OriginalClass.hasOwnProperty(prop)) { _global[className][prop] = OriginalClass[prop]; } } } function copySymbolProperties(src, dest) { if (typeof Object.getOwnPropertySymbols !== 'function') { return; } const symbols = Object.getOwnPropertySymbols(src); symbols.forEach((symbol) => { const desc = Object.getOwnPropertyDescriptor(src, symbol); Object.defineProperty(dest, symbol, { get: function () { return src[symbol]; }, set: function (value) { if (desc && (!desc.writable || typeof desc.set !== 'function')) { // if src[symbol] is not writable or not have a setter, just return return; } src[symbol] = value; }, enumerable: desc ? desc.enumerable : true, configurable: desc ? desc.configurable : true, }); }); } let shouldCopySymbolProperties = false; function setShouldCopySymbolProperties(flag) { shouldCopySymbolProperties = flag; } function patchMethod(target, name, patchFn) { let proto = target; while (proto && !proto.hasOwnProperty(name)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && target[name]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = target; } const delegateName = zoneSymbol(name); let delegate = null; if (proto && (!(delegate = proto[delegateName]) || !proto.hasOwnProperty(delegateName))) { delegate = proto[delegateName] = proto[name]; // check whether proto[name] is writable // some property is readonly in safari, such as HtmlCanvasElement.prototype.toBlob const desc = proto && ObjectGetOwnPropertyDescriptor(proto, name); if (isPropertyWritable(desc)) { const patchDelegate = patchFn(delegate, delegateName, name); proto[name] = function () { return patchDelegate(this, arguments); }; attachOriginToPatched(proto[name], delegate); if (shouldCopySymbolProperties) { copySymbolProperties(delegate, proto[name]); } } } return delegate; } // TODO: @JiaLiPassion, support cancel task later if necessary function patchMacroTask(obj, funcName, metaCreator) { let setNative = null; function scheduleTask(task) { const data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, (delegate) => function (self, args) { const meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return scheduleMacroTaskWithCurrentZone(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }); } function patchMicroTask(obj, funcName, metaCreator) { let setNative = null; function scheduleTask(task) { const data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, (delegate) => function (self, args) { const meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return Zone.current.scheduleMicroTask(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }); } function attachOriginToPatched(patched, original) { patched[zoneSymbol('OriginalDelegate')] = original; } let isDetectedIEOrEdge = false; let ieOrEdge = false; function isIEOrEdge() { if (isDetectedIEOrEdge) { return ieOrEdge; } isDetectedIEOrEdge = true; try { const ua = internalWindow.navigator.userAgent; if (ua.indexOf('MSIE ') !== -1 || ua.indexOf('Trident/') !== -1 || ua.indexOf('Edge/') !== -1) { ieOrEdge = true; } } catch (error) { } return ieOrEdge; } function isFunction(value) { return typeof value === 'function'; } function isNumber(value) { return typeof value === 'number'; } /** * @fileoverview * @suppress {missingRequire} */ // an identifier to tell ZoneTask do not create a new invoke closure const OPTIMIZED_ZONE_EVENT_TASK_DATA = { useG: true, }; const zoneSymbolEventNames = {}; const globalSources = {}; const EVENT_NAME_SYMBOL_REGX = new RegExp('^' + ZONE_SYMBOL_PREFIX + '(\\w+)(true|false)$'); const IMMEDIATE_PROPAGATION_SYMBOL = zoneSymbol('propagationStopped'); function prepareEventNames(eventName, eventNameToString) { const falseEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + FALSE_STR; const trueEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } function patchEventTarget(_global, api, apis, patchOptions) { const ADD_EVENT_LISTENER = (patchOptions && patchOptions.add) || ADD_EVENT_LISTENER_STR; const REMOVE_EVENT_LISTENER = (patchOptions && patchOptions.rm) || REMOVE_EVENT_LISTENER_STR; const LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.listeners) || 'eventListeners'; const REMOVE_ALL_LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.rmAll) || 'removeAllListeners'; const zoneSymbolAddEventListener = zoneSymbol(ADD_EVENT_LISTENER); const ADD_EVENT_LISTENER_SOURCE = '.' + ADD_EVENT_LISTENER + ':'; const PREPEND_EVENT_LISTENER = 'prependListener'; const PREPEND_EVENT_LISTENER_SOURCE = '.' + PREPEND_EVENT_LISTENER + ':'; const invokeTask = function (task, target, event) { // for better performance, check isRemoved which is set // by removeEventListener if (task.isRemoved) { return; } const delegate = task.callback; if (typeof delegate === 'object' && delegate.handleEvent) { // create the bind version of handleEvent when invoke task.callback = (event) => delegate.handleEvent(event); task.originalDelegate = delegate; } // invoke static task.invoke // need to try/catch error here, otherwise, the error in one event listener // will break the executions of the other event listeners. Also error will // not remove the event listener when `once` options is true. let error; try { task.invoke(task, target, [event]); } catch (err) { error = err; } const options = task.options; if (options && typeof options === 'object' && options.once) { // if options.once is true, after invoke once remove listener here // only browser need to do this, nodejs eventEmitter will cal removeListener // inside EventEmitter.once const delegate = task.originalDelegate ? task.originalDelegate : task.callback; target[REMOVE_EVENT_LISTENER].call(target, event.type, delegate, options); } return error; }; function globalCallback(context, event, isCapture) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } // event.target is needed for Samsung TV and SourceBuffer // || global is needed https://github.com/angular/zone.js/issues/190 const target = context || event.target || _global; const tasks = target[zoneSymbolEventNames[event.type][isCapture ? TRUE_STR : FALSE_STR]]; if (tasks) { const errors = []; // invoke all tasks which attached to current target with given event.type and capture = false // for performance concern, if task.length === 1, just invoke if (tasks.length === 1) { const err = invokeTask(tasks[0], target, event); err && errors.push(err); } else { // https://github.com/angular/zone.js/issues/836 // copy the tasks array before invoke, to avoid // the callback will remove itself or other listener const copyTasks = tasks.slice(); for (let i = 0; i < copyTasks.length; i++) { if (event && event[IMMEDIATE_PROPAGATION_SYMBOL] === true) { break; } const err = invokeTask(copyTasks[i], target, event); err && errors.push(err); } } // Since there is only one error, we don't need to schedule microTask // to throw the error. if (errors.length === 1) { throw errors[0]; } else { for (let i = 0; i < errors.length; i++) { const err = errors[i]; api.nativeScheduleMicroTask(() => { throw err; }); } } } } // global shared zoneAwareCallback to handle all event callback with capture = false const globalZoneAwareCallback = function (event) { return globalCallback(this, event, false); }; // global shared zoneAwareCallback to handle all event callback with capture = true const globalZoneAwareCaptureCallback = function (event) { return globalCallback(this, event, true); }; function patchEventTargetMethods(obj, patchOptions) { if (!obj) { return false; } let useGlobalCallback = true; if (patchOptions && patchOptions.useG !== undefined) { useGlobalCallback = patchOptions.useG; } const validateHandler = patchOptions && patchOptions.vh; let checkDuplicate = true; if (patchOptions && patchOptions.chkDup !== undefined) { checkDuplicate = patchOptions.chkDup; } let returnTarget = false; if (patchOptions && patchOptions.rt !== undefined) { returnTarget = patchOptions.rt; } let proto = obj; while (proto && !proto.hasOwnProperty(ADD_EVENT_LISTENER)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && obj[ADD_EVENT_LISTENER]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = obj; } if (!proto) { return false; } if (proto[zoneSymbolAddEventListener]) { return false; } const eventNameToString = patchOptions && patchOptions.eventNameToString; // We use a shared global `taskData` to pass data for `scheduleEventTask`, // eliminating the need to create a new object solely for passing data. // WARNING: This object has a static lifetime, meaning it is not created // each time `addEventListener` is called. It is instantiated only once // and captured by reference inside the `addEventListener` and // `removeEventListener` functions. Do not add any new properties to this // object, as doing so would necessitate maintaining the information // between `addEventListener` calls. const taskData = {}; const nativeAddEventListener = (proto[zoneSymbolAddEventListener] = proto[ADD_EVENT_LISTENER]); const nativeRemoveEventListener = (proto[zoneSymbol(REMOVE_EVENT_LISTENER)] = proto[REMOVE_EVENT_LISTENER]); const nativeListeners = (proto[zoneSymbol(LISTENERS_EVENT_LISTENER)] = proto[LISTENERS_EVENT_LISTENER]); const nativeRemoveAllListeners = (proto[zoneSymbol(REMOVE_ALL_LISTENERS_EVENT_LISTENER)] = proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER]); let nativePrependEventListener; if (patchOptions && patchOptions.prepend) { nativePrependEventListener = proto[zoneSymbol(patchOptions.prepend)] = proto[patchOptions.prepend]; } /** * This util function will build an option object with passive option * to handle all possible input from the user. */ function buildEventListenerOptions(options, passive) { if (!passive) { return options; } if (typeof options === 'boolean') { return { capture: options, passive: true }; } if (!options) { return { passive: true }; } if (typeof options === 'object' && options.passive !== false) { return { ...options, passive: true }; } return options; } const customScheduleGlobal = function (task) { // if there is already a task for the eventName + capture, // just return, because we use the shared globalZoneAwareCallback here. if (taskData.isExisting) { return; } return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options); }; /** * In the context of events and listeners, this function will be * called at the end by `cancelTask`, which, in turn, calls `task.cancelFn`. * Cancelling a task is primarily used to remove event listeners from * the task target. */ const customCancelGlobal = function (task) { // if task is not marked as isRemoved, this call is directly // from Zone.prototype.cancelTask, we should remove the task // from tasksList of target first if (!task.isRemoved) { const symbolEventNames = zoneSymbolEventNames[task.eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[task.capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && task.target[symbolEventName]; if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (existingTask === task) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check task.isRemoved = true; if (task.removeAbortListener) { task.removeAbortListener(); task.removeAbortListener = null; } if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target task.allRemoved = true; task.target[symbolEventName] = null; } break; } } } } // if all tasks for the eventName + capture have gone, // we will really remove the global event callback, // if not, return if (!task.allRemoved) { return; } return nativeRemoveEventListener.call(task.target, task.eventName, task.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, task.options); }; const customScheduleNonGlobal = function (task) { return nativeAddEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customSchedulePrepend = function (task) { return nativePrependEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customCancelNonGlobal = function (task) { return nativeRemoveEventListener.call(task.target, task.eventName, task.invoke, task.options); }; const customSchedule = useGlobalCallback ? customScheduleGlobal : customScheduleNonGlobal; const customCancel = useGlobalCallback ? customCancelGlobal : customCancelNonGlobal; const compareTaskCallbackVsDelegate = function (task, delegate) { const typeOfDelegate = typeof delegate; return ((typeOfDelegate === 'function' && task.callback === delegate) || (typeOfDelegate === 'object' && task.originalDelegate === delegate)); }; const compare = patchOptions?.diff || compareTaskCallbackVsDelegate; const unpatchedEvents = Zone[zoneSymbol('UNPATCHED_EVENTS')]; const passiveEvents = _global[zoneSymbol('PASSIVE_EVENTS')]; function copyEventListenerOptions(options) { if (typeof options === 'object' && options !== null) { // We need to destructure the target `options` object since it may // be frozen or sealed (possibly provided implicitly by a third-party // library), or its properties may be readonly. const newOptions = { ...options }; // The `signal` option was recently introduced, which caused regressions in // third-party scenarios where `AbortController` was directly provided to // `addEventListener` as options. For instance, in cases like // `document.addEventListener('keydown', callback, abortControllerInstance)`, // which is valid because `AbortController` includes a `signal` getter, spreading // `{...options}` wouldn't copy the `signal`. Additionally, using `Object.create` // isn't feasible since `AbortController` is a built-in object type, and attempting // to create a new object directly with it as the prototype might result in // unexpected behavior. if (options.signal) { newOptions.signal = options.signal; } return newOptions; } return options; } const makeAddListener = function (nativeListener, addSource, customScheduleFn, customCancelFn, returnTarget = false, prepend = false) { return function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } let delegate = arguments[1]; if (!delegate) { return nativeListener.apply(this, arguments); } if (isNode && eventName === 'uncaughtException') { // don't patch uncaughtException of nodejs to prevent endless loop return nativeListener.apply(this, arguments); } // To improve `addEventListener` performance, we will create the callback // for the task later when the task is invoked. let isEventListenerObject = false; if (typeof delegate !== 'function') { // This checks whether the provided listener argument is an object with // a `handleEvent` method (since we can call `addEventListener` with a // function `event => ...` or with an object `{ handleEvent: event => ... }`). if (!delegate.handleEvent) { return nativeListener.apply(this, arguments); } isEventListenerObject = true; } if (validateHandler && !validateHandler(nativeListener, delegate, target, arguments)) { return; } const passive = !!passiveEvents && passiveEvents.indexOf(eventName) !== -1; const options = copyEventListenerOptions(buildEventListenerOptions(arguments[2], passive)); const signal = options?.signal; if (signal?.aborted) { // the signal is an aborted one, just return without attaching the event listener. return; } if (unpatchedEvents) { // check unpatched list for (let i = 0; i < unpatchedEvents.length; i++) { if (eventName === unpatchedEvents[i]) { if (passive) { return nativeListener.call(target, eventName, delegate, options); } else { return nativeListener.apply(this, arguments); } } } } const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const once = options && typeof options === 'object' ? options.once : false; const zone = Zone.current; let symbolEventNames = zoneSymbolEventNames[eventName]; if (!symbolEventNames) { prepareEventNames(eventName, eventNameToString); symbolEventNames = zoneSymbolEventNames[eventName]; } const symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; let existingTasks = target[symbolEventName]; let isExisting = false; if (existingTasks) { // already have task registered isExisting = true; if (checkDuplicate) { for (let i = 0; i < existingTasks.length; i++) { if (compare(existingTasks[i], delegate)) { // same callback, same capture, same event name, just return return; } } } } else { existingTasks = target[symbolEventName] = []; } let source; const constructorName = target.constructor['name']; const targetSource = globalSources[constructorName]; if (targetSource) { source = targetSource[eventName]; } if (!source) { source = constructorName + addSource + (eventNameToString ? eventNameToString(eventName) : eventName); } // In the code below, `options` should no longer be reassigned; instead, it // should only be mutated. This is because we pass that object to the native // `addEventListener`. // It's generally recommended to use the same object reference for options. // This ensures consistency and avoids potential issues. taskData.options = options; if (once) { // When using `addEventListener` with the `once` option, we don't pass // the `once` option directly to the native `addEventListener` method. // Instead, we keep the `once` setting and handle it ourselves. taskData.options.once = false; } taskData.target = target; taskData.capture = capture; taskData.eventName = eventName; taskData.isExisting = isExisting; const data = useGlobalCallback ? OPTIMIZED_ZONE_EVENT_TASK_DATA : undefined; // keep taskData into data to allow onScheduleEventTask to access the task information if (data) { data.taskData = taskData; } if (signal) { // When using `addEventListener` with the `signal` option, we don't pass // the `signal` option directly to the native `addEventListener` method. // Instead, we keep the `signal` setting and handle it ourselves. taskData.options.signal = undefined; } // The `scheduleEventTask` function will ultimately call `customScheduleGlobal`, // which in turn calls the native `addEventListener`. This is why `taskData.options` // is updated before scheduling the task, as `customScheduleGlobal` uses // `taskData.options` to pass it to the native `addEventListener`. const task = zone.scheduleEventTask(source, delegate, data, customScheduleFn, customCancelFn); if (signal) { // after task is scheduled, we need to store the signal back to task.options taskData.options.signal = signal; // Wrapping `task` in a weak reference would not prevent memory leaks. Weak references are // primarily used for preventing strong references cycles. `onAbort` is always reachable // as it's an event listener, so its closure retains a strong reference to the `task`. const onAbort = () => task.zone.cancelTask(task); nativeListener.call(signal, 'abort', onAbort, { once: true }); // We need to remove the `abort` listener when the event listener is going to be removed, // as it creates a closure that captures `task`. This closure retains a reference to the // `task` object even after it goes out of scope, preventing `task` from being garbage // collected. task.removeAbortListener = () => signal.removeEventListener('abort', onAbort); } // should clear taskData.target to avoid memory leak // issue, https://github.com/angular/angular/issues/20442 taskData.target = null; // need to clear up taskData because it is a global object if (data) { data.taskData = null; } // have to save those information to task in case // application may call task.zone.cancelTask() directly if (once) { taskData.options.once = true; } if (typeof task.options !== 'boolean') { // We should save the options on the task (if it's an object) because // we'll be using `task.options` later when removing the event listener // and passing it back to `removeEventListener`. task.options = options; } task.target = target; task.capture = capture; task.eventName = eventName; if (isEventListenerObject) { // save original delegate for compare to check duplicate task.originalDelegate = delegate; } if (!prepend) { existingTasks.push(task); } else { existingTasks.unshift(task); } if (returnTarget) { return target; } }; }; proto[ADD_EVENT_LISTENER] = makeAddListener(nativeAddEventListener, ADD_EVENT_LISTENER_SOURCE, customSchedule, customCancel, returnTarget); if (nativePrependEventListener) { proto[PREPEND_EVENT_LISTENER] = makeAddListener(nativePrependEventListener, PREPEND_EVENT_LISTENER_SOURCE, customSchedulePrepend, customCancel, returnTarget, true); } proto[REMOVE_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const options = arguments[2]; const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const delegate = arguments[1]; if (!delegate) { return nativeRemoveEventListener.apply(this, arguments); } if (validateHandler && !validateHandler(nativeRemoveEventListener, delegate, target, arguments)) { return; } const symbolEventNames = zoneSymbolEventNames[eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && target[symbolEventName]; // `existingTasks` may not exist if the `addEventListener` was called before // it was patched by zone.js. Please refer to the attached issue for // clarification, particularly after the `if` condition, before calling // the native `removeEventListener`. if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (compare(existingTask, delegate)) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check existingTask.isRemoved = true; if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target existingTask.allRemoved = true; target[symbolEventName] = null; // in the target, we have an event listener which is added by on_property // such as target.onclick = function() {}, so we need to clear this internal // property too if all delegates with capture=false were removed // https:// github.com/angular/angular/issues/31643 // https://github.com/angular/angular/issues/54581 if (!capture && typeof eventName === 'string') { const onPropertySymbol = ZONE_SYMBOL_PREFIX + 'ON_PROPERTY' + eventName; target[onPropertySymbol] = null; } } // In all other conditions, when `addEventListener` is called after being // patched by zone.js, we would always find an event task on the `EventTarget`. // This will trigger `cancelFn` on the `existingTask`, leading to `customCancelGlobal`, // which ultimately removes an event listener and cleans up the abort listener // (if an `AbortSignal` was provided when scheduling a task). existingTask.zone.cancelTask(existingTask); if (returnTarget) { return target; } return; } } } // https://github.com/angular/zone.js/issues/930 // We may encounter a situation where the `addEventListener` was // called on the event target before zone.js is loaded, resulting // in no task being stored on the event target due to its invocation // of the native implementation. In this scenario, we simply need to // invoke the native `removeEventListener`. return nativeRemoveEventListener.apply(this, arguments); }; proto[LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const listeners = []; const tasks = findEventTasks(target, eventNameToString ? eventNameToString(eventName) : eventName); for (let i = 0; i < tasks.length; i++) { const task = tasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; listeners.push(delegate); } return listeners; }; proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (!eventName) { const keys = Object.keys(target); for (let i = 0; i < keys.length; i++) { const prop = keys[i]; const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; // in nodejs EventEmitter, removeListener event is // used for monitoring the removeListener call, // so just keep removeListener eventListener until // all other eventListeners are removed if (evtName && evtName !== 'removeListener') { this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, evtName); } } // remove removeListener listener finally this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, 'removeListener'); } else { if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const symbolEventNames = zoneSymbolEventNames[eventName]; if (symbolEventNames) { const symbolEventName = symbolEventNames[FALSE_STR]; const symbolCaptureEventName = symbolEventNames[TRUE_STR]; const tasks = target[symbolEventName]; const captureTasks = target[symbolCaptureEventName]; if (tasks) { const removeTasks = tasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } if (captureTasks) { const removeTasks = captureTasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } } } if (returnTarget) { return this; } }; // for native toString patch attachOriginToPatched(proto[ADD_EVENT_LISTENER], nativeAddEventListener); attachOriginToPatched(proto[REMOVE_EVENT_LISTENER], nativeRemoveEventListener); if (nativeRemoveAllListeners) { attachOriginToPatched(proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER], nativeRemoveAllListeners); } if (nativeListeners) { attachOriginToPatched(proto[LISTENERS_EVENT_LISTENER], nativeListeners); } return true; } let results = []; for (let i = 0; i < apis.length; i++) { results[i] = patchEventTargetMethods(apis[i], patchOptions); } return results; } function findEventTasks(target, eventName) { if (!eventName) { const foundTasks = []; for (let prop in target) { const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; if (evtName && (!eventName || evtName === eventName)) { const tasks = target[prop]; if (tasks) { for (let i = 0; i < tasks.length; i++) { foundTasks.push(tasks[i]); } } } } return foundTasks; } let symbolEventName = zoneSymbolEventNames[eventName]; if (!symbolEventName) { prepareEventNames(eventName); symbolEventName = zoneSymbolEventNames[eventName]; } const captureFalseTasks = target[symbolEventName[FALSE_STR]]; const captureTrueTasks = target[symbolEventName[TRUE_STR]]; if (!captureFalseTasks) { return captureTrueTasks ? captureTrueTasks.slice() : []; } else { return captureTrueTasks ? captureFalseTasks.concat(captureTrueTasks) : captureFalseTasks.slice(); } } function patchEventPrototype(global, api) { const Event = global['Event']; if (Event && Event.prototype) { api.patchMethod(Event.prototype, 'stopImmediatePropagation', (delegate) => function (self, args) { self[IMMEDIATE_PROPAGATION_SYMBOL] = true; // we need to call the native stopImmediatePropagation // in case in some hybrid application, some part of // application will be controlled by zone, some are not delegate && delegate.apply(self, args); }); } } /** * @fileoverview * @suppress {missingRequire} */ function patchQueueMicrotask(global, api) { api.patchMethod(global, 'queueMicrotask', (delegate) => { return function (self, args) { Zone.current.scheduleMicroTask('queueMicrotask', args[0]); }; }); } /** * @fileoverview * @suppress {missingRequire} */ const taskSymbol = zoneSymbol('zoneTask'); function patchTimer(window, setName, cancelName, nameSuffix) { let setNative = null; let clearNative = null; setName += nameSuffix; cancelName += nameSuffix; const tasksByHandleId = {}; function scheduleTask(task) { const data = task.data; data.args[0] = function () { return task.invoke.apply(this, arguments); }; const handleOrId = setNative.apply(window, data.args); // Whlist on Node.js when get can the ID by using `[Symbol.toPrimitive]()` we do // to this so that we do not cause potentally leaks when using `setTimeout` // since this can be periodic when using `.refresh`. if (isNumber(handleOrId)) { data.handleId = handleOrId; } else { data.handle = handleOrId; // On Node.js a timeout and interval can be restarted over and over again by using the `.refresh` method. data.isRefreshable = isFunction(handleOrId.refresh); } return task; } function clearTask(task) { const { handle, handleId } = task.data; return clearNative.call(window, handle ?? handleId); } setNative = patchMethod(window, setName, (delegate) => function (self, args) { if (isFunction(args[0])) { const options = { isRefreshable: false, isPeriodic: nameSuffix === 'Interval', delay: nameSuffix === 'Timeout' || nameSuffix === 'Interval' ? args[1] || 0 : undefined, args: args, }; const callback = args[0]; args[0] = function timer() { try { return callback.apply(this, arguments); } finally { // issue-934, task will be cancelled // even it is a periodic task such as // setInterval // https://github.com/angular/angular/issues/40387 // Cleanup tasksByHandleId should be handled before scheduleTask // Since some zoneSpec may intercept and doesn't trigger // scheduleFn(scheduleTask) provided here. const { handle, handleId, isPeriodic, isRefreshable } = options; if (!isPeriodic && !isRefreshable) { if (handleId) { // in non-nodejs env, we remove timerId // from local cache delete tasksByHandleId[handleId]; } else if (handle) { // Node returns complex objects as handleIds // we remove task reference from timer object handle[taskSymbol] = null; } } } }; const task = scheduleMacroTaskWithCurrentZone(setName, args[0], options, scheduleTask, clearTask); if (!task) { return task; } // Node.js must additionally support the ref and unref functions. const { handleId, handle, isRefreshable, isPeriodic } = task.data; if (handleId) { // for non nodejs env, we save handleId: task // mapping in local cache for clearTimeout tasksByHandleId[handleId] = task; } else if (handle) { // for nodejs env, we save task // reference in timerId Object for clearTimeout handle[taskSymbol] = task; if (isRefreshable && !isPeriodic) { const originalRefresh = handle.refresh; handle.refresh = function () { const { zone, state } = task; if (state === 'notScheduled') { task._state = 'scheduled'; zone._updateTaskCount(task, 1); } else if (state === 'running') { task._state = 'scheduling'; } return originalRefresh.call(this); }; } } return handle ?? handleId ?? task; } else { // cause an error by calling it directly. return delegate.apply(window, args); } }); clearNative = patchMethod(window, cancelName, (delegate) => function (self, args) { const id = args[0]; let task; if (isNumber(id)) { // non nodejs env. task = tasksByHandleId[id]; delete tasksByHandleId[id]; } else { // nodejs env ?? other environments. task = id?.[taskSymbol]; if (task) { id[taskSymbol] = null; } else { task = id; } } if (task?.type) { if (task.cancelFn) { // Do not cancel already canceled functions task.zone.cancelTask(task); } } else { // cause an error by calling it directly. delegate.apply(window, args); } }); } function patchCustomElements(_global, api) { const { isBrowser, isMix } = api.getGlobalObjects(); if ((!isBrowser && !isMix) || !_global['customElements'] || !('customElements' in _global)) { return; } // https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks const callbacks = [ 'connectedCallback', 'disconnectedCallback', 'adoptedCallback', 'attributeChangedCallback', 'formAssociatedCallback', 'formDisabledCallback', 'formResetCallback', 'formStateRestoreCallback', ]; api.patchCallbacks(api, _global.customElements, 'customElements', 'define', callbacks); } function eventTargetPatch(_global, api) { if (Zone[api.symbol('patchEventTarget')]) { // EventTarget is already patched. return; } const { eventNames, zoneSymbolEventNames, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX } = api.getGlobalObjects(); // predefine all __zone_symbol__ + eventName + true/false string for (let i = 0; i < eventNames.length; i++) { const eventName = eventNames[i]; const falseEventName = eventName + FALSE_STR; const trueEventName = eventName + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } const EVENT_TARGET = _global['EventTarget']; if (!EVENT_TARGET || !EVENT_TARGET.prototype) { return; } api.patchEventTarget(_global, api, [EVENT_TARGET && EVENT_TARGET.prototype]); return true; } function patchEvent(global, api) { api.patchEventPrototype(global, api); } /** * @fileoverview * @suppress {globalThis} */ function filterProperties(target, onProperties, ignoreProperties) { if (!ignoreProperties || ignoreProperties.length === 0) { return onProperties; } const tip = ignoreProperties.filter((ip) => ip.target === target); if (tip.length === 0) { return onProperties; } const targetIgnoreProperties = tip[0].ignoreProperties; return onProperties.filter((op) => targetIgnoreProperties.indexOf(op) === -1); } function patchFilteredProperties(target, onProperties, ignoreProperties, prototype) { // check whether target is available, sometimes target will be undefined // because different browser or some 3rd party plugin. if (!target) { return; } const filteredProperties = filterProperties(target, onProperties, ignoreProperties); patchOnProperties(target, filteredProperties, prototype); } /** * Get all event name properties which the event name startsWith `on` * from the target object itself, inherited properties are not considered. */ function getOnEventNames(target) { return Object.getOwnPropertyNames(target) .filter((name) => name.startsWith('on') && name.length > 2) .map((name) => name.substring(2)); } function propertyDescriptorPatch(api, _global) { if (isNode && !isMix) { return; } if (Zone[api.symbol('patchEvents')]) { // events are already been patched by legacy patch. return; } const ignoreProperties = _global['__Zone_ignore_on_properties']; // for browsers that we can patch the descriptor: Chrome & Firefox let patchTargets = []; if (isBrowser) { const internalWindow = window; patchTargets = patchTargets.concat([ 'Document', 'SVGElement', 'Element', 'HTMLElement', 'HTMLBodyElement', 'HTMLMediaElement', 'HTMLFrameSetElement', 'HTMLFrameElement', 'HTMLIFrameElement', 'HTMLMarqueeElement', 'Worker', ]); const ignoreErrorProperties = []; // In older browsers like IE or Edge, event handler properties (e.g., `onclick`) // may not be defined directly on the `window` object but on its prototype (`WindowPrototype`). // To ensure complete coverage, we use the prototype when checking // for and patching these properties. patchFilteredProperties(internalWindow, getOnEventNames(internalWindow), ignoreProperties ? ignoreProperties.concat(ignoreErrorProperties) : ignoreProperties, ObjectGetPrototypeOf(internalWindow)); } patchTargets = patchTargets.concat([ 'XMLHttpRequest', 'XMLHttpRequestEventTarget', 'IDBIndex', 'IDBRequest', 'IDBOpenDBRequest', 'IDBDatabase', 'IDBTransaction', 'IDBCursor', 'WebSocket', ]); for (let i = 0; i < patchTargets.length; i++) { const target = _global[patchTargets[i]]; target?.prototype && patchFilteredProperties(target.prototype, getOnEventNames(target.prototype), ignoreProperties); } } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowser(Zone) { Zone.__load_patch('legacy', (global) => { const legacyPatch = global[Zone.__symbol__('legacyPatch')]; if (legacyPatch) { legacyPatch(); } }); Zone.__load_patch('timers', (global) => { const set = 'set'; const clear = 'clear'; patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); }); Zone.__load_patch('requestAnimationFrame', (global) => { patchTimer(global, 'request', 'cancel', 'AnimationFrame'); patchTimer(global, 'mozRequest', 'mozCancel', 'AnimationFrame'); patchTimer(global, 'webkitRequest', 'webkitCancel', 'AnimationFrame'); }); Zone.__load_patch('blocking', (global, Zone) => { const blockingMethods = ['alert', 'prompt', 'confirm']; for (let i = 0; i < blockingMethods.length; i++) { const name = blockingMethods[i]; patchMethod(global, name, (delegate, symbol, name) => { return function (s, args) { return Zone.current.run(delegate, global, args, name); }; }); } }); Zone.__load_patch('EventTarget', (global, Zone, api) => { patchEvent(global, api); eventTargetPatch(global, api); // patch XMLHttpRequestEventTarget's addEventListener/removeEventListener const XMLHttpRequestEventTarget = global['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget && XMLHttpRequestEventTarget.prototype) { api.patchEventTarget(global, api, [XMLHttpRequestEventTarget.prototype]); } }); Zone.__load_patch('MutationObserver', (global, Zone, api) => { patchClass('MutationObserver'); patchClass('WebKitMutationObserver'); }); Zone.__load_patch('IntersectionObserver', (global, Zone, api) => { patchClass('IntersectionObserver'); }); Zone.__load_patch('FileReader', (global, Zone, api) => { patchClass('FileReader'); }); Zone.__load_patch('on_property', (global, Zone, api) => { propertyDescriptorPatch(api, global); }); Zone.__load_patch('customElements', (global, Zone, api) => { patchCustomElements(global, api); }); Zone.__load_patch('XHR', (global, Zone) => { // Treat XMLHttpRequest as a macrotask. patchXHR(global); const XHR_TASK = zoneSymbol('xhrTask'); const XHR_SYNC = zoneSymbol('xhrSync'); const XHR_LISTENER = zoneSymbol('xhrListener'); const XHR_SCHEDULED = zoneSymbol('xhrScheduled'); const XHR_URL = zoneSymbol('xhrURL'); const XHR_ERROR_BEFORE_SCHEDULED = zoneSymbol('xhrErrorBeforeScheduled'); function patchXHR(window) { const XMLHttpRequest = window['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return; } const XMLHttpRequestPrototype = XMLHttpRequest.prototype; function findPendingTask(target) { return target[XHR_TASK]; } let oriAddListener = XMLHttpRequestPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; let oriRemoveListener = XMLHttpRequestPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; if (!oriAddListener) { const XMLHttpRequestEventTarget = window['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget) { const XMLHttpRequestEventTargetPrototype = XMLHttpRequestEventTarget.prototype; oriAddListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } } const READY_STATE_CHANGE = 'readystatechange'; const SCHEDULED = 'scheduled'; function scheduleTask(task) { const data = task.data; const target = data.target; target[XHR_SCHEDULED] = false; target[XHR_ERROR_BEFORE_SCHEDULED] = false; // remove existing event listener const listener = target[XHR_LISTENER]; if (!oriAddListener) { oriAddListener = target[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = target[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } if (listener) { oriRemoveListener.call(target, READY_STATE_CHANGE, listener); } const newListener = (target[XHR_LISTENER] = () => { if (target.readyState === target.DONE) { // sometimes on some browsers XMLHttpRequest will fire onreadystatechange with // readyState=4 multiple times, so we need to check task state here if (!data.aborted && target[XHR_SCHEDULED] && task.state === SCHEDULED) { // check whether the xhr has registered onload listener // if that is the case, the task should invoke after all // onload listeners finish. // Also if the request failed without response (status = 0), the load event handler // will not be triggered, in that case, we should also invoke the placeholder callback // to close the XMLHttpRequest::send macroTask. // https://github.com/angular/angular/issues/38795 const loadTasks = target[Zone.__symbol__('loadfalse')]; if (target.status !== 0 && loadTasks && loadTasks.length > 0) { const oriInvoke = task.invoke; task.invoke = function () { // need to load the tasks again, because in other // load listener, they may remove themselves const loadTasks = target[Zone.__symbol__('loadfalse')]; for (let i = 0; i < loadTasks.length; i++) { if (loadTasks[i] === task) { loadTasks.splice(i, 1); } } if (!data.aborted && task.state === SCHEDULED) { oriInvoke.call(task); } }; loadTasks.push(task); } else { task.invoke(); } } else if (!data.aborted && target[XHR_SCHEDULED] === false) { // error occurs when xhr.send() target[XHR_ERROR_BEFORE_SCHEDULED] = true; } } }); oriAddListener.call(target, READY_STATE_CHANGE, newListener); const storedTask = target[XHR_TASK]; if (!storedTask) { target[XHR_TASK] = task; } sendNative.apply(target, data.args); target[XHR_SCHEDULED] = true; return task; } function placeholderCallback() { } function clearTask(task) { const data = task.data; // Note - ideally, we would call data.target.removeEventListener here, but it's too late // to prevent it from firing. So instead, we store info for the event listener. data.aborted = true; return abortNative.apply(data.target, data.args); } const openNative = patchMethod(XMLHttpRequestPrototype, 'open', () => function (self, args) { self[XHR_SYNC] = args[2] == false; self[XHR_URL] = args[1]; return openNative.apply(self, args); }); const XMLHTTPREQUEST_SOURCE = 'XMLHttpRequest.send'; const fetchTaskAborting = zoneSymbol('fetchTaskAborting'); const fetchTaskScheduling = zoneSymbol('fetchTaskScheduling'); const sendNative = patchMethod(XMLHttpRequestPrototype, 'send', () => function (self, args) { if (Zone.current[fetchTaskScheduling] === true) { // a fetch is scheduling, so we are using xhr to polyfill fetch // and because we already schedule macroTask for fetch, we should // not schedule a macroTask for xhr again return sendNative.apply(self, args); } if (self[XHR_SYNC]) { // if the XHR is sync there is no task to schedule, just execute the code. return sendNative.apply(self, args); } else { const options = { target: self, url: self[XHR_URL], isPeriodic: false, args: args, aborted: false, }; const task = scheduleMacroTaskWithCurrentZone(XMLHTTPREQUEST_SOURCE, placeholderCallback, options, scheduleTask, clearTask); if (self && self[XHR_ERROR_BEFORE_SCHEDULED] === true && !options.aborted && task.state === SCHEDULED) { // xhr request throw error when send // we should invoke task instead of leaving a scheduled // pending macroTask task.invoke(); } } }); const abortNative = patchMethod(XMLHttpRequestPrototype, 'abort', () => function (self, args) { const task = findPendingTask(self); if (task && typeof task.type == 'string') { // If the XHR has already completed, do nothing. // If the XHR has already been aborted, do nothing. // Fix #569, call abort multiple times before done will cause // macroTask task count be negative number if (task.cancelFn == null || (task.data && task.data.aborted)) { return; } task.zone.cancelTask(task); } else if (Zone.current[fetchTaskAborting] === true) { // the abort is called from fetch polyfill, we need to call native abort of XHR. return abortNative.apply(self, args); } // Otherwise, we are trying to abort an XHR which has not yet been sent, so there is no // task // to cancel. Do nothing. }); } }); Zone.__load_patch('geolocation', (global) => { /// GEO_LOCATION if (global['navigator'] && global['navigator'].geolocation) { patchPrototype(global['navigator'].geolocation, ['getCurrentPosition', 'watchPosition']); } }); Zone.__load_patch('PromiseRejectionEvent', (global, Zone) => { // handle unhandled promise rejection function findPromiseRejectionHandler(evtName) { return function (e) { const eventTasks = findEventTasks(global, evtName); eventTasks.forEach((eventTask) => { // windows has added unhandledrejection event listener // trigger the event listener const PromiseRejectionEvent = global['PromiseRejectionEvent']; if (PromiseRejectionEvent) { const evt = new PromiseRejectionEvent(evtName, { promise: e.promise, reason: e.rejection, }); eventTask.invoke(evt); } }); }; } if (global['PromiseRejectionEvent']) { Zone[zoneSymbol('unhandledPromiseRejectionHandler')] = findPromiseRejectionHandler('unhandledrejection'); Zone[zoneSymbol('rejectionHandledHandler')] = findPromiseRejectionHandler('rejectionhandled'); } }); Zone.__load_patch('queueMicrotask', (global, Zone, api) => { patchQueueMicrotask(global, api); }); } function patchPromise(Zone) { Zone.__load_patch('ZoneAwarePromise', (global, Zone, api) => { const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; const ObjectDefineProperty = Object.defineProperty; function readableObjectToString(obj) { if (obj && obj.toString === Object.prototype.toString) { const className = obj.constructor && obj.constructor.name; return (className ? className : '') + ': ' + JSON.stringify(obj); } return obj ? obj.toString() : Object.prototype.toString.call(obj); } const __symbol__ = api.symbol; const _uncaughtPromiseErrors = []; const isDisableWrappingUncaughtPromiseRejection = global[__symbol__('DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION')] !== false; const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); const creationTrace = '__creationTrace__'; api.onUnhandledError = (e) => { if (api.showUncaughtError()) { const rejection = e && e.rejection; if (rejection) { console.error('Unhandled Promise rejection:', rejection instanceof Error ? rejection.message : rejection, '; Zone:', e.zone.name, '; Task:', e.task && e.task.source, '; Value:', rejection, rejection instanceof Error ? rejection.stack : undefined); } else { console.error(e); } } }; api.microtaskDrainDone = () => { while (_uncaughtPromiseErrors.length) { const uncaughtPromiseError = _uncaughtPromiseErrors.shift(); try { uncaughtPromiseError.zone.runGuarded(() => { if (uncaughtPromiseError.throwOriginal) { throw uncaughtPromiseError.rejection; } throw uncaughtPromiseError; }); } catch (error) { handleUnhandledRejection(error); } } }; const UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL = __symbol__('unhandledPromiseRejectionHandler'); function handleUnhandledRejection(e) { api.onUnhandledError(e); try { const handler = Zone[UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL]; if (typeof handler === 'function') { handler.call(this, e); } } catch (err) { } } function isThenable(value) { return value && typeof value.then === 'function'; } function forwardResolution(value) { return value; } function forwardRejection(rejection) { return ZoneAwarePromise.reject(rejection); } const symbolState = __symbol__('state'); const symbolValue = __symbol__('value'); const symbolFinally = __symbol__('finally'); const symbolParentPromiseValue = __symbol__('parentPromiseValue'); const symbolParentPromiseState = __symbol__('parentPromiseState'); const source = 'Promise.then'; const UNRESOLVED = null; const RESOLVED = true; const REJECTED = false; const REJECTED_NO_CATCH = 0; function makeResolver(promise, state) { return (v) => { try { resolvePromise(promise, state, v); } catch (err) { resolvePromise(promise, false, err); } // Do not return value or you will break the Promise spec. }; } const once = function () { let wasCalled = false; return function wrapper(wrappedFunction) { return function () { if (wasCalled) { return; } wasCalled = true; wrappedFunction.apply(null, arguments); }; }; }; const TYPE_ERROR = 'Promise resolved with itself'; const CURRENT_TASK_TRACE_SYMBOL = __symbol__('currentTaskTrace'); // Promise Resolution function resolvePromise(promise, state, value) { const onceWrapper = once(); if (promise === value) { throw new TypeError(TYPE_ERROR); } if (promise[symbolState] === UNRESOLVED) { // should only get value.then once based on promise spec. let then = null; try { if (typeof value === 'object' || typeof value === 'function') { then = value && value.then; } } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); return promise; } // if (value instanceof ZoneAwarePromise) { if (state !== REJECTED && value instanceof ZoneAwarePromise && value.hasOwnProperty(symbolState) && value.hasOwnProperty(symbolValue) && value[symbolState] !== UNRESOLVED) { clearRejectedNoCatch(value); resolvePromise(promise, value[symbolState], value[symbolValue]); } else if (state !== REJECTED && typeof then === 'function') { try { then.call(value, onceWrapper(makeResolver(promise, state)), onceWrapper(makeResolver(promise, false))); } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); } } else { promise[symbolState] = state; const queue = promise[symbolValue]; promise[symbolValue] = value; if (promise[symbolFinally] === symbolFinally) { // the promise is generated by Promise.prototype.finally if (state === RESOLVED) { // the state is resolved, should ignore the value // and use parent promise value promise[symbolState] = promise[symbolParentPromiseState]; promise[symbolValue] = promise[symbolParentPromiseValue]; } } // record task information in value when error occurs, so we can // do some additional work such as render longStackTrace if (state === REJECTED && value instanceof Error) { // check if longStackTraceZone is here const trace = Zone.currentTask && Zone.currentTask.data && Zone.currentTask.data[creationTrace]; if (trace) { // only keep the long stack trace into error when in longStackTraceZone ObjectDefineProperty(value, CURRENT_TASK_TRACE_SYMBOL, { configurable: true, enumerable: false, writable: true, value: trace, }); } } for (let i = 0; i < queue.length;) { scheduleResolveOrReject(promise, queue[i++], queue[i++], queue[i++], queue[i++]); } if (queue.length == 0 && state == REJECTED) { promise[symbolState] = REJECTED_NO_CATCH; let uncaughtPromiseError = value; try { // Here we throws a new Error to print more readable error log // and if the value is not an error, zone.js builds an `Error` // Object here to attach the stack information. throw new Error('Uncaught (in promise): ' + readableObjectToString(value) + (value && value.stack ? '\n' + value.stack : '')); } catch (err) { uncaughtPromiseError = err; } if (isDisableWrappingUncaughtPromiseRejection) { // If disable wrapping uncaught promise reject // use the value instead of wrapping it. uncaughtPromiseError.throwOriginal = true; } uncaughtPromiseError.rejection = value; uncaughtPromiseError.promise = promise; uncaughtPromiseError.zone = Zone.current; uncaughtPromiseError.task = Zone.currentTask; _uncaughtPromiseErrors.push(uncaughtPromiseError); api.scheduleMicroTask(); // to make sure that it is running } } } // Resolving an already resolved promise is a noop. return promise; } const REJECTION_HANDLED_HANDLER = __symbol__('rejectionHandledHandler'); function clearRejectedNoCatch(promise) { if (promise[symbolState] === REJECTED_NO_CATCH) { // if the promise is rejected no catch status // and queue.length > 0, means there is a error handler // here to handle the rejected promise, we should trigger // windows.rejectionhandled eventHandler or nodejs rejectionHandled // eventHandler try { const handler = Zone[REJECTION_HANDLED_HANDLER]; if (handler && typeof handler === 'function') { handler.call(this, { rejection: promise[symbolValue], promise: promise }); } } catch (err) { } promise[symbolState] = REJECTED; for (let i = 0; i < _uncaughtPromiseErrors.length; i++) { if (promise === _uncaughtPromiseErrors[i].promise) { _uncaughtPromiseErrors.splice(i, 1); } } } } function scheduleResolveOrReject(promise, zone, chainPromise, onFulfilled, onRejected) { clearRejectedNoCatch(promise); const promiseState = promise[symbolState]; const delegate = promiseState ? typeof onFulfilled === 'function' ? onFulfilled : forwardResolution : typeof onRejected === 'function' ? onRejected : forwardRejection; zone.scheduleMicroTask(source, () => { try { const parentPromiseValue = promise[symbolValue]; const isFinallyPromise = !!chainPromise && symbolFinally === chainPromise[symbolFinally]; if (isFinallyPromise) { // if the promise is generated from finally call, keep parent promise's state and value chainPromise[symbolParentPromiseValue] = parentPromiseValue; chainPromise[symbolParentPromiseState] = promiseState; } // should not pass value to finally callback const value = zone.run(delegate, undefined, isFinallyPromise && delegate !== forwardRejection && delegate !== forwardResolution ? [] : [parentPromiseValue]); resolvePromise(chainPromise, true, value); } catch (error) { // if error occurs, should always return this error resolvePromise(chainPromise, false, error); } }, chainPromise); } const ZONE_AWARE_PROMISE_TO_STRING = 'function ZoneAwarePromise() { [native code] }'; const noop = function () { }; const AggregateError = global.AggregateError; class ZoneAwarePromise { static toString() { return ZONE_AWARE_PROMISE_TO_STRING; } static resolve(value) { if (value instanceof ZoneAwarePromise) { return value; } return resolvePromise(new this(null), RESOLVED, value); } static reject(error) { return resolvePromise(new this(null), REJECTED, error); } static withResolvers() { const result = {}; result.promise = new ZoneAwarePromise((res, rej) => { result.resolve = res; result.reject = rej; }); return result; } static any(values) { if (!values || typeof values[Symbol.iterator] !== 'function') { return Promise.reject(new AggregateError([], 'All promises were rejected')); } const promises = []; let count = 0; try { for (let v of values) { count++; promises.push(ZoneAwarePromise.resolve(v)); } } catch (err) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } if (count === 0) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } let finished = false; const errors = []; return new ZoneAwarePromise((resolve, reject) => { for (let i = 0; i < promises.length; i++) { promises[i].then((v) => { if (finished) { return; } finished = true; resolve(v); }, (err) => { errors.push(err); count--; if (count === 0) { finished = true; reject(new AggregateError(errors, 'All promises were rejected')); } }); } }); } static race(values) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); function onResolve(value) { resolve(value); } function onReject(error) { reject(error); } for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } value.then(onResolve, onReject); } return promise; } static all(values) { return ZoneAwarePromise.allWithCallback(values); } static allSettled(values) { const P = this && this.prototype instanceof ZoneAwarePromise ? this : ZoneAwarePromise; return P.allWithCallback(values, { thenCallback: (value) => ({ status: 'fulfilled', value }), errorCallback: (err) => ({ status: 'rejected', reason: err }), }); } static allWithCallback(values, callback) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); // Start at 2 to prevent prematurely resolving if .then is called immediately. let unresolvedCount = 2; let valueIndex = 0; const resolvedValues = []; for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } const curValueIndex = valueIndex; try { value.then((value) => { resolvedValues[curValueIndex] = callback ? callback.thenCallback(value) : value; unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } }, (err) => { if (!callback) { reject(err); } else { resolvedValues[curValueIndex] = callback.errorCallback(err); unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } } }); } catch (thenErr) { reject(thenErr); } unresolvedCount++; valueIndex++; } // Make the unresolvedCount zero-based again. unresolvedCount -= 2; if (unresolvedCount === 0) { resolve(resolvedValues); } return promise; } constructor(executor) { const promise = this; if (!(promise instanceof ZoneAwarePromise)) { throw new Error('Must be an instanceof Promise.'); } promise[symbolState] = UNRESOLVED; promise[symbolValue] = []; // queue; try { const onceWrapper = once(); executor && executor(onceWrapper(makeResolver(promise, RESOLVED)), onceWrapper(makeResolver(promise, REJECTED))); } catch (error) { resolvePromise(promise, false, error); } } get [Symbol.toStringTag]() { return 'Promise'; } get [Symbol.species]() { return ZoneAwarePromise; } then(onFulfilled, onRejected) { // We must read `Symbol.species` safely because `this` may be anything. For instance, `this` // may be an object without a prototype (created through `Object.create(null)`); thus // `this.constructor` will be undefined. One of the use cases is SystemJS creating // prototype-less objects (modules) via `Object.create(null)`. The SystemJS creates an empty // object and copies promise properties into that object (within the `getOrCreateLoad` // function). The zone.js then checks if the resolved value has the `then` method and // invokes it with the `value` context. Otherwise, this will throw an error: `TypeError: // Cannot read properties of undefined (reading 'Symbol(Symbol.species)')`. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = this.constructor || ZoneAwarePromise; } const chainPromise = new C(noop); const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFulfilled, onRejected); } else { scheduleResolveOrReject(this, zone, chainPromise, onFulfilled, onRejected); } return chainPromise; } catch(onRejected) { return this.then(null, onRejected); } finally(onFinally) { // See comment on the call to `then` about why thee `Symbol.species` is safely accessed. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = ZoneAwarePromise; } const chainPromise = new C(noop); chainPromise[symbolFinally] = symbolFinally; const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFinally, onFinally); } else { scheduleResolveOrReject(this, zone, chainPromise, onFinally, onFinally); } return chainPromise; } } // Protect against aggressive optimizers dropping seemingly unused properties. // E.g. Closure Compiler in advanced mode. ZoneAwarePromise['resolve'] = ZoneAwarePromise.resolve; ZoneAwarePromise['reject'] = ZoneAwarePromise.reject; ZoneAwarePromise['race'] = ZoneAwarePromise.race; ZoneAwarePromise['all'] = ZoneAwarePromise.all; const NativePromise = (global[symbolPromise] = global['Promise']); global['Promise'] = ZoneAwarePromise; const symbolThenPatched = __symbol__('thenPatched'); function patchThen(Ctor) { const proto = Ctor.prototype; const prop = ObjectGetOwnPropertyDescriptor(proto, 'then'); if (prop && (prop.writable === false || !prop.configurable)) { // check Ctor.prototype.then propertyDescriptor is writable or not // in meteor env, writable is false, we should ignore such case return; } const originalThen = proto.then; // Keep a reference to the original method. proto[symbolThen] = originalThen; Ctor.prototype.then = function (onResolve, onReject) { const wrapped = new ZoneAwarePromise((resolve, reject) => { originalThen.call(this, resolve, reject); }); return wrapped.then(onResolve, onReject); }; Ctor[symbolThenPatched] = true; } api.patchThen = patchThen; function zoneify(fn) { return function (self, args) { let resultPromise = fn.apply(self, args); if (resultPromise instanceof ZoneAwarePromise) { return resultPromise; } let ctor = resultPromise.constructor; if (!ctor[symbolThenPatched]) { patchThen(ctor); } return resultPromise; }; } if (NativePromise) { patchThen(NativePromise); patchMethod(global, 'fetch', (delegate) => zoneify(delegate)); } // This is not part of public API, but it is useful for tests, so we expose it. Promise[Zone.__symbol__('uncaughtPromiseErrors')] = _uncaughtPromiseErrors; return ZoneAwarePromise; }); } function patchToString(Zone) { // override Function.prototype.toString to make zone.js patched function // look like native function Zone.__load_patch('toString', (global) => { // patch Func.prototype.toString to let them look like native const originalFunctionToString = Function.prototype.toString; const ORIGINAL_DELEGATE_SYMBOL = zoneSymbol('OriginalDelegate'); const PROMISE_SYMBOL = zoneSymbol('Promise'); const ERROR_SYMBOL = zoneSymbol('Error'); const newFunctionToString = function toString() { if (typeof this === 'function') { const originalDelegate = this[ORIGINAL_DELEGATE_SYMBOL]; if (originalDelegate) { if (typeof originalDelegate === 'function') { return originalFunctionToString.call(originalDelegate); } else { return Object.prototype.toString.call(originalDelegate); } } if (this === Promise) { const nativePromise = global[PROMISE_SYMBOL]; if (nativePromise) { return originalFunctionToString.call(nativePromise); } } if (this === Error) { const nativeError = global[ERROR_SYMBOL]; if (nativeError) { return originalFunctionToString.call(nativeError); } } } return originalFunctionToString.call(this); }; newFunctionToString[ORIGINAL_DELEGATE_SYMBOL] = originalFunctionToString; Function.prototype.toString = newFunctionToString; // patch Object.prototype.toString to let them look like native const originalObjectToString = Object.prototype.toString; const PROMISE_OBJECT_TO_STRING = '[object Promise]'; Object.prototype.toString = function () { if (typeof Promise === 'function' && this instanceof Promise) { return PROMISE_OBJECT_TO_STRING; } return originalObjectToString.call(this); }; }); } function patchCallbacks(api, target, targetName, method, callbacks) 3A̾{ const symbol = Zone.__symbol__(method); if (target[symbol]) { return; } const nativeDelegate = (target[symbol] = target[method]); target[method] = function (name, opts, options) { if (opts && opts.prototype) { callbacks.forEach(function (callback) { const source = `${targetName}.${method}::` + callback; const prototype = opts.prototype; // Note: the `patchCallbacks` is used for patching the `document.registerElement` and // `customElements.define`. We explicitly wrap the patching code into try-catch since // callbacks may be already patched by other web components frameworks (e.g. LWC), and they // make those properties non-writable. This means that patching callback will throw an error // `cannot assign to read-only property`. See this code as an example: // https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/framework/base-bridge-element.ts#L180-L186 // We don't want to stop the application rendering if we couldn't patch some // callback, e.g. `attributeChangedCallback`. try { if (prototype.hasOwnProperty(callback)) { const descriptor = api.ObjectGetOwnPropertyDescriptor(prototype, callback); if (descriptor && descriptor.value) { descriptor.value = api.wrapWithCurrentZone(descriptor.value, source); api._redefineProperty(opts.prototype, callback, descriptor); } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } catch { // Note: we leave the catch block empty since there's no way to handle the error related // to non-writable property. } }); } return nativeDelegate.call(target, name, opts, options); }; api.attachOriginToPatched(target[method], nativeDelegate); } function patchUtil(Zone) { Zone.__load_patch('util', (global, Zone, api) => { // Collect native event names by looking at properties // on the global namespace, e.g. 'onclick'. const eventNames = getOnEventNames(global); api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; // In earlier version of zone.js (<0.9.0), we use env name `__zone_symbol__BLACK_LISTED_EVENTS` // to define which events will not be patched by `Zone.js`. In newer version (>=0.9.0), we // change the env name to `__zone_symbol__UNPATCHED_EVENTS` to keep the name consistent with // angular repo. The `__zone_symbol__BLACK_LISTED_EVENTS` is deprecated, but it is still be // supported for backwards compatibility. const SYMBOL_BLACK_LISTED_EVENTS = Zone.__symbol__('BLACK_LISTED_EVENTS'); const SYMBOL_UNPATCHED_EVENTS = Zone.__symbol__('UNPATCHED_EVENTS'); if (global[SYMBOL_UNPATCHED_EVENTS]) { global[SYMBOL_BLACK_LISTED_EVENTS] = global[SYMBOL_UNPATCHED_EVENTS]; } if (global[SYMBOL_BLACK_LISTED_EVENTS]) { Zone[SYMBOL_BLACK_LISTED_EVENTS] = Zone[SYMBOL_UNPATCHED_EVENTS] = global[SYMBOL_BLACK_LISTED_EVENTS]; } api.patchEventPrototype = patchEventPrototype; api.patchEventTarget = patchEventTarget; api.isIEOrEdge = isIEOrEdge; api.ObjectDefineProperty = ObjectDefineProperty; api.ObjectGetOwnPropertyDescriptor = ObjectGetOwnPropertyDescriptor; api.ObjectCreate = ObjectCreate; api.ArraySlice = ArraySlice; api.patchClass = patchClass; api.wrapWithCurrentZone = wrapWithCurrentZone; api.filterProperties = filterProperties; api.attachOriginToPatched = attachOriginToPatched; api._redefineProperty = Object.defineProperty; api.patchCallbacks = patchCallbacks; api.getGlobalObjects = () => ({ globalSources, zoneSymbolEventNames, eventNames, isBrowser, isMix, isNode, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX, ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR, }); }); } function patchCommon(Zone) { patchPromise(Zone); patchToString(Zone); patchUtil(Zone); } function patchEvents(Zone) { Zone.__load_patch('EventEmitter', (global, Zone, api) => { // For EventEmitter const EE_ADD_LISTENER = 'addListener'; const EE_PREPEND_LISTENER = 'prependListener'; const EE_REMOVE_LISTENER = 'removeListener'; const EE_REMOVE_ALL_LISTENER = 'removeAllListeners'; const EE_LISTENERS = 'listeners'; const EE_ON = 'on'; const EE_OFF = 'off'; const compareTaskCallbackVsDelegate = function (task, delegate) { // same callback, same capture, same event name, just return return task.callback === delegate || task.callback.listener === delegate; }; const eventNameToString = function (eventName) { if (typeof eventName === 'string') { return eventName; } if (!eventName) { return ''; } return eventName.toString().replace('(', '_').replace(')', '_'); }; function patchEventEmitterMethods(obj) { const result = patchEventTarget(global, api, [obj], { useG: false, add: EE_ADD_LISTENER, rm: EE_REMOVE_LISTENER, prepend: EE_PREPEND_LISTENER, rmAll: EE_REMOVE_ALL_LISTENER, listeners: EE_LISTENERS, chkDup: false, rt: true, diff: compareTaskCallbackVsDelegate, eventNameToString: eventNameToString, }); if (result && result[0]) { obj[EE_ON] = obj[EE_ADD_LISTENER]; obj[EE_OFF] = obj[EE_REMOVE_LISTENER]; } } // EventEmitter let events; try { events = require('events'); } catch (err) { } if (events && events.EventEmitter) { patchEventEmitterMethods(events.EventEmitter.prototype); } }); } function patchFs(Zone) { Zone.__load_patch('fs', (global, Zone, api) => { let fs; try { fs = require('fs'); } catch (err) { } if (!fs) return; // watch, watchFile, unwatchFile has been patched // because EventEmitter has been patched const TO_PATCH_MACROTASK_METHODS = [ 'access', 'appendFile', 'chmod', 'chown', 'close', 'exists', 'fchmod', 'fchown', 'fdatasync', 'fstat', 'fsync', 'ftruncate', 'futimes', 'lchmod', 'lchown', 'lutimes', 'link', 'lstat', 'mkdir', 'mkdtemp', 'open', 'opendir', 'read', 'readdir', 'readFile', 'readlink', 'realpath', 'rename', 'rmdir', 'stat', 'symlink', 'truncate', 'unlink', 'utimes', 'write', 'writeFile', 'writev', ]; TO_PATCH_MACROTASK_METHODS.filter((name) => !!fs[name] && typeof fs[name] === 'function').forEach((name) => { patchMacroTask(fs, name, (self, args) => { return { name: 'fs.' + name, args: args, cbIdx: args.length > 0 ? args.length - 1 : -1, target: self, }; }); }); const realpathOriginalDelegate = fs.realpath?.[api.symbol('OriginalDelegate')]; // This is the only specific method that should be additionally patched because the previous // `patchMacroTask` has overridden the `realpath` function and its `native` property. if (realpathOriginalDelegate?.native) { fs.realpath.native = realpathOriginalDelegate.native; patchMacroTask(fs.realpath, 'native', (self, args) => ({ args, target: self, cbIdx: args.length > 0 ? args.length - 1 : -1, name: 'fs.realpath.native', })); } }); } function patchNodeUtil(Zone) { Zone.__load_patch('node_util', (global, Zone, api) => { api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; setShouldCopySymbolProperties(true); }); } const set = 'set'; const clear = 'clear'; function patchNode(Zone) { patchNodeUtil(Zone); patchEvents(Zone); patchFs(Zone); Zone.__load_patch('node_timers', (global, Zone) => { // Timers let globalUseTimeoutFromTimer = false; try { const timers = require('timers'); let globalEqualTimersTimeout = global.setTimeout === timers.setTimeout; if (!globalEqualTimersTimeout && !isMix) { // 1. if isMix, then we are in mix environment such as Electron // we should only patch timers.setTimeout because global.setTimeout // have been patched // 2. if global.setTimeout not equal timers.setTimeout, check // whether global.setTimeout use timers.setTimeout or not const originSetTimeout = timers.setTimeout; timers.setTimeout = function () { globalUseTimeoutFromTimer = true; return originSetTimeout.apply(this, arguments); }; const detectTimeout = global.setTimeout(() => { }, 100); clearTimeout(detectTimeout); timers.setTimeout = originSetTimeout; } patchTimer(timers, set, clear, 'Timeout'); patchTimer(timers, set, clear, 'Interval'); patchTimer(timers, set, clear, 'Immediate'); } catch (error) { // timers module not exists, for example, when we using nativeScript // timers is not available } if (isMix) { // if we are in mix environment, such as Electron, // the global.setTimeout has already been patched, // so we just patch timers.setTimeout return; } if (!globalUseTimeoutFromTimer) { // 1. global setTimeout equals timers setTimeout // 2. or global don't use timers setTimeout(maybe some other library patch setTimeout) // 3. or load timers module error happens, we should patch global setTimeout patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); } else { // global use timers setTimeout, but not equals // this happens when use nodejs v0.10.x, global setTimeout will // use a lazy load version of timers setTimeout // we should not double patch timer's setTimeout // so we only store the __symbol__ for consistency global[Zone.__symbol__('setTimeout')] = global.setTimeout; global[Zone.__symbol__('setInterval')] = global.setInterval; global[Zone.__symbol__('setImmediate')] = global.setImmediate; } }); // patch process related methods Zone.__load_patch('nextTick', () => { // patch nextTick as microTask patchMicroTask(process, 'nextTick', (self, args) => { return { name: 'process.nextTick', args: args, cbIdx: args.length > 0 && typeof args[0] === 'function' ? 0 : -1, target: process, }; }); }); Zone.__load_patch('handleUnhandledPromiseRejection', (global, Zone, api) => { Zone[api.symbol('unhandledPromiseRejectionHandler')] = findProcessPromiseRejectionHandler('unhandledRejection'); Zone[api.symbol('rejectionHandledHandler')] = findProcessPromiseRejectionHandler('rejectionHandled'); // handle unhandled promise rejection function findProcessPromiseRejectionHandler(evtName) { return function (e) { const eventTasks = findEventTasks(process, evtName); eventTasks.forEach((eventTask) => { // process has added unhandledrejection event listener // trigger the event listener if (evtName === 'unhandledRejection') { eventTask.invoke(e.rejection, e.promise); } else if (evtName === 'rejectionHandled') { eventTask.invoke(e.promise); } }); }; } }); // Crypto Zone.__load_patch('crypto', () => { let crypto; try { crypto = require('crypto'); } catch (err) { } // use the generic patchMacroTask to patch crypto if (crypto) { const methodNames = ['randomBytes', 'pbkdf2']; methodNames.forEach((name) => { patchMacroTask(crypto, name, (self, args) => { return { name: 'crypto.' + name, args: args, cbIdx: args.length > 0 && typeof args[args.length - 1] === 'function' ? args.length - 1 : -1, target: crypto, }; }); }); } }); Zone.__load_patch('console', (global, Zone) => { const consoleMethods = [ 'dir', 'log', 'info', 'error', 'warn', 'assert', 'debug', 'timeEnd', 'trace', ]; consoleMethods.forEach((m) => { const originalMethod = (console[Zone.__symbol__(m)] = console[m]); if (originalMethod) { console[m] = function () { const args = ArraySlice.call(arguments); if (Zone.current === Zone.root) { return originalMethod.apply(this, args); } else { return Zone.root.run(originalMethod, this, args); } }; } }); }); Zone.__load_patch('queueMicrotask', (global, Zone, api) => { patchQueueMicrotask(global, api); }); } function loadZone() { // if global['Zone'] already exists (maybe zone.js was already loaded or // some other lib also registered a global object named Zone), we may need // to throw an error, but sometimes user may not want this error. // For example, // we have two web pages, page1 includes zone.js, page2 doesn't. // and the 1st time user load page1 and page2, everything work fine, // but when user load page2 again, error occurs because global['Zone'] already exists. // so we add a flag to let user choose whether to throw this error or not. // By default, if existing Zone is from zone.js, we will not throw the error. const global = globalThis; const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (global['Zone'] && (checkDuplicate || typeof global['Zone'].__symbol__ !== 'function')) { throw new Error('Zone already loaded.'); } // Initialize global `Zone` constant. global['Zone'] ??= initZone(); return global['Zone']; } const Zone$1 = loadZone(); patchCommon(Zone$1); patchBrowser(Zone$1); patchNode(Zone$1); V{9xeV"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const global=globalThis;function __symbol__(e){return(global.__Zone_symbol_prefix||"__zone_symbol__")+e}function initZone(){const e=global.performance;function t(t){e&&e.mark&&e.mark(t)}function n(t,n){e&&e.measure&&e.measure(t,n)}t("Zone");class o{static __symbol__=__symbol__;static assertZonePatched(){if(global.Promise!==w.ZoneAwarePromise)throw new Error("Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.\nMost likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.)")}static get root(){let e=o.current;for(;e.parent;)e=e.parent;return e}static get current(){return Z.zone}static get currentTask(){return D}static __load_patch(e,r,s=!1){if(w.hasOwnProperty(e)){const t=!0===global[__symbol__("forceDuplicateZoneCheck")];if(!s&&t)throw Error("Already loaded patch: "+e)}else if(!global["__Zone_disable_"+e]){const s="Zone:"+e;t(s),w[e]=r(global,o,P),n(s,s)}}get parent(){return this._parent}get name(){return this._name}_parent;_name;_properties;_zoneDelegate;constructor(e,t){this._parent=e,this._name=t?t.name||"unnamed":"",this._properties=t&&t.properties||{},this._zoneDelegate=new s(this,this._parent&&this._parent._zoneDelegate,t)}get(e){const t=this.getZoneWith(e);if(t)return t._properties[e]}getZoneWith(e){let t=this;for(;t;){if(t._properties.hasOwnProperty(e))return t;t=t._parent}return null}fork(e){if(!e)throw new Error("ZoneSpec required!");return this._zoneDelegate.fork(this,e)}wrap(e,t){if("function"!=typeof e)throw new Error("Expecting function got: "+e);const n=this._zoneDelegate.intercept(this,e,t),o=this;return function(){return o.runGuarded(n,this,arguments,t)}}run(e,t,n,o){Z={parent:Z,zone:this};try{return this._zoneDelegate.invoke(this,e,t,n,o)}finally{Z=Z.parent}}runGuarded(e,t=null,n,o){Z={parent:Z,zone:this};try{try{return this._zoneDelegate.invoke(this,e,t,n,o)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{Z=Z.parent}}runTask(e,t,n){if(e.zone!=this)throw new Error("A task can only be run in the zone of creation! (Creation: "+(e.zone||m).name+"; Execution: "+this.name+")");const o=e,{type:r,data:{isPeriodic:s=!1,isRefreshable:a=!1}={}}=e;if(e.state===g&&(r===O||r===S))return;const i=e.state!=b;i&&o._transitionTo(b,k);const c=D;D=o,Z={parent:Z,zone:this};try{r!=S||!e.data||s||a||(e.cancelFn=void 0);try{return this._zoneDelegate.invokeTask(this,o,t,n)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{const t=e.state;if(t!==g&&t!==T)if(r==O||s||a&&t===y)i&&o._transitionTo(k,b,y);else{const e=o._zoneDelegates;this._updateTaskCount(o,-1),i&&o._transitionTo(g,b,g),a&&(o._zoneDelegates=e)}Z=Z.parent,D=c}}scheduleTask(e){if(e.zone&&e.zone!==this){let t=this;for(;t;){if(t===e.zone)throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${e.zone.name}`);t=t.parent}}e._transitionTo(y,g);const t=[];e._zoneDelegates=t,e._zone=this;try{e=this._zoneDelegate.scheduleTask(this,e)}catch(t){throw e._transitionTo(T,y,g),this._zoneDelegate.handleError(this,t),t}return e._zoneDelegates===t&&this._updateTaskCount(e,1),e.state==y&&e._transitionTo(k,y),e}scheduleMicroTask(e,t,n,o){return this.scheduleTask(new a(v,e,t,n,o,void 0))}scheduleMacroTask(e,t,n,o,r){return this.scheduleTask(new a(S,e,t,n,o,r))}scheduleEventTask(e,t,n,o,r){return this.scheduleTask(new a(O,e,t,n,o,r))}cancelTask(e){if(e.zone!=this)throw new Error("A task can only be cancelled in the zone of creation! (Creation: "+(e.zone||m).name+"; Execution: "+this.name+")");if(e.state===k||e.state===b){e._transitionTo(E,k,b);try{this._zoneDelegate.cancelTask(this,e)}catch(t){throw e._transitionTo(T,E),this._zoneDelegate.handleError(this,t),t}return this._updateTaskCount(e,-1),e._transitionTo(g,E),e.runCount=-1,e}}_updateTaskCount(e,t){const n=e._zoneDelegates;-1==t&&(e._zoneDelegates=null);for(let o=0;oe.hasTask(n,o),onScheduleTask:(e,t,n,o)=>e.scheduleTask(n,o),onInvokeTask:(e,t,n,o,r,s)=>e.invokeTask(n,o,r,s),onCancelTask:(e,t,n,o)=>e.cancelTask(n,o)};class s{get zone(){return this._zone}_zone;_taskCounts={microTask:0,macroTask:0,eventTask:0};_parentDelegate;_forkDlgt;_forkZS;_forkCurrZone;_interceptDlgt;_interceptZS;_interceptCurrZone;_invokeDlgt;_invokeZS;_invokeCurrZone;_handleErrorDlgt;_handleErrorZS;_handleErrorCurrZone;_scheduleTaskDlgt;_scheduleTaskZS;_scheduleTaskCurrZone;_invokeTaskDlgt;_invokeTaskZS;_invokeTaskCurrZone;_cancelTaskDlgt;_cancelTaskZS;_cancelTaskCurrZone;_hasTaskDlgt;_hasTaskDlgtOwner;_hasTaskZS;_hasTaskCurrZone;constructor(e,t,n){this._zone=e,this._parentDelegate=t,this._forkZS=n&&(n&&n.onFork?n:t._forkZS),this._forkDlgt=n&&(n.onFork?t:t._forkDlgt),this._forkCurrZone=n&&(n.onFork?this._zone:t._forkCurrZone),this._interceptZS=n&&(n.onIntercept?n:t._interceptZS),this._interceptDlgt=n&&(n.onIntercept?t:t._interceptDlgt),this._interceptCurrZone=n&&(n.onIntercept?this._zone:t._interceptCurrZone),this._invokeZS=n&&(n.onInvoke?n:t._invokeZS),this._invokeDlgt=n&&(n.onInvoke?t:t._invokeDlgt),this._invokeCurrZone=n&&(n.onInvoke?this._zone:t._invokeCurrZone),this._handleErrorZS=n&&(n.onHandleError?n:t._handleErrorZS),this._handleErrorDlgt=n&&(n.onHandleError?t:t._handleErrorDlgt),this._handleErrorCurrZone=n&&(n.onHandleError?this._zone:t._handleErrorCurrZone),this._scheduleTaskZS=n&&(n.onScheduleTask?n:t._scheduleTaskZS),this._scheduleTaskDlgt=n&&(n.onScheduleTask?t:t._scheduleTaskDlgt),this._scheduleTaskCurrZone=n&&(n.onScheduleTask?this._zone:t._scheduleTaskCurrZone),this._invokeTaskZS=n&&(n.onInvokeTask?n:t._invokeTaskZS),this._invokeTaskDlgt=n&&(n.onInvokeTask?t:t._invokeTaskDlgt),this._invokeTaskCurrZone=n&&(n.onInvokeTask?this._zone:t._invokeTaskCurrZone),this._cancelTaskZS=n&&(n.onCancelTask?n:t._cancelTaskZS),this._cancelTaskDlgt=n&&(n.onCancelTask?t:t._cancelTaskDlgt),this._cancelTaskCurrZone=n&&(n.onCancelTask?this._zone:t._cancelTaskCurrZone),this._hasTaskZS=null,this._hasTaskDlgt=null,this._hasTaskDlgtOwner=null,this._hasTaskCurrZone=null;const o=n&&n.onHasTask;(o||t&&t._hasTaskZS)&&(this._hasTaskZS=o?n:r,this._hasTaskDlgt=t,this._hasTaskDlgtOwner=this,this._hasTaskCurrZone=this._zone,n.onScheduleTask||(this._scheduleTaskZS=r,this._scheduleTaskDlgt=t,this._scheduleTaskCurrZone=this._zone),n.onInvokeTask||(this._invokeTaskZS=r,this._invokeTaskDlgt=t,this._invokeTaskCurrZone=this._zone),n.onCancelTask||(this._cancelTaskZS=r,this._cancelTaskDlgt=t,this._cancelTaskCurrZone=this._zone))}fork(e,t){return this._forkZS?this._forkZS.onFork(this._forkDlgt,this.zone,e,t):new o(e,t)}intercept(e,t,n){return this._interceptZS?this._interceptZS.onIntercept(this._interceptDlgt,this._interceptCurrZone,e,t,n):t}invoke(e,t,n,o,r){return this._invokeZS?this._invokeZS.onInvoke(this._invokeDlgt,this._invokeCurrZone,e,t,n,o,r):t.apply(n,o)}handleError(e,t){return!this._handleErrorZS||this._handleErrorZS.onHandleError(this._handleErrorDlgt,this._handleErrorCurrZone,e,t)}scheduleTask(e,t){let n=t;if(this._scheduleTaskZS)this._hasTaskZS&&n._zoneDelegates.push(this._hasTaskDlgtOwner),n=this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt,this._scheduleTaskCurrZone,e,t),n||(n=t);else if(t.scheduleFn)t.scheduleFn(t);else{if(t.type!=v)throw new Error("Task is missing scheduleFn.");_(t)}return n}invokeTask(e,t,n,o){return this._invokeTaskZS?this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt,this._invokeTaskCurrZone,e,t,n,o):t.callback.apply(n,o)}cancelTask(e,t){let n;if(this._cancelTaskZS)n=this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt,this._cancelTaskCurrZone,e,t);else{if(!t.cancelFn)throw Error("Task is not cancelable");n=t.cancelFn(t)}return n}hasTask(e,t){try{this._hasTaskZS&&this._hasTaskZS.onHasTask(this._hasTaskDlgt,this._hasTaskCurrZone,e,t)}catch(t){this.handleError(e,t)}}_updateTaskCount(e,t){const n=this._taskCounts,o=n[e],r=n[e]=o+t;if(r<0)throw new Error("More tasks executed then were scheduled.");0!=o&&0!=r||this.hasTask(this._zone,{microTask:n.microTask>0,macroTask:n.macroTask>0,eventTask:n.eventTask>0,change:e})}}class a{type;source;invoke;callback;data;scheduleFn;cancelFn;_zone=null;runCount=0;_zoneDelegates=null;_state="notScheduled";constructor(e,t,n,o,r,s){if(this.type=e,this.source=t,this.data=o,this.scheduleFn=r,this.cancelFn=s,!n)throw new Error("callback is not defined");this.callback=n;const i=this;this.invoke=e===O&&o&&o.useG?a.invokeTask:function(){return a.invokeTask.call(global,i,this,arguments)}}static invokeTask(e,t,n){e||(e=this),N++;try{return e.runCount++,e.zone.runTask(e,t,n)}finally{1==N&&d(),N--}}get zone(){return this._zone}get state(){return this._state}cancelScheduleRequest(){this._transitionTo(g,y)}_transitionTo(e,t,n){if(this._state!==t&&this._state!==n)throw new Error(`${this.type} '${this.source}': can not transition to '${e}', expecting state '${t}'${n?" or '"+n+"'":""}, was '${this._state}'.`);this._state=e,e==g&&(this._zoneDelegates=null)}toString(){return this.data&&void 0!==this.data.handleId?this.data.handleId.toString():Object.prototype.toString.call(this)}toJSON(){return{type:this.type,state:this.state,source:this.source,zone:this.zone.name,runCount:this.runCount}}}const i=__symbol__("setTimeout"),c=__symbol__("Promise"),l=__symbol__("then");let h,u=[],p=!1;function f(e){if(h||global[c]&&(h=global[c].resolve(0)),h){let t=h[l];t||(t=h.then),t.call(h,e)}else global[i](e,0)}function _(e){0===N&&0===u.length&&f(d),e&&u.push(e)}function d(){if(!p){for(p=!0;u.length;){const e=u;u=[];for(let t=0;tZ,onUnhandledError:z,microtaskDrainDone:z,scheduleMicroTask:_,showUncaughtError:()=>!o[__symbol__("ignoreConsoleErrorUncaughtError")],patchEventTarget:()=>[],patchOnProperties:z,patchMethod:()=>z,bindArguments:()=>[],patchThen:()=>z,patchMacroTask:()=>z,patchEventPrototype:()=>z,isIEOrEdge:()=>!1,getGlobalObjects:()=>{},ObjectDefineProperty:()=>z,ObjectGetOwnPropertyDescriptor:()=>{},ObjectCreate:()=>{},ArraySlice:()=>[],patchClass:()=>z,wrapWithCurrentZone:()=>z,filterProperties:()=>[],attachOriginToPatched:()=>z,_redefineProperty:()=>z,patchCallbacks:()=>z,nativeScheduleMicroTask:f};let Z={parent:null,zone:new o(null,null)},D=null,N=0;function z(){}return n("Zone","Zone"),o}const ObjectGetOwnPropertyDescriptor=Object.getOwnPropertyDescriptor,ObjectDefineProperty=Object.defineProperty,ObjectGetPrototypeOf=Object.getPrototypeOf,ObjectCreate=Object.create,ArraySlice=Array.prototype.slice,ADD_EVENT_LISTENER_STR="addEventListener",REMOVE_EVENT_LISTENER_STR="removeEventListener",ZONE_SYMBOL_ADD_EVENT_LISTENER=__symbol__("addEventListener"),ZONE_SYMBOL_REMOVE_EVENT_LISTENER=__symbol__("removeEventListener"),TRUE_STR="true",FALSE_STR="false",ZONE_SYMBOL_PREFIX=__symbol__("");function wrapWithCurrentZone(e,t){return Zone.current.wrap(e,t)}function scheduleMacroTaskWithCurrentZone(e,t,n,o,r){return Zone.current.scheduleMacroTask(e,t,n,o,r)}const zoneSymbol=__symbol__,isWindowExists="undefined"!=typeof window,internalWindow=isWindowExists?window:void 0,_global=isWindowExists&&internalWindow||globalThis,REMOVE_ATTRIBUTE="removeAttribute";function bindArguments(e,t){for(let n=e.length-1;n>=0;n--)"function"==typeof e[n]&&(e[n]=wrapWithCurrentZone(e[n],t+"_"+n));return e}function patchPrototype(e,t){const n=e.constructor.name;for(let o=0;o{const t=function(){return e.apply(this,bindArguments(arguments,n+"."+r))};return attachOriginToPatched(t,e),t})(s)}}}function isPropertyWritable(e){return!e||!1!==e.writable&&!("function"==typeof e.get&&void 0===e.set)}const isWebWorker="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope,isNode=!("nw"in _global)&&void 0!==_global.process&&"[object process]"===_global.process.toString(),isBrowser=!isNode&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),isMix=void 0!==_global.process&&"[object process]"===_global.process.toString()&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),zoneSymbolEventNames$1={},enableBeforeunloadSymbol=zoneSymbol("enable_beforeunload"),wrapFn=function(e){if(!(e=e||_global.event))return;let t=zoneSymbolEventNames$1[e.type];t||(t=zoneSymbolEventNames$1[e.type]=zoneSymbol("ON_PROPERTY"+e.type));const n=this||e.target||_global,o=n[t];let r;return isBrowser&&n===internalWindow&&"error"===e.type?(r=o&&o.call(this,e.message,e.filename,e.lineno,e.colno,e.error),!0===r&&e.preventDefault()):(r=o&&o.apply(this,arguments),"beforeunload"===e.type&&_global[enableBeforeunloadSymbol]&&"string"==typeof r?e.returnValue=r:null==r||r||e.preventDefault()),r};function patchProperty(e,t,n){let o=ObjectGetOwnPropertyDescriptor(e,t);if(!o&&n&&ObjectGetOwnPropertyDescriptor(n,t)&&(o={enumerable:!0,configurable:!0}),!o||!o.configurable)return;const r=zoneSymbol("on"+t+"patched");if(e.hasOwnProperty(r)&&e[r])return;delete o.writable,delete o.value;const s=o.get,a=o.set,i=t.slice(2);let c=zoneSymbolEventNames$1[i];c||(c=zoneSymbolEventNames$1[i]=zoneSymbol("ON_PROPERTY"+i)),o.set=function(t){let n=this;n||e!==_global||(n=_global),n&&("function"==typeof n[c]&&n.removeEventListener(i,wrapFn),a?.call(n,null),n[c]=t,"function"==typeof t&&n.addEventListener(i,wrapFn,!1))},o.get=function(){let n=this;if(n||e!==_global||(n=_global),!n)return null;const r=n[c];if(r)return r;if(s){let e=s.call(this);if(e)return o.set.call(this,e),"function"==typeof n[REMOVE_ATTRIBUTE]&&n.removeAttribute(t),e}return null},ObjectDefineProperty(e,t,o),e[r]=!0}function patchOnProperties(e,t,n){if(t)for(let o=0;o{const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,{get:function(){return e[n]},set:function(t){(!o||o.writable&&"function"==typeof o.set)&&(e[n]=t)},enumerable:!o||o.enumerable,configurable:!o||o.configurable})}))}let shouldCopySymbolProperties=!1;function setShouldCopySymbolProperties(e){shouldCopySymbolProperties=e}function patchMethod(e,t,n){let o=e;for(;o&&!o.hasOwnProperty(t);)o=ObjectGetPrototypeOf(o);!o&&e[t]&&(o=e);const r=zoneSymbol(t);let s=null;if(o&&(!(s=o[r])||!o.hasOwnProperty(r))&&(s=o[r]=o[t],isPropertyWritable(o&&ObjectGetOwnPropertyDescriptor(o,t)))){const e=n(s,r,t);o[t]=function(){return e(this,arguments)},attachOriginToPatched(o[t],s),shouldCopySymbolProperties&©SymbolProperties(s,o[t])}return s}function patchMacroTask(e,t,n){let o=null;function r(e){const t=e.data;return t.args[t.cbIdx]=function(){e.invoke.apply(this,arguments)},o.apply(t.target,t.args),e}o=patchMethod(e,t,(e=>function(t,o){const s=n(t,o);return s.cbIdx>=0&&"function"==typeof o[s.cbIdx]?scheduleMacroTaskWithCurrentZone(s.name,o[s.cbIdx],s,r):e.apply(t,o)}))}function patchMicroTask(e,t,n){let o=null;function r(e){const t=e.data;return t.args[t.cbIdx]=function(){e.invoke.apply(this,arguments)},o.apply(t.target,t.args),e}o=patchMethod(e,t,(e=>function(t,o){const s=n(t,o);return s.cbIdx>=0&&"function"==typeof o[s.cbIdx]?Zone.current.scheduleMicroTask(s.name,o[s.cbIdx],s,r):e.apply(t,o)}))}function attachOriginToPatched(e,t){e[zoneSymbol("OriginalDelegate")]=t}let isDetectedIEOrEdge=!1,ieOrEdge=!1;function isIEOrEdge(){if(isDetectedIEOrEdge)return ieOrEdge;isDetectedIEOrEdge=!0;try{const e=internalWindow.navigator.userAgent;-1===e.indexOf("MSIE ")&&-1===e.indexOf("Trident/")&&-1===e.indexOf("Edge/")||(ieOrEdge=!0)}catch(e){}return ieOrEdge}function isFunction(e){return"function"==typeof e}function isNumber(e){return"number"==typeof e}const OPTIMIZED_ZONE_EVENT_TASK_DATA={useG:!0},zoneSymbolEventNames={},globalSources={},EVENT_NAME_SYMBOL_REGX=new RegExp("^"+ZONE_SYMBOL_PREFIX+"(\\w+)(true|false)$"),IMMEDIATE_PROPAGATION_SYMBOL=zoneSymbol("propagationStopped");function prepareEventNames(e,t){const n=(t?t(e):e)+"false",o=(t?t(e):e)+"true",r=ZONE_SYMBOL_PREFIX+n,s=ZONE_SYMBOL_PREFIX+o;zoneSymbolEventNames[e]={},zoneSymbolEventNames[e].false=r,zoneSymbolEventNames[e].true=s}function patchEventTarget(e,t,n,o){const r=o&&o.add||"addEventListener",s=o&&o.rm||"removeEventListener",a=o&&o.listeners||"eventListeners",i=o&&o.rmAll||"removeAllListeners",c=zoneSymbol(r),l="."+r+":",h="prependListener",u="."+h+":",p=function(e,t,n){if(e.isRemoved)return;const o=e.callback;let r;"object"==typeof o&&o.handleEvent&&(e.callback=e=>o.handleEvent(e),e.originalDelegate=o);try{e.invoke(e,t,[n])}catch(e){r=e}const a=e.options;return a&&"object"==typeof a&&a.once&&t[s].call(t,n.type,e.originalDelegate?e.originalDelegate:e.callback,a),r};function f(n,o,r){if(!(o=o||e.event))return;const s=n||o.target||e,a=s[zoneSymbolEventNames[o.type][r?"true":"false"]];if(a){const e=[];if(1===a.length){const t=p(a[0],s,o);t&&e.push(t)}else{const t=a.slice();for(let n=0;n{throw o}))}}}const _=function(e){return f(this,e,!1)},d=function(e){return f(this,e,!0)};function m(t,n){if(!t)return!1;let o=!0;n&&void 0!==n.useG&&(o=n.useG);const p=n&&n.vh;let f=!0;n&&void 0!==n.chkDup&&(f=n.chkDup);let m=!1;n&&void 0!==n.rt&&(m=n.rt);let g=t;for(;g&&!g.hasOwnProperty(r);)g=ObjectGetPrototypeOf(g);if(!g&&t[r]&&(g=t),!g)return!1;if(g[c])return!1;const y=n&&n.eventNameToString,k={},b=g[c]=g[r],E=g[zoneSymbol(s)]=g[s],T=g[zoneSymbol(a)]=g[a],v=g[zoneSymbol(i)]=g[i];let S;n&&n.prepend&&(S=g[zoneSymbol(n.prepend)]=g[n.prepend]);const O=o?function(e){if(!k.isExisting)return b.call(k.target,k.eventName,k.capture?d:_,k.options)}:function(e){return b.call(k.target,k.eventName,e.invoke,k.options)},w=o?function(e){if(!e.isRemoved){const t=zoneSymbolEventNames[e.eventName];let n;t&&(n=t[e.capture?"true":"false"]);const o=n&&e.target[n];if(o)for(let t=0;tj.zone.cancelTask(j);t.call(E,"abort",e,{once:!0}),j.removeAbortListener=()=>E.removeEventListener("abort",e)}return k.target=null,R&&(R.taskData=null),v&&(k.options.once=!0),"boolean"!=typeof j.options&&(j.options=m),j.target=l,j.capture=T,j.eventName=h,_&&(j.originalDelegate=u),c?z.unshift(j):z.push(j),i?l:void 0}};return g[r]=N(b,l,O,w,m),S&&(g[h]=N(S,u,(function(e){return S.call(k.target,k.eventName,e.invoke,k.options)}),w,m,!0)),g[s]=function(){const t=this||e;let o=arguments[0];n&&n.transferEventName&&(o=n.transferEventName(o));const r=arguments[2],s=!!r&&("boolean"==typeof r||r.capture),a=arguments[1];if(!a)return E.apply(this,arguments);if(p&&!p(E,a,t,arguments))return;const i=zoneSymbolEventNames[o];let c;i&&(c=i[s?"true":"false"]);const l=c&&t[c];if(l)for(let e=0;efunction(t,n){t[IMMEDIATE_PROPAGATION_SYMBOL]=!0,e&&e.apply(t,n)}))}function patchQueueMicrotask(e,t){t.patchMethod(e,"queueMicrotask",(e=>function(e,t){Zone.current.scheduleMicroTask("queueMicrotask",t[0])}))}const taskSymbol=zoneSymbol("zoneTask");function patchTimer(e,t,n,o){let r=null,s=null;n+=o;const a={};function i(t){const n=t.data;n.args[0]=function(){return t.invoke.apply(this,arguments)};const o=r.apply(e,n.args);return isNumber(o)?n.handleId=o:(n.handle=o,n.isRefreshable=isFunction(o.refresh)),t}function c(t){const{handle:n,handleId:o}=t.data;return s.call(e,n??o)}r=patchMethod(e,t+=o,(n=>function(r,s){if(isFunction(s[0])){const e={isRefreshable:!1,isPeriodic:"Interval"===o,delay:"Timeout"===o||"Interval"===o?s[1]||0:void 0,args:s},n=s[0];s[0]=function t(){try{return n.apply(this,arguments)}finally{const{handle:t,handleId:n,isPeriodic:o,isRefreshable:r}=e;o||r||(n?delete a[n]:t&&(t[taskSymbol]=null))}};const r=scheduleMacroTaskWithCurrentZone(t,s[0],e,i,c);if(!r)return r;const{handleId:l,handle:h,isRefreshable:u,isPeriodic:p}=r.data;if(l)a[l]=r;else if(h&&(h[taskSymbol]=r,u&&!p)){const e=h.refresh;h.refresh=function(){const{zone:t,state:n}=r;return"notScheduled"===n?(r._state="scheduled",t._updateTaskCount(r,1)):"running"===n&&(r._state="scheduling"),e.call(this)}}return h??l??r}return n.apply(e,s)})),s=patchMethod(e,n,(t=>function(n,o){const r=o[0];let s;isNumber(r)?(s=a[r],delete a[r]):(s=r?.[taskSymbol],s?r[taskSymbol]=null:s=r),s?.type?s.cancelFn&&s.zone.cancelTask(s):t.apply(e,o)}))}function patchCustomElements(e,t){const{isBrowser:n,isMix:o}=t.getGlobalObjects();(n||o)&&e.customElements&&"customElements"in e&&t.patchCallbacks(t,e.customElements,"customElements","define",["connectedCallback","disconnectedCallback","adoptedCallback","attributeChangedCallback","formAssociatedCallback","formDisabledCallback","formResetCallback","formStateRestoreCallback"])}function eventTargetPatch(e,t){if(Zone[t.symbol("patchEventTarget")])return;const{eventNames:n,zoneSymbolEventNames:o,TRUE_STR:r,FALSE_STR:s,ZONE_SYMBOL_PREFIX:a}=t.getGlobalObjects();for(let e=0;et.target===e));if(0===o.length)return t;const r=o[0].ignoreProperties;return t.filter((e=>-1===r.indexOf(e)))}function patchFilteredProperties(e,t,n,o){e&&patchOnProperties(e,filterProperties(e,t,n),o)}function getOnEventNames(e){return Object.getOwnPropertyNames(e).filter((e=>e.startsWith("on")&&e.length>2)).map((e=>e.substring(2)))}function propertyDescriptorPatch(e,t){if(isNode&&!isMix)return;if(Zone[e.symbol("patchEvents")])return;const n=t.__Zone_ignore_on_properties;let o=[];if(isBrowser){const e=window;o=o.concat(["Document","SVGElement","Element","HTMLElement","HTMLBodyElement","HTMLMediaElement","HTMLFrameSetElement","HTMLFrameElement","HTMLIFrameElement","HTMLMarqueeElement","Worker"]);const t=[];patchFilteredProperties(e,getOnEventNames(e),n?n.concat(t):n,ObjectGetPrototypeOf(e))}o=o.concat(["XMLHttpRequest","XMLHttpRequestEventTarget","IDBIndex","IDBRequest","IDBOpenDBRequest","IDBDatabase","IDBTransaction","IDBCursor","WebSocket"]);for(let e=0;e{const n=t[e.__symbol__("legacyPatch")];n&&n()})),e.__load_patch("timers",(e=>{const t="set",n="clear";patchTimer(e,t,n,"Timeout"),patchTimer(e,t,n,"Interval"),patchTimer(e,t,n,"Immediate")})),e.__load_patch("requestAnimationFrame",(e=>{patchTimer(e,"request","cancel","AnimationFrame"),patchTimer(e,"mozRequest","mozCancel","AnimationFrame"),patchTimer(e,"webkitRequest","webkitCancel","AnimationFrame")})),e.__load_patch("blocking",((e,t)=>{const n=["alert","prompt","confirm"];for(let o=0;ofunction(o,s){return t.current.run(n,e,s,r)}))})),e.__load_patch("EventTarget",((e,t,n)=>{patchEvent(e,n),eventTargetPatch(e,n);const o=e.XMLHttpRequestEventTarget;o&&o.prototype&&n.patchEventTarget(e,n,[o.prototype])})),e.__load_patch("MutationObserver",((e,t,n)=>{patchClass("MutationObserver"),patchClass("WebKitMutationObserver")})),e.__load_patch("IntersectionObserver",((e,t,n)=>{patchClass("IntersectionObserver")})),e.__load_patch("FileReader",((e,t,n)=>{patchClass("FileReader")})),e.__load_patch("on_property",((e,t,n)=>{propertyDescriptorPatch(n,e)})),e.__load_patch("customElements",((e,t,n)=>{patchCustomElements(e,n)})),e.__load_patch("XHR",((e,t)=>{!function n(e){const n=e.XMLHttpRequest;if(!n)return;const l=n.prototype;let h=l[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=l[ZONE_SYMBOL_REMOVE_EVENT_LISTENER];if(!h){const t=e.XMLHttpRequestEventTarget;if(t){const e=t.prototype;h=e[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=e[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]}}const p="readystatechange",f="scheduled";function _(e){const n=e.data,r=n.target;r[a]=!1,r[c]=!1;const i=r[s];h||(h=r[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=r[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]),i&&u.call(r,p,i);const l=r[s]=()=>{if(r.readyState===r.DONE)if(!n.aborted&&r[a]&&e.state===f){const o=r[t.__symbol__("loadfalse")];if(0!==r.status&&o&&o.length>0){const s=e.invoke;e.invoke=function(){const o=r[t.__symbol__("loadfalse")];for(let t=0;tfunction(e,t){return e[r]=0==t[2],e[i]=t[1],g.apply(e,t)})),y=zoneSymbol("fetchTaskAborting"),k=zoneSymbol("fetchTaskScheduling"),b=patchMethod(l,"send",(()=>function(e,n){if(!0===t.current[k])return b.apply(e,n);if(e[r])return b.apply(e,n);{const t={target:e,url:e[i],isPeriodic:!1,args:n,aborted:!1},o=scheduleMacroTaskWithCurrentZone("XMLHttpRequest.send",d,t,_,m);e&&!0===e[c]&&!t.aborted&&o.state===f&&o.invoke()}})),E=patchMethod(l,"abort",(()=>function(e,n){const r=function s(e){return e[o]}(e);if(r&&"string"==typeof r.type){if(null==r.cancelFn||r.data&&r.data.aborted)return;r.zone.cancelTask(r)}else if(!0===t.current[y])return E.apply(e,n)}))}(e);const o=zoneSymbol("xhrTask"),r=zoneSymbol("xhrSync"),s=zoneSymbol("xhrListener"),a=zoneSymbol("xhrScheduled"),i=zoneSymbol("xhrURL"),c=zoneSymbol("xhrErrorBeforeScheduled")})),e.__load_patch("geolocation",(e=>{e.navigator&&e.navigator.geolocation&&patchPrototype(e.navigator.geolocation,["getCurrentPosition","watchPosition"])})),e.__load_patch("PromiseRejectionEvent",((e,t)=>{function n(t){return function(n){findEventTasks(e,t).forEach((o=>{const r=e.PromiseRejectionEvent;if(r){const e=new r(t,{promise:n.promise,reason:n.rejection});o.invoke(e)}}))}}e.PromiseRejectionEvent&&(t[zoneSymbol("unhandledPromiseRejectionHandler")]=n("unhandledrejection"),t[zoneSymbol("rejectionHandledHandler")]=n("rejectionhandled"))})),e.__load_patch("queueMicrotask",((e,t,n)=>{patchQueueMicrotask(e,n)}))}function patchPromise(e){e.__load_patch("ZoneAwarePromise",((e,t,n)=>{const o=Object.getOwnPropertyDescriptor,r=Object.defineProperty,s=n.symbol,a=[],i=!1!==e[s("DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION")],c=s("Promise"),l=s("then");n.onUnhandledError=e=>{if(n.showUncaughtError()){const t=e&&e.rejection;t?console.error("Unhandled Promise rejection:",t instanceof Error?t.message:t,"; Zone:",e.zone.name,"; Task:",e.task&&e.task.source,"; Value:",t,t instanceof Error?t.stack:void 0):console.error(e)}},n.microtaskDrainDone=()=>{for(;a.length;){const e=a.shift();try{e.zone.runGuarded((()=>{if(e.throwOriginal)throw e.rejection;throw e}))}catch(e){u(e)}}};const h=s("unhandledPromiseRejectionHandler");function u(e){n.onUnhandledError(e);try{const n=t[h];"function"==typeof n&&n.call(this,e)}catch(e){}}function p(e){return e&&"function"==typeof e.then}function f(e){return e}function _(e){return M.reject(e)}const d=s("state"),m=s("value"),g=s("finally"),y=s("parentPromiseValue"),k=s("parentPromiseState"),b=null,E=!0,T=!1;function v(e,t){return n=>{try{P(e,t,n)}catch(t){P(e,!1,t)}}}const S=function(){let e=!1;return function t(n){return function(){e||(e=!0,n.apply(null,arguments))}}},O="Promise resolved with itself",w=s("currentTaskTrace");function P(e,o,s){const c=S();if(e===s)throw new TypeError(O);if(e[d]===b){let l=null;try{"object"!=typeof s&&"function"!=typeof s||(l=s&&s.then)}catch(t){return c((()=>{P(e,!1,t)}))(),e}if(o!==T&&s instanceof M&&s.hasOwnProperty(d)&&s.hasOwnProperty(m)&&s[d]!==b)D(s),P(e,s[d],s[m]);else if(o!==T&&"function"==typeof l)try{l.call(s,c(v(e,o)),c(v(e,!1)))}catch(t){c((()=>{P(e,!1,t)}))()}else{e[d]=o;const c=e[m];if(e[m]=s,e[g]===g&&o===E&&(e[d]=e[k],e[m]=e[y]),o===T&&s instanceof Error){const e=t.currentTask&&t.currentTask.data&&t.currentTask.data.__creationTrace__;e&&r(s,w,{configurable:!0,enumerable:!1,writable:!0,value:e})}for(let t=0;t{try{const o=e[m],r=!!n&&g===n[g];r&&(n[y]=o,n[k]=s);const i=t.run(a,void 0,r&&a!==_&&a!==f?[]:[o]);P(n,!0,i)}catch(e){P(n,!1,e)}}),n)}const z=function(){},C=e.AggregateError;class M{static toString(){return"function ZoneAwarePromise() { [native code] }"}static resolve(e){return e instanceof M?e:P(new this(null),E,e)}static reject(e){return P(new this(null),T,e)}static withResolvers(){const e={};return e.promise=new M(((t,n)=>{e.resolve=t,e.reject=n})),e}static any(e){if(!e||"function"!=typeof e[Symbol.iterator])return Promise.reject(new C([],"All promises were rejected"));const t=[];let n=0;try{for(let o of e)n++,t.push(M.resolve(o))}catch(e){return Promise.reject(new C([],"All promises were rejected"))}if(0===n)return Promise.reject(new C([],"All promises were rejected"));let o=!1;const r=[];return new M(((e,s)=>{for(let a=0;a{o||(o=!0,e(t))}),(e=>{r.push(e),n--,0===n&&(o=!0,s(new C(r,"All promises were rejected")))}))}))}static race(e){let t,n,o=new this(((e,o)=>{t=e,n=o}));function r(e){t(e)}function s(e){n(e)}for(let t of e)p(t)||(t=this.resolve(t)),t.then(r,s);return o}static all(e){return M.allWithCallback(e)}static allSettled(e){return(this&&this.prototype instanceof M?this:M).allWithCallback(e,{thenCallback:e=>({status:"fulfilled",value:e}),errorCallback:e=>({status:"rejected",reason:e})})}static allWithCallback(e,t){let n,o,r=new this(((e,t)=>{n=e,o=t})),s=2,a=0;const i=[];for(let r of e){p(r)||(r=this.resolve(r));const e=a;try{r.then((o=>{i[e]=t?t.thenCallback(o):o,s--,0===s&&n(i)}),(r=>{t?(i[e]=t.errorCallback(r),s--,0===s&&n(i)):o(r)}))}catch(e){o(e)}s++,a++}return s-=2,0===s&&n(i),r}constructor(e){const t=this;if(!(t instanceof M))throw new Error("Must be an instanceof Promise.");t[d]=b,t[m]=[];try{const n=S();e&&e(n(v(t,E)),n(v(t,T)))}catch(e){P(t,!1,e)}}get[Symbol.toStringTag](){return"Promise"}get[Symbol.species](){return M}then(e,n){let o=this.constructor?.[Symbol.species];o&&"function"==typeof o||(o=this.constructor||M);const r=new o(z),s=t.current;return this[d]==b?this[m].push(s,r,e,n):N(this,s,r,e,n),r}catch(e){return this.then(null,e)}finally(e){let n=this.constructor?.[Symbol.species];n&&"function"==typeof n||(n=M);const o=new n(z);o[g]=g;const r=t.current;return this[d]==b?this[m].push(r,o,e,e):N(this,r,o,e,e),o}}M.resolve=M.resolve,M.reject=M.reject,M.race=M.race,M.all=M.all;const I=e[c]=e.Promise;e.Promise=M;const R=s("thenPatched");function j(e){const t=e.prototype,n=o(t,"then");if(n&&(!1===n.writable||!n.configurable))return;const r=t.then;t[l]=r,e.prototype.then=function(e,t){return new M(((e,t)=>{r.call(this,e,t)})).then(e,t)},e[R]=!0}return n.patchThen=j,I&&(j(I),patchMethod(e,"fetch",(e=>function t(e){return function(t,n){let o=e.apply(t,n);if(o instanceof M)return o;let r=o.constructor;return r[R]||j(r),o}}(e)))),Promise[t.__symbol__("uncaughtPromiseErrors")]=a,M}))}function patchToString(e){e.__load_patch("toString",(e=>{const t=Function.prototype.toString,n=zoneSymbol("OriginalDelegate"),o=zoneSymbol("Promise"),r=zoneSymbol("Error"),s=function s(){if("function"==typeof this){const s=this[n];if(s)return"function"==typeof s?t.call(s):Object.prototype.toString.call(s);if(this===Promise){const n=e[o];if(n)return t.call(n)}if(this===Error){const n=e[r];if(n)return t.call(n)}}return t.call(this)};s[n]=t,Function.prototype.toString=s;const a=Object.prototype.toString;Object.prototype.toString=function(){return"function"==typeof Promise&&this instanceof Promise?"[object Promise]":a.call(this)}}))}function patchCallbacks(e,t,n,o,r){const s=Zone.__symbol__(o);if(t[s])return;const a=t[s]=t[o];t[o]=function(s,i,c){return i&&i.prototype&&r.forEach((function(t){const r=`${n}.${o}::`+t,s=i.prototype;try{if(s.hasOwnProperty(t)){const n=e.ObjectGetOwnPropertyDescriptor(s,t);n&&n.value?(n.value=e.wrapWithCurrentZone(n.value,r),e._redefineProperty(i.prototype,t,n)):s[t]&&(s[t]=e.wrapWithCurrentZone(s[t],r))}else s[t]&&(s[t]=e.wrapWithCurrentZone(s[t],r))}catch{}})),a.call(t,s,i,c)},e.attachOriginToPatched(t[o],a)}function patchUtil(e){e.__load_patch("util",((e,t,n)=>{const o=getOnEventNames(e);n.patchOnProperties=patchOnProperties,n.patchMethod=patchMethod,n.bindArguments=bindArguments,n.patchMacroTask=patchMacroTask;const r=t.__symbol__("BLACK_LISTED_EVENTS"),s=t.__symbol__("UNPATCHED_EVENTS");e[s]&&(e[r]=e[s]),e[r]&&(t[r]=t[s]=e[r]),n.patchEventPrototype=patchEventPrototype,n.patchEventTarget=patchEventTarget,n.isIEOrEdge=isIEOrEdge,n.ObjectDefineProperty=ObjectDefineProperty,n.ObjectGetOwnPropertyDescriptor=ObjectGetOwnPropertyDescriptor,n.ObjectCreate=ObjectCreate,n.ArraySlice=ArraySlice,n.patchClass=patchClass,n.wrapWithCurrentZone=wrapWithCurrentZone,n.filterProperties=filterProperties,n.attachOriginToPatched=attachOriginToPatched,n._redefineProperty=Object.defineProperty,n.patchCallbacks=patchCallbacks,n.getGlobalObjects=()=>({globalSources:globalSources,zoneSymbolEventNames:zoneSymbolEventNames,eventNames:o,isBrowser:isBrowser,isMix:isMix,isNode:isNode,TRUE_STR:"true",FALSE_STR:"false",ZONE_SYMBOL_PREFIX:ZONE_SYMBOL_PREFIX,ADD_EVENT_LISTENER_STR:"addEventListener",REMOVE_EVENT_LISTENER_STR:"removeEventListener"})}))}function patchCommon(e){patchPromise(e),patchToString(e),patchUtil(e)}function patchEvents(e){e.__load_patch("EventEmitter",((e,t,n)=>{const o="addListener",r="removeListener",s=function(e,t){return e.callback===t||e.callback.listener===t},a=function(e){return"string"==typeof e?e:e?e.toString().replace("(","_").replace(")","_"):""};let i;try{i=require("events")}catch(e){}i&&i.EventEmitter&&function c(t){const i=patchEventTarget(e,n,[t],{useG:!1,add:o,rm:r,prepend:"prependListener",rmAll:"removeAllListeners",listeners:"listeners",chkDup:!1,rt:!0,diff:s,eventNameToString:a});i&&i[0]&&(t.on=t[o],t.off=t[r])}(i.EventEmitter.prototype)}))}function patchFs(e){e.__load_patch("fs",((e,t,n)=>{let o;try{o=require("fs")}catch(e){}if(!o)return;["access","appendFile","chmod","chown","close","exists","fchmod","fchown","fdatasync","fstat","fsync","ftruncate","futimes","lchmod","lchown","lutimes","link","lstat","mkdir","mkdtemp","open","opendir","read","readdir","readFile","readlink","realpath","rename","rmdir","stat","symlink","truncate","unlink","utimes","write","writeFile","writev"].filter((e=>!!o[e]&&"function"==typeof o[e])).forEach((e=>{patchMacroTask(o,e,((t,n)=>({name:"fs."+e,args:n,cbIdx:n.length>0?n.length-1:-1,target:t})))}));const r=o.realpath?.[n.symbol("OriginalDelegate")];r?.native&&(o.realpath.native=r.native,patchMacroTask(o.realpath,"native",((e,t)=>({args:t,target:e,cbIdx:t.length>0?t.length-1:-1,name:"fs.realpath.native"}))))}))}function patchNodeUtil(e){e.__load_patch("node_util",((e,t,n)=>{n.patchOnProperties=patchOnProperties,n.patchMethod=patchMethod,n.bindArguments=bindArguments,n.patchMacroTask=patchMacroTask,setShouldCopySymbolProperties(!0)}))}const set="set",clear="clear";function patchNode(e){patchNodeUtil(e),patchEvents(e),patchFs(e),e.__load_patch("node_timers",((e,t)=>{let n=!1;try{const t=require("timers");if(e.setTimeout!==t.setTimeout&&!isMix){const o=t.setTimeout;t.setTimeout=function(){return n=!0,o.apply(this,arguments)};const r=e.setTimeout((()=>{}),100);clearTimeout(r),t.setTimeout=o}patchTimer(t,set,clear,"Timeout"),patchTimer(t,set,clear,"Interval"),patchTimer(t,set,clear,"Immediate")}catch(e){}isMix||(n?(e[t.__symbol__("setTimeout")]=e.setTimeout,e[t.__symbol__("setInterval")]=e.setInterval,e[t.__symbol__("setImmediate")]=e.setImmediate):(patchTimer(e,set,clear,"Timeout"),patchTimer(e,set,clear,"Interval"),patchTimer(e,set,clear,"Immediate")))})),e.__load_patch("nextTick",(()=>{patchMicroTask(process,"nextTick",((e,t)=>({name:"process.nextTick",args:t,cbIdx:t.length>0&&"function"==typeof t[0]?0:-1,target:process})))})),e.__load_patch("handleUnhandledPromiseRejection",((e,t,n)=>{function o(e){return function(t){findEventTasks(process,e).forEach((n=>{"unhandledRejection"===e?n.invoke(t.rejection,t.promise):"rejectionHandled"===e&&n.invoke(t.promise)}))}}t[n.symbol("unhandledPromiseRejectionHandler")]=o("unhandledRejection"),t[n.symbol("rejectionHandledHandler")]=o("rejectionHandled")})),e.__load_patch("crypto",(()=>{let e;try{e=require("crypto")}catch(e){}e&&["randomBytes","pbkdf2"].forEach((t=>{patchMacroTask(e,t,((n,o)=>({name:"crypto."+t,args:o,cbIdx:o.length>0&&"function"==typeof o[o.length-1]?o.length-1:-1,target:e})))}))})),e.__load_patch("console",((e,t)=>{["dir","log","info","error","warn","assert","debug","timeEnd","trace"].forEach((e=>{const n=console[t.__symbol__(e)]=console[e];n&&(console[e]=function(){const e=ArraySlice.call(arguments);return t.current===t.root?n.apply(this,e):t.root.run(n,this,e)})}))})),e.__load_patch("queueMicrotask",((e,t,n)=>{patchQueueMicrotask(e,n)}))}function loadZone(){const e=globalThis,t=!0===e[__symbol__("forceDuplicateZoneCheck")];if(e.Zone&&(t||"function"!=typeof e.Zone.__symbol__))throw new Error("Zone already loaded.");return e.Zone??=initZone(),e.Zone}const Zone$1=loadZone();patchCommon(Zone$1),patchBrowser(Zone$1),patchNode(Zone$1);v:x'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ const global = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { const symbolPrefix = global['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } function initZone() { const performance = global['performance']; function mark(name) { performance && performance['mark'] && performance['mark'](name); } function performanceMeasure(name, label) { performance && performance['measure'] && performance['measure'](name, label); } mark('Zone'); class ZoneImpl { static __symbol__ = __symbol__; static assertZonePatched() { if (global['Promise'] !== patches['ZoneAwarePromise']) { throw new Error('Zone.js has detected that ZoneAwarePromise `(window|global).Promise` ' + 'has been overwritten.\n' + 'Most likely cause is that a Promise polyfill has been loaded ' + 'after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. ' + 'If you must load one, do so before loading zone.js.)'); } } static get root() { let zone = ZoneImpl.current; while (zone.parent) { zone = zone.parent; } return zone; } static get current() { return _currentZoneFrame.zone; } static get currentTask() { return _currentTask; } static __load_patch(name, fn, ignoreDuplicate = false) { if (patches.hasOwnProperty(name)) { // `checkDuplicate` option is defined from global variable // so it works for all modules. // `ignoreDuplicate` can work for the specified module const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (!ignoreDuplicate && checkDuplicate) { throw Error('Already loaded patch: ' + name); } } else if (!global['__Zone_disable_' + name]) { const perfName = 'Zone:' + name; mark(perfName); patches[name] = fn(global, ZoneImpl, _api); performanceMeasure(perfName, perfName); } } get parent() { return this._parent; } get name() { return this._name; } _parent; _name; _properties; _zoneDelegate; constructor(parent, zoneSpec) { this._parent = parent; this._name = zoneSpec ? zoneSpec.name || 'unnamed' : ''; this._properties = (zoneSpec && zoneSpec.properties) || {}; this._zoneDelegate = new _ZoneDelegate(this, this._parent && this._parent._zoneDelegate, zoneSpec); } get(key) { const zone = this.getZoneWith(key); if (zone) return zone._properties[key]; } getZoneWith(key) { let current = this; while (current) { if (current._properties.hasOwnProperty(key)) { return current; } current = current._parent; } return null; } fork(zoneSpec) { if (!zoneSpec) throw new Error('ZoneSpec required!'); return this._zoneDelegate.fork(this, zoneSpec); } wrap(callback, source) { if (typeof callback !== 'function') { throw new Error('Expecting function got: ' + callback); } const _callback = this._zoneDelegate.intercept(this, callback, source); const zone = this; return function () { return zone.runGuarded(_callback, this, arguments, source); }; } run(callback, applyThis, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runGuarded(callback, applyThis = null, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runTask(task, applyThis, applyArgs) { if (task.zone != this) { throw new Error('A task can only be run in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); } const zoneTask = task; // https://github.com/angular/zone.js/issues/778, sometimes eventTask // will run in notScheduled(canceled) state, we should not try to // run such kind of task but just return const { type, data: { isPeriodic = false, isRefreshable = false } = {} } = task; if (task.state === notScheduled && (type === eventTask || type === macroTask)) { return; } const reEntryGuard = task.state != running; reEntryGuard && zoneTask._transitionTo(running, scheduled); const previousTask = _currentTask; _currentTask = zoneTask; _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { if (type == macroTask && task.data && !isPeriodic && !isRefreshable) { task.cancelFn = undefined; } try { return this._zoneDelegate.invokeTask(this, zoneTask, applyThis, applyArgs); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { // if the task's state is notScheduled or unknown, then it has already been cancelled // we should not reset the state to scheduled const state = task.state; if (state !== notScheduled && state !== unknown) { if (type == eventTask || isPeriodic || (isRefreshable && state === scheduling)) { reEntryGuard && zoneTask._transitionTo(scheduled, running, scheduling); } else { const zoneDelegates = zoneTask._zoneDelegates; this._updateTaskCount(zoneTask, -1); reEntryGuard && zoneTask._transitionTo(notScheduled, running, notScheduled); if (isRefreshable) { zoneTask._zoneDelegates = zoneDelegates; } } } _currentZoneFrame = _currentZoneFrame.parent; _currentTask = previousTask; } } scheduleTask(task) { if (task.zone && task.zone !== this) { // check if the task was rescheduled, the newZone // should not be the children of the original zone let newZone = this; while (newZone) { if (newZone === task.zone) { throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${task.zone.name}`); } newZone = newZone.parent; } } task._transitionTo(scheduling, notScheduled); const zoneDelegates = []; task._zoneDelegates = zoneDelegates; task._zone = this; try { task = this._zoneDelegate.scheduleTask(this, task); } catch (err) { // should set task's state to unknown when scheduleTask throw error // because the err may from reschedule, so the fromState maybe notScheduled task._transitionTo(unknown, scheduling, notScheduled); // TODO: @JiaLiPassion, should we check the result from handleError? this._zoneDelegate.handleError(this, err); throw err; } if (task._zoneDelegates === zoneDelegates) { // we have to check because internally the delegate can reschedule the task. this._updateTaskCount(task, 1); } if (task.state == scheduling) { task._transitionTo(scheduled, scheduling); } return task; } scheduleMicroTask(source, callback, data, customSchedule) { return this.scheduleTask(new ZoneTask(microTask, source, callback, data, customSchedule, undefined)); } scheduleMacroTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(macroTask, source, callback, data, customSchedule, customCancel)); } scheduleEventTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(eventTask, source, callback, data, customSchedule, customCancel)); } cancelTask(task) { if (task.zone != this) throw new Error('A task can only be cancelled in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); if (task.state !== scheduled && task.state !== running) { return; } task._transitionTo(canceling, scheduled, running); try { this._zoneDelegate.cancelTask(this, task); } catch (err) { // if error occurs when cancelTask, transit the state to unknown task._transitionTo(unknown, canceling); this._zoneDelegate.handleError(this, err); throw err; } this._updateTaskCount(task, -1); task._transitionTo(notScheduled, canceling); task.runCount = -1; return task; } _updateTaskCount(task, count) { const zoneDelegates = task._zoneDelegates; if (count == -1) { task._zoneDelegates = null; } for (let i = 0; i < zoneDelegates.length; i++) { zoneDelegates[i]._updateTaskCount(task.type, count); } } } const DELEGATE_ZS = { name: '', onHasTask: (delegate, _, target, hasTaskState) => delegate.hasTask(target, hasTaskState), onScheduleTask: (delegate, _, target, task) => delegate.scheduleTask(target, task), onInvokeTask: (delegate, _, target, task, applyThis, applyArgs) => delegate.invokeTask(target, task, applyThis, applyArgs), onCancelTask: (delegate, _, target, task) => delegate.cancelTask(target, task), }; class _ZoneDelegate { get zone() { return this._zone; } _zone; _taskCounts = { 'microTask': 0, 'macroTask': 0, 'eventTask': 0, }; _parentDelegate; _forkDlgt; _forkZS; _forkCurrZone; _interceptDlgt; _interceptZS; _interceptCurrZone; _invokeDlgt; _invokeZS; _invokeCurrZone; _handleErrorDlgt; _handleErrorZS; _handleErrorCurrZone; _scheduleTaskDlgt; _scheduleTaskZS; _scheduleTaskCurrZone; _invokeTaskDlgt; _invokeTaskZS; _invokeTaskCurrZone; _cancelTaskDlgt; _cancelTaskZS; _cancelTaskCurrZone; _hasTaskDlgt; _hasTaskDlgtOwner; _hasTaskZS; _hasTaskCurrZone; constructor(zone, parentDelegate, zoneSpec) { this._zone = zone; this._parentDelegate = parentDelegate; this._forkZS = zoneSpec && (zoneSpec && zoneSpec.onFork ? zoneSpec : parentDelegate._forkZS); this._forkDlgt = zoneSpec && (zoneSpec.onFork ? parentDelegate : parentDelegate._forkDlgt); this._forkCurrZone = zoneSpec && (zoneSpec.onFork ? this._zone : parentDelegate._forkCurrZone); this._interceptZS = zoneSpec && (zoneSpec.onIntercept ? zoneSpec : parentDelegate._interceptZS); this._interceptDlgt = zoneSpec && (zoneSpec.onIntercept ? parentDelegate : parentDelegate._interceptDlgt); this._interceptCurrZone = zoneSpec && (zoneSpec.onIntercept ? this._zone : parentDelegate._interceptCurrZone); this._invokeZS = zoneSpec && (zoneSpec.onInvoke ? zoneSpec : parentDelegate._invokeZS); this._invokeDlgt = zoneSpec && (zoneSpec.onInvoke ? parentDelegate : parentDelegate._invokeDlgt); this._invokeCurrZone = zoneSpec && (zoneSpec.onInvoke ? this._zone : parentDelegate._invokeCurrZone); this._handleErrorZS = zoneSpec && (zoneSpec.onHandleError ? zoneSpec : parentDelegate._handleErrorZS); this._handleErrorDlgt = zoneSpec && (zoneSpec.onHandleError ? parentDelegate : parentDelegate._handleErrorDlgt); this._handleErrorCurrZone = zoneSpec && (zoneSpec.onHandleError ? this._zone : parentDelegate._handleErrorCurrZone); this._scheduleTaskZS = zoneSpec && (zoneSpec.onScheduleTask ? zoneSpec : parentDelegate._scheduleTaskZS); this._scheduleTaskDlgt = zoneSpec && (zoneSpec.onScheduleTask ? parentDelegate : parentDelegate._scheduleTaskDlgt); this._scheduleTaskCurrZone = zoneSpec && (zoneSpec.onScheduleTask ? this._zone : parentDelegate._scheduleTaskCurrZone); this._invokeTaskZS = zoneSpec && (zoneSpec.onInvokeTask ? zoneSpec : parentDelegate._invokeTaskZS); this._invokeTaskDlgt = zoneSpec && (zoneSpec.onInvokeTask ? parentDelegate : parentDelegate._invokeTaskDlgt); this._invokeTaskCurrZone = zoneSpec && (zoneSpec.onInvokeTask ? this._zone : parentDelegate._invokeTaskCurrZone); this._cancelTaskZS = zoneSpec && (zoneSpec.onCancelTask ? zoneSpec : parentDelegate._cancelTaskZS); this._cancelTaskDlgt = zoneSpec && (zoneSpec.onCancelTask ? parentDelegate : parentDelegate._cancelTaskDlgt); this._cancelTaskCurrZone = zoneSpec && (zoneSpec.onCancelTask ? this._zone : parentDelegate._cancelTaskCurrZone); this._hasTaskZS = null; this._hasTaskDlgt = null; this._hasTaskDlgtOwner = null; this._hasTaskCurrZone = null; const zoneSpecHasTask = zoneSpec && zoneSpec.onHasTask; const parentHasTask = parentDelegate && parentDelegate._hasTaskZS; if (zoneSpecHasTask || parentHasTask) { // If we need to report hasTask, than this ZS needs to do ref counting on tasks. In such // a case all task related interceptors must go through this ZD. We can't short circuit it. this._hasTaskZS = zoneSpecHasTask ? zoneSpec : DELEGATE_ZS; this._hasTaskDlgt = parentDelegate; this._hasTaskDlgtOwner = this; this._hasTaskCurrZone = this._zone; if (!zoneSpec.onScheduleTask) { this._scheduleTaskZS = DELEGATE_ZS; this._scheduleTaskDlgt = parentDelegate; this._scheduleTaskCurrZone = this._zone; } if (!zoneSpec.onInvokeTask) { this._invokeTaskZS = DELEGATE_ZS; this._invokeTaskDlgt = parentDelegate; this._invokeTaskCurrZone = this._zone; } if (!zoneSpec.onCancelTask) { this._cancelTaskZS = DELEGATE_ZS; this._cancelTaskDlgt = parentDelegate; this._cancelTaskCurrZone = this._zone; } } } fork(targetZone, zoneSpec) { return this._forkZS ? this._forkZS.onFork(this._forkDlgt, this.zone, targetZone, zoneSpec) : new ZoneImpl(targetZone, zoneSpec); } intercept(targetZone, callback, source) { return this._interceptZS ? this._interceptZS.onIntercept(this._interceptDlgt, this._interceptCurrZone, targetZone, callback, source) : callback; } invoke(targetZone, callback, applyThis, applyArgs, source) { return this._invokeZS ? this._invokeZS.onInvoke(this._invokeDlgt, this._invokeCurrZone, targetZone, callback, applyThis, applyArgs, source) : callback.apply(applyThis, applyArgs); } handleError(targetZone, error) { return this._handleErrorZS ? this._handleErrorZS.onHandleError(this._handleErrorDlgt, this._handleErrorCurrZone, targetZone, error) : true; } scheduleTask(targetZone, task) { let returnTask = task; if (this._scheduleTaskZS) { if (this._hasTaskZS) { returnTask._zoneDelegates.push(this._hasTaskDlgtOwner); } returnTask = this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this._scheduleTaskCurrZone, targetZone, task); if (!returnTask) returnTask = task; } else { if (task.scheduleFn) { task.scheduleFn(task); } else if (task.type == microTask) { scheduleMicroTask(task); } else { throw new Error('Task is missing scheduleFn.'); } } return returnTask; } invokeTask(targetZone, task, applyThis, applyArgs) { return this._invokeTaskZS ? this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt, this._invokeTaskCurrZone, targetZone, task, applyThis, applyArgs) : task.callback.apply(applyThis, applyArgs); } cancelTask(targetZone, task) { let value; if (this._cancelTaskZS) { value = this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt, this._cancelTaskCurrZone, targetZone, task); } else { if (!task.cancelFn) { throw Error('Task is not cancelable'); } value = task.cancelFn(task); } return value; } hasTask(targetZone, isEmpty) { // hasTask should not throw error so other ZoneDelegate // can still trigger hasTask callback try { this._hasTaskZS && this._hasTaskZS.onHasTask(this._hasTaskDlgt, this._hasTaskCurrZone, targetZone, isEmpty); } catch (err) { this.handleError(targetZone, err); } } _updateTaskCount(type, count) { const counts = this._taskCounts; const prev = counts[type]; const next = (counts[type] = prev + count); if (next < 0) { throw new Error('More tasks executed then were scheduled.'); } if (prev == 0 || next == 0) { const isEmpty = { microTask: counts['microTask'] > 0, macroTask: counts['macroTask'] > 0, eventTask: counts['eventTask'] > 0, change: type, }; this.hasTask(this._zone, isEmpty); } } } class ZoneTask { type; source; invoke; callback; data; scheduleFn; cancelFn; _zone = null; runCount = 0; _zoneDelegates = null; _state = 'notScheduled'; constructor(type, source, callback, options, scheduleFn, cancelFn) { this.type = type; this.source = source; this.data = options; this.scheduleFn = scheduleFn; this.cancelFn = cancelFn; if (!callback) { throw new Error('callback is not defined'); } this.callback = callback; const self = this; // TODO: @JiaLiPassion options should have interface if (type === eventTask && options && options.useG) { this.invoke = ZoneTask.invokeTask; } else { this.invoke = function () { return ZoneTask.invokeTask.call(global, self, this, arguments); }; } } static invokeTask(task, target, args) { if (!task) { task = this; } _numberOfNestedTaskFrames++; try { task.runCount++; return task.zone.runTask(task, target, args); } finally { if (_numberOfNestedTaskFrames == 1) { drainMicroTaskQueue(); } _numberOfNestedTaskFrames--; } } get zone() { return this._zone; } get state() { return this._state; } cancelScheduleRequest() { this._transitionTo(notScheduled, scheduling); } _transitionTo(toState, fromState1, fromState2) { if (this._state === fromState1 || this._state === fromState2) { this._state = toState; if (toState == notScheduled) { this._zoneDelegates = null; } } else { throw new Error(`${this.type} '${this.source}': can not transition to '${toState}', expecting state '${fromState1}'${fromState2 ? " or '" + fromState2 + "'" : ''}, was '${this._state}'.`); } } toString() { if (this.data && typeof this.data.handleId !== 'undefined') { return this.data.handleId.toString(); } else { return Object.prototype.toString.call(this); } } // add toJSON method to prevent cyclic error when // call JSON.stringify(zoneTask) toJSON() { return { type: this.type, state: this.state, source: this.source, zone: this.zone.name, runCount: this.runCount, }; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// MICROTASK QUEUE ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const symbolSetTimeout = __symbol__('setTimeout'); const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); let _microTaskQueue = []; let _isDrainingMicrotaskQueue = false; let nativeMicroTaskQueuePromise; function nativeScheduleMicroTask(func) { if (!nativeMicroTaskQueuePromise) { if (global[symbolPromise]) { nativeMicroTaskQueuePromise = global[symbolPromise].resolve(0); } } if (nativeMicroTaskQueuePromise) { let nativeThen = nativeMicroTaskQueuePromise[symbolThen]; if (!nativeThen) { // native Promise is not patchable, we need to use `then` directly // issue 1078 nativeThen = nativeMicroTaskQueuePromise['then']; } nativeThen.call(nativeMicroTaskQueuePromise, func); } else { global[symbolSetTimeout](func, 0); } } function scheduleMicroTask(task) { // if we are not running in any task, and there has not been anything scheduled // we must bootstrap the initial task creation by manually scheduling the drain if (_numberOfNestedTaskFrames === 0 && _microTaskQueue.length === 0) { // We are not running in Task, so we need to kickstart the microtask queue. nativeScheduleMicroTask(drainMicroTaskQueue); } task && _microTaskQueue.push(task); } function drainMicroTaskQueue() { if (!_isDrainingMicrotaskQueue) { _isDrainingMicrotaskQueue = true; while (_microTaskQueue.length) { const queue = _microTaskQueue; _microTaskQueue = []; for (let i = 0; i < queue.length; i++) { const task = queue[i]; try { task.zone.runTask(task, null, null); } catch (error) { _api.onUnhandledError(error); } } } _api.microtaskDrainDone(); _isDrainingMicrotaskQueue = false; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// BOOTSTRAP ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const NO_ZONE = { name: 'NO ZONE' }; const notScheduled = 'notScheduled', scheduling = 'scheduling', scheduled = 'scheduled', running = 'running', canceling = 'canceling', unknown = 'unknown'; const microTask = 'microTask', macroTask = 'macroTask', eventTask = 'eventTask'; const patches = {}; const _api = { symbol: __symbol__, currentZoneFrame: () => _currentZoneFrame, onUnhandledError: noop, microtaskDrainDone: noop, scheduleMicroTask: scheduleMicroTask, showUncaughtError: () => !ZoneImpl[__symbol__('ignoreConsoleErrorUncaughtError')], patchEventTarget: () => [], patchOnProperties: noop, patchMethod: () => noop, bindArguments: () => [], patchThen: () => noop, patchMacroTask: () => noop, patchEventPrototype: () => noop, isIEOrEdge: () => false, getGlobalObjects: () => undefined, ObjectDefineProperty: () => noop, ObjectGetOwnPropertyDescriptor: () => undefined, ObjectCreate: () => undefined, ArraySlice: () => [], patchClass: () => noop, wrapWithCurrentZone: () => noop, filterProperties: () => [], attachOriginToPatched: () => noop, _redefineProperty: () => noop, patchCallbacks: () => noop, nativeScheduleMicroTask: nativeScheduleMicroTask, }; let _currentZoneFrame = { parent: null, zone: new ZoneImpl(null, null) }; let _currentTask = null; let _numberOfNestedTaskFrames = 0; function noop() { } performanceMeasure('Zone', 'Zone'); return ZoneImpl; } /** * Suppress closure compiler errors about unknown 'Zone' variable * @fileoverview * @suppress {undefinedVars,globalThis,missingRequire} */ /// // issue #989, to reduce bundle size, use short name /** Object.getOwnPropertyDescriptor */ const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; /** Object.defineProperty */ const ObjectDefineProperty = Object.defineProperty; /** Object.getPrototypeOf */ const ObjectGetPrototypeOf = Object.getPrototypeOf; /** Array.prototype.slice */ const ArraySlice = Array.prototype.slice; /** addEventListener string const */ const ADD_EVENT_LISTENER_STR = 'addEventListener'; /** removeEventListener string const */ const REMOVE_EVENT_LISTENER_STR = 'removeEventListener'; /** true string const */ const TRUE_STR = 'true'; /** false string const */ const FALSE_STR = 'false'; /** Zone symbol prefix string const. */ const ZONE_SYMBOL_PREFIX = __symbol__(''); function wrapWithCurrentZone(callback, source) { return Zone.current.wrap(callback, source); } function scheduleMacroTaskWithCurrentZone(source, callback, data, customSchedule, customCancel) { return Zone.current.scheduleMacroTask(source, callback, data, customSchedule, customCancel); } const zoneSymbol = __symbol__; const isWindowExists = typeof window !== 'undefined'; const internalWindow = isWindowExists ? window : undefined; const _global = (isWindowExists && internalWindow) || globalThis; const REMOVE_ATTRIBUTE = 'removeAttribute'; function bindArguments(args, source) { for (let i = args.length - 1; i >= 0; i--) { if (typeof args[i] === 'function') { args[i] = wrapWithCurrentZone(args[i], source + '_' + i); } } return args; } function isPropertyWritable(propertyDesc) { if (!propertyDesc) { return true; } if (propertyDesc.writable === false) { return false; } return !(typeof propertyDesc.get === 'function' && typeof propertyDesc.set === 'undefined'); } const isWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope; // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isNode = !('nw' in _global) && typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]'; const isBrowser = !isNode && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); // we are in electron of nw, so we are both browser and nodejs // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isMix = typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]' && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); const zoneSymbolEventNames$1 = {}; const enableBeforeunloadSymbol = zoneSymbol('enable_beforeunload'); const wrapFn = function (event) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } let eventNameSymbol = zoneSymbolEventNames$1[event.type]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[event.type] = zoneSymbol('ON_PROPERTY' + event.type); } const target = this || event.target || _global; const listener = target[eventNameSymbol]; let result; if (isBrowser && target === internalWindow && event.type === 'error') { // window.onerror have different signature // https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror#window.onerror // and onerror callback will prevent default when callback return true const errorEvent = event; result = listener && listener.call(this, errorEvent.message, errorEvent.filename, errorEvent.lineno, errorEvent.colno, errorEvent.error); if (result === true) { event.preventDefault(); } } else { result = listener && listener.apply(this, arguments); if ( // https://github.com/angular/angular/issues/47579 // https://www.w3.org/TR/2011/WD-html5-20110525/history.html#beforeunloadevent // This is the only specific case we should check for. The spec defines that the // `returnValue` attribute represents the message to show the user. When the event // is created, this attribute must be set to the empty string. event.type === 'beforeunload' && // To prevent any breaking changes resulting from this change, given that // it was already causing a significant number of failures in G3, we have hidden // that behavior behind a global configuration flag. Consumers can enable this // flag explicitly if they want the `beforeunload` event to be handled as defined // in the specification. _global[enableBeforeunloadSymbol] && // The IDL event definition is `attribute DOMString returnValue`, so we check whether // `typeof result` is a string. typeof result === 'string') { event.returnValue = result; } else if (result != undefined && !result) { event.preventDefault(); } } return result; }; function patchProperty(obj, prop, prototype) { let desc = ObjectGetOwnPropertyDescriptor(obj, prop); if (!desc && prototype) { // when patch window object, use prototype to check prop exist or not const prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, prop); if (prototypeDesc) { desc = { enumerable: true, configurable: true }; } } // if the descriptor not exists or is not configurable // just return if (!desc || !desc.configurable) { return; } const onPropPatchedSymbol = zoneSymbol('on' + prop + 'patched'); if (obj.hasOwnProperty(onPropPatchedSymbol) && obj[onPropPatchedSymbol]) { return; } // A property descriptor cannot have getter/setter and be writable // deleting the writable and value properties avoids this error: // // TypeError: property descriptors must not specify a value or be writable when a // getter or setter has been specified delete desc.writable; delete desc.value; const originalDescGet = desc.get; const originalDescSet = desc.set; // slice(2) cuz 'onclick' -> 'click', etc const eventName = prop.slice(2); let eventNameSymbol = zoneSymbolEventNames$1[eventName]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[eventName] = zoneSymbol('ON_PROPERTY' + eventName); } desc.set = function (newValue) { // In some versions of Windows, the `this` context may be undefined // in on-property callbacks. // To handle this edge case, we check if `this` is falsy and // fallback to `_global` if needed. let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return; } const previousValue = target[eventNameSymbol]; if (typeof previousValue === 'function') { target.removeEventListener(eventName, wrapFn); } // https://github.com/angular/zone.js/issues/978 // If an inline handler (like `onload`) was defined before zone.js was loaded, // call the original descriptor's setter to clean it up. originalDescSet?.call(target, null); target[eventNameSymbol] = newValue; if (typeof newValue === 'function') { target.addEventListener(eventName, wrapFn, false); } }; // The getter would return undefined for unassigned properties but the default value of an // unassigned property is null desc.get = function () { // in some of windows's onproperty callback, this is undefined // so we need to check it let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return null; } const listener = target[eventNameSymbol]; if (listener) { return listener; } else if (originalDescGet) { // result will be null when use inline event attribute, // such as // because the onclick function is internal raw uncompiled handler // the onclick will be evaluated when first time event was triggered or // the property is accessed, https://github.com/angular/zone.js/issues/525 // so we should use original native get to retrieve the handler let value = originalDescGet.call(this); if (value) { desc.set.call(this, value); if (typeof target[REMOVE_ATTRIBUTE] === 'function') { target.removeAttribute(prop); } return value; } } return null; }; ObjectDefineProperty(obj, prop, desc); obj[onPropPatchedSymbol] = true; } function patchOnProperties(obj, properties, prototype) { if (properties) { for (let i = 0; i < properties.length; i++) { patchProperty(obj, 'on' + properties[i], prototype); } } else { const onProperties = []; for (const prop in obj) { if (prop.slice(0, 2) == 'on') { onProperties.push(prop); } } for (let j = 0; j < onProperties.length; j++) { patchProperty(obj, onProperties[j], prototype); } } } function copySymbolProperties(src, dest) { if (typeof Object.getOwnPropertySymbols !== 'function') { return; } const symbols = Object.getOwnPropertySymbols(src); symbols.forEach((symbol) => { const desc = Object.getOwnPropertyDescriptor(src, symbol); Object.defineProperty(dest, symbol, { get: function () { return src[symbol]; }, set: function (value) { if (desc && (!desc.writable || typeof desc.set !== 'function')) { // if src[symbol] is not writable or not have a setter, just return return; } src[symbol] = value; }, enumerable: desc ? desc.enumerable : true, configurable: desc ? desc.configurable : true, }); }); } let shouldCopySymbolProperties = false; function setShouldCopySymbolProperties(flag) { shouldCopySymbolProperties = flag; } function patchMethod(target, name, patchFn) { let proto = target; while (proto && !proto.hasOwnProperty(name)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && target[name]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = target; } const delegateName = zoneSymbol(name); let delegate = null; if (proto && (!(delegate = proto[delegateName]) || !proto.hasOwnProperty(delegateName))) { delegate = proto[delegateName] = proto[name]; // check whether proto[name] is writable // some property is readonly in safari, such as HtmlCanvasElement.prototype.toBlob const desc = proto && ObjectGetOwnPropertyDescriptor(proto, name); if (isPropertyWritable(desc)) { const patchDelegate = patchFn(delegate, delegateName, name); proto[name] = function () { return patchDelegate(this, arguments); }; attachOriginToPatched(proto[name], delegate); if (shouldCopySymbolProperties) { copySymbolProperties(delegate, proto[name]); } } } return delegate; } // TODO: @JiaLiPassion, support cancel task later if necessary function patchMacroTask(obj, funcName, metaCreator) { let setNative = null; function scheduleTask(task) { const data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, (delegate) => function (self, args) { const meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return scheduleMacroTaskWithCurrentZone(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }); } function patchMicroTask(obj, funcName, metaCreator) { let setNative = null; function scheduleTask(task) { const data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, (delegate) => function (self, args) { const meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return Zone.current.scheduleMicroTask(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }); } function attachOriginToPatched(patched, original) { patched[zoneSymbol('OriginalDelegate')] = original; } function isFunction(value) { return typeof value === 'function'; } function isNumber(value) { return typeof value === 'number'; } function patchPromise(Zone) { Zone.__load_patch('ZoneAwarePromise', (global, Zone, api) => { const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; const ObjectDefineProperty = Object.defineProperty; function readableObjectToString(obj) { if (obj && obj.toString === Object.prototype.toString) { const className = obj.constructor && obj.constructor.name; return (className ? className : '') + ': ' + JSON.stringify(obj); } return obj ? obj.toString() : Object.prototype.toString.call(obj); } const __symbol__ = api.symbol; const _uncaughtPromiseErrors = []; const isDisableWrappingUncaughtPromiseRejection = global[__symbol__('DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION')] !== false; const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); const creationTrace = '__creationTrace__'; api.onUnhandledError = (e) => { if (api.showUncaughtError()) { const rejection = e && e.rejection; if (rejection) { console.error('Unhandled Promise rejection:', rejection instanceof Error ? rejection.message : rejection, '; Zone:', e.zone.name, '; Task:', e.task && e.task.source, '; Value:', rejection, rejection instanceof Error ? rejection.stack : undefined); } else { console.error(e); } } }; api.microtaskDrainDone = () => { while (_uncaughtPromiseErrors.length) { const uncaughtPromiseError = _uncaughtPromiseErrors.shift(); try { uncaughtPromiseError.zone.runGuarded(() => { if (uncaughtPromiseError.throwOriginal) { throw uncaughtPromiseError.rejection; } throw uncaughtPromiseError; }); } catch (error) { handleUnhandledRejection(error); } } }; const UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL = __symbol__('unhandledPromiseRejectionHandler'); function handleUnhandledRejection(e) { api.onUnhandledError(e); try { const handler = Zone[UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL]; if (typeof handler === 'function') { handler.call(this, e); } } catch (err) { } } function isThenable(value) { return value && typeof value.then === 'function'; } function forwardResolution(value) { return value; } function forwardRejection(rejection) { return ZoneAwarePromise.reject(rejection); } const symbolState = __symbol__('state'); const symbolValue = __symbol__('value'); const symbolFinally = __symbol__('finally'); const symbolParentPromiseValue = __symbol__('parentPromiseValue'); const symbolParentPromiseState = __symbol__('parentPromiseState'); const source = 'Promise.then'; const UNRESOLVED = null; const RESOLVED = true; const REJECTED = false; const REJECTED_NO_CATCH = 0; function makeResolver(promise, state) { return (v) => { try { resolvePromise(promise, state, v); } catch (err) { resolvePromise(promise, false, err); } // Do not return value or you will break the Promise spec. }; } const once = function () { let wasCalled = false; return function wrapper(wrappedFunction) { return function () { if (wasCalled) { return; } wasCalled = true; wrappedFunction.apply(null, arguments); }; }; }; const TYPE_ERROR = 'Promise resolved with itself'; const CURRENT_TASK_TRACE_SYMBOL = __symbol__('currentTaskTrace'); // Promise Resolution function resolvePromise(promise, state, value) { const onceWrapper = once(); if (promise === value) { throw new TypeError(TYPE_ERROR); } if (promise[symbolState] === UNRESOLVED) { // should only get value.then once based on promise spec. let then = null; try { if (typeof value === 'object' || typeof value === 'function') { then = value && value.then; } } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); return promise; } // if (value instanceof ZoneAwarePromise) { if (state !== REJECTED && value instanceof ZoneAwarePromise && value.hasOwnProperty(symbolState) && value.hasOwnProperty(symbolValue) && value[symbolState] !== UNRESOLVED) { clearRejectedNoCatch(value); resolvePromise(promise, value[symbolState], value[symbolValue]); } else if (state !== REJECTED && typeof then === 'function') { try { then.call(value, onceWrapper(makeResolver(promise, state)), onceWrapper(makeResolver(promise, false))); } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); } } else { promise[symbolState] = state; const queue = promise[symbolValue]; promise[symbolValue] = value; if (promise[symbolFinally] === symbolFinally) { // the promise is generated by Promise.prototype.finally if (state === RESOLVED) { // the state is resolved, should ignore the value // and use parent promise value promise[symbolState] = promise[symbolParentPromiseState]; promise[symbolValue] = promise[symbolParentPromiseValue]; } } // record task information in value when error occurs, so we can // do some additional work such as render longStackTrace if (state === REJECTED && value instanceof Error) { // check if longStackTraceZone is here const trace = Zone.currentTask && Zone.currentTask.data && Zone.currentTask.data[creationTrace]; if (trace) { // only keep the long stack trace into error when in longStackTraceZone ObjectDefineProperty(value, CURRENT_TASK_TRACE_SYMBOL, { configurable: true, enumerable: false, writable: true, value: trace, }); } } for (let i = 0; i < queue.length;) { scheduleResolveOrReject(promise, queue[i++], queue[i++], queue[i++], queue[i++]); } if (queue.length == 0 && state == REJECTED) { promise[symbolState] = REJECTED_NO_CATCH; let uncaughtPromiseError = value; try { // Here we throws a new Error to print more readable error log // and if the value is not an error, zone.js builds an `Error` // Object here to attach the stack information. throw new Error('Uncaught (in promise): ' + readableObjectToString(value) + (value && value.stack ? '\n' + value.stack : '')); } catch (err) { uncaughtPromiseError = err; } if (isDisableWrappingUncaughtPromiseRejection) { // If disable wrapping uncaught promise reject // use the value instead of wrapping it. uncaughtPromiseError.throwOriginal = true; } uncaughtPromiseError.rejection = value; uncaughtPromiseError.promise = promise; uncaughtPromiseError.zone = Zone.current; uncaughtPromiseError.task = Zone.currentTask; _uncaughtPromiseErrors.push(uncaughtPromiseError); api.scheduleMicroTask(); // to make sure that it is running } } } // Resolving an already resolved promise is a noop. return promise; } const REJECTION_HANDLED_HANDLER = __symbol__('rejectionHandledHandler'); function clearRejectedNoCatch(promise) { if (promise[symbolState] === REJECTED_NO_CATCH) { // if the promise is rejected no catch status // and queue.length > 0, means there is a error handler // here to handle the rejected promise, we should trigger // windows.rejectionhandled eventHandler or nodejs rejectionHandled // eventHandler try { const handler = Zone[REJECTION_HANDLED_HANDLER]; if (handler && typeof handler === 'function') { handler.call(this, { rejection: promise[symbolValue], promise: promise }); } } catch (err) { } promise[symbolState] = REJECTED; for (let i = 0; i < _uncaughtPromiseErrors.length; i++) { if (promise === _uncaughtPromiseErrors[i].promise) { _uncaughtPromiseErrors.splice(i, 1); } } } } function scheduleResolveOrReject(promise, zone, chainPromise, onFulfilled, onRejected) { clearRejectedNoCatch(promise); const promiseState = promise[symbolState]; const delegate = promiseState ? typeof onFulfilled === 'function' ? onFulfilled : forwardResolution : typeof onRejected === 'function' ? onRejected : forwardRejection; zone.scheduleMicroTask(source, () => { try { const parentPromiseValue = promise[symbolValue]; const isFinallyPromise = !!chainPromise && symbolFinally === chainPromise[symbolFinally]; if (isFinallyPromise) { // if the promise is generated from finally call, keep parent promise's state and value chainPromise[symbolParentPromiseValue] = parentPromiseValue; chainPromise[symbolParentPromiseState] = promiseState; } // should not pass value to finally callback const value = zone.run(delegate, undefined, isFinallyPromise && delegate !== forwardRejection && delegate !== forwardResolution ? [] : [parentPromiseValue]); resolvePromise(chainPromise, true, value); } catch (error) { // if error occurs, should always return this error resolvePromise(chainPromise, false, error); } }, chainPromise); } const ZONE_AWARE_PROMISE_TO_STRING = 'function ZoneAwarePromise() { [native code] }'; const noop = function () { }; const AggregateError = global.AggregateError; class ZoneAwarePromise { static toString() { return ZONE_AWARE_PROMISE_TO_STRING; } static resolve(value) { if (value instanceof ZoneAwarePromise) { return value; } return resolvePromise(new this(null), RESOLVED, value); } static reject(error) { return resolvePromise(new this(null), REJECTED, error); } static withResolvers() { const result = {}; result.promise = new ZoneAwarePromise((res, rej) => { result.resolve = res; result.reject = rej; }); return result; } static any(values) { if (!values || typeof values[Symbol.iterator] !== 'function') { return Promise.reject(new AggregateError([], 'All promises were rejected')); } const promises = []; let count = 0; try { for (let v of values) { count++; promises.push(ZoneAwarePromise.resolve(v)); } } catch (err) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } if (count === 0) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } let finished = false; const errors = []; return new ZoneAwarePromise((resolve, reject) => { for (let i = 0; i < promises.length; i++) { promises[i].then((v) => { if (finished) { return; } finished = true; resolve(v); }, (err) => { errors.push(err); count--; if (count === 0) { finished = true; reject(new AggregateError(errors, 'All promises were rejected')); } }); } }); } static race(values) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); function onResolve(value) { resolve(value); } function onReject(error) { reject(error); } for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } value.then(onResolve, onReject); } return promise; } static all(values) { return ZoneAwarePromise.allWithCallback(values); } static allSettled(values) { const P = this && this.prototype instanceof ZoneAwarePromise ? this : ZoneAwarePromise; return P.allWithCallback(values, { thenCallback: (value) => ({ status: 'fulfilled', value }), errorCallback: (err) => ({ status: 'rejected', reason: err }), }); } static allWithCallback(values, callback) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); // Start at 2 to prevent prematurely resolving if .then is called immediately. let unresolvedCount = 2; let valueIndex = 0; const resolvedValues = []; for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } const curValueIndex = valueIndex; try { value.then((value) => { resolvedValues[curValueIndex] = callback ? callback.thenCallback(value) : value; unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } }, (err) => { if (!callback) { reject(err); } else { resolvedValues[curValueIndex] = callback.errorCallback(err); unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } } }); } catch (thenErr) { reject(thenErr); } unresolvedCount++; valueIndex++; } // Make the unresolvedCount zero-based again. unresolvedCount -= 2; if (unresolvedCount === 0) { resolve(resolvedValues); } return promise; } constructor(executor) { const promise = this; if (!(promise instanceof ZoneAwarePromise)) { throw new Error('Must be an instanceof Promise.'); } promise[symbolState] = UNRESOLVED; promise[symbolValue] = []; // queue; try { const onceWrapper = once(); executor && executor(onceWrapper(makeResolver(promise, RESOLVED)), onceWrapper(makeResolver(promise, REJECTED))); } catch (error) { resolvePromise(promise, false, error); } } get [Symbol.toStringTag]() { return 'Promise'; } get [Symbol.species]() { return ZoneAwarePromise; } then(onFulfilled, onRejected) { // We must read `Symbol.species` safely because `this` may be anything. For instance, `this` // may be an object without a prototype (created through `Object.create(null)`); thus // `this.constructor` will be undefined. One of the use cases is SystemJS creating // prototype-less objects (modules) via `Object.create(null)`. The SystemJS creates an empty // object and copies promise properties into that object (within the `getOrCreateLoad` // function). The zone.js then checks if the resolved value has the `then` method and // invokes it with the `value` context. Otherwise, this will throw an error: `TypeError: // Cannot read properties of undefined (reading 'Symbol(Symbol.species)')`. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = this.constructor || ZoneAwarePromise; } const chainPromise = new C(noop); const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFulfilled, onRejected); } else { scheduleResolveOrReject(this, zone, chainPromise, onFulfilled, onRejected); } return chainPromise; } catch(onRejected) { return this.then(null, onRejected); } finally(onFinally) { // See comment on the call to `then` about why thee `Symbol.species` is safely accessed. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = ZoneAwarePromise; } const chainPromise = new C(noop); chainPromise[symbolFinally] = symbolFinally; const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFinally, onFinally); } else { scheduleResolveOrReject(this, zone, chainPromise, onFinally, onFinally); } return chainPromise; } } // Protect against aggressive optimizers dropping seemingly unused properties. // E.g. Closure Compiler in advanced mode. ZoneAwarePromise['resolve'] = ZoneAwarePromise.resolve; ZoneAwarePromise['reject'] = ZoneAwarePromise.reject; ZoneAwarePromise['race'] = ZoneAwarePromise.race; ZoneAwarePromise['all'] = ZoneAwarePromise.all; const NativePromise = (global[symbolPromise] = global['Promise']); global['Promise'] = ZoneAwarePromise; const symbolThenPatched = __symbol__('thenPatched'); function patchThen(Ctor) { const proto = Ctor.prototype; const prop = ObjectGetOwnPropertyDescriptor(proto, 'then'); if (prop && (prop.writable === false || !prop.configurable)) { // check Ctor.prototype.then propertyDescriptor is writable or not // in meteor env, writable is false, we should ignore such case return; } const originalThen = proto.then; // Keep a reference to the original method. proto[symbolThen] = originalThen; Ctor.prototype.then = function (onResolve, onReject) { const wrapped = new ZoneAwarePromise((resolve, reject) => { originalThen.call(this, resolve, reject); }); return wrapped.then(onResolve, onReject); }; Ctor[symbolThenPatched] = true; } api.patchThen = patchThen; function zoneify(fn) { return function (self, args) { let resultPromise = fn.apply(self, args); if (resultPromise instanceof ZoneAwarePromise) { KԴ+ return resultPromise; } let ctor = resultPromise.constructor; if (!ctor[symbolThenPatched]) { patchThen(ctor); } return resultPromise; }; } if (NativePromise) { patchThen(NativePromise); patchMethod(global, 'fetch', (delegate) => zoneify(delegate)); } // This is not part of public API, but it is useful for tests, so we expose it. Promise[Zone.__symbol__('uncaughtPromiseErrors')] = _uncaughtPromiseErrors; return ZoneAwarePromise; }); } function patchToString(Zone) { // override Function.prototype.toString to make zone.js patched function // look like native function Zone.__load_patch('toString', (global) => { // patch Func.prototype.toString to let them look like native const originalFunctionToString = Function.prototype.toString; const ORIGINAL_DELEGATE_SYMBOL = zoneSymbol('OriginalDelegate'); const PROMISE_SYMBOL = zoneSymbol('Promise'); const ERROR_SYMBOL = zoneSymbol('Error'); const newFunctionToString = function toString() { if (typeof this === 'function') { const originalDelegate = this[ORIGINAL_DELEGATE_SYMBOL]; if (originalDelegate) { if (typeof originalDelegate === 'function') { return originalFunctionToString.call(originalDelegate); } else { return Object.prototype.toString.call(originalDelegate); } } if (this === Promise) { const nativePromise = global[PROMISE_SYMBOL]; if (nativePromise) { return originalFunctionToString.call(nativePromise); } } if (this === Error) { const nativeError = global[ERROR_SYMBOL]; if (nativeError) { return originalFunctionToString.call(nativeError); } } } return originalFunctionToString.call(this); }; newFunctionToString[ORIGINAL_DELEGATE_SYMBOL] = originalFunctionToString; Function.prototype.toString = newFunctionToString; // patch Object.prototype.toString to let them look like native const originalObjectToString = Object.prototype.toString; const PROMISE_OBJECT_TO_STRING = '[object Promise]'; Object.prototype.toString = function () { if (typeof Promise === 'function' && this instanceof Promise) { return PROMISE_OBJECT_TO_STRING; } return originalObjectToString.call(this); }; }); } function loadZone() { // if global['Zone'] already exists (maybe zone.js was already loaded or // some other lib also registered a global object named Zone), we may need // to throw an error, but sometimes user may not want this error. // For example, // we have two web pages, page1 includes zone.js, page2 doesn't. // and the 1st time user load page1 and page2, everything work fine, // but when user load page2 again, error occurs because global['Zone'] already exists. // so we add a flag to let user choose whether to throw this error or not. // By default, if existing Zone is from zone.js, we will not throw the error. const global = globalThis; const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (global['Zone'] && (checkDuplicate || typeof global['Zone'].__symbol__ !== 'function')) { throw new Error('Zone already loaded.'); } // Initialize global `Zone` constant. global['Zone'] ??= initZone(); return global['Zone']; } /** * @fileoverview * @suppress {missingRequire} */ // an identifier to tell ZoneTask do not create a new invoke closure const OPTIMIZED_ZONE_EVENT_TASK_DATA = { useG: true, }; const zoneSymbolEventNames = {}; const globalSources = {}; const EVENT_NAME_SYMBOL_REGX = new RegExp('^' + ZONE_SYMBOL_PREFIX + '(\\w+)(true|false)$'); const IMMEDIATE_PROPAGATION_SYMBOL = zoneSymbol('propagationStopped'); function prepareEventNames(eventName, eventNameToString) { const falseEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + FALSE_STR; const trueEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } function patchEventTarget(_global, api, apis, patchOptions) { const ADD_EVENT_LISTENER = (patchOptions && patchOptions.add) || ADD_EVENT_LISTENER_STR; const REMOVE_EVENT_LISTENER = (patchOptions && patchOptions.rm) || REMOVE_EVENT_LISTENER_STR; const LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.listeners) || 'eventListeners'; const REMOVE_ALL_LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.rmAll) || 'removeAllListeners'; const zoneSymbolAddEventListener = zoneSymbol(ADD_EVENT_LISTENER); const ADD_EVENT_LISTENER_SOURCE = '.' + ADD_EVENT_LISTENER + ':'; const PREPEND_EVENT_LISTENER = 'prependListener'; const PREPEND_EVENT_LISTENER_SOURCE = '.' + PREPEND_EVENT_LISTENER + ':'; const invokeTask = function (task, target, event) { // for better performance, check isRemoved which is set // by removeEventListener if (task.isRemoved) { return; } const delegate = task.callback; if (typeof delegate === 'object' && delegate.handleEvent) { // create the bind version of handleEvent when invoke task.callback = (event) => delegate.handleEvent(event); task.originalDelegate = delegate; } // invoke static task.invoke // need to try/catch error here, otherwise, the error in one event listener // will break the executions of the other event listeners. Also error will // not remove the event listener when `once` options is true. let error; try { task.invoke(task, target, [event]); } catch (err) { error = err; } const options = task.options; if (options && typeof options === 'object' && options.once) { // if options.once is true, after invoke once remove listener here // only browser need to do this, nodejs eventEmitter will cal removeListener // inside EventEmitter.once const delegate = task.originalDelegate ? task.originalDelegate : task.callback; target[REMOVE_EVENT_LISTENER].call(target, event.type, delegate, options); } return error; }; function globalCallback(context, event, isCapture) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } // event.target is needed for Samsung TV and SourceBuffer // || global is needed https://github.com/angular/zone.js/issues/190 const target = context || event.target || _global; const tasks = target[zoneSymbolEventNames[event.type][isCapture ? TRUE_STR : FALSE_STR]]; if (tasks) { const errors = []; // invoke all tasks which attached to current target with given event.type and capture = false // for performance concern, if task.length === 1, just invoke if (tasks.length === 1) { const err = invokeTask(tasks[0], target, event); err && errors.push(err); } else { // https://github.com/angular/zone.js/issues/836 // copy the tasks array before invoke, to avoid // the callback will remove itself or other listener const copyTasks = tasks.slice(); for (let i = 0; i < copyTasks.length; i++) { if (event && event[IMMEDIATE_PROPAGATION_SYMBOL] === true) { break; } const err = invokeTask(copyTasks[i], target, event); err && errors.push(err); } } // Since there is only one error, we don't need to schedule microTask // to throw the error. if (errors.length === 1) { throw errors[0]; } else { for (let i = 0; i < errors.length; i++) { const err = errors[i]; api.nativeScheduleMicroTask(() => { throw err; }); } } } } // global shared zoneAwareCallback to handle all event callback with capture = false const globalZoneAwareCallback = function (event) { return globalCallback(this, event, false); }; // global shared zoneAwareCallback to handle all event callback with capture = true const globalZoneAwareCaptureCallback = function (event) { return globalCallback(this, event, true); }; function patchEventTargetMethods(obj, patchOptions) { if (!obj) { return false; } let useGlobalCallback = true; if (patchOptions && patchOptions.useG !== undefined) { useGlobalCallback = patchOptions.useG; } const validateHandler = patchOptions && patchOptions.vh; let checkDuplicate = true; if (patchOptions && patchOptions.chkDup !== undefined) { checkDuplicate = patchOptions.chkDup; } let returnTarget = false; if (patchOptions && patchOptions.rt !== undefined) { returnTarget = patchOptions.rt; } let proto = obj; while (proto && !proto.hasOwnProperty(ADD_EVENT_LISTENER)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && obj[ADD_EVENT_LISTENER]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = obj; } if (!proto) { return false; } if (proto[zoneSymbolAddEventListener]) { return false; } const eventNameToString = patchOptions && patchOptions.eventNameToString; // We use a shared global `taskData` to pass data for `scheduleEventTask`, // eliminating the need to create a new object solely for passing data. // WARNING: This object has a static lifetime, meaning it is not created // each time `addEventListener` is called. It is instantiated only once // and captured by reference inside the `addEventListener` and // `removeEventListener` functions. Do not add any new properties to this // object, as doing so would necessitate maintaining the information // between `addEventListener` calls. const taskData = {}; const nativeAddEventListener = (proto[zoneSymbolAddEventListener] = proto[ADD_EVENT_LISTENER]); const nativeRemoveEventListener = (proto[zoneSymbol(REMOVE_EVENT_LISTENER)] = proto[REMOVE_EVENT_LISTENER]); const nativeListeners = (proto[zoneSymbol(LISTENERS_EVENT_LISTENER)] = proto[LISTENERS_EVENT_LISTENER]); const nativeRemoveAllListeners = (proto[zoneSymbol(REMOVE_ALL_LISTENERS_EVENT_LISTENER)] = proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER]); let nativePrependEventListener; if (patchOptions && patchOptions.prepend) { nativePrependEventListener = proto[zoneSymbol(patchOptions.prepend)] = proto[patchOptions.prepend]; } /** * This util function will build an option object with passive option * to handle all possible input from the user. */ function buildEventListenerOptions(options, passive) { if (!passive) { return options; } if (typeof options === 'boolean') { return { capture: options, passive: true }; } if (!options) { return { passive: true }; } if (typeof options === 'object' && options.passive !== false) { return { ...options, passive: true }; } return options; } const customScheduleGlobal = function (task) { // if there is already a task for the eventName + capture, // just return, because we use the shared globalZoneAwareCallback here. if (taskData.isExisting) { return; } return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options); }; /** * In the context of events and listeners, this function will be * called at the end by `cancelTask`, which, in turn, calls `task.cancelFn`. * Cancelling a task is primarily used to remove event listeners from * the task target. */ const customCancelGlobal = function (task) { // if task is not marked as isRemoved, this call is directly // from Zone.prototype.cancelTask, we should remove the task // from tasksList of target first if (!task.isRemoved) { const symbolEventNames = zoneSymbolEventNames[task.eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[task.capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && task.target[symbolEventName]; if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (existingTask === task) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check task.isRemoved = true; if (task.removeAbortListener) { task.removeAbortListener(); task.removeAbortListener = null; } if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target task.allRemoved = true; task.target[symbolEventName] = null; } break; } } } } // if all tasks for the eventName + capture have gone, // we will really remove the global event callback, // if not, return if (!task.allRemoved) { return; } return nativeRemoveEventListener.call(task.target, task.eventName, task.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, task.options); }; const customScheduleNonGlobal = function (task) { return nativeAddEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customSchedulePrepend = function (task) { return nativePrependEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customCancelNonGlobal = function (task) { return nativeRemoveEventListener.call(task.target, task.eventName, task.invoke, task.options); }; const customSchedule = useGlobalCallback ? customScheduleGlobal : customScheduleNonGlobal; const customCancel = useGlobalCallback ? customCancelGlobal : customCancelNonGlobal; const compareTaskCallbackVsDelegate = function (task, delegate) { const typeOfDelegate = typeof delegate; return ((typeOfDelegate === 'function' && task.callback === delegate) || (typeOfDelegate === 'object' && task.originalDelegate === delegate)); }; const compare = patchOptions?.diff || compareTaskCallbackVsDelegate; const unpatchedEvents = Zone[zoneSymbol('UNPATCHED_EVENTS')]; const passiveEvents = _global[zoneSymbol('PASSIVE_EVENTS')]; function copyEventListenerOptions(options) { if (typeof options === 'object' && options !== null) { // We need to destructure the target `options` object since it may // be frozen or sealed (possibly provided implicitly by a third-party // library), or its properties may be readonly. const newOptions = { ...options }; // The `signal` option was recently introduced, which caused regressions in // third-party scenarios where `AbortController` was directly provided to // `addEventListener` as options. For instance, in cases like // `document.addEventListener('keydown', callback, abortControllerInstance)`, // which is valid because `AbortController` includes a `signal` getter, spreading // `{...options}` wouldn't copy the `signal`. Additionally, using `Object.create` // isn't feasible since `AbortController` is a built-in object type, and attempting // to create a new object directly with it as the prototype might result in // unexpected behavior. if (options.signal) { newOptions.signal = options.signal; } return newOptions; } return options; } const makeAddListener = function (nativeListener, addSource, customScheduleFn, customCancelFn, returnTarget = false, prepend = false) { return function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } let delegate = arguments[1]; if (!delegate) { return nativeListener.apply(this, arguments); } if (isNode && eventName === 'uncaughtException') { // don't patch uncaughtException of nodejs to prevent endless loop return nativeListener.apply(this, arguments); } // To improve `addEventListener` performance, we will create the callback // for the task later when the task is invoked. let isEventListenerObject = false; if (typeof delegate !== 'function') { // This checks whether the provided listener argument is an object with // a `handleEvent` method (since we can call `addEventListener` with a // function `event => ...` or with an object `{ handleEvent: event => ... }`). if (!delegate.handleEvent) { return nativeListener.apply(this, arguments); } isEventListenerObject = true; } if (validateHandler && !validateHandler(nativeListener, delegate, target, arguments)) { return; } const passive = !!passiveEvents && passiveEvents.indexOf(eventName) !== -1; const options = copyEventListenerOptions(buildEventListenerOptions(arguments[2], passive)); const signal = options?.signal; if (signal?.aborted) { // the signal is an aborted one, just return without attaching the event listener. return; } if (unpatchedEvents) { // check unpatched list for (let i = 0; i < unpatchedEvents.length; i++) { if (eventName === unpatchedEvents[i]) { if (passive) { return nativeListener.call(target, eventName, delegate, options); } else { return nativeListener.apply(this, arguments); } } } } const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const once = options && typeof options === 'object' ? options.once : false; const zone = Zone.current; let symbolEventNames = zoneSymbolEventNames[eventName]; if (!symbolEventNames) { prepareEventNames(eventName, eventNameToString); symbolEventNames = zoneSymbolEventNames[eventName]; } const symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; let existingTasks = target[symbolEventName]; let isExisting = false; if (existingTasks) { // already have task registered isExisting = true; if (checkDuplicate) { for (let i = 0; i < existingTasks.length; i++) { if (compare(existingTasks[i], delegate)) { // same callback, same capture, same event name, just return return; } } } } else { existingTasks = target[symbolEventName] = []; } let source; const constructorName = target.constructor['name']; const targetSource = globalSources[constructorName]; if (targetSource) { source = targetSource[eventName]; } if (!source) { source = constructorName + addSource + (eventNameToString ? eventNameToString(eventName) : eventName); } // In the code below, `options` should no longer be reassigned; instead, it // should only be mutated. This is because we pass that object to the native // `addEventListener`. // It's generally recommended to use the same object reference for options. // This ensures consistency and avoids potential issues. taskData.options = options; if (once) { // When using `addEventListener` with the `once` option, we don't pass // the `once` option directly to the native `addEventListener` method. // Instead, we keep the `once` setting and handle it ourselves. taskData.options.once = false; } taskData.target = target; taskData.capture = capture; taskData.eventName = eventName; taskData.isExisting = isExisting; const data = useGlobalCallback ? OPTIMIZED_ZONE_EVENT_TASK_DATA : undefined; // keep taskData into data to allow onScheduleEventTask to access the task information if (data) { data.taskData = taskData; } if (signal) { // When using `addEventListener` with the `signal` option, we don't pass // the `signal` option directly to the native `addEventListener` method. // Instead, we keep the `signal` setting and handle it ourselves. taskData.options.signal = undefined; } // The `scheduleEventTask` function will ultimately call `customScheduleGlobal`, // which in turn calls the native `addEventListener`. This is why `taskData.options` // is updated before scheduling the task, as `customScheduleGlobal` uses // `taskData.options` to pass it to the native `addEventListener`. const task = zone.scheduleEventTask(source, delegate, data, customScheduleFn, customCancelFn); if (signal) { // after task is scheduled, we need to store the signal back to task.options taskData.options.signal = signal; // Wrapping `task` in a weak reference would not prevent memory leaks. Weak references are // primarily used for preventing strong references cycles. `onAbort` is always reachable // as it's an event listener, so its closure retains a strong reference to the `task`. const onAbort = () => task.zone.cancelTask(task); nativeListener.call(signal, 'abort', onAbort, { once: true }); // We need to remove the `abort` listener when the event listener is going to be removed, // as it creates a closure that captures `task`. This closure retains a reference to the // `task` object even after it goes out of scope, preventing `task` from being garbage // collected. task.removeAbortListener = () => signal.removeEventListener('abort', onAbort); } // should clear taskData.target to avoid memory leak // issue, https://github.com/angular/angular/issues/20442 taskData.target = null; // need to clear up taskData because it is a global object if (data) { data.taskData = null; } // have to save those information to task in case // application may call task.zone.cancelTask() directly if (once) { taskData.options.once = true; } if (typeof task.options !== 'boolean') { // We should save the options on the task (if it's an object) because // we'll be using `task.options` later when removing the event listener // and passing it back to `removeEventListener`. task.options = options; } task.target = target; task.capture = capture; task.eventName = eventName; if (isEventListenerObject) { // save original delegate for compare to check duplicate task.originalDelegate = delegate; } if (!prepend) { existingTasks.push(task); } else { existingTasks.unshift(task); } if (returnTarget) { return target; } }; }; proto[ADD_EVENT_LISTENER] = makeAddListener(nativeAddEventListener, ADD_EVENT_LISTENER_SOURCE, customSchedule, customCancel, returnTarget); if (nativePrependEventListener) { proto[PREPEND_EVENT_LISTENER] = makeAddListener(nativePrependEventListener, PREPEND_EVENT_LISTENER_SOURCE, customSchedulePrepend, customCancel, returnTarget, true); } proto[REMOVE_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const options = arguments[2]; const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const delegate = arguments[1]; if (!delegate) { return nativeRemoveEventListener.apply(this, arguments); } if (validateHandler && !validateHandler(nativeRemoveEventListener, delegate, target, arguments)) { return; } const symbolEventNames = zoneSymbolEventNames[eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && target[symbolEventName]; // `existingTasks` may not exist if the `addEventListener` was called before // it was patched by zone.js. Please refer to the attached issue for // clarification, particularly after the `if` condition, before calling // the native `removeEventListener`. if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (compare(existingTask, delegate)) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check existingTask.isRemoved = true; if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target existingTask.allRemoved = true; target[symbolEventName] = null; // in the target, we have an event listener which is added by on_property // such as target.onclick = function() {}, so we need to clear this internal // property too if all delegates with capture=false were removed // https:// github.com/angular/angular/issues/31643 // https://github.com/angular/angular/issues/54581 if (!capture && typeof eventName === 'string') { const onPropertySymbol = ZONE_SYMBOL_PREFIX + 'ON_PROPERTY' + eventName; target[onPropertySymbol] = null; } } // In all other conditions, when `addEventListener` is called after being // patched by zone.js, we would always find an event task on the `EventTarget`. // This will trigger `cancelFn` on the `existingTask`, leading to `customCancelGlobal`, // which ultimately removes an event listener and cleans up the abort listener // (if an `AbortSignal` was provided when scheduling a task). existingTask.zone.cancelTask(existingTask); if (returnTarget) { return target; } return; } } } // https://github.com/angular/zone.js/issues/930 // We may encounter a situation where the `addEventListener` was // called on the event target before zone.js is loaded, resulting // in no task being stored on the event target due to its invocation // of the native implementation. In this scenario, we simply need to // invoke the native `removeEventListener`. return nativeRemoveEventListener.apply(this, arguments); }; proto[LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const listeners = []; const tasks = findEventTasks(target, eventNameToString ? eventNameToString(eventName) : eventName); for (let i = 0; i < tasks.length; i++) { const task = tasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; listeners.push(delegate); } return listeners; }; proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (!eventName) { const keys = Object.keys(target); for (let i = 0; i < keys.length; i++) { const prop = keys[i]; const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; // in nodejs EventEmitter, removeListener event is // used for monitoring the removeListener call, // so just keep removeListener eventListener until // all other eventListeners are removed if (evtName && evtName !== 'removeListener') { this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, evtName); } } // remove removeListener listener finally this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, 'removeListener'); } else { if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const symbolEventNames = zoneSymbolEventNames[eventName]; if (symbolEventNames) { const symbolEventName = symbolEventNames[FALSE_STR]; const symbolCaptureEventName = symbolEventNames[TRUE_STR]; const tasks = target[symbolEventName]; const captureTasks = target[symbolCaptureEventName]; if (tasks) { const removeTasks = tasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } if (captureTasks) { const removeTasks = captureTasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } } } if (returnTarget) { return this; } }; // for native toString patch attachOriginToPatched(proto[ADD_EVENT_LISTENER], nativeAddEventListener); attachOriginToPatched(proto[REMOVE_EVENT_LISTENER], nativeRemoveEventListener); if (nativeRemoveAllListeners) { attachOriginToPatched(proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER], nativeRemoveAllListeners); } if (nativeListeners) { attachOriginToPatched(proto[LISTENERS_EVENT_LISTENER], nativeListeners); } return true; } let results = []; for (let i = 0; i < apis.length; i++) { results[i] = patchEventTargetMethods(apis[i], patchOptions); } return results; } function findEventTasks(target, eventName) { if (!eventName) { const foundTasks = []; for (let prop in target) { const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; if (evtName && (!eventName || evtName === eventName)) { const tasks = target[prop]; if (tasks) { for (let i = 0; i < tasks.length; i++) { foundTasks.push(tasks[i]); } } } } return foundTasks; } let symbolEventName = zoneSymbolEventNames[eventName]; if (!symbolEventName) { prepareEventNames(eventName); symbolEventName = zoneSymbolEventNames[eventName]; } const captureFalseTasks = target[symbolEventName[FALSE_STR]]; const captureTrueTasks = target[symbolEventName[TRUE_STR]]; if (!captureFalseTasks) { return captureTrueTasks ? captureTrueTasks.slice() : []; } else { return captureTrueTasks ? captureFalseTasks.concat(captureTrueTasks) : captureFalseTasks.slice(); } } /** * @fileoverview * @suppress {missingRequire} */ function patchQueueMicrotask(global, api) { api.patchMethod(global, 'queueMicrotask', (delegate) => { return function (self, args) { Zone.current.scheduleMicroTask('queueMicrotask', args[0]); }; }); } /** * @fileoverview * @suppress {missingRequire} */ const taskSymbol = zoneSymbol('zoneTask'); function patchTimer(window, setName, cancelName, nameSuffix) { let setNative = null; let clearNative = null; setName += nameSuffix; cancelName += nameSuffix; const tasksByHandleId = {}; function scheduleTask(task) { const data = task.data; data.args[0] = function () { return task.invoke.apply(this, arguments); }; const handleOrId = setNative.apply(window, data.args); // Whlist on Node.js when get can the ID by using `[Symbol.toPrimitive]()` we do // to this so that we do not cause potentally leaks when using `setTimeout` // since this can be periodic when using `.refresh`. if (isNumber(handleOrId)) { data.handleId = handleOrId; } else { data.handle = handleOrId; // On Node.js a timeout and interval can be restarted over and over again by using the `.refresh` method. data.isRefreshable = isFunction(handleOrId.refresh); } return task; } function clearTask(task) { const { handle, handleId } = task.data; return clearNative.call(window, handle ?? handleId); } setNative = patchMethod(window, setName, (delegate) => function (self, args) { if (isFunction(args[0])) { const options = { isRefreshable: false, isPeriodic: nameSuffix === 'Interval', delay: nameSuffix === 'Timeout' || nameSuffix === 'Interval' ? args[1] || 0 : undefined, args: args, }; const callback = args[0]; args[0] = function timer() { try { return callback.apply(this, arguments); } finally { // issue-934, task will be cancelled // even it is a periodic task such as // setInterval // https://github.com/angular/angular/issues/40387 // Cleanup tasksByHandleId should be handled before scheduleTask // Since some zoneSpec may intercept and doesn't trigger // scheduleFn(scheduleTask) provided here. const { handle, handleId, isPeriodic, isRefreshable } = options; if (!isPeriodic && !isRefreshable) { if (handleId) { // in non-nodejs env, we remove timerId // from local cache delete tasksByHandleId[handleId]; } else if (handle) { // Node returns complex objects as handleIds // we remove task reference from timer object handle[taskSymbol] = null; } } } }; const task = scheduleMacroTaskWithCurrentZone(setName, args[0], options, scheduleTask, clearTask); if (!task) { return task; } // Node.js must additionally support the ref and unref functions. const { handleId, handle, isRefreshable, isPeriodic } = task.data; if (handleId) { // for non nodejs env, we save handleId: task // mapping in local cache for clearTimeout tasksByHandleId[handleId] = task; } else if (handle) { // for nodejs env, we save task // reference in timerId Object for clearTimeout handle[taskSymbol] = task; if (isRefreshable && !isPeriodic) { const originalRefresh = handle.refresh; handle.refresh = function () { const { zone, state } = task; if (state === 'notScheduled') { task._state = 'scheduled'; zone._updateTaskCount(task, 1); } else if (state === 'running') { task._state = 'scheduling'; } return originalRefresh.call(this); }; } } return handle ?? handleId ?? task; } else { // cause an error by calling it directly. return delegate.apply(window, args); } }); clearNative = patchMethod(window, cancelName, (delegate) => function (self, args) { const id = args[0]; let task; if (isNumber(id)) { // non nodejs env. task = tasksByHandleId[id]; delete tasksByHandleId[id]; } else { // nodejs env ?? other environments. task = id?.[taskSymbol]; if (task) { id[taskSymbol] = null; } else { task = id; } } if (task?.type) { if (task.cancelFn) { // Do not cancel already canceled functions task.zone.cancelTask(task); } } else { // cause an error by calling it directly. delegate.apply(window, args); } }); } function patchEvents(Zone) { Zone.__load_patch('EventEmitter', (global, Zone, api) => { // For EventEmitter const EE_ADD_LISTENER = 'addListener'; const EE_PREPEND_LISTENER = 'prependListener'; const EE_REMOVE_LISTENER = 'removeListener'; const EE_REMOVE_ALL_LISTENER = 'removeAllListeners'; const EE_LISTENERS = 'listeners'; const EE_ON = 'on'; const EE_OFF = 'off'; const compareTaskCallbackVsDelegate = function (task, delegate) { // same callback, same capture, same event name, just return return task.callback === delegate || task.callback.listener === delegate; }; const eventNameToString = function (eventName) { if (typeof eventName === 'string') { return eventName; } if (!eventName) { return ''; } return eventName.toString().replace('(', '_').replace(')', '_'); }; function patchEventEmitterMethods(obj) { const result = patchEventTarget(global, api, [obj], { useG: false, add: EE_ADD_LISTENER, rm: EE_REMOVE_LISTENER, prepend: EE_PREPEND_LISTENER, rmAll: EE_REMOVE_ALL_LISTENER, listeners: EE_LISTENERS, chkDup: false, rt: true, diff: compareTaskCallbackVsDelegate, eventNameToString: eventNameToString, }); if (result && result[0]) { obj[EE_ON] = obj[EE_ADD_LISTENER]; obj[EE_OFF] = obj[EE_REMOVE_LISTENER]; } } // EventEmitter let events; try { events = require('events'); } catch (err) { } if (events && events.EventEmitter) { patchEventEmitterMethods(events.EventEmitter.prototype); } }); } function patchFs(Zone) { Zone.__load_patch('fs', (global, Zone, api) => { let fs; try { fs = require('fs'); } catch (err) { } if (!fs) return; // watch, watchFile, unwatchFile has been patched // because EventEmitter has been patched const TO_PATCH_MACROTASK_METHODS = [ 'access', 'appendFile', 'chmod', 'chown', 'close', 'exists', 'fchmod', 'fchown', 'fdatasync', 'fstat', 'fsync', 'ftruncate', 'futimes', 'lchmod', 'lchown', 'lutimes', 'link', 'lstat', 'mkdir', 'mkdtemp', 'open', 'opendir', 'read', 'readdir', 'readFile', 'readlink', 'realpath', 'rename', 'rmdir', 'stat', 'symlink', 'truncate', 'unlink', 'utimes', 'write', 'writeFile', 'writev', ]; TO_PATCH_MACROTASK_METHODS.filter((name) => !!fs[name] && typeof fs[name] === 'function').forEach((name) => { patchMacroTask(fs, name, (self, args) => { return { name: 'fs.' + name, args: args, cbIdx: args.length > 0 ? args.length - 1 : -1, target: self, }; }); }); const realpathOriginalDelegate = fs.realpath?.[api.symbol('OriginalDelegate')]; // This is the only specific method that should be additionally patched because the previous // `patchMacroTask` has overridden the `realpath` function and its `native` property. if (realpathOriginalDelegate?.native) { fs.realpath.native = realpathOriginalDelegate.native; patchMacroTask(fs.realpath, 'native', (self, args) => ({ args, target: self, cbIdx: args.length > 0 ? args.length - 1 : -1, name: 'fs.realpath.native', })); } }); } function patchNodeUtil(Zone) { Zone.__load_patch('node_util', (global, Zone, api) => { api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; setShouldCopySymbolProperties(true); }); } const set = 'set'; const clear = 'clear'; function patchNode(Zone) { patchNodeUtil(Zone); patchEvents(Zone); patchFs(Zone); Zone.__load_patch('node_timers', (global, Zone) => { // Timers let globalUseTimeoutFromTimer = false; try { const timers = require('timers'); let globalEqualTimersTimeout = global.setTimeout === timers.setTimeout; if (!globalEqualTimersTimeout && !isMix) { // 1. if isMix, then we are in mix environment such as Electron // we should only patch timers.setTimeout because global.setTimeout // have been patched // 2. if global.setTimeout not equal timers.setTimeout, check // whether global.setTimeout use timers.setTimeout or not const originSetTimeout = timers.setTimeout; timers.setTimeout = function () { globalUseTimeoutFromTimer = true; return originSetTimeout.apply(this, arguments); }; const detectTimeout = global.setTimeout(() => { }, 100); clearTimeout(detectTimeout); timers.setTimeout = originSetTimeout; } patchTimer(timers, set, clear, 'Timeout'); patchTimer(timers, set, clear, 'Interval'); patchTimer(timers, set, clear, 'Immediate'); } catch (error) { // timers module not exists, for example, when we using nativeScript // timers is not available } if (isMix) { // if we are in mix environment, such as Electron, // the global.setTimeout has already been patched, // so we just patch timers.setTimeout return; } if (!globalUseTimeoutFromTimer) { // 1. global setTimeout equals timers setTimeout // 2. or global don't use timers setTimeout(maybe some other library patch setTimeout) // 3. or load timers module error happens, we should patch global setTimeout patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); } else { // global use timers setTimeout, but not equals // this happens when use nodejs v0.10.x, global setTimeout will // use a lazy load version of timers setTimeout // we should not double patch timer's setTimeout // so we only store the __symbol__ for consistency global[Zone.__symbol__('setTimeout')] = global.setTimeout; global[Zone.__symbol__('setInterval')] = global.setInterval; global[Zone.__symbol__('setImmediate')] = global.setImmediate; } }); // patch process related methods Zone.__load_patch('nextTick', () => { // patch nextTick as microTask patchMicroTask(process, 'nextTick', (self, args) => { return { name: 'process.nextTick', args: args, cbIdx: args.length > 0 && typeof args[0] === 'function' ? 0 : -1, target: process, }; }); }); Zone.__load_patch('handleUnhandledPromiseRejection', (global, Zone, api) => { Zone[api.symbol('unhandledPromiseRejectionHandler')] = findProcessPromiseRejectionHandler('unhandledRejection'); Zone[api.symbol('rejectionHandledHandler')] = findProcessPromiseRejectionHandler('rejectionHandled'); // handle unhandled promise rejection function findProcessPromiseRejectionHandler(evtName) { return function (e) { const eventTasks = findEventTasks(process, evtName); eventTasks.forEach((eventTask) => { // process has added unhandledrejection event listener // trigger the event listener if (evtName === 'unhandledRejection') { eventTask.invoke(e.rejection, e.promise); } else if (evtName === 'rejectionHandled') { eventTask.invoke(e.promise); } }); }; } }); // Crypto Zone.__load_patch('crypto', () => { let crypto; try { crypto = require('crypto'); } catch (err) { } // use the generic patchMacroTask to patch crypto if (crypto) { const methodNames = ['randomBytes', 'pbkdf2']; methodNames.forEach((name) => { patchMacroTask(crypto, name, (self, args) => { return { name: 'crypto.' + name, args: args, cbIdx: args.length > 0 && typeof args[args.length - 1] === 'function' ? args.length - 1 : -1, target: crypto, }; }); }); } }); Zone.__load_patch('console', (global, Zone) => { const consoleMethods = [ 'dir', 'log', 'info', 'error', 'warn', 'assert', 'debug', 'timeEnd', 'trace', ]; consoleMethods.forEach((m) => { const originalMethod = (console[Zone.__symbol__(m)] = console[m]); if (originalMethod) { console[m] = function () { const args = ArraySlice.call(arguments); if (Zone.current === Zone.root) { return originalMethod.apply(this, args); } else { return Zone.root.run(originalMethod, this, args); } }; } }); }); Zone.__load_patch('queueMicrotask', (global, Zone, api) => { patchQueueMicrotask(global, api); }); } function rollupMain() { const Zone = loadZone(); patchNode(Zone); // Node needs to come first. patchPromise(Zone); patchToString(Zone); return Zone; } rollupMain(); Jx"{"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const global=globalThis;function __symbol__(e){return(global.__Zone_symbol_prefix||"__zone_symbol__")+e}function initZone(){const e=global.performance;function t(t){e&&e.mark&&e.mark(t)}function n(t,n){e&&e.measure&&e.measure(t,n)}t("Zone");class o{static __symbol__=__symbol__;static assertZonePatched(){if(global.Promise!==Z.ZoneAwarePromise)throw new Error("Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.\nMost likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.)")}static get root(){let e=o.current;for(;e.parent;)e=e.parent;return e}static get current(){return D.zone}static get currentTask(){return z}static __load_patch(e,r,s=!1){if(Z.hasOwnProperty(e)){const t=!0===global[__symbol__("forceDuplicateZoneCheck")];if(!s&&t)throw Error("Already loaded patch: "+e)}else if(!global["__Zone_disable_"+e]){const s="Zone:"+e;t(s),Z[e]=r(global,o,P),n(s,s)}}get parent(){return this._parent}get name(){return this._name}_parent;_name;_properties;_zoneDelegate;constructor(e,t){this._parent=e,this._name=t?t.name||"unnamed":"",this._properties=t&&t.properties||{},this._zoneDelegate=new s(this,this._parent&&this._parent._zoneDelegate,t)}get(e){const t=this.getZoneWith(e);if(t)return t._properties[e]}getZoneWith(e){let t=this;for(;t;){if(t._properties.hasOwnProperty(e))return t;t=t._parent}return null}fork(e){if(!e)throw new Error("ZoneSpec required!");return this._zoneDelegate.fork(this,e)}wrap(e,t){if("function"!=typeof e)throw new Error("Expecting function got: "+e);const n=this._zoneDelegate.intercept(this,e,t),o=this;return function(){return o.runGuarded(n,this,arguments,t)}}run(e,t,n,o){D={parent:D,zone:this};try{return this._zoneDelegate.invoke(this,e,t,n,o)}finally{D=D.parent}}runGuarded(e,t=null,n,o){D={parent:D,zone:this};try{try{return this._zoneDelegate.invoke(this,e,t,n,o)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{D=D.parent}}runTask(e,t,n){if(e.zone!=this)throw new Error("A task can only be run in the zone of creation! (Creation: "+(e.zone||k).name+"; Execution: "+this.name+")");const o=e,{type:r,data:{isPeriodic:s=!1,isRefreshable:a=!1}={}}=e;if(e.state===g&&(r===w||r===S))return;const i=e.state!=T;i&&o._transitionTo(T,y);const l=z;z=o,D={parent:D,zone:this};try{r!=S||!e.data||s||a||(e.cancelFn=void 0);try{return this._zoneDelegate.invokeTask(this,o,t,n)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{const t=e.state;if(t!==g&&t!==v)if(r==w||s||a&&t===m)i&&o._transitionTo(y,T,m);else{const e=o._zoneDelegates;this._updateTaskCount(o,-1),i&&o._transitionTo(g,T,g),a&&(o._zoneDelegates=e)}D=D.parent,z=l}}scheduleTask(e){if(e.zone&&e.zone!==this){let t=this;for(;t;){if(t===e.zone)throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${e.zone.name}`);t=t.parent}}e._transitionTo(m,g);const t=[];e._zoneDelegates=t,e._zone=this;try{e=this._zoneDelegate.scheduleTask(this,e)}catch(t){throw e._transitionTo(v,m,g),this._zoneDelegate.handleError(this,t),t}return e._zoneDelegates===t&&this._updateTaskCount(e,1),e.state==m&&e._transitionTo(y,m),e}scheduleMicroTask(e,t,n,o){return this.scheduleTask(new a(E,e,t,n,o,void 0))}scheduleMacroTask(e,t,n,o,r){return this.scheduleTask(new a(S,e,t,n,o,r))}scheduleEventTask(e,t,n,o,r){return this.scheduleTask(new a(w,e,t,n,o,r))}cancelTask(e){if(e.zone!=this)throw new Error("A task can only be cancelled in the zone of creation! (Creation: "+(e.zone||k).name+"; Execution: "+this.name+")");if(e.state===y||e.state===T){e._transitionTo(b,y,T);try{this._zoneDelegate.cancelTask(this,e)}catch(t){throw e._transitionTo(v,b),this._zoneDelegate.handleError(this,t),t}return this._updateTaskCount(e,-1),e._transitionTo(g,b),e.runCount=-1,e}}_updateTaskCount(e,t){const n=e._zoneDelegates;-1==t&&(e._zoneDelegates=null);for(let o=0;oe.hasTask(n,o),onScheduleTask:(e,t,n,o)=>e.scheduleTask(n,o),onInvokeTask:(e,t,n,o,r,s)=>e.invokeTask(n,o,r,s),onCancelTask:(e,t,n,o)=>e.cancelTask(n,o)};class s{get zone(){return this._zone}_zone;_taskCounts={microTask:0,macroTask:0,eventTask:0};_parentDelegate;_forkDlgt;_forkZS;_forkCurrZone;_interceptDlgt;_interceptZS;_interceptCurrZone;_invokeDlgt;_invokeZS;_invokeCurrZone;_handleErrorDlgt;_handleErrorZS;_handleErrorCurrZone;_scheduleTaskDlgt;_scheduleTaskZS;_scheduleTaskCurrZone;_invokeTaskDlgt;_invokeTaskZS;_invokeTaskCurrZone;_cancelTaskDlgt;_cancelTaskZS;_cancelTaskCurrZone;_hasTaskDlgt;_hasTaskDlgtOwner;_hasTaskZS;_hasTaskCurrZone;constructor(e,t,n){this._zone=e,this._parentDelegate=t,this._forkZS=n&&(n&&n.onFork?n:t._forkZS),this._forkDlgt=n&&(n.onFork?t:t._forkDlgt),this._forkCurrZone=n&&(n.onFork?this._zone:t._forkCurrZone),this._interceptZS=n&&(n.onIntercept?n:t._interceptZS),this._interceptDlgt=n&&(n.onIntercept?t:t._interceptDlgt),this._interceptCurrZone=n&&(n.onIntercept?this._zone:t._interceptCurrZone),this._invokeZS=n&&(n.onInvoke?n:t._invokeZS),this._invokeDlgt=n&&(n.onInvoke?t:t._invokeDlgt),this._invokeCurrZone=n&&(n.onInvoke?this._zone:t._invokeCurrZone),this._handleErrorZS=n&&(n.onHandleError?n:t._handleErrorZS),this._handleErrorDlgt=n&&(n.onHandleError?t:t._handleErrorDlgt),this._handleErrorCurrZone=n&&(n.onHandleError?this._zone:t._handleErrorCurrZone),this._scheduleTaskZS=n&&(n.onScheduleTask?n:t._scheduleTaskZS),this._scheduleTaskDlgt=n&&(n.onScheduleTask?t:t._scheduleTaskDlgt),this._scheduleTaskCurrZone=n&&(n.onScheduleTask?this._zone:t._scheduleTaskCurrZone),this._invokeTaskZS=n&&(n.onInvokeTask?n:t._invokeTaskZS),this._invokeTaskDlgt=n&&(n.onInvokeTask?t:t._invokeTaskDlgt),this._invokeTaskCurrZone=n&&(n.onInvokeTask?this._zone:t._invokeTaskCurrZone),this._cancelTaskZS=n&&(n.onCancelTask?n:t._cancelTaskZS),this._cancelTaskDlgt=n&&(n.onCancelTask?t:t._cancelTaskDlgt),this._cancelTaskCurrZone=n&&(n.onCancelTask?this._zone:t._cancelTaskCurrZone),this._hasTaskZS=null,this._hasTaskDlgt=null,this._hasTaskDlgtOwner=null,this._hasTaskCurrZone=null;const o=n&&n.onHasTask;(o||t&&t._hasTaskZS)&&(this._hasTaskZS=o?n:r,this._hasTaskDlgt=t,this._hasTaskDlgtOwner=this,this._hasTaskCurrZone=this._zone,n.onScheduleTask||(this._scheduleTaskZS=r,this._scheduleTaskDlgt=t,this._scheduleTaskCurrZone=this._zone),n.onInvokeTask||(this._invokeTaskZS=r,this._invokeTaskDlgt=t,this._invokeTaskCurrZone=this._zone),n.onCancelTask||(this._cancelTaskZS=r,this._cancelTaskDlgt=t,this._cancelTaskCurrZone=this._zone))}fork(e,t){return this._forkZS?this._forkZS.onFork(this._forkDlgt,this.zone,e,t):new o(e,t)}intercept(e,t,n){return this._interceptZS?this._interceptZS.onIntercept(this._interceptDlgt,this._interceptCurrZone,e,t,n):t}invoke(e,t,n,o,r){return this._invokeZS?this._invokeZS.onInvoke(this._invokeDlgt,this._invokeCurrZone,e,t,n,o,r):t.apply(n,o)}handleError(e,t){return!this._handleErrorZS||this._handleErrorZS.onHandleError(this._handleErrorDlgt,this._handleErrorCurrZone,e,t)}scheduleTask(e,t){let n=t;if(this._scheduleTaskZS)this._hasTaskZS&&n._zoneDelegates.push(this._hasTaskDlgtOwner),n=this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt,this._scheduleTaskCurrZone,e,t),n||(n=t);else if(t.scheduleFn)t.scheduleFn(t);else{if(t.type!=E)throw new Error("Task is missing scheduleFn.");_(t)}return n}invokeTask(e,t,n,o){return this._invokeTaskZS?this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt,this._invokeTaskCurrZone,e,t,n,o):t.callback.apply(n,o)}cancelTask(e,t){let n;if(this._cancelTaskZS)n=this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt,this._cancelTaskCurrZone,e,t);else{if(!t.cancelFn)throw Error("Task is not cancelable");n=t.cancelFn(t)}return n}hasTask(e,t){try{this._hasTaskZS&&this._hasTaskZS.onHasTask(this._hasTaskDlgt,this._hasTaskCurrZone,e,t)}catch(t){this.handleError(e,t)}}_updateTaskCount(e,t){const n=this._taskCounts,o=n[e],r=n[e]=o+t;if(r<0)throw new Error("More tasks executed then were scheduled.");0!=o&&0!=r||this.hasTask(this._zone,{microTask:n.microTask>0,macroTask:n.macroTask>0,eventTask:n.eventTask>0,change:e})}}class a{type;source;invoke;callback;data;scheduleFn;cancelFn;_zone=null;runCount=0;_zoneDelegates=null;_state="notScheduled";constructor(e,t,n,o,r,s){if(this.type=e,this.source=t,this.data=o,this.scheduleFn=r,this.cancelFn=s,!n)throw new Error("callback is not defined");this.callback=n;const i=this;this.invoke=e===w&&o&&o.useG?a.invokeTask:function(){return a.invokeTask.call(global,i,this,arguments)}}static invokeTask(e,t,n){e||(e=this),O++;try{return e.runCount++,e.zone.runTask(e,t,n)}finally{1==O&&d(),O--}}get zone(){return this._zone}get state(){return this._state}cancelScheduleRequest(){this._transitionTo(g,m)}_transitionTo(e,t,n){if(this._state!==t&&this._state!==n)throw new Error(`${this.type} '${this.source}': can not transition to '${e}', expecting state '${t}'${n?" or '"+n+"'":""}, was '${this._state}'.`);this._state=e,e==g&&(this._zoneDelegates=null)}toString(){return this.data&&void 0!==this.data.handleId?this.data.handleId.toString():Object.prototype.toString.call(this)}toJSON(){return{type:this.type,state:this.state,source:this.source,zone:this.zone.name,runCount:this.runCount}}}const i=__symbol__("setTimeout"),l=__symbol__("Promise"),c=__symbol__("then");let h,u=[],p=!1;function f(e){if(h||global[l]&&(h=global[l].resolve(0)),h){let t=h[c];t||(t=h.then),t.call(h,e)}else global[i](e,0)}function _(e){0===O&&0===u.length&&f(d),e&&u.push(e)}function d(){if(!p){for(p=!0;u.length;){const e=u;u=[];for(let t=0;tD,onUnhandledError:C,microtaskDrainDone:C,scheduleMicroTask:_,showUncaughtError:()=>!o[__symbol__("ignoreConsoleErrorUncaughtError")],patchEventTarget:()=>[],patchOnProperties:C,patchMethod:()=>C,bindArguments:()=>[],patchThen:()=>C,patchMacroTask:()=>C,patchEventPrototype:()=>C,isIEOrEdge:()=>!1,getGlobalObjects:()=>{},ObjectDefineProperty:()=>C,ObjectGetOwnPropertyDescriptor:()=>{},ObjectCreate:()=>{},ArraySlice:()=>[],patchClass:()=>C,wrapWithCurrentZone:()=>C,filterProperties:()=>[],attachOriginToPatched:()=>C,_redefineProperty:()=>C,patchCallbacks:()=>C,nativeScheduleMicroTask:f};let D={parent:null,zone:new o(null,null)},z=null,O=0;function C(){}return n("Zone","Zone"),o}const ObjectGetOwnPropertyDescriptor=Object.getOwnPropertyDescriptor,ObjectDefineProperty=Object.defineProperty,ObjectGetPrototypeOf=Object.getPrototypeOf,ArraySlice=Array.prototype.slice,ADD_EVENT_LISTENER_STR="addEventListener",REMOVE_EVENT_LISTENER_STR="removeEventListener",TRUE_STR="true",FALSE_STR="false",ZONE_SYMBOL_PREFIX=__symbol__("");function wrapWithCurrentZone(e,t){return Zone.current.wrap(e,t)}function scheduleMacroTaskWithCurrentZone(e,t,n,o,r){return Zone.current.scheduleMacroTask(e,t,n,o,r)}const zoneSymbol=__symbol__,isWindowExists="undefined"!=typeof window,internalWindow=isWindowExists?window:void 0,_global=isWindowExists&&internalWindow||globalThis,REMOVE_ATTRIBUTE="removeAttribute";function bindArguments(e,t){for(let n=e.length-1;n>=0;n--)"function"==typeof e[n]&&(e[n]=wrapWithCurrentZone(e[n],t+"_"+n));return e}function isPropertyWritable(e){return!e||!1!==e.writable&&!("function"==typeof e.get&&void 0===e.set)}const isWebWorker="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope,isNode=!("nw"in _global)&&void 0!==_global.process&&"[object process]"===_global.process.toString(),isBrowser=!isNode&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),isMix=void 0!==_global.process&&"[object process]"===_global.process.toString()&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),zoneSymbolEventNames$1={},enableBeforeunloadSymbol=zoneSymbol("enable_beforeunload"),wrapFn=function(e){if(!(e=e||_global.event))return;let t=zoneSymbolEventNames$1[e.type];t||(t=zoneSymbolEventNames$1[e.type]=zoneSymbol("ON_PROPERTY"+e.type));const n=this||e.target||_global,o=n[t];let r;return isBrowser&&n===internalWindow&&"error"===e.type?(r=o&&o.call(this,e.message,e.filename,e.lineno,e.colno,e.error),!0===r&&e.preventDefault()):(r=o&&o.apply(this,arguments),"beforeunload"===e.type&&_global[enableBeforeunloadSymbol]&&"string"==typeof r?e.returnValue=r:null==r||r||e.preventDefault()),r};function patchProperty(e,t,n){let o=ObjectGetOwnPropertyDescriptor(e,t);if(!o&&n&&ObjectGetOwnPropertyDescriptor(n,t)&&(o={enumerable:!0,configurable:!0}),!o||!o.configurable)return;const r=zoneSymbol("on"+t+"patched");if(e.hasOwnProperty(r)&&e[r])return;delete o.writable,delete o.value;const s=o.get,a=o.set,i=t.slice(2);let l=zoneSymbolEventNames$1[i];l||(l=zoneSymbolEventNames$1[i]=zoneSymbol("ON_PROPERTY"+i)),o.set=function(t){let n=this;n||e!==_global||(n=_global),n&&("function"==typeof n[l]&&n.removeEventListener(i,wrapFn),a?.call(n,null),n[l]=t,"function"==typeof t&&n.addEventListener(i,wrapFn,!1))},o.get=function(){let n=this;if(n||e!==_global||(n=_global),!n)return null;const r=n[l];if(r)return r;if(s){let e=s.call(this);if(e)return o.set.call(this,e),"function"==typeof n[REMOVE_ATTRIBUTE]&&n.removeAttribute(t),e}return null},ObjectDefineProperty(e,t,o),e[r]=!0}function patchOnProperties(e,t,n){if(t)for(let o=0;o{const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,{get:function(){return e[n]},set:function(t){(!o||o.writable&&"function"==typeof o.set)&&(e[n]=t)},enumerable:!o||o.enumerable,configurable:!o||o.configurable})}))}let shouldCopySymbolProperties=!1;function setShouldCopySymbolProperties(e){shouldCopySymbolProperties=e}function patchMethod(e,t,n){let o=e;for(;o&&!o.hasOwnProperty(t);)o=ObjectGetPrototypeOf(o);!o&&e[t]&&(o=e);const r=zoneSymbol(t);let s=null;if(o&&(!(s=o[r])||!o.hasOwnProperty(r))&&(s=o[r]=o[t],isPropertyWritable(o&&ObjectGetOwnPropertyDescriptor(o,t)))){const e=n(s,r,t);o[t]=function(){return e(this,arguments)},attachOriginToPatched(o[t],s),shouldCopySymbolProperties&©SymbolProperties(s,o[t])}return s}function patchMacroTask(e,t,n){let o=null;function r(e){const t=e.data;return t.args[t.cbIdx]=function(){e.invoke.apply(this,arguments)},o.apply(t.target,t.args),e}o=patchMethod(e,t,(e=>function(t,o){const s=n(t,o);return s.cbIdx>=0&&"function"==typeof o[s.cbIdx]?scheduleMacroTaskWithCurrentZone(s.name,o[s.cbIdx],s,r):e.apply(t,o)}))}function patchMicroTask(e,t,n){let o=null;function r(e){const t=e.data;return t.args[t.cbIdx]=function(){e.invoke.apply(this,arguments)},o.apply(t.target,t.args),e}o=patchMethod(e,t,(e=>function(t,o){const s=n(t,o);return s.cbIdx>=0&&"function"==typeof o[s.cbIdx]?Zone.current.scheduleMicroTask(s.name,o[s.cbIdx],s,r):e.apply(t,o)}))}function attachOriginToPatched(e,t){e[zoneSymbol("OriginalDelegate")]=t}function isFunction(e){return"function"==typeof e}function isNumber(e){return"number"==typeof e}function patchPromise(e){e.__load_patch("ZoneAwarePromise",((e,t,n)=>{const o=Object.getOwnPropertyDescriptor,r=Object.defineProperty,s=n.symbol,a=[],i=!1!==e[s("DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION")],l=s("Promise"),c=s("then");n.onUnhandledError=e=>{if(n.showUncaughtError()){const t=e&&e.rejection;t?console.error("Unhandled Promise rejection:",t instanceof Error?t.message:t,"; Zone:",e.zone.name,"; Task:",e.task&&e.task.source,"; Value:",t,t instanceof Error?t.stack:void 0):console.error(e)}},n.microtaskDrainDone=()=>{for(;a.length;){const e=a.shift();try{e.zone.runGuarded((()=>{if(e.throwOriginal)throw e.rejection;throw e}))}catch(e){u(e)}}};const h=s("unhandledPromiseRejectionHandler");function u(e){n.onUnhandledError(e);try{const n=t[h];"function"==typeof n&&n.call(this,e)}catch(e){}}function p(e){return e&&"function"==typeof e.then}function f(e){return e}function _(e){return j.reject(e)}const d=s("state"),k=s("value"),g=s("finally"),m=s("parentPromiseValue"),y=s("parentPromiseState"),T=null,b=!0,v=!1;function E(e,t){return n=>{try{P(e,t,n)}catch(t){P(e,!1,t)}}}const S=function(){let e=!1;return function t(n){return function(){e||(e=!0,n.apply(null,arguments))}}},w="Promise resolved with itself",Z=s("currentTaskTrace");function P(e,o,s){const l=S();if(e===s)throw new TypeError(w);if(e[d]===T){let c=null;try{"object"!=typeof s&&"function"!=typeof s||(c=s&&s.then)}catch(t){return l((()=>{P(e,!1,t)}))(),e}if(o!==v&&s instanceof j&&s.hasOwnProperty(d)&&s.hasOwnProperty(k)&&s[d]!==T)z(s),P(e,s[d],s[k]);else if(o!==v&&"function"==typeof c)try{c.call(s,l(E(e,o)),l(E(e,!1)))}catch(t){l((()=>{P(e,!1,t)}))()}else{e[d]=o;const l=e[k];if(e[k]=s,e[g]===g&&o===b&&(e[d]=e[y],e[k]=e[m]),o===v&&s instanceof Error){const e=t.currentTask&&t.currentTask.data&&t.currentTask.data.__creationTrace__;e&&r(s,Z,{configurable:!0,enumerable:!1,writable:!0,value:e})}for(let t=0;t{try{const o=e[k],r=!!n&&g===n[g];r&&(n[m]=o,n[y]=s);const i=t.run(a,void 0,r&&a!==_&&a!==f?[]:[o]);P(n,!0,i)}catch(e){P(n,!1,e)}}),n)}const C=function(){},N=e.AggregateError;class j{static toString(){return"function ZoneAwarePromise() { [native code] }"}static resolve(e){return e instanceof j?e:P(new this(null),b,e)}static reject(e){return P(new this(null),v,e)}static withResolvers(){const e={};return e.promise=new j(((t,n)=>{e.resolve=t,e.reject=n})),e}static any(e){if(!e||"function"!=typeof e[Symbol.iterator])return Promise.reject(new N([],"All promises were rejected"));const t=[];let n=0;try{for(let o of e)n++,t.push(j.resolve(o))}catch(e){return Promise.reject(new N([],"All promises were rejected"))}if(0===n)return Promise.reject(new N([],"All promises were rejected"));let o=!1;const r=[];return new j(((e,s)=>{for(let a=0;a{o||(o=!0,e(t))}),(e=>{r.push(e),n--,0===n&&(o=!0,s(new N(r,"All promises were rejected")))}))}))}static race(e){let t,n,o=new this(((e,o)=>{t=e,n=o}));function r(e){t(e)}function s(e){n(e)}for(let t of e)p(t)||(t=this.resolve(t)),t.then(r,s);return o}static all(e){return j.allWithCallback(e)}static allSettled(e){return(this&&this.prototype instanceof j?this:j).allWithCallback(e,{thenCallback:e=>({status:"fulfilled",value:e}),errorCallback:e=>({status:"rejected",reason:e})})}static allWithCallback(e,t){let n,o,r=new this(((e,t)=>{n=e,o=t})),s=2,a=0;const i=[];for(let r of e){p(r)||(r=this.resolve(r));const e=a;try{r.then((o=>{i[e]=t?t.thenCallback(o):o,s--,0===s&&n(i)}),(r=>{t?(i[e]=t.errorCallback(r),s--,0===s&&n(i)):o(r)}))}catch(e){o(e)}s++,a++}return s-=2,0===s&&n(i),r}constructor(e){const t=this;if(!(t instanceof j))throw new Error("Must be an instanceof Promise.");t[d]=T,t[k]=[];try{const n=S();e&&e(n(E(t,b)),n(E(t,v)))}catch(e){P(t,!1,e)}}get[Symbol.toStringTag](){return"Promise"}get[Symbol.species](){return j}then(e,n){let o=this.constructor?.[Symbol.species];o&&"function"==typeof o||(o=this.constructor||j);const r=new o(C),s=t.current;return this[d]==T?this[k].push(s,r,e,n):O(this,s,r,e,n),r}catch(e){return this.then(null,e)}finally(e){let n=this.constructor?.[Symbol.species];n&&"function"==typeof n||(n=j);const o=new n(C);o[g]=g;const r=t.current;return this[d]==T?this[k].push(r,o,e,e):O(this,r,o,e,e),o}}j.resolve=j.resolve,j.reject=j.reject,j.race=j.race,j.all=j.all;const M=e[l]=e.Promise;e.Promise=j;const I=s("thenPatched");function A(e){const t=e.prototype,n=o(t,"then");if(n&&(!1===n.writable||!n.configurable))return;const r=t.then;t[c]=r,e.prototype.then=function(e,t){return new j(((e,t)=>{r.call(this,e,t)})).then(e,t)},e[I]=!0}return n.patchThen=A,M&&(A(M),patchMethod(e,"fetch",(e=>function t(e){return function(t,n){let o=e.apply(t,n);if(o instanceof j)return o;let r=o.constructor;return r[I]||A(r),o}}(e)))),Promise[t.__symbol__("uncaughtPromiseErrors")]=a,j}))}function patchToString(e){e.__load_patch("toString",(e=>{const t=Function.prototype.toString,n=zoneSymbol("OriginalDelegate"),o=zoneSymbol("Promise"),r=zoneSymbol("Error"),s=function s(){if("function"==typeof this){const s=this[n];if(s)return"function"==typeof s?t.call(s):Object.prototype.toString.call(s);if(this===Promise){const n=e[o];if(n)return t.call(n)}if(this===Error){const n=e[r];if(n)return t.call(n)}}return t.call(this)};s[n]=t,Function.prototype.toString=s;const a=Object.prototype.toString;Object.prototype.toString=function(){return"function"==typeof Promise&&this instanceof Promise?"[object Promise]":a.call(this)}}))}function loadZone(){const e=globalThis,t=!0===e[__symbol__("forceDuplicateZoneCheck")];if(e.Zone&&(t||"function"!=typeof e.Zone.__symbol__))throw new Error("Zone already loaded.");return e.Zone??=initZone(),e.Zone}const OPTIMIZED_ZONE_EVENT_TASK_DATA={useG:!0},zoneSymbolEventNames={},globalSources={},EVENT_NAME_SYMBOL_REGX=new RegExp("^"+ZONE_SYMBOL_PREFIX+"(\\w+)(true|false)$"),IMMEDIATE_PROPAGATION_SYMBOL=zoneSymbol("propagationStopped");function prepareEventNames(e,t){const n=(t?t(e):e)+"false",o=(t?t(e):e)+"true",r=ZONE_SYMBOL_PREFIX+n,s=ZONE_SYMBOL_PREFIX+o;zoneSymbolEventNames[e]={},zoneSymbolEventNames[e].false=r,zoneSymbolEventNames[e].true=s}function patchEventTarget(e,t,n,o){const r=o&&o.add||"addEventListener",s=o&&o.rm||"removeEventListener",a=o&&o.listeners||"eventListeners",i=o&&o.rmAll||"removeAllListeners",l=zoneSymbol(r),c="."+r+":",h="prependListener",u="."+h+":",p=function(e,t,n){if(e.isRemoved)return;const o=e.callback;let r;"object"==typeof o&&o.handleEvent&&(e.callback=e=>o.handleEvent(e),e.originalDelegate=o);try{e.invoke(e,t,[n])}catch(e){r=e}const a=e.options;return a&&"object"==typeof a&&a.once&&t[s].call(t,n.type,e.originalDelegate?e.originalDelegate:e.callback,a),r};function f(n,o,r){if(!(o=o||e.event))return;const s=n||o.target||e,a=s[zoneSymbolEventNames[o.type][r?"true":"false"]];if(a){const e=[];if(1===a.length){const t=p(a[0],s,o);t&&e.push(t)}else{const t=a.slice();for(let n=0;n{throw o}))}}}const _=function(e){return f(this,e,!1)},d=function(e){return f(this,e,!0)};function k(t,n){if(!t)return!1;let o=!0;n&&void 0!==n.useG&&(o=n.useG);const p=n&&n.vh;let f=!0;n&&void 0!==n.chkDup&&(f=n.chkDup);let k=!1;n&&void 0!==n.rt&&(k=n.rt);let g=t;for(;g&&!g.hasOwnProperty(r);)g=ObjectGetPrototypeOf(g);if(!g&&t[r]&&(g=t),!g)return!1;if(g[l])return!1;const m=n&&n.eventNameToString,y={},T=g[l]=g[r],b=g[zoneSymbol(s)]=g[s],v=g[zoneSymbol(a)]=g[a],E=g[zoneSymbol(i)]=g[i];let S;n&&n.prepend&&(S=g[zoneSymbol(n.prepend)]=g[n.prepend]);const w=o?function(e){if(!y.isExisting)return T.call(y.target,y.eventName,y.capture?d:_,y.options)}:function(e){return T.call(y.target,y.eventName,e.invoke,y.options)},Z=o?function(e){if(!e.isRemoved){const t=zoneSymbolEventNames[e.eventName];let n;t&&(n=t[e.capture?"true":"false"]);const o=n&&e.target[n];if(o)for(let t=0;tA.zone.cancelTask(A);t.call(b,"abort",e,{once:!0}),A.removeAbortListener=()=>b.removeEventListener("abort",e)}return y.target=null,I&&(I.taskData=null),E&&(y.options.once=!0),"boolean"!=typeof A.options&&(A.options=k),A.target=c,A.capture=v,A.eventName=h,_&&(A.originalDelegate=u),l?C.unshift(A):C.push(A),i?c:void 0}};return g[r]=O(T,c,w,Z,k),S&&(g[h]=O(S,u,(function(e){return S.call(y.target,y.eventName,e.invoke,y.options)}),Z,k,!0)),g[s]=function(){const t=this||e;let o=arguments[0];n&&n.transferEventName&&(o=n.transferEventName(o));const r=arguments[2],s=!!r&&("boolean"==typeof r||r.capture),a=arguments[1];if(!a)return b.apply(this,arguments);if(p&&!p(b,a,t,arguments))return;const i=zoneSymbolEventNames[o];let l;i&&(l=i[s?"true":"false"]);const c=l&&t[l];if(c)for(let e=0;efunction(e,t){Zone.current.scheduleMicroTask("queueMicrotask",t[0])}))}const taskSymbol=zoneSymbol("zoneTask");function patchTimer(e,t,n,o){let r=null,s=null;n+=o;const a={};function i(t){const n=t.data;n.args[0]=function(){return t.invoke.apply(this,arguments)};const o=r.apply(e,n.args);return isNumber(o)?n.handleId=o:(n.handle=o,n.isRefreshable=isFunction(o.refresh)),t}function l(t){const{handle:n,handleId:o}=t.data;return s.call(e,n??o)}r=patchMethod(e,t+=o,(n=>function(r,s){if(isFunction(s[0])){const e={isRefreshable:!1,isPeriodic:"Interval"===o,delay:"Timeout"===o||"Interval"===o?s[1]||0:void 0,args:s},n=s[0];s[0]=function t(){try{return n.apply(this,arguments)}finally{const{handle:t,handleId:n,isPeriodic:o,isRefreshable:r}=e;o||r||(n?delete a[n]:t&&(t[taskSymbol]=null))}};const r=scheduleMacroTaskWithCurrentZone(t,s[0],e,i,l);if(!r)return r;const{handleId:c,handle:h,isRefreshable:u,isPeriodic:p}=r.data;if(c)a[c]=r;else if(h&&(h[taskSymbol]=r,u&&!p)){const e=h.refresh;h.refresh=function(){const{zone:t,state:n}=r;return"notScheduled"===n?(r._state="scheduled",t._updateTaskCount(r,1)):"running"===n&&(r._state="scheduling"),e.call(this)}}return h??c??r}return n.apply(e,s)})),s=patchMethod(e,n,(t=>function(n,o){const r=o[0];let s;isNumber(r)?(s=a[r],delete a[r]):(s=r?.[taskSymbol],s?r[taskSymbol]=null:s=r),s?.type?s.cancelFn&&s.zone.cancelTask(s):t.apply(e,o)}))}function patchEvents(e){e.__load_patch("EventEmitter",((e,t,n)=>{const o="addListener",r="removeListener",s=function(e,t){return e.callback===t||e.callback.listener===t},a=function(e){return"string"==typeof e?e:e?e.toString().replace("(","_").replace(")","_"):""};let i;try{i=require("events")}catch(e){}i&&i.EventEmitter&&function l(t){const i=patchEventTarget(e,n,[t],{useG:!1,add:o,rm:r,prepend:"prependListener",rmAll:"removeAllListeners",listeners:"listeners",chkDup:!1,rt:!0,diff:s,eventNameToString:a});i&&i[0]&&(t.on=t[o],t.off=t[r])}(i.EventEmitter.prototype)}))}function patchFs(e){e.__load_patch("fs",((e,t,n)=>{let o;try{o=require("fs")}catch(e){}if(!o)return;["access","appendFile","chmod","chown","close","exists","fchmod","fchown","fdatasync","fstat","fsync","ftruncate","futimes","lchmod","lchown","lutimes","link","lstat","mkdir","mkdtemp","open","opendir","read","readdir","readFile","readlink","realpath","rename","rmdir","stat","symlink","truncate","unlink","utimes","write","writeFile","writev"].filter((e=>!!o[e]&&"function"==typeof o[e])).forEach((e=>{patchMacroTask(o,e,((t,n)=>({name:"fs."+e,args:n,cbIdx:n.length>0?n.length-1:-1,target:t})))}));const r=o.realpath?.[n.symbol("OriginalDelegate")];r?.native&&(o.realpath.native=r.native,patchMacroTask(o.realpath,"native",((e,t)=>({args:t,target:e,cbIdx:t.length>0?t.length-1:-1,name:"fs.realpath.native"}))))}))}function patchNodeUtil(e){e.__load_patch("node_util",((e,t,n)=>{n.patchOnProperties=patchOnProperties,n.patchMethod=patchMethod,n.bindArguments=bindArguments,n.patchMacroTask=patchMacroTask,setShouldCopySymbolProperties(!0)}))}const set="set",clear="clear";function patchNode(e){patchNodeUtil(e),patchEvents(e),patchFs(e),e.__load_patch("node_timers",((e,t)=>{let n=!1;try{const t=require("timers");if(e.setTimeout!==t.setTimeout&&!isMix){const o=t.setTimeout;t.setTimeout=function(){return n=!0,o.apply(this,arguments)};const r=e.setTimeout((()=>{}),100);clearTimeout(r),t.setTimeout=o}patchTimer(t,set,clear,"Timeout"),patchTimer(t,set,clear,"Interval"),patchTimer(t,set,clear,"Immediate")}catch(e){}isMix||(n?(e[t.__symbol__("setTimeout")]=e.setTimeout,e[t.__symbol__("setInterval")]=e.setInterval,e[t.__symbol__("setImmediate")]=e.setImmediate):(patchTimer(e,set,clear,"Timeout"),patchTimer(e,set,clear,"Interval"),patchTimer(e,set,clear,"Immediate")))})),e.__load_patch("nextTick",(()=>{patchMicroTask(process,"nextTick",((e,t)=>({name:"process.nextTick",args:t,cbIdx:t.length>0&&"function"==typeof t[0]?0:-1,target:process})))})),e.__load_patch("handleUnhandledPromiseRejection",((e,t,n)=>{function o(e){return function(t){findEventTasks(process,e).forEach((n=>{"unhandledRejection"===e?n.invoke(t.rejection,t.promise):"rejectionHandled"===e&&n.invoke(t.promise)}))}}t[n.symbol("unhandledPromiseRejectionHandler")]=o("unhandledRejection"),t[n.symbol("rejectionHandledHandler")]=o("rejectionHandled")})),e.__load_patch("crypto",(()=>{let e;try{e=require("crypto")}catch(e){}e&&["randomBytes","pbkdf2"].forEach((t=>{patchMacroTask(e,t,((n,o)=>({name:"crypto."+t,args:o,cbIdx:o.length>0&&"function"==typeof o[o.length-1]?o.length-1:-1,target:e})))}))})),e.__load_patch("console",((e,t)=>{["dir","log","info","error","warn","assert","debug","timeEnd","trace"].forEach((e=>{const n=console[t.__symbol__(e)]=console[e];n&&(console[e]=function(){const e=ArraySlice.call(arguments);return t.current===t.root?n.apply(this,e):t.root.run(n,this,e)})}))})),e.__load_patch("queueMicrotask",((e,t,n)=>{patchQueueMicrotask(e,n)}))}function rollupMain(){const e=loadZone();return patchNode(e),patchPromise(e),patchToString(e),e}rollupMain();&)xn'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchCanvas(Zone) { Zone.__load_patch('canvas', (global, Zone, api) => { const HTMLCanvasElement = global['HTMLCanvasElement']; if (typeof HTMLCanvasElement !== 'undefined' && HTMLCanvasElement.prototype && HTMLCanvasElement.prototype.toBlob) { api.patchMacroTask(HTMLCanvasElement.prototype, 'toBlob', (self, args) => { return { name: 'HTMLCanvasElement.toBlob', target: self, cbIdx: 0, args: args }; }); } }); } patchCanvas(Zone); $Mvxz"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchCanvas(t){t.__load_patch("canvas",((t,a,o)=>{const n=t.HTMLCanvasElement;void 0!==n&&n.prototype&&n.prototype.toBlob&&o.patchMacroTask(n.prototype,"toBlob",((t,a)=>({name:"HTMLCanvasElement.toBlob",target:t,cbIdx:0,args:a})))}))}patchCanvas(Zone);L}ox 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchElectron(Zone) { Zone.__load_patch('electron', (global, Zone, api) => { function patchArguments(target, name, source) { return api.patchMethod(target, name, (delegate) => (self, args) => { return delegate && delegate.apply(self, api.bindArguments(args, source)); }); } let { desktopCapturer, shell, CallbacksRegistry, ipcRenderer } = require('electron'); if (!CallbacksRegistry) { try { // Try to load CallbacksRegistry class from @electron/remote src // since from electron 14+, the CallbacksRegistry is moved to @electron/remote // package and not exported to outside, so this is a hack to patch CallbacksRegistry. CallbacksRegistry = require('@electron/remote/dist/src/renderer/callbacks-registry').CallbacksRegistry; } catch (err) { } } // patch api in renderer process directly // desktopCapturer if (desktopCapturer) { patchArguments(desktopCapturer, 'getSources', 'electron.desktopCapturer.getSources'); } // shell if (shell) { patchArguments(shell, 'openExternal', 'electron.shell.openExternal'); } // patch api in main process through CallbackRegistry if (!CallbacksRegistry) { if (ipcRenderer) { patchArguments(ipcRenderer, 'on', 'ipcRenderer.on'); } return; } patchArguments(CallbacksRegistry.prototype, 'add', 'CallbackRegistry.add'); }); } patchElectron(Zone); @*x_"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchElectron(e){e.__load_patch("electron",((e,r,t)=>{function c(e,r,c){return t.patchMethod(e,r,(e=>(r,l)=>e&&e.apply(r,t.bindArguments(l,c))))}let{desktopCapturer:l,shell:n,CallbacksRegistry:o,ipcRenderer:a}=require("electron");if(!o)try{o=require("@electron/remote/dist/src/renderer/callbacks-registry").CallbacksRegistry}catch(e){}l&&c(l,"getSources","electron.desktopCapturer.getSources"),n&&c(n,"openExternal","electron.shell.openExternal"),o?c(o.prototype,"add","CallbackRegistry.add"):a&&c(a,"on","ipcRenderer.on")}))}patchElectron(Zone);xC'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ /** * @fileoverview * @suppress {missingRequire} */ function patchFetch(Zone) { Zone.__load_patch('fetch', (global, Zone, api) => { let fetch = global['fetch']; if (typeof fetch !== 'function') { return; } const originalFetch = global[api.symbol('fetch')]; if (originalFetch) { // restore unpatched fetch first fetch = originalFetch; } const ZoneAwarePromise = global.Promise; const symbolThenPatched = api.symbol('thenPatched'); const fetchTaskScheduling = api.symbol('fetchTaskScheduling'); const OriginalResponse = global.Response; const placeholder = function () { }; const createFetchTask = (source, data, originalImpl, self, args, ac) => new Promise((resolve, reject) => { const task = Zone.current.scheduleMacroTask(source, placeholder, data, () => { // The promise object returned by the original implementation passed into the // function. This might be a `fetch` promise, `Response.prototype.json` promise, // etc. let implPromise; let zone = Zone.current; try { zone[fetchTaskScheduling] = true; implPromise = originalImpl.apply(self, args); } catch (error) { reject(error); return; } finally { zone[fetchTaskScheduling] = false; } if (!(implPromise instanceof ZoneAwarePromise)) { let ctor = implPromise.constructor; if (!ctor[symbolThenPatched]) { api.patchThen(ctor); } } implPromise.then((resource) => { if (task.state !== 'notScheduled') { task.invoke(); } resolve(resource); }, (error) => { if (task.state !== 'notScheduled') { task.invoke(); } reject(error); }); }, () => { ac?.abort(); }); }); global['fetch'] = function () { const args = Array.prototype.slice.call(arguments); const options = args.length > 1 ? args[1] : {}; const signal = options?.signal; const ac = new AbortController(); const fetchSignal = ac.signal; options.signal = fetchSignal; args[1] = options; let onAbort; if (signal) { const nativeAddEventListener = signal[Zone.__symbol__('addEventListener')] || signal.addEventListener; onAbort = () => ac.abort(); nativeAddEventListener.call(signal, 'abort', onAbort, { once: true }); } return createFetchTask('fetch', { fetchArgs: args }, fetch, this, args, ac).finally(() => { // We need to be good citizens and remove the `abort` listener once // the fetch is settled. The `abort` listener may not be called at all, // which means the event listener closure would retain a reference to // the `ac` object even if it goes out of scope. Since browser's garbage // collectors work differently, some may not be smart enough to collect a signal. signal?.removeEventListener('abort', onAbort); }); }; if (OriginalResponse?.prototype) { // https://fetch.spec.whatwg.org/#body-mixin ['arrayBuffer', 'blob', 'formData', 'json', 'text'] // Safely check whether the method exists on the `Response` prototype before patching. .filter((method) => typeof OriginalResponse.prototype[method] === 'function') .forEach((method) => { api.patchMethod(OriginalResponse.prototype, method, (delegate) => (self, args) => createFetchTask(`Response.${method}`, undefined, delegate, self, args, undefined)); }); } }); } patchFetch(Zone); {^Rx%"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchFetch(t){t.__load_patch("fetch",((t,e,o)=>{let n=t.fetch;if("function"!=typeof n)return;const c=t[o.symbol("fetch")];c&&(n=c);const r=t.Promise,a=o.symbol("thenPatched"),s=o.symbol("fetchTaskScheduling"),l=t.Response,i=function(){},h=(t,n,c,l,h,f)=>new Promise(((p,u)=>{const d=e.current.scheduleMacroTask(t,i,n,(()=>{let t,n=e.current;try{n[s]=!0,t=c.apply(l,h)}catch(t){return void u(t)}finally{n[s]=!1}if(!(t instanceof r)){let e=t.constructor;e[a]||o.patchThen(e)}t.then((t=>{"notScheduled"!==d.state&&d.invoke(),p(t)}),(t=>{"notScheduled"!==d.state&&d.invoke(),u(t)}))}),(()=>{f?.abort()}))}));t.fetch=function(){const t=Array.prototype.slice.call(arguments),o=t.length>1?t[1]:{},c=o?.signal,r=new AbortController;let a;if(o.signal=r.signal,t[1]=o,c){const t=c[e.__symbol__("addEventListener")]||c.addEventListener;a=()=>r.abort(),t.call(c,"abort",a,{once:!0})}return h("fetch",{fetchArgs:t},n,this,t,r).finally((()=>{c?.removeEventListener("abort",a)}))},l?.prototype&&["arrayBuffer","blob","formData","json","text"].filter((t=>"function"==typeof l.prototype[t])).forEach((t=>{o.patchMethod(l.prototype,t,(e=>(o,n)=>h(`Response.${t}`,void 0,e,o,n,void 0)))}))}))}patchFetch(Zone);K xD 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchJsonp(Zone) { Zone.__load_patch('jsonp', (global, Zone, api) => { // because jsonp is not a standard api, there are a lot of // implementations, so zone.js just provide a helper util to // patch the jsonp send and onSuccess/onError callback // the options is an object which contains // - jsonp, the jsonp object which hold the send function // - sendFuncName, the name of the send function // - successFuncName, success func name // - failedFuncName, failed func name Zone[Zone.__symbol__('jsonp')] = function patchJsonp(options) { if (!options || !options.jsonp || !options.sendFuncName) { return; } const noop = function () { }; [options.successFuncName, options.failedFuncName].forEach((methodName) => { if (!methodName) { return; } const oriFunc = global[methodName]; if (oriFunc) { api.patchMethod(global, methodName, (delegate) => (self, args) => { const task = global[api.symbol('jsonTask')]; if (task) { task.callback = delegate; return task.invoke.apply(self, args); } else { return delegate.apply(self, args); } }); } else { Object.defineProperty(global, methodName, { configurable: true, enumerable: true, get: function () { return function () { const task = global[api.symbol('jsonpTask')]; const delegate = global[api.symbol(`jsonp${methodName}callback`)]; if (task) { if (delegate) { task.callback = delegate; } global[api.symbol('jsonpTask')] = undefined; return task.invoke.apply(this, arguments); } else { if (delegate) { return delegate.apply(this, arguments); } } return null; }; }, set: function (callback) { this[api.symbol(`jsonp${methodName}callback`)] = callback; }, }); } }); api.patchMethod(options.jsonp, options.sendFuncName, (delegate) => (self, args) => { global[api.symbol('jsonpTask')] = Zone.current.scheduleMacroTask('jsonp', noop, {}, (task) => { return delegate.apply(self, args); }, noop); }); }; }); } patchJsonp(Zone); 8[;x@"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchJsonp(n){n.__load_patch("jsonp",((n,o,s)=>{o[o.__symbol__("jsonp")]=function c(a){if(!a||!a.jsonp||!a.sendFuncName)return;const e=function(){};[a.successFuncName,a.failedFuncName].forEach((o=>{o&&(n[o]?s.patchMethod(n,o,(o=>(c,a)=>{const e=n[s.symbol("jsonTask")];return e?(e.callback=o,e.invoke.apply(c,a)):o.apply(c,a)})):Object.defineProperty(n,o,{configurable:!0,enumerable:!0,get:function(){return function(){const c=n[s.symbol("jsonpTask")],a=n[s.symbol(`jsonp${o}callback`)];return c?(a&&(c.callback=a),n[s.symbol("jsonpTask")]=void 0,c.invoke.apply(this,arguments)):a?a.apply(this,arguments):null}},set:function(n){this[s.symbol(`jsonp${o}callback`)]=n}}))})),s.patchMethod(a.jsonp,a.sendFuncName,(c=>(a,t)=>{n[s.symbol("jsonpTask")]=o.current.scheduleMacroTask("jsonp",e,{},(n=>c.apply(a,t)),e)}))}}))}patchJsonp(Zone);pNJ)xk'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchMessagePort(Zone) { /** * Monkey patch `MessagePort.prototype.onmessage` and `MessagePort.prototype.onmessageerror` * properties to make the callback in the zone when the value are set. */ Zone.__load_patch('MessagePort', (global, Zone, api) => { const MessagePort = global['MessagePort']; if (typeof MessagePort !== 'undefined' && MessagePort.prototype) { api.patchOnProperties(MessagePort.prototype, ['message', 'messageerror']); } }); } patchMessagePort(Zone); uFx?"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchMessagePort(e){e.__load_patch("MessagePort",((e,t,s)=>{const o=e.MessagePort;void 0!==o&&o.prototype&&s.patchOnProperties(o.prototype,["message","messageerror"])}))}patchMessagePort(Zone);-hkdxn 'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchPromiseTesting(Zone) { /** * Promise for async/fakeAsync zoneSpec test * can support async operation which not supported by zone.js * such as * it ('test jsonp in AsyncZone', async() => { * new Promise(res => { * jsonp(url, (data) => { * // success callback * res(data); * }); * }).then((jsonpResult) => { * // get jsonp result. * * // user will expect AsyncZoneSpec wait for * // then, but because jsonp is not zone aware * // AsyncZone will finish before then is called. * }); * }); */ Zone.__load_patch('promisefortest', (global, Zone, api) => { const symbolState = api.symbol('state'); const UNRESOLVED = null; const symbolParentUnresolved = api.symbol('parentUnresolved'); // patch Promise.prototype.then to keep an internal // number for tracking unresolved chained promise // we will decrease this number when the parent promise // being resolved/rejected and chained promise was // scheduled as a microTask. // so we can know such kind of chained promise still // not resolved in AsyncTestZone Promise[api.symbol('patchPromiseForTest')] = function patchPromiseForTest() { let oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { return; } oriThen = Promise[Zone.__symbol__('ZonePromiseThen')] = Promise.prototype.then; Promise.prototype.then = function () { const chained = oriThen.apply(this, arguments); if (this[symbolState] === UNRESOLVED) { // parent promise is unresolved. const asyncTestZoneSpec = Zone.current.get('AsyncTestZoneSpec'); if (asyncTestZoneSpec) { asyncTestZoneSpec.unresolvedChainedPromiseCount++; chained[symbolParentUnresolved] = true; } } return chained; }; }; Promise[api.symbol('unPatchPromiseForTest')] = function unpatchPromiseForTest() { // restore origin then const oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { Promise.prototype.then = oriThen; Promise[Zone.__symbol__('ZonePromiseThen')] = undefined; } }; }); } patchPromiseTesting(Zone); *3x4"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchPromiseTesting(o){o.__load_patch("promisefortest",((o,e,s)=>{const t=s.symbol("state"),n=s.symbol("parentUnresolved");Promise[s.symbol("patchPromiseForTest")]=function o(){let s=Promise[e.__symbol__("ZonePromiseThen")];s||(s=Promise[e.__symbol__("ZonePromiseThen")]=Promise.prototype.then,Promise.prototype.then=function(){const o=s.apply(this,arguments);if(null===this[t]){const s=e.current.get("AsyncTestZoneSpec");s&&(s.unresolvedChainedPromiseCount++,o[n]=!0)}return o})},Promise[s.symbol("unPatchPromiseForTest")]=function o(){const s=Promise[e.__symbol__("ZonePromiseThen")];s&&(Promise.prototype.then=s,Promise[e.__symbol__("ZonePromiseThen")]=void 0)}}))}patchPromiseTesting(Zone);R%x$'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchResizeObserver(Zone) { Zone.__load_patch('ResizeObserver', (global, Zone, api) => { const ResizeObserver = global['ResizeObserver']; if (!ResizeObserver) { return; } const resizeObserverSymbol = api.symbol('ResizeObserver'); api.patchMethod(global, 'ResizeObserver', (delegate) => (self, args) => { const callback = args.length > 0 ? args[0] : null; if (callback) { args[0] = function (entries, observer) { const zones = {}; const currZone = Zone.current; for (let entry of entries) { let zone = entry.target[resizeObserverSymbol]; if (!zone) { zone = currZone; } let zoneEntriesInfo = zones[zone.name]; if (!zoneEntriesInfo) { zones[zone.name] = zoneEntriesInfo = { entries: [], zone: zone }; } zoneEntriesInfo.entries.push(entry); } Object.keys(zones).forEach((zoneName) => { const zoneEntriesInfo = zones[zoneName]; if (zoneEntriesInfo.zone !== Zone.current) { zoneEntriesInfo.zone.run(callback, this, [zoneEntriesInfo.entries, observer], 'ResizeObserver'); } else { callback.call(this, zoneEntriesInfo.entries, observer); } }); }; } return args.length > 0 ? new ResizeObserver(args[0]) : new ResizeObserver(); }); api.patchMethod(ResizeObserver.prototype, 'observe', (delegate) => (self, args) => { const target = args.length > 0 ? args[0] : null; if (!target) { return delegate.apply(self, args); } let targets = self[resizeObserverSymbol]; if (!targets) { targets = self[resizeObserverSymbol] = []; } targets.push(target); target[resizeObserverSymbol] = Zone.current; return delegate.apply(self, args); }); api.patchMethod(ResizeObserver.prototype, 'unobserve', (delegate) => (self, args) => { const target = args.length > 0 ? args[0] : null; if (!target) { return delegate.apply(self, args); } let targets = self[resizeObserverSymbol]; if (targets) { for (let i = 0; i < targets.length; i++) { if (targets[i] === target) { targets.splice(i, 1); break; } } } target[resizeObserverSymbol] = undefined; return delegate.apply(self, args); }); api.patchMethod(ResizeObserver.prototype, 'disconnect', (delegate) => (self, args) => { const targets = self[resizeObserverSymbol]; if (targets) { targets.forEach((target) => { target[resizeObserverSymbol] = undefined; }); self[resizeObserverSymbol] = undefined; } return delegate.apply(self, args); }); }); } patchResizeObserver(Zone); HMx-"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchResizeObserver(e){e.__load_patch("ResizeObserver",((e,t,r)=>{const n=e.ResizeObserver;if(!n)return;const s=r.symbol("ResizeObserver");r.patchMethod(e,"ResizeObserver",(e=>(e,r)=>{const o=r.length>0?r[0]:null;return o&&(r[0]=function(e,r){const n={},c=t.current;for(let t of e){let e=t.target[s];e||(e=c);let r=n[e.name];r||(n[e.name]=r={entries:[],zone:e}),r.entries.push(t)}Object.keys(n).forEach((e=>{const s=n[e];s.zone!==t.current?s.zone.run(o,this,[s.entries,r],"ResizeObserver"):o.call(this,s.entries,r)}))}),r.length>0?new n(r[0]):new n})),r.patchMethod(n.prototype,"observe",(e=>(r,n)=>{const o=n.length>0?n[0]:null;if(!o)return e.apply(r,n);let c=r[s];return c||(c=r[s]=[]),c.push(o),o[s]=t.current,e.apply(r,n)})),r.patchMethod(n.prototype,"unobserve",(e=>(t,r)=>{const n=r.length>0?r[0]:null;if(!n)return e.apply(t,r);let o=t[s];if(o)for(let e=0;e(t,r)=>{const n=t[s];return n&&(n.forEach((e=>{e[s]=void 0})),t[s]=void 0),e.apply(t,r)}))}))}patchResizeObserver(Zone);5x$v'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ import { Observable, Subscription, Subscriber } from 'rxjs'; function patchRxJs(Zone) { Zone.__load_patch('rxjs', (global, Zone, api) => { const symbol = Zone.__symbol__; const nextSource = 'rxjs.Subscriber.next'; const errorSource = 'rxjs.Subscriber.error'; const completeSource = 'rxjs.Subscriber.complete'; const ObjectDefineProperties = Object.defineProperties; const patchObservable = function () { const ObservablePrototype = Observable.prototype; const _symbolSubscribe = symbol('_subscribe'); const _subscribe = (ObservablePrototype[_symbolSubscribe] = ObservablePrototype._subscribe); ObjectDefineProperties(Observable.prototype, { _zone: { value: null, writable: true, configurable: true }, _zoneSource: { value: null, writable: true, configurable: true }, _zoneSubscribe: { value: null, writable: true, configurable: true }, source: { configurable: true, get: function () { return this._zoneSource; }, set: function (source) { this._zone = Zone.current; this._zoneSource = source; }, }, _subscribe: { configurable: true, get: function () { if (this._zoneSubscribe) { return this._zoneSubscribe; } else if (this.constructor === Observable) { return _subscribe; } const proto = Object.getPrototypeOf(this); return proto && proto._subscribe; }, set: function (subscribe) { this._zone = Zone.current; if (!subscribe) { this._zoneSubscribe = subscribe; } else { this._zoneSubscribe = function () { if (this._zone && this._zone !== Zone.current) { const tearDown = this._zone.run(subscribe, this, arguments); if (typeof tearDown === 'function') { const zone = this._zone; return function () { if (zone !== Zone.current) { return zone.run(tearDown, this, arguments); } return tearDown.apply(this, arguments); }; } else { return tearDown; } } else { return subscribe.apply(this, arguments); } }; } }, }, subjectFactory: { get: function () { return this._zoneSubjectFactory; }, set: function (factory) { const zone = this._zone; this._zoneSubjectFactory = function () { if (zone && zone !== Zone.current) { return zone.run(factory, this, arguments); } return factory.apply(this, arguments); }; }, }, }); }; api.patchMethod(Observable.prototype, 'lift', (delegate) => (self, args) => { const observable = delegate.apply(self, args); if (observable.operator) { observable.operator._zone = Zone.current; api.patchMethod(observable.operator, 'call', (operatorDelegate) => (operatorSelf, operatorArgs) => { if (operatorSelf._zone && operatorSelf._zone !== Zone.current) { return operatorSelf._zone.run(operatorDelegate, operatorSelf, operatorArgs); } return operatorDelegate.apply(operatorSelf, operatorArgs); }); } return observable; }); const patchSubscription = function () { ObjectDefineProperties(Subscription.prototype, { _zone: { value: null, writable: true, configurable: true }, _zoneUnsubscribe: { value: null, writable: true, configurable: true }, _unsubscribe: { get: function () { if (this._zoneUnsubscribe || this._zoneUnsubscribeCleared) { return this._zoneUnsubscribe; } const proto = Object.getPrototypeOf(this); return proto && proto._unsubscribe; }, set: function (unsubscribe) { this._zone = Zone.current; if (!unsubscribe) { this._zoneUnsubscribe = unsubscribe; // In some operator such as `retryWhen`, the _unsubscribe // method will be set to null, so we need to set another flag // to tell that we should return null instead of finding // in the prototype chain. this._zoneUnsubscribeCleared = true; } else { this._zoneUnsubscribeCleared = false; this._zoneUnsubscribe = function () { if (this._zone && this._zone !== Zone.current) { return this._zone.run(unsubscribe, this, arguments); } else { return unsubscribe.apply(this, arguments); } }; } }, }, }); }; const patchSubscriber = function () { const next = Subscriber.prototype.next; const error = Subscriber.prototype.error; const complete = Subscriber.prototype.complete; Object.defineProperty(Subscriber.prototype, 'destination', { configurable: true, get: function () { return this._zoneDestination; }, set: function (destination) { this._zone = Zone.current; this._zoneDestination = destination; }, }); // patch Subscriber.next to make sure it run // into SubscriptionZone Subscriber.prototype.next = function () { const currentZone = Zone.current; const subscriptionZone = this._zone; // for performance concern, check Zone.current // equal with this._zone(SubscriptionZone) or not if (subscriptionZone && subscriptionZone !== currentZone) { return subscriptionZone.run(next, this, arguments, nextSource); } else { return next.apply(this, arguments); } }; Subscriber.prototype.error = function () { const currentZone = Zone.current; const subscriptionZone = this._zone; // for performance concern, check Zone.current // equal with this._zone(SubscriptionZone) or not if (subscriptionZone && subscriptionZone !== currentZone) { return subscriptionZone.run(error, this, arguments, errorSource); } else { return error.apply(this, arguments); } }; Subscriber.prototype.complete = function () { const currentZone = Zone.current; const subscriptionZone = this._zone; // for performance concern, check Zone.current // equal with this._zone(SubscriptionZone) or not if (subscriptionZone && subscriptionZone !== currentZone) { return subscriptionZone.run(complete, this, arguments, completeSource); } else { return complete.call(this); } }; }; patchObservable(); patchSubscription(); patchSubscriber(); }); } patchRxJs(Zone); 0Sx p"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */import{Observable,Subscription,Subscriber}from"rxjs";function patchRxJs(e){e.__load_patch("rxjs",((e,t,r)=>{const n=t.__symbol__,o=Object.defineProperties;r.patchMethod(Observable.prototype,"lift",(e=>(n,o)=>{const i=e.apply(n,o);return i.operator&&(i.operator._zone=t.current,r.patchMethod(i.operator,"call",(e=>(r,n)=>r._zone&&r._zone!==t.current?r._zone.run(e,r,n):e.apply(r,n)))),i})),function(){const e=Observable.prototype,r=e[n("_subscribe")]=e._subscribe;o(Observable.prototype,{_zone:{value:null,writable:!0,configurable:!0},_zoneSource:{value:null,writable:!0,configurable:!0},_zoneSubscribe:{value:null,writable:!0,configurable:!0},source:{configurable:!0,get:function(){return this._zoneSource},set:function(e){this._zone=t.current,this._zoneSource=e}},_subscribe:{configurable:!0,get:function(){if(this._zoneSubscribe)return this._zoneSubscribe;if(this.constructor===Observable)return r;const e=Object.getPrototypeOf(this);return e&&e._subscribe},set:function(e){this._zone=t.current,this._zoneSubscribe=e?function(){if(this._zone&&this._zone!==t.current){const r=this._zone.run(e,this,arguments);if("function"==typeof r){const e=this._zone;return function(){return e!==t.current?e.run(r,this,arguments):r.apply(this,arguments)}}return r}return e.apply(this,arguments)}:e}},subjectFactory:{get:function(){return this._zoneSubjectFactory},set:function(e){const r=this._zone;this._zoneSubjectFactory=function(){return r&&r!==t.current?r.run(e,this,arguments):e.apply(this,arguments)}}}})}(),o(Subscription.prototype,{_zone:{value:null,writable:!0,configurable:!0},_zoneUnsubscribe:{value:null,writable:!0,configurable:!0},_unsubscribe:{get:function(){if(this._zoneUnsubscribe||this._zoneUnsubscribeCleared)return this._zoneUnsubscribe;const e=Object.getPrototypeOf(this);return e&&e._unsubscribe},set:function(e){this._zone=t.current,e?(this._zoneUnsubscribeCleared=!1,this._zoneUnsubscribe=function(){return this._zone&&this._zone!==t.current?this._zone.run(e,this,arguments):e.apply(this,arguments)}):(this._zoneUnsubscribe=e,this._zoneUnsubscribeCleared=!0)}}}),function(){const e=Subscriber.prototype.next,r=Subscriber.prototype.error,n=Subscriber.prototype.complete;Object.defineProperty(Subscriber.prototype,"destination",{configurable:!0,get:function(){return this._zoneDestination},set:function(e){this._zone=t.current,this._zoneDestination=e}}),Subscriber.prototype.next=function(){const r=this._zone;return r&&r!==t.current?r.run(e,this,arguments,"rxjs.Subscriber.next"):e.apply(this,arguments)},Subscriber.prototype.error=function(){const e=this._zone;return e&&e!==t.current?e.run(r,this,arguments,"rxjs.Subscriber.error"):r.apply(this,arguments)},Subscriber.prototype.complete=function(){const e=this._zone;return e&&e!==t.current?e.run(n,this,arguments,"rxjs.Subscriber.complete"):n.call(this)}}()}))}patchRxJs(Zone);eLBx)'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchSocketIo(Zone) { Zone.__load_patch('socketio', (global, Zone, api) => { Zone[Zone.__symbol__('socketio')] = function patchSocketIO(io) { // patch io.Socket.prototype event listener related method api.patchEventTarget(global, api, [io.Socket.prototype], { useG: false, chkDup: false, rt: true, diff: (task, delegate) => { return task.callback === delegate; }, }); // also patch io.Socket.prototype.on/off/removeListener/removeAllListeners io.Socket.prototype.on = io.Socket.prototype.addEventListener; io.Socket.prototype.off = io.Socket.prototype.removeListener = io.Socket.prototype.removeAllListeners = io.Socket.prototype.removeEventListener; }; }); } patchSocketIo(Zone); 9?!x"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchSocketIo(t){t.__load_patch("socketio",((t,e,o)=>{e[e.__symbol__("socketio")]=function e(c){o.patchEventTarget(t,o,[c.Socket.prototype],{useG:!1,chkDup:!1,rt:!0,diff:(t,e)=>t.callback===e}),c.Socket.prototype.on=c.Socket.prototype.addEventListener,c.Socket.prototype.off=c.Socket.prototype.removeListener=c.Socket.prototype.removeAllListeners=c.Socket.prototype.removeEventListener}}))}patchSocketIo(Zone);ȼԽ-x"'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchUserMedia(Zone) { Zone.__load_patch('getUserMedia', (global, Zone, api) => { function wrapFunctionArgs(func, source) { return function () { const args = Array.prototype.slice.call(arguments); const wrappedArgs = api.bindArguments(args, func.name); return func.apply(this, wrappedArgs); }; } let navigator = global['navigator']; if (navigator && navigator.getUserMedia) { navigator.getUserMedia = wrapFunctionArgs(navigator.getUserMedia); } }); } patchUserMedia(Zone); 2$xe"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchUserMedia(e){e.__load_patch("getUserMedia",((e,t,a)=>{let r=e.navigator;r&&r.getUserMedia&&(r.getUserMedia=function i(e){return function(){const t=Array.prototype.slice.call(arguments),r=a.bindArguments(t,e.name);return e.apply(this,r)}}(r.getUserMedia))}))}patchUserMedia(Zone);a팪0x'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ function patchJasmine(Zone) { Zone.__load_patch('jasmine', (global, Zone, api) => { const __extends = function (d, b) { for (const p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : ((__.prototype = b.prototype), new __()); }; // Patch jasmine's describe/it/beforeEach/afterEach functions so test code always runs // in a testZone (ProxyZone). (See: angular/zone.js#91 & angular/angular#10503) if (!Zone) throw new Error('Missing: zone.js'); if (typeof jest !== 'undefined') { // return if jasmine is a light implementation inside jest // in this case, we are running inside jest not jasmine return; } if (typeof jasmine == 'undefined' || jasmine['__zone_patch__']) { return; } jasmine['__zone_patch__'] = true; const SyncTestZoneSpec = Zone['SyncTestZoneSpec']; const ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!SyncTestZoneSpec) throw new Error('Missing: SyncTestZoneSpec'); if (!ProxyZoneSpec) throw new Error('Missing: ProxyZoneSpec'); const ambientZone = Zone.current; const symbol = Zone.__symbol__; // whether patch jasmine clock when in fakeAsync const disablePatchingJasmineClock = global[symbol('fakeAsyncDisablePatchingClock')] === true; // the original variable name fakeAsyncPatchLock is not accurate, so the name will be // fakeAsyncAutoFakeAsyncWhenClockPatched and if this enablePatchingJasmineClock is false, we // also automatically disable the auto jump into fakeAsync feature const enableAutoFakeAsyncWhenClockPatched = !disablePatchingJasmineClock && (global[symbol('fakeAsyncPatchLock')] === true || global[symbol('fakeAsyncAutoFakeAsyncWhenClockPatched')] === true); const ignoreUnhandledRejection = global[symbol('ignoreUnhandledRejection')] === true; if (!ignoreUnhandledRejection) { const globalErrors = jasmine.GlobalErrors; if (globalErrors && !jasmine[symbol('GlobalErrors')]) { jasmine[symbol('GlobalErrors')] = globalErrors; jasmine.GlobalErrors = function () { const instance = new globalErrors(); const originalInstall = instance.install; if (originalInstall && !instance[symbol('install')]) { instance[symbol('install')] = originalInstall; instance.install = function () { const isNode = typeof process !== 'undefined' && !!process.on; // Note: Jasmine checks internally if `process` and `process.on` is defined. // Otherwise, it installs the browser rejection handler through the // `global.addEventListener`. This code may be run in the browser environment where // `process` is not defined, and this will lead to a runtime exception since webpack 5 // removed automatic Node.js polyfills. Note, that events are named differently, it's // `unhandledRejection` in Node.js and `unhandledrejection` in the browser. const originalHandlers = isNode ? process.listeners('unhandledRejection') : global.eventListeners('unhandledrejection'); const result = originalInstall.apply(this, arguments); isNode ? process.removeAllListeners('unhandledRejection') : global.removeAllListeners('unhandledrejection'); if (originalHandlers) { originalHandlers.forEach((handler) => { if (isNode) { process.on('unhandledRejection', handler); } else { global.addEventListener('unhandledrejection', handler); } }); } return result; }; } return instance; }; } } // Monkey patch all of the jasmine DSL so that each function runs in appropriate zone. const jasmineEnv = jasmine.getEnv(); ['describe', 'xdescribe', 'fdescribe'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[methodName] = function (description, specDefinitions) { return originalJasmineFn.call(this, description, wrapDescribeInZone(description, specDefinitions)); }; }); ['it', 'xit', 'fit'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (description, specDefinitions, timeout) { arguments[1] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); ['beforeEach', 'afterEach', 'beforeAll', 'afterAll'].forEach((methodName) => { let originalJasmineFn = jasmineEnv[methodName]; jasmineEnv[symbol(methodName)] = originalJasmineFn; jasmineEnv[methodName] = function (specDefinitions, timeout) { arguments[0] = wrapTestInZone(specDefinitions); return originalJasmineFn.apply(this, arguments); }; }); if (!disablePatchingJasmineClock) { // need to patch jasmine.clock().mockDate and jasmine.clock().tick() so // they can work properly in FakeAsyncTest const originalClockFn = (jasmine[symbol('clock')] = jasmine['clock']); jasmine['clock'] = function () { const clock = originalClockFn.apply(this, arguments); if (!clock[symbol('patched')]) { clock[symbol('patched')] = symbol('patched'); const originalTick = (clock[symbol('tick')] = clock.tick); clock.tick = function () { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { return fakeAsyncZoneSpec.tick.apply(fakeAsyncZoneSpec, arguments); } return originalTick.apply(this, arguments); }; const originalMockDate = (clock[symbol('mockDate')] = clock.mockDate); clock.mockDate = function () { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { const dateTime = arguments.length > 0 ? arguments[0] : new Date(); return fakeAsyncZoneSpec.setFakeBaseSystemTime.apply(fakeAsyncZoneSpec, dateTime && typeof dateTime.getTime === 'function' ? [dateTime.getTime()] : arguments); } return originalMockDate.apply(this, arguments); }; // for auto go into fakeAsync feature, we need the flag to enable it if (enableAutoFakeAsyncWhenClockPatched) { ['install', 'uninstall'].forEach((methodName) => { const originalClockFn = (clock[symbol(methodName)] = clock[methodName]); clock[methodName] = function () { const FakeAsyncTestZoneSpec = Zone['FakeAsyncTestZoneSpec']; if (FakeAsyncTestZoneSpec) { jasmine[symbol('clockInstalled')] = 'install' === methodName; return; } return originalClockFn.apply(this, arguments); }; }); } } return clock; }; } // monkey patch createSpyObj to make properties enumerable to true if (!jasmine[Zone.__symbol__('createSpyObj')]) { const originalCreateSpyObj = jasmine.createSpyObj; jasmine[Zone.__symbol__('createSpyObj')] = originalCreateSpyObj; jasmine.createSpyObj = function () { const args = Array.prototype.slice.call(arguments); const propertyNames = args.length >= 3 ? args[2] : null; let spyObj; if (propertyNames) { const defineProperty = Object.defineProperty; Object.defineProperty = function (obj, p, attributes) { return defineProperty.call(this, obj, p, { ...attributes, configurable: true, enumerable: true, }); }; try { spyObj = originalCreateSpyObj.apply(this, args); } finally { Object.defineProperty = defineProperty; } } else { spyObj = originalCreateSpyObj.apply(this, args); } return spyObj; }; } /** * Gets a function wrapping the body of a Jasmine `describe` block to execute in a * synchronous-only zone. */ function wrapDescribeInZone(description, describeBody) { return function () { // Create a synchronous-only zone in which to run `describe` blocks in order to raise an // error if any asynchronous operations are attempted inside of a `describe`. const syncZone = ambientZone.fork(new SyncTestZoneSpec(`jasmine.describe#${description}`)); return syncZone.run(describeBody, this, arguments); }; } function runInTestZone(testBody, applyThis, queueRunner, done) { const isClockInstalled = !!jasmine[symbol('clockInstalled')]; queueRunner.testProxyZoneSpec; const testProxyZone = queueRunner.testProxyZone; if (isClockInstalled && enableAutoFakeAsyncWhenClockPatched) { // auto run a fakeAsync const fakeAsyncModule = Zone[Zone.__symbol__('fakeAsyncTest')]; if (fakeAsyncModule && typeof fakeAsyncModule.fakeAsync === 'function') { testBody = fakeAsyncModule.fakeAsync(testBody); } } if (done) { return testProxyZone.run(testBody, applyThis, [done]); } else { return testProxyZone.run(testBody, applyThis); } } /** * Gets a function wrapping the body of a Jasmine `it/beforeEach/afterEach` block to * execute in a ProxyZone zone. * This will run in `testProxyZone`. The `testProxyZone` will be reset by the `ZoneQueueRunner` */ function wrapTestInZone(testBody) { // The `done` callback is only passed through if the function expects at least one argument. // Note we have to make a function with correct number of arguments, otherwise jasmine will // think that all functions are sync or async. return (testBody && (testBody.length ? function (done) { return runInTestZone(testBody, this, this.queueRunner, done); } : function () { return runInTestZone(testBody, this, this.queueRunner); })); } const QueueRunner = jasmine.QueueRunner; jasmine.QueueRunner = (function (_super) { __extends(ZoneQueueRunner, _super); function ZoneQueueRunner(attrs) { if (attrs.onComplete) { attrs.onComplete = ((fn) => () => { // All functions are done, clear the test zone. this.testProxyZone = null; this.testProxyZoneSpec = null; ambientZone.scheduleMicroTask('jasmine.onComplete', fn); })(attrs.onComplete); } const nativeSetTimeout = global[Zone.__symbol__('setTimeout')]; const nativeClearTimeout = global[Zone.__symbol__('clearTimeout')]; if (nativeSetTimeout) { // should run setTimeout inside jasmine outside of zone attrs.timeout = { setTimeout: nativeSetTimeout ? nativeSetTimeout : global.setTimeout, clearTimeout: nativeClearTimeout ? nativeClearTimeout : global.clearTimeout, }; } // create a userContext to hold the queueRunner itself // so we can access the testProxy in it/xit/beforeEach ... if (jasmine.UserContext) { if (!attrs.userContext) { attrs.userContext = new jasmine.UserContext(); } attrs.userContext.queueRunner = this; } else { if (!attrs.userContext) { attrs.userContext = {}; } attrs.userContext.queueRunner = this; } // patch attrs.onException const onException = attrs.onException; attrs.onException = function (error) { if (error && error.message === 'Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL.') { // jasmine timeout, we can make the error message more // reasonable to tell what tasks are pending const proxyZoneSpec = this && this.testProxyZoneSpec; if (proxyZoneSpec) { const pendingTasksInfo = proxyZoneSpec.getAndClearPendingTasksInfo(); try { // try catch here in case error.message is not writable error.message += pendingTasksInfo; } catch (err) { } } } if (onException) { onException.call(this, error); } }; _super.call(this, attrs); } ZoneQueueRunner.prototype.execute = function () { let zone = Zone.current; let isChildOfAmbientZone = false; while (zone) { if (zone === ambientZone) { isChildOfAmbientZone = true; break; } zone = zone.parent; } if (!isChildOfAmbientZone) throw new Error('Unexpected Zone: ' + Zone.current.name); // This is the zone which will be used for running individual tests. // It will be a proxy zone, so that the tests function can retroactively install // different zones. // Example: // - In beforeEach() do childZone = Zone.current.fork(...); // - In it() try to do fakeAsync(). The issue is that because the beforeEach forked the // zone outside of fakeAsync it will be able to escape the fakeAsync rules. // - Because ProxyZone is parent fo `childZone` fakeAsync can retroactively add // fakeAsync behavior to the childZone. this.testProxyZoneSpec = new ProxyZoneSpec(); this.testProxyZone = ambientZone.fork(this.testProxyZoneSpec); if (!Zone.currentTask) { // if we are not running in a task then if someone would register a // element.addEventListener and then calling element.click() the // addEventListener callback would think that it is the top most task and would // drain the microtask queue on element.click() which would be incorrect. // For this reason we always force a task when running jasmine tests. Zone.current.scheduleMicroTask('jasmine.execute().forceTask', () => QueueRunner.prototype.execute.call(this)); } else { _super.prototype.execute.call(this); } }; return ZoneQueueRunner; })(QueueRunner); }); } function patchJest(Zone) { Zone.__load_patch('jest', (context, Zone, api) => { if (typeof jest === 'undefined' || jest['__zone_patch__']) { return; } // From jest 29 and jest-preset-angular v13, the module transform logic // changed, and now jest-preset-angular use the use the tsconfig target // other than the hardcoded one, https://github.com/thymikee/jest-preset-angular/issues/2010 // But jest-angular-preset doesn't introduce the @babel/plugin-transform-async-to-generator // which is needed by angular since `async/await` still need to be transformed // to promise for ES2017+ target. // So for now, we disable to output the uncaught error console log for a temp solution, // until jest-preset-angular find a proper solution. Zone[api.symbol('ignoreConsoleErrorUncaughtError')] = true; jest['__zone_patch__'] = true; const ProxyZoneSpec = Zone['ProxyZoneSpec']; const SyncTestZoneSpec = Zone['SyncTestZoneSpec']; if (!ProxyZoneSpec) { throw new Error('Missing ProxyZoneSpec'); } const rootZone = Zone.current; const syncZone = rootZone.fork(new SyncTestZoneSpec('jest.describe')); const proxyZoneSpec = new ProxyZoneSpec(); const proxyZone = rootZone.fork(proxyZoneSpec); function wrapDescribeFactoryInZone(originalJestFn) { return function (...tableArgs) { const originalDescribeFn = originalJestFn.apply(this, tableArgs); return function (...args) { args[1] = wrapDescribeInZone(args[1]); return originalDescribeFn.apply(this, args); }; }; } function wrapTestFactoryInZone(originalJestFn) { return function (...tableArgs) { return function (...args) { args[1] = wrapTestInZone(args[1]); return originalJestFn.apply(this, tableArgs).apply(this, args); }; }; } /** * Gets a function wrapping the body of a jest `describe` block to execute in a * synchronous-only zone. */ function wrapDescribeInZone(describeBody) { return function (...args) { return syncZone.run(describeBody, this, args); }; } /** * Gets a function wrapping the body of a jest `it/beforeEach/afterEach` block to * execute in a ProxyZone zone. * This will run in the `proxyZone`. */ function wrapTestInZone(testBody, isTestFunc = false) { if (typeof testBody !== 'function') { return testBody; } const wrappedFunc = function () { if (Zone[api.symbol('useFakeTimersCalled')] === true && testBody && !testBody.isFakeAsync) { // jest.useFakeTimers is called, run into fakeAsyncTest automatically. const fakeAsyncModule = Zone[Zone.__symbol__('fakeAsyncTest')]; if (fakeAsyncModule && typeof fakeAsyncModule.fakeAsync === 'function') { testBody = fakeAsyncModule.fakeAsync(testBody); } } proxyZoneSpec.isTestFunc = isTestFunc; return proxyZone.run(testBody, null, arguments); }; // Update the length of wrappedFunc to be the same as the length of the testBody // So jest core can handle whether the test function has `done()` or not correctly Object.defineProperty(wrappedFunc, 'length', { configurable: true, writable: true, enumerable: false, }); wrappedFunc.length = testBody.length; return wrappedFunc; } ['describe', 'xdescribe', 'fdescribe'].forEach((methodName) => { let originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function (...args) { args[1] = wrapDescribeInZone(args[1]); return originalJestFn.apply(this, args); }; context[methodName].each = wrapDescribeFactoryInZone(originalJestFn.each); }); context.describe.only = context.fdescribe; context.describe.skip = context.xdescribe; ['it', 'xit', 'fit', 'test', 'xtest'].forEach((methodName) => { let originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function (...args) { args[1] = wrapTestInZone(args[1], true); return originalJestFn.apply(this, args); }; context[methodName].each = wrapTestFactoryInZone(originalJestFn.each); context[methodName].todo = originalJestFn.todo; context[methodName].failing = originalJestFn.failing; }); context.it.only = context.fit; context.it.skip = context.xit; context.test.only = context.fit; context.test.skip = context.xit; ['beforeEach', 'afterEach', 'beforeAll', 'afterAll'].forEach((methodName) => { let originalJestFn = context[methodName]; if (context[Zone.__symbol__(methodName)]) { return; } context[Zone.__symbol__(methodName)] = originalJestFn; context[methodName] = function (...args) { args[0] = wrapTestInZone(args[0]); return originalJestFn.apply(this, args); }; }); Zone.patchJestObject = function patchJestObject(Timer, isModern = false) { // check whether currently the test is inside fakeAsync() function isPatchingFakeTimer() { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); return !!fakeAsyncZoneSpec; } // check whether the current function is inside `test/it` or other methods // such as `describe/beforeEach` function isInTestFunc() { const proxyZoneSpec = Zone.current.get('ProxyZoneSpec'); return proxyZoneSpec && proxyZoneSpec.isTestFunc; } if (Timer[api.symbol('fakeTimers')]) { return; } Timer[api.symbol('fakeTimers')] = true; // patch jest fakeTimer internal method to make sure no console.warn print out api.patchMethod(Timer, '_checkFakeTimers', (delegate) => { return function (self, args) { if (isPatchingFakeTimer()) { return true; } else { return delegate.apply(self, args); } }; }); // patch useFakeTimers(), set useFakeTimersCalled flag, and make test auto run into fakeAsync api.patchMethod(Timer, 'useFakeTimers', (delegate) => { return function (self, args) { Zone[api.symbol('useFakeTimersCalled')] = true; if (isModern || isInTestFunc()) { return delegate.apply(self, args); } return self; }; }); // patch useRealTimers(), unset useFakeTimers flag api.patchMethod(Timer, 'useRealTimers', (delegate) => { return function (self, args) { Zone[api.symbol('useFakeTimersCalled')] = false; if (isModern || isInTestFunc()) { return delegate.apply(self, args); } return self; }; }); // patch setSystemTime(), call setCurrentRealTime() in the fakeAsyncTest api.patchMethod(Timer, 'setSystemTime', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec && isPatchingFakeTimer()) { fakeAsyncZoneSpec.setFakeBaseSystemTime(args[0]); } else { return delegate.apply(self, args); } }; }); // patch getSystemTime(), call getCurrentRealTime() in the fakeAsyncTest api.patchMethod(Timer, 'getRealSystemTime', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec && isPatchingFakeTimer()) { return fakeAsyncZoneSpec.getRealSystemTime(); } else { return delegate.apply(self, args); } }; }); // patch runAllTicks(), run all microTasks inside fakeAsync api.patchMethod(Timer, 'runAllTicks', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flushMicrotasks(); } else { return delegate.apply(self, args); } }; }); // patch runAllTimers(), run all macroTasks inside fakeAsync api.patchMethod(Timer, 'runAllTimers', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flush(100, true); } else { return delegate.apply(self, args); } }; }); // patch advanceTimersByTime(), call tick() in the fakeAsyncTest api.patchMethod(Timer, 'advanceTimersByTime', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.tick(args[0]); } else { return delegate.apply(self, args); } }; }); // patch runOnlyPendingTimers(), call flushOnlyPendingTimers() in the fakeAsyncTest api.patchMethod(Timer, 'runOnlyPendingTimers', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.flushOnlyPendingTimers(); } else { return delegate.apply(self, args); } }; }); // patch advanceTimersToNextTimer(), call tickToNext() in the fakeAsyncTest api.patchMethod(Timer, 'advanceTimersToNextTimer', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.tickToNext(args[0]); } else { return delegate.apply(self, args); } }; }); // patch clearAllTimers(), call removeAllTimers() in the fakeAsyncTest api.patchMethod(Timer, 'clearAllTimers', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { fakeAsyncZoneSpec.removeAllTimers(); } else { return delegate.apply(self, args); } }; }); // patch getTimerCount(), call getTimerCount() in the fakeAsyncTest api.patchMethod(Timer, 'getTimerCount', (delegate) => { return function (self, args) { const fakeAsyncZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncZoneSpec) { return fakeAsyncZoneSpec.getTimerCount(); } else { return delegate.apply(self, args); } }; }); }; }); } function patchMocha(Zone) { Zone.__load_patch('mocha', (global, Zone) => { const Mocha = global.Mocha; if (typeof Mocha === 'undefined') { // return if Mocha is not available, because now zone-testing // will load mocha patch with jasmine/jest patch return; } if (typeof Zone === 'undefined') { throw new Error('Missing Zone.js'); } const ProxyZoneSpec = Zone['ProxyZoneSpec']; const SyncTestZoneSpec = Zone['SyncTestZoneSpec']; if (!ProxyZoneSpec) { throw new Error('Missing ProxyZoneSpec'); } if (Mocha['__zone_patch__']) { throw new Error('"Mocha" has already been patched with "Zone".'); } Mocha['__zone_patch__'] = true; const rootZone = Zone.current; const syncZone = rootZone.fork(new SyncTestZoneSpec('Mocha.describe')); let testZone = null; const suiteZone = rootZone.fork(new ProxyZoneSpec()); const mochaOriginal = { after: global.after, afterEach: global.afterEach, before: global.before, beforeEach: global.beforeEach, describe: global.describe, it: global.it, }; function modifyArguments(args, syncTest, asyncTest) { for (let i = 0; i < args.length; i++) { let arg = args[i]; if (typeof arg === 'function') { // The `done` callback is only passed through if the function expects at // least one argument. // Note we have to make a function with correct number of arguments, // otherwise mocha will // think that all functions are sync or async. args[i] = arg.length === 0 ? syncTest(arg) : asyncTest(arg); // Mocha uses toString to view the test body in the result list, make sure we return the // correct function body args[i].toString = function () { return arg.toString(); }; } } return args; } function wrapDescribeInZone(args) { const syncTest = function (fn) { return function () { return syncZone.run(fn, this, arguments); }; }; return modifyArguments(args, syncTest); } function wrapTestInZone(args) { const asyncTest = function (fn) { return function (done) { return testZone.run(fn, this, [done]); }; }; const syncTest = function (fn) { return function () { return testZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } function wrapSuiteInZone(args) { const asyncTest = function (fn) { return function (done) { return suiteZone.run(fn, this, [done]); }; }; const syncTest = function (fn) { return function () { return suiteZone.run(fn, this); }; }; return modifyArguments(args, syncTest, asyncTest); } global.describe = global.suite = function () { return mochaOriginal.describe.apply(this, wrapDescribeInZone(arguments)); }; global.xdescribe = global.suite.skip = global.describe.skip = function () { return mochaOriginal.describe.skip.apply(this, wrapDescribeInZone(arguments)); }; global.describe.only = global.suite.only = function () { return mochaOriginal.describe.only.apply(this, wrapDescribeInZone(arguments)); }; global.it = global.specify = global.test = function () { return mochaOriginal.it.apply(this, wrapTestInZone(arguments)); }; global.xit = global.xspecify = global.it.skip = function () { return mochaOriginal.it.skip.apply(this, wrapTestInZone(arguments)); }; global.it.only = global.test.only = function () { return mochaOriginal.it.only.apply(this, wrapTestInZone(arguments)); }; global.after = global.suiteTeardown = function () { return mochaOriginal.after.apply(this, wrapSuiteInZone(arguments)); }; global.afterEach = global.teardown = function () { return mochaOriginal.afterEach.apply(this, wrapTestInZone(arguments)); }; global.before = global.suiteSetup = function () { return mochaOriginal.before.apply(this, wrapSuiteInZone(arguments)); }; global.beforeEach = global.setup = function () { return mochaOriginal.beforeEach.apply(this, wrapTestInZone(arguments)); }; ((originalRunTest, originalRun) => { Mocha.Runner.prototype.runTest = function (fn) { Zone.current.scheduleMicroTask('mocha.forceTask', () => { originalRunTest.call(this, fn); }); }; Mocha.Runner.prototype.run = function (fn) { this.on('test', (e) => { testZone = rootZone.fork(new ProxyZoneSpec()); }); this.on('fail', (test, err) => { const proxyZoneSpec = testZone && testZone.get('ProxyZoneSpec'); if (proxyZoneSpec && err) { try { // try catch here in case err.message is not writable err.message += proxyZoneSpec.getAndClearPendingTasksInfo(); } catch (error) { } } }); return originalRun.call(this, fn); }; })(Mocha.Runner.prototype.runTest, Mocha.Runner.prototype.run); }); } const global$2 = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { const symbolPrefix = global$2['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } const __global = (typeof window !== 'undefined' && window) || (typeof self !== 'undefined' && self) || global; class AsyncTestZoneSpec { finishCallback; failCallback; // Needs to be a getter and not a plain property in order run this just-in-time. Otherwise // `__symbol__` would be evaluated during top-level execution prior to the Zone prefix being // changed for tests. static get symbolParentUnresolved() { return __symbol__('parentUnresolved'); } _pendingMicroTasks = false; _pendingMacroTasks = false; _alreadyErrored = false; _isSync = false; _existingFinishTimer = null; entryFunction = null; runZone = Zone.current; unresolvedChainedPromiseCount = 0; supportWaitUnresolvedChainedPromise = false; constructor(finishCallback, failCallback, namePrefix) { this.finishCallback = finishCallback; this.failCallback = failCallback; this.name = 'asyncTestZone for ' + namePrefix; this.properties = { 'AsyncTestZoneSpec': this }; this.supportWaitUnresolvedChainedPromise = __global[__symbol__('supportWaitUnResolvedChainedPromise')] === true; } isUnresolvedChainedPromisePending() { return this.unresolvedChainedPromiseCount > 0; } _finishCallbackIfDone() { // NOTE: Technically the `onHasTask` could fire together with the initial synchronous // completion in `onInvoke`. `onHasTask` might call this method when it captured e.g. // microtasks in the proxy zone that now complete as part of this async zone run. // Consider the following scenario: // 1. A test `beforeEach` schedules a microtask in the ProxyZone. // 2. An actual empty `it` spec executes in the AsyncTestZone` (using e.g. `waitForAsync`). // 3. The `onInvoke` invokes `_finishCallbackIfDone` because the spec runs synchronously. // 4. We wait the scheduled timeout (see below) to account for unhandled promises. // 5. The microtask from (1) finishes and `onHasTask` is invoked. // --> We register a second `_finishCallbackIfDone` even though we have scheduled a timeout. // If the finish timeout from below is already scheduled, terminate the existing scheduled // finish invocation, avoiding calling `jasmine` `done` multiple times. *Note* that we would // want to schedule a new finish callback in case the task state changes again. if (this._existingFinishTimer !== null) { clearTimeout(this._existingFinishTimer); this._existingFinishTimer = null; } if (!(this._pendingMicroTasks || this._pendingMacroTasks || (this.supportWaitUnresolvedChainedPromise && this.isUnresolvedChainedPromisePending()))) { // We wait until the next tick because we would like to catch unhandled promises which could // cause test logic to be executed. In such cases we cannot finish with tasks pending then. this.runZone.run(() => { this._existingFinishTimer = setTimeout(() => { if (!this._alreadyErrored && !(this._pendingMicroTasks || this._pendingMacroTasks)) { this.finishCallback(); } }, 0); }); } } patchPromiseForTest() { if (!this.supportWaitUnresolvedChainedPromise) { return; } const patchPromiseForTest = Promise[Zone.__symbol__('patchPromiseForTest')]; if (patchPromiseForTest) { patchPromiseForTest(); } } unPatchPromiseForTest() { if (!this.supportWaitUnresolvedChainedPromise) { return; } const unPatchPromiseForTest = Promise[Zone.__symbol__('unPatchPromiseForTest')]; if (unPatchPromiseForTest) { unPatchPromiseForTest(); } } // ZoneSpec implementation below. name; properties; onScheduleTask(delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } if (task.type === 'microTask' && task.data && task.data instanceof Promise) { // check whether the promise is a chained promise if (task.data[AsyncTestZoneSpec.symbolParentUnresolved] === true) { // chained promise is being scheduled this.unresolvedChainedPromiseCount--; } } return delegate.scheduleTask(target, task); } onInvokeTask(delegate, current, target, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.invokeTask(target, task, applyThis, applyArgs); } onCancelTask(delegate, current, target, task) { if (task.type !== 'eventTask') { this._isSync = false; } return delegate.cancelTask(target, task); } // Note - we need to use onInvoke at the moment to call finish when a test is // fully synchronous. TODO(juliemr): remove this when the logic for // onHasTask changes and it calls whenever the task queues are dirty. // updated by(JiaLiPassion), only call finish callback when no task // was scheduled/invoked/canceled. onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { if (!this.entryFunction) { this.entryFunction = delegate; } try { this._isSync = true; return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } finally { // We need to check the delegate is the same as entryFunction or not. // Consider the following case. // // asyncTestZone.run(() => { // Here the delegate will be the entryFunction // Zone.current.run(() => { // Here the delegate will not be the entryFunction // }); // }); // // We only want to check whether there are async tasks scheduled // for the entry function. if (this._isSync && this.entryFunction === delegate) { this._finishCallbackIfDone(); } } } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { // Let the parent try to handle the error. const result = parentZoneDelegate.handleError(targetZone, error); if (result) { this.failCallback(error); this._alreadyErrored = true; } return false; } onHasTask(delegate, current, target, hasTaskState) { delegate.hasTask(target, hasTaskState); // We should only trigger finishCallback when the target zone is the AsyncTestZone // Consider the following cases. // // const childZone = asyncTestZone.fork({ // name: 'child', // onHasTask: ... // }); // // So we have nested zones declared the onHasTask hook, in this case, // the onHasTask will be triggered twice, and cause the finishCallbackIfDone() // is also be invoked twice. So we need to only trigger the finishCallbackIfDone() // when the current zone is the same as the target zone. if (current !== target) { return; } if (hasTaskState.change == 'microTask') { this._pendingMicroTasks = hasTaskState.microTask; this._finishCallbackIfDone(); } else if (hasTaskState.change == 'macroTask') { this._pendingMacroTasks = hasTaskState.macroTask; this._finishCallbackIfDone(); } } } function patchAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['AsyncTestZoneSpec'] = AsyncTestZoneSpec; Zone.__load_patch('asynctest', (global, Zone, api) => { /** * Wraps a test function in an asynchronous test zone. The test will automatically * complete when all asynchronous calls within this zone are done. */ Zone[api.symbol('asyncTest')] = function asyncTest(fn) { // If we're running using the Jasmine test framework, adapt to call the 'done' // function when asynchronous activity is finished. if (global.jasmine) { // Not using an arrow function to preserve context passed from call site return function (done) { if (!done) { // if we run beforeEach in @angular/core/testing/testing_internal then we get no done // fake it here and assume sync. done = function () { }; done.fail = function (e) { throw e; }; } runInTestZone(fn, this, done, (err) => { if (typeof err === 'string') { return done.fail(new Error(err)); } else { done.fail(err); } }); }; } // Otherwise, return a promise which will resolve when asynchronous activity // is finished. This will be correctly consumed by the Mocha framework with // it('...', async(myFn)); or can be used in a custom framework. // Not using an arrow function to preserve context passed from call site return function () { return new Promise((finishCallback, failCallback) => { runInTestZone(fn, this, finishCallback, failCallback); }); }; }; function runInTestZone(fn, context, finishCallback, failCallback) { const currentZone = Zone.current; const AsyncTestZoneSpec = Zone['AsyncTestZoneSpec']; if (AsyncTestZoneSpec === undefined) { throw new Error('AsyncTestZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/async-test'); } const ProxyZoneSpec = Zone['ProxyZoneSpec']; if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the async() test helper but could not be found. ' + 'Please make sure that your environment includes zone.js/plugins/proxy'); } const proxyZoneSpec = ProxyZoneSpec.get(); ProxyZoneSpec.assertPresent(); // We need to create the AsyncTestZoneSpec outside the ProxyZone. // If we do it in ProxyZone then we will get to infinite recursion. const proxyZone = Zone.current.getZoneWith('ProxyZoneSpec'); const previousDelegate = proxyZoneSpec.getDelegate(); proxyZone.parent.run(() => { const testZoneSpec = new AsyncTestZoneSpec(() => { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's // still this one. Otherwise, assume // it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(() => { finishCallback(); }); }, (error) => { // Need to restore the original zone. if (proxyZoneSpec.getDelegate() == testZoneSpec) { // Only reset the zone spec if it's sill this one. Otherwise, assume it's OK. proxyZoneSpec.setDelegate(previousDelegate); } testZoneSpec.unPatchPromiseForTest(); currentZone.run(() => { failCallback(error); }); }, 'test'); proxyZoneSpec.setDelegate(testZoneSpec); testZoneSpec.patchPromiseForTest(); }); return Zone.current.runGuarded(fn, context); } }); } const global$1 = (typeof window === 'object' && window) || (typeof self === 'object' && self) || globalThis.global; const OriginalDate = global$1.Date; // Since when we compile this file to `es2015`, and if we define // this `FakeDate` as `class FakeDate`, and then set `FakeDate.prototype` // there will be an error which is `Cannot assign to read only property 'prototype'` // so we need to use function implementation here. function FakeDate() { if (arguments.length === 0) { const d = new OriginalDate(); d.setTime(FakeDate.now()); return d; } else { const args = Array.prototype.slice.call(arguments); return new OriginalDate(...args); } } FakeDate.now = function () { const fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (fakeAsyncTestZoneSpec) { return fakeAsyncTestZoneSpec.getFakeSystemTime(); } return OriginalDate.now.apply(this, arguments); }; FakeDate.UTC = OriginalDate.UTC; FakeDate.parse = OriginalDate.parse; // keep a reference for zone patched timer function let patchedTimers; const timeoutCallback = function () { }; class Scheduler { // Next scheduler id. static nextNodeJSId = 1; static nextId = -1; // Scheduler queue with the tuple of end time and callback function - sorted by end time. _schedulerQueue = []; // Current simulated time in millis. _currentTickTime = 0; // Current fake system base time in millis. _currentFakeBaseSystemTime = OriginalDate.now(); // track requeuePeriodicTimer _currentTickRequeuePeriodicEntries = []; constructor() { } static getNextId() { const id = patchedTimers.nativeSetTimeout.call(global$1, timeoutCallback, 0); patchedTimers.nativeClearTimeout.call(global$1, id); if (typeof id === 'number') { return id; } // in NodeJS, we just use a number for fakeAsync, since it will not // conflict with native TimeoutId return Scheduler.nextNodeJSId++; } getCurrentTickTime() { return this._currentTickTime; } getFakeSystemTime() { return this._currentFakeBaseSystemTime + this._currentTickTime; } setFakeBaseSystemTime(fakeBaseSystemTime) { this._currentFakeBaseSystemTime = fakeBaseSystemTime; } getRealSystemTime() { return OriginalDate.now(); } scheduleFunction(cb, delay, options) { options = { ...{ args: [], isPeriodic: false, isRequestAnimationFrame: false, id: -1, isRequeuePeriodic: false, }, ...options, }; let currentId = options.id < 0 ? Scheduler.nextId : options.id; Scheduler.nextId = Scheduler.getNextId(); let endTime = this._currentTickTime + delay; // Insert so that scheduler queue remains sorted by end time. let newEntry = { endTime: endTime, id: currentId, func: cb, args: options.args, delay: delay, isPeriodic: options.isPeriodic, isRequestAnimationFrame: options.isRequestAnimationFrame, }; if (options.isRequeuePeriodic) { this._currentTickRequeuePeriodicEntries.push(newEntry); } let i = 0; for (; i < this._schedulerQueue.length; i++) { let currentEntry = this._schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } this._schedulerQueue.splice(i, 0, newEntry); return currentId; } removeScheduledFunctionWithId(id) { for (let i = 0; i < this._schedulerQueue.length; i++) { if (this._schedulerQueue[i].id == id) { this._schedulerQueue.splice(i, 1); break; } } } removeAll() { this._schedulerQueue = []; } getTimerCount() { return this._schedulerQueue.length; } tickToNext(step = 1, doTick, tickOptions) { if (this._schedulerQueue.length < step) { return; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const targetTask = this._schedulerQueue[step - 1]; this.tick(targetTask.endTime - startTime, doTick, tickOptions); } tick(millis = 0, doTick, tickOptions) { let finalTime = this._currentTickTime + millis; let lastCurrentTime = 0; tickOptions = Object.assign({ processNewMacroTasksSynchronously: true }, tickOptions); // we need to copy the schedulerQueue so nested timeout // will not be wrongly called in the current tick // https://github.com/angular/angular/issues/33799 const schedulerQueue = tickOptions.processNewMacroTasksSynchronously ? this._schedulerQueue : this._schedulerQueue.slice(); if (schedulerQueue.length === 0 && doTick) { doTick(millis); return; } while (schedulerQueue.length > 0) { // clear requeueEntries before each loop this._currentTickRequeuePeriodicEntries = []; let current = schedulerQueue[0]; if (finalTime < current.endTime) { // Done processing the queue since it's sorted by endTime. break; } else { // Time to run scheduled function. Remove it from the head of queue. let current = schedulerQueue.shift(); if (!tickOptions.processNewMacroTasksSynchronously) { const idx = this._schedulerQueue.indexOf(current); if (idx >= 0) { this._schedulerQueue.splice(idx, 1); } } lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } let retval = current.func.apply(global$1, current.isRequestAnimationFrame ? [this._currentTickTime] : current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } // check is there any requeue periodic entry is added in // current loop, if there is, we need to add to current loop if (!tickOptions.processNewMacroTasksSynchronously) { this._currentTickRequeuePeriodicEntries.forEach((newEntry) => { let i = 0; for (; i < schedulerQueue.length; i++) { const currentEntry = schedulerQueue[i]; if (newEntry.endTime < currentEntry.endTime) { break; } } schedulerQueue.splice(i, 0, newEntry); }); } } } lastCurrentTime = this._currentTickTime; this._currentTickTime = finalTime; if (doTick) { doTick(this._currentTickTime - lastCurrentTime); } } flushOnlyPendingTimers(doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick, { processNewMacroTasksSynchronously: false }); return this._currentTickTime - startTime; } flush(limit = 20, flushPeriodic = false, doTick) { if (flushPeriodic) { return this.flushPeriodic(doTick); } else { return this.flushNonPeriodic(limit, doTick); } } flushPeriodic(doTick) { if (this._schedulerQueue.length === 0) { return 0; } // Find the last task currently queued in the scheduler queue and tick // till that time. const startTime = this._currentTickTime; const lastTask = this._schedulerQueue[this._schedulerQueue.length - 1]; this.tick(lastTask.endTime - startTime, doTick); return this._currentTickTime - startTime; } flushNonPeriodic(limit, doTick) { const startTime = this._currentTickTime; let lastCurrentTime = 0; let count = 0; while (this._schedulerQueue.length > 0) { count++; if (count > limit) { throw new Error('flush failed after reaching the limit of ' + limit + ' tasks. Does your code use a polling timeout?'); } // flush only non-periodic timers. // If the only remaining tasks are periodic(or requestAnimationFrame), finish flushing. if (this._schedulerQueue.filter((task) => !task.isPeriodic && !task.isRequestAnimationFrame) .length === 0) { break; } const current = this._schedulerQueue.shift(); lastCurrentTime = this._currentTickTime; this._currentTickTime = current.endTime; if (doTick) { // Update any secondary schedulers like Jasmine mock Date. doTick(this._currentTickTime - lastCurrentTime); } const retval = current.func.apply(global$1, current.args); if (!retval) { // Uncaught exception in the current scheduled function. Stop processing the queue. break; } } return this._currentTickTime - startTime; } } class FakeAsyncTestZoneSpec { trackPendingRequestAnimationFrame; macroTaskOptions; static assertInZone() { if (Zone.current.get('FakeAsyncTestZoneSpec') == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } _scheduler = new Scheduler(); _microtasks = []; _lastError = null; _uncaughtPromiseErrors = Promise[Zone.__symbol__('uncaughtPromiseErrors')]; pendingPeriodicTimers = []; pendingTimers = []; patchDateLocked = false; constructor(namePrefix, trackPendingRequestAnimationFrame = false, macroTaskOptions) { this.trackPendingRequestAnimationFrame = trackPendingRequestAnimationFrame; this.macroTaskOptions = macroTaskOptions; this.name = 'fakeAsyncTestZone for ' + namePrefix; // in case user can't access the construction of FakeAsyncTestSpec // user can also define macroTaskOptions by define a global variable. if (!this.macroTaskOptions) { this.macroTaskOptions = global$1[Zone.__symbol__('FakeAsyncTestMacroTask')]; } } _fnAndFlush(fn, completers) { return (...args) => { fn.apply(global$1, args); if (this._lastError === null) { // Success if (completers.onSuccess != null) { completers.onSuccess.apply(global$1); } // Flush microtasks only on success. this.flushMicrotasks(); } else { // Failure if (completers.onError != null) { completers.onError.apply(global$1); } } // Return true if there were no errors, false otherwise. return this._lastError === null; }; } static _removeTimer(timers, id) { let index = timers.indexOf(id); if (index > -1) { timers.splice(index, 1); } } _dequeueTimer(id) { return () => { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); }; } _requeuePeriodicTimer(fn, interval, args, id) { return () => { // Requeue the timer callback if it's not been canceled. if (this.pendingPeriodicTimers.indexOf(id) !== -1) { this._scheduler.scheduleFunction(fn, interval, { args, isPeriodic: true, id, isRequeuePeriodic: true, }); } }; } _dequeuePeriodicTimer(id) { return () => { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); }; } _setTimeout(fn, delay, args, isTimer = true) { let removeTimerFn = this._dequeueTimer(Scheduler.nextId); // Queue the callback and dequeue the timer on success and error. let cb = this._fnAndFlush(fn, { onSuccess: removeTimerFn, onError: removeTimerFn }); let id = this._scheduler.scheduleFunction(cb, delay, { args, isRequestAnimationFrame: !isTimer }); if (isTimer) { this.pendingTimers.push(id); } return id; } _clearTimeout(id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers, id); this._scheduler.removeScheduledFunctionWithId(id); } _setInterval(fn, interval, args) { let id = Scheduler.nextId; let completers = { onSuccess: null, onError: this._dequeuePeriodicTimer(id) }; let cb = this._fnAndFlush(fn, completers); // Use the callback created above to requeue on success. completers.onSuccess = this._requeuePeriodicTimer(cb, interval, args, id); // Queue the callback and dequeue the periodic timer only on error. this._scheduler.scheduleFunction(cb, interval, { args, isPeriodic: true }); this.pendingPeriodicTimers.push(id); return id; } _clearInterval(id) { FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers, id); this._scheduler.removeScheduledFunctionWithId(id); } _resetLastErrorAndThrow() { let error = this._lastError || this._uncaughtPromiseErrors[0]; this._uncaughtPromiseErrors.length = 0; this._lastError = null; throw error; } getCurrentTickTime() { return this._scheduler.getCurrentTickTime(); } getFakeSystemTime() { return this._scheduler.getFakeSystemTime(); } setFakeBaseSystemTime(realTime) { this._scheduler.setFakeBaseSystemTime(realTime); } getRealSystemTime() { return this._scheduler.getRealSystemTime(); } static patchDate() { if (!!global$1[Zone.__symbol__('disableDatePatching')]) { // we don't want to patch global Date // because in some case, global Date // is already being patched, we need to provide // an option to let user still use their // own version of Date. return; } if (global$1['Date'] === FakeDate) { // already patched return; } global$1['Date']y{ = FakeDate; FakeDate.prototype = OriginalDate.prototype; // try check and reset timers // because jasmine.clock().install() may // have replaced the global timer FakeAsyncTestZoneSpec.checkTimerPatch(); } static resetDate() { if (global$1['Date'] === FakeDate) { global$1['Date'] = OriginalDate; } } static checkTimerPatch() { if (!patchedTimers) { throw new Error('Expected timers to have been patched.'); } if (global$1.setTimeout !== patchedTimers.setTimeout) { global$1.setTimeout = patchedTimers.setTimeout; global$1.clearTimeout = patchedTimers.clearTimeout; } if (global$1.setInterval !== patchedTimers.setInterval) { global$1.setInterval = patchedTimers.setInterval; global$1.clearInterval = patchedTimers.clearInterval; } } lockDatePatch() { this.patchDateLocked = true; FakeAsyncTestZoneSpec.patchDate(); } unlockDatePatch() { this.patchDateLocked = false; FakeAsyncTestZoneSpec.resetDate(); } tickToNext(steps = 1, doTick, tickOptions = { processNewMacroTasksSynchronously: true }) { if (steps <= 0) { return; } FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tickToNext(steps, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } } tick(millis = 0, doTick, tickOptions = { processNewMacroTasksSynchronously: true }) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); this._scheduler.tick(millis, doTick, tickOptions); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } } flushMicrotasks() { FakeAsyncTestZoneSpec.assertInZone(); const flushErrors = () => { if (this._lastError !== null || this._uncaughtPromiseErrors.length) { // If there is an error stop processing the microtask queue and rethrow the error. this._resetLastErrorAndThrow(); } }; while (this._microtasks.length > 0) { let microtask = this._microtasks.shift(); microtask.func.apply(microtask.target, microtask.args); } flushErrors(); } flush(limit, flushPeriodic, doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); const elapsed = this._scheduler.flush(limit, flushPeriodic, doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; } flushOnlyPendingTimers(doTick) { FakeAsyncTestZoneSpec.assertInZone(); this.flushMicrotasks(); const elapsed = this._scheduler.flushOnlyPendingTimers(doTick); if (this._lastError !== null) { this._resetLastErrorAndThrow(); } return elapsed; } removeAllTimers() { FakeAsyncTestZoneSpec.assertInZone(); this._scheduler.removeAll(); this.pendingPeriodicTimers = []; this.pendingTimers = []; } getTimerCount() { return this._scheduler.getTimerCount() + this._microtasks.length; } // ZoneSpec implementation below. name; properties = { 'FakeAsyncTestZoneSpec': this }; onScheduleTask(delegate, current, target, task) { switch (task.type) { case 'microTask': let args = task.data && task.data.args; // should pass additional arguments to callback if have any // currently we know process.nextTick will have such additional // arguments let additionalArgs; if (args) { let callbackIndex = task.data.cbIdx; if (typeof args.length === 'number' && args.length > callbackIndex + 1) { additionalArgs = Array.prototype.slice.call(args, callbackIndex + 1); } } this._microtasks.push({ func: task.invoke, args: additionalArgs, target: task.data && task.data.target, }); break; case 'macroTask': switch (task.source) { case 'setTimeout': task.data['handleId'] = this._setTimeout(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'setImmediate': task.data['handleId'] = this._setTimeout(task.invoke, 0, Array.prototype.slice.call(task.data['args'], 1)); break; case 'setInterval': task.data['handleId'] = this._setInterval(task.invoke, task.data['delay'], Array.prototype.slice.call(task.data['args'], 2)); break; case 'XMLHttpRequest.send': throw new Error('Cannot make XHRs from within a fake async test. Request URL: ' + task.data['url']); case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': // Simulate a requestAnimationFrame by using a setTimeout with 16 ms. // (60 frames per second) task.data['handleId'] = this._setTimeout(task.invoke, 16, task.data['args'], this.trackPendingRequestAnimationFrame); break; default: // user can define which macroTask they want to support by passing // macroTaskOptions const macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { const args = task.data && task.data['args']; const delay = args && args.length > 1 ? args[1] : 0; let callbackArgs = macroTaskOption.callbackArgs ? macroTaskOption.callbackArgs : args; if (!!macroTaskOption.isPeriodic) { // periodic macroTask, use setInterval to simulate task.data['handleId'] = this._setInterval(task.invoke, delay, callbackArgs); task.data.isPeriodic = true; } else { // not periodic, use setTimeout to simulate task.data['handleId'] = this._setTimeout(task.invoke, delay, callbackArgs); } break; } throw new Error('Unknown macroTask scheduled in fake async test: ' + task.source); } break; case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; } onCancelTask(delegate, current, target, task) { switch (task.source) { case 'setTimeout': case 'requestAnimationFrame': case 'webkitRequestAnimationFrame': case 'mozRequestAnimationFrame': return this._clearTimeout(task.data['handleId']); case 'setInterval': return this._clearInterval(task.data['handleId']); default: // user can define which macroTask they want to support by passing // macroTaskOptions const macroTaskOption = this.findMacroTaskOption(task); if (macroTaskOption) { const handleId = task.data['handleId']; return macroTaskOption.isPeriodic ? this._clearInterval(handleId) : this._clearTimeout(handleId); } return delegate.cancelTask(target, task); } } onInvoke(delegate, current, target, callback, applyThis, applyArgs, source) { try { FakeAsyncTestZoneSpec.patchDate(); return delegate.invoke(target, callback, applyThis, applyArgs, source); } finally { if (!this.patchDateLocked) { FakeAsyncTestZoneSpec.resetDate(); } } } findMacroTaskOption(task) { if (!this.macroTaskOptions) { return null; } for (let i = 0; i < this.macroTaskOptions.length; i++) { const macroTaskOption = this.macroTaskOptions[i]; if (macroTaskOption.source === task.source) { return macroTaskOption; } } return null; } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { // ComponentFixture has a special-case handling to detect FakeAsyncTestZoneSpec // and prevent rethrowing the error from the onError subscription since it's handled here. this._lastError = error; return false; // Don't propagate error to parent zone. } } let _fakeAsyncTestZoneSpec = null; function getProxyZoneSpec() { return Zone && Zone['ProxyZoneSpec']; } let _sharedProxyZoneSpec = null; let _sharedProxyZone = null; /** * Clears out the shared fake async zone for a test. * To be called in a global `beforeEach`. * * @experimental */ function resetFakeAsyncZone() { if (_fakeAsyncTestZoneSpec) { _fakeAsyncTestZoneSpec.unlockDatePatch(); } _fakeAsyncTestZoneSpec = null; getProxyZoneSpec()?.get()?.resetDelegate(); _sharedProxyZoneSpec?.resetDelegate(); } /** * Wraps a function to be executed in the fakeAsync zone: * - microtasks are manually executed by calling `flushMicrotasks()`, * - timers are synchronous, `tick()` simulates the asynchronous passage of time. * * When flush is `false`, if there are any pending timers at the end of the function, * an exception will be thrown. * * Can be used to wrap inject() calls. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @param fn * @param options * flush: when true, will drain the macrotask queue after the test function completes. * @returns The function wrapped to be executed in the fakeAsync zone * * @experimental */ function fakeAsync(fn, options = {}) { const { flush = true } = options; // Not using an arrow function to preserve context passed from call site const fakeAsyncFn = function (...args) { const ProxyZoneSpec = getProxyZoneSpec(); if (!ProxyZoneSpec) { throw new Error('ProxyZoneSpec is needed for the fakeAsync() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } const proxyZoneSpec = ProxyZoneSpec.assertPresent(); if (Zone.current.get('FakeAsyncTestZoneSpec')) { throw new Error('fakeAsync() calls can not be nested'); } try { // in case jasmine.clock init a fakeAsyncTestZoneSpec if (!_fakeAsyncTestZoneSpec) { const FakeAsyncTestZoneSpec = Zone && Zone['FakeAsyncTestZoneSpec']; if (proxyZoneSpec.getDelegate() instanceof FakeAsyncTestZoneSpec) { throw new Error('fakeAsync() calls can not be nested'); } _fakeAsyncTestZoneSpec = new FakeAsyncTestZoneSpec(); } let res; const lastProxyZoneSpec = proxyZoneSpec.getDelegate(); proxyZoneSpec.setDelegate(_fakeAsyncTestZoneSpec); _fakeAsyncTestZoneSpec.lockDatePatch(); try { res = fn.apply(this, args); if (flush) { _fakeAsyncTestZoneSpec.flush(20, true); } else { flushMicrotasks(); } } finally { proxyZoneSpec.setDelegate(lastProxyZoneSpec); } if (!flush) { if (_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length > 0) { throw new Error(`${_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length} ` + `periodic timer(s) still in the queue.`); } if (_fakeAsyncTestZoneSpec.pendingTimers.length > 0) { throw new Error(`${_fakeAsyncTestZoneSpec.pendingTimers.length} timer(s) still in the queue.`); } } return res; } finally { resetFakeAsyncZone(); } }; fakeAsyncFn.isFakeAsync = true; return fakeAsyncFn; } function _getFakeAsyncZoneSpec() { if (_fakeAsyncTestZoneSpec == null) { _fakeAsyncTestZoneSpec = Zone.current.get('FakeAsyncTestZoneSpec'); if (_fakeAsyncTestZoneSpec == null) { throw new Error('The code should be running in the fakeAsync zone to call this function'); } } return _fakeAsyncTestZoneSpec; } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone. * * The microtasks queue is drained at the very start of this function and after any timer * callback has been executed. * * ## Example * * {@example core/testing/ts/fake_async.ts region='basic'} * * @experimental */ function tick(millis = 0, ignoreNestedTimeout = false) { _getFakeAsyncZoneSpec().tick(millis, null, ignoreNestedTimeout); } /** * Simulates the asynchronous passage of time for the timers in the fakeAsync zone by * draining the macrotask queue until it is empty. The returned value is the milliseconds * of time that would have been elapsed. * * @param maxTurns * @returns The simulated time elapsed, in millis. * * @experimental */ function flush(maxTurns) { return _getFakeAsyncZoneSpec().flush(maxTurns); } /** * Discard all remaining periodic tasks. * * @experimental */ function discardPeriodicTasks() { const zoneSpec = _getFakeAsyncZoneSpec(); zoneSpec.pendingPeriodicTimers; zoneSpec.pendingPeriodicTimers.length = 0; } /** * Wraps a function to be executed in a shared ProxyZone. * * If no shared ProxyZone exists, one is created and reused for subsequent calls. * Useful for wrapping test setup (beforeEach) and test execution (it) when test * runner patching isn't available or desired for setting up the ProxyZone. * * @param fn The function to wrap. * @returns A function that executes the original function within the shared ProxyZone. * * @experimental */ function withProxyZone(fn) { const autoProxyFn = function (...args) { const proxyZoneSpec = getProxyZoneSpec(); if (proxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } const proxyZone = proxyZoneSpec.get() !== undefined ? Zone.current : getOrCreateRootProxy(); return proxyZone.run(fn, this, args); }; return autoProxyFn; } function getOrCreateRootProxy() { const ProxyZoneSpec = getProxyZoneSpec(); if (ProxyZoneSpec === undefined) { throw new Error('ProxyZoneSpec is needed for withProxyZone but could not be found. ' + 'Make sure that your environment includes zone-testing.js'); } // Ensure the shared ProxyZoneSpec instance exists if (_sharedProxyZoneSpec === null) { _sharedProxyZoneSpec = new ProxyZoneSpec(); } _sharedProxyZone = Zone.root.fork(_sharedProxyZoneSpec); return _sharedProxyZone; } /** * Flush any pending microtasks. * * @experimental */ function flushMicrotasks() { _getFakeAsyncZoneSpec().flushMicrotasks(); } function patchFakeAsyncTest(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['FakeAsyncTestZoneSpec'] = FakeAsyncTestZoneSpec; Zone.__load_patch('fakeasync', (global, Zone, api) => { Zone[api.symbol('fakeAsyncTest')] = { resetFakeAsyncZone, flushMicrotasks, discardPeriodicTasks, tick, flush, fakeAsync, withProxyZone, }; }, true); patchedTimers = { setTimeout: global$1.setTimeout, setInterval: global$1.setInterval, clearTimeout: global$1.clearTimeout, clearInterval: global$1.clearInterval, nativeSetTimeout: global$1[Zone.__symbol__('setTimeout')], nativeClearTimeout: global$1[Zone.__symbol__('clearTimeout')], }; Scheduler.nextId = Scheduler.getNextId(); } /** * @fileoverview * @suppress {globalThis} */ function patchLongStackTrace(Zone) { const NEWLINE = '\n'; const IGNORE_FRAMES = {}; const creationTrace = '__creationTrace__'; const ERROR_TAG = 'STACKTRACE TRACKING'; const SEP_TAG = '__SEP_TAG__'; let sepTemplate = SEP_TAG + '@[native]'; class LongStackTrace { error = getStacktrace(); timestamp = new Date(); } function getStacktraceWithUncaughtError() { return new Error(ERROR_TAG); } function getStacktraceWithCaughtError() { try { throw getStacktraceWithUncaughtError(); } catch (err) { return err; } } // Some implementations of exception handling don't create a stack trace if the exception // isn't thrown, however it's faster not to actually throw the exception. const error = getStacktraceWithUncaughtError(); const caughtError = getStacktraceWithCaughtError(); const getStacktrace = error.stack ? getStacktraceWithUncaughtError : caughtError.stack ? getStacktraceWithCaughtError : getStacktraceWithUncaughtError; function getFrames(error) { return error.stack ? error.stack.split(NEWLINE) : []; } function addErrorStack(lines, error) { let trace = getFrames(error); for (let i = 0; i < trace.length; i++) { const frame = trace[i]; // Filter out the Frames which are part of stack capturing. if (!IGNORE_FRAMES.hasOwnProperty(frame)) { lines.push(trace[i]); } } } function renderLongStackTrace(frames, stack) { const longTrace = [stack ? stack.trim() : '']; if (frames) { let timestamp = new Date().getTime(); for (let i = 0; i < frames.length; i++) { const traceFrames = frames[i]; const lastTime = traceFrames.timestamp; let separator = `____________________Elapsed ${timestamp - lastTime.getTime()} ms; At: ${lastTime}`; separator = separator.replace(/[^\w\d]/g, '_'); longTrace.push(sepTemplate.replace(SEP_TAG, separator)); addErrorStack(longTrace, traceFrames.error); timestamp = lastTime.getTime(); } } return longTrace.join(NEWLINE); } // if Error.stackTraceLimit is 0, means stack trace // is disabled, so we don't need to generate long stack trace // this will improve performance in some test(some test will // set stackTraceLimit to 0, https://github.com/angular/zone.js/issues/698 function stackTracesEnabled() { // Cast through any since this property only exists on Error in the nodejs // typings. return Error.stackTraceLimit > 0; } Zone['longStackTraceZoneSpec'] = { name: 'long-stack-trace', longStackTraceLimit: 10, // Max number of task to keep the stack trace for. // add a getLongStackTrace method in spec to // handle handled reject promise error. getLongStackTrace: function (error) { if (!error) { return undefined; } const trace = error[Zone.__symbol__('currentTaskTrace')]; if (!trace) { return error.stack; } return renderLongStackTrace(trace, error.stack); }, onScheduleTask: function (parentZoneDelegate, currentZone, targetZone, task) { if (stackTracesEnabled()) { const currentTask = Zone.currentTask; let trace = (currentTask && currentTask.data && currentTask.data[creationTrace]) || []; trace = [new LongStackTrace()].concat(trace); if (trace.length > this.longStackTraceLimit) { trace.length = this.longStackTraceLimit; } if (!task.data) task.data = {}; if (task.type === 'eventTask') { // Fix issue https://github.com/angular/zone.js/issues/1195, // For event task of browser, by default, all task will share a // singleton instance of data object, we should create a new one here // The cast to `any` is required to workaround a closure bug which wrongly applies // URL sanitization rules to .data access. task.data = { ...task.data }; } task.data[creationTrace] = trace; } return parentZoneDelegate.scheduleTask(targetZone, task); }, onHandleError: function (parentZoneDelegate, currentZone, targetZone, error) { if (stackTracesEnabled()) { const parentTask = Zone.currentTask || error.task; if (error instanceof Error && parentTask) { const longStack = renderLongStackTrace(parentTask.data && parentTask.data[creationTrace], error.stack); try { error.stack = error.longStack = longStack; } catch (err) { } } } return parentZoneDelegate.handleError(targetZone, error); }, }; function captureStackTraces(stackTraces, count) { if (count > 0) { stackTraces.push(getFrames(new LongStackTrace().error)); captureStackTraces(stackTraces, count - 1); } } function computeIgnoreFrames() { if (!stackTracesEnabled()) { return; } const frames = []; captureStackTraces(frames, 2); const frames1 = frames[0]; const frames2 = frames[1]; for (let i = 0; i < frames1.length; i++) { const frame1 = frames1[i]; if (frame1.indexOf(ERROR_TAG) == -1) { let match = frame1.match(/^\s*at\s+/); if (match) { sepTemplate = match[0] + SEP_TAG + ' (http://localhost)'; break; } } } for (let i = 0; i < frames1.length; i++) { const frame1 = frames1[i]; const frame2 = frames2[i]; if (frame1 === frame2) { IGNORE_FRAMES[frame1] = true; } else { break; } } } computeIgnoreFrames(); } class ProxyZoneSpec { defaultSpecDelegate; name = 'ProxyZone'; _delegateSpec = null; properties = { 'ProxyZoneSpec': this }; propertyKeys = null; lastTaskState = null; isNeedToTriggerHasTask = false; tasks = []; static get() { return Zone.current.get('ProxyZoneSpec'); } static isLoaded() { return ProxyZoneSpec.get() instanceof ProxyZoneSpec; } static assertPresent() { const spec = ProxyZoneSpec.get(); if (spec === undefined) { throw new Error(`Expected to be running in 'ProxyZone', but it was not found.`); } return spec; } constructor(defaultSpecDelegate = null) { this.defaultSpecDelegate = defaultSpecDelegate; this.setDelegate(defaultSpecDelegate); } setDelegate(delegateSpec) { const isNewDelegate = this._delegateSpec !== delegateSpec; this._delegateSpec = delegateSpec; this.propertyKeys && this.propertyKeys.forEach((key) => delete this.properties[key]); this.propertyKeys = null; if (delegateSpec && delegateSpec.properties) { this.propertyKeys = Object.keys(delegateSpec.properties); this.propertyKeys.forEach((k) => (this.properties[k] = delegateSpec.properties[k])); } // if a new delegateSpec was set, check if we need to trigger hasTask if (isNewDelegate && this.lastTaskState && (this.lastTaskState.macroTask || this.lastTaskState.microTask)) { this.isNeedToTriggerHasTask = true; } } getDelegate() { return this._delegateSpec; } resetDelegate() { this.getDelegate(); this.setDelegate(this.defaultSpecDelegate); } tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone) { if (this.isNeedToTriggerHasTask && this.lastTaskState) { // last delegateSpec has microTask or macroTask // should call onHasTask in current delegateSpec this.isNeedToTriggerHasTask = false; this.onHasTask(parentZoneDelegate, currentZone, targetZone, this.lastTaskState); } } removeFromTasks(task) { if (!this.tasks) { return; } for (let i = 0; i < this.tasks.length; i++) { if (this.tasks[i] === task) { this.tasks.splice(i, 1); return; } } } getAndClearPendingTasksInfo() { if (this.tasks.length === 0) { return ''; } const taskInfo = this.tasks.map((task) => { const dataInfo = task.data && Object.keys(task.data) .map((key) => { return key + ':' + task.data[key]; }) .join(','); return `type: ${task.type}, source: ${task.source}, args: {${dataInfo}}`; }); const pendingTasksInfo = '--Pending async tasks are: [' + taskInfo + ']'; // clear tasks this.tasks = []; return pendingTasksInfo; } onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec) { if (this._delegateSpec && this._delegateSpec.onFork) { return this._delegateSpec.onFork(parentZoneDelegate, currentZone, targetZone, zoneSpec); } else { return parentZoneDelegate.fork(targetZone, zoneSpec); } } onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source) { if (this._delegateSpec && this._delegateSpec.onIntercept) { return this._delegateSpec.onIntercept(parentZoneDelegate, currentZone, targetZone, delegate, source); } else { return parentZoneDelegate.intercept(targetZone, delegate, source); } } onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source) { this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvoke) { return this._delegateSpec.onInvoke(parentZoneDelegate, currentZone, targetZone, delegate, applyThis, applyArgs, source); } else { return parentZoneDelegate.invoke(targetZone, delegate, applyThis, applyArgs, source); } } onHandleError(parentZoneDelegate, currentZone, targetZone, error) { if (this._delegateSpec && this._delegateSpec.onHandleError) { return this._delegateSpec.onHandleError(parentZoneDelegate, currentZone, targetZone, error); } else { return parentZoneDelegate.handleError(targetZone, error); } } onScheduleTask(parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.tasks.push(task); } if (this._delegateSpec && this._delegateSpec.onScheduleTask) { return this._delegateSpec.onScheduleTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.scheduleTask(targetZone, task); } } onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onInvokeTask) { return this._delegateSpec.onInvokeTask(parentZoneDelegate, currentZone, targetZone, task, applyThis, applyArgs); } else { return parentZoneDelegate.invokeTask(targetZone, task, applyThis, applyArgs); } } onCancelTask(parentZoneDelegate, currentZone, targetZone, task) { if (task.type !== 'eventTask') { this.removeFromTasks(task); } this.tryTriggerHasTask(parentZoneDelegate, currentZone, targetZone); if (this._delegateSpec && this._delegateSpec.onCancelTask) { return this._delegateSpec.onCancelTask(parentZoneDelegate, currentZone, targetZone, task); } else { return parentZoneDelegate.cancelTask(targetZone, task); } } onHasTask(delegate, current, target, hasTaskState) { this.lastTaskState = hasTaskState; if (this._delegateSpec && this._delegateSpec.onHasTask) { this._delegateSpec.onHasTask(delegate, current, target, hasTaskState); } else { delegate.hasTask(target, hasTaskState); } } } function patchProxyZoneSpec(Zone) { // Export the class so that new instances can be created with proper // constructor params. Zone['ProxyZoneSpec'] = ProxyZoneSpec; } function patchSyncTest(Zone) { class SyncTestZoneSpec { runZone = Zone.current; constructor(namePrefix) { this.name = 'syncTestZone for ' + namePrefix; } // ZoneSpec implementation below. name; onScheduleTask(delegate, current, target, task) { switch (task.type) { case 'microTask': case 'macroTask': throw new Error(`Cannot call ${task.source} from within a sync test (${this.name}).`); case 'eventTask': task = delegate.scheduleTask(target, task); break; } return task; } } // Export the class so that new instances can be created with proper // constructor params. Zone['SyncTestZoneSpec'] = SyncTestZoneSpec; } function patchPromiseTesting(Zone) { /** * Promise for async/fakeAsync zoneSpec test * can support async operation which not supported by zone.js * such as * it ('test jsonp in AsyncZone', async() => { * new Promise(res => { * jsonp(url, (data) => { * // success callback * res(data); * }); * }).then((jsonpResult) => { * // get jsonp result. * * // user will expect AsyncZoneSpec wait for * // then, but because jsonp is not zone aware * // AsyncZone will finish before then is called. * }); * }); */ Zone.__load_patch('promisefortest', (global, Zone, api) => { const symbolState = api.symbol('state'); const UNRESOLVED = null; const symbolParentUnresolved = api.symbol('parentUnresolved'); // patch Promise.prototype.then to keep an internal // number for tracking unresolved chained promise // we will decrease this number when the parent promise // being resolved/rejected and chained promise was // scheduled as a microTask. // so we can know such kind of chained promise still // not resolved in AsyncTestZone Promise[api.symbol('patchPromiseForTest')] = function patchPromiseForTest() { let oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { return; } oriThen = Promise[Zone.__symbol__('ZonePromiseThen')] = Promise.prototype.then; Promise.prototype.then = function () { const chained = oriThen.apply(this, arguments); if (this[symbolState] === UNRESOLVED) { // parent promise is unresolved. const asyncTestZoneSpec = Zone.current.get('AsyncTestZoneSpec'); if (asyncTestZoneSpec) { asyncTestZoneSpec.unresolvedChainedPromiseCount++; chained[symbolParentUnresolved] = true; } } return chained; }; }; Promise[api.symbol('unPatchPromiseForTest')] = function unpatchPromiseForTest() { // restore origin then const oriThen = Promise[Zone.__symbol__('ZonePromiseThen')]; if (oriThen) { Promise.prototype.then = oriThen; Promise[Zone.__symbol__('ZonePromiseThen')] = undefined; } }; }); } function rollupTesting(Zone) { patchLongStackTrace(Zone); patchProxyZoneSpec(Zone); patchSyncTest(Zone); patchJasmine(Zone); patchJest(Zone); patchMocha(Zone); patchAsyncTest(Zone); patchFakeAsyncTest(Zone); patchPromiseTesting(Zone); } rollupTesting(Zone); xy"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */function patchJasmine(e){e.__load_patch("jasmine",((e,t,n)=>{if(!t)throw new Error("Missing: zone.js");if("undefined"!=typeof jest)return;if("undefined"==typeof jasmine||jasmine.__zone_patch__)return;jasmine.__zone_patch__=!0;const s=t.SyncTestZoneSpec,r=t.ProxyZoneSpec;if(!s)throw new Error("Missing: SyncTestZoneSpec");if(!r)throw new Error("Missing: ProxyZoneSpec");const i=t.current,o=t.__symbol__,c=!0===e[o("fakeAsyncDisablePatchingClock")],a=!c&&(!0===e[o("fakeAsyncPatchLock")]||!0===e[o("fakeAsyncAutoFakeAsyncWhenClockPatched")]);if(!0!==e[o("ignoreUnhandledRejection")]){const t=jasmine.GlobalErrors;t&&!jasmine[o("GlobalErrors")]&&(jasmine[o("GlobalErrors")]=t,jasmine.GlobalErrors=function(){const n=new t,s=n.install;return s&&!n[o("install")]&&(n[o("install")]=s,n.install=function(){const t="undefined"!=typeof process&&!!process.on,n=t?process.listeners("unhandledRejection"):e.eventListeners("unhandledrejection"),r=s.apply(this,arguments);return t?process.removeAllListeners("unhandledRejection"):e.removeAllListeners("unhandledrejection"),n&&n.forEach((n=>{t?process.on("unhandledRejection",n):e.addEventListener("unhandledrejection",n)})),r}),n})}const l=jasmine.getEnv();if(["describe","xdescribe","fdescribe"].forEach((e=>{let t=l[e];l[e]=function(e,n){return t.call(this,e,function r(e,t){return function(){return i.fork(new s(`jasmine.describe#${e}`)).run(t,this,arguments)}}(e,n))}})),["it","xit","fit"].forEach((e=>{let t=l[e];l[o(e)]=t,l[e]=function(e,n,s){return arguments[1]=h(n),t.apply(this,arguments)}})),["beforeEach","afterEach","beforeAll","afterAll"].forEach((e=>{let t=l[e];l[o(e)]=t,l[e]=function(e,n){return arguments[0]=h(e),t.apply(this,arguments)}})),!c){const e=jasmine[o("clock")]=jasmine.clock;jasmine.clock=function(){const n=e.apply(this,arguments);if(!n[o("patched")]){n[o("patched")]=o("patched");const e=n[o("tick")]=n.tick;n.tick=function(){const n=t.current.get("FakeAsyncTestZoneSpec");return n?n.tick.apply(n,arguments):e.apply(this,arguments)};const s=n[o("mockDate")]=n.mockDate;n.mockDate=function(){const e=t.current.get("FakeAsyncTestZoneSpec");if(e){const t=arguments.length>0?arguments[0]:new Date;return e.setFakeBaseSystemTime.apply(e,t&&"function"==typeof t.getTime?[t.getTime()]:arguments)}return s.apply(this,arguments)},a&&["install","uninstall"].forEach((e=>{const s=n[o(e)]=n[e];n[e]=function(){if(!t.FakeAsyncTestZoneSpec)return s.apply(this,arguments);jasmine[o("clockInstalled")]="install"===e}}))}return n}}if(!jasmine[t.__symbol__("createSpyObj")]){const e=jasmine.createSpyObj;jasmine[t.__symbol__("createSpyObj")]=e,jasmine.createSpyObj=function(){const t=Array.prototype.slice.call(arguments);let n;if(t.length>=3&&t[2]){const s=Object.defineProperty;Object.defineProperty=function(e,t,n){return s.call(this,e,t,{...n,configurable:!0,enumerable:!0})};try{n=e.apply(this,t)}finally{Object.defineProperty=s}}else n=e.apply(this,t);return n}}function u(e,n,s,r){const i=!!jasmine[o("clockInstalled")],c=s.testProxyZone;if(i&&a){const n=t[t.__symbol__("fakeAsyncTest")];n&&"function"==typeof n.fakeAsync&&(e=n.fakeAsync(e))}return r?c.run(e,n,[r]):c.run(e,n)}function h(e){return e&&(e.length?function(t){return u(e,this,this.queueRunner,t)}:function(){return u(e,this,this.queueRunner)})}const p=jasmine.QueueRunner;jasmine.QueueRunner=function(n){function s(s){s.onComplete&&(s.onComplete=(e=>()=>{this.testProxyZone=null,this.testProxyZoneSpec=null,i.scheduleMicroTask("jasmine.onComplete",e)})(s.onComplete));const r=e[t.__symbol__("setTimeout")],o=e[t.__symbol__("clearTimeout")];r&&(s.timeout={setTimeout:r||e.setTimeout,clearTimeout:o||e.clearTimeout}),jasmine.UserContext?(s.userContext||(s.userContext=new jasmine.UserContext),s.userContext.queueRunner=this):(s.userContext||(s.userContext={}),s.userContext.queueRunner=this);const c=s.onException;s.onException=function(e){if(e&&"Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL."===e.message){const t=this&&this.testProxyZoneSpec;if(t){const n=t.getAndClearPendingTasksInfo();try{e.message+=n}catch(e){}}}c&&c.call(this,e)},n.call(this,s)}return function(e,t){for(const n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);function n(){this.constructor=e}e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}(s,n),s.prototype.execute=function(){let e=t.current,s=!1;for(;e;){if(e===i){s=!0;break}e=e.parent}if(!s)throw new Error("Unexpected Zone: "+t.current.name);this.testProxyZoneSpec=new r,this.testProxyZone=i.fork(this.testProxyZoneSpec),t.currentTask?n.prototype.execute.call(this):t.current.scheduleMicroTask("jasmine.execute().forceTask",(()=>p.prototype.execute.call(this)))},s}(p)}))}function patchJest(e){e.__load_patch("jest",((e,t,n)=>{if("undefined"==typeof jest||jest.__zone_patch__)return;t[n.symbol("ignoreConsoleErrorUncaughtError")]=!0,jest.__zone_patch__=!0;const s=t.ProxyZoneSpec,r=t.SyncTestZoneSpec;if(!s)throw new Error("Missing ProxyZoneSpec");const i=t.current,o=i.fork(new r("jest.describe")),c=new s,a=i.fork(c);function l(e){return function(...t){return o.run(e,this,t)}}function u(e,s=!1){if("function"!=typeof e)return e;const r=function(){if(!0===t[n.symbol("useFakeTimersCalled")]&&e&&!e.isFakeAsync){const n=t[t.__symbol__("fakeAsyncTest")];n&&"function"==typeof n.fakeAsync&&(e=n.fakeAsync(e))}return c.isTestFunc=s,a.run(e,null,arguments)};return Object.defineProperty(r,"length",{configurable:!0,writable:!0,enumerable:!1}),r.length=e.length,r}["describe","xdescribe","fdescribe"].forEach((n=>{let s=e[n];e[t.__symbol__(n)]||(e[t.__symbol__(n)]=s,e[n]=function(...e){return e[1]=l(e[1]),s.apply(this,e)},e[n].each=function r(e){return function(...t){const n=e.apply(this,t);return function(...e){return e[1]=l(e[1]),n.apply(this,e)}}}(s.each))})),e.describe.only=e.fdescribe,e.describe.skip=e.xdescribe,["it","xit","fit","test","xtest"].forEach((n=>{let s=e[n];e[t.__symbol__(n)]||(e[t.__symbol__(n)]=s,e[n]=function(...e){return e[1]=u(e[1],!0),s.apply(this,e)},e[n].each=function r(e){return function(...t){return function(...n){return n[1]=u(n[1]),e.apply(this,t).apply(this,n)}}}(s.each),e[n].todo=s.todo,e[n].failing=s.failing)})),e.it.only=e.fit,e.it.skip=e.xit,e.test.only=e.fit,e.test.skip=e.xit,["beforeEach","afterEach","beforeAll","afterAll"].forEach((n=>{let s=e[n];e[t.__symbol__(n)]||(e[t.__symbol__(n)]=s,e[n]=function(...e){return e[0]=u(e[0]),s.apply(this,e)})})),t.patchJestObject=function e(s,r=!1){function i(){return!!t.current.get("FakeAsyncTestZoneSpec")}function o(){const e=t.current.get("ProxyZoneSpec");return e&&e.isTestFunc}s[n.symbol("fakeTimers")]||(s[n.symbol("fakeTimers")]=!0,n.patchMethod(s,"_checkFakeTimers",(e=>function(t,n){return!!i()||e.apply(t,n)})),n.patchMethod(s,"useFakeTimers",(e=>function(s,i){return t[n.symbol("useFakeTimersCalled")]=!0,r||o()?e.apply(s,i):s})),n.patchMethod(s,"useRealTimers",(e=>function(s,i){return t[n.symbol("useFakeTimersCalled")]=!1,r||o()?e.apply(s,i):s})),n.patchMethod(s,"setSystemTime",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r||!i())return e.apply(n,s);r.setFakeBaseSystemTime(s[0])})),n.patchMethod(s,"getRealSystemTime",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");return r&&i()?r.getRealSystemTime():e.apply(n,s)})),n.patchMethod(s,"runAllTicks",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.flushMicrotasks()})),n.patchMethod(s,"runAllTimers",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.flush(100,!0)})),n.patchMethod(s,"advanceTimersByTime",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.tick(s[0])})),n.patchMethod(s,"runOnlyPendingTimers",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.flushOnlyPendingTimers()})),n.patchMethod(s,"advanceTimersToNextTimer",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.tickToNext(s[0])})),n.patchMethod(s,"clearAllTimers",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");if(!r)return e.apply(n,s);r.removeAllTimers()})),n.patchMethod(s,"getTimerCount",(e=>function(n,s){const r=t.current.get("FakeAsyncTestZoneSpec");return r?r.getTimerCount():e.apply(n,s)})))}}))}function patchMocha(e){e.__load_patch("mocha",((e,t)=>{const n=e.Mocha;if(void 0===n)return;if(void 0===t)throw new Error("Missing Zone.js");const s=t.ProxyZoneSpec,r=t.SyncTestZoneSpec;if(!s)throw new Error("Missing ProxyZoneSpec");if(n.__zone_patch__)throw new Error('"Mocha" has already been patched with "Zone".');n.__zone_patch__=!0;const i=t.current,o=i.fork(new r("Mocha.describe"));let c=null;const a=i.fork(new s),l={after:e.after,afterEach:e.afterEach,before:e.before,beforeEach:e.beforeEach,describe:e.describe,it:e.it};function u(e,t,n){for(let s=0;s{f.call(this,e)}))},n.Runner.prototype.run=function(e){return this.on("test",(e=>{c=i.fork(new s)})),this.on("fail",((e,t)=>{const n=c&&c.get("ProxyZoneSpec");if(n&&t)try{t.message+=n.getAndClearPendingTasksInfo()}catch(e){}})),T.call(this,e)}}))}const global$2=globalThis;function __symbol__(e){return(global$2.__Zone_symbol_prefix||"__zone_symbol__")+e}const __global="undefined"!=typeof window&&window||"undefined"!=typeof self&&self||global;class AsyncTestZoneSpec{finishCallback;failCallback;static get symbolParentUnresolved(){return __symbol__("parentUnresolved")}_pendingMicroTasks=!1;_pendingMacroTasks=!1;_alreadyErrored=!1;_isSync=!1;_existingFinishTimer=null;entryFunction=null;runZone=Zone.current;unresolvedChainedPromiseCount=0;supportWaitUnresolvedChainedPromise=!1;constructor(e,t,n){this.finishCallback=e,this.failCallback=t,this.name="asyncTestZone for "+n,this.properties={AsyncTestZoneSpec:this},this.supportWaitUnresolvedChainedPromise=!0===__global[__symbol__("supportWaitUnResolvedChainedPromise")]}isUnresolvedChainedPromisePending(){return this.unresolvedChainedPromiseCount>0}_finishCallbackIfDone(){null!==this._existingFinishTimer&&(clearTimeout(this._existingFinishTimer),this._existingFinishTimer=null),this._pendingMicroTasks||this._pendingMacroTasks||this.supportWaitUnresolvedChainedPromise&&this.isUnresolvedChainedPromisePending()||this.runZone.run((()=>{this._existingFinishTimer=setTimeout((()=>{this._alreadyErrored||this._pendingMicroTasks||this._pendingMacroTasks||this.finishCallback()}),0)}))}patchPromiseForTest(){if(!this.supportWaitUnresolvedChainedPromise)return;const e=Promise[Zone.__symbol__("patchPromiseForTest")];e&&e()}unPatchPromiseForTest(){if(!this.supportWaitUnresolvedChainedPromise)return;const e=Promise[Zone.__symbol__("unPatchPromiseForTest")];e&&e()}name;properties;onScheduleTask(e,t,n,s){return"eventTask"!==s.type&&(this._isSync=!1),"microTask"===s.type&&s.data&&s.data instanceof Promise&&!0===s.data[AsyncTestZoneSpec.symbolParentUnresolved]&&this.unresolvedChainedPromiseCount--,e.scheduleTask(n,s)}onInvokeTask(e,t,n,s,r,i){return"eventTask"!==s.type&&(this._isSync=!1),e.invokeTask(n,s,r,i)}onCancelTask(e,t,n,s){return"eventTask"!==s.type&&(this._isSync=!1),e.cancelTask(n,s)}onInvoke(e,t,n,s,r,i,o){this.entryFunction||(this.entryFunction=s);try{return this._isSync=!0,e.invoke(n,s,r,i,o)}finally{this._isSync&&this.entryFunction===s&&this._finishCallbackIfDone()}}onHandleError(e,t,n,s){return e.handleError(n,s)&&(this.failCallback(s),this._alreadyErrored=!0),!1}onHasTask(e,t,n,s){e.hasTask(n,s),t===n&&("microTask"==s.change?(this._pendingMicroTasks=s.microTask,this._finishCallbackIfDone()):"macroTask"==s.change&&(this._pendingMacroTasks=s.macroTask,this._finishCallbackIfDone()))}}function patchAsyncTest(e){e.AsyncTestZoneSpec=AsyncTestZoneSpec,e.__load_patch("asynctest",((e,t,n)=>{function s(e,n,s,r){const i=t.current,o=t.AsyncTestZoneSpec;if(void 0===o)throw new Error("AsyncTestZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/async-test");const c=t.ProxyZoneSpec;if(!c)throw new Error("ProxyZoneSpec is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/plugins/proxy");const a=c.get();c.assertPresent();const l=t.current.getZoneWith("ProxyZoneSpec"),u=a.getDelegate();return l.parent.run((()=>{const e=new o((()=>{a.getDelegate()==e&&a.setDelegate(u),e.unPatchPromiseForTest(),i.run((()=>{s()}))}),(t=>{a.getDelegate()==e&&a.setDelegate(u),e.unPatchPromiseForTest(),i.run((()=>{r(t)}))}),"test");a.setDelegate(e),e.patchPromiseForTest()})),t.current.runGuarded(e,n)}t[n.symbol("asyncTest")]=function t(n){return e.jasmine?function(e){e||((e=function(){}).fail=function(e){throw e}),s(n,this,e,(t=>{if("string"==typeof t)return e.fail(new Error(t));e.fail(t)}))}:function(){return new Promise(((e,t)=>{s(n,this,e,t)}))}}}))}const global$1="object"==typeof window&&window||"object"==typeof self&&self||globalThis.global,OriginalDate=global$1.Date;function FakeDate(){if(0===arguments.length){const e=new OriginalDate;return e.setTime(FakeDate.now()),e}{const e=Array.prototype.slice.call(arguments);return new OriginalDate(...e)}}let patchedTimers;FakeDate.now=function(){const e=Zone.current.get("FakeAsyncTestZoneSpec");return e?e.getFakeSystemTime():OriginalDate.now.apply(this,arguments)},FakeDate.UTC=OriginalDate.UTC,FakeDate.parse=OriginalDate.parse;const timeoutCallback=function(){};class Scheduler{static nextNodeJSId=1;static nextId=-1;_schedulerQueue=[];_currentTickTime=0;_currentFakeBaseSystemTime=OriginalDate.now();_currentTickRequeuePeriodicEntries=[];constructor(){}static getNextId(){const e=patchedTimers.nativeSetTimeout.call(global$1,timeoutCallback,0);return patchedTimers.nativeClearTimeout.call(global$1,e),"number"==typeof e?e:Scheduler.nextNodeJSId++}getCurrentTickTime(){return this._currentTickTime}getFakeSystemTime(){return this._currentFakeBaseSystemTime+this._currentTickTime}setFakeBaseSystemTime(e){this._currentFakeBaseSystemTime=e}getRealSystemTime(){return OriginalDate.now()}scheduleFunction(e,t,n){let s=(n={args:[],isPeriodic:!1,isRequestAnimationFrame:!1,id:-1,isRequeuePeriodic:!1,...n}).id<0?Scheduler.nextId:n.id;Scheduler.nextId=Scheduler.getNextId();let r={endTime:this._currentTickTime+t,id:s,func:e,args:n.args,delay:t,isPeriodic:n.isPeriodic,isRequestAnimationFrame:n.isRequestAnimationFrame};n.isRequeuePeriodic&&this._currentTickRequeuePeriodicEntries.push(r);let i=0;for(;i0&&(this._currentTickRequeuePeriodicEntries=[],!(s=0&&this._schedulerQueue.splice(t,1)}if(r=this._currentTickTime,this._currentTickTime=e.endTime,t&&t(this._currentTickTime-r),!e.func.apply(global$1,e.isRequestAnimationFrame?[this._currentTickTime]:e.args))break;n.processNewMacroTasksSynchronously||this._currentTickRequeuePeriodicEntries.forEach((e=>{let t=0;for(;t0;){if(r++,r>e)throw new Error("flush failed after reaching the limit of "+e+" tasks. Does your code use a polling timeout?");if(0===this._schedulerQueue.filter((e=>!e.isPeriodic&&!e.isRequestAnimationFrame)).length)break;const n=this._schedulerQueue.shift();if(s=this._currentTickTime,this._currentTickTime=n.endTime,t&&t(this._currentTickTime-s),!n.func.apply(global$1,n.args))break}return this._currentTickTime-n}}class FakeAsyncTestZoneSpec{trackPendingRequestAnimationFrame;macroTaskOptions;static assertInZone(){if(null==Zone.current.get("FakeAsyncTestZoneSpec"))throw new Error("The code should be running in the fakeAsync zone to call this function")}_scheduler=new Scheduler;_microtasks=[];_lastError=null;_uncaughtPromiseErrors=Promise[Zone.__symbol__("uncaughtPromiseErrors")];pendingPeriodicTimers=[];pendingTimers=[];patchDateLocked=!1;constructor(e,t=!1,n){this.trackPendingRequestAnimationFrame=t,this.macroTaskOptions=n,this.name="fakeAsyncTestZone for "+e,this.macroTaskOptions||(this.macroTaskOptions=global$1[Zone.__symbol__("FakeAsyncTestMacroTask")])}_fnAndFlush(e,t){return(...n)=>(e.apply(global$1,n),null===this._lastError?(null!=t.onSuccess&&t.onSuccess.apply(global$1),this.flushMicrotasks()):null!=t.onError&&t.onError.apply(global$1),null===this._lastError)}static _removeTimer(e,t){let n=e.indexOf(t);n>-1&&e.splice(n,1)}_dequeueTimer(e){return()=>{FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers,e)}}_requeuePeriodicTimer(e,t,n,s){return()=>{-1!==this.pendingPeriodicTimers.indexOf(s)&&this._scheduler.scheduleFunction(e,t,{args:n,isPeriodic:!0,id:s,isRequeuePeriodic:!0})}}_dequeuePeriodicTimer(e){return()=>{FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers,e)}}_setTimeout(e,t,n,s=!0){let r=this._dequeueTimer(Scheduler.nextId),i=this._fnAndFlush(e,{onSuccess:r,onError:r}),o=this._scheduler.scheduleFunction(i,t,{args:n,isRequestAnimationFrame:!s});return s&&this.pendingTimers.push(o),o}_clearTimeout(e){FakeAsyncTestZoneSpec._removeTimer(this.pendingTimers,e),this._scheduler.removeScheduledFunctionWithId(e)}_setInterval(e,t,n){let s=Scheduler.nextId,r={onSuccess:null,onError:this._dequeuePeriodicTimer(s)},i=this._fnAndFlush(e,r);return r.onSuccess=this._requeuePeriodicTimer(i,t,n,s),this._scheduler.scheduleFunction(i,t,{args:n,isPeriodic:!0}),this.pendingPeriodicTimers.push(s),s}_clearInterval(e){FakeAsyncTestZoneSpec._removeTimer(this.pendingPeriodicTimers,e),this._scheduler.removeScheduledFunctionWithId(e)}_resetLastErrorAndThrow(){let e=this._lastError||this._uncaughtPromiseErrors[0];throw this._uncaughtPromiseErrors.length=0,this._lastError=null,e}getCurrentTickTime(){return this._scheduler.getCurrentTickTime()}getFakeSystemTime(){return this._scheduler.getFakeSystemTime()}setFakeBaseSystemTime(e){this._scheduler.setFakeBaseSystemTime(e)}getRealSystemTime(){return this._scheduler.getRealSystemTime()}static patchDate(){global$1[Zone.__symbol__("disableDatePatching")]||global$1.Date!==FakeDate&&(global$1.Date=FakeDate,FakeDate.prototype=OriginalDate.prototype,FakeAsyncTestZoneSpec.checkTimerPatch())}static resetDate(){global$1.Date===FakeDate&&(global$1.Date=OriginalDate)}static checkTimerPatch(){if(!patchedTimers)throw new Error("Expected timers to have been patched.");global$1.setTimeout!==patchedTimers.setTimeout&&(global$1.setTimeout=patchedTimers.setTimeout,global$1.clearTimeout=patchedTimers.clearTimeout),global$1.setInterval!==patchedTimers.setInterval&&(global$1.setInterval=patchedTimers.setInterval,global$1.clearInterval=patchedTimers.clearInterval)}lockDatePatch(){this.patchDateLocked=!0,FakeAsyncTestZoneSpec.patchDate()}unlockDatePatch(){this.patchDateLocked=!1,FakeAsyncTestZoneSpec.resetDate()}tickToNext(e=1,t,n={processNewMacroTasksSynchronously:!0}){e<=0||(FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks(),this._scheduler.tickToNext(e,t,n),null!==this._lastError&&this._resetLastErrorAndThrow())}tick(e=0,t,n={processNewMacroTasksSynchronously:!0}){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks(),this._scheduler.tick(e,t,n),null!==this._lastError&&this._resetLastErrorAndThrow()}flushMicrotasks(){for(FakeAsyncTestZoneSpec.assertInZone();this._microtasks.length>0;){let e=this._microtasks.shift();e.func.apply(e.target,e.args)}(()=>{(null!==this._lastError||this._uncaughtPromiseErrors.length)&&this._resetLastErrorAndThrow()})()}flush(e,t,n){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks();const s=this._scheduler.flush(e,t,n);return null!==this._lastError&&this._resetLastErrorAndThrow(),s}flushOnlyPendingTimers(e){FakeAsyncTestZoneSpec.assertInZone(),this.flushMicrotasks();const t=this._scheduler.flushOnlyPendingTimers(e);return null!==this._lastError&&this._resetLastErrorAndThrow(),t}removeAllTimers(){FakeAsyncTestZoneSpec.assertInZone(),this._scheduler.removeAll(),this.pendingPeriodicTimers=[],this.pendingTimers=[]}getTimerCount(){return this._scheduler.getTimerCount()+this._microtasks.length}name;properties={FakeAsyncTestZoneSpec:this};onScheduleTask(e,t,n,s){switch(s.type){case"microTask":let t,r=s.data&&s.data.args;if(r){let e=s.data.cbIdx;"number"==typeof r.length&&r.length>e+1&&(t=Array.prototype.slice.call(r,e+1))}this._microtasks.push({func:s.invoke,args:t,target:s.data&&s.data.target});break;case"macroTask":switch(s.source){case"setTimeout":s.data.handleId=this._setTimeout(s.invoke,s.data.delay,Array.prototype.slice.call(s.data.args,2));break;case"setImmediate":s.data.handleId=this._setTimeout(s.invoke,0,Array.prototype.slice.call(s.data.args,1));break;case"setInterval":s.data.handleId=this._setInterval(s.invoke,s.data.delay,Array.prototype.slice.call(s.data.args,2));break;case"XMLHttpRequest.send":throw new Error("Cannot make XHRs from within a fake async test. Request URL: "+s.data.url);case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":s.data.handleId=this._setTimeout(s.invoke,16,s.data.args,this.trackPendingRequestAnimationFrame);break;default:const e=this.findMacroTaskOption(s);if(e){const t=s.data&&s.data.args,n=t&&t.length>1?t[1]:0;let r=e.callbackArgs?e.callbackArgs:t;e.isPeriodic?(s.data.handleId=this._setInterval(s.invoke,n,r),s.data.isPeriodic=!0):s.data.handleId=this._setTimeout(s.invoke,n,r);break}throw new Error("Unknown macroTask scheduled in fake async test: "+s.source)}break;case"eventTask":s=e.scheduleTask(n,s)}return s}onCancelTask(e,t,n,s){switch(s.source){case"setTimeout":case"requestAnimationFrame":case"webkitRequestAnimationFrame":case"mozRequestAnimationFrame":return this._clearTimeout(s.data.handleId);case"setInterval":return this._clearInterval(s.data.handleId);default:const t=this.findMacroTaskOption(s);if(t){const e=s.data.handleId;return t.isPeriodic?this._clearInterval(e):this._clearTimeout(e)}return e.cancelTask(n,s)}}onInvoke(e,t,n,s,r,i,o){try{return FakeAsyncTestZoneSpec.patchDate(),e.invoke(n,s,r,i,o)}finally{this.patchDateLocked||FakeAsyncTestZoneSpec.resetDate()}}findMacroTaskOption(e){if(!this.macroTaskOptions)return null;for(let t=0;t0)throw new Error(`${_fakeAsyncTestZoneSpec.pendingPeriodicTimers.length} periodic timer(s) still in the queue.`);if(_fakeAsyncTestZoneSpec.pendingTimers.length>0)throw new Error(`${_fakeAsyncTestZoneSpec.pendingTimers.length} timer(s) still in the queue.`)}return s}finally{resetFakeAsyncZone()}};return s.isFakeAsync=!0,s}function _getFakeAsyncZoneSpec(){if(null==_fakeAsyncTestZoneSpec&&(_fakeAsyncTestZoneSpec=Zone.current.get("FakeAsyncTestZoneSpec"),null==_fakeAsyncTestZoneSpec))throw new Error("The code should be running in the fakeAsync zone to call this function");return _fakeAsyncTestZoneSpec}function tick(e=0,t=!1){_getFakeAsyncZoneSpec().tick(e,null,t)}function flush(e){return _getFakeAsyncZoneSpec().flush(e)}function discardPeriodicTasks(){_getFakeAsyncZoneSpec().pendingPeriodicTimers.length=0}function withProxyZone(e){return function(...t){const n=getProxyZoneSpec();if(void 0===n)throw new Error("ProxyZoneSpec is needed for the withProxyZone() test helper but could not be found. Make sure that your environment includes zone-testing.js");return(void 0!==n.get()?Zone.current:getOrCreateRootProxy()).run(e,this,t)}}function getOrCreateRootProxy(){const e=getProxyZoneSpec();if(void 0===e)throw new Error("ProxyZoneSpec is needed for withProxyZone but could not be found. Make sure that your environment includes zone-testing.js");return null===_sharedProxyZoneSpec&&(_sharedProxyZoneSpec=new e),_sharedProxyZone=Zone.root.fork(_sharedProxyZoneSpec),_sharedProxyZone}function flushMicrotasks(){_getFakeAsyncZoneSpec().flushMicrotasks()}function patchFakeAsyncTest(e){e.FakeAsyncTestZoneSpec=FakeAsyncTestZoneSpec,e.__load_patch("fakeasync",((e,t,n)=>{t[n.symbol("fakeAsyncTest")]={resetFakeAsyncZone:resetFakeAsyncZone,flushMicrotasks:flushMicrotasks,discardPeriodicTasks:discardPeriodicTasks,tick:tick,flush:flush,fakeAsync:fakeAsync,withProxyZone:withProxyZone}}),!0),patchedTimers={setTimeout:global$1.setTimeout,setInterval:global$1.setInterval,clearTimeout:global$1.clearTimeout,clearInterval:global$1.clearInterval,nativeSetTimeout:global$1[e.__symbol__("setTimeout")],nativeClearTimeout:global$1[e.__symbol__("clearTimeout")]},Scheduler.nextId=Scheduler.getNextId()}function patchLongStackTrace(e){const t={},n="__creationTrace__",s="STACKTRACE TRACKING",r="__SEP_TAG__";let i=r+"@[native]";class o{error=h();timestamp=new Date}function c(){return new Error(s)}function a(){try{throw c()}catch(e){return e}}const l=c(),u=a(),h=l.stack?c:u.stack?a:c;function p(e){return e.stack?e.stack.split("\n"):[]}function d(e,n){let s=p(n);for(let n=0;n0}function m(e,t){t>0&&(e.push(p((new o).error)),m(e,t-1))}e.longStackTraceZoneSpec={name:"long-stack-trace",longStackTraceLimit:10,getLongStackTrace:function(t){if(!t)return;const n=t[e.__symbol__("currentTaskTrace")];return n?f(n,t.stack):t.stack},onScheduleTask:function(t,s,r,i){if(T()){const t=e.currentTask;let s=t&&t.data&&t.data[n]||[];s=[new o].concat(s),s.length>this.longStackTraceLimit&&(s.length=this.longStackTraceLimit),i.data||(i.data={}),"eventTask"===i.type&&(i.data={...i.data}),i.data[n]=s}return t.scheduleTask(r,i)},onHandleError:function(t,s,r,i){if(T()){const t=e.currentTask||i.task;if(i instanceof Error&&t){const e=f(t.data&&t.data[n],i.stack);try{i.stack=i.longStack=e}catch(e){}}}return t.handleError(r,i)}},function y(){if(!T())return;const e=[];m(e,2);const n=e[0],o=e[1];for(let e=0;edelete this.properties[e])),this.propertyKeys=null,e&&e.properties&&(this.propertyKeys=Object.keys(e.properties),this.propertyKeys.forEach((t=>this.properties[t]=e.properties[t]))),t&&this.lastTaskState&&(this.lastTaskState.macroTask||this.lastTaskState.microTask)&&(this.isNeedToTriggerHasTask=!0)}getDelegate(){return this._delegateSpec}resetDelegate(){this.getDelegate(),this.setDelegate(this.defaultSpecDelegate)}tryTriggerHasTask(e,t,n){this.isNeedToTriggerHasTask&&this.lastTaskState&&(this.isNeedToTriggerHasTask=!1,this.onHasTask(e,t,n,this.lastTaskState))}removeFromTasks(e){if(this.tasks)for(let t=0;t{const t=e.data&&Object.keys(e.data).map((t=>t+":"+e.data[t])).join(",");return`type: ${e.type}, source: ${e.source}, args: {${t}}`}))+"]";return this.tasks=[],e}onFork(e,t,n,s){return this._delegateSpec&&this._delegateSpec.onFork?this._delegateSpec.onFork(e,t,n,s):e.fork(n,s)}onIntercept(e,t,n,s,r){return this._delegateSpec&&this._delegateSpec.onIntercept?this._delegateSpec.onIntercept(e,t,n,s,r):e.intercept(n,s,r)}onInvoke(e,t,n,s,r,i,o){return this.tryTriggerHasTask(e,t,n),this._delegateSpec&&this._delegateSpec.onInvoke?this._delegateSpec.onInvoke(e,t,n,s,r,i,o):e.invoke(n,s,r,i,o)}onHandleError(e,t,n,s){return this._delegateSpec&&this._delegateSpec.onHandleError?this._delegateSpec.onHandleError(e,t,n,s):e.handleError(n,s)}onScheduleTask(e,t,n,s){return"eventTask"!==s.type&&this.tasks.push(s),this._delegateSpec&&this._delegateSpec.onScheduleTask?this._delegateSpec.onScheduleTask(e,t,n,s):e.scheduleTask(n,s)}onInvokeTask(e,t,n,s,r,i){return"eventTask"!==s.type&&this.removeFromTasks(s),this.tryTriggerHasTask(e,t,n),this._delegateSpec&&this._delegateSpec.onInvokeTask?this._delegateSpec.onInvokeTask(e,t,n,s,r,i):e.invokeTask(n,s,r,i)}onCancelTask(e,t,n,s){return"eventTask"!==s.type&&this.removeFromTasks(s),this.tryTriggerHasTask(e,t,n),this._delegateSpec&&this._delegateSpec.onCancelTask?this._delegateSpec.onCancelTask(e,t,n,s):e.cancelTask(n,s)}onHasTask(e,t,n,s){this.lastTaskState=s,this._delegateSpec&&this._delegateSpec.onHasTask?this._delegateSpec.onHasTask(e,t,n,s):e.hasTask(n,s)}}function patchProxyZoneSpec(e){e.ProxyZoneSpec=ProxyZoneSpec}function patchSyncTest(e){e.SyncTestZoneSpec=class{runZone=e.current;constructor(e){this.name="syncTestZone for "+e}name;onScheduleTask(e,t,n,s){switch(s.type){case"microTask":case"macroTask":throw new Error(`Cannot call ${s.source} from within a sync test (${this.name}).`);case"eventTask":s=e.scheduleTask(n,s)}return s}}}function patchPromiseTesting(e){e.__load_patch("promisefortest",((e,t,n)=>{const s=n.symbol("state"),r=n.symbol("parentUnresolved");Promise[n.symbol("patchPromiseForTest")]=function e(){let n=Promise[t.__symbol__("ZonePromiseThen")];n||(n=Promise[t.__symbol__("ZonePromiseThen")]=Promise.prototype.then,Promise.prototype.then=function(){const e=n.apply(this,arguments);if(null===this[s]){const n=t.current.get("AsyncTestZoneSpec");n&&(n.unresolvedChainedPromiseCount++,e[r]=!0)}return e})},Promise[n.symbol("unPatchPromiseForTest")]=function e(){const n=Promise[t.__symbol__("ZonePromiseThen")];n&&(Promise.prototype.then=n,Promise[t.__symbol__("ZonePromiseThen")]=void 0)}}))}function rollupTesting(e){patchLongStackTrace(e),patchProxyZoneSpec(e),patchSyncTest(e),patchJasmine(e),patchJest(e),patchMocha(e),patchAsyncTest(e),patchFakeAsyncTest(e),patchPromiseTesting(e)}rollupTesting(Zone);QBx'use strict'; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */ const global = globalThis; // __Zone_symbol_prefix global can be used to override the default zone // symbol prefix with a custom one if needed. function __symbol__(name) { const symbolPrefix = global['__Zone_symbol_prefix'] || '__zone_symbol__'; return symbolPrefix + name; } function initZone() { const performance = global['performance']; function mark(name) { performance && performance['mark'] && performance['mark'](name); } function performanceMeasure(name, label) { performance && performance['measure'] && performance['measure'](name, label); } mark('Zone'); class ZoneImpl { static __symbol__ = __symbol__; static assertZonePatched() { if (global['Promise'] !== patches['ZoneAwarePromise']) { throw new Error('Zone.js has detected that ZoneAwarePromise `(window|global).Promise` ' + 'has been overwritten.\n' + 'Most likely cause is that a Promise polyfill has been loaded ' + 'after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. ' + 'If you must load one, do so before loading zone.js.)'); } } static get root() { let zone = ZoneImpl.current; while (zone.parent) { zone = zone.parent; } return zone; } static get current() { return _currentZoneFrame.zone; } static get currentTask() { return _currentTask; } static __load_patch(name, fn, ignoreDuplicate = false) { if (patches.hasOwnProperty(name)) { // `checkDuplicate` option is defined from global variable // so it works for all modules. // `ignoreDuplicate` can work for the specified module const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (!ignoreDuplicate && checkDuplicate) { throw Error('Already loaded patch: ' + name); } } else if (!global['__Zone_disable_' + name]) { const perfName = 'Zone:' + name; mark(perfName); patches[name] = fn(global, ZoneImpl, _api); performanceMeasure(perfName, perfName); } } get parent() { return this._parent; } get name() { return this._name; } _parent; _name; _properties; _zoneDelegate; constructor(parent, zoneSpec) { this._parent = parent; this._name = zoneSpec ? zoneSpec.name || 'unnamed' : ''; this._properties = (zoneSpec && zoneSpec.properties) || {}; this._zoneDelegate = new _ZoneDelegate(this, this._parent && this._parent._zoneDelegate, zoneSpec); } get(key) { const zone = this.getZoneWith(key); if (zone) return zone._properties[key]; } getZoneWith(key) { let current = this; while (current) { if (current._properties.hasOwnProperty(key)) { return current; } current = current._parent; } return null; } fork(zoneSpec) { if (!zoneSpec) throw new Error('ZoneSpec required!'); return this._zoneDelegate.fork(this, zoneSpec); } wrap(callback, source) { if (typeof callback !== 'function') { throw new Error('Expecting function got: ' + callback); } const _callback = this._zoneDelegate.intercept(this, callback, source); const zone = this; return function () { return zone.runGuarded(_callback, this, arguments, source); }; } run(callback, applyThis, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runGuarded(callback, applyThis = null, applyArgs, source) { _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { try { return this._zoneDelegate.invoke(this, callback, applyThis, applyArgs, source); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { _currentZoneFrame = _currentZoneFrame.parent; } } runTask(task, applyThis, applyArgs) { if (task.zone != this) { throw new Error('A task can only be run in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); } const zoneTask = task; // https://github.com/angular/zone.js/issues/778, sometimes eventTask // will run in notScheduled(canceled) state, we should not try to // run such kind of task but just return const { type, data: { isPeriodic = false, isRefreshable = false } = {} } = task; if (task.state === notScheduled && (type === eventTask || type === macroTask)) { return; } const reEntryGuard = task.state != running; reEntryGuard && zoneTask._transitionTo(running, scheduled); const previousTask = _currentTask; _currentTask = zoneTask; _currentZoneFrame = { parent: _currentZoneFrame, zone: this }; try { if (type == macroTask && task.data && !isPeriodic && !isRefreshable) { task.cancelFn = undefined; } try { return this._zoneDelegate.invokeTask(this, zoneTask, applyThis, applyArgs); } catch (error) { if (this._zoneDelegate.handleError(this, error)) { throw error; } } } finally { // if the task's state is notScheduled or unknown, then it has already been cancelled // we should not reset the state to scheduled const state = task.state; if (state !== notScheduled && state !== unknown) { if (type == eventTask || isPeriodic || (isRefreshable && state === scheduling)) { reEntryGuard && zoneTask._transitionTo(scheduled, running, scheduling); } else { const zoneDelegates = zoneTask._zoneDelegates; this._updateTaskCount(zoneTask, -1); reEntryGuard && zoneTask._transitionTo(notScheduled, running, notScheduled); if (isRefreshable) { zoneTask._zoneDelegates = zoneDelegates; } } } _currentZoneFrame = _currentZoneFrame.parent; _currentTask = previousTask; } } scheduleTask(task) { if (task.zone && task.zone !== this) { // check if the task was rescheduled, the newZone // should not be the children of the original zone let newZone = this; while (newZone) { if (newZone === task.zone) { throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${task.zone.name}`); } newZone = newZone.parent; } } task._transitionTo(scheduling, notScheduled); const zoneDelegates = []; task._zoneDelegates = zoneDelegates; task._zone = this; try { task = this._zoneDelegate.scheduleTask(this, task); } catch (err) { // should set task's state to unknown when scheduleTask throw error // because the err may from reschedule, so the fromState maybe notScheduled task._transitionTo(unknown, scheduling, notScheduled); // TODO: @JiaLiPassion, should we check the result from handleError? this._zoneDelegate.handleError(this, err); throw err; } if (task._zoneDelegates === zoneDelegates) { // we have to check because internally the delegate can reschedule the task. this._updateTaskCount(task, 1); } if (task.state == scheduling) { task._transitionTo(scheduled, scheduling); } return task; } scheduleMicroTask(source, callback, data, customSchedule) { return this.scheduleTask(new ZoneTask(microTask, source, callback, data, customSchedule, undefined)); } scheduleMacroTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(macroTask, source, callback, data, customSchedule, customCancel)); } scheduleEventTask(source, callback, data, customSchedule, customCancel) { return this.scheduleTask(new ZoneTask(eventTask, source, callback, data, customSchedule, customCancel)); } cancelTask(task) { if (task.zone != this) throw new Error('A task can only be cancelled in the zone of creation! (Creation: ' + (task.zone || NO_ZONE).name + '; Execution: ' + this.name + ')'); if (task.state !== scheduled && task.state !== running) { return; } task._transitionTo(canceling, scheduled, running); try { this._zoneDelegate.cancelTask(this, task); } catch (err) { // if error occurs when cancelTask, transit the state to unknown task._transitionTo(unknown, canceling); this._zoneDelegate.handleError(this, err); throw err; } this._updateTaskCount(task, -1); task._transitionTo(notScheduled, canceling); task.runCount = -1; return task; } _updateTaskCount(task, count) { const zoneDelegates = task._zoneDelegates; if (count == -1) { task._zoneDelegates = null; } for (let i = 0; i < zoneDelegates.length; i++) { zoneDelegates[i]._updateTaskCount(task.type, count); } } } const DELEGATE_ZS = { name: '', onHasTask: (delegate, _, target, hasTaskState) => delegate.hasTask(target, hasTaskState), onScheduleTask: (delegate, _, target, task) => delegate.scheduleTask(target, task), onInvokeTask: (delegate, _, target, task, applyThis, applyArgs) => delegate.invokeTask(target, task, applyThis, applyArgs), onCancelTask: (delegate, _, target, task) => delegate.cancelTask(target, task), }; class _ZoneDelegate { get zone() { return this._zone; } _zone; _taskCounts = { 'microTask': 0, 'macroTask': 0, 'eventTask': 0, }; _parentDelegate; _forkDlgt; _forkZS; _forkCurrZone; _interceptDlgt; _interceptZS; _interceptCurrZone; _invokeDlgt; _invokeZS; _invokeCurrZone; _handleErrorDlgt; _handleErrorZS; _handleErrorCurrZone; _scheduleTaskDlgt; _scheduleTaskZS; _scheduleTaskCurrZone; _invokeTaskDlgt; _invokeTaskZS; _invokeTaskCurrZone; _cancelTaskDlgt; _cancelTaskZS; _cancelTaskCurrZone; _hasTaskDlgt; _hasTaskDlgtOwner; _hasTaskZS; _hasTaskCurrZone; constructor(zone, parentDelegate, zoneSpec) { this._zone = zone; this._parentDelegate = parentDelegate; this._forkZS = zoneSpec && (zoneSpec && zoneSpec.onFork ? zoneSpec : parentDelegate._forkZS); this._forkDlgt = zoneSpec && (zoneSpec.onFork ? parentDelegate : parentDelegate._forkDlgt); this._forkCurrZone = zoneSpec && (zoneSpec.onFork ? this._zone : parentDelegate._forkCurrZone); this._interceptZS = zoneSpec && (zoneSpec.onIntercept ? zoneSpec : parentDelegate._interceptZS); this._interceptDlgt = zoneSpec && (zoneSpec.onIntercept ? parentDelegate : parentDelegate._interceptDlgt); this._interceptCurrZone = zoneSpec && (zoneSpec.onIntercept ? this._zone : parentDelegate._interceptCurrZone); this._invokeZS = zoneSpec && (zoneSpec.onInvoke ? zoneSpec : parentDelegate._invokeZS); this._invokeDlgt = zoneSpec && (zoneSpec.onInvoke ? parentDelegate : parentDelegate._invokeDlgt); this._invokeCurrZone = zoneSpec && (zoneSpec.onInvoke ? this._zone : parentDelegate._invokeCurrZone); this._handleErrorZS = zoneSpec && (zoneSpec.onHandleError ? zoneSpec : parentDelegate._handleErrorZS); this._handleErrorDlgt = zoneSpec && (zoneSpec.onHandleError ? parentDelegate : parentDelegate._handleErrorDlgt); this._handleErrorCurrZone = zoneSpec && (zoneSpec.onHandleError ? this._zone : parentDelegate._handleErrorCurrZone); this._scheduleTaskZS = zoneSpec && (zoneSpec.onScheduleTask ? zoneSpec : parentDelegate._scheduleTaskZS); this._scheduleTaskDlgt = zoneSpec && (zoneSpec.onScheduleTask ? parentDelegate : parentDelegate._scheduleTaskDlgt); this._scheduleTaskCurrZone = zoneSpec && (zoneSpec.onScheduleTask ? this._zone : parentDelegate._scheduleTaskCurrZone); this._invokeTaskZS = zoneSpec && (zoneSpec.onInvokeTask ? zoneSpec : parentDelegate._invokeTaskZS); this._invokeTaskDlgt = zoneSpec && (zoneSpec.onInvokeTask ? parentDelegate : parentDelegate._invokeTaskDlgt); this._invokeTaskCurrZone = zoneSpec && (zoneSpec.onInvokeTask ? this._zone : parentDelegate._invokeTaskCurrZone); this._cancelTaskZS = zoneSpec && (zoneSpec.onCancelTask ? zoneSpec : parentDelegate._cancelTaskZS); this._cancelTaskDlgt = zoneSpec && (zoneSpec.onCancelTask ? parentDelegate : parentDelegate._cancelTaskDlgt); this._cancelTaskCurrZone = zoneSpec && (zoneSpec.onCancelTask ? this._zone : parentDelegate._cancelTaskCurrZone); this._hasTaskZS = null; this._hasTaskDlgt = null; this._hasTaskDlgtOwner = null; this._hasTaskCurrZone = null; const zoneSpecHasTask = zoneSpec && zoneSpec.onHasTask; const parentHasTask = parentDelegate && parentDelegate._hasTaskZS; if (zoneSpecHasTask || parentHasTask) { // If we need to report hasTask, than this ZS needs to do ref counting on tasks. In such // a case all task related interceptors must go through this ZD. We can't short circuit it. this._hasTaskZS = zoneSpecHasTask ? zoneSpec : DELEGATE_ZS; this._hasTaskDlgt = parentDelegate; this._hasTaskDlgtOwner = this; this._hasTaskCurrZone = this._zone; if (!zoneSpec.onScheduleTask) { this._scheduleTaskZS = DELEGATE_ZS; this._scheduleTaskDlgt = parentDelegate; this._scheduleTaskCurrZone = this._zone; } if (!zoneSpec.onInvokeTask) { this._invokeTaskZS = DELEGATE_ZS; this._invokeTaskDlgt = parentDelegate; this._invokeTaskCurrZone = this._zone; } if (!zoneSpec.onCancelTask) { this._cancelTaskZS = DELEGATE_ZS; this._cancelTaskDlgt = parentDelegate; this._cancelTaskCurrZone = this._zone; } } } fork(targetZone, zoneSpec) { return this._forkZS ? this._forkZS.onFork(this._forkDlgt, this.zone, targetZone, zoneSpec) : new ZoneImpl(targetZone, zoneSpec); } intercept(targetZone, callback, source) { return this._interceptZS ? this._interceptZS.onIntercept(this._interceptDlgt, this._interceptCurrZone, targetZone, callback, source) : callback; } invoke(targetZone, callback, applyThis, applyArgs, source) { return this._invokeZS ? this._invokeZS.onInvoke(this._invokeDlgt, this._invokeCurrZone, targetZone, callback, applyThis, applyArgs, source) : callback.apply(applyThis, applyArgs); } handleError(targetZone, error) { return this._handleErrorZS ? this._handleErrorZS.onHandleError(this._handleErrorDlgt, this._handleErrorCurrZone, targetZone, error) : true; } scheduleTask(targetZone, task) { let returnTask = task; if (this._scheduleTaskZS) { if (this._hasTaskZS) { returnTask._zoneDelegates.push(this._hasTaskDlgtOwner); } returnTask = this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt, this._scheduleTaskCurrZone, targetZone, task); if (!returnTask) returnTask = task; } else { if (task.scheduleFn) { task.scheduleFn(task); } else if (task.type == microTask) { scheduleMicroTask(task); } else { throw new Error('Task is missing scheduleFn.'); } } return returnTask; } invokeTask(targetZone, task, applyThis, applyArgs) { return this._invokeTaskZS ? this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt, this._invokeTaskCurrZone, targetZone, task, applyThis, applyArgs) : task.callback.apply(applyThis, applyArgs); } cancelTask(targetZone, task) { let value; if (this._cancelTaskZS) { value = this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt, this._cancelTaskCurrZone, targetZone, task); } else { if (!task.cancelFn) { throw Error('Task is not cancelable'); } value = task.cancelFn(task); } return value; } hasTask(targetZone, isEmpty) { // hasTask should not throw error so other ZoneDelegate // can still trigger hasTask callback try { this._hasTaskZS && this._hasTaskZS.onHasTask(this._hasTaskDlgt, this._hasTaskCurrZone, targetZone, isEmpty); } catch (err) { this.handleError(targetZone, err); } } _updateTaskCount(type, count) { const counts = this._taskCounts; const prev = counts[type]; const next = (counts[type] = prev + count); if (next < 0) { throw new Error('More tasks executed then were scheduled.'); } if (prev == 0 || next == 0) { const isEmpty = { microTask: counts['microTask'] > 0, macroTask: counts['macroTask'] > 0, eventTask: counts['eventTask'] > 0, change: type, }; this.hasTask(this._zone, isEmpty); } } } class ZoneTask { type; source; invoke; callback; data; scheduleFn; cancelFn; _zone = null; runCount = 0; _zoneDelegates = null; _state = 'notScheduled'; constructor(type, source, callback, options, scheduleFn, cancelFn) { this.type = type; this.source = source; this.data = options; this.scheduleFn = scheduleFn; this.cancelFn = cancelFn; if (!callback) { throw new Error('callback is not defined'); } this.callback = callback; const self = this; // TODO: @JiaLiPassion options should have interface if (type === eventTask && options && options.useG) { this.invoke = ZoneTask.invokeTask; } else { this.invoke = function () { return ZoneTask.invokeTask.call(global, self, this, arguments); }; } } static invokeTask(task, target, args) { if (!task) { task = this; } _numberOfNestedTaskFrames++; try { task.runCount++; return task.zone.runTask(task, target, args); } finally { if (_numberOfNestedTaskFrames == 1) { drainMicroTaskQueue(); } _numberOfNestedTaskFrames--; } } get zone() { return this._zone; } get state() { return this._state; } cancelScheduleRequest() { this._transitionTo(notScheduled, scheduling); } _transitionTo(toState, fromState1, fromState2) { if (this._state === fromState1 || this._state === fromState2) { this._state = toState; if (toState == notScheduled) { this._zoneDelegates = null; } } else { throw new Error(`${this.type} '${this.source}': can not transition to '${toState}', expecting state '${fromState1}'${fromState2 ? " or '" + fromState2 + "'" : ''}, was '${this._state}'.`); } } toString() { if (this.data && typeof this.data.handleId !== 'undefined') { return this.data.handleId.toString(); } else { return Object.prototype.toString.call(this); } } // add toJSON method to prevent cyclic error when // call JSON.stringify(zoneTask) toJSON() { return { type: this.type, state: this.state, source: this.source, zone: this.zone.name, runCount: this.runCount, }; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// MICROTASK QUEUE ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const symbolSetTimeout = __symbol__('setTimeout'); const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); let _microTaskQueue = []; let _isDrainingMicrotaskQueue = false; let nativeMicroTaskQueuePromise; function nativeScheduleMicroTask(func) { if (!nativeMicroTaskQueuePromise) { if (global[symbolPromise]) { nativeMicroTaskQueuePromise = global[symbolPromise].resolve(0); } } if (nativeMicroTaskQueuePromise) { let nativeThen = nativeMicroTaskQueuePromise[symbolThen]; if (!nativeThen) { // native Promise is not patchable, we need to use `then` directly // issue 1078 nativeThen = nativeMicroTaskQueuePromise['then']; } nativeThen.call(nativeMicroTaskQueuePromise, func); } else { global[symbolSetTimeout](func, 0); } } function scheduleMicroTask(task) { // if we are not running in any task, and there has not been anything scheduled // we must bootstrap the initial task creation by manually scheduling the drain if (_numberOfNestedTaskFrames === 0 && _microTaskQueue.length === 0) { // We are not running in Task, so we need to kickstart the microtask queue. nativeScheduleMicroTask(drainMicroTaskQueue); } task && _microTaskQueue.push(task); } function drainMicroTaskQueue() { if (!_isDrainingMicrotaskQueue) { _isDrainingMicrotaskQueue = true; while (_microTaskQueue.length) { const queue = _microTaskQueue; _microTaskQueue = []; for (let i = 0; i < queue.length; i++) { const task = queue[i]; try { task.zone.runTask(task, null, null); } catch (error) { _api.onUnhandledError(error); } } } _api.microtaskDrainDone(); _isDrainingMicrotaskQueue = false; } } ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// /// BOOTSTRAP ////////////////////////////////////////////////////// ////////////////////////////////////////////////////// const NO_ZONE = { name: 'NO ZONE' }; const notScheduled = 'notScheduled', scheduling = 'scheduling', scheduled = 'scheduled', running = 'running', canceling = 'canceling', unknown = 'unknown'; const microTask = 'microTask', macroTask = 'macroTask', eventTask = 'eventTask'; const patches = {}; const _api = { symbol: __symbol__, currentZoneFrame: () => _currentZoneFrame, onUnhandledError: noop, microtaskDrainDone: noop, scheduleMicroTask: scheduleMicroTask, showUncaughtError: () => !ZoneImpl[__symbol__('ignoreConsoleErrorUncaughtError')], patchEventTarget: () => [], patchOnProperties: noop, patchMethod: () => noop, bindArguments: () => [], patchThen: () => noop, patchMacroTask: () => noop, patchEventPrototype: () => noop, isIEOrEdge: () => false, getGlobalObjects: () => undefined, ObjectDefineProperty: () => noop, ObjectGetOwnPropertyDescriptor: () => undefined, ObjectCreate: () => undefined, ArraySlice: () => [], patchClass: () => noop, wrapWithCurrentZone: () => noop, filterProperties: () => [], attachOriginToPatched: () => noop, _redefineProperty: () => noop, patchCallbacks: () => noop, nativeScheduleMicroTask: nativeScheduleMicroTask, }; let _currentZoneFrame = { parent: null, zone: new ZoneImpl(null, null) }; let _currentTask = null; let _numberOfNestedTaskFrames = 0; function noop() { } performanceMeasure('Zone', 'Zone'); return ZoneImpl; } function loadZone() { // if global['Zone'] already exists (maybe zone.js was already loaded or // some other lib also registered a global object named Zone), we may need // to throw an error, but sometimes user may not want this error. // For example, // we have two web pages, page1 includes zone.js, page2 doesn't. // and the 1st time user load page1 and page2, everything work fine, // but when user load page2 again, error occurs because global['Zone'] already exists. // so we add a flag to let user choose whether to throw this error or not. // By default, if existing Zone is from zone.js, we will not throw the error. const global = globalThis; const checkDuplicate = global[__symbol__('forceDuplicateZoneCheck')] === true; if (global['Zone'] && (checkDuplicate || typeof global['Zone'].__symbol__ !== 'function')) { throw new Error('Zone already loaded.'); } // Initialize global `Zone` constant. global['Zone'] ??= initZone(); return global['Zone']; } /** * Suppress closure compiler errors about unknown 'Zone' variable * @fileoverview * @suppress {undefinedVars,globalThis,missingRequire} */ /// // issue #989, to reduce bundle size, use short name /** Object.getOwnPropertyDescriptor */ const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; /** Object.defineProperty */ const ObjectDefineProperty = Object.defineProperty; /** Object.getPrototypeOf */ const ObjectGetPrototypeOf = Object.getPrototypeOf; /** Object.create */ const ObjectCreate = Object.create; /** Array.prototype.slice */ const ArraySlice = Array.prototype.slice; /** addEventListener string const */ const ADD_EVENT_LISTENER_STR = 'addEventListener'; /** removeEventListener string const */ const REMOVE_EVENT_LISTENER_STR = 'removeEventListener'; /** zoneSymbol addEventListener */ const ZONE_SYMBOL_ADD_EVENT_LISTENER = __symbol__(ADD_EVENT_LISTENER_STR); /** zoneSymbol removeEventListener */ const ZONE_SYMBOL_REMOVE_EVENT_LISTENER = __symbol__(REMOVE_EVENT_LISTENER_STR); /** true string const */ const TRUE_STR = 'true'; /** false string const */ const FALSE_STR = 'false'; /** Zone symbol prefix string const. */ const ZONE_SYMBOL_PREFIX = __symbol__(''); function wrapWithCurrentZone(callback, source) { return Zone.current.wrap(callback, source); } function scheduleMacroTaskWithCurrentZone(source, callback, data, customSchedule, customCancel) { return Zone.current.scheduleMacroTask(source, callback, data, customSchedule, customCancel); } const zoneSymbol = __symbol__; const isWindowExists = typeof window !== 'undefined'; const internalWindow = isWindowExists ? window : undefined; const _global = (isWindowExists && internalWindow) || globalThis; const REMOVE_ATTRIBUTE = 'removeAttribute'; function bindArguments(args, source) { for (let i = args.length - 1; i >= 0; i--) { if (typeof args[i] === 'function') { args[i] = wrapWithCurrentZone(args[i], source + '_' + i); } } return args; } function patchPrototype(prototype, fnNames) { const source = prototype.constructor['name']; for (let i = 0; i < fnNames.length; i++) { const name = fnNames[i]; const delegate = prototype[name]; if (delegate) { const prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, name); if (!isPropertyWritable(prototypeDesc)) { continue; } prototype[name] = ((delegate) => { const patched = function () { return delegate.apply(this, bindArguments(arguments, source + '.' + name)); }; attachOriginToPatched(patched, delegate); return patched; })(delegate); } } } function isPropertyWritable(propertyDesc) { if (!propertyDesc) { return true; } if (propertyDesc.writable === false) { return false; } return !(typeof propertyDesc.get === 'function' && typeof propertyDesc.set === 'undefined'); } const isWebWorker = typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope; // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isNode = !('nw' in _global) && typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]'; const isBrowser = !isNode && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); // we are in electron of nw, so we are both browser and nodejs // Make sure to access `process` through `_global` so that WebPack does not accidentally browserify // this code. const isMix = typeof _global.process !== 'undefined' && _global.process.toString() === '[object process]' && !isWebWorker && !!(isWindowExists && internalWindow['HTMLElement']); const zoneSymbolEventNames$1 = {}; const enableBeforeunloadSymbol = zoneSymbol('enable_beforeunload'); const wrapFn = function (event) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } let eventNameSymbol = zoneSymbolEventNames$1[event.type]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[event.type] = zoneSymbol('ON_PROPERTY' + event.type); } const target = this || event.target || _global; const listener = target[eventNameSymbol]; let result; if (isBrowser && target === internalWindow && event.type === 'error') { // window.onerror have different signature // https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror#window.onerror // and onerror callback will prevent default when callback return true const errorEvent = event; result = listener && listener.call(this, errorEvent.message, errorEvent.filename, errorEvent.lineno, errorEvent.colno, errorEvent.error); if (result === true) { event.preventDefault(); } } else { result = listener && listener.apply(this, arguments); if ( // https://github.com/angular/angular/issues/47579 // https://www.w3.org/TR/2011/WD-html5-20110525/history.html#beforeunloadevent // This is the only specific case we should check for. The spec defines that the // `returnValue` attribute represents the message to show the user. When the event // is created, this attribute must be set to the empty string. event.type === 'beforeunload' && // To prevent any breaking changes resulting from this change, given that // it was already causing a significant number of failures in G3, we have hidden // that behavior behind a global configuration flag. Consumers can enable this // flag explicitly if they want the `beforeunload` event to be handled as defined // in the specification. _global[enableBeforeunloadSymbol] && // The IDL event definition is `attribute DOMString returnValue`, so we check whether // `typeof result` is a string. typeof result === 'string') { event.returnValue = result; } else if (result != undefined && !result) { event.preventDefault(); } } return result; }; function patchProperty(obj, prop, prototype) { let desc = ObjectGetOwnPropertyDescriptor(obj, prop); if (!desc && prototype) { // when patch window object, use prototype to check prop exist or not const prototypeDesc = ObjectGetOwnPropertyDescriptor(prototype, prop); if (prototypeDesc) { desc = { enumerable: true, configurable: true }; } } // if the descriptor not exists or is not configurable // just return if (!desc || !desc.configurable) { return; } const onPropPatchedSymbol = zoneSymbol('on' + prop + 'patched'); if (obj.hasOwnProperty(onPropPatchedSymbol) && obj[onPropPatchedSymbol]) { return; } // A property descriptor cannot have getter/setter and be writable // deleting the writable and value properties avoids this error: // // TypeError: property descriptors must not specify a value or be writable when a // getter or setter has been specified delete desc.writable; delete desc.value; const originalDescGet = desc.get; const originalDescSet = desc.set; // slice(2) cuz 'onclick' -> 'click', etc const eventName = prop.slice(2); let eventNameSymbol = zoneSymbolEventNames$1[eventName]; if (!eventNameSymbol) { eventNameSymbol = zoneSymbolEventNames$1[eventName] = zoneSymbol('ON_PROPERTY' + eventName); } desc.set = function (newValue) { // In some versions of Windows, the `this` context may be undefined // in on-property callbacks. // To handle this edge case, we check if `this` is falsy and // fallback to `_global` if needed. let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return; } const previousValue = target[eventNameSymbol]; if (typeof previousValue === 'function') { target.removeEventListener(eventName, wrapFn); } // https://github.com/angular/zone.js/issues/978 // If an inline handler (like `onload`) was defined before zone.js was loaded, // call the original descriptor's setter to clean it up. originalDescSet?.call(target, null); target[eventNameSymbol] = newValue; if (typeof newValue === 'function') { target.addEventListener(eventName, wrapFn, false); } }; // The getter would return undefined for unassigned properties but the default value of an // unassigned property is null desc.get = function () { // in some of windows's onproperty callback, this is undefined // so we need to check it let target = this; if (!target && obj === _global) { target = _global; } if (!target) { return null; } const listener = target[eventNameSymbol]; if (listener) { return listener; } else if (originalDescGet) { // result will be null when use inline event attribute, // such as // because the onclick function is internal raw uncompiled handler // the onclick will be evaluated when first time event was triggered or // the property is accessed, https://github.com/angular/zone.js/issues/525 // so we should use original native get to retrieve the handler let value = originalDescGet.call(this); if (value) { desc.set.call(this, value); if (typeof target[REMOVE_ATTRIBUTE] === 'function') { target.removeAttribute(prop); } return value; } } return null; }; ObjectDefineProperty(obj, prop, desc); obj[onPropPatchedSymbol] = true; } function patchOnProperties(obj, properties, prototype) { if (properties) { for (let i = 0; i < properties.length; i++) { patchProperty(obj, 'on' + properties[i], prototype); } } else { const onProperties = []; for (const prop in obj) { if (prop.slice(0, 2) == 'on') { onProperties.push(prop); } } for (let j = 0; j < onProperties.length; j++) { patchProperty(obj, onProperties[j], prototype); } } } const originalInstanceKey = zoneSymbol('originalInstance'); // wrap some native API on `window` function patchClass(className) { const OriginalClass = _global[className]; if (!OriginalClass) return; // keep original class in global _global[zoneSymbol(className)] = OriginalClass; _global[className] = function () { const a = bindArguments(arguments, className); switch (a.length) { case 0: this[originalInstanceKey] = new OriginalClass(); break; case 1: this[originalInstanceKey] = new OriginalClass(a[0]); break; case 2: this[originalInstanceKey] = new OriginalClass(a[0], a[1]); break; case 3: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2]); break; case 4: this[originalInstanceKey] = new OriginalClass(a[0], a[1], a[2], a[3]); break; default: throw new Error('Arg list too long.'); } }; // attach original delegate to patched function attachOriginToPatched(_global[className], OriginalClass); const instance = new OriginalClass(function () { }); let prop; for (prop in instance) { // https://bugs.webkit.org/show_bug.cgi?id=44721 if (className === 'XMLHttpRequest' && prop === 'responseBlob') continue; (function (prop) { if (typeof instance[prop] === 'function') { _global[className].prototype[prop] = function () { return this[originalInstanceKey][prop].apply(this[originalInstanceKey], arguments); }; } else { ObjectDefineProperty(_global[className].prototype, prop, { set: function (fn) { if (typeof fn === 'function') { this[originalInstanceKey][prop] = wrapWithCurrentZone(fn, className + '.' + prop); // keep callback in wrapped function so we can // use it in Function.prototype.toString to return // the native one. attachOriginToPatched(this[originalInstanceKey][prop], fn); } else { this[originalInstanceKey][prop] = fn; } }, get: function () { return this[originalInstanceKey][prop]; }, }); } })(prop); } for (prop in OriginalClass) { if (prop !== 'prototype' && OriginalClass.hasOwnProperty(prop)) { _global[className][prop] = OriginalClass[prop]; } } } function patchMethod(target, name, patchFn) { let proto = target; while (proto && !proto.hasOwnProperty(name)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && target[name]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = target; } const delegateName = zoneSymbol(name); let delegate = null; if (proto && (!(delegate = proto[delegateName]) || !proto.hasOwnProperty(delegateName))) { delegate = proto[delegateName] = proto[name]; // check whether proto[name] is writable // some property is readonly in safari, such as HtmlCanvasElement.prototype.toBlob const desc = proto && ObjectGetOwnPropertyDescriptor(proto, name); if (isPropertyWritable(desc)) { const patchDelegate = patchFn(delegate, delegateName, name); proto[name] = function () { return patchDelegate(this, arguments); }; attachOriginToPatched(proto[name], delegate); } } return delegate; } // TODO: @JiaLiPassion, support cancel task later if necessary function patchMacroTask(obj, funcName, metaCreator) { let setNative = null; function scheduleTask(task) { const data = task.data; data.args[data.cbIdx] = function () { task.invoke.apply(this, arguments); }; setNative.apply(data.target, data.args); return task; } setNative = patchMethod(obj, funcName, (delegate) => function (self, args) { const meta = metaCreator(self, args); if (meta.cbIdx >= 0 && typeof args[meta.cbIdx] === 'function') { return scheduleMacroTaskWithCurrentZone(meta.name, args[meta.cbIdx], meta, scheduleTask); } else { // cause an error by calling it directly. return delegate.apply(self, args); } }); } function attachOriginToPatched(patched, original) { patched[zoneSymbol('OriginalDelegate')] = original; } let isDetectedIEOrEdge = false; let ieOrEdge = false; function isIEOrEdge() { if (isDetectedIEOrEdge) { return ieOrEdge; } isDetectedIEOrEdge = true; try { const ua = internalWindow.navigator.userAgent; if (ua.indexOf('MSIE ') !== -1 || ua.indexOf('Trident/') !== -1 || ua.indexOf('Edge/') !== -1) { ieOrEdge = true; } } catch (error) { } return ieOrEdge; } function isFunction(value) { return typeof value === 'function'; } function isNumber(value) { return typeof value === 'number'; } /** * @fileoverview * @suppress {missingRequire} */ // an identifier to tell ZoneTask do not create a new invoke closure const OPTIMIZED_ZONE_EVENT_TASK_DATA = { useG: true, }; const zoneSymbolEventNames = {}; const globalSources = {}; const EVENT_NAME_SYMBOL_REGX = new RegExp('^' + ZONE_SYMBOL_PREFIX + '(\\w+)(true|false)$'); const IMMEDIATE_PROPAGATION_SYMBOL = zoneSymbol('propagationStopped'); function prepareEventNames(eventName, eventNameToString) { const falseEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + FALSE_STR; const trueEventName = (eventNameToString ? eventNameToString(eventName) : eventName) + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } function patchEventTarget(_global, api, apis, patchOptions) { const ADD_EVENT_LISTENER = (patchOptions && patchOptions.add) || ADD_EVENT_LISTENER_STR; const REMOVE_EVENT_LISTENER = (patchOptions && patchOptions.rm) || REMOVE_EVENT_LISTENER_STR; const LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.listeners) || 'eventListeners'; const REMOVE_ALL_LISTENERS_EVENT_LISTENER = (patchOptions && patchOptions.rmAll) || 'removeAllListeners'; const zoneSymbolAddEventListener = zoneSymbol(ADD_EVENT_LISTENER); const ADD_EVENT_LISTENER_SOURCE = '.' + ADD_EVENT_LISTENER + ':'; const PREPEND_EVENT_LISTENER = 'prependListener'; const PREPEND_EVENT_LISTENER_SOURCE = '.' + PREPEND_EVENT_LISTENER + ':'; const invokeTask = function (task, target, event) { // for better performance, check isRemoved which is set // by removeEventListener if (task.isRemoved) { return; } const delegate = task.callback; if (typeof delegate === 'object' && delegate.handleEvent) { // create the bind version of handleEvent when invoke task.callback = (event) => delegate.handleEvent(event); task.originalDelegate = delegate; } // invoke static task.invoke // need to try/catch error here, otherwise, the error in one event listener // will break the executions of the other event listeners. Also error will // not remove the event listener when `once` options is true. let error; try { task.invoke(task, target, [event]); } catch (err) { error = err; } const options = task.options; if (options && typeof options === 'object' && options.once) { // if options.once is true, after invoke once remove listener here // only browser need to do this, nodejs eventEmitter will cal removeListener // inside EventEmitter.once const delegate = task.originalDelegate ? task.originalDelegate : task.callback; target[REMOVE_EVENT_LISTENER].call(target, event.type, delegate, options); } return error; }; function globalCallback(context, event, isCapture) { // https://github.com/angular/zone.js/issues/911, in IE, sometimes // event will be undefined, so we need to use window.event event = event || _global.event; if (!event) { return; } // event.target is needed for Samsung TV and SourceBuffer // || global is needed https://github.com/angular/zone.js/issues/190 const target = context || event.target || _global; const tasks = target[zoneSymbolEventNames[event.type][isCapture ? TRUE_STR : FALSE_STR]]; if (tasks) { const errors = []; // invoke all tasks which attached to current target with given event.type and capture = false // for performance concern, if task.length === 1, just invoke if (tasks.length === 1) { const err = invokeTask(tasks[0], target, event); err && errors.push(err); } else { // https://github.com/angular/zone.js/issues/836 // copy the tasks array before invoke, to avoid // the callback will remove itself or other listener const copyTasks = tasks.slice(); for (let i = 0; i < copyTasks.length; i++) { if (event && event[IMMEDIATE_PROPAGATION_SYMBOL] === true) { break; } const err = invokeTask(copyTasks[i], target, event); err && errors.push(err); } } // Since there is only one error, we don't need to schedule microTask // to throw the error. if (errors.length === 1) { throw errors[0]; } else { for (let i = 0; i < errors.length; i++) { const err = errors[i]; api.nativeScheduleMicroTask(() => { throw err; }); } } } } // global shared zoneAwareCallback to handle all event callback with capture = false const globalZoneAwareCallback = function (event) { return globalCallback(this, event, false); }; // global shared zoneAwareCallback to handle all event callback with capture = true const globalZoneAwareCaptureCallback = function (event) { return globalCallback(this, event, true); }; function patchEventTargetMethods(obj, patchOptions) { if (!obj) { return false; } let useGlobalCallback = true; if (patchOptions && patchOptions.useG !== undefined) { useGlobalCallback = patchOptions.useG; } const validateHandler = patchOptions && patchOptions.vh; let checkDuplicate = true; if (patchOptions && patchOptions.chkDup !== undefined) { checkDuplicate = patchOptions.chkDup; } let returnTarget = false; if (patchOptions && patchOptions.rt !== undefined) { returnTarget = patchOptions.rt; } let proto = obj; while (proto && !proto.hasOwnProperty(ADD_EVENT_LISTENER)) { proto = ObjectGetPrototypeOf(proto); } if (!proto && obj[ADD_EVENT_LISTENER]) { // somehow we did not find it, but we can see it. This happens on IE for Window properties. proto = obj; } if (!proto) { return false; } if (proto[zoneSymbolAddEventListener]) { return false; } const eventNameToString = patchOptions && patchOptions.eventNameToString; // We use a shared global `taskData` to pass data for `scheduleEventTask`, // eliminating the need to create a new object solely for passing data. // WARNING: This object has a static lifetime, meaning it is not created // each time `addEventListener` is called. It is instantiated only once // and captured by reference inside the `addEventListener` and // `removeEventListener` functions. Do not add any new properties to this // object, as doing so would necessitate maintaining the information // between `addEventListener` calls. const taskData = {}; const nativeAddEventListener = (proto[zoneSymbolAddEventListener] = proto[ADD_EVENT_LISTENER]); const nativeRemoveEventListener = (proto[zoneSymbol(REMOVE_EVENT_LISTENER)] = proto[REMOVE_EVENT_LISTENER]); const nativeListeners = (proto[zoneSymbol(LISTENERS_EVENT_LISTENER)] = proto[LISTENERS_EVENT_LISTENER]); const nativeRemoveAllListeners = (proto[zoneSymbol(REMOVE_ALL_LISTENERS_EVENT_LISTENER)] = proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER]); let nativePrependEventListener; if (patchOptions && patchOptions.prepend) { nativePrependEventListener = proto[zoneSymbol(patchOptions.prepend)] = proto[patchOptions.prepend]; } /** * This util function will build an option object with passive option * to handle all possible input from the user. */ function buildEventListenerOptions(options, passive) { if (!passive) { return options; } if (typeof options === 'boolean') { return { capture: options, passive: true }; } if (!options) { return { passive: true }; } if (typeof options === 'object' && options.passive !== false) { return { ...options, passive: true }; } return options; } const customScheduleGlobal = function (task) { // if there is already a task for the eventName + capture, // just return, because we use the shared globalZoneAwareCallback here. if (taskData.isExisting) { return; } return nativeAddEventListener.call(taskData.target, taskData.eventName, taskData.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, taskData.options); }; /** * In the context of events and listeners, this function will be * called at the end by `cancelTask`, which, in turn, calls `task.cancelFn`. * Cancelling a task is primarily used to remove event listeners from * the task target. */ const customCancelGlobal = function (task) { // if task is not marked as isRemoved, this call is directly // from Zone.prototype.cancelTask, we should remove the task // from tasksList of target first if (!task.isRemoved) { const symbolEventNames = zoneSymbolEventNames[task.eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[task.capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && task.target[symbolEventName]; if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (existingTask === task) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check task.isRemoved = true; if (task.removeAbortListener) { task.removeAbortListener(); task.removeAbortListener = null; } if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target task.allRemoved = true; task.target[symbolEventName] = null; } break; } } } } // if all tasks for the eventName + capture have gone, // we will really remove the global event callback, // if not, return if (!task.allRemoved) { return; } return nativeRemoveEventListener.call(task.target, task.eventName, task.capture ? globalZoneAwareCaptureCallback : globalZoneAwareCallback, task.options); }; const customScheduleNonGlobal = function (task) { return nativeAddEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customSchedulePrepend = function (task) { return nativePrependEventListener.call(taskData.target, taskData.eventName, task.invoke, taskData.options); }; const customCancelNonGlobal = function (task) { return nativeRemoveEventListener.call(task.target, task.eventName, task.invoke, task.options); }; const customSchedule = useGlobalCallback ? customScheduleGlobal : customScheduleNonGlobal; const customCancel = useGlobalCallback ? customCancelGlobal : customCancelNonGlobal; const compareTaskCallbackVsDelegate = function (task, delegate) { const typeOfDelegate = typeof delegate; return ((typeOfDelegate === 'function' && task.callback === delegate) || (typeOfDelegate === 'object' && task.originalDelegate === delegate)); }; const compare = patchOptions?.diff || compareTaskCallbackVsDelegate; const unpatchedEvents = Zone[zoneSymbol('UNPATCHED_EVENTS')]; const passiveEvents = _global[zoneSymbol('PASSIVE_EVENTS')]; function copyEventListenerOptions(options) { if (typeof options === 'object' && options !== null) { // We need to destructure the target `options` object since it may // be frozen or sealed (possibly provided implicitly by a third-party // library), or its properties may be readonly. const newOptions = { ...options }; // The `signal` option was recently introduced, which caused regressions in // third-party scenarios where `AbortController` was directly provided to // `addEventListener` as options. For instance, in cases like // `document.addEventListener('keydown', callback, abortControllerInstance)`, // which is valid because `AbortController` includes a `signal` getter, spreading // `{...options}` wouldn't copy the `signal`. Additionally, using `Object.create` // isn't feasible since `AbortController` is a built-in object type, and attempting // to create a new object directly with it as the prototype might result in // unexpected behavior. if (options.signal) { newOptions.signal = options.signal; } return newOptions; } return options; } const makeAddListener = function (nativeListener, addSource, customScheduleFn, customCancelFn, returnTarget = false, prepend = false) { return function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } let delegate = arguments[1]; if (!delegate) { return nativeListener.apply(this, arguments); } if (isNode && eventName === 'uncaughtException') { // don't patch uncaughtException of nodejs to prevent endless loop return nativeListener.apply(this, arguments); } // To improve `addEventListener` performance, we will create the callback // for the task later when the task is invoked. let isEventListenerObject = false; if (typeof delegate !== 'function') { // This checks whether the provided listener argument is an object with // a `handleEvent` method (since we can call `addEventListener` with a // function `event => ...` or with an object `{ handleEvent: event => ... }`). if (!delegate.handleEvent) { return nativeListener.apply(this, arguments); } isEventListenerObject = true; } if (validateHandler && !validateHandler(nativeListener, delegate, target, arguments)) { return; } const passive = !!passiveEvents && passiveEvents.indexOf(eventName) !== -1; const options = copyEventListenerOptions(buildEventListenerOptions(arguments[2], passive)); const signal = options?.signal; if (signal?.aborted) { // the signal is an aborted one, just return without attaching the event listener. return; } if (unpatchedEvents) { // check unpatched list for (let i = 0; i < unpatchedEvents.length; i++) { if (eventName === unpatchedEvents[i]) { if (passive) { return nativeListener.call(target, eventName, delegate, options); } else { return nativeListener.apply(this, arguments); } } } } const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const once = options && typeof options === 'object' ? options.once : false; const zone = Zone.current; let symbolEventNames = zoneSymbolEventNames[eventName]; if (!symbolEventNames) { prepareEventNames(eventName, eventNameToString); symbolEventNames = zoneSymbolEventNames[eventName]; } const symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; let existingTasks = target[symbolEventName]; let isExisting = false; if (existingTasks) { // already have task registered isExisting = true; if (checkDuplicate) { for (let i = 0; i < existingTasks.length; i++) { if (compare(existingTasks[i], delegate)) { // same callback, same capture, same event name, just return return; } } } } else { existingTasks = target[symbolEventName] = []; } let source; const constructorName = target.constructor['name']; const targetSource = globalSources[constructorName]; if (targetSource) { source = targetSource[eventName]; } if (!source) { source = constructorName + addSource + (eventNameToString ? eventNameToString(eventName) : eventName); } // In the code below, `options` should no longer be reassigned; instead, it // should only be mutated. This is because we pass that object to the native // `addEventListener`. // It's generally recommended to use the same object reference for options. // This ensures consistency and avoids potential issues. taskData.options = options; if (once) { // When using `addEventListener` with the `once` option, we don't pass // the `once` option directly to the native `addEventListener` method. // Instead, we keep the `once` setting and handle it ourselves. taskData.options.once = false; } taskData.target = target; taskData.capture = capture; taskData.eventName = eventName; taskData.isExisting = isExisting; const data = useGlobalCallback ? OPTIMIZED_ZONE_EVENT_TASK_DATA : undefined; // keep taskData into data to allow onScheduleEventTask to access the task information if (data) { data.taskData = taskData; } if (signal) { // When using `addEventListener` with the `signal` option, we don't pass // the `signal` option directly to the native `addEventListener` method. // Instead, we keep the `signal` setting and handle it ourselves. taskData.options.signal = undefined; } // The `scheduleEventTask` function will ultimately call `customScheduleGlobal`, // which in turn calls the native `addEventListener`. This is why `taskData.options` // is updated before scheduling the task, as `customScheduleGlobal` uses // `taskData.options` to pass it to the native `addEventListener`. const task = zone.scheduleEventTask(source, delegate, data, customScheduleFn, customCancelFn); if (signal) { // after task is scheduled, we need to store the signal back to task.options taskData.options.signal = signal; // Wrapping `task` in a weak reference would not prevent memory leaks. Weak references are // primarily used for preventing strong references cycles. `onAbort` is always reachable // as it's an event listener, so its closure retains a strong reference to the `task`. const onAbort = () => task.zone.cancelTask(task); nativeListener.call(signal, 'abort', onAbort, { once: true }); // We need to remove the `abort` listener when the event listener is going to be removed, // as it creates a closure that captures `task`. This closure retains a reference to the // `task` object even after it goes out of scope, preventing `task` from being garbage // collected. task.removeAbortListener = () => signal.removeEventListener('abort', onAbort); } // should clear taskData.target to avoid memory leak // issue, https://github.com/angular/angular/issues/20442 taskData.target = null; // need to clear up taskData because it is a global object if (data) { data.taskData = null; } // have to save those information to task in case // application may call task.zone.cancelTask() directly if (once) { taskData.options.once = true; } if (typeof task.options !== 'boolean') { // We should save the options on the task (if it's an object) because // we'll be using `task.options` later when removing the event listener // and passing it back to `removeEventListener`. task.options = options; } task.target = target; task.capture = capture; task.eventName = eventName; if (isEventListenerObject) { // save original delegate for compare to check duplicate task.originalDelegate = delegate; } if (!prepend) { existingTasks.push(task); } else { existingTasks.unshift(task); } if (returnTarget) { return target; } }; }; proto[ADD_EVENT_LISTENER] = makeAddListener(nativeAddEventListener, ADD_EVENT_LISTENER_SOURCE, customSchedule, customCancel, returnTarget); if (nativePrependEventListener) { proto[PREPEND_EVENT_LISTENER] = makeAddListener(nativePrependEventListener, PREPEND_EVENT_LISTENER_SOURCE, customSchedulePrepend, customCancel, returnTarget, true); } proto[REMOVE_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const options = arguments[2]; const capture = !options ? false : typeof options === 'boolean' ? true : options.capture; const delegate = arguments[1]; if (!delegate) { return nativeRemoveEventListener.apply(this, arguments); } if (validateHandler && !validateHandler(nativeRemoveEventListener, delegate, target, arguments)) { return; } const symbolEventNames = zoneSymbolEventNames[eventName]; let symbolEventName; if (symbolEventNames) { symbolEventName = symbolEventNames[capture ? TRUE_STR : FALSE_STR]; } const existingTasks = symbolEventName && target[symbolEventName]; // `existingTasks` may not exist if the `addEventListener` was called before // it was patched by zone.js. Please refer to the attached issue for // clarification, particularly after the `if` condition, before calling // the native `removeEventListener`. if (existingTasks) { for (let i = 0; i < existingTasks.length; i++) { const existingTask = existingTasks[i]; if (compare(existingTask, delegate)) { existingTasks.splice(i, 1); // set isRemoved to data for faster invokeTask check existingTask.isRemoved = true; if (existingTasks.length === 0) { // all tasks for the eventName + capture have gone, // remove globalZoneAwareCallback and remove the task cache from target existingTask.allRemoved = true; target[symbolEventName] = null; // in the target, we have an event listener which is added by on_property // such as target.onclick = function() {}, so we need to clear this internal // property too if all delegates with capture=false were removed // https:// github.com/angular/angular/issues/31643 // https://github.com/angular/angular/issues/54581 if (!capture && typeof eventName === 'string') { const onPropertySymbol = ZONE_SYMBOL_PREFIX + 'ON_PROPERTY' + eventName; target[onPropertySymbol] = null; } } // In all other conditions, when `addEventListener` is called after being // patched by zone.js, we would always find an event task on the `EventTarget`. // This will trigger `cancelFn` on the `existingTask`, leading to `customCancelGlobal`, // which ultimately removes an event listener and cleans up the abort listener // (if an `AbortSignal` was provided when scheduling a task). existingTask.zone.cancelTask(existingTask); if (returnTarget) { return target; } return; } } } // https://github.com/angular/zone.js/issues/930 // We may encounter a situation where the `addEventListener` was // called on the event target before zone.js is loaded, resulting // in no task being stored on the event target due to its invocation // of the native implementation. In this scenario, we simply need to // invoke the native `removeEventListener`. return nativeRemoveEventListener.apply(this, arguments); }; proto[LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const listeners = []; const tasks = findEventTasks(target, eventNameToString ? eventNameToString(eventName) : eventName); for (let i = 0; i < tasks.length; i++) { const task = tasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; listeners.push(delegate); } return listeners; }; proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER] = function () { const target = this || _global; let eventName = arguments[0]; if (!eventName) { const keys = Object.keys(target); for (let i = 0; i < keys.length; i++) { const prop = keys[i]; const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; // in nodejs EventEmitter, removeListener event is // used for monitoring the removeListener call, // so just keep removeListener eventListener until // all other eventListeners are removed if (evtName && evtName !== 'removeListener') { this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, evtName); } } // remove removeListener listener finally this[REMOVE_ALL_LISTENERS_EVENT_LISTENER].call(this, 'removeListener'); } else { if (patchOptions && patchOptions.transferEventName) { eventName = patchOptions.transferEventName(eventName); } const symbolEventNames = zoneSymbolEventNames[eventName]; if (symbolEventNames) { const symbolEventName = symbolEventNames[FALSE_STR]; const symbolCaptureEventName = symbolEventNames[TRUE_STR]; const tasks = target[symbolEventName]; const captureTasks = target[symbolCaptureEventName]; if (tasks) { const removeTasks = tasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } if (captureTasks) { const removeTasks = captureTasks.slice(); for (let i = 0; i < removeTasks.length; i++) { const task = removeTasks[i]; let delegate = task.originalDelegate ? task.originalDelegate : task.callback; this[REMOVE_EVENT_LISTENER].call(this, eventName, delegate, task.options); } } } } if (returnTarget) { return this; } }; // for native toString patch attachOriginToPatched(proto[ADD_EVENT_LISTENER], nativeAddEventListener); attachOriginToPatched(proto[REMOVE_EVENT_LISTENER], nativeRemoveEventListener); if (nativeRemoveAllListeners) { attachOriginToPatched(proto[REMOVE_ALL_LISTENERS_EVENT_LISTENER], nativeRemoveAllListeners); } if (nativeListeners) { attachOriginToPatched(proto[LISTENERS_EVENT_LISTENER], nativeListeners); } return true; } let results = []; for (let i = 0; i < apis.length; i++) { results[i] = patchEventTargetMethods(apis[i], patchOptions); } return results; } function findEventTasks(target, eventName) { if (!eventName) { const foundTasks = []; for (let prop in target) { const match = EVENT_NAME_SYMBOL_REGX.exec(prop); let evtName = match && match[1]; if (evtName && (!eventName || evtName === eventName)) { const tasks = target[prop]; if (tasks) { for (let i = 0; i < tasks.length; i++) { foundTasks.push(tasks[i]); } } } } return foundTasks; } let symbolEventName = zoneSymbolEventNames[eventName]; if (!symbolEventName) { prepareEventNames(eventName); symbolEventName = zoneSymbolEventNames[eventName]; } const captureFalseTasks = target[symbolEventName[FALSE_STR]]; const captureTrueTasks = target[symbolEventName[TRUE_STR]]; if (!captureFalseTasks) { return captureTrueTasks ? captureTrueTasks.slice() : []; } else { return captureTrueTasks ? captureFalseTasks.concat(captureTrueTasks) : captureFalseTasks.slice(); } } function patchEventPrototype(global, api) { const Event = global['Event']; if (Event && Event.prototype) { api.patchMethod(Event.prototype, 'stopImmediatePropagation', (delegate) => function (self, args) { self[IMMEDIATE_PROPAGATION_SYMBOL] = true; // we need to call the native stopImmediatePropagation // in case in some hybrid application, some part of // application will be controlled by zone, some are not delegate && delegate.apply(self, args); }); } } /** * @fileoverview * @suppress {missingRequire} */ function patchQueueMicrotask(global, api) { api.patchMethod(global, 'queueMicrotask', (delegate) => { return function (self, args) { Zone.current.scheduleMicroTask('queueMicrotask', args[0]); }; }); } /** * @fileoverview * @suppress {missingRequire} */ const taskSymbol = zoneSymbol('zoneTask'); function patchTimer(window, setName, cancelName, nameSuffix) { let setNative = null; let clearNative = null; setName += nameSuffix; cancelName += nameSuffix; const tasksByHandleId = {}; function scheduleTask(task) { const data = task.data; data.args[0] = function () { return task.invoke.apply(this, arguments); }; const handleOrId = setNative.apply(window, data.args); // Whlist on Node.js when get can the ID by using `[Symbol.toPrimitive]()` we do // to this so that we do not cause potentally leaks when using `setTimeout` // since this can be periodic when using `.refresh`. if (isNumber(handleOrId)) { data.handleId = handleOrId; } else { data.handle = handleOrId; // On Node.js a timeout and interval can be restarted over and over again by using the `.refresh` method. data.isRefreshable = isFunction(handleOrId.refresh); } return task; } function clearTask(task) { const { handle, handleId } = task.data; return clearNative.call(window, handle ?? handleId); } setNative = patchMethod(window, setName, (delegate) => function (self, args) { if (isFunction(args[0])) { const options = { isRefreshable: false, isPeriodic: nameSuffix === 'Interval', delay: nameSuffix === 'Timeout' || nameSuffix === 'Interval' ? args[1] || 0 : undefined, args: args, }; const callback = args[0]; args[0] = function timer() { try { return callback.apply(this, arguments); } finally { // issue-934, task will be cancelled // even it is a periodic task such as // setInterval // https://github.com/angular/angular/issues/40387 // Cleanup tasksByHandleId should be handled before scheduleTask // Since some zoneSpec may intercept and doesn't trigger // scheduleFn(scheduleTask) provided here. const { handle, handleId, isPeriodic, isRefreshable } = options; if (!isPeriodic && !isRefreshable) { if (handleId) { // in non-nodejs env, we remove timerId // from local cache delete tasksByHandleId[handleId]; } else if (handle) { // Node returns complex objects as handleIds // we remove task reference from timer object handle[taskSymbol] = null; } } } }; const task = scheduleMacroTaskWithCurrentZone(setName, args[0], options, scheduleTask, clearTask); if (!task) { return task; } // Node.js must additionally support the ref and unref functions. const { handleId, handle, isRefreshable, isPeriodic } = task.data; if (handleId) { // for non nodejs env, we save handleId: task // mapping in local cache for clearTimeout tasksByHandleId[handleId] = task; } else if (handle) { // for nodejs env, we save task // reference in timerId Object for clearTimeout handle[taskSymbol] = task; if (isRefreshable && !isPeriodic) { const originalRefresh = handle.refresh; handle.refresh = function () { const { zone, state } = task; if (state === 'notScheduled') { task._state = 'scheduled'; zone._updateTaskCount(task, 1); } else if (state === 'running') { task._state = 'scheduling'; } return originalRefresh.call(this); }; } } return handle ?? handleId ?? task; } else { // cause an error by calling it directly. return delegate.apply(window, args); } }); clearNative = patchMethod(window, cancelName, (delegate) => function (self, args) { const id = args[0]; let task; if (isNumber(id)) { // non nodejs env. task = tasksByHandleId[id]; delete tasksByHandleId[id]; } else { // nodejs env ?? other environments. task = id?.[taskSymbol]; if (task) { id[taskSymbol] = null; } else { task = id; } } if (task?.type) { if (task.cancelFn) { // Do not cancel already canceled functions task.zone.cancelTask(task); } } else { // cause an error by calling it directly. delegate.apply(window, args); } }); } function patchCustomElements(_global, api) { const { isBrowser, isMix } = api.getGlobalObjects(); if ((!isBrowser && !isMix) || !_global['customElements'] || !('customElements' in _global)) { return; } // https://html.spec.whatwg.org/multipage/custom-elements.html#concept-custom-element-definition-lifecycle-callbacks const callbacks = [ 'connectedCallback', 'disconnectedCallback', 'adoptedCallback', 'attributeChangedCallback', 'formAssociatedCallback', 'formDisabledCallback', 'formResetCallback', 'formStateRestoreCallback', ]; api.patchCallbacks(api, _global.customElements, 'customElements', 'define', callbacks); } function eventTargetPatch(_global, api) { if (Zone[api.symbol('patchEventTarget')]) { // EventTarget is already patched. return; } const { eventNames, zoneSymbolEventNames, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX } = api.getGlobalObjects(); // predefine all __zone_symbol__ + eventName + true/false string for (let i = 0; i < eventNames.length; i++) { const eventName = eventNames[i]; const falseEventName = eventName + FALSE_STR; const trueEventName = eventName + TRUE_STR; const symbol = ZONE_SYMBOL_PREFIX + falseEventName; const symbolCapture = ZONE_SYMBOL_PREFIX + trueEventName; zoneSymbolEventNames[eventName] = {}; zoneSymbolEventNames[eventName][FALSE_STR] = symbol; zoneSymbolEventNames[eventName][TRUE_STR] = symbolCapture; } const EVENT_TARGET = _global['EventTarget']; if (!EVENT_TARGET || !EVENT_TARGET.prototype) { return; } api.patchEventTarget(_global, api, [EVENT_TARGET && EVENT_TARGET.prototype]); return true; } function patchEvent(global, api) { api.patchEventPrototype(global, api); } /** * @fileoverview * @suppress {globalThis} */ function filterProperties(target, onProperties, ignoreProperties) { if (!ignoreProperties || ignoreProperties.length === 0) { return onProperties; } const tip = ignoreProperties.filter((ip) => ip.target === target); if (tip.length === 0) { return onProperties; } const targetIgnoreProperties = tip[0].ignoreProperties; return onProperties.filter((op) => targetIgnoreProperties.indexOf(op) === -1); } function patchFilteredProperties(target, onProperties, ignoreProperties, prototype) { // check whether target is available, sometimes target will be undefined // because different browser or some 3rd party plugin. if (!target) { return; } const filteredProperties = filterProperties(target, onProperties, ignoreProperties); patchOnProperties(target, filteredProperties, prototype); } /** * Get all event name properties which the event name startsWith `on` * from the target object itself, inherited properties are not considered. */ function getOnEventNames(target) { return Object.getOwnPropertyNames(target) .filter((name) => name.startsWith('on') && name.length > 2) .map((name) => name.substring(2)); } function propertyDescriptorPatch(api, _global) { if (isNode && !isMix) { return; } if (Zone[api.symbol('patchEvents')]) { // events are already been patched by legacy patch. return; } const ignoreProperties = _global['__Zone_ignore_on_properties']; // for browsers that we can patch the descriptor: Chrome & Firefox let patchTargets = []; if (isBrowser) { const internalWindow = window; patchTargets = patchTargets.concat([ 'Document', 'SVGElement', 'Element', 'HTMLElement', 'HTMLBodyElement', 'HTMLMediaElement', 'HTMLFrameSetElement', 'HTMLFrameElement', 'HTMLIFrameElement', 'HTMLMarqueeElement', 'Worker', ]); const ignoreErrorProperties = []; // In older browsers like IE or Edge, event handler properties (e.g., `onclick`) // may not be defined directly on the `window` object but on its prototype (`WindowPrototype`). // To ensure complete coverage, we use the prototype when checking // for and patching these properties. patchFilteredProperties(internalWindow, getOnEventNames(internalWindow), ignoreProperties ? ignoreProperties.concat(ignoreErrorProperties) : ignoreProperties, ObjectGetPrototypeOf(internalWindow)); } patchTargets = patchTargets.concat([ 'XMLHttpRequest', 'XMLHttpRequestEventTarget', 'IDBIndex', 'IDBRequest', 'IDBOpenDBRequest', 'IDBDatabase', 'IDBTransaction', 'IDBCursor', 'WebSocket', ]); for (let i = 0; i < patchTargets.length; i++) { const target = _global[patchTargets[i]]; target?.prototype && patchFilteredProperties(target.prototype, getOnEventNames(target.prototype), ignoreProperties); } } /** * @fileoverview * @suppress {missingRequire} */ function patchBrowser(Zone) { Zone.__load_patch('legacy', (global) => { const legacyPatch = global[Zone.__symbol__('legacyPatch')]; if (legacyPatch) { legacyPatch(); } }); Zone.__load_patch('timers', (global) => { const set = 'set'; const clear = 'clear'; patchTimer(global, set, clear, 'Timeout'); patchTimer(global, set, clear, 'Interval'); patchTimer(global, set, clear, 'Immediate'); }); Zone.__load_patch('requestAnimationFrame', (global) => { patchTimer(global, 'request', 'cancel', 'AnimationFrame'); patchTimer(global, 'mozRequest', 'mozCancel', 'AnimationFrame'); patchTimer(global, 'webkitRequest', 'webkitCancel', 'AnimationFrame'); }); Zone.__load_patch('blocking', (global, Zone) => { const blockingMethods = ['alert', 'prompt', 'confirm']; for (let i = 0; i < blockingMethods.length; i++) { const name = blockingMethods[i]; patchMethod(global, name, (delegate, symbol, name) => { return function (s, args) { return Zone.current.run(delegate, global, args, name); }; }); } }); Zone.__load_patch('EventTarget', (global, Zone, api) => { patchEvent(global, api); eventTargetPatch(global, api); // patch XMLHttpRequestEventTarget's addEventListener/removeEventListener const XMLHttpRequestEventTarget = global['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget && XMLHttpRequestEventTarget.prototype) { api.patchEventTarget(global, api, [XMLHttpRequestEventTarget.prototype]); } }); Zone.__load_patch('MutationObserver', (global, Zone, api) => { patchClass('MutationObserver'); patchClass('WebKitMutationObserver'); }); Zone.__load_patch('IntersectionObserver', (global, Zone, api) => { patchClass('IntersectionObserver'); }); Zone.__load_patch('FileReader', (global, Zone, api) => { patchClass('FileReader'); }); Zone.__load_patch('on_property', (global, Zone, api) => { propertyDescriptorPatch(api, global); }); Zone.__load_patch('customElements', (global, Zone, api) => { patchCustomElements(global, api); }); Zone.__load_patch('XHR', (global, Zone) => { // Treat XMLHttpRequest as a macrotask. patchXHR(global); const XHR_TASK = zoneSymbol('xhrTask'); const XHR_SYNC = zoneSymbol('xhrSync'); const XHR_LISTENER = zoneSymbol('xhrListener'); const XHR_SCHEDULED = zoneSymbol('xhrScheduled'); const XHR_URL = zoneSymbol('xhrURL'); const XHR_ERROR_BEFORE_SCHEDULED = zoneSymbol('xhrErrorBeforeScheduled'); function patchXHR(window) { const XMLHttpRequest = window['XMLHttpRequest']; if (!XMLHttpRequest) { // XMLHttpRequest is not available in service worker return; } const XMLHttpRequestPrototype = XMLHttpRequest.prototype; function findPendingTask(target) { return target[XHR_TASK]; } let oriAddListener = XMLHttpRequestPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; let oriRemoveListener = XMLHttpRequestPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; if (!oriAddListener) { const XMLHttpRequestEventTarget = window['XMLHttpRequestEventTarget']; if (XMLHttpRequestEventTarget) { const XMLHttpRequestEventTargetPrototype = XMLHttpRequestEventTarget.prototype; oriAddListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = XMLHttpRequestEventTargetPrototype[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } } const READY_STATE_CHANGE = 'readystatechange'; const SCHEDULED = 'scheduled'; function scheduleTask(task) { const data = task.data; const target = data.target; target[XHR_SCHEDULED] = false; target[XHR_ERROR_BEFORE_SCHEDULED] = false; // remove existing event listener const listener = target[XHR_LISTENER]; if (!oriAddListener) { oriAddListener = target[ZONE_SYMBOL_ADD_EVENT_LISTENER]; oriRemoveListener = target[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]; } if (listener) { oriRemoveListener.call(target, READY_STATE_CHANGE, listener); } const newListener = (target[XHR_LISTENER] = () => { if (target.readyState === target.DONE) { // sometimes on some browsers XMLHttpRequest will fire onreadystatechange with // readyState=4 multiple times, so we need to check task state here if (!data.aborted && target[XHR_SCHEDULED] && task.state === SCHEDULED) { // check whether the xhr has registered onload listener // if that is the case, the task should invoke after all // onload listeners finish. // Also if the request failed without response (status = 0), the load event handler // will not be triggered, in that case, we should also invoke the placeholder callback // to close the XMLHttpRequest::send macroTask. // https://github.com/angular/angular/issues/38795 const loadTasks = target[Zone.__symbol__('loadfalse')]; if (target.status !== 0 && loadTasks && loadTasks.length > 0) { const oriInvoke = task.invoke; task.invoke = function () { // need to load the tasks again, because in other // load listener, they may remove themselves const loadTasks = target[Zone.__symbol__('loadfalse')]; for (let i = 0; i < loadTasks.length; i++) { if (loadTasks[i] === task) { loadTasks.splice(i, 1); } } if (!data.aborted && task.state === SCHEDULED) { oriInvoke.call(task); } }; loadTasks.push(task); } else { task.invoke(); } } else if (!data.aborted && target[XHR_SCHEDULED] === false) { // error occurs when xhr.send() target[XHR_ERROR_BEFORE_SCHEDULED] = true; } } }); oriAddListener.call(target, READY_STATE_CHANGE, newListener); const storedTask = target[XHR_TASK]; if (!storedTask) { target[XHR_TASK] = task; } sendNative.apply(target, data.args); target[XHR_SCHEDULED] = true; return task; } function placeholderCallback() { } function clearTask(task) { const data = task.data; // Note - ideally, we would call data.target.removeEventListener here, but it's too late // to prevent it from firing. So instead, we store info for the event listener. data.aborted = true; return abortNative.apply(data.target, data.args); } const openNative = patchMethod(XMLHttpRequestPrototype, 'open', () => function (self, args) { self[XHR_SYNC] = args[2] == false; self[XHR_URL] = args[1]; return openNative.apply(self, args); }); const XMLHTTPREQUEST_SOURCE = 'XMLHttpRequest.send'; const fetchTaskAborting = zoneSymbol('fetchTaskAborting'); const fetchTaskScheduling = zoneSymbol('fetchTaskScheduling'); const sendNative = patchMethod(XMLHttpRequestPrototype, 'send', () => function (self, args) { if (Zone.current[fetchTaskScheduling] === true) { // a fetch is scheduling, so we are using xhr to polyfill fetch // and because we already schedule macroTask for fetch, we should // not schedule a macroTask for xhr again return sendNative.apply(self, args); } if (self[XHR_SYNC]) { // if the XHR is sync there is no task to schedule, just execute the code. return sendNative.apply(self, args); } else { const options = { target: self, url: self[XHR_URL], isPeriodic: false, args: args, aborted: false, }; const task = scheduleMacroTaskWithCurrentZone(XMLHTTPREQUEST_SOURCE, placeholderCallback, options, scheduleTask, clearTask); if (self && self[XHR_ERROR_BEFORE_SCHEDULED] === true && !options.aborted && task.state === SCHEDULED) { // xhr request throw error when send // we should invoke task instead of leaving a scheduled // pending macroTask task.invoke(); } } }); const abortNative = patchMethod(XMLHttpRequestPrototype, 'abort', () => function (self, args) { const task = findPendingTask(self); if (task && typeof task.type == 'string') { // If the XHR has already completed, do nothing. // If the XHR has already been aborted, do nothing. // Fix #569, call abort multiple times before done will cause // macroTask task count be negative number if (task.cancelFn == null || (task.data && task.data.aborted)) { return; } task.zone.cancelTask(task); } else if (Zone.current[fetchTaskAborting] === true) { // the abort is called from fetch polyfill, we need to call native abort of XHR. return abortNative.apply(self, args); } // Otherwise, we are trying to abort an XHR which has not yet been sent, so there is no // task // to cancel. Do nothing. }); } }); Zone.__load_patch('geolocation', (global) => { /// GEO_LOCATION if (global['navigator'] && global['navigator'].geolocation) { patchPrototype(global['navigator'].geolocation, ['getCurrentPosition', 'watchPosition']); } }); Zone.__load_patch('PromiseRejectionEvent', (global, Zone) => { // handle unhandled promise rejection function findPromiseRejectionHandler(evtName) { return function (e) { const eventTasks = findEventTasks(global, evtName); eventTasks.forEach((eventTask) => { // windows has added unhandledrejection event listener // trigger the event listener const PromiseRejectionEvent = global['PromiseRejectionEvent']; if (PromiseRejectionEvent) { const evt = new PromiseRejectionEvent(evtName, { promise: e.promise, reason: e.rejection, }); eventTask.invoke(evt); } }); }; } if (global['PromiseRejectionEvent']) { Zone[zoneSymbol('unhandledPromiseRejectionHandler')] = findPromiseRejectionHandler('unhandledrejection'); Zone[zoneSymbol('rejectionHandledHandler')] = findPromiseRejectionHandler('rejectionhandled'); } }); Zone.__load_patch('queueMicrotask', (global, Zone, api) => { patchQueueMicrotask(global, api); }); } function patchPromise(Zone) { Zone.__load_patch('ZoneAwarePromise', (global, Zone, api) => { const ObjectGetOwnPropertyDescriptor = Object.getOwnPropertyDescriptor; const ObjectDefineProperty = Object.defineProperty; function readableObjectToString(obj) { if (obj && obj.toString === Object.prototype.toString) { const className = obj.constructor && obj.constructor.name; return (className ? className : '') + ': ' + JSON.stringify(obj); } return obj ? obj.toString() : Object.prototype.toString.call(obj); } const __symbol__ = api.symbol; const _uncaughtPromiseErrors = []; const isDisableWrappingUncaughtPromiseRejection = global[__symbol__('DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION')] !== false; const symbolPromise = __symbol__('Promise'); const symbolThen = __symbol__('then'); const creationTrace = '__creationTrace__'; api.onUnhandledError = (e) => { if (api.showUncaughtError()) { const rejection = e && e.rejection; if (rejection) { console.error('Unhandled Promise rejection:', rejection instanceof Error ? rejection.message : rejection, '; Zone:', e.zone.name, '; Task:', e.task && e.task.source, '; Value:', rejection, rejection instanceof Error ? rejection.stack : undefined); } else { console.error(e); } } }; api.microtaskDrainDone = () => { while (_uncaughtPromiseErrors.length) { const uncaughtPromiseError = _uncaughtPromiseErrors.shift(); try { uncaughtPromiseError.zone.runGuarded(() => { if (uncaughtPromiseError.throwOriginal) { throw uncaughtPromiseError.rejection; } throw uncaughtPromiseError; }); } catch (error) { handleUnhandledRejection(error); } } }; const UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL = __symbol__('unhandledPromiseRejectionHandler'); function handleUnhandledRejection(e) { api.onUnhandledError(e); try { const handler = Zone[UNHANDLED_PROMISE_REJECTION_HANDLER_SYMBOL]; if (typeof handler === 'function') { handler.call(this, e); } } catch (err) { } } function isThenable(value) { return value && typeof value.then === 'function'; } function forwardResolution(value) { return value; } function forwardRejection(rejection) { return ZoneAwarePromise.reject(rejection); } const symbolState = __symbol__('state'); const symbolValue = __symbol__('value'); const symbolFinally = __symbol__('finally'); const symbolParentPromiseValue = __symbol__('parentPromiseValue'); const symbolParentPromiseState = __symbol__('parentPromiseState'); const source = 'Promise.then'; const UNRESOLVED = null; const RESOLVED = true; const REJECTED = false; const REJECTED_NO_CATCH = 0; function makeResolver(promise, state) { return (v) => { try { resolvePromise(promise, state, v); } catch (err) { resolvePromise(promise, false, err); } // Do not return value or you will break the Promise spec. }; } const once = function () { let wasCalled = false; return function wrapper(wrappedFunction) { return function () { if (wasCalled) { return; } wasCalled = true; wrappedFunction.apply(null, arguments); }; }; }; const TYPE_ERROR = 'Promise resolved with itself'; const CURRENT_TASK_TRACE_SYMBOL = __symbol__('currentTaskTrace'); // Promise Resolution function resolvePromise(promise, state, value) { const onceWrapper = once(); if (promise === value) { throw new TypeError(TYPE_ERROR); } if (promise[symbolState] === UNRESOLVED) { // should only get value.then once based on promise spec. let then = null; try { if (typeof value === 'object' || typeof value === 'function') { then = value && value.then; } } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); return promise; } // if (value instanceof ZoneAwarePromise) { if (state !== REJECTED && value instanceof ZoneAwarePromise && value.hasOwnProperty(symbolState) && value.hasOwnProperty(symbolValue) && value[symbolState] !== UNRESOLVED) { clearRejectedNoCatch(value); resolvePromise(promise, value[symbolState], value[symbolValue]); } else if (state !== REJECTED && typeof then === 'function') { try { then.call(value, onceWrapper(makeResolver(promise, state)), onceWrapper(makeResolver(promise, false))); } catch (err) { onceWrapper(() => { resolvePromise(promise, false, err); })(); } } else { promise[symbolState] = state; const queue = promise[symbolValue]; promise[symbolValue] = value; if (promise[symbolFinally] === symbolFinally) { // the promise is generated by Promise.prototype.finally if (state === RESOLVED) { // the state is resolved, should ignore the value // and use parent promise value promise[symbolState] = promise[symbolParentPromiseState]; promise[symbolValue] = promise[symbolParentPromiseValue]; } } // record task information in value when error occurs, so we can // do some additional work such as render longStackTrace if (state === REJECTED && value instanceof Error) { // check if longStackTraceZone is here const trace = Zone.currentTask && Zone.currentTask.data && Zone.currentTask.data[creationTrace]; if (trace) { // only keep the long stack trace into error when in longStackTraceZone ObjectDefineProperty(value, CURRENT_TASK_TRACE_SYMBOL, { configurable: true, enumerable: false, writable: true, value: trace, }); } } for (let i = 0; i < queue.length;) { scheduleResolveOrReject(promise, queue[i++], queue[i++], queue[i++], queue[i++]); } if (queue.length == 0 && state == REJECTED) { promise[symbolState] = REJECTED_NO_CATCH; let uncaughtPromiseError = value; try { // Here we throws a new Error to print more readable error log // and if the value is not an error, zone.js builds an `Error` // Object here to attach the stack information. throw new Error('Uncaught (in promise): ' + readableObjectToString(value) + (value && value.stack ? '\n' + value.stack : '')); } catch (err) { uncaughtPromiseError = err; } if (isDisableWrappingUncaughtPromiseRejection) { // If disable wrapping uncaught promise reject // use the value instead of wrapping it. uncaughtPromiseError.throwOriginal = true; } uncaughtPromiseError.rejection = value; uncaughtPromiseError.promise = promise; uncaughtPromiseError.zone = Zone.current; uncaughtPromiseError.task = Zone.currentTask; _uncaughtPromiseErrors.push(uncaughtPromiseError); api.scheduleMicroTask(); // to make sure that it is running } } } // Resolving an already resolved promise is a noop. return promise; } const REJECTION_HANDLED_HANDLER = __symbol__('rejectionHandledHandler'); function clearRejectedNoCatch(promise) { if (promise[symbolState] === REJECTED_NO_CATCH) { // if the promise is rejected no catch status // and queue.length > 0, means there is a error handler // here to handle the rejected promise, we should trigger // windows.rejectionhandled eventHandler or nodejs rejectionHandled // eventHandler try { const handler = Zone[REJECTION_HANDLED_HANDLER]; if (handler && typeof handler === 'function') { handler.call(this, { rejection: promise[symbolValue], promise: promise }); } } catch (err) { } promise[symbolState] = REJECTED; for (let i = 0; i < _uncaughtPromiseErrors.length; i++) { if (promise === _uncaughtPromiseErrors[i].promise) { _uncaughtPromiseErrors.splice(i, 1); } } } } function scheduleResolveOrReject(promise, zone, chainPromise, onFulfilled, onRejected) { clearRejectedNoCatch(promise); const promiseState = promise[symbolState]; const delegate = promiseState ? typeof onFulfilled === 'function' ? onFulfilled : forwardResolution : typeof onRejected === 'function' ? onRejected : forwardRejection; zone.scheduleMicroTask(source, () => { try { const parentPromiseValue = promise[symbolValue]; const isFinallyPromise = !!chainPromise && symbolFinally === chainPromise[symbolFinally]; if (isFinallyPromise) { // if the promise is generated from finally call, keep parent promise's state and value chainPromise[symbolParentPromiseValue] = parentPromiseValue; chainPromise[symbolParentPromiseState] = promiseState; } // should not pass value to finally callback const value = zone.run(delegate, undefined, isFinallyPromise && delegate !== forwardRejection && delegate !== forwardResolution ? [] : [parentPromiseValue]); resolvePromise(chainPromise, true, value); } catch (error) { // if error occurs, should always return this error resolvePromise(chainPromise, false, error); } }, chainPromise); } const ZONE_AWARE_PROMISE_TO_STRING = 'function ZoneAwarePromise() { [native code] }'; const noop = function () { }; const AggregateError = global.AggregateError; class ZoneAwarePromise { static toString() { return ZONE_AWARE_PROMISE_TO_STRING; } static resolve(value) { if (value instanceof ZoneAwarePromise) { return value; } return resolvePromise(new this(null), RESOLVED, value); } static reject(error) { return resolvePromise(new this(null), REJECTED, error); } static withResolvers() { const result = {}; result.promise = new ZoneAwarePromise((res, rej) => { result.resolve = res; result.reject = rej; }); return result; } static any(values) { if (!values || typeof values[Symbol.iterator] !== 'function') { return Promise.reject(new AggregateError([], 'All promises were rejected')); } const promises = []; let count = 0; try { for (let v of values) { count++; promises.push(ZoneAwarePromise.resolve(v)); } } catch (err) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } if (count === 0) { return Promise.reject(new AggregateError([], 'All promises were rejected')); } let finished = false; const errors = []; return new ZoneAwarePromise((resolve, reject) => { for (let i = 0; i < promises.length; i++) { promises[i].then((v) => { if (finished) { return; } finished = true; resolve(v); }, (err) => { errors.push(err); count--; if (count === 0) { finished = true; reject(new AggregateError(errors, 'All promises were rejected')); } }); } }); } static race(values) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); function onResolve(value) { resolve(value); } function onReject(error) { reject(error); } for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } value.then(onResolve, onReject); } return promise; } static all(values) { return ZoneAwarePromise.allWithCallback(values); } static allSettled(values) { const P = this && this.prototype instanceof ZoneAwarePromise ? this : ZoneAwarePromise; return P.allWithCallback(values, { thenCallback: (value) => ({ status: 'fulfilled', value }), errorCallback: (err) => ({ status: 'rejected', reason: err }), }); } static allWithCallback(values, callback) { let resolve; let reject; let promise = new this((res, rej) => { resolve = res; reject = rej; }); // Start at 2 to prevent prematurely resolving if .then is called immediately. let unresolvedCount = 2; let valueIndex = 0; const resolvedValues = []; for (let value of values) { if (!isThenable(value)) { value = this.resolve(value); } const curValueIndex = valueIndex; try { value.then((value) => { resolvedValues[curValueIndex] = callback ? callback.thenCallback(value) : value; unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } }, (err) => { if (!callback) { reject(err); } else { resolvedValues[curValueIndex] = callback.errorCallback(err); unresolvedCount--; if (unresolvedCount === 0) { resolve(resolvedValues); } } }); } catch (thenErr) { reject(thenErr); } unresolvedCount++; valueIndex++; } // Make the unresolvedCount zero-based again. unresolvedCount -= 2; if (unresolvedCount === 0) { resolve(resolvedValues); } return promise; } constructor(executor) { const promise = this; if (!(promise instanceof ZoneAwarePromise)) { throw new Error('Must be an instanceof Promise.'); } promise[symbolState] = UNRESOLVED; promise[symbolValue] = []; // queue; try { const onceWrapper = once(); executor && executor(onceWrapper(makeResolver(promise, RESOLVED)), onceWrapper(makeResolver(promise, REJECTED))); } catch (error) { resolvePromise(promise, false, error); } } get [Symbol.toStringTag]() { return 'Promise'; } get [Symbol.species]() { return ZoneAwarePromise; } then(onFulfilled, onRejected) { // We must read `Symbol.species` safely because `this` may be anything. For instance, `this` // may be an object without a prototype (created through `Object.create(null)`); thus // `this.constructor` will be undefined. One of the use cases is SystemJS creating // prototype-less objects (modules) via `Object.create(null)`. The SystemJS creates an empty // object and copies promise properties into that object (within the `getOrCreateLoad` // function). The zone.js then checks if the resolved value has the `then` method and // invokes it with the `value` context. Otherwise, this will throw an error: `TypeError: // Cannot read properties of undefined (reading 'Symbol(Symbol.species)')`. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = this.constructor || ZoneAwarePromise; } const chainPromise = new C(noop); const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFulfilled, onRejected); } else { scheduleResolveOrReject(this, zone, chainPromise, onFulfilled, onRejected); } return chainPromise; } catch(onRejected) { return this.then(null, onRejected); } finally(onFinally) { // See comment on the call to `then` about why thee `Symbol.species` is safely accessed. let C = this.constructor?.[Symbol.species]; if (!C || typeof C !== 'function') { C = ZoneAwarePromise; } const chainPromise = new C(noop); chainPromise[symbolFinally] = symbolFinally; const zone = Zone.current; if (this[symbolState] == UNRESOLVED) { this[symbolValue].push(zone, chainPromise, onFinally, onFinally); } else { scheduleResolveOrReject(this, zone, chainPromise, onFinally, onFinally); } return chainPromise; } } // Protect against aggressive optimizers dropping seemingly unused properties. // E.g. Closure Compiler in advanced mode. ZoneAwarePromise['resolve'] = ZoneAwarePromise.resolve; ZoneAwarePromise['reject'] = ZoneAwarePromise.reject; ZoneAwarePromise['race'] = ZoneAwarePromise.race; ZoneAwarePromise['all'] = ZoneAwarePromise.all; const NativePromise = (global[symbolPromise] = global['Promise']); global['Promise'] = ZoneAwarePromise; const symbolThenPatched = __symbol__('thenPatched'); function patchThen(Ctor) { const proto = Ctor.prototype; const prop = ObjectGetOwnPropertyDescriptor(proto, 'then'); if (prop && (prop.writable === false || !prop.configurable)) { // check Ctor.prototype.then propertyDescriptor is writable or not // in meteor env, writable is false, we should ignore such case return; } const originalThen = proto.then; // Keep a reference to the original method. proto[symbolThen] = originalThen; Ctor.prototype.then = function (onResolve, onReject) { const wrapped = new ZoneAwarePromise((resolve, reject) => { originalThen.call(this, resolve, reject); }); return wrapped.then(onResolve, onReject); }; Ctor[symbolThenPatched] = true; } api.patchThen = patchThen; function zoneify(fn) { return function (self, args) { let resultPromise = fn.apply(self, args); if (resultPromise instanceof ZoneAwarePromise) { return resultPromise; } let ctor = resultPromise.constructor; if (!ctor[symbolThenPatched]) { patchThen(ctor); } return resultPromise; }; } if (NativePromise) { patchThen(NativePromise); patchMethod(global, 'fetch', (delegate) => zoneify(delegate)); } // This is not part of public API, but it is useful for tests, so we expose it. Promise[Zone.__symbol__('uncaughtPromiseErrors')] = _uncaughtPromiseErrors; return ZoneAwarePromise; }); } function patchToString(Zone) { // override Function.prototype.toString to make zone.js patched function // look like native function Zone.__load_patch('toString', (global) => { // patch Func.prototype.toString to let them look like native const originalFunctionToString = Function.prototype.toString; const ORIGINAL_DELEGATE_SYMBOL = zoneSymbol('OriginalDelegate'); const PROMISE_SYMBOL = zoneSymbol('Promise'); const ERROR_SYMBOL = zoneSymbol('Error'); const newFunctionToString = function toString() { if (typeof this === 'function') { const originalDelegate = this[ORIGINAL_DELEGATE_SYMBOL]; if (originalDelegate) { if (typeof originalDelegate === 'function') { return originalFunctionToString.call(originalDelegate); } else { return Object.prototype.toString.call(originalDelegate); } } if (this === Promise) { const nativePromise = global[PROMISE_SYMBOL]; if (nativePromise) { return originalFunctionToString.call(nativePromise); } } if (this === Error) { const nativeError = global[ERROR_SYMBOL]; if (nativeError) { return originalFunctionToString.call(nativeError); } } } return originalFunctionToString.call(this); }; newFunctionToString[ORIGINAL_DELEGATE_SYMBOL] = originalFunctionToString; Function.prototype.toString = newFunctionToString; // patch Object.prototype.toString to let them look like native const originalObjectToString = Object.prototype.toString; const PROMISE_OBJECT_TO_STRING = '[object Promise]'; Object.prototype.toString = function () { if (typeof Promise === 'function' && this instanceof Promise) { return PROMISE_OBJECT_TO_STRING; } return originalObjectToString.call(this); }; }); } function patchCallbacks(api, target, targetName, method, callbacks) { const symbol = Zone.__symbol__(method); if (target[symbol]) { return; } const nativeDelegate = (target[symbol] = target[method]); target[method] = function (name, opts, options) { if (opts && opts.prototype) { callbacks.forEach(function (callback) { const source = `${targetName}.${method}::` + callback; const prototype = opts.prototype; // Note: the `patchCallbacks` is used for patching the `document.registerElement` and // `customElements.define`. We explicitly wrap the patching code into try-catch since // callbacks may be already patched by other web components frameworks (e.g. LWC), and they // make those properties non-writable. This means that patching callback will throw an erFror // `cannot assign to read-only property`. See this code as an example: // https://github.com/salesforce/lwc/blob/master/packages/@lwc/engine-core/src/framework/base-bridge-element.ts#L180-L186 // We don't want to stop the application rendering if we couldn't patch some // callback, e.g. `attributeChangedCallback`. try { if (prototype.hasOwnProperty(callback)) { const descriptor = api.ObjectGetOwnPropertyDescriptor(prototype, callback); if (descriptor && descriptor.value) { descriptor.value = api.wrapWithCurrentZone(descriptor.value, source); api._redefineProperty(opts.prototype, callback, descriptor); } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } else if (prototype[callback]) { prototype[callback] = api.wrapWithCurrentZone(prototype[callback], source); } } catch { // Note: we leave the catch block empty since there's no way to handle the error related // to non-writable property. } }); } return nativeDelegate.call(target, name, opts, options); }; api.attachOriginToPatched(target[method], nativeDelegate); } function patchUtil(Zone) { Zone.__load_patch('util', (global, Zone, api) => { // Collect native event names by looking at properties // on the global namespace, e.g. 'onclick'. const eventNames = getOnEventNames(global); api.patchOnProperties = patchOnProperties; api.patchMethod = patchMethod; api.bindArguments = bindArguments; api.patchMacroTask = patchMacroTask; // In earlier version of zone.js (<0.9.0), we use env name `__zone_symbol__BLACK_LISTED_EVENTS` // to define which events will not be patched by `Zone.js`. In newer version (>=0.9.0), we // change the env name to `__zone_symbol__UNPATCHED_EVENTS` to keep the name consistent with // angular repo. The `__zone_symbol__BLACK_LISTED_EVENTS` is deprecated, but it is still be // supported for backwards compatibility. const SYMBOL_BLACK_LISTED_EVENTS = Zone.__symbol__('BLACK_LISTED_EVENTS'); const SYMBOL_UNPATCHED_EVENTS = Zone.__symbol__('UNPATCHED_EVENTS'); if (global[SYMBOL_UNPATCHED_EVENTS]) { global[SYMBOL_BLACK_LISTED_EVENTS] = global[SYMBOL_UNPATCHED_EVENTS]; } if (global[SYMBOL_BLACK_LISTED_EVENTS]) { Zone[SYMBOL_BLACK_LISTED_EVENTS] = Zone[SYMBOL_UNPATCHED_EVENTS] = global[SYMBOL_BLACK_LISTED_EVENTS]; } api.patchEventPrototype = patchEventPrototype; api.patchEventTarget = patchEventTarget; api.isIEOrEdge = isIEOrEdge; api.ObjectDefineProperty = ObjectDefineProperty; api.ObjectGetOwnPropertyDescriptor = ObjectGetOwnPropertyDescriptor; api.ObjectCreate = ObjectCreate; api.ArraySlice = ArraySlice; api.patchClass = patchClass; api.wrapWithCurrentZone = wrapWithCurrentZone; api.filterProperties = filterProperties; api.attachOriginToPatched = attachOriginToPatched; api._redefineProperty = Object.defineProperty; api.patchCallbacks = patchCallbacks; api.getGlobalObjects = () => ({ globalSources, zoneSymbolEventNames, eventNames, isBrowser, isMix, isNode, TRUE_STR, FALSE_STR, ZONE_SYMBOL_PREFIX, ADD_EVENT_LISTENER_STR, REMOVE_EVENT_LISTENER_STR, }); }); } function patchCommon(Zone) { patchPromise(Zone); patchToString(Zone); patchUtil(Zone); } const Zone$1 = loadZone(); patchCommon(Zone$1); patchBrowser(Zone$1); O9xBg"use strict"; /** * @license Angular v * (c) 2010-2025 Google LLC. https://angular.io/ * License: MIT */const global=globalThis;function __symbol__(e){return(global.__Zone_symbol_prefix||"__zone_symbol__")+e}function initZone(){const e=global.performance;function t(t){e&&e.mark&&e.mark(t)}function n(t,n){e&&e.measure&&e.measure(t,n)}t("Zone");class o{static __symbol__=__symbol__;static assertZonePatched(){if(global.Promise!==w.ZoneAwarePromise)throw new Error("Zone.js has detected that ZoneAwarePromise `(window|global).Promise` has been overwritten.\nMost likely cause is that a Promise polyfill has been loaded after Zone.js (Polyfilling Promise api is not necessary when zone.js is loaded. If you must load one, do so before loading zone.js.)")}static get root(){let e=o.current;for(;e.parent;)e=e.parent;return e}static get current(){return Z.zone}static get currentTask(){return D}static __load_patch(e,r,s=!1){if(w.hasOwnProperty(e)){const t=!0===global[__symbol__("forceDuplicateZoneCheck")];if(!s&&t)throw Error("Already loaded patch: "+e)}else if(!global["__Zone_disable_"+e]){const s="Zone:"+e;t(s),w[e]=r(global,o,P),n(s,s)}}get parent(){return this._parent}get name(){return this._name}_parent;_name;_properties;_zoneDelegate;constructor(e,t){this._parent=e,this._name=t?t.name||"unnamed":"",this._properties=t&&t.properties||{},this._zoneDelegate=new s(this,this._parent&&this._parent._zoneDelegate,t)}get(e){const t=this.getZoneWith(e);if(t)return t._properties[e]}getZoneWith(e){let t=this;for(;t;){if(t._properties.hasOwnProperty(e))return t;t=t._parent}return null}fork(e){if(!e)throw new Error("ZoneSpec required!");return this._zoneDelegate.fork(this,e)}wrap(e,t){if("function"!=typeof e)throw new Error("Expecting function got: "+e);const n=this._zoneDelegate.intercept(this,e,t),o=this;return function(){return o.runGuarded(n,this,arguments,t)}}run(e,t,n,o){Z={parent:Z,zone:this};try{return this._zoneDelegate.invoke(this,e,t,n,o)}finally{Z=Z.parent}}runGuarded(e,t=null,n,o){Z={parent:Z,zone:this};try{try{return this._zoneDelegate.invoke(this,e,t,n,o)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{Z=Z.parent}}runTask(e,t,n){if(e.zone!=this)throw new Error("A task can only be run in the zone of creation! (Creation: "+(e.zone||g).name+"; Execution: "+this.name+")");const o=e,{type:r,data:{isPeriodic:s=!1,isRefreshable:a=!1}={}}=e;if(e.state===k&&(r===O||r===S))return;const i=e.state!=m;i&&o._transitionTo(m,E);const c=D;D=o,Z={parent:Z,zone:this};try{r!=S||!e.data||s||a||(e.cancelFn=void 0);try{return this._zoneDelegate.invokeTask(this,o,t,n)}catch(e){if(this._zoneDelegate.handleError(this,e))throw e}}finally{const t=e.state;if(t!==k&&t!==b)if(r==O||s||a&&t===y)i&&o._transitionTo(E,m,y);else{const e=o._zoneDelegates;this._updateTaskCount(o,-1),i&&o._transitionTo(k,m,k),a&&(o._zoneDelegates=e)}Z=Z.parent,D=c}}scheduleTask(e){if(e.zone&&e.zone!==this){let t=this;for(;t;){if(t===e.zone)throw Error(`can not reschedule task to ${this.name} which is descendants of the original zone ${e.zone.name}`);t=t.parent}}e._transitionTo(y,k);const t=[];e._zoneDelegates=t,e._zone=this;try{e=this._zoneDelegate.scheduleTask(this,e)}catch(t){throw e._transitionTo(b,y,k),this._zoneDelegate.handleError(this,t),t}return e._zoneDelegates===t&&this._updateTaskCount(e,1),e.state==y&&e._transitionTo(E,y),e}scheduleMicroTask(e,t,n,o){return this.scheduleTask(new a(v,e,t,n,o,void 0))}scheduleMacroTask(e,t,n,o,r){return this.scheduleTask(new a(S,e,t,n,o,r))}scheduleEventTask(e,t,n,o,r){return this.scheduleTask(new a(O,e,t,n,o,r))}cancelTask(e){if(e.zone!=this)throw new Error("A task can only be cancelled in the zone of creation! (Creation: "+(e.zone||g).name+"; Execution: "+this.name+")");if(e.state===E||e.state===m){e._transitionTo(T,E,m);try{this._zoneDelegate.cancelTask(this,e)}catch(t){throw e._transitionTo(b,T),this._zoneDelegate.handleError(this,t),t}return this._updateTaskCount(e,-1),e._transitionTo(k,T),e.runCount=-1,e}}_updateTaskCount(e,t){const n=e._zoneDelegates;-1==t&&(e._zoneDelegates=null);for(let o=0;oe.hasTask(n,o),onScheduleTask:(e,t,n,o)=>e.scheduleTask(n,o),onInvokeTask:(e,t,n,o,r,s)=>e.invokeTask(n,o,r,s),onCancelTask:(e,t,n,o)=>e.cancelTask(n,o)};class s{get zone(){return this._zone}_zone;_taskCounts={microTask:0,macroTask:0,eventTask:0};_parentDelegate;_forkDlgt;_forkZS;_forkCurrZone;_interceptDlgt;_interceptZS;_interceptCurrZone;_invokeDlgt;_invokeZS;_invokeCurrZone;_handleErrorDlgt;_handleErrorZS;_handleErrorCurrZone;_scheduleTaskDlgt;_scheduleTaskZS;_scheduleTaskCurrZone;_invokeTaskDlgt;_invokeTaskZS;_invokeTaskCurrZone;_cancelTaskDlgt;_cancelTaskZS;_cancelTaskCurrZone;_hasTaskDlgt;_hasTaskDlgtOwner;_hasTaskZS;_hasTaskCurrZone;constructor(e,t,n){this._zone=e,this._parentDelegate=t,this._forkZS=n&&(n&&n.onFork?n:t._forkZS),this._forkDlgt=n&&(n.onFork?t:t._forkDlgt),this._forkCurrZone=n&&(n.onFork?this._zone:t._forkCurrZone),this._interceptZS=n&&(n.onIntercept?n:t._interceptZS),this._interceptDlgt=n&&(n.onIntercept?t:t._interceptDlgt),this._interceptCurrZone=n&&(n.onIntercept?this._zone:t._interceptCurrZone),this._invokeZS=n&&(n.onInvoke?n:t._invokeZS),this._invokeDlgt=n&&(n.onInvoke?t:t._invokeDlgt),this._invokeCurrZone=n&&(n.onInvoke?this._zone:t._invokeCurrZone),this._handleErrorZS=n&&(n.onHandleError?n:t._handleErrorZS),this._handleErrorDlgt=n&&(n.onHandleError?t:t._handleErrorDlgt),this._handleErrorCurrZone=n&&(n.onHandleError?this._zone:t._handleErrorCurrZone),this._scheduleTaskZS=n&&(n.onScheduleTask?n:t._scheduleTaskZS),this._scheduleTaskDlgt=n&&(n.onScheduleTask?t:t._scheduleTaskDlgt),this._scheduleTaskCurrZone=n&&(n.onScheduleTask?this._zone:t._scheduleTaskCurrZone),this._invokeTaskZS=n&&(n.onInvokeTask?n:t._invokeTaskZS),this._invokeTaskDlgt=n&&(n.onInvokeTask?t:t._invokeTaskDlgt),this._invokeTaskCurrZone=n&&(n.onInvokeTask?this._zone:t._invokeTaskCurrZone),this._cancelTaskZS=n&&(n.onCancelTask?n:t._cancelTaskZS),this._cancelTaskDlgt=n&&(n.onCancelTask?t:t._cancelTaskDlgt),this._cancelTaskCurrZone=n&&(n.onCancelTask?this._zone:t._cancelTaskCurrZone),this._hasTaskZS=null,this._hasTaskDlgt=null,this._hasTaskDlgtOwner=null,this._hasTaskCurrZone=null;const o=n&&n.onHasTask;(o||t&&t._hasTaskZS)&&(this._hasTaskZS=o?n:r,this._hasTaskDlgt=t,this._hasTaskDlgtOwner=this,this._hasTaskCurrZone=this._zone,n.onScheduleTask||(this._scheduleTaskZS=r,this._scheduleTaskDlgt=t,this._scheduleTaskCurrZone=this._zone),n.onInvokeTask||(this._invokeTaskZS=r,this._invokeTaskDlgt=t,this._invokeTaskCurrZone=this._zone),n.onCancelTask||(this._cancelTaskZS=r,this._cancelTaskDlgt=t,this._cancelTaskCurrZone=this._zone))}fork(e,t){return this._forkZS?this._forkZS.onFork(this._forkDlgt,this.zone,e,t):new o(e,t)}intercept(e,t,n){return this._interceptZS?this._interceptZS.onIntercept(this._interceptDlgt,this._interceptCurrZone,e,t,n):t}invoke(e,t,n,o,r){return this._invokeZS?this._invokeZS.onInvoke(this._invokeDlgt,this._invokeCurrZone,e,t,n,o,r):t.apply(n,o)}handleError(e,t){return!this._handleErrorZS||this._handleErrorZS.onHandleError(this._handleErrorDlgt,this._handleErrorCurrZone,e,t)}scheduleTask(e,t){let n=t;if(this._scheduleTaskZS)this._hasTaskZS&&n._zoneDelegates.push(this._hasTaskDlgtOwner),n=this._scheduleTaskZS.onScheduleTask(this._scheduleTaskDlgt,this._scheduleTaskCurrZone,e,t),n||(n=t);else if(t.scheduleFn)t.scheduleFn(t);else{if(t.type!=v)throw new Error("Task is missing scheduleFn.");_(t)}return n}invokeTask(e,t,n,o){return this._invokeTaskZS?this._invokeTaskZS.onInvokeTask(this._invokeTaskDlgt,this._invokeTaskCurrZone,e,t,n,o):t.callback.apply(n,o)}cancelTask(e,t){let n;if(this._cancelTaskZS)n=this._cancelTaskZS.onCancelTask(this._cancelTaskDlgt,this._cancelTaskCurrZone,e,t);else{if(!t.cancelFn)throw Error("Task is not cancelable");n=t.cancelFn(t)}return n}hasTask(e,t){try{this._hasTaskZS&&this._hasTaskZS.onHasTask(this._hasTaskDlgt,this._hasTaskCurrZone,e,t)}catch(t){this.handleError(e,t)}}_updateTaskCount(e,t){const n=this._taskCounts,o=n[e],r=n[e]=o+t;if(r<0)throw new Error("More tasks executed then were scheduled.");0!=o&&0!=r||this.hasTask(this._zone,{microTask:n.microTask>0,macroTask:n.macroTask>0,eventTask:n.eventTask>0,change:e})}}class a{type;source;invoke;callback;data;scheduleFn;cancelFn;_zone=null;runCount=0;_zoneDelegates=null;_state="notScheduled";constructor(e,t,n,o,r,s){if(this.type=e,this.source=t,this.data=o,this.scheduleFn=r,this.cancelFn=s,!n)throw new Error("callback is not defined");this.callback=n;const i=this;this.invoke=e===O&&o&&o.useG?a.invokeTask:function(){return a.invokeTask.call(global,i,this,arguments)}}static invokeTask(e,t,n){e||(e=this),z++;try{return e.runCount++,e.zone.runTask(e,t,n)}finally{1==z&&d(),z--}}get zone(){return this._zone}get state(){return this._state}cancelScheduleRequest(){this._transitionTo(k,y)}_transitionTo(e,t,n){if(this._state!==t&&this._state!==n)throw new Error(`${this.type} '${this.source}': can not transition to '${e}', expecting state '${t}'${n?" or '"+n+"'":""}, was '${this._state}'.`);this._state=e,e==k&&(this._zoneDelegates=null)}toString(){return this.data&&void 0!==this.data.handleId?this.data.handleId.toString():Object.prototype.toString.call(this)}toJSON(){return{type:this.type,state:this.state,source:this.source,zone:this.zone.name,runCount:this.runCount}}}const i=__symbol__("setTimeout"),c=__symbol__("Promise"),l=__symbol__("then");let h,u=[],p=!1;function f(e){if(h||global[c]&&(h=global[c].resolve(0)),h){let t=h[l];t||(t=h.then),t.call(h,e)}else global[i](e,0)}function _(e){0===z&&0===u.length&&f(d),e&&u.push(e)}function d(){if(!p){for(p=!0;u.length;){const e=u;u=[];for(let t=0;tZ,onUnhandledError:N,microtaskDrainDone:N,scheduleMicroTask:_,showUncaughtError:()=>!o[__symbol__("ignoreConsoleErrorUncaughtError")],patchEventTarget:()=>[],patchOnProperties:N,patchMethod:()=>N,bindArguments:()=>[],patchThen:()=>N,patchMacroTask:()=>N,patchEventPrototype:()=>N,isIEOrEdge:()=>!1,getGlobalObjects:()=>{},ObjectDefineProperty:()=>N,ObjectGetOwnPropertyDescriptor:()=>{},ObjectCreate:()=>{},ArraySlice:()=>[],patchClass:()=>N,wrapWithCurrentZone:()=>N,filterProperties:()=>[],attachOriginToPatched:()=>N,_redefineProperty:()=>N,patchCallbacks:()=>N,nativeScheduleMicroTask:f};let Z={parent:null,zone:new o(null,null)},D=null,z=0;function N(){}return n("Zone","Zone"),o}function loadZone(){const e=globalThis,t=!0===e[__symbol__("forceDuplicateZoneCheck")];if(e.Zone&&(t||"function"!=typeof e.Zone.__symbol__))throw new Error("Zone already loaded.");return e.Zone??=initZone(),e.Zone}const ObjectGetOwnPropertyDescriptor=Object.getOwnPropertyDescriptor,ObjectDefineProperty=Object.defineProperty,ObjectGetPrototypeOf=Object.getPrototypeOf,ObjectCreate=Object.create,ArraySlice=Array.prototype.slice,ADD_EVENT_LISTENER_STR="addEventListener",REMOVE_EVENT_LISTENER_STR="removeEventListener",ZONE_SYMBOL_ADD_EVENT_LISTENER=__symbol__("addEventListener"),ZONE_SYMBOL_REMOVE_EVENT_LISTENER=__symbol__("removeEventListener"),TRUE_STR="true",FALSE_STR="false",ZONE_SYMBOL_PREFIX=__symbol__("");function wrapWithCurrentZone(e,t){return Zone.current.wrap(e,t)}function scheduleMacroTaskWithCurrentZone(e,t,n,o,r){return Zone.current.scheduleMacroTask(e,t,n,o,r)}const zoneSymbol=__symbol__,isWindowExists="undefined"!=typeof window,internalWindow=isWindowExists?window:void 0,_global=isWindowExists&&internalWindow||globalThis,REMOVE_ATTRIBUTE="removeAttribute";function bindArguments(e,t){for(let n=e.length-1;n>=0;n--)"function"==typeof e[n]&&(e[n]=wrapWithCurrentZone(e[n],t+"_"+n));return e}function patchPrototype(e,t){const n=e.constructor.name;for(let o=0;o{const t=function(){return e.apply(this,bindArguments(arguments,n+"."+r))};return attachOriginToPatched(t,e),t})(s)}}}function isPropertyWritable(e){return!e||!1!==e.writable&&!("function"==typeof e.get&&void 0===e.set)}const isWebWorker="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope,isNode=!("nw"in _global)&&void 0!==_global.process&&"[object process]"===_global.process.toString(),isBrowser=!isNode&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),isMix=void 0!==_global.process&&"[object process]"===_global.process.toString()&&!isWebWorker&&!(!isWindowExists||!internalWindow.HTMLElement),zoneSymbolEventNames$1={},enableBeforeunloadSymbol=zoneSymbol("enable_beforeunload"),wrapFn=function(e){if(!(e=e||_global.event))return;let t=zoneSymbolEventNames$1[e.type];t||(t=zoneSymbolEventNames$1[e.type]=zoneSymbol("ON_PROPERTY"+e.type));const n=this||e.target||_global,o=n[t];let r;return isBrowser&&n===internalWindow&&"error"===e.type?(r=o&&o.call(this,e.message,e.filename,e.lineno,e.colno,e.error),!0===r&&e.preventDefault()):(r=o&&o.apply(this,arguments),"beforeunload"===e.type&&_global[enableBeforeunloadSymbol]&&"string"==typeof r?e.returnValue=r:null==r||r||e.preventDefault()),r};function patchProperty(e,t,n){let o=ObjectGetOwnPropertyDescriptor(e,t);if(!o&&n&&ObjectGetOwnPropertyDescriptor(n,t)&&(o={enumerable:!0,configurable:!0}),!o||!o.configurable)return;const r=zoneSymbol("on"+t+"patched");if(e.hasOwnProperty(r)&&e[r])return;delete o.writable,delete o.value;const s=o.get,a=o.set,i=t.slice(2);let c=zoneSymbolEventNames$1[i];c||(c=zoneSymbolEventNames$1[i]=zoneSymbol("ON_PROPERTY"+i)),o.set=function(t){let n=this;n||e!==_global||(n=_global),n&&("function"==typeof n[c]&&n.removeEventListener(i,wrapFn),a?.call(n,null),n[c]=t,"function"==typeof t&&n.addEventListener(i,wrapFn,!1))},o.get=function(){let n=this;if(n||e!==_global||(n=_global),!n)return null;const r=n[c];if(r)return r;if(s){let e=s.call(this);if(e)return o.set.call(this,e),"function"==typeof n[REMOVE_ATTRIBUTE]&&n.removeAttribute(t),e}return null},ObjectDefineProperty(e,t,o),e[r]=!0}function patchOnProperties(e,t,n){if(t)for(let o=0;ofunction(t,o){const s=n(t,o);return s.cbIdx>=0&&"function"==typeof o[s.cbIdx]?scheduleMacroTaskWithCurrentZone(s.name,o[s.cbIdx],s,r):e.apply(t,o)}))}function attachOriginToPatched(e,t){e[zoneSymbol("OriginalDelegate")]=t}let isDetectedIEOrEdge=!1,ieOrEdge=!1;function isIEOrEdge(){if(isDetectedIEOrEdge)return ieOrEdge;isDetectedIEOrEdge=!0;try{const e=internalWindow.navigator.userAgent;-1===e.indexOf("MSIE ")&&-1===e.indexOf("Trident/")&&-1===e.indexOf("Edge/")||(ieOrEdge=!0)}catch(e){}return ieOrEdge}function isFunction(e){return"function"==typeof e}function isNumber(e){return"number"==typeof e}const OPTIMIZED_ZONE_EVENT_TASK_DATA={useG:!0},zoneSymbolEventNames={},globalSources={},EVENT_NAME_SYMBOL_REGX=new RegExp("^"+ZONE_SYMBOL_PREFIX+"(\\w+)(true|false)$"),IMMEDIATE_PROPAGATION_SYMBOL=zoneSymbol("propagationStopped");function prepareEventNames(e,t){const n=(t?t(e):e)+"false",o=(t?t(e):e)+"true",r=ZONE_SYMBOL_PREFIX+n,s=ZONE_SYMBOL_PREFIX+o;zoneSymbolEventNames[e]={},zoneSymbolEventNames[e].false=r,zoneSymbolEventNames[e].true=s}function patchEventTarget(e,t,n,o){const r=o&&o.add||"addEventListener",s=o&&o.rm||"removeEventListener",a=o&&o.listeners||"eventListeners",i=o&&o.rmAll||"removeAllListeners",c=zoneSymbol(r),l="."+r+":",h="prependListener",u="."+h+":",p=function(e,t,n){if(e.isRemoved)return;const o=e.callback;let r;"object"==typeof o&&o.handleEvent&&(e.callback=e=>o.handleEvent(e),e.originalDelegate=o);try{e.invoke(e,t,[n])}catch(e){r=e}const a=e.options;return a&&"object"==typeof a&&a.once&&t[s].call(t,n.type,e.originalDelegate?e.originalDelegate:e.callback,a),r};function f(n,o,r){if(!(o=o||e.event))return;const s=n||o.target||e,a=s[zoneSymbolEventNames[o.type][r?"true":"false"]];if(a){const e=[];if(1===a.length){const t=p(a[0],s,o);t&&e.push(t)}else{const t=a.slice();for(let n=0;n{throw o}))}}}const _=function(e){return f(this,e,!1)},d=function(e){return f(this,e,!0)};function g(t,n){if(!t)return!1;let o=!0;n&&void 0!==n.useG&&(o=n.useG);const p=n&&n.vh;let f=!0;n&&void 0!==n.chkDup&&(f=n.chkDup);let g=!1;n&&void 0!==n.rt&&(g=n.rt);let k=t;for(;k&&!k.hasOwnProperty(r);)k=ObjectGetPrototypeOf(k);if(!k&&t[r]&&(k=t),!k)return!1;if(k[c])return!1;const y=n&&n.eventNameToString,E={},m=k[c]=k[r],T=k[zoneSymbol(s)]=k[s],b=k[zoneSymbol(a)]=k[a],v=k[zoneSymbol(i)]=k[i];let S;n&&n.prepend&&(S=k[zoneSymbol(n.prepend)]=k[n.prepend]);const O=o?function(e){if(!E.isExisting)return m.call(E.target,E.eventName,E.capture?d:_,E.options)}:function(e){return m.call(E.target,E.eventName,e.invoke,E.options)},w=o?function(e){if(!e.isRemoved){const t=zoneSymbolEventNames[e.eventName];let n;t&&(n=t[e.capture?"true":"false"]);const o=n&&e.target[n];if(o)for(let t=0;tj.zone.cancelTask(j);t.call(T,"abort",e,{once:!0}),j.removeAbortListener=()=>T.removeEventListener("abort",e)}return E.target=null,R&&(R.taskData=null),v&&(E.options.once=!0),"boolean"!=typeof j.options&&(j.options=g),j.target=l,j.capture=b,j.eventName=h,_&&(j.originalDelegate=u),c?N.unshift(j):N.push(j),i?l:void 0}};return k[r]=z(m,l,O,w,g),S&&(k[h]=z(S,u,(function(e){return S.call(E.target,E.eventName,e.invoke,E.options)}),w,g,!0)),k[s]=function(){const t=this||e;let o=arguments[0];n&&n.transferEventName&&(o=n.transferEventName(o));const r=arguments[2],s=!!r&&("boolean"==typeof r||r.capture),a=arguments[1];if(!a)return T.apply(this,arguments);if(p&&!p(T,a,t,arguments))return;const i=zoneSymbolEventNames[o];let c;i&&(c=i[s?"true":"false"]);const l=c&&t[c];if(l)for(let e=0;efunction(t,n){t[IMMEDIATE_PROPAGATION_SYMBOL]=!0,e&&e.apply(t,n)}))}function patchQueueMicrotask(e,t){t.patchMethod(e,"queueMicrotask",(e=>function(e,t){Zone.current.scheduleMicroTask("queueMicrotask",t[0])}))}const taskSymbol=zoneSymbol("zoneTask");function patchTimer(e,t,n,o){let r=null,s=null;n+=o;const a={};function i(t){const n=t.data;n.args[0]=function(){return t.invoke.apply(this,arguments)};const o=r.apply(e,n.args);return isNumber(o)?n.handleId=o:(n.handle=o,n.isRefreshable=isFunction(o.refresh)),t}function c(t){const{handle:n,handleId:o}=t.data;return s.call(e,n??o)}r=patchMethod(e,t+=o,(n=>function(r,s){if(isFunction(s[0])){const e={isRefreshable:!1,isPeriodic:"Interval"===o,delay:"Timeout"===o||"Interval"===o?s[1]||0:void 0,args:s},n=s[0];s[0]=function t(){try{return n.apply(this,arguments)}finally{const{handle:t,handleId:n,isPeriodic:o,isRefreshable:r}=e;o||r||(n?delete a[n]:t&&(t[taskSymbol]=null))}};const r=scheduleMacroTaskWithCurrentZone(t,s[0],e,i,c);if(!r)return r;const{handleId:l,handle:h,isRefreshable:u,isPeriodic:p}=r.data;if(l)a[l]=r;else if(h&&(h[taskSymbol]=r,u&&!p)){const e=h.refresh;h.refresh=function(){const{zone:t,state:n}=r;return"notScheduled"===n?(r._state="scheduled",t._updateTaskCount(r,1)):"running"===n&&(r._state="scheduling"),e.call(this)}}return h??l??r}return n.apply(e,s)})),s=patchMethod(e,n,(t=>function(n,o){const r=o[0];let s;isNumber(r)?(s=a[r],delete a[r]):(s=r?.[taskSymbol],s?r[taskSymbol]=null:s=r),s?.type?s.cancelFn&&s.zone.cancelTask(s):t.apply(e,o)}))}function patchCustomElements(e,t){const{isBrowser:n,isMix:o}=t.getGlobalObjects();(n||o)&&e.customElements&&"customElements"in e&&t.patchCallbacks(t,e.customElements,"customElements","define",["connectedCallback","disconnectedCallback","adoptedCallback","attributeChangedCallback","formAssociatedCallback","formDisabledCallback","formResetCallback","formStateRestoreCallback"])}function eventTargetPatch(e,t){if(Zone[t.symbol("patchEventTarget")])return;const{eventNames:n,zoneSymbolEventNames:o,TRUE_STR:r,FALSE_STR:s,ZONE_SYMBOL_PREFIX:a}=t.getGlobalObjects();for(let e=0;et.target===e));if(0===o.length)return t;const r=o[0].ignoreProperties;return t.filter((e=>-1===r.indexOf(e)))}function patchFilteredProperties(e,t,n,o){e&&patchOnProperties(e,filterProperties(e,t,n),o)}function getOnEventNames(e){return Object.getOwnPropertyNames(e).filter((e=>e.startsWith("on")&&e.length>2)).map((e=>e.substring(2)))}function propertyDescriptorPatch(e,t){if(isNode&&!isMix)return;if(Zone[e.symbol("patchEvents")])return;const n=t.__Zone_ignore_on_properties;let o=[];if(isBrowser){const e=window;o=o.concat(["Document","SVGElement","Element","HTMLElement","HTMLBodyElement","HTMLMediaElement","HTMLFrameSetElement","HTMLFrameElement","HTMLIFrameElement","HTMLMarqueeElement","Worker"]);const t=[];patchFilteredProperties(e,getOnEventNames(e),n?n.concat(t):n,ObjectGetPrototypeOf(e))}o=o.concat(["XMLHttpRequest","XMLHttpRequestEventTarget","IDBIndex","IDBRequest","IDBOpenDBRequest","IDBDatabase","IDBTransaction","IDBCursor","WebSocket"]);for(let e=0;e{const n=t[e.__symbol__("legacyPatch")];n&&n()})),e.__load_patch("timers",(e=>{const t="set",n="clear";patchTimer(e,t,n,"Timeout"),patchTimer(e,t,n,"Interval"),patchTimer(e,t,n,"Immediate")})),e.__load_patch("requestAnimationFrame",(e=>{patchTimer(e,"request","cancel","AnimationFrame"),patchTimer(e,"mozRequest","mozCancel","AnimationFrame"),patchTimer(e,"webkitRequest","webkitCancel","AnimationFrame")})),e.__load_patch("blocking",((e,t)=>{const n=["alert","prompt","confirm"];for(let o=0;ofunction(o,s){return t.current.run(n,e,s,r)}))})),e.__load_patch("EventTarget",((e,t,n)=>{patchEvent(e,n),eventTargetPatch(e,n);const o=e.XMLHttpRequestEventTarget;o&&o.prototype&&n.patchEventTarget(e,n,[o.prototype])})),e.__load_patch("MutationObserver",((e,t,n)=>{patchClass("MutationObserver"),patchClass("WebKitMutationObserver")})),e.__load_patch("IntersectionObserver",((e,t,n)=>{patchClass("IntersectionObserver")})),e.__load_patch("FileReader",((e,t,n)=>{patchClass("FileReader")})),e.__load_patch("on_property",((e,t,n)=>{propertyDescriptorPatch(n,e)})),e.__load_patch("customElements",((e,t,n)=>{patchCustomElements(e,n)})),e.__load_patch("XHR",((e,t)=>{!function n(e){const n=e.XMLHttpRequest;if(!n)return;const l=n.prototype;let h=l[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=l[ZONE_SYMBOL_REMOVE_EVENT_LISTENER];if(!h){const t=e.XMLHttpRequestEventTarget;if(t){const e=t.prototype;h=e[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=e[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]}}const p="readystatechange",f="scheduled";function _(e){const n=e.data,r=n.target;r[a]=!1,r[c]=!1;const i=r[s];h||(h=r[ZONE_SYMBOL_ADD_EVENT_LISTENER],u=r[ZONE_SYMBOL_REMOVE_EVENT_LISTENER]),i&&u.call(r,p,i);const l=r[s]=()=>{if(r.readyState===r.DONE)if(!n.aborted&&r[a]&&e.state===f){const o=r[t.__symbol__("loadfalse")];if(0!==r.status&&o&&o.length>0){const s=e.invoke;e.invoke=function(){const o=r[t.__symbol__("loadfalse")];for(let t=0;tfunction(e,t){return e[r]=0==t[2],e[i]=t[1],k.apply(e,t)})),y=zoneSymbol("fetchTaskAborting"),E=zoneSymbol("fetchTaskScheduling"),m=patchMethod(l,"send",(()=>function(e,n){if(!0===t.current[E])return m.apply(e,n);if(e[r])return m.apply(e,n);{const t={target:e,url:e[i],isPeriodic:!1,args:n,aborted:!1},o=scheduleMacroTaskWithCurrentZone("XMLHttpRequest.send",d,t,_,g);e&&!0===e[c]&&!t.aborted&&o.state===f&&o.invoke()}})),T=patchMethod(l,"abort",(()=>function(e,n){const r=function s(e){return e[o]}(e);if(r&&"string"==typeof r.type){if(null==r.cancelFn||r.data&&r.data.aborted)return;r.zone.cancelTask(r)}else if(!0===t.current[y])return T.apply(e,n)}))}(e);const o=zoneSymbol("xhrTask"),r=zoneSymbol("xhrSync"),s=zoneSymbol("xhrListener"),a=zoneSymbol("xhrScheduled"),i=zoneSymbol("xhrURL"),c=zoneSymbol("xhrErrorBeforeScheduled")})),e.__load_patch("geolocation",(e=>{e.navigator&&e.navigator.geolocation&&patchPrototype(e.navigator.geolocation,["getCurrentPosition","watchPosition"])})),e.__load_patch("PromiseRejectionEvent",((e,t)=>{function n(t){return function(n){findEventTasks(e,t).forEach((o=>{const r=e.PromiseRejectionEvent;if(r){const e=new r(t,{promise:n.promise,reason:n.rejection});o.invoke(e)}}))}}e.PromiseRejectionEvent&&(t[zoneSymbol("unhandledPromiseRejectionHandler")]=n("unhandledrejection"),t[zoneSymbol("rejectionHandledHandler")]=n("rejectionhandled"))})),e.__load_patch("queueMicrotask",((e,t,n)=>{patchQueueMicrotask(e,n)}))}function patchPromise(e){e.__load_patch("ZoneAwarePromise",((e,t,n)=>{const o=Object.getOwnPropertyDescriptor,r=Object.defineProperty,s=n.symbol,a=[],i=!1!==e[s("DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION")],c=s("Promise"),l=s("then");n.onUnhandledError=e=>{if(n.showUncaughtError()){const t=e&&e.rejection;t?console.error("Unhandled Promise rejection:",t instanceof Error?t.message:t,"; Zone:",e.zone.name,"; Task:",e.task&&e.task.source,"; Value:",t,t instanceof Error?t.stack:void 0):console.error(e)}},n.microtaskDrainDone=()=>{for(;a.length;){const e=a.shift();try{e.zone.runGuarded((()=>{if(e.throwOriginal)throw e.rejection;throw e}))}catch(e){u(e)}}};const h=s("unhandledPromiseRejectionHandler");function u(e){n.onUnhandledError(e);try{const n=t[h];"function"==typeof n&&n.call(this,e)}catch(e){}}function p(e){return e&&"function"==typeof e.then}function f(e){return e}function _(e){return M.reject(e)}const d=s("state"),g=s("value"),k=s("finally"),y=s("parentPromiseValue"),E=s("parentPromiseState"),m=null,T=!0,b=!1;function v(e,t){return n=>{try{P(e,t,n)}catch(t){P(e,!1,t)}}}const S=function(){let e=!1;return function t(n){return function(){e||(e=!0,n.apply(null,arguments))}}},O="Promise resolved with itself",w=s("currentTaskTrace");function P(e,o,s){const c=S();if(e===s)throw new TypeError(O);if(e[d]===m){let l=null;try{"object"!=typeof s&&"function"!=typeof s||(l=s&&s.then)}catch(t){return c((()=>{P(e,!1,t)}))(),e}if(o!==b&&s instanceof M&&s.hasOwnProperty(d)&&s.hasOwnProperty(g)&&s[d]!==m)D(s),P(e,s[d],s[g]);else if(o!==b&&"function"==typeof l)try{l.call(s,c(v(e,o)),c(v(e,!1)))}catch(t){c((()=>{P(e,!1,t)}))()}else{e[d]=o;const c=e[g];if(e[g]=s,e[k]===k&&o===T&&(e[d]=e[E],e[g]=e[y]),o===b&&s instanceof Error){const e=t.currentTask&&t.currentTask.data&&t.currentTask.data.__creationTrace__;e&&r(s,w,{configurable:!0,enumerable:!1,writable:!0,value:e})}for(let t=0;t{try{const o=e[g],r=!!n&&k===n[k];r&&(n[y]=o,n[E]=s);const i=t.run(a,void 0,r&&a!==_&&a!==f?[]:[o]);P(n,!0,i)}catch(e){P(n,!1,e)}}),n)}const N=function(){},C=e.AggregateError;class M{static toString(){return"function ZoneAwarePromise() { [native code] }"}static resolve(e){return e instanceof M?e:P(new this(null),T,e)}static reject(e){return P(new this(null),b,e)}static withResolvers(){const e={};return e.promise=new M(((t,n)=>{e.resolve=t,e.reject=n})),e}static any(e){if(!e||"function"!=typeof e[Symbol.iterator])return Promise.reject(new C([],"All promises were rejected"));const t=[];let n=0;try{for(let o of e)n++,t.push(M.resolve(o))}catch(e){return Promise.reject(new C([],"All promises were rejected"))}if(0===n)return Promise.reject(new C([],"All promises were rejected"));let o=!1;const r=[];return new M(((e,s)=>{for(let a=0;a{o||(o=!0,e(t))}),(e=>{r.push(e),n--,0===n&&(o=!0,s(new C(r,"All promises were rejected")))}))}))}static race(e){let t,n,o=new this(((e,o)=>{t=e,n=o}));function r(e){t(e)}function s(e){n(e)}for(let t of e)p(t)||(t=this.resolve(t)),t.then(r,s);return o}static all(e){return M.allWithCallback(e)}static allSettled(e){return(this&&this.prototype instanceof M?this:M).allWithCallback(e,{thenCallback:e=>({status:"fulfilled",value:e}),errorCallback:e=>({status:"rejected",reason:e})})}static allWithCallback(e,t){let n,o,r=new this(((e,t)=>{n=e,o=t})),s=2,a=0;const i=[];for(let r of e){p(r)||(r=this.resolve(r));const e=a;try{r.then((o=>{i[e]=t?t.thenCallback(o):o,s--,0===s&&n(i)}),(r=>{t?(i[e]=t.errorCallback(r),s--,0===s&&n(i)):o(r)}))}catch(e){o(e)}s++,a++}return s-=2,0===s&&n(i),r}constructor(e){const t=this;if(!(t instanceof M))throw new Error("Must be an instanceof Promise.");t[d]=m,t[g]=[];try{const n=S();e&&e(n(v(t,T)),n(v(t,b)))}catch(e){P(t,!1,e)}}get[Symbol.toStringTag](){return"Promise"}get[Symbol.species](){return M}then(e,n){let o=this.constructor?.[Symbol.species];o&&"function"==typeof o||(o=this.constructor||M);const r=new o(N),s=t.current;return this[d]==m?this[g].push(s,r,e,n):z(this,s,r,e,n),r}catch(e){return this.then(null,e)}finally(e){let n=this.constructor?.[Symbol.species];n&&"function"==typeof n||(n=M);const o=new n(N);o[k]=k;const r=t.current;return this[d]==m?this[g].push(r,o,e,e):z(this,r,o,e,e),o}}M.resolve=M.resolve,M.reject=M.reject,M.race=M.race,M.all=M.all;const I=e[c]=e.Promise;e.Promise=M;const R=s("thenPatched");function j(e){const t=e.prototype,n=o(t,"then");if(n&&(!1===n.writable||!n.configurable))return;const r=t.then;t[l]=r,e.prototype.then=function(e,t){return new M(((e,t)=>{r.call(this,e,t)})).then(e,t)},e[R]=!0}return n.patchThen=j,I&&(j(I),patchMethod(e,"fetch",(e=>function t(e){return function(t,n){let o=e.apply(t,n);if(o instanceof M)return o;let r=o.constructor;return r[R]||j(r),o}}(e)))),Promise[t.__symbol__("uncaughtPromiseErrors")]=a,M}))}function patchToString(e){e.__load_patch("toString",(e=>{const t=Function.prototype.toString,n=zoneSymbol("OriginalDelegate"),o=zoneSymbol("Promise"),r=zoneSymbol("Error"),s=function s(){if("function"==typeof this){const s=this[n];if(s)return"function"==typeof s?t.call(s):Object.prototype.toString.call(s);if(this===Promise){const n=e[o];if(n)return t.call(n)}if(this===Error){const n=e[r];if(n)return t.call(n)}}return t.call(this)};s[n]=t,Function.prototype.toString=s;const a=Object.prototype.toString;Object.prototype.toString=function(){return"function"==typeof Promise&&this instanceof Promise?"[object Promise]":a.call(this)}}))}function patchCallbacks(e,t,n,o,r){const s=Zone.__symbol__(o);if(t[s])return;const a=t[s]=t[o];t[o]=function(s,i,c){return i&&i.prototype&&r.forEach((function(t){const r=`${n}.${o}::`+t,s=i.prototype;try{if(s.hasOwnProperty(t)){const n=e.ObjectGetOwnPropertyDescriptor(s,t);n&&n.value?(n.value=e.wrapWithCurrentZone(n.value,r),e._redefineProperty(i.prototype,t,n)):s[t]&&(s[t]=e.wrapWithCurrentZone(s[t],r))}else s[t]&&(s[t]=e.wrapWithCurrentZone(s[t],r))}catch{}})),a.call(t,s,i,c)},e.attachOriginToPatched(t[o],a)}function patchUtil(e){e.__load_patch("util",((e,t,n)=>{const o=getOnEventNames(e);n.patchOnProperties=patchOnProperties,n.patchMethod=patchMethod,n.bindArguments=bindArguments,n.patchMacroTask=patchMacroTask;const r=t.__symbol__("BLACK_LISTED_EVENTS"),s=t.__symbol__("UNPATCHED_EVENTS");e[s]&&(e[r]=e[s]),e[r]&&(t[r]=t[s]=e[r]),n.patchEventPrototype=patchEventPrototype,n.patchEventTarget=patchEventTarget,n.isIEOrEdge=isIEOrEdge,n.ObjectDefineProperty=ObjectDefineProperty,n.ObjectGetOwnPropertyDescriptor=ObjectGetOwnPropertyDescriptor,n.ObjectCreate=ObjectCreate,n.ArraySlice=ArraySlice,n.patchClass=patchClass,n.wrapWithCurrentZone=wrapWithCurrentZone,n.filterProperties=filterProperties,n.attachOriginToPatched=attachOriginToPatched,n._redefineProperty=Object.defineProperty,n.patchCallbacks=patchCallbacks,n.getGlobalObjects=()=>({globalSources:globalSources,zoneSymbolEventNames:zoneSymbolEventNames,eventNames:o,isBrowser:isBrowser,isMix:isMix,isNode:isNode,TRUE_STR:"true",FALSE_STR:"false",ZONE_SYMBOL_PREFIX:ZONE_SYMBOL_PREFIX,ADD_EVENT_LISTENER_STR:"addEventListener",REMOVE_EVENT_LISTENER_STR:"removeEventListener"})}))}function patchCommon(e){patchPromise(e),patchToString(e),patchUtil(e)}const Zone$1=loadZone();patchCommon(Zone$1),patchBrowser(Zone$1);X]Ϲ xyg/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.dev/license */ /** * Suppress closure compiler errors about unknown 'global' variable * @fileoverview * @suppress {undefinedVars} */ /** * Zone is a mechanism for intercepting and keeping track of asynchronous work. * * A Zone is a global object which is configured with rules about how to intercept and keep track * of the asynchronous callbacks. Zone has these responsibilities: * * 1. Intercept asynchronous task scheduling * 2. Wrap callbacks for error-handling and zone tracking across async operations. * 3. Provide a way to attach data to zones * 4. Provide a context specific last frame error handling * 5. (Intercept blocking methods) * * A zone by itself does not do anything, instead it relies on some other code to route existing * platform API through it. (The zone library ships with code which monkey patches all of the * browsers's asynchronous API and redirects them through the zone for interception.) * * In its simplest form a zone allows one to intercept the scheduling and calling of asynchronous * operations, and execute additional code before as well as after the asynchronous task. The * rules of interception are configured using [ZoneConfig]. There can be many different zone * instances in a system, but only one zone is active at any given time which can be retrieved * using [Zone#current]. * * * * ## Callback Wrapping * * An important aspect of the zones is that they should persist across asynchronous operations. To * achieve this, when a future work is scheduled through async API, it is necessary to capture, * and subsequently restore the current zone. For example if a code is running in zone `b` and it * invokes `setTimeout` to scheduleTask work later, the `setTimeout` method needs to 1) capture * the current zone and 2) wrap the `wrapCallback` in code which will restore the current zone `b` * once the wrapCallback executes. In this way the rules which govern the current code are * preserved in all future asynchronous tasks. There could be a different zone `c` which has * different rules and is associated with different asynchronous tasks. As these tasks are * processed, each asynchronous wrapCallback correctly restores the correct zone, as well as * preserves the zone for future asynchronous callbacks. * * Example: Suppose a browser page consist of application code as well as third-party * advertisement code. (These two code bases are independent, developed by different mutually * unaware developers.) The application code may be interested in doing global error handling and * so it configures the `app` zone to send all of the errors to the server for analysis, and then * executes the application in the `app` zone. The advertising code is interested in the same * error processing but it needs to send the errors to a different third-party. So it creates the * `ads` zone with a different error handler. Now both advertising as well as application code * create many asynchronous operations, but the [Zone] will ensure that all of the asynchronous * operations created from the application code will execute in `app` zone with its error * handler and all of the advertisement code will execute in the `ads` zone with its error * handler. This will not only work for the async operations created directly, but also for all * subsequent asynchronous operations. * * If you think of chain of asynchronous operations as a thread of execution (bit of a stretch) * then [Zone#current] will act as a thread local variable. * * * * ## Asynchronous operation scheduling * * In addition to wrapping the callbacks to restore the zone, all operations which cause a * scheduling of work for later are routed through the current zone which is allowed to intercept * them by adding work before or after the wrapCallback as well as using different means of * achieving the request. (Useful for unit testing, or tracking of requests). In some instances * such as `setTimeout` the wrapping of the wrapCallback and scheduling is done in the same * wrapCallback, but there are other examples such as `Promises` where the `then` wrapCallback is * wrapped, but the execution of `then` is triggered by `Promise` scheduling `resolve` work. * * Fundamentally there are three kinds of tasks which can be scheduled: * * 1. [MicroTask] used for doing work right after the current task. This is non-cancelable which * is guaranteed to run exactly once and immediately. * 2. [MacroTask] used for doing work later. Such as `setTimeout`. This is typically cancelable * which is guaranteed to execute at least once after some well understood delay. * 3. [EventTask] used for listening on some future event. This may execute zero or more times, * with an unknown delay. * * Each asynchronous API is modeled and routed through one of these APIs. * * * ### [MicroTask] * * [MicroTask]s represent work which will be done in current VM turn as soon as possible, before * VM yielding. * * * ### [MacroTask] * * [MacroTask]s represent work which will be done after some delay. (Sometimes the delay is * approximate such as on next available animation frame). Typically these methods include: * `setTimeout`, `setImmediate`, `setInterval`, `requestAnimationFrame`, and all browser specific * variants. * * * ### [EventTask] * * [EventTask]s represent a request to create a listener on an event. Unlike the other task * events they may never be executed, but typically execute more than once. There is no queue of * events, rather their callbacks are unpredictable both in order and time. * * * ## Global Error Handling * * * ## Composability * * Zones can be composed together through [Zone.fork()]. A child zone may create its own set of * rules. A child zone is expected to either: * * 1. Delegate the interception to a parent zone, and optionally add before and after wrapCallback * hooks. * 2. Process the request itself without delegation. * * Composability allows zones to keep their concerns clean. For example a top most zone may choose * to handle error handling, while child zones may choose to do user action tracking. * * * ## Root Zone * * At the start the browser will run in a special root zone, which is configured to behave exactly * like the platform, making any existing code which is not zone-aware behave as expected. All * zones are children of the root zone. * */ export declare interface Zone { /** * * @returns {Zone} The parent Zone. */ parent: Zone | null; /** * @returns {string} The Zone name (useful for debugging) */ name: string; /** * Returns a value associated with the `key`. * * If the current zone does not have a key, the request is delegated to the parent zone. Use * [ZoneSpec.properties] to configure the set of properties associated with the current zone. * * @param key The key to retrieve. * @returns {any} The value for the key, or `undefined` if not found. */ get(key: string): any; /** * Returns a Zone which defines a `key`. * * Recursively search the parent Zone until a Zone which has a property `key` is found. * * @param key The key to use for identification of the returned zone. * @returns {Zone} The Zone which defines the `key`, `null` if not found. */ getZoneWith(key: string): Zone | null; /** * Used to create a child zone. * * @param zoneSpec A set of rules which the child zone should follow. * @returns {Zone} A new child zone. */ fork(zoneSpec: ZoneSpec): Zone; /** * Wraps a callback function in a new function which will properly restore the current zone upon * invocation. * * The wrapped function will properly forward `this` as well as `arguments` to the `callback`. * * Before the function is wrapped the zone can intercept the `callback` by declaring * [ZoneSpec.onIntercept]. * * @param callback the function which will be wrapped in the zone. * @param source A unique debug location of the API being wrapped. * @returns {function(): *} A function which will invoke the `callback` through * [Zone.runGuarded]. */ wrap(callback: F, source: string): F; /** * Invokes a function in a given zone. * * The invocation of `callback` can be intercepted by declaring [ZoneSpec.onInvoke]. * * @param callback The function to invoke. * @param applyThis * @param applyArgs * @param source A unique debug location of the API being invoked. * @returns {any} Value from the `callback` function. */ run(callback: Function, applyThis?: any, applyArgs?: any[], source?: string): T; /** * Invokes a function in a given zone and catches any exceptions. * * Any exceptions thrown will be forwarded to [Zone.HandleError]. * * The invocation of `callback` can be intercepted by declaring [ZoneSpec.onInvoke]. The * handling of exceptions can be intercepted by declaring [ZoneSpec.handleError]. * * @param callback The function to invoke. * @param applyThis * @param applyArgs * @param source A unique debug location of the API being invoked. * @returns {any} Value from the `callback` function. */ runGuarded(callback: Function, applyThis?: any, applyArgs?: any[], source?: string): T; /** * Execute the Task by restoring the [Zone.currentTask] in the Task's zone. * * @param task to run * @param applyThis * @param applyArgs * @returns {any} Value from the `task.callback` function. */ runTask(task: Task, applyThis?: any, applyArgs?: any): T; /** * Schedule a MicroTask. * * @param source * @param callback * @param data * @param customSchedule */ scheduleMicroTask(source: string, callback: Function, data?: TaskData, customSchedule?: (task: Task) => void): MicroTask; /** * Schedule a MacroTask. * * @param source * @param callback * @param data * @param customSchedule * @param customCancel */ scheduleMacroTask(source: string, callback: Function, data?: TaskData, customSchedule?: (task: Task) => void, customCancel?: (task: Task) => void): MacroTask; /** * Schedule an EventTask. * * @param source * @param callback * @param data * @param customSchedule * @param customCancel */ scheduleEventTask(source: string, callback: Function, data?: TaskData, customSchedule?: (task: Task) => void, customCancel?: (task: Task) => void): EventTask; /** * Schedule an existing Task. * * Useful for rescheduling a task which was already canceled. * * @param task */ scheduleTask(task: T): T; /** * Allows the zone to intercept canceling of scheduled Task. * * The interception is configured using [ZoneSpec.onCancelTask]. The default canceler invokes * the [Task.cancelFn]. * * @param task * @returns {any} */ cancelTask(task: Task): any; } export declare interface ZoneType { /** * @returns {Zone} Returns the current [Zone]. The only way to change * the current zone is by invoking a run() method, which will update the current zone for the * duration of the run method callback. */ current: Zone; /** * @returns {Task} The task associated with the current execution. */ currentTask: Task | null; /** * Verify that Zone has been correctly patched. Specifically that Promise is zone aware. */ assertZonePatched(): void; /** * Return the root zone. */ root: Zone; /** * load patch for specified native module, allow user to * define their own patch, user can use this API after loading zone.js */ __load_patch(name: string, fn: PatchFn, ignoreDuplicate?: boolean): void; /** * Zone symbol API to generate a string with __zone_symbol__ prefix */ __symbol__(name: string): string; } /** * Patch Function to allow user define their own monkey patch module. */ export type PatchFn = (global: Window, Zone: ZoneType, api: ZonePrivate) => void; /** * ZonePrivate interface to provide helper method to help user implement * their own monkey patch module. */ export declare interface ZonePrivate { currentZoneFrame: () => ZoneFrame; symbol: (name: string) => string; scheduleMicroTask: (task?: MicroTask) => void; onUnhandledError: (error: Error) => void; microtaskDrainDone: () => void; showUncaughtError: () => boolean; patchEventTarget: (global: any, api: ZonePrivate, apis: any[], options?: any) => boolean[]; patchOnProperties: (obj: any, properties: string[] | null, prototype?: any) => void; patchThen: (ctro: Function) => void; patchMethod: (target: any, name: string, patchFn: (delegate: Function, delegateName: string, name: string) => (self: any, args: any[]) => any) => Function | null; bindArguments: (args: any[], source: string) => any[]; patchMacroTask: (obj: any, funcName: string, metaCreator: (self: any, args: any[]) => any) => void; patchEventPrototype: (_global: any, api: ZonePrivate) => void; isIEOrEdge: () => boolean; ObjectDefineProperty: (o: any, p: PropertyKey, attributes: PropertyDescriptor & ThisType) => any; ObjectGetOwnPropertyDescriptor: (o: any, p: PropertyKey) => PropertyDescriptor | undefined; ObjectCreate(o: object | null, properties?: PropertyDescriptorMap & ThisType): any; ArraySlice(start?: number, end?: number): any[]; patchClass: (className: string) => void; wrapWithCurrentZone: (callback: any, source: string) => any; filterProperties: (target: any, onProperties: string[], ignoreProperties: any[]) => string[]; attachOriginToPatched: (target: any, origin: any) => void; _redefineProperty: (target: any, callback: string, desc: any) => void; nativeScheduleMicroTask: (func: Function) => void; patchCallbacks: (api: ZonePrivate, target: any, targetName: string, method: string, callbacks: string[]) => void; getGlobalObjects: () => { globalSources: any; zoneSymbolEventNames: any; eventNames: string[]; isBrowser: boolean; isMix: boolean; isNode: boolean; TRUE_STR: string; FALSE_STR: string; ZONE_SYMBOL_PREFIX: string; ADD_EVENT_LISTENER_STR: string; REMOVE_EVENT_LISTENER_STR: string; } | undefined; } /** * ZoneFrame represents zone stack frame information */ export declare interface ZoneFrame { parent: ZoneFrame | null; zone: Zone; } export declare interface UncaughtPromiseError extends Error { zone: Zone; task: Task; promise: Promise; rejection: any; throwOriginal?: boolean; } /** * Provides a way to configure the interception of zone events. * * Only the `name` property is required (all other are optional). */ export declare interface ZoneSpec { /** * The name of the zone. Useful when debugging Zones. */ name: string; /** * A set of properties to be associated with Zone. Use [Zone.get] to retrieve them. */ properties?: { [key: string]: any; }; /** * Allows the interception of zone forking. * * When the zone is being forked, the request is forwarded to this method for interception. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param zoneSpec The argument passed into the `fork` method. */ onFork?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, zoneSpec: ZoneSpec) => Zone; /** * Allows interception of the wrapping of the callback. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param delegate The argument passed into the `wrap` method. * @param source The argument passed into the `wrap` method. */ onIntercept?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, delegate: Function, source: string) => Function; /** * Allows interception of the callback invocation. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param delegate The argument passed into the `run` method. * @param applyThis The argument passed into the `run` method. * @param applyArgs The argument passed into the `run` method. * @param source The argument passed into the `run` method. */ onInvoke?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, delegate: Function, applyThis: any, applyArgs?: any[], source?: string) => any; /** * Allows interception of the error handling. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param error The argument passed into the `handleError` method. */ onHandleError?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, error: any) => boolean; /** * Allows interception of task scheduling. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param task The argument passed into the `scheduleTask` method. */ onScheduleTask?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, task: Task) => Task; onInvokeTask?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, task: Task, applyThis: any, applyArgs?: any[]) => any; /** * Allows interception of task cancellation. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param task The argument passed into the `cancelTask` method. */ onCancelTask?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, task: Task) => any; /** * Notifies of changes to the task queue empty status. * * @param parentZoneDelegate Delegate which performs the parent [ZoneSpec] operation. * @param currentZone The current [Zone] where the current interceptor has been declared. * @param targetZone The [Zone] which originally received the request. * @param hasTaskState */ onHasTask?: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone, hasTaskState: HasTaskState) => void; } /** * A delegate when intercepting zone operations. * * A ZoneDelegate is needed because a child zone can't simply invoke a method on a parent zone. * For example a child zone wrap can't just call parent zone wrap. Doing so would create a * callback which is bound to the parent zone. What we are interested in is intercepting the * callback before it is bound to any zone. Furthermore, we also need to pass the targetZone (zone * which received the original request) to the delegate. * * The ZoneDelegate methods mirror those of Zone with an addition of extra targetZone argument in * the method signature. (The original Zone which received the request.) Some methods are renamed * to prevent confusion, because they have slightly different semantics and arguments. * * - `wrap` => `intercept`: The `wrap` method delegates to `intercept`. The `wrap` method returns * a callback which will run in a given zone, where as intercept allows wrapping the callback * so that additional code can be run before and after, but does not associate the callback * with the zone. * - `run` => `invoke`: The `run` method delegates to `invoke` to perform the actual execution of * the callback. The `run` method switches to new zone; saves and restores the `Zone.current`; * and optionally performs error handling. The invoke is not responsible for error handling, * or zone management. * * Not every method is usually overwritten in the child zone, for this reason the ZoneDelegate * stores the closest zone which overwrites this behavior along with the closest ZoneSpec. * * NOTE: We have tried to make this API analogous to Event bubbling with target and current * properties. * * Note: The ZoneDelegate treats ZoneSpec as class. This allows the ZoneSpec to use its `this` to * store internal state. */ export declare interface ZoneDelegate { zone: Zone; fork(targetZone: Zone, zoneSpec: ZoneSpec): Zone; intercept(targetZone: Zone, callback: Function, source: string): Function; invoke(targetZone: Zone, callback: Function, applyThis?: any, applyArgs?: any[], source?: string): any; handleError(targetZone: Zone, error: any): boolean; scheduleTask(targetZone: Zone, task: Task): Task; invokeTask(targetZone: Zone, task: Task, applyThis?: any, applyArgs?: any[]): any; cancelTask(targetZone: Zone, task: Task): any; hasTask(targetZone: Zone, isEmpty: HasTaskState): void; } export type HasTaskState = { microTask: boolean; macroTask: boolean; eventTask: boolean; change: TaskType; }; /** * Task type: `microTask`, `macroTask`, `eventTask`. */ export type TaskType = 'microTask' | 'macroTask' | 'eventTask'; /** * Task type: `notScheduled`, `scheduling`, `scheduled`, `running`, `canceling`, 'unknown'. */ export type TaskState = 'notScheduled' | 'scheduling' | 'scheduled' | 'running' | 'canceling' | 'unknown'; /** */ export declare interface TaskData { /** * A periodic [MacroTask] is such which get automatically rescheduled after it is executed. */ isPeriodic?: boolean; /** * A [MacroTask] that can be manually rescheduled. */ isRefreshable?: boolean; /** * Delay in milliseconds when the Task will run. */ delay?: number; /** * identifier returned by the native setTimeout. */ handleId?: number; /** The target handler. */ handle?: any; } /** * Represents work which is executed with a clean stack. * * Tasks are used in Zones to mark work which is performed on clean stack frame. There are three * kinds of task. [MicroTask], [MacroTask], and [EventTask]. * * A JS VM can be modeled as a [MicroTask] queue, [MacroTask] queue, and [EventTask] set. * * - [MicroTask] queue represents a set of tasks which are executing right after the current stack * frame becomes clean and before a VM yield. All [MicroTask]s execute in order of insertion * before VM yield and the next [MacroTask] is executed. * - [MacroTask] queue represents a set of tasks which are executed one at a time after each VM * yield. The queue is ordered by time, and insertions can happen in any location. * - [EventTask] is a set of tasks which can at any time be inserted to the end of the [MacroTask] * queue. This happens when the event fires. * */ export declare interface Task { /** * Task type: `microTask`, `macroTask`, `eventTask`. */ type: TaskType; /** * Task state: `notScheduled`, `scheduling`, `scheduled`, `running`, `canceling`, `unknown`. */ state: TaskState; /** * Debug string representing the API which requested the scheduling of the task. */ source: string; /** * The Function to be used by the VM upon entering the [Task]. This function will delegate to * [Zone.runTask] and delegate to `callback`. */ invoke: Function; /** * Function which needs to be executed by the Task after the [Zone.currentTask] has been set to * the current task. */ callback: Function; /** * Task specific options associated with the current task. This is passed to the `scheduleFn`. */ data?: TaskData; /** * Represents the default work which needs to be done to schedule the Task by the VM. * * A zone may choose to intercept this function and perform its own scheduling. */ scheduleFn?: (task: Task) => void; /** * Represents the default work which needs to be done to un-schedule the Task from the VM. Not * all Tasks are cancelable, and therefore this method is optional. * * A zone may chose to intercept this function and perform its own un-scheduling. */ cancelFn?: (task: Task) => void; /** * @type {Zone} The zone which will be used to invoke the `callback`. The Zone is captured * at the time of Task creation. */ readonly zone: Zone; /** * Number of times the task has been executed, or -1 if canceled. */ runCount: number; /** * Cancel the scheduling request. This method can be called from `ZoneSpec.onScheduleTask` to * cancel the current scheduling interception. Once canceled the task can be discarded or * rescheduled using `Zone.scheduleTask` on a different zone. */ cancelScheduleRequest(): void; } export declare interface MicroTask extends Task { type: 'microTask'; } export declare interface MacroTask extends Task { type: 'macroTask'; } export declare interface EventTask extends Task { type: 'eventTask'; } export type AmbientZone = Zone; export declare function __symbol__(name: string): string; export declare function initZone(): ZoneType; }hXvxl/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.dev/license */ declare global { /** * Additional `EventTarget` methods added by `Zone.js`. * * 1. removeAllListeners, remove all event listeners of the given event name. * 2. eventListeners, get all event listeners of the given event name. */ interface EventTarget { /** * * Remove all event listeners by name for this event target. * * This method is optional because it may not be available if you use `noop zone` when * bootstrapping Angular application or disable the `EventTarget` monkey patch by `zone.js`. * * If the `eventName` is provided, will remove event listeners of that name. * If the `eventName` is not provided, will remove all event listeners associated with * `EventTarget`. * * @param eventName the name of the event, such as `click`. This parameter is optional. */ removeAllListeners?(eventName?: string): void; /** * * Retrieve all event listeners by name. * * This method is optional because it may not be available if you use `noop zone` when * bootstrapping Angular application or disable the `EventTarget` monkey patch by `zone.js`. * * If the `eventName` is provided, will return an array of event handlers or event listener * objects of the given event. * If the `eventName` is not provided, will return all listeners. * * @param eventName the name of the event, such as click. This parameter is optional. */ eventListeners?(eventName?: string): EventListenerOrEventListenerObject[]; } } export {}; "UDxVs/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.dev/license */ declare global { /** * Interface of `zone.js` configurations. * * You can define the following configurations on the `window/global` object before * importing `zone.js` to change `zone.js` default behaviors. */ interface ZoneGlobalConfigurations { /** * Disable the monkey patch of the `Node.js` `EventEmitter` API. * * By default, `zone.js` monkey patches the `Node.js` `EventEmitter` APIs to make asynchronous * callbacks of those APIs in the same zone when scheduled. * * Consider the following example: * * ```ts * const EventEmitter = require('events'); * class MyEmitter extends EventEmitter {} * const myEmitter = new MyEmitter(); * * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * myEmitter.on('event', () => { * console.log('an event occurs in the zone', Zone.current.name); * // the callback runs in the zone when it is scheduled, * // so the output is 'an event occurs in the zone myZone'. * }); * }); * myEmitter.emit('event'); * ``` * * If you set `__Zone_disable_EventEmitter = true` before importing `zone.js`, * `zone.js` does not monkey patch the `EventEmitter` APIs and the above code * outputs 'an event occurred '. */ __Zone_disable_EventEmitter?: boolean; /** * Disable the monkey patch of the `Node.js` `fs` API. * * By default, `zone.js` monkey patches `Node.js` `fs` APIs to make asynchronous callbacks of * those APIs in the same zone when scheduled. * * Consider the following example: * * ```ts * const fs = require('fs'); * * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * fs.stat('/tmp/world', (err, stats) => { * console.log('fs.stats() callback is invoked in the zone', Zone.current.name); * // since the callback of the `fs.stat()` runs in the same zone * // when it is called, so the output is 'fs.stats() callback is invoked in the zone * myZone'. * }); * }); * ``` * * If you set `__Zone_disable_fs = true` before importing `zone.js`, * `zone.js` does not monkey patch the `fs` API and the above code * outputs 'get stats occurred '. */ __Zone_disable_fs?: boolean; /** * Disable the monkey patch of the `Node.js` `timer` API. * * By default, `zone.js` monkey patches the `Node.js` `timer` APIs to make asynchronous * callbacks of those APIs in the same zone when scheduled. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * setTimeout(() => { * console.log('setTimeout() callback is invoked in the zone', Zone.current.name); * // since the callback of `setTimeout()` runs in the same zone * // when it is scheduled, so the output is 'setTimeout() callback is invoked in the zone * // myZone'. * }); * }); * ``` * * If you set `__Zone_disable_timers = true` before importing `zone.js`, * `zone.js` does not monkey patch the `timer` APIs and the above code * outputs 'timeout '. */ __Zone_disable_node_timers?: boolean; /** * Disable the monkey patch of the `Node.js` `process.nextTick()` API. * * By default, `zone.js` monkey patches the `Node.js` `process.nextTick()` API to make the * callback in the same zone when calling `process.nextTick()`. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * process.nextTick(() => { * console.log('process.nextTick() callback is invoked in the zone', Zone.current.name); * // since the callback of `process.nextTick()` runs in the same zone * // when it is scheduled, so the output is 'process.nextTick() callback is invoked in the * // zone myZone'. * }); * }); * ``` * * If you set `__Zone_disable_nextTick = true` before importing `zone.js`, * `zone.js` does not monkey patch the `process.nextTick()` API and the above code * outputs 'nextTick '. */ __Zone_disable_nextTick?: boolean; /** * Disable the monkey patch of the `Node.js` `crypto` API. * * By default, `zone.js` monkey patches the `Node.js` `crypto` APIs to make asynchronous * callbacks of those APIs in the same zone when called. * * Consider the following example: * * ```ts * const crypto = require('crypto'); * * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * crypto.randomBytes(() => { * console.log('crypto.randomBytes() callback is invoked in the zone', Zone.current.name); * // since the callback of `crypto.randomBytes()` runs in the same zone * // when it is called, so the output is 'crypto.randomBytes() callback is invoked in the * // zone myZone'. * }); * }); * ``` * * If you set `__Zone_disable_crypto = true` before importing `zone.js`, * `zone.js` does not monkey patch the `crypto` API and the above code * outputs 'crypto '. */ __Zone_disable_crypto?: boolean; /** * Disable the monkey patch of the `Object.defineProperty()` API. * * Note: This configuration is available only in the legacy bundle (dist/zone.js). This module * is not available in the evergreen bundle (zone-evergreen.js). * * In the legacy browser, the default behavior of `zone.js` is to monkey patch * `Object.defineProperty()` and `Object.create()` to try to ensure PropertyDescriptor * parameter's configurable property to be true. This patch is only needed in some old mobile * browsers. * * If you set `__Zone_disable_defineProperty = true` before importing `zone.js`, * `zone.js` does not monkey patch the `Object.defineProperty()` API and does not * modify desc.configurable to true. * */ __Zone_disable_defineProperty?: boolean; /** * Disable the monkey patch of the browser `registerElement()` API. * * NOTE: This configuration is only available in the legacy bundle (dist/zone.js), this * module is not available in the evergreen bundle (zone-evergreen.js). * * In the legacy browser, the default behavior of `zone.js` is to monkey patch the * `registerElement()` API to make asynchronous callbacks of the API in the same zone when * `registerElement()` is called. * * Consider the following example: * * ```ts * const proto = Object.create(HTMLElement.prototype); * proto.createdCallback = function() { * console.log('createdCallback is invoked in the zone', Zone.current.name); * }; * proto.attachedCallback = function() { * console.log('attachedCallback is invoked in the zone', Zone.current.name); * }; * proto.detachedCallback = function() { * console.log('detachedCallback is invoked in the zone', Zone.current.name); * }; * proto.attributeChangedCallback = function() { * console.log('attributeChangedCallback is invoked in the zone', Zone.current.name); * }; * * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * document.registerElement('x-elem', {prototype: proto}); * }); * ``` * * When these callbacks are invoked, those callbacks will be in the zone when * `registerElement()` is called. * * If you set `__Zone_disable_registerElement = true` before importing `zone.js`, * `zone.js` does not monkey patch `registerElement()` API and the above code * outputs ''. */ __Zone_disable_registerElement?: boolean; /** * Disable the monkey patch of the browser legacy `EventTarget` API. * * NOTE: This configuration is only available in the legacy bundle (dist/zone.js), this module * is not available in the evergreen bundle (zone-evergreen.js). * * In some old browsers, the `EventTarget` is not available, so `zone.js` cannot directly monkey * patch the `EventTarget`. Instead, `zone.js` patches all known HTML elements' prototypes (such * as `HtmlDivElement`). The callback of the `addEventListener()` will be in the same zone when * the `addEventListener()` is called. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * div.addEventListener('click', () => { * console.log('div click event listener is invoked in the zone', Zone.current.name); * // the output is 'div click event listener is invoked in the zone myZone'. * }); * }); * ``` * * If you set `__Zone_disable_EventTargetLegacy = true` before importing `zone.js` * In some old browsers, where `EventTarget` is not available, if you set * `__Zone_disable_EventTargetLegacy = true` before importing `zone.js`, `zone.js` does not * monkey patch all HTML element APIs and the above code outputs 'clicked '. */ __Zone_disable_EventTargetLegacy?: boolean; /** * Disable the monkey patch of the browser `timer` APIs. * * By default, `zone.js` monkey patches browser timer * APIs (`setTimeout()`/`setInterval()`/`setImmediate()`) to make asynchronous callbacks of * those APIs in the same zone when scheduled. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * setTimeout(() => { * console.log('setTimeout() callback is invoked in the zone', Zone.current.name); * // since the callback of `setTimeout()` runs in the same zone * // when it is scheduled, so the output is 'setTimeout() callback is invoked in the zone * // myZone'. * }); * }); * ``` * * If you set `__Zone_disable_timers = true` before importing `zone.js`, * `zone.js` does not monkey patch `timer` API and the above code * outputs 'timeout '. * */ __Zone_disable_timers?: boolean; /** * Disable the monkey patch of the browser `requestAnimationFrame()` API. * * By default, `zone.js` monkey patches the browser `requestAnimationFrame()` API * to make the asynchronous callback of the `requestAnimationFrame()` in the same zone when * scheduled. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * requestAnimationFrame(() => { * console.log('requestAnimationFrame() callback is invoked in the zone', * Zone.current.name); * // since the callback of `requestAnimationFrame()` will be in the same zone * // when it is scheduled, so the output will be 'requestAnimationFrame() callback is * invoked * // in the zone myZone' * }); * }); * ``` * * If you set `__Zone_disable_requestAnimationFrame = true` before importing `zone.js`, * `zone.js` does not monkey patch the `requestAnimationFrame()` API and the above code * outputs 'raf '. */ __Zone_disable_requestAnimationFrame?: boolean; /** * * Disable the monkey patching of the `queueMicrotask()` API. * * By default, `zone.js` monkey patches the `queueMicrotask()` API * to ensure that `queueMicrotask()` callback is invoked in the same zone as zone used to invoke * `queueMicrotask()`. And also the callback is running as `microTask` like * `Promise.prototype.then()`. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * queueMicrotask(() => { * console.log('queueMicrotask() callback is invoked in the zone', Zone.current.name); * // Since `queueMicrotask()` was invoked in `myZone`, same zone is restored * // when 'queueMicrotask() callback is invoked, resulting in `myZone` being console * logged. * }); * }); * ``` * * If you set `__Zone_disable_queueMicrotask = true` before importing `zone.js`, * `zone.js` does not monkey patch the `queueMicrotask()` API and the above code * output will change to: 'queueMicrotask() callback is invoked in the zone '. */ __Zone_disable_queueMicrotask?: boolean; /** * * Disable the monkey patch of the browser blocking APIs(`alert()`/`prompt()`/`confirm()`). */ __Zone_disable_blocking?: boolean; /** * Disable the monkey patch of the browser `EventTarget` APIs. * * By default, `zone.js` monkey patches EventTarget APIs. The callbacks of the * `addEventListener()` run in the same zone when the `addEventListener()` is called. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * div.addEventListener('click', () => { * console.log('div event listener is invoked in the zone', Zone.current.name); * // the output is 'div event listener is invoked in the zone myZone'. * }); * }); * ``` * * If you set `__Zone_disable_EventTarget = true` before importing `zone.js`, * `zone.js` does not monkey patch EventTarget API and the above code * outputs 'clicked '. * */ __Zone_disable_EventTarget?: boolean; /** * Disable the monkey patch of the browser `FileReader` APIs. */ __Zone_disable_FileReader?: boolean; /** * Disable the monkey patch of the browser `MutationObserver` APIs. */ __Zone_disable_MutationObserver?: boolean; /** * Disable the monkey patch of the browser `IntersectionObserver` APIs. */ __Zone_disable_IntersectionObserver?: boolean; /** * Disable the monkey patch of the browser onProperty APIs(such as onclick). * * By default, `zone.js` monkey patches onXXX properties (such as onclick). The callbacks of * onXXX properties run in the same zone when the onXXX properties is set. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * zone.run(() => { * div.onclick = () => { * console.log('div click event listener is invoked in the zone', Zone.current.name); * // the output will be 'div click event listener is invoked in the zone myZone' * } * }); * ``` * * If you set `__Zone_disable_on_property = true` before importing `zone.js`, * `zone.js` does not monkey patch onXXX properties and the above code * outputs 'clicked '. * */ __Zone_disable_on_property?: boolean; /** * Disable the monkey patch of the browser `customElements` APIs. * * By default, `zone.js` monkey patches `customElements` APIs to make callbacks run in the * same zone when the `customElements.define()` is called. * * Consider the following example: * * ```ts * class TestCustomElement extends HTMLElement { * constructor() { super(); } * connectedCallback() {} * disconnectedCallback() {} * attributeChangedCallback(attrName, oldVal, newVal) {} * adoptedCallback() {} * formAssociatedCallback(form) {} * formDisabledCallback(isDisabled) {} * formResetCallback() {} * formStateRestoreCallback(state, reason) {} * } * * const zone = Zone.fork({name: 'myZone'}); * zone.run(() => { * customElements.define('x-elem', TestCustomElement); * }); * ``` * * All those callbacks defined in TestCustomElement runs in the zone when * the `customElements.define()` is called. * * If you set `__Zone_disable_customElements = true` before importing `zone.js`, * `zone.js` does not monkey patch `customElements` APIs and the above code * runs inside zone. */ __Zone_disable_customElements?: boolean; /** * Disable the monkey patch of the browser `XMLHttpRequest` APIs. * * By default, `zone.js` monkey patches `XMLHttpRequest` APIs to make XMLHttpRequest act * as macroTask. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({ * name: 'myZone', * onScheduleTask: (delegate, curr, target, task) => { * console.log('task is scheduled', task.type, task.source, task.zone.name); * return delegate.scheduleTask(target, task); * } * }) * const xhr = new XMLHttpRequest(); * zone.run(() => { * xhr.onload = function() {}; * xhr.open('get', '/', true); * xhr.send(); * }); * ``` * * In this example, the instance of XMLHttpRequest runs in the zone and acts as a macroTask. The * output is 'task is scheduled macroTask, XMLHttpRequest.send, zone'. * * If you set `__Zone_disable_XHR = true` before importing `zone.js`, * `zone.js` does not monkey patch `XMLHttpRequest` APIs and the above onScheduleTask callback * will not be called. * */ __Zone_disable_XHR?: boolean; /** * Disable the monkey patch of the browser geolocation APIs. * * By default, `zone.js` monkey patches geolocation APIs to make callbacks run in the same zone * when those APIs are called. * * Consider the following examples: * * ```ts * const zone = Zone.current.fork({ * name: 'myZone' * }); * * zone.run(() => { * navigator.geolocation.getCurrentPosition(pos => { * console.log('navigator.getCurrentPosition() callback is invoked in the zone', * Zone.current.name); * // output is 'navigator.getCurrentPosition() callback is invoked in the zone myZone'. * } * }); * ``` * * If set you `__Zone_disable_geolocation = true` before importing `zone.js`, * `zone.js` does not monkey patch geolocation APIs and the above code * outputs 'getCurrentPosition '. * */ __Zone_disable_geolocation?: boolean; /** * Disable the monkey patch of the browser `canvas` APIs. * * By default, `zone.js` monkey patches `canvas` APIs to make callbacks run in the same zone * when those APIs are called. * * Consider the following example: * * ```ts * const zone = Zone.current.fork({ * name: 'myZone' * }); * * zone.run(() => { * canvas.toBlob(blog => { * console.log('canvas.toBlob() callback is invoked in the zone', Zone.current.name); * // output is 'canvas.toBlob() callback is invoked in the zone myZone'. * } * }); * ``` * * If you set `__Zone_disable_canvas = true` before importing `zone.js`, * `zone.js` does not monkey patch `canvas` APIs and the above code * outputs 'canvas.toBlob '. */ __Zone_disable_canvas?: boolean; /** * Disable the `Promise` monkey patch. * * By default, `zone.js` monkey patches `Promise` APIs to make the `then()/catch()` callbacks in * the same zone when those callbacks are called. * * Consider the following examples: * * ```ts * const zone = Zone.current.fork({name: 'myZone'}); * * const p = Promise.resolve(1); * * zone.run(() => { * p.then(() => { * console.log('then() callback is invoked in the zone', Zone.current.name); * // output is 'then() callback is invoked in the zone myZone'. * }); * }); * ``` * * If you set `__Zone_disable_ZoneAwarePromise = true` before importing `zone.js`, * `zone.js` does not monkey patch `Promise` APIs and the above code * outputs 'promise then callback '. */ __Zone_disable_ZoneAwarePromise?: boolean; /** * Define event names that users don't want monkey patched by the `zone.js`. * * By default, `zone.js` monkey patches EventTarget.addEventListener(). The event listener * callback runs in the same zone when the addEventListener() is called. * * Sometimes, you don't want all of the event names used in this patched version because it * impacts performance. For example, you might want `scroll` or `mousemove` event listeners to * run the native `addEventListener()` for better performance. * * Users can achieve this goal by defining `__zone_symbol__UNPATCHED_EVENTS = ['scroll', * 'mousemove'];` before importing `zone.js`. */ __zone_symbol__UNPATCHED_EVENTS?: string[]; /** * Define a list of `on` properties to be ignored when being monkey patched by the `zone.js`. * * By default, `zone.js` monkey patches `on` properties on inbuilt browser classes as * `WebSocket`, `XMLHttpRequest`, `Worker`, `HTMLElement` and others (see `patchTargets` in * `propertyDescriptorPatch`). `on` properties may be `WebSocket.prototype.onclose`, * `XMLHttpRequest.prototype.onload`, etc. * * Sometimes, we're not able to customise third-party libraries, which setup `on` listeners. * Given a library creates a `Websocket` and sets `socket.onmessage`, this will impact * performance if the `onmessage` property is set within the Angular zone, because this will * trigger change detection on any message coming through the socket. We can exclude specific * targets and their `on` properties from being patched by zone.js. * * Users can achieve this by defining `__Zone_ignore_on_properties`, it expects an array of * objects where `target` is the actual object `on` properties will be set on: * ``` * __Zone_ignore_on_properties = [ * { * target: WebSocket.prototype, * ignoreProperties: ['message', 'close', 'open'] * } * ]; * ``` * * In order to check whether `on` properties have been successfully ignored or not, it's enough * to open the console in the browser, run `WebSocket.prototype` and expand the object, we * should see the following: * ``` * { * __zone_symbol__ononclosepatched: true, * __zone_symbol__ononerrorpatched: true, * __zone_symbol__ononmessagepatched: true, * __zone_symbol__ononopenpatched: true * } * ``` * These `__zone_symbol__*` properties are set by zone.js when `on` properties have been patched * previously. When `__Zone_ignore_on_properties` is setup, we should not see those properties * on targets. */ __Zone_ignore_on_properties?: { target: any; ignoreProperties: string[]; }[]; /** * Define the event names of the passive listeners. * * To add passive event listeners, you can use `elem.addEventListener('scroll', listener, * {passive: true});` or implement your own `EventManagerPlugin`. * * You can also define a global variable as follows: * * ``` * __zone_symbol__PASSIVE_EVENTS = ['scroll']; * ``` * * The preceding code makes all scroll event listeners passive. */ __zone_symbol__PASSIVE_EVENTS?: string[]; /** * Disable wrapping uncaught promise rejection. * * By default, `zone.js` throws the original error occurs in the uncaught promise rejection. * * If you set `__zone_symbol__DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION = false;` before * importing `zone.js`, `zone.js` will wrap the uncaught promise rejection in a new `Error` * object which contains additional information such as a value of the rejection and a stack * trace. */ __zone_symbol__DISABLE_WRAPPING_UNCAUGHT_PROMISE_REJECTION?: boolean; /** * https://github.com/angular/angular/issues/47579 * * Enables the default `beforeunload` handling behavior, allowing the result of the event * handling invocation to be set on the event's `returnValue`. The browser may then prompt * the user with a string returned from the event handler. */ __zone_symbol__enable_beforeunload?: boolean; } /** * Interface of `zone-testing.js` test configurations. * * You can define the following configurations on the `window` or `global` object before * importing `zone-testing.js` to change `zone-testing.js` default behaviors in the test runner. */ interface ZoneTestConfigurations { /** * Disable the Jasmine integration. * * In the `zone-testing.js` bundle, by default, `zone-testing.js` monkey patches Jasmine APIs * to make Jasmine APIs run in specified zone. * * 1. Make the `describe()`/`xdescribe()`/`fdescribe()` methods run in the syncTestZone. * 2. Make the `it()`/`xit()`/`fit()`/`beforeEach()`/`afterEach()`/`beforeAll()`/`afterAll()` * methods run in the ProxyZone. * * With this patch, `async()`/`fakeAsync()` can work with the Jasmine runner. * * If you set `__Zone_disable_jasmine = true` before importing `zone-testing.js`, * `zone-testing.js` does not monkey patch the jasmine APIs and the `async()`/`fakeAsync()` * cannot work with the Jasmine runner any longer. */ __Zone_disable_jasmine?: boolean; /** * Disable the Mocha integration. * * In the `zone-testing.js` bundle, by default, `zone-testing.js` monkey patches the Mocha APIs * to make Mocha APIs run in the specified zone. * * 1. Make the `describe()`/`xdescribe()`/`fdescribe()` methods run in the syncTestZone. * 2. Make the `it()`/`xit()`/`fit()`/`beforeEach()`/`afterEach()`/`beforeAll()`/`afterAll()` * methods run in the ProxyZone. * * With this patch, `async()`/`fakeAsync()` can work with the Mocha runner. * * If you set `__Zone_disable_mocha = true` before importing `zone-testing.js`, * `zone-testing.js` does not monkey patch the Mocha APIs and the `async()/`fakeAsync()` can not * work with the Mocha runner any longer. */ __Zone_disable_mocha?: boolean; /** * Disable the Jest integration. * * In the `zone-testing.js` bundle, by default, `zone-testing.js` monkey patches Jest APIs * to make Jest APIs run in the specified zone. * * 1. Make the `describe()`/`xdescribe()`/`fdescribe()` methods run in the syncTestZone. * 2. Make the `it()`/`xit()`/`fit()`/`beforeEach()`/`afterEach()`/`before()`/`after()` methods * run in the ProxyZone. * * With this patch, `async()`/`fakeAsync()` can work with the Jest runner. * * If you set `__Zone_disable_jest = true` before importing `zone-testing.js`, * `zone-testing.js` does not monkey patch the jest APIs and `async()`/`fakeAsync()` cannot * work with the Jest runner any longer. */ __Zone_disable_jest?: boolean; /** * Disable monkey patch the jasmine clock APIs. * * By default, `zone-testing.js` monkey patches the `jasmine.clock()` API, * so the `jasmine.clock()` can work with the `fakeAsync()/tick()` API. * * Consider the following example: * * ```ts * describe('jasmine.clock integration', () => { * beforeEach(() => { * jasmine.clock().install(); * }); * afterEach(() => { * jasmine.clock().uninstall(); * }); * it('fakeAsync test', fakeAsync(() => { * setTimeout(spy, 100); * expect(spy).not.toHaveBeenCalled(); * jasmine.clock().tick(100); * expect(spy).toHaveBeenCalled(); * })); * }); * ``` * * In the `fakeAsync()` method, `jasmine.clock().tick()` works just like `tick()`. * * If you set `__zone_symbol__fakeAsyncDisablePatchingClock = true` before importing * `zone-testing.js`,`zone-testing.js` does not monkey patch the `jasmine.clock()` APIs and the * `jasmine.clock()` cannot work with `fakeAsync()` any longer. */ __zone_symbol__fakeAsyncDisablePatchingClock?: boolean; /** * Enable auto running into `fakeAsync()` when installing the `jasmine.clock()`. * * By default, `zone-testing.js` does not automatically run into `fakeAsync()` * if the `jasmine.clock().install()` is called. * * Consider the following example: * * ```ts * describe('jasmine.clock integration', () => { * beforeEach(() => { * jasmine.clock().install(); * }); * afterEach(() => { * jasmine.clock().uninstall(); * }); * it('fakeAsync test', fakeAsync(() => { * setTimeout(spy, 100); * expect(spy).not.toHaveBeenCalled(); * jasmine.clock().tick(100); * expect(spy).toHaveBeenCalled(); * })); * }); * ``` * * You must run `fakeAsync()` to make test cases in the `FakeAsyncTestZone`. * * If you set `__zone_symbol__fakeAsyncAutoFakeAsyncWhenClockPatched = true` before importing * `zone-testing.js`, `zone-testing.js` can run test case automatically in the * `FakeAsyncTestZone` without calling the `fakeAsync()`. * * Consider the following example: * * ```ts * describe('jasmine.clock integration', () => { * beforeEach(() => { * jasmine.clock().install(); * }); * afterEach(() => { * jasmine.clock().uninstall(); * }); * it('fakeAsync test', () => { // here we don't need to call fakeAsync * setTimeout(spy, 100); * expect(spy).not.toHaveBeenCalled(); * jasmine.clock().tick(100); * expect(spy).toHaveBeenCalled(); * }); * }); * ``` * */ __zone_symbol__fakeAsyncAutoFakeAsyncWhenClockPatched?: boolean; /** * Enable waiting for the unresolved promise in the `async()` test. * * In the `async()` test, `AsyncTestZone` waits for all the asynchronous tasks to finish. By * default, if some promises remain unresolved, `AsyncTestZone` does not wait and reports that * it received an unexpected result. * * Consider the following example: * * ```ts * describe('wait never resolved promise', () => { * it('async with never resolved promise test', async(() => { * const p = new Promise(() => {}); * p.then(() => { * // do some expectation. * }); * })) * }); * ``` * * By default, this case passes, because the callback of `p.then()` is never called. Because `p` * is an unresolved promise, there is no pending asynchronous task, which means the `async()` * method does not wait. * * If you set `__zone_symbol__supportWaitUnResolvedChainedPromise = true`, the above case * times out, because `async()` will wait for the unresolved promise. */ __zone_symbol__supportWaitUnResolvedChainedPromise?: boolean; } /** * The interface of the `zone.js` runtime configurations. * * These configurations can be defined on the `Zone` object after * importing zone.js to change behaviors. The differences between * the `ZoneRuntimeConfigurations` and the `ZoneGlobalConfigurations` are, * * 1. `ZoneGlobalConfigurations` must be defined on the `global/window` object before importing * `zone.js`. The value of the configuration cannot be changed at runtime. * * 2. `ZoneRuntimeConfigurations` must be defined on the `Zone` object after importing `zone.js`. * You can change the value of this configuration at runtime. * */ interface ZoneRuntimeConfigurations { /** * Ignore outputting errors to the console when uncaught Promise errors occur. * * By default, if an uncaught Promise error occurs, `zone.js` outputs the * error to the console by calling `console.error()`. * * If you set `__zone_symbol__ignoreConsoleErrorUncaughtError = true`, `zone.js` does not output * the uncaught error to `console.error()`. */ __zone_symbol__ignoreConsoleErrorUncaughtError?: boolean; } } export {}; ֠kcx5/** * @license * Copyright Google LLC All Rights Reserved. * * Use of this source code is governed by an MIT-style license that can be * found in the LICENSE file at https://angular.dev/license */ import { EventTask as _EventTask, HasTaskState as _HasTaskState, MacroTask as _MacroTask, MicroTask as _MicroTask, PatchFn, Task as _Task, TaskData as _TaskData, TaskState as _TaskState, TaskType as _TaskType, UncaughtPromiseError as _UncaughtPromiseError, Zone as _Zone, ZoneDelegate as _ZoneDelegate, ZoneFrame, ZonePrivate, ZoneSpec as _ZoneSpec, ZoneType as _ZoneType } from './zone-impl'; declare global { const Zone: ZoneType; type Zone = _Zone; type ZoneType = _ZoneType; type _PatchFn = PatchFn; type _ZonePrivate = ZonePrivate; type _ZoneFrame = ZoneFrame; type UncaughtPromiseError = _UncaughtPromiseError; type ZoneSpec = _ZoneSpec; type ZoneDelegate = _ZoneDelegate; type HasTaskState = _HasTaskState; type TaskType = _TaskType; type TaskState = _TaskState; type TaskData = _TaskData; type Task = _Task; type MicroTask = _MicroTask; type MacroTask = _MacroTask; type EventTask = _EventTask; /** * Extend the Error with additional fields for rewritten stack frames */ interface Error { /** * Stack trace where extra frames have been removed and zone names added. */ zoneAwareStack?: string; /** * Original stack trace with no modifications */ originalStack?: string; } } export declare function loadZone(): ZoneType; >պxu{ "name": "zone.js", "version": "0.15.1", "description": "Zones for JavaScript", "main": "./bundles/zone.umd.js", "module": "./fesm2015/zone.js", "es2015": "./fesm2015/zone.js", "fesm2015": "./fesm2015/zone.js", "typings": "./zone.d.ts", "devDependencies": { "@externs/nodejs": "^1.5.0", "@types/node": "^10.9.4", "domino": "https://github.com/angular/domino.git#93e720f143d0296dd2726ffbcf4fc12283363a7b", "google-closure-compiler": "^20250519.0.0", "jest": "^29.0", "jest-environment-jsdom": "^29.0.3", "jest-environment-node": "^29.0.3", "mocha": "^11.0.0", "mock-require": "3.0.3", "tslib": "^2.3.0", "vitest": "^3.1.3" }, "scripts": { "electrontest": "cd test/extra && node electron.js", "jest:test": "jest --config ./test/jest/jest.config.js ./test/jest/jest.spec.js", "jest:nodetest": "jest --config ./test/jest/jest.node.config.js ./test/jest/jest.spec.js", "vitest:test": "vitest ./test/vitest/vitest.spec.js", "promisefinallytest": "mocha ./test/promise/promise.finally.spec.mjs" }, "repository": { "type": "git", "url": "git://github.com/angular/angular.git", "directory": "packages/zone.js" }, "publishConfig": { "registry": "https://wombat-dressing-room.appspot.com" }, "author": "Brian Ford", "license": "MIT", "bugs": { "url": "https://github.com/angular/angular/issues" }, "exports": { "./package.json": { "default": "./package.json" }, ".": { "types": "./zone.d.ts", "require": "./bundles/zone.umd.js", "default": "./fesm2015/zone.js" }, "./testing": { "require": "./bundles/zone-testing.umd.js", "default": "./fesm2015/zone-testing.js" }, "./node": { "require": "./bundles/zone-node.umd.js", "default": "./fesm2015/zone-node.js" }, "./mix": { "require": "./bundles/zone-mix.umd.js", "default": "./fesm2015/zone-mix.js" }, "./plugins/*.min": { "require": "./bundles/*.umd.min.js", "default": "./fesm2015/*.min.js" }, "./plugins/*": { "require": "./bundles/*.umd.js", "default": "./fesm2015/*.js" } } } >y`xaimport './lib/zone'; import './lib/zone.api.extensions'; import './lib/zone.configurations.api'; k!+xE%40000 componentsN z] Y4%4QHc`3D'mѲxM@use '../../../../../ui-design-system/src/styles/semantic/index' as *; // Code block component styles with design token integration .code-block { position: relative; width: 100%; font-family: 'Roboto Mono', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace; font-size: $base-typography-font-size-sm; background: var(--code-bg, #{$semantic-color-surface-primary}); // Variant styles &--default { border: $semantic-border-card-width $semantic-border-card-style var(--code-border, #{$semantic-color-border-secondary}); border-radius: $semantic-border-card-radius; overflow: hidden; } &--minimal { border: none; border-radius: 0; } &--bordered { border-left: 4px solid var(--code-keyword, #{$semantic-color-brand-primary}); padding-left: $semantic-spacing-component-md; } // Wrapping variant &--wrap { .code-block__code { white-space: pre-wrap; word-break: break-word; } } // Copyable variant &--copyable { &:hover .code-block__copy-btn { opacity: 1; } } } .code-block__copy-btn { position: absolute; top: $semantic-spacing-component-sm; right: $semantic-spacing-component-sm; display: flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; padding: 0; border: none; background: var(--code-surface, #{$semantic-color-surface-secondary}); color: var(--code-text, #{$semantic-color-text-secondary}); border-radius: $semantic-border-button-radius; cursor: pointer; transition: all $semantic-duration-fast $semantic-easing-standard; opacity: 0; z-index: 1; &:hover { background: var(--code-border, #{$semantic-color-surface-elevated}); color: var(--code-text, #{$semantic-color-text-primary}); } &:active { transform: scale(0.95); } &:focus-visible { opacity: 1; outline: $semantic-border-focus-width solid var(--code-keyword, #{$semantic-color-focus}); outline-offset: 2px; } } .code-block__pre { margin: 0; padding: $semantic-spacing-component-md; background: transparent; overflow-x: auto; font-family: inherit; font-size: inherit; line-height: $base-typography-line-height-relaxed; display: flex; &--with-line-numbers { .code-block__code { padding-left: $semantic-spacing-component-md; } } .code-block--minimal & { padding: 0; } .code-block--bordered & { padding-left: 0; } } // Line numbers .code-block__line-numbers { display: flex; flex-direction: column; padding-right: $semantic-spacing-component-md; border-right: $semantic-border-separator-width $semantic-border-separator-style var(--code-border, #{$semantic-color-border-subtle}); user-select: none; min-width: 3ch; text-align: right; flex-shrink: 0; } .code-block__line-number { color: var(--code-line-number, #{$semantic-color-text-tertiary}); font-size: inherit; line-height: inherit; padding: 0 $semantic-spacing-component-xs; &--highlighted { background: var(--code-line-highlight, #{$semantic-color-container-primary}); color: var(--code-text, #{$semantic-color-text-primary}); } } // Code content .code-block__code { display: block; padding: 0; margin: 0; background: transparent; color: var(--code-text, #{$semantic-color-text-primary}); font-family: inherit; font-size: inherit; line-height: inherit; white-space: pre; overflow: visible; flex: 1; min-width: 0; // Syntax highlighting styles .token.comment, .token.prolog, .token.doctype, .token.cdata { color: var(--code-comment, #{$semantic-color-text-tertiary}); font-style: italic; } .token.keyword, .token.control, .token.directive, .token.unit { color: var(--code-keyword, #{$semantic-color-brand-primary}); font-weight: $base-typography-font-weight-medium; } .token.string, .token.attr-value { color: var(--code-string, #{$semantic-color-success}); } .token.number { color: var(--code-number, #{$semantic-color-warning}); } .token.function, .token.class-name { color: var(--code-function, #{$semantic-color-interactive-primary}); } .token.operator, .token.entity, .token.url { color: var(--code-operator, #{$semantic-color-text-primary}); } .token.punctuation { color: var(--code-punctuation, #{$semantic-color-text-secondary}); } .token.variable { color: var(--code-variable, #{$semantic-color-text-primary}); } .token.boolean, .token.constant { color: var(--code-keyword, #{$semantic-color-brand-primary}); } .token.property, .token.attr-name { color: var(--code-function, #{$semantic-color-interactive-primary}); } .token.selector, .token.tag { color: var(--code-keyword, #{$semantic-color-brand-primary}); } .token.important { font-weight: $base-typography-font-weight-bold; } .token.bold { font-weight: $base-typography-font-weight-bold; } .token.italic { font-style: italic; } } // Responsive adjustments @media (max-width: 768px) { .code-block__pre { padding: $semantic-spacing-component-sm; } .code-block__copy-btn { top: $semantic-spacing-component-xs; right: $semantic-spacing-component-xs; } }F*@xۤ٩PtFL`F?AF0#7 ex\import { Component, Input, computed, signal, ChangeDetectionStrategy, ViewEncapsulation, OnInit, OnChanges, SimpleChanges } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SyntaxHighlighterService } from '../../services/syntax-highlighter.service'; import { CodeThemeService, CodeTheme } from '../../services/theme.service'; import { CopyButtonDirective } from '../../directives/copy-button.directive'; export type CodeBlockVariant = 'default' | 'minimal' | 'bordered'; @Component({ selector: 'ui-code-block', standalone: true, imports: [CommonModule, CopyButtonDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (copyable) { } 
            @if (showLineNumbers && lineCount() > 1) {
          
    
            @for (lineNum of lineNumbers(); track lineNum) {
              
                {{ lineNum }}
              
            }
          
    
        }
    `, styleUrl: './code-block.component.scss' }) export class CodeBlockComponent implements OnInit, OnChanges { @Input() code = ''; @Input() language = ''; @Input() theme: CodeTheme | null = null; @Input() variant: CodeBlockVariant = 'default'; @Input() showLineNumbers = true; @Input() copyable = true; @Input() highlightLines: (number | string)[] = []; @Input() startLineNumber = 1; @Input() wrap = false; constructor( private syntaxHighlighter: SyntaxHighlighterService, private themeService: CodeThemeService ) {} readonly finalLanguage = computed(() => { if (this.language) { return this.language; } return this.syntaxHighlighter.detectLanguage(this.code); }); readonly highlightedCode = signal(''); private async updateHighlightedCode() { if (!this.code) { this.highlightedCode.set(''); return; } const lang = this.finalLanguage(); try { const highlighted = await this.syntaxHighlighter.highlight(this.code, { language: lang, lineNumbers: this.showLineNumbers, highlightLines: this.highlightLines }); this.highlightedCode.set(highlighted); } catch (error) { console.warn('Failed to highlight code:', error); this.highlightedCode.set(this.escapeHtml(this.code)); } } readonly lineCount = computed(() => { return this.code ? this.code.split('\n').length : 0; }); readonly lineNumbers = computed(() => { const count = this.lineCount(); return Array.from({ length: count }, (_, i) => i + this.startLineNumber); }); readonly currentTheme = computed(() => { return this.theme || this.themeService.theme(); }); readonly containerClasses = computed(() => { const classes = ['code-block']; classes.push(`code-block--${this.variant}`); classes.push(`code-theme-${this.currentTheme()}`); if (this.wrap) classes.push('code-block--wrap'); if (this.copyable) classes.push('code-block--copyable'); return classes.join(' '); }); readonly preClasses = computed(() => { const classes = ['code-block__pre']; if (this.showLineNumbers && this.lineCount() > 1) { classes.push('code-block__pre--with-line-numbers'); } return classes.join(' '); }); readonly codeClasses = computed(() => { const classes = ['code-block__code']; classes.push(`language-${this.finalLanguage()}`); return classes.join(' '); }); isLineHighlighted(lineNumber: number): boolean { return this.highlightLines.some(highlight => { if (typeof highlight === 'number') { return highlight === lineNumber; } // Handle range format like "5-10" const range = highlight.toString().split('-'); if (range.length === 2) { const start = parseInt(range[0], 10); const end = parseInt(range[1], 10); return lineNumber >= start && lineNumber <= end; } return false; }); } ngOnInit(): void { this.updateHighlightedCode(); } ngOnChanges(changes: SimpleChanges): void { if (changes['code'] || changes['language']) { this.updateHighlightedCode(); } } private escapeHtml(text: string): string { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } }WR3jx$(*divdivif (!this.code) return 0; const lines = this.code.split('\n'); // Remove the last empty line if the code ends with a newline if (lines.length > 1 && lines[lines.length - 1] === '') { return lines.length - 1; } return lines.length x%O\x)@use '../../../../../ui-design-system/src/styles/semantic/index' as *; // Code snippet component styles with design token integration .code-snippet { position: relative; width: 100%; border-radius: $semantic-border-card-radius; border: $semantic-border-card-width $semantic-border-card-style var(--code-border, #{$semantic-color-border-secondary}); background: var(--code-bg, #{$semantic-color-surface-primary}); overflow: hidden; font-family: 'Roboto Mono', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace; // Size variants &--sm { font-size: $base-typography-font-size-xs; .code-snippet__header { padding: $semantic-spacing-component-padding-xs $semantic-spacing-component-padding-sm; gap: $semantic-spacing-component-xs; } .code-snippet__content { padding: $semantic-spacing-component-padding-xs $semantic-spacing-component-padding-sm; } } &--md { font-size: $base-typography-font-size-sm; .code-snippet__header { padding: $semantic-spacing-component-padding-sm $semantic-spacing-component-padding-md; gap: $semantic-spacing-component-sm; } .code-snippet__content { padding: $semantic-spacing-component-padding-sm $semantic-spacing-component-padding-md; } } &--lg { font-size: $base-typography-font-size-md; .code-snippet__header { padding: $semantic-spacing-component-padding-md $semantic-spacing-component-padding-lg; gap: $semantic-spacing-component-md; } .code-snippet__content { padding: $semantic-spacing-component-padding-md $semantic-spacing-component-padding-lg; } } // Wrapping variant &--wrap { .code-snippet__code { white-space: pre-wrap; word-break: break-word; } } // Constrained height variant &--constrained { .code-snippet__content { max-height: var(--max-height); overflow: hidden; position: relative; &::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: $semantic-spacing-component-xl; background: linear-gradient(to bottom, transparent, var(--code-bg, #{$semantic-color-surface-primary})); pointer-events: none; } } } } // Header section .code-snippet__header { display: flex; align-items: center; justify-content: space-between; background: var(--code-surface, #{$semantic-color-surface-secondary}); border-bottom: $semantic-border-divider-width $semantic-border-divider-style var(--code-border, #{$semantic-color-border-secondary}); color: var(--code-text, #{$semantic-color-text-primary}); } .code-snippet__title { font-weight: $base-typography-font-weight-medium; color: var(--code-text, #{$semantic-color-text-primary}); } .code-snippet__actions { display: flex; align-items: center; gap: $semantic-spacing-component-sm; } .code-snippet__language-badge { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; background: var(--code-keyword, #{$semantic-color-interactive-primary}); color: white; border-radius: $semantic-border-input-radius; font-size: $base-typography-font-size-xs; font-weight: $base-typography-font-weight-medium; text-transform: uppercase; letter-spacing: 0.05em; } .code-snippet__copy-btn { display: flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; padding: 0; border: none; background: transparent; color: var(--code-text, #{$semantic-color-text-secondary}); border-radius: $semantic-border-button-radius; cursor: pointer; transition: all $semantic-duration-fast $semantic-easing-standard; &:hover { background: var(--code-surface, #{$semantic-color-surface-elevated}); color: var(--code-text, #{$semantic-color-text-primary}); } &:active { transform: scale(0.95); } &:focus-visible { outline: $semantic-border-focus-width solid var(--code-keyword, #{$semantic-color-focus}); outline-offset: 2px; } } // Content area .code-snippet__content { position: relative; overflow-x: auto; background: var(--code-bg, #{$semantic-color-surface-primary}); } .code-snippet__pre { margin: 0; padding: 0; background: transparent; overflow: visible; font-family: inherit; font-size: inherit; line-height: $base-typography-line-height-relaxed; display: flex; &--with-line-numbers { .code-snippet__code { padding-left: $semantic-spacing-component-md; } } } // Line numbers .code-snippet__line-numbers { display: flex; flex-direction: column; padding-right: $semantic-spacing-component-md; border-right: $semantic-border-separator-width $semantic-border-separator-style var(--code-border, #{$semantic-color-border-subtle}); user-select: none; min-width: 3ch; text-align: right; } .code-snippet__line-number { color: var(--code-line-number, #{$semantic-color-text-tertiary}); font-size: inherit; line-height: inherit; padding: 0 $semantic-spacing-component-xs; &--highlighted { background: var(--code-line-highlight, #{$semantic-color-container-primary}); color: var(--code-text, #{$semantic-color-text-primary}); } } // Code content .code-snippet__code { display: block; padding: 0; margin: 0; background: transparent; color: var(--code-text, #{$semantic-color-text-primary}); font-family: inherit; font-size: inherit; line-height: inherit; white-space: pre; overflow: visible; flex: 1; // Syntax highlighting styles .token.comment, .token.prolog, .token.doctype, .token.cdata { color: var(--code-comment, #{$semantic-color-text-tertiary}); font-style: italic; } .token.keyword, .token.control, .token.directive, .token.unit { color: var(--code-keyword, #{$semantic-color-brand-primary}); font-weight: $base-typography-font-weight-medium; } .token.string, .token.attr-value { color: var(--code-string, #{$semantic-color-success}); } .token.number { color: var(--code-number, #{$semantic-color-warning}); } .token.function, .token.class-name { color: var(--code-function, #{$semantic-color-interactive-primary}); } .token.operator, .token.entity, .token.url { color: var(--code-operator, #{$semantic-color-text-primary}); } .token.punctuation { color: var(--code-punctuation, #{$semantic-color-text-secondary}); } .token.variable { color: var(--code-variable, #{$semantic-color-text-primary}); } .token.boolean, .token.constant { color: var(--code-keyword, #{$semantic-color-brand-primary}); } .token.property, .token.attr-name { color: var(--code-function, #{$semantic-color-interactive-primary}); } .token.selector, .token.tag { color: var(--code-keyword, #{$semantic-color-brand-primary}); } } // Expand section .code-snippet__expand { display: flex; justify-content: center; padding: $semantic-spacing-component-sm; background: var(--code-surface, #{$semantic-color-surface-secondary}); border-top: $semantic-border-separator-width $semantic-border-separator-style var(--code-border, #{$semantic-color-border-secondary}); } .code-snippet__expand-btn { padding: $semantic-spacing-component-xs $semantic-spacing-component-md; border: $semantic-border-button-width $semantic-border-button-style var(--code-border, #{$semantic-color-border-primary}); border-radius: $semantic-border-button-radius; background: var(--code-bg, #{$semantic-color-surface-primary}); color: var(--code-text, #{$semantic-color-text-primary}); font-size: $base-typography-font-size-sm; cursor: pointer; transition: all $semantic-duration-fast $semantic-easing-standard; &:hover { background: var(--code-surface, #{$semantic-color-surface-elevated}); } &:focus-visible { outline: $semantic-border-focus-width solid var(--code-keyword, #{$semantic-color-focus}); outline-offset: 2px; } } // Theme-specific overrides .code-theme-github-light { --code-bg: #{$semantic-color-surface-primary}; --code-surface: #{$semantic-color-surface-secondary}; --code-text: #{$semantic-color-text-primary}; --code-comment: #{$semantic-color-text-tertiary}; --code-keyword: #{$semantic-color-brand-primary}; --code-string: #{$semantic-color-success}; --code-number: #{$semantic-color-warning}; --code-function: #{$semantic-color-interactive-primary}; --code-operator: #{$semantic-color-text-primary}; --code-punctuation: #{$semantic-color-text-secondary}; --code-variable: #{$semantic-color-text-primary}; --code-line-number: #{$semantic-color-text-tertiary}; --code-line-highlight: #{$semantic-color-container-primary}; --code-border: #{$semantic-color-border-secondary}; } .code-theme-github-dark { --code-bg: #0d1117; --code-surface: #161b22; --code-text: #f0f6fc; --code-comment: #8b949e; --code-keyword: #ff7b72; --code-string: #a5d6ff; --code-number: #79c0ff; --code-function: #d2a8ff; --code-operator: #f0f6fc; --code-punctuation: #c9d1d9; --code-variable: #f0f6fc; --code-line-number: #8b949e; --code-line-highlight: rgba(255, 211, 61, 0.08); --code-border: #30363d; } .code-theme-one-dark { --code-bg: #282c34; --code-surface: #3e4451; --code-text: #abb2bf; --code-comment: #5c6370; --code-keyword: #c678dd; --code-string: #98c379; --code-number: #d19a66; --code-function: #61afef; --code-operator: #abb2bf; --code-punctuation: #abb2bf; --code-variable: #e06c75; --code-line-number: #5c6370; --code-line-highlight: #3e4451; --code-border: #3e4451; } .code-theme-material { --code-bg: #263238; --code-surface: #37474f; --code-text: #eeffff; --code-comment: #546e7a; --code-keyword: #c792ea; --code-string: #c3e88d; --code-number: #f78c6c; --code-function: #82aaff; --code-operator: #89ddff; --code-punctuation: #89ddff; --code-variable: #eeffff; --code-line-number: #546e7a; --code-line-highlight: #37474f; --code-border: #37474f; } .code-theme-dracula { --code-bg: #282a36; --code-surface: #44475a; --code-text: #f8f8f2; --code-comment: #6272a4; --code-keyword: #ff79c6; --code-string: #f1fa8c; --code-number: #bd93f9; --code-function: #8be9fd; --code-operator: #ff79c6; --code-punctuation: #f8f8f2; --code-variable: #f8f8f2; --code-line-number: #6272a4; --code-line-highlight: #44475a; --code-border: #44475a; }ʊDxkzAKPz!d%O8xvimport { Component, Input, Output, EventEmitter, computed, signal, ChangeDetectionStrategy, ViewEncapsulation, OnInit, OnChanges, SimpleChanges } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SyntaxHighlighterService } from '../../services/syntax-highlighter.service'; import { CodeThemeService, CodeTheme } from '../../services/theme.service'; import { CopyButtonDirective } from '../../directives/copy-button.directive'; export type CodeSnippetSize = 'sm' | 'md' | 'lg'; @Component({ selector: 'ui-code-snippet', standalone: true, imports: [CommonModule, CopyButtonDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (title || showLanguage || copyable) {
    @if (title) { {{ title }} }
    @if (showLanguage && finalLanguage()) { {{ finalLanguage() }} } @if (copyable) { }
    } 
              @if (showLineNumbers && lineCount() > 1) {
            
    
              @for (lineNum of lineNumbers(); track lineNum) {
                
                  {{ lineNum }}
                
              }
            
    
          }
    @if (maxHeight && !expanded() && isOverflowing()) {
    }
    `, styleUrl: './code-snippet.component.scss' }) export class CodeSnippetComponent implements OnInit, OnChanges { @Input() code = ''; @Input() language = ''; @Input() title = ''; @Input() theme: CodeTheme | null = null; @Input() size: CodeSnippetSize = 'md'; @Input() showLineNumbers = false; @Input() copyable = true; @Input() showLanguage = true; @Input() highlightLines: (number | string)[] = []; @Input() maxHeight: string | null = null; @Input() wrap = false; @Input() startLineNumber = 1; @Output() codeChange = new EventEmitter(); @Output() languageChange = new EventEmitter(); readonly expanded = signal(false); constructor( private syntaxHighlighter: SyntaxHighlighterService, private themeService: CodeThemeService ) {} readonly finalLanguage = computed(() => { if (this.language) { return this.language; } return this.syntaxHighlighter.detectLanguage(this.code); }); readonly highlightedCode = signal(''); private async updateHighlightedCode() { if (!this.code) { this.highlightedCode.set(''); return; } const lang = this.finalLanguage(); try { const highlighted = await this.syntaxHighlighter.highlight(this.code, { language: lang, lineNumbers: this.showLineNumbers, highlightLines: this.highlightLines }); this.highlightedCode.set(highlighted); } catch (error) { console.warn('Failed to highlight code:', error); this.highlightedCode.set(this.escapeHtml(this.code)); } } readonly lineCount = computed(() => { return this.code ? this.code.split('\n').length : 0; }); readonly lineNumbers = computed(() => { const count = this.lineCount(); return Array.from({ length: count }, (_, i) => i + this.startLineNumber); }); readonly currentTheme = computed(() => { return this.theme || this.themeService.theme(); }); readonly containerClasses = computed(() => { const classes = ['code-snippet']; classes.push(`code-snippet--${this.size}`); classes.push(`code-theme-${this.currentTheme()}`); if (this.wrap) classes.push('code-snippet--wrap'); if (this.maxHeight && !this.expanded()) classes.push('code-snippet--constrained'); return classes.join(' '); }); readonly preClasses = computed(() => { const classes = ['code-snippet__pre']; if (this.showLineNumbers && this.lineCount() > 1) { classes.push('code-snippet__pre--with-line-numbers'); } return classes.join(' '); }); readonly codeClasses = computed(() => { const classes = ['code-snippet__code']; classes.push(`language-${this.finalLanguage()}`); return classes.join(' '); }); isLineHighlighted(lineNumber: number): boolean { return this.highlightLines.some(highlight => { if (typeof highlight === 'number') { return highlight === lineNumber; } // Handle range format like "5-10" const range = highlight.toString().split('-'); if (range.length === 2) { const start = parseInt(range[0], 10); const end = parseInt(range[1], 10); return lineNumber >= start && lineNumber <= end; } return false; }); } isOverflowing(): boolean { // This would need to be implemented with ViewChild and element measurements // For now, return true if content is long return this.lineCount() > 20; } toggleExpanded(): void { this.expanded.update(val => !val); } ngOnInit(): void { this.updateHighlightedCode(); } ngOnChanges(changes: SimpleChanges): void { if (changes['code'] || changes['language']) { this.updateHighlightedCode(); } } private escapeHtml(text: string): string { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } }$xA@use '../../../../../ui-design-system/src/styles/semantic/index' as *; // Inline code component styles with design token integration .inline-code { position: relative; display: inline-flex; align-items: center; gap: $semantic-spacing-component-xs; background: var(--code-surface, #{$semantic-color-surface-secondary}); border: $semantic-border-input-width $semantic-border-input-style var(--code-border, #{$semantic-color-border-secondary}); border-radius: $semantic-border-input-radius; font-family: 'Roboto Mono', 'Monaco', 'Consolas', 'Liberation Mono', 'Courier New', monospace; // Size variants &--xs { padding: $semantic-spacing-component-xs; font-size: $base-typography-font-size-xs; } &--sm { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; font-size: $base-typography-font-size-sm; } &--md { padding: $semantic-spacing-component-sm; font-size: $base-typography-font-size-sm; } &--lg { padding: $semantic-spacing-component-sm $semantic-spacing-component-md; font-size: $base-typography-font-size-md; } // Copyable variant &--copyable { padding-right: calc(#{$semantic-spacing-component-sm} + 1.5rem + #{$semantic-spacing-component-xs}); } } .inline-code__code { display: inline; padding: 0; margin: 0; background: transparent; border: none; color: var(--code-text, #{$semantic-color-text-primary}); font-family: inherit; font-size: inherit; line-height: 1.2; white-space: nowrap; // Syntax highlighting styles (simplified for inline use) .token.comment { color: var(--code-comment, #{$semantic-color-text-tertiary}); font-style: italic; } .token.keyword { color: var(--code-keyword, #{$semantic-color-brand-primary}); font-weight: $base-typography-font-weight-medium; } .token.string { color: var(--code-string, #{$semantic-color-success}); } .token.number { color: var(--code-number, #{$semantic-color-warning}); } .token.function { color: var(--code-function, #{$semantic-color-interactive-primary}); } .token.operator { color: var(--code-operator, #{$semantic-color-text-primary}); } .token.punctuation { color: var(--code-punctuation, #{$semantic-color-text-secondary}); } .token.variable { color: var(--code-variable, #{$semantic-color-text-primary}); } .token.boolean, .token.constant { color: var(--code-keyword, #{$semantic-color-brand-primary}); } } .inline-code__copy-btn { position: absolute; right: $semantic-spacing-component-xs; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem; padding: 0; border: none; background: transparent; color: var(--code-comment, #{$semantic-color-text-tertiary}); border-radius: calc(#{$semantic-border-button-radius} * 0.5); cursor: pointer; transition: all $semantic-duration-fast $semantic-easing-standard; opacity: 0; .inline-code:hover & { opacity: 1; } &:hover { background: var(--code-bg, #{$semantic-color-surface-primary}); color: var(--code-text, #{$semantic-color-text-primary}); } &:active { transform: translateY(-50%) scale(0.9); } &:focus-visible { opacity: 1; outline: 1px solid var(--code-keyword, #{$semantic-color-focus}); outline-offset: 1px; } svg { width: 10px; height: 10px; } } // Theme inheritance from parent .inline-code { // Themes are handled by parent code-theme- classes // or can be applied directly to inline-code elements }[x Aimport { Component, Input, computed, signal, ChangeDetectionStrategy, ViewEncapsulation, OnInit, OnChanges, SimpleChanges } from '@angular/core'; import { CommonModule } from '@angular/common'; import { SyntaxHighlighterService } from '../../services/syntax-highlighter.service'; import { CodeThemeService, CodeTheme } from '../../services/theme.service'; import { CopyButtonDirective } from '../../directives/copy-button.directive'; export type InlineCodeSize = 'xs' | 'sm' | 'md' | 'lg'; @Component({ selector: 'ui-inline-code', standalone: true, imports: [CommonModule, CopyButtonDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: ` @if (copyable) { } `, styleUrl: './inline-code.component.scss' }) export class InlineCodeComponent implements OnInit, OnChanges { @Input() code = ''; @Input() language = ''; @Input() theme: CodeTheme | null = null; @Input() size: InlineCodeSize = 'md'; @Input() copyable = false; constructor( private syntaxHighlighter: SyntaxHighlighterService, private themeService: CodeThemeService ) {} readonly finalLanguage = computed(() => { if (this.language) { return this.language; } // For inline code, we're more conservative with auto-detection return 'text'; }); readonly highlightedCode = signal(''); private async updateHighlightedCode() { if (!this.code) { this.highlightedCode.set(''); return; } const lang = this.finalLanguage(); if (lang === 'text') { this.highlightedCode.set(this.escapeHtml(this.code)); return; } try { const highlighted = await this.syntaxHighlighter.highlight(this.code, { language: lang }); this.highlightedCode.set(highlighted); } catch (error) { console.warn('Failed to highlight code:', error); this.highlightedCode.set(this.escapeHtml(this.code)); } } readonly currentTheme = computed(() => { return this.theme || this.themeService.theme(); }); readonly containerClasses = computed(() => { const classes = ['inline-code']; classes.push(`inline-code--${this.size}`); classes.push(`code-theme-${this.currentTheme()}`); if (this.copyable) classes.push('inline-code--copyable'); return classes.join(' '); }); readonly codeClasses = computed(() => { const classes = ['inline-code__code']; classes.push(`language-${this.finalLanguage()}`); return classes.join(' '); }); ngOnInit(): void { this.updateHighlightedCode(); } ngOnChanges(changes: SimpleChanges): void { if (changes['code'] || changes['language']) { this.updateHighlightedCode(); } } private escapeHtml(text: string): string { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } } Tx=import { Directive, Input, HostListener, inject, signal } from '@angular/core'; @Directive({ selector: '[uiCopyButton]', standalone: true }) export class CopyButtonDirective { @Input() uiCopyButton!: string; @Input() copySuccessMessage = 'Copied!'; @Input() copyErrorMessage = 'Failed to copy'; private copied = signal(false); private timeoutId: number | null = null; @HostListener('click', ['$event']) async onClick(event: Event): Promise { event.preventDefault(); event.stopPropagation(); if (!this.uiCopyButton) { console.warn('No content provided to copy'); return; } try { await this.copyToClipboard(this.uiCopyButton); this.showFeedback(true); } catch (error) { console.error('Failed to copy to clipboard:', error); this.showFeedback(false); } } private async copyToClipboard(text: string): Promise { if (navigator.clipboard && window.isSecureContext) { // Use modern clipboard API await navigator.clipboard.writeText(text); } else { // Fallback for older browsers or non-secure contexts this.fallbackCopyToClipboard(text); } } private fallbackCopyToClipboard(text: string): void { const textArea = document.createElement('textarea'); textArea.value = text; textArea.style.position = 'fixed'; textArea.style.left = '-999999px'; textArea.style.top = '-999999px'; document.body.appendChild(textArea); textArea.focus(); textArea.select(); try { document.execCommand('copy'); } catch (error) { throw new Error('Fallback copy failed'); } finally { document.body.removeChild(textArea); } } private showFeedback(success: boolean): void { this.copied.set(success); // Clear existing timeout if (this.timeoutId) { clearTimeout(this.timeoutId); } // Reset after 2 seconds this.timeoutId = window.setTimeout(() => { this.copied.set(false); this.timeoutId = null; }, 2000); } get isCopied(): boolean { return this.copied(); } } 8ximport { Injectable } from '@angular/core'; export interface HighlightOptions { language: string; lineNumbers?: boolean; highlightLines?: (number | string)[]; } @Injectable({ providedIn: 'root' }) export class SyntaxHighlighterService { private supportedLanguages = new Set([ 'javascript', 'typescript', 'css', 'scss', 'html', 'json', 'bash', 'python', 'java', 'csharp', 'markup' ]); private prismLoaded = false; private loadPromise: Promise | null = null; constructor() {} async highlight(code: string, options: HighlightOptions): Promise { const { language } = options; if (!this.isLanguageSupported(language)) { return this.escapeHtml(code); } try { const Prism = await this.loadPrism(); await this.loadLanguage(language); const grammar = Prism.languages[language]; if (!grammar) { return this.escapeHtml(code); } return Prism.highlight(code, grammar, language); } catch (error) { console.warn('Failed to highlight code:', error); return this.escapeHtml(code); } } private async loadPrism(): Promise { if (this.prismLoaded && (window as any).Prism) { return (window as any).Prism; } if (this.loadPromise) { return this.loadPromise; } this.loadPromise = new Promise(async (resolve, reject) => { try { if (typeof window === 'undefined') { // Server-side rendering fallback resolve({ highlight: () => '', languages: {} }); return; } // Load Prism core const prismModule = await import(/* @vite-ignore */ 'prismjs'); const Prism = prismModule.default || prismModule; // Ensure global availability (window as any).Prism = Prism; this.prismLoaded = true; resolve(Prism); } catch (error) { console.warn('Failed to load Prism:', error); reject(error); } }); return this.loadPromise; } private async loadLanguage(language: string): Promise { if (typeof window === 'undefined') return; const Prism = (window as any).Prism; if (!Prism) return; // Check if language is already loaded if (Prism.languages[language]) { return; } try { // Map of language identifiers to their import paths const languageMap: Record = { 'typescript': 'prismjs/components/prism-typescript', 'javascript': 'prismjs/components/prism-javascript', 'css': 'prismjs/components/prism-css', 'scss': 'prismjs/components/prism-scss', 'json': 'prismjs/components/prism-json', 'markup': 'prismjs/components/prism-markup', 'html': 'prismjs/components/prism-markup', 'bash': 'prismjs/components/prism-bash', 'python': 'prismjs/components/prism-python', 'java': 'prismjs/components/prism-java', 'csharp': 'prismjs/components/prism-csharp' }; const importPath = languageMap[language]; if (importPath) { await import(/* @vite-ignore */ importPath); } } catch (error) { console.warn(`Failed to load language ${language}:`, error); } } isLanguageSupported(language: string): boolean { return this.supportedLanguages.has(language.toLowerCase()); } detectLanguage(code: string): string { // Simple heuristics for language detection const trimmedCode = code.trim(); if (trimmedCode.startsWith('') || /<\/?[a-z][\s\S]*>/i.test(trimmedCode)) { return 'markup'; } if (trimmedCode.startsWith('{') || trimmedCode.startsWith('[')) { try { JSON.parse(trimmedCode); return 'json'; } catch {} } if (trimmedCode.includes('function ') || trimmedCode.includes('const ') || trimmedCode.includes('let ') || trimmedCode.includes('var ')) { if (trimmedCode.includes(': ') && (trimmedCode.includes('interface ') || trimmedCode.includes('type '))) { return 'typescript'; } return 'javascript'; } if (trimmedCode.includes('#') && trimmedCode.includes('def ')) { return 'python'; } if (trimmedCode.includes('public class ') || trimmedCode.includes('import java.')) { return 'java'; } if (trimmedCode.includes('using System') || trimmedCode.includes('namespace ')) { return 'csharp'; } if (trimmedCode.includes('#!/bin/') || trimmedCode.includes('echo ')) { return 'bash'; } if (trimmedCode.includes('{') && (trimmedCode.includes('color:') || trimmedCode.includes('margin:') || trimmedCode.includes('@'))) { return trimmedCode.includes('$') ? 'scss' : 'css'; } return 'text'; } getSupportedLanguages(): string[] { return Array.from(this.supportedLanguages).sort(); } private escapeHtml(text: string): string { const div = document.createElement('div'); div.textContent = text; return div.innerHTML; } }@x7(#n*O9// Skip loading for unsupported languages or use fallbackt< // For now, just use the built-in languages or fallback gracefully // This avoids the import issues while still providing b[asic highlighting console.warn(`Language '${language}' not preloaded, using fallback`); Pnx]import { Injectable, signal, computed } from '@angular/core'; export type CodeTheme = 'github-light' | 'github-dark' | 'one-dark' | 'material' | 'dracula'; export interface ThemeColors { background: string; surface: string; text: string; comment: string; keyword: string; string: string; number: string; function: string; operator: string; punctuation: string; variable: string; lineNumber: string; lineHighlight: string; border: string; } @Injectable({ providedIn: 'root' }) export class CodeThemeService { private currentTheme = signal('github-light'); readonly theme = this.currentTheme.asReadonly(); readonly themeColors = computed(() => this.getThemeColors(this.currentTheme())); private themes: Record = { 'github-light': { background: 'var(--semantic-color-surface-primary, #ffffff)', surface: 'var(--semantic-color-surface-secondary, #f6f8fa)', text: 'var(--semantic-color-text-primary, #24292f)', comment: 'var(--semantic-color-text-tertiary, #6e7781)', keyword: 'var(--semantic-color-brand-primary, #cf222e)', string: 'var(--semantic-color-success, #0a3069)', number: 'var(--semantic-color-warning, #0550ae)', function: 'var(--semantic-color-interactive-primary, #8250df)', operator: 'var(--semantic-color-text-primary, #24292f)', punctuation: 'var(--semantic-color-text-secondary, #656d76)', variable: 'var(--semantic-color-text-primary, #24292f)', lineNumber: 'var(--semantic-color-text-tertiary, #656d76)', lineHighlight: 'var(--semantic-color-container-primary, #fff8c5)', border: 'var(--semantic-color-border-secondary, #d0d7de)' }, 'github-dark': { background: 'var(--semantic-color-surface-primary, #0d1117)', surface: 'var(--semantic-color-surface-secondary, #161b22)', text: 'var(--semantic-color-text-primary, #f0f6fc)', comment: 'var(--semantic-color-text-tertiary, #8b949e)', keyword: 'var(--semantic-color-brand-primary, #ff7b72)', string: 'var(--semantic-color-success, #a5d6ff)', number: 'var(--semantic-color-warning, #79c0ff)', function: 'var(--semantic-color-interactive-primary, #d2a8ff)', operator: 'var(--semantic-color-text-primary, #f0f6fc)', punctuation: 'var(--semantic-color-text-secondary, #c9d1d9)', variable: 'var(--semantic-color-text-primary, #f0f6fc)', lineNumber: 'var(--semantic-color-text-tertiary, #8b949e)', lineHighlight: 'var(--semantic-color-container-primary, #ffd33d14)', border: 'var(--semantic-color-border-secondary, #30363d)' }, 'one-dark': { background: 'var(--semantic-color-surface-primary, #282c34)', surface: 'var(--semantic-color-surface-secondary, #3e4451)', text: 'var(--semantic-color-text-primary, #abb2bf)', comment: 'var(--semantic-color-text-tertiary, #5c6370)', keyword: 'var(--semantic-color-brand-primary, #c678dd)', string: 'var(--semantic-color-success, #98c379)', number: 'var(--semantic-color-warning, #d19a66)', function: 'var(--semantic-color-interactive-primary, #61afef)', operator: 'var(--semantic-color-text-primary, #abb2bf)', punctuation: 'var(--semantic-color-text-secondary, #abb2bf)', variable: 'var(--semantic-color-text-primary, #e06c75)', lineNumber: 'var(--semantic-color-text-tertiary, #5c6370)', lineHighlight: 'var(--semantic-color-container-primary, #3e4451)', border: 'var(--semantic-color-border-secondary, #3e4451)' }, 'material': { background: 'var(--semantic-color-surface-primary, #263238)', surface: 'var(--semantic-color-surface-secondary, #37474f)', text: 'var(--semantic-color-text-primary, #eeffff)', comment: 'var(--semantic-color-text-tertiary, #546e7a)', keyword: 'var(--semantic-color-brand-primary, #c792ea)', string: 'var(--semantic-color-success, #c3e88d)', number: 'var(--semantic-color-warning, #f78c6c)', function: 'var(--semantic-color-interactive-primary, #82aaff)', operator: 'var(--semantic-color-text-primary, #89ddff)', punctuation: 'var(--semantic-color-text-secondary, #89ddff)', variable: 'var(--semantic-color-text-primary, #eeffff)', lineNumber: 'var(--semantic-color-text-tertiary, #546e7a)', lineHighlight: 'var(--semantic-color-container-primary, #37474f)', border: 'var(--semantic-color-border-secondary, #37474f)' }, 'dracula': { background: 'var(--semantic-color-surface-primary, #282a36)', surface: 'var(--semantic-color-surface-secondary, #44475a)', text: 'var(--semantic-color-text-primary, #f8f8f2)', comment: 'var(--semantic-color-text-tertiary, #6272a4)', keyword: 'var(--semantic-color-brand-primary, #ff79c6)', string: 'var(--semantic-color-success, #f1fa8c)', number: 'var(--semantic-color-warning, #bd93f9)', function: 'var(--semantic-color-interactive-primary, #8be9fd)', operator: 'var(--semantic-color-text-primary, #ff79c6)', punctuation: 'var(--semantic-color-text-secondary, #f8f8f2)', variable: 'var(--semantic-color-text-primary, #f8f8f2)', lineNumber: 'var(--semantic-color-text-tertiary, #6272a4)', lineHighlight: 'var(--semantic-color-container-primary, #44475a)', border: 'var(--semantic-color-border-secondary, #44475a)' } }; setTheme(theme: CodeTheme): void { this.currentTheme.set(theme); } getThemeColors(theme: CodeTheme): ThemeColors { return this.themes[theme]; } getAvailableThemes(): CodeTheme[] { return Object.keys(this.themes) as CodeTheme[]; } generateThemeCSS(theme: CodeTheme): string { const colors = this.getThemeColors(theme); return ` .code-theme-${theme} { --code-bg: ${colors.background}; --code-surface: ${colors.surface}; --code-text: ${colors.text}; --code-comment: ${colors.comment}; --code-keyword: ${colors.keyword}; --code-string: ${colors.string}; --code-number: ${colors.number}; --code-function: ${colors.function}; --code-operator: ${colors.operator}; --code-punctuation: ${colors.punctuation}; --code-variable: ${colors.variable}; --code-line-number: ${colors.lineNumber}; --code-line-highlight: ${colors.lineHighlight}; --code-border: ${colors.border}; } `; } }J Ĵximport { Component } from '@angular/core'; @Component({ selector: 'ui-ui-code-display', imports: [], template: `

    ui-code-display works!

    `, styles: `` }) export class UiCodeDisplayComponent { } ,H¶xY{ "name": "ui-data-utils", "version": "0.0.1", "description": "Data manipulation helpers for sorting, filtering, pagination, and transformation", "keywords": ["angular", "data", "utilities", "sorting", "filtering", "pagination", "transformation"], "peerDependencies": { "@angular/common": "^19.2.0", "@angular/core": "^19.2.0" }, "dependencies": { "tslib": "^2.3.0" }, "sideEffects": false } Uix*/** * Filtering utilities for data manipulation */ import { FilterConfig, FilterOperator, DataType } from './types'; /** * Get nested property value from object * @param obj - Object to get value from * @param path - Property path (supports dot notation) */ function getNestedValue(obj: any, path: string | keyof any): any { if (typeof path === 'string' && path.includes('.')) { return path.split('.').reduce((current, key) => current?.[key], obj); } return obj?.[path]; } /** * Convert value to appropriate type for comparison * @param value - Value to convert * @param dataType - Target data type */ function convertFilterValue(value: any, dataType: DataType): any { if (value == null) return value; switch (dataType) { case 'string': return String(value); case 'number': const num = Number(value); return isNaN(num) ? 0 : num; case 'date': if (value instanceof Date) return value; const date = new Date(value); return isNaN(date.getTime()) ? new Date(0) : date; case 'boolean': return Boolean(value); default: return value; } } /** * Check if value matches filter condition * @param itemValue - Value from the data item * @param filterValue - Value to compare against * @param operator - Filter operator * @param dataType - Data type for proper comparison */ function matchesFilter( itemValue: any, filterValue: any, operator: FilterOperator, dataType: DataType = 'string' ): boolean { // Handle empty values if (operator === 'is_empty') { return itemValue == null || itemValue === '' || (Array.isArray(itemValue) && itemValue.length === 0); } if (operator === 'is_not_empty') { return itemValue != null && itemValue !== '' && !(Array.isArray(itemValue) && itemValue.length === 0); } // Convert values for comparison const convertedItemValue = convertFilterValue(itemValue, dataType); // Handle array filter values (for 'in' and 'not_in') if (Array.isArray(filterValue)) { const convertedFilterValues = filterValue.map(v => convertFilterValue(v, dataType)); switch (operator) { case 'in': return convertedFilterValues.some(fv => dataType === 'string' ? convertedItemValue?.toLowerCase() === fv?.toLowerCase() : convertedItemValue === fv ); case 'not_in': return !convertedFilterValues.some(fv => dataType === 'string' ? convertedItemValue?.toLowerCase() === fv?.toLowerCase() : convertedItemValue === fv ); } } const convertedFilterValue = convertFilterValue(filterValue, dataType); // Handle between operator (expects array with 2 values) if (operator === 'between') { if (!Array.isArray(filterValue) || filterValue.length !== 2) return false; const [min, max] = filterValue.map(v => convertFilterValue(v, dataType)); return convertedItemValue >= min && convertedItemValue <= max; } // Handle null/undefined item values for operators that don't handle empty values if (convertedItemValue == null) { return operator === 'not_equals'; } switch (operator) { case 'equals': return dataType === 'string' ? convertedItemValue?.toLowerCase() === convertedFilterValue?.toLowerCase() : convertedItemValue === convertedFilterValue; case 'not_equals': return dataType === 'string' ? convertedItemValue?.toLowerCase() !== convertedFilterValue?.toLowerCase() : convertedItemValue !== convertedFilterValue; case 'contains': if (dataType !== 'string') return false; return convertedItemValue?.toLowerCase()?.includes(convertedFilterValue?.toLowerCase()) || false; case 'not_contains': if (dataType !== 'string') return true; return !convertedItemValue?.toLowerCase()?.includes(convertedFilterValue?.toLowerCase()); case 'starts_with': if (dataType !== 'string') return false; return convertedItemValue?.toLowerCase()?.startsWith(convertedFilterValue?.toLowerCase()) || false; case 'ends_with': if (dataType !== 'string') return false; return convertedItemValue?.toLowerCase()?.endsWith(convertedFilterValue?.toLowerCase()) || false; case 'greater_than': return convertedItemValue > convertedFilterValue; case 'greater_than_equal': return convertedItemValue >= convertedFilterValue; case 'less_than': return convertedItemValue < convertedFilterValue; case 'less_than_equal': return convertedItemValue <= convertedFilterValue; default: return false; } } /** * Filter array by single property * @param data - Array to filter * @param config - Filter configuration */ export function filterBy(data: T[], config: FilterConfig): T[] { if (!Array.isArray(data) || data.length === 0) return data; return data.filter(item => { const itemValue = getNestedValue(item, config.key); return matchesFilter( itemValue, config.value, config.operator, config.dataType || 'string' ); }); } /** * Filter array by multiple conditions (AND logic) * @param data - Array to filter * @param configs - Array of filter configurations */ export function filterByMultiple(data: T[], configs: FilterConfig[]): T[] { if (!Array.isArray(data) || data.length === 0) return data; if (!configs || configs.length === 0) return data; return data.filter(item => { return configs.every(config => { const itemValue = getNestedValue(item, config.key); return matchesFilter( itemValue, config.value, config.operator, config.dataType || 'string' ); }); }); } /** * Filter array by multiple conditions with OR logic * @param data - Array to filter * @param configs - Array of filter configurations */ export function filterByAny(data: T[], configs: FilterConfig[]): T[] { if (!Array.isArray(data) || data.length === 0) return data; if (!configs || configs.length === 0) return data; return data.filter(item => { return configs.some(config => { const itemValue = getNestedValue(item, config.key); return matchesFilter( itemValue, config.value, config.operator, config.dataType || 'string' ); }); }); } /** * Search filter - searches across multiple properties * @param data - Array to search * @param searchTerm - Search term * @param searchKeys - Properties to search in * @param caseSensitive - Whether search is case sensitive */ export function searchFilter( data: T[], searchTerm: string, searchKeys: (keyof T)[], caseSensitive: boolean = false ): T[] { if (!Array.isArray(data) || data.length === 0) return data; if (!searchTerm || searchTerm.trim() === '') return data; if (!searchKeys || searchKeys.length === 0) return data; const term = caseSensitive ? searchTerm : searchTerm.toLowerCase(); return data.filter(item => { return searchKeys.some(key => { const value = getNestedValue(item, key); if (value == null) return false; const stringValue = String(value); const searchValue = caseSensitive ? stringValue : stringValue.toLowerCase(); return searchValue.includes(term); }); }); } /** * Advanced search with highlighting matches * @param data - Array to search * @param searchTerm - Search term * @param searchKeys - Properties to search in * @param caseSensitive - Whether search is case sensitive */ export function searchWithHighlight>( data: T[], searchTerm: string, searchKeys: (keyof T)[], caseSensitive: boolean = false ): Array { if (!Array.isArray(data) || data.length === 0) return []; if (!searchTerm || searchTerm.trim() === '') { return data.map(item => ({ ...item, _searchMatches: {} })); } if (!searchKeys || searchKeys.length === 0) return []; const term = caseSensitive ? searchTerm : searchTerm.toLowerCase(); const highlightStartTag = ''; const highlightEndTag = ''; return data.filter(item => { const matches: { [key: string]: string } = {}; let hasMatch = false; searchKeys.forEach(key => { const value = getNestedValue(item, key); if (value == null) return; const stringValue = String(value); const searchValue = caseSensitive ? stringValue : stringValue.toLowerCase(); if (searchValue.includes(term)) { hasMatch = true; // Create highlighted version const regex = new RegExp( caseSensitive ? searchTerm : searchTerm.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'), caseSensitive ? 'g' : 'gi' ); matches[key as string] = stringValue.replace(regex, `${highlightStartTag}$&${highlightEndTag}`); } }); if (hasMatch) { return Object.assign(item, { _searchMatches: matches }); } return false; }).map(item => item as T & { _searchMatches: { [key: string]: string } }); } /** * Create a filter predicate function * @param config - Filter configuration */ export function createFilterPredicate(config: FilterConfig) { return (item: T): boolean => { const itemValue = getNestedValue(item, config.key); return matchesFilter( itemValue, config.value, config.operator, config.dataType || 'string' ); }; } /** * Get unique values from a property across all items * @param data - Array of data * @param key - Property key */ export function getUniqueValues(data: T[], key: keyof T): any[] { if (!Array.isArray(data) || data.length === 0) return []; const values = new Set(); data.forEach(item => { const value = getNestedValue(item, key); if (value != null) { values.add(value); } }); return Array.from(values).sort(); } /** * Get filter suggestions based on current data and partial input * @param data - Array of data * @param key - Property key * @param partialValue - Partial value to match * @param maxSuggestions - Maximum number of suggestions */ export function getFilterSuggestions( data: T[], key: keyof T, partialValue: string, maxSuggestions: number = 10 ): string[] { if (!Array.isArray(data) || data.length === 0) return []; if (!partialValue || partialValue.trim() === '') return []; const term = partialValue.toLowerCase(); const suggestions = new Set(); data.forEach(item => { const value = getNestedValue(item, key); if (value != null) { const stringValue = String(value); if (stringValue.toLowerCase().includes(term)) { suggestions.add(stringValue); } } }); return Array.from(suggestions) .sort() .slice(0, maxSuggestions); },oʱxn/** * Pagination utilities for data manipulation */ import { PaginationConfig, PaginationResult } from './types'; /** * Paginate data array * @param data - Array to paginate * @param config - Pagination configuration */ export function paginate(data: T[], config: PaginationConfig): PaginationResult { if (!Array.isArray(data)) { throw new Error('Data must be an array'); } const { page, pageSize } = config; if (page < 1) { throw new Error('Page number must be 1 or greater'); } if (pageSize < 1) { throw new Error('Page size must be 1 or greater'); } const totalItems = data.length; const totalPages = Math.ceil(totalItems / pageSize); const startIndex = (page - 1) * pageSize; const endIndex = Math.min(startIndex + pageSize - 1, totalItems - 1); const paginatedData = totalItems > 0 ? data.slice(startIndex, startIndex + pageSize) : []; return { data: paginatedData, page, pageSize, totalItems, totalPages, hasPrevious: page > 1, hasNext: page < totalPages, startIndex: totalItems > 0 ? startIndex : -1, endIndex: totalItems > 0 ? endIndex : -1 }; } /** * Calculate pagination metadata without slicing data * @param totalItems - Total number of items * @param page - Current page * @param pageSize - Items per page */ export function calculatePages(totalItems: number, page: number, pageSize: number): Omit { if (totalItems < 0) { throw new Error('Total items cannot be negative'); } if (page < 1) { throw new Error('Page number must be 1 or greater'); } if (pageSize < 1) { throw new Error('Page size must be 1 or greater'); } const totalPages = Math.ceil(totalItems / pageSize); const startIndex = (page - 1) * pageSize; const endIndex = Math.min(startIndex + pageSize - 1, totalItems - 1); return { page, pageSize, totalItems, totalPages, hasPrevious: page > 1, hasNext: page < totalPages, startIndex: totalItems > 0 ? startIndex : -1, endIndex: totalItems > 0 ? endIndex : -1 }; } /** * Get page numbers for pagination display (with ellipsis logic) * @param currentPage - Current page * @param totalPages - Total number of pages * @param maxVisible - Maximum number of visible page numbers */ export function getPaginationRange( currentPage: number, totalPages: number, maxVisible: number = 7 ): Array { if (currentPage < 1 || currentPage > totalPages) { throw new Error('Current page is out of range'); } if (totalPages <= maxVisible) { // Show all pages if total is less than max visible return Array.from({ length: totalPages }, (_, i) => i + 1); } const range: Array = []; const sidePages = Math.floor((maxVisible - 3) / 2); // Reserve 3 spots for first, last, and current // Always show first page range.push(1); if (currentPage <= sidePages + 2) { // Current page is near the beginning for (let i = 2; i <= Math.min(maxVisible - 1, totalPages - 1); i++) { range.push(i); } if (totalPages > maxVisible - 1) { range.push('ellipsis'); } } else if (currentPage >= totalPages - sidePages - 1) { // Current page is near the end range.push('ellipsis'); for (let i = Math.max(2, totalPages - maxVisible + 2); i <= totalPages - 1; i++) { range.push(i); } } else { // Current page is in the middle range.push('ellipsis'); for (let i = currentPage - sidePages; i <= currentPage + sidePages; i++) { range.push(i); } range.push('ellipsis'); } // Always show last page (if it's not already included) if (totalPages > 1 && !range.includes(totalPages)) { range.push(totalPages); } return range; } /** * Get item range text for display (e.g., "1-10 of 100") * @param startIndex - Start index (0-based) * @param endIndex - End index (0-based) * @param totalItems - Total number of items */ export function getItemRangeText(startIndex: number, endIndex: number, totalItems: number): string { if (totalItems === 0) return '0 of 0'; const start = startIndex + 1; // Convert to 1-based const end = endIndex + 1; // Convert to 1-based return `${start}-${end} of ${totalItems}`; } /** * Get page information text (e.g., "Page 1 of 10") * @param currentPage - Current page * @param totalPages - Total number of pages */ export function getPageInfoText(currentPage: number, totalPages: number): string { if (totalPages === 0) return 'Page 0 of 0'; return `Page ${currentPage} of ${totalPages}`; } /** * Calculate optimal page size based on container height and item height * @param containerHeight - Height of the container in pixels * @param itemHeight - Height of each item in pixels * @param minPageSize - Minimum page size * @param maxPageSize - Maximum page size */ export function calculateOptimalPageSize( containerHeight: number, itemHeight: number, minPageSize: number = 5, maxPageSize: number = 100 ): number { const calculatedSize = Math.floor(containerHeight / itemHeight); return Math.max(minPageSize, Math.min(maxPageSize, calculatedSize)); } /** * Navigate to a specific page (with bounds checking) * @param currentPage - Current page * @param totalPages - Total number of pages * @param targetPage - Target page to navigate to */ export function navigateToPage(currentPage: number, totalPages: number, targetPage: number): number { return Math.max(1, Math.min(totalPages, targetPage)); } /** * Navigate to previous page * @param currentPage - Current page */ export function navigateToPrevious(currentPage: number): number { return Math.max(1, currentPage - 1); } /** * Navigate to next page * @param currentPage - Current page * @param totalPages - Total number of pages */ export function navigateToNext(currentPage: number, totalPages: number): number { return Math.min(totalPages, currentPage + 1); } /** * Navigate to first page */ export function navigateToFirst(): number { return 1; } /** * Navigate to last page * @param totalPages - Total number of pages */ export function navigateToLast(totalPages: number): number { return Math.max(1, totalPages); } /** * Check if page navigation is valid * @param page - Page to check * @param totalPages - Total number of pages */ export function isValidPage(page: number, totalPages: number): boolean { return page >= 1 && page <= totalPages && totalPages > 0; } /** * Get all possible page sizes (common values) */ export function getStandardPageSizes(): number[] { return [5, 10, 20, 25, 50, 100]; } /** * Get recommended page size based on total items * @param totalItems - Total number of items */ export function getRecommendedPageSize(totalItems: number): number { if (totalItems <= 25) return 10; if (totalItems <= 100) return 25; if (totalItems <= 500) return 50; return 100; } /** * Paginate with server-side pagination simulation * @param data - Full dataset * @param page - Current page * @param pageSize - Items per page * @param searchTerm - Search term to filter data first * @param searchKeys - Keys to search in */ export function serverPaginate( data: T[], page: number, pageSize: number, searchTerm?: string, searchKeys?: (keyof T)[] ): PaginationResult { let filteredData = data; // Apply search filter first if provided if (searchTerm && searchKeys && searchKeys.length > 0) { const term = searchTerm.toLowerCase(); filteredData = data.filter(item => { return searchKeys.some(key => { const value = item[key]; return value != null && String(value).toLowerCase().includes(term); }); }); } // Then paginate the filtered data return paginate(filteredData, { page, pageSize }); }0w޼xS/** * Sorting utilities for data manipulation */ import { SortConfig, MultiSortConfig, ComparatorFn, SortDirection, DataType } from './types'; /** * Get nested property value from object * @param obj - Object to get value from * @param path - Property path (supports dot notation) */ function getNestedValue(obj: any, path: string | keyof any): any { if (typeof path === 'string' && path.includes('.')) { return path.split('.').reduce((current, key) => current?.[key], obj); } return obj?.[path]; } /** * Convert value to appropriate type for comparison * @param value - Value to convert * @param dataType - Target data type */ function convertValue(value: any, dataType: DataType): any { if (value == null) return value; switch (dataType) { case 'string': return String(value).toLowerCase(); case 'number': const num = Number(value); return isNaN(num) ? 0 : num; case 'date': if (value instanceof Date) return value; const date = new Date(value); return isNaN(date.getTime()) ? new Date(0) : date; case 'boolean': return Boolean(value); default: return value; } } /** * Create a comparator function for a specific property and direction * @param key - Property key to sort by * @param direction - Sort direction * @param dataType - Data type for proper comparison */ export function createComparator( key: keyof T, direction: SortDirection = 'asc', dataType: DataType = 'string' ): ComparatorFn { return (a: T, b: T): number => { const valueA = convertValue(getNestedValue(a, key), dataType); const valueB = convertValue(getNestedValue(b, key), dataType); // Handle null/undefined values if (valueA == null && valueB == null) return 0; if (valueA == null) return direction === 'asc' ? -1 : 1; if (valueB == null) return direction === 'asc' ? 1 : -1; let result = 0; if (dataType === 'string') { result = valueA.localeCompare(valueB); } else if (dataType === 'date') { result = valueA.getTime() - valueB.getTime(); } else { // For numbers and booleans if (valueA < valueB) result = -1; else if (valueA > valueB) result = 1; else result = 0; } return direction === 'desc' ? -result : result; }; } /** * Sort array by single property * @param data - Array to sort * @param config - Sort configuration */ export function sortBy(data: T[], config: SortConfig): T[] { if (!Array.isArray(data) || data.length === 0) return data; const comparator = createComparator( config.key, config.direction, config.dataType || 'string' ); return [...data].sort(comparator); } /** * Sort array by multiple properties with priority * @param data - Array to sort * @param config - Multi-sort configuration */ export function sortByMultiple(data: T[], config: MultiSortConfig): T[] { if (!Array.isArray(data) || data.length === 0) return data; if (!config.sorts || config.sorts.length === 0) return data; // Create comparators for each sort configuration const comparators = config.sorts.map(sortConfig => createComparator( sortConfig.key, sortConfig.direction, sortConfig.dataType || 'string' ) ); return [...data].sort((a: T, b: T): number => { // Apply each comparator in order until we find a non-zero result for (const comparator of comparators) { const result = comparator(a, b); if (result !== 0) return result; } return 0; }); } /** * Create a stable sort function that maintains relative order of equal elements * @param data - Array to sort * @param comparator - Comparison function */ export function stableSort(data: T[], comparator: ComparatorFn): T[] { if (!Array.isArray(data) || data.length === 0) return data; // Add index to maintain stability const indexed = data.map((item, index) => ({ item, index })); indexed.sort((a, b) => { const result = comparator(a.item, b.item); // If items are equal, maintain original order return result !== 0 ? result : a.index - b.index; }); return indexed.map(({ item }) => item); } /** * Check if an array is sorted according to a comparator * @param data - Array to check * @param comparator - Comparison function */ export function isSorted(data: T[], comparator: ComparatorFn): boolean { if (!Array.isArray(data) || data.length <= 1) return true; for (let i = 1; i < data.length; i++) { if (comparator(data[i - 1], data[i]) > 0) return false; } return true; } /** * Reverse sort direction * @param direction - Current direction */ export function reverseDirection(direction: SortDirection): SortDirection { return direction === 'asc' ? 'desc' : 'asc'; } /** * Get sort direction for next click (for UI toggling) * @param currentDirection - Current sort direction * @param allowUnsorted - Whether to allow unsorted state */ export function getNextSortDirection( currentDirection: SortDirection | null, allowUnsorted: boolean = true ): SortDirection | null { if (currentDirection === null) return 'asc'; if (currentDirection === 'asc') return 'desc'; if (currentDirection === 'desc' && allowUnsorted) return null; return 'asc'; // Cycle back to asc if unsorted not allowed } /** * Sort array by multiple keys with individual directions * @param data - Array to sort * @param keys - Array of keys to sort by * @param directions - Array of directions (defaults to 'asc' for all) * @param dataTypes - Array of data types (defaults to 'string' for all) */ export function sortByKeys( data: T[], keys: (keyof T)[], directions: SortDirection[] = [], dataTypes: DataType[] = [] ): T[] { if (!Array.isArray(data) || data.length === 0) return data; if (!keys || keys.length === 0) return data; const sorts: SortConfig[] = keys.map((key, index) => ({ key, direction: directions[index] || 'asc', dataType: dataTypes[index] || 'string' })); return sortByMultiple(data, { sorts }); }x'\/** * Data transformation utilities */ import { GroupByResult, AggregationFunction, AggregationResult } from './types'; /** * Get nested property value from object * @param obj - Object to get value from * @param path - Property path (supports dot notation) */ function getNestedValue(obj: any, path: string | keyof any): any { if (typeof path === 'string' && path.includes('.')) { return path.split('.').reduce((current, key) => current?.[key], obj); } return obj?.[path]; } /** * Group array of objects by a specific property * @param data - Array to group * @param key - Property to group by */ export function groupBy(data: T[], key: keyof T): GroupByResult[] { if (!Array.isArray(data) || data.length === 0) return []; const groups = new Map(); data.forEach(item => { const groupKey = getNestedValue(item, key); if (!groups.has(groupKey)) { groups.set(groupKey, []); } groups.get(groupKey)!.push(item); }); return Array.from(groups.entries()).map(([groupKey, items]) => ({ key: groupKey, items, count: items.length })); } /** * Group array by multiple properties * @param data - Array to group * @param keys - Properties to group by */ export function groupByMultiple(data: T[], keys: (keyof T)[]): GroupByResult[] { if (!Array.isArray(data) || data.length === 0) return []; if (!keys || keys.length === 0) return [{ key: null, items: data, count: data.length }]; const groups = new Map(); data.forEach(item => { const groupKey = keys.map(key => String(getNestedValue(item, key))).join('|'); if (!groups.has(groupKey)) { groups.set(groupKey, []); } groups.get(groupKey)!.push(item); }); return Array.from(groups.entries()).map(([groupKey, items]) => ({ key: groupKey, items, count: items.length })); } /** * Aggregate values using specified functions * @param data - Array to aggregate * @param key - Property to aggregate * @param functions - Aggregation functions to apply */ export function aggregate( data: T[], key: keyof T, functions: AggregationFunction[] ): AggregationResult { if (!Array.isArray(data) || data.length === 0) { return functions.reduce((acc, fn) => ({ ...acc, [fn]: 0 }), {}); } const values = data .map(item => getNestedValue(item, key)) .filter(value => value != null && !isNaN(Number(value))) .map(value => Number(value)); if (values.length === 0) { return functions.reduce((acc, fn) => ({ ...acc, [fn]: 0 }), {}); } const result: AggregationResult = {}; functions.forEach(fn => { switch (fn) { case 'sum': result['sum'] = values.reduce((acc, val) => acc + val, 0); break; case 'avg': result['avg'] = values.reduce((acc, val) => acc + val, 0) / values.length; break; case 'min': result['min'] = Math.min(...values); break; case 'max': result['max'] = Math.max(...values); break; case 'count': result['count'] = values.length; break; } }); return result; } /** * Group by and aggregate in one operation * @param data - Array to process * @param groupKey - Property to group by * @param aggregateKey - Property to aggregate * @param functions - Aggregation functions */ export function groupAndAggregate( data: T[], groupKey: keyof T, aggregateKey: keyof T, functions: AggregationFunction[] ): Array<{ group: any; aggregates: AggregationResult }> { const groups = groupBy(data, groupKey); return groups.map(group => ({ group: group.key, aggregates: aggregate(group.items, aggregateKey, functions) })); } /** * Extract specific properties from objects (pluck) * @param data - Array of objects * @param keys - Properties to extract */ export function pluck, K extends keyof T>(data: T[], keys: K[]): Pick[] { if (!Array.isArray(data) || data.length === 0) return []; if (!keys || keys.length === 0) return []; return data.map(item => { const result = {} as Pick; keys.forEach(key => { if (key in item) { result[key] = item[key]; } }); return result; }); } /** * Extract single property values into array * @param data - Array of objects * @param key - Property to extract */ export function pluckProperty(data: T[], key: K): T[K][] { if (!Array.isArray(data) || data.length === 0) return []; return data.map(item => getNestedValue(item, key)).filter(value => value !== undefined); } /** * Flatten nested arrays * @param data - Array that may contain nested arrays * @param depth - Maximum depth to flatten (default: 1) */ export function flatten(data: any[], depth: number = 1): T[] { if (!Array.isArray(data)) return []; const flattenRecursive = (arr: any[], currentDepth: number): any[] => { return currentDepth > 0 ? arr.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenRecursive(val, currentDepth - 1)) : acc.concat(val), []) : arr.slice(); }; return flattenRecursive(data, depth); } /** * Flatten array completely (all levels) * @param data - Array to flatten */ export function flattenDeep(data: any[]): T[] { if (!Array.isArray(data)) return []; return data.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []); } /** * Create pivot table from data * @param data - Array to pivot * @param rowKey - Property for rows * @param colKey - Property for columns * @param valueKey - Property for values * @param aggregateFunction - How to aggregate values */ export function pivot( data: T[], rowKey: keyof T, colKey: keyof T, valueKey: keyof T, aggregateFunction: AggregationFunction = 'sum' ): { [row: string]: { [col: string]: number } } { if (!Array.isArray(data) || data.length === 0) return {}; const result: { [row: string]: { [col: string]: number } } = {}; data.forEach(item => { const row = String(getNestedValue(item, rowKey)); const col = String(getNestedValue(item, colKey)); const value = Number(getNestedValue(item, valueKey)) || 0; if (!result[row]) { result[row] = {}; } if (!result[row][col]) { result[row][col] = 0; } switch (aggregateFunction) { case 'sum': result[row][col] += value; break; case 'count': result[row][col] += 1; break; case 'avg': // For avg, we need to track sum and count separately // This is a simplified version that treats each occurrence as separate result[row][col] = (result[row][col] + value) / 2; break; case 'min': result[row][col] = Math.min(result[row][col], value); break; case 'max': result[row][col] = Math.max(result[row][col], value); break; } }); return result; } /** * Transpose 2D array (flip rows and columns) * @param data - 2D array to transpose */ export function transpose(data: T[][]): T[][] { if (!Array.isArray(data) || data.length === 0) return []; if (!Array.isArray(data[0])) return []; const rows = data.length; const cols = data[0].length; const result: T[][] = []; for (let col = 0; col < cols; col++) { result[col] = []; for (let row = 0; row < rows; row++) { result[col][row] = data[row][col]; } } return result; } /** * Create frequency map of values * @param data - Array of values or objects * @param key - Property key (if data contains objects) */ export function frequency(data: T[], key?: keyof T): Map { if (!Array.isArray(data)) return new Map(); const freqMap = new Map(); data.forEach(item => { const value = key ? getNestedValue(item, key) : item; freqMap.set(value, (freqMap.get(value) || 0) + 1); }); return freqMap; } /** * Get unique values from array or object property * @param data - Array of data * @param key - Property key (optional) */ export function unique(data: T[], key?: keyof T): any[] { if (!Array.isArray(data)) return []; const values = key ? data.map(item => getNestedValue(item, key)) : data; return [...new Set(values)]; } /** * Chunk array into smaller arrays of specified size * @param data - Array to chunk * @param size - Size of each chunk */ export function chunk(data: T[], size: number): T[][] { if (!Array.isArray(data) || size <= 0) return []; const chunks: T[][] = []; for (let i = 0; i < data.length; i += size) { chunks.push(data.slice(i, i + size)); } return chunks; } /** * Zip multiple arrays together * @param arrays - Arrays to zip */ export function zip(...arrays: T[][]): T[][] { if (arrays.length === 0) return []; const length = Math.max(...arrays.map(arr => Array.isArray(arr) ? arr.length : 0)); const result: T[][] = []; for (let i = 0; i < length; i++) { result[i] = arrays.map(arr => arr[i]); } return result; } /** * Create cross product of multiple arrays * @param arrays - Arrays to get cross product from */ export function cartesianProduct(...arrays: T[][]): T[][] { if (arrays.length === 0) return []; if (arrays.some(arr => !Array.isArray(arr) || arr.length === 0)) return []; return arrays.reduce( (acc, curr) => acc.flatMap(a => curr.map(b => [...a, b])), [[]] as T[][] ); } /** * Sample random items from array * @param data - Array to sample from * @param count - Number of items to sample * @param withReplacement - Whether to allow duplicate selections */ export function sample(data: T[], count: number, withReplacement: boolean = false): T[] { if (!Array.isArray(data) || data.length === 0 || count <= 0) return []; if (withReplacement) { return Array.from({ length: count }, () => data[Math.floor(Math.random() * data.length)] ); } else { const shuffled = [...data].sort(() => Math.random() - 0.5); return shuffled.slice(0, Math.min(count, data.length)); } }B@xo /** * Common types used across ui-data-utils */ /** * Sort direction */ export type SortDirection = 'asc' | 'desc'; /** * Supported data types for comparison */ export type DataType = 'string' | 'number' | 'date' | 'boolean'; /** * Sort configuration for single property */ export interface SortConfig { /** Property key to sort by */ key: keyof T; /** Sort direction */ direction: SortDirection; /** Data type for proper comparison */ dataType?: DataType; } /** * Multi-column sort configuration */ export interface MultiSortConfig { /** Array of sort configurations in priority order */ sorts: SortConfig[]; } /** * Comparator function type */ export type ComparatorFn = (a: T, b: T) => number; /** * Filter operator types */ export type FilterOperator = | 'equals' | 'not_equals' | 'contains' | 'not_contains' | 'starts_with' | 'ends_with' | 'greater_than' | 'greater_than_equal' | 'less_than' | 'less_than_equal' | 'between' | 'in' | 'not_in' | 'is_empty' | 'is_not_empty'; /** * Filter configuration */ export interface FilterConfig { /** Property key to filter by */ key: keyof T; /** Filter operator */ operator: FilterOperator; /** Filter value(s) */ value: any; /** Data type for proper comparison */ dataType?: DataType; } /** * Pagination configuration */ export interface PaginationConfig { /** Current page (1-based) */ page: number; /** Items per page */ pageSize: number; } /** * Pagination result */ export interface PaginationResult { /** Paginated data */ data: T[]; /** Current page */ page: number; /** Items per page */ pageSize: number; /** Total number of items */ totalItems: number; /** Total number of pages */ totalPages: number; /** Has previous page */ hasPrevious: boolean; /** Has next page */ hasNext: boolean; /** Start index (0-based) */ startIndex: number; /** End index (0-based) */ endIndex: number; } /** * Aggregation functions */ export type AggregationFunction = 'sum' | 'avg' | 'min' | 'max' | 'count'; /** * Aggregation result */ export interface AggregationResult { [key: string]: number; } /** * Group by result */ export interface GroupByResult { /** Group key */ key: any; /** Items in this group */ items: T[]; /** Group count */ count: number; }Px%/* * Public API Surface of ui-data-utils */ // Types and interfaces export * from './lib/types'; // Sorting utilities export * from './lib/sorting'; // Filtering utilities export * from './lib/filtering'; // Pagination utilities export * from './lib/pagination'; // Transformation utilities export * from './lib/transformation'; // Legacy exports (keep for compatibility) export * from './lib/ui-data-utils.service'; export * from './lib/ui-data-utils.component'; bɽxMimport { FaIconLibrary } from '@fortawesome/angular-fontawesome'; import { faUser, faHome, faCog, faSearch, faPlus, faEdit, faTrash, faSave, faCancel, faCheck, faTimes, faArrowLeft, faArrowRight, faChevronLeft, faChevronRight, faChevronUp, faChevronDown, faBars, faEllipsisV, faEye, faEyeSlash, faDownload, faUpload, faRefresh, faSpinner, faExclamationTriangle, faInfoCircle, faCheckCircle, faTimesCircle, faEnvelope, faWindowMaximize, faUserCircle, faCertificate, faHandPointer, faIdCard, faTags, faCheckSquare, faKeyboard, faThLarge, faList, faDotCircle, faToggleOn, faTable, faCirclePlus } from '@fortawesome/free-solid-svg-icons'; import { faHeart, faBookmark, faComment, faThumbsUp } from '@fortawesome/free-regular-svg-icons'; import { faGithub, faTwitter, faLinkedin, faGoogle } from '@fortawesome/free-brands-svg-icons'; /** * Configuration function to add commonly used Font Awesome icons to the library * Call this function in your application's initialization to register icons */ export function configureFontAwesome(library: FaIconLibrary): void { // Add solid icons library.addIcons( faUser, faHome, faCog, faSearch, faPlus, faEdit, faTrash, faSave, faCancel, faCheck, faTimes, faArrowLeft, faArrowRight, faChevronLeft, faChevronRight, faChevronUp, faChevronDown, faBars, faEllipsisV, faEye, faEyeSlash, faDownload, faUpload, faRefresh, faSpinner, faExclamationTriangle, faInfoCircle, faCheckCircle, faTimesCircle, faEnvelope, faWindowMaximize, faUserCircle, faCertificate, faHandPointer, faIdCard, faTags, faCheckSquare, faKeyboard, faThLarge, faList, faDotCircle, faToggleOn, faTable, faCirclePlus ); // Add regular icons library.addIcons( faHeart, faBookmark, faComment, faThumbsUp ); // Add brand icons library.addIcons( faGithub, faTwitter, faLinkedin, faGoogle ); }5xS// Font Awesome exports export { FaIconComponent } from '@fortawesome/angular-fontawesome'; export { configureFontAwesome } from './font-awesome.config'; // Re-export commonly used icon definitions export { faUser, faHome, faCog, faSearch, faPlus, faEdit, faTrash, faSave, faCancel, faCheck, faTimes, faArrowLeft, faArrowRight, faChevronLeft, faChevronRight, faChevronUp, faChevronDown, faBars, faEllipsisV, faEye, faEyeSlash, faDownload, faUpload, faRefresh, faSpinner, faExclamationTriangle, faInfoCircle, faCheckCircle, faTimesCircle } from '@fortawesome/free-solid-svg-icons'; export { faHeart, faBookmark, faComment, faThumbsUp } from '@fortawesome/free-regular-svg-icons'; export { faGithub, faTwitter, faLinkedin, faGoogle } from '@fortawesome/free-brands-svg-icons';"xj0 y T{+=*.OqQ ;~~*8%wxcO!msc,vbUc 1)>'E5۪Bk #НΩJ'PA)mA~i+}لp+]oY꿼k сZz4&xYPATTERNS INDEX Q pattern)pattern hMcontent-patterns'; @import 'interaction-patterns'; @import 'layout-patterns';.Xx// ========================================================================== // BASE BUTTONS // ========================================================================== // Theme-agnostic button structures and behaviors // Visual styling handled by themes // ========================================================================== // BUTTON BASE .btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--btn-gap, #{$semantic-spacing-micro-icon-gap}); padding: var(--btn-padding, #{$semantic-spacing-interactive-button-padding-y} #{$semantic-spacing-interactive-button-padding-x}); border: var(--btn-border-width, #{$semantic-border-button-width}) solid transparent; border-radius: var(--btn-border-radius, #{$semantic-border-button-radius}); font-family: inherit; font-size: var(--btn-font-size, 1rem); font-weight: var(--btn-font-weight, 500); line-height: var(--btn-line-height, 1.5); text-align: center; text-decoration: none; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; transition: all var(--btn-transition-duration, 0.2s) var(--btn-transition-easing, ease); position: relative; overflow: hidden; &:focus { outline: var(--btn-focus-outline, 2px solid transparent); outline-offset: var(--btn-focus-outline-offset, 2px); } &:disabled, &.btn-disabled { pointer-events: none; opacity: var(--btn-disabled-opacity, 0.6); cursor: not-allowed; } &.btn-loading { pointer-events: none; .btn-text { opacity: 0; } .btn-spinner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } } } // BUTTON SIZES - Using semantic sizing tokens .btn-xs { --btn-padding: #{$semantic-spacing-component-padding-xs} #{$semantic-spacing-component-padding-sm}; --btn-font-size: 0.75rem; --btn-gap: #{$base-spacing-1}; } .btn-sm { --btn-padding: #{$semantic-spacing-component-padding-sm} #{$semantic-spacing-component-padding-md}; --btn-font-size: 0.875rem; --btn-gap: #{$semantic-spacing-micro-icon-gap}; } .btn-lg { --btn-padding: #{$semantic-spacing-component-padding-md} #{$semantic-spacing-component-padding-xl}; --btn-font-size: 1.125rem; --btn-gap: #{$semantic-spacing-component-padding-sm}; } .btn-xl { --btn-padding: #{$semantic-spacing-component-padding-lg} #{$semantic-spacing-component-padding-xl}; --btn-font-size: 1.25rem; --btn-gap: 16px; } // BUTTON SHAPES .btn-rounded { border-radius: var(--btn-rounded-radius, 50px); } .btn-square { border-radius: 0; } .btn-circle { border-radius: 50%; width: var(--btn-circle-size, 48px); height: var(--btn-circle-size, 48px); padding: 0; } // BUTTON WIDTHS .btn-block { display: flex; width: 100%; } .btn-auto { width: auto; } // BUTTON GROUPS .btn-group { display: inline-flex; vertical-align: middle; > .btn { position: relative; flex: 1 1 auto; border-radius: 0; &:first-child { border-top-left-radius: var(--btn-border-radius, 4px); border-bottom-left-radius: var(--btn-border-radius, 4px); } &:last-child { border-top-right-radius: var(--btn-border-radius, 4px); border-bottom-right-radius: var(--btn-border-radius, 4px); } &:not(:first-child) { margin-left: calc(var(--btn-border-width, 1px) * -1); } &:hover, &:focus, &.btn-active { z-index: 1; } } &.btn-group-vertical { flex-direction: column; > .btn { &:first-child { border-radius: var(--btn-border-radius, 4px) var(--btn-border-radius, 4px) 0 0; } &:last-child { border-radius: 0 0 var(--btn-border-radius, 4px) var(--btn-border-radius, 4px); } &:not(:first-child) { margin-left: 0; margin-top: calc(var(--btn-border-width, 1px) * -1); } } } } // FLOATING ACTION BUTTON (FAB) .btn-fab { position: fixed; bottom: var(--fab-bottom, 24px); right: var(--fab-right, 24px); width: var(--fab-size, 56px); height: var(--fab-size, 56px); border-radius: 50%; padding: 0; z-index: var(--z-fab, 1000); box-shadow: var(--fab-shadow, 0 4px 12px rgba(0, 0, 0, 0.15)); transition: all var(--fab-transition-duration, 0.3s) var(--fab-transition-easing, ease); &:hover { transform: var(--fab-hover-transform, translateY(-2px)); box-shadow: var(--fab-hover-shadow, 0 6px 20px rgba(0, 0, 0, 0.2)); } &.btn-fab-mini { --fab-size: 40px; --fab-bottom: 16px; --fab-right: 16px; } &.btn-fab-extended { width: auto; min-width: var(--fab-extended-min-width, 120px); border-radius: var(--fab-extended-radius, 28px); padding: var(--fab-extended-padding, 0 20px); gap: var(--fab-extended-gap, 8px); } } // BUTTON ICON HANDLING .btn-icon { width: var(--btn-icon-size, 24px); height: var(--btn-icon-size, 24px); flex-shrink: 0; &.btn-icon-start { margin-right: var(--btn-icon-spacing, 8px); margin-left: calc(var(--btn-icon-spacing, 8px) * -0.5); } &.btn-icon-end { margin-left: var(--btn-icon-spacing, 8px); margin-right: calc(var(--btn-icon-spacing, 8px) * -0.5); } } .btn-icon-only { width: var(--btn-icon-only-size, 40px); height: var(--btn-icon-only-size, 40px); padding: 0; &.btn-sm { --btn-icon-only-size: 32px; } &.btn-lg { --btn-icon-only-size: 48px; } &.btn-xl { --btn-icon-only-size: 56px; } } // BUTTON STATES .btn-loading-spinner { display: inline-block; width: var(--spinner-size, 16px); height: var(--spinner-size, 16px); border: 2px solid transparent; border-top: 2px solid currentColor; border-radius: 50%; animation: btn-spin var(--spinner-duration, 1s) linear infinite; } @keyframes btn-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // RIPPLE EFFECT (Structure only) .btn-ripple { position: relative; overflow: hidden; &::before { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; transform: translate(-50%, -50%); transition: width 0.6s, height 0.6s; background: var(--btn-ripple-color, rgba(255, 255, 255, 0.3)); } &:active::before { width: 300px; height: 300px; } } // TOGGLE BUTTON .btn-toggle { &.btn-toggle-active { // Active state handled by theme } &[aria-pressed="true"] { // Pressed state handled by theme } } // DROPDOWN BUTTON .btn-dropdown { .dropdown-caret { margin-left: var(--dropdown-caret-spacing, 8px); transition: transform var(--dropdown-transition-duration, 0.2s); } &.dropdown-open .dropdown-caret { transform: rotate(180deg); } } // RESPONSIVE BUTTON ADJUSTMENTS @media (max-width: 576px) { .btn { --btn-padding: 10px 20px; --btn-font-size: 0.875rem; } .btn-block-mobile { display: flex; width: 100%; } .btn-fab { --fab-size: 48px; --fab-bottom: 16px; --fab-right: 16px; } } // ACCESSIBILITY IMPROVEMENTS @media (prefers-reduced-motion: reduce) { .btn { transition: none; } .btn-fab { transition: none; &:hover { transform: none; } } .btn-loading-spinner { animation: none; } } // HIGH CONTRAST MODE @media (prefers-contrast: high) { .btn { border-width: 2px; } .btn:focus { outline: 3px solid; outline-offset: 3px; } }1x+$// ========================================================================== // BASE CARDS // ========================================================================== // Theme-agnostic card structures and layouts // Visual styling handled by themes // ========================================================================== // CARD BASE .card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-clip: border-box; border: var(--card-border-width, #{$semantic-border-card-width}) solid transparent; border-radius: var(--card-border-radius, #{$semantic-border-card-radius}); &.card-interactive { cursor: pointer; transition: all var(--card-transition-duration, 0.2s) var(--card-transition-easing, ease); &:hover { transform: var(--card-hover-transform, translateY(-2px)); } &:active { transform: var(--card-active-transform, translateY(0)); } } &.card-clickable { cursor: pointer; text-decoration: none; &:focus { outline: var(--card-focus-outline, 2px solid transparent); outline-offset: var(--card-focus-outline-offset, 2px); } } } // CARD COMPONENTS .card-header { padding: var(--card-header-padding, #{$semantic-spacing-container-card-padding} #{$semantic-spacing-container-card-padding-lg}); border-bottom: var(--card-header-border-width, #{$semantic-border-divider-width}) solid var(--card-header-border-color, transparent); border-top-left-radius: inherit; border-top-right-radius: inherit; display: flex; align-items: center; gap: var(--card-header-gap, #{$semantic-spacing-component-padding-sm}); min-height: var(--card-header-min-height, auto); &:first-child { border-top-left-radius: var(--card-border-radius, #{$semantic-border-card-radius}); border-top-right-radius: var(--card-border-radius, #{$semantic-border-card-radius}); } &.card-header-borderless { border-bottom: none; } .card-title { margin: 0; font-size: var(--card-title-size, 1.125rem); font-weight: var(--card-title-weight, 600); line-height: var(--card-title-line-height, 1.4); flex: 1; } .card-subtitle { margin: var(--card-subtitle-margin, 4px 0 0 0); font-size: var(--card-subtitle-size, 0.875rem); opacity: var(--card-subtitle-opacity, 0.7); } .card-actions { display: flex; align-items: center; gap: var(--card-actions-gap, 8px); margin-left: auto; } } .card-body { flex: 1 1 auto; padding: var(--card-body-padding, 20px); &.card-body-compact { padding: var(--card-body-compact-padding, 12px); } &.card-body-spacious { padding: var(--card-body-spacious-padding, 32px); } &.card-body-flush { padding: 0; } &:first-child { border-top-left-radius: inherit; border-top-right-radius: inherit; } &:last-child { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } .card-text { margin: 0 0 var(--card-text-spacing, 16px) 0; line-height: var(--card-text-line-height, 1.6); &:last-child { margin-bottom: 0; } } } .card-footer { padding: var(--card-footer-padding, 12px 20px); border-top: var(--card-footer-border-width, 1px) solid var(--card-footer-border-color, transparent); border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; display: flex; align-items: center; justify-content: space-between; gap: var(--card-footer-gap, 12px); &:last-child { border-bottom-left-radius: var(--card-border-radius, 8px); border-bottom-right-radius: var(--card-border-radius, 8px); } &.card-footer-borderless { border-top: none; } &.card-footer-center { justify-content: center; } &.card-footer-end { justify-content: flex-end; } } // CARD MEDIA .card-img { width: 100%; border-radius: inherit; &.card-img-top { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } &.card-img-bottom { border-top-left-radius: 0; border-top-right-radius: 0; } } .card-img-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: var(--card-overlay-padding, 20px); border-radius: inherit; display: flex; flex-direction: column; justify-content: flex-end; } // CARD VARIANTS .card-horizontal { flex-direction: row; .card-img { flex-shrink: 0; width: var(--card-horizontal-img-width, 200px); height: auto; border-radius: var(--card-border-radius, 8px) 0 0 var(--card-border-radius, 8px); &.card-img-end { border-radius: 0 var(--card-border-radius, 8px) var(--card-border-radius, 8px) 0; order: 2; } } .card-body { display: flex; flex-direction: column; justify-content: center; } } @media (max-width: 768px) { .card-horizontal { flex-direction: column; .card-img { width: 100%; border-radius: var(--card-border-radius, 8px) var(--card-border-radius, 8px) 0 0; &.card-img-end { border-radius: 0 0 var(--card-border-radius, 8px) var(--card-border-radius, 8px); order: 0; } } } } // CARD SIZES .card-sm { --card-header-padding: 12px 16px; --card-body-padding: 16px; --card-footer-padding: 8px 16px; --card-border-radius: 6px; } .card-lg { --card-header-padding: 24px 32px; --card-body-padding: 32px; --card-footer-padding: 16px 32px; --card-border-radius: 12px; } // CARD STATES .card-loading { pointer-events: none; opacity: var(--card-loading-opacity, 0.7); .card-loading-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; border-radius: inherit; z-index: 1; } } .card-disabled { pointer-events: none; opacity: var(--card-disabled-opacity, 0.6); } // CARD GROUPS .card-group { display: flex; > .card { flex: 1 0 0%; border-radius: 0; &:first-child { border-top-left-radius: var(--card-border-radius, 8px); border-bottom-left-radius: var(--card-border-radius, 8px); } &:last-child { border-top-right-radius: var(--card-border-radius, 8px); border-bottom-right-radius: var(--card-border-radius, 8px); } &:not(:last-child) { border-right: none; } } } @media (max-width: 768px) { .card-group { flex-direction: column; > .card { border-radius: 0; &:first-child { border-radius: var(--card-border-radius, 8px) var(--card-border-radius, 8px) 0 0; } &:last-child { border-radius: 0 0 var(--card-border-radius, 8px) var(--card-border-radius, 8px); } &:not(:last-child) { border-right: var(--card-border-width, 1px) solid transparent; border-bottom: none; } } } } // CARD DECK .card-deck { display: flex; flex-direction: column; gap: var(--card-deck-gap, 24px); @media (min-width: 576px) { flex-direction: row; } > .card { flex: 1 0 0%; } } // CARD COLUMNS (Masonry-style) .card-columns { column-count: 1; column-gap: var(--card-columns-gap, 24px); orphans: 1; widows: 1; @media (min-width: 576px) { column-count: 2; } @media (min-width: 768px) { column-count: 3; } @media (min-width: 992px) { column-count: 4; } > .card { display: inline-block; width: 100%; margin-bottom: var(--card-columns-gap, 24px); break-inside: avoid; } } // CARD GRID .card-grid { display: grid; gap: var(--card-grid-gap, 24px); grid-template-columns: 1fr; @media (min-width: 576px) { grid-template-columns: repeat(2, 1fr); } @media (min-width: 768px) { grid-template-columns: repeat(3, 1fr); } @media (min-width: 992px) { grid-template-columns: repeat(4, 1fr); } &.card-grid-auto-fit { grid-template-columns: repeat(auto-fit, minmax(var(--card-grid-min-width, 280px), 1fr)); } &.card-grid-auto-fill { grid-template-columns: repeat(auto-fill, minmax(var(--card-grid-min-width, 280px), 1fr)); } } // SPECIAL CARD TYPES .card-feature { text-align: center; .card-body { padding: var(--card-feature-padding, 48px 32px); } .card-icon { width: var(--card-feature-icon-size, 64px); height: var(--card-feature-icon-size, 64px); margin: 0 auto var(--card-feature-icon-spacing, 24px) auto; display: flex; align-items: center; justify-content: center; border-radius: var(--card-feature-icon-radius, 12px); } } .card-profile { text-align: center; .card-avatar { width: var(--card-avatar-size, 80px); height: var(--card-avatar-size, 80px); border-radius: 50%; margin: calc(var(--card-avatar-size, 80px) / -2) auto var(--card-avatar-spacing, 16px) auto; border: var(--card-avatar-border, 4px solid white); position: relative; z-index: 1; } .card-header { padding-bottom: calc(var(--card-avatar-size, 80px) / 2 + var(--card-header-padding-bottom, 16px)); } } // ACCESSIBILITY @media (prefers-reduced-motion: reduce) { .card-interactive { transition: none; &:hover { transform: none; } } } @media (prefers-contrast: high) { .card { border-width: 2px; } }W@x-R// ========================================================================== // BASE FORMS // ========================================================================== // Theme-agnostic form structures and behaviors // Visual styling handled by themes // ========================================================================== // FORM CONTAINER .form { display: flex; flex-direction: column; gap: var(--form-gap, 24px); max-width: var(--form-max-width, 100%); margin: var(--form-margin, 0); &.form-inline { flex-direction: row; align-items: center; flex-wrap: wrap; gap: var(--form-inline-gap, 16px); } &.form-compact { gap: var(--form-compact-gap, 16px); } &.form-spacious { gap: var(--form-spacious-gap, 32px); } } // FIELDSET .fieldset { border: var(--fieldset-border, 1px solid transparent); border-radius: var(--fieldset-border-radius, 8px); padding: var(--fieldset-padding, 24px); margin: var(--fieldset-margin, 0 0 24px 0); .fieldset-legend { font-size: var(--fieldset-legend-size, 1.125rem); font-weight: var(--fieldset-legend-weight, 600); margin-bottom: var(--fieldset-legend-spacing, 16px); padding: var(--fieldset-legend-padding, 0 8px); } } // FORM FIELD .form-field { display: flex; flex-direction: column; gap: var(--form-field-gap, 8px); position: relative; &.form-field-inline { flex-direction: row; align-items: center; gap: var(--form-field-inline-gap, 12px); .form-label { flex-shrink: 0; margin-bottom: 0; min-width: var(--form-label-min-width, 120px); } .form-input-wrapper { flex: 1; } } &.form-field-checkbox, &.form-field-radio { flex-direction: row; align-items: flex-start; gap: var(--form-checkbox-gap, 8px); .form-input { flex-shrink: 0; margin: 0; } .form-label { flex: 1; margin-bottom: 0; cursor: pointer; line-height: var(--form-checkbox-label-line-height, 1.5); } } &.form-field-error { .form-input { border-color: var(--form-error-color, #dc3545); } .form-label { color: var(--form-error-color, #dc3545); } } &.form-field-success { .form-input { border-color: var(--form-success-color, #28a745); } } &.form-field-disabled { opacity: var(--form-disabled-opacity, 0.6); pointer-events: none; } } // FORM LABEL .form-label { font-size: var(--form-label-size, 0.875rem); font-weight: var(--form-label-weight, 500); line-height: var(--form-label-line-height, 1.4); margin-bottom: var(--form-label-spacing, 8px); cursor: pointer; &.form-label-required::after { content: var(--form-required-indicator, ' *'); color: var(--form-required-color, #dc3545); } &.form-label-optional::after { content: var(--form-optional-indicator, ' (optional)'); opacity: var(--form-optional-opacity, 0.6); font-weight: normal; } } // FORM INPUTS .form-input { width: 100%; padding: var(--form-input-padding, 12px 16px); border: var(--form-input-border, 1px solid #d1d5db); border-radius: var(--form-input-border-radius, 6px); font-family: inherit; font-size: var(--form-input-font-size, 1rem); line-height: var(--form-input-line-height, 1.5); transition: all var(--form-input-transition-duration, 0.2s) var(--form-input-transition-easing, ease); background: var(--form-input-background, transparent); &:focus { outline: var(--form-input-focus-outline, 2px solid transparent); outline-offset: var(--form-input-focus-outline-offset, 2px); border-color: var(--form-input-focus-border-color, #3b82f6); } &:disabled, &[readonly] { opacity: var(--form-input-disabled-opacity, 0.6); cursor: not-allowed; background: var(--form-input-disabled-background, #f9fafb); } &::placeholder { color: var(--form-input-placeholder-color, #9ca3af); opacity: 1; } } // INPUT SIZES .form-input-sm { --form-input-padding: 8px 12px; --form-input-font-size: 0.875rem; } .form-input-lg { --form-input-padding: 16px 20px; --form-input-font-size: 1.125rem; } // TEXTAREA .form-textarea { min-height: var(--form-textarea-min-height, 120px); resize: var(--form-textarea-resize, vertical); line-height: var(--form-textarea-line-height, 1.6); } // SELECT .form-select { cursor: pointer; appearance: none; background-image: var(--form-select-arrow, url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E")); background-position: right 12px center; background-repeat: no-repeat; background-size: 16px 12px; padding-right: var(--form-select-padding-right, 40px); &[multiple] { background-image: none; padding-right: var(--form-input-padding-right, 16px); } } // CHECKBOX & RADIO .form-checkbox, .form-radio { width: var(--form-checkbox-size, 18px); height: var(--form-checkbox-size, 18px); margin: var(--form-checkbox-margin, 2px 0 0 0); cursor: pointer; appearance: none; border: var(--form-checkbox-border, 2px solid #d1d5db); transition: all var(--form-checkbox-transition-duration, 0.2s) var(--form-checkbox-transition-easing, ease); &:focus { outline: var(--form-checkbox-focus-outline, 2px solid transparent); outline-offset: var(--form-checkbox-focus-outline-offset, 2px); } &:checked { background: var(--form-checkbox-checked-background, #3b82f6); border-color: var(--form-checkbox-checked-border-color, #3b82f6); } &:disabled { opacity: var(--form-checkbox-disabled-opacity, 0.5); cursor: not-allowed; } } .form-checkbox { border-radius: var(--form-checkbox-border-radius, 3px); &:checked { background-image: var(--form-checkbox-check-icon, url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m13.854 3.646-7.5 7.5a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6 10.293l7.146-7.147a.5.5 0 0 1 .708.708z'/%3E%3C/svg%3E")); background-position: center; background-repeat: no-repeat; background-size: 12px 12px; } &:indeterminate { background: var(--form-checkbox-indeterminate-background, #3b82f6); border-color: var(--form-checkbox-indeterminate-border-color, #3b82f6); background-image: var(--form-checkbox-indeterminate-icon, url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E")); background-position: center; background-repeat: no-repeat; background-size: 12px 12px; } } .form-radio { border-radius: 50%; &:checked { background-image: var(--form-radio-dot-icon, radial-gradient(circle at center, white 4px, transparent 4px)); } } // INPUT GROUPS .form-input-group { display: flex; position: relative; > .form-input { position: relative; flex: 1 1 auto; min-width: 0; &:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: none; } &:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } &:focus { z-index: 2; } } .form-input-addon, .form-input-btn { display: flex; align-items: center; padding: var(--form-input-addon-padding, 12px 16px); font-size: var(--form-input-addon-font-size, 1rem); border: var(--form-input-border, 1px solid #d1d5db); white-space: nowrap; &:first-child { border-top-left-radius: var(--form-input-border-radius, 6px); border-bottom-left-radius: var(--form-input-border-radius, 6px); border-right: none; } &:last-child { border-top-right-radius: var(--form-input-border-radius, 6px); border-bottom-right-radius: var(--form-input-border-radius, 6px); border-left: none; } } .form-input-btn { cursor: pointer; transition: all var(--form-input-btn-transition-duration, 0.2s); &:hover { z-index: 2; } } } // FLOATING LABELS .form-floating { position: relative; .form-input { height: var(--form-floating-height, 56px); padding: var(--form-floating-padding, 20px 16px 8px 16px); &:focus, &:not(:placeholder-shown) { padding: var(--form-floating-padding-active, 20px 16px 8px 16px); } &::placeholder { opacity: 0; transition: opacity var(--form-floating-transition-duration, 0.2s); } &:focus::placeholder { opacity: 1; } } .form-label { position: absolute; top: 50%; left: 16px; margin-bottom: 0; pointer-events: none; transform: translateY(-50%); transition: all var(--form-floating-transition-duration, 0.2s) var(--form-floating-transition-easing, ease); transform-origin: left center; cursor: text; } .form-input:focus ~ .form-label, .form-input:not(:placeholder-shown) ~ .form-label { top: 12px; transform: translateY(0) scale(0.85); opacity: var(--form-floating-label-opacity, 0.7); } } // FORM FEEDBACK .form-feedback { font-size: var(--form-feedback-size, 0.875rem); line-height: var(--form-feedback-line-height, 1.4); margin-top: var(--form-feedback-spacing, 6px); &.form-feedback-error { color: var(--form-error-color, #dc3545); } &.form-feedback-success { color: var(--form-success-color, #28a745); } &.form-feedback-warning { color: var(--form-warning-color, #ffc107); } &.form-feedback-info { color: var(--form-info-color, #17a2b8); } } .form-help-text { font-size: var(--form-help-size, 0.875rem); line-height: var(--form-help-line-height, 1.4); margin-top: var(--form-help-spacing, 6px); opacity: var(--form-help-opacity, 0.7); } // FORM ACTIONS .form-actions { display: flex; gap: var(--form-actions-gap, 12px); align-items: center; padding-top: var(--form-actions-padding, 16px); margin-top: var(--form-actions-margin, 24px); border-top: var(--form-actions-border, 1px solid transparent); &.form-actions-center { justify-content: center; } &.form-actions-end { justify-content: flex-end; } &.form-actions-between { justify-content: space-between; } &.form-actions-stack { flex-direction: column; .btn { width: 100%; } } } @media (max-width: 576px) { .form-actions { flex-direction: column; .btn { width: 100%; } } .form-field-inline { flex-direction: column; align-items: stretch; .form-label { min-width: auto; } } } // FORM VALIDATION .was-validated { .form-input { &:valid { border-color: var(--form-success-color, #28a745); &:focus { border-color: var(--form-success-color, #28a745); box-shadow: var(--form-success-focus-shadow, 0 0 0 0.2rem rgba(40, 167, 69, 0.25)); } } &:invalid { border-color: var(--form-error-color, #dc3545); &:focus { border-color: var(--form-error-color, #dc3545); box-shadow: var(--form-error-focus-shadow, 0 0 0 0.2rem rgba(220, 53, 69, 0.25)); } } } } // ACCESSIBILITY @media (prefers-reduced-motion: reduce) { .form-input, .form-checkbox, .form-radio, .form-floating .form-label { transition: none; } } @media (prefers-contrast: high) { .form-input, .form-select, .form-textarea { border-width: 2px; } .form-checkbox, .form-radio { border-width: 3px; } }DZ8x,// ========================================================================== // BASE NAVIGATION // ========================================================================== // Theme-agnostic navigation structures and behaviors // Visual styling handled by themes // ========================================================================== // NAVIGATION BASE .nav { display: flex; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; list-style: none; gap: var(--nav-gap, 8px); &.nav-vertical { flex-direction: column; } &.nav-horizontal { flex-direction: row; } &.nav-fill { .nav-item { flex: 1 1 auto; text-align: center; } } &.nav-justified { .nav-item { flex-basis: 0; flex-grow: 1; text-align: center; } } } .nav-item { display: flex; } .nav-link { display: block; padding: var(--nav-link-padding, 8px 16px); text-decoration: none; border: var(--nav-link-border, 1px solid transparent); border-radius: var(--nav-link-border-radius, 4px); transition: all var(--nav-link-transition-duration, 0.2s) var(--nav-link-transition-easing, ease); cursor: pointer; position: relative; &:hover { text-decoration: none; } &:focus { outline: var(--nav-link-focus-outline, 2px solid transparent); outline-offset: var(--nav-link-focus-outline-offset, 2px); } &.nav-link-active { // Active state styling handled by themes } &.nav-link-disabled { pointer-events: none; opacity: var(--nav-link-disabled-opacity, 0.6); cursor: not-allowed; } } // NAVIGATION TABS .nav-tabs { border-bottom: var(--nav-tabs-border, 1px solid #dee2e6); .nav-link { margin-bottom: calc(var(--nav-tabs-border-width, 1px) * -1); border: var(--nav-tabs-link-border, 1px solid transparent); border-top-left-radius: var(--nav-tabs-border-radius, 4px); border-top-right-radius: var(--nav-tabs-border-radius, 4px); border-bottom: none; &.nav-link-active { border-bottom: var(--nav-tabs-active-border-bottom, 1px solid transparent); } } } // NAVIGATION PILLS .nav-pills { .nav-link { border-radius: var(--nav-pills-border-radius, 20px); } } // NAVBAR .navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: var(--navbar-padding, 8px 16px); &.navbar-expand { flex-wrap: nowrap; justify-content: flex-start; } &.navbar-fixed-top { position: fixed; top: 0; right: 0; left: 0; z-index: var(--z-navbar, 1030); } &.navbar-fixed-bottom { position: fixed; right: 0; bottom: 0; left: 0; z-index: var(--z-navbar, 1030); } &.navbar-sticky-top { position: sticky; top: 0; z-index: var(--z-navbar, 1030); } } .navbar-brand { display: inline-block; padding-top: var(--navbar-brand-padding-y, 4px); padding-bottom: var(--navbar-brand-padding-y, 4px); margin-right: var(--navbar-brand-margin-end, 16px); font-size: var(--navbar-brand-font-size, 1.25rem); font-weight: var(--navbar-brand-font-weight, 600); line-height: inherit; text-decoration: none; white-space: nowrap; &:hover, &:focus { text-decoration: none; } } .navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin-bottom: 0; list-style: none; .nav-link { padding-right: 0; padding-left: 0; } } .navbar-collapse { align-items: center; width: 100%; flex-basis: 100%; flex-grow: 1; &.navbar-collapse-show { display: flex !important; } } .navbar-toggler { padding: var(--navbar-toggler-padding, 4px 8px); font-size: var(--navbar-toggler-font-size, 1.25rem); line-height: 1; border: var(--navbar-toggler-border, 1px solid transparent); border-radius: var(--navbar-toggler-border-radius, 4px); background: transparent; cursor: pointer; transition: all var(--navbar-toggler-transition-duration, 0.2s); &:focus { outline: var(--navbar-toggler-focus-outline, 2px solid transparent); outline-offset: var(--navbar-toggler-focus-outline-offset, 2px); } &:not(:disabled):not(.disabled):hover { text-decoration: none; } } .navbar-toggler-icon { display: inline-block; width: var(--navbar-toggler-icon-size, 24px); height: var(--navbar-toggler-icon-size, 24px); vertical-align: middle; background-repeat: no-repeat; background-position: center; background-size: 100%; } // RESPONSIVE NAVBAR @media (min-width: 576px) { .navbar-expand-sm { flex-wrap: nowrap; justify-content: flex-start; .navbar-nav { flex-direction: row; .nav-link { padding-right: var(--navbar-nav-link-padding-x, 8px); padding-left: var(--navbar-nav-link-padding-x, 8px); } } .navbar-collapse { display: flex !important; flex-basis: auto; } .navbar-toggler { display: none; } } } @media (min-width: 768px) { .navbar-expand-md { flex-wrap: nowrap; justify-content: flex-start; .navbar-nav { flex-direction: row; .nav-link { padding-right: var(--navbar-nav-link-padding-x, 8px); padding-left: var(--navbar-nav-link-padding-x, 8px); } } .navbar-collapse { display: flex !important; flex-basis: auto; } .navbar-toggler { display: none; } } } @media (min-width: 992px) { .navbar-expand-lg { flex-wrap: nowrap; justify-content: flex-start; .navbar-nav { flex-direction: row; .nav-link { padding-right: var(--navbar-nav-link-padding-x, 8px); padding-left: var(--navbar-nav-link-padding-x, 8px); } } .navbar-collapse { display: flex !important; flex-basis: auto; } .navbar-toggler { display: none; } } } // BREADCRUMB .breadcrumb { display: flex; flex-wrap: wrap; padding: var(--breadcrumb-padding, 12px 0); margin-bottom: var(--breadcrumb-margin-bottom, 16px); list-style: none; border-radius: var(--breadcrumb-border-radius, 4px); } .breadcrumb-item { display: flex; align-items: center; + .breadcrumb-item { padding-left: var(--breadcrumb-divider-padding, 8px); &::before { content: var(--breadcrumb-divider, '/'); padding-right: var(--breadcrumb-divider-padding, 8px); opacity: var(--breadcrumb-divider-opacity, 0.6); } } &.breadcrumb-item-active { opacity: var(--breadcrumb-active-opacity, 0.6); } .breadcrumb-link { text-decoration: none; transition: all var(--breadcrumb-link-transition-duration, 0.2s); &:hover { text-decoration: underline; } &:focus { outline: var(--breadcrumb-link-focus-outline, 2px solid transparent); outline-offset: var(--breadcrumb-link-focus-outline-offset, 2px); } } } // PAGINATION .pagination { display: flex; padding-left: 0; list-style: none; border-radius: var(--pagination-border-radius, 4px); gap: var(--pagination-gap, 4px); } .pagination-item { &.pagination-item-active .pagination-link { z-index: 3; // Active styling handled by themes } &.pagination-item-disabled .pagination-link { pointer-events: none; opacity: var(--pagination-disabled-opacity, 0.6); cursor: not-allowed; } } .pagination-link { position: relative; display: block; padding: var(--pagination-link-padding, 8px 12px); text-decoration: none; border: var(--pagination-link-border, 1px solid #dee2e6); border-radius: var(--pagination-link-border-radius, 4px); transition: all var(--pagination-link-transition-duration, 0.2s) var(--pagination-link-transition-easing, ease); min-width: var(--pagination-link-min-width, 44px); text-align: center; &:hover { z-index: 2; text-decoration: none; } &:focus { z-index: 3; outline: var(--pagination-link-focus-outline, 2px solid transparent); outline-offset: var(--pagination-link-focus-outline-offset, 2px); } } // PAGINATION SIZES .pagination-sm { .pagination-link { padding: var(--pagination-sm-padding, 4px 8px); font-size: var(--pagination-sm-font-size, 0.875rem); min-width: var(--pagination-sm-min-width, 32px); } } .pagination-lg { .pagination-link { padding: var(--pagination-lg-padding, 12px 16px); font-size: var(--pagination-lg-font-size, 1.125rem); min-width: var(--pagination-lg-min-width, 52px); } } // SIDEBAR NAVIGATION .nav-sidebar { flex-direction: column; width: 100%; .nav-item { width: 100%; } .nav-link { display: flex; align-items: center; padding: var(--nav-sidebar-link-padding, 12px 16px); border-radius: var(--nav-sidebar-link-border-radius, 6px); margin-bottom: var(--nav-sidebar-link-margin, 4px); text-decoration: none; transition: all var(--nav-sidebar-link-transition-duration, 0.2s); position: relative; gap: var(--nav-sidebar-link-gap, 12px); .nav-icon { width: var(--nav-sidebar-icon-size, 20px); height: var(--nav-sidebar-icon-size, 20px); flex-shrink: 0; } .nav-text { flex: 1; min-width: 0; } .nav-badge { margin-left: auto; flex-shrink: 0; } .nav-arrow { margin-left: auto; transition: transform var(--nav-sidebar-arrow-transition-duration, 0.2s); flex-shrink: 0; } &.nav-link-expandable { cursor: pointer; &.nav-link-expanded .nav-arrow { transform: rotate(180deg); } } &.nav-link-active { // Active styling handled by themes &::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: var(--nav-sidebar-active-indicator-width, 4px); border-radius: var(--nav-sidebar-active-indicator-radius, 0 2px 2px 0); // Color handled by themes } } } .nav-submenu { margin-left: var(--nav-sidebar-submenu-indent, 32px); margin-top: var(--nav-sidebar-submenu-margin, 4px); padding-left: var(--nav-sidebar-submenu-padding, 16px); border-left: var(--nav-sidebar-submenu-border, 1px solid rgba(0, 0, 0, 0.1)); .nav-link { padding: var(--nav-sidebar-submenu-link-padding, 8px 12px); font-size: var(--nav-sidebar-submenu-font-size, 0.875rem); } } } // MOBILE NAVIGATION @media (max-width: 768px) { .nav-sidebar { .nav-link { padding: var(--nav-sidebar-mobile-padding, 16px); font-size: var(--nav-sidebar-mobile-font-size, 1rem); } } .navbar-collapse { display: none; &.navbar-collapse-show { display: block !important; } } .navbar-nav { .nav-item { margin: var(--navbar-mobile-item-margin, 4px 0); } .nav-link { padding: var(--navbar-mobile-link-padding, 12px 16px); } } } // ACCESSIBILITY @media (prefers-reduced-motion: reduce) { .nav-link, .navbar-toggler, .breadcrumb-link, .pagination-link, .nav-sidebar .nav-arrow { transition: none; } } @media (prefers-contrast: high) { .nav-link, .navbar-toggler, .pagination-link { border-width: 2px; } .nav-link:focus, .navbar-toggler:focus, .breadcrumb-link:focus, .pagination-link:focus { outline-width: 3px; } }Ōx3X// ========================================================================== // UTILITY COMPONENTS // ========================================================================== // Small, reusable utility components // Theme-agnostic structures and behaviors // ========================================================================== // BADGES .badge { display: inline-block; padding: var(--badge-padding, 4px 8px); font-size: var(--badge-font-size, 0.75rem); font-weight: var(--badge-font-weight, 500); line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: var(--badge-border-radius, 4px); transition: all var(--badge-transition-duration, 0.2s); &.badge-pill { padding: var(--badge-pill-padding, 4px 12px); border-radius: var(--badge-pill-border-radius, 10em); } &.badge-dot { width: var(--badge-dot-size, 8px); height: var(--badge-dot-size, 8px); padding: 0; border-radius: 50%; } &.badge-lg { padding: var(--badge-lg-padding, 8px 12px); font-size: var(--badge-lg-font-size, 0.875rem); } &.badge-sm { padding: var(--badge-sm-padding, 2px 6px); font-size: var(--badge-sm-font-size, 0.625rem); } } // ALERTS .alert { position: relative; padding: var(--alert-padding, 16px 20px); margin-bottom: var(--alert-margin-bottom, 16px); border: var(--alert-border, 1px solid transparent); border-radius: var(--alert-border-radius, 6px); .alert-title { margin: 0 0 var(--alert-title-margin, 8px) 0; font-size: var(--alert-title-size, 1rem); font-weight: var(--alert-title-weight, 600); } .alert-content { margin: 0; p:last-child { margin-bottom: 0; } } .alert-actions { margin-top: var(--alert-actions-margin, 12px); display: flex; gap: var(--alert-actions-gap, 8px); } .alert-close { position: absolute; top: var(--alert-close-top, 12px); right: var(--alert-close-right, 12px); padding: var(--alert-close-padding, 4px); background: transparent; border: none; cursor: pointer; opacity: var(--alert-close-opacity, 0.7); transition: opacity var(--alert-close-transition-duration, 0.2s); width: var(--alert-close-size, 24px); height: var(--alert-close-size, 24px); display: flex; align-items: center; justify-content: center; &:hover { opacity: 1; } &:focus { outline: var(--alert-close-focus-outline, 2px solid transparent); outline-offset: var(--alert-close-focus-outline-offset, 2px); } } &.alert-dismissible { padding-right: var(--alert-dismissible-padding-right, 48px); } } // TOOLTIPS (Structure only - positioning handled by JS) .tooltip { position: absolute; z-index: var(--z-tooltip, 1070); display: block; margin: var(--tooltip-margin, 0); font-size: var(--tooltip-font-size, 0.875rem); line-height: var(--tooltip-line-height, 1.4); opacity: 0; pointer-events: none; transition: opacity var(--tooltip-transition-duration, 0.2s); &.tooltip-show { opacity: 1; } .tooltip-arrow { position: absolute; display: block; width: var(--tooltip-arrow-size, 8px); height: var(--tooltip-arrow-size, 8px); } .tooltip-inner { max-width: var(--tooltip-max-width, 200px); padding: var(--tooltip-padding, 8px 12px); text-align: center; border-radius: var(--tooltip-border-radius, 4px); } } // POPOVER (Structure only - positioning handled by JS) .popover { position: absolute; top: 0; left: 0; z-index: var(--z-popover, 1060); display: block; max-width: var(--popover-max-width, 276px); font-size: var(--popover-font-size, 0.875rem); line-height: var(--popover-line-height, 1.6); word-wrap: break-word; border: var(--popover-border, 1px solid rgba(0, 0, 0, 0.2)); border-radius: var(--popover-border-radius, 6px); opacity: 0; pointer-events: none; transition: opacity var(--popover-transition-duration, 0.2s); &.popover-show { opacity: 1; pointer-events: auto; } .popover-arrow { position: absolute; display: block; width: var(--popover-arrow-size, 12px); height: var(--popover-arrow-size, 12px); } .popover-header { padding: var(--popover-header-padding, 12px 16px); margin: 0; font-size: var(--popover-header-font-size, 1rem); font-weight: var(--popover-header-font-weight, 600); border-bottom: var(--popover-header-border, 1px solid rgba(0, 0, 0, 0.1)); border-top-left-radius: inherit; border-top-right-radius: inherit; &:empty { display: none; } } .popover-body { padding: var(--popover-body-padding, 16px); } } // DROPDOWN .dropdown { position: relative; display: inline-block; } .dropdown-toggle { &::after { display: inline-block; margin-left: var(--dropdown-caret-spacing, 8px); vertical-align: middle; content: ''; border-top: var(--dropdown-caret-size, 4px) solid; border-right: var(--dropdown-caret-size, 4px) solid transparent; border-bottom: 0; border-left: var(--dropdown-caret-size, 4px) solid transparent; transition: transform var(--dropdown-caret-transition-duration, 0.2s); } &[aria-expanded="true"]::after { transform: rotate(180deg); } &.dropdown-toggle-no-caret::after { display: none; } } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: var(--z-dropdown, 1000); display: none; float: left; min-width: var(--dropdown-min-width, 160px); padding: var(--dropdown-padding, 8px 0); margin: var(--dropdown-margin, 2px 0 0); font-size: var(--dropdown-font-size, 1rem); text-align: left; list-style: none; border: var(--dropdown-border, 1px solid rgba(0, 0, 0, 0.15)); border-radius: var(--dropdown-border-radius, 6px); box-shadow: var(--dropdown-box-shadow, 0 6px 12px rgba(0, 0, 0, 0.175)); background-clip: padding-box; &.dropdown-menu-end { right: 0; left: auto; } &.dropdown-menu-show { display: block; } } .dropdown-item { display: block; width: 100%; padding: var(--dropdown-item-padding, 6px 20px); clear: both; font-weight: normal; line-height: var(--dropdown-item-line-height, 1.5); text-align: inherit; text-decoration: none; white-space: nowrap; border: 0; background: transparent; cursor: pointer; transition: all var(--dropdown-item-transition-duration, 0.2s); &:focus { outline: var(--dropdown-item-focus-outline, 2px solid transparent); outline-offset: var(--dropdown-item-focus-outline-offset, -2px); } &.dropdown-item-active { // Active styling handled by themes } &.dropdown-item-disabled { pointer-events: none; opacity: var(--dropdown-item-disabled-opacity, 0.5); } } .dropdown-divider { height: 0; margin: var(--dropdown-divider-margin, 4px 0); overflow: hidden; border-top: 1px solid var(--dropdown-divider-color, rgba(0, 0, 0, 0.15)); } .dropdown-header { display: block; padding: var(--dropdown-header-padding, 4px 20px); margin-bottom: 0; font-size: var(--dropdown-header-font-size, 0.875rem); font-weight: var(--dropdown-header-font-weight, 600); line-height: var(--dropdown-header-line-height, 1.5); white-space: nowrap; opacity: var(--dropdown-header-opacity, 0.6); } // MODAL (Structure only - overlay/backdrop handled separately) .modal { position: fixed; top: 0; left: 0; z-index: var(--z-modal, 1050); width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; outline: 0; opacity: 0; pointer-events: none; transition: opacity var(--modal-transition-duration, 0.3s) var(--modal-transition-easing, ease); &.modal-show { opacity: 1; pointer-events: auto; } } .modal-dialog { position: relative; width: auto; margin: var(--modal-margin, 16px); pointer-events: none; transform: translateY(-50px); transition: transform var(--modal-transition-duration, 0.3s) var(--modal-transition-easing, ease); .modal-show & { transform: translateY(0); } @media (min-width: 576px) { max-width: var(--modal-sm-max-width, 500px); margin: var(--modal-margin-sm, 32px auto); } &.modal-sm { @media (min-width: 576px) { max-width: var(--modal-sm-width, 300px); } } &.modal-lg { @media (min-width: 992px) { max-width: var(--modal-lg-width, 800px); } } &.modal-xl { @media (min-width: 1200px) { max-width: var(--modal-xl-width, 1140px); } } &.modal-fullscreen { width: 100vw; max-width: none; height: 100%; margin: 0; .modal-content { height: 100%; border: 0; border-radius: 0; } } } .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-clip: padding-box; border: var(--modal-content-border, 1px solid rgba(0, 0, 0, 0.2)); border-radius: var(--modal-content-border-radius, 6px); outline: 0; } .modal-backdrop { position: fixed; top: 0; left: 0; z-index: var(--z-modal-backdrop, 1040); width: 100vw; height: 100vh; background-color: var(--modal-backdrop-bg, rgba(0, 0, 0, 0.5)); opacity: 0; transition: opacity var(--modal-backdrop-transition-duration, 0.15s) linear; &.modal-backdrop-show { opacity: 1; } } .modal-header { display: flex; align-items: center; justify-content: space-between; padding: var(--modal-header-padding, 16px 24px); border-bottom: var(--modal-header-border, 1px solid rgba(0, 0, 0, 0.125)); border-top-left-radius: inherit; border-top-right-radius: inherit; .modal-title { margin: 0; line-height: var(--modal-title-line-height, 1.5); font-size: var(--modal-title-font-size, 1.25rem); font-weight: var(--modal-title-font-weight, 600); } } .modal-body { position: relative; flex: 1 1 auto; padding: var(--modal-body-padding, 24px); } .modal-footer { display: flex; align-items: center; justify-content: flex-end; gap: var(--modal-footer-gap, 8px); padding: var(--modal-footer-padding, 16px 24px); border-top: var(--modal-footer-border, 1px solid rgba(0, 0, 0, 0.125)); border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; &.modal-footer-center { justify-content: center; } &.modal-footer-between { justify-content: space-between; } } // ACCORDION .accordion { border-radius: var(--accordion-border-radius, 6px); overflow: hidden; } .accordion-item { border: var(--accordion-item-border, 1px solid rgba(0, 0, 0, 0.125)); &:not(:first-child) { border-top: none; } &:first-child { border-top-left-radius: var(--accordion-border-radius, 6px); border-top-right-radius: var(--accordion-border-radius, 6px); } &:last-child { border-bottom-left-radius: var(--accordion-border-radius, 6px); border-bottom-right-radius: var(--accordion-border-radius, 6px); } } .accordion-header { margin-bottom: 0; } .accordion-button { position: relative; display: flex; align-items: center; width: 100%; padding: var(--accordion-button-padding, 16px 20px); font-size: var(--accordion-button-font-size, 1rem); font-weight: var(--accordion-button-font-weight, 500); text-align: left; background: transparent; border: 0; border-radius: 0; overflow-anchor: none; transition: all var(--accordion-button-transition-duration, 0.2s) var(--accordion-button-transition-easing, ease); cursor: pointer; &:focus { z-index: 3; outline: var(--accordion-button-focus-outline, 2px solid transparent); outline-offset: var(--accordion-button-focus-outline-offset, -2px); } &::after { flex-shrink: 0; width: var(--accordion-icon-size, 16px); height: var(--accordion-icon-size, 16px); margin-left: auto; content: ''; background-image: var(--accordion-button-icon, url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E")); background-repeat: no-repeat; background-size: var(--accordion-icon-size, 16px); transition: transform var(--accordion-icon-transition-duration, 0.2s) var(--accordion-icon-transition-easing, ease); } &:not(.accordion-button-collapsed)::after { transform: rotate(180deg); } } .accordion-collapse { overflow: hidden; transition: height var(--accordion-collapse-transition-duration, 0.3s) var(--accordion-collapse-transition-easing, ease); } .accordion-body { padding: var(--accordion-body-padding, 16px 20px); } // ACCESSIBILITY @media (prefers-reduced-motion: reduce) { .alert-close, .tooltip, .popover, .dropdown-toggle::after, .modal, .modal-dialog, .modal-backdrop, .accordion-button, .accordion-button::after, .accordion-collapse { transition: none; } } @media (prefers-contrast: high) { .alert, .popover, .dropdown-menu, .modal-content, .accordion-item { border-width: 2px; } .alert-close:focus, .dropdown-item:focus, .accordion-button:focus { outline-width: 3px; } }fxc// ========================================================================== // CONTENT CONTAINERS // ========================================================================== // Theme-agnostic content container structures // Focus on layout, spacing, and behavior - not visual styling // ========================================================================== // PAGE CONTAINERS .page-container { min-height: 100vh; display: flex; flex-direction: column; &.page-centered { align-items: center; justify-content: center; } &.page-top-aligned { justify-content: flex-start; } } .page-header { flex-shrink: 0; position: relative; z-index: var(--z-page-header, 50); &.page-header-sticky { position: sticky; top: 0; } &.page-header-fixed { position: fixed; top: 0; left: 0; right: 0; } } .page-content { flex: 1; display: flex; flex-direction: column; position: relative; } .page-footer { flex-shrink: 0; margin-top: auto; } // MAIN CONTENT AREAS .main-content { flex: 1; width: 100%; max-width: var(--content-max-width, none); margin: 0 auto; padding: var(--content-padding, 24px); &.main-content-narrow { max-width: var(--content-max-width-narrow, 768px); } &.main-content-wide { max-width: var(--content-max-width-wide, 1400px); } &.main-content-full { max-width: none; padding: 0; } } // CONTENT SECTIONS .content-section { margin-bottom: var(--section-spacing, 48px); &:last-child { margin-bottom: 0; } &.content-section-compact { margin-bottom: var(--section-spacing-compact, 24px); } &.content-section-spacious { margin-bottom: var(--section-spacing-spacious, 72px); } } .section-header { margin-bottom: var(--section-header-spacing, 24px); .section-title { margin: 0 0 var(--section-title-spacing, 8px) 0; font-size: var(--section-title-size, 1.5rem); font-weight: var(--section-title-weight, 600); } .section-subtitle { margin: 0; opacity: 0.7; } .section-actions { margin-top: var(--section-actions-spacing, 16px); } } .section-content { position: relative; } // ARTICLE CONTAINERS .article-container { max-width: var(--article-max-width, 65ch); margin: 0 auto; padding: var(--article-padding, 24px); .article-header { margin-bottom: var(--article-header-spacing, 32px); text-align: center; .article-title { margin: 0 0 var(--article-title-spacing, 16px) 0; font-size: var(--article-title-size, 2rem); font-weight: var(--article-title-weight, 700); } .article-meta { margin-bottom: var(--article-meta-spacing, 24px); opacity: 0.7; } } .article-content { line-height: var(--article-line-height, 1.6); > * + * { margin-top: var(--article-element-spacing, 1.5em); } } .article-footer { margin-top: var(--article-footer-spacing, 48px); padding-top: var(--article-footer-padding, 24px); border-top: 1px solid var(--border-color, #e5e5e5); } } // SIDEBAR CONTAINERS .content-with-sidebar { display: flex; gap: var(--sidebar-gap, 32px); align-items: flex-start; .main-column { flex: 1; min-width: 0; // Prevents flex item overflow } .sidebar-column { flex-shrink: 0; width: var(--sidebar-width, 300px); } &.sidebar-left { flex-direction: row; } &.sidebar-right { flex-direction: row-reverse; } } @media (max-width: 768px) { .content-with-sidebar { flex-direction: column; gap: var(--sidebar-gap-mobile, 24px); .sidebar-column { width: 100%; } &.sidebar-right { flex-direction: column; } } } // CARD CONTAINERS .card-container { display: flex; flex-direction: column; position: relative; word-wrap: break-word; background-clip: border-box; .card-header { flex-shrink: 0; padding: var(--card-header-padding, 16px 24px); border-bottom: 1px solid var(--border-color, transparent); &:first-child { border-top-left-radius: inherit; border-top-right-radius: inherit; } &.card-header-borderless { border-bottom: none; } } .card-body { flex: 1; padding: var(--card-body-padding, 24px); &.card-body-compact { padding: var(--card-body-padding-compact, 16px); } &.card-body-spacious { padding: var(--card-body-padding-spacious, 32px); } } .card-footer { flex-shrink: 0; padding: var(--card-footer-padding, 16px 24px); border-top: 1px solid var(--border-color, transparent); &:last-child { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; } &.card-footer-borderless { border-top: none; } } } // SPLIT CONTAINERS .split-container { display: flex; min-height: 0; // Allows flex children to shrink &.split-horizontal { flex-direction: row; } &.split-vertical { flex-direction: column; } .split-pane { flex: 1; overflow: auto; position: relative; } .split-resizer { flex-shrink: 0; background: var(--resizer-background, transparent); position: relative; z-index: var(--z-resizer, 10); &.split-resizer-horizontal { width: var(--resizer-size, 4px); cursor: ew-resize; } &.split-resizer-vertical { height: var(--resizer-size, 4px); cursor: ns-resize; } &:hover { background: var(--resizer-background-hover, rgba(0, 0, 0, 0.1)); } } } // SCROLLABLE CONTAINERS .scrollable { overflow: auto; &.scrollable-x { overflow-x: auto; overflow-y: hidden; } &.scrollable-y { overflow-y: auto; overflow-x: hidden; } &.scrollable-hidden { overflow: hidden; } } // CENTERED CONTAINERS .centered-container { display: flex; align-items: center; justify-content: center; min-height: var(--centered-min-height, 400px); &.centered-full-height { min-height: 100vh; } &.centered-content { text-align: center; } }2Bx U// ========================================================================== // DASHBOARD LAYOUTS // ========================================================================== // Theme-agnostic dashboard layout structures // Visual styling handled by themes // ========================================================================== @use '../../semantic' as semantic; // DASHBOARD CONTAINER .dashboard-container { display: grid; grid-template-areas: "sidebar header" "sidebar content"; grid-template-columns: var(--sidebar-width, #{semantic.$semantic-sizing-sidebar-expanded}) 1fr; grid-template-rows: var(--header-height, #{semantic.$semantic-sizing-navbar-height}) 1fr; height: 100vh; overflow: hidden; } // DASHBOARD HEADER .dashboard-header { grid-area: header; display: flex; align-items: center; justify-content: space-between; padding: 0 var(--header-padding, #{semantic.$semantic-spacing-container-card-padding-lg}); z-index: var(--z-header, 100); position: relative; .header-title { font-size: var(--header-title-size, 1.25rem); font-weight: var(--header-title-weight, 600); margin: 0; } .header-actions { display: flex; align-items: center; gap: var(--header-actions-gap, #{semantic.$semantic-spacing-component-padding-md}); } } // DASHBOARD SIDEBAR .dashboard-sidebar { grid-area: sidebar; display: flex; flex-direction: column; overflow-y: auto; z-index: var(--z-sidebar, 90); position: relative; .sidebar-header { padding: var(--sidebar-header-padding, #{semantic.$semantic-spacing-container-card-padding-lg}); flex-shrink: 0; } .sidebar-nav { flex: 1; padding: 0 var(--sidebar-nav-padding, #{semantic.$semantic-spacing-component-padding-md}); overflow-y: auto; } .sidebar-footer { padding: var(--sidebar-footer-padding, #{semantic.$semantic-spacing-component-padding-md}); flex-shrink: 0; } // Sidebar state classes &.sidebar-is-collapsed { width: var(--sidebar-width-collapsed, #{semantic.$semantic-sizing-sidebar-collapsed}); .sidebar-text, .sidebar-nav-text { opacity: 0; visibility: hidden; transition: opacity var(--transition-duration, 0.2s) var(--transition-easing, ease); } .sidebar-nav-item { justify-content: center; padding: #{semantic.$semantic-spacing-component-padding-sm}; } } &.sidebar-overlay-mode { position: fixed; top: 0; left: 0; bottom: 0; width: var(--sidebar-width, #{semantic.$semantic-sizing-sidebar-expanded}); z-index: var(--z-sidebar-overlay, 1000); transform: translateX(-100%); transition: transform var(--transition-duration, 0.3s) var(--transition-easing, ease); &.sidebar-open { transform: translateX(0); } } &.sidebar-fixed-position { position: fixed; top: 0; left: 0; bottom: 0; } } // DASHBOARD CONTENT .dashboard-content { grid-area: content; overflow-y: auto; padding: var(--content-padding, #{semantic.$semantic-spacing-container-card-padding-lg}); position: relative; &.dashboard-content-full { padding: 0; } &.dashboard-content-constrained { max-width: var(--content-max-width, #{semantic.$semantic-sizing-content-wide}); margin: 0 auto; } // Content state classes &.content-with-padding { padding: var(--content-padding, #{semantic.$semantic-spacing-container-card-padding-lg}); } &.content-is-scrollable { overflow-y: auto; overflow-x: hidden; max-height: calc(100vh - var(--header-height, #{semantic.$semantic-sizing-navbar-height})); scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)) var(--scrollbar-track, transparent); // Webkit scrollbar styling &::-webkit-scrollbar { width: #{$base-spacing-2}; // 8px height: #{$base-spacing-2}; } &::-webkit-scrollbar-track { background: var(--scrollbar-track, transparent); border-radius: #{$base-border-radius-sm}; } &::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)); border-radius: #{$base-border-radius-sm}; border: 1px solid var(--scrollbar-thumb-border, transparent); &:hover { background: var(--scrollbar-thumb-hover, rgba(0, 0, 0, 0.3)); } &:active { background: var(--scrollbar-thumb-active, rgba(0, 0, 0, 0.4)); } } // Invisible scrollbar variant &.scrollbar-invisible { scrollbar-width: none; -ms-overflow-style: none; &::-webkit-scrollbar { display: none; } } } &.content-is-centered { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } &.content-has-breadcrumbs { .content-breadcrumbs { margin-bottom: #{semantic.$semantic-spacing-content-paragraph}; padding-bottom: #{semantic.$semantic-spacing-component-padding-sm}; border-bottom: #{semantic.$semantic-border-divider-width} solid var(--content-breadcrumb-border, transparent); } } // Content header styling .content-header { margin-bottom: #{semantic.$semantic-spacing-layout-section-sm}; .content-title { font-size: var(--content-title-size, 2rem); font-weight: var(--content-title-weight, 600); margin: 0 0 #{semantic.$semantic-spacing-component-padding-sm} 0; line-height: var(--content-title-line-height, 1.2); } .content-subtitle { font-size: var(--content-subtitle-size, 1.125rem); color: var(--content-subtitle-color, rgba(0, 0, 0, 0.6)); margin: 0; line-height: var(--content-subtitle-line-height, 1.4); } } // Content actions styling .content-actions { margin-top: #{semantic.$semantic-spacing-layout-section-sm}; padding-top: #{semantic.$semantic-spacing-component-padding-md}; border-top: #{semantic.$semantic-border-divider-width} solid var(--content-actions-border, transparent); display: flex; gap: #{semantic.$semantic-spacing-component-padding-sm}; justify-content: flex-end; align-items: center; } } // COLLAPSIBLE SIDEBAR VARIANT .dashboard-container.sidebar-collapsed { grid-template-columns: var(--sidebar-width-collapsed, 72px) 1fr; .dashboard-sidebar { .sidebar-text { display: none; } } } // RESPONSIVE DASHBOARD @media (max-width: 768px) { .dashboard-container { grid-template-areas: "header" "content"; grid-template-columns: 1fr; grid-template-rows: var(--header-height, 64px) 1fr; } .dashboard-sidebar { position: fixed; top: var(--header-height, 64px); left: 0; bottom: 0; width: var(--sidebar-width, 280px); transform: translateX(-100%); transition: transform var(--transition-duration, 0.3s) var(--transition-easing, ease); z-index: var(--z-sidebar-mobile, 1000); &.sidebar-open { transform: translateX(0); } } .dashboard-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; visibility: hidden; transition: all var(--transition-duration, 0.3s) var(--transition-easing, ease); z-index: var(--z-overlay, 999); pointer-events: none; &.overlay-active { opacity: 1; visibility: visible; pointer-events: all; } } } // DASHBOARD GRID LAYOUTS .dashboard-grid { display: grid; gap: var(--dashboard-grid-gap, 24px); &.grid-2-cols { grid-template-columns: repeat(2, 1fr); } &.grid-3-cols { grid-template-columns: repeat(3, 1fr); } &.grid-4-cols { grid-template-columns: repeat(4, 1fr); } &.grid-auto-fill { grid-template-columns: repeat(auto-fill, minmax(var(--grid-min-width, 300px), 1fr)); } &.grid-auto-fit { grid-template-columns: repeat(auto-fit, minmax(var(--grid-min-width, 300px), 1fr)); } } // RESPONSIVE GRID @media (max-width: 1200px) { .dashboard-grid.grid-4-cols { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 900px) { .dashboard-grid.grid-3-cols, .dashboard-grid.grid-4-cols { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .dashboard-grid.grid-2-cols, .dashboard-grid.grid-3-cols, .dashboard-grid.grid-4-cols { grid-template-columns: 1fr; } }"Xx// ========================================================================== // GRID SYSTEMS // ========================================================================== // Flexible grid system supporting 12-column, CSS Grid, and Flexbox layouts // Theme-agnostic structural definitions // ========================================================================== // CSS VARIABLES - Using base design tokens :root { --grid-columns: 12; --grid-gap: #{$base-spacing-6}; // 24px -> 1.5rem --grid-gap-sm: #{$base-spacing-4}; // 16px -> 1rem --grid-gap-lg: #{$base-spacing-8}; // 32px -> 2rem --grid-max-width: #{$base-sizing-max-width-screen-xl}; // 1280px --grid-padding: #{$base-spacing-6}; // 24px -> 1.5rem } // CONTAINER SYSTEM .container { width: 100%; max-width: var(--grid-max-width); margin: 0 auto; padding: 0 var(--grid-padding); &.container-fluid { max-width: none; } &.container-sm { max-width: #{$base-breakpoint-sm}; } &.container-md { max-width: #{$base-breakpoint-md}; } &.container-lg { max-width: #{$base-breakpoint-lg}; } &.container-xl { max-width: #{$base-breakpoint-xl}; } &.container-xxl { max-width: #{$base-breakpoint-2xl}; } // Container state classes &.container-is-fluid { max-width: none; width: 100%; } &.container-no-gutters { padding-left: 0; padding-right: 0; } &.container-max-sm, &.container-max-md, &.container-max-lg, &.container-max-xl, &.container-max-xxl { // These classes are applied dynamically by the component // and use the existing container-* classes above } } // FLEXBOX GRID SYSTEM .row { display: flex; flex-wrap: wrap; margin: calc(var(--grid-gap) / -2); &.row-no-gutters { margin: 0; > .col, > [class*="col-"] { padding: 0; } } &.row-gap-sm { margin: calc(var(--grid-gap-sm) / -2); } &.row-gap-lg { margin: calc(var(--grid-gap-lg) / -2); } // Row state classes from components &.row-without-gutters { margin: 0; > .col, > [class*="col-"] { padding: 0; } } &.row-justify-start { justify-content: flex-start; } &.row-justify-center { justify-content: center; } &.row-justify-end { justify-content: flex-end; } &.row-justify-around { justify-content: space-around; } &.row-justify-between { justify-content: space-between; } &.row-justify-evenly { justify-content: space-evenly; } &.row-align-start { align-items: flex-start; } &.row-align-center { align-items: center; } &.row-align-end { align-items: flex-end; } &.row-align-stretch { align-items: stretch; } &.row-align-baseline { align-items: baseline; } } .col { flex: 1 0 0%; padding: calc(var(--grid-gap) / 2); } // RESPONSIVE COLUMNS @for $i from 1 through 12 { .col-#{$i} { flex: 0 0 auto; width: percentage($i / 12); padding: calc(var(--grid-gap) / 2); } } // BREAKPOINT-SPECIFIC COLUMNS @media (min-width: 576px) { @for $i from 1 through 12 { .col-sm-#{$i} { flex: 0 0 auto; width: percentage($i / 12); } } .col-sm { flex: 1 0 0%; } } @media (min-width: 768px) { @for $i from 1 through 12 { .col-md-#{$i} { flex: 0 0 auto; width: percentage($i / 12); } } .col-md { flex: 1 0 0%; } } @media (min-width: 992px) { @for $i from 1 through 12 { .col-lg-#{$i} { flex: 0 0 auto; width: percentage($i / 12); } } .col-lg { flex: 1 0 0%; } } @media (min-width: 1200px) { @for $i from 1 through 12 { .col-xl-#{$i} { flex: 0 0 auto; width: percentage($i / 12); } } .col-xl { flex: 1 0 0%; } } // CSS GRID SYSTEM .grid { display: grid; gap: var(--grid-gap); &.grid-12 { grid-template-columns: repeat(12, 1fr); } &.grid-auto { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); } &.grid-auto-fill { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); } } // GRID SPANS @for $i from 1 through 12 { .span-#{$i} { grid-column: span #{$i}; } } // GRID POSITIONING @for $i from 1 through 12 { .col-start-#{$i} { grid-column-start: #{$i}; } .col-end-#{$i} { grid-column-end: #{$i}; } .row-start-#{$i} { grid-row-start: #{$i}; } .row-end-#{$i} { grid-row-end: #{$i}; } } // RESPONSIVE GRID SPANS @media (min-width: 576px) { @for $i from 1 through 12 { .span-sm-#{$i} { grid-column: span #{$i}; } } } @media (min-width: 768px) { @for $i from 1 through 12 { .span-md-#{$i} { grid-column: span #{$i}; } } } @media (min-width: 992px) { @for $i from 1 through 12 { .span-lg-#{$i} { grid-column: span #{$i}; } } } @media (min-width: 1200px) { @for $i from 1 through 12 { .span-xl-#{$i} { grid-column: span #{$i}; } } } // ALIGNMENT UTILITIES .justify-start { justify-content: start; } .justify-end { justify-content: end; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .justify-around { justify-content: space-around; } .justify-evenly { justify-content: space-evenly; } .align-start { align-content: start; } .align-end { align-content: end; } .align-center { align-content: center; } .align-between { align-content: space-between; } .align-around { align-content: space-around; } .align-evenly { align-content: space-evenly; } .items-start { align-items: start; } .items-end { align-items: end; } .items-center { align-items: center; } .items-baseline { align-items: baseline; } .items-stretch { align-items: stretch; } .self-start { align-self: start; } .self-end { align-self: end; } .self-center { align-self: center; } .self-baseline { align-self: baseline; } .self-stretch { align-self: stretch; } // RESPONSIVE CONTAINERS @media (max-width: 575px) { .container { padding: 0 16px; } } @media (max-width: 767px) { .row { margin: calc(var(--grid-gap-sm) / -2); } .col, [class*="col-"] { padding: calc(var(--grid-gap-sm) / 2); } .grid { gap: var(--grid-gap-sm); } }VDx// ========================================================================== // LAYOUT SYSTEM // ========================================================================== // Core layout utilities and patterns for the application shell // ========================================================================== // Layout variables :root { --header-height: 64px; --sidenav-width-expanded: 240px; --sidenav-width-rail: 64px; --sidenav-width-hidden: 0px; } // ========================================================================== // LAYOUT CONTAINERS // ========================================================================== .layout-container { width: 100%; height: 100vh; overflow: hidden; display: flex; flex-direction: column; } .layout-header { position: fixed; top: 0; left: 0; right: 0; height: var(--header-height); z-index: 1000; background-color: var(--surface-elevated, #ffffff); border-bottom: 1px solid var(--border-secondary, #e5e5e5); } .layout-body { flex: 1; display: flex; margin-top: var(--header-height); overflow: hidden; } .layout-sidebar { flex-shrink: 0; height: 100%; background-color: var(--surface-elevated, #ffffff); border-right: 1px solid var(--border-secondary, #e5e5e5); transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1); &.sidebar-expanded { width: var(--sidenav-width-expanded); } &.sidebar-rail { width: var(--sidenav-width-rail); } &.sidebar-hidden { width: var(--sidenav-width-hidden); } } .layout-main { flex: 1; overflow: hidden; display: flex; flex-direction: column; } .layout-content { flex: 1; overflow: auto; padding: 1.5rem; background-color: var(--surface-primary, #fafafa); } // ========================================================================== // RESPONSIVE LAYOUT UTILITIES // ========================================================================== @media (max-width: 768px) { .layout-sidebar { position: fixed; top: var(--header-height); left: 0; height: calc(100vh - var(--header-height)); z-index: 900; transform: translateX(-100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); &.sidebar-visible { transform: translateX(0); width: 280px; box-shadow: 4px 0 24px rgba(0, 0, 0, 0.15); } } .layout-main { margin-left: 0 !important; } .layout-content { padding: 1rem; } } // ========================================================================== // LAYOUT STATE UTILITIES // ========================================================================== .layout-no-scroll { overflow: hidden; } .layout-with-sidebar-expanded .layout-main { margin-left: var(--sidenav-width-expanded); } .layout-with-sidebar-rail .layout-main { margin-left: var(--sidenav-width-rail); } .layout-with-sidebar-hidden .layout-main { margin-left: var(--sidenav-width-hidden); } // ========================================================================== // LAYOUT ANIMATIONS // ========================================================================== @keyframes slideInFromLeft { from { transform: translateX(-100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } } @keyframes slideOutToLeft { from { transform: translateX(0); opacity: 1; } to { transform: translateX(-100%); opacity: 0; } } .layout-animation-enter { animation: slideInFromLeft 0.3s cubic-bezier(0.4, 0, 0.2, 1); } .layout-animation-leave { animation: slideOutToLeft 0.3s cubic-bezier(0.4, 0, 0.2, 1); } // ========================================================================== // LAYOUT FOCUS MANAGEMENT // ========================================================================== .layout-focus-trap { position: relative; } .layout-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 800; opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; &.active { opacity: 1; visibility: visible; } }ۯx// ========================================================================== // PAGE TEMPLATES // ========================================================================== // Common page layout templates for different application pages // Structural definitions without visual theming // ========================================================================== // LANDING PAGE TEMPLATE .landing-page { display: flex; flex-direction: column; min-height: 100vh; .landing-hero { flex-shrink: 0; display: flex; align-items: center; justify-content: center; min-height: var(--hero-min-height, 60vh); text-align: center; position: relative; overflow: hidden; .hero-content { max-width: var(--hero-content-max-width, 800px); padding: var(--hero-content-padding, 48px 24px); z-index: 2; position: relative; } .hero-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } } .landing-features { flex-shrink: 0; padding: var(--features-padding, 80px 24px); .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--features-gap, 48px); max-width: var(--features-max-width, 1200px); margin: 0 auto; } } .landing-cta { flex-shrink: 0; text-align: center; padding: var(--cta-padding, 80px 24px); } } // DASHBOARD PAGE TEMPLATE .dashboard-page { display: flex; flex-direction: column; height: 100vh; .dashboard-nav { flex-shrink: 0; z-index: var(--z-nav, 100); } .dashboard-body { flex: 1; display: flex; overflow: hidden; } .dashboard-main { flex: 1; display: flex; flex-direction: column; overflow: hidden; } } // PROFILE PAGE TEMPLATE .profile-page { max-width: var(--profile-max-width, 1000px); margin: 0 auto; padding: var(--profile-padding, 24px); .profile-header { display: flex; align-items: flex-start; gap: var(--profile-header-gap, 24px); margin-bottom: var(--profile-header-spacing, 48px); .profile-avatar { flex-shrink: 0; width: var(--profile-avatar-size, 120px); height: var(--profile-avatar-size, 120px); border-radius: var(--profile-avatar-radius, 50%); overflow: hidden; } .profile-info { flex: 1; min-width: 0; .profile-name { margin: 0 0 var(--profile-name-spacing, 8px) 0; font-size: var(--profile-name-size, 2rem); font-weight: var(--profile-name-weight, 600); } .profile-bio { margin: 0 0 var(--profile-bio-spacing, 16px) 0; opacity: 0.7; } .profile-actions { display: flex; gap: var(--profile-actions-gap, 12px); flex-wrap: wrap; } } } .profile-content { display: grid; grid-template-columns: 2fr 1fr; gap: var(--profile-content-gap, 48px); align-items: flex-start; .profile-main { min-width: 0; } .profile-sidebar { min-width: 0; } } } @media (max-width: 768px) { .profile-page { .profile-header { flex-direction: column; text-align: center; .profile-info { text-align: center; } } .profile-content { grid-template-columns: 1fr; gap: var(--profile-content-gap-mobile, 32px); } } } // SETTINGS PAGE TEMPLATE .settings-page { max-width: var(--settings-max-width, 800px); margin: 0 auto; padding: var(--settings-padding, 24px); .settings-nav { margin-bottom: var(--settings-nav-spacing, 32px); .nav-tabs { display: flex; gap: var(--nav-tabs-gap, 24px); border-bottom: 1px solid var(--border-color, #e5e5e5); .nav-tab { padding: var(--nav-tab-padding, 12px 0); border-bottom: 2px solid transparent; cursor: pointer; transition: all var(--transition-duration, 0.2s); &.nav-tab-active { border-bottom-color: var(--primary-color, #007bff); } } } } .settings-content { .settings-section { margin-bottom: var(--settings-section-spacing, 48px); &:last-child { margin-bottom: 0; } .section-title { margin: 0 0 var(--section-title-spacing, 24px) 0; font-size: var(--section-title-size, 1.25rem); font-weight: var(--section-title-weight, 600); } .section-description { margin: 0 0 var(--section-description-spacing, 24px) 0; opacity: 0.7; } .setting-item { display: flex; justify-content: space-between; align-items: flex-start; padding: var(--setting-item-padding, 16px 0); border-bottom: 1px solid var(--border-color-light, #f0f0f0); &:last-child { border-bottom: none; } .setting-info { flex: 1; margin-right: var(--setting-info-spacing, 24px); .setting-label { margin: 0 0 var(--setting-label-spacing, 4px) 0; font-weight: var(--setting-label-weight, 500); } .setting-description { margin: 0; opacity: 0.7; font-size: var(--setting-description-size, 0.875rem); } } .setting-control { flex-shrink: 0; } } } } } // ERROR PAGE TEMPLATE .error-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; text-align: center; padding: var(--error-page-padding, 24px); .error-content { max-width: var(--error-content-max-width, 600px); .error-code { font-size: var(--error-code-size, 6rem); font-weight: var(--error-code-weight, 700); line-height: 1; margin: 0 0 var(--error-code-spacing, 24px) 0; } .error-title { font-size: var(--error-title-size, 2rem); font-weight: var(--error-title-weight, 600); margin: 0 0 var(--error-title-spacing, 16px) 0; } .error-message { margin: 0 0 var(--error-message-spacing, 32px) 0; opacity: 0.7; } .error-actions { display: flex; justify-content: center; gap: var(--error-actions-gap, 16px); flex-wrap: wrap; } } } // AUTH PAGE TEMPLATE .auth-page { display: flex; min-height: 100vh; .auth-visual { flex: 1; display: none; position: relative; overflow: hidden; @media (min-width: 768px) { display: flex; } .auth-visual-content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 2; } .auth-visual-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } } .auth-form-container { flex-shrink: 0; width: 100%; max-width: var(--auth-form-max-width, 480px); display: flex; align-items: center; justify-content: center; padding: var(--auth-form-padding, 48px 24px); .auth-form { width: 100%; max-width: var(--auth-form-width, 400px); .auth-header { text-align: center; margin-bottom: var(--auth-header-spacing, 48px); .auth-title { margin: 0 0 var(--auth-title-spacing, 16px) 0; font-size: var(--auth-title-size, 2rem); font-weight: var(--auth-title-weight, 600); } .auth-subtitle { margin: 0; opacity: 0.7; } } .auth-footer { text-align: center; margin-top: var(--auth-footer-spacing, 32px); } } } }3<x #// ========================================================================== // RESPONSIVE LAYOUTS // ========================================================================== // Responsive layout utilities and patterns // Mobile-first approach with progressive enhancement // ========================================================================== // RESPONSIVE BREAKPOINTS (from base/_breakpoints.scss) $breakpoints: ( xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px, xxl: 1400px ) !default; // RESPONSIVE UTILITIES .d-none { display: none !important; } .d-block { display: block !important; } .d-flex { display: flex !important; } .d-grid { display: grid !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-inline-flex { display: inline-flex !important; } // RESPONSIVE DISPLAY UTILITIES @media (max-width: 575px) { .d-xs-none { display: none !important; } .d-xs-block { display: block !important; } .d-xs-flex { display: flex !important; } .d-xs-grid { display: grid !important; } .d-xs-inline { display: inline !important; } .d-xs-inline-block { display: inline-block !important; } .d-xs-inline-flex { display: inline-flex !important; } } @media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-block { display: block !important; } .d-sm-flex { display: flex !important; } .d-sm-grid { display: grid !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-inline-flex { display: inline-flex !important; } } @media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-block { display: block !important; } .d-md-flex { display: flex !important; } .d-md-grid { display: grid !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-inline-flex { display: inline-flex !important; } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-block { display: block !important; } .d-lg-flex { display: flex !important; } .d-lg-grid { display: grid !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-inline-flex { display: inline-flex !important; } } @media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-block { display: block !important; } .d-xl-flex { display: flex !important; } .d-xl-grid { display: grid !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-inline-flex { display: inline-flex !important; } } // RESPONSIVE FLEX DIRECTION .flex-column { flex-direction: column !important; } .flex-row { flex-direction: row !important; } .flex-column-reverse { flex-direction: column-reverse !important; } .flex-row-reverse { flex-direction: row-reverse !important; } @media (max-width: 575px) { .flex-xs-column { flex-direction: column !important; } .flex-xs-row { flex-direction: row !important; } .flex-xs-column-reverse { flex-direction: column-reverse !important; } .flex-xs-row-reverse { flex-direction: row-reverse !important; } } @media (min-width: 576px) { .flex-sm-column { flex-direction: column !important; } .flex-sm-row { flex-direction: row !important; } .flex-sm-column-reverse { flex-direction: column-reverse !important; } .flex-sm-row-reverse { flex-direction: row-reverse !important; } } @media (min-width: 768px) { .flex-md-column { flex-direction: column !important; } .flex-md-row { flex-direction: row !important; } .flex-md-column-reverse { flex-direction: column-reverse !important; } .flex-md-row-reverse { flex-direction: row-reverse !important; } } // RESPONSIVE LAYOUT PATTERNS .mobile-stack { @media (max-width: 767px) { flex-direction: column !important; > * { width: 100% !important; margin-bottom: var(--mobile-stack-gap, 16px); &:last-child { margin-bottom: 0; } } } } .tablet-stack { @media (max-width: 991px) { flex-direction: column !important; > * { width: 100% !important; margin-bottom: var(--tablet-stack-gap, 20px); &:last-child { margin-bottom: 0; } } } } // RESPONSIVE SPACING .p-responsive { padding: var(--spacing-mobile, 16px); @media (min-width: 768px) { padding: var(--spacing-tablet, 24px); } @media (min-width: 1200px) { padding: var(--spacing-desktop, 32px); } } .m-responsive { margin: var(--spacing-mobile, 16px); @media (min-width: 768px) { margin: var(--spacing-tablet, 24px); } @media (min-width: 1200px) { margin: var(--spacing-desktop, 32px); } } // RESPONSIVE TEXT ALIGNMENT .text-center { text-align: center !important; } .text-left { text-align: left !important; } .text-right { text-align: right !important; } @media (max-width: 575px) { .text-xs-center { text-align: center !important; } .text-xs-left { text-align: left !important; } .text-xs-right { text-align: right !important; } } @media (min-width: 576px) { .text-sm-center { text-align: center !important; } .text-sm-left { text-align: left !important; } .text-sm-right { text-align: right !important; } } @media (min-width: 768px) { .text-md-center { text-align: center !important; } .text-md-left { text-align: left !important; } .text-md-right { text-align: right !important; } } // RESPONSIVE LAYOUT COMPONENTS .responsive-sidebar { display: flex; gap: var(--sidebar-gap, 32px); .sidebar-main { flex: 1; min-width: 0; } .sidebar-aside { flex-shrink: 0; width: var(--sidebar-width, 300px); } @media (max-width: 991px) { flex-direction: column; gap: var(--sidebar-gap-mobile, 24px); .sidebar-aside { width: 100%; order: -1; // Move sidebar to top on mobile } &.sidebar-bottom { .sidebar-aside { order: 1; // Keep sidebar at bottom } } } } .responsive-cards { display: grid; gap: var(--cards-gap, 24px); grid-template-columns: 1fr; @media (min-width: 576px) { grid-template-columns: repeat(2, 1fr); } @media (min-width: 768px) { grid-template-columns: repeat(3, 1fr); } @media (min-width: 1200px) { grid-template-columns: repeat(4, 1fr); } &.cards-auto-fit { grid-template-columns: repeat(auto-fit, minmax(var(--card-min-width, 280px), 1fr)); } &.cards-2-max { @media (min-width: 768px) { grid-template-columns: repeat(2, 1fr); } } &.cards-3-max { @media (min-width: 1200px) { grid-template-columns: repeat(3, 1fr); } } } .responsive-hero { padding: var(--hero-padding-mobile, 48px 16px); text-align: center; @media (min-width: 768px) { padding: var(--hero-padding-tablet, 80px 24px); } @media (min-width: 1200px) { padding: var(--hero-padding-desktop, 120px 32px); } .hero-title { font-size: var(--hero-title-mobile, 2rem); @media (min-width: 768px) { font-size: var(--hero-title-tablet, 3rem); } @media (min-width: 1200px) { font-size: var(--hero-title-desktop, 4rem); } } .hero-subtitle { font-size: var(--hero-subtitle-mobile, 1rem); @media (min-width: 768px) { font-size: var(--hero-subtitle-tablet, 1.25rem); } @media (min-width: 1200px) { font-size: var(--hero-subtitle-desktop, 1.5rem); } } } // RESPONSIVE NAVIGATION .responsive-nav { display: flex; align-items: center; justify-content: space-between; padding: var(--nav-padding, 16px 24px); .nav-brand { flex-shrink: 0; } .nav-menu { display: flex; align-items: center; gap: var(--nav-menu-gap, 24px); @media (max-width: 767px) { position: fixed; top: 0; left: 0; right: 0; bottom: 0; flex-direction: column; justify-content: center; background: var(--nav-mobile-bg, white); transform: translateX(-100%); transition: transform 0.3s ease; z-index: var(--z-nav-mobile, 1000); &.nav-menu-open { transform: translateX(0); } } } .nav-toggle { display: none; flex-direction: column; gap: 4px; padding: 8px; border: none; background: transparent; cursor: pointer; @media (max-width: 767px) { display: flex; } .nav-toggle-bar { width: 24px; height: 2px; background: currentColor; transition: all 0.3s ease; } &.nav-toggle-active { .nav-toggle-bar:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); } .nav-toggle-bar:nth-child(2) { opacity: 0; } .nav-toggle-bar:nth-child(3) { transform: rotate(-45deg) translate(7px, -6px); } } } }N xX// ========================================================================== // CONTENT PATTERNS // ========================================================================== // Theme-agnostic content layout patterns and structures // Visual styling handled by themes - includes component-specific classes // ========================================================================== // COMPONENT-SPECIFIC CONTENT PATTERNS // These classes are used by our Angular components // ARTICLE PATTERNS .content-article { display: block; width: 100%; max-width: var(--article-max-width, #{$semantic-sizing-content-medium}); margin: 0 auto; &.article-is-featured { max-width: var(--article-featured-max-width, #{$semantic-sizing-content-wide}); .article-title { font-size: var(--article-featured-title-size, 3rem); line-height: var(--article-featured-title-line-height, 1.1); } } &.article-is-compact { max-width: var(--article-compact-max-width, #{$semantic-sizing-content-narrow}); .article-header { margin-bottom: #{$semantic-spacing-component-padding-md}; } .article-title { font-size: var(--article-compact-title-size, 1.5rem); } } &.article-has-lead-image { .article-lead-image { margin-bottom: #{$semantic-spacing-content-paragraph}; img { width: 100%; height: auto; display: block; border-radius: var(--article-image-border-radius, #{$semantic-border-card-radius}); } } } // Article structure .article-header { margin-bottom: #{$semantic-spacing-layout-section-sm}; .article-title { font-size: var(--article-title-size, 2.5rem); font-weight: var(--article-title-weight, 700); line-height: var(--article-title-line-height, 1.2); margin: 0 0 #{$semantic-spacing-component-padding-sm} 0; } .article-subtitle { font-size: var(--article-subtitle-size, 1.25rem); font-weight: var(--article-subtitle-weight, 400); line-height: var(--article-subtitle-line-height, 1.4); margin: 0 0 #{$semantic-spacing-component-padding-md} 0; color: var(--article-subtitle-color, rgba(0, 0, 0, 0.6)); } .article-meta { display: flex; flex-wrap: wrap; gap: #{$semantic-spacing-component-padding-sm}; align-items: center; font-size: var(--article-meta-size, 0.875rem); color: var(--article-meta-color, rgba(0, 0, 0, 0.5)); } } .article-content { line-height: var(--article-content-line-height, 1.7); font-size: var(--article-content-size, 1rem); > * + * { margin-top: #{$semantic-spacing-content-paragraph}; } } .article-footer { margin-top: #{$semantic-spacing-layout-section-sm}; padding-top: #{$semantic-spacing-component-padding-md}; border-top: #{$semantic-border-divider-width} solid var(--article-footer-border, transparent); } } // HERO PATTERNS .content-hero { position: relative; display: flex; align-items: center; justify-content: center; min-height: var(--hero-min-height, 60vh); overflow: hidden; &.hero-is-fullscreen { min-height: 100vh; height: 100vh; } &.hero-content-centered { text-align: center; .hero-content { display: flex; flex-direction: column; align-items: center; justify-content: center; } } &.hero-has-background { .hero-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; .hero-bg-image { width: 100%; height: 100%; object-fit: cover; object-position: center; } } } &.hero-has-overlay-effect { .hero-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--hero-overlay-color, rgba(0, 0, 0, 0.3)); z-index: 2; } } .hero-content { position: relative; z-index: 3; padding: #{$semantic-spacing-layout-section-md}; max-width: var(--hero-content-max-width, #{$semantic-sizing-content-medium}); width: 100%; .hero-title { font-size: var(--hero-title-size, 3.5rem); font-weight: var(--hero-title-weight, 800); line-height: var(--hero-title-line-height, 1.1); margin: 0 0 #{$semantic-spacing-component-padding-lg} 0; } .hero-subtitle { font-size: var(--hero-subtitle-size, 1.5rem); font-weight: var(--hero-subtitle-weight, 400); line-height: var(--hero-subtitle-line-height, 1.3); margin: 0 0 #{$semantic-spacing-component-padding-md} 0; color: var(--hero-subtitle-color, rgba(0, 0, 0, 0.7)); } .hero-description { font-size: var(--hero-description-size, 1.125rem); line-height: var(--hero-description-line-height, 1.6); margin: 0 0 #{$semantic-spacing-layout-section-sm} 0; color: var(--hero-description-color, rgba(0, 0, 0, 0.8)); } .hero-actions { display: flex; gap: #{$semantic-spacing-component-padding-md}; flex-wrap: wrap; align-items: center; } } // Responsive hero @media (max-width: #{$base-breakpoint-md}) { .hero-content { padding: #{$semantic-spacing-layout-section-sm}; .hero-title { font-size: var(--hero-mobile-title-size, 2.5rem); } .hero-subtitle { font-size: var(--hero-mobile-subtitle-size, 1.25rem); } } } } // SECTION PATTERNS .content-section { width: 100%; &.section-is-padded { padding: #{$semantic-spacing-layout-section-md} 0; } &.section-is-contained { max-width: var(--section-max-width, #{$semantic-sizing-content-medium}); margin: 0 auto; padding-left: #{$semantic-spacing-component-padding-lg}; padding-right: #{$semantic-spacing-component-padding-lg}; } &.section-content-centered { text-align: center; .section-header, .section-content { display: flex; flex-direction: column; align-items: center; } } &.section-is-highlighted { position: relative; &::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: #{$base-spacing-1}; background: var(--section-highlight-color, currentColor); opacity: var(--section-highlight-opacity, 0.3); } padding-left: #{$semantic-spacing-component-padding-lg}; } .section-header { margin-bottom: #{$semantic-spacing-layout-section-xs}; .section-title { font-size: var(--section-title-size, 2rem); font-weight: var(--section-title-weight, 600); line-height: var(--section-title-line-height, 1.2); margin: 0 0 #{$semantic-spacing-component-padding-sm} 0; } .section-subtitle { font-size: var(--section-subtitle-size, 1.125rem); font-weight: var(--section-subtitle-weight, 400); line-height: var(--section-subtitle-line-height, 1.4); margin: 0; color: var(--section-subtitle-color, rgba(0, 0, 0, 0.6)); } } .section-content { line-height: var(--section-content-line-height, 1.6); } .section-actions { margin-top: #{$semantic-spacing-layout-section-xs}; display: flex; gap: #{$semantic-spacing-component-padding-sm}; flex-wrap: wrap; align-items: center; } } // MEDIA PATTERNS .content-media { display: block; width: 100%; &.media-is-responsive { .media-container { position: relative; width: 100%; img, video, audio { max-width: 100%; height: auto; display: block; } } } &.media-is-rounded { .media-container { border-radius: var(--media-border-radius, #{$semantic-border-card-radius}); overflow: hidden; } } &.media-has-caption { .media-caption { padding: #{$semantic-spacing-component-padding-sm} 0; .caption-text { font-size: var(--media-caption-size, 0.875rem); line-height: var(--media-caption-line-height, 1.4); color: var(--media-caption-color, rgba(0, 0, 0, 0.6)); margin: 0; font-style: var(--media-caption-style, italic); } &.media-caption-top { order: -1; } &.media-caption-bottom { order: 1; } } } &.media-has-overlay { .media-container { position: relative; .media-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--media-overlay-color, rgba(0, 0, 0, 0.3)); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity var(--transition-duration, 0.3s) var(--transition-easing, ease); } &:hover .media-overlay { opacity: 1; } } } // Media layouts &.media-layout-featured { .media-container { aspect-ratio: var(--media-featured-aspect-ratio, 16/9); img, video { width: 100%; height: 100%; object-fit: cover; } } } &.media-layout-thumbnail { max-width: var(--media-thumbnail-size, #{$base-sizing-width-32}); .media-container { aspect-ratio: var(--media-thumbnail-aspect-ratio, 1); img, video { width: 100%; height: 100%; object-fit: cover; } } } &.media-layout-gallery { .media-container { aspect-ratio: var(--media-gallery-aspect-ratio, 4/3); img, video { width: 100%; height: 100%; object-fit: cover; } } } // Media types &.media-type-image { .media-image { &.media-cover { object-fit: cover; } &.media-contain { object-fit: contain; } } } &.media-type-video, &.media-type-audio { .media-video, .media-audio { width: 100%; background: var(--media-player-bg, #000); } } &.media-type-embed { .media-embed { position: relative; width: 100%; height: 0; padding-bottom: var(--media-embed-aspect-ratio, 56.25%); // 16:9 default iframe, object, embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } } } } // ========================================================================== // LEGACY CONTENT PATTERNS - EXISTING PATTERNS BELOW // ========================================================================== // MEDIA OBJECT PATTERN .media { display: flex; align-items: flex-start; gap: var(--media-gap, 16px); .media-object { flex-shrink: 0; width: var(--media-object-size, auto); height: var(--media-object-size, auto); border-radius: var(--media-object-border-radius, 4px); &.media-object-circle { border-radius: 50%; } &.media-object-sm { --media-object-size: 32px; } &.media-object-lg { --media-object-size: 64px; } } .media-body { flex: 1; min-width: 0; // Prevents flex item overflow .media-heading { margin: 0 0 var(--media-heading-margin, 8px) 0; font-size: var(--media-heading-size, 1rem); font-weight: var(--media-heading-weight, 600); } .media-content { margin: 0; line-height: var(--media-content-line-height, 1.5); } .media-meta { margin-top: var(--media-meta-margin, 8px); font-size: var(--media-meta-size, 0.875rem); opacity: var(--media-meta-opacity, 0.7); } } &.media-reverse { flex-direction: row-reverse; } &.media-top { align-items: flex-start; } &.media-middle { align-items: center; } &.media-bottom { align-items: flex-end; } // Nested media objects .media { margin-top: var(--media-nested-margin, 16px); } } @media (max-width: 576px) { .media { --media-gap: 12px; &.media-stack-mobile { flex-direction: column; .media-object { align-self: center; } .media-body { text-align: center; } } } } // HERO SECTIONS .hero { position: relative; display: flex; align-items: center; justify-content: center; min-height: var(--hero-min-height, 400px); padding: var(--hero-padding, 80px 24px); text-align: center; overflow: hidden; .hero-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; &.hero-background-image { background-size: cover; background-position: center; background-repeat: no-repeat; } &.hero-background-video { video { width: 100%; height: 100%; object-fit: cover; } } &.hero-background-overlay::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--hero-overlay, rgba(0, 0, 0, 0.4)); } } .hero-content { position: relative; z-index: 1; max-width: var(--hero-content-max-width, 800px); width: 100%; .hero-title { margin: 0 0 var(--hero-title-margin, 24px) 0; font-size: var(--hero-title-size, 3rem); font-weight: var(--hero-title-weight, 700); line-height: var(--hero-title-line-height, 1.2); } .hero-subtitle { margin: 0 0 var(--hero-subtitle-margin, 32px) 0; font-size: var(--hero-subtitle-size, 1.25rem); line-height: var(--hero-subtitle-line-height, 1.5); opacity: var(--hero-subtitle-opacity, 0.9); } .hero-actions { display: flex; gap: var(--hero-actions-gap, 16px); justify-content: center; flex-wrap: wrap; } } &.hero-left { text-align: left; justify-content: flex-start; .hero-actions { justify-content: flex-start; } } &.hero-right { text-align: right; justify-content: flex-end; .hero-actions { justify-content: flex-end; } } &.hero-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--hero-split-gap, 48px); text-align: left; .hero-content { display: flex; flex-direction: column; justify-content: center; } .hero-media { display: flex; align-items: center; justify-content: center; img, video { max-width: 100%; height: auto; border-radius: var(--hero-media-border-radius, 8px); } } } } @media (max-width: 768px) { .hero { --hero-padding: 60px 16px; --hero-title-size: 2rem; --hero-subtitle-size: 1rem; &.hero-split { grid-template-columns: 1fr; text-align: center; .hero-media { order: -1; } .hero-actions { justify-content: center; } } .hero-actions { flex-direction: column; .btn { width: 100%; } } } } // FEATURE SECTIONS .features { padding: var(--features-padding, 80px 0); .features-header { text-align: center; margin-bottom: var(--features-header-margin, 64px); .features-title { margin: 0 0 var(--features-title-margin, 16px) 0; font-size: var(--features-title-size, 2.5rem); font-weight: var(--features-title-weight, 700); } .features-subtitle { margin: 0; font-size: var(--features-subtitle-size, 1.125rem); opacity: var(--features-subtitle-opacity, 0.8); max-width: var(--features-subtitle-max-width, 600px); margin-left: auto; margin-right: auto; } } .features-grid { display: grid; gap: var(--features-grid-gap, 48px); grid-template-columns: 1fr; @media (min-width: 768px) { grid-template-columns: repeat(2, 1fr); } @media (min-width: 992px) { grid-template-columns: repeat(3, 1fr); } &.features-grid-2-col { @media (min-width: 768px) { grid-template-columns: repeat(2, 1fr); } } &.features-grid-4-col { @media (min-width: 1200px) { grid-template-columns: repeat(4, 1fr); } } } .feature-item { text-align: center; .feature-icon { width: var(--feature-icon-size, 64px); height: var(--feature-icon-size, 64px); margin: 0 auto var(--feature-icon-margin, 24px) auto; display: flex; align-items: center; justify-content: center; border-radius: var(--feature-icon-border-radius, 12px); } .feature-title { margin: 0 0 var(--feature-title-margin, 16px) 0; font-size: var(--feature-title-size, 1.25rem); font-weight: var(--feature-title-weight, 600); } .feature-description { margin: 0; line-height: var(--feature-description-line-height, 1.6); opacity: var(--feature-description-opacity, 0.8); } &.feature-item-left { text-align: left; .feature-icon { margin-left: 0; margin-right: auto; } } &.feature-item-horizontal { display: flex; gap: var(--feature-horizontal-gap, 24px); text-align: left; .feature-icon { flex-shrink: 0; margin: 0; } .feature-content { flex: 1; } } } } // TESTIMONIAL SECTIONS .testimonials { padding: var(--testimonials-padding, 80px 0); .testimonials-header { text-align: center; margin-bottom: var(--testimonials-header-margin, 64px); .testimonials-title { margin: 0 0 var(--testimonials-title-margin, 16px) 0; font-size: var(--testimonials-title-size, 2.5rem); font-weight: var(--testimonials-title-weight, 700); } .testimonials-subtitle { margin: 0; font-size: var(--testimonials-subtitle-size, 1.125rem); opacity: var(--testimonials-subtitle-opacity, 0.8); } } .testimonials-grid { display: grid; gap: var(--testimonials-grid-gap, 32px); grid-template-columns: 1fr; @media (min-width: 768px) { grid-template-columns: repeat(2, 1fr); } @media (min-width: 992px) { grid-template-columns: repeat(3, 1fr); } } .testimonial-item { display: flex; flex-direction: column; padding: var(--testimonial-padding, 32px); border-radius: var(--testimonial-border-radius, 12px); border: var(--testimonial-border, 1px solid rgba(0, 0, 0, 0.1)); .testimonial-content { flex: 1; margin-bottom: var(--testimonial-content-margin, 24px); font-size: var(--testimonial-content-size, 1rem); line-height: var(--testimonial-content-line-height, 1.6); font-style: italic; &::before { content: '"'; } &::after { content: '"'; } } .testimonial-author { display: flex; align-items: center; gap: var(--testimonial-author-gap, 16px); .author-avatar { width: var(--author-avatar-size, 48px); height: var(--author-avatar-size, 48px); border-radius: 50%; flex-shrink: 0; } .author-info { .author-name { margin: 0 0 var(--author-name-margin, 4px) 0; font-size: var(--author-name-size, 1rem); font-weight: var(--author-name-weight, 600); } .author-title { margin: 0; font-size: var(--author-title-size, 0.875rem); opacity: var(--author-title-opacity, 0.7); } } } } } // CALL TO ACTION SECTIONS .cta { padding: var(--cta-padding, 80px 24px); text-align: center; position: relative; overflow: hidden; .cta-background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; } .cta-content { position: relative; z-index: 1; max-width: var(--cta-content-max-width, 600px); margin: 0 auto; .cta-title { margin: 0 0 var(--cta-title-margin, 24px) 0; font-size: var(--cta-title-size, 2.5rem); font-weight: var(--cta-title-weight, 700); line-height: var(--cta-title-line-height, 1.2); } .cta-subtitle { margin: 0 0 var(--cta-subtitle-margin, 32px) 0; font-size: var(--cta-subtitle-size, 1.125rem); line-height: var(--cta-subtitle-line-height, 1.5); opacity: var(--cta-subtitle-opacity, 0.9); } .cta-actions { display: flex; gap: var(--cta-actions-gap, 16px); justify-content: center; flex-wrap: wrap; } } &.cta-split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--cta-split-gap, 48px); align-items: center; text-align: left; .cta-content { max-width: none; margin: 0; .cta-actions { justify-content: flex-start; } } .cta-visual { display: flex; align-items: center; justify-content: center; img, video { max-width: 100%; height: auto; border-radius: var(--cta-visual-border-radius, 8px); } } } } @media (max-width: 768px) { .cta { --cta-padding: 60px 16px; --cta-title-size: 2rem; --cta-subtitle-size: 1rem; &.cta-split { grid-template-columns: 1fr; text-align: center; .cta-visual { order: -1; } .cta-content .cta-actions { justify-content: center; } } .cta-actions { flex-direction: column; .btn { width: 100%; } } } } // STATS/METRICS SECTIONS .stats { padding: var(--stats-padding, 80px 0); .stats-grid { display: grid; gap: var(--stats-grid-gap, 32px); grid-template-columns: 1fr; @media (min-width: 576px) { grid-template-columns: repeat(2, 1fr); } @media (min-width: 992px) { grid-template-columns: repeat(4, 1fr); } } .stat-item { text-align: center; .stat-number { display: block; font-size: var(--stat-number-size, 3rem); font-weight: var(--stat-number-weight, 700); line-height: var(--stat-number-line-height, 1); margin-bottom: var(--stat-number-margin, 8px); } .stat-label { font-size: var(--stat-label-size, 1rem); font-weight: var(--stat-label-weight, 500); opacity: var(--stat-label-opacity, 0.8); margin: 0; } .stat-description { margin-top: var(--stat-description-margin, 8px); font-size: var(--stat-description-size, 0.875rem); opacity: var(--stat-description-opacity, 0.6); } } }xD+// ========================================================================== // INTERACTION PATTERNS // ========================================================================== // Common interaction and state patterns // Theme-agnostic behavioral styles // ========================================================================== // HOVER EFFECTS .hover-lift { transition: transform var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { transform: var(--hover-lift-transform, translateY(-4px)); } } .hover-scale { transition: transform var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { transform: var(--hover-scale-transform, scale(1.05)); } } .hover-glow { transition: box-shadow var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { box-shadow: var(--hover-glow-shadow, 0 0 20px rgba(0, 0, 0, 0.15)); } } .hover-fade { transition: opacity var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { opacity: var(--hover-fade-opacity, 0.8); } } .hover-brighten { transition: filter var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { filter: brightness(var(--hover-brighten-value, 1.1)); } } .hover-darken { transition: filter var(--hover-transition-duration, 0.2s) var(--hover-transition-easing, ease); &:hover { filter: brightness(var(--hover-darken-value, 0.9)); } } // FOCUS STATES .focus-ring { &:focus, &:focus-visible { outline: var(--focus-ring-width, 2px) solid var(--focus-ring-color, #007bff); outline-offset: var(--focus-ring-offset, 2px); } } .focus-ring-inset { &:focus, &:focus-visible { outline: var(--focus-ring-width, 2px) solid var(--focus-ring-color, #007bff); outline-offset: var(--focus-ring-inset-offset, -2px); } } .focus-glow { &:focus, &:focus-visible { box-shadow: var(--focus-glow-shadow, 0 0 0 3px rgba(0, 123, 255, 0.25)); outline: none; } } // ACTIVE STATES .active-press { transition: transform var(--active-transition-duration, 0.1s) var(--active-transition-easing, ease); &:active { transform: var(--active-press-transform, scale(0.98)); } } .active-sink { transition: transform var(--active-transition-duration, 0.1s) var(--active-transition-easing, ease); &:active { transform: var(--active-sink-transform, translateY(2px)); } } // LOADING STATES .loading { position: relative; pointer-events: none; &::after { content: ''; position: absolute; top: 50%; left: 50%; width: var(--loading-spinner-size, 20px); height: var(--loading-spinner-size, 20px); margin-top: calc(var(--loading-spinner-size, 20px) / -2); margin-left: calc(var(--loading-spinner-size, 20px) / -2); border: 2px solid var(--loading-spinner-color, rgba(0, 0, 0, 0.3)); border-top-color: var(--loading-spinner-active-color, #007bff); border-radius: 50%; animation: loading-spin var(--loading-spin-duration, 1s) linear infinite; z-index: 1; } &.loading-overlay::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--loading-overlay-bg, rgba(255, 255, 255, 0.8)); z-index: 0; } } @keyframes loading-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .loading-pulse { animation: loading-pulse var(--loading-pulse-duration, 2s) infinite; } @keyframes loading-pulse { 0%, 100% { opacity: 1; } 50% { opacity: var(--loading-pulse-opacity, 0.5); } } .loading-skeleton { background: var(--skeleton-bg, #f0f0f0); background-image: linear-gradient( 90deg, var(--skeleton-bg, #f0f0f0), var(--skeleton-highlight, #e0e0e0), var(--skeleton-bg, #f0f0f0) ); background-size: 200px 100%; background-repeat: no-repeat; animation: loading-shimmer var(--skeleton-duration, 1.5s) infinite; border-radius: var(--skeleton-border-radius, 4px); } @keyframes loading-shimmer { 0% { background-position: -200px 0; } 100% { background-position: calc(200px + 100%) 0; } } // DISABLED STATES .disabled, [disabled] { opacity: var(--disabled-opacity, 0.6); pointer-events: none; cursor: not-allowed; } .disabled-loading { opacity: var(--disabled-loading-opacity, 0.8); pointer-events: none; cursor: wait; } // SUCCESS STATES .success-flash { animation: success-flash var(--success-flash-duration, 0.5s) ease-in-out; } @keyframes success-flash { 0%, 100% { background-color: transparent; } 50% { background-color: var(--success-flash-color, rgba(40, 167, 69, 0.2)); } } .success-checkmark { position: relative; &::after { content: '✓'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--success-color, #28a745); font-size: var(--success-checkmark-size, 1.5rem); font-weight: bold; animation: success-checkmark-appear var(--success-checkmark-duration, 0.3s) ease-in-out; } } @keyframes success-checkmark-appear { 0% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } } // ERROR STATES .error-shake { animation: error-shake var(--error-shake-duration, 0.5s) ease-in-out; } @keyframes error-shake { 0%, 20%, 40%, 60%, 80%, 100% { transform: translateX(0); } 10%, 50%, 90% { transform: translateX(-5px); } 30%, 70% { transform: translateX(5px); } } .error-flash { animation: error-flash var(--error-flash-duration, 0.5s) ease-in-out; } @keyframes error-flash { 0%, 100% { background-color: transparent; } 50% { background-color: var(--error-flash-color, rgba(220, 53, 69, 0.2)); } } // WARNING STATES .warning-pulse { animation: warning-pulse var(--warning-pulse-duration, 2s) infinite; } @keyframes warning-pulse { 0%, 100% { opacity: 1; } 50% { opacity: var(--warning-pulse-opacity, 0.7); } } // DRAG AND DROP STATES .draggable { cursor: grab; user-select: none; transition: transform var(--draggable-transition-duration, 0.2s) var(--draggable-transition-easing, ease); &:active { cursor: grabbing; } &.dragging { cursor: grabbing; opacity: var(--dragging-opacity, 0.8); transform: var(--dragging-transform, rotate(5deg)); z-index: var(--z-dragging, 1000); } } .drop-zone { transition: all var(--drop-zone-transition-duration, 0.2s) var(--drop-zone-transition-easing, ease); border: 2px dashed transparent; border-radius: var(--drop-zone-border-radius, 8px); padding: var(--drop-zone-padding, 20px); &.drop-zone-active { border-color: var(--drop-zone-active-border, #007bff); background-color: var(--drop-zone-active-bg, rgba(0, 123, 255, 0.05)); } &.drop-zone-invalid { border-color: var(--drop-zone-invalid-border, #dc3545); background-color: var(--drop-zone-invalid-bg, rgba(220, 53, 69, 0.05)); } } // SELECTION STATES .selectable { cursor: pointer; transition: all var(--selectable-transition-duration, 0.2s) var(--selectable-transition-easing, ease); border: var(--selectable-border-width, 2px) solid transparent; border-radius: var(--selectable-border-radius, 4px); &:hover { border-color: var(--selectable-hover-border, rgba(0, 123, 255, 0.5)); } &.selected { border-color: var(--selectable-selected-border, #007bff); background-color: var(--selectable-selected-bg, rgba(0, 123, 255, 0.05)); } &.selecting { opacity: var(--selecting-opacity, 0.7); transform: var(--selecting-transform, scale(0.98)); } } // EXPANDABLE CONTENT .expandable { overflow: hidden; transition: height var(--expandable-transition-duration, 0.3s) var(--expandable-transition-easing, ease); &.expanding { transition: height var(--expanding-transition-duration, 0.3s) var(--expanding-transition-easing, ease-out); } &.collapsing { transition: height var(--collapsing-transition-duration, 0.3s) var(--collapsing-transition-easing, ease-in); } } .expandable-trigger { cursor: pointer; display: flex; align-items: center; gap: var(--expandable-trigger-gap, 8px); .expand-icon { transition: transform var(--expand-icon-transition-duration, 0.2s) var(--expand-icon-transition-easing, ease); } &.expanded .expand-icon { transform: var(--expand-icon-expanded-transform, rotate(180deg)); } } // SORTABLE LISTS .sortable { .sortable-item { cursor: move; user-select: none; transition: all var(--sortable-transition-duration, 0.2s) var(--sortable-transition-easing, ease); &.sortable-ghost { opacity: var(--sortable-ghost-opacity, 0.5); background: var(--sortable-ghost-bg, rgba(0, 123, 255, 0.1)); } &.sortable-chosen { opacity: var(--sortable-chosen-opacity, 0.8); transform: var(--sortable-chosen-transform, scale(1.02)); } } .sortable-handle { cursor: grab; display: flex; align-items: center; justify-content: center; padding: var(--sortable-handle-padding, 8px); opacity: var(--sortable-handle-opacity, 0.6); transition: opacity var(--sortable-handle-transition-duration, 0.2s); &:hover { opacity: 1; } &:active { cursor: grabbing; } } } // RIPPLE EFFECT .ripple-effect { position: relative; overflow: hidden; &::before { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: var(--ripple-color, rgba(255, 255, 255, 0.3)); transform: translate(-50%, -50%); transition: width var(--ripple-duration, 0.6s), height var(--ripple-duration, 0.6s); pointer-events: none; } &.ripple-active::before { width: var(--ripple-size, 200px); height: var(--ripple-size, 200px); } } // FLOATING ELEMENTS .floating { animation: floating var(--floating-duration, 3s) ease-in-out infinite; } @keyframes floating { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(var(--floating-distance, -10px)); } } .bob { animation: bob var(--bob-duration, 2s) ease-in-out infinite; } @keyframes bob { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(var(--bob-distance, -10px)); } 60% { transform: translateY(var(--bob-distance-small, -5px)); } } // ACCESSIBILITY ENHANCEMENTS @media (prefers-reduced-motion: reduce) { .hover-lift, .hover-scale, .hover-glow, .hover-fade, .hover-brighten, .hover-darken, .active-press, .active-sink, .expandable, .expandable-trigger .expand-icon, .sortable .sortable-item, .ripple-effect, .floating, .bob { transition: none; animation: none; } .loading::after { animation: none; } .loading-pulse, .loading-skeleton, .warning-pulse { animation: none; } } @media (prefers-contrast: high) { .focus-ring:focus, .focus-ring:focus-visible { outline-width: 3px; } .selectable { border-width: 3px; } .drop-zone { border-width: 3px; } }zŹxy%// ========================================================================== // LAYOUT PATTERNS // ========================================================================== // Common layout patterns and organizational structures // Theme-agnostic layout behaviors // ========================================================================== // STACK LAYOUT PATTERN .stack { display: flex; flex-direction: column; gap: var(--stack-gap, 16px); &.stack-sm { gap: var(--stack-gap-sm, 8px); } &.stack-lg { gap: var(--stack-gap-lg, 24px); } &.stack-xl { gap: var(--stack-gap-xl, 32px); } &.stack-horizontal { flex-direction: row; align-items: center; } &.stack-center { align-items: center; } &.stack-end { align-items: flex-end; } &.stack-stretch { align-items: stretch; } } // CLUSTER LAYOUT PATTERN (Flexbox wrap) .cluster { display: flex; flex-wrap: wrap; gap: var(--cluster-gap, 16px); align-items: center; &.cluster-start { justify-content: flex-start; } &.cluster-center { justify-content: center; } &.cluster-end { justify-content: flex-end; } &.cluster-between { justify-content: space-between; } &.cluster-around { justify-content: space-around; } &.cluster-evenly { justify-content: space-evenly; } &.cluster-baseline { align-items: baseline; } &.cluster-stretch { align-items: stretch; } } // SIDEBAR LAYOUT PATTERN .sidebar-layout { display: flex; gap: var(--sidebar-gap, 32px); align-items: flex-start; .sidebar { flex-shrink: 0; width: var(--sidebar-width, 250px); min-width: var(--sidebar-min-width, 200px); } .main-content { flex: 1; min-width: 0; // Prevents flex overflow } &.sidebar-right { flex-direction: row-reverse; } &.sidebar-sticky { .sidebar { position: sticky; top: var(--sidebar-sticky-top, 20px); align-self: flex-start; } } // Responsive behavior &.sidebar-collapse-md { @media (max-width: 768px) { flex-direction: column; gap: var(--sidebar-gap-mobile, 24px); .sidebar { width: 100%; position: static; } } } &.sidebar-collapse-lg { @media (max-width: 992px) { flex-direction: column; gap: var(--sidebar-gap-mobile, 24px); .sidebar { width: 100%; position: static; } } } } // SWITCHER LAYOUT PATTERN (Responsive stack/row) .switcher { display: flex; flex-wrap: wrap; gap: var(--switcher-gap, 16px); > * { flex-grow: 1; flex-basis: calc((var(--switcher-threshold, 30rem) - 100%) * 999); min-width: var(--switcher-min-width, 250px); } &.switcher-no-grow > * { flex-grow: 0; } } // COVER LAYOUT PATTERN (Centered content) .cover { display: flex; flex-direction: column; min-height: var(--cover-min-height, 100vh); padding: var(--cover-padding, 24px); > * { margin-top: var(--cover-spacing, 16px); margin-bottom: var(--cover-spacing, 16px); } > :first-child:not(.cover-centered) { margin-top: 0; } > :last-child:not(.cover-centered) { margin-bottom: 0; } .cover-centered { margin-top: auto; margin-bottom: auto; } } // IMPOSTER LAYOUT PATTERN (Absolute positioning) .imposter { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); &.imposter-contain { max-width: calc(100% - var(--imposter-margin, 32px)); max-height: calc(100% - var(--imposter-margin, 32px)); overflow: auto; } &.imposter-fixed { position: fixed; } &.imposter-top { top: var(--imposter-offset, 20px); transform: translate(-50%, 0); } &.imposter-bottom { top: auto; bottom: var(--imposter-offset, 20px); transform: translate(-50%, 0); } &.imposter-left { left: var(--imposter-offset, 20px); transform: translate(0, -50%); } &.imposter-right { left: auto; right: var(--imposter-offset, 20px); transform: translate(0, -50%); } } // GRID LAYOUT PATTERNS .auto-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--auto-grid-min-width, 250px), 1fr)); gap: var(--auto-grid-gap, 24px); &.auto-grid-fill { grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-width, 250px), 1fr)); } &.auto-grid-dense { grid-auto-flow: dense; } } .reel { display: flex; overflow-x: auto; gap: var(--reel-gap, 16px); padding-bottom: var(--reel-scrollbar-space, 8px); > * { flex-shrink: 0; width: var(--reel-item-width, 250px); } &.reel-auto-width > * { width: auto; min-width: var(--reel-min-width, 200px); } // Snap scrolling &.reel-snap { scroll-snap-type: x mandatory; > * { scroll-snap-align: start; } } // Hide scrollbar &.reel-no-scrollbar { scrollbar-width: none; -ms-overflow-style: none; &::-webkit-scrollbar { display: none; } } } // HOLY GRAIL LAYOUT .holy-grail { display: grid; grid-template-areas: "header header header" "nav main aside" "footer footer footer"; grid-template-rows: auto 1fr auto; grid-template-columns: var(--nav-width, 200px) 1fr var(--aside-width, 200px); min-height: 100vh; gap: var(--holy-grail-gap, 0); .header { grid-area: header; } .nav { grid-area: nav; } .main { grid-area: main; min-width: 0; } .aside { grid-area: aside; } .footer { grid-area: footer; } // Responsive collapse @media (max-width: 768px) { grid-template-areas: "header" "nav" "main" "aside" "footer"; grid-template-columns: 1fr; grid-template-rows: auto auto 1fr auto auto; } } // PANCAKE STACK LAYOUT (Header, flexible content, footer) .pancake-stack { display: grid; grid-template-rows: auto 1fr auto; min-height: var(--pancake-min-height, 100vh); .header { /* Header content */ } .main { /* Main content - grows to fill space */ } .footer { /* Footer content */ } } // MASONRY LAYOUT .masonry { columns: var(--masonry-columns, 3); column-gap: var(--masonry-gap, 24px); > * { break-inside: avoid; margin-bottom: var(--masonry-gap, 24px); } &.masonry-2 { columns: 2; } &.masonry-4 { columns: 4; } &.masonry-5 { columns: 5; } // Responsive columns @media (max-width: 768px) { columns: 1; } @media (min-width: 769px) and (max-width: 1024px) { columns: 2; } } // FLEX EQUAL HEIGHT PATTERN .equal-height { display: flex; > * { flex: 1; display: flex; flex-direction: column; } &.equal-height-baseline { align-items: baseline; } &.equal-height-center { align-items: center; } &.equal-height-end { align-items: flex-end; } } // STICKY FOOTER PATTERN .sticky-footer { display: flex; flex-direction: column; min-height: 100vh; .content { flex: 1; } .footer { margin-top: auto; } } // ASPECT RATIO CONTAINERS .aspect-ratio { position: relative; width: 100%; &::before { content: ''; display: block; padding-top: var(--aspect-ratio, 56.25%); /* 16:9 default */ } > * { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; } &.aspect-1-1 { --aspect-ratio: 100%; /* 1:1 */ } &.aspect-4-3 { --aspect-ratio: 75%; /* 4:3 */ } &.aspect-3-2 { --aspect-ratio: 66.67%; /* 3:2 */ } &.aspect-16-9 { --aspect-ratio: 56.25%; /* 16:9 */ } &.aspect-21-9 { --aspect-ratio: 42.86%; /* 21:9 */ } } // INTRINSIC RATIO (modern aspect-ratio support) @supports (aspect-ratio: 16 / 9) { .intrinsic-ratio { aspect-ratio: var(--intrinsic-ratio, 16 / 9); &.intrinsic-1-1 { aspect-ratio: 1 / 1; } &.intrinsic-4-3 { aspect-ratio: 4 / 3; } &.intrinsic-3-2 { aspect-ratio: 3 / 2; } &.intrinsic-16-9 { aspect-ratio: 16 / 9; } &.intrinsic-21-9 { aspect-ratio: 21 / 9; } } } // QUANTITY QUERIES (Layout based on number of items) .quantity-query { display: flex; flex-wrap: wrap; gap: var(--quantity-gap, 16px); /* Single item - full width */ &:has(> :nth-child(1):nth-last-child(1)) > * { flex-basis: 100%; } /* Two items - 50% each */ &:has(> :nth-child(2):nth-last-child(1)) > * { flex-basis: calc(50% - var(--quantity-gap, 16px) / 2); } /* Three items - 33% each */ &:has(> :nth-child(3):nth-last-child(1)) > * { flex-basis: calc(33.333% - var(--quantity-gap, 16px) * 2 / 3); } /* Four or more items - 25% each */ &:has(> :nth-child(4)) > * { flex-basis: calc(25% - var(--quantity-gap, 16px) * 3 / 4); } } // RESPONSIVE UTILITIES FOR PATTERNS @media (max-width: 576px) { .stack-horizontal-mobile { flex-direction: row; align-items: center; } .stack-vertical-mobile { flex-direction: column; align-items: stretch; } .cluster-stack-mobile { flex-direction: column; align-items: stretch; } } @media (max-width: 768px) { .equal-height { flex-direction: column; } .switcher { flex-direction: column; } } // ACCESSIBILITY IMPROVEMENTS @media (prefers-reduced-motion: reduce) { .sticky-footer, .cover, .imposter { transition: none; } } // PRINT OPTIMIZATIONS @media print { .reel { display: block; overflow: visible; } .masonry { columns: 1; } .holy-grail { display: block; } }6Ŷx0// ========================================================================== // DISPLAY UTILITIES // ========================================================================== // Utility classes for display, visibility, and text formatting // Theme-agnostic display and layout helpers // ========================================================================== // TEXT ALIGNMENT .text-left { text-align: left !important; } .text-right { text-align: right !important; } .text-center { text-align: center !important; } .text-justify { text-align: justify !important; } .text-start { text-align: left !important; } .text-end { text-align: right !important; } // Responsive text alignment - Using base breakpoint tokens @media (max-width: #{$base-breakpoint-xs - 1px}) { .text-xs-left { text-align: left !important; } .text-xs-right { text-align: right !important; } .text-xs-center { text-align: center !important; } .text-xs-start { text-align: left !important; } .text-xs-end { text-align: right !important; } } @media (min-width: #{$base-breakpoint-sm}) { .text-sm-left { text-align: left !important; } .text-sm-right { text-align: right !important; } .text-sm-center { text-align: center !important; } .text-sm-start { text-align: left !important; } .text-sm-end { text-align: right !important; } } @media (min-width: #{$base-breakpoint-md}) { .text-md-left { text-align: left !important; } .text-md-right { text-align: right !important; } .text-md-center { text-align: center !important; } .text-md-start { text-align: left !important; } .text-md-end { text-align: right !important; } } @media (min-width: #{$base-breakpoint-lg}) { .text-lg-left { text-align: left !important; } .text-lg-right { text-align: right !important; } .text-lg-center { text-align: center !important; } .text-lg-start { text-align: left !important; } .text-lg-end { text-align: right !important; } } // TEXT TRANSFORM .text-lowercase { text-transform: lowercase !important; } .text-uppercase { text-transform: uppercase !important; } .text-capitalize { text-transform: capitalize !important; } .text-normal-case { text-transform: none !important; } // FONT WEIGHT .fw-light { font-weight: 300 !important; } .fw-lighter { font-weight: lighter !important; } .fw-normal { font-weight: 400 !important; } .fw-medium { font-weight: 500 !important; } .fw-semibold { font-weight: 600 !important; } .fw-bold { font-weight: 700 !important; } .fw-bolder { font-weight: bolder !important; } // FONT STYLE .fst-italic { font-style: italic !important; } .fst-normal { font-style: normal !important; } // TEXT DECORATION .text-decoration-none { text-decoration: none !important; } .text-decoration-underline { text-decoration: underline !important; } .text-decoration-line-through { text-decoration: line-through !important; } // LINE HEIGHT .lh-1 { line-height: 1 !important; } .lh-sm { line-height: 1.25 !important; } .lh-base { line-height: 1.5 !important; } .lh-lg { line-height: 2 !important; } // TEXT WRAP .text-wrap { white-space: normal !important; } .text-nowrap { white-space: nowrap !important; } .text-pre { white-space: pre !important; } .text-pre-line { white-space: pre-line !important; } .text-pre-wrap { white-space: pre-wrap !important; } // TEXT OVERFLOW .text-truncate { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } .text-break { word-wrap: break-word !important; word-break: break-word !important; } // WORD BREAK .text-break-all { word-break: break-all !important; } .text-break-keep { word-break: keep-all !important; } // VERTICAL ALIGNMENT .align-baseline { vertical-align: baseline !important; } .align-top { vertical-align: top !important; } .align-middle { vertical-align: middle !important; } .align-bottom { vertical-align: bottom !important; } .align-text-bottom { vertical-align: text-bottom !important; } .align-text-top { vertical-align: text-top !important; } // LIST STYLES .list-unstyled { padding-left: 0 !important; list-style: none !important; } .list-inline { padding-left: 0 !important; list-style: none !important; .list-inline-item { display: inline-block !important; &:not(:last-child) { margin-right: var(--list-inline-gap, 8px) !important; } } } // OPACITY .opacity-0 { opacity: 0 !important; } .opacity-25 { opacity: 0.25 !important; } .opacity-50 { opacity: 0.5 !important; } .opacity-75 { opacity: 0.75 !important; } .opacity-100 { opacity: 1 !important; } // BORDERS .border { border: var(--border-width, 1px) solid var(--border-color, #dee2e6) !important; } .border-0 { border: 0 !important; } .border-top { border-top: var(--border-width, 1px) solid var(--border-color, #dee2e6) !important; } .border-top-0 { border-top: 0 !important; } .border-end { border-right: var(--border-width, 1px) solid var(--border-color, #dee2e6) !important; } .border-end-0 { border-right: 0 !important; } .border-bottom { border-bottom: var(--border-width, 1px) solid var(--border-color, #dee2e6) !important; } .border-bottom-0 { border-bottom: 0 !important; } .border-start { border-left: var(--border-width, 1px) solid var(--border-color, #dee2e6) !important; } .border-start-0 { border-left: 0 !important; } // BORDER RADIUS - Using base border radius tokens .rounded { border-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-0 { border-radius: #{$base-border-radius-none} !important; } .rounded-1 { border-radius: var(--border-radius-sm, #{$base-border-radius-sm}) !important; } .rounded-2 { border-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-3 { border-radius: var(--border-radius-lg, #{$base-border-radius-lg}) !important; } .rounded-4 { border-radius: var(--border-radius-xl, #{$base-border-radius-xl}) !important; } .rounded-5 { border-radius: var(--border-radius-xxl, #{$base-border-radius-2xl}) !important; } .rounded-circle { border-radius: #{$base-border-radius-full} !important; } .rounded-pill { border-radius: var(--rounded-pill, #{$base-border-radius-pill}) !important; } // Individual border radius .rounded-top { border-top-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; border-top-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-end { border-top-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; border-bottom-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-bottom { border-bottom-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; border-bottom-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-start { border-bottom-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; border-top-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-top-start { border-top-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-top-end { border-top-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-bottom-end { border-bottom-right-radius: var(--border-radius, #{$base-border-radius-md}) !important; } .rounded-bottom-start { border-bottom-left-radius: var(--border-radius, #{$base-border-radius-md}) !important; } // WIDTH AND HEIGHT .w-25 { width: 25% !important; } .w-50 { width: 50% !important; } .w-75 { width: 75% !important; } .w-100 { width: 100% !important; } .w-auto { width: auto !important; } .mw-100 { max-width: 100% !important; } .mw-75 { max-width: 75% !important; } .mw-50 { max-width: 50% !important; } .mw-25 { max-width: 25% !important; } .h-25 { height: 25% !important; } .h-50 { height: 50% !important; } .h-75 { height: 75% !important; } .h-100 { height: 100% !important; } .h-auto { height: auto !important; } .mh-100 { max-height: 100% !important; } .mh-75 { max-height: 75% !important; } .mh-50 { max-height: 50% !important; } .mh-25 { max-height: 25% !important; } // Min width/height .min-w-0 { min-width: 0 !important; } .min-w-100 { min-width: 100% !important; } .min-h-0 { min-height: 0 !important; } .min-h-100 { min-height: 100% !important; } // Viewport dimensions .vw-100 { width: 100vw !important; } .min-vw-100 { min-width: 100vw !important; } .vh-100 { height: 100vh !important; } .min-vh-100 { min-height: 100vh !important; } // SHADOWS - Using base shadow tokens .shadow-none { box-shadow: #{$base-shadow-none} !important; } .shadow-sm { box-shadow: var(--shadow-sm, #{$base-shadow-sm}) !important; } .shadow { box-shadow: var(--shadow, #{$base-shadow-md}) !important; } .shadow-md { box-shadow: var(--shadow-md, #{$base-shadow-lg}) !important; } .shadow-lg { box-shadow: var(--shadow-lg, #{$base-shadow-xl}) !important; } .shadow-xl { box-shadow: var(--shadow-xl, #{$base-shadow-2xl}) !important; } // FOCUS UTILITIES .focus\:outline-none:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; } .focus\:ring:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; box-shadow: var(--focus-ring-shadow, 0 0 0 3px rgba(59, 130, 246, 0.5)) !important; } .focus\:ring-2:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; box-shadow: var(--focus-ring-shadow, 0 0 0 2px rgba(59, 130, 246, 0.5)) !important; } .focus\:ring-4:focus { outline: 2px solid transparent !important; outline-offset: 2px !important; box-shadow: var(--focus-ring-shadow, 0 0 0 4px rgba(59, 130, 246, 0.5)) !important; } // SCREEN READER ONLY .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; } .sr-only-focusable:focus { position: static !important; width: auto !important; height: auto !important; padding: inherit !important; margin: inherit !important; overflow: visible !important; clip: auto !important; white-space: normal !important; } // PRINT UTILITIES @media print { .d-print-none { display: none !important; } .d-print-inline { display: inline !important; } .d-print-inline-block { display: inline-block !important; } .d-print-block { display: block !important; } .d-print-flex { display: flex !important; } .d-print-inline-flex { display: inline-flex !important; } .d-print-grid { display: grid !important; } .d-print-table { display: table !important; } .d-print-table-row { display: table-row !important; } .d-print-table-cell { display: table-cell !important; } } // IMAGE UTILITIES .img-fluid { max-width: 100% !important; height: auto !important; } .img-thumbnail { padding: var(--img-thumbnail-padding, 4px) !important; background-color: var(--img-thumbnail-bg, white) !important; border: var(--img-thumbnail-border-width, 1px) solid var(--img-thumbnail-border-color, #dee2e6) !important; border-radius: var(--img-thumbnail-border-radius, 6px) !important; max-width: 100% !important; height: auto !important; } // FIGURE .figure { display: inline-block !important; .figure-img { margin-bottom: var(--figure-caption-margin-top, 8px) !important; line-height: 1 !important; } .figure-caption { font-size: var(--figure-caption-font-size, 0.875em) !important; color: var(--figure-caption-color, rgba(0, 0, 0, 0.6)) !important; } } // TABLE UTILITIES .table-responsive { overflow-x: auto !important; .table { margin-bottom: 0 !important; } } @media (max-width: #{$base-breakpoint-xs - 1px}) { .table-responsive-sm { overflow-x: auto !important; } } @media (max-width: #{$base-breakpoint-md - 1px}) { .table-responsive-md { overflow-x: auto !important; } } @media (max-width: #{$base-breakpoint-lg - 1px}) { .table-responsive-lg { overflow-x: auto !important; } } @media (max-width: #{$base-breakpoint-xl - 1px}) { .table-responsive-xl { overflow-x: auto !important; } } // STRETCHED LINK .stretched-link::after { position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; z-index: 1 !important; content: "" !important; }=&绔xKA// ========================================================================== // LAYOUT UTILITIES // ========================================================================== // Utility classes for common layout needs // Theme-agnostic layout helpers // ========================================================================== // DISPLAY UTILITIES .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-flex { display: flex !important; } .d-inline-flex { display: inline-flex !important; } .d-grid { display: grid !important; } .d-inline-grid { display: inline-grid !important; } .d-table { display: table !important; } .d-table-cell { display: table-cell !important; } // RESPONSIVE DISPLAY UTILITIES - Using base breakpoint tokens @media (max-width: #{$base-breakpoint-xs - 1px}) { .d-xs-none { display: none !important; } .d-xs-inline { display: inline !important; } .d-xs-inline-block { display: inline-block !important; } .d-xs-block { display: block !important; } .d-xs-flex { display: flex !important; } .d-xs-inline-flex { display: inline-flex !important; } .d-xs-grid { display: grid !important; } .d-xs-inline-grid { display: inline-grid !important; } } @media (min-width: #{$base-breakpoint-sm}) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-flex { display: flex !important; } .d-sm-inline-flex { display: inline-flex !important; } .d-sm-grid { display: grid !important; } .d-sm-inline-grid { display: inline-grid !important; } } @media (min-width: #{$base-breakpoint-md}) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-flex { display: flex !important; } .d-md-inline-flex { display: inline-flex !important; } .d-md-grid { display: grid !important; } .d-md-inline-grid { display: inline-grid !important; } } @media (min-width: #{$base-breakpoint-lg}) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-flex { display: flex !important; } .d-lg-inline-flex { display: inline-flex !important; } .d-lg-grid { display: grid !important; } .d-lg-inline-grid { display: inline-grid !important; } } @media (min-width: #{$base-breakpoint-xl}) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-flex { display: flex !important; } .d-xl-inline-flex { display: inline-flex !important; } .d-xl-grid { display: grid !important; } .d-xl-inline-grid { display: inline-grid !important; } } // POSITION UTILITIES .position-static { position: static !important; } .position-relative { position: relative !important; } .position-absolute { position: absolute !important; } .position-fixed { position: fixed !important; } .position-sticky { position: sticky !important; } // POSITIONING .top-0 { top: 0 !important; } .top-50 { top: 50% !important; } .top-100 { top: 100% !important; } .bottom-0 { bottom: 0 !important; } .bottom-50 { bottom: 50% !important; } .bottom-100 { bottom: 100% !important; } .start-0 { left: 0 !important; } .start-50 { left: 50% !important; } .start-100 { left: 100% !important; } .end-0 { right: 0 !important; } .end-50 { right: 50% !important; } .end-100 { right: 100% !important; } // TRANSLATE UTILITIES .translate-middle { transform: translate(-50%, -50%) !important; } .translate-middle-x { transform: translateX(-50%) !important; } .translate-middle-y { transform: translateY(-50%) !important; } // OVERFLOW UTILITIES .overflow-auto { overflow: auto !important; } .overflow-hidden { overflow: hidden !important; } .overflow-visible { overflow: visible !important; } .overflow-scroll { overflow: scroll !important; } .overflow-x-auto { overflow-x: auto !important; } .overflow-x-hidden { overflow-x: hidden !important; } .overflow-x-visible { overflow-x: visible !important; } .overflow-x-scroll { overflow-x: scroll !important; } .overflow-y-auto { overflow-y: auto !important; } .overflow-y-hidden { overflow-y: hidden !important; } .overflow-y-visible { overflow-y: visible !important; } .overflow-y-scroll { overflow-y: scroll !important; } // Z-INDEX UTILITIES .z-n1 { z-index: -1 !important; } .z-0 { z-index: 0 !important; } .z-1 { z-index: 1 !important; } .z-2 { z-index: 2 !important; } .z-3 { z-index: 3 !important; } .z-10 { z-index: 10 !important; } .z-20 { z-index: 20 !important; } .z-30 { z-index: 30 !important; } .z-40 { z-index: 40 !important; } .z-50 { z-index: 50 !important; } .z-100 { z-index: 100 !important; } .z-1000 { z-index: 1000 !important; } .z-1010 { z-index: 1010 !important; } .z-1020 { z-index: 1020 !important; } .z-1030 { z-index: 1030 !important; } .z-1040 { z-index: 1040 !important; } .z-1050 { z-index: 1050 !important; } .z-1060 { z-index: 1060 !important; } .z-1070 { z-index: 1070 !important; } // FLEXBOX UTILITIES // Direction .flex-row { flex-direction: row !important; } .flex-column { flex-direction: column !important; } .flex-row-reverse { flex-direction: row-reverse !important; } .flex-column-reverse { flex-direction: column-reverse !important; } // Responsive flex direction @media (max-width: 575px) { .flex-xs-row { flex-direction: row !important; } .flex-xs-column { flex-direction: column !important; } .flex-xs-row-reverse { flex-direction: row-reverse !important; } .flex-xs-column-reverse { flex-direction: column-reverse !important; } } @media (min-width: 576px) { .flex-sm-row { flex-direction: row !important; } .flex-sm-column { flex-direction: column !important; } .flex-sm-row-reverse { flex-direction: row-reverse !important; } .flex-sm-column-reverse { flex-direction: column-reverse !important; } } @media (min-width: 768px) { .flex-md-row { flex-direction: row !important; } .flex-md-column { flex-direction: column !important; } .flex-md-row-reverse { flex-direction: row-reverse !important; } .flex-md-column-reverse { flex-direction: column-reverse !important; } } // Wrap .flex-wrap { flex-wrap: wrap !important; } .flex-nowrap { flex-wrap: nowrap !important; } .flex-wrap-reverse { flex-wrap: wrap-reverse !important; } // Justify content .justify-content-start { justify-content: flex-start !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-center { justify-content: center !important; } .justify-content-between { justify-content: space-between !important; } .justify-content-around { justify-content: space-around !important; } .justify-content-evenly { justify-content: space-evenly !important; } // Align items .align-items-start { align-items: flex-start !important; } .align-items-end { align-items: flex-end !important; } .align-items-center { align-items: center !important; } .align-items-baseline { align-items: baseline !important; } .align-items-stretch { align-items: stretch !important; } // Align content .align-content-start { align-content: flex-start !important; } .align-content-end { align-content: flex-end !important; } .align-content-center { align-content: center !important; } .align-content-between { align-content: space-between !important; } .align-content-around { align-content: space-around !important; } .align-content-stretch { align-content: stretch !important; } // Align self .align-self-auto { align-self: auto !important; } .align-self-start { align-self: flex-start !important; } .align-self-end { align-self: flex-end !important; } .align-self-center { align-self: center !important; } .align-self-baseline { align-self: baseline !important; } .align-self-stretch { align-self: stretch !important; } // Flex grow/shrink .flex-fill { flex: 1 1 auto !important; } .flex-grow-0 { flex-grow: 0 !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-0 { flex-shrink: 0 !important; } .flex-shrink-1 { flex-shrink: 1 !important; } // ORDER .order-first { order: -1 !important; } .order-0 { order: 0 !important; } .order-1 { order: 1 !important; } .order-2 { order: 2 !important; } .order-3 { order: 3 !important; } .order-4 { order: 4 !important; } .order-5 { order: 5 !important; } .order-last { order: 6 !important; } // GRID UTILITIES .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } .grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; } .grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; } .grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; } .grid-rows-1 { grid-template-rows: repeat(1, minmax(0, 1fr)) !important; } .grid-rows-2 { grid-template-rows: repeat(2, minmax(0, 1fr)) !important; } .grid-rows-3 { grid-template-rows: repeat(3, minmax(0, 1fr)) !important; } .grid-rows-4 { grid-template-rows: repeat(4, minmax(0, 1fr)) !important; } .grid-rows-5 { grid-template-rows: repeat(5, minmax(0, 1fr)) !important; } .grid-rows-6 { grid-template-rows: repeat(6, minmax(0, 1fr)) !important; } // Grid column spans .col-span-1 { grid-column: span 1 / span 1 !important; } .col-span-2 { grid-column: span 2 / span 2 !important; } .col-span-3 { grid-column: span 3 / span 3 !important; } .col-span-4 { grid-column: span 4 / span 4 !important; } .col-span-5 { grid-column: span 5 / span 5 !important; } .col-span-6 { grid-column: span 6 / span 6 !important; } .col-span-full { grid-column: 1 / -1 !important; } // Grid row spans .row-span-1 { grid-row: span 1 / span 1 !important; } .row-span-2 { grid-row: span 2 / span 2 !important; } .row-span-3 { grid-row: span 3 / span 3 !important; } .row-span-4 { grid-row: span 4 / span 4 !important; } .row-span-5 { grid-row: span 5 / span 5 !important; } .row-span-6 { grid-row: span 6 / span 6 !important; } .row-span-full { grid-row: 1 / -1 !important; } // Grid column start/end .col-start-1 { grid-column-start: 1 !important; } .col-start-2 { grid-column-start: 2 !important; } .col-start-3 { grid-column-start: 3 !important; } .col-start-4 { grid-column-start: 4 !important; } .col-start-5 { grid-column-start: 5 !important; } .col-start-6 { grid-column-start: 6 !important; } .col-start-auto { grid-column-start: auto !important; } .col-end-1 { grid-column-end: 1 !important; } .col-end-2 { grid-column-end: 2 !important; } .col-end-3 { grid-column-end: 3 !important; } .col-end-4 { grid-column-end: 4 !important; } .col-end-5 { grid-column-end: 5 !important; } .col-end-6 { grid-column-end: 6 !important; } .col-end-auto { grid-column-end: auto !important; } // Grid row start/end .row-start-1 { grid-row-start: 1 !important; } .row-start-2 { grid-row-start: 2 !important; } .row-start-3 { grid-row-start: 3 !important; } .row-start-4 { grid-row-start: 4 !important; } .row-start-5 { grid-row-start: 5 !important; } .row-start-6 { grid-row-start: 6 !important; } .row-start-auto { grid-row-start: auto !important; } .row-end-1 { grid-row-end: 1 !important; } .row-end-2 { grid-row-end: 2 !important; } .row-end-3 { grid-row-end: 3 !important; } .row-end-4 { grid-row-end: 4 !important; } .row-end-5 { grid-row-end: 5 !important; } .row-end-6 { grid-row-end: 6 !important; } .row-end-auto { grid-row-end: auto !important; } // Grid auto flow .grid-flow-row { grid-auto-flow: row !important; } .grid-flow-col { grid-auto-flow: column !important; } .grid-flow-dense { grid-auto-flow: dense !important; } .grid-flow-row-dense { grid-auto-flow: row dense !important; } .grid-flow-col-dense { grid-auto-flow: column dense !important; } // FLOAT UTILITIES .float-start { float: left !important; } .float-end { float: right !important; } .float-none { float: none !important; } // CLEAR UTILITIES .clearfix::after { display: block; clear: both; content: ""; } // OBJECT FIT UTILITIES .object-contain { object-fit: contain !important; } .object-cover { object-fit: cover !important; } .object-fill { object-fit: fill !important; } .object-scale { object-fit: scale-down !important; } .object-none { object-fit: none !important; } // OBJECT POSITION UTILITIES .object-top { object-position: top !important; } .object-bottom { object-position: bottom !important; } .object-center { object-position: center !important; } .object-left { object-position: left !important; } .object-left-bottom { object-position: left bottom !important; } .object-left-top { object-position: left top !important; } .object-right { object-position: right !important; } .object-right-bottom { object-position: right bottom !important; } .object-right-top { object-position: right top !important; } // VISIBILITY UTILITIES .visible { visibility: visible !important; } .invisible { visibility: hidden !important; } // INTERACTION UTILITIES .user-select-all { user-select: all !important; } .user-select-auto { user-select: auto !important; } .user-select-none { user-select: none !important; } .pointer-events-none { pointer-events: none !important; } .pointer-events-auto { pointer-events: auto !important; } // CURSOR UTILITIES .cursor-auto { cursor: auto !important; } .cursor-default { cursor: default !important; } .cursor-pointer { cursor: pointer !important; } .cursor-wait { cursor: wait !important; } .cursor-text { cursor: text !important; } .cursor-move { cursor: move !important; } .cursor-help { cursor: help !important; } .cursor-not-allowed { cursor: not-allowed !important; } .cursor-grab { cursor: grab !important; } .cursor-grabbing { cursor: grabbing !important; } // RESIZE UTILITIES .resize-none { resize: none !important; } .resize-y { resize: vertical !important; } .resize-x { resize: horizontal !important; } .resize { resize: both !important; } // BOX SIZING UTILITIES .box-border { box-sizing: border-box !important; } .box-content { box-sizing: content-box !important; } // ASPECT RATIO UTILITIES (Modern) @supports (aspect-ratio: 1 / 1) { .aspect-auto { aspect-ratio: auto !important; } .aspect-square { aspect-ratio: 1 / 1 !important; } .aspect-video { aspect-ratio: 16 / 9 !important; } .aspect-4-3 { aspect-ratio: 4 / 3 !important; } .aspect-3-2 { aspect-ratio: 3 / 2 !important; } .aspect-21-9 { aspect-ratio: 21 / 9 !important; } } // CLIP PATH UTILITIES .clip-ellipse { clip-path: ellipse(50% 50% at 50% 50%) !important; } .clip-circle { clip-path: circle(50% at 50% 50%) !important; } .clip-triangle { clip-path: polygon(50% 0%, 0% 100%, 100% 100%) !important; } .clip-none { clip-path: none !important; } // TRANSFORM UTILITIES .transform { transform: var(--tw-transform) !important; } .transform-none { transform: none !important; } .rotate-0 { --tw-rotate: 0deg; transform: rotate(var(--tw-rotate)) !important; } .rotate-45 { --tw-rotate: 45deg; transform: rotate(var(--tw-rotate)) !important; } .rotate-90 { --tw-rotate: 90deg; transform: rotate(var(--tw-rotate)) !important; } .rotate-180 { --tw-rotate: 180deg; transform: rotate(var(--tw-rotate)) !important; } .scale-0 { --tw-scale-x: 0; --tw-scale-y: 0; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-50 { --tw-scale-x: 0.5; --tw-scale-y: 0.5; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-75 { --tw-scale-x: 0.75; --tw-scale-y: 0.75; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-90 { --tw-scale-x: 0.9; --tw-scale-y: 0.9; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-95 { --tw-scale-x: 0.95; --tw-scale-y: 0.95; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-100 { --tw-scale-x: 1; --tw-scale-y: 1; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-105 { --tw-scale-x: 1.05; --tw-scale-y: 1.05; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-110 { --tw-scale-x: 1.1; --tw-scale-y: 1.1; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-125 { --tw-scale-x: 1.25; --tw-scale-y: 1.25; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; } .scale-150 { --tw-scale-x: 1.5; --tw-scale-y: 1.5; transform: scale(var(--tw-scale-x), var(--tw-scale-y)) !important; }3Ҵx# // ========================================================================== // SCROLLBAR UTILITIES // ========================================================================== // Scrollbar styling utilities with visibility options // Theme-agnostic scrollbar controls // ========================================================================== // SCROLLBAR VISIBILITY OPTIONS .scrollbar-visible { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)) var(--scrollbar-track, transparent); // Webkit scrollbar styling (Chrome, Safari, Edge) &::-webkit-scrollbar { width: #{$base-spacing-2}; // 8px height: #{$base-spacing-2}; } &::-webkit-scrollbar-track { background: var(--scrollbar-track, transparent); border-radius: #{$base-border-radius-sm}; } &::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)); border-radius: #{$base-border-radius-sm}; border: 1px solid var(--scrollbar-thumb-border, transparent); &:hover { background: var(--scrollbar-thumb-hover, rgba(0, 0, 0, 0.3)); } &:active { background: var(--scrollbar-thumb-active, rgba(0, 0, 0, 0.4)); } } &::-webkit-scrollbar-corner { background: var(--scrollbar-corner, transparent); } } .scrollbar-invisible { // Firefox scrollbar-width: none; // Internet Explorer and Edge -ms-overflow-style: none; // Webkit browsers (Chrome, Safari, newer Edge) &::-webkit-scrollbar { display: none; width: 0; height: 0; } } // SCROLLBAR SIZING OPTIONS .scrollbar-thin { scrollbar-width: thin; &::-webkit-scrollbar { width: #{$base-spacing-1}; // 4px height: #{$base-spacing-1}; } } .scrollbar-thick { scrollbar-width: auto; &::-webkit-scrollbar { width: #{$base-spacing-3}; // 12px height: #{$base-spacing-3}; } } // SCROLLBAR BEHAVIOR OPTIONS .scroll-smooth { scroll-behavior: smooth; } .scroll-auto { scroll-behavior: auto; } // OVERFLOW UTILITIES WITH SCROLLBAR CONTROL .overflow-auto-visible { overflow: auto; @extend .scrollbar-visible; } .overflow-auto-invisible { overflow: auto; @extend .scrollbar-invisible; } .overflow-scroll-visible { overflow: scroll; @extend .scrollbar-visible; } .overflow-scroll-invisible { overflow: scroll; @extend .scrollbar-invisible; } .overflow-y-auto-visible { overflow-y: auto; overflow-x: hidden; @extend .scrollbar-visible; } .overflow-y-auto-invisible { overflow-y: auto; overflow-x: hidden; @extend .scrollbar-invisible; } .overflow-x-auto-visible { overflow-x: auto; overflow-y: hidden; @extend .scrollbar-visible; } .overflow-x-auto-invisible { overflow-x: auto; overflow-y: hidden; @extend .scrollbar-invisible; } // HOVER-BASED SCROLLBAR VISIBILITY .scrollbar-hover { // Hide by default @extend .scrollbar-invisible; // Show on hover &:hover { @extend .scrollbar-visible; } } // FOCUS-BASED SCROLLBAR VISIBILITY .scrollbar-focus { // Hide by default @extend .scrollbar-invisible; // Show on focus-within &:focus-within { @extend .scrollbar-visible; } } // SCROLLBAR THEME VARIANTS .scrollbar-light { --scrollbar-track: rgba(255, 255, 255, 0.1); --scrollbar-thumb: rgba(255, 255, 255, 0.3); --scrollbar-thumb-hover: rgba(255, 255, 255, 0.5); --scrollbar-thumb-active: rgba(255, 255, 255, 0.7); --scrollbar-thumb-border: rgba(255, 255, 255, 0.1); } .scrollbar-dark { --scrollbar-track: rgba(0, 0, 0, 0.1); --scrollbar-thumb: rgba(0, 0, 0, 0.3); --scrollbar-thumb-hover: rgba(0, 0, 0, 0.5); --scrollbar-thumb-active: rgba(0, 0, 0, 0.7); --scrollbar-thumb-border: rgba(0, 0, 0, 0.1); } // SCROLLBAR POSITION UTILITIES .scroll-padding-block-start { scroll-padding-block-start: var(--scroll-padding-block-start, #{$semantic-spacing-layout-section-sm}); } .scroll-padding-block-end { scroll-padding-block-end: var(--scroll-padding-block-end, #{$semantic-spacing-layout-section-sm}); } .scroll-padding-inline-start { scroll-padding-inline-start: var(--scroll-padding-inline-start, #{$semantic-spacing-component-padding-lg}); } .scroll-padding-inline-end { scroll-padding-inline-end: var(--scroll-padding-inline-end, #{$semantic-spacing-component-padding-lg}); } // SCROLL SNAP UTILITIES .scroll-snap-x { scroll-snap-type: x mandatory; > * { scroll-snap-align: start; } } .scroll-snap-y { scroll-snap-type: y mandatory; > * { scroll-snap-align: start; } } .scroll-snap-both { scroll-snap-type: both mandatory; > * { scroll-snap-align: start; } } .scroll-snap-proximity { scroll-snap-type: y proximity; > * { scroll-snap-align: start; } } .scroll-snap-center { > * { scroll-snap-align: center; } } .scroll-snap-end { > * { scroll-snap-align: end; } } // MOMENTUM SCROLLING (iOS) .scroll-momentum { -webkit-overflow-scrolling: touch; } // CUSTOM SCROLLBAR COMPONENT CLASSES .custom-scrollbar { // Base scrollbar with custom styling @extend .scrollbar-visible; &::-webkit-scrollbar-thumb { background: linear-gradient(45deg, var(--scrollbar-gradient-start, #667eea), var(--scrollbar-gradient-end, #764ba2) ); border-radius: #{$base-border-radius-lg}; border: 2px solid var(--scrollbar-border, transparent); &:hover { transform: scale(1.1); transition: transform 0.2s ease; } } &::-webkit-scrollbar-track { background: var(--scrollbar-track-custom, rgba(0, 0, 0, 0.05)); border-radius: #{$base-border-radius-lg}; margin: #{$base-spacing-1}; } } // DEVELOPER CHOICE MIXINS - For programmatic scrollbar control @mixin scrollbar-choice($visible: true) { @if $visible { @extend .scrollbar-visible; } @else { @extend .scrollbar-invisible; } } // Utility classes for Angular component integration .scrollbar-auto-visible { @include scrollbar-choice(true); } .scrollbar-auto-invisible { @include scrollbar-choice(false); } // RESPONSIVE SCROLLBAR UTILITIES @media (max-width: #{$base-breakpoint-md}) { .scrollbar-mobile-invisible { // Firefox scrollbar-width: none; // Internet Explorer and Edge -ms-overflow-style: none; // Webkit browsers (Chrome, Safari, newer Edge) &::-webkit-scrollbar { display: none; width: 0; height: 0; } } .scrollbar-mobile-visible { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)) var(--scrollbar-track, transparent); // Webkit scrollbar styling (Chrome, Safari, Edge) &::-webkit-scrollbar { width: #{$base-spacing-2}; // 8px height: #{$base-spacing-2}; } &::-webkit-scrollbar-track { background: var(--scrollbar-track, transparent); border-radius: #{$base-border-radius-sm}; } &::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)); border-radius: #{$base-border-radius-sm}; border: 1px solid var(--scrollbar-thumb-border, transparent); &:hover { background: var(--scrollbar-thumb-hover, rgba(0, 0, 0, 0.3)); } &:active { background: var(--scrollbar-thumb-active, rgba(0, 0, 0, 0.4)); } } &::-webkit-scrollbar-corner { background: var(--scrollbar-corner, transparent); } } } @media (min-width: #{$base-breakpoint-md}) { .scrollbar-desktop-invisible { // Firefox scrollbar-width: none; // Internet Explorer and Edge -ms-overflow-style: none; // Webkit browsers (Chrome, Safari, newer Edge) &::-webkit-scrollbar { display: none; width: 0; height: 0; } } .scrollbar-desktop-visible { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)) var(--scrollbar-track, transparent); // Webkit scrollbar styling (Chrome, Safari, Edge) &::-webkit-scrollbar { width: #{$base-spacing-2}; // 8px height: #{$base-spacing-2}; } &::-webkit-scrollbar-track { background: var(--scrollbar-track, transparent); border-radius: #{$base-border-radius-sm}; } &::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, rgba(0, 0, 0, 0.2)); border-radius: #{$base-border-radius-sm}; border: 1px solid var(--scrollbar-thumb-border, transparent); &:hover { background: var(--scrollbar-thumb-hover, rgba(0, 0, 0, 0.3)); } &:active { background: var(--scrollbar-thumb-active, rgba(0, 0, 0, 0.4)); } } &::-webkit-scrollbar-corner { background: var(--scrollbar-corner, transparent); } } } // ACCESSIBILITY CONSIDERATIONS .scrollbar-high-contrast { --scrollbar-thumb: var(--color-text, #000); --scrollbar-thumb-hover: var(--color-text-emphasis, #333); --scrollbar-track: var(--color-border, #ccc); } .scrollbar-reduced-motion { scroll-behavior: auto; &::-webkit-scrollbar-thumb { transition: none; } } @media (prefers-reduced-motion: reduce) { .scrollbar-visible, .custom-scrollbar { scroll-behavior: auto; &::-webkit-scrollbar-thumb { transition: none; } } }Gع xW// ========================================================================== // SPACING UTILITIES // ========================================================================== // Utility classes for margin and padding // Uses CSS custom properties for consistent spacing scale // ========================================================================== // SPACING SCALE - Using base design tokens :root { --space-0: #{$base-spacing-0}; --space-1: #{$base-spacing-1}; --space-2: #{$base-spacing-2}; --space-3: #{$base-spacing-3}; --space-4: #{$base-spacing-4}; --space-5: #{$base-spacing-5}; --space-6: #{$base-spacing-6}; --space-7: #{$base-spacing-7}; --space-8: #{$base-spacing-8}; --space-9: #{$base-spacing-9}; --space-10: #{$base-spacing-10}; --space-11: #{$base-spacing-11}; --space-12: #{$base-spacing-12}; --space-14: #{$base-spacing-14}; --space-16: #{$base-spacing-16}; --space-20: #{$base-spacing-20}; --space-24: #{$base-spacing-24}; --space-28: #{$base-spacing-28}; --space-32: #{$base-spacing-32}; --space-36: #{$base-spacing-36}; --space-40: #{$base-spacing-40}; --space-44: #{$base-spacing-44}; --space-48: #{$base-spacing-48}; --space-52: #{$base-spacing-52}; --space-56: #{$base-spacing-56}; --space-60: #{$base-spacing-60}; --space-64: #{$base-spacing-64}; --space-72: #{$base-spacing-72}; --space-80: #{$base-spacing-80}; --space-96: #{$base-spacing-96}; // Negative spacing --space--1: -#{$base-spacing-1}; --space--2: -#{$base-spacing-2}; --space--3: -#{$base-spacing-3}; --space--4: -#{$base-spacing-4}; --space--5: -#{$base-spacing-5}; --space--6: -#{$base-spacing-6}; --space--7: -#{$base-spacing-7}; --space--8: -#{$base-spacing-8}; --space--9: -#{$base-spacing-9}; --space--10: -#{$base-spacing-10}; --space--11: -#{$base-spacing-11}; --space--12: -#{$base-spacing-12}; --space--14: -#{$base-spacing-14}; --space--16: -#{$base-spacing-16}; --space--20: -#{$base-spacing-20}; --space--24: -#{$base-spacing-24}; --space--28: -#{$base-spacing-28}; --space--32: -#{$base-spacing-32}; } // MARGIN UTILITIES // All margins .m-0 { margin: var(--space-0) !important; } .m-1 { margin: var(--space-1) !important; } .m-2 { margin: var(--space-2) !important; } .m-3 { margin: var(--space-3) !important; } .m-4 { margin: var(--space-4) !important; } .m-5 { margin: var(--space-5) !important; } .m-6 { margin: var(--space-6) !important; } .m-7 { margin: var(--space-7) !important; } .m-8 { margin: var(--space-8) !important; } .m-9 { margin: var(--space-9) !important; } .m-10 { margin: var(--space-10) !important; } .m-11 { margin: var(--space-11) !important; } .m-12 { margin: var(--space-12) !important; } .m-14 { margin: var(--space-14) !important; } .m-16 { margin: var(--space-16) !important; } .m-20 { margin: var(--space-20) !important; } .m-24 { margin: var(--space-24) !important; } .m-28 { margin: var(--space-28) !important; } .m-32 { margin: var(--space-32) !important; } .m-36 { margin: var(--space-36) !important; } .m-40 { margin: var(--space-40) !important; } .m-44 { margin: var(--space-44) !important; } .m-48 { margin: var(--space-48) !important; } .m-52 { margin: var(--space-52) !important; } .m-56 { margin: var(--space-56) !important; } .m-60 { margin: var(--space-60) !important; } .m-64 { margin: var(--space-64) !important; } .m-72 { margin: var(--space-72) !important; } .m-80 { margin: var(--space-80) !important; } .m-96 { margin: var(--space-96) !important; } // Auto margin .m-auto { margin: auto !important; } // Negative margins .m-n1 { margin: var(--space--1) !important; } .m-n2 { margin: var(--space--2) !important; } .m-n3 { margin: var(--space--3) !important; } .m-n4 { margin: var(--space--4) !important; } .m-n5 { margin: var(--space--5) !important; } .m-n6 { margin: var(--space--6) !important; } .m-n8 { margin: var(--space--8) !important; } .m-n10 { margin: var(--space--10) !important; } .m-n12 { margin: var(--space--12) !important; } .m-n16 { margin: var(--space--16) !important; } .m-n20 { margin: var(--space--20) !important; } .m-n24 { margin: var(--space--24) !important; } // Margin X (horizontal) .mx-0 { margin-left: var(--space-0) !important; margin-right: var(--space-0) !important; } .mx-1 { margin-left: var(--space-1) !important; margin-right: var(--space-1) !important; } .mx-2 { margin-left: var(--space-2) !important; margin-right: var(--space-2) !important; } .mx-3 { margin-left: var(--space-3) !important; margin-right: var(--space-3) !important; } .mx-4 { margin-left: var(--space-4) !important; margin-right: var(--space-4) !important; } .mx-5 { margin-left: var(--space-5) !important; margin-right: var(--space-5) !important; } .mx-6 { margin-left: var(--space-6) !important; margin-right: var(--space-6) !important; } .mx-8 { margin-left: var(--space-8) !important; margin-right: var(--space-8) !important; } .mx-10 { margin-left: var(--space-10) !important; margin-right: var(--space-10) !important; } .mx-12 { margin-left: var(--space-12) !important; margin-right: var(--space-12) !important; } .mx-16 { margin-left: var(--space-16) !important; margin-right: var(--space-16) !important; } .mx-20 { margin-left: var(--space-20) !important; margin-right: var(--space-20) !important; } .mx-24 { margin-left: var(--space-24) !important; margin-right: var(--space-24) !important; } .mx-32 { margin-left: var(--space-32) !important; margin-right: var(--space-32) !important; } .mx-auto { margin-left: auto !important; margin-right: auto !important; } // Margin Y (vertical) .my-0 { margin-top: var(--space-0) !important; margin-bottom: var(--space-0) !important; } .my-1 { margin-top: var(--space-1) !important; margin-bottom: var(--space-1) !important; } .my-2 { margin-top: var(--space-2) !important; margin-bottom: var(--space-2) !important; } .my-3 { margin-top: var(--space-3) !important; margin-bottom: var(--space-3) !important; } .my-4 { margin-top: var(--space-4) !important; margin-bottom: var(--space-4) !important; } .my-5 { margin-top: var(--space-5) !important; margin-bottom: var(--space-5) !important; } .my-6 { margin-top: var(--space-6) !important; margin-bottom: var(--space-6) !important; } .my-8 { margin-top: var(--space-8) !important; margin-bottom: var(--space-8) !important; } .my-10 { margin-top: var(--space-10) !important; margin-bottom: var(--space-10) !important; } .my-12 { margin-top: var(--space-12) !important; margin-bottom: var(--space-12) !important; } .my-16 { margin-top: var(--space-16) !important; margin-bottom: var(--space-16) !important; } .my-20 { margin-top: var(--space-20) !important; margin-bottom: var(--space-20) !important; } .my-24 { margin-top: var(--space-24) !important; margin-bottom: var(--space-24) !important; } .my-32 { margin-top: var(--space-32) !important; margin-bottom: var(--space-32) !important; } .my-auto { margin-top: auto !important; margin-bottom: auto !important; } // Individual margins .mt-0 { margin-top: var(--space-0) !important; } .mt-1 { margin-top: var(--space-1) !important; } .mt-2 { margin-top: var(--space-2) !important; } .mt-3 { margin-top: var(--space-3) !important; } .mt-4 { margin-top: var(--space-4) !important; } .mt-5 { margin-top: var(--space-5) !important; } .mt-6 { margin-top: var(--space-6) !important; } .mt-8 { margin-top: var(--space-8) !important; } .mt-10 { margin-top: var(--space-10) !important; } .mt-12 { margin-top: var(--space-12) !important; } .mt-16 { margin-top: var(--space-16) !important; } .mt-20 { margin-top: var(--space-20) !important; } .mt-24 { margin-top: var(--space-24) !important; } .mt-32 { margin-top: var(--space-32) !important; } .mt-auto { margin-top: auto !important; } .mb-0 { margin-bottom: var(--space-0) !important; } .mb-1 { margin-bottom: var(--space-1) !important; } .mb-2 { margin-bottom: var(--space-2) !important; } .mb-3 { margin-bottom: var(--space-3) !important; } .mb-4 { margin-bottom: var(--space-4) !important; } .mb-5 { margin-bottom: var(--space-5) !important; } .mb-6 { margin-bottom: var(--space-6) !important; } .mb-8 { margin-bottom: var(--space-8) !important; } .mb-10 { margin-bottom: var(--space-10) !important; } .mb-12 { margin-bottom: var(--space-12) !important; } .mb-16 { margin-bottom: var(--space-16) !important; } .mb-20 { margin-bottom: var(--space-20) !important; } .mb-24 { margin-bottom: var(--space-24) !important; } .mb-32 { margin-bottom: var(--space-32) !important; } .mb-auto { margin-bottom: auto !important; } .ms-0 { margin-left: var(--space-0) !important; } .ms-1 { margin-left: var(--space-1) !important; } .ms-2 { margin-left: var(--space-2) !important; } .ms-3 { margin-left: var(--space-3) !important; } .ms-4 { margin-left: var(--space-4) !important; } .ms-5 { margin-left: var(--space-5) !important; } .ms-6 { margin-left: var(--space-6) !important; } .ms-8 { margin-left: var(--space-8) !important; } .ms-10 { margin-left: var(--space-10) !important; } .ms-12 { margin-left: var(--space-12) !important; } .ms-16 { margin-left: var(--space-16) !important; } .ms-20 { margin-left: var(--space-20) !important; } .ms-24 { margin-left: var(--space-24) !important; } .ms-32 { margin-left: var(--space-32) !important; } .ms-auto { margin-left: auto !important; } .me-0 { margin-right: var(--space-0) !important; } .me-1 { margin-right: var(--space-1) !important; } .me-2 { margin-right: var(--space-2) !important; } .me-3 { margin-right: var(--space-3) !important; } .me-4 { margin-right: var(--space-4) !important; } .me-5 { margin-right: var(--space-5) !important; } .me-6 { margin-right: var(--space-6) !important; } .me-8 { margin-right: var(--space-8) !important; } .me-10 { margin-right: var(--space-10) !important; } .me-12 { margin-right: var(--space-12) !important; } .me-16 { margin-right: var(--space-16) !important; } .me-20 { margin-right: var(--space-20) !important; } .me-24 { margin-right: var(--space-24) !important; } .me-32 { margin-right: var(--space-32) !important; } .me-auto { margin-right: auto !important; } // PADDING UTILITIES // All padding .p-0 { padding: var(--space-0) !important; } .p-1 { padding: var(--space-1) !important; } .p-2 { padding: var(--space-2) !important; } .p-3 { padding: var(--space-3) !important; } .p-4 { padding: var(--space-4) !important; } .p-5 { padding: var(--space-5) !important; } .p-6 { padding: var(--space-6) !important; } .p-7 { padding: var(--space-7) !important; } .p-8 { padding: var(--space-8) !important; } .p-9 { padding: var(--space-9) !important; } .p-10 { padding: var(--space-10) !important; } .p-11 { padding: var(--space-11) !important; } .p-12 { padding: var(--space-12) !important; } .p-14 { padding: var(--space-14) !important; } .p-16 { padding: var(--space-16) !important; } .p-20 { padding: var(--space-20) !important; } .p-24 { padding: var(--space-24) !important; } .p-28 { padding: var(--space-28) !important; } .p-32 { padding: var(--space-32) !important; } .p-36 { padding: var(--space-36) !important; } .p-40 { padding: var(--space-40) !important; } .p-44 { padding: var(--space-44) !important; } .p-48 { padding: var(--space-48) !important; } // Padding X (horizontal) .px-0 { padding-left: var(--space-0) !important; padding-right: var(--space-0) !important; } .px-1 { padding-left: var(--space-1) !important; padding-right: var(--space-1) !important; } .px-2 { padding-left: var(--space-2) !important; padding-right: var(--space-2) !important; } .px-3 { padding-left: var(--space-3) !important; padding-right: var(--space-3) !important; } .px-4 { padding-left: var(--space-4) !important; padding-right: var(--space-4) !important; } .px-5 { padding-left: var(--space-5) !important; padding-right: var(--space-5) !important; } .px-6 { padding-left: var(--space-6) !important; padding-right: var(--space-6) !important; } .px-8 { padding-left: var(--space-8) !important; padding-right: var(--space-8) !important; } .px-10 { padding-left: var(--space-10) !important; padding-right: var(--space-10) !important; } .px-12 { padding-left: var(--space-12) !important; padding-right: var(--space-12) !important; } .px-16 { padding-left: var(--space-16) !important; padding-right: var(--space-16) !important; } .px-20 { padding-left: var(--space-20) !important; padding-right: var(--space-20) !important; } .px-24 { padding-left: var(--space-24) !important; padding-right: var(--space-24) !important; } .px-32 { padding-left: var(--space-32) !important; padding-right: var(--space-32) !important; } // Padding Y (vertical) .py-0 { padding-top: var(--space-0) !important; padding-bottom: var(--space-0) !important; } .py-1 { padding-top: var(--space-1) !important; padding-bottom: var(--space-1) !important; } .py-2 { padding-top: var(--space-2) !important; padding-bottom: var(--space-2) !important; } .py-3 { padding-top: var(--space-3) !important; padding-bottom: var(--space-3) !important; } .py-4 { padding-top: var(--space-4) !important; padding-bottom: var(--space-4) !important; } .py-5 { padding-top: var(--space-5) !important; padding-bottom: var(--space-5) !important; } .py-6 { padding-top: var(--space-6) !important; padding-bottom: var(--space-6) !important; } .py-8 { padding-top: var(--space-8) !important; padding-bottom: var(--space-8) !important; } .py-10 { padding-top: var(--space-10) !important; padding-bottom: var(--space-10) !important; } .py-12 { padding-top: var(--space-12) !important; padding-bottom: var(--space-12) !important; } .py-16 { padding-top: var(--space-16) !important; padding-bottom: var(--space-16) !important; } .py-20 { padding-top: var(--space-20) !important; padding-bottom: var(--space-20) !important; } .py-24 { padding-top: var(--space-24) !important; padding-bottom: var(--space-24) !important; } .py-32 { padding-top: var(--space-32) !important; padding-bottom: var(--space-32) !important; } // Individual padding .pt-0 { padding-top: var(--space-0) !important; } .pt-1 { padding-top: var(--space-1) !important; } .pt-2 { padding-top: var(--space-2) !important; } .pt-3 { padding-top: var(--space-3) !important; } .pt-4 { padding-top: var(--space-4) !important; } .pt-5 { padding-top: var(--space-5) !important; } .pt-6 { padding-top: var(--space-6) !important; } .pt-8 { padding-top: var(--space-8) !important; } .pt-10 { padding-top: var(--space-10) !important; } .pt-12 { padding-top: var(--space-12) !important; } .pt-16 { padding-top: var(--space-16) !important; } .pt-20 { padding-top: var(--space-20) !important; } .pt-24 { padding-top: var(--space-24) !important; } .pt-32 { padding-top: var(--space-32) !important; } .pb-0 { padding-bottom: var(--space-0) !important; } .pb-1 { padding-bottom: var(--space-1) !important; } .pb-2 { padding-bottom: var(--space-2) !important; } .pb-3 { padding-bottom: var(--space-3) !important; } .pb-4 { padding-bottom: var(--space-4) !important; } .pb-5 { padding-bottom: var(--space-5) !important; } .pb-6 { padding-bottom: var(--space-6) !important; } .pb-8 { padding-bottom: var(--space-8) !important; } .pb-10 { padding-bottom: var(--space-10) !important; } .pb-12 { padding-bottom: var(--space-12) !important; } .pb-16 { padding-bottom: var(--space-16) !important; } .pb-20 { padding-bottom: var(--space-20) !important; } .pb-24 { padding-bottom: var(--space-24) !important; } .pb-32 { padding-bottom: var(--space-32) !important; } .ps-0 { padding-left: var(--space-0) !important; } .ps-1 { padding-left: var(--space-1) !important; } .ps-2 { padding-left: var(--space-2) !important; } .ps-3 { padding-left: var(--space-3) !important; } .ps-4 { padding-left: var(--space-4) !important; } .ps-5 { padding-left: var(--space-5) !important; } .ps-6 { padding-left: var(--space-6) !important; } .ps-8 { padding-left: var(--space-8) !important; } .ps-10 { padding-left: var(--space-10) !important; } .ps-12 { padding-left: var(--space-12) !important; } .ps-16 { padding-left: var(--space-16) !important; } .ps-20 { padding-left: var(--space-20) !important; } .ps-24 { padding-left: var(--space-24) !important; } .ps-32 { padding-left: var(--space-32) !important; } .pe-0 { padding-right: var(--space-0) !important; } .pe-1 { padding-right: var(--space-1) !important; } .pe-2 { padding-right: var(--space-2) !important; } .pe-3 { padding-right: var(--space-3) !important; } .pe-4 { padding-right: var(--space-4) !important; } .pe-5 { padding-right: var(--space-5) !important; } .pe-6 { padding-right: var(--space-6) !important; } .pe-8 { padding-right: var(--space-8) !important; } .pe-10 { padding-right: var(--space-10) !important; } .pe-12 { padding-right: var(--space-12) !important; } .pe-16 { padding-right: var(--space-16) !important; } .pe-20 { padding-right: var(--space-20) !important; } .pe-24 { padding-right: var(--space-24) !important; } .pe-32 { padding-right: var(--space-32) !important; } // GAP UTILITIES (for flexbox and grid) .gap-0 { gap: var(--space-0) !important; } .gap-1 { gap: var(--space-1) !important; } .gap-2 { gap: var(--space-2) !important; } .gap-3 { gap: var(--space-3) !important; } .gap-4 { gap: var(--space-4) !important; } .gap-5 { gap: var(--space-5) !important; } .gap-6 { gap: var(--space-6) !important; } .gap-8 { gap: var(--space-8) !important; } .gap-10 { gap: var(--space-10) !important; } .gap-12 { gap: var(--space-12) !important; } .gap-16 { gap: var(--space-16) !important; } .gap-20 { gap: var(--space-20) !important; } .gap-24 { gap: var(--space-24) !important; } .gap-32 { gap: var(--space-32) !important; } .gap-x-0 { column-gap: var(--space-0) !important; } .gap-x-1 { column-gap: var(--space-1) !important; } .gap-x-2 { column-gap: var(--space-2) !important; } .gap-x-3 { column-gap: var(--space-3) !important; } .gap-x-4 { column-gap: var(--space-4) !important; } .gap-x-5 { column-gap: var(--space-5) !important; } .gap-x-6 { column-gap: var(--space-6) !important; } .gap-x-8 { column-gap: var(--space-8) !important; } .gap-x-10 { column-gap: var(--space-10) !important; } .gap-x-12 { column-gap: var(--space-12) !important; } .gap-x-16 { column-gap: var(--space-16) !important; } .gap-x-20 { column-gap: var(--space-20) !important; } .gap-x-24 { column-gap: var(--space-24) !important; } .gap-x-32 { column-gap: var(--space-32) !important; } .gap-y-0 { row-gap: var(--space-0) !important; } .gap-y-1 { row-gap: var(--space-1) !important; } .gap-y-2 { row-gap: var(--space-2) !important; } .gap-y-3 { row-gap: var(--space-3) !important; } .gap-y-4 { row-gap: var(--space-4) !important; } .gap-y-5 { row-gap: var(--space-5) !important; } .gap-y-6 { row-gap: var(--space-6) !important; } .gap-y-8 { row-gap: var(--space-8) !important; } .gap-y-10 { row-gap: var(--space-10) !important; } .gap-y-12 { row-gap: var(--space-12) !important; } .gap-y-16 { row-gap: var(--space-16) !important; } .gap-y-20 { row-gap: var(--space-20) !important; } .gap-y-24 { row-gap: var(--space-24) !important; } .gap-y-32 { row-gap: var(--space-32) !important; } // RESPONSIVE SPACING UTILITIES @media (min-width: 576px) { .m-sm-0 { margin: var(--space-0) !important; } .m-sm-1 { margin: var(--space-1) !important; } .m-sm-2 { margin: var(--space-2) !important; } .m-sm-3 { margin: var(--space-3) !important; } .m-sm-4 { margin: var(--space-4) !important; } .m-sm-6 { margin: var(--space-6) !important; } .m-sm-8 { margin: var(--space-8) !important; } .m-sm-12 { margin: var(--space-12) !important; } .m-sm-16 { margin: var(--space-16) !important; } .m-sm-20 { margin: var(--space-20) !important; } .m-sm-24 { margin: var(--space-24) !important; } .p-sm-0 { padding: var(--space-0) !important; } .p-sm-1 { padding: var(--space-1) !important; } .p-sm-2 { padding: var(--space-2) !important; } .p-sm-3 { padding: var(--space-3) !important; } .p-sm-4 { padding: var(--space-4) !important; } .p-sm-6 { padding: var(--space-6) !important; } .p-sm-8 { padding: var(--space-8) !important; } .p-sm-12 { padding: var(--space-12) !important; } .p-sm-16 { padding: var(--space-16) !important; } .p-sm-20 { padding: var(--space-20) !important; } .p-sm-24 { padding: var(--space-24) !important; } } @media (min-width: 768px) { .m-md-0 { margin: var(--space-0) !important; } .m-md-1 { margin: var(--space-1) !important; } .m-md-2 { margin: var(--space-2) !important; } .m-md-3 { margin: var(--space-3) !important; } .m-md-4 { margin: var(--space-4) !important; } .m-md-6 { margin: var(--space-6) !important; } .m-md-8 { margin: var(--space-8) !important; } .m-md-12 { margin: var(--space-12) !important; } .m-md-16 { margin: var(--space-16) !important; } .m-md-20 { margin: var(--space-20) !important; } .m-md-24 { margin: var(--space-24) !important; } .p-md-0 { padding: var(--space-0) !important; } .p-md-1 { padding: var(--space-1) !important; } .p-md-2 { padding: var(--space-2) !important; } .p-md-3 { padding: var(--space-3) !important; } .p-md-4 { padding: var(--space-4) !important; } .p-md-6 { padding: var(--space-6) !important; } .p-md-8 { padding: var(--space-8) !important; } .p-md-12 { padding: var(--space-12) !important; } .p-md-16 { padding: var(--space-16) !important; } .p-md-20 { padding: var(--space-20) !important; } .p-md-24 { padding: var(--space-24) !important; } } @media (min-width: 992px) { .m-lg-0 { margin: var(--space-0) !important; } .m-lg-1 { margin: var(--space-1) !important; } .m-lg-2 { margin: var(--space-2) !important; } .m-lg-3 { margin: var(--space-3) !important; } .m-lg-4 { margin: var(--space-4) !important; } .m-lg-6 { margin: var(--space-6) !important; } .m-lg-8 { margin: var(--space-8) !important; } .m-lg-12 { margin: var(--space-12) !important; } .m-lg-16 { margin: var(--space-16) !important; } .m-lg-20 { margin: var(--space-20) !important; } .m-lg-24 { margin: var(--space-24) !important; } .p-lg-0 { padding: var(--space-0) !important; } .p-lg-1 { padding: var(--space-1) !important; } .p-lg-2 { padding: var(--space-2) !important; } .p-lg-3 { padding: var(--space-3) !important; } .p-lg-4 { padding: var(--space-4) !important; } .p-lg-6 { padding: var(--space-6) !important; } .p-lg-8 { padding: var(--space-8) !important; } .p-lg-12 { padding: var(--space-12) !important; } .p-lg-16 { padding: var(--space-16) !important; } .p-lg-20 { padding: var(--space-20) !important; } .p-lg-24 { padding: var(--space-24) !important; } }gjx_$aileron-font-path: "/fonts/aileron/" !default; /*** Aileron**/ @font-face { font-family: 'Aileron Bold'; src: url("#{$aileron-font-path}Aileron-Bold-webfont.ttf") format("truetype"), url('#{$aileron-font-path}Aileron-Bold-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$aileron-font-path}Aileron-Bold-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Aileron Semi Bold'; src: url("#{$aileron-font-path}Aileron-SemiBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Aileron Heavy'; src: url("#{$aileron-font-path}Aileron-Heavy-webfont.ttf") format("truetype"), url('#{$aileron-font-path}Aileron-Heavy-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$aileron-font-path}Aileron-Heavy-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Aileron Light'; src: url("#{$aileron-font-path}Aileron-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Aileron Regular'; src: url("#{$aileron-font-path}Aileron-Regular-webfont.ttf") format("truetype"), url('#{$aileron-font-path}Aileron-Regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$aileron-font-path}Aileron-Regular-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .aileron { font-family: 'Aileron Regular'; } .aileron-heavy { font-family: 'Aileron Heavy'; } +׺xJ$alegreya-font-path: "/fonts/alegreya/" !default; @font-face { font-family: 'Alegreya'; src: url("#{$alegreya-font-path}Alegreya-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Alegreya Italic'; src: url("#{$alegreya-font-path}Alegreya-Italic-VariableFont_wght.ttf") format("truetype"); }orx)/* You can add global styles to this file, and also import other style files */ ////////////////////////////////////////////////////////////////////// // Fontfaces ./ ////////////////////////////////////////////////////////////////////// @import './alegreya'; @import './amarante'; @import './archivo'; @import './architectsdaughter.scss'; @import './averiaseriflibre'; @import './bebasneue'; @import './blinker'; @import './bonheurroyale'; @import './bonveno'; @import './cabin'; @import './cinzel'; @import './comfortaa'; @import './commissioner'; @import './crimson-text'; @import './dellarespira'; @import './dmsans'; @import './ebgaramond'; @import './epilogue'; @import './exo2'; @import './figtree'; @import './fraunces'; @import './iceland'; @import './geist'; @import './glassantiqua'; @import './inter'; @import './josefin_sans'; @import './karla'; @import './lato'; @import './leaguespartan'; @import './lexend'; @import './librebaskerville'; @import './limelight'; @import './lora'; @import './manrope'; @import './monasans'; @import './metropolis'; @import './merriweather'; @import './montserrat'; @import './opensans'; @import './outfit'; @import './overused'; @import './nacelle'; @import './notosans'; @import './nunito'; @import './oswald'; @import './playfair_display'; @import './plusjakatasans'; @import './poppins'; @import './questrial'; @import './quicksand'; @import './raleway'; @import './roboto'; @import './robotomono'; @import './robotoslab'; @import './rubik'; @import './sacramento'; @import './satoshi'; @import './sifonn'; @import './sixcaps'; @import './sourcesanspro'; @import './sora'; @import './sourcesanspro'; @import './spacegrotesk'; @import './spacemono'; @import './unbounded'; @import './urbanist'; @import './vollkorn'; @import './whisper'; @import './worksans'; @import './zillaslab';NUx$amarante-font-path: "/fonts/amarante/" !default; @font-face { font-family: 'Amarante Regular'; src: url("#{$amarante-font-path}Amarante-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } QLֳx$architectsdaughter-font-path: "/fonts/architectsdaughter/" !default; @font-face { font-family: 'Architects Daughter'; src: url("#{$architectsdaughter-font-path}ArchitectsDaughter-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } 9^׳xC$archivo-font-path: "/fonts/archivo/" !default; @font-face { font-family: 'Archivo'; src: url("#{$archivo-font-path}Archivo-VariableFont_wdth,wght.ttf") format("truetype"); } @font-face { font-family: 'Archivo'; src: url("#{$archivo-font-path}Archivo-Italic-VariableFont_wght.ttf") format("truetype"); } lxL$archivonarrow-font-path: "/fonts/archivonarrow/" !default; @font-face { font-family: "Archivo Narrow Regular"; src: local(Archivo Narrow Regular), url('#{$archivonarrow-font-path}ArchivoNarrow-Regular.ttf'); src: url("#{$archivonarrow-font-path}ArchivoNarrow-Regular.ttf") format("truetype"); font-weight: 500; } q˽6xm$averia-font-path: "/fonts/averiaseriflibre/" !default; @font-face { font-family: 'Averia Regular'; src: url("#{$averia-font-path}AveriaSerifLibre-Regular.ttf") format("truetype"); } @font-face { font-family: 'Averia Bold'; src: url("#{$averia-font-path}AveriaSerifLibre-Bold.ttf") format("truetype"); } @font-face { font-family: 'Averia Bold Italic'; src: url("#{$averia-font-path}AveriaSerifLibre-BoldItalic.ttf") format("truetype"); } @font-face { font-family: 'Averia Italic'; src: url("#{$averia-font-path}AveriaSerifLibre-talic.ttf") format("truetype"); } @font-face { font-family: 'Averia Light'; src: url("#{$averia-font-path}AveriaSerifLibre-Light.ttf") format("truetype"); } @font-face { font-family: 'Averia Light Italic'; src: url("#{$averia-font-path}AveriaSerifLibre-LightItalic.ttf") format("truetype"); } #7# "x $bebasneue-font-path: "/fonts/bebasneue/" !default; /*** Bebas Neue ***/ @font-face { font-family: 'Bebas Neue Regular'; src: url("#{$bebasneue-font-path}bebasneue-regular-webfont.ttf") format("truetype"), url('#{$bebasneue-font-path}bebasneue-regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$bebasneue-font-path}bebasneue-regular-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .bebas-neue { font-family: 'bebas_neueregular'; } :xY$blinker-font-path: "/fonts/blinker/" !default; /*** Blinker**/ @font-face { font-family: 'Blinker Bold'; src: url("#{$blinker-font-path}Blinker-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Blinker Semi Bold'; src: url("#{$blinker-font-path}Blinker-SemiBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Blinker Light'; src: url("#{$blinker-font-path}Blinker-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Blinker Regular'; src: url("#{$blinker-font-path}Blinker-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Blinker Thin'; src: url("#{$blinker-font-path}Blinker-Thin.ttf") format("truetype"); font-weight: normal; font-style: normal; } ]2x$bonheurroyale-font-path: "/fonts/bonheurroyale/" !default; @font-face { font-family: 'Bonheur Royale Regular'; src: url("#{$bonheurroyale-font-path}BonheurRoyale-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } /Wĸx$bonvenocf-font-path: "/fonts/bonvenocf/" !default; @font-face { font-family: "BonvenoCFLight"; src: url("#{$bonvenocf-font-path}BonvenoCF-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } 3Lհx@$cabin-font-path: "/fonts/cabin/" !default; @font-face { font-family: "Cabin"; src: url("#{$cabin-font-path}Cabin-VariableFont_wdth,wght.ttf") format("truetype"); } @font-face { font-family: "Cabin Italic"; src: url("#{$cabin-font-path}Cabin-Italic-VariableFont_wdth,wght.ttf") format("truetype"); } SiX xO$cinzel-font-path: "/fonts/cinzel/" !default; @font-face { font-family: "Cinzel"; src: url("#{$cinzel-font-path}Cinzel-VariableFont_wght.ttf") format("truetype"); } :Mx$comfortaa-font-path: "/fonts/comfortaa/" !default; @font-face { font-family: 'Comfortaa'; src: url("#{$comfortaa-font-path}Comfortaa-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } uP1 |xj$exo2-font-path: "/fonts/exo_2'.+Exo2'; src: url("#{$exo2-font-path}Exo2`5 9Exo2 Italic'; src: url("#{$exo2-font-path}Exo2-Italic`50л x$$commissioner-font-path: "/fonts/commissioner/" !default; @font-face { font-family: 'Commissioner'; src: url("#{$commissioner-font-path}Commissioner-VariableFont_FLAR,VOLM,slnt,wght.ttf") format("truetype"); } CKʳxs $cooperhewitt-font-path: "/fonts/cooperhewitt/" !default; /*** Cooper Hewitt ***/ @font-face { font-family: 'Cooper Hewitt Bold'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Bold.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Bold Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-BoldItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Book'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Book.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Book Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-BookItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Heavy'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Heavy.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Heavy Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-HeavyItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Light'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Light.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Light Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-LightItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Medium'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Medium.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Medium Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-MediumItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Semibold'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Semibold.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Semibold Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-SemiboldItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Thin'; src: url('#{$cooperhewitt-font-path}CooperHewitt-Thin.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Cooper Hewitt Thin Italic'; src: url('#{$cooperhewitt-font-path}CooperHewitt-ThinItalic.woff') format('woff'); /* Super Modern Browsers */ font-weight: normal; font-style: normal; } !fxk$crimsontext-font-path: "/fonts/crimson_text/" !default; @font-face { font-family: "Crimson Text Bold"; src: local(Crimson Text Bold), url('#{$crimsontext-font-path}CrimsonText-Bold.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-Bold.ttf") format("truetype"); font-weight: 700; } @font-face { font-family: "Crimson Text Bold Italic"; src: local(Crimson Text Bold Italic), url('#{$crimsontext-font-path}CrimsonText-BoldItalic.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-BoldItalic.ttf") format("truetype"); font-weight: 700; } @font-face { font-family: "Crimson Text Italic"; src: local(Crimson Text Italic), url('#{$crimsontext-font-path}CrimsonText-Italic.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-Italic.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Crimson Text Regular"; src: local(Crimson Text Regular), url('#{$crimsontext-font-path}CrimsonText-Regular.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-Regular.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Crimson Text Semi Bold"; src: local(Crimson Text Semi Bold), url('#{$crimsontext-font-path}CrimsonText-SemiBold.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-SemiBold.ttf") format("truetype"); font-weight: 600; } @font-face { font-family: "Crimson Text Semi Bold Italic"; src: local(Crimson Text Semi Bold Italic), url('#{$crimsontext-font-path}CrimsonText-SemiBoldItalic.ttf'); src: url("#{$crimsontext-font-path}CrimsonText-SemiBoldItalic.ttf") format("truetype"); font-weight: 600; } D*`x{$dancingscript-font-path: "/fonts/dancingscript/" !default; /*** Poppins ***/ @font-face { font-family: "Dancing Script"; src: local(Dancing Script), url('#{$dancingscript-font-path}DancingScript-Regular.ttf'); src: url("#{$dancingscript-font-path}DancingScript-Regular.ttf") format("truetype"); font-weight: 400; } .dancing-script { font-family: "Dancing Script"; } 6_x $dellarespira-font-path: "/fonts/dellarespira/" !default; @font-face { font-family: 'Della Respira'; src: url("#{$dellarespira-font-path}DellaRespira-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } 5R9x?$dmsans-font-path: "/fonts/dmsans/" !default; @font-face { font-family: 'DM Sans'; src: url("#{$dmsans-font-path}DMSans-VariableFont_opsz,wght.ttf") format("truetype") } @font-face { font-family: 'DM Sans Italic'; src: url("#{$dmsans-font-path}DMSans-Italic-VariableFont_opsz,wght.ttf") format("truetype") } kwxx$vesperlibre-font-path: "/fonts/vesperlibre/" !default; @font-face { font-family: 'Vesper Libre Regular'; src: url("#{$vesperlibre-font-path}VesperLibre-Regular.ttf") format("truetype"), url('#{$vesperlibre-font-path}VesperLibre-Regular.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$vesperlibre-font-path}VesperLibre-Regular.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .vesperlibre-regular { font-family: 'Vesper Libre Regular'; } @font-face { font-family: 'Vesper Libre Bold'; src: url("#{$vesperlibre-font-path}VesperLibre-Bold.ttf") format("truetype"), url('#{$vesperlibre-font-path}VesperLibre-Bold.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$vesperlibre-font-path}VesperLibre-Bold.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .vesperlibre-bold { font-family: 'Vesper Libre Bold'; } @font-face { font-family: 'Vesper Libre Medium'; src: url("#{$vesperlibre-font-path}VesperLibre-Medium.ttf") format("truetype"), url('#{$vesperlibre-font-path}VesperLibre-Medium.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$vesperlibre-font-path}VesperLibre-Medium.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .vesperlibre-medium { font-family: 'Vesper Libre Medium'; } @font-face { font-family: 'Vesper Libre Heavy'; src: url("#{$vesperlibre-font-path}VesperLibre-Heavy.ttf") format("truetype"), url('#{$vesperlibre-font-path}VesperLibre-Heavy.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$vesperlibre-font-path}VesperLibre-Heavy.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .vesperlibre-heavy { font-family: 'Vesper Libre Heavy'; } vux1"$nacelle-font-path: "/fonts/nacell*/;Nacelle Regular'; src: url("#{$nacelle-font-path}Nacell";5 Nacelle Semi>nacelle-font-path}Nacelle-Semiy;5Nacell=nacelle-font-path}Nacellw;5@Nacelle Heavy'; src: url("#{$nacelle-font-path}Nacelle-Heavy};5@Nacelle Black'; src: url("#{$nacelle-font-path}Nacelle-Black};5 @Nacelle Light'; src: url("#{$nacelle-font-path}Nacelle-Light};5 D8]xt6$ebgaramond-font-path: "/fonts/ebgaramond/" !default; ! EBGaramondq.ebgaramond-font-path}EBGaramond-VariableFont_wB"EBGaramond Italicq5ebgaramond-font-path}EBGaramond-Italic-VariableFont_w} /*1 EBGaramondebgaramond-font-path}EBGaramondS2EBGaramond Bold Italicq*ebgaramond-font-path}EBGaramond-BoldItalicN2EBGaramond Extra)ebgaramond-font-path}EBGaramond-ExtraBoldN2EBGaramond Extra Bold Italicq/ebgaramond-font-path}EBGaramond-ExtraBoldItalicO EBGaramond ebgaramond-font-path}EBGaramondAW2EBGaramond Semi Bold Italicq.ebgaramond-font-path}EBGaramond-SemiBoldItalicOfont-family: 'EBGaramond Mediumq&ebgaramond-font-path}EBGaramond-MediumO&font-family: 'EBGaramond Medium Italicq,ebgaramond-font-path}EBGaramond-MediumItalicO font-family: 'EBGaramond Regularqebgaramond-font-path}EBGaramondV*/?ͼx\$epilogue-font-path: "/fonts/epilogue/" !default; /*** Aileron**/ @font-face { font-family: 'Epilogue'; src: url("#{$epilogue-font-path}Epilogue-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Epilogue Italic'; src: url("#{$epilogue-font-path}Epilogue-Italic-VariableFont_wght.ttf") format("truetype"); } O txE$figtree-font-path: "/fonts/figtree/" !default; @font-face { font-family: 'Figtree'; src: url("#{$figtree-font-path}Figtree-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Figtree Italic'; src: url("#{$figtree-font-path}Figtree-Italic-VariableFont_wght.ttf") format("truetype"); } lx$fraunces-font-path: "/fonts/fraunces/" !default; @font-face { font-family: 'Fraunces'; src: url("#{$fraunces-font-path}Fraunces-VariableFontt.ttf") format("truetype"); font-weight: normal; font-style: normal; } L xU$geist-font-path: "/fonts/geist/" !default; @font-face { font-family: 'Geist'; src: url("#{$geist-font-path}Geist-VariableFont_wght.ttf") format("truetype"); } F8@x $glassantiqua-font-path: "/fonts/glassantiqua/" !default; @font-face { font-family: 'Glass Antiqua'; src: url("#{$glassantiqua-font-path}GlassAntiqua-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } Rx$iceland-font-path: "/fonts/iceland/" !default; @font-face { font-family: "Iceland Regular"; src: local(Lato Regular), url('#{$iceland-font-path}Iceland-Regular.ttf'); src: url("#{$iceland-font-path}Iceland-Regular.ttf") format("truetype"); font-weight: 400; } [8x%$inter-font-path: "/fonts/inter/" !default; /* @font-face { font-family: 'Inter'; src: urlll("#{$inter-font-path}Inter-V.otf") format("otf"); font-weight: normal; font-style: normal; } */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 100; font-display: swap; src: url("#{$inter-font-path}Inter-Thin.woff2") format("woff2"), url("#{$inter-font-path}Inter-Thin.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 100; font-display: swap; src: url("#{$inter-font-path}Inter-ThinItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-ThinItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: swap; src: url("#{$inter-font-path}Inter-ExtraLight.woff2") format("woff2"), url("#{$inter-font-path}Inter-ExtraLight.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 200; font-display: swap; src: url("#{$inter-font-path}Inter-ExtraLightItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-ExtraLightItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300; font-display: swap; src: url("#{$inter-font-path}Inter-Light.woff2") format("woff2"), url("#{$inter-font-path}Inter-Light.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 300; font-display: swap; src: url("#{$inter-font-path}Inter-LightItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-LightItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url("#{$inter-font-path}Inter-Regular.woff2") format("woff2"), url("#{$inter-font-path}Inter-Regular.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 400; font-display: swap; src: url("#{$inter-font-path}Inter-Italic.woff2") format("woff2"), url("#{$inter-font-path}Inter-Italic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url("#{$inter-font-path}Inter-Medium.woff2") format("woff2"), url("#{$inter-font-path}Inter-Medium.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 500; font-display: swap; src: url("#{$inter-font-path}Inter-MediumItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-MediumItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url("#{$inter-font-path}Inter-SemiBold.woff2") format("woff2"), url("#{$inter-font-path}Inter-SemiBold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 600; font-display: swap; src: url("#{$inter-font-path}Inter-SemiBoldItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-SemiBoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url("#{$inter-font-path}Inter-Bold.woff2") format("woff2"), url("#{$inter-font-path}Inter-Bold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 700; font-display: swap; src: url("#{$inter-font-path}Inter-BoldItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-BoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url("#{$inter-font-path}Inter-ExtraBold.woff2") format("woff2"), url("#{$inter-font-path}Inter-ExtraBold.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 800; font-display: swap; src: url("#{$inter-font-path}Inter-ExtraBoldItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-ExtraBoldItalic.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 900; font-display: swap; src: url("#{$inter-font-path}Inter-Black.woff2") format("woff2"), url("#{$inter-font-path}Inter-Black.woff") format("woff"); } @font-face { font-family: 'Inter'; font-style: italic; font-weight: 900; font-display: swap; src: url("#{$inter-font-path}Inter-BlackItalic.woff2") format("woff2"), url("#{$inter-font-path}Inter-BlackItalic.woff") format("woff"); } /^e$xJ$josefin-font-path: "/fonts/josefin/" !default; @font-face { font-family: "Josefin Sans"; src: local(Julius Sans One), url('#{$josefin-font-path}JosefinSans-VariableFont_wght.ttf'); src: url("#{$josefin-font-path}JosefinSans-VariableFont_wght.ttf") format("truetype"); font-weight: 500; } @font-face { font-family: "Josefin Sans Italic"; src: local(Julius Sans One), url('#{$josefin-font-path}JosefinSans-Italic-VariableFont_wght.ttf'); src: url("#{$josefin-font-path}JosefinSans-Italic-VariableFont_wght.ttf") format("truetype"); font-weight: 500; } 5x>$juliussansone-font-path: "/fonts/juliussansone/" !default; @font-face { font-family: "Julius Sans One"; src: local(Julius Sans One), url('#{$juliussansone-font-path}JuliusSansOne-Regular.ttf'); src: url("#{$juliussansone-font-path}JuliusSansOne-Regular.ttf") format("truetype"); font-weight: 500; } lx2$karla-font-path: "/fonts/karla/" !default; @font-face { font-family: 'Karla'; src: url("#{$karla-font-path}Karla-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Karla Italic'; src: url("#{$karla-font-path}Karla-Italic-VariableFont_wght.ttf") format("truetype"); }Ne=x,$kollektif-font-path: "/fonts/kollektif-webfont/" !default; /*** Kollektif**/ @font-face { font-family: 'Kollektif Bold'; src: url("#{$kollektif-font-path}kollektif-bold-webfont.ttf") format("truetype"), url('#{$kollektif-font-path}kollektif-bold-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$kollektif-font-path}kollektif-bold-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Kollektif Regular'; src: url("#{$kollektif-font-path}kollektif-webfont.ttf") format("truetype"), url('#{$kollektif-font-path}kollektif-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$kollektif-font-path}kollektif-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .kollektif-bold { font-family: 'kollektifbold'; } .kollektif { font-family: 'kollektifregular'; } {D/x$lato-font-path: "/fonts/lato/" !default; @font-face { font-family: "Lato Black"; src: local(Lato Black), url('#{$lato-font-path}Lato-Black.ttf'); src: url("#{$lato-font-path}Lato-Black.ttf") format("truetype"); font-weight: 500; } @font-face { font-family: "Lato Regular"; src: local(Lato Regular), url('#{$lato-font-path}Lato-Regular.ttf'); src: url("#{$lato-font-path}Lato-Regular.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Lato Medium"; src: local(Lato Regular), url('#{$lato-font-path}Lato-Medium.ttf'); src: url("#{$lato-font-path}Lato-Medium.ttf") format("truetype"); font-weight: 500; } .lato-black { font-family: "Lato Black"; } .lato-regular { font-family: "Lato Regular"; } q+o x+$leaguespartan-font-path: "/fonts/leaguespartan/" !default; @font-face { font-family: "League Spartan"; src: url("#{$leaguespartan-font-path}LeagueSpartan-VariableFont_wght.ttf") format("truetype"); } F8Hx$lexend-font-path: "/fonts/lexend/" !default; @font-face { font-family: 'Lexend'; src: url("#{$lexend-font-path}Lexend-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } t%J6xg$librebaskerville-font-path: "/fonts/librebaskerville/" !default; @font-face { font-family: "Libre Baskerville Bold"; src: local(Lato Black), url('#{$librebaskerville-font-path}LibreBaskerville-Bold.ttf'); src: url("#{$librebaskerville-font-path}LibreBaskerville-Bold.ttf") format("truetype"); font-weight: 500; } @font-face { font-family: "Libre Baskerville Italic"; src: local(Lato Regular), url('#{$librebaskerville-font-path}LibreBaskerville-Bold.ttf'); src: url("#{$librebaskerville-font-path}LibreBaskerville-Bold.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Libre Baskerville Regular"; src: local(Lato Regular), url('#{$librebaskerville-font-path}LibreBaskerville-Regular.ttf'); src: url("#{$librebaskerville-font-path}LibreBaskerville-Regular.ttf") format("truetype"); font-weight: 400; } (Դx$limelight-font-path: "/fonts/limelight/" !default; @font-face { font-family: 'Limelight'; src: url("#{$limelight-font-path}Limelight-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } SL2x,$lora-font-path: "/fonts/lora/" !default; @font-face { font-family: "Lora"; src: url("#{$lora-font-path}Lora-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: "Lora Italic"; src: url("#{$lora-font-path}Lora-Italic-VariableFont_wght.ttf") format("truetype"); } cxF$manrope-font-path: "/fonts/manrope/" !default; /* @font-face { font-family: "Manrope"; src: url("#{$manrope-font-path}Manrope-VariableFont_wght.ttf") format("truetype"); } */ @font-face { font-family: 'Manrope'; src: url("#{$manrope-font-path}Manrope-V.otf") format("otf"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 200; font-display: swap; src: url("#{$manrope-font-path}Manrope-ExtraLight.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-ExtraLight.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 300; font-display: swap; src: url("#{$manrope-font-path}Manrope-Light.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-Light.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400; font-display: swap; src: url("#{$manrope-font-path}Manrope-Regular.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-Regular.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 500; font-display: swap; src: url("#{$manrope-font-path}Manrope-Medium.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-Medium.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 600; font-display: swap; src: url("#{$manrope-font-path}Manrope-SemiBold.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-SemiBold.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 700; font-display: swap; src: url("#{$manrope-font-path}Manrope-Bold.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-Bold.woff") format("woff"); } @font-face { font-family: 'Manrope'; font-style: normal; font-weight: 800; font-display: swap; src: url("#{$manrope-font-path}Manrope-ExtraBold.woff2") format("woff2"), url("#{$manrope-font-path}Manrope-ExtraBold.woff") format("woff"); } xC$merriweather-font-path: "/fonts/merriweather/" !default; @font-face { font-family: 'Merriweather Regular'; src: url("#{$merriweather-font-path}merriweather-regular-webfont.ttf"); } @font-face { font-family: 'Merriweather Italic'; src: url("#{$merriweather-font-path}merriweather-italic-webfont.ttf"); } F5o[xN $opensans-font-path: "/fonts/opensans/" !default; @font-face { font-family: 'Open Sans'; src: url("#{$opensans-font-path}OpenSans-VariableFont_wdth.ttf") format("truetype"); font-style: normal; } @font-face { font-family: 'Open Sans Italic'; src: url("#{$opensans-font-path}OpenSans-Italic-VariableFont_wdth.ttf") format("truetype"); font-style: italic; } /* @font-face { font-family: 'Open Sans Bold'; src: url("#{$opensans-font-path}OpenSans-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-bold { font-family: 'Open Sans Bold'; } @font-face { font-family: 'Open Sans Bold Italic'; src: url("#{$opensans-font-path}OpenSans-BoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-bold-italic { font-family: 'Open Sans Bold Italic'; } @font-face { font-family: 'Open Sans Extra Bold'; src: url("#{$opensans-font-path}OpenSans-ExtraBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-extra-bold { font-family: 'Open Sans Extra Bold'; } @font-face { font-family: 'Open Sans Extra Bold Italic'; src: url("#{$opensans-font-path}Open Sans-ExtraBoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-extra-bold-italic { font-family: 'Open Sans Extra Bold Italic'; } @font-face { font-family: 'Open Sans Italic'; src: url("#{$opensans-font-path}OpenSans-Italic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-italic { font-family: 'Open Sans Italic'; } @font-face { font-family: 'Open Sans Light'; src: url("#{$opensans-font-path}OpenSans-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-light { font-family: 'Open Sans Light'; } @font-face { font-family: 'Open Sans Light Italic'; src: url("#{$opensans-font-path}OpenSans-LightItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-light-italic { font-family: 'Open Sans Light Italic'; } @font-face { font-family: 'Open Sans Regular'; src: url("#{$opensans-font-path}OpenSans-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-regular { font-family: 'Open Sans Regular'; } @font-face { font-family: 'Open Sans Semi Bold'; src: url("#{$opensans-font-path}OpenSans-SemiBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-semibold { font-family: 'Open Sans Semi Bold'; } @font-face { font-family: 'Open Sans Semi Bold Italic'; src: url("#{$opensans-font-path}OpenSans-SemiBoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .opensans-semibold-italic { font-family: 'Open Sans Semi Bold Italic'; } */0@U\xP5$metropolis-font-path: "/fonts/metropolis/" !default;q"Metropolis Regular+metropolis-font-path}Metropolis-Regular.otf8`Metropolis Regular1metropolis-font-path}Metropolis-RegularItalic.otf8`Metropolis Medium*metropolis-font-path}Metropolis-Medium.otf8`Metropolis Medium0metropolis-font-path}Metropolis-MediumItalic.otf8` Metropolisp (metropolis-font-path}Metropolis-Bold.otf8` Metropolis .metropolis-font-path}Metropolis-BoldItalic.otf8`Metropolis Extrap (metropolis-font-path}Metropolis-Bold.otf8` Metropoli'.metropolis-font-path}Metropolis-BoldItalic.otf8`Metropolis Black)metropolis-font-path}Metropolis-Black.otf8` Metropolij ,metropolis-font-path}Metropolis-SemiBold.otf8` Metropoli'2metropolis-font-path}Metropolis-SemiBoldItalic.otf8`Metropolis Thin(metropolis-font-path}Metropolis-Thin.otf8`Metropolis Thin.metropolis-font-path}Metropolis-ThinItalic.otf8`Metropolis Light)metropolis-font-path}Metropolis-Light.otf8`Metropolis Light/metropolis-font-path}Metropolis-LightItalic.otf8`Metropolis Extra Light.metropolis-font-path}Metropolis-ExtraLight.otf8`Metropolis Extra Light4metropolis-font-path}Metropolis-ExtraLightItalic.otf7'; x.$monasans-font-path: "/fonts/monasans/" !default; @font-face { font-family: 'Mona Sans'; src: url("#{$monasans-font-path}Mona-Sans.ttf") format("truetype"); font-weight: normal; font-style: normal; }ʾFelx9$montserrat-font-path: "/fonts/montserrat/" !default; @font-face { font-family: "Montserrat"; src: url("#{$montserrat-font-path}Montserrat-VariableFont_wght.ttf") format("truetype") } /* @font-face { font-family: "Montserrat Light"; src: local(Montserrat Light), url('#{$montserrat-font-path}Montserrat-Light.ttf'); src: url("#{$montserrat-font-path}Montserrat-Light.ttf") format("truetype"); font-weight: 300; } @font-face { font-family: "Montserrat Regular"; src: local(Montserrat Regular), url('#{$montserrat-font-path}Montserrat-Regular.ttf'); src: url("#{$montserrat-font-path}Montserrat-Regular.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Montserrat Bold"; src: local(Montserrat Bold), url('#{$montserrat-font-path}Montserrat-Bold.ttf'); src: url("#{$montserrat-font-path}Montserrat-Bold.ttf") format("truetype"); font-weight: 700; } @font-face { font-family: "Montserrat Semi Bold"; src: local(Montserrat Semi Bold), url('#{$montserrat-font-path}Montserrat-SemiBold.ttf'); src: url("#{$montserrat-font-path}Montserrat-SemiBold.ttf") format("truetype"); font-weight: 600; } @font-face { font-family: "Montserrat Medium"; src: local(Montserrat Medium), url('#{$montserrat-font-path}Montserrat-Medium.ttf'); src: url("#{$montserrat-font-path}Montserrat-Medium.ttf") format("truetype"); font-weight: 600; } @font-face { font-family: "Montserrat Hairline"; src: local(Montserrat Hairline), url('#{$montserrat-font-path}Montserrat-Hairline.ttf'); src: url("#{$montserrat-font-path}Montserrat-Hairline.ttf") format("truetype"); font-weight: 100; } .montserrat { font-family: "Montserrat"; } */Ix$norwester-font-path: "/fonts/norwester/" !default; /*** Norwester ***/ @font-face { font-family: 'Norwester'; src: url("#{$norwester-font-path}norwester-webfont.ttf") format("truetype"), url('#{$norwester-font-path}norwester-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$norwester-font-path}norwester-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .norwester { font-family: 'norwesterregular'; } Exh$notosans-font-path: "/fonts/notosans/" !default; /*** Aileron**/ @font-face { font-family: 'Noto Sans'; src: url("#{$notosans-font-path}NotoSans-VariableFont_wdth,wght.ttf") format("truetype"); } @font-face { font-family: 'Noto Sans Italic'; src: url("#{$notosans-font-path}NotoSans-Italic-VariableFont_wdth,wght.ttf") format("truetype"); } x;xO$nuntio-font-path: "/fonts/nunito/" !default; @font-face { font-family: 'Nunito'; src: url("#{$nuntio-font-path}Nunito-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Nunito Italic'; src: url("#{$nuntio-font-path}Nunito-Italic-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } /* @font-face { font-family: 'Nunito Regular'; src: url("#{$nuntio-font-path}Nunito-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Nunito Light'; src: url("#{$nuntio-font-path}Nunito-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Nunito Semi Bold'; src: url("#{$nuntio-font-path}Nunito-SemiBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } */6ư xO$oswald-font-path: "/fonts/oswald/" !default; @font-face { font-family: "Oswald"; src: url("#{$oswald-font-path}Oswald-VariableFont_wght.ttf") format("truetype"); } X:f xO$outfit-font-path: "/fonts/outfit/" !default; @font-face { font-family: 'Outfit'; src: url("#{$outfit-font-path}Outfit-VariableFont_wght.ttf") format("truetype"); } 9:Żx;$overused-font-path: "/fonts/overused/" !default; @font-face { font-family: "Overused"; src: url("#{$overused-font-path}OverusedGrotesk-VF.ttf") format("truetype"); } @font-face { font-family: "Overused Italic"; src: url("#{$overused-font-path}OverusedGroteskRoman-VF.ttf") format("truetype"); } i̸xw$playfairdisplay-font-path: "/fonts/playfair_display/" !default; @font-face { font-family: "Playfair Display"; src: url("#{$playfairdisplay-font-path}PlayfairDisplay-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: "Playfair Display Italic"; src: url("#{$playfairdisplay-font-path}PlayfairDisplay-Italic-VariableFont_wght.ttf") format("truetype"); } I/xv$plusJakartasans-font-path: "/fonts/plusjakatasans/" !default; @font-face { font-family: 'Plus Jakarta Sans'; src: url("#{$plusJakartasans-font-path}PlusJakartaSans-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Plus Jakarta Sans Italic'; src: url("#{$plusJakartasans-font-path}PlusJakartaSans-Italic-VariableFont_wght.ttf") format("truetype"); } +:hx|$poppins-font-path: "/fonts/poppins/" !default; /*** Poppins ***/ @font-face { font-family: 'Poppins Regular'; src: url("#{$poppins-font-path}poppins-regular-webfont.ttf") format("truetype"), url('#{$poppins-font-path}poppins-regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$poppins-font-path}poppins-regular-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Poppins Medium'; src: url("#{$poppins-font-path}poppins-medium-webfont.ttf") format("truetype"), url('#{$poppins-font-path}poppins-medium-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$poppins-font-path}poppins-medium-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Poppins Light'; src: url("#{$poppins-font-path}poppins-light-webfont.ttf") format("truetype"), url('#{$poppins-font-path}poppins-light-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$poppins-font-path}poppins-light-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Poppins Semi Bold'; src: url("#{$poppins-font-path}poppins-semibold-webfont.ttf") format("truetype"), url('#{$poppins-font-path}poppins-semibold-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$poppins-font-path}poppins-semibold-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } (!x 2$worksans-font-path: "/fonts/worksans/" !default; a! Work Sansq,worksans-font-path}WorkSans-VariableFont_wgh; } Work Sans Italicq3worksans-font-path}WorkSans-Italic-VariableFont_wgh; } /* Work Sans Boldq worksans-font-path}WorkSans-Bold;5b Work Sans Extra Boldq%worksans-font-path}WorkSans-ExtraBold;5b Work Sans Lightq worksans-font-path}WorkSans-Ligh;5b Work Sag#worksans-font-path}WorkSans-Regular;5b Work Sa $worksans-font-path}WorkSans-SemiBold;4*/wx$questrial-font-path: "/fonts/questrial/" !default; /*** Aileron**/ @font-face { font-family: 'Questrial Regular'; src: url("#{$questrial-font-path}Questrial-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } Sٱx$quicksand-font-path: "/fonts/quicksand/" !default; /*** Aileron**/ @font-face { font-family: 'Quicksand'; src: url("#{$quicksand-font-path}Quicksand-VariableFont_wght.ttf") format("truetype"); //font-weight: normal; font-style: normal; } ^Tֺxu$raleway-font-path: "/fonts/raleway/" !default; @font-face { font-family: 'Raleway'; src: url("#{$commissioner-font-path}Raleway-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Raleway Italic'; src: url("#{$commissioner-font-path}Raleway-Italic-VariableFont_wght.ttf") format("truetype"); } /* @font-face { font-family: 'Raleway Black'; src: url("#{$raleway-font-path}Raleway-Black.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-black { font-family: 'Raleway Black'; } @font-face { font-family: 'Raleway Black Italic'; src: url("#{$raleway-font-path}Raleway-BlackItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-black-italic { font-family: 'Raleway Black Italic'; } @font-face { font-family: 'Raleway Bold'; src: url("#{$raleway-font-path}Raleway-Bold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-bold { font-family: 'Raleway Bold'; } @font-face { font-family: 'Raleway Bold Italic'; src: url("#{$raleway-font-path}Raleway-BoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-bold-italic { font-family: 'Raleway Bold Italic'; } @font-face { font-family: 'Raleway Extra Bold'; src: url("#{$raleway-font-path}Raleway-ExtraBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-extra-bold { font-family: 'Raleway Extra Bold'; } @font-face { font-family: 'Raleway Extra Bold Italic'; src: url("#{$raleway-font-path}Raleway-ExtraBoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-extra-bold-italic { font-family: 'Raleway Extra Bold Italic'; } @font-face { font-family: 'Raleway Extra Light'; src: url("#{$raleway-font-path}Raleway-ExtraLight.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-extra-light { font-family: 'Raleway Extra Light'; } @font-face { font-family: 'Raleway Extra Light Italic'; src: url("#{$raleway-font-path}Raleway-ExtraLightItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-extra-light-italic { font-family: 'Raleway Extra Light Italic'; } @font-face { font-family: 'Raleway Italic'; src: url("#{$raleway-font-path}Raleway-Italic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-italic { font-family: 'Raleway Italic'; } @font-face { font-family: 'Raleway Light'; src: url("#{$raleway-font-path}Raleway-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-light { font-family: 'Raleway Light'; } @font-face { font-family: 'Raleway Light Italic'; src: url("#{$raleway-font-path}Raleway-LightItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-light-italic { font-family: 'Raleway Light Italic'; } @font-face { font-family: 'Raleway Medium'; src: url("#{$raleway-font-path}Raleway-Medium.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-medium { font-family: 'Raleway Medium'; } @font-face { font-family: 'Raleway Medium Italic'; src: url("#{$raleway-font-path}Raleway-MediumItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-medium-italic { font-family: 'Raleway Medium Italic'; } @font-face { font-family: 'Raleway Regular'; src: url("#{$raleway-font-path}Raleway-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-regular { font-family: 'Raleway Regular'; } @font-face { font-family: 'Raleway Semi Bold'; src: url("#{$raleway-font-path}Raleway-SemiBold.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-semibold { font-family: 'Raleway Semi Bold'; } @font-face { font-family: 'Raleway Semi Bold Italic'; src: url("#{$raleway-font-path}Raleway-SemiBoldItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-semibold-italic { font-family: 'Raleway Semi Bold Italic'; } @font-face { font-family: 'Raleway Thin'; src: url("#{$raleway-font-path}Raleway-Thin.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-thin { font-family: 'Raleway Thin'; } @font-face { font-family: 'Raleway Thin Italic'; src: url("#{$raleway-font-path}Raleway-ThinItalic.ttf") format("truetype"); font-weight: normal; font-style: normal; } .raleway-thin-italic { font-family: 'Raleway Thin Italic'; } */&:xV$roboto-font-path: "/fonts/roboto/" !default; /**************************************************************** ROBOTO ****************************************************************/ @font-face { font-family: "Roboto"; src: url("#{$roboto-font-path}Roboto-Thin.ttf") format("truetype"); font-weight: 200; } @font-face { font-family: "Roboto Light"; src: url("#{$roboto-font-path}Roboto-Light.ttf") format("truetype"); font-weight: 300; } @font-face { font-family: "Roboto Regular"; src: url("#{$roboto-font-path}Roboto-Regular.ttf") format("truetype"); font-weight: 400; } @font-face { font-family: "Roboto Medium"; src: url("#{$roboto-font-path}Roboto-Medium.ttf") format("truetype"); font-weight: 500; } @font-face { font-family: "Roboto"; src: url("#{$roboto-font-path}Roboto-Bold.ttf") format("truetype"); font-weight: 700; } .roboto { font-family: "Roboto"; } 82x~$robotocondensed-font-path: "/fonts/robotocondensed/" !default; @font-face { font-family: 'Roboto Condensed'; src: url("#{$robotocondensed-font-path}RobotoCondensed-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Roboto Condensed Italic'; src: url("#{$robotocondensed-font-path}RobotoCondensed-Italic-VariableFont_wght.ttf") format("truetype"); } x\$robotomono-font-path: "/fonts/robotomono/" !default; @font-face { font-family: 'Ronotomono'; src: url("#{$robotomono-font-path}RobotoMono-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Ronotomono Italic'; src: url("#{$robotomono-font-path}RobotoMono-Italic-VariableFont_wght.ttf") format("truetype"); } ,w x:$robotoslab-font-path: "/fonts/robotoslab/" !default; @font-face { font-family: "Roboto Slab"; src: url("#{$robotoslab-font-path}RobotoSlab-VariableFont_wght.ttf") format("truetype"); } Bx4$rubik-font-path: "/fonts/rubik/" !default; @font-face { font-family: 'Rubik'; src: url("#{$rubik-font-path}Rubik-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Rubik Italic'; src: url("#{$rubik-font-path}Rubik-Italic-VariableFont_wght.ttf") format("truetype"); } XQf x $sacramento-font-path: "/fonts/sacramento/" !default; @font-face { font-family: 'Sacramento Regular'; font-style: normal; src: url("#{$sacramento-font-path}Sacramento-Regular.ttf") format("truetype"), url('#{$sacramento-font-path}sacramento-regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sacramento-font-path}sacramento-regular-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: 400; } .sacramento { font-family: 'sacramentoregular'; } uxo$satoshi-font-path: "/fonts/satoshi/" !default; @font-face { font-family: 'Satoshi'; src: url("#{$satoshi-font-path}Satoshi-Variable.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Satoshi Semi Bold'; src: url("#{$satoshi-font-path}Satoshi-Variable.ttf") format("truetype"); font-weight:bolder; font-style: normal; } dx$sifonn-font-path: "/fonts/sifonn/" !default; /*** Sifonn ***/ @font-face { font-family: 'Sifonn'; src: url("#{$sifonn-font-path}sifonn_basic-webfont.ttf") format("truetype"), url('#{$sifonn-font-path}sifonn_basic-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sifonn-font-path}sifonn_basic-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } .sifonn { font-family: 'sifonnbasic'; } x*$sixcaps-font-path: "/fonts/six-caps/" !default; @font-face { font-family: 'Six Caps'; src: url("#{$sixcaps-font-path}SixCaps.ttf") format("truetype"); font-weight: normal; font-style: normal; } _Evx@$sora-font-path: "/fonts/sora/" !default; @font-face { font-family: 'Sora'; src: url("#{$sora-font-path}Sora[wght].ttf") format("truetype"); } @font-face { font-family: 'Sora Italic'; src: url("#{$sora-font-path}Sora-Italic[wght].ttf") format("truetype"); } .sora-regular { letter-spacing: -0.5%; }dgxr$sourcesanspro-font-path: "/fonts/sourcesanspro/" !default; /*** Source Sans Pro ***/ @font-face { font-family: 'Source Sans Pro'; src: url("#{$sourcesanspro-font-path}SourceSans3-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Source Sans Pro Italic'; src: url("#{$sourcesanspro-font-path}SourceSans3-Italic-VariableFont_wght.ttf") format("truetype"); } ${x $sourceserifpro-font-path: "/fonts/sourceserifpro/" !default; /*** Source Sans Pro ***/ @font-face { font-family: 'Source Serif Pro Black'; src: url("#{$sourceserifpro-font-path}sourceserifpro-black-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-black-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-black-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Source Serif Pro Bold'; src: url("#{$sourceserifpro-font-path}sourceserifpro-bold-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-bold-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-bold-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Source Serif Pro SemiBold'; src: url("#{$sourceserifpro-font-path}sourceserifpro-semibold-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-semibold-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-semibold-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Source Serif Pro ExtraLight'; src: url("#{$sourceserifpro-font-path}sourceserifpro-extralight-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-extralight-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-extralight-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Source Serif Pro Light'; src: url("#{$sourceserifpro-font-path}sourceserifpro-light-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-light-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-light-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Source Serif Pro Regular'; src: url("#{$sourceserifpro-font-path}sourceserifpro-regular-webfont.ttf") format("truetype"), url('#{$sourceserifpro-font-path}sourceserifpro-regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('#{$sourceserifpro-font-path}sourceserifpro-regular-webfont.woff') format('woff'); /* Modern Browsers */ font-weight: normal; font-style: normal; } pA x1$spacegrotesk-font-path: "/fonts/spacegrotesk/" !default; @font-face { font-family: "Space Grotesk"; src: url("#{$spacegrotesk-font-path}SpaceGrotesk-VariableFont_wght.ttf") format("truetype"); } F$xH$spacemono-font-path: "/fonts/spacemono/" !default; @font-face { font-family: 'Space Mono Bold'; src: url("#{$spacemono-font-path}SpaceMono-Bold.ttf") format("truetype"); } @font-face { font-family: 'Space Mono Bold Italic'; src: url("#{$spacemono-font-path}SpaceMono-BoldItalic.ttf") format("truetype"); } @font-face { font-family: 'Space Mono Italic'; src: url("#{$spacemono-font-path}SpaceMono-Italic.ttf") format("truetype"); } @font-face { font-family: 'Space Mono Regular'; src: url("#{$spacemono-font-path}SpaceMono-Regular.ttf") format("truetype"); } ׾ x1$unbounded-font-path: "/fonts/unbounded/" !default; /*** Aileron**/ @font-face { font-family: 'Unbounded'; src: url("#{$unbounded-font-path}Unbounded-VariableFont_wght.ttf") format("truetype"); } bDxJ$urbanist-font-path: "/fonts/urbanist/" !default; @font-face { font-family: 'Urbanist'; src: url("#{$urbanist-font-path}Urbanist-VariableFont_wght.ttf") format("truetype"); } @font-face { font-family: 'Urbanist Italic'; src: url("#{$urbanist-font-path}Urbanist-Italic-VariableFont_wght.ttf") format("truetype"); }TpֿxP$vollkorn-font-path: "/fonts/vollkorn/" !default; @font-face { font-family: 'Vollkorn'; src: url("#{$vollkorn-font-path}Vollkorn-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Vollkorn Italic'; src: url("#{$vollkorn-font-path}Vollkorn-Italic-VariableFont_wght.ttf") format("truetype"); font-weight: normal; font-style: normal; } x$whisper-font-path: "/fonts/whisper/" !default; @font-face { font-family: 'Whisper Regular'; src: url("#{$whisper-font-path}Whisper-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; } IKsXx~$zillaslab-font-path: "/fonts/zillaslab/" !default; @font-face { font-family: 'Zilla Slab Bold'; src: url("#{$zillaslab-font-path}ZillaSlab-Bold.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Bold Italic'; src: url("#{$zillaslab-font-path}ZillaSlab-BoldItalic.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Italic'; src: url("#{$zillaslab-font-path}ZillaSlab-Italic.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Regular'; src: url("#{$zillaslab-font-path}ZillaSlab-Regular.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Light'; src: url("#{$zillaslab-font-path}ZillaSlab-Light.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Light Italic'; src: url("#{$zillaslab-font-path}ZillaSlab-LightItalic.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Medium'; src: url("#{$zillaslab-font-path}ZillaSlab-Medium.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Medium Italic'; src: url("#{$zillaslab-font-path}ZillaSlab-MediumItalic.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Semi Bold'; src: url("#{$zillaslab-font-path}ZillaSlab-SemiBold.ttf") format("truetype"); } @font-face { font-family: 'Zilla Slab Semi Bold Italic'; src: url("#{$zillaslab-font-path}ZillaSlab-SemiBoldItalic.ttf") format("truetype"); } !J9xo// ========================================================================== // SHARED-UI STYLES MAIN ENTRY POINT // ========================================================================== // Complete design system including base tokens, semantic tokens, and components // This is the primary entry point for importing the entire design system // // Usage: // @use 'path/to/shared-ui/src/styles' as styles; // color: styles.$semantic-color-primary; // // For tokens only: // @use 'path/to/shared-ui/src/styles/tokens' as tokens; // ========================================================================== // Forward semantic layer (includes base tokens automatically) @forward 'semantic/index'; // Forward font faces @forward 'fontfaces/all-fontfaces'; // Note: Commons should be imported separately to avoid circular dependencies // Import commons: @use 'path/to/shared-ui/src/styles/commons';&Ժx*3// ========================================================================== // SEMANTIC TYPOGRAPHY // ========================================================================== // Meaningful typography tokens for content hierarchy and UI components // Maps base typography values to contextual usage patterns // ========================================================================== @use '../../base/typography' as *; // CONTENT HIERARCHY - Semantic text roles $semantic-typography-heading-display: ( font-family: $base-typography-font-family-display, font-size: $base-typography-font-size-4xl, font-weight: $base-typography-font-weight-bold, line-height: $base-typography-line-height-tight, letter-spacing: $base-typography-letter-spacing-tight, ) !default; $semantic-typography-heading-h1: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-3xl, font-weight: $base-typography-font-weight-bold, line-height: $base-typography-line-height-tight, letter-spacing: $base-typography-letter-spacing-tight, ) !default; $semantic-typography-heading-h2: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-2xl, font-weight: $base-typography-font-weight-semibold, line-height: $base-typography-line-height-snug, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-heading-h3: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-xl, font-weight: $base-typography-font-weight-semibold, line-height: $base-typography-line-height-snug, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-heading-h4: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-lg, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-heading-h5: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-font-family-sans: $base-typography-font-family-sans !default; $semantic-typography-font-family-serif: $base-typography-font-family-serif !default; $semantic-typography-font-family-mono: $base-typography-font-family-mono !default; $semantic-typography-font-family-display: $base-typography-font-family-display !default; // INDIVIDUAL TOKENS - For easier access in component styles $semantic-typography-heading-h1-size: $base-typography-font-size-3xl !default; $semantic-typography-heading-h1-weight: $base-typography-font-weight-bold !default; $semantic-typography-heading-h1-line-height: $base-typography-line-height-tight !default; $semantic-typography-heading-h2-size: $base-typography-font-size-2xl !default; $semantic-typography-heading-h2-weight: $base-typography-font-weight-semibold !default; $semantic-typography-heading-h2-line-height: $base-typography-line-height-snug !default; $semantic-typography-heading-h3-size: $base-typography-font-size-xl !default; $semantic-typography-heading-h3-weight: $base-typography-font-weight-semibold !default; $semantic-typography-heading-h3-line-height: $base-typography-line-height-snug !default; $semantic-typography-heading-h4-size: $base-typography-font-size-lg !default; $semantic-typography-heading-h4-weight: $base-typography-font-weight-medium !default; $semantic-typography-heading-h4-line-height: $base-typography-line-height-normal !default; $semantic-typography-heading-h5-size: $base-typography-font-size-md !default; $semantic-typography-heading-h5-weight: $base-typography-font-weight-medium !default; $semantic-typography-heading-h5-line-height: $base-typography-line-height-normal !default; // ICON TYPOGRAPHY - Icon sizing for different contexts $semantic-typography-icon-small-size: $base-typography-font-size-sm !default; $semantic-typography-icon-medium-size: $base-typography-font-size-lg !default; $semantic-typography-icon-large-size: $base-typography-font-size-xl !default; // BREAKPOINT TOKENS - For responsive adjustments $semantic-breakpoint-sm: 640px !default; $semantic-breakpoint-md: 768px !default; $semantic-breakpoint-lg: 1024px !default; // BODY TEXT - Content text styles $semantic-typography-body-large: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-lg, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-relaxed, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-body-medium: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-relaxed, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-body-small: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; // UI COMPONENT TEXT - Interface elements $semantic-typography-button-large: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-none, letter-spacing: $base-typography-letter-spacing-wide, ) !default; $semantic-typography-button-medium: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-none, letter-spacing: $base-typography-letter-spacing-wide, ) !default; $semantic-typography-button-small: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-xs, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-none, letter-spacing: $base-typography-letter-spacing-wider, ) !default; // FORM TEXT - Input and label styles $semantic-typography-label: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-input: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-placeholder: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; // NAVIGATION TEXT - Menu and navigation styles $semantic-typography-nav-primary: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-md, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-nav-secondary: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; // UTILITY TEXT - Captions, tags, etc. $semantic-typography-caption: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-xs, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-tag: ( font-family: $base-typography-font-family-sans, font-size: $base-typography-font-size-xs, font-weight: $base-typography-font-weight-medium, line-height: $base-typography-line-height-none, letter-spacing: $base-typography-letter-spacing-wide, ) !default; $semantic-typography-code-inline: ( font-family: $base-typography-font-family-mono, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-normal, letter-spacing: $base-typography-letter-spacing-normal, ) !default; $semantic-typography-code-block: ( font-family: $base-typography-font-family-mono, font-size: $base-typography-font-size-sm, font-weight: $base-typography-font-weight-normal, line-height: $base-typography-line-height-relaxed, letter-spacing: $base-typography-letter-spacing-normal, ) !default; // INDIVIDUAL SEMANTIC FONT WEIGHTS - Direct access to weight values $semantic-typography-font-weight-thin: $base-typography-font-weight-thin !default; $semantic-typography-font-weight-extralight: $base-typography-font-weight-extralight !default; $semantic-typography-font-weight-light: $base-typography-font-weight-light !default; $semantic-typography-font-weight-normal: $base-typography-font-weight-normal !default; $semantic-typography-font-weight-medium: $base-typography-font-weight-medium !default; $semantic-typography-font-weight-semibold: $base-typography-font-weight-semibold !default; $semantic-typography-font-weight-bold: $base-typography-font-weight-bold !default; $semantic-typography-font-weight-extrabold: $base-typography-font-weight-extrabold !default; $semantic-typography-font-weight-black: $base-typography-font-weight-black !default; // INDIVIDUAL SEMANTIC FONT SIZES - Direct access to size values $semantic-typography-font-size-xs: $base-typography-font-size-xs !default; $semantic-typography-font-size-sm: $base-typography-font-size-sm !default; $semantic-typography-font-size-md: $base-typography-font-size-md !default; $semantic-typography-font-size-lg: $base-typography-font-size-lg !default; $semantic-typography-font-size-xl: $base-typography-font-size-xl !default; $semantic-typography-font-size-2xl: $base-typography-font-size-2xl !default; $semantic-typography-font-size-3xl: $base-typography-font-size-3xl !default; $semantic-typography-font-size-4xl: $base-typography-font-size-4xl !default; $semantic-typography-font-size-5xl: $base-typography-font-size-5xl !default; $semantic-typography-font-size-6xl: $base-typography-font-size-6xl !default; $semantic-typography-font-size-7xl: $base-typography-font-size-7xl !default; $semantic-typography-font-size-8xl: $base-typography-font-size-8xl !default; $semantic-typography-font-size-9xl: $base-typography-font-size-9xl !default; $semantic-typography-font-size-10xl: $base-typography-font-size-10xl !default; $semantic-typography-font-size-11xl: $base-typography-font-size-11xl !default; // INDIVIDUAL SEMANTIC LINE HEIGHTS - Direct access to line height values $semantic-typography-line-height-none: $base-typography-line-height-none !default; $semantic-typography-line-height-tight: $base-typography-line-height-tight !default; $semantic-typography-line-height-snug: $base-typography-line-height-snug !default; $semantic-typography-line-height-normal: $base-typography-line-height-normal !default; $semantic-typography-line-height-relaxed: $base-typography-line-height-relaxed !default; $semantic-typography-line-height-loose: $base-typography-line-height-loose !default; $semantic-typography-line-height-3: $base-typography-line-height-3 !default; $semantic-typography-line-height-4: $base-typography-line-height-4 !default; $semantic-typography-line-height-5: $base-typography-line-height-5 !default; $semantic-typography-line-height-6: $base-typography-line-height-6 !default; $semantic-typography-line-height-7: $base-typography-line-height-7 !default; $semantic-typography-line-height-8: $base-typography-line-height-8 !default; $semantic-typography-line-height-9: $base-typography-line-height-9 !default; $semantic-typography-line-height-10: $base-typography-line-height-10 !default; // INDIVIDUAL SEMANTIC LETTER SPACING - Direct access to letter spacing values $semantic-typography-letter-spacing-tighter: $base-typography-letter-spacing-tighter !default; $semantic-typography-letter-spacing-tight: $base-typography-letter-spacing-tight !default; $semantic-typography-letter-spacing-normal: $base-typography-letter-spacing-normal !default; $semantic-typography-letter-spacing-wide: $base-typography-letter-spacing-wide !default; $semantic-typography-letter-spacing-wider: $base-typography-letter-spacing-wider !default; $semantic-typography-letter-spacing-widest: $base-typography-letter-spacing-widest !default;R< 8xcfd INDEX QContextual typography system,Ka // Note: base tokens imported at semantic/index level // Semantic typography mappings @import '1 ';I7+x[Z BORDERS INDEXO(border system for components and UI elemborder borders';{ xUZ COLORS INDEXOH// Meaningful color system that bridges base tokens with component usagecolor=colors'; // Interactive state colors @import 'state-colors';`^oLV|W;m x3// ========================================================================== // SEMANTIC Z-INDEX // ========================================================================== // Meaningful z-index tokens for layering and stacking context // Maps base z-index values to contextual usage patterns // ========================================================================== @use '../../base/z-index' as *; // LAYERING HIERARCHY - Component and UI element stacking $semantic-z-index-background: $base-z-index-neg-1 !default; // Background elements $semantic-z-index-base: $base-z-index-0 !default; // Base layer elements $semantic-z-index-content: $base-z-index-10 !default; // Main content layer $semantic-z-index-elevated: $base-z-index-20 !default; // Elevated content $semantic-z-index-floating: $base-z-index-30 !default; // Floating elements // NAVIGATION LAYERS - Menu and navigation stacking $semantic-z-index-nav-primary: $base-z-index-40 !default; // Primary navigation $semantic-z-index-nav-secondary: $base-z-index-50 !default; // Secondary navigation $semantic-z-index-breadcrumb: $base-z-index-10 !default; // Breadcrumb navigation // INTERACTIVE LAYERS - User interaction elements $semantic-z-index-dropdown: $base-z-index-dropdown !default; // Dropdown menus $semantic-z-index-popover: $base-z-index-popover !default; // Popovers and tooltips $semantic-z-index-tooltip: $base-z-index-tooltip !default; // Tooltips $semantic-z-index-banner: $base-z-index-banner !default; // Notification banners // OVERLAY LAYERS - Modal and overlay elements $semantic-z-index-sticky: $base-z-index-sticky !default; // Sticky elements $semantic-z-index-fixed: $base-z-index-fixed !default; // Fixed position elements $semantic-z-index-modal-backdrop: $base-z-index-modal-backdrop !default; // Modal backdrop $semantic-z-index-overlay: $base-z-index-overlay !default; // General overlays $semantic-z-index-modal: $base-z-index-modal !default; // Modal dialogs // NOTIFICATION LAYERS - Alerts and notifications $semantic-z-index-toast: $base-z-index-toast !default; // Toast notifications $semantic-z-index-alert: $base-z-index-60 !default; // Alert messages $semantic-z-index-snackbar: $base-z-index-70 !default; // Snackbar notifications // UTILITY LAYERS - Special purpose elements $semantic-z-index-loading: $base-z-index-80 !default; // Loading overlays $semantic-z-index-debug: $base-z-index-debug !default; // Debug/development elements $semantic-z-index-max: $base-z-index-max !default; // Maximum z-index value // COMPONENT-SPECIFIC LAYERS $semantic-z-index-header: $base-z-index-30 !default; // Page/section headers $semantic-z-index-sidebar: $base-z-index-20 !default; // Sidebar panels $semantic-z-index-footer: $base-z-index-10 !default; // Page/section footers $semantic-z-index-card-hover: $base-z-index-10 !default; // Cards on hover $semantic-z-index-button-focus: $base-z-index-10 !default; // Focused buttons // INDIVIDUAL SEMANTIC Z-INDEX TOKENS - Direct access to all base z-index values $semantic-z-index-neg-10: $base-z-index-neg-10 !default; $semantic-z-index-neg-1: $base-z-index-neg-1 !default; $semantic-z-index-0: $base-z-index-0 !default; $semantic-z-index-10: $base-z-index-10 !default; $semantic-z-index-20: $base-z-index-20 !default; $semantic-z-index-30: $base-z-index-30 !default; $semantic-z-index-40: $base-z-index-40 !default; $semantic-z-index-50: $base-z-index-50 !default; $semantic-z-index-60: $base-z-index-60 !default; $semantic-z-index-70: $base-z-index-70 !default; $semantic-z-index-80: $base-z-index-80 !default; $semantic-z-index-90: $base-z-index-90 !default; $semantic-z-index-100: $base-z-index-100 !default;B'xy// ========================================================================== // DESIGN TOKENS ENTRY POINT // ========================================================================== // Complete design token system including base and semantic tokens // Use this file to import only tokens without components/commons // // Usage: // @use 'path/to/shared-ui/src/styles/tokens' as tokens; // color: tokens.$semantic-color-primary; // margin: tokens.$base-space-4; // ========================================================================== // Forward complete semantic layer (includes base tokens) @forward 'semantic/index';S'jxeC95rx0#Ph#aͮz[̲,!x[̴iBraۻ;w},Ѫc`3qZ/ yNx[̴iBHG'%;‚wjנz2{x[̴iBȉ_\8qCbuqzF(x[̴iBHLGݘg7Q-%Ciia Ux[̴iBQ-{XJ%JM oxa\(L"{ru-x̅2¸ϛmvVۑ]:xb2V9i%]v; 53x-v,m>%54"y6t>R -xGBSBCnR! 0xm`#40000 fab-menujnEs-{`&40000 icon-buttonlօkCAF[8&9ǥUlZٲb ?{CL3H>%M@jSx,_d5ٓoB37R(R6O>%Mx8!]63/%B!P7NŰGn E$l9q x$LK8f7&hl1>4K9zNbscssY`3I=#+ڑOtܬS-EmT.B2)L8c_oq3/u}Ag*kP0 ݘqLt x;Q"LoͦnL6QEdjx"o"+@X&_#1H3xz@use "../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles .ui-button { // Reset and base styles display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: $semantic-border-radius-md; cursor: pointer; text-decoration: none; outline: none; position: relative; overflow: hidden; // Typography font-family: $semantic-typography-font-family-sans; font-weight: $semantic-typography-font-weight-medium; text-align: center; text-transform: none; letter-spacing: $semantic-typography-letter-spacing-normal; white-space: nowrap; // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // Size variants &--small { height: $semantic-spacing-9; // 2.25rem padding: 0 $semantic-spacing-3; // 0.75rem font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-tight; min-width: $semantic-spacing-16; // 4rem } &--medium { height: $semantic-spacing-11; // 2.75rem padding: 0 $semantic-spacing-4; // 1rem font-size: $semantic-typography-font-size-md; line-height: $semantic-typography-line-height-normal; min-width: $semantic-spacing-20; // 5rem } &--large { height: $semantic-spacing-12; // 3rem + a bit padding: 0 $semantic-spacing-6; // 1.5rem font-size: $semantic-typography-font-size-lg; line-height: $semantic-typography-line-height-normal; min-width: $semantic-spacing-24; // 6rem } // Filled variant (primary) &--filled { background-color: $semantic-color-interactive-primary; color: $semantic-color-on-brand-primary; &:hover:not(:disabled) { background-color: $semantic-color-brand-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { transform: scale(0.98); box-shadow: $semantic-shadow-button-active; } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Tonal variant &--tonal { background-color: $semantic-color-container-primary; color: $semantic-color-on-container-primary; &:hover:not(:disabled) { background-color: $semantic-color-container-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; filter: brightness(0.95); } &:active:not(:disabled) { transform: scale(0.98); } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Outlined variant &--outlined { background-color: transparent; color: $semantic-color-interactive-primary; border: $semantic-border-width-1 solid $semantic-color-border-primary; &:hover:not(:disabled) { background-color: $semantic-color-container-primary; border-color: $semantic-color-interactive-primary; transform: translateY(-1px); } &:active:not(:disabled) { background-color: $semantic-color-container-primary; transform: scale(0.98); filter: brightness(0.9); } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // States &--disabled { opacity: 0.38; cursor: not-allowed; pointer-events: none; } &--loading { cursor: wait; .button-content { opacity: 0; } } &--full-width { width: 100%; } // Icon styles .button-content { display: flex; align-items: center; justify-content: center; } .button-icon { display: inline-flex; align-items: center; flex-shrink: 0; &--left { margin-right: $semantic-spacing-2; // 0.5rem } &--right { margin-left: $semantic-spacing-2; // 0.5rem } } // Size-specific icon adjustments &--small .button-icon { font-size: $semantic-typography-font-size-xs; &--left { margin-right: $semantic-spacing-1-5; // 0.375rem } &--right { margin-left: $semantic-spacing-1-5; // 0.375rem } } &--medium .button-icon { font-size: $semantic-typography-font-size-sm; &--left { margin-right: $semantic-spacing-2; // 0.5rem } &--right { margin-left: $semantic-spacing-2; // 0.5rem } } &--large .button-icon { font-size: $semantic-typography-font-size-md; &--left { margin-right: $semantic-spacing-2-5; // 0.625rem } &--right { margin-left: $semantic-spacing-2-5; // 0.625rem } } // Loader styles .button-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .button-spinner { width: $semantic-spacing-4; // 1rem height: $semantic-spacing-4; // 1rem border: 2px solid currentColor; border-top: 2px solid transparent; border-radius: 50%; animation: spin 1s linear infinite; opacity: 0.7; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Ripple effect &::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%); transform: scale(0); opacity: 0; pointer-events: none; transition: transform 0.3s ease, opacity 0.3s ease; } &:active:not(:disabled)::after { transform: scale(1); opacity: 1; transition: none; } }Dxk3A8#(5E4sjQbYxx import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { IconDefinition } from '@fortawesome/fontawesome-svg-core'; export type ButtonVariant = 'filled' | 'tonal' | 'outlined'; export type ButtonSize = 'small' | 'medium' | 'large'; export type IconPosition = 'left' | 'right'; @Component({ selector: 'ui-button', standalone: true, imports: [CommonModule, FontAwesomeModule], changeDetection: ChangeDetectionStrategy.OnPush, template: ` `, styleUrl: './button.component.scss' }) export class ButtonComponent { @Input() variant: ButtonVariant = 'filled'; @Input() size: ButtonSize = 'medium'; @Input() disabled: boolean = false; @Input() loading: boolean = false; @Input() type: 'button' | 'submit' | 'reset' = 'button'; @Input() fullWidth: boolean = false; @Input() class: string = ''; @Input() icon?: IconDefinition; @Input() iconPosition: IconPosition = 'left'; @Output() clicked = new EventEmitter(); get buttonClasses(): string { return [ 'ui-button', `ui-button--${this.variant}`, `ui-button--${this.size}`, this.disabled ? 'ui-button--disabled' : '', this.loading ? 'ui-button--loading' : '', this.fullWidth ? 'ui-button--full-width' : '', this.icon ? 'ui-button--with-icon' : '', this.icon ? `ui-button--icon-${this.iconPosition}` : '', this.class ].filter(Boolean).join(' '); } handleClick(event: Event): void { if (!this.disabled && !this.loading) { this.clicked.emit(event); } } } x!3aWjEA~QBIeA{F~qTF{X[fy`L7fɩ,-YU`B`CJKJs RJ< JK443R]e}<=Kb@XP5$fB\p1eǡ62?4H-x!^`#gr~d F[#Q{^F9L㏨Ē"ĢDݜĤԜX[%VR$5Eũ)@UP̒T$|)ddf5(ˍ~fYi0/HJv6i`dCVXVu s RJ:xhT+fX)*j*4+N>&[rt^X!p5Y&;YO^&oBqIQf^5.M' yF] ߴBB{qP:T,X`a=9Cx%e!N ax0 simple񾓺Fsimple(Simple +variant: 'primary' | 'secondary' = 'primaryF40j7simple-button', `ui-simple-button--${this.variantsimple-button--disabled' : ''na/uH?xu TexJtex4tex((texTtex)Tex $Tex1~text-button', `ui-tex3tex3tex $i#&xyimport { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, HostListener, ElementRef, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; export type FabMenuSize = 'sm' | 'md' | 'lg'; export type FabMenuPosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left'; export type FabMenuVariant = 'primary' | 'secondary' | 'success' | 'danger'; export type FabMenuDirection = 'up' | 'down' | 'left' | 'right' | 'auto'; export interface FabMenuItem { id: string; label: string; icon?: string; disabled?: boolean; variant?: FabMenuVariant; } @Component({ selector: 'ui-fab-menu', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (isOpen) { } @if (isOpen && backdrop) { }
    `, styleUrl: './fab-menu.component.scss' }) export class FabMenuComponent { @Input() size: FabMenuSize = 'md'; @Input() variant: FabMenuVariant = 'primary'; @Input() position: FabMenuPosition = 'bottom-right'; @Input() direction: FabMenuDirection = 'auto'; @Input() menuItems: FabMenuItem[] = []; @Input() disabled = false; @Input() triggerIcon?: string; @Input() closeIcon?: string; @Input() triggerLabel = 'Open menu'; @Input() backdrop = true; @Input() closeOnItemClick = true; @Input() closeOnOutsideClick = true; @Output() opened = new EventEmitter(); @Output() closed = new EventEmitter(); @Output() itemClicked = new EventEmitter<{item: FabMenuItem, event: Event}>(); private elementRef = inject(ElementRef); isOpen = false; isAnimating = false; get actualDirection(): FabMenuDirection { if (this.direction !== 'auto') return this.direction; // Auto-determine direction based on position switch (this.position) { case 'bottom-right': case 'bottom-left': return 'up'; case 'top-right': case 'top-left': return 'down'; default: return 'up'; } } @HostListener('document:click', ['$event']) onDocumentClick(event: Event): void { const target = event.target as Node; if (this.closeOnOutsideClick && this.isOpen && target && !this.elementRef.nativeElement.contains(target)) { this.close(); } } @HostListener('keydown.escape') onEscapePress(): void { if (this.isOpen) { this.close(); } } toggle(event?: Event): void { if (this.disabled) return; if (this.isOpen) { this.close(); } else { this.open(); } } open(): void { if (this.disabled || this.isOpen) return; this.isAnimating = true; this.isOpen = true; this.opened.emit(); // Focus first menu item after animation setTimeout(() => { this.isAnimating = false; this.focusFirstMenuItem(); }, 200); } close(): void { if (!this.isOpen) return; this.isAnimating = true; this.isOpen = false; this.closed.emit(); setTimeout(() => { this.isAnimating = false; }, 200); } handleItemClick(item: FabMenuItem, event: Event): void { if (item.disabled || this.disabled) return; this.itemClicked.emit({ item, event }); if (this.closeOnItemClick) { this.close(); } } handleTriggerKeydown(event: KeyboardEvent): void { switch (event.key) { case 'Enter': case ' ': event.preventDefault(); this.toggle(); break; case 'ArrowUp': if (this.actualDirection === 'up') { event.preventDefault(); if (!this.isOpen) this.open(); } break; case 'ArrowDown': if (this.actualDirection === 'down') { event.preventDefault(); if (!this.isOpen) this.open(); } break; } } handleItemKeydown(item: FabMenuItem, event: KeyboardEvent): void { switch (event.key) { case 'Enter': case ' ': event.preventDefault(); this.handleItemClick(item, event); break; case 'ArrowUp': event.preventDefault(); this.focusPreviousItem(event.target as HTMLElement); break; case 'ArrowDown': event.preventDefault(); this.focusNextItem(event.target as HTMLElement); break; case 'Tab': if (event.shiftKey) { this.focusPreviousItem(event.target as HTMLElement); } else { this.focusNextItem(event.target as HTMLElement); } break; } } private focusFirstMenuItem(): void { const firstItem = this.elementRef.nativeElement.querySelector('.ui-fab-menu__item:not([disabled])'); if (firstItem) { firstItem.focus(); } } private focusNextItem(currentElement: HTMLElement): void { const items = Array.from(this.elementRef.nativeElement.querySelectorAll('.ui-fab-menu__item:not([disabled])')); const currentIndex = items.indexOf(currentElement); const nextIndex = (currentIndex + 1) % items.length; (items[nextIndex] as HTMLElement).focus(); } private focusPreviousItem(currentElement: HTMLElement): void { const items = Array.from(this.elementRef.nativeElement.querySelectorAll('.ui-fab-menu__item:not([disabled])')); const currentIndex = items.indexOf(currentElement); const previousIndex = currentIndex === 0 ? items.length - 1 : currentIndex - 1; (items[previousIndex] as HTMLElement).focus(); } } H9xo?A;[class]="getFabMenuClasses()[class]="getItemClasses(item);[class]="getTriggerClasses() , getFabMenuClasses(): string { return [ 'ui-fab-menu', `ui-fab-menu--${this.size}`, `ui-fab-menu--${this.variant}`, `ui-fab-menu--${this.position}`, `ui-fab-menu--${this.actualDirection}`, this.isOpen ? 'ui-fab-m(enu--open' : '', this.disabled ? 'O' : '',? '~a' : '' ].filter(Boolean).join(' '); } getTriggerClasses(): string { return [ '  ', ` -${this.size}`, ` (-${this.variant}`, this.isOpen ? '  ' : '' ].filter(Boolean).join(' '); } getItemClasses(item: FabMenuItem): string { const variant = item.variant || =this.variant; return [ 'ui-fab-menu__item', `$${variant}`, item.disabled ? '/disabled' : '' ].filter(Boolean).join(' '); u x%export * from './fab-menu.component'; ӹx)@use "../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-fab { // Reset and base styles display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 50%; cursor: pointer; outline: none; position: relative; overflow: hidden; // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all $semantic-motion-duration-normal $semantic-motion-easing-ease-out; // Size variants &--small { width: $semantic-spacing-10; // 2.5rem height: $semantic-spacing-10; // 2.5rem box-shadow: $semantic-shadow-card-hover; .fab-icon { font-size: $semantic-typography-font-size-lg; // 1.125rem } .fab-touch-overlay { width: $semantic-spacing-4; // 1rem height: $semantic-spacing-4; // 1rem top: $semantic-spacing-3; // 0.75rem left: $semantic-spacing-3; // 0.75rem border-radius: $semantic-border-radius-sm; } .fab-spinner { width: $semantic-spacing-4; // 1rem height: $semantic-spacing-4; // 1rem border-width: $semantic-border-width-2; // 2px (closest to 1.5px) } } &--medium { width: $semantic-spacing-14; // 3.5rem height: $semantic-spacing-14; // 3.5rem box-shadow: $semantic-shadow-card-active; .fab-icon { font-size: $semantic-typography-font-size-2xl; // 1.5rem } .fab-touch-overlay { width: $semantic-spacing-5; // 1.25rem height: $semantic-spacing-5; // 1.25rem top: $semantic-spacing-4-5; // ~1.125rem (closest available) left: $semantic-spacing-4-5; // ~1.125rem (closest available) border-radius: $semantic-border-radius-lg; } .fab-spinner { width: $semantic-spacing-5; // 1.25rem height: $semantic-spacing-5; // 1.25rem border-width: $semantic-border-width-2; } } &--large { width: $semantic-spacing-24; // 6rem height: $semantic-spacing-24; // 6rem box-shadow: $semantic-shadow-card-featured; .fab-icon { font-size: $semantic-typography-font-size-5xl; // 3rem (closest to 2.5rem) } .fab-touch-overlay { width: $semantic-spacing-10; // 2.5rem height: $semantic-spacing-10; // 2.5rem top: $semantic-spacing-7; // 1.75rem left: $semantic-spacing-7; // 1.75rem border-radius: $semantic-border-radius-xl; } .fab-spinner { width: $semantic-spacing-8; // 2rem height: $semantic-spacing-8; // 2rem border-width: $semantic-border-width-3; } } // Color variants &--primary { background-color: $semantic-color-interactive-primary; color: $semantic-color-on-brand-primary; &:hover:not(:disabled) { background-color: $semantic-color-brand-primary; transform: $semantic-motion-hover-transform-scale-md; box-shadow: $semantic-shadow-elevation-4; } } &--secondary { background-color: $semantic-color-interactive-secondary; color: $semantic-color-on-brand-secondary; &:hover:not(:disabled) { background-color: $semantic-color-brand-secondary; transform: $semantic-motion-hover-transform-scale-md; box-shadow: $semantic-shadow-elevation-4; } } &--tertiary { background-color: $semantic-color-interactive-tertiary; color: $semantic-color-on-brand-tertiary; &:hover:not(:disabled) { background-color: $semantic-color-brand-tertiary; transform: $semantic-motion-hover-transform-scale-md; box-shadow: $semantic-shadow-elevation-4; } } // Position variants &--bottom-right { position: fixed; bottom: $semantic-spacing-8; // 2rem right: $semantic-spacing-6; // 1.5rem z-index: $semantic-z-index-toast; // 1080 } &--bottom-left { position: fixed; bottom: $semantic-spacing-8; // 2rem left: $semantic-spacing-6; // 1.5rem z-index: $semantic-z-index-toast; // 1080 } &--top-right { position: fixed; top: $semantic-spacing-8; // 2rem right: $semantic-spacing-6; // 1.5rem z-index: $semantic-z-index-toast; // 1080 } &--top-left { position: fixed; top: $semantic-spacing-8; // 2rem left: $semantic-spacing-6; // 1.5rem z-index: $semantic-z-index-toast; // 1080 } // States &:active:not(:disabled) { transform: scale(0.92); } &:focus-visible { box-shadow: $semantic-shadow-button-focus, $semantic-shadow-card-active; } &--disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; box-shadow: $semantic-shadow-elevation-1; } &--loading { cursor: wait; .fab-icon { opacity: $semantic-opacity-invisible; } } // Pulse effect &--pulse { overflow: visible; .fab-pulse { position: absolute; width: 100%; height: 100%; background-color: inherit; border-radius: inherit; animation: fab-pulse 2s infinite; z-index: -1; } } @keyframes fab-pulse { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.4); opacity: 0; } } // Expand animation &--expanding { animation: fab-expand 300ms cubic-bezier(0, 0, 0.2, 1); } @keyframes fab-expand { 0% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.2); opacity: 0.8; } 100% { transform: scale(1); opacity: 1; } } // Touch overlay for ripple effect .fab-touch-overlay { position: absolute; background-color: rgba(0, 0, 0, 0); z-index: 1; pointer-events: none; } // Icon container .fab-icon { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; line-height: 1; } // Loader styles .fab-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; } .fab-spinner { border: 2px solid rgba(255, 255, 255, 0.3); border-top: 2px solid white; border-radius: 50%; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Ripple effect &::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%); transform: scale(0); opacity: 0; pointer-events: none; transition: transform 0.3s ease, opacity 0.3s ease; border-radius: inherit; } &:active:not(:disabled)::after { transform: scale(1); opacity: 1; transition: none; } // Extended FAB support (for future use) &--extended { border-radius: $semantic-border-radius-pill; // 1.75rem equivalent padding: 0 $semantic-spacing-4; // 1rem width: auto; min-width: $semantic-spacing-20; // 5rem height: $semantic-spacing-14; // 3.5rem .fab-icon { margin-right: $semantic-spacing-1-5; // 0.375rem } } }7x[ib(gqFbQjniFUNⰐx import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; export type FabSize = 'small' | 'medium' | 'large'; export type FabVariant = 'primary' | 'secondary' | 'tertiary'; export type FabPosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left' | 'static'; @Component({ selector: 'ui-fab', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: ` `, styleUrl: './fab.component.scss' }) export class FabComponent { @Input() variant: FabVariant = 'primary'; @Input() size: FabSize = 'medium'; @Input() disabled: boolean = false; @Input() loading: boolean = false; @Input() type: 'button' | 'submit' | 'reset' = 'button'; @Input() position: FabPosition = 'static'; @Input() pulse: boolean = false; @Input() expandOnClick: boolean = false; @Input() class: string = ''; @Output() clicked = new EventEmitter(); get fabClasses(): string { return [ 'ui-fab', `ui-fab--${this.variant}`, `ui-fab--${this.size}`, `ui-fab--${this.position}`, this.disabled ? 'ui-fab--disabled' : '', this.loading ? 'ui-fab--loading' : '', this.pulse ? 'ui-fab--pulse' : '', this.expandOnClick ? 'ui-fab--expandable' : '', this.class ].filter(Boolean).join(' '); } handleClick(event: Event): void { if (!this.disabled && !this.loading) { this.clicked.emit(event); if (this.expandOnClick) { // Add animation class for expand effect (event.target as HTMLElement).classList.add('ui-fab--expanding'); setTimeout(() => { (event.target as HTMLElement).classList.remove('ui-fab--expanding'); }, 300); } } } }9xU@use "../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-ghost-button { // Reset and base styles display: inline-flex; align-items: center; justify-content: center; border: $semantic-border-width-1 solid transparent; background: transparent; cursor: pointer; text-decoration: none; outline: none; position: relative; overflow: hidden; border-radius: $semantic-border-radius-lg; // Typography font-family: $semantic-typography-font-family-sans; font-weight: $semantic-typography-font-weight-medium; text-align: center; text-transform: none; letter-spacing: $semantic-typography-letter-spacing-wide; white-space: nowrap; color: $semantic-color-text-secondary; // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease-out; // Size variants &--small { height: $semantic-spacing-9; // 2.25rem padding: 0 $semantic-spacing-2; // 0.5rem font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-normal; min-width: $semantic-spacing-16; // 4rem } &--medium { height: $semantic-spacing-11; // 2.75rem padding: 0 $semantic-spacing-4; // 1rem font-size: $semantic-typography-font-size-md; line-height: $semantic-typography-line-height-normal; min-width: $semantic-spacing-20; // 5rem } &--large { height: $semantic-spacing-12; // 3rem (closest to 3.25rem) padding: 0 $semantic-spacing-6; // 1.5rem font-size: $semantic-typography-font-size-lg; line-height: $semantic-typography-line-height-normal; min-width: $semantic-spacing-24; // 6rem } // Hover states &:hover:not(:disabled) { background-color: $semantic-color-surface-container; color: $semantic-color-text-primary; border-color: $semantic-color-border-secondary; transform: $semantic-motion-hover-transform-lift-sm; box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { background-color: $semantic-color-surface-high; transform: scale(0.98); box-shadow: $semantic-shadow-none; } &:focus-visible { background-color: $semantic-color-surface-container; border-color: $semantic-color-border-focus; box-shadow: $semantic-shadow-button-focus; } // States &--disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } &--loading { cursor: wait; .ghost-button-content { opacity: $semantic-opacity-invisible; } } &--full-width { width: 100%; } // Loader styles .ghost-button-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .ghost-button-spinner { width: $semantic-spacing-4; // 1rem height: $semantic-spacing-4; // 1rem border: $semantic-border-width-2 solid rgba($semantic-color-brand-primary, 0.3); border-top: $semantic-border-width-2 solid $semantic-color-brand-primary; border-radius: $semantic-border-radius-full; animation: spin 1s $semantic-motion-easing-linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Ripple effect (basic implementation) &::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba($semantic-color-brand-primary, 0.08) 0%, transparent 70%); transform: scale(0); opacity: $semantic-opacity-invisible; pointer-events: none; transition: transform $semantic-motion-duration-normal $semantic-motion-easing-ease, opacity $semantic-motion-duration-normal $semantic-motion-easing-ease; border-radius: inherit; } &:active:not(:disabled)::after { transform: scale(1); opacity: $semantic-opacity-opaque; transition: none; } }`b 8xQKtexOznone󆳦interactive-prim}- 'smC8; // 2% 1; // 0.25,2W` 50; // 2.&;^_1" 3; // 0.75,2x`A &08)N 7 &12);N0.98)3 &08)1 tex N// Loader styles .tex wtex" 03-5; // 0.875rem3-5; // 0.875rem ! 1 // closest to 1.5px 12 mcx[%X~(gqFbQjniFV~L<&8x[%%;A8#(5E4ssIjD*ԉ6/cd+I-JL.,K-(̝|v.:SqdgU FXU L=#:FY&a|ŔJo2,֓X'oc|p231T9Do[}"߰9Nȭl`9ُ]vdqsd?~1V=KZcRCG L듟ZP\RZ̥[UVm `k ܴ(5w9fyatAƉ'6 '(+Tl-dh 6Fg/98xd@E // Tokens available globally via main application styles .ui-simpleH&mdWbox-sizing: border-boxG0B8Btext-align: center; white-space: nowrap; // Default sizing , 4; // 1rem l{\mPrimary variant &--primary%don-brand-primary; %!  Y(-1px); (hover; }  { / (Bactive; } &:focus-visible { outline: 2px solid ; outline-offset: 2px@  Secondary variant &--secondary%container-primaryon-container-primary;Q $/1 solid $semantic-color-border-primary; % container-primary; border-d 6Y(-1px); filter: brightness(0.95); }  { %container-primary; / W filter: brightness(0.9); } &:focus-visible { outline: 2px solid ; outline-offset: 2px@ Disabled state &:gk} 9x "2LF,R[ЖM/S; x$@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-icon-button { // Reset and base styles display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: $semantic-border-radius-md; cursor: pointer; text-decoration: none; outline: none; position: relative; overflow: hidden; // Make it square/circular aspect-ratio: 1; flex-shrink: 0; // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // Size variants - square buttons with proper touch targets &--small { width: $semantic-spacing-component-padding-xl; // 1.5rem height: $semantic-spacing-component-padding-xl; border-radius: $semantic-border-radius-sm; .icon-button-icon { font-size: $semantic-spacing-component-md; // 0.75rem } } &--medium { width: $semantic-spacing-interactive-touch-target; // 2.75rem height: $semantic-spacing-interactive-touch-target; border-radius: $semantic-border-radius-md; .icon-button-icon { font-size: $semantic-spacing-component-lg; // 1rem } } &--large { width: $semantic-spacing-layout-section-xs; // 2rem but we need larger height: $semantic-spacing-layout-section-xs; border-radius: $semantic-border-radius-lg; .icon-button-icon { font-size: $semantic-spacing-component-xl; // 1.5rem } } // Filled variant (primary) &--filled { background-color: $semantic-color-brand-primary; color: $semantic-color-on-brand-primary; &:hover:not(:disabled) { background-color: $semantic-color-brand-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-elevation-2; filter: brightness(1.1); } &:active:not(:disabled) { transform: scale(0.95); box-shadow: $semantic-shadow-elevation-1; } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Tonal variant &--tonal { background-color: $semantic-color-surface-interactive; color: $semantic-color-text-primary; &:hover:not(:disabled) { background-color: $semantic-color-surface-interactive; transform: translateY(-1px); box-shadow: $semantic-shadow-elevation-2; filter: brightness(0.95); } &:active:not(:disabled) { transform: scale(0.95); } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Outlined variant &--outlined { background-color: transparent; color: $semantic-color-brand-primary; border: $semantic-border-width-1 solid $semantic-color-border-primary; &:hover:not(:disabled) { background-color: $semantic-color-surface-interactive; border-color: $semantic-color-brand-primary; transform: translateY(-1px); } &:active:not(:disabled) { background-color: $semantic-color-surface-interactive; transform: scale(0.95); filter: brightness(0.9); } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // States &--disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } &--loading { cursor: wait; .icon-button-icon { opacity: 0; } } &--pressed { background-color: $semantic-color-surface-selected; color: $semantic-color-text-primary; &.ui-icon-button--outlined { border-color: $semantic-color-brand-primary; } } // Icon styles .icon-button-icon { display: inline-flex; align-items: center; justify-content: center; transition: opacity 200ms ease; } // Loader styles .icon-button-loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .icon-button-spinner { width: $semantic-spacing-component-lg; // 1rem height: $semantic-spacing-component-lg; border: 2px solid currentColor; border-top: 2px solid transparent; border-radius: 50%; animation: spin 1s linear infinite; opacity: 0.7; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Ripple effect &::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%); transform: scale(0); opacity: 0; pointer-events: none; transition: transform 0.3s ease, opacity 0.3s ease; } &:active:not(:disabled)::after { transform: scale(1); opacity: 1; transition: none; } }2x[6WmgqFbQjniF?BM{x(export * from './icon-button.component';: x=export * from './simple-button.component'; export * from './button.component'; export * from './text-button.component'; export * from './ghost-button.component'; export * from './fab.component';CmOx +*#_dxK(/*QRH+UPO*-)K-K+QJEWSZQKbT%&@775{3s rRrQqAN&E@,WJ^x$icon-button'; z⶚x Y@use "../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles .ui-simple-button { // Reset and base styles display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: $semantic-border-radius-md; cursor: pointer; text-decoration: none; outline: none; position: relative; box-sizing: border-box; // Typography font-family: $semantic-typography-font-family-sans; font-weight: $semantic-typography-font-weight-medium; font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-normal; text-align: center; white-space: nowrap; // Default sizing height: $semantic-spacing-10; // 2.5rem padding: 0 $semantic-spacing-4; // 1rem min-width: $semantic-spacing-20; // 5rem // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; // Transitions transition: all $semantic-motion-duration-fast $semantic-motion-easing-ease-out; // Primary variant &--primary { background-color: $semantic-color-interactive-primary; color: $semantic-color-on-brand-primary; &:hover:not(:disabled) { background-color: $semantic-color-brand-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { transform: scale(0.98); box-shadow: $semantic-shadow-button-active; } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Secondary variant &--secondary { background-color: $semantic-color-container-primary; color: $semantic-color-on-container-primary; border: $semantic-border-width-1 solid $semantic-color-border-primary; &:hover:not(:disabled) { background-color: $semantic-color-container-primary; border-color: $semantic-color-interactive-primary; transform: translateY(-1px); filter: brightness(0.95); } &:active:not(:disabled) { background-color: $semantic-color-container-primary; transform: scale(0.98); filter: brightness(0.9); } &:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } } // Disabled state &:disabled { opacity: $semantic-opacity-disabled; cursor: not-allowed; pointer-events: none; } })Kx3GwIMr?79-s>m[!x|g6t(g?DxGwtA_#5 њ[5ɨ axK(/*QRH+UP/.,M*-)K-K+Q1x#.@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-split-button { // Reset and base styles display: inline-flex; align-items: center; position: relative; border-radius: $semantic-border-radius-md; overflow: hidden; // Size variants &--small { height: $semantic-spacing-9; // 2.25rem .ui-split-button__primary, .ui-split-button__dropdown { font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-tight; } } &--medium { height: $semantic-spacing-11; // 2.75rem .ui-split-button__primary, .ui-split-button__dropdown { font-size: $semantic-typography-font-size-md; line-height: $semantic-typography-line-height-normal; } } &--large { height: $semantic-spacing-12; // 3rem .ui-split-button__primary, .ui-split-button__dropdown { font-size: $semantic-typography-font-size-lg; line-height: $semantic-typography-line-height-normal; } } // Full width variant &--full-width { width: 100%; } // Disabled state &--disabled { opacity: 0.38; cursor: not-allowed; pointer-events: none; } // Primary button part &__primary { display: inline-flex; align-items: center; justify-content: center; border: none; cursor: pointer; text-decoration: none; outline: none; flex: 1; height: 100%; // Match the container height // Default colors (filled variant) background-color: $semantic-color-interactive-primary; color: $semantic-color-on-primary; // Typography font-family: $semantic-typography-font-family-sans; font-size: $semantic-typography-font-size-md; // Default medium size font-weight: $semantic-typography-font-weight-medium; line-height: $semantic-typography-line-height-normal; // Default medium line-height text-align: center; text-transform: none; letter-spacing: $semantic-typography-letter-spacing-normal; white-space: nowrap; // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // Default hover state &:hover:not(:disabled) { background-color: $semantic-color-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { transform: scale(0.98); box-shadow: $semantic-shadow-button-active; } &:focus-visible { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } // Size-specific padding .ui-split-button--small & { padding: 0 $semantic-spacing-3; // 0.75rem } .ui-split-button--medium & { padding: 0 $semantic-spacing-4; // 1rem } .ui-split-button--large & { padding: 0 $semantic-spacing-6; // 1.5rem } } // Dropdown button part &__dropdown { display: inline-flex; align-items: center; justify-content: center; border: none; cursor: pointer; outline: none; position: relative; // Default colors (filled variant) background-color: $semantic-color-interactive-primary; color: $semantic-color-on-primary; // Typography font-family: $semantic-typography-font-family-sans; font-size: $semantic-typography-font-size-md; // Default medium size font-weight: $semantic-typography-font-weight-medium; line-height: $semantic-typography-line-height-normal; // Default medium line-height // Default size (medium) - defaults only width: $semantic-spacing-9; // Default to medium size padding: 0 $semantic-spacing-2-5; // Default medium padding // Interaction states user-select: none; -webkit-tap-highlight-color: transparent; box-sizing: border-box; // Transitions transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); // Default hover state &:hover:not(:disabled) { background-color: $semantic-color-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { transform: scale(0.98); box-shadow: $semantic-shadow-button-active; } &:focus-visible { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } // Divider between buttons &::before { content: ''; position: absolute; left: 0; top: 20%; height: 60%; width: 1px; background-color: currentColor; opacity: 0.3; } } // Size-specific dropdown dimensions (must come after default styles) &--small &__dropdown { width: $semantic-spacing-8; // 2rem - slightly smaller than height height: $semantic-spacing-9; // Match small container height padding: 0 $semantic-spacing-2; // 0.5rem } &--medium &__dropdown { width: $semantic-spacing-9; // 2.25rem - smaller than height height: $semantic-spacing-11; // Match medium container height padding: 0 $semantic-spacing-2-5; // 0.625rem } &--large &__dropdown { width: $semantic-spacing-10; // 2.5rem - smaller than height height: $semantic-spacing-12; // Match large container height padding: 0 $semantic-spacing-3; // 0.75rem } // Content wrapper &__content { display: flex; align-items: center; justify-content: center; } // Icon styles &__icon { display: inline-flex; align-items: center; flex-shrink: 0; &--left { margin-right: $semantic-spacing-2; // 0.5rem } &--right { margin-left: $semantic-spacing-2; // 0.5rem } // Size-specific adjustments .ui-split-button--small & { font-size: $semantic-typography-font-size-xs; &--left { margin-right: $semantic-spacing-1-5; // 0.375rem } &--right { margin-left: $semantic-spacing-1-5; // 0.375rem } } .ui-split-button--medium & { font-size: $semantic-typography-font-size-sm; } .ui-split-button--large & { font-size: $semantic-typography-font-size-md; &--left { margin-right: $semantic-spacing-2-5; // 0.625rem } &--right { margin-left: $semantic-spacing-2-5; // 0.625rem } } } // Dropdown arrow &__arrow { display: inline-flex; align-items: center; font-size: 0.875em; // Slightly larger for better visibility transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1); } // Dropdown menu &__menu { position: absolute; top: 100%; left: 0; min-width: 100%; background: $semantic-color-surface-elevated; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-md; box-shadow: $semantic-shadow-dropdown; z-index: $semantic-z-index-dropdown; opacity: 0; visibility: hidden; transform: translateY(-$semantic-spacing-2); transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); &--open { opacity: 1; visibility: visible; transform: translateY(0); } } // Menu item &__menu-item { display: flex; align-items: center; width: 100%; padding: $semantic-spacing-3 $semantic-spacing-4; border: none; background: transparent; color: $semantic-color-text-primary; font-family: $semantic-typography-font-family-sans; font-size: $semantic-typography-font-size-sm; font-weight: $semantic-typography-font-weight-normal; text-align: left; cursor: pointer; transition: background-color 200ms cubic-bezier(0.4, 0, 0.2, 1); &:hover { background: $semantic-color-surface-container; } &:first-child { border-top-left-radius: $semantic-border-radius-md; border-top-right-radius: $semantic-border-radius-md; } &:last-child { border-bottom-left-radius: $semantic-border-radius-md; border-bottom-right-radius: $semantic-border-radius-md; } } // Filled variant (primary) &--filled { .ui-split-button__primary, .ui-split-button__dropdown { background-color: $semantic-color-interactive-primary; color: $semantic-color-on-primary; &:hover:not(:disabled) { background-color: $semantic-color-primary; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; } &:active:not(:disabled) { transform: scale(0.98); box-shadow: $semantic-shadow-button-active; } &:focus-visible { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } } .ui-split-button__dropdown:hover .ui-split-button__arrow { transform: rotate(180deg); } } // Tonal variant &--tonal { .ui-split-button__primary, .ui-split-button__dropdown { background-color: $semantic-color-surface-container; color: $semantic-color-text-primary; &:hover:not(:disabled) { background-color: $semantic-color-surface-container; transform: translateY(-1px); box-shadow: $semantic-shadow-button-hover; filter: brightness(0.95); } &:active:not(:disabled) { transform: scale(0.98); } &:focus-visible { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } } .ui-split-button__dropdown:hover .ui-split-button__arrow { transform: rotate(180deg); } } // Outlined variant &--outlined { border: $semantic-border-width-1 solid $semantic-color-border-primary; .ui-split-button__primary, .ui-split-button__dropdown { background-color: transparent; color: $semantic-color-interactive-primary; &:hover:not(:disabled) { background-color: $semantic-color-surface-container; transform: translateY(-1px); } &:active:not(:disabled) { background-color: $semantic-color-surface-container; transform: scale(0.98); filter: brightness(0.9); } &:focus-visible { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } } .ui-split-button__dropdown:hover .ui-split-button__arrow { transform: rotate(180deg); } } // Loading state &--loading { .ui-split-button__primary { cursor: wait; .ui-split-button__content { opacity: 0; } } .ui-split-button__dropdown { pointer-events: none; opacity: 0.5; } } // Loader &__loader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } &__spinner { width: $semantic-spacing-4; // 1rem height: $semantic-spacing-4; // 1rem border: 2px solid currentColor; border-top: 2px solid transparent; border-radius: 50%; animation: spin 1s linear infinite; opacity: 0.7; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Ripple effect .ui-split-button__primary::after, .ui-split-button__dropdown::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%); transform: scale(0); opacity: 0; pointer-events: none; transition: transform 0.3s ease, opacity 0.3s ease; } .ui-split-button__primary:active:not(:disabled)::after, .ui-split-button__dropdown:active:not(:disabled)::after { transform: scale(1); opacity: 1; transition: none; } }RX1x[3'fgqFbQjniFߺU,xWo6_dg;βVl]te,&JH9\#%%;-6?Xx_\ȭdLky[݆Ê ]SbaKÕ|g jyBst'4ץ5!*m~0 'Y6$21%\fd?N 8EE,n\G8l>*%`pk&U1%QcBďVhۆʔ S ל,|R/CwVޗz8.?@$}!W)+aNjwanv?̇88Ounf 9P4dO08 V}.|Cg$k+R4C E ɗ/%;b~O$G1L"UUGm?^ Yι2Zؓ&4{,MK{1r6e^IJϰhKڹ 'm+tPq:>/ρ8MBƗR{ċTv:. ~sLoJ 0L &^.Lˈk|欛rMu2Jx;ey}QmmǠ}jEc y>x):!7+I"\5&?=XD6CƝiű{*g41b!A@n$~iGaۏ_?Ffp](.|gˌWkR^t{NH5aշcaW;y$VoArѕςU@%ɲT:uluMQkU~cјT%tg0!XMkjJl (<UcOaT7 |ѵ L3͛xOJ; rm$mwh]Pf5&*?xDx6~vwFԭάswJFGOZn,&v {y8wQeAm&d=%.)*V[gY0I5 \f>h4Y 6Ec/|<  input[type="range"]:3} input[type="checkbox"] { margin-right:} select { )xs% border: 1px solida primary; +sm;#  o0outline: 2px solidQ  outline-offset: 2px;6 (} .demo-interactive-result { padding:xl; 'lg; border: 2px dasheda } .demo-form { padding:lg; 'lg; border: 1px solida  .form-row { 0Olg; &:last-child { margin-bottom: 0; } } .form-output {.l+mdP"'md; border: 1px solida  pre { margin: 0;j9 Q white-space: pre-wrap; word-break: break-word; } } } .event-log { *lg; padding:md; 'md; border: 1px solida < .event-list { max-height: 200px; overflow-y: auto 1md-V!sm; border: 1px solida  .event-itemh3xs; #'$xs 0; border-bottom: 1px solida$3 &:last-child { border-bottom: nonebutton {-md; border: 1px solidasmP" [3_ &:hover&Z ' &:focus { outline: 2px solidQ outline-offset: 2pxLmd - 1) { .demo-container { 2layout-md; } .demo-controls .control-row { | Bstretch; .control-group { min-width: auto; } } } 6demo-container { layout-sm; } .demo-item {* md; } }U^,Ux4,#@ntent-heading; #p zrow { display: flex; =# 4flex-wrap: wrap; align-items: start; } .demo-item90align-items: center; =ntent-line-normal0 0[\( min-width: 100px; p { margin: 0& md; +text-align: center; <}?! flex-wrap: wrap; -+ p2u min-width: 150px mA~G s 02G on@:=k:not(:disabled) { - primary-hover&primary-hover; +2jA &:disabled { opacity: 0.38; cursor: not-allowed;a #" tertiary; +(display: flex; justify-content: center) row {&md; } .demo-controls {Bmda!row { justify-content: center min-width: 80px; } }\k;ZxC#@use "2"9>)md; max-width: 800px; margin: 0 auto;> lg; h3 {. paragraph;  - *lgOalign-items: center; %. 1M} .positions-grid { display: grid; grid-template-columns: repeat(2, 1fr) xl; max-width: 400px; marginmd 0; } .demo-buttonP , /   border: none+md; cursor: pointer; . ,"md; transition: background-color ; &:hover {  P } &:focus-visible { 'focus; } } .demo-text {  0 *Amd; text-decoration: underline; cursor: help; &:hover {   /} } .demo-icon { width: 24px; height: 24px50%;~ . $display: flex; align-items: center0 .% font-weight: bold; cursor: help;  &:hover { (\ '} } p { margin: 0;  0 * md; } // Responsive adjustments/)=md - 1) { .positions-grid { grid-template-columns: 1fr;o. a<-w aalign-items: flex-start;o&_ } })Kxd0F} .demo-column ' > div { display: flex; !!rspan Z}ZH(xv(import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, ContentChildren, QueryList, AfterContentInit, OnDestroy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Subject, takeUntil } from 'rxjs'; export type AccordionSize = 'sm' | 'md' | 'lg'; export type AccordionVariant = 'elevated' | 'outlined' | 'filled'; export interface AccordionItem { id: string; title: string; content?: string; disabled?: boolean; expanded?: boolean; } export interface AccordionExpandEvent { item: AccordionItem; index: number; expanded: boolean; } @Component({ selector: 'ui-accordion-item', standalone: true, imports: [CommonModule], template: `
    @if (expanded || !collapseContent) {
    @if (!hasContent && content) {

    {{ content }}

    }
    }
    ` }) export class AccordionItemComponent { @Input() id!: string; @Input() title!: string; @Input() content?: string; @Input() disabled = false; @Input() expanded = false; @Input() collapseContent = true; // Whether to remove content from DOM when collapsed @Input() hasHeaderContent = false; @Input() hasContent = false; @Output() expandedChange = new EventEmitter(); @Output() itemToggle = new EventEmitter(); get headerId(): string { return `accordion-header-${this.id}`; } get contentId(): string { return `accordion-content-${this.id}`; } handleToggle(): void { if (!this.disabled) { this.expanded = !this.expanded; this.expandedChange.emit(this.expanded); this.itemToggle.emit({ item: { id: this.id, title: this.title, content: this.content, disabled: this.disabled, expanded: this.expanded }, index: 0, // Will be set by parent accordion expanded: this.expanded }); } } handleKeydown(event: KeyboardEvent): void { if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); this.handleToggle(); } } } @Component({ selector: 'ui-accordion', standalone: true, imports: [CommonModule, AccordionItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (items && items.length > 0) { @for (item of items; track item.id; let i = $index) { } } @else { }
    `, styleUrl: './accordion.component.scss' }) export class AccordionComponent implements AfterContentInit, OnDestroy { @Input() size: AccordionSize = 'md'; @Input() variant: AccordionVariant = 'elevated'; @Input() disabled = false; @Input() multiple = false; // Allow multiple items to be expanded simultaneously @Input() collapseContent = true; // Whether to remove content from DOM when collapsed @Input() items: AccordionItem[] = []; // Programmatic items @Input() expandedItems: string[] = []; // IDs of initially expanded items @Output() itemToggle = new EventEmitter(); @Output() expandedItemsChange = new EventEmitter(); @ContentChildren(AccordionItemComponent) accordionItems!: QueryList; private destroy$ = new Subject(); getComponentClasses(): string { const classes = [ 'ui-accordion', `ui-accordion--${this.size}`, `ui-accordion--${this.variant}` ]; if (this.disabled) { classes.push('ui-accordion--disabled'); } if (this.multiple) { classes.push('ui-accordion--multiple'); } return classes.join(' '); } ngAfterContentInit(): void { // Set up keyboard navigation between accordion items this.setupKeyboardNavigation(); // Initialize expanded states this.initializeExpandedStates(); } ngOnDestroy(): void { this.destroy$.next(); this.destroy$.complete(); } private setupKeyboardNavigation(): void { this.accordionItems.changes .pipe(takeUntil(this.destroy$)) .subscribe(() => { this.accordionItems.forEach((item, index) => { // Update index for event emission const originalToggle = item.handleToggle.bind(item); item.handleToggle = () => { originalToggle(); // Emit with correct index const event = { item: { id: item.id, title: item.title, content: item.content, disabled: item.disabled, expanded: item.expanded }, index, expanded: item.expanded }; this.handleItemToggle(event, index); }; }); }); } private initializeExpandedStates(): void { if (this.items.length > 0) { // Initialize programmatic items this.items.forEach(item => { if (this.expandedItems.includes(item.id)) { item.expanded = true; } }); } } handleItemToggle(event: AccordionExpandEvent, index: number): void { event.index = index; if (!this.multiple && event.expanded) { // Close other items if not in multiple mode this.closeOtherItems(event.item.id); } // Update expanded items list this.updateExpandedItems(event.item.id, event.expanded); // Emit events this.itemToggle.emit(event); this.expandedItemsChange.emit([...this.expandedItems]); } private closeOtherItems(exceptId: string): void { if (this.items.length > 0) { // Close other programmatic items this.items.forEach(item => { if (item.id !== exceptId && item.expanded) { item.expanded = false; } }); } // Close other content-projected items this.accordionItems.forEach(item => { if (item.id !== exceptId && item.expanded) { item.expanded = false; item.expandedChange.emit(false); } }); } private updateExpandedItems(itemId: string, expanded: boolean): void { if (expanded) { if (!this.expandedItems.includes(itemId)) { this.expandedItems.push(itemId); } } else { const index = this.expandedItems.indexOf(itemId); if (index > -1) { this.expandedItems.splice(index, 1); } } } // Public methods for programmatic control expandItem(itemId: string): void { const item = this.items.find(i => i.id === itemId); const accordionItem = this.accordionItems.find(i => i.id === itemId); if (item && !item.disabled) { if (!this.multiple) { this.closeAllItems(); } item.expanded = true; this.updateExpandedItems(itemId, true); } if (accordionItem && !accordionItem.disabled) { if (!this.multiple) { this.closeAllItems(); } accordionItem.expanded = true; accordionItem.expandedChange.emit(true); this.updateExpandedItems(itemId, true); } } collapseItem(itemId: string): void { const item = this.items.find(i => i.id === itemId); const accordionItem = this.accordionItems.find(i => i.id === itemId); if (item) { item.expanded = false; this.updateExpandedItems(itemId, false); } if (accordionItem) { accordionItem.expanded = false; accordionItem.expandedChange.emit(false); this.updateExpandedItems(itemId, false); } } expandAll(): void { if (this.multiple) { this.items.forEach(item => { if (!item.disabled) { item.expanded = true; this.updateExpandedItems(item.id, true); } }); this.accordionItems.forEach(item => { if (!item.disabled) { item.expanded = true; item.expandedChange.emit(true); this.updateExpandedItems(item.id, true); } }); } } collapseAll(): void { this.items.forEach(item => { item.expanded = false; this.updateExpandedItems(item.id, false); }); this.accordionItems.forEach(item => { item.expanded = false; item.expandedChange.emit(false); this.updateExpandedItems(item.id, false); }); } private closeAllItems(): void { this.items.forEach(item => { item.expanded = false; }); this.accordionItems.forEach(item => { item.expanded = false; item.expandedChange.emit(false); }); this.expandedItems = []; } }#fxClºřUJ l Ģļ M,NLIMJ9Q]Ҝ̂To>IO, xK(/*QVpLN/Js-K+AyjҊsa a\3K* R άJE23,(3$kEAb^kVH[x52p|%-)A1S ⱡx@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .skyui-avatar { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background-color: $semantic-color-surface-secondary; color: $semantic-color-text-secondary; box-sizing: border-box; flex-shrink: 0; user-select: none; cursor: pointer; // Size variants based on semantic sizing tokens &--size-xs { width: 24px; height: 24px; .skyui-avatar__initials { font-size: calc(24px * 0.4); font-weight: 500; } .skyui-avatar__icon { font-size: calc(24px * 0.6); } } &--size-sm { width: 32px; height: 32px; .skyui-avatar__initials { font-size: calc(32px * 0.4); font-weight: 500; } .skyui-avatar__icon { font-size: calc(32px * 0.6); } } &--size-md { width: 40px; height: 40px; .skyui-avatar__initials { font-size: calc(40px * 0.4); font-weight: 500; } .skyui-avatar__icon { font-size: calc(40px * 0.6); } } &--size-lg { width: 48px; height: 48px; .skyui-avatar__initials { font-size: calc(48px * 0.4); font-weight: 600; } .skyui-avatar__icon { font-size: calc(48px * 0.6); } } &--size-xl { width: 64px; height: 64px; .skyui-avatar__initials { font-size: calc(64px * 0.35); font-weight: 600; } .skyui-avatar__icon { font-size: calc(64px * 0.5); } } &--size-xxl { width: 80px; height: 80px; .skyui-avatar__initials { font-size: calc(80px * 0.35); font-weight: 600; } .skyui-avatar__icon { font-size: calc(80px * 0.5); } } // Loading state &--loading { background-color: $semantic-color-surface-disabled; .skyui-avatar__loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; } .loading-spinner { width: 50%; height: 50%; border: 2px solid $semantic-color-border-subtle; border-top: 2px solid $semantic-color-brand-primary; border-radius: 50%; animation: spin 1s linear infinite; } } // Avatar image &__image { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; overflow: hidden; } // Fallback container &__fallback { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: $semantic-color-container-primary; color: $semantic-color-on-container-primary; border-radius: 50%; overflow: hidden; } // Initials text &__initials { line-height: 1; text-align: center; letter-spacing: -0.02em; } // Icon &__icon { display: flex; align-items: center; justify-content: center; } // Status indicator &__status { position: absolute; bottom: 0; right: 0; width: 25%; height: 25%; min-width: 8px; min-height: 8px; border-radius: 50%; border: 2px solid $semantic-color-surface-primary; box-sizing: border-box; &--online { background-color: $semantic-color-success; } &--offline { background-color: $semantic-color-text-tertiary; } &--away { background-color: $semantic-color-warning; } &--busy { background-color: $semantic-color-danger; } } // Badge indicator positioning &__badge { position: absolute; top: -4px; right: -4px; } } // Animation for loading spinner @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Focus and hover states for interactive avatars .skyui-avatar { &[role="button"]:focus-visible, &[tabindex]:focus-visible { outline: 2px solid $semantic-color-brand-primary; outline-offset: 2px; } &[role="button"]:hover, &[tabindex]:hover { transform: scale(1.05); transition: transform $semantic-duration-fast $semantic-easing-standard; } } // High contrast mode support @media (prefers-contrast: high) { .skyui-avatar { border: $semantic-border-width-1 solid $semantic-color-border-primary; &__status { border-width: $semantic-border-width-3; } } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .skyui-avatar { &[role="button"]:hover, &[tabindex]:hover { transition: none; } .loading-spinner { animation: none; } } }rxҥ2A8#(5E4sKAJ:jx Himport { Component, Input, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faUser } from '@fortawesome/free-solid-svg-icons'; import { BadgeComponent } from '../badge/badge.component'; export type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl'; @Component({ selector: 'ui-avatar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, FontAwesomeModule, BadgeComponent], template: `
    @if (loading) {
    } @else { @if (imageUrl && !imageError) { } @else {
    @if (computedInitials) { } @else { }
    } } @if (status) {
    } @if (badge !== undefined && badge !== null) { {{ badge }} }
    `, styleUrl: './avatar.component.scss' }) export class AvatarComponent { @Input() imageUrl?: string; @Input() name?: string; @Input() initials?: string; @Input() size: AvatarSize = 'md'; @Input() altText?: string; @Input() ariaLabel?: string; @Input() loading: boolean = false; @Input() status?: 'online' | 'offline' | 'away' | 'busy'; @Input() statusLabel?: string; @Input() badge?: string | number; @Input() badgeLabel?: string; faUser = faUser; imageError = false; onImageError(): void { this.imageError = true; } onImageLoad(): void { this.imageError = false; } // Auto-generate initials from name if not provided get computedInitials(): string { if (this.initials) { return this.initials.slice(0, 2).toUpperCase(); } if (this.name) { const nameParts = this.name.trim().split(/\s+/); if (nameParts.length >= 2) { return (nameParts[0][0] + nameParts[nameParts.length - 1][0]).toUpperCase(); } else if (nameParts[0]) { return nameParts[0].slice(0, 2).toUpperCase(); } } return ''; } }Лx#export * from './avatar.component'; G-xkBw*0|ّ0RѸx@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; /** * ========================================================================== * BADGE COMPONENT STYLES * ========================================================================== * Material Design 3 inspired badge component with design token integration. * Supports multiple variants, sizes, shapes, and dot mode for notifications. * ========================================================================== */ // Tokens available globally via main application styles .ui-badge { display: inline-flex; align-items: center; justify-content: center; font-weight: $semantic-typography-font-weight-medium; line-height: 1; text-align: center; white-space: nowrap; vertical-align: middle; user-select: none; box-sizing: border-box; transition: all $semantic-duration-short $semantic-easing-standard; background-color: aqua; // Default size (md) min-width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; padding: 0 $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; border-radius: $semantic-border-radius-full; // Default variant styling background-color: $semantic-color-surface-secondary; color: $semantic-color-text-primary; border: $semantic-border-width-1 solid $semantic-color-border-subtle; // Size variants &[data-size="xs"] { min-width: $semantic-typography-icon-small-size; height: $semantic-typography-icon-small-size; padding: 0 calc($semantic-spacing-component-xs / 2); font-size: $semantic-typography-font-size-xs; } &[data-size="sm"] { min-width: $semantic-sizing-icon-button; height: $semantic-sizing-icon-button; padding: 0 $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; } &[data-size="md"] { min-width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; padding: 0 $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; } &[data-size="lg"] { min-width: $semantic-sizing-icon-header; height: $semantic-sizing-icon-header; padding: 0 $semantic-spacing-component-sm; font-size: $semantic-typography-font-size-sm; } // Shape variants &[data-shape="pill"] { border-radius: $semantic-border-radius-full; } &[data-shape="rounded"] { border-radius: $semantic-border-radius-md; } &[data-shape="square"] { border-radius: $semantic-border-radius-sm; } // Dot mode - small notification dot &[data-dot="true"] { min-width: 0; width: 8px; height: 8px; padding: 0; border-radius: 50%; border: 2px solid $semantic-color-surface-primary; &[data-size="xs"] { width: 6px; height: 6px; } &[data-size="sm"] { width: 8px; height: 8px; } &[data-size="md"] { width: 10px; height: 10px; } &[data-size="lg"] { width: 12px; height: 12px; } } // Color variants &[data-variant="default"] { background-color: $semantic-color-surface-secondary; color: $semantic-color-text-primary; border-color: $semantic-color-border-subtle; } &[data-variant="primary"] { background-color: $semantic-color-brand-primary; color: $semantic-color-text-inverse; border-color: $semantic-color-brand-primary; } &[data-variant="secondary"] { background-color: $semantic-color-brand-secondary; color: $semantic-color-text-inverse; border-color: $semantic-color-brand-secondary; } &[data-variant="success"] { background-color: $semantic-color-success; color: $semantic-color-text-inverse; border-color: $semantic-color-success; } &[data-variant="warning"] { background-color: $semantic-color-warning; color: $semantic-color-text-inverse; border-color: $semantic-color-warning; } &[data-variant="danger"] { background-color: $semantic-color-danger; color: $semantic-color-text-inverse; border-color: $semantic-color-danger; } &[data-variant="info"] { background-color: $semantic-color-info; color: $semantic-color-text-inverse; border-color: $semantic-color-info; } // Hover states for interactive badges &:hover { transform: translateY(-1px); box-shadow: $semantic-shadow-elevation-1; } // Focus states for accessibility &:focus { outline: 2px solid $semantic-color-focus-ring; outline-offset: 2px; } // Responsive adjustments @media (max-width: calc($semantic-breakpoint-sm - 1px)) { &[data-size="lg"] { min-width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; padding: 0 $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; } } }@l(Ntx{z_ugqFbQjniF}BVCx:import { Component, Input, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; export type BadgeVariant = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info'; export type BadgeSize = 'xs' | 'sm' | 'md' | 'lg'; export type BadgeShape = 'pill' | 'rounded' | 'square'; @Component({ selector: 'ui-badge', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: ` @if (!isDot) { } `, styleUrls: ['./badge.component.scss'] }) export class BadgeComponent { @Input() variant: BadgeVariant = 'default'; @Input() size: BadgeSize = 'md'; @Input() shape: BadgeShape = 'pill'; @Input() isDot: boolean = false; @Input() ariaLabel?: string; @Input() title?: string; }Z<x"export * from './badge.component'; Wx ̟®QRO8BE; xk`l` -ҟb{XNX>oU b]?x$F@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles .ui-card { position: relative; width: 100%; box-sizing: border-box; margin-right: $semantic-spacing-grid-gap-xs; margin-bottom: $semantic-spacing-grid-gap-xs; overflow: hidden; display: flex; flex-direction: column; // Base styles font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; transition: all $semantic-duration-fast $semantic-easing-standard; // Size variants - following 8px grid increments &--sm { min-height: $semantic-sizing-card-height-sm; .card-content-layer { padding: $semantic-spacing-component-padding-sm; } .card-header { padding-bottom: $semantic-spacing-component-sm; } .card-footer { padding-top: $semantic-spacing-component-sm; } } &--md { min-height: $semantic-sizing-card-height-md; .card-content-layer { padding: $semantic-spacing-component-padding-lg; } .card-header { padding-bottom: $semantic-spacing-component-md; } .card-footer { padding-top: $semantic-spacing-component-md; } } &--lg { min-height: $semantic-sizing-card-height-lg; .card-content-layer { padding: $semantic-spacing-component-padding-xl; } .card-header { padding-bottom: $semantic-spacing-component-lg; } .card-footer { padding-top: $semantic-spacing-component-lg; } } // Elevation variants - Material Design shadow levels &--elevation-none { box-shadow: none; } &--elevation-sm { box-shadow: $semantic-shadow-elevation-1; } &--elevation-md { box-shadow: $semantic-shadow-elevation-2; } &--elevation-lg { box-shadow: $semantic-shadow-elevation-3; } &--elevation-xl { box-shadow: $semantic-shadow-elevation-4; } // Radius variants - consistent scale &--radius-none { border-radius: 0; } &--radius-sm { border-radius: $semantic-border-radius-sm; } &--radius-md { border-radius: $semantic-border-radius-md; } &--radius-lg { border-radius: $semantic-border-radius-lg; } &--radius-full { border-radius: $semantic-border-radius-full; aspect-ratio: 1; } // Variant styles - Material Design 3 inspired colors &--elevated { background-color: $semantic-color-surface-primary; color: $semantic-color-text-primary; border: none; &:hover:not(.ui-card--disabled) { transform: translateY(-2px); box-shadow: $semantic-shadow-card-hover; } } &--filled { background-color: $semantic-color-surface-secondary; color: $semantic-color-text-primary; border: $semantic-border-width-1 solid $semantic-color-border-primary; &:hover:not(.ui-card--disabled) { background-color: $semantic-color-surface-elevated; } } &--outlined { background-color: transparent; color: $semantic-color-text-primary; border: $semantic-border-width-1 solid $semantic-color-border-secondary; &:hover:not(.ui-card--disabled) { border-color: $semantic-color-border-focus; background-color: $semantic-color-surface-elevated; } } // Clickable state &--clickable { cursor: pointer; user-select: none; &:active:not(.ui-card--disabled) { transform: scale(0.98); // Subtle press effect } &:focus-visible { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } } // Disabled state &--disabled { opacity: 0.38; // Material Design disabled opacity cursor: not-allowed; pointer-events: none; } // Glass effect using CSS variables and semantic approach &--glass { position: relative; isolation: isolate; backdrop-filter: blur(var(--glass-blur-md, 8px)); -webkit-backdrop-filter: blur(var(--glass-blur-md, 8px)); border: 1px solid var(--glass-border-color, rgba(255, 255, 255, 0.2)); transition: all $semantic-duration-short $semantic-easing-standard; .card-content-layer { position: relative; z-index: 2; } // Glass variant styles using CSS variables - fixed syntax &.ui-card--glass-translucent { background: rgba(var(--glass-background-base, 255, 255, 255), var(--glass-opacity-translucent, 0.1)); backdrop-filter: blur(var(--glass-blur-sm, 4px)); -webkit-backdrop-filter: blur(var(--glass-blur-sm, 4px)); } &.ui-card--glass-light { background: rgba(var(--glass-background-base, 255, 255, 255), var(--glass-opacity-light, 0.3)); backdrop-filter: blur(var(--glass-blur-md, 8px)); -webkit-backdrop-filter: blur(var(--glass-blur-md, 8px)); } &.ui-card--glass-medium { background: rgba(var(--glass-background-base, 255, 255, 255), var(--glass-opacity-medium, 0.5)); backdrop-filter: blur(var(--glass-blur-md, 8px)); -webkit-backdrop-filter: blur(var(--glass-blur-md, 8px)); } &.ui-card--glass-heavy { background: rgba(var(--glass-background-base, 255, 255, 255), var(--glass-opacity-heavy, 0.7)); backdrop-filter: blur(var(--glass-blur-lg, 16px)); -webkit-backdrop-filter: blur(var(--glass-blur-lg, 16px)); } &.ui-card--glass-frosted { background: rgba(var(--glass-background-base, 255, 255, 255), var(--glass-opacity-frosted, 0.85)); backdrop-filter: blur(var(--glass-blur-xl, 24px)); -webkit-backdrop-filter: blur(var(--glass-blur-xl, 24px)); } // Interactive glass states &.ui-card--clickable:hover:not(.ui-card--disabled) { transform: translateY(-2px); box-shadow: $semantic-shadow-elevation-3; } &.ui-card--clickable:active:not(.ui-card--disabled) { transform: scale(0.98); } // Disabled state for glass cards &.ui-card--disabled { backdrop-filter: blur(var(--glass-blur-xs, 2px)); -webkit-backdrop-filter: blur(var(--glass-blur-xs, 2px)); opacity: 0.6; } } // With background layer &--with-background { .card-background-layer { position: absolute; top: 0; left: 0; right: 0; bottom: 0; box-sizing: border-box; transform: translateZ(0); z-index: 0; } .card-content-layer { position: relative; z-index: 1; background: $semantic-color-surface-primary; color: $semantic-color-text-primary; } } } // Card content structure .card-content-layer { display: flex; flex-direction: column; height: 100%; flex: 1; color: inherit; } .card-header { border-bottom: $semantic-border-width-1 solid $semantic-color-border-secondary; h1, h2, h3, h4, h5, h6 { margin: 0; color: $semantic-color-text-primary; } p { margin: 0; color: $semantic-color-text-secondary; } } .card-body { flex: 1; color: inherit; // Typography reset > *:first-child { margin-top: 0; } > *:last-child { margin-bottom: 0; } p { color: $semantic-color-text-primary; } } .card-footer { border-top: $semantic-border-width-1 solid $semantic-color-border-secondary; display: flex; justify-content: flex-end; align-items: center; gap: $semantic-spacing-component-sm; } // Glass overlay for enhanced glass effect .card-glass-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(145deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 50%, rgba(255, 255, 255, 0.1) 100%); pointer-events: none; z-index: 1; border-radius: inherit; } // Ripple effect for clickable cards .card-ripple-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow: hidden; pointer-events: none; z-index: 3; &::after { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: rgba(120, 53, 255, 0.2); // Brand color ripple transform: translate(-50%, -50%) scale(0); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .ui-card--clickable:active & { &::after { transform: translate(-50%, -50%) scale(2); opacity: 1; transition: none; } } } // Hover effects based on elevation .ui-card:hover:not(.ui-card--disabled) { &.ui-card--elevation-sm { box-shadow: $semantic-shadow-elevation-2; } &.ui-card--elevation-md { box-shadow: $semantic-shadow-elevation-3; } &.ui-card--elevation-lg { box-shadow: $semantic-shadow-elevation-4; } } // Dark mode support - Remove problematic dark mode overrides // Semantic tokens should handle dark mode automatically // Responsive adaptations @media (max-width: ($semantic-breakpoint-md - 1)) { .ui-card { margin-right: 0; &--lg { .card-content-layer { padding: $semantic-spacing-component-padding-lg; } } .card-footer { flex-direction: column; gap: $semantic-spacing-component-md; } } } // Accessibility @media (prefers-reduced-motion: reduce) { .ui-card { transition: none; &:hover, &:active { transform: none; } } .card-ripple-overlay::after { transition: none; } }@hGxsgqFbQjniF*Tx import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; export type CardVariant = 'elevated' | 'filled' | 'outlined'; export type CardSize = 'sm' | 'md' | 'lg'; export type CardElevation = 'none' | 'sm' | 'md' | 'lg' | 'xl'; export type CardRadius = 'none' | 'sm' | 'md' | 'lg' | 'full'; export type GlassVariant = 'translucent' | 'light' | 'medium' | 'heavy' | 'frosted'; @Component({ selector: 'ui-card', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
    @if (hasBackgroundLayer) {
    }
    @if (hasHeader) {
    }
    @if (hasFooter) {
    }
    @if (glass) {
    } @if (clickable && !disabled) {
    }
    `, styleUrl: './card.component.scss' }) export class CardComponent { @Input() variant: CardVariant = 'elevated'; @Input() size: CardSize = 'md'; @Input() elevation: CardElevation = 'sm'; @Input() radius: CardRadius = 'md'; @Input() disabled: boolean = false; @Input() clickable: boolean = false; @Input() glass: boolean = false; @Input() glassVariant: GlassVariant = 'medium'; @Input() backgroundImage?: string; @Input() hasBackgroundLayer: boolean = false; @Input() hasHeader: boolean = false; @Input() hasFooter: boolean = false; @Input() class: string = ''; @Output() cardClick = new EventEmitter(); get cardClasses(): string { return [ 'ui-card', `ui-card--${this.variant}`, `ui-card--${this.size}`, `ui-card--elevation-${this.elevation}`, `ui-card--radius-${this.radius}`, this.disabled ? 'ui-card--disabled' : '', this.clickable ? 'ui-card--clickable' : '', this.glass ? 'ui-card--glass' : '', this.glass ? `ui-card--glass-${this.glassVariant}` : '', this.hasBackgroundLayer ? 'ui-card--with-background' : '', this.class ].filter(Boolean).join(' '); } handleClick(event: Event): void { if (this.clickable && !this.disabled) { this.cardClick.emit(event); } } }Op|x!export * from './card.component'; bx !@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; @mixin font-properties($font-map) { @if type-of($font-map) == 'map' { font-family: map-get($font-map, 'font-family'); font-size: map-get($font-map, 'font-size'); line-height: map-get($font-map, 'line-height'); font-weight: map-get($font-map, 'font-weight'); letter-spacing: map-get($font-map, 'letter-spacing'); } @else { font: $font-map; } } .ui-video-player { position: relative; width: 100%; background: $semantic-color-surface; border-radius: 12px; overflow: hidden; box-shadow: $semantic-shadow-elevation-2; // Default size (medium) max-width: 800px; &--fullscreen { max-width: none !important; width: 100vw !important; height: 100vh !important; border-radius: 0; position: fixed; top: 0; left: 0; z-index: 9999; } &--disabled { opacity: 0.6; pointer-events: none; } &--loading { .ui-video-player__video { cursor: wait; } } // Size variants - placed after default to override &--sm { max-width: 400px; } &--md { max-width: 800px; } &--lg { max-width: 1200px; } // Variant styles &--minimal { border-radius: 0; box-shadow: none; background: transparent; } &--theater { width: 100%; background: #000; .ui-video-player__video-container { padding-bottom: 42.85%; // 21:9 aspect ratio for theater mode } // Only remove max-width if no size variant is applied &:not(.ui-video-player--sm):not(.ui-video-player--md):not(.ui-video-player--lg) { max-width: none; } } &__video-container { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; // 16:9 aspect ratio background: #000; } &__video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; cursor: pointer; } &__loading-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: $semantic-spacing-component-md; z-index: 2; } &__loading-spinner { width: 40px; height: 40px; border: 3px solid rgba(255, 255, 255, 0.3); border-top: 3px solid $semantic-color-primary; border-radius: 50%; animation: spin 1s linear infinite; } &__loading-text { color: white; @include font-properties($semantic-typography-body-medium); } &__controls { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0, 0, 0, 0.8)); padding: $semantic-spacing-component-lg $semantic-spacing-component-md $semantic-spacing-component-md; opacity: 0; transition: opacity $semantic-duration-medium $semantic-easing-standard; z-index: 3; display: flex; align-items: center; gap: $semantic-spacing-component-sm; &--visible { opacity: 1; } } &__control { background: none; border: none; color: white; cursor: pointer; padding: $semantic-spacing-component-xs; border-radius: 4px; transition: background-color $semantic-duration-fast $semantic-easing-standard; display: flex; align-items: center; justify-content: center; &:hover:not(:disabled) { background: rgba(255, 255, 255, 0.2); } &:focus { outline: 2px solid $semantic-color-primary; outline-offset: 2px; } &:disabled { opacity: 0.5; cursor: not-allowed; } } &__control-icon { width: 20px; height: 20px; } &__progress-container { flex: 1; display: flex; align-items: center; position: relative; margin: 0 $semantic-spacing-component-sm; } &__progress-bar { width: 100%; height: 4px; background: transparent; border: none; cursor: pointer; outline: none; -webkit-appearance: none; appearance: none; &::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%; background: $semantic-color-primary; cursor: pointer; border: 2px solid white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } &::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: $semantic-color-primary; cursor: pointer; border: 2px solid white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } } &__progress-track { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 4px; background: rgba(255, 255, 255, 0.3); border-radius: 2px; pointer-events: none; } &__progress-filled { height: 100%; background: $semantic-color-primary; border-radius: 2px; transition: width 0.1s linear; } &__time { color: white; @include font-properties($semantic-typography-body-small); white-space: nowrap; margin: 0 $semantic-spacing-component-xs; } &__volume-bar { width: 80px; height: 4px; background: transparent; border: none; cursor: pointer; outline: none; -webkit-appearance: none; appearance: none; margin-left: $semantic-spacing-component-xs; &::-webkit-slider-track { width: 100%; height: 4px; background: rgba(255, 255, 255, 0.3); border-radius: 2px; } &::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%; background: $semantic-color-primary; cursor: pointer; border: 2px solid white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } &::-moz-range-track { width: 100%; height: 4px; background: rgba(255, 255, 255, 0.3); border-radius: 2px; } &::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: $semantic-color-primary; cursor: pointer; border: 2px solid white; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } } &__fallback { color: white; @include font-properties($semantic-typography-body-medium); text-align: center; padding: $semantic-spacing-component-lg; a { color: $semantic-color-primary; text-decoration: none; &:hover { text-decoration: underline; } } } &__error { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: $semantic-spacing-component-md; z-index: 4; padding: $semantic-spacing-component-lg; } &__error-icon { width: 48px; height: 48px; color: $semantic-color-error; svg { width: 100%; height: 100%; } } &__error-message { color: white; @include font-properties($semantic-typography-body-large); text-align: center; margin: 0; } &__error-link { color: $semantic-color-primary; @include font-properties($semantic-typography-body-medium); text-decoration: none; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; border: 1px solid $semantic-color-primary; border-radius: 4px; transition: all $semantic-duration-fast $semantic-easing-standard; &:hover { background: $semantic-color-primary; color: white; } } // Show controls on hover or when paused &:hover &__controls, &__controls--visible { opacity: 1; } // Responsive design @media (max-width: 768px) { // On mobile, make size variants responsive but maintain relative sizing &--sm { max-width: 320px; } &--md { max-width: 600px; } &--lg { max-width: 100%; } &__controls { padding: $semantic-spacing-component-md $semantic-spacing-component-sm; gap: $semantic-spacing-component-xs; } &__control-icon { width: 18px; height: 18px; } &__volume-bar { width: 60px; } &__time { @include font-properties($semantic-typography-body-small); } } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }jWx]B?carousel*overflow: hiddensurface-container; &__A@400px; // Default height overflow: hidden; } &__track {1W#transition: transformH 8"} &__slide { flex: 0 0 100%Q),~#opacity: 1; transform: scale(1)/ M, transformH 6 &--activ  transform: scale(1); } .ui-carousel__image-container, .ui-carousel__card, .ui-carousel__content-slide { R3imageBp  .ui-carousel__imageK.@ object-fit: cover; } .ui-carousel__image-overlay { * bottom: 0; left: 0; right: 0 -7));a,9lg; color: white; .ui-carousel__title { 2"heading-h3); margin-bottom "&} .ui-carousel__subtitle { B3 opacity: 0.9; } } } &__card {  surface-containerp 8px; overflow: hidden; K/ .ui-carousel__card-imageK$C60%; object-fit: cover; } .ui-carousel__card-content_.lg; height: 40%; 1|! .ui-carousel__title { 2"heading-h4); margin-bottom "&} .ui-carousel__subtitle { B !%text-secondary; margin-bottom "%} .ui-carousel__content { 7 !7text-secondary; } } } &__content-slide {o *lg; text-align: center text-primaryI~ .ui-carousel__titl^ 8 heading-h3); margin-bottom  } .ui-carousel__subtitl^ = #text-secondary; margin-bottom  } .ui-carousel__content_ < #text-secondary; } } &__nav$I* z-index: 2(9)|v #,~M'34 motion *}! white; N scale(1.1 P#} &--prev { left  } &--next { right  } .ui-carousel__nav20px; height: 20px;'text-primary; } } &__indicator. (  leftGX(-50%)!:xs; z-index: 2; &--dots .ui-carousel__indicator {AF:} &--bars .ui-carousel__indicator { width: 24pxMP--thumbnails .ui-carousel__indicator { width: 48px; height: 32px; / overflow: hidden; } } &__indicator {}"5); :#\ " &--active {atransform: scale(1.2); }|"08 pT.ui-carousel__indicator-dot, .ui-carousel__indicator-bar { display: block;M,F border-radius: inherit; } .ui-carousel__indicator-thumbnailK. object-fit: cover &--sm { .ui-carousel__container { height: 250px; } } &--md { .ui-carousel__container { height: 400px; } } &--lg { .ui-carousel__container { height: 600px; } } // Transition effects &--fade { _ .ui-carousel__track { // For fade transition, we need to position slides absolutely #} .ui-carousel__slide { + top: 0; left: 0; right: 0; ! 3 O flex: none; // Override the flex property &--active { opacity: 1; z-index: 1; } } } * &--scale { .ui-carousel__track { #} .ui-carousel__slide {  top: 0; left: 0; right: 0; transform: scale(0.8); opacity: 0.3; transition: transform $semanticR *, @ B flex: none; // Override the flex property &--active { transform: scale(1); opacity: 1; z-index: 1; } } } &--slide { // Default slide behavior - already handled by track transform .ui-carousel_$_track { transition: transformH :} } // Disabled statepDH7&__container { height: 300px; } &--sm .ui-carousel__container { height: 200px; } &--lg .ui-carousel__container { height: 400px; } &__nav { width: 40px; height: 40px; .ui-carousel__nav-icon { width: 16px; height: 16px; } } &__card .ui-carousel__card-content, &__content-slide { g( } } }ƓuKxvjq YX[QM xWOVW( @p B DhnZ:i7/īc U,.SIiǮvmҤzzXOٱlJ$~O/~ VD]kXC˰ڗy]Q@+#x6W4b$|.MqTDUT~Pma1bSc+L5d"kjUMC)9׹e(c HAXg±~':2Q觓ۈNjv)oR9U{}7&1\8oN^%~lR_ 2)v` M!El10;:EQS7lz4~\Ĭ-׭Dq,M0M5uNꢾ/e_k5S(\~ dYnD:]2Oc/m9m 1/)J-wb:,uD [/ "7~f(rE$nPf.fσGgXׅ3DgϙAx"i8`;p=~tYO9;8džv]LRk˪(+Fo~<94[w ar9ԿNk~fHh5QNgkv՝]RPmlj<8 PYV"NU4>.5ˤלt@͆9w兙v1`mK̆cNF|]zKakGQyon~ VÆeYUtZl\)vh0qw̠CT%D4lH,$XiYGhb2 R.snsZ| 1ݽY?UMlW7fPCX'-I}U4q @if (showNavigation && items.length > 1) { }
    @for (item of items; track item.id; let i = $index) {
    @switch (variant) { @case ('image') { @if (item.imageUrl) {
    @if (item.title || item.subtitle) {
    @if (item.title) {

    {{ item.title }}

    } @if (item.subtitle) {

    {{ item.subtitle }}

    }
    }
    } } @case ('card') {
    @if (item.imageUrl) { }
    @if (item.title) {

    {{ item.title }}

    } @if (item.subtitle) {

    {{ item.subtitle }}

    } @if (item.content) {

    {{ item.content }}

    }
    } @case ('content') {
    @if (item.title) {

    {{ item.title }}

    } @if (item.subtitle) {

    {{ item.subtitle }}

    } @if (item.content) {
    }
    } }
    }
    @if (showIndicators && indicatorStyle !== 'none' && items.length > 1) {
    @for (item of items; track item.id; let i = $index) { }
    } `, styleUrl: './carousel.component.scss' }) export class CarouselComponent { @Input() items: CarouselItem[] = []; @Input() size: CarouselSize = 'md'; @Input() variant: CarouselVariant = 'image'; @Input() transition: CarouselTransition = 'slide'; @Input() indicatorStyle: CarouselIndicatorStyle = 'dots'; @Input() disabled = false; @Input() autoplay = false; @Input() autoplayInterval = 3000; @Input() loop = true; @Input() showNavigation = true; @Input() showIndicators = true; @Input() ariaLabel = 'Image carousel'; @Input() initialIndex = 0; @Output() slideChange = new EventEmitter(); @Output() itemClick = new EventEmitter<{item: CarouselItem, index: number}>(); private _currentIndex = signal(this.initialIndex); private _autoplayTimer?: number; currentIndex = this._currentIndex.asReadonly(); getComponentClasses(): string { const classes = [ 'ui-carousel', `ui-carousel--${this.size}`, `ui-carousel--${this.variant}`, `ui-carousel--${this.transition}` ]; if (this.disabled) { classes.push('ui-carousel--disabled'); } if (this.autoplay) { classes.push('ui-carousel--autoplay'); } return classes.join(' '); } getIndicatorClasses(): string { const classes = ['ui-carousel__indicators']; if (this.indicatorStyle) { classes.push(`ui-carousel__indicators--${this.indicatorStyle}`); } return classes.join(' '); } ngOnInit(): void { this._currentIndex.set(this.initialIndex); if (this.autoplay && !this.disabled) { this.startAutoplay(); } } ngOnDestroy(): void { this.stopAutoplay(); } goToSlide(index: number): void { if (this.disabled || index < 0 || index >= this.items.length) { return; } this._currentIndex.set(index); this.slideChange.emit(index); this.resetAutoplay(); } goToNext(): void { const nextIndex = this.loop && this.currentIndex() === this.items.length - 1 ? 0 : Math.min(this.currentIndex() + 1, this.items.length - 1); this.goToSlide(nextIndex); } goToPrevious(): void { const prevIndex = this.loop && this.currentIndex() === 0 ? this.items.length - 1 : Math.max(this.currentIndex() - 1, 0); this.goToSlide(prevIndex); } private startAutoplay(): void { this.stopAutoplay(); this._autoplayTimer = window.setInterval(() => { this.goToNext(); }, this.autoplayInterval); } private stopAutoplay(): void { if (this._autoplayTimer) { clearInterval(this._autoplayTimer); this._autoplayTimer = undefined; } } private resetAutoplay(): void { if (this.autoplay && !this.disabled) { this.stopAutoplay(); this.startAutoplay(); } } }BD kxqu=䳢<ºřUJ 䃢 Ģļ ɖ%gd 5L Y @if (leadingIcon) {
    } @if (avatar) {
    }
    {{ label }}
    @if (removable && closeIcon) {
    } @if (trailingIcon && !removable) {
    } `, styleUrl: './chip.component.scss' }) export class ChipComponent { @Input() label: string = ''; @Input() variant: ChipVariant = 'filled'; @Input() size: ChipSize = 'md'; @Input() radius: ChipRadius = 'md'; @Input() disabled: boolean = false; @Input() selected: boolean = false; @Input() clickable: boolean = false; @Input() removable: boolean = false; @Input() leadingIcon?: IconDefinition; @Input() trailingIcon?: IconDefinition; @Input() closeIcon?: IconDefinition; @Input() avatar?: string; @Input() avatarAlt?: string; @Input() class: string = ''; @Output() chipClick = new EventEmitter(); @Output() chipRemove = new EventEmitter(); get chipClasses(): string { return [ 'ui-chip', `ui-chip--${this.variant}`, `ui-chip--${this.size}`, `ui-chip--radius-${this.radius}`, this.disabled ? 'ui-chip--disabled' : '', this.selected ? 'ui-chip--selected' : '', this.clickable ? 'ui-chip--clickable' : '', this.removable ? 'ui-chip--removable' : '', this.leadingIcon ? 'ui-chip--with-leading-icon' : '', this.trailingIcon ? 'ui-chip--with-trailing-icon' : '', this.avatar ? 'ui-chip--with-avatar' : '', this.class ].filter(Boolean).join(' '); } handleClick(event: Event): void { if (!this.disabled && this.clickable) { this.chipClick.emit(event); } } handleRemove(event: Event): void { event.stopPropagation(); if (!this.disabled) { this.chipRemove.emit(event); } } }Iűx!export * from './chip.component'; lEx &T4@نăIoGdL4![;N xJ@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles .ui-image-container { // Core Structure position: relative; display: inline-block; overflow: hidden; // Layout & Aspect Ratio aspect-ratio: var(--aspect-ratio, 1/1); // Visual Design background: $semantic-color-surface-secondary; border: $semantic-border-width-1 solid $semantic-color-border-primary; border-radius: $semantic-border-radius-md; // Transitions transition: all $semantic-duration-fast $semantic-easing-standard; // Size Variants &--size-sm { min-width: $semantic-sizing-card-width-sm * 0.5; // 8rem max-width: $semantic-sizing-card-width-sm; // 16rem min-height: $semantic-sizing-card-height-sm * 0.5; // 4rem } &--size-md { min-width: $semantic-sizing-card-width-md * 0.5; // 10rem max-width: $semantic-sizing-card-width-md; // 20rem min-height: $semantic-sizing-card-height-md * 0.5; // 6rem } &--size-lg { min-width: $semantic-sizing-card-width-lg * 0.5; // 12rem max-width: $semantic-sizing-card-width-lg; // 24rem min-height: $semantic-sizing-card-height-lg * 0.5; // 8rem } &--size-xl { min-width: $semantic-sizing-card-width-lg * 0.75; // 18rem max-width: $semantic-sizing-content-narrow; // 42rem min-height: $semantic-sizing-card-height-lg * 0.75; // 12rem } // Aspect Ratio Variants &--aspect-1-1 { aspect-ratio: 1/1; } &--aspect-4-3 { aspect-ratio: 4/3; } &--aspect-16-9 { aspect-ratio: 16/9; } &--aspect-3-2 { aspect-ratio: 3/2; } &--aspect-2-1 { aspect-ratio: 2/1; } &--aspect-3-4 { aspect-ratio: 3/4; } &--aspect-9-16 { aspect-ratio: 9/16; } // Shape Variants &--shape-square { border-radius: $semantic-border-radius-sm; } &--shape-rounded { border-radius: $semantic-border-radius-md; } &--shape-circle { border-radius: $semantic-border-radius-full; aspect-ratio: 1/1; } // State Variants &--loading { cursor: wait; } &--error { border-color: $semantic-color-border-error; border-style: dashed; } &--lazy { background: $semantic-color-surface-secondary; &:not(.ui-image-container--loaded) { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } } // Interactive States &:not(.ui-image-container--error) { &:hover { box-shadow: $semantic-shadow-elevation-2; transform: translateY(-1px); border-color: $semantic-color-border-primary; } &:focus-visible { outline: 2px solid $semantic-color-focus-ring; outline-offset: 2px; } &:active { transform: translateY(0); box-shadow: $semantic-shadow-elevation-1; } } // Image Element &__image { width: 100%; height: 100%; display: block; // Object Fit Variants &--fit-contain { object-fit: contain; } &--fit-cover { object-fit: cover; } &--fit-fill { object-fit: fill; } &--fit-scale-down { object-fit: scale-down; } &--fit-none { object-fit: none; } // Smooth appearance transition opacity: 0; transition: opacity $semantic-duration-medium $semantic-easing-standard; .ui-image-container--loaded & { opacity: 1; } } // Loading State &__loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: $semantic-color-surface-secondary; z-index: 2; } &__spinner { width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; border: 2px solid $semantic-color-border-primary; border-top: 2px solid $semantic-color-interactive-primary; border-radius: $semantic-border-radius-full; animation: spin 1s linear infinite; } // Error State &__error { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: $semantic-spacing-component-xs; background: $semantic-color-surface-secondary; color: $semantic-color-danger; z-index: 2; padding: $semantic-spacing-component-sm; text-align: center; } &__error-icon { color: $semantic-color-text-secondary; svg { width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; } } &__error-text { font-size: $semantic-typography-font-size-xs; color: $semantic-color-text-secondary; font-weight: $semantic-typography-font-weight-medium; } // Overlay &__overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.4); opacity: 0; transition: opacity $semantic-duration-fast $semantic-easing-standard; z-index: 3; .ui-image-container:hover & { opacity: 1; } } // Caption &__caption { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); color: white; padding: $semantic-spacing-component-md $semantic-spacing-component-sm $semantic-spacing-component-sm; font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-tight; z-index: 4; } // Dark Mode Support :host-context(.dark-theme) & { background: $semantic-color-surface-primary; border-color: $semantic-color-border-subtle; &__loading { background: $semantic-color-surface-primary; } &__spinner { border-color: $semantic-color-border-subtle; border-top-color: $semantic-color-interactive-primary; } } // Responsive Design @media (max-width: $semantic-sizing-breakpoint-tablet - 1) { &--size-xl { max-width: $semantic-sizing-card-width-lg; } &--size-lg { max-width: $semantic-sizing-card-width-md; } } @media (max-width: $semantic-sizing-breakpoint-mobile - 1) { // Mobile adjustments &__caption { font-size: $semantic-typography-font-size-xs; padding: $semantic-spacing-component-xs; } &__error-text { font-size: $semantic-typography-font-size-xs; } } // Accessibility - Reduced motion @media (prefers-reduced-motion: reduce) { transition: none; &__image { transition: none; } &__overlay { transition: none; } &--lazy:not(.ui-image-container--loaded) { animation: none; } &__spinner { animation: none; } } } // Animation Keyframes @keyframes spin { to { transform: rotate(360deg); } } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } // Utility classes for content projection .ui-image-container { [slot='error'] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: $semantic-spacing-component-xs; padding: $semantic-spacing-component-sm; text-align: center; height: 100%; color: $semantic-color-danger; } [slot='overlay'] { display: flex; align-items: center; justify-content: center; color: white; font-weight: $semantic-typography-font-weight-medium; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5); } [slot='caption'] { font-size: $semantic-typography-font-size-sm; line-height: $semantic-typography-line-height-tight; } }[D:Xx;eujgqFbQjniF %YTFMxMimport { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, ElementRef, OnInit, OnDestroy, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; export type ImageContainerSize = 'sm' | 'md' | 'lg' | 'xl'; export type ImageContainerAspectRatio = '1/1' | '4/3' | '16/9' | '3/2' | '2/1' | '3/4' | '9/16'; export type ImageContainerObjectFit = 'contain' | 'cover' | 'fill' | 'scale-down' | 'none'; export type ImageContainerShape = 'square' | 'rounded' | 'circle'; @Component({ selector: 'ui-image-container', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (loading && !isLoaded) { } @if (hasError) { } @else { } @if (overlay) {
    } @if (caption) {
    {{ caption }}
    }
    `, styleUrl: './image-container.component.scss' }) export class ImageContainerComponent implements OnInit, OnDestroy { @Input() src!: string; @Input() alt = ''; @Input() size: ImageContainerSize = 'md'; @Input() aspectRatio: ImageContainerAspectRatio = '1/1'; @Input() objectFit: ImageContainerObjectFit = 'cover'; @Input() shape: ImageContainerShape = 'rounded'; @Input() lazy = true; @Input() loading = false; @Input() placeholder?: string; @Input() caption?: string; @Input() overlay = false; @Input() ariaLabel?: string; @Input() errorAlt?: string; // Advanced image attributes @Input() srcset?: string; @Input() sizes?: string; @Input() crossorigin?: 'anonymous' | 'use-credentials'; @Input() referrerPolicy?: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url'; @Output() imageLoaded = new EventEmitter(); @Output() imageError = new EventEmitter(); @Output() imageClick = new EventEmitter(); @Output() loadingChange = new EventEmitter(); private elementRef = inject(ElementRef); private intersectionObserver?: IntersectionObserver; hasError = false; isLoaded = false; currentSrc = ''; ngOnInit(): void { this.initializeImage(); if (this.lazy && this.supportsIntersectionObserver()) { this.setupLazyLoading(); } else { this.loadImage(); } } ngOnDestroy(): void { if (this.intersectionObserver) { this.intersectionObserver.disconnect(); } } private initializeImage(): void { this.currentSrc = this.placeholder || this.src; this.hasError = false; this.isLoaded = false; } private setupLazyLoading(): void { if (!this.supportsIntersectionObserver()) { this.loadImage(); return; } this.intersectionObserver = new IntersectionObserver( (entries) => { entries.forEach((entry) => { if (entry.isIntersecting) { this.loadImage(); this.intersectionObserver?.unobserve(entry.target); } }); }, { rootMargin: '50px 0px', threshold: 0.01 } ); this.intersectionObserver.observe(this.elementRef.nativeElement); } private loadImage(): void { if (this.src && !this.isLoaded && !this.hasError) { this.currentSrc = this.src; this.loading = true; this.loadingChange.emit(true); } } private supportsIntersectionObserver(): boolean { return 'IntersectionObserver' in window; } handleLoadStart(): void { this.loading = true; this.loadingChange.emit(true); } handleLoad(event: Event): void { this.loading = false; this.isLoaded = true; this.hasError = false; this.loadingChange.emit(false); this.imageLoaded.emit(event); } handleError(event: Event): void { this.loading = false; this.hasError = true; this.isLoaded = false; this.loadingChange.emit(false); this.imageError.emit(event); } handleClick(event: MouseEvent): void { if (!this.hasError) { this.imageClick.emit(event); } } // Method to retry loading failed images retryLoad(): void { this.hasError = false; this.isLoaded = false; this.loadImage(); } getContainerClasses(): string { const aspectClass = `ui-image-container--aspect-${this.aspectRatio.replace('/', '-')}`; const sizeClass = `ui-image-container--size-${this.size}`; const shapeClass = `ui-image-container--shape-${this.shape}`; return `ui-image-container ${sizeClass} ${aspectClass} ${shapeClass}`; } getImageClasses(): string { const fitClass = `ui-image-container__image--fit-${this.objectFit}`; return `ui-image-container__image ${fitClass}`; } }F@^&x,export * from './image-container.component';['xuQAN@ *Uy@oH;NjYG^w N@J{=zE 0Lٵhdɛ#+Gr*\ȳGɆ @for (item of items; track item.primary) { } ``` ### Avatar List with Two Lines ```typescript avatarItems = [ { primary: 'John Doe', secondary: 'Software Engineer', avatarSrc: 'https://example.com/avatar.jpg', avatarAlt: 'John Doe' } ]; ``` ```html @for (item of avatarItems; track item.primary) { } ``` ### Media List with Three Lines ```typescript mediaItems = [ { primary: 'Angular Course', secondary: 'Complete guide to modern development', tertiary: 'Duration: 2h 30m • Updated: Today', mediaSrc: 'https://example.com/thumb.jpg', mediaAlt: 'Course thumbnail' } ]; ``` ```html @for (item of mediaItems; track item.primary) {
    4.8
    }     ``` ### Scrollable List ```html @for (item of longList; track item.id) { } ``` ## API ### ListItemComponent Props | Prop | Type | Default | Description | |------|------|---------|-------------| | `data` | `ListItemData` | required | Item content and configuration | | `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Item height and spacing | | `lines` | `'one' \| 'two' \| 'three'` | `'one'` | Number of text lines | | `variant` | `'text' \| 'avatar' \| 'media'` | `'text'` | Content type | | `interactive` | `boolean` | `true` | Enable hover/focus states | | `divider` | `boolean` | `false` | Show bottom border | ### ListContainerComponent Props | Prop | Type | Default | Description | |------|------|---------|-------------| | `elevation` | `'none' \| 'sm' \| 'md' \| 'lg'` | `'none'` | Shadow elevation | | `spacing` | `'none' \| 'xs' \| 'sm' \| 'md' \| 'lg'` | `'sm'` | Item spacing | | `scrollable` | `boolean` | `false` | Enable vertical scrolling | | `maxHeight` | `string?` | - | Maximum container height | | `fadeIndicator` | `boolean` | `true` | Show fade at scroll bottom | | `dense` | `boolean` | `false` | Reduce spacing between items | | `rounded` | `boolean` | `false` | Round container corners | | `ariaLabel` | `string?` | - | Accessibility label | ### ListItemData Interface ```typescript interface ListItemData { primary: string; // Main text (required) secondary?: string; // Secondary text tertiary?: string; // Tertiary text (three-line only) avatarSrc?: string; // Avatar image URL avatarAlt?: string; // Avatar alt text mediaSrc?: string; // Media image URL mediaAlt?: string; // Media alt text icon?: string; // Icon class name disabled?: boolean; // Disabled state selected?: boolean; // Selected state } ``` ## Slots ### Trailing Content Use the `slot="trailing"` attribute to add content to the right side of list items: ```html ``` ## Design Tokens The components use semantic design tokens for consistent styling: - **Colors**: `$semantic-color-*` - **Spacing**: `$semantic-spacing-*` - **Shadows**: `$semantic-shadow-*` - **Borders**: `$semantic-border-radius-*` ## Accessibility - Full ARIA support with proper roles and labels - Keyboard navigation support - Focus management and indicators - Screen reader friendly - High contrast mode support - Reduced motion support ## Responsive Design - Mobile-first approach - Breakpoint-specific adjustments - Touch-friendly tap targets - Optimized spacing for different screen sizes ## Examples Import and use the `ListExamplesComponent` to see all variants in action: ```typescript import { ListExamplesComponent } from './shared/components'; ``` ```html ```|&/x // ========================================================================== // LIST COMPONENTS // ========================================================================== // Comprehensive list component system with multiple variants and sizes // Built with Angular 19+ and semantic design tokens // ========================================================================== export * from './list-item.component'; export * from './list-container.component'; export * from './list-examples.component'; // Re-export types for convenience export type { ListItemSize, ListItemLines, ListItemVariant, ListItemData } from './list-item.component'; export type { ListContainerElevation, ListContainerSpacing } from './list-container.component';Qx%@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles // ========================================================================== // LIST CONTAINER COMPONENT // ========================================================================== // Container component for list items with elevation, spacing, and scrolling // Provides consistent layout and styling using semantic design tokens // ========================================================================== .list-container { display: flex; flex-direction: column; width: 100%; box-sizing: border-box; background-color: $semantic-color-surface-primary; position: relative; overflow: hidden; // ========================================================================== // ELEVATION VARIANTS // ========================================================================== &--elevation-none { box-shadow: none; } &--elevation-sm { box-shadow: $semantic-shadow-elevation-1; } &--elevation-md { box-shadow: $semantic-shadow-elevation-3; } &--elevation-lg { box-shadow: $semantic-shadow-elevation-4; } // ========================================================================== // SPACING VARIANTS // ========================================================================== &--spacing-none { padding: 0; .list-item:not(:last-child) { margin-bottom: 0; } } &--spacing-xs { padding: $semantic-spacing-component-xs 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-xs; } } &--spacing-sm { padding: $semantic-spacing-component-sm 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-sm; } } &--spacing-md { padding: $semantic-spacing-component-md 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-md; } } &--spacing-lg { padding: $semantic-spacing-component-lg 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-lg; } } // ========================================================================== // LAYOUT MODIFIERS // ========================================================================== &--scrollable { overflow-y: auto; -webkit-overflow-scrolling: touch; // Custom scrollbar styling &::-webkit-scrollbar { width: 6px; } &::-webkit-scrollbar-track { background: $semantic-color-surface-secondary; border-radius: 3px; } &::-webkit-scrollbar-thumb { background: $semantic-color-border-primary; border-radius: 3px; &:hover { background: $semantic-color-border-secondary; } } // Firefox scrollbar scrollbar-width: thin; scrollbar-color: $semantic-color-border-primary $semantic-color-surface-secondary; } &--max-height { height: var(--list-max-height); max-height: var(--list-max-height); } &--dense { &.list-container--spacing-xs .list-item:not(:last-child) { margin-bottom: $semantic-spacing-micro-tight; } &.list-container--spacing-sm .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-xs; } &.list-container--spacing-md .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-sm; } &.list-container--spacing-lg .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-md; } } &--rounded { border-radius: $semantic-border-radius-md; overflow: hidden; .list-item:first-child { border-top-left-radius: $semantic-border-radius-md; border-top-right-radius: $semantic-border-radius-md; } .list-item:last-child { border-bottom-left-radius: $semantic-border-radius-md; border-bottom-right-radius: $semantic-border-radius-md; } } } // ========================================================================== // FADE INDICATOR // ========================================================================== .list-container__fade-bottom { position: absolute; bottom: 0; left: 0; right: 0; height: 24px; background: linear-gradient( to bottom, transparent 0%, $semantic-color-surface-primary 100% ); pointer-events: none; opacity: 0; transition: opacity 0.2s ease-in-out; .list-container--scrollable:not(.list-container--at-bottom) & { opacity: 1; } } // ========================================================================== // DYNAMIC HEIGHT SETUP // ========================================================================== // JavaScript will set this CSS custom property .list-container--max-height { --list-max-height: 400px; } // ========================================================================== // RESPONSIVE ADJUSTMENTS // ========================================================================== @media (max-width: 768px) { .list-container { &--spacing-md { padding: $semantic-spacing-component-sm 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-sm; } } &--spacing-lg { padding: $semantic-spacing-component-md 0; .list-item:not(:last-child) { margin-bottom: $semantic-spacing-component-md; } } } } // ========================================================================== // ACCESSIBILITY ENHANCEMENTS // ========================================================================== .list-container { &:focus-within { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } } // ========================================================================== // ANIMATION UTILITIES // ========================================================================== .list-container { // Smooth height transitions when content changes transition: height 0.2s ease-in-out; } // List item enter/leave animations @keyframes list-item-enter { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } } @keyframes list-item-leave { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-8px); } } // Add these classes via JavaScript for dynamic content .list-item-enter { animation: list-item-enter 0.2s ease-out; } .list-item-leave { animation: list-item-leave 0.2s ease-out; }~nhxe|xgqFbQjniFMVdxFimport { Component, Input, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; export type ListContainerElevation = 'none' | 'sm' | 'md' | 'lg'; export type ListContainerSpacing = 'none' | 'xs' | 'sm' | 'md' | 'lg'; @Component({ selector: 'ui-list-container', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule], template: `
    @if (scrollable && fadeIndicator) {
    }
    `, styleUrls: ['./list-container.component.scss'] }) export class ListContainerComponent { @Input() elevation: ListContainerElevation = 'none'; @Input() spacing: ListContainerSpacing = 'sm'; @Input() scrollable = false; @Input() maxHeight?: string; @Input() fadeIndicator = true; @Input() dense = false; @Input() rounded = false; @Input() ariaLabel?: string; getContainerClasses(): string { const classes = [ `list-container--elevation-${this.elevation}`, `list-container--spacing-${this.spacing}` ]; if (this.scrollable) classes.push('list-container--scrollable'); if (this.dense) classes.push('list-container--dense'); if (this.rounded) classes.push('list-container--rounded'); if (this.maxHeight) classes.push('list-container--max-height'); return classes.join(' '); } }P Sxk Output, EventEmitteroMenu>MenuUmenu'menu>menu* orientation]="orientation%,menu,MenuH+MenuContainerElevation = 'smMenuContainerSpacing = 'xsLrounded.3orientation: 'vertical' | 'horizontal' = 'vertical'Xamenu1menu$+, `menu-container--${this.orientation2menuJ<menu9menu=menu>B}Uxb@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles // ========================================================================== // LIST EXAMPLES COMPONENT // ========================================================================== // Demonstration component showcasing all list variants and capabilities // ========================================================================== .list-examples { padding: $semantic-spacing-component-xl; max-width: 1200px; margin: 0 auto; h2 { font-size: 2rem; font-weight: 600; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-layout-lg; text-align: center; } } .example-section { margin-bottom: $semantic-spacing-layout-xl; h3 { font-size: 1.5rem; font-weight: 500; color: $semantic-color-text-primary; margin-bottom: $semantic-spacing-component-xl; padding-bottom: $semantic-spacing-component-sm; border-bottom: 2px solid $semantic-color-border-secondary; } } .example-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: $semantic-spacing-component-xl; margin-bottom: $semantic-spacing-layout-md; } .example-item { h4 { font-size: 1rem; font-weight: 500; color: $semantic-color-text-secondary; margin-bottom: $semantic-spacing-component-md; text-align: center; } } .example-single { max-width: 600px; margin: 0 auto; } // ========================================================================== // TRAILING SLOT COMPONENTS // ========================================================================== .action-button { background: none; border: none; color: $semantic-color-text-tertiary; cursor: pointer; padding: $semantic-spacing-component-xs; border-radius: $semantic-border-radius-sm; transition: all 0.15s ease-in-out; &:hover { background-color: $semantic-color-surface-interactive; color: $semantic-color-text-secondary; } &:focus { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } i { font-size: 14px; } } .timestamp { font-size: 0.75rem; color: $semantic-color-text-tertiary; font-weight: 400; } .play-button { width: 32px; height: 32px; border-radius: 50%; background-color: $semantic-color-interactive-primary; color: $semantic-color-on-brand-primary; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.15s ease-in-out; &:hover { transform: scale(1.05); box-shadow: $semantic-shadow-elevation-1; } &:focus { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } i { font-size: 12px; margin-left: 2px; // Optical alignment for play icon } } .rating { display: flex; align-items: center; gap: $semantic-spacing-micro-tight; color: $semantic-color-warning; font-size: 0.875rem; font-weight: 500; i { font-size: 14px; } } .select-button { background-color: $semantic-color-interactive-primary; color: $semantic-color-on-brand-primary; border: none; padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; border-radius: $semantic-border-radius-sm; font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all 0.15s ease-in-out; &:hover { background-color: $semantic-color-interactive-secondary; } &:focus { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; } } .text-success { color: $semantic-color-success; } // ========================================================================== // RESPONSIVE DESIGN // ========================================================================== @media (max-width: 768px) { .list-examples { padding: $semantic-spacing-component-lg; h2 { font-size: 1.5rem; } } .example-grid { grid-template-columns: 1fr; gap: $semantic-spacing-component-lg; } .example-section { margin-bottom: $semantic-spacing-layout-md; h3 { font-size: 1.25rem; } } } @media (max-width: 480px) { .list-examples { padding: $semantic-spacing-component-md; } .example-grid { gap: $semantic-spacing-component-md; } } // ========================================================================== // ACCESSIBILITY ENHANCEMENTS // ========================================================================== // Focus indicators for better keyboard navigation .list-examples { button:focus, .action-button:focus, .play-button:focus, .select-button:focus { outline: 2px solid $semantic-color-border-focus; outline-offset: 2px; border-radius: $semantic-border-radius-sm; } } // High contrast mode support @media (prefers-contrast: high) { .action-button, .play-button, .select-button { border: 1px solid $semantic-color-border-primary; } } // Reduced motion support @media (prefers-reduced-motion: reduce) { .action-button, .play-button, .select-button { transition: none; } .play-button:hover { transform: none; } }cx.import { Component, ChangeDetectionStrategy } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ListItemComponent, ListItemData } from './list-item.component'; import { ListContainerComponent } from './list-container.component'; @Component({ selector: 'ui-list-examples', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, ListItemComponent, ListContainerComponent], template: `

    List Component Examples

    Text Lists - Different Sizes

    Small (sm)

    @for (item of basicTextItems; track item.primary) { }

    Medium (md)

    @for (item of basicTextItems; track item.primary) { }

    Large (lg)

    @for (item of basicTextItems; track item.primary) { }

    Multi-line Text Lists

    Two Lines

    @for (item of twoLineItems; track item.primary) { }

    Three Lines

    @for (item of threeLineItems; track item.primary) { }

    Lists with Avatars

    Avatar + One Line

    @for (item of avatarItems; track item.primary) { }

    Avatar + Two Lines

    @for (item of avatarTwoLineItems; track item.primary) { 2h }

    Lists with Media

    Media + Two Lines

    @for (item of mediaItems; track item.primary) { }

    Media + Three Lines

    @for (item of mediaThreeLineItems; track item.primary) {
    4.8
    }

    Scrollable List

    @for (item of longList; track item.primary) { @if (item.selected) { } }

    Interactive States

    @for (item of interactiveItems; track item.primary) { @if (item.selected) { } @else { } }
    `, styleUrls: ['./list-examples.component.scss'] }) export class ListExamplesComponent { basicTextItems: ListItemData[] = [ { primary: 'Inbox' }, { primary: 'Starred' }, { primary: 'Sent' }, { primary: 'Drafts' }, { primary: 'Archive' } ]; twoLineItems: ListItemData[] = [ { primary: 'Meeting with Design Team', secondary: 'Discuss new component library architecture and implementation' }, { primary: 'Code Review - Authentication', secondary: 'Review pull request #247 for OAuth integration updates' }, { primary: 'Performance Optimization', secondary: 'Analyze bundle size and implement lazy loading strategies' } ]; threeLineItems: ListItemData[] = [ { primary: 'Angular 19 Migration', secondary: 'Upgrade project to latest Angular version with new control flow', tertiary: 'Estimated completion: Next Sprint' }, { primary: 'Design System Documentation', secondary: 'Create comprehensive documentation for all components', tertiary: 'Priority: High - Needed for team onboarding' } ]; avatarItems: ListItemData[] = [ { primary: 'John Doe', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=john', avatarAlt: 'John Doe avatar' }, { primary: 'Jane Smith', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=jane', avatarAlt: 'Jane Smith avatar' }, { primary: 'Mike Johnson', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=mike', avatarAlt: 'Mike Johnson avatar' } ]; avatarTwoLineItems: ListItemData[] = [ { primary: 'Sarah Wilson', secondary: 'Hey! How\'s the new component library coming along?', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=sarah', avatarAlt: 'Sarah Wilson avatar' }, { primary: 'Alex Chen', secondary: 'The design tokens look great. Ready for review.', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=alex', avatarAlt: 'Alex Chen avatar' } ]; mediaItems: ListItemData[] = [ { primary: 'Angular Fundamentals', secondary: 'Complete guide to modern Angular development', mediaSrc: 'https://picsum.photos/80/80?random=1', mediaAlt: 'Angular course thumbnail' }, { primary: 'TypeScript Deep Dive', secondary: 'Advanced TypeScript patterns and best practices', mediaSrc: 'https://picsum.photos/80/80?random=2', mediaAlt: 'TypeScript course thumbnail' } ]; mediaThreeLineItems: ListItemData[] = [ { primary: 'Design Systems at Scale', secondary: 'Building maintainable design systems for large organizations', tertiary: 'Duration: 2h 30m • Updated: Today', mediaSrc: 'https://picsum.photos/80/80?random=3', mediaAlt: 'Design systems course' }, { primary: 'Component Architecture', secondary: 'Scalable component patterns in modern web applications', tertiary: 'Duration: 1h 45m • Updated: Yesterday', mediaSrc: 'https://picsum.photos/80/80?random=4', mediaAlt: 'Component architecture course' } ]; longList: ListItemData[] = Array.from({ length: 20 }, (_, i) => ({ primary: `Contact ${i + 1}`, secondary: `contact${i + 1}@example.com`, avatarSrc: `https://api.dicebear.com/7.x/avataaars/svg?seed=contact${i}`, avatarAlt: `Contact ${i + 1} avatar`, selected: i === 3 || i === 7 || i === 12 })); interactiveItems: ListItemData[] = [ { primary: 'Enable Notifications', secondary: 'Get notified about important updates', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=notify', selected: false }, { primary: 'Dark Mode', secondary: 'Switch to dark theme', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=dark', selected: true }, { primary: 'Auto-save', secondary: 'Automatically save your work', avatarSrc: 'https://api.dicebear.com/7.x/avataaars/svg?seed=save', selected: false, disabled: true } ]; }*>ҳx3@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles // ========================================================================== // LIST ITEM COMPONENT // ========================================================================== // Comprehensive list item component with multiple variants and sizes // Uses semantic design tokens for consistent styling across the design system // ========================================================================== .list-item { display: flex; align-items: stretch; width: 100%; box-sizing: border-box; position: relative; user-select: none; background-color: $semantic-color-surface-primary; color: $semantic-color-text-primary; // Interactive states &--interactive { cursor: pointer; transition: background-color 0.15s ease-in-out; &:hover:not(.list-item--disabled) { background-color: $semantic-color-surface-interactive; } &:focus-within:not(.list-item--disabled) { outline: 2px solid $semantic-color-border-focus; outline-offset: -2px; } } // States &--selected { background-color: $semantic-color-container-primary; color: $semantic-color-on-container-primary; } &--disabled { opacity: 0.6; cursor: not-allowed; color: $semantic-color-text-disabled; } &--divider { border-bottom: 1px solid $semantic-color-border-secondary; } // ========================================================================== // SIZE VARIANTS // ========================================================================== &--sm { min-height: 40px; &.list-item--one-line { height: 40px; } &.list-item--two-line { min-height: 56px; } &.list-item--three-line { min-height: 72px; } } &--md { min-height: 48px; &.list-item--one-line { height: 48px; } &.list-item--two-line { min-height: 64px; } &.list-item--three-line { min-height: 80px; } } &--lg { min-height: 56px; &.list-item--one-line { height: 56px; } &.list-item--two-line { min-height: 72px; } &.list-item--three-line { min-height: 88px; } } } // ========================================================================== // LAYOUT ELEMENTS // ========================================================================== .list-item__avatar, .list-item__media, .list-item__icon { flex-shrink: 0; display: flex; align-items: center; justify-content: center; } .list-item__avatar { .list-item--sm & { width: 32px; padding: $semantic-spacing-component-sm; } .list-item--md & { width: 40px; padding: $semantic-spacing-component-md; } .list-item--lg & { width: 48px; padding: $semantic-spacing-component-lg; } } .list-item__avatar-image { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; .list-item--sm & { width: 24px; height: 24px; } .list-item--md & { width: 32px; height: 32px; } .list-item--lg & { width: 40px; height: 40px; } } .list-item__media { .list-item--sm & { width: 48px; padding: $semantic-spacing-component-sm; } .list-item--md & { width: 56px; padding: $semantic-spacing-component-md; } .list-item--lg & { width: 64px; padding: $semantic-spacing-component-lg; } } .list-item__media-image { width: 100%; height: auto; border-radius: $semantic-border-radius-sm; object-fit: cover; .list-item--sm & { width: 40px; height: 40px; } .list-item--md & { width: 48px; height: 48px; } .list-item--lg & { width: 56px; height: 56px; } } .list-item__icon { .list-item--sm & { width: 32px; padding: $semantic-spacing-component-sm; } .list-item--md & { width: 40px; padding: $semantic-spacing-component-md; } .list-item--lg & { width: 48px; padding: $semantic-spacing-component-lg; } i { color: $semantic-color-text-secondary; .list-item--sm & { font-size: 16px; } .list-item--md & { font-size: 20px; } .list-item--lg & { font-size: 24px; } } } .list-item__content { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; gap: $semantic-spacing-micro-tight; .list-item--sm & { padding: $semantic-spacing-component-xs $semantic-spacing-component-sm; } .list-item--lg & { padding: $semantic-spacing-component-md $semantic-spacing-component-lg; } } .list-item__primary { font-size: 1rem; font-weight: 500; line-height: 1.25; color: inherit; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; .list-item--sm & { font-size: 0.875rem; } .list-item--lg & { font-size: 1.125rem; } } .list-item__secondary { font-size: 0.875rem; font-weight: 400; line-height: 1.25; color: $semantic-color-text-secondary; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; .list-item--sm & { font-size: 0.75rem; } .list-item--lg & { font-size: 1rem; } } .list-item__tertiary { font-size: 0.75rem; font-weight: 400; line-height: 1.25; color: $semantic-color-text-tertiary; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; .list-item--sm & { font-size: 0.6875rem; } .list-item--lg & { font-size: 0.875rem; } } .list-item__trailing { flex-shrink: 0; display: flex; align-items: center; padding-right: $semantic-spacing-component-md; .list-item--sm & { padding-right: $semantic-spacing-component-sm; } .list-item--lg & { padding-right: $semantic-spacing-component-lg; } &:empty { display: none; } } // ========================================================================== // LINE VARIANTS - Content layout adjustments // ========================================================================== .list-item--one-line { .list-item__content { justify-content: center; } } .list-item--two-line { .list-item__content { justify-content: center; gap: $semantic-spacing-micro-tight; } } .list-item--three-line { .list-item__content { justify-content: flex-start; padding-top: $semantic-spacing-component-sm; padding-bottom: $semantic-spacing-component-sm; gap: $semantic-spacing-micro-tight; .list-item--sm & { padding-top: $semantic-spacing-component-xs; padding-bottom: $semantic-spacing-component-xs; } .list-item--lg & { padding-top: $semantic-spacing-component-md; padding-bottom: $semantic-spacing-component-md; } } } // ========================================================================== // VARIANT SPECIFIC STYLES // ========================================================================== .list-item--avatar { .list-item__content { padding-left: $semantic-spacing-component-xs; } } .list-item--media { .list-item__content { padding-left: $semantic-spacing-component-xs; } } // ========================================================================== // RESPONSIVE ADJUSTMENTS // ========================================================================== @media (max-width: 768px) { .list-item { &--lg { min-height: 48px; &.list-item--one-line { height: 48px; } &.list-item--two-line { min-height: 64px; } &.list-item--three-line { min-height: 80px; } } } .list-item__content { padding-left: $semantic-spacing-component-sm; padding-right: $semantic-spacing-component-sm; } })AxlfgqFbQjniF n9P x- import { Component, Input, ChangeDetectionStrategy, inject } from '@angular/core'; import { CommonModule } from '@angular/common'; export type ListItemSize = 'sm' | 'md' | 'lg'; export type ListItemLines = 'one' | 'two' | 'three'; export type ListItemVariant = 'text' | 'avatar' | 'media'; export interface ListItemData { primary: string; secondary?: string; tertiary?: string; avatarSrc?: string; avatarAlt?: string; mediaSrc?: string; mediaAlt?: string; icon?: string; disabled?: boolean; selected?: boolean; } @Component({ selector: 'ui-list-item', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule], template: `
    @if (variant === 'avatar' && data.avatarSrc) {
    } @if (variant === 'media' && data.mediaSrc) {
    } @if (data.icon) {
    }
    @if (lines === 'one') {
    {{ data.primary }}
    } @if (lines === 'two') {
    {{ data.primary }}
    {{ data.secondary }}
    } @if (lines === 'three') {
    {{ data.primary }}
    {{ data.secondary }}
    {{ data.tertiary }}
    }
    `, styleUrls: ['./list-item.component.scss'] }) export class ListItemComponent { @Input() data!: ListItemData; @Input() size: ListItemSize = 'md'; @Input() lines: ListItemLines = 'one'; @Input() variant: ListItemVariant = 'text'; @Input() interactive = true; @Input() divider = false; getItemClasses(): string { const classes = [ `list-item--${this.size}`, `list-item--${this.lines}-line`, `list-item--${this.variant}` ]; if (this.interactive) classes.push('list-item--interactive'); if (this.divider) classes.push('list-item--divider'); if (this.data.disabled) classes.push('list-item--disabled'); if (this.data.selected) classes.push('list-item--selected'); return classes.join(' '); } }}BxG%(!a-`NL[5[x)export * from './progress-bar.component';0x%@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Tokens available globally via main application styles // ========================================================================== // PROGRESS BAR COMPONENT STYLES // ========================================================================== // Modern progress bar implementation using design tokens // Follows Material Design 3 principles with semantic token system // Includes determinate, indeterminate, and buffer progress types // ========================================================================== .progress-bar-wrapper { display: flex; flex-direction: column; width: 100%; // Size variants &.progress-bar-wrapper--sm { gap: $semantic-spacing-component-xs; } &.progress-bar-wrapper--md { gap: $semantic-spacing-component-sm; } &.progress-bar-wrapper--lg { gap: $semantic-spacing-component-md; } // State variants &.progress-bar-wrapper--disabled { opacity: 0.6; pointer-events: none; } } .progress-bar { position: relative; display: block; width: 100%; background-color: $semantic-color-surface-secondary; border-radius: $semantic-border-radius-full; overflow: hidden; transition: all $semantic-duration-fast $semantic-easing-standard; // Size variants &.progress-bar--sm { height: 4px; } &.progress-bar--md { height: 6px; } &.progress-bar--lg { height: 8px; } // Disabled state &.progress-bar--disabled { background-color: $semantic-color-surface-disabled; } } .progress-bar__fill { position: absolute; top: 0; left: 0; height: 100%; border-radius: inherit; transition: width $semantic-duration-medium $semantic-easing-standard; // Variant colors .progress-bar-wrapper--primary & { background-color: $semantic-color-brand-primary; } .progress-bar-wrapper--secondary & { background-color: $semantic-color-text-secondary; } .progress-bar-wrapper--success & { background-color: $semantic-color-success; } .progress-bar-wrapper--warning & { background-color: $semantic-color-warning; } .progress-bar-wrapper--danger & { background-color: $semantic-color-danger; } // Disabled state &.progress-bar__fill--disabled { background-color: $semantic-color-surface-disabled !important; } // Striped effect &.progress-bar__fill--striped { background-image: linear-gradient( 45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent ); background-size: 1rem 1rem; } // Animated stripes &.progress-bar__fill--animated { animation: progress-bar-stripes 1s linear infinite; } } // Indeterminate progress bar .progress-bar__fill--indeterminate { width: 100%; &:before { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; animation: indeterminate 2.1s cubic-bezier(0.650, 0.815, 0.735, 0.395) infinite; } &:after { content: ''; position: absolute; background-color: inherit; top: 0; left: 0; bottom: 0; will-change: left, right; animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite; animation-delay: 1.15s; } } // Buffer progress bar .progress-bar__buffer { position: absolute; top: 0; left: 0; height: 100%; background-color: rgba($semantic-color-text-secondary, 0.3); border-radius: inherit; transition: width $semantic-duration-medium $semantic-easing-standard; &.progress-bar__buffer--disabled { background-color: $semantic-color-surface-disabled; } } .progress-bar__fill--buffer { z-index: 1; } // Label and percentage .progress-bar__label { display: flex; justify-content: space-between; align-items: center; color: $semantic-color-text-primary; font-weight: $semantic-typography-font-weight-medium; line-height: $semantic-typography-line-height-tight; // Size variants &.progress-bar__label--sm { font-size: $semantic-typography-font-size-sm; margin-bottom: $semantic-spacing-component-xs; } &.progress-bar__label--md { font-size: $semantic-typography-font-size-md; margin-bottom: $semantic-spacing-component-sm; } &.progress-bar__label--lg { font-size: $semantic-typography-font-size-lg; margin-bottom: $semantic-spacing-component-sm; } // Disabled state &.progress-bar__label--disabled { color: $semantic-color-text-disabled; } } .progress-bar__label-text { flex: 1; margin-right: $semantic-spacing-component-sm; } .progress-bar__percentage { font-weight: $semantic-typography-font-weight-bold; color: $semantic-color-text-secondary; font-variant-numeric: tabular-nums; .progress-bar__label--disabled & { color: $semantic-color-text-disabled; } } .progress-bar__helper-text { color: $semantic-color-text-secondary; line-height: $semantic-typography-line-height-tight; // Size variants &.progress-bar__helper-text--sm { font-size: $semantic-typography-font-size-xs; margin-top: $semantic-spacing-component-xs; } &.progress-bar__helper-text--md { font-size: $semantic-typography-font-size-sm; margin-top: $semantic-spacing-component-xs; } &.progress-bar__helper-text--lg { font-size: $semantic-typography-font-size-md; margin-top: $semantic-spacing-component-sm; } // Disabled state &.progress-bar__helper-text--disabled { color: $semantic-color-text-disabled; } } // ========================================================================== // ANIMATIONS // ========================================================================== // Striped animation @keyframes progress-bar-stripes { 0% { background-position-x: 1rem; } 100% { background-position-x: 0; } } // Indeterminate animations @keyframes indeterminate { 0% { left: -35%; right: 100%; } 60% { left: 100%; right: -90%; } 100% { left: 100%; right: -90%; } } @keyframes indeterminate-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; } } // Pulse animation for focus/hover states @keyframes progress-bar-pulse { 0% { box-shadow: 0 0 0 0 rgba($semantic-color-brand-primary, 0.4); } 70% { box-shadow: 0 0 0 4px rgba($semantic-color-brand-primary, 0); } 100% { box-shadow: 0 0 0 0 rgba($semantic-color-brand-primary, 0); } } // ========================================================================== // HOVER AND FOCUS STATES // ========================================================================== .progress-bar:hover:not(.progress-bar--disabled) { transform: scaleY(1.1); box-shadow: $semantic-shadow-elevation-1; } .progress-bar:focus-visible { outline: $semantic-border-width-2 solid $semantic-color-brand-primary; outline-offset: 2px; } // ========================================================================== // RESPONSIVE DESIGN // ========================================================================== @media (max-width: $semantic-sizing-breakpoint-tablet - 1) { .progress-bar-wrapper { // Slightly larger progress bars on mobile for better visibility &.progress-bar-wrapper--sm { .progress-bar--sm { height: 5px; } } &.progress-bar-wrapper--md { .progress-bar--md { height: 7px; } } &.progress-bar-wrapper--lg { .progress-bar--lg { height: 9px; } } } } // ========================================================================== // ACCESSIBILITY ENHANCEMENTS // ========================================================================== // Reduced motion preference @media (prefers-reduced-motion: reduce) { .progress-bar__fill, .progress-bar__buffer { transition: none !important; } .progress-bar__fill--animated, .progress-bar__fill--indeterminate:before, .progress-bar__fill--indeterminate:after { animation: none !important; } } // High contrast mode @media (prefers-contrast: high) { .progress-bar { border: $semantic-border-width-1 solid $semantic-color-text-primary; } .progress-bar__fill { border: $semantic-border-width-1 solid $semantic-color-text-primary; border-radius: 0; } } // ========================================================================== // THEME VARIANTS // ========================================================================== // Dark theme adjustments @media (prefers-color-scheme: dark) { .progress-bar { background-color: rgba($semantic-color-surface-primary, 0.1); } .progress-bar__buffer { background-color: rgba($semantic-color-text-secondary, 0.2); } } // ========================================================================== // SPECIAL STATES AND EFFECTS // ========================================================================== // Success completion effect .progress-bar-wrapper--success { .progress-bar__fill[style*="100%"] { animation: progress-complete 0.6s $semantic-easing-spring; } } @keyframes progress-complete { 0% { transform: scaleX(1); } 50% { transform: scaleX(1.02); } 100% { transform: scaleX(1); } } // Error state pulsing .progress-bar-wrapper--danger { .progress-bar__fill { animation: progress-error 2s ease-in-out infinite; } } @keyframes progress-error { 0%, 100% { opacity: 1; } 50% { opacity: 0.8; } }^ƴ x{gqFbQjniF_ximport { Component, Input, ChangeDetectionStrategy, signal, computed, ViewChild, ElementRef } from '@angular/core'; import { CommonModule } from '@angular/common'; export type ProgressBarSize = 'sm' | 'md' | 'lg'; export type ProgressBarVariant = 'primary' | 'secondary' | 'success' | 'warning' | 'danger'; export type ProgressBarType = 'determinate' | 'indeterminate' | 'buffer'; export type ProgressBarState = 'default' | 'disabled'; @Component({ selector: 'ui-progress-bar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule], template: `
    @if (showLabelComputed()) {
    {{ label }} @if (showPercentageComputed() && type() === 'determinate') { {{ Math.round(value()) }}% }
    }
    @if (type() === 'determinate') {
    } @if (type() === 'indeterminate') {
    } @if (type() === 'buffer') {
    }
    @if (helperTextComputed()) {
    {{ helperTextComputed() }}
    }
    `, styleUrls: ['./progress-bar.component.scss'] }) export class ProgressBarComponent { @ViewChild('progressElement', { static: false }) progressElement!: ElementRef; // Core inputs @Input() set progress(value: number) { this._value.set(Math.max(0, Math.min(100, value))); } @Input() set buffer(value: number) { this._bufferValue.set(Math.max(0, Math.min(100, value))); } @Input() label: string = ''; @Input() size: ProgressBarSize = 'md'; @Input() variant: ProgressBarVariant = 'primary'; @Input() progressType: ProgressBarType = 'determinate'; @Input() state: ProgressBarState = 'default'; // Display options @Input() showLabel = true; @Input() showPercentage = true; @Input() striped = false; @Input() animated = false; // Accessibility @Input() ariaLabel: string = ''; @Input() helperText: string = ''; @Input() progressId: string = `progress-${Math.random().toString(36).substr(2, 9)}`; // Exposed Math for template protected readonly Math = Math; // Internal state private _value = signal(0); private _bufferValue = signal(0); // Computed properties protected value = computed(() => this._value()); protected bufferValue = computed(() => this._bufferValue()); protected type = computed(() => this.progressType); protected showLabelComputed = computed(() => this.label && this.showLabel); protected showPercentageComputed = computed(() => this.showPercentage && this.progressType === 'determinate'); protected helperTextComputed = computed(() => this.helperText); ngOnInit(): void { // Initialize with default values if not set if (this._value() === 0 && this.progressType === 'determinate') { this._value.set(0); } } getAriaValueText(): string { if (this.progressType === 'determinate') { return `${Math.round(this.value())}% complete`; } else if (this.progressType === 'indeterminate') { return 'Loading...'; } else { return `${Math.round(this.value())}% of ${Math.round(this.bufferValue())}%`; } } // CSS class getters getWrapperClasses(): string { const classes = [ `progress-bar-wrapper--${this.size}`, `progress-bar-wrapper--${this.variant}`, `progress-bar-wrapper--${this.progressType}`, `progress-bar-wrapper--${this.state}` ]; if (this.state === 'disabled') classes.push('progress-bar-wrapper--disabled'); if (this.striped) classes.push('progress-bar-wrapper--striped'); if (this.animated) classes.push('progress-bar-wrapper--animated'); return classes.join(' '); } getProgressBarClasses(): string { const classes = [ `progress-bar--${this.size}`, `progress-bar--${this.variant}`, `progress-bar--${this.progressType}`, `progress-bar--${this.state}` ]; if (this.state === 'disabled') classes.push('progress-bar--disabled'); return classes.join(' '); } getFillClasses(): string { const classes = [`progress-bar__fill--${this.size}`]; if (this.striped) classes.push('progress-bar__fill--striped'); if (this.animated) classes.push('progress-bar__fill--animated'); if (this.state === 'disabled') classes.push('progress-bar__fill--disabled'); return classes.join(' '); } getBufferClasses(): string { const classes = [`progress-bar__buffer--${this.size}`]; if (this.state === 'disabled') classes.push('progress-bar__buffer--disabled'); return classes.join(' '); } getLabelClasses(): string { const classes = [`progress-bar__label--${this.size}`]; if (this.state === 'disabled') classes.push('progress-bar__label--disabled'); return classes.join(' '); } getHelperTextClasses(): string { const classes = [`progress-bar__helper-text--${this.size}`]; if (this.state === 'disabled') classes.push('progress-bar__helper-text--disabled'); return classes.join(' '); } // Public methods for programmatic control setProgress(value: number): void { this._value.set(Math.max(0, Math.min(100, value))); } setBuffer(value: number): void { this._bufferValue.set(Math.max(0, Math.min(100, value))); } reset(): void { this._value.set(0); this._bufferValue.set(0); } complete(): void { this._value.set(100); } }MYxQ%:&dxk/Y0剐 Y__#lx.li =R ANHQP >~yb2.u$xxqimport { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, ContentChild, TemplateRef, ViewChild, ElementRef, OnInit, OnDestroy, AfterViewInit, HostListener, signal, computed } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; export type EnhancedTableVariant = 'default' | 'striped' | 'bordered' | 'minimal'; export type EnhancedTableSize = 'compact' | 'default' | 'comfortable'; export type EnhancedTableColumnAlign = 'left' | 'center' | 'right'; export type FilterOperator = 'equals' | 'contains' | 'startsWith' | 'endsWith' | 'gt' | 'gte' | 'lt' | 'lte' | 'range' | 'in' | 'notIn'; export interface EnhancedTableColumn { key: string; label: string; sortable?: boolean; filterable?: boolean; resizable?: boolean; draggable?: boolean; align?: EnhancedTableColumnAlign; width?: number; minWidth?: number; maxWidth?: number; sticky?: boolean; filterType?: 'text' | 'number' | 'date' | 'select' | 'multi-select'; filterOptions?: Array<{label: string, value: any}>; hidden?: boolean; } export interface TableFilter { column: string; operator: FilterOperator; value: any; value2?: any; // For range filters } export interface TableSort { column: string; direction: 'asc' | 'desc'; priority: number; // For multi-column sorting } export interface EnhancedTableSortEvent { sorting: TableSort[]; } export interface EnhancedTableFilterEvent { filters: TableFilter[]; } export interface EnhancedTableColumnResizeEvent { column: string; width: number; columnWidths: Record; } export interface EnhancedTableColumnReorderEvent { fromIndex: number; toIndex: number; columnOrder: string[]; } export interface VirtualScrollConfig { enabled: boolean; itemHeight: number; buffer?: number; trackBy?: (index: number, item: any) => any; } @Component({ selector: 'ui-enhanced-table', standalone: true, imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (showFilterRow) {
    @for (column of visibleColumns(); track column.key) { @if (column.filterable) {
    @switch (column.filterType || 'text') { @case ('text') { } @case ('number') { } @case ('select') { } }
    } @else {
    } }
    }
    @for (column of visibleColumns(); track column.key; let colIndex = $index) {
    {{ column.label }} @if (column.sortable) {
    @for (sort of getCurrentSorting(column.key); track sort.priority) { @if (sort.direction === 'asc') { ↑ } @else { ↓ } @if (sorting().length > 1) { {{ sort.priority + 1 }} } }
    }
    @if (column.resizable) {
    }
    }
    @if (virtualScrolling.enabled) {
    @if (virtualStartOffset() > 0) {
    } @for (row of virtualRows(); track virtualScrolling.trackBy ? virtualScrolling.trackBy($index, row) : $index; let rowIndex = $index) {
    @for (column of visibleColumns(); track column.key) {
    @if (getCellTemplate(column.key)) { } @else { {{ getCellValue(row, column.key) }} }
    }
    } @if (virtualEndOffset() > 0) {
    }
    } @else {
    @if (filteredAndSortedData().length === 0 && showEmptyState) {
    @if (emptyTemplate) { } @else {
    {{ emptyMessage }}
    }
    } @else { @for (row of filteredAndSortedData(); track trackByFn ? trackByFn($index, row) : $index; let rowIndex = $index) {
    @for (column of visibleColumns(); track column.key) {
    @if (getCellTemplate(column.key)) { } @else { {{ getCellValue(row, column.key) }} }
    }
    } }
    }
    @if (loading) {
    {{ loadingMessage }}
    } @if (columnReorderState.dragging) {
    {{ columnReorderState.draggedColumn?.label }}
    }
    `, styleUrl: './enhanced-table.component.scss' }) export class EnhancedTableComponent implements OnInit, OnDestroy, AfterViewInit { @Input() data: any[] = []; @Input() columns: EnhancedTableColumn[] = []; @Input() variant: EnhancedTableVariant = 'default'; @Input() size: EnhancedTableSize = 'default'; @Input() showFilterRow: boolean = false; @Input() showEmptyState: boolean = true; @Input() emptyMessage: string = 'No data available'; @Input() loading: boolean = false; @Input() loadingMessage: string = 'Loading...'; @Input() hoverable: boolean = true; @Input() selectable: boolean = false; @Input() stickyHeader: boolean = false; @Input() maxHeight: string = ''; @Input() trackByFn?: (index: number, item: any) => any; @Input() cellTemplates: Record> = {}; @Input() class: string = ''; // Enhanced features @Input() virtualScrolling: VirtualScrollConfig = { enabled: false, itemHeight: 48, buffer: 5 }; @Input() multiSort: boolean = false; @Input() initialSorting: TableSort[] = []; @Input() initialFilters: TableFilter[] = []; @Input() initialColumnWidths: Record = {}; @Input() initialColumnOrder: string[] = []; @Output() rowClick = new EventEmitter<{row: any, index: number}>(); @Output() sortChange = new EventEmitter(); @Output() filterChange = new EventEmitter(); @Output() columnResize = new EventEmitter(); @Output() columnReorder = new EventEmitter(); @Output() selectionChange = new EventEmitter(); @ContentChild('emptyTemplate') emptyTemplate?: TemplateRef; @ViewChild('tableContainer') tableContainer?: ElementRef; @ViewChild('scrollContainer') scrollContainer?: ElementRef; // Signals for reactive state management sorting = signal([]); filters = signal([]); columnWidths = signal>({}); columnOrder = signal([]); selectedRows: Set = new Set(); // Virtual scrolling state virtualStartIndex = signal(0); virtualEndIndex = signal(0); virtualViewportHeight = signal(400); // Column resizing state columnResizeState = { resizing: false, columnKey: '', startX: 0, startWidth: 0 }; // Column reordering state columnReorderState = { dragging: false, draggedIndex: -1, draggedColumn: null as EnhancedTableColumn | null, ghostX: 0, ghostY: 0 }; // Computed properties visibleColumns = computed(() => { const order = this.columnOrder(); const cols = this.columns.filter(col => !col.hidden); if (order.length === 0) { return cols; } // Sort columns by order array return order .map(key => cols.find(col => col.key === key)) .filter(Boolean) as EnhancedTableColumn[]; }); filteredAndSortedData = computed(() => { let result = [...this.data]; // Apply filters const currentFilters = this.filters(); currentFilters.forEach(filter => { result = this.applyFilter(result, filter); }); // Apply sorting const currentSorting = this.sorting(); if (currentSorting.length > 0) { result.sort((a, b) => { for (const sort of currentSorting.sort((x, y) => x.priority - y.priority)) { const valueA = this.getCellValue(a, sort.column); const valueB = this.getCellValue(b, sort.column); const comparison = this.compareValues(valueA, valueB); if (comparison !== 0) { return sort.direction === 'desc' ? -comparison : comparison; } } return 0; }); } return result; }); virtualRows = computed(() => { if (!this.virtualScrolling.enabled) return []; const data = this.filteredAndSortedData(); const start = this.virtualStartIndex(); const end = Math.min(this.virtualEndIndex(), data.length); return data.slice(start, end); }); virtualStartOffset = computed(() => { return this.virtualStartIndex() * this.virtualScrolling.itemHeight; }); virtualEndOffset = computed(() => { const data = this.filteredAndSortedData(); const remainingItems = data.length - this.virtualEndIndex(); return remainingItems > 0 ? remainingItems * this.virtualScrolling.itemHeight : 0; }); ngOnInit() { // Initialize state from inputs this.sorting.set([...this.initialSorting]); this.filters.set([...this.initialFilters]); this.columnWidths.set({...this.initialColumnWidths}); this.columnOrder.set([...this.initialColumnOrder]); // Set default column widths this.initializeColumnWidths(); } ngAfterViewInit() { if (this.virtualScrolling.enabled) { this.calculateVirtualScrolling(); } } ngOnDestroy() { // Cleanup event listeners document.removeEventListener('mousemove', this.onColumnResize); document.removeEventListener('mouseup', this.onColumnResizeEnd); document.removeEventListener('mousemove', this.onColumnReorderMove); document.removeEventListener('mouseup', this.onColumnReorderEnd); } get tableContainerClasses(): string { return [ 'ui-enhanced-table-container', `ui-enhanced-table-container--${this.variant}`, `ui-enhanced-table-container--${this.size}`, this.stickyHeader ? 'ui-enhanced-table-container--sticky-header' : '', this.maxHeight ? 'ui-enhanced-table-container--max-height' : '', this.loading ? 'ui-enhanced-table-container--loading' : '', this.virtualScrolling.enabled ? 'ui-enhanced-table-container--virtual' : '', this.class ].filter(Boolean).join(' '); } private initializeColumnWidths(): void { const widths = {...this.columnWidths()}; this.columns.forEach(column => { if (!widths[column.key]) { widths[column.key] = column.width || 150; } }); this.columnWidths.set(widths); } getColumnWidth(columnKey: string): number { return this.columnWidths()[columnKey] || 150; } // Virtual scrolling methods calculateVirtualScrolling(): void { if (!this.scrollContainer) return; const container = this.scrollContainer.nativeElement; const containerHeight = container.clientHeight; const itemHeight = this.virtualScrolling.itemHeight; const buffer = this.virtualScrolling.buffer || 5; const visibleCount = Math.ceil(containerHeight / itemHeight); const startIndex = Math.floor(container.scrollTop / itemHeight); const bufferedStart = Math.max(0, startIndex - buffer); const bufferedEnd = Math.min( this.filteredAndSortedData().length, startIndex + visibleCount + buffer ); this.virtualStartIndex.set(bufferedStart); this.virtualEndIndex.set(bufferedEnd); this.virtualViewportHeight.set(this.filteredAndSortedData().length * itemHeight); } onVirtualScroll(event: Event): void { this.calculateVirtualScrolling(); } // Sorting methods handleSort(column: EnhancedTableColumn, event?: MouseEvent): void { if (!column.sortable) return; const currentSorting = [...this.sorting()]; const existingIndex = currentSorting.findIndex(s => s.column === column.key); if (this.multiSort && event?.ctrlKey) { // Multi-sort mode if (existingIndex >= 0) { const existing = currentSorting[existingIndex]; if (existing.direction === 'asc') { existing.direction = 'desc'; } else { currentSorting.splice(existingIndex, 1); } } else { currentSorting.push({ column: column.key, direction: 'asc', priority: currentSorting.length }); } } else { // Single sort mode if (existingIndex >= 0) { const existing = currentSorting[existingIndex]; if (existing.direction === 'asc') { existing.direction = 'desc'; currentSorting.splice(0, currentSorting.length, existing); } else { currentSorting.splice(0, currentSorting.length); } } else { currentSorting.splice(0, currentSorting.length, { column: column.key, direction: 'asc', priority: 0 }); } } // Update priorities currentSorting.forEach((sort, index) => { sort.priority = index; }); this.sorting.set(currentSorting); this.sortChange.emit({ sorting: currentSorting }); } getSortInfo(columnKey: string): {active: boolean, direction?: 'asc' | 'desc', priority?: number} { const sort = this.sorting().find(s => s.column === columnKey); return sort ? { active: true, direction: sort.direction, priority: sort.priority } : { active: false }; } getCurrentSorting(columnKey: string): TableSort[] { return this.sorting().filter(s => s.column === columnKey); } getSortAttribute(columnKey: string): string | null { const sort = this.sorting().find(s => s.column === columnKey); return sort ? (sort.direction === 'asc' ? 'ascending' : 'descending') : null; } private compareValues(a: any, b: any): number { if (a == null && b == null) return 0; if (a == null) return -1; if (b == null) return 1; // Handle different data types if (typeof a === 'string' && typeof b === 'string') { return a.localeCompare(b); } if (typeof a === 'number' && typeof b === 'number') { return a - b; } if (a instanceof Date && b instanceof Date) { return a.getTime() - b.getTime(); } // Fallback to string comparison return String(a).localeCompare(String(b)); } // Filtering methods updateFilter(columnKey: string, operator: FilterOperator, value: any): void { const currentFilters = [...this.filters()]; const existingIndex = currentFilters.findIndex(f => f.column === columnKey); if (value === '' || value == null) { // Remove filter if value is empty if (existingIndex >= 0) { currentFilters.splice(existingIndex, 1); } } else { const filter: TableFilter = { column: columnKey, operator, value }; if (existingIndex >= 0) { currentFilters[existingIndex] = filter; } else { currentFilters.push(filter); } } this.filters.set(currentFilters); this.filterChange.emit({ filters: currentFilters }); } getFilterValue(columnKey: string): any { const filter = this.filters().find(f => f.column === columnKey); return filter?.value || ''; } private applyFilter(data: any[], filter: TableFilter): any[] { return data.filter(row => { const cellValue = this.getCellValue(row, filter.column); const filterValue = filter.value; switch (filter.operator) { case 'equals': return cellValue == filterValue; case 'contains': return String(cellValue).toLowerCase().includes(String(filterValue).toLowerCase()); case 'startsWith': return String(cellValue).toLowerCase().startsWith(String(filterValue).toLowerCase()); case 'endsWith': return String(cellValue).toLowerCase().endsWith(String(filterValue).toLowerCase()); case 'gt': return Number(cellValue) > Number(filterValue); case 'gte': return Number(cellValue) >= Number(filterValue); case 'lt': return Number(cellValue) < Number(filterValue); case 'lte': return Number(cellValue) <= Number(filterValue); case 'range': const numValue = Number(cellValue); return numValue >= Number(filterValue) && numValue <= Number(filter.value2); case 'in': return Array.isArray(filterValue) && filterValue.includes(cellValue); case 'notIn': return Array.isArray(filterValue) && !filterValue.includes(cellValue); default: return true; } }); } // Column resizing methods startColumnResize = (event: MouseEvent, columnKey: string): void => { event.preventDefault(); event.stopPropagation(); this.columnResizeState = { resizing: true, columnKey, startX: event.clientX, startWidth: this.getColumnWidth(columnKey) }; document.addEventListener('mousemove', this.onColumnResize); document.addEventListener('mouseup', this.onColumnResizeEnd); }; private onColumnResize = (event: MouseEvent): void => { if (!this.columnResizeState.resizing) return; const deltaX = event.clientX - this.columnResizeState.startX; const newWidth = Math.max(50, this.columnResizeState.startWidth + deltaX); const widths = {...this.columnWidths()}; widths[this.columnResizeState.columnKey] = newWidth; this.columnWidths.set(widths); }; private onColumnResizeEnd = (): void => { if (this.columnResizeState.resizing) { this.columnResize.emit({ column: this.columnResizeState.columnKey, width: this.getColumnWidth(this.columnResizeState.columnKey), columnWidths: this.columnWidths() }); } this.columnResizeState.resizing = false; document.removeEventListener('mousemove', this.onColumnResize); document.removeEventListener('mouseup', this.onColumnResizeEnd); }; autoSizeColumn(columnKey: string): void { // Simple auto-sizing logic - could be enhanced to measure content const column = this.columns.find(c => c.key === columnKey); if (column) { const defaultWidth = Math.max(column.label.length * 8 + 40, 100); const widths = {...this.columnWidths()}; widths[columnKey] = defaultWidth; this.columnWidths.set(widths); } } // Column reordering methods startColumnReorder = (event: MouseEvent, columnIndex: number): void => { if (!this.visibleColumns()[columnIndex]?.draggable) return; event.preventDefault(); this.columnReorderState = { dragging: true, draggedIndex: columnIndex, draggedColumn: this.visibleColumns()[columnIndex], ghostX: event.clientX, ghostY: event.clientY }; document.addEventListener('mousemove', this.onColumnReorderMove); document.addEventListener('mouseup', this.onColumnReorderEnd); }; private onColumnReorderMove = (event: MouseEvent): void => { if (!this.columnReorderState.dragging) return; this.columnReorderState.ghostX = event.clientX; this.columnReorderState.ghostY = event.clientY; }; private onColumnReorderEnd = (event: MouseEvent): void => { if (!this.columnReorderState.dragging) return; // Find drop target const element = document.elementFromPoint(event.clientX, event.clientY); const headerCell = element?.closest('.ui-enhanced-table__header-cell'); if (headerCell) { const targetColumn = headerCell.getAttribute('data-column'); const targetIndex = this.visibleColumns().findIndex(c => c.key === targetColumn); if (targetIndex >= 0 && targetIndex !== this.columnReorderState.draggedIndex) { const newOrder = [...this.columnOrder()]; const draggedKey = this.columnReorderState.draggedColumn!.key; // Remove dragged item and insert at new position const currentIndex = newOrder.indexOf(draggedKey); if (currentIndex >= 0) { newOrder.splice(currentIndex, 1); } newOrder.splice(targetIndex, 0, draggedKey); this.columnOrder.set(newOrder); this.columnReorder.emit({ fromIndex: this.columnReorderState.draggedIndex, toIndex: targetIndex, columnOrder: newOrder }); } } this.columnReorderState.dragging = false; document.removeEventListener('mousemove', this.onColumnReorderMove); document.removeEventListener('mouseup', this.onColumnReorderEnd); }; // Utility methods handleRowClick(row: any, index: number): void { if (this.selectable) { this.toggleRowSelection(row); } this.rowClick.emit({ row, index }); } toggleRowSelection(row: any): void { if (this.selectedRows.has(row)) { this.selectedRows.delete(row); } else { this.selectedRows.add(row); } this.selectionChange.emit(Array.from(this.selectedRows)); } getCellValue(row: any, key: string): any { return key.split('.').reduce((obj, prop) => obj?.[prop], row) ?? ''; } getCellTemplate(columnKey: string): TemplateRef | null { return this.cellTemplates[columnKey] || null; } @HostListener('window:resize') onWindowResize(): void { if (this.virtualScrolling.enabled) { setTimeout(() => this.calculateVirtualScrolling(), 0); } } }sxB xVMlEV8Nu&/:T%QiS5B]gw4JMD!TBP@E\HH.)HT q񮽛!}fZS5mJ tZcng:W%Zp^U "W%@Kx&; بa:9K-w-REF!$ tmWTUƢ B+S.7,{<<\qOnG7c+2FKx3O`٨ %fz e!Ahk+(WuS*W=)cbT,JfeI*1F,oK˼\e!lUjmKo~qfȎ|+HZ`YO˲RikA1kJR y:w`Ln,Zq kB΢nxRt!\.xT+HJY*04 K*<=>rQ|;g8Z4^wɡ> p6vH'k/~AOMa~2Iɓtbp`#5_k*ty ޯ;6^f8`4d4)i!knO3KpƧF st mkg3*rD @for (action of visibleActions; track action.id) { } @if (hasMoreActions) {
    @if (dropdownOpen) { }
    } `, styleUrl: './table-actions.component.scss' }) export class TableActionsComponent { @Input() actions: TableAction[] = []; @Input() size: ActionSize = 'medium'; @Input() maxVisibleActions: number = 3; @Input() showLabels: boolean = false; @Input() compact: boolean = false; @Input() data: any = null; // Row data passed to action handlers @Input() index: number = -1; // Row index @Input() class: string = ''; @Output() actionClick = new EventEmitter<{action: TableAction, data: any, index: number, event: Event}>(); dropdownOpen = false; get visibleActions(): TableAction[] { const filtered = this.actions.filter(action => !action.hidden); return filtered.slice(0, this.maxVisibleActions); } get hiddenActions(): TableAction[] { const filtered = this.actions.filter(action => !action.hidden); return filtered.slice(this.maxVisibleActions); } get hasMoreActions(): boolean { return this.hiddenActions.length > 0; } get containerClasses(): string { return [ 'ui-table-actions', `ui-table-actions--${this.size}`, this.compact ? 'ui-table-actions--compact' : '', this.showLabels ? 'ui-table-actions--with-labels' : '', this.class ].filter(Boolean).join(' '); } getActionClasses(action: TableAction): string { return [ 'ui-table-action', `ui-table-action--${action.variant}`, action.disabled ? 'ui-table-action--disabled' : '', ].filter(Boolean).join(' '); } getMoreButtonClasses(): string { return [ `ui-table-action--${this.size}`, this.dropdownOpen ? 'ui-table-action--active' : '' ].filter(Boolean).join(' '); } handleActionClick(action: TableAction, event: Event): void { if (action.disabled) { return; } // Close dropdown if it's open this.dropdownOpen = false; // Handle confirmation if required if (action.confirmMessage) { if (!confirm(action.confirmMessage)) { return; } } this.actionClick.emit({ action, data: this.data, index: this.index, event }); } toggleDropdown(): void { this.dropdownOpen = !this.dropdownOpen; if (this.dropdownOpen) { // Close dropdown when clicking outside setTimeout(() => { const handleClickOutside = (event: Event) => { const target = event.target as Element; if (!target.closest('.ui-table-actions__dropdown')) { this.dropdownOpen = false; document.removeEventListener('click', handleClickOutside); } }; document.addEventListener('click', handleClickOutside); }); } } }4lkx|@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; // Modern table component using design tokens .ui-table-container { position: relative; width: 100%; overflow: auto; background: hsl(286, 20%, 99%); // Surface color border-radius: 0.5rem; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); // Sticky header container &--sticky-header { max-height: 400px; .ui-table__header { position: sticky; top: 0; z-index: 10; background: hsl(285, 9%, 87%); // Surface dim } } // Max height container &--max-height { max-height: var(--ui-table-max-height, 500px); } // Loading state &--loading { pointer-events: none; } } .ui-table { width: 100%; border-collapse: separate; border-spacing: 0; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; position: relative; // Subtle noise texture for modern brutalist feel &::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml;utf8,'); pointer-events: none; mix-blend-mode: overlay; border-radius: inherit; z-index: 1; } // Size variants &--compact { .ui-table__header-cell, .ui-table__body-cell { padding: 0.5rem 0.75rem; font-size: 0.875rem; } } &--default { .ui-table__header-cell, .ui-table__body-cell { padding: 0.75rem 1rem; font-size: 0.875rem; } } &--comfortable { .ui-table__header-cell, .ui-table__body-cell { padding: 1rem 1.25rem; font-size: 1rem; } } // Style variants &--bordered { border: 1px solid hsl(289, 14%, 80%); .ui-table__header-cell, .ui-table__body-cell { border-right: 1px solid hsl(289, 14%, 80%); &:last-child { border-right: none; } } .ui-table__body-row { border-bottom: 1px solid hsl(289, 14%, 80%); } } &--minimal { .ui-table__header { border-bottom: 2px solid hsl(258, 100%, 47%); } .ui-table__body-row { border-bottom: none; &:not(:last-child) { border-bottom: 1px solid hsl(289, 14%, 90%); } } } // Hover effects &--hoverable { .ui-table__body-row { transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1); cursor: pointer; &:hover { background: hsl(289, 14%, 96%); position: relative; z-index: 2; } } } // Selection &--selectable { .ui-table__body-row { cursor: pointer; &--selected { background: hsl(263, 100%, 95%); border-left: 3px solid hsl(258, 100%, 47%); } } } } // Header styles .ui-table__header { background: hsl(285, 9%, 87%); border-bottom: 2px solid hsl(287, 12%, 59%); position: relative; z-index: 5; } .ui-table__header-row { // No additional styles needed } .ui-table__header-cell { text-align: left; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: hsl(279, 14%, 11%); position: relative; white-space: nowrap; user-select: none; // Alignment variants &--left { text-align: left; } &--center { text-align: center; } &--right { text-align: right; } // Sortable headers &--sortable { cursor: pointer; transition: background-color 150ms ease; &:hover { background: hsl(285, 9%, 82%); } &--sorted { color: hsl(258, 100%, 47%); background: hsl(263, 100%, 95%); } } // Sticky columns &--sticky { position: sticky; left: 0; background: inherit; z-index: 6; box-shadow: 2px 0 4px rgba(0, 0, 0, 0.1); } } .ui-table__header-content { display: flex; align-items: center; gap: 0.5rem; min-height: 1.5rem; } .ui-table__header-text { flex: 1; } .ui-table__sort-indicator { font-size: 0.875rem; color: hsl(258, 100%, 47%); font-weight: bold; opacity: 0.8; &[data-direction="asc"] { opacity: 1; } &[data-direction="desc"] { opacity: 1; } } // Body styles .ui-table__body { position: relative; z-index: 2; } .ui-table__body-row { transition: all 150ms cubic-bezier(0, 0, 0.2, 1); border-bottom: 1px solid hsl(289, 14%, 90%); &:last-child { border-bottom: none; } // Striped variant &--striped { background: hsl(289, 14%, 98%); } // Selection state &--selected { background: hsl(263, 100%, 95%); box-shadow: inset 3px 0 0 hsl(258, 100%, 47%); } } .ui-table__body-cell { color: hsl(279, 14%, 11%); font-weight: 400; line-height: 1.5; position: relative; // Alignment variants &--left { text-align: left; } &--center { text-align: center; } &--right { text-align: right; } // Sticky columns &--sticky { position: sticky; left: 0; background: inherit; z-index: 3; box-shadow: 2px 0 4px rgba(0, 0, 0, 0.05); .ui-table__body-row:hover & { background: hsl(289, 14%, 96%); } .ui-table__body-row--selected & { background: hsl(263, 100%, 95%); } .ui-table__body-row--striped & { background: hsl(289, 14%, 98%); } } } .ui-table__cell-content { display: block; width: 100%; word-break: break-word; } // Empty state .ui-table__empty-row { background: transparent; &:hover { background: transparent !important; } } .ui-table__empty-cell { padding: 3rem 1rem; text-align: center; border-bottom: none; } .ui-table__empty-content { display: flex; flex-direction: column; align-items: center; gap: 1rem; } .ui-table__empty-text { color: hsl(287, 12%, 47%); font-size: 1rem; font-weight: 500; } // Loading overlay .ui-table__loading-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.9); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; z-index: 20; backdrop-filter: blur(2px); } .ui-table__loading-spinner { width: 2rem; height: 2rem; border: 3px solid hsl(289, 14%, 80%); border-top: 3px solid hsl(258, 100%, 47%); border-radius: 50%; animation: spin 1s linear infinite; } .ui-table__loading-text { color: hsl(287, 12%, 47%); font-size: 0.875rem; font-weight: 500; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } // Responsive design @media (max-width: 768px) { .ui-table-container { border-radius: 0; margin: 0 -1rem; } .ui-table { &--compact { .ui-table__header-cell, .ui-table__body-cell { padding: 0.375rem 0.5rem; font-size: 0.8125rem; } } &--default { .ui-table__header-cell, .ui-table__body-cell { padding: 0.5rem 0.625rem; font-size: 0.8125rem; } } } .ui-table__header-cell, .ui-table__body-cell { &:first-child { padding-left: 1rem; } &:last-child { padding-right: 1rem; } } } // Focus management .ui-table__header-cell--sortable:focus-visible { outline: 2px solid hsl(258, 100%, 47%); outline-offset: -2px; } // Print styles @media print { .ui-table-container { box-shadow: none; border: 1px solid #000; } .ui-table { &::before { display: none; } } .ui-table__loading-overlay { display: none; } } // High contrast mode @media (prefers-contrast: high) { .ui-table { border: 2px solid; } .ui-table__header-cell, .ui-table__body-cell { border: 1px solid; } .ui-table__body-row:hover { background: highlight; color: highlighttext; } }Sxkc7A8#(5E4sF<SxK(/*QRH+UP/MKK-K+Q@ xV import { Component, Input, ChangeDetectionStrategy, ViewEncapsulation } from '@angular/core'; import { CommonModule } from '@angular/common'; export type TimelineSize = 'sm' | 'md' | 'lg'; export type TimelineVariant = 'primary' | 'secondary' | 'success'; export type TimelineOrientation = 'vertical' | 'horizontal'; export type TimelineItemStatus = 'pending' | 'active' | 'completed' | 'error'; export interface TimelineItem { id: string; title: string; description?: string; timestamp?: string; status: TimelineItemStatus; } @Component({ selector: 'ui-timeline', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @for (item of items; track item.id) {
    @if (item.title) {
    {{ item.title }}
    } @if (item.description) {
    {{ item.description }}
    } @if (item.timestamp) {
    {{ item.timestamp }}
    }
    }
    `, styleUrl: './timeline.component.scss' }) export class TimelineComponent { @Input() items: TimelineItem[] = []; @Input() size: TimelineSize = 'md'; @Input() variant: TimelineVariant = 'primary'; @Input() orientation: TimelineOrientation = 'vertical'; @Input() ariaLabel?: string; getComponentClasses(): string { const classes = [ 'ui-timeline', `ui-timeline--${this.size}`, `ui-timeline--${this.variant}`, `ui-timeline--${this.orientation}` ]; return classes.join(' '); } getItemClasses(item: TimelineItem): string { const classes = [ 'ui-timeline__item', `ui-timeline__item--${item.status}` ]; return classes.join(' '); } getItemAriaLabel(item: TimelineItem): string { const status = this.getStatusLabel(item.status); const title = item.title || 'Timeline item'; const timestamp = item.timestamp ? `, ${item.timestamp}` : ''; return `${title}, ${status}${timestamp}`; } private getStatusLabel(status: TimelineItemStatus): string { switch (status) { case 'completed': return 'completed'; case 'active': return 'in progress'; case 'pending': return 'pending'; case 'error': return 'error'; default: return status; } } }Ta dx&Cl/s^inIfnjNf^nuuqfUjmmĥ9J2Jl2SJK2|dU棆3KRsA@^1PYi1X3#K,fV@&%Jx$export * from './tooltip.component';X Ӹx7@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-tooltip-wrapper { position: relative; display: inline-block; } .ui-tooltip-trigger { display: inherit; width: inherit; height: inherit; } .ui-tooltip { position: absolute; z-index: $semantic-z-index-tooltip; background: $semantic-color-surface-elevated; border: $semantic-border-width-1 solid $semantic-color-border-subtle; border-radius: $semantic-border-radius-md; box-shadow: $semantic-shadow-elevation-3; pointer-events: none; opacity: 1; transform: scale(1); animation: tooltip-fade-in $semantic-motion-duration-fast $semantic-easing-standard; // Size variants &--sm { max-width: 200px; .ui-tooltip__content { padding: $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; } } &--md { max-width: 250px; .ui-tooltip__content { padding: $semantic-spacing-component-sm; font-size: $semantic-typography-font-size-sm; } } &--lg { max-width: 300px; .ui-tooltip__content { padding: $semantic-spacing-component-md; font-size: $semantic-typography-font-size-sm; } } // Position variants &--top { bottom: 100%; left: 50%; transform: translateX(-50%) translateY(-8px); margin-bottom: $semantic-spacing-component-xs; .ui-tooltip__arrow { top: 100%; left: 50%; transform: translateX(-50%); border-top-color: $semantic-color-surface-elevated; border-bottom: none; } } &--bottom { top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); margin-top: $semantic-spacing-component-xs; .ui-tooltip__arrow { bottom: 100%; left: 50%; transform: translateX(-50%); border-bottom-color: $semantic-color-surface-elevated; border-top: none; } } &--left { right: 100%; top: 50%; transform: translateY(-50%) translateX(-8px); margin-right: $semantic-spacing-component-xs; .ui-tooltip__arrow { left: 100%; top: 50%; transform: translateY(-50%); border-left-color: $semantic-color-surface-elevated; border-right: none; } } &--right { left: 100%; top: 50%; transform: translateY(-50%) translateX(8px); margin-left: $semantic-spacing-component-xs; .ui-tooltip__arrow { right: 100%; top: 50%; transform: translateY(-50%); border-right-color: $semantic-color-surface-elevated; border-left: none; } } &__content { color: $semantic-color-text-primary; line-height: 1.4; word-wrap: break-word; text-align: center; } &__arrow { position: absolute; width: 0; height: 0; border: 6px solid transparent; // Default arrow styling border-top: 6px solid $semantic-color-surface-elevated; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)); } // Dark mode support :host-context(.dark-theme) & { background: $semantic-color-surface-secondary; border-color: $semantic-color-border-primary; .ui-tooltip__content { color: $semantic-color-text-primary; } .ui-tooltip__arrow { border-top-color: $semantic-color-surface-secondary; &::after { border-top-color: $semantic-color-surface-secondary; } } &--bottom .ui-tooltip__arrow { border-bottom-color: $semantic-color-surface-secondary; border-top: none; } &--left .ui-tooltip__arrow { border-left-color: $semantic-color-surface-secondary; border-right: none; } &--right .ui-tooltip__arrow { border-right-color: $semantic-color-surface-secondary; border-left: none; } } // Responsive adjustments @media (max-width: $semantic-breakpoint-sm - 1) { &--sm { max-width: 150px; } &--md { max-width: 200px; } &--lg { max-width: 250px; } .ui-tooltip__content { padding: $semantic-spacing-component-xs; font-size: $semantic-typography-font-size-xs; } } } // Animation keyframes @keyframes tooltip-fade-in { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }L6}Vx;xPqgqFbQjniFQex import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, OnDestroy, ElementRef, ViewChild, signal } from '@angular/core'; import { CommonModule } from '@angular/common'; type TooltipPosition = 'top' | 'bottom' | 'left' | 'right'; type TooltipTrigger = 'hover' | 'click' | 'focus'; type TooltipSize = 'sm' | 'md' | 'lg'; @Component({ selector: 'ui-tooltip', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (isVisible()) {
    {{ text }}
    }
    `, styleUrl: './tooltip.component.scss' }) export class TooltipComponent implements OnDestroy { @ViewChild('tooltipElement') tooltipElement?: ElementRef; @Input() text = ''; @Input() position: TooltipPosition = 'top'; @Input() trigger: TooltipTrigger = 'hover'; @Input() size: TooltipSize = 'md'; @Input() disabled = false; @Input() delay = 500; @Output() tooltipShow = new EventEmitter(); @Output() tooltipHide = new EventEmitter(); protected isVisible = signal(false); private showTimeout?: number; private hideTimeout?: number; ngOnDestroy(): void { this.clearTimeouts(); } handleMouseEnter(): void { if (this.trigger === 'hover' && !this.disabled) { this.scheduleShow(); } } handleMouseLeave(): void { if (this.trigger === 'hover') { this.scheduleHide(); } } handleClick(event: MouseEvent): void { if (this.trigger === 'click' && !this.disabled) { event.preventDefault(); this.toggle(); } } handleFocus(): void { if (this.trigger === 'focus' && !this.disabled) { this.show(); } } handleBlur(): void { if (this.trigger === 'focus') { this.hide(); } } private scheduleShow(): void { this.clearTimeouts(); this.showTimeout = window.setTimeout(() => { this.show(); }, this.delay); } private scheduleHide(): void { this.clearTimeouts(); this.hideTimeout = window.setTimeout(() => { this.hide(); }, 100); } private show(): void { if (!this.disabled && !this.isVisible()) { this.isVisible.set(true); this.tooltipShow.emit(); } } private hide(): void { if (this.isVisible()) { this.isVisible.set(false); this.tooltipHide.emit(); } } private toggle(): void { if (this.isVisible()) { this.hide(); } else { this.show(); } } private clearTimeouts(): void { if (this.showTimeout) { clearTimeout(this.showTimeout); this.showTimeout = undefined; } if (this.hideTimeout) { clearTimeout(this.hideTimeout); this.hideTimeout = undefined; } } }Y0xxH qTB$ Pܓv af\6 κx*export * from './transfer-list.component';@- xTPimport { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation, signal, computed } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { faChevronRight, faChevronLeft, faAnglesRight, faAnglesLeft, faSearch, faTimes } from '@fortawesome/free-solid-svg-icons'; export interface TransferListItem { id: string | number; label: string; disabled?: boolean; data?: any; } export type TransferListSize = 'sm' | 'md' | 'lg'; @Component({ selector: 'ui-transfer-list', standalone: true, imports: [CommonModule, FormsModule, FontAwesomeModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `

    {{ sourceTitle }}

    @if (showSearch) {
    @if (sourceSearchTerm()) { }
    } @if (showSelectAll) { }
    @if (filteredSourceItems().length === 0) {
    @if (sourceSearchTerm()) { No items match your search } @else { No items available }
    } @else { @for (item of filteredSourceItems(); track item.id) {
    @if (showCheckboxes) { } {{ item.label }}
    } }
    {{ getSourceSelectedCount() }} of {{ filteredSourceItems().length }} selected
    @if (showMoveAll) { } @if (showMoveAll) { }

    {{ targetTitle }}

    @if (showSearch) {
    @if (targetSearchTerm()) { }
    } @if (showSelectAll) { }
    @if (filteredTargetItems().length === 0) {
    @if (targetSearchTerm()) { No items match your search } @else { No items selected }
    } @else { @for (item of filteredTargetItems(); track item.id) {
    @if (showCheckboxes) { } {{ item.label }}
    } }
    {{ getTargetSelectedCount() }} of {{ filteredTargetItems().length }} selected
    `, styleUrl: './transfer-list.component.scss' }) export class TransferListComponent { // FontAwesome icons faChevronRight = faChevronRight; faChevronLeft = faChevronLeft; faAnglesRight = faAnglesRight; faAnglesLeft = faAnglesLeft; faSearch = faSearch; faTimes = faTimes; // Component inputs @Input() sourceItems: TransferListItem[] = []; @Input() targetItems: TransferListItem[] = []; @Input() sourceTitle = 'Available'; @Input() targetTitle = 'Selected'; @Input() size: TransferListSize = 'md'; @Input() disabled = false; @Input() showSearch = true; @Input() showSelectAll = true; @Input() showCheckboxes = true; @Input() showMoveAll = true; @Input() searchPlaceholder = 'Search items...'; @Input() ariaLabel?: string; // Component outputs @Output() sourceChange = new EventEmitter(); @Output() targetChange = new EventEmitter(); @Output() itemMove = new EventEmitter<{ item: TransferListItem; from: 'source' | 'target'; to: 'source' | 'target'; }>(); // Internal signals for reactive state management private sourceItemsSignal = signal([]); private targetItemsSignal = signal([]); private selectedSourceIds = signal>(new Set()); private selectedTargetIds = signal>(new Set()); // Search terms sourceSearchTerm = signal(''); targetSearchTerm = signal(''); // Computed filtered items filteredSourceItems = computed(() => { const items = this.sourceItemsSignal(); const searchTerm = this.sourceSearchTerm().toLowerCase().trim(); if (!searchTerm) return items; return items.filter(item => item.label.toLowerCase().includes(searchTerm) ); }); filteredTargetItems = computed(() => { const items = this.targetItemsSignal(); const searchTerm = this.targetSearchTerm().toLowerCase().trim(); if (!searchTerm) return items; return items.filter(item => item.label.toLowerCase().includes(searchTerm) ); }); // Computed selected items selectedSourceItems = computed(() => { const selectedIds = this.selectedSourceIds(); return this.sourceItemsSignal().filter(item => selectedIds.has(item.id)); }); selectedTargetItems = computed(() => { const selectedIds = this.selectedTargetIds(); return this.targetItemsSignal().filter(item => selectedIds.has(item.id)); }); ngOnInit() { this.sourceItemsSignal.set([...this.sourceItems]); this.targetItemsSignal.set([...this.targetItems]); } ngOnChanges() { this.sourceItemsSignal.set([...this.sourceItems]); this.targetItemsSignal.set([...this.targetItems]); } // Search methods updateSourceSearch() { // Clear selection when searching to avoid confusion this.selectedSourceIds.set(new Set()); } updateTargetSearch() { // Clear selection when searching to avoid confusion this.selectedTargetIds.set(new Set()); } clearSourceSearch() { this.sourceSearchTerm.set(''); this.selectedSourceIds.set(new Set()); } clearTargetSearch() { this.targetSearchTerm.set(''); this.selectedTargetIds.set(new Set()); } // Selection methods isSourceItemSelected(id: string | number): boolean { return this.selectedSourceIds().has(id); } isTargetItemSelected(id: string | number): boolean { return this.selectedTargetIds().has(id); } toggleSourceItem(item: TransferListItem) { if (this.disabled || item.disabled) return; const currentSelected = new Set(this.selectedSourceIds()); if (currentSelected.has(item.id)) { currentSelected.delete(item.id); } else { currentSelected.add(item.id); } this.selectedSourceIds.set(currentSelected); } toggleTargetItem(item: TransferListItem) { if (this.disabled || item.disabled) return; const currentSelected = new Set(this.selectedTargetIds()); if (currentSelected.has(item.id)) { currentSelected.delete(item.id); } else { currentSelected.add(item.id); } this.selectedTargetIds.set(currentSelected); } // Select all methods getSourceSelectedCount(): number { return this.selectedSourceIds().size; } getTargetSelectedCount(): number { return this.selectedTargetIds().size; } isAllSourceSelected(): boolean { const availableItems = this.filteredSourceItems().filter(item => !item.disabled); return availableItems.length > 0 && availableItems.every(item => this.selectedSourceIds().has(item.id)); } isAllTargetSelected(): boolean { const availableItems = this.filteredTargetItems().filter(item => !item.disabled); return availableItems.length > 0 && availableItems.every(item => this.selectedTargetIds().has(item.id)); } isSourceIndeterminate(): boolean { const availableItems = this.filteredSourceItems().filter(item => !item.disabled); const selectedCount = availableItems.filter(item => this.selectedSourceIds().has(item.id)).length; return selectedCount > 0 && selectedCount < availableItems.length; } isTargetIndeterminate(): boolean { const availableItems = this.filteredTargetItems().filter(item => !item.disabled); const selectedCount = availableItems.filter(item => this.selectedTargetIds().has(item.id)).length; return selectedCount > 0 && selectedCount < availableItems.length; } toggleAllSource(event: Event) { if (this.disabled) return; const target = event.target as HTMLInputElement; const availableItems = this.filteredSourceItems().filter(item => !item.disabled); if (target.checked) { const newSelected = new Set(this.selectedSourceIds()); availableItems.forEach(item => newSelected.add(item.id)); this.selectedSourceIds.set(newSelected); } else { const newSelected = new Set(this.selectedSourceIds()); availableItems.forEach(item => newSelected.delete(item.id)); this.selectedSourceIds.set(newSelected); } } toggleAllTarget(event: Event) { if (this.disabled) return; const target = event.target as HTMLInputElement; const availableItems = this.filteredTargetItems().filter(item => !item.disabled); if (target.checked) { const newSelected = new Set(this.selectedTargetIds()); availableItems.forEach(item => newSelected.add(item.id)); this.selectedTargetIds.set(newSelected); } else { const newSelected = new Set(this.selectedTargetIds()); availableItems.forEach(item => newSelected.delete(item.id)); this.selectedTargetIds.set(newSelected); } } // Transfer methods moveSelectedToTarget() { if (this.disabled) return; const itemsToMove = this.selectedSourceItems(); if (itemsToMove.length === 0) return; const newSourceItems = this.sourceItemsSignal().filter( item => !this.selectedSourceIds().has(item.id) ); const newTargetItems = [...this.targetItemsSignal(), ...itemsToMove]; this.sourceItemsSignal.set(newSourceItems); this.targetItemsSignal.set(newTargetItems); this.selectedSourceIds.set(new Set()); // Emit events this.sourceChange.emit(newSourceItems); this.targetChange.emit(newTargetItems); itemsToMove.forEach(item => { this.itemMove.emit({ item, from: 'source', to: 'target' }); }); } moveSelectedToSource() { if (this.disabled) return; const itemsToMove = this.selectedTargetItems(); if (itemsToMove.length === 0) return; const newTargetItems = this.targetItemsSignal().filter( item => !this.selectedTargetIds().has(item.id) ); const newSourceItems = [...this.sourceItemsSignal(), ...itemsToMove]; this.sourceItemsSignal.set(newSourceItems); this.targetItemsSignal.set(newTargetItems); this.selectedTargetIds.set(new Set()); // Emit events this.sourceChange.emit(newSourceItems); this.targetChange.emit(newTargetItems); itemsToMove.forEach(item => { this.itemMove.emit({ item, from: 'target', to: 'source' }); }); } moveAllToTarget() { if (this.disabled) return; const itemsToMove = this.filteredSourceItems().filter(item => !item.disabled); if (itemsToMove.length === 0) return; const newSourceItems = this.sourceItemsSignal().filter(item => item.disabled); const newTargetItems = [...this.targetItemsSignal(), ...itemsToMove]; this.sourceItemsSignal.set(newSourceItems); this.targetItemsSignal.set(newTargetItems); this.selectedSourceIds.set(new Set()); // Emit events this.sourceChange.emit(newSourceItems); this.targetChange.emit(newTargetItems); itemsToMove.forEach(item => { this.itemMove.emit({ item, from: 'source', to: 'target' }); }); } moveAllToSource() { if (this.disabled) return; const itemsToMove = this.filteredTargetItems().filter(item => !item.disabled); if (itemsToMove.length === 0) return; const newTargetItems = this.targetItemsSignal().filter(item => item.disabled); const newSourceItems = [...this.sourceItemsSignal(), ...itemsToMove]; this.sourceItemsSignal.set(newSourceItems); this.targetItemsSignal.set(newTargetItems); this.selectedTargetIds.set(new Set()); // Emit events this.sourceChange.emit(newSourceItems); this.targetChange.emit(newTargetItems); itemsToMove.forEach(item => { this.itemMove.emit({ item, from: 'target', to: 'source' }); }); } // Keyboard navigation handleSourceKeydown(event: KeyboardEvent) { this.handleListKeydown(event, this.filteredSourceItems(), 'source'); } handleTargetKeydown(event: KeyboardEvent) { this.handleListKeydown(event, this.filteredTargetItems(), 'target'); } handleItemKeydown(event: KeyboardEvent, item: TransferListItem, list: 'source' | 'target') { if (event.key === ' ' || event.key === 'Enter') { event.preventDefault(); if (list === 'source') { this.toggleSourceItem(item); } else { this.toggleTargetItem(item); } } } private handleListKeydown(event: KeyboardEvent, items: TransferListItem[], list: 'source' | 'target') { const currentFocus = document.activeElement as HTMLElement; const listItems = Array.from(currentFocus.parentElement?.querySelectorAll('.ui-transfer-list__item[tabindex="0"]') || []) as HTMLElement[]; if (listItems.length === 0) return; const currentIndex = listItems.indexOf(currentFocus); let nextIndex = currentIndex; switch (event.key) { case 'ArrowDown': event.preventDefault(); nextIndex = Math.min(currentIndex + 1, listItems.length - 1); break; case 'ArrowUp': event.preventDefault(); nextIndex = Math.max(currentIndex - 1, 0); break; case 'Home': event.preventDefault(); nextIndex = 0; break; case 'End': event.preventDefault(); nextIndex = listItems.length - 1; break; } if (nextIndex !== currentIndex) { listItems[nextIndex]?.focus(); } } }ǑxK(/*QRH+UP/)JM-L-K-K+Q `xZ]n7~)h!VZ;}#ǩ14/FZJ"Z KS=DԓtOR?I$rÙ3:td@b.e _oj/`bA q9#/ AYy-*,l5@(('xKZi{+`:tOh炕X^$-@> xBۊ,'!-g'0*-) :apb2E^9iܼ9ɁpXAp)g9)lN9-ZX``}p VKNu"W_ RHeEZ)FN\3wZ"F[ӡA$MMUM>>B7 N+:&ޔW5%$Q5 ^2 XF=qt2>|fu Í á=㎜x`R;vKX$[<zI"[~ܑ~:vX*[jX瘟_EϐZhhʺ(NѓN&1|{;+pqGH(loRɧ Rrw*gE{6Ωa4_gtz}nu4tC qS!LBM^{Ί€t"t#&[6` _-˸c> H3Xe=E[a<9u@)UBj`w Z9 Kqy9hE\ vN$2 Zm>Ӽ;4QNmhSpx灃)3(G`/ Hez7.hT Ze+9<GFƙdt7rrk;1ycv5tq~7xu!赺+|=eTEv10^v9gHIS}[Cn 3UHx}u4ct%"y!QId5<%ا:p\9>OZB-I}[*=֊*aO)"/ڞ RcZԺGl#se3)mc8?NT4պFڑ;^Q2.bKh'¯ sZMnIo ESrmG&\LȞ,0RuIgG<GWCjN iY6-x5\* 0,֊gv3@cG->*+رJz8ѷP\vLjȒu9&ȸJQ2%U,cZ;W(Aք[⛭Pl+i,U?Q}}xZҬjAdӆ\*Qg1 ױw]Yo+EGƢ,@V` dF<-ooA^iF~l˛H[+/e@& B62raw yOls^&o9%%xl& |ycY#Y@#'ۯ\Ҩ+ʉ&,됻 &`ΟDb yW4kjS:/ؘ-9'-ZSIrt i3#oPj2JXUPtE<8If+kVrhrkIVt9J̧4|`mnz9NvZ:{a[m'ZQN[瞁üRhHҐ=VtU`s(V^FKh d_O.`*XiY:~urnIsݽYX7ɔ`H]lbދn7A,|,y״,Y Zc}˱Q,3rrBB^rF;ߞ/u} EX ЂRh!vp]1v`w@´zlٔ{ B op!rX.>f:%\Aʗd:7ɓos] f'_o#ž3OI4 PXwq׭p< ţ<cl> ̇O%V2i>li:tnѾ`lLE5K$B3`+Q͚k٢.%fCeC.07GmojC6D,iUDzwWX^Y\? BǩKy{,@4 :<}˭8bJV%w.~}B3m{JRB9+ɥxȸ1[)pa֘Ib!JG̶#zE /rAt#F]?ElګlOv$Zb ?=W"ǚj)sh*)M]ٳ փ[FY`p_oi]>R`6L7m޲F8|t'?Ks4uI Jo xf:EaB "E28M̨aH09M>$ǒe:% b(q)AtrNbq^i.X:D_Cf10a0o#ÐUHfU-K$$'UW]A[,9MG "WWΦ1?&XM||&PԽ`7Dbm@B.y;= VCCKr8͡'*ؓES8;!Oas}# T(¿9? ?Uhg^AiBqfU8(A5-18u*Ę@0ւ̒7OWa0HO-;eIU*N;X 'Ȯ3xK(/*QRH+UPOI-*K-K+Q "x "#!:M;l̰񬑭S;Z1xV^:9%7!j$͋ x#@use "../../../../../../ui-design-system/src/styles/semantic/index" as *; .ui-empty-state { // Core Structure display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; position: relative; // Layout & Spacing padding: $semantic-spacing-component-lg; min-height: 200px; // Visual Design background: $semantic-color-surface-primary; border-radius: $semantic-border-card-radius; // Typography color: $semantic-color-text-secondary; // Sizing Variants &--sm { min-height: 120px; padding: $semantic-spacing-component-sm; .ui-empty-state__icon { width: $semantic-sizing-icon-inline; height: $semantic-sizing-icon-inline; margin-bottom: $semantic-spacing-content-line-tight; } .ui-empty-state__title { font-size: $base-typography-font-size-sm; margin-bottom: $semantic-spacing-content-line-tight; } .ui-empty-state__description { font-size: $base-typography-font-size-sm; margin-bottom: $semantic-spacing-content-line-normal; } } &--md { min-height: 200px; padding: $semantic-spacing-component-md; .ui-empty-state__icon { width: $semantic-sizing-icon-button; height: $semantic-sizing-icon-button; margin-bottom: $semantic-spacing-content-line-normal; } .ui-empty-state__title { font-size: $base-typography-font-size-lg; margin-bottom: $semantic-spacing-content-line-normal; } .ui-empty-state__description { font-size: $base-typography-font-size-md; margin-bottom: $semantic-spacing-content-paragraph; } } &--lg { min-height: 300px; padding: $semantic-spacing-component-lg; .ui-empty-state__icon { width: $semantic-sizing-icon-navigation; height: $semantic-sizing-icon-navigation; margin-bottom: $semantic-spacing-content-paragraph; } .ui-empty-state__title { font-size: $base-typography-font-size-xl; margin-bottom: $semantic-spacing-content-line-normal; } .ui-empty-state__description { font-size: $base-typography-font-size-lg; margin-bottom: $semantic-spacing-content-heading; } } // Variant Styles &--default { .ui-empty-state__icon { color: $semantic-color-text-tertiary; } } &--search { .ui-empty-state__icon { color: $semantic-color-primary; } .ui-empty-state__title { color: $semantic-color-text-primary; } } &--error { .ui-empty-state__icon { color: $semantic-color-error; } .ui-empty-state__title { color: $semantic-color-error; } } &--loading { .ui-empty-state__icon { color: $semantic-color-primary; } } &--success { .ui-empty-state__icon { color: $semantic-color-success; } .ui-empty-state__title { color: $semantic-color-success; } } } .ui-empty-state__icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-bottom: $semantic-spacing-content-line-normal; svg, img { width: 100%; height: 100%; object-fit: contain; } } .ui-empty-state__spinner { width: 100%; height: 100%; border: 3px solid $semantic-color-border-subtle; border-top: 3px solid $semantic-color-primary; border-radius: 50%; animation: spin $semantic-duration-medium $semantic-easing-standard infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .ui-empty-state__title { margin: 0 0 $semantic-spacing-content-line-normal 0; color: $semantic-color-text-primary; font-weight: $base-typography-font-weight-semibold; line-height: $base-typography-line-height-tight; } .ui-empty-state__description { margin: 0 0 $semantic-spacing-content-paragraph 0; color: $semantic-color-text-secondary; line-height: $base-typography-line-height-relaxed; max-width: 400px; } .ui-empty-state__content { margin-bottom: $semantic-spacing-content-paragraph; &:empty { display: none; } } .ui-empty-state__actions { display: flex; gap: $semantic-spacing-content-line-normal; justify-content: center; flex-wrap: wrap; } .ui-empty-state__action { display: inline-flex; align-items: center; justify-content: center; padding: $semantic-spacing-component-sm $semantic-spacing-component-md; // Visual Design background: $semantic-color-primary; color: $semantic-color-on-primary; border: $semantic-border-button-width solid $semantic-color-primary; border-radius: $semantic-border-button-radius; box-shadow: $semantic-shadow-button-rest; // Typography font-size: $base-typography-font-size-md; font-weight: $base-typography-font-weight-medium; text-decoration: none; // Transitions transition: all $semantic-duration-fast $semantic-easing-standard; cursor: pointer; user-select: none; // Interactive States &:not([disabled]) { &:hover { background: $semantic-color-primary; border-color: $semantic-color-primary; box-shadow: $semantic-shadow-button-hover; transform: translateY(-1px); } &:focus-visible { outline: 2px solid $semantic-color-focus; outline-offset: 2px; } &:active { background: $semantic-color-primary; border-color: $semantic-color-primary; box-shadow: $semantic-shadow-button-active; transform: translateY(0); } } &[disabled] { opacity: 0.38; cursor: not-allowed; pointer-events: none; } } // Dark Mode Support :host-context(.dark-theme) .ui-empty-state { background: $semantic-color-surface-secondary; } // Responsive Design @media (max-width: 768px) { .ui-empty-state { padding: $semantic-spacing-component-md; min-height: 160px; &--lg { min-height: 200px; } .ui-empty-state__description { max-width: 300px; } } } @media (max-width: 480px) { .ui-empty-state { padding: $semantic-spacing-component-sm; min-height: 120px; .ui-empty-state__icon { width: $semantic-sizing-icon-inline; height: $semantic-sizing-icon-inline; } .ui-empty-state__title { font-size: $base-typography-font-size-sm; } .ui-empty-state__description { font-size: $base-typography-font-size-sm; max-width: 280px; } } } // High contrast mode @media (prefers-contrast: high) { .ui-empty-state__action { border-width: 2px; font-weight: $base-typography-font-weight-bold; } } // Reduced motion @media (prefers-reduced-motion: reduce) { .ui-empty-state__spinner { animation: none; border-top-color: $semantic-color-primary; } .ui-empty-state__action { transition: none; &:hover { transform: none; } &:active { transform: none; } } }]# 1x[l6lgqFbQjniFROͼx import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy, ViewEncapsulation } from '@angular/core'; import { CommonModule } from '@angular/common'; type EmptyStateSize = 'sm' | 'md' | 'lg'; type EmptyStateVariant = 'default' | 'search' | 'error' | 'loading' | 'success'; @Component({ selector: 'ui-empty-state', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
    @if (icon || variant === 'loading') {
    @if (variant === 'loading') { } @else if (icon) { }
    } @if (title) {

    {{ title }}

    } @if (description) {

    {{ description }}

    }
    @if (actionLabel) {
    }
    `, styleUrl: './empty-state.component.scss' }) export class EmptyStateComponent { @Input() size: EmptyStateSize = 'md'; @Input() variant: EmptyStateVariant = 'default'; @Input() icon = ''; @Input() title = ''; @Input() description = ''; @Input() actionLabel = ''; @Input() disabled = false; @Input() role = 'region'; @Input() ariaLabel = 'Empty state'; @Output() action = new EventEmitter(); getComponentClasses(): string { const classes = [ 'ui-empty-state', `ui-empty-state--${this.size}`, `ui-empty-state--${this.variant}` ]; return classes.join(' '); } handleAction(event: MouseEvent): void { if (!this.disabled) { this.action.emit(event); } } }X*x#)A)D4S75R$$UW8*6V PRb,2JLY'o#x(export * from './empty-state.component';!ExmA0 )8Yڈ4liorGx3݅j'5~UÄvpF'H0. KJĜ"< TeLUף`+8CXĴQꇄ@aӵ鹣HQu>n$xsnackbar@jdk "jHx;qd'Icx* export * from "./progress-circleeL4|xJsSID